<template>
    <basic-container>
        <avue-crud :option="option" :table-loading="loading" :data="data" v-model:page="page" v-model="form" ref="crud"
            @row-update="rowUpdate" @row-save="rowSave" @row-del="rowDel" @search-change="searchChange"
            @search-reset="searchReset" @selection-change="selectionChange" @current-change="currentChange"
            @size-change="sizeChange" @refresh-change="refreshChange" @on-load="onLoad">
            <template #menu-left>
                <el-button @click="handleIssue" type="primary">
                    批量下发
                </el-button>
            </template>
            <template #menu-right="{ size }">
                <el-button type="warning" plain>临期</el-button>
                <el-button type="danger" plain>超期</el-button>
            </template>
            <template #menu="scope">
                <el-button type="text" @click="handleView(scope.row, 'view')">详情</el-button>
                <el-button type="text" @click="issueRow(scope.row, 'add')" v-show="scope.row.trStatus == 1">
                    下发
                </el-button>
                <el-button type="text" v-show="scope.row.trStatus == 3 || scope.row.trStatus == 4"
                    @click="handleWrite(scope.row, 'drug')">填报</el-button>
                <el-button type="text" v-show="scope.row.trStatus == 2"
                    @click="handleReceive(scope.row, 'check')">接收</el-button>
                <!-- <el-button type="text" v-show="scope.row.trStatus == 5"  @click="handleReport(scope.row,'check')">报告</el-button> -->
            </template>
            <template #tpId="{ row }">
                {{ row.textProject.tpProject }}
            </template>
            <template #tpCondition="{ row }">
                {{ row.textProject.tpCondition }}
            </template>
            <template #tpStandard="{ row }">
                {{ row.textProject.tpStandard }}
            </template>
            <template #craftMan="{ row }">
                {{ row.craftMan.userName }}
            </template>
            <template #mecMan="{ row }">
                {{ row.mecMan.userName }}
            </template>
            <template #expirationDays="{ row }">
                <div
                    :style="{ width: '100%', height: '49px', lineHeight: '49px', background: row.expirationDays === 0 ? '#ff0000' : row.expirationDays >= 7 ? '#fffd00' : row.expirationDays > 0 && row.expirationDays <= 3 ? '#ffad00' : '#fff' }">
                    {{ row.expirationDays }}
                </div>
            </template>
        </avue-crud>
        <el-dialog append-to-body title="任务下发" v-model="issueDialog" width="550px">
            <el-form ref="issueForm" :model="issueForm" label-width="80px" :rules="formRules">
                <el-form-item label="工艺员" prop="userId">
                    <el-select v-model="issueForm.userId">
                        <el-option v-for="item in userData" :key="item.userId" :label="item.userName"
                            :value="item.userId"></el-option>
                    </el-select>
                </el-form-item>
            </el-form>
            <template #footer>
                <span class="dialog-footer">
                    <el-button @click="issueDialog = false">取 消</el-button>
                    <el-button type="primary" @click="submit">确 定</el-button>
                </span>
            </template>
        </el-dialog>
        <el-dialog append-to-body title="试验填报" v-model="writeDialog" width="550px">
            <el-form ref="writeForm" :model="writeForm" label-width="120" :rules="writeRules">
                <el-form-item label="是否进行试验" prop="isTest">
                    <el-radio-group v-model="writeForm.isTest">
                        <el-radio :label="1">是</el-radio>
                        <el-radio :label="0">否</el-radio>
                    </el-radio-group>
                </el-form-item>
                <el-form-item label="试验时间" prop="testTime">
                    <el-date-picker v-model="writeForm.testTime" type="date" placeholder="请选择试验时间">
                    </el-date-picker>
                </el-form-item>
                <el-form-item label="试验结果" prop="testResult">
                    <el-upload class="upload-demo" action="https://jsonplaceholder.typicode.com/posts/"
                        :on-success="handleSuccess" :on-remove="handleRemove" multiple :limit="3"
                        :on-exceed="handleExceed" :file-list="fileList">
                        <div>
                            <el-button type="primary">点击上传</el-button>
                            <div slot="tip" class="el-upload__tip">支持扩展名：.rar .zip .doc .docx .pdf .jpg..</div>
                        </div>

                    </el-upload>
                </el-form-item>
            </el-form>
            <template #footer>
                <span class="dialog-footer">
                    <el-button @click="writeDialog = false">取 消</el-button>
                    <el-button type="primary" @click="writeSubmit">确 定</el-button>
                </span>
            </template>
        </el-dialog>
        <view-dialog v-if="viewDialog" :show-dialog="viewDialog" :row-id="rowId" :row-obj="rowObj"
            @closeDialog="closeDialog"></view-dialog>
    </basic-container>
