<template>
    <div class="app-container">
        <el-tabs v-model="goodsType" @tab-click="onChangeGoodsType">
            <el-tab-pane v-for="(dict, i) in dict.type.goods_type" :key="i" :label="dict.label" :name="dict.value"></el-tab-pane>
        </el-tabs>
        <el-form :model="queryParams" ref="queryForm" @submit.native.prevent :inline="true" v-show="showSearch" label-width="68px">
            <el-form-item prop="orderNo">
                <el-input v-model="queryParams.orderNo" placeholder="请输入订单编号" clearable @keyup.enter.native="handleQuery" />
            </el-form-item>
            <el-form-item prop="orderStatus">
                <el-select v-model="queryParams.orderStatus" placeholder="请选择支付状态" clearable>
                    <el-option v-for="dict in dict.type.purchase_order_status" :key="dict.value" :label="dict.label" :value="dict.value" />
                </el-select>
            </el-form-item>
            <el-form-item>
                <el-button type="primary" icon="el-icon-search" @click="handleQuery">搜索</el-button>
                <el-button icon="el-icon-refresh" @click="resetQuery">重置</el-button>
            </el-form-item>
        </el-form>

        <el-row :gutter="10" class="mb8">
          <el-col :span="1.5">
            <el-button type="primary" plain icon="el-icon-plus" @click="addOrder(0)" v-hasPermi="['order:purchaseGoods:add']">普通商品批发</el-button>
            <el-button type="primary" plain icon="el-icon-plus" @click="addOrder(1)" v-hasPermi="['order:purchaseGoods:add']">材料商品批发</el-button>
            <el-button type="primary" plain icon="el-icon-plus" @click="addOrder(2)" v-hasPermi="['order:purchaseGoods:add']">生活服务商品批发</el-button>
            <el-button type="primary" plain icon="el-icon-plus" @click="addOrder(3)" v-hasPermi="['order:purchaseGoods:add']">汽车美容商品批发</el-button>
          </el-col>
            <right-toolbar :showSearch.sync="showSearch" @queryTable="getList"></right-toolbar>
        </el-row>

        <Page uri="/mapi/order/purchaseGoods/list" :request-params="queryParams" ref="pagination">
            <!--      <el-table-column type="selection" width="55" align="center" fixed="left"/>-->
            <el-table-column label="订单编号" align="center" prop="orderNo" width="200px" />
            <el-table-column label="进货总价（元）" align="center" prop="costTotalPrice" width="150px" />

            <el-table-column label="下单方式" align="center" prop="payType" width="150px">
                <template slot-scope="scope">
                    <dict-tag :options="dict.type.recharge_pay_type" :value="scope.row.payType" />
                </template>
            </el-table-column>
            <el-table-column label="订单状态" align="center" prop="orderStatus" width="150px">
                <template slot-scope="scope">
                    <dict-tag :options="dict.type.purchase_order_status" :value="scope.row.orderStatus" />
                </template>
            </el-table-column>
            <el-table-column label="下单时间" align="center" prop="createTime" width="150px" />
            <el-table-column label="支付时间" align="center" prop="payTime" width="150px" />
            <el-table-column label="发货时间" align="center" prop="sendTime" width="150px" >
                <template slot-scope="scope">
                    <span>{{ scope.row.sendTime ? scope.row.sendTime : '--' }}</span>
                </template>
                </el-table-column>
            <el-table-column label="收货时间" align="center" prop="finishTime" width="150px" >
                <template slot-scope="scope">
                    <span>{{ scope.row.finishTime ? scope.row.finishTime : '--' }}</span>
                </template>
                </el-table-column>
            <el-table-column label="操作" align="center" class-name="small-padding fixed-width" fixed="right" width="200">
                <template slot-scope="scope">
                    <el-button type="text" icon="el-icon-chat-dot-square" @click="orderDetail(scope.row)">订单详情</el-button>
                    <el-button type="text" icon="el-icon-check" @click="confirmReceive(scope.row)" v-hasPermi="['order:purchaseGoods:edit']" v-if="scope.row.orderStatus == '3' || scope.row.orderStatus == '4'">确认收货</el-button>
                </template>
            </el-table-column>
        </Page>

        <!--新增-->
        <el-dialog :title="title" :visible.sync="open" width="80%" append-to-body>
            <el-card class="purchase-dialog">
                <el-row :gutter="20" class="purchase-container">
                    <!-- 左侧分类选择区域 -->
                    <el-col :span="4" class="category-section">
                        <div class="section-title">{{ titleType }}</div>
                        <div class="category-tree">
                            <el-tree
                                :data="categoryList"
                                :props="defaultProps"
                                :expand-on-click-node="false"
                                node-key="id"
                                default-expand-all
                                highlight-current
                                @node-click="handleNodeClick"
                            />
                        </div>
                    </el-col>

                    <!-- 右侧内容区域 -->
                    <el-col :span="20" class="content-section">
                        <!-- 上半区:已采购商品列表 -->
                        <div class="purchased-section">
                            <div class="section-title">已批发商品</div>
                            <el-table :data="addGoodsList" border stripe>
                                <!-- <el-table-column label="编号" align="center" prop="goodsSkuStoreId" width="100" /> -->
                                <el-table-column label="商品名称" align="center" prop="goodsName" min-width="200" />
                                <el-table-column label="商品规格" align="center" min-width="150">
                                    <template slot-scope="scope">
                                        {{formatSpec(scope.row.specValLists)}}
                                    </template>
                                </el-table-column>
                                <el-table-column label="数量" align="center" width="120">
                                    <template slot-scope="scope">
                                        <el-input
                                            v-if="scope.row.goodsSkuStoreId == vo.goodsSkuStoreId"
                                            v-for="vo in purchaseCountVOList"
                                            :key="vo.goodsSkuStoreId"
                                            v-model="vo.count"
                                            :step="1"
                                            :min="1"
                                            :max="getMaxCount(scope.row)"
                                            @change="countPrice"
                                        />
                                    </template>
                                </el-table-column>
                                <el-table-column label="价格" align="center" prop="purchasePrice" width="100" />
                                <el-table-column label="操作" align="center" width="100" fixed="right">
                                    <template slot-scope="scope">
                                        <el-button type="text" icon="el-icon-delete" @click="deleteGoods(scope.row)">删除</el-button>
                                    </template>
                                </el-table-column>
                            </el-table>
                        </div>

                        <!-- 下半区:商品列表 -->
                        <div class="goods-section">
                            <div class="section-title">商品列表</div>
                            <el-form :inline="true" :model="goodsQueryParams" class="search-form">
                                <el-form-item label="搜索商品">
                                    <el-input
                                        v-model="goodsQueryParams.keywords"
                                        placeholder="请输入商品名称或条码"
                                        clearable
                                        @keyup.enter.native="getGoodsList"
                                    />
                                </el-form-item>
                                <el-form-item>
                                    <el-button type="primary" @click="getGoodsList">搜索</el-button>
                                    <el-button @click="resetGoodsQuery">重置</el-button>
                                </el-form-item>
                            </el-form>
                            <el-table
                                v-loading="loading"
                                :data="goodsList"
                                border
                                stripe
                                highlight-current-row
                            >
                                <!-- <el-table-column label="编号" align="center" prop="goodsSkuStoreId" width="100" /> -->
                                <el-table-column label="商品名称" align="center" prop="goodsName" min-width="200" />
                                <el-table-column label="商品规格" align="center" min-width="150">
                                    <template slot-scope="scope">
                                        {{formatSpec(scope.row.specValLists)}}
                                    </template>
                                </el-table-column>
                                <el-table-column label="批发价格" align="center" prop="purchasePrice" width="100" />
                                <el-table-column label="平台库存" align="center" width="120">
                                    <template slot-scope="scope">
                                        <span :class="{'low-stock': scope.row.hqStock <= 5}">{{ scope.row.hqStock }}</span>
                                    </template>
                                </el-table-column>
                                <el-table-column label="库存" align="center" width="120">
                                    <template slot-scope="scope">
                                        <span :class="{'low-stock': scope.row.stock <= 5}">{{ scope.row.stock }}</span>
                                        <el-tag v-if="scope.row.stock <= 5" size="mini" type="warning">库存不足</el-tag>
                                    </template>
                                </el-table-column>

                                <el-table-column label="操作" align="center" width="100" fixed="right">
                                    <template slot-scope="scope">
                                        <el-button
                                            type="text"
                                            icon="el-icon-plus"
                                            @click="addGoods(scope.row)"
                                        >
                                            添加
                                        </el-button>
                                    </template>
                                </el-table-column>
                            </el-table>
                            <pagination
                                v-show="goodsTotal > 0"
                                :total="goodsTotal"
                                :page.sync="goodsQueryParams.pageNum"
                                :limit.sync="goodsQueryParams.pageSize"
                                @pagination="getGoodsList"
                            />
                        </div>
                    </el-col>
                </el-row>

                <!-- 底部结算区域 -->
                <el-row :gutter="10" class="settlement-section">
                    <el-col :span="3">
                        <el-form label-width="100px" :inline="true" size="small">
                            <el-form-item v-if="goodsType == '1' && userInfoVO.userType != '00'">
                                <el-checkbox v-model="isUserBalance">是否使用余额</el-checkbox>
                            </el-form-item>
                        </el-form>
                    </el-col>
                    <el-col :span="17">
                        <el-form label-width="135px" :inline="true" size="small">
                            <el-form-item label="总件数:" prop="totalClothNum">
                                <span class="price-text">{{ calculateTotalCount }}</span>
                            </el-form-item>
                            <el-form-item label="总金额（元）:" prop="totalPrice">
                                <span class="price-text">{{ calculateTotalPrice }}</span>
                            </el-form-item>
                            <el-form-item label="抵扣金额（元）: " v-if="isUserBalance == true">
                                <span class="price-text">{{ getNowBalance }}</span>
                            </el-form-item>
                            <el-form-item label="还需支付金额（元）: " v-if="isUserBalance == true">
                                <span class="price-text">{{ getNeedPayPrice }}</span>
                            </el-form-item>
                        </el-form>
                    </el-col>
                    <el-col :span="4">
                        <el-button
                            type="primary"
                            icon="el-icon-shopping-cart-2"
                            size="small"
                            @click="submitForm"
                        >
                            提交
                        </el-button>
                    </el-col>
                </el-row>
            </el-card>
        </el-dialog>

        <!--    详情-->
        <el-dialog :title="detailTitle" :visible.sync="openDetail" size="80%" append-to-body>
            <el-card>
                <el-descriptions title="基本信息" v-show="detailView" :column="3" border :label-style="{ 'text-align': 'center' }" :contentStyle="{ 'text-align': 'center' }">
                    <el-descriptions-item label="批发来源" span="3">{{ detailView.orgName ? detailView.orgName : '--' }}</el-descriptions-item>
                    <el-descriptions-item label="订单状态">
                        <dict-tag :options="dict.type.purchase_order_status" :value="detailView.orderStatus" />
                    </el-descriptions-item>
                    <el-descriptions-item label="下单时间">{{ detailView.createTime ? detailView.createTime : '暂无信息' }}</el-descriptions-item>
                    <el-descriptions-item label="支付时间">{{ detailView.payTime ? detailView.payTime : '暂无信息' }}</el-descriptions-item>
                    <el-descriptions-item label="发货时间">{{ detailView.sendTime ? detailView.sendTime : '暂无信息' }}</el-descriptions-item>
                    <el-descriptions-item label="确认收货时间">{{ detailView.finishTime ? detailView.finishTime : '暂无信息' }}</el-descriptions-item>
                    <el-descriptions-item label="订单总价（元）">{{ costTotalPrice ? costTotalPrice : '暂无信息' }}</el-descriptions-item>
                    <el-descriptions-item label="物流公司">{{ detailView.deliveryCompany ? detailView.deliveryCompany : '暂无信息' }}</el-descriptions-item>
                    <el-descriptions-item label="物流单号" span="2">{{ detailView.deliveryNo ? detailView.deliveryNo : '暂无信息' }}</el-descriptions-item>
                    <el-descriptions-item label="收货地址" span="3">{{ detailView.province }}{{ detailView.city }}{{ detailView.area }}{{ detailView.address }}{{ detailView.addressDetail }}</el-descriptions-item>
                    <el-descriptions-item label="备注信息" span="3">{{ detailView.remark ? detailView.remark : '暂无信息' }}</el-descriptions-item>
                </el-descriptions>
            </el-card>
            <div class="head-column2">
                <el-table v-loading="loading" fit highlight-current-row border stripe :data="detailList">
                    <el-table-column :label="goodsType == 0 ? '商品名称' : '材料名称'" align="center" prop="goodsName" width="250px" />
                    <el-table-column :label="goodsType == 0 ? '商品规格' : '材料规格'" align="center" width="250px">
                        <template slot-scope="scope">
                            <div style="text-align: center">{{ scope.row.skuName }}</div>
                        </template>
                    </el-table-column>
                    <el-table-column label="数量" align="center" prop="buyNum" />
                    <el-table-column label="价格（元）" align="center" prop="costPrice" />
                    <el-table-column label="总和（元）" align="center">
                        <template slot-scope="scope">
                            <span>{{ (scope.row.buyNum * 10000 * parseFloat(scope.row.costPrice)) / 10000 }}</span>
                        </template>
                    </el-table-column>
                </el-table>
            </div>
            <el-row :gutter="10" class="box-shadow" style="margin-top: 10px">
                <el-col :span="21">
                    <el-form label-width="130px" style="height: 80px; padding-top: 20px; text-align: right" :inline="true" size="small">
                        <el-form-item label="总金额（元）:">
                            {{ costTotalPrice }}
                        </el-form-item>
                    </el-form>
                </el-col>
            </el-row>
        </el-dialog>
    </div>
