yoe-opm-web/src/views/product/poolLink/index.vue

<template>
  <div class="p-2">
    <!-- 返回按钮 -->
    <div class="mb-4 flex items-center">
      <el-button link icon="ArrowLeft" @click="goBack">返回</el-button>
      <span class="ml-2 text-lg font-bold">商品配置</span>
    </div>

    <!-- 搜索区域 -->
    <transition :enter-active-class="proxy?.animate.searchAnimate.enter" :leave-active-class="proxy?.animate.searchAnimate.leave">
      <div v-show="showSearch" class="mb-[10px]">
        <el-card shadow="hover">
          <el-form ref="queryFormRef" :model="queryParams" label-width="90px">
            <el-row :gutter="20">
              <el-col :span="6">
                <el-form-item label="商品编号" prop="productNo">
                  <el-input v-model="queryParams.productNo" placeholder="请输入商品编号" clearable @keyup.enter="handleQuery" />
                </el-form-item>
              </el-col>
              <el-col :span="6">
                <el-form-item label="商品名称" prop="itemName">
                  <el-input v-model="queryParams.itemName" placeholder="请输入商品名称" clearable @keyup.enter="handleQuery" />
                </el-form-item>
              </el-col>
              <el-col :span="6">
                <el-form-item label="商品品牌" prop="brandId">
                  <el-input v-model="queryParams.brandId" placeholder="请选择" clearable />
                </el-form-item>
              </el-col>
              <el-col :span="6">
                <el-form-item label="上下架状态" prop="productStatus">
                  <el-select v-model="queryParams.productStatus" placeholder="请选择" clearable>
                    <el-option label="上架" value="1" />
                    <el-option label="下架" value="0" />
                  </el-select>
                </el-form-item>
              </el-col>
            </el-row>
            <el-row :gutter="20">
              <el-col :span="6">
                <el-form-item label="商品类别" prop="categoryId">
                  <el-tree-select
                    v-model="queryParams.categoryId"
                    :data="categoryOptions"
                    :props="{ value: 'id', label: 'label', children: 'children' }"
                    check-strictly
                    :render-after-expand="false"
                    clearable
                    placeholder="请选择商品类别"
                  >
                    <template #default="{ data }">
                      <span>{{ getCategoryFullPath(data.id) }}</span>
                    </template>
                  </el-tree-select>
                </el-form-item>
              </el-col>
              <el-col :span="6">
                <el-form-item label="创建供应商" prop="supplier">
                  <el-input v-model="queryParams.supplier" placeholder="请选择创建供应商" clearable />
                </el-form-item>
              </el-col>
              <el-col :span="6">
                <el-form-item label="入池时间" prop="dateRange">
                  <el-date-picker
                    v-model="queryParams.dateRange"
                    type="daterange"
                    range-separator="至"
                    start-placeholder="开始时间"
                    end-placeholder="结束时间"
                    style="width: 100%"
                  />
                </el-form-item>
              </el-col>
              <el-col :span="6" class="text-left">
                <el-button type="primary" icon="Search" @click="handleQuery">搜索</el-button>
                <el-button icon="Refresh" @click="resetQuery">重置</el-button>
              </el-col>
            </el-row>
          </el-form>
        </el-card>
      </div>
    </transition>

    <el-card shadow="never">
      <template #header>
        <div class="flex justify-between items-center">
          <span class="font-bold">商品列表信息列表</span>
          <div class="flex gap-2">
            <el-button type="primary" icon="Plus" @click="handleAddProduct">添加商品</el-button>
          </div>
        </div>
      </template>

      <el-table v-loading="loading" border :data="productList">
        <el-table-column type="index" label="序号" width="60" align="center" />
        <el-table-column label="商品编号" align="center" prop="productNo" width="120" />
        <el-table-column label="商品图片" align="center" prop="productImageUrl" width="100">
          <template #default="scope">
            <image-preview :src="scope.row.productImageUrl" :width="60" :height="60"/>
          </template>
        </el-table-column>
        <el-table-column label="商品信息" align="center" min-width="200">
          <template #default="scope">
            <div class="text-left" style="font-size: 12px;">
              <div>{{ scope.row.itemName }}</div>
              <div class="text-gray-500">品牌：{{ scope.row.brandName || '-' }}</div>
              <div class="text-gray-500">库存：{{ scope.row.stock || '999' }}</div>
            </div>
          </template>
        </el-table-column>
        <el-table-column label="商品类别" align="center" width="150">
          <template #default="scope">
            <div class="text-left" style="font-size: 12px;">
              <div>{{ scope.row.categoryName || '办公设备+扫描设备+平板式扫描仪' }}</div>
            </div>
          </template>
        </el-table-column>
        <el-table-column label="单位" align="center" prop="unitName" width="80" />
        <el-table-column label="SKU价格" align="center" width="150">
          <template #default="scope">
            <div class="text-left" style="font-size: 12px;">
              <div>
                <span class="text-gray-500">市场价:</span>
                <span class="text-red-500">¥{{ scope.row.marketPrice || '0.00' }}</span>
              </div>
              <div>
                <span class="text-gray-500">平台售价:</span>
                <span class="text-red-500">¥{{ scope.row.platformPrice || '0.00' }}</span>
              </div>
              <div>
                <span class="text-gray-500">最低售价:</span>
                <span class="text-red-500">¥{{ scope.row.minPrice || '0.00' }}</span>
              </div>
            </div>
          </template>
        </el-table-column>
        <el-table-column label="成本数据" align="center" width="150">
          <template #default="scope">
            <div class="text-left" style="font-size: 12px;">
              <div>
                <span class="text-gray-500">采购价:</span>
                <span>¥{{ scope.row.purchasePrice || '0.00' }}</span>
              </div>
              <div>
                <span class="text-gray-500">暂估毛利率:</span>
                <span>{{ scope.row.grossMargin || '0.00' }}%</span>
              </div>
            </div>
          </template>
        </el-table-column>
        <el-table-column label="项目平台价" align="center" prop="platformPrice" width="100" />
        <el-table-column label="商品状态" align="center" width="80">
          <template #default="scope">
            <el-tag v-if="scope.row.productStatus === '1'" type="success">上架</el-tag>
            <el-tag v-else type="warning">下架</el-tag>
          </template>
        </el-table-column>
        <el-table-column label="入池时间" align="center" prop="createTime" width="120" />
        <el-table-column label="创建供应商" align="center" prop="supplier" width="100" />
        <el-table-column label="操作" align="center" width="120" fixed="right">
          <template #default="scope">
            <div class="flex flex-col gap-1">
              <el-link type="primary" :underline="false" @click="handlePriceMaintain(scope.row)">价格维护</el-link>
              <el-link type="primary" :underline="false" @click="handleInventoryMaintain(scope.row)">修改库存</el-link>
              <el-link type="danger" :underline="false" @click="handleRemoveProduct(scope.row)">移除商品池</el-link>
            </div>
          </template>
        </el-table-column>
      </el-table>

      <pagination v-show="total > 0" :total="total" v-model:page="queryParams.pageNum" v-model:limit="queryParams.pageSize" @pagination="getList" />
    </el-card>

    <!-- 价格维护对话框 -->
    <el-dialog title="价格维护" v-model="priceDialog.visible" width="500px" append-to-body>
      <el-form ref="priceFormRef" :model="priceDialog.form" :rules="priceRules" label-width="100px">
        <el-form-item label="商品名称">
          <span>{{ priceDialog.row?.itemName }}</span>
        </el-form-item>
        <el-form-item label="市场价" prop="marketPrice">
          <el-input-number v-model="priceDialog.form.marketPrice" :precision="2" :min="0" controls-position="right" style="width: 100%" />
        </el-form-item>
        <el-form-item label="平台售价" prop="platformPrice">
          <el-input-number v-model="priceDialog.form.platformPrice" :precision="2" :min="0" controls-position="right" style="width: 100%" />
        </el-form-item>
        <el-form-item label="最低售价" prop="minPrice">
          <el-input-number v-model="priceDialog.form.minPrice" :precision="2" :min="0" controls-position="right" style="width: 100%" />
        </el-form-item>
        <el-form-item label="产品价格" prop="productPrice">
          <el-input-number v-model="priceDialog.form.productPrice" :precision="2" :min="0" controls-position="right" style="width: 100%" />
        </el-form-item>
      </el-form>
      <template #footer>
        <el-button @click="priceDialog.visible = false">取 消</el-button>
        <el-button type="primary" @click="submitPriceForm">确 定</el-button>
      </template>
    </el-dialog>

    <!-- 修改库存对话框 -->
    <el-dialog title="修改库存" v-model="stockDialog.visible" width="500px" append-to-body>
      <el-form ref="stockFormRef" :model="stockDialog.form" :rules="stockRules" label-width="100px">
        <el-form-item label="商品名称">
          <span>{{ stockDialog.row?.itemName }}</span>
        </el-form-item>
        <el-form-item label="当前库存">
          <span>{{ stockDialog.row?.stock || 0 }}</span>
        </el-form-item>
        <el-form-item label="库存数量" prop="stock">
          <el-input-number v-model="stockDialog.form.stock" :min="0" :precision="0" controls-position="right" style="width: 100%" />
        </el-form-item>
      </el-form>
      <template #footer>
        <el-button @click="stockDialog.visible = false">取 消</el-button>
        <el-button type="primary" @click="submitStockForm">确 定</el-button>
      </template>
    </el-dialog>

    <!-- 添加商品对话框 -->
    <el-dialog title="添加商品" v-model="addProductDialog.visible" width="1400px" append-to-body top="5vh">
      <div class="add-product-dialog">
        <!-- 搜索区域 -->
        <el-form :model="addProductQuery" :inline="true" class="mb-4">
          <el-form-item>
            <el-button type="primary" icon="Plus" @click="handleBatchAdd">加入清单</el-button>
          </el-form-item>
          <el-form-item label="商品名称:">
            <el-input v-model="addProductQuery.itemName" placeholder="商品名称" clearable style="width: 200px" />
          </el-form-item>
          <el-form-item label="商品编号:">
            <el-input v-model="addProductQuery.productNo" placeholder="商品编号" clearable style="width: 200px" />
          </el-form-item>
          <el-form-item>
            <el-button type="primary" icon="Search" @click="handleSearchProducts">搜索</el-button>
          </el-form-item>
        </el-form>

        <!-- 商品列表 -->
        <el-table
          ref="addProductTableRef"
          v-loading="addProductDialog.loading"
          :data="addProductDialog.productList"
          border
          @selection-change="handleSelectionChange"
          max-height="500"
        >
          <el-table-column type="selection" width="55" align="center" />
          <el-table-column label="商品编号" align="center" prop="productNo" width="120" />
          <el-table-column label="商品图片" align="center" prop="productImageUrl" width="100">
            <template #default="scope">
              <image-preview :src="scope.row.productImageUrl" :width="60" :height="60"/>
            </template>
          </el-table-column>
          <el-table-column label="商品信息" align="center" min-width="200">
            <template #default="scope">
              <div class="text-left" style="font-size: 12px;">
                <div>{{ scope.row.itemName }}</div>
                <div class="text-gray-500">品牌：{{ scope.row.brandName || '雅唐' }}</div>
              </div>
            </template>
          </el-table-column>
          <el-table-column label="商品分类" align="center" width="150">
            <template #default="scope">
              <div class="text-left" style="font-size: 12px;">
                <div>{{ getCategoryName(scope.row) }}</div>
              </div>
            </template>
          </el-table-column>
          <el-table-column label="单位" align="center" width="100">
            <template #default="scope">
              <div class="text-left" style="font-size: 12px;">
                <div>单位：{{ scope.row.unitName || '件' }}</div>
                <div>起订量：{{ scope.row.minOrderQuantity || 1 }}</div>
              </div>
            </template>
          </el-table-column>
          <el-table-column label="SKU价格" align="center" width="150">
            <template #default="scope">
              <div class="text-left" style="font-size: 12px;">
                <div>
                  <span class="text-gray-500">市场价:</span>
                  <span>¥{{ scope.row.midRangePrice || '0.00' }}</span>
                </div>
                <div>
                  <span class="text-gray-500">平台价:</span>
                  <span class="text-red-500">¥{{ scope.row.standardPrice || '0.00' }}</span>
                </div>
                <div>
                  <span class="text-gray-500">最低价:</span>
                  <span>¥{{ scope.row.certificatePrice || '0.00' }}</span>
                </div>
              </div>
            </template>
          </el-table-column>
          <el-table-column label="库存情况" align="center" width="150">
            <template #default="scope">
              <div class="text-left" style="font-size: 12px;">
                <div class="text-red-500">库存总数：{{ scope.row.stock || 0 }}</div>
                <div>现有库存：{{ scope.row.availableStock || 0 }}</div>
                <div>虚拟库存：{{ scope.row.virtualStock || 0 }}</div>
                <div class="text-orange-500">[现有库存不足时]</div>
              </div>
            </template>
          </el-table-column>
          <el-table-column label="供应情况" align="center" width="150">
            <template #default="scope">
              <div class="text-left" style="font-size: 12px;">
                <div>供应商数量：{{ scope.row.supplierCount || 0 }}</div>
              </div>
            </template>
          </el-table-column>
          <el-table-column label="协议价" align="center" prop="agreementPrice" width="100" />
          <el-table-column label="操作" align="center" width="100" fixed="right">
            <template #default="scope">
              <el-link type="primary" :underline="false" @click="handleAddSingleProduct(scope.row)">加入清单</el-link>
            </template>
          </el-table-column>
        </el-table>

        <!-- 游标分页控制 -->
        <pagination
          v-show="addProductDialog.productList.length > 0"
          v-model:page="addProductQuery.pageNum"
          v-model:limit="addProductQuery.pageSize"
          v-model:way="addProductQuery.way"
          :cursor-mode="true"
          :has-more="addProductHasMore"
          @pagination="getProductList"
        />
      </div>
    </el-dialog>
  </div>
