查询物料

src/main/java/com/JN/demo/zmquotation/controller/ZMController.java

@@ -1,11 +1,13 @@
 package com.JN.demo.zmquotation.controller;
 
 import com.JN.common.R;
+import com.JN.demo.zmquotation.dto.MaterialDto;
 import com.JN.demo.zmquotation.dto.RegionDto;
 import com.JN.demo.zmquotation.service.RegionService;
 import lombok.experimental.PackagePrivate;
 import lombok.extern.slf4j.Slf4j;
 import org.springframework.beans.factory.annotation.Autowired;
+import org.springframework.data.convert.ReadingConverter;
 import org.springframework.web.bind.annotation.PostMapping;
 import org.springframework.web.bind.annotation.RequestMapping;
 import org.springframework.web.bind.annotation.RequestParam;
@@ -27,6 +29,14 @@ public class ZMController {
     @Autowired
     RegionService regionService;
 
+    /**
+     * @title queryRegionList
+     * @description 查询地区列表信息
+     * @author JIAL
+     * @param: regionName
+     * @updateTime 2024/2/20 16:54
+     * @return: com.JN.common.R<java.util.List<com.JN.demo.zmquotation.dto.RegionDto>>
+     */
     @PostMapping("/regionList")
     public R<List<RegionDto>> queryRegionList(@RequestParam("regionName") String regionName){
 
@@ -36,4 +46,26 @@ public class ZMController {
 
         return R.success(regionList);
     }
+
+    /**
+     * @title queryMaterialList
+     * @description 查询物料信息
+     * @author JIAL
+     * @param: precMaterialName
+     * @param: vagueMaterialName
+     * @param: vagueModel
+     * @updateTime 2024/2/20 16:54
+     * @return: com.JN.common.R<java.util.List<com.JN.demo.zmquotation.dto.MaterialDto>>
+     */
+    @PostMapping("/materialList")
+    public R<List<MaterialDto>> queryMaterialList(@RequestParam("precMaterialName") String precMaterialName,
+                                                  @RequestParam("vagueMaterialName") String vagueMaterialName,
+                                                  @RequestParam("vagueModel") String vagueModel) {
+
+
+
+        return null;
+    }
+
+
 }

src/main/java/com/JN/demo/zmquotation/dto/MaterialDto.java

@@ -0,0 +1,43 @@
+package com.JN.demo.zmquotation.dto;
+
+import lombok.Data;
+
+import java.io.Serializable;
+
+/**
+ * @ClassName MaterialDto
+ * @Description TODO
+ * @Author JIAL
+ * @Date 2024/2/20 16:42
+ * @Version 1.0
+ */
+@Data
+public class MaterialDto implements Serializable {
+    private static final long serialVersionUID = 1L;
+
+    private String materialName;            //物料名称
+
+    private String model;                   //型号
+
+    private String specification;           //规格
+
+    private String voltage;                 //电压
+
+    private String standard;                //标准
+
+    private String core;                    //线芯
+
+    private String costPrice;               //成本价
+
+    private String factoryPrice;            //厂价
+
+    private String netVolume;               //净量
+
+    private String inventory;               //盘具
+
+    private String weighInv;                //盘重
+
+
+
+
+}

src/main/java/com/JN/demo/zmquotation/dto/RegionDto.java

@@ -14,7 +14,7 @@ import java.math.BigDecimal;
  */
 @Data
 public class RegionDto implements Serializable {
-
+    private static final long serialVersionUID = 1L;
 
     private String province;
 

src/main/resources/static/zmquotation/js/index.js

@@ -5,3 +5,11 @@ const queryRegionListByName = (params) => {
         params
     })
 }
+
+const queryMaterialListByParam = (params) => {
+    return $axios({
+        url: '/zmquotation/materialList',
+        method: 'post',
+        params
+    })
+}

src/main/resources/templates/zmquotation/index.html

