瀏覽代碼

merge "feature/1001816" into "main"
feature/1001816

Kevin 2 年之前
父節點
當前提交
60ababc372

+ 4 - 10
src/views/reportTemplate/ReportTemplateEditorView.vue

@@ -5,6 +5,8 @@ import { useRoute } from "vue-router";
 import { CompLog } from "@/libs/log.lib";
 import { ChapterManager } from "@/models/report.model";
 import * as reportTemplateService from "@/services/reportTemplate.service"
+import ReportTemplateName from "./components/ReportTemplateName.vue"
+import ReportTemplateLabel from "./components/ReportTemplateLabel.vue"
 import type { Chapter, ChapterType, ReportMetadataItem, ReportTemplateSave } from "@/types/report.types";
 import { PlusOutlined } from "@ant-design/icons-vue";
 import PageHeader from '@/components/PageHeader.vue';
@@ -90,16 +92,8 @@ onMounted(() => {
   <a-row :gutter="24" v-if="reportTemplate">
     <a-col :span="12">
       <div class="metadata-wrap">
-        <a-row type="flex" style="align-items: center">
-          <a-col style="width: 120px; text-align: right;">
-            报告模板名称:
-          </a-col>
-          <a-col flex="1">
-            <a-input
-              v-model:value="reportTemplate.name"
-            />
-          </a-col>
-        </a-row>
+        <ReportTemplateName v-model="reportTemplate.name"></ReportTemplateName>
+        <ReportTemplateLabel v-model="reportTemplate.tags"> </ReportTemplateLabel>
         <DynamicMeta v-model:data="reportTemplate.metadata" @change="onMetaChange" />
       </div>
     </a-col>

+ 43 - 0
src/views/reportTemplate/components/ReportTemplateLabel.vue

@@ -0,0 +1,43 @@
+<script setup lang="ts">
+import { ref } from 'vue';
+
+// 此处引入
+const emit = defineEmits(['update:modelValue'])
+
+defineProps({
+	modelValue:{ 
+		type: Array,
+	},
+})
+
+// 数据双向绑定
+const onTagsChange = (info: Array<String>) => {
+  info = info.map((item) => item.trim())
+	emit('update:modelValue', info)
+}
+
+
+</script>
+
+<template>
+    <a-row type="flex" style="align-items: center;margin-top: 0.5em;">
+      <a-col style="width: 120px; text-align: right;">
+        报告模板名称:
+      </a-col>
+      <a-col flex="1">
+        <a-select
+          :value="modelValue"
+          mode="tags"
+          :token-separators="[',', ',', ' ']"
+          @change="onTagsChange"
+          placeholder="模板标签,输入逗号、空格或者回车自动分割"
+        ></a-select>
+      </a-col>
+    </a-row>
+</template>
+
+<style scoped lang="scss">
+ .ant-select{
+    width: 100%;
+  }
+</style>

+ 39 - 0
src/views/reportTemplate/components/ReportTemplateName.vue

@@ -0,0 +1,39 @@
+<script setup lang="ts">
+import { ref } from "vue";
+
+defineProps({
+  modelValue: String,
+});
+
+const emits = defineEmits<{
+  (e: "update:modelValue", value: string): void;
+}>();
+
+const input = ref<HTMLInputElement | null>(null);
+
+function focus() {
+  input.value?.focus();
+}
+
+defineExpose({
+  focus
+});
+</script>
+
+<template>
+    <a-row type="flex" style="align-items: center">
+      <a-col style="width: 120px; text-align: right;">
+        报告模板名称:
+      </a-col>
+      <a-col flex="1">
+        <a-input 
+          :value="modelValue"
+          @input="emits('update:modelValue', $event.target.value)"
+          ref="input"
+        />
+      </a-col>
+    </a-row>
+</template>
+
+<style scoped lang="scss">
+</style>