From bb286f60958bdb433ee448a02cfc10932569c09d Mon Sep 17 00:00:00 2001
From: guojuan <2715201989@qq.com>
Date: Fri, 20 Sep 2024 17:42:58 +0800
Subject: [PATCH] fix:优化添加订单的功能逻辑

---
 frontend/front/src/utils/enums.js                          |  65 +++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++
 frontend/front/src/views/pages/newOrder/components/bxd.vue | 147 ++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++---------------------------------------------------------------
 frontend/front/src/views/pages/newOrder/components/dqd.vue |  32 ++++++++++++++++++++++++--------
 frontend/front/src/views/pages/newOrder/index.vue          |  37 +++++++++++++++++++++++++++++--------
 4 files changed, 202 insertions(+), 79 deletions(-)
 create mode 100644 frontend/front/src/utils/enums.js

diff --git a/frontend/front/src/utils/enums.js b/frontend/front/src/utils/enums.js
new file mode 100644
index 0000000..7d73fe5
--- /dev/null
+++ b/frontend/front/src/utils/enums.js
@@ -0,0 +1,65 @@
+export const sys_sf = {
+    Y: {code: '1', info: '是'},
+    N: {code: '0', info: '否'}
+};
+
+/**
+ * 订单来源枚举
+ */
+export const dd_ddly = {
+    XSXD: {code: '1', info: '线上下单'},
+    WDPS: {code: '2', info: '无单配送'},
+    BZXD: {code: '3', info: '帮助下单'}
+};
+
+/**
+ * 付款方式枚举
+ */
+export const dd_fkfs = {
+    HDFK: {code: '1', info: '货到付款'},
+    ZXZF: {code: '2', info: '在线支付'}
+};
+
+/**
+ * 配送方式枚举
+ */
+export const dd_psfs = {
+    PS: {code: '1', info: '配送'},
+    ZT: {code: '2', info: '自提'}
+};
+
+
+/**
+ * 付款方式枚举
+ */
+export const dd_zffs = {
+    CASH: {code: 'CASH', info: '现金支付'},
+    WX_PAY: {code: 'WX_PAY', info: '微信支付'},
+    ALI_PAY: {code: 'ALI_PAY', info: '支付宝支付'}
+};
+
+
+/**
+ * 支付场景枚举
+ */
+export const dd_zflx = {
+    APP: {code: 'APP', info: '移动应用内的支付场景'},
+    NATIVE: {code: 'NATIVE', info: '线下消费场景'},
+    JSAPI: {code: 'JSAPI', info: '公众号内或者微信内的网页支付'},
+    MWEB: {code: 'MWEB', info: '手机浏览器中的支付场景'}
+};
+
+
+export const dd_ddzt = {
+    CREATED: {code: '201', info: '待支付'},
+    PAID: {code: '202', info: '待配送'},
+    SHIPPED: {code: '203', info: '配送中'},
+    COMPLETED: {code: '204', info: '已完成'},
+    CANCELLED: {code: '205', info: '取消中'},
+    REFUNDING: {code: '206', info: '退款中'},
+    REFUNDED: {code: '207', info: '已取消'}
+};
+
+
+
+
diff --git a/frontend/front/src/views/pages/newOrder/components/bxd.vue b/frontend/front/src/views/pages/newOrder/components/bxd.vue
index 44d1732..4f0bf28 100644
--- a/frontend/front/src/views/pages/newOrder/components/bxd.vue
+++ b/frontend/front/src/views/pages/newOrder/components/bxd.vue
@@ -1,56 +1,52 @@
 <template>
   <div class="containerSty">
