<template>
  <div
    ref="pointsPk"
    @click="styleClick('click', 'pointsPk')"
    @mousemove="styleClick('mousemove', 'pointsPk')"
    @mouseout="styleClick('mouseout')"
  >
    <!-- 活动未开始 -->
    <div v-if="activityStatus == 1">
      <div :style="styleData.coupondiv">
        <ul class="couponul">
          <li class="couponlistitem" :style="styleData.couponlistitem">
            <div class="itemTitle" :style="styleData.itemTitle">
              {{ topicTitle }}
            </div>
            <div
              class="itemImg"
              :style="[styleData.itemImg, styleData.itemImgA]"
            >
              <div class="imgDiv" :style="styleData.imgDiv">
                <img
                  :style="styleData.showImageLeftSrc"
                  :src="showImageLeftSrc"
                />

                <div
                  class="descJx"
                  :style="[styleData.imgDivcheckdiv, styleData.descJxgary]"
                >
                  {{ leftImgDesc }}
                </div>
              </div>
              <div class="imgDiv" :style="styleData.imgDiv">
                <img
                  :style="styleData.showImageLeftSrc"
                  :src="showImageRightSrc"
                />

                <div
                  class="descJx"
                  :style="[styleData.imgDivcheckdiv, styleData.descJxgary]"
                >
                  {{ rightImgDesc }}
                </div>
              </div>
              <img :style="styleData.pkImgs" :src="styleData.pkImgs.imageUrl" />
            </div>
            <div
              class="title"
              :style="[styleData.title, styleData.startTimetitle]"
            >
              {{ startTime }}开始
            </div>
            <div :style="styleData.startTimenextdiv"></div>
          </li>
        </ul>
      </div>
    </div>
    <!--进行中-->
    <div v-if="activityStatus == 2">
      <div>
        <div :style="styleData.couponuldiving">
          <ul class="couponul">
            <li
              class="couponlistitem"
              v-if="joinStatus == 0"
              :style="styleData.couponlistitem"
            >
              <div class="itemTitle" :style="styleData.itemTitle">
                {{ topicTitle }}
              </div>
              <div
                class="itemImg"
                :style="[styleData.itemImg, styleData.itemImgB]"
              >
                <div class="imgDiv" :style="styleData.imgDiv">
                  <img
                    :style="styleData.showImageLeftSrc"
                    :src="showImageLeftSrc"
                  />
                  <div
                    :style="[
                      styleData.imgDivcheckdiv,
                      styleData.imgDivcheck,
                      styleData.imgDivcheck1,
                    ]"
                    @click="radioClick(1)"
                  >
                    <span v-if="voteChoices != 1">选我</span>
                    <img
                      v-if="voteChoices == 1"
                      style="width: 0.26rem; height: 0.19rem;"
                      src="//img10.360buyimg.com/imgzone/jfs/t1/8708/29/14463/267/5c64da6aE68d9ad32/903fa6f6006ac6b3.png"
                      alt=""
                    />
                    <!-- <span
                      ><input
                        type="radio"
                        name="vote"
                        class="input_check1"
                        :style="styleData.inputCheck1"
                        id="check2"
                        value="1" /><label for="check2"></label
                    ></span> -->
                  </div>
                </div>
                <div class="imgDiv" :style="styleData.imgDiv">
                  <img
                    :style="styleData.showImageLeftSrc"
                    :src="showImageRightSrc"
                  />
                  <div
                    :style="[
                      styleData.imgDivcheckdiv,
                      styleData.imgDivcheck,
                      styleData.imgDivcheck2,
                    ]"
                    @click="radioClick(2)"
                  >
                    <span v-if="voteChoices != 2">选我</span>
                    <img
                      v-if="voteChoices == 2"
                      style="width: 0.26rem; height: 0.19rem;"
                      src="//img10.360buyimg.com/imgzone/jfs/t1/8708/29/14463/267/5c64da6aE68d9ad32/903fa6f6006ac6b3.png"
                      alt=""
                    />
                    <!-- <span
                      ><input
                        type="radio"
                        
                        class="input_check1"
                        name="vote"
                        id="check3"
                        value="2" /><label for="check3"></label
                    ></span> -->
                  </div>
                </div>
                <img
                  class="pkImgs"
                  :style="styleData.pkImgs"
                  :src="styleData.pkImgs.imageUrl"
                />
              </div>
              <div :style="styleData.leftImgDescdiv">
                <p :style="styleData.imgDes" class="imgDes">
                  {{ leftImgDesc }}
                </p>
                <p
                  :style="[styleData.imgDes, styleData.imgDescolor]"
                  class="imgDes"
                >
                  {{ rightImgDesc }}
                </p>
              </div>
              <div :style="styleData.showResultDaysdivingdiv">
                <div :style="styleData.showResultDaysdiving">
                  {{ showResultDays }}开奖
                </div>
                <div :style="styleData.costPointdiv">
                  {{ costPoint }}积分/票,胜方瓜分<span
                    class="orangeF"
                    :style="styleData.orangeF"
                    >{{ totalPoints }}</span
                  >积分
                </div>
              </div>
              <div
                class="callPked"
                @click="joinActivity()"
                :style="styleData.callPked"
              >
                <div v-if="needFollow == 1">
                  关注店铺 {{ costPoint }}积分打call
                </div>

                <div v-else>{{ costPoint }}积分打call</div>
              </div>
              <div :style="styleData.Frienddiv">
                <div
                  v-if="isWebClick"
                  class="shareFriend"
                  :style="styleData.shareFriend"
                >
                  邀请好友一起玩
                </div>
                <div
                  v-else
                  class="shareFriend"
                  :style="styleData.shareFriend"
                  v-lz-click="'2'"
                  @click="shareActivity"
                >
                  邀请好友一起玩
                </div>
              </div>
              <div :style="styleData.lienddiv"></div>
            </li>

            <li
              class="couponlistitem"
              v-if="joinStatus == 1"
              :style="styleData.couponlistitem"
            >
              <div class="itemTitle" :style="styleData.itemTitle">
                {{ topicTitle }}
              </div>
              <div
                class="itemImg"
                :style="[styleData.itemImg, styleData.itemImgC]"
              >
                <div class="imgDiv" :style="styleData.imgDiv">
                  <img
                    :style="styleData.showImageLeftSrcdiv"
                    :src="showImageLeftSrc"
                  />
                  <span :style="[styleData.imgDEsr, styleData.imgDEsrleft]">
                    {{ leftPercent }}%
                  </span>
                  <div
                    v-if="voteChoices == 1"
                    class="descJx"
                    :style="[styleData.imgDivcheckdiv, styleData.imgDivcheck1]"
                  >
                    已选
                  </div>
                </div>
                <div class="imgDiv" :style="styleData.imgDiv">
                  <img
                    :style="styleData.showImageLeftSrcdiv"
                    :src="showImageRightSrc"
                  />
                  <span :style="[styleData.imgDEsr, styleData.imgDEsrright]">
                    {{ rightPercent }}%
                  </span>
                  <div
                    v-if="voteChoices == 2"
                    class="descJx"
                    :style="[styleData.imgDivcheckdiv, styleData.imgDivcheck2]"
                  >
                    已选
                  </div>
                </div>
                <img
                  class="pkImgs"
                  :style="styleData.pkImgs"
                  :src="datas.pkImgs"
                />
              </div>
              <div :style="styleData.imgDesdiv">
                <p :style="styleData.imgDes" class="imgDes">
                  {{ leftImgDesc }}
                </p>
                <p
                  :style="[styleData.imgDes, styleData.imgDescolor]"
                  class="imgDes"
                >
                  {{ rightImgDesc }}
                </p>
              </div>
              <div :style="styleData.orangeFdiv">
                <div
                  class="orangeF"
                  :style="[styleData.orangeF, styleData.orangeFcall]"
                >
                  打call成功，等待揭晓
                </div>
                <div :style="styleData.orangeFtotalPointsdiv">
                  胜方瓜分<span class="orangeF" :style="styleData.orangeF1">{{
                    totalPoints
                  }}</span
                  >积分
                </div>
                <div :style="styleData.showResultDaysdiv">
                  {{ showResultDays }}开奖
                </div>
              </div>
              <div :style="styleData.shareFrienddiv">
                <div
                  v-if="isWebClick"
                  class="shareFriend"
                  :style="styleData.shareFriend"
                >
                  邀请好友一起玩
                </div>
                <div
                  v-else
                  class="shareFriend"
                  :style="styleData.shareFriend"
                  v-lz-click="'2'"
                  @click="shareActivity"
                >
                  邀请好友一起玩
                </div>
              </div>
              <div :style="[styleData.enddiv, styleData.enddiv1]"></div>
            </li>
          </ul>
        </div>
      </div>
    </div>
    <!--活动结束-->
    <div v-if="activityStatus == 4 || activityStatus == 3">
      <div :style="styleData.couponuldiv">
        <ul class="couponul">
          <li class="couponlistitem" :style="styleData.couponlistitem">
            <div class="itemTitle" :style="styleData.itemTitle">
              {{ topicTitle }}
            </div>
            <div class="itemImg" :style="styleData.itemImg">
              <div class="imgDiv" :style="styleData.imgDiv">
                <img
                  :style="styleData.showImageLeftSrcdiv"
                  :src="showImageLeftSrc"
                />
                <img
                  class="choose"
                  :style="styleData.choose"
                  v-if="voteChoices == 1"
                  :src="styleData.choose.imageUrl"
                />
                <p
                  class="detailT"
                  :style="[
                    styleData.detailT,
                    voteChoices != 0 || voteChoices != 0
                      ? styleData.blueBg
                      : '',
                  ]"
                >
                  <span class="tiket" :style="styleData.tiket"
                    >{{ choseLeftMans }}票</span
                  >
                  <span class="descri" :style="styleData.descri">{{
                    leftImgDesc
                  }}</span>
                  <img
                    v-if="pkResult == 1"
                    class="winImg"
                    :style="styleData.winImg"
                    :src="styleData.winImg.imageUrl"
                  />

                  <img
                    v-if="pkResult == 2"
                    class="winImg"
                    :style="styleData.defeatImg"
                    :src="styleData.defeatImg.imageUrl"
                  />
                  <img
                    v-if="pkResult == 3"
                    class="winImg"
                    :style="styleData.flatImg"
                    :src="styleData.flatImg.imageUrl"
                  />
                </p>
              </div>
              <div class="imgDiv" :style="styleData.imgDiv">
                <img
                  :style="styleData.showImageLeftSrcdiv"
                  :src="showImageRightSrc"
                />
                <img
                  :style="[styleData.choose, styleData.choosewidth]"
                  :src="styleData.choose.imageUrl"
                  v-if="voteChoices == 2"
                />
                <p
                  class="detailT"
                  :style="[
                    styleData.detailT,
                    voteChoices != 0 || voteChoices != 0
                      ? styleData.pinkBg
                      : '',
                  ]"
                >
                  <span class="tiket" :style="styleData.tiket"
                    >{{ choseRightMans }}票</span
                  >
                  <span class="descri" :style="styleData.descri">{{
                    rightImgDesc
                  }}</span>
                  <img
                    v-if="pkResult == 2"
                    class="winImg"
                    :style="styleData.winImg"
                    :src="styleData.winImg.imageUrl"
                  />
                  <img
                    v-if="pkResult == 1"
                    class="winImg"
                    :style="styleData.defeatImg"
                    :src="styleData.defeatImg.imageUrl"
                  />

                  <img
                    v-if="pkResult == 3"
                    class="winImg"
                    :style="styleData.flatImg"
                    :src="styleData.flatImg.imageUrl"
                  />
                </p>
              </div>
            </div>
            <div :style="styleData.joinStatusdiv">
              <div v-if="joinStatus == 0">
                <div
                  class="pools"
                  :style="[styleData.pools, styleData.poolslheight]"
                  v-if="pkResult == 3"
                >
                  活动已结束<br />
                </div>
                <div
                  class="pools"
                  :style="[styleData.pools, styleData.poolslheight]"
                  v-else
                >
                  活动已结束<br />
                  胜方已经瓜分
                  <span class="orangeF" :style="styleData.orangeF">{{
                    totalPoints
                  }}</span
                  >积分
                </div>
              </div>
              <div v-if="joinStatus == 1">
                <div
                  v-if="activityStatus == 3"
                  class="pools"
                  :style="styleData.pools"
                >
                  活动已结束
                </div>
                <div v-if="activityStatus == 4">
                  <div
                    v-if="
                      (pkResult == 1 && voteChoices == 1) ||
                      (pkResult == 2 && voteChoices == 2)
                    "
                  >
                    <div class="orangeF" :style="styleData.congratulations">
                      恭喜PK获胜
                    </div>
                    <div :style="styleData.congratulationsdiv">
                      获得<span class="orangeF" :style="styleData.orangeF2">{{
                        showApiecePointOfJoins
                      }}</span
                      >积分
                    </div>
                    <div
                      :style="styleData.getPointStatusdiv"
                      v-if="getPointStatus == 0"
                    >
                      {{ canTakePrizeDays }}通道关闭
                    </div>
                    <div v-if="getPointStatus == 0">
                      <div @click="pointsGrant" :style="styleData.suBtn">
                        猛戳领取
                      </div>
                    </div>
                    <div
                      class="orangeF"
                      :style="[styleData.orangeF, styleData.Fierce]"
                      v-if="getPointStatus == 2"
                    >
                      奖品已领取
                    </div>
                  </div>
                  <div
                    v-else-if="
                      (pkResult == 1 && voteChoices == 2) ||
                      (pkResult == 2 && voteChoices == 1)
                    "
                    class="pools"
                    :style="styleData.pools"
                  >
                    很遗憾，PK失败
                  </div>
                  <div
                    v-else-if="pkResult == 3"
                    class="pools"
                    :style="styleData.pools"
                  >
                    {{ costPoint }}积分已返回
                  </div>
                </div>
              </div>

              <div :style="styleData.enddiv"></div>
            </div>
          </li>
        </ul>
      </div>
    </div>
  </div>
