增加权限配置

This commit is contained in:
BianLzhaoMin 2024-08-27 16:09:01 +08:00
parent fb7892f66b
commit eca75347ce
4 changed files with 678 additions and 546 deletions

17
App.vue
View File

@ -1,17 +1,20 @@
<script> <script>
import store from "./store/user";
export default { export default {
onLaunch: function () { onLaunch: function () {
// app // app
plus.screen.lockOrientation('portrait-primary') plus.screen.lockOrientation("portrait-primary");
console.log('App Launch') console.log("App Launch");
}, },
onShow: function () { onShow: async function () {
console.log('App Show') console.log("App Show");
const { data: res } = await this.$api.index.getUserInfo();
store.commit("SET_PERMISSIONS", res.permissions);
}, },
onHide: function () { onHide: function () {
console.log('App Hide') console.log("App Hide");
} },
} };
</script> </script>
<style lang="scss"> <style lang="scss">

View File

@ -4,27 +4,47 @@
<view class="logo"> <view class="logo">
<image src="../../static/logo.png" mode=""></image> <image src="../../static/logo.png" mode=""></image>
</view> </view>
<view class="tit"> <view class="tit"> 智慧仓储管理平台 </view>
智慧仓储管理平台
</view>
</view> </view>
<view class="switch-log"> <view class="switch-log">
<view :class="[{ active: switchStatus == 1 }]" @click="switchUpper(1)"> <view
:class="[{ active: switchStatus == 1 }]"
@click="switchUpper(1)">
账号登录 账号登录
</view> </view>
<view :class="[{ active: switchStatus == 2 }]" @click="switchUpper(2)"> <view
:class="[{ active: switchStatus == 2 }]"
@click="switchUpper(2)">
手机登录 手机登录
</view> </view>
</view> </view>
<view class="login-area"> <view class="login-area">
<uni-forms v-show="switchStatus == 1" ref="accountForm" :modelValue="accountFormData" :rules="accountRules" <uni-forms
class="form-area" label-position="top"> v-show="switchStatus == 1"
<uni-forms-item name="username" required label="用户名" label-width="100"> ref="accountForm"
<uni-easyinput placeholder="请输入用户名称" maxlength="60" :modelValue="accountFormData"
:rules="accountRules"
class="form-area"
label-position="top">
<uni-forms-item
name="username"
required
label="用户名"
label-width="100">
<uni-easyinput
placeholder="请输入用户名称"
maxlength="60"
v-model="accountFormData.username"></uni-easyinput> v-model="accountFormData.username"></uni-easyinput>
</uni-forms-item> </uni-forms-item>
<uni-forms-item name="password" required label="密码" label-width="100"> <uni-forms-item
<uni-easyinput type="password" placeholder="请输入密码" maxlength="60" name="password"
required
label="密码"
label-width="100">
<uni-easyinput
type="password"
placeholder="请输入密码"
maxlength="60"
v-model="accountFormData.password"></uni-easyinput> v-model="accountFormData.password"></uni-easyinput>
</uni-forms-item> </uni-forms-item>
<text <text
@ -32,25 +52,47 @@
width: 100%; width: 100%;
display: flex; display: flex;
justify-content: flex-end; justify-content: flex-end;
color: #3689FF; color: #3689ff;
font-size: 14px; font-size: 14px;
" "
@click="forgetPwd" @click="forgetPwd">
>
忘记密码 忘记密码
</text> </text>
<button class="submit-btn" @click="accountSubmit">登录</button> <button class="submit-btn" @click="accountSubmit">登录</button>
</uni-forms> </uni-forms>
<uni-forms v-show="switchStatus == 2" ref="veriForm" :modelValue="veriFormData" :rules="veriRules" <uni-forms
class="form-area" label-position="top"> v-show="switchStatus == 2"
<uni-forms-item name="phone" required label="手机号码" label-width="100"> ref="veriForm"
<uni-easyinput placeholder="请输入手机号码" type="number" v-model="veriFormData.phone" :modelValue="veriFormData"
:rules="veriRules"
class="form-area"
label-position="top">
<uni-forms-item
name="phone"
required
label="手机号码"
label-width="100">
<uni-easyinput
placeholder="请输入手机号码"
type="number"
v-model="veriFormData.phone"
maxlength="11"></uni-easyinput> maxlength="11"></uni-easyinput>
</uni-forms-item> </uni-forms-item>
<uni-forms-item name="code" required label="验证码" label-width="100"> <uni-forms-item
<uni-easyinput type="number" maxlength="6" placeholder="请输入验证码" name="code"
required
label="验证码"
label-width="100">
<uni-easyinput
type="number"
maxlength="6"
placeholder="请输入验证码"
v-model="veriFormData.code"></uni-easyinput> v-model="veriFormData.code"></uni-easyinput>
<button class="count-down" :disabled="sendDisabled" @click="sendVeriCode" style="font-size: 14px;"> <button
class="count-down"
:disabled="sendDisabled"
@click="sendVeriCode"
style="font-size: 14px">
<span v-if="countDownStatus == 0">发送验证码</span> <span v-if="countDownStatus == 0">发送验证码</span>
<span v-if="countDownStatus == 1"> <span v-if="countDownStatus == 1">
{{ countDown }}s {{ countDown }}s
@ -60,262 +102,326 @@
<button class="submit-btn" @click="veriSubmit">登录</button> <button class="submit-btn" @click="veriSubmit">登录</button>
</uni-forms> </uni-forms>
</view> </view>
<u-loading-page :loading="showLoading" color="#000" loading-text="登录中,请稍后..."></u-loading-page> <u-loading-page
<u-loading-page :loading="showDownload" color="#000" :loading-text="`下载中,请稍后...${percent}%`"></u-loading-page> :loading="showLoading"
color="#000"
loading-text="登录中,请稍后..."></u-loading-page>
<u-loading-page
:loading="showDownload"
color="#000"
:loading-text="`下载中,请稍后...${percent}%`"></u-loading-page>
</view> </view>
</template> </template>
<script> <script>
import { authPath, publicPath, systemPath } from '../../public' import { authPath, publicPath, systemPath } from "../../public";
import store from "../../store/user";
export default { export default {
data() { data() {
return { return {
showLoading: false, showLoading: false,
showDownload: false, showDownload: false,
accountFormData: { accountFormData: {
username: '', username: "",
password: '' password: "",
}, },
veriFormData: { veriFormData: {
phone: '', phone: "",
code: '' code: "",
}, },
switchStatus: 1, switchStatus: 1,
countDown: 60, countDown: 60,
countDownStatus: 0, countDownStatus: 0,
sendDisabled: false, sendDisabled: false,
givenCode: '', givenCode: "",
accountRules: { accountRules: {
username: { username: {
rules: [ rules: [
{ {
required: true, required: true,
errorMessage: '请输入用户名称!' errorMessage: "请输入用户名称!",
} },
] ],
}, },
password: { password: {
rules: [ rules: [
{ {
required: true, required: true,
errorMessage: '请输入密码!' errorMessage: "请输入密码!",
} },
] ],
} },
}, },
veriRules: { veriRules: {
phone: { phone: {
rules: [ rules: [
{ {
required: true, required: true,
errorMessage: '请输入手机号码!' errorMessage: "请输入手机号码!",
} },
] ],
}, },
code: { code: {
rules: [ rules: [
{ {
required: true, required: true,
errorMessage: '请输入验证码!' errorMessage: "请输入验证码!",
}
]
}
}, },
percent: '' ],
} },
},
percent: "",
};
}, },
methods: { methods: {
switchUpper(count) { switchUpper(count) {
this.switchStatus = count this.switchStatus = count;
}, },
forgetPwd() { forgetPwd() {
console.log('忘记密码'); console.log("忘记密码");
}, },
sendVeriCode() { sendVeriCode() {
let that = this let that = this;
let phoneReg = /^(?:(?:\+|00)86)?1[3-9]\d{9}$/ let phoneReg = /^(?:(?:\+|00)86)?1[3-9]\d{9}$/;
if (!phoneReg.test(that.veriFormData.phone)) { if (!phoneReg.test(that.veriFormData.phone)) {
uni.showToast({ uni.showToast({
icon: 'none', icon: "none",
title: '请输入正确格式的手机号!' title: "请输入正确格式的手机号!",
}) });
} else { } else {
that.$api.login.codeLogin({ that.$api.login
phone: String(that.veriFormData.phone) .codeLogin({
}).then(res => { phone: String(that.veriFormData.phone),
console.log(res);
}).catch(err => {
console.log(err);
}) })
that.countDownStatus = 1 .then((res) => {
that.sendDisabled = true console.log(res);
})
.catch((err) => {
console.log(err);
});
that.countDownStatus = 1;
that.sendDisabled = true;
let timeInterval = setInterval(() => { let timeInterval = setInterval(() => {
that.countDown -= 1 that.countDown -= 1;
}, 1000) }, 1000);
let timeOut = setTimeout(() => { let timeOut = setTimeout(() => {
that.countDownStatus = 0 that.countDownStatus = 0;
that.countDown = 60 that.countDown = 60;
that.sendDisabled = false that.sendDisabled = false;
clearInterval(timeInterval) clearInterval(timeInterval);
clearTimeout(timeOut) clearTimeout(timeOut);
}, 1000 * 60) }, 1000 * 60);
} }
}, },
veriSubmit() { veriSubmit() {
let that = this let that = this;
that.$refs.veriForm.validate().then(formRes => { that.$refs.veriForm.validate().then((formRes) => {
that.showLoading = true that.showLoading = true;
console.log(formRes); console.log(formRes);
that.$api.login.checkCode(formRes).then(res => { that.$api.login
.checkCode(formRes)
.then((res) => {
console.log(res); console.log(res);
if (res.data.code == 200) { if (res.data.code == 200) {
uni.setStorageSync('userInfo', res.data.data.login_user) uni.setStorageSync(
uni.setStorageSync('token', res.data.data.access_token) "userInfo",
uni.setStorageSync('roles', res.data.data.login_user.roles) res.data.data.login_user
uni.setStorageSync('deptId', res.data.data.login_user.sysUser.dept.deptId) );
uni.setStorageSync(
"token",
res.data.data.access_token
);
uni.setStorageSync(
"roles",
res.data.data.login_user.roles
);
uni.setStorageSync(
"deptId",
res.data.data.login_user.sysUser.dept.deptId
);
uni.showToast({ uni.showToast({
icon: 'none', icon: "none",
title: '登录成功!', title: "登录成功!",
success: () => { success: () => {
that.showLoading = false that.showLoading = false;
uni.switchTab({ uni.switchTab({
url: '/pages/index/index' url: "/pages/index/index",
}) });
} },
}) });
} else { } else {
uni.showToast({ uni.showToast({
icon: 'none', icon: "none",
title: res.data.msg, title: res.data.msg,
success: () => { success: () => {
that.showLoading = false that.showLoading = false;
},
});
} }
}) })
} .catch((err) => {
}).catch(err => {
console.log(err); console.log(err);
}) });
}) });
}, },
accountSubmit() { accountSubmit() {
let that = this let that = this;
that.$refs.accountForm.validate().then(formData => { that.$refs.accountForm.validate().then((formData) => {
that.showLoading = true that.showLoading = true;
console.log(formData); console.log(formData);
that.$api.login.log(formData).then(res => { that.$api.login
.log(formData)
.then(async (res) => {
console.log(res); console.log(res);
if (res.data.code == 200) { if (res.data.code == 200) {
uni.setStorageSync('userInfo', res.data.data.login_user) uni.setStorageSync(
uni.setStorageSync('token', res.data.data.access_token) "userInfo",
uni.setStorageSync('roles', res.data.data.login_user.roles) res.data.data.login_user
uni.setStorageSync('pwd', formData.password) );
uni.setStorageSync(
"token",
res.data.data.access_token
);
uni.setStorageSync(
"roles",
res.data.data.login_user.roles
);
uni.setStorageSync("pwd", formData.password);
// uni.setStorageSync('deptId', res.data.data.login_user.sysUser.dept.deptId) // uni.setStorageSync('deptId', res.data.data.login_user.sysUser.dept.deptId)
const { data: resS } =
await this.$api.index.getUserInfo();
store.commit(
"SET_PERMISSIONS",
resS.permissions
);
uni.showToast({ uni.showToast({
icon: 'none', icon: "none",
title: '登录成功!', title: "登录成功!",
success: () => { success: () => {
that.showLoading = false that.showLoading = false;
},
});
setTimeout(() => {
uni.switchTab({ uni.switchTab({
url: '/pages/index/index' url: "/pages/index/index",
}) });
} }, 500);
})
} else { } else {
uni.showToast({ uni.showToast({
icon: 'none', icon: "none",
title: res.data.msg, title: res.data.msg,
success: () => { success: () => {
that.showLoading = false that.showLoading = false;
},
});
} }
}) })
} .catch((err) => {
}).catch(err => {
console.log(err); console.log(err);
uni.showToast({ uni.showToast({
icon: 'none', icon: "none",
title: '网络异常,请稍后再试!', title: "网络异常,请稍后再试!",
success: () => { success: () => {
that.showLoading = false that.showLoading = false;
} },
}) });
}) });
}) });
} },
}, },
onShow() { onShow() {
if (uni.getStorageSync('pwd')) { if (uni.getStorageSync("pwd")) {
this.accountFormData.password = uni.getStorageSync('pwd') this.accountFormData.password = uni.getStorageSync("pwd");
} }
}, },
onLoad() { onLoad() {
let that = this let that = this;
let nowVer = '' let nowVer = "";
let serveVer = '' let serveVer = "";
let apkPath = '' let apkPath = "";
// app // app
plus.runtime.getProperty(plus.runtime.appid, (info) => { plus.runtime.getProperty(plus.runtime.appid, (info) => {
nowVer = info.version.replace(/\./g, '') nowVer = info.version.replace(/\./g, "");
}) });
// app // app
this.$api.update.fetchAppVer().then(res => { this.$api.update
.fetchAppVer()
.then((res) => {
console.log(res); console.log(res);
if (res.data.code == 200) { if (res.data.code == 200) {
serveVer = res.data.data[0].versionName.replace(/\./g, '') serveVer = res.data.data[0].versionName.replace(
apkPath = res.data.data[0].apkPath /\./g,
""
);
apkPath = res.data.data[0].apkPath;
// //
setTimeout(() => { setTimeout(() => {
console.log(nowVer, serveVer, apkPath); console.log(nowVer, serveVer, apkPath);
if (nowVer < serveVer) { if (nowVer < serveVer) {
uni.showModal({ uni.showModal({
title: '版本升级', title: "版本升级",
content: '当前版本非最新版本,请前往升级!', content: "当前版本非最新版本,请前往升级!",
showCancel: false, showCancel: false,
confirmText: '升级', confirmText: "升级",
success: (res) => { success: (res) => {
if (res.confirm) { if (res.confirm) {
that.showDownload = true that.showDownload = true;
uni.hideTabBar() uni.hideTabBar();
let downloadApk = uni.downloadFile({ let downloadApk = uni.downloadFile({
url: apkPath, url: apkPath,
success: (download) => { success: (download) => {
console.log(download); console.log(download);
if (download.statusCode == 200) { if (
plus.runtime.install(download.tempFilePath, { download.statusCode ==
force: true 200
}, (install) => { ) {
that.showDownload = false plus.runtime.install(
uni.showTabBar() download.tempFilePath,
console.log(install); {
}) force: true,
},
(install) => {
that.showDownload = false;
uni.showTabBar();
console.log(
install
);
}
);
} else { } else {
uni.showTabBar() uni.showTabBar();
that.showDownload = false that.showDownload = false;
uni.showToast({ uni.showToast({
icon: 'none', icon: "none",
title: '下载异常,请稍后再试!' title: "下载异常,请稍后再试!",
}) });
} }
},
});
downloadApk.onProgressUpdate(
(res) => {
that.percent = res.progress;
}
);
}
},
});
}
}, 500);
} }
}) })
downloadApk.onProgressUpdate(res => { .catch((err) => {
that.percent = res.progress
})
}
}
})
}
}, 500)
}
}).catch(err => {
console.log(err); console.log(err);
}) });
} },
} };
</script> </script>
<style lang="scss"> <style lang="scss">
body { body {
background: url('/static/log-bgd.png'); background: url("/static/log-bgd.png");
background-repeat: no-repeat; background-repeat: no-repeat;
background-size: 100% 100%; background-size: 100% 100%;
} }
@ -344,7 +450,7 @@ body {
font-weight: bold; font-weight: bold;
display: flex; display: flex;
justify-content: center; justify-content: center;
color: #3C87F3; color: #3c87f3;
} }
} }
@ -361,7 +467,7 @@ body {
.active { .active {
font-size: 14px; font-size: 14px;
font-weight: bold; font-weight: bold;
border-bottom: 4px solid #B4D0FF; border-bottom: 4px solid #b4d0ff;
border-bottom-left-radius: 15rpx; border-bottom-left-radius: 15rpx;
border-bottom-right-radius: 15rpx; border-bottom-right-radius: 15rpx;
} }
@ -374,14 +480,14 @@ body {
margin: 0 auto; margin: 0 auto;
background-color: #fff; background-color: #fff;
border-radius: 20rpx; border-radius: 20rpx;
box-shadow: 0 3px 5px #E6EEFE; box-shadow: 0 3px 5px #e6eefe;
.uni-forms-item__content[data-v-61dfc0d0] { .uni-forms-item__content[data-v-61dfc0d0] {
display: flex; display: flex;
} }
.submit-btn { .submit-btn {
background-color: #3888FF; background-color: #3888ff;
margin: 10vh auto; margin: 10vh auto;
margin-bottom: 0; margin-bottom: 0;
border-radius: 50rpx; border-radius: 50rpx;

View File

@ -13,11 +13,13 @@
<view class="auth"> <view class="auth">
<h4>{{ companyName }}</h4> <h4>{{ companyName }}</h4>
<h4 class="authed"> <h4 class="authed">
<uni-icons style="margin-right: 8rpx; color: #F19600;" type="checkbox-filled"></uni-icons> <uni-icons
style="margin-right: 8rpx; color: #f19600"
type="checkbox-filled"></uni-icons>
<span>已认证</span> <span>已认证</span>
</h4> </h4>
</view> </view>
<u-cell-group style="width: 95%; margin: 15rpx auto;" :border="false"> <u-cell-group style="width: 95%; margin: 15rpx auto" :border="false">
<!-- <u-cell <!-- <u-cell
title="个人信息" title="个人信息"
:isLink="true" :isLink="true"
@ -30,61 +32,60 @@
:isLink="true" :isLink="true"
icon="/static/setting.png" icon="/static/setting.png"
url="/pages/fixPwd/fixPwd" url="/pages/fixPwd/fixPwd"
:border="false" :border="false">
>
</u-cell> </u-cell>
</u-cell-group> </u-cell-group>
<view <view class="exit-log" @click="exitLogin"> 退出登录 </view>
class="exit-log"
@click="exitLogin"
>
退出登录
</view>
</view> </view>
</template> </template>
<script> <script>
import { authPath } from '../../public' import { authPath } from "../../public";
import store from "../../store/user";
export default { export default {
data() { data() {
return { return {
companyName: uni.getStorageSync('companyName'), companyName: uni.getStorageSync("companyName"),
username: uni.getStorageSync('userInfo').username, username: uni.getStorageSync("userInfo").username,
phone: uni.getStorageSync('userInfo').sysUser.phonenumber phone: uni.getStorageSync("userInfo").sysUser.phonenumber,
} };
}, },
methods: { methods: {
exitLogin() { exitLogin() {
let that = this let that = this;
uni.showModal({ uni.showModal({
title: '退出登录', title: "退出登录",
content: '确定退出登录吗?', content: "确定退出登录吗?",
success: (res) => { success: (res) => {
if (res.confirm) { if (res.confirm) {
that.$api.user.logOut({}, null).then(res => { that.$api.user
.logOut({}, null)
.then((res) => {
console.log(res); console.log(res);
}).catch(err => { })
.catch((err) => {
console.log(err); console.log(err);
}) });
uni.removeStorageSync('token') uni.removeStorageSync("token");
uni.removeStorageSync('userInfo') uni.removeStorageSync("userInfo");
store.commit("SET_PERMISSIONS", []);
uni.reLaunch({ uni.reLaunch({
url: '/pages/login/login' url: "/pages/login/login",
}) });
} }
} },
}) });
}, },
seeMore() { seeMore() {
console.log('更多'); console.log("更多");
} },
} },
} };
</script> </script>
<style lang="scss"> <style lang="scss">
body { body {
background: url('/static/user-bgd.png'); background: url("/static/user-bgd.png");
background-repeat: no-repeat; background-repeat: no-repeat;
background-size: 100% 100%; background-size: 100% 100%;
position: relative; position: relative;
@ -164,7 +165,7 @@ import { authPath } from '../../public'
display: flex; display: flex;
justify-content: center; justify-content: center;
align-items: center; align-items: center;
background-color: #3888FF; background-color: #3888ff;
color: #fff; color: #fff;
} }
</style> </style>

22
store/user.js Normal file
View File

@ -0,0 +1,22 @@
import Vue from 'vue'
import Vuex from 'vuex'
Vue.use(Vuex)
const user = new Vuex.Store({
state: {
permissions: []
},
mutations: {
SET_PERMISSIONS: (state, permissions) => {
state.permissions = permissions
}
},
})
export default user