|
|
@@ -3,15 +3,18 @@
|
|
|
<!-- 工具栏 -->
|
|
|
<div class="editor-toolbar">
|
|
|
<el-button :icon="ArrowLeft" @click="goBack">返回</el-button>
|
|
|
- <div class="title-input-wrapper" :style="{ width: titleInputWidth + 'px' }">
|
|
|
- <el-input
|
|
|
- v-model="reportTitle"
|
|
|
- class="title-input"
|
|
|
- placeholder="请输入报告标题"
|
|
|
- />
|
|
|
- <span class="title-measure" ref="titleMeasure">{{ reportTitle || '请输入报告标题' }}</span>
|
|
|
+ <el-divider direction="vertical" />
|
|
|
+ <div class="title-section">
|
|
|
+ <div class="title-input-wrapper" :style="{ width: titleInputWidth + 'px' }">
|
|
|
+ <el-input
|
|
|
+ v-model="reportTitle"
|
|
|
+ class="title-input"
|
|
|
+ placeholder="请输入报告标题"
|
|
|
+ />
|
|
|
+ <span class="title-measure" ref="titleMeasure">{{ reportTitle || '请输入报告标题' }}</span>
|
|
|
+ </div>
|
|
|
+ <span class="save-status" v-if="saved">✓ 已保存</span>
|
|
|
</div>
|
|
|
- <span class="save-status" v-if="saved">✓ 已保存</span>
|
|
|
<div class="toolbar-right">
|
|
|
<el-button
|
|
|
:icon="Refresh"
|
|
|
@@ -1375,14 +1378,22 @@ onUnmounted(() => {
|
|
|
display: flex;
|
|
|
align-items: center;
|
|
|
padding: 0 16px;
|
|
|
- gap: 16px;
|
|
|
+ gap: 12px;
|
|
|
flex-shrink: 0;
|
|
|
+
|
|
|
+ .title-section {
|
|
|
+ display: flex;
|
|
|
+ align-items: center;
|
|
|
+ gap: 8px;
|
|
|
+ flex: 1;
|
|
|
+ min-width: 0;
|
|
|
+ }
|
|
|
|
|
|
.title-input-wrapper {
|
|
|
position: relative;
|
|
|
display: inline-block;
|
|
|
- min-width: 120px;
|
|
|
- max-width: 400px;
|
|
|
+ min-width: 150px;
|
|
|
+ max-width: 500px;
|
|
|
|
|
|
.title-input {
|
|
|
width: 100%;
|
|
|
@@ -1390,6 +1401,7 @@ onUnmounted(() => {
|
|
|
:deep(.el-input__wrapper) {
|
|
|
box-shadow: none;
|
|
|
background: transparent;
|
|
|
+ border-radius: 6px;
|
|
|
|
|
|
&:hover, &.is-focus {
|
|
|
background: var(--bg);
|
|
|
@@ -1397,8 +1409,8 @@ onUnmounted(() => {
|
|
|
}
|
|
|
|
|
|
:deep(.el-input__inner) {
|
|
|
- font-size: 15px;
|
|
|
- font-weight: 500;
|
|
|
+ font-size: 16px;
|
|
|
+ font-weight: 600;
|
|
|
}
|
|
|
}
|
|
|
|
|
|
@@ -1406,23 +1418,25 @@ onUnmounted(() => {
|
|
|
position: absolute;
|
|
|
visibility: hidden;
|
|
|
white-space: nowrap;
|
|
|
- font-size: 15px;
|
|
|
- font-weight: 500;
|
|
|
- padding: 0 11px; // 与 el-input 内边距一致
|
|
|
+ font-size: 16px;
|
|
|
+ font-weight: 600;
|
|
|
+ padding: 0 11px;
|
|
|
pointer-events: none;
|
|
|
}
|
|
|
}
|
|
|
|
|
|
.save-status {
|
|
|
color: var(--success);
|
|
|
- font-size: 13px;
|
|
|
+ font-size: 12px;
|
|
|
+ white-space: nowrap;
|
|
|
+ opacity: 0.8;
|
|
|
}
|
|
|
|
|
|
.toolbar-right {
|
|
|
- margin-left: auto;
|
|
|
display: flex;
|
|
|
gap: 8px;
|
|
|
align-items: center;
|
|
|
+ flex-shrink: 0;
|
|
|
}
|
|
|
}
|
|
|
|