mirror of
https://github.com/MCSManager/MCSManager.git
synced 2025-02-17 15:59:41 +08:00
Refactor: deafult size
This commit is contained in:
parent
a35873fc23
commit
10fdbe1b3b
@ -39,6 +39,12 @@ if (isDarkUI) {
|
|||||||
document.body.classList.add("app-light-theme");
|
document.body.classList.add("app-light-theme");
|
||||||
}
|
}
|
||||||
|
|
||||||
|
import { Button, Select, Input, Table } from "ant-design-vue";
|
||||||
|
|
||||||
|
[Button, Select, Input, Table].forEach((element) => {
|
||||||
|
element.props.size.default = "middle";
|
||||||
|
});
|
||||||
|
|
||||||
const { execute: reqUserInfo } = userInfoApi();
|
const { execute: reqUserInfo } = userInfoApi();
|
||||||
|
|
||||||
onMounted(async () => {
|
onMounted(async () => {
|
||||||
|
@ -1,7 +1,7 @@
|
|||||||
.app-light-theme {
|
.app-light-theme {
|
||||||
@extend .app-light-base-color;
|
@extend .app-light-base-color;
|
||||||
|
|
||||||
--background-color: rgb(240, 240, 240);
|
--background-color: rgb(245, 245, 245);
|
||||||
--background-color-white: var(--color-gray-1);
|
--background-color-white: var(--color-gray-1);
|
||||||
--drag-background-color: rgb(212, 212, 212);
|
--drag-background-color: rgb(212, 212, 212);
|
||||||
--new-card-list-background-color: rgba(201, 200, 200, 0.2);
|
--new-card-list-background-color: rgba(201, 200, 200, 0.2);
|
||||||
|
@ -61,7 +61,6 @@ const props = defineProps({
|
|||||||
.card-panel-content {
|
.card-panel-content {
|
||||||
flex-grow: 1;
|
flex-grow: 1;
|
||||||
color: var(--text-color);
|
color: var(--text-color);
|
||||||
font-size: 14px;
|
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
@ -69,6 +68,5 @@ const props = defineProps({
|
|||||||
overflow: hidden;
|
overflow: hidden;
|
||||||
zoom: 1;
|
zoom: 1;
|
||||||
word-break: break-all;
|
word-break: break-all;
|
||||||
font-size: 14px;
|
|
||||||
}
|
}
|
||||||
</style>
|
</style>
|
||||||
|
@ -45,15 +45,17 @@ const handleChangeMenu = (item: LeftMenuItem) => {
|
|||||||
<style lang="scss" scoped>
|
<style lang="scss" scoped>
|
||||||
.menu-body {
|
.menu-body {
|
||||||
height: 100%;
|
height: 100%;
|
||||||
display: flex;
|
|
||||||
.left-menu {
|
.left-menu {
|
||||||
width: 280px;
|
height: 100%;
|
||||||
|
float: left;
|
||||||
|
width: 240px;
|
||||||
padding: 12px 16px;
|
padding: 12px 16px;
|
||||||
background-color: var(--color-gray-4);
|
background-color: var(--color-gray-4);
|
||||||
border-top-left-radius: 4px;
|
border-top-left-radius: 4px;
|
||||||
border-bottom-left-radius: 4px;
|
border-bottom-left-radius: 4px;
|
||||||
}
|
}
|
||||||
.right-content {
|
.right-content {
|
||||||
|
overflow: hidden;
|
||||||
flex-grow: 1;
|
flex-grow: 1;
|
||||||
padding: 20px;
|
padding: 20px;
|
||||||
text-align: left;
|
text-align: left;
|
||||||
|
@ -303,17 +303,17 @@ export const ORIGIN_LAYOUT_CONFIG: PageLayoutConfig[] = [
|
|||||||
meta: {},
|
meta: {},
|
||||||
type: "UserInfo",
|
type: "UserInfo",
|
||||||
title: t("个人信息"),
|
title: t("个人信息"),
|
||||||
width: 12,
|
width: 8,
|
||||||
height: LayoutCardHeight.AUTO
|
height: LayoutCardHeight.MEDIUM
|
||||||
},
|
|
||||||
{
|
|
||||||
id: getRandomId(),
|
|
||||||
meta: {},
|
|
||||||
type: "EmptyCard",
|
|
||||||
title: "",
|
|
||||||
width: 12,
|
|
||||||
height: LayoutCardHeight.MINI
|
|
||||||
}
|
}
|
||||||
|
// {
|
||||||
|
// id: getRandomId(),
|
||||||
|
// meta: {},
|
||||||
|
// type: "EmptyCard",
|
||||||
|
// title: "",
|
||||||
|
// width: 12,
|
||||||
|
// height: LayoutCardHeight.MINI
|
||||||
|
// }
|
||||||
]
|
]
|
||||||
},
|
},
|
||||||
|
|
||||||
|
@ -155,12 +155,7 @@ const rowSelection = () => {};
|
|||||||
<a-col :span="24">
|
<a-col :span="24">
|
||||||
<CardPanel style="height: 100%">
|
<CardPanel style="height: 100%">
|
||||||
<template #body>
|
<template #body>
|
||||||
<a-table
|
<a-table :row-selection="rowSelection" :data-source="dataSource" :columns="columns">
|
||||||
size="middle"
|
|
||||||
:row-selection="rowSelection"
|
|
||||||
:data-source="dataSource"
|
|
||||||
:columns="columns"
|
|
||||||
>
|
|
||||||
<template #bodyCell="{ column, record }">
|
<template #bodyCell="{ column, record }">
|
||||||
<template v-if="column.key === 'action'">
|
<template v-if="column.key === 'action'">
|
||||||
<a-dropdown>
|
<a-dropdown>
|
||||||
|
@ -187,12 +187,7 @@ breadcrumbs.push({
|
|||||||
</a-breadcrumb-item>
|
</a-breadcrumb-item>
|
||||||
</a-breadcrumb>
|
</a-breadcrumb>
|
||||||
</div>
|
</div>
|
||||||
<a-table
|
<a-table :row-selection="rowSelection" :data-source="dataSource" :columns="columns">
|
||||||
size="middle"
|
|
||||||
:row-selection="rowSelection"
|
|
||||||
:data-source="dataSource"
|
|
||||||
:columns="columns"
|
|
||||||
>
|
|
||||||
<!-- eslint-disable-next-line vue/no-unused-vars -->
|
<!-- eslint-disable-next-line vue/no-unused-vars -->
|
||||||
<template #bodyCell="{ column, record }">
|
<template #bodyCell="{ column, record }">
|
||||||
<template v-if="column.key === 'action'">
|
<template v-if="column.key === 'action'">
|
||||||
|
@ -98,7 +98,7 @@ const columns = computed(() => {
|
|||||||
<a-col :span="24">
|
<a-col :span="24">
|
||||||
<CardPanel style="height: 100%">
|
<CardPanel style="height: 100%">
|
||||||
<template #body>
|
<template #body>
|
||||||
<a-table size="middle" :data-source="dataSource" :columns="columns">
|
<a-table :data-source="dataSource" :columns="columns">
|
||||||
<template #bodyCell="{ column }">
|
<template #bodyCell="{ column }">
|
||||||
<template v-if="column.key === 'action'">
|
<template v-if="column.key === 'action'">
|
||||||
<a-button danger>
|
<a-button danger>
|
||||||
|
@ -1,14 +1,12 @@
|
|||||||
<script setup lang="ts">
|
<script setup lang="ts">
|
||||||
import CardPanel from "@/components/CardPanel.vue";
|
|
||||||
import DataStatistic from "@/components/DataStatistic.vue";
|
|
||||||
import LeftMenusPanel from "@/components/LeftMenusPanel.vue";
|
import LeftMenusPanel from "@/components/LeftMenusPanel.vue";
|
||||||
import { t } from "@/lang/i18n";
|
import { t } from "@/lang/i18n";
|
||||||
import { useAppStateStore } from "@/stores/useAppStateStore";
|
import { useAppStateStore } from "@/stores/useAppStateStore";
|
||||||
import type { LayoutCard } from "@/types/index";
|
import type { LayoutCard } from "@/types/index";
|
||||||
import { MenuOutlined, ProjectOutlined, RobotOutlined } from "@ant-design/icons-vue";
|
import { ProjectOutlined, RobotOutlined } from "@ant-design/icons-vue";
|
||||||
import type { UnwrapRef } from "vue";
|
|
||||||
import { reactive, toRaw } from "vue";
|
import { reactive, toRaw } from "vue";
|
||||||
const { state } = useAppStateStore();
|
const { state } = useAppStateStore();
|
||||||
|
|
||||||
const props = defineProps<{
|
const props = defineProps<{
|
||||||
card: LayoutCard;
|
card: LayoutCard;
|
||||||
}>();
|
}>();
|
||||||
@ -50,8 +48,6 @@ const onSubmit = () => {
|
|||||||
};
|
};
|
||||||
const labelCol = { style: { width: "150px" } };
|
const labelCol = { style: { width: "150px" } };
|
||||||
const wrapperCol = { span: 14 };
|
const wrapperCol = { span: 14 };
|
||||||
|
|
||||||
const userInfo = state.userInfo;
|
|
||||||
</script>
|
</script>
|
||||||
|
|
||||||
<template>
|
<template>
|
||||||
@ -98,7 +94,9 @@ const userInfo = state.userInfo;
|
|||||||
</a-form-item>
|
</a-form-item>
|
||||||
</a-form>
|
</a-form>
|
||||||
</template>
|
</template>
|
||||||
<template #api>BBB</template>
|
<template #api>
|
||||||
|
{{ state.userInfo }}
|
||||||
|
</template>
|
||||||
</LeftMenusPanel>
|
</LeftMenusPanel>
|
||||||
</div>
|
</div>
|
||||||
</template>
|
</template>
|
||||||
|
Loading…
Reference in New Issue
Block a user