-    <el-row>
-      <el-col :span="24">
-        <el-form  :model="repairForm" label-width="73px" ref="repairForm"
-                  class="demo-form-inline;">
-          <div style="display:flex;">
-            <el-form-item label="问题小类:">
-              <el-select v-model="repairForm.wtxl" style="width: calc(100vw  / 5);" placeholder="请选择问题小类">
-                <el-option
-                  v-for="item in bxxlOptions"
-                  :key="item.value"
-                  :label="item.label"
-                  :value="item.value">
-                </el-option>
-              </el-select>
-            </el-form-item>
-            <el-form-item label="报修类型:" label-width="100px">
-              <el-select v-model="repairForm.bxlx" style="width: calc(100vw / 4.5);" placeholder="请选择报修类型">
-                <el-option
-                  v-for="item in bxlxOptions"
-                  :key="item.label"
-                  :label="item.label"
-                  :value="item.label">
-                </el-option>
-              </el-select>
-            </el-form-item>
-          </div>
-          <el-form-item label="问题类型:">
-            <el-input v-model="repairForm.wtlx"  type="textarea" :rows="2"  clearable placeholder="请输入问题描述"></el-input>
-          </el-form-item>
-          <el-form-item label="图片:">
-            <el-upload
-              :action="action"
-              accept=".jpg,.jpeg,.png"
-              list-type="picture-card"
-              :file-list="repairForm.fileList"
-              class="labUrlClass"
-              :on-success="handleImgSuccess"
-              :before-upload="beforeAvatarUpload"
-              :http-request="httpRequest"
-              multiple
-            >
-              <i slot="default" class="el-icon-plus"></i>
-              <span class="el-upload__text">选择照片</span>
-              <div slot="file" slot-scope="{ file }">
-
-                <img
-                  class="el-upload-list__item-thumbnail"
-                  :src="file.url"
-                  alt=""
-                />
-                <span class="el-upload-list__item-actions">
+    <el-form  :model="repairForm"  :rules="repairFormRules" label-width="82px" ref="repairForm">
+      <div style="display: flex;">
+        <el-form-item label="问题小类:" prop="wtxl">
+          <el-select v-model="repairForm.wtxl" style="width: calc(100vw  / 5.2);" clearable placeholder="请选择问题小类">
+            <el-option
+              v-for="item in bxxlOptions"
+              :key="item.value"
+              :label="item.label"
+              :value="item.value">
+            </el-option>
+          </el-select>
+        </el-form-item>
+        <el-form-item label="报修类型:" label-width="100px" prop="bxlx">
+          <el-select v-model="repairForm.bxlx" style="width: calc(100vw  / 5.8);" clearable placeholder="请选择报修类型">
+            <el-option
+              v-for="item in bxlxOptions"
+              :key="item.label"
+              :label="item.label"
+              :value="item.label">
+            </el-option>
+          </el-select>
+        </el-form-item>
+      </div>
+      <el-form-item label="问题类型:" prop="wtlx">
+        <el-input v-model="repairForm.wtlx"  type="textarea" :rows="2"  clearable placeholder="请输入问题描述"></el-input>
+      </el-form-item>
+      <el-form-item label="图片:">
+        <el-upload
+          :action="action"
+          accept=".jpg,.jpeg,.png"
+          list-type="picture-card"
+          :file-list="repairForm.fileList"
+          class="labUrlClass"
+          :on-success="handleImgSuccess"
+          :before-upload="beforeAvatarUpload"
+          :http-request="httpRequest"
+          multiple
+        >
+          <i slot="default" class="el-icon-plus"></i>
+          <div style="position: absolute;top: 30px;left: 45px" class="el-upload__text">选择照片</div>
+          <div slot="file" slot-scope="{ file }">
+            <img
+              class="el-upload-list__item-thumbnail"
+              :src="file.url"
+              alt=""
+            />
+            <span class="el-upload-list__item-actions">
                   <span
                     class="el-upload-list__item-preview"
                     @click="handlePictureCardPreview(file)"
@@ -64,15 +60,13 @@
                     <i class="el-icon-delete"></i>
                   </span>
                 </span>
-              </div>
-            </el-upload>
-          </el-form-item>
-        </el-form>
-      </el-col>
-      <el-dialog :visible.sync="dialogVisible">
-        <img width="100%" :src="dialogImageUrl" alt="">
-      </el-dialog>
-    </el-row>
+          </div>
+        </el-upload>
+      </el-form-item>
+    </el-form>
+    <el-dialog :visible.sync="dialogVisible" width="400px" title="预览图片">
+      <img width="100%" :src="dialogImageUrl" alt="">
+    </el-dialog>
   </div>
 </template>
 
