多语言

This commit is contained in:
asd 2020-10-29 10:40:31 +08:00
parent c0a84ac057
commit 0deba541ce
4 changed files with 514 additions and 401 deletions

View File

@ -28,6 +28,8 @@ export default {
huanying:"您好,欢迎来到", huanying:"您好,欢迎来到",
beelink:"Beelink", beelink:"Beelink",
meiyouzhanghao:"还没有账号?", meiyouzhanghao:"还没有账号?",
yiyouzhanghao:"已有账号?",
qudenglu:"去登录",
chengweilaoshi:"成为一名Beelink老师", chengweilaoshi:"成为一名Beelink老师",
shoujidenglu:"手机号登录", shoujidenglu:"手机号登录",
mimadenglu:"账号密码登录", mimadenglu:"账号密码登录",
@ -47,6 +49,38 @@ export default {
kaiqishenghuo:"Beelink 开启您的美好学习生活", kaiqishenghuo:"Beelink 开启您的美好学习生活",
guanyubeelink:"关于 Beelink", guanyubeelink:"关于 Beelink",
guanyuneirong:" Beelink平台拥有数千名优秀老师丰富的教育经验和有趣的课堂环境一对一辅导平台的教务管理、线上课堂、线下课堂、助学互动课程回放等多项教学功能让您利用碎片时间轻轻松松学会各种语言。", guanyuneirong:" Beelink平台拥有数千名优秀老师丰富的教育经验和有趣的课堂环境一对一辅导平台的教务管理、线上课堂、线下课堂、助学互动课程回放等多项教学功能让您利用碎片时间轻轻松松学会各种语言。",
liaojiegengduo:"了解更多" liaojiegengduo:"了解更多",
xiayibu:"下一步",
tongyixieyi:"勾选表示同意 《用户注册协议和隐私政策》",
shezhimima:"设置密码",
shurumimatwo:"请再次输入您的密码",
shuruxingming:"请输入您的姓名",
youxiang:"邮箱",
shuruyouxiang:"请输入您的邮箱",
muyu:"母语",
shurumuyu:"请输入您的母语",
jiaoshou:"教授",
xuanzejiaoshou:"请选择您的教授",
lijizhuce:"立刻注册",
wanchengzhuce:"您已完成注册",
qudangan:"恭喜您注册成功,点击跳转到我的档案页面",
yanzhengshouji:"验证手机号",
tianxiexinxi:"填写帐号信息",
fanhuishangyibu:"返回上一步",
zhucewancheng:"帐号注册完成",
mimachongzhi:"密码重置",
xiangqimima:"想起密码?",
zhanghuming:"账户名",
chongzhimima:"重置密码",
chongzhishurumima:"请输入您要设置的密码",
querenmima:"确认密码",
querenchongzhi:"确认重置",
wanchengchongzhi:"您已完成密码重置",
chongzhichenggong:"恭喜您重置密码成功,点击跳转到登录页面",
shibiezhanghao:"识别账号",
yanzhengxinxi:"验证账号信息,重置密码",
chongzhiwancheng:"密码重置完成",
xiugaitouxiang:"修改头像",
xiugai:"修改"
} }

View File

