155 lines
4.4 KiB
Vue
155 lines
4.4 KiB
Vue
<script lang="ts" setup>
|
|
import { Modal, message } from 'ant-design-vue/es';
|
|
import { onMounted, reactive, toRaw } from 'vue';
|
|
import useI18n from '@/hooks/useI18n';
|
|
import { listMenu } from '@/api/system/menu';
|
|
import { RESULT_CODE_SUCCESS } from '@/constants/result-constants';
|
|
import { getConfigKey, changeValue } from '@/api/system/config';
|
|
import { parseDataToTree } from '@/utils/parse-tree-utils';
|
|
const { t } = useI18n();
|
|
|
|
type StateType = {
|
|
edite: boolean;
|
|
loading: boolean;
|
|
open: boolean;
|
|
default: any;
|
|
options: any;
|
|
};
|
|
|
|
let state: StateType = reactive({
|
|
edite: false,
|
|
loading: false,
|
|
open: false,
|
|
default: '',
|
|
options: [],
|
|
});
|
|
|
|
/**提交保存 */
|
|
function fnSave() {
|
|
Modal.confirm({
|
|
title: t('common.tipTitle'),
|
|
content: t('views.system.setting.homeTip'),
|
|
onOk() {
|
|
// 发送请求
|
|
const hide = message.loading(t('common.loading'), 0);
|
|
state.loading = true;
|
|
changeValue({ key: 'sys.homePage', value: state.default })
|
|
.then(res => {
|
|
if (res.code === RESULT_CODE_SUCCESS) {
|
|
message.success(t('views.system.setting.saveSuccess'), 3);
|
|
fnEdit(false);
|
|
} else {
|
|
message.error(res.msg, 3);
|
|
}
|
|
})
|
|
.finally(() => {
|
|
state.loading = false;
|
|
hide();
|
|
});
|
|
},
|
|
});
|
|
}
|
|
|
|
/**进入可编辑 */
|
|
function fnEdit(v: boolean) {
|
|
state.edite = v;
|
|
state.open = v;
|
|
}
|
|
|
|
onMounted(() => {
|
|
listMenu(toRaw({ status: 1 })).then(res => {
|
|
if (res.code === RESULT_CODE_SUCCESS) {
|
|
state.options = parseDataToTree(res.data, 'menuId');
|
|
const setDisabledAndComponent = (item:any) => {
|
|
if (!item.component) {
|
|
item.disabled = true;
|
|
item.component = 'Null' + item.menuId;
|
|
}
|
|
};
|
|
|
|
state.options.forEach((item:any) => {
|
|
setDisabledAndComponent(item); // 处理父菜单
|
|
if (item.children && Array.isArray(item.children)) {
|
|
item.children.forEach(setDisabledAndComponent); // 处理子菜单
|
|
}
|
|
});
|
|
}
|
|
});
|
|
|
|
//获取当前系统设置的首页路径 111为configID
|
|
getConfigKey('sys.homePage').then(res => {
|
|
if (res.code === RESULT_CODE_SUCCESS && res.data) {
|
|
state.default = res.data;
|
|
}
|
|
});
|
|
});
|
|
</script>
|
|
|
|
<template>
|
|
<a-row>
|
|
<a-col :lg="12" :md="12" :xs="24" style="margin-bottom: 30px">
|
|
<template v-if="state.edite">
|
|
<a-form-item :label="t('views.system.setting.home')">
|
|
<a-tree-select
|
|
v-model:value="state.default"
|
|
show-search
|
|
style="width: 240px"
|
|
:tree-data="state.options"
|
|
:field-names="{
|
|
children: 'children',
|
|
label: 'menuName',
|
|
value: 'component',
|
|
}"
|
|
tree-default-expand-all
|
|
tree-node-label-prop="menuName"
|
|
tree-node-filter-prop="menuName"
|
|
:dropdown-style="{ maxHeight: '400px', overflow: 'auto' }"
|
|
:placeholder="t('common.selectPlease')"
|
|
></a-tree-select>
|
|
</a-form-item>
|
|
|
|
<a-button type="primary" @click="fnSave">
|
|
{{ t('views.system.setting.saveSubmit') }}
|
|
</a-button>
|
|
<a-button style="margin-left: 10px" @click="fnEdit(false)">
|
|
{{ t('common.cancel') }}
|
|
</a-button>
|
|
</template>
|
|
<template v-else>
|
|
<a-form-item :label="t('views.system.setting.home')">
|
|
<a-tree-select
|
|
v-model:value="state.default"
|
|
:disabled="true"
|
|
show-search
|
|
style="width: 240px"
|
|
:tree-data="state.options"
|
|
:field-names="{
|
|
children: 'children',
|
|
label: 'menuName',
|
|
value: 'component',
|
|
}"
|
|
tree-default-expand-all
|
|
tree-node-label-prop="menuName"
|
|
tree-node-filter-prop="menuName"
|
|
:dropdown-style="{ maxHeight: '400px', overflow: 'auto' }"
|
|
:placeholder="t('common.selectPlease')"
|
|
></a-tree-select>
|
|
</a-form-item>
|
|
|
|
<a-button type="dashed" @click="fnEdit(true)">
|
|
{{ t('common.editText') }}
|
|
</a-button>
|
|
</template>
|
|
</a-col>
|
|
<a-col :lg="12" :md="12" :xs="24">
|
|
<a-typography>
|
|
<a-typography-paragraph>
|
|
{{ t('views.system.setting.homeInstruction') }}
|
|
</a-typography-paragraph>
|
|
</a-typography>
|
|
</a-col>
|
|
</a-row>
|
|
</template>
|
|
|
|
<style lang="less" scoped></style>
|