theluyuan/beelink
1
0
Fork 0
Code Issues Pull Requests Releases Wiki Activity

xbx #40

Merged
theluyuan merged 4 commits from xbx into master 2020-10-14 07:30:31 +00:00
Conversation 0 Commits 4 Files Changed 10 +248 -96
10 changed files with 248 additions and 96 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

2
src/App.vue
View File

@ -13,7 +13,7 @@ import { getValue } from './utils/common';
export default defineComponent({ export default defineComponent({
setup(){ setup(){
if(getValue('token')){ if(getValue('token')){
store.commit("login") store.commit("login", true)
store.dispatch("setUserInfo"); store.dispatch("setUserInfo");
} }
} }

2
src/api/base.ts
View File

@ -10,9 +10,9 @@ export interface Get {
} }
axios.interceptors.response.use((response)=>{ axios.interceptors.response.use((response)=>{
return response; return response;
},(error)=>{ },(error)=>{
message.error(error.response.data.message) message.error(error.response.data.message)
return Promise.reject(error) return Promise.reject(error)
}) })

41
src/api/index.ts
View File

@ -23,7 +23,7 @@ export async function loginpass(phone: string, password: string){
message.error("存储错误, 请允许网页使用本地存储！") message.error("存储错误, 请允许网页使用本地存储！")
}else{ }else{
setToken(); setToken();
store.commit("login"); store.commit("login", true);
store.dispatch("setUserInfo"); store.dispatch("setUserInfo");
router.push("/mine/archives") router.push("/mine/archives")
} }
@ -144,11 +144,11 @@ export async function getlivelist(data?:any) {
* 列表统计 * 列表统计
*/ */
interface StatisticList{ interface StatisticList{
liveInfo: any; liveInfo: any;
videoInfo: any; videoInfo: any;
studentInfo: any; studentInfo: any;
} }
export async function getstatisticlist() { export async function getstatisticlist() {
const res = await get<StatisticList>('statistics'); const res = await get<StatisticList>('statistics');
@ -166,8 +166,31 @@ export async function getstatisticlist() {
interface Liveaddrule{ interface Liveaddrule{
code:number, code:number,
msg:string msg:string
} }
export async function liveadd(data:any) { export async function liveadd(data:any) {
const res = await post<Liveaddrule>('live',data); const res = await post<Liveaddrule>('live',data);
console.log(res) console.log(res)
} }
/**
* 发送验证码
* @param phone 手机号
* @param type 国外1 国内0
*/
interface SendSms{
code: number;
msg: string;
}
export async function sendsms(phone: string, type: number): Promise<boolean>{
const res = await post<SendSms>("SendSms", {phone, type});
console.log(res);
if(res.code == 0){
message.success(res.msg);
return true;
}else{
message.error(res.msg);
return false;
}
}

9
src/components/Menu.vue
View File

@ -21,7 +21,7 @@
<div class="item" :class="{'selbottom': selnum == list.length - 1}"></div> <div class="item" :class="{'selbottom': selnum == list.length - 1}"></div>
</div> </div>
<div class="item loginout"> <div class="item loginout">
<div class="route"> <div class="route" @click="logout">
<img src="../static/images/tuichu.png" alt="" class="icon"> <img src="../static/images/tuichu.png" alt="" class="icon">
<div class="title"> <div class="title">
帐号退出 帐号退出
@ -190,12 +190,17 @@ export default defineComponent({
} }
function logout(): void{
store.commit("login", false)
router.replace("/");
}
return{ return{
list, list,
routeto, routeto,
selnum, selnum,
userinfo userinfo,
logout
} }
} }
}) })

104
src/components/NavTop.vue
View File

