<style>
.active_List {
  height: 100vh;
  padding: 30rpx;
  position: relative;
}

.active_BtnList {
  position: absolute;
  bottom: 30rpx;
  width: 100%;
  display: flex;
}
</style>
<template>
  <view class="active_List">
    <checkbox-group @change="checkboxChange">
      <label
        class="uni-list-cell uni-list-cell-pd"
        v-for="(item, index) in activeList"
        :key="index"
      >
        <view style="margin-bottom: 30rpx">
          <checkbox :value="index" :checked="item.checked" />
          <text>{{ item.ActivityTypeName }}</text>
        </view>
      </label>
    </checkbox-group>
    <view class="active_BtnList">
      <u-button
        size="80"
        :ripple="true"
        shape="circle"
        :custom-style="{
          backgroundColor: mc,
          height: '80rpx',
          color: '#FFF',
          fontSize: '14px',
          margin: '0 3vw',
          width: '40vw',
        }"
        @click="goSignUp()"
        >立即报名</u-button
      >
      <u-button
        size="80"
        :ripple="true"
        shape="circle"
        :custom-style="{
          backgroundColor: mc,
          height: '80rpx',
          color: '#FFF',
          fontSize: '14px',
          margin: '0 3vw',
          width: '40vw',
        }"
        >查看报名</u-button
      >
    </view>
  </view>
</template>

<script>
export default {
  components: {},
  data() {
    return {
      mc: "",
      activeList: [],
      msg: {
        ActivityIds: "7,8,9",
      },
    };
  },
  created() {},
  mounted() {
    this.mc = this.$uiConfig.mainColor;
    this.getData();
  },
  onLoad(option) {
    if (option) {
    }
  },
  methods: {
    checkboxChange(e) {},
    //跳转立即报名
    goSignUp() {
      uni.navigateTo({
        url: "/pages/kotra/activeSignUp",
      });
    },
    getData() {
      this.request2(
        {
          url: "/api/AppletTrade/GetActivityList",
          data: this.msg,
        },
        (res) => {
          if (res.resultCode == 1) {
            console.log(res, "数据");
            this.activeList = res.data;
          }
        }
      );
    },
  },
};
</script>

<style>
</style>
