categoryOptions<template>
    <div class="app-container calendar-list-container">

        <!-- 查询和其他操作 -->
        <div class="filter-container">
            <el-input clearable class="filter-item" style="width: 200px;" placeholder="供应商名称"
                v-model="listQuery.supplierName"></el-input>
                <el-input clearable class="filter-item" style="width: 200px;" placeholder="供应商编号"
                v-model="listQuery.supplierNum"></el-input>
            <el-select class="filter-item" style="width: 200px" v-model="listQuery.typeId" filterable placeholder="供应商类别">
                <el-option v-for="item in brandOptions" :key="item.value" :label="item.label" :value="item.value">
                </el-option>
            </el-select>
            <treeselect class="filter-item" default-expand-all v-model="listQuery.responsibleDept" :options="categoryOptions"
                :normalizer="normalizer" placeholder="申请部门" style="width: 200px" />
            
            <el-select v-model="listQuery.isEnable" clearable placeholder="是否启用" class="filter-item" style="width: 200px;">
                <el-option :key="item.type" v-for="item in goodsStatusList" :label="item.name" :value="item.type">
                </el-option>
            </el-select>

            <el-button class="filter-item" type="primary" v-waves icon="el-icon-search"
                @click="handleQuery">查找</el-button>
                <el-button class="filter-item" icon="el-icon-refresh" @click="resetQuery">重置</el-button>
            <el-button class="filter-item" type="primary" @click="handleAdd" icon="el-icon-plus">添加</el-button>
            <!-- <el-button class="filter-item" v-waves icon="el-icon-download" @click="handleDownLoad">导出</el-button> -->
        </div>

        <!-- 查询结果 -->
        <el-table size="small" :data="list" v-loading="listLoading" element-loading-text="正在查询中。。。" border fit
            highlight-current-row>
            <el-table-column type="index" label="序号" header-align="center" align="center">
            </el-table-column>
            <el-table-column align="center" min-width="120px" label="供应商编号" prop="supplierNum">
            </el-table-column>
            <el-table-column align="center" min-width="200px" label="供应商名称" prop="supplierName">
            </el-table-column>
            <el-table-column align="center" min-width="80px" label="供应商类别" prop="typeName">
            </el-table-column>
            <el-table-column align="center" min-width="80px" label="地域" prop="supplierPurchasAddress">
            </el-table-column>
            <el-table-column align="center" min-width="80px" label="联系人" prop="supplierContact">
            </el-table-column>
            <el-table-column align="center" min-width="80px" label="申请部门" prop="deptName">
            </el-table-column>
            <el-table-column align="center" min-width="180px" label="登记时间" prop="addTime">
            </el-table-column>
            <el-table-column align="center" min-width="100px" label="是否启用">
                <template slot-scope="props">
                    <span v-if="props.row.isEnable == 0" style="color: #67C23A;font-weight: bold;">启用</span>
                    <span v-if="props.row.isEnable == 1" style="color: #E6A23C;font-weight: bold;">停用</span>
                </template>
            </el-table-column>
            <el-table-column align="center" label="操作" width="240px" class-name="small-padding fixed-width">
                <template slot-scope="scope">
                    <el-button type="primary" size="small" @click="handleUpdate(scope.row)">编辑</el-button>
                    <el-button type="danger" size="small" @click="handleDelete(scope.row)">删除</el-button>
                </template>
            </el-table-column>
        </el-table>

        <!-- 分页 -->
        <div class="pagination-container">
            <el-pagination background @size-change="handleSizeChange" @current-change="handleCurrentChange"
                :current-page="listQuery.page" :page-sizes="[10, 20, 30, 50]" :page-size="listQuery.limit"
                layout="total, sizes, prev, pager, next, jumper" :total="total">
            </el-pagination>
        </div>
        <!-- 添加或修改对话框 -->
        <el-dialog :close-on-click-modal="false" :title="textMap[dialogStatus]" :visible.sync="dialogFormVisible"
            width="70%">
            <el-form :rules="rules" ref="dataForm" :model="dataForm" status-icon label-position="left"
                label-width="100px" style='margin: 0 50px;'>
                <el-tabs v-model="activeName" @tab-click="handleClick">
                    <el-tab-pane label="基础信息" name="first">
                        <el-form-item label="供应商名称" prop="supplierName">
                            <el-input v-model="dataForm.supplierName" placeholder="请输入"></el-input>
                        </el-form-item>
                        <el-form-item v-if="dataForm.supplierNum" label="供应商编号" prop="supplierNum">
                            <el-input disabled v-model="dataForm.supplierNum"></el-input>
                        </el-form-item>
                        <el-form-item label="类别" prop="typeId">
                            <el-select style="width: 100%" v-model="dataForm.typeId" filterable placeholder="请选择">
                                <el-option v-for="item in brandOptions" :key="item.value" :label="item.label" :value="item.value">
                                </el-option>
                            </el-select>
                        </el-form-item>
                        <el-form-item label="地域" prop="supplierPurchasAddress">
                            <el-input v-model="dataForm.supplierPurchasAddress" placeholder="请输入"></el-input>
                        </el-form-item>
                        <el-form-item label="注册资本金" prop="registeredCapital">
                            <el-input v-model="dataForm.registeredCapital" placeholder="请输入注册资本金(万元)"></el-input>
                        </el-form-item>
                        <el-form-item label="银行卡号" prop="bankCardNo">
                            <el-input v-model="dataForm.bankCardNo" placeholder="请输入"></el-input>
                        </el-form-item>
                        <el-form-item label="银行名称" prop="bankCardName">
                            <el-input v-model="dataForm.bankCardName" placeholder="请输入"></el-input>
                        </el-form-item>
                        <el-form-item label="纳税性质" prop="nature">
                            <el-select style="width: 100%" v-model="dataForm.nature" filterable placeholder="请选择">
                                <el-option value="一般纳税人">一般纳税人</el-option>
                                <el-option value="小规模纳税人">小规模纳税人</el-option>
                            </el-select>
                        </el-form-item>
                        <el-form-item label="税率" prop="taxrate">
                            <el-select style="width: 100%" v-model="dataForm.taxrate" filterable placeholder="请选择">
                                <el-option value="0%">0%</el-option>
                                <el-option value="1%">1%</el-option>
                                <el-option value="3%">3%</el-option>
                            </el-select>
                        </el-form-item>
                        <el-form-item label="联系人" prop="supplierContact">
                            <el-input v-model="dataForm.supplierContact" placeholder="请输入"></el-input>
                        </el-form-item>
                        <el-form-item label="联系电话" prop="supplierPhone">
                            <el-input v-model="dataForm.supplierPhone" placeholder="请输入"></el-input>
                        </el-form-item>
                        <el-form-item label="单位地址" prop="supplierAddress">
                            <el-input v-model="dataForm.supplierAddress" placeholder="请输入"></el-input>
                        </el-form-item>
                        <el-form-item label="申请部门" prop="responsibleDept">
                            <treeselect default-expand-all v-model="dataForm.responsibleDept" :options="categoryOptions"
                                :normalizer="normalizer" placeholder="请选择" />
                        </el-form-item>
                        <el-form-item label="申请事由" prop="supplierRemark">
                            <el-input
                                type="textarea"
                                :autosize="{ minRows: 2, maxRows: 4}"
                                placeholder="请输入"
                                v-model="dataForm.supplierRemark">
                            </el-input>
                        </el-form-item>
                    </el-tab-pane>
                    <el-tab-pane label="营业执照" name="second">
                       
                        <el-form-item label="名称" prop="businessName">
                            <el-input v-model="dataForm.businessName" placeholder="请输入产地"></el-input>
                        </el-form-item>
                        <el-form-item label="开始日期" prop="businessStartTime">
                            <el-date-picker style="width: 100%;" v-model="dataForm.businessStartTime" type="date" value-format="yyyy-MM-dd"
                                placeholder="选择日期"></el-date-picker>
                        </el-form-item>
                        <el-form-item label="结束日期" prop="businessEndTime">
                            <el-date-picker style="width: 100%;" v-model="dataForm.businessEndTime" type="date" value-format="yyyy-MM-dd"
                                placeholder="选择日期"></el-date-picker>
                        </el-form-item>
                        <el-form-item style="width: 800px" label="附件" prop="businessFile">
                            <el-upload :limit="1" :action="fileImgUrl" list-type="picture-card"
                                :file-list="dataForm.businessFiles" 
                                :on-success="(response, file, fileList) => {return handleImgSucess(response, file, fileList, 'businessFiles')}" 
                                :on-exceed="handleExceed"
                                :before-upload="beforeUploadImg" 
                                :on-remove="(file, fileList) => {return handleRemoveImg(file, fileList, 'businessFiles')}">
                                <i class="el-icon-plus"></i>
                            </el-upload>
                        </el-form-item>
                    </el-tab-pane>
                    <el-tab-pane label="财务报表/审计报告" name="third">
                        <el-form-item label="财务报表" prop="financeFileId">
                            <el-upload :limit="1" :action="fileImgUrl" :file-list="dataForm.financeFiles" 
                                :on-success="(response, file, fileList) => {return handleFileSuccess(response, file, fileList, 'financeFiles')}"
                                :before-upload="beforeUploadFile" 
                                :on-remove="(file, fileList) => {return handleRemoveFile(file, fileList, 'financeFiles')}">
                                <el-button size="small" type="primary">点击上传</el-button>
                            </el-upload>
                        </el-form-item>
                        <el-form-item label="审计报告" prop="auditFileId">
                            <el-upload :limit="1" :action="fileImgUrl" :file-list="dataForm.auditFiles" 
                                :on-success="(response, file, fileList) => {return handleFileSuccess(response, file, fileList, 'auditFiles')}"
                                :before-upload="beforeUploadFile" 
                                :on-remove="(file, fileList) => {return handleRemoveFile(file, fileList, 'auditFiles')}">
                                <el-button size="small" type="primary">点击上传</el-button>
                            </el-upload>
                        </el-form-item>
                    </el-tab-pane>
                    <el-tab-pane label="供应商资质信息" name="fourth">
                        <el-form-item label="名称" prop="qualifiedName">
                            <el-input v-model="dataForm.qualifiedName" placeholder="请输入"></el-input>
                        </el-form-item>
                        <el-form-item label="开始日期" prop="qualifiedStartTime">
                            <el-date-picker style="width: 100%;" v-model="dataForm.qualifiedStartTime" type="date" value-format="yyyy-MM-dd"
                                placeholder="选择日期"></el-date-picker>
                        </el-form-item>
                        <el-form-item label="结束日期" prop="qualifiedEndTime">
                            <el-date-picker style="width: 100%;" v-model="dataForm.qualifiedEndTime" type="date" value-format="yyyy-MM-dd"
                                placeholder="选择日期"></el-date-picker>
                        </el-form-item>
                        <el-form-item style="width: 800px" label="附件" prop="qualifiedFile">
                            <el-upload :limit="1" :action="fileImgUrl" list-type="picture-card"
                                :file-list="dataForm.qualifiedFiles" 
                                :on-success="(response, file, fileList) => {return handleImgSucess(response, file, fileList, 'qualifiedFiles')}" 
                                :on-exceed="handleExceed"
                                :before-upload="beforeUploadImg" 
                                :on-remove="(file, fileList) => {return handleRemoveImg(file, fileList, 'qualifiedFiles')}">
                                <i class="el-icon-plus"></i>
                            </el-upload>
                        </el-form-item>
                    </el-tab-pane>
                </el-tabs>

            </el-form>
            <div slot="footer" class="dialog-footer">
                <el-button @click="dialogFormVisible = false">取消</el-button>
                <el-button v-if="dialogStatus == 'create'" type="primary" @click="createData">确定</el-button>
                <el-button v-else type="primary" @click="updateData">确定</el-button>
            </div>
        </el-dialog>

    </div>
