public/FastapiAdmin
1
0
Fork 0
mirror of https://github.com/fastapiadmin/FastapiAdmin.git synced 2026-09-22 05:02:57 +00:00
Code Issues Packages Projects Releases Wiki Activity

样式优化，.main-container滚动条：// height: calc(100vh - var(--header-height));

Browse Source 
height: 90px;
This commit is contained in:
zhangtao
2024-12-10 21:48:52 +08:00
parent 02e593f37c
commit 0a7d7ebcd6
13 changed files with 82 additions and 39 deletions
Download Patch File Download Diff File Expand all files Collapse all files
frontend/src/components/PageHeader.vue
+1 -1
View File
@@ -44,7 +44,7 @@ onMounted(() => getBreadcrumb());
<style lang="scss" scoped>
.page-header {
padding: 10px 0;
padding: 6px 0;
}
.page-header-title {
frontend/src/layouts/basicLayout.vue
+7 -6
View File
@@ -82,8 +82,7 @@
</a-layout-sider>
<!-- 主内容区 -->
<a-layout-content
class="content"
<a-layout-content class="content"
:class="{ collapsed: menuState.collapsed }"
>
<router-view v-slot="{ Component, route }">
@@ -258,7 +257,8 @@ onMounted(() => {
<style lang="scss" scoped>
.basic-layout {
min-height: 100vh;
font-size: 16px;
:deep(.ant-layout-header) {
background: #fff;
padding: 0;
@@ -326,7 +326,8 @@ onMounted(() => {
.main-container {
margin-top: var(--header-height);
height: calc(100vh - var(--header-height));
// height: calc(100vh - var(--header-height));
height: 90px;
display: flex;
flex-direction: row;
@@ -349,7 +350,7 @@ onMounted(() => {
color: var(--primary-color);
font-weight: 500;
}
}
}
}
.ant-layout-header {
@@ -371,7 +372,7 @@ onMounted(() => {
.content {
flex: 1;
padding: 24px;
padding: 20px;
background: var(--background-color);
overflow-y: auto; /* 确保垂直滚动条在需要时出现 */
}
frontend/src/style.css
+1 -1
View File
@@ -6,7 +6,7 @@
--font-weight-bold: 500;
/* 布局变量 */
--header-height: 69px;
--header-height: 60px;
--sider-width: 240px;
--collapsed-sider-width: 80px;
--transition-duration: 0.2s;
frontend/src/views/monitor/online/index.vue
+1 -1
View File
@@ -91,7 +91,7 @@ const columns = [
{ title: '登录地点', dataIndex: 'login_location', key: 'loginLocation', align: 'center', ellipsis: true },
{ title: '操作系统', dataIndex: 'os', key: 'os', align: 'center', ellipsis: true },
{ title: '浏览器', dataIndex: 'browser', key: 'browser', align: 'center', ellipsis: true },
{ title: '登录时间', dataIndex: 'login_time', key: 'loginTime', align: 'center', width: 180 },
{ title: '登录时间', dataIndex: 'login_time', key: 'loginTime', align: 'center', ellipsis: true, width: 180 },
{ title: '操作', dataIndex: 'operation', key: 'operation', align: 'center', width: 120 }
];
frontend/src/views/system/dept/index.vue
+14 -6
View File
@@ -301,40 +301,48 @@ const columns = reactive<TableColumnsType>([
title: '部门名称',
dataIndex: 'name',
align: 'center',
ellipsis: true,
key: 'name',
width: 160
// width: 160
},
{
title: '排序',
dataIndex: 'order',
key: 'order',
align: 'center',
width: 100
ellipsis: true,
// width: 100
},
{
title: '状态',
dataIndex: 'available',
key: 'available',
ellipsis: true,
align: 'center',
width: 100
// width: 100
},
{
title: '备注',
dataIndex: 'description',
key: 'description',
align: 'center'
ellipsis: true,
// align: 'center'
},
{
title: '创建时间',
dataIndex: 'created_at',
align: 'center',
key: 'created_at'
ellipsis: true,
key: 'created_at',
width: 200
},
{
title: '更新日期',
dataIndex: 'updated_at',
align: 'center',
key: 'created_at'
ellipsis: true,
key: 'created_at',
width: 200
},
{
title: '操作',
frontend/src/views/system/log/index.vue
+12 -6
View File
@@ -157,45 +157,51 @@ const columns: TableColumnsType = [
{
title: '请求地址',
dataIndex: 'request_path',
ellipsis: true,
align: 'center',
width: 200
// width: 200
},
{
title: '请求方法',
dataIndex: 'request_method',
ellipsis: true,
align: 'center',
width: 80
width: 120
},
{
title: 'IP地址',
dataIndex: 'request_ip',
ellipsis: true,
align: 'center',
width: 100
},
{
title: '浏览器',
dataIndex: 'request_browser',
ellipsis: true,
align: 'center',
width: 100
width: 120
},
{
title: '系统',
dataIndex: 'request_os',
ellipsis: true,
align: 'center',
width: 150
width: 120
},
{
title: '响应码',
dataIndex: 'response_code',
ellipsis: true,
align: 'center',
width: 80
width: 120
},
{
title: '描述',
dataIndex: 'description',
align: 'center',
ellipsis: true,
// width: 500
width: 120
},
{
title: '创建日期',
frontend/src/views/system/menu/index.vue
+10 -3
View File
@@ -416,40 +416,47 @@ const columns = reactive<TableColumnsType>([
title: '菜单名称',
dataIndex: 'name',
align: 'center',
ellipsis: true,
},
{
title: '图标',
dataIndex: 'icon',
align: 'center',
ellipsis: true,
},
{
title: '显示排序',
dataIndex: 'order',
align: 'center',
width: 80
ellipsis: true,
width: 100
},
{
title: '菜单类型',
dataIndex: 'type',
align: 'center',
width: 80
ellipsis: true,
width: 100
},
{
title: '权限标识',
dataIndex: 'permission',
ellipsis: true,
align: 'center',
},
{
title: '状态',
dataIndex: 'available',
ellipsis: true,
align: 'center',
width: 100
},
{
title: '备注',
dataIndex: 'description',
align: 'center',
ellipsis: true,
width: 200
width: 180
},
{
title: '操作',
frontend/src/views/system/notice/index.vue
+7 -1
View File
@@ -245,26 +245,31 @@ const columns: TableColumnsType = [
title: '序号',
dataIndex: 'index',
align: 'center',
ellipsis: true,
width: 80
},
{
title: '标题',
dataIndex: 'notice_title',
ellipsis: true,
align: 'center'
},
{
title: '类型',
dataIndex: 'notice_type',
ellipsis: true,
align: 'center'
},
{
title: '内容',
dataIndex: 'notice_content',
align: 'center'
align: 'center',
ellipsis: true,
},
{
title: '状态',
dataIndex: 'available',
ellipsis: true,
align: 'center'
},
{
@@ -293,6 +298,7 @@ const columns: TableColumnsType = [
dataIndex: 'operation',
align: 'center',
fixed: 'right',
ellipsis: true,
width: 150
}
];
frontend/src/views/system/position/index.vue
+6 -2
View File
@@ -227,21 +227,25 @@ const columns: TableColumnsType = [
title: '序号',
dataIndex: 'index',
align: 'center',
ellipsis: true,
width: 80
},
{
title: '名称',
dataIndex: 'name',
ellipsis: true,
align: 'center'
},
{
title: '排序',
dataIndex: 'order',
ellipsis: true,
align: 'center'
},
{
title: '状态',
dataIndex: 'available',
ellipsis: true,
align: 'center'
},
{
@@ -256,14 +260,14 @@ const columns: TableColumnsType = [
dataIndex: 'created_at',
align: 'center',
ellipsis: true,
// width: 120
width: 200
},
{
title: '更新日期',
dataIndex: 'updated_at',
align: 'center',
ellipsis: true,
// width: 120
width: 200
},
{
title: '操作',
frontend/src/views/system/role/index.vue
+10 -6
View File
@@ -225,47 +225,51 @@ const columns = reactive<TableColumnsType>([
title: '序号',
dataIndex: 'index',
align: 'center',
ellipsis: true,
width: 80
},
{
title: '名称',
dataIndex: 'name',
align: 'center',
// width: 80
ellipsis: true,
// width: 120
},
{
title: '排序',
dataIndex: 'order',
align: 'center',
width: 80
ellipsis: true,
// width: 120
},
{
title: '状态',
dataIndex: 'available',
align: 'center',
// width: 80
ellipsis: true,
// width: 120
},
{
title: '备注',
dataIndex: 'description',
align: 'center',
ellipsis: true,
width: 150
// width: 150
},
{
title: '创建日期',
dataIndex: 'created_at',
align: 'center',
ellipsis: true,
// width: 120
width: 200
},
{
title: '更新日期',
dataIndex: 'updated_at',
align: 'center',
ellipsis: true,
// width: 120
width: 200
},
{
title: '操作',
frontend/src/views/system/user/index.vue
+13 -6
View File
@@ -403,6 +403,7 @@ const columns = reactive<TableColumnsType>([
title: '序号',
dataIndex: 'index',
align: 'center',
ellipsis: true,
width: 80
},
{
@@ -410,7 +411,7 @@ const columns = reactive<TableColumnsType>([
dataIndex: 'username',
ellipsis: true,
align: 'center',
width: 80
width: 100
},
{
title: '姓名',
@@ -423,14 +424,15 @@ const columns = reactive<TableColumnsType>([
title: '是否超管',
dataIndex: 'is_superuser',
align: 'center',
width: 80
ellipsis: true,
width: 100
},
{
title: '部门',
dataIndex: 'dept',
ellipsis: true,
align: 'center',
width: 80
width: 100
},
{
title: '角色',
@@ -449,26 +451,30 @@ const columns = reactive<TableColumnsType>([
{
title: '邮箱',
dataIndex: 'email',
ellipsis: true,
align: 'center',
// width: 160
width: 160
},
{
title: '联系电话',
dataIndex: 'mobile',
align: 'center',
ellipsis: true,
width: 120
},
{
title: '性别',
dataIndex: 'gender',
align: 'center',
width: 80
ellipsis: true,
width: 100
},
{
title: '状态',
dataIndex: 'available',
align: 'center',
width: 80
ellipsis: true,
width: 100
},
{
title: '备注',
@@ -481,6 +487,7 @@ const columns = reactive<TableColumnsType>([
title: '操作',
dataIndex: 'operation',
fixed: 'right',
ellipsis: true,
align: 'center',
width: 150
}