|
|
@@ -1,25 +1,17 @@
|
|
|
<template>
|
|
|
<view class="login-page">
|
|
|
- <view class="com-model">
|
|
|
- <view class="top-box">
|
|
|
- <image class="pic" src="/static/images/shade.png"></image>
|
|
|
- <text class="title-top" @click="openModal">你好，</text>
|
|
|
- <text class="title-buttom">欢迎使用追踪方法学系统</text>
|
|
|
- </view>
|
|
|
- <view class="main-content">
|
|
|
- <input class="uni-input-box"
|
|
|
- placeholder="请输入账号"
|
|
|
- placeholder-style="color: #A1A7B3"
|
|
|
- v-model="username" />
|
|
|
- <input class="uni-input-box"
|
|
|
- placeholder="请输入密码"
|
|
|
- placeholder-style="color: #A1A7B3"
|
|
|
- password
|
|
|
- v-model="password" />
|
|
|
- <com-button class="login-button"
|
|
|
- :width="998" :height="120" :fontSize="48" :background="isLogin?'#A3B1CC':''" btnText="登录" @btnClick="login" />
|
|
|
- </view>
|
|
|
+ <image class="bgImage" src="/static/images/shade.png"></image>
|
|
|
+ <text class="titleOne row" @click="openModal">你好，</text>
|
|
|
+ <view class="titleTwo row">欢迎使用追踪方法学系统</view>
|
|
|
+ <view class="inputArea">
|
|
|
+ <input class="inputTag" type="text" placeholder="请输入账号" placeholder-class="inputTagHolderPlace" v-model="username" />
|
|
|
</view>
|
|
|
+ <view class="inputArea pwd">
|
|
|
+ <input class="inputTag" password="true" type="text" placeholder="请输入密码" placeholder-class="inputTagHolderPlace" v-model="password" />
|
|
|
+ </view>
|
|
|
+
|
|
|
+ <button :class="[isInput?'loginBtn on':'loginBtn']" type="default" @click="login" >登录</button>
|
|
|
+
|
|
|
<tm-modal v-if="showInputModal" @click="clickModalhandle">
|
|
|
<view class="checkItemResultModal">
|
|
|
<view class="modalContent">
|
|
|
@@ -54,6 +46,11 @@
|
|
|
]
|
|
|
}
|
|
|
},
|
|
|
+ computed:{
|
|
|
+ isInput:function(){
|
|
|
+ return (this.username.length>0&&this.password.length>0)?true:false
|
|
|
+ }
|
|
|
+ },
|
|
|
onLoad({ hospSign }){
|
|
|
this.hospSign = hospSign;
|
|
|
// #ifdef APP-PLUS
|
|
|
@@ -62,7 +59,7 @@
|
|
|
// #endif
|
|
|
},
|
|
|
mounted(){
|
|
|
-
|
|
|
+ console.log(this.username);
|
|
|
},
|
|
|
methods: {
|
|
|
openScanner(){
|
|
|
@@ -142,20 +139,94 @@
|
|
|
}
|
|
|
}
|
|
|
}
|
|
|
- },
|
|
|
- computed:{
|
|
|
- //判断是否输入了用户名和密码
|
|
|
- isLogin(){
|
|
|
- return !this.username || !this.password;
|
|
|
- }
|
|
|
}
|
|
|
}
|
|
|
</script>
|
|
|
|
|
|
<style lang="less" scoped>
|
|
|
.login-page {
|
|
|
+ display: flex;
|
|
|
+ flex-direction: column;
|
|
|
+ justify-content: center;
|
|
|
height:100vh;
|
|
|
+ padding: 0 62.5rpx;
|
|
|
+ padding-bottom: 100rpx;
|
|
|
background-color: #FFFFFF;
|
|
|
+ .bgImage {
|
|
|
+ position: absolute;
|
|
|
+ right: 0;
|
|
|
+ top:0;
|
|
|
+ width: 430rpx;
|
|
|
+ height: 281.25rpx;
|
|
|
+ }
|
|
|
+ .row {
|
|
|
+ font-size: 45rpx;
|
|
|
+ font-family: SourceHanSansCN-Bold, SourceHanSansCN;
|
|
|
+ font-weight: bold;
|
|
|
+ color: #2E2F33;
|
|
|
+ line-height: 67.5rpx;
|
|
|
+ }
|
|
|
+ .titleTwo {
|
|
|
+ margin-bottom: 75rpx;
|
|
|
+ }
|
|
|
+ .inputArea {
|
|
|
+ height: 80rpx;
|
|
|
+ margin-bottom: 37.5rpx;
|
|
|
+ border-bottom: 1.25rpx solid #E6EAF2;
|
|
|
+ input {
|
|
|
+ -webkit-box-shadow: 0 0 0 1000px white inset;
|
|
|
+ }
|
|
|
+ .inputTag {
|
|
|
+ height: 100%;
|
|
|
+ width: 100%;
|
|
|
+ font-size: 30rpx;
|
|
|
+ font-family: SourceHanSansCN-Medium, SourceHanSansCN;
|
|
|
+ font-weight: 500;
|
|
|
+ color: #292C33;
|
|
|
+
|
|
|
+ // &.-internal-autofill-selected {
|
|
|
+ // background-color:#FFFFFF;
|
|
|
+ // }
|
|
|
+ }
|
|
|
+ // /deep/.inputTag .uni-input-input {
|
|
|
+ // font-size: 30rpx;
|
|
|
+ // font-family: SourceHanSansCN-Medium, SourceHanSansCN;
|
|
|
+ // font-weight: 500;
|
|
|
+ // color: #292C33;
|
|
|
+ // box-shadow: 0 0 0 54rpx #fff inset;
|
|
|
+ // }
|
|
|
+ .inputTagHolderPlace {
|
|
|
+ font-size: 30rpx;
|
|
|
+ font-family: SourceHanSansCN-Normal, SourceHanSansCN;
|
|
|
+ font-weight: 400;
|
|
|
+ color: #B8BECC;
|
|
|
+ }
|
|
|
+ // /deep/.inputTag .uni-input-placeholder {
|
|
|
+ // font-size: 30rpx;
|
|
|
+ // }
|
|
|
+ &.pwd {
|
|
|
+ margin-bottom: 62.5rpx;
|
|
|
+ }
|
|
|
+ }
|
|
|
+ .loginBtn {
|
|
|
+ display: block;
|
|
|
+ width: 100%;
|
|
|
+ height: 75rpx;
|
|
|
+ text-align: center;
|
|
|
+ line-height: 75rpx;
|
|
|
+ font-size: 30rpx;
|
|
|
+ font-family: SourceHanSansCN-Normal, SourceHanSansCN;
|
|
|
+ font-weight: 400;
|
|
|
+ color: #FFFFFF;
|
|
|
+ background: #A3B1CC;
|
|
|
+ border-radius: 37.5rpx;
|
|
|
+ border:none;
|
|
|
+ background-color: #A3B1CC;
|
|
|
+ &.on {
|
|
|
+ background: linear-gradient(90deg, #3377FF 0%, #4D97FF 100%);
|
|
|
+ }
|
|
|
+ }
|
|
|
+
|
|
|
.checkItemResultModal {
|
|
|
display: flex;
|
|
|
height: 100%;
|
|
|
@@ -202,53 +273,7 @@
|
|
|
}
|
|
|
}
|
|
|
}
|
|
|
- .top-box {
|
|
|
- display: flex;
|
|
|
- flex-direction: column;
|
|
|
- padding-left: 62.5rpx;
|
|
|
- .pic{
|
|
|
- position: absolute;
|
|
|
- top: 0;
|
|
|
- right: 0;
|
|
|
- width: 430rpx;
|
|
|
- height: 281.25rpx;
|
|
|
- }
|
|
|
- .title-top{
|
|
|
- height: 45rpx;
|
|
|
- font-size: 45rpx;
|
|
|
- font-weight: bold;
|
|
|
- margin-top: 250rpx;
|
|
|
- font-family: SourceHanSansCN-Bold, SourceHanSansCN;
|
|
|
- color: #2E2F33;
|
|
|
- }
|
|
|
- .title-buttom{
|
|
|
- margin-top: 40rpx;
|
|
|
- height: 45rpx;
|
|
|
- font-size: 45rpx;
|
|
|
- font-family: SourceHanSansCN-Bold, SourceHanSansCN;
|
|
|
- font-weight: bold;
|
|
|
- color: #2E2F33;
|
|
|
- }
|
|
|
- }
|
|
|
- .main-content{
|
|
|
- margin-top: 37.5rpx;
|
|
|
- float: left;
|
|
|
- }
|
|
|
- .uni-input-box{
|
|
|
- width: 625rpx;
|
|
|
- float: left;
|
|
|
- margin-left: 62.5rpx;
|
|
|
- margin-top: 62.5rpx;
|
|
|
- font-size: 30rpx;
|
|
|
- padding-bottom: 25rpx;
|
|
|
- border-bottom:1.25rpx solid #E6EAF2 ;
|
|
|
- }
|
|
|
- .login-button{
|
|
|
- float: left;
|
|
|
- margin-left: 62.5rpx;
|
|
|
- margin-top: 62.5rpx;
|
|
|
- background-color: #A3B1CC;
|
|
|
- }
|
|
|
+
|
|
|
}
|
|
|
|
|
|
</style>
|