</template>

<script setup name="PoolLink" lang="ts">
import { useRouter, useRoute } from 'vue-router';
import { categoryTree, listBase } from '@/api/pmsProduct/base';
import { BaseVO, BaseQuery } from '@/api/pmsProduct/base/types';
import { listPoolLink, batchAddProducts, BatchAddProductData, editPrice, editStock, delPoolLink, PoolLinkForm } from '@/api/pmsProduct/poolLink';
import { PoolLinkQuery, PoolLinkVO } from '@/api/pmsProduct/poolLink/types';

const { proxy } = getCurrentInstance() as ComponentInternalInstance;
const router = useRouter();
const route = useRoute();

const productList = ref<PoolLinkVO[]>([]);
const loading = ref(false);
const showSearch = ref(true);
const total = ref(0);

const queryFormRef = ref<ElFormInstance>();

const queryParams = ref({
  pageNum: 1,
  pageSize: 10,
  poolId: (route.params.id || route.query.poolId) as string | number,
  productNo: undefined,
  itemName: undefined,
  brandId: undefined,
  productStatus: undefined,
  categoryId: undefined,
  supplier: undefined,
  dateRange: undefined,
});

const categoryOptions = ref<any[]>([]);
const categoryMap = ref<Map<string | number, any>>(new Map());

