家根网页面

Tcsm

2023-05-08 d6aec1c7bfed72bb3dbb3cde615099f705511e44

 ruoyi-ui/src/views/device/equipmentInfo.vue

@@ -19,8 +19,8 @@
        <el-form-item label="设备名称" prop="name">
          <el-input v-model="formData.name" placeholder="请输入设备名称" clearable :style="{width: '100%'}" :disabled="dsb"></el-input>
        </el-form-item>
        <el-form-item label="时间" prop="createDate">
          <el-input v-model="formData.createDate" placeholder="请输入时间" clearable :style="{width: '100%'}" :disabled="dsb">
        <el-form-item label="时间" prop="happenTime">
          <el-input v-model="formData.happenTime" placeholder="请输入时间" clearable :style="{width: '100%'}" :disabled="dsb">
          </el-input>
        </el-form-item>
        <el-form-item label="购买人" prop="buyer">
@@ -44,8 +44,8 @@
        <el-form-item label="备注" prop="remark">
          <el-input v-model="formData.remark" placeholder="请输入备注" clearable :style="{width: '100%'}" :disabled="dsb"></el-input>
        </el-form-item>
        
  


        <h4 class="form-header">相关图片 </h4>
        <el-upload
          action="#"
@@ -86,37 +86,69 @@
            <i class="el-icon-delete"></i>
          </span>
        </span>
  
  


          </div>
        </el-upload>
  

        <h4 class="form-header">其他附件 </h4>
        <el-upload
          action=""
          :file-list="fileListOther"
          class="upload-demo"
          multiple
          :on-preview="handlePreview"
  
          :on-remove="handleRemove"
          :http-request="requestUpload"
          :show-file-list="true"
        >
          <el-button type="primary">上传附件</el-button>
          <template #tip>
            <div class="el-upload__tip">
            </div>
          </template>
  
  
        </el-upload>
  
      <el-upload
              action=""
              :file-list="fileListOther"
              class="upload-demo"
              multiple
              list-type="picture-card"
              :on-preview="handleFileCardPreview"
              :on-remove="handleRemove"
              :http-request="requestUpload"
              :show-file-list="true"
            >

                <i slot="default" class="el-icon-plus"></i>
                <div slot="file" slot-scope="{file}">
                  <img
                    class="el-upload-list__item-thumbnail"
                    src="../../assets/401_images/401.gif"
                    alt=""
                    style="width: 147px; height: 147px"
                    fit="cover"
                  >
                  <span class="el-upload-list__item-actions">
                  <span
                    class="el-upload-list__item-preview"
                    @click="handleFileCardPreview(file)"
                  >
                    <i class="el-icon-zoom-in"></i>
                  </span>
                  <span
      v-if="!disabled"
                    @click="handleRemove(file)"
                    class="el-upload-list__item-delete"

                  >
                    <i class="el-icon-download"></i>
                  </span>
                  <span
                    v-if="!disabled"
                    class="el-upload-list__item-delete"
                    @click="handleRemoveFile(file)"
                  >
                    <i class="el-icon-delete"></i>
                  </span>
                </span>


                </div>


            </el-upload>


        <el-form-item size="large">
          <el-button type="primary" @click="submitForm" :disabled="dsb">修改</el-button>
        </el-form-item>
      </el-form>
  

      <el-dialog  :visible.sync="dialogVisible">
        <img w-full :src="dialogImageUrl" alt="Preview Image" />
      </el-dialog>
@@ -128,7 +160,7 @@
  import {blobValidate} from "@/utils/ruoyi";
  import errorCode from "@/utils/errorCode";
  import {Message} from "element-ui";
  

  export default {
    components: {},
    props: [],
@@ -140,7 +172,7 @@
        fileList:[
        ],
        fileListOther:[
  

        ],
        dsb:true,
        btn:false,
@@ -154,7 +186,9 @@
          remark: undefined,
          familyId:undefined,
          url: undefined,
          happenTime:undefined
        },
        desurl:'',
        dialogImageUrl: '',
        dialogVisible: false,
        disabled: false,
