Skip to content

P
pica.cloud.web-education-admin
提交 7d795ca1 编写于 作者: Yuanzhao.dai's avatar Yuanzhao.dai
浏览文件
操作

计时器

上级 51577993
展开全部 隐藏空白字符变更
内嵌 并排
正在显示 包含 166 行增加 和 28 行删除
src/assets/image/VR-code.svg 0 → 100644
浏览文件 @ 7d795ca1
此差异已折叠。
src/assets/image/VR-mobile.svg 0 → 100644
浏览文件 @ 7d795ca1
<?xml version="1.0" encoding="UTF-8"?>
<svg width="24px" height="24px" viewBox="0 0 24 24" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
<!-- Generator: Sketch 53.2 (72643) - https://sketchapp.com -->
<title>手机</title>
<desc>Created with Sketch.</desc>
<g id="页面-1" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
<g id="切图" transform="translate(-314.000000, -214.000000)" fill="#B3BEC5" fill-rule="nonzero">
<g id="手机" transform="translate(314.000000, 214.000000)">
<path d="M11.0209906,17.1295455 C11.0209906,17.6455895 11.4393269,18.0639258 11.9553709,18.0639258 C12.4714149,18.0639258 12.8897512,17.6455895 12.8897512,17.1295455 C12.8897512,16.6135015 12.4714149,16.1951652 11.9553709,16.1951652 C11.4393269,16.1951652 11.0209906,16.6135015 11.0209906,17.1295455 L11.0209906,17.1295455 Z" id="Shape"></path>
<path d="M13.1163284,5.7778511 C13.1163284,5.70988813 13.0755242,5.65481406 13.0251707,5.65481406 L10.7652715,5.65481406 C10.714918,5.65481406 10.6741138,5.70988813 10.6741138,5.7778511 L10.6741138,5.86511035 C10.6741138,5.93307333 10.714918,5.98814739 10.7652715,5.98814739 L13.0251707,5.98814739 C13.0755242,5.98814739 13.1163284,5.93307333 13.1163284,5.86511035 L13.1163284,5.7778511 Z" id="Shape"></path>
<path d="M15.4519362,6.45059185 L8.46080884,6.45059185 C8.27841109,6.45059185 8.09472362,6.60771679 8.09472362,6.76286604 L8.09472362,15.2372408 C8.09472362,15.39239 8.27841109,15.4785536 8.46080884,15.4785536 L15.4519362,15.4785536 C15.6343614,15.4785536 15.7506547,15.3923901 15.7506547,15.2372408 L15.7506547,6.76286601 C15.7506272,6.60771679 15.6343339,6.45059185 15.4519362,6.45059185 Z" id="Shape"></path>
<path d="M12.0033646,0.0266345564 C5.38765225,0.0266345564 0.0245765095,5.38973776 0.0245765095,12.0054226 C0.0245765095,18.6211075 5.38765225,23.9842107 12.0033646,23.9842107 C18.6190769,23.9842107 23.9821526,18.6211075 23.9821526,12.0054226 C23.9821526,5.38973776 18.6190769,0.0266345564 12.0033646,0.0266345564 Z M16.4366426,18.1704228 C16.4366426,18.5643054 16.170304,18.881217 15.8166768,18.881217 L8.1970771,18.881217 C7.84344992,18.881217 7.51844329,18.5643054 7.51844329,18.1704228 L7.51844332,5.83251947 C7.51844332,5.43863692 7.84344995,5.10602923 8.19707713,5.10602923 L15.8166768,5.10602923 C16.170304,5.10602923 16.4366426,5.43866435 16.4366426,5.83251947 L16.4366426,18.1704228 Z" id="Shape"></path>
</g>
</g>
</g>
</svg>
\ No newline at end of file
src/assets/image/close-eyes.svg 0 → 100644
浏览文件 @ 7d795ca1
<?xml version="1.0" encoding="UTF-8"?>
<svg width="20px" height="20px" viewBox="0 0 20 20" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
<!-- Generator: Sketch 53.2 (72643) - https://sketchapp.com -->
<title>不显示</title>
<desc>Created with Sketch.</desc>
<g id="页面-1" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
<g id="切图" transform="translate(-356.000000, -179.000000)" fill="#666666" fill-rule="nonzero">
<g id="不显示" transform="translate(356.000000, 183.000000)">
<path d="M2.98760777,4.47585816 C4.94765492,6.11926669 7.43127373,7.00805831 9.98980402,6.98167478 C13.9640444,7.0225326 17.6093887,4.78176931 19.3649668,1.21883894 C19.5521654,0.807512254 19.3988241,0.321333583 19.0094289,0.091583043 C18.8181252,-0.001978335 18.5972317,-0.0148501233 18.3963409,0.055857502 C18.19545,0.126565127 18.0313945,0.274927609 17.9410059,0.467636331 C16.5441006,3.58701642 13.4088477,5.56280617 9.98980402,5.4783656 C7.76037056,5.50874238 5.60065046,4.70229859 3.93751811,3.21842997 C3.09832069,2.48280435 2.41273474,1.58885528 1.92008948,0.58786491 C1.68997986,0.235586567 1.25173349,0.0817075981 0.851666507,0.212715594 C0.487789672,0.467392835 0.384104767,0.960502427 0.614641265,1.33997149 C1.22659788,2.50788576 2.0285062,3.56608405 2.98760777,4.47133829 L2.98760777,4.47585816 Z M9.9941569,7.63120872 C9.52265361,7.67647236 9.1570345,8.06269722 9.13799621,8.53562135 L9.13799621,11.0955874 C9.12205241,11.4115164 9.2816591,11.7105094 9.55312518,11.873253 C9.82459126,12.0359967 10.1637225,12.0359967 10.4351886,11.873253 C10.7066547,11.7105094 10.8662614,11.4115164 10.8503176,11.0955874 L10.8503176,8.53562135 C10.8308133,8.06289364 10.465438,7.6769264 9.9941569,7.63120872 L9.9941569,7.63120872 Z M19.1249887,8.44075636 L17.6987795,6.33190961 C17.5749658,6.11437082 17.366006,5.95824866 17.1221706,5.90110218 C16.8783351,5.84395571 16.6216962,5.89095785 16.4139945,6.03080108 C15.9765328,6.33703529 15.8514494,6.92965089 16.1278823,7.38633299 L17.5551794,9.49517974 C17.6792244,9.71246602 17.888172,9.86836726 18.1319051,9.92548974 C18.3756382,9.98261222 18.6321679,9.93580255 18.8399644,9.79628826 C19.2775285,9.49003737 19.4022102,8.89707016 19.1249887,8.44075636 L19.1249887,8.44075636 Z M3.57867083,6.18081183 C3.16908942,5.91883495 2.63140244,5.9820699 2.29388586,6.33190961 L0.867676644,8.44075636 C0.590455144,8.89707016 0.715136858,9.49003736 1.15270091,9.79628826 C1.36049738,9.93580255 1.61702715,9.98261223 1.86076023,9.92548975 C2.10449332,9.86836727 2.31344092,9.71246602 2.43748588,9.49517974 L3.8636951,7.38633299 C3.97786782,6.96217115 3.87074091,6.50907376 3.57867083,6.18081183 L3.57867083,6.18081183 Z" id="Shape"></path>
</g>
</g>
</g>
</svg>
\ No newline at end of file
src/assets/image/open-eyes.svg 0 → 100644
浏览文件 @ 7d795ca1
<?xml version="1.0" encoding="UTF-8"?>
<svg width="20px" height="20px" viewBox="0 0 20 20" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
<!-- Generator: Sketch 53.2 (72643) - https://sketchapp.com -->
<title>Group 9</title>
<desc>Created with Sketch.</desc>
<g id="页面-1" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
<g id="切图" transform="translate(-320.000000, -179.000000)" fill="#666666" fill-rule="nonzero">
<g id="Group-9" transform="translate(320.000000, 183.000000)">
<g id="Group-12">
<path d="M8.66701834,9.46570652 C7.30791394,8.87476767 6.42857143,7.51241956 6.42857143,5.99606099 C6.42857143,3.91861582 8.07394255,2.22857143 10.0963641,2.22857143 C12.118123,2.22857143 13.7628314,3.91861582 13.7628314,5.99606099 C13.7628314,7.48935192 12.9258988,8.84830772 11.6297466,9.457565 C11.2964314,9.61428931 10.9028146,9.46502805 10.7504041,9.12444103 C10.5979935,8.78453247 10.7437775,8.3815271 11.0764301,8.22480279 C11.9034229,7.83604508 12.4375224,6.96150987 12.4375224,5.99606099 C12.4375224,4.66695743 11.3872151,3.58549185 10.0963641,3.58549185 C8.80485046,3.58549185 7.75388043,4.66695743 7.75388043,5.99606099 C7.75388043,6.96693756 8.31581144,7.83875893 9.18587681,8.21733973 C9.52250529,8.36388714 9.67955441,8.76214328 9.53642104,9.10680106 C9.42907101,9.36461595 9.18388884,9.51998333 8.92611624,9.51998333 C8.83997116,9.51998333 8.7518381,9.50302183 8.66701834,9.46570652 Z" id="Shape"></path>
<path d="M9.99216722,12.0786272 C5.81147998,12.0786272 2.28417006,9.13546677 0.553316517,7.38096867 C0.196808387,7.01934937 0,6.5430703 0,6.03965282 C0,5.53555689 0.196808387,5.05927782 0.553316517,4.69765852 C2.28417006,2.94316041 5.81147998,0 9.99216722,0 C14.1728545,0 17.7001644,2.94316041 19.4303553,4.69765852 C19.7868634,5.05927782 19.9836718,5.53555689 19.9836718,6.03965282 C19.9836718,6.5430703 19.7868634,7.01934937 19.4303553,7.38096867 C19.1083052,7.70798649 18.8233638,7.9909044 18.339626,8.40747896 C18.0593231,8.64833234 17.6411881,8.61169549 17.4059458,8.32470682 C17.1707034,8.03771815 17.2064868,7.60960976 17.4867896,7.36875639 C17.9334188,6.98406945 18.1872154,6.73168224 18.4980004,6.4168767 C18.6013745,6.31171537 18.6583628,6.17805871 18.6583628,6.03965282 C18.6583628,5.90124694 18.6013745,5.76691182 18.4980004,5.66242894 C17.2210652,4.36792686 13.8368886,1.35692043 9.99216722,1.35692043 C6.14744581,1.35692043 2.76260662,4.36792686 1.48633405,5.66242894 C1.38295995,5.76691182 1.325309,5.90124694 1.325309,6.03965282 C1.325309,6.17805871 1.38295995,6.31171537 1.48633405,6.41619825 C2.76260662,7.71137878 6.14744581,10.7217068 9.99216722,10.7217068 C11.9701909,10.7217068 13.7003818,10.1321248 15.6015376,8.81048433 C15.9050333,8.59880475 16.3172044,8.68021998 16.5219647,8.99027629 C16.7280502,9.30033261 16.6491943,9.7216564 16.3463612,9.93265753 C14.2411079,11.3967747 12.221337,12.0786272 9.99216722,12.0786272" id="Shape"></path>
</g>
</g>
</g>
</g>
</svg>
\ No newline at end of file
src/views/login.vue
浏览文件 @ 7d795ca1
...@@ -18,6 +18,8 @@ ...@@ -18,6 +18,8 @@
<el-form-item label=""> <el-form-item label="">
<el-input v-model="loginData.password" placeholder="密码"> <el-input v-model="loginData.password" placeholder="密码">
<i slot="prefix" class="el-input__icon my-icon password-icon"></i> <i slot="prefix" class="el-input__icon my-icon password-icon"></i>
<i @click="showPWSBtn" v-if="!showPSW" slot="suffix" class="el-input__icon my-icon open-eyes-icon"></i>
<i @click="hidePWSBtn" v-else slot="suffix" class="el-input__icon my-icon close-eyes-icon"></i>
</el-input> </el-input>
</el-form-item> </el-form-item>
</el-form> </el-form>
...@@ -43,7 +45,8 @@ ...@@ -43,7 +45,8 @@
<el-form-item label=""> <el-form-item label="">
<el-input v-model="resetPassword.authCode" placeholder="短信验证码"> <el-input v-model="resetPassword.authCode" placeholder="短信验证码">
<i slot="prefix" class="el-input__icon my-icon auth-code-icon"></i> <i slot="prefix" class="el-input__icon my-icon auth-code-icon"></i>
<i slot="suffix" class="el-input__icon get-auth-code">获取验证码</i> <i v-if="countDown == 0" @click="getAuthCode" slot="suffix" class="el-input__icon get-auth-code">获取验证码</i>
<i v-else slot="suffix" class="el-input__icon get-auth-warning">{{countDown}}s后重发</i>
</el-input> </el-input>
</el-form-item> </el-form-item>
<el-form-item label=""> <el-form-item label="">
...@@ -63,9 +66,10 @@ ...@@ -63,9 +66,10 @@
</div> </div>
</div> </div>
<div class="vrcode"> </div>
<p></p> <div class="vrcode">
</div> <img v-show="showVRCode" src="../assets/image/VR-code.svg" alt="">
<p slot="reference" @mouseenter="showVR" @mouseleave="closeVR"><img src="../assets/image/VR-mobile.svg" alt="">下载云鹊医app</p>
</div> </div>
</div> </div>
</div> </div>
...@@ -78,7 +82,11 @@ ...@@ -78,7 +82,11 @@
return { return {
loginFlag: true, loginFlag: true,
loginData: {}, loginData: {},
resetPassword: {} resetPassword: {},
showVRCode: false,
showPSW: false,
countDown: 0,
timer: null
} }
}, },
methods: { methods: {
...@@ -87,7 +95,34 @@ ...@@ -87,7 +95,34 @@
}, },
goToResetPassword() { goToResetPassword() {
this.loginFlag = false this.loginFlag = false
} },
showVR() {
this.showVRCode = true;
},
closeVR() {
this.showVRCode = false;
},
showPWSBtn() {
this.showPSW = true
},
hidePWSBtn() {
this.showPSW = false
},
getAuthCode() {
const TIME_COUNT = 60;
if (!this.timer) {
this.countDown = TIME_COUNT;
this.timer = setInterval(() => {
if (this.countDown > 0 && this.countDown <= TIME_COUNT) {
this.countDown--;
} else {
this.countDown = 0;
clearInterval(this.timer);
this.timer = null;
}
}, 1000)
}
},
} }
} }
</script> </script>
...@@ -107,17 +142,48 @@ ...@@ -107,17 +142,48 @@
.auth-code-icon { .auth-code-icon {
background: url("../assets/image/auth-code.svg") no-repeat; background: url("../assets/image/auth-code.svg") no-repeat;
} }
.open-eyes-icon {
background: url("../assets/image/open-eyes.svg") no-repeat;
}
.close-eyes-icon {
background: url("../assets/image/close-eyes.svg") no-repeat;
}
.login-other { .login-other {
display: flex; display: flex;
height: 100%; height: 100%;
flex-direction: row; flex-direction: row;
.left { .left {
flex-grow: 1; flex-grow: 1;
/*大于1441*/
@media only screen and (min-width: 1441px) {
background: url("../assets/image/bg-big.png") no-repeat;
background-size: cover;
}
/*小于1440*/
@media only screen and (max-width: 1441px) {
background: url("../assets/image/bg-small.png") no-repeat;
background-size: cover;
}
} }
.right { .right {
position: relative;
/*大于1441*/
@media only screen and (min-width: 1441px) {
width: 570px;
}
/*小于1440*/
@media only screen and (max-width: 1441px) {
width: 500px;
}
.content { .content {
padding: 40px 50px 20px 50px; /*大于1441*/
@media only screen and (min-width: 1441px) {
padding: 140px 50px 20px 50px;
}
/*小于1440*/
@media only screen and (max-width: 1441px) {
padding: 40px 50px 20px 50px;
}
.title { .title {
text-align: center; text-align: center;
font-weight: 500; font-weight: 500;
...@@ -156,6 +222,9 @@ ...@@ -156,6 +222,9 @@
color: #666666; color: #666666;
cursor: pointer; cursor: pointer;
} }
.get-auth-warning {
color: #666666;
}
} }
} }
...@@ -198,27 +267,23 @@ ...@@ -198,27 +267,23 @@
} }
} }
.vrcode {
} position: absolute;
/*大于1441*/ bottom: 20px;
@media only screen and (min-width: 1441px) { width: 100%;
.left { text-align: center;
background: url("../assets/image/bg-big.png") no-repeat; p {
background-size: cover; text-align: center;
} font-size: 20px;
.right { color: #999999;
width: 570px; cursor: pointer;
} img {
} vertical-align: middle;
/*小于1440*/ margin-right: 4px;
@media only screen and (max-width: 1441px) { }
.left { }
background: url("../assets/image/bg-small.png") no-repeat;
background-size: cover;
}
.right {
width: 500px;
} }
} }
} }
</style> </style>
Markdown 格式
0% or
您添加了 0 人 到此讨论。请谨慎行事。
先完成此消息的编辑！
想要评论请 注册 或