</template>
<script>
import dateUtil from "../../../util/dateUtil.js";
import { FollowShopnotWinPrizePopComService } from "../../../util/comCreate.js";
import store from "../../../store/store";
import { goToShopPage } from "../../../util/tools.js";
import { allShare } from "../../../js/share.js";
import apis1 from "../../../util/apis1.js";
let { getPkInfo, savePkResult, pointsGrant, followShop,storeGoodsPoint } = apis1;
export default {
  props: [
    "isTemplate",
    "datas",
    "keyData",
    "styleData",
    "templateData",
    "isWebClick",
    "modifyContent",
  ],
  components: {},
  data() {
    return {
      topicTitle: "", // pK标题
      showImageLeftSrc: "", // 左边图片
      showImageRightSrc: "", // 右边图片
      rightImgDesc: "", // 右边描述
      leftImgDesc: "", // 左边描述
      costPoint: "", // 用户投入积分
      joinStatus: "", // 0未打call 1打call
      activityStatus: "1", // 1活动未开始 2、活动开始 3、活动结束 4、活动领奖
      leftPercent: "", // 左边百分比 打call以后显示
      rightPercent: "", // 右边百分比 打call以后显示
      pkResult: "", // pk 结果 1、获胜 2、失败 3、平局
      canTakePrizeDays: "", // 活动领奖 结束
      showResultDays: "", // 开奖时间
      getPointStatus: "", //  获取是否领取积分0 未领取 2 领取

      showApiecePointOfJoins: "", //发放积分
      voteChoices: "", // 选择哪一个
      choseLeftMans: "", // 票数 活动结束后显示
      choseRightMans: "", //票数 活动结束后显示
      startTime: "", // 活动开始时间
      totalPoints: "", //瓜分积分
      needFollow: "", // 是否关注店铺
      isCustomSwitching: 1,
    };
  },

  mounted() {
    console.log("asf");
    //深拷贝重置需要
    this.styleDataOld = JSON.parse(JSON.stringify(this.styleData));
    this.initData();
    //b端点击
    if (this.isWebClick) {
      this.publicData.$on("clickPointsPk", (isCustomSwitching, refName) => {
        if (isCustomSwitching == 1) {
          this.activityStatus = 2;
          this.joinStatus = 0;
          this.voteChoices = "";
          this.isCustomSwitching = isCustomSwitching;
          // this.styleClick("click", refName);
        } else if (isCustomSwitching == 2) {
          this.activityStatus = 2;
          this.joinStatus = 1;
          this.voteChoices = 1;
          this.leftPercent = 100;
          this.rightPercent = 0;
          this.isCustomSwitching = isCustomSwitching;
        } else {
          this.activityStatus = 4;
          this.joinStatus = 1;
          this.voteChoices = 1;
          this.choseLeftMans = 1;
          this.choseRightMans = 0;
          this.pkResult = 1;
          this.showApiecePointOfJoins = 2;
          this.canTakePrizeDays = dateUtil.formatTime(
            new Date().getTime(),
            "yyyy-MM-dd hh:mm"
          );
          this.isCustomSwitching = isCustomSwitching;
        }
      });
    }
  },

  methods: {
    //点击可修改位置的方法
    styleClick(type, refName) {
      if (this.isWebClick) {
        //传值给B端
        let byValue = {
          modifyContent: this.modifyContent,
          refName: refName,
          styleData: this.styleData,
          c_this: this,
          styleDataOld: this.styleDataOld,
          isCustomSwitching: this.isCustomSwitching,
        };
        this.$emit("opertaionCom", type, byValue);
      }
    },
    radioClick(val) {
      if (this.voteChoices == val) {
        return;
      } else {
        this.voteChoices = val;
      }
    },

    async initData() {
      var datasAll = this.templateData;
      if (this.isTemplate == true) {
        this.activityStatus = 2;
        if (datasAll) {
          this.topicTitle = datasAll.pkData.pkTheme;
          this.leftImgDesc = datasAll.pkData.pkFirDescribe;
          this.rightImgDesc = datasAll.pkData.pkSecDescribe;
          this.showImageLeftSrc = datasAll.pkData.pkFirImg;
          this.showImageRightSrc = datasAll.pkData.pkSecImg;
          this.costPoint = datasAll.drawChanceData.integral;
          this.needFollow = datasAll.activeConditions.involvementFlag;
          this.totalPoints = datasAll.drawChanceData.businessIntegral;
          this.showResultDays = dateUtil.formatTime(
            datasAll.activity.startTime,
            "yyyy-MM-dd hh:mm"
          );
        } else {
          this.topicTitle = "猫可爱还是狗可爱";
          this.leftImgDesc = "狗可爱";
          this.rightImgDesc = "猫可爱";
          this.showImageLeftSrc =
            "https://img10.360buyimg.com/imgzone/jfs/t1/21063/32/6952/132931/5c66876bEb010b2c2/31782cbd69ac81f2.png";
          this.showImageRightSrc =
            "https://img10.360buyimg.com/imgzone/jfs/t1/14045/40/6978/138035/5c668788E8abcaae6/7c7ae791c61399f4.png";
          this.costPoint = 5;
          this.needFollow = 0;
          this.totalPoints = 100;
          this.showResultDays = dateUtil.formatTime(
            new Date().getTime(),
            "yyyy-MM-dd hh:mm"
          );
        }
      } else {
        getPkInfo((datas) => {
          this.activityStatus = "";
          this.topicTitle = datas.data.pkTheme;
          this.showImageLeftSrc = datas.data.pkFirImg;
          this.showImageRightSrc = datas.data.pkSecImg;
          this.leftImgDesc = datas.data.pkFirDescribe;
          this.rightImgDesc = datas.data.pkSecDescribe;
          this.startTime = dateUtil.formatTime(
            datas.data.activityStartTime,
            "yyyy-MM-dd hh:mm"
          );
          this.activityStatus = datas.data.activityType;
          this.showResultDays = dateUtil.formatTime(
            datas.data.openingTime,
            "yyyy-MM-dd hh:mm"
          );
          this.getPointStatus = datas.data.pointsStatus;
          this.totalPoints = datas.data.businessIntegral;
          this.costPoint = datas.data.integral;
          this.joinStatus = datas.data.joinStatus;
          this.voteChoices = datas.data.voteChoices;
          this.leftPercent = datas.data.leftPercent;
          this.rightPercent = datas.data.rightPercent;
          this.pkResult = datas.data.pkResult;
          console.log(this.pkResult);
          this.choseLeftMans = datas.data.choseLeftMans;
          this.choseRightMans = datas.data.choseRightMans;
          this.showApiecePointOfJoins = datas.data.showApiecePointOfJoins;
          this.canTakePrizeDays = dateUtil.formatTime(
            datas.data.canTakePrizeDays,
            "yyyy-MM-dd hh:mm"
          );
          this.needFollow = datas.data.needFllow;

          // var timeDiff =
          //   parseInt(
          //     new Date(datas.data.openingTime).getTime() - new Date().getTime()
          //   ) + "";
          // console.log(timeDiff);
          // // 开奖时间到自动领奖
          // if (timeDiff > 0) {
          //   var a = setInterval(() => {
          //     //重新请求
          //     this.initData();
          //     clearInterval(a);
          //   }, parseInt(timeDiff));
          // }

          console.log(datas);
        });
      }
    },

    // 积分领取
    pointsGrant() {
      if (this.isTemplate) {
        this.$toast("活动预览，仅供查看");
        return;
      }

      pointsGrant((data) => {
        this.$toast("积分领取成功");
        this.getPointStatus = "2";
      });
    },

    // 积分打call
    joinActivity() {
      if (this.isTemplate) {
        this.$toast("活动预览，仅供查看");
        return;
      }
      console.log(this.voteChoices);
      if (this.voteChoices != 1 && this.voteChoices != 2) {
        this.$toast("请选择一个选项，为Ta打call吧");
        return false;
      }
      var _this = this;
      if (this.needFollow == 1) {
        followShop((initdatas) => {});
      }
      savePkResult(this.voteChoices, (data) => {
        if (data.resp_code == 50009) {
          this.$toast("活动已结束");
          return;
        }
        if (data.data == 1) {
          _this.toast("参加成功！");
          _this.initData();
        } else if (data.data == 2) {
          FollowShopnotWinPrizePopComService.create(
            "积分不足",
            "https://img10.360buyimg.com/imgzone/jfs/t18640/237/360861051/18605/7bbde14/5a7126a4Nfb005ae2.png",
            (submit) => {
              FollowShopnotWinPrizePopComService.close();
              // this.voteChoices = 0;
            }
          );
        } else {
          _this.$toast("活动火爆中，请稍后再试");
          // _this.initData();
        }
      });
    },
    // 进入店铺
    enterstore() {
      console.log("aaaa");
      if (this.isTemplate) {
        this.$toast("活动预览，仅供查看");
        return;
      }
      document.querySelector("body").removeAttribute("style");
      console.log("进入商店");
      let shopId = store.state.shopId;
      storeGoodsPoint(4)
      goToShopPage(shopId);
    },

    //邀请好友
    shareActivity() {
      if (this.isTemplate) {
        this.$toast("活动预览，仅供查看");
        return;
      }
      let actStatus = sessionStorage.getItem("actStatus");

      if (!this.isTemplate) {
        if (actStatus == 2) {
          // Toast
          this.$toast("活动已结束");
          return;
        }
        if (actStatus == 1) {
          this.$toast("活动尚未开始");
          // Toast('活动尚未开始');
          return;
        }
        if (actStatus == 3) {
          // Toast('活动正在惊醒中');
          // this.share = 1
          allShare(this.isTemplate, this, (callBackData) => {
            console.log(callBackData, "callBackData");
          });
        }
      } else {
        this.$toast("活动预览，仅供查看");
      }
    },
  },
};
</script>
<style lang="scss" scoped>
.couponul {
  margin: 0rem 0.3rem;
}

