Task 资产地图

src/views/sunVillage_info/assetMapOpen.vue

@@ -72,7 +72,7 @@
                   </van-col>
                 </van-row>
                 <div class="gl_main">
-                  <template v-if="false">
+                  <template v-if="!contractionVisible">
                     <div class="headers">
                       <div class="flex3">合同编码</div>
                       <div class="flex3">合同名称</div>
@@ -84,12 +84,12 @@
                     <div class="desc_main">
                       <ul class="analysisTable_list">
                         <!--1-->
-                        <li v-for="item in contractionList" class="flex_item">
+                        <li v-for="item in contractionList" class="flex_item" @click="viewContractionInfo(item)">
                           <div class="flex3" @click="lookName(item.code)">{{item.code}}</div>
                           <div class="flex3" @click="lookName(item.name)">{{item.name}}</div>
                           <div class="flex3">{{item.secondParty}}</div>
                           <div class="flex3">{{item.totalAmount}}</div>
-                          <div class="flex3">{{selectDictLabel(contractionStatuOptions, item.contractionStatus)}}</div>
+                          <div class="flex3">{{item.contractionStatus}}</div>
                         </li>
                       </ul>
                     </div>
@@ -97,6 +97,7 @@
                   <template v-else>
                     <div class="headers">
                       <div>关联合同</div>
+                      <div class="back" @click="hideContractionInfo">&lt; 返回</div>
                     </div>
                     <van-row>
                       <van-col :span="4"><span class="title">合同编码:</span></van-col>
@@ -212,7 +213,7 @@
                   </van-col>
                 </van-row>
                 <div class="gl_main">
-                  <template v-if="false">
+                  <template v-if="!contractionVisible">
                     <div class="headers">
                       <div class="flex3">合同编码</div>
                       <div class="flex3">合同名称</div>
@@ -224,12 +225,12 @@
                     <div class="desc_main">
                       <ul class="analysisTable_list">
                         <!--1-->
-                        <li v-for="item in contractionList" class="flex_item">
+                        <li v-for="item in contractionList" class="flex_item" @click="viewContractionInfo(item)">
                           <div class="flex3" @click="lookName(item.code)">{{item.code}}</div>
                           <div class="flex3" @click="lookName(item.name)">{{item.name}}</div>
                           <div class="flex3">{{item.secondParty}}</div>
                           <div class="flex3" >{{item.totalAmount}}</div>
-                          <div class="flex3">{{selectDictLabel(contractionStatuOptions, item.contractionStatus)}}</div>
+                          <div class="flex3">{{item.contractionStatus}}</div>
                         </li>
                       </ul>
                     </div>
@@ -237,6 +238,7 @@
                   <template v-else>
                     <div class="headers">
                       <div>关联合同</div>
+                      <div class="back" @click="hideContractionInfo">&lt; 返回</div>
                     </div>
                     <van-row>
                       <van-col :span="4"><span class="title">合同编码:</span></van-col>
@@ -385,7 +387,7 @@
     width: 94%;
     position: fixed;
     z-index: 1001;
-    top: 50%;
+    top: 54%;
     transform: translateY(-50%);
     right: 3%;
     display: flex;
@@ -479,7 +481,7 @@
   }
   .gl_main{
     margin-top: .8vh;
-    height: 28.15vh;
+    height: 38.15vh;
     padding:0.92vh 0 0 0;
   .headers {
     height: 3.24vh;
@@ -492,10 +494,16 @@
     background: rgba(11,239,202,.3);
     padding-right: 0.53vw;
     margin-bottom: 1vh;
+    position: relative;
   .flex_left{
     text-align: left;
     padding-left: 0.83vw;
   }
+    .back {
+      cursor: pointer;
+      position: absolute;
+      left: 0.83vw;
+    }
   }
   .desc_main{
     height: 21.5vh;
@@ -524,6 +532,7 @@
     color: #fff;
     font-size: 1.29vh;
     position: relative;
+    cursor: pointer;
   // border-bottom: 1px solid rgba(255, 255, 255, 0.2);
   // &:hover {
       //     background: rgba(8, 85, 255, 0.6);
@@ -579,7 +588,7 @@
     getResourceList,
     assetPropertyDetail,
     assetResourceDetail,
-    openAttachmentList
+    openAttachmentList as attachmentList
   } from "@/api/sunVillage_info/fixedAssets";
   import {getQueryLand} from "@/api/sunVillage_info/homestead/application";
   import { getConfigKey } from "@/api/system/config";
@@ -610,6 +619,7 @@
         villageBorderLayerName: "",     // 乡镇边界图层名称
         contractionData: {},
         contractionAttachmentList: [],
+        contractionVisible:false,
       };
     },
     created() {
@@ -868,20 +878,15 @@
             if (ifConsole !="标注点") {
               let obj = {};
               assetResourceDetail(feature.values_.id, {translate_dict: 1, getAttachments: true,}).then((resp) => {
-                that.contractionList = resp.data.params.contractionAssetList;
+                that.contractionList = resp.data.params.contractionAssetList || [];
                 that.$set(obj, 'fileList', resp.data.params.attachments.map(rr=>{
                   return {
                     url:'/api'+rr.fileUrl
                   };
                 }));
-                that.contractionData = resp.data.params.contraction || {};
+                that.contractionData = {};
                 that.contractionAttachmentList = [];
-                if(resp.data.params.contraction)
-                  that.contractionAttachmentList = resp.data.params.contraction.params.attachments.map(rr=>{
-                    return {
-                      url:'/api'+rr.fileUrl
-                    };
-                  });
+                that.contractionVisible = false;
                 that.mapHaDataValue = true;
               });
               that.mapHasDateStatus = 0;
@@ -957,20 +962,15 @@
             } else {
               let obj = {};
               assetPropertyDetail(feature.values_.properties[0].value.values_.id, {translate_dict: 1, getAttachments: true,}).then((resp) => {
-                that.contractionList = resp.data.params.contractionAssetList;
+                that.contractionList = resp.data.params.contractionAssetList || [];
                 that.$set(obj, 'fileList', resp.data.params.attachments.map(rr=>{
                   return {
                     url:'/api'+rr.fileUrl
                   };
                 }));
-                that.contractionData = resp.data.params.contraction || {};
+                that.contractionData = {};
                 that.contractionAttachmentList = [];
-                if(resp.data.params.contraction)
-                  that.contractionAttachmentList = resp.data.params.contraction.params.attachments.map(rr=>{
-                    return {
-                      url:'/api'+rr.fileUrl
-                    };
-                  });
+                that.contractionVisible = false;
                 that.mapHaDataValue = true;
               });
               that.mapHasDateStatus = 1;
@@ -1084,6 +1084,7 @@
               that.mapHasData = obj;
             }
           }else {
+            that.contractionVisible = false;
             that.mapHaDataValue = false;
           }
         });
@@ -1114,6 +1115,26 @@
           });
         }
       },
+      viewContractionInfo(row) {
+        this.contractionData = row || {};
+        this.contractionAttachmentList = [];
+        attachmentList({
+          tableId: row.id,
+          tableName: 't_contraction_info',
+        }).then((resp) => {
+          this.contractionAttachmentList = resp.rows.map(rr=>{
+            return {
+              url:'/api'+rr.fileUrl
+            };
+          });
+        });
+        this.contractionVisible = true;
+      },
+      hideContractionInfo() {
+        this.contractionData = {};
+        this.contractionAttachmentList = [];
+        this.contractionVisible = false;
+      },
     },
   };
 </script>