活动

pages/home/active.vue

@@ -3,15 +3,26 @@
     <v-navigation-bar title-color="#333" background-color="#fff" title="活动列表">
     </v-navigation-bar>
     <view class="body">
-      <view class="cardItem">
+        <uni-card :title="item.name"  v-for="item in activeList">
-        <view class="cardItemTop" v-for="item in activeList">
+          <text class="uni-body">{{ item.remark }}</text>
-          <view class="cardInfo">
+          <view slot="actions" class="card-actions">
-            <view class="cardName">{{ item.name }}</view>
+            <picker v-if="item.type=='kkyl'" @change="bindPickerChange" :value="index" :range="array">
-            <view class="cardName">{{ item.remark }}</view>
+              <button @click="joinAct(item)" type="primary">参加</button>
+            </picker>
+            <view v-if="item.type!='kkyl'">
+              <button @click="joinAct(item)" v-if="item.isJoin!='1'" type="primary">参加</button>
+              <button @click="joinAct(item)" v-if="item.isJoin=='1'" disabled type="primary">参加</button>
+            </view>
           </view>
+        </uni-card>
+      <uni-section title="输入框示例" type="line" padding>
+        <view class="dialog-box">
+          <text class="dialog-text">输入内容：{{ value }}</text>
         </view>
+        <button class="button" type="primary" @click="inputDialogToggle"><text
+            class="button-text">输入对话框</text></button>
 
-      </view>
+      </uni-section>
     </view>
   </view>
 </template>
