Merge remote-tracking branch 'origin/master'

jiangping

2025-01-07 41d11d9db46ccd44163860f6be6bfd2137aff369

 h5/pages/staffLogin/login.vue

@@ -3,16 +3,43 @@
    <image class="login_bg" src="@/static/login_bg@2x.png" mode="widthFix" />
    <image class="login_logo" src="@/static/logo@2x.png" mode="widthFix" />
    <view class="login_title">安泰物流智慧园区</view>
      <view class="tabs">

         <view class="tab" @click="tabsClick(0)" :class="{active: activeTab == 0  }">

            <view>账号登录</view>

            <view class="bor"></view>

         </view>

         <view class="tab" @click="tabsClick(1)" :class="{active: activeTab == 1  }">

            <view>验证码登录</view>

            <view class="bor"></view>

         </view>

      </view>

    <view class="login_list">
         <template v-if="activeTab == 0">

      <view class="login_list_item">
        <image src="@/static/login_ic_phone@2x.png" mode="widthFix" />
        <input v-model="form.username" type="number" maxlength="18" @focus="showKeyboard = true" @blur="showKeyboard = false" placeholder="账号" />
               <input v-model="form.username" type="number" maxlength="18" @focus="showKeyboard = true"

                  @blur="showKeyboard = false" placeholder="账号" />

      </view>
      <view class="login_list_item">
        <image src="@/static/login_ic_password@2x.png" mode="widthFix" />
        <input v-model="form.password" @focus="showKeyboard = true" @blur="showKeyboard = false" type="password" placeholder="密码" />
               <input v-model="form.password" @focus="showKeyboard = true" @blur="showKeyboard = false" type="password"

                  placeholder="密码" />

            </view>

         </template>

         <template v-else>

            <view class="login_list_item">

               <image src="@/static/login_ic_phone@2x.png" mode="widthFix" />

               <input v-model="form.phone" type="tel" @focus="showKeyboard = true" @blur="showKeyboard = false"

                  :maxlength="18" placeholder="手机号" />

      </view>
      <view class="login_list_item">
               <image src="@/static/ic_captcha.png" mode="widthFix"></image>

               <input v-model="form.code" placeholder="请输入验证码" :maxlength="6" type="number" />

               <text class="captcha" v-if="countDown == 0" @click="initCaptcha">获取验证码</text>

               <text class="placeholder9" v-else>{{ countDown }}</text>

            </view>

         </template>

         <!-- <view class="login_list_item">

        <image src="@/static/ic_captcha.png" mode="widthFix"></image>
        <input v-model="form.code" @focus="showKeyboard = true" @blur="showKeyboard = false" placeholder="验证码" type="text" />
        <image
@@ -21,42 +48,23 @@
          class="captcha"
          mode="widthFix"
        />
      </view>
      </view> -->

    </view>
    <view class="login_btn">
      <view class="login_btn_n" @click="onLogin">立即登录</view>
      <view @click="$jump('/pages/staffLogin/forgetPsd')" class="for_psd"
        >忘记密码</view
      >
         <view @click="$jump('/pages/staffLogin/forgetPsd')" class="for_psd">忘记密码</view>

    </view>

    <view class="deal_wrap">
      <image
        @click="changeFalg"
        v-if="ProtocolFlag"
        src="@/static/checkbox_sel@2x.png"
        mode="widthFix"
        class="checked"
      ></image>
      <image
        @click="changeFalg"
        v-if="!ProtocolFlag"
        src="@/static/meeting/icon/ic_choose@2x.png"
        mode="widthFix"
        class="checked"
				
      ></image>
         <image @click="changeFalg" v-if="ProtocolFlag" src="@/static/checkbox_sel@2x.png" mode="widthFix" class="checked">

         </image>

         <image @click="changeFalg" v-if="!ProtocolFlag" src="@/static/meeting/icon/ic_choose@2x.png" mode="widthFix"

            class="checked"></image>

      <text>登录即同意</text>
      <text class="deal" @click="showContent">《安泰物流用户协议》</text>
    </view>
    <!--  -->
    <u-popup
      :show="isShowProtocol"
      @close="isShowProtocol = false"
         closeable
      :round="8"
      mode="center"
    >
      <u-popup :show="isShowProtocol" @close="isShowProtocol = false" closeable :round="8" mode="center">

      <view class="modal">
        <!-- <view v-html="htmlText"></view> -->
            <view class="content">
@@ -68,18 +76,29 @@
</template>

<script>
import { loginPost, loginCaptcha, getUserInfo, getSystemDictData, saveHkUserOpenid } from '@/api'
import { mapState, mapMutations } from 'vuex'
   import {

      loginPost,

      loginH5ByPhone,

      getUserInfo,

      getSystemDictData,

      saveHkUserOpenid,
      sendSms

   } from '@/api'

   import {

      mapState,

      mapMutations

   } from 'vuex'

