超级会员

src/views/member/coupon/components/good-dialog.vue

@@ -130,7 +130,7 @@ export default {
     handleSelect(selection, row) {
       this.$refs.table.clearSelection()
       this.$refs.table.toggleRowSelection(row)
-      this.productRadio = row.productId
+      this.productRadio = row
     },
     handleAddProConfirm() {
       // 确认选择商品

src/views/member/coupon/edit.vue

@@ -3,7 +3,7 @@
     <div v-if="editType === 'add'" class="filter-container">
       <div class="filter-control">
         <span style="color: red;">在本页面，对每三个月给超级会员自动发放的优惠券进行配置，配置完成后下一阶段才生效（最少配置1个，最多5个）。</span>
-        <el-button type="primary">新增优惠券</el-button>
+        <el-button type="primary" :disabled="disabled" @click="handleAddList">新增优惠券</el-button>
       </div>
     </div>
     <div v-else class="filter-container">
@@ -16,10 +16,10 @@
           start-placeholder="开始月份"
           end-placeholder="结束月份"
         />
-        <el-button type="primary" style="margin-left: 30px;">新增优惠券</el-button>
+        <el-button type="primary" :disabled="disabled" style="margin-left: 30px;" @click="handleAddList">新增优惠券</el-button>
       </div>
     </div>
-    <el-card v-for="(item,index) in formList" :key="item" class="box-card" style="position: relative;">
+    <el-card v-for="(item,index) in formList" :key="item.key" :data-key="item.key" class="box-card" style="position: relative;margin-bottom: 20px;">
       <el-form :model="item" label-width="100px">
         <el-form-item label="优惠券:" style="margin-bottom: 10px;">
           <el-radio-group v-model="item.radio">
@@ -32,17 +32,15 @@
           <el-button type="primary" :hidden="!hiddenItem" autofocussize="mini" size="mini" icon="el-icon-plus" @click="handleShopDialogVisible(index)">选择供应商</el-button>
           <el-table :data="item.shopData" border :hidden="hiddenItem" width="1000">
             <el-table-column prop="name" label="供应商名称" align="center" width="300" />
-            <el-table-column prop="sname" label="供应商简称" align="center" width="150" />
+            <el-table-column prop="sname" label="供应商简称" align="center" width="200" />
             <el-table-column prop="linkMan" label="联系人" align="center" width="100" />
-            <el-table-column prop="contractMobile" label="手机号" align="center" width="120">
+            <el-table-column prop="contractMobile" label="手机号" align="center" width="150">
               <template slot-scope="{ row }">
                 {{ row.contractMobile ? row.contractMobile : '---' }}
               </template>
             </el-table-column>
-            <el-table-column label="操作" align="center" width="100">
-              <template slot-scope="{ row }">
-                <el-button type="text" @click="deleteShop(row)">删除</el-button>
-              </template>
+            <el-table-column label="操作" align="center">
+              <el-button type="text" @click="deleteShop(index)">删除</el-button>
             </el-table-column>
           </el-table>
         </el-form-item>
@@ -53,18 +51,17 @@
           <span>订单商品总额满：</span>
           <el-input v-model="item.touchPrice" style="width: 150px" size="mini" />
         </el-form-item>
-        <el-form-item label="优惠商品:" :hidden="form.radio === 0 ? false : true" style="margin-bottom: 10px;">
+        <el-form-item label="优惠商品:" :hidden="item.radio === 0 ? false : true" style="margin-bottom: 10px;">
           <el-radio-group v-model="item.productType">
             <el-radio :label="1">全商城商品</el-radio>
             <el-radio :label="2">指定商品</el-radio>
           </el-radio-group>
         </el-form-item>
         <el-form-item :hidden="item.productType === 2 && item.radio === 0 ? false : true" style="margin-bottom: 10px;">
-          <el-button type="primary" size="mini" @click="productList()">添加</el-button>
+          <el-button type="primary" size="mini" @click="dialogGoodVisible = true">添加</el-button>
           <el-form-item :hidden="hiddenProduct">
-            <el-table :data="productTable" border @select="handleSelect">
-              <el-table-column type="selection" width="55" />
-              <el-table-column property="mainImage" label="商品图片" width="150">
+            <el-table :data="item.associateList" border>
+              <el-table-column property="mainImage" label="商品图片" align="center" width="80">
                 <template slot-scope="{ row }">
                   <el-popover
                     placement="top-start"
@@ -77,13 +74,13 @@
                   </el-popover>
                 </template>
               </el-table-column>
-              <el-table-column property="productName" label="商品名称" width="150" />
-              <el-table-column property="shopName" label="供应商" width="150" />
-              <el-table-column property="sort" label="网站状态" width="150" />
-              <el-table-column property="pcStatus" label="小程序状态" width="150" />
-              <el-table-column property="appletsStatus" label="排序" width="150" />
-              <el-table-column property="addTime" label="添加时间" />
-              <el-table-column label="操作">
+              <el-table-column property="name" label="商品名称" align="center" />
+              <el-table-column property="shopName" label="供应商" align="center" width="150" />
+              <el-table-column property="sort" label="网站状态" align="center" width="150" />
+              <el-table-column property="pcStatus" label="小程序状态" align="center" width="150" />
+              <el-table-column property="appletsStatus" label="排序" align="center" width="50" />
+              <el-table-column property="addTime" label="添加时间" align="center" width="100" />
+              <el-table-column label="操作" align="center">
                 <template>
                   <el-button type="text">删除</el-button>
                 </template>
@@ -98,7 +95,7 @@
           </template>
         </el-form-item>
       </el-form>
-      <el-button class="delete_label" icon="el-icon-delete" size="mini" type="danger">删除</el-button>
+      <el-button class="delete_label" :disabled="disabled1" icon="el-icon-delete" size="mini" type="danger" @click="handleDelete(item,index)">删除</el-button>
     </el-card>
     <!-- 供应商弹框 -->
     <shop-dialog v-if="dialogShopVisible" ref="shopDialog" @cancel="handleShopCancel" @confirm="handleShopConfirm" />
@@ -108,7 +105,7 @@
 </template>
 
 <script>
-
+import { svipCoupon } from '@/api/member/member'
 import goodDialog from './components/good-dialog'
 import shopDialog from './components/shop-dialog'
 const defaultForm = {
@@ -137,7 +134,7 @@ export default {
         productType: '', // 优惠商品
         categoryType: '' // 优惠品类
       },
-      shopData: [],
+
       hiddenItem: true,
       dialogTableVisible: false,
       shopTotal: 0,
@@ -147,14 +144,21 @@ export default {
       // 商品列表
       dialogProductVisible: false,
       hiddenProduct: true,
-      productTable: [],
       productTableData: [],
       productTotal: 0,
-      addShopIndex: 0,
+      addIndex: 0,
       dialogShopVisible: false,
       dialogGoodVisible: false
     }
   },
+  computed: {
+    disabled() {
+      return this.formList.length === 5
+    },
+    disabled1() {
+      return this.formList.length === 1
+    }
+  },
   created() {
     this.doctorId = parseInt(this.$route.query.id)
     this.editType = this.$route.query.type || 'edit'
@@ -165,42 +169,28 @@ export default {
   methods: {
     initForm(type) {
       if (type === 'add') {
-        this.formList.push(defaultForm)
+        for (let i = 0; i < 3; i++) {
+          this.formList.push(defaultForm)
+        }
         console.log('formList', this.formList)
       } else {
+        this.svipCoupon(this.doctorId)
         console.log('edit')
       }
     },
+    async svipCoupon(id) {
+      const res = await svipCoupon({ id: id, configure: 0 })
+      console.log('RES', res.data)
+    },
     handleShopDialogVisible(index) {
       // 显示选择供应商弹窗
-      this.addShopIndex = index
+      this.addIndex = index
       this.dialogShopVisible = true
     },
-    // 选择供应商
-    handleSelect(selection, row) {
-      this.$refs.table.clearSelection()
-      this.$refs.table.toggleRowSelection(row)
-      this.rows = row
-      console.log('row', this.rows)
-    },
-    // 确认选择供应商
-    pushShop() {
-      this.shopData.push(this.rows)
-      this.dialogTableVisible = false
-      this.hiddenItem = false
-      this.rows = []
-    },
     // 清除供应商
-    deleteShop() {
+    deleteShop(index) {
       this.hiddenItem = true
-      this.shopData = []
-    },
-    // 添加商品数据
-    pushProduct() {
-      this.productTable.push(this.rows)
-      this.dialogProductVisible = false
-      this.hiddenProduct = false
-      this.rows = []
+      this.formList[index].shopData = []
     },
     // 清除商品数据
     deleteProduct() {
@@ -209,14 +199,22 @@ export default {
     },
     handleShopConfirm(data) {
       // 确认选择供应商
+      console.log('addIndex', this.addIndex)
       console.log('data', data)
-      this.formList[this.addShopIndex].shopData.push(data)
+      this.formList[this.addIndex].shopData.push(data)
+      console.log('shopData', this.formList[this.addIndex].shopData)
       this.hiddenItem = false
       this.handleShopCancel()
     },
     handleGoodConfirm(data) {
       // 确认选择商品
       console.log('data', data)
+      console.log('addIndex', this.addIndex)
+      this.formList[this.addIndex].associateList.push(data)
+      console.log('addIndex', this.formList[this.addIndex])
+      console.log('formList', this.formList)
+      this.hiddenProduct = false
+      this.handleGoodCancel()
     },
     handleShopCancel() {
       // 取消选择供应商
@@ -227,6 +225,14 @@ export default {
       // 取消编辑商品
       this.dialogGoodVisible = false
       this.$refs.goodDialog.visible = false
+    },
+    handleAddList() {
+      // 新增优惠券
+      this.formList.push(defaultForm)
+    },
+    handleDelete(item, index) {
+      // 删除单挑优惠券
+      this.formList.splice(index, 1)
     }
   }
 }