第二模块完成

src/views/purchase/processing/orderProcessing.vue

@@ -30,7 +30,8 @@
                                 </a-button>
                             </template>
                         </a-descriptions-item>
-                        <a-descriptions-item label="采购详情" v-if="item.supplierSelection == null">
+                        <a-descriptions-item label="采购详情(未整理)"
+                            v-if="item.supplierSelection == null || item.supplierSelection == ''">
                             <div v-for="(item2, index2) in item.procurementContent" :key="index2.toString()">
                                 <a-row>
                                     <a-col :span="2">{{ item2.name }}</a-col>
@@ -40,7 +41,30 @@
                             <a-button style="float: right;" type="primary" @click="arrangeOpen(item)">物品和供应商整理</a-button>
                         </a-descriptions-item>
                         <a-descriptions-item label="采购详情" v-else>
-                            123
+
+                            <a-card style="margin-top: 20px;margin-right: 20px;"
+                                v-for="(item2, index2) in item.supplierSelection" :key="index2.toString()">
+                                <template #title>
+                                    {{ item2.supplier }}
+                                </template>
+                                <div v-for="(item3, index3) in item2.goods" :key="index3.toString()">
+                                    <a-row :gutter="16" style="margin-top: 5px;">
+                                        <a-col :span="8">
+                                            <a-input v-model="item3.name" placeholder="物品名称" disabled />
+                                        </a-col>
+                                        <a-col :span="6">
+                                            <a-input v-model="item3.number" placeholder="数量" disabled />
+                                        </a-col>
+                                        <a-col :span="6">
+                                            <a-input v-model="item3.unit" placeholder="单位" disabled />
+                                        </a-col>
+                                    </a-row>
+                                </div>
+                            </a-card>
+
+                            <a-button style="margin-top: 10px;float: right;" type="primary"
+                                @click="arrangeOpen(item)">物品和供应商整理</a-button>
+
                         </a-descriptions-item>
                     </a-descriptions>
                 </div>
@@ -55,27 +79,63 @@
         </a-empty>
 
         <a-modal title="采购整理" :visible="arrange" @ok="arrangeOk" @cancel="arrangeCancel">
-            <!-- {{ arrangeData }}
-            {{ supplierList }} -->
             <div v-if="classifyData.length == 0">
-                暂未数据分类
+                暂无数据
             </div>
             <div v-else>
-                <div class="card-container">
+                <div>
-                    <a-card style="margin-top: 20px;margin-right: 20px;" v-for="(item, index) in classifyData" :key="index.toString()">
+                    <a-card style="margin-top: 20px;margin-right: 20px;" v-for="(item, index) in classifyData"
+                        :key="index.toString()">
                         <template #title>
                             {{ item.supplier }}
+                            <a-button style="float: right;" type="primary" @click="delSupplier(item)">删除公司</a-button>
                         </template>
-                        <div v-for="(item2, index2) in item.goods" :key="index2.toString()">
+                        <div style="margin-bottom: 20px;">
-                            {{ item2.name }}
+                            <a-select v-model:value="selectedFoods" mode="multiple" style="width: 60%"
+                                placeholder="Please select">
+                                <a-select-option v-for="food in classFood" :key="food.name" :value="food.name">
+                                    {{ food.name }}
+                                </a-select-option>
+                            </a-select>
+
+                            <a-button style="float: right;" @click="importFoods(index)">导入</a-button>
+                            <br>
                         </div>
+                        <div v-for="(item2, index2) in item.goods" :key="index2.toString()">
+                            <a-row :gutter="16" style="margin-top: 5px;">
+                                <a-col :span="8">
+                                    <a-input v-model="item2.name" placeholder="物品名称" />
+                                </a-col>
+                                <a-col :span="6">
+                                    <a-input v-model="item2.number" placeholder="数量" />
+                                </a-col>
+                                <a-col :span="6">
+                                    <a-input v-model="item2.unit" placeholder="单位" />
+                                </a-col>
+                                <a-col :span="2">
+                                    <!-- 通过点击按钮触发新增行 -->
+                                    <a-icon type="plus-circle" @click="addRow(item2, index)" />
+                                </a-col>
+                                <a-col :span="2">
+                                    <!-- 通过点击按钮触发删除行 -->
+                                    <a-icon type="minus-circle" @click="removeRow(index, index2)" />
+                                </a-col>
+                            </a-row>
+                        </div>
+
                     </a-card>
                 </div>
             </div>
