优惠券修改

src/views/modules/coupon/coupon-add-or-update.vue

@@ -18,7 +18,7 @@
         <el-col :span="8">
           <el-form-item label="优惠卷类型" prop="couponType">
             <!-- <el-input v-model="dataForm.type" placeholder="优惠卷类型"></el-input> -->
-            <el-select v-model="dataForm.couponType" placeholder="请选择">
+            <el-select v-model="dataForm.couponType" placeholder="请选择" :disabled="!isEdit">
               <el-option
                 v-for="item in options"
                 :key="item.value"
@@ -31,7 +31,7 @@
         </el-col>
         <el-col :span="8"
           ><el-form-item label="使用门槛" prop="useLevel">
-            <el-input
+            <el-input :disabled="!isEdit"
               v-model="dataForm.useLevel"
               placeholder=""
               oninput="value=value.replace(/[^\d.]/g,'')"
@@ -42,7 +42,7 @@
         </el-col>
         <el-col :span="8">
           <el-form-item label="面额：" prop="couponAmount">
-            <el-input
+            <el-input :disabled="!isEdit"
               v-model="dataForm.couponAmount"
               placeholder="面额"
               oninput="value=value.replace(/[^\d.]/g,'')"
@@ -55,7 +55,7 @@
       <el-row :gutter="10">
         <el-col :span="8">
           <el-form-item label="优惠券名称" prop="couponName">
-            <el-input
+            <el-input :disabled="!isEdit"
               v-model="dataForm.couponName"
               placeholder="名称"
             ></el-input>
@@ -89,7 +89,7 @@
         <el-col :span="8">
           <el-form-item label="优惠卷范围" prop="couponRange">
             <!-- <el-input v-model="dataForm.type" placeholder="优惠卷类型"></el-input> -->
-            <el-select
+            <el-select :disabled="!isEdit"
               v-model="dataForm.couponRange"
               placeholder="请选择"
               @change="changeRange"
@@ -166,7 +166,7 @@
       <el-row ::gutter="10">
         <el-col :span="24">
           <el-form-item label="生效方式" prop="effectType">
-            <el-radio-group v-model="dataForm.effectType">
+            <el-radio-group v-model="dataForm.effectType" :disabled="!isEdit">
               <el-radio :label="0">长期有效</el-radio>
               <el-radio :label="1">领取生效</el-radio>
               <el-radio :label="2">自定义</el-radio>
@@ -181,7 +181,7 @@
             prop="effectTime"
             v-if="dataForm.effectType == '2'"
           >
-            <el-date-picker
+            <el-date-picker :disabled="!isEdit"
               v-model="dataForm.effectTime"
               @change="datePicked"
               type="datetime"
@@ -194,7 +194,7 @@
         </el-col>
         <el-col :span="12">
           <el-form-item
-            label="结束时间"
+            label="结束时间" :disabled="!isEdit"
             prop="expireTime"
             v-if="dataForm.effectType == '2'"
           >
@@ -211,7 +211,7 @@
         </el-col>
         <el-col :span="8" v-show="dataForm.effectType == '1'">
           <el-form-item label="时效" prop="validity">
-            <el-input
+            <el-input :disabled="!isEdit"
               placeholder=""
               v-model="dataForm.validity"
               oninput="value=value.replace(/[^\d.]/g,'')"
@@ -223,8 +223,9 @@
       </el-row>
       <el-row :gutter="10">
         <el-col :span="24">
-          <el-form-item label="封面图" prop="couponUrl">
+          <el-form-item label="封面图" prop="couponUrl" >
             <el-upload
+            :disabled="!isEdit"
               :limit="1"
               class="el-uploadfeng"
               :action="baseUrl + '/oss/fileoss'"
@@ -243,9 +244,9 @@
           </el-form-item>
         </el-col>
         <el-col :span="8">
-          <el-form-item label="备注" prop="remark">
+          <el-form-item label="备注" prop="remark" >
             <el-input
-              v-model="dataForm.remark"
+              v-model="dataForm.remark":disabled="!isEdit"
               placeholder="备注"
               type="textarea"
               :rows="3"