// .couponlistitem {
//   /*height:5.6rem;*/
//   border-bottom: 1px solid #eee;
//   background: #fff;
//   margin-bottom: 0.2rem;
//   position: relative;
//   border-radius: 5px;
// }
// .couponlistitem .itemTitle {
//   height: 0.7rem;
//   line-height: 1.1rem;
//   font-size: 0.30rem;
//   /*border-bottom:1px solid #f2f2f2;*/
//   padding: 0rem 0.3rem;
//   font-family: "微软雅黑";
//   text-align: center;
//   color: #333;
//   font-weight: bold;
// }
// .couponlistitem .itemImg {
//   display: flex;
//   padding: 0rem 0.2rem;
//   height: 3.8rem;
//   margin-top: 0.3rem;
//   position: relative;
//   justify-content: space-between;
// }
// .couponlistitem .itemImg .imgDiv {
//   width: 3.2rem;
//   position: relative;
//   height: 2.6rem;
// }
// .couponlistitem .itemImg .imgDiv img {
//   -webkit-border-radius: 5px;
//   -moz-border-radius: 5px;
//   border-radius: 5px;
// }
// .couponlistitem .itemImg .imgDiv div {
//   position: absolute;
//   left: 0.3rem;
//   bottom: -0.3rem;
//   border-radius: 3.25rem;
//   height: 0.65rem;
//   text-align: center;
//   line-height: 0.65rem;
//   color: #ffffff;
//   background: #0199fa;
//   width: 2.6rem;
//   padding: 0rem 0.1rem;
//   font-size: 0.24rem;
//   overflow: hidden;
//   text-overflow: ellipsis;
//   white-space: nowrap;
// }
// .couponlistitem .itemImg .imgDiv div.descYjs {
//   color: #333;
//   background: #fff;
// }

