资产详情

src/api/common/uploadAttachment.js

@@ -2,16 +2,10 @@ import request from '@/utils/request'
 import { usingExternalUploadService } from "@/api/system/config";
 
 //查询已上传附件
-export const attachmentList = (deptId, year, useType) => {
-  let query = {
-    deptId,
-    year,
-    useType
-  }
+export const attachmentList = (id) => {
   return request({
-    url: 'api/home/xixia/asset/zcList',
-    method: 'get',
-    params: query
+    url: `api/home/xixia/asset/zcDetail/${id}`,
+    method: 'get'
   })
 }
 

src/views/property/main-gis/asset-details/index.html

@@ -0,0 +1,70 @@
+  <!--资产信息详情-弹窗-->
+  <div class="gl_pop_cash pop_statistical_desc">
+    <div class="head_main">
+      <div class="title">{{permanentDetail.name}}</div>
+      <div class="close" @click="close"></div>
+    </div>
+    <div class="echarts_main scrollbar">
+      <div>
+        <p>资产编码</p>
+        <p>{{permanentDetail.code}}</p>
+      </div>
+      <div>
+        <p>资产名称</p>
+        <p>{{permanentDetail.name}}</p>
+      </div>
+      <div>
+        <p>资产类别</p>
+        <p>{{permanentDetail.assetType}}</p>
+      </div>
+      <div>
+        <p>经营属性</p>
+        <p>{{permanentDetail.operationType}}</p>
+      </div>
+      <div>
+        <p>增加方式</p>
+        <p>{{permanentDetail.addType}}</p>
+      </div>
+      <div>
+        <p>购建时间</p>
+        <p>{{permanentDetail.buildTime}}</p>
+      </div>
+      <div>
+        <p>使用情况</p>
+        <p>{{permanentDetail.useType}}</p>
+      </div>
+      <div>
+        <p>资产状态</p>
+        <p>{{permanentDetail.assetStatus}}</p>
+      </div>
+      <div>
+        <p>数量/面积</p>
+        <p>{{permanentDetail.quantity}}</p>
+      </div>
+      <div>
+        <p>计量单位</p>
+        <p>{{permanentDetail.unit}}</p>
+      </div>
+      <div>
+        <p>原值(元)</p>
+        <p>{{permanentDetail.originalValue}}</p>
+      </div>
+      <div>
+        <p>折旧方式</p>
+        <p>{{permanentDetail.depreciationType}}</p>
+      </div>
+      <div>
+        <p>附件</p>
+        <p>
+          <block v-for="(item,index) in permanentDetail.fileList">
+            <a :href="item.urlApi" v-if="item.type != 'image'">
+              <img :src="item.url" style="width: 3vw;height: 3vw;margin-right: 0.5vw;" alt="">
+            </a>
+            <img v-else :src="item.url" style="width: 3vw;height: 3vw;margin-right: 0.3vw;" alt=""
+              @click="openImage(item.url)">
+          </block>
+        </p>
+      </div>
+    </div>
+
+  </div>

src/views/property/main-gis/asset-details/index.js

@@ -0,0 +1,29 @@
+
+import { attachmentList } from "@/api/common/uploadAttachment.js";
+export default {
+  props: {
+    data: {}
+  },
+  data () {
+    return {
+      isLoad: false,
+      permanentDetail: {}
+    };
+  },
+  computed: {
+  },
+  created () {
+    this.isLoad = false
+    attachmentList(this.data).then(res => {
+      this.permanentDetail = res.data;
+      this.isLoad = true
+    })
+  },
+  mounted () {
+  },
+  methods: {
+    close () {
+      this.$emit('close')
+    }
+  }
+};

src/views/property/main-gis/asset-details/index.scss

@@ -0,0 +1,172 @@
+.gl_pop_cash {
+  background: rgba(10, 25, 47, 0.8);
+  position: absolute;
+  // border: 1px solid #063a95;
+  // border-left: 0.15vw solid #357dfa;
+  padding: 0 10px;
+  z-index: 11;
+
+  .head_main {
+    height: 40px;
+    display: flex;
+    align-items: center;
+    position: relative;
+    justify-content: space-between;
+
+    .title {
+      color: #ffad00;
+      font-size: 16px !important;
+    }
+
+    .close {
+      background: url('./close.png') no-repeat;
+      background-size: 100% 100%;
+      width: 20px;
+      height: 20px;
+      cursor: pointer;
+    }
+
+    .xs_main {
+      height: 30px;
+      position: absolute;
+      width: 100%;
+      display: flex;
+      align-items: center;
+
+      .block {
+        width: 20px;
+        display: flex;
+
+        .point {
+          width: .55vh;
+          height: .55vh;
+          margin-right: 0.36vw;
+
+          &.p1 {
+            background: rgba(53, 125, 250, 1)
+          }
+
+          &.p2 {
+            background: rgba(53, 125, 250, .7)
+          }
+
+          &.p3 {
+            background: rgba(53, 125, 250, .4)
+          }
+        }
+
+      }
+
+      .xs_x {
+        height: 1px;
+        flex: 1;
+        background: #214284;
+      }
+    }
+  }
+
+  .echarts_main {
+    height: 600px;
+    overflow-y: auto;
+
+    div {
+      font-size: 10px;
+      // height: 40px;
+      line-height: 20px;
+
+      p {
+        // white-space: nowrap;
+      }
+    }
+
+    .headers {
+      height: 30px;
+      font-size: 14px;
+      color: #0befca;
+      text-align: center;
+      display: flex;
+      justify-content: center;
+      align-items: center;
+      margin-right: 0.53vw;
+      background: rgba(11, 239, 202, .2);
+      margin-bottom: 0.9vh
+    }
+
+    .desc_main {
+      overflow-y: scroll;
+      padding-right: 0.33vw;
+
+      .analysisTable_list {
+        margin: 0;
+        padding: 0;
+        flex: 1;
+        display: flex;
+        flex-direction: column;
+
+        .flex_item {
+          cursor: pointer;
+          list-style: none;
+          margin: 0;
+          display: flex;
+          justify-content: center;
+          align-items: center;
+          text-align: center;
+          color: #fff;
+          font-size: 12px;
+          position: relative;
+          height: 30px;
+
+          &:nth-child(2n) {
+            background: rgba(53, 125, 250, .1);
+          }
+        }
+      }
+    }
+  }
+
+}
+
+.pop_statistical_desc {
+  width: 600px;
+  margin: 0;
+  left: 480px;
+  top: 180px;
+  padding-bottom: 1.04vw !important;
+
+  .head_main {
+
+    .title {
+      color: #fff;
+    }
+  }
+
+  .echarts_main {
+    margin-top: 16px;
+
+    div {
+      display: flex;
+      align-items: center;
+
+      &:nth-child(even) {
+        background: rgba(32, 89, 188, 0.2);
+      }
+
+      p {
+        &:nth-child(1) {
+          width: 8vw;
+          padding-left: 1vw;
+          flex-shrink: 0;
+        }
+
+        &:nth-child(2) {
+          color: #ffad00;
+        }
+
+        margin: 0;
+        color: #ffffff;
+        font-size:1.33vh;
+        line-height: 3.92vh;
+      }
+    }
+  }
+}

src/views/property/main-gis/asset-details/index.vue

@@ -0,0 +1,4 @@
+<template src='./index.html'/>
+<script lang='js' src='./index.js'></script>
+<style lang='scss' src='./index.scss' scoped>
+</style>

src/views/property/main-gis/index.html

@@ -8,84 +8,7 @@
     </div>
   </Legend>
   <div class="mask" style="position: absolute; width: 100%; height: 100%;pointer-events: none;"></div>
-  <!--资产信息详情-弹窗-->
-  <div v-if="showPermanentDetail" class="gl_pop_cash pop_statistical_desc">
-    <div class="head_main">
-      <div class="title">{{permanentDetail.name}}详情</div>
-      <div class="close" @click="showPermanentDetail = false"></div>
-      <div class="xs_main">
-        <div class="block">
-          <div class="point p1"></div>
-          <div class="point p2"></div>
-          <div class="point p3"></div>
-        </div>
-        <div class="xs_x"></div>
-      </div>
-    </div>
-    <div class="echarts_main">
-      <div>
-        <p>资产编码</p>
-        <p>{{permanentDetail.code}}</p>
-      </div>
-      <div>
-        <p>资产名称</p>
-        <p>{{permanentDetail.name}}</p>
-      </div>
-      <div>
-        <p>资产类别</p>
-        <p>{{permanentDetail.assetType}}</p>
-      </div>
-      <div>
-        <p>经营属性</p>
-        <p>{{permanentDetail.operationType}}</p>
-      </div>
-      <div>
-        <p>增加方式</p>
-        <p>{{permanentDetail.addType}}</p>
-      </div>
-      <div>
-        <p>购建时间</p>
-        <p>{{permanentDetail.buildTime}}</p>
-      </div>
-      <div>
-        <p>使用情况</p>
-        <p>{{permanentDetail.useType}}</p>
-      </div>
-      <div>
-        <p>资产状态</p>
-        <p>{{permanentDetail.assetStatus}}</p>
-      </div>
-      <div>
-        <p>数量/面积</p>
-        <p>{{permanentDetail.quantity}}</p>
-      </div>
-      <div>
-        <p>计量单位</p>
-        <p>{{permanentDetail.unit}}</p>
-      </div>
-      <div>
-        <p>原值(元)</p>
-        <p>{{permanentDetail.originalValue}}</p>
-      </div>
-      <div>
-        <p>折旧方式</p>
-        <p>{{permanentDetail.depreciationType}}</p>
-      </div>
-      <div>
-        <p>附件</p>
-        <p>
-          <block v-for="(item,index) in permanentDetail.fileList">
-            <a :href="item.urlApi" v-if="item.type != 'image'">
-              <img :src="item.url" style="width: 3vw;height: 3vw;margin-right: 0.5vw;" alt="">
-            </a>
-            <img v-else :src="item.url" style="width: 3vw;height: 3vw;margin-right: 0.3vw;" alt=""
-              @click="openImage(item.url)">
-          </block>
-        </p>
-      </div>
-    </div>
-
-  </div>
+  <AssetDetails @close="listDialogHidden('detail')" v-if="showPermanentDetail.show" :data="showPermanentDetail.id"></AssetDetails>
   <!--选择地址-->
   <div class="select_address">
     <el-cascader :options="addrOptions" v-model="addrText" :props="deptTreeProps" popper-class="header-cascader-drop"

src/views/property/main-gis/index.js

@@ -5,7 +5,7 @@ import { getInfo } from "@/api/login";
 import { getConfigKey } from "@/api/system/config";
 import { getPermanentListByDeptId, listPermanent } from "@/api/asset/permanent.js";
 import { getResourceListByDeptId, listResource } from "@/api/asset/resource.js";
-import { attachmentList } from "@/api/common/uploadAttachment.js";
+
 let gis = null;
 import { treeselectByDeptId } from "@/api/system/dept";
 import Legend from '@/components/legend/index.vue';
@@ -19,13 +19,18 @@ const iconMap = {
   '3': require('./icon/组 4665@2x(2).png'), // 出租或出借
   '4': require('./icon/组 4665@2x(3).png') // 其他
 }
+import AssetDetails from './asset-details/index.vue';
 export default {
   components: {
+    AssetDetails,
     Legend
   },
   data () {
     return {
-      showPermanentDetail: false,
+      showPermanentDetail: {
+        show: false,
+        id: ''
+      },
       deptLayer: "",                  // 坐标点图层
       countyBorderLayerName: "",      // 区县边界图层名称
       townBorderLayerName: "",        // 乡镇边界图层名称
@@ -503,7 +508,7 @@ export default {
         //资源信息详情弹窗
         this.showResourceDetail = false;
         //资产信息详情弹窗
-        this.showPermanentDetail = false;
+        this.showPermanentDetail.show = false;
         //农业补贴详情弹窗
         this.showSubsidyFundsDetail = false;
         //重大事项详情弹窗
@@ -532,7 +537,7 @@ export default {
         //资源信息详情弹窗
         this.showResourceDetail = false;
         //资产信息详情弹窗
-        this.showPermanentDetail = false;
+        this.showPermanentDetail.show = false;
         //农业补贴详情弹窗
         this.showSubsidyFundsDetail = false;
         //重大事项详情弹窗
@@ -545,43 +550,11 @@ export default {
 
     },
     openPermanentDialog (data) {
-      let useType = data.useType
-      attachmentList(this.deptId, this.year, useType).then((res) => {
-        console.log(res, 777);
-        if (res.code == 200) {
-          // let UattachmentList = res.rows;
-          // for (let i = 0; i < UattachmentList.length; i++) {
-          //   let fileName = UattachmentList[i].fileName;
-          //   let subIndex = fileName.lastIndexOf(".");
-          //   let ext = fileName.substring(subIndex + 1, fileName.length);
-          //   let urls = "";
-          //   let type = "";
-          //   if (ext == "xlsx" || ext == "xls") {
-          //     urls = require("@/assets/images/icon_excel.jpg");
-          //     type = 'excel';
-          //   } else if (ext == "doc" || ext == "docx") {
-          //     urls = require("@/assets/images/icon_word.jpg");
-          //     type = 'word';
-          //   } else if (ext == "pdf") {
-          //     urls = require("@/assets/images/icon_pdf.jpg");
-          //     type = 'pdf';
-          //   } else if (ext == "zip") {
-          //     urls = require("@/assets/images/icon_zip.jpg");
-          //     type = 'zip';
-          //   } else {
-          //     urls = '/api' + UattachmentList[i].fileUrl;
-          //     type = 'image';
-          //   }
-          //   data.fileList.push({
-          //     url: urls,
-          //     urlApi: '/api' + UattachmentList[i].fileUrl,
-          //     type: type
-          //   })
-          // }
-          this.showPermanentDetail = true;
-          this.permanentDetail = data;
-        }
-      });
+      let id = data.id;
+      this.showPermanentDetail = {
+        id,
+        show: true
+      }
     },
     // 加载地图
     initMap (deptId) {

src/views/property/main-gis/index.scss

@@ -31,166 +31,7 @@
     }
   }
 
-  .gl_pop_cash {
-    background: rgba(10, 25, 47, 0.8);
-    position: absolute;
-    border: 1px solid #063a95;
-    border-left: 0.15vw solid #357dfa;
-    padding: 0 1vw;
-    z-index: 11;
-
-    .head_main {
-      height: 4.62vh;
-      padding-top: 0.55vh;
-      display: flex;
-      align-items: center;
-      position: relative;
-      justify-content: space-between;
-
-      .title {
-        color: #ffad00;
-        font-size: 1.66vh;
-      }
-
-      .close {
-        background: url('./close.png') no-repeat;
-        background-size: 100% 100%;
-        width: 1.48vh;
-        height: 1.48vh;
-        cursor: pointer;
-      }
-
-      .xs_main {
-        height: 0.55vh;
-        position: absolute;
-        width: 100%;
-        bottom: -0.55vh;
-        display: flex;
-        align-items: center;
-
-        .block {
-          width: 2.34vw;
-          display: flex;
-
-          .point {
-            width: .55vh;
-            height: .55vh;
-            margin-right: 0.36vw;
-
-            &.p1 {
-              background: rgba(53, 125, 250, 1)
-            }
-
-            &.p2 {
-              background: rgba(53, 125, 250, .7)
-            }
-
-            &.p3 {
-              background: rgba(53, 125, 250, .4)
-            }
-          }
-
-        }
-
-        .xs_x {
-          height: 1px;
-          flex: 1;
-          background: #214284;
-        }
-      }
-    }
-
-    .echarts_main {
-      .headers {
-        height: 3.33vh;
-        font-size: 1.48vh;
-        color: #0befca;
-        text-align: center;
-        display: flex;
-        justify-content: center;
-        align-items: center;
-        margin-right: 0.53vw;
-        background: rgba(11, 239, 202, .2);
-        margin-bottom: 0.9vh
-      }
-
-      .desc_main {
-        overflow-y: scroll;
-        padding-right: 0.33vw;
-
-        .analysisTable_list {
-          margin: 0;
-          padding: 0;
-          flex: 1;
-          display: flex;
-          flex-direction: column;
-
-          .flex_item {
-            cursor: pointer;
-            list-style: none;
-            margin: 0;
-            display: flex;
-            justify-content: center;
-            align-items: center;
-            text-align: center;
-            color: #fff;
-            font-size: 1.29vh;
-            position: relative;
-            height: 3.2vh;
-
-            &:nth-child(2n) {
-              background: rgba(53, 125, 250, .1);
-            }
-          }
-        }
-      }
-    }
-
-  }
 
-  .pop_statistical_desc {
-    width: 20.2vw;
-    margin: 0;
-    right: 23vw;
-    top: 35vh;
-    padding-bottom: 1.04vw !important;
-
-    .head_main {
-      .title {
-        color: #fff;
-      }
-    }
-
-    .echarts_main {
-      margin-top: 1.66vh;
-
-      div {
-        display: flex;
-        align-items: center;
-
-        &:nth-child(even) {
-          background: rgba(32, 89, 188, 0.2);
-        }
-
-        p {
-          &:nth-child(1) {
-            width: 8vw;
-            padding-left: 1vw;
-            flex-shrink: 0;
-          }
-
-          &:nth-child(2) {
-            color: #ffad00;
-          }
-
-          margin: 0;
-          color: #ffffff;
-          font-size:1.33vh;
-          line-height: 3.92vh;
-        }
-      }
-    }
-  }
 
   .mask {
     z-index: 1;