<template>
  <div class="containerbox">
    <div class="companytopimg">
      <img src="../../../assets/companytop.png" alt />
      <div class="intro">
        <div class="flextwo fanbanck" @click="back">
          <div class="leftrow leftrowkimg">
            <img src="../../../assets/leftrowk.png" alt />
          </div>
          <div class="sharemiddle topk">公司介绍及产品介绍</div>
          <div class="sharebtn">
            <!-- <img src="../../../assets/sharebtn.png" alt /> -->
          </div>
        </div>
        <!-- <div class="introtitle">邀您了解唐元集</div> -->
        <div class="introtextbox">
          <div class="introtext flex">
            <img src="../../../assets/xiaolian.png" alt class="xiaoimg" />
            <div class="introtitlename" style="font-size:0.28rem">
              亲爱的
              <span style="font-size:0.28rem;font-weight:bold"
                >{{ result.name }}，</span
              >
              <span style="font-size:0.28rem;font-weight:bold">{{
                result.agent_name
              }}</span
              >邀您深度了解唐元集！
            </div>
          </div>
        </div>
      </div>
      <div class="companytext">
        <div class="comtexttop flexthree">
          <div class="textleft flexone">
            <div class="textleftheng"></div>
            <div class="textyuan"></div>
          </div>
          <div class="textname">{{ intended.company_title }}</div>
          <div class="textleft flexone">
            <div class="textkyuan"></div>
            <div class="textrightheng"></div>
          </div>
        </div>
        <div class="companyintrotext" v-html="company"></div>
      </div>
    </div>

    <div class="zizhi">
      <div class="zizhiboxk">
        <div class="comtexttop flexthree">
          <div class="textleft flexone">
            <div class="textleftheng"></div>
            <div class="textyuan"></div>
          </div>
          <div class="textname">{{ intended.intelligence_title }}</div>
          <div class="textleft flexone">
            <div class="textkyuan"></div>
            <div class="textrightheng"></div>
          </div>
        </div>
        <div class="quanweiimg">
          <img :src="intended.intelligence" alt />
        </div>
      </div>
    </div>
    <div class="clicknext">点击下一页查看唐元集事业优势>> >></div>
    <div class="nextpage" @click="next">下一页</div>
    <van-image-preview
      v-model="show"
      :images="images"
      :startPosition="startPosition"
      @change="onChange"
    >
      <template v-slot:index>第{{ index }}页</template>
    </van-image-preview>
    <!-- 弹层 -->
    <div class="register" v-if="showshare">
      <div class="fenwrap">
        <img
          src="../../../assets/chahao.png"
          alt
          class="chahao"
          @click="hideshare"
        />
        <div class="fenimg">
          <img src="../../../assets/fenimg.png" alt />
          <div class="fenname">结果已出，立即分享给朋友</div>
          <div class="fenbtn" @click="sueshare">立即分享</div>
        </div>
      </div>
    </div>
    <!-- 分享弹层 -->
    <div class="sharewrap" v-if="shareshow" @click="hidesharek">
      <img src="../../../assets/share.png" alt />
    </div>
  </div>
</template>

