清除方式变更

ghsApp/src/admin/item/detail.vue

@@ -72,14 +72,60 @@
             <button v-if="productData.id > 0" class="admin-button-com blue middle" style="width:180upx;margin-left:10upx;" @click.stop="hasBuyList">已购列表</button>
           </tui-list-cell>
           <tui-list-cell v-if="showClearTime" class="line-cell limit-buy-line" :hover="false">
-            <view class="tui-title">清空时间</view>
-            <datetime-picker
-              v-model="form.limitBuyClearTime"
-              type="datetime"
-              return-type="string"
-              class="limit-time-picker"
-              placeholder="留空则不自动清空"
-            />
+            <view class="tui-title">清除方式</view>
+            <radio-group class="tui-input limit-clear-radio" @change="limitBuyClearTypeChange">
+              <label class="list" for="limitClearNone">
+                <radio id="limitClearNone" value="0" :checked="form.limitBuyClearType == 0" style="transform:scale(0.87,0.87)" />
+                <text class="checkbox-text">不清除</text>
+              </label>
+              <label class="list" for="limitClearCycle">
+                <radio id="limitClearCycle" value="1" :checked="form.limitBuyClearType == 1" style="transform:scale(0.87,0.87)" />
+                <text class="checkbox-text">循环</text>
+              </label>
+              <label class="list" for="limitClearTiming">
+                <radio id="limitClearTiming" value="2" :checked="form.limitBuyClearType == 2" style="transform:scale(0.87,0.87)" />
+                <text class="checkbox-text">定时</text>
+              </label>
+              <input v-model="form.limitBuyClearType" name="limitBuyClearType" hidden />
+            </radio-group>
+          </tui-list-cell>
+          <tui-list-cell v-if="showClearTime && form.limitBuyClearType != 0" class="line-cell limit-buy-line" :hover="false">
+            <template v-if="form.limitBuyClearType == 1">
+              <view class="tui-title">清空时间</view>
+              <view class="limit-clear-cycle-row">
+                <text class="limit-clear-cycle-text">每隔</text>
+                <picker
+                  mode="selector"
+                  :range="limitBuyClearCycleList"
+                  :value="limitBuyClearCycleIndex"
+                  @change="limitBuyClearCycleChange"
+                >
+                  <view class="limit-picker-value">{{ limitBuyClearCycleText }}</view>
+                </picker>
+                <text class="limit-clear-cycle-text">在</text>
+                <picker
+                  mode="selector"
+                  :range="limitBuyClearHourList"
+                  :value="limitBuyClearHourIndex"
+                  @change="limitBuyClearHourChange"
+                >
+                  <view class="limit-picker-value">{{ limitBuyClearHourText }}</view>
+                </picker>
+                <text class="limit-clear-cycle-text">清空</text>
+              </view>
+              <input v-model="form.limitBuyClearIntervalDays" name="limitBuyClearIntervalDays" hidden />
+              <input v-model="form.cleartAt" name="cleartAt" hidden />
+            </template>
+            <template v-else>
+              <view class="tui-title">清空时间</view>
+              <datetime-picker
+                v-model="form.limitBuyClearTime"
+                type="datetime"
+                return-type="string"
+                class="limit-time-picker"
+                placeholder="留空则不自动清空"
+              />
+            </template>
           </tui-list-cell>
         </view>
 
@@ -511,6 +557,9 @@ export default {
         cover: "",
         images: [],
         limitBuy:0,
+        limitBuyClearType:1,
+        limitBuyClearIntervalDays:1,
+        cleartAt:0,
         limitBuyClearTime:'',
         limitBuyExceedType:1,
         stockWarning:5,
@@ -557,7 +606,9 @@ export default {
       partAcceptItem:0,
       partAcceptItemName:'',
       partAcceptItemModify:0,
-      currentEnv:'production'
+      currentEnv:'production',
+      limitBuyClearCycleList: Array.from({ length: 30 }, (item, index) => `${index + 1}天`),
+      limitBuyClearHourList: Array.from({ length: 24 }, (item, index) => `${index}点`)
     };
   },
 	computed:{
@@ -567,6 +618,20 @@ export default {
     },
     showClearTime() {
       return Number(this.form.limitBuy) > 0;
+    },
+    limitBuyClearCycleIndex() {
+      const cycle = Number(this.form.limitBuyClearIntervalDays) || 1;
+      return Math.max(0, Math.min(cycle - 1, this.limitBuyClearCycleList.length - 1));
+    },
+    limitBuyClearHourIndex() {
+      const hour = Number(this.form.cleartAt) || 0;
+      return Math.max(0, Math.min(hour, this.limitBuyClearHourList.length - 1));
+    },
+    limitBuyClearCycleText() {
+      return this.limitBuyClearCycleList[this.limitBuyClearCycleIndex];
+    },
+    limitBuyClearHourText() {
+      return this.limitBuyClearHourList[this.limitBuyClearHourIndex];
     }
 	},
   onLoad(option) {
@@ -654,6 +719,33 @@ export default {
         })
       })
     },
