浏览代码

fix: 优化设备详情页面运行状态中属性值保留小数的问题,并优化原来渲染逻辑,减少多余循环

yanglzh 1 年之前
父节点
当前提交
5caa0b1974
共有 1 个文件被更改,包括 54 次插入63 次删除
  1. 54 63
      src/views/iot/device/instance/detail.vue

+ 54 - 63
src/views/iot/device/instance/detail.vue

@@ -1,5 +1,5 @@
 <template>
-  <div class="page bg">
+  <div class="page bg page-full">
     <div class="content">
       <div class="cont_box">
         <div class="title">设备:{{ detail.name }}</div>
@@ -9,11 +9,11 @@
       </div>
     </div>
 
-    <div class="content-box">
+    <div class="content-box page-full-part page-full">
       <el-tabs v-model="activeName" @tab-click="handleClick">
 
         <el-tab-pane label="运行状态" name="3">
-          <div style=" display: flex; padding: 10px;flex-wrap: wrap;">
+          <div style=" display: flex;flex-wrap: wrap;">
             <div class="ant-card">
               <div class="ant-card-body">
                 <div class="cardflex">
@@ -316,35 +316,35 @@
           <el-form label-width="110px">
 
             <!--            <FromData :DataList="Datalist" v-if="Datalist && Datalist.length > 0" disable="true"></FromData>-->
-<!--            <div class="pro-box">-->
-<!--              <div class="protitle">设备档案</div>-->
-<!--              <div>-->
-<!--                <el-button type="primary" v-auth="'edit'" @click="onOpenEditAsset">编辑</el-button>-->
-<!--              </div>-->
-<!--            </div>-->
-
-<!--            <div class="ant-descriptions-view">-->
-<!--              <table>-->
-<!--                <tbody>-->
-<!--                <tr class="ant-descriptions-row" v-for="(item, index) in dataList" :key="index">-->
-<!--                  <th class="ant-descriptions-item-label ant-descriptions-item-colon">{{ item.title }}</th>-->
-<!--                  <td class="ant-descriptions-item-content" colspan="1">-->
-<!--                    <view v-if="item.types === 'file'">-->
-<!--                      <img :src="deviceAssetMetadata[item.name]" class="avatar" />-->
-<!--                    </view>-->
-<!--                    <view v-else>-->
-<!--                      <view v-if="item.pattern">-->
-<!--                        <el-link :href="deviceAssetMetadata[item.name]" type="primary" target="_blank">{{ deviceAssetMetadata[item.name] }}</el-link>-->
-<!--                      </view>-->
-<!--                      <view v-else>-->
-<!--                        {{ deviceAssetMetadata[item.name] }}-->
-<!--                      </view>-->
-<!--                    </view>-->
-<!--                  </td>-->
-<!--                </tr>-->
-<!--                </tbody>-->
-<!--              </table>-->
-<!--            </div>-->
+            <!--            <div class="pro-box">-->
+            <!--              <div class="protitle">设备档案</div>-->
+            <!--              <div>-->
+            <!--                <el-button type="primary" v-auth="'edit'" @click="onOpenEditAsset">编辑</el-button>-->
+            <!--              </div>-->
+            <!--            </div>-->
+
+            <!--            <div class="ant-descriptions-view">-->
+            <!--              <table>-->
+            <!--                <tbody>-->
+            <!--                <tr class="ant-descriptions-row" v-for="(item, index) in dataList" :key="index">-->
+            <!--                  <th class="ant-descriptions-item-label ant-descriptions-item-colon">{{ item.title }}</th>-->
+            <!--                  <td class="ant-descriptions-item-content" colspan="1">-->
+            <!--                    <view v-if="item.types === 'file'">-->
+            <!--                      <img :src="deviceAssetMetadata[item.name]" class="avatar" />-->
+            <!--                    </view>-->
+            <!--                    <view v-else>-->
+            <!--                      <view v-if="item.pattern">-->
+            <!--                        <el-link :href="deviceAssetMetadata[item.name]" type="primary" target="_blank">{{ deviceAssetMetadata[item.name] }}</el-link>-->
+            <!--                      </view>-->
+            <!--                      <view v-else>-->
+            <!--                        {{ deviceAssetMetadata[item.name] }}-->
+            <!--                      </view>-->
+            <!--                    </view>-->
+            <!--                  </td>-->
+            <!--                </tr>-->
+            <!--                </tbody>-->
+            <!--              </table>-->
+            <!--            </div>-->
 
             <div class="pro-box">
               <div class="protitle">设备档案</div>
@@ -472,11 +472,14 @@ interface TableDataState {
 }
 export default defineComponent({
   name: 'deviceEditPro',
-  components: {EditAssetRef, FromData, SubDeviceMutipleBind, SubDevice, EditDic, EditAttr, EditFun, EditEvent, EditTab, devantd, ListDic, functionCom, setAttr },
+  components: { EditAssetRef, FromData, SubDeviceMutipleBind, SubDevice, EditDic, EditAttr, EditFun, EditEvent, EditTab, devantd, ListDic, functionCom, setAttr },
 
   setup(prop, context) {
     const logqueryRef = ref();
 
+    // 属性列表,查询保留小数位使用
+    const propertyMap = new Map()
+
     const array_list = ref([]);
     const route = useRoute();
     const editDicRef = ref();
@@ -569,12 +572,7 @@ export default defineComponent({
         //加载全部属性
         datahub.node.getpropertyList({ key: state.detail.product.key }).then((re: any) => {
           array_list.value = re;
-        });
-
-        //第一次加载
-        api.model.property(state.tableData.param).then((res: any) => {
-          state.tableData.data = res.Data;
-          state.tableData.total = res.Total;
+          re.forEach((item: any) => propertyMap.set(item.key, item?.valueType));
         });
 
         // 加载对应设备档案
@@ -859,23 +857,22 @@ export default defineComponent({
       }
     };
 
-    const getValueText = (key, value) => {
-      let data = array_list.value;
-      for (let i = 0; i < data.length; i++) {
-        const item = data[i];
-        if (item.key === key) {
-          if (item.valueType.type === "enum") {
-            const option = item.valueType.elements.find((element) => element.value === value);
-            if (option) {
-              return option.text;
-            }
-          } else {
-            return value;
-          }
+    const getValueText = (key: String, value: String) => {
+      const item = propertyMap.get(key)
+
+      if (!item) return value
+
+      if (item.type === "enum") {
+        const option = item.elements.find((element: any) => element.value === value);
+        if (option) {
+          return option.text;
         }
+      } else if (item?.type === 'float' && item?.decimals) {
+        //  根据属性确定保留小数位数
+        return Number(value).toFixed(item.decimals)
+      } else {
+        return value;
       }
-
-      return value;
     }
     const getStatusText = (name, value) => {
       let data = array_list.value;
@@ -1164,13 +1161,7 @@ tr {
   border-color: inherit;
 }
 
-.wu-box {
-  border: #e8e8e8 solid 1px;
-  padding: 20px;
-  width: 100%;
-}
-
-.wu-box .wu-title {
+.wu-title {
   display: flex;
   flex-direction: row;
   justify-content: space-between;
@@ -1178,7 +1169,7 @@ tr {
   border-bottom: #e8e8e8 1px solid;
 }
 
-.wu-box .wu-title .title {
+.wu-title .title {
   font-size: 18px;
 }
 
@@ -1199,7 +1190,7 @@ tr {
 }
 
 .ant-card-body {
-  padding: 24px;
+  padding: 12px;
   zoom: 1;
 }