style: 调整按钮样式以统一高度和内边距

将多个页面的按钮样式统一调整为高度36px,内边距改为14px,同时将圆角半径调整为8px,以提升视觉一致性和用户体验。涉及页面包括学生培训、评估、需求分析等多个模块。
fix/exam-question-access-material-excel-delete-draft
qinzhenpen 3 weeks ago
parent ec8fa801f9
commit af791f30d2

@ -728,11 +728,11 @@
gap: 8px !important;
min-width: 0 !important;
width: auto !important;
height: 40px !important;
min-height: 40px !important;
padding: 0 18px !important;
height: 36px !important;
min-height: 36px !important;
padding: 0 14px !important;
border: 1px solid rgba(31, 41, 55, 0.4) !important;
border-radius: 10px !important;
border-radius: 8px !important;
color: var(--student-accent, #1f2937) !important;
background: #ffffff !important;
box-shadow: none !important;
@ -790,13 +790,13 @@
flex: 0 0 auto !important;
min-width: 0 !important;
width: auto !important;
height: 40px !important;
min-height: 40px !important;
max-height: 40px !important;
height: 36px !important;
min-height: 36px !important;
max-height: 36px !important;
margin: 0 !important;
padding: 0 18px !important;
padding: 0 14px !important;
border: 1px solid #e5e7eb !important;
border-radius: 10px !important;
border-radius: 8px !important;
color: #1f2937 !important;
background: #ffffff !important;
font-size: 13px !important;

@ -550,10 +550,11 @@ onMounted(async () => { try { taskConfig.value = (await getTrainingTaskByKey(TAS
align-items: center;
justify-content: center;
gap: 6px;
min-height: 40px;
padding: 0 18px;
min-height: 36px;
height: 36px;
padding: 0 14px;
border: 1px solid rgba(31, 41, 55, 0.4);
border-radius: 10px;
border-radius: 8px;
color: var(--student-text);
background: #ffffff;
font: inherit;
@ -783,7 +784,8 @@ button.is-disabled {
.secondary-button,
.submit-button {
min-width: 142px;
min-height: 40px;
min-height: 36px;
height: 36px;
}
}
@ -902,8 +904,10 @@ button.is-disabled {
}
.upload-button {
min-height: 42px;
padding: 0 18px;
min-height: 36px;
height: 36px;
padding: 0 14px;
border-radius: 8px;
}
.chart-preview {

@ -586,10 +586,11 @@ onMounted(async () => {
align-items: center;
justify-content: center;
gap: 7px;
min-height: 40px;
padding: 0 16px;
min-height: 36px;
height: 36px;
padding: 0 14px;
border: 1px solid rgba(31, 41, 55, 0.4);
border-radius: 10px;
border-radius: 8px;
color: var(--student-text);
background: #ffffff;
font: inherit;
@ -804,9 +805,11 @@ button:disabled {
}
.training-actions :deep(.training-action) {
min-width: 160px;
height: 40px;
border-radius: 10px;
min-width: 140px;
height: 36px;
min-height: 36px;
padding: 0 14px;
border-radius: 8px;
border-color: var(--student-accent);
color: #ffffff;
background: var(--student-accent);

@ -1,4 +1,4 @@
<template>
<template>
<div class="channel student-training-shell">
<main class="training-core">
<section class="task-header">
@ -959,8 +959,9 @@ onMounted(async () => {
}
.taskfooter :deep(.el-button) {
min-width: 172px;
height: 56px;
min-width: 140px;
height: 36px;
padding: 0 14px;
border-radius: 8px;
font-size: var(--student-fs-h1);
font-weight: 800;
@ -980,8 +981,8 @@ onMounted(async () => {
.task-brief-more { display: grid; gap: 6px; margin-top: 8px; padding-top: 8px; border-top: 1px solid var(--student-panel-border); b { color: var(--student-text); font-size: 12px; } ul { display: grid; gap: 4px; margin: 0; padding-left: 18px; } p { margin: 0; } }
.channel-toolbar { display: flex; flex-wrap: wrap; justify-content: flex-end; gap: 10px; flex-shrink: 0; }
.task-card,.step-card { border: 1px solid var(--student-panel-border); border-radius: 26px; background: var(--student-card-bg); }.task-card { margin-top: 28px; padding: 18px 22px 22px; }.workbench-head { display: flex; justify-content: space-between; align-items: flex-start; gap: 18px; margin-bottom: 22px; padding-bottom: 18px; border-bottom: 1px solid var(--student-panel-border); }.section-eyebrow { margin: 0; color: var(--student-accent); font-size: var(--student-fs-caption); font-weight: 800; line-height: 1.4; }.workbench-head h3 { margin: 4px 0 8px; color: var(--student-text); font-size: var(--student-fs-h1); font-weight: 800; line-height: 1.3; }.workbench-description { margin: 0; color: var(--student-text-secondary); font-size: var(--student-fs-body); line-height: 1.8; }.workbench-actions { display: flex; flex-wrap: wrap; justify-content: flex-end; margin-left: auto; gap: 10px; flex-shrink: 0; }
.outline-action,.btn-nav { display: inline-flex; align-items: center; justify-content: center; gap: 8px; min-height: 40px; padding: 0 18px; border: 1px solid var(--student-panel-border); border-radius: 999px; color: var(--student-text); background: var(--student-accent-soft); font: inherit; font-size: var(--student-fs-button); font-weight: 800; cursor: pointer; }.step-indicator { display:flex; align-items:center; gap:12px; width:calc(100% + 24px); min-height:0; margin:0 -12px 32px; padding:18px 22px; overflow-x:auto; border:1px solid var(--student-panel-border); border-radius:18px; background:var(--student-card-bg); box-shadow:inset 0 1px 0 rgba(31, 41, 55, 0.04); }.step-tab { display:flex; flex:1 0 145px; align-items:center; min-height:66px; padding:8px 10px; border:1px solid var(--student-panel-border); border-radius:8px; color:var(--student-text-secondary); background:var(--student-card-bg); font:inherit; font-size:var(--student-fs-body); font-weight:800; text-align:left; cursor:pointer; transition:transform .2s,color .2s,background .2s,border-color .2s,box-shadow .2s; }.step-tab:hover,.step-tab:focus-visible { transform:translateY(-2px); border-color:var(--student-accent); color:#ffffff; background:var(--student-accent-light); box-shadow:0 8px 18px rgba(0,0,0,.1); outline:none; }.step-tab.active { border-color:var(--student-accent); color:#ffffff; background:var(--student-accent); box-shadow:0 8px 20px rgba(31, 41, 55, 0.18); }.step-marker { display:inline-flex; flex:0 0 38px; align-items:center; justify-content:center; width:38px; height:38px; border:1px solid var(--student-panel-border); border-radius:50%; color:var(--student-text-secondary); background:var(--student-card-bg); font-size:var(--student-fs-body-sm); font-weight:900; }.step-copy { display:grid; min-width:0; gap:4px; margin-left:10px; }.step-copy strong { display:-webkit-box; overflow:hidden; color:inherit; font-size:var(--student-fs-body); line-height:1.25; -webkit-box-orient:vertical; -webkit-line-clamp:2; }.step-copy span { color:var(--student-text-secondary); font-size:var(--student-fs-caption); font-weight:700; }.step-tab.active .step-marker { border-color:var(--student-accent); color:#ffffff; background:var(--student-accent); box-shadow:0 0 0 4px rgba(31, 41, 55, 0.1); }.step-tab.complete .step-marker { border-color:var(--student-success); color:#ffffff; background:var(--student-success); }.step-connector { flex:0 0 28px; height:2px; background:var(--student-panel-border); color:var(--student-text-secondary); font-size:var(--student-fs-h2); line-height:0; text-align:right; }.step-connector.complete { background:var(--student-success); color:var(--student-success); }.step-card { margin-top: 32px; padding: 18px 22px 22px; }.step-indicator + .step-card,.workbench-head + .step-card { margin-top: 0; }.step-title-row { margin-bottom: 14px; }.step-title-row h3 { margin: 4px 0 0; color: var(--student-text); font-size: var(--student-fs-h2); font-weight: 900; line-height: 1.3; }.caseBacktitle { display: flex; align-items: center; gap: 8px; margin: 20px 0 10px; color: var(--student-text-secondary); font-size: var(--student-fs-h2); font-weight: 800; }.caseBacktitle img { display: none; }.step-card > p { color: var(--student-text-secondary); font-size: var(--student-fs-body); line-height: 1.8; }
:deep(.el-table) { width: 100% !important; max-width: 100%; border-radius: 18px; }:deep(.el-table th.el-table__cell) { background: #fafbfc !important; }:deep(.el-input__wrapper) { min-height: 42px; border-radius: 14px; background: #ffffff; }.online { border-radius: 14px; background: var(--student-panel-bg); }.step-navigation { display: flex; justify-content: center; gap: 14px; margin-top: 22px; }.btn-nav.btn-save,.btn-nav.btn-primary { border-color: var(--student-accent); color: #ffffff; background: var(--student-accent); }.btn-nav:disabled { cursor: not-allowed; opacity: .45; }.taskfooter { gap: 52px; margin-top: 36px; padding-top: 0; border-top: 0; }.taskfooter :deep(.el-button) { min-width: 172px; height: 64px; border: 1px solid var(--student-panel-border) !important; border-radius: 6px; color: var(--student-text) !important; background: var(--student-accent-soft) !important; font-size: var(--student-fs-h1); font-weight: 900; }
.outline-action,.btn-nav { display: inline-flex; align-items: center; justify-content: center; gap: 8px; min-height: 36px; height: 36px; padding: 0 14px; border: 1px solid var(--student-panel-border); border-radius: 8px; color: var(--student-text); background: var(--student-accent-soft); font: inherit; font-size: var(--student-fs-button); font-weight: 800; cursor: pointer; }.step-indicator { display:flex; align-items:center; gap:12px; width:calc(100% + 24px); min-height:0; margin:0 -12px 32px; padding:18px 22px; overflow-x:auto; border:1px solid var(--student-panel-border); border-radius:18px; background:var(--student-card-bg); box-shadow:inset 0 1px 0 rgba(31, 41, 55, 0.04); }.step-tab { display:flex; flex:1 0 145px; align-items:center; min-height:66px; padding:8px 10px; border:1px solid var(--student-panel-border); border-radius:8px; color:var(--student-text-secondary); background:var(--student-card-bg); font:inherit; font-size:var(--student-fs-body); font-weight:800; text-align:left; cursor:pointer; transition:transform .2s,color .2s,background .2s,border-color .2s,box-shadow .2s; }.step-tab:hover,.step-tab:focus-visible { transform:translateY(-2px); border-color:var(--student-accent); color:#ffffff; background:var(--student-accent-light); box-shadow:0 8px 18px rgba(0,0,0,.1); outline:none; }.step-tab.active { border-color:var(--student-accent); color:#ffffff; background:var(--student-accent); box-shadow:0 8px 20px rgba(31, 41, 55, 0.18); }.step-marker { display:inline-flex; flex:0 0 38px; align-items:center; justify-content:center; width:38px; height:38px; border:1px solid var(--student-panel-border); border-radius:50%; color:var(--student-text-secondary); background:var(--student-card-bg); font-size:var(--student-fs-body-sm); font-weight:900; }.step-copy { display:grid; min-width:0; gap:4px; margin-left:10px; }.step-copy strong { display:-webkit-box; overflow:hidden; color:inherit; font-size:var(--student-fs-body); line-height:1.25; -webkit-box-orient:vertical; -webkit-line-clamp:2; }.step-copy span { color:var(--student-text-secondary); font-size:var(--student-fs-caption); font-weight:700; }.step-tab.active .step-marker { border-color:var(--student-accent); color:#ffffff; background:var(--student-accent); box-shadow:0 0 0 4px rgba(31, 41, 55, 0.1); }.step-tab.complete .step-marker { border-color:var(--student-success); color:#ffffff; background:var(--student-success); }.step-connector { flex:0 0 28px; height:2px; background:var(--student-panel-border); color:var(--student-text-secondary); font-size:var(--student-fs-h2); line-height:0; text-align:right; }.step-connector.complete { background:var(--student-success); color:var(--student-success); }.step-card { margin-top: 32px; padding: 18px 22px 22px; }.step-indicator + .step-card,.workbench-head + .step-card { margin-top: 0; }.step-title-row { margin-bottom: 14px; }.step-title-row h3 { margin: 4px 0 0; color: var(--student-text); font-size: var(--student-fs-h2); font-weight: 900; line-height: 1.3; }.caseBacktitle { display: flex; align-items: center; gap: 8px; margin: 20px 0 10px; color: var(--student-text-secondary); font-size: var(--student-fs-h2); font-weight: 800; }.caseBacktitle img { display: none; }.step-card > p { color: var(--student-text-secondary); font-size: var(--student-fs-body); line-height: 1.8; }
:deep(.el-table) { width: 100% !important; max-width: 100%; border-radius: 18px; }:deep(.el-table th.el-table__cell) { background: #fafbfc !important; }:deep(.el-input__wrapper) { min-height: 42px; border-radius: 14px; background: #ffffff; }.online { border-radius: 14px; background: var(--student-panel-bg); }.step-navigation { display: flex; justify-content: center; gap: 14px; margin-top: 22px; }.btn-nav.btn-save,.btn-nav.btn-primary { border-color: var(--student-accent); color: #ffffff; background: var(--student-accent); min-height: 36px; height: 36px; padding: 0 14px; border-radius: 8px; }.btn-nav:disabled { cursor: not-allowed; opacity: .45; }.taskfooter { gap: 52px; margin-top: 36px; padding-top: 0; border-top: 0; }.taskfooter :deep(.el-button) { min-width: 140px; height: 36px; padding: 0 14px; border: 1px solid var(--student-panel-border) !important; border-radius: 8px; color: var(--student-text) !important; background: var(--student-accent-soft) !important; font-size: var(--student-fs-h1); font-weight: 900; }
}
@media (max-width: 1100px) { .channel { grid-template-columns: 1fr; } }
@media (max-width: 900px) { .channel { padding: 14px; .training-core { padding: 18px; border-radius: 24px; }.workbench-head,.workbench-actions,.step-navigation { flex-direction: column; align-items: stretch; }.workbench-actions,.outline-action,.btn-nav,.taskfooter :deep(.el-button) { width: 100%; }.step-indicator { align-items:stretch; flex-direction:column; width:100%; margin-right:0; margin-left:0; overflow:visible; border-radius:20px; }.step-tab { flex:0 0 auto; width:100%; }.step-connector { flex:0 0 22px; width:2px; height:22px; margin-left:29px; text-align:center; writing-mode:vertical-rl; }.taskfooter { gap: 14px; } } }

@ -820,10 +820,11 @@ onMounted(async () => {
.page-actions :deep(.el-button),
.row-actions :deep(.el-button) {
height: 40px;
padding: 0 18px;
height: 36px;
min-height: 36px;
padding: 0 14px;
border: 1px solid rgba(31, 41, 55, 0.4);
border-radius: 10px;
border-radius: 8px;
color: var(--student-text);
background: #ffffff;
font-size: var(--student-fs-button);

@ -261,7 +261,7 @@ function exportLegacyTraining() {
<style lang="scss" scoped>
.training-task-toolbar { display:flex; flex-wrap:wrap; align-items:center; justify-content:flex-end; gap:8px; }
.task-toolbar-button { min-height:32px; padding:0 10px; border-color:rgba(99,217,255,.55); border-radius:7px; color:#e9fbff; background:rgba(17,126,178,.36); font-size:13px; font-weight:800; }
.task-toolbar-button { min-height:36px; height:36px; padding:0 14px; border-color:rgba(99,217,255,.55); border-radius:8px; color:#e9fbff; background:rgba(17,126,178,.36); font-size:13px; font-weight:800; }
.task-toolbar-button:hover { border-color:rgba(116,235,255,.85); color:#e9fbff; background:rgba(18,146,204,.5); }
.task-toolbar-button--submit { border-color:rgba(66,224,187,.7); background:rgba(13,137,111,.34); }
.task-toolbar-button--submit:hover { border-color:rgba(100,245,208,.9); background:rgba(14,164,132,.45); }

@ -456,7 +456,7 @@ function exportOutcome() { const blob = new Blob([JSON.stringify({ task: taskTit
</script>
<style lang="scss" scoped>
/* 页面级令牌(教育蓝极简主题) */
/* ===== 页面级令牌(教育蓝极简主题) ===== */
.feasibility-page {
--student-accent: #2563eb;
--student-accent-deep: #1d4ed8;
@ -494,7 +494,17 @@ function exportOutcome() { const blob = new Blob([JSON.stringify({ task: taskTit
--student-fs-button: 13px;
--student-fs-button-lg: 13px;
--student-fs-data: 14px;
min-width: 0;
position: relative;
z-index: 2;
display: grid;
grid-template-columns: minmax(720px, 1fr) 340px;
gap: 24px;
width: 100%;
max-width: 100%;
min-height: calc(100vh - 106px);
margin: 0;
padding: 24px 24px 32px;
color: var(--student-text);
background: #ffffff;
line-height: 1.55;

@ -167,7 +167,16 @@ function exportOutcome() { const blob = new Blob([JSON.stringify(buildDraft(), n
--student-fs-button-lg: 13px;
--student-fs-data: 14px;
min-width: 0;
position: relative;
z-index: 2;
display: grid;
grid-template-columns: minmax(720px, 1fr) 340px;
gap: 24px;
width: 100%;
max-width: 100%;
min-height: calc(100vh - 106px);
margin: 0;
padding: 24px 24px 32px;
color: var(--student-text);
background: #ffffff;
}
@ -589,10 +598,11 @@ function exportOutcome() { const blob = new Blob([JSON.stringify(buildDraft(), n
align-items: center;
justify-content: center;
gap: 6px;
min-height: 40px;
padding: 0 18px;
min-height: 36px;
height: 36px;
padding: 0 14px;
border: 1px solid rgba(37, 99, 235, 0.45);
border-radius: 10px;
border-radius: 8px;
color: var(--student-text);
background: #ffffff;
font-size: var(--student-fs-button);
@ -637,10 +647,11 @@ function exportOutcome() { const blob = new Blob([JSON.stringify(buildDraft(), n
align-items: center;
justify-content: center;
gap: 6px;
min-height: 40px;
padding: 0 18px;
min-height: 36px;
height: 36px;
padding: 0 14px;
border: 1px solid rgba(37, 99, 235, 0.45);
border-radius: 10px;
border-radius: 8px;
color: var(--student-accent);
background: #ffffff;
font-size: 13px;

@ -1,4 +1,4 @@
<template>
<template>
<div class="consumer-behavior-page student-training-shell">
<main class="training-core">
<section class="task-header">
@ -1131,10 +1131,11 @@ function downloadSurveyReportTemplate() {
align-items: center;
justify-content: center;
gap: 8px;
min-height: 40px;
padding: 0 18px;
min-height: 36px;
height: 36px;
padding: 0 14px;
border: 1px solid rgba(37, 99, 235, 0.45);
border-radius: 10px;
border-radius: 8px;
color: var(--student-accent);
background: #ffffff;
font-family: inherit;
@ -1725,8 +1726,9 @@ function downloadSurveyReportTemplate() {
.nav-action {
min-height: 36px;
padding: 0 18px;
border-radius: 10px;
height: 36px;
padding: 0 14px;
border-radius: 8px;
font-size: var(--student-fs-button);
font-weight: 700;
}
@ -1945,9 +1947,9 @@ function downloadSurveyReportTemplate() {
min-width: 140px !important;
min-height: 36px !important;
height: 36px !important;
padding: 0 20px !important;
padding: 0 14px !important;
border: 1px solid rgba(37, 99, 235, 0.45) !important;
border-radius: 10px !important;
border-radius: 8px !important;
color: var(--student-accent) !important;
background: #ffffff !important;
font-size: 13px !important;
@ -1986,9 +1988,10 @@ function downloadSurveyReportTemplate() {
/* === nav-action (step-actions) === */
#app .studentLayout section.app-main:has(.consumer-behavior-page) .step-actions .el-button.nav-action {
min-height: 36px !important;
padding: 0 18px !important;
height: 36px !important;
padding: 0 14px !important;
border: 1px solid rgba(37, 99, 235, 0.45) !important;
border-radius: 10px !important;
border-radius: 8px !important;
color: var(--student-accent) !important;
background: #ffffff !important;
font-size: 13px !important;

@ -956,7 +956,16 @@ function exportOutcome() {
--student-fs-button-lg: 13px;
--student-fs-data: 14px;
min-width: 0;
position: relative;
z-index: 2;
display: grid;
grid-template-columns: minmax(720px, 1fr) 340px;
gap: 24px;
width: 100%;
max-width: 100%;
min-height: calc(100vh - 106px);
margin: 0;
padding: 24px 24px 32px;
color: var(--student-text);
background: #ffffff;
}
@ -1592,7 +1601,7 @@ function exportOutcome() {
justify-content: center;
gap: 6px;
min-width: 112px;
min-height: 40px;
min-height: 36px;
padding: 0 18px;
border: 1px solid rgba(37, 99, 235, 0.45);
border-radius: 10px;
@ -1898,8 +1907,8 @@ function exportOutcome() {
* ============================================================ */
#app .studentLayout section.app-main:has(.consumer-scenario-page) .training-actions .el-button.training-action {
min-width: 140px !important;
min-height: 40px !important;
height: 40px !important;
min-height: 36px !important;
height: 36px !important;
padding: 0 20px !important;
border: 1px solid rgba(37, 99, 235, 0.45) !important;
border-radius: 10px !important;

@ -594,10 +594,11 @@ function exportOutcome() {
display: inline-flex;
align-items: center;
justify-content: center;
min-height: 40px;
padding: 0 18px;
min-height: 36px;
height: 36px;
padding: 0 14px;
border: 1px solid #bfdbfe;
border-radius: 999px;
border-radius: 8px;
color: var(--student-text);
background: #eff6ff;
font-size: var(--student-fs-button);
@ -954,10 +955,11 @@ function exportOutcome() {
.training-actions :deep(.training-action) {
min-width: 172px;
height: 64px;
padding: 0 28px;
height: 36px;
min-height: 36px;
padding: 0 14px;
border: 1px solid #2563eb;
border-radius: 6px;
border-radius: 8px;
color: #374151;
background: #eff6ff;
box-shadow: none;
@ -998,9 +1000,10 @@ function exportOutcome() {
}
.step-actions :deep(.step-action-btn) {
min-height: 40px;
padding: 0 18px;
border-radius: 999px;
min-height: 36px;
height: 36px;
padding: 0 14px;
border-radius: 8px;
font-size: var(--student-fs-button);
font-weight: 800;
}

@ -741,7 +741,16 @@ function exportOutcome() {
--student-fs-button-lg: 13px;
--student-fs-data: 14px;
min-width: 0;
position: relative;
z-index: 2;
display: grid;
grid-template-columns: minmax(720px, 1fr) 340px;
gap: 24px;
width: 100%;
max-width: 100%;
min-height: calc(100vh - 106px);
margin: 0;
padding: 24px 24px 32px;
color: var(--student-text);
background: #ffffff;
}
@ -892,10 +901,11 @@ function exportOutcome() {
align-items: center;
justify-content: center;
gap: 8px;
min-height: 40px;
padding: 0 18px;
min-height: 36px;
height: 36px;
padding: 0 14px;
border: 1px solid rgba(37, 99, 235, 0.45);
border-radius: 10px;
border-radius: 8px;
color: var(--student-accent);
background: #ffffff;
font-size: 13px;
@ -1302,10 +1312,11 @@ function exportOutcome() {
align-items: center;
justify-content: center;
gap: 8px;
min-height: 40px;
padding: 0 18px;
min-height: 36px;
height: 36px;
padding: 0 14px;
border: 1px solid rgba(37, 99, 235, 0.45);
border-radius: 10px;
border-radius: 8px;
color: var(--student-text);
background: #ffffff;
font-size: var(--student-fs-button);
@ -1704,11 +1715,11 @@ function exportOutcome() {
#app .studentLayout section.app-main:has(.feature-conversion-page) .training-actions .el-button.training-action {
min-width: 140px !important;
min-height: 40px !important;
height: 40px !important;
padding: 0 20px !important;
min-height: 36px !important;
height: 36px !important;
padding: 0 14px !important;
border: 1px solid rgba(37, 99, 235, 0.45) !important;
border-radius: 10px !important;
border-radius: 8px !important;
color: #2563eb !important;
background: #ffffff !important;
font-size: 13px !important;

@ -598,10 +598,11 @@ function exportOutcome() {
display: inline-flex;
align-items: center;
justify-content: center;
min-height: 40px;
padding: 0 18px;
min-height: 36px;
height: 36px;
padding: 0 14px;
border: 1px solid #bfdbfe;
border-radius: 999px;
border-radius: 8px;
color: var(--student-text);
background: #eff6ff;
font-size: var(--student-fs-button);
@ -968,10 +969,11 @@ function exportOutcome() {
.training-actions :deep(.training-action) {
min-width: 172px;
height: 64px;
padding: 0 28px;
height: 36px;
min-height: 36px;
padding: 0 14px;
border: 1px solid #2563eb;
border-radius: 6px;
border-radius: 8px;
color: #374151;
background: #eff6ff;
box-shadow: none;
@ -1012,9 +1014,10 @@ function exportOutcome() {
}
.step-actions :deep(.step-action-btn) {
min-height: 40px;
padding: 0 18px;
border-radius: 999px;
min-height: 36px;
height: 36px;
padding: 0 14px;
border-radius: 8px;
font-size: var(--student-fs-button);
font-weight: 800;
}

@ -621,10 +621,11 @@ function exportOutcome() { const blob = new Blob([JSON.stringify(buildDraft(), n
align-items: center;
justify-content: center;
gap: 6px;
min-height: 40px;
padding: 0 18px;
min-height: 36px;
height: 36px;
padding: 0 14px;
border: 1px solid rgba(37, 99, 235, 0.45);
border-radius: 10px;
border-radius: 8px;
color: var(--student-text);
background: #ffffff;
font-size: var(--student-fs-button);

@ -862,9 +862,7 @@ function exportOutcome() {
</script>
<style lang="scss" scoped>
/* ==========================================================
* 页面级令牌(教育蓝极简主题):纯白画布 + 教育蓝主操作 + 中性灰层次
* ========================================================== */
/* ===== 页面级令牌(教育蓝极简主题) ===== */
.target-profile-page {
--student-accent: #2563eb;
--student-accent-deep: #1d4ed8;
@ -903,7 +901,17 @@ function exportOutcome() {
--student-fs-button: 13px;
--student-fs-button-lg: 13px;
--student-fs-data: 14px;
min-width: 0;
position: relative;
z-index: 2;
display: grid;
grid-template-columns: minmax(720px, 1fr) 340px;
gap: 24px;
width: 100%;
max-width: 100%;
min-height: calc(100vh - 106px);
margin: 0;
padding: 24px 24px 32px;
color: var(--student-text);
}
@ -1071,10 +1079,11 @@ function exportOutcome() {
align-items: center;
justify-content: center;
gap: 8px;
min-height: 40px;
padding: 0 18px;
min-height: 36px;
height: 36px;
padding: 0 14px;
border: 1px solid rgba(37, 99, 235, 0.45);
border-radius: 10px;
border-radius: 8px;
color: var(--student-accent);
background: #ffffff;
font-family: inherit;
@ -2002,13 +2011,14 @@ function exportOutcome() {
.training-actions :deep(.training-action) {
min-width: 160px;
height: 44px;
padding: 0 22px;
height: 36px;
min-height: 36px;
padding: 0 14px;
border: 1px solid rgba(37, 99, 235, 0.45);
border-radius: 10px;
border-radius: 8px;
color: var(--student-accent);
background: #ffffff;
font-size: 14px;
font-size: 13px;
font-weight: 700;
line-height: 1;
text-shadow: none;
@ -2375,7 +2385,11 @@ function exportOutcome() {
* 底部步骤按钮:step-action
* ============================================================ */
#app .studentLayout section.app-main:has(.target-profile-page) .step-actions .el-button.step-action {
height: 36px !important;
min-height: 36px !important;
padding: 0 14px !important;
border: 1px solid rgba(37, 99, 235, 0.45) !important;
border-radius: 8px !important;
color: #2563eb !important;
background: #ffffff !important;
box-shadow: none !important;
@ -2419,7 +2433,11 @@ function exportOutcome() {
* 底部提交/清空:training-actions
* ============================================================ */
#app .studentLayout section.app-main:has(.target-profile-page) .training-actions .el-button.training-action {
height: 36px !important;
min-height: 36px !important;
padding: 0 14px !important;
border: 1px solid rgba(37, 99, 235, 0.45) !important;
border-radius: 8px !important;
color: #2563eb !important;
background: #ffffff !important;
box-shadow: none !important;

@ -1204,8 +1204,9 @@ function exportOutcome() {
align-items: center;
justify-content: center;
gap: 6px;
min-height: 38px;
padding: 0 16px;
min-height: 36px;
height: 36px;
padding: 0 14px;
border: 1px solid rgba(37, 99, 235, 0.35);
border-radius: 8px;
color: var(--student-accent);
@ -1702,8 +1703,9 @@ function exportOutcome() {
align-items: center;
justify-content: center;
gap: 6px;
min-height: 38px;
padding: 0 18px;
min-height: 36px;
height: 36px;
padding: 0 14px;
border: 1px solid var(--student-accent);
border-radius: 8px;
color: #ffffff;
@ -1737,8 +1739,9 @@ function exportOutcome() {
align-items: center;
justify-content: center;
gap: 6px;
min-height: 38px;
padding: 0 16px;
min-height: 36px;
height: 36px;
padding: 0 14px;
border: 1px solid rgba(37, 99, 235, 0.35);
border-radius: 8px;
color: var(--student-accent);
@ -1767,8 +1770,9 @@ function exportOutcome() {
align-items: center;
justify-content: center;
gap: 6px;
min-height: 38px;
padding: 0 16px;
min-height: 36px;
height: 36px;
padding: 0 14px;
border: 1px solid #e5e7eb;
border-radius: 8px;
color: #4b5563;

@ -872,10 +872,11 @@ function exportOutcome() {
align-items: center;
justify-content: center;
gap: 8px;
min-height: 40px;
padding: 0 18px;
min-height: 36px;
height: 36px;
padding: 0 14px;
border: 1px solid rgba(37, 99, 235, 0.45);
border-radius: 10px;
border-radius: 8px;
color: var(--student-accent);
background: #ffffff;
font-family: inherit;
@ -910,6 +911,10 @@ function exportOutcome() {
border-color: var(--student-accent);
color: #ffffff;
background: var(--student-accent);
min-height: 36px;
height: 36px;
padding: 0 14px;
border-radius: 8px;
box-shadow: 0 3px 10px rgba(37, 99, 235, 0.28);
&:hover:not(:disabled) {
@ -931,6 +936,7 @@ function exportOutcome() {
justify-content: center;
gap: 7px;
min-height: 36px;
height: 36px;
padding: 0 14px;
border: 1px solid rgba(37, 99, 235, 0.45);
border-radius: 8px;
@ -1180,7 +1186,7 @@ function exportOutcome() {
transform: none !important;
}
/* --- 底部步骤按钮:40px 标准按钮(位置 A) --- */
/* --- 底部步骤按钮:36px 标准按钮(位置 A) --- */
#app .studentLayout section.app-main:has(.product-factors) .task-actions {
gap: 14px !important;
margin-top: 20px !important;
@ -1193,11 +1199,11 @@ function exportOutcome() {
gap: 8px !important;
min-width: 0 !important;
width: auto !important;
height: 40px !important;
min-height: 40px !important;
padding: 0 18px !important;
height: 36px !important;
min-height: 36px !important;
padding: 0 14px !important;
border: 1px solid rgba(37, 99, 235, 0.45) !important;
border-radius: 10px !important;
border-radius: 8px !important;
color: #2563eb !important;
background: #ffffff !important;
box-shadow: none !important;

@ -888,10 +888,12 @@ function exportOutcome() {
/* 标题行内联导出:次按钮的紧凑小号(继承 .outline-action 描边与圆角语言) */
.schedule-export-action {
min-height: 32px;
padding: 0 12px;
min-height: 36px;
height: 36px;
padding: 0 14px;
font-size: 12px;
font-weight: 600;
border-radius: 8px;
}
/* Step 编号小标签:灰色宽字距引导文字 */
@ -1034,17 +1036,18 @@ tr.is-incorrect .classification-feedback {
/*
* 次按钮(清空填写/本步):白底 + 墨黑半透明描边 + 墨黑字;
* 与标准样例一致:40px 高、10px 圆角、700 字重、hover 轻微浮起。
* 与标准样例一致:36px 高、8px 圆角、700 字重、hover 轻微浮起。
*/
.btn-nav {
display: inline-flex;
align-items: center;
justify-content: center;
gap: 8px;
min-height: 40px;
padding: 0 18px;
min-height: 36px;
height: 36px;
padding: 0 14px;
border: 1px solid rgba(37, 99, 235, 0.45);
border-radius: 10px;
border-radius: 8px;
color: var(--student-accent);
background: #ffffff;
font-family: inherit;
@ -1074,6 +1077,10 @@ tr.is-incorrect .classification-feedback {
color: #ffffff;
background: var(--student-accent);
box-shadow: 0 3px 10px rgba(37, 99, 235, 0.28);
min-height: 36px;
height: 36px;
padding: 0 14px;
border-radius: 8px;
}
.btn-nav.btn-submit:hover:not(:disabled) {
@ -1604,16 +1611,16 @@ tr.is-incorrect .classification-feedback {
transform: none !important;
}
/* Step 02 标题行"导出列表":32px 紧凑小号 */
/* Step 02 标题行"导出列表":36px 紧凑小号 */
#app .studentLayout section.app-main:has(.product-process) .step-title-actions button.outline-action {
display: inline-flex !important;
align-items: center !important;
justify-content: center !important;
gap: 5px !important;
width: auto !important;
height: 32px !important;
min-height: 32px !important;
padding: 0 12px !important;
height: 36px !important;
min-height: 36px !important;
padding: 0 14px !important;
border: 1px solid rgba(37, 99, 235, 0.45) !important;
border-radius: 8px !important;
color: #2563eb !important;
@ -1638,7 +1645,7 @@ tr.is-incorrect .classification-feedback {
transform: none !important;
}
/* --- 底部步骤按钮:40px 标准按钮 --- */
/* --- 底部步骤按钮:36px 标准按钮 --- */
#app .studentLayout section.app-main:has(.product-process) .task-actions {
gap: 14px !important;
margin-top: 20px !important;
@ -1651,11 +1658,11 @@ tr.is-incorrect .classification-feedback {
gap: 8px !important;
min-width: 0 !important;
width: auto !important;
height: 40px !important;
min-height: 40px !important;
padding: 0 18px !important;
height: 36px !important;
min-height: 36px !important;
padding: 0 14px !important;
border: 1px solid rgba(37, 99, 235, 0.45) !important;
border-radius: 10px !important;
border-radius: 8px !important;
color: #2563eb !important;
background: #ffffff !important;
box-shadow: none !important;

@ -686,10 +686,11 @@ function exportOutcome() { const blob = new Blob([JSON.stringify({ currentStep:
align-items: center;
justify-content: center;
gap: 6px;
min-height: 40px;
padding: 0 18px;
min-height: 36px;
height: 36px;
padding: 0 14px;
border: 1px solid rgba(31, 41, 55, 0.4);
border-radius: 10px;
border-radius: 8px;
color: var(--student-text);
background: #ffffff;
font-size: var(--student-fs-button);

File diff suppressed because one or more lines are too long

@ -25,7 +25,7 @@ function onSuccess(response) {
<style scoped lang="scss">
.upload-row { display: flex; flex-wrap: wrap; align-items: center; gap: 10px; margin-top: 12px; }
.upload-row :deep(.upload-action) { min-height: 40px; padding: 0 18px; border: 1px solid #cfe2f5; border-radius: 999px; color: #1e3a5f; background: linear-gradient(95deg, #1e88e5, #1565c0); font-size: var(--student-fs-button); font-weight: 800; }
.upload-row :deep(.upload-action) { min-height: 36px; height: 36px; padding: 0 14px; border: 1px solid #cfe2f5; border-radius: 8px; color: #1e3a5f; background: linear-gradient(95deg, #1e88e5, #1565c0); font-size: var(--student-fs-button); font-weight: 800; }
.upload-row :deep(.upload-action:hover), .upload-row :deep(.upload-action:focus-visible) { border-color: #1e88e5; color: #1e3a5f; background: linear-gradient(95deg, #1e88e5, #1565c0); outline: none; }
.preview-list { display: flex; flex-wrap: wrap; gap: 8px; }
.preview-list :deep(.el-image) { width: 50px; height: 50px; overflow: hidden; border: 1px solid #cfe2f5; border-radius: 10px; background: #ffffff; }

@ -713,8 +713,16 @@ async function handleValueCanvasUpload(event) {
--student-fs-button-lg: 13px;
--student-fs-data: 14px;
/* 不设 grid-template-columns,由全局 .student-training-shell 单列布局接管 */
min-width: 0;
position: relative;
z-index: 2;
display: grid;
grid-template-columns: minmax(720px, 1fr) 340px;
gap: 24px;
width: 100%;
max-width: 100%;
min-height: calc(100vh - 106px);
margin: 0;
padding: 24px 24px 32px;
color: var(--student-text);
background: #ffffff;
}
@ -868,10 +876,11 @@ async function handleValueCanvasUpload(event) {
align-items: center;
justify-content: center;
gap: 8px;
min-height: 40px;
padding: 0 18px;
height: 36px;
min-height: 36px;
padding: 0 14px;
border: 1px solid rgba(37, 99, 235, 0.45);
border-radius: 10px;
border-radius: 8px;
color: var(--student-accent);
background: #ffffff;
font-size: 13px;
@ -1086,7 +1095,7 @@ async function handleValueCanvasUpload(event) {
justify-content: center;
gap: 7px;
border: 1px solid rgba(37, 99, 235, 0.45);
border-radius: 10px;
border-radius: 8px;
color: var(--student-accent);
background: #ffffff;
cursor: pointer;
@ -1096,9 +1105,9 @@ async function handleValueCanvasUpload(event) {
transition: border-color 0.16s ease, background 0.16s ease, color 0.16s ease;
}
.canvas-export-button { min-width: 92px; min-height: 40px; padding: 0 18px; font-size: var(--student-fs-body-sm); }
.template-download-button { min-width: 116px; min-height: 40px; padding: 0 18px; font-size: var(--student-fs-body-sm); }
.canvas-upload-trigger { min-width: 218px; min-height: 54px; padding: 0 22px; font-size: var(--student-fs-body); }
.canvas-export-button { min-width: 92px; min-height: 36px; height: 36px; padding: 0 14px; font-size: var(--student-fs-body-sm); }
.template-download-button { min-width: 116px; min-height: 36px; height: 36px; padding: 0 14px; font-size: var(--student-fs-body-sm); }
.canvas-upload-trigger { min-width: 218px; min-height: 36px; height: 36px; padding: 0 14px; font-size: var(--student-fs-body); }
.canvas-export-button:hover,
.template-download-button:hover,
@ -1373,10 +1382,11 @@ async function handleValueCanvasUpload(event) {
align-items: center;
justify-content: center;
gap: 6px;
min-height: 40px;
padding: 0 18px;
min-height: 36px;
height: 36px;
padding: 0 14px;
border: 1px solid rgba(37, 99, 235, 0.45);
border-radius: 10px;
border-radius: 8px;
color: var(--student-accent);
background: #ffffff;
font-size: var(--student-fs-button);
@ -1671,11 +1681,11 @@ async function handleValueCanvasUpload(event) {
* ============================================================ */
#app .studentLayout section.app-main:has(.product-positioning-page) .training-actions .el-button.training-action {
min-width: 140px !important;
min-height: 40px !important;
height: 40px !important;
padding: 0 20px !important;
min-height: 36px !important;
height: 36px !important;
padding: 0 14px !important;
border: 1px solid rgba(37, 99, 235, 0.45) !important;
border-radius: 10px !important;
border-radius: 8px !important;
color: #2563eb !important;
background: #ffffff !important;
font-size: 13px !important;

@ -799,22 +799,34 @@ onMounted(async () => {
</script>
<style lang="scss" scoped>
/* ===== 页面级令牌(墨黑极简主题) ===== */
/* ===== 页面级令牌(教育蓝极简主题) ===== */
.hardware-cost-page {
--student-accent: #1f2937;
--student-accent-deep: #111827;
--student-accent-light: #4b5563;
--student-accent-soft: #f3f4f6;
--student-danger: #d9554c;
--student-success: #4a9d6e;
--student-layer-1: #374151;
--student-layer-2: #43a294;
--student-layer-3: #8b6fc0;
--student-accent: #2563eb;
--student-accent-deep: #1d4ed8;
--student-accent-light: #3b82f6;
--student-accent-soft: #eff6ff;
--student-danger: #ef4444;
--student-success: #2ba471;
--student-layer-1: #1d4ed8;
--student-layer-2: #3b82f6;
--student-layer-3: #93c5fd;
--student-panel-border: #e5e7eb;
--student-card-bg: #ffffff;
--student-panel-bg: #fafbfc;
--student-text: #1f2937;
--student-text-secondary: #6b7280;
--el-color-primary: #2563eb;
--el-color-primary-light-3: #60a5fa;
--el-color-primary-light-5: #93c5fd;
--el-color-primary-light-7: #bfdbfe;
--el-color-primary-light-8: #dbeafe;
--el-color-primary-light-9: #eff6ff;
--el-color-primary-dark-2: #1d4ed8;
--el-input-hover-border-color: #3b82f6;
--el-input-focus-border-color: #2563eb;
--el-input-focus-ring-color: rgba(59, 130, 246, 0.15);
--el-textarea-hover-border-color: #3b82f6;
--el-textarea-focus-border-color: #2563eb;
--student-fs-display: 17px;
--student-fs-h1: 15px;
--student-fs-h2: 14px;
@ -1199,10 +1211,11 @@ onMounted(async () => {
align-items: center;
justify-content: center;
gap: 6px;
min-height: 40px;
padding: 0 16px;
min-height: 36px;
height: 36px;
padding: 0 14px;
border: 1px solid rgba(31, 41, 55, 0.4);
border-radius: 10px;
border-radius: 8px;
color: var(--student-text);
background: #ffffff;
font-size: var(--student-fs-button);
@ -1323,7 +1336,8 @@ onMounted(async () => {
display: flex;
align-items: center;
justify-content: center;
min-height: 40px;
min-height: 36px;
height: 36px;
border: 1px dashed var(--student-panel-border);
border-radius: 8px;
color: var(--student-accent);

@ -640,10 +640,11 @@ function exportOutcome() {
display: inline-flex;
align-items: center;
justify-content: center;
min-height: 40px;
padding: 0 18px;
min-height: 36px;
height: 36px;
padding: 0 14px;
border: 1px solid #cfe2f5;
border-radius: 999px;
border-radius: 8px;
color: #1e3a5f;
background: #e3f2fd;
font-size: var(--student-fs-button);
@ -1101,9 +1102,10 @@ function exportOutcome() {
}
.step-actions :deep(.step-action-btn) {
min-height: 40px;
padding: 0 18px;
border-radius: 999px;
min-height: 36px;
height: 36px;
padding: 0 14px;
border-radius: 8px;
font-size: var(--student-fs-button);
font-weight: 800;
}

@ -249,8 +249,16 @@ function exportOutcome() { const blob = new Blob([JSON.stringify({ taskName: tas
--student-fs-button-lg: 13px;
--student-fs-data: 14px;
/* 不设 grid-template-columns,由全局 .student-training-shell 单列布局接管 */
min-width: 0;
position: relative;
z-index: 2;
display: grid;
grid-template-columns: minmax(720px, 1fr) 340px;
gap: 24px;
width: 100%;
max-width: 100%;
min-height: calc(100vh - 106px);
margin: 0;
padding: 24px 24px 32px;
color: var(--student-text);
background: #ffffff;
}
@ -753,10 +761,11 @@ function exportOutcome() { const blob = new Blob([JSON.stringify({ taskName: tas
align-items: center;
justify-content: center;
gap: 6px;
min-height: 40px;
padding: 0 18px;
min-height: 36px;
height: 36px;
padding: 0 14px;
border: 1px solid rgba(37, 99, 235, 0.45);
border-radius: 10px;
border-radius: 8px;
color: var(--student-accent);
background: #ffffff;
font-size: var(--student-fs-button);

@ -1735,10 +1735,11 @@ onMounted(async () => {
align-items: center;
justify-content: center;
gap: 8px;
min-height: 40px;
padding: 0 18px;
min-height: 36px;
height: 36px;
padding: 0 14px;
border: 1px solid rgba(31, 41, 55, 0.4);
border-radius: 10px;
border-radius: 8px;
color: var(--student-accent);
background: #ffffff;
font: inherit;
@ -1760,10 +1761,11 @@ onMounted(async () => {
display: inline-flex;
align-items: center;
justify-content: center;
min-height: 40px;
padding: 0 22px;
min-height: 36px;
height: 36px;
padding: 0 14px;
border: 1px solid var(--student-accent);
border-radius: 10px;
border-radius: 8px;
color: #ffffff;
background: var(--student-accent);
font: inherit;
@ -1792,10 +1794,11 @@ onMounted(async () => {
display: inline-flex;
align-items: center;
justify-content: center;
min-height: 40px;
padding: 0 18px;
min-height: 36px;
height: 36px;
padding: 0 14px;
border: 1px solid var(--student-panel-border);
border-radius: 10px;
border-radius: 8px;
color: var(--student-text);
background: #ffffff;
font: inherit;

@ -1296,18 +1296,18 @@ function exportOutcome() { if (currentStep.value === 2) { exportStepTwoTable();
color: var(--student-text-secondary);
}
/* ===== scoped 内按钮基础(40px/10px/700 + 墨黑极简) ===== */
/* ===== scoped 内按钮基础(36px/8px + 墨黑极简) ===== */
.outline-action,
.btn-nav {
display: inline-flex;
align-items: center;
justify-content: center;
gap: 6px;
min-height: 40px;
height: 40px;
padding: 0 18px;
min-height: 36px;
height: 36px;
padding: 0 14px;
border: 1px solid rgba(31, 41, 55, 0.4);
border-radius: 10px;
border-radius: 8px;
color: var(--student-text);
background: #ffffff;
font-size: var(--student-fs-button);

@ -1057,10 +1057,11 @@ button:disabled {
align-items: center;
justify-content: center;
gap: 8px;
min-height: 40px;
padding: 0 18px;
min-height: 36px;
height: 36px;
padding: 0 14px;
border: 1px solid rgba(31, 41, 55, 0.4);
border-radius: 10px;
border-radius: 8px;
color: var(--student-text);
background: #ffffff;
font: inherit;

@ -1985,9 +1985,13 @@ function exportOutcome() {
}
.btn-save {
height: 36px;
min-height: 36px;
padding: 0 14px;
border-color: #e5e7eb;
color: #374151;
background: #f3f4f6;
border-radius: 8px;
}
.btn-save:hover:not(:disabled) {
@ -2529,8 +2533,10 @@ function exportOutcome() {
.training-actions :deep(.training-action) {
min-width: 112px;
height: 40px;
padding: 0 18px;
height: 36px;
min-height: 36px;
padding: 0 14px;
border-radius: 8px;
border: 1px solid #e5e7eb;
border-radius: 10px;
color: #1f2937;
@ -2617,11 +2623,11 @@ function exportOutcome() {
.workbench-actions :deep(.material-download),
.workbench-actions :deep(.outline-action) {
min-width: 0 !important;
min-height: 40px !important;
height: 40px !important;
padding: 0 18px !important;
min-height: 36px !important;
height: 36px !important;
padding: 0 14px !important;
border: 1px solid #e5e7eb !important;
border-radius: 10px !important;
border-radius: 8px !important;
color: #1f2937 !important;
background: #ffffff !important;
box-shadow: none !important;

Loading…
Cancel
Save