236 changed files with 35572 additions and 11 deletions
@ -1,11 +1,12 @@ |
|||
# ---> Vue |
|||
# gitignore template for Vue.js projects |
|||
# |
|||
# Recommended template: Node.gitignore |
|||
|
|||
# TODO: where does this rule come from? |
|||
docs/_book |
|||
|
|||
# TODO: where does this rule come from? |
|||
test/ |
|||
|
|||
fan: |
|||
node_modules/**/* |
|||
unpackage/ |
|||
unpackage/**/* |
|||
.idea |
|||
.idea/ |
|||
.expo/* |
|||
npm-debug.* |
|||
*.orig.* |
|||
web-build/ |
|||
# macOS |
|||
.DS_Store |
|||
|
|||
@ -0,0 +1,11 @@ |
|||
{ // launch.json 配置了启动调试时相关设置，configurations下节点名称可为 app-plus/h5/mp-weixin/mp-baidu/mp-alipay/mp-qq/mp-toutiao/mp-360/ |
|||
// launchtype项可配置值为local或remote, local代表前端连本地云函数，remote代表前端连云端云函数 |
|||
"version": "0.0", |
|||
"configurations": [{ |
|||
"type": "uniCloud", |
|||
"default": { |
|||
"launchtype": "local" |
|||
} |
|||
} |
|||
] |
|||
} |
|||
@ -0,0 +1,40 @@ |
|||
<style lang="scss"> |
|||
@import "uview-ui/index.scss"; |
|||
</style> |
|||
|
|||
<script> |
|||
export default { |
|||
onLaunch: function() { |
|||
console.log('App Launch') |
|||
}, |
|||
onShow: function() { |
|||
console.log('App Show') |
|||
}, |
|||
onHide: function() { |
|||
console.log('App Hide') |
|||
} |
|||
} |
|||
</script> |
|||
|
|||
<style lang="scss"> |
|||
uni-tabbar { |
|||
.uni-tabbar { // tab背景 |
|||
padding-top:28rpx; |
|||
padding-bottom: 50rpx !important; |
|||
background-image: linear-gradient(to top, #FAF8F8, #FFFFFF)!important; // tab背景图片或者渐变色，背景色和背景图片最多选择一个进行设置 |
|||
.uni-tabbar-border { // tabBar上边框 |
|||
background-color: #F7F4F4!important; // tabBar上边框的颜色 |
|||
} |
|||
.uni-tabbar__bd { // tabBar单项 |
|||
.uni-tabbar__icon { // 图标 |
|||
width: 48rpx!important; |
|||
height: 48rpx!important; |
|||
} |
|||
.uni-tabbar__label { // 文字 |
|||
font-size: 20rpx!important; |
|||
|
|||
} |
|||
} |
|||
} |
|||
} |
|||
</style> |
|||
@ -0,0 +1,108 @@ |
|||
<template> |
|||
<view class="index-header "> |
|||
<view class="flex"> |
|||
<p class="p">Available Balance</p> |
|||
<slot name="rules"></slot> |
|||
</view> |
|||
<view class="rq flex"> |
|||
<view class="index-p1"> |
|||
<span class="category-sigh">₦</span>387400.50 |
|||
</view> |
|||
<view class="index-a1" @click="goRecharge"> |
|||
Recharge |
|||
</view> |
|||
</view> |
|||
</view> |
|||
</template> |
|||
|
|||
<script> |
|||
const COMPONENT_NAME = 'balance' |
|||
export default { |
|||
name: COMPONENT_NAME, |
|||
|
|||
data() { |
|||
return { |
|||
|
|||
} |
|||
}, |
|||
computed: { |
|||
|
|||
}, |
|||
mounted() { |
|||
|
|||
}, |
|||
methods: { |
|||
goRecharge(){ |
|||
uni.navigateTo({ |
|||
url:'../../pages/recharge/index' |
|||
}) |
|||
} |
|||
}, |
|||
} |
|||
</script> |
|||
|
|||
|
|||
<style> |
|||
@font-face { |
|||
font-family: 'din'; |
|||
font-weight: normal; |
|||
font-style: normal; |
|||
src: url("~@/static/fonts/DIN-Bold.otf") format("truetype"); |
|||
} |
|||
|
|||
.index-header{ |
|||
background-color:#34026B ; |
|||
padding: 48rpx 36rpx; |
|||
padding-bottom: 80rpx; |
|||
} |
|||
.index-header .p{ |
|||
color: #9A80B5; |
|||
font-size: 36rpx; |
|||
text-transform: capitalize; |
|||
} |
|||
.flex{ |
|||
display: flex; |
|||
justify-content: space-between; |
|||
align-items: center; |
|||
flex-flow: row wrap; |
|||
} |
|||
.index-header .rq{ |
|||
margin-top: 32rpx; |
|||
} |
|||
.index-p1{ |
|||
font-size: 60rpx; |
|||
color: #fff; |
|||
text-transform: capitalize; |
|||
font-family: 'din'; |
|||
position: relative; |
|||
padding-left: 30rpx; |
|||
} |
|||
.category-sigh{ |
|||
font-size: 36rpx; |
|||
position: absolute; |
|||
left: 0; |
|||
top: 50%; |
|||
transform: translateY(-50%); |
|||
} |
|||
.index-a1{ |
|||
width: 176rpx; |
|||
line-height: 60rpx; |
|||
border-radius: 16rpx; |
|||
background-color: #491C7A; |
|||
padding-left: 26rpx; |
|||
color: #fff; |
|||
font-size: 24rpx; |
|||
position: relative; |
|||
} |
|||
.index-a1::before{ |
|||
content: ''; |
|||
width: 24rpx; |
|||
height: 24rpx; |
|||
background: url(../../static/home/top_icon_ins.png)no-repeat; |
|||
position: absolute; |
|||
right: 8rpx; |
|||
top: 50%; |
|||
transform: translateY(-50%); |
|||
} |
|||
|
|||
</style> |
|||
@ -0,0 +1,56 @@ |
|||
<template> |
|||
<view class="flex"> |
|||
<view class="my-cont"> |
|||
<image src="../../static/home/[email protected]" mode=""></image> |
|||
</view> |
|||
</view> |
|||
</template> |
|||
|
|||
<script> |
|||
const COMPONENT_NAME = 'cont' |
|||
export default { |
|||
name: COMPONENT_NAME, |
|||
|
|||
data() { |
|||
return { |
|||
|
|||
} |
|||
}, |
|||
computed: { |
|||
|
|||
}, |
|||
mounted() { |
|||
|
|||
}, |
|||
methods: { |
|||
|
|||
}, |
|||
} |
|||
</script> |
|||
|
|||
|
|||
<style> |
|||
.flex{ |
|||
display: flex; |
|||
flex-flow: row wrap; |
|||
} |
|||
.my-cont{ |
|||
width: 180rpx; |
|||
height: 180rpx; |
|||
|
|||
position: fixed; |
|||
top: 85%; |
|||
right: 0; |
|||
} |
|||
.my-cont image{ |
|||
width: 100%; |
|||
height: 100%; |
|||
} |
|||
.flex{ |
|||
align-items: center; |
|||
} |
|||
.flex .my-cont{ |
|||
margin-left: auto; |
|||
|
|||
} |
|||
</style> |
|||
@ -0,0 +1,293 @@ |
|||
<template> |
|||
<view class="gameContent" @click="ss"> |
|||
|
|||
<view class="perCon"> |
|||
<view class="perCoun flex"> |
|||
<view class="period"> |
|||
<span>Period</span> |
|||
</view> |
|||
<view class="coDown"> |
|||
count down |
|||
</view> |
|||
</view> |
|||
<view class="timeCon flex"> |
|||
<view class="time"> |
|||
{{colorList0.lotteryPeriod.period}} |
|||
</view> |
|||
<view class="count"> |
|||
<u-count-down :timestamp="colorList0.gap*60" :show-days="false" :show-hours="false"></u-count-down> |
|||
</view> |
|||
</view> |
|||
</view> |
|||
|
|||
<view class=""> |
|||
<view class="flex icon-con"> |
|||
<view class="ico"> |
|||
<image src="../../static/color/[email protected]" mode=""></image> |
|||
</view> |
|||
<view class="ico"> |
|||
<image src="../../static/color/[email protected]" mode=""></image> |
|||
</view> |
|||
<view class="ico"> |
|||
<image src="../../static/color/[email protected]" mode=""></image> |
|||
</view> |
|||
</view> |
|||
|
|||
|
|||
<view class="multiple"> |
|||
<view class="multiple-con flex"> |
|||
<view class="mul-item bg_jb1"> |
|||
0 |
|||
</view> |
|||
<view class="mul-item bg_green"> |
|||
1 |
|||
</view> |
|||
<view class="mul-item bg_red"> |
|||
2 |
|||
</view> |
|||
<view class="mul-item bg_green"> |
|||
3 |
|||
</view> |
|||
<view class="mul-item bg_red"> |
|||
4 |
|||
</view> |
|||
</view> |
|||
<view class="multiple-con flex"> |
|||
<view class="mul-item bg_jb2"> |
|||
5 |
|||
</view> |
|||
<view class="mul-item bg_red"> |
|||
6 |
|||
</view> |
|||
<view class="mul-item bg_green"> |
|||
7 |
|||
</view> |
|||
<view class="mul-item bg_red"> |
|||
8 |
|||
</view> |
|||
<view class="mul-item bg_red"> |
|||
9 |
|||
</view> |
|||
</view> |
|||
</view> |
|||
|
|||
|
|||
|
|||
</view> |
|||
|
|||
|
|||
<view class="donna flex"> |
|||
<view class="flex info"> |
|||
<view class="imgcon"> |
|||
<image :src="'https://apitest.luck-work.com/'+myImgUrl" mode="aspectFit"></image> |
|||
</view> |
|||
<view class="doname"> |
|||
<p class="name">{{myName}}</p> |
|||
<view class="win"> |
|||
64% win |
|||
</view> |
|||
</view> |
|||
</view> |
|||
<view class="recharge"> |
|||
<image src="../../static/color/[email protected]" mode=""></image> |
|||
<span><i>₦</i>2000</span> |
|||
</view> |
|||
<view class="follow"> |
|||
Follow |
|||
</view> |
|||
</view> |
|||
|
|||
|
|||
</view> |
|||
|
|||
</template> |
|||
|
|||
<script> |
|||
import index from '@/utils/index' |
|||
const COMPONENT_NAME = 'gameView' |
|||
export default { |
|||
name: COMPONENT_NAME, |
|||
props:['myName',"myImgUrl","colorList0","colorList1","colorList2","colorList"], |
|||
data() { |
|||
return { |
|||
|
|||
// colorList1:this.colorList[0], |
|||
|
|||
period:'', |
|||
count:'', |
|||
} |
|||
}, |
|||
computed: { |
|||
|
|||
}, |
|||
|
|||
methods: { |
|||
ss(){ |
|||
|
|||
}, |
|||
gaClick(i){ |
|||
this.ganum=i |
|||
// var s=index.formatyymmdd(this.colorList2.addTime); |
|||
// console.log(s) |
|||
} |
|||
}, |
|||
mounted() { |
|||
|
|||
}, |
|||
} |
|||
</script> |
|||
|
|||
|
|||
<style> |
|||
|
|||
.timeCon{ |
|||
margin-top: 38rpx; |
|||
} |
|||
.time,.count{ |
|||
color: #303133; |
|||
font-size: 36rpx; |
|||
} |
|||
.perCoun,.timeCon{ |
|||
align-items: center; |
|||
justify-content: space-between; |
|||
} |
|||
.period,.coDown{ |
|||
text-transform: capitalize; |
|||
color: #909399; |
|||
font-size: 28rpx; |
|||
} |
|||
.perCon{ |
|||
padding-top: 24rpx; |
|||
padding-bottom: 48rpx; |
|||
} |
|||
.gameContent{ |
|||
padding: 0 36rpx; |
|||
} |
|||
.flex{ |
|||
display: flex; |
|||
align-items: center; |
|||
} |
|||
|
|||
|
|||
.icon-con{ |
|||
justify-content: space-between; |
|||
} |
|||
.ico{ |
|||
width: 210rpx; |
|||
height: 80rpx; |
|||
border: 2rpx solid #EDEFF2; |
|||
border-radius: 16rpx; |
|||
position: relative; |
|||
} |
|||
.ico image{ |
|||
width: 40rpx; |
|||
height: 40rpx; |
|||
position: absolute; |
|||
left: 50%; |
|||
top: 50%; |
|||
transform: translate(-50%,-50%); |
|||
} |
|||
.multiple-con{ |
|||
justify-content: space-between; |
|||
flex-wrap: wrap; |
|||
margin-top: 24rpx; |
|||
} |
|||
.mul-item{ |
|||
width: 112rpx; |
|||
line-height: 80rpx; |
|||
color: #fff; |
|||
font-size: 32rpx; |
|||
border-radius: 16rpx; |
|||
text-align: center; |
|||
} |
|||
.bg_green{ |
|||
background-color: #00B977; |
|||
} |
|||
.bg_red{ |
|||
background-color: #F25B5B; |
|||
} |
|||
.bg_jb1{ |
|||
background-image: linear-gradient(-30deg, #954DE3 50% , #F25B5B 50% ); |
|||
} |
|||
.bg_jb2{ |
|||
background-image: linear-gradient(-30deg,#954DE3 50% , #00B977 50% ); |
|||
} |
|||
|
|||
.donna{ |
|||
background-color: #34026B; |
|||
border-radius: 16rpx; |
|||
height: 160rpx; |
|||
padding: 24rpx 24rpx; |
|||
margin-top: 48rpx; |
|||
justify-content: space-between; |
|||
} |
|||
.info{ |
|||
justify-content: space-between; |
|||
} |
|||
.info .imgcon{ |
|||
width: 76rpx; |
|||
height: 76rpx; |
|||
} |
|||
.info .imgcon image{ |
|||
width: 100%; |
|||
height: 100%; |
|||
} |
|||
.doname{ |
|||
margin-left: 24rpx; |
|||
} |
|||
.doname .name{ |
|||
color: #fff; |
|||
font-size: 32rpx; |
|||
} |
|||
.doname .win{ |
|||
width: 124rpx; |
|||
padding: 4rpx 8rpx; |
|||
line-height: 32rpx; |
|||
color: #fff; |
|||
font-size: 20rpx; |
|||
background-color: #491C7A; |
|||
border-radius: 8rpx; |
|||
margin-top: 6rpx; |
|||
} |
|||
.recharge{ |
|||
position: relative; |
|||
padding-left: 50rpx; |
|||
} |
|||
.recharge image{ |
|||
width: 40rpx; |
|||
height: 40rpx; |
|||
position: absolute; |
|||
left: 0; |
|||
bottom: 0; |
|||
} |
|||
.recharge i{ |
|||
font-style: normal; |
|||
margin-right: 8rpx; |
|||
} |
|||
.recharge span{ |
|||
color: #fff; |
|||
font-size: 32rpx; |
|||
} |
|||
.follow{ |
|||
width: 142rpx; |
|||
line-height: 60rpx; |
|||
background-color: #954DE3; |
|||
color: #fff; |
|||
font-size: 24rpx; |
|||
border-radius: 16rpx; |
|||
position: relative; |
|||
text-align: center; |
|||
padding-right: 10rpx; |
|||
} |
|||
.follow::after{ |
|||
content: ''; |
|||
width: 24rpx; |
|||
height: 24rpx; |
|||
background: url(../../static/color/top_icon_ins@3x.png)no-repeat; |
|||
background-size: contain; |
|||
position: absolute; |
|||
right: 12rpx; |
|||
top: 50%; |
|||
transform: translateY(-50%); |
|||
} |
|||
</style> |
|||
@ -0,0 +1,460 @@ |
|||
<template> |
|||
<view class="gamecont"> |
|||
<view class="contone"> |
|||
<view class="contone_item contone_item1"> |
|||
Betting assistant (last 100 periods) |
|||
</view> |
|||
<view class="contone_item contone_item2"> |
|||
<view class="miss"> |
|||
missing |
|||
</view> |
|||
<view class="num_con"> |
|||
<view class="num" @click="sendCond"> |
|||
6 |
|||
</view> |
|||
<view class="num"> |
|||
3 |
|||
</view> |
|||
<view class="num"> |
|||
26 |
|||
</view> |
|||
<view class="num"> |
|||
7 |
|||
</view> |
|||
<view class="num"> |
|||
19 |
|||
</view> |
|||
<view class="num"> |
|||
9 |
|||
</view> |
|||
<view class="num"> |
|||
8 |
|||
</view> |
|||
<view class="num"> |
|||
12 |
|||
</view> |
|||
<view class="num"> |
|||
1 |
|||
</view> |
|||
<view class="num"> |
|||
0 |
|||
</view> |
|||
</view> |
|||
</view> |
|||
<view class="contone_item contone_item2"> |
|||
<view class="miss"> |
|||
frequency |
|||
</view> |
|||
<view class="num_con"> |
|||
<view class="num"> |
|||
6 |
|||
</view> |
|||
<view class="num"> |
|||
3 |
|||
</view> |
|||
<view class="num"> |
|||
26 |
|||
</view> |
|||
<view class="num"> |
|||
7 |
|||
</view> |
|||
<view class="num"> |
|||
19 |
|||
</view> |
|||
<view class="num"> |
|||
9 |
|||
</view> |
|||
<view class="num"> |
|||
8 |
|||
</view> |
|||
<view class="num"> |
|||
12 |
|||
</view> |
|||
<view class="num"> |
|||
1 |
|||
</view> |
|||
<view class="num"> |
|||
0 |
|||
</view> |
|||
</view> |
|||
</view> |
|||
</view> |
|||
|
|||
<view class="conttwo"> |
|||
<view class="contone_item contone_item2"> |
|||
<view class="miss"> |
|||
20210602234 |
|||
</view> |
|||
<view class="num_con"> |
|||
<view class="num2"> |
|||
6 |
|||
</view> |
|||
<view class="num2"> |
|||
3 |
|||
</view> |
|||
<view class="num2"> |
|||
26 |
|||
</view> |
|||
<view class="num2"> |
|||
7 |
|||
</view> |
|||
<view class="num2"> |
|||
19 |
|||
</view> |
|||
<view class="num2"> |
|||
9 |
|||
</view> |
|||
<view class="num2"> |
|||
8 |
|||
</view> |
|||
<view class="num2"> |
|||
12 |
|||
</view> |
|||
<view class="num2"> |
|||
1 |
|||
</view> |
|||
<view class="num2"> |
|||
0 |
|||
</view> |
|||
</view> |
|||
</view> |
|||
<view class="contone_item contone_item2"> |
|||
<view class="miss"> |
|||
20210602233 |
|||
</view> |
|||
<view class="num_con"> |
|||
<view class="num2"> |
|||
6 |
|||
</view> |
|||
<view class="num2"> |
|||
3 |
|||
</view> |
|||
<view class="num2"> |
|||
26 |
|||
</view> |
|||
<view class="num2"> |
|||
7 |
|||
</view> |
|||
<view class="num2"> |
|||
19 |
|||
</view> |
|||
<view class="num2"> |
|||
9 |
|||
</view> |
|||
<view class="num2"> |
|||
8 |
|||
</view> |
|||
<view class="num2"> |
|||
12 |
|||
</view> |
|||
<view class="num2"> |
|||
1 |
|||
</view> |
|||
<view class="num2"> |
|||
0 |
|||
</view> |
|||
</view> |
|||
</view> |
|||
|
|||
<view class="contone_item contone_item2"> |
|||
<view class="miss"> |
|||
20210602232 |
|||
</view> |
|||
<view class="num_con"> |
|||
<view class="num2"> |
|||
6 |
|||
</view> |
|||
<view class="num2"> |
|||
3 |
|||
</view> |
|||
<view class="num2"> |
|||
26 |
|||
</view> |
|||
<view class="num2"> |
|||
7 |
|||
</view> |
|||
<view class="num2"> |
|||
19 |
|||
</view> |
|||
<view class="num2"> |
|||
9 |
|||
</view> |
|||
<view class="num2"> |
|||
8 |
|||
</view> |
|||
<view class="num2"> |
|||
12 |
|||
</view> |
|||
<view class="num2"> |
|||
1 |
|||
</view> |
|||
<view class="num2"> |
|||
0 |
|||
</view> |
|||
</view> |
|||
</view> |
|||
|
|||
<view class="contone_item contone_item2"> |
|||
<view class="miss"> |
|||
20210602231 |
|||
</view> |
|||
<view class="num_con"> |
|||
<view class="num2"> |
|||
6 |
|||
</view> |
|||
<view class="num2"> |
|||
3 |
|||
</view> |
|||
<view class="num2"> |
|||
26 |
|||
</view> |
|||
<view class="num2"> |
|||
7 |
|||
</view> |
|||
<view class="num2"> |
|||
19 |
|||
</view> |
|||
<view class="num2"> |
|||
9 |
|||
</view> |
|||
<view class="num2"> |
|||
8 |
|||
</view> |
|||
<view class="num2"> |
|||
12 |
|||
</view> |
|||
<view class="num2"> |
|||
1 |
|||
</view> |
|||
<view class="num2"> |
|||
0 |
|||
</view> |
|||
</view> |
|||
</view> |
|||
<view class="contone_item contone_item2"> |
|||
<view class="miss"> |
|||
20210602230 |
|||
</view> |
|||
<view class="num_con"> |
|||
<view class="num2"> |
|||
6 |
|||
</view> |
|||
<view class="num2"> |
|||
3 |
|||
</view> |
|||
<view class="num2"> |
|||
26 |
|||
</view> |
|||
<view class="num2"> |
|||
7 |
|||
</view> |
|||
<view class="num2"> |
|||
19 |
|||
</view> |
|||
<view class="num2"> |
|||
9 |
|||
</view> |
|||
<view class="num2"> |
|||
8 |
|||
</view> |
|||
<view class="num2"> |
|||
12 |
|||
</view> |
|||
<view class="num2"> |
|||
1 |
|||
</view> |
|||
<view class="num2"> |
|||
0 |
|||
</view> |
|||
</view> |
|||
</view> |
|||
<view class="contone_item contone_item2"> |
|||
<view class="miss"> |
|||
20210602229 |
|||
</view> |
|||
<view class="num_con"> |
|||
<view class="num2"> |
|||
6 |
|||
</view> |
|||
<view class="num2"> |
|||
3 |
|||
</view> |
|||
<view class="num2"> |
|||
26 |
|||
</view> |
|||
<view class="num2"> |
|||
7 |
|||
</view> |
|||
<view class="num2"> |
|||
19 |
|||
</view> |
|||
<view class="num2"> |
|||
9 |
|||
</view> |
|||
<view class="num2"> |
|||
8 |
|||
</view> |
|||
<view class="num2"> |
|||
12 |
|||
</view> |
|||
<view class="num2"> |
|||
1 |
|||
</view> |
|||
<view class="num2"> |
|||
0 |
|||
</view> |
|||
</view> |
|||
</view> |
|||
<view class="contone_item contone_item2"> |
|||
<view class="miss"> |
|||
20210602228 |
|||
</view> |
|||
<view class="num_con"> |
|||
<view class="num2"> |
|||
6 |
|||
</view> |
|||
<view class="num2"> |
|||
3 |
|||
</view> |
|||
<view class="num2"> |
|||
26 |
|||
</view> |
|||
<view class="num2"> |
|||
7 |
|||
</view> |
|||
<view class="num2"> |
|||
19 |
|||
</view> |
|||
<view class="num2"> |
|||
9 |
|||
</view> |
|||
<view class="num2"> |
|||
8 |
|||
</view> |
|||
<view class="num2"> |
|||
12 |
|||
</view> |
|||
<view class="num2"> |
|||
1 |
|||
</view> |
|||
<view class="num2"> |
|||
0 |
|||
</view> |
|||
</view> |
|||
</view> |
|||
</view> |
|||
<cont class="test"></cont> |
|||
<view class="morejia"> |
|||
<p class="">More</p> |
|||
<image src="../../static/color/loading_icon_ins@3x(20).png" mode=""></image> |
|||
</view> |
|||
</view> |
|||
|
|||
|
|||
</template> |
|||
|
|||
<script> |
|||
import cont from "../cont/cont.vue" |
|||
const COMPONENT_NAME = 'gamecont' |
|||
export default { |
|||
name: COMPONENT_NAME, |
|||
|
|||
data() { |
|||
return { |
|||
|
|||
} |
|||
}, |
|||
computed: { |
|||
|
|||
}, |
|||
mounted() { |
|||
|
|||
}, |
|||
methods: { |
|||
sendCond(){ |
|||
this.$emit("send",true); |
|||
} |
|||
}, |
|||
} |
|||
</script> |
|||
|
|||
|
|||
<style> |
|||
.gamecont{ |
|||
position: relative; |
|||
} |
|||
.gamecont .test{ |
|||
position: fixed; |
|||
right: 0; |
|||
top: 75%; |
|||
} |
|||
.num2{ |
|||
width: 40rpx; |
|||
line-height: 40rpx; |
|||
text-align: center; |
|||
font-size: 24rpx; |
|||
color: #303133; |
|||
border: 2rpx solid #EDEFF2; |
|||
border-radius: 50%; |
|||
} |
|||
.num{ |
|||
width: 40rpx; |
|||
line-height: 32rpx; |
|||
text-align: center; |
|||
font-size: 28rpx; |
|||
color: #303133; |
|||
} |
|||
.num_con{ |
|||
width: 514rpx; |
|||
display: flex; |
|||
justify-content: space-between; |
|||
align-items: center; |
|||
} |
|||
.miss{ |
|||
width: 236rpx; |
|||
color: #606266; |
|||
font-size: 28rpx; |
|||
text-transform: capitalize; |
|||
} |
|||
.contone_item2{ |
|||
display: flex; |
|||
justify-content: space-between; |
|||
} |
|||
.gamecont{ |
|||
|
|||
} |
|||
.contone{ |
|||
background-color: #F5F7FA; |
|||
padding: 0 36rpx; |
|||
|
|||
} |
|||
.conttwo{ |
|||
padding: 0 36rpx; |
|||
} |
|||
.contone_item{ |
|||
line-height: 72rpx; |
|||
} |
|||
.contone_item1{ |
|||
font-size: 24rpx; |
|||
color: #909399; |
|||
} |
|||
.morejia{ |
|||
display: table; |
|||
width: auto; |
|||
margin: 0 auto; |
|||
padding-top: 48rpx; |
|||
padding-bottom: 62rpx; |
|||
} |
|||
.morejia p{ |
|||
font-size: 28rpx; |
|||
color: #954DE3; |
|||
text-align: center; |
|||
} |
|||
.morejia image{ |
|||
display: block; |
|||
width: 24rpx; |
|||
height: 24rpx; |
|||
margin: 0 auto; |
|||
} |
|||
|
|||
</style> |
|||
@ -0,0 +1,147 @@ |
|||
<template> |
|||
<view class="gamecont2"> |
|||
<view class="flex cont2_head"> |
|||
<view class="head_item item"> |
|||
period |
|||
</view> |
|||
<view class="head_item item"> |
|||
Price |
|||
</view> |
|||
<view class="head_item item"> |
|||
number |
|||
</view> |
|||
<view class="head_item item"> |
|||
Result |
|||
</view> |
|||
</view> |
|||
<view class="cont2_body"> |
|||
<view class="bodycon flex" v-for="(item,index) in gameRecordCont" :key="period"> |
|||
<view class="body_item item"> |
|||
{{item.period}} |
|||
</view> |
|||
<view class="body_item item"> |
|||
{{item.price}} |
|||
</view> |
|||
<view class="body_item item"> |
|||
{{item.lotteryResult}} |
|||
</view> |
|||
<view class="body_item item"> |
|||
<image :src="'/static/color/bg_er@3x'+item+'.png'" mode="" v-for="(item,index) in gameRecordCont[index].lotteryColor" :key="index"></image> |
|||
</view> |
|||
</view> |
|||
|
|||
|
|||
<!-- <view class="bodycon flex"> |
|||
<view class="body_item item"> |
|||
20210701303 |
|||
</view> |
|||
<view class="body_item item"> |
|||
26957 |
|||
</view> |
|||
<view class="body_item item"> |
|||
3 |
|||
</view> |
|||
<view class="body_item item flex2"> |
|||
<image src="../../static/color/[email protected]" mode=""></image> |
|||
<image src="../../static/color/bg_er@3x(4).png" mode=""></image> |
|||
</view> |
|||
</view> --> |
|||
|
|||
|
|||
|
|||
|
|||
</view> |
|||
<cont class="test"></cont> |
|||
<view class="morejia"> |
|||
<p class="">More</p> |
|||
<image src="../../static/color/loading_icon_ins@3x(20).png" mode=""></image> |
|||
</view> |
|||
</view> |
|||
</template> |
|||
|
|||
<script> |
|||
import cont from "../cont/cont.vue" |
|||
const COMPONENT_NAME = 'gamecont2' |
|||
export default { |
|||
name: COMPONENT_NAME, |
|||
props:["gameRecordCont"], |
|||
data() { |
|||
return { |
|||
|
|||
} |
|||
}, |
|||
computed: { |
|||
|
|||
}, |
|||
mounted() { |
|||
|
|||
}, |
|||
|
|||
methods: { |
|||
|
|||
}, |
|||
} |
|||
</script> |
|||
|
|||
|
|||
<style> |
|||
.flex2{ |
|||
display: flex; |
|||
justify-content: center; |
|||
} |
|||
.test{ |
|||
position: fixed; |
|||
right: 0; |
|||
top: 75%; |
|||
} |
|||
.morejia{ |
|||
display: table; |
|||
width: auto; |
|||
margin: 0 auto; |
|||
padding-top: 48rpx; |
|||
padding-bottom: 62rpx; |
|||
} |
|||
.morejia p{ |
|||
font-size: 28rpx; |
|||
color: #954DE3; |
|||
text-align: center; |
|||
} |
|||
.morejia image{ |
|||
display: block; |
|||
width: 24rpx; |
|||
height: 24rpx; |
|||
margin: 0 auto; |
|||
} |
|||
|
|||
.head_item{ |
|||
font-weight: bold; |
|||
color: #303133; |
|||
} |
|||
.body_item{ |
|||
color: #303133; |
|||
} |
|||
|
|||
.item{ |
|||
text-transform: capitalize; |
|||
font-size: 28rpx; |
|||
text-align: center; |
|||
width: 234rpx; |
|||
line-height: 72rpx; |
|||
} |
|||
.body_item image{ |
|||
width: 32rpx; |
|||
height: 32rpx; |
|||
} |
|||
.body_item image:last-child{ |
|||
padding-left: 8rpx; |
|||
} |
|||
.flex{ |
|||
display: flex; |
|||
justify-content: space-around; |
|||
align-items: center; |
|||
} |
|||
.gamecont2{ |
|||
padding: 0 36rpx; |
|||
|
|||
} |
|||
</style> |
|||
@ -0,0 +1,314 @@ |
|||
<template> |
|||
<view class=""> |
|||
<view class="cont2_body"> |
|||
<view class="body_con_zon" v-for="(item,index) in cont3data" :key="item.id" @click="open(index)" |
|||
:class="index==cont3inde?'on':''"> |
|||
<view class="bodycon flex" > |
|||
<view class="ga_cont3 flex"> |
|||
<view class="body_item"> |
|||
{{item.num}} |
|||
</view> |
|||
<view class="body_item mar_let" :class="item.code=='success'?'green':'red'"> |
|||
{{item.code}} |
|||
</view> |
|||
<view class="body_item mar_let" :class="item.code=='success'?'green':'red'"> |
|||
{{item.profit}} |
|||
</view> |
|||
</view> |
|||
<view class="body_item jiantou"> |
|||
<image src="../../static/color/loading_icon_ins@3x(18).png" mode=""></image> |
|||
</view> |
|||
</view> |
|||
<view class="list"> |
|||
<view class="list_con"> |
|||
<view class="periodd"> |
|||
period detall |
|||
</view> |
|||
<view class="perd_item flex"> |
|||
<view class="name"> |
|||
period |
|||
</view> |
|||
<view class="num"> |
|||
202105270745 |
|||
</view> |
|||
</view> |
|||
<view class="perd_item flex"> |
|||
<view class="name"> |
|||
period |
|||
</view> |
|||
<view class="num"> |
|||
202105270745 |
|||
</view> |
|||
</view> |
|||
<view class="perd_item flex"> |
|||
<view class="name"> |
|||
period |
|||
</view> |
|||
<view class="num"> |
|||
202105270745 |
|||
</view> |
|||
</view> |
|||
<view class="perd_item flex"> |
|||
<view class="name"> |
|||
period |
|||
</view> |
|||
<view class="num"> |
|||
202105270745 |
|||
</view> |
|||
</view> |
|||
<view class="perd_item flex"> |
|||
<view class="name"> |
|||
period |
|||
</view> |
|||
<view class="num"> |
|||
202105270745 |
|||
</view> |
|||
</view> |
|||
<view class="perd_item flex"> |
|||
<view class="name"> |
|||
select |
|||
</view> |
|||
<view class="num"> |
|||
<image src="../../static/color/[email protected]" mode=""></image> |
|||
</view> |
|||
</view> |
|||
<view class="perd_item flex"> |
|||
<view class="name"> |
|||
period |
|||
</view> |
|||
<view class="num"> |
|||
202105270745 |
|||
</view> |
|||
</view> |
|||
<view class="perd_item flex"> |
|||
<view class="name"> |
|||
period |
|||
</view> |
|||
<view class="num"> |
|||
202105270745 |
|||
</view> |
|||
</view> |
|||
<view class="perd_item flex"> |
|||
<view class="name"> |
|||
period |
|||
</view> |
|||
<view class="num"> |
|||
202105270745 |
|||
</view> |
|||
</view> |
|||
</view> |
|||
</view> |
|||
</view> |
|||
|
|||
</view> |
|||
<cont class="test"></cont> |
|||
<view class="morejia"> |
|||
<p class="">More</p> |
|||
<image src="../../static/color/loading_icon_ins@3x(20).png" mode=""></image> |
|||
</view> |
|||
</view> |
|||
</template> |
|||
|
|||
<script> |
|||
import cont from "../cont/cont.vue" |
|||
const COMPONENT_NAME = 'gamecont3' |
|||
export default { |
|||
name: COMPONENT_NAME, |
|||
|
|||
data() { |
|||
return { |
|||
cont3data:[ |
|||
{ |
|||
id:1, |
|||
num:'20210701303', |
|||
code:'Fail', |
|||
profit:'-19.00', |
|||
}, |
|||
{ |
|||
id:2, |
|||
num:'20210701303', |
|||
code:'Fail', |
|||
profit:'-19.00', |
|||
}, |
|||
{ |
|||
id:3, |
|||
num:'20210701303', |
|||
code:'Fail', |
|||
profit:'-19.00', |
|||
}, |
|||
{ |
|||
id:4, |
|||
num:'20210701303', |
|||
code:'success', |
|||
profit:'427.50', |
|||
}, |
|||
{ |
|||
id:5, |
|||
num:'20210701303', |
|||
code:'success', |
|||
profit:'427.50', |
|||
}, |
|||
{ |
|||
id:6, |
|||
num:'20210701303', |
|||
code:'Fail', |
|||
profit:'-19.00', |
|||
}, |
|||
{ |
|||
id:7, |
|||
num:'20210701303', |
|||
code:'Fail', |
|||
profit:'-19.00', |
|||
}, |
|||
{ |
|||
id:8, |
|||
num:'20210701303', |
|||
code:'Fail', |
|||
profit:'-19.00', |
|||
}, |
|||
{ |
|||
id:9, |
|||
num:'20210701303', |
|||
code:'success', |
|||
profit:'427.50', |
|||
}, |
|||
{ |
|||
id:10, |
|||
num:'20210701303', |
|||
code:'success', |
|||
profit:'427.50', |
|||
}, |
|||
], |
|||
cont3inde:-1, |
|||
pd:0, |
|||
} |
|||
}, |
|||
computed: { |
|||
|
|||
}, |
|||
mounted() { |
|||
|
|||
}, |
|||
methods: { |
|||
open(i){ |
|||
this.cont3inde=i; |
|||
this.pd++; |
|||
if(this.pd%2==0){ |
|||
this.cont3inde=-1; |
|||
} |
|||
} |
|||
}, |
|||
} |
|||
</script> |
|||
|
|||
|
|||
<style> |
|||
.num image{ |
|||
width: 32rpx; |
|||
height: 32rpx; |
|||
} |
|||
.perd_item{ |
|||
margin-bottom: 24rpx; |
|||
} |
|||
.perd_item .name{ |
|||
text-transform: capitalize; |
|||
color: #303133; |
|||
font-size: 28rpx; |
|||
} |
|||
.perd_item .num{ |
|||
color: #303133; |
|||
font-size: 28rpx; |
|||
} |
|||
.periodd{ |
|||
font-size: 28rpx; |
|||
text-transform: capitalize; |
|||
color: #954DE3; |
|||
margin-bottom: 24rpx; |
|||
} |
|||
.list_con{ |
|||
padding: 0 60rpx; |
|||
} |
|||
|
|||
.list{ |
|||
max-height: 0rpx; |
|||
overflow: hidden; |
|||
transition: .5s all; |
|||
padding: 0; |
|||
background-color: #F5F7FA; |
|||
} |
|||
.body_con_zon.on .list{ |
|||
padding: 48rpx 0; |
|||
max-height: 700rpx; |
|||
} |
|||
.red{ |
|||
color: #F25B5B !important; |
|||
} |
|||
.green{ |
|||
color: #00B977 !important; |
|||
} |
|||
.bodycon{ |
|||
height: 72rpx; |
|||
padding: 0 36rpx; |
|||
} |
|||
.mar_let{ |
|||
margin-left: 30rpx; |
|||
} |
|||
.flex2{ |
|||
display: flex; |
|||
justify-content: center; |
|||
} |
|||
.test{ |
|||
position: fixed; |
|||
right: 0; |
|||
top: 75%; |
|||
} |
|||
.morejia{ |
|||
display: table; |
|||
width: auto; |
|||
margin: 0 auto; |
|||
padding-top: 48rpx; |
|||
padding-bottom: 62rpx; |
|||
} |
|||
.morejia p{ |
|||
font-size: 28rpx; |
|||
color: #954DE3; |
|||
text-align: center; |
|||
} |
|||
.morejia image{ |
|||
display: block; |
|||
width: 24rpx; |
|||
height: 24rpx; |
|||
margin: 0 auto; |
|||
} |
|||
|
|||
.head_item{ |
|||
font-weight: bold; |
|||
color: #303133; |
|||
} |
|||
.body_item{ |
|||
color: #303133; |
|||
text-transform: capitalize; |
|||
} |
|||
|
|||
|
|||
.body_item image{ |
|||
width: 32rpx; |
|||
height: 32rpx; |
|||
} |
|||
.body_item image:last-child{ |
|||
padding-left: 8rpx; |
|||
} |
|||
.flex{ |
|||
display: flex; |
|||
justify-content: space-between; |
|||
align-items: center; |
|||
} |
|||
.gamecont2{ |
|||
padding: 0 36rpx; |
|||
|
|||
} |
|||
.body_con_zon.on .jiantou image{ |
|||
transform: rotate(-180deg); |
|||
padding: 0 !important; |
|||
} |
|||
</style> |
|||
@ -0,0 +1,41 @@ |
|||
<template> |
|||
<view class="nav-head"> |
|||
<slot></slot> |
|||
<slot name="bread"></slot> |
|||
</view> |
|||
</template> |
|||
|
|||
<script> |
|||
const COMPONENT_NAME = 'navigation' |
|||
export default { |
|||
name: COMPONENT_NAME, |
|||
|
|||
data() { |
|||
return { |
|||
|
|||
} |
|||
}, |
|||
computed: { |
|||
|
|||
}, |
|||
mounted() { |
|||
|
|||
}, |
|||
methods: { |
|||
|
|||
}, |
|||
} |
|||
</script> |
|||
|
|||
<style> |
|||
.nav-head{ |
|||
line-height: 108rpx; |
|||
background-color: #34026BFF; |
|||
text-align: center; |
|||
font-size: 36rpx; |
|||
color: #fff; |
|||
position: relative; |
|||
text-transform: capitalize; |
|||
padding: 0 36rpx; |
|||
} |
|||
</style> |
|||
@ -0,0 +1,20 @@ |
|||
import Vue from 'vue' |
|||
import App from './App' |
|||
import axios from './utils/axios.js' |
|||
import store from './store' |
|||
import uView from "uview-ui"; |
|||
import VueClipboards from 'vue-clipboard2' |
|||
|
|||
Vue.config.productionTip = false |
|||
|
|||
|
|||
Vue.use(uView); |
|||
Vue.use(VueClipboards); |
|||
Vue.prototype.$axios = axios |
|||
Vue.prototype.$store = store |
|||
App.mpType = 'app' |
|||
|
|||
const app = new Vue({ |
|||
...App |
|||
}) |
|||
app.$mount() |
|||
@ -0,0 +1,94 @@ |
|||
{ |
|||
"name" : "first", |
|||
"appid" : "", |
|||
"description" : "", |
|||
"versionName" : "1.0.0", |
|||
"versionCode" : "100", |
|||
"transformPx" : false, |
|||
/* 5+App特有相关 */ |
|||
"app-plus" : { |
|||
"usingComponents" : true, |
|||
"nvueStyleCompiler" : "uni-app", |
|||
"compilerVersion" : 3, |
|||
"splashscreen" : { |
|||
"alwaysShowBeforeRender" : true, |
|||
"waiting" : true, |
|||
"autoclose" : true, |
|||
"delay" : 0 |
|||
}, |
|||
/* 模块配置 */ |
|||
"modules" : {}, |
|||
/* 应用发布信息 */ |
|||
"distribute" : { |
|||
/* android打包配置 */ |
|||
"android" : { |
|||
"permissions" : [ |
|||
"<uses-permission android:name=\"android.permission.CHANGE_NETWORK_STATE\"/>", |
|||
"<uses-permission android:name=\"android.permission.MOUNT_UNMOUNT_FILESYSTEMS\"/>", |
|||
"<uses-permission android:name=\"android.permission.VIBRATE\"/>", |
|||
"<uses-permission android:name=\"android.permission.READ_LOGS\"/>", |
|||
"<uses-permission android:name=\"android.permission.ACCESS_WIFI_STATE\"/>", |
|||
"<uses-feature android:name=\"android.hardware.camera.autofocus\"/>", |
|||
"<uses-permission android:name=\"android.permission.ACCESS_NETWORK_STATE\"/>", |
|||
"<uses-permission android:name=\"android.permission.CAMERA\"/>", |
|||
"<uses-permission android:name=\"android.permission.GET_ACCOUNTS\"/>", |
|||
"<uses-permission android:name=\"android.permission.READ_PHONE_STATE\"/>", |
|||
"<uses-permission android:name=\"android.permission.CHANGE_WIFI_STATE\"/>", |
|||
"<uses-permission android:name=\"android.permission.WAKE_LOCK\"/>", |
|||
"<uses-permission android:name=\"android.permission.FLASHLIGHT\"/>", |
|||
"<uses-feature android:name=\"android.hardware.camera\"/>", |
|||
"<uses-permission android:name=\"android.permission.WRITE_SETTINGS\"/>" |
|||
] |
|||
}, |
|||
/* ios打包配置 */ |
|||
"ios" : {}, |
|||
/* SDK配置 */ |
|||
"sdkConfigs" : {} |
|||
} |
|||
}, |
|||
/* 快应用特有相关 */ |
|||
"quickapp" : {}, |
|||
/* 小程序特有相关 */ |
|||
"mp-weixin" : { |
|||
"appid" : "", |
|||
"setting" : { |
|||
"urlCheck" : false |
|||
}, |
|||
"usingComponents" : true |
|||
}, |
|||
"mp-alipay" : { |
|||
"usingComponents" : true |
|||
}, |
|||
"mp-baidu" : { |
|||
"usingComponents" : true |
|||
}, |
|||
"mp-toutiao" : { |
|||
"usingComponents" : true |
|||
}, |
|||
"uniStatistics": { |
|||
"enable": false |
|||
}, |
|||
"h5" : { |
|||
"publicPath" : "/", |
|||
"devServer" : { |
|||
// "port" : 8083, |
|||
"disableHostCheck" : true, |
|||
"https" : true, |
|||
"proxy" : { |
|||
"/start" : { |
|||
"ws" : false, |
|||
"target" : "https://apitest.luck-work.com", |
|||
// "target":"https://webtest.luck-work.com/", |
|||
// "target" : "https://api.in-earn.co.ke", |
|||
"changeOrigin" : true, |
|||
"secure" : false, |
|||
"pathRewrite" : { |
|||
"^/start" : "" |
|||
} |
|||
} |
|||
} |
|||
}, |
|||
"title" : "In-Earn", |
|||
"domain" : "webtest.luck-work.com" |
|||
} |
|||
} |
|||
@ -0,0 +1,130 @@ |
|||
{ |
|||
"requires": true, |
|||
"lockfileVersion": 1, |
|||
"dependencies": { |
|||
"axios": { |
|||
"version": "0.21.1", |
|||
"resolved": "https://registry.npmjs.org/axios/-/axios-0.21.1.tgz", |
|||
"integrity": "sha512-dKQiRHxGD9PPRIUNIWvZhPTPpl1rf/OxTYKsqKUDjBwYylTvV7SjSHJb9ratfyzM6wCdLCOYLzs73qpg5c4iGA==", |
|||
"requires": { |
|||
"follow-redirects": "^1.10.0" |
|||
} |
|||
}, |
|||
"call-bind": { |
|||
"version": "1.0.2", |
|||
"resolved": "https://registry.npmjs.org/call-bind/-/call-bind-1.0.2.tgz", |
|||
"integrity": "sha512-7O+FbCihrB5WGbFYesctwmTKae6rOiIzmz1icreWJ+0aA7LJfuqhEso2T9ncpcFtzMQtzXf2QGGueWJGTYsqrA==", |
|||
"requires": { |
|||
"function-bind": "^1.1.1", |
|||
"get-intrinsic": "^1.0.2" |
|||
} |
|||
}, |
|||
"clipboard": { |
|||
"version": "2.0.8", |
|||
"resolved": "https://registry.npmjs.org/clipboard/-/clipboard-2.0.8.tgz", |
|||
"integrity": "sha512-Y6WO0unAIQp5bLmk1zdThRhgJt/x3ks6f30s3oE3H1mgIEU33XyQjEf8gsf6DxC7NPX8Y1SsNWjUjL/ywLnnbQ==", |
|||
"requires": { |
|||
"good-listener": "^1.2.2", |
|||
"select": "^1.1.2", |
|||
"tiny-emitter": "^2.0.0" |
|||
} |
|||
}, |
|||
"delegate": { |
|||
"version": "3.2.0", |
|||
"resolved": "https://registry.npmjs.org/delegate/-/delegate-3.2.0.tgz", |
|||
"integrity": "sha512-IofjkYBZaZivn0V8nnsMJGBr4jVLxHDheKSW88PyxS5QC4Vo9ZbZVvhzlSxY87fVq3STR6r+4cGepyHkcWOQSw==" |
|||
}, |
|||
"follow-redirects": { |
|||
"version": "1.14.1", |
|||
"resolved": "https://registry.npmjs.org/follow-redirects/-/follow-redirects-1.14.1.tgz", |
|||
"integrity": "sha512-HWqDgT7ZEkqRzBvc2s64vSZ/hfOceEol3ac/7tKwzuvEyWx3/4UegXh5oBOIotkGsObyk3xznnSRVADBgWSQVg==" |
|||
}, |
|||
"function-bind": { |
|||
"version": "1.1.1", |
|||
"resolved": "https://registry.npmjs.org/function-bind/-/function-bind-1.1.1.tgz", |
|||
"integrity": "sha512-yIovAzMX49sF8Yl58fSCWJ5svSLuaibPxXQJFLmBObTuCr0Mf1KiPopGM9NiFjiYBCbfaa2Fh6breQ6ANVTI0A==" |
|||
}, |
|||
"get-intrinsic": { |
|||
"version": "1.1.1", |
|||
"resolved": "https://registry.npmjs.org/get-intrinsic/-/get-intrinsic-1.1.1.tgz", |
|||
"integrity": "sha512-kWZrnVM42QCiEA2Ig1bG8zjoIMOgxWwYCEeNdwY6Tv/cOSeGpcoX4pXHfKUxNKVoArnrEr2e9srnAxxGIraS9Q==", |
|||
"requires": { |
|||
"function-bind": "^1.1.1", |
|||
"has": "^1.0.3", |
|||
"has-symbols": "^1.0.1" |
|||
} |
|||
}, |
|||
"good-listener": { |
|||
"version": "1.2.2", |
|||
"resolved": "https://registry.npmjs.org/good-listener/-/good-listener-1.2.2.tgz", |
|||
"integrity": "sha1-1TswzfkxPf+33JoNR3CWqm0UXFA=", |
|||
"requires": { |
|||
"delegate": "^3.1.2" |
|||
} |
|||
}, |
|||
"has": { |
|||
"version": "1.0.3", |
|||
"resolved": "https://registry.npmjs.org/has/-/has-1.0.3.tgz", |
|||
"integrity": "sha512-f2dvO0VU6Oej7RkWJGrehjbzMAjFp5/VKPp5tTpWIV4JHHZK1/BxbFRtf/siA2SWTe09caDmVtYYzWEIbBS4zw==", |
|||
"requires": { |
|||
"function-bind": "^1.1.1" |
|||
} |
|||
}, |
|||
"has-symbols": { |
|||
"version": "1.0.2", |
|||
"resolved": "https://registry.npmjs.org/has-symbols/-/has-symbols-1.0.2.tgz", |
|||
"integrity": "sha512-chXa79rL/UC2KlX17jo3vRGz0azaWEx5tGqZg5pO3NUyEJVB17dMruQlzCCOfUvElghKcm5194+BCRvi2Rv/Gw==" |
|||
}, |
|||
"i": { |
|||
"version": "0.3.6", |
|||
"resolved": "https://registry.npmjs.org/i/-/i-0.3.6.tgz", |
|||
"integrity": "sha1-2WyScyB28HJxG2sQ/X1PZa2O4j0=" |
|||
}, |
|||
"js-md5": { |
|||
"version": "0.7.3", |
|||
"resolved": "https://registry.npmjs.org/js-md5/-/js-md5-0.7.3.tgz", |
|||
"integrity": "sha512-ZC41vPSTLKGwIRjqDh8DfXoCrdQIyBgspJVPXHBGu4nZlAEvG3nf+jO9avM9RmLiGakg7vz974ms99nEV0tmTQ==" |
|||
}, |
|||
"object-inspect": { |
|||
"version": "1.10.3", |
|||
"resolved": "https://registry.npmjs.org/object-inspect/-/object-inspect-1.10.3.tgz", |
|||
"integrity": "sha512-e5mCJlSH7poANfC8z8S9s9S2IN5/4Zb3aZ33f5s8YqoazCFzNLloLU8r5VCG+G7WoqLvAAZoVMcy3tp/3X0Plw==" |
|||
}, |
|||
"qs": { |
|||
"version": "6.10.1", |
|||
"resolved": "https://registry.npmjs.org/qs/-/qs-6.10.1.tgz", |
|||
"integrity": "sha512-M528Hph6wsSVOBiYUnGf+K/7w0hNshs/duGsNXPUCLH5XAqjEtiPGwNONLV0tBH8NoGb0mvD5JubnUTrujKDTg==", |
|||
"requires": { |
|||
"side-channel": "^1.0.4" |
|||
} |
|||
}, |
|||
"select": { |
|||
"version": "1.1.2", |
|||
"resolved": "https://registry.npmjs.org/select/-/select-1.1.2.tgz", |
|||
"integrity": "sha1-DnNQrN7ICxEIUoeG7B1EGNEbOW0=" |
|||
}, |
|||
"side-channel": { |
|||
"version": "1.0.4", |
|||
"resolved": "https://registry.npmjs.org/side-channel/-/side-channel-1.0.4.tgz", |
|||
"integrity": "sha512-q5XPytqFEIKHkGdiMIrY10mvLRvnQh42/+GoBlFW3b2LXLE2xxJpZFdm94we0BaoV3RwJyGqg5wS7epxTv0Zvw==", |
|||
"requires": { |
|||
"call-bind": "^1.0.0", |
|||
"get-intrinsic": "^1.0.2", |
|||
"object-inspect": "^1.9.0" |
|||
} |
|||
}, |
|||
"tiny-emitter": { |
|||
"version": "2.1.0", |
|||
"resolved": "https://registry.npmjs.org/tiny-emitter/-/tiny-emitter-2.1.0.tgz", |
|||
"integrity": "sha512-NB6Dk1A9xgQPMoGqC5CVXn123gWyte215ONT5Pp5a0yt4nlEoO1ZWeCwpncaekPHXO60i47ihFnZPiRPjRMq4Q==" |
|||
}, |
|||
"vue-clipboard2": { |
|||
"version": "0.3.1", |
|||
"resolved": "https://registry.npmjs.org/vue-clipboard2/-/vue-clipboard2-0.3.1.tgz", |
|||
"integrity": "sha512-H5S/agEDj0kXjUb5GP2c0hCzIXWRBygaWLN3NEFsaI9I3uWin778SFEMt8QRXiPG+7anyjqWiw2lqcxWUSfkYg==", |
|||
"requires": { |
|||
"clipboard": "^2.0.0" |
|||
} |
|||
} |
|||
} |
|||
} |
|||
@ -0,0 +1,170 @@ |
|||
{ |
|||
"easycom": { |
|||
"^u-(.*)": "@/uview-ui/components/u-$1/u-$1.vue" |
|||
}, |
|||
"pages": [ //pages数组中第一项表示应用启动页，参考：https://uniapp.dcloud.io/collocation/pages |
|||
{ |
|||
"path": "pages/recharge/rechargeRule", |
|||
"style": { |
|||
} |
|||
}, |
|||
{ |
|||
"path": "pages/login/index", |
|||
"style": { |
|||
} |
|||
}, |
|||
{ |
|||
"path": "pages/color/color1/index", |
|||
"style": { |
|||
|
|||
} |
|||
}, |
|||
{ |
|||
"path": "pages/withdrawl/transactions/index", |
|||
"style": { |
|||
} |
|||
}, |
|||
{ |
|||
"path": "pages/withdrawl/withdrawlRecord/index", |
|||
"style": { |
|||
} |
|||
}, |
|||
|
|||
{ |
|||
"path": "pages/recharge/index", |
|||
"style": { |
|||
} |
|||
}, |
|||
|
|||
|
|||
{ |
|||
"path": "pages/recharge/record/index", |
|||
"style": { |
|||
} |
|||
}, |
|||
|
|||
|
|||
|
|||
{ |
|||
"path": "pages/rule/arules/index", |
|||
"style": { |
|||
} |
|||
}, |
|||
{ |
|||
"path": "pages/aplan/index", |
|||
"style": { |
|||
} |
|||
}, |
|||
{ |
|||
"path": "pages/withdrawl/transactions/index", |
|||
"style": { |
|||
} |
|||
}, |
|||
|
|||
{ |
|||
"path": "pages/withdrawl/index", |
|||
"style": { |
|||
} |
|||
}, |
|||
{ |
|||
"path": "pages/promotion/promotionRecord/index", |
|||
"style": { |
|||
} |
|||
}, |
|||
|
|||
{ |
|||
"path": "pages/recharge/index", |
|||
"style": { |
|||
} |
|||
}, |
|||
|
|||
{ |
|||
"path": "pages/My/index", |
|||
"style": { |
|||
|
|||
} |
|||
}, |
|||
|
|||
|
|||
|
|||
|
|||
|
|||
{ |
|||
"path": "pages/register/index", |
|||
"style": { |
|||
} |
|||
}, |
|||
|
|||
|
|||
{ |
|||
"path": "pages/promotion/index", |
|||
"style": { |
|||
|
|||
} |
|||
}, |
|||
|
|||
|
|||
|
|||
|
|||
{ |
|||
"path": "pages/index/index", |
|||
"style": { |
|||
|
|||
} |
|||
}, |
|||
|
|||
|
|||
|
|||
{ |
|||
"path": "pages/login/resetPassword/index", |
|||
"style": { |
|||
} |
|||
}, |
|||
|
|||
{ |
|||
"path": "pages/rule/index", |
|||
"style": { |
|||
|
|||
} |
|||
}, |
|||
|
|||
{ |
|||
"path": "pages/rule/inviteRule/index", |
|||
"style": { |
|||
|
|||
} |
|||
} |
|||
|
|||
|
|||
|
|||
|
|||
], |
|||
"globalStyle": { |
|||
"navigationBarTextStyle": "white", |
|||
"navigationBarBackgroundColor": "#34026B" |
|||
}, |
|||
"tabBar":{ |
|||
"selectedColor":"#34026B", |
|||
"list":[ |
|||
{ |
|||
"text":"Game", |
|||
"pagePath":"pages/index/index", |
|||
"iconPath":"./static/tabbar/[email protected]", |
|||
"selectedIconPath":"./static/tabbar/[email protected]" |
|||
}, |
|||
{ |
|||
"text":"Promotion", |
|||
"pagePath":"pages/promotion/index", |
|||
"iconPath":"./static/tabbar/[email protected]", |
|||
"selectedIconPath":"./static/tabbar/[email protected]" |
|||
}, |
|||
{ |
|||
"text":"My", |
|||
"pagePath":"pages/My/index", |
|||
"iconPath":"./static/tabbar/[email protected]", |
|||
"selectedIconPath":"./static/tabbar/[email protected]" |
|||
} |
|||
] |
|||
} |
|||
|
|||
} |
|||
@ -0,0 +1,124 @@ |
|||
|
|||
.content{ |
|||
padding-bottom: 254rpx; |
|||
background-color: #F5F7FAFF !important; |
|||
} |
|||
.flex{ |
|||
display: flex; |
|||
flex-flow: row wrap; |
|||
} |
|||
.my-head{ |
|||
background-color: #34026B; |
|||
padding: 26rpx 26rpx; |
|||
} |
|||
.my-info{ |
|||
|
|||
} |
|||
.my-a{ |
|||
display: flex; |
|||
} |
|||
.my-img{ |
|||
width: 76rpx; |
|||
height: 76rpx; |
|||
} |
|||
.my-img image{ |
|||
width: 100%; |
|||
height: 100%; |
|||
} |
|||
.my-nameid{ |
|||
margin-left: 24rpx; |
|||
} |
|||
.my-name{ |
|||
color: #fff; |
|||
font-size: 36rpx; |
|||
} |
|||
.my-id{ |
|||
color: rgba(255,255,255,.5); |
|||
font-size: 28rpx; |
|||
} |
|||
.my-b{ |
|||
margin-top: 26rpx; |
|||
} |
|||
.my-tel{ |
|||
color: #fff; |
|||
font-size: 27rpx; |
|||
text-transform: capitalize; |
|||
} |
|||
|
|||
.my-bal{ |
|||
color: #fff; |
|||
font-size: 27rpx; |
|||
text-transform: capitalize; |
|||
align-items: center; |
|||
margin-top: 24rpx; |
|||
} |
|||
.my-ap{ |
|||
width: 118rpx; |
|||
line-height: 44rpx; |
|||
background-color: #491C7AFF; |
|||
border-radius: 16rpx; |
|||
text-align: center; |
|||
margin-left: 26rpx; |
|||
} |
|||
.my-c{ |
|||
margin-top: 26rpx; |
|||
} |
|||
.my-btn1{ |
|||
width: 188rpx; |
|||
line-height: 72rpx; |
|||
background-color: #954DE3; |
|||
border-radius: 16rpx; |
|||
text-align: center; |
|||
font-size: 28rpx; |
|||
color: #fff; |
|||
text-transform: capitalize; |
|||
} |
|||
.my-btn2{ |
|||
font-size: 28rpx; |
|||
width: 312rpx; |
|||
line-height: 72rpx; |
|||
background-color: #954DE3; |
|||
border-radius: 16rpx; |
|||
text-align: center; |
|||
margin-left: 26rpx; |
|||
text-transform: capitalize; |
|||
color: #fff; |
|||
} |
|||
.my-body{ |
|||
padding: 0 36rpx; |
|||
background-color: #FFFFFF; |
|||
} |
|||
.my-body-item{ |
|||
width: 100%; |
|||
line-height: 108rpx; |
|||
border-bottom: 2rpx solid #F5F7FA; |
|||
color: #303133FF; |
|||
font-size: 30rpx; |
|||
text-transform: capitalize; |
|||
position: relative; |
|||
} |
|||
.my-body-item:last-child{ |
|||
border-bottom: none; |
|||
} |
|||
.my-body-item::before{ |
|||
content: ''; |
|||
width: 28rpx; |
|||
height: 28rpx; |
|||
background: url(../../static/home/top_icon_ins.png)no-repeat; |
|||
position: absolute; |
|||
right: 0; |
|||
top: 50%; |
|||
transform: translateY(-50%); |
|||
} |
|||
.my-body-out{ |
|||
text-align: center; |
|||
color: #303133FF; |
|||
font-size: 32rpx; |
|||
background-color: #fff; |
|||
text-transform: capitalize; |
|||
line-height: 108rpx; |
|||
margin-top: 48rpx; |
|||
} |
|||
.my-bg{ |
|||
background-color: #F5F7FA; |
|||
} |
|||
@ -0,0 +1,147 @@ |
|||
<template> |
|||
<view class="content"> |
|||
<view class="my-head"> |
|||
<view class="my-info"> |
|||
<view class="my-a"> |
|||
<view class="my-img"> |
|||
<!-- <img :src=`http://openweathermap.org/img/w/${item.weather[0].icon}.png`> --> |
|||
|
|||
<image :src="'https://apitest.luck-work.com/'+MyInfo.headImgPath" mode=""></image> |
|||
</view> |
|||
<view class="my-nameid"> |
|||
<view class="my-name"> |
|||
{{MyInfo.nickname}} |
|||
</view> |
|||
<view class="my-id"> |
|||
ID: {{MyInfo.userId}} |
|||
</view> |
|||
</view> |
|||
</view> |
|||
<view class="my-b"> |
|||
<view class="my-tel"> |
|||
Mobile: {{MyInfo.mobile}} |
|||
</view> |
|||
<view class="my-bal flex"> |
|||
<view>Available Balance: 385813.55</view> |
|||
<view class="my-ap"> |
|||
A+ Plan |
|||
</view> |
|||
</view> |
|||
</view> |
|||
<view class="my-c flex"> |
|||
<view class="my-btn1"> |
|||
recharge |
|||
</view> |
|||
<view class="my-btn2"> |
|||
change nick name |
|||
</view> |
|||
</view> |
|||
</view> |
|||
|
|||
</view> |
|||
|
|||
<view class="my-bg"> |
|||
<view class="my-body"> |
|||
<view class="my-body-item" v-for="(item,index) in myAList" :key="item.id"> |
|||
{{item.text}} |
|||
</view> |
|||
|
|||
</view> |
|||
<view class="my-body-out" @click="logout"> |
|||
logout |
|||
</view> |
|||
<cont></cont> |
|||
|
|||
</view> |
|||
</view> |
|||
</template> |
|||
|
|||
<script> |
|||
import api from '@/utils/api' |
|||
import utils from '@/utils' |
|||
import cont from "@/components/cont/cont.vue" |
|||
export default{ |
|||
data(){ |
|||
return{ |
|||
MyInfo:{}, |
|||
|
|||
myAList:[ |
|||
{ |
|||
id:'1', |
|||
text:'wallet' |
|||
}, |
|||
{ |
|||
id:'2', |
|||
text:'Bank card' |
|||
}, |
|||
{ |
|||
id:'3', |
|||
text:'Address' |
|||
}, |
|||
{ |
|||
id:'4', |
|||
text:'Reset password' |
|||
}, |
|||
{ |
|||
id:'5', |
|||
text:'Android download' |
|||
}, |
|||
], |
|||
} |
|||
}, |
|||
|
|||
onLoad() { |
|||
|
|||
uni.request({ |
|||
url: '/start/api/user/userInfo', |
|||
data: { |
|||
"ticket": uni.getStorageSync('logInfo').data, |
|||
}, |
|||
header: { |
|||
'Content-Type': 'application/x-www-form-urlencoded;charset=utf-8' //自定义请求头信息 |
|||
}, |
|||
method: 'POST', //请求方式 或GET，必须为大写 |
|||
success: (res) => { |
|||
this.MyInfo=res.data.data; |
|||
console.log(this.MyInfo,9990); |
|||
uni.setStorage({ |
|||
key: 'MyInfo', |
|||
data: res.data.data, |
|||
success: function() { |
|||
console.log('success') |
|||
} |
|||
}); |
|||
}, |
|||
fail: (res) => { |
|||
console.log(res.data); |
|||
} |
|||
}); |
|||
|
|||
}, |
|||
methods:{ |
|||
logout(){ |
|||
uni.request({ |
|||
url: '/start/api/user/loginOut', |
|||
data: { |
|||
"ticket": uni.getStorageSync('logInfo').data, |
|||
}, |
|||
header: { |
|||
'Content-Type': 'application/x-www-form-urlencoded;charset=utf-8' //自定义请求头信息 |
|||
}, |
|||
method: 'POST', //请求方式 或GET，必须为大写 |
|||
success: (res) => { |
|||
console.log(res.data,9990); |
|||
}, |
|||
fail: (res) => { |
|||
console.log(res.data); |
|||
} |
|||
}); |
|||
} |
|||
|
|||
}, |
|||
} |
|||
</script> |
|||
|
|||
<style> |
|||
@import './index.css'; |
|||
</style> |
|||
@ -0,0 +1,111 @@ |
|||
|
|||
|
|||
|
|||
.pro-head{ |
|||
padding: 0 68rpx; |
|||
background-color: #34026BFF; |
|||
padding-bottom: 36rpx; |
|||
} |
|||
.pro-body-p1{ |
|||
font-size: 44rpx; |
|||
color: #fff; |
|||
text-align: center; |
|||
padding-top: 70rpx; |
|||
text-transform: capitalize; |
|||
display: flex; |
|||
align-items: center; |
|||
justify-content: center; |
|||
} |
|||
.pro-body-p1 .s1{ |
|||
padding-left: 8rpx; |
|||
vertical-align: bottom; |
|||
} |
|||
.category-sigh{ |
|||
font-size: 36rpx; |
|||
color: #fff; |
|||
} |
|||
|
|||
.bread{ |
|||
color: #fff; |
|||
font-size: 32rpx; |
|||
position: absolute; |
|||
right: 36rpx; |
|||
} |
|||
.ab{ |
|||
color: #FFFFFFFF; |
|||
font-size: 28rpx; |
|||
text-align: center; |
|||
margin-top: 36rpx; |
|||
} |
|||
.flex{ |
|||
display: flex; |
|||
justify-content: space-between; |
|||
align-items: center; |
|||
} |
|||
.money_con{ |
|||
margin-top: 50rpx; |
|||
} |
|||
|
|||
.mony_item{ |
|||
|
|||
} |
|||
.mon{ |
|||
color: #fff; |
|||
font-size: 36rpx; |
|||
text-align: center; |
|||
} |
|||
.time{ |
|||
color: rgba(255,255,255,.5); |
|||
font-size: 28rpx; |
|||
text-align: center; |
|||
} |
|||
.mon_btn{ |
|||
width: 240rpx; |
|||
line-height: 72rpx; |
|||
text-align: center; |
|||
border-radius: 16rpx; |
|||
border: 2rpx #954DE3FF solid; |
|||
color: #fff; |
|||
margin-top: 24rpx; |
|||
font-size: 28rpx; |
|||
} |
|||
.mon_btn:hover{ |
|||
background-color: #954DE3FF; |
|||
} |
|||
.ap_body{ |
|||
padding: 0 36rpx; |
|||
} |
|||
.fde{ |
|||
padding: 24rpx 0; |
|||
color: #909399FF; |
|||
font-size: 32rpx; |
|||
} |
|||
.record_item{ |
|||
height: 144rpx; |
|||
} |
|||
.numcon .img1{ |
|||
width: 40rpx; |
|||
height: 40rpx; |
|||
} |
|||
.num{ |
|||
margin-left: 20rpx; |
|||
} |
|||
.rec{ |
|||
color: #303133; |
|||
font-size: 32rpx; |
|||
} |
|||
.cpay{ |
|||
color: #909399; |
|||
font-size: 28rpx; |
|||
} |
|||
.time{ |
|||
|
|||
} |
|||
.time_mon{ |
|||
color: #00B977FF; |
|||
font-size: 32rpx; |
|||
} |
|||
.mon2{ |
|||
color: #909399FF; |
|||
font-size: 28rpx; |
|||
} |
|||
@ -0,0 +1,113 @@ |
|||
<template> |
|||
<view class="content"> |
|||
<navigation> |
|||
A+ plan |
|||
<span class="bread" slot="bread"> |
|||
Rules |
|||
</span > |
|||
</navigation> |
|||
<view class="pro-head"> |
|||
<view class=""> |
|||
<view class="pro-body-p1"> |
|||
<span class="category-sigh">₦</span><span class="s1">81166.17</span> |
|||
</view> |
|||
<view class="ab"> |
|||
Available Balance |
|||
</view> |
|||
</view> |
|||
|
|||
<view class="money_con flex"> |
|||
<view class="mony_item"> |
|||
<view class="mon"> |
|||
+242.77 |
|||
</view> |
|||
<view class="time"> |
|||
Yesterday |
|||
</view> |
|||
<view class="mon_btn"> |
|||
Transfer Out |
|||
</view> |
|||
</view> |
|||
<view class="mony_item"> |
|||
<view class="mon"> |
|||
+19,266.17 |
|||
</view> |
|||
<view class="time"> |
|||
Total |
|||
</view> |
|||
<view class="mon_btn"> |
|||
Transfer In |
|||
</view> |
|||
</view> |
|||
</view> |
|||
|
|||
|
|||
</view> |
|||
<view class="ap_body"> |
|||
<view class="fde"> |
|||
Funding details |
|||
</view> |
|||
<view class="record_item flex"> |
|||
<view class="numcon flex"> |
|||
<image src="../../static/promo/[email protected]" mode="aspectFit" class="img1"></image> |
|||
<view class="num"> |
|||
<view class="rec"> |
|||
Income |
|||
</view> |
|||
<view class="cpay"> |
|||
2021-05-20 18:34:00 |
|||
</view> |
|||
</view> |
|||
</view> |
|||
<view class="time"> |
|||
<view class="time_mon"> |
|||
+242.77 |
|||
</view> |
|||
<view class="mon2"> |
|||
81166.17 |
|||
</view> |
|||
</view> |
|||
</view> |
|||
</view> |
|||
</view> |
|||
|
|||
</template> |
|||
|
|||
<script> |
|||
import api from '@/utils/api' |
|||
import utils from '@/utils' |
|||
import cont from "@/components/navigation/navigation.vue" |
|||
export default { |
|||
data() { |
|||
return { |
|||
leaId:0, |
|||
proLeav:[ |
|||
{ |
|||
id:0, |
|||
lea:'level1', |
|||
lea2:'Total people', |
|||
leanum:0 |
|||
}, |
|||
{ |
|||
id:1, |
|||
lea:'level2', |
|||
lea2:'Contribution', |
|||
leanum:0.00 |
|||
}, |
|||
] |
|||
} |
|||
}, |
|||
onLoad() { |
|||
|
|||
}, |
|||
methods: { |
|||
leaIdChange(index){ |
|||
this.leaId=index; |
|||
} |
|||
} |
|||
} |
|||
</script> |
|||
|
|||
<style> |
|||
@import url("./index.css"); |
|||
</style> |
|||
@ -0,0 +1,562 @@ |
|||
|
|||
.content{ |
|||
position: relative; |
|||
} |
|||
.rules-btn{ |
|||
font-size: 24rpx; |
|||
color: #FFFFFF; |
|||
text-transform: capitalize; |
|||
position: relative; |
|||
padding-right: 70rpx; |
|||
} |
|||
.rules-btn::before{ |
|||
content: ''; |
|||
width: 24rpx; |
|||
height: 24rpx; |
|||
background: url(../../../static/home/top_icon_ins.png)no-repeat; |
|||
position: absolute; |
|||
right: 36rpx; |
|||
top: 50%; |
|||
transform: translateY(-50%); |
|||
} |
|||
.bg_white{ |
|||
position: relative; |
|||
top: -36rpx; |
|||
background-color: #fff; |
|||
border-radius: 48rpx 48rpx 0 0; |
|||
} |
|||
.gameNav{ |
|||
padding: 0 36rpx; |
|||
display: flex; |
|||
height: 96rpx; |
|||
justify-content: space-around; |
|||
font-size: 28rpx; |
|||
color: #909399; |
|||
line-height: 96rpx; |
|||
align-items: center; |
|||
} |
|||
.flex{ |
|||
display: flex; |
|||
align-items: center; |
|||
} |
|||
.gameNav-item{ |
|||
position: relative; |
|||
text-align: center; |
|||
height: 100%; |
|||
} |
|||
.gameNav-item::after{ |
|||
content: ''; |
|||
width: 0rpx; |
|||
height: 4rpx; |
|||
background: #954DE3; |
|||
position: absolute; |
|||
left: 50%; |
|||
bottom: 0px; |
|||
-webkit-transform: translateX(-50%); |
|||
transform: translateX(-50%); |
|||
} |
|||
.active{ |
|||
color: #954DE3; |
|||
} |
|||
.active::after{ |
|||
width: 80rpx; |
|||
} |
|||
|
|||
|
|||
.donna2{ |
|||
background-color: #3F0380; |
|||
margin-bottom: 16rpx; |
|||
} |
|||
.don_con{ |
|||
|
|||
border-radius: 16rpx; |
|||
height: 160rpx; |
|||
padding: 24rpx 24rpx; |
|||
justify-content: space-between; |
|||
|
|||
} |
|||
.follow_xiazhu_con{ |
|||
background-color: #34026B; |
|||
border-radius: 48rpx 48rpx 0 0; |
|||
padding: 0 36rpx; |
|||
position: relative; |
|||
} |
|||
.tc{ |
|||
width: 600rpx; |
|||
background-color: #fff; |
|||
border-radius: 24rpx; |
|||
padding: 0 36rpx; |
|||
padding-top: 48rpx; |
|||
position: fixed; |
|||
top: 50%; |
|||
left: 50%; |
|||
transform: translate(-50%,-50%); |
|||
} |
|||
.tc_body{ |
|||
padding: 48rpx 0; |
|||
} |
|||
.body_item_info{ |
|||
font-size: 28rpx; |
|||
color: #606266; |
|||
text-transform: capitalize; |
|||
margin-bottom: 20rpx; |
|||
} |
|||
.body_item_info image{ |
|||
width: 40rpx; |
|||
height: 40rpx; |
|||
} |
|||
.flex{ |
|||
display: flex; |
|||
justify-content: space-between; |
|||
align-items: center; |
|||
} |
|||
.cancel{ |
|||
width: 50%; |
|||
text-align: center; |
|||
text-transform: capitalize; |
|||
font-size: 32rpx; |
|||
line-height: 108rpx; |
|||
} |
|||
.title{ |
|||
text-transform: capitalize; |
|||
font-size: 36rpx; |
|||
color: #303133; |
|||
text-align: center; |
|||
} |
|||
.xia_head{ |
|||
height: 72rpx; |
|||
position: relative; |
|||
} |
|||
.tiao{ |
|||
width: 32rpx; |
|||
height: 6rpx; |
|||
border-radius: 4rpx; |
|||
background-color: rgba(255,255,255,.1); |
|||
position: absolute; |
|||
left: 50%; |
|||
transform: translateX(-50%); |
|||
top: 24rpx; |
|||
} |
|||
.xia_item{ |
|||
width: 678rpx; |
|||
padding: 36rpx 0; |
|||
} |
|||
|
|||
.info{ |
|||
justify-content: space-between; |
|||
} |
|||
.info .imgcon{ |
|||
width: 76rpx; |
|||
height: 76rpx; |
|||
} |
|||
.info .imgcon image{ |
|||
width: 100%; |
|||
height: 100%; |
|||
} |
|||
.doname{ |
|||
margin-left: 24rpx; |
|||
} |
|||
.doname .name{ |
|||
color: #fff; |
|||
font-size: 32rpx; |
|||
} |
|||
.doname .win{ |
|||
width: 124rpx; |
|||
padding: 4rpx 8rpx; |
|||
line-height: 32rpx; |
|||
color: #fff; |
|||
font-size: 20rpx; |
|||
background-color: #491C7A; |
|||
border-radius: 8rpx; |
|||
margin-top: 6rpx; |
|||
} |
|||
.recharge{ |
|||
position: relative; |
|||
padding-left: 50rpx; |
|||
} |
|||
.recharge image{ |
|||
width: 40rpx; |
|||
height: 40rpx; |
|||
position: absolute; |
|||
left: 0; |
|||
bottom: 0; |
|||
} |
|||
.recharge i{ |
|||
font-style: normal; |
|||
margin-right: 8rpx; |
|||
} |
|||
.recharge span{ |
|||
color: #fff; |
|||
font-size: 32rpx; |
|||
} |
|||
.follow{ |
|||
width: 142rpx; |
|||
line-height: 60rpx; |
|||
background-color: #954DE3; |
|||
color: #fff; |
|||
font-size: 24rpx; |
|||
border-radius: 16rpx; |
|||
position: relative; |
|||
text-align: center; |
|||
padding-right: 10rpx; |
|||
} |
|||
.follow::after{ |
|||
content: ''; |
|||
width: 24rpx; |
|||
height: 24rpx; |
|||
background: url(../../../static/color/top_icon_ins@3x.png)no-repeat; |
|||
background-size: contain; |
|||
position: absolute; |
|||
right: 10rpx; |
|||
top: 50%; |
|||
transform: translateY(-50%) rotate(90deg); |
|||
} |
|||
.list{ |
|||
border-top: 2rpx solid #34026B; |
|||
justify-content: space-between; |
|||
flex-wrap: wrap; |
|||
overflow: hidden; |
|||
max-height: 0; |
|||
transition: .5s all; |
|||
padding: 0 24rpx; |
|||
} |
|||
.list_con{ |
|||
width: 375rpx; |
|||
align-items: center; |
|||
padding: 26rpx 0; |
|||
} |
|||
.list_con .img1{ |
|||
width: 32rpx; |
|||
height: 32rpx; |
|||
margin-left: 16rpx; |
|||
} |
|||
.num{ |
|||
font-size: 24rpx; |
|||
color: #fff; |
|||
} |
|||
.instit{ |
|||
text-transform: capitalize; |
|||
font-size: 24rpx; |
|||
margin-left: 16rpx; |
|||
} |
|||
.red{ |
|||
color: #F25B5B !important; |
|||
} |
|||
.green{ |
|||
color: #00B977; |
|||
} |
|||
|
|||
.donna2.on .list,.follow:hover .list{ |
|||
max-height: 1000rpx; |
|||
} |
|||
|
|||
.donna2.on .follow::after{ |
|||
transform: translateY(-50%) rotate( |
|||
270deg |
|||
); |
|||
padding: 0 !important; |
|||
} |
|||
|
|||
|
|||
|
|||
.xiazhu{ |
|||
background-color: #fff; |
|||
position: fixed; |
|||
bottom: 0; |
|||
padding-top: 48rpx; |
|||
width: 100%; |
|||
border-radius: 48rpx 48rpx 0 0; |
|||
z-index: 9999; |
|||
} |
|||
.xiazhu .top{ |
|||
padding: 0 40rpx; |
|||
} |
|||
.xiazhu .title{ |
|||
font-size: 36rpx; |
|||
text-align: center; |
|||
color: #303133FF; |
|||
text-transform: capitalize; |
|||
} |
|||
.contract{ |
|||
margin-top: 80rpx; |
|||
} |
|||
.xname{ |
|||
color: #606266FF; |
|||
font-size: 28rpx; |
|||
} |
|||
.contract .numcon{ |
|||
display: flex; |
|||
} |
|||
.contract .numcon .num{ |
|||
padding: 16rpx 24rpx; |
|||
border: 2rpx solid #EDEFF2FF; |
|||
color: #303133FF; |
|||
font-size: 28rpx; |
|||
text-align: center; |
|||
} |
|||
.contract .numcon .num:hover{ |
|||
border-color: #954DE3FF; |
|||
} |
|||
.bujin,.TotalMoney,.agree,.btn_con{ |
|||
margin-top: 60rpx; |
|||
} |
|||
.agree{ |
|||
color: #606266FF; |
|||
font-size: 28rpx; |
|||
text-transform: capitalize; |
|||
display: flex; |
|||
align-items: center; |
|||
} |
|||
.agree .img{ |
|||
width: 34rpx; |
|||
height: 34rpx; |
|||
margin-right: 10rpx; |
|||
} |
|||
.agree .s2{ |
|||
color: #954DE3FF; |
|||
} |
|||
.agree .s1{ |
|||
margin-right:10rpx ; |
|||
} |
|||
.btn_con .btn{ |
|||
line-height: 108rpx; |
|||
text-align: center; |
|||
color: #303133FF; |
|||
font-size: 32rpx; |
|||
background-color: #F5F7FAFF; |
|||
text-transform: capitalize; |
|||
} |
|||
.btn_con .btn1{ |
|||
width: 240rpx; |
|||
} |
|||
.btn_con .btn2{ |
|||
width: 510rpx; |
|||
background-color: #954DE3FF; |
|||
opacity: .5; |
|||
color: #fff; |
|||
} |
|||
|
|||
|
|||
|
|||
|
|||
|
|||
|
|||
|
|||
|
|||
|
|||
|
|||
|
|||
|
|||
|
|||
|
|||
|
|||
|
|||
.timeCon{ |
|||
margin-top: 38rpx; |
|||
} |
|||
.time,.count{ |
|||
color: #303133; |
|||
font-size: 36rpx; |
|||
} |
|||
.perCoun,.timeCon{ |
|||
align-items: center; |
|||
justify-content: space-between; |
|||
} |
|||
.period,.coDown{ |
|||
text-transform: capitalize; |
|||
color: #909399; |
|||
font-size: 28rpx; |
|||
} |
|||
.perCon{ |
|||
padding-top: 24rpx; |
|||
padding-bottom: 48rpx; |
|||
} |
|||
.gameContent{ |
|||
padding: 0 36rpx; |
|||
} |
|||
.flex{ |
|||
display: flex; |
|||
align-items: center; |
|||
} |
|||
.gNum{ |
|||
line-height: 96rpx; |
|||
text-align: center; |
|||
} |
|||
.ga{ |
|||
font-size: 28rpx; |
|||
color: #909399; |
|||
width: 250rpx; |
|||
position: relative; |
|||
} |
|||
.ga::before{ |
|||
content: ''; |
|||
width: 0%; |
|||
height: 4rpx; |
|||
background: #954DE3; |
|||
position: absolute; |
|||
left: 50%; |
|||
bottom: 0px; |
|||
transform: translateX(-50%); |
|||
} |
|||
|
|||
.gaactive{ |
|||
color: #954DE3FF !important; |
|||
} |
|||
.gaactive::before{ |
|||
width: 80rpx; |
|||
} |
|||
|
|||
|
|||
.icon-con{ |
|||
justify-content: space-between; |
|||
} |
|||
.ico{ |
|||
width: 210rpx; |
|||
height: 80rpx; |
|||
border: 2rpx solid #EDEFF2; |
|||
border-radius: 16rpx; |
|||
position: relative; |
|||
} |
|||
.ico image{ |
|||
width: 40rpx; |
|||
height: 40rpx; |
|||
position: absolute; |
|||
left: 50%; |
|||
top: 50%; |
|||
transform: translate(-50%,-50%); |
|||
} |
|||
.multiple-con{ |
|||
justify-content: space-between; |
|||
flex-wrap: wrap; |
|||
margin-top: 24rpx; |
|||
} |
|||
.mul-item{ |
|||
width: 112rpx; |
|||
line-height: 80rpx; |
|||
color: #fff; |
|||
font-size: 32rpx; |
|||
border-radius: 16rpx; |
|||
text-align: center; |
|||
} |
|||
.bg_green{ |
|||
background-color: #00B977; |
|||
} |
|||
.bg_red{ |
|||
background-color: #F25B5B; |
|||
} |
|||
.bg_jb1{ |
|||
background-image: linear-gradient(-30deg, #954DE3 50% , #F25B5B 50% ); |
|||
} |
|||
.bg_jb2{ |
|||
background-image: linear-gradient(-30deg,#954DE3 50% , #00B977 50% ); |
|||
} |
|||
|
|||
.donna{ |
|||
background-color: #34026B; |
|||
border-radius: 16rpx; |
|||
height: 160rpx; |
|||
padding: 24rpx 24rpx; |
|||
margin-top: 48rpx; |
|||
justify-content: space-between; |
|||
} |
|||
.info{ |
|||
justify-content: space-between; |
|||
} |
|||
.info .imgcon{ |
|||
width: 76rpx; |
|||
height: 76rpx; |
|||
} |
|||
.info .imgcon image{ |
|||
width: 100%; |
|||
height: 100%; |
|||
} |
|||
.doname{ |
|||
margin-left: 24rpx; |
|||
} |
|||
.doname .name{ |
|||
color: #fff; |
|||
font-size: 32rpx; |
|||
} |
|||
.doname .win{ |
|||
width: 124rpx; |
|||
padding: 4rpx 8rpx; |
|||
line-height: 32rpx; |
|||
color: #fff; |
|||
font-size: 20rpx; |
|||
background-color: #491C7A; |
|||
border-radius: 8rpx; |
|||
margin-top: 6rpx; |
|||
} |
|||
.recharge{ |
|||
position: relative; |
|||
padding-left: 50rpx; |
|||
} |
|||
.recharge image{ |
|||
width: 40rpx; |
|||
height: 40rpx; |
|||
position: absolute; |
|||
left: 0; |
|||
bottom: 0; |
|||
} |
|||
.recharge i{ |
|||
font-style: normal; |
|||
margin-right: 8rpx; |
|||
} |
|||
.recharge span{ |
|||
color: #fff; |
|||
font-size: 32rpx; |
|||
} |
|||
.follow{ |
|||
width: 142rpx; |
|||
line-height: 60rpx; |
|||
background-color: #954DE3; |
|||
color: #fff; |
|||
font-size: 24rpx; |
|||
border-radius: 16rpx; |
|||
position: relative; |
|||
text-align: center; |
|||
padding-right: 10rpx; |
|||
} |
|||
.follow::after{ |
|||
content: ''; |
|||
width: 24rpx; |
|||
height: 24rpx; |
|||
background: url(../../../static/color/top_icon_ins@3x.png)no-repeat; |
|||
background-size: contain; |
|||
position: absolute; |
|||
right: 12rpx; |
|||
top: 50%; |
|||
transform: translateY(-50%); |
|||
} |
|||
|
|||
|
|||
|
|||
|
|||
.gNum{ |
|||
line-height: 96rpx; |
|||
text-align: center; |
|||
} |
|||
.ga{ |
|||
font-size: 28rpx; |
|||
color: #909399; |
|||
width: 250rpx; |
|||
position: relative; |
|||
} |
|||
.ga::before{ |
|||
content: ''; |
|||
width: 0%; |
|||
height: 4rpx; |
|||
background: #954DE3; |
|||
position: absolute; |
|||
left: 50%; |
|||
bottom: 0px; |
|||
transform: translateX(-50%); |
|||
} |
|||
|
|||
.gaactive{ |
|||
color: #954DE3FF !important; |
|||
} |
|||
.gaactive::before{ |
|||
width: 80rpx; |
|||
} |
|||
|
|||
@ -0,0 +1,430 @@ |
|||
<template> |
|||
<view class="content"> |
|||
<navigation>color</navigation> |
|||
<balance><view class="rules-btn" slot="rules">rules</view></balance> |
|||
<view class="bg_white"> |
|||
<view class="gNum flex"> |
|||
<view class="ga" v-for="(item,index) in colorList" :key="item.id" :class="index==ganum?'gaactive':''" @click="gaClick(index)"> |
|||
{{item.name}} |
|||
</view> |
|||
</view> |
|||
<gameView :myName="myName" :myImgUrl="myImgUrl" :colorData="colorData"></gameView> |
|||
<view class="gameNav"> |
|||
<view class="gameNav-item active"> |
|||
Chart Trending |
|||
</view> |
|||
<view class="gameNav-item"> |
|||
G3 record |
|||
</view> |
|||
<view class="gameNav-item"> |
|||
My G3 Record |
|||
</view> |
|||
</view> |
|||
<gamecont @send="getSon" v-if="gamecontnum"></gamecont> |
|||
<gamecont2 :gameRecordCont="gameRecordCont" ></gamecont2> |
|||
<gamecont3 v-if="gamecontnum" ></gamecont3> |
|||
|
|||
</view> |
|||
<u-mask :show="show"></u-mask> |
|||
|
|||
<view class="follow_xiazhu_con" v-show=false> |
|||
<view class="xia_head"> |
|||
<view class="tiao"> |
|||
</view> |
|||
</view> |
|||
<view class="xia_body"> |
|||
<view class="donna2" :class="folLisNum==1?'on':''"> |
|||
<view class="flex don_con"> |
|||
<view class="flex info"> |
|||
<view class="imgcon"> |
|||
<image src="../../../static/my/[email protected]" mode=""></image> |
|||
</view> |
|||
<view class="doname"> |
|||
<p class="name">Donna</p> |
|||
<view class="win"> |
|||
64% win |
|||
</view> |
|||
</view> |
|||
</view> |
|||
<view class="recharge"> |
|||
<image src="../../../static/color/[email protected]" mode=""></image> |
|||
<span><i>₦</i>2000</span> |
|||
</view> |
|||
<view class="follow" @click="folLisNum=1"> |
|||
Follow |
|||
</view> |
|||
</view> |
|||
<view class="list flex"> |
|||
<view class="flex list_con"> |
|||
<view class="num"> |
|||
20210701323 |
|||
</view> |
|||
<image src="../../../static/color/[email protected]" mode="" class="img1"></image> |
|||
<view class="instit red"> |
|||
lose |
|||
</view> |
|||
</view> |
|||
<view class="flex list_con"> |
|||
<view class="num"> |
|||
20210701323 |
|||
</view> |
|||
<image src="../../../static/color/[email protected]" mode="" class="img1"></image> |
|||
<view class="instit red"> |
|||
lose |
|||
</view> |
|||
</view> |
|||
<view class="flex list_con"> |
|||
<view class="num"> |
|||
20210701323 |
|||
</view> |
|||
<image src="../../../static/color/[email protected]" mode="" class="img1"></image> |
|||
<view class="instit red"> |
|||
lose |
|||
</view> |
|||
</view> |
|||
</view> |
|||
|
|||
</view> |
|||
|
|||
<view class="donna2" :class="folLisNum==1?'on':''"> |
|||
<view class="flex don_con"> |
|||
<view class="flex info"> |
|||
<view class="imgcon"> |
|||
<image :src="'https://apitest.luck-work.com/'+myImgUrl" mode="aspectFit"></image> |
|||
</view> |
|||
<view class="doname"> |
|||
<p class="name">{{myName}}</p> |
|||
<view class="win"> |
|||
64% win |
|||
</view> |
|||
</view> |
|||
</view> |
|||
<view class="recharge"> |
|||
<image src="../../../static/color/[email protected]" mode=""></image> |
|||
<span><i>₦</i>2000</span> |
|||
</view> |
|||
<view class="follow" @click="folLisNum=1"> |
|||
Follow |
|||
</view> |
|||
</view> |
|||
<view class="list flex"> |
|||
<view class="flex list_con"> |
|||
<view class="num"> |
|||
20210701323 |
|||
</view> |
|||
<image src="../../../static/color/[email protected]" mode="" class="img1"></image> |
|||
<view class="instit red"> |
|||
lose |
|||
</view> |
|||
</view> |
|||
<view class="flex list_con"> |
|||
<view class="num"> |
|||
20210701323 |
|||
</view> |
|||
<image src="../../../static/color/[email protected]" mode="" class="img1"></image> |
|||
<view class="instit red"> |
|||
lose |
|||
</view> |
|||
</view> |
|||
<view class="flex list_con"> |
|||
<view class="num"> |
|||
20210701323 |
|||
</view> |
|||
<image src="../../../static/color/[email protected]" mode="" class="img1"></image> |
|||
<view class="instit red"> |
|||
lose |
|||
</view> |
|||
</view> |
|||
</view> |
|||
|
|||
</view> |
|||
|
|||
</view> |
|||
|
|||
<!-- <view class="tc"> |
|||
<view class="title"> |
|||
connfirm info |
|||
</view> |
|||
<view class="tc_body"> |
|||
<view class="body_item flex"> |
|||
<view class="body_item_info"> |
|||
Perode |
|||
</view> |
|||
<view class="body_item_info"> |
|||
20210701327 |
|||
</view> |
|||
</view> |
|||
<view class="body_item flex"> |
|||
<view class="body_item_info"> |
|||
choose |
|||
</view> |
|||
<view class="body_item_info"> |
|||
<image src="../../../static/color/[email protected]" mode=""></image> |
|||
</view> |
|||
</view> |
|||
<view class="body_item flex"> |
|||
<view class="body_item_info"> |
|||
contract money |
|||
</view> |
|||
<view class="body_item_info"> |
|||
5,000 |
|||
</view> |
|||
</view> |
|||
</view> |
|||
<view class="anniu_con flex"> |
|||
<view class="cancel"> |
|||
cancel |
|||
</view> |
|||
<view class="cancel"> |
|||
confirm |
|||
</view> |
|||
</view> |
|||
</view> --> |
|||
|
|||
</view> |
|||
|
|||
<view class="xiazhu" v-show="xiazhuCode"> |
|||
<view class="top"> |
|||
<view class="title"> |
|||
join violet |
|||
</view> |
|||
<view class="contract flex"> |
|||
<view class="xname"> |
|||
Contract Money |
|||
</view> |
|||
<view class="numcon"> |
|||
<view class="num" v-for="(item,index) in betting_amount" :key="item"> |
|||
{{item}} |
|||
</view> |
|||
</view> |
|||
</view> |
|||
<view class="bujin flex"> |
|||
<view class="xname"> |
|||
Number |
|||
</view> |
|||
<u-number-box></u-number-box> |
|||
</view> |
|||
<view class="TotalMoney xname"> |
|||
Total Contract Money is 50 |
|||
</view> |
|||
<view class="agree"> |
|||
<view class=""> |
|||
<u-checkbox-group> |
|||
<u-checkbox |
|||
v-model="item.checked" |
|||
v-for="(item, index) in list" :key="index" |
|||
:name="item.name" shape="circle" active-color="#954DE3FF" |
|||
>{{item.name}}</u-checkbox> |
|||
</u-checkbox-group> |
|||
</view> |
|||
<span class="s1">I agree </span><span class="s2" @click="goRule">presale rule</span> |
|||
</view> |
|||
|
|||
</view> |
|||
<view class="btn_con flex"> |
|||
<view class="btn1 btn" @click="xiazhuCode=false"> |
|||
cancel |
|||
</view> |
|||
<view class="btn2 btn"> |
|||
comfierm |
|||
</view> |
|||
</view> |
|||
|
|||
</view> |
|||
<u-mask :show="xiazhuCode" :z-index="10"></u-mask> |
|||
|
|||
</view> |
|||
</template> |
|||
|
|||
<script> |
|||
import api from '@/utils/api' |
|||
import utils from '@/utils' |
|||
import navigation from "@/components/navigation/navigation.vue" |
|||
import balance from "@/components/balance/balance.vue" |
|||
import gameView from "@/components/gameView/gameView.vue" |
|||
import gamecont from "@/components/gamecont/gamecont.vue" |
|||
import gamecont2 from "@/components/gamecont2/gamecont2.vue" |
|||
import gamecont3 from "@/components/gamecont3/gamecont3.vue" |
|||
export default{ |
|||
data(){ |
|||
return{ |
|||
gamecontnum:false, |
|||
show: false, |
|||
showWhite:true, |
|||
myName:'', |
|||
myImgUrl:'', |
|||
folLisNum:0, |
|||
xiazhuCode:false, |
|||
gap:'', |
|||
colorList:[], |
|||
colorData:[], |
|||
ganum:'', |
|||
|
|||
|
|||
gameRecord:[], |
|||
gameRecordCont:[], |
|||
myGameRecord:[], |
|||
list: [ |
|||
{ |
|||
name: '', |
|||
checked: false, |
|||
disabled: false |
|||
}, |
|||
|
|||
], |
|||
betting_amount:[], |
|||
betting_rule:'', |
|||
|
|||
} |
|||
}, |
|||
|
|||
onLoad() { |
|||
this.myName=uni.getStorageSync('MyInfo').nickname; |
|||
this.myImgUrl=uni.getStorageSync('MyInfo').headImgPath; |
|||
uni.request({ |
|||
url: '/start/api/lottery/lotteryClassList', |
|||
data: { |
|||
"ticket": uni.getStorageSync('logInfo').data, |
|||
}, |
|||
header: { |
|||
'Content-Type': 'application/x-www-form-urlencoded;charset=utf-8' //自定义请求头信息 |
|||
}, |
|||
method: 'POST', //请求方式 或GET，必须为大写 |
|||
success: (res) => { |
|||
console.log(res.data.data,888888888888) |
|||
this.colorList=res.data.data; |
|||
this.colorData=res.data.data[0]; |
|||
// this.gap=res.data.data[0].gap*60; |
|||
|
|||
|
|||
// uni.setStorage({ |
|||
// key: 'colorList0', |
|||
// data: res.data.data[0], |
|||
// success: function() { |
|||
// console.log('success',111) |
|||
// } |
|||
// }); |
|||
// uni.setStorage({ |
|||
// key: 'colorList1', |
|||
// data: res.data.data[1], |
|||
// success: function() { |
|||
// console.log('success',221) |
|||
// } |
|||
// }); |
|||
// uni.setStorage({ |
|||
// key: 'colorList2', |
|||
// data: res.data.data[2], |
|||
// success: function() { |
|||
// console.log('success',331) |
|||
// } |
|||
// }); |
|||
|
|||
|
|||
}, |
|||
fail: (res) => { |
|||
console.log(res); |
|||
} |
|||
}); |
|||
|
|||
uni.request({ |
|||
url: '/start/api/lottery/lotteryRecords', |
|||
data: { |
|||
"ticket": uni.getStorageSync('logInfo').data, |
|||
"classId":uni.getStorageSync('colorList0').id, |
|||
"pageNumber":1, |
|||
"pageSize":20, |
|||
}, |
|||
header: { |
|||
'Content-Type': 'application/x-www-form-urlencoded;charset=utf-8' //自定义请求头信息 |
|||
}, |
|||
method: 'POST', //请求方式 或GET，必须为大写 |
|||
success: (res) => { |
|||
this.gameRecordCont=res.data.data.content; |
|||
for(var i=0;i<this.gameRecordCont.length;i++){ |
|||
this.gameRecordCont[i].period=this.gameRecordCont[i].period.substring(2,13); |
|||
this.gameRecordCont[i].lotteryColor=this.gameRecordCont[i].lotteryColor.split(','); |
|||
} |
|||
// console.log(res.data.data,77777777777777) |
|||
}, |
|||
fail: (res) => { |
|||
console.log(res); |
|||
} |
|||
}); |
|||
|
|||
|
|||
|
|||
|
|||
|
|||
uni.request({ |
|||
url: '/start/api/lottery/myLotteryRecords', |
|||
data: { |
|||
"ticket": uni.getStorageSync('logInfo').data, |
|||
"classId":uni.getStorageSync('colorList0').id, |
|||
"pageNumber":1, |
|||
"pageSize":20, |
|||
}, |
|||
header: { |
|||
'Content-Type': 'application/x-www-form-urlencoded;charset=utf-8' //自定义请求头信息 |
|||
}, |
|||
method: 'POST', //请求方式 或GET，必须为大写 |
|||
success: (res) => { |
|||
this.myGameRecord=res.data; |
|||
}, |
|||
fail: (res) => { |
|||
console.log(res); |
|||
} |
|||
}); |
|||
|
|||
|
|||
uni.request({ |
|||
url: '/start/api/lottery/bettingConfig', |
|||
data: { |
|||
"ticket": uni.getStorageSync('logInfo').data, |
|||
}, |
|||
header: { |
|||
'Content-Type': 'application/x-www-form-urlencoded;charset=utf-8' //自定义请求头信息 |
|||
}, |
|||
method: 'POST', //请求方式 或GET，必须为大写 |
|||
success: (res) => { |
|||
this.betting_amount=this.bettingSetting=res.data.data.betting_amount.split(','); |
|||
this.betting_rule=res.data.data.tips; |
|||
}, |
|||
fail: (res) => { |
|||
console.log(res); |
|||
} |
|||
}); |
|||
|
|||
|
|||
}, |
|||
onReachBottom(){ |
|||
console.log("触底了") |
|||
}, |
|||
methods:{ |
|||
gaClick(i){ |
|||
this.ganum=i |
|||
// var s=index.formatyymmdd(this.colorList2.addTime); |
|||
// console.log(s) |
|||
this.colorData=this.colorList[i]; |
|||
}, |
|||
goRule(){ |
|||
uni.navigateTo({ |
|||
url:'/pages/rule/index' |
|||
}) |
|||
}, |
|||
showMas(){ |
|||
|
|||
this.show=true; |
|||
this.showWhite=false; |
|||
}, |
|||
getSon(res){ |
|||
this.xiazhuCode=res; |
|||
console.log(res); |
|||
} |
|||
|
|||
}, |
|||
} |
|||
</script> |
|||
|
|||
<style> |
|||
@import './index.css'; |
|||
</style> |
|||
@ -0,0 +1,24 @@ |
|||
|
|||
.index-body{ |
|||
background: #fff; |
|||
border-radius: 40rpx 40rpx 0 0; |
|||
} |
|||
.index-body{ |
|||
padding: 0 36rpx; |
|||
position: relative; |
|||
top: -40rpx; |
|||
} |
|||
.index-body-p1{ |
|||
padding-top: 48rpx; |
|||
color: #303133FF; |
|||
font-size: 32rpx; |
|||
} |
|||
.index-body-img{ |
|||
margin-top: 12rpx; |
|||
width: 100%; |
|||
height: 384rpx; |
|||
} |
|||
.index-body-img image{ |
|||
width: 100%; |
|||
height: 100%; |
|||
} |
|||
@ -0,0 +1,64 @@ |
|||
<template> |
|||
<view class=""> |
|||
<balance></balance> |
|||
<view class="index-body"> |
|||
<view class="index-body-p1"> |
|||
Game |
|||
</view> |
|||
<view class="index-body-img" @click="goColor"> |
|||
<image src="../../static/home/[email protected]" mode=""></image> |
|||
</view> |
|||
</view> |
|||
|
|||
</view> |
|||
|
|||
</template> |
|||
|
|||
<script> |
|||
import Vue from 'vue'; |
|||
import balance from "@/components/navigation/navigation.vue" |
|||
export default { |
|||
data() { |
|||
return { |
|||
|
|||
} |
|||
}, |
|||
onLoad() { |
|||
|
|||
}, |
|||
methods: { |
|||
goColor(){ |
|||
uni.navigateTo({ |
|||
url:'../color/color1/index' |
|||
}) |
|||
}, |
|||
getBanner() { |
|||
const banner = api.banner(param) |
|||
banner.then(d => { |
|||
console.log(d) |
|||
this.info = d.data |
|||
}) |
|||
.catch((e) => { |
|||
console.log(e) |
|||
}) |
|||
}, |
|||
getPicsCate(){ |
|||
uni.request({ |
|||
url:"https://apitest.luck-work.com/uc", |
|||
success(res){ |
|||
console.log(res); |
|||
} |
|||
}) |
|||
|
|||
}, |
|||
|
|||
|
|||
} |
|||
} |
|||
</script> |
|||
|
|||
<style> |
|||
@import './index.css'; |
|||
|
|||
|
|||
</style> |
|||
@ -0,0 +1,107 @@ |
|||
|
|||
.flex{ |
|||
display: flex; |
|||
align-items: center; |
|||
} |
|||
.login-body{ |
|||
padding: 0 36rpx; |
|||
padding-top: 48rpx; |
|||
} |
|||
.input-item{ |
|||
position: relative; |
|||
height: 96rpx; |
|||
padding-left: 24rpx; |
|||
border-bottom: 2rpx solid #F4F5F7; |
|||
margin-bottom: 24rpx; |
|||
} |
|||
|
|||
.input-item input{ |
|||
line-height: 96rpx; |
|||
width: 500rpx; |
|||
text-transform: capitalize; |
|||
font-size: 28rpx; |
|||
color: #303133FF; |
|||
} |
|||
.login-sigh{ |
|||
width: 172rpx; |
|||
position: relative; |
|||
} |
|||
|
|||
.login-sigh::before{ |
|||
content: ''; |
|||
width: 4rpx; |
|||
height: 26rpx; |
|||
background-color: #BFC2CCFF; |
|||
position: absolute; |
|||
right: 16rpx; |
|||
top: 50%; |
|||
transform: translateY(-50%); |
|||
} |
|||
.login-sigh2{ |
|||
width: 64rpx; |
|||
} |
|||
.login-sigh2::before{ |
|||
content: none; |
|||
} |
|||
.login-sigh .imgcon{ |
|||
width: 40rpx; |
|||
height: 40rpx; |
|||
} |
|||
.login-sigh .imgcon image{ |
|||
width: 100%; |
|||
height: 100%; |
|||
} |
|||
.login-sigh .quhao{ |
|||
font-size: 28rpx; |
|||
color: #303133FF; |
|||
margin-left: 20rpx; |
|||
} |
|||
.rePass{ |
|||
color: #606266FF; |
|||
font-size: 28rpx; |
|||
float: right; |
|||
} |
|||
.login-btn{ |
|||
text-align: center; |
|||
line-height: 96rpx; |
|||
background: #34026B; |
|||
opacity: 0.2; |
|||
border-radius: 24rpx; |
|||
color: #fff; |
|||
margin-top: 120rpx; |
|||
} |
|||
.on{ |
|||
opacity: 1; |
|||
} |
|||
.login-re{ |
|||
width: auto; |
|||
display: table; |
|||
margin: 0 auto; |
|||
font-size: 14px; |
|||
font-weight: 400; |
|||
line-height: 27px; |
|||
color: #606266; |
|||
margin-top: 18px; |
|||
position: relative; |
|||
padding-right: 36rpx; |
|||
} |
|||
.login-re::before{ |
|||
content: ''; |
|||
width: 24rpx; |
|||
height: 24rpx; |
|||
background: url(../../static/login/top_icon_ins@2x.png)no-repeat; |
|||
background-size: contain; |
|||
position: absolute; |
|||
right: 0; |
|||
top: 50%; |
|||
transform: translateY(-50%); |
|||
} |
|||
.input-item input::-webkit-input-placeholder { |
|||
color: red; |
|||
} |
|||
.input-item input:-moz-placeholder { |
|||
color: red; |
|||
} |
|||
.input-item input:-ms-input-placeholder { |
|||
color: red; |
|||
} |
|||
@ -0,0 +1,203 @@ |
|||
<template> |
|||
<view class=""> |
|||
<navigation>Login</navigation> |
|||
<view class="login-body"> |
|||
<view class="input-item flex"> |
|||
<view class="login-sigh flex"> |
|||
<view class="imgcon"> |
|||
<image src="../../static/login/[email protected]" mode=""></image> |
|||
</view> |
|||
<span class="quhao">+{{areacode}}</span> |
|||
</view> |
|||
<input type="text" value="" placeholder="mobile number" |
|||
placeholder-style="color: #BFC2CCFF;font-size:14px;" v-model="mobile" @focus="btncol=1" @blur="btncol=2" /> |
|||
</view> |
|||
<view class="input-item flex"> |
|||
<view class="login-sigh login-sigh2 flex"> |
|||
<view class="imgcon"> |
|||
<image src="../../static/login/[email protected]" mode=""></image> |
|||
</view> |
|||
</view> |
|||
<input type="password" value="" placeholder="New password" |
|||
placeholder-style="color: #BFC2CCFF;font-size:14px;" v-model="password" @focus="btncol=1" @blur="btncol=2" /> |
|||
</view> |
|||
<view class="rePass" @click="gores()"> |
|||
Reset Password |
|||
</view> |
|||
<view class="login-btn" @click="login()" :class="btncol==1?'on':''"> |
|||
Login |
|||
</view> |
|||
<view class="login-re" @click="goReg()"> |
|||
Register |
|||
</view> |
|||
</view> |
|||
</view> |
|||
</template> |
|||
|
|||
<script> |
|||
import api from '@/utils/api' |
|||
import utils from '@/utils' |
|||
import md5 from 'js-md5' |
|||
import store from '@/store' |
|||
import cont from "@/components/navigation/navigation.vue" |
|||
export default { |
|||
data() { |
|||
return { |
|||
mobile: '', |
|||
password: '', |
|||
siteInfoData: {}, |
|||
countryCode: {}, |
|||
logoUrl: '', |
|||
btncol:0, |
|||
areacode:'', |
|||
siteName:'', |
|||
} |
|||
}, |
|||
|
|||
onLoad() { |
|||
this.siteInfoData = uni.getStorageSync('siteInfo') |
|||
this.countryCode = uni.getStorageSync('countryCode') |
|||
console.log(this.siteInfoData, 9999) |
|||
console.log(this.countryCode, 99999) |
|||
const siteInfo = api.siteInfo() |
|||
siteInfo.then(d => { |
|||
let that = this |
|||
uni.setStorage({ |
|||
key: 'siteInfo', |
|||
data: d.data, |
|||
success: function() { |
|||
console.log('success') |
|||
that.logoUrl = d.data.siteDomain + d.data.siteLogo |
|||
that.siteName = d.data.siteName |
|||
that.areacode=d.data.areaCode |
|||
} |
|||
}); |
|||
this.siteInfoData = d.data |
|||
}) |
|||
.catch((e) => { |
|||
console.log(e) |
|||
}) |
|||
this.logoUrl = this.siteInfoData.siteDomain + this.siteInfoData.siteLogo |
|||
this.siteName = this.siteInfoData.siteName |
|||
// const ticket = this.$store.state.ticket |
|||
const ticket= uni.getStorageSync('logInfo').data; |
|||
console.log(ticket,7777777777777777777) |
|||
if (ticket != '') { |
|||
uni.navigateTo({ |
|||
url: '../index/index' |
|||
}) |
|||
} else { |
|||
//页面加载完成，获取本地存储的用户名及密码 |
|||
// this.account = this.$store.state.account; |
|||
// this.password = this.$store.state.password; |
|||
} |
|||
|
|||
}, |
|||
methods: { |
|||
gores(){ |
|||
uni.navigateTo({ |
|||
url: './resetPassword/index' |
|||
}) |
|||
}, |
|||
goReg() { |
|||
uni.navigateTo({ |
|||
url: '../register/index' |
|||
}) |
|||
}, |
|||
login() { |
|||
if (this.mobile == '') { |
|||
uni.showToast({ |
|||
title: ' Please enter the login Phone Number', |
|||
icon: 'none', |
|||
duration: 1500 |
|||
}) |
|||
return; |
|||
} |
|||
if (this.password == '') { |
|||
uni.showToast({ |
|||
title: 'password is empty', |
|||
icon: 'none', |
|||
duration: 1500 |
|||
}) |
|||
return; |
|||
} |
|||
var a= /^(?![0-9]+$)(?![a-zA-Z]+$)[0-9A-Za-z]{5,19}$/; |
|||
if(!a.test(this.password)){ |
|||
uni.showToast({ |
|||
title: 'Incorrect password format,a password requires a combination of numbers and letters', |
|||
icon: 'none', |
|||
duration: 1500 |
|||
}) |
|||
return; |
|||
} |
|||
if(this.password.length<6||this.password.length>20){ |
|||
uni.showToast({ |
|||
title: 'The login password requires 6-20 digits', |
|||
icon: 'none', |
|||
duration: 1500 |
|||
}) |
|||
return; |
|||
} |
|||
|
|||
uni.request({ |
|||
url: '/start/api/user/login', |
|||
data: { |
|||
"mobile": this.mobile, |
|||
'password': md5(this.password), |
|||
}, |
|||
header: { |
|||
'Content-Type': 'application/x-www-form-urlencoded;charset=utf-8' //自定义请求头信息 |
|||
}, |
|||
method: 'POST', //请求方式 或GET，必须为大写 |
|||
success: (res) => { |
|||
uni.setStorage({ |
|||
key: 'logInfo', |
|||
data: res.data, |
|||
success: function() { |
|||
console.log('success',999) |
|||
} |
|||
}); |
|||
if(res.data.errCode=="SUCCESS"){ |
|||
uni.showToast({ |
|||
title: res.data.errMsg, |
|||
icon: 'success', |
|||
duration: 1500 |
|||
}) |
|||
setTimeout(function(){ |
|||
uni.reLaunch({ |
|||
url:'../index/index' |
|||
}) |
|||
},2500) |
|||
}else{ |
|||
uni.showToast({ |
|||
title: res.data.errMsg, |
|||
icon: 'none', |
|||
duration: 2500 |
|||
}) |
|||
} |
|||
|
|||
|
|||
|
|||
console.log(res.data,9990); |
|||
|
|||
|
|||
}, |
|||
fail: (res) => { |
|||
uni.showToast({ |
|||
title: res.data.errMsg, |
|||
icon: 'none', |
|||
duration: 2500 |
|||
}) |
|||
console.log(res.data); |
|||
} |
|||
}); |
|||
|
|||
} |
|||
|
|||
}, |
|||
} |
|||
</script> |
|||
|
|||
<style> |
|||
@import './index.css'; |
|||
</style> |
|||
@ -0,0 +1,130 @@ |
|||
|
|||
.content{ |
|||
position: relative; |
|||
|
|||
} |
|||
.flex{ |
|||
display: flex; |
|||
align-items: center; |
|||
} |
|||
.login-body{ |
|||
padding: 0 36rpx; |
|||
padding-top: 48rpx; |
|||
} |
|||
.input-item{ |
|||
position: relative; |
|||
height: 96rpx; |
|||
padding-left: 24rpx; |
|||
border-bottom: 2rpx solid #F4F5F7; |
|||
margin-bottom: 24rpx; |
|||
} |
|||
.login-sigh3 .img1{ |
|||
width: 180rpx; |
|||
height: 60rpx; |
|||
margin-right: 20rpx; |
|||
} |
|||
.login-sigh3 .img2{ |
|||
width: 24rpx; |
|||
height: 24rpx; |
|||
margin-right: 20rpx; |
|||
} |
|||
.input-item input{ |
|||
line-height: 96rpx; |
|||
width: 500rpx; |
|||
text-transform: capitalize; |
|||
font-size: 28rpx; |
|||
color: #303133FF; |
|||
} |
|||
.login-sigh{ |
|||
width: 172rpx; |
|||
position: relative; |
|||
} |
|||
.otp{ |
|||
width: 80rpx; |
|||
line-height: 40rpx; |
|||
border: 2rpx solid #954DE3FF; |
|||
border-radius: 8rpx; |
|||
text-align: center; |
|||
color:#954DE3FF ; |
|||
} |
|||
.input_pcod{ |
|||
padding-left: 20rpx; |
|||
} |
|||
.login-sigh::before{ |
|||
content: ''; |
|||
width: 4rpx; |
|||
height: 26rpx; |
|||
background-color: #BFC2CCFF; |
|||
position: absolute; |
|||
right: 16rpx; |
|||
top: 50%; |
|||
transform: translateY(-50%); |
|||
} |
|||
.login-sigh2{ |
|||
width: 64rpx; |
|||
} |
|||
.login-sigh2::before{ |
|||
content: none; |
|||
} |
|||
.login-sigh .imgcon{ |
|||
width: 40rpx; |
|||
height: 40rpx; |
|||
} |
|||
.login-sigh .imgcon image{ |
|||
width: 100%; |
|||
height: 100%; |
|||
} |
|||
.login-sigh .quhao{ |
|||
font-size: 28rpx; |
|||
color: #303133FF; |
|||
margin-left: 20rpx; |
|||
} |
|||
.rePass{ |
|||
color: #606266FF; |
|||
font-size: 28rpx; |
|||
float: right; |
|||
} |
|||
.login-btn{ |
|||
text-align: center; |
|||
line-height: 96rpx; |
|||
background: #34026B; |
|||
opacity: 0.2; |
|||
border-radius: 24rpx; |
|||
color: #fff; |
|||
margin-top: 120rpx; |
|||
} |
|||
.login-btn:hover{ |
|||
opacity: 1; |
|||
} |
|||
.login-re{ |
|||
width: auto; |
|||
display: table; |
|||
margin: 0 auto; |
|||
font-size: 14px; |
|||
font-weight: 400; |
|||
line-height: 27px; |
|||
color: #606266; |
|||
margin-top: 18px; |
|||
position: relative; |
|||
padding-right: 36rpx; |
|||
} |
|||
.login-re::before{ |
|||
content: ''; |
|||
width: 24rpx; |
|||
height: 24rpx; |
|||
background: url(../../../static/login/top_icon_ins@2x.png)no-repeat; |
|||
background-size: contain; |
|||
position: absolute; |
|||
right: 0; |
|||
top: 50%; |
|||
transform: translateY(-50%); |
|||
} |
|||
.input-item input::-webkit-input-placeholder { |
|||
color: red; |
|||
} |
|||
.input-item input:-moz-placeholder { |
|||
color: red; |
|||
} |
|||
.input-item input:-ms-input-placeholder { |
|||
color: red; |
|||
} |
|||
@ -0,0 +1,219 @@ |
|||
<template> |
|||
<view class=""> |
|||
<navigation>Reset Password</navigation> |
|||
<view class="login-body"> |
|||
<view class="input-item flex"> |
|||
<view class="login-sigh flex"> |
|||
<view class="imgcon"> |
|||
<image src="../../../static/login/[email protected]" mode=""></image> |
|||
</view> |
|||
<span class="quhao">+{{areacode}}</span> |
|||
</view> |
|||
<input type="text" value="" placeholder="mobile number" |
|||
placeholder-style="color: #BFC2CCFF;font-size:14px;text-transform: capitalize;" v-model="mobile" /> |
|||
</view> |
|||
<view class="input-item flex"> |
|||
<view class="login-sigh login-sigh2 flex"> |
|||
<view class="imgcon"> |
|||
<image src="../../../static/login/[email protected]" mode=""></image> |
|||
</view> |
|||
</view> |
|||
<input class="input_pcod" value="" placeholder="Picture Code" |
|||
placeholder-style="color: #BFC2CCFF;font-size:14px;text-transform: capitalize;" v-model="picCode" /> |
|||
<view class="login-sigh3 flex"> |
|||
<image :src="imgcodeUrl" mode="scaleToFill" class="img1"></image> |
|||
<image src="../../../static/login/[email protected]" mode="" class="img2" @click="getPicCode()"> |
|||
</image> |
|||
</view> |
|||
|
|||
</view> |
|||
<view class="input-item flex"> |
|||
<view class="login-sigh login-sigh2 flex"> |
|||
<view class="imgcon"> |
|||
<image src="../../../static/login/[email protected]" mode=""></image> |
|||
</view> |
|||
</view> |
|||
<input @focus="btnNum=1" @blur="btnNum=0" value="" placeholder="Verification code" |
|||
placeholder-style="color: #BFC2CCFF;font-size:14px;text-transform: capitalize;" |
|||
v-model="infoCode" /> |
|||
<view class="otp" @click="getInfoCode()"> |
|||
OTP |
|||
</view> |
|||
</view> |
|||
<view class="input-item flex"> |
|||
<view class="login-sigh login-sigh2 flex"> |
|||
<view class="imgcon"> |
|||
<image src="../../../static/login/[email protected]" mode=""></image> |
|||
</view> |
|||
</view> |
|||
<input type="password" value="" placeholder="new password" |
|||
placeholder-style="color: #BFC2CCFF;font-size:14px;text-transform: capitalize;" |
|||
v-model="newPassword" /> |
|||
</view> |
|||
<view class="login-btn" @click="resetPassword()"> |
|||
Continue |
|||
</view> |
|||
|
|||
</view> |
|||
</view> |
|||
</template> |
|||
|
|||
<script> |
|||
import api from '@/utils/api' |
|||
import utils from '@/utils' |
|||
import cont from "@/components/navigation/navigation.vue" |
|||
export default { |
|||
data() { |
|||
return { |
|||
mark: 'sms_user_forget_password', |
|||
mobile: '', |
|||
imgcodeUrl: '', |
|||
newPassword: '', |
|||
infoCode: '', |
|||
picCode: '', |
|||
areacode: '', |
|||
} |
|||
}, |
|||
|
|||
onLoad() { |
|||
this.getPicCode(); |
|||
this.areacode = uni.getStorageSync('siteInfo').areaCode; |
|||
|
|||
|
|||
}, |
|||
methods: { |
|||
getInfoCode() { |
|||
if (this.picCode == '') { |
|||
uni.showToast({ |
|||
title: 'The graphic verification code is empty', |
|||
icon: 'none', |
|||
duration: 1500 |
|||
}) |
|||
return; |
|||
} |
|||
|
|||
|
|||
uni.request({ |
|||
url: '/start/api/home/sendSmsCode', |
|||
data: { |
|||
"mobile": this.mobile, |
|||
"mark": this.mark, |
|||
"countryCode": uni.getStorageSync('siteInfo').countryCode, |
|||
"code": this.picCode |
|||
}, |
|||
header: { |
|||
'Content-Type': 'application/x-www-form-urlencoded;charset=utf-8' //自定义请求头信息 |
|||
}, |
|||
method: 'POST', //请求方式 或GET，必须为大写 |
|||
success: (res) => { |
|||
uni.showToast({ |
|||
title: res.data.errMsg, |
|||
icon: 'none', |
|||
duration: 2500 |
|||
}) |
|||
console.log(res.data); |
|||
}, |
|||
fail: (res) => { |
|||
uni.showToast({ |
|||
title: res.data.errMsg, |
|||
icon: 'none', |
|||
duration: 2500 |
|||
}) |
|||
console.log(res.data); |
|||
} |
|||
}); |
|||
|
|||
|
|||
}, |
|||
getPicCode() { |
|||
this.imgcodeUrl = "/start/api/home/imgCode?uuid=" + this.$u.guid(20); |
|||
console.log(); |
|||
console.log(this.imgcodeUrl) |
|||
}, |
|||
|
|||
resetPassword() { |
|||
var a= /^(?![0-9]+$)(?![a-zA-Z]+$)[0-9A-Za-z]{5,19}$/; |
|||
|
|||
if (this.mobile == '') { |
|||
uni.showToast({ |
|||
title: ' Please enter the login Phone Number', |
|||
icon: 'none', |
|||
duration: 1500 |
|||
}) |
|||
return; |
|||
} |
|||
if (this.infoCode == '') { |
|||
uni.showToast({ |
|||
title: ' Please enter the SMS verification code', |
|||
icon: 'none', |
|||
duration: 1500 |
|||
}) |
|||
return; |
|||
} |
|||
|
|||
if (this.picCode == '') { |
|||
uni.showToast({ |
|||
title: ' Please enter the Graphic verification code', |
|||
icon: 'none', |
|||
duration: 1500 |
|||
}) |
|||
return; |
|||
} |
|||
if(!a.test(this.newPassword)){ |
|||
uni.showToast({ |
|||
title: 'Incorrect password format,a password requires a combination of numbers and letters', |
|||
icon: 'none', |
|||
duration: 1500 |
|||
}) |
|||
return; |
|||
} |
|||
|
|||
|
|||
uni.request({ |
|||
url: '/start/api/user/forgotPassword', |
|||
data: { |
|||
// "ticket":uni.getStorageSync('logInfo').data, |
|||
// "oldPassword": uni.getStorageSync('logInfo').password, |
|||
// "newPassword":this.nwePassword, |
|||
// "confirmNewPassword": this.nwePassword |
|||
'mobile': this.mobile, |
|||
'code': this.infoCode, |
|||
'newPassword': this.newPassword, |
|||
}, |
|||
header: { |
|||
'Content-Type': 'application/x-www-form-urlencoded;charset=utf-8' //自定义请求头信息 |
|||
}, |
|||
method: 'POST', //请求方式 或GET，必须为大写 |
|||
success: (res) => { |
|||
if(res.data.errCode=='SUCCESS'){ |
|||
uni.showToast({ |
|||
title: 'Password modified successfully', |
|||
icon: 'success', |
|||
duration: 1500 |
|||
}) |
|||
}else{ |
|||
uni.showToast({ |
|||
title: res.data.errMsg, |
|||
icon: '', |
|||
duration: 1500 |
|||
}) |
|||
} |
|||
console.log(res.data); |
|||
}, |
|||
|
|||
fail: (res) => { |
|||
uni.showToast({ |
|||
title: res.errMsg, |
|||
icon: '', |
|||
duration: 1500 |
|||
}) |
|||
} |
|||
}); |
|||
} |
|||
}, |
|||
} |
|||
</script> |
|||
|
|||
<style> |
|||
@import './index.css'; |
|||
</style> |
|||
@ -0,0 +1,210 @@ |
|||
@font-face { |
|||
font-family: 'din'; |
|||
font-weight: normal; |
|||
font-style: normal; |
|||
src: url("~@/static/fonts/DIN-Bold.otf") format("truetype"); |
|||
} |
|||
|
|||
|
|||
.pro-head{ |
|||
text-align: center; |
|||
color: #fff; |
|||
line-height: 108rpx; |
|||
font-size: 36rpx; |
|||
text-transform: capitalize; |
|||
background-color: #34026B; |
|||
position: relative; |
|||
padding: 0 36rpx; |
|||
} |
|||
.pro-hea-rig{ |
|||
position: absolute; |
|||
right: 36rpx; |
|||
top: 50%; |
|||
transform: translateY(-50%); |
|||
display: flex; |
|||
align-items: center; |
|||
} |
|||
|
|||
.pro-hea-rig .img1{ |
|||
width: 36rpx; |
|||
height: 36rpx; |
|||
margin-right: 48rpx; |
|||
} |
|||
.pro-hea-rig .img2{ |
|||
width: 28rpx; |
|||
height: 24rpx; |
|||
} |
|||
.pro-body{ |
|||
padding: 0 36rpx; |
|||
} |
|||
.pro-body-p1{ |
|||
font-size: 44rpx; |
|||
color: #303133FF; |
|||
text-align: center; |
|||
padding: 60rpx 0; |
|||
text-transform: capitalize; |
|||
} |
|||
.pro-body-p1 .s1{ |
|||
font-family: 'din'; |
|||
padding-left: 8rpx; |
|||
vertical-align: bottom; |
|||
} |
|||
.category-sigh{ |
|||
font-size: 36rpx; |
|||
padding-left: 16rpx; |
|||
} |
|||
.pro-body-btn1{ |
|||
text-align: center; |
|||
color: #fff; |
|||
text-transform: capitalize; |
|||
line-height: 96rpx; |
|||
background: #34026B; |
|||
border-radius: 16rpx; |
|||
|
|||
} |
|||
.pro-body-lea{ |
|||
display: flex; |
|||
flex-wrap: wrap; |
|||
justify-content: space-around; |
|||
} |
|||
.lea-item{ |
|||
width: 40%; |
|||
text-align: center; |
|||
padding-bottom: 80rpx; |
|||
} |
|||
.lea-item .p1{ |
|||
color: #909399FF; |
|||
line-height: 96rpx; |
|||
font-size: 32rpx; |
|||
} |
|||
.lea-item .p2{ |
|||
color: #909399FF; |
|||
margin-top: 36rpx; |
|||
font-size: 28rpx; |
|||
} |
|||
.lea-item .p3{ |
|||
color: #303133FF; |
|||
margin-top: 20rpx; |
|||
font-size: 36rpx; |
|||
} |
|||
.lea-item .p1.on{ |
|||
color: #34026BFF; |
|||
border-bottom: 4rpx solid #34026B; |
|||
} |
|||
.pro-body-code{ |
|||
background: url(../../static/promo/bg_promotion@2x.png)no-repeat; |
|||
background-size: contain; |
|||
padding: 36rpx; |
|||
} |
|||
.code-item1 .p1{ |
|||
font-size: 28rpx; |
|||
color: rgba(255,255,255,.4); |
|||
} |
|||
.code-item1 .p2{ |
|||
font-size: 32rpx; |
|||
margin-top: 16rpx; |
|||
color: rgba(255,255,255,1); |
|||
} |
|||
|
|||
.code-item1:nth-child(2){ |
|||
margin-top: 36rpx; |
|||
} |
|||
.code-btn{ |
|||
text-align: center; |
|||
line-height: 96rpx; |
|||
color: #fff; |
|||
border-radius: 16rpx; |
|||
margin-top: 36rpx; |
|||
background-color: #954DE3FF; |
|||
} |
|||
|
|||
.invite-more{ |
|||
width: 750rpx; |
|||
height: 480rpx; |
|||
background: #FFFFFF; |
|||
border-radius: 48rpx 48rpx 0px 0px; |
|||
position: fixed; |
|||
bottom: 0; |
|||
z-index: 9999; |
|||
} |
|||
.more-a{ |
|||
text-transform: capitalize; |
|||
font-size: 32rpx; |
|||
color: #303133; |
|||
text-align: center; |
|||
line-height: 108rpx; |
|||
} |
|||
.invite-con{ |
|||
padding: 24rpx 0; |
|||
} |
|||
.invite-con2{ |
|||
background-color: #F5F7FA; |
|||
padding-bottom: 68rpx; |
|||
} |
|||
.msg-box-bg { |
|||
width: 100%; |
|||
height: 100%; |
|||
position: fixed; |
|||
left: 0; |
|||
top: 0; |
|||
z-index: 1001; |
|||
background-color: rgba(0,0,0,.5); |
|||
} |
|||
|
|||
.appl_Ba{ |
|||
width: 600rpx; |
|||
background-color: #fff; |
|||
position: fixed; |
|||
left: 50%; |
|||
top: 50%; |
|||
transform: translate(-50%,-50%); |
|||
border-radius: 24rpx; |
|||
z-index: 9999; |
|||
} |
|||
.appl_Ba .top{ |
|||
padding: 48rpx 48rpx 0 48rpx; |
|||
} |
|||
.appl_Ba .title{ |
|||
color: #303133FF; |
|||
font-size: 36rpx; |
|||
text-align: center; |
|||
|
|||
text-transform: capitalize; |
|||
} |
|||
.appl_Ba .input{ |
|||
margin-top: 48rpx; |
|||
line-height: 96rpx; |
|||
height: 96rpx; |
|||
} |
|||
.appl_Ba .input input{ |
|||
height: 100%; |
|||
border-bottom: 2rpx solid #EDEFF2FF; |
|||
} |
|||
.appl_Ba .all{ |
|||
line-height: 96rpx; |
|||
background-color: #34026BFF; |
|||
border-radius: 16rpx; |
|||
text-align: center; |
|||
color: #fff; |
|||
margin-top: 48rpx; |
|||
} |
|||
.appl_Ba .btn_con{ |
|||
margin-top: 48rpx; |
|||
border-top: 2rpx solid #F7F9FCFF; |
|||
display: flex; |
|||
justify-content: space-between; |
|||
text-transform: capitalize; |
|||
} |
|||
.appl_Ba .btn_con .btn1{ |
|||
width: 50%; |
|||
text-align: center; |
|||
color: #606266FF; |
|||
font-size: 32rpx; |
|||
line-height: 108rpx; |
|||
} |
|||
.appl_Ba .btn_con .btn1:nth-child(1){ |
|||
border-right: 2rpx solid #F7F9FCFF; |
|||
} |
|||
.puple{ |
|||
color: #954DE3FF !important; |
|||
} |
|||
@ -0,0 +1,160 @@ |
|||
<template> |
|||
<view class="content"> |
|||
<view class="pro-head"> |
|||
promotion |
|||
<view class="pro-hea-rig"> |
|||
<image src="../../static/promo/[email protected]" mode="aspectFit" class="img1"></image> |
|||
<image src="../../static/promo/[email protected]" mode="aspectFit" class="img2" @click="invMore=true,msShow=true"></image> |
|||
|
|||
</view> |
|||
</view> |
|||
<view class="pro-body"> |
|||
<view class="pro-body-p1"> |
|||
bonus: <span class="category-sigh">₦</span><span class="s1">0.00</span> |
|||
</view> |
|||
|
|||
<view class="pro-body-btn1" @click="appl=true,msShow=true"> |
|||
Apply to balance |
|||
</view> |
|||
|
|||
<view class="pro-body-lea"> |
|||
<view class="lea-item" v-for="(item,index) in proLeav" :key="item.id" @click=" leaIdChange(index)"> |
|||
<p :class="['p1', leaId==index?'on':'']">{{item.lea}}</p> |
|||
<p class="p2">{{item.lea2}}</p> |
|||
<p class="p3">{{item.leanum}}</p> |
|||
</view> |
|||
</view> |
|||
|
|||
<view class="pro-body-code"> |
|||
<view class="code-item1"> |
|||
<p class="p1" ref="">My Promotion Code</p> |
|||
<p class="p2">{{inviteCode}}</p> |
|||
</view> |
|||
<view class="code-item1"> |
|||
<p class="p1">My Promotion Link</p> |
|||
<p class="p2">{{copyText}}</p> |
|||
</view> |
|||
|
|||
<view class="code-btn" @click="copyTextMethod()"> |
|||
Copy |
|||
</view> |
|||
|
|||
|
|||
</view> |
|||
<cont></cont> |
|||
</view> |
|||
|
|||
<view class="invite-more" v-show="invMore"> |
|||
<view class="invite-con"> |
|||
<view class="more-a" @click="goProRe"> |
|||
promotion record |
|||
</view> |
|||
<view class="more-a"> |
|||
bonus record |
|||
</view> |
|||
<view class="more-a"> |
|||
apply record |
|||
</view> |
|||
</view> |
|||
<view class="invite-con2"> |
|||
<view class="more-a" @click="invMore=false,msShow=false"> |
|||
cancel |
|||
</view> |
|||
</view> |
|||
</view> |
|||
|
|||
|
|||
<view class="appl_Ba" v-show="appl"> |
|||
<view class="top"> |
|||
|
|||
|
|||
<view class="title"> |
|||
apply to balance |
|||
</view> |
|||
<view class="input"> |
|||
<input type="text" value="" placeholder="bonus" placeholder-style="color: #BFC2CCFF;font-size:28rpx;text-transform: capitalize"/> |
|||
</view> |
|||
<view class="all"> |
|||
Apply all |
|||
</view> |
|||
</view> |
|||
|
|||
<view class="btn_con"> |
|||
<view class="btn1" @click="appl=false,msShow=false"> |
|||
cancel |
|||
</view> |
|||
<view class="btn1 puple"> |
|||
confirm |
|||
</view> |
|||
</view> |
|||
</view> |
|||
<view class="msg-box-bg" v-show="msShow"> |
|||
</view> |
|||
</view> |
|||
|
|||
|
|||
</template> |
|||
|
|||
<script> |
|||
import cont from "@/components/cont/cont.vue" |
|||
export default { |
|||
data() { |
|||
return { |
|||
leaId:0, |
|||
proLeav:[ |
|||
{ |
|||
id:0, |
|||
lea:'level1', |
|||
lea2:'Total people', |
|||
leanum:0 |
|||
}, |
|||
{ |
|||
id:1, |
|||
lea:'level2', |
|||
lea2:'Contribution', |
|||
leanum:0.00 |
|||
}, |
|||
], |
|||
inviteCode:'', |
|||
copyText:'', |
|||
invMore:false, |
|||
appl:false, |
|||
msShow:false, |
|||
} |
|||
}, |
|||
onLoad() { |
|||
this.inviteCode=uni.getStorageSync('MyInfo').inviteCode; |
|||
this.copyText='http://www.ngnclub.vip/#/register?r_code='+this.inviteCode; |
|||
}, |
|||
methods: { |
|||
goProRe(){ |
|||
uni.navigateTo({ |
|||
url:'./promotionRecord/index' |
|||
}) |
|||
}, |
|||
copyTextMethod(){ |
|||
|
|||
this.$copyText(this.copyText).then(res => { |
|||
uni.showToast({ |
|||
title: 'Copy succeeded', |
|||
icon: 'success' |
|||
}) |
|||
}) |
|||
|
|||
// uni.setClipboardData({ |
|||
// data: this.copyText, |
|||
// success() { |
|||
// } |
|||
// }) |
|||
|
|||
}, |
|||
leaIdChange(index){ |
|||
this.leaId=index; |
|||
} |
|||
} |
|||
} |
|||
</script> |
|||
|
|||
<style> |
|||
@import url("./index.css"); |
|||
</style> |
|||
@ -0,0 +1,60 @@ |
|||
|
|||
.content{ |
|||
position: relative; |
|||
height: 1264rpx; |
|||
} |
|||
.prore_lev{ |
|||
display: flex; |
|||
justify-content: space-around; |
|||
align-items: center; |
|||
} |
|||
.level{ |
|||
color: #909399; |
|||
font-size: 32rpx; |
|||
line-height: 96rpx; |
|||
position: relative; |
|||
} |
|||
.level::after{ |
|||
content: ''; |
|||
width: 0%; |
|||
height: 4rpx; |
|||
border-radius: 4px; |
|||
background: #34026B; |
|||
position: absolute; |
|||
left: 50%; |
|||
bottom: 0px; |
|||
transform: translateX(-50%); |
|||
transition: all .5s; |
|||
} |
|||
.on{ |
|||
color: #34026B; |
|||
} |
|||
.on::after{ |
|||
width: 200rpx; |
|||
|
|||
} |
|||
.prore_body{ |
|||
position: relative; |
|||
} |
|||
|
|||
.noRes{ |
|||
position: absolute; |
|||
left: 50%; |
|||
top: 50%; |
|||
transform: translate(-50%,-50%); |
|||
} |
|||
.noRes .imgcon{ |
|||
width: 72rpx; |
|||
height: 72rpx; |
|||
margin: 0 auto; |
|||
} |
|||
.noRes .imgcon image{ |
|||
width: 100%; |
|||
height: 100%; |
|||
} |
|||
.noRes .res{ |
|||
text-align: center; |
|||
color: #BFC2CC; |
|||
font-size: 28rpx; |
|||
margin-top: 24rpx; |
|||
} |
|||
@ -0,0 +1,56 @@ |
|||
<template> |
|||
<view class="content"> |
|||
<navigation> |
|||
promotion record |
|||
</navigation> |
|||
<view class="prore_body"> |
|||
<view class="prore_lev"> |
|||
<view class="level on"> |
|||
level1 |
|||
</view> |
|||
<view class="level"> |
|||
level2 |
|||
</view> |
|||
</view> |
|||
|
|||
|
|||
</view> |
|||
<view class="noRes"> |
|||
<view class="imgcon"> |
|||
<image src="../../../static/promo/[email protected]" mode="aspectFit"></image> |
|||
</view> |
|||
<view class="res"> |
|||
No results |
|||
</view> |
|||
</view> |
|||
</view> |
|||
|
|||
</template> |
|||
|
|||
<script> |
|||
import api from '@/utils/api' |
|||
import utils from '@/utils' |
|||
import cont from "@/components/navigation/navigation.vue" |
|||
export default{ |
|||
data(){ |
|||
return{ |
|||
|
|||
} |
|||
}, |
|||
|
|||
onLoad() { |
|||
|
|||
|
|||
|
|||
|
|||
}, |
|||
methods:{ |
|||
|
|||
|
|||
}, |
|||
} |
|||
</script> |
|||
|
|||
<style> |
|||
@import './index.css'; |
|||
</style> |
|||
@ -0,0 +1,155 @@ |
|||
.bread{ |
|||
|
|||
} |
|||
.bread image{ |
|||
width: 28rpx; |
|||
height: 24rpx; |
|||
position: absolute; |
|||
right: 36rpx; |
|||
top: 50%; |
|||
transform: translateY(-50%); |
|||
} |
|||
.rech-body{ |
|||
padding: 0 36rpx; |
|||
} |
|||
.pro-body-p1{ |
|||
font-size: 22px; |
|||
color: #303133FF; |
|||
text-align: center; |
|||
padding: 30px 0; |
|||
text-transform: capitalize; |
|||
} |
|||
.category-sigh{ |
|||
font-size: 18px; |
|||
padding-left: 8px; |
|||
} |
|||
.pro-body-p1 .s1{ |
|||
font-family: 'din'; |
|||
padding-left: 4px; |
|||
vertical-align: bottom; |
|||
} |
|||
.input-item{ |
|||
position: relative; |
|||
height: 48px; |
|||
padding-left: 12px; |
|||
border-bottom: 1px solid #F4F5F7; |
|||
margin-bottom: 12px; |
|||
} |
|||
.input-item input{ |
|||
line-height: 96rpx; |
|||
width: 500rpx; |
|||
text-transform: capitalize; |
|||
font-size: 28rpx; |
|||
color: #303133FF; |
|||
} |
|||
.login-sigh{ |
|||
width: 110rpx; |
|||
position: relative; |
|||
} |
|||
|
|||
.login-sigh::before{ |
|||
content: ''; |
|||
width: 4rpx; |
|||
height: 26rpx; |
|||
background-color: #BFC2CCFF; |
|||
position: absolute; |
|||
right: 16rpx; |
|||
top: 50%; |
|||
transform: translateY(-50%); |
|||
} |
|||
.login-sigh2{ |
|||
width: 64rpx; |
|||
} |
|||
.login-sigh2::before{ |
|||
content: none; |
|||
} |
|||
.login-sigh .imgcon{ |
|||
width: 40rpx; |
|||
height: 40rpx; |
|||
} |
|||
.login-sigh .imgcon image{ |
|||
width: 100%; |
|||
height: 100%; |
|||
} |
|||
.login-sigh .quhao{ |
|||
font-size: 28rpx; |
|||
color: #303133FF; |
|||
} |
|||
.flex{ |
|||
display: flex; |
|||
align-items: center; |
|||
} |
|||
.rech-input-con{ |
|||
margin-top: 60rpx; |
|||
} |
|||
.rech-mount { |
|||
justify-content: space-between; |
|||
padding: 0 36rpx; |
|||
margin-top: 48rpx; |
|||
flex-wrap: wrap; |
|||
} |
|||
.mount{ |
|||
width: 210rpx; |
|||
line-height: 88rpx; |
|||
background: #FFFFFF; |
|||
border: 2rpx solid #EDEFF2; |
|||
opacity: 1; |
|||
border-radius: 16rpx; |
|||
font-size: 28rpx; |
|||
font-weight: 500; |
|||
color: #303133; |
|||
text-align: center; |
|||
margin-bottom: 24rpx; |
|||
} |
|||
.mount:hover{ |
|||
border-color: #34026BFF; |
|||
} |
|||
.rech-capy{ |
|||
margin-top: 25rpx; |
|||
padding: 0 36rpx; |
|||
} |
|||
.payment{ |
|||
font-size: 28rpx; |
|||
color: #909399; |
|||
text-transform: capitalize; |
|||
margin-bottom: 24rpx; |
|||
} |
|||
.capy{ |
|||
font-size: 32rpx; |
|||
color: #954DE3; |
|||
display: flex; |
|||
align-items: center; |
|||
} |
|||
.capy image{ |
|||
width: 34rpx; |
|||
height: 34rpx; |
|||
padding-right: 12rpx; |
|||
} |
|||
.rech-btn{ |
|||
margin-top: 58rpx; |
|||
line-height: 96rpx; |
|||
background: #34026B; |
|||
border-radius: 24rpx; |
|||
font-size: 28rpx; |
|||
font-weight: 400; |
|||
color: #FFFFFF; |
|||
text-transform: capitalize; |
|||
text-align: center; |
|||
} |
|||
.rech-btn-con{ |
|||
padding: 0 36rpx; |
|||
} |
|||
.content{ |
|||
padding-bottom: 170rpx; |
|||
} |
|||
|
|||
|
|||
.paymentType{ |
|||
display: flex; |
|||
justify-content: space-around; |
|||
align-items: center; |
|||
} |
|||
.payTypenName{ |
|||
text-transform: capitalize; |
|||
font-size: 32rpx; |
|||
} |
|||
@ -0,0 +1,271 @@ |
|||
<template> |
|||
<view class="content"> |
|||
<navigation> |
|||
Recharge |
|||
<view class="bread" slot="bread"> |
|||
<image src="../../static/promo/[email protected]" mode=""></image> |
|||
</view> |
|||
</navigation> |
|||
<view class="rech-body"> |
|||
<view class="pro-body-p1">Balance:<span data-v-642729fd="" class="category-sigh">₦</span><span |
|||
class="s1">385853.5</span></view> |
|||
<view class="input-item flex"> |
|||
<view class="login-sigh login-sigh2 flex"> |
|||
<view class="imgcon"> |
|||
<image src="../../static/login/[email protected]" mode=""></image> |
|||
</view> |
|||
</view> |
|||
<input type="text" value="" placeholder="Enter or Select Recharge Amount" |
|||
placeholder-style="color: #BFC2CCFF;font-size:14px;" v-model="tranAmt" /> |
|||
</view> |
|||
|
|||
<view class="rech-input-con"> |
|||
<!-- <view class="input-item flex"> |
|||
<input type="text" value="" placeholder="Name" |
|||
placeholder-style="color: #BFC2CCFF;font-size:14px;" /> |
|||
</view> --> |
|||
<view class="input-item flex"> |
|||
<view class="login-sigh flex"> |
|||
<span class="quhao">+{{areacode}}</span> |
|||
</view> |
|||
<input type="text" value="" placeholder="mobile number" |
|||
placeholder-style="color: #BFC2CCFF;font-size:14px;" v-model="mobile" /> |
|||
</view> |
|||
<!-- <view class="input-item flex"> |
|||
<input type="text" value="" placeholder="email" |
|||
placeholder-style="color: #BFC2CCFF;font-size:14px;" /> |
|||
</view> --> |
|||
</view> |
|||
|
|||
|
|||
</view> |
|||
|
|||
<view class="rech-mount flex"> |
|||
<view class="mount" v-for="(item,index) in recharge_amount" :key="item" @click="getMonVal(item)"> |
|||
₦ {{item}} |
|||
</view> |
|||
</view> |
|||
|
|||
<view class="rech-capy"> |
|||
<view class="payment"> |
|||
payment |
|||
</view> |
|||
<view class="paymentType"> |
|||
<view class="capy"> |
|||
|
|||
<image src="../../static/login/[email protected]" mode=""></image> |
|||
CPAY |
|||
</view> |
|||
|
|||
|
|||
<u-radio-group v-model="payType" @change="radioGroupChange" class="payTypenName"> |
|||
<u-radio @change="radioChange" v-for="(item, index) in paymentType" :key="index" |
|||
:name="item.payType" :disabled="item.disabled" active-color="#954DE3FF"> |
|||
{{item.payType}} |
|||
</u-radio> |
|||
</u-radio-group> |
|||
|
|||
</view> |
|||
</view> |
|||
<view class="rech-btn-con"> |
|||
<view class="rech-btn" @click="PayTo()"> |
|||
Confirm |
|||
</view> |
|||
</view> |
|||
</view> |
|||
|
|||
</template> |
|||
|
|||
<script> |
|||
import api from '@/utils/api' |
|||
import utils from '@/utils' |
|||
import cont from "@/components/navigation/navigation.vue" |
|||
export default { |
|||
data() { |
|||
return { |
|||
mobile:'', |
|||
areacode: '', |
|||
tranAmt: '', |
|||
rechangeInfo: [], |
|||
recharge_amount: [], |
|||
paymentType: [], |
|||
payType: '', |
|||
} |
|||
}, |
|||
|
|||
onLoad() { |
|||
|
|||
this.areacode = uni.getStorageSync('siteInfo').areaCode; |
|||
|
|||
uni.request({ |
|||
url: '/start/api/recharge/rechargeConfig', |
|||
data: { |
|||
"ticket": uni.getStorageSync('logInfo').data, |
|||
}, |
|||
header: { |
|||
'Content-Type': 'application/x-www-form-urlencoded;charset=utf-8' //自定义请求头信息 |
|||
}, |
|||
method: 'POST', //请求方式 或GET，必须为大写 |
|||
success: (res) => { |
|||
uni.setStorage({ |
|||
key: 'rechargeInfo', |
|||
data: res.data.data, |
|||
success: function() { |
|||
console.log('success') |
|||
} |
|||
}); |
|||
this.rechangeInfo = res.data.data; |
|||
this.recharge_amount = this.rechangeInfo.recharge_amount.split(','); |
|||
console.log(res.data, 9990); |
|||
|
|||
|
|||
}, |
|||
fail: (res) => { |
|||
|
|||
console.log(res.data); |
|||
} |
|||
}); |
|||
|
|||
uni.request({ |
|||
url: '/start/api/recharge/getPayType', |
|||
data: { |
|||
"ticket": uni.getStorageSync('logInfo').data, |
|||
}, |
|||
header: { |
|||
'Content-Type': 'application/x-www-form-urlencoded;charset=utf-8' //自定义请求头信息 |
|||
}, |
|||
method: 'POST', //请求方式 或GET，必须为大写 |
|||
success: (res) => { |
|||
this.paymentType = res.data.data; |
|||
console.log(res.data.data); |
|||
}, |
|||
fail: (res) => { |
|||
console.log(res.data); |
|||
} |
|||
}); |
|||
|
|||
}, |
|||
methods: { |
|||
PayTo(){ |
|||
if(this.payType==''){ |
|||
uni.showToast({ |
|||
title: 'Please choose the payment method', |
|||
icon: 'none', |
|||
duration: 1500 |
|||
}) |
|||
return; |
|||
} |
|||
if(this.mobile==''){ |
|||
uni.showToast({ |
|||
title: 'Please input mobile phone number', |
|||
icon: 'none', |
|||
duration: 1500 |
|||
}) |
|||
return; |
|||
} |
|||
if(this.tranAmt==''){ |
|||
uni.showToast({ |
|||
title: 'Please input recharge amount', |
|||
icon: 'none', |
|||
duration: 1500 |
|||
}) |
|||
return; |
|||
} |
|||
if(this.tranAmt<100){ |
|||
uni.showToast({ |
|||
title: 'Recharge amount cannot be less than 100', |
|||
icon: 'none', |
|||
duration: 1500 |
|||
}) |
|||
return; |
|||
} |
|||
uni.request({ |
|||
url: '/start/api/recharge/recharge', |
|||
data: { |
|||
"ticket": uni.getStorageSync('logInfo').data, |
|||
"payType":this.payType, |
|||
"tranAmt":this.tranAmt, |
|||
"mobile":this.mobile, |
|||
}, |
|||
header: { |
|||
'Content-Type': 'application/x-www-form-urlencoded;charset=utf-8' //自定义请求头信息 |
|||
}, |
|||
method: 'POST', //请求方式 或GET，必须为大写 |
|||
success: (res) => { |
|||
|
|||
if(res.data.errCode=='SUCCESS'){ |
|||
uni.request({ |
|||
url: '/start/api/recharge/toPay', |
|||
data: { |
|||
"ticket": uni.getStorageSync('logInfo').data, |
|||
'orderNo': res.data.data.orderNo, |
|||
}, |
|||
header: { |
|||
'Content-Type': 'application/x-www-form-urlencoded;charset=utf-8' //自定义请求头信息 |
|||
}, |
|||
method: 'POST', //请求方式 或GET，必须为大写 |
|||
success: (res) => { |
|||
if(res.data.data.code==1){ |
|||
uni.showToast({ |
|||
title: 'Recharge success', |
|||
icon: 'success', |
|||
duration: 1500 |
|||
}) |
|||
}else{ |
|||
uni.showToast({ |
|||
title: 'Payment failed', |
|||
icon: 'none', |
|||
duration: 1500 |
|||
}) |
|||
} |
|||
|
|||
console.log(res.data); |
|||
}, |
|||
fail: (res) => { |
|||
uni.showToast({ |
|||
title: res.data.errMsg, |
|||
icon: 'none', |
|||
duration: 1500 |
|||
}) |
|||
console.log(res.data); |
|||
}, |
|||
}); |
|||
}else{ |
|||
uni.showToast({ |
|||
title: res.data.errMsg, |
|||
icon: 'none', |
|||
duration: 1500 |
|||
}) |
|||
} |
|||
console.log(res.data,666666666); |
|||
console.log(res.data.data.orderNo,666666666); |
|||
}, |
|||
fail: (res) => { |
|||
uni.showToast({ |
|||
title: res.data.errMsg, |
|||
icon: 'none', |
|||
duration: 1500 |
|||
}) |
|||
console.log(res.data); |
|||
} |
|||
|
|||
}); |
|||
}, |
|||
radioChange(e) { |
|||
}, |
|||
// 选中任一radio时，由radio-group触发 |
|||
radioGroupChange(e) { |
|||
// console.log(e); |
|||
console.log(this.payType); |
|||
}, |
|||
getMonVal(m) { |
|||
this.tranAmt = m |
|||
} |
|||
|
|||
}, |
|||
} |
|||
</script> |
|||
|
|||
<style> |
|||
@import './index.css'; |
|||
</style> |
|||
@ -0,0 +1,65 @@ |
|||
<template> |
|||
<view class="content"> |
|||
<navigation> |
|||
Recharge rules |
|||
</navigation> |
|||
<view class="arcon" v-html="rechangeRule"> |
|||
</view> |
|||
</view> |
|||
|
|||
</template> |
|||
|
|||
<script> |
|||
import api from '@/utils/api' |
|||
import utils from '@/utils' |
|||
import cont from "@/components/navigation/navigation.vue" |
|||
export default{ |
|||
data(){ |
|||
return{ |
|||
rechangeRule:'' |
|||
} |
|||
}, |
|||
|
|||
onLoad() { |
|||
|
|||
uni.request({ |
|||
url: '/start/api/recharge/rechargeConfig', |
|||
data: { |
|||
"ticket": uni.getStorageSync('logInfo').data, |
|||
}, |
|||
header: { |
|||
'Content-Type': 'application/x-www-form-urlencoded;charset=utf-8' //自定义请求头信息 |
|||
}, |
|||
method: 'POST', //请求方式 或GET，必须为大写 |
|||
success: (res) => { |
|||
this.rechangeRule=res.data.data.tips; |
|||
|
|||
|
|||
}, |
|||
fail: (res) => { |
|||
|
|||
console.log(res.data); |
|||
} |
|||
}); |
|||
|
|||
|
|||
}, |
|||
methods:{ |
|||
|
|||
|
|||
}, |
|||
} |
|||
</script> |
|||
|
|||
<style> |
|||
.arcon{ |
|||
padding: 0 36rpx; |
|||
padding-top: 70rpx; |
|||
} |
|||
.record_body{ |
|||
color: #303133FF; |
|||
line-height: 48rpx; |
|||
font-size: 28rpx; |
|||
text-transform: capitalize; |
|||
} |
|||
</style> |
|||
@ -0,0 +1,30 @@ |
|||
.record_body{ |
|||
padding: 0 36rpx; |
|||
} |
|||
.flex{ |
|||
display: flex; |
|||
justify-content: space-between; |
|||
align-items: center; |
|||
} |
|||
.record_item{ |
|||
height: 144rpx; |
|||
} |
|||
.numcon .img1{ |
|||
width: 40rpx; |
|||
height: 40rpx; |
|||
} |
|||
.num{ |
|||
margin-left: 20rpx; |
|||
} |
|||
.rec{ |
|||
color: #303133; |
|||
font-size: 32rpx; |
|||
} |
|||
.cpay{ |
|||
color: #954DE3; |
|||
font-size: 28rpx; |
|||
} |
|||
.time{ |
|||
color: #909399; |
|||
font-size: 28rpx; |
|||
} |
|||
@ -0,0 +1,86 @@ |
|||
<template> |
|||
<view class="content"> |
|||
<navigation> |
|||
Recharge Record |
|||
</navigation> |
|||
<view class="record_body"> |
|||
<view class="record_item flex" v-for="(item,index) in record_list" :key="item.orderNo"> |
|||
<view class="numcon flex"> |
|||
<image src="../../../static/login/[email protected]" mode="aspectFit" class="img1"></image> |
|||
<view class="num"> |
|||
<view class="rec"> |
|||
{{item.tranAmt}} Wait |
|||
</view> |
|||
<view class="cpay"> |
|||
CPAY |
|||
</view> |
|||
</view> |
|||
</view> |
|||
<view class="time"> |
|||
{{item.addTime}} |
|||
</view> |
|||
</view> |
|||
</view> |
|||
|
|||
</view> |
|||
|
|||
</template> |
|||
|
|||
<script> |
|||
import api from '@/utils/api' |
|||
import utils from '@/utils' |
|||
import cont from "@/components/navigation/navigation.vue" |
|||
import index from '@/utils/index.js' |
|||
export default{ |
|||
data(){ |
|||
return{ |
|||
pageNumber:1, |
|||
pageSize:20, |
|||
record_list:[], |
|||
} |
|||
}, |
|||
|
|||
onLoad() { |
|||
|
|||
uni.request({ |
|||
url: '/start/api/recharge/rechargeList', |
|||
data: { |
|||
"ticket": uni.getStorageSync('logInfo').data, |
|||
"pageNumber":this.pageNumber, |
|||
"pageSize":this.pageSize, |
|||
}, |
|||
header: { |
|||
'Content-Type': 'application/x-www-form-urlencoded;charset=utf-8' //自定义请求头信息 |
|||
}, |
|||
method: 'POST', //请求方式 或GET，必须为大写 |
|||
success: (res) => { |
|||
this.record_list=res.data.data.content; |
|||
for(var i=0;i<this.record_list[i].addTime;i++){ |
|||
this.record_list[i].addTime=index.formatyymmddhhmmss(this.record_list[i].addTime); |
|||
} |
|||
console.log(res.data.data.content,999); |
|||
}, |
|||
fail: (res) => { |
|||
console.log(res); |
|||
} |
|||
}); |
|||
|
|||
setTimeout(function(){ |
|||
this.getCurrentTime(); |
|||
},2000) |
|||
|
|||
}, |
|||
methods:{ |
|||
getCurrentTime(){ |
|||
for(var i=0;i<record_list.length;i++){ |
|||
this.record_list[i].addTime=index.formathhmm(this.record_list[i].addTime); |
|||
} |
|||
} |
|||
|
|||
}, |
|||
} |
|||
</script> |
|||
|
|||
<style> |
|||
@import './index.css'; |
|||
</style> |
|||
@ -0,0 +1,130 @@ |
|||
|
|||
.flex{ |
|||
display: flex; |
|||
align-items: center; |
|||
} |
|||
.login-body{ |
|||
padding: 0 36rpx; |
|||
padding-top: 48rpx; |
|||
} |
|||
.input-item{ |
|||
position: relative; |
|||
height: 96rpx; |
|||
padding-left: 24rpx; |
|||
border-bottom: 2rpx solid #F4F5F7; |
|||
margin-bottom: 24rpx; |
|||
} |
|||
|
|||
.input-item input{ |
|||
line-height: 96rpx; |
|||
width: 500rpx; |
|||
font-size: 28rpx; |
|||
color: #303133FF; |
|||
} |
|||
.login-sigh{ |
|||
width: 172rpx; |
|||
position: relative; |
|||
} |
|||
|
|||
.login-sigh::before{ |
|||
content: ''; |
|||
width: 4rpx; |
|||
height: 26rpx; |
|||
background-color: #BFC2CCFF; |
|||
position: absolute; |
|||
right: 16rpx; |
|||
top: 50%; |
|||
transform: translateY(-50%); |
|||
} |
|||
.login-sigh3{ |
|||
align-items: center; |
|||
} |
|||
.login-sigh3 .img1{ |
|||
width: 180rpx; |
|||
height: 60rpx; |
|||
margin-right: 20rpx; |
|||
} |
|||
.login-sigh3 .img2{ |
|||
width: 24rpx; |
|||
height: 24rpx; |
|||
margin-right: 20rpx; |
|||
} |
|||
.login-sigh2{ |
|||
width: 64rpx; |
|||
} |
|||
.login-sigh2::before{ |
|||
content: none; |
|||
} |
|||
.login-sigh .imgcon{ |
|||
width: 40rpx; |
|||
height: 40rpx; |
|||
} |
|||
.login-sigh .imgcon image{ |
|||
width: 100%; |
|||
height: 100%; |
|||
} |
|||
.login-sigh .quhao{ |
|||
font-size: 28rpx; |
|||
color: #303133FF; |
|||
margin-left: 20rpx; |
|||
} |
|||
.rePass{ |
|||
color: #606266FF; |
|||
font-size: 28rpx; |
|||
float: right; |
|||
} |
|||
.login-btn{ |
|||
text-align: center; |
|||
line-height: 96rpx; |
|||
background: #34026B; |
|||
opacity: 0.2; |
|||
border-radius: 24rpx; |
|||
color: #fff; |
|||
margin-top: 120rpx; |
|||
} |
|||
.login-btnon{ |
|||
opacity: 1; |
|||
} |
|||
.login-re{ |
|||
width: auto; |
|||
display: table; |
|||
margin: 0 auto; |
|||
font-size: 14px; |
|||
font-weight: 400; |
|||
line-height: 27px; |
|||
color: #606266; |
|||
margin-top: 18px; |
|||
position: relative; |
|||
padding-right: 36rpx; |
|||
} |
|||
.login-re::before{ |
|||
content: ''; |
|||
width: 24rpx; |
|||
height: 24rpx; |
|||
background: url(../../static/login/top_icon_ins@2x.png)no-repeat; |
|||
background-size: contain; |
|||
position: absolute; |
|||
right: 0; |
|||
top: 50%; |
|||
transform: translateY(-50%); |
|||
} |
|||
.input-item input::-webkit-input-placeholder { |
|||
color: red; |
|||
} |
|||
.input-item input:-moz-placeholder { |
|||
color: red; |
|||
} |
|||
.input-item input:-ms-input-placeholder { |
|||
color: red; |
|||
} |
|||
.otp{ |
|||
width: 80rpx; |
|||
line-height: 40rpx; |
|||
border: 2rpx solid #954DE3FF; |
|||
border-radius: 8rpx; |
|||
text-align: center; |
|||
color:#954DE3FF ; |
|||
} |
|||
.input_pcod{ |
|||
padding-left: 20rpx; |
|||
} |
|||
@ -0,0 +1,260 @@ |
|||
<template> |
|||
<view class=""> |
|||
<navigation>Register</navigation> |
|||
<view class="login-body"> |
|||
<view class="input-item flex"> |
|||
<view class="login-sigh flex"> |
|||
<view class="imgcon"> |
|||
<image src="../../static/login/[email protected]" mode=""></image> |
|||
</view> |
|||
<span class="quhao">+{{areacode}}</span> |
|||
</view> |
|||
<input type="text" value="" @focus="btnNum=1" @blur="btnNum=0" placeholder="mobile number" placeholder-style="color: #BFC2CCFF;font-size:14px;text-transform: capitalize;" v-model="mobile"/> |
|||
</view> |
|||
<view class="input-item flex"> |
|||
<view class="login-sigh login-sigh2 flex"> |
|||
<view class="imgcon"> |
|||
<image src="../../static/login/[email protected]" mode=""></image> |
|||
</view> |
|||
</view> |
|||
<input class="input_pcod" @focus="btnNum=1" @blur="btnNum=0" value="" placeholder="Picture Code" placeholder-style="color: #BFC2CCFF;font-size:14px;text-transform: capitalize;" v-model="picCode"/> |
|||
<view class="login-sigh3 flex"> |
|||
<image :src="imgcodeUrl" mode="scaleToFill" class="img1"></image> |
|||
<image src="../../static/login/[email protected]" mode="" class="img2" @click="getPicCode()"></image> |
|||
</view> |
|||
|
|||
</view> |
|||
<view class="input-item flex"> |
|||
<view class="login-sigh login-sigh2 flex"> |
|||
<view class="imgcon"> |
|||
<image src="../../static/login/[email protected]" mode=""></image> |
|||
</view> |
|||
</view> |
|||
<input @focus="btnNum=1" @blur="btnNum=0" value="" placeholder="Verification code" placeholder-style="color: #BFC2CCFF;font-size:14px;text-transform: capitalize;" v-model="infoCode"/> |
|||
<view class="otp" @click="getInfoCode()"> |
|||
OTP |
|||
</view> |
|||
</view> |
|||
<view class="input-item flex"> |
|||
<view class="login-sigh login-sigh2 flex"> |
|||
<view class="imgcon"> |
|||
<image src="../../static/login/[email protected]" mode=""></image> |
|||
</view> |
|||
</view> |
|||
<input @focus="btnNum=1" @blur="btnNum=0" type="password" value="" placeholder="password" placeholder-style="color: #BFC2CCFF;font-size:14px;text-transform: capitalize;" v-model="password"/> |
|||
</view> |
|||
<view class="input-item flex"> |
|||
<view class="login-sigh login-sigh2 flex"> |
|||
<view class="imgcon"> |
|||
<image src="../../static/login/[email protected]" mode=""></image> |
|||
</view> |
|||
</view> |
|||
<input @focus="btnNum=1" @blur="btnNum=0" type="password" value="" placeholder="Confirm Password" placeholder-style="color: #BFC2CCFF;font-size:14px;text-transform: capitalize;" v-model="password2"/> |
|||
</view> |
|||
<view class="input-item flex"> |
|||
<view class="login-sigh login-sigh2 flex"> |
|||
<view class="imgcon"> |
|||
<image src="../../static/login/[email protected]" mode=""></image> |
|||
</view> |
|||
</view> |
|||
<input @focus="btnNum=1" @blur="btnNum=0" value="" placeholder="Invite code" placeholder-style="color: #BFC2CCFF;font-size:14px;" v-model="inviteCode"/> |
|||
</view> |
|||
<view class="login-btn" @click="regist()" :class="btnNum==1?'login-btnon':''"> |
|||
Register |
|||
</view> |
|||
<view class="login-re" @click="goLogin()"> |
|||
Login |
|||
</view> |
|||
</view> |
|||
</view> |
|||
</template> |
|||
|
|||
<script> |
|||
import api from '@/utils/api' |
|||
import utils from '@/utils' |
|||
import md5 from 'js-md5' |
|||
import store from '@/store' |
|||
import cont from "@/components/navigation/navigation.vue" |
|||
|
|||
export default{ |
|||
data(){ |
|||
return{ |
|||
mobile:'', |
|||
mark:'sms_user_register', |
|||
countryCode: '', |
|||
password:'', |
|||
password2:'', |
|||
inviteCode:'', |
|||
infoCode:'', |
|||
picCode:'', |
|||
imgcodeUrl: '', |
|||
btnNum:0, |
|||
rawData:'', |
|||
siteInfo:{}, |
|||
areacode:'' |
|||
} |
|||
}, |
|||
|
|||
onLoad() { |
|||
this.getPicCode(); |
|||
this.areacode=uni.getStorageSync('siteInfo').areaCode; |
|||
}, |
|||
methods:{ |
|||
goLogin(){ |
|||
uni.navigateTo({ |
|||
url:'../login/index' |
|||
}) |
|||
}, |
|||
checPas(){ |
|||
|
|||
}, |
|||
|
|||
getInfoCode(){ |
|||
|
|||
if(this.picCode==''){ |
|||
uni.showToast({ |
|||
title: 'The graphic verification code is empty', |
|||
icon: 'none', |
|||
duration: 1500 |
|||
}) |
|||
return; |
|||
} |
|||
|
|||
|
|||
this.countryCode= uni.getStorageSync('siteInfo').countryCode |
|||
uni.request({ |
|||
url: '/start/api/home/sendSmsCode', |
|||
data: { |
|||
"mobile":this.mobile, |
|||
"mark": this.mark, |
|||
"countryCode":this.countryCode, |
|||
"code": this.picCode |
|||
}, |
|||
header: { |
|||
'Content-Type': 'application/x-www-form-urlencoded;charset=utf-8' //自定义请求头信息 |
|||
}, |
|||
method:'POST',//请求方式 或GET，必须为大写 |
|||
success: (res) => { |
|||
uni.showToast({ |
|||
title: res.data.errMsg, |
|||
icon: 'none', |
|||
duration: 2500 |
|||
}) |
|||
console.log(res.data); |
|||
}, |
|||
fail:(res)=>{ |
|||
uni.showToast({ |
|||
title: res.data.errMsg, |
|||
icon: 'none', |
|||
duration: 2500 |
|||
}) |
|||
console.log(res.data); |
|||
} |
|||
}); |
|||
|
|||
|
|||
}, |
|||
|
|||
|
|||
|
|||
getPicCode(){ |
|||
this.imgcodeUrl ="/start/api/home/imgCode?uuid="+ this.$u.guid(20); |
|||
console.log(); |
|||
console.log(this.imgcodeUrl) |
|||
}, |
|||
regist() { |
|||
|
|||
var a= /^(?![0-9]+$)(?![a-zA-Z]+$)[0-9A-Za-z]{5,19}$/; |
|||
if(!a.test(this.password)){ |
|||
uni.showToast({ |
|||
title: 'Incorrect password format,a password requires a combination of numbers and letters', |
|||
icon: 'none', |
|||
duration: 1500 |
|||
}) |
|||
return; |
|||
} |
|||
if(this.password.length<6||this.password.length>20){ |
|||
uni.showToast({ |
|||
title: 'The login password requires 6-20 digits', |
|||
icon: 'none', |
|||
duration: 1500 |
|||
}) |
|||
return; |
|||
} |
|||
|
|||
if (this.inviteCode == '') { |
|||
uni.showToast({ |
|||
title: 'inviteCode Code is empty', |
|||
icon: 'none', |
|||
duration: 1500 |
|||
}) |
|||
return; |
|||
} |
|||
if (this.password == '' || this.password2 == '') { |
|||
uni.showToast({ |
|||
title: 'Password is empty', |
|||
icon: 'none', |
|||
duration: 1500 |
|||
}) |
|||
return; |
|||
} |
|||
|
|||
|
|||
if(this.password!=this.password2){ |
|||
uni.showToast({ |
|||
title: 'The two passwords are inconsistent', |
|||
icon: 'none', |
|||
duration: 1500 |
|||
}) |
|||
return; |
|||
} |
|||
|
|||
|
|||
uni.request({ |
|||
url: '/start/api/home/register', |
|||
data: { |
|||
"mobile":this.mobile, |
|||
'password': md5(this.password), |
|||
'inviteCode': this.inviteCode, |
|||
'code': this.infoCode, |
|||
|
|||
}, |
|||
header: { |
|||
'Content-Type': 'application/x-www-form-urlencoded;charset=utf-8' //自定义请求头信息 |
|||
}, |
|||
method:'POST',//请求方式 或GET，必须为大写 |
|||
success: (res) => { |
|||
uni.showToast({ |
|||
title: res.data.errMsg, |
|||
icon: 'none', |
|||
duration: 1500 |
|||
}) |
|||
setTimeout(function(){ |
|||
uni.reLaunch({ |
|||
url:'../login/index' |
|||
}) |
|||
},1500) |
|||
}, |
|||
fail:(res)=>{ |
|||
uni.showToast({ |
|||
title: res.data.errMsg, |
|||
icon: 'none', |
|||
duration: 1500 |
|||
}) |
|||
} |
|||
}); |
|||
|
|||
|
|||
}, |
|||
goLogin(){ |
|||
uni.reLaunch({ |
|||
url:'../login/index', |
|||
}) |
|||
} |
|||
}, |
|||
} |
|||
</script> |
|||
|
|||
<style> |
|||
@import './index.css'; |
|||
</style> |
|||
@ -0,0 +1,57 @@ |
|||
<template> |
|||
<view class="content"> |
|||
<navigation> |
|||
rules |
|||
</navigation> |
|||
<view class="arcon"> |
|||
|
|||
|
|||
<view class="record_body"> |
|||
A+ Plan is an lnternet online wealth manage ment product launched by NGNClub.NGNC lub users can transfer idle funds in NGNClu b account to A+ Plan to obtain daily income of 0.5% to 1%. For example, if you deposit 10,000 today, you will receive tomorrow 50 to100 income. The funds of A+ Plan can be tr ansferred in and out at any time without affe cting your use. You can choose to transfer t he account funds in to obtain income when you are not playing, such as when you are s leeping and resting |
|||
|
|||
</view> |
|||
<view class="record_body"> |
|||
Transfer-in amount: minimum 1000 naira<br> |
|||
Income settlement time: After midnight the n ext day |
|||
</view> |
|||
</view> |
|||
</view> |
|||
|
|||
</template> |
|||
|
|||
<script> |
|||
import api from '@/utils/api' |
|||
import utils from '@/utils' |
|||
import cont from "@/components/navigation/navigation.vue" |
|||
export default{ |
|||
data(){ |
|||
return{ |
|||
|
|||
} |
|||
}, |
|||
|
|||
onLoad() { |
|||
|
|||
|
|||
|
|||
|
|||
}, |
|||
methods:{ |
|||
|
|||
|
|||
}, |
|||
} |
|||
</script> |
|||
|
|||
<style> |
|||
.arcon{ |
|||
padding: 0 36rpx; |
|||
padding-top: 70rpx; |
|||
} |
|||
.record_body{ |
|||
color: #303133FF; |
|||
line-height: 48rpx; |
|||
font-size: 28rpx; |
|||
text-transform: capitalize; |
|||
} |
|||
</style> |
|||
@ -0,0 +1,64 @@ |
|||
|
|||
.ru-head{ |
|||
height: 108rpx; |
|||
background-color: #34026B; |
|||
position: relative; |
|||
padding: 0 36rpx; |
|||
} |
|||
.ru-imgcon{ |
|||
width: 44rpx; |
|||
height: 44rpx; |
|||
position: absolute; |
|||
left: 36rpx; |
|||
top: 50%; |
|||
transform: translateY(-50%); |
|||
} |
|||
.ru-imgcon image{ |
|||
width: 100%; |
|||
height: 100%; |
|||
} |
|||
.ru-body{ |
|||
padding: 0 36rpx; |
|||
padding-top: 48rpx; |
|||
} |
|||
.ru-body-p1{ |
|||
color: #303133FF; |
|||
font-size: 32rpx; |
|||
} |
|||
.ru-table{ |
|||
border: 2rpx solid #EDEFF2; |
|||
border-bottom: none; |
|||
border-collapse: collapse; |
|||
} |
|||
.ru-body-p1{ |
|||
font-size: 32rpx; |
|||
color: #303133FF; |
|||
text-transform: capitalize; |
|||
} |
|||
.ru-table{ |
|||
margin-top: 36rpx; |
|||
} |
|||
.ru-table tr{ |
|||
width: 100%; |
|||
display: block; |
|||
border-bottom: 2rpx solid #EDEFF2; |
|||
text-align: center; |
|||
line-height: 72rpx; |
|||
|
|||
} |
|||
.ru-table tbody{ |
|||
color: #909399FF; |
|||
} |
|||
.ru-table tr .t1{ |
|||
width: 200rpx; |
|||
border-right: 2rpx solid #EDEFF2; |
|||
} |
|||
.ru-table tr .t2{ |
|||
width: 476rpx; |
|||
} |
|||
.ru-cont{ |
|||
color: #303133FF; |
|||
font-size: 28rpx; |
|||
line-height: 54rpx; |
|||
padding: 48rpx 0; |
|||
} |
|||
@ -0,0 +1,55 @@ |
|||
<template> |
|||
<view class="content"> |
|||
<navigation>Rules</navigation> |
|||
<view class="p1" v-html="betting_rule"> |
|||
|
|||
</view> |
|||
|
|||
|
|||
</view> |
|||
|
|||
|
|||
|
|||
</template> |
|||
|
|||
<script> |
|||
import cont from "@/components/navigation/navigation.vue" |
|||
export default { |
|||
data() { |
|||
return { |
|||
betting_rule:'', |
|||
} |
|||
}, |
|||
onLoad(){ |
|||
uni.request({ |
|||
url: '/start/api/lottery/bettingConfig', |
|||
data: { |
|||
"ticket": uni.getStorageSync('logInfo').data, |
|||
}, |
|||
header: { |
|||
'Content-Type': 'application/x-www-form-urlencoded;charset=utf-8' //自定义请求头信息 |
|||
}, |
|||
method: 'POST', //请求方式 或GET，必须为大写 |
|||
success: (res) => { |
|||
this.betting_rule=res.data.data.tips; |
|||
}, |
|||
fail: (res) => { |
|||
console.log(res); |
|||
} |
|||
}); |
|||
}, |
|||
methods: { |
|||
|
|||
} |
|||
} |
|||
</script> |
|||
|
|||
<style> |
|||
.p1{ |
|||
padding: 70rpx 36rpx; |
|||
} |
|||
.v-card__text p{ |
|||
margin-left: 0 !important; |
|||
line-height: 60rpx !important; |
|||
} |
|||
</style> |
|||
@ -0,0 +1,64 @@ |
|||
|
|||
.ru-head{ |
|||
height: 108rpx; |
|||
background-color: #34026B; |
|||
position: relative; |
|||
padding: 0 36rpx; |
|||
} |
|||
.ru-imgcon{ |
|||
width: 44rpx; |
|||
height: 44rpx; |
|||
position: absolute; |
|||
left: 36rpx; |
|||
top: 50%; |
|||
transform: translateY(-50%); |
|||
} |
|||
.ru-imgcon image{ |
|||
width: 100%; |
|||
height: 100%; |
|||
} |
|||
.ru-body{ |
|||
padding: 0 36rpx; |
|||
padding-top: 48rpx; |
|||
} |
|||
.ru-body-p1{ |
|||
color: #303133FF; |
|||
font-size: 32rpx; |
|||
} |
|||
.ru-table{ |
|||
border: 2rpx solid #EDEFF2; |
|||
border-bottom: none; |
|||
border-collapse: collapse; |
|||
} |
|||
.ru-body-p1{ |
|||
font-size: 32rpx; |
|||
color: #303133FF; |
|||
text-transform: capitalize; |
|||
} |
|||
.ru-table{ |
|||
margin-top: 36rpx; |
|||
} |
|||
.ru-table tr{ |
|||
width: 100%; |
|||
display: block; |
|||
border-bottom: 2rpx solid #EDEFF2; |
|||
text-align: center; |
|||
line-height: 72rpx; |
|||
|
|||
} |
|||
.ru-table tbody{ |
|||
color: #909399FF; |
|||
} |
|||
.ru-table tr .t1{ |
|||
width: 200rpx; |
|||
border-right: 2rpx solid #EDEFF2; |
|||
} |
|||
.ru-table tr .t2{ |
|||
width: 476rpx; |
|||
} |
|||
.ru-cont{ |
|||
color: #303133FF; |
|||
font-size: 28rpx; |
|||
line-height: 54rpx; |
|||
padding: 48rpx 0; |
|||
} |
|||
@ -0,0 +1,62 @@ |
|||
<template> |
|||
<view class="content"> |
|||
<view class="ru-head"> |
|||
<view class="ru-imgcon"> |
|||
<image src="../../../static/home/[email protected]" mode=""></image> |
|||
</view> |
|||
</view> |
|||
|
|||
<view class="ru-body"> |
|||
<p class="ru-body-p1">platform agent rebate model</p> |
|||
<table class="ru-table"> |
|||
<thead> |
|||
<tr> |
|||
<th class="t1">level</th> |
|||
<th class="t2">Commission rate</th> |
|||
</tr> |
|||
</thead> |
|||
<tbody> |
|||
<tr> |
|||
<th class="t1">level 1</th> |
|||
<th class="t2">30%</th> |
|||
</tr> |
|||
<tr> |
|||
<th class="t1">level 1</th> |
|||
<th class="t2">30%</th> |
|||
</tr> |
|||
</tbody> |
|||
</table> |
|||
|
|||
|
|||
<view class="ru-cont"> |
|||
Members can become platform agents by recommending newcomers, and agents can get extra commissions The first-level user commission is 30% of the first-level user’s daily betting fee The second-level user commission is 20% of the second-level user’s daily betting fee Introduction to the second-level agent rebate: the second-level agent can get the commission reward of the second-level user, and the part other than the second- level user cannot get the commission. For example: You recommend 10 first-leve members as examples. Your first level members have 10 people in the first level and 100 people in the second level. The average bet per person per day is 1000H The commission rewards you will receive: |
|||
</view> |
|||
</view> |
|||
|
|||
|
|||
|
|||
</view> |
|||
|
|||
|
|||
|
|||
</template> |
|||
|
|||
<script> |
|||
export default { |
|||
data() { |
|||
return { |
|||
|
|||
} |
|||
}, |
|||
onLoad() { |
|||
|
|||
}, |
|||
methods: { |
|||
|
|||
} |
|||
} |
|||
</script> |
|||
|
|||
<style> |
|||
@import url("./index.css"); |
|||
</style> |
|||
@ -0,0 +1,144 @@ |
|||
.bread{ |
|||
|
|||
} |
|||
.bread image{ |
|||
width: 28rpx; |
|||
height: 24rpx; |
|||
position: absolute; |
|||
right: 36rpx; |
|||
top: 50%; |
|||
transform: translateY(-50%); |
|||
} |
|||
.rech-body{ |
|||
padding: 0 36rpx; |
|||
} |
|||
.pro-body-p1{ |
|||
font-size: 22px; |
|||
color: #303133FF; |
|||
text-align: center; |
|||
padding: 30px 0; |
|||
text-transform: capitalize; |
|||
} |
|||
.category-sigh{ |
|||
font-size: 18px; |
|||
padding-left: 8px; |
|||
} |
|||
.pro-body-p1 .s1{ |
|||
font-family: 'din'; |
|||
padding-left: 4px; |
|||
vertical-align: bottom; |
|||
} |
|||
.input-item{ |
|||
position: relative; |
|||
height: 48px; |
|||
padding-left: 12px; |
|||
border-bottom: 1px solid #F4F5F7; |
|||
margin-bottom: 12px; |
|||
} |
|||
.input-item input{ |
|||
line-height: 96rpx; |
|||
width: 500rpx; |
|||
text-transform: capitalize; |
|||
font-size: 28rpx; |
|||
color: #303133FF; |
|||
} |
|||
.login-sigh{ |
|||
width: 110rpx; |
|||
position: relative; |
|||
} |
|||
|
|||
.login-sigh::before{ |
|||
content: ''; |
|||
width: 4rpx; |
|||
height: 26rpx; |
|||
background-color: #BFC2CCFF; |
|||
position: absolute; |
|||
right: 16rpx; |
|||
top: 50%; |
|||
transform: translateY(-50%); |
|||
} |
|||
.login-sigh2{ |
|||
width: 64rpx; |
|||
} |
|||
.login-sigh2::before{ |
|||
content: none; |
|||
} |
|||
.login-sigh .imgcon{ |
|||
width: 40rpx; |
|||
height: 40rpx; |
|||
} |
|||
.login-sigh .imgcon image{ |
|||
width: 100%; |
|||
height: 100%; |
|||
} |
|||
.login-sigh .quhao{ |
|||
font-size: 28rpx; |
|||
color: #303133FF; |
|||
} |
|||
.flex{ |
|||
display: flex; |
|||
align-items: center; |
|||
} |
|||
.rech-input-con{ |
|||
margin-top: 60rpx; |
|||
} |
|||
.rech-mount { |
|||
justify-content: space-between; |
|||
padding: 0 36rpx; |
|||
margin-top: 48rpx; |
|||
flex-wrap: wrap; |
|||
} |
|||
.mount{ |
|||
width: 210rpx; |
|||
line-height: 88rpx; |
|||
background: #FFFFFF; |
|||
border: 2rpx solid #EDEFF2; |
|||
opacity: 1; |
|||
border-radius: 16rpx; |
|||
font-size: 28rpx; |
|||
font-weight: 500; |
|||
color: #303133; |
|||
text-align: center; |
|||
margin-bottom: 24rpx; |
|||
} |
|||
.mount:hover{ |
|||
border-color: #34026BFF; |
|||
} |
|||
.rech-capy{ |
|||
margin-top: 25rpx; |
|||
padding: 0 36rpx; |
|||
} |
|||
.payment{ |
|||
font-size: 28rpx; |
|||
color: #909399; |
|||
text-transform: capitalize; |
|||
margin-bottom: 24rpx; |
|||
} |
|||
.capy{ |
|||
font-size: 32rpx; |
|||
color: #954DE3; |
|||
display: flex; |
|||
align-items: center; |
|||
} |
|||
.capy image{ |
|||
width: 34rpx; |
|||
height: 34rpx; |
|||
padding-right: 12rpx; |
|||
} |
|||
.rech-btn{ |
|||
margin-top: 58rpx; |
|||
line-height: 96rpx; |
|||
background: #34026B; |
|||
border-radius: 24rpx; |
|||
font-size: 28rpx; |
|||
font-weight: 400; |
|||
color: #FFFFFF; |
|||
text-transform: capitalize; |
|||
text-align: center; |
|||
} |
|||
.rech-btn-con{ |
|||
padding: 0 36rpx; |
|||
} |
|||
.content{ |
|||
padding-bottom: 170rpx; |
|||
} |
|||
@ -0,0 +1,83 @@ |
|||
<template> |
|||
<view class="content"> |
|||
<navigation> |
|||
withdrawal |
|||
<view class="bread" slot="bread"> |
|||
<image src="../../static/promo/[email protected]" mode=""></image> |
|||
</view> |
|||
</navigation> |
|||
<view class="rech-body"> |
|||
<view class="pro-body-p1">Balance:<span data-v-642729fd="" class="category-sigh">₦</span><span class="s1">385853.5</span></view> |
|||
<view class="input-item flex"> |
|||
<view class="login-sigh login-sigh2 flex"> |
|||
<view class="imgcon"> |
|||
<image src="../../static/promo/[email protected]" mode="aspectFit"></image> |
|||
</view> |
|||
</view> |
|||
<input value="" placeholder="enter withdrawal amount" placeholder-style="color: #BFC2CCFF;font-size:14px;text-transform:capital"/> |
|||
</view> |
|||
<view class="rech-capy"> |
|||
<view class="payment"> |
|||
payment |
|||
</view> |
|||
<view class="capy"> |
|||
<image src="../../static/login/[email protected]" mode="" class="img1"></image> CPAY |
|||
</view> |
|||
</view> |
|||
<view class="rech-input-con"> |
|||
<view class="input-item flex"> |
|||
<input type="text" value="" placeholder="IFSC Code" placeholder-style="color: #BFC2CCFF;font-size:14px;"/> |
|||
</view> |
|||
<view class="input-item flex"> |
|||
<view class="login-sigh flex"> |
|||
<span class="quhao">+235</span> |
|||
</view> |
|||
<input type="text" value="" placeholder="mobile number" placeholder-style="color: #BFC2CCFF;font-size:14px;"/> |
|||
</view> |
|||
<view class="input-item flex"> |
|||
<input type="text" value="" placeholder="email" placeholder-style="color: #BFC2CCFF;font-size:14px;"/> |
|||
</view> |
|||
</view> |
|||
|
|||
|
|||
</view> |
|||
|
|||
|
|||
|
|||
|
|||
<view class="rech-btn-con"> |
|||
<view class="rech-btn"> |
|||
Withdrawal |
|||
</view> |
|||
</view> |
|||
</view> |
|||
|
|||
</template> |
|||
|
|||
<script> |
|||
import api from '@/utils/api' |
|||
import utils from '@/utils' |
|||
import cont from "@/components/navigation/navigation.vue" |
|||
export default{ |
|||
data(){ |
|||
return{ |
|||
|
|||
} |
|||
}, |
|||
|
|||
onLoad() { |
|||
|
|||
|
|||
|
|||
|
|||
}, |
|||
methods:{ |
|||
|
|||
|
|||
}, |
|||
} |
|||
</script> |
|||
|
|||
<style> |
|||
@import './index.css'; |
|||
</style> |
|||
@ -0,0 +1,124 @@ |
|||
<template> |
|||
<view class="content"> |
|||
<navigation> |
|||
transactions |
|||
<view class="bread" slot="bread"> |
|||
<image src="../../../static/promo/[email protected]" mode=""></image> |
|||
</view> |
|||
</navigation> |
|||
<view class="record_body"> |
|||
<view class="record_item flex"> |
|||
<view class="numcon flex"> |
|||
<image src="../../../static/promo/[email protected]" mode="aspectFit" class="img1"></image> |
|||
<view class="num"> |
|||
<view class="rec"> |
|||
Join period |
|||
</view> |
|||
<view class="cpay"> |
|||
2021-05-20 18:34:00 |
|||
</view> |
|||
</view> |
|||
</view> |
|||
<view class="time"> |
|||
-40.00 |
|||
</view> |
|||
</view> |
|||
</view> |
|||
</view> |
|||
|
|||
</template> |
|||
|
|||
<script> |
|||
import api from '@/utils/api' |
|||
import utils from '@/utils' |
|||
import cont from "@/components/navigation/navigation.vue" |
|||
import index from '@/utils/index' |
|||
export default{ |
|||
data(){ |
|||
return{ |
|||
pageNumber:1, |
|||
pageSize:20, |
|||
record_list:[], |
|||
} |
|||
}, |
|||
|
|||
onLoad() { |
|||
|
|||
uni.request({ |
|||
url: '/start/api/summary/billList', |
|||
data: { |
|||
"ticket": uni.getStorageSync('logInfo').data, |
|||
"pageNumber":this.pageNumber, |
|||
"pageSize":this.pageSize, |
|||
}, |
|||
header: { |
|||
'Content-Type': 'application/x-www-form-urlencoded;charset=utf-8' //自定义请求头信息 |
|||
}, |
|||
method: 'POST', //请求方式 或GET，必须为大写 |
|||
success: (res) => { |
|||
this.record_list=res.data.data.content; |
|||
console.log(res.data,9999); |
|||
}, |
|||
fail: (res) => { |
|||
console.log(res.errMsg); |
|||
} |
|||
}); |
|||
|
|||
setTimeout(function(){ |
|||
this.getCurrentTime |
|||
},2000) |
|||
|
|||
}, |
|||
methods:{ |
|||
getCurrentTime(){ |
|||
for(var i=0;i<record_list.length;i++){ |
|||
this.record_list[i].addTime=index.formathhmm(this.record_list[i].addTime); |
|||
} |
|||
} |
|||
|
|||
}, |
|||
|
|||
} |
|||
</script> |
|||
|
|||
<style> |
|||
.bread image{ |
|||
width: 28rpx; |
|||
height: 24rpx; |
|||
position: absolute; |
|||
right: 36rpx; |
|||
top: 50%; |
|||
transform: translateY(-50%); |
|||
} |
|||
.record_body{ |
|||
padding: 0 36rpx; |
|||
} |
|||
.flex{ |
|||
display: flex; |
|||
justify-content: space-between; |
|||
align-items: center; |
|||
} |
|||
.record_item{ |
|||
height: 144rpx; |
|||
} |
|||
.numcon .img1{ |
|||
width: 40rpx; |
|||
height: 40rpx; |
|||
} |
|||
.num{ |
|||
margin-left: 20rpx; |
|||
text-transform: capitalize; |
|||
} |
|||
.rec{ |
|||
color: #303133; |
|||
font-size: 32rpx; |
|||
} |
|||
.cpay{ |
|||
color: #909399; |
|||
font-size: 28rpx; |
|||
} |
|||
.time{ |
|||
color: #F25B5B; |
|||
font-size: 28rpx; |
|||
} |
|||
</style> |
|||
@ -0,0 +1,123 @@ |
|||
<template> |
|||
<view class="content"> |
|||
<navigation> |
|||
withdrawal |
|||
<view class="bread" slot="bread"> |
|||
<image src="../../../static/promo/[email protected]" mode=""></image> |
|||
</view> |
|||
</navigation> |
|||
<view class="record_body"> |
|||
<view class="record_item flex"> |
|||
<view class="numcon flex"> |
|||
<image src="../../../static/promo/[email protected]" mode="aspectFit" class="img1"></image> |
|||
<view class="num"> |
|||
<view class="rec"> |
|||
2,000.00 Wait |
|||
</view> |
|||
<view class="cpay"> |
|||
Back to balance |
|||
</view> |
|||
</view> |
|||
</view> |
|||
<view class="time"> |
|||
2021-05-26 14:35:20 |
|||
</view> |
|||
</view> |
|||
</view> |
|||
</view> |
|||
|
|||
</template> |
|||
|
|||
<script> |
|||
import api from '@/utils/api' |
|||
import utils from '@/utils' |
|||
import cont from "@/components/navigation/navigation.vue" |
|||
import index from '@/utils/index' |
|||
export default{ |
|||
data(){ |
|||
return{ |
|||
pageNumber:1, |
|||
pageSize:20, |
|||
record_list:[], |
|||
} |
|||
}, |
|||
|
|||
onLoad() { |
|||
|
|||
uni.request({ |
|||
url: '/start/api/withdraw/withdrawList', |
|||
data: { |
|||
"ticket": uni.getStorageSync('logInfo').data, |
|||
"pageNumber":this.pageNumber, |
|||
"pageSize":this.pageSize, |
|||
}, |
|||
header: { |
|||
'Content-Type': 'application/x-www-form-urlencoded;charset=utf-8' //自定义请求头信息 |
|||
}, |
|||
method: 'POST', //请求方式 或GET，必须为大写 |
|||
success: (res) => { |
|||
this.record_list=res.data.data.content; |
|||
console.log(res.data,9999); |
|||
}, |
|||
fail: (res) => { |
|||
console.log(res.errMsg); |
|||
} |
|||
}); |
|||
|
|||
setTimeout(function(){ |
|||
this.getCurrentTime |
|||
},2000) |
|||
|
|||
}, |
|||
methods:{ |
|||
getCurrentTime(){ |
|||
for(var i=0;i<record_list.length;i++){ |
|||
this.record_list[i].addTime=index.formathhmm(this.record_list[i].addTime); |
|||
} |
|||
} |
|||
|
|||
}, |
|||
|
|||
} |
|||
</script> |
|||
|
|||
<style> |
|||
.bread image{ |
|||
width: 28rpx; |
|||
height: 24rpx; |
|||
position: absolute; |
|||
right: 36rpx; |
|||
top: 50%; |
|||
transform: translateY(-50%); |
|||
} |
|||
.record_body{ |
|||
padding: 0 36rpx; |
|||
} |
|||
.flex{ |
|||
display: flex; |
|||
justify-content: space-between; |
|||
align-items: center; |
|||
} |
|||
.record_item{ |
|||
height: 144rpx; |
|||
} |
|||
.numcon .img1{ |
|||
width: 40rpx; |
|||
height: 40rpx; |
|||
} |
|||
.num{ |
|||
margin-left: 20rpx; |
|||
} |
|||
.rec{ |
|||
color: #303133; |
|||
font-size: 32rpx; |
|||
} |
|||
.cpay{ |
|||
color: #909399; |
|||
font-size: 28rpx; |
|||
} |
|||
.time{ |
|||
color: #909399; |
|||
font-size: 28rpx; |
|||
} |
|||
</style> |
|||
|
After Width: | Height: | Size: 1.3 KiB |
|
After Width: | Height: | Size: 1.2 KiB |
|
After Width: | Height: | Size: 1.2 KiB |
|
After Width: | Height: | Size: 1.6 KiB |
|
After Width: | Height: | Size: 1.3 KiB |
|
After Width: | Height: | Size: 1.6 KiB |
|
After Width: | Height: | Size: 3.1 KiB |
|
After Width: | Height: | Size: 3.0 KiB |
|
After Width: | Height: | Size: 1.4 KiB |
|
After Width: | Height: | Size: 2.5 KiB |
|
After Width: | Height: | Size: 1.7 KiB |
|
After Width: | Height: | Size: 562 B |
|
After Width: | Height: | Size: 561 B |
|
After Width: | Height: | Size: 530 B |
Binary file not shown.
|
After Width: | Height: | Size: 206 KiB |
|
After Width: | Height: | Size: 535 B |
|
After Width: | Height: | Size: 18 KiB |
|
After Width: | Height: | Size: 253 B |
|
After Width: | Height: | Size: 1.1 KiB |
|
After Width: | Height: | Size: 905 B |
|
After Width: | Height: | Size: 565 B |
|
After Width: | Height: | Size: 1.3 KiB |
|
After Width: | Height: | Size: 1.1 KiB |
|
After Width: | Height: | Size: 1.3 KiB |
|
After Width: | Height: | Size: 560 B |
|
After Width: | Height: | Size: 410 B |
|
After Width: | Height: | Size: 2.6 KiB |
|
After Width: | Height: | Size: 76 KiB |
|
After Width: | Height: | Size: 2.1 KiB |
|
After Width: | Height: | Size: 1.3 KiB |
|
After Width: | Height: | Size: 810 B |
|
After Width: | Height: | Size: 221 B |
|
After Width: | Height: | Size: 1.0 KiB |
|
After Width: | Height: | Size: 1011 B |
|
After Width: | Height: | Size: 1.2 KiB |
|
After Width: | Height: | Size: 1.1 KiB |
|
After Width: | Height: | Size: 567 B |
|
After Width: | Height: | Size: 599 B |
@ -0,0 +1,49 @@ |
|||
import Vue from 'vue' |
|||
import Vuex from 'vuex' |
|||
|
|||
Vue.use(Vuex) |
|||
|
|||
const store = new Vuex.Store({ |
|||
state: { |
|||
// 从本地缓存中同步获取指定 key 对应的内容。
|
|||
ticket: uni.getStorageSync('ticket') || '', |
|||
account: uni.getStorageSync('account') || '', |
|||
password: uni.getStorageSync('password') || '', |
|||
siteInfo: { |
|||
'id': '', |
|||
'userId': '', |
|||
'siteName': '', |
|||
'siteLogo': '', |
|||
'siteDomain': '', |
|||
'shortDomain': '', |
|||
'adminDomain': '', |
|||
'siteEmail': '', |
|||
'siteTelephone': '', |
|||
'siteMobile': '', |
|||
'siteWhatsapp': '', |
|||
'siteTelegram': '', |
|||
'corpName': '', |
|||
'corpAddress': '', |
|||
'status': '', |
|||
'serviceTime': '', |
|||
'countryCode': '', |
|||
'addTime': null, |
|||
'currencyCode': '', |
|||
'currencySymbol': '', |
|||
'areaCode': '', |
|||
'timeZone': null |
|||
} |
|||
}, |
|||
mutations: { |
|||
setTicket: (state, ticket) => { |
|||
const obj = state |
|||
obj.ticket = ticket |
|||
}, |
|||
setSiteInfo: (state, siteInfo) => { |
|||
const obj = state |
|||
obj.siteInfo = siteInfo |
|||
} |
|||
} |
|||
}) |
|||
|
|||
export default store |
|||
@ -0,0 +1,76 @@ |
|||
/** |
|||
* 这里是uni-app内置的常用样式变量 |
|||
* |
|||
* uni-app 官方扩展插件及插件市场（https://ext.dcloud.net.cn）上很多三方插件均使用了这些样式变量 |
|||
* 如果你是插件开发者，建议你使用scss预处理，并在插件代码中直接使用这些变量（无需 import 这个文件），方便用户通过搭积木的方式开发整体风格一致的App |
|||
* |
|||
*/ |
|||
|
|||
/** |
|||
* 如果你是App开发者（插件使用者），你可以通过修改这些变量来定制自己的插件主题，实现自定义主题功能 |
|||
* |
|||
* 如果你的项目同样使用了scss预处理，你也可以直接在你的 scss 代码中使用如下变量，同时无需 import 这个文件 |
|||
*/ |
|||
@import 'uview-ui/theme.scss'; |
|||
/* 颜色变量 */ |
|||
|
|||
/* 行为相关颜色 */ |
|||
$uni-color-primary: #007aff; |
|||
$uni-color-success: #4cd964; |
|||
$uni-color-warning: #f0ad4e; |
|||
$uni-color-error: #dd524d; |
|||
|
|||
/* 文字基本颜色 */ |
|||
$uni-text-color:#333;//基本色 |
|||
$uni-text-color-inverse:#fff;//反色 |
|||
$uni-text-color-grey:#999;//辅助灰色，如加载更多的提示信息 |
|||
$uni-text-color-placeholder: #808080; |
|||
$uni-text-color-disable:#c0c0c0; |
|||
|
|||
/* 背景颜色 */ |
|||
$uni-bg-color:#ffffff; |
|||
$uni-bg-color-grey:#f8f8f8; |
|||
$uni-bg-color-hover:#f1f1f1;//点击状态颜色 |
|||
$uni-bg-color-mask:rgba(0, 0, 0, 0.4);//遮罩颜色 |
|||
|
|||
/* 边框颜色 */ |
|||
$uni-border-color:#c8c7cc; |
|||
|
|||
/* 尺寸变量 */ |
|||
|
|||
/* 文字尺寸 */ |
|||
$uni-font-size-sm:24rpx; |
|||
$uni-font-size-base:28rpx; |
|||
$uni-font-size-lg:32rpx; |
|||
|
|||
/* 图片尺寸 */ |
|||
$uni-img-size-sm:40rpx; |
|||
$uni-img-size-base:52rpx; |
|||
$uni-img-size-lg:80rpx; |
|||
|
|||
/* Border Radius */ |
|||
$uni-border-radius-sm: 4rpx; |
|||
$uni-border-radius-base: 6rpx; |
|||
$uni-border-radius-lg: 12rpx; |
|||
$uni-border-radius-circle: 50%; |
|||
|
|||
/* 水平间距 */ |
|||
$uni-spacing-row-sm: 10px; |
|||
$uni-spacing-row-base: 20rpx; |
|||
$uni-spacing-row-lg: 30rpx; |
|||
|
|||
/* 垂直间距 */ |
|||
$uni-spacing-col-sm: 8rpx; |
|||
$uni-spacing-col-base: 16rpx; |
|||
$uni-spacing-col-lg: 24rpx; |
|||
|
|||
/* 透明度 */ |
|||
$uni-opacity-disabled: 0.3; // 组件禁用态的透明度 |
|||
|
|||
/* 文章场景相关 */ |
|||
$uni-color-title: #2C405A; // 文章标题颜色 |
|||
$uni-font-size-title:40rpx; |
|||
$uni-color-subtitle: #555555; // 二级标题颜色 |
|||
$uni-font-size-subtitle:36rpx; |
|||
$uni-color-paragraph: #3F536E; // 文章段落颜色 |
|||
$uni-font-size-paragraph:30rpx; |
|||
@ -0,0 +1,50 @@ |
|||
import Vue from 'vue'; |
|||
import qs from 'qs' |
|||
const api = { |
|||
//---------------------------------account---------------------------------
|
|||
siteInfo: () => Vue.prototype.$axios.get('/api/home/siteInfo'), |
|||
register: (params) => Vue.prototype.$axios.post('/api/home/register',params), |
|||
login: (params) => Vue.prototype.$axios.post('/api/user/login',params), |
|||
loginOut: (params) => Vue.prototype.$axios.post('/api/user/loginOut',params), |
|||
forgotPassword: (params) => Vue.prototype.$axios.post('/api/user/forgotPassword',params), |
|||
updatePassword: (params) => Vue.prototype.$axios.post('/api/user/updatePassword',params), |
|||
userInfo: (params) => Vue.prototype.$axios.post('/api/user/userInfo',params), |
|||
updateNickname: (params) => Vue.prototype.$axios.post('/api/user/updateNickname',params), |
|||
updateGender: (params) => Vue.prototype.$axios.post('/api/user/updateGender',params), |
|||
|
|||
|
|||
//--------------------------------- free ---------------------------------
|
|||
imgCode: () => Vue.prototype.$axios.get('/api/home/imgCode'), |
|||
sendSmsCode: (params) => Vue.prototype.$axios.post('/api/home/sendSmsCode',params), |
|||
|
|||
|
|||
//--------------------------------- bet ---------------------------------
|
|||
lotteryClassList: (params) => Vue.prototype.$axios.post('/api/lottery/lotteryClassList',params), |
|||
nextLotteryPeriod: (params) => Vue.prototype.$axios.post('/api/lottery/nextLotteryPeriod',params), |
|||
bettingConfig: (params) => Vue.prototype.$axios.post('/api/lottery/bettingConfig',params), |
|||
betting: (params) => Vue.prototype.$axios.post('/api/lottery/betting',params), |
|||
lotteryRecords: (params) => Vue.prototype.$axios.post('/api/lottery/lotteryRecords',params), |
|||
myLotteryRecords: (params) => Vue.prototype.$axios.post('/api/lottery/myLotteryRecords',params), |
|||
|
|||
|
|||
//--------------------------------- me ---------------------------------
|
|||
getPayType: (params) => Vue.prototype.$axios.post('/api/recharge/getPayType',params), |
|||
rechargeConfig: (params) => Vue.prototype.$axios.post('/api/recharge/rechargeConfig',params), |
|||
recharge: (params) => Vue.prototype.$axios.post('/api/recharge/recharge',params), |
|||
rechargeList: (params) => Vue.prototype.$axios.post('/api/recharge/rechargeList',params), |
|||
toPay: (params) => Vue.prototype.$axios.post('/api/recharge/toPay',params), |
|||
withdrawConfig: (params) => Vue.prototype.$axios.post('/api/withdraw/withdrawConfig',params), |
|||
withdrawServiceCharge: (params) => Vue.prototype.$axios.post('/api/withdraw/withdrawServiceCharge',params), |
|||
withdraw: (params) => Vue.prototype.$axios.post('/api/withdraw/withdraw',params), |
|||
withdrawList: (params) => Vue.prototype.$axios.post('/api/withdraw/withdrawList',params), |
|||
billList: (params) => Vue.prototype.$axios.post('/api/summary/billList',params), |
|||
|
|||
//--------------------------------- invite ---------------------------------
|
|||
inviteCode: (params) => Vue.prototype.$axios.post('/api/user/inviteCode',params), |
|||
bonusOut: (params) => Vue.prototype.$axios.post('/api/summary/bonusOut',params), |
|||
bonusOutRecords: (params) => Vue.prototype.$axios.post('/api/summary/bonusOutRecords',params), |
|||
|
|||
} |
|||
|
|||
|
|||
export default api |
|||
@ -0,0 +1,174 @@ |
|||
import Vue from 'vue' |
|||
import axios from 'axios' |
|||
import qs from 'qs' |
|||
import md5 from 'js-md5'; |
|||
import constant from './constant.js'; |
|||
|
|||
// #ifdef H5
|
|||
let baseURL = constant.H5 |
|||
let key = constant.H5_KEY |
|||
// #endif
|
|||
// #ifdef APP-PLUS
|
|||
let baseURL = constant.APP |
|||
let key = constant.APP_KEY |
|||
// #endif
|
|||
const service = axios.create({ |
|||
withCredentials: true, |
|||
crossDomain: true, |
|||
baseURL, |
|||
timeout: 160000 |
|||
}) |
|||
|
|||
// request拦截器,在请求之前做一些处理
|
|||
service.interceptors.request.use( |
|||
config => { |
|||
console.log('showDialog' + Vue.prototype.$showDialog) |
|||
if (Vue.prototype.$showDialog) { |
|||
uni.showLoading({ |
|||
title: 'loading', |
|||
mask: true |
|||
}) |
|||
} |
|||
// if (store.state.token) {
|
|||
// // 给请求头添加user-token
|
|||
// config.headers["user-token"] = store.state.token;
|
|||
// }
|
|||
// const ticket = Vue.prototype.$store.state.ticket
|
|||
// let dataStr=[];
|
|||
// if (config.method=='get') {
|
|||
// console.log(11111111111111)
|
|||
|
|||
// if(config.url.split('?').length>1){
|
|||
// dataStr=config.url.split('?')[1].split('&');
|
|||
// }
|
|||
|
|||
// }
|
|||
// if(config.method=='post'){
|
|||
// dataStr=qs.stringify(config.data).split('&');
|
|||
// }
|
|||
// console.log(dataStr);
|
|||
// config.data={};
|
|||
// dataStr.forEach(function(e){
|
|||
// config.data[e.split('=')[0]]=e.split('=')[1];
|
|||
// });
|
|||
// console.log(ticket)
|
|||
// if (ticket != '') {
|
|||
// config.data['ticket'] = ticket
|
|||
// }
|
|||
// var keys = [];
|
|||
// let sign='';
|
|||
// for (var k in config.data)
|
|||
// keys.push(k);
|
|||
// keys.sort(function(a,b){
|
|||
// return a<b?-1:1;
|
|||
// })
|
|||
// console.log("keys===========");
|
|||
|
|||
|
|||
// keys.forEach(function(e){
|
|||
|
|||
// if(config.data[e]||config.data[e]==''){
|
|||
// sign+=e+'='+config.data[e]+'&'
|
|||
// }
|
|||
|
|||
// });
|
|||
|
|||
// console.log("签名参数===========");
|
|||
// console.log(config.url);
|
|||
// console.log(sign + key);
|
|||
// sign= md5(sign + key);
|
|||
// console.log("提交参数===========");
|
|||
// console.log(qs.stringify(config.data));
|
|||
// if (config.method=='post') {
|
|||
// config.data['sign'] = sign
|
|||
// config.data = qs.stringify(config.data)
|
|||
// }
|
|||
// if (config.method=='get') {
|
|||
|
|||
// if (ticket != '') {
|
|||
// config.url = config.url + '&ticket=' + ticket + '&sign=' + sign
|
|||
// } else {
|
|||
// config.url = config.url + '&sign=' + sign
|
|||
// }
|
|||
// }
|
|||
// console.log(config)
|
|||
return config; |
|||
}, |
|||
error => { |
|||
console.log(error); // for debug
|
|||
return Promise.reject(error); |
|||
} |
|||
); |
|||
|
|||
//配置成功后的拦截器
|
|||
service.interceptors.response.use(res => { |
|||
uni.hideLoading() |
|||
// console.log(res)
|
|||
// console.log(res.data)
|
|||
// console.log(res.data.data[0].nameAlias)
|
|||
if (res.data.success || res.data.errCode === 'USER.0017') { |
|||
console.log(res.data.success) |
|||
return res.data |
|||
} else { |
|||
uni.showToast({ |
|||
title: res.data.errMsg, |
|||
icon:'none', |
|||
duration: 1500 |
|||
}) |
|||
if (res.data.errCode === 'USER.0010') { |
|||
// uni.removeStorage({
|
|||
// key: 'taskDivShow',
|
|||
// success: function (res) {
|
|||
// }
|
|||
// });
|
|||
uni.removeStorage({ |
|||
key: 'ticket', |
|||
success: function (res) { |
|||
uni.reLaunch({url: '/pages/login/index'}) |
|||
} |
|||
}); |
|||
} |
|||
uni.$emit('refreshQrCode') |
|||
return Promise.reject(res.data.errMsg); |
|||
} |
|||
}, error => { |
|||
return Promise.reject(error) |
|||
}) |
|||
|
|||
|
|||
axios.defaults.adapter = function(config) { //自己定义个适配器，用来适配uniapp的语法
|
|||
return new Promise((resolve, reject) => { |
|||
console.log(config) |
|||
var settle = require('axios/lib/core/settle'); |
|||
var buildURL = require('axios/lib/helpers/buildURL'); |
|||
uni.request({ |
|||
method: config.method.toUpperCase(), |
|||
url: config.baseURL + buildURL(config.url, config.params, config.paramsSerializer), |
|||
header: config.headers, |
|||
data: config.data, |
|||
dataType: config.dataType, |
|||
responseType: config.responseType, |
|||
sslVerify: config.sslVerify, |
|||
complete: function complete(response) { |
|||
console.log("执行完成：",config.baseURL + buildURL(config.url, config.params, config.paramsSerializer),response.data) |
|||
response = { |
|||
data: response.data, |
|||
status: response.statusCode, |
|||
errMsg: response.errMsg, |
|||
header: response.header, |
|||
config: config |
|||
}; |
|||
|
|||
settle(resolve, reject, response); |
|||
}, |
|||
fail:res =>{ |
|||
uni.showToast({ |
|||
title: res, |
|||
icon:'none', |
|||
duration: 1500 |
|||
}) |
|||
} |
|||
}) |
|||
}) |
|||
} |
|||
export default service |
|||
@ -0,0 +1,14 @@ |
|||
const H5 = '/start'; |
|||
const H5_KEY = 'key=wHoUuIiQ8rOSNrxzl1WZJSymZlmXMJ7w'; |
|||
|
|||
const APP = 'https://api.in-earn.co.ke'; //正式
|
|||
// const APP = 'https://apitest.luck-work.com'; //测试
|
|||
const APP_KEY = 'key=wHoUuIiQ8rOSNrxzl1WZJSymZlmXMJ7w'; |
|||
const showDialog = true |
|||
export default { |
|||
H5, |
|||
H5_KEY, |
|||
APP, |
|||
APP_KEY, |
|||
showDialog, |
|||
} |
|||
@ -0,0 +1,99 @@ |
|||
var utils = { |
|||
checkEmail: function(email) { |
|||
return RegExp( |
|||
/^([a-zA-Z0-9]+[_|\_|\.]?)*[a-zA-Z0-9]+@([a-zA-Z0-9]+[_|\_|\.]?)*[a-zA-Z0-9]+\.[a-zA-Z]{2,3}$/) |
|||
.test(email); |
|||
}, |
|||
checkMobile: function(mobile) { |
|||
return RegExp(/^1[34578]\d{9}$/).test(mobile); |
|||
}, |
|||
caculateTime: function(timeZome, time) { |
|||
return time + (timeZome * 1000 * 60 * 60); |
|||
}, |
|||
formatyymmdd: function(time) { |
|||
var date = new Date(time) |
|||
console.log(date,5555655) |
|||
var localTime = date.getTime(); |
|||
var localOffset = date.getTimezoneOffset() * 60000 //获得当地时间偏移的毫秒数
|
|||
var utc = localTime + localOffset //utc即GMT时间
|
|||
var offset = 8; //东8区
|
|||
var beijing = utc + (3600000 * offset); |
|||
date = new Date(beijing); |
|||
var Y = date.getFullYear() |
|||
var M = (date.getMonth() + 1 < 10 ? '0' + (date.getMonth() + 1) : date.getMonth() + 1) |
|||
var D = date.getDate() < 10 ? '0' + date.getDate() : date.getDate() |
|||
var h = date.getHours() < 10 ? '0' + date.getHours() : date.getHours() |
|||
var m = date.getMinutes() < 10 ? '0' + date.getMinutes() : date.getMinutes() |
|||
var s = date.getSeconds() < 10 ? '0' + date.getSeconds() : date.getSeconds() |
|||
console.log( M + '/' + D + '/' + Y,5454545454); |
|||
return M + '/' + D + '/' + Y; |
|||
|
|||
}, |
|||
formatyymmdd2: function(time) { |
|||
var date = new Date(time) |
|||
var localTime = date.getTime(); |
|||
var localOffset = date.getTimezoneOffset() * 60000 ; //获得当地时间偏移的毫秒数
|
|||
var utc = localTime + localOffset; //utc即GMT时间
|
|||
var offset = 8; //东8区
|
|||
var beijing = utc + (3600000 * offset); |
|||
date = new Date(beijing); |
|||
var Y = date.getFullYear() |
|||
var M = (date.getMonth() + 1 < 10 ? '0' + (date.getMonth() + 1) : date.getMonth() + 1) |
|||
var D = date.getDate() < 10 ? '0' + date.getDate() : date.getDate() |
|||
var h = date.getHours() < 10 ? '0' + date.getHours() : date.getHours() |
|||
var m = date.getMinutes() < 10 ? '0' + date.getMinutes() : date.getMinutes() |
|||
var s = date.getSeconds() < 10 ? '0' + date.getSeconds() : date.getSeconds() |
|||
return Y + M + D; |
|||
}, |
|||
formatyymmddhhmmss: function(time) { |
|||
var date = new Date(time) |
|||
var localTime = date.getTime() |
|||
var localOffset = date.getTimezoneOffset() * 60000 //获得当地时间偏移的毫秒数
|
|||
var utc = localTime + localOffset; //utc即GMT时间
|
|||
var offset = 8 //东8区
|
|||
var beijing = utc + (3600000 * offset); |
|||
date = new Date(beijing) |
|||
var Y = date.getFullYear() |
|||
var M = (date.getMonth() + 1 < 10 ? '0' + (date.getMonth() + 1) : date.getMonth() + 1) |
|||
var D = date.getDate() < 10 ? '0' + date.getDate() : date.getDate() |
|||
var h = date.getHours() < 10 ? '0' + date.getHours() : date.getHours() |
|||
var m = date.getMinutes() < 10 ? '0' + date.getMinutes() : date.getMinutes() |
|||
var s = date.getSeconds() < 10 ? '0' + date.getSeconds() : date.getSeconds() |
|||
return Y + '-' + M + '-' + D + ' ' + h + ':' + m + ':' + s; |
|||
}, |
|||
formathhmm: function(time) { |
|||
var date = new Date(time) |
|||
var localTime = date.getTime(); |
|||
var localOffset = date.getTimezoneOffset() * 60000 ; //获得当地时间偏移的毫秒数
|
|||
var utc = localTime + localOffset; //utc即GMT时间
|
|||
var offset = 8; //东8区
|
|||
var beijing = utc + (3600000 * offset); |
|||
date = new Date(beijing); |
|||
var Y = date.getFullYear() |
|||
var M = (date.getMonth() + 1 < 10 ? '0' + (date.getMonth() + 1) : date.getMonth() + 1) |
|||
var D = date.getDate() < 10 ? '0' + date.getDate() : date.getDate() |
|||
var h = date.getHours() < 10 ? '0' + date.getHours() : date.getHours() |
|||
var m = date.getMinutes() < 10 ? '0' + date.getMinutes() : date.getMinutes() |
|||
var s = date.getSeconds() < 10 ? '0' + date.getSeconds() : date.getSeconds() |
|||
return h + ':' + m; |
|||
}, |
|||
//客户端时间转换为北京时间
|
|||
getBeijingtime: function() { |
|||
//获得当前运行环境时间
|
|||
let d = new Date(); |
|||
let currentDate = new Date(); |
|||
let tmpHours = currentDate.getHours(); |
|||
//算得时区
|
|||
let time_zone = -d.getTimezoneOffset() / 60; |
|||
if (time_zone < 0) { |
|||
time_zone = Math.abs(time_zone) + 8; |
|||
currentDate.setHours(tmpHours + time_zone); |
|||
} else { |
|||
time_zone -= 8; |
|||
currentDate.setHours(tmpHours - time_zone); |
|||
} |
|||
return currentDate; |
|||
}, |
|||
} |
|||
|
|||
export default utils |
|||
@ -0,0 +1,6 @@ |
|||
// --color 相当于全局定义的一个css变量 |
|||
// var(--color) 用于引用 |
|||
// 在页面样式的引用中，你将会看到 |
|||
:root { |
|||
--mainColor: #0DA274; |
|||
} |
|||
@ -0,0 +1,5 @@ |
|||
import Tawk from 'vue-tawk' |
|||
import Vue from 'vue' |
|||
Vue.use(Tawk, { |
|||
tawkSrc: 'https://embed.tawk.to/603b78c91c1c2a130d63421b/1evk4vl4k' |
|||
}) |
|||
@ -0,0 +1,21 @@ |
|||
MIT License |
|||
|
|||
Copyright (c) 2020 www.uviewui.com |
|||
|
|||
Permission is hereby granted, free of charge, to any person obtaining a copy |
|||
of this software and associated documentation files (the "Software"), to deal |
|||
in the Software without restriction, including without limitation the rights |
|||
to use, copy, modify, merge, publish, distribute, sublicense, and/or sell |
|||
copies of the Software, and to permit persons to whom the Software is |
|||
furnished to do so, subject to the following conditions: |
|||
|
|||
The above copyright notice and this permission notice shall be included in all |
|||
copies or substantial portions of the Software. |
|||
|
|||
THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR |
|||
IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY, |
|||
FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE |
|||
AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER |
|||
LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, |
|||
OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE |
|||
SOFTWARE. |
|||
@ -0,0 +1,106 @@ |
|||
<p align="center"> |
|||
<img alt="logo" src="https://uviewui.com/common/logo.png" width="120" height="120" style="margin-bottom: 10px;"> |
|||
</p> |
|||
<h3 align="center" style="margin: 30px 0 30px;font-weight: bold;font-size:40px;">uView</h3> |
|||
<h3 align="center">多平台快速开发的UI框架</h3> |
|||
|
|||
|
|||
## 说明 |
|||
|
|||
uView UI，是[uni-app](https://uniapp.dcloud.io/)生态优秀的UI框架，全面的组件和便捷的工具会让您信手拈来，如鱼得水 |
|||
|
|||
## 特性 |
|||
|
|||
- 兼容安卓，iOS，微信小程序，H5，QQ小程序，百度小程序，支付宝小程序，头条小程序 |
|||
- 60+精选组件，功能丰富，多端兼容，让您快速集成，开箱即用 |
|||
- 众多贴心的JS利器，让您飞镖在手，召之即来，百步穿杨 |
|||
- 众多的常用页面和布局，让您专注逻辑，事半功倍 |
|||
- 详尽的文档支持，现代化的演示效果 |
|||
- 按需引入，精简打包体积 |
|||
|
|||
|
|||
## 安装 |
|||
|
|||
```bash |
|||
# npm方式安装 |
|||
npm i uview-ui |
|||
``` |
|||
|
|||
## 快速上手 |
|||
|
|||
1. `main.js`引入uView库 |
|||
```js |
|||
// main.js |
|||
import uView from 'uview-ui'; |
|||
Vue.use(uView); |
|||
``` |
|||
|
|||
2. `App.vue`引入基础样式(注意style标签需声明scss属性支持) |
|||
```css |
|||
/* App.vue */ |
|||
<style lang="scss"> |
|||
@import "uview-ui/index.scss"; |
|||
</style> |
|||
``` |
|||
|
|||
3. `uni.scss`引入全局scss变量文件 |
|||
```css |
|||
/* uni.scss */ |
|||
@import "uview-ui/theme.scss"; |
|||
``` |
|||
|
|||
4. `pages.json`配置easycom规则(按需引入) |
|||
|
|||
```js |
|||
// pages.json |
|||
{ |
|||
"easycom": { |
|||
// npm安装的方式不需要前面的"@/"，下载安装的方式需要"@/" |
|||
// npm安装方式 |
|||
"^u-(.*)": "uview-ui/components/u-$1/u-$1.vue" |
|||
// 下载安装方式 |
|||
// "^u-(.*)": "@/uview-ui/components/u-$1/u-$1.vue" |
|||
}, |
|||
// 此为本身已有的内容 |
|||
"pages": [ |
|||
// ...... |
|||
] |
|||
} |
|||
``` |
|||
|
|||
请通过[快速上手](https://uviewui.com/components/quickstart.html)了解更详细的内容 |
|||
|
|||
## 使用方法 |
|||
配置easycom规则后，自动按需引入，无需`import`组件，直接引用即可。 |
|||
|
|||
```html |
|||
<template> |
|||
<u-button>按钮</u-button> |
|||
</template> |
|||
``` |
|||
|
|||
请通过[快速上手](https://uviewui.com/components/quickstart.html)了解更详细的内容 |
|||
|
|||
## 链接 |
|||
|
|||
- [官方文档](https://uviewui.com/) |
|||
- [更新日志](https://uviewui.com/components/changelog.html) |
|||
- [升级指南](https://uviewui.com/components/changelog.html) |
|||
- [关于我们](https://uviewui.com/cooperation/about.html) |
|||
|
|||
## 预览 |
|||
|
|||
您可以通过**微信**扫码，查看最佳的演示效果。 |
|||
<br> |
|||
<br> |
|||
<img src="https://uviewui.com/common/weixin_mini_qrcode.png" width="220" height="220" > |
|||
|
|||
<!-- ## 捐赠uView的研发 |
|||
|
|||
uView文档和源码全部开源免费，如果您认为uView帮到了您的开发工作，您可以捐赠uView的研发工作，捐赠无门槛，哪怕是一杯可乐也好(相信这比打赏主播更有意义)。 |
|||
|
|||
<img src="https://uviewui.com/common/wechat.png" width="220" > |
|||
<img style="margin-left: 100px;" src="https://uviewui.com/common/alipay.png" width="220" > |
|||
--> |
|||
## 版权信息 |
|||
uView遵循[MIT](https://en.wikipedia.org/wiki/MIT_License)开源协议，意味着您无需支付任何费用，也无需授权，即可将uView应用到您的产品中。 |
|||
@ -0,0 +1,190 @@ |
|||
<template> |
|||
<u-popup mode="bottom" :border-radius="borderRadius" :popup="false" v-model="value" :maskCloseAble="maskCloseAble" |
|||
length="auto" :safeAreaInsetBottom="safeAreaInsetBottom" @close="popupClose" :z-index="uZIndex"> |
|||
<view class="u-tips u-border-bottom" v-if="tips.text" :style="[tipsStyle]"> |
|||
{{tips.text}} |
|||
</view> |
|||
<block v-for="(item, index) in list" :key="index"> |
|||
<view |
|||
@touchmove.stop.prevent |
|||
@tap="itemClick(index)" |
|||
:style="[itemStyle(index)]" |
|||
class="u-action-sheet-item u-line-1" |
|||
:class="[index < list.length - 1 ? 'u-border-bottom' : '']" |
|||
:hover-stay-time="150" |
|||
> |
|||
<text>{{item.text}}</text> |
|||
<text class="u-action-sheet-item__subtext u-line-1" v-if="item.subText">{{item.subText}}</text> |
|||
</view> |
|||
</block> |
|||
<view class="u-gab" v-if="cancelBtn"> |
|||
</view> |
|||
<view @touchmove.stop.prevent class="u-actionsheet-cancel u-action-sheet-item" hover-class="u-hover-class" |
|||
:hover-stay-time="150" v-if="cancelBtn" @tap="close">{{cancelText}}</view> |
|||
</u-popup> |
|||
</template> |
|||
|
|||
<script> |
|||
/** |
|||
* actionSheet 操作菜单 |
|||
* @description 本组件用于从底部弹出一个操作菜单，供用户选择并返回结果。本组件功能类似于uni的uni.showActionSheetAPI，配置更加灵活，所有平台都表现一致。 |
|||
* @tutorial https://www.uviewui.com/components/actionSheet.html |
|||
* @property {Array<Object>} list 按钮的文字数组，见官方文档示例 |
|||
* @property {Object} tips 顶部的提示文字，见官方文档示例 |
|||
* @property {String} cancel-text 取消按钮的提示文字 |
|||
* @property {Boolean} cancel-btn 是否显示底部的取消按钮（默认true） |
|||
* @property {Number String} border-radius 弹出部分顶部左右的圆角值，单位rpx（默认0） |
|||
* @property {Boolean} mask-close-able 点击遮罩是否可以关闭（默认true） |
|||
* @property {Boolean} safe-area-inset-bottom 是否开启底部安全区适配（默认false） |
|||
* @property {Number String} z-index z-index值（默认1075） |
|||
* @property {String} cancel-text 取消按钮的提示文字 |
|||
* @event {Function} click 点击ActionSheet列表项时触发 |
|||
* @event {Function} close 点击取消按钮时触发 |
|||
* @example <u-action-sheet :list="list" @click="click" v-model="show"></u-action-sheet> |
|||
*/ |
|||
export default { |
|||
name: "u-action-sheet", |
|||
props: { |
|||
// 点击遮罩是否可以关闭actionsheet |
|||
maskCloseAble: { |
|||
type: Boolean, |
|||
default: true |
|||
}, |
|||
// 按钮的文字数组，可以自定义颜色和字体大小，字体单位为rpx |
|||
list: { |
|||
type: Array, |
|||
default () { |
|||
// 如下 |
|||
// return [{ |
|||
// text: '确定', |
|||
// color: '', |
|||
// fontSize: '' |
|||
// }] |
|||
return []; |
|||
} |
|||
}, |
|||
// 顶部的提示文字 |
|||
tips: { |
|||
type: Object, |
|||
default () { |
|||
return { |
|||
text: '', |
|||
color: '', |
|||
fontSize: '26' |
|||
} |
|||
} |
|||
}, |
|||
// 底部的取消按钮 |
|||
cancelBtn: { |
|||
type: Boolean, |
|||
default: true |
|||
}, |
|||
// 是否开启底部安全区适配，开启的话，会在iPhoneX机型底部添加一定的内边距 |
|||
safeAreaInsetBottom: { |
|||
type: Boolean, |
|||
default: false |
|||
}, |
|||
// 通过双向绑定控制组件的弹出与收起 |
|||
value: { |
|||
type: Boolean, |
|||
default: false |
|||
}, |
|||
// 弹出的顶部圆角值 |
|||
borderRadius: { |
|||
type: [String, Number], |
|||
default: 0 |
|||
}, |
|||
// 弹出的z-index值 |
|||
zIndex: { |
|||
type: [String, Number], |
|||
default: 0 |
|||
}, |
|||
// 取消按钮的文字提示 |
|||
cancelText: { |
|||
type: String, |
|||
default: '取消' |
|||
} |
|||
}, |
|||
computed: { |
|||
// 顶部提示的样式 |
|||
tipsStyle() { |
|||
let style = {}; |
|||
if (this.tips.color) style.color = this.tips.color; |
|||
if (this.tips.fontSize) style.fontSize = this.tips.fontSize + 'rpx'; |
|||
return style; |
|||
}, |
|||
// 操作项目的样式 |
|||
itemStyle() { |
|||
return (index) => { |
|||
let style = {}; |
|||
if (this.list[index].color) style.color = this.list[index].color; |
|||
if (this.list[index].fontSize) style.fontSize = this.list[index].fontSize + 'rpx'; |
|||
// 选项被禁用的样式 |
|||
if (this.list[index].disabled) style.color = '#c0c4cc'; |
|||
return style; |
|||
} |
|||
}, |
|||
uZIndex() { |
|||
// 如果用户有传递z-index值，优先使用 |
|||
return this.zIndex ? this.zIndex : this.$u.zIndex.popup; |
|||
} |
|||
}, |
|||
methods: { |
|||
// 点击取消按钮 |
|||
close() { |
|||
// 发送input事件，并不会作用于父组件，而是要设置组件内部通过props传递的value参数 |
|||
// 这是一个vue发送事件的特殊用法 |
|||
this.popupClose(); |
|||
this.$emit('close'); |
|||
}, |
|||
// 弹窗关闭 |
|||
popupClose() { |
|||
this.$emit('input', false); |
|||
}, |
|||
// 点击某一个item |
|||
itemClick(index) { |
|||
// disabled的项禁止点击 |
|||
if(this.list[index].disabled) return; |
|||
this.$emit('click', index); |
|||
this.$emit('input', false); |
|||
} |
|||
} |
|||
} |
|||
</script> |
|||
|
|||
<style lang="scss" scoped> |
|||
@import "../../libs/css/style.components.scss"; |
|||
|
|||
.u-tips { |
|||
font-size: 26rpx; |
|||
text-align: center; |
|||
padding: 34rpx 0; |
|||
line-height: 1; |
|||
color: $u-tips-color; |
|||
} |
|||
|
|||
.u-action-sheet-item { |
|||
@include vue-flex;; |
|||
line-height: 1; |
|||
justify-content: center; |
|||
align-items: center; |
|||
font-size: 32rpx; |
|||
padding: 34rpx 0; |
|||
flex-direction: column; |
|||
} |
|||
|
|||
.u-action-sheet-item__subtext { |
|||
font-size: 24rpx; |
|||
color: $u-tips-color; |
|||
margin-top: 20rpx; |
|||
} |
|||
|
|||
.u-gab { |
|||
height: 12rpx; |
|||
background-color: rgb(234, 234, 236); |
|||
} |
|||
|
|||
.u-actionsheet-cancel { |
|||
color: $u-main-color; |
|||
} |
|||
</style> |
|||
@ -0,0 +1,256 @@ |
|||
<template> |
|||
<view class="u-alert-tips" v-if="show" :class="[ |
|||
!show ? 'u-close-alert-tips': '', |
|||
type ? 'u-alert-tips--bg--' + type + '-light' : '', |
|||
type ? 'u-alert-tips--border--' + type + '-disabled' : '', |
|||
]" :style="{ |
|||
backgroundColor: bgColor, |
|||
borderColor: borderColor |
|||
}"> |
|||
<view class="u-icon-wrap"> |
|||
<u-icon v-if="showIcon" :name="uIcon" :size="description ? 40 : 32" class="u-icon" :color="uIconType" :custom-style="iconStyle"></u-icon> |
|||
</view> |
|||
<view class="u-alert-content" @tap.stop="click"> |
|||
<view class="u-alert-title" :style="[uTitleStyle]"> |
|||
{{title}} |
|||
</view> |
|||
<view v-if="description" class="u-alert-desc" :style="[descStyle]"> |
|||
{{description}} |
|||
</view> |
|||
</view> |
|||
<view class="u-icon-wrap"> |
|||
<u-icon @click="close" v-if="closeAble && !closeText" hoverClass="u-type-error-hover-color" name="close" color="#c0c4cc" |
|||
:size="22" class="u-close-icon" :style="{ |
|||
top: description ? '18rpx' : '24rpx' |
|||
}"></u-icon> |
|||
</view> |
|||
<text v-if="closeAble && closeText" class="u-close-text" :style="{ |
|||
top: description ? '18rpx' : '24rpx' |
|||
}">{{closeText}}</text> |
|||
</view> |
|||
</template> |
|||
|
|||
<script> |
|||
/** |
|||
* alertTips 警告提示 |
|||
* @description 警告提示，展现需要关注的信息 |
|||
* @tutorial https://uviewui.com/components/alertTips.html |
|||
* @property {String} title 显示的标题文字 |
|||
* @property {String} description 辅助性文字，颜色比title浅一点，字号也小一点，可选 |
|||
* @property {String} type 关闭按钮(默认为叉号icon图标) |
|||
* @property {String} icon 图标名称 |
|||
* @property {Object} icon-style 图标的样式，对象形式 |
|||
* @property {Object} title-style 标题的样式，对象形式 |
|||
* @property {Object} desc-style 描述的样式，对象形式 |
|||
* @property {String} close-able 用文字替代关闭图标，close-able为true时有效 |
|||
* @property {Boolean} show-icon 是否显示左边的辅助图标 |
|||
* @property {Boolean} show 显示或隐藏组件 |
|||
* @event {Function} click 点击组件时触发 |
|||
* @event {Function} close 点击关闭按钮时触发 |
|||
*/ |
|||
export default { |
|||
name: 'u-alert-tips', |
|||
props: { |
|||
// 显示文字 |
|||
title: { |
|||
type: String, |
|||
default: '' |
|||
}, |
|||
// 主题，success/warning/info/error |
|||
type: { |
|||
type: String, |
|||
default: 'warning' |
|||
}, |
|||
// 辅助性文字 |
|||
description: { |
|||
type: String, |
|||
default: '' |
|||
}, |
|||
// 是否可关闭 |
|||
closeAble: { |
|||
type: Boolean, |
|||
default: false |
|||
}, |
|||
// 关闭按钮自定义文本 |
|||
closeText: { |
|||
type: String, |
|||
default: '' |
|||
}, |
|||
// 是否显示图标 |
|||
showIcon: { |
|||
type: Boolean, |
|||
default: false |
|||
}, |
|||
// 文字颜色，如果定义了color值，icon会失效 |
|||
color: { |
|||
type: String, |
|||
default: '' |
|||
}, |
|||
// 背景颜色 |
|||
bgColor: { |
|||
type: String, |
|||
default: '' |
|||
}, |
|||
// 边框颜色 |
|||
borderColor: { |
|||
type: String, |
|||
default: '' |
|||
}, |
|||
// 是否显示 |
|||
show: { |
|||
type: Boolean, |
|||
default: true |
|||
}, |
|||
// 左边显示的icon |
|||
icon: { |
|||
type: String, |
|||
default: '' |
|||
}, |
|||
// icon的样式 |
|||
iconStyle: { |
|||
type: Object, |
|||
default() { |
|||
return {} |
|||
} |
|||
}, |
|||
// 标题的样式 |
|||
titleStyle: { |
|||
type: Object, |
|||
default() { |
|||
return {} |
|||
} |
|||
}, |
|||
// 描述文字的样式 |
|||
descStyle: { |
|||
type: Object, |
|||
default() { |
|||
return {} |
|||
} |
|||
}, |
|||
}, |
|||
data() { |
|||
return { |
|||
} |
|||
}, |
|||
computed: { |
|||
uTitleStyle() { |
|||
let style = {}; |
|||
// 如果有描述文字的话，标题进行加粗 |
|||
style.fontWeight = this.description ? 500 : 'normal'; |
|||
// 将用户传入样式对象和style合并，传入的优先级比style高，同属性会被覆盖 |
|||
return this.$u.deepMerge(style, this.titleStyle); |
|||
}, |
|||
uIcon() { |
|||
// 如果有设置icon名称就使用，否则根据type主题，推定一个默认的图标 |
|||
return this.icon ? this.icon : this.$u.type2icon(this.type); |
|||
}, |
|||
uIconType() { |
|||
// 如果有设置图标的样式，优先使用，没有的话，则用type的样式 |
|||
return Object.keys(this.iconStyle).length ? '' : this.type; |
|||
} |
|||
}, |
|||
methods: { |
|||
// 点击内容 |
|||
click() { |
|||
this.$emit('click'); |
|||
}, |
|||
// 点击关闭按钮 |
|||
close() { |
|||
this.$emit('close'); |
|||
} |
|||
} |
|||
} |
|||
</script> |
|||
|
|||
<style lang="scss" scoped> |
|||
@import "../../libs/css/style.components.scss"; |
|||
|
|||
.u-alert-tips { |
|||
@include vue-flex; |
|||
align-items: center; |
|||
padding: 16rpx 30rpx; |
|||
border-radius: 8rpx; |
|||
position: relative; |
|||
transition: all 0.3s linear; |
|||
border: 1px solid #fff; |
|||
|
|||
&--bg--primary-light { |
|||
background-color: $u-type-primary-light; |
|||
} |
|||
|
|||
&--bg--info-light { |
|||
background-color: $u-type-info-light; |
|||
} |
|||
|
|||
&--bg--success-light { |
|||
background-color: $u-type-success-light; |
|||
} |
|||
|
|||
&--bg--warning-light { |
|||
background-color: $u-type-warning-light; |
|||
} |
|||
|
|||
&--bg--error-light { |
|||
background-color: $u-type-error-light; |
|||
} |
|||
|
|||
&--border--primary-disabled { |
|||
border-color: $u-type-primary-disabled; |
|||
} |
|||
|
|||
&--border--success-disabled { |
|||
border-color: $u-type-success-disabled; |
|||
} |
|||
|
|||
&--border--error-disabled { |
|||
border-color: $u-type-error-disabled; |
|||
} |
|||
|
|||
&--border--warning-disabled { |
|||
border-color: $u-type-warning-disabled; |
|||
} |
|||
|
|||
&--border--info-disabled { |
|||
border-color: $u-type-info-disabled; |
|||
} |
|||
} |
|||
|
|||
.u-close-alert-tips { |
|||
opacity: 0; |
|||
visibility: hidden; |
|||
} |
|||
|
|||
.u-icon { |
|||
margin-right: 16rpx; |
|||
} |
|||
|
|||
.u-alert-title { |
|||
font-size: 28rpx; |
|||
color: $u-main-color; |
|||
} |
|||
|
|||
.u-alert-desc { |
|||
font-size: 26rpx; |
|||
text-align: left; |
|||
color: $u-content-color; |
|||
} |
|||
|
|||
.u-close-icon { |
|||
position: absolute; |
|||
top: 20rpx; |
|||
right: 20rpx; |
|||
} |
|||
|
|||
.u-close-hover { |
|||
color: red; |
|||
} |
|||
|
|||
.u-close-text { |
|||
font-size: 24rpx; |
|||
color: $u-tips-color; |
|||
position: absolute; |
|||
top: 20rpx; |
|||
right: 20rpx; |
|||
line-height: 1; |
|||
} |
|||
</style> |
|||
@ -0,0 +1,290 @@ |
|||
<template> |
|||
<view class="content"> |
|||
<view class="cropper-wrapper" :style="{ height: cropperOpt.height + 'px' }"> |
|||
<canvas |
|||
class="cropper" |
|||
:disable-scroll="true" |
|||
@touchstart="touchStart" |
|||
@touchmove="touchMove" |
|||
@touchend="touchEnd" |
|||
:style="{ width: cropperOpt.width, height: cropperOpt.height, backgroundColor: 'rgba(0, 0, 0, 0.8)' }" |
|||
canvas-id="cropper" |
|||
id="cropper" |
|||
></canvas> |
|||
<canvas |
|||
class="cropper" |
|||
:disable-scroll="true" |
|||
:style="{ |
|||
position: 'fixed', |
|||
top: `-${cropperOpt.width * cropperOpt.pixelRatio}px`, |
|||
left: `-${cropperOpt.height * cropperOpt.pixelRatio}px`, |
|||
width: `${cropperOpt.width * cropperOpt.pixelRatio}px`, |
|||
height: `${cropperOpt.height * cropperOpt.pixelRatio}` |
|||
}" |
|||
canvas-id="targetId" |
|||
id="targetId" |
|||
></canvas> |
|||
</view> |
|||
<view class="cropper-buttons safe-area-padding" :style="{ height: bottomNavHeight + 'px' }"> |
|||
<!-- #ifdef H5 --> |
|||
<view class="upload" @tap="uploadTap">选择图片</view> |
|||
<!-- #endif --> |
|||
<!-- #ifndef H5 --> |
|||
<view class="upload" @tap="uploadTap">重新选择</view> |
|||
<!-- #endif --> |
|||
<view class="getCropperImage" @tap="getCropperImage(false)">确定</view> |
|||
</view> |
|||
</view> |
|||
</template> |
|||
|
|||
<script> |
|||
import WeCropper from './weCropper.js'; |
|||
export default { |
|||
props: { |
|||
// 裁剪矩形框的样式，其中可包含的属性为lineWidth-边框宽度(单位rpx)，color: 边框颜色， |
|||
// mask-遮罩颜色，一般设置为一个rgba的透明度，如"rgba(0, 0, 0, 0.35)" |
|||
boundStyle: { |
|||
type: Object, |
|||
default() { |
|||
return { |
|||
lineWidth: 4, |
|||
borderColor: 'rgb(245, 245, 245)', |
|||
mask: 'rgba(0, 0, 0, 0.35)' |
|||
}; |
|||
} |
|||
} |
|||
// // 裁剪框宽度，单位rpx |
|||
// rectWidth: { |
|||
// type: [String, Number], |
|||
// default: 400 |
|||
// }, |
|||
// // 裁剪框高度，单位rpx |
|||
// rectHeight: { |
|||
// type: [String, Number], |
|||
// default: 400 |
|||
// }, |
|||
// // 输出图片宽度，单位rpx |
|||
// destWidth: { |
|||
// type: [String, Number], |
|||
// default: 400 |
|||
// }, |
|||
// // 输出图片高度，单位rpx |
|||
// destHeight: { |
|||
// type: [String, Number], |
|||
// default: 400 |
|||
// }, |
|||
// // 输出的图片类型，如果发现裁剪的图片很大，可能是因为设置为了"png"，改成"jpg"即可 |
|||
// fileType: { |
|||
// type: String, |
|||
// default: 'jpg', |
|||
// }, |
|||
// // 生成的图片质量 |
|||
// // H5上无效，目前不考虑使用此参数 |
|||
// quality: { |
|||
// type: [Number, String], |
|||
// default: 1 |
|||
// } |
|||
}, |
|||
data() { |
|||
return { |
|||
// 底部导航的高度 |
|||
bottomNavHeight: 50, |
|||
originWidth: 200, |
|||
width: 0, |
|||
height: 0, |
|||
cropperOpt: { |
|||
id: 'cropper', |
|||
targetId: 'targetCropper', |
|||
pixelRatio: 1, |
|||
width: 0, |
|||
height: 0, |
|||
scale: 2.5, |
|||
zoom: 8, |
|||
cut: { |
|||
x: (this.width - this.originWidth) / 2, |
|||
y: (this.height - this.originWidth) / 2, |
|||
width: this.originWidth, |
|||
height: this.originWidth |
|||
}, |
|||
boundStyle: { |
|||
lineWidth: uni.upx2px(this.boundStyle.lineWidth), |
|||
mask: this.boundStyle.mask, |
|||
color: this.boundStyle.borderColor |
|||
} |
|||
}, |
|||
// 裁剪框和输出图片的尺寸，高度默认等于宽度 |
|||
// 输出图片宽度，单位px |
|||
destWidth: 200, |
|||
// 裁剪框宽度，单位px |
|||
rectWidth: 200, |
|||
// 输出的图片类型，如果'png'类型发现裁剪的图片太大，改成"jpg"即可 |
|||
fileType: 'jpg', |
|||
src: '', // 选择的图片路径，用于在点击确定时，判断是否选择了图片 |
|||
}; |
|||
}, |
|||
onLoad(option) { |
|||
let rectInfo = uni.getSystemInfoSync(); |
|||
this.width = rectInfo.windowWidth; |
|||
this.height = rectInfo.windowHeight - this.bottomNavHeight; |
|||
this.cropperOpt.width = this.width; |
|||
this.cropperOpt.height = this.height; |
|||
this.cropperOpt.pixelRatio = rectInfo.pixelRatio; |
|||
|
|||
if (option.destWidth) this.destWidth = option.destWidth; |
|||
if (option.rectWidth) { |
|||
let rectWidth = Number(option.rectWidth); |
|||
this.cropperOpt.cut = { |
|||
x: (this.width - rectWidth) / 2, |
|||
y: (this.height - rectWidth) / 2, |
|||
width: rectWidth, |
|||
height: rectWidth |
|||
}; |
|||
} |
|||
this.rectWidth = option.rectWidth; |
|||
if (option.fileType) this.fileType = option.fileType; |
|||
// 初始化 |
|||
this.cropper = new WeCropper(this.cropperOpt) |
|||
.on('ready', ctx => { |
|||
// wecropper is ready for work! |
|||
}) |
|||
.on('beforeImageLoad', ctx => { |
|||
// before picture loaded, i can do something |
|||
}) |
|||
.on('imageLoad', ctx => { |
|||
// picture loaded |
|||
}) |
|||
.on('beforeDraw', (ctx, instance) => { |
|||
// before canvas draw,i can do something |
|||
}); |
|||
// 设置导航栏样式，以免用户在page.json中没有设置为黑色背景 |
|||
uni.setNavigationBarColor({ |
|||
frontColor: '#ffffff', |
|||
backgroundColor: '#000000' |
|||
}); |
|||
uni.chooseImage({ |
|||
count: 1, // 默认9 |
|||
sizeType: ['compressed'], // 可以指定是原图还是压缩图，默认二者都有 |
|||
sourceType: ['album', 'camera'], // 可以指定来源是相册还是相机，默认二者都有 |
|||
success: res => { |
|||
this.src = res.tempFilePaths[0]; |
|||
// 获取裁剪图片资源后，给data添加src属性及其值 |
|||
this.cropper.pushOrign(this.src); |
|||
} |
|||
}); |
|||
}, |
|||
methods: { |
|||
touchStart(e) { |
|||
this.cropper.touchStart(e); |
|||
}, |
|||
touchMove(e) { |
|||
this.cropper.touchMove(e); |
|||
}, |
|||
touchEnd(e) { |
|||
this.cropper.touchEnd(e); |
|||
}, |
|||
getCropperImage(isPre = false) { |
|||
if(!this.src) return this.$u.toast('请先选择图片再裁剪'); |
|||
|
|||
let cropper_opt = { |
|||
destHeight: Number(this.destWidth), // uni.canvasToTempFilePath要求这些参数为数值 |
|||
destWidth: Number(this.destWidth), |
|||
fileType: this.fileType |
|||
}; |
|||
this.cropper.getCropperImage(cropper_opt, (path, err) => { |
|||
if (err) { |
|||
uni.showModal({ |
|||
title: '温馨提示', |
|||
content: err.message |
|||
}); |
|||
} else { |
|||
if (isPre) { |
|||
uni.previewImage({ |
|||
current: '', // 当前显示图片的 http 链接 |
|||
urls: [path] // 需要预览的图片 http 链接列表 |
|||
}); |
|||
} else { |
|||
uni.$emit('uAvatarCropper', path); |
|||
this.$u.route({ |
|||
type: 'back' |
|||
}); |
|||
} |
|||
} |
|||
}); |
|||
}, |
|||
uploadTap() { |
|||
const self = this; |
|||
uni.chooseImage({ |
|||
count: 1, // 默认9 |
|||
sizeType: ['original', 'compressed'], // 可以指定是原图还是压缩图，默认二者都有 |
|||
sourceType: ['album', 'camera'], // 可以指定来源是相册还是相机，默认二者都有 |
|||
success: (res) => { |
|||
self.src = res.tempFilePaths[0]; |
|||
// 获取裁剪图片资源后，给data添加src属性及其值 |
|||
|
|||
self.cropper.pushOrign(this.src); |
|||
} |
|||
}); |
|||
} |
|||
} |
|||
}; |
|||
</script> |
|||
|
|||
<style scoped lang="scss"> |
|||
@import '../../libs/css/style.components.scss'; |
|||
|
|||
.content { |
|||
background: rgba(255, 255, 255, 1); |
|||
} |
|||
|
|||
.cropper { |
|||
position: absolute; |
|||
top: 0; |
|||
left: 0; |
|||
width: 100%; |
|||
height: 100%; |
|||
z-index: 11; |
|||
} |
|||
|
|||
.cropper-buttons { |
|||
background-color: #000000; |
|||
color: #eee; |
|||
} |
|||
|
|||
.cropper-wrapper { |
|||
position: relative; |
|||
@include vue-flex; |
|||
flex-direction: row; |
|||
justify-content: space-between; |
|||
align-items: center; |
|||
width: 100%; |
|||
background-color: #000; |
|||
} |
|||
|
|||
.cropper-buttons { |
|||
width: 100vw; |
|||
@include vue-flex; |
|||
flex-direction: row; |
|||
justify-content: space-between; |
|||
align-items: center; |
|||
position: fixed; |
|||
bottom: 0; |
|||
left: 0; |
|||
font-size: 28rpx; |
|||
} |
|||
|
|||
.cropper-buttons .upload, |
|||
.cropper-buttons .getCropperImage { |
|||
width: 50%; |
|||
text-align: center; |
|||
} |
|||
|
|||
.cropper-buttons .upload { |
|||
text-align: left; |
|||
padding-left: 50rpx; |
|||
} |
|||
|
|||
.cropper-buttons .getCropperImage { |
|||
text-align: right; |
|||
padding-right: 50rpx; |
|||
} |
|||
</style> |
|||
File diff suppressed because it is too large
@ -0,0 +1,244 @@ |
|||
<template> |
|||
<view class="u-avatar" :style="[wrapStyle]" @tap="click"> |
|||
<image |
|||
@error="loadError" |
|||
:style="[imgStyle]" |
|||
class="u-avatar__img" |
|||
v-if="!uText && avatar" |
|||
:src="avatar" |
|||
:mode="imgMode" |
|||
></image> |
|||
<text class="u-line-1" v-else-if="uText" :style="{ |
|||
fontSize: '38rpx' |
|||
}">{{uText}}</text> |
|||
<slot v-else></slot> |
|||
<view class="u-avatar__sex" v-if="showSex" :class="['u-avatar__sex--' + sexIcon]" :style="[uSexStyle]"> |
|||
<u-icon :name="sexIcon" size="20"></u-icon> |
|||
</view> |
|||
<view class="u-avatar__level" v-if="showLevel" :style="[uLevelStyle]"> |
|||
<u-icon :name="levelIcon" size="20"></u-icon> |
|||
</view> |
|||
</view> |
|||
</template> |
|||
|
|||
<script> |
|||
let base64Avatar = "data:image/jpg;base64,/9j/4QAYRXhpZgAASUkqAAgAAAAAAAAAAAAAAP/sABFEdWNreQABAAQAAAA8AAD/4QMraHR0cDovL25zLmFkb2JlLmNvbS94YXAvMS4wLwA8P3hwYWNrZXQgYmVnaW49Iu+7vyIgaWQ9Ilc1TTBNcENlaGlIenJlU3pOVGN6a2M5ZCI/PiA8eDp4bXBtZXRhIHhtbG5zOng9ImFkb2JlOm5zOm1ldGEvIiB4OnhtcHRrPSJBZG9iZSBYTVAgQ29yZSA1LjMtYzAxMSA2Ni4xNDU2NjEsIDIwMTIvMDIvMDYtMTQ6NTY6MjcgICAgICAgICI+IDxyZGY6UkRGIHhtbG5zOnJkZj0iaHR0cDovL3d3dy53My5vcmcvMTk5OS8wMi8yMi1yZGYtc3ludGF4LW5zIyI+IDxyZGY6RGVzY3JpcHRpb24gcmRmOmFib3V0PSIiIHhtbG5zOnhtcD0iaHR0cDovL25zLmFkb2JlLmNvbS94YXAvMS4wLyIgeG1sbnM6eG1wTU09Imh0dHA6Ly9ucy5hZG9iZS5jb20veGFwLzEuMC9tbS8iIHhtbG5zOnN0UmVmPSJodHRwOi8vbnMuYWRvYmUuY29tL3hhcC8xLjAvc1R5cGUvUmVzb3VyY2VSZWYjIiB4bXA6Q3JlYXRvclRvb2w9IkFkb2JlIFBob3Rvc2hvcCBDUzYgKFdpbmRvd3MpIiB4bXBNTTpJbnN0YW5jZUlEPSJ4bXAuaWlkOjREMEQwRkY0RjgwNDExRUE5OTY2RDgxODY3NkJFODMxIiB4bXBNTTpEb2N1bWVudElEPSJ4bXAuZGlkOjREMEQwRkY1RjgwNDExRUE5OTY2RDgxODY3NkJFODMxIj4gPHhtcE1NOkRlcml2ZWRGcm9tIHN0UmVmOmluc3RhbmNlSUQ9InhtcC5paWQ6NEQwRDBGRjJGODA0MTFFQTk5NjZEODE4Njc2QkU4MzEiIHN0UmVmOmRvY3VtZW50SUQ9InhtcC5kaWQ6NEQwRDBGRjNGODA0MTFFQTk5NjZEODE4Njc2QkU4MzEiLz4gPC9yZGY6RGVzY3JpcHRpb24+IDwvcmRmOlJERj4gPC94OnhtcG1ldGE+IDw/eHBhY2tldCBlbmQ9InIiPz7/7gAOQWRvYmUAZMAAAAAB/9sAhAAGBAQEBQQGBQUGCQYFBgkLCAYGCAsMCgoLCgoMEAwMDAwMDBAMDg8QDw4MExMUFBMTHBsbGxwfHx8fHx8fHx8fAQcHBw0MDRgQEBgaFREVGh8fHx8fHx8fHx8fHx8fHx8fHx8fHx8fHx8fHx8fHx8fHx8fHx8fHx8fHx8fHx8fHx//wAARCADIAMgDAREAAhEBAxEB/8QAcQABAQEAAwEBAAAAAAAAAAAAAAUEAQMGAgcBAQAAAAAAAAAAAAAAAAAAAAAQAAIBAwICBgkDBQAAAAAAAAABAhEDBCEFMVFBYXGREiKBscHRMkJSEyOh4XLxYjNDFBEBAAAAAAAAAAAAAAAAAAAAAP/aAAwDAQACEQMRAD8A/fAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAHbHFyZ/Dam+yLA+Z2L0Pjtyj2poD4AAAAAAAAAAAAAAAAAAAAAAAAKWFs9y6lcvvwQeqj8z9wFaziY1n/HbUX9XF97A7QAGXI23EvJ1goyfzR0YEfN269jeZ+a03pNe0DIAAAAAAAAAAAAAAAAAAAACvtO3RcVkXlWutuL9YFYAAAAAOJRjKLjJVi9GmB5/csH/mu1h/in8PU+QGMAAAAAAAAAAAAAAAAAAaMDG/6MmMH8C80+xAelSSVFolwQAAAAAAAHVlWI37ErUulaPk+hgeYnCUJuElSUXRrrQHAAAAAAAAAAAAAAAAABa2Oz4bM7r4zdF2ICmAAAAAAAAAg7zZ8GX41wuJP0rRgYAAAAAAAAAAAAAAAAAD0m2R8ODaXU33tsDSAAAAAAAAAlb9HyWZcnJd9PcBHAAAAAAAAAAAAAAAAAPS7e64Vn+KA0AAAAAAAAAJm+v8Ftf3ewCKAAAAAAAAAAAAAAAAAX9muqeGo9NttP06+0DcAAAAAAAAAjb7dTu2ra+VOT9P8AQCWAAAAAAAAAAAAAAAAAUNmyPt5Ltv4bui/kuAF0AAAAAAADiUlGLlJ0SVW+oDzOXfd/Ind6JPRdS0QHSAAAAAAAAAAAAAAAAAE2nVaNcGB6Lbs6OTao9LsF51z60BrAAAAAABJ3jOVHjW3r/sa9QEgAAAAAAAAAAAAAAAAAAAPu1duWriuW34ZR4MC9hbnZyEoy8l36XwfYBsAAADaSq9EuLAlZ+7xSdrGdW9Hc5dgEdtt1erfFgAAAAAAAAAAAAAAAAADVjbblX6NR8MH80tEBRs7HYivyzlN8lovaBPzduvY0m6eK10TXtAyAarO55lpJK54orolr+4GqO/Xaea1FvqbXvA+Z77kNeW3GPbV+4DJfzcm/pcm3H6Vou5AdAFLC2ed2Pjv1txa8sV8T6wOL+yZEKu1JXFy4MDBOE4ScZxcZLinoB8gAAAAAAAAAAAB242LeyJ+C3GvN9C7QLmJtePYpKS+5c+p8F2IDYAANJqj1T4oCfk7Nj3G5Wn9qXJax7gJ93Z82D8sVNc4v30A6Xg5i42Z+iLfqARwcyT0sz9MWvWBps7LlTf5Grce9/oBTxdtxseklHxT+uWr9AGoAB138ezfj4bsFJdD6V2MCPm7RdtJzs1uW1xXzL3gTgAAAAAAAAADRhYc8q74I6RWs5ckB6GxYtWLat21SK731sDsAAAAAAAAAAAAAAAASt021NO/YjrxuQXT1oCOAAAAAAABzGLlJRSq26JAelwsWONYjbXxcZvmwO8AAAAAAAAAAAAAAAAAAef3TEWPkVivx3NY9T6UBiAAAAAABo2+VmGXblddIJ8eivRUD0oAAAAAAAAAAAAAAAAAAAYt4tKeFKVNYNSXfRgefAAAAAAAAr7VuSSWPedKaW5v1MCsAAAAAAAAAAAAAAAAAAIe6bj96Ts2n+JPzSXzP3ATgAAAAAAAAFbbt1UUrOQ9FpC4/UwK6aaqtU+DAAAAAAAAAAAAAAA4lKMIuUmoxWrb4ARNx3R3q2rLpa4Sl0y/YCcAAAAAAAAAAANmFud7G8r89r6X0dgFvGzLGRGtuWvTF6NAdwAAAAAAAAAAAy5W442PVN+K59EePp5ARMvOv5MvO6QXCC4AZwAAAAAAAAAAAAAcxlKLUotprg1owN+PvORborq+7Hnwl3gUbO74VzRydt8pKn68ANcJwmqwkpLmnUDkAAAAfNy9atqtyagut0AxXt5xIV8Fbj6lRd7Am5G65V6qUvtwfyx94GMAAAAAAAAAAAAAAAAAAAOU2nVOj5gdsc3LiqRvTpyqwOxbnnrhdfpSfrQB7pnv/AGvuS9gHXPMy5/Fem1yq0v0A6W29XqwAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAf//Z"; |
|||
/** |
|||
* avatar 头像 |
|||
* @description 本组件一般用于展示头像的地方，如个人中心，或者评论列表页的用户头像展示等场所。 |
|||
* @tutorial https://www.uviewui.com/components/avatar.html |
|||
* @property {String} bg-color 背景颜色，一般显示文字时用（默认#ffffff） |
|||
* @property {String} src 头像路径，如加载失败，将会显示默认头像 |
|||
* @property {String Number} size 头像尺寸，可以为指定字符串(large, default, mini)，或者数值，单位rpx（默认default） |
|||
* @property {String} mode 显示类型，见上方说明（默认circle） |
|||
* @property {String} sex-icon 性别图标，man-男，woman-女（默认man） |
|||
* @property {String} level-icon 等级图标（默认level） |
|||
* @property {String} sex-bg-color 性别图标背景颜色 |
|||
* @property {String} level-bg-color 等级图标背景颜色 |
|||
* @property {String} show-sex 是否显示性别图标（默认false） |
|||
* @property {String} show-level 是否显示等级图标（默认false） |
|||
* @property {String} img-mode 头像图片的裁剪类型，与uni的image组件的mode参数一致，如效果达不到需求，可尝试传widthFix值（默认aspectFill） |
|||
* @property {String} index 用户传递的标识符值，如果是列表循环，可穿v-for的index值 |
|||
* @event {Function} click 头像被点击 |
|||
* @example <u-avatar :src="src"></u-avatar> |
|||
*/ |
|||
export default { |
|||
name: 'u-avatar', |
|||
props: { |
|||
// 背景颜色 |
|||
bgColor: { |
|||
type: String, |
|||
default: 'transparent' |
|||
}, |
|||
// 头像路径 |
|||
src: { |
|||
type: String, |
|||
default: '' |
|||
}, |
|||
// 尺寸，large-大，default-中等，mini-小，如果为数值，则单位为rpx |
|||
// 宽度等于高度 |
|||
size: { |
|||
type: [String, Number], |
|||
default: 'default' |
|||
}, |
|||
// 头像模型，square-带圆角方形，circle-圆形 |
|||
mode: { |
|||
type: String, |
|||
default: 'circle' |
|||
}, |
|||
// 文字内容 |
|||
text: { |
|||
type: String, |
|||
default: '' |
|||
}, |
|||
// 图片的裁剪模型 |
|||
imgMode: { |
|||
type: String, |
|||
default: 'aspectFill' |
|||
}, |
|||
// 标识符 |
|||
index: { |
|||
type: [String, Number], |
|||
default: '' |
|||
}, |
|||
// 右上角性别角标，man-男，woman-女 |
|||
sexIcon: { |
|||
type: String, |
|||
default: 'man' |
|||
}, |
|||
// 右下角的等级图标 |
|||
levelIcon: { |
|||
type: String, |
|||
default: 'level' |
|||
}, |
|||
// 右下角等级图标背景颜色 |
|||
levelBgColor: { |
|||
type: String, |
|||
default: '' |
|||
}, |
|||
// 右上角性别图标的背景颜色 |
|||
sexBgColor: { |
|||
type: String, |
|||
default: '' |
|||
}, |
|||
// 是否显示性别图标 |
|||
showSex: { |
|||
type: Boolean, |
|||
default: false |
|||
}, |
|||
// 是否显示等级图标 |
|||
showLevel: { |
|||
type: Boolean, |
|||
default: false |
|||
} |
|||
}, |
|||
data() { |
|||
return { |
|||
error: false, |
|||
// 头像的地址，因为如果加载错误，需要赋值为默认图片，props值无法修改，所以需要一个中间值 |
|||
avatar: this.src ? this.src : base64Avatar, |
|||
} |
|||
}, |
|||
watch: { |
|||
src(n) { |
|||
// 用户可能会在头像加载失败时，再次修改头像值，所以需要重新赋值 |
|||
if(!n) { |
|||
// 如果传入null或者''，或者undefined，显示默认头像 |
|||
this.avatar = base64Avatar; |
|||
this.error = true; |
|||
} else { |
|||
this.avatar = n; |
|||
this.error = false; |
|||
} |
|||
} |
|||
}, |
|||
computed: { |
|||
wrapStyle() { |
|||
let style = {}; |
|||
style.height = this.size == 'large' ? '120rpx' : this.size == 'default' ? |
|||
'90rpx' : this.size == 'mini' ? '70rpx' : this.size + 'rpx'; |
|||
style.width = style.height; |
|||
style.flex = `0 0 ${style.height}`; |
|||
style.backgroundColor = this.bgColor; |
|||
style.borderRadius = this.mode == 'circle' ? '500px' : '5px'; |
|||
if(this.text) style.padding = `0 6rpx`; |
|||
return style; |
|||
}, |
|||
imgStyle() { |
|||
let style = {}; |
|||
style.borderRadius = this.mode == 'circle' ? '500px' : '5px'; |
|||
return style; |
|||
}, |
|||
// 取字符串的第一个字符 |
|||
uText() { |
|||
return String(this.text)[0]; |
|||
}, |
|||
// 性别图标的自定义样式 |
|||
uSexStyle() { |
|||
let style = {}; |
|||
if(this.sexBgColor) style.backgroundColor = this.sexBgColor; |
|||
return style; |
|||
}, |
|||
// 等级图标的自定义样式 |
|||
uLevelStyle() { |
|||
let style = {}; |
|||
if(this.levelBgColor) style.backgroundColor = this.levelBgColor; |
|||
return style; |
|||
} |
|||
}, |
|||
methods: { |
|||
// 图片加载错误时，显示默认头像 |
|||
loadError() { |
|||
this.error = true; |
|||
this.avatar = base64Avatar; |
|||
}, |
|||
click() { |
|||
this.$emit('click', this.index); |
|||
} |
|||
} |
|||
} |
|||
</script> |
|||
|
|||
<style lang="scss" scoped> |
|||
@import "../../libs/css/style.components.scss"; |
|||
|
|||
.u-avatar { |
|||
/* #ifndef APP-NVUE */ |
|||
display: inline-flex; |
|||
/* #endif */ |
|||
align-items: center; |
|||
justify-content: center; |
|||
font-size: 28rpx; |
|||
color: $u-content-color; |
|||
border-radius: 10px; |
|||
position: relative; |
|||
|
|||
&__img { |
|||
width: 100%; |
|||
height: 100%; |
|||
} |
|||
|
|||
&__sex { |
|||
position: absolute; |
|||
width: 32rpx; |
|||
color: #ffffff; |
|||
height: 32rpx; |
|||
@include vue-flex; |
|||
justify-content: center; |
|||
align-items: center; |
|||
border-radius: 100rpx; |
|||
top: 5%; |
|||
z-index: 1; |
|||
right: -7%; |
|||
border: 1px #ffffff solid; |
|||
|
|||
&--man { |
|||
background-color: $u-type-primary; |
|||
} |
|||
|
|||
&--woman { |
|||
background-color: $u-type-error; |
|||
} |
|||
|
|||
&--none { |
|||
background-color: $u-type-warning; |
|||
} |
|||
} |
|||
|
|||
&__level { |
|||
position: absolute; |
|||
width: 32rpx; |
|||
color: #ffffff; |
|||
height: 32rpx; |
|||
@include vue-flex; |
|||
justify-content: center; |
|||
align-items: center; |
|||
border-radius: 100rpx; |
|||
bottom: 5%; |
|||
z-index: 1; |
|||
right: -7%; |
|||
border: 1px #ffffff solid; |
|||
background-color: $u-type-warning; |
|||
} |
|||
} |
|||
</style> |
|||
Some files were not shown because too many files changed in this diff
Loading…
Reference in new issue