Merge branch 'master' of http://git.luyuan.tk/luyuan/beelink into zj

This commit is contained in:
asd
2020-10-14 15:31:24 +08:00
14 changed files with 526 additions and 103 deletions

View File

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

View File

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

View File

@@ -49,9 +49,9 @@
<div class="label">我还会说</div>
<div class="speak-array">
<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
v-model:value="lang.lang"
v-model:value="lang.name"
style="width: 171px"
size="small"
ref="select"
@@ -64,9 +64,10 @@
<div class="proficiency">
<div class="p-title">熟练度</div>
<div class="value">
<a-rate v-model:value="lang.proficiency" style="fontSize: 15px">
<template v-slot:character><SmileOutlined /></template>
</a-rate>
<!-- <a-rate v-model:value="lang.proficiency" style="fontSize: 15px">
<template v-slot:character><img src="" style="width: 10px;height: 10px;background-color: #0f0;"/>{{}}</template>
</a-rate> -->
<img @click="setlevel(indexs, i)" v-for="i in 5" :key="i" :src="lang.level >= i ? smilet : smile" alt="" />
</div>
</div>
</div>
@@ -116,7 +117,7 @@
<div class="main-container">
<div class="input-box mailbox">
<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 class="input-box phone-box">
<div class="label">手机号</div>
@@ -259,16 +260,17 @@
<script lang="ts">
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 { uploadflie } from "@/utils/vod"
import store from '@/store';
import smile from "@/static/images/smile.png"
import smilet from "@/static/images/smilet.png"
export default defineComponent({
name: "Archives",
components: {
UserOutlined,
SmileOutlined,
PlaySquareOutlined,
NavBottom
},
@@ -281,25 +283,9 @@ export default defineComponent({
lang: '请选择',
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 formData = reactive(formBasic);
const formData = reactive(store.state.userinfo);
const modalNode = () => document.getElementsByClassName('modal-container')[0]
/**
@@ -314,9 +300,9 @@ export default defineComponent({
* @return { void }
*/
function addSpeakLang (): void {
formData.speakLang.push({
lang: '请选择',
proficiency: 0,
store.state.userinfo.willsay.push({
name: '请选择',
level: 4
});
}
// 验证码
@@ -441,7 +427,11 @@ export default defineComponent({
});
console.log(res)
}
// uploadflie()
// uploadflie()3.
function setlevel(index: number, level: number){
store.state.userinfo.willsay[index].level = level
}
return {
modalNode,
formData,
@@ -464,7 +454,10 @@ export default defineComponent({
updateUserPassword,
submitInfo,
userinfo,
uploads
uploads,
smile,
smilet,
setlevel
}
}
});
@@ -566,6 +559,14 @@ export default defineComponent({
color: #808080;
margin-right: 14px;
}
.value{
display: flex;
>img{
width: 15px;
height: 15px;
margin-right: 6px;
}
}
}
}
}

View File

@@ -179,9 +179,9 @@
>div::last-child{
border: unset;
}
}
}
}
}
}
</style>

225
src/views/regime/week.vue Normal file
View File

@@ -0,0 +1,225 @@
<template>
<div class="week">
<div class="head">
<div @click="zhou--">
<img src="" alt="">
上一周
</div>
2020年10月
<a-button type="primary" class="button">
月日历
</a-button>
<div @click="zhou++">
下一周
<img src="" alt="">
</div>
</div>
<div class="week">
<div class="heads">
<div></div>
<div :class="{zhou: zhou == 0 && week.zhou == 1}">周一<span>{{week.date[0].day}}</span></div>
<div :class="{zhou: zhou == 0 && week.zhou == 2}">周二<span>{{week.date[1].day}}</span></div>
<div :class="{zhou: zhou == 0 && week.zhou == 3}">周三<span>{{week.date[2].day}}</span></div>
<div :class="{zhou: zhou == 0 && week.zhou == 4}">周四<span>{{week.date[3].day}}</span></div>
<div :class="{zhou: zhou == 0 && week.zhou == 5}">周五<span>{{week.date[4].day}}</span></div>
<div :class="{zhou: zhou == 0 && week.zhou == 6}">周六<span>{{week.date[5].day}}</span></div>
<div :class="{zhou: zhou == 0 && week.zhou == 0}">周日<span>{{week.date[6].day}}</span></div>
</div>
<div class="body">
<div class="row" v-for="item in 24" :key="item">
<div class="day date">{{item > 10 ? item : '0' + item}}:00</div>
<div v-for="i in 7" :key="i">
<div class="day">
</div>
</div>
</div>
</div>
</div>
</div>
</template>
<style lang="scss" scoped>
.week{
display: flex;
flex-direction: column;
align-items: center;
.head{
width: 1320px;
height: 57px;
background-color: #fff;
display: flex;
align-items: center;
justify-content: center;
position: relative;
>div{
display: flex;
align-items: center;
font-size: 13px;
color: #0DBBA4;
>img{
width: 7px;
height: 11px;
}
}
>div:first-child{
margin-right: 90px;
>img{
margin-right: 11px;
}
}
>div:last-child{
margin-left: 90px;
>img{
margin-left: 11px;
}
}
.button{
width: 57px;
height: 26px;
background-color: #0DBBA4;
border-right: 4px;
border: none;
font-size: 10px;
color: #fff;
padding: 0;
position: absolute;
right: 40px;
}
}
.week{
.heads{
width: 1320px;
height: 63px;
display: flex;
>div{
width: 100%;
height: 100%;
background-color: #F5FEFD;
text-align: center;
line-height: 1;
font-size: 13px;
color: #08AE98;
border-right: 1px solid #eee;
box-sizing: border-box;
display: flex;
flex-direction: column;
align-items: center;
justify-content: center;
>span{
font-size: 11px;
margin-top: 9px;
color: #111;
}
}
.zhou{
color: #fff;
background: #08AE98;
>span{
color: #fff;
}
}
}
.body{
width: 100%;
.row{
background-color: #fff;
height: 63px;
width: 100%;
display: flex;
.date{
background-color: #F5FEFD;
text-align: center;
line-height: 63px;
font-size: 11px;
color: #111;
}
>div{
width: 100%;
border-top: 1px solid #eee;
border-right: 1px solid #eee;
.day{
width: 100%;
height: 100%;
display: flex;
flex-direction: column;
color: #111;
>div{
height: 100%;
border-radius: 6px;
padding: 18px;
overflow: hidden;
.item{
display: flex;
align-items: center;
margin-top: 11px;
>div{
width: 6px;
height: 6px;
background-color: #111;
margin-right: 6px;
border-radius: 50%;
}
>p{
line-height: 1;
margin: 0;
}
}
}
.old{
background-color: #F7F7F7;
}
.ing{
background-color: #0DBBA4;
color: #fff;
.item{
>div{
background-color: #fff;
}
}
}
.next{
background-color: #CEF9F0;
color: #0DBBA4;
.item{
>div{
background-color: #0DBBA4;
}
}
}
}
}
>div::last-child{
border: unset;
}
}
}
}
}
</style>
<script lang="ts">
import { defineComponent, ref, watch } from 'vue';
import { getweek } from "@/utils/date"
export default defineComponent({
props:{
},
setup(){
const zhou = ref(0);
const week = ref(getweek());
console.log(week.value)
watch(zhou,(value) => {
week.value = getweek(value)
console.log(week.value)
})
return {
zhou,
week
}
}
})
</script>