export default {
  name: 'login',

  data() {
    return {
      form: {
        // username: '18056814089',
        username: '',
        password: '',
            code: ''
               // username: '18655749830',

               username: null,
               phone: null,

               password: null,

               code: null

      },
         showKeyboard: false,
      isShowProtocol: false,
@@ -88,12 +107,14 @@
      htmlText: '',
         windowHeight: '',
         
            countDown: 0,

            activeTab: 0,



         ywinfo: {}
    }
  },

  onLoad() {
    this.initCaptcha()
      const result = uni.getWindowInfo()
      this.windowHeight = result.windowHeight
      
@@ -110,34 +131,17 @@
    return true
  },
  methods: {
    ...mapMutations(["setToken", "setUserInfo"]),
    changeFalg() {
      this.ProtocolFlag = !this.ProtocolFlag
    },
    getContent() {
      getSystemDictData({
        dictCode: 'SYSTEM',
        label: 'USER_PROTOCOL'
      }).then(res => {
        this.htmlText = res.data.code
        this.isShowProtocol = true
      })
    },
    showContent() {
      this.getContent()
    },
    initCaptcha() {
      loginCaptcha().then(res => {
        this.captcha = res.data
      })
    },

    onLogin() {
      const { form, ProtocolFlag } = this
            const {

               form,

               ProtocolFlag,

               activeTab

            } = this

      if (!ProtocolFlag) return uni.showToast({
        title: '请先阅读并同意用户协议',
        icon: 'none'
      })
            if (activeTab == 0) {

      if (!form.username) return uni.showToast({
        title: '账号不能为空',
        icon: 'none'
@@ -146,13 +150,19 @@
        title: '密码不能为空',
        icon: 'none'
      })
            } else {

               if (!form.phone) return uni.showToast({

                  title: '手机号不能为空',

                  icon: 'none'

               })

      if (!form.code) return uni.showToast({
        title: '验证码不能为空',
        icon: 'none'
      })
      loginPost({
            }
            let fn = activeTab == 0 ? loginPost : loginH5ByPhone

            fn({

        ...form,
        uuid: this.captcha.uuid,
        openid: this.$store.state.openId
      }).then(res => {
        if (res.code === 200) {
@@ -169,6 +179,49 @@
               this.initCaptcha()
            }
      })
         },

         ...mapMutations(["setToken", "setUserInfo"]),

         tabsClick(val) {

            this.activeTab = val

            if (val == 0) {

               this.form.username = this.form.username || this.form.phone

               this.form.phone = null

               this.form.code = null

            } else {

               this.form.phone = this.form.username || this.form.phone

               this.form.password = null

               this.form.username = null

            }

         },

         changeFalg() {

            this.ProtocolFlag = !this.ProtocolFlag

         },

         getContent() {

            getSystemDictData({

               dictCode: 'SYSTEM',

               label: 'USER_PROTOCOL'

            }).then(res => {

               this.htmlText = res.data.code

               this.isShowProtocol = true

            })

         },

         showContent() {

            this.getContent()

         },

         initCaptcha() {

            if (!this.form.phone) return uni.showToast({

               title: '手机号不能为空',

               icon: 'none'

            })

            sendSms({

               phone: this.form.phone

            }).then(res => {

               this.countDown = 60

               setInterval(() => {

                  if (this.countDown == 0) return

                  this.countDown--

               }, 1000)

            })

    }
  }
}
@@ -183,15 +236,15 @@
  align-items: center;
  flex-direction: column;
   position: relative;
  background: linear-gradient(
    180deg,
      background: linear-gradient(180deg,

    rgba(39, 155, 170, 0.2) 0%,
    rgba(39, 155, 170, 0) 100%
  );
            rgba(39, 155, 170, 0) 100%);



  .login_logo {
    width: 180rpx;
    height: 180rpx;
  }


  .login_bg {
     position: absolute;
     top: 0;
@@ -199,17 +252,49 @@
     width: 100%;
     z-index: -1;
  }


  .login_title {
    font-size: 44rpx;
    font-weight: 600;
    color: #333333;
    margin-top: 40rpx;
    margin-bottom: 80rpx;
  }


      .tabs {

         display: flex;

         align-items: center;

         justify-content: space-evenly;

         width: 530rpx;

         margin: 60rpx auto 42rpx;



         .tab {

            font-size: 30rpx;

            color: #666666;

            display: flex;

            flex-direction: column;

            align-items: center;

            height: 52rpx;

            line-height: 36rpx;

         }



         .active {

            font-weight: bold;

            font-size: 34rpx;

            color: #222222;



            .bor {

               width: 80rpx;

               height: 8rpx;

               background: linear-gradient(to bottom, #4d99a8, #a3c8d4);

            }

         }

      }



  .login_list {
    width: 100%;
    padding: 0 60rpx;
    box-sizing: border-box;


    .login_list_item {
      width: 100%;
      border-radius: 50rpx;
@@ -221,17 +306,26 @@
      display: flex;
      align-items: center;
      justify-content: space-between;


      &:last-child {
        margin-bottom: 0 !important;
      }


            .captcha {

               color: $uni-color-primary;

               font-size: 30rpx;

            }



      image {
        flex-shrink: 0;
        width: 40rpx;
        height: 40rpx;
      }


      .captcha {
        width: 200rpx;
      }


      input {
        flex: 1;
        height: 100%;
@@ -241,17 +335,20 @@
      }
    }
  }


  .login_btn {
    width: 100%;
    padding: 0 60rpx;
    box-sizing: border-box;
    margin-top: 60rpx;


    .for_psd {
      color: $uni-color-primary;
      width: 140rpx;
      text-align: center;
      margin: 40rpx auto;
    }


    .login_btn_n {
      width: 100%;
      height: 98rpx;
@@ -266,6 +363,7 @@
      border-radius: 50rpx;
    }
  }


  .deal_wrap {
    position: absolute;
    width: 100%;
@@ -275,19 +373,23 @@
    display: flex;
    justify-content: center;
    align-items: center;


    .deal {
      color: $uni-color-primary;
    }


    .checked {
      width: 48rpx;
      margin-right: 12rpx;
    }
  }


   .rela_wrap{
      position: relative;
      margin-top: 360rpx;
   }
}


.modal {
  width: 690rpx;
  max-height: 80vh;