| | |
| | | <u-form-item label="图片附件" |
| | | prop="storageBlobDTOs" |
| | | border-bottom> |
| | | <u-upload :fileList="fileList" |
| | | @afterRead="afterRead" |
| | | @delete="deleteFile" |
| | | name="file" |
| | | multiple |
| | | :maxCount="9" |
| | | accept="image"></u-upload> |
| | | <CommonUpload v-model="form.storageBlobDTOs" /> |
| | | </u-form-item> |
| | | </u-cell-group> |
| | | <!-- 提交按钮 --> |
| | |
| | | import { ref, computed, onMounted, onUnmounted } from "vue"; |
| | | import { onShow, onLoad } from "@dcloudio/uni-app"; |
| | | import PageHeader from "@/components/PageHeader.vue"; |
| | | import CommonUpload from "@/components/CommonUpload.vue"; |
| | | import { getDeviceLedger } from "@/api/equipmentManagement/ledger"; |
| | | import { |
| | | addRepair, |
| | |
| | | } from "@/api/equipmentManagement/repair"; |
| | | import dayjs from "dayjs"; |
| | | import { formatDateToYMD } from "@/utils/ruoyi"; |
| | | import { getToken } from "@/utils/auth"; |
| | | import config from "@/config"; |
| | | const showToast = message => { |
| | | uni.showToast({ |
| | | title: message, |
| | |
| | | storageBlobDTOs: [], // 图片附件 |
| | | }); |
| | | |
| | | const fileList = ref([]); |
| | | |
| | | // 报修状态选项 |
| | | const repairStatusOptions = ref([ |
| | | { name: "待维修", value: "0" }, |
| | |
| | | form.value.machineryCategory = data.machineryCategory; |
| | | form.value.remark = data.remark; |
| | | form.value.storageBlobDTOs = data.storageBlobVOs || []; |
| | | // 设置图片列表显示 |
| | | if (data.storageBlobVOs && data.storageBlobVOs.length > 0) { |
| | | fileList.value = data.storageBlobVOs.map(item => ({ |
| | | url: item.url, |
| | | name: item.name, |
| | | status: "success", |
| | | message: "", |
| | | })); |
| | | } |
| | | repairStatusText.value = |
| | | repairStatusOptions.value.find(item => item.value == data.status) |
| | | ?.name || ""; |
| | |
| | | form.value.repairTime = formatDateToYMD(e.value); |
| | | pickerDateValue.value = dayjs(e.value).format("YYYY-MM-DD"); |
| | | showDate.value = false; |
| | | }; |
| | | |
| | | // 图片上传后的处理 |
| | | const afterRead = async event => { |
| | | // 当设置 mutiple 为 true 时, file 为数组格式,否则为对象格式 |
| | | let lists = [].concat(event.file); |
| | | let fileListLen = fileList.value.length; |
| | | lists.map(item => { |
| | | fileList.value.push({ |
| | | ...item, |
| | | status: "uploading", |
| | | message: "上传中", |
| | | }); |
| | | }); |
| | | for (let i = 0; i < lists.length; i++) { |
| | | try { |
| | | const result = await uploadFilePromise(lists[i].url); |
| | | let item = fileList.value[fileListLen]; |
| | | fileList.value.splice( |
| | | fileListLen, |
| | | 1, |
| | | Object.assign(item, { |
| | | status: "success", |
| | | message: "", |
| | | url: result.url, |
| | | name: result.name, |
| | | }) |
| | | ); |
| | | // 同步到表单数据 |
| | | form.value.storageBlobDTOs.push(result); |
| | | fileListLen++; |
| | | } catch (e) { |
| | | let item = fileList.value[fileListLen]; |
| | | fileList.value.splice( |
| | | fileListLen, |
| | | 1, |
| | | Object.assign(item, { |
| | | status: "failed", |
| | | message: "上传失败", |
| | | }) |
| | | ); |
| | | showToast(typeof e === "string" ? e : "上传失败"); |
| | | } |
| | | } |
| | | }; |
| | | |
| | | const uploadFilePromise = url => { |
| | | return new Promise((resolve, reject) => { |
| | | uni.uploadFile({ |
| | | url: config.baseUrl + "/common/upload", |
| | | filePath: url, |
| | | name: "files", |
| | | header: { |
| | | Authorization: "Bearer " + getToken(), |
| | | }, |
| | | success: res => { |
| | | try { |
| | | const data = JSON.parse(res.data); |
| | | if (data.code === 200) { |
| | | // 如果返回的是数组,取第一个元素,避免嵌套数组 |
| | | const resultData = Array.isArray(data.data) |
| | | ? data.data[0] |
| | | : data.data; |
| | | |
| | | // 如果 url 为空且 previewURL 存在,则处理 previewURL 赋值给 url |
| | | if (!resultData.url && resultData.previewURL) { |
| | | resultData.url = resultData.previewURL; |
| | | } |
| | | resultData.name = resultData.originalFilename; |
| | | |
| | | resolve(resultData); |
| | | } else { |
| | | reject(data.msg || "上传失败"); |
| | | } |
| | | } catch (e) { |
| | | reject("解析响应失败"); |
| | | } |
| | | }, |
| | | fail: err => { |
| | | reject(err); |
| | | }, |
| | | }); |
| | | }); |
| | | }; |
| | | |
| | | const deleteFile = event => { |
| | | fileList.value.splice(event.index, 1); |
| | | form.value.storageBlobDTOs.splice(event.index, 1); |
| | | }; |
| | | |
| | | onShow(() => { |