⚡ 优化执行逻辑.

orion-ops-ui/src/views/exec/exec-command/index.vue

@@ -18,7 +18,7 @@
 </script>
 
 <script lang="ts" setup>
-  import type { ExecCommandResponse } from '@/api/exec/exec';
+  import type { ExecLogQueryResponse } from '@/api/exec/exec-log';
   import { nextTick, onMounted, ref } from 'vue';
   import useVisible from '@/hooks/visible';
   import { useDictStore } from '@/store';
@@ -32,7 +32,7 @@
   const log = ref();
 
   // 打开日志
-  const openLog = (record: ExecCommandResponse) => {
+  const openLog = (record: ExecLogQueryResponse) => {
     setLogVisible(true);
     nextTick(() => {
       log.value.open(record);

orion-ops-ui/src/views/exec/exec-log/components/exec-log-table.vue

@@ -163,7 +163,7 @@
           <a-button v-permission="['asset:exec:exec-command']"
                     type="text"
                     size="mini"
-                    @click="emits('viewLog', record.id)">
+                    @click="() => emits('viewLog', record.id, $event.ctrlKey)">
             日志
           </a-button>
           <!-- 中断 -->
@@ -221,8 +221,6 @@
 
   const emits = defineEmits(['viewCommand', 'viewParams', 'viewLog', 'openClear']);
 
-  // TODO 日志 ctrl日志
-
   const pagination = usePagination();
   const rowSelection = useRowSelection();
   const expandable = useExpandable();

orion-ops-ui/src/views/exec/exec-log/index.vue

@@ -4,10 +4,13 @@
     <exec-log-table ref="tableRef"
                     @view-command="viewCommand"
                     @view-params="viewParams"
+                    @view-log="viewLog"
                     @open-clear="openClearModal" />
     <!-- 清理模态框 -->
     <exec-log-clear-modal ref="clearModal"
                           @clear="clearCallback" />
+    <!-- 执行日志模态框 -->
+    <exec-log-panel-modal ref="logModal" />
     <!-- json 模态框 -->
     <json-editor-modal ref="jsonModal"
                        :esc-to-close="true" />
@@ -32,9 +35,11 @@
   import ExecLogClearModal from './components/exec-log-clear-modal.vue';
   import JsonEditorModal from '@/components/view/json-editor/modal/index.vue';
   import ShellEditorModal from '@/components/view/shell-editor/modal/index.vue';
+  import ExecLogPanelModal from '@/components/exec/log/panel-modal/index.vue';
 
   const render = ref(false);
   const tableRef = ref();
+  const logModal = ref();
   const clearModal = ref();
   const jsonModal = ref();
   const shellModal = ref();
@@ -54,6 +59,15 @@
     jsonModal.value.open(JSON.parse(data));
   };
 
+  // 查看日志
+  const viewLog = (id: number, newWindow: boolean) => {
+    if (newWindow) {
+      // TODO openLog
+    } else {
+      logModal.value.open(id);
+    }
+  };
+
   // 清理回调
   const clearCallback = () => {
     tableRef.value.fetchTableData();

orion-ops-ui/src/views/exec/exec-template/components/exec-template-exec-drawer.vue

@@ -79,9 +79,6 @@
         </a-form-item>
       </a-form>
     </a-spin>
-    <!-- 主机模态框 -->
-    <authorized-host-modal ref="hostModal"
-                           @selected="setSelectedHost" />
   </a-drawer>
 </template>
 
@@ -102,14 +99,14 @@
   import { Message } from '@arco-design/web-vue';
   import { batchExecCommand } from '@/api/exec/exec';
   import ExecEditor from '@/components/view/exec-editor/index.vue';
-  import AuthorizedHostModal from '@/components/asset/host/authorized-host-modal/index.vue';
+
+  const emits = defineEmits(['openHost']);
 
   const { visible, setVisible } = useVisible();
   const { loading, setLoading } = useLoading();
 
   const formRef = ref<any>();
   const parameterFormRef = ref<any>();
-  const hostModal = ref<any>();
   const formModel = ref<ExecCommandRequest>({});
   const parameterFormModel = ref<Record<string, any>>({});
   const parameterSchema = ref<Array<TemplateParam>>([]);
@@ -142,18 +139,18 @@
     }
   };
 
-  defineExpose({ open });
-
-  // 打开选择主机
-  const openSelectHost = () => {
-    hostModal.value.open(formModel.value.hostIdList);
-  };
-
   // 设置选中主机
   const setSelectedHost = (hosts: Array<number>) => {
     formModel.value.hostIdList = hosts;
   };
 
+  defineExpose({ open, setSelectedHost });
+
+  // 打开选择主机
+  const openSelectHost = () => {
+    emits('openHost', formModel.value.hostIdList);
+  };
+
   // 确定
   const handlerOk = async () => {
     setLoading(true);

orion-ops-ui/src/views/exec/exec-template/index.vue

@@ -2,15 +2,19 @@
   <div class="layout-container" v-if="render">
     <!-- 列表-表格 -->
     <exec-template-table ref="table"
-                         @open-exec="e => execModal.open(e)"
+                         @open-exec="(e) => execModal.open(e)"
                          @openAdd="() => drawer.openAdd()"
                          @openUpdate="(e) => drawer.openUpdate(e)" />
     <!-- 添加修改模态框 -->
     <exec-template-form-drawer ref="drawer"
                                @added="modalAddCallback"
                                @updated="modalUpdateCallback" />
+    <!-- 主机模态框 -->
+    <authorized-host-modal ref="hostModal"
+                           @selected="(e) => execModal.setSelectedHost(e)" />
     <!-- 执行模态框 -->
-    <exec-template-exec-drawer ref="execModal" />
+    <exec-template-exec-drawer ref="execModal"
+                               @open-host="(e) => hostModal.open(e)" />
   </div>
 </template>
 
@@ -25,10 +29,15 @@
   import ExecTemplateTable from './components/exec-template-table.vue';
   import ExecTemplateFormDrawer from './components/exec-template-form-drawer.vue';
   import ExecTemplateExecDrawer from './components/exec-template-exec-drawer.vue';
+  import AuthorizedHostModal from '@/components/asset/host/authorized-host-modal/index.vue';
+
+  // TODO TEST 选择主机
+  // TODO openAdd openUpdate 脊柱
 
   const render = ref(false);
   const table = ref();
   const drawer = ref();
+  const hostModal = ref();
   const execModal = ref();
 
   // 添加回调