不需要招商证券二步授权，小程序入口会自动授权
This commit is contained in:
tcubic
parent
1cc35b8e33
commit
c02ef34e45
@ -13,7 +13,9 @@
|
||||
<div class="prize_num">{{ prizeResult }}<span>元</span></div>
|
||||
</div>
|
||||
<div class="notice">
|
||||
<span class="icon"><img src="../assets/img/laba.png" alt="" srcset=""></span>
|
||||
<span class="icon"
|
||||
><img src="../assets/img/laba.png" alt="" srcset=""
|
||||
/></span>
|
||||
<span class="num">活动已有{{ participantNum }}人参与</span>
|
||||
</div>
|
||||
<div class="cloud_left_2"></div>
|
||||
@ -35,7 +37,7 @@
|
||||
<div class="cloud_right_3"></div>
|
||||
<div class="icon_right_1"></div>
|
||||
<div class="select_box"></div>
|
||||
<div class="draw_btn" @click=drawBtn></div>
|
||||
<div class="draw_btn" @click="drawBtn"></div>
|
||||
<div class="rule_btn" @click="showRluesBtn"></div>
|
||||
<div class="prize_btn" @click="showMyPrizePop"></div>
|
||||
<div class="rule_btn_text"></div>
|
||||
@ -45,12 +47,22 @@
|
||||
<!-- 活动列表 -->
|
||||
<div class="activityCon">
|
||||
<div class="activity_box">
|
||||
<div class="activity_title"><img src="../assets/img/activity_title.png" alt=""></div>
|
||||
<div class="activity_title">
|
||||
<img src="../assets/img/activity_title.png" alt="" />
|
||||
</div>
|
||||
<div class="activity_list">
|
||||
<div class="activity_li" v-for="(item,index) in activityList" :key="index"
|
||||
:style="{ 'background-image': 'url(' + item.banner + ')' }" v-show="item.show">
|
||||
<div class="btn" :style="{ 'background-image': 'url(' + item.btnImg + ')' }"
|
||||
@click="activityBtn(item)"></div>
|
||||
<div
|
||||
class="activity_li"
|
||||
v-for="(item, index) in activityList"
|
||||
:key="index"
|
||||
:style="{ 'background-image': 'url(' + item.banner + ')' }"
|
||||
v-show="item.show"
|
||||
>
|
||||
<div
|
||||
class="btn"
|
||||
:style="{ 'background-image': 'url(' + item.btnImg + ')' }"
|
||||
@click="activityBtn(item)"
|
||||
></div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
@ -65,191 +77,175 @@
|
||||
<ServiceList v-if="showServicePop" @ServicePop="hideServicePop" />
|
||||
|
||||
<LuckyWheel v-if="false" />
|
||||
|
||||
|
||||
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script setup>
|
||||
import { onBeforeMount, onMounted, defineEmits, defineProps, reactive, ref, toRefs, getCurrentInstance, computed } from 'vue'
|
||||
import {
|
||||
onBeforeMount,
|
||||
onMounted,
|
||||
defineEmits,
|
||||
defineProps,
|
||||
reactive,
|
||||
ref,
|
||||
toRefs,
|
||||
getCurrentInstance,
|
||||
computed,
|
||||
} from "vue";
|
||||
import gsap from "gsap";
|
||||
import axios from 'axios'
|
||||
import { Toast, Dialog } from 'vant';
|
||||
import axios from "axios";
|
||||
import { Toast, Dialog } from "vant";
|
||||
import { useStore } from "vuex";
|
||||
// import { get_authorize, get_jssdk } from '@/api/authorize-api'
|
||||
import service from "@/api/httpServe"
|
||||
import qs from 'qs'
|
||||
import h5plugin from '@/utils/plugin'
|
||||
import Rules from '@/components/Rules'
|
||||
import MyPrize from '@/components/MyPrize'
|
||||
import ServiceList from '@/components/ServiceList'
|
||||
import LuckyWheel from '@/components/LuckyWheel'
|
||||
|
||||
|
||||
|
||||
import service from "@/api/httpServe";
|
||||
import qs from "qs";
|
||||
import h5plugin from "@/utils/plugin";
|
||||
import Rules from "@/components/Rules";
|
||||
import MyPrize from "@/components/MyPrize";
|
||||
import ServiceList from "@/components/ServiceList";
|
||||
import LuckyWheel from "@/components/LuckyWheel";
|
||||
|
||||
// 初始化
|
||||
const emit = defineEmits(["indexPage"]); // 声明触发事件，对应父组件上面的方法
|
||||
const props = defineProps({ sendMessage: Object }); // 获取props
|
||||
const store = useStore() //初始化vuex
|
||||
const store = useStore(); //初始化vuex
|
||||
const { proxy } = getCurrentInstance(); //初始化全局方法：plugin工具箱
|
||||
|
||||
|
||||
// 活动信息
|
||||
const participantNum = ref(store.state.userAccount.participantNum) // 活动参与人数prizeResult
|
||||
const prizeResult = ref(store.state.userAccount.prizeResult) // 中奖金额
|
||||
|
||||
const participantNum = ref(store.state.userAccount.participantNum); // 活动参与人数prizeResult
|
||||
const prizeResult = ref(store.state.userAccount.prizeResult); // 中奖金额
|
||||
|
||||
// 页面控制
|
||||
const showRulesPop = ref(false)
|
||||
const showMyPrize = ref(false)
|
||||
const showServicePop = ref(false)
|
||||
|
||||
|
||||
const showRulesPop = ref(false);
|
||||
const showMyPrize = ref(false);
|
||||
const showServicePop = ref(false);
|
||||
|
||||
// 活动列表
|
||||
const activityList = reactive([
|
||||
{
|
||||
id: 1,
|
||||
show: true,
|
||||
banner: require('../assets/img/activity_1.png'),
|
||||
btnImg: require('../assets/img/li_btn_1.png'),
|
||||
banner: require("../assets/img/activity_1.png"),
|
||||
btnImg: require("../assets/img/li_btn_1.png"),
|
||||
},
|
||||
{
|
||||
id: 2,
|
||||
show: true,
|
||||
banner: require('../assets/img/activity_2.png'),
|
||||
btnImg: require('../assets/img/li_btn_2.png'),
|
||||
banner: require("../assets/img/activity_2.png"),
|
||||
btnImg: require("../assets/img/li_btn_2.png"),
|
||||
},
|
||||
{
|
||||
id: 3,
|
||||
show: true,
|
||||
banner: require('../assets/img/activity_3.png'),
|
||||
btnImg: require('../assets/img/li_btn_3.png'),
|
||||
banner: require("../assets/img/activity_3.png"),
|
||||
btnImg: require("../assets/img/li_btn_3.png"),
|
||||
},
|
||||
{
|
||||
id: 4,
|
||||
show: true,
|
||||
banner: require('../assets/img/activity_4.png'),
|
||||
btnImg: require('../assets/img/li_btn_4.png'),
|
||||
banner: require("../assets/img/activity_4.png"),
|
||||
btnImg: require("../assets/img/li_btn_4.png"),
|
||||
},
|
||||
{
|
||||
id: 5,
|
||||
show: true,
|
||||
banner: require('../assets/img/activity_5.png'),
|
||||
btnImg: require('../assets/img/li_btn_5.png'),
|
||||
banner: require("../assets/img/activity_5.png"),
|
||||
btnImg: require("../assets/img/li_btn_5.png"),
|
||||
},
|
||||
])
|
||||
|
||||
|
||||
]);
|
||||
|
||||
// 页面挂载前
|
||||
onBeforeMount(() => {
|
||||
|
||||
})
|
||||
|
||||
|
||||
onBeforeMount(() => {});
|
||||
|
||||
// 页面挂载后
|
||||
onMounted(() => { })
|
||||
onMounted(() => {});
|
||||
|
||||
const btn = () => {
|
||||
// Toast('项目开发中');
|
||||
emit('indexPage', 'hello')
|
||||
|
||||
emit("indexPage", "hello");
|
||||
|
||||
Dialog.alert({
|
||||
title: '招商证券88司庆活动',
|
||||
message: '项目开发中',
|
||||
confirmButtonText: '确定',
|
||||
title: "招商证券88司庆活动",
|
||||
message: "项目开发中",
|
||||
confirmButtonText: "确定",
|
||||
showCancelButton: true,
|
||||
}).then((e) => {
|
||||
|
||||
})
|
||||
.then((e) => {
|
||||
// 更新openid
|
||||
store.commit({ type: 'updateOpenid', openid: 'openid110' })
|
||||
|
||||
store.commit({ type: "updateOpenid", openid: "openid110" });
|
||||
|
||||
console.log(e, store.state.userAccount);
|
||||
}).catch((e) => {
|
||||
})
|
||||
.catch((e) => {
|
||||
console.log(e);
|
||||
});
|
||||
}
|
||||
|
||||
};
|
||||
|
||||
// 抽奖按钮
|
||||
const drawBtn = ()=>{
|
||||
const drawBtn = () => {
|
||||
console.log("抽奖：");
|
||||
// console.log("授权：",getAuthorize(1));
|
||||
// let href = window.location.href;
|
||||
// let h_idx = window.location.href.indexOf("#");
|
||||
// let out_href = href.slice(0, h_idx);
|
||||
// console.log("授权：",getAuthorize(1));
|
||||
// let href = window.location.href;
|
||||
// let h_idx = window.location.href.indexOf("#");
|
||||
// let out_href = href.slice(0, h_idx);
|
||||
|
||||
// service.get(process.env.VUE_APP_ZS_DOMAIN + '/wxauth/official/account/authorize',{params:{
|
||||
// redirectUrl: out_href,
|
||||
// scope: 1,
|
||||
// }}).then((res) => {
|
||||
// service.get(process.env.VUE_APP_ZS_DOMAIN + '/wxauth/official/account/authorize',{params:{
|
||||
// redirectUrl: out_href,
|
||||
// scope: 1,
|
||||
// }}).then((res) => {
|
||||
|
||||
// console.log("招商授权结果：",res);
|
||||
// })
|
||||
// console.log("招商授权结果：",res);
|
||||
// })
|
||||
|
||||
if (h5plugin.getQueryString("forceauth")) {
|
||||
// H5P.getSetCookie('authState',1,{expires:0.5})
|
||||
console.log('yes-forceauth');
|
||||
console.log("yes-forceauth");
|
||||
getAuthorize(0);
|
||||
} else {
|
||||
// H5P.getSetCookie('authState',1,{expires:0.5})
|
||||
console.log('no-forceauth');
|
||||
console.log("no-forceauth");
|
||||
getAuthorize(1);
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
};
|
||||
|
||||
// 活动点击
|
||||
const activityBtn = (item) => {
|
||||
console.log(item.id);
|
||||
|
||||
if (item.id == 1) {
|
||||
showServicePop.value = true
|
||||
|
||||
showServicePop.value = true;
|
||||
}
|
||||
}
|
||||
|
||||
};
|
||||
|
||||
// 活动规则弹窗
|
||||
const showRluesBtn = () => {
|
||||
showRulesPop.value = true
|
||||
}
|
||||
showRulesPop.value = true;
|
||||
};
|
||||
const hideRulesPop = () => {
|
||||
showRulesPop.value = false
|
||||
}
|
||||
showRulesPop.value = false;
|
||||
};
|
||||
|
||||
// 我的奖品页面
|
||||
const showMyPrizePop = () => {
|
||||
showMyPrize.value = true
|
||||
}
|
||||
showMyPrize.value = true;
|
||||
};
|
||||
const myPrizePop = () => {
|
||||
showMyPrize.value = false
|
||||
}
|
||||
showMyPrize.value = false;
|
||||
};
|
||||
|
||||
// 企微弹窗
|
||||
const hideServicePop = () => {
|
||||
showServicePop.value = false
|
||||
}
|
||||
|
||||
showServicePop.value = false;
|
||||
};
|
||||
|
||||
// 招商证券授权
|
||||
const getAuthorize = (scopeState)=> {
|
||||
|
||||
const getAuthorize = (scopeState) => {
|
||||
let href = window.location.href;
|
||||
let h_idx = window.location.href.indexOf("#");
|
||||
let out_href = href.slice(0, h_idx);
|
||||
// return `${process.env.VUE_APP_ZS_DOMAIN}/wxauth/official/account/authorize?redirectUrl=${out_href}&scope=${1}"`;
|
||||
window.location.href = `${process.env.VUE_APP_ZS_DOMAIN}/wxauth/official/account/authorize?redirectUrl=${(out_href)}&scope=${scopeState}`
|
||||
}
|
||||
|
||||
|
||||
window.location.href = `${process.env.VUE_APP_ZS_DOMAIN}/wxauth/official/account/authorize?redirectUrl=${out_href}&scope=${scopeState}`;
|
||||
};
|
||||
</script>
|
||||
|
||||
<style lang="scss" scoped>
|
||||
@ -264,7 +260,6 @@ const getAuthorize = (scopeState)=> {
|
||||
overflow: hidden;
|
||||
overflow-y: scroll;
|
||||
|
||||
|
||||
.indexCon {
|
||||
// @include pos(100%, 1090px, 0, 0);
|
||||
width: 100%;
|
||||
@ -272,19 +267,18 @@ const getAuthorize = (scopeState)=> {
|
||||
position: relative;
|
||||
top: 0;
|
||||
left: 0;
|
||||
@include bg_pos('../assets/img/top_bg.jpg');
|
||||
@include bg_pos("../assets/img/top_bg.jpg");
|
||||
// overflow: hidden;
|
||||
|
||||
.logo {
|
||||
@include pos(241px, 36px, 31px, 41px);
|
||||
@include bg_pos('../assets/img/logo.png');
|
||||
@include bg_pos("../assets/img/logo.png");
|
||||
pointer-events: none;
|
||||
|
||||
}
|
||||
|
||||
.notice {
|
||||
@include pos(350px, 48px, 200px, 592px);
|
||||
@include bg_pos('../assets/img/notice_box.png');
|
||||
@include bg_pos("../assets/img/notice_box.png");
|
||||
pointer-events: none;
|
||||
align-self: center;
|
||||
justify-content: center;
|
||||
@ -313,110 +307,108 @@ const getAuthorize = (scopeState)=> {
|
||||
|
||||
.title_main {
|
||||
@include pos(547px, 221px, 107px, 108px);
|
||||
@include bg_pos('../assets/img/title_main.png');
|
||||
@include bg_pos("../assets/img/title_main.png");
|
||||
pointer-events: none;
|
||||
}
|
||||
|
||||
.caidai {
|
||||
@include pos(641px, 503px, 47px, 79px);
|
||||
@include bg_pos('../assets/img/caidai.png');
|
||||
@include bg_pos("../assets/img/caidai.png");
|
||||
pointer-events: none;
|
||||
}
|
||||
|
||||
.luckybag_left {
|
||||
@include pos(144px, 138px, 0px, 551px);
|
||||
@include bg_pos('../assets/img/luckybag_left.png');
|
||||
@include bg_pos("../assets/img/luckybag_left.png");
|
||||
pointer-events: none;
|
||||
}
|
||||
|
||||
.luckybag_right {
|
||||
@include pos(118px, 110px, 615px, 503px);
|
||||
@include bg_pos('../assets/img/luckybag_right_2.png');
|
||||
@include bg_pos("../assets/img/luckybag_right_2.png");
|
||||
pointer-events: none;
|
||||
}
|
||||
|
||||
.icon_left_1 {
|
||||
@include pos(54px, 52px, 104px, 605px);
|
||||
@include bg_pos('../assets/img/icon_left_1.png');
|
||||
@include bg_pos("../assets/img/icon_left_1.png");
|
||||
pointer-events: none;
|
||||
}
|
||||
|
||||
.icon_left_2 {
|
||||
@include pos(63px, 61px, 11px, 652px);
|
||||
@include bg_pos('../assets/img/icon_left_2.png');
|
||||
@include bg_pos("../assets/img/icon_left_2.png");
|
||||
pointer-events: none;
|
||||
}
|
||||
|
||||
.icon_right_1 {
|
||||
@include pos(81px, 80px, 556px, 400px);
|
||||
@include bg_pos('../assets/img/icon_right_1.png');
|
||||
@include bg_pos("../assets/img/icon_right_1.png");
|
||||
pointer-events: none;
|
||||
}
|
||||
|
||||
.icon_right_2 {
|
||||
@include pos(70px, 65px, 567px, 573px);
|
||||
@include bg_pos('../assets/img/icon_right_2.png');
|
||||
@include bg_pos("../assets/img/icon_right_2.png");
|
||||
pointer-events: none;
|
||||
}
|
||||
|
||||
.icon_right_3 {
|
||||
@include pos(103px, 108px, 633px, 600px);
|
||||
@include bg_pos('../assets/img/luckybag_right.png');
|
||||
@include bg_pos("../assets/img/luckybag_right.png");
|
||||
pointer-events: none;
|
||||
}
|
||||
|
||||
|
||||
.cloud_left_1 {
|
||||
@include pos(214px, 147px, 0px, 523px);
|
||||
@include bg_pos('../assets/img/cloud_left_1.png');
|
||||
@include bg_pos("../assets/img/cloud_left_1.png");
|
||||
pointer-events: none;
|
||||
}
|
||||
|
||||
.cloud_left_2 {
|
||||
@include pos(375px, 176px, 0px, 616px);
|
||||
@include bg_pos('../assets/img/cloud_left_2.png');
|
||||
@include bg_pos("../assets/img/cloud_left_2.png");
|
||||
pointer-events: none;
|
||||
}
|
||||
|
||||
.cloud_left_3 {
|
||||
@include pos(151px, 136px, 0px, 645px);
|
||||
@include bg_pos('../assets/img/cloud_left_3.png');
|
||||
@include bg_pos("../assets/img/cloud_left_3.png");
|
||||
pointer-events: none;
|
||||
}
|
||||
|
||||
.cloud_right_1 {
|
||||
@include pos(270px, 215px, 480px, 477px);
|
||||
@include bg_pos('../assets/img/cloud_right_1.png');
|
||||
@include bg_pos("../assets/img/cloud_right_1.png");
|
||||
pointer-events: none;
|
||||
}
|
||||
|
||||
.cloud_right_2 {
|
||||
@include pos(375px, 202px, 375px, 595px);
|
||||
@include bg_pos('../assets/img/cloud_right_2.png');
|
||||
@include bg_pos("../assets/img/cloud_right_2.png");
|
||||
pointer-events: none;
|
||||
}
|
||||
|
||||
.cloud_right_3 {
|
||||
@include pos(113px, 108px, 639px, 686px);
|
||||
@include bg_pos('../assets/img/cloud_right_3.png');
|
||||
@include bg_pos("../assets/img/cloud_right_3.png");
|
||||
pointer-events: none;
|
||||
}
|
||||
|
||||
.lucky_bag {
|
||||
@include pos(308px, 355px, 227px, 356px);
|
||||
@include bg_pos('../assets/img/luckybag.png');
|
||||
@include bg_pos("../assets/img/luckybag.png");
|
||||
pointer-events: none;
|
||||
visibility: hidden;
|
||||
}
|
||||
|
||||
.lucky_bag_2 {
|
||||
@include pos(330px, 345px, 210px, 348px);
|
||||
@include bg_pos('../assets/img/luckybag_2.png');
|
||||
@include bg_pos("../assets/img/luckybag_2.png");
|
||||
pointer-events: none;
|
||||
|
||||
// display: flex;
|
||||
|
||||
|
||||
.prize_num {
|
||||
@include pos(330px, 50px, 0px, 79px);
|
||||
font-weight: 700;
|
||||
@ -428,48 +420,44 @@ const getAuthorize = (scopeState)=> {
|
||||
color: #ca2f0a;
|
||||
font-size: 24px;
|
||||
font-weight: 700;
|
||||
|
||||
}
|
||||
|
||||
|
||||
}
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
.select_box {
|
||||
@include pos(270px, 325px, 239px, 666px);
|
||||
@include bg_pos('../assets/img/select_box.png');
|
||||
@include bg_pos("../assets/img/select_box.png");
|
||||
pointer-events: none;
|
||||
}
|
||||
|
||||
.draw_btn {
|
||||
@include pos(216px, 252px, 273px, 810px);
|
||||
@include bg_pos('../assets/img/draw_btn.png');
|
||||
@include bg_pos("../assets/img/draw_btn.png");
|
||||
}
|
||||
|
||||
.rule_btn {
|
||||
@include pos(137px, 153px, 75px, 883px);
|
||||
@include bg_pos('../assets/img/rule_btn.png');
|
||||
@include bg_pos("../assets/img/rule_btn.png");
|
||||
}
|
||||
|
||||
.rule_btn_text {
|
||||
@include pos(98px, 26px, 92px, 1035px);
|
||||
@include bg_pos('../assets/img/rule_btn_text.png');
|
||||
@include bg_pos("../assets/img/rule_btn_text.png");
|
||||
}
|
||||
|
||||
.prize_btn {
|
||||
@include pos(137px, 153px, 541px, 883px);
|
||||
@include bg_pos('../assets/img/prize_btn.png');
|
||||
@include bg_pos("../assets/img/prize_btn.png");
|
||||
}
|
||||
|
||||
.prize_btn_text {
|
||||
@include pos(98px, 26px, 558px, 1035px);
|
||||
@include bg_pos('../assets/img/prize_btn_text.png');
|
||||
@include bg_pos("../assets/img/prize_btn_text.png");
|
||||
}
|
||||
|
||||
.zhuanpan {
|
||||
@include pos(750px, 465px, 0px, 657px);
|
||||
@include bg_pos('../assets/img/zhuanpan.png');
|
||||
@include bg_pos("../assets/img/zhuanpan.png");
|
||||
pointer-events: none;
|
||||
overflow: hidden;
|
||||
|
||||
@ -492,27 +480,21 @@ const getAuthorize = (scopeState)=> {
|
||||
line-height: 110px;
|
||||
border-radius: 50%;
|
||||
transform: rotate(30deg);
|
||||
|
||||
}
|
||||
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
|
||||
}
|
||||
}
|
||||
|
||||
.activityCon {
|
||||
|
||||
width: 750px;
|
||||
@include bg_pos('../assets/img/activity_bg.jpg');
|
||||
@include bg_pos("../assets/img/activity_bg.jpg");
|
||||
|
||||
.activity_box {
|
||||
width: 700px;
|
||||
// height: 100%;
|
||||
margin: 0 auto;
|
||||
margin-top: 30px;
|
||||
@include bg_pos('../assets/img/activity_box.png');
|
||||
@include bg_pos("../assets/img/activity_box.png");
|
||||
box-sizing: border-box;
|
||||
|
||||
.activity_title {
|
||||
@ -553,30 +535,17 @@ const getAuthorize = (scopeState)=> {
|
||||
top: 16px;
|
||||
left: 479px;
|
||||
background-size: 100%;
|
||||
|
||||
}
|
||||
|
||||
|
||||
}
|
||||
|
||||
|
||||
|
||||
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
.cloud_bottom {
|
||||
width: 750px;
|
||||
height: 255px;
|
||||
margin-top: -160px;
|
||||
@include bg_pos('../assets/img/cloud_bottom.png');
|
||||
|
||||
|
||||
@include bg_pos("../assets/img/cloud_bottom.png");
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
|
||||
}
|
||||
</style>
|
||||
Loading…
Reference in New Issue
Block a user