@@ -27,9 +38,15 @@ export default {
   },
   data() {
     return {
-
+      value:"",
+      index:0,
+      array:[],
+      couponList:[],
+      orderInfo:{},
       customInfo: {},
       activeList: [],
+      //开卡有礼活动id
+      kkylActId:"",
       tabList: [{
         value: 0,
         title: '礼包券'
@@ -51,22 +68,29 @@ export default {
       console.log("已登录")
       this.getUserInfos()
     }
-    this.customInfo = JSON.parse(uni.getStorageSync('customerInfo'))
-	  this.getActive()
   },
   onLoad(data) {
     this.getActive()
   },
   methods: {
+    inputDialogToggle(){
+
+    },
+    bindPickerChange(e){
+      this.index = e.detail.value
+      console.log("index",this.index)
+      this.joinKkylAct()
+    },
     //获取当前登录用户信息
     async getUserInfos() {
-      getUserInfoRequest()
+      await getUserInfoRequest()
+      await this.getActive()
     },
     //查询营销活动列表
     async getActive() {
-      let customInfo = JSON.parse(uni.getStorageSync('customerInfo'))
+      this.customInfo = JSON.parse(uni.getStorageSync('customerInfo'))
       const data = {
-        cusId: customInfo.id
+        cusId: this.customInfo.id
       }
       await request({
         url: '/userClient/customer/activeList',
@@ -74,11 +98,75 @@ export default {
         params:data
       }).then((res) => {
         this.activeList = res.data
+        for(var i = 0; i < this.activeList.length; i++) {
+          if(this.activeList[i].type=="kkyl"){
+            this.kkylActId = this.activeList[i].id
+             request({
+              url: "/userClient/customer/getActive",
+              method: "get",
+              params:{id:this.activeList[i].id}
+            }).then((res) => {
+              if(res.data.hasOwnProperty("couponList")&&res.data.couponList.length>0){
+                this.couponList = res.data.couponList
+                for(var i = 0; i < res.data.couponList.length; i++) {
+                  var coupon = res.data.couponList[i]
+                  this.array.push(coupon.name+"("+coupon.amount+")")
+                }
+                this.$forceUpdate()
+              }
+            })
+          }
+        }
       })
 
-    }
+    },
+    /**
+     * 参加活动
+     * @param item
+     * @returns {Promise<void>}
+     */
+    async joinAct(item){
+      let dataObj = {}
+      let url = ""
+      let method = "POST"
+      if(item.type == 'zcyl'){
+        //注册有礼
+        dataObj.cusId = this.customInfo.id
+        dataObj.activeId = item.id
+        url = "/userClient/customer/attendActive"
+        await request({
+          url: url,
+          method: method,
+          data:dataObj
+        }).then((res) => {
+          console.log(res);
+          this.orderInfo = res.data
+        })
+      }else if(item.type == 'kkyl'){
+        //开卡有礼
 
-    //参与营销活动
+      }
+
+    },
+    /**
+     * 参加开卡有礼活动
+     * @returns {Promise<void>}
+     */
+    async joinKkylAct(){
+      let dataObj = {}
+      dataObj.cusId = this.customInfo.id
+      dataObj.activeId = this.kkylActId
+      dataObj.accountType='01'
+      dataObj.selectCoupon=[this.couponList[this.index]]
+      await request({
+        url: "/userClient/customer/attendActive",
+        method: "POST",
+        data:dataObj
+      }).then((res) => {
+        console.log(res);
+        this.orderInfo = res.data
+      })
+    }
 
 
   }
@@ -106,138 +194,7 @@ export default {
 
     overflow: auto;
 
-
-    .cardItem {
-      background: #FFFFFF;
-      border-radius: 16 rpx 16 rpx 16 rpx 16 rpx;
-      padding: 30 rpx;
-    }
-
-    .cardItemTop {
-      display: flex;
-      align-items: center;
-      column-gap: 16 rpx;
-      padding-bottom: 32 rpx;
-      border-bottom: 1px solid #ddd;
-    }
-
-    .cardImg {
-      width: 136 rpx;
-      height: 100 rpx;
-      background-color: #efefef;
-
-      display: flex;
-      align-items: center;
-      justify-content: center;
-
-      position: relative;
-
-      .cardImgText {
-        color: #fff;
-        font-size: 24 rpx;
-        position: relative;
-        z-index: 2;
-      }
-
-      .cardImgBg {
-        position: absolute;
-        width: 100%;
-        height: 100%;
-        top: 0;
-        left: 0;
-        z-index: 1;
-      }
-    }
-
-    .cardInfo {
-      flex: 1;
-      width: 0;
-      display: flex;
-      flex-direction: column;
-      justify-content: space-between;
-
-      padding: 6 rpx 0;
-
-      .cardName {
-        font-size: 32 rpx;
-        color: #333333;
-      }
-
-      .cardEndDate {
-        font-size: 24 rpx;
-        color: #999999;
-      }
-    }
-
-    .cardInfoRight {
-      display: flex;
-      flex-direction: column;
-      align-items: center;
-      justify-content: center;
-      font-size: 24 rpx;
-      color: #FC4D4A;
-
-      .cardNumValue {
-        font-size: 64 rpx;
-      }
-
-      .cardLabel {
-        color: #999999;
-      }
-    }
-  }
-
-  .cardItemBottom {
-    display: flex;
-    align-items: center;
-    justify-content: space-between;
-    padding: 30 rpx 0 0;
-
-    .useSm {
-      font-size: 24 rpx;
-      color: #999999;
-    }
-
-    .useBtn {
-      width: 144 rpx;
-      height: 60 rpx;
-      border-radius: 30 rpx 30 rpx 30 rpx 30 rpx;
-      border: 1 rpx solid #FC4D4A;
-      font-size: 28 rpx;
-      color: #FC4D4A;
-      display: flex;
-      align-items: center;
-      justify-content: center;
-    }
   }
 }
 
-.tabbar {
-  background-color: #fff;
-  display: flex;
-  align-items: center;
-
-  .tabItem {
-    flex: 1;
-    width: 0;
-
-    display: flex;
-    justify-content: center;
-    padding: 30 rpx 0;
-
-    position: relative;
-  }
-
-  .activeLine {
-    width: 52 rpx;
-    height: 8 rpx;
-    background: #009EDA;
-    border-radius: 4 rpx 4 rpx 4 rpx 4 rpx;
-
-    position: absolute;
-    left: 50%;
-    bottom: 2 rpx;
-    transform: translate(-50%, 0);
-  }
-}
 </style>