新增预警积分排名

src/views/home/index.vue

@@ -81,7 +81,8 @@
     <!-- 底部 -->
     <div class="home-foot-t">
       <div style="width: 33%;">
-        <WarningDistrict></WarningDistrict>
+        <!-- <WarningDistrict></WarningDistrict> -->
+        <WarningPoints></WarningPoints>
       </div>
       <div style="width: 33%;">
         <WarningLevels></WarningLevels>
@@ -98,6 +99,7 @@
 </template>
 
 <script setup>
+import { qcckGet ,qcckPost} from "@/api/qcckApi.js";
 import { ref, onMounted, onUnmounted } from 'vue'
 import LeftDialog from './dialog/leftDialog'
 import GdMap from "@/components/GdMap/index.vue";
@@ -114,6 +116,7 @@ import Experience from './model/experience.vue'
 import Calendar from './model/calendar.vue'
 import KeyPpersonneltypes from './model/keyPpersonneltypes.vue'
 import WarningDistrict from './model/WarningDistrict.vue'
+import WarningPoints from './model/warningPoints.vue'
 import { getItem, setItem } from "@/utils/storage";
 import emitter from "@/utils/eventBus.js";
 import { bm, centralPoint } from '@/views/backOfficeSystem/IntelligentControl/DeploymentArea/xzqh.js'
@@ -216,10 +219,17 @@ const getDepId = () => {
 }
 const makerCenter = () => {
   const dw = require("@/assets/point/dingwei.png")
-  const coords = centralPoint.map(item => {
-    return { jd: item.point[0], wd: item.point[1], jzMc: item.name }
+  qcckGet({},'/mosty-gsxt/tbYjxx/selectSsbm').then(res=>{
+    let list = res || [];
+    list.forEach(item => {
+      let obj = centralPoint.find(i => i.name == item.ssbm);
+      if(obj){
+        item.jd = obj.point[0];
+        item.wd = obj.point[1];
+      }
+    })
+    emitter.emit("addPointArea", { coords:list, icon: dw, flag: "hm", size: '14px', showTitle: false, offset: [0, -25] });
   })
-  emitter.emit("addPointArea", { coords, icon: dw, flag: "hm", size: '14px', showTitle: true, offset: [0, -25] });
 }
 //播放音频
 const ispLayBack = ref(true)

src/views/home/model/warningPoints.vue

@@ -0,0 +1,88 @@
+<template>
+    <div class="comom-title">
+        <span class="title">预警积分排名</span>
+    </div>
+     <div class="comom-cnt zdryBox">
+        <DarkTable
+            customClass="zdy_bkcz_table"
+            :tableData="pageData.tableData"
+            :tableColumn="pageData.tableColumn"
+            :tableHeight="pageData.tableHeight"
+            :key="pageData.keyCount"
+            :isScroll="true"
+            :tableConfiger="pageData.tableConfiger"
+            >
+        </DarkTable>
+     </div>
+</template>
+
+<script setup>
+import { reactive,onMounted } from 'vue'
+import DarkTable from '@/components/aboutTable/DarkTable.vue'
+import { qcckGet } from "@/api/qcckApi.js";
+const pageData = reactive({
+  tableData: [],
+  keyCount: 0,
+  tableConfiger: {
+    loading: false,
+    rowHieght: 61,
+    haveControls: false,
+    showSelectType: "null",
+    showIndex: false,
+    stripe: true
+  },
+  tableColumn: [
+    { label: "姓名", prop: "ryxm", showOverflowTooltip: true },
+    { label: "身份证", prop: "rysfzh", showOverflowTooltip: true },
+    { label: "积分", prop: "sffz", showOverflowTooltip: true },
+    { label: "排名", prop: "order", showOverflowTooltip: true },
+  ]
+});
+onMounted(() => {
+  getList()
+})
+
+const getList = () => {
+  pageData.tableConfiger.loading = true
+  qcckGet({},'/mosty-gsxt/tbYjxx/selectYjxxFzTen').then(res => {
+      let list = res || []
+      pageData.tableData = list.map((item, index) => {
+        item.order = index + 1
+        return item
+      })
+    pageData.tableConfiger.loading = false
+  }).catch(() => {
+    pageData.tableConfiger.loading = false
+  })
+}
+</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-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);
+}
+</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>