@ -3,89 +3,89 @@
<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">
<span class="orgname">Beelink</span>密码重置 <span class="orgname">{{lan.$t('beelink')}}</span>{{lan.$t('mimachongzhi')}}
</div> </div>
<div v-if="stepnow == 1"> <div v-if="stepnow == 1">
<div class="nosign"> <div class="nosign">
想起密码 {{lan.$t('xiangqimima')}}
<span class="tosign"><router-link to="/"> 去登录 </router-link></span> <span class="tosign"><router-link to="/"> {{lan.$t('qudenglu')}} </router-link></span>
</div> </div>
<a-form :layout="formLayout"> <a-form :layout="formLayout">
<a-form-item label="账户名" class="form-item"> <a-form-item :label="lan.$t('zhanghuming')" class="form-item">
<a-input class="shuru" placeholder="请输入您的邮箱或者手机号" v-model:value="uinfo.phone"/> <a-input class="shuru" :placeholder="lan.$t('shuruzhanghao')" v-model:value="uinfo.phone"/>
</a-form-item> </a-form-item>
<div class="submit" @click="next(2)">下一步</div> <div class="submit" @click="next(2)">{{lan.$t('xiayibu')}}</div>
</a-form> </a-form>
</div> </div>
<div v-if="stepnow == 2"> <div v-if="stepnow == 2">
<div class="nosign"> <div class="nosign">
已有账号 {{lan.$t('yiyouzhanghao')}}
<span class="tosign"><router-link to="/"> 去登录 </router-link></span> <span class="tosign"><router-link to="/"> {{lan.$t('qudenglu')}} </router-link></span>
</div> </div>
<a-form :layout="formLayout"> <a-form :layout="formLayout">
<div class="signform"> <div class="signform">
<div style="display:flex"> <div style="display:flex">
<a-form-item label="手机号" class="shuru"> <a-form-item :label="lan.$t('shoujihao')" class="shuru">
<div>{{uinfo.phone}}</div> <div>{{uinfo.phone}}</div>
</a-form-item> </a-form-item>
<a-form-item label="验证码" class="form-item yzm"> <a-form-item :label="lan.$t('yanzhengma')" class="form-item yzm">
<a-input-group compact> <a-input-group compact>
<div class="getcode" @click="getcode"> <div class="getcode" @click="getcode">
点击获取验证码{{ time == 60 ? "" : "(" + time + ")" }} {{lan.$t('dianjihuoquyzm')}} {{ time == 60 ? "" : "(" + time + ")" }}
</div> </div>
<div class="line"></div> <div class="line"></div>
<a-input style="width: 50%" placeholder="请输入您的验证码" v-model:value="uinfo.code"/> <a-input style="width: 50%" :placeholder="lan.$t('shuruyzm')" v-model:value="uinfo.code"/>
</a-input-group> </a-input-group>
</a-form-item> </a-form-item>
</div> </div>
<div style="display:flex"> <div style="display:flex">
<a-form-item label="设置密码" class="form-item"> <a-form-item :label="lan.$t('chongzhimima')" class="form-item">
<a-input class="shuru" placeholder="请再次输入您的密码" type="password" v-model:value="uinfo.password"/> <a-input class="shuru" :placeholder="lan.$t('chongzhishurumima')" type="password" v-model:value="uinfo.password"/>
</a-form-item> </a-form-item>
<a-form-item label="设置密码" class="form-item"> <a-form-item :label="lan.$t('querenmima')" class="form-item">
<a-input class="shuru" placeholder="请再次输入您的密码" type="password" v-model:value="uinfo.repassword"/> <a-input class="shuru" :placeholder="lan.$t('shurumimatwo')" type="password" v-model:value="uinfo.repassword"/>
</a-form-item> </a-form-item>
</div> </div>
</div> </div>
<div class="submit" @click="next(3)">确认重置</div> <div class="submit" @click="next(3)">{{lan.$t('querenchongzhi')}}</div>
<div class="orginfo">Beelink公司版权所有 20192022</div> <div class="orginfo">{{lan.$t('banquan')}}</div>
</a-form> </a-form>
</div> </div>
<div v-if="stepnow == 3"> <div v-if="stepnow == 3">
<div class="nosign">您已完成密码重置</div> <div class="nosign">{{lan.$t('wanchengchongzhi')}}</div>
<img src="@/static/images/success.png" alt="" class="success"> <img src="@/static/images/success.png" alt="" class="success">
<div class="ale" @click="tologin">恭喜您重置密码成功点击跳转到登录页面</div> <div class="ale" @click="tologin">{{lan.$t('chongzhichenggong')}}</div>
</div> </div>
</div> </div>
<div :class="stepnow != 2 ? 'right' : 'right right1'"> <div :class="stepnow != 2 ? 'right' : 'right right1'">
<div class="steps"> <div class="steps">
<div class="step"> <div class="step">
<div :class="stepnow == 1 ? 'circle step1' : 'circle'">01</div> <div :class="stepnow == 1 ? 'circle step1' : 'circle'">01</div>
<div :class="stepnow == 1 ? 'stepnow' : ''">识别账号</div> <div :class="stepnow == 1 ? 'stepnow' : ''">{{lan.$t('shibiezhanghao')}}</div>
</div> </div>
<div class="stepline"></div> <div class="stepline"></div>
<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' : ''">{{lan.$t('yanzhengxinxi')}}</div>
<div class="back" @click="next(1)" v-if="stepnow==2"> <div class="back" @click="next(1)" v-if="stepnow==2">
返回上一步 {{lan.$t('fanhuishangyibu')}}
</div> </div>
</div> </div>
<div class="stepline"></div> <div class="stepline"></div>
<div class="step"> <div class="step">
<div :class="stepnow == 3 ? 'circle step1' : 'circle'">03</div> <div :class="stepnow == 3 ? 'circle step1' : 'circle'">03</div>
<div :class="stepnow == 3 ? 'stepnow' : ''">密码重置完成</div> <div :class="stepnow == 3 ? 'stepnow' : ''">{{lan.$t('chongzhiwancheng')}}</div>
</div> </div>
</div> </div>
<div class="icons" v-if="stepnow == 2"> <div class="icons" v-if="stepnow == 2">
@ -101,12 +101,14 @@
<script lang="ts"> <script lang="ts">
import { checksmscode, checkuser, editpassword, sendsms } from '@/api'; import { checksmscode, checkuser, editpassword, sendsms } from '@/api';
import router from '@/router'; import router from '@/router';
import { useI18n } from '@/utils/i18n';
import { message } from 'ant-design-vue'; import { message } from 'ant-design-vue';
import { defineComponent, ref, toRaw } from "vue"; import { defineComponent, ref, toRaw } from "vue";
export default defineComponent({ export default defineComponent({
name: "Sign", name: "Sign",
components: {}, components: {},
setup() { setup() {
const lan: any = useI18n();
const formLayout = { const formLayout = {
labelCol: 4, labelCol: 4,
wrapperCol: 14, wrapperCol: 14,
@ -219,7 +221,8 @@ export default defineComponent({
stepnow, stepnow,
next, next,
uinfo, uinfo,
tologin tologin,
lan
}; };
}, },
}); });

View File

@ -2,180 +2,240 @@
<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">
您好欢迎来到 <span class="orgname">Beelink</span> {{ lan.$t("huanying") }}
</div> <span class="orgname">{{ lan.$t("beelink") }}</span>
</div>
<div v-if="stepnow == 1"> <div v-if="stepnow == 1">
<div class="nosign"> <div class="nosign">
已有账号 {{ lan.$t("yiyouzhanghao") }}
<span class="tosign" @click="navto('/')"> 去登录 </span> <span class="tosign" @click="navto('/')">
</div> {{ lan.$t("qudenglu") }}
</span>
<a-form :layout="formLayout">
<a-form-item label="手机号" class="form-item">
<a-input-group compact>
<a-select
class="getcode"
style="width: 50%"
v-model:value="phone.quhao"
>
<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
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" style="width: 50%" @click="getcode">
点击获取验证码{{ time == 60 ? "" : "(" + time + ")" }}
</div> </div>
<div class="line"></div>
<a-input <a-form :layout="formLayout">
v-model:value="phone.code" <a-form-item
style="width: 50%" :label="lan.$t('shoujihao')"
placeholder="请输入您的验证码" class="form-item"
/> >
</a-input-group> <a-input-group compact>
</a-form-item> <a-select
<div class="submit" @click="next(2)">下一步</div> :default-value="quhaolist[0].code"
<div class="agreement" @click="agree"> size="small"
<div class="ifagree"> @change="getquhao"
class="getcode"
style="width: 50%"
>
<a-select-option
v-for="(i, j) in quhaolist"
:key="j"
:value="i.code"
>
{{ i.name }}+{{ i.code }}
</a-select-option>
<!-- <a-select-option value="Jiangsu"> Jiangsu </a-select-option> -->
</a-select>
<!-- <a-select
class="getcode"
style="width: 50%"
v-model:value="phone.quhao"
>
<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
v-model:value="phone.phone"
style="width: 50%"
:placeholder="lan.$t('shurushouji')"
/>
</a-input-group>
</a-form-item>
<a-form-item :label="lan.$t('yanzhengma')" class="form-item">
<a-input-group compact>
<div
class="getcode"
style="width: 50%"
@click="getcode"
>
{{lan.$t('dianjihuoquyzm')}} {{
time == 60 ? "" : "(" + time + ")"
}}
</div>
<div class="line"></div>
<a-input
v-model:value="phone.code"
style="width: 50%"
:placeholder="lan.$t('shuruyzm')"
/>
</a-input-group>
</a-form-item>
<div class="submit" @click="next(2)">{{lan.$t('xiayibu')}}</div>
<div class="agreement" @click="agree">
<div class="ifagree">
<img
src="@/static/images/agree.png"
alt=""
class="agree"
v-if="ifagree"
/>
</div>
{{lan.$t('tongyixieyi')}}
</div>
</a-form>
</div>
<div v-if="stepnow == 2">
<div class="nosign">
{{lan.$t('yiyouzhanghao')}}
<span class="tosign" @click="navto('/')"> {{lan.$t('qudenglu')}} </span>
</div>
<a-form :layout="formLayout">
<div class="signform">
<a-form-item :label="lan.$t('shezhimima')" class="form-item">
<a-input
class="shuru"
:placeholder="lan.$t('shurumima')"
type="password"
v-model:value="userinfo.pass"
/>
</a-form-item>
<a-form-item :label="lan.$t('shezhimima')" class="form-item">
<a-input
class="shuru"
:placeholder="lan.$t('shurumimatwo')"
type="password"
v-model:value="userinfo.passtow"
/>
</a-form-item>
<a-form-item :label="lan.$t('xingming')" class="form-item">
<a-input
class="shuru"
:placeholder="lan.$t('shuruxingming')"
v-model:value="userinfo.name"
/>
</a-form-item>
<a-form-item :label="lan.$t('youxiang')" class="form-item">
<a-input
class="shuru"
:placeholder="lan.$t('shuruyouxiang')"
v-model:value="userinfo.emil"
/>
</a-form-item>
<a-form-item :label="lan.$t('muyu')" class="form-item">
<a-input
class="shuru"
:placeholder="lan.$t('shurumuyu')"
v-model:value="userinfo.muyu"
/>
</a-form-item>
<a-form-item label="教授" class="form-item">
<a-select
v-model:value="userinfo.jiaoshou"
class="getcode"
style="color: #111"
:placeholder="lan.$t('xuanzejiaoshou')"
>
<a-select-option
v-for="(item, index) in willsay"
:key="index"
:value="item.languageid"
>
{{ item.name }}
</a-select-option>
</a-select>
</a-form-item>
</div>
<div class="submit" @click="next(3)">{{lan.$t('lijizhuce')}}</div>
<div class="orginfo">{{lan.$t('banquan')}}</div>
</a-form>
</div>
<div v-if="stepnow == 3">
<div class="nosign">{{lan.$t('您已完成注册')}}</div>
<img <img
src="@/static/images/agree.png" src="@/static/images/success.png"
alt="" alt=""
class="agree" class="success"
v-if="ifagree"
/> />
</div> <div class="ale" @click="navto('/mine/archives')">
勾选表示同意 用户注册协议和隐私政策 {{lan.$t('qudangan')}}
</div> </div>
</a-form>
</div>
<div v-if="stepnow == 2">
<div class="nosign">
已有账号
<span class="tosign" @click="navto('/')"> 去登录 </span>
</div>
<a-form :layout="formLayout">
<div class="signform">
<a-form-item label="设置密码" class="form-item">
<a-input
class="shuru"
placeholder="请输入您的密码"
type="password"
v-model:value="userinfo.pass"
/>
</a-form-item>
<a-form-item label="设置密码" class="form-item">
<a-input
class="shuru"
placeholder="请再次输入您的密码"
type="password"
v-model:value="userinfo.passtow"
/>
</a-form-item>
<a-form-item label="姓名" class="form-item">
<a-input
class="shuru"
placeholder="请输入您的姓名"
v-model:value="userinfo.name"
/>
</a-form-item>
<a-form-item label="邮箱" class="form-item">
<a-input
class="shuru"
placeholder="请输入您的邮箱"
v-model:value="userinfo.emil"
/>
</a-form-item>
<a-form-item label="母语" class="form-item">
<a-input
class="shuru"
placeholder="请输入您的母语"
v-model:value="userinfo.muyu"
/>
</a-form-item>
<a-form-item label="教授" class="form-item">
<a-select
v-model:value="userinfo.jiaoshou"
class="getcode"
style="color: #111"
placeholder="请选择您的教授"
>
<a-select-option
v-for="(item, index) in willsay"
:key="index"
:value="item.languageid"
>
{{ item.name }}
</a-select-option>
</a-select>
</a-form-item>
</div>
<div class="submit" @click="next(3)">立刻注册</div>
<div class="orginfo">Beelink公司版权所有 20192022</div>
</a-form>
</div>
<div v-if="stepnow == 3">
<div class="nosign">您已完成注册</div>
<img src="@/static/images/success.png" alt="" class="success" />
<div class="ale" @click="navto('/mine/archives')">
恭喜您注册成功点击跳转到我的档案页面
</div>
</div>
</div>
<div :class="stepnow != 2 ? 'right' : 'right right1'">
<div class="steps">
<div class="step">
<div :class="stepnow == 1 ? 'circle step1' : 'circle'">01</div>
<div :class="stepnow == 1 ? 'stepnow' : ''">验证手机号</div>
</div>
<div class="stepline"></div>
<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> </div>
</div> </div>
<div class="stepline"></div> <div :class="stepnow != 2 ? 'right' : 'right right1'">
<div class="step"> <div class="steps">
<div :class="stepnow == 3 ? 'circle step1' : 'circle'">03</div> <div class="step">
<div :class="stepnow == 3 ? 'stepnow' : ''">帐号注册完成</div> <div :class="stepnow == 1 ? 'circle step1' : 'circle'">
01
</div>
<div :class="stepnow == 1 ? 'stepnow' : ''">
{{lan.$t('yanzhengshouji')}}
</div>
</div>
<div class="stepline"></div>
<div class="step">
<div :class="stepnow == 2 ? 'circle step1' : 'circle'">
02
</div>
<div :class="stepnow == 2 ? 'stepnow' : ''">
{{lan.$t('tianxiexinxi')}}
</div>
<div class="back" @click="next(1)" v-if="stepnow == 2">
{{lan.$t('fanhuishangyibu')}}
</div>
</div>
<div class="stepline"></div>
<div class="step">
<div :class="stepnow == 3 ? 'circle step1' : 'circle'">
03
</div>
<div :class="stepnow == 3 ? 'stepnow' : ''">
{{lan.$t('zhucewancheng')}}
</div>
</div>
</div>
<div class="icons" v-if="stepnow == 2">
<img src="@/static/images/weixin.png" alt="" class="icon" />
<img src="@/static/images/weibo.png" alt="" class="icon" />
<img
src="@/static/images/facebook.png"
alt=""
class="icon"
/>
</div>
</div> </div>
</div>
<div class="icons" v-if="stepnow == 2">
<img src="@/static/images/weixin.png" alt="" class="icon" />
<img src="@/static/images/weibo.png" alt="" class="icon" />
<img src="@/static/images/facebook.png" alt="" class="icon" />
</div>
</div>
</div> </div>
</div> </div>
</template> </template>
<script lang="ts"> <script lang="ts">
import { defineComponent, reactive, ref, toRaw } from "vue"; import { defineComponent, onMounted, reactive, ref, toRaw } from "vue";
import NavTop from "@/components/NavTop.vue"; import NavTop from "@/components/NavTop.vue";
import { checksmscode, getwillsay, register, sendsms } from "@/api"; import {
checksmscode,
getquhaolist,
getwillsay,
register,
sendsms,
} from "@/api";
import { message } from "ant-design-vue"; import { message } from "ant-design-vue";
import router from "@/router"; import router from "@/router";
import { useI18n } from "@/utils/i18n";
export default defineComponent({ export default defineComponent({
name: "Sign", name: "Sign",
components: { NavTop }, components: { NavTop },
setup() { setup() {
const lan: any = useI18n();
const formLayout = { const formLayout = {
labelCol: 4, labelCol: 4,
wrapperCol: 14, wrapperCol: 14,
@ -195,9 +255,20 @@ export default defineComponent({
jiaoshou: "", jiaoshou: "",
}); });
const willsay = ref<any>(); const willsay = ref<any>();
const quhaolist = ref<any>([
{
code: "86",
id: 214,
name: "中国",
},
]);
getwillsay().then((res) => { getwillsay().then((res) => {
willsay.value = res; willsay.value = res;
}); });
onMounted(async () => {
quhaolist.value = await getquhaolist();
});
/** /**
* @param * @param
* 点击获取验证码 触发60S倒计时 * 点击获取验证码 触发60S倒计时
@ -218,9 +289,9 @@ export default defineComponent({
console.log(phone); console.log(phone);
time.value = time.value - 1; time.value = time.value - 1;
if (time.value <= 0) { if (time.value <= 0) {
time.value = 60; time.value = 60;
clearInterval(timestep); clearInterval(timestep);
lock = false; lock = false;
} }
}, 1000); }, 1000);
}; };
@ -228,8 +299,8 @@ export default defineComponent({
/** /**
*@param *@param
* 用户协议前面radio 的点击效果 * 用户协议前面radio 的点击效果
*/ */
const agree: () => void = () => { const agree: () => void = () => {
ifagree.value = ifagree.value == true ? false : true; ifagree.value = ifagree.value == true ? false : true;
console.log(ifagree.value, 600); console.log(ifagree.value, 600);
@ -246,9 +317,9 @@ export default defineComponent({
message.error("密码不能为空"); message.error("密码不能为空");
return false; return false;
} }
if(userinfo.value.pass!=userinfo.value.passtow){ if (userinfo.value.pass != userinfo.value.passtow) {
message.error("两次密码输入不一致") message.error("两次密码输入不一致");
return return;
} }
if (userinfo.value.name == "") { if (userinfo.value.name == "") {
message.error("姓名不能为空"); message.error("姓名不能为空");
@ -270,14 +341,13 @@ export default defineComponent({
} }
/** /**
*@param e 跳到哪一步 *@param e 跳到哪一步
* 步骤条跳到某一步 * 步骤条跳到某一步
*/ */
async function next(e: number) { async function next(e: number) {
if (!ifagree.value) {
if(!ifagree.value){ message.error("请同意用户协议");
message.error("请同意用户协议"); return;
return ;
} }
if (stepnow.value > e) { if (stepnow.value > e) {
stepnow.value = e; stepnow.value = e;
@ -285,35 +355,37 @@ export default defineComponent({
} }
switch (e) { switch (e) {
case 2: { case 2: {
console.log(e); console.log(e);
if (phone.value.phone == "") { if (phone.value.phone == "") {
message.error("手机号不能为空"); message.error("手机号不能为空");
return; return;
} else if (phone.value.code == "") { } else if (phone.value.code == "") {
message.error("验证码不能为空"); message.error("验证码不能为空");
return; return;
} }
const res = await checksmscode( const res = await checksmscode(
phone.value.quhao + phone.value.phone, phone.value.quhao + phone.value.phone,
phone.value.code phone.value.code
); );
if (res) { if (res) {
stepnow.value = e; stepnow.value = e;
} }
break;
break;
} }
case 3: { case 3: {
console.log(userinfo.value); console.log(userinfo.value);
const yz = yanzheng(); const yz = yanzheng();
if (yz) { if (yz) {
const res = await register({ const res = await register({
...toRaw(phone.value), ...toRaw(phone.value),
...toRaw(userinfo.value), ...toRaw(userinfo.value),
}); });
if (res) { if (res) {
stepnow.value = e; stepnow.value = e;
} }
} }
} }
} }
} }
@ -332,208 +404,210 @@ export default defineComponent({
userinfo, userinfo,
willsay, willsay,
navto, navto,
lan,
quhaolist,
}; };
}, },
}); });
</script> </script>
<style lang="scss" scoped> <style lang="scss" scoped>
.login ::v-deep(.ant-select-selection) { .login ::v-deep(.ant-select-selection) {
border: none; border: none;
} }
.login ::v-deep(.ant-input) { .login ::v-deep(.ant-input) {
border: none; border: none;
} }
.ant-input:focus { .ant-input:focus {
border: none; border: none;
border-bottom: 1px solid white !important; border-bottom: 1px solid white !important;
box-shadow: none; box-shadow: none;
} }
.login ::v-deep(.ant-form-item-label) { .login ::v-deep(.ant-form-item-label) {
line-height: 14px; line-height: 14px;
} }
.login ::v-deep(.ant-form-item) ::v-deep(label) { .login ::v-deep(.ant-form-item) ::v-deep(label) {
color: #0dbba4; color: #0dbba4;
font-size: 11px; font-size: 11px;
left: 1px; left: 1px;
} }
.login { .login {
min-width: 100%; min-width: 100%;
height: 100vh; height: 100vh;
background: url("../../static/images/loginbg.png"); background: url("../../static/images/loginbg.png");
background-size: 100% 130%; background-size: 100% 130%;
background-repeat: no-repeat; background-repeat: no-repeat;
.box { .box {
padding-top: 145px; padding-top: 145px;
display: flex;
justify-content: space-around;
.left1 {
width: 710px !important;
}
.left {
width: 314px;
.title {
font-size: 17px;
font-weight: bold;
}
.orgname {
font-size: 29px;
color: #0dbba4;
cursor: pointer;
}
.nosign {
font-size: 12px;
color: #666666;
margin-top: 17px;
margin-bottom: 35px;
}
.tosign {
color: #0dbba4;
cursor: pointer;
}
.tab {
margin-bottom: 30px;
}
.form-item {
border-bottom: 1px solid #e5e5e5;
font-size: 15px;
margin-right: 40px;
}
.line {
width: 1px;
height: 14px;
background: #e5e5e5;
margin-top: 10px;
position: relative;
z-index: 999;
}
.getcode {
font-size: 15px;
color: #08ae98;
width: 313px;
// width: 50%;
line-height: 30px;
cursor: pointer;
}
.orginfo {
margin-top: 178px;
}
.submit {
width: 143px;
height: 35px;
background: linear-gradient(
90deg,
#00dac2,
#42de9e,
#88e062,
#d0eb3e,
#fffa18
);
border-radius: 18px;
font-size: 15px;
color: white;
font-weight: 800;
text-align: center;
line-height: 35px;
margin-top: 45px;
}
.agreement {
font-size: 12px;
display: flex; display: flex;
margin-top: 23px; justify-content: space-around;
cursor: default; .left1 {
.ifagree { width: 710px !important;
width: 12px;
height: 12px;
border-radius: 3px;
border: 1px solid #0ebca4;
margin: auto 0;
margin-right: 7px;
.agree {
width: 8px;
height: 6px;
position: relative;
top: -4px;
left: 2.5px;
}
} }
} .left {
} width: 314px;
.right1 { .title {
width: 230px !important; font-size: 17px;
} font-weight: bold;
.right { }
width: 690px; .orgname {
.steps { font-size: 29px;
padding-top: 112px; color: #0dbba4;
.stepline { cursor: pointer;
width: 1px; }
height: 50px; .nosign {
border: 1px dashed #eeeeee; font-size: 12px;
position: relative; color: #666666;
left: 13px; margin-top: 17px;
margin-bottom: 35px;
}
.tosign {
color: #0dbba4;
cursor: pointer;
}
.tab {
margin-bottom: 30px;
}
.form-item {
border-bottom: 1px solid #e5e5e5;
font-size: 15px;
margin-right: 40px;
}
.line {
width: 1px;
height: 14px;
background: #e5e5e5;
margin-top: 10px;
position: relative;
z-index: 999;
}
.getcode {
font-size: 15px;
color: #08ae98;
width: 313px;
// width: 50%;
line-height: 30px;
cursor: pointer;
}
.orginfo {
margin-top: 178px;
}
.submit {
width: 143px;
height: 35px;
background: linear-gradient(
90deg,
#00dac2,
#42de9e,
#88e062,
#d0eb3e,
#fffa18
);
border-radius: 18px;
font-size: 15px;
color: white;
font-weight: 800;
text-align: center;
line-height: 35px;
margin-top: 45px;
}
.agreement {
font-size: 12px;
display: flex;
margin-top: 23px;
cursor: default;
.ifagree {
width: 12px;
height: 12px;
border-radius: 3px;
border: 1px solid #0ebca4;
margin: auto 0;
margin-right: 7px;
.agree {
width: 8px;
height: 6px;
position: relative;
top: -4px;
left: 2.5px;
}
}
}
} }
.step { .right1 {
display: flex; width: 230px !important;
color: #999999;
font-size: 11px;
line-height: 28px;
font-weight: bold;
.back {
color: #0dbba4;
margin-left: 23px;
}
.circle {
width: 29px;
height: 29px;
border-radius: 15px;
background: #eeeeee;
font-size: 12px;
color: #999999;
text-align: center;
line-height: 29px;
font-weight: 800;
margin-right: 17px;
}
} }
.step1 { .right {
background: #08ae98 !important; width: 690px;
color: white !important; .steps {
padding-top: 112px;
.stepline {
width: 1px;
height: 50px;
border: 1px dashed #eeeeee;
position: relative;
left: 13px;
}
.step {
display: flex;
color: #999999;
font-size: 11px;
line-height: 28px;
font-weight: bold;
.back {
color: #0dbba4;
margin-left: 23px;
}
.circle {
width: 29px;
height: 29px;
border-radius: 15px;
background: #eeeeee;
font-size: 12px;
color: #999999;
text-align: center;
line-height: 29px;
font-weight: 800;
margin-right: 17px;
}
}
.step1 {
background: #08ae98 !important;
color: white !important;
}
.stepnow {
color: #111111;
}
}
} }
.stepnow { }
color: #111111; .signform {
display: flex;
flex-wrap: wrap;
.shuru {
width: 313px;
} }
}
} }
} .icons {
.signform { margin-right: 41px;
display: flex; margin-top: 227px;
flex-wrap: wrap; .icon {
.shuru { width: 28px;
width: 313px; height: 28px;
margin-right: 18px;
float: right;
}
} }
} .success {
.icons { width: 250px;
margin-right: 41px; height: 233px;
margin-top: 227px; }
.icon { .ale {
width: 28px; color: #08ae98;
height: 28px; font-size: 14px;
margin-right: 18px; font-weight: 800;
float: right; margin-top: 34px;
cursor: pointer;
} }
}
.success {
width: 250px;
height: 233px;
}
.ale {
color: #08ae98;
font-size: 14px;
font-weight: 800;
margin-top: 34px;
cursor: pointer;
}
} }
</style> </style>

View File

@ -15,7 +15,7 @@
<template v-slot:icon><UserOutlined /></template> <template v-slot:icon><UserOutlined /></template>
</a-avatar> </a-avatar>
<div class="mengceng" style="width: 85px;height: 85px;"> <div class="mengceng" style="width: 85px;height: 85px;">
修改头像 {{lan.$t('xiugaitouxiang')}}
</div> </div>
</a-upload> </a-upload>
@ -23,7 +23,7 @@
<div class="update-btn" @click="updateUserName" style="color: #fff;cursor: unset;">修改</div> <div class="update-btn" @click="updateUserName" style="color: #fff;cursor: unset;">修改</div>
<div class="value">{{ userinfo.name }}</div> <div class="value">{{ userinfo.name }}</div>
<div class="update-btn" @click="updateUserName">修改</div> <div class="update-btn" @click="updateUserName">{{lan.$t('xiugai')}}</div>
</div> </div>
<div class="user-name" v-else> <div class="user-name" v-else>
<a-input size="small" v-model:value="userinfo.name" placeholder="请输入新的昵称" /> <a-input size="small" v-model:value="userinfo.name" placeholder="请输入新的昵称" />
@ -311,6 +311,7 @@ import smile from "@/static/images/smile.png"
import smilet from "@/static/images/smilet.png" import smilet from "@/static/images/smilet.png"
import { changetel, checksmscode, editpassword, editsystemsetting, getarchives, getcurrencys, getlanguages, getquhaolist, getzonelist, putmember, sendsms } from "@/api/index" import { changetel, checksmscode, editpassword, editsystemsetting, getarchives, getcurrencys, getlanguages, getquhaolist, getzonelist, putmember, sendsms } from "@/api/index"
import { message } from 'ant-design-vue'; import { message } from 'ant-design-vue';
import { useI18n } from '@/utils/i18n';
export default defineComponent({ export default defineComponent({
name: "Archives", name: "Archives",
@ -320,6 +321,7 @@ export default defineComponent({
NavBottom NavBottom
}, },
setup(){ setup(){
const lan: any = useI18n();
interface SpeakItem{ interface SpeakItem{
lang: string; lang: string;
proficiency: number; proficiency: number;