优惠券功能优化

@@ -2,6 +2,15 @@
   <i-modal v-model="visiable" :loading="posting" :title="readonly ? '查看优惠券' : '创建/编辑优惠券'" @on-ok="onOk" width="600">
     <i-spin v-if="loading"></i-spin>
     <i-form v-else ref="formCoupon" :rules="ruleValidate" :model="formData" :label-width="80">
+      <i-form-item class="form-group" label="优惠券类型"></i-form-item>
+      <i-form-item label="优惠券类型" prop="couponType">
+        <i-select style="width: 100px;" v-model="formData.couponType">
+          <i-option :value="0">请选择</i-option>
+          <i-option :value="100">活动券</i-option>
+          <i-option :value="200">运费券</i-option>
+        </i-select>
+      </i-form-item>
+
       <i-form-item class="form-group" label="基本信息"></i-form-item>
       <i-form-item label="Token" v-if="couponToken">
         {{couponToken}}
@@ -43,10 +52,11 @@
         <i-select style="width: 100px;" v-model="formData.productLimitType">
           <i-option :value="1">指定商品</i-option>
           <i-option :value="2">全部商品</i-option>
+          <i-option :value="3">排除商品</i-option>
         </i-select>
       </i-form-item>
 
-      <i-form-item prop="productLimitValue" v-if="formData.productLimitType === 1">
+      <i-form-item prop="productLimitValue" v-if="formData.productLimitType === 1 || formData.productLimitType === 3">
         <i-input type="textarea" :disabled="readonly" placeholder="填写商品编码，多个商品编码用英文逗号分隔" v-model="formData.productLimitValue"></i-input>
         <i-poptip trigger="hover">
           <div slot="content">
@@ -60,6 +70,14 @@
           </i-upload>
         </i-poptip>
       </i-form-item>
+      <i-form-item label="禁用商品类型">
+        <checkbox-group v-model="formData.skupForbidTypeLable" @on-change="getCheckBox">
+          <checkbox label="现货"></checkbox>
+          <checkbox label="预售"></checkbox>
+          <checkbox label="二手"></checkbox>
+          <checkbox label="全新瑕疵"></checkbox>
+        </checkbox-group>
+      </i-form-item>
     </i-form>
   </i-modal>
 </template>
@@ -68,10 +86,31 @@
 import Api from 'api/api';
 import dayjs from 'dayjs';
 import xlsx from 'xlsx';
+import ISelect from "../../../../node_modules/iview/src/components/select/select";
+import IOption from "../../../../node_modules/iview/src/components/select/option";
+import CheckboxGroup from "../../../../node_modules/iview/src/components/checkbox/checkbox-group";
+import Checkbox from "../../../../node_modules/iview/src/components/checkbox/checkbox";
 
 const api = new Api();
