Procházet zdrojové kódy

Merge branch 'deploy' of http://git.chelingzhu.com/chelingzhu-web/qhsxKx-admin-html into deploy

zhangdan před 4 roky
rodič
revize
72d2e615dc
1 změnil soubory, kde provedl 43 přidání a 11 odebrání
  1. 43 11
      src/views/CarWashManagement/AddCarWashModal.vue

+ 43 - 11
src/views/CarWashManagement/AddCarWashModal.vue

@@ -92,13 +92,13 @@
             <a-row :gutter="20">
               <a-col :span="11">
                 <a-form-model-item prop="startTime">
-                  <a-time-picker ref="startTime" v-model="form.startTime" @change="isResetPeriodPrice('startTime', $event)" format="HH:mm" placeholder="请选择开始时间" class="time-picker" />
+                  <a-time-picker v-model="form.startTime" @change="isResetPeriodPrice('startTime', $event)" format="HH:mm" placeholder="请选择开始时间" class="time-picker" />
                 </a-form-model-item>
               </a-col>
               <a-col :span="2">至</a-col>
               <a-col :span="11">
                 <a-form-model-item prop="endTime">
-                  <a-time-picker ref="endTime" v-model="form.endTime" @change="isResetPeriodPrice('endTime', $event)" format="HH:mm" placeholder="请选择结束时间" class="time-picker" />
+                  <a-time-picker v-model="form.endTime" @change="isResetPeriodPrice('endTime', $event)" format="HH:mm" placeholder="请选择结束时间" class="time-picker" />
                 </a-form-model-item>
               </a-col>
             </a-row>
@@ -106,7 +106,13 @@
         </a-col>
         <!-- 时段价格设置  start -->
         <a-col :span="24">
-          <a-form-model-item label="时段价格" :label-col="{ span: 3 }" :wrapper-col="{ span: 21 }" prop="periodPrice">
+          <a-form-model-item :label-col="{ span: 3 }" :wrapper-col="{ span: 21 }" prop="periodPrice">
+            <div slot="label" class="form-item-label">
+              <a-tooltip placement="right" arrow-point-at-center title="时段价格是指车主在不同时段洗车需要支付不同的价格,主要用于日间服务和夜间服务的差异化管理,达到调节流量、集客引流的效果。不同时段区间采用起始时间包含,结束时间不包含原则。例如:时段区间为06:00(含)-22:00(不含),普通洗车10元;时间区间为22:00(含)-06:00(不含),普通洗车8元。客户在6点00分01秒普通洗车为10元,客户在22点00分01秒普通洗车为8元。">
+                时段价格
+                <a-icon :style="{ fontSize: '18px', color: '#1890ff', verticalAlign: 'sub' }" type="question-circle" />
+              </a-tooltip>
+            </div>
             <a-row :gutter="20" v-for="(item, ind) in form.periodPrice" :key="ind">
               <a-col :span="9">
                 <a-row :gutter="20">
@@ -118,7 +124,7 @@
                   <a-col :span="2">至</a-col>
                   <a-col :span="11">
                     <a-form-model-item :prop="'periodPrice.'+ ind + '.endTime'" :rules="{required: true, message: '请选择结束时间', trigger: 'change'}">
-                      <a-time-picker v-model="item.endTime" format="HH:mm" placeholder="请选择" class="time-picker" />
+                      <a-time-picker v-model="item.endTime" :default-open-value="item.startTime" @change="isResetBelowPeriodPrice($event, ind)" format="HH:mm" placeholder="请选择" class="time-picker" />
                     </a-form-model-item>
                   </a-col>
                 </a-row>
@@ -132,8 +138,8 @@
                   </a-col>
                 </a-row>
               </a-col>
-              <a-col :span="2">
-                <a-icon type="delete" title="删除" @click="delPeriodPrice(ind)" :style="{ fontSize: '20px', color: 'red', padding: '0 10px' }" />
+              <a-col :span="1">
+                <a-icon type="delete" title="删除" @click="delPeriodPrice(ind)" :style="{ fontSize: '20px', color: 'red' }" />
               </a-col>
             </a-row>
             <a-button type="dashed" @click="setTimeInterval" class="setTimeInterval"><a-icon type="plus" />添加时段</a-button>
@@ -191,9 +197,9 @@
         isShow: this.openModal,  //  弹框是否展示
         form: {
           name: '',  //  网点名称
-          addrProvince: '',  //  省
-          addrCity: '',  //  市
-          addrDistrict: '',  //  区
+          addrProvince: undefined,  //  省
+          addrCity: undefined,  //  市
+          addrDistrict: undefined,  //  区
           addrDetail: '',  //  详细地址
           equipment: '',  //  设备
           sign: [],  //  网点标签
@@ -252,6 +258,7 @@
         serviceType: [],  //  服务类型  change前的值
         startTime: null,  //  营业时间开始时间  change前的值
         endTime: null,  //  营业时间结束时间  change前的值
+        subEndTime: [],  //  时段价格  时段区间结束时间  change前的值
       }
     },
     methods: {
@@ -298,7 +305,7 @@
         this.$refs.ruleForm.resetFields()
         this.isShow = false
       },
-      // 是否重置时段价格
+      // 是否重置时段价格 (更改服务类型、营业开始结束时间)
       isResetPeriodPrice(type, val){
         // type: serviceType  服务类型  startTime  营业时间  开始时间  endTime  营业时间  结束时间
         const _this = this
@@ -320,6 +327,26 @@
           }
         },0)
       },
+      // 是否重置时段价格 (更改时段价格区间结束时间)
+      isResetBelowPeriodPrice(val, ind){
+        const _this = this
+        // 更改已设置过的时段时间(因为有下一个时段的前提是当前时段结束时间已设置)
+        if(this.form.periodPrice[ind + 1]){
+          _this.$confirm({
+            title: '提示',
+            content: '更改已设置过的时段区间,其之后的时段区间将会被清空,确定要更改吗?',
+            onOk() {
+              _this.subEndTime[ind] = val
+              _this.form.periodPrice.splice(ind + 1, _this.form.periodPrice.length - Number(ind + 1))
+            },
+            onCancel() {
+              _this.form.periodPrice[ind].endTime = _this.subEndTime[ind]
+            },
+          })
+        }else{
+          _this.subEndTime[ind] = val
+        }
+      },
       //  选择设备
       closeChooseEquipment(val, name){
         if(val){
@@ -365,9 +392,10 @@
       // 删除时段价格
       delPeriodPrice(ind){
         const _this = this
+        let msg = Number(ind + 1) == _this.form.periodPrice.length ? '确定要删除该时段吗?' : '确定要删除该时段以及其之后已设置的时段吗?'
         _this.$confirm({
           title: '提示',
-          content: '确定要删除该时段价格吗?',
+          content: msg,
           onOk() {
             _this.form.periodPrice.splice(ind, _this.form.periodPrice.length - ind)
           }
@@ -395,6 +423,10 @@
     .default-form-item{
       margin-bottom: 0;
     }
+    .form-item-label{
+        display: inline-block;
+        cursor: pointer;
+    }
     .form-item-required{
       .ant-form-item-label{
         label:before{