Skip to content

Commit

Permalink
feat: 快照恢复过程增加任务执行记录显示
Browse files Browse the repository at this point in the history
  • Loading branch information
@ssongliu
ssongliu committed Sep 24, 2024
1 parent 5fc60b1 commit e6a69cc
Show file tree
Hide file tree
Showing 5 changed files with 144 additions and 39 deletions.
10 changes: 7 additions & 3 deletions frontend/src/api/interface/setting.ts
View file
Original file line number Diff line number Diff line change
Expand Up @@ -139,6 +139,7 @@ export namespace Setting {
}
export interface SnapshotRecover {
id: number;
taskID: string;
isNew: boolean;
reDownload: boolean;
secret: string;
Expand All @@ -153,14 +154,17 @@ export namespace Setting {
message: string;
createdAt: DateTimeFormats;
version: string;
secret: string;

taskID: string;
taskRecoverID: string;
taskRollbackID: string;

interruptStep: string;
recoverStatus: string;
recoverMessage: string;
lastRecoveredAt: string;
rollbackStatus: string;
rollbackMessage: string;
lastRollbackedAt: string;
secret: string;
}
export interface SnapshotData {
appData: Array<DataTree>;
Expand Down
9 changes: 3 additions & 6 deletions frontend/src/lang/modules/zh.ts
View file
Original file line number Diff line number Diff line change
Expand Up @@ -1414,11 +1414,7 @@ const message = {
stepPanelData: '系统数据',
stepBackupData: '备份数据',
stepOtherData: '其他数据',
operationLog: '保留操作日志',
loginLog: '保留访问日志',
systemLog: '保留系统日志',
taskLog: '保留任务日志',
monitorData: '保留监控数据',
monitorData: '监控数据',
selectAllImage: '备份所有应用镜像',
agentLabel: '节点配置',
appDataLabel: '应用数据',
Expand Down Expand Up @@ -1454,13 +1450,14 @@ const message = {
compress: '制作快照文件',
upload: '上传快照文件',
recoverDetail: '恢复详情',
recoverFailed: '快照恢复失败',
createSnapshot: '创建快照',
importSnapshot: '同步快照',
importHelper: '快照文件目录：',
recover: '恢复',
lastRecoverAt: '上次恢复时间',
lastRollbackAt: '上次回滚时间',
reDownload: '重新下载备份文件',
reDownload: '重新下载',
statusSuccess: '成功',
statusFailed: '失败',
recoverErrArch: '不支持在不同服务器架构之间进行快照恢复操作!',
Expand Down
20 changes: 15 additions & 5 deletions frontend/src/views/setting/snapshot/create/index.vue
View file
Original file line number Diff line number Diff line change
Expand Up @@ -118,11 +118,21 @@
</el-tree>
</fu-step>
<fu-step id="otherData" :title="$t('setting.stepOtherData')">
<el-checkbox v-model="form.withOperationLog" :label="$t('setting.operationLog')" size="large" />
<el-checkbox v-model="form.withLoginLog" :label="$t('setting.loginLog')" size="large" />
<el-checkbox v-model="form.withSystemLog" :label="$t('setting.systemLog')" size="large" />
<el-checkbox v-model="form.withTaskLog" :label="$t('setting.taskLog')" size="large" />
<el-checkbox v-model="form.withMonitorData" :label="$t('setting.monitorData')" size="large" />
<div class="ml-5">
<el-checkbox v-model="form.withOperationLog" :label="$t('logs.operation')" size="large" />
</div>
<div class="ml-5">
<el-checkbox v-model="form.withLoginLog" :label="$t('logs.login')" size="large" />
</div>
<div class="ml-5">
<el-checkbox v-model="form.withSystemLog" :label="$t('logs.system')" size="large" />
</div>
<div class="ml-5">
<el-checkbox v-model="form.withTaskLog" :label="$t('logs.task')" size="large" />
</div>
<div class="ml-5">
<el-checkbox v-model="form.withMonitorData" :label="$t('setting.monitorData')" size="large" />
</div>
</fu-step>
<template #footer></template>
</fu-steps>
Expand Down
92 changes: 76 additions & 16 deletions frontend/src/views/setting/snapshot/index.vue
View file
Original file line number Diff line number Diff line change
Expand Up @@ -77,19 +77,49 @@
</el-table-column>
<el-table-column :label="$t('commons.table.status')" min-width="80" prop="status">
<template #default="{ row }">
<el-button
v-if="row.status === 'Waiting' || row.status === 'OnSaveData'"
type="primary"
link
>
{{ $t('commons.table.statusWaiting') }}
</el-button>
<el-button v-if="row.status === 'Failed'" @click="reCreate(row)" type="danger" link>
{{ $t('commons.status.error') }}
</el-button>
<el-tag v-if="row.status === 'Success'" type="success">
{{ $t('commons.status.success') }}
</el-tag>
<div>
<el-button link v-if="row.status === 'Waiting'" type="primary">
{{ $t('setting.snapshot') }}{{ $t('commons.table.statusWaiting') }}
</el-button>
<el-button link v-if="row.status === 'Failed'" @click="reCreate(row)" type="danger">
{{ $t('setting.snapshot') }}{{ $t('commons.status.error') }}
</el-button>
<el-button link v-if="row.status === 'Success'" type="success">
{{ $t('setting.snapshot') }}{{ $t('commons.status.success') }}
</el-button>
</div>
<div v-if="row.recoverStatus">
<el-button link v-if="row.recoverStatus === 'Waiting'" type="primary">
{{ $t('commons.button.recover') }}{{ $t('commons.table.statusWaiting') }}
</el-button>
<el-button
v-if="row.recoverStatus === 'Failed'"
@click="onRecover(row)"
type="danger"
link
>
{{ $t('commons.button.recover') }}{{ $t('commons.status.error') }}
</el-button>
<el-button link v-if="row.recoverStatus === 'Success'" type="success">
{{ $t('commons.button.recover') }}{{ $t('commons.status.success') }}
</el-button>
</div>
<div v-if="row.rollbackStatus">
<el-button link v-if="row.rollbackStatus === 'Waiting'" type="primary">
{{ $t('setting.rollback') }}{{ $t('commons.table.statusWaiting') }}
</el-button>
<el-button
link
v-if="row.rollbackStatus === 'Failed'"
@click="reCreate(row)"
type="danger"
>
{{ $t('setting.rollback') }}{{ $t('commons.status.error') }}
</el-button>
<el-button link v-if="row.recoverStatus === 'Success'" type="success">
{{ $t('setting.rollback') }}{{ $t('commons.status.success') }}
</el-button>
</div>
</template>
</el-table-column>
<el-table-column :label="$t('commons.table.description')" prop="description" show-overflow-tooltip>
Expand All @@ -104,7 +134,7 @@
show-overflow-tooltip
/>
<fu-table-operations
width="200px"
width="240px"
:ellipsis="10"
:buttons="buttons"
:label="$t('commons.table.operate')"
Expand All @@ -131,6 +161,7 @@
</template>
</OpDialog>
<TaskLog ref="taskLogRef" width="70%" />
<SnapRecover ref="recoverRef" />
</div>
</template>

Expand All @@ -146,7 +177,9 @@ import TaskLog from '@/components/task-log/index.vue';
import RecoverStatus from '@/views/setting/snapshot/status/index.vue';
import SnapshotImport from '@/views/setting/snapshot/import/index.vue';
import SnapshotCreate from '@/views/setting/snapshot/create/index.vue';
import SnapRecover from '@/views/setting/snapshot/recover/index.vue';
import { MsgSuccess } from '@/utils/message';
import { loadOsInfo } from '@/api/modules/dashboard';
const loading = ref(false);
const data = ref();
Expand All @@ -167,6 +200,7 @@ const recoverStatusRef = ref();
const importRef = ref();
const isRecordShow = ref();
const taskLogRef = ref();
const recoverRef = ref();
const operateIDs = ref();
const cleanData = ref();
Expand Down Expand Up @@ -213,6 +247,33 @@ const onChange = async (info: any) => {
MsgSuccess(i18n.global.t('commons.msg.operationSuccess'));
};
const onRecover = async (row: any) => {
loading.value = true;
await loadOsInfo()
.then((res) => {
loading.value = false;
let params = {
id: row.id,
taskID: row.taskRecoverID,
isNew: row.recoverStatus === '',
name: row.name,
reDownload: false,
secret: row.secret,
arch: res.data.kernelArch,
size: row.size,
freeSize: res.data.diskSize,
status: row.recoverStatus,
message: row.recoverMessage,
};
recoverRef.value.acceptParams(params);
})
.catch(() => {
loading.value = false;
});
};
const batchDelete = async (row: Setting.SnapshotInfo | null) => {
let names = [];
let ids = [];
Expand Down Expand Up @@ -254,9 +315,8 @@ const onSubmitDelete = async () => {
const buttons = [
{
label: i18n.global.t('commons.button.recover'),
icon: 'RefreshLeft',
click: (row: any) => {
recoverStatusRef.value.acceptParams({ snapInfo: row });
onRecover(row);
},
disabled: (row: any) => {
return !(row.status === 'Success');
Expand Down
52 changes: 43 additions & 9 deletions frontend/src/views/setting/snapshot/recover/index.vue
View file
Original file line number Diff line number Diff line change
Expand Up @@ -7,8 +7,8 @@
:before-close="handleClose"
>
<el-form ref="recoverForm" label-position="top" v-loading="loading">
{{ $t('setting.recoverHelper', [recoverReq.name]) }}
<div style="margin-left: 20px; line-height: 32px">
<div style="margin-left: 20px; line-height: 32px" v-if="recoverReq.isNew">
{{ $t('setting.recoverHelper', [recoverReq.name]) }}
<div>
<el-button style="margin-top: -4px" type="warning" link icon="WarningFilled" />
{{ $t('setting.recoverHelper1') }}
Expand All @@ -32,10 +32,13 @@
{{ $t('setting.recoverHelper3', [recoverReq.arch]) }}
</div>
</div>
<el-form-item v-if="!recoverReq.isNew" class="mt-2">
<el-form-item v-if="!recoverReq.isNew" :label="$t('setting.recoverFailed')">
<span>{{ recoverReq.message }}</span>
</el-form-item>
<el-form-item v-if="!recoverReq.isNew" :label="$t('setting.snapshotLabel')">
<el-checkbox v-model="recoverReq.reDownload">{{ $t('setting.reDownload') }}</el-checkbox>
</el-form-item>
<el-form-item :label="$t('setting.compressPassword')" class="mt-2">
<el-form-item :label="$t('setting.compressPassword')">
<el-input v-model="recoverReq.secret" :placeholder="$t('setting.backupRecoverMessage')" />
</el-form-item>
</el-form>
Expand All @@ -44,7 +47,13 @@
<el-button @click="handleClose" :disabled="loading">
{{ $t('commons.button.cancel') }}
</el-button>
<el-button type="primary" @click="submit" :disabled="loading">
<el-button @click="onRollback" v-if="!recoverReq.isNew" :disabled="loading">
{{ $t('setting.rollback') }}
</el-button>
<el-button type="primary" @click="submit" v-if="!recoverReq.isNew" :disabled="loading">
{{ $t('commons.button.retry') }}
</el-button>
<el-button type="primary" @click="submit" v-if="recoverReq.isNew" :disabled="loading">
{{ $t('commons.button.confirm') }}
</el-button>
</span>
Expand All @@ -57,13 +66,13 @@ import { ref } from 'vue';
import { FormInstance } from 'element-plus';
import i18n from '@/lang';
import { MsgSuccess } from '@/utils/message';
import { snapshotRecover } from '@/api/modules/setting';
import { computeSize } from '@/utils/util';
import { snapshotRecover, snapshotRollback } from '@/api/modules/setting';
import { computeSize, newUUID } from '@/utils/util';
let loading = ref(false);
let open = ref(false);
const recoverForm = ref<FormInstance>();
const emit = defineEmits<{ (e: 'search'): void; (e: 'close'): void }>();
const emit = defineEmits<{ (e: 'search'): void }>();
interface DialogProps {
id: number;
Expand All @@ -73,6 +82,8 @@ interface DialogProps {
arch: string;
size: number;
freeSize: number;
status: string;
message: string;
}
let recoverReq = ref({
Expand All @@ -84,6 +95,8 @@ let recoverReq = ref({
arch: '',
size: 0,
freeSize: 0,
status: '',
message: '',
});
const handleClose = () => {
Expand All @@ -99,6 +112,8 @@ const acceptParams = (params: DialogProps): void => {
arch: params.arch,
size: params.size,
freeSize: params.freeSize,
status: params.status,
message: params.message,
};
open.value = true;
};
Expand All @@ -120,6 +135,7 @@ const submit = async () => {
loading.value = true;
await snapshotRecover({
id: recoverReq.value.id,
taskID: newUUID(),
isNew: recoverReq.value.isNew,
reDownload: recoverReq.value.reDownload,
secret: recoverReq.value.secret,
Expand All @@ -128,14 +144,32 @@ const submit = async () => {
emit('search');
loading.value = false;
handleClose();
emit('close');
MsgSuccess(i18n.global.t('commons.msg.operationSuccess'));
})
.catch(() => {
loading.value = false;
});
};
const onRollback = async (row: any) => {
ElMessageBox.confirm(i18n.global.t('setting.rollbackHelper'), i18n.global.t('setting.rollback'), {
confirmButtonText: i18n.global.t('commons.button.confirm'),
cancelButtonText: i18n.global.t('commons.button.cancel'),
type: 'info',
}).then(async () => {
loading.value = true;
await snapshotRollback({ id: row.id, taskID: newUUID(), isNew: false, reDownload: false, secret: '' })
.then(() => {
emit('search');
loading.value = false;
MsgSuccess(i18n.global.t('commons.msg.operationSuccess'));
})
.catch(() => {
loading.value = false;
});
});
};
defineExpose({
acceptParams,
});
Expand Down

0 comments on commit e6a69cc

Please sign in to comment.