From de67b4dd9ec093f903d775e95d57ed6b8042ae21 Mon Sep 17 00:00:00 2001
From: hLinx <327159425@qq.com>
Date: Thu, 5 Dec 2024 22:42:45 +0800
Subject: [PATCH] =?UTF-8?q?feat(frontend):=20=E9=9B=86=E7=BE=A4=E3=80=81?=
 =?UTF-8?q?=E5=AE=9E=E4=BE=8B=E8=A1=A5=E5=85=85=E5=AD=97=E6=AE=B5=20#7813?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 .../ticket-center/common/CardModeList.vue     |  3 ++-
 .../common/ticket-detail/Index.vue            | 21 ++++++++++++++++++-
 .../flow-type-itsm/StatusSucceeded.vue        |  5 +++++
 .../components/todo-list/type-itsm/Index.vue  |  4 ++++
 .../todo-list/type-itsm/StatusSuccess.vue     | 18 ++++++++++++++++
 5 files changed, 49 insertions(+), 2 deletions(-)
 create mode 100644 dbm-ui/frontend/src/views/ticket-center/common/ticket-detail/components/flow-info/components/todo-list/type-itsm/StatusSuccess.vue

diff --git a/dbm-ui/frontend/src/views/ticket-center/common/CardModeList.vue b/dbm-ui/frontend/src/views/ticket-center/common/CardModeList.vue
index 35d6c59822..bb628ff640 100644
--- a/dbm-ui/frontend/src/views/ticket-center/common/CardModeList.vue
+++ b/dbm-ui/frontend/src/views/ticket-center/common/CardModeList.vue
@@ -151,7 +151,7 @@
 
   let isInit = true;
 
