321 lines
7.2 KiB
Vue
321 lines
7.2 KiB
Vue
<template>
|
||
<view :class="{'gray':store.isgray==1}">
|
||
<view class="logo f-col aic">
|
||
<image src="@/static/login/logo.png"></image>
|
||
</view>
|
||
<view class="form f-col aic">
|
||
<view class="box f-row aic">
|
||
<image src="@/static/login/phone.png"></image>
|
||
<input v-model="username" type="text" placeholder="请输入统一身份认证"
|
||
placeholder-style="font-size: 28rpx;color: #999999;" />
|
||
</view>
|
||
<view class="box f-row aic">
|
||
<image src="@/static/login/pwd.png"></image>
|
||
<input v-model="password" :type="!showpwd?'password':'text'" placeholder="请输入密码"
|
||
placeholder-style="font-size: 28rpx;color: #999999;" />
|
||
<image v-if="showpwd" src="@/static/login/eye.png" @click="showpwd = !showpwd"></image>
|
||
<image v-else src="@/static/login/eye-off.png" @click="showpwd = !showpwd"></image>
|
||
</view>
|
||
</view>
|
||
<view class="pwd f-row aic">
|
||
<view style="display: inline-block;" @click="check = !check">
|
||
<view class="f-row aic">
|
||
<image v-if="!check" src="@/static/login/nocheck.png"></image>
|
||
<image v-else src="@/static/login/checked.png"></image>
|
||
<text>记住密码</text>
|
||
</view>
|
||
</view>
|
||
</view>
|
||
<view class="login f-col aic">
|
||
<view @click="login">
|
||
登录
|
||
</view>
|
||
</view>
|
||
<view class="login f-col aic">
|
||
|
||
<text style="font-size: 10px;">Copyright (c) 2024 天然气产销厂 信息化支持中心</text>
|
||
<text style="font-size: 10px;">版本号：1.0.3</text>
|
||
</view>
|
||
|
||
</view>
|
||
</template>
|
||
|
||
<script setup>
|
||
import {
|
||
ref,
|
||
getCurrentInstance,
|
||
watch
|
||
} from 'vue';
|
||
import {
|
||
loginApi,
|
||
localLoginApi,
|
||
queryRoleApi
|
||
} from '@/api/login.js';
|
||
import {
|
||
taskListApi
|
||
} from '@/api/api.js';
|
||
import Base64 from 'base-64';
|
||
import {
|
||
onLoad
|
||
} from '@dcloudio/uni-app'
|
||
import {
|
||
useStore
|
||
} from '@/store'
|
||
const store = useStore()
|
||
const {
|
||
proxy
|
||
} = getCurrentInstance()
|
||
|
||
/**是否明文显示密码*/
|
||
const showpwd = ref(false)
|
||
/**用于用户缓存账号和密码*/
|
||
let localObj = {}
|
||
/**记住账号和密码*/
|
||
const savePwd = () => {
|
||
let localObj = {
|
||
un: username.value
|
||
}
|
||
if (check.value) {
|
||
localObj.pw = password.value
|
||
}
|
||
uni.setStorageSync('accountObj', JSON.stringify(localObj))
|
||
}
|
||
|
||
/**是否选中记住密码*/
|
||
const check = ref(true);
|
||
/**账号*/
|
||
const username = ref('')
|
||
/**密码*/
|
||
const password = ref('')
|
||
const login = () => {
|
||
if (!username.value.trim()) return proxy.$toast('请输入账号')
|
||
if (!password.value.trim()) return proxy.$toast('请输入密码')
|
||
let un = Base64.encode(encodeURIComponent(username.value))
|
||
let pw = Base64.encode(encodeURIComponent(password.value))
|
||
uni.showLoading({
|
||
title: '登录中...'
|
||
});
|
||
|
||
/*生产环境 begin */
|
||
// loginApi({
|
||
// username: un,
|
||
// password: pw,
|
||
// ip: getDeviceIp()
|
||
/*生产环境 end */
|
||
|
||
/*开发环境 begin */
|
||
localLoginApi({
|
||
username: username.value,
|
||
password: password.value,
|
||
captcha: 'app'
|
||
/*开发环境 end */
|
||
}).then((loginres) => {
|
||
// console.log("===============",loginres)
|
||
if (loginres.success) {
|
||
uni.setStorageSync('token', loginres.result.token)
|
||
store.setToken(loginres.result.token)
|
||
savePwd()
|
||
queryRoleApi({
|
||
roles: loginres.result.userInfo.roles
|
||
}).then((roleres) => {
|
||
//登录时间
|
||
uni.setStorageSync('logintime', Date.now())
|
||
// 登录人的角色
|
||
uni.setStorageSync('role', roleres)
|
||
store.setRole(roleres)
|
||
|
||
// 登录人信息
|
||
uni.setStorageSync('user', JSON.stringify(loginres.result
|
||
.userInfo))
|
||
store.setUserInfo(loginres.result.userInfo)
|
||
//获取任务列表角标
|
||
loadBadge()
|
||
|
||
// 跳转首页
|
||
uni.switchTab({
|
||
url: '/pages/tab/index'
|
||
})
|
||
})
|
||
|
||
}
|
||
}).catch((err) => {
|
||
console.log(err);
|
||
})
|
||
}
|
||
|
||
let localAccountArr = []
|
||
const accountArr = ref([])
|
||
onLoad(() => {
|
||
if (uni.getStorageSync('accountObj')) {
|
||
let obj = JSON.parse(uni.getStorageSync('accountObj'))
|
||
username.value = obj.un ? obj.un : ''
|
||
password.value = obj.pw ? obj.pw : ''
|
||
}
|
||
// localAccountArr = uni.getStorageSync('accountArr') ? JSON.parse(uni.getStorageSync('accountArr')) : []
|
||
// accountArr.value = localAccountArr
|
||
})
|
||
|
||
const loadBadge = () => {
|
||
taskListApi().then((res) => {
|
||
if (res.success) {
|
||
if (res.result.total > 0) {
|
||
uni.setTabBarBadge({
|
||
index: '1',
|
||
text: res.result.total // 角标内容
|
||
});
|
||
} else {
|
||
uni.removeTabBarBadge({ // 移除角标
|
||
index: '1',
|
||
});
|
||
}
|
||
|
||
}
|
||
})
|
||
}
|
||
|
||
|
||
function getDeviceIp() {
|
||
// #ifdef APP-PLUS
|
||
|
||
let deviceIp
|
||
if (plus.os.name == "Android") {
|
||
let Context = plus.android.importClass('android.content.Context')
|
||
let main = plus.android.runtimeMainActivity()
|
||
let cm = main.getSystemService(Context.CONNECTIVITY_SERVICE)
|
||
plus.android.importClass(cm)
|
||
let linkProperties = cm.getLinkProperties(cm.getActiveNetwork())
|
||
let linkAddrs = plus.android.invoke(linkProperties, 'getLinkAddresses')
|
||
plus.android.importClass(linkAddrs)
|
||
for (var i = 0; i < linkAddrs.size(); i++) {
|
||
let inetAddr = plus.android.invoke(linkAddrs.get(i), 'getAddress')
|
||
deviceIp = plus.android.invoke(inetAddr, 'getHostAddress')
|
||
}
|
||
//再看有没有wifi
|
||
if (deviceIp == '') {
|
||
var wifiManager = plus.android.runtimeMainActivity().getSystemService(Context.WIFI_SERVICE);
|
||
var wifiInfo = plus.android.invoke(wifiManager, "getConnectionInfo");
|
||
var ipAddress = plus.android.invoke(wifiInfo, "getIpAddress");
|
||
if (ipAddress != 0) {
|
||
deviceIp = ((ipAddress & 0xff) + "." + (ipAddress >> 8 & 0xff) + "." + (ipAddress >> 16 &
|
||
0xff) + "." + (ipAddress >> 24 & 0xff));
|
||
}
|
||
}
|
||
}
|
||
console.log(deviceIp)
|
||
return deviceIp;
|
||
// #endif
|
||
}
|
||
</script>
|
||
|
||
<style lang="scss" scoped>
|
||
:deep(.uni-select) {
|
||
border: none;
|
||
padding-left: 0;
|
||
height: 88rpx;
|
||
}
|
||
|
||
:deep(.uni-select__input-placeholder) {
|
||
font-size: 28rpx;
|
||
color: #999999;
|
||
}
|
||
|
||
:deep(.uni-icons) {
|
||
display: none;
|
||
}
|
||
|
||
.logo {
|
||
padding-top: 184rpx;
|
||
|
||
image {
|
||
width: 475rpx;
|
||
height: 199rpx;
|
||
}
|
||
}
|
||
|
||
.form {
|
||
margin-top: 60rpx;
|
||
|
||
.box {
|
||
width: 570rpx;
|
||
height: 88rpx;
|
||
background: #F8F8F8;
|
||
border-radius: 44rpx;
|
||
padding: 0 30rpx;
|
||
margin-top: 40rpx;
|
||
position: relative;
|
||
|
||
.account_box {
|
||
position: absolute;
|
||
top: 100rpx;
|
||
left: 90rpx;
|
||
width: 500rpx;
|
||
background-color: #fff;
|
||
box-shadow: 0px 0px 3px 1px #dfdfdf;
|
||
z-index: 99;
|
||
border-radius: 10rpx;
|
||
|
||
// &::after {
|
||
// position: absolute;
|
||
// content: ' ';
|
||
// border: 15rpx solid;
|
||
// border-color: transparent transparent #fff transparent;
|
||
// top: -30rpx;
|
||
// left: 30rpx;
|
||
// z-index: 999;
|
||
// }
|
||
|
||
|
||
.account {
|
||
max-height: 200rpx;
|
||
|
||
overflow-y: auto;
|
||
|
||
view {
|
||
padding: 10rpx;
|
||
}
|
||
|
||
}
|
||
}
|
||
|
||
image {
|
||
width: 40rpx;
|
||
height: 40rpx;
|
||
margin-right: 20rpx;
|
||
}
|
||
|
||
input {
|
||
height: 100%;
|
||
flex: 1;
|
||
}
|
||
}
|
||
}
|
||
|
||
.pwd {
|
||
image {
|
||
width: 34rpx;
|
||
height: 34rpx;
|
||
margin-right: 4rpx;
|
||
}
|
||
|
||
justify-content: flex-end;
|
||
margin-top: 20rpx;
|
||
margin-right: 60rpx;
|
||
font-size: 24rpx;
|
||
color: #01508B;
|
||
}
|
||
|
||
.login {
|
||
margin-top: 63rpx;
|
||
|
||
view {
|
||
width: 630rpx;
|
||
height: 88rpx;
|
||
background: #4e74fb;
|
||
border-radius: 44rpx;
|
||
font-size: 32rpx;
|
||
color: #FFFFFF;
|
||
text-align: center;
|
||
line-height: 88rpx;
|
||
}
|
||
}
|
||
</style> |