// 添加商品对话框
const addProductDialog = reactive({
  visible: false,
  loading: false,
  productList: [] as BaseVO[],
  total: 0,
});

// 游标分页相关变量
const addProductHasMore = ref(true); // 是否还有更多数据
const addProductPageHistory = ref<Array<{ firstId: string | number; lastId: string | number }>>([]);

// 添加商品查询参数
const addProductQuery = ref<BaseQuery>({
  pageNum: 1,
  pageSize: 10,
  way: undefined,
  productNo: undefined,
  itemName: undefined,
  lastSeenId: undefined, // 游标分页的lastSeenId
});

// 选中的商品
const selectedProducts = ref<BaseVO[]>([]);
const addProductTableRef = ref<any>();

/** 获取分类树 */
const getCategoryTree = async () => {
  try {
    const res = await categoryTree();
    categoryOptions.value = res.data || [];
    // 构建分类映射
    buildCategoryMap(categoryOptions.value);
  } catch (error) {
    console.error('获取分类树失败:', error);
  }
};

/** 构建分类映射 */
const buildCategoryMap = (categories: any[], parentPath = '') => {
  categories.forEach(category => {
    const fullPath = parentPath ? `${parentPath} > ${category.label}` : category.label;
    categoryMap.value.set(category.id, { ...category, fullPath });
    if (category.children && category.children.length > 0) {
      buildCategoryMap(category.children, fullPath);
    }
  });
};

