377 lines
13 KiB
Vue
377 lines
13 KiB
Vue
<template>
|
|
<div class="app-container">
|
|
<!-- 报废审核 -->
|
|
<TableModel
|
|
ref="tbRef"
|
|
:config="config"
|
|
:sendApi="getDispositionListApi"
|
|
@getTableSelectionChange="getSelectionList"
|
|
:selectable="
|
|
(row) => {
|
|
return row.disposition == 0
|
|
}
|
|
"
|
|
>
|
|
<template slot="export" slot-scope="{ pageParams }">
|
|
<el-row class="mb8">
|
|
<el-button
|
|
plain
|
|
size="mini"
|
|
@click="handleBatchDisposition()"
|
|
v-hasPermi="['scrap:batch:disposition']"
|
|
>批量处置</el-button
|
|
>
|
|
<el-button
|
|
plain
|
|
size="mini"
|
|
type="success"
|
|
icon="el-icon-download"
|
|
@click="handelExportData(pageParams)"
|
|
>导出数据</el-button
|
|
>
|
|
</el-row>
|
|
</template>
|
|
|
|
<!-- 报废来源 -->
|
|
<template slot-scope="{ data }" slot="source">
|
|
<ScrapSource :data="data" />
|
|
</template>
|
|
|
|
<!-- 状态 -->
|
|
<template slot-scope="{ data }" slot="type">
|
|
<el-tag size="mini" v-if="data.disposition == 0">未处置</el-tag>
|
|
<el-tag size="mini" type="success" v-if="data.disposition == 1"
|
|
>已处置</el-tag
|
|
>
|
|
</template>
|
|
|
|
<!-- 附件信息 -->
|
|
<template slot-scope="{ data }" slot="file">
|
|
<el-button
|
|
size="mini"
|
|
type="text"
|
|
@click="handlePreviewFile(data)"
|
|
style="color: #67c23a"
|
|
v-if="data.dispositionFileUrl"
|
|
>
|
|
查看附件
|
|
</el-button>
|
|
|
|
<template v-else>-</template>
|
|
</template>
|
|
|
|
<!-- 列表操作栏 -->
|
|
<template slot="handle" slot-scope="{ data }">
|
|
<el-button
|
|
type="text"
|
|
icon="el-icon-zoom-in"
|
|
@click="handlePreview(data)"
|
|
>
|
|
查看
|
|
</el-button>
|
|
<el-button
|
|
type="text"
|
|
style="color: #e6a23c"
|
|
icon="el-icon-edit-outline"
|
|
v-if="data.disposition == 0"
|
|
@click="handleDisposition(data)"
|
|
v-hasPermi="['scrap:disposition']"
|
|
>
|
|
处置
|
|
</el-button>
|
|
</template>
|
|
</TableModel>
|
|
|
|
<!-- 弹框 -->
|
|
<DialogModel
|
|
:dialogConfig="dialogConfig"
|
|
@closeDialogOuter="closeDialogOuter"
|
|
>
|
|
<!-- 弹框内容 查看 处置-->
|
|
<template slot="outerContent">
|
|
<!-- 查看内容 -->
|
|
<template v-if="dialogConfig.outerTitle === '查看'">
|
|
<TableModel
|
|
:sendParams="sendParams"
|
|
:sendApi="getDialogListApi"
|
|
:config="dialogConfig"
|
|
>
|
|
<!-- 损坏原因 -->
|
|
<template slot-scope="{ data }" slot="t_damage">
|
|
<!-- {{ data.scrapType == 1 ? '人为' : '自然' }} -->
|
|
<template v-if="data.scrapType == 1">人为</template>
|
|
<template v-if="data.scrapType == 0">自然</template>
|
|
</template>
|
|
<!-- 报废图片 -->
|
|
<template slot-scope="{ data }" slot="t_img">
|
|
<ScrapImg
|
|
v-if="data.fileUrl"
|
|
:scrapImgUrl="data.fileUrl"
|
|
/>
|
|
</template>
|
|
</TableModel>
|
|
</template>
|
|
|
|
<template v-else-if="dialogConfig.outerTitle === '附件信息'">
|
|
<el-table :data="fileList" border>
|
|
<el-table-column
|
|
label="文件名称"
|
|
align="center"
|
|
prop="fileName"
|
|
/>
|
|
<el-table-column label="操作" align="center">
|
|
<template slot-scope="{ row }">
|
|
<a
|
|
target="_blank"
|
|
:download="row.fileName"
|
|
v-if="fileTypeJudge(row.fileName)"
|
|
:href="filePreviewUrl + row.fileUrl"
|
|
>查看</a
|
|
>
|
|
<a
|
|
v-else
|
|
target="_blank"
|
|
:href="filePreviewUrl + row.fileUrl"
|
|
>查看</a
|
|
>
|
|
</template>
|
|
</el-table-column>
|
|
</el-table>
|
|
</template>
|
|
<template v-else>
|
|
<el-row type="flex">
|
|
<el-col :span="3">请上传处置文件</el-col>
|
|
<!-- <el-col>
|
|
<ImageUpload
|
|
:limit="3"
|
|
:fileSize="5"
|
|
:fileType="fileType"
|
|
@input="getFileList"
|
|
/>
|
|
</el-col> -->
|
|
<AnnexUpload
|
|
:limit="5"
|
|
:fileSize="5"
|
|
:multiple="false"
|
|
:fileList="fileList"
|
|
:fileType="fileType"
|
|
:uploadUrl="uploadUrl"
|
|
:uploadParams="uploadParams"
|
|
@handleRemove="handleRemove"
|
|
@handleSuccess="handleSuccess"
|
|
/>
|
|
</el-row>
|
|
<el-row class="dialog-common-btn">
|
|
<el-button size="mini" plain @click="handleCancelInner"
|
|
>取 消</el-button
|
|
>
|
|
<el-button
|
|
size="mini"
|
|
type="primary"
|
|
@click="handleSubmitInner"
|
|
>确 定</el-button
|
|
>
|
|
</el-row>
|
|
</template>
|
|
</template>
|
|
</DialogModel>
|
|
</div>
|
|
</template>
|
|
<script>
|
|
import TableModel from '@/components/TableModel'
|
|
import DialogModel from '@/components/DialogModel'
|
|
import AnnexUpload from '@/components/AnnexUpload'
|
|
import ScrapImg from '../../component/scrapImg.vue'
|
|
import ScrapSource from '../../component/scrapSource.vue'
|
|
import { config, dialogConfig, getSelList } from './config.js'
|
|
import {
|
|
getDialogListApi,
|
|
submitDispositionApi,
|
|
getDispositionListApi,
|
|
} from '@/api/scrap/forecastWaste.js'
|
|
export default {
|
|
components: {
|
|
TableModel,
|
|
DialogModel,
|
|
AnnexUpload,
|
|
ScrapSource,
|
|
ScrapImg,
|
|
},
|
|
data() {
|
|
return {
|
|
config,
|
|
dialogConfig,
|
|
getDispositionListApi,
|
|
getDialogListApi,
|
|
selectionList: [], // 选中的列表数据
|
|
rejectReason: '', // 驳回原因
|
|
fileType: '.png、.jpg、.jpeg、.pdf、.doc、.docs、.xls、.xlsx', // 处置上传时文件类型
|
|
uploadFileList: [],
|
|
sendParams: {},
|
|
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,
|
|
}
|
|
},
|
|
created() {
|
|
this.getSelList()
|
|
},
|
|
methods: {
|
|
/* 按钮操作 */
|
|
handlePreview(row) {
|
|
this.dispositionParams.taskId = this.sendParams.taskId = row.taskId
|
|
this.dialogConfig.outerTitle = '查看'
|
|
this.dialogConfig.outerWidth = '70%'
|
|
this.dialogConfig.outerVisible = true
|
|
},
|
|
// 单个处置
|
|
handleDisposition(row) {
|
|
this.dispositionParams = []
|
|
this.dispositionParams.push({
|
|
taskId: row.taskId,
|
|
fileUrl: '', // 附件url
|
|
fileName: '', // 附件名称
|
|
disposition: 1, // 处置状态 0、未处置 1、已处置
|
|
})
|
|
this.dialogConfig.outerTitle = '处置'
|
|
this.dialogConfig.outerWidth = '60%'
|
|
this.dialogConfig.outerVisible = true
|
|
},
|
|
|
|
/* 查看附件 */
|
|
handlePreviewFile(data) {
|
|
this.fileList = []
|
|
data.dispositionFileName.split(',').map((e) => {
|
|
let fileObj = {
|
|
fileName: e,
|
|
fileUrl: '',
|
|
}
|
|
|
|
this.fileList.push(fileObj)
|
|
})
|
|
|
|
data.dispositionFileUrl.split(',').map((e, index) => {
|
|
this.fileList[index].fileUrl = e
|
|
})
|
|
this.fileList.splice(this.fileList.length - 1, 1)
|
|
this.dialogConfig.outerTitle = '附件信息'
|
|
this.dialogConfig.outerWidth = '40%'
|
|
this.dialogConfig.outerVisible = true
|
|
},
|
|
|
|
/* 关闭外层弹框 */
|
|
closeDialogOuter(val) {
|
|
this.dialogConfig.outerVisible = val
|
|
},
|
|
|
|
/* 取消 */
|
|
handleCancelInner() {
|
|
this.dialogConfig.outerVisible = false
|
|
},
|
|
/* 确定 */
|
|
async handleSubmitInner() {
|
|
if (this.fileList.length < 1) {
|
|
this.$message.closeAll()
|
|
this.$message.error('请先上传文件！')
|
|
return
|
|
}
|
|
let fileUrl = ''
|
|
let fileName = ''
|
|
this.fileList.map((e) => {
|
|
fileUrl += e.url + ','
|
|
fileName += e.name + ','
|
|
})
|
|
this.dispositionParams.map((e) => {
|
|
e.fileUrl = fileUrl.substring(fileUrl.length - 1, ',')
|
|
e.fileName = fileName.substring(fileUrl.length - 1, ',')
|
|
})
|
|
const res = await submitDispositionApi(this.dispositionParams)
|
|
if (res.code === 200) {
|
|
this.$message.success('处置成功！')
|
|
this.dialogConfig.outerVisible = false
|
|
this.$refs.tbRef.getList()
|
|
}
|
|
},
|
|
|
|
/* 文件上传成功 */
|
|
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('请选择需处置的数据！')
|
|
return
|
|
}
|
|
this.tbSelectList.map((e) => {
|
|
let prams = {
|
|
taskId: e.taskId,
|
|
fileUrl: '', // 附件url
|
|
fileName: '', // 附件名称
|
|
disposition: 1, // 处置状 0、未处置 1、已处置
|
|
}
|
|
|
|
this.dispositionParams.push(prams)
|
|
})
|
|
|
|
this.dialogConfig.outerTitle = '处置'
|
|
this.dialogConfig.outerWidth = '60%'
|
|
this.dialogConfig.outerVisible = true
|
|
},
|
|
|
|
/* 获取列表下拉勾选数据 */
|
|
getSelectionList(selList) {
|
|
console.log(selList, '选择的数据')
|
|
this.tbSelectList = selList
|
|
},
|
|
/* 导出数据 */
|
|
handelExportData(data) {
|
|
console.log(this.tableSelList, ' this.tableSelList')
|
|
this.download(
|
|
'material/scrap/exportObtainDisposalList',
|
|
{
|
|
...data,
|
|
},
|
|
`报废处置列表_${new Date().getTime()}.xlsx`,
|
|
)
|
|
console.log('数据导出', data)
|
|
},
|
|
fileTypeJudge(url) {
|
|
const file = url.split('.')[1]
|
|
const docList = ['doc', 'docx', 'xls', 'xlsx']
|
|
return docList.some((e) => e === file)
|
|
},
|
|
},
|
|
|
|
watch: {
|
|
dialogConfig: {
|
|
handler(newVal) {
|
|
if (!newVal.outerVisible) {
|
|
// 监听弹框关闭 清空文件数据源 解决关闭弹框再次打开时显示上次上传成功的文件
|
|
this.fileList = []
|
|
}
|
|
},
|
|
deep: true,
|
|
},
|
|
},
|
|
}
|
|
</script>
|