This commit is contained in:
2025-09-18 10:13:12 +08:00
parent 81dbaab83c
commit b8114fe989
5 changed files with 28 additions and 71 deletions

BIN
607Vue.rar Normal file

Binary file not shown.

View File

@@ -4,7 +4,11 @@
<meta charset="utf-8"> <meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge"> <meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width,initial-scale=1.0"> <meta name="viewport" content="width=device-width,initial-scale=1.0">
<meta name="theme-color" content="#ffffff">
<link rel="icon" href="<%= BASE_URL %>favicon.ico"> <link rel="icon" href="<%= BASE_URL %>favicon.ico">
<link rel="preconnect" href="https://fonts.googleapis.com">
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
<link href="https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600;700&display=swap" rel="stylesheet">
<title><%= htmlWebpackPlugin.options.title %></title> <title><%= htmlWebpackPlugin.options.title %></title>
</head> </head>
<body> <body>

View File

@@ -13,11 +13,11 @@ export default {
<style> <style>
#app { #app {
font-family: 'Avenir', Helvetica, Arial, sans-serif; font-family: Inter, "Segoe UI", Roboto, "Helvetica Neue", Arial, "Noto Sans", "PingFang SC", "Hiragino Sans GB", "Microsoft YaHei", "Source Han Sans SC", sans-serif;
-webkit-font-smoothing: antialiased; -webkit-font-smoothing: antialiased;
-moz-osx-font-smoothing: grayscale; -moz-osx-font-smoothing: grayscale;
text-align: center;
color: #2c3e50; color: #2c3e50;
margin-top: 60px; margin: 0;
text-align: initial;
} }
</style> </style>

View File

@@ -1,5 +1,7 @@
import Vue from 'vue' import Vue from 'vue'
import Element from 'element-ui' import Element from 'element-ui'
import 'element-ui/lib/theme-chalk/index.css' import 'element-ui/lib/theme-chalk/index.css'
import locale from 'element-ui/lib/locale/lang/zh-CN'
Vue.use(Element) Vue.prototype.$ELEMENT = { size: 'small', zIndex: 3000 }
Vue.use(Element, { locale })

View File

@@ -11,7 +11,6 @@
</div> </div>
</div> </div>
<div class="header-right"> <div class="header-right">
<el-tag type="info" effect="plain">必填项带"*"</el-tag>
</div> </div>
</div> </div>
</el-card> </el-card>
@@ -441,23 +440,11 @@ export default {
align-items: center; align-items: center;
} }
.title-wrap { .title-wrap { margin-left: 10px; }
margin-left: 10px; .title { font-size: 18px; font-weight: 600; }
} .subtitle { color: var(--text-secondary); font-size: 12px; }
.title { .card-block { margin-bottom: 12px; }
font-size: 18px;
font-weight: 600;
}
.subtitle {
color: #909399;
font-size: 12px;
}
.card-block {
margin-bottom: 12px;
}
.card-header { .card-header {
display: flex; display: flex;
@@ -465,13 +452,8 @@ export default {
font-weight: 600; font-weight: 600;
} }
.card-header i { .card-header i { margin-right: 6px; }
margin-right: 6px; .card-header.warn { color: #e6a23c; }
}
.card-header.warn {
color: #e6a23c;
}
.section-body { .section-body {
background: #f5f7fa; background: #f5f7fa;
@@ -483,13 +465,11 @@ export default {
/* 禁止label换行避免中文被折到下一行导致错位 */ /* 禁止label换行避免中文被折到下一行导致错位 */
.fault-form-page >>> .el-form-item__label { .fault-form-page >>> .el-form-item__label {
white-space: nowrap; white-space: nowrap;
padding-right: 0; /* 贴近输入框 */ padding-right: 12px;
} }
/* 必填星号与文字更紧凑 */ /* 必填星号与文字更紧凑 */
.fault-form-page >>> .el-form-item.is-required .el-form-item__label:before { .fault-form-page >>> .el-form-item.is-required .el-form-item__label:before { margin-right: 2px; }
margin-right: 2px;
}
/* 统一 small 尺寸表单项的垂直对齐和行高 */ /* 统一 small 尺寸表单项的垂直对齐和行高 */
.fault-form-page >>> .el-form-item--small .el-form-item__label { .fault-form-page >>> .el-form-item--small .el-form-item__label {
@@ -497,7 +477,7 @@ export default {
height: 32px; height: 32px;
display: inline-flex; display: inline-flex;
align-items: center; align-items: center;
justify-content: flex-end; /* 文本右对齐,贴近输入框 */ justify-content: flex-end;
vertical-align: middle; vertical-align: middle;
} }
@@ -515,49 +495,20 @@ export default {
} }
/* 全局收紧每个表单项的下间距 */ /* 全局收紧每个表单项的下间距 */
.fault-form-page >>> .el-form-item { .fault-form-page >>> .el-form-item { margin-bottom: 12px; }
margin-bottom: 12px; .status-row .el-form-item { margin-bottom: 0; }
}
.status-row .el-form-item { .form-actions { text-align: center; margin-top: 10px; }
margin-bottom: 0;
}
.form-actions {
text-align: center;
margin-top: 10px;
}
/* 问题级别选项前置彩色圆点自定义slot */ /* 问题级别选项前置彩色圆点自定义slot */
.fault-form-page >>> .el-select-dropdown__item { .fault-form-page >>> .el-select-dropdown__item { display: flex; align-items: center; }
display: flex;
align-items: center;
}
.fault-form-page >>> .el-select-dropdown__item .severity-dot { .fault-form-page >>> .el-select-dropdown__item .severity-dot {
display: inline-block; display: inline-block; width: 8px; height: 8px; margin-right: 8px; border-radius: 50%; background: #c0c4cc;
width: 8px;
height: 8px;
margin-right: 8px;
border-radius: 50%;
background: #c0c4cc;
}
.fault-form-page >>> .el-select-dropdown__item .severity-dot.重大问题 {
background: #f5222d;
}
.fault-form-page >>> .el-select-dropdown__item .severity-dot.严重问题 {
background: #f56c6c;
}
.fault-form-page >>> .el-select-dropdown__item .severity-dot.一般问题 {
background: #e6a23c;
}
.fault-form-page >>> .el-select-dropdown__item .severity-dot.建议改进 {
background: #67c23a;
} }
.fault-form-page >>> .el-select-dropdown__item .severity-dot.重大问题 { background: #f5222d; }
.fault-form-page >>> .el-select-dropdown__item .severity-dot.严重问题 { background: #f56c6c; }
.fault-form-page >>> .el-select-dropdown__item .severity-dot.一般问题 { background: #e6a23c; }
.fault-form-page >>> .el-select-dropdown__item .severity-dot.建议改进 { background: #67c23a; }
</style> </style>
<style> <style>
/* 全局样式:用于 body 上的下拉弹层,渲染问题级别的彩色圆点 */ /* 全局样式:用于 body 上的下拉弹层,渲染问题级别的彩色圆点 */