@ -12,22 +12,86 @@
</div> </div>
<div style="width: 100%"></div> <div style="width: 100%"></div>
<div class="setting"> <div class="setting">
<div class="item"> <a-dropdown :trigger="['click']" :getPopupContainer="triggerNode => triggerNode.parentNode">
<img src="@/static/images/shijian.png" alt="" class="icon"> <div class="item" @click="e => e.preventDefault()">
<div class="name">{{userinfo.zoneStr}}</div> <img src="@/static/images/shijian.png" alt="" class="icon">
<img src="@/static/images/jiantou2.png" alt="" class="down"> <div class="name">{{userinfo.zoneStr}}</div>
</div> <img src="@/static/images/jiantou2.png" alt="" class="down">
<div class="item"> </div>
<img src="@/static/images/qianbi.png" alt="" class="icon"> <template v-slot:overlay>
<div class="name">{{userinfo.currency}}</div> <a-menu>
<img src="@/static/images/jiantou2.png" alt="" class="down"> <a-menu-item key="0">
</div> <div class="selitem">
<div class="item"> <span>时区1</span>
<img src="@/static/images/yuyan.png" alt="" class="icon"> </div>
<div class="name">{{userinfo.language}}</div> </a-menu-item>
<img src="@/static/images/jiantou2.png" alt="" class="down"> <a-menu-item key="1">
</div> <div class="selitem">
<div class="item"> <span>时区2</span>
</div>
</a-menu-item>
<a-menu-item key="3">
<div class="selitem">
<span>时区3</span>
</div>
</a-menu-item>
</a-menu>
</template>
</a-dropdown>
<a-dropdown :trigger="['click']" :getPopupContainer="triggerNode => triggerNode.parentNode">
<div class="item" @click="e => e.preventDefault()">
<img src="@/static/images/qianbi.png" alt="" class="icon">
<div class="name">{{userinfo.currency}}</div>
<img src="@/static/images/jiantou2.png" alt="" class="down">
</div>
<template v-slot:overlay>
<a-menu>
<a-menu-item key="0">
<div class="selitem">
<span>时区1</span>
</div>
</a-menu-item>
<a-menu-item key="1">
<div class="selitem">
<span>时区2</span>
</div>
</a-menu-item>
<a-menu-item key="3">
<div class="selitem">
<span>时区3</span>
</div>
</a-menu-item>
</a-menu>
</template>
</a-dropdown>
<a-dropdown :trigger="['click']" :getPopupContainer="triggerNode => triggerNode.parentNode">
<div class="item" @click="e => e.preventDefault()">
<img src="@/static/images/yuyan.png" alt="" class="icon">
<div class="name">{{userinfo.language}}</div>
<img src="@/static/images/jiantou2.png" alt="" class="down">
</div>
<template v-slot:overlay>
<a-menu>
<a-menu-item key="0">
<div class="selitem">
<span>时区1</span>
</div>
</a-menu-item>
<a-menu-item key="1">
<div class="selitem">
<span>时区2</span>
</div>
</a-menu-item>
<a-menu-item key="3">
<div class="selitem">
<span>时区3</span>
</div>
</a-menu-item>
</a-menu>
</template>
</a-dropdown>
<div class="item" style="border-right: none;">
<img src="@/static/images/rili.png" alt="" class="icon"> <img src="@/static/images/rili.png" alt="" class="icon">
<div class="name">日历</div> <div class="name">日历</div>
</div> </div>
@ -80,15 +144,17 @@
align-items: center; align-items: center;
flex-shrink: 0; flex-shrink: 0;
padding: 0 16px; padding: 0 16px;
.selitem{
text-align: center;
font-size: 11px;
color: #111;
}
.item{ .item{
display: flex; display: flex;
align-items: center; align-items: center;
border-right: 1px solid #eee; border-right: 1px solid #eee;
padding: 0 23px; padding: 0 23px;
height: 18rpx; height: 18rpx;
&:last-child{
border-right: none;
}
.icon{ .icon{
width: 16px; width: 16px;
height: 16px; height: 16px;

BIN
src/static/images/smilet.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 4.0 KiB

44
src/store/index.ts
View File

@ -4,8 +4,44 @@ import { createStore } from 'vuex'
export default createStore({ export default createStore({
state: { state: {
userinfo:{ userinfo:{
username: "username", accesstoken: "",
head: "" api_token: "",
birthday: "",
country: "",
cover: "",
created_at: "",
currency: 2,
deleted_at: null,
desc: "",
email: "",
img: "",
interest: "",
language: "中文",
live: "",
livetime: "",
login_type: 0,
memberid: 0,
mobile: "",
money: "",
msg: "",
mtongue: "",
name: "",
password: "",
position: 0,
publish: 0,
score: "",
status: true,
tlanguage: "",
type: 0,
uid: "",
updated_at: "",
video: "",
willsay: [{
"name": "请选择",
"level": 0
}],
zoneStr: "中途岛GMT-11:00",
zoneid: 0
}, },
islogin: false islogin: false
}, },
@ -13,8 +49,8 @@ export default createStore({
setUserInfo(state, userinfo){ setUserInfo(state, userinfo){
state.userinfo = userinfo state.userinfo = userinfo
}, },
login(state){ login(state, islogin: boolean){
state.islogin = true; state.islogin = islogin;
} }
}, },
actions: { actions: {

4
src/views/login/Login.vue
View File

@ -7,7 +7,7 @@
您好，欢迎来到 <span class="orgname">Beelink</span> 您好，欢迎来到 <span class="orgname">Beelink</span>
</div> </div>
<div class="nosign"> <div class="nosign">
还没有账号？ <span class="tosign"> 成为一名Beelink老师 </span> 还没有账号？ <span class="tosign"><router-link to="/sign"> 成为一名Beelink老师 </router-link></span>
</div> </div>
<div class="tab"> <div class="tab">
<LoginTab @sel="Selectnum"></LoginTab> <LoginTab @sel="Selectnum"></LoginTab>
@ -260,7 +260,7 @@ export default defineComponent({
margin-top: 17px; margin-top: 17px;
margin-bottom: 35px; margin-bottom: 35px;
} }
.tosign { .tosign > a {
color: #0dbba4; color: #0dbba4;
cursor: pointer; cursor: pointer;
} }

77
src/views/login/Sign.vue
View File

@ -1,6 +1,6 @@
<template> <template>
<div class="login"> <div class="login">
<NavTop :type="0" style="flex-shrink:0"></NavTop> <NavTop :type="0" style="flex-shrink: 0"></NavTop>
<div class="box"> <div class="box">
<div :class="stepnow != 2 ? 'left' : 'left left1'"> <div :class="stepnow != 2 ? 'left' : 'left left1'">
<div class="title"> <div class="title">
@ -17,26 +17,26 @@
<a-form-item label="手机号" class="form-item"> <a-form-item label="手机号" class="form-item">
<a-input-group compact> <a-input-group compact>
<a-select <a-select
default-value="Zhejiang"
class="getcode" class="getcode"
style="width: 50%" style="width: 50%"
v-model:value="phone.quhao"
> >
<a-select-option value="Zhejiang"> <a-select-option value="86">
中国+0086 中国+0086
</a-select-option> </a-select-option>
<a-select-option value="Jiangsu"> Jiangsu </a-select-option> <a-select-option value="Jiangsu"> Jiangsu </a-select-option>
</a-select> </a-select>
<div class="line"></div> <div class="line"></div>
<a-input style="width: 50%" placeholder="请输入您的手机号" /> <a-input v-model:value="phone.phone" style="width: 50%" placeholder="请输入您的手机号" />
</a-input-group> </a-input-group>
</a-form-item> </a-form-item>
<a-form-item label="验证码" class="form-item"> <a-form-item label="验证码" class="form-item">
<a-input-group compact> <a-input-group compact>
<div class="getcode" @click="getcode"> <div class="getcode" style="width: 50%" @click="getcode">
点击获取验证码{{ time == 60 ? "" : "(" + time + ")" }} 点击获取验证码{{ time == 60 ? "" : "(" + time + ")" }}
</div> </div>
<div class="line"></div> <div class="line"></div>
<a-input style="width: 50%" placeholder="请输入您的验证码" /> <a-input v-model:value="phone.code" style="width: 50%" placeholder="请输入您的验证码" />
</a-input-group> </a-input-group>
</a-form-item> </a-form-item>
<div class="submit" @click="next(2)">下一步</div> <div class="submit" @click="next(2)">下一步</div>
@ -62,10 +62,18 @@
<a-form :layout="formLayout"> <a-form :layout="formLayout">
<div class="signform"> <div class="signform">
<a-form-item label="设置密码" class="form-item"> <a-form-item label="设置密码" class="form-item">
<a-input class="shuru" placeholder="请输入您的密码" type="password"/> <a-input
class="shuru"
placeholder="请输入您的密码"
type="password"
/>
</a-form-item> </a-form-item>
<a-form-item label="设置密码" class="form-item"> <a-form-item label="设置密码" class="form-item">
<a-input class="shuru" placeholder="请再次输入您的密码" type="password"/> <a-input
class="shuru"
placeholder="请再次输入您的密码"
type="password"
/>
</a-form-item> </a-form-item>
<a-form-item label="姓名" class="form-item"> <a-form-item label="姓名" class="form-item">
<a-input class="shuru" placeholder="请输入您的姓名" /> <a-input class="shuru" placeholder="请输入您的姓名" />
@ -93,7 +101,7 @@
<div v-if="stepnow == 3"> <div v-if="stepnow == 3">
<div class="nosign">您已完成注册</div> <div class="nosign">您已完成注册</div>
<img src="@/static/images/success.png" alt="" class="success"> <img src="@/static/images/success.png" alt="" class="success" />
<div class="ale">恭喜您注册成功，点击跳转到我的档案页面</div> <div class="ale">恭喜您注册成功，点击跳转到我的档案页面</div>
</div> </div>
</div> </div>
@ -107,7 +115,7 @@
<div class="step"> <div class="step">
<div :class="stepnow == 2 ? 'circle step1' : 'circle'">02</div> <div :class="stepnow == 2 ? 'circle step1' : 'circle'">02</div>
<div :class="stepnow == 2 ? 'stepnow' : ''">填写帐号信息</div> <div :class="stepnow == 2 ? 'stepnow' : ''">填写帐号信息</div>
<div class="back" @click="next(1)" v-if="stepnow==2"> <div class="back" @click="next(1)" v-if="stepnow == 2">
返回上一步 返回上一步
</div> </div>
</div> </div>
@ -128,41 +136,52 @@
</template> </template>
<script lang="ts"> <script lang="ts">
import { defineComponent, ref } from "vue"; import { defineComponent, reactive, ref } from "vue";
import NavTop from "@/components/NavTop.vue" import NavTop from "@/components/NavTop.vue";
import { sendsms } from '@/api';
export default defineComponent({ export default defineComponent({
name: "Sign", name: "Sign",
components: {NavTop}, components: { NavTop },
setup() { setup() {
const formLayout = { const formLayout = {
labelCol: 4, labelCol: 4,
wrapperCol: 14, wrapperCol: 14,
}; };
const time = ref(60); //倒计时初始化 const time = ref(60); //倒计时初始化
const phone = reactive({
quhao:"86",
phone: "",
code: ""
});
/** /**
* @param * @param
* 点击获取验证码 触发60S倒计时 * 点击获取验证码 触发60S倒计时
*/ */
let lock = false;
const getcode: () => void = () => { const getcode: () => void = () => {
console.log(11111); console.log(11111);
const timestep = setInterval(() => { if (lock) {
console.log(11112); return;
time.value = time.value - 1;
if (time.value > 0) {
console.log();
} else {
time.value = 60;
clearInterval(timestep);
} }
}, 1000); lock = true;
sendsms(phone.quhao + phone.phone, 0);
const timestep = setInterval(() => {
console.log(phone);
time.value = time.value - 1;
if (time.value <= 0) {
time.value = 60;
clearInterval(timestep);
lock = false;
}
}, 1000);
}; };
const ifagree = ref(true); //是否同意用户协议 const ifagree = ref(true); //是否同意用户协议
/** /**
*@param *@param
* 用户协议前面radio 的点击效果 * 用户协议前面radio 的点击效果
*/ */
const agree: () => void = () => { const agree: () => void = () => {
ifagree.value = ifagree.value == true ? false : true; ifagree.value = ifagree.value == true ? false : true;
@ -173,7 +192,7 @@ export default defineComponent({
/** /**
*@param e 跳到哪一步 *@param e 跳到哪一步
* 步骤条跳到某一步 * 步骤条跳到某一步
*/ */
const next: (e: number) => void = (e: number) => { const next: (e: number) => void = (e: number) => {
stepnow.value = e; stepnow.value = e;
@ -186,6 +205,7 @@ export default defineComponent({
ifagree, ifagree,
stepnow, stepnow,
next, next,
phone
}; };
}, },
}); });
@ -266,6 +286,7 @@ export default defineComponent({
font-size: 15px; font-size: 15px;
color: #08ae98; color: #08ae98;
width: 313px; width: 313px;
// width: 50%;
line-height: 30px; line-height: 30px;
cursor: pointer; cursor: pointer;
} }
@ -377,12 +398,12 @@ export default defineComponent({
float: right; float: right;
} }
} }
.success{ .success {
width: 250px; width: 250px;
height: 233px; height: 233px;
} }
.ale{ .ale {
color:#08AE98; color: #08ae98;
font-size: 14px; font-size: 14px;
font-weight: 800; font-weight: 800;
margin-top: 34px; margin-top: 34px;

61
src/views/mine/Archives.vue
View File

@ -49,9 +49,9 @@
<div class="label">我还会说</div> <div class="label">我还会说</div>
<div class="speak-array"> <div class="speak-array">
<div class="lang-items"> <div class="lang-items">
<div class="speak-item" v-for="(lang, index) in formData.speakLang" :key="index"> <div class="speak-item" v-for="(lang, indexs) in userinfo.willsay" :key="indexs">
<a-select <a-select
v-model:value="lang.lang" v-model:value="lang.name"
style="width: 171px" style="width: 171px"
size="small" size="small"
ref="select" ref="select"
@ -64,9 +64,10 @@
<div class="proficiency"> <div class="proficiency">
<div class="p-title">熟练度</div> <div class="p-title">熟练度</div>
<div class="value"> <div class="value">
<a-rate v-model:value="lang.proficiency" style="fontSize: 15px"> <!-- <a-rate v-model:value="lang.proficiency" style="fontSize: 15px">
<template v-slot:character><SmileOutlined /></template> <template v-slot:character><img src="" style="width: 10px;height: 10px;background-color: #0f0;"/>{{}}</template>
</a-rate> </a-rate> -->
<img @click="setlevel(indexs, i)" v-for="i in 5" :key="i" :src="lang.level >= i ? smilet : smile" alt="" />
</div> </div>
</div> </div>
</div> </div>
@ -116,7 +117,7 @@
<div class="main-container"> <div class="main-container">
<div class="input-box mailbox"> <div class="input-box mailbox">
<div class="label">邮箱</div> <div class="label">邮箱</div>
<a-input size="small" v-model:value="userinfo.mail" placeholder="请输入邮箱" /> <a-input size="small" v-model:value="userinfo.email" placeholder="请输入邮箱" />
</div> </div>
<div class="input-box phone-box"> <div class="input-box phone-box">
<div class="label">手机号</div> <div class="label">手机号</div>
@ -259,16 +260,17 @@
<script lang="ts"> <script lang="ts">
import { computed, defineComponent, reactive, Ref, ref } from "vue"; import { computed, defineComponent, reactive, Ref, ref } from "vue";
import { UserOutlined, SmileOutlined, PlaySquareOutlined } from '@ant-design/icons-vue'; import { UserOutlined, PlaySquareOutlined } from '@ant-design/icons-vue';
import NavBottom from '@/components/NavBottom.vue'; import NavBottom from '@/components/NavBottom.vue';
import { uploadflie } from "@/utils/vod" import { uploadflie } from "@/utils/vod"
import store from '@/store'; import store from '@/store';
import smile from "@/static/images/smile.png"
import smilet from "@/static/images/smilet.png"
export default defineComponent({ export default defineComponent({
name: "Archives", name: "Archives",
components: { components: {
UserOutlined, UserOutlined,
SmileOutlined,
PlaySquareOutlined, PlaySquareOutlined,
NavBottom NavBottom
}, },
@ -281,25 +283,9 @@ export default defineComponent({
lang: '请选择', lang: '请选择',
proficiency: 0, proficiency: 0,
}]; }];
const formBasic = {
name: 'Lorem Sum',
country: '美国',
address: '',
teachingLang: '英语',
speakLang: otherSpeak,
nativeLang: '英语',
shortVideo: '',
introduce: '',
mail: '',
phone: '136 **** 6111',
password: '***********',
timeZone: '北京 GMT +08:00',
currency: '人民币',
language: '中文',
}
const userinfo = computed(() => store.state.userinfo) const userinfo = computed(() => store.state.userinfo)
// 表单数据 // 表单数据
const formData = reactive(formBasic); const formData = reactive(store.state.userinfo);
const modalNode = () => document.getElementsByClassName('modal-container')[0] const modalNode = () => document.getElementsByClassName('modal-container')[0]
/** /**
@ -314,9 +300,9 @@ export default defineComponent({
* @return { void } * @return { void }
*/ */
function addSpeakLang (): void { function addSpeakLang (): void {
formData.speakLang.push({ store.state.userinfo.willsay.push({
lang: '请选择', name: '请选择',
proficiency: 0, level: 4
}); });
} }
// 验证码 // 验证码
@ -441,7 +427,11 @@ export default defineComponent({
}); });
console.log(res) console.log(res)
} }
// uploadflie() // uploadflie()3.
function setlevel(index: number, level: number){
store.state.userinfo.willsay[index].level = level
}
return { return {
modalNode, modalNode,
formData, formData,
@ -464,7 +454,10 @@ export default defineComponent({
updateUserPassword, updateUserPassword,
submitInfo, submitInfo,
userinfo, userinfo,
uploads uploads,
smile,
smilet,
setlevel
} }
} }
}); });
@ -566,6 +559,14 @@ export default defineComponent({
color: #808080; color: #808080;
margin-right: 14px; margin-right: 14px;
} }
.value{
display: flex;
>img{
width: 15px;
height: 15px;
margin-right: 6px;
}
}
} }
} }
} }