</template>

<script>
import { purchaseListSku } from '@/api/core/sku'
import { listCategory } from '@/api/core/category'
import { addPurchaseGoods, getPurchaseGoods, listPurchaseGoods, confirmReceiveGoodsByOrderGoods } from '@/api/order/purchaseGoods'
import { getFactoryInfo } from '@/api/system/factory'
import { getStoreInfo } from '@/api/system/store'
export default {
    name: 'goodsPurchase',
    dicts: ['purchase_order_status', 'recharge_pay_type','goods_type'],
    data() {
        return {
            //
            orderLoading: true,
            // 遮罩层
            loading: false,
            detailLoading: true,
            // 选中数组
            ids: [],
            // 非单个禁用
            single: true,
            // 非多个禁用
            multiple: true,
            // 显示搜索条件
            showSearch: true,
            // 总条数
            total: 0,
            // 弹出层标题
            title: '',
            titleType: '',
            detailTitle: '',
            // 详情数据
            detailView: {},
            // 是否显示弹出层
            open: false,
            openDetail: false,
            // 查询参数
            queryParams: {},
            // 表单参数
            form: {},
            // 表单校验
            rules: {},
            goodsType: null,
            // 商品订单表格数据
            purchaseGoodsList: [],
            // 分类id
            goodsCategoryId: null,
            // 可选商品集合
            goodsList: null,
            // 已选商品集合
            addGoodsList: [],
            // 左侧分类集合
            categoryList: null,
            //
            defaultProps: {
                label: 'categoryName'
            },
            // 自定义一个计算数量的临时对象集合
            purchaseCountVOList: [],
            // 总金额
            totalPrice: 0,
            // 总件数
            totalCount: 0,
            // 当前余额
            getNowBalance: 0,
            // 提交的参数对象
            submitGoodsOrderVO: {},
            // 详情数据
            detailList: [],
            // 详情总金额
            costTotalPrice: null,
            userInfoVO: null,
            isUserBalance: false,
            orgName: '',
            stockWarningThreshold: 5, // 库存预警阈值
            // 商品列表分页参数
            goodsQueryParams: {
                pageNum: 1,
                pageSize: 10,
                categoryId: null,
                keywords: undefined
            },
            // 商品总数
            goodsTotal: 0,
        }
    },
    created() {
        this.handleUser()
        this.goodsType = this.getUrlParam('goodsType')
        this.getList()
    },
    computed: {
        calculateTotalCount() {
            this.totalCount = 0
            this.addGoodsList.forEach((vo) => {
                let number = Number(this.purchaseCountVOList.find((item) => item.goodsSkuStoreId == vo.goodsSkuStoreId).count);
                this.totalCount = this.totalCount + number;
            })
            return this.totalCount
        },

        calculateTotalPrice() {
            this.totalPrice = 0
            this.addGoodsList.forEach((vo) => {
                let number = this.purchaseCountVOList.find((item) => item.goodsSkuStoreId == vo.goodsSkuStoreId).count
                this.totalPrice = this.totalPrice + number * vo.purchasePrice
            })
            return this.totalPrice
        },
        getNowBalanceValue() {
            return this.getNowBalance
        },
        getNeedPayPrice() {
            // 当订单金额 = 余额
            if (this.totalPrice == this.getNowBalance) {
                return 0
            }
            // 当订单金额 大于 余额
            if (this.totalPrice > this.getNowBalance) {
                return (parseFloat(this.totalPrice) * 10000 - parseFloat(this.getNowBalance) * 10000) / 10000
            }
            // 当订单金额 小于等于 余额
            return (parseFloat(this.getNowBalance) * 10000 - parseFloat(this.totalPrice) * 10000) / 10000
        },
        lowStockItems() {
            return this.goodsList.filter(item => item.stock <= this.stockWarningThreshold);
        }
    },
    methods: {
        onChangeGoodsType() {
            this.queryParams.goodsType = this.goodsType
            this.handleQuery()
        },
        handleUser() {
            this.userInfoVO = this.getUserInfo()
            if (this.userInfoVO.userType == '00') {
                this.orgName = '总部'
            }
            if (this.userInfoVO.userType == '01') {
                this.orgName = '工厂名称'
            }
            if (this.userInfoVO.userType == '02') {
                this.orgName = '门店名称'
            }
        },
                    // 格式化规格信息
    formatSpec(specList) {
      if (!specList || !specList.length) return '默认规格';
      return specList.join(' ');
    },
        getCategoryList() {
            listCategory({ ...this.queryParams, ...{ goodsType: this.goodsType } }).then((response2) => {
                this.categoryList = response2.rows
            })
        },
        deleteGoods(row) {
            this.addGoodsList = this.addGoodsList.filter((item) => {
                return item.goodsSkuStoreId !== row.goodsSkuStoreId
            })
            this.purchaseCountVOList = this.purchaseCountVOList.filter((item) => {
                return item.goodsSkuStoreId !== row.goodsSkuStoreId
            })
        },
        addGoods(row) {
            // 非总部进货
            if (this.userInfoVO.userType != '00') {
                // 如果已添加集合数量大于0，需要判断当前添加的是否在已添加集合中
                if (this.addGoodsList.length > 0) {
                    let match = this.addGoodsList.findIndex(item => item.goodsSkuStoreId == row.goodsSkuStoreId);
                    if (match !== -1) {
                        let purchaseVo = this.purchaseCountVOList.find(item => item.goodsSkuStoreId == row.goodsSkuStoreId);
                        if (purchaseVo.count >= row.hqStock) {
                            this.$message.warning('数量已超出库存限制');
                            return;
                        }
                        purchaseVo.count++;
                        this.$forceUpdate();
                        return;
                    }
                }

                // 不在已添加集合中，直接加入集合中
                this.addGoodsList.push(row);
                this.purchaseCountVOList.push({
                    'goodsSkuStoreId': row.goodsSkuStoreId,
                    'goodsCategoryId': this.goodsCategoryId,
                    'skuName': this.formatSpec(row.specValLists),
                    'count': 1
                });
                this.$forceUpdate();
            } else {
                // 总部进货逻辑保持不变
                if (this.addGoodsList.length > 0) {
                    let match = this.addGoodsList.findIndex(item => item.goodsSkuStoreId == row.goodsSkuStoreId);
                    if (match !== -1) {
                        this.purchaseCountVOList.find(item => item.goodsSkuStoreId == row.goodsSkuStoreId).count++;
                        this.$forceUpdate();
                        return;
                    }
                }

                this.addGoodsList.push(row);
                this.purchaseCountVOList.push({
                    'goodsSkuStoreId': row.goodsSkuStoreId,
                    'goodsCategoryId': this.goodsCategoryId,
                  'skuName': this.formatSpec(row.specValLists),
                    'count': 1
                });
                this.$forceUpdate();
            }
        },
        getMaxCount(row) {
            if (this.userInfoVO.userType != '00') {
                return row.stock
            } else {
                return 99999
            }
        },
        countPrice() {
            this.totalPrice = 0
            this.totalCount = 0
            this.addGoodsList.forEach((vo) => {
                let number = this.purchaseCountVOList.find((item) => item.goodsSkuStoreId == vo.goodsSkuStoreId).count
                this.totalPrice = this.totalPrice + number * vo.purchasePrice
                this.totalCount = this.totalCount + number
            })
        },
        // 节点单击事件
        handleNodeClick(data) {
            this.goodsCategoryId = data.id
            this.getGoodsList()
        },
        getList() {
            this.queryParams.goodsType = this.goodsType
            this.$nextTick(() => {
                this.$refs.pagination.handleSearch(true)
            })
        },
        getGoodsList() {
            this.loading = true
            if (this.goodsCategoryId == null) {
                this.goodsList = []
                this.goodsTotal = 0
                this.loading = false
                return
            }
            this.goodsQueryParams.categoryId = this.goodsCategoryId
            purchaseListSku(this.goodsQueryParams).then((response) => {
                this.goodsList = response.rows
                this.goodsTotal = response.total
                this.loading = false
            })
        },
        addOrder(type) {
            this.open = true
            this.isUserBalance = false
            this.getBalance()
            this.goodsType = type
            this.title = this.goodsType == '0' ? '商品批发' : '商品批发'
            this.titleType = this.goodsType == '0' ? '商品分类' : '商品分类'
            this.purchaseCountVOList = []
            this.addGoodsList = []
            this.addGoodsList = []
            this.goodsList = []
            this.getCategoryList()
        },
        getBalance() {
            if (this.userInfoVO.userType == '01') {
                getFactoryInfo().then((response) => {
                    this.getNowBalance = response.data.balance
                })
            }
            if (this.userInfoVO.userType == '02') {
                getStoreInfo().then((response) => {
                    this.getNowBalance = response.data.balance
                })
            }
        },
        // 取消按钮
        cancel() {
            this.open = false
            this.reset()
        },
        // 多选框选中数据
        handleSelectionChange(selection) {
            this.ids = selection.map((item) => item.id)
            this.single = selection.length !== 1
            this.multiple = !selection.length
        },
        /** 搜索按钮操作 */
        handleQuery() {
            this.queryParams.pageNum = 1
            this.getList()
        },
        /** 重置按钮操作 */
        resetQuery() {
            this.resetForm('queryForm')
            this.handleQuery()
        },
        orderDetail(row) {
            this.openDetail = true
            this.detailTitle = '订单商品详情'
            this.detailLoading = true
            this.detailList = []
            this.detailView = {}
            const id = row.id
            getPurchaseGoods(id).then((response) => {
                this.detailView = response.data
                this.detailList = response.data.orderPurchaseGoodsVOList
                this.costTotalPrice = this.detailList[0].costTotalPrice
                this.detailLoading = false
            })
        },
        confirmReceive(row) {
            this.$confirm('是否确认收货？')
                .then(() => {
                    confirmReceiveGoodsByOrderGoods(row.id).then((response2) => {
                        this.$message.success('操作成功')
                        this.getList()
                    })
                })
                .catch(() => {})
        },
        checkClose(done) {
            this.$confirm('是否关闭表单，关闭后数据将丢失？')
                .then(function () {
                    done()
                })
                .then(() => {})
                .catch(() => {})
        },
        submitForm() {
            this.$confirm('是否确认下单？').then(() => {
                if (this.totalCount == 0) {
                    this.$message.error('商品数量为空，无法操作提交');
                    return;
                }

                // 检查库存
                for (let item of this.addGoodsList) {
                    let purchaseVo = this.purchaseCountVOList.find(pur => pur.goodsSkuStoreId === item.goodsSkuStoreId);
                    if (purchaseVo.count > item.hqStock) {
                        console.log("purchaseVo",purchaseVo);
                        console.log("item",item);
                        this.$message.error(`商品 ${item.goodsName} 数量超出库存限制`);
                        return;
                    }
                }

                this.submitGoodsOrderVO = {
                    costTotalPrice: this.totalPrice,
                    goodsType: this.goodsType,
                    purchaseGoodsVOList: [],
                    isUserBalance: this.userInfoVO.userType != '00' && this.isUserBalance
                };

                // 构建商品列表
                this.addGoodsList.forEach(vo => {
                    let purchaseVO = this.purchaseCountVOList.find(item => item.goodsSkuStoreId == vo.goodsSkuStoreId);
                    let purchaseGoodsVO = {
                        skuId: vo.id,
                        goodsId: vo.goodsId,
                        goodsName: vo.goodsName,
                        goodsCategoryId: purchaseVO.goodsCategoryId,
                        costPrice: vo.purchasePrice,
                        buyNum: purchaseVO.count,
                        skuName: purchaseVO.skuName
                    };
                    this.submitGoodsOrderVO.purchaseGoodsVOList.push(purchaseGoodsVO);
                });

                // 提交订单
                addPurchaseGoods(this.submitGoodsOrderVO).then(response => {
                    this.$modal.msgSuccess('提交成功');
                    this.open = false;
                    this.getList();
                }).catch(error => {
                    this.$modal.msgError(error.message || '提交失败');
                });
            }).catch(() => {});
        },
        resetGoodsQuery() {
            this.goodsQueryParams.keywords = undefined;
            this.getGoodsList();
        }
    }
}
</script>
<style lang="scss" scoped>
.purchase-dialog {
  .purchase-container {
    // min-height: 600px;
  }

  .category-section {
    border-right: 1px solid #EBEEF5;
    height: 100%;

    .section-title {
      font-size: 16px;
      font-weight: bold;
      margin-bottom: 15px;
      padding: 0 10px;
    }

    .category-tree {
      height: calc(100% - 40px);
      overflow-y: auto;
    }
  }

  .content-section {
    display: flex;
    flex-direction: column;
    gap: 20px;
  }

  .section-title {
    font-size: 16px;
    font-weight: bold;
    margin-bottom: 15px;
  }

  .purchased-section,
  .goods-section {
    background: #fff;
    border-radius: 4px;
    padding: 15px;
  }

  .search-form {
    margin-bottom: 15px;
  }

  .settlement-section {
    margin-top: 20px;
    padding-top: 20px;
    border-top: 1px solid #EBEEF5;
  }

  .price-text {
    color: #ff4949;
    font-weight: bold;
  }

  .low-stock {
    color: #e6a23c;
    font-weight: bold;
  }

  .el-table {
    th {
      background-color: #f5f7fa;
      color: #606266;
      font-weight: 500;
    }

    td {
      padding: 8px 0;
    }
  }

  .el-button--text {
    padding: 0 5px;

    &:hover {
      color: #409EFF;
    }

    &.is-disabled {
      color: #c0c4cc;
      cursor: not-allowed;

      &:hover {
        color: #c0c4cc;
      }
    }
  }

  .el-tag {
    margin-left: 5px;
    vertical-align: middle;
  }
}
</style>
