|
|
@@ -8,9 +8,9 @@
|
|
|
<el-tag size="large" effect="dark" round>{{ data.period?.startDate }} ~ {{ data.period?.endDate }}</el-tag>
|
|
|
</div>
|
|
|
|
|
|
- <div class="same-screen" v-if="data.targetUser">
|
|
|
+ <div class="review-workbench" v-if="data.targetUser">
|
|
|
<!-- Left: OKR Records + Self Assessment -->
|
|
|
- <div class="left-panel">
|
|
|
+ <div class="evidence-panel med-panel">
|
|
|
<!-- OKR execution records -->
|
|
|
<div class="panel-head">当期 OKR 完整记录</div>
|
|
|
<div v-if="!okrRecords.length" class="panel-empty">暂无 OKR 记录</div>
|
|
|
@@ -105,7 +105,7 @@
|
|
|
|
|
|
<!-- 3. Bonus/Penalty -->
|
|
|
<div class="self-block">
|
|
|
- <div class="self-block-title">⚡ 加减分</div>
|
|
|
+ <div class="self-block-title">加减分</div>
|
|
|
<div class="self-bp">
|
|
|
<span>加分 <strong>+{{ data.selfScore.bonus }}</strong></span>
|
|
|
<span>扣分 <strong>-{{ data.selfScore.penalty }}</strong></span>
|
|
|
@@ -122,7 +122,7 @@
|
|
|
</div>
|
|
|
|
|
|
<!-- Right: Superior Scoring -->
|
|
|
- <div class="score-panel">
|
|
|
+ <div class="decision-panel">
|
|
|
<div class="panel-head">考评打分</div>
|
|
|
|
|
|
<!-- KR Scores -->
|
|
|
@@ -173,7 +173,7 @@
|
|
|
|
|
|
<!-- Bonus/Penalty -->
|
|
|
<div class="score-card">
|
|
|
- <div class="sc-header">⚡ 专项加减分</div>
|
|
|
+ <div class="sc-header">专项加减分</div>
|
|
|
<div class="sc-body">
|
|
|
<div class="sc-inline">
|
|
|
<span class="sc-label">加分(上限5)</span>
|
|
|
@@ -352,13 +352,13 @@ function fmtTime(t) { if (!t) return ''; return t.slice(0, 16).replace('T', ' ')
|
|
|
.hero-info h2 { font-size: 28px; font-weight: 700; color: #1a1a2e; margin: 0; }
|
|
|
.hero-info p { font-size: 14px; color: #888; margin: 4px 0 0; }
|
|
|
|
|
|
-.same-screen { display: flex; gap: 20px; align-items: flex-start; }
|
|
|
-.left-panel {
|
|
|
- flex: 1; background: #fff; border-radius: 12px; padding: 20px 24px;
|
|
|
+.review-workbench { display: flex; gap: 20px; align-items: flex-start; }
|
|
|
+.evidence-panel {
|
|
|
+ flex: 1; background: #fff; border-radius: 8px; padding: 20px 24px;
|
|
|
box-shadow: 0 1px 4px rgba(0,0,0,0.04); border: 1px solid #f0f0f0;
|
|
|
max-height: calc(100vh - 160px); overflow-y: auto;
|
|
|
}
|
|
|
-.score-panel { width: 480px; flex-shrink: 0; max-height: calc(100vh - 160px); overflow-y: auto; }
|
|
|
+.decision-panel { width: 480px; flex-shrink: 0; max-height: calc(100vh - 160px); overflow-y: auto; }
|
|
|
.panel-head { font-size: 15px; font-weight: 700; color: #1a1a2e; margin-bottom: 16px; }
|
|
|
.panel-empty { color: #ccc; text-align: center; padding: 20px; font-size: 13px; }
|
|
|
|
|
|
@@ -453,7 +453,7 @@ function fmtTime(t) { if (!t) return ''; return t.slice(0, 16).replace('T', ' ')
|
|
|
.dim-score-unit { font-size: 13px; color: #999; margin-left: 6px; }
|
|
|
|
|
|
.result-preview {
|
|
|
- background: #f4f2f9; border-radius: 12px;
|
|
|
+ background: #f4f2f9; border-radius: 8px;
|
|
|
padding: 20px; text-align: center; border: 1px solid #dcd4f0; margin-bottom: 16px;
|
|
|
}
|
|
|
.rp-formula { font-size: 12px; color: #888; }
|
|
|
@@ -463,7 +463,7 @@ function fmtTime(t) { if (!t) return ''; return t.slice(0, 16).replace('T', ' ')
|
|
|
.submit-btn { width: 100%; background: #2b1f99; border: none; height: 48px; font-size: 15px; }
|
|
|
|
|
|
@media (max-width: 1100px) {
|
|
|
- .same-screen { flex-direction: column; }
|
|
|
- .left-panel, .score-panel { width: 100%; max-height: none; }
|
|
|
+ .review-workbench { flex-direction: column; }
|
|
|
+ .evidence-panel, .decision-panel { width: 100%; max-height: none; }
|
|
|
}
|
|
|
</style>
|