修改登录展示菜单

This commit is contained in:
jingna 2025-06-20 14:26:27 +08:00
parent ab8b5a26f2
commit 9cd6f5ab07
7 changed files with 114 additions and 137 deletions

View File

@ -65,12 +65,12 @@ const getTimeOut = () => {
} }
// 创建axios实例 // 创建axios实例
const time = getTimeOut() // const time = getTimeOut()
window._de_get_time_out = time // window._de_get_time_out = time
console.log('timeout', PATH_URL) console.log('timeout', PATH_URL)
const service: AxiosInstanceWithLoading = axios.create({ const service: AxiosInstanceWithLoading = axios.create({
baseURL: PATH_URL, // api 的 base_url baseURL: PATH_URL, // api 的 base_url
timeout: time ? time * 1000 : config.request_timeout // 请求超时时间 // timeout: time ? time * 1000 : config.request_timeout // 请求超时时间
}) })
const mapping = { const mapping = {
'zh-CN': 'zh-CN', 'zh-CN': 'zh-CN',
@ -152,14 +152,15 @@ service.interceptors.response.use(
} else { } else {
if ( if (
!response?.config?.url.startsWith('/xpackComponent/content') && !response?.config?.url.startsWith('/xpackComponent/content') &&
response?.data?.code !== 60003 response?.data?.code !== 60003
) { ) {
ElMessage({ if(response?.data?.code != '1'){
type: 'error', ElMessage({
message: response.data.msg, type: 'error',
showClose: true message: response.data.msg,
}) showClose: true
})
}
if (response.data.code === 80001) { if (response.data.code === 80001) {
localStorage.clear() localStorage.clear()
let queryRedirectPath = '/application/index' let queryRedirectPath = '/application/index'

View File

@ -5,7 +5,7 @@ import { useUserStore } from '@/store/user'
const routes:any = [ const routes:any = [
{ {
path: '/', path: '/',
redirect: '/dashboard' redirect: '/UserNavbar'
}, },
// 登录页面路由配置 // 登录页面路由配置
{ {
@ -86,7 +86,7 @@ const routes:any = [
name: 'visualization', name: 'visualization',
component: () => import('@/data-visualization/index.vue'), component: () => import('@/data-visualization/index.vue'),
meta: { meta: {
title: '字典管理', title: '数据大屏',
requiresAuth: true requiresAuth: true
} }
}, },
@ -136,11 +136,9 @@ const router = createRouter({
// 路由守卫 // 路由守卫
router.beforeEach((to, from, next) => { router.beforeEach((to, from, next) => {
const userStore = useUserStore() const userStore = useUserStore()
// 设置页面标题 // 设置页面标题
document.title = to.meta.title ? `${to.meta.title} - StdProject` : 'StdProject' document.title = to.meta.title ? `${to.meta.title} - StdProject` : 'StdProject'
const token = localStorage.getItem('token') || '' const token = localStorage.getItem('token') || ''
console.log(userStore.isAuthenticated)
// 检查是否需要认证 // 检查是否需要认证
if (to.meta.requiresAuth) { if (to.meta.requiresAuth) {
if (!!token) { if (!!token) {
@ -151,7 +149,7 @@ router.beforeEach((to, from, next) => {
} else { } else {
// 如果已登录且访问登录页,重定向到仪表板 // 如果已登录且访问登录页,重定向到仪表板
if (to.path === '/UserLogin' && userStore.isAuthenticated) { if (to.path === '/UserLogin' && userStore.isAuthenticated) {
next('/dashboard') next('/UserNavbar')
} else { } else {
next() next()
} }

View File

@ -11,26 +11,22 @@ const route = useRoute()
const router = useRouter() const router = useRouter()
const applicationId:any =ref("") const applicationId:any =ref("")
const curmenu = ref('') const curmenu = ref('')
onMounted(() => { const props = defineProps({
if (route.query.id) { isshowheader: Boolean
applicationId.value = route.query.id
curmenu.value = '组织机构配置'
// findApplicationById(applicationId.value).then(res => {
// res.data.data.typename = ''
// projectInfo.value = res.data.data
// })
}else{
}
}) })
function menuclick(name){ onMounted(() => {
const userInfo:any = JSON.parse(localStorage.getItem('userInfo'))
applicationId.value = userInfo.appid
curmenu.value = '组织机构配置'
})
function menuclick(name:any){
curmenu.value = name curmenu.value = name
} }
</script> </script>
<template> <template>
<div> <div>
<Header v-if="!route.query.name" :projectInfo="projectInfo"/> <Header v-if="!props.isshowheader" :projectInfo="projectInfo"/>
<div class="permission-box"> <div class="permission-box">
<div class="permission-leftbox"> <div class="permission-leftbox">
<div class="permission-leftbox-menu" :class="curmenu == '组织机构配置' ? 'permission-leftbox-menu-active' : ''" @click="menuclick('组织机构配置')">组织机构配置</div> <div class="permission-leftbox-menu" :class="curmenu == '组织机构配置' ? 'permission-leftbox-menu-active' : ''" @click="menuclick('组织机构配置')">组织机构配置</div>

View File

@ -11,7 +11,6 @@ import { Delete } from '@element-plus/icons-vue'
import { ElTable,ElTree } from 'element-plus' import { ElTable,ElTree } from 'element-plus'
import { getOrganizations,addOrganization,setIsValid,updateOrganizationById, import { getOrganizations,addOrganization,setIsValid,updateOrganizationById,
deleteById,getOrganizationById } from '@/api/data-visualization/manage/organization' deleteById,getOrganizationById } from '@/api/data-visualization/manage/organization'
import { re } from 'mathjs'
const props = defineProps({ const props = defineProps({
applicationId:String applicationId:String
}) })

View File

@ -4,7 +4,7 @@
</div> </div>
</template> </template>
<script lang="ts" setup> <script lang="ts" setup>
import { ref, onMounted, onUnmounted } from 'vue' import { ref, onMounted } from 'vue'
import { loadModule } from 'vue3-sfc-loader' import { loadModule } from 'vue3-sfc-loader'
import * as Vue from 'vue/dist/vue.esm-bundler.js' import * as Vue from 'vue/dist/vue.esm-bundler.js'
import * as ElementPlus from 'element-plus' import * as ElementPlus from 'element-plus'
@ -14,16 +14,12 @@ import * as VueRouter from 'vue-router'
import { useRoute, useRouter } from 'vue-router' import { useRoute, useRouter } from 'vue-router'
import { i18n } from '@/data-visualization/plugins/vue-i18n' import { i18n } from '@/data-visualization/plugins/vue-i18n'
import defaultTemplate from '@/views/system/userlogin/frame.vue?raw' import defaultTemplate from '@/views/system/userlogin/frame.vue?raw'
// import { moduleUpdate, moduleById } from '@/api/application/module'
import { useCache } from '@/data-visualization/hooks/web/useCache' import { useCache } from '@/data-visualization/hooks/web/useCache'
import { getMenuTree } from '@/api/data-visualization/manage/menu'
import { moduleList } from '@/api/data-visualization/module'
import { any } from 'vue-types'
const route = useRoute() const route = useRoute()
const router = useRouter() const router = useRouter()
const sfcCode = ref(defaultTemplate) const sfcCode = ref(defaultTemplate)
const previewContainer = ref(null) const previewContainer:any = ref(null)
let prevApp:any = null let prevApp:any = null
const projectName:any = ref('') const projectName:any = ref('')
const applicationId:any = ref('') const applicationId:any = ref('')
@ -55,15 +51,18 @@ const runCode = async () => {
prevApp = null prevApp = null
await Vue.nextTick() await Vue.nextTick()
} }
const options = { const options:any = {
moduleCache: { moduleCache: {
vue: Vue, vue: Vue,
'element-plus': ElementPlus, 'element-plus': ElementPlus,
'vue/dist/vue.esm-bundler.js': Vue, 'vue/dist/vue.esm-bundler.js': Vue,
'vue-router': VueRouter, 'vue-router': VueRouter,
// '@/viewsnew/application/SfcEditor/NavbarEditor/assocPage.vue': Vue.defineAsyncComponent(() => '@/data-visualization/index.vue': Vue.defineAsyncComponent(() =>
// import('@/viewsnew/application/SfcEditor/NavbarEditor/assocPage.vue') import('@/data-visualization/index.vue')
// ), ),
'@/views/BuiltInPage/FormCreate.vue': Vue.defineAsyncComponent(() =>
import('@/views/BuiltInPage/FormCreate.vue')
),
'@/views/system/manage/index.vue': Vue.defineAsyncComponent(() => '@/views/system/manage/index.vue': Vue.defineAsyncComponent(() =>
import('@/views/system/manage/index.vue') import('@/views/system/manage/index.vue')
), ),
@ -109,7 +108,7 @@ const runCode = async () => {
return '' return ''
}, },
// //
addStyle: (css) => { addStyle: (css:any) => {
const style = document.createElement('style') const style = document.createElement('style')
style.textContent = css style.textContent = css
document.head.appendChild(style) document.head.appendChild(style)
@ -117,14 +116,12 @@ const runCode = async () => {
compiledCache: new Map(), compiledCache: new Map(),
compileTemplate: true compileTemplate: true
} }
const componentModule = await loadModule('dynamic.vue', options) const componentModule:any = await loadModule('dynamic.vue', options)
const component = componentModule.default || componentModule const component = componentModule.default || componentModule
const dynamicProps = Vue.reactive({ const dynamicProps = Vue.reactive({
menuList: menuList.value, menuList: menuList.value,
isFixed: true,
projectName: '测试', projectName: '测试',
applicationId: applicationId.value, applicationId: applicationId.value,
isExecuteEvent: false
}) })
// createApp // createApp
prevApp = Vue.createApp({ prevApp = Vue.createApp({
@ -140,8 +137,8 @@ const runCode = async () => {
prevApp.use(ElementPlus) prevApp.use(ElementPlus)
prevApp.mount(previewContainer.value) prevApp.mount(previewContainer.value)
} catch (error) { } catch (error:any) {
console.error('运行时错误:', error) // console.error(':', error)
previewContainer.value.innerHTML = ` previewContainer.value.innerHTML = `
<div class="error"> <div class="error">
<h3>错误</h3> <h3>错误</h3>
@ -150,48 +147,41 @@ const runCode = async () => {
` `
} }
} }
const processMenuTree = (menuNodes: any[], moduleData: any[]) => {
const typeMap = new Map(
moduleData.map(({ id, type }) => [id, type])
);
const traverseMenu = (nodes: any[]) => {
for (const node of nodes) {
if (node.module_id && typeMap.has(node.module_id)) {
node.module_type = typeMap.get(node.module_id);
}
if (node.children?.length) {
traverseMenu(node.children);
}
}
};
traverseMenu(menuNodes);
return menuNodes;
};
onMounted(() => { onMounted(() => {
if (route.query.id) { const appInfo:any = JSON.parse(localStorage.getItem('userInfo'))
applicationId.value = route.query.id if (appInfo.id) {
projectName.value = route.query.name applicationId.value = appInfo.id
projectName.value = '测试'
getmenuinfo() getmenuinfo()
} }
}) })
function getmenuinfo() { function gettreeData(orglist:any) {
const params = { const res:any = {};
appId: applicationId.value, for (const row of orglist) {
name: '', // parentid
isdisplay: '' const parentid = row.parentid || "0";
const { id, name,code, isdisplay, appId, type,module_id,module_type } = row;
//
const nodeData = { parentid, id, name,code, isdisplay, appId, type,module_id,module_type }
//
if (res[id]) {
Object.assign(res[id], nodeData);
} else {
res[id] = { ...nodeData, children: [] };
} }
getMenuTree(params).then((res:any) => { //
menuList.value = res.data if (res[parentid]) {
const paramss = { appId: applicationId.value } res[parentid].children.push(res[id]);
moduleList(paramss).then((ress:any) => { } else {
var arr = ress.data res[parentid] = { children: [res[id]] };
if(ress.data.length>0){ }
menuList.value = processMenuTree(menuList.value, arr) }
} return res[0].children;
runCode() }
}) function getmenuinfo() {
}) const permissions:any = JSON.parse(localStorage.getItem('permissions'))
menuList.value = gettreeData(permissions)
runCode()
} }
</script> </script>
<style> <style>

View File

@ -6,6 +6,8 @@ import PermissionSet from '@/views/system/manage/index.vue'
import UserInfoSet from '@/views/system/manage/user/userinfo.vue' import UserInfoSet from '@/views/system/manage/user/userinfo.vue'
import {useRoute, useRouter } from 'vue-router' import {useRoute, useRouter } from 'vue-router'
import { useCache } from '@/data-visualization/hooks/web/useCache' import { useCache } from '@/data-visualization/hooks/web/useCache'
import dataVisualization from '@/data-visualization/index.vue'
import FormCreate from '@/views/BuiltInPage/FormCreate.vue'
const { wsCache } = useCache() const { wsCache } = useCache()
const router = useRouter() const router = useRouter()
const route = useRoute() const route = useRoute()
@ -18,18 +20,16 @@ const props = defineProps({
isFixed: Boolean, isFixed: Boolean,
projectName: String, projectName: String,
applicationId: String, applicationId: String,
isExecuteEvent: Boolean
}) })
const navtitle:any = ref('') const navtitle:any = ref('')
const navmenulist: any = ref([ const navmenulist: any = ref([
]) ])
const checkindex = ref(null) const checkindex = ref(null)
const showmodule = ref(false)
const currentMoudleId = ref('') const currentMoudleId = ref('')
const showermission = ref(false) const currentMoudleType = ref('')
const showUserInfo = ref(false) const currentrow:any = ref({})
const currentrow = ref({})
const userList:any = ref({}) const userList:any = ref({})
const showcontent = ref('')
watch( watch(
() => props.menuList, () => props.menuList,
(newVal) => { (newVal) => {
@ -40,34 +40,37 @@ watch(
{ immediate: true } // { immediate: true } //
) )
function menuclick(index: any) { function menuclick(index: any) {
showcontent.value = ''
if (navmenulist.value[index].children.length == 0 || navmenulist.value[index].children == undefined) { if (navmenulist.value[index].children.length == 0 || navmenulist.value[index].children == undefined) {
checkindex.value = index checkindex.value = index
if (props.isExecuteEvent) {
return
}
currentMoudleId.value = navmenulist.value[index].module_id currentMoudleId.value = navmenulist.value[index].module_id
if (navmenulist.value[index].module_id && navmenulist.value[index].module_id !== '') { if (navmenulist.value[index].module_id && navmenulist.value[index].module_id !== '') {
currentMoudleId.value = navmenulist.value[index].module_id currentMoudleId.value = navmenulist.value[index].module_id
currentrow.value = navmenulist.value[index] currentrow.value = navmenulist.value[index]
showmodule.value = true if(currentrow.value.module_type == '03'){
showermission.value = false currentMoudleType.value = 'dataV'
showUserInfo.value = false showcontent.value = 'dataVisualization'
}else if(currentrow.value.module_type == '0301'){
currentMoudleType.value = 'dashboard'
showcontent.value = 'dataVisualization'
}
} }
} }
} }
function childmenuclick(item: any) { function childmenuclick(item: any) {
if (props.isExecuteEvent) { showcontent.value = ''
return
}
showermission.value = false
showmodule.value = false
showUserInfo.value = false
if (item.module_id && item.module_id !== '') { if (item.module_id && item.module_id !== '') {
currentrow.value = item currentrow.value = item
currentMoudleId.value = item.module_id currentMoudleId.value = item.module_id
showmodule.value = true if(currentrow.value.module_type == '03'){
} else { currentMoudleType.value = 'dataV'
showmodule.value = false showcontent.value = 'dataVisualization'
}else if(currentrow.value.module_type == '0301'){
currentMoudleType.value = 'dashboard'
showcontent.value = 'dataVisualization'
}else if(currentrow.value.module_type == '05'){
showcontent.value = 'FormCreate'
}
} }
} }
// //
@ -112,18 +115,13 @@ const TimeDisplay = {
onMounted(() => { onMounted(() => {
navmenulist.value = props.menuList navmenulist.value = props.menuList
navtitle.value = props.projectName navtitle.value = props.projectName
userList.value = wsCache.get('Permission-userinfo') userList.value = JSON.parse(localStorage.getItem('userInfo'))
}) })
onBeforeUnmount(() => { onBeforeUnmount(() => {
}); });
function permissionClick() { function permissionClick() {
if (props.isExecuteEvent) { showcontent.value = 'PermissionSet'
return
}
showmodule.value = false
showUserInfo.value = false
showermission.value = true
} }
function logout(){ function logout(){
ElMessageBox.confirm( ElMessageBox.confirm(
@ -136,18 +134,17 @@ function logout(){
} }
) )
.then(() => { .then(() => {
wsCache.delete('Permission-userinfo') localStorage.removeItem('token')
localStorage.removeItem('userInfo')
localStorage.removeItem('permissions')
router.push({ router.push({
path: '/UserLogin', path: '/UserLogin',
query: { id: props.applicationId, name: props.projectName }
}) })
}) })
.catch(() => {}) .catch(() => {})
} }
function userdetails(){ function userdetails(){
showmodule.value = false showcontent.value = 'UserInfoSet'
showermission.value = false
showUserInfo.value = true
} }
</script> </script>
<template> <template>
@ -180,18 +177,17 @@ function userdetails(){
<div style="margin-right: 10px;cursor: pointer;" @click="permissionClick"><img <div style="margin-right: 10px;cursor: pointer;" @click="permissionClick"><img
src="@/assets/system/navpermission.png" alt=""></div> src="@/assets/system/navpermission.png" alt=""></div>
<div style="margin-right: 10px;cursor: pointer;" @click="userdetails"><img src="@/assets/system/nav1.png" alt=""></div> <div style="margin-right: 10px;cursor: pointer;" @click="userdetails"><img src="@/assets/system/nav1.png" alt=""></div>
<div style="margin-right: 15px;min-width: 45px;cursor: pointer;" @click="userdetails">{{ props.isExecuteEvent == false?userList.nickname:'admin' }}</div> <div style="margin-right: 15px;min-width: 45px;cursor: pointer;" @click="userdetails">{{ userList.nickname }}</div>
<div style="margin-right: 15px;cursor: pointer;"><img src="@/assets/system/nav3.png" alt=""></div> <div style="margin-right: 15px;cursor: pointer;"><img src="@/assets/system/nav3.png" alt=""></div>
<div @click="logout" style="cursor: pointer;"><img src="@/assets/system/nav4.png" alt=""></div> <div @click="logout" style="cursor: pointer;"><img src="@/assets/system/nav4.png" alt=""></div>
</div> </div>
</div> </div>
</div> </div>
<div v-if="!props.isExecuteEvent" class="system-box-content" <div class="system-box-content" style="height: calc(100vh - 65px);">
:style="{ height: props.isFixed ? 'calc(100vh - 65px)' : 'calc(100vh - 125px)' }"> <dataVisualization v-if="showcontent == 'dataVisualization'" :appId="currentrow.module_id" :busiFlag="currentMoudleType" />
<!-- <Assocmodule v-if="showmodule" :applicationId="props.applicationId" <FormCreate v-if="showcontent == 'FormCreate'" :appId="currentrow.module_id" />
:moduleinfo="currentrow" /> --> <PermissionSet v-if="showcontent == 'PermissionSet'" :isshowheader="true" />
<PermissionSet v-if="showermission" /> <UserInfoSet v-if="showcontent == 'UserInfoSet'" :userList="userList" :applicationId="props.applicationId" />
<UserInfoSet v-if="showUserInfo" :userList="userList" :applicationId="props.applicationId" />
</div> </div>
</div> </div>
</template> </template>

View File

@ -30,6 +30,7 @@ const loginRules = ref({
}) })
const ruleFormRef = ref<FormInstance>() const ruleFormRef = ref<FormInstance>()
const loginTitle: any = ref('') const loginTitle: any = ref('')
const errormsg = ref('')
const submitForm = async (formEl: FormInstance | undefined) => { const submitForm = async (formEl: FormInstance | undefined) => {
if (props.isExecuteEvent) { if (props.isExecuteEvent) {
return return
@ -39,36 +40,31 @@ const submitForm = async (formEl: FormInstance | undefined) => {
if (valid) { if (valid) {
var password = encrypt(form.value.password) var password = encrypt(form.value.password)
const params = { const params = {
appid:props.id,
username: form.value.username, username: form.value.username,
password: password password: password
} }
userLogin(params).then((res:any) => { userLogin(params).then((res:any) => {
if(res.code == '0'){ if(res.code == '0'){
let userInfo = { errormsg.value = ''
let userInfo:any = {
nickname: res.data.nickname, nickname: res.data.nickname,
username: res.data.username, username: res.data.username,
id: res.data.userid id: res.data.userid,
appid:res.data.appid
} }
wsCache.set('Permission-userinfo', userInfo) localStorage.setItem('userInfo',JSON.stringify(userInfo))
ElMessage.success('登录成功')
userStore.isAuthenticated = true
localStorage.setItem('token', res.data.token) localStorage.setItem('token', res.data.token)
setTimeout(() => { localStorage.setItem('permissions', JSON.stringify(res.data.permissions))
router.push({ ElMessage.success('登录成功')
router.push({
path: '/UserNavbar', path: '/UserNavbar',
query: { id: props.id, name: props.name }
}) })
}, 500)
}else{ }else{
console.log(res,'信息') errormsg.value = res.msg
ElMessage.error(res.msg)
return return
} }
}).catch((err:any) => { }).catch((err:any) => {
ElMessage.error(err.msg) errormsg.value = err
}) })
} else { } else {
@ -115,6 +111,7 @@ onBeforeUnmount(() => {
style="width:100%;height: 1px;" alt=""> style="width:100%;height: 1px;" alt="">
</div> </div>
</el-form-item> </el-form-item>
<div style="color:red;margin-top:10px">{{errormsg}}</div>
<div class="login-button" @click="submitForm(ruleFormRef)">登录</div> <div class="login-button" @click="submitForm(ruleFormRef)">登录</div>
</el-form> </el-form>
</div> </div>
@ -203,7 +200,7 @@ onBeforeUnmount(() => {
color: #fff; color: #fff;
background: url(/images/loginbtn.png) no-repeat; background: url(/images/loginbtn.png) no-repeat;
background-size: 100% 100%; background-size: 100% 100%;
margin-top: 40px; margin-top: 10px;
cursor: pointer; cursor: pointer;
} }
} }