From d6aec1c7bfed72bb3dbb3cde615099f705511e44 Mon Sep 17 00:00:00 2001 From: Tcsm <1377977403@qq.com> Date: 星期一, 08 五月 2023 22:22:23 +0800 Subject: [PATCH] 家根网页面 --- ruoyi-ui/src/views/device/equipmentInfo.vue | 165 +++++++++++++++++++++++++++++++++++------------------- 1 files changed, 106 insertions(+), 59 deletions(-) diff --git a/ruoyi-ui/src/views/device/equipmentInfo.vue b/ruoyi-ui/src/views/device/equipmentInfo.vue index 6873343..b94a6c0 100644 --- a/ruoyi-ui/src/views/device/equipmentInfo.vue +++ b/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: '璇疯緭鍏d', // 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> - \ No newline at end of file -- Gitblit v1.9.1