mirror of
https://gitee.com/log4j/pig-ui.git
synced 2024-12-22 21:22:33 +08:00
'admin-21.03.02:优化菜单管理、tagsView风格'
This commit is contained in:
parent
41e87ced71
commit
a0201ee678
@ -8,7 +8,7 @@
|
||||
<i class="iconfont icon-webicon318 layout-navbars-tagsview-ul-li-iconfont font14" v-if="isActive(v.path)"></i>
|
||||
<i class="layout-navbars-tagsview-ul-li-iconfont" :class="v.meta.icon"
|
||||
v-if="!isActive(v.path) && getThemeConfig.isTagsviewIcon"></i>
|
||||
<span :class="{'is-active-four': v.meta.isAffix}">{{v.meta.title}}</span>
|
||||
<span>{{v.meta.title}}</span>
|
||||
<template v-if="isActive(v.path)">
|
||||
<i class="el-icon-refresh-right ml5" @click="refreshCurrentTagsView(v.path)"></i>
|
||||
<i class="el-icon-close layout-navbars-tagsview-ul-li-icon layout-icon-active" v-if="!v.meta.isAffix"
|
||||
@ -414,7 +414,7 @@ export default {
|
||||
margin-right: 0 !important;
|
||||
border: none !important;
|
||||
position: relative;
|
||||
border-radius: 0 !important;
|
||||
border-radius: 3px !important;
|
||||
.layout-icon-active {
|
||||
display: none;
|
||||
}
|
||||
@ -426,57 +426,8 @@ export default {
|
||||
}
|
||||
}
|
||||
.is-active {
|
||||
border-top-left-radius: 8px !important;
|
||||
border-top-right-radius: 8px !important;
|
||||
position: relative;
|
||||
z-index: 1;
|
||||
span {
|
||||
position: relative;
|
||||
&::before,
|
||||
&::after {
|
||||
content: "";
|
||||
position: absolute;
|
||||
bottom: 0px;
|
||||
width: 10px;
|
||||
height: 10px;
|
||||
background: var(--color-primary);
|
||||
z-index: 1;
|
||||
}
|
||||
&::before {
|
||||
left: -36px;
|
||||
}
|
||||
&::after {
|
||||
right: -51px;
|
||||
}
|
||||
}
|
||||
.is-active-four {
|
||||
&::after {
|
||||
right: -40px;
|
||||
}
|
||||
}
|
||||
&::before,
|
||||
&::after {
|
||||
content: "";
|
||||
position: absolute;
|
||||
bottom: 1px;
|
||||
width: 10px;
|
||||
height: 10px;
|
||||
background: white;
|
||||
z-index: 2;
|
||||
}
|
||||
&::before {
|
||||
left: -10px;
|
||||
transform: rotate(-4deg);
|
||||
border-bottom-right-radius: 10px;
|
||||
}
|
||||
&::after {
|
||||
right: -10px;
|
||||
transform: rotate(4deg) !important;
|
||||
border-bottom-left-radius: 10px;
|
||||
}
|
||||
&:hover {
|
||||
background: var(--color-primary) !important;
|
||||
}
|
||||
background: none !important;
|
||||
color: var(--color-primary) !important;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
@ -131,7 +131,7 @@ export const filterList = [
|
||||
img:
|
||||
"http://www.sznews.com/photo/pic/2020-08/12/a08d6eb0-1d53-4f76-a313-ad3e5d701f98.jpg",
|
||||
title:
|
||||
"记者手记:可可西里,“挪”向“藏羚羊大产房”的14个半小时 记者手记:可可西里,“挪”向“藏羚羊大产房”的14个半小时",
|
||||
"记者手记:可可西里,“挪”向“藏羚羊大产房”的14个半小时",
|
||||
evaluate: (Math.random() * 10).toFixed(2),
|
||||
collection: (Math.random() * 100).toFixed(2),
|
||||
price: (Math.random() * 10).toFixed(2),
|
||||
|
@ -4,27 +4,27 @@
|
||||
<div class="system-menu-form">
|
||||
<el-form :model="ruleForm" size="small" label-width="80px">
|
||||
<el-row :gutter="35">
|
||||
<el-col :xs="24" :sm="12" :md="12" :lg="12" :xl="8" class="mb20">
|
||||
<el-col :xs="24" :sm="12" :md="12" :lg="12" :xl="12" class="mb20">
|
||||
<el-form-item label="菜单名称">
|
||||
<el-input v-model="ruleForm.meta.title" placeholder="请输入菜单名称" clearable></el-input>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :xs="24" :sm="12" :md="12" :lg="12" :xl="8" class="mb20">
|
||||
<el-col :xs="24" :sm="12" :md="12" :lg="12" :xl="12" class="mb20">
|
||||
<el-form-item label="路由名称">
|
||||
<el-input v-model="ruleForm.name" placeholder="路由名称(路由中的name值)" clearable></el-input>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :xs="24" :sm="12" :md="12" :lg="12" :xl="8" class="mb20">
|
||||
<el-col :xs="24" :sm="12" :md="12" :lg="12" :xl="12" class="mb20">
|
||||
<el-form-item label="菜单图标">
|
||||
<el-input v-model="ruleForm.meta.icon" placeholder="请输入菜单图标" clearable></el-input>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :xs="24" :sm="12" :md="12" :lg="12" :xl="8" class="mb20">
|
||||
<el-col :xs="24" :sm="12" :md="12" :lg="12" :xl="12" class="mb20">
|
||||
<el-form-item label="组件地址">
|
||||
<el-input v-model="ruleForm.component" placeholder="组件地址" clearable></el-input>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :xs="24" :sm="12" :md="12" :lg="12" :xl="8" class="mb20">
|
||||
<el-col :xs="24" :sm="12" :md="12" :lg="12" :xl="12" class="mb20">
|
||||
<el-form-item label="是否隐藏">
|
||||
<el-select v-model="ruleForm.meta.isHide" placeholder="请选择是否隐藏" clearable class="w100">
|
||||
<el-option label="是" value="true"></el-option>
|
||||
@ -32,7 +32,7 @@
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :xs="24" :sm="12" :md="12" :lg="12" :xl="8" class="mb20">
|
||||
<el-col :xs="24" :sm="12" :md="12" :lg="12" :xl="12" class="mb20">
|
||||
<el-form-item label="是否缓存">
|
||||
<el-select v-model="ruleForm.meta.isKeepAlive" placeholder="请选择是否缓存" clearable class="w100">
|
||||
<el-option label="是" value="true"></el-option>
|
||||
@ -40,7 +40,7 @@
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :xs="24" :sm="12" :md="12" :lg="12" :xl="8" class="mb20">
|
||||
<el-col :xs="24" :sm="12" :md="12" :lg="12" :xl="12" class="mb20">
|
||||
<el-form-item label="是否固定">
|
||||
<el-select v-model="ruleForm.meta.isAffix" placeholder="请选择是否固定" clearable class="w100">
|
||||
<el-option label="是" value="true"></el-option>
|
||||
@ -48,7 +48,7 @@
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :xs="24" :sm="12" :md="12" :lg="12" :xl="8" class="mb20">
|
||||
<el-col :xs="24" :sm="12" :md="12" :lg="12" :xl="12" class="mb20">
|
||||
<el-form-item label="是否外链">
|
||||
<el-select v-model="ruleForm.isLink" placeholder="请选择是否外链" clearable class="w100"
|
||||
:disabled="ruleForm.meta.isIframe === 'true'">
|
||||
@ -57,7 +57,7 @@
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :xs="24" :sm="12" :md="12" :lg="12" :xl="8" class="mb20">
|
||||
<el-col :xs="24" :sm="12" :md="12" :lg="12" :xl="12" class="mb20">
|
||||
<el-form-item label="是否内嵌">
|
||||
<el-select v-model="ruleForm.meta.isIframe" placeholder="请选择是否iframe" clearable class="w100"
|
||||
@change="onSelectIframeChange">
|
||||
@ -66,19 +66,19 @@
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :xs="24" :sm="12" :md="12" :lg="12" :xl="8" class="mb20">
|
||||
<el-col :xs="24" :sm="12" :md="12" :lg="12" :xl="12" class="mb20">
|
||||
<el-form-item label="链接地址">
|
||||
<el-input v-model="ruleForm.meta.isLink" placeholder="外链/内嵌时链接地址(http:xxx.com)" clearable
|
||||
:disabled="ruleForm.isLink === '' || ruleForm.isLink === 'false'">
|
||||
</el-input>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :xs="24" :sm="12" :md="12" :lg="12" :xl="8" class="mb20">
|
||||
<el-col :xs="24" :sm="12" :md="12" :lg="12" :xl="12" class="mb20">
|
||||
<el-form-item label="权限标识">
|
||||
<el-input v-model="ruleForm.meta.auth" placeholder="路由权限标识(多个请用逗号隔开)" clearable></el-input>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :xs="24" :sm="12" :md="12" :lg="12" :xl="8" class="mb20">
|
||||
<el-col :xs="24" :sm="12" :md="12" :lg="12" :xl="12" class="mb20">
|
||||
<el-form-item label="菜单排序">
|
||||
<el-input v-model="ruleForm.menuSort" placeholder="菜单排序" clearable></el-input>
|
||||
</el-form-item>
|
||||
|
@ -4,27 +4,27 @@
|
||||
<div class="system-menu-form">
|
||||
<el-form :model="ruleForm" size="small" label-width="80px">
|
||||
<el-row :gutter="35">
|
||||
<el-col :xs="24" :sm="12" :md="12" :lg="12" :xl="8" class="mb20">
|
||||
<el-col :xs="24" :sm="12" :md="12" :lg="12" :xl="12" class="mb20">
|
||||
<el-form-item label="菜单名称">
|
||||
<el-input v-model="ruleForm.meta.title" placeholder="请输入菜单名称" clearable></el-input>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :xs="24" :sm="12" :md="12" :lg="12" :xl="8" class="mb20">
|
||||
<el-col :xs="24" :sm="12" :md="12" :lg="12" :xl="12" class="mb20">
|
||||
<el-form-item label="路由名称">
|
||||
<el-input v-model="ruleForm.name" placeholder="路由名称(路由中的name值)" clearable></el-input>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :xs="24" :sm="12" :md="12" :lg="12" :xl="8" class="mb20">
|
||||
<el-col :xs="24" :sm="12" :md="12" :lg="12" :xl="12" class="mb20">
|
||||
<el-form-item label="菜单图标">
|
||||
<el-input v-model="ruleForm.meta.icon" placeholder="请输入菜单图标" clearable></el-input>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :xs="24" :sm="12" :md="12" :lg="12" :xl="8" class="mb20">
|
||||
<el-col :xs="24" :sm="12" :md="12" :lg="12" :xl="12" class="mb20">
|
||||
<el-form-item label="组件地址">
|
||||
<el-input v-model="ruleForm.component" placeholder="组件地址" clearable></el-input>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :xs="24" :sm="12" :md="12" :lg="12" :xl="8" class="mb20">
|
||||
<el-col :xs="24" :sm="12" :md="12" :lg="12" :xl="12" class="mb20">
|
||||
<el-form-item label="是否隐藏">
|
||||
<el-select v-model="ruleForm.meta.isHide" placeholder="请选择是否隐藏" clearable class="w100">
|
||||
<el-option label="是" value="true"></el-option>
|
||||
@ -32,7 +32,7 @@
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :xs="24" :sm="12" :md="12" :lg="12" :xl="8" class="mb20">
|
||||
<el-col :xs="24" :sm="12" :md="12" :lg="12" :xl="12" class="mb20">
|
||||
<el-form-item label="是否缓存">
|
||||
<el-select v-model="ruleForm.meta.isKeepAlive" placeholder="请选择是否缓存" clearable class="w100">
|
||||
<el-option label="是" value="true"></el-option>
|
||||
@ -40,7 +40,7 @@
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :xs="24" :sm="12" :md="12" :lg="12" :xl="8" class="mb20">
|
||||
<el-col :xs="24" :sm="12" :md="12" :lg="12" :xl="12" class="mb20">
|
||||
<el-form-item label="是否固定">
|
||||
<el-select v-model="ruleForm.meta.isAffix" placeholder="请选择是否固定" clearable class="w100">
|
||||
<el-option label="是" value="true"></el-option>
|
||||
@ -48,7 +48,7 @@
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :xs="24" :sm="12" :md="12" :lg="12" :xl="8" class="mb20">
|
||||
<el-col :xs="24" :sm="12" :md="12" :lg="12" :xl="12" class="mb20">
|
||||
<el-form-item label="是否外链">
|
||||
<el-select v-model="ruleForm.isLink" placeholder="请选择是否外链" clearable class="w100"
|
||||
:disabled="ruleForm.meta.isIframe === 'true'">
|
||||
@ -57,7 +57,7 @@
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :xs="24" :sm="12" :md="12" :lg="12" :xl="8" class="mb20">
|
||||
<el-col :xs="24" :sm="12" :md="12" :lg="12" :xl="12" class="mb20">
|
||||
<el-form-item label="是否内嵌">
|
||||
<el-select v-model="ruleForm.meta.isIframe" placeholder="请选择是否iframe" clearable class="w100"
|
||||
@change="onSelectIframeChange">
|
||||
@ -66,19 +66,19 @@
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :xs="24" :sm="12" :md="12" :lg="12" :xl="8" class="mb20">
|
||||
<el-col :xs="24" :sm="12" :md="12" :lg="12" :xl="12" class="mb20">
|
||||
<el-form-item label="链接地址">
|
||||
<el-input v-model="ruleForm.meta.isLink" placeholder="外链/内嵌时链接地址(http:xxx.com)" clearable
|
||||
:disabled="ruleForm.isLink === '' || ruleForm.isLink === 'false'">
|
||||
</el-input>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :xs="24" :sm="12" :md="12" :lg="12" :xl="8" class="mb20">
|
||||
<el-col :xs="24" :sm="12" :md="12" :lg="12" :xl="12" class="mb20">
|
||||
<el-form-item label="权限标识">
|
||||
<el-input v-model="ruleForm.meta.auth" placeholder="路由权限标识(多个请用逗号隔开)" clearable></el-input>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :xs="24" :sm="12" :md="12" :lg="12" :xl="8" class="mb20">
|
||||
<el-col :xs="24" :sm="12" :md="12" :lg="12" :xl="12" class="mb20">
|
||||
<el-form-item label="菜单排序">
|
||||
<el-input v-model="ruleForm.menuSort" placeholder="菜单排序" clearable></el-input>
|
||||
</el-form-item>
|
||||
|
@ -56,7 +56,7 @@ export default {
|
||||
num: `00${i + 1}`,
|
||||
name: (Math.round(Math.random() * 20901) + 19968).toString(16),
|
||||
photo:
|
||||
"https://dss2.bdstatic.com/70cFvnSh_Q1YnxGkpoWK1HF6hhy/it/u=3142181265,1044547961&fm=11&gp=0.jpg",
|
||||
"https://ss1.bdstatic.com/70cFvXSh_Q1YnxGkpoWK1HF6hhy/it/u=1633081619,2004077072&fm=26&gp=0.jpg",
|
||||
phone: Math.floor(Math.random() * 10000000000),
|
||||
email: `${Math.floor(Math.random() * 1000)}@qq.com`,
|
||||
sex: i % 2 === 0 ? "男" : "女",
|
||||
|
Loading…
Reference in New Issue
Block a user