refactor: 审批类型

src/utils/i18n/en.ts

@@ -18,6 +18,7 @@ const lang = {
     '上一步': 'Previous',
     '下一步': 'Next',
     '查看': 'View',
+    '审批类型': 'Approval Type',
   },
   '菜单': {
     '首页': 'Home',

src/utils/i18n/zh.ts

@@ -18,6 +18,7 @@ const lang = {
     '上一步': '上一步',
     '下一步': '下一步',
     '查看': '查看',
+    '审批类型': '审批类型',
   },
   '菜单': {
     '首页': '首页',

src/views/index/approvalPreview/components/approvalTypeHeader.vue

@@ -0,0 +1,50 @@
+<template>
+  <div class="header">
+    <div class="label">{{ $t('通用.审批类型') }}</div>
+    <div class="content">
+      <el-tag :type="tagTypeMap[approveAction]" size="small">{{ contents }}</el-tag>
+    </div>
+  </div>
+</template>
+
+<script setup lang="ts">
+import { ref, watchEffect } from 'vue';
+
+interface Props {
+  data: any;
+}
+
+const props = withDefaults(defineProps<Props>(), {
+  data: {},
+});
+
+const contents = ref<string>('');
+const approveAction = ref<any>();
+const tagTypeMap: any = {
+  1: 'success',
+  2: 'primary',
+  3: 'danger',
+};
+
+watchEffect(() => {
+  if (props.data) {
+    const approveContents = JSON.parse(props.data?.approveContents || '{}');
+    contents.value = approveContents.contents || '';
+    approveAction.value = props.data?.approveAction || '';
+  }
+});
+</script>
+
+<style lang="scss" scoped>
+.header {
+  margin-bottom: 24px;
+  display: flex;
+}
+.label {
+  font-weight: 600;
+  margin-right: 16px;
+}
+.content {
+  white-space: pre-wrap;
+}
+</style>

src/views/index/approvalPreview/components/deliverableFile.vue

@@ -1,10 +1,5 @@
 <template>
-  <div class="header">
-    <div class="label">审批类型</div>
-    <div class="content">
-      <el-tag :type="tagTypeMap[approveAction]" size="small">{{ contents }}</el-tag>
-    </div>
-  </div>
+  <approvalTypeHeader :data="data" />
   <BaseTable
     ref="baseTableRef"
     tableName="TASK_DELIVERABLE"
@@ -31,6 +26,7 @@
 <script setup lang="ts">
 import { computed, ref, watchEffect } from 'vue';
 import BaseTable from '@/components/common/table/baseTable.vue';
+import approvalTypeHeader from './approvalTypeHeader.vue';
 import i18n from '@/utils/i18n';
 import { formatFileSize } from '@/utils/file';
 import FilePreview from '@/components/common/filePreview/index.vue';
@@ -44,20 +40,11 @@ const props = withDefaults(defineProps<Props>(), {
 });
 const env = import.meta.env;
 const knowledgeList = ref<any[]>([]);
-const contents = ref<string>('');
-const approveAction = ref<any>();
-const tagTypeMap:any = {
-  1: 'success',
-  2: 'primary',
-  3: 'danger',
-};
 const baseTableRef = ref<any>(null);
 watchEffect(() => {
   if (props.data) {
     const approveContents = JSON.parse(props.data?.approveContents || '{}');
     knowledgeList.value = approveContents.afterData || approveContents.beforeData || null;
-    contents.value = approveContents.contents || '';
-    approveAction.value = props.data?.approveAction || '';
     if (baseTableRef.value && knowledgeList.value) {
       baseTableRef.value?.setDataFun(knowledgeList.value);
     }
@@ -99,17 +86,3 @@ const actionList = computed(() => {
 
 });
 </script>
-  <style lang="scss" scoped>
-  .header {
-    margin-bottom: 24px;
-    display: flex;
-  }
-  .label {
-    font-weight: 600;
-    margin-right: 16px;
-  }
-  .content {
-    white-space: pre-wrap;
-  }
-
-  </style>

src/views/index/approvalPreview/components/knowledge.vue

@@ -1,10 +1,5 @@
 <template>
-  <div class="header">
-    <div class="label">审批类型</div>
-    <div class="content">
-      <el-tag :type="tagTypeMap[approveAction]" size="small">{{ contents }}</el-tag>
-    </div>
-  </div>
+  <approvalTypeHeader :data="data" />
   <BaseTable
     ref="baseTableRef"
     :tableName="TABLE_NAME.SIMULATION_KNOWLEDGE_APPROVE_PREVIEW"
@@ -31,6 +26,7 @@
 <script setup lang="ts">
 import { computed, ref, watchEffect } from 'vue';
 import BaseTable from '@/components/common/table/baseTable.vue';
+import approvalTypeHeader from './approvalTypeHeader.vue';
 import i18n from '@/utils/i18n';
 import { formatFileSize } from '@/utils/file';
 import FilePreview from '@/components/common/filePreview/index.vue';
@@ -45,20 +41,11 @@ const props = withDefaults(defineProps<Props>(), {
   data: {},
 });
 const knowledgeList = ref<any[]>([]);
-const contents = ref<string>('');
-const approveAction = ref<any>();
-const tagTypeMap:any = {
-  1: 'success',
-  2: 'primary',
-  3: 'danger',
-};
 const baseTableRef = ref<any>(null);
 watchEffect(() => {
   if (props.data) {
     const approveContents = JSON.parse(props.data?.approveContents || '{}');
     knowledgeList.value = approveContents.afterData || approveContents.beforeData || null;
-    contents.value = approveContents.contents || '';
-    approveAction.value = props.data?.approveAction || '';
     if (baseTableRef.value && knowledgeList.value) {
       baseTableRef.value?.setDataFun(knowledgeList.value);
     }
@@ -97,17 +84,3 @@ const actionList = computed(() => {
 
 });
 </script>
-<style lang="scss" scoped>
-.header {
-  margin-bottom: 24px;
-  display: flex;
-}
-.label {
-  font-weight: 600;
-  margin-right: 16px;
-}
-.content {
-  white-space: pre-wrap;
-}
-
-</style>