Merge branch 'main' of git.zdool.com:xs/ggfwjsc
This commit is contained in:
commit
e42beafb80
|
@ -10,7 +10,11 @@
|
|||
>
|
||||
<template #header="{ close, titleId, titleClass }">
|
||||
<div class="my-header">
|
||||
<el-icon size="26" color="#fff" @click="closeDialog">
|
||||
<el-icon
|
||||
size="26"
|
||||
color="#fff"
|
||||
@click="closeDialog"
|
||||
>
|
||||
<CircleCloseFilled />
|
||||
</el-icon>
|
||||
</div>
|
||||
|
@ -61,7 +65,7 @@
|
|||
:show-overflow-tooltip="true"
|
||||
:label="item.label"
|
||||
:property="item.property"
|
||||
align="center"
|
||||
:align="item.align || 'center'"
|
||||
>
|
||||
<template #default="scope">
|
||||
<slot
|
||||
|
@ -76,7 +80,7 @@
|
|||
:property="item.property"
|
||||
:label="item.label"
|
||||
:show-overflow-tooltip="true"
|
||||
align="center"
|
||||
:align="item.align || 'center'"
|
||||
/>
|
||||
</template>
|
||||
</el-table>
|
||||
|
@ -231,6 +235,10 @@ const handle = (current) => {
|
|||
--el-table-text-color: #fff;
|
||||
--el-table-header-text-color: #fff;
|
||||
}
|
||||
|
||||
// :deep(.el-table th) {
|
||||
// text-align: center;
|
||||
// }
|
||||
}
|
||||
|
||||
.pagePart {
|
||||
|
|
|
@ -1,7 +1,7 @@
|
|||
<template>
|
||||
<div class="flipbox">
|
||||
<div class="clock" id="clock">
|
||||
<div v-for="(digit, index) in digits" :key="index" class="flip down">
|
||||
<div v-for="(digit, index) in data.digits" :key="index" class="flip down">
|
||||
<div class="digital front number0"></div>
|
||||
<div class="digital back number1"></div>
|
||||
</div>
|
||||
|
@ -11,7 +11,14 @@
|
|||
</template>
|
||||
|
||||
<script setup>
|
||||
import { onMounted, onBeforeMount, ref, reactive, defineProps } from "vue";
|
||||
import {
|
||||
watch,
|
||||
onMounted,
|
||||
onBeforeMount,
|
||||
ref,
|
||||
reactive,
|
||||
defineProps,
|
||||
} from "vue";
|
||||
|
||||
const props = defineProps({
|
||||
list: {
|
||||
|
@ -23,6 +30,7 @@ const props = defineProps({
|
|||
});
|
||||
const data = reactive({
|
||||
list: [],
|
||||
digits: [0, 0, 0, 0, 0],
|
||||
});
|
||||
|
||||
class Flipper {
|
||||
|
@ -90,7 +98,7 @@ class Flipper {
|
|||
}
|
||||
|
||||
function updateCounter(flippers, number) {
|
||||
const strNumber = number.toString().padStart(5, "0");
|
||||
const strNumber = number.toString().padStart(flippers.length, "0");
|
||||
for (let i = 0; i < flippers.length; i++) {
|
||||
const currentDigit = strNumber[i];
|
||||
const flipper = flippers[i];
|
||||
|
@ -99,11 +107,45 @@ function updateCounter(flippers, number) {
|
|||
}
|
||||
}
|
||||
|
||||
const digits = ref([0, 0, 0, 0, 0]);
|
||||
// const digits = ref([0, 0, 0, 0, 0]); //数字位数
|
||||
watch(
|
||||
() => props.list,
|
||||
(newVal) => {
|
||||
setTimeout(() => {
|
||||
data.list = props.list;
|
||||
data.digits = data.list.toString().split("").map(Number);
|
||||
const flips = document.querySelectorAll(".flip");
|
||||
const flipObjs = [];
|
||||
|
||||
for (let i = 0; i < flips.length; i++) {
|
||||
flipObjs.push(
|
||||
new Flipper({
|
||||
node: flips[i],
|
||||
frontText: "number0",
|
||||
backText: "number0",
|
||||
})
|
||||
);
|
||||
flipObjs[i].currentDigit = 0;
|
||||
}
|
||||
|
||||
const randomNumbers = [2345, 6542, data.list]; //显示的数字
|
||||
let index = 0;
|
||||
|
||||
const interval = setInterval(() => {
|
||||
if (index >= randomNumbers.length) {
|
||||
clearInterval(interval);
|
||||
} else {
|
||||
updateCounter(flipObjs, randomNumbers[index]);
|
||||
index++;
|
||||
}
|
||||
}, 333); //变换的时间
|
||||
}, 600);
|
||||
}
|
||||
);
|
||||
onBeforeMount(() => {
|
||||
setTimeout(() => {
|
||||
data.list = props.list;
|
||||
data.digits = data.list.toString().split("").map(Number);
|
||||
const flips = document.querySelectorAll(".flip");
|
||||
const flipObjs = [];
|
||||
|
||||
|
@ -118,7 +160,7 @@ onBeforeMount(() => {
|
|||
flipObjs[i].currentDigit = 0;
|
||||
}
|
||||
|
||||
const randomNumbers = [2345, 6542, data.list];
|
||||
const randomNumbers = [2345, 6542, data.list]; //显示的数字
|
||||
let index = 0;
|
||||
|
||||
const interval = setInterval(() => {
|
||||
|
@ -128,7 +170,7 @@ onBeforeMount(() => {
|
|||
updateCounter(flipObjs, randomNumbers[index]);
|
||||
index++;
|
||||
}
|
||||
}, 333);
|
||||
}, 333); //变换的时间
|
||||
}, 600);
|
||||
});
|
||||
</script>
|
||||
|
|
|
@ -214,11 +214,12 @@ const getOption = () => {
|
|||
};
|
||||
|
||||
const setChart = () => {
|
||||
// Vue3中: 需要引入
|
||||
var myChart = echarts.init(chart.value);
|
||||
|
||||
// 使用刚指定的配置项和数据显示图表。
|
||||
myChart.setOption(data.option);
|
||||
if (chart.value) {
|
||||
const myChart = echarts.init(chart.value);
|
||||
myChart.setOption(data.option);
|
||||
} else {
|
||||
// console.error('chart is not defined');
|
||||
}
|
||||
};
|
||||
|
||||
// 使用生命钩子
|
||||
|
|
|
@ -365,11 +365,12 @@ const getOption = () => {
|
|||
};
|
||||
};
|
||||
const setChart = () => {
|
||||
// Vue3中: 需要引入
|
||||
var myChart = echarts.init(chart.value);
|
||||
|
||||
// 使用刚指定的配置项和数据显示图表。
|
||||
myChart.setOption(data.option);
|
||||
if (chart.value) {
|
||||
const myChart = echarts.init(chart.value);
|
||||
myChart.setOption(data.option);
|
||||
} else {
|
||||
// console.error('chart is not defined');
|
||||
}
|
||||
};
|
||||
|
||||
// 使用生命钩子
|
||||
|
|
|
@ -253,7 +253,6 @@ const getOption = () => {
|
|||
const setChart = () => {
|
||||
// Vue3中: 需要引入
|
||||
var myChart = echarts.init(chart.value);
|
||||
|
||||
// 使用刚指定的配置项和数据显示图表。
|
||||
myChart.setOption(data.option);
|
||||
};
|
||||
|
|
|
@ -2,7 +2,7 @@
|
|||
<div ref="chart" style="width: 100%; height: 260px"></div>
|
||||
</template>
|
||||
|
||||
<script setup >
|
||||
<script setup>
|
||||
import { onBeforeMount, reactive, ref } from "vue";
|
||||
// 局部引入echarts核心模块
|
||||
import * as echarts from "echarts";
|
||||
|
@ -203,11 +203,12 @@ const getOption = () => {
|
|||
};
|
||||
};
|
||||
const setChart = () => {
|
||||
// Vue3中: 需要引入
|
||||
var myChart = echarts.init(chart.value);
|
||||
|
||||
// 使用刚指定的配置项和数据显示图表。
|
||||
myChart.setOption(data.option);
|
||||
if (chart.value) {
|
||||
const myChart = echarts.init(chart.value);
|
||||
myChart.setOption(data.option);
|
||||
} else {
|
||||
// console.error('chart is not defined');
|
||||
}
|
||||
};
|
||||
|
||||
// 使用生命钩子
|
||||
|
@ -225,5 +226,4 @@ onBeforeMount(() => {
|
|||
});
|
||||
</script>
|
||||
|
||||
<style scoped>
|
||||
</style>
|
||||
<style scoped></style>
|
||||
|
|
|
@ -1,5 +1,5 @@
|
|||
<template>
|
||||
<div ref="chart" style="width: 340px; height: 250px"></div>
|
||||
<div ref="chart" style="width: 340px; height: 240px"></div>
|
||||
</template>
|
||||
|
||||
<script setup>
|
||||
|
@ -84,7 +84,7 @@ const getOption = () => {
|
|||
top: "18%",
|
||||
left: "3%",
|
||||
right: "6%",
|
||||
bottom: "0%",
|
||||
bottom: "5%",
|
||||
containLabel: true,
|
||||
color: "#ffffff",
|
||||
fontSize: 16,
|
||||
|
|
|
@ -240,21 +240,33 @@
|
|||
<div>
|
||||
<div class="czrBox">
|
||||
<div class="situation situation1"></div>
|
||||
<edxs :list="data.whistleblower.culeTotal.data" :month="data.whistleblower.culeTotal.time"></edxs>
|
||||
<edxs
|
||||
:list="data.whistleblower.culeTotal.data"
|
||||
:month="data.whistleblower.culeTotal.time"
|
||||
></edxs>
|
||||
</div>
|
||||
<div class="czrBox">
|
||||
<div class="situation situation2"></div>
|
||||
<edxs1 :list="data.whistleblower.gaCules.data" :month="data.whistleblower.gaCules.time"></edxs1>
|
||||
<edxs1
|
||||
:list="data.whistleblower.gaCules.data"
|
||||
:month="data.whistleblower.gaCules.time"
|
||||
></edxs1>
|
||||
</div>
|
||||
</div>
|
||||
<div>
|
||||
<div class="czrBox">
|
||||
<div class="situation situation3"></div>
|
||||
<edxs2 :list="data.whistleblower.newCules.data" :month="data.whistleblower.newCules.time"></edxs2>
|
||||
<edxs2
|
||||
:list="data.whistleblower.newCules.data"
|
||||
:month="data.whistleblower.newCules.time"
|
||||
></edxs2>
|
||||
</div>
|
||||
<div class="czrBox">
|
||||
<div class="situation situation4"></div>
|
||||
<edxs3 :list="data.whistleblower.jcgCules.data" :month="data.whistleblower.jcgCules.time"></edxs3>
|
||||
<edxs3
|
||||
:list="data.whistleblower.jcgCules.data"
|
||||
:month="data.whistleblower.jcgCules.time"
|
||||
></edxs3>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
@ -600,6 +612,10 @@ const autoScroll = () => {
|
|||
if (!isAutoScrolling) return;
|
||||
|
||||
const mainEl = mainRef.value;
|
||||
if (!mainEl) {
|
||||
// console.error("mainRef is not defined");
|
||||
return;
|
||||
}
|
||||
mainEl.scrollTop += 1; // 每次滚动的距离
|
||||
|
||||
if (mainEl.scrollTop + 1 >= mainEl.scrollHeight - mainEl.clientHeight) {
|
||||
|
|
|
@ -1,10 +1,7 @@
|
|||
<template>
|
||||
<div class="module">
|
||||
<div class="displayFlex left_bg">
|
||||
<div
|
||||
class="flex1"
|
||||
style="flex: 0.5"
|
||||
>
|
||||
<div class="flex1" style="flex: 0.5">
|
||||
<div class="yd_title left_1">
|
||||
<div class="animate-border">
|
||||
<i></i>
|
||||
|
@ -49,10 +46,7 @@
|
|||
></ePie2>
|
||||
</div>
|
||||
|
||||
<div
|
||||
class="flex1"
|
||||
style="margin-top: 10px"
|
||||
>
|
||||
<div class="flex1" style="margin-top: 10px">
|
||||
<div class="yd_title left_3">
|
||||
<div class="animate-border">
|
||||
<i></i>
|
||||
|
@ -60,15 +54,9 @@
|
|||
</div>
|
||||
</div>
|
||||
<div class="sm_title_1"></div>
|
||||
<tnb
|
||||
:list="data.lmb.tnbrs"
|
||||
:year="data.lmb.year"
|
||||
></tnb>
|
||||
<tnb :list="data.lmb.tnbrs" :year="data.lmb.year"></tnb>
|
||||
<div class="sm_title_2"></div>
|
||||
<gxy
|
||||
:list="data.lmb.gxyrs"
|
||||
:year="data.lmb.year"
|
||||
></gxy>
|
||||
<gxy :list="data.lmb.gxyrs" :year="data.lmb.year"></gxy>
|
||||
</div>
|
||||
</div>
|
||||
<div class="displayFlex center_bg">
|
||||
|
@ -81,39 +69,24 @@
|
|||
</div>
|
||||
<div class="center_top">
|
||||
<div class="item">
|
||||
<img
|
||||
src="@/assets/images/hygiene/mjzrc.png"
|
||||
class="left"
|
||||
/>
|
||||
<img src="@/assets/images/hygiene/mjzrc.png" class="left" />
|
||||
<div class="right">
|
||||
<div class="right_top">门急诊人次</div>
|
||||
<img
|
||||
src="@/assets/images/hygiene/jt.png"
|
||||
class="right_center"
|
||||
/>
|
||||
<img src="@/assets/images/hygiene/jt.png" class="right_center" />
|
||||
<div class="right_bottom">{{ data.mz.mjzrc }}</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="item">
|
||||
<img
|
||||
src="@/assets/images/hygiene/zyrs.png"
|
||||
class="left"
|
||||
/>
|
||||
<img src="@/assets/images/hygiene/zyrs.png" class="left" />
|
||||
<div class="right">
|
||||
<div class="right_top">住院人数</div>
|
||||
<img
|
||||
src="@/assets/images/hygiene/jt.png"
|
||||
class="right_center"
|
||||
/>
|
||||
<img src="@/assets/images/hygiene/jt.png" class="right_center" />
|
||||
<div class="right_bottom">{{ data.mz.zyrs }}</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div
|
||||
class="flex1"
|
||||
style="flex: 0.3"
|
||||
>
|
||||
<div class="flex1" style="flex: 0.3">
|
||||
<div class="yd_title center_1">
|
||||
<div class="animate-border">
|
||||
<i></i>
|
||||
|
@ -124,10 +97,7 @@
|
|||
<div class="minTopPart">
|
||||
<div class="history2">
|
||||
<div class="va">{{ data.jkda.jdfs }}</div>
|
||||
<img
|
||||
src="@/assets/images/hygiene/shang_left.png"
|
||||
alt=""
|
||||
/>
|
||||
<img src="@/assets/images/hygiene/shang_left.png" alt="" />
|
||||
<img
|
||||
class="moveImg"
|
||||
src="@/assets/images/hygiene/shang_left2.png"
|
||||
|
@ -163,10 +133,7 @@
|
|||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div
|
||||
class="flex1"
|
||||
style="margin-top: 20px"
|
||||
>
|
||||
<div class="flex1" style="margin-top: 20px">
|
||||
<div class="yd_title familyPlanning">
|
||||
<div class="animate-border">
|
||||
<i></i>
|
||||
|
@ -179,10 +146,7 @@
|
|||
</div>
|
||||
</div>
|
||||
<div class="displayFlex right_bg">
|
||||
<div
|
||||
class="flex1"
|
||||
style="flex: 0.9"
|
||||
>
|
||||
<div class="flex1" style="flex: 0.9">
|
||||
<div class="yd_title mechanism">
|
||||
<div class="animate-border">
|
||||
<i></i>
|
||||
|
@ -192,54 +156,28 @@
|
|||
<div class="history">
|
||||
<div class="history1">
|
||||
<div class="va">{{ data.fyglrs.ycfrc }}</div>
|
||||
<img
|
||||
src="@/assets/images/hygiene/fy.png"
|
||||
alt=""
|
||||
/>
|
||||
<img
|
||||
src="@/assets/images/hygiene/fy1.png"
|
||||
alt=""
|
||||
class="fyMove"
|
||||
/>
|
||||
<img
|
||||
src="@/assets/images/hygiene/fy.gif"
|
||||
class="historyMoveImg"
|
||||
/>
|
||||
<img src="@/assets/images/hygiene/fy.png" alt="" />
|
||||
<img src="@/assets/images/hygiene/fy1.png" alt="" class="fyMove" />
|
||||
<img src="@/assets/images/hygiene/fy.gif" class="historyMoveImg" />
|
||||
<div class="historyimg">孕产妇系统管理人数</div>
|
||||
</div>
|
||||
<div class="history1">
|
||||
<div class="va">{{ data.fyglrs.etrs }}</div>
|
||||
<img
|
||||
src="@/assets/images/hygiene/fy.png"
|
||||
alt=""
|
||||
/>
|
||||
<img
|
||||
src="@/assets/images/hygiene/fy2.png"
|
||||
alt=""
|
||||
class="fyMove"
|
||||
/>
|
||||
<img
|
||||
src="@/assets/images/hygiene/fy.gif"
|
||||
class="historyMoveImg"
|
||||
/>
|
||||
<img src="@/assets/images/hygiene/fy.png" alt="" />
|
||||
<img src="@/assets/images/hygiene/fy2.png" alt="" class="fyMove" />
|
||||
<img src="@/assets/images/hygiene/fy.gif" class="historyMoveImg" />
|
||||
<div class="historyimg">0-6岁儿童系统管理人数</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div
|
||||
class="flex1"
|
||||
style="flex: 1.1"
|
||||
>
|
||||
<div class="flex1" style="flex: 1.1">
|
||||
<div class="yd_title service">
|
||||
<div class="animate-border">
|
||||
<i></i>
|
||||
<i></i>
|
||||
</div>
|
||||
</div>
|
||||
<eP7
|
||||
:list="data.jktj.jktjrs"
|
||||
:year="data.jktj.year"
|
||||
></eP7>
|
||||
<eP7 :list="data.jktj.jktjrs" :year="data.jktj.year"></eP7>
|
||||
</div>
|
||||
<div class="flex1">
|
||||
<div class="yd_title last">
|
||||
|
@ -255,10 +193,7 @@
|
|||
@mouseenter="stopAutoScroll"
|
||||
@mouseleave="startAutoScroll"
|
||||
>
|
||||
<div
|
||||
class="item"
|
||||
v-for="item in data.jkhd"
|
||||
>
|
||||
<div class="item" v-for="item in data.jkhd">
|
||||
{{ item.jkhd }}
|
||||
</div>
|
||||
</div>
|
||||
|
@ -316,6 +251,10 @@ const autoScroll = () => {
|
|||
if (!isAutoScrolling) return;
|
||||
|
||||
const mainEl = mainRef.value;
|
||||
if (!mainEl) {
|
||||
// console.error("mainRef is not defined");
|
||||
return;
|
||||
}
|
||||
mainEl.scrollTop += 1; // 每次滚动的距离
|
||||
|
||||
if (mainEl.scrollTop + 1 >= mainEl.scrollHeight - mainEl.clientHeight) {
|
||||
|
@ -812,7 +751,7 @@ const getData = async () => {
|
|||
flex-direction: column;
|
||||
align-items: center;
|
||||
position: relative;
|
||||
.fyMove{
|
||||
.fyMove {
|
||||
position: absolute;
|
||||
top: 60px;
|
||||
width: 60px;
|
||||
|
|
|
@ -451,6 +451,7 @@
|
|||
</div>
|
||||
<div class="flex1" style="margin-top: 10px">
|
||||
<div class="yd_title last_1">
|
||||
<div class="gTitle">( 近30天 )</div>
|
||||
<div class="animate-border">
|
||||
<i></i>
|
||||
<i></i>
|
||||
|
@ -1694,6 +1695,14 @@ startAutoScroll();
|
|||
right: 5px;
|
||||
top: 1px;
|
||||
}
|
||||
.gTitle{
|
||||
position: absolute;
|
||||
color: #ACD1F1;
|
||||
height: 100%;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
left: 156px;
|
||||
}
|
||||
|
||||
.c {
|
||||
width: 130px;
|
||||
|
|
|
@ -176,7 +176,14 @@
|
|||
</template>
|
||||
|
||||
<script setup>
|
||||
import { ref, reactive, onMounted, onBeforeMount,onBeforeUnmount, computed } from "vue";
|
||||
import {
|
||||
ref,
|
||||
reactive,
|
||||
onMounted,
|
||||
onBeforeMount,
|
||||
onBeforeUnmount,
|
||||
computed,
|
||||
} from "vue";
|
||||
import eP1 from "./echarts_work/eP1.vue";
|
||||
import eP2 from "./echarts_work/eP2.vue";
|
||||
import eP3 from "./echarts_work/eP3.vue";
|
||||
|
@ -414,6 +421,10 @@ const autoScroll = () => {
|
|||
if (!isAutoScrolling) return;
|
||||
|
||||
const mainEl = mainRef.value;
|
||||
if (!mainEl) {
|
||||
// console.error("mainRef is not defined");
|
||||
return;
|
||||
}
|
||||
mainEl.scrollTop += 1; // 每次滚动的距离
|
||||
|
||||
if (mainEl.scrollTop + 1 >= mainEl.scrollHeight - mainEl.clientHeight) {
|
||||
|
|
|
@ -354,6 +354,7 @@ const yl_column = ref([
|
|||
{
|
||||
label: "机构名称",
|
||||
property: "mc",
|
||||
align: 'left'
|
||||
},
|
||||
{
|
||||
label: "机构地址",
|
||||
|
|
Loading…
Reference in New Issue