<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="scope">
            <el-button text icon="el-icon-view" @click="handleView(scope.row,'view')">详情</el-button>
            <el-button text @click="handleView(scope.row,'add')"  v-show="scope.row.status == 1 || scope.row.status == 4">
                <el-icon style="margin-right: 5px;"><Edit /></el-icon>
                填报
            </el-button>
            <el-button text  v-show="scope.row.status == 3" icon="el-icon-first-aid-kit" @click="handleView(scope.row,'drug')">领药</el-button>
            <el-button text v-show="scope.row.status == 2" icon="el-icon-circle-check" @click="handleView(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>
    
  </basic-container>
</template>

<script>
export default {
    data(){
        return{
            data:[],
            page: {
                pageSize: 10,
                currentPage: 1,
                total: 0,
            },
            showDialog:false,
            rowId:'',
            rowObj:{},
            issueDialog:false,
            form:{},
            formRules:{
              userId: [{ required: true, message: '请选择检测员', trigger: 'blur' }],
            },
            query:{},
            loading:true,
            issueForm:{},
            option:{
                tip: false,
                simplePage: true,
                searchShow: true,
                searchMenuSpan: 6,
                searchIcon: true,
                searchIndex: 3,
                tree: false,
                border: true,
                index: true,
                selection: false,
                viewBtn: false,
                delBtn: false,
                addBtn:false,
                editBtn:false,
                editBtnText: '修改',
                viewBtnText:'详情',
                labelWidth: 120,
                // menuWidth: 330,
                dialogWidth: 600,
                dialogClickModal: false,
                searchEnter: true,
                filterBtn: true,
                searchShowBtn: false,
                excelBtn: true,
                showOverflowTooltip: true,
                align:'center',
                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',
                        search: false,
                        sortable: true,
                        editDisplay:false,
                        filter: true,
                        addDisplay:false,
                        span: 24,
                        width:200,
                        rules: [
                            {
                                required: true,
                                message: '请输入任务生成时间',
                                trigger: 'blur',
                            },
                        ],
                    },
                    {
                        label: '任务接成时间',
                        prop: 'createTime',
                        search: false,
                        sortable: true,
                        editDisplay:false,
                        filter: true,
                        addDisplay:false,
                        span: 24,
                        width:200,
                        rules: [
                            {
                                required: true,
                                message: '请输入任务接成时间',
                                trigger: 'blur',
                            },
                        ],
                    },
                    {
                        label: '任务生成时间',
                        prop: 'createTime',
                        search: false,
                        sortable: true,
                        editDisplay:false,
                        filter: true,
                        addDisplay:false,
                        span: 24,
                        width:200,
                        rules: [
                            {
                                required: true,
                                message: '请输入任务生成时间',
                                trigger: 'blur',
                            },
                        ],
                    },
                ]
            },
            selectionList:[],
            dialogType:'',
        }
    },
    mounted(){},
    methods:{
        // 查看详情
        handleView(row,type){
            this.dialogType = type
            this.rowId = row.id
            this.rowObj = row
            this.showDialog = true
        },
        // 关闭弹窗
        closeDialog(){
            this.showDialog = false
        },
        // 多选
        selectionChange(list) {
            this.selectionList = list;
        },
        selectionClear() {
            this.selectionList = [];
            this.$refs.crud.toggleSelection();
        },
        rowUpdate(row, index, done, loading) {
        
        },
        rowSave(row, done, loading) {
        
        },
        // 批量下发
        handleIssue(){
            if(this.selectionList.length == 0){
                this.$message.error('请至少选择一条数据')
            }else{
                this.issueDialog = true
            }
        },
        // 单个下发
        issueRow(row){
            this.issueDialog = true
        },
        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',
                    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',
                    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',
                    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',
                    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',
                    expirationDays:''
                },
            ]
            this.page.total = this.data.length
            this.loading = false
            setTimeout(() =>{
                this.selectionClear();
            },500)
        }
    }
}
</script>

<style>

</style>