Skip to content

L
light-bet
提交 866e895f authored 作者: ling's avatar ling
浏览文件
操作

Add api

上级 c6becd8e
隐藏空白字符变更
内嵌 并排
正在显示 包含 1585 行增加 和 336 行删除
api/betorder.js 0 → 100644
浏览文件 @ 866e895f
import { fetcher } from '~/assets/scripts/fetcher.js'
export const sendEmail = async (email) => {
const result = await fetcher(`api/common/sendEmail/${email}`, 'GET')
return result
}
export const register = async (data) => {
const result = await fetcher('api/member/register', 'POST', data)
return result
}
export const login = async (data) => {
const result = await fetcher('api/member/login', 'POST', data)
return result
}
export const getInfo = async () => {
const result = await fetcher('api/member/getInfo', 'GET')
return result
}
export const updatePasswd = async (data) => {
const result = await fetcher('api/member/updatePasswd', 'POST', data)
return result
}
export const resetPasswd = async (data) => {
const result = await fetcher('api/member/resetPasswd', 'POST', data)
return result
}
export const resetFpasswd = async (data) => {
const result = await fetcher('api/member/resetFpasswd', 'POST', data)
return result
}
export const updateFpasswd = async (data) => {
const result = await fetcher('api/member/updateFpasswd', 'POST', data)
return result
}
export const getBanner = async () => {
const result = await fetcher('api/banner/list', 'GET')
return result
}
export const getBetList = async () => {
const result = await fetcher('api/betorder/getList', 'GET')
return result
}
\ No newline at end of file
api/common.js 0 → 100644
浏览文件 @ 866e895f
import { fetcher } from '~/assets/scripts/fetcher.js'
export const getBanner = async () => {
const result = await fetcher('api/banner/list', 'GET')
return result
}
export const getCustomerList = async () => {
const result = await fetcher('api/kf/getList', 'GET')
return result
}
export const getDictType = async (dictType) => {
const result = await fetcher(`api/system/dict/data/ntype/${dictType}`, 'GET')
return result
}
\ No newline at end of file
api/recommend.js 0 → 100644
浏览文件 @ 866e895f
import { fetcher } from '~/assets/scripts/fetcher.js'
export const getRecommendList = async () => {
const result = await fetcher('api/recommend/getPage', 'GET')
return result
}
\ No newline at end of file
api/user.js
浏览文件 @ 866e895f
......@@ -20,7 +20,32 @@ export const getInfo = async () => {
return result
}
export const getBanner = async () => {
const result = await fetcher('api/banner/list', 'GET')
export const updateInfo = async (data) => {
const result = await fetcher('api/member/updateInfo', 'POST', data)
return result
}
export const updateAvatar = async (data) => {
const result = await fetcher('api/member/updateAvatar', 'POST', data)
return result
}
export const updatePasswd = async (data) => {
const result = await fetcher('api/member/updatePasswd', 'POST', data)
return result
}
export const resetPasswd = async (data) => {
const result = await fetcher('api/member/resetPasswd', 'POST', data)
return result
}
export const resetFpasswd = async (data) => {
const result = await fetcher('api/member/resetFpasswd', 'POST', data)
return result
}
export const updateFpasswd = async (data) => {
const result = await fetcher('api/member/updateFpasswd', 'POST', data)
return result
}
\ No newline at end of file
assets/scripts/auth.js
浏览文件 @ 866e895f
import Cookies from 'js-cookie'
const TokenKey = 'LIGHT-BET'
const TokenKey = 'TOKEN'
// const InfoKey = 'INFO'
// TOKEN
export function getToken() {
return Cookies.get(TokenKey)
}
......@@ -12,4 +14,17 @@ export function setToken(token) {
export function removeToken() {
return Cookies.remove(TokenKey)
}
\ No newline at end of file
}
// // INFO
// export function getInfo() {
// return JSON.parse(Cookies.get(InfoKey))
// }
// export function setInfo(info) {
// return Cookies.set(InfoKey, JSON.stringify(info))
// }
// export function removeInfo() {
// return Cookies.remove(InfoKey)
// }
\ No newline at end of file
assets/scripts/fetcher.js
浏览文件 @ 866e895f
......@@ -22,13 +22,12 @@ export const fetcher = async (APIUrl, httpVerb = 'POST', payload) => {
}
})
.catch(function (error) {
// if (error.data.code === 401) {
// window.location.href = "/login"
// } else if (error.data.code === 407) {
// window.location.href = "/login"
// } else {
// return Promise.reject(error.data.msg)
// }
console.log(error)
if (error.data.code === 401) {
window.location.href = "/login"
} else if (error.data.code === 407) {
window.location.href = "/login"
} else {
return Promise.reject(error.data.msg)
}
})
}
nuxt.config.js
浏览文件 @ 866e895f
......@@ -29,7 +29,8 @@ export default {
},
// Plugins to run before rendering page: https://go.nuxtjs.dev/config-plugins
plugins: [
'@/plugins/vant'
'@/plugins/vant',
'@/plugins/route',
],
// Auto import components: https://go.nuxtjs.dev/config-components
......
pages/accountManage/addBankCard.vue 0 → 100644
浏览文件 @ 866e895f
<template>
<div class="page">
<div class="page-header">
<span class="page-header-back" @click="$router.go(-1)">&lt;</span>
添加银行卡
</div>
<div class="page-tab">
<div class="page-tab-group">
<div class="page-tab-item" :class="{active:tabIndex === 0}" @click="switchTab(0)">银行卡</div>
<div class="page-tab-item" :class="{active:tabIndex === 1}" @click="switchTab(1)">虚拟币</div>
</div>
</div>
<template v-if="tabIndex === 0">
<div v-for="item in bankList" :key="item.key" class="page-item">
<div class="page-item-logo"><img :src="require('@/assets/images/accountManage/logo.png')" alt=""></div>
<div class="page-item-content">
<div>{{item.name}}</div>
<div>支行 {{item.branch}}</div>
<div>账户 {{item.account}}</div>
</div>
</div>
<img class="page-btn" src="@/assets/images/accountManage/btn_2.png" />
<div class="page-tip">最多支持添加10张银行卡</div>
</template>
<template v-else>
<div v-for="item in virtualList" :key="item.key" class="page-item">
<div class="page-item-logo"><img :src="require('@/assets/images/accountManage/logo.png')" alt=""></div>
<div class="page-item-content">
<div>币种 {{item.currency}}</div>
<div>支行 {{item.protocol}}</div>
<div>账户 {{item.account}}</div>
</div>
</div>
<img class="page-btn" src="@/assets/images/accountManage/btn_2.png" />
<div class="page-tip">最多支持添加3个虚拟币账户</div>
</template>
</div>
</template>
<script>
export default {
name: "AddBankCardPage",
data() {
return {
};
},
methods: {
switchTab(index) {
this.tabIndex = index;
}
},
};
</script>
<style lang="scss" scoped>
.page {
background: url("@/assets/images/index/bg.png");
background-repeat: no-repeat;
background-size: 100% 100%;
width: 100%;
height: 100%;
min-height: 100vh;
padding-bottom: 60px;
&-header {
background: #068EF6FF;
color: white;
text-align: center;
font-size: 20px;
font-weight: bold;
font-family: PingFang SC, Arial;
height: 50px;
line-height: 50px;
&-back {
position: absolute;
left: 20px;
font-weight: normal;
}
}
&-tab {
background: #068EF6FF;
padding: 10px;
&-group {
display: flex;
background: url("@/assets/images/accountManage/tab_bg.png");
background-repeat: no-repeat;
background-size: 100% 100%;
height: 35px;
padding: 5px;
}
&-item {
width: 50%;
display: flex;
justify-content: center;
align-items: center;
color: #CCCCCCFF;
font-size: 14px;
border-radius: 5px;
}
.active {
background: #068EF6FF;
color: white;
}
}
&-item {
background: linear-gradient(176deg, #37BBFC 0%, #13A4FF 100%);
box-shadow: 0px 2px 35px 0px rgba(5, 18, 100, 0.5);
border-radius: 10px;
width: 90%;
height: 100px;
margin: 20px auto;
display: flex;
align-items: center;
&-logo {
display: flex;
justify-content: center;
align-items: center;
width: 35%;
img {
width: 70px;
height: 70px;
background: white;
border-radius: 50%;
padding: 10px;
}
}
&-content {
color: white;
font-size: 14px;
div {
margin-top: 5px;
}
div:first-child {
margin-top: 0px;
font-weight: bold;
}
}
}
&-btn {
display: block;
width: 90%;
margin: 40px auto 0;
}
&-tip {
color: #CCCCCCFF;
font-size: 14px;
text-align: center;
margin-top: 10px;
}
}
</style>
pages/accountManage/index.vue 0 → 100644
浏览文件 @ 866e895f
<template>
<div class="page">
<div class="page-header">
<span class="page-header-back" @click="$router.go(-1)">&lt;</span>
账户管理
<span class="page-header-link">教程？</span>
</div>
<div class="page-tab">
<div class="page-tab-group">
<div class="page-tab-item" :class="{active:tabIndex === 0}" @click="switchTab(0)">银行卡</div>
<div class="page-tab-item" :class="{active:tabIndex === 1}" @click="switchTab(1)">虚拟币</div>
</div>
</div>
<template v-if="tabIndex === 0">
<div v-for="item in bankList" :key="item.key" class="page-item">
<div class="page-item-logo"><img :src="require('@/assets/images/accountManage/logo.png')" alt=""></div>
<div class="page-item-content">
<div>{{item.name}}</div>
<div>支行 {{item.branch}}</div>
<div>账户 {{item.account}}</div>
</div>
</div>
<img class="page-btn" src="@/assets/images/accountManage/btn_2.png" @click="$router.push('accountManage/addBankCard')"/>
<div class="page-tip">最多支持添加10张银行卡</div>
</template>
<template v-else>
<div v-for="item in virtualList" :key="item.key" class="page-item">
<div class="page-item-logo"><img :src="require('@/assets/images/accountManage/logo.png')" alt=""></div>
<div class="page-item-content">
<div>币种 {{item.currency}}</div>
<div>支行 {{item.protocol}}</div>
<div>账户 {{item.account}}</div>
</div>
</div>
<img class="page-btn" src="@/assets/images/accountManage/btn_2.png" />
<div class="page-tip">最多支持添加3个虚拟币账户</div>
</template>
</div>
</template>
<script>
export default {
name: "AccountManagerPage",
data() {
return {
tabIndex: 0,
bankList: [
{ name: "中国银行", logo: '@/assets/images/accountManage/logo.png', branch: "北京市北京市东城区", account: "6222024403127265983" },
],
virtualList: [
{ currency: "USDT", logo: '@/assets/images/accountManage/logo.png', protocol: "TRC20", account: "asdcsadjalsduifusdiFRX" },
],
};
},
methods: {
switchTab(index) {
this.tabIndex = index;
}
},
};
</script>
<style lang="scss" scoped>
.page {
background: url("@/assets/images/index/bg.png");
background-repeat: no-repeat;
background-size: 100% 100%;
width: 100%;
height: 100%;
min-height: 100vh;
padding-bottom: 60px;
&-header {
background: #068EF6FF;
color: white;
text-align: center;
font-size: 20px;
font-weight: bold;
font-family: PingFang SC, Arial;
height: 50px;
line-height: 50px;
&-back {
position: absolute;
left: 20px;
font-weight: normal;
}
&-link {
position: absolute;
right: 20px;
font-weight: normal;
font-size: 14px;
}
}
&-tab {
background: #068EF6FF;
padding: 10px;
&-group {
display: flex;
background: url("@/assets/images/accountManage/tab_bg.png");
background-repeat: no-repeat;
background-size: 100% 100%;
height: 35px;
padding: 5px;
}
&-item {
width: 50%;
display: flex;
justify-content: center;
align-items: center;
color: #CCCCCCFF;
font-size: 14px;
border-radius: 5px;
}
.active {
background: #068EF6FF;
color: white;
}
}
&-item {
background: linear-gradient(176deg, #37BBFC 0%, #13A4FF 100%);
box-shadow: 0px 2px 35px 0px rgba(5, 18, 100, 0.5);
border-radius: 10px;
width: 90%;
height: 100px;
margin: 20px auto;
display: flex;
align-items: center;
&-logo {
display: flex;
justify-content: center;
align-items: center;
width: 35%;
img {
width: 70px;
height: 70px;
background: white;
border-radius: 50%;
padding: 10px;
}
}
&-content {
color: white;
font-size: 14px;
div {
margin-top: 5px;
}
div:first-child {
margin-top: 0px;
font-weight: bold;
}
}
}
&-btn {
display: block;
width: 90%;
margin: 40px auto 0;
}
&-tip {
color: #CCCCCCFF;
font-size: 14px;
text-align: center;
margin-top: 10px;
}
}
</style>
pages/challenge.vue 0 → 100644
浏览文件 @ 866e895f
<template>
<div class="page">
<div class="page-header">
<span @click="$router.go(-1)">&lt;</span>
发起挑战
</div>
<div class="page-item">
<div class="page-item-title">挑战类别</div>
<select v-model="payload.type">
<option v-for="item in typeList" :key="item.key" :value="item.type">{{item.name}}</option>
</select>
</div>
<div class="page-item">
<div class="page-item-title">挑战主题</div>
<input v-model="payload.title" type="text" />
</div>
<div class="page-item">
<div class="page-item-title">截止时间</div>
<van-cell :value="payload.date" @click="dateStatus = true" />
<van-calendar v-model="dateStatus" :show-confirm="false" @confirm="onConfirm" />
</div>
<div class="page-row">
<div class="page-row-item">
<div>结果1</div>
<input v-model="payload.result1" type="text" @change="setSelectList(0)" />
</div>
<div class="page-row-item">
<div>结果2</div>
<input v-model="payload.result2" type="text" @change="setSelectList(1)" />
</div>
</div>
<div class="page-row" v-if="selectList[0] && selectList[1]">
<div class="page-row-title">我的选择</div>
<select v-model="payload.select">
<option v-for="item in selectList" :key="item.key" :value="item">{{item}}</option>
</select>
</div>
<div class="page-item">
<div class="page-item-title border-bottom">挑战金额</div>
<div class="page-item-amount">
<div v-for="item in amountList" :key="item" @click="payload.amount = item">¥{{item}}</div>
<div>¥<input v-model="payload.amount" type="text" placeholder="请输入" /></div>
</div>
</div>
<div class="page-content">
<div class="page-content-title">赔率</div>
<div class="page-content-odds">
<div class="page-content-odds-left">
<div>{{ 1.35 }}</div>
{{ payload.result1 }}
</div>
<div class="page-content-odds-middle">VS</div>
<div class="page-content-odds-right">
{{ payload.result2 }}
<div>{{ 3.21 }}</div>
</div>
</div>
<div class="page-content-text">
可赢得<span class="red">¥35</span>
</div>
<div class="page-content-slider">
1.05
<van-slider v-model="payload.value" :min="1.05" :max="9.98" :step="0.01" bar-height="3px"
active-color="#B00000FF" button-size="16px" @change="onChange" />
9.98
</div>
</div>
<img class="page-btn" src="@/assets/images/challenge/btn.png" />
</div>
</template>
<script>
export default {
name: "ChallengePage",
data() {
return {
typeList: [
{ type: 1, name: '体育' },
{ type: 2, name: '时事' },
{ type: 3, name: '生活' }
],
dateStatus: false,
selectList: ['', ''],
amountList: [100, 500, 1000],
payload: {
type: 1,
title: "",
date: "",
result1: "",
result2: "",
select: "",
amount: '',
value: 5,
},
};
},
mounted() {
this.payload.date = `${new Date().getFullYear()}/${new Date().getMonth() + 1}/${new Date().getDate()}`
},
methods: {
formatDate(date) {
return `${date.getFullYear()}/${date.getMonth() + 1}/${date.getDate()}`;
},
onConfirm(date) {
this.dateStatus = false;
this.payload.date = this.formatDate(date);
},
setSelectList(index) {
this.$set(this.selectList, index, this.payload[`result${index + 1}`])
},
onChange(value) {
console.log(value);
},
},
};
</script>
<style lang="scss" scoped>
.page {
background: url("@/assets/images/index/bg.png");
background-repeat: no-repeat;
background-size: 100% 100%;
width: 100%;
height: 100%;
min-height: 100vh;
padding-bottom: 60px;
&-header {
color: white;
text-align: center;
font-size: 20px;
font-family: "modeng";
-webkit-text-stroke: 1px #1B5AA7FF;
height: 50px;
line-height: 50px;
span {
font-family: Arial;
-webkit-text-stroke: 0;
position: absolute;
left: 20px;
font-weight: normal;
}
}
&-item {
padding: 10px;
&-title {
font-size: 18px;
color: white;
font-family: "modeng";
-webkit-text-stroke: 1px #1B5AA7FF;
margin-bottom: 5px;
}
&-amount {
display: flex;
justify-content: space-between;
div {
display: flex;
align-items: center;
justify-content: center;
width: 23%;
background: #1C62B8;
border: 1px solid #7FD7EB;
color: white;
border-radius: 5px;
font-weight: bold;
padding: 7px;
input {
background: #1C62B8;
border: none;
outline: none;
padding: 0;
margin-left: 3px;
font-size: 16px;
&::placeholder {
color: #CCCCCCFF;
font-size: 14px;
}
}
}
}
select {
width: 100%;
background: #1C62B8;
border: 1px solid #7FD7EB;
outline: none;
color: white;
border-radius: 5px;
font-size: 14px;
padding: 5px;
}
input {
width: 100%;
background: #1C62B8;
border: 1px solid #7FD7EB;
outline: none;
color: white;
border-radius: 5px;
font-size: 14px;
padding: 6px 8px;
}
.border-bottom {
margin-bottom: 10px;
padding-bottom: 10px;
border-bottom: 1px solid #D9D9D9FF;
}
}
&-row {
padding: 10px;
display: flex;
justify-content: space-between;
align-items: center;
&-item {
width: 45%;
text-align: center;
div {
font-size: 18px;
color: white;
font-family: "modeng";
-webkit-text-stroke: 1px #1B5AA7FF;
margin-bottom: 5px;
}
input {
width: 100%;
background: #1C62B8;
border: 1px solid #7FD7EB;
outline: none;
color: white;
border-radius: 5px;
font-size: 14px;
padding: 6px 8px;
}
}
&-title {
font-size: 18px;
color: white;
font-family: "modeng";
-webkit-text-stroke: 1px #1B5AA7FF;
}
select {
width: 75%;
background: #1C62B8;
border: 1px solid #7FD7EB;
outline: none;
color: white;
border-radius: 5px;
font-size: 14px;
padding: 5px;
text-align: center;
}
}
&-content {
background: url("@/assets/images/challenge/bg.png");
background-repeat: no-repeat;
background-size: 100% 100%;
width: calc(100% - 20px);
height: 200px;
color: white;
font-family: PingFang SC, Arial;
font-weight: bold;
margin: 10px auto;
padding: 10px;
&-title {
background: url("@/assets/images/plaze/title_2.png");
background-repeat: no-repeat;
background-size: 100% 100%;
text-align: center;
padding: 5px 0;
width: 200px;
margin: 0 auto;
}
&-odds {
display: flex;
justify-content: space-between;
align-items: center;
margin-top: 10px;
&-left,
&-right {
display: flex;
align-items: center;
font-size: 16px;
div {
border-radius: 50%;
width: 65px;
height: 65px;
display: flex;
align-items: center;
justify-content: center;
font-size: 24px;
font-weight: bold;
}
}
&-middle {
font-size: 36px;
font-weight: normal;
}
&-left div {
background: url("@/assets/images/plaze/circle_1.png");
background-repeat: no-repeat;
background-size: 100% 100%;
margin-right: 5px;
color: #f63c2b;
}
&-right div {
background: url("@/assets/images/plaze/circle_2.png");
background-repeat: no-repeat;
background-size: 100% 100%;
margin-left: 5px;
color: #2730c9;
}
}
&-text {
text-align: center;
font-size: 16px;
.red {
color: #FF0000FF;
}
}
&-slider {
display: flex;
align-items: center;
width: 70%;
margin: 20px auto 0;
font-size: 14px;
font-weight: normal;
}
}
&-btn {
display: block;
width: calc(100% - 20px);
margin: 20px auto 0;
}
}
.van-cell {
color: white;
background: #1C62B8;
border: 1px solid #7FD7EB;
border-radius: 5px;
padding: 2px 8px;
&__value--alone {
color: white;
}
&::after {
border-bottom: none
}
}
.van-slider {
margin: 0 5px;
}
.van-slider__button {
border: 2px solid #B00000;
}
</style>
pages/customer.vue
浏览文件 @ 866e895f
......@@ -2,41 +2,45 @@
<div class="customer">
<div class="customer-title">请您选择服务内容</div>
<div class="customer-line"></div>
<div v-for="item in list" :key="item.key" class="customer-item">
<div class="customer-item-img">
<img :src="require(`@/assets/images/customer/${item.img}.png`) ">
</div>
<div class="customer-item-text">
<div>{{item.title}}</div>
<div>{{item.content}}</div>
</div>
<div v-for="item in customerList" :key="item.id">
<a :href="`${protocol}//${item.url}`" target="_blank">
<div class="customer-item">
<div class="customer-item-img">
<img :src="require(`@/assets/images/customer/avator.png`) ">
</div>
<div class="customer-item-text">
<div>{{item.title}}</div>
<div>{{item.content}}</div>
</div>
</div>
</a>
</div>
</div>
</template>
<script>
import { getCustomerList } from '~/api/common.js'
export default {
name: 'CustomerPage',
data() {
return {
list: [{
title: '在线客服',
content: '追求卓越 尽善尽美',
img: 'avator',
},
{
title: 'VIP充值通道',
content: '尊贵一对一 一触即发',
img: 'avator',
},
{
title: '投诉与建议',
content: '邮箱：',
img: 'avator',
}]
customerList: [],
protocol: window.location.protocol
};
},
methods: {}
created() {
this.getCustomerList()
},
methods: {
async getCustomerList() {
try {
const res = await getCustomerList()
this.customerList = res.data.rows
} catch (err) {
console.log(err)
}
},
}
}
</script>
......@@ -48,7 +52,7 @@ export default {
width: 100%;
height: 100%;
min-height: 100vh;
padding: 50px 0 50px;
padding: 50px 0 60px;
&-title {
position: relative;
......@@ -78,13 +82,17 @@ export default {
font-family: PingFang SC, Arial;
display: flex;
align-items: center;
&-img {
width: 40%;
text-align: center;
img {
width: 90px;;
width: 90px;
;
}
}
&-text {
div:first-child {
margin-bottom: 10px;
......
pages/index.vue
浏览文件 @ 866e895f
<template>
<div class="index">
<van-swipe class="my-swipe" :autoplay="3000" indicator-color="white">
<van-swipe class="index-swipe" :autoplay="3000" indicator-color="white">
<van-swipe-item v-for="item in bannerList" :key="item.id">
<img :src="`${item.url}`" />
<img class="index-swipe-img" :src="`${item.url}`" />
</van-swipe-item>
</van-swipe>
<img class="index-recommend" src="@/assets/images/index/recommend.png">
<div class="recommend-item">
<div>
<div class="recommend-title">德国淘汰西班牙进入八强</div>
<div class="recommend-contain">德国西班牙进入死亡之组，谁最终进入八强，拭目以待</div>
<div class="recommend-dice">
<img src="@/assets/images/index/dice.png">
<div>1.32</div>
<img style="margin-left: 5px;" src="@/assets/images/index/dice.png">
<div>1.32</div>
<div class="index-content">
<div class="index-box">
<div class="index-box-type">{{ getTypeText(recommendObj.clasyId) }}</div>
<div class="index-box-title">{{ recommendObj.title }}</div>
<div class="index-box-odds">
<div class="index-box-odds-left">
<div>{{ recommendObj.winOdds }}</div>
{{recommendObj.winName}}
</div>
<div class="index-box-odds-middle">VS</div>
<div class="index-box-odds-right">
{{recommendObj.loseName}}
<div>{{ recommendObj.loseOdds }}</div>
</div>
</div>
</div>
<img src="@/assets/images/index/person.png">
</div>
<div class="recommend-item">
<div>
<div class="recommend-title">德国淘汰西班牙进入八强</div>
<div class="recommend-contain">德国西班牙进入死亡之组，谁最终进入八强，拭目以待</div>
<div class="recommend-dice">
<img src="@/assets/images/index/dice.png">
<div>1.32</div>
<img style="margin-left: 5px;" src="@/assets/images/index/dice.png">
<div>1.32</div>
</div>
</div>
<img src="@/assets/images/index/person.png">
</div>
<div class="recommend-item">
<div>
<div class="recommend-title">德国淘汰西班牙进入八强</div>
<div class="recommend-contain">德国西班牙进入死亡之组，谁最终进入八强，拭目以待</div>
<div class="recommend-dice">
<img src="@/assets/images/index/dice.png">
<div>1.32</div>
<img style="margin-left: 5px;" src="@/assets/images/index/dice.png">
<div>1.32</div>
<div class="index-box-duel">
<span> {{ recommendObj.nums }}</span>人正在对决
</div>
<img class="index-box-btn" src="@/assets/images/index/btn.png" />
</div>
<img src="@/assets/images/index/person.png">
</div>
<div class="recommend-item">
<div>
<div class="recommend-title">德国淘汰西班牙进入八强</div>
<div class="recommend-contain">德国西班牙进入死亡之组，谁最终进入八强，拭目以待</div>
<div class="recommend-dice">
<img src="@/assets/images/index/dice.png">
<div>1.32</div>
<img style="margin-left: 5px;" src="@/assets/images/index/dice.png">
<div>1.32</div>
<div class="index-area">
<div>
<img src="@/assets/images/index/box_1.png" @click="$router.push('/challenge')" />
</div>
</div>
<img src="@/assets/images/index/person.png">
</div>
<div class="recommend-item">
<div>
<div class="recommend-title">德国淘汰西班牙进入八强</div>
<div class="recommend-contain">德国西班牙进入死亡之组，谁最终进入八强，拭目以待</div>
<div class="recommend-dice">
<img src="@/assets/images/index/dice.png">
<div>1.32</div>
<img style="margin-left: 5px;" src="@/assets/images/index/dice.png">
<div>1.32</div>
<div>
<img src="@/assets/images/index/box_2.png" />
<img class="index-img" src="@/assets/images/index/box_3.png" />
</div>
</div>
<img src="@/assets/images/index/person.png">
</div>
<img class="index-battle" src="@/assets/images/index/battle.png">
</div>
</template>
<script>
import { getBanner } from '~/api/user.js'
import { getBanner, getDictType } from "~/api/common.js";
import { getRecommendList } from "~/api/recommend.js";
export default {
name: 'IndexPage',
name: "IndexPage",
data() {
return {
bannerList: [],
betType: [],
recommendObj: {},
};
},
created() {
this.getBanner()
this.getBanner();
this.getDictType();
this.getRecommendList();
},
methods: {
getTypeText(type) {
let result = ''
this.betType.forEach(x => {
if (x.dictValue == type) {
result = x.dictLabel
}
})
return result
},
async getDictType() {
try {
const type = 'ums_bet_type'
const res = await getDictType(type)
this.betType = res.data
} catch (err) {
console.log(err)
}
},
async getBanner() {
try {
const res = await getBanner()
this.bannerList = res.data.rows
const res = await getBanner();
this.bannerList = res.data.rows;
} catch (err) {
console.log(err);
}
},
async getRecommendList() {
try {
const res = await getRecommendList()
this.recommendObj = res.data.rows[0]
} catch (err) {
console.log(err)
}
},
}
}
},
};
</script>
<style lang="scss" scoped>
<style lang="scss" scoped>
.index {
background: url("@/assets/images/index/bg.png");
background-repeat: no-repeat;
......@@ -115,63 +102,114 @@ export default {
width: 100%;
height: 100%;
min-height: 100vh;
padding-bottom: 70px;
padding-bottom: 60px;
.index-recommend {
margin-top: 5px;
&-swipe-img {
width: 100%;
}
.index-battle {
display: block;
margin: 15px auto 0;
width: 200px;
&-content {
padding: 15px;
}
.recommend-item {
width: 90%;
height: 90px;
margin: 5px auto 10px;
background-color: #068EF6FF;
border-radius: 5px;
display: flex;
padding: 3px 5px;
}
&-box {
background: url("@/assets/images/index/box_bg.png");
background-repeat: no-repeat;
background-size: 100% 100%;
width: 100%;
height: 250px;
margin-bottom: 10px;
color: white;
font-family: PingFang SC, Arial;
font-weight: bold;
&-type {
padding-left: 15px;
height: 34px;
line-height: 34px;
}
.recommend-dice {
display: flex;
font-size: 12px;
font-family: PingFang SC;
font-weight: 500;
color: #FFFFFF;
margin: 5px 0;
img {
width: 10px;
margin-right: 5px;
&-title {
text-align: center;
margin-top: 13px;
}
&-odds {
display: flex;
justify-content: space-around;
align-items: center;
margin-top: 15px;
&-left,
&-right {
display: flex;
align-items: center;
div {
border-radius: 50%;
width: 65px;
height: 65px;
display: flex;
align-items: center;
justify-content: center;
font-size: 24px;
font-weight: bold;
}
}
&-left div {
background: url("@/assets/images/plaze/circle_1.png");
background-repeat: no-repeat;
background-size: 100% 100%;
margin-right: 5px;
color: #f63c2b;
}
&-right div {
background: url("@/assets/images/plaze/circle_2.png");
background-repeat: no-repeat;
background-size: 100% 100%;
margin-left: 5px;
color: #2730c9;
}
&-middle {
font-size: 40px;
font-weight: normal;
}
}
}
.recommend-title {
font-family: "modeng";
color: #E0F3FFFF;
-webkit-text-stroke: 1px #02357AFF;
margin: 5px 0;
&-duel {
text-align: center;
span {
font-size: 24px;
font-weight: normal;
margin-right: 5px;
}
}
&-btn {
display: block;
margin: 15px auto;
}
}
.recommend-contain {
font-family: "PingFang-SC-Medium";
color: #73CAFFFF;
font-weight: 500;
font-size: 12px;
margin: 5px 0;
&-area {
display: flex;
justify-content: space-between;
div {
width: 49%;
img {
width: 100%;
}
}
}
.my-swipe .van-swipe-item {
color: #fff;
font-size: 20px;
line-height: 150px;
text-align: center;
background-color: #39a9ed;
&-img {
margin-top: 5px;
}
}
</style>
pages/login.vue
浏览文件 @ 866e895f
......@@ -15,6 +15,8 @@
</template>
<script>
import { login } from '~/api/user'
import { setToken } from '~/assets/scripts/auth'
export default {
name: 'LoginPage',
data() {
......@@ -27,16 +29,17 @@ export default {
gotoRegister() {
this.$router.push('/register')
},
login() {
async login() {
if (this.email === '' || this.password === '') return this.$toast('请输入内容')
try {
const payload = {
email: this.email,
password: this.password,
}
this.$store.dispatch("user/Login", payload)
const res = await login(payload)
setToken(res.data.token)
this.getInfo();
setTimeout(() => {
this.getInfo();
this.$router.push('/')
}, 1000)
} catch (err) {
......@@ -44,11 +47,12 @@ export default {
}
},
getInfo() {
try {
this.$store.dispatch("user/GetInfo")
} catch (err) {
this.$toast(err);
}
this.$store
.dispatch("user/GetInfo")
.then(() => { })
.catch((err) => {
console.error(err);
});
},
}
}
......
pages/my.vue → pages/my/index.vue
浏览文件 @ 866e895f
<template>
<div class="my">
<div class="my-customer">
<img
src="@/assets/images/my/customer.png"
@click="$router.push('/customer')"
/>
<img src="@/assets/images/my/customer.png" @click="$router.push('/customer')" />
</div>
<div class="my-header">
<div v-if="loginStatus">
<img
:src="
require(`@/assets/images/my/${
userInfo.avator ? userInfo.avator : 'avator'
}.png`)
"
/>
<img :src="
require(`@/assets/images/my/${
userInfo.avator ? userInfo.avator : 'avator'
}.png`)
" />
{{ userInfo.userName }}
</div>
<div v-else>
......@@ -47,10 +42,10 @@
<div class="my-box-title">个人中心</div>
<div class="my-box-line"></div>
<div class="my-box-list">
<nuxt-link to="/securityCenter">
<nuxt-link to="my/info">
<img src="@/assets/images/my/icon_4.png" />个人资料
</nuxt-link>
<nuxt-link to="/securityCenter">
<nuxt-link to="/accountManage">
<img src="@/assets/images/my/icon_5.png" />账户管理
</nuxt-link>
<nuxt-link to="/securityCenter">
......@@ -97,6 +92,8 @@ export default {
loginStatus: !!getToken(),
};
},
created() {
},
computed: {
...mapState({
userInfo: (state) => state.user.userInfo,
......
pages/my/info.vue 0 → 100644
浏览文件 @ 866e895f
<template>
<div class="page">
<div class="page-header">
<span @click="$router.go(-1)">&lt;</span>
个人资料
</div>
<img class="page-avator" :src="
userInfo.avator ? userInfo.avator : require(`@/assets/images/my/avator.png`)
" />
<van-uploader class="page-upload" :after-read="updateAvatar">
<van-button>设置新照片</van-button>
</van-uploader>
<div class="page-item">
<div class="page-item-title">昵称</div>
<div v-if="!modifyStatus" class="page-item-info">{{ userInfo.nickName }}</div>
<input v-else v-model="personalInfo.nickName" type="text" />
</div>
<div class="page-item">
<div class="page-item-title">性别</div>
<div v-if="!modifyStatus" class="page-item-info">{{ userInfo.sex == 0 ? '男' : '女' }}</div>
<div v-else style="display:flex">
<input type="radio" id="0" value="0" v-model="personalInfo.sex " />
<label for="0" style="margin-right: 20px;">男</label>
<input type="radio" id="1" value="1" v-model="personalInfo.sex " />
<label for="1">女</label>
</div>
</div>
<div class="page-item">
<div class="page-item-title">邮箱</div>
<div v-if="!modifyStatus" class="page-item-info">{{ userInfo.email }}</div>
<input v-else v-model="personalInfo.email" type="text" />
</div>
<div class="page-item">
<div class="page-item-title">电话</div>
<div v-if="!modifyStatus" class="page-item-info">{{ userInfo.phonenumber }}</div>
<input v-else v-model="personalInfo.phonenumber" type="text" />
</div>
<div class="page-btn">
<img src="@/assets/images/my/btn_1.png" @click="modifyStatus = true" />
<img v-if="modifyStatus" src="@/assets/images/my/btn_2.png" @click="updateInfo" />
<img src="@/assets/images/my/btn_3.png" />
</div>
</div>
</template>
<script>
import { mapState } from "vuex";
import { updateInfo, updateAvatar } from '~/api/user.js'
export default {
name: "InfoPage",
data() {
return {
modifyStatus: false,
personalInfo: {},
};
},
computed: {
...mapState({
userInfo: (state) => state.user.userInfo,
}),
},
mounted() {
this.personalInfo = { ...this.userInfo }
},
methods: {
async updateAvatar(file) {
try {
const res = await updateAvatar(file.content)
this.$toast(res.data)
this.$store.dispatch('user/GetInfo')
} catch (err) {
this.$toast(err)
}
},
async updateInfo() {
try {
const payload = {
nickname: this.personalInfo.nickName,
sex: this.personalInfo.sex,
phonenumber: this.personalInfo.phonenumber,
}
const res = await updateInfo(payload)
this.$toast(res.data)
this.modifyStatus = false
this.$store.dispatch('user/GetInfo')
} catch (err) {
this.$toast(err)
}
},
},
};
</script>
<style lang="scss" scoped>
.page {
background: url("@/assets/images/index/bg.png");
background-repeat: no-repeat;
background-size: 100% 100%;
width: 100%;
height: 100%;
min-height: 100vh;
padding-bottom: 60px;
&-header {
color: white;
text-align: center;
font-size: 20px;
font-weight: bold;
font-family: PingFang SC, Arial;
height: 50px;
line-height: 50px;
border-bottom: 1px solid #d9d9d9;
span {
position: absolute;
left: 20px;
font-weight: normal;
}
}
&-avator {
display: block;
margin: 10px auto 0;
width: 100px;
height: 100px;
border-radius: 50%;
}
&-upload {
display: flex;
justify-content: center;
border-bottom: 1px solid #d9d9d9;
}
&-item {
width: 100%;
color: white;
font-family: PingFang SC, Arial;
font-size: 18px;
padding: 15px 20px;
display: flex;
align-items: center;
border-bottom: 1px solid #d9d9d9;
&-title {
width: 20%;
}
&-info {
width: 80%;
text-align: center;
padding: 5px 0;
}
input {
width: 80%;
padding: 5.5px 0;
color: black;
outline: none;
border: none;
text-align: center;
&::placeholder {
color: #cccccc;
}
}
}
&-btn {
text-align: center;
margin-top: 10px;
img {
margin-top: 10px;
&:last-child {
margin-top: 50px;
}
}
}
}
.van-button {
color: #35bafd;
background-color: #2730c9;
border: none;
}
</style>
pages/plaza.vue
浏览文件 @ 866e895f
<template>
<div class="plaza">
<div v-for="item in list" :key="item.key" class="plaza-item">
<div class="plaza-item-header">{{item.type}}</div>
<div v-for="item in betList" :key="item.id" class="plaza-item" :class="`plaza-item-${item.clasyId}`">
<div class="plaza-item-header">
<span>{{ getTypeText(item.clasyId) }}</span>
{{ item.title }}
</div>
<div class="plaza-item-content">
<div class="plaza-item-title">{{item.title}}</div>
<div class="plaza-item-title">赔率</div>
<div class="plaza-item-odds">
<div class="plaza-item-odds-left">
<div>{{item.odds1}}</div>
胜
<div>{{ item.win }}</div>
{{ item.winName }}
</div>
<div class="plaza-item-odds-middle">VS</div>
<div class="plaza-item-odds-right">
胜
<div>{{item.odds2}}</div>
{{ item.loseName }}
<div>{{ item.lose }}</div>
</div>
</div>
<div class="plaza-item-text">{{item.title}}</div>
<div class="plaza-item-text">接受本次挑战您需投入{ {{item.amount}} }元，如果结果为{ {{item.result}} },您将获得收益{ {{item.income}} }
<div class="plaza-item-text">
{{ item.name }}发起挑战<span class="red">{{ item.result }}</span><br />
接受挑战需投入<span class="blue">¥{{ item.amount }}</span> <br />
如结果为平安无事将赢得<span class="blue">¥{{ item.income }}</span>
</div>
<div class="plaza-item-btn">
<img src="@/assets/images/plaze/share.png">
<img src="@/assets/images/plaze/share.png" />
<div class="plaza-item-btn-group">
<img src="@/assets/images/plaze/copy.png">
<img src="@/assets/images/plaze/challenge.png">
<img src="@/assets/images/plaze/copy.png" />
<img src="@/assets/images/plaze/challenge.png" />
</div>
</div>
</div>
......@@ -31,53 +36,90 @@
</template>
<script>
import { getDictType } from "~/api/common.js";
import { getBetList } from "~/api/betorder.js";
export default {
name: 'PlazaPage',
name: "PlazaPage",
data() {
return {
list: [{
type: '体育',
title: '德国淘汰西班牙进入八强',
odds1: 1.35,
odds2: 1.35,
amount: 42.05,
result: '负',
income: 135
},
{
type: '体育',
title: '德国淘汰西班牙进入八强',
odds1: 1.35,
odds2: 1.35,
amount: 42.05,
result: '负',
income: 135
},
{
type: '体育',
title: '德国淘汰西班牙进入八强',
odds1: 1.35,
odds2: 1.35,
amount: 42.05,
result: '负',
income: 135
},
{
type: '体育',
title: '德国淘汰西班牙进入八强',
odds1: 1.35,
odds2: 1.35,
amount: 42.05,
result: '负',
income: 135
}]
list: [
{
type: 1,
title: "德国淘汰西班牙进入八强",
betarea1: "胜",
betarea2: "负",
odds1: 1.35,
odds2: 3.21,
amount: 50,
result: "胜",
income: 115,
name: "TT",
},
{
type: 2,
title: "拜登访台",
betarea1: "必打无疑",
betarea2: "平安无事",
odds1: 1.35,
odds2: 3.21,
amount: 50,
result: "必打无疑",
income: 115,
name: "TT",
},
{
type: 3,
title: "下个版本剑姬加强 拷贝",
betarea1: "加强",
betarea2: "不加强",
odds1: 1.35,
odds2: 3.21,
amount: 50,
result: "加强",
income: 115,
name: "TT",
},
],
betType: [],
betList: [],
};
},
methods: {}
}
created() {
this.getDictType();
this.getBetList();
},
methods: {
getTypeText(type) {
let result = ''
this.betType.forEach(x => {
if (x.dictValue == type) {
result = x.dictLabel
}
})
return result
},
async getDictType() {
try {
const type = 'ums_bet_type'
const res = await getDictType(type)
this.betType = res.data
} catch (err) {
console.log(err)
}
},
async getBetList() {
try {
const res = await getBetList()
this.betList = res.data.rows
} catch (err) {
console.log(err)
}
},
},
};
</script>
<style lang="scss" scoped>
<style lang="scss" scoped>
.plaza {
background: url("@/assets/images/index/bg.png");
background-repeat: no-repeat;
......@@ -85,12 +127,9 @@ export default {
width: 100%;
height: 100%;
min-height: 100vh;
padding:50px 0 50px;
padding: 50px 0 60px;
&-item {
background: url("@/assets/images/plaze/bg.png");
background-repeat: no-repeat;
background-size: 100% 100%;
width: 90%;
height: 275px;
margin: 0 auto 10px;
......@@ -103,6 +142,12 @@ export default {
padding-left: 10px;
display: flex;
align-items: center;
justify-content: center;
span {
position: absolute;
left: 7%;
}
}
&-content {
......@@ -113,7 +158,6 @@ export default {
text-align: center;
padding: 5px 0;
width: 70%;
background: linear-gradient(83deg, #37BBFC 0%, #13A4FF 57%, #32B8FD 99%);
margin: 0 auto;
}
......@@ -122,65 +166,118 @@ export default {
justify-content: space-between;
align-items: center;
margin-top: 10px;
padding: 0 10px;
&-left,
&-right {
display: flex;
align-items: center;
font-size: 16px;
div {
border-radius: 50%;
width: 70px;
height: 70px;
width: 65px;
height: 65px;
display: flex;
align-items: center;
justify-content: center;
font-size: 24px;
font-weight: normal;
font-weight: bold;
}
}
&-middle {
font-size: 36px;
font-family: Arial;
font-weight: normal;
}
&-left div {
background: #008AD6;
margin-right: 10px;
background: url("@/assets/images/plaze/circle_1.png");
background-repeat: no-repeat;
background-size: 100% 100%;
margin-right: 5px;
color: #f63c2b;
}
&-right div {
background: #FF6161;
margin-left: 10px;
background: url("@/assets/images/plaze/circle_2.png");
background-repeat: no-repeat;
background-size: 100% 100%;
margin-left: 5px;
color: #2730c9;
}
}
&-text {
text-align: center;
font-size: 14px;
padding: 0 18px;
line-height: 24px;
.red {
color: #f63c2b;
}
.blue {
color: #2730c9;
font-weight: normal;
}
}
&-btn {
display: flex;
justify-content: space-between;
justify-content: flex-end;
align-items: center;
padding: 0 18px;
margin-top: 3px;
padding: 0 20px;
margin-top: 5px;
img {
height: 30px;
height: 25px;
}
&-group {
margin-left: 20px;
img {
height: 40px;
height: 35px;
margin-left: 10px;
}
}
}
}
&-item-1 {
background: url("@/assets/images/plaze/bg_1.png");
background-repeat: no-repeat;
background-size: 100% 100%;
.plaza-item-title {
background: url("@/assets/images/plaze/title_1.png");
background-repeat: no-repeat;
background-size: 100% 100%;
}
}
&-item-2 {
background: url("@/assets/images/plaze/bg_2.png");
background-repeat: no-repeat;
background-size: 100% 100%;
.plaza-item-title {
background: url("@/assets/images/plaze/title_2.png");
background-repeat: no-repeat;
background-size: 100% 100%;
}
}
&-item-3 {
background: url("@/assets/images/plaze/bg_3.png");
background-repeat: no-repeat;
background-size: 100% 100%;
.plaza-item-title {
background: url("@/assets/images/plaze/title_3.png");
background-repeat: no-repeat;
background-size: 100% 100%;
}
}
}
</style>
pages/securityCenter/modifyFundPassword.vue
浏览文件 @ 866e895f
......@@ -6,11 +6,7 @@
</div>
<div class="page-item">
<div>原始密码</div>
<input
v-model="oldPassword"
type="password"
placeholder="请输入原始资金密码"
/>
<input v-model="oldPassword" type="password" placeholder="请输入原始资金密码" />
</div>
<div class="page-item">
<div>新密码</div>
......@@ -18,17 +14,14 @@
</div>
<div class="page-item">
<div>确认密码</div>
<input
v-model="comfirmPassword"
type="password"
placeholder="请再次确认新密码"
/>
<input v-model="comfirmPassword" type="password" placeholder="请再次确认新密码" />
</div>
<img class="page-btn" src="@/assets/images/securityCenter/submit.png" />
<img @click="updateFundPasswd" class="page-btn" src="@/assets/images/securityCenter/submit.png" />
</div>
</template>
<script>
import { updateFpasswd } from '~/api/user.js'
export default {
name: "ModifyFundPasswordPage",
data() {
......@@ -38,7 +31,25 @@ export default {
comfirmPassword: "",
};
},
methods: {},
methods: {
async updateFundPasswd() {
if (this.oldPassword === '' || this.comfirmPassword === '' || this.newPassword === '') return this.$toast('请输入内容')
try {
const payload = {
oldPasswd: this.oldPassword,
confirmPasswd: this.comfirmPassword,
newPasswd: this.newPassword,
}
const res = await updateFpasswd(payload)
this.$toast(res.data)
setTimeout(() => {
this.$router.push('/my')
}, 1000);
} catch (err) {
this.$toast(err)
}
},
},
};
</script>
......@@ -61,6 +72,7 @@ export default {
height: 50px;
line-height: 50px;
border-bottom: 1px solid white;
span {
position: absolute;
left: 20px;
......@@ -74,6 +86,7 @@ export default {
font-family: PingFang SC, Arial;
font-size: 18px;
padding: 10px 20px;
input {
width: 100%;
padding: 15px 10px;
......@@ -82,11 +95,13 @@ export default {
border: none;
margin-top: 5px;
font-size: 14px;
&::placeholder {
color: #CCCCCC;
}
}
}
&-btn {
display: block;
margin: 20px auto;
......
pages/securityCenter/modifyLoginPassword.vue
浏览文件 @ 866e895f
......@@ -24,11 +24,13 @@
placeholder="请再次确认新密码"
/>
</div>
<img class="page-btn" src="@/assets/images/securityCenter/submit.png" />
<img @click="updatePasswd" class="page-btn" src="@/assets/images/securityCenter/submit.png" />
</div>
</template>
<script>
import { updatePasswd } from '~/api/user.js'
import { removeToken } from '~/assets/scripts/auth'
export default {
name: "ModifyLoginPasswordPage",
data() {
......@@ -38,7 +40,26 @@ export default {
comfirmPassword: "",
};
},
methods: {},
methods: {
async updatePasswd() {
if (this.oldPassword === '' || this.comfirmPassword === '' || this.newPassword === '') return this.$toast('请输入内容')
try {
const payload = {
oldPasswd: this.oldPassword,
confirmPasswd: this.comfirmPassword,
newPasswd: this.newPassword,
}
const res = await updatePasswd(payload)
this.$toast(res.data)
setTimeout(() => {
removeToken()
this.$router.push('/login')
}, 1000);
} catch (err) {
this.$toast(err)
}
},
},
};
</script>
......
pages/securityCenter/resetFundPassword.vue
浏览文件 @ 866e895f
......@@ -6,13 +6,8 @@
</div>
<div class="page-item">
<div>邮箱</div>
<input
v-model="email"
type="text"
class="email"
placeholder="请输入邮箱"
/>
<span>发送</span>
<input v-model="email" type="text" class="email" placeholder="请输入邮箱" />
<span @click="getEmailCode">发送</span>
</div>
<div class="page-item">
<div>邮箱验证码</div>
......@@ -24,17 +19,14 @@
</div>
<div class="page-item">
<div>确认密码</div>
<input
v-model="comfirmPassword"
type="password"
placeholder="请再次确认资金密码"
/>
<input v-model="comfirmPassword" type="password" placeholder="请再次确认资金密码" />
</div>
<img class="page-btn" src="@/assets/images/securityCenter/submit.png" />
<img @click="resetFundPasswd" class="page-btn" src="@/assets/images/securityCenter/submit.png" />
</div>
</template>
<script>
import { sendEmail, resetFpasswd } from '~/api/user.js'
export default {
name: "ResetFundPasswordPage",
data() {
......@@ -45,7 +37,35 @@ export default {
comfirmPassword: "",
};
},
methods: {},
methods: {
async getEmailCode() {
if (this.email === '') return this.$toast('请输入邮箱')
try {
const res = await sendEmail(this.email)
this.$toast(res.data)
} catch (err) {
this.$toast(err)
}
},
async resetFundPasswd() {
if (this.email === '' || this.verifyCode === '' || this.comfirmPassword === '' || this.password === '') return this.$toast('请输入内容')
try {
const payload = {
code: this.verifyCode,
confirmPasswd: this.comfirmPassword,
email: this.email,
newPasswd: this.password,
}
const res = await resetFpasswd(payload)
this.$toast(res.data)
setTimeout(() => {
this.$router.push('/my')
}, 1000);
} catch (err) {
this.$toast(err)
}
},
},
};
</script>
......@@ -68,6 +88,7 @@ export default {
height: 50px;
line-height: 50px;
border-bottom: 1px solid white;
span {
position: absolute;
left: 20px;
......@@ -81,6 +102,7 @@ export default {
font-family: PingFang SC, Arial;
font-size: 18px;
padding: 10px 20px;
input {
width: 100%;
padding: 15px 10px;
......@@ -89,19 +111,23 @@ export default {
border: none;
margin-top: 5px;
font-size: 14px;
&::placeholder {
color: #cccccc;
}
}
.email {
padding-right: 50px;
}
span {
position: absolute;
margin: 17px 0 0 -40px;
font-size: 14px;
}
}
&-btn {
display: block;
margin: 20px auto;
......
pages/securityCenter/resetLoginPassword.vue
浏览文件 @ 866e895f
......@@ -6,13 +6,8 @@
</div>
<div class="page-item">
<div>邮箱</div>
<input
v-model="email"
type="text"
class="email"
placeholder="请输入邮箱"
/>
<span>发送</span>
<input v-model="email" type="text" class="email" placeholder="请输入邮箱" />
<span @click="getEmailCode">发送</span>
</div>
<div class="page-item">
<div>邮箱验证码</div>
......@@ -24,17 +19,15 @@
</div>
<div class="page-item">
<div>确认密码</div>
<input
v-model="comfirmPassword"
type="password"
placeholder="请再次确认登陆密码"
/>
<input v-model="comfirmPassword" type="password" placeholder="请再次确认登陆密码" />
</div>
<img class="page-btn" src="@/assets/images/securityCenter/submit.png" />
<img @click="resetPasswd" class="page-btn" src="@/assets/images/securityCenter/submit.png" />
</div>
</template>
<script>
import { sendEmail, resetPasswd } from '~/api/user.js'
import { removeToken } from '~/assets/scripts/auth'
export default {
name: "ResetLoginPasswordPage",
data() {
......@@ -45,7 +38,36 @@ export default {
comfirmPassword: "",
};
},
methods: {},
methods: {
async getEmailCode() {
if (this.email === '') return this.$toast('请输入邮箱')
try {
const res = await sendEmail(this.email)
this.$toast(res.data)
} catch (err) {
this.$toast(err)
}
},
async resetPasswd() {
if (this.email === '' || this.verifyCode === '' || this.comfirmPassword === '' || this.password === '') return this.$toast('请输入内容')
try {
const payload = {
code: this.verifyCode,
confirmPasswd: this.comfirmPassword,
email: this.email,
newPasswd: this.password,
}
const res = await resetPasswd(payload)
this.$toast(res.data)
setTimeout(() => {
removeToken()
this.$router.push('/login')
}, 1000);
} catch (err) {
this.$toast(err)
}
},
},
};
</script>
......@@ -68,6 +90,7 @@ export default {
height: 50px;
line-height: 50px;
border-bottom: 1px solid white;
span {
position: absolute;
left: 20px;
......@@ -81,6 +104,7 @@ export default {
font-family: PingFang SC, Arial;
font-size: 18px;
padding: 10px 20px;
input {
width: 100%;
padding: 15px 10px;
......@@ -89,19 +113,23 @@ export default {
border: none;
margin-top: 5px;
font-size: 14px;
&::placeholder {
color: #cccccc;
}
}
.email {
padding-right: 50px;
}
span {
position: absolute;
margin: 17px 0 0 -40px;
font-size: 14px;
}
}
&-btn {
display: block;
margin: 20px auto;
......
plugins/route.js 0 → 100644
浏览文件 @ 866e895f
// import { getToken } from '~/assets/scripts/auth'
// export default ({ app, store }) => {
// app.router.beforeEach((to, from, next) => {
// const isLogin = getToken()
// const routeTargetName = to.name
// const checkLoginRouteNames = [
// 'index',
// 'plaza',
// 'customer',
// 'my',
// 'login',
// 'register',
// ]
// if (checkLoginRouteNames.includes(routeTargetName) === true && !isLogin) {
// next()
// } else {
// next('/login')
// }
// })
// }
store/user.js
浏览文件 @ 866e895f
import { login, getInfo, logout } from '~/api/user'
import { getToken, setToken, removeToken } from '~/assets/scripts/auth'
import { getInfo } from '~/api/user'
const user = {
state: {
token: getToken(),
userInfo: {},
},
mutations: {
SET_TOKEN: (state, token) => {
state.token = token
},
SET_USER: (state, user) => {
state.userInfo = user
},
SET_UNREAD: (state, user) => {
state.unRead = user
}
},
actions: {
Login({ commit }, userInfo) {
return new Promise((resolve, reject) => {
login(userInfo).then(res => {
setToken(res.data.token)
commit('SET_TOKEN', res.data.token)
setUserInfo(res.user, commit)
resolve()
}).catch(error => {
reject(error)
})
})
},
GetInfo({ commit }) {
return new Promise((resolve, reject) => {
getInfo().then(res => {
......@@ -42,26 +21,10 @@ const user = {
reject(error)
})
})
},
LogOut({ commit }) {
return new Promise((resolve, reject) => {
logout().then(res => {
logOut(commit)
resolve()
}).catch(error => {
logOut(commit)
reject(error)
})
})
},
}
}
}
export const logOut = (commit) => {
commit('SET_TOKEN', '')
removeToken()
}
export const setUserInfo = (res, commit) => {
commit('SET_USER', res)
}
......
Markdown 格式
0% 或
您添加了 0 人 到此讨论。请谨慎行事。
请先完成此评论的编辑！
请 注册 或者 后发表评论