zhangdan %!s(int64=4) %!d(string=hai) anos
pai
achega
7a82434a90
Modificáronse 2 ficheiros con 134 adicións e 109 borrados
  1. 9 13
      src/views/Order/OrderCenter.vue
  2. 125 96
      src/views/Order/OrderDetailModal.vue

+ 9 - 13
src/views/Order/OrderCenter.vue

@@ -36,7 +36,7 @@
           </a-col>
           </a-col>
           <a-col :span="6">
           <a-col :span="6">
             <a-form-item label="手机号码" :label-col="{ span:6 }" :wrapper-col="{ span:12}">
             <a-form-item label="手机号码" :label-col="{ span:6 }" :wrapper-col="{ span:12}">
-              <a-input v-model.trim="searchForm.customerMobile" placeholder="请输入" allowClear maxLength="11" />
+              <a-input v-model.trim="searchForm.customerMobile" placeholder="请输入" allowClear :maxLength="11" />
             </a-form-item>
             </a-form-item>
           </a-col>
           </a-col>
           <a-col :span="6">
           <a-col :span="6">
@@ -57,7 +57,7 @@
     <!-- 列表 -->
     <!-- 列表 -->
     <s-table ref="table" size="default" :rowKey="(record) => record.id" :columns="columns" :data="loadData" bordered>
     <s-table ref="table" size="default" :rowKey="(record) => record.id" :columns="columns" :data="loadData" bordered>
       <!-- 状态 -->
       <!-- 状态 -->
-      <span slot="orderStatus" slot-scope="text, record">
+      <span slot="orderStatus" slot-scope="text, record" :nowStatus="detailStatus">
         {{ $refs.orderStatus.getNameByCode(text) }}
         {{ $refs.orderStatus.getNameByCode(text) }}
       </span>
       </span>
       <!-- 实收金额 -->
       <!-- 实收金额 -->
@@ -67,7 +67,6 @@
       </span>
       </span>
       <!-- 操作 -->
       <!-- 操作 -->
       <span slot="action" slot-scope="text, record">
       <span slot="action" slot-scope="text, record">
-        <!-- <a-button type="primary" @click="openDetailModal=true">查看</a-button> -->
         <a-button type="primary" @click="seeDetail(record)">查看</a-button>
         <a-button type="primary" @click="seeDetail(record)">查看</a-button>
         <!-- 本期暂不做 -->
         <!-- 本期暂不做 -->
         <!-- <a-button type="danger" @click="refund(record)">退款</a-button> -->
         <!-- <a-button type="danger" @click="refund(record)">退款</a-button> -->
@@ -75,6 +74,7 @@
     </s-table>
     </s-table>
     <!-- 查看详情弹窗 -->
     <!-- 查看详情弹窗 -->
     <order-detail-modal :openModal="openDetailModal" :nowId="detailId" @close="openDetailModal=false" />
     <order-detail-modal :openModal="openDetailModal" :nowId="detailId" @close="openDetailModal=false" />
+    
   </a-card>
   </a-card>
 </template>
 </template>
 
 
@@ -120,6 +120,7 @@
         storeOptionData: [], // 网点名称数据
         storeOptionData: [], // 网点名称数据
         openDetailModal: false, // 查看详情弹窗 默认关闭
         openDetailModal: false, // 查看详情弹窗 默认关闭
         detailId: null, // 初始化id
         detailId: null, // 初始化id
+        detailStatus:'',
         // 将默认当天时间日期回显在时间选择框中
         // 将默认当天时间日期回显在时间选择框中
         time: [
         time: [
           moment(getDate.getToday().starttime, this.dateFormat),
           moment(getDate.getToday().starttime, this.dateFormat),
@@ -208,7 +209,7 @@
             // console.log(res,'0000000000000000000')
             // console.log(res,'0000000000000000000')
             if (res.status == 200) {
             if (res.status == 200) {
               return res.data
               return res.data
-              _this.getTotal()
+              this.getTotal()
             }
             }
           })
           })
         }
         }
@@ -274,8 +275,10 @@
       // 查看详情--跳转到对应的详情页
       // 查看详情--跳转到对应的详情页
       seeDetail(record) {
       seeDetail(record) {
         // 将当前行的id传递给详情页 
         // 将当前行的id传递给详情页 
-        this.detailId = record.id
         this.openDetailModal = true
         this.openDetailModal = true
+        this.detailId = record.id
+        this.detailStatus = record.orderStatus
+        console.log(this.detailStatus)
       },
       },
       // 退款---暂不做
       // 退款---暂不做
       // refund(row) {
       // refund(row) {
