--调整回退按钮

This commit is contained in:
lai
2023-12-20 11:22:55 +08:00
parent 99c6d233e5
commit 823114a6d0
3 changed files with 159 additions and 20 deletions

View File

@@ -173,8 +173,8 @@ export default {
reload: "Refresh Current Tab",
more: "More Options",
closeCurrent: "Close Current Tab",
closeOther: "Close Other Tab",
closeAll: "Close All Tab",
closeOther: "Close Other Tabs",
closeAll: "Close All Tabs",
}
},
@@ -402,6 +402,7 @@ export default {
createTime:'Creation time',
onlyAble:'Only upload file format {fileText} is supported',
nullData:'No network element list data yet',
nullVersion:'There is no rollback version for the current network element.',
},
license: {
neTypePlease: 'Select network element type',

View File

@@ -402,6 +402,7 @@ export default {
createTime:'创建时间',
onlyAble:'只支持上传文件格式 {fileText}',
nullData:'暂无网元列表数据',
nullVersion:'当前网元无可回退版本',
},
license: {
neTypePlease: '选择网元类型',

View File

@@ -8,7 +8,7 @@ import { ColumnsType } from 'ant-design-vue/lib/table';
import { parseDateToStr } from '@/utils/date-utils';
import { RESULT_CODE_SUCCESS } from '@/constants/result-constants';
import SoftwareHistory from './components/software-history.vue';
import { listNeVersion } from '@/api/configManage/softwareManage';
import {
listNeSoftware,
delNeSoftware,
@@ -154,14 +154,20 @@ type FileStateType = {
visible: boolean;
/**框类型 */
visibleType: string;
/**回退框是否显示 */
visibleByBack: boolean;
/**标题 */
title: string;
/**提示内容 */
content: string;
/**OK按钮是否禁用 */
okDisable: boolean;
/**网元参数 */
neOtions: Record<string, any>[];
/**表单数据 */
from: Record<string, any>;
/**回退表单数据 */
backFrom: Record<string, any>;
/**确定按钮 loading */
confirmLoading: boolean;
};
@@ -170,12 +176,19 @@ type FileStateType = {
let fileModalState: FileStateType = reactive({
visible: false,
visibleType: 'send',
visibleByBack: false,
title: '下发激活回退',
content: '',
okDisable: false,
neOtions: [],
from: {
neId: undefined,
},
backFrom: {
neType: undefined,
neId: undefined,
version: '',
},
confirmLoading: false,
});
@@ -192,6 +205,19 @@ const fileModalStateFrom = Form.useForm(
})
);
/**对话框内表单属性和校验规则 */
const fileModalStateBackFrom = Form.useForm(
fileModalState.backFrom,
reactive({
neType: [
{
required: true,
message: t('views.configManage.softwareManage.neIdPlease'),
},
],
})
);
/**
* 文件对话框弹出显示为 下发或激活
*/
@@ -217,13 +243,7 @@ function fnFileModalVisible(type: string | number, row: Record<string, any>) {
fileName: row.fileName,
});
}
if (type === 'back') {
fileModalState.title = t('views.configManage.softwareManage.backTitle');
fileModalState.content = t(
'views.configManage.softwareManage.backContent',
{ fileName: row.fileName }
);
}
if (!fileModalState.content) {
return;
}
@@ -263,9 +283,6 @@ function fnFileModalOk() {
if (type === 'run') {
fnType = runNeSoftware(from);
}
if (type === 'back') {
fnType = backNeSoftware(from);
}
if (fnType === null) {
return;
}
@@ -396,6 +413,7 @@ type ModalStateType = {
visibleByEdit: boolean;
/**网元版本历史框是否显示 */
visibleByHistory: boolean;
/**标题 */
title: string;
/**表单数据 */
@@ -408,6 +426,7 @@ type ModalStateType = {
let modalState: ModalStateType = reactive({
visibleByEdit: false,
visibleByHistory: false,
visibleByBack: false,
title: '上传更新',
from: {
neType: undefined,
@@ -512,8 +531,10 @@ function fnModalOk() {
*/
function fnModalCancel() {
modalState.visibleByEdit = false;
fileModalState.visibleByBack = false;
modalState.visibleByHistory = false;
modalStateFrom.resetFields();
fileModalStateBackFrom.resetFields();
}
/**
@@ -523,6 +544,88 @@ function fnModalVisibleByHistory() {
modalState.visibleByHistory = true;
}
/**
* 对话框弹出显示为 回退框
*/
function fnModalVisibleByBack() {
fileModalState.visibleByBack = true;
fileModalState.title = t('views.configManage.softwareManage.backTitle');
fileModalState.content = t('views.configManage.softwareManage.neIdPlease');
if (!fileModalState.content) {
return;
}
}
/**回退网元类型选择对应修改 */
function fnNeChange(_: any, item: any) {
fileModalState.backFrom.neType = item[1].neType;
fileModalState.backFrom.neId = item[1].neId;
let queryData: any = fileModalState.backFrom;
queryData.status = 'Active';
queryData.pageNum = 1;
queryData.pageSize = 20;
listNeVersion(toRaw(queryData)).then(res => {
if (res.code === RESULT_CODE_SUCCESS && Array.isArray(res.rows)) {
if (
!res.total ||
!res.rows[0].preVersion ||
res.rows[0].preVersion === '-'
) {
fileModalState.okDisable = true;
fileModalState.content = t(
'views.configManage.softwareManage.nullVersion'
);
tableState.loading = false;
return;
}
fileModalState.content = t(
'views.configManage.softwareManage.backContent',
{ fileName: res.rows[0].preVersion }
);
fileModalState.backFrom.version = res.rows[0].preVersion;
fileModalState.okDisable = false;
}
tableState.loading = false;
});
}
/**
* 回退对话框弹出确认执行函数
*/
function fnBackModalOk() {
fileModalStateBackFrom
.validate()
.then(e => {
const from = toRaw(fileModalState.backFrom);
// 发送请求
fileModalState.confirmLoading = true;
const hide = message.loading({ content: t('common.loading') });
backNeSoftware(from)
.then(res => {
if (res.code === RESULT_CODE_SUCCESS) {
message.success({
content: t('common.msgSuccess', { msg: fileModalState.title }),
duration: 3,
});
fnFileModalCancel();
} else {
message.error({
content: `${fileModalState.title} ${res.msg}`,
duration: 3,
});
}
})
.finally(() => {
hide();
fileModalState.confirmLoading = false;
});
})
.catch(e => {
message.error(t('common.errorFields', { num: e.errorFields.length }), 3);
});
}
/**上传前检查或转换压缩 */
function fnBeforeUploadFile(file: FileType) {
if (modalState.confirmLoading) return false;
@@ -538,9 +641,9 @@ function fnBeforeUploadFile(file: FileType) {
return false;
}
// 根据给定的软件名取版本号 ims-r2.2312.8_u18.deb
const nameArr = fileName.split('.')
if(nameArr.length > 3) {
modalState.from.version = nameArr[1]
const nameArr = fileName.split('.');
if (nameArr.length > 3) {
modalState.from.version = nameArr[1];
}
return true;
}
@@ -657,6 +760,10 @@ onMounted(() => {
<template #icon><HistoryOutlined /></template>
{{ t('views.configManage.softwareManage.historyBtn') }}
</a-button>
<a-button type="dashed" @click.prevent="fnModalVisibleByBack()">
<template #icon> <UndoOutlined /></template>
{{ t('views.configManage.softwareManage.backBtn') }}
</a-button>
</a-space>
</template>
@@ -762,10 +869,6 @@ onMounted(() => {
<DeleteOutlined />
{{ t('common.deleteText') }}
</a-menu-item>
<a-menu-item key="back">
<UndoOutlined />
{{ t('views.configManage.softwareManage.backBtn') }}
</a-menu-item>
</a-menu>
</template>
</a-dropdown>
@@ -910,6 +1013,40 @@ onMounted(() => {
</a-form-item>
</a-form>
</a-modal>
<!-- 回退框 -->
<a-modal
width="800px"
:keyboard="false"
:mask-closable="false"
:visible="fileModalState.visibleByBack"
:title="fileModalState.title"
:confirm-loading="fileModalState.confirmLoading"
@ok="fnBackModalOk"
:ok-button-props="{ disabled: fileModalState.okDisable }"
@cancel="fnModalCancel"
>
<a-form name="fileModalState" layout="horizontal">
<a-form-item name="content">
<QuestionCircleOutlined class="file-model__icon" />
<span class="file-model__tip">
{{ fileModalState.content }}
</span>
</a-form-item>
<a-form-item
:label="t('views.configManage.license.neType')"
name="neType"
v-bind="fileModalStateBackFrom.validateInfos.neType"
>
<a-cascader
:options="useNeInfoStore().getNeCascaderOptions"
:allow-clear="false"
@change="fnNeChange"
:placeholder="t('views.configManage.softwareManage.neTypePlease')"
/>
</a-form-item>
</a-form>
</a-modal>
</PageContainer>
</template>