// .couponlistitem .pkImgs {
//   position: absolute;
//   top: 1rem;
//   left: 50%;
//   transform: translate(-50%);
//   width: 0.57rem;
//   height: 0.62rem;
// }
// .pkImgs {
//   position: absolute;
//   left: 45%;
//   top: 29%;
// }
// .pkImgs {
//   position: absolute;
//   top: 0.9rem;
//   left: 45%;
//   height: 0.88rem;
//   width: 0.88rem;
// }
// .couponKind {
//   float: left;
//   width: 3.6rem;
//   height: 1rem;
// }
// .couponKind img {
//   height: 0.7rem;
//   margin-top: 0.15rem;
//   float: left;
// }
// .couponKind .adiv {
//   float: left;
//   width: 2.4rem;
//   overflow: hidden;
//   white-space: nowrap;
//   text-overflow: ellipsis;
//   margin-left: 0.2rem;
//   margin-top: 0.32rem;
//   font-size: 0.28rem;
//   color: #333;
// }
// .title {
//   color: #666;
//   font-size: 0.24rem;
//   text-align: center;
// }
// .check1 {
//   position: absolute;
//   height: 0.6rem;
//   text-align: center;
//   line-height: 0.6rem;
//   color: #333;
//   background: #f66cff;
//   width: 50%;
//   font-size: 0.2rem;
// }
// .flexCon .check1 {
//   position: absolute;
//   left: 0rem;
//   bottom: 0rem;
//   height: 0.6rem;
//   text-align: center;
//   line-height: 0.6rem;
//   color: #333;
//   background: #f66cff;
//   width: 100%;
//   font-size: 0.2rem;
// }
/*改变checkbox的样式*/
.input_check1 {
  position: absolute;
  width: 0.35rem;
  height: 0.35rem;
  visibility: hidden;
  background: #e92333;
}

