优惠券编辑修改

src/views/coupon_manage/add_coupon.vue

@@ -10,18 +10,19 @@
         <el-form-item label="优惠券券名" prop="title" style="width: 100%;">
           <el-input v-model="form.title" placeholder="" style="width: 289px;" />
         </el-form-item>
-        <el-form-item label="使用门槛" prop="fullAmount">
+        <el-form-item v-if="form.type == 1" label="使用门槛" prop="fullAmount">
           <el-input v-model="form.fullAmount" oninput="value= value.replace(/[^\d|\.]/g, '')" placeholder="" style="width: 180px;margin-right: 66px;">
             <template slot="prepend">满</template>
             <template slot="append">元</template>
           </el-input>
         </el-form-item>
-        <el-form-item label="" prop="discountAmount">
+        <el-form-item v-if="form.type == 1" label="" prop="discountAmount">
           <el-input v-model="form.discountAmount" oninput="value= value.replace(/[^\d|\.]/g, '')" placeholder="" style="width: 180px;">
             <template slot="prepend">减</template>
             <template slot="append">元</template>
           </el-input>
         </el-form-item>
+         
         <el-form-item label="有效期类型" style="width: 100%;">
           <el-radio-group v-model="form.validityType">
             <el-radio v-for="item in couponEnum.validityType" :key="item.value" :label="item.value">
@@ -29,7 +30,7 @@
             </el-radio>
           </el-radio-group>
         </el-form-item>
-        <el-form-item v-if="form.validityType == 'custom'" label="有效时间" prop="validEndTime" style="width: 100%;">
+        <el-form-item v-if="form.validityType == 'fixed'" label="有效时间" prop="validEndTime" style="width: 100%;">
           <el-date-picker
             v-model="validityTime"
             type="daterange"
@@ -91,21 +92,77 @@
         <el-button type="primary" :loading="loading" @click="onSubmitHandle">确 定</el-button>
       </span>
     </div>
-    <!-- 商品券 -->
+    <div v-if="form.type == 2">
-    <div v-if="form.type == 2" class="content">
       <el-form ref="form" :model="form" :rules="rules" label-width="120px" label-position="left">
-        <el-form-item label="商品券券名" prop="title">
+        <el-form-item label="优惠券券名" prop="title" style="width: 100%;">
           <el-input v-model="form.title" placeholder="" style="width: 289px;" />
         </el-form-item>
-        <el-form-item label="发放数量" prop="number">
-          <el-input v-model="form.number" oninput="value=value.replace(/^(0+)|[^\d]+/g,'')" placeholder="" style="width: 289px;" />
-          <el-tooltip class="item" effect="dark" content="限用户自行领取，（当库存为 0时，集草等活动仍会赠送）" placement="top-start">
-            <i class="el-icon-question" />
-          </el-tooltip>
-        </el-form-item>
         <el-form-item label="使用门槛" prop="fullAmount">
           全额满<el-input v-model="form.fullAmount" oninput="value= value.replace(/[^\d|\.]/g, '')" placeholder="" style="width: 100px;margin: 0 23px;"><template slot="suffix">元</template></el-input>可用
         </el-form-item>
+        <el-form-item label="有效期类型" style="width: 100%;">
+          <el-radio-group v-model="form.validityType">
+            <el-radio v-for="item in couponEnum.validityType" :key="item.value" :label="item.value">
+              {{ item.label }}
+            </el-radio>
+          </el-radio-group>
+        </el-form-item>
+        <el-form-item v-if="form.validityType == 'fixed'" label="有效时间" prop="validEndTime" style="width: 100%;">
+          <el-date-picker
+            v-model="validityTime"
+            type="daterange"
+            range-separator="至"
+            start-placeholder="开始日期"
+            end-placeholder="结束日期"
+            :default-time="['06:00:00', '23:59:59']"
+            value-format="yyyy-MM-dd HH:mm:ss"
+            @change="validityChange"
+          />
+        </el-form-item>
+        <el-form-item label="有效期（天）" prop="validDays" style="width: 100%;">
+          <el-input v-model="form.validDays" placeholder="" style="width: 200px;">
+            <template slot="append">天</template>
+          </el-input>
+        </el-form-item>
+        <!-- <el-form-item label="使用门槛" prop="daysToTakeEffect" style="width: 100%;">
+          <el-input v-model="form.daysToTakeEffect" placeholder="" style="width: 200px;">
+            <template slot="prepend">隔</template>
+            <template slot="append">天生效</template>
+          </el-input>
+          <el-tooltip class="item" effect="dark" content="领取后0天后0点0分" placement="top-start">
+            <i class="el-icon-question" />
+          </el-tooltip>
+        </el-form-item> -->
+        <el-form-item label="可用周期" prop="userDays" style="width: 100%;">
+          <el-checkbox-group v-model="form.userDays">
+            <el-checkbox v-for="(city,index) in couponEnum.cycle" :key="index" :label="city.label" @change="userDayChagne">{{ city.label }}</el-checkbox>
+          </el-checkbox-group>
+        </el-form-item>
+        <el-form-item label="指定时间段" style="width: 100%;">
+          <el-radio-group v-model="form.useTimeType">
+            <el-radio v-for="item in couponEnum.useTimeType" :key="item.value" :label="item.value">
+              {{ item.label }}
+            </el-radio>
+          </el-radio-group>
+        </el-form-item>
+        <el-form-item v-if="form.useTimeType == 'custom'" label="指定时间段" prop="useEndTime" style="width: 100%;">
+          <el-time-picker
+            v-model="useTime"
+            is-range
+            range-separator="至"
+            start-placeholder="开始日期"
+            end-placeholder="结束日期"
+            :default-time="['00:00:00', '23:59:59']"
+            value-format="HH:mm"
+            @change="useTimeChange"
+          />
+        </el-form-item>
+        <el-form-item label="发放数量" prop="number" style="width: 100%;">
+          <el-input v-model="form.number" oninput="value=value.replace(/^(0+)|[^\d]+/g,'')" placeholder="" style="width: 200px;" />
+          <el-tooltip class="item" effect="dark" content="限用户自行领取，（当库存为 0时，集草等活动仍会赠送）" placement="top-start">
+            <i class="el-icon-question" />
+          </el-tooltip>
+        </el-form-item>
         <el-form-item label="赠送商品" prop="products">
           <div>
             <el-button type="primary" icon="el-icon-plus" @click="$refs.shopListRef.show([...form.products])">
@@ -123,7 +180,6 @@
             </div>
           </div>
         </el-form-item>
-
       </el-form>
       <span slot="footer" class="dialog-footer">
         <el-button @click="dialogVisible = false">取 消</el-button>
@@ -166,7 +222,7 @@ export default {
         title: '',
         fullAmount: null,
         discountAmount: null,
-        validityType: 'fixed',
+        validityType: 'custom',
         validStartTime: '',
         validEndTime: '',
         userDays: [],
@@ -266,6 +322,7 @@ export default {
      */
     tabClick(item) {
       console.log(this.form)
+      this.form = this.resetForm
       this.form.number = ''
       this.form.type = item.type
       this.$refs.form.resetFields()

src/views/coupon_manage/couponEnum.js

@@ -30,11 +30,11 @@ export default {
   ],
   validityType: [
     {
-      value: 'fixed',
+      value: 'custom',
       label: '领券后有效期内可用'
     },
     {
-      value: 'custom',
+      value: 'fixed',
       label: '固定有效期范围内可用'
     }
   ],