@@ -313,10 +313,8 @@
         </div>
         <div style="text-align: center; margin-top: 10px;">
             <el-pagination
-                @size-change="handleRegionSizeChange"
                 @current-change="handleRegionCurrentChange"
                 :current-page.sync="regionCurrentPage"
-                :page-sizes="[10, 20, 30, 40]"
                 :page-size="pageSize"
                 :total="regionTableData.length"
             ></el-pagination>
@@ -326,20 +324,20 @@
         <div slot="title" class="regionTable-title" style="margin: 0px">
             <el-form>
                 <el-form-item >
-                    <el-input style="width: 200px; " v-model="regionName" placeholder="开头精确查询">
+                    <el-input style="width: 200px; " v-model="precMaterialName" placeholder="开头物料名称精确查询">
                     </el-input>
-                    <el-input style="width: 200px; " v-model="regionName" placeholder="模糊查询">
+                    <el-input style="width: 200px; " v-model="vagueMaterialName" placeholder="物料名称模糊查询">
                     </el-input>
-                    <el-input style="width: 200px; " v-model="regionName" placeholder="结尾精确查询">
+                    <el-input style="width: 200px; " v-model="vagueModel" placeholder="型号模糊查询">
                     </el-input>
-                    <el-button type="primary" size="small" @click="searchRegion">查询物料</el-button>
+                    <el-button type="primary" size="small" @click="searchMaterial">查询物料</el-button>
                 </el-form-item>
             </el-form>
         </div>
         <div style="display: flex; flex-direction: row;">
             <div style="width: 866px">
                 <el-table
-                        :data="materialTableData"
+                        :data="getCurrentMaterialData"
                         ref="materialTable"
                         @selection-change="handleSelectionChange"
                         :header-cell-style="{ background: '#eef1f6', color: '#606266', 'text-align': 'center', 'padding': '0px'}"
@@ -386,6 +384,14 @@
                             label="线芯">
                     </el-table-column>
                 </el-table>
+                <div style="text-align: center; margin-top: 10px;">
+                    <el-pagination
+                            @current-change="handleMaterialCurrentChange"
+                            :current-page.sync="materialCurrentPage"
+                            :page-size="pageSize"
+                            :total="materialTableData.length"
+                    ></el-pagination>
+                </div>
             </div>
             <div style="flex-grow: 1; padding-left: 20px;">
                 <div
@@ -398,6 +404,7 @@
                 </div>
             </div>
         </div>
+
         <div style="text-align: center; padding-top: 20px">
             <el-button-group>
                 <el-button type="primary" size="small" style="margin-right: 80px" @click="addMaterialToTable">确认</el-button>
@@ -467,13 +474,14 @@
                 dialogRegionVisible: false,
                 regionName: '',
                 regionCurrentPage: 1,
+                materialCurrentPage: 1,
                 pageSize: 10,
                 dialogMaterialVisible: false,
                 materialTableData: [
                     {
                         materialName: 'Material 1',
                         model: 'Model A',
-                        district: 'Spec 1',
+                        specification: 'Spec 1',
                         voltage: '220V',
                         standard: 'Standard 1',
                         core: 'Core X'
@@ -481,7 +489,7 @@
                     {
                         materialName: 'Material 2',
                         model: 'Model B',
-                        district: 'Spec 2',
+                        specification: 'Spec 2',
                         voltage: '110V',
                         standard: 'Standard 2',
                         core: 'Core Y'
@@ -489,6 +497,10 @@
                     // Add more data as needed
                 ],
                 selectedMaterialItems: [], // 选中的数据
+                precMaterialName: '',
+                vagueMaterialName: '',
+                vagueModel: '',
+
             }
         },
         computed: {
@@ -497,8 +509,10 @@
                 const end = start + this.pageSize;
                 return this.regionTableData.slice(start, end);
             },
