feat:优化页面代码及版本升级报错处理

branch_202502110906
朱群锋 2025-02-12 09:34:21 +08:00
parent c827a97c3b
commit cb5ae00dc8
9 changed files with 148 additions and 205 deletions

View File

@ -5,7 +5,7 @@
"type": "module", "type": "module",
"scripts": { "scripts": {
"dev": "vite", "dev": "vite",
"build": "run-p type-check \"build-only {@}\" --", "build": "vite build",
"preview": "vite preview", "preview": "vite preview",
"build-only": "vite build", "build-only": "vite build",
"type-check": "vue-tsc --build --force" "type-check": "vue-tsc --build --force"

View File

@ -22,7 +22,6 @@ export function removeToken() {
// 菜单信息 // 菜单信息
export function getMenus() { export function getMenus() {
let menu = sessionStorage.getItem(menuKey); let menu = sessionStorage.getItem(menuKey);
console.info(menu);
return menu ? JSON.parse(menu) : null; return menu ? JSON.parse(menu) : null;
} }

View File

@ -1,84 +0,0 @@
import request from '@/utils/request'
export function page(params:any){
return new Promise((resolve, reject) => {
request({
url: '/lowcode/generator/page',
method: 'get',
params: params
}).then((res:any) => {
resolve(res.data)
}).catch((e:any) => {
reject(e)
})
})
}
export function del(id:String){
return new Promise((resolve, reject) => {
request({
url: '/lowcode/generator/delete/' + id,
method: 'delete',
}).then((res:any) => {
resolve(res.data)
}).catch((e:any) => {
reject(e)
})
})
}
export function save(data:any){
return new Promise((resolve, reject) => {
request({
url: '/lowcode/generator/save',
method: 'post',
data
}).then((res:any) => {
resolve(res.data)
}).catch((e:any) => {
reject(e)
})
})
}
export function execute(data:any){
return new Promise((resolve, reject) => {
request({
url: '/lowcode/generator/execute',
method: 'post',
data
}).then((res:any) => {
resolve(res.data)
}).catch((e:any) => {
reject(e)
})
})
}
export function tables(params:any){
return new Promise((resolve, reject) => {
request({
url: '/lowcode/generator/tables',
method: 'get',
params: params
}).then((res:any) => {
resolve(res.data)
}).catch((e:any) => {
reject(e)
})
})
}
export function columns(params:any){
return new Promise((resolve, reject) => {
request({
url: '/lowcode/generator/columns',
method: 'get',
params: params
}).then((res:any) => {
resolve(res.data)
}).catch((e:any) => {
reject(e)
})
})
}

View File

@ -1,7 +1,15 @@
<template> <template>
<router-view v-slot="{ Component }"> <!-- <router-view v-slot="{ Component }">-->
<keep-alive :include="$global.visitedViews.filter(it => it.meta.keepAlive).map(it => it.path.substr(it.path.lastIndexOf('/') + 1))"> <!-- <keep-alive :include="$global.visitedViews.filter(it => it.meta.keepAlive).map(it => it.path.substr(it.path.lastIndexOf('/') + 1))">-->
<component :is="Component" :key="$route.path" /> <!-- <component :is="Component" :key="$route.path" />-->
</keep-alive> <!-- </keep-alive>-->
</router-view> <!-- </router-view>-->
<!-- 保存include指定的组件可保存多个-->
<!-- <keep-alive :include="['A', 'B']">-->
<!-- <router-view></router-view>-->
<!-- </keep-alive>-->
<!-- 缓存所有路由组件-->
<keep-alive>
<router-view></router-view>
</keep-alive>
</template> </template>

View File

@ -1,17 +1,17 @@
// 权限 // 权限
const hasPermission = { const hasPermission = {
install(app:any) { install(app: any) {
app.directive('permission', { app.directive('permission', {
mounted(el:any, binding:any) { mounted(el: any, binding: any) {
if (binding.value) { if (binding.value) {
const permissionList = app.config.globalProperties.$global.user.authorities const permissionList = app.config.globalProperties.$global.user.authorities
if (permissionList && permissionList.length && !permissionList.includes(binding.value)) { if (permissionList && permissionList.length && !permissionList.includes(binding.value)) {
el.remove() el.remove()
}
}
} }
} })
}
})
} }
} }
export default hasPermission export default hasPermission

View File

@ -1,134 +1,153 @@
<script setup lang="ts"> <script setup lang="ts">
import { reactive, onMounted } from "vue" import {reactive, onMounted} from "vue"
import Table from '@/components/Table.vue' import Table from '@/components/Table.vue'
import { page } from "@/api/monitor/operLog" import {page} from "@/api/monitor/operLog"
const state = reactive({ const state = reactive({
loading: false, loading: false,
page: { page: {
current: 1, current: 1,
size: 10, size: 10,
total: 1, total: 1,
}, },
operation:{ operation: {
isShow: true, isShow: true,
width: '80' width: '80'
}, },
tableTitle: [ tableTitle: [
// {prop:'module',label:''}, // {prop:'module',label:''},
// {prop:'message',label:''}, // {prop:'message',label:''},
{prop:'uri',label:'请求URI'}, {prop: 'uri', label: '请求URI'},
{prop:'type',label:'操作类型'}, {prop: 'type', label: '操作类型'},
{prop:'takeUpTime',label:'耗时(ms)'}, {prop: 'takeUpTime', label: '耗时(ms)'},
{prop:'status',label:'状态', type:'dict',dictType: 'oper_log_status'}, {prop: 'status', label: '状态', type: 'dict', dictType: 'oper_log_status'},
{prop:'method',label:'操作方法'}, {prop: 'method', label: '操作方法'},
{prop:'ip',label:'请求IP'}, {prop: 'ip', label: '请求IP'},
// {prop:'userName',label:''}, // {prop:'userName',label:''},
{prop:'createTime',label:'创建时间'} {prop: 'createTime', label: '创建时间'}
], ],
tableData:[], tableData: [],
detailVisible: false, detailVisible: false,
detail:{}, detail: {
}) module:'',
status:'',
method:'',
takeUpTime:'',
message:'',
type:'',
userName:'',
uri:'',
ip:'',
createTime:'',
reqParam:'',
resParam:'',
unusual:''
},
})
onMounted(()=>{ onMounted(() => {
operLogPage() operLogPage()
}) })
function operLogPage(){ function operLogPage() {
state.loading = true; state.loading = true;
page(state.page).then((res:any)=>{ page(state.page).then((res: any) => {
if(res){ if (res) {
state.loading = false; state.loading = false;
state.tableData = res.result.records; state.tableData = res.result.records;
state.page.current = res.result.current; state.page.current = res.result.current;
state.page.size = res.result.size; state.page.size = res.result.size;
state.page.total = res.result.total; state.page.total = res.result.total;
}
})
}
function onSizeChange(e){
state.page.size = e;
operLogPage();
}
function onCurrentChange(e){
state.page.current = e;
operLogPage();
}
function onDetail(val:any){
state.detail = val.column.row;
state.detailVisible = true;
}
function setCellColor(e, callback){
/**
* e.row表格那一行的数据
* e.column表格单元格那一列的信息
*/
if(e.row.status == '失败' && e.column.property === 'status'){
callback({color: 'var(--delete)', fontWeight: '700'});
} else if(e.column.property === 'takeUpTime'){
callback({color: 'var(--delete)'});
} else {
callback({});
} }
})
}
function onSizeChange(e) {
state.page.size = e;
operLogPage();
}
function onCurrentChange(e) {
state.page.current = e;
operLogPage();
}
function onDetail(val: any) {
state.detail = val.column.row;
state.detailVisible = true;
}
function setCellColor(e, callback) {
/**
* e.row表格那一行的数据
* e.column表格单元格那一列的信息
*/
if (e.row.status == '失败' && e.column.property === 'status') {
callback({color: 'var(--delete)', fontWeight: '700'});
} else if (e.column.property === 'takeUpTime') {
callback({color: 'var(--delete)'});
} else {
callback({});
} }
}
</script> </script>
<template> <template>
<div class="operlog-container"> <div class="operlog-container">
<Table :data="state.tableData" :column="state.tableTitle" :operation="state.operation" :page="state.page" :loading="state.loading" <Table :data="state.tableData" :column="state.tableTitle" :operation="state.operation" :page="state.page"
@onSizeChange="onSizeChange" @onCurrentChange="onCurrentChange" @setCellColor="setCellColor"> :loading="state.loading"
@onSizeChange="onSizeChange" @onCurrentChange="onCurrentChange" @setCellColor="setCellColor">
<template #column="scope"> <template #column="scope">
<el-button @click="onDetail(scope)" link style="color:var(--theme); padding:0;">详情</el-button> <el-button @click="onDetail(scope)" link style="color:var(--theme); padding:0;">详情</el-button>
</template> </template>
</Table> </Table>
<el-dialog v-model="state.detailVisible" title="日志详情" :show-close="false" width="60%"> <el-dialog v-model="state.detailVisible" title="日志详情" :show-close="false" width="60%">
<el-descriptions :column="3" border> <el-descriptions :column="3" border>
<el-descriptions-item label-align="right" label="功能模块" :min-width="80">{{state.detail.module}}</el-descriptions-item> <el-descriptions-item label-align="right" label="功能模块" :min-width="80">{{ state.detail.module }}
</el-descriptions-item>
<el-descriptions-item label-align="right" label="操作状态"> <el-descriptions-item label-align="right" label="操作状态">
<el-tag v-if="state.detail.status == '1'" type="danger"></el-tag> <el-tag v-if="state.detail.status == '1'" type="danger"></el-tag>
<el-tag v-else type="success">成功</el-tag> <el-tag v-else type="success">成功</el-tag>
</el-descriptions-item> </el-descriptions-item>
<el-descriptions-item label-align="right" label="耗时"> <el-descriptions-item label-align="right" label="耗时">
<span style="color:red;">{{state.detail.takeUpTime}} ms</span> <span style="color:red;">{{ state.detail.takeUpTime }} ms</span>
</el-descriptions-item> </el-descriptions-item>
<el-descriptions-item label-align="right" label="操作描述">{{state.detail.message}}</el-descriptions-item> <el-descriptions-item label-align="right" label="操作描述">{{ state.detail.message }}</el-descriptions-item>
<el-descriptions-item label-align="right" label="操作类型"> <el-descriptions-item label-align="right" label="操作类型">
<el-tag v-if="state.detail.type == 'SELECT'">{{state.detail.type}}</el-tag> <el-tag v-if="state.detail.type == 'SELECT'">{{ state.detail.type }}</el-tag>
<el-tag v-else-if="state.detail.type == 'INSERT'" type="success">{{state.detail.type}}</el-tag> <el-tag v-else-if="state.detail.type == 'INSERT'" type="success">{{ state.detail.type }}</el-tag>
<el-tag v-else-if="state.detail.type == 'UPDATE'" type="warning">{{state.detail.type}}</el-tag> <el-tag v-else-if="state.detail.type == 'UPDATE'" type="warning">{{ state.detail.type }}</el-tag>
<el-tag v-else-if="state.detail.type == 'DELETE'" type="danger">{{state.detail.type}}</el-tag> <el-tag v-else-if="state.detail.type == 'DELETE'" type="danger">{{ state.detail.type }}</el-tag>
<el-tag v-else type="info">{{state.detail.type}}</el-tag> <el-tag v-else type="info">{{ state.detail.type }}</el-tag>
</el-descriptions-item>
<el-descriptions-item label-align="right" label="操作用户">{{ state.detail.userName }}</el-descriptions-item>
<el-descriptions-item label-align="right" label="请求URL">{{ state.detail.uri }}</el-descriptions-item>
<el-descriptions-item label-align="right" label="请求IP">{{ state.detail.ip }}</el-descriptions-item>
<el-descriptions-item label-align="right" label="创建时间">{{ state.detail.createTime }}</el-descriptions-item>
<el-descriptions-item label-align="right" :span="3" label="操作方法">{{ state.detail.method }}
</el-descriptions-item> </el-descriptions-item>
<el-descriptions-item label-align="right" label="操作用户">{{state.detail.userName}}</el-descriptions-item>
<el-descriptions-item label-align="right" label="请求URL">{{state.detail.uri}}</el-descriptions-item>
<el-descriptions-item label-align="right" label="请求IP">{{state.detail.ip}}</el-descriptions-item>
<el-descriptions-item label-align="right" label="创建时间">{{state.detail.createTime}}</el-descriptions-item>
<el-descriptions-item label-align="right" :span="3" label="操作方法">{{state.detail.method}}</el-descriptions-item>
<el-descriptions-item label-align="right" :span="3" label="请求参数"> <el-descriptions-item label-align="right" :span="3" label="请求参数">
<div class="detail-text scroll-div">{{state.detail.reqParam}}</div> <div class="detail-text scroll-div">{{ state.detail.reqParam }}</div>
</el-descriptions-item> </el-descriptions-item>
<el-descriptions-item v-if="state.detail.status == '0'" label-align="right" :span="3" label="响应参数"> <el-descriptions-item v-if="state.detail.status == '0'" label-align="right" :span="3" label="响应参数">
<div class="detail-text scroll-div">{{state.detail.resParam}}</div> <div class="detail-text scroll-div">{{ state.detail.resParam }}</div>
</el-descriptions-item> </el-descriptions-item>
<el-descriptions-item v-if="state.detail.status == '1'" label-align="right" :span="3" label="异常信息"> <el-descriptions-item v-if="state.detail.status == '1'" label-align="right" :span="3" label="异常信息">
<div class="detail-text scroll-div">{{state.detail.unusual}}</div> <div class="detail-text scroll-div">{{ state.detail.unusual }}</div>
</el-descriptions-item> </el-descriptions-item>
</el-descriptions> </el-descriptions>
</el-dialog> </el-dialog>
</div> </div>
</template> </template>
<style lang="scss" scoped> <style lang="scss" scoped>
.operlog-container{ .operlog-container {
.detail-text{ .detail-text {
max-height: 400px; max-height: 400px;
overflow: auto; overflow: auto;
}
.el-descriptions__label{
width: 80px;
}
} }
.el-descriptions__label {
width: 80px;
}
}
</style> </style>

View File

@ -225,7 +225,7 @@
</template> </template>
</Table> </Table>
<el-dialog title="角色信息" v-model="form.roleVisible" :show-close="false" width="40%"> <el-dialog title="角色信息" v-model="form.roleVisible" :show-close="false" width="40%">
<el-form :model="form.roleForm" ref="formRef" :rules="rules" label-width="80px" status-icon> <el-form :model="form.roleForm" ref="formRef" label-width="80px" status-icon>
<el-form-item label="名称" prop="name" :rules="[{required: true,message:'请输入名称',trigger: 'blur'}]"> <el-form-item label="名称" prop="name" :rules="[{required: true,message:'请输入名称',trigger: 'blur'}]">
<el-input v-model="form.roleForm.name" placeholder="请输入名称" style="width: 100%"/> <el-input v-model="form.roleForm.name" placeholder="请输入名称" style="width: 100%"/>
</el-form-item> </el-form-item>
@ -258,7 +258,7 @@
<template #footer> <template #footer>
<span class="dialog-footer"> <span class="dialog-footer">
<el-button @click="auth.authVisible = false">取消</el-button> <el-button @click="auth.authVisible = false">取消</el-button>
<el-button type="primary" @click="onAuthSubmit(authRef)"></el-button> <el-button type="primary" @click="onAuthSubmit()"></el-button>
</span> </span>
</template> </template>
</el-dialog> </el-dialog>

View File

@ -1,7 +1,8 @@
{ {
"files": [], "files": [],
"compilerOptions": { "compilerOptions": {
"types": ["vite/client"] "types": ["vite/client"],
"noImplicitAny": false
}, },
"include": [ "include": [
"src/**/*" "src/**/*"

View File

@ -1,7 +1,7 @@
{ {
"extends": "@tsconfig/node20/tsconfig.json", "extends": "@tsconfig/node20/tsconfig.json",
"include": [ "include": [
"vite.config.*", "vite.config.ts",
"vitest.config.*", "vitest.config.*",
"cypress.config.*", "cypress.config.*",
"nightwatch.conf.*", "nightwatch.conf.*",