修改前端页面

kongdeqiang

2023-06-09 105abcb08f5d1c1114ce0e093d1a4912fbbfd609

 src/components/page/ticket/picture-form.vue

@@ -1,22 +1,25 @@
<template>
    <div>
      <el-dialog
          class="pic-dia"
        title="图像证据"
        :close-on-click-modal="false"
        :visible.sync="visible"
        v-dialogDrag>
        <div class="previewDialog" v-for="(item,index) in pictureList" :key="index">
          <img
            style="width: 100%"
            :src="item.url"
            :preview="item.preview"
            :preview-text="item.title"
            alt="">
          <!--<div class="enlargeBox">
            <img
              :src="item.larg"
              alt="">
          </div>-->
        v-dialogDrag
        >
        <div class="demo-image__preview">
          <div class="preview-box">
          <div v-for="item in  pictureList" :key="Math.random()"
          >
            <el-image
                :src="item"
                style="width: 100px;height: 200px"
                :preview-src-list="[item]"
            >
            </el-image>
          </div>
            </div>

        </div>
      </el-dialog>
    </div>
@@ -33,33 +36,54 @@
        },
        methods: {
            init(data) {

                this.pictureList=[]
                this.visible = true
                this.pictureList = data.map((item,index) => {
                    return {
                        url: '/ffzf/fileinfo/showImg/'+item,
                        title: item,
                        preview:'1',
                        //larg: require('@/assets/img/enlarge.png')
                    }
                })
                // this.pictureList = data.map((item,index) => {
                //     return {
                //         url: this.$systemconfig.basePath+'/ffzf/fileInfo/showImg?path='+item,
                //         // title: item,
                //         // preview:'1',
                //         //larg: require('@/assets/img/enlarge.png')
                //     }
                // })
                for (let i = 0; i < data.length; i++) {
                  let a= this.$systemconfig.basePath+'/ffzf/fileInfo/showImg?path='+data[i]
                  this.pictureList.push(a.toString())
                }
                this.$previewRefresh();
                console.log(this.pictureList,'pictureList-----pictureList')
                console.log(this.pictureList)
            }
        }
    }
</script>

<style lang="scss">
<style lang="scss" scoped>
  .pswp{
    z-index: 9999;
    display: none;
  }
  .preview-box{
    display: flex;
    flex-wrap: wrap;
    overflow: auto;
    div{
      margin: 5px;
    }
  }
  .pic-dia{
    ::v-deep.el-dialog{
      width: 40%;
      height: 60%;
    }
  }


</style>
<style lang="scss" scoped>
  .previewDialog{
    position: relative;
    cursor: pointer;
    height: 1000px;
    /*.enlargeBox{*/
    /*  position: absolute;*/
    /*  z-index: 99999;*/