-            getCurrentMaterialData(){
+            getCurrentMaterialData() {
-
+                const start = (this.materialCurrentPage - 1) * this.pageSize;
+                const end = start + this.pageSize;
+                return this.materialTableData.slice(start, end);
             },
         },
         created() {
@@ -562,15 +576,16 @@
                 }
             },
 
-            handleRegionSizeChange(val) {
+
-                this.pageSize = val;
-                this.currentPage = 1; // 切换每页显示条目数时回到第一页
-            },
 
             handleRegionCurrentChange(val) {
                 this.currentPage = val;
             },
 
+            handleMaterialCurrentChange(val) {
+                this.currentPage = val;
+            },
+
             addMaterial(){
                 this.dialogMaterialVisible = true;
             },
@@ -605,6 +620,29 @@
 
             closeMaterialDialog() {
                 this.dialogMaterialVisible = false;
+            },
+
+            searchMaterial() {
+                if(this.precMaterialName === '' && this.vagueMaterialName === '' && this.vagueModel === '') {
+                    this.$message({
+                        message: '请输入你要查询的无聊条件',
+                        type: 'warning'
+                    });
+                }else {
+                    const params = {
+                        precMaterialName : this.precMaterialName,
+                        vagueMaterialName : this.vagueMaterialName,
+                        vagueModel : this.vagueModel
+                    }
+
+                    queryMaterialListByParam(params).then(res => {
+                        this.materialTableData = res.data || []
+                        this.materialCurrentPage = 1;
+                    }).catch(err => {
+                        this.$message.error('请求出错了：' + err)
+                    })
+
+                }
             }
 
         },

target/classes/static/zmquotation/css/index.css

@@ -68,11 +68,11 @@
 
 }
 