@@ -164,7 +198,7 @@
          //   message: '请输入id',
          //   trigger: 'blur'
          // }],
          createDate: [{
          happenTime: [{
            required: true,
            message: '请选择时间',
            trigger: 'change'
@@ -204,7 +238,7 @@
            message: '请输入备注',
            trigger: 'blur'
          }],
  

        },
        typeOptions: [],
      }
@@ -227,20 +261,20 @@
        document.title = "查看家庭设备详细信息";
        this.$route.meta.title = "查看家庭设备详细信息";//列表的名称
      }
  

      let _this = this
      if (id) {
        this.loading = true;
        getEquipmentInfo(id).then((response) => {
       

          this.formData = response.data;
          let paths = response.data.url.split(",");
          for(let i = 0; i < paths.length; i++)
          {
            if(paths[i]!="") {
  

              let pth = paths[i].substr(paths[i].length - 4, paths[i].length)
  

              if (_this.fot.includes(pth) === true)
                _this.fileList.push({name:paths[i],url: process.env.VUE_APP_BASE_TRUE_API+paths[i]})
              else {
@@ -254,7 +288,7 @@
          this.loading = false;
        });
        // this.getCateInfor()
  

      }
    },
    mounted() {},
@@ -264,7 +298,7 @@
      // {
      //   let _this = this
      //   getCategory().then(response=>{
  

      //     response.data.itemValues.replace("{","").replace("}","").split(",").map(elem=>{
      //       _this.typeOptions.push({"label":elem.split(":")[0], "value":elem.split(":")[0]})
      //     })
@@ -278,10 +312,10 @@
          return elem.url.replace(process.env.VUE_APP_BASE_TRUE_API,"")
        }).join(",")
        this.formData.url = ul+","+uls
  

        this.$refs['elForm'].validate(valid => {
  
  


          if (valid) {
            if (this.formData.id != undefined) {
              updateEquipment(this.formData).then(response => {
@@ -291,7 +325,7 @@
              });
            } else {
              this.$modal.msgSuccess("修改失败");
  

            }
          }
        })
@@ -312,12 +346,26 @@
          saveAs(blob, filename)
        })
      },
      handleRemoveFile(file) {
        alert(23)
      },
      handleRemove(file) {
        alert(323)
      },
  handleRemoveFile(file) {
    for(let i = 0; i < this.fileListOther.length; i++)
    {
      if(this.fileListOther[i].url==file.url)
        this.$delete(this.fileListOther,i);
    }
  },
  handleRemove(file) {
    for(let i = 0; i < this.fileList.length; i++)
    {
      if(this.fileList[i].url==file.url)
        this.$delete(this.fileList,i);
    }
  },
  handleFileCardPreview(file){
    this.dialogFileUrl = file.url;
    const Base64 = require('js-base64').Base64
    this.desurl = process.env.VUE_APP_BASE_OTHER_API+'onlinePreview?url='+encodeURIComponent(Base64.encode(this.dialogFileUrl));
    var myWindow=window.open(this.desurl,'','width=1200,height=800,top=150,left=300');
  },
      handlePictureCardPreview(file) {
        this.dialogImageUrl = file.url;
        this.dialogVisible = true;
@@ -325,7 +373,7 @@
      //点击下载函数
      handleDownload(url) {
        var formData = {'path':"/"+url.replace(process.env.VUE_APP_BASE_TRUE_API,"")};
  

        let lens = formData.path.split(".")
        let suffix = lens[lens.length-1]
        download(formData).then(async (response) => {
@@ -347,27 +395,27 @@
        var formData = new FormData();
        formData.append('uploadFile', file);
        let _this = this
  

        uploadPic(formData).then(response => {
          let pth = response.data.originalFilename.substr(response.data.originalFilename.length-4, response.data.originalFilename.length)
  

          if(_this.fot.includes(pth) === true)
          {
            _this.fileList.push({name:response.data.fileName, "url":response.data.url})
  

          }
  

          else{
            _this.fileListOther.push({name:response.data.fileName, url:response.data.url})
  

          }
        })
  

      }
  

    }
  }
  

  </script>
  <style>
  .mt
@@ -376,7 +424,7 @@
  }
  .dt{
    display: block;
  

  }
  .pt{
    right: 10px;
@@ -385,4 +433,3 @@
    position: absolute;
  }
  </style>