@@ -286,14 +289,7 @@
       //     okText: '确定',
       //     okText: '确定',
       //     cancelText: '取消',
       //     cancelText: '取消',
       //     // onOk() {
       //     // onOk() {
-      //     // 	deleteItem({
-      //     // 		id: row.id
-      //     // 	}).then(res => {
-      //     // 		if (res.status == 200) {
-      //     // 			_this.$message.success('退款成功')
-      //     // 			_this.$refs.table.refresh()
-      //     // 		}
-      //     // 	})
+      //     
       //     // }
       //     // }
       //   })
       //   })
       // },
       // },

+ 125 - 96
src/views/Order/OrderDetailModal.vue

@@ -1,97 +1,97 @@
 <template>
 <template>
-  <a-modal title="查看详情" :footer="null" :width="1100" :destroyOnClose="true" @cancel="isShow=false" v-model="isShow">
-    <v-select ref="orderStatus" code="ORDER_STATUS" placeholder="请选择" allowClear v-show="false"></v-select>
-    <div class="orderDetail-content">
-      <a-form>
-        <a-row :gutter="24">
-          <a-col :span="8">
-            <a-form-item label="下单时间" :label-col="{ span:6 }" :wrapper-col="{ span:12}">
-              <span>{{orderDetailData.orderTime}}</span>
-            </a-form-item>
-          </a-col>
-          <a-col :span="8">
-            <a-form-item label="单号" :label-col="{ span:6 }" :wrapper-col="{ span:12}">
-              <span>{{orderDetailData.orderNo}}</span>
-            </a-form-item>
-          </a-col>
-          <a-col :span="8">
-            <a-form-item label="门店名称" :label-col="{ span:6 }" :wrapper-col="{ span:12}">
-              <span>{{orderDetailData.storeName}}</span>
-            </a-form-item>
-          </a-col>
-        </a-row>
-        <a-row :gutter="24">
-          <a-col :span="8">
-            <a-form-item label="服务名称" :label-col="{ span:6 }" :wrapper-col="{ span:12}">
-              <span>{{orderDetailData.itemName}}</span>
-            </a-form-item>
-          </a-col>
-          <a-col :span="8">
-            <a-form-item label="手机号码" :label-col="{ span:6 }" :wrapper-col="{ span:12}">
-              <span>{{orderDetailData.customerMobile}}</span>
-            </a-form-item>
-          </a-col>
-          <a-col :span="8">
-            <a-form-item label="状态" :label-col="{ span:6 }" :wrapper-col="{ span:12}">
-              <span>{{orderDetailData.orderStatus}}</span>
-            </a-form-item>
-          </a-col>
-        </a-row>
-        <a-row :gutter="24">
-          <a-col :span="8">
-            <a-form-item label="应付(¥)" :label-col="{ span:6 }" :wrapper-col="{ span:12}">
-              <span>{{orderDetailData.payableAmount}} 元</span>
-            </a-form-item>
-          </a-col>
-          <a-col :span="8">
-            <a-form-item label="实付(¥)" :label-col="{ span:6 }" :wrapper-col="{ span:12}">
-              <span v-if=" orderDetailData.payStatus == 'PAID' ">{{orderDetailData.paymentAmount}} 元</span>
-              <span v-else-if=" orderDetailData.payStatus != 'PAID' ">{{ 0 }} 元</span>
-            </a-form-item>
-          </a-col>
-          <a-col :span="8">
-            <a-form-item label="洗车照片" :label-col="{ span:6 }" :wrapper-col="{ span:12}">
-              <div style="display: flex;">
-                <!-- <div>
-                  <div style="border: 1px solid #eee;overflow: hidden;padding: 8px 0 0 8px; margin-right: 20px;">
-                    <Upload :file-list="" :fileSize="0.25" listType="picture-card">
-                    </Upload>
+  <div>
+    <a-modal title="查看详情" :footer="null" :width="1100" :destroyOnClose="true" @cancel="isShow=false" v-model="isShow">
+      <v-select ref="orderStatus" code="ORDER_STATUS" placeholder="请选择" allowClear v-show="false"></v-select>
+      <div class="orderDetail-content">
+        <a-form>
+          <a-row :gutter="24">
+            <a-col :span="8">
+              <a-form-item label="下单时间" :label-col="{ span:6 }" :wrapper-col="{ span:12}">
+                <span>{{orderDetailData.orderTime}}</span>
+              </a-form-item>
+            </a-col>
+            <a-col :span="8">
+              <a-form-item label="单号" :label-col="{ span:6 }" :wrapper-col="{ span:12}">
+                <span>{{orderDetailData.orderNo}}</span>
+              </a-form-item>
+            </a-col>
+            <a-col :span="8">
+              <a-form-item label="门店名称" :label-col="{ span:6 }" :wrapper-col="{ span:12}">
+                <span>{{orderDetailData.storeName}}</span>
+              </a-form-item>
+            </a-col>
+          </a-row>
+          <a-row :gutter="24">
+            <a-col :span="8">
+              <a-form-item label="服务名称" :label-col="{ span:6 }" :wrapper-col="{ span:12}">
+                <span>{{orderDetailData.itemName}}</span>
+              </a-form-item>
+            </a-col>
+            <a-col :span="8">
+              <a-form-item label="手机号码" :label-col="{ span:6 }" :wrapper-col="{ span:12}">
+                <span>{{orderDetailData.customerMobile}}</span>
+              </a-form-item>
+            </a-col>
+            <a-col :span="8">
+              <a-form-item label="状态" :label-col="{ span:6 }" :wrapper-col="{ span:12}">
+                <span>{{orderDetailData.orderStatus}}</span>
+              </a-form-item>
+            </a-col>
+          </a-row>
+          <a-row :gutter="24">
+            <a-col :span="8">
+              <a-form-item label="应付(¥)" :label-col="{ span:6 }" :wrapper-col="{ span:12}">
+                <span>{{orderDetailData.payableAmount}} 元</span>
+              </a-form-item>
+            </a-col>
+            <a-col :span="8">
+              <a-form-item label="实付(¥)" :label-col="{ span:6 }" :wrapper-col="{ span:12}">
+                <span v-if=" orderDetailData.payStatus == 'PAID' ">{{orderDetailData.paymentAmount}} 元</span>
+                <span v-else-if=" orderDetailData.payStatus != 'PAID' ">{{ 0 }} 元</span>
+              </a-form-item>
+            </a-col>
+            <!-- <a-col :span="8">
+              <a-form-item label="洗车照片" :label-col="{ span:6 }" :wrapper-col="{ span:12}">
+                <div style="display: flex;">
+                  <div>
+                      <img :src="imgBefore" alt="" @click="isShowImgModal=true">
+                    <div style="text-align: center;">洗车前</div>
                   </div>
                   </div>
