<!DOCTYPE html>
<html lang="en">
  <head>
    <meta charset="UTF-8" />
    <meta http-equiv="X-UA-Compatible" content="IE=edge" />
    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
    <script src="/static/js/public/reset.js"></script>
    <link href="/static/css/public/reset.css" rel="stylesheet" />
    <link href="/static/css/public/public.css" rel="stylesheet" />
    <link href="/static/css/public/animate.min.css" rel="stylesheet" />
    <link href="/static/css/public/Activity.css" rel="stylesheet" />
    <link href="/static/assets/18834/css/index.css" rel="stylesheet" />
    <title>演示活动</title>
    <style>
      .popup {
        display: flex;
        align-items: center;
        justify-content: center;
        position: fixed;
        top: 0;
        left: 0;
        right: 0;
        bottom: 0;
        background-color: rgba(0, 0, 0, 0.5);
        z-index: 1000;
      }

      .popup .wrapper {
        width: 80%;
        padding: 15px;
        background-color: #fff;
        border-radius: 5px;
        text-align: center;
      }

      .popup .wrapper .title {
        font-size: 0.85rem;
      }

      .active-tipmsg {
        border-radius: 10px;
        display: flex;
        flex-wrap: nowrap;
        margin: 0.75rem auto;
        width: 88%;
        background-color: white;
        font-size: 0.8rem;
        border: 1px solid #f5f5f5;
      }

      .active-input {
        padding: 0.5rem 0;
        width: 30%;
        background-color: #ffed7d;
        color: #a72211;
        border-bottom-left-radius: 10px;
        border-top-left-radius: 10px;
      }

      .input {
        flex: 1;
        border: none;
        text-align: center;
      }
      .wxgz-container {
        display: flex;
        align-items: center;
        justify-content: center;
        padding: 0.7rem 0;
        margin-top: 1rem;
        background-color: #fff;
        font-size: 0.8rem;
      }
      .btn-ai {
        width: 18rem;
        margin: 0 auto 1rem;
        background-color: #ffb800;
      }
      .btn-ai img {
        width: 1.6rem;
      }
      .btn-ai span {
        font-size: 0.9rem;
      }
      .shadowbox {
        box-shadow: 2px 2px 2px #bebebe;
        border-radius: 4px;
      }
	  
	  .write-off{
		flex-direction: column
	  }
	  
      .write-off #qrcode img{
        width: 150px !important;
        height: 150px !important;
      }

      #qrcode{
        padding: 20px;
        background-color: #fff;
        border-radius: 8px;
      }

      .write-off p{
        margin-top: 16px;
        font-size: 14px;
        color: #fff;
      }
	  
	  .write-off .close{
		width: 26px;
		margin-top: 20px;
	  }
    </style>
  </head>

  <body>
    <div>
      <div
        class="com_sign"
        style="background: none; text-align: left; padding: 10px 0 10px 10px"
      >
        <img src="http://www.china315net.com/img/logo.png" style="width: 60%" />
      </div>
      <img
        src="http://tjfnew.china315net.com/image/just/j5.jpg"
        style="width: 100%"
      />
      <div class="content_pad">
        <div class="wonder_click">
          <div class="wonder_click_font">精彩点击</div>
          <div class="wonder_click_img">
            <div onclick="redirectTo('/mall/m/209388/1/')">
              <img src="/static/assets/18834/img2/qyjs.png" />
              <br /><span>积分商城</span>
            </div>
            <div onclick="redirectTo('/static/html/18834/fwzs.html')">
              <img src="/static/assets/18834/img2/fwzs.png" />
              <br /><span>防伪知识</span>
            </div>
            <div onclick="redirectTo('/wx/chcx/209388/')">
              <img src="/static/assets/18834/img2/chcx.png" />
              <br /><span>窜货查询</span>
            </div>
          </div>
        </div>
        <div
          id="btnAISuccess"
          class="wxgz-container shadowbox btn-ai animated pulse"
          style="
            animation-iteration-count: 5;
            display: none;
            background-color: #008dca;
            color: #fff;
          "
        >
          <img
            id="needAI_icon"
            class="animated tada"
            src="/static/assets/16687/shualian.png"
            style="
              animation-iteration-count: infinite;
              animation-duration: 1.5s;
            "
          />
          <span id="needAI_text" style="color: white"
            >该三维码已通过AI验证，请放心使用。</span
          >
        </div>
        <!-- <div
          id="btnAI"
          class="wxgz-container shadowbox btn-ai animated pulse"
          style="animation-iteration-count: 5"
          onclick="goAI();"
        >
          <img
            id="needAI_icon"
            class="animated tada"
            src="/static/assets/16687/slyz.png"
            style="
              animation-iteration-count: infinite;
              animation-duration: 1.5s;
            "
          />
          <span id="needAI_text" style="color: white">点击进行AI认证</span>
        </div> -->
        
        <wx-open-launch-weapp id="launch-btn" style="display:block">
          <script type="text/wxtag-template">
              <style>
                  .btn {
                      display: flex;
                      align-items: center;
                      justify-content: center;
                      padding: 12px 0;
                      margin: 1rem 0;
                      background-color: #FFF;
                      font-size: 16px;
                      box-shadow: 2px 2px 2px rgba(124, 29, 192, 0.7);
                      border-radius: 4px;
                      width: 100%;
                      background-image: url(https://tjfnew.china315net.com/image/indexswm/k-s.png);
                      background-size: 100% 100%
                  }
              </style>
              <div class="btn">
                  <img src="https://tjfnew.china315net.com/image/slyz.png" style="width: 28px;margin-right:15px"/>
                  <span style="color:#fff">点击进行AI认证</span>
              </div>
          </script>
      </wx-open-launch-weapp>
      
        <div class="wx_click" id="follow_wxnum">
          <img src="/static/assets/18834/img2/wx.png" /><span
            >点击进入公众号</span
          >
        </div>
        <div class="pro_display_font">产品展示</div>
        <div class="pro_display_img">
          <div>
            <img
              src="https://os.china315net.com/Admin/Images/upload/1/190329094236.png"
            /><br />
            <!-- <span>内参酒</span> -->
          </div>
        </div>
        <div class="com_news">
          <div class="com_news_font">企业动态</div>
          <div class="com_news_content">
            <div style="margin-right: 2.5%">
              <img
                src="https://os.china315net.com/Admin/Images/commup/1/202007270700086459.jpeg"
                style="height: 5rem"
              />
            </div>
            <!-- <div></div> -->
          </div>
        </div>
      </div>
      <div class="font_button" id="a3">页脚</div>
    </div>
    <div id="popupAddress" class="popup" style="display: none">
      <div class="wrapper">
        <p class="title">请认真填写以下信息，以便我们核实！</p>

        <div class="active-tipmsg">
          <div class="active-input">姓名</div>
          <input id="input_name" placeholder="请输入您的姓名" class="input" />
        </div>
        <div class="active-tipmsg">
          <div class="active-input">手机号码</div>
          <input
            id="input_phone"
            placeholder="请输入您的手机号码"
            class="input"
          />
        </div>
        <div class="active-tipmsg">
          <div class="active-input">收货地址</div>
          <input
            id="input_address"
            placeholder="请输入您的收货地址"
            class="input"
          />
        </div>
        <div class="points1-btn" id="btn_sure">确定</div>
      </div>
    </div>
    <div class="authorBox" id="authorBox" style="display: none">
      <img class="icon_right" src="/static/images/public/gg.png" />
      <p class="point_authorBox">已通过验证！</p>
    </div>
    <div id="writeOffPopup" class="popup write-off" style="display: none;">
      <div id="qrcode"></div>
      <p>请截图当前页面，前往附近门店核销。</p>
	  <img class="close" src="/static/images/public/close.png" onclick="closeWriteOffPopup()"/>
    </div>


    <script
      type="text/javascript"
      src="https://res2.wx.qq.com/open/js/jweixin-1.6.0.js"
    ></script>
    <script src="/static/js/jquery-2.1.0.min.js"></script>
    <script src="/static/js/public/public.js"></script>
    <script src="/static/js/public/qrcode.js"></script>
    <script>
      tj_public.showLoading();
      tj_public.wxInit({
        wx_officail_account_id: 6,
        url: window.location.href,
      });
      wx.ready(function () {
        tj_public.getAddress(function (lat, lng) {
          getInfo(lat, lng);
        });
      });
      wx.error(function (res) {
        getInfo(0, 0);
      });
      let name = "";
      let phone = "";
      let address = "";
      let winner_id = "";
      let label_code = tj_public.getCookie('label_code');
      let uid = tj_public.getCookie('TJWXUSR_209388_0');
      let jmcpid = tj_public.getCookie('jmcpid');
      //getInfo(0, 0);

      function getInfo(lat, lng) {
        $.ajax({
          url: "/wx/label/scan_record/",
          data: {
            lat,
            lng,
            uid,
            compid: "209388",
            fwcode: label_code,
          },
          success: function (res) {
            if (res.e === "") {
              tj_public.hideLoading();

              if (
                label_code == "667668497698" ||
                label_code == "667668497708" ||
                label_code == "667668497711" ||
                label_code == "667668497723" ||
                label_code == "667668497735"
              ) {
                tj_public.showYzm();
              } else {
                GetActivity();
              }

              var miniprogramCpid = label_code;
              if(jmcpid){
                miniprogramCpid = jmcpid;
              }
              if(res.hcode){
                miniprogramCpid = res.hcode;
              }

              var uuid = tj_public.getUuid(8, 16);
              tj_public.configLaunchWeappBtn({
                el: "launch-btn",
                username: "gh_4290b605146b",
                extraData: {
                  cpid: miniprogramCpid,
                  uid,
                  uuid,
                  os: "davis",
                },
                onLaunch: function () {
                  tj_public.checkMiniprogramAIStatus(
                    {
                      label_code: miniprogramCpid,
                      consumer_id: uid,
                      uuid,
                    },
                    function (state) {
                      if (state == 1) {
                        access();
                      }
                    }
                  );
                },
              });
            } else {
              alert("网络超时！");
            }
          },
          error: function () {
            alert("网络超时！");
          },
        });
      }

      function GetActivity() {
        $.ajax({
          url: "/wx/ajax/get_activity/",
          data: {
            company_id: 209388,
          },
          success: function (res) {
            if (res.e === "") {
              if (res.award.code == 200) {
                winner_id = res.award.winner_id;
                ShowAward(res.award.data);
              } else {
                if (res.award.code === 401) {
                  alert(res.award.reason + ", 奖品:" + res.award.data.name);
                } else {
                  //alert(res.award.reason)
                }
              }
            }
          },
        });
      }

      function ShowAward(award) {
        if (!winner_id) {
          return;
        }
        let onClickFunc = "GetAward();";
        if (award.awardcat_id === 1) {
          //onClickFunc = "openAddress();";
          onClickFunc = "GetAward(1);";
        }
        var dom = `
                <div class="ac-container" id="tj_ac">
                    <div class="points1-container">
                        <p class="points1-subtitle">恭喜您，获得${award.name}</p>
                        <div class="points1-btn" onclick="${onClickFunc}">立即领取</div>
                    </div>
                </div>
            `;
        document.body.append(
          document.createRange().createContextualFragment(dom)
        );
      }

      function GetAward(awardcat_id) {
        tj_public.showLoading();
        $.ajax({
          type: "GET",
          data: {
            winner_id,
            name,
            phone,
            address,
          },
          url: "/sales/ajax/winner/redeem/",
          success: function (res) {
            if (res.e === "") {
              alert("领取成功！");
              $("#tj_ac").fadeOut();
              closeAddress();
			  if(awardcat_id === 1){
				openWriteOffPopup()
			  }
            } else {
              alert(res.e);
            }
            tj_public.hideLoading();
          },
          error: function () {
            alert("连接服务器失败");
            tj_public.hideLoading();
          },
        });
      }

      function openAddress() {
        $("#popupAddress").fadeIn();
      }

      function closeAddress() {
        $("#popupAddress").hide();
      }
	  
      function openWriteOffPopup(){
        $("#writeOffPopup").fadeIn();
		$("#qrcode").html('')
        new QRCode(document.getElementById("qrcode"), winner_id);
      }

      function closeWriteOffPopup(){
        $("#writeOffPopup").fadeOut();
      }

      $("#btn_sure").click(function () {
        name = $("#input_name").val();
        phone = $("#input_phone").val();
        address = $("#input_address").val();
        if (name.trim().length < 2) {
          alert("请输入正确的姓名！");
          return;
        }
        if (!/^1[3456789]\d{9}$/.test(phone)) {
          alert("请输入正确的手机号码！");
          return;
        }
        if (address.trim().length < 5) {
          alert("请填写正确的收货地址！");
          return;
        }
        GetAward();
      });
	  
      function redirectTo(url) {
        window.location.href = url;
      }

      function access() {
        $("#authorBox").fadeIn();
        setTimeout(function () {
          $("#authorBox").fadeOut();
        }, 3000);
        $("#btnAI").hide();
        $("#btnAISuccess").show();
      }
      function checkYzmCallback() {
        GetActivity();
      }
    </script>
  </body>
</html>
