117 lines
3.4 KiB
Vue
117 lines
3.4 KiB
Vue
<template>
|
||
<div class="user-setting">
|
||
<setting-row label="登录后显示页面" desc="候选项取自系统菜单,仅对该账号生效,修改后下次登录生效。">
|
||
<el-select
|
||
v-model="form.loginRedirect"
|
||
filterable
|
||
:loading="optionsLoading"
|
||
placeholder="请选择登录后进入的页面"
|
||
class="setting-control"
|
||
>
|
||
<el-option
|
||
v-for="item in options"
|
||
:key="item.path"
|
||
:label="item.menuName"
|
||
:value="item.path"
|
||
/>
|
||
</el-select>
|
||
</setting-row>
|
||
|
||
<setting-row label="查询网关子设备" desc="按设备编号查询时生效:输入网关子设备编号会返回其所属网关设备;同时允许查到「网关子设备」类型的产品设备。不按编号查(默认列表)时不生效,列表始终不展示子设备。">
|
||
<el-switch v-model="form.queryGatewayChild" />
|
||
</setting-row>
|
||
|
||
<div class="setting-actions">
|
||
<el-button type="primary" icon="el-icon-check" :loading="saving" @click="submitForm">保存</el-button>
|
||
<el-button icon="el-icon-refresh-left" @click="handleReset">重置</el-button>
|
||
</div>
|
||
</div>
|
||
</template>
|
||
|
||
<script>
|
||
import {
|
||
getUserSetting,
|
||
updateUserSetting,
|
||
listLoginRedirectOptions
|
||
} from '@/api/system/userSetting';
|
||
import SettingRow from './SettingRow';
|
||
|
||
// 默认值与后端 UserSettingConstants 保持一致:
|
||
// 未指定的账号保持原有的数据大屏落地行为;子设备开关默认关闭
|
||
const DEFAULT_FORM = {
|
||
loginRedirect: '/bigscreen',
|
||
queryGatewayChild: false
|
||
};
|
||
|
||
export default {
|
||
name: 'UserSettingForm',
|
||
components: { SettingRow },
|
||
data() {
|
||
return {
|
||
saving: false,
|
||
optionsLoading: false,
|
||
options: [],
|
||
form: { ...DEFAULT_FORM }
|
||
};
|
||
},
|
||
created() {
|
||
this.getOptions();
|
||
this.getSetting();
|
||
},
|
||
methods: {
|
||
getOptions() {
|
||
this.optionsLoading = true;
|
||
listLoginRedirectOptions()
|
||
.then((res) => {
|
||
this.options = res.data || [];
|
||
})
|
||
.finally(() => {
|
||
this.optionsLoading = false;
|
||
});
|
||
},
|
||
getSetting() {
|
||
getUserSetting().then((res) => {
|
||
const data = res.data || {};
|
||
// 后端对未配置过的用户返回默认值,此处仅在值缺失时兜底。
|
||
// queryGatewayChild 不能用 ||:布尔 false 会被吞掉,导致开关回显错乱。
|
||
this.form = {
|
||
loginRedirect: data.loginRedirect || DEFAULT_FORM.loginRedirect,
|
||
queryGatewayChild: data.queryGatewayChild === null || data.queryGatewayChild === undefined
|
||
? DEFAULT_FORM.queryGatewayChild
|
||
: data.queryGatewayChild
|
||
};
|
||
});
|
||
},
|
||
submitForm() {
|
||
this.saving = true;
|
||
updateUserSetting({
|
||
loginRedirect: this.form.loginRedirect,
|
||
queryGatewayChild: this.form.queryGatewayChild
|
||
})
|
||
.then(() => {
|
||
this.$modal.msgSuccess('保存成功,下次登录生效');
|
||
})
|
||
.finally(() => {
|
||
this.saving = false;
|
||
});
|
||
},
|
||
handleReset() {
|
||
this.form = { ...DEFAULT_FORM };
|
||
this.getSetting();
|
||
}
|
||
}
|
||
};
|
||
</script>
|
||
|
||
<style lang="scss" scoped>
|
||
.setting-control {
|
||
width: 100%;
|
||
}
|
||
|
||
// 动作按钮缩进到控件列下方(而不是清单左边缘):
|
||
// 172px = SettingRow 的标签列 160px + 列间距 12px,见 SettingRow.vue
|
||
.setting-actions {
|
||
padding: 16px 0 0 172px;
|
||
}
|
||
</style>
|