企业技术需求和产品 、专家成果上传自动审核

src/views/website/home/comp/index6.vue

@@ -11,14 +11,26 @@
         <div class="a">地区</div>
         <div class="b">需求数量</div>
       </div>
-      <div v-if="Object.keys(snapTree).length > 0" v-for="v in snapTree">
-        <div class="a">{{ v.name }}</div>
-        <div class="b">{{ v.count }}</div>
-      </div>
+      <template v-if="snapTree.length > 0">
+        <div
+          v-for="v in snapTree.slice(
+            (leftBoxPageNum - 1) * 5,
+            leftBoxPageNum * 5
+          )"
+        >
+          <div class="a">{{ v.name }}</div>
+          <div class="b">{{ v.count }}</div>
+        </div>
+      </template>
       <div v-else>
         <div class="a">暂无</div>
         <div class="b">暂无</div>
       </div>
+      <RegionPagine
+        v-if="snapTree.length"
+        v-model:page="leftBoxPageNum"
+        :total="snapTree.length"
+      ></RegionPagine>
     </div>
     <div class="rightBox">
       <div class="head">
@@ -48,15 +60,16 @@ import {
   countDemandByCity,
   countDemandByArea,
 } from "@/api/website/home/index";
+import RegionPagine from "./RegionPagine.vue";
 // import { demand } from "@/api/website/home/index";
 
 const { proxy } = getCurrentInstance();
 const loading = shallowRef(true);
 
 let treeData = {};
-const snapTree = shallowRef({});
+const snapTree = shallowRef([]);
 const industryTree = shallowRef({});
-
+const leftBoxPageNum = ref(1);
 const searchRegionData = async (code, level) => {
   if (level == "province") {
     const provcode = code.substring(0, 2) + "0000";
@@ -93,7 +106,7 @@ const searchRegionData = async (code, level) => {
   } else {
     if (Object.keys(treeData).length) {
       industryTree.value = treeData.industry ?? {};
-      snapTree.value = treeData.count ?? {};
+      snapTree.value = treeData.count ?? [];
       return treeData.count.find((item) => item.code == code) || false;
     } else {
       const { count, industry } = await countDemandByProvince();
@@ -403,7 +416,7 @@ function loadMap(mapName, data) {
               borderColor: "#666666",
               borderWidth: 0.5,
               label: {
-                show: true,
+                show: false,
                 textStyle: {
                   color: "#333333",
                 },
@@ -497,7 +510,7 @@ function loadMap(mapName, data) {
   max-width: 250px;
   min-width: 200px;
   max-height: 256px;
-  overflow: hidden;
+  // overflow: hidden;
   border: 1px solid #dcdcdc;
   color: #666666;
   & > div {
@@ -522,4 +535,13 @@ function loadMap(mapName, data) {
     width: 90px;
   }
 }
+.rightBox {
+  overflow: hidden;
+}
+:deep(.pagine) {
+  .prev,
+  .next {
+    color: #000 !important;
+  }
+}
 </style>