136 lines
4.3 KiB
Vue
136 lines
4.3 KiB
Vue
<template>
|
|
<div>
|
|
<div class="n-layout-page-header">
|
|
<n-card :bordered="false" title="IM意见反馈配置" />
|
|
</div>
|
|
<n-card :bordered="false" class="proCard">
|
|
<n-form
|
|
ref="formRef"
|
|
:model="formValue"
|
|
:rules="rules"
|
|
label-placement="left"
|
|
label-width="120"
|
|
>
|
|
<n-form-item label="商户">
|
|
<n-select
|
|
v-model:value="selectedTenantId"
|
|
:options="tenantOptions"
|
|
placeholder="请选择商户"
|
|
@update:value="loadConfig"
|
|
/>
|
|
</n-form-item>
|
|
<n-form-item label="允许联系方式">
|
|
<n-switch v-model:value="allowContactValue" />
|
|
</n-form-item>
|
|
<n-form-item label="最大字数" path="maxLength">
|
|
<n-input-number v-model:value="formValue.maxLength" :min="1" />
|
|
</n-form-item>
|
|
<n-form-item label="反馈分类">
|
|
<n-input
|
|
v-model:value="formValue.categories"
|
|
type="textarea"
|
|
:autosize="{ minRows: 3, maxRows: 6 }"
|
|
placeholder="请输入JSON数组"
|
|
/>
|
|
</n-form-item>
|
|
<n-form-item label="附件策略">
|
|
<n-input
|
|
v-model:value="formValue.attachmentPolicy"
|
|
type="textarea"
|
|
:autosize="{ minRows: 3, maxRows: 6 }"
|
|
placeholder="请输入JSON对象"
|
|
/>
|
|
</n-form-item>
|
|
<n-form-item label="诊断提示" path="diagnosticsNotice">
|
|
<n-input
|
|
v-model:value="formValue.diagnosticsNotice"
|
|
type="textarea"
|
|
:autosize="{ minRows: 4, maxRows: 8 }"
|
|
placeholder="请输入诊断提示"
|
|
/>
|
|
</n-form-item>
|
|
<n-form-item>
|
|
<n-space>
|
|
<n-button
|
|
type="primary"
|
|
:loading="submitLoading"
|
|
:disabled="!hasPermission(['/imFeedbackConfig/update']) || !currentTenantReady"
|
|
@click="handleSubmit"
|
|
>
|
|
保存
|
|
</n-button>
|
|
<n-button :loading="loadLoading" @click="loadConfig">刷新</n-button>
|
|
</n-space>
|
|
</n-form-item>
|
|
</n-form>
|
|
</n-card>
|
|
</div>
|
|
</template>
|
|
|
|
<script lang="ts" setup>
|
|
import { computed, onMounted, ref } from 'vue';
|
|
import { useMessage } from 'naive-ui';
|
|
import { usePermission } from '@/hooks/web/usePermission';
|
|
import { Get, Update } from '@/api/imFeedbackConfig';
|
|
import { loadOptions, loadTenantOptions, newState, rules, State, tenantOptions } from './model';
|
|
|
|
const message = useMessage();
|
|
const { hasPermission } = usePermission();
|
|
const formRef = ref();
|
|
const formValue = ref<State>(newState(null));
|
|
const selectedTenantId = ref(0);
|
|
const loadLoading = ref(false);
|
|
const submitLoading = ref(false);
|
|
const currentTenantReady = computed(() => selectedTenantId.value > 0);
|
|
|
|
const allowContactValue = computed({
|
|
get: () => formValue.value.allowContact === 1,
|
|
set: (value: boolean) => {
|
|
formValue.value.allowContact = value ? 1 : 0;
|
|
},
|
|
});
|
|
|
|
async function loadConfig() {
|
|
if (!currentTenantReady.value) return;
|
|
loadLoading.value = true;
|
|
try {
|
|
const data = await Get({ tenantId: selectedTenantId.value });
|
|
formValue.value = newState(data || null);
|
|
formValue.value.tenantId = selectedTenantId.value;
|
|
} catch (e: any) {
|
|
message.error(e.message || '加载失败');
|
|
} finally {
|
|
loadLoading.value = false;
|
|
}
|
|
}
|
|
|
|
async function handleSubmit() {
|
|
submitLoading.value = true;
|
|
try {
|
|
await formRef.value?.validate();
|
|
const categories = JSON.parse(formValue.value.categories || '[]');
|
|
const attachmentPolicy = JSON.parse(formValue.value.attachmentPolicy || '{}');
|
|
await Update({
|
|
...formValue.value,
|
|
tenantId: selectedTenantId.value,
|
|
categories,
|
|
attachmentPolicy,
|
|
});
|
|
message.success('操作成功');
|
|
await loadConfig();
|
|
} catch (e: any) {
|
|
message.error(e.message || '操作失败');
|
|
} finally {
|
|
submitLoading.value = false;
|
|
}
|
|
}
|
|
|
|
onMounted(async () => {
|
|
loadOptions();
|
|
await loadTenantOptions();
|
|
if (tenantOptions.value.length > 0) selectedTenantId.value = tenantOptions.value[0].value;
|
|
else message.warning('暂无可用商户');
|
|
await loadConfig();
|
|
});
|
|
</script>
|