fix: align value positioning toolbar layout

bugfix/ai-assessment-evidence-rescore
陈沅 1 month ago
parent db6158362f
commit 42da38dfcd

@ -9,17 +9,15 @@
<h1 class="task-title">{{ taskTitle }}</h1>
</section>
<TrainingTaskBrief :background="taskBackground" :goals="taskGoals" :requirements="taskRequirement" :show-material="false" />
<TrainingTaskBrief :background="taskBackground" :goals="taskGoals" :requirements="taskRequirement" :show-material="false" :show-toolbar="false" />
<section class="task-card">
<div class="workbench-head workbench-head--actions-only">
<div class="workbench-actions">
<TrainingMaterialButton :material-name="taskConfig?.materialName" :material-url="taskConfig?.materialUrl" />
<button type="button" class="outline-action" @click="exportOutcome">
<el-icon><Download /></el-icon>
导出实训成果
</button>
<div class="workbench-head">
<div>
<p class="section-eyebrow">Value proposition positioning</p>
<h3>{{ activeStepName || taskTitle }}</h3>
</div>
<TrainingTaskToolbar class="product-positioning-toolbar" :task-key="TASK_KEY" :on-export="exportOutcome" />
</div>
<nav v-if="configuredSteps.length" class="step-indicator" aria-label="产品价值主张及定位步骤">
@ -255,7 +253,7 @@
import { computed, getCurrentInstance, onMounted, ref } from "vue";
import { ArrowLeft, ArrowRight, CircleCheck, Download, Operation, UploadFilled } from "@element-plus/icons-vue";
import TrainingAiSidebar from "@/views/components/TrainingAiSidebar.vue";
import TrainingMaterialButton from "@/views/components/TrainingMaterialButton.vue";
import TrainingTaskToolbar from "@/views/components/TrainingTaskToolbar.vue";
import TrainingTaskBrief from "@/views/components/TrainingTaskBrief.vue";
import { getTrainingTaskByKey } from "@/api/trainingTask";
import { checkProductValuePositioningStepOne, checkProductValuePositioningStepTwo, checkProductValuePositioningStepThree, checkProductValuePositioningStepFour, getStudentTrainingAnswer, saveStudentTrainingAnswer, uploadStudentTrainingFile } from "@/api/studentTrainingAnswer";
@ -753,6 +751,12 @@ async function handleValueCanvasUpload(event) {
flex-shrink: 0;
}
.product-positioning-toolbar {
flex: 0 0 auto;
justify-content: flex-end;
max-width: 100%;
}
.outline-action,
.btn-nav {
display: inline-flex;
@ -1389,6 +1393,7 @@ async function handleValueCanvasUpload(event) {
.outline-action,
.btn-nav,
.training-actions :deep(.training-action) { width: 100%; }
.product-positioning-toolbar { width: 100%; justify-content: flex-start; }
.step-indicator {
align-items: stretch;
flex-direction: column;

Loading…
Cancel
Save