Commit d0bbbd07 by pangchong

feat: 文件上传修改

parent 7f9d0d62
......@@ -18,16 +18,18 @@
</view>
<view class="tool" @tap="previewFile(item.fileUrl)"><up-icon name="eye" size="18" color="#4E5969"></up-icon></view>
</view>
<view class="upload-item-right" @tap="deleteFile(index)"><global-icon icon="delete-01" color="#F53F3F"></global-icon></view>
<view class="upload-item-right" @tap="deleteFile(index)" v-if="showUpload">
<global-icon icon="delete-01" color="#F53F3F"></global-icon>
</view>
</view>
</view>
<template v-if="showUpload">
<view class="upload-button" v-if="isLoading">
<up-loading-icon text="上传中" textSize="14"></up-loading-icon>
</view>
<lsj-upload
v-else
width="640rpx"
height="88rpx"
:height="isLoading ? '0rpx' : '88rpx'"
:option="getOptions"
:size="30"
:instantly="true"
......@@ -36,10 +38,11 @@
@change="change"
>
<view class="upload-button">
<up-icon name="plus" size="18" color="#4E5969"></up-icon>
<up-icon name="plus" size="16" color="#4E5969"></up-icon>
<text class="txt">上传文件</text>
</view>
</lsj-upload>
</template>
<up-modal
:width="250"
content="确认删除吗?删除后不可恢复!"
......@@ -77,9 +80,20 @@ const ps = defineProps({
mapFieldSplit: {
type: String,
default: ','
},
showUpload: {
type: Boolean,
default: true
}
})
const fileList = ref(cloneDeep(ps.fileList))
const fileList = ref([])
watch(
() => ps.fileList,
(value) => {
fileList.value = cloneDeep(value)
},
{ immediate: true }
)
const getFileList = computed(() => {
return fileList.value.map((item) => {
return { ...item, url: item.fileUrl }
......@@ -102,6 +116,10 @@ const confirm = () => {
}
//预览图片
const previewFile = (fileUrl) => {
uni.showLoading({
title: '正在打开文件',
mask: true
})
uni.downloadFile({
url: fileUrl,
success: function (res) {
......@@ -110,9 +128,18 @@ const previewFile = (fileUrl) => {
filePath: filePath,
showMenu: true,
success: function (res) {
console.log('打开文档成功')
uni.hideLoading()
console.log('打开文件成功')
},
fail: function () {
uni.hideLoading()
uni.$mocpMessage.showToast('打开文件失败')
}
})
},
fail: function () {
uni.hideLoading()
uni.$mocpMessage.showToast('打开文件失败')
}
})
}
......@@ -120,15 +147,16 @@ const isLoading = ref(false)
const onuploadEnd = (e) => {
if (e.type == 'success') {
const res = JSON.parse(e.responseText)
console.log('接口响应结果:', res)
if (res.code == 200) {
fileList.value.push(res.data)
uni.$mocpMessage.showToast(res.message || '上传成功')
} else {
uni.$mocpMessage.showToast(res.message || '请求错误')
}
} else {
uni.$mocpMessage.showToast('上传失败')
}
isLoading.value = false
}
const change = (e) => {
......@@ -156,6 +184,7 @@ watch(
background: #f3f3f3;
width: 640rpx;
height: 88rpx;
line-height: 88rpx;
.txt {
color: $mocp-text-5;
}
......@@ -168,9 +197,9 @@ watch(
align-items: center;
justify-content: space-between;
&-left {
width: 100%;
display: flex;
align-items: center;
width: 640rpx;
background: #f3f3f3;
box-sizing: border-box;
padding: 0 20rpx 0 24rpx;
......@@ -191,6 +220,10 @@ watch(
}
}
}
&-right {
width: 46rpx;
text-align: right;
}
}
}
</style>
......@@ -70,7 +70,7 @@
</card-details>
<card-details type="appeal" title="申诉状态" titleIcon="email">
<view class="appeal-status">{{ useGetDictByValue('appealInfo', details.appealInfo) }}</view>
<global-album :fileList="getFileList"></global-album>
<global-upload :fileList="getFileList" :showUpload="false"></global-upload>
</card-details>
</template>
</global-page>
......
......@@ -41,7 +41,7 @@
{{ details.taskDescribe }}
</view>
<view class="details-body-file">
<global-album :fileList="details.taskFileVoList"></global-album>
<global-upload :fileList="details.taskFileVoList" :showUpload="false"></global-upload>
</view>
</view>
<view class="details-footer">
......@@ -62,14 +62,14 @@
</card-details-item>
</template>
<card-details-item label="当前进展" :content="arrangeWorkExtend.current">
<global-album :fileList="arrangeWorkExtend.fileVoList"></global-album>
<global-upload :fileList="arrangeWorkExtend.fileVoList" :showUpload="false"></global-upload>
</card-details-item>
<card-details-item>
<card-details-footer leftLabel="基地/部门批准领导:" :leftValue="arrangeWorkExtend.baseApprovalLeader"></card-details-footer>
<card-details-footer leftLabel="MCD批准领导:" :leftValue="arrangeWorkExtend.mcdApprovalLeader"></card-details-footer>
</card-details-item>
<card-details-item label="批复附件" :borderBottom="false">
<global-album :fileList="arrangeWorkExtend.approvalFileVoList"></global-album>
<global-upload :fileList="arrangeWorkExtend.approvalFileVoList" :showUpload="false"></global-upload>
<card-details-footer
leftLabel="后续措施反馈:"
:leftValue="arrangeWorkExtend.followUpFeedback == '1' ? '是' : '否'"
......@@ -153,7 +153,7 @@
:content="baseStore.getParamNameByValue('ApplicationType', arrangeWorkExtend.appType)"
></card-details-item>
<card-details-item label="验证材料">
<global-album :fileList="arrangeWorkExtend.followUpFeedbackFileVoList"></global-album>
<global-upload :fileList="arrangeWorkExtend.followUpFeedbackFileVoList" :showUpload="false"></global-upload>
<card-details-footer
leftLabel="反馈人:"
:leftValue="arrangeWorkExtend.followUpFeedbackUser || '-'"
......@@ -165,7 +165,7 @@
<card-details title="工作验证" :showEmpty="arrangeWorkExtend.eventType == ''" v-if="arrangeWorkExtend.eventType != ''">
<card-details-item title="跟踪要点" :content="arrangeWorkExtend.trackingPoints"></card-details-item>
<card-details-item label="批复附件">
<global-album :fileList="arrangeWorkExtend.validateFileVoList"></global-album>
<global-upload :fileList="arrangeWorkExtend.validateFileVoList" :showUpload="false"></global-upload>
<card-details-footer
leftLabel="事件类型:"
:leftValue="baseStore.getParamNameByValue('LayoutEventType', arrangeWorkExtend.eventType)"
......
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment