manager/orion-visor
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

✨ 计划任务中断及清理.

Browse Source
This commit is contained in:
lijiahang
2024-04-12 17:23:59 +08:00
parent b78d03b751
commit 7e8e5d4d08
17 changed files with 206 additions and 58 deletions
Download Patch File Download Diff File Expand all files Collapse all files

80
orion-ops-ui/src/components/exec/job/selector/index.vue Normal file
View File

@@ -0,0 +1,80 @@
<template>
<a-select v-model:model-value="value as any"
:options="optionData"
:allow-search="true"
:loading="loading"
:disabled="loading"
:filter-option="labelFilter"
:allow-create="allowCreate"
placeholder="请选择计划任务" />
</template>
<script lang="ts">
export default {
name: 'execJobSelector'
};
</script>
<script lang="ts" setup>
import type { SelectOptionData } from '@arco-design/web-vue';
import { computed, onBeforeMount, ref } from 'vue';
import { useCacheStore } from '@/store';
import { labelFilter } from '@/types/form';
import useLoading from '@/hooks/loading';
const props = withDefaults(defineProps<Partial<{
modelValue: number;
name: string;
allowCreate: boolean;
}>>(), {
allowCreate: false,
});
const emits = defineEmits(['update:modelValue', 'update:name']);
const { loading, setLoading } = useLoading();
const cacheStore = useCacheStore();
const value = computed({
get() {
if (props.allowCreate) {
return props.modelValue || props.name;
} else {
return props.modelValue;
}
},
set(e) {
if (typeof e === 'string') {
emits('update:modelValue', null);
emits('update:name', e);
} else {
// 已有的值
emits('update:modelValue', e);
emits('update:name', null);
}
}
});
const optionData = ref<Array<SelectOptionData>>([]);
// 初始化选项
onBeforeMount(async () => {
setLoading(true);
try {
const dictKeys = await cacheStore.loadExecJobs();
optionData.value = dictKeys.map(s => {
return {
label: s.name,
value: s.id,
};
});
} catch (e) {
} finally {
setLoading(false);
}
});
</script>
<style lang="less" scoped>
</style>

3
orion-ops-ui/src/components/exec/log/const.ts
View File

