Bladeren bron

修改业务空间上传图片 ,以及图片组件只读编辑模式bug

haojianlong 5 jaren geleden
bovenliggende
commit
23d870be94

+ 39 - 5
src/components/business_space/business/handsontable.vue

@@ -29,6 +29,8 @@
     </div> -->
     <!-- 二维码弹窗 -->
     <qrcode :dialog="dialog" :qrcodeUrl="qrcodeUrl" :addBody="true" ref="qrcode"></qrcode>
+    <!--      上传图片-->
+    <upload-img-dialog :read="onlyRead" @changeFile="imgChange" :keysArr="imgsArr" :dialog="myDialog" />
   </div>
 </template>
 <script>
@@ -45,6 +47,7 @@ import Handsontable from "handsontable-pro"
 import buildFloor from '@/utils/handsontable/buildFloorData'
 import 'handsontable-pro/dist/handsontable.full.css'
 import zhCN from 'handsontable-pro/languages/zh-CN';
+import uploadImgDialog from "@/components/business_space/dialogs/list/uploadImgDialog"
 import qrcode from "@/components/ledger/lib/qrcode";
 import { queryZone, updateZone, deleteZone, createZone, BeatchQueryParam, updateRelateInSpAndBuild } from "@/api/scan/request";
 import { mapGetters, mapActions } from "vuex";
@@ -56,7 +59,8 @@ export default {
   components: {
     qrcode, //二维码页面
     myPagination,
-    addBusiness
+    addBusiness,
+    uploadImgDialog
   },
   computed: {
     ...mapGetters("layout", ["projectId", "secret", "userId"]),
@@ -101,7 +105,11 @@ export default {
       filtersArr: [], //表格数据被过滤后的下标
       copyMain: [], //深拷贝数组
       buildFloorData: [], //楼层数据
-      zoneItemID: ''
+      zoneItemID: '',
+      myDialog: {
+        uploadImgs: false, //上传图片弹窗
+      },
+      imgsArr: [], //空间图片
     };
   },
   created() {
@@ -214,7 +222,7 @@ export default {
           "filter_by_value",
           "filter_action_bar"
         ],
-        contextMenu: this.onlyRead ? false :{
+        contextMenu: this.onlyRead ? false : {
           items: {
             remove_row: {
               name: "删除该业务空间"
@@ -260,7 +268,8 @@ export default {
     },
     getInfors(infos, row) {
       let val = this.hot.colToProp(row.col);
-      lStorage.set('screen_data', {path: this.$route.path, data: {RoomID: infos.RoomID, zone: this.zoneCode}})
+      this.row = row.row;
+      lStorage.set('screen_data', { path: this.$route.path, data: { RoomID: infos.RoomID, zone: this.zoneCode } })
       if (val == "point") {
         let query = {
           RoomID: infos.RoomID,
@@ -279,6 +288,12 @@ export default {
         } else {
           this.$message("此设备没有设备二维码")
         }
+      } else if (val == "Pic") {
+        let Picdata = tools.dataForKey(this.main[row.row], val);
+        this.imgsArr = Picdata ? Picdata : [];
+        if (!this.onlyRead || this.imgsArr.length) {
+          this.myDialog.uploadImgs = true;
+        }
       } else {
         return false;
       }
@@ -633,7 +648,26 @@ export default {
     handleCurrentChange(val) {
       this.page.pageNumber = val
       this.getData()
-    }
+    },
+    //上传图片弹窗触发事件
+    imgChange(keys) {
+      this.setDataToMain(keys, 'Pic', this.row);
+    },
+    //判断是否有值,有值赋值
+    setDataToMain(data, key, row) {
+      if (!!data && data != '--') {
+        if (!!this.main[row]) {
+          tools.setDataForKey(this.main[row], key, data);
+          this.tdChange([[row, key, null, data]], "edit");
+        } else {
+          this.main[row] = {};
+          tools.setDataForKey(this.main[row], key, data);
+        }
+      } else {
+        tools.setDataForKey(this.main[row], key, "");
+      }
+      this.hot.render()
+    },
   },
   watch: {
     projectId() {

+ 4 - 2
src/components/business_space/lib/uploadImgsName.vue

@@ -12,7 +12,8 @@
           <i v-if="!readOnly" class="el-icon-delete" @click="delImage(index,item)"></i>
           <img @click="lookImg" :src="imageGetUrl + '&key=' +item.Key" alt v-load>
         </div>
-        <form-input :label="''" @change="getName" :keys="index" :value="item.Name" :width="10"></form-input>
+        <p v-if="readOnly" >{{item.Name}}</p>
+        <form-input v-else :label="''" @change="getName" :keys="index" :value="item.Name" :width="10"></form-input>
       </div>
       <div v-if="type == 'video'" class="point-view" v-for="(item,index) in imagesArr">
         <div class="point-image">
@@ -24,7 +25,8 @@
             controls="controls"
           >您的浏览器不支持 video 标签。</video>
         </div>
-        <form-input :label="''" @change="getName" :keys="index" :value="item.Name" :width="10"></form-input>
+        <p v-if="readOnly" >{{item.Name}}</p>
+        <form-input v-else :label="''" @change="getName" :keys="index" :value="item.Name" :width="10"></form-input>
       </div>
       <div v-if="!readOnly" style="float:left;">
         <el-upload