| | |
| | | <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.account" |
| | | 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> |
| | | import { loginPost } from '@/api' |
| | | export default { |
| | | name: 'login', |
| | | |
| | | data() { |
| | | return { |
| | | form: { |
| | | account: '', |
| | | password: '', |
| | | } |
| | | } |
| | | }, |
| | | |
| | | created() { |
| | | }, |
| | | |
| | | methods: { |
| | | dealChange(e) { |
| | | console.log(e) |
| | | }, |
| | | onLogin() { |
| | | const { form } = this |
| | | if (!form.account) return uni.showToast({ |
| | | title: '账号后不能为空', |
| | | icon: 'none' |
| | | }) |
| | | if (!form.password) return uni.showToast({ |
| | | title: '密码不能为空', |
| | | icon: 'none' |
| | | }) |
| | | const appID = 'wx4d7c10bdec51942b' |
| | | const AppSecret = '922c93596d134fedf5bd22a9354b3bfe' |
| | | // const scope = 'snsapi_userinfo' |
| | | let uri = encodeURIComponent('https://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 |
| | | loginPost(form).then(res => { |
| | | console.log('res', res); |
| | | }) |
| | | } |
| | | } |
| | | } |
| | | </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> |