Commit 4293f451 by 穆启卓

第一版

parents
> 1%
last 2 versions
not ie <= 8
.DS_Store
node_modules
/dist
# local env files
.env.local
.env.*.local
# Log files
npm-debug.log*
yarn-debug.log*
yarn-error.log*
# Editor directories and files
.idea
.vscode
*.suo
*.ntvs*
*.njsproj
*.sln
*.sw*
# read_daka
## Project setup
```
npm install
```
### Compiles and hot-reloads for development
```
npm run serve
```
### Compiles and minifies for production
```
npm run build
```
### Run your tests
```
npm run test
```
### Lints and fixes files
```
npm run lint
```
### Customize configuration
See [Configuration Reference](https://cli.vuejs.org/config/).
module.exports = {
presets: [
'@vue/app'
]
}
This source diff could not be displayed because it is too large. You can view the blob instead.
{
"name": "read_daka",
"version": "0.1.0",
"private": true,
"scripts": {
"serve": "vue-cli-service serve",
"build": "vue-cli-service build"
},
"dependencies": {
"axios": "^0.18.0",
"vue": "^2.6.6",
"vue-calendar-component": "^2.8.2",
"vue-router": "^3.0.1",
"vuex": "^3.0.1",
"weixin-js-sdk": "^1.4.0-test"
},
"devDependencies": {
"@vue/cli-plugin-babel": "^3.4.0",
"@vue/cli-service": "^3.4.0",
"less": "^3.9.0",
"less-loader": "^4.1.0",
"stylus": "^0.54.5",
"stylus-loader": "^3.0.2",
"vue-template-compiler": "^2.5.21"
}
}
module.exports = {
plugins: {
autoprefixer: {}
}
}
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=0;" name="viewport" />
<title>每天读书打卡</title>
</head>
<body>
<noscript>
<strong>We're sorry but read_daka doesn't work properly without JavaScript enabled. Please enable it to continue.</strong>
</noscript>
<div id="app"></div>
<!-- built files will be auto injected -->
</body>
</html>
<template>
<div id="app">
<router-view/>
<HelloWorld></HelloWorld>
</div>
</template>
<script>
import HelloWorld from "@/components/HelloWorld.vue";
export default {
components: {
HelloWorld
},
mounted() {
(function (win) {
var doc = win.document;
var html = doc.documentElement;
// 基于750px方案的设计稿
////////////////////////////////////////////////////
// 通用的做法是将设计稿中的100px换算为1rem
// 因此,当我们已知设计稿的宽度baseWidth,还有屏幕的实际宽度clientWidth时,1rem对于屏幕的实际宽度为:
// html-font-size = clientWidth / (baseWidth/100) px
///////////////////////////////////////////////////
var baseWidth = 750,
grids = baseWidth / 100,
resizeEvt = "orientationchange" in win ? "orientationchange" : "resize",
recalc = function () {
// 默认尺寸为320px
var clientWidth = html.clientWidth || 640;
// 如果屏幕尺寸大于750,则按750宽度进行计算
if (clientWidth > 750) {
clientWidth = 750;
}
html.style.fontSize = clientWidth / grids + "px";
// document.querySelector(".content").style.display = "block";
};
if (!doc.addEventListener) return;
win.addEventListener(resizeEvt, recalc, false);
doc.addEventListener(
"DOMContentLoaded",
function () {
setTimeout(recalc);
},
false
);
})(window);
}
};
</script>
<style lang="stylus">
html,
body,
div,
span,
applet,
object,
iframe,
h1,
h2,
h3,
h4,
h5,
h6,
p,
blockquote,
pre,
a,
abbr,
acronym,
address,
big,
cite,
code,
del,
dfn,
em,
img,
ins,
kbd,
q,
s,
samp,
small,
strike,
strong,
sub,
sup,
tt,
var,
b,
u,
i,
center,
dl,
dt,
dd,
ol,
ul,
li,
fieldset,
form,
label,
legend,
table,
caption,
tbody,
tfoot,
thead,
tr,
th,
td,
article,
aside,
canvas,
details,
embed,
figure,
figcaption,
footer,
header,
hgroup,
menu,
nav,
output,
ruby,
section,
summary,
time,
mark,
audio,
video {
margin: 0;
padding: 0;
border: 0;
font-size: 100%;
font: inherit;
vertical-align: baseline;
}
/* HTML5 display-role reset for older browsers */
article,
aside,
details,
figcaption,
figure,
footer,
header,
hgroup,
menu,
nav,
section {
display: block;
}
body {
line-height: 1;
}
ol,
ul {
list-style: none;
}
blockquote,
q {
quotes: none;
}
blockquote:before,
blockquote:after,
q:before,
q:after {
content: "";
content: none;
}
table {
border-collapse: collapse;
border-spacing: 0;
}
body,html,#app
margin 0
width 100%
height 100%
</style>
\ No newline at end of file
<template>
<div class="DakaSuccess">
<div class="content">
<img
src="../assets/ic_close.png"
class="close_icon"
@click="closeModal"
>
<div class="title_container">
<div class="title">早起打卡成功</div>
<div class="sub_title">请继续保持早起习惯哦~</div>
</div>
<img
src="../assets/pop_hand.png"
class="main_pic"
>
<div class="desc">奖励金预计当日13点前到账</div>
<div
class="DakaSuccess_button"
@click="nextSign"
>报名下一期</div>
</div>
</div>
</template>
<style>
div.DakaSuccess {
width: 100%;
height: 100%;
position: fixed;
top: 0;
left: 0;
background: rgba(0, 0, 0, 0.3);
border: 1px solid transparent;
text-align: center;
}
div.DakaSuccess .close_icon {
display: block;
position: absolute;
top: 0.2rem;
right: 0.2rem;
width: 0.3rem;
}
div.DakaSuccess .content {
width: 6.4rem;
height: 6.85rem;
background: #ffffff;
border-radius: 0.06rem;
margin: auto;
position: absolute;
top: 0;
left: 0;
bottom: 0;
right: 0;
border: 1px solid transparent;
}
div.DakaSuccess .content .title_container {
height: 1rem;
}
div.DakaSuccess .content .title {
font-size: 0.4rem;
color: #282828;
margin-top: 0.6rem;
font-weight: bold;
}
div.DakaSuccess .content .sub_title {
margin-top: 0.18rem;
font-size: 0.4rem;
color: #282828;
}
div.DakaSuccess .content img.main_pic {
width: 3.2rem;
margin-top: 0.2rem;
}
div.DakaSuccess .content .desc {
margin-top: 0.24rem;
color: #5a5a5a;
font-size: 0.28rem;
}
div.DakaSuccess .content .desc span {
font-size: 0.36rem;
color: #282828;
font-weight: bold;
}
div.DakaSuccess .content .sub_desc {
margin-top: 0.3rem;
color: #5a5a5a;
font-size: 0.24rem;
}
div.DakaSuccess .content .DakaSuccess_button {
width: 5rem;
height: 0.88rem;
margin-top: 0.4rem;
margin-left: calc((6.4rem - 5rem) / 2);
background: #ffbb34;
border-radius: 0.44rem;
font-size: 0.38rem;
font-weight: bold;
color: #ffffff;
line-height: calc(0.88 / 0.38);
}
</style>
<script>
export default {
name: "DakaSuccess",
components: {},
data() {
return {
can_get: false,
invite_num: 4
};
},
methods: {
// 关闭弹窗
closeModal() {
this.$emit("close", true);
},
// 邀请好友
nextSign() {
this.$emit("nextSign", true);
this.$emit("close", true);
},
// 立即报名
joinDakaSuccess() {}
}
};
</script>
<template>
<div class="example_modal">
<div class="example_img">
<img src="../assets/daka_example_modal.png" alt="">
</div>
<div class="example_btn" @click="closeDialog">
我知道了
</div>
</div>
</template>
<script>
export default {
name: "ExampleModal",
methods: {
closeDialog() {
this.$emit("close")
}
}
}
</script>
<style scoped>
.example_modal{
width: 100%;
height: 100%;
position: fixed;
top: 0;
left: 0;
background: rgba(0, 0, 0, 0.7);
border: 1px solid transparent;
z-index: 100;
text-align: center;
display: flex;
flex-direction: column;
align-items: center;
justify-content: center;
}
.example_img{
width: 6.4rem;
}
.example_img img{
width: 100%;
}
.example_btn{
width: 2.8rem;
height: .8rem;
display: flex;
justify-content: center;
align-items: center;
color: rgba(255,255,255,1);
font-size: .36rem;
border-radius: .4rem;
border: .01rem solid rgba(255,255,255,1);
margin-top: .5rem;
}
</style>
<template>
<div class="follow_dialog">
<div class="follow_img" v-if="isKefu==1">
<img src="https://cos-minigame.wxatech.com/common/study_contact_kefu.jpg" alt="">
</div>
<div class="follow_img" v-else>
<img src="https://cos-minigame.wxatech.com/common/study_follow_account1.jpg" alt="">
</div>
<div class="close_btn" @click="closeDialog">
<img src="../assets/ic_close3.png" alt="">
</div>
</div>
</template>
<script>
export default {
name: "FollowDialog",
props: ["isKefu"],
methods: {
closeDialog() {
this.$emit("close")
}
}
}
</script>
<style scoped>
.follow_dialog {
width: 100%;
height: 100%;
position: fixed;
top: 0;
left: 0;
background: rgba(0, 0, 0, 0.7);
border: 1px solid transparent;
z-index: 100;
text-align: center;
}
.follow_img {
position: absolute;
left: 50%;
top: 50%;
width: 6.4rem;
margin-top: -4.5rem;
margin-left: -3.2rem;
}
.follow_img img {
width: 100%;
}
.close_btn {
width: .7rem;
position: absolute;
top: 50%;
left: 50%;
margin-top: 4rem;
margin-left: -.35rem;
}
.close_btn img {
width: 100%;
}
</style>
<template>
<div class="hello">
</div>
</template>
<script>
import {jssdk, shareContent} from "@/components/axios/api";
export default {
name: "HelloWorld",
props: {
msg: String
},
mounted() {
this.getConfig();
},
methods: {
// 微信分参数
getConfig() {
// if (sessionStorage.getItem("jssdk_ready") || !window["userData"]) {
// return;
// }
let url = location.href.split("#")[0]; //获取锚点之前的链接
// url = url.split("?")[0];
console.log("jssdk注入1", url);
jssdk(url).then(response => {
let res = response.data;
this.wxInit(res);
});
},
wxConfig() {
// console.log(wx);
// wx.config({
// debug: false,
// appId: "",
// timestamp: "",
// nonceStr: "",
// signature: "",
// jsApiList: [
// "onMenuShareTimeline",
// "onMenuShareAppMessage",
// "onMenuShareQQ",
// "onMenuShareWeibo",
// "onMenuShareQZone",
// "updateTimelineShareData"
// ]
// });
},
// 微信分享
wxInit(res) {
let url = location.href.split("#")[0]; //获取锚点之前的链接
// url = url.split("?")[0];
let links = url + "#/SignUp";
let title = "测试标题";
let desc = "测试描述";
let imgUrl = "";
console.log("获取jssdk数据", res);
wx.config({
debug: false, // 开启调试模式,调用的所有api的返回值会在客户端alert出来,若要查看传入的参数,可以在pc端打开,参数信息会通过log打出,仅在pc端时才会打印。
appId: "wx9af64967a0d40159", // 必填,公众号的唯一标识
timestamp: res.timestamp, // 必填,生成签名的时间戳
nonceStr: res.nonceStr, // 必填,生成签名的随机串
signature: res.signature, // 必填,签名
jsApiList: [
"onMenuShareTimeline",
"updateTimelineShareData",
"updateAppMessageShareData",
"chooseWXPay",
"onMenuShareAppMessage",
] // 必填,需要使用的JS接口列表
});
wx.ready( ()=> {
console.log("jssdk注入成功");
let links = `${
location.href.split("#")[0].split("?")[0]
}?test=1&`;
shareContent("free_contract").then(res => {
let result = res.data;
console.log("分享内容", result, links);
let option1 = {
title: result.title, // 分享标题
desc: result.desc, // 分享描述
link: links, // 分享链接
imgUrl: result.img_url, // 分享图标
success: function (res) {
console.log("option1Success", res)
}
}
wx.updateAppMessageShareData(option1);
//微信分享菜单测试
let option3 = {
title: result.title, // 分享标题
desc: result.desc, // 分享描述
link: links, // 分享链接
imgUrl: result.img_url, // 分享图标
success: function (res) {
console.log("option3Success", res)
}
}
wx.onMenuShareAppMessage(option3);
let option4 = {
title: result.title, // 分享标题
link: links, // 分享链接,该链接域名或路径必须与当前页面对应的公众号JS安全域名一致
imgUrl: result.img_url, // 分享图标
success: function (res) {
console.log("option4Success", res)
},
fail: (err) => {
console.log("option4error", err)
}
}
// wx.onMenuShareTimeline(option4);
});
console.log("this.$router.history.current.name",this.$router)
if (this.$router.history.current.name != "Daka") {
shareContent("pyq").then(result => {
console.log("pyq2", result)
wx.onMenuShareTimeline({
title: result.data.title, // 分享标题
link: links, // 分享链接,该链接域名或路径必须与当前页面对应的公众号JS安全域名一致
imgUrl: result.data.img_url, // 分享图标
success: (res) => {
// setTimeout(function(){
//回调要执行的代码
// alert(33)
// }, 500);
},
cancel: (res) => {
// alert(55)
},
fail: (res) => {
// alert(44)
}
})
})
}
// wx.updateAppMessageShareData({
// title: title, // 分享标题
// desc: desc, // 分享描述
// link: links, // 分享链接
// imgUrl: imgUrl, // 分享图标
// success: function() {}
// });
// //微信分享菜单测试
// wx.updateTimelineShareData({
// title: title, // 分享标题
// desc: desc, // 分享描述
// link: links, // 分享链接
// imgUrl: imgUrl, // 分享图标
// success: function() {}
// });
sessionStorage.setItem("jssdk_ready", 1);
});
wx.error(function (err) {
alert(JSON.stringify(err));
});
// 1秒后,如果还没有jssdk注入,则重新调用注入请求方法
// setTimeout(() => {
// if (!sessionStorage.getItem("jssdk_ready")) {
// this.getConfig();
// }
// }, 1000);
}
}
};
</script>
<style scoped>
</style>
<template>
<div class="Loading">
<div class="mask"></div>
<div class="loadingDialog">
<div class="loadEffect">
<span></span>
<span></span>
<span></span>
<span></span>
<span></span>
<span></span>
<span></span>
<span></span>
</div>
<div class="loadingText">加载中,请稍等</div>
</div>
</div>
</template>
<script>
export default {
name: "Loading"
}
</script>
<style scoped>
.loadingText{
color: #ffffff;
margin-top: 0.3rem;
opacity: 0.9;
font-size: .18rem;
}
.Loading {
width: 100%;
height: 100%;
position: absolute;
left: 0;
top: 0;
}
.mask {
width: 100%;
height: 100%;
background: #000000;
opacity: 0.7;
}
.loadingDialog {
width: 100%;
height: 100%;
position: absolute;
left: 0;
top: 0;
display: flex;
justify-content: center;
align-items: center;
flex-direction: column;
}
.loadEffect{
width: 1rem;
height: 1rem;
position: relative;
}
.loadEffect span{
display: inline-block;
width: 0.16rem;
height: 0.16rem;
border-radius: 50%;
background: #ffffff;
position: absolute;
-webkit-animation: load 1.04s ease infinite;
}
@-webkit-keyframes load{
0%{
opacity: 1;
}
100%{
opacity: 0.2;
}
}
.loadEffect span:nth-child(1){
left: 0;
top: 50%;
margin-top:-0.08rem;
-webkit-animation-delay:0.13s;
}
.loadEffect span:nth-child(2){
left: 0.14rem;
top: 0.14rem;
-webkit-animation-delay:0.26s;
}
.loadEffect span:nth-child(3){
left: 50%;
top: 0;
margin-left: -0.08rem;
-webkit-animation-delay:0.39s;
}
.loadEffect span:nth-child(4){
top: 0.14rem;
right:0.14rem;
-webkit-animation-delay:0.52s;
}
.loadEffect span:nth-child(5){
right: 0;
top: 50%;
margin-top:-0.08rem;
-webkit-animation-delay:0.65s;
}
.loadEffect span:nth-child(6){
right: 0.14rem;
bottom:0.14rem;
-webkit-animation-delay:0.78s;
}
.loadEffect span:nth-child(7){
bottom: 0;
left: 50%;
margin-left: -0.08rem;
-webkit-animation-delay:0.91s;
}
.loadEffect span:nth-child(8){
bottom: 0.14rem;
left: 0.14rem;
-webkit-animation-delay:1.04s;
}
</style>
<template>
<div class="Modal">
<div class="content">
<div v-if="!option.showIcon" :class="option.changeImportant?'modal_desc':'modal_title'">
{{title_text}}
</div>
<div v-else>
<img class="icon" src="../assets/ic_fri.png" alt="">
</div>
<div :class="option.changeImportant?'modal_title':'modal_desc'" :style="option.showIcon?'margin-top:.2rem':''">
{{title_desc}}
</div>
<div v-if="option.subDesc" :class="option.changeImportant?'modal_title':'modal_desc'" style="margin-top: .1rem">
{{option.subDesc}}
</div>
<div class="btn_container">
<div class="cancel_btn" @click="closeModal" v-if="option.showCancel">
取消
</div>
<div class="confirm_btn" @click="confirmModal">
{{option.btnText?option.btnText:'确定'}}
</div>
</div>
</div>
</div>
</template>
<style scoped>
.icon {
width: 1.07rem;
margin-top: .4rem;
}
div.Modal {
width: 100%;
height: 100%;
position: fixed;
top: 0;
left: 0;
background: rgba(0, 0, 0, 0.7);
border: 1px solid transparent;
text-align: center;
}
div.Modal .content {
width: 5.8rem;
height: 3.7rem;
background: #ffffff;
border-radius: 0.2rem;
margin: auto;
position: absolute;
top: 0;
left: 0;
bottom: 0;
right: 0;
border: 1px solid transparent;
}
div.Modal .content .modal_title {
font-size: 0.36rem;
color: #282828;
margin-top: 0.6rem;
font-weight: bold;
}
div.Modal .content .modal_desc {
margin-top: 0.6rem;
font-size: 0.3rem;
padding: 0 0.5rem;
color: #8a8a8a;
line-height: 1.2;
}
.btn_container {
width: 100%;
display: flex;
position: absolute;
bottom: 0;
}
div.Modal .content .cancel_btn {
flex: 1;
border-top: 1px solid #e8e8e8;
border-right: 1px solid #e8e8e8;
padding: 0.36rem 0;
color: rgba(136, 136, 136, 1);
font-weight: bold;
/*height: 1.02rem;*/
font-size: 0.3rem;
}
div.Modal .content .confirm_btn {
flex: 1;
border-top: 1px solid #e8e8e8;
padding: 0.36rem 0;
color: rgba(26, 211, 212, 1);
font-weight: bold;
/*height: 1.02rem;*/
font-size: 0.3rem;
}
</style>
<script>
export default {
name: "Modal",
components: {},
data() {
return {};
},
methods: {
// 关闭弹窗
confirmModal() {
this.$emit("confirmModal", this.option.scb)
},
closeModal() {
this.$emit("close", true);
},
// 邀请好友
inviteFriend() {
},
// 立即报名
joinModal() {
}
},
props: ["title", "desc", "option"],
computed: {
title_text() {
return this.title;
},
title_desc() {
return this.desc;
}
}
};
</script>
<template>
<div class="notice_bonus" v-if="isShowNotice">
<img class="icon_container" src="../images/components/NoticeBonus/sy_guangbo.png" alt="">
<div ref="container" class="msg_container">
<!--<div class="notice_msg" v-for='item in notice_list'>-->
<!--{{item}}-->
<!--</div>-->
<div ref="msg1" :class="['notice_msg', startAnimate?'msg1':'']">{{msg1}}</div>
<div :class="['notice_msg', startAnimate?'msg2':'']">{{msg2}}</div>
</div>
</div>
</template>
<style>
.notice_bonus {
width: 3.6rem;
height: .32rem;
border-radius: .06rem;
background: rgba(255, 255, 255, .2);
display: flex;
align-items: center;
padding: 0 .14rem;
box-sizing: border-box;
}
.icon_container {
width: .22rem;
height: .2rem;
flex-shrink: 0;
margin-right: .1rem;
}
.msg_container {
flex: 1;
height: .32rem;
transform-style: preserve-3d;
overflow: hidden;
}
.notice_msg {
font-size: .2rem;
color: #fff;
line-height: .32rem;
text-align: center;
white-space: nowrap;
text-overflow: ellipsis;
overflow: hidden;
width: 100%;
}
.msg1 {
transform: translate3d(0, 0.32rem, 0);
animation: rowUp 10s infinite;
/* transform: translateZ(35rpx); */
}
.msg2 {
transform: translate3d(0, 0, 0);
animation: rowUp2 10s infinite;
/* transform: rotateX(90deg) translateZ(35rpx); */
}
/* .rotate-animation {
animation: rotate .3s linear 0s 1 normal forwards;
}
@keyframes rotate {
0% {
transform: rotateX(0deg);
}
100% {
transform: rotateX(-90deg);
}
} */
@keyframes rowUp {
0% {
-webkit-transform: translate3d(0, 0.32rem, 0);
transform: translate3d(0, 0.32rem, 0);
}
10% {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
40% {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
50% {
-webkit-transform: translate3d(0, -0.32rem, 0);
transform: translate3d(0, -0.32rem, 0);
}
100% {
-webkit-transform: translate3d(0, -0.32rem, 0);
transform: translate3d(0, -0.32rem, 0);
}
}
@keyframes rowUp2 {
0% {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
50% {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
60% {
-webkit-transform: translate3d(0, -0.32rem, 0);
transform: translate3d(0, -0.32rem, 0);
}
90% {
-webkit-transform: translate3d(0, -0.32rem, 0);
transform: translate3d(0, -0.32rem, 0);
}
100% {
-webkit-transform: translate3d(0, -0.96rem, 0);
transform: translate3d(0, -0.96rem, 0);
}
}
</style>
<script>
import {gameInfo} from "@/components/axios/api";
export default {
name: "NoticeBonus",
data() {
return {
isShowNotice:false,
notice_list: [],
gameInfo: {
"fly_top": [],
"fly_bot": []
},
canScroll: true,
curIndex: 0,
startAnimate: false,
msg1: "",
msg2: "",
};
},
// props: ["notice_list"],
// computed: {
// notice() {
// return this.notice_list;
// }
// },
methods: {
stopScroll(e) {
console.log(e)
e.preventDefault();
},
getGameInfo(nonRefresh) {
gameInfo().then(result => {
console.log("result", result)
if (result.code == 0) {
let fly_bot = result.data.fly_bot
let fly_top = result.data.fly_top
let len = Math.max(fly_bot.length, fly_top.length)
let list = []
for (let i = 0; i < len; i++) {
fly_bot[i] && (list.push(fly_bot[i]))
fly_top[i] && (list.push(fly_top[i]))
}
this.notice_list = list
this.canScroll = true
this.msg1 = this.notice_list[0]
this.msg2 = this.notice_list[1]
console.log("this.notice_list", this.notice_list)
this.isShowNotice=true
}
})
},
msgAnimate() {
setTimeout(() => {
this.startAnimate = true
}, 100)
let timer = sessionStorage.getItem("timer")
if (timer) {
clearInterval(Number(timer))
}
let newTimer = setInterval(() => {
if (Math.abs(this.notice_list.length - this.curIndex) <= 2) {
this.curIndex = 0
if (window.location.hash == "#/Daka") {
this.getGameInfo()
}
} else {
this.curIndex += 2
}
this.msg1 = this.notice_list[this.curIndex]
this.msg2 = this.notice_list[this.curIndex + 1]
}, 10000)
sessionStorage.setItem("timer", newTimer + "")
}
},
created() {
this.getGameInfo()
},
mounted() {
this.msgAnimate()
}
};
</script>
<template>
<div class="pay_fail_modal">
<div class="content">
<img class="closeBtn" src="../assets/ic_close.png" alt="" @click="closeModal">
<div class="title">支付遇到问题?</div>
<div class="modal_tip">可长按识别下方二维码</div>
<div class="modal_tip">联系客服小姐姐立即为你解决哦~</div>
<div class="qrcode">
<img src="../assets/qrcode.jpg" alt="">
</div>
</div>
</div>
</template>
<script>
export default {
name: "PayFailModal",
methods:{
closeModal() {
this.$emit("close")
}
}
}
</script>
<style scoped>
.pay_fail_modal {
width: 100%;
height: 100%;
position: fixed;
top: 0;
left: 0;
background: rgba(0, 0, 0, 0.7);
border: 1px solid transparent;
z-index: 100;
text-align: center;
}
.content {
width: 6.4rem;
height: 7.5rem;
background: #ffffff;
position: absolute;
left: 50%;
top: 50%;
margin-left: -3.2rem;
margin-top: -3.75rem;
}
.closeBtn{
width: .3rem;
position: absolute;
right: .2rem;
top: .2rem;
}
.title {
font-size: .4rem;
font-weight: bold;
margin: .6rem 0;
}
.modal_tip {
font-size: .28rem;
color: rgba(90, 90, 90, 1);
margin-bottom: .2rem;
}
.qrcode{
display: flex;
justify-content: center;
align-items: center;
}
.qrcode img {
width: 3.86rem;
display: block;
}
</style>
<template>
<div class="Reborn">
<div class="content">
<img
src="../assets/ic_close.png"
class="close_icon"
@click="closeModal"
>
<div
class="title_container"
v-if="!can_get"
>
<div class="title">邀请1位好友报名成功</div>
<div class="sub_title">可获得1次复活机会</div>
</div>
<div
class="title_container"
v-if="can_get"
>
<div class="title">已有好友帮你获得1次复活机会</div>
</div>
<img
src="../assets/pic_fh.png"
class="main_pic"
>
<div class="desc">已获得<span class="invite_num"> {{invite_num}} </span>张复活卡</div>
<div class="sub_desc">当日未完成打卡,可在24:00前使用复活卡复活</div>
<div class="btn_container">
<div class="share_btn">
<div
class="Reborn_button"
v-if="can_get"
@click="joinReborn"
>复活打卡
</div>
<div
class="Reborn_button"
v-if="!can_get"
@click="inviteFriend"
>邀请好友
</div>
</div>
<!--<div-->
<!--class="Reborn_button2"-->
<!--@click="showImg"-->
<!--&gt;获取邀请卡-->
<!--</div>-->
</div>
</div>
<ShareModal
v-on:close="closeShareModal"
v-if="showShareModal"
></ShareModal>
</div>
</template>
<style>
div.Reborn {
text-align: center;
width: 100%;
height: 100%;
position: fixed;
top: 0;
left: 0;
background: rgba(0, 0, 0, 0.7);
border: 1px solid transparent;
}
div.Reborn .close_icon {
display: block;
position: absolute;
top: 0.2rem;
right: 0.2rem;
width: 0.3rem;
}
div.Reborn .content {
width: 6.4rem;
height: 7.25rem;
background: #ffffff;
border-radius: 0.06rem;
margin: auto;
position: absolute;
top: 0;
left: 0;
bottom: 0;
right: 0;
border: 1px solid transparent;
}
div.Reborn .title_container {
height: 1.6rem;
padding-top: 0;
border: 1px solid transparent;
}
div.Reborn .content .title {
font-size: 0.4rem;
color: #282828;
margin-top: 0.6rem;
font-weight: bold;
}
div.Reborn .content .sub_title {
margin-top: 0.18rem;
font-size: 0.4rem;
color: #282828;
}
div.Reborn .content img.main_pic {
width: 3.2rem;
margin-top: 0.2rem;
}
div.Reborn .content .desc {
margin-top: 0.24rem;
color: #5a5a5a;
font-size: 0.28rem;
}
div.Reborn .content .desc span {
font-size: 0.36rem;
color: #282828;
font-weight: bold;
}
div.Reborn .content .sub_desc {
margin-top: 0.3rem;
color: #5a5a5a;
font-size: 0.24rem;
}
div.Reborn .content .Reborn_button {
width: 5rem;
height: 0.88rem;
background: #6eb5f5;
border-radius: 0.44rem;
font-size: 0.38rem;
font-weight: bold;
color: #ffffff;
line-height: calc(0.88 / 0.38);
}
div.Reborn .content .Reborn_button2 {
width: 2.6rem;
height: 0.88rem;
margin-left: 0.3rem;
background: #ffbb34;
border-radius: 0.44rem;
font-size: 0.38rem;
font-weight: bold;
color: #ffffff;
line-height: calc(0.88 / 0.38);
}
</style>
<style scoped>
.btn_container {
display: flex;
justify-content: center;
margin-top: .4rem;
}
</style>
<script>
import ShareModal from "@/components/ShareModal.vue";
import {shareContent, track} from "@/components/axios/api";
export default {
name: "Reborn",
components: {ShareModal},
data() {
return {
showShareModal: false,
userData: null
// can_get: false,
// invite_num: 4
};
},
methods: {
//打开分享图
showImg() {
this.$emit("showShareImg", "code_rebirth")
},
// 关闭弹窗
closeModal() {
shareContent("").then(res => {
let result = res.data;
let links = `${location.href.split("#")[0].split("?")[0]}`;
wx.updateAppMessageShareData({
title: result.title, // 分享标题
desc: result.desc, // 分享描述
link: links, // 分享链接
imgUrl: result.img_url, // 分享图标
success: function () {
}
});
wx.onMenuShareAppMessage({
title: result.title, // 分享标题
desc: result.desc, // 分享描述
link: links, // 分享链接,该链接域名或路径必须与当前页面对应的公众号JS安全域名一致
imgUrl: result.img_url, // 分享图标
success: function () {
// 用户点击了分享后执行的回调函数
}
});
// wx.onMenuShareTimeline({
// title: result.title, // 分享标题
// link: links, // 分享链接,该链接域名或路径必须与当前页面对应的公众号JS安全域名一致
// imgUrl: result.img_url, // 分享图标
// success: function () {
// }
// });
});
this.$emit("close", true);
},
closeShareModal() {
this.showShareModal = false;
},
// 邀请好友
inviteFriend() {
this.showShareModal = true;
let id = this.userData.id;
track("rebitrh_share");
console.log("处理前连接", location.href);
let links = `${
location.href.split("#")[0].split("?")[0]
}?inviter=${id}&from_type=rebirth&`;
console.log("处理后的连接", links);
shareContent("rebirth").then(res => {
let result = res.data;
wx.updateAppMessageShareData({
title: result.title, // 分享标题
desc: result.desc, // 分享描述
link: links, // 分享链接
imgUrl: result.img_url, // 分享图标
success: function () {
}
});
wx.onMenuShareAppMessage({
title: result.title, // 分享标题
desc: result.desc, // 分享描述
link: links, // 分享链接,该链接域名或路径必须与当前页面对应的公众号JS安全域名一致
imgUrl: result.img_url, // 分享图标
success: function () {
// 用户点击了分享后执行的回调函数
track("rebitrh_share_act");
}
});
// wx.onMenuShareTimeline({
// title: result.title, // 分享标题
// link: links, // 分享链接,该链接域名或路径必须与当前页面对应的公众号JS安全域名一致
// imgUrl: result.img_url, // 分享图标
// success: function () {
// }
// });
});
},
// 立即报名
joinReborn() {
this.$emit("rebirth", true);
}
},
mounted() {
if (window["userData"]) {
this.userData = window["userData"];
} else {
let localUserData = localStorage.getItem("read_userData");
if (localUserData) {
window["userData"] = JSON.parse(localUserData);
this.userData = window["userData"];
}
}
},
props: ["v_data"],
computed: {
can_get() {
return this.v_data.can_get;
},
invite_num() {
return this.v_data.cnt;
}
}
};
</script>
<template>
<div class="redpack_dialog">
<div class="redpack_img" v-if="type==1">
<img :src="withdrawData.task_url" alt="">
</div>
<div class="redpack_img" v-else>
<img :src="withdrawData.withdraw_url_1" alt="">
</div>
<div class="redpack_tip">长按识别小程序码领取</div>
<div class="close_btn" @click="closeDialog">
<img src="../assets/ic_close3.png" alt="">
</div>
</div>
</template>
<script>
export default {
name: "RedpackDialog",
props:["withdrawData","type"],
methods: {
closeDialog() {
this.$emit("close")
}
}
}
</script>
<style scoped>
.redpack_tip {
position: absolute;
left: 50%;
top: 50%;
margin-left: -1.2rem;
margin-top: 3.35rem;
color: #fff;
font-size: 0.34rem;
animation: redpack_tip_animate 1.5s infinite;
}
@keyframes redpack_tip_animate {
0% {
transform: scale(1, 1)
}
50% {
transform: scale(1.2, 1.2)
}
100% {
transform: scale(1, 1)
}
}
.redpack_dialog {
width: 100%;
height: 100%;
position: fixed;
top: 0;
left: 0;
background: rgba(0, 0, 0, 0.7);
border: 1px solid transparent;
z-index: 100;
text-align: center;
}
.redpack_img {
position: absolute;
left: 50%;
top: 50%;
width: 6.4rem;
margin-top: -4.5rem;
margin-left: -3.2rem;
}
.redpack_img img {
width: 100%;
}
.close_btn {
width: .7rem;
position: absolute;
top: .3rem;
right: .5rem;
}
.close_btn img{
width: 100%;
height: 100%;
}
</style>
<template>
<div
class="ShareModal"
@click="closeModal"
>
<img class="arrow"
src="../assets/share_tip_arrow.png"
alt=""
>
<img class="tip"
src="../assets/share_tip.png"
alt=""
>
</div>
</template>
<style>
div.ShareModal {
width: 100%;
height: 100%;
position: fixed;
top: 0;
left: 0;
background: rgba(0, 0, 0, 0.7);
border: 1px solid transparent;
z-index: 100;
}
.tip {
position: absolute;
width: 3rem;
height: 1.55rem;
top: 1.2rem;
right: 1.2rem;
}
.arrow{
position: absolute;
width: 1.2rem;
height: 0.95rem;
top: 0.1rem;
right: 0.3rem;
animation: arrowMove 1s infinite;
}
@keyframes arrowMove {
0%{
top: 0.1rem;
right: 0.3rem;
}
50%{
top: 0.3rem;
right: 0.5rem;
}
0%{
top: 0.1rem;
right: 0.3rem;
}
}
</style>
<script>
export default {
name: "ShareModal",
data() {
return {};
},
methods: {
// 关闭弹窗
closeModal() {
this.$emit("close", true);
}
}
};
</script>
<template>
<div class="title_container">
<img class="back" :src="arrowSrc" @click="goBack" v-if="show_back">
<div class="title_text" :style="'color:'+thisTitleColor">{{title_text}}</div>
<div class="my_data" v-if="show_my_data">
<router-link to="/MyData" replace>个人信息</router-link>
</div>
<div class="my_data" v-if="show_blame">
<router-link to="/Blame" replace>投诉</router-link>
</div>
</div>
</template>
<script>
export default {
name: "Title",
data() {
return {
blackArrow: require('../images/components/Title/ic_back_black.png'),
whiteArrow: require('../images/components/Title/ic_back_white.png'),
};
},
props: ["title", "show_back", "show_my_data", "show_blame", "arrowColor", "titleColor"],
methods: {
goBack() {
this.$emit("goback", true);
}
},
computed: {
title_text() {
return this.title;
},
thisTitleColor() {
let titleColor = '#fff';
if (this.titleColor) {
titleColor = this.titleColor;
}
return titleColor;
},
arrowSrc() {
let arrowSrc = this.whiteArrow;
if (this.arrowColor === 'black') {
arrowSrc = this.blackArrow;
} else if (this.arrowColor === 'white') {
arrowSrc = this.whiteArrow;
}
return arrowSrc;
}
}
};
</script>
<style>
.title_container {
font-size: 0.36rem;
color: #ffffff;
}
.title_container > div {
font-size: 0.36rem;
}
.title_container > div > a {
font-size: 0.32rem;
color: #ffffff;
text-decoration: none;
}
.back {
width: 0.24rem;
height: 0.42rem;
left: 0.2rem;
top: 0.26rem;
position: absolute;
}
.my_data {
position: absolute;
top: 0.32rem;
right: 0.2rem;
font-size: 0.32rem;
}
.big .title_container {
padding-top: 0.3rem;
}
.big .my_data {
top: 0.32rem;
font-size: 0.32rem;
}
.title_text {
height: .36rem;
font-size: 0.36rem;
line-height: 1;
text-align: center;
padding: .3rem 0;
}
</style>
\ No newline at end of file
import axios from 'axios';//引入axios
export function fetch(options) {
// if (!window['userData']) {
// let user_data_str = localStorage.getItem('read_userData');
// if (user_data_str) {
// window['userData'] = JSON.parse(user_data_str);
// }
// }
// if (!window['userData']) {
// localStorage.setItem('last_url', location.hash.slice(1));
// location.replace('#/Author');
// // this.$router.push({name:"Author"})
// }
return new Promise((resolve, reject) => {
const instance = axios.create({ //instance创建一个axios实例,可以自定义配置,可在 axios文档中查看详情
//所有的请求都会带上这些配置,比如全局都要用的身份信息等。
headers: {
'Content-Type': 'application/json',
// 'Authorization': window['userData']?window['userData'].token:''
'Authorization':"eyJ0eXAiOiJKV1QiLCJhbGciOiJIUzI1NiJ9.eyJ1c2VyX2lkIjoiMDAwMDAwMDAwMDAwMDAwMDAwMDAwMDAwMDAwMDAwMDAiLCJvcGVuX2lkIjoiMTExMTExMTExMTExMTExMTExMTExMTExMTExMSIsImV4cCI6MTU1Mzk3MTExOX0.KZhzLx6y6t_wDHU35DWNGVIp9M1tZLKzhaW8kMoeBoU"
// 'token_in_header': global_.token,//token从全局变量那里传过来
},
timeout: 30 * 1000 // 30秒超时
});
instance(options)
.then(response => { //then 请求成功之后进行什么操作
console.log('raw response',response);
response.data['date'] = response.headers.date;
resolve(response.data);//把请求到的数据发到引用请求的地方
})
.catch(error => {
console.log('请求异常信息:', error);
// console.log(error);
// if (error.response.status == 401) {
// localStorage.setItem('last_url', location.hash.slice(1));
// localStorage.setItem('read_userData', '');
// location.replace('#/Author');
// // this.$router.push({name:"Author"})
// } else {
// reject(error);
// }
});
});
}
//也可以像下面这样,区分环境或者区分服务器等等
let service = 'dev';
// let service = 'prod';
let api = '';
if (service === 'dev') {
/**dev开发**/
api = '';
} else if (service === 'prod') {
/**prod部署**/
api = 'https://miniapp-api.wxatech.com/game-bsdk';
}
let trackApi = '';
if (service === 'dev') {
/**dev开发**/
trackApi = 'https://test-api.wxagame.com/game-track';
} else if (service === 'prod') {
/**prod部署**/
trackApi = 'https://minigame.api.wxagame.com/game-track';
}
export default {
/**个人中心start**/
//1 打卡查询 GET /api/v1/daka_status
dakaStatusPath: `${api}/api/v1/daka_status`,
//2 打卡操作 POST /api/v1/daka
dakaPath: `${api}/api/v1/daka`,
//3 打卡记录 GET /api/v1/daka_records
dakaRecordsTotalPath: `${api}/api/v1/daka_records/total`,
dakaRecordsListPath: `${api}/api/v1/daka_records/list`,
dakaRecordsDetailPath: `${api}/api/v1/daka_records/detail`,
//4 走马灯、玩法 GET /api/v1/game_info
gameInfoPath: `${api}/api/v1/game_info`,
//5 余额查询 GET /api/v1/balance_query
balanceQueryPath: `${api}/api/v1/balance_query`,
//6 余额提现 GET /api/v1/balance_withdraw
balanceWithdrawPath: `${api}/api/v1/balance_withdraw`,
//7 常见问题 GET /api/v1/faq
faqPath: `${api}/api/v1/faq`,
//8 客服 GET /api/v1/kefu
kefuPath: `${api}/api/v1/kefu`,
//9 关注公众号 GET /api/v1/oc_follow
ocFollowPath: `${api}/api/v1/oc_follow`,
//10 报名支付 GET /api/v1/daka_pay
dakaPayPath: `${api}/api/v1/daka_pay`,
//11 jssdk注入 GET /api/v1/daka_pay
jssdkPath: `${api}/api/v1/config/jssdk`,
// 12 提现banner GET /api/v1/config/withdraw_banner
withdrawBannerPath: `${api}/api/v1/config/withdraw_banner`,
// 13 用户复活卡,免契约金卡信息 GET /api/v1/user_cards
userCardPath: `${api}/api/v1/user_cards`,
// 14 分享内容 /api/v1/config/share_content
shareContentPath: `${api}/api/v1/config/share_content`,
// 15 获取规则文本 /api/v1/get_rule
getRulePath: `${api}/api/v1/get_rule`,
// 16 数据埋点 /api/v1/tracking
trackingPath: `${api}/api/v1/tracking`,
// 17 关注公众号图片 /api/v1/liin_share_image
liinShareImagePath: `${api}/api/v1/liin_share_image`,
// 18 每日分享图 /api/v1/daily_share_image
dailyShareImagePath: `${api}/api/v1/qrcode_url`,
// 19 每日排行榜 /api/v1/daka_rank
dakaRankPath: `${api}/api/v1/daka_rank`,
// 20 新用户 /api/v1/first_daka
firstDakaPath: `${api}/api/v1/first_daka`,
// 21 个人排名 /api/v1/person_rank_info
personRankInfoPath: `${api}/api/v1/person_rank_info`,
// 22 用户当月打卡状态查询
daka_status_list: `${api}/api/v1/daka_status/list`,
// 23 每日故事详情
story_detail: `${api}/api/v1/story/detail`,
// 24 每日故事列表
story_list: `${api}/api/v1/story/list`,
// 25 记录详情
daka_records_detail: `${api}/api/v1/daka_records/detail`,
// 25 规则详情
daka_rule: `${api}/api/v1/daka_rule`,
// 26 红包 /api/v1/withdraw_img
withdraw_img: `${api}/api/v1/withdraw_img`,
// 27 提现明细 /api/v1/withdraw_log
withdraw_log: `${api}/api/v1/withdraw_log`,
// 首页数据
daka_index: `${api}/api/v1/daka_index`,
}
<template>
<div class="share_friend_model" @click="closeModal">
<img class="arrow" src="../assets/img_arrow.png" alt="">
<div class="share_content">
<div class="share_tip tip1">点击右上角三个点选项</div>
<div class="tip_img">
<img src="../assets/ic_fri.png" alt="">
</div>
<div class="img_title">分享朋友圈</div>
<div class="share_tip tip2">分享到朋友圈即为打卡成功</div>
<div class="share_tip tip3">还可邀请更多好友一起学习!</div>
</div>
</div>
</template>
<style scoped>
.share_friend_model {
width: 100%;
height: 100%;
position: fixed;
top: 0;
left: 0;
background: rgba(0, 0, 0, 0.7);
border: 1px solid transparent;
z-index: 100;
text-align: center;
}
.arrow {
position: absolute;
width: 1.5rem;
height: 1.11rem;
top: 0.1rem;
right: 0.3rem;
animation: arrowMove 1s infinite;
}
.share_tip{
font-size: .36rem;
color: #ffffff;
}
.tip1{
margin: 1.8rem 0 .8rem;
}
.tip2{
margin-bottom: .2rem;
}
.img_title{
font-size: .30rem;
color: #ffffff;
margin: .2rem 0 .8rem;
}
.tip_img{
margin: 0 auto;
width: 2rem;
height: 2rem;
border-radius: .2rem;
background: #ffffff;
display: flex;
justify-content: center;
align-items: center;
}
.tip_img img{
width: 1.07rem;
height: 1.07rem;
}
@keyframes arrowMove {
0% {
top: 0.1rem;
right: 0.3rem;
}
50% {
top: 0.3rem;
right: 0.5rem;
}
0% {
top: 0.1rem;
right: 0.3rem;
}
}
</style>
<script>
export default {
name: "shareFriendModel",
data() {
return {};
},
methods: {
// 关闭弹窗
closeModal() {
this.$emit("close", true);
}
}
}
</script>
This diff is collapsed. Click to expand it.
This diff is collapsed. Click to expand it.
This diff is collapsed. Click to expand it.
This diff is collapsed. Click to expand it.
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment