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

gx

This commit is contained in:
duanxiaohai 2024-06-20 16:06:15 +08:00
parent 270f6b0b42
commit 53dbebd296
4 changed files with 134 additions and 47 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

BIN
src/assets/eduImg/xxBJ.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 44 KiB

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

@ -30,7 +30,7 @@ const props = defineProps({
});
const data = reactive({
list: [],
digits: [0, 0, 0, 0, 0],
digits: [0, 0, 0, 0, 0], //数字位数
});
class Flipper {
@ -107,41 +107,52 @@ function updateCounter(flippers, number) {
}
}
// 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 = [];
// 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;
}
// for (let i = 0; i < flips.length; i++) {
// flipObjs.push(
// new Flipper({
// node: flips[i],
// frontText: "number0",
// backText: "number0",
// })
// );
// flipObjs[i].currentDigit = 0;
// }
// // 生成两个递增的随机数
// const generateIncrementingRandomNumbers = (min, max) => {
// const num1 = Math.floor(Math.random() * (max - min + 1)) + min;
// const num2 = Math.floor(Math.random() * (max - num1 + 1)) + num1 + 1;
// return [num1, num2];
// };
const randomNumbers = [2345, 6542, data.list]; //显示的数字
let index = 0;
// // 生成的随机数范围
// const [num1, num2] = generateIncrementingRandomNumbers(
// 1000,
// data.list - 1
// );
const interval = setInterval(() => {
if (index >= randomNumbers.length) {
clearInterval(interval);
} else {
updateCounter(flipObjs, randomNumbers[index]);
index++;
}
}, 333); //变换的时间
}, 600);
}
);
// const randomNumbers = [num1, num2, 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;

4
src/view/echarts_education/edXS2.vue
View File

@ -1,5 +1,5 @@
<template>
<div ref="chart" style="width: 100%; height: 210px"></div>
<div ref="chart" style="width: 100%; height: 270px"></div>
</template>
<script setup >
@ -35,7 +35,7 @@ const getOption = () => {
grid: {
top: "5%",
left: "1%",
right: "10%",
right: "3%",
bottom: "3%",
containLabel: true,
},

90
src/view/education.vue
View File

@ -237,7 +237,7 @@
<div class="flex1">
<div style="display: flex; justify-content: center">
<div class="czr-bj">
<div>
<!-- <div>
<div class="czrBox">
<div class="situation situation1"></div>
<edxs
@ -252,8 +252,8 @@
:month="data.whistleblower.gaCules.time"
></edxs1>
</div>
</div>
<div>
</div> -->
<!-- <div> -->
<div class="czrBox">
<div class="situation situation3"></div>
<edxs2
@ -261,14 +261,31 @@
:month="data.whistleblower.newCules.time"
></edxs2>
</div>
<div class="czrBox">
<div class="clue">
<div class="clueBox">
<div class="clueTitle">预警线索总数</div>
<div class="clueNum">355</div>
<div class="clueUnit">条</div>
</div>
<div class="clueBox">
<div class="clueTitle">公安协同 <br />处置线索</div>
<div class="clueNum">355</div>
<div class="clueUnit">条</div>
</div>
<div class="clueBox">
<div class="clueTitle">检察官处置线索</div>
<div class="clueNum">355</div>
<div class="clueUnit">条</div>
</div>
</div>
<!-- <div class="czrBox">
<div class="situation situation4"></div>
<edxs3
:list="data.whistleblower.jcgCules.data"
:month="data.whistleblower.jcgCules.time"
></edxs3>
</div>
</div>
</div> -->
<!-- </div> -->
</div>
</div>
<!-- <eBubble></eBubble> -->
@ -1096,6 +1113,7 @@ onMounted(() => {
.flex11 {
padding: 12px 0;
margin-top: 54px;
}
.czr-sl {
@ -1247,6 +1265,7 @@ onMounted(() => {
padding-top: 20px;
display: flex;
justify-content: space-around;
flex-direction: column;
// height: calc(100% - 26px);
// height: 200px;
@ -1256,7 +1275,8 @@ onMounted(() => {
.czrBox {
// height: 104px;
width: 280px;
// width: 280px;
width: 100%;
min-height: 310px;
display: flex;
flex-direction: column;
@ -1270,6 +1290,62 @@ onMounted(() => {
padding-right: 18px;
}
}
.clue {
display: flex;
align-items: center;
margin-top: 37px;
.clueBox {
width: 171px;
height: 173px;
display: flex;
flex-direction: column;
align-items: center;
background-image: url(@/assets/eduImg/xxBJ.png);
background-repeat: no-repeat;
background-size: 100% 100%;
.clueTitle {
margin-top: 22px;
font-family: PangMenZhengDao, PangMenZhengDao;
font-weight: normal;
font-size: 20px;
color: #ffffff;
letter-spacing: 1px;
text-shadow: 0px 2px 4px #3575f9;
text-align: center;
font-style: normal;
}
.clueNum {
margin-top: 42px;
font-family: DINAlternate, DINAlternate;
font-weight: bold;
font-size: 32px;
color: #ffffff;
letter-spacing: 1px;
text-align: center;
font-style: normal;
}
.clueUnit {
margin-top: 4px;
font-weight: 500;
font-size: 16px;
color: #9cdeff;
text-align: center;
font-style: normal;
font-family: PingFangSC, PingFang SC;
}
}
.clueBox:nth-child(2) {
margin: 0 20px;
.clueTitle {
margin-top: 10px;
}
.clueNum {
margin-top: 28px;
}
}
}
.situation {
width: 196px;