#

whycq

2022-09-23 c4383c19781df1b3667df72453c4dcd3388ec6d1

 pages/login/login.vue

@@ -6,19 +6,21 @@
         <view class="user-info-item shadow-warp">
            <view class="icons"><uni-icons type="person" size="20"></uni-icons></view>
            <text>账号：</text>
            <input type="text">
            <input type="text" placeholder="请输入账号!" 
            placeholder-style="font-size:14px;color:#ccc;">
         </view>
         <view class="user-info-item shadow-warp">
            <view class="icons"><uni-icons type="locked" size="20"></uni-icons></view>
            <text>密码：</text>
            <input :password="!showPassword" v-model="password">
            <input :password="!showPassword" v-model="password" placeholder="请输入密码!"
            placeholder-style="font-size:14px;color:#ccc;">
            <view class="showPassword" v-if="showPassword" @click="changePassword"><uni-icons type="eye" size="20"></uni-icons></view>
            <view class="showPassword" v-if="!showPassword" @click="changePassword"><uni-icons type="eye-slash" size="20"></uni-icons></view>
         </view>
      </view>
      <!-- 登录按钮 -->
      <view class="loging">
         <button class="button" >登录</button>
         <button class="button" @click="onLogin()" >登录</button>
      </view>
      <!-- #ifdef APP-PLUS -->
      <view class="version">
@@ -49,6 +51,14 @@
      methods: {
         changePassword: function() {
             this.showPassword = !this.showPassword;
         },
         onLogin() {
            uni.reLaunch({
               url:"/pages/home/home",
               animationType: 'pop-in',
               animationDuration: 2000
					
            })
         },
      }
   }
@@ -86,9 +96,14 @@
      align-items:center;
      background-color: #fff;
      margin-bottom: 30rpx;
      font-size: 28rpx;
      font-weight: 500;
   }
   .user-info-item input{
      width: 350rpx;
   .user-info-item>input{
      width: 400rpx;
      color:#606266;
      font-weight: 500;
      caret-color:#606266; // 光标颜色
   }
   .icons {
      margin-left: 20rpx;