+const forbidenTypeMap = {
+  '现货': 1,
+  '预售': 4,
+  '二手': 6,
+  '全新瑕疵': 5
+};
+const forbidenLabelMap = {
+  1: '现货',
+  4: '预售',
+  6: '二手',
+  5: '全新瑕疵'
+};
 
 export default {
+  components: {
+    Checkbox,
+    CheckboxGroup,
+    IOption,
+    ISelect},
   name: 'ModalCreateCoupon',
   data() {
     return {
@@ -84,6 +123,7 @@ export default {
       formData: {
         id: 0,
         couponName: '',
+        couponType: 0,
         couponNum: 0,
         useNum: 1,
         couponAmount: 0,
@@ -92,9 +132,18 @@ export default {
         productLimitType: 2,
         productLimitValue: '',
         useLimitValue: 0,
-        time: ['', '']
+        time: ['', ''],
+        skupForbidTypeLable:[],
+        skupForbidType: ''
       },
       ruleValidate: {
+        couponType: {required: true, validator: (rule, value, callback) => {
+          if (value === 0 || value === '0') {
+            callback(new Error('请选择优惠券类型'));
+          } else {
+            callback();
+          }
+        }},
         couponName: {required: true, max: 30, message: '请输入名称'},
         couponNum: {type: 'number', required: true, min: 1, message: '请输入数量'},
         couponAmount: {type: 'number', required: true, min: 1, message: '请输入优惠金额'},
@@ -133,7 +182,7 @@ export default {
           }
         }},
         productLimitType: {required: true, validator: (rule, value, callback) => {
-          if (value === 1 || value === 2) {
+          if (value === 1 || value === 2 || value === 3) {
             callback();
           } else {
             callback(new Error('请选择类型'));
@@ -152,6 +201,7 @@ export default {
         id: 0,
         couponName: '',
         couponNum: 0,
+        couponType: 0,
         useNum: 1,
         couponAmount: 0,
         useLimitType: 0,
@@ -159,7 +209,9 @@ export default {
         productLimitValue: '',
         productLimitType: 2,
         useLimitValue: 0,
-        time: ['', '']
+        time: ['', ''],
+        skupForbidTypeLable:[],
+        skupForbidType: ''
       };
 
       if (id) {
@@ -167,6 +219,9 @@ export default {
         const result = await api._get('/ufoPlatform/coupon/getCouponInfo', {
           id
         });
+
+        console.log(result);
+
         this.loading = false;
 
         if (result.code === 200) {
@@ -174,10 +229,18 @@ export default {
           const productLimits = result.data.productLimits;
 
           this.couponToken = coupon.couponToken;
+          let skupForbidTypeLable = [];
+          if (coupon.skupForbidType) {
+            let arr = coupon.skupForbidType.split(',');
+            for(let i = 0; i < arr.length; i++) {
+              skupForbidTypeLable.push(forbidenLabelMap[parseInt(arr[i])]);
+            }
+          }
           initData = {
             id,
             couponName: coupon.couponName,
             couponNum: coupon.couponNum,
+            couponType: coupon.couponType || 0,
             useNum: coupon.useNum,
             couponAmount: coupon.couponAmount,
             useLimitType: coupon.useLimitType,
@@ -185,7 +248,9 @@ export default {
             productLimitType: coupon.productLimitType,
             productLimitValue: (productLimits || []).map(i => i.productId).join(','),
             useLimitValue: coupon.useLimitValue,
-            time: [dayjs.unix(coupon.startTime).format('YYYY-MM-DD HH:mm:ss'), dayjs.unix(coupon.endTime).format('YYYY-MM-DD HH:mm:ss')]
+            time: [dayjs.unix(coupon.startTime).format('YYYY-MM-DD HH:mm:ss'), dayjs.unix(coupon.endTime).format('YYYY-MM-DD HH:mm:ss')],
+            skupForbidTypeLable: skupForbidTypeLable,
+            skupForbidType: coupon.skupForbidType
           };
         } else {
           result.message && this.$Message.warning(result.message);
@@ -194,7 +259,9 @@ export default {
       this.formData = initData;
     },
     onOk() {
+      console.log('ok');
       this.$refs.formCoupon.validate(valid => {
+        console.log(valid);
         if (!valid) {
           this.posting = false;
           this.$nextTick(() => {
@@ -205,16 +272,27 @@ export default {
         }
       });
     },
+    getCheckBox() { // checkbox勾选取消的监测
+      let arr = [];
+      for (let i = 0; i < this.formData.skupForbidTypeLable.length; i++) {
+        let forbidType = this.formData.skupForbidTypeLable[i];
+        arr.push(forbidenTypeMap[forbidType]);
+      }
+      this.formData.skupForbidType = arr.join(',');
+    },
     async saveData(params) {
       if (this.readonly) {
         this.visiable = false;
         return;
       }
+
+      console.log(params);
       const result = await api._post('/ufoPlatform/coupon/saveOrUpdateCoupon', {
         id: params.id || void 0,
         couponName: params.couponName,
         couponAmount: params.couponAmount,
         couponNum: params.couponNum,
+        couponType: params.couponType,
         useNum: params.useNum,
         useLimitValue: params.useLimitValue,
         productLimitType: params.productLimitType,
@@ -223,8 +301,11 @@ export default {
         useLimitType: parseInt(params.useLimitType) >= 0 ? params.useLimitType : void 0,
         startTime: params.time[0] ? dayjs(params.time[0]).unix() : void 0,
         endTime: params.time[1] ? dayjs(params.time[1]).unix() : void 0,
+        skupForbidType: params.skupForbidType
       });
 
+      console.log('result=', result);
+
       if (result.code === 200) {
         this.$Message.success('保存成功');
         this.visiable = false;
@@ -296,4 +377,9 @@ export default {
   height: 30px;
   background-color: #f5f7f9;
 }
+
+.ivu-form-item-label {
+  width: 90px !important;
+}
+
 </style>

@@ -65,24 +65,36 @@ export default {
       columns: [{
         title: 'ID',
         key: 'id',
-        width: 100
+        width: 90
       }, {
         title: '券名称',
         key: 'name',
-        width: 200
-      }, {
+        width: 180
+      },
+      {
         title: 'token',
         key: 'token',
-        width: 200
+        width: 180
       }, {
         title: '数量',
         key: 'couponNum',
         width: 100
       }, {
+          title: '已发放',
+          key: 'sendNum',
+          width: 100
+      },
+      {
+        title: '已使用',
+        key: 'useNum',
+        width: 100
+      },
+      {
         title: '使用期限',
         key: 'useTime',
         width: 165
-      }, {
+      },
+      {
         title: '优惠券说明',
         key: 'remark',
         align:'center',
@@ -98,7 +110,7 @@ export default {
         render: (h, {row}) => {
           return (
             <div>
-              <i-button type="success" size="small" onClick={() => this.onEditCoupon(row, true)}>查看详情</i-button>
+              <i-button type="success" size="small" onClick={() => this.onEditCoupon(row, false)}>查看详情</i-button>
               {(row.status === '未生效' || row.status === '生效中') ?
                 (<i-button type="primary" size="small" onClick={() => this.onEditCoupon(row)}>修改</i-button>) :
                 void 0}
@@ -224,4 +236,8 @@ export default {
   button {
     margin: 5px;
   }
+
+  .ivu-form-item-label {
+    width: 90px !important;
+  }
 </style>