/**
 * @description 串号组件（用于串号的录入、选择及查看）
 */
Vue.component('component-serial', {
    template: `
        <el-dialog :title="title" id="component-serial" :close-on-click-modal="false" append-to-body :visible.sync="dialogVisible" @closed="dialogClose">
            <div class="insert" v-if="dialogType == 'insert'">
                <el-form :inline="true" :model="form" :rules="rules" ref="insert" @submit.native.prevent>
                    <el-form-item prop="mainSerial">
                        <el-input size="small" placeholder="请输入主串码 (必填)" v-model="form.mainSerial">
                        </el-input>
                    </el-form-item>
                    <el-form-item prop="assistSerial1">
                        <el-input size="small" placeholder="请输入辅助串码1 (非必填)" v-model="form.assistSerial1">
                        </el-input>
                    </el-form-item>
                    <el-form-item prop="assistSerial2">
                        <el-input size="small" placeholder="请输入辅助串码2 (非必填)" v-model="form.assistSerial2">
                        </el-input>
                    </el-form-item>
                    <el-form-item>
                        <el-button type="primary" size="small" @click="insert">录入</el-button>
                    </el-form-item>
                </el-form>
            </div>
            <div class="search" v-if="dialogType != 'insert' && getDataType">
                <el-form :inline="true" :model="form" :rules="rules" @submit.native.prevent>
                    <el-form-item prop="searchSerial">
                        <el-input size="small" placeholder="请输入串码" clearable @clear="search" v-model="form.searchSerial">
                        </el-input>
                    </el-form-item>
                    <el-form-item>
                        <el-button type="primary" size="small" @click="search">{{this.getDataType == 'storeAllowSalesSerial' ? '添加' : '搜索'}}</el-button>
                    </el-form-item>
                </el-form>
            </div>
            <el-table :data="tableData" border style="width: 100%" row-key="id" ref="table" @selection-change="selectionChange">
                <el-table-column
                    type="selection"
                    width="60"
                    :reserve-selection="true"
                    v-if="dialogType == 'multiple'"
                >
                </el-table-column>
                <el-table-column label="序号" width="60">
                    <template slot-scope="scope">
                        <span>{{scope.$index + 1}}</span>
                    </template>
                </el-table-column>
                <el-table-column label="主串码" align="left">
                    <template slot-scope="scope">
                        <span v-if="scope.row.edit != true">{{scope.row.mainSerial}}</span>
                        <el-input v-else size="small" @input="mainSerialValidate(scope.$index)" :class="{error: !scope.row.mainSerialValidate}" placeholder="请输入主串码 (必填)" v-model="scope.row.editMainSerial"></el-input>
                    </template>
                </el-table-column>
                <el-table-column align="left" label="辅助串码1">
                    <template slot-scope="scope">
                        <span v-if="scope.row.edit != true">{{scope.row.assistSerial1}}</span>
                        <el-input v-else size="small" @input="serialValidate(scope.$index, 1)" :class="{error: !scope.row.assistSerial1Validate}" placeholder="请输入辅助串码1 (非必填)" v-model="scope.row.editAssistSerial1"></el-input>
                    </template>
                </el-table-column>
                <el-table-column align="left" label="辅助串码2">
                    <template slot-scope="scope">
                        <span v-if="scope.row.edit != true">{{scope.row.assistSerial2}}</span>
                        <el-input v-else size="small" @input="serialValidate(scope.$index, 2)" :class="{error: !scope.row.assistSerial2Validate}" placeholder="请输入辅助串码2 (非必填)" v-model="scope.row.editAssistSerial2"></el-input>
                    </template>
                </el-table-column>
                <el-table-column label="操作" v-if="['single', 'insert'].includes(dialogType)" width="90">
                    <template slot-scope="scope">
                        <template v-if="dialogType == 'insert'">
                            <template v-if="scope.row.editStatus != 1">
                                <el-button type="text" size="mini" v-if="scope.row.edit != true" @click="$set(tableData[scope.$index], 'edit', true)">编辑</el-button>
                                <template v-else>
                                    <el-button type="text" size="mini" @click="finish(scope.$index)">完成</el-button>
                                    <el-button type="text" size="mini" @click="cancel(scope.$index)">取消</el-button>
                                </template>
                                <el-button type="text" size="mini" v-if="scope.row.edit != true && scope.row.editStatus != 2" @click="deleteData(scope.$index)">删除</el-button>
                            </template>
                            <span v-else class="not-allowed">不可操作</span>
                        </template>
                        <el-button type="text" size="mini" v-if="dialogType == 'single'" @click="select(scope.row)">选择</el-button>
                    </template>
                </el-table-column>
            </el-table>
            <el-pagination
                background
                layout="prev, pager, next"
                :page-size="limit"
                :current-page="page"
                :total="total"
                :hide-on-single-page="true"
                @current-change="currentChange">
            </el-pagination>
            <span slot="footer" v-if="['insert', 'multiple'].includes(dialogType)">
                <el-button @click="dialogVisible = false">取消</el-button>
                <el-button type="primary" @click="dialogConfirm">确定</el-button>
            </span>
            <span slot="footer" v-else>
                <el-button @click="dialogVisible = false">关闭</el-button>
            </span>
        </el-dialog>
    `,
    data() {
        return {
            tableData: [],          //当前页的列数据
            totalData: [],          //总数据
            selectionData: [],      //选择的数据集合（仅为多选类型时有效，dialogType为multiple）
            serialList: [],         //临时保存的串号列表（主要用于串号的重复性验证）
            editIds: [],            //已编辑的串号列主键（用于串号编辑时，记录被修改过的串号，需要告知服务端）
            page: 1,                //页数
            limit: 10,              //每页行数
            total: 0,               //数据总数
            dialogVisible: false,   //窗口显示控制
            form: {                 //窗口顶部的数据表单数据集
                mainSerial: '',     //主串号
                assistSerial1: '',  //辅助串号1
                assistSerial2: '',  //辅助串号2
                searchSerial: ''    //搜索的串号
            },
            rules: {                //上述表单对应的数据验证规则
                mainSerial: [
                    {required: true, message: '请输入主串码', trigger: 'change'},
                    {max: 20, message: '最多只能20个字符', trigger: 'change'},
                    {pattern: '[^?!\\s|\u4e00-\u9fa5]+$', message: '只能输入字母、数字及符号', trigger: 'change'}
                ],
                assistSerial1: [
                    {max: 20, message: '最多只能20个字符', trigger: 'change'},
                    {pattern: '[^?!\\s|\u4e00-\u9fa5]+$', message: '只能输入字母、数字及符号', trigger: 'change'}
                ],
                assistSerial2: [
                    {max: 20, message: '最多只能20个字符', trigger: 'change'},
                    {pattern: '[^?!\\s|\u4e00-\u9fa5]+$', message: '只能输入字母、数字及符号', trigger: 'change'}
                ],
                searchSerial: [
                    {max: 20, message: '最多只能20个字符', trigger: 'change'},
                    {pattern: '[^?!\\s|\u4e00-\u9fa5]+$', message: '只能输入字母、数字及符号', trigger: 'change'}
                ]
            },
            requestUrls: {    //当前组件需要用到的服务端接口地址集合
                //商户角色
                serialVerify: 'PurchaseOrder/serialVerify', //采购串号验证
                inventorySerialVerify: 'Inventory/serialVerify', //盘点串号验证
                otherWarehousing: 'WarehousingRecord/serialVerify', //其他入库串号验证
                warehousing: 'WarehousingRecord/serialList', //采购部分入库串号列表
                stockOut: 'StockOutOrder/serialList', //出库单串号列表
                stockOutDetail: 'StockOutOrder/detailSerialList', //出库单详情串号列表
                purchaseRetreat: 'RetreatOrder/serialList', //采购退货可退串号列表
                lossReport: 'LossReport/serialList', //新增报损串号列表
                inventoryStatisticsReport: 'Statistics/serialList', //库存统计报表
                purchaseGoods: 'PurchaseGoods/purchaseSerial', //采购商品串号列表
                purchaseStorageGoods: 'PurchaseGoods/warehouseSerial', //采购编辑与明细入库商品串号列表
                purchaseReturnGoods: 'PurchaseGoods/retreatSerial', //采购编辑与明细退库商品串号列表
                purchaseReturnDetails: 'RetreatOrder/detailSerialList', //采购退货详情串号列表
                replenishment: 'SaleMGoods/purchaseSerialList', //补货可入库的串号列表
                supplyInventory: 'SaleMGoods/serialList', //库存状况中供应库存的串号列表
                inventoryWarehousingRecord: 'SaleMGoods/warehouseSerialList', //库存入库记录串号列表
                inventoryDeliveryRecord: 'SaleMGoods/stockSerialList', //库存出库记录串号列表
                inventoryDetails: 'Inventory/detailsSerial', //盘点详情串号列表
                lossDetails: 'LossReport/detailSerialList', //报损详情串号列表
                returnDetails: 'WarehousingRecord/retreatDetailsSerial', //退货详情串号列表
                storageDetails: 'WarehousingRecord/detailSerialList', //入库详情串号列表
                outboundDetails: 'StockOutOrder/detailSerialList', //出库详情串号列表
                outboundRejectionDetails: 'StockOutOrder/refuseSerial', //出库拒收详情串号列表
                outboundStorageDetails: 'StockOutOrder/warehousingSerial', //出库入库详情串号列表


                //门店角色
                storeSerialVerify: 'SPurchaseOrder/serialVerify', //采购串号验证
                storeInventorySerialVerify: 'SInventory/serialVerify', //盘点串号验证
                storeOtherWarehousing: 'SWarehousingRecord/serialVerify', //其他入库串号验证
                storeWarehousing: 'SWarehousingRecord/serialList', //采购部分入库串号列表
                storeStockOut: 'SStockOutOrder/serialList', //出库单串号列表
                storeStockOutDetail: 'SStockOutOrder/detailSerialList', //出库单详情串号列表
                storePurchaseRetreat: 'SRetreatOrder/serialList', //采购退货可退串号列表
                storeLossReport: 'SLossReport/serialList', //新增报损串号列表
                storeAllowSalesSerial: 'Express/searchSerial', //发货/换货/详情修改串号时可用串号列表
                storeGoodsSalesDetails: 'Sale/sellSerialList', //商品销售明细数量串号列表
                storeGoodsSalesSummary: 'Sale/summaryList', //商品销售汇总串号列表
                storePurchaseGoods: 'SPurchaseGoods/purchaseSerial', //采购商品串号列表
                storePurchaseStorageGoods: 'SPurchaseGoods/warehouseSerial', //采购编辑与明细入库商品串号列表
                storePurchaseReturnGoods: 'SPurchaseGoods/retreatSerial', //采购编辑与明细退库商品串号列表
                storePurchaseReturnDetails: 'SRetreatOrder/detailSerialList', //采购退货详情串号列表
                storeReplenishment: 'SSaleMGoods/purchaseSerialList', //补货可入库的串号列表
                storeSupplyInventory: 'SSaleMGoods/serialList', //库存状况中供应库存的串号列表
                storeInventoryWarehousingRecord: 'SSaleMGoods/warehouseSerialList', //库存入库记录串号列表
                storeInventoryDeliveryRecord: 'SSaleMGoods/stockSerialList', //库存出库记录串号列表
                storeInventoryStatisticsReport: 'ReportTable/serialList', //库存报表
                storeInventoryDetails: 'SInventory/detailsSerial', //盘点详情串号列表
                storeLossDetails: 'SLossReport/detailSerialList', //报损详情串号列表
                storeStorageDetails: 'SWarehousingRecord/detailSerialList', //入库详情串号列表
                storeTransferDetails: 'SWarehousingRecord/allocationSerial', //入库调拨详情串号列表
                storeRejectionDetails: 'StockOutOrder/refuseSerial', //入库拒收详情串号列表
                storeOutboundDetails: 'SStockOutOrder/detailSerialList', //出库详情串号列表
                storeOutboundRejectionDetails: 'SStockOutOrder/refuseSerial', //出库拒收详情串号列表
                storeOutboundStorageDetails: 'SStockOutOrder/warehousingSerial', //出库入库详情串号列表

                //共用
                transferDetailsOutStock: 'StockOutOrder/detailSerialList', //调拨详情出库
                transferDetailsWarehousing: 'SWarehousingRecord/detailSerialList', //调拨详情入库
            }
        }
    },
    methods: {
        /**
         * @description 录入按钮事件
         */
        insert() {
            const refsInsert = this.$refs['insert']
            refsInsert.validate((valid) => {
                if (valid) {
                    /**
                     * 验证重复性
                     * 1、主串号不存在于串号列表中
                     * 2、辅助串号1为空 或者 不存在于串号列表中
                     * 3、辅助串号2为空 或者 不存在于串号列表中
                     * 4、主串号不等于辅助串号1
                     * 5、主串号不等于辅助串号2
                     * 6、辅助串号为空 或者 辅助串号1不等于辅助串号2
                     */
                    if (!this.serialList.includes(this.form.mainSerial) &&
                        (!this.form.assistSerial1 || !this.serialList.includes(this.form.assistSerial1)) &&
                        (!this.form.assistSerial2 || !this.serialList.includes(this.form.assistSerial2)) &&
                        this.form.mainSerial != this.form.assistSerial1 &&
                        this.form.mainSerial != this.form.assistSerial2 &&
                        (!this.form.assistSerial1 || this.form.assistSerial1 != this.form.assistSerial2)
                    ) {
                        this.totalData.push({
                            mainSerial: this.form.mainSerial,
                            assistSerial1: this.form.assistSerial1,
                            assistSerial2: this.form.assistSerial2
                        })
                        this.serialList.push(this.form.mainSerial, this.form.assistSerial1, this.form.assistSerial2)
                        refsInsert.resetFields() //情况录入表单的内容及验证结果
                        this.$message.success('录入成功！');
                    } else {
                        this.$message.error('请勿录入重复的串号！');
                    }
                }
            });
        },
        /**
         * @description 搜索按钮事件
         */
        search() {
            //发货页面的搜索在清空时不触发
            if (this.getDataType == 'storeAllowSalesSerial' && !this.form.searchSerial) {
                return
            }
            this.page = 1
            this._getTableData()
        },
        /**
         * @description 编辑串号时的完成事件
         */
        finish(index) {
            const data = this.tableData[index]
            const currentTotalData = this.totalData[data.totalIndex]
            if (!data.mainSerialValidate) {
                this.$message.error('当前修改的主串码格式有误，请修改！')
                return
            }
            if (!data.assistSerial1Validate) {
                this.$message.error('当前修改的辅助串码1格式有误，请修改！')
                return
            }
            if (!data.assistSerial2Validate) {
                this.$message.error('当前修改的辅助串码2格式有误，请修改！')
                return
            }

            const currentData = [data.mainSerial, data.assistSerial1, data.assistSerial2]

            /**
             * 验证重复性
             * 1、主串号未修改 或者 存在于当前串号列中 或者 不存在于总串号列表中
             * 2、辅助串号1为空 或者 未修改 或者 存在于当前串号列中 或者 不存在于串号列表中
             * 3、辅助串号2为空 或者 未修改 或者 存在于当前串号列中 或者 不存在于串号列表中
             * 4、主串号不等于辅助串号1
             * 5、主串号不等于辅助串号2
             * 6、辅助串号为空 或者 辅助串号1不等于辅助串号2
             */
            if ((data.editMainSerial == currentTotalData.mainSerial || currentData.includes(data.editMainSerial) || !this.serialList.includes(data.editMainSerial)) &&
                (!data.editAssistSerial1 || data.editAssistSerial1 == currentTotalData.assistSerial1 || currentData.includes(data.editAssistSerial1) || !this.serialList.includes(data.editAssistSerial1)) &&
                (!data.editAssistSerial2 || data.editAssistSerial2 == currentTotalData.assistSerial2 || currentData.includes(data.editAssistSerial2) || !this.serialList.includes(data.editAssistSerial2)) &&
                data.editMainSerial != data.editAssistSerial1 &&
                data.editMainSerial != data.editAssistSerial2 &&
                (!data.editAssistSerial1 || data.editAssistSerial1 != data.editAssistSerial2)
            ) {
                const editData = {
                    mainSerial: data.editMainSerial,
                    assistSerial1: data.editAssistSerial1,
                    assistSerial2: data.editAssistSerial2
                }
                //覆盖当前列数据中的指定数据列以及关闭编辑状态
                this.$set(this.tableData, index, Object.assign({}, data, editData, {edit: false}))
                //覆盖总列数据中的指定数据列
                this.$set(this.totalData, data.totalIndex, Object.assign({}, currentTotalData, editData))
                this._replaceSerialList(data.totalIndex, [data.editMainSerial, data.editAssistSerial1, data.editAssistSerial2])
                //如果是已存在于数据库的串号数据，需记录其编辑行为。
                if (data.id) {
                    this.editIds.push(data.id)
                }
                this.$message.success('当前串号编辑完成！')
            } else {
                this.$message.error('串号存在重复，请修改后再尝试完成！')
            }
        },
        /**
         * @description 编辑串号时替换指定下标的串号数据
         * @param {Number} index 当前编辑的串号下标
         * @param {Array}  lists 需要替换的新数据
         * @private
         */
        _replaceSerialList(index, lists) {
            //串号的起始下标（由于所有串号都是以3的倍数录入，所以此处乘以3即为起始下标）
            const startIndex = index * 3
            lists.forEach((list, _index) => {
                this.serialList.splice(startIndex + _index, 1, list)
            })
        },
        /**
         * @description 编辑串号时的取消事件
         */
        cancel(index) {
            const data = this.tableData[index]
            this.$set(this.tableData, index, Object.assign({}, data, {
                editMainSerial: data.mainSerial,
                editAssistSerial1: data.assistSerial1,
                editAssistSerial2: data.assistSerial2,
                edit: false
            }))
        },
        /**
         * @description 单选事件（仅在窗口类型为单选时有效，dialogType为single）
         * @param {Object} data 当前选择的串号列
         */
        select(data) {
            this.$emit('serial-change', data)
        },
        /**
         * @description 删除指定下标的串号数据列（仅在窗口类型为录入时有效，dialogType为insert）
         * @param {Number} index 要删除的数据列下标
         */
        deleteData(index) {
            const totalIndex = this.tableData[index].totalIndex
            this.totalData.splice(totalIndex, 1)      //从总数据中删除
            this.serialList.splice(totalIndex * 3, 3) //从串号列中删除（每组串号一定是3的倍数，所以删除3个。）
        },
        /**
         * @description 用于编辑时主串号的验证
         * @param {Number} index 串号数据列下标
         */
        mainSerialValidate(index) {
            //主串号需要先验证是否为空
            if (!this.tableData[index].editMainSerial) {
                this.tableData[index].mainSerialValidate = false
                return false
            }
            this.serialValidate(index)
        },
        /**
         * 
         * @param {Number} index 串号数据列下标
         * @param {Number} type 需要验证的串号类型（0：主串号，1：辅助串号1，2：辅助串号2）
         */
        serialValidate(index, type = 0) {
            //按照类型获取当前要验证的串号数据
            const serial = type == 0 ? this.tableData[index].editMainSerial : type == 1 ? this.tableData[index].editAssistSerial1 : this.tableData[index].editAssistSerial2
            //验证串号（不为空的情况下，不能大于20位，不能输入除字母及数字以外的字符）
            //由于主串号已经验证不为空后才调用此验证，故无需考虑主串号为空的情况，具体请查看mainSerialValidate方法。
            const res = !serial || serial.length <= 20 && /^[a-zA-Z0-9]+$/.test(serial)

            //按照类型将验证结果赋值
            if (type == 0) {
                this.$set(this.tableData[index], 'mainSerialValidate', res)
            } else if (type == 1) {
                this.$set(this.tableData[index], 'assistSerial1Validate', res)
            } else if (type == 2) {
                this.$set(this.tableData[index], 'assistSerial2Validate', res)
            }
        },
        /**
         * @description 窗口关闭
         */
        dialogClose() {
            //将部分数据初始化，防止窗口复用时出错。
            Object.assign(this._data, {
                tableData: [],
                totalData: [],
                selectionData: [],
                serialList: [],
                editIds: [],
                page: 1,
                total: 0,
                form: {
                    mainSerial: '',
                    assistSerial1: '',
                    assistSerial2: '',
                    searchSerial: ''
                }
            })
            //当窗口为复选框时，清空已选择的数据。
            if (this.dialogType == 'multiple') {
                this.$refs.table.clearSelection();
            }
        },
        /**
         * @description 列表多选变化事件
         * @param {Object} data 当前选择的串号数据列
         * @returns 
         */
        selectionChange(data) {
            if (this.maxSelected > 0 && this.maxSelected < data.length) {
                this.$message.error(`只能选择${this.maxSelected}个串号！`)
                this.$refs.table.toggleRowSelection(data[data.length - 1], false)
                return false
            }
            this.selectionData = data
        },
        /**
         * @description 分页组件切换事件
         * @param {Number} currentPage 当前分页数
         */
        currentChange(currentPage) {
            this.page = currentPage
            if (this.getDataType == 'storeAllowSalesSerial') {
                this.tableData = this.totalData.slice((this.page - 1) * this.limit, this.page * this.limit)
            } else {
                this._getTableData()
            }
        },
        /**
         * @description 获取列表数据
         * @private
         */
        _getTableData() {
            //窗口类型为录入或者存在父组件传递串号数据的情况下，直接导入进列表中。
            if (this.dialogType == 'insert' || (this.data && this.data.length) > 0) {
                let tableData = [].concat(this.totalData).reverse().slice((this.page - 1) * this.limit, this.page * this.limit)
                tableData.forEach((data, index) => {
                    this.$set(tableData, index, Object.assign({}, data, {
                        totalIndex: this.total - 1 - (this.page - 1) * this.limit - index,
                        edit: false,
                        editMainSerial: data.mainSerial,
                        editAssistSerial1: data.assistSerial1,
                        editAssistSerial2: data.assistSerial2,
                        mainSerialValidate: true,
                        assistSerial1Validate: true,
                        assistSerial2Validate: true
                    }))
                })
                this.tableData = tableData
            } else if (this.getDataType) { //存在获取数据的接口类型
                const data = {}

                if ([
                    'warehousing',
                    'storeWarehousing',
                    'stockOutDetail',
                    'storeStockOutDetail',
                    'purchaseRetreat',
                    'storePurchaseRetreat',
                    'storeGoodsSalesDetails',
                    'purchaseGoods',
                    'storePurchaseGoods',
                    'purchaseReturnDetails',
                    'storePurchaseReturnDetails',
                    'replenishment',
                    'storeReplenishment',
                    'inventoryWarehousingRecord',
                    'inventoryDeliveryRecord',
                    'storeInventoryWarehousingRecord',
                    'storeInventoryDeliveryRecord',
                    'inventoryDetails',
                    'storeInventoryDetails',
                    'lossDetails',
                    'storeLossDetails',
                    'returnDetails',
                    'storageDetails',
                    'storeStorageDetails',
                    'storeRejectionDetails',
                    'outboundDetails',
                    'outboundRejectionDetails',
                    'outboundStorageDetails',
                    'storeOutboundDetails',
                    'storeOutboundRejectionDetails'
                ].includes(this.getDataType)) {
                    //只需要主键ID
                    data.id = this.parentData.id
                } else if ([
                    'stockOut',
                    'storeStockOut',
                    'lossReport',
                    'storeLossReport',
                    'storeAllowSalesSerial',
                    'supplyInventory',
                    'storeSupplyInventory',
                    'storeInventoryStatisticsReport',
                    'storeGoodsSalesSummary'
                ].includes(this.getDataType)) {
                    //需要商品ID以及规格ID
                    data.goods_id = this.parentData.goods_id
                    data.sku_id = this.parentData.sku_id || ''
                } else if ([
                    'inventoryStatisticsReport'
                ].includes(this.getDataType)) {
                    //需要商品ID、规格ID、门店ID
                    data.store_id = this.parentData.store_id
                    data.goods_id = this.parentData.goods_id
                    data.sku_id = this.parentData.sku_id || ''
                } else if ([
                    'purchaseStorageGoods',
                    'purchaseReturnGoods',
                    'storePurchaseStorageGoods',
                    'storePurchaseReturnGoods'
                ].includes(this.getDataType)) {
                    //需要订单编号、商品主键、规格主键
                    data.order_number = this.parentData.order_number
                    data.goods_id = this.parentData.goods_id
                    data.sku_id = this.parentData.sku_id || ''
                } else if ([
                    'storeTransferDetails',
                    'storeOutboundStorageDetails'
                ].includes(this.getDataType)) {
                    //需要ID和父页面的公共类型
                    data.id = this.parentData.id
                    data.type = this.parentData.parentType
                } else if ('transferDetailsOutStock' == this.getDataType) {
                    data.id = this.parentData.stock_id
                } else if ('transferDetailsWarehousing' == this.getDataType) {
                    data.id = this.parentData.warehouse_id
                } else {
                    console.error('串号组件数据类型未注册！')
                }

                //发起数据获取请求
                this.sendRequest(this.requestUrls[this.getDataType], {
                    data: Object.assign({
                        serial_number: this.form.searchSerial,
                        page: this.page,
                        limit: this.limit
                    }, data),
                    success: (response) => {
                        if (response.status == 1) {
                            //如果数据处理方式为累加
                            let tableData = []
                            //storeAllowSalesSerial：快递发货页面
                            if (this.getDataType == 'storeAllowSalesSerial') {
                                const responseData = response.data

                                this.form.searchSerial = ''

                                //验证是否已存在于列表中，防止反复搜索同一组串号
                                if (!this.serialList.includes(responseData.main_serial_number)) {
                                    const insertData = {
                                        id: responseData.warehouse_goods_id,
                                        mainSerial: responseData.main_serial_number,
                                        assistSerial1: responseData.auxiliary_serial_number_one,
                                        assistSerial2: responseData.auxiliary_serial_number_two
                                    }

                                    //累加放在前，默认放在后
                                    this.dataProcessMethod == 'increase' ? this.totalData.unshift(insertData) : totalData.push(insertData)

                                    //验证已选是否小于最大数
                                    if (this.selectionData.length < this.maxSelected) {
                                        this.$refs.table.toggleRowSelection(insertData)
                                    }

                                    this.serialList.push(responseData.main_serial_number)
                                } else {
                                    this.$message.error('当前串号已存在，请使用其他串号！')
                                }
                                tableData = this.totalData.slice((this.page - 1) * this.limit, this.page * this.limit)
                                this.total = this.totalData.length
                            } else {
                                const dataList = response.data.list
                                dataList.forEach(data => {
                                    tableData.push({
                                        id: data.id,
                                        mainSerial: data.main_serial_number,
                                        assistSerial1: data.auxiliary_serial_number_one,
                                        assistSerial2: data.auxiliary_serial_number_two
                                    })
                                })
                                this.total = parseInt(response.data.count)
                            }
                            this.tableData = tableData
                        } else {
                            this.$message.error(response.message)
                        }
                    }
                })
            }
        },
        /**
         * @description 弹窗确定事件
         */
        dialogConfirm() {
            if (this.dialogType == 'insert') {
                const serialList = [] //需要验证的串号列表
                this.totalData.forEach(data => {
                    //如果不存在id 或者 存在ID的情况下必须是已经被编辑的。
                    if (!data.id || this.editIds.includes(data.id)) {
                        const list = {
                            main_serial_number: data.mainSerial,
                            auxiliary_serial_number_one: data.assistSerial1,
                            auxiliary_serial_number_two: data.assistSerial2
                        }
                        if (data.id) {
                            list.id = data.id
                        }
                        serialList.push(list)
                    }
                })

                if (serialList.length > 0) {
                    let verifyUrl = ''
                    //根据验证类型赋值验证接口地址
                    switch (this.insertValidate) {
                        case 'purchase':
                            verifyUrl = this.requestUrls.serialVerify
                            break;
                        case 'storePurchase':
                            verifyUrl = this.requestUrls.storeSerialVerify
                            break;
                        case 'inventory':
                            verifyUrl = this.requestUrls.inventorySerialVerify
                            break;
                        case 'storeInventory':
                            verifyUrl = this.requestUrls.storeInventorySerialVerify
                            break;
                        case 'warehousing':
                            verifyUrl = this.requestUrls.otherWarehousing
                            break;
                        case 'storeWarehousing':
                            verifyUrl = this.requestUrls.storeOtherWarehousing
                            break;
                    }

                    //执行验证
                    this.sendRequest(verifyUrl, {
                        data: {
                            goods_id: this.parentData.goods_id,
                            sku_id: this.parentData.sku_id,
                            serial_list: JSON.stringify(serialList)
                        },
                        success: (response) => {
                            if (response.status == 1) {
                                this.$emit('serial-change', this.totalData, this.parentIndex)
                                this.dialogVisible = false
                            } else {
                                this.$message.error(response.message);
                            }
                        }
                    })
                } else {
                    this.$emit('serial-change', this.totalData, this.parentIndex)
                    this.dialogVisible = false
                }
            } else if (this.dialogType == 'multiple') { //如果为窗口类型为多选的情况下
                //验证已选择的是否已经超过了最大选择上限
                if (this.maxSelected > 0 && this.maxSelected != this.selectionData.length) {
                    this.$message.error(`只能选择${this.maxSelected}个串号！`)
                    return false
                }

                this.$emit('serial-change', this.selectionData, this.parentIndex)
                this.dialogVisible = false
            }
        }
    },
    watch: {
        //监听父组件的组件显示控制变量
        visible() {
            this.dialogVisible = this.visible
            //只在显示的时候做操作
            if (this.visible) {
                this.totalData = this.data || [] //如果父组件指定当前组件的数据，则使用。
                if (this.dialogType == 'insert') { //如果为录入或者编辑类型
                    this.totalData.forEach(data => {
                        this.serialList.push(data.mainSerial, data.assistSerial1, data.assistSerial2)
                    })
                } else if (this.dialogType == 'multiple') { //如果为多选类型
                    //不为发货页面的数据类型，因为发货页面的串号数据并不是主动获取的，也不是默认主动勾选的，而是通过搜索获得的。
                    if (this.getDataType != 'storeAllowSalesSerial') {
                        //此处需要使用nextTick，因为需要等待DOM渲染，否则自动勾选会失效，找不到对应需要勾选的数据列。
                        this.$nextTick(() => {
                            //如果父组件传递过来默认需要勾选的数据，则执行默认勾选行为。
                            const selectedSerialList = this.parentData.serial_list
                            if (selectedSerialList) {
                                selectedSerialList.forEach(data => {
                                    this.$refs.table.toggleRowSelection({
                                        id: data.id,
                                        mainSerial: data.main_serial_number,
                                        assistSerial1: data.auxiliary_serial_number_one,
                                        assistSerial2: data.auxiliary_serial_number_two
                                    }, true)
                                })
                            }
                            this._getTableData()
                        })
                    }
                } else if (this.dialogType == 'details') {
                    this._getTableData()
                }
            }
        },
        dialogVisible() {
            this.$emit('update:visible', this.dialogVisible)
        },
        'totalData.length'() {
            if (this.dialogType == 'insert') {
                this.total = this.totalData.length
                this._getTableData()
            }
        }
    },
    computed: {
        /**
         * @description 根据父组件指定的窗口类型来显示窗口的标题
         * @returns {String} 窗口的标题
         */
        title() {
            let titleString = ''
            switch (this.dialogType) {
                case 'insert':
                    titleString = '录入串码'
                    break
                case 'single':
                    titleString = '修改串码'
                    break
                case 'details':
                    titleString = '串码详情'
                    break
                default:
                    titleString = '选择串号'
            }
            return titleString
        }
    },
    created() {
        this.dialogVisible = this.visible
        //由于所有的接口前面都是统一加Retail，故在这里循环接口地址数组，逐一加上前缀地址。
        Object.keys(this.requestUrls).forEach(key => {
            this.requestUrls[key] = 'Retail/' + this.requestUrls[key]
        })
    },
    props: {
        parentIndex: Number,  //父组件对应数据的下标
        parentData: Object,   //父组件对应数据集
        dialogType: {
            type: String,
            default: 'details' //insert（录入或编辑）, single（单选）, multiple（多选），details（详情）
        },
        visible: Boolean,      //父组件的显示控制
        data: {                //父组件传递过来的串号列表，用于部分页面（如录入串号页面或者在列表接口中已返回串号数据的情况）。
            type: Array,
            default: null
        },
        getDataType: String,   //获取串号数据的接口类型（用于区分不同页面的串号数据类型，传递的值一定为requestUrls变量的其中一个）。
        insertValidate: {      //当窗口类型为录入时，需要在点击确定按钮前对串号数据进行服务端验证，父组件来决定验证的接口类型。
            type: String,
            default: 'purchase'
            /**
             * purchase（商户采购）
             * storePurchase（门店采购）
             * inventory（商户盘点）
             * storeInventory（门店盘点）
             * warehousing（其他入库）
             * storeWarehousing（门店其他入库）
             * 
             */
        },
        maxSelected: {        //最大允许选择的数据（仅在窗口为多选类型时有效，dialogType为multiple）
            type: Number,
            default: 0
        },
        dataProcessMethod: {  //数据处理的方式，每次获取数据后，会按照指定的方式对数据进行处理，主要用于搜索类型的选择页面使用。
            type: String,
            default: 'cover' //cover（覆盖），increase（累加）
        }
    }
})