From 1833dd6d7cac01c35840af52fadc1199821e5805 Mon Sep 17 00:00:00 2001 From: Houjie <714924425@qq.com> Date: 星期四, 15 五月 2025 09:28:16 +0800 Subject: [PATCH] 提交优化项 --- pages/checkList/checkListDetils/checkListDetils.vue | 362 ++++++++++++++++++++++++++++++++------------------- 1 files changed, 226 insertions(+), 136 deletions(-) diff --git a/pages/checkList/checkListDetils/checkListDetils.vue b/pages/checkList/checkListDetils/checkListDetils.vue index fc70d2c..ded0835 100644 --- a/pages/checkList/checkListDetils/checkListDetils.vue +++ b/pages/checkList/checkListDetils/checkListDetils.vue @@ -6,7 +6,18 @@ </cu-custom> <view class="container"> + <template> + <!-- 娴獥閬僵灞� --> + <view v-if="showPreview" class="overlay" @tap.stop="closePreview"> + <view class="modal"> + <!-- 鍏抽棴鎸夐挳 --> + <text class="close-btn" @tap.stop="showPreview = false">×</text> + <!-- 鍥剧墖灞曠ず --> + <image :src="previewImageSrc" mode="aspectFit" class="preview-image" /> + </view> + </view> + </template> <uni-forms ref="form" :modelValue="formData" validate-trigger="bind" err-show-type="undertext"> <uni-group top="1"> <view class="text-gray margin-bottom-lg">鈥斺�斺�斺�斺�斺�斺�斺�斺�斺�� 鍩烘湰淇℃伅 鈥斺�斺�斺�斺�斺�斺�斺�斺�斺��</view> @@ -27,18 +38,12 @@ <uni-easyinput type="textarea" v-model="formData.remark" :disabled="true" /> </uni-forms-item> <uni-forms-item name="outNum" :label-width="80" label="鐐规鍥剧墖:"> - <view class="grid col-4 grid-square flex-sub"> - <view class="bg-img" v-for="(item,index) in imgList" :key="index" @tap="ViewImage" - :data-url="imgList[index]"> - <image :src="imgList[index]" mode="aspectFill"></image> - <view class="cu-tag bg-red radius" @tap.stop="DelImg" :data-index="index"> - <text class='cuIcon-close'></text> - </view> - </view> - <view class="solids" v-if="imgList.length<1"> - <text class='cuIcon-cameraadd'></text> - </view> - </view> + <uni-file-picker limit="9" :value="fileLists" :image-styles="imageStyles" + :sourceType="sourceType" @select="select" @progress="progress" @success="success" + @fail="fail" @delete="deletea" :readonly="true" /> + </uni-forms-item> + <uni-forms-item name="outNum" :label-width="80" label="浣滀笟鎸囧:"> + <button class="cu-btn bg-blue" @tap="showPreview = true">鏌ョ湅</button> </uni-forms-item> </uni-group> </uni-forms> @@ -59,14 +64,17 @@ </view> <view class="flex"> <view class="flex-sub text-light bg-white padding-xs margin-xs radius">淇濆吇瑕佹眰:</view> - <view class="flex-sub bg-white padding-xs margin-xs radius text-right" + <view class="flex-sub bg-white padding-xs margin-xs radius text-right"> + {{item.itemDemand}} + </view> + <!-- <view class="flex-sub bg-white padding-xs margin-xs radius text-right" v-if="item.itemDemand!=null && item.itemDemand.length>10"> {{(item.itemDemand).toString().substr(0,10)+'...'}} </view> <view class="flex-sub bg-white padding-xs margin-xs radius text-right" v-else> {{item.itemDemand}} - </view> + </view> --> </view> <view class="flex"> @@ -102,6 +110,16 @@ mixins: [MescrollMixin], // 浣跨敤mixin data() { return { + showPreview: false, + // 鍥剧墖鍥炴樉 + fileLists: [], + // 涓婁紶鍥剧墖鐨勬牱寮� + sourceType: ['album', 'camera'], + imageStyles: { + width: 90, + height: 90, + }, + previewImageSrc: '', ipAndPort: configService.staticURL, scrollLeft: 0, searchValue: '', @@ -120,11 +138,12 @@ url: { upload: "/eam/sysFiles/batch_upload", stallList: "/eam/eamInspectionOrder/queryById", - getEquipmentList:'eam/equipment/list', - // getEquipmentList: "eam/equipment/asyncLoadEquipment", + getEquipmentList: 'eam/equipment/list', + getStandardFile: "eam/maintenanceStandard/queryById", BaoList: 'eam/eamInspectionOrderDetail/queryList' }, id: '', + standardId: '', inspectionResult: '', upOption: { page: { @@ -140,10 +159,12 @@ isShowNoMore: false, textNoMore: '鎴戞槸鏈夊簳绾跨殑 >_<' }, + imgList: [], styles: { color: '#2979FF', borderColor: '#2979FF' }, + referenceFileList: [], msg1Count: 0, msg2Count: 0, msg1Title: "" @@ -171,54 +192,41 @@ }, methods: { + closePreview() { + this.showPreview = false; + }, changeEquipmentList(e) { this.formData.num = e; }, handleCode(e) { this.inspectionResult = e; }, - getEquipment() { - this.$http.get(this.url.getEquipmentList, { - params: { - pageNo: 1, - pageSize: 9999, - order: 'desc', - column: 'createTime' - }, - - }).then(res => { - //璁剧疆鍒楄〃鏁版嵁 - if (res.data.success) { - this.equipmentList = res.data.result.records - } else { - uni.showToast({ - icon: "error", - title: res.data.message, - duration: 2000 - }); - - } - }).catch(() => { - this.$tip.error("鑱旂綉澶辫触") - }) - }, - // getEquipment() { - // this.$http.get(this.url.getEquipmentList).then(res => { - // //璁剧疆鍒楄〃鏁版嵁 - // if (res.data.success) { - // this.equipmentList = res.data.result - // } else { - // uni.showToast({ - // icon: "error", - // title: res.data.message, - // duration: 2000 - // }); + getEquipment() { + this.$http.get(this.url.getEquipmentList, { + params: { + pageNo: 1, + pageSize: 9999, + order: 'desc', + column: 'createTime' + }, - // } - // }).catch(() => { - // this.$tip.error("鑱旂綉澶辫触") - // }) - // }, + }).then(res => { + //璁剧疆鍒楄〃鏁版嵁 + if (res.data.success) { + this.equipmentList = res.data.result.records + } else { + uni.showToast({ + icon: "error", + title: res.data.message, + duration: 2000 + }); + + } + }).catch(() => { + this.$tip.error("鑱旂綉澶辫触") + }) + }, + getList() { this.$http.get(this.url.BaoList, { params: { @@ -237,68 +245,102 @@ //鑱旂綉澶辫触, 缁撴潫鍔犺浇 }) }, - ChooseImage() { - var that = this; - uni.chooseImage({ - count: 4, - sizeType: ['original', 'compressed'], // 鍙互鎸囧畾鏄師鍥捐繕鏄帇缂╁浘锛岄粯璁や簩鑰呴兘鏈� - sourceType: ['album'], // 浠庣浉鍐岄�夋嫨 - success: (res) => { - // 瀛樺偍閫夋嫨鐨勫浘鐗囪矾寰� - that.imgList = res.tempFilePaths; - that.formData.avatar =[]; - // 鍒涘缓涓婁紶浠诲姟鐨� Promise 鏁扮粍 - const uploadPromises = res.tempFilePaths.map((filePath, index) => { - return new Promise((resolve, reject) => { - that.$http.upload(that.url.upload, { - filePath: filePath, - name: 'file' - }) - .then(uploadRes => { - // 鍋囪鏈嶅姟鍣ㄨ繑鍥炵殑缁撴灉涓寘鍚枃浠惰矾寰� - const filePath = uploadRes.data.result[0]; - // 杩藉姞鍒� formData.avatar 涓紝骞剁敤閫楀彿鍒嗛殧 - this.formData.avatar.push(filePath); - resolve(filePath); - }) - .catch(err => { - console.error('鍥剧墖' + index + '涓婁紶澶辫触:', err); - reject(err); - }); - }); - }); - - // 骞跺彂鎵ц鎵�鏈変笂浼犱换鍔� - Promise.all(uploadPromises) - .then((uploadedFilePaths) => { - console.log('鎵�鏈夊浘鐗囦笂浼犳垚鍔�:', that.formData.avatar); - }) - .catch((err) => { - console.error('鍥剧墖涓婁紶澶辫触:', err); - that.$tip.error('鍥剧墖涓婁紶澶辫触'); - }); - } - }); - }, - ViewImage(e) { - uni.previewImage({ - urls: this.imgList, - current: e.currentTarget.dataset.url - }); - }, - DelImg(e) { - uni.showModal({ - title: '鎻愮ず', - content: '纭畾瑕佸垹闄よ繖娈靛洖蹇嗗悧锛�', - cancelText: '鍐嶇湅鐪�', - confirmText: '鍐嶈', - success: res => { - if (res.confirm) { - this.imgList.splice(e.currentTarget.dataset.index, 1) - } - } - }) - }, + + getStandardFile() { + this.$http.get(this.url.getStandardFile, { + params: { + id: this.standardId + } + }).then(res => { + if (res.data.success) { + console.log("res", res.data.result); + const referenceFileStr = res.data.result.referenceFile; + + // 鍒ゆ柇鏄惁瀛樺湪 referenceFile 骞惰繘琛岃В鏋� + if (referenceFileStr) { + try { + const referenceFileObj = JSON.parse(referenceFileStr); + const filePath = `${this.ipAndPort}${referenceFileObj.filePath}`; + this.previewImageSrc = filePath; + console.log('previewImageSrc:', this.previewImageSrc); + } catch (e) { + console.error("referenceFile 瑙f瀽澶辫触", e); + this.previewImageSrc = ''; + } + } else { + console.warn("referenceFile 涓嶅瓨鍦�"); + this.previewImageSrc = ''; + } + } + }).catch(err => { + console.error("缃戠粶璇锋眰澶辫触", err); + // 鑱旂綉澶辫触, 缁撴潫鍔犺浇 + }); + }, + + + // ChooseImage() { + // var that = this; + // uni.chooseImage({ + // count: 4, + // sizeType: ['original', 'compressed'], // 鍙互鎸囧畾鏄師鍥捐繕鏄帇缂╁浘锛岄粯璁や簩鑰呴兘鏈� + // sourceType: ['album'], // 浠庣浉鍐岄�夋嫨 + // success: (res) => { + // // 瀛樺偍閫夋嫨鐨勫浘鐗囪矾寰� + // that.imgList = res.tempFilePaths; + // that.formData.avatar =[]; + // // 鍒涘缓涓婁紶浠诲姟鐨� Promise 鏁扮粍 + // const uploadPromises = res.tempFilePaths.map((filePath, index) => { + // return new Promise((resolve, reject) => { + // that.$http.upload(that.url.upload, { + // filePath: filePath, + // name: 'file' + // }) + // .then(uploadRes => { + // // 鍋囪鏈嶅姟鍣ㄨ繑鍥炵殑缁撴灉涓寘鍚枃浠惰矾寰� + // const filePath = uploadRes.data.result[0]; + // // 杩藉姞鍒� formData.avatar 涓紝骞剁敤閫楀彿鍒嗛殧 + // this.formData.avatar.push(filePath); + // resolve(filePath); + // }) + // .catch(err => { + // console.error('鍥剧墖' + index + '涓婁紶澶辫触:', err); + // reject(err); + // }); + // }); + // }); + + // // 骞跺彂鎵ц鎵�鏈変笂浼犱换鍔� + // Promise.all(uploadPromises) + // .then((uploadedFilePaths) => { + // console.log('鎵�鏈夊浘鐗囦笂浼犳垚鍔�:', that.formData.avatar); + // }) + // .catch((err) => { + // console.error('鍥剧墖涓婁紶澶辫触:', err); + // that.$tip.error('鍥剧墖涓婁紶澶辫触'); + // }); + // } + // }); + // }, + // ViewImage(e) { + // uni.previewImage({ + // urls: this.imgList, + // current: e.currentTarget.dataset.url + // }); + // }, + // DelImg(e) { + // uni.showModal({ + // title: '鎻愮ず', + // content: '纭畾瑕佸垹闄よ繖娈靛洖蹇嗗悧锛�', + // cancelText: '鍐嶇湅鐪�', + // confirmText: '鍐嶈', + // success: res => { + // if (res.confirm) { + // this.imgList.splice(e.currentTarget.dataset.index, 1) + // } + // } + // }) + // }, upCallback() { this.$http.get(this.url.stallList, { @@ -310,23 +352,34 @@ console.log("url", res) //璁剧疆鍒楄〃鏁版嵁 if (res.data.success) { - - this.formData.num = this.announcement1.equipmentId - this.formData.orderNum = this.announcement1.orderNum - this.formData.operator = this.announcement1.operator - this.formData.remark=this.announcement1.remark - this.formData.inspectionDate = this.announcement1.inspectionDate - this.formData.avatar = this.announcement1.imageFiles - if(!this.formData.avatar == null){ - this.imgList = JSON.parse(this.formData.avatar) - const imageObjects = JSON.parse(this.formData.avatar);a - // 鎻愬彇 filePath 骞舵嫾鎺� IP 鍜岀鍙� - this.imgList = imageObjects.map(imageObj => { - return `${this.ipAndPort}${imageObj.filePath}`; - }); - } - - + this.formData.num = this.announcement1.equipmentId + this.formData.orderNum = this.announcement1.orderNum + this.formData.operator = this.announcement1.operator + this.formData.remark = this.announcement1.remark + this.formData.inspectionDate = this.announcement1.inspectionDate + if (this.announcement1.standardId !== null) { + this.standardId = this.announcement1.standardId + this.getStandardFile() + } + this.formData.avatar = this.announcement1.imageFiles + if (!this.formData.avatar == null) { + this.imgList = JSON.parse(this.formData.avatar) + const imageObjects = JSON.parse(this.formData.avatar); + a + // 鎻愬彇 filePath 骞舵嫾鎺� IP 鍜岀鍙� + this.imgList = imageObjects.map(imageObj => { + return `${this.ipAndPort}${imageObj.filePath}`; + }); + + // 鏍规嵁 imgList 鏋勯�� fileLists + this.fileLists = this.imgList.map(url => ({ + url: url, + extname: 'png', + name: 'eam' + })); + } + + } }).catch(() => { //鑱旂綉澶辫触, 缁撴潫鍔犺浇 @@ -404,4 +457,41 @@ margin-top: 85px; height: auto; } + + .overlay { + position: fixed; + top: 0; + left: 0; + width: 100%; + height: 100%; + background-color: rgba(0, 0, 0, 0.7); + display: flex; + align-items: center; + justify-content: center; + z-index: 999; + } + + .modal { + position: relative; + width: 90%; + max-width: 600px; + background: #fff; + border-radius: 12rpx; + padding: 20rpx; + box-sizing: border-box; + } + + .preview-image { + width: 100%; + max-height: 80vh; + object-fit: contain; + } + + .close-btn { + position: absolute; + top: 10rpx; + right: 20rpx; + font-size: 40rpx; + color: #333; + } </style> \ No newline at end of file -- Gitblit v1.9.3