更新

src/views/home/index.vue

@@ -112,7 +112,8 @@
       <div style="width: 33%;">
          <transition name="flip" mode="out-in">
           <div :key="'qb'" v-if="modelWarning" class="flip-wrapper">
-            <WarningLevels @changeModel="changeModel"></WarningLevels>
+            <SevenWarning @changeModel="changeModel"></SevenWarning>
+            <!-- <WarningLevels @changeModel="changeModel"></WarningLevels> -->
           </div>
           <div :key="'text'" v-else class="flip-wrapper">
             <BkWarning @changeModel="changeModel"></BkWarning>
@@ -143,7 +144,8 @@ import QbsbCount from './model/qbsbCount.vue'
 import QblyType from './model/qblyType.vue'
 import TextType from './model/textType.vue'
 import Bkcz from './model/bkcz.vue'
-import WarningLevels from './model/warningLevels.vue'
+import SevenWarning from './model/sevenWarning.vue'
+// import WarningLevels from './model/warningLevels.vue'
 import BkWarning from './model/bkWarning.vue'
 import Yszs from './model/yszs.vue'
 import DeployControl from './model/deployControl.vue';

src/views/home/model/sevenWarning.vue

@@ -0,0 +1,70 @@
+<template>
+  <div class="comom-title">
+  <div class="title">7类重点人统计<span class="switchover" @click.stop="reversalPush">切换</span></div>
+  </div>
+  <div class="comom-cnt" style="border-right: 1px solid #ebebeb;width: 100%;" v-loading="loadingyj">
+     <WarningCount ref="yjjbRef"></WarningCount>
+  </div>
+</template>
+
+<script setup>
+import { qcckGet, qcckPost } from "@/api/qcckApi.js";
+import WarningCount from "@/views/backOfficeSystem/fourColorManage/warningControl/centerHome/components/WarningCount.vue";
+import { onMounted,ref,defineEmits } from "vue";
+const yjjbRef = ref()
+const loadingyj = ref(false)
+
+const emit = defineEmits(["changeModel"])
+const reversalPush = () => {
+  emit('changeModel')
+}
+
+const getYjczDate = () => {
+  loadingyj.value = true;
+  qcckGet({}, '/mosty-gsxt/tbYjxx/qlzdrYjjb').then(res => {
+    loadingyj.value = false;
+    yjjbRef.value.initCharts(res)
+  })
+};
+onMounted(() => {
+getYjczDate()
+});
+
+</script>
+
+
+<style lang="scss" scoped>
+@import "@/assets/css/homeScreen.scss";
+::v-deeep .comom-title{
+  background: url("~@/assets/images/bg18.png") no-repeat center center;
+  background-size: 100% 100%;
+}
+::v-deeep .comom-cnt{
+  background: url("~@/assets/images/bg18.png") no-repeat center center;
+  background-size: 100% 100%;
+}
+
+::v-deep .el-table td.el-table__cell{
+  color: #ffffff;
+}
+
+::v-deep .el-table--striped .el-table__body tr.el-table__row--striped td.el-table__cell{
+  background: rgba(0,61,130,0.75);
+}
+.switchover{
+  cursor: pointer;
+  font-size: 14px;
+  margin-left: 20px;
+  color: rgb(255, 146, 4);
+}
+</style>
+<style lang="scss">
+.zdy_bkcz_table td.el-table__cell {
+    color: #ffffff !important;
+}
+.zdy_bkcz_table th.el-table__cell {
+    color: #ffffff !important;
+    font-size: 15px;
+}
+
+</style>

src/views/home/model/warningLevels.vue

@@ -30,13 +30,6 @@ onMounted(() => {
 getYjczDate()
 });
 
-// const tabHeightFn = () => {
-//   pageData.tableHeight =  document.getElementById('qcbk').offsetHeight - 12;
-//   window.onresize = function () {
-//     tabHeightFn();
-//   };
-// };
-
 </script>