|
|
@@ -12,20 +12,26 @@
|
|
|
<span class="workspace-heading__phase">{{ phaseLabel }}</span>
|
|
|
</header>
|
|
|
|
|
|
- <div class="workspace-primary">
|
|
|
+ <div class="workspace-primary" :class="{ 'workspace-primary--solo': !workspace.teamSummary }">
|
|
|
<router-link v-if="firstTodo" :to="firstTodoTarget" class="workspace-action">
|
|
|
<span class="workspace-action__eyebrow">YOUR NEXT ACTION</span>
|
|
|
<h2 class="workspace-action__title">{{ firstTodo.label }}</h2>
|
|
|
<p>{{ firstTodoDescription }}</p>
|
|
|
- <span class="workspace-action__cta">
|
|
|
- 立即处理
|
|
|
- <span aria-hidden="true">→</span>
|
|
|
- </span>
|
|
|
+ <footer class="workspace-action__footer">
|
|
|
+ <span>{{ workspace.todos.length }} 项待办</span>
|
|
|
+ <span class="workspace-action__cta">
|
|
|
+ 立即处理
|
|
|
+ <span aria-hidden="true">→</span>
|
|
|
+ </span>
|
|
|
+ </footer>
|
|
|
</router-link>
|
|
|
<section v-else class="workspace-action workspace-action--empty">
|
|
|
<span class="workspace-action__eyebrow">YOUR NEXT ACTION</span>
|
|
|
<h2 class="workspace-action__title">当前没有待办</h2>
|
|
|
<p>本周期的个人行动已处理完毕,可以关注后续节点与团队进展。</p>
|
|
|
+ <footer class="workspace-action__footer">
|
|
|
+ <span>{{ workspace.todos.length }} 项待办</span>
|
|
|
+ </footer>
|
|
|
</section>
|
|
|
|
|
|
<section class="workspace-context">
|
|
|
@@ -159,6 +165,8 @@ const teamOkrTarget = computed(() => ({
|
|
|
border: 1px solid var(--color-border);
|
|
|
background: var(--color-surface);
|
|
|
}
|
|
|
+.workspace-primary--solo { grid-template-columns: 1fr; }
|
|
|
+.workspace-primary--solo .workspace-context { border-top: 1px solid var(--color-border); border-left: 0; }
|
|
|
|
|
|
.workspace-action {
|
|
|
min-width: 0;
|
|
|
@@ -188,11 +196,20 @@ const teamOkrTarget = computed(() => ({
|
|
|
font-size: 15px;
|
|
|
line-height: 1.75;
|
|
|
}
|
|
|
+.workspace-action__footer {
|
|
|
+ width: 100%;
|
|
|
+ display: flex;
|
|
|
+ align-items: center;
|
|
|
+ justify-content: space-between;
|
|
|
+ gap: 20px;
|
|
|
+ margin-top: auto;
|
|
|
+ color: rgba(255, 255, 255, .7);
|
|
|
+ font-size: 12px;
|
|
|
+}
|
|
|
.workspace-action__cta {
|
|
|
display: inline-flex;
|
|
|
align-items: center;
|
|
|
gap: 20px;
|
|
|
- margin-top: auto;
|
|
|
padding: 11px 16px;
|
|
|
background: var(--color-accent);
|
|
|
color: var(--color-dark-deeper);
|