feat: 字典配置前端代码.

This commit is contained in:
lijiahang
2023-10-26 19:25:08 +08:00
parent 29e3bde5b6
commit 5d43a9ce88
11 changed files with 36 additions and 88 deletions

View File

@@ -38,7 +38,6 @@ export interface DictValueQueryRequest extends Pagination {
id?: number; id?: number;
keyId?: number; keyId?: number;
keyName?: string; keyName?: string;
name?: string;
value?: string; value?: string;
label?: string; label?: string;
extra?: string; extra?: string;
@@ -53,7 +52,6 @@ export interface DictValueQueryResponse extends TableData {
keyId?: number; keyId?: number;
keyName?: string; keyName?: string;
keyDescription?: string; keyDescription?: string;
name?: string;
value?: string; value?: string;
label?: string; label?: string;
extra?: string; extra?: string;
@@ -65,9 +63,9 @@ export interface DictValueQueryResponse extends TableData {
} }
/** /**
* 字典配置值枚举查询响应 * 字典配置值选项查询响应
*/ */
export interface DictValueEnumQueryResponse extends Options { export interface DictValueOptionsQueryResponse extends Options {
[key: string]: unknown; [key: string]: unknown;
} }
@@ -96,15 +94,13 @@ export function rollbackDictValue(request: DictValueRollbackRequest) {
/** /**
* 查询字典配置值 * 查询字典配置值
*/ */
export function getDictValue(keyName: string) { export function getDictValueList(keys: string[]) {
return axios.get<Array<DictValueQueryResponse>>('/infra/dict-value/list', { params: { keyName } }); return axios.get<Record<string, Array<DictValueOptionsQueryResponse>>>('/infra/dict-value/list', {
} params: { keys },
paramsSerializer: params => {
/** return qs.stringify(params, { arrayFormat: 'comma' });
* 查询字典配置值枚举 }
*/ });
export function getDictValueEnum(keyName: string) {
return axios.get<Record<string, DictValueEnumQueryResponse>>('/infra/dict-value/enum', { params: { keyName } });
} }
/** /**

View File

@@ -84,7 +84,7 @@ export const createDefaultOptions = (): Options => {
minimap: { minimap: {
enabled: false, enabled: false,
}, },
fontSize: 16, fontSize: 14,
scrollBeyondLastLine: false, scrollBeyondLastLine: false,
overviewRulerBorder: false, overviewRulerBorder: false,
colorDecorators: true, colorDecorators: true,

View File

@@ -92,11 +92,10 @@
</template> </template>
<!-- 地址 --> <!-- 地址 -->
<template #address="{ record }"> <template #address="{ record }">
<a-tooltip content="点击复制"> <span title="复制">
<span class="host-address" @click="copy(record.address)"> <icon-copy class="copy-left" @click="copy(record.address)" />
<icon-copy /> {{ record.address }} </span>
</span> <span class="span-blue">{{ record.address }}</span>
</a-tooltip>
</template> </template>
<!-- 标签 --> <!-- 标签 -->
<template #tags="{ record }"> <template #tags="{ record }">
@@ -252,11 +251,6 @@
<style lang="less" scoped> <style lang="less" scoped>
.host-address {
cursor: pointer;
color: rgb(var(--arcoblue-6))
}
.row-handle-wrapper { .row-handle-wrapper {
display: flex; display: flex;
align-items: center; align-items: center;

View File

@@ -55,9 +55,8 @@
:bordered="false"> :bordered="false">
<!-- 配置项 --> <!-- 配置项 -->
<template #keyName="{ record }"> <template #keyName="{ record }">
<span class="pointer" @click="copy(record.keyName)"> <icon-copy class="copy-left" title="复制" @click="copy(record.keyName)" />
<icon-copy /> {{ record.keyName }} <span>{{ record.keyName }}</span>
</span>
</template> </template>
<!-- 配置值类型 --> <!-- 配置值类型 -->
<template #valueType="{ record }"> <template #valueType="{ record }">

View File

@@ -27,7 +27,7 @@
import { ref } from 'vue'; import { ref } from 'vue';
import useLoading from '@/hooks/loading'; import useLoading from '@/hooks/loading';
import useVisible from '@/hooks/visible'; import useVisible from '@/hooks/visible';
import { getDictValueEnum } from '@/api/system/dict-value'; import { getDictValueList } from '@/api/system/dict-value';
const { visible, setVisible } = useVisible(); const { visible, setVisible } = useVisible();
const { loading, setLoading } = useLoading(); const { loading, setLoading } = useLoading();
@@ -48,8 +48,8 @@
try { try {
setLoading(true); setLoading(true);
// 查看 // 查看
const { data } = await getDictValueEnum(keyName); const { data } = await getDictValueList([keyName]);
value.value = JSON.stringify(data, undefined, 4); value.value = JSON.stringify(data[keyName], undefined, 4);
} finally { } finally {
setLoading(false); setLoading(false);
} }

View File

@@ -17,7 +17,7 @@ export const definedExtraKeys = [{
/** /**
* 内置字段 * 内置字段
*/ */
export const innerKeys = ['name', 'value', 'label']; export const innerKeys = ['value', 'label'];
/** /**
* 额外参数类型 * 额外参数类型

View File

@@ -15,12 +15,6 @@ const columns = [
align: 'left', align: 'left',
ellipsis: true, ellipsis: true,
tooltip: true, tooltip: true,
}, {
title: '类型',
dataIndex: 'valueType',
slotName: 'valueType',
align: 'left',
width: 150
}, { }, {
title: '配置描述', title: '配置描述',
dataIndex: 'description', dataIndex: 'description',
@@ -28,6 +22,12 @@ const columns = [
align: 'left', align: 'left',
ellipsis: true, ellipsis: true,
tooltip: true, tooltip: true,
}, {
title: '类型',
dataIndex: 'valueType',
slotName: 'valueType',
align: 'left',
width: 150
}, { }, {
title: '额外配置', title: '额外配置',
dataIndex: 'extraSchema', dataIndex: 'extraSchema',

View File

@@ -24,15 +24,6 @@
<a-form-item field="keyId" label="配置项"> <a-form-item field="keyId" label="配置项">
<dict-key-selector v-model="formModel.keyId" @change="changeKey" /> <dict-key-selector v-model="formModel.keyId" @change="changeKey" />
</a-form-item> </a-form-item>
<!-- 配置名称 -->
<a-form-item field="name" label="配置名称">
<a-input v-model="formModel.name" placeholder="请输入配置名称" allow-clear />
<span class="item-extra-block pointer"
title="同步到值"
@click="() => formModel.value = formModel.name">
<icon-caret-down style="font-size: 16px" />
</span>
</a-form-item>
<!-- 配置值 --> <!-- 配置值 -->
<a-form-item field="value" label="配置值"> <a-form-item field="value" label="配置值">
<a-input v-model="formModel.value" placeholder="请输入配置值" allow-clear /> <a-input v-model="formModel.value" placeholder="请输入配置值" allow-clear />
@@ -117,7 +108,6 @@
return { return {
id: undefined, id: undefined,
keyId: undefined, keyId: undefined,
name: undefined,
value: undefined, value: undefined,
label: undefined, label: undefined,
extra: undefined, extra: undefined,

View File

@@ -12,10 +12,6 @@
@change="changeKey" @change="changeKey"
allow-create /> allow-create />
</a-form-item> </a-form-item>
<!-- 配置名称 -->
<a-form-item field="name" label="配置名称" label-col-flex="50px">
<a-input v-model="formModel.name" placeholder="请输入配置名称" allow-clear />
</a-form-item>
<!-- 配置值 --> <!-- 配置值 -->
<a-form-item field="value" label="配置值" label-col-flex="50px"> <a-form-item field="value" label="配置值" label-col-flex="50px">
<a-input v-model="formModel.value" placeholder="请输入配置值" allow-clear /> <a-input v-model="formModel.value" placeholder="请输入配置值" allow-clear />
@@ -80,23 +76,12 @@
@page-change="(page) => fetchTableData(page, pagination.pageSize)" @page-change="(page) => fetchTableData(page, pagination.pageSize)"
@page-size-change="(size) => fetchTableData(1, size)" @page-size-change="(size) => fetchTableData(1, size)"
:bordered="false"> :bordered="false">
<!-- 名称 -->
<template #name="{ record }">
<span class="pointer" @click="copy(record.name)">
<icon-copy class="copy-left" />
<a-tooltip :content="record.name">
<span>{{ record.name }}</span>
</a-tooltip>
</span>
</template>
<!-- 值 --> <!-- 值 -->
<template #value="{ record }"> <template #value="{ record }">
<span class="pointer" @click="copy(record.value)"> <icon-copy class="copy-left" title="复制" @click="copy(record.value)" />
<icon-copy class="copy-left" /> <a-tooltip :content="record.value">
<a-tooltip :content="record.value"> <span>{{ record.value }}</span>
<span>{{ record.value }}</span> </a-tooltip>
</a-tooltip>
</span>
</template> </template>
<!-- 操作 --> <!-- 操作 -->
<template #handle="{ record }"> <template #handle="{ record }">
@@ -163,7 +148,6 @@
id: undefined, id: undefined,
keyId: undefined, keyId: undefined,
keyName: undefined, keyName: undefined,
name: undefined,
value: undefined, value: undefined,
label: undefined, label: undefined,
extra: undefined, extra: undefined,

View File

@@ -13,14 +13,6 @@ export const keyName = [{
message: '配置项长度不能大于32位' message: '配置项长度不能大于32位'
}] as FieldRule[]; }] as FieldRule[];
export const name = [{
required: true,
message: '请输入配置名称'
}, {
maxLength: 32,
message: '配置名称长度不能大于32位'
}] as FieldRule[];
export const value = [{ export const value = [{
required: true, required: true,
message: '请输入配置值' message: '请输入配置值'
@@ -50,7 +42,6 @@ export const sort = [{
export default { export default {
keyId, keyId,
keyName, keyName,
name,
value, value,
label, label,
extra, extra,

View File

@@ -19,18 +19,6 @@ const columns = [
render: ({ record }) => { render: ({ record }) => {
return `${record.keyName} - ${record.keyDescription}`; return `${record.keyName} - ${record.keyDescription}`;
}, },
}, {
title: '配置名称',
dataIndex: 'name',
slotName: 'name',
align: 'left',
ellipsis: true,
}, {
title: '配置值',
dataIndex: 'value',
slotName: 'value',
align: 'left',
ellipsis: true,
}, { }, {
title: '配置描述', title: '配置描述',
dataIndex: 'label', dataIndex: 'label',
@@ -38,6 +26,12 @@ const columns = [
align: 'left', align: 'left',
ellipsis: true, ellipsis: true,
tooltip: true, tooltip: true,
}, {
title: '配置值',
dataIndex: 'value',
slotName: 'value',
align: 'left',
ellipsis: true,
}, { }, {
title: '额外参数', title: '额外参数',
dataIndex: 'extra', dataIndex: 'extra',