|
|
@@ -279,6 +279,19 @@
|
|
|
</div>
|
|
|
</div>
|
|
|
|
|
|
+ <!-- 任务说明:有讨论主题时显示 -->
|
|
|
+ <div class="shTaskDescCard" v-if="work.stage === 'activity' && work.scenario && work.scenario.trim()">
|
|
|
+ <div class="shTaskDescIcon">
|
|
|
+ <svg viewBox="0 0 24 24" width="18" height="18" fill="none" stroke="#F5A623" stroke-width="2" stroke-linecap="round" stroke-linejoin="round">
|
|
|
+ <path d="m12 3-1.912 5.813a2 2 0 0 1-1.275 1.275L3 12l5.813 1.912a2 2 0 0 1 1.275 1.275L12 21l1.912-5.813a2 2 0 0 1 1.275-1.275L21 12l-5.813-1.912a2 2 0 0 1-1.275-1.275L12 3Z"></path>
|
|
|
+ </svg>
|
|
|
+ </div>
|
|
|
+ <div class="shTaskDescBody">
|
|
|
+ <div class="shTaskDescLabel">{{ lang.ssSHTaskDescLabel }}</div>
|
|
|
+ <div class="shTaskDescText">{{ work.scenario }}</div>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+
|
|
|
<!-- 帽子圆点导航 -->
|
|
|
<div class="shHatDots">
|
|
|
<div class="shHatDots" v-for="(hatKey, idx) in selectedHats" :key="hatKey">
|
|
|
@@ -1792,6 +1805,48 @@ export default {
|
|
|
transform: rotate(180deg);
|
|
|
}
|
|
|
|
|
|
+.shTaskDescCard {
|
|
|
+ display: flex;
|
|
|
+ align-items: flex-start;
|
|
|
+ gap: 0.75rem;
|
|
|
+ background: #fff;
|
|
|
+ border-left: 3px solid #F5A623;
|
|
|
+ border-radius: 0.5rem;
|
|
|
+ padding: 0.875rem 1rem;
|
|
|
+ margin-bottom: 1rem;
|
|
|
+ box-shadow: 0 2px 8px rgba(0, 0, 0, 0.04);
|
|
|
+}
|
|
|
+
|
|
|
+.shTaskDescIcon {
|
|
|
+ flex-shrink: 0;
|
|
|
+ width: 2rem;
|
|
|
+ height: 2rem;
|
|
|
+ border-radius: 50%;
|
|
|
+ background: #fff6e5;
|
|
|
+ display: flex;
|
|
|
+ align-items: center;
|
|
|
+ justify-content: center;
|
|
|
+}
|
|
|
+
|
|
|
+.shTaskDescBody {
|
|
|
+ flex: 1;
|
|
|
+ min-width: 0;
|
|
|
+}
|
|
|
+
|
|
|
+.shTaskDescLabel {
|
|
|
+ font-size: 0.8125rem;
|
|
|
+ font-weight: 700;
|
|
|
+ color: #F5A623;
|
|
|
+ margin-bottom: 0.25rem;
|
|
|
+}
|
|
|
+
|
|
|
+.shTaskDescText {
|
|
|
+ font-size: 0.9375rem;
|
|
|
+ color: #333;
|
|
|
+ line-height: 1.6;
|
|
|
+ word-break: break-word;
|
|
|
+}
|
|
|
+
|
|
|
.shHowToContent {
|
|
|
background: #fff;
|
|
|
border-radius: 0.5rem;
|