span {
  position: relative;
}

.input_check1 + label {
  display: inline-block;
  width: 0.48rem;
  height: 0.23rem;
  background: url("//img10.360buyimg.com/imgzone/jfs/t1/16864/36/6919/798/5c64da62E85bbc1f3/b6c8f808ad128c9f.png")
    no-repeat center;
  background-size: 100%;
  float: left;
  margin-top: 0.21rem;
  margin-left: 0.355rem;
}

.input_check1:checked + label {
  width: 0.26rem;
  height: 0.19rem;
  background: url("//img10.360buyimg.com/imgzone/jfs/t1/8708/29/14463/267/5c64da6aE68d9ad32/903fa6f6006ac6b3.png")
    no-repeat center;
  background-size: 100%;
  margin-top: 0.25rem;
  margin-left: 0.45rem;
}
// .winImg {
//   position: absolute;
//   right: 0.2rem;
//   top: 0rem;
//   width: 0.6rem;
//   height: 0.6rem;
// }
// .imgDEsr {
//   position: absolute;
//   width: 3.2rem;
//   height: 2.6rem;
//   line-height: 2.6rem;
//   text-align: center;
//   background: rgba(0, 0, 0, 0.6);
//   /*opacity: 0.6;*/
//   color: #fff;
//   border-radius: 5px;
// }
// .imgDes {
//   text-align: center;
//   font-size: 0.3rem;
//   color: #0199fa;
//   height: 0.5rem;
//   line-height: 0.5rem;
//   float: left;
//   width: 50%;
// }
// .callPked {
//   width: 6.3rem;
//   height: 0.8rem;
//   line-height: 0.8rem;
//   background: #478cfe;
//   text-align: center;
//   font-size: 0.36rem;
//   color: #fff;
//   border-radius: 0.4rem;
//   margin-left: 0.3rem;
// }
// .shareFriend {
//   width: 6.3rem;
//   height: 0.8rem;
//   line-height: 0.8rem;
//   border-radius: 0.4rem;
//   text-align: center;
//   font-size: 0.36rem;
//   border: 1px solid #0083ff;
//   color: #0083ff;
//   background: #fff;
//   margin-bottom: 0.5rem;
// }
// .orangeF {
//   color: #ffa033;
// }
// .detailT {
//   background: #cccccc;
//   height: 1rem;
//   color: #fff;
//   width: 3.2rem;
//   position: relative;
//   border-bottom-right-radius: 5px;
//   border-bottom-left-radius: 5px;
//   margin-top: -0.2rem;
// }
// .blueBg {
//   background: #0199fa !important;
// }
// .pinkBg {
//   background: #ff5070 !important;
// }
// .descri {
//   margin-left: 0.1rem;
//   margin-top: 0.1rem;
//   font-size: 0.24rem;
//   height: 0.4rem;
//   overflow: hidden;
//   text-overflow: ellipsis;
//   white-space: nowrap;
// }

// .tiket {
//   display: inline-block;
//   margin-left: 0.1rem;
//   margin-top: 0.1rem;
//   font-size: 0.28rem;
// }
// .choose {
//   width: 0.83rem;
//   position: absolute;
//   left: -0.1rem;
//   top: -0.1rem;
// }
// .suBtn {
//   background: url(//img10.360buyimg.com/imgzone/jfs/t1/26742/35/6863/41816/5c63b919Ea9e8289e/6ab32d9b2bd43034.png)
//     no-repeat;
//   background-size: 100%;
//   width: 6.3rem;
//   height: 0.9rem;
//   line-height: 0.9rem;
//   text-align: center;
//   color: #fff;
//   margin-bottom: 0.3rem;
// }
// .pools {
//   height: 1.1rem;
//   text-align: center;
//   color: #666;
//   font-size: 0.24rem;
//   line-height: 1.1rem;
// }
// .descri {
//   display: inline-block;
//   margin-left: 0.1rem;
//   margin-top: 0.1rem;
//   font-size: 0.2rem;
//   height: 0.4rem;
//   overflow: hidden;
//   text-overflow: ellipsis;
//   white-space: nowrap;
//   width: 3.2rem;
// }
</style>