-            <a-button type="primary" style="margin-top: 20px;" @click="addSupplier">添加供应商</a-button>
+            <div>
+                <a-select mode="default" v-model="selectedSuppliers" style="width: 160px;">
+                    <a-select-option v-for="supplier in classSupplier" :key="supplier.id" :value="supplier.id">
+                        {{ supplier.name }}
+                    </a-select-option>
+                </a-select>
+                <a-button type="primary" style="margin-top: 20px;margin-left: 20px;" @click="addSupplier()">添加供应商</a-button>
+            </div>
         </a-modal>
 
-
     </a-card>
 </template>
 
@@ -92,6 +152,7 @@ export default {
                 getPurchaseSupplier: "Try/purchaseSupplier/list",
                 getdata: "/Try/purchaseOrderConfirmation/joinList",
                 receiveNOurl: "/Try/purchaseOrderConfirmation/cancelReceiving",
+                editUrl: '/Try/purchaseOrderConfirmation/edit'
             },
             activeKey: [],
             username: Vue.ls.get(USER_INFO).username,
@@ -100,8 +161,13 @@ export default {
             tableData: [],
             dataShow: false,
             arrange: false,
-            arrangeData: [],
+
             classifyData: [],
+            classSupplier: [],
+            selectedSuppliers: '',
+            classFood: [],
+            selectedFoods: [],
+            poenNmber: '',
         }
     },
     computed: {
@@ -114,6 +180,9 @@ export default {
         receiveNOurl: function () {
             return `${window._CONFIG['domianURL']}/${this.url.receiveNOurl}`;
         },
+        editUrl: function () {
+            return `${window._CONFIG['domianURL']}/${this.url.editUrl}`;
+        },
     },
     created() {
         this.getSupplierData();
@@ -135,15 +204,22 @@ export default {
             getAction(this.getdata).then(res => {
                 //如果为200，则获取数据
                 if (res.code == 200) {
-                    this.tableData = res.result;
+                    this.tableData = res.result.records;
                     //判断数据是否为空
                     if (this.tableData.length == 0) {
                         this.dataShow = false;
                     } else {
-                        this.activeKey = [0];
+                        this.activeKey = [''];
+                        //将采购详情转化为对象
                         this.tableData.forEach(item => {
                             item.procurementContent = JSON.parse(item.procurementContent);
                         });
+                        //将supplierSelection转化为对象
+                        this.tableData.forEach(item => {
+                            if (item.supplierSelection != null && item.supplierSelection != '') {
+                                item.supplierSelection = JSON.parse(item.supplierSelection);
+                            }
+                        });
                         this.dataShow = true;
                     }
                 } else {
@@ -155,6 +231,7 @@ export default {
             //深拷贝一份item
             let newItem = Object.assign({}, item);
             newItem.procurementContent = JSON.stringify(newItem.procurementContent);
+            newItem.supplierSelection = JSON.stringify(newItem.supplierSelection);
             postAction(this.receiveNOurl, newItem).then(res => {
                 //如果为200，则获取数据
                 if (res.code == 200) {
@@ -197,47 +274,166 @@ export default {
         generateOrder(item) {
             this.$message.success('生成订单成功');
         },
-        arrangeOpen(item) {
+        //整理弹窗的确认提交
-            this.classifyData = [];
-            this.arrangeData = Object.assign({}, item);
-            this.arrange = true;
-        },
         arrangeOk() {
+            this.classifyData.forEach((item, index) => {
+                //遍历item中的goods
+                item.goods.forEach((item2, index2) => {
+                    //如果有一项为空，则删除这一项             
+                    let flag1 = item2.name == null || item2.name == '' || item2.name == undefined;
+                    let flag2 = item2.number == null || item2.number == '' || item2.number == undefined;
+                    let flag3 = item2.unit == null || item2.unit == '' || item2.unit == undefined;
+                    if (flag1 && flag2 && flag3) {
+                        item.goods.splice(index2, 1);
+                    }
+                });
+            });
+
+            let data = {
+                associationNumber: this.poenNmber,
+                supplierSelection: JSON.stringify(this.classifyData),
+            }
+            if (data.supplierSelection == '[]') {
+                data.supplierSelection = '';
+            }
+            postAction(this.editUrl, data).then(res => {
+                if (res.code == 200) {
                     this.$message.success('整理成功');
                     this.arrange = false;
+                    this.getTableData();
+                    //将相关数据清空
+                    this.classifyData = [];
+                    this.classSupplier = [];
+                    this.classFood = [];
+                    this.selectedSuppliers = '';
+                    this.selectedFoods = [];
+                    this.poenNmber = '';
+                } else {
+                    this.$message.error(res.message);
+                }
+            })
         },
+        //取消整理
         arrangeCancel() {
-            this.$message.success('整理取消');
             this.arrange = false;
+            //将相关数据清空
+            this.classifyData = [];
+            this.classSupplier = [];
+            this.classFood = [];
+            this.selectedSuppliers = '';
+            this.selectedFoods = [];
+            this.poenNmber = '';
+        },
+        //打开整理弹窗,整理弹窗的数据初始化
+        arrangeOpen(item) {
+            //获取供应商数据
+            this.classifyData = [];
+            this.classSupplier = [];
+            this.supplierList.forEach(item => {
+                this.classSupplier.push({
+                    id: item.id,
+                    name: item.name,
+                });
+            });
+            this.classSupplier = Object.assign([], this.classSupplier);
+            //获取物品数据
+            this.classFood = Object.assign([], item.procurementContent);
+            this.poenNmber = item.requirementNumber;
+            //判断supplierSelection是否为空或者null
+            if (item.supplierSelection == null || item.supplierSelection == '') {
+                this.arrange = true;
+            }
+            else {
+                //将其转化为对象
+                let newData = JSON.parse(JSON.stringify(item.supplierSelection))
+                //将被选择的供应商从classSupplier中删除
+                newData.forEach(item => {
+                    this.classSupplier.forEach((item2, index2) => {
+                        if (item2.id == item.supplierID) {
+                            this.classSupplier.splice(index2, 1);
+                        }
+                    });
+                });
+                //将其添加到classifyData中
+                this.classifyData = JSON.parse(JSON.stringify(newData))
+                this.arrange = true;
+            }
+        },
+        //以下为整理的相关操作
+        delSupplier(item) {
+            //搜索ID将这一行从classifyData中删除
+            this.classifyData.forEach((item2, index2) => {
+                if (item2.supplierID == item.supplierID) {
+                    this.classifyData.splice(index2, 1);
+                }
+            });
+            //将其添加到classSupplier中
+            this.classSupplier.push({
+                id: item.supplierID,
+                name: item.supplier,
+            });
         },
         addSupplier() {
-            //在classifyData添加一个空对象公司
+            //如果选中的供应商为空，则不添加
+            if (this.selectedSuppliers == '') {
+                this.$message.warning('请选择供应商');
+                return;
+            }
+            let selectedID = this.selectedSuppliers;
+            let selectedSupplier = {};
+            this.classSupplier.forEach((item, index) => {
+                if (item.id == selectedID) {
+                    selectedSupplier = Object.assign({}, item);
+                    this.classSupplier.splice(index, 1);
+                }
+            });
             this.classifyData.push({
-                supplier: "哈哈公司",
+                supplierID: selectedSupplier.id,
+                supplier: selectedSupplier.name,
                 goods: [{
-                    name: "哈哈",
+                    name: '',
-                    number: "1",
+                    number: '',
-                    unit: "个",
+                    unit: '',
-                }, {
-                    name: "哈哈",
-                    number: "1",
-                    unit: "个",
                 }
                 ],
             });
+            //将选中制空
+            this.selectedSuppliers = '';
+        },
+        addRow(item, index) {
+            this.classifyData[index].goods.push({
+                name: '',
+                number: '',
+                unit: '',
+            });
+        },
+        removeRow(index1, index2) {
+            this.classifyData[index1].goods.splice(index2, 1);
+        },
+        importFoods(index) {
+            let selectedFoods = this.selectedFoods;
+            let selectedGoods = [];
+            this.classFood.forEach(item => {
+                selectedFoods.forEach(item2 => {
+                    if (item.name == item2) {
+                        selectedGoods.push(item);
                     }
+                });
+            });
+            //push而不是赋值，因为要保留原来的数据
+            selectedGoods.forEach(item => {
+                this.classifyData[index].goods.push({
+                    name: item.name,
+                    number: item.number,
+                    unit: item.unit,
+                });
+            });
+            this.selectedFoods = [];
+        },
     },
 }
 
 </script>
-<style>
+<style></style>
-.card-container {
-    display: flex;
-    flex-wrap: nowrap;
-    overflow-x: auto;
-}
-
-/* 其他样式 */
-</style>
 
 

src/views/purchase/receiving/PurchaseOrderConfirmationList.vue

@@ -118,7 +118,7 @@ export default {
           if (this.dataList.length == 0) {
             this.dataShow = false;
           } else {
-            this.activeKey = [0];
+            this.activeKey = [''];
             //将其procurementContent转为json
             this.dataList.forEach(item => {
               item.procurementContent = JSON.parse(item.procurementContent);