详情弹窗样式更新

src/views/vent/home/configurable/components/gasInject/zqDetailCard.vue

@@ -1,15 +1,15 @@
 <template>
   <div class="detail-card">
-      <div class="card-title">{{ `${dataIndex}#数据` }}</div>
-      <div class="card-content">
-        <div style="width:100%;height:100%;overflow-y: auto;">
-          <div class="card-content-item" v-for="(item, index) in optionDetail" :key="index">
+    <div class="card-title">{{ `${dataIndex}#数据` }}</div>
+    <div class="card-content">
+      <div class="card-content-box">
+        <div class="card-content-item" v-for="(item, index) in optionDetail" :key="index">
           <div class="content-item-label">{{ item.label }}</div>
           <div class="content-item-value">{{ zqDetailData[item.value] }}</div>
         </div>
-        </div>
       </div>
-   
+    </div>
+
   </div>
 </template>
 
@@ -22,14 +22,14 @@ let props = defineProps({
     type: Array as any
   },
   //数据序列
-  dataIndex:{
-    type:Number
+  dataIndex: {
+    type: Number
   },
   //分组数据
   zqDetailData: {
     type: Object as any
   },
- 
+
 })
 </script>
 
@@ -63,17 +63,24 @@ let props = defineProps({
   }
 
   .card-content {
-    display: flex;
-    flex-direction: column;
-    justify-content: space-between;
-    align-items: center;
+
     width: 100%;
     height: calc(100% - 56px);
     border-radius: 15px;
     /* 内阴影 */
     box-shadow: inset 0px 0px 15px rgba(34, 142, 220, 0.8);
-    padding:10px 15px;
-  
+    padding: 10px 15px;
+
+  }
+
+  .card-content-box {
+    display: flex;
+    flex-direction: column;
+    justify-content: space-between;
+    align-items: center;
+    width: 100%;
+    height: 100%;
+    overflow-y: auto;
   }
 
   .card-content-item {