/** 获取分类完整路径 */
const getCategoryFullPath = (categoryId: string | number): string => {
  const category = categoryMap.value.get(categoryId);
  return category?.fullPath || '';
};

/** 查询商品列表 */
const getList = async () => {
  loading.value = true;
  try {
    const query: PoolLinkQuery = {
      pageNum: queryParams.value.pageNum,
      pageSize: queryParams.value.pageSize,
      poolId: queryParams.value.poolId as string | number,
      productNo: queryParams.value.productNo,
      itemName: queryParams.value.itemName,
      brandId: queryParams.value.brandId,
      categoryId: queryParams.value.categoryId,
      productStatus: queryParams.value.productStatus,
      supplier: queryParams.value.supplier
    };

    // 处理日期范围
    if (queryParams.value.dateRange && queryParams.value.dateRange.length === 2) {
      query.params = {
        beginCreateTime: queryParams.value.dateRange[0],
        endCreateTime: queryParams.value.dateRange[1]
      };
    }

    const res = await listPoolLink(query);
    productList.value = res.rows || [];
    total.value = res.total || 0;
  } catch (error) {
    console.error('获取商品列表失败:', error);
    productList.value = [];
    total.value = 0;
  } finally {
    loading.value = false;
  }
}

/** 返回 */
const goBack = () => {
  router.back();
}