@@ -1,3 +1,6 @@
// 执行类型
export type ExecType = 'BATCH' | 'JOB';
// 批量执行状态
export const execStatus = {
// 等待中

20
orion-ops-ui/src/components/exec/log/panel-modal/index.vue
View File

@@ -16,7 +16,9 @@
:loading="loading">
<div class="panel-wrapper">
<!-- 日志面板 -->
<exec-log-panel ref="log" :visible-back="false" />
<exec-log-panel ref="log"
:type="type"
:visible-back="false" />
</div>
</a-spin>
</a-modal>
@@ -29,12 +31,18 @@
</script>
<script lang="ts" setup>
import type { ExecType } from '../const';
import useVisible from '@/hooks/visible';
import useLoading from '@/hooks/loading';
import { nextTick, ref } from 'vue';
import { getExecCommandLog } from '@/api/exec/exec-command-log';
import { getExecJobLog } from '@/api/exec/exec-job-log';
import ExecLogPanel from '../panel/index.vue';
const props = defineProps<{
type: ExecType;
}>();
const { visible, setVisible } = useVisible();
const { loading, setLoading } = useLoading();
@@ -46,7 +54,15 @@
setLoading(true);
try {
// 获取执行日志
const { data } = await getExecCommandLog(id);
let detailGetter;
if (props.type === 'BATCH') {
// 批量执行日志
detailGetter = getExecCommandLog(id);
} else {
// 计划任务日志
detailGetter = getExecJobLog(id);
}
const { data } = await detailGetter;
// 打开日志
await nextTick(() => {
setTimeout(() => {

22
orion-ops-ui/src/components/exec/log/panel/index.vue
View File

@@ -10,8 +10,9 @@
<!-- 日志容器 -->
<log-view ref="logViewRef"
class="log-view-container"
:type="type"
:current="currentHostExecId"
:hosts="execLog.hosts"
:exec-log="execLog"
:appender="appender" />
</div>
</template>
@@ -25,16 +26,19 @@
<script lang="ts" setup>
import type { ExecLogQueryResponse } from '@/api/exec/exec-log';
import type { ILogAppender } from './appender-const';
import type { ExecType } from '../const';
import { onUnmounted, ref, nextTick, onMounted } from 'vue';
import { getExecCommandLogStatus } from '@/api/exec/exec-command-log';
import { getExecJobLogStatus } from '@/api/exec/exec-job-log';
import { dictKeys, execHostStatus, execStatus } from '../const';
import { useDictStore } from '@/store';
import ExecHost from './exec-host.vue';
import LogView from './log-view.vue';
import LogAppender from '@/components/exec/log/panel/log-appender';
import LogAppender from './log-appender';
const props = defineProps<{
visibleBack: boolean
visibleBack: boolean;
type: ExecType;
}>();
const emits = defineEmits(['back']);
@@ -48,7 +52,7 @@
// 打开
const open = (record: ExecLogQueryResponse) => {
appender.value = new LogAppender({ execId: record.id });
appender.value = new LogAppender(props.type, { execId: record.id });
execLog.value = record;
currentHostExecId.value = record.hosts[0].id;
// 定时查询执行状态
@@ -71,7 +75,15 @@
return;
}
// 加载状态
const { data: { logList, hostList } } = await getExecCommandLogStatus([execLog.value.id]);
let statusGetter;
if (props.type === 'BATCH') {
// 批量执行日志状态
statusGetter = getExecCommandLogStatus([execLog.value.id]);
} else {
// 计划任务日志状态
statusGetter = getExecJobLogStatus([execLog.value.id]);
}
const { data: { logList, hostList } } = await statusGetter;
if (logList.length) {
execLog.value.status = logList[0].status;
execLog.value.startTime = logList[0].startTime;

17
orion-ops-ui/src/components/exec/log/panel/log-appender.ts
View File

@@ -1,7 +1,9 @@
import type { ILogAppender, LogAddons, LogAppenderConf, LogDomRef } from './appender-const';
import { LogAppenderOptions } from './appender-const';
import type { ExecType } from '../const';
import type { ExecLogTailRequest } from '@/api/exec/exec-log';
import { getExecCommandLogTailToken } from '@/api/exec/exec-command-log';
import { getExecJobLogTailToken } from '@/api/exec/exec-job-log';
import { webSocketBaseUrl } from '@/utils/env';
import { Message } from '@arco-design/web-vue';
import { createWebSocket } from '@/utils';
@@ -29,8 +31,11 @@ export default class LogAppender implements ILogAppender {
private readonly fitAllFn: () => {};
constructor(config: ExecLogTailRequest) {
private readonly type: ExecType;
constructor(type: ExecType, config: ExecLogTailRequest) {
this.current = undefined as unknown as LogAppenderConf;
this.type = type;
this.config = config;
this.appenderRel = {};
this.fitAllFn = useDebounceFn(this.fitAll).bind(this);
@@ -141,8 +146,16 @@ export default class LogAppender implements ILogAppender {
// 初始化 client
async openClient() {
let tokenMaker;
// 获取 token
const { data } = await getExecCommandLogTailToken(this.config);
if (this.type === 'BATCH') {
// 获取批量执行日志 token
tokenMaker = getExecCommandLogTailToken(this.config);
} else {
// 获取计划任务日志 token
tokenMaker = getExecJobLogTailToken(this.config);
}
const { data } = await tokenMaker;
// 打开会话
try {
this.client = await createWebSocket(`${webSocketBaseUrl}/exec/log/${data}`);

24
orion-ops-ui/src/components/exec/log/panel/log-item.vue
View File

@@ -4,6 +4,10 @@
<div class="log-header">
<!-- 左侧信息 -->
<a-space class="log-header-left" :size="12">
<!-- 执行序列 -->
<a-tag v-if="execLog.execSeq" color="green">
#{{ execLog.execSeq }}
</a-tag>
<!-- 状态 -->
<a-tag :color="getDictValue(execHostStatusKey, host.status, 'color')">
{{ getDictValue(execHostStatusKey, host.status) }}
@@ -160,20 +164,24 @@
</script>
<script lang="ts" setup>
import type { ExecHostLogQueryResponse } from '@/api/exec/exec-log';
import type { ExecLogQueryResponse, ExecHostLogQueryResponse } from '@/api/exec/exec-log';
import type { ILogAppender } from './appender-const';
import type { ExecType } from '../const';
import { ref } from 'vue';
import { execHostStatus, execHostStatusKey } from '../const';
import { formatDuration } from '@/utils';
import { useDictStore } from '@/store';
import { downloadExecCommandLogFile } from '@/api/exec/exec-command-log';
import { downloadExecJobLogFile } from '@/api/exec/exec-job-log';
import { downloadFile } from '@/utils/file';
import XtermSearchModal from '@/components/xtrem/search-modal/index.vue';
import 'xterm/css/xterm.css';
const props = defineProps<{
type: ExecType;
execLog: ExecLogQueryResponse;
host: ExecHostLogQueryResponse;
appender: ILogAppender
appender: ILogAppender;
}>();
const { getDictValue } = useDictStore();
@@ -204,7 +212,17 @@
// 下载文件
const downloadLogFile = async (id: number) => {
const data = await downloadExecCommandLogFile(id);
// 获取日志文件
let fileGetter;
if (props.type === 'BATCH') {
// 下载批量执行日志
fileGetter = downloadExecCommandLogFile(id);
} else {
// 下载计划任务日志
fileGetter = downloadExecJobLogFile(id);
}
// 瞎子啊
const data = await fileGetter;
downloadFile(data);
};

10
orion-ops-ui/src/components/exec/log/panel/log-view.vue
View File

@@ -2,10 +2,12 @@
<div class="container">
<log-item class="log-item"
v-show="current === host.id"
v-for="host in hosts"
v-for="host in execLog.hosts"
:key="host.id"
:ref="addRef as unknown as VNodeRef"
:type="type"
:host="host"
:exec-log="execLog"
:appender="appender" />
</div>
</template>
@@ -19,14 +21,16 @@
<script lang="ts" setup>
import type { VNodeRef } from 'vue';
import type { LogDomRef, ILogAppender } from './appender-const';
import type { ExecHostLogQueryResponse } from '@/api/exec/exec-log';
import type { ExecLogQueryResponse } from '@/api/exec/exec-log';
import type { ExecType } from '../const';
import { nextTick, ref, watch } from 'vue';
import LogItem from './log-item.vue';
const props = defineProps<{
current: number;
hosts: Array<ExecHostLogQueryResponse>;
execLog: ExecLogQueryResponse;
appender: ILogAppender;
type: ExecType;
}>();
const logRefs = ref<Array<LogDomRef>>([]);

7
orion-ops-ui/src/store/modules/cache/index.ts vendored
View File

@@ -13,12 +13,14 @@ import { getHostGroupTree } from '@/api/asset/host-group';
import { getMenuList } from '@/api/system/menu';
import { getCurrentAuthorizedHostIdentity, getCurrentAuthorizedHostKey } from '@/api/asset/asset-authorized-data';
import { getCommandSnippetGroupList } from '@/api/asset/command-snippet-group';
import { getExecJobList } from '@/api/exec/exec-job';
export type CacheType = 'users' | 'menus' | 'roles'
| 'hosts' | 'hostGroups' | 'hostKeys' | 'hostIdentities'
| 'dictKeys'
| 'authorizedHostKeys' | 'authorizedHostIdentities'
| 'commandSnippetGroups'
| 'execJob'
| string
export default defineStore('cache', {
@@ -118,5 +120,10 @@ export default defineStore('cache', {
return await this.load('commandSnippetGroups', getCommandSnippetGroupList, force);
},
// 获取执行计划列表
async loadExecJobs(force = false) {
return await this.load('execJob', getExecJobList, force);
},
}
});

4
orion-ops-ui/src/views/exec/exec-command-log-view/index.vue
View File

@@ -1,7 +1,9 @@
<template>
<div class="container">
<div class="wrapper">
<exec-log-panel ref="log" :visible-back="false" />
<exec-log-panel ref="log"
type="BATCH"
:visible-back="false" />
</div>
</div>
</template>

3
orion-ops-ui/src/views/exec/exec-command-log/index.vue
View File

@@ -10,7 +10,8 @@
<exec-command-log-clear-modal ref="clearModal"
@clear="clearCallback" />
<!-- 执行日志模态框 -->
<exec-log-panel-modal ref="logModal" />
<exec-log-panel-modal ref="logModal"
type="BATCH" />
<!-- json 模态框 -->
<json-editor-modal ref="jsonModal"
:esc-to-close="true" />

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

@@ -7,6 +7,7 @@
<!-- 执行日志 -->
<div v-if="logVisible" class="panel-wrapper">
<exec-log-panel ref="log"
type="BATCH"
:visibleBack="true"
@back="setLogVisible(false)" />
</div>

4
orion-ops-ui/src/views/exec/exec-job-log-view/index.vue
View File

@@ -1,7 +1,9 @@
<template>
<div class="container">
<div class="wrapper">
<exec-log-panel ref="log" :visible-back="false" />
<exec-log-panel ref="log"
type="JOB"
:visible-back="false" />
</div>
</div>
</template>

14
orion-ops-ui/src/views/exec/exec-job-log/components/exec-job-host-log-table.vue
View File

@@ -103,17 +103,17 @@
<script lang="ts" setup>
import type { ExecLogQueryResponse, ExecHostLogQueryResponse } from '@/api/exec/exec-log';
import { deleteExecJobHostLog } from '@/api/exec/exec-job-log';
import { Message } from '@arco-design/web-vue';
import useLoading from '@/hooks/loading';
import columns from '../../exec-command-log/types/host-table.columns';
import { interruptHostExecJob } from '@/api/exec/exec-job-log';
import { execHostStatusKey, execHostStatus } from '@/components/exec/log/const';
import { useDictStore } from '@/store';
import useLoading from '@/hooks/loading';
import columns from '../../exec-command-log/types/host-table.columns';
import { useExpandable } from '@/types/table';
import { dateFormat, formatDuration } from '@/utils';
// import { interruptHostExecJob } from '@/api/exec/exec-job';
import { downloadExecJobLogFile } from '@/api/exec/exec-job-log';
import { copy } from '@/hooks/copy';
import { downloadFile } from '@/utils/file';
import { Message } from '@arco-design/web-vue';
const props = defineProps<{
row: ExecLogQueryResponse;
@@ -136,9 +136,9 @@
try {
setLoading(true);
// 调用中断接口
// await interruptHostExecJob({
// hostLogId: record.id
// });
await interruptHostExecJob({
hostLogId: record.id
});
Message.success('已中断');
record.status = execHostStatus.INTERRUPTED;
} catch (e) {

24
orion-ops-ui/src/views/exec/exec-job-log/components/exec-job-log-clear-modal.vue
View File

@@ -2,7 +2,7 @@
<a-modal v-model:visible="visible"
body-class="modal-form"
title-align="start"
title="清空批量执行日志"
title="清空计划任务日志"
:align-center="false"
:draggable="true"
:mask-closable="false"
@@ -25,17 +25,12 @@
show-time
format="YYYY-MM-DD HH:mm:ss" />
</a-form-item>
<!-- 执行用户 -->
<a-form-item field="userId" label="执行用户">
<user-selector v-model="formModel.userId"
placeholder="请选择执行用户"
allow-clear />
</a-form-item>
<!-- 执行描述 -->
<a-form-item field="description" label="执行描述">
<a-input v-model="formModel.description"
placeholder="请输入执行描述"
allow-clear />
<!-- 计划任务 -->
<a-form-item field="sourceId" label="计划任务">
<exec-job-selector v-model:model-value="formModel.sourceId"
v-model:name="formModel.description"
allow-create
allow-clear />
</a-form-item>
<!-- 执行命令 -->
<a-form-item field="command" label="执行命令">
@@ -69,7 +64,7 @@
import { getExecJobLogCount, clearExecJobLog } from '@/api/exec/exec-job-log';
import { Message, Modal } from '@arco-design/web-vue';
import { useDictStore } from '@/store';
import UserSelector from '@/components/user/user/selector/index.vue';
import ExecJobSelector from '@/components/exec/job/selector/index.vue';
const emits = defineEmits(['clear']);
@@ -83,7 +78,7 @@
const defaultForm = (): ExecLogQueryRequest => {
return {
id: undefined,
userId: undefined,
sourceId: undefined,
description: undefined,
command: undefined,
status: undefined,
@@ -103,6 +98,7 @@
};
defineExpose({ open });
// 确定
const handlerOk = async () => {
setLoading(true);

26
orion-ops-ui/src/views/exec/exec-job-log/components/exec-job-log-table.vue
View File

@@ -3,14 +3,14 @@
<a-card class="general-card table-search-card">
<query-header :model="formModel"
label-align="left"
:itemOptions="{ 5: { span: 2 } }"
:itemOptions="{ 4: { span: 2 } }"
@submit="fetchTableData"
@reset="fetchTableData"
@keyup.enter="() => fetchTableData()">
<!-- 执行描述 -->
<a-form-item field="description" label="执行描述">
<!-- 任务名称 -->
<a-form-item field="description" label="任务名称">
<a-input v-model="formModel.description"
placeholder="请输入执行描述"
placeholder="请输入任务名称"
allow-clear />
</a-form-item>
<!-- 执行状态 -->
@@ -20,12 +20,6 @@
placeholder="请选择执行状态"
allow-clear />
</a-form-item>
<!-- 执行用户 -->
<a-form-item field="userId" label="执行用户">
<user-selector v-model="formModel.userId"
placeholder="请选择执行用户"
allow-clear />
</a-form-item>
<!-- 执行命令 -->
<a-form-item field="command" label="执行命令">
<a-input v-model="formModel.command"
@@ -212,8 +206,7 @@
import { useExpandable, usePagination, useRowSelection } from '@/types/table';
import { useDictStore } from '@/store';
import { dateFormat, formatDuration } from '@/utils';
// import { interruptExecJob } from '@/api/exec/exec-job';
import UserSelector from '@/components/user/user/selector/index.vue';
import { interruptExecJob } from '@/api/exec/exec-job-log';
import ExecJobHostLogTable from './exec-job-host-log-table.vue';
const emits = defineEmits(['viewCommand', 'viewParams', 'viewLog', 'openClear']);
@@ -230,7 +223,6 @@
const tableRenderData = ref<ExecLogQueryResponse[]>([]);
const formModel = reactive<ExecLogQueryRequest>({
id: undefined,
userId: undefined,
description: undefined,
command: undefined,
status: undefined,
@@ -239,7 +231,7 @@
// 打开清理
const openClear = () => {
emits('openClear', { ...formModel, id: undefined });
emits('openClear', { ...formModel, id: undefined, description: undefined });
};
// 删除选中行
@@ -281,9 +273,9 @@
try {
setLoading(true);
// 调用中断接口
// await interruptExecJob({
// logId: record.id
// });
await interruptExecJob({
logId: record.id
});
Message.success('已中断');
record.status = execStatus.COMPLETED;
} catch (e) {

3
orion-ops-ui/src/views/exec/exec-job-log/index.vue
View File

@@ -10,7 +10,8 @@
<exec-job-log-clear-modal ref="clearModal"
@clear="clearCallback" />
<!-- 执行日志模态框 -->
<exec-log-panel-modal ref="logModal" />
<exec-log-panel-modal ref="logModal"
type="JOB" />
<!-- json 模态框 -->
<json-editor-modal ref="jsonModal"
:esc-to-close="true" />

2
orion-ops-ui/src/views/system/dict-value/components/dict-value-form-modal.vue
View File

@@ -88,6 +88,7 @@
</script>
<script lang="ts" setup>
import type { DictKeyQueryResponse } from '@/api/system/dict-key';
import type { DictValueUpdateRequest } from '@/api/system/dict-value';
import type { ExtraParamType } from '../../dict-key/types/const';
import { ref } from 'vue';
@@ -97,7 +98,6 @@
import { createDictValue, updateDictValue } from '@/api/system/dict-value';
import { Message } from '@arco-design/web-vue';
import { ValueType, sortStep } from '../../dict-key/types/const';
import { DictKeyQueryResponse } from '@/api/system/dict-key';
import { useCacheStore } from '@/store';
import DictKeySelector from '@/components/system/dict-key/selector/index.vue';