@@ -83,6 +77,17 @@ export default {
   name: "bxd",
   data(){
     return {
+      repairFormRules:{
+        wtxl:[
+          {required:true,message:'请选择问题小类',trigger:'change'}
+        ],
+        bxlx:[
+          {required:true,message:'请选择报修类型',trigger:'change'}
+        ],
+        wtlx:[
+          {required:true,message:'请输入问题类型描述',trigger:'blur'}
+        ]
+      },
       bxlxOptions:[
         {
           value: '燃气泄漏',
@@ -148,6 +153,20 @@ export default {
         ...this.repairForm
       };
     },
+    onSubmit(){
+      let validFlag = false;
+      this.$refs.repairForm.validate((valid) => {
+        if (valid) {
+          validFlag = true;
+        } else {
+          validFlag = false;
+        }
+      });
+      return validFlag;
+    },
+    onReset(){
+      this.$refs.repairForm.resetFields();
+    },
     handlePictureCardRemove(file, fileList) {
       console.log(file, this.repairForm.fileList);
       const index = this.repairForm.fileList.findIndex((item) => {
@@ -199,9 +218,6 @@ export default {
         // this.form.userId = this.$store.state.user.userInfo.user.userId
       }
     },
-    onSubmit(){
-      console.log('打印是否触发这个事件')
-    },
     handleRemove(){
 
     },
@@ -250,6 +266,11 @@ export default {
 
 <style lang="scss" scoped>
 .containerSty{
+  height: 100%;
+  width: 100%;
+  ::v-deep.el-upload--picture-card{
+    position: relative;
+  }
 
 }
 
diff --git a/frontend/front/src/views/pages/newOrder/components/dqd.vue b/frontend/front/src/views/pages/newOrder/components/dqd.vue
index 52652c1..0cdf65b 100644
--- a/frontend/front/src/views/pages/newOrder/components/dqd.vue
+++ b/frontend/front/src/views/pages/newOrder/components/dqd.vue
@@ -37,12 +37,9 @@
     </div>
     <el-row style="margin-top: 10px">
       <el-col :span="24">
-        <el-form  :model="form" label-width="75px">
-          <el-form-item label="订单备注:">
-            <el-input v-model="form.bz" type="textarea" :rows="2"  style="width: 100%" clearable placeholder="请输入订单备注"></el-input>
-          </el-form-item>
-          <el-form-item label="配送方式:">
-            <el-select v-model="form.psfs" placeholder="请选择">
+        <el-form  :model="form" ref="form" :rules="formRules" label-width="82px">
+          <el-form-item label="配送方式:" prop="psfs">
+            <el-select v-model="form.psfs" style="width: 100%"   clearable placeholder="请选择">
               <el-option
                 v-for="item in psfsOptions"
                 :key="item.KEY_"
@@ -51,6 +48,9 @@
               </el-option>
             </el-select>
           </el-form-item>
+          <el-form-item label="订单备注:">
+            <el-input v-model="form.bz" type="textarea" :rows="2"  style="width: 100%" clearable placeholder="请输入订单备注"></el-input>
+          </el-form-item>
         </el-form>
       </el-col>
       <el-col :span="24" style="border: 1px solid #dcdfe6;padding: 20px">
@@ -103,6 +103,11 @@ export default {
   name: "bxd",
   data(){
     return {
+      formRules:{
+        psfs:[
+          {required:true,message:'请选择配送方式',trigger:'change'}
+        ],
+      },
       form:{
         qplxID:'',
         spje:'',
@@ -178,9 +183,20 @@ export default {
         console.log('打印gasStationImg', this.chooseProductList);
       })
     },
-    onSubmit(val){
+    onSubmit(){
+      let validFlag = false;
+      this.$refs.form.validate((valid) => {
+        if (valid) {
+          validFlag = true;
+        } else {
+          validFlag = false;
+        }
+      });
+      return validFlag;
+    },
+    onReset(){
+      this.$refs.form.resetFields();
     },
-
     handleChoseProduct(row,index,type){
       switch (type){
         case 'chooseProduct':
diff --git a/frontend/front/src/views/pages/newOrder/index.vue b/frontend/front/src/views/pages/newOrder/index.vue
index 860e213..4e4e919 100644
--- a/frontend/front/src/views/pages/newOrder/index.vue
+++ b/frontend/front/src/views/pages/newOrder/index.vue
@@ -89,19 +89,25 @@
            <el-col :span="24" style="height: calc(100% - 300px); overflow-y: auto">
              <el-table :data="memberOrderListData" style="margin-top: 10px;">
                <template v-if="tabs.activeName=='dqd'">
-                 <el-table-column property="spmc" label="商品" >
+                 <el-table-column  min-width="130px" property="spmc" label="商品" >
                  </el-table-column>
                  <el-table-column property="fDdzt" label="状态" >
+                   <template slot-scope="scope">
+                  {{ddDdzt.get(scope.row.fDdzt)}}
+                   </template>
                  </el-table-column>
                  <el-table-column property="fDdje" label="金额" ></el-table-column>
-                 <el-table-column property="fCjsj" label="时间" ></el-table-column>
+                 <el-table-column property="fCjsj" min-width="150px"  label="时间1" ></el-table-column>
                </template>
                <template v-else>
                  <el-table-column property="fBxlx" label="问题类型" >
                  </el-table-column>
                  <el-table-column property="fZt" label="状态" >
+                   <template slot-scope="scope">
+                     <span>{{scope.row.fZt}}</span>
+                   </template>
                  </el-table-column>
-                 <el-table-column property="fXdsj" label="上报时间" ></el-table-column>
+                 <el-table-column property="fXdsj" min-width="110px" label="上报时间" ></el-table-column>
                </template>
                <!--              <el-table-column label="操作"  align="center">-->
                <!--                <template slot-scope="scope">-->
@@ -129,6 +135,7 @@
 </template>
 
 <script>
+import { dd_ddzt} from "@/utils/enums";
 import {memberInfo,submitOrderPort,submitExpairPort,repairDataHistoryListPort,repairDataHistoryDetailPort,orderDataHistoryListPort} from '@/api/orderManage'
 import { getDict } from '@/api/common.js'
 import bxd from './components/bxd'
@@ -146,6 +153,7 @@ export default {
       showMapDialog:false,
       hylxOptions:[],
       memberOrderListData:[],
+      ddDdzt: new Map(Object.values(dd_ddzt).map(item => [item.code, item.info])),
       pageForm:{
         total:0,
         size:10,
@@ -213,7 +221,6 @@ export default {
     this.initData();
   },
   methods:{
-
     async initData(){
       let query = [{
         key: 'NAME_',
@@ -360,8 +367,7 @@ export default {
       }
     },
     handleClick(){
-      console.log('打印this.$refs[this.tabs.activeName]',this.$refs[this.tabs.activeName][0].onSubmit())
-      this.$refs[this.tabs.activeName][0].onSubmit(this.queryForm);
+      this.$refs[this.tabs.activeName][0].onReset();
       switch (this.tabs.activeName){
         case "dqd":
           if(this.memberForm.fUserid){
@@ -419,6 +425,7 @@ export default {
           let orderform = this.$refs[this.tabs.activeName][0].form
           switch (this.tabs.activeName){
             case "dqd":
+              console.log('打印',this.$refs);
               let params ={
                 psfs:orderform.psfs,
                 khxx:{
@@ -442,7 +449,14 @@ export default {
                   qplxID:this.dqdForm.qplxID
                 }
               }
-              this.submitDqdForm(params);
+              if(!this.dqdForm.qplxID){
+                this.$message.warning('请先选择商品!');
+                return false;
+              }
+              let validFlag = this.$refs.dqd[0].onSubmit();
+              if(validFlag){
+                this.submitDqdForm(params);
+              }
               break;
             case 'bxd':
             let repairform =  this.$refs[this.tabs.activeName][0].repairForm;
@@ -450,6 +464,8 @@ export default {
               if(repairform.fileList.length>0){
                 let photoList = repairform.fileList.map(item => JSON.parse(item.fileObj));
                  wttp = JSON.stringify(photoList);
+              }else{
+                wttp = null
               }
               console.log('打印repairform',repairform,this.memberForm);
               let bxdParams ={
@@ -470,7 +486,10 @@ export default {
                 wttp:wttp,
                 hyxm:this.memberForm.fHync,
               }
-              this.submitBxdForm(bxdParams);
+              let bxdValidFlag = this.$refs.bxd[0].onSubmit();
+              if(bxdValidFlag){
+                this.submitBxdForm(bxdParams);
+              }
               break;
           }
         } else {
@@ -485,6 +504,7 @@ export default {
         if(res.state == true){
           this.$message.success('提交成功!');
           this.$refs[this.tabs.activeName][0].resetForm();
+          this.$refs.dqd[0].onReset();
           this.orderGasForm.zj = '';
           this.getOrderHistoryList();
         }
@@ -497,6 +517,7 @@ export default {
         if(res.state == true){
           this.$message.success('提交成功!');
           this.$refs[this.tabs.activeName][0].resetForm();
+          this.$refs.bxd[0].onReset();
           this.getRepairHistoryList();
         }
       })
--
libgit2 0.21.2