update组件

xuxueyang

2024-07-12 48dd8be3d25e5b6d8bfa57ad757569f470f5ff74

 pages/login/supplier-login.vue

@@ -13,24 +13,36 @@
                  <view class="title-1">HELLO</view>

                  <view class="title-2">欢迎登录<span class="title-3">花满芜</span></view>

               </view>

               <view class="t-a input" v-if="loginType=='pwd'">

                  <input type="text" name="userName" placeholder="请输入账号" v-model="userName" />

               <view class="t-a input form-input" v-if="loginType=='pwd'">

                  <!-- <input type="text" name="userName" placeholder="请输入账号" v-model="userName" /> -->
                  <u-input placeholder="请输入账号"    :border="false"   v-model="userName"></u-input>
						
               </view>

               <view class="t-a input" v-if="loginType=='pwd'">

                  <input type="text" :password="true" name="password" placeholder="请输入密码" v-model="password" />

               <view class="t-a input form-input" v-if="loginType=='pwd'">

                  <!-- <input type="text" :password="true" name="password" placeholder="请输入密码" v-model="password" /> -->
                  <u-input :password="true" :border="false"     placeholder="请输入密码" v-model="password"></u-input>

               </view>

               <view class="t-a input" v-if="loginType=='code'">

               <view class="t-a input form-input" v-if="loginType=='code'">





                  <input type="text" name="userName" placeholder="请输入手机号" v-model="phoneNumber" />

<!--                   <input type="text" name="userName" placeholder="请输入手机号" v-model="phoneNumber" />

                  <view class="get-code" :style="{'color':getCodeBtnColor}" @click.stop="getCode()">

                     {{getCodeText}}

                  </view>

                  </view> -->
                  <u-input placeholder="请输入手机号"  :border="false"  v-model="phoneNumber">
                     <template slot="suffix">
                        <view class="get-code" :style="{'color':getCodeBtnColor}" @click.stop="getCode()">
                           {{getCodeText}}
                        </view>
                     </template>
                  </u-input>

               </view>





               <view class="t-a input" v-if="loginType=='code'">

                  <input type="text" name="userName" placeholder="请输入手机验证码" v-model="smsCode" />

               <view class="t-a form-input" v-if="loginType=='code'">

                  <!-- <input type="text" name="userName" placeholder="请输入手机验证码" v-model="smsCode" /> -->
                  <u-input placeholder="请输入手机验证码"    :border="false"   v-model="smsCode"></u-input>
						
               </view>



               <button @tap="login()" class="bottom-button">登 录</button>

@@ -39,7 +51,10 @@
                  <view class="topic-font" v-if="loginType=='pwd'" @click="loginType='code'">手机验证码登录</view>

                  <view class="topic-font" v-if="loginType=='code'" @click="loginType='pwd'">账号密码登录</view>



                  <!-- #ifdef PUB_SUPPLIER -->

                  <view class="topic-font m-l-a m-r-0" @click="toReg">前往注册</view>



                  <!-- #endif -->

               </view>

            </form>

         </view>

@@ -91,7 +106,8 @@
         };

      },

      methods: {

         async getCode() {

         async getCode() {
            console.log('getCode')

            uni.hideKeyboard() //隐藏已经显示的软键盘，如果软键盘没有显示则不做任何操作。

            if (this.getCodeisWaiting) {

               return;

@@ -242,7 +258,24 @@
      }

   };

</script>

<style lang="scss" scoped>

   .form-input {

      background-color: #f8f7fc;

      border-radius: 50rpx;

      margin-bottom: 50rpx;
      border: 1px solid #e9e9e9;

      /deep/ .u-input{
         padding-left: 60rpx !important;
         padding-right: 40rpx !important;
      }

      /deep/ input {

         height: 70rpx;

         line-height: 70rpx;
		
      }


   }

</style>

<style lang="scss" scoped>

   @import './login.scss';



@@ -303,7 +336,7 @@
   }



   .t-login input {

      padding: 0 20rpx 0 120rpx;

      padding: 0 20rpx 0 60rpx;

      height: 90rpx;

      line-height: 90rpx;

      margin-bottom: 50rpx;

@@ -317,9 +350,9 @@
      position: relative;



      .get-code {

         position: absolute;

         right: 40rpx;

         top: 25rpx;

         // position: absolute;

         // right: 40rpx;

         // top: 25rpx;

      }

   }



@@ -404,9 +437,9 @@
      font-size: 27rpx;

   }



   .t-login .uni-input-placeholder {

      color: #000;

   }

   // .t-login .uni-input-placeholder {

   //    color: #000;

   // }



   .cl {

      zoom: 1;