<template>
    <div class="app-container">
        <!-- 报废审核 -->
        <TableModel :config="config" :sendApi="getScrapListApi" ref="tbRef">
            <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-scope="{ data }" slot="source">
                <template v-if="data.scrapSource === 1">退料</template>
                <template v-if="data.scrapSource === 2">维修</template>
                <template v-if="data.scrapSource === 3">盘点</template>
            </template>

            <!-- 状态 -->
            <template slot-scope="{ data }" slot="type">
                <el-tag size="mini" v-if="data.taskStatus == 124"
                    >待提交</el-tag
                >
                <el-tag size="mini" type="warning" v-if="data.taskStatus == 58"
                    >审核中</el-tag
                >
                <el-tag size="mini" type="danger" v-if="data.taskStatus == 61"
                    >已驳回</el-tag
                >
                <el-tag size="mini" type="success" v-if="data.taskStatus == 59"
                    >已通过</el-tag
                >
            </template>

            <!-- 列表操作栏 -->
            <template slot="handle" slot-scope="{ data }">
                <el-button size="mini" type="text" @click="handlePreview(data)">
                    查看
                </el-button>
                <el-button
                    size="mini"
                    type="text"
                    v-if="auditingIsShow(data)"
                    v-hasPermi="['scrap:auditing']"
                    @click="handleAuditing(data)"
                >
                    审核
                </el-button>
                <el-button
                    size="mini"
                    type="text"
                    @click="handleAuditingDetails(data)"
                >
                    审批详情
                </el-button>
            </template>
        </TableModel>

        <!-- 弹框 -->
        <DialogModel
            :dialogConfig="dialogConfig"
            @closeDialogOuter="closeDialogOuter"
            @closeDialogInner="closeDialogInner"
        >
            <!-- 弹框外层内容  查看 审核 审核详情-->
            <template slot="outerContent">
                <!-- 查看内容 -->
                <template v-if="dialogConfig.outerTitle === '查看'">
                    <TableModel
                        :sendParams="sendParams"
                        :sendApi="getDialogListApi"
                        :config="dialogConfig"
                    >
                        <template slot="imgPreview" slot-scope="{ data }">
                            <ImagePreview
                                :src="`https://fuss10.elemecdn.com/e/5d/4a731a90594a4af544c0c25941171jpeg.jpeg`"
                                :width="`60px`"
                                :height="`60px`"
                            />
                        </template> </TableModel
                ></template>
                <template v-if="dialogConfig.outerTitle === '审核'">
                    <TableModel
                        :config="dialogConfig"
                        :sendParams="sendParams"
                        :sendApi="getDialogListApi"
                        ref="dialogTbRef"
                        @getTableSelectionChange="getDialogTbChange"
                    ></TableModel>
                    <el-row 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-if="dialogConfig.outerTitle === '审批详情'">
                    <AuditingDetails :auditingList="auditingList" />
                </template>
            </template>

            <!-- 弹框内层内容 -->
            <template slot="innerContent">
                <el-row>
                    <el-col :span="4">请输入驳回原因</el-col>
                    <el-col :span="20">
                        <el-input
                            v-model="rejectReason"
                            maxlength="100"
                            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 TableModel from '@/components/TableModel'
    import DialogModel from '@/components/DialogModel'
    import AuditingDetails from '../../component/auditingDetails.vue'
    import { config, dialogConfig } from './config.js'
    import {
        getScrapListApi,
        getDialogListApi,
        auditingScrapApi,
    } from '@/api/scrap/forecastWaste.js'
    export default {
        components: {
            TableModel,
            DialogModel,
            AuditingDetails,
        },
        data() {
            return {
                config,
                dialogConfig,
                getScrapListApi,
                getDialogListApi,
                /* 选中的列表数据 */
                selectionList: [],
                /* 驳回原因 */
                rejectReason: '',
                sendParams: {}, // 列表查看时参数
                deptId: sessionStorage.getItem('deptId'),

                /* 审核参数 */
                auditingParams: {
                    deptId: parseInt(sessionStorage.getItem('deptId')),
                    userId: sessionStorage.getItem('userId'),
                    taskId: '',
                    status: '',
                    reasonRejection: '',
                },

                /* 审批详情的列表 */
                auditingList: [],
            }
        },
        created() {},
        methods: {
            /* 按钮操作 */
            handlePreview(row) {
                this.sendParams.taskId = row.taskId
                this.dialogConfig.outerTitle = '查看'
                this.dialogConfig.outerWidth = '70%'
                this.dialogConfig.outerVisible = true
            },
            handleAuditing(row) {
                this.sendParams.taskId = this.auditingParams.taskId = row.taskId
                this.dialogConfig.outerTitle = '审核'
                this.dialogConfig.outerWidth = '70%'
                this.dialogConfig.outerVisible = true
            },
            handleAuditingDetails(row) {
                this.auditingList = row.scrapAuditorSetList
                this.dialogConfig.outerTitle = '审批详情'
                this.dialogConfig.outerWidth = '40%'
                this.dialogConfig.outerVisible = true
            },

            /* 关闭外层弹框 */
            closeDialogOuter(val) {
                this.dialogConfig.outerVisible = val
            },
            /* 关闭内层弹框 */
            closeDialogInner(val) {
                this.dialogConfig.innerVisible = val
            },
            /* 获取弹框内表格选中数据 */
            getDialogTbChange(list) {
                this.selectionList = list
            },
            /* 审核通过 */
            async handlePass() {
                this.auditingParams.status = '1'
                this.auditingParams.reasonRejection = '同意'
                const res = await auditingScrapApi(this.auditingParams)
                if (res.code == 200) {
                    this.$message.success('审核通过')
                    this.dialogConfig.outerVisible = false
                    /* 刷新列表 */
                    this.$refs.tbRef.getList()
                }
            },
            /* 审核驳回 */
            handleReject() {
                /* 先打开内测弹框 */
                this.dialogConfig.innerTitle = '驳回原因'
                this.dialogConfig.innerVisible = true
            },

            /* 驳回原因页面取消 */
            handleCancelInner() {
                this.rejectReason = ''
                this.dialogConfig.innerVisible = false
            },
            /* 驳回原因页面保存 */
            async handleSubmitInner() {
                if (!this.rejectReason) {
                    this.$message.error('请输入驳回原因')
                    return
                }

                this.auditingParams.status = '2'
                this.auditingParams.reasonRejection = this.rejectReason
                const res = await auditingScrapApi(this.auditingParams)
                if (res.code == 200) {
                    this.$message.success('已驳回')
                    this.dialogConfig.innerVisible = false
                    this.dialogConfig.outerVisible = false
                    this.rejectReason = ''
                    /* 刷新列表 */
                    this.$refs.tbRef.getList()
                }
            },
            /* 审核按钮的显示条件 */
            auditingIsShow(row) {
                let temp = row.scrapAuditorSetList.some((e) => {
                    return e.deptId == this.deptId && e.status == '0'
                })
                return temp
            },
        },
    }
</script>
