Merge branch 'master' of http://git.hzwlsoft.com/JeroBoot/jero-boot

2021-04-09 10:03:11 +08:00
parent 1697247323 5dd867091e
commit aa644cf820
2 changed files with 22 additions and 158 deletions
@@ -25,9 +25,6 @@
          <div class="ant-upload-text">{{ text }}</div>
        </div>
      </div>
-      <a-modal :visible="previewVisible" :footer="null" @cancel="handleCancel()">
-        <img alt="example" style="width: 100%" :src="previewImage"/>
-      </a-modal>
    </a-upload>
  </div>
 </template>
@@ -36,6 +33,7 @@
  import Vue from 'vue'
  import { ACCESS_TOKEN } from "@/store/mutation-types"
  import { getFileAccessHttpUrl } from '@/api/manage'
+  const Base64 = require('js-base64').Base64

  const uidGenerator=()=>{
    return '-'+parseInt(Math.random()*10000+1,10);
@@ -50,7 +48,6 @@
        headers:{},
        fileList: [],
        previewImage:"",
-        previewVisible: false,
      }
    },
    props:{
@@ -109,12 +106,13 @@
    },
    methods:{
      initFileList(paths){
+        debugger
        if(!paths || paths.length === 0){
          this.fileList = [];
          return;
        }
        this.picUrl = true;
-        let arr = paths.join(",")
+        let arr = paths.split(",")
        for(var a=0;a<arr.length;a++){
          this.fileList.forEach((item)=>{
            if (item.url === arr[a]){
@@ -161,9 +159,12 @@
        }
      },
      // 预览
-      handlePreview (file) {
-        this.previewImage = file.url || file.thumbUrl
-        this.previewVisible = true
+      handlePreview(file) {
+        if (file && file.url) {
+          var fileFullUrl = `${window._CONFIG['domianWebSocketURL']}/sys/common/download/${file.response.result.id}?token=${Vue.ls.get(ACCESS_TOKEN)}&fullfilename=${file.name}`
+          let url = `${window._CONFIG['onlinePreviewDomainURL']}?url=${encodeURIComponent(Base64.encode(fileFullUrl))}`
+          window.open(url)
+        }
      },
      getAvatarView(){
        if(this.fileList.length>0){
@@ -1,15 +1,5 @@
 <template>
  <div :id="containerId" style="position: relative">
-
-    <!--  ---------------------------- begin 图片左右换位置 ------------------------------------- -->
-    <div class="movety-container" :style="{top:top+'px',left:left+'px',display:moveDisplay}" style="padding:0 8px;position: absolute;z-index: 91;height: 32px;width: 104px;text-align: center;">
-      <div :id="containerId+'-mover'" :class="showMoverTask?'uploadty-mover-mask':'movety-opt'" style="margin-top: 12px">
-        <a @click="moveLast" style="margin: 0 5px;"><a-icon type="arrow-left" style="color: #fff;font-size: 16px"/></a>
-        <a @click="moveNext" style="margin: 0 5px;"><a-icon type="arrow-right" style="color: #fff;font-size: 16px"/></a>
-      </div>
-    </div>
-    <!--  ---------------------------- end 图片左右换位置 ------------------------------------- -->
-
    <a-upload
      name="file"
      :action="uploadAction"
@@ -35,9 +25,6 @@
        </a-button>
      </template>
    </a-upload>
-    <a-modal :visible="previewVisible" :footer="null" @cancel="handleCancel">
-      <img alt="example" style="width: 100%" :src="previewImage" />
-    </a-modal>
  </div>
 </template>

@@ -63,17 +50,6 @@
        fileList: [],
        newFileList: [],
        uploadGoOn:true,
-        previewVisible: false,
-        //---------------------------- begin 图片左右换位置 -------------------------------------
-        previewImage: '',
-        containerId:'',
-        top:'',
-        left:'',
-        moveDisplay:'none',
-        showMoverTask:false,
-        moverHold:false,
-        currentImg:''
-        //---------------------------- end 图片左右换位置 -------------------------------------
      }
    },
    props:{
@@ -282,118 +258,14 @@
        console.log(file)
      },
      handlePreview(file) {
-        if(this.fileType === FILE_TYPE_IMG){
-          this.previewImage = file.url || file.thumbUrl;
-          this.previewVisible = true;
-        }else{
-          if (file && file.url) {
-            var fileFullUrl = `${window._CONFIG['domianWebSocketURL']}/sys/common/download/${file.response.result.id}?token=${Vue.ls.get(ACCESS_TOKEN)}&fullfilename=${file.name}`
-            let url = `${window._CONFIG['onlinePreviewDomainURL']}?url=${encodeURIComponent(Base64.encode(fileFullUrl))}`
-            window.open(url)
-          }
+        if (file && file.url) {
+          var fileFullUrl = `${window._CONFIG['domianWebSocketURL']}/sys/common/download/${file.response.result.id}?token=${Vue.ls.get(ACCESS_TOKEN)}&fullfilename=${file.name}`
+          let url = `${window._CONFIG['onlinePreviewDomainURL']}?url=${encodeURIComponent(Base64.encode(fileFullUrl))}`
+          window.open(url)
        }
      },
-      handleCancel(){
-        this.previewVisible = false;
-      },
-      //---------------------------- begin 图片左右换位置 -------------------------------------
-      moveLast(){
-        let index = this.getIndexByUrl();
-        if(index == 0){
-          this.$message.warn('未知的操作')
-        }else{
-          let curr = this.fileList[index].url;
-          let last = this.fileList[index-1].url;
-          let arr =[]
-          for(let i=0;i<this.fileList.length;i++){
-            if(i == index-1){
-              arr.push(curr)
-            }else if(i == index){
-              arr.push(last)
-            }else{
-              arr.push(this.fileList[i].url)
-            }
-          }
-          this.currentImg = last
-          this.$emit('file-change',arr.join(','))
-        }
-      },
-      moveNext(){
-        let index = this.getIndexByUrl();
-        if(index == this.fileList.length-1){
-          this.$message.warn('已到最后~')
-        }else{
-          let curr = this.fileList[index].url;
-          let next = this.fileList[index+1].url;
-          let arr =[]
-          for(let i=0;i<this.fileList.length;i++){
-            if(i === index+1){
-              arr.push(curr)
-            }else if(i == index){
-              arr.push(next)
-            }else{
-              arr.push(this.fileList[i].url)
-            }
-          }
-          this.currentImg = next
-          this.$emit('file-change',arr.join(','))
-        }
-      },
-      getIndexByUrl(){
-        for(let i=0;i<this.fileList.length;i++){
-          if(this.fileList[i].url == this.currentImg || encodeURI(this.fileList[i].url) == this.currentImg){
-            return i;
-          }
-        }
-        return -1;
-      }
-    },
-    mounted(){
-      const moverObj = document.getElementById(this.containerId+'-mover');
-      if(moverObj){
-        moverObj.addEventListener('mouseover',()=>{
-          this.moverHold = true
-          this.moveDisplay = 'block';
-        });
-        moverObj.addEventListener('mouseout',()=>{
-          this.moverHold = false
-          this.moveDisplay = 'none';
-        });
-      }
-      let picList = document.getElementById(this.containerId)?document.getElementById(this.containerId).getElementsByClassName('ant-upload-list-picture-card'):[];
-      if(picList && picList.length>0){
-        picList[0].addEventListener('mouseover',(ev)=>{
-          ev = ev || window.event;
-          let target = ev.target || ev.srcElement;
-          if('ant-upload-list-item-info' === target.className){
-            this.showMoverTask=false
-            let item = target.parentElement
-            this.left = item.offsetLeft
-            this.top=item.offsetTop+item.offsetHeight-50;
-            this.moveDisplay = 'block';
-            this.currentImg = target.getElementsByTagName('img')[0].src
-          }
-
-        });
-
-        picList[0].addEventListener('mouseout',(ev)=>{
-          ev = ev || window.event;
-          let target = ev.target || ev.srcElement;
-          //console.log('移除',target)
-          if('ant-upload-list-item-info' === target.className){
-            this.showMoverTask=true
-            setTimeout(()=>{
-              if(this.moverHold === false)
-                this.moveDisplay = 'none';
-            },100)
-          }
-          if('ant-upload-list-item ant-upload-list-item-done' === target.className || 'ant-upload-list ant-upload-list-picture-card'=== target.className){
-            this.moveDisplay = 'none';
-          }
-        })
-        //---------------------------- end 图片左右换位置 -------------------------------------
-      }
    },
+    mounted(){},
    model: {
      prop: 'value',
      event: 'file-change'
@@ -402,23 +274,14 @@
 </script>

 <style lang="less">
-.uploadty-disabled{
-  .ant-upload-list-item {
-    .anticon-close{
-      display: none;
-    }
-    .anticon-delete{
-      display: none;
+  .uploadty-disabled{
+    .ant-upload-list-item {
+      .anticon-close{
+        display: none;
+      }
+      .anticon-delete{
+        display: none;
+      }
    }
  }
-}
-  //---------------------------- begin 图片左右换位置 -------------------------------------
-  .uploadty-mover-mask{
-    background-color: rgba(0, 0, 0, 0.5);
-    opacity: .8;
-    color: #fff;
-    height: 28px;
-    line-height: 28px;
-  }
-  //---------------------------- end 图片左右换位置 -------------------------------------
 </style>