<template>
    <basic-container>
        <avue-crud :option="option" :table-loading="loading" :data="data" v-model="form" v-model:page="page" ref="crud"
            @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>

            </template>
            <template #menu-right>
                <el-button type="primary" @click="maintenanceFn()">维护
                </el-button>
                <el-button type="primary" @click="handleImport()">导入
                </el-button>
            </template>
            <!-- <template #ocName="scope">
            </template> -->
            <template #menu="scope">
                <el-button type="text" size="mini" @click="approval(scope.row.tbId)">审批</el-button>
            </template>
        </avue-crud>
        <maintenanceDialog v-if="isOpen" :showDialog="isOpen"  @closeDialog="closeDialog" :list="data">
        </maintenanceDialog>
        <basic-import v-if="isShowImport" title="导入" :isShow="isShowImport"
            templateUrl="/blade-desk/mesOemAndAbility/downloadExcelTemplate"
            templateName="外协绩效模板.xls"
            importUrl="/blade-desk/mesOemAndAbility/importExcel"
            @closeDialog="closeDialog"></basic-import>
    </basic-container>
</template>
<script>
import {getList,} from "@/api/outsourcingManagement/baseTemplate"
import maintenanceDialog from './components/maintenanceDialog.vue'
import basicImport from '@/components/basic-import/main.vue'
export default {
    components: {
        maintenanceDialog,
        basicImport
    },
    data() {
        return {
            isShowImport: false,
            loading: false,
            query:{},
            selectionList: [],
            option: {
                height: 'auto',
                calcHeight: 32,
                tip: false,
                // size: 'medium',
                simplePage: true,
                searchShow: true,
                searchMenuSpan: 12,
                searchIcon: true,
                searchIndex: 3,
                tree: false,
                border: true,
                index: true,
                selection: false,
                viewBtn: false,
                delBtn: false,
                addBtn: false,
                editBtn: false,
                editBtnText: '修改',
                viewBtnIcon: ' ',
                delBtnIcon: ' ',
                editBtnIcon: ' ',
                viewBtnText: '详情',
                labelWidth: 120,
                menuWidth: 120,
                dialogWidth: 1040,
                dialogClickModal: false,
                searchEnter: true,
                excelBtn: false,
                filterBtn: true,
                columnSort: true,
                excelBtn: true,
                columnSort: true,
                showOverflowTooltip: true,
                searchLabelPosition: 'left',
                searchGutter: 24,
                searchSpan: 6,
                menuAlign: 'left',
                gridBtn: false,
                searchMenuPosition: 'right',
                addBtnIcon: ' ',
                viewBtnIcon: ' ',
                delBtnIcon: ' ',
                editBtnIcon: ' ',
                menu: false,
                align: 'center',
                searchShowBtn:false,
                align: 'center',
                column: [
                    {
                        label: '工艺能力',
                        prop: 'caId',
                        sortable: true,
                        filter: true,
                        span: 12,
                        search: true,
                        searchLabelWidth: 80,
                        type:'select',
                        dicUrl:"/api/blade-desk/BA/craftAbility/findList",
                        props:{
                            label:"caName",value:"id"
                        }
                        // dicData:[
                        //     {
                        //         label:'镀金'
                        //     },
                        //     {
                        //         label:'镀银'
                        //     }
                        // ]
                    },
                    {
                        label: '厂家',
                        prop: 'oemName',
                        // bind: 'bsOemCustomer.ocName',
                        sortable: true,
                        filter: true,
                        span: 12,
                        search: true,
                        searchLabelWidth: 50,
                    },
                ]
            },
            form: {

            },
            page: {
                pageSize: 10,
                currentPage: 1,
                total: 0,
            },
            isOpen: false,
            spanArr:[
                { prop: 'plate', span: [] },
                // { prop: 'sex', span: [] },
                // { prop: 'grade', span: [] }
            ]
        }
    },
    methods: {
        // 点击导入按钮
    handleImport() {
      this.isShowImport = true
    },
        spanMethod({ row, column, rowIndex, columnIndex }) {
            console.log(999999,_row,_col)
            for (let i = 0; i < this.spanArr.length; i++) {
                const ele = this.spanArr[i];
                if (column.property == ele.prop) {
                const _row = ele.span[rowIndex];
                const _col = _row > 0 ? 1 : 0;
                
                return { rowspan: _row, colspan: _col };
                }
            }
        },
        // 维护
        maintenanceFn() {
            this.isOpen = true
        },
        approval(row) {
            this.isOpen = true
        },
        closeDialog(val) {
            this.isOpen = false
            this.isShowImport = false
            if(val){
                this.onLoad()
            }
        },
        handleDelete() {
            if (this.selectionList.length === 0) {
                this.$message.warning('请选择至少一条数据');
                return;
            }
            this.$confirm('确定将选择数据删除?', {
                confirmButtonText: '确定',
                cancelButtonText: '取消',
                type: 'warning',
            }).then(() => {
            })
        },
        searchChange(params, done){
            this.query = params;
            this.page.currentPage = 1
            this.onLoad()
            done()
        },
        searchReset(){
            this.query = {}
            this.onLoad()
        },
        // 多选
        selectionChange(list) {
            this.selectionList = list;
        },
        onLoad() {
            this.loading = true
            getList({
                current:this.page.currentPage,
                size:this.page.pageSize,
                ...this.query
            }).then(res =>{
                this.data = res.data.data.records
                this.page.total = res.data.data.total
                this.loading  = false
            })
            // this.data = [
            //     {
            //          "ocName": "厂家1",
            //         "bsOemCustomer": {
            //             "abbreviation": "L076",
            //             "address": "aaa",
            //             "codeAndName": "L076/L076",
            //             "contactMan": "aaa",
            //             "contactPhone": "aaa",
            //             "craftAbility": "镀银、挂镀银、喷砂、涂色标、铜合金化学镀镍、电镀镍、DL零件包装",
            //             "curStatus": 0,
            //             "curStatusText": "正常供货",
            //             "email": "aaa",
            //             "keyValue": 21,
            //             "limitType": 0,
            //             "ocCode": "L076",
            //             "ocId": 21,
                       
            //             "oemPassword": null,
            //             "partCodeYesOrNo": false,
            //             "qualification": 10,
            //             "qualificationTitle": null,
            //             "region": "陕西省",
            //             "updateTime": "2023-04-14 18:33:49"
            //         },
            //         "createMan": {
            //             "userId": 541,
            //             "userName": "崔殿龙"
            //         },
            //         "createTime": "2023-11-10 18:06:40",
            //         "keyValue": 1,
            //         "oaaId": 1,
            //         "plate": "镀金"
            //     },
            //     {
            //         "ocName": "厂家1",
            //         "bsOemCustomer": {
            //             "abbreviation": "L120",
            //             "address": "aaa",
            //             "codeAndName": "L120/L120",
            //             "contactMan": "aaa",
            //             "contactPhone": "aaa",
            //             "craftAbility": "不锈钢涂福斯润滑剂、DL零件包装、",
            //             "curStatus": 0,
            //             "curStatusText": "正常供货",
            //             "email": "aaa",
            //             "keyValue": 2,
            //             "limitType": 0,
            //             "ocCode": "L120",
            //             "ocId": 2,
                        
            //             "oemPassword": null,
            //             "partCodeYesOrNo": false,
            //             "qualification": 0,
            //             "qualificationTitle": "民品&普军",
            //             "region": "江苏省",
            //             "updateTime": "2023-04-14 18:33:49"
            //         },
            //         "createMan": {
            //             "userId": 541,
            //             "userName": "崔殿龙"
            //         },
            //         "createTime": "2023-11-10 18:06:40",
            //         "keyValue": 4,
            //         "oaaId": 4,
            //         "plate": "镀金"
            //     },
            //     {
            //          "ocName": "L070",
            //         "bsOemCustomer": {
            //             "abbreviation": "L070",
            //             "address": "aaa",
            //             "codeAndName": "L070/L070",
            //             "contactMan": "aaa",
            //             "contactPhone": "aaa",
            //             "craftAbility": "滚镀金或振镀金、局部镀厚金、闪镀金、镀铂金、局部退火",
            //             "curStatus": 0,
            //             "curStatusText": "正常供货",
            //             "email": "aaa",
            //             "keyValue": 5,
            //             "limitType": 0,
            //             "ocCode": "L070",
            //             "ocId": 5,
                       
            //             "oemPassword": null,
            //             "partCodeYesOrNo": false,
            //             "qualification": 10,
            //             "qualificationTitle": null,
            //             "region": "江苏省",
            //             "updateTime": "2023-04-14 18:33:49"
            //         },
            //         "createMan": {
            //             "userId": 541,
            //             "userName": "崔殿龙"
            //         },
            //         "createTime": "2023-12-06 17:24:48",
            //         "keyValue": 21,
            //         "oaaId": 21,
            //         "plate": "镀银"
            //     },

            // ]
            // this.page.total = this.data.length
            // this.loading = false
            // setTimeout(() => {
            //     this.selectionClear()
            // }, 500)
        }
    }
}
</script>
<style lang="scss" scoped></style>