<template>
    <div class="app-container">
        <!-- 预报废审核 -->
        <TableModel :config="config" :sendApi="getForecastWasteListApi">
            <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>
            <!-- 单号  1、退料单号 2、维修单号 3、盘点单号 -->
            <template slot-scope="{ data }" slot="code">
                <template v-if="data.scrapSource === 1">{{
                    data.repairCode
                }}</template>
                <template v-if="data.scrapSource === 2">{{
                    data.scrapNum
                }}</template>
            </template>
            <!--审核状态 -->
            <template slot-scope="{ data }" slot="type">
                <el-tag v-if="data.taskStatus === 120" size="mini"
                    >待审核</el-tag
                >
                <el-tag
                    type="warning"
                    v-if="data.taskStatus === 121"
                    size="mini"
                    >审核中</el-tag
                >
                <el-tag type="danger" v-if="data.taskStatus === 123" size="mini"
                    >已驳回</el-tag
                >
                <el-tag
                    type="success"
                    v-if="data.taskStatus === 122"
                    size="mini"
                    >已通过</el-tag
                >
            </template>
            <!-- 列表操作栏 -->
            <template slot="handle" slot-scope="{ data }">
                <el-button type="text" size="mini" @click="handlePreview(data)"
                    >查看</el-button
                >
                <el-button
                    v-if="data.taskStatus === 121 || data.taskStatus === 120"
                    type="text"
                    size="mini"
                    @click="handleAuditing(data)"
                    >审核</el-button
                >
            </template>
        </TableModel>

        <!-- 弹框内容 -->
        <DialogModel
            :dialogConfig="dialogConfig"
            @closeDialogOuter="closeDialogOuter"
            @closeDialogInner="closeDialogInner"
        >
            <template slot="outerContent">
                <TableModel
                    :config="dialogConfig"
                    :sendParams="sendParams"
                    :sendApi="getDialogListApi"
                    :selectable="
                        (row) => {
                            return row.status == 0
                        }
                    "
                    ref="dialogTbRef"
                    @getTableSelectionChange="getDialogTbSelList"
                >
                    <!--审核状态 -->
                    <template slot-scope="{ data }" slot="t_type">
                        <el-tag v-if="data.status == 0" size="mini"
                            >待审核</el-tag
                        >
                        <el-tag
                            type="success"
                            v-if="data.status == 1"
                            size="mini"
                            >通过</el-tag
                        >
                        <el-tag
                            type="warning"
                            v-if="data.status == 2"
                            size="mini"
                            >驳回</el-tag
                        >
                    </template>
                </TableModel>
                <el-row
                    class="dialog-common-btn"
                    v-if="dialogConfig.outerTitle == '审核'"
                >
                    <el-button size="mini" type="primary" @click="auditingPass"
                        >通 过</el-button
                    >
                    <el-button
                        size="mini"
                        type="warning"
                        @click="auditingReject"
                        >驳 回</el-button
                    >
                </el-row>
            </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 TableModel from '@/components/TableModel'
    import DialogModel from '@/components/DialogModel'
    import { config, dialogConfig, getSelList } from './config'
    import {
        getForecastWasteListApi,
        getDialogListApi,
        auditingScrapApi,
    } from '@/api/scrap/forecastWaste.js'
    export default {
        name: 'Inventory',
        components: {
            TableModel,
            DialogModel,
        },
        data() {
            return {
                config,
                dialogConfig,
                getDialogListApi,
                getForecastWasteListApi,
                getSelList,
                /* 驳回原因 */
                rejectReason: '',
                /* 选中的审核数据 */
                selAuditingList: [],
                /* 请求参数 */
                sendParams: {},
                /* 当前登录的用户id */
                userId: sessionStorage.getItem('userId'),
                /* 审核参数 */
                auditingParams: {
                    taskId: '',
                    scrapDetailList: [],
                },
            }
        },
        created() {
            this.getSelList()
        },
        methods: {
            /* 查看 */
            async handlePreview(row) {
                this.sendParams.taskId = this.auditingParams.taskId = row.taskId
                this.dialogConfig.outerTitle = '查看'
                this.dialogConfig.isSelShow = false
                this.dialogConfig.outerVisible = true
            },
            /* 审核 */
            handleAuditing(row) {
                this.sendParams.taskId = this.auditingParams.taskId = row.taskId
                this.dialogConfig.outerTitle = '审核'
                this.dialogConfig.isSelShow = true
                this.dialogConfig.outerVisible = true
            },
            /* 外层弹框关闭 */
            closeDialogOuter() {
                this.dialogConfig.outerVisible = false
            },
            /* 内层弹框关闭 */
            closeDialogInner() {
                this.dialogConfig.innerVisible = false
            },
            /* 弹框内列表复选框勾选后数据 */
            getDialogTbSelList(list) {
                this.selAuditingList = list
            },
            /* 审核通过 */
            async auditingPass() {
                if (this.selAuditingList.length < 1) {
                    this.$message.error('请勾选审核设备')
                    return
                }

                this.selAuditingList.map((e) => {
                    /* 获取当前需要审核的设备数据 */
                    let deviceInfo = {
                        id: e.id, // 设备ID
                        auditBy: this.userId, // 审核人 ID
                        status: '1', //  1 通过  2 驳回
                    }

                    this.auditingParams.scrapDetailList.push(deviceInfo)
                })
                const res = await auditingScrapApi(this.auditingParams)
                if (res.code == 200) {
                    this.$message.success('审核通过！')
                    this.dialogVisible = false
                    this.dialogConfig.outerVisible = false
                }
            },
            /* 审核驳回 */
            async auditingReject() {
                if (this.selAuditingList.length < 1) {
                    this.$message.error('请勾选审核设备')
                    return
                }
                this.dialogConfig.innerTitle = '驳回原因'
                this.dialogConfig.innerVisible = true
            },
            /* 驳回原因弹框内取消按钮 */
            handleCancelInner() {
                /* 关闭内弹框 */
                this.dialogConfig.innerVisible = false
            },
            /* 驳回弹框内保存按钮 */
            async handleSubmitInner() {
                if (!this.rejectReason) {
                    this.$message.error('驳回原因不能为空！')
                    this.$refs.rejectReasonRef.focus()
                    return
                } else {
                    this.selAuditingList.map((e) => {
                        /* 获取当前需要审核的设备数据 */
                        let deviceInfo = {
                            id: e.id, // 设备ID
                            auditBy: this.userId, // 审核人 ID
                            status: '2', //  1 通过  2 驳回
                            auditRemark: this.rejectReason, // 驳回原因
                        }

                        this.auditingParams.scrapDetailList.push(deviceInfo)
                    })
                    const res = await auditingScrapApi(this.auditingParams)
                    if (res.code == 200) {
                        this.$message.success('已驳回！')
                        this.dialogConfig.innerVisible = false
                        /* 当驳回成功 重新查询列表回显数据 */
                        this.$nextTick(() => {
                            this.$refs.dialogTbRef.getList()
                        })
                    }
                }
            },
        },
        watch: {
            dialogConfig: {
                handler(newVal) {
                    /* 监听外层弹框关闭 清空勾选的数据 */
                    if (!newVal.outerVisible) {
                        this.selectionList = []
                    }
                },
                deep: true,
            },
        },
    }
</script>
