update 调整大屏各个模块参数及样式
This commit is contained in:
@@ -44,10 +44,10 @@ export function useStatistics() {
|
|||||||
}
|
}
|
||||||
|
|
||||||
export const timeTab = [
|
export const timeTab = [
|
||||||
{
|
// {
|
||||||
name: '全部',
|
// name: '全部',
|
||||||
value: '1',
|
// value: '1',
|
||||||
},
|
// },
|
||||||
{
|
{
|
||||||
name: '本年',
|
name: '本年',
|
||||||
value: '2',
|
value: '2',
|
||||||
@@ -62,6 +62,10 @@ export const timeTab = [
|
|||||||
},
|
},
|
||||||
];
|
];
|
||||||
export const sexType = [
|
export const sexType = [
|
||||||
|
{
|
||||||
|
name: '全部',
|
||||||
|
value: '0',
|
||||||
|
},
|
||||||
{
|
{
|
||||||
name: '男',
|
name: '男',
|
||||||
value: '2',
|
value: '2',
|
||||||
@@ -352,7 +356,7 @@ export function barOption(xData, ydata) {
|
|||||||
*/
|
*/
|
||||||
export function allValueEmpty(key: string, list: any[]) {
|
export function allValueEmpty(key: string, list: any[]) {
|
||||||
if (!Array.isArray(list)) {
|
if (!Array.isArray(list)) {
|
||||||
return false
|
return false;
|
||||||
}
|
}
|
||||||
return list.every((item: any) => item?.[key] != 0)
|
return list.every((item: any) => item?.[key] != 0);
|
||||||
}
|
}
|
||||||
@@ -12,7 +12,13 @@
|
|||||||
>
|
>
|
||||||
</div>
|
</div>
|
||||||
<div class="server-container">
|
<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?.name }}</span>
|
||||||
<span>{{ item?.value }}</span>
|
<span>{{ item?.value }}</span>
|
||||||
</div>
|
</div>
|
||||||
@@ -23,8 +29,8 @@
|
|||||||
</template>
|
</template>
|
||||||
<script setup lang="ts">
|
<script setup lang="ts">
|
||||||
import { onMounted, ref, watch } from 'vue';
|
import { onMounted, ref, watch } from 'vue';
|
||||||
import PublicTitle from '../publicTitle.vue';
|
import PublicTitle from '/@/components/publicTitle.vue';
|
||||||
import { list } from './left.api';
|
import { list } from '/@/components/body-d-left/left.api';
|
||||||
import { allValueEmpty, timeTab, useSpin, useStatistics } from '/@/components/body-d-left/bodyLeftHooks.ts';
|
import { allValueEmpty, timeTab, useSpin, useStatistics } from '/@/components/body-d-left/bodyLeftHooks.ts';
|
||||||
import { useDetailStore } from '/@/store/modules/detailData.ts';
|
import { useDetailStore } from '/@/store/modules/detailData.ts';
|
||||||
import { useSession, caching } from '/@/hooks/autoRefresh/caching.ts';
|
import { useSession, caching } from '/@/hooks/autoRefresh/caching.ts';
|
||||||
@@ -34,11 +40,15 @@
|
|||||||
refreshState: {
|
refreshState: {
|
||||||
type: Boolean,
|
type: Boolean,
|
||||||
},
|
},
|
||||||
|
setting: {
|
||||||
|
type: Object,
|
||||||
|
},
|
||||||
});
|
});
|
||||||
|
const emit = defineEmits(['handleClick']);
|
||||||
const typeTime = ref(timeTab);
|
const typeTime = ref(timeTab);
|
||||||
const { statistics, setStatistics, getStatistics } = useStatistics();
|
const { statistics, setStatistics, getStatistics } = useStatistics();
|
||||||
const selectIndex = ref(0);
|
const selectIndex = ref(0);
|
||||||
const selectVal = ref('1');
|
const selectVal = ref('2'); //本年
|
||||||
const { setSpin, spinning } = useSpin();
|
const { setSpin, spinning } = useSpin();
|
||||||
|
|
||||||
onMounted(() => {
|
onMounted(() => {
|
||||||
@@ -51,17 +61,17 @@
|
|||||||
async function getList() {
|
async function getList() {
|
||||||
setSpin(true);
|
setSpin(true);
|
||||||
try {
|
try {
|
||||||
const { code, result } = (await list({ condition: selectVal.value })) || {};
|
const { code, result } = (await list({ condition: selectVal.value, dataType: props.setting.dataType })) || {};
|
||||||
setSpin(!spinning.value);
|
setSpin(false);
|
||||||
if (code != 200 || !Array.isArray(result)) {
|
if (code != 200 || !result) {
|
||||||
return;
|
return;
|
||||||
}
|
}
|
||||||
setSession(LEFT_KEY1, JSON.stringify(result[0]));
|
setSession(LEFT_KEY1, JSON.stringify(result));
|
||||||
setValue(result[0]);
|
setValue(result);
|
||||||
} catch {
|
} catch {
|
||||||
|
setSpin(false);
|
||||||
const result = JSON.parse(getSession(LEFT_KEY1));
|
const result = JSON.parse(getSession(LEFT_KEY1));
|
||||||
setValue(result);
|
setValue(result);
|
||||||
setSpin(false);
|
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
@@ -80,6 +90,10 @@
|
|||||||
getList();
|
getList();
|
||||||
}
|
}
|
||||||
|
|
||||||
|
function handleClick(item) {
|
||||||
|
emit('handleClick', item);
|
||||||
|
}
|
||||||
|
|
||||||
watch(
|
watch(
|
||||||
() => props.refreshState,
|
() => props.refreshState,
|
||||||
() => {
|
() => {
|
||||||
@@ -110,6 +124,10 @@
|
|||||||
font-size: 16px;
|
font-size: 16px;
|
||||||
padding: 6px 0;
|
padding: 6px 0;
|
||||||
|
|
||||||
|
&.hasCursor {
|
||||||
|
cursor: pointer;
|
||||||
|
}
|
||||||
|
|
||||||
span {
|
span {
|
||||||
display: inline-block;
|
display: inline-block;
|
||||||
width: 50%;
|
width: 50%;
|
||||||
|
|||||||
@@ -6,8 +6,8 @@
|
|||||||
<span
|
<span
|
||||||
v-for="(item, index) in timeTab"
|
v-for="(item, index) in timeTab"
|
||||||
:key="index"
|
:key="index"
|
||||||
:class="selectIndex === index ? 'select' : 'unSelect'"
|
:class="selectIndex === item.value ? 'select' : 'unSelect'"
|
||||||
@click="handleSelect(index)"
|
@click="handleSelect(item.value)"
|
||||||
>{{ item.name }}</span
|
>{{ item.name }}</span
|
||||||
>
|
>
|
||||||
</div>
|
</div>
|
||||||
@@ -20,7 +20,7 @@
|
|||||||
</template>
|
</template>
|
||||||
<script lang="ts" setup>
|
<script lang="ts" setup>
|
||||||
import { onMounted, ref, watch } from 'vue';
|
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 { getDetail } from '/@/components/body-d-left/left.api';
|
||||||
import { useSpin, timeTab, useHospitalList, radarCharts, allValueEmpty } from '/@/components/body-d-left/bodyLeftHooks';
|
import { useSpin, timeTab, useHospitalList, radarCharts, allValueEmpty } from '/@/components/body-d-left/bodyLeftHooks';
|
||||||
import { useSession, caching } from '/@/hooks/autoRefresh/caching.ts';
|
import { useSession, caching } from '/@/hooks/autoRefresh/caching.ts';
|
||||||
@@ -30,14 +30,15 @@
|
|||||||
refreshState: {
|
refreshState: {
|
||||||
type: Boolean,
|
type: Boolean,
|
||||||
},
|
},
|
||||||
|
setting: Object,
|
||||||
});
|
});
|
||||||
const { setSession, getSession } = useSession();
|
const { setSession, getSession } = useSession();
|
||||||
const { LEFT_KEY3 } = caching;
|
const { LEFT_KEY3 } = caching;
|
||||||
const { setSpin, spinning } = useSpin();
|
const { setSpin, spinning } = useSpin();
|
||||||
const selectIndex = ref(0);
|
const selectIndex = ref('2');
|
||||||
|
|
||||||
function handleSelect(index: number) {
|
function handleSelect(val: string) {
|
||||||
selectIndex.value = index;
|
selectIndex.value = val;
|
||||||
setSpin(true);
|
setSpin(true);
|
||||||
setTimeout(() => {
|
setTimeout(() => {
|
||||||
setSpin(false);
|
setSpin(false);
|
||||||
@@ -115,37 +116,6 @@
|
|||||||
width: 100%;
|
width: 100%;
|
||||||
height: 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>
|
||||||
@@ -25,7 +25,7 @@
|
|||||||
</template>
|
</template>
|
||||||
<script setup lang="ts">
|
<script setup lang="ts">
|
||||||
import { ref, onMounted, watch } from 'vue';
|
import { ref, onMounted, watch } from 'vue';
|
||||||
import PublicTitle from '../publicTitle.vue';
|
import PublicTitle from '/@/components/publicTitle.vue';
|
||||||
import * as echarts from 'echarts';
|
import * as echarts from 'echarts';
|
||||||
import { complaint, getDepart } from '/@/components/body-d-left/left.api.ts';
|
import { complaint, getDepart } from '/@/components/body-d-left/left.api.ts';
|
||||||
import { useSpin, barOption, sexType } from '/@/components/body-d-left/bodyLeftHooks.ts';
|
import { useSpin, barOption, sexType } from '/@/components/body-d-left/bodyLeftHooks.ts';
|
||||||
@@ -153,7 +153,7 @@
|
|||||||
left: 0;
|
left: 0;
|
||||||
bottom: -12px;
|
bottom: -12px;
|
||||||
height: 6px;
|
height: 6px;
|
||||||
background: url('../../assets/images/light.png') no-repeat;
|
background: url('/@/assets/images/light.png') no-repeat;
|
||||||
background-size: 100% 100%;
|
background-size: 100% 100%;
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|||||||
@@ -43,7 +43,7 @@
|
|||||||
</div>
|
</div>
|
||||||
<div class="con-item">
|
<div class="con-item">
|
||||||
<span>发生地点:</span>
|
<span>发生地点:</span>
|
||||||
<span>{{ userInfo?.address }}</span>
|
<span>{{ userInfo?.address || userInfo?.gpsErrorMsg }}</span>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</template>
|
</template>
|
||||||
@@ -59,7 +59,12 @@
|
|||||||
import { getMonitorList } from '/@/components/body-d-right/right.api.ts';
|
import { getMonitorList } from '/@/components/body-d-right/right.api.ts';
|
||||||
import { Map } from '/@/assets/mapUtils/map.ts';
|
import { Map } from '/@/assets/mapUtils/map.ts';
|
||||||
import { caching, useSession } from '/@/hooks/autoRefresh/caching.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 router = useRouter();
|
||||||
const { setSession, getSession } = useSession();
|
const { setSession, getSession } = useSession();
|
||||||
const { RIGHT_KEY1 } = caching;
|
const { RIGHT_KEY1 } = caching;
|
||||||
@@ -105,7 +110,7 @@
|
|||||||
|
|
||||||
async function getScrollList() {
|
async function getScrollList() {
|
||||||
try {
|
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) {
|
if (code == 200) {
|
||||||
setSession(RIGHT_KEY1, JSON.stringify(result.records));
|
setSession(RIGHT_KEY1, JSON.stringify(result.records));
|
||||||
scrollList.value = result.records;
|
scrollList.value = result.records;
|
||||||
@@ -125,8 +130,13 @@
|
|||||||
}
|
}
|
||||||
|
|
||||||
function viewDetail() {
|
function viewDetail() {
|
||||||
|
if (props.setting.dataType == DataType.xian) {
|
||||||
router.push({ path: '/secondScreen' });
|
router.push({ path: '/secondScreen' });
|
||||||
}
|
}
|
||||||
|
if (props.setting.dataType == DataType.yinChuan) {
|
||||||
|
emit('emit-view-detail');
|
||||||
|
}
|
||||||
|
}
|
||||||
</script>
|
</script>
|
||||||
<style scoped lang="less">
|
<style scoped lang="less">
|
||||||
.right-text {
|
.right-text {
|
||||||
@@ -222,7 +232,7 @@
|
|||||||
<style lang="less">
|
<style lang="less">
|
||||||
.dialog-con {
|
.dialog-con {
|
||||||
background-color: #00152b;
|
background-color: #00152b;
|
||||||
border: 1px solid #129bff;
|
//border: 1px solid #129bff;
|
||||||
/*
|
/*
|
||||||
antd表格样式
|
antd表格样式
|
||||||
*/
|
*/
|
||||||
|
|||||||
@@ -10,7 +10,7 @@
|
|||||||
</div>
|
</div>
|
||||||
</template>
|
</template>
|
||||||
<script setup lang="ts">
|
<script setup lang="ts">
|
||||||
import PublicTitle from '../publicTitle.vue';
|
import PublicTitle from '/@/components/publicTitle.vue';
|
||||||
</script>
|
</script>
|
||||||
<style scoped lang="less">
|
<style scoped lang="less">
|
||||||
.inner {
|
.inner {
|
||||||
@@ -37,8 +37,8 @@
|
|||||||
position: absolute;
|
position: absolute;
|
||||||
content: attr(data-text);
|
content: attr(data-text);
|
||||||
color: #fff;
|
color: #fff;
|
||||||
bottom: 0px;
|
bottom: 0;
|
||||||
left: 0px;
|
left: 0;
|
||||||
width: 100%;
|
width: 100%;
|
||||||
text-align: left;
|
text-align: left;
|
||||||
padding-left: 10px;
|
padding-left: 10px;
|
||||||
|
|||||||
@@ -7,7 +7,7 @@
|
|||||||
<script setup lang="ts">
|
<script setup lang="ts">
|
||||||
import { ref, unref, onMounted } from 'vue';
|
import { ref, unref, onMounted } from 'vue';
|
||||||
import * as echarts from 'echarts';
|
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 { getHealthDataList } from '/@/components/body-d-right/right.api';
|
||||||
import { useSpin } from '/@/components/body-d-left/bodyLeftHooks.ts';
|
import { useSpin } from '/@/components/body-d-left/bodyLeftHooks.ts';
|
||||||
import { ringOption, useHealth } from '/@/components/body-d-right/bodyRightHooks.ts';
|
import { ringOption, useHealth } from '/@/components/body-d-right/bodyRightHooks.ts';
|
||||||
|
|||||||
@@ -28,6 +28,9 @@
|
|||||||
|
|
||||||
<style lang="less">
|
<style lang="less">
|
||||||
.dialog {
|
.dialog {
|
||||||
|
border: 1px solid #0a50a0;
|
||||||
|
background-color: #00152b;
|
||||||
|
|
||||||
.ant-modal-title {
|
.ant-modal-title {
|
||||||
position: relative;
|
position: relative;
|
||||||
display: flex;
|
display: flex;
|
||||||
@@ -68,7 +71,7 @@
|
|||||||
}
|
}
|
||||||
|
|
||||||
.ant-modal-wrap {
|
.ant-modal-wrap {
|
||||||
background-color: rgba(0, 0, 0, 0.6);
|
//background-color: rgba(0, 0, 0, 0.6);
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
</style>
|
</style>
|
||||||
@@ -45,7 +45,7 @@
|
|||||||
.police-con {
|
.police-con {
|
||||||
color: #ffffff;
|
color: #ffffff;
|
||||||
background-color: #00152b;
|
background-color: #00152b;
|
||||||
border: 1px solid #129bff;
|
//border: 1px solid #129bff;
|
||||||
padding: 2% 0 2% 5%;
|
padding: 2% 0 2% 5%;
|
||||||
|
|
||||||
.sub-text {
|
.sub-text {
|
||||||
|
|||||||
@@ -26,7 +26,7 @@
|
|||||||
</div>
|
</div>
|
||||||
<div class="con-item">
|
<div class="con-item">
|
||||||
<span>发生地点:</span>
|
<span>发生地点:</span>
|
||||||
<span>{{ userInfo?.address }}</span>
|
<span>{{ userInfo?.address || userInfo?.gpsErrorMsg }}</span>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</template>
|
</template>
|
||||||
@@ -57,7 +57,7 @@
|
|||||||
.police-con {
|
.police-con {
|
||||||
color: #ffffff;
|
color: #ffffff;
|
||||||
background-color: #00152b;
|
background-color: #00152b;
|
||||||
border: 1px solid #129bff;
|
//border: 1px solid #129bff;
|
||||||
padding: 2% 0 2% 5%;
|
padding: 2% 0 2% 5%;
|
||||||
|
|
||||||
.sub-text {
|
.sub-text {
|
||||||
|
|||||||
@@ -0,0 +1,119 @@
|
|||||||
|
<template>
|
||||||
|
<Dialog :openVis="visible" width="50%" :title="title" @close="closeDialog" :maskClosable="false">
|
||||||
|
<template #container>
|
||||||
|
<div v-if="useForm" class="form-container">
|
||||||
|
<Form :model="formRecord" :label-width="100" v-bind="formItemLayout">
|
||||||
|
<a-form-item label="性别">
|
||||||
|
<a-select v-model:value="formRecord.sex" placeholder="请选择" :options="sexTypeList"></a-select>
|
||||||
|
</a-form-item>
|
||||||
|
</Form>
|
||||||
|
</div>
|
||||||
|
<BasicTable
|
||||||
|
ref="registerTable"
|
||||||
|
class="table-container"
|
||||||
|
:key="visible"
|
||||||
|
:columns="columns"
|
||||||
|
:api="getPhoneList"
|
||||||
|
:apiParams="formState"
|
||||||
|
></BasicTable>
|
||||||
|
</template>
|
||||||
|
</Dialog>
|
||||||
|
</template>
|
||||||
|
<script setup lang="ts">
|
||||||
|
import { computed, nextTick, ref, watch } from 'vue';
|
||||||
|
import Dialog from '/@/components/dialog/Dialog.vue';
|
||||||
|
import { useDialog } from '/@/views/components/dialogHooks.ts';
|
||||||
|
import BasicTable from '/@/components/secondaryScreen/secondMap/components/basicTable/BasicTable.vue';
|
||||||
|
import { Form } from 'ant-design-vue';
|
||||||
|
import { SexType, sexTypeList } from '/@/utils/settings.ts';
|
||||||
|
import { getPhoneList } from '/@/views/yinChuan/yinChuan.api.ts';
|
||||||
|
|
||||||
|
const props = defineProps({
|
||||||
|
record: Object,
|
||||||
|
title: String,
|
||||||
|
useForm: Boolean,
|
||||||
|
labelCol: Object,
|
||||||
|
wrapperCol: Object,
|
||||||
|
setting: Object,
|
||||||
|
phoneType: String,
|
||||||
|
});
|
||||||
|
const formItemLayout = {
|
||||||
|
labelCol: {
|
||||||
|
style: { width: '100px' },
|
||||||
|
...props.labelCol,
|
||||||
|
},
|
||||||
|
wrapperCol: {
|
||||||
|
span: 6,
|
||||||
|
...props.wrapperCol,
|
||||||
|
},
|
||||||
|
};
|
||||||
|
|
||||||
|
const columns = [
|
||||||
|
{
|
||||||
|
title: '姓名',
|
||||||
|
dataIndex: 'realName',
|
||||||
|
key: 'realName',
|
||||||
|
},
|
||||||
|
{
|
||||||
|
title: '单位',
|
||||||
|
dataIndex: 'departName',
|
||||||
|
key: 'departName',
|
||||||
|
},
|
||||||
|
{
|
||||||
|
title: '部门',
|
||||||
|
dataIndex: 'orgName',
|
||||||
|
key: 'orgName',
|
||||||
|
},
|
||||||
|
{
|
||||||
|
title: '性别',
|
||||||
|
dataIndex: 'sex_dictText',
|
||||||
|
key: 'sex_dictText',
|
||||||
|
},
|
||||||
|
{
|
||||||
|
title: '时间',
|
||||||
|
dataIndex: 'time',
|
||||||
|
key: 'time',
|
||||||
|
},
|
||||||
|
{
|
||||||
|
title: '电话',
|
||||||
|
dataIndex: 'phone',
|
||||||
|
key: 'phone',
|
||||||
|
},
|
||||||
|
];
|
||||||
|
const formRecord = ref({
|
||||||
|
sex: SexType.all,
|
||||||
|
});
|
||||||
|
const formState = computed(() => ({
|
||||||
|
...formRecord.value,
|
||||||
|
dataType: props.setting.dataType,
|
||||||
|
phoneType: props.phoneType,
|
||||||
|
showType: '0',
|
||||||
|
}));
|
||||||
|
const { visible, title, closeDialog, openDialog } = useDialog({ title: props.title });
|
||||||
|
const registerTable = ref();
|
||||||
|
watch(
|
||||||
|
props,
|
||||||
|
() => {
|
||||||
|
registerTable.value?.getRecords();
|
||||||
|
}
|
||||||
|
// {
|
||||||
|
// immediate: true,
|
||||||
|
// }
|
||||||
|
);
|
||||||
|
defineExpose({
|
||||||
|
openDialog,
|
||||||
|
});
|
||||||
|
</script>
|
||||||
|
<style scoped lang="less">
|
||||||
|
.form-container {
|
||||||
|
margin: 10px 0;
|
||||||
|
}
|
||||||
|
|
||||||
|
.table-container {
|
||||||
|
margin: 0 10px;
|
||||||
|
}
|
||||||
|
|
||||||
|
:deep(.ant-form-item-label) > label {
|
||||||
|
color: #fff;
|
||||||
|
}
|
||||||
|
</style>
|
||||||
+36
-11
@@ -9,7 +9,7 @@
|
|||||||
</div>
|
</div>
|
||||||
<div class="body-d">
|
<div class="body-d">
|
||||||
<div class="body-d-left">
|
<div class="body-d-left">
|
||||||
<one-l :refreshState="refreshState" />
|
<one-l :setting="setting" :refreshState="refreshState" @handleClick="handlePhoneDialog" />
|
||||||
<two-l :refreshState="refreshState" />
|
<two-l :refreshState="refreshState" />
|
||||||
<three-l :refreshState="refreshState" />
|
<three-l :refreshState="refreshState" />
|
||||||
</div>
|
</div>
|
||||||
@@ -17,7 +17,7 @@
|
|||||||
<china-map />
|
<china-map />
|
||||||
</div>
|
</div>
|
||||||
<div class="body-d-right">
|
<div class="body-d-right">
|
||||||
<one-r :refreshState="refreshState" />
|
<one-r :setting="setting" :refreshState="refreshState" />
|
||||||
<two-r :refreshState="refreshState" />
|
<two-r :refreshState="refreshState" />
|
||||||
<three-r :key="refreshState" />
|
<three-r :key="refreshState" />
|
||||||
</div>
|
</div>
|
||||||
@@ -25,28 +25,32 @@
|
|||||||
<div class="bottom-d"></div>
|
<div class="bottom-d"></div>
|
||||||
<EmployeeDialog ref="employeeDialogRef" :record="socketData" />
|
<EmployeeDialog ref="employeeDialogRef" :record="socketData" />
|
||||||
<EmergencyDialog ref="emergencyDialogRef" :record="emergencyData" />
|
<EmergencyDialog ref="emergencyDialogRef" :record="emergencyData" />
|
||||||
|
<PhoneDialog ref="phoneDialogRef" :title="phoneDialogTitle" :useForm="true" :setting="setting" :phoneType="phoneType" />
|
||||||
</div>
|
</div>
|
||||||
</template>
|
</template>
|
||||||
<script setup lang="ts">
|
<script setup lang="ts">
|
||||||
import { onUnmounted, ref, watch, nextTick } from 'vue';
|
import { onUnmounted, ref, watch, nextTick } from 'vue';
|
||||||
import OneL from '../components/body-d-left/oneL.vue';
|
import OneL from '/@/components/body-d-left/oneL.vue';
|
||||||
import TwoL from '../components/body-d-left/twoL.vue';
|
import TwoL from '/@/components/body-d-left/twoL.vue';
|
||||||
import ThreeL from '../components/body-d-left/threeL.vue';
|
import ThreeL from '/@/components/body-d-left/threeL.vue';
|
||||||
import OneR from '../components/body-d-right/oneR.vue';
|
import OneR from '/@/components/body-d-right/oneR.vue';
|
||||||
import TwoR from '../components/body-d-right/twoR.vue';
|
import TwoR from '/@/components/body-d-right/twoR.vue';
|
||||||
import ThreeR from '../components/body-d-right/threeR.vue';
|
import ThreeR from '/@/components/body-d-right/threeR.vue';
|
||||||
import ChinaMap from '../components/chinaMap/chinaMap.vue';
|
import ChinaMap from '/@/components/chinaMap/chinaMap.vue';
|
||||||
import EmployeeDialog from '/@/views/components/employeeDialog.vue';
|
import EmployeeDialog from '/@/views/components/employeeDialog.vue';
|
||||||
import EmergencyDialog from '/@/views/components/emergencyDialog.vue';
|
import EmergencyDialog from '/@/views/components/emergencyDialog.vue';
|
||||||
import { useTopTime } from '/@/utils/utils.ts';
|
import { useTopTime } from '/@/utils/utils.ts';
|
||||||
import { basicPath, emergencyPath, useSocket } from '/@/utils/socket.ts';
|
import { basicPath, emergencyPath, useSocket } from '/@/utils/socket.ts';
|
||||||
import { useRefresh } from '/@/hooks/autoRefresh';
|
import { useRefresh } from '/@/hooks/autoRefresh';
|
||||||
import { DEFAULT_TIME } from '/@/hooks/autoRefresh/pageRefreshTime.ts';
|
import { DEFAULT_TIME } from '/@/hooks/autoRefresh/pageRefreshTime.ts';
|
||||||
|
import { DataType, getSettings } from '/@/utils/settings.ts';
|
||||||
|
import PhoneDialog from '/@/views/components/phoneDialog/phoneDialog.vue';
|
||||||
|
|
||||||
const { refreshState } = useRefresh(DEFAULT_TIME);
|
const { refreshState } = useRefresh(DEFAULT_TIME);
|
||||||
const dayTimeO = ref();
|
const dayTimeO = ref();
|
||||||
const dayTimeT = ref();
|
const dayTimeT = ref();
|
||||||
const interval = ref(1);
|
const interval = ref(1);
|
||||||
|
const setting = getSettings(DataType.xian);
|
||||||
|
|
||||||
function init() {
|
function init() {
|
||||||
getTime();
|
getTime();
|
||||||
@@ -98,6 +102,27 @@
|
|||||||
|
|
||||||
clearInterval(interval.value);
|
clearInterval(interval.value);
|
||||||
});
|
});
|
||||||
|
const phoneDialogTitle = ref('呼入电话');
|
||||||
|
const phoneDialogRef = ref();
|
||||||
|
//0:处置 1:处理 2:呼入 3:全部
|
||||||
|
const phoneType = ref('');
|
||||||
|
|
||||||
|
//呼入电话、受理电话弹窗
|
||||||
|
function handlePhoneDialog(item) {
|
||||||
|
const { name, key } = item;
|
||||||
|
nextTick(() => {
|
||||||
|
//呼入电话
|
||||||
|
if (key == 'gross') {
|
||||||
|
phoneType.value = '2';
|
||||||
|
}
|
||||||
|
//受理电话
|
||||||
|
if (key == 'alerdyreceive') {
|
||||||
|
phoneType.value = '1';
|
||||||
|
}
|
||||||
|
phoneDialogTitle.value = name;
|
||||||
|
phoneDialogRef.value.openDialog();
|
||||||
|
});
|
||||||
|
}
|
||||||
|
|
||||||
// function test() {
|
// function test() {
|
||||||
// let nVal = {
|
// let nVal = {
|
||||||
@@ -134,7 +159,7 @@
|
|||||||
.outer {
|
.outer {
|
||||||
height: 100%;
|
height: 100%;
|
||||||
box-sizing: border-box;
|
box-sizing: border-box;
|
||||||
background: url('../assets/images/bg.png') no-repeat;
|
background: url('/@/assets/images/bg.png') no-repeat;
|
||||||
background-size: 100% 100%;
|
background-size: 100% 100%;
|
||||||
}
|
}
|
||||||
|
|
||||||
@@ -143,7 +168,7 @@
|
|||||||
line-height: 80px;
|
line-height: 80px;
|
||||||
display: flex;
|
display: flex;
|
||||||
padding-bottom: 9px;
|
padding-bottom: 9px;
|
||||||
background: url('../assets/images/top-title.png') no-repeat;
|
background: url('/@/assets/images/top-title.png') no-repeat;
|
||||||
background-size: 100% 100%;
|
background-size: 100% 100%;
|
||||||
|
|
||||||
.title-d-left,
|
.title-d-left,
|
||||||
|
|||||||
Reference in New Issue
Block a user