1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
| <template>
| <div class="app-container">
| <PIMTable
| rowKey="id"
| :column="tableColumn"
| :tableData="tableData"
| :page="page"
| :isSelection="true"
| @selection-change="handleSelectionChange"
| :tableLoading="tableLoading"
| @pagination="pagination"
| >
| <template #detail="{row}">
| <el-button
| type="primary"
| text
| @click="() =>{
| currentRowId = row.id;
| showEdit = true;
| }"
| >{{ row.productName }}
| </el-button>
| </template>
| </PIMTable>
| <StructureEdit v-if="showEdit" v-model:show-model="showEdit" :product-model-id="currentRowId"/>
| </div>
| </template>
|
| <script setup>
| import {ref} from "vue";
| import {productModelList} from "@/api/basicData/productModel.js";
|
| const StructureEdit = defineAsyncComponent(() => import('@/views/productionManagement/productStructure/StructureEdit.vue'))
|
| const tableColumn = ref([
| {
| label: "产品名称",
| prop: "productName",
| dataType: 'slot',
| slot: "detail"
| },
| {
| label: "规格型号",
| prop: "model",
| },
| {
| label: "单位",
| prop: "unit",
| }
| ]);
| const tableData = ref([]);
| const tableLoading = ref(false);
| const showEdit = ref(false);
| const selectedRows = ref([]);
| const currentRowId = ref(0);
| const page = reactive({
| current: 1,
| size: 10,
| total: 0,
| });
| const data = reactive({
| form: {
| productName: "",
| },
| rules: {
| productName: [{required: true, message: "请输入", trigger: "blur"}],
| },
| modelForm: {
| otherModel: '',
| model: "",
| unit: "",
| speculativeTradingName: [],
| },
| });
| const {form, rules} = toRefs(data);
| // 表格选择数据
| const handleSelectionChange = (selection) => {
| selectedRows.value = selection;
| };
|
| // 查询规格型号
| const pagination = (obj) => {
| page.current = obj.page;
| page.size = obj.limit;
| getModelList();
| };
| const getModelList = () => {
| tableLoading.value = true;
| productModelList({
| current: page.current,
| size: page.size,
| }).then((res) => {
| tableData.value = res.records;
| page.total = res.total;
| tableLoading.value = false;
| });
| };
| onMounted(() => {
| getModelList();
| })
| </script>
|
|
