mirror of
https://gitee.com/log4j/pig-ui.git
synced 2024-12-22 21:22:33 +08:00
'admin-21.02.26:添加代码注释、优化主题样式、添加form手机适配样式'
This commit is contained in:
lyt
parent
8e91b7e189
commit
59a108e490
@ -507,7 +507,7 @@ export function setBackEndControlRoutesFun(res: any) {
|
||||
setAddRoute() // 添加动态路由
|
||||
setFilterMenu() // 过滤权限菜单
|
||||
setCacheTagsViewRoutes() // 添加 keepAlive 缓存
|
||||
window.location.href = window.location.href
|
||||
window.location.href = window.location.href // 防止页面刷新时，出现空白或404
|
||||
}
|
||||
|
||||
// 后端控制路由，后端路由 component 转换
|
||||
|
||||
@ -570,40 +570,40 @@
|
||||
------------------------------- */
|
||||
// success
|
||||
.el-alert--success.is-light {
|
||||
@include Alert(success, success-light-9, success-light-8);
|
||||
@include Alert(success, success-light-9, success-light-7);
|
||||
}
|
||||
.el-alert--success.is-dark {
|
||||
@include Alert(whites, success, success-light-8);
|
||||
@include Alert(whites, success, success-light-7);
|
||||
}
|
||||
.el-alert--success.is-light .el-alert__description {
|
||||
color: set-color(success);
|
||||
}
|
||||
// warning
|
||||
.el-alert--warning.is-light {
|
||||
@include Alert(warning, warning-light-9, warning-light-8);
|
||||
@include Alert(warning, warning-light-9, warning-light-7);
|
||||
}
|
||||
.el-alert--warning.is-dark {
|
||||
@include Alert(whites, warning, warning-light-8);
|
||||
@include Alert(whites, warning, warning-light-7);
|
||||
}
|
||||
.el-alert--warning.is-light .el-alert__description {
|
||||
color: set-color(warning);
|
||||
}
|
||||
// info
|
||||
.el-alert--info.is-light {
|
||||
@include Alert(info, info-light-9, info-light-8);
|
||||
@include Alert(info, info-light-9, info-light-7);
|
||||
}
|
||||
.el-alert--info.is-dark {
|
||||
@include Alert(whites, info, info-light-8);
|
||||
@include Alert(whites, info, info-light-7);
|
||||
}
|
||||
.el-alert--info.is-light .el-alert__description {
|
||||
color: set-color(info);
|
||||
}
|
||||
// error
|
||||
.el-alert--error.is-light {
|
||||
@include Alert(danger, danger-light-9, danger-light-8);
|
||||
@include Alert(danger, danger-light-9, danger-light-7);
|
||||
}
|
||||
.el-alert--error.is-dark {
|
||||
@include Alert(whites, danger, danger-light-8);
|
||||
@include Alert(whites, danger, danger-light-7);
|
||||
}
|
||||
.el-alert--error.is-light .el-alert__description {
|
||||
color: set-color(danger);
|
||||
|
||||
13
src/theme/media/form.scss
Normal file
13
src/theme/media/form.scss
Normal file
@ -0,0 +1,13 @@
|
||||
@import './index.scss';
|
||||
|
||||
/* 页面宽度小于576px
|
||||
------------------------------- */
|
||||
@media screen and (max-width: $xs) {
|
||||
.el-form-item__label {
|
||||
width: 100% !important;
|
||||
text-align: left !important;
|
||||
}
|
||||
.el-form-item__content {
|
||||
margin-left: 0 !important;
|
||||
}
|
||||
}
|
||||
@ -5,3 +5,4 @@
|
||||
@import './tagsView.scss';
|
||||
@import './home.scss';
|
||||
@import './chart.scss';
|
||||
@import './form.scss';
|
||||
|
||||
@ -1,43 +1,105 @@
|
||||
// 布局配置
|
||||
export default {
|
||||
// 是否开启布局配置抽屉
|
||||
isDrawer: false,
|
||||
|
||||
/* 全局主题
|
||||
------------------------------- */
|
||||
// 默认 primary 颜色，请注意：需要同时修改 `/@/theme/common/var.scss` 对应的值
|
||||
primary: "#409eff",
|
||||
// 默认 success 颜色，请注意：需要同时修改 `/@/theme/common/var.scss` 对应的值
|
||||
success: "#67c23a",
|
||||
// 默认 info 颜色，请注意：需要同时修改 `/@/theme/common/var.scss` 对应的值
|
||||
info: "#909399",
|
||||
// 默认 warning 颜色，请注意：需要同时修改 `/@/theme/common/var.scss` 对应的值
|
||||
warning: "#e6a23c",
|
||||
// 默认 danger 颜色，请注意：需要同时修改 `/@/theme/common/var.scss` 对应的值
|
||||
danger: "#f56c6c",
|
||||
|
||||
/* 菜单 / 顶栏
|
||||
------------------------------- */
|
||||
// 默认顶栏导航背景颜色，请注意：需要同时修改 `/@/theme/common/var.scss` 对应的值
|
||||
topBar: "#ffffff",
|
||||
// 默认菜单导航背景颜色，请注意：需要同时修改 `/@/theme/common/var.scss` 对应的值
|
||||
menuBar: "#545c64",
|
||||
// 默认分栏菜单背景颜色，请注意：需要同时修改 `/@/theme/common/var.scss` 对应的值
|
||||
columnsMenuBar: '#545c64',
|
||||
// 默认顶栏导航字体颜色，请注意：需要同时修改 `/@/theme/common/var.scss` 对应的值
|
||||
topBarColor: "#606266",
|
||||
// 默认菜单导航字体颜色，请注意：需要同时修改 `/@/theme/common/var.scss` 对应的值
|
||||
menuBarColor: "#eaeaea",
|
||||
// 默认分栏菜单字体颜色，请注意：需要同时修改 `/@/theme/common/var.scss` 对应的值
|
||||
columnsMenuBarColor: '#e6e6e6',
|
||||
// 是否开启顶栏背景颜色渐变
|
||||
isTopBarColorGradual: false,
|
||||
// 是否开启菜单背景颜色渐变
|
||||
isMenuBarColorGradual: false,
|
||||
// 是否开启菜单字体背景高亮
|
||||
isMenuBarColorHighlight: false,
|
||||
// 是否开启菜单字体背景高亮
|
||||
|
||||
/* 界面设置
|
||||
------------------------------- */
|
||||
// 是否开启菜单水平折叠效果
|
||||
isCollapse: false,
|
||||
// 是否开启菜单手风琴效果
|
||||
isUniqueOpened: false,
|
||||
// 是否开启固定 Header
|
||||
isFixedHeader: false,
|
||||
// 初始化变量，用于更新菜单 el-scrollbar 的高度，请勿删除
|
||||
isFixedHeaderChange: false,
|
||||
// 是否开启经典布局分割菜单（仅经典布局生效）
|
||||
isClassicSplitMenu: false,
|
||||
// 是否开启自动锁屏
|
||||
isLockScreen: false,
|
||||
// 开启自动锁屏倒计时(s/秒)
|
||||
lockScreenTime: 30,
|
||||
|
||||
/* 界面显示
|
||||
------------------------------- */
|
||||
// 是否开启侧边栏 Logo
|
||||
isShowLogo: false,
|
||||
// 初始化变量，用于 el-scrollbar 的高度更新，请勿删除
|
||||
isShowLogoChange: false,
|
||||
// 是否开启 Breadcrumb
|
||||
isBreadcrumb: true,
|
||||
// 是否开启 Tagsview
|
||||
isTagsview: true,
|
||||
// 是否开启 Breadcrumb 图标
|
||||
isBreadcrumbIcon: false,
|
||||
// 是否开启 Tagsview 图标
|
||||
isTagsviewIcon: false,
|
||||
// 是否开启 TagsView 缓存
|
||||
isCacheTagsView: false,
|
||||
// 是否开启 TagsView 拖拽
|
||||
isSortableTagsView: true,
|
||||
// 是否开启 Footer 底部版权信息
|
||||
isFooter: false,
|
||||
// 是否开启灰色模式
|
||||
isGrayscale: false,
|
||||
// 是否开启色弱模式
|
||||
isInvert: false,
|
||||
// 是否开启水印
|
||||
isWartermark: false,
|
||||
// 水印文案
|
||||
wartermarkText: 'small@小柒',
|
||||
|
||||
/* 其它设置
|
||||
------------------------------- */
|
||||
// 默认 Tagsview 风格，可选 1、 tagsStyleOne 2、 tagsStyleTwo 3、 tagsStyleThree 4、 tagsStyleFour
|
||||
tagsStyle: 'tagsStyleOne',
|
||||
// 默认主页面切换动画，可选 1、 slideRight 2、 slideLeft 3、 opacitys
|
||||
animation: 'slideRight',
|
||||
// 默认分栏高亮风格，可选 1、 圆角 columnsRound 2、 卡片 columnsCard
|
||||
columnsAsideStyle: 'columnsRound',
|
||||
|
||||
/* 布局切换
|
||||
------------------------------- */
|
||||
// 默认布局，可选 1、默认 defaults 2、经典 classic 3、横向 transverse 4、分栏 columns
|
||||
layout: 'defaults',
|
||||
|
||||
/* 后端控制路由
|
||||
------------------------------- */
|
||||
// 是否开启后端控制路由
|
||||
isRequestRoutes: false
|
||||
}
|
||||
@ -1,6 +1,7 @@
|
||||
/**
|
||||
* 2020.11.29 lyt 整理
|
||||
* 工具类集合，适用于平时开发
|
||||
* 后期改成 xx.ts
|
||||
*/
|
||||
|
||||
// 小数或整数(不可以负数)
|
||||
|
||||
@ -1,20 +1,26 @@
|
||||
<template>
|
||||
<div>
|
||||
limitsBackEndEndPage
|
||||
<el-input v-model="val"></el-input>
|
||||
<el-alert title="温馨提示：1、此页面无法模拟后端控制路由，因为 `gitee` 上所请求的 `json` 菜单数据线上会出现跨域的情况（json地址：
|
||||
https://gitee.com/lyt-top/vue-admin-wonderful-images/raw/master/next/menu/testMenu.json）。2、本地接口请求文件位置：`/src/api/menu/index.ts`。
|
||||
3、拉取代码后本地请求查看后端控制页面路由效果：`/src/utils/themeConfig.ts`中开启（isRequestRoutes 为 true，则开启后端控制路由）。
|
||||
4、此页面效果只作为演示使用，若出现不可逆转的bug，请尝试 `F5` 刷新页面。5、默认启用的是 `前端控制路由`。" type="warning" :closable="false"></el-alert>
|
||||
<el-button type="primary" size="small" class="mt15" icon="el-icon-position" @click="onGoToFrontEndPage">立即前往前端控制路由
|
||||
</el-button>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script lang="ts">
|
||||
import { toRefs, reactive } from "vue";
|
||||
import { useRouter } from "vue-router";
|
||||
export default {
|
||||
name: "limitsBackEndEndPage",
|
||||
setup() {
|
||||
const state = reactive({
|
||||
val: "",
|
||||
});
|
||||
const router = useRouter();
|
||||
// 立即前往前端控制路由
|
||||
const onGoToFrontEndPage = () => {
|
||||
router.push("/limits/frontEnd/page");
|
||||
};
|
||||
return {
|
||||
...toRefs(state),
|
||||
onGoToFrontEndPage,
|
||||
};
|
||||
},
|
||||
};
|
||||
|
||||
Loading…
Reference in New Issue
Block a user