detail.vue 4.75 KB
<template>

  <div class="finish-wrap">
      <div class="obox">
        <div class="banner_img" >
          <img :src="detail.imgurl" alt="">
        </div>
        <div class="major_title">
            <h3 class="h3_title">{{detail.title}}</h3>  
            <p>
              <span class="map">
                <img :src="detail.logo" alt="" class="major_img">
                <span class="major_right">
                  {{detail.address}}
                </span>
              </span>
              <span class="map_right"> {{detail.date}}</span>
            </p>      
            <p class="people"><img :src="detail.people" alt=""></p>
            <h4>{{detail.mintitle}}</h4>
            <p class="info">{{detail.info}}</p>
             <p class="info">{{detail.info1}}</p>
              <h4>{{detail.mintitle1}}</h4>
                <p class="info">{{detail.info2}}</p>
        </div>
      </div>
      <footer @click="handleClick()">
         报名
        </footer>
  </div>

</template>
<script>
import list from '@/assets/json/public.json';

export default {
	name: 'detail',
	components: {},
    data(){
		return {
      homelist: [],
      detail:{}
      
		}
  },
    methods: {
      initWx(){
       const baseUrl = this.$config.baseURL;
    if (/from=[^&$?]{1,}(&|$)/.test(location.search) || /isappinstalled=[^&$?]{1,}(&|$)/.test(location.search)) {
      var newSearch = location.search.replace(/from=[^&$?]{1,}(&|$)/, '').replace(/isappinstalled=[^&$?]{1,}(&|$)/, '').replace(/&$|\?$/, '');
      var newUrl = location.origin + location.pathname + newSearch + location.hash;
      location.replace(newUrl);
    }
    var ourl = window.location.href
    var ourls = ourl.substr(1);
    if(ourl.indexOf("fromUser") != -1) {
      var oUrls = ourl.split("&")[0];
      var urls = oUrls.split("=")[1];
      var tokens = urls;
    }else {
        var tokens = ourls.split('=')[1]
    }
    let url = location.href.split('#')[0];
    // var paths = this.$route.path;
    $.ajax({
    url: 'https://esjelly.com/jsApi',
    type: "GET",
    data: {
      url: url
    },
    dataType: 'json',
    success: function (res) {
      // console.log(res)
      wx.config({
        debug: false,
        appId: res.appid,
        timestamp: res.timestamp,
        nonceStr: res.nonceStr,
        signature: res.signature,
        jsApiList: ['onMenuShareTimeline', 'onMenuShareAppMessage', 'checkJsApi']
      })
      let shareParam = {
        title: '慧学习', // 分享标题
        link:`${baseUrl}test?page=/activePage&fromUser=${tokens}`,
        desc: '会学习,免费学,从此以后让你爱上学习。', // 分享描述
        type: 'link', // 分享类型
        dataUrl: '', // 如果type是music或video,则要提供数据链接,默认为空
        imgUrl:'https://gxbfile-gs.gaoxiaobang.com/Huixuexi/logo.jpg',//分享图标
        success: function (res) {console.log('分享成功')},
        fail: function (res) {console.log('分享失败')}
    };
    wx.ready(function () {
      wx.onMenuShareTimeline(shareParam)
      wx.onMenuShareAppMessage(shareParam);
    })
    },
    err: function (err) {
      console.log(err)
    }
  })
  },
      handleClick() {
         this.$share.toTop(); 
         this.$router.push({
                path: '/activePage/form',
                query: {
                    token: this.$route.query.token,
                    id:  this.$route.query.id
                }
            })
      }
    },
     GetQueryString(name) {
        var reg = new RegExp("(^|&)" + name + "=([^&]*)(&|$)");
        var r = decodeURI(window.location.search.substr(1)).match(reg);
        if (r != null)return unescape(r[2]);
        return null;
    },
    created() {
      this.homelist = list.homecenter.home;
      var index =  this.$route.query.id;
      this.detail = this.homelist[index].detail;
      this.initWx();
    }
}
</script>

<style lang="" scoped>
h3.h3_title{font-size:.39rem;color:#000;font-weight:600;line-height: .5rem;margin-bottom:3%;}
.banner_img img{width:100%;}
.major_title{background:#fff;border-radius:.1rem;padding:3% 5%;}
p{line-height:.5rem;font-size:.27rem;overflow: hidden;}
.major_img{width:.19rem;float:left;}
.major_right{width:93%;float:right;}
.map{color:#02B5B2;border:1px solid #02B5B2;font-size:.26rem;line-height:.34rem;padding: .02rem .1rem .01rem .1rem;border-radius:.1rem;float:left;max-width:62%;min-width:42%;}
.map_right{float:right;width:33%;}
.people{margin: .4rem 0 .26rem 0;}
.people img{width:3.04rem;}
h4{color:#000;font-size:.4rem;font-weight:600;margin:.4rem 0;}
.info{font-size:.3rem;color:#333;}
footer{text-align: center;position: fixed;bottom:0;width:100%;height:1rem;line-height: 1rem;color:#fff;font-size:.32rem;
background:url(http://gxbfile-gs.gaoxiaobang.com/Huixuexi/footer.png) no-repeat center;background-size: cover;}

</style>