-                  <div style="text-align: center;">洗车前</div>
-                </div>
-                <div>
-                  <div style="border: 1px solid #eee;overflow: hidden;padding: 8px 0 0 8px;">
-                    <Upload :file-list="" :fileSize="0.25" listType="picture-card">
-                    </Upload>
+                  <div>
+                      <img :src="imgAfter" alt="" @click="isShowImgModal=true">
+                    <div style="text-align: center;">洗车后</div>
                   </div>
                   </div>
-                  <div style="text-align: center;">洗车后</div>
-                </div> -->
-              </div>
-            </a-form-item>
-          </a-col>
-        </a-row>
-        <a-row :gutter="24">
-          <!-- <a-col :span="8">
-            <a-form-item label="优惠(¥)" :label-col="{ span:6 }" :wrapper-col="{ span:12}">
-              <span>{{'-'}}</span>
-            </a-form-item>
-          </a-col>
-          <a-col :span="8">
-            <a-form-item label="优惠券名称" :label-col="{ span:6 }" :wrapper-col="{ span:12}">
-              <span>{{"-"}}</span>
-            </a-form-item>
-          </a-col> -->
-        </a-row>
-        <a-row style="text-align: center;margin-top: 100px;">
-          <a-col>
-            <a-form-item>
-              <a-button type="default" @click="isShow=false" >返回列表</a-button>
-            </a-form-item>
-          </a-col>
-        </a-row>
-      </a-form>
-    </div>
-  </a-modal>
+                </div>
+              </a-form-item>
+            </a-col> -->
+          </a-row>
+          <a-row :gutter="24">
+            <!-- <a-col :span="8">
+              <a-form-item label="优惠(¥)" :label-col="{ span:6 }" :wrapper-col="{ span:12}">
+                <span>{{'-'}}</span>
+              </a-form-item>
+            </a-col>
+            <a-col :span="8">
+              <a-form-item label="优惠券名称" :label-col="{ span:6 }" :wrapper-col="{ span:12}">
+                <span>{{"-"}}</span>
+              </a-form-item>
+            </a-col> -->
+          </a-row>
+          <a-row style="text-align: center;margin-top: 100px;">
+            <a-col>
+              <a-form-item>
+                <a-button type="default" @click="isShow=false" >返回列表</a-button>
+              </a-form-item>
+            </a-col>
+          </a-row>
+        </a-form>
+      </div>
+    </a-modal>
+    <!-- 查看洗车前后照片对比 -->
+    <!-- <a-modal class="picModal" :width="600" :footer="null" :destroyOnClose="true" @cancel="isShowImgModal=false" v-model="isShowImgModal">
+      <img :src="imgBefore" class="pic" />
+    </a-modal> -->
+  </div>
 </template>
 </template>
 
 
 <script>
 <script>
