xiangshan
/
ggfwjsc
22
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

Merge branch 'main' of git.zdool.com:xs/ggfwjsc

This commit is contained in:
lnn19986213 2024-06-20 10:25:22 +08:00
parent fad8f87c22 7d165b139e
commit 88d396c855
9 changed files with 128 additions and 119 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

54
src/view/echart_analyze/FlipClock.vue
View File

@ -1,7 +1,7 @@
<template> <template>
<div class="flipbox"> <div class="flipbox">
<div class="clock" id="clock"> <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 front number0"></div>
<div class="digital back number1"></div> <div class="digital back number1"></div>
</div> </div>
@ -11,7 +11,14 @@
</template> </template>
<script setup> <script setup>
import { onMounted, onBeforeMount, ref, reactive, defineProps } from "vue"; import {
watch,
onMounted,
onBeforeMount,
ref,
reactive,
defineProps,
} from "vue";
const props = defineProps({ const props = defineProps({
list: { list: {
@ -23,6 +30,7 @@ const props = defineProps({
}); });
const data = reactive({ const data = reactive({
list: [], list: [],
digits: [0, 0, 0, 0, 0],
}); });
class Flipper { class Flipper {
@ -90,7 +98,7 @@ class Flipper {
} }
function updateCounter(flippers, number) { 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++) { for (let i = 0; i < flippers.length; i++) {
const currentDigit = strNumber[i]; const currentDigit = strNumber[i];
const flipper = flippers[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(() => { onBeforeMount(() => {
setTimeout(() => { setTimeout(() => {
data.list = props.list; data.list = props.list;
data.digits = data.list.toString().split("").map(Number);
const flips = document.querySelectorAll(".flip"); const flips = document.querySelectorAll(".flip");
const flipObjs = []; const flipObjs = [];
@ -118,7 +160,7 @@ onBeforeMount(() => {
flipObjs[i].currentDigit = 0; flipObjs[i].currentDigit = 0;
} }
const randomNumbers = [2345, 6542, data.list]; const randomNumbers = [2345, 6542, data.list]; //显示的数字
let index = 0; let index = 0;
const interval = setInterval(() => { const interval = setInterval(() => {
@ -128,7 +170,7 @@ onBeforeMount(() => {
updateCounter(flipObjs, randomNumbers[index]); updateCounter(flipObjs, randomNumbers[index]);
index++; index++;
} }
}, 333); }, 333); //变换的时间
}, 600); }, 600);
}); });
</script> </script>

11
src/view/echarts_yl/eP2_2.vue
View File

@ -214,11 +214,12 @@ const getOption = () => {
}; };
const setChart = () => { const setChart = () => {
// Vue3中： 需要引入 if (chart.value) {
var myChart = echarts.init(chart.value); const myChart = echarts.init(chart.value);
myChart.setOption(data.option);
// 使用刚指定的配置项和数据显示图表。 } else {
myChart.setOption(data.option); // console.error('chart is not defined');
}
}; };
// 使用生命钩子 // 使用生命钩子

11
src/view/echarts_yl/eP3_2.vue
View File

@ -365,11 +365,12 @@ const getOption = () => {
}; };
}; };
const setChart = () => { const setChart = () => {
// Vue3中： 需要引入 if (chart.value) {
var myChart = echarts.init(chart.value); const myChart = echarts.init(chart.value);
myChart.setOption(data.option);
// 使用刚指定的配置项和数据显示图表。 } else {
myChart.setOption(data.option); // console.error('chart is not defined');
}
}; };
// 使用生命钩子 // 使用生命钩子

1
src/view/echarts_yl/pie.vue
View File

@ -253,7 +253,6 @@ const getOption = () => {
const setChart = () => { const setChart = () => {
// Vue3中： 需要引入 // Vue3中： 需要引入
var myChart = echarts.init(chart.value); var myChart = echarts.init(chart.value);
// 使用刚指定的配置项和数据显示图表。 // 使用刚指定的配置项和数据显示图表。
myChart.setOption(data.option); myChart.setOption(data.option);
}; };

16
src/view/echarts_yl/pie2.vue
View File

@ -2,7 +2,7 @@
<div ref="chart" style="width: 100%; height: 260px"></div> <div ref="chart" style="width: 100%; height: 260px"></div>
</template> </template>
<script setup > <script setup>
import { onBeforeMount, reactive, ref } from "vue"; import { onBeforeMount, reactive, ref } from "vue";
// 局部引入echarts核心模块 // 局部引入echarts核心模块
import * as echarts from "echarts"; import * as echarts from "echarts";
@ -203,11 +203,12 @@ const getOption = () => {
}; };
}; };
const setChart = () => { const setChart = () => {
// Vue3中： 需要引入 if (chart.value) {
var myChart = echarts.init(chart.value); const myChart = echarts.init(chart.value);
myChart.setOption(data.option);
// 使用刚指定的配置项和数据显示图表。 } else {
myChart.setOption(data.option); // console.error('chart is not defined');
}
}; };
// 使用生命钩子 // 使用生命钩子
@ -225,5 +226,4 @@ onBeforeMount(() => {
}); });
</script> </script>
<style scoped> <style scoped></style>
</style>

