diff --git a/src/router/index.ts b/src/router/index.ts index 0682db7..6886dda 100644 --- a/src/router/index.ts +++ b/src/router/index.ts @@ -37,7 +37,12 @@ const routes: Array = [ path: '/login', name: 'Login', component:Login - } + }, + { + path: '/sign', + name: 'Sign', + component: () => import('../views/login/Sign.vue') + }, ] const router = createRouter({ diff --git a/src/views/login/Login.vue b/src/views/login/Login.vue index f6d2abf..042d88a 100644 --- a/src/views/login/Login.vue +++ b/src/views/login/Login.vue @@ -3,7 +3,6 @@
- 您好，欢迎来到 Beelink
@@ -13,7 +12,7 @@
-
+
@@ -29,25 +28,36 @@ -
点击获取验证码{{time==60?'':'('+time+')'}}
+
+ 点击获取验证码{{ time == 60 ? "" : "(" + time + ")" }} +
立即登录
+
Beelink公司版权所有 2019—2022
-
+
- + - +
忘记密码?
 @@ -55,7 +65,79 @@
-
+
+
亿万人的信赖和见证
+
Beelink 开启您的美好学习生活
+ +
+
+
+
+ 西班牙语A1级教学 + 7.5分 +
+
+
+
+
+ 西班牙语A1级教学 + 7.5分 +
+
+
+
+
+ 西班牙语A1级教学 + 7.5分 +
+
+
+
+
+ 西班牙语A1级教学 + 7.5分 +
+
+
+
+
+ 西班牙语A1级教学 + 7.5分 +
+
+
+
+
+ 西班牙语A1级教学 + 7.5分 +
+
+
+
+ + + +
+
+
+
+
+
关于 Beelink
+
+
+ Beelink平台拥有数千名优秀老师，丰富的教育经验和有趣的课堂环境，一对一辅导 + 平台的教务管理、线上课堂、线下课堂、助学互动，课程回放等多项教学功能，让 + 您利用碎片时间，轻轻松松学会各种语言。 +
+
+
了解更多
+ +
136-0111-1111
+ + +
136-0111-1111
+
+
@@ -73,32 +155,32 @@ export default defineComponent({ labelCol: 4, wrapperCol: 14, }; - const tabselected= ref(1) - const time=ref(60) - const Selectnum: (val: number) => void = (val: number) => { - console.log("收到子组件事件", val) + const tabselected = ref(1); + const time = ref(60); + const Selectnum: (val: number) => void = (val: number) => { + console.log("收到子组件事件", val); - tabselected.value=val - } - 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); + tabselected.value = val; + }; + 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); } - },1000) - } + }, 1000); + }; return { formLayout, tabselected, Selectnum, getcode, - time + time, }; }, }); @@ -121,10 +203,10 @@ export default defineComponent({ .login /deep/ .ant-form-item /deep/ label { color: #0dbba4; font-size: 11px; - left:1px + left: 1px; } .login { - min-width: 100vw; + min-width: 100%; height: 100vh; background: url("../../../static/loginbg.png"); background-size: 100% 130%; @@ -161,8 +243,8 @@ export default defineComponent({ .form-item { border-bottom: 1px solid #e5e5e5; font-size: 15px; - .shuru{ - margin-right:30px + .shuru { + margin-right: 30px; } } .line { @@ -198,16 +280,123 @@ export default defineComponent({ text-align: center; line-height: 35px; margin-top: 45px; + margin-bottom: 178px; } - .forget{ - color: #08AE98; + .forget { + color: #08ae98; font-size: 12px; - margin-top:8px; + margin-top: 8px; cursor: pointer; } } .right { width: 690px; + .top { + font-size: 26px; + color: #08ae98; + font-weight: bold; + } + .topdesc { + color: #343434; + font-size: 12px; + margin-top: 14px; + margin-bottom: 23px; + } + .lessons { + // width: 655px; + height: 342px; + display: flex; + flex-wrap: wrap; + margin-bottom: 140px; + .lessonitem { + width: 200px; + height: 157px; + background: #ffffff; + box-shadow: 1px 5px 7px 0px rgba(158, 158, 158, 0.11); + border-radius: 18px; + margin-right: 23px; + margin-bottom: 29px; + .pic { + width: 200px; + height: 112px; + background: #98a6b8; + border-radius: 18px 18px 0px 0px; + } + .lessonname { + color: #121212; + font-size: 12px; + line-height: 45px; + text-indent: 17px; + .score { + color: #f55456; + } + } + } + } + .icons { + margin-right: 41px; + .icon { + width: 28px; + height: 28px; + margin-right: 18px; + float: right; + } + } + } + } + .bottom { + height: 317px; + margin-top: 44px; + background: #08ae98; + color: white; + font-size: 10px; + .content { + width: 415px; + // text-align: center; + padding-top: 59px; + margin-left: 144px; + .title { + font-size: 18px; + font-weight: 800; + } + .rowline { + width: 46px; + height: 2px; + background: #68df7e; + margin-top: 18px; + margin-bottom: 34px; + } + .texts{ + text-align: left; + margin: 0 auto; + } + .relation{ + height:29px; + background: gold; + display: flex; + line-height: 29px; + margin-top: 52px; + color: white; + .more{ + width: 86px; + height: 29px; + background: #68DF7E; + color:white; + text-align: center; + line-height: 29px; + border-radius: 15px; + } + .icon{ + width: 9px; + height: 12px; + margin: auto 0; + margin-right:6px; + margin-left: 29px; + } + .email{ + width: 15px; + } + } } } } diff --git a/src/views/login/Sign.vue b/src/views/login/Sign.vue new file mode 100644 index 0000000..4d44b20 --- /dev/null +++ b/src/views/login/Sign.vue @@ -0,0 +1,373 @@ + + + + \ No newline at end of file diff --git a/static/agree.png b/static/agree.png new file mode 100644 index 0000000..6dab149 Binary files /dev/null and b/static/agree.png differ diff --git a/static/email.png b/static/email.png new file mode 100644 index 0000000..ddf119e Binary files /dev/null and b/static/email.png differ diff --git a/static/facebook.png b/static/facebook.png new file mode 100644 index 0000000..042d1c0 Binary files /dev/null and b/static/facebook.png differ diff --git a/static/success.png b/static/success.png new file mode 100644 index 0000000..60fa7d8 Binary files /dev/null and b/static/success.png differ diff --git a/static/tel.png b/static/tel.png new file mode 100644 index 0000000..37a23c1 Binary files /dev/null and b/static/tel.png differ diff --git a/static/weibo.png b/static/weibo.png new file mode 100644 index 0000000..52698b9 Binary files /dev/null and b/static/weibo.png differ diff --git a/static/weixin.png b/static/weixin.png new file mode 100644 index 0000000..6622aaf Binary files /dev/null and b/static/weixin.png differ