@@ -272,6 +273,7 @@ export default {
   baseUrl: global.baseUrl,
   data() {
     return {
+      isEdit:true,
       showCateError: false,
       requesturl:'', // 课程的请求地址
       showSelectPro:false,
@@ -440,6 +442,7 @@ export default {
       if(!id){
         console.log('没有传值')
         this.visible = true;
+        this.isEdit=true
         return
       }
       this.dataForm.id = id || 0;
@@ -454,9 +457,14 @@ export default {
           }).then(({ data }) => {
             if (data.code !== 0) return this.$message.error(data.msg);
             this.visible = true;
+
             this.getCouponInfoLoad = false;
             if (data && data.code == 0) {
               this.dataForm = data.couponEntity;
+
+              if(this.dataForm.grantCount>0){
+                this.isEdit=false
+              }
               if (
                 this.dataForm.effectTime &&
                 this.dataForm.effectTime != null

src/views/modules/coupon/coupon.vue

@@ -1,16 +1,35 @@
 <template>
   <div class="mod-config">
-  <el-radio-group v-model="currentState" style="margin-bottom: 15px;" @tab-click="handleClick">
+    <el-radio-group
-    <el-radio-button label="">全部</el-radio-button>
+      v-model="currentState"
-    <el-radio-button label="0">生效中</el-radio-button>
+      style="margin-bottom: 15px;"
-    <el-radio-button label="1">已过期</el-radio-button>    
+      @tab-click="handleClick"
-  </el-radio-group>
+    >
-    <el-form :inline="true" :model="dataForm" @keyup.enter.native="getDataList()">
+      <el-radio-button label="">全部</el-radio-button>
+      <el-radio-button label="0">生效中</el-radio-button>
+      <el-radio-button label="1">已过期</el-radio-button>
+    </el-radio-group>
+    <el-form
+      :inline="true"
+      :model="dataForm"
+      @keyup.enter.native="getDataList()"
+    >
       <el-form-item>
-        <el-input  v-model="dataForm.couponName" placeholder="参数名" clearable></el-input>
+        <el-input
+          v-model="dataForm.couponName"
+          placeholder="参数名"
+          clearable
+        ></el-input>
       </el-form-item>
       <el-form-item label="优惠券范围">
-        <el-select v-model="dataForm.couponRange" placeholder="请选择" @change="pageIndex = 1; getDataList()">
+        <el-select
+          v-model="dataForm.couponRange"
+          placeholder="请选择"
+          @change="
+            pageIndex = 1;
+            getDataList();
+          "
+        >
           <el-option
             v-for="item in rangList"
             :key="item.value"
@@ -21,7 +40,14 @@
         </el-select>
       </el-form-item>
       <el-form-item label="优惠券类型">
-        <el-select v-model="dataForm.TypeList" placeholder="请选择" @change="pageIndex = 1; getDataList()">
+        <el-select
+          v-model="dataForm.TypeList"
+          placeholder="请选择"
+          @change="
+            pageIndex = 1;
+            getDataList();
+          "
+        >
           <el-option
             v-for="item in TypeList"
             :key="item.value"
@@ -33,7 +59,12 @@
       </el-form-item>
       <el-form-item>
         <el-button @click="getDataList()">查询</el-button>
-        <el-button v-if="isAuth('book:coupon:save')" type="primary" @click="addOrUpdateHandle()">新增</el-button>
+        <el-button
+          v-if="isAuth('book:coupon:save')"
+          type="primary"
+          @click="addOrUpdateHandle()"
+          >新增</el-button
+        >
         <!-- <el-button v-if="isAuth('book:coupon:delete')" type="danger" @click="deleteHandle()" :disabled="dataListSelections.length <= 0">批量删除</el-button> -->
       </el-form-item>
     </el-form>
@@ -42,7 +73,8 @@
       border
       v-loading="dataListLoading"
       @selection-change="selectionChangeHandle"
-      style="width: 100%;">
+      style="width: 100%;"
+    >
       <!-- <el-table-column
         type="selection"
         header-align="center"
@@ -53,55 +85,80 @@
         prop="id"
         header-align="center"
         align="center"
-        label="序号" width="50">
+        label="序号"
+        width="50"
+      >
       </el-table-column>
       <el-table-column
         prop="couponName"
         header-align="center"
         align="center"
-        label="优惠券名称">
+        label="优惠券名称"
+      >
       </el-table-column>
-      <el-table-column       
+      <el-table-column
         header-align="center"
         align="center"
-        label="优惠券类型" width="100px"> 
+        label="优惠券类型"
-       <template slot-scope="scope"> 
+        width="100px"
-       {{scope.row.effectType | getType}}      
+      >
-       </template>
+        <template slot-scope="scope">
-      </el-table-column>     
+          {{ scope.row.effectType | getType }}
+        </template>
+      </el-table-column>
       <el-table-column
         prop="couponAmount"
         header-align="center"
         align="center"
-        label="面值" width="90px">
+        label="面值"
-      </el-table-column> 
+        width="90px"
+      >
+      </el-table-column>
       <el-table-column
         prop="expirationDate"
         header-align="center"
         align="center"
-        label="时间">
+        label="时间"
+      >
         <template slot-scope="scope">
-          <span v-if="scope.row.createTime">创建时间：{{scope.row.createTime}}</span>
+          <span v-if="scope.row.createTime"
-          <span v-if="scope.row.effectTime"><br/>生效时间：{{scope.row.effectTime}}</span>
+            >创建时间：{{ scope.row.createTime }}</span
-          <span v-if="scope.row.expireTime"><br/>结束时间：{{scope.row.expireTime}}</span>
+          >
-          
+          <span v-if="scope.row.effectTime"
-
+            ><br />生效时间：{{ scope.row.effectTime }}</span
+          >
+          <span v-if="scope.row.expireTime"
+            ><br />结束时间：{{ scope.row.expireTime }}</span
+          >
         </template>
-      </el-table-column>       
+      </el-table-column>
       <el-table-column
         prop="couponRange"
         header-align="center"
         align="center"
-        label="优惠券范围">
+        label="优惠券范围"
+      >
         <template slot-scope="scope">
-          {{scope.row.couponRange | getRange}}
+          {{ scope.row.couponRange | getRange }}
         </template>
-      </el-table-column>      
+      </el-table-column>
+      
       <el-table-column
         prop="totalCirculation"
         header-align="center"
         align="center"
-        label="发行数量" width="90px">
+        label="发行数量"
+        width="90px"
+      >
+      </el-table-column><el-table-column
+        prop="grantCount"
+        header-align="center"
+        align="center"
+        label="已领取数量"
+      >
+        <template slot-scope="scope">
+          {{ scope.row.grantCount }}
+        </template>
       </el-table-column>
       <!-- <el-table-column
         prop="useCount"
@@ -119,27 +176,42 @@
         prop="receiveCount"
         header-align="center"
         align="center"
-        label="操作">
+        label="操作"
+      >
         <template slot-scope="scope">
           <el-switch
             v-model="scope.row.currentState"
-            :active-value ="0"
+            :active-value="0"
-            :inactive-value='1'
+            :inactive-value="1"
             @change="changeStateHandle(scope.row.id, scope.row.currentState)"
             active-text="发放中"
-            inactive-text="暂停发放">
+            inactive-text="暂停发放"
+          >
           </el-switch>
         </template>
-      </el-table-column>      
+      </el-table-column>
       <el-table-column
         fixed="right"
         header-align="center"
         align="center"
         width="150"
-        label="操作">
+        label="操作"
+      >
         <template slot-scope="scope">
-          <el-button type="primary" size="small" plain @click="addOrUpdateHandle(scope.row.id)">修改</el-button>        
+          <el-button
-          <el-button type="danger" size="small" plain @click="deleteHandle(scope.row.id)">删除</el-button>
+            type="primary"
+            size="small"
+            plain
+            @click="addOrUpdateHandle(scope.row.id)"
+            >修改</el-button
+          >
+          <el-button
+            type="danger"
+            size="small"
+            plain
+            @click="deleteHandle(scope.row.id)"
+            >删除</el-button
+          >
         </template>
       </el-table-column>
     </el-table>
@@ -150,194 +222,202 @@
       :page-sizes="[10, 20, 50, 100]"
       :page-size="pageSize"
       :total="totalPage"
-      layout="total, sizes, prev, pager, next, jumper">
+      layout="total, sizes, prev, pager, next, jumper"
+    >
     </el-pagination>
     <!-- 弹窗, 新增 / 修改 -->
-    <add-or-update v-if="addOrUpdateVisible" ref="addOrUpdate" @refreshDataList="getDataList"></add-or-update>
+    <add-or-update
+      v-if="addOrUpdateVisible"
+      ref="addOrUpdate"
+      @refreshDataList="getDataList"
+    ></add-or-update>
   </div>
 </template>
 
 <script>
 import global from "@/views/common/common.vue"; //引入共用组间
 
-  import AddOrUpdate from './coupon-add-or-update'
+import AddOrUpdate from "./coupon-add-or-update";
-import commentsListVue from '../book/commentsList.vue'
+import commentsListVue from "../book/commentsList.vue";
-  export default {
+export default {
-    data () {
+  data() {
-      return {
+    return {
-        dataForm: {
+      dataForm: {
-          couponName: '',
+        couponName: "",
-          couponRange: '',
+        couponRange: "",
-          couponType:''
+        couponType: ""
-        },
-        currentState:'',   // "currentState":""//当前状态 0 发放中 1结束
-        dataList: [],
-        rangList: global.rangList,
-        TypeList: global.TypeList,
-        pageIndex: 1,
-        pageSize: 10,
-        totalPage: 0,
-        dataListLoading: false,
-        dataListSelections: [],
-        addOrUpdateVisible: false,
-        courseCateList:[]
-      }
-    },
-    filters: {
-      // 格式化时间
-      getType (value) { 
-          switch (value) {
-            case 0:
-              return '长期有效'
-            case 1:
-              return '领取生效'
-            case 2:
-              return '自定义'
-          }
       },
-      getRange (value) {       
+      currentState: "", // "currentState":""//当前状态 0 发放中 1结束
-          switch (value) {
+      dataList: [],
-            case 0:
+      rangList: global.rangList,
-              
+      TypeList: global.TypeList,
-              return '无限制'
+      pageIndex: 1,
-            case 1:
+      pageSize: 10,
-              return '课程券'
+      totalPage: 0,
-            case 2:
+      dataListLoading: false,
-              return '课程品类券'           
+      dataListSelections: [],
-          }       
+      addOrUpdateVisible: false,
+      courseCateList: []
+    };
+  },
+  filters: {
+    // 格式化时间
+    getType(value) {
+      switch (value) {
+        case 0:
+          return "长期有效";
+        case 1:
+          return "领取生效";
+        case 2:
+          return "自定义";
       }
     },
-    components: {
+    getRange(value) {
-      AddOrUpdate
+      switch (value) {
-    },
+        case 0:
-    activated () {
+          return "无限制";
-      this.getDataList()
+        case 1:
-    },
+          return "课程券";
-    methods: {     
+        case 2:
-      // 修改优惠券状态
+          return "课程品类券";
-      changeStateHandle (id, state) {
+      }
-        console.log('进来了')
+    }
-        this.$http({
+  },
-          url: this.$http.adornUrl('/common/coupon/updateCouponState'),
+  components: {
-          method: 'post',
+    AddOrUpdate
-          data: this.$http.adornData({
+  },
-            id: id,
+  activated() {
-            currentState: state
+    this.getDataList();
-          })
+  },
-        }).then(({data}) => {
+  methods: {
+    // 修改优惠券状态
+    changeStateHandle(id, state) {
+      console.log("进来了");
+      this.$http({
+        url: this.$http.adornUrl("/common/coupon/updateCouponState"),
+        method: "post",
+        data: this.$http.adornData({
+          id: id,
+          currentState: state
+        })
+      })
+        .then(({ data }) => {
           if (data && data.code === 0) {
             this.$message({
-              message: '操作成功',
+              message: "操作成功",
-              type:'success',
+              type: "success",
               duration: 1500,
               onClose: () => {
-                this.getDataList()
+                this.getDataList();
               }
-            })
+            });
           } else {
-            this.$message.error(data.msg)
+            this.$message.error(data.msg);
           }
-        }).catch((e) => {
-          this.$message.error(e.msg)          
         })
-      },
+        .catch(e => {
-      handleClick(){
+          this.$message.error(e.msg);
-        console.log(this.currentState) 
+        });
-        this.pageIndex = 1       
+    },
-        this.getDataList()
+    handleClick() {
-
+      console.log(this.currentState);
-      },
+      this.pageIndex = 1;
-      // 获取数据列表
+      this.getDataList();
-      getDataList () {
+    },
-        this.dataListLoading = true
+    // 获取数据列表
-        this.$http({
+    getDataList() {
-          url: this.$http.adornUrl('/common/coupon/getCouponList'),
+      this.dataListLoading = true;
-          method: 'post',
+      this.$http({
-          data: this.$http.adornData({
+        url: this.$http.adornUrl("/common/coupon/getCouponList"),
-            'page': this.pageIndex,
+        method: "post",
-            'limit': this.pageSize,
+        data: this.$http.adornData({
-            'couponName': this.dataForm.couponName,
+          page: this.pageIndex,
-            'currentState': this.currentState, //当前状态 0 发放中 1结束
+          limit: this.pageSize,
-            "couponType": this.dataForm.couponType,//优惠券类型  0现金 1折扣
+          couponName: this.dataForm.couponName,
-            "couponRange":this.dataForm.couponRange,//优惠卷范围 0无限制 1课程卷 2课程品类卷
+          currentState: this.currentState, //当前状态 0 发放中 1结束
-          })
+          couponType: this.dataForm.couponType, //优惠券类型  0现金 1折扣
-        }).then(({data}) => {
+          couponRange: this.dataForm.couponRange //优惠卷范围 0无限制 1课程卷 2课程品类卷
-          if(data.code !==0) return this.$message.error(data.msg)
+        })
+      })
+        .then(({ data }) => {
+          if (data.code !== 0) return this.$message.error(data.msg);
           if (data && data.code === 0) {
-            this.dataList = data.couponPage.records
+            this.dataList = data.couponPage.records;
-            this.totalPage = data.couponPage.total
+            this.totalPage = data.couponPage.total;
           } else {
-            this.dataList = []
+            this.dataList = [];
-            this.totalPage = 0
+            this.totalPage = 0;
           }
-          this.dataListLoading = false
+          this.dataListLoading = false;
-        }).catch((e) => {
-          this.$message.error(e.msg)
-          this.dataListLoading = false
         })
-      },
+        .catch(e => {
-      // 每页数
+          this.$message.error(e.msg);
-      sizeChangeHandle (val) {
+          this.dataListLoading = false;
-        this.pageSize = val
+        });
-        this.pageIndex = 1
+    },
-        this.getDataList()
+    // 每页数
-      },
+    sizeChangeHandle(val) {
-      // 当前页
+      this.pageSize = val;
-      currentChangeHandle (val) {
+      this.pageIndex = 1;
-        this.pageIndex = val
+      this.getDataList();
-        this.getDataList()
+    },
-      },
+    // 当前页
-      // 多选
+    currentChangeHandle(val) {
-      selectionChangeHandle (val) {
+      this.pageIndex = val;
-        this.dataListSelections = val
+      this.getDataList();
-      },
+    },
-      // 新增 / 修改
+    // 多选
-      addOrUpdateHandle (id) { 
+    selectionChangeHandle(val) {
-        this.addOrUpdateVisible = true      
+      this.dataListSelections = val;
-        this.$nextTick(() => {         
+    },
-            this.$refs.addOrUpdate.init(id)         
+    // 新增 / 修改
-          // this.addOrUpdateVisible = true
+    addOrUpdateHandle(id) {
-        })
+      this.addOrUpdateVisible = true;
-      },
+      this.$nextTick(() => {
-      // 删除
+        this.$refs.addOrUpdate.init(id);
-      deleteHandle (id) {
+        // this.addOrUpdateVisible = true
-        // var ids = id ? [id] : this.dataListSelections.map(item => {
+      });
-        //   return item.id
+    },
-        // })
+    // 删除
-        this.$confirm(`确定对[id=${id}]进行删除操作?`, '提示', {
+    deleteHandle(id) {
-          confirmButtonText: '确定',
+      // var ids = id ? [id] : this.dataListSelections.map(item => {
-          cancelButtonText: '取消',
+      //   return item.id
-          type: 'warning'
+      // })
-        }).then(() => {
+      this.$confirm(`确定对[id=${id}]进行删除操作?`, "提示", {
-          this.$http({
+        confirmButtonText: "确定",
-            url: this.$http.adornUrl('/common/coupon/delCoupon'),
+        cancelButtonText: "取消",
-            method: 'post',
+        type: "warning"
-            data: this.$http.adornData({
+      }).then(() => {
-              id: id
+        this.$http({
-            })
+          url: this.$http.adornUrl("/common/coupon/delCoupon"),
-          }).then(({data}) => {
+          method: "post",
-            if (data && data.code === 0) {
+          data: this.$http.adornData({
-              this.$message({
+            id: id
-                message: '操作成功',
-                type: 'success',
-                duration: 1500,
-                onClose: () => {
-                  this.getDataList()
-                }
-              })
-            } else {
-              this.$message.error(data.msg)
-            }
           })
-        })
+        }).then(({ data }) => {
-      }
+          if (data && data.code === 0) {
-    },watch:{
+            this.$message({
-      currentState: {
+              message: "操作成功",
-      handler(val, oldVal) {        
+              type: "success",
-           this.getDataList()
+              duration: 1500,
+              onClose: () => {
+                this.getDataList();
+              }
+            });
+          } else {
+            this.$message.error(data.msg);
+          }
+        });
+      });
+    }
+  },
+  watch: {
+    currentState: {
+      handler(val, oldVal) {
+        this.getDataList();
       },
       deep: true
-    },
     }
   }
+};
 </script>