feat: 样式调整
BIN
hx-ai-intelligent/public/asset/image/headerIcon.png
Normal file
After Width: | Height: | Size: 5.5 KiB |
@@ -44,7 +44,7 @@
|
||||
|
||||
<style lang="less" scoped>
|
||||
:deep(.ns-content) {
|
||||
padding-top: 80px !important;
|
||||
// padding-top: 80px !important;
|
||||
}
|
||||
#app {
|
||||
width: 100%;
|
||||
@@ -54,35 +54,41 @@
|
||||
:deep(.ns-left-menu .firstMenuItem-selected .ant-menu-title-content) {
|
||||
background: unset !important;
|
||||
}
|
||||
:deep(.ns-left-menu .ant-menu-item-selected .ant-menu-title-content) {
|
||||
color: #fff !important;
|
||||
background: @primary-color;
|
||||
border-radius: 2px;
|
||||
height: 40px;
|
||||
line-height: 40px;
|
||||
a {
|
||||
color: #ffffff !important;
|
||||
:deep(.ns-left-menu) {
|
||||
.ant-menu-item-active,
|
||||
.ant-submenu-item-active {
|
||||
background: #ecf3ff !important;
|
||||
}
|
||||
.ant-menu-item-selected .ant-menu-title-content {
|
||||
// color: #fff !important;
|
||||
background: @primary-color;
|
||||
border-radius: 12px;
|
||||
height: 40px;
|
||||
line-height: 40px;
|
||||
a {
|
||||
color: @white !important;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
:deep(.ant-menu-light.ant-menu-horizontal > .ant-menu-item:hover) {
|
||||
background: @primary-color;
|
||||
}
|
||||
:deep(.ant-menu-inline .ant-menu-submenu-title) {
|
||||
color: rgba(255, 255, 255, 0.9) !important;
|
||||
}
|
||||
// :deep(.ant-menu-inline .ant-menu-submenu-title) {
|
||||
// color: rgba(255, 255, 255, 0.9) !important;
|
||||
// }
|
||||
:deep(.ns-left-menu .ant-layout-sider-children .ant-menu-sub.ant-menu-inline) {
|
||||
position: relative;
|
||||
&::before {
|
||||
display: flex;
|
||||
width: 2px;
|
||||
height: calc(100% - 40px);
|
||||
position: absolute;
|
||||
top: 20px;
|
||||
left: 20px;
|
||||
content: '';
|
||||
background-color: rgba(255, 255, 255, 0.2);
|
||||
}
|
||||
// position: relative;
|
||||
// &::before {
|
||||
// display: flex;
|
||||
// width: 2px;
|
||||
// height: calc(100% - 40px);
|
||||
// position: absolute;
|
||||
// top: 20px;
|
||||
// left: 20px;
|
||||
// content: '';
|
||||
// background-color: rgba(255, 255, 255, 0.2);
|
||||
// }
|
||||
}
|
||||
|
||||
//*************************含tab的 list列表样式 */
|
||||
@@ -190,45 +196,3 @@
|
||||
}
|
||||
}
|
||||
</style>
|
||||
<style lang="less">
|
||||
// 列表弹框样式修改
|
||||
.listTableModal .ant-modal-title {
|
||||
font-weight: 600;
|
||||
}
|
||||
.listTableModal .ant-modal-body {
|
||||
padding: 16px !important;
|
||||
.ant-tabs-nav-wrap {
|
||||
padding: 0px;
|
||||
}
|
||||
.ns-list-table {
|
||||
border-left: 16px solid #e5ebf0;
|
||||
border-right: 16px solid #e5ebf0;
|
||||
border-bottom: 16px solid #e5ebf0;
|
||||
}
|
||||
}
|
||||
:deep(.ant-menu-submenu-title) {
|
||||
color: #ffffff !important;
|
||||
}
|
||||
</style>
|
||||
<style lang="less">
|
||||
//************************修改顶部菜单弹框样式
|
||||
.ant-menu-submenu-placement-bottomLeft {
|
||||
.ant-menu-submenu {
|
||||
background: rgb(3 24 53) !important;
|
||||
}
|
||||
|
||||
.ant-menu-sub {
|
||||
background: rgb(3 24 53) !important;
|
||||
}
|
||||
.ant-menu-title-content {
|
||||
color: #fff !important;
|
||||
.ns-icon {
|
||||
margin-right: 7px;
|
||||
transform: translateY(2px);
|
||||
}
|
||||
}
|
||||
.ant-menu-submenu-arrow {
|
||||
color: #fff !important;
|
||||
}
|
||||
}
|
||||
</style>
|
||||
|
@@ -26,6 +26,7 @@ export const appConfig = {
|
||||
baseRouter: '/parkingManage/parkingLotManage',
|
||||
themeConfig: {
|
||||
bgImageUrl: `${import.meta.env.VITE_PUBLIC_PATH}/asset/image/login/background.png`,
|
||||
logoLessUrl: `${import.meta.env.VITE_PUBLIC_PATH}/asset/image/headerIcon.png`,
|
||||
},
|
||||
// userCustomRouterGuard: (to, from, next, whiteNameList, authorizationStore, appConfig) => {
|
||||
// console.log({ to, from, next, whiteNameList, authorizationStore, appConfig }, 'routeConfig');
|
||||
@@ -37,8 +38,9 @@ export const appConfig = {
|
||||
headerSlotConfig: {
|
||||
component: 'NsSelectApi',
|
||||
componentProps: {
|
||||
style: { width: '200px' },
|
||||
style: { width: '200px', color: '#2778FF', marginRight: '10px' },
|
||||
api: '/carbon-smart/user/login/logInInfo',
|
||||
size: 'large',
|
||||
defaultValue: selectDefaultValue,
|
||||
// autoSelectFirst: true,
|
||||
placeholder: '请选择',
|
||||
@@ -107,15 +109,6 @@ export const appConfig = {
|
||||
// toRouterName: 'NoticeManageIndex',
|
||||
// },
|
||||
resourceInfo: {
|
||||
// application: {
|
||||
// version: '1.1.74',
|
||||
// label: '停车业务平台',
|
||||
// dataScope: {
|
||||
// scopeMode: 0,
|
||||
// scopeType: '',
|
||||
// dataTips: '',
|
||||
// },
|
||||
// },
|
||||
api: permission.add,
|
||||
},
|
||||
};
|
||||
|
4
hx-ai-intelligent/src/icon/shebeiguanli.svg
Normal file
@@ -0,0 +1,4 @@
|
||||
<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" width="15.4384765625" height="14.517333984375" viewBox="0 0 15.4384765625 14.517333984375" fill="none">
|
||||
<path d="M6.32606 8.89293L1.26484 8.89293C0.569183 8.89293 0 8.31818 0 7.61136L0 1.28157C0 0.574753 0.569183 0 1.26484 0L6.32606 0C7.02172 0 7.5909 0.574753 7.5909 1.28157L7.5909 7.61136C7.5909 8.31631 7.02358 8.89293 6.32606 8.89293ZM14.4415 2.05164L11.2533 2.05164C10.7046 2.05164 10.2564 1.59779 10.2564 1.04163L10.2564 1.01001C10.2564 0.453857 10.7046 0 11.2533 0L14.4415 0C14.9902 0 15.4385 0.453857 15.4385 1.01001L15.4385 1.04163C15.4366 1.59779 14.9865 2.05164 14.4415 2.05164ZM14.4415 5.44624L11.2533 5.44624C10.7046 5.44624 10.2564 4.99239 10.2564 4.43623L10.2564 4.40462C10.2564 3.84846 10.7046 3.39459 11.2533 3.39459L14.4415 3.39459C14.9902 3.39459 15.4385 3.84846 15.4385 4.40462L15.4385 4.43623C15.4366 4.99239 14.9865 5.44624 14.4415 5.44624ZM14.4415 8.84457L11.2533 8.84457C10.7046 8.84457 10.2564 8.39072 10.2564 7.83456L10.2564 7.80295C10.2564 7.24678 10.7046 6.79292 11.2533 6.79292L14.4415 6.79292C14.9902 6.79292 15.4385 7.24678 15.4385 7.80295L15.4385 7.83456C15.4366 8.39072 14.9865 8.84457 14.4415 8.84457ZM14.1718 14.5174L1.26484 14.5174C0.569183 14.5174 0 13.9426 0 13.2358L0 11.4018C0 10.6949 0.569183 10.1202 1.26484 10.1202L14.1718 10.1202C14.8674 10.1202 15.4366 10.6949 15.4366 11.4018L15.4366 13.2358C15.4366 13.9426 14.8674 14.5174 14.1718 14.5174Z" fill="#8D96A3" >
|
||||
</path>
|
||||
</svg>
|
After Width: | Height: | Size: 1.5 KiB |
4
hx-ai-intelligent/src/icon/shebeiqunkong.svg
Normal file
@@ -0,0 +1,4 @@
|
||||
<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" width="13.654296875" height="14.517303466796875" viewBox="0 0 13.654296875 14.517303466796875" fill="none">
|
||||
<path d="M7.7187 0.222214L12.8503 2.95256C13.345 3.21599 13.6542 3.73064 13.6546 4.29111L13.6546 10.2367C13.6546 10.8 13.3449 11.3159 12.8474 11.5781L7.71483 14.2969C7.15997 14.5908 6.49557 14.5908 5.94072 14.2969L0.80719 11.5791C0.31076 11.3161 0.000213623 10.8004 0 10.2386L0 4.29208C0 3.73071 0.309738 3.21582 0.803329 2.95158L5.93687 0.222214C6.49385 -0.0740738 7.1617 -0.0740738 7.7187 0.222214ZM9.69315 4.92796L6.83699 6.57527L6.81763 6.57527L3.96243 4.92796C3.63583 4.73979 3.21854 4.85202 3.03038 5.17863C2.84222 5.50523 2.95445 5.92252 3.28105 6.11067L6.14592 7.76573L6.14592 10.6712C6.14592 11.0169 6.40453 11.308 6.74785 11.3487L6.82828 11.3536C7.20512 11.3536 7.5106 11.0481 7.5106 10.6712L7.5106 7.76378L10.3755 6.11067C10.7021 5.92197 10.8139 5.50426 10.6252 5.17766C10.4365 4.85106 10.0188 4.73926 9.69217 4.92795L9.69315 4.92796Z" fill="#8D96A3" >
|
||||
</path>
|
||||
</svg>
|
After Width: | Height: | Size: 1.0 KiB |
4
hx-ai-intelligent/src/icon/shouye.svg
Normal file
@@ -0,0 +1,4 @@
|
||||
<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" width="17.279296875" height="14.6025390625" viewBox="0 0 17.279296875 14.6025390625" fill="currentColor">
|
||||
<path d="M10.007 14.5797L10.007 10.2525L7.28672 10.2525L7.28672 14.5913C7.20171 14.5957 7.13389 14.6022 7.06605 14.6022C5.78165 14.6022 4.49657 14.6029 3.21208 14.6022C2.77071 14.6022 2.47391 14.3191 2.47196 13.8503C2.46304 12.07 2.46575 10.2881 2.47392 8.50777C2.47392 8.41387 2.54524 8.29381 2.6172 8.22973C3.77963 7.20271 4.94816 6.18224 6.11472 5.16097C6.89124 4.48119 7.66712 3.80132 8.44361 3.12223C8.50395 3.0698 8.56569 3.01889 8.64169 2.95401C9.10501 3.35876 9.56628 3.76126 10.0269 4.16451C11.5463 5.49436 13.0638 6.82713 14.5874 8.15192C14.7512 8.2938 14.8211 8.4379 14.8197 8.66717C14.8101 10.3574 14.8128 12.0481 14.8163 13.7375C14.8169 14.0447 14.745 14.3119 14.4893 14.4815C14.3968 14.5432 14.2796 14.5965 14.1734 14.5972C12.8102 14.6044 11.4469 14.6007 10.0845 14.6C10.0646 14.6001 10.0439 14.5906 10.007 14.5797L10.007 14.5797ZM12.0542 2.59968C12.0542 1.88561 12.0536 1.22617 12.0542 0.567406C12.0549 0.146721 12.1494 0.046257 12.5449 0.0455475C13.159 0.0455475 13.7732 0.0448761 14.3873 0.046257C14.7039 0.0470581 14.8135 0.165627 14.8142 0.521568C14.8157 1.93143 14.819 3.34212 14.8101 4.752C14.8087 4.96963 14.8663 5.10934 15.0273 5.24763C15.7004 5.82269 16.3604 6.41369 17.0239 7.00109C17.3494 7.28937 17.3576 7.42977 17.0835 7.77266C16.9177 7.98081 16.7553 8.19265 16.588 8.40011C16.3824 8.65698 16.2124 8.67303 15.9664 8.45463C13.6107 6.36707 11.2551 4.27808 8.89869 2.18983C8.81712 2.11777 8.73353 2.04712 8.6382 1.96411C8.10844 2.43295 7.58274 2.89661 7.05841 3.36166C5.14625 5.05622 3.23403 6.7514 1.32181 8.44586C1.06275 8.67586 0.901754 8.66209 0.683794 8.39129C0.503304 8.16627 0.324193 7.94017 0.146461 7.71297C-0.0605403 7.44801 -0.0522817 7.27692 0.19785 7.05352C1.26495 6.10507 2.33488 5.16026 3.40405 4.21403C4.82891 2.9526 6.25519 1.6927 7.67941 0.4291C8.32567 -0.143761 8.95488 -0.143761 9.60259 0.433456C10.3681 1.11544 11.1358 1.79462 11.9027 2.47441C11.9391 2.50652 11.9775 2.5363 12.0542 2.59968L12.0542 2.59968Z" fill="currentColor" >
|
||||
</path>
|
||||
</svg>
|
After Width: | Height: | Size: 2.1 KiB |
@@ -1,6 +0,0 @@
|
||||
<svg width="20" height="9" viewBox="0 0 20 9" fill="none" xmlns="http://www.w3.org/2000/svg">
|
||||
<g id="Group 6356610" opacity="0.65">
|
||||
<path id="Vector" d="M6.89084 5.13637L9.85448 8.1L8.95448 9L4.45446 4.49997L8.95448 -8.86233e-07L9.85448 0.899993L6.89091 3.86357L19.0918 3.86351L19.0918 5.13631L6.89084 5.13637Z" fill="white" fill-opacity="0.3"/>
|
||||
<path id="Vector_2" d="M1.27246 0.0904379L1.27246 9L-0.000335336 9L-0.000334557 0.0904378L1.27246 0.0904379Z" fill="white" fill-opacity="0.65"/>
|
||||
</g>
|
||||
</svg>
|
Before Width: | Height: | Size: 503 B |
4
hx-ai-intelligent/src/icon/zuzhiguanli.svg
Normal file
@@ -0,0 +1,4 @@
|
||||
<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" width="16.21484375" height="13.50872802734375" viewBox="0 0 16.21484375 13.50872802734375" fill="none">
|
||||
<path d="M8.10415 0C9.84551 0.0632347 11.2034 1.39415 11.1426 2.97804C11.1467 3.44998 11.0312 3.91644 10.805 4.34118L13.2695 6.18327C13.5772 5.96724 13.9542 5.84864 14.343 5.84555C15.4184 5.88545 16.2552 6.70962 16.2133 7.68764C16.2353 8.15778 16.0502 8.61648 15.6992 8.9622C15.3482 9.30793 14.8601 9.51217 14.343 9.52972C13.8259 9.51217 13.3379 9.30793 12.9868 8.9622C12.6358 8.61648 12.4508 8.15778 12.4727 7.68764C12.4714 7.46591 12.5125 7.24566 12.5942 7.03676L10.1298 5.19468C9.72493 5.55505 9.21346 5.80042 8.65782 5.90082L8.65782 8.75605C9.81002 9.04805 10.5971 10.0142 10.5686 11.1016C10.618 12.3849 9.51517 13.462 8.10415 13.5087C6.69582 13.4587 5.59701 12.3826 5.64643 11.1017C5.61473 10.0153 6.39954 9.04848 7.55049 8.75606L7.55049 5.90083C6.99538 5.79909 6.48431 5.55392 6.07856 5.1947L3.62083 7.03678C3.70258 7.24568 3.74371 7.46592 3.74236 7.68765C3.76428 8.15779 3.57925 8.61649 3.22823 8.96222C2.87721 9.30794 2.38914 9.51219 1.87206 9.52974C1.35497 9.51219 0.866907 9.30794 0.515883 8.96222C0.164859 8.61649 -0.020171 8.15779 0.00174713 7.68765C-0.0401125 6.70964 0.796688 5.88547 1.87206 5.84557C2.26084 5.84866 2.63785 5.96725 2.94563 6.18328L5.40335 4.3412C5.1771 3.91646 5.06158 3.44999 5.06575 2.97805C5.0049 1.39416 6.36279 0.0632407 8.10415 0L8.10415 0Z" fill="#8D96A3" >
|
||||
</path>
|
||||
</svg>
|
After Width: | Height: | Size: 1.5 KiB |
@@ -2,13 +2,13 @@ const Base = () => import('/nerv-lib/saas/view/system/layout/content.vue');
|
||||
const equipmentControl = {
|
||||
path: '/equipmentControl',
|
||||
name: 'EquipmentControl',
|
||||
meta: { title: '设备群控', icon: 'dicizhishou', index: 4 },
|
||||
meta: { title: '设备群控', icon: 'shebeiqunkong', index: 4 },
|
||||
redirect: { name: 'LightManage' },
|
||||
children: [
|
||||
{
|
||||
path: 'lightManage',
|
||||
name: 'LightManage',
|
||||
meta: { title: '智能照明', hideChildren: true, icon: 'dicizhishou' },
|
||||
meta: { title: '智能照明', hideChildren: true, icon: 'shebeiqunkong' },
|
||||
component: Base,
|
||||
redirect: { name: 'lightManageIndex' },
|
||||
children: [
|
||||
|
@@ -2,13 +2,13 @@ const Base = () => import('/nerv-lib/saas/view/system/layout/content.vue');
|
||||
const equipment = {
|
||||
path: '/equipmentManage',
|
||||
name: 'EquipmentManage',
|
||||
meta: { title: '设备管理', icon: 'dicizhishou', index: 1 },
|
||||
meta: { title: '设备管理', icon: 'shebeiguanli', index: 1 },
|
||||
redirect: { name: 'Ledger' },
|
||||
children: [
|
||||
{
|
||||
path: 'ledger',
|
||||
name: 'Ledger',
|
||||
meta: { title: '设备台账', hideChildren: true, icon: 'dicizhishou' },
|
||||
meta: { title: '设备台账', hideChildren: true, icon: 'shebeiguanli' },
|
||||
component: Base,
|
||||
redirect: { name: 'LedgerIndex' },
|
||||
children: [
|
||||
@@ -28,7 +28,7 @@ const equipment = {
|
||||
{
|
||||
path: 'group',
|
||||
name: 'Group',
|
||||
meta: { title: '分组管理', hideChildren: true, icon: 'dicizhishou' },
|
||||
meta: { title: '分组管理', hideChildren: true, icon: 'shebeiguanli' },
|
||||
component: Base,
|
||||
redirect: { name: 'GroupIndex' },
|
||||
children: [
|
||||
@@ -47,7 +47,7 @@ const equipment = {
|
||||
{
|
||||
path: 'energyMapping',
|
||||
name: 'EnergyMapping',
|
||||
meta: { title: '能耗映射', hideChildren: true, icon: 'dicizhishou' },
|
||||
meta: { title: '能耗映射', hideChildren: true, icon: 'shebeiguanli' },
|
||||
component: Base,
|
||||
redirect: { name: 'EnergyMappingIndex' },
|
||||
children: [
|
||||
|
@@ -2,13 +2,13 @@ const Base = () => import('/nerv-lib/saas/view/system/layout/content.vue');
|
||||
const home = {
|
||||
path: '/home',
|
||||
name: 'home',
|
||||
meta: { title: '首页', icon: 'dicizhishou', index: 0, hideChildren: true },
|
||||
meta: { title: '首页', icon: 'shouye', index: 0, hideChildren: true },
|
||||
redirect: { name: 'homeIndex' },
|
||||
children: [
|
||||
{
|
||||
path: 'index',
|
||||
name: 'homeIndex',
|
||||
meta: { title: '首页', hideChildren: true, icon: 'dicizhishou' },
|
||||
meta: { title: '首页', hideChildren: true, icon: 'shouye' },
|
||||
component: () => import('/@/view/developing.vue'),
|
||||
// redirect: { name: 'homeIndex' },
|
||||
// children: [
|
||||
|
@@ -2,13 +2,13 @@ const Base = () => import('/nerv-lib/saas/view/system/layout/content.vue');
|
||||
const organizationManage = {
|
||||
path: '/organizationManage',
|
||||
name: 'organizationManage',
|
||||
meta: { title: '组织管理', icon: 'dicizhishou', index: 99 },
|
||||
meta: { title: '组织管理', icon: 'zuzhiguanli', index: 99 },
|
||||
redirect: { name: 'UserManage' },
|
||||
children: [
|
||||
{
|
||||
path: 'userManage',
|
||||
name: 'UserManage',
|
||||
meta: { title: '用户管理', hideChildren: true, icon: 'dicizhishou' },
|
||||
meta: { title: '用户管理', hideChildren: true, icon: 'zuzhiguanli' },
|
||||
component: Base,
|
||||
redirect: { name: 'userManageIndex' },
|
||||
children: [
|
||||
@@ -66,7 +66,7 @@ const organizationManage = {
|
||||
{
|
||||
path: 'authorityManage',
|
||||
name: 'AuthorityManage',
|
||||
meta: { title: '部门/权限', hideChildren: true, icon: 'dicizhishou' },
|
||||
meta: { title: '部门/权限', hideChildren: true, icon: 'zuzhiguanli' },
|
||||
component: Base,
|
||||
redirect: { name: 'AuthorityManageIndex' },
|
||||
children: [
|
||||
|
@@ -111,13 +111,13 @@
|
||||
|
||||
.ant-menu-title-content {
|
||||
svg {
|
||||
color: #A1ABC2;
|
||||
// color: #A1ABC2;
|
||||
}
|
||||
}
|
||||
|
||||
.ant-menu-item-selected {
|
||||
svg {
|
||||
color: #D0DBF5;
|
||||
// color: #D0DBF5;
|
||||
}
|
||||
}
|
||||
|
||||
|
BIN
hx-op/public/asset/image/headerIcon.png
Normal file
After Width: | Height: | Size: 5.5 KiB |
@@ -25,45 +25,52 @@
|
||||
|
||||
<style lang="less" scoped>
|
||||
:deep(.ns-content) {
|
||||
padding-top: 80px !important;
|
||||
// padding-top: 80px !important;
|
||||
}
|
||||
#app {
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
min-width: 1000px;
|
||||
}
|
||||
|
||||
:deep(.ns-left-menu .firstMenuItem-selected .ant-menu-title-content) {
|
||||
background: unset !important;
|
||||
}
|
||||
:deep(.ns-left-menu .ant-menu-item-selected .ant-menu-title-content) {
|
||||
color: #fff !important;
|
||||
background: @primary-color;
|
||||
border-radius: 2px;
|
||||
height: 40px;
|
||||
line-height: 40px;
|
||||
a {
|
||||
color: #ffffff !important;
|
||||
:deep(.ns-left-menu) {
|
||||
.ant-menu-item-active,
|
||||
.ant-submenu-item-active {
|
||||
background: #ecf3ff !important;
|
||||
}
|
||||
.ant-menu-item-selected .ant-menu-title-content {
|
||||
// color: #fff !important;
|
||||
background: @primary-color;
|
||||
border-radius: 12px;
|
||||
height: 40px;
|
||||
line-height: 40px;
|
||||
a {
|
||||
color: @white !important;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
:deep(.ant-menu-light.ant-menu-horizontal > .ant-menu-item:hover) {
|
||||
background: @primary-color;
|
||||
}
|
||||
:deep(.ant-menu-inline .ant-menu-submenu-title) {
|
||||
color: rgba(255, 255, 255, 0.9) !important;
|
||||
}
|
||||
// :deep(.ant-menu-inline .ant-menu-submenu-title) {
|
||||
// color: rgba(255, 255, 255, 0.9) !important;
|
||||
// }
|
||||
:deep(.ns-left-menu .ant-layout-sider-children .ant-menu-sub.ant-menu-inline) {
|
||||
position: relative;
|
||||
&::before {
|
||||
display: flex;
|
||||
width: 2px;
|
||||
height: calc(100% - 40px);
|
||||
position: absolute;
|
||||
top: 20px;
|
||||
left: 20px;
|
||||
content: '';
|
||||
background-color: rgba(255, 255, 255, 0.2);
|
||||
}
|
||||
// position: relative;
|
||||
// &::before {
|
||||
// display: flex;
|
||||
// width: 2px;
|
||||
// height: calc(100% - 40px);
|
||||
// position: absolute;
|
||||
// top: 20px;
|
||||
// left: 20px;
|
||||
// content: '';
|
||||
// background-color: rgba(255, 255, 255, 0.2);
|
||||
// }
|
||||
}
|
||||
|
||||
//*************************含tab的 list列表样式 */
|
||||
@@ -171,45 +178,3 @@
|
||||
}
|
||||
}
|
||||
</style>
|
||||
<style lang="less">
|
||||
// 列表弹框样式修改
|
||||
.listTableModal .ant-modal-title {
|
||||
font-weight: 600;
|
||||
}
|
||||
.listTableModal .ant-modal-body {
|
||||
padding: 16px !important;
|
||||
.ant-tabs-nav-wrap {
|
||||
padding: 0px;
|
||||
}
|
||||
.ns-list-table {
|
||||
border-left: 16px solid #e5ebf0;
|
||||
border-right: 16px solid #e5ebf0;
|
||||
border-bottom: 16px solid #e5ebf0;
|
||||
}
|
||||
}
|
||||
:deep(.ant-menu-submenu-title) {
|
||||
color: #ffffff !important;
|
||||
}
|
||||
</style>
|
||||
<style lang="less">
|
||||
//************************修改顶部菜单弹框样式
|
||||
.ant-menu-submenu-placement-bottomLeft {
|
||||
.ant-menu-submenu {
|
||||
background: rgb(3 24 53) !important;
|
||||
}
|
||||
|
||||
.ant-menu-sub {
|
||||
background: rgb(3 24 53) !important;
|
||||
}
|
||||
.ant-menu-title-content {
|
||||
color: #fff !important;
|
||||
.ns-icon {
|
||||
margin-right: 7px;
|
||||
transform: translateY(2px);
|
||||
}
|
||||
}
|
||||
.ant-menu-submenu-arrow {
|
||||
color: #fff !important;
|
||||
}
|
||||
}
|
||||
</style>
|
||||
|
@@ -20,6 +20,7 @@ export const appConfig = {
|
||||
baseHeader: '/parkingManage',
|
||||
baseRouter: '/parkingManage/parkingLotManage',
|
||||
themeConfig: {
|
||||
logoLessUrl: `${import.meta.env.VITE_PUBLIC_PATH}/asset/image/headerIcon.png`,
|
||||
bgImageUrl: `${import.meta.env.VITE_PUBLIC_PATH}/asset/image/login/background.png`,
|
||||
},
|
||||
// userCustomRouterGuard: (to, from, next, whiteNameList, authorizationStore, appConfig) => {
|
||||
|
@@ -2,7 +2,7 @@
|
||||
|
||||
<template>
|
||||
<div class="ns-table-header" v-if="!isEmpty(getActions)">
|
||||
<!-- <div class="ns-table-title" v-if="tableTitle">{{ tableTitle }}</div> -->
|
||||
<div class="ns-table-title extra-title-box" v-if="tableTitle">{{ tableTitle }}</div>
|
||||
<div class="ns-table-header-action">
|
||||
<slot name="header" :data="data"></slot>
|
||||
<template v-for="item in getActions" :key="item.name">
|
||||
@@ -75,6 +75,21 @@
|
||||
</script>
|
||||
|
||||
<style lang="less" scoped>
|
||||
.extra-title-box {
|
||||
position: relative;
|
||||
padding-left: 9px;
|
||||
&::before {
|
||||
content: '';
|
||||
position: absolute;
|
||||
left: 0;
|
||||
top: 50%;
|
||||
transform: translateY(-50%);
|
||||
height: 13px;
|
||||
width: 3px;
|
||||
border-radius: 1px;
|
||||
background-color: @primary-color;
|
||||
}
|
||||
}
|
||||
.ns-table-header {
|
||||
min-width: fit-content;
|
||||
user-select: none;
|
||||
|
@@ -3,7 +3,7 @@
|
||||
<template>
|
||||
<div class="ns-table" :class="{ 'ns-table-no-search': !(formConfig?.schemas.length > 0) }">
|
||||
<!-- tabletitle -->
|
||||
<div
|
||||
<!-- <div
|
||||
class="ns-table-title"
|
||||
@click="
|
||||
() => {
|
||||
@@ -12,7 +12,7 @@
|
||||
"
|
||||
v-if="tableTitle">
|
||||
<ns-icon v-if="showBack" class="backIcon" name="left" />{{ tableTitle }}
|
||||
</div>
|
||||
</div> -->
|
||||
<div class="ns-table-container">
|
||||
<!-- todo drag -->
|
||||
<div class="ns-part-tree" v-if="!isEmpty(treeConfig)">
|
||||
|
9
lib/saas/asset/icon/close.svg
Normal file
@@ -0,0 +1,9 @@
|
||||
<!-- <?xml version="1.0" standalone="no"?><!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd"><svg t="1625651626016" class="icon" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="3205" xmlns:xlink="http://www.w3.org/1999/xlink" width="200" height="200"><defs><style type="text/css"></style></defs><path d="M853.333333 921.6c-20.48 0-34.133333-6.826667-47.786666-20.48l-682.666667-682.666667c-27.306667-27.306667-27.306667-68.266667 0-95.573333s68.266667-27.306667 95.573333 0l682.666667 682.666667c27.306667 27.306667 27.306667 68.266667 0 95.573333-13.653333 13.653333-27.306667 20.48-47.786667 20.48z" p-id="3206"></path><path d="M170.666667 921.6c-20.48 0-34.133333-6.826667-47.786667-20.48-27.306667-27.306667-27.306667-68.266667 0-95.573333l682.666667-682.666667c27.306667-27.306667 68.266667-27.306667 95.573333 0s27.306667 68.266667 0 95.573333l-682.666667 682.666667c-13.653333 13.653333-27.306667 20.48-47.786666 20.48z" p-id="3207"></path></svg> -->
|
||||
<svg width="14" height="14" viewBox="0 0 14 14" xmlns="http://www.w3.org/2000/svg">
|
||||
<mask id="mask0" mask-type="alpha" maskUnits="userSpaceOnUse" x="0" y="0" width="14" height="14">
|
||||
<rect width="14" height="14" />
|
||||
</mask>
|
||||
<g mask="url(#mask0)">
|
||||
<path opacity="0.4611" d="M7.61936 7L10.8767 3.74132C11.0411 3.57683 11.0411 3.30564 10.8767 3.14115L10.8589 3.12337C10.6945 2.95888 10.4234 2.95888 10.259 3.12337L7.00167 6.3865L3.74434 3.12337C3.57992 2.95888 3.30885 2.95888 3.14442 3.12337L3.12665 3.14115C2.95778 3.30564 2.95778 3.57683 3.12665 3.74132L6.38397 7L3.12665 10.2587C2.96223 10.4232 2.96223 10.6944 3.12665 10.8588L3.14442 10.8766C3.30885 11.0411 3.57992 11.0411 3.74434 10.8766L7.00167 7.61795L10.259 10.8766C10.4234 11.0411 10.6945 11.0411 10.8589 10.8766L10.8767 10.8588C11.0411 10.6944 11.0411 10.4232 10.8767 10.2587L7.61936 7Z" />
|
||||
</g>
|
||||
</svg>
|
8
lib/saas/asset/icon/fastBackward.svg
Normal file
@@ -0,0 +1,8 @@
|
||||
<!-- <?xml version="1.0" standalone="no"?><!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd"><svg class="icon" width="200px" height="200.00px" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg"><path d="M793.6 329.6L568 491.2c-9.6 8-9.6 22.4 0 30.4l224 172.8c12.8 9.6 30.4 1.6 30.4-14.4V345.6c0-16-17.6-24-28.8-16zM531.2 329.6L305.6 491.2c-9.6 8-9.6 22.4 0 30.4l224 172.8c12.8 9.6 30.4 1.6 30.4-14.4V345.6c0-16-16-24-28.8-16zM267.2 699.2c17.6 0 32-14.4 32-32V356.8c0-17.6-14.4-32-32-32s-32 14.4-32 32v310.4c0 17.6 14.4 32 32 32z" /></svg> -->
|
||||
<svg width="10" height="7" viewBox="0 0 10 7" fill="none" xmlns="http://www.w3.org/2000/svg">
|
||||
<g>
|
||||
<path fill-rule="evenodd" clip-rule="evenodd" d="M5.6001 3.5L9.8001 0V7L5.6001 3.5Z" fill="#909090"/>
|
||||
<path fill-rule="evenodd" clip-rule="evenodd" d="M1.3999 3.5L5.5999 0V7L1.3999 3.5Z" fill="#909090"/>
|
||||
<rect width="1.4" height="7" fill="#909090"/>
|
||||
</g>
|
||||
</svg>
|
After Width: | Height: | Size: 972 B |
@@ -1,6 +1,6 @@
|
||||
<svg width="20" height="9" viewBox="0 0 20 9" fill="none" xmlns="http://www.w3.org/2000/svg">
|
||||
<svg width="20" height="9" viewBox="0 0 20 9" fill="currentColor" xmlns="http://www.w3.org/2000/svg">
|
||||
<g id="Group 6356610" opacity="0.65">
|
||||
<path id="Vector" d="M6.89084 5.13637L9.85448 8.1L8.95448 9L4.45446 4.49997L8.95448 -8.86233e-07L9.85448 0.899993L6.89091 3.86357L19.0918 3.86351L19.0918 5.13631L6.89084 5.13637Z" fill="white" fill-opacity="0.3"/>
|
||||
<path id="Vector_2" d="M1.27246 0.0904379L1.27246 9L-0.000335336 9L-0.000334557 0.0904378L1.27246 0.0904379Z" fill="white" fill-opacity="0.65"/>
|
||||
<path id="Vector" d="M6.89084 5.13637L9.85448 8.1L8.95448 9L4.45446 4.49997L8.95448 -8.86233e-07L9.85448 0.899993L6.89091 3.86357L19.0918 3.86351L19.0918 5.13631L6.89084 5.13637Z" fill="currentColor" fill-opacity="0.3"/>
|
||||
<path id="Vector_2" d="M1.27246 0.0904379L1.27246 9L-0.000335336 9L-0.000334557 0.0904378L1.27246 0.0904379Z" fill="currentColor" fill-opacity="0.65"/>
|
||||
</g>
|
||||
</svg>
|
||||
|
Before Width: | Height: | Size: 503 B After Width: | Height: | Size: 525 B |
@@ -28,8 +28,9 @@
|
||||
#app .ant-layout-has-sider .ant-menu-vertical .ant-menu-item,#app .ant-menu-vertical-left .ant-menu-item, #app.ant-menu-vertical-right .ant-menu-item,#app .ant-menu-inline .ant-menu-item,#app .ant-menu-vertical .ant-menu-submenu-title,#app .ant-menu-vertical-left .ant-menu-submenu-title,#app .ant-menu-vertical-right .ant-menu-submenu-title,#app .ant-menu-inline .ant-menu-submenu-title {
|
||||
margin-top: 0px !important;
|
||||
margin-bottom: 0px !important;
|
||||
height: 40px !important;
|
||||
height: 50px !important;
|
||||
}
|
||||
|
||||
.ant-menu-vertical.ant-menu-sub, .ant-menu-vertical-left.ant-menu-sub, .ant-menu-vertical-right.ant-menu-sub{
|
||||
min-width: 0 !important;
|
||||
}
|
||||
@@ -86,35 +87,35 @@
|
||||
top:0;
|
||||
left:0;
|
||||
content: '';
|
||||
background-color: #37abc4;
|
||||
// background-color:red;
|
||||
opacity: .1;
|
||||
}
|
||||
//
|
||||
//.ant-menu-item:not(.ant-menu-item-selected) a:hover {
|
||||
// .ant-menu-item:not(.ant-menu-item-selected) a:hover {
|
||||
// color: @text-color;
|
||||
//}
|
||||
// }
|
||||
//
|
||||
//.ant-menu-item::after {
|
||||
// .ant-menu-item::after {
|
||||
// z-index: 2;
|
||||
//}
|
||||
// }
|
||||
//
|
||||
//.ant-menu-light .ant-menu-submenu:not(.ant-menu-submenu-selected) .ant-menu-submenu-title:hover {
|
||||
// color: @text-color;
|
||||
//}
|
||||
//
|
||||
//.ant-layout-sider {
|
||||
// .ant-layout-sider {
|
||||
// max-width: @layout-sider-width !important;
|
||||
// min-width: @layout-sider-width !important;
|
||||
// width: @layout-sider-width !important;
|
||||
//}
|
||||
//
|
||||
//.ant-menu-submenu:hover > .ant-menu-submenu-title > .ant-menu-submenu-arrow {
|
||||
// }
|
||||
|
||||
// .ant-menu-submenu:hover > .ant-menu-submenu-title > .ant-menu-submenu-arrow {
|
||||
// color: @layout-sider-arrow-color;
|
||||
//}
|
||||
//
|
||||
//.ant-menu-submenu-arrow {
|
||||
// color: @layout-sider-arrow-color;
|
||||
//}
|
||||
// }
|
||||
|
||||
.ant-menu-submenu-arrow {
|
||||
color: @layout-sider-arrow-color;
|
||||
}
|
||||
//
|
||||
//
|
||||
|
||||
@@ -128,7 +129,7 @@
|
||||
//
|
||||
.ant-btn-primary:hover, .ant-btn-primary:focus {
|
||||
// color: #fff !important;
|
||||
color: #fff ;
|
||||
// color: #fff ;
|
||||
}
|
||||
|
||||
|
||||
|
@@ -81,7 +81,7 @@
|
||||
}
|
||||
|
||||
::-webkit-scrollbar-track {
|
||||
background-color: rgb(0 0 0 / 5%);
|
||||
background-color: transparent;
|
||||
}
|
||||
|
||||
::-webkit-scrollbar-thumb {
|
||||
@@ -141,6 +141,10 @@ body {
|
||||
overflow: auto;
|
||||
}
|
||||
|
||||
.ant-menu.ant-menu-inline-collapsed > .ant-menu-submenu > .ant-menu-submenu-title {
|
||||
padding: auto;
|
||||
}
|
||||
|
||||
.ns-view-spinning {
|
||||
position: fixed !important;
|
||||
width: calc(100% - @ns-content-padding * 2 - @layout-sider-width) !important;
|
||||
|
@@ -12,15 +12,16 @@
|
||||
@font-size-base: 14px; // 主字号
|
||||
|
||||
|
||||
@layout-body-background: #f0f2f5; //框架背景色
|
||||
@layout-body-background: #fff; //框架背景色
|
||||
@layout-header-hover:rgba(0, 0, 0, 0.06);//默认退出hover色
|
||||
@layout-header-background: #37abc4; // 头部背景色
|
||||
@layout-header-background: #fff; // 头部背景色
|
||||
@ant-layout-sider-collapsed-background:rgb(255, 255, 255);//导航栏收缩后背景色
|
||||
@layout-header-height: 48px;
|
||||
@layout-header-height: 72px;
|
||||
@layout-header-padding: 0 50px;
|
||||
|
||||
@layout-sider-width: 208px; //侧边导航宽度
|
||||
@layout-sider-arrow-color: #808d96; //侧边导航箭头颜色
|
||||
@layout-sider-width: 220px; //侧边导航宽度
|
||||
@layout-sider-arrow-color: @black; //侧边导航箭头颜色
|
||||
|
||||
|
||||
// Border color
|
||||
@border-color-base: hsv(0, 0, 85%); // base border outline a component
|
||||
@@ -53,4 +54,11 @@
|
||||
|
||||
//list-table
|
||||
@ns-content-padding: 24px;
|
||||
@ns-nav-shutters-height: 31px;
|
||||
@ns-nav-shutters-height: 48px;
|
||||
|
||||
|
||||
// main-content
|
||||
@ns-content-bg: #f1f2f6;
|
||||
@ns-box-shadow: 0px 5px 16px #e4e6e8;
|
||||
@ns-gap: 20px;
|
||||
@ns-border-radius: 12px;
|
@@ -12,13 +12,15 @@
|
||||
:menuList="newMenu"
|
||||
:initSiderKey="selectedSiderKeys"
|
||||
:initSiderOpenKey="selectedSiderOpenKeys" />
|
||||
<a-layout>
|
||||
<a-layout class="ns-application-layout-main">
|
||||
<newNsTags v-if="configStore.useHistoryTag" />
|
||||
<ns-tags v-else />
|
||||
<!-- <NsBreadcrumb v-else :breadcrumbList="breadcrumbList" /> -->
|
||||
<NsBreadcrumb :breadcrumbList="breadcrumbList" />
|
||||
<a-layout-content class="ns-content">
|
||||
<!-- <transition name="fade-slide" mode="out-in"> -->
|
||||
<!-- <div> -->
|
||||
<ns-content />
|
||||
<!-- </div> -->
|
||||
<!-- </transition> -->
|
||||
</a-layout-content>
|
||||
</a-layout>
|
||||
@@ -322,21 +324,29 @@
|
||||
flex-direction: row;
|
||||
}
|
||||
}
|
||||
|
||||
.ns-application-layout-main {
|
||||
padding-top: calc(@layout-header-height + @ns-nav-shutters-height * 2);
|
||||
height: 100vh;
|
||||
overflow: auto;
|
||||
}
|
||||
.ns-content {
|
||||
position: relative;
|
||||
flex: 1 1 auto;
|
||||
padding-top: 80px;
|
||||
background-color: #e5ebf0;
|
||||
padding: @ns-gap;
|
||||
// padding-top: calc(@layout-header-height + @ns-nav-shutters-height);
|
||||
background-color: @ns-content-bg;
|
||||
> div {
|
||||
height: 100%;
|
||||
background-color: #fff;
|
||||
margin: 0 16px 16px 16px;
|
||||
background-color: @white;
|
||||
border-radius: @ns-border-radius;
|
||||
overflow-y: auto;
|
||||
overflow-x: hidden;
|
||||
// margin: 0 16px 16px 16px;
|
||||
}
|
||||
.ns-content-main {
|
||||
// margin: @ns-content-padding;
|
||||
// margin: @ns-gap;
|
||||
min-height: calc(100% - 48px);
|
||||
height: calc(100% - 16px);
|
||||
// height: calc(100% - 16px);
|
||||
// background-color: @white;
|
||||
}
|
||||
.ns-view {
|
||||
|
@@ -85,14 +85,14 @@
|
||||
<style lang="less" scoped>
|
||||
.NsBreadcrumb {
|
||||
width: 100%;
|
||||
padding: 0 16px;
|
||||
min-height: 42px;
|
||||
padding: 0 @ns-gap;
|
||||
min-height: @ns-nav-shutters-height;
|
||||
background: #ffffff;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
position: fixed;
|
||||
top: 48px;
|
||||
z-index: 505;
|
||||
top: calc(@layout-header-height + @ns-nav-shutters-height);
|
||||
z-index: 5;
|
||||
border-bottom: 1px solid rgba(0, 0, 0, 0.05);
|
||||
}
|
||||
</style>
|
||||
|
@@ -9,11 +9,13 @@
|
||||
style="width: 192px; height: 48px; object-fit: contain" />
|
||||
<ns-icon v-else name="headerLogin" class="headerLogin" style="width: auto; height: 48px" />
|
||||
</div>
|
||||
<div>
|
||||
<component v-if="headerSlot" :is="headerSlot.component" v-bind="headerSlot.componentProps" />
|
||||
</div>
|
||||
|
||||
<div class="header-menu">
|
||||
<a-menu style="width: 100%" mode="horizontal" :selectedKeys="initHeaderKey">
|
||||
<a-menu
|
||||
v-if="menuList?.length"
|
||||
style="width: 100%"
|
||||
mode="horizontal"
|
||||
:selectedKeys="initHeaderKey">
|
||||
<a-menu-item v-for="item in menuList" :key="item.name">
|
||||
<div @click="tochildren(item)">
|
||||
<ns-icon :name="item.meta.icon" size="16" /><span>{{ item.meta.title }}</span>
|
||||
@@ -61,17 +63,17 @@
|
||||
</template>
|
||||
</template>
|
||||
</a-menu>
|
||||
<div v-else>
|
||||
<div v-if="configStore.projectName" class="projectTitle">{{ configStore.projectName }}</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="nsHeader_action">
|
||||
<div class="projectName action" v-if="showProject">
|
||||
{{ projectName ? projectName : enterpriseName }}
|
||||
<div>
|
||||
<component
|
||||
v-if="headerSlot"
|
||||
:is="headerSlot.component"
|
||||
v-bind="headerSlot.componentProps" />
|
||||
</div>
|
||||
<div
|
||||
class="projectName action"
|
||||
v-if="['服务管理平台', '报表中心'].includes(configStore.resourceInfo?.application?.label)"
|
||||
@click="backDoor"
|
||||
>{{ '返回门户' }}</div
|
||||
>
|
||||
<div v-if="bellInfo.isShow" class="bells action" @click="backMessage">
|
||||
<a-badge :count="messageCount > 99 ? 99 : messageCount">
|
||||
<ns-icon name="bells" size="32" />
|
||||
@@ -80,7 +82,7 @@
|
||||
<a-dropdown :trigger="['hover']">
|
||||
<div class="userName action">
|
||||
<!-- <img src="/asset/image/login/adminIcon.png" /> -->
|
||||
<ns-icon class="headerAdminIcon" name="headerAdminIcon" size="20" />
|
||||
<!-- <ns-icon class="headerAdminIcon" name="headerAdminIcon" size="20" /> -->
|
||||
<span
|
||||
style="
|
||||
display: block;
|
||||
@@ -424,11 +426,22 @@
|
||||
}
|
||||
}
|
||||
:deep(.ant-menu-submenu-title) {
|
||||
color: rgba(255, 255, 255, 0.9);
|
||||
// color: rgba(255, 255, 255, 0.9);
|
||||
}
|
||||
.header-menu {
|
||||
flex: 1;
|
||||
.projectTitle {
|
||||
font-size: 28px;
|
||||
font-weight: 900;
|
||||
letter-spacing: 2.33px;
|
||||
line-height: 40px;
|
||||
color: @primary-color;
|
||||
text-align: left;
|
||||
}
|
||||
}
|
||||
:deep(.header-menu .ant-menu-title-content) {
|
||||
div {
|
||||
color: rgba(255, 255, 255, 0.9);
|
||||
// color: rgba(255, 255, 255, 0.9);
|
||||
.ns-icon {
|
||||
margin-right: 7px;
|
||||
transform: translateY(2px);
|
||||
@@ -436,7 +449,7 @@
|
||||
}
|
||||
}
|
||||
:deep(.ant-menu-submenu-title .ant-menu-title-content) {
|
||||
color: rgba(255, 255, 255, 0.9);
|
||||
// color: rgba(255, 255, 255, 0.9);
|
||||
.ns-icon {
|
||||
margin-right: 7px;
|
||||
transform: translateY(2px);
|
||||
@@ -447,10 +460,13 @@
|
||||
padding: 0;
|
||||
position: fixed;
|
||||
top: 0;
|
||||
z-index: 5;
|
||||
z-index: 999;
|
||||
width: 100%;
|
||||
background-image: url(/asset/image/header.png);
|
||||
background-size: 100% 100%;
|
||||
// background-image: url(/asset/image/header.png);
|
||||
// background-size: 100% 100%;
|
||||
box-shadow: @ns-box-shadow;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
}
|
||||
|
||||
:deep(.ant-badge-count) {
|
||||
@@ -504,10 +520,10 @@
|
||||
}
|
||||
|
||||
.nsHeader_action {
|
||||
color: rgba(255, 255, 255, 0.9);
|
||||
color: @black;
|
||||
padding-left: 16px;
|
||||
padding-right: 16px;
|
||||
width: 208px;
|
||||
// width: 208px;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: right;
|
||||
|
@@ -4,12 +4,13 @@
|
||||
<div class="ns-left-menu-space" :class="{ 'ns-left-menu-space-collapsed': collapsed }">
|
||||
<a-layout-sider
|
||||
class="ns-left-menu"
|
||||
:width="208"
|
||||
:collapsedWidth="48"
|
||||
:width="sideWidth"
|
||||
:collapsed="collapsed"
|
||||
breakpoint="lg"
|
||||
:trigger="null"
|
||||
v-if="menuList && menuList[0] && menuList[0].children">
|
||||
{{ $refs.getComputedStyle }}
|
||||
<a-menu
|
||||
mode="inline"
|
||||
:inlineIndent="16"
|
||||
@@ -21,9 +22,9 @@
|
||||
v-if="item.children !== undefined && !item.meta.hideChildren && !item.isHide"
|
||||
:key="item.name">
|
||||
<template #title>
|
||||
<span role="img" class="anticon"
|
||||
><ns-icon :name="item.meta.icon ? item.meta.icon : ''" size="16"
|
||||
/></span>
|
||||
<span role="img" class="anticon">
|
||||
<ns-icon :name="item.meta.icon ? item.meta.icon : ''" size="16" />
|
||||
</span>
|
||||
<span>{{ item.meta.title }}</span>
|
||||
</template>
|
||||
<!-- 跳转外部链接 -->
|
||||
@@ -37,27 +38,31 @@
|
||||
target="_blank"
|
||||
rel="noopener noreferrer">
|
||||
{{ newOpen.name }}
|
||||
</a></a-menu-item
|
||||
>
|
||||
</a>
|
||||
</a-menu-item>
|
||||
</div>
|
||||
</div>
|
||||
<div v-else>
|
||||
<div v-for="sitem in checkAuthList(item.children)" :key="sitem.name">
|
||||
<a-menu-item
|
||||
v-if="(sitem.children === undefined || sitem.meta.hideChildren) && !sitem.isHide"
|
||||
:key="sitem.name"
|
||||
><router-link style="margin-left: 8px" :to="{ name: sitem.name }">{{
|
||||
sitem.meta.title
|
||||
}}</router-link></a-menu-item
|
||||
>
|
||||
:key="sitem.name">
|
||||
<router-link style="margin-left: 8px" :to="{ name: sitem.name }">
|
||||
{{ sitem.meta.title }}
|
||||
</router-link>
|
||||
</a-menu-item>
|
||||
<a-sub-menu
|
||||
class="threeSubMenu"
|
||||
v-if="sitem.children !== undefined && !sitem.meta.hideChildren && !sitem.isHide"
|
||||
:key="sitem.name">
|
||||
<template #title>
|
||||
<span role="img" style="margin-left: 8px" class="anticon" v-show="sitem.meta.icon"
|
||||
><ns-icon :name="sitem.meta.icon" size="16"
|
||||
/></span>
|
||||
<span
|
||||
role="img"
|
||||
style="margin-left: 8px"
|
||||
class="anticon"
|
||||
v-show="sitem.meta.icon">
|
||||
<ns-icon :name="sitem.meta.icon" size="16" />
|
||||
</span>
|
||||
<span>{{ sitem.meta.title }}</span>
|
||||
</template>
|
||||
<div v-for="ditem in checkAuthList(sitem.children)" :key="ditem.name">
|
||||
@@ -70,9 +75,9 @@
|
||||
role="img"
|
||||
style="margin-left: 8px"
|
||||
class="anticon"
|
||||
v-show="ditem.meta.icon"
|
||||
><ns-icon :name="ditem.meta.icon" size="16"
|
||||
/></span>
|
||||
v-show="ditem.meta.icon">
|
||||
<ns-icon :name="ditem.meta.icon" size="16" />
|
||||
</span>
|
||||
<span>{{ ditem.meta.title }}</span>
|
||||
</template>
|
||||
<div
|
||||
@@ -82,11 +87,11 @@
|
||||
:class="
|
||||
initSiderKey.includes(fiveFloorItem.name) ? 'ant-menu-item-selected' : ''
|
||||
"
|
||||
v-if="fiveFloorItem.meta?.type !== 'op'"
|
||||
><router-link style="margin-left: 8px" :to="{ name: fiveFloorItem.name }">{{
|
||||
fiveFloorItem?.meta?.title ? fiveFloorItem?.meta?.title : ''
|
||||
}}</router-link></a-menu-item
|
||||
>
|
||||
v-if="fiveFloorItem.meta?.type !== 'op'">
|
||||
<router-link style="margin-left: 8px" :to="{ name: fiveFloorItem.name }">
|
||||
{{ fiveFloorItem?.meta?.title ? fiveFloorItem?.meta?.title : '' }}
|
||||
</router-link>
|
||||
</a-menu-item>
|
||||
</div>
|
||||
</a-sub-menu>
|
||||
|
||||
@@ -113,7 +118,6 @@
|
||||
<ns-icon :name="item.meta.icon ? item.meta.icon : ''" size="16" />
|
||||
</span>
|
||||
<span style="margin-left: 8px">{{ item.meta.title }}</span>
|
||||
<!-- </span> -->
|
||||
</router-link>
|
||||
</a-menu-item>
|
||||
</a-menu>
|
||||
@@ -128,7 +132,7 @@
|
||||
|
||||
<script lang="ts">
|
||||
import { MenuUnfoldOutlined, MenuFoldOutlined } from '@ant-design/icons-vue';
|
||||
import { defineComponent, inject, ref, watchEffect } from 'vue';
|
||||
import { computed, defineComponent, inject, onMounted, ref, watchEffect } from 'vue';
|
||||
import { appConfigStore } from '/nerv-lib/saas/store/modules/app-config';
|
||||
import { authorizationService } from '/nerv-base/store/modules/authorization-service';
|
||||
import { Emitter } from 'mitt';
|
||||
@@ -148,6 +152,10 @@
|
||||
setup: (props) => {
|
||||
const mittEmit = inject('mittEmit') as Emitter<emitEvents>;
|
||||
const router = useRouter();
|
||||
const sideWidth = computed(() => {
|
||||
return getComputedStyle(document.querySelector('.ns-left-menu-trigger')!).width;
|
||||
});
|
||||
|
||||
const dealRouter = (menuList, routerInfo) => {
|
||||
menuList?.forEach((item) => {
|
||||
if (item.name === routerInfo.name) {
|
||||
@@ -204,45 +212,49 @@
|
||||
checkOpAuth,
|
||||
checkAuthList,
|
||||
checkAuth,
|
||||
sideWidth,
|
||||
};
|
||||
},
|
||||
});
|
||||
</script>
|
||||
|
||||
<style lang="less" scoped>
|
||||
// :deep(.ant-layout-sider) {
|
||||
// width: @layout-sider-width !important;
|
||||
// max-width: @layout-sider-width !important;
|
||||
// }
|
||||
.ns-left-menu {
|
||||
position: fixed;
|
||||
top: 0;
|
||||
left: 0;
|
||||
height: calc(100% - 40px);
|
||||
// background-color: @white;
|
||||
background-image: url(/asset/image/side.png);
|
||||
background-color: @white;
|
||||
// background-image: url(/asset/image/side.png);
|
||||
background-size: cover;
|
||||
padding-top: 48px;
|
||||
padding-top: calc(@layout-header-height + 12px);
|
||||
:deep(.ant-layout-sider-children) {
|
||||
background-color: transparent;
|
||||
// background-color: transparent;
|
||||
.ant-menu-root {
|
||||
background-color: transparent;
|
||||
// background-color: transparent;
|
||||
}
|
||||
.ant-menu-submenu-title {
|
||||
// color: rgba(255, 255, 255, 0.9);
|
||||
// color: @black;
|
||||
.ant-menu-submenu-arrow {
|
||||
// color:inherit
|
||||
// color: rgba(255, 255, 255, 0.9);
|
||||
// color: @black;
|
||||
}
|
||||
}
|
||||
.ant-menu {
|
||||
color: rgba(255, 255, 255, 0.9);
|
||||
color: @black;
|
||||
}
|
||||
.ant-menu-item a {
|
||||
color: rgba(255, 255, 255, 0.9);
|
||||
// color: rgba(255, 255, 255, 0.9);
|
||||
}
|
||||
.ant-menu-submenu-expand-icon,
|
||||
.ant-menu-submenu-arrow {
|
||||
color: rgba(255, 255, 255, 0.9);
|
||||
// color: rgba(255, 255, 255, 0.9);
|
||||
}
|
||||
.ant-menu-sub.ant-menu-inline {
|
||||
background-color: #001027;
|
||||
// background-color: #001027;
|
||||
}
|
||||
}
|
||||
}
|
||||
@@ -254,12 +266,14 @@
|
||||
margin-left: 8px !important;
|
||||
}
|
||||
.ns-left-menu-space {
|
||||
width: 208px;
|
||||
height: 100%;
|
||||
background-color: #fff;
|
||||
width: 100%;
|
||||
height: auto;
|
||||
z-index: 9;
|
||||
box-shadow: @ns-box-shadow;
|
||||
// background-color: #fff;
|
||||
overflow: hidden;
|
||||
transition: all 0.2s;
|
||||
flex: 0 0 208px;
|
||||
flex: 0 0 @layout-sider-width;
|
||||
&.ns-left-menu-space-collapsed {
|
||||
width: 48px;
|
||||
flex: 0 0 48px;
|
||||
@@ -279,14 +293,14 @@
|
||||
}
|
||||
|
||||
.ns-left-menu-trigger {
|
||||
width: 208px;
|
||||
width: @layout-sider-width;
|
||||
height: 40px;
|
||||
transition: all 0.2s;
|
||||
border-top: 1px solid rgba(0, 0, 0, 0.06);
|
||||
position: absolute;
|
||||
z-index: 999;
|
||||
cursor: pointer;
|
||||
background: #163361;
|
||||
// background: #163361;
|
||||
bottom: 0px;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
@@ -329,7 +343,7 @@
|
||||
position: absolute;
|
||||
width: 2px;
|
||||
height: 14px;
|
||||
background: #fff;
|
||||
// background: #fff;
|
||||
border: unset;
|
||||
top: 14px;
|
||||
left: 20px;
|
||||
@@ -341,7 +355,7 @@
|
||||
position: absolute;
|
||||
width: 2px;
|
||||
height: 14px;
|
||||
background: #fff;
|
||||
// background: #fff;
|
||||
border: unset;
|
||||
top: 14px;
|
||||
left: 40px;
|
||||
@@ -361,6 +375,6 @@
|
||||
border-radius: 4px;
|
||||
}
|
||||
:deep(.ns-left-menu .ant-layout-sider-children .ant-menu-submenu-arrow) {
|
||||
color: rgba(255, 255, 255, 0.5);
|
||||
// color: rgba(255, 255, 255, 0.5);
|
||||
}
|
||||
</style>
|
||||
|
@@ -266,7 +266,7 @@
|
||||
display: flex;
|
||||
align-items: center;
|
||||
position: fixed;
|
||||
top: 48px;
|
||||
top: @layout-header-height;
|
||||
z-index: 505;
|
||||
}
|
||||
#iframeApplication .ns-tabs {
|
||||
@@ -281,7 +281,7 @@
|
||||
display: flex;
|
||||
align-items: center;
|
||||
position: fixed;
|
||||
top: 48px;
|
||||
top: @layout-header-height;
|
||||
z-index: 505;
|
||||
}
|
||||
:deep(.ant-tabs-nav) {
|
||||
|
@@ -1,7 +1,9 @@
|
||||
<!-- @format -->
|
||||
|
||||
<template>
|
||||
<div :class="leftMenuTrigger ? 'nav-shutters-collapsed' : 'nav-shutters'">
|
||||
<div
|
||||
class="nav-shutters-container"
|
||||
:class="leftMenuTrigger ? 'nav-shutters-collapsed' : 'nav-shutters'">
|
||||
<div class="shutters-left">
|
||||
<ns-icon
|
||||
@click.stop="moveTags('right')"
|
||||
@@ -17,11 +19,11 @@
|
||||
:id="selectTags.path === item.path ? 'ischoice' : ''">
|
||||
<span>{{ isdisabledl || isdisabledr ? item.title.substring(0, 4) : item.title }}</span>
|
||||
<ns-icon
|
||||
style="min-width: 12px; min-height: 12px; color: rgba(0, 0, 0, 0.45)"
|
||||
v-if="item.path !== baseHeader.redirect"
|
||||
name="close"
|
||||
@click="delTags($event, item)" /> </li
|
||||
></div>
|
||||
@click="delTags($event, item)" />
|
||||
</li>
|
||||
</div>
|
||||
</ul>
|
||||
</div>
|
||||
<div class="shutters-right">
|
||||
@@ -173,8 +175,8 @@
|
||||
if (str !== '') {
|
||||
offset = str.match(/\d+/)[0];
|
||||
}
|
||||
this.left = offsetLeft + menuMinWidth * (i - 1) - 50 - offset;
|
||||
this.top = offsetTop;
|
||||
this.left = offsetLeft + menuMinWidth * (i - 1) - 30 - offset;
|
||||
this.top = offsetTop - 20;
|
||||
this.visible = true;
|
||||
}
|
||||
},
|
||||
@@ -276,29 +278,33 @@
|
||||
|
||||
<style lang="less" scoped>
|
||||
.nav-shutters {
|
||||
width: calc(100% - 208px);
|
||||
width: calc(100% - @layout-sider-width);
|
||||
// padding: 0 12px;
|
||||
min-height: 32px;
|
||||
height: 32px;
|
||||
min-height: @ns-nav-shutters-height;
|
||||
height: @ns-nav-shutters-height;
|
||||
background: #ffffff;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
position: fixed;
|
||||
top: 48px;
|
||||
top: @layout-header-height;
|
||||
z-index: 2;
|
||||
border-bottom: 1px solid rgba(0, 0, 0, 0.05);
|
||||
}
|
||||
.nav-shutters-collapsed {
|
||||
width: calc(100% - 40px);
|
||||
// padding: 0 12px;
|
||||
min-height: 32px;
|
||||
height: 32px;
|
||||
min-height: @ns-nav-shutters-height;
|
||||
height: @ns-nav-shutters-height;
|
||||
background: #ffffff;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
position: fixed;
|
||||
top: 48px;
|
||||
z-index: 505;
|
||||
top: @layout-header-height;
|
||||
z-index: 10;
|
||||
}
|
||||
.nav-shutters-container {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
}
|
||||
.shutters-left {
|
||||
height: @ns-nav-shutters-height;
|
||||
@@ -312,8 +318,8 @@
|
||||
.icon_kj {
|
||||
mix-blend-mode: normal;
|
||||
cursor: pointer;
|
||||
width: 12px !important;
|
||||
height: 12px !important;
|
||||
// width: 12px !important;
|
||||
// height: 12px !important;
|
||||
}
|
||||
}
|
||||
.shutters-right {
|
||||
@@ -327,8 +333,8 @@
|
||||
justify-content: center;
|
||||
.icon_kt {
|
||||
cursor: pointer;
|
||||
width: 12px !important;
|
||||
height: 12px !important;
|
||||
// width: 12px !important;
|
||||
// height: 12px !important;
|
||||
transform: rotateY(180deg);
|
||||
}
|
||||
}
|
||||
@@ -339,8 +345,9 @@
|
||||
}
|
||||
|
||||
.fatherTags {
|
||||
width: calc(100% - 64px);
|
||||
height: 31px;
|
||||
flex: 1;
|
||||
// width: calc(100% - 64px);
|
||||
height: @ns-nav-shutters-height;
|
||||
min-width: 400px;
|
||||
overflow: hidden;
|
||||
}
|
||||
@@ -395,10 +402,21 @@
|
||||
}
|
||||
}
|
||||
#ischoice {
|
||||
background-color: #f5f9fb;
|
||||
// background-color: #f5f9fb;
|
||||
position: relative;
|
||||
&::after {
|
||||
position: absolute;
|
||||
content: '';
|
||||
bottom: 0;
|
||||
width: 30%;
|
||||
height: 3px;
|
||||
background-color: @primary-color;
|
||||
left: 50%;
|
||||
transform: translateX(-50%);
|
||||
}
|
||||
}
|
||||
#ischoice span {
|
||||
color: @text-color !important;
|
||||
color: @primary-color !important;
|
||||
}
|
||||
.checkBox {
|
||||
height: 200px;
|
||||
@@ -419,7 +437,7 @@
|
||||
position: absolute;
|
||||
list-style-type: none;
|
||||
padding: 5px 0;
|
||||
border-radius: 2px;
|
||||
border-radius: @border-radius-base;
|
||||
font-size: 12px;
|
||||
font-weight: 400;
|
||||
color: #333;
|
||||
|