|  |  |  | 
|---|
|  |  |  | <template> | 
|---|
|  |  |  | <view class="login"> | 
|---|
|  |  |  | <image class="login_bg" src="@/static/login_bg@2x.png" /> | 
|---|
|  |  |  | <image class="login_logo" src="@/static/logo@2x.png" mode="widthFix" /> | 
|---|
|  |  |  | <view class="login_title">安泰物流智慧园区</view> | 
|---|
|  |  |  | <view class="login_list"> | 
|---|
|  |  |  | <view class="login_list_item"> | 
|---|
|  |  |  | <image src="@/static/login_ic_phone@2x.png" mode="widthFix" /> | 
|---|
|  |  |  | <input | 
|---|
|  |  |  | v-model="form.idCard" | 
|---|
|  |  |  | maxlength="18" | 
|---|
|  |  |  | type="number" | 
|---|
|  |  |  | placeholder="账号" | 
|---|
|  |  |  | /> | 
|---|
|  |  |  | </view> | 
|---|
|  |  |  | <view class="login_list_item"> | 
|---|
|  |  |  | <image src="@/static/login_ic_password@2x.png" mode="widthFix" /> | 
|---|
|  |  |  | <input v-model="form.password" type="password" placeholder="密码" /> | 
|---|
|  |  |  | </view> | 
|---|
|  |  |  | </view> | 
|---|
|  |  |  | <view class="login_btn"> | 
|---|
|  |  |  | <view class="login_btn_n" @click="onLogin">立即登录</view> | 
|---|
|  |  |  | <view class="for_psd">忘记密码</view> | 
|---|
|  |  |  | </view> | 
|---|
|  |  |  |  | 
|---|
|  |  |  | <view class="deal_wrap"> | 
|---|
|  |  |  | <checkbox @change="dealChange" /> | 
|---|
|  |  |  | <text>登录即同意</text> | 
|---|
|  |  |  | <text class="deal">《安泰物流用户协议》</text> | 
|---|
|  |  |  | </view> | 
|---|
|  |  |  | </view> | 
|---|
|  |  |  | </template> | 
|---|
|  |  |  |  | 
|---|
|  |  |  | <script> | 
|---|
|  |  |  | export default { | 
|---|
|  |  |  | name: 'login', | 
|---|
|  |  |  |  | 
|---|
|  |  |  | data() { | 
|---|
|  |  |  | return { | 
|---|
|  |  |  | form: { | 
|---|
|  |  |  | idCard: '', | 
|---|
|  |  |  | password: '' | 
|---|
|  |  |  | } | 
|---|
|  |  |  | } | 
|---|
|  |  |  | }, | 
|---|
|  |  |  |  | 
|---|
|  |  |  | created() { | 
|---|
|  |  |  | }, | 
|---|
|  |  |  |  | 
|---|
|  |  |  | methods: { | 
|---|
|  |  |  | dealChange(e) { | 
|---|
|  |  |  | console.log(e) | 
|---|
|  |  |  | }, | 
|---|
|  |  |  | onLogin() { | 
|---|
|  |  |  | const appID = 'wx4d7c10bdec51942b' | 
|---|
|  |  |  | const AppSecret = '922c93596d134fedf5bd22a9354b3bfe' | 
|---|
|  |  |  | // const scope = 'snsapi_userinfo' | 
|---|
|  |  |  | let uri = encodeURIComponent('http://xiaopiqiu2.natapp1.cc') | 
|---|
|  |  |  | let authURL = | 
|---|
|  |  |  | `https://open.weixin.qq.com/connect/oauth2/authorize?appid=${appID}&redirect_uri=${uri}&response_type=code&scope=snsapi_userinfo&state=123#wechat_redirect` | 
|---|
|  |  |  | window.location.href = authURL | 
|---|
|  |  |  |  | 
|---|
|  |  |  | } | 
|---|
|  |  |  | } | 
|---|
|  |  |  | } | 
|---|
|  |  |  | </script> | 
|---|
|  |  |  |  | 
|---|
|  |  |  | <style lang="scss" scoped> | 
|---|
|  |  |  | .login { | 
|---|
|  |  |  | width: 100%; | 
|---|
|  |  |  | height: 100vh; | 
|---|
|  |  |  | display: flex; | 
|---|
|  |  |  | padding-top: 160rpx; | 
|---|
|  |  |  | box-sizing: border-box; | 
|---|
|  |  |  | align-items: center; | 
|---|
|  |  |  | flex-direction: column; | 
|---|
|  |  |  | background: linear-gradient( | 
|---|
|  |  |  | 180deg, | 
|---|
|  |  |  | rgba(39, 155, 170, 0.2) 0%, | 
|---|
|  |  |  | rgba(39, 155, 170, 0) 100% | 
|---|
|  |  |  | ); | 
|---|
|  |  |  | .login_logo { | 
|---|
|  |  |  | width: 180rpx; | 
|---|
|  |  |  | height: 180rpx; | 
|---|
|  |  |  | } | 
|---|
|  |  |  | .login_bg { | 
|---|
|  |  |  | position: absolute; | 
|---|
|  |  |  | top: 0; | 
|---|
|  |  |  | width: 750rpx; | 
|---|
|  |  |  | } | 
|---|
|  |  |  | .login_title { | 
|---|
|  |  |  | font-size: 44rpx; | 
|---|
|  |  |  | font-weight: 600; | 
|---|
|  |  |  | color: #333333; | 
|---|
|  |  |  | margin-top: 40rpx; | 
|---|
|  |  |  | margin-bottom: 120rpx; | 
|---|
|  |  |  | } | 
|---|
|  |  |  | .login_list { | 
|---|
|  |  |  | width: 100%; | 
|---|
|  |  |  | padding: 0 60rpx; | 
|---|
|  |  |  | box-sizing: border-box; | 
|---|
|  |  |  | .login_list_item { | 
|---|
|  |  |  | width: 100%; | 
|---|
|  |  |  | border-radius: 50rpx; | 
|---|
|  |  |  | height: 98rpx; | 
|---|
|  |  |  | padding: 0 40rpx; | 
|---|
|  |  |  | box-sizing: border-box; | 
|---|
|  |  |  | background: #ffffff; | 
|---|
|  |  |  | margin-bottom: 40rpx; | 
|---|
|  |  |  | display: flex; | 
|---|
|  |  |  | align-items: center; | 
|---|
|  |  |  | justify-content: space-between; | 
|---|
|  |  |  | &:last-child { | 
|---|
|  |  |  | margin-bottom: 0 !important; | 
|---|
|  |  |  | } | 
|---|
|  |  |  | image { | 
|---|
|  |  |  | flex-shrink: 0; | 
|---|
|  |  |  | width: 40rpx; | 
|---|
|  |  |  | height: 40rpx; | 
|---|
|  |  |  | } | 
|---|
|  |  |  | input { | 
|---|
|  |  |  | flex: 1; | 
|---|
|  |  |  | height: 100%; | 
|---|
|  |  |  | color: #666666; | 
|---|
|  |  |  | margin-left: 24rpx; | 
|---|
|  |  |  | border: none; | 
|---|
|  |  |  | } | 
|---|
|  |  |  | } | 
|---|
|  |  |  | } | 
|---|
|  |  |  | .login_btn { | 
|---|
|  |  |  | width: 100%; | 
|---|
|  |  |  | padding: 0 60rpx; | 
|---|
|  |  |  | box-sizing: border-box; | 
|---|
|  |  |  | margin-top: 80rpx; | 
|---|
|  |  |  | .for_psd { | 
|---|
|  |  |  | color: #279baa; | 
|---|
|  |  |  | margin-top: 40rpx; | 
|---|
|  |  |  | width: 140rpx; | 
|---|
|  |  |  | text-align: center; | 
|---|
|  |  |  | margin: 40rpx auto; | 
|---|
|  |  |  | } | 
|---|
|  |  |  | .login_btn_n { | 
|---|
|  |  |  | width: 100%; | 
|---|
|  |  |  | height: 98rpx; | 
|---|
|  |  |  | background: #279baa; | 
|---|
|  |  |  | box-shadow: 0rpx 12rpx 24rpx 0rpx rgba(39, 155, 170, 0.2); | 
|---|
|  |  |  | display: flex; | 
|---|
|  |  |  | align-items: center; | 
|---|
|  |  |  | justify-content: center; | 
|---|
|  |  |  | font-weight: 500; | 
|---|
|  |  |  | font-size: 32rpx; | 
|---|
|  |  |  | color: #ffffff; | 
|---|
|  |  |  | border-radius: 50rpx; | 
|---|
|  |  |  | } | 
|---|
|  |  |  | } | 
|---|
|  |  |  | .deal_wrap { | 
|---|
|  |  |  | position: absolute; | 
|---|
|  |  |  | width: 100%; | 
|---|
|  |  |  | left: 0; | 
|---|
|  |  |  | text-align: center; | 
|---|
|  |  |  | bottom: 108rpx; | 
|---|
|  |  |  | .deal { | 
|---|
|  |  |  | color: #279baa; | 
|---|
|  |  |  | } | 
|---|
|  |  |  | } | 
|---|
|  |  |  | } | 
|---|
|  |  |  | </style> | 
|---|
|  |  |  | <template> | 
|---|
|  |  |  | <view class="main_app"> | 
|---|
|  |  |  | <image class="login_bg" src="@/static/staff/shenfen_bg@2x.png" mode="widthFix" /> | 
|---|
|  |  |  | <view class="h1">安泰物流智慧园区</view> | 
|---|
|  |  |  | <view class="placeholder6 place">请选择您的身份</view> | 
|---|
|  |  |  | <view class="item" @click="userAuth(1)"> | 
|---|
|  |  |  | <image class="avatar" src="@/static/ic_visitor@2x.png" /> | 
|---|
|  |  |  | <view class="content"> | 
|---|
|  |  |  | <view class="name">我是访客</view> | 
|---|
|  |  |  | <view class="placeholder6">VISITOR</view> | 
|---|
|  |  |  | </view> | 
|---|
|  |  |  | <u-icon name="arrow-right" size="24" color="#979797" /> | 
|---|
|  |  |  | </view> | 
|---|
|  |  |  | <view class="item" @click="userAuth(2)"> | 
|---|
|  |  |  | <image class="avatar" src="@/static/ic_staff@2x.png" /> | 
|---|
|  |  |  | <view class="content"> | 
|---|
|  |  |  | <view class="name">我是员工</view> | 
|---|
|  |  |  | <view class="placeholder6">STAFF</view> | 
|---|
|  |  |  | </view> | 
|---|
|  |  |  | <u-icon name="arrow-right" size="24" color="#979797" /> | 
|---|
|  |  |  | </view> | 
|---|
|  |  |  | <view class="item" @click="userAuth(0)"> | 
|---|
|  |  |  | <image class="avatar" src="@/static/ic_driver@2x.png" /> | 
|---|
|  |  |  | <view class="content"> | 
|---|
|  |  |  | <view class="name">我是物流车司机</view> | 
|---|
|  |  |  | <view class="placeholder6">DRIVER</view> | 
|---|
|  |  |  | </view> | 
|---|
|  |  |  | <u-icon name="arrow-right" size="24" color="#979797" /> | 
|---|
|  |  |  | </view> | 
|---|
|  |  |  | </view> | 
|---|
|  |  |  | </template> | 
|---|
|  |  |  |  | 
|---|
|  |  |  | <script> | 
|---|
|  |  |  | import { | 
|---|
|  |  |  | wxAuthorizea, | 
|---|
|  |  |  | getUserInfo | 
|---|
|  |  |  | } from '@/api' | 
|---|
|  |  |  | import { | 
|---|
|  |  |  | baseUrl | 
|---|
|  |  |  | } from "@/utils/config.js" | 
|---|
|  |  |  | export default { | 
|---|
|  |  |  | data() { | 
|---|
|  |  |  | return { | 
|---|
|  |  |  | code: '' | 
|---|
|  |  |  | } | 
|---|
|  |  |  | }, | 
|---|
|  |  |  | onLoad(option) { | 
|---|
|  |  |  | console.log('onLoad'); | 
|---|
|  |  |  | if (option.ywid) { | 
|---|
|  |  |  | uni.setStorageSync('ywinfo', { | 
|---|
|  |  |  | type: option.type, | 
|---|
|  |  |  | yw: option.yw, | 
|---|
|  |  |  | ywid: option.ywid | 
|---|
|  |  |  | }) | 
|---|
|  |  |  | } | 
|---|
|  |  |  | // https://atwl.ahzyssl.com/zhyq_h5/#/pages/login/login?type=2&yw=5&ywid=b3db2072-a453-470d-8c0d-ba3b8b256530 | 
|---|
|  |  |  | }, | 
|---|
|  |  |  | onShow() { | 
|---|
|  |  |  | // var that = this | 
|---|
|  |  |  | // let url = 'https://atwl.ahzyssl.com/zhyq_h5/#/' | 
|---|
|  |  |  | // let code = '' | 
|---|
|  |  |  | // if (window.location.href.indexOf('code=') !== -1 || this.code) { | 
|---|
|  |  |  | //    // if(window.location.href.indexOf('wdata') !== -1){ | 
|---|
|  |  |  | //    //    uni.redirectTo({ | 
|---|
|  |  |  | //    //       url: '/pages/wdata/home?code=' + | 
|---|
|  |  |  | //    //    }) | 
|---|
|  |  |  | //    // } | 
|---|
|  |  |  | //    const ywinfo = uni.getStorageSync('ywinfo') || {} | 
|---|
|  |  |  | //    if (ywinfo.ywid && (ywinfo.type || ywinfo.type == 0)) { | 
|---|
|  |  |  | //       this.userAuth(ywinfo.type) | 
|---|
|  |  |  | //    } | 
|---|
|  |  |  | // } else { | 
|---|
|  |  |  | //    // let url = window.location.href | 
|---|
|  |  |  | //    const appID = 'wx173e6caf5abc718a' | 
|---|
|  |  |  | //    let uri = encodeURIComponent(url) | 
|---|
|  |  |  | //    let authURL = | 
|---|
|  |  |  | //       `https://open.weixin.qq.com/connect/oauth2/authorize?appid=${appID}&redirect_uri=${uri}&response_type=code&scope=snsapi_base#wechat_redirect` | 
|---|
|  |  |  | //    window.location.href = authURL | 
|---|
|  |  |  | // } | 
|---|
|  |  |  |  | 
|---|
|  |  |  | }, | 
|---|
|  |  |  | methods: { | 
|---|
|  |  |  | jump(url) { | 
|---|
|  |  |  | console.log(url) | 
|---|
|  |  |  | uni.navigateTo({ | 
|---|
|  |  |  | url | 
|---|
|  |  |  | }) | 
|---|
|  |  |  | }, | 
|---|
|  |  |  | driverLogin(flag) { | 
|---|
|  |  |  | // const driverInfo = uni.getStorageSync('driverInfo') || {} | 
|---|
|  |  |  | if (flag) { | 
|---|
|  |  |  | uni.navigateTo({ | 
|---|
|  |  |  | url: '/pages/driver/index' | 
|---|
|  |  |  | }) | 
|---|
|  |  |  | } else { | 
|---|
|  |  |  | uni.navigateTo({ | 
|---|
|  |  |  | url: '/pages/driver/login' | 
|---|
|  |  |  | }) | 
|---|
|  |  |  | } | 
|---|
|  |  |  | }, | 
|---|
|  |  |  | staffLogin(flag) { | 
|---|
|  |  |  | // const userInfo = uni.getStorageSync('userInfo') || {} | 
|---|
|  |  |  | if (flag) { | 
|---|
|  |  |  | uni.navigateTo({ | 
|---|
|  |  |  | url: '/pages/staff/index' | 
|---|
|  |  |  | }) | 
|---|
|  |  |  | } else { | 
|---|
|  |  |  | uni.navigateTo({ | 
|---|
|  |  |  | url: '/pages/staffLogin/login' | 
|---|
|  |  |  | }) | 
|---|
|  |  |  | } | 
|---|
|  |  |  | }, | 
|---|
|  |  |  | // source   来源:0=司机;1=访客;2=内部员工 | 
|---|
|  |  |  | userAuth(source) { | 
|---|
|  |  |  | var that = this | 
|---|
|  |  |  | let url = window.location.href | 
|---|
|  |  |  | let code = '' | 
|---|
|  |  |  | if (url.indexOf('code=') !== -1 || this.code) { | 
|---|
|  |  |  | const query = url.split('?') | 
|---|
|  |  |  | for (const q of query) { | 
|---|
|  |  |  | if (q.indexOf('code=') !== -1) { | 
|---|
|  |  |  | let statusIndex = q.indexOf('&state') | 
|---|
|  |  |  | code = q.substring(q.indexOf('code=') + 5, statusIndex) | 
|---|
|  |  |  | } | 
|---|
|  |  |  | } | 
|---|
|  |  |  | wxAuthorizea({ | 
|---|
|  |  |  | code: code || this.code, | 
|---|
|  |  |  | source: source | 
|---|
|  |  |  | }).then(res => { | 
|---|
|  |  |  | if (res.code === 200) { | 
|---|
|  |  |  | that.$store.commit('setOpenId', res.data.openid) | 
|---|
|  |  |  | if (res.data.member) { | 
|---|
|  |  |  | that.$store.commit('setMember', res.data.member) | 
|---|
|  |  |  | } | 
|---|
|  |  |  | let flag = res.data.member && res.data.member.id | 
|---|
|  |  |  | if (source == 0) { | 
|---|
|  |  |  | if (res.data.token) { | 
|---|
|  |  |  | that.$store.commit('setToken', res.data.token) | 
|---|
|  |  |  | getUserInfo().then(ress => { | 
|---|
|  |  |  | that.$store.commit('setDriverInfo', ress.data) | 
|---|
|  |  |  | }) | 
|---|
|  |  |  | } | 
|---|
|  |  |  | setTimeout(() => { | 
|---|
|  |  |  | that.driverLogin(flag) | 
|---|
|  |  |  | }, 200) | 
|---|
|  |  |  | } else if (source == 2) { | 
|---|
|  |  |  | if (res.data.token) { | 
|---|
|  |  |  | that.$store.commit('setToken', res.data.token) | 
|---|
|  |  |  | getUserInfo().then(ress => { | 
|---|
|  |  |  | that.$store.commit('setUserInfo', ress.data) | 
|---|
|  |  |  | }) | 
|---|
|  |  |  | } | 
|---|
|  |  |  | setTimeout(() => { | 
|---|
|  |  |  | that.staffLogin(flag) | 
|---|
|  |  |  | }, 200) | 
|---|
|  |  |  | } else { | 
|---|
|  |  |  | this.jump('/pages/index/index') | 
|---|
|  |  |  | } | 
|---|
|  |  |  | } | 
|---|
|  |  |  | }) | 
|---|
|  |  |  | } | 
|---|
|  |  |  | } | 
|---|
|  |  |  | } | 
|---|
|  |  |  | } | 
|---|
|  |  |  | </script> | 
|---|
|  |  |  |  | 
|---|
|  |  |  | <style lang="scss"> | 
|---|
|  |  |  | .main_app { | 
|---|
|  |  |  | width: 100vw; | 
|---|
|  |  |  | box-sizing: border-box; | 
|---|
|  |  |  | overflow: hidden; | 
|---|
|  |  |  | margin: 0; | 
|---|
|  |  |  | height: 100vh; | 
|---|
|  |  |  | padding-top: 80rpx; | 
|---|
|  |  |  | background: linear-gradient(180deg, | 
|---|
|  |  |  | rgba(39, 155, 170, 0.2) 0%, | 
|---|
|  |  |  | rgba(39, 155, 170, 0) 100%); | 
|---|
|  |  |  |  | 
|---|
|  |  |  | .login_bg { | 
|---|
|  |  |  | position: absolute; | 
|---|
|  |  |  | top: 0; | 
|---|
|  |  |  | left: 0; | 
|---|
|  |  |  | width: 100%; | 
|---|
|  |  |  | z-index: -1; | 
|---|
|  |  |  | } | 
|---|
|  |  |  |  | 
|---|
|  |  |  | .h1 { | 
|---|
|  |  |  | font-weight: 600; | 
|---|
|  |  |  | font-size: 48rpx; | 
|---|
|  |  |  | color: #222222; | 
|---|
|  |  |  | line-height: 66rpx; | 
|---|
|  |  |  | margin-bottom: 16rpx; | 
|---|
|  |  |  | } | 
|---|
|  |  |  |  | 
|---|
|  |  |  | .place { | 
|---|
|  |  |  | margin-bottom: 98rpx; | 
|---|
|  |  |  | } | 
|---|
|  |  |  |  | 
|---|
|  |  |  | .item { | 
|---|
|  |  |  | width: 690rpx; | 
|---|
|  |  |  | height: 200rpx; | 
|---|
|  |  |  | background: #ffffff; | 
|---|
|  |  |  | border-radius: 8rpx; | 
|---|
|  |  |  | display: flex; | 
|---|
|  |  |  | align-items: center; | 
|---|
|  |  |  | padding: 40rpx; | 
|---|
|  |  |  | font-size: 26rpx; | 
|---|
|  |  |  | margin-bottom: 40rpx; | 
|---|
|  |  |  |  | 
|---|
|  |  |  | .avatar { | 
|---|
|  |  |  | width: 120rpx; | 
|---|
|  |  |  | height: 120rpx; | 
|---|
|  |  |  | margin-right: 30rpx; | 
|---|
|  |  |  | } | 
|---|
|  |  |  |  | 
|---|
|  |  |  | .content { | 
|---|
|  |  |  | flex: 1; | 
|---|
|  |  |  |  | 
|---|
|  |  |  | .name { | 
|---|
|  |  |  | font-weight: 600; | 
|---|
|  |  |  | font-size: 38rpx; | 
|---|
|  |  |  | color: #222222; | 
|---|
|  |  |  | margin-bottom: 20rpx; | 
|---|
|  |  |  | } | 
|---|
|  |  |  | } | 
|---|
|  |  |  | } | 
|---|
|  |  |  | } | 
|---|
|  |  |  | </style> | 
|---|