Просмотр исходного кода

修复 一些图标存在轻微偏上 问题

夜鹰 1 год назад
Родитель
Сommit
8036382861

+ 1 - 1
Web/src/components/svgIcon/index.vue

@@ -20,7 +20,7 @@ const props = defineProps({
 	// svg 大小
 	size: {
 		type: Number,
-		default: () => 16,
+		//default: () => 16,
 	},
 	// svg 颜色
 	color: {

+ 2 - 2
Web/src/layout/component/columnsAside.vue

@@ -17,14 +17,14 @@
 					:title="$t(v.meta.title)"
 				>
 					<div :class="themeConfig.columnsAsideLayout" v-if="!v.meta.isLink || (v.meta.isLink && v.meta.isIframe)">
-						<SvgIcon :name="v.meta.icon" />
+						<SvgIcon size="16" :name="v.meta.icon" />
 						<div class="columns-vertical-title font12">
 							{{ $t(v.meta.title) && $t(v.meta.title).length >= 4 ? $t(v.meta.title).substr(0, themeConfig.columnsAsideLayout === 'columns-vertical' ? 4 : 3) : $t(v.meta.title) }}
 						</div>
 					</div>
 					<div :class="themeConfig.columnsAsideLayout" v-else>
 						<a :href="v.meta.isLink" target="_blank">
-							<SvgIcon :name="v.meta.icon" />
+							<SvgIcon size="16" :name="v.meta.icon" />
 							<div class="columns-vertical-title font12">
 								{{ $t(v.meta.title) && $t(v.meta.title).length >= 4 ? $t(v.meta.title).substr(0, themeConfig.columnsAsideLayout === 'columns-vertical' ? 4 : 3) : $t(v.meta.title) }}
 							</div>

+ 1 - 4
Web/src/layout/navBars/tagsView/tagsView.vue

@@ -18,7 +18,7 @@
 					"
 				>
 					<i class="iconfont icon-webicon318 layout-navbars-tagsview-ul-li-iconfont" v-if="isActive(v)"></i>
-					<SvgIcon :name="v.meta.icon" v-if="!isActive(v) && getThemeConfig.isTagsviewIcon" class="pr5" />
+					<SvgIcon :name="v.meta.icon" v-if="!isActive(v) && getThemeConfig.isTagsviewIcon" size="14" class="mr5" />
 					<span>{{ setTagsViewNameI18n(v) }}</span>
 					<template v-if="isActive(v)">
 						<SvgIcon
@@ -642,10 +642,7 @@ watch(
 			&-icon {
 				border-radius: 100%;
 				position: relative;
-				height: 14px;
-				width: 14px;
 				text-align: center;
-				line-height: 14px;
 				right: -5px;
 				&:hover {
 					color: var(--el-color-white);

+ 2 - 1
Web/src/layout/navBars/topBar/breadcrumb.vue

@@ -131,8 +131,9 @@ onBeforeRouteUpdate((to) => {
     height: 16px;
     line-height: 16px;
 	display: flex;
+    align-items: center;
 
-    a { display: inherit; font-weight: unset; }
+    a { display: inherit; align-items: inherit; font-weight: unset; }
     i { margin-right: 5px; }
 
     &-last { opacity: 0.7; }

+ 1 - 1
Web/src/layout/navBars/topBar/search.vue

@@ -16,7 +16,7 @@
 						</el-icon>
 					</template>
 					<template #default="{ item }">
-						<div>
+						<div style="display: inline-flex; align-items: center;">
 							<SvgIcon :name="item.meta.icon" class="mr5" />
 							{{ $t(item.meta.title) }}
 						</div>

+ 14 - 0
Web/src/theme/element.scss

@@ -113,6 +113,16 @@
 .el-menu {
 	border-right: none !important;
 	width: auto;
+
+    .el-icon {
+        font-size: var(--el-font-size-medium);
+        margin-top: -1px; //由于svg图标源未按标准设计制作,存在错位误差,向上位移1px,以抵消其存在的1px高度差
+    }
+
+    .el-sub-menu__icon-arrow {
+        margin-top: 0;
+        top: unset;
+    }
 }
 
 .el-menu-item,
@@ -568,6 +578,10 @@ $--el-table-text-color: #fb6d49;
 
 .el-tree {
     --el-tree-node-content-height: 30px;
+
+    .el-tree-node__content {
+        line-height: var(--el-tree-node-content-height);
+    }
 }
 
 // hack列表页

+ 1 - 1
Web/src/views/system/job/component/editJobDetail.vue

@@ -40,7 +40,7 @@
 										<div>
 											扫描触发器
 											<el-tooltip raw-content content="此参数只在新增作业时生效<br/>扫描定义在作业上的触发器" placement="top">
-												<SvgIcon name="fa fa-question-circle-o" :size="16" style="vertical-align: middle" />
+												<SvgIcon name="fa fa-question-circle-o" :size="15" style="vertical-align: middle" />
 											</el-tooltip>
 										</div>
 									</template>

+ 1 - 1
Web/src/views/system/job/component/editJobTrigger.vue

@@ -103,7 +103,7 @@
 								<div>
 									重置触发次数
 									<el-tooltip raw-content content="是否在启动时重置最大触发次数等于一次的作业<br/>解决因持久化数据已完成一次触发但启动时不再执行的问题" placement="top">
-										<SvgIcon name="fa fa-question-circle-o" :size="16" style="vertical-align: middle" />
+										<SvgIcon name="fa fa-question-circle-o" :size="15" style="vertical-align: middle" />
 									</el-tooltip>
 								</div>
 							</template>

+ 12 - 3
Web/src/views/system/menu/index.vue

@@ -32,10 +32,12 @@
 		<el-card class="full-table" shadow="hover" style="margin-top: 5px">
 			<el-table :data="state.menuData" v-loading="state.loading" row-key="id"
 				:tree-props="{ children: 'children', hasChildren: 'hasChildren' }" border>
-				<el-table-column label="菜单名称" header-align="center" show-overflow-tooltip>
+				<el-table-column label="菜单名称" header-align="center">
 					<template #default="scope">
-						<SvgIcon :name="scope.row.icon" />
-						<span class="ml10">{{ $t(scope.row.title) }}</span>
+                        <div style="display: inline-block;">
+                            <SvgIcon :name="scope.row.icon" size="12" />
+                            <span class="ml10">{{ $t(scope.row.title) }}</span>
+                        </div>
 					</template>
 				</el-table-column>
 				<el-table-column label="类型" width="70" align="center" show-overflow-tooltip>
@@ -184,3 +186,10 @@ const changeStatus = async (row: any) => {
 		});
 };
 </script>
+
+<style lang="scss" scoped>
+.el-table .cell.el-tooltip {
+    display: inline-flex;
+    align-items: center;
+}
+</style>