-  const { pause: pauseFetchData } = watch(
+  const { pause: pauseFetchData, resume: resumeFetchData } = watch(
     [formatDateValue, formatSearchValue],
     _.debounce(() => {
       if (!isInit) {
@@ -188,6 +188,7 @@
   };
 
   onActivated(() => {
+    resumeFetchData();
     currentTicketScrollToTop();
     eventBus.on('refreshTicketStatus', fetchData);
   });
diff --git a/dbm-ui/frontend/src/views/ticket-center/common/ticket-detail/Index.vue b/dbm-ui/frontend/src/views/ticket-center/common/ticket-detail/Index.vue
index d5f54b7142..aff365ff1d 100644
--- a/dbm-ui/frontend/src/views/ticket-center/common/ticket-detail/Index.vue
+++ b/dbm-ui/frontend/src/views/ticket-center/common/ticket-detail/Index.vue
@@ -47,6 +47,11 @@
               :text="false"
               theme="" />
             <TicketRevoke :data="ticketData" />
+            <BkButton
+              v-if="isShowGoDetail"
+              @click="handleGoDetail">
+              {{ t('新窗口打开') }}
+            </BkButton>
           </template>
         </SmartAction>
       </PermissionCatch>
@@ -56,6 +61,7 @@
 <script setup lang="tsx">
   import { useI18n } from 'vue-i18n';
   import { useRequest } from 'vue-request';
+  import { useRoute, useRouter } from 'vue-router';
 
   import TicketModel from '@services/model/ticket/ticket';
   import { getTicketDetails } from '@services/source/ticket';
@@ -79,13 +85,16 @@
 
   const props = defineProps<Props>();
 
+  const router = useRouter();
+  const route = useRoute();
   const eventBus = useEventBus();
   const { t } = useI18n();
 
   const getOffsetTarget = () => document.body.querySelector('.ticket-details-page .db-card');
 
-  const isTaskInfoCardCollapse = useStorage('ticketTaskInfo', false);
+  const isShowGoDetail = route.name !== 'ticketDetail';
 
+  const isTaskInfoCardCollapse = useStorage('ticketTaskInfo', false);
   const isLoading = ref(true);
   const ticketData = shallowRef<TicketModel>();
 
@@ -131,6 +140,16 @@
     },
   );
 
+  const handleGoDetail = () => {
+    const { href } = router.resolve({
+      name: 'ticketDetail',
+      params: {
+        ticketId: props.ticketId,
+      },
+    });
+    window.open(href);
+  };
+
   eventBus.on('refreshTicketStatus', refreshTicketData);
 
   onBeforeUnmount(() => {
diff --git a/dbm-ui/frontend/src/views/ticket-center/common/ticket-detail/components/flow-info/components/flow-type-itsm/StatusSucceeded.vue b/dbm-ui/frontend/src/views/ticket-center/common/ticket-detail/components/flow-info/components/flow-type-itsm/StatusSucceeded.vue
index a2b755982e..b6e063e44f 100644
--- a/dbm-ui/frontend/src/views/ticket-center/common/ticket-detail/components/flow-info/components/flow-type-itsm/StatusSucceeded.vue
+++ b/dbm-ui/frontend/src/views/ticket-center/common/ticket-detail/components/flow-info/components/flow-type-itsm/StatusSucceeded.vue
@@ -17,6 +17,10 @@
           {{ t('查看详情') }}
         </a>
       </template>
+      <TodoList
+        v-if="data.todos.length > 0"
+        :data="data.todos"
+        :flow-data="data" />
     </template>
   </StatusSucceeded>
 </template>
@@ -30,6 +34,7 @@
   import { utcTimeToSeconds } from '@utils';
 
   import StatusSucceeded from '../flow-type-common/StatusSucceeded.vue';
+  import TodoList from '../todo-list/Index.vue';
 
   interface Props {
     data: FlowMode<
diff --git a/dbm-ui/frontend/src/views/ticket-center/common/ticket-detail/components/flow-info/components/todo-list/type-itsm/Index.vue b/dbm-ui/frontend/src/views/ticket-center/common/ticket-detail/components/flow-info/components/todo-list/type-itsm/Index.vue
index f27748756e..da0a1d99af 100644
--- a/dbm-ui/frontend/src/views/ticket-center/common/ticket-detail/components/flow-info/components/todo-list/type-itsm/Index.vue
+++ b/dbm-ui/frontend/src/views/ticket-center/common/ticket-detail/components/flow-info/components/todo-list/type-itsm/Index.vue
@@ -12,6 +12,7 @@
   import StatusCommon from '../common';
 
   import StatusDoneFailed from './StatusDoneFailed.vue';
+  import StatusSuccess from './StatusSuccess.vue';
   import StatusTodo from './StatusTodo.vue';
 
   interface Props {
@@ -24,5 +25,8 @@
   const renderCom = Object.assign({}, StatusCommon, {
     [FlowMode.TODO_STATUS_TODO]: StatusTodo,
     [FlowMode.TODO_STATUS_DONE_FAILED]: StatusDoneFailed,
+    [FlowMode.TODO_STATUS_DONE_SUCCESS]: StatusSuccess,
   })[props.data.status];
+
+  console.log('props.data.status = ', props.data.status, renderCom);
 </script>
diff --git a/dbm-ui/frontend/src/views/ticket-center/common/ticket-detail/components/flow-info/components/todo-list/type-itsm/StatusSuccess.vue b/dbm-ui/frontend/src/views/ticket-center/common/ticket-detail/components/flow-info/components/todo-list/type-itsm/StatusSuccess.vue
new file mode 100644
index 0000000000..2132119f2c
--- /dev/null
+++ b/dbm-ui/frontend/src/views/ticket-center/common/ticket-detail/components/flow-info/components/todo-list/type-itsm/StatusSuccess.vue
@@ -0,0 +1,18 @@
+<template>
+  <div style="margin-top: 10px; color: #979ba5">{{ utcDisplayTime(data.done_at) }}</div>
+</template>
+<script setup lang="ts">
+  import FlowMode from '@services/model/ticket/flow';
+
+  import { utcDisplayTime } from '@utils';
+
+  interface Props {
+    data: FlowMode<unknown>['todos'][number];
+  }
+
+  defineProps<Props>();
+
+  defineOptions({
+    name: FlowMode.TODO_STATUS_DONE_SUCCESS,
+  });
+</script>