</template>

<script>
import viewDialog from './components/viewDialog.vue';
export default {
    components: {
        viewDialog
    },
    data() {
        var checkFile = (rule, value, callback) => {
            console.log('form----------------', this.writeForm)
            console.log('form----------------', this.fileList)
            if (this.fileList.length == 0) {
                return callback(new Error('请上传文件'));
            } else {
                callback()
            }
        };
        return {
            data: [],
            page: {
                pageSize: 10,
                currentPage: 1,
                total: 0,
            },
            viewDialog: false,
            fileList: [],
            writeForm: {},
            writeRules: {
                isTest: [{ required: true, message: '请选择是否进行试验', trigger: 'blur' }],
                testTime: [{ required: true, message: '请选择试验时间', trigger: 'blur' }],
                testResult: [{ validator: checkFile, trigger: 'blur' }],
            },
            showDialog: false,
            rowId: '',
            rowObj: {},
            issueDialog: false,
            form: {},
            formRules: {
                userId: [{ required: true, message: '请选择检测员', trigger: 'blur' }],
            },
            userData: [
                {
                    "jobName": "软件工程师",
                    "deptName": "MES开发部",
                    "ldapName": null,
                    "userSex": 1,
                    "deptId": 1,
                    "mobile": null,
                    "userName": "测试",
                    "userId": 521,
                    "userCode": "0001"
                },
                {
                    "jobName": null,
                    "deptName": "MES开发部",
                    "ldapName": "jinna",
                    "userSex": 2,
                    "deptId": 1,
                    "mobile": null,
                    "userName": "靳娜",
                    "userId": 21,
                    "userCode": "jinna"
                },
                {
                    "jobName": null,
                    "deptName": "MES开发部",
                    "ldapName": "zd001",
                    "userSex": 1,
                    "deptId": 1,
                    "mobile": null,
                    "userName": "张迪",
                    "userId": 601,
                    "userCode": "zd001"
                }
            ],
            writeDialog: false,
            query: {},
            loading: true,
            issueForm: {},
            option: {
                tip: false,
                height: 'auto',
                calcHeight: 32,
                columnSort: true,
                // simplePage: true,
                searchShow: true,
                searchMenuSpan: 12,
                searchIcon: true,
                searchIndex: 3,
                tree: false,
                border: true,
                index: false,
                selection: true,
                viewBtn: false,
                delBtn: false,
                addBtn: false,
                editBtn: false,
                editBtnText: '修改',
                viewBtnText: '详情',
                addBtnIcon: ' ',
                viewBtnIcon: ' ',
                delBtnIcon: ' ',
                editBtnIcon: ' ',
                labelWidth: 120,
                menuWidth: 130,
                dialogWidth: 600,
                dialogClickModal: false,
                searchEnter: true,
                filterBtn: true,
                searchShowBtn: false,
                excelBtn: true,
                showOverflowTooltip: true,
                align: 'center',
                searchLabelPosition: 'left',
                searchGutter: 24,
                searchSpan: 6,
                menuAlign: 'left',
                gridBtn: false,
                searchMenuPosition: 'right',
                column: [
                    {
                        label: '任务编号',
                        prop: 'trNum',
                        search: false,
                        sortable: true,
                        filter: true,
                        addDisplay: false,
                        editDisplay: false,
                        viewDisplay: false,
                        span: 24,
                        width: 200,
                        rules: [
                            {
                                required: true,
                                message: '请输入任务编号',
                                trigger: 'blur',
                            },
                        ],
                    },
                    {
                        label: '试验项目',
                        prop: 'tpId',
                        sortable: true,
                        type: 'select',
                        filter: true,
                        span: 24,
                        width: 200,
                        search: true,
                        rules: [
                            {
                                required: true,
                                message: '请输入试验项目',
                                trigger: 'blur',
                            },
                        ],
                        props: {
                            label: 'tpProject',
                            value: 'tpId'
                        },
                        dicData: [
                            {
                                "deleted": false,
                                "keyValue": 1,
                                "tpCondition": "96小时",
                                "tpId": 1,
                                "tpProject": "盐雾试验"
                            },
                            {
                                "deleted": false,
                                "keyValue": 21,
                                "tpCondition": "68小时",
                                "tpId": 21,
                                "tpProject": "盐雾试验1"
                            }
                        ]
                    },
                    {
                        label: '试验条件',
                        prop: 'tpCondition',
                        search: false,
                        sortable: true,
                        filter: true,
                        span: 24,
                        width: 200,
                        rules: [
                            {
                                required: true,
                                message: '请输入试验条件',
                                trigger: 'blur',
                            },
                        ],
                    },
                    {
                        label: '试验标准',
                        prop: 'tpStandard',
                        type: 'textarea',
                        search: false,
                        sortable: true,
                        filter: true,
                        span: 24,
                        width: 200,
                        rules: [
                            {
                                required: true,
                                message: '请输入试验标准',
                                trigger: 'blur',
                            },
                        ],
                    },
                    {
                        label: '试验件',
                        prop: 'testPieceTitle',
                        type: 'select',
                        search: false,
                        sortable: true,
                        filter: true,
                        span: 24,
                        width: 200,
                        dicData: [
                            {
                                label: '零件',
                                value: 1
                            },
                            {
                                label: '试片',
                                value: 0
                            }
                        ]
                    },
                    {
                        label: '工艺员',
                        prop: 'craftMan',
                        search: false,
                        sortable: true,
                        filter: true,
                        span: 24,
                        width: 200,
                    },
                    // {
                    //     label: '试验员',
                    //     prop: 'mecMan',
                    //     search: false,
                    //     sortable: true,
                    //     editDisplay:false,
                    //     filter: true,
                    //     addDisplay:false,
                    //     span: 24,
                    //     width:200,
                    //     rules: [
                    //         {
                    //             required: true,
                    //             message: '请输入试验员',
                    //             trigger: 'blur',
                    //         },
                    //     ],
                    // },
                    {
                        label: '状态',
                        prop: 'trStatus',
                        search: true,
                        type: 'select',
                        sortable: true,
                        editDisplay: false,
                        filter: true,
                        addDisplay: false,
                        span: 24,
                        width: 200,
                        rules: [
                            {
                                required: true,
                                message: '请选择状态',
                                trigger: 'blur',
                            },
                        ],
                        dicData: [
                            { label: '待下发', value: 1 },
                            { label: '待接收', value: 2 },
                            { label: '待试验', value: 3 },
                            { label: '已超期', value: 4 },
                            { label: '已完成', value: 5 },
                        ]
                    },
                    {
                        label: '临期天数',
                        prop: 'expirationDays',
                        search: false,
                        sortable: true,
                        editDisplay: false,
                        filter: true,
                        addDisplay: false,
                        span: 24,
                        width: 200,
                        rules: [
                            {
                                required: true,
                                message: '请输入临期天数',
                                trigger: 'blur',
                            },
                        ],
                    },
                    {
                        label: '任务生成时间',
                        prop: 'createTime',

                        finishTime: '', search: false,
                        sortable: true,
                        editDisplay: false,
                        filter: true,
                        addDisplay: false,
                        span: 24,
                        width: 200,
                        rules: [
                            {
                                required: true,
                                message: '请输入任务生成时间',
                                trigger: 'blur',
                            },
                        ],
                    },
                    {
                        label: '任务下发时间',
                        prop: 'issueTime',
                        search: false,
                        sortable: true,
                        editDisplay: false,
                        filter: true,
                        addDisplay: false,
                        span: 24,
                        width: 200,
                        rules: [
                            {
                                required: true,
                                message: '请输入任务下发时间',
                                trigger: 'blur',
                            },
                        ],
                    },
                    {
                        label: '任务接成时间',
                        prop: 'receiveTime',
                        search: false,
                        sortable: true,
                        editDisplay: false,
                        filter: true,
                        addDisplay: false,
                        span: 24,
                        width: 200,
                        rules: [
                            {
                                required: true,
                                message: '请输入任务接成时间',
                                trigger: 'blur',
                            },
                        ],
                    },
                    {
                        label: '任务完成时间',
                        prop: 'finishTime',
                        search: false,
                        sortable: true,
                        editDisplay: false,
                        filter: true,
                        addDisplay: false,
                        span: 24,
                        width: 200,
                        rules: [
                            {
                                required: true,
                                message: '请输入任务完成时间',
                                trigger: 'blur',
                            },
                        ],
                    },
                ]
            },
            selectionList: [],
            dialogType: '',
        }
    },
    mounted() { },
    methods: {
        // 文件上传完成
        handleSuccess(response, file, fileList) {
            this.fileList = fileList
        },
        // 文件删除
        handleRemove(file, fileList) {
            this.fileList = fileList
        },
        // 查看详情
        handleView(row, type) {
            this.rowId = row.id
            this.rowObj = row
            this.viewDialog = true
        },
        // 关闭弹窗
        closeDialog() {
            this.viewDialog = false
        },
        // 多选
        selectionChange(list) {
            this.selectionList = list;
        },
        selectionClear() {
            this.selectionList = [];
            this.$refs.crud.toggleSelection();
        },
        rowUpdate(row, index, done, loading) {

        },
        rowSave(row, done, loading) {

        },
        // 报告 
        handleReport() { },
        // 填报
        handleWrite() {
            this.writeForm = {}
            this.fileList = []
            this.writeDialog = true
            this.$refs.writeForm.resetFields()
        },
        // 批量下发
        handleIssue() {
            if (this.selectionList.length == 0) {
                this.$message.error('请至少选择一条数据')
            } else {
                this.issueDialog = true
            }
        },
        // 单个下发
        issueRow(row) {
            this.issueDialog = true
        },
        // 接收
        handleReceive() {
            this.$confirm('确定接收此项任务?', {
                confirmButtonText: '确定',
                cancelButtonText: '取消',
                type: 'warning',
            }).then(() => {

            })
        },
        writeSubmit() {
            this.$refs.writeForm.validate(valid => {
                console.log('valid=============================', valid)
                if (valid) {
                    this.writeDialog = false
                }
            })
        },
        searchReset() {
            this.query = {};
            this.onLoad(this.page);
        },
        searchChange(params, done) {
            this.query = params;
            this.page.currentPage = 1;
            this.onLoad(this.page, params);
            done();
        },
        rowDel(row, index, done) {
            this.$confirm('确定将选择数据删除?', {
                confirmButtonText: '确定',
                cancelButtonText: '取消',
                type: 'warning',
            }).then(() => {

            })
        },
        // 下发
        submit() {
            this.$refs.issueForm.validate(valid => {
                if (valid) {
                    this.issueDialog = false
                }
            })
        },
        currentChange(currentPage) {
            this.page.currentPage = currentPage;
        },
        sizeChange(pageSize) {
            this.page.pageSize = pageSize;
        },
        refreshChange() {
            this.onLoad(this.page, this.query);
        },
        onLoad() {
            this.loading = true
            this.data = [
                {
                    id: 1, trNum: 'ZQRWxxXXXXXXXXXXX',
                    textProject: {
                        tpId: 1,
                        tpProject: '盐雾试验',
                        tpCondition: '96小时',
                        tpStandard: 'XXXXXXXXXXX标准',
                    },
                    testPieceTitle: '零件',
                    testPiece: 1,
                    craftMan: {
                        userName: '张三',
                    },
                    mecMan: {
                        userName: '李四',
                    },
                    trStatus: 1,
                    trStatusName: '待下发',
                    createTime: '2025-09-30 11:23:45',
                    testTime: '',
                    isTest: 0,
                    testFile: {
                        fileName: '',
                        fileUrl: ''
                    },
                    finishTime: '',
                    receiveTime: '',
                    issueTime: '',
                    expirationDays: 7
                },
                {
                    id: 2, trNum: 'ZQRWxxXXXXXXXXXXX',
                    textProject: {
                        tpId: 1,
                        tpProject: '盐雾试验',
                        tpCondition: '96小时',
                        tpStandard: 'XXXXXXXXXXX标准',
                    },
                    testPieceTitle: '零件',
                    testPiece: 1,
                    craftMan: {
                        userName: '张三',
                    },
                    mecMan: {
                        userName: '李四',
                    },
                    trStatus: 2,
                    trStatusName: '待接收',
                    createTime: '2025-09-30 11:23:45',
                    testTime: '',
                    isTest: 0,
                    testFile: {
                        fileName: '',
                        fileUrl: ''
                    },
                    finishTime: '',
                    receiveTime: '',
                    issueTime: '2025-10-01 11:22:12',
                    expirationDays: 7
                },
                {
                    id: 3, trNum: 'ZQRWxxXXXXXXXXXXX',
                    textProject: {
                        tpId: 1,
                        tpProject: '盐雾试验',
                        tpCondition: '96小时',
                        tpStandard: 'XXXXXXXXXXX标准',
                    },
                    testPieceTitle: '零件',
                    testPiece: 1,
                    craftMan: {
                        userName: '张三',
                    },
                    mecMan: {
                        userName: '李四',
                    },
                    trStatus: 3,
                    trStatusName: '待试验',
                    createTime: '2025-09-30 11:23:45',
                    testTime: '',
                    isTest: 0,
                    testFile: {
                        fileName: '',
                        fileUrl: ''
                    },
                    finishTime: '',
                    receiveTime: '2025-10-03 15:22:32',
                    issueTime: '2025-10-01 11:22:12',
                    expirationDays: 3
                },
                {
                    id: 4, trNum: 'ZQRWxxXXXXXXXXXXX',
                    textProject: {
                        tpId: 1,
                        tpProject: '盐雾试验',
                        tpCondition: '96小时',
                        tpStandard: 'XXXXXXXXXXX标准',
                    },
                    testPieceTitle: '零件',
                    testPiece: 1,
                    craftMan: {
                        userName: '张三',
                    },
                    mecMan: {
                        userName: '李四',
                    },
                    trStatus: 4,
                    trStatusName: '已超期',
                    createTime: '2025-09-30 11:23:45',
                    testTime: '',
                    isTest: 0,
                    testFile: {
                        fileName: '',
                        fileUrl: ''
                    },
                    finishTime: '',
                    receiveTime: '2025-10-03 15:22:32',
                    issueTime: '2025-10-01 11:22:12',
                    expirationDays: 0
                },
                {
                    id: 5, trNum: 'ZQRWxxXXXXXXXXXXX',
                    textProject: {
                        tpId: 1,
                        tpProject: '盐雾试验',
                        tpCondition: '96小时',
                        tpStandard: 'XXXXXXXXXXX标准',
                    },
                    testPieceTitle: '零件',
                    testPiece: 1,
                    craftMan: {
                        userName: '张三',
                    },
                    mecMan: {
                        userName: '李四',
                    },
                    trStatus: 5,
                    trStatusName: '已完成',
                    createTime: '2025-09-30 11:23:45',
                    testTime: '2025-10-04 11:00:05',
                    isTest: 1,
                    testFile: {
                        fileName: 'xxx报告',
                        fileUrl: 'xxx'
                    },
                    finishTime: '2025-10-04 11:12:25',
                    receiveTime: '2025-10-03 15:22:32',
                    issueTime: '2025-10-01 11:22:12',
                    expirationDays: ''
                },
            ]
            this.page.total = this.data.length
            this.loading = false
            setTimeout(() => {
                this.selectionClear();
            }, 500)
        }
    }
}
</script>

<style></style>