feat: 选择产品添加产品大类选择

gongchunyi

10 小时以前 d57994cbc653a15548f61e4696905eb01ce4fdb9

 src/views/basicData/product/ProductSelectDialog.vue

@@ -2,11 +2,17 @@
  <el-dialog v-model="visible" title="选择产品" width="900px" destroy-on-close :close-on-click-modal="false">
    <el-form :inline="true" :model="query" class="mb-2">
      <el-form-item label="产品大类">
        <el-input v-model="query.productName" placeholder="输入产品大类" clearable @keyup.enter="onSearch" />
        <el-select v-model="query.topProductParentId" placeholder="选择产品大类" clearable @change="onSearch" style="width: 150px">
          <el-option v-for="item in categoryList" :key="item.id" :label="item.label || item.productName" :value="item.id" />
        </el-select>
      </el-form-item>

      <el-form-item label="型号名称">
        <el-input v-model="query.model" placeholder="输入型号名称" clearable @keyup.enter="onSearch" />
      <el-form-item label="产品名称">
        <el-input v-model="query.productName" placeholder="输入产品名称" clearable @keyup.enter="onSearch" style="width: 150px" />
      </el-form-item>

      <el-form-item label="产品型号">
        <el-input v-model="query.model" placeholder="输入产品型号" clearable @keyup.enter="onSearch" style="width: 150px" />
      </el-form-item>

      <el-form-item>
@@ -20,9 +26,10 @@
      @selection-change="handleSelectionChange" @select="handleSelect">
      <el-table-column type="selection" width="55" />
      <el-table-column type="index" label="序号" width="60" />
      <el-table-column prop="productName" label="产品大类" min-width="160" />
      <el-table-column prop="model" label="型号名称" min-width="200" />
      <el-table-column prop="unit" label="单位" min-width="160" />
      <el-table-column prop="topProductName" label="产品大类" min-width="120" />
      <el-table-column prop="productName" label="产品名称" min-width="140" />
      <el-table-column prop="model" label="产品型号" min-width="180" />
      <el-table-column prop="unit" label="单位" min-width="100" />
    </el-table>

    <div class="mt-3 flex justify-end">
@@ -43,7 +50,8 @@
<script setup lang="ts">
import { computed, onMounted, reactive, ref, watch, nextTick } from "vue";
import { ElMessage } from "element-plus";
import { productModelList } from '@/api/basicData/productModel'
import { productModelList, productModelListByUrl } from '@/api/basicData/productModel'
import { productTreeList } from '@/api/basicData/product'

export type ProductRow = {
  id: number;
@@ -56,6 +64,7 @@
  modelValue: boolean;
  single?: boolean; // 是否只能选择一个，默认false（可选择多个）
  topProductParentId?: number; // 一级产品id
  requestUrl?: string; // 自定义查询接口
}>();

const emit = defineEmits(['update:modelValue', 'confirm']);
@@ -68,7 +77,19 @@
const query = reactive({
  productName: "",
  model: "",
  topProductParentId: undefined as number | undefined,
});

const categoryList = ref<any[]>([]);

async function loadCategory() {
  try {
    const res = await productTreeList();
    categoryList.value = res || [];
  } catch (e) {
    console.error("Failed to load product categories", e);
  }
}

const page = reactive({
  pageNum: 1,
@@ -130,6 +151,7 @@
function onReset() {
  query.productName = "";
  query.model = "";
  query.topProductParentId = props.topProductParentId;
  page.pageNum = 1;
  loadData();
}
@@ -155,15 +177,19 @@
  loading.value = true;
  try {
    multipleSelection.value = []; // 翻页/搜索后清空选择更符合预期
    const res: any = await productModelList({
    const params = {
      productName: query.productName.trim(),
      model: query.model.trim(),
      current: page.pageNum,
      size: page.pageSize,
      topProductParentId: props.topProductParentId,
    });
    tableData.value = res.records;
    total.value = res.total;
      topProductParentId: query.topProductParentId ?? props.topProductParentId,
    };
    const res: any = props.requestUrl
      ? await productModelListByUrl(props.requestUrl, params)
      : await productModelList(params);
    const records = res?.records || res?.data?.records || res?.data || [];
    tableData.value = Array.isArray(records) ? records : [];
    total.value = Number(res?.total ?? res?.data?.total ?? tableData.value.length);
  } finally {
    loading.value = false;
  }
@@ -173,10 +199,13 @@
watch(() => props.modelValue, (visible) => {
  if (visible) {
    multipleSelection.value = [];
    query.topProductParentId = props.topProductParentId;
  }
});

onMounted(() => {
  loadData()
  query.topProductParentId = props.topProductParentId;
  loadCategory();
  loadData();
})
</script>