4
src/view/echarts_yl/ylSMFW.vue
View File

@ -1,5 +1,5 @@
<template> <template>
<div ref="chart" style="width: 340px; height: 250px"></div> <div ref="chart" style="width: 340px; height: 240px"></div>
</template> </template>
<script setup> <script setup>
@ -84,7 +84,7 @@ const getOption = () => {
top: "18%", top: "18%",
left: "3%", left: "3%",
right: "6%", right: "6%",
bottom: "0%", bottom: "5%",
containLabel: true, containLabel: true,
color: "#ffffff", color: "#ffffff",
fontSize: 16, fontSize: 16,

24
src/view/education.vue
View File

@ -240,21 +240,33 @@
<div> <div>
<div class="czrBox"> <div class="czrBox">
<div class="situation situation1"></div> <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>
<div class="czrBox"> <div class="czrBox">
<div class="situation situation2"></div> <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>
<div> <div>
<div class="czrBox"> <div class="czrBox">
<div class="situation situation3"></div> <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>
<div class="czrBox"> <div class="czrBox">
<div class="situation situation4"></div> <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> </div>
</div> </div>
@ -600,6 +612,10 @@ const autoScroll = () => {
if (!isAutoScrolling) return; if (!isAutoScrolling) return;
const mainEl = mainRef.value; const mainEl = mainRef.value;
if (!mainEl) {
// console.error("mainRef is not defined");
return;
}
mainEl.scrollTop += 1; // 每次滚动的距离 mainEl.scrollTop += 1; // 每次滚动的距离
if (mainEl.scrollTop + 1 >= mainEl.scrollHeight - mainEl.clientHeight) { if (mainEl.scrollTop + 1 >= mainEl.scrollHeight - mainEl.clientHeight) {

113
src/view/hygiene.vue
View File

@ -1,10 +1,7 @@
<template> <template>
<div class="module"> <div class="module">
<div class="displayFlex left_bg"> <div class="displayFlex left_bg">
<div <div class="flex1" style="flex: 0.5">
class="flex1"
style="flex: 0.5"
>
<div class="yd_title left_1"> <div class="yd_title left_1">
<div class="animate-border"> <div class="animate-border">
<i></i> <i></i>
@ -49,10 +46,7 @@
></ePie2> ></ePie2>
</div> </div>
<div <div class="flex1" style="margin-top: 10px">
class="flex1"
style="margin-top: 10px"
>
<div class="yd_title left_3"> <div class="yd_title left_3">
<div class="animate-border"> <div class="animate-border">
<i></i> <i></i>
@ -60,15 +54,9 @@
</div> </div>
</div> </div>
<div class="sm_title_1"></div> <div class="sm_title_1"></div>
<tnb <tnb :list="data.lmb.tnbrs" :year="data.lmb.year"></tnb>
:list="data.lmb.tnbrs"
:year="data.lmb.year"
></tnb>
<div class="sm_title_2"></div> <div class="sm_title_2"></div>
<gxy <gxy :list="data.lmb.gxyrs" :year="data.lmb.year"></gxy>
:list="data.lmb.gxyrs"
:year="data.lmb.year"
></gxy>
</div> </div>
</div> </div>
<div class="displayFlex center_bg"> <div class="displayFlex center_bg">
@ -81,39 +69,24 @@
</div> </div>
<div class="center_top"> <div class="center_top">
<div class="item"> <div class="item">
<img <img src="@/assets/images/hygiene/mjzrc.png" class="left" />
src="@/assets/images/hygiene/mjzrc.png"
class="left"
/>
<div class="right"> <div class="right">
<div class="right_top">门急诊人次</div> <div class="right_top">门急诊人次</div>
<img <img src="@/assets/images/hygiene/jt.png" class="right_center" />
src="@/assets/images/hygiene/jt.png"
class="right_center"
/>
<div class="right_bottom">{{ data.mz.mjzrc }}</div> <div class="right_bottom">{{ data.mz.mjzrc }}</div>
</div> </div>
</div> </div>
<div class="item"> <div class="item">
<img <img src="@/assets/images/hygiene/zyrs.png" class="left" />
src="@/assets/images/hygiene/zyrs.png"
class="left"
/>
<div class="right"> <div class="right">
<div class="right_top">住院人数</div> <div class="right_top">住院人数</div>
<img <img src="@/assets/images/hygiene/jt.png" class="right_center" />
src="@/assets/images/hygiene/jt.png"
class="right_center"
/>
<div class="right_bottom">{{ data.mz.zyrs }}</div> <div class="right_bottom">{{ data.mz.zyrs }}</div>
</div> </div>
</div> </div>
</div> </div>
</div> </div>
<div <div class="flex1" style="flex: 0.3">
class="flex1"
style="flex: 0.3"
>
<div class="yd_title center_1"> <div class="yd_title center_1">
<div class="animate-border"> <div class="animate-border">
<i></i> <i></i>
@ -124,10 +97,7 @@
<div class="minTopPart"> <div class="minTopPart">
<div class="history2"> <div class="history2">
<div class="va">{{ data.jkda.jdfs }}</div> <div class="va">{{ data.jkda.jdfs }}</div>
<img <img src="@/assets/images/hygiene/shang_left.png" alt="" />
src="@/assets/images/hygiene/shang_left.png"
alt=""
/>
<img <img
class="moveImg" class="moveImg"
src="@/assets/images/hygiene/shang_left2.png" src="@/assets/images/hygiene/shang_left2.png"
@ -163,10 +133,7 @@
</div> </div>
</div> </div>
</div> </div>
<div <div class="flex1" style="margin-top: 20px">
class="flex1"
style="margin-top: 20px"
>
<div class="yd_title familyPlanning"> <div class="yd_title familyPlanning">
<div class="animate-border"> <div class="animate-border">
<i></i> <i></i>
@ -179,10 +146,7 @@
</div> </div>
</div> </div>
<div class="displayFlex right_bg"> <div class="displayFlex right_bg">
<div <div class="flex1" style="flex: 0.9">
class="flex1"
style="flex: 0.9"
>
<div class="yd_title mechanism"> <div class="yd_title mechanism">
<div class="animate-border"> <div class="animate-border">
<i></i> <i></i>
@ -192,54 +156,28 @@
<div class="history"> <div class="history">
<div class="history1"> <div class="history1">
<div class="va">{{ data.fyglrs.ycfrc }}</div> <div class="va">{{ data.fyglrs.ycfrc }}</div>
<img <img src="@/assets/images/hygiene/fy.png" alt="" />
src="@/assets/images/hygiene/fy.png" <img src="@/assets/images/hygiene/fy1.png" alt="" class="fyMove" />
alt="" <img src="@/assets/images/hygiene/fy.gif" class="historyMoveImg" />
/>
<img
src="@/assets/images/hygiene/fy1.png"
alt=""
class="fyMove"
/>
<img
src="@/assets/images/hygiene/fy.gif"
class="historyMoveImg"
/>
<div class="historyimg">孕产妇系统管理人数</div> <div class="historyimg">孕产妇系统管理人数</div>
</div> </div>
<div class="history1"> <div class="history1">
<div class="va">{{ data.fyglrs.etrs }}</div> <div class="va">{{ data.fyglrs.etrs }}</div>
<img <img src="@/assets/images/hygiene/fy.png" alt="" />
src="@/assets/images/hygiene/fy.png" <img src="@/assets/images/hygiene/fy2.png" alt="" class="fyMove" />
alt="" <img src="@/assets/images/hygiene/fy.gif" class="historyMoveImg" />
/>
<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 class="historyimg">0-6岁儿童系统管理人数</div>
</div> </div>
</div> </div>
</div> </div>
<div <div class="flex1" style="flex: 1.1">
class="flex1"
style="flex: 1.1"
>
<div class="yd_title service"> <div class="yd_title service">
<div class="animate-border"> <div class="animate-border">
<i></i> <i></i>
<i></i> <i></i>
</div> </div>
</div> </div>
<eP7 <eP7 :list="data.jktj.jktjrs" :year="data.jktj.year"></eP7>
:list="data.jktj.jktjrs"
:year="data.jktj.year"
></eP7>
</div> </div>
<div class="flex1"> <div class="flex1">
<div class="yd_title last"> <div class="yd_title last">
@ -255,10 +193,7 @@
@mouseenter="stopAutoScroll" @mouseenter="stopAutoScroll"
@mouseleave="startAutoScroll" @mouseleave="startAutoScroll"
> >
<div <div class="item" v-for="item in data.jkhd">
class="item"
v-for="item in data.jkhd"
>
{{ item.jkhd }} {{ item.jkhd }}
</div> </div>
</div> </div>
@ -316,6 +251,10 @@ const autoScroll = () => {
if (!isAutoScrolling) return; if (!isAutoScrolling) return;
const mainEl = mainRef.value; const mainEl = mainRef.value;
if (!mainEl) {
// console.error("mainRef is not defined");
return;
}
mainEl.scrollTop += 1; // 每次滚动的距离 mainEl.scrollTop += 1; // 每次滚动的距离
if (mainEl.scrollTop + 1 >= mainEl.scrollHeight - mainEl.clientHeight) { if (mainEl.scrollTop + 1 >= mainEl.scrollHeight - mainEl.clientHeight) {
@ -812,7 +751,7 @@ const getData = async () => {
flex-direction: column; flex-direction: column;
align-items: center; align-items: center;
position: relative; position: relative;
.fyMove{ .fyMove {
position: absolute; position: absolute;
top: 60px; top: 60px;
width: 60px; width: 60px;

13
src/view/work.vue
View File

@ -176,7 +176,14 @@
</template> </template>
<script setup> <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 eP1 from "./echarts_work/eP1.vue";
import eP2 from "./echarts_work/eP2.vue"; import eP2 from "./echarts_work/eP2.vue";
import eP3 from "./echarts_work/eP3.vue"; import eP3 from "./echarts_work/eP3.vue";
@ -414,6 +421,10 @@ const autoScroll = () => {
if (!isAutoScrolling) return; if (!isAutoScrolling) return;
const mainEl = mainRef.value; const mainEl = mainRef.value;
if (!mainEl) {
// console.error("mainRef is not defined");
return;
}
mainEl.scrollTop += 1; // 每次滚动的距离 mainEl.scrollTop += 1; // 每次滚动的距离
if (mainEl.scrollTop + 1 >= mainEl.scrollHeight - mainEl.clientHeight) { if (mainEl.scrollTop + 1 >= mainEl.scrollHeight - mainEl.clientHeight) {