<script>
import wx from "jweixin-1.6.0";
import Vue from "vue";
import { ImagePreview } from "vant";
Vue.use(ImagePreview);
export default {
  data() {
    return {
      showshare: false,
      company: "",
      subid: "",
      result: {},
      img_arr: "",
      show: false,
      index: 0,
      images: [],
      startPosition: 0,
      shareshow: false,
      baseurl: "",
      intended: ""
    };
  },
  created() {
    this.baseurl = "http://" + location.host;
    document.title = "唐元集公众号";
    this.subid = this.$route.query.subid;
    let type = localStorage.getItem("type");
    if (type == 1) {
      this.showshare = true;
    }
    this.getresult();
    this.getcompanyintro();
    this.getzizhi();
    this.getappid();
    this.getintence();

    console.log(this.intended);
  },
  beforeRouteEnter(to, from, next) {
    var u = navigator.userAgent;
    var isiOS = !!u.match(/\(i[^;]+;( U;)? CPU.+Mac OS X/); //ios终端
    // XXX: 修复iOS版微信HTML5 History兼容性问题
    if (isiOS && to.path !== location.pathname) {
      // 此处不可使用location.replace
      location.assign(to.fullPath);
    } else {
      next();
    }
  },
  methods: {
    hidesharek() {
      this.shareshow = false;
    },
    getintence() {
      let that = this;
      console.log(99999);
      var result = "";

      var url = "/api/user/intended";
      let param = {};
      that.$axios
        .post(url, param)
        .then(function(res) {
          console.log(res);
          result = res.data;
          localStorage.setItem("intended", JSON.stringify(res.data.intended));
          that.intended = JSON.parse(localStorage.getItem("intended"));
        })
        .catch(function(err) {
          console.log(err);
        });
    },
    // 获取appid
    getappid() {
      let that = this;
      let urlk = window.location.href;
      var url = "/api/user/wechat_jssdk";
      let param = {
        url: urlk
      };

      that.$axios
        .post(url, param)
        .then(function(res) {
          console.log(res, "hahahahaiaioaioaio4");
          wx.config({
            debug: false,
            appId: res.data.jssdk.appId, // 和获取Ticke的必须一样------必填，公众号的唯一标识
            timestamp: res.data.jssdk.timestamp, // 必填，生成签名的时间戳
            nonceStr: res.data.jssdk.nonceStr, // 必填，生成签名的随机串
            signature: res.data.jssdk.signature, // 必填，签名，见附录1
            //需要分享的列表项:发送给朋友，分享到朋友圈，分享到QQ，分享到QQ空间
            jsApiList: [
              "showOptionMenu",
              "updateAppMessageShareData",
              "updateTimelineShareData"
            ]
          });
          wx.ready(function() {
            wx.showOptionMenu();
          });
          that.sharetofriend();
        })
        .catch(function(err) {
          console.log(err);
        });
    },

    // 分享给朋友
    sharetofriend() {
      var that = this;
      localStorage.setItem("type", "");
      // 处理验证失败的信息
      wx.error(function(res) {
        logUtil.printLog("验证失败返回的信息:", res);
      });
      // 处理验证成功的信息
      wx.ready(function() {
        //       alert(window.location.href.split('#')[0]);
        // var share_title = that.sharemsg.title;
        // if (share_title.indexOf("${title}") >= 0) {
        //   share_title = share_title.replace(
        //     "${title}",
        //     that.details.details.title
        //   );
        // }
        // var share_desc = that.sharemsg.content;
        // if (share_desc.indexOf("${title}") >= 0) {
        //   share_desc = share_desc.replace(
        //     "${title}",
        //     that.details.details.title
        //   );
        // }
        // if (share_desc.indexOf("${text}") >= 0) {
        //   share_desc = share_desc.replace("${text}", that.details.details.text);
        // }
        // 分享到朋友圈
        wx.updateTimelineShareData({
          title: "唐元集邀请函", // 分享标题
          link:
            that.baseurl +
            "/redirect.html?shareRedirect=" +
            encodeURIComponent(window.location.href), // 分享链接，该链接域名或路径必须与当前页面对应的公众号JS安全域名一致, // 分享链接，该链接域名或路径必须与当前页面对应的公众号JS安全域名一致
          imgUrl:
            "http://tangyuanji.t.brotop.cn/uploads/20200804/fcabfaf5aa3c856ced04703b0a78a467.png",

          // imgUrl: that.details.details.img
          //   ? that.details.details.img
          //   : that.sharemsg.img,

          // 分享图标
          //  desc: that.sharemsg.content,
          success: function(res) {
            // 用户确认分享后执行的回调函数
            console.log("suss");
            logUtil.printLog("分享到朋友圈成功返回的信息为:", res);
            that.showMsg("分享成功!");
          },
          cancel: function(res) {
            // 用户取消分享后执行的回调函数
            console.log("err");
            logUtil.printLog("取消分享到朋友圈返回的信息为:", res);
          }
        }),
          // 分享给朋友
          wx.updateAppMessageShareData({
            title: "唐元集邀请函", // 分享标题
            desc: "", // 分享描述
            link:
              that.baseurl +
              "/redirect.html?shareRedirect=" +
              encodeURIComponent(window.location.href), // 分享链接，该链接域名或路径必须与当前页面对应的公众号JS安全域名一致
            imgUrl:
              "http://tangyuanji.t.brotop.cn/uploads/20200804/fcabfaf5aa3c856ced04703b0a78a467.png",

            // imgUrl: that.details.details.img
            //   ? that.details.details.img
            //   : that.sharemsg.img,
            // 分享图标
            type: "", // 分享类型,music、video或link，不填默认为link
            dataUrl: "", // 如果type是music或video，则要提供数据链接，默认为空
            success: function(res) {
              // 用户确认分享后执行的回调函数
              logUtil.printLog("分享给朋友成功返回的信息为:", res);
            },
            cancel: function(res) {
              // 用户取消分享后执行的回调函数
              logUtil.printLog("取消分享给朋友返回的信息为:", res);
            }
          });
      });
    },

    previewimg(imgarr, index) {
      console.log(imgarr, index);
      let arr = [];
      imgarr.forEach(function(value, index, array) {
        arr.push(value.image);
      });
      this.index = index + 1;
      console.log(this.index);
      this.images = arr;
      this.show = true;
      this.startPosition = index;
    },
    // 图片预览
    onChange(index) {
      this.index = index + 1;
    },
    back() {
      this.$router.go(-1);
    },
    // 确定分享
    sueshare() {
      this.showshare = false;
      this.shareshow = true;
    },
    hideshare() {
      this.showshare = false;
    },
    next() {
      this.$router.push({
        path: "/shiyeyoushi",
        query: { subid: this.subid }
      });
    },
    // 获取资质
    getzizhi() {
      let that = this;
      var url = "/api/common/zizhi";
      let param = {};

      that.$axios
        .post(url, param)
        .then(function(res) {
          console.log(res);
          that.img_arr = res.data.img_arr;
          console.log(that.result);
        })
        .catch(function(err) {
          console.log(err);
        });
    },
    getresult() {
      let that = this;

      var url = "/api//user/purpose_result";
      let param = {
        purpose_id: that.subid
      };

      that.$axios
        .post(url, param)
        .then(function(res) {
          console.log(res);

          that.result = res.data.result;
          console.log(that.result);
        })
        .catch(function(err) {
          console.log(err);
        });
    },

    // 获取公司介绍
    getcompanyintro() {
      console.log(3443489);
      let that = this;
      var url = "/api/common/company";
      let param = {};

      that.$axios
        .post(url, param)
        .then(function(res) {
          console.log(res);
          that.company = res.data.company;
        })
        .catch(function(err) {
          console.log(err);
        });
    }
  }
};
</script>

<style scoped>
@import "../../../style/usercenter.css";
.sharewrap {
  width: 100%;
  height: 100%;
  position: fixed;
  top: 0;
  left: 0;
  z-index: 9999;
}
</style>