@@ -108,32 +108,58 @@
       nowId:{
       nowId:{
         type: Number,
         type: Number,
         default: null 
         default: null 
+      },
+      nowStatus:{
+        type: String,
+        default: ''
       }
       }
     },
     },
     data() {
     data() {
       return {
       return {
         orderDetailData:[],
         orderDetailData:[],
         isShow: this.openModal,
         isShow: this.openModal,
+        // rowId:null
+        // isShowImgModal: false,
+        // imgBefore:require('../../assets/logo.png')
       }
       }
     },
     },
     methods: {
     methods: {
-     
+      // getDetailData(){
+      //   if(this.rowId){
+      //     orderDetail({id:this.rowId}).then(res=>{
+      //       console.log(res,'------------')
+      //       if(res.status == 200){
+      //         // setTimeout(() => {
+      //         // 	res.data.orderStatus = this.$refs.orderStatus.getNameByCode(res.data.orderStatus)
+      //         // }, 100)
+      //         this.orderDetailData = res.data
+      //       }
+      //     })
+      //   }
+      // }
     },
     },
     watch: {
     watch: {
       //  父页面传过来的弹框状态以及当前行id
       //  父页面传过来的弹框状态以及当前行id
       openModal (newValue, oldValue) {
       openModal (newValue, oldValue) {
         this.isShow = newValue
         this.isShow = newValue
       },
       },
-      nowId(newValue, oldValue){
+      nowStatus (newValue, oldValue) {
         console.log(newValue)
         console.log(newValue)
+      },
+      nowId(newValue, oldValue){
+        // this.rowId = newValue
+        // console.log(this.rowId)
+        // this.getDetailData()
         if(newValue){
         if(newValue){
           orderDetail({id:newValue}).then(res=>{
           orderDetail({id:newValue}).then(res=>{
             console.log(res,'------------')
             console.log(res,'------------')
             if(res.status == 200){
             if(res.status == 200){
+              console.log(res.data,'+++')
               setTimeout(() => {
               setTimeout(() => {
               	res.data.orderStatus = this.$refs.orderStatus.getNameByCode(res.data.orderStatus)
               	res.data.orderStatus = this.$refs.orderStatus.getNameByCode(res.data.orderStatus)
               }, 100)
               }, 100)
               this.orderDetailData = res.data
               this.orderDetailData = res.data
+              console.log(this.orderDetailData,'---')
             }
             }
           })
           })
         }
         }
@@ -151,8 +177,11 @@
   .orderDetail-content .ant-form-inline .ant-form-item {
   .orderDetail-content .ant-form-inline .ant-form-item {
     margin-bottom: 20px;
     margin-bottom: 20px;
   }
   }
-  /* 去掉上传图片组件原有的删除按钮 */
-  :global(.anticon-delete) {
-    display: none;
+  .pic{
+    transform: scale(3);
+    display: block;
+    max-width: 100%;
+    height:100%;
+    margin: 0 auto;
   }
   }
 </style>
 </style>