定值单识别展示

src/api/protection/index.js

@@ -86,7 +86,7 @@ export function editProdectionApi(data) {
 
   export function getProdectionByIdApi(data) {
       return request({
-        url: '/protection/protection_manage/protectionOrder/listById',
+        url: '/protection/protection_manage/protectionOrder/detail',
         method: 'get',
         headers: {
             //"merchant-id":"378915229716713472",

src/views/protection/protectionManage/index.vue

@@ -113,26 +113,55 @@
         </div>
       </el-dialog>
       <!-- 识别解析结果 -->
-      <el-dialog :title="titleView+''" :visible.sync="openView" width="700px" append-to-body>
+      <el-dialog :title="titleView+''" :visible.sync="openView" width="800px" append-to-body>
-        <el-tabs v-model="activeName" @tab-click="handleTabClick">
+        <table style="width: 100%;" v-if="headList.length>0">
-            <!-- 基础设置 -->
+          <tr v-if="headList[0].attributeKey=='通知书名称'"> 
-            <el-tab-pane label="" name="baseSetting" style="height: 400px;">
+            <th colspan="5" style="height: 40px;">{{ headList[0].attributeValue }}</th>
-                <el-form  label-width="150px">
-                  <table>
-                    <tr>
-                      <td colspan="5">阜阳电网继电保护装置整定值通知书</td>
           </tr>
           <tr>
-                      <td>不平衡保护CT一次值（安）</td>
+            <td colspan="2">{{headList[1].attributeKey}}: {{ headList[1].attributeValue }}</td> 
-                      <td>定值区号</td>
+            <td>{{headList[2].attributeKey}}: {{ headList[2].attributeValue }}</td> 
-                      <td>被保护设备</td>
+            <td colspan="2">{{headList[3].attributeKey}}: {{ headList[3].attributeValue }}</td> 
-                      <td>不平衡保护CT二次值（安）</td>
+          </tr>
-                      <td>PT一次值（千伏）</td>
+          <tr>
+            <td>{{headList[4].attributeKey}}</td> 
+            <td>{{headList[5].attributeKey}}</td> 
+            <td>{{headList[6].attributeKey}}</td> 
+            <td>{{headList[7].attributeKey}}</td> 
+            <td>{{headList[8].attributeKey}}</td> 
+          </tr>
+            <tr>
+            <td>{{headList[4].attributeValue}}</td> 
+            <td>{{headList[5].attributeValue}}</td> 
+            <td>{{headList[6].attributeValue}}</td> 
+            <td>{{headList[7].attributeValue}}</td> 
+            <td>{{headList[8].attributeValue}}</td> 
+          </tr>
+        </table>
+        <table style="width: 100%;" v-if="bhdzList.length>0">
+          <tr> 
+            <th colspan="5" style="height: 40px;">保护定值</th>
+          </tr>
+          <tr v-for="(item,index) in bhdzList" :key="index">
+            <td v-for="(subText,subIndex) in item.split('@')" :key="subIndex">{{subText}}</td>
+          </tr>
+        </table>
+        <table style="width: 100%;" v-if="kzzList.length>0">
+          <tr> 
+            <th colspan="5" style="height: 40px;">控制字</th>
+          </tr>
+          <tr v-for="(item,index) in kzzList" :key="index">
+            <td v-for="(subText,subIndex) in item.split('@')" :key="subIndex">{{subText}}</td>
+          </tr>
+        </table>
+        <table style="width: 100%;" v-if="sbcsList.length>0">
+          <tr> 
+            <th colspan="5" style="height: 40px;">设备参数</th>
+          </tr>
+          <tr v-for="(item,index) in sbcsList" :key="index">
+            <td v-for="(subText,subIndex) in item.split('@')" :key="subIndex">{{subText}}</td>
           </tr>
         </table>
-                </el-form>
-            </el-tab-pane>
-        </el-tabs>
       </el-dialog>
     </div>
   </template>
@@ -184,38 +213,21 @@
                     pageSize: 10,
                     keyWord:null,
                 },  
-                activeName:"baseSetting",
-                deviceData:{},
                 // 表单参数
                 baseForm: {
                   protectionId:""
                 },
-                // 表单校验
-                baseFormRules: {
-                    substationName: [
-                        { required: true, message: "变电站名称不能为空", trigger: "blur" }
-                    ]
-                },
                 fileList: [],//图片
                 checkUrlList: [],//图片
                 checkUrlNameList: [],//图片
                 dialogVisible:false,//图片弹窗
                 dialogImageUrl:"",//图片弹窗
-                // 用户导入参数
+                //解析结果弹窗
-                upload: {
+                headList:[],
-                    // 是否显示弹出层（用户导入）
+                bhdzList:[],
-                    open: false,
+                kzzList:[],
-                    // 弹出层标题（用户导入）
+                sbcsList:[],
-                    title: '',
+                 
-                    // 是否禁用上传
-                    isUploading: false,
-                    // 是否更新已经存在的用户数据
-                    updateSupport: 0,
-                    // 设置上传的请求头部
-                    headers: { Authorization: 'Bearer ' + getToken() },
-                    // 上传的地址
-                    url: process.env.VUE_APP_BASE_API + '/system/user/importData',
-                },
             };
         },
         mounted(){
@@ -287,6 +299,7 @@
                 // this.checkUrlList=[this.baseForm.imgUrl]
                 // this.checkUrlNameList=[this.baseForm.imgName]  
             },
+            //识别结果
             handleView(row) {
                 this.reset();
                 this.openView = true;
@@ -294,12 +307,13 @@
                 this.titleView = "查看";
                 getProdectionByIdApi({protectionId:obj.protectionId}).then(response => {
                     console.log("getProdectionByIdApi",response);
+                    this.headList = response.head||[];
+                    this.bhdzList = response.bhdz||[];
+                    this.kzzList = response.kzz||[];
+                    this.sbcsList = response.sbcs||[];
                 });
             },
-            handleTabClick(tab, event) {
+            /** 提交识别按钮 */
-                console.log(tab, event);
-            },
-            /** 提交按钮 */
             submitForm: function() {
                 console.log("this.fileList",this.fileList);
                 console.log("this.checkUrlList",this.checkUrlList);
@@ -336,6 +350,7 @@
                   });
                 }).catch(() => {});
             },
+            //日期
             formatDate(date) {
                 // 格式化为 YYYY-MM-DD
                 const year = date.getFullYear();
@@ -343,7 +358,6 @@
                 const day = String(date.getDate()).padStart(2, '0');
                 return `${year}-${month}-${day}`;
             },
-
             // 多选框选中数据
             handleSelectionChange(selection) {
               this.protectionIds = selection.map(item => item.protectionId)
@@ -426,5 +440,9 @@
       text-align: center; vertical-align: middle;
       border-collapse: collapse; /* 合并表格边框 */
       border: 1px solid black; /* 设置边框颜色和宽度 */
+      padding: 4px;
     }
+
+
+
   </style>