+    normalizeLimitBuyClearConfig(){
+      if (![0, 1, 2].includes(Number(this.form.limitBuyClearType))) {
+        this.form.limitBuyClearType = 0
+      } else {
+        this.form.limitBuyClearType = Number(this.form.limitBuyClearType)
+      }
+      this.form.limitBuyClearIntervalDays = Number(this.form.limitBuyClearIntervalDays) > 0 ? Number(this.form.limitBuyClearIntervalDays) : 1
+      this.form.cleartAt = Number(this.form.cleartAt) >= 0 ? Number(this.form.cleartAt) : 0
+      if (this.form.limitBuyClearIntervalDays > this.limitBuyClearCycleList.length) {
+        this.form.limitBuyClearIntervalDays = this.limitBuyClearCycleList.length
+      }
+      if (this.form.cleartAt > this.limitBuyClearHourList.length - 1) {
+        this.form.cleartAt = this.limitBuyClearHourList.length - 1
+      }
+    },
+    limitBuyClearTypeChange(e){
+      this.form.limitBuyClearType = Number(e.detail.value)
+      if (this.form.limitBuyClearType == 1) {
+        this.form.limitBuyClearTime = ''
+      }
+    },
+    limitBuyClearCycleChange(e){
+      this.form.limitBuyClearIntervalDays = Number(e.detail.value) + 1
+    },
+    limitBuyClearHourChange(e){
+      this.form.cleartAt = Number(e.detail.value)
+    },
     notAllowChange(){
       if(this.productData.hasRightChangeReason!=''){
         this.$msg(this.productData.hasRightChangeReason)
@@ -1194,6 +1286,9 @@ export default {
         this.form.frontUse = 0
         this.form.virtualStock = 0
         this.form.limitBuy = 0
+        this.form.limitBuyClearType = 1
+        this.form.limitBuyClearIntervalDays = 1
+        this.form.cleartAt = 0
         this.form.limitBuyClearTime = ''
         this.form.limitBuyExceedType = 1
         this.cost = res.data && res.data.cost ? parseFloat(res.data.cost) : 0
@@ -1212,6 +1307,7 @@ export default {
         if (![1, 2].includes(Number(this.form.limitBuyExceedType))) {
           this.form.limitBuyExceedType = 1;
         }
+        this.normalizeLimitBuyClearConfig()
 
         const imageUrls = (res.data.images || '').split(',').filter(i => i);
         this.form.images = imageUrls;
@@ -1242,6 +1338,12 @@ export default {
         this.productData = res.data
         this.cost = res.data.cost ? res.data.cost : 0
         this.belongCost = res.data.belongCost ? res.data.belongCost : 0
+
+        this.form.limitBuyClearType = res.data.limitBuyClearInfo.limitBuyClearType || res.data.limitBuyClearInfo.limitBuyClearType === 0 ? res.data.limitBuyClearInfo.limitBuyClearType : 1
+        this.form.limitBuyClearIntervalDays = res.data.limitBuyClearInfo.limitBuyClearIntervalDays ? res.data.limitBuyClearInfo.limitBuyClearIntervalDays : 1
+        this.form.cleartAt = res.data.limitBuyClearInfo.cleartAt ? res.data.limitBuyClearInfo.cleartAt : 0
+        this.form.limitBuyClearTime = res.data.limitBuyClearInfo.limitBuyClearTime ? res.data.limitBuyClearInfo.limitBuyClearTime : ''
+        this.normalizeLimitBuyClearConfig()
       });
     },
     imgUploadSuccess(res) {
@@ -1533,6 +1635,44 @@ export default {
 .limit-time-picker {
   width: 470upx;
 }
+.limit-clear-radio {
+  display: flex;
+  align-items: center;
+  flex-wrap: nowrap;
+  .list {
+    display: flex;
+    align-items: center;
+    margin-right: 20upx;
+    white-space: nowrap;
+  }
+  .checkbox-text {
+    margin-left: 4upx;
+    white-space: nowrap;
+  }
+}
+.limit-clear-time-title {
+  margin-left: 35upx;
+}
+.limit-clear-cycle-row {
+  display: flex;
+  align-items: center;
+  flex-wrap: nowrap;
+  white-space: nowrap;
+}
+.limit-clear-cycle-text {
+  margin: 0 8upx;
+  white-space: nowrap;
+}
+.limit-picker-value {
+  width: 120upx;
+  height: 54upx;
+  line-height: 54upx;
+  border: 1upx solid #999;
+  text-align: center;
+  color: #333;
+  font-size: 28upx;
+  background-color: #fff;
+}
 .use-img{
   font-size: 22rpx;
   color: #999999;