优化处置文件上传，报废驳回等问题
This commit is contained in:
BianLzhaoMin
parent
947dc56d6c
commit
b9e8f34fe9
|
|
@ -0,0 +1,148 @@
|
|||
<template>
|
||||
<el-upload
|
||||
class="upload-demo"
|
||||
:action="uploadUrl"
|
||||
:multiple="multiple"
|
||||
:limit="limit"
|
||||
:file-list="fileList"
|
||||
:data="uploadParams"
|
||||
:headers="headers"
|
||||
:on-success="handleSuccess"
|
||||
:on-remove="handleRemove"
|
||||
:before-upload="beforeUpload"
|
||||
:on-exceed="onExceed"
|
||||
>
|
||||
<slot name="default">
|
||||
<template>
|
||||
<el-row class="Upload-tip">
|
||||
<el-button size="small" type="primary">点击上传</el-button>
|
||||
</el-row>
|
||||
<el-row class="upload-tip">
|
||||
<span class="tip-text">{{ uploadTip }}</span>
|
||||
</el-row>
|
||||
</template>
|
||||
</slot>
|
||||
</el-upload>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import { getToken } from '@/utils/auth'
|
||||
export default {
|
||||
name: 'UploadFile',
|
||||
props: {
|
||||
// 文件列表
|
||||
fileList: {
|
||||
type: Array,
|
||||
default: () => [],
|
||||
},
|
||||
// 文件上传地址
|
||||
uploadUrl: {
|
||||
type: String,
|
||||
default: '',
|
||||
},
|
||||
// 文件数量
|
||||
limit: {
|
||||
type: Number,
|
||||
default: 3,
|
||||
},
|
||||
// 单个文件大小
|
||||
fileSize: {
|
||||
Number,
|
||||
default: 5,
|
||||
},
|
||||
// 是否可以多选
|
||||
multiple: {
|
||||
type: Boolean,
|
||||
default: true,
|
||||
},
|
||||
// 允许上传的文件类型
|
||||
fileAccept: {
|
||||
type: Array,
|
||||
default: () => {
|
||||
return [
|
||||
'image/png',
|
||||
'image/jpd',
|
||||
'image/jpeg',
|
||||
'application/pdf',
|
||||
'application/msword',
|
||||
'application/vnd.openxmlformats-officedocument.wordprocessingml.document',
|
||||
'application/vnd.ms-excel',
|
||||
'application/vnd.openxmlformats-officedocument.spreadsheetml.sheet',
|
||||
]
|
||||
},
|
||||
},
|
||||
fileType: {
|
||||
type: String,
|
||||
default: () => {
|
||||
return '.png、.jpg、.jpeg、.pdf、.doc、.docs、.xls、.xlsx'
|
||||
},
|
||||
},
|
||||
// 上传时的额外参数
|
||||
uploadParams: {
|
||||
type: Object,
|
||||
default: () => {
|
||||
return { fileType: 'sx' }
|
||||
},
|
||||
},
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
headers: {
|
||||
Authorization: 'Bearer ' + getToken(),
|
||||
},
|
||||
}
|
||||
},
|
||||
computed: {
|
||||
// 上传文件的提示
|
||||
uploadTip() {
|
||||
return `请上传${this.fileType}格式的文件，且单个文件大小不能超过${this.fileSize}M，上传的文件数量不可超过${this.limit}个`
|
||||
},
|
||||
},
|
||||
methods: {
|
||||
// 文件上传之前 1、判断文件类型是否符合要求 2、判断文件大小是否符合要求
|
||||
beforeUpload(file) {
|
||||
const isFileType = this.fileAccept.includes(file.type)
|
||||
if (!isFileType) {
|
||||
this.$message.error(`只能上传${this.fileType}格式文件！`)
|
||||
return false
|
||||
}
|
||||
const fileSize = file.size / 1024 / 1024 > this.fileSize
|
||||
if (fileSize) {
|
||||
this.$message.error(`单个文件大小不能超过${this.fileSize}M！`)
|
||||
return false
|
||||
}
|
||||
},
|
||||
// 上传成功
|
||||
handleSuccess(res) {
|
||||
this.$emit('handleSuccess', res.data)
|
||||
},
|
||||
// 移除文件
|
||||
handleRemove(file) {
|
||||
console.log('文件移除', file)
|
||||
this.$emit('handleRemove', file)
|
||||
},
|
||||
// 文件上传个数超过指定数量
|
||||
onExceed() {
|
||||
this.$message.error(`文件上传数量不能超过${this.limit}个！`)
|
||||
},
|
||||
},
|
||||
}
|
||||
</script>
|
||||
|
||||
<style scoped>
|
||||
.upload-demo .el-upload__tip {
|
||||
margin-top: 10px;
|
||||
}
|
||||
|
||||
.Upload-tip {
|
||||
text-align: left;
|
||||
}
|
||||
|
||||
.upload-tip {
|
||||
margin-top: 8px;
|
||||
color: red;
|
||||
}
|
||||
.el-upload-list__item {
|
||||
font-size: 16px;
|
||||
}
|
||||
</style>
|
||||
|
|
@ -13,6 +13,7 @@
|
|||
type="primary"
|
||||
size="mini"
|
||||
@click="handleComplete"
|
||||
v-if="isDetails == 0"
|
||||
>完成退料</el-button
|
||||
>
|
||||
</el-row>
|
||||
|
|
@ -49,7 +50,7 @@
|
|||
@click="handleRevoke(data)"
|
||||
icon="el-icon-circle-close"
|
||||
style="color: #de3115"
|
||||
v-if="data.num == 0"
|
||||
v-if="data.num == 0 && isDetails == 0"
|
||||
>
|
||||
撤回
|
||||
</el-button>
|
||||
|
|
@ -365,6 +366,9 @@ export default {
|
|||
type: Object,
|
||||
default: () => null,
|
||||
},
|
||||
isDetails: {
|
||||
default: 0,
|
||||
},
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
|
|
@ -892,6 +896,12 @@ export default {
|
|||
}
|
||||
|
||||
const res = await getScrapReturnCompleteApi(endBackParams)
|
||||
|
||||
if (res.code == 200) {
|
||||
this.$message.success('退料成功！')
|
||||
this.dialogConfigReturn.outerVisible = false
|
||||
this.$emit('closeReturnPage')
|
||||
}
|
||||
console.log(res, '退料结果')
|
||||
|
||||
// this.submitScrapParams.deptIds = []
|
||||
|
|
|
|||
|
|
@ -82,14 +82,16 @@
|
|||
@click="handleSubmitScrap(data)"
|
||||
>提交报废</el-button
|
||||
>
|
||||
<!-- <el-button
|
||||
<el-button
|
||||
type="text"
|
||||
v-if="data.taskStatus == 61"
|
||||
@click="handleReject(data)"
|
||||
style="color: #e6a23c"
|
||||
icon="el-icon-document-delete"
|
||||
>驳回退料</el-button
|
||||
> -->
|
||||
>{{
|
||||
data.commit == 0 ? '驳回退料' : '退料详情'
|
||||
}}</el-button
|
||||
>
|
||||
<el-button
|
||||
type="text"
|
||||
@click="handleAuditing(data)"
|
||||
|
|
@ -151,7 +153,11 @@
|
|||
|
||||
<template v-if="temp">
|
||||
<PageHeader :pageContent="pageContent" @goBack="goBack" />
|
||||
<AuditingReturn :sendTbParams="sendParamsAuditing" />
|
||||
<AuditingReturn
|
||||
:sendTbParams="sendParamsAuditing"
|
||||
:isDetails="isDetails"
|
||||
@closeReturnPage="closeReturnPage"
|
||||
/>
|
||||
</template>
|
||||
</div>
|
||||
</template>
|
||||
|
|
@ -227,6 +233,7 @@ export default {
|
|||
this.dialogConfig.outerWidth = '70%'
|
||||
this.dialogConfig.outerVisible = true
|
||||
},
|
||||
// 提交审批
|
||||
handleSubmitScrap(row) {
|
||||
this.submitScrapParams.taskIdList = []
|
||||
this.submitScrapParams.taskIdList.push(row.taskId)
|
||||
|
|
@ -234,15 +241,22 @@ export default {
|
|||
this.dialogConfig.outerWidth = '50%'
|
||||
this.dialogConfig.outerVisible = true
|
||||
},
|
||||
// 审批详情
|
||||
handleAuditing(row) {
|
||||
this.auditingList = row.scrapAuditorSetList
|
||||
this.dialogConfig.outerTitle = '审批详情'
|
||||
this.dialogConfig.outerWidth = '50%'
|
||||
this.dialogConfig.outerVisible = true
|
||||
},
|
||||
// 驳回 退料
|
||||
handleReject(row) {
|
||||
console.log(row, '驳回退料----')
|
||||
if (row.commit == 0) {
|
||||
this.pageContent = '驳回退料'
|
||||
} else {
|
||||
this.pageContent = '退料详情'
|
||||
}
|
||||
this.sendParamsAuditing.taskId = row.taskId
|
||||
this.isDetails = row.commit
|
||||
this.parentId = row.parentId
|
||||
this.temp = !this.temp
|
||||
},
|
||||
|
|
@ -316,6 +330,10 @@ export default {
|
|||
goBack() {
|
||||
this.temp = !this.temp
|
||||
},
|
||||
closeReturnPage() {
|
||||
this.temp = !this.temp
|
||||
this.$refs.listingTbRef.getList()
|
||||
},
|
||||
},
|
||||
}
|
||||
</script>
|
||||
|
|
|
|||
|
|
@ -131,16 +131,27 @@
|
|||
</el-table>
|
||||
</template>
|
||||
<template v-else>
|
||||
<el-row type="flex" justify="space-around">
|
||||
<el-col :span="4">请上传处置文件</el-col>
|
||||
<el-col>
|
||||
<el-row type="flex">
|
||||
<el-col :span="3">请上传处置文件</el-col>
|
||||
<!-- <el-col>
|
||||
<ImageUpload
|
||||
:limit="3"
|
||||
:fileSize="5"
|
||||
:fileType="fileType"
|
||||
@input="getFileList"
|
||||
/>
|
||||
</el-col>
|
||||
</el-col> -->
|
||||
<AnnexUpload
|
||||
:fileType="fileType"
|
||||
:limit="5"
|
||||
:fileSize="5"
|
||||
:fileList="fileList"
|
||||
:uploadUrl="uploadUrl"
|
||||
:multiple="false"
|
||||
:uploadParams="uploadParams"
|
||||
@handleSuccess="handleSuccess"
|
||||
@handleRemove="handleRemove"
|
||||
/>
|
||||
</el-row>
|
||||
<el-row class="dialog-common-btn">
|
||||
<el-button size="mini" plain @click="handleCancelInner"
|
||||
|
|
@ -161,6 +172,7 @@
|
|||
<script>
|
||||
import TableModel from '@/components/TableModel'
|
||||
import DialogModel from '@/components/DialogModel'
|
||||
import AnnexUpload from '@/components/AnnexUpload'
|
||||
import ScrapSource from '../../component/scrapSource.vue'
|
||||
import ScrapImg from '../../component/scrapImg.vue'
|
||||
import { config, dialogConfig, getSelList } from './config.js'
|
||||
|
|
@ -173,6 +185,7 @@ export default {
|
|||
components: {
|
||||
TableModel,
|
||||
DialogModel,
|
||||
AnnexUpload,
|
||||
ScrapSource,
|
||||
ScrapImg,
|
||||
},
|
||||
|
|
@ -184,13 +197,18 @@ export default {
|
|||
getDialogListApi,
|
||||
selectionList: [], // 选中的列表数据
|
||||
rejectReason: '', // 驳回原因
|
||||
fileType: ['png', 'jpg', 'jpeg', 'pdf', 'doc', 'xls', 'docx'],
|
||||
fileType: '.png、.jpg、.jpeg、.pdf、.doc、.docs、.xls、.xlsx', // 处置上传时文件类型
|
||||
uploadFileList: [],
|
||||
sendParams: {},
|
||||
fileList: [],
|
||||
tbSelectList: [],
|
||||
dispositionParams: [], // 处置参数
|
||||
filePreviewUrl: process.env.VUE_APP_BASE_API + '/system', // 附件预览地址
|
||||
uploadUrl: process.env.VUE_APP_BASE_API + '/system/sys/file/upload', // 附件上传地址
|
||||
fileList: [], // 文件的数据源
|
||||
// 附件上传时携带的参数
|
||||
uploadParams: {
|
||||
fileType: 'ma',
|
||||
},
|
||||
getSelList,
|
||||
}
|
||||
},
|
||||
|
|
@ -205,6 +223,7 @@ export default {
|
|||
this.dialogConfig.outerWidth = '70%'
|
||||
this.dialogConfig.outerVisible = true
|
||||
},
|
||||
// 单个处置
|
||||
handleDisposition(row) {
|
||||
this.dispositionParams = []
|
||||
this.dispositionParams.push({
|
||||
|
|
@ -250,15 +269,15 @@ export default {
|
|||
},
|
||||
/* 确定 */
|
||||
async handleSubmitInner() {
|
||||
if (this.uploadFileList.length < 1) {
|
||||
this.$message.error('请先上传文件')
|
||||
if (this.fileList.length < 1) {
|
||||
this.$message.error('请先上传文件！')
|
||||
return
|
||||
}
|
||||
let fileUrl = ''
|
||||
let fileName = ''
|
||||
this.uploadFileList.map((e) => {
|
||||
fileUrl += e.fileUrl + ','
|
||||
fileName += e.fileName + ','
|
||||
this.fileList.map((e) => {
|
||||
fileUrl += e.url + ','
|
||||
fileName += e.name + ','
|
||||
})
|
||||
this.dispositionParams.map((e) => {
|
||||
e.fileUrl = fileUrl.substring(fileUrl.length - 1, ',')
|
||||
|
|
@ -271,16 +290,26 @@ export default {
|
|||
this.$refs.tbRef.getList()
|
||||
}
|
||||
},
|
||||
/* 获取上传后的图片信息 */
|
||||
getFileList(val) {
|
||||
this.uploadFileList = val
|
||||
},
|
||||
|
||||
// 文件上传成功
|
||||
handleSuccess(file) {
|
||||
const { fileName, fileUrl, id } = file
|
||||
const fileObj = {
|
||||
name: fileName,
|
||||
url: fileUrl,
|
||||
id,
|
||||
}
|
||||
this.fileList.push(fileObj)
|
||||
},
|
||||
// 文件移除
|
||||
handleRemove(file) {
|
||||
this.fileList = this.fileList.filter((e) => e.id !== file.id)
|
||||
},
|
||||
/* 批量处置 */
|
||||
handleBatchDisposition() {
|
||||
this.dispositionParams = []
|
||||
if (this.tbSelectList.length < 1) {
|
||||
this.$message.error('请选择需处置的数据')
|
||||
this.$message.error('请选择需处置的数据！')
|
||||
return
|
||||
}
|
||||
this.tbSelectList.map((e) => {
|
||||
|
|
|
|||
|
|
@ -1172,8 +1172,6 @@ export default {
|
|||
(e) => e.uid !== file.uid,
|
||||
)
|
||||
}
|
||||
|
||||
console.log(this.aform, '移除后--')
|
||||
},
|
||||
// 文件上传成功
|
||||
handleSuccess(res) {
|
||||
|
|
|
|||
Loading…
Reference in New Issue