-.regionTable .el-dialog__header{
+.regionDialogTable .el-dialog__header{
     padding-bottom: 0px;
 
 }
-.regionTable .el-dialog__body{
+.regionDialogTable .el-dialog__body{
     padding-top: 0px;
 
 }
@@ -122,3 +122,18 @@
 .table-box {
 
 }
+
+.selected-item {
+    background-color: #f0f0f0;
+    border: 1px solid #ccc;
+    border-radius: 5px;
+    padding: 5px;
+    margin-bottom: 5px;
+    display: flex;
+    justify-content: space-between;
+}
+
+.remove-btn {
+    padding: 0px;
+    color: red;
+}

target/classes/templates/zmquotation/index.html

@@ -157,7 +157,7 @@
         </div>
         <div class="table-box">
             <el-table
-                :data="tableData"
+                :data="materialData"
                 border
                 :cell-style="cellStyle"
                 :header-cell-style="{ background: '#eef1f6', color: '#606266', 'text-align': 'center' }">
@@ -170,83 +170,83 @@
                     <el-table-column
                         fixed
                         width="180"
-                        prop="kunnr1"
+                        prop="materialName"
                         label="物料名称">
                     </el-table-column>
                     <el-table-column
                         width="180"
-                        prop="kunnr2"
+                        prop="quantity"
                         label="数量">
                             <template slot-scope="scope">
-                                <el-input v-model="scope.row.kunnr2" >
+                                <el-input v-model="scope.row.quantity" >
                                 </el-input>
                             </template>
                     </el-table-column>
                     <el-table-column
                         width="180"
-                        prop="kunnr3"
+                        prop="voltage"
                         label="电压">
                     </el-table-column>
                     <el-table-column
                         width="180"
-                        prop="kunnr4"
+                        prop="standard"
                         label="标准">
                     </el-table-column>
                     <el-table-column
                         width="180"
-                        prop="kunnr5"
+                        prop="core"
-                        label="纤芯">
+                        label="线芯">
                     </el-table-column>
                     <el-table-column
                         width="180"
-                        prop="kunnr6"
+                        prop="costPrice"
                         label="成本价">
                     </el-table-column>
                     <el-table-column
                         width="180"
-                        prop="kunnr7"
+                        prop="factoryPrice"
                         label="厂价">
                     </el-table-column>
                     <el-table-column
                         width="180"
-                        prop="kunnr8"
+                        prop="netVolume"
                         label="净量">
                     </el-table-column>
                     <el-table-column
                         width="180"
-                        prop="kunnr8"
+                        prop="inventory"
                         label="盘具">
                             <template slot-scope="scope">
-                                <el-input v-model="scope.row.kunnr2" >
+                                <el-input v-model="scope.row.inventory" >
                                 </el-input>
                             </template>
                     </el-table-column>
                     <el-table-column
                         width="180"
-                        prop="kunnr8"
+                        prop="weighInv"
                         label="盘重">
                     </el-table-column>
                     <el-table-column
                             width="180"
-                            prop="kunnr8"
+                            prop="totalWeight"
                             label="总重">
                     </el-table-column>
                     <el-table-column
                         fixed="right"
                         width="120"
-                        prop="kunnr8"
+                        prop="totalCost"
                         label="总成本">
                     </el-table-column>
                     <el-table-column
                         fixed="right"
                         width="120"
-                        prop="kunnr8"
+                        prop="totalFacPrice"
                         label="总厂价">
                     </el-table-column>
                     <el-table-column
                         fixed="right"
                         width="120"
-                        prop="kunnr8"
+                        prop="totalNetWt"
                         label="总净重">
                     </el-table-column>
                     <el-table-column
@@ -260,7 +260,7 @@
             </el-table>
         </div>
     </div>
-    <el-dialog class="regionTable" :visible.sync="dialogRegionVisible" width="932px" >
+    <el-dialog class="regionDialogTable" :visible.sync="dialogRegionVisible" width="932px" >
         <div slot="title" class="regionTable-title" style="margin: 0px">
             <el-form>
                 <el-form-item >
@@ -270,6 +270,7 @@
                 </el-form-item>
             </el-form>
         </div>
+        <div>
             <el-table
                     :data="getCurrentRegionData"
                     :header-cell-style="{ background: '#eef1f6', color: '#606266', 'text-align': 'center', 'padding': '0px'}"
@@ -309,12 +310,11 @@
                     </template>
                 </el-table-column>
             </el-table>
+        </div>
         <div style="text-align: center; margin-top: 10px;">
             <el-pagination
-                @size-change="handleRegionSizeChange"
                 @current-change="handleRegionCurrentChange"
                 :current-page.sync="regionCurrentPage"
-                :page-sizes="[10, 20, 30, 40]"
                 :page-size="pageSize"
                 :total="regionTableData.length"
             ></el-pagination>
@@ -334,11 +334,14 @@
                 </el-form-item>
             </el-form>
         </div>
+        <div style="display: flex; flex-direction: row;">
             <div style="width: 866px">
                 <el-table
-                    :data="materialData"
+                        :data="materialTableData"
+                        ref="materialTable"
+                        @selection-change="handleSelectionChange"
                         :header-cell-style="{ background: '#eef1f6', color: '#606266', 'text-align': 'center', 'padding': '0px'}"
-                    :cell-style="{'text-align': 'center', 'padding': '0px'}"
+                        :cell-style="{'text-align': 'center', 'padding': '5px 0px'}"
                         highlight-selection-row
                         border>
                     <el-table-column
@@ -362,8 +365,8 @@
                     </el-table-column>
                     <el-table-column
                             width="120"
-                        prop="district"
+                            prop="specification"
-                        label="specification">
+                            label="规格">
                     </el-table-column>
                     <el-table-column
                             width="120"
@@ -382,6 +385,23 @@
                     </el-table-column>
                 </el-table>
             </div>
+            <div style="flex-grow: 1; padding-left: 20px;">
+                <div
+                        v-for="(selectedItem, index) in selectedMaterialItems"
+                        :key="index"
+                        class="selected-item"
+                >
+                    {{ selectedItem.materialName }} - {{ selectedItem.voltage }}
+                    <el-button @click="removeSelectedItem(selectedItem)" type="text" class="remove-btn">&#10006;</el-button>
+                </div>
+            </div>
+        </div>
+        <div style="text-align: center; padding-top: 20px">
+            <el-button-group>
+                <el-button type="primary" size="small" style="margin-right: 80px" @click="addMaterialToTable">确认</el-button>
+                <el-button type="warning" size="small" @click="closeMaterialDialog">取消</el-button>
+            </el-button-group>
+        </div>
 
     </el-dialog>
 </div>
@@ -420,12 +440,23 @@
                     totalFactoryAmount: '',     /*厂价金额合计*/
                     totalActualAmount: '',      /*实际金额合计*/
                 },
-                tableData: [
+                materialData: [
-                    { kunnr1: '001', kunnr2: '002', kunnr3: '003', kunnr4: '004', kunnr5: '005', kunnr6: '006', kunnr7: '007', kunnr8: '008' },
+
-                    { kunnr1: '101', kunnr2: '102', kunnr3: '103', kunnr4: '104', kunnr5: '105', kunnr6: '106', kunnr7: '107', kunnr8: '108' },
+                ],
-                    // Add more rows as needed
+                regionTableData: [
+                    {
+                        province: '浙江',
+                        city: '杭州',
+                        district: '西湖区',
+                        kilometers: 10
+                    },
+                    {
+                        province: '上海',
+                        city: '上海',
+                        district: '黄浦区',
+                        kilometers: 20
+                    },
                 ],
-                regionTableData: [],
                 price_0t_5t: '',
                 price_5t_10t: '',
                 price_10t_25t: '',
@@ -436,7 +467,7 @@
                 regionCurrentPage: 1,
                 pageSize: 10,
                 dialogMaterialVisible: false,
-                materialData: [
+                materialTableData: [
                     {
                         materialName: 'Material 1',
                         model: 'Model A',
@@ -454,7 +485,8 @@
                         core: 'Core Y'
                     },
                     // Add more data as needed
-                ]
+                ],
+                selectedMaterialItems: [], // 选中的数据
             }
         },
         computed: {
@@ -489,7 +521,7 @@
             },
 
             handleDeleteClick(index){
-                this.tableData.splice(index, 1)
+                this.materialData.splice(index, 1)
             },
 
             selectedRegion(){
@@ -528,10 +560,7 @@
                 }
             },
 
