renkang/xj-screen
7
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

update 调整大屏各个模块参数及样式

Browse Source
This commit is contained in:
zk
2024-05-16 15:53:04 +08:00
parent adca7ae65e
commit 45aec85fad
12 changed files with 238 additions and 89 deletions
Download Patch File Download Diff File Expand all files Collapse all files
src/components/body-d-left/bodyLeftHooks.ts
+11 -7
View File
@@ -44,10 +44,10 @@ export function useStatistics() {
}
export const timeTab = [
{
name: '全部',
value: '1',
},
// {
// name: '全部',
// value: '1',
// },
{
name: '本年',
value: '2',
@@ -62,6 +62,10 @@ export const timeTab = [
},
];
export const sexType = [
{
name: '全部',
value: '0',
},
{
name: '男',
value: '2',
@@ -352,7 +356,7 @@ export function barOption(xData, ydata) {
*/
export function allValueEmpty(key: string, list: any[]) {
if (!Array.isArray(list)) {
return false
return false;
}
return list.every((item: any) => item?.[key] != 0)
}
return list.every((item: any) => item?.[key] != 0);
}
src/components/body-d-left/oneL.vue
+29 -11
View File
@@ -12,7 +12,13 @@
>
</div>
<div class="server-container">
<div v-for="(item, index) in statistics" :key="index" class="server-item">
<div
v-for="(item, index) in statistics"
:key="index"
class="server-item"
:class="['gross', 'alerdyreceive'].includes(item.key) ? 'hasCursor' : ''"
@click="handleClick(item)"
>
<span>{{ item?.name }}</span>
<span>{{ item?.value }}</span>
</div>
@@ -23,8 +29,8 @@
</template>
<script setup lang="ts">
import { onMounted, ref, watch } from 'vue';
import PublicTitle from '../publicTitle.vue';
import { list } from './left.api';
import PublicTitle from '/@/components/publicTitle.vue';
import { list } from '/@/components/body-d-left/left.api';
import { allValueEmpty, timeTab, useSpin, useStatistics } from '/@/components/body-d-left/bodyLeftHooks.ts';
import { useDetailStore } from '/@/store/modules/detailData.ts';
import { useSession, caching } from '/@/hooks/autoRefresh/caching.ts';
@@ -34,11 +40,15 @@
refreshState: {
type: Boolean,
},
setting: {
type: Object,
},
});
const emit = defineEmits(['handleClick']);
const typeTime = ref(timeTab);
const { statistics, setStatistics, getStatistics } = useStatistics();
const selectIndex = ref(0);
const selectVal = ref('1');
const selectVal = ref('2'); //本年
const { setSpin, spinning } = useSpin();
onMounted(() => {
@@ -51,17 +61,17 @@
async function getList() {
setSpin(true);
try {
const { code, result } = (await list({ condition: selectVal.value })) || {};
setSpin(!spinning.value);
if (code != 200 || !Array.isArray(result)) {
const { code, result } = (await list({ condition: selectVal.value, dataType: props.setting.dataType })) || {};
setSpin(false);
if (code != 200 || !result) {
return;
}
setSession(LEFT_KEY1, JSON.stringify(result[0]));
setValue(result[0]);
setSession(LEFT_KEY1, JSON.stringify(result));
setValue(result);
} catch {
setSpin(false);
const result = JSON.parse(getSession(LEFT_KEY1));
setValue(result);
setSpin(false);
}
}
@@ -80,6 +90,10 @@
getList();
}
function handleClick(item) {
emit('handleClick', item);
}
watch(
() => props.refreshState,
() => {
@@ -110,6 +124,10 @@
font-size: 16px;
padding: 6px 0;
&.hasCursor {
cursor: pointer;
}
span {
display: inline-block;
width: 50%;
@@ -131,4 +149,4 @@
}
}
}
</style>
</style>
src/components/body-d-left/threeL.vue
+8 -38
View File
@@ -6,8 +6,8 @@
<span
v-for="(item, index) in timeTab"
:key="index"
:class="selectIndex === index ? 'select' : 'unSelect'"
@click="handleSelect(index)"
:class="selectIndex === item.value ? 'select' : 'unSelect'"
@click="handleSelect(item.value)"
>{{ item.name }}</span
>
</div>
@@ -20,7 +20,7 @@
</template>
<script lang="ts" setup>
import { onMounted, ref, watch } from 'vue';
import PublicTitle from '../publicTitle.vue';
import PublicTitle from '/@/components/publicTitle.vue';
import { getDetail } from '/@/components/body-d-left/left.api';
import { useSpin, timeTab, useHospitalList, radarCharts, allValueEmpty } from '/@/components/body-d-left/bodyLeftHooks';
import { useSession, caching } from '/@/hooks/autoRefresh/caching.ts';
@@ -30,14 +30,15 @@
refreshState: {
type: Boolean,
},
setting: Object,
});
const { setSession, getSession } = useSession();
const { LEFT_KEY3 } = caching;
const { setSpin, spinning } = useSpin();
const selectIndex = ref(0);
const selectIndex = ref('2');
function handleSelect(index: number) {
selectIndex.value = index;
function handleSelect(val: string) {
selectIndex.value = val;
setSpin(true);
setTimeout(() => {
setSpin(false);
@@ -115,37 +116,6 @@
width: 100%;
height: 100%;
}
.physical-item {
width: 33%;
height: 46%;
color: #ffffff;
display: flex;
flex-direction: column;
.ct {
margin-top: -20px;
}
.value {
font-size: 20px;
font-weight: bold;
}
.label {
font-size: 14px;
}
}
.b1 {
background: url('../../assets/images/physical-top.png') no-repeat;
background-size: 95% 95%;
}
.b2 {
background: url('../../assets/images/physical-bottom.png') no-repeat;
background-size: 95% 95%;
}
}
}
</style>
</style>
src/components/body-d-left/twoL.vue
+3 -3
View File
@@ -25,7 +25,7 @@
</template>
<script setup lang="ts">
import { ref, onMounted, watch } from 'vue';
import PublicTitle from '../publicTitle.vue';
import PublicTitle from '/@/components/publicTitle.vue';
import * as echarts from 'echarts';
import { complaint, getDepart } from '/@/components/body-d-left/left.api.ts';
import { useSpin, barOption, sexType } from '/@/components/body-d-left/bodyLeftHooks.ts';
@@ -153,7 +153,7 @@
left: 0;
bottom: -12px;
height: 6px;
background: url('../../assets/images/light.png') no-repeat;
background: url('/@/assets/images/light.png') no-repeat;
background-size: 100% 100%;
}
}
@@ -225,4 +225,4 @@
.ant-select-item-option-selected:not(.ant-select-item-option-disabled) {
background-color: #002e64 !important;
}
</style>
</style>
src/components/body-d-right/oneR.vue
+15 -5
View File
@@ -43,7 +43,7 @@
</div>
<div class="con-item">
<span>发生地点：</span>
<span>{{ userInfo?.address }}</span>
<span>{{ userInfo?.address || userInfo?.gpsErrorMsg }}</span>
</div>
</div>
</template>
@@ -59,7 +59,12 @@
import { getMonitorList } from '/@/components/body-d-right/right.api.ts';
import { Map } from '/@/assets/mapUtils/map.ts';
import { caching, useSession } from '/@/hooks/autoRefresh/caching.ts';
import { DataType } from '/@/utils/settings.ts';
const props = defineProps({
setting: Object,
});
const emit = defineEmits(['emit-view-detail']);
const router = useRouter();
const { setSession, getSession } = useSession();
const { RIGHT_KEY1 } = caching;
@@ -105,7 +110,7 @@
async function getScrollList() {
try {
const { code, result } = await getMonitorList({ pageSize: 10, pageNo: 1 });
const { code, result } = await getMonitorList({ pageSize: 10, pageNo: 1, orgCode: props.setting?.orgCode });
if (code == 200) {
setSession(RIGHT_KEY1, JSON.stringify(result.records));
scrollList.value = result.records;
@@ -125,7 +130,12 @@
}
function viewDetail() {
router.push({ path: '/secondScreen' });
if (props.setting.dataType == DataType.xian) {
router.push({ path: '/secondScreen' });
}
if (props.setting.dataType == DataType.yinChuan) {
emit('emit-view-detail');
}
}
</script>
<style scoped lang="less">
@@ -222,7 +232,7 @@
<style lang="less">
.dialog-con {
background-color: #00152b;
border: 1px solid #129bff;
//border: 1px solid #129bff;
/*
antd表格样式
*/
@@ -268,4 +278,4 @@ antd表格样式
background-color: rgba(30, 115, 194, 0.3);
}
}
</style>
</style>
src/components/body-d-right/threeR.vue
+4 -4
View File
@@ -10,7 +10,7 @@
</div>
</template>
<script setup lang="ts">
import PublicTitle from '../publicTitle.vue';
import PublicTitle from '/@/components/publicTitle.vue';
</script>
<style scoped lang="less">
.inner {
@@ -37,8 +37,8 @@
position: absolute;
content: attr(data-text);
color: #fff;
bottom: 0px;
left: 0px;
bottom: 0;
left: 0;
width: 100%;
text-align: left;
padding-left: 10px;
@@ -60,4 +60,4 @@
background-size: 100% 100%;
}
}
</style>
</style>
src/components/body-d-right/twoR.vue
+2 -2
View File
@@ -7,7 +7,7 @@
<script setup lang="ts">
import { ref, unref, onMounted } from 'vue';
import * as echarts from 'echarts';
import PublicTitle from '../publicTitle.vue';
import PublicTitle from '/@/components/publicTitle.vue';
import { getHealthDataList } from '/@/components/body-d-right/right.api';
import { useSpin } from '/@/components/body-d-left/bodyLeftHooks.ts';
import { ringOption, useHealth } from '/@/components/body-d-right/bodyRightHooks.ts';
@@ -59,4 +59,4 @@
margin: 0 auto;
height: calc(100% - 40px);
}
</style>
</style>
src/components/dialog/Dialog.vue
+5 -2
View File
@@ -28,6 +28,9 @@
<style lang="less">
.dialog {
border: 1px solid #0a50a0;
background-color: #00152b;
.ant-modal-title {
position: relative;
display: flex;
@@ -68,7 +71,7 @@
}
.ant-modal-wrap {
background-color: rgba(0, 0, 0, 0.6);
//background-color: rgba(0, 0, 0, 0.6);
}
}
</style>
</style>