/** 搜索 */
const handleQuery = () => {
  queryParams.value.pageNum = 1;
  getList();
}

/** 重置 */
const resetQuery = () => {
  queryFormRef.value?.resetFields();
  handleQuery();
}

/** 清空产品池 */
const handleClearPool = async () => {
  await proxy?.$modal.confirm('确认要清空该产品池的所有商品吗？');
  // TODO: 调用清空API
  proxy?.$modal.msgSuccess('清空成功');
  await getList();
}

/** 添加商品 */
const handleAddProduct = () => {
  addProductDialog.visible = true;
  // 重置查询条件
  addProductQuery.value = {
    pageNum: 1,
    pageSize: 10,
    way: undefined,
    productNo: undefined,
    itemName: undefined,
    lastSeenId: undefined,
  };
  // 重置游标分页状态
  addProductPageHistory.value = [];
  addProductHasMore.value = true;
  selectedProducts.value = [];
  getProductList();
};

/** 获取商品列表 */
const getProductList = async () => {
  addProductDialog.loading = true;
  try {
    const params = { ...addProductQuery.value };
    const currentPageNum = addProductQuery.value.pageNum;

    // 第一页不需要游标参数
    if (currentPageNum === 1) {
      delete params.lastSeenId;
      delete params.firstSeenId;
      delete params.way;
    } else {
      // way参数：0=上一页，1=下一页
      if (addProductQuery.value.way === 0) {
        // 上一页：使用目标页的firstId
        const nextPageHistory = addProductPageHistory.value[currentPageNum];
        if (nextPageHistory) {
          params.firstSeenId = nextPageHistory.firstId;
          params.way = 0;
        }
      } else {
        // 下一页：使用前一页的lastId作为lastSeenId
        const prevPageHistory = addProductPageHistory.value[currentPageNum - 1];
        if (prevPageHistory) {
          params.lastSeenId = prevPageHistory.lastId;
          params.way = 1;
        }
      }
    }

    const res = await listBase(params);
    // 兼容两种返回结构
    if (res.rows) {
      addProductDialog.productList = res.rows;
      addProductDialog.total = res.total || 0;
    } else if (res.data) {
      addProductDialog.productList = Array.isArray(res.data) ? res.data : [];
      addProductDialog.total = addProductDialog.productList.length;
    } else {
      addProductDialog.productList = [];
      addProductDialog.total = 0;
    }

    // 判断是否还有更多数据
    addProductHasMore.value = addProductDialog.productList.length === addProductQuery.value.pageSize;

    // 记录当前页的第一个id和最后一个id
    if (addProductDialog.productList.length > 0) {
      const firstItem = addProductDialog.productList[0];
      const lastItem = addProductDialog.productList[addProductDialog.productList.length - 1];
      // 如果长度小于currentPageNum则创建
      if (addProductPageHistory.value.length <= currentPageNum) {
        addProductPageHistory.value[currentPageNum] = {
          firstId: firstItem.id,
          lastId: lastItem.id
        };
      }
    }
  } catch (error) {
    console.error('获取商品列表失败:', error);
    addProductDialog.productList = [];
    addProductDialog.total = 0;
  } finally {
    addProductDialog.loading = false;
  }
};

/** 搜索商品 */
const handleSearchProducts = () => {
  addProductQuery.value.pageNum = 1;
  addProductQuery.value.lastSeenId = undefined;
  addProductPageHistory.value = []; // 重置页面历史
  addProductHasMore.value = true;
  getProductList();
};

/** 选择变化 */
const handleSelectionChange = (selection: BaseVO[]) => {
  selectedProducts.value = selection;
};

