218 lines
7.5 KiB
Vue
218 lines
7.5 KiB
Vue
|
<template>
|
||
|
|
<div class="app-container">
|
||
|
|
<!-- 报废审核 -->
|
||
|
|
<TableModel
|
||
|
|
:config="config"
|
||
|
|
:sendApi="getForecastWasteListApi"
|
||
|
|
:handleWidth="`160px`"
|
||
|
|
>
|
||
|
|
<template slot="export">
|
||
|
|
<el-row :gutter="10" class="mb8">
|
||
|
|
<el-button
|
||
|
|
type="success"
|
||
|
|
plain
|
||
|
|
icon="el-icon-download"
|
||
|
|
size="mini"
|
||
|
|
>导出数据</el-button
|
||
|
|
>
|
||
|
|
</el-row>
|
||
|
|
</template>
|
||
|
|
|
||
|
|
<!-- 列表操作栏 -->
|
||
|
|
<template slot="handle" slot-scope="data">
|
||
|
|
<el-button
|
||
|
|
size="mini"
|
||
|
|
type="text"
|
||
|
|
v-for="btn in config.handleBtn"
|
||
|
|
:key="btn.id"
|
||
|
|
@click="handleBtn(data, btn.id)"
|
||
|
|
>
|
||
|
|
{{ btn.btn_title }}
|
||
|
|
</el-button>
|
||
|
|
</template>
|
||
|
|
</TableModel>
|
||
|
|
|
||
|
|
<!-- 弹框 -->
|
||
|
|
<DialogModel
|
||
|
|
:dialogConfig="dialogConfig"
|
||
|
|
@closeDialogOuter="closeDialogOuter"
|
||
|
|
@closeDialogInner="closeDialogInner"
|
||
|
|
>
|
||
|
|
<!-- 弹框外层内容 查看 审核 审核详情-->
|
||
|
|
<template slot="outerContent">
|
||
|
|
<template v-if="!detailsConfig.detailsShow">
|
||
|
|
<TableModel
|
||
|
|
:config="dialogConfig"
|
||
|
|
ref="dialogTbRef"
|
||
|
|
:sendApi="getForecastWasteListApi"
|
||
|
|
@getTableSelectionChange="getDialogTbChange"
|
||
|
|
></TableModel>
|
||
|
|
<el-row
|
||
|
|
v-if="dialogConfig.outerTitle === '审核'"
|
||
|
|
class="dialog-common-btn"
|
||
|
|
>
|
||
|
|
<el-button
|
||
|
|
size="mini"
|
||
|
|
type="success"
|
||
|
|
@click="handlePass"
|
||
|
|
>通过</el-button
|
||
|
|
>
|
||
|
|
<el-button
|
||
|
|
size="mini"
|
||
|
|
type="danger"
|
||
|
|
@click="handleReject"
|
||
|
|
>驳回</el-button
|
||
|
|
>
|
||
|
|
</el-row>
|
||
|
|
</template>
|
||
|
|
|
||
|
|
<!-- 审核详情 -->
|
||
|
|
<template v-else>
|
||
|
|
<TableModel
|
||
|
|
:config="detailsConfig"
|
||
|
|
:sendApi="getForecastWasteListApi"
|
||
|
|
/>
|
||
|
|
</template>
|
||
|
|
</template>
|
||
|
|
|
||
|
|
<!-- 弹框内层内容 -->
|
||
|
|
<template slot="innerContent">
|
||
|
|
<el-row>
|
||
|
|
<el-col :span="4">请输入驳回原因</el-col>
|
||
|
|
<el-col :span="20">
|
||
|
|
<el-input
|
||
|
|
v-model="rejectReason"
|
||
|
|
type="textarea"
|
||
|
|
:rows="6"
|
||
|
|
ref="rejectReasonRef"
|
||
|
|
/>
|
||
|
|
</el-col>
|
||
|
|
</el-row>
|
||
|
|
|
||
|
|
<el-row class="dialog-common-btn">
|
||
|
|
<el-button size="mini" plain @click="handleCancelInner"
|
||
|
|
>取 消</el-button
|
||
|
|
>
|
||
|
|
<el-button
|
||
|
|
size="mini"
|
||
|
|
type="warning"
|
||
|
|
@click="handleSubmitInner"
|
||
|
|
>保 存</el-button
|
||
|
|
>
|
||
|
|
</el-row>
|
||
|
|
</template>
|
||
|
|
</DialogModel>
|
||
|
|
</div>
|
||
|
|
</template>
|
||
|
|
|
||
|
|
<script>
|
||
|
|
import { getForecastWasteListApi } from '@/api/scrap/forecastWaste.js'
|
||
|
|
import TableModel from '@/components/TableModel'
|
||
|
|
import DialogModel from '@/components/DialogModel'
|
||
|
|
import { config, dialogConfig, detailsConfig } from './config.js'
|
||
|
|
export default {
|
||
|
|
components: {
|
||
|
|
TableModel,
|
||
|
|
DialogModel,
|
||
|
|
},
|
||
|
|
data() {
|
||
|
|
return {
|
||
|
|
config,
|
||
|
|
dialogConfig,
|
||
|
|
detailsConfig,
|
||
|
|
getForecastWasteListApi,
|
||
|
|
/* 选中的列表数据 */
|
||
|
|
selectionList: [],
|
||
|
|
/* 驳回原因 */
|
||
|
|
rejectReason: '',
|
||
|
|
}
|
||
|
|
},
|
||
|
|
methods: {
|
||
|
|
/* 按钮操作 */
|
||
|
|
handleBtn(row, id) {
|
||
|
|
console.log(row, id, '操作按钮')
|
||
|
|
switch (id) {
|
||
|
|
case 1:
|
||
|
|
this.dialogConfig.outerTitle = '查看'
|
||
|
|
this.dialogConfig.outerWidth = '70%'
|
||
|
|
this.dialogConfig.isSelShow =
|
||
|
|
this.detailsConfig.detailsShow = false
|
||
|
|
break
|
||
|
|
case 2:
|
||
|
|
this.dialogConfig.outerTitle = '审核'
|
||
|
|
this.dialogConfig.outerWidth = '70%'
|
||
|
|
this.dialogConfig.isSelShow = true
|
||
|
|
this.detailsConfig.detailsShow = false
|
||
|
|
break
|
||
|
|
case 3:
|
||
|
|
this.dialogConfig.outerTitle = '审核详情'
|
||
|
|
this.dialogConfig.outerWidth = '40%'
|
||
|
|
this.detailsConfig.detailsShow = true
|
||
|
|
break
|
||
|
|
}
|
||
|
|
|
||
|
|
this.dialogConfig.outerVisible = true
|
||
|
|
},
|
||
|
|
/* 关闭外层弹框 */
|
||
|
|
closeDialogOuter(val) {
|
||
|
|
this.dialogConfig.outerVisible = val
|
||
|
|
},
|
||
|
|
/* 关闭内层弹框 */
|
||
|
|
closeDialogInner(val) {
|
||
|
|
this.dialogConfig.innerVisible = val
|
||
|
|
},
|
||
|
|
/* 获取弹框内表格选中数据 */
|
||
|
|
getDialogTbChange(list) {
|
||
|
|
this.selectionList = list
|
||
|
|
},
|
||
|
|
/* 审核通过 */
|
||
|
|
handlePass() {
|
||
|
|
if (this.selectionList.length < 1) {
|
||
|
|
this.$message.error('请勾选列表数据')
|
||
|
|
return
|
||
|
|
}
|
||
|
|
this.dialogConfig.outerVisible = false
|
||
|
|
},
|
||
|
|
/* 审核驳回 */
|
||
|
|
handleReject() {
|
||
|
|
if (this.selectionList.length < 1) {
|
||
|
|
this.$message.error('请勾选列表数据')
|
||
|
|
return
|
||
|
|
}
|
||
|
|
/* 先打开内测弹框 */
|
||
|
|
this.dialogConfig.innerTitle = '驳回原因'
|
||
|
|
this.dialogConfig.innerVisible = true
|
||
|
|
},
|
||
|
|
|
||
|
|
/* 驳回原因页面取消 */
|
||
|
|
handleCancelInner() {
|
||
|
|
this.dialogConfig.innerVisible = false
|
||
|
|
},
|
||
|
|
/* 驳回原因页面保存 */
|
||
|
|
handleSubmitInner() {
|
||
|
|
if (!this.rejectReason) {
|
||
|
|
this.$message.error('请输入驳回原因')
|
||
|
|
return
|
||
|
|
}
|
||
|
|
this.dialogConfig.innerVisible = false
|
||
|
|
/* 当驳回成功 重新查询列表回显数据 */
|
||
|
|
this.$nextTick(() => {
|
||
|
|
this.$refs.dialogTbRef.getList()
|
||
|
|
})
|
||
|
|
},
|
||
|
|
},
|
||
|
|
watch: {
|
||
|
|
dialogConfig: {
|
||
|
|
handler(newVal) {
|
||
|
|
/* 监听外层弹框关闭 清空勾选的数据 */
|
||
|
|
console.log(newVal.outerVisible, '**')
|
||
|
|
if (!newVal.outerVisible) {
|
||
|
|
this.selectionList = []
|
||
|
|
}
|
||
|
|
},
|
||
|
|
deep: true,
|
||
|
|
},
|
||
|
|
},
|
||
|
|
}
|
||
|
|
</script>
|