</template>
<script>
import { createSupplier, updateSupplier, listSupplier, deleteSupplier, typeListSupplier } from "@/api/supplier";
import { listDept } from "@/api/dept";
import Treeselect from "@riophae/vue-treeselect";
import "@riophae/vue-treeselect/dist/vue-treeselect.css";
import waves from "@/directive/waves"; // 水波纹指令

export default {
    components: { Treeselect },
    directives: { waves },
    data() {
        return {
       
            // 树选项
            categoryOptions: [],
            activeName: 'first',
            brandOptions: [],
            goodsStatusList: [
                {
                    type: 0,
                    name: '启用'
                },
                {
                    type: 1,
                    name: '停用'
                },
            ],
            list: [],
            total: 0,
            listLoading: false,
            listQuery: {
                page: 1,
                limit: 10,
                supplierName: '',
                supplierNum: '',
                typeId: '',
                responsibleDept: undefined,
                isEnable: '',
            },
            dataForm: {
                supplierName: undefined,
                supplierNum: undefined,
                supplierNum: undefined,
                typeId: undefined,
                supplierPurchasAddress: undefined,
                registeredCapital: undefined,
                bankCardNo: undefined,
                bankCardName: undefined,
                nature: undefined,
                taxrate: undefined,
                supplierContact: undefined,
                supplierPhone: undefined,
                supplierAddress: undefined,
                responsibleDept: undefined,
                supplierRemark: undefined,

                businessName: undefined,
                businessStartTime: undefined,
                businessEndTime: undefined,
                businessFile: undefined,
                businessFiles:[],

                financeFileId:undefined,
                financeFiles: [],

                auditFileId:undefined,
                auditFiles: [],

                qualifiedName: undefined,
                qualifiedStartTime: undefined,
                qualifiedEndTime: undefined,
                qualifiedFile: undefined,
                qualifiedFiles:[],
            },
            dialogFormVisible: false,
            dialogStatus: '',
            textMap: {
                update: "编辑",
                create: "创建",
            },
            rules: {
                supplierName: [{ required: true, message: "请填写供应商名称", trigger: "blur" }],
                typeId: [{ required: true, message: "请选择供应商类别", trigger: "blur" }],
                supplierPurchasAddress: [{ required: true, message: "请填写地域", trigger: "blur" }],
                registeredCapital: [
                    { required: true, message: "请填写注册资本金", trigger: "blur" },
                    {
                        pattern: /^(([1-9]{1}\d{0,9})|(0{1}))(\.\d{1,2})?$/,
                        message: "请输入合法的金额数字，最多两位小数",
                        trigger: "blur"
                    }
                ],
                bankCardNo: [{ required: true, message: "请填写银行卡号", trigger: "blur" }],
                bankCardName: [{ required: true, message: "请填写银行名称", trigger: "blur" }],
                nature: [{ required: true, message: "请选择纳税性质", trigger: "blur" }],
                taxrate: [{ required: true, message: "请选择税率", trigger: "blur" }],
                supplierContact: [{ required: true, message: "请填写联系人", trigger: "blur" }],
                supplierPhone: [{ required: true, message: "请填写联系电话", trigger: "blur" }],
                supplierAddress: [{ required: true, message: "请填写单位地址", trigger: "blur" }],
                responsibleDept: [{ required: true, message: "请选择申请部门", trigger: "blur" }],
                supplierRemark: [{ required: true, message: "请填写申请事由", trigger: "blur" }],
                businessName: [{ required: true, message: "请填写营业执照名称", trigger: "blur" }],
                businessStartTime: [{ required: true, message: "请选择开始日期", trigger: "blur" }],
                businessEndTime: [{ required: true, message: "请选择结束日期", trigger: "blur" }],
                businessFile: [{ required: true, message: "请上传营业执照", trigger: "blur" }],
            },
            dialogListVisible: false,
            fileImgUrl: this.upLoadUrl,
        }
    },
    created() {
        this.getListCategory();
        this.getTypeList();
        this.getList();
    },
    methods: {
        handleDownLoad(){
            window.location.href = process.env.BASE_API + '/product/export/category?supplierName=' + this.listQuery.supplierName + '&supplierNum=' + this.listQuery.supplierNum;
        },
        getListCategory() {
            listDept().then(response => {
                this.categoryOptions = this.handleTree(response.data.data, "deptId");
            });
        },
        /** 转换部门数据结构 */
        normalizer(node) {
            if (node.children && !node.children.length) {
                delete node.children;
            }
            return {
                id: node.deptId,
                label: node.deptName,
                children: node.children
            };
        },
        handleClick(tab, event) {
            console.log(tab, event);
        },
        handleRemoveFile(file, fileList, type) {
            console.log(file, fileList, type);
            if (type == "financeFiles") {
                let financeFiles = [];
                for (let i in fileList) {
                    let id = fileList[i].response.data.id;
                    financeFiles.push(id);
                }
                this.dataForm.financeFileId = financeFiles.join(",");
            }else{
                let auditFiles = [];
                for (let i in fileList) {
                    let id = fileList[i].response.data.id;
                    auditFiles.push(id);
                }
                this.dataForm.auditFileId = auditFiles.join(",");
            }
           
        },
        beforeUploadFile(file) {
            console.log(file);
            const size = file.size / 1024 / 1024;
            console.log(size);
            if (size > 10) {
                this.$message.error("文件大小不能超过10MB！");
                return false;
            }
        },
        handleFileSuccess(res, file, fileList, type) {
            console.log(res, file, fileList, type);
            if (type == "financeFiles") {
                let financeFiles = [];
                for (let i in fileList) {
                    let response = fileList[i].response;
                    if (response.errno && response.errno != "0") {
                        this.$message.error("该文件上传失败,已被移除,请重新上传!");
                        // 上传失败移除该 file 对象
                        financeFiles.splice(i, 1);
                    } 
                    else {
                        let id = fileList[i].response.data.id;
                        financeFiles.push(id);
                    }
                }
                this.dataForm.financeFileId = financeFiles.join(",");
            }else{
                let auditFiles = [];
                for (let i in fileList) {
                    let response = fileList[i].response;
                    if (response.errno && response.errno != "0") {
                        this.$message.error("该文件上传失败,已被移除,请重新上传!");
                        // 上传失败移除该 file 对象
                        auditFiles.splice(i, 1);
                    } 
                    else {
                        let id = fileList[i].response.data.id;
                        auditFiles.push(id);
                    }
                }
                this.dataForm.auditFileId = auditFiles.join(",");
            }
           
        },

        handleRemoveImg(file, fileList, type) {
            console.log(file, fileList, type);
            if (type == "qualifiedFiles") {
                let qualifiedFiles = [];
                for (let i in fileList) {
                    let id = fileList[i].response.data.id;
                    qualifiedFiles.push(id);
                }
                this.dataForm.qualifiedFile = qualifiedFiles.join(",");
            }else{
                let businessFiles = [];
                for (let i in fileList) {
                    let id = fileList[i].response.data.id;
                    businessFiles.push(id);
                }
                this.dataForm.businessFile = businessFiles.join(",");
            }
            
        },
        beforeUploadImg(file) {
            const isJPGs = file.type === "image/jpeg";
            console.log(isJPGs);
        },
        handleExceed(files, fileList) {
            this.$message.warning(
                `当前限制选择 1 个文件，本次选择了 ${files.length} 个文件！，共选择了 ${files.length + fileList.length
                } 个文件`
            );
        },
        handleImgSucess(res, file, fileList, type) {
            console.log(res, file, fileList, type);
            if (type == "qualifiedFiles") {
                let qualifiedFiles = [];
                for (let i in fileList) {
                    let response = fileList[i].response;
                    if (response.errno && response.errno != "0") {
                        this.$message.error("该图片上传失败,已被移除,请重新上传!");
                        // 上传失败移除该 file 对象
                        fileList.splice(i, 1);
                    } else {
                        let id = fileList[i].response.data.id;
                        qualifiedFiles.push(id);
                    }
                }
                this.dataForm.qualifiedFile = qualifiedFiles.join(",");
            }else{
                let businessFiles = [];
                for (let i in fileList) {
                    let response = fileList[i].response;
                    if (response.errno && response.errno != "0") {
                        this.$message.error("该图片上传失败,已被移除,请重新上传!");
                        // 上传失败移除该 file 对象
                        businessFiles.splice(i, 1);
                    } else {
                        let id = fileList[i].response.data.id;
                        businessFiles.push(id);
                    }
                }
                this.dataForm.businessFile = businessFiles.join(",");
            }
        },
        resetForm() {
            this.dataForm = {
                supplierName: undefined,
                supplierNum: undefined,
                supplierNum: undefined,
                typeId: undefined,
                supplierPurchasAddress: undefined,
                registeredCapital: undefined,
                bankCardNo: undefined,
                bankCardName: undefined,
                nature: undefined,
                taxrate: undefined,
                supplierContact: undefined,
                supplierPhone: undefined,
                supplierAddress: undefined,
                responsibleDept: undefined,
                supplierRemark: undefined,

                businessName: undefined,
                businessStartTime: undefined,
                businessEndTime: undefined,
                businessFile: undefined,
                businessFiles:[],

                financeFileId:undefined,
                financeFiles: [],

                auditFileId:undefined,
                auditFiles: [],

                qualifiedName: undefined,
                qualifiedStartTime: undefined,
                qualifiedEndTime: undefined,
                qualifiedFile: undefined,
                qualifiedFiles:[],
            };
        },
        handleAdd() {
            this.activeName = 'first';
            this.resetForm();

            this.dialogFormVisible = true;
            this.dialogStatus = "create";

            this.$nextTick(() => {
                this.$refs["dataForm"].clearValidate();
            });
        },
        createData() {
            this.$refs["dataForm"].validate((valid) => {
                if (valid) {
                    console.log(this.dataForm);
                    createSupplier(this.dataForm)
                        .then((response) => {
                            this.getList();
                            this.dialogFormVisible = false;
                            this.$notify({
                                title: "成功",
                                message: "创建成功",
                                type: "success",
                                duration: 2000,
                            });
                            this.reload();
                        })
                        .catch(() => { });
                }
            });
        },
        handleUpdate(row) {
            this.activeName = 'first';
            this.dataForm = Object.assign({}, row);
            if (this.dataForm.businessFiles) {
                let files = this.dataForm.businessFiles;
                this.dataForm.businessFiles = [];
                for (let i in files) {
                    let url = files[i].url;
                    let name = files[i].oldName;
                    let id = files[i].id;

                    this.dataForm.businessFiles.push({
                        name: name,
                        url: url,
                        response: { error: "0", data: { url: url,id:id } },
                    });
                }
            }
            if (this.dataForm.qualifiedFiles) {
                let files = this.dataForm.qualifiedFiles;
                this.dataForm.qualifiedFiles = [];
                for (let i in files) {
                    let url = files[i].url;
                    let name = files[i].oldName;
                    let id = files[i].id;

                    this.dataForm.qualifiedFiles.push({
                        name: name,
                        url: url,
                        response: { error: "0", data: { url: url,id:id } },
                    });
                }
            }
            if (this.dataForm.financeFiles) {
                let files = this.dataForm.financeFiles;
                this.dataForm.financeFiles = [];
                for (let i in files) {
                    let url = files[i].url;
                    let name = files[i].oldName;
                    let id = files[i].id;

                    this.dataForm.financeFiles.push({
                        name: name,
                        url: url,
                        response: { error: "0", data: { url: url,id:id } },
                    });
                }
            }
            if (this.dataForm.auditFiles) {
                let files = this.dataForm.auditFiles;
                this.dataForm.auditFiles = [];
                for (let i in files) {
                    let url = files[i].url;
                    let name = files[i].oldName;
                    let id = files[i].id;

                    this.dataForm.auditFiles.push({
                        name: name,
                        url: url,
                        response: { error: "0", data: { url: url,id:id } },
                    });
                }
            }
            this.dialogStatus = 'update'
            this.dialogFormVisible = true
            this.$nextTick(() => {
                this.$refs['dataForm'].clearValidate()
            })
        },
        updateData() {
            this.$refs['dataForm'].validate((valid) => {
                if (valid) {
                    updateSupplier(this.dataForm).then(() => {
                        this.dialogFormVisible = false
                        this.$notify({
                            title: '成功',
                            message: '更新成功',
                            type: 'success',
                            duration: 2000
                        })
                        this.getList()
                    })

                }

            })
        },
        handleDelete(row) {
            this.$confirm('确认删除吗?', '提示', {
                confirmButtonText: '确定',
                cancelButtonText: '取消',
                type: 'warning'
            }).then(() => {
                deleteSupplier({ id: row.id }).then(response => {
                    this.$notify({
                        title: '成功',
                        message: '删除成功',
                        type: 'success',
                        duration: 2000
                    })
                    this.getList();
                })
            }).catch(() => {

            })

        },
        getTypeList() {
            // 获取供应商类别
            typeListSupplier().then(response => {
                this.brandOptions = response.data.data.map((item) => {
                    return { value: item.typeId, label: item.typeName }
                });
            }).catch(() => {
                this.brandOptions = [];
            })
        },
        getList() {
            this.listLoading = true
            listSupplier(this.listQuery).then(response => {
                this.list = response.data.data.items
                this.total = response.data.data.total
                this.listLoading = false
            }).catch(() => { })
        },

        handleQuery() {
            this.listQuery.page = 1
            this.getList()
        },
        /** 重置按钮操作 */
        resetQuery() {
            this.listQuery = {
                page: 1,
                limit: 10,
                supplierName: '',
                supplierNum: '',
                typeId: '',
                responsibleDept: '',
                isEnable: '',
            };
            this.handleQuery();
        },
        handleSizeChange(val) {
            this.listQuery.limit = val
            this.getList()
        },
        handleCurrentChange(val) {
            this.listQuery.page = val
            this.getList()
        },
    }
}
</script>
<style>
.good-img {
    width: 50px;
    height: 50px;
}

.input-with-select .el-input-group__prepend {
    background-color: #fff;
}
</style>