/** 批量加入清单 */
const handleBatchAdd = async () => {
  if (selectedProducts.value.length === 0) {
    proxy?.$modal.msgWarning('请先选择要添加的商品');
    return;
  }

  try {
    // 构造批量添加的数据
    const batchData: BatchAddProductData = {
      poolId: queryParams.value.poolId,
      products: selectedProducts.value.map(product => ({
        productId: product.id,
        agreementPrice: product.standardPrice || product.midRangePrice // 使用平台价或市场价作为协议价
      }))
    };

    await batchAddProducts(batchData);
    proxy?.$modal.msgSuccess(`成功添加 ${selectedProducts.value.length} 个商品到商品池`);
    addProductDialog.visible = false;
    // 清空选中项
    selectedProducts.value = [];
    if (addProductTableRef.value) {
      addProductTableRef.value.clearSelection();
    }
    await getList();
  } catch (error) {
    console.error('添加商品失败:', error);
  }
};

/** 添加单个商品 */
const handleAddSingleProduct = async (row: BaseVO) => {
  try {
    // 构造单个商品添加的数据
    const batchData: BatchAddProductData = {
      poolId: queryParams.value.poolId,
      products: [{
        productId: row.id,
        agreementPrice: row.standardPrice || row.midRangePrice // 使用平台价或市场价作为协议价
      }]
    };

    await batchAddProducts(batchData);
    proxy?.$modal.msgSuccess('添加成功');
    // 不关闭对话框，允许继续添加
    await getList();
  } catch (error) {
    console.error('添加商品失败:', error);
  }
};

/** 获取分类名称 */
const getCategoryName = (row: BaseVO): string => {
  // 优先使用完整路径
  if (row.bottomCategoryId) {
    return getCategoryFullPath(row.bottomCategoryId);
  }
  return '-';
};

/** 导出商品 */
const handleExportProduct = () => {
  // TODO: 导出功能
  proxy?.$modal.msg('导出商品功能');
}

/** 导入商品 */
const handleImportProduct = () => {
  // TODO: 导入功能
  proxy?.$modal.msg('导入商品功能');
}

// ========== 价格维护相关 ==========
const priceDialog = reactive({
  visible: false,
  row: null as PoolLinkVO | null,
  form: {
    marketPrice: 0,
    platformPrice: 0,
    minPrice: 0,
    productPrice: 0
  }
});
const priceFormRef = ref<ElFormInstance>();
const priceRules = reactive({
  productPrice: [{ required: true, message: '请输入产品价格', trigger: 'blur' }]
});

/** 价格维护 */
const handlePriceMaintain = (row: PoolLinkVO) => {
  priceDialog.row = row;
  priceDialog.form = {
    marketPrice: row.marketPrice || 0,
    platformPrice: row.platformPrice || 0,
    minPrice: row.minPrice || 0,
    productPrice: row.productPrice || 0
  };
  priceDialog.visible = true;
};

/** 提交价格表单 */
const submitPriceForm = async () => {
  await priceFormRef.value?.validate();
  const data: PoolLinkForm = {
    id: priceDialog.row?.id,
    productPrice: priceDialog.form.productPrice
  };
  await editPrice(data);
  proxy?.$modal.msgSuccess('价格修改成功');
  priceDialog.visible = false;
  await getList();
};

// ========== 库存维护相关 ==========
const stockDialog = reactive({
  visible: false,
  row: null as PoolLinkVO | null,
  form: {
    stock: 0
  }
});
const stockFormRef = ref<ElFormInstance>();
const stockRules = reactive({
  stock: [{ required: true, message: '请输入库存数量', trigger: 'blur' }]
});

/** 修改库存 */
const handleInventoryMaintain = (row: PoolLinkVO) => {
  stockDialog.row = row;
  stockDialog.form = {
    stock: row.stock || 0
  };
  stockDialog.visible = true;
};

/** 提交库存表单 */
const submitStockForm = async () => {
  await stockFormRef.value?.validate();
  const data: PoolLinkForm = {
    id: stockDialog.row?.id,
    stock: stockDialog.form.stock
  };
  await editStock(data);
  proxy?.$modal.msgSuccess('库存修改成功');
  stockDialog.visible = false;
  await getList();
};

/** 移除商品池 */
const handleRemoveProduct = async (row: PoolLinkVO) => {
  await proxy?.$modal.confirm('确认要移除该商品吗？');
  await delPoolLink(row.id);
  proxy?.$modal.msgSuccess('移除成功');
  await getList();
}

onMounted(() => {
  getCategoryTree();
  getList();
});
</script>

<style scoped lang="scss">
.add-product-dialog {
  :deep(.el-form--inline .el-form-item) {
    margin-right: 10px;
  }
}
</style>