94 lines
2.2 KiB
Vue
94 lines
2.2 KiB
Vue
<script lang="ts" setup>
|
|
import { message } from 'ant-design-vue/lib';
|
|
import { reactive } from 'vue';
|
|
import useI18n from '@/hooks/useI18n';
|
|
import { RESULT_CODE_SUCCESS } from '@/constants/result-constants';
|
|
import useLockedStore from '@/store/modules/locked';
|
|
import { bootloaderReset } from '@/api/system/quick-start/bootloader';
|
|
const lockedStore = useLockedStore();
|
|
const { t } = useI18n();
|
|
|
|
type StateType = {
|
|
visible: boolean;
|
|
count: number;
|
|
timer: any;
|
|
};
|
|
|
|
let state: StateType = reactive({
|
|
visible: false,
|
|
count: 10,
|
|
timer: null,
|
|
});
|
|
|
|
/**对话框弹出显示 */
|
|
function fnModalVisible() {
|
|
state.visible = true;
|
|
// 倒数
|
|
state.timer = setInterval(() => {
|
|
if (state.count < 0) {
|
|
clearInterval(state.timer);
|
|
state.timer = null;
|
|
}
|
|
state.count--;
|
|
}, 1_000);
|
|
}
|
|
|
|
/**对话框提交确认 */
|
|
function fnModalOk() {
|
|
// 发送请求
|
|
lockedStore.fnLock('reset');
|
|
bootloaderReset().then(res => {
|
|
if (res.code === RESULT_CODE_SUCCESS) {
|
|
fnModalCancel();
|
|
lockedStore.fnLock('reload');
|
|
} else {
|
|
lockedStore.fnLock('none');
|
|
message.error(res.msg, 3);
|
|
clearInterval(state.timer);
|
|
state.timer = null;
|
|
}
|
|
});
|
|
}
|
|
|
|
/**对话框取消操作 */
|
|
function fnModalCancel() {
|
|
clearInterval(state.timer);
|
|
state.timer = null;
|
|
state.count = 10;
|
|
state.visible = false;
|
|
}
|
|
</script>
|
|
|
|
<template>
|
|
<a-row :gutter="16">
|
|
<a-col :lg="12" :md="12" :xs="24" style="margin-bottom: 30px">
|
|
<a-button type="dashed" danger @click="fnModalVisible()">
|
|
{{ t('common.reset') }}
|
|
</a-button>
|
|
</a-col>
|
|
<a-modal
|
|
:mask-closable="false"
|
|
v-model:visible="state.visible"
|
|
:title="t('common.tipTitle')"
|
|
:ok-text="
|
|
state.count > 0 ? `${t('common.ok')} ${state.count}` : t('common.ok')
|
|
"
|
|
:confirmLoading="state.count > 0"
|
|
@ok="fnModalOk()"
|
|
@cancel="fnModalCancel()"
|
|
>
|
|
{{ t('views.system.setting.resetTipContent') }}
|
|
</a-modal>
|
|
|
|
<a-col :lg="12" :md="12" :xs="24">
|
|
<a-typography>
|
|
<a-typography-paragraph>
|
|
{{ t('views.system.setting.resetInstruction') }}
|
|
</a-typography-paragraph>
|
|
</a-typography>
|
|
</a-col>
|
|
</a-row>
|
|
</template>
|
|
|
|
<style lang="less" scoped></style>
|