This commit is contained in:
duanxiaohai 2024-08-06 15:46:25 +08:00
commit fba0640d6e
4 changed files with 257 additions and 120 deletions

View File

@ -508,9 +508,9 @@ const dataEc = reactive({
}); });
const nlfb = reactive({ const nlfb = reactive({
year: [2022, 2023, 2024, 2025, 2026,2027], year: [2022, 2023, 2024, 2025, 2026,2027],
list1: [0, 1000, 500, 0, 0,0], list1: [709, 3424, 2064, 0, 0,0],
list2: [0, 2000, 1000, 0, 0,0], list2: [1548, 5895, 2753, 0, 0,0],
list3: [0, 3000, 1500, 0, 0,0], list3: [180, 930, 632, 0, 0,0],
}); });
const showEnrol = () => { const showEnrol = () => {
dialogShowEnrol.value = true; dialogShowEnrol.value = true;

View File

@ -104,9 +104,10 @@ const getOption = () => {
}, },
series: [ series: [
{ {
xAxisIndex: 0,
name: "0-18岁", name: "0-18岁",
type: "line", type: "line",
stack: "Total", // stack: "Total",
symbol: "emptyCircle", symbol: "emptyCircle",
smooth: true, smooth: true,
symbolSize: 10, symbolSize: 10,
@ -151,9 +152,10 @@ const getOption = () => {
data: data.list, data: data.list,
}, },
{ {
xAxisIndex: 0,
name: "19-60岁", name: "19-60岁",
type: "line", type: "line",
stack: "Total", // stack: "Total",
symbol: "emptyCircle", symbol: "emptyCircle",
smooth: true, smooth: true,
symbolSize: 10, symbolSize: 10,
@ -198,9 +200,10 @@ const getOption = () => {
data: data.list2, data: data.list2,
}, },
{ {
xAxisIndex: 0,
name: "60岁以上", name: "60岁以上",
type: "line", type: "line",
stack: "Total", // stack: "Total",
symbol: "emptyCircle", symbol: "emptyCircle",
smooth: true, smooth: true,
symbolSize: 10, symbolSize: 10,

View File

@ -16,7 +16,7 @@
<div <div
class="content_item2" class="content_item2"
v-for="(item, index) in personTotal.slice(0, 1)" v-for="(item, index) in personTotal.slice(0, 1)"
:class="{ choose: item.id == choose.person }" :class="{ choose: item.age == choose.person }"
@click="buten(item)" @click="buten(item)"
:key="index" :key="index"
> >
@ -76,7 +76,7 @@
<div <div
class="content_item" class="content_item"
v-for="(item, index) in personTotal.slice(1)" v-for="(item, index) in personTotal.slice(1)"
:class="{ choose: item.id == choose.person }" :class="{ choose: item.age == choose.person }"
@click="buten(item)" @click="buten(item)"
:key="index" :key="index"
> >
@ -187,7 +187,6 @@ import {
defineProps, defineProps,
watch, watch,
nextTick, nextTick,
onActivated,
} from "vue"; } from "vue";
import { ElMessage } from "element-plus"; import { ElMessage } from "element-plus";
import tools from "@/utils/tools"; import tools from "@/utils/tools";
@ -195,7 +194,6 @@ import initializeMap from "@/utils/mapInitializer.js";
import http from "@/utils/request.js"; import http from "@/utils/request.js";
import mapTown from "@/assets/json/ly.json"; import mapTown from "@/assets/json/ly.json";
// import xkz from "@/assets/json/xkz.json"; // import xkz from "@/assets/json/xkz.json";
import personDetail from "./person/index.vue";
import cssj from "@/assets/json/cssj.json"; import cssj from "@/assets/json/cssj.json";
import j0 from "@/assets/images/map/j0.png"; import j0 from "@/assets/images/map/j0.png";
import j1 from "@/assets/images/map/j1.png"; import j1 from "@/assets/images/map/j1.png";
@ -224,6 +222,7 @@ import b6 from "@/assets/images/map/b6.png";
import xcbg from "@/assets/images/map/xcbg.png"; import xcbg from "@/assets/images/map/xcbg.png";
import AED from "@/assets/images/map/AED.png"; import AED from "@/assets/images/map/AED.png";
import Dialog from "./dialog/dialogMapDp.vue"; import Dialog from "./dialog/dialogMapDp.vue";
import personDetail from "./person/index.vue";
//--------------- //---------------
// //
const openD = ref(true); const openD = ref(true);
@ -1105,7 +1104,7 @@ const markera = (e) => {
}; };
// //
const buten = async (item) => { const buten = async (item) => {
getData(item.id, item.age); getData(item.age);
getDatas(cfJd.value, item.age); getDatas(cfJd.value, item.age);
}; };
// //
@ -1113,7 +1112,8 @@ const buten2 = async (item) => {
getDataBqs(cfJd.value, cfCs.value, item.id); getDataBqs(cfJd.value, cfCs.value, item.id);
}; };
// //
const getData = async (i, e) => { const getData = async (e) => {
let e1 = e;
if (e == "9999") { if (e == "9999") {
e = ""; e = "";
} }
@ -1125,7 +1125,7 @@ const getData = async (i, e) => {
{ {
id: "9999", id: "9999",
ages: "总人口", ages: "总人口",
age: "", age: "9999",
value: "res.data.total", value: "res.data.total",
}, },
{ {
@ -1133,7 +1133,7 @@ const getData = async (i, e) => {
name: "近一年死亡", name: "近一年死亡",
value: "5650", value: "5650",
ages: "近一年死亡", ages: "近一年死亡",
age: "1000", age: "6666",
percent: "", percent: "",
}, },
]; ];
@ -1195,8 +1195,8 @@ const getData = async (i, e) => {
} catch (error) { } catch (error) {
console.error("Error fetching data:", error); console.error("Error fetching data:", error);
} }
if (i) { if (e1) {
changeRs(i); changeRs(e1);
} }
}; };
const getDatas = async (e, i) => { const getDatas = async (e, i) => {
@ -1211,33 +1211,63 @@ const getDatas = async (e, i) => {
} else if (cfJd.value !== "") { } else if (cfJd.value !== "") {
personTotal.value = [ personTotal.value = [
{ {
id: "9999", // id: "9999",
ages: "总人口", ages: "总人口",
age: "", age: "9999",
value: "res.data.total", value: "res.data.total",
}, },
{ {
id: "6666", // id: "6666",
name: "近一年死亡", name: "近一年死亡",
value: "5650", value: "5650",
ages: "近一年死亡", ages: "近一年死亡",
age: "1000", age: "6666",
percent: "", percent: "",
}, },
]; ];
let before_age = "";
personTotal.value[0].rksl = res.data.total; personTotal.value[0].rksl = res.data.total;
personTotal.value[0].ages = "总人口"; personTotal.value[0].ages = "总人口";
personTotal.value[1].rksl = res.data.swrs; personTotal.value[1].rksl = res.data.swrs;
personTotal.value[1].ages = "近一年死亡"; personTotal.value[1].ages = "近一年死亡";
personTotal.value[1].percent = res.data.swrsPercent; personTotal.value[1].percent = res.data.swrsPercent;
res.data.age.forEach((item, index) => { res.data.age.forEach((item, index) => {
personTotal.value.push({ if (index == 0 && item.age == 0) {
id: index + 1, personTotal.value.push({
rksl: item.rksl, rksl: item.rksl,
age: item.age + "", age: item.age + "",
ages: item.age + "岁", ages: item.age + "岁",
percent: item.percent, percent: item.percent,
}); });
before_age = item.age;
} else {
if (item.age - before_age == 1) {
personTotal.value.push({
rksl: item.rksl,
age: item.age + "",
ages: item.age + "岁",
percent: item.percent,
});
before_age = item.age;
} else {
for (let k = before_age; k < item.age - 1; k++) {
before_age = before_age + 1;
personTotal.value.push({
rksl: 0,
age: before_age + "",
ages: before_age + "岁",
percent: 0.0,
});
}
personTotal.value.push({
rksl: item.rksl,
age: item.age + "",
ages: item.age + "岁",
percent: item.percent,
});
before_age = item.age;
}
}
}); });
} }
if (cfJd.value != "") { if (cfJd.value != "") {
@ -1346,17 +1376,18 @@ const getDatas2 = async (e, i, cs) => {
if (res.code == 200) { if (res.code == 200) {
personTotal.value = [ personTotal.value = [
{ {
id: "9999", // id: "9999",
name: "总人口",
ages: "总人口", ages: "总人口",
age: "", age: "9999",
value: "res.data.total", value: "res.data.total",
}, },
{ {
id: "6666", // id: "6666",
name: "近一年死亡", name: "近一年死亡",
value: "5650", value: "5650",
ages: "近一年死亡", ages: "近一年死亡",
age: "1000", age: "6666",
}, },
]; ];
personTotal.value[0].rksl = res.data.total; personTotal.value[0].rksl = res.data.total;
@ -1364,14 +1395,90 @@ const getDatas2 = async (e, i, cs) => {
personTotal.value[1].rksl = res.data.swrs; personTotal.value[1].rksl = res.data.swrs;
personTotal.value[1].ages = "近一年死亡"; personTotal.value[1].ages = "近一年死亡";
personTotal.value[1].percent = res.data.swrsPercent; personTotal.value[1].percent = res.data.swrsPercent;
// res.data.age.forEach((item, index) => {
// personTotal.value.push({
// id: index + 1,
// rksl: item.rksl,
// age: item.age + "",
// ages: item.age + "",
// percent: item.percent,
// });
// });
let before_age = "";
res.data.age.forEach((item, index) => { res.data.age.forEach((item, index) => {
personTotal.value.push({ // if (index == 0) {
id: index + 1, // personTotal.value.push({
rksl: item.rksl, // rksl: item.rksl,
age: item.age + "", // age: item.age + "",
ages: item.age + "岁", // ages: item.age + "",
percent: item.percent, // percent: item.percent,
}); // });
// before_age = item.age;
// console.log("111", before_age);
// } else {
// if (item.age - before_age == 1) {
// personTotal.value.push({
// rksl: item.rksl,
// age: item.age + "",
// ages: item.age + "",
// percent: item.percent,
// });
// before_age = item.age;
// } else {
// for (let i = 0; i < item.age - before_age - 1; i++) {
// ++before_age;
// personTotal.value.push({
// rksl: 0,
// age: before_age + "",
// ages: before_age + "",
// percent: 0.0,
// });
// }
// personTotal.value.push({
// rksl: item.rksl,
// age: item.age + "",
// ages: item.age + "",
// percent: item.percent,
// });
// before_age = item.age;
// }
// }
if (index == 0 && item.age == 0) {
personTotal.value.push({
rksl: item.rksl,
age: item.age + "",
ages: item.age + "岁",
percent: item.percent,
});
before_age = item.age;
} else {
if (item.age - before_age == 1) {
personTotal.value.push({
rksl: item.rksl,
age: item.age + "",
ages: item.age + "岁",
percent: item.percent,
});
before_age = item.age;
} else {
for (let k = before_age; k < item.age - 1; k++) {
before_age = before_age + 1;
personTotal.value.push({
rksl: 0,
age: before_age + "",
ages: before_age + "岁",
percent: 0.0,
});
}
personTotal.value.push({
rksl: item.rksl,
age: item.age + "",
ages: item.age + "岁",
percent: item.percent,
});
before_age = item.age;
}
}
}); });
xkzCenter.map((item) => { xkzCenter.map((item) => {
item.swrs = 0; item.swrs = 0;
@ -1722,11 +1829,12 @@ const to_jd = (item_name) => {
if (choose.value.person == "9999") { if (choose.value.person == "9999") {
getDatas(cfJd.value, ""); getDatas(cfJd.value, "");
} else { } else {
if (choose.value.person == 1) { // if (choose.value.person == 1) {
getDatas(cfJd.value, "0"); //0 // getDatas(cfJd.value, "0"); //0
} else { // } else {
getDatas(cfJd.value, choose.value.person - 1); // getDatas(cfJd.value, choose.value.person);
} // }
getDatas(cfJd.value, choose.value.person);
} }
} }
// if (title_jd.value == item.name) { // if (title_jd.value == item.name) {
@ -1746,18 +1854,29 @@ const to_jd = (item_name) => {
// //
const open_detail = () => { const open_detail = () => {
let age = ""; let age = "";
// if (choose.value.person == "9999") {
// age = "";
// person_detail(age);
// dialogShow.value = true;
// } else if (choose.value.person == "6666") {
// age = "";
// } else if (choose.value.person == 1) {
// age = "0";
// person_detail(age);
// dialogShow.value = true;
// } else {
// age = choose.value.person - 1;
// person_detail(age);
// dialogShow.value = true;
// }
if (choose.value.person == "9999") { if (choose.value.person == "9999") {
age = ""; age = "";
person_detail(age); person_detail(age);
dialogShow.value = true; dialogShow.value = true;
} else if (choose.value.person == "6666") { } else if (choose.value.person == "6666") {
age = ""; age = "";
} else if (choose.value.person == 1) {
age = "0";
person_detail(age);
dialogShow.value = true;
} else { } else {
age = choose.value.person - 1; age = choose.value.person;
person_detail(age); person_detail(age);
dialogShow.value = true; dialogShow.value = true;
} }
@ -1765,21 +1884,26 @@ const open_detail = () => {
const close = () => { const close = () => {
dialogShow.value = false; dialogShow.value = false;
pagination.total = 100; pagination.total = 100;
pagination.currentPage = 1;
}; };
// //
const handlePagination = (current) => { const handlePagination = (current) => {
pagination.currentPage = current; pagination.currentPage = current;
let age = ""; let age = "";
// if (choose.value.person == "9999") {
// age = "";
// } else if (choose.value.person == "6666") {
// age = "";
// } else if (choose.value.person == 1) {
// age = "0";
// } else {
// age = choose.value.person - 1;
// }
if (choose.value.person == "9999") { if (choose.value.person == "9999") {
age = ""; age = "";
} else if (choose.value.person == "6666") { } else if (choose.value.person == "6666") {
age = ""; age = "";
} else if (choose.value.person == 1) {
age = "0";
} else { } else {
age = choose.value.person - 1; age = choose.value.person;
} }
person_detail(age); person_detail(age);
}; };
@ -1789,14 +1913,14 @@ const openMessage = (e) => {
openD.value = false; openD.value = false;
reset_font2(); reset_font2();
// //
window.addEventListener('resize', reset_font2); window.addEventListener("resize", reset_font2);
}; };
// //
const closeDetail = () => { const closeDetail = () => {
openD.value = true; openD.value = true;
window.removeEventListener('resize', reset_font2); window.removeEventListener("resize", reset_font2);
}; };
// //
const person_detail = (age) => { const person_detail = (age) => {
http http
.get( .get(
@ -2140,11 +2264,13 @@ const addPolygonCounty = () => {
if (choose.value.person == "9999") { if (choose.value.person == "9999") {
getDatas(cfJd.value, ""); getDatas(cfJd.value, "");
} else { } else {
if (choose.value.person == 1) { // if (choose.value.person == 1) {
getDatas(cfJd.value, "0"); //0 // getDatas(cfJd.value, "0"); //0
} else { // } else {
getDatas(cfJd.value, choose.value.person - 1); // getDatas(cfJd.value, choose.value.person - 1);
} // }
getDatas(cfJd.value, choose.value.person);
} }
} }
if (title_jd.value == item.name) { if (title_jd.value == item.name) {
@ -2415,11 +2541,12 @@ const addPolygonCountyCs = () => {
// getDataBqs(cfJd.value, cfCs.value); // getDataBqs(cfJd.value, cfCs.value);
} }
// //
if (choose.value.person == 1) { // if (choose.value.person == 1) {
getDatas2(cfJd.value, "0", cfCs.value); //0 // getDatas2(cfJd.value, "0", cfCs.value); //0
} else { // } else {
getDatas2(cfJd.value, choose.value.person - 1, cfCs.value); // getDatas2(cfJd.value, choose.value.person - 1, cfCs.value);
} // }
getDatas2(cfJd.value, choose.value.person, cfCs.value);
// getDatas2(cfJd.value, choose.value.person, cfCs.value); // getDatas2(cfJd.value, choose.value.person, cfCs.value);
addCsChoose(); addCsChoose();
addCsUnChoose(); addCsUnChoose();
@ -2513,11 +2640,12 @@ const addCsUnChoose = () => {
// }); // });
// getDataBqs(cfJd.value, cfCs.value); // getDataBqs(cfJd.value, cfCs.value);
getDataBq(cfJd.value, cfCs.value); getDataBq(cfJd.value, cfCs.value);
if (choose.value.person == 1) { // if (choose.value.person == 1) {
getDatas2(cfJd.value, "0", cfCs.value); //0 // getDatas2(cfJd.value, "0", cfCs.value); //0
} else { // } else {
getDatas2(cfJd.value, choose.value.person - 1, cfCs.value); // getDatas2(cfJd.value, choose.value.person - 1, cfCs.value);
} // }
getDatas2(cfJd.value, choose.value.person, cfCs.value);
// getDatas2(cfJd.value, choose.value.person, cfCs.value); // getDatas2(cfJd.value, choose.value.person, cfCs.value);
// if ( // if (
// choose.value.person == "cjr" || // choose.value.person == "cjr" ||
@ -2888,8 +3016,6 @@ const reset_font = () => {
} }
}; };
const reset_font2 = () => { const reset_font2 = () => {
console.log(111111);
let width = document.documentElement.clientWidth || document.body.clientWidth; let width = document.documentElement.clientWidth || document.body.clientWidth;
let height = let height =
document.documentElement.clientHeight || document.body.clientHeight; document.documentElement.clientHeight || document.body.clientHeight;
@ -2905,7 +3031,6 @@ onMounted(() => {
getData(); getData();
getDataBq(); getDataBq();
BMAP(); BMAP();
}); });
</script> </script>

View File

@ -2,8 +2,11 @@
<div class="module11"> <div class="module11">
<div class="displayFlex left_bg"> <div class="displayFlex left_bg">
<div class="flex1"> <div class="flex1">
<div class="yd_title " :class="leftchoose.first == '1' ? 'left_1' : 'left_1_1'" <div
@click="change2('first')"> class="yd_title"
:class="leftchoose.first == '1' ? 'left_1' : 'left_1_1'"
@click="change2('first')"
>
<div class="animate-border"> <div class="animate-border">
<i></i> <i></i>
<i></i> <i></i>
@ -120,20 +123,20 @@
</div> </div>
</div> </div>
<div class="center_top"> <div class="center_top">
<div class="item"> <div class="item5">
<img src="@/assets/images/hygiene/mjzrc.png" class="left" /> <img src="@/assets/images/hygiene/mjzrc.png" class="left5" />
<div class="right"> <div class="right5">
<div class="right_top font">门急诊人次</div> <div class="right5_top font">门急诊人次</div>
<img src="@/assets/images/hygiene/jt.png" class="right_center" /> <img src="@/assets/images/hygiene/jt.png" class="right5_center" />
<div class="right_bottom">{{ data.mz.mjzrc }}</div> <div class="right5_bottom">{{ data.mz.mjzrc }}</div>
</div> </div>
</div> </div>
<div class="item"> <div class="item5">
<img src="@/assets/images/hygiene/zyrs.png" class="left" /> <img src="@/assets/images/hygiene/zyrs.png" class="left5" />
<div class="right"> <div class="right5">
<div class="right_top font">住院人数</div> <div class="right5_top font">住院人数</div>
<img src="@/assets/images/hygiene/jt.png" class="right_center" /> <img src="@/assets/images/hygiene/jt.png" class="right5_center" />
<div class="right_bottom">{{ data.mz.zyrs }}</div> <div class="right5_bottom">{{ data.mz.zyrs }}</div>
</div> </div>
</div> </div>
</div> </div>
@ -160,24 +163,26 @@
src="@/assets/images/hygiene/jd.gif" src="@/assets/images/hygiene/jd.gif"
alt="" alt=""
/> />
<div class="historyimg font" style="padding:0 20px;">建档份数</div> <div class="historyimg font" style="padding: 0 20px">
建档份数
</div>
</div> </div>
</div> </div>
<div class="minTopPart2"> <div class="minTopPart2">
<div class="left"> <div class="left5">
<div class="leftImg"> <div class="leftImg5">
<eP4 :list="data.jkda.jdl" v-if="showEchart"></eP4> <eP4 :list="data.jkda.jdl" v-if="showEchart"></eP4>
</div> </div>
<div class="left_me"> <div class="left5_me">
<div>建档率</div> <div>建档率</div>
<div class="bo">{{ data.jkda.jdl }}%</div> <div class="bo">{{ data.jkda.jdl }}%</div>
</div> </div>
</div> </div>
<div class="right"> <div class="right5">
<div class="rightImg"> <div class="rightImg5">
<eP4_1 :list="data.jkda.jtysqyl" v-if="showEchart"></eP4_1> <eP4_1 :list="data.jkda.jtysqyl" v-if="showEchart"></eP4_1>
</div> </div>
<div class="right_me"> <div class="right5_me">
<div>家庭医生签约率</div> <div>家庭医生签约率</div>
<div class="bo">{{ data.jkda.jtysqyl }}%</div> <div class="bo">{{ data.jkda.jtysqyl }}%</div>
</div> </div>
@ -211,14 +216,14 @@
<img src="@/assets/images/hygiene/fy.png" alt="" /> <img src="@/assets/images/hygiene/fy.png" alt="" />
<img src="@/assets/images/hygiene/fy1.png" alt="" class="fyMove" /> <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.gif" class="historyMoveImg" />
<div class="historyimg font" >孕产妇系统管理人数</div> <div class="historyimg font">孕产妇系统管理人数</div>
</div> </div>
<div class="history1"> <div class="history1">
<div class="va">{{ data.fyglrs.etrs }}</div> <div class="va">{{ data.fyglrs.etrs }}</div>
<img src="@/assets/images/hygiene/fy.png" alt="" /> <img src="@/assets/images/hygiene/fy.png" alt="" />
<img src="@/assets/images/hygiene/fy2.png" alt="" class="fyMove" /> <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.gif" class="historyMoveImg" />
<div class="historyimg font" >0-6岁儿童系统管理人数</div> <div class="historyimg font">0-6岁儿童系统管理人数</div>
</div> </div>
</div> </div>
</div> </div>
@ -297,7 +302,7 @@ const data = reactive({
fyglrs: {}, // fyglrs: {}, //
jktj: {}, //65 jktj: {}, //65
jkhd: [], // jkhd: [], //
lxbx:{},// lxbx: {}, //
}); });
const tabYd = ref([ const tabYd = ref([
{ {
@ -316,7 +321,7 @@ const lmbqh = () => {
}; };
// //
const change2 = (name) => { const change2 = (name) => {
if (leftchoose.value[name] == "0") { if (leftchoose.value[name] == "0") {
leftchoose.value[name] = "1"; leftchoose.value[name] = "1";
} else { } else {
leftchoose.value[name] = "0"; leftchoose.value[name] = "0";
@ -412,7 +417,7 @@ const getData = async () => {
.module11 { .module11 {
display: flex; display: flex;
width: 100%; width: 100%;
// margin-top: 112px; // margin-top: 112px;
} }
.yd_title { .yd_title {
@ -746,26 +751,26 @@ const getData = async () => {
display: flex; display: flex;
align-items: center; align-items: center;
justify-content: space-around; justify-content: space-around;
.item { .item5 {
display: flex; display: flex;
align-items: center; align-items: center;
.left { .left5 {
width: 102px; width: 102px;
height: 102px; height: 102px;
} }
.right { .right5 {
margin-left: 10px; margin-left: 10px;
.right_top { .right5_top {
font-size: 16px; font-size: 16px;
color: #ffffff; color: #ffffff;
line-height: 22px; line-height: 22px;
letter-spacing: 2px; letter-spacing: 2px;
} }
.right_center { .right5_center {
width: 100px; width: 100px;
height: 7px; height: 7px;
} }
.right_bottom { .right5_bottom {
margin-top: 3px; margin-top: 3px;
padding: 5px; padding: 5px;
font-size: 22px; font-size: 22px;
@ -1187,30 +1192,34 @@ const getData = async () => {
} }
.minTopPart2 { .minTopPart2 {
margin-left: 5px; margin-left: 5px;
width: 420px; width: 390px;
height: 136px; height: 160px;
background-image: url(@/assets/images/hygiene/xia_1.png); background-image: url(@/assets/images/hygiene/xia_1.png);
background-repeat: no-repeat; background-repeat: no-repeat;
background-size: 100% 100%; background-size: 100% 100%;
align-items: center; align-items: center;
position: relative; position: relative;
display: flex; display: flex;
justify-content: space-around;
margin-top: 35px; margin-top: 35px;
padding: 0 5px; padding: 0 5px;
box-sizing: border-box; box-sizing: border-box;
.left { .left5 {
display: flex; display: flex;
flex-direction: column;
align-items: center; align-items: center;
justify-content: center; justify-content: center;
margin-left: 13px; margin-left: 13px;
.leftImg { .leftImg5 {
width: 90px; width: 90px;
height: 90px; height: 90px;
margin-bottom: 10px;
} }
.left_me { .left5_me {
margin-left: 10px; margin-left: 10px;
display: flex; display: flex;
flex-direction: column; flex-direction: column;
text-align: center;
font-family: PingFangSC, PingFang SC; font-family: PingFangSC, PingFang SC;
font-weight: 500; font-weight: 500;
font-size: 14px; font-size: 14px;
@ -1220,7 +1229,7 @@ const getData = async () => {
text-shadow: 0px 0px 4px rgba(255, 255, 255, 0.65); text-shadow: 0px 0px 4px rgba(255, 255, 255, 0.65);
.bo { .bo {
margin-top: 5px; // margin-top: 5px;
font-family: TCloudNumber, TCloudNumber; font-family: TCloudNumber, TCloudNumber;
font-weight: bold; font-weight: bold;
font-size: 18px; font-size: 18px;
@ -1230,19 +1239,20 @@ const getData = async () => {
} }
} }
} }
.right { .right5 {
display: flex; display: flex;
flex-direction: column;
align-items: center; align-items: center;
// justify-content: center; justify-content: center;
.rightImg5 {
.rightImg {
width: 90px; width: 90px;
height: 90px; height: 90px;
margin-bottom: 10px;
} }
.right_me { .right5_me {
margin-left: 10px;
display: flex; display: flex;
flex-direction: column; flex-direction: column;
text-align: center;
font-family: PingFangSC, PingFang SC; font-family: PingFangSC, PingFang SC;
font-weight: 500; font-weight: 500;
font-size: 14px; font-size: 14px;
@ -1251,7 +1261,6 @@ const getData = async () => {
letter-spacing: 2px; letter-spacing: 2px;
text-shadow: 0px 0px 4px rgba(255, 255, 255, 0.65); text-shadow: 0px 0px 4px rgba(255, 255, 255, 0.65);
.bo { .bo {
margin-top: 5px;
font-family: TCloudNumber, TCloudNumber; font-family: TCloudNumber, TCloudNumber;
font-weight: bold; font-weight: bold;
font-size: 18px; font-size: 18px;
@ -1319,7 +1328,7 @@ const getData = async () => {
margin-top: 15px; margin-top: 15px;
margin-bottom: 10px; margin-bottom: 10px;
} }
.font{ .font {
font-size: 18px !important; font-size: 18px !important;
} }
</style> </style>