lanan-repair/pages/home/active.vue

<template>
  <view class="container">
    <v-navigation-bar title-color="#333" background-color="#fff" title="活动列表">
    </v-navigation-bar>
    <view class="body">
        <uni-card :title="item.name"  v-for="item in activeList">
          <text class="uni-body">{{ item.remark }}</text>
          <view slot="actions" class="card-actions">
            <picker v-if="item.type=='kkyl'" @change="bindPickerChange" :value="index" :range="array">
              <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>

      </uni-section>
    </view>
  </view>
</template>

<script>
import VNavigationBar from '@/components/VNavigationBar.vue'
import request from "@/utils/request";
import {getUserInfoRequest} from "@/utils/common.js";
import {getToken,setUserInfo} from '@/utils/auth.js'
export default {
  components: {
    VNavigationBar,
  },
  data() {
    return {
      value:"",
      index:0,
      array:[],
      couponList:[],
      orderInfo:{},
      customInfo: {},
      activeList: [],
      //开卡有礼活动id
      kkylActId:"",
      tabList: [{
        value: 0,
        title: '礼包券'
      },
        {
          value: 1,
          title: '卡包'
        }
      ],
      activeKey: 0
    };
  },
  onShow(data) {
    if(!getToken()){
      uni.reLaunch({
        url: '/pages/login/login'
      })
    }else{
      console.log("已登录")
      this.getUserInfos()
    }
  },
  onLoad(data) {
    this.getActive()
  },
  methods: {
    inputDialogToggle(){

    },
    bindPickerChange(e){
      this.index = e.detail.value
      console.log("index",this.index)
      this.joinKkylAct()
    },
    //获取当前登录用户信息
    async getUserInfos() {
      await getUserInfoRequest()
      await this.getActive()
    },
    //查询营销活动列表
    async getActive() {
      this.customInfo = JSON.parse(uni.getStorageSync('customerInfo'))
      const data = {
        cusId: this.customInfo.id
      }
      await request({
        url: '/userClient/customer/activeList',
        method: 'get',
        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
      })
    }


  }
}
</script>

<style lang="less" scoped>
.container {
  height: 100%;
  background-color: #F0F1F5;

  display: flex;
  flex-direction: column;

  .body {
    flex: 1;
    height: 0;
    box-sizing: border-box;
    padding: 30 rpx 0;
    margin: 0 32 rpx;

    display: flex;
    flex-direction: column;
    row-gap: 20 rpx;

    overflow: auto;

  }
}

</style>