-            handleRegionSizeChange(val) {
+
-                this.pageSize = val;
-                this.currentPage = 1; // 切换每页显示条目数时回到第一页
-            },
 
             handleRegionCurrentChange(val) {
                 this.currentPage = val;
@@ -539,6 +568,38 @@
 
             addMaterial(){
                 this.dialogMaterialVisible = true;
+            },
+            handleSelectionChange(selection) {
+                // 当选择发生变化时更新选中数据
+                this.selectedMaterialItems = selection;
+            },
+            removeSelectedItem(selectedItem) {
+                // 移除选中的记录
+                const index = this.selectedMaterialItems.indexOf(selectedItem);
+                if (index !== -1) {
+                    this.selectedMaterialItems.splice(index, 1);
+                }
+
+                // 同步取消左侧表格中对应项的选择
+                const tableIndex = this.materialTableData.indexOf(selectedItem);
+                if (tableIndex !== -1) {
+                    this.$refs.materialTable.toggleRowSelection(this.materialTableData[tableIndex]);
+                }
+            },
+
+            addMaterialToTable() {
+                // 将选中的物料信息添加到表格中
+                this.materialData = this.materialData.concat(this.selectedMaterialItems);
+
+                // 清空选中的物料信息
+                this.selectedMaterialItems = [];
+                this.$refs.materialTable.clearSelection();
+                this.dialogMaterialVisible = false;
+
+            },
+
+            closeMaterialDialog() {
+                this.dialogMaterialVisible = false;
             }
 
         },