大屏二级页面配置

src/views/big-screen/model-components/center-model.vue

@@ -20,7 +20,11 @@
                     </div>
                     <div></div>
                 </div>
-                <div class="info-box info-box_1" style="transform: translateY(-9vh)">
+                <div
+                    class="info-box info-box_1"
+                    style="transform: translateY(-9vh)"
+                    @click="handleDetail(2)"
+                >
                     <div class="yyyy">上架装备数</div>
                     <div>
                         <span class="xxxx">
@@ -30,7 +34,11 @@
                     </div>
                     <div></div>
                 </div>
-                <div class="info-box info-box_1" style="transform: translateY(-9vh)">
+                <div
+                    class="info-box info-box_1"
+                    style="transform: translateY(-9vh)"
+                    @click="handleDetail(3)"
+                >
                     <div class="yyyy">装备总类型数</div>
                     <div>
                         <span class="xxxx">
@@ -40,7 +48,11 @@
                     </div>
                     <div></div>
                 </div>
-                <div class="info-box info-box_1" style="transform: translateY(-14.5vh)">
+                <div
+                    class="info-box info-box_1"
+                    style="transform: translateY(-14.5vh)"
+                    @click="handleDetail(4)"
+                >
                     <div class="yyyy">保养告警</div>
                     <div>
                         <span class="xxxx">
@@ -58,7 +70,11 @@
                 <img src="@/assets/img/screen/装备租赁.png" style="width: 100%; height: 70%" />
             </div>
             <div class="item-info">
-                <div class="info-box info-box_2" style="transform: translateY(-14vh)">
+                <div
+                    class="info-box info-box_2"
+                    style="transform: translateY(-14vh)"
+                    @click="handleDetail(5)"
+                >
                     <div>
                         <span class="xxxx">
                             {{ maTypeLeasingNum || 0 }}
@@ -68,7 +84,11 @@
                     <div>在租赁种类</div>
                     <div></div>
                 </div>
-                <div class="info-box info-box_2" style="transform: translateY(-8.5vh)">
+                <div
+                    class="info-box info-box_2"
+                    style="transform: translateY(-8.5vh)"
+                    @click="handleDetail(6)"
+                >
                     <div>
                         <span class="xxxx">
                             {{ devLeasingNum || 0 }}
@@ -78,7 +98,11 @@
                     <div>在租装备数</div>
                     <div></div>
                 </div>
-                <div class="info-box info-box_2" style="transform: translateY(-8.5vh)">
+                <div
+                    class="info-box info-box_2"
+                    style="transform: translateY(-8.5vh)"
+                    @click="handleDetail(7)"
+                >
                     <div>
                         <span class="xxxx">
                             {{ devRepairingNum || 0 }}
@@ -88,7 +112,11 @@
                     <div>退租装备数</div>
                     <div></div>
                 </div>
-                <div class="info-box info-box_2" style="transform: translateY(-14vh)">
+                <div
+                    class="info-box info-box_2"
+                    style="transform: translateY(-14vh)"
+                    @click="handleDetail(8)"
+                >
                     <div>
                         <span class="xxxx"> {{ devUsageRatio || 0 }}% </span>
                         <!-- <span class="zzzz"> 台 </span> -->
@@ -104,7 +132,11 @@
                 <img src="@/assets/img/screen/装备需求.png" style="width: 100%; height: 70%" />
             </div>
             <div class="item-info">
-                <div class="info-box info-box_3" style="transform: translateY(-12.5vh)">
+                <div
+                    class="info-box info-box_3"
+                    style="transform: translateY(-12.5vh)"
+                    @click="handleDetail(9)"
+                >
                     <div>
                         <span class="xxxx">
                             {{ leaseNum || 0 }}
@@ -114,7 +146,11 @@
                     <div>需求总数</div>
                     <div></div>
                 </div>
-                <div class="info-box info-box_3" style="transform: translateY(-7.5vh)">
+                <div
+                    class="info-box info-box_3"
+                    style="transform: translateY(-7.5vh)"
+                    @click="handleDetail(10)"
+                >
                     <div>
                         <span class="xxxx">
                             {{ maTypeCountFromLease || 0 }}
@@ -124,7 +160,11 @@
                     <div>需求装备种类</div>
                     <div></div>
                 </div>
-                <div class="info-box info-box_3 info-box_4" style="transform: translateY(-7.5vh)">
+                <div
+                    class="info-box info-box_3 info-box_4"
+                    style="transform: translateY(-7.5vh)"
+                    @click="handleDetail(11)"
+                >
                     <div>第一</div>
                     <div>
                         {{ topPopularTypeName || '' }}
@@ -132,7 +172,11 @@
                     <div>最需装备</div>
                     <div></div>
                 </div>
-                <div class="info-box info-box_3" style="transform: translateY(-12.5vh)">
+                <div
+                    class="info-box info-box_3"
+                    style="transform: translateY(-12.5vh)"
+                    @click="handleDetail(12)"
+                >
                     <div>
                         <span class="xxxx">
                             {{ leaseOrderRatio || 0 }}
@@ -207,12 +251,58 @@ const handleDetail = (type: any) => {
         title: '',
         column: [],
     }
+    let path = ''
     if (type == 1) {
         params.title = '入驻装备数'
         params.type = 1
+        path = '/detail-list-f'
+    } else if (type == 2) {
+        params.title = '上架装备数'
+        params.type = 2
+        path = '/detail-list-f'
+    } else if (type == 3) {
+        params.title = '装备总类型数'
+        params.type = 3
+        path = '/detail-list-f'
+    } else if (type == 4) {
+        params.title = '保养告警'
+        params.type = 4
+        path = '/detail-list-f'
+    } else if (type == 5) {
+        params.title = '在租赁种类'
+        params.type = 5
+        path = '/detail-list-f'
+    } else if (type == 6) {
+        params.title = '在租装备数'
+        params.type = 6
+        path = '/detail-list-f'
+    } else if (type == 7) {
+        params.title = '退租装备数'
+        params.type = 7
+        path = '/detail-list'
+    } else if (type == 8) {
+        params.title = '装备利用率'
+        params.type = 8
+        path = '/detail-list'
+    } else if (type == 9) {
+        params.title = '需求总数'
+        params.type = 9
+        path = '/detail-list'
+    } else if (type == 10) {
+        params.title = '需求装备种类'
+        params.type = 10
+        path = '/detail-list'
+    } else if (type == 11) {
+        params.title = '最需装备'
+        params.type = 11
+        path = '/detail-list'
+    } else if (type == 12) {
+        params.title = '需求应答率'
+        params.type = 12
+        path = '/detail-list'
     }
     router.push({
-        path: '/detail-list-f',
+        path,
         query: params,
     })
 }