Browse Source

feature 1002057

章节添加类型支持选择
Kevin Jiang 2 years ago
parent
commit
ca35d41996

+ 6 - 0
src/models/report.model.ts

@@ -25,6 +25,12 @@ export class ChapterManager {
     }
   }
 
+  public addChapters(chapterTypes: ChapterType[]) {
+    for (const type of chapterTypes) {
+      this.addChapter(type);
+    }
+  }
+
   public getChapter(index: number) {
     return this.chapters[index];
   }

+ 3 - 3
src/views/report/ReportEditorView.vue

@@ -51,7 +51,7 @@ const exporting = ref(false)
 // 定时保存handler
 const timeIntervalHandler = ref<number | null>(null)
 //报告状态
-const reportStatus = ref<number>(0) 
+const reportStatus = ref<number>(0)
 
 function onMetaChange(data: ReportMetadataItem[]) {
   metadata.value = data;
@@ -93,8 +93,8 @@ function onLogoDelete() {
   })
 }
 
-function onChapterTypeSelected(type: ChapterType) {
-  chapterManager.addChapter(type);
+function onChapterTypeSelected(types: ChapterType[]) {
+  chapterManager.addChapters(types);
 }
 
 function onChapterChange(index: number, data: Chapter) {

+ 23 - 13
src/views/report/components/ChapterTypeSelect.vue

@@ -1,6 +1,6 @@
 <script setup lang="ts">
 import { ChapterType, ChapterTypeLabels } from "@/types/report.types";
-import { ref, type Ref } from "vue";
+import { ref } from "vue";
 
 defineProps({
   visible: {
@@ -12,13 +12,24 @@ defineProps({
 
 const emits = defineEmits<{
   (e: "update:visible", visible: boolean): void;
-  (e: "ok", vaule: ChapterType): void;
+  (e: "ok", vaule: ChapterType[]): void;
 }>();
 
-const category: Ref<ChapterType> = ref(ChapterType.UNKNOWN);
+const categoryOptions = ChapterTypeLabels.map((item) => ({
+  label: item.label,
+  value: item.key
+}))
+
+const checkedCategories = ref<ChapterType[]>([]);
 
 function onOk() {
-  emits("ok", category.value);
+  let values: ChapterType[] = [];
+  for (let item of categoryOptions) {
+    if (checkedCategories.value.find(x => x == item.value)) {
+      values.push(item.value)
+    }
+  }
+  emits("ok", values);
   emits("update:visible", false);
   reset();
 }
@@ -29,7 +40,7 @@ function onCancel() {
 }
 
 function reset() {
-  category.value = ChapterType.UNKNOWN;
+  checkedCategories.value = [];
 }
 </script>
 
@@ -37,21 +48,20 @@ function reset() {
   <a-modal
     :visible="visible"
     title="选择章节类型"
-    :ok-button-props="{ disabled: category == ChapterType.UNKNOWN }"
+    :ok-button-props="{ disabled: checkedCategories.length == 0 }"
     @ok="onOk"
     @cancel="onCancel"
   >
-    <a-radio-group v-model:value="category">
-      <a-radio class="radio" :value="item.key" v-for="(item, index) in ChapterTypeLabels" :key="index">
-        {{ item.label }}
-      </a-radio>
-    </a-radio-group>
+    <a-checkbox-group v-model:value="checkedCategories" name="checkboxgroup">
+      <div v-for="(item, index) in categoryOptions" :key="index" class="category-item">
+        <a-checkbox :value="item.value">{{ item.label }}</a-checkbox>
+      </div>
+    </a-checkbox-group>
   </a-modal>
 </template>
 
 <style scoped lang="scss">
-.radio {
-  display: flex;
+.category-item {
   height: 2em;
   line-height: 2em;
 }