@lacqjs/nuxt-dict 0.0.2 → 0.0.3
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/LICENSE +21 -0
- package/README.md +80 -0
- package/dist/module.d.mts +3 -1
- package/dist/module.d.ts +3 -1
- package/dist/module.json +1 -1
- package/dist/module.mjs +130 -7
- package/dist/runtime/composables/useDict.d.ts +6 -0
- package/dist/runtime/composables/useDict.js +29 -7
- package/dist/runtime/composables/useDictTree.d.ts +6 -0
- package/dist/runtime/composables/useDictTree.js +22 -13
- package/dist/runtime/composables/useLocale.d.ts +14 -0
- package/dist/runtime/core/adapter.d.ts +27 -1
- package/dist/runtime/core/dict-manager.d.ts +77 -9
- package/dist/runtime/core/dict-manager.js +80 -19
- package/dist/runtime/types/index.d.ts +302 -19
- package/dist/runtime/utils/dict-translator.d.ts +22 -24
- package/dist/runtime/utils/dict-translator.js +93 -20
- package/dist/types.d.mts +5 -1
- package/package.json +8 -4
- package/dist/runtime/composables/useDictOptions.d.ts +0 -13
- package/dist/runtime/composables/useDictOptions.js +0 -17
|
@@ -34,7 +34,12 @@ export class DictManager {
|
|
|
34
34
|
getAdapter(storeName) {
|
|
35
35
|
return this.adapters.get(storeName) ?? this.adapters.get(DEFAULT_STORE_NAME);
|
|
36
36
|
}
|
|
37
|
-
/**
|
|
37
|
+
/**
|
|
38
|
+
* 切换语言,清空内存缓存和待处理请求。
|
|
39
|
+
* 语言变更后所有 useDict / useDictTree 组件通过 watch 自动重取数据。
|
|
40
|
+
*
|
|
41
|
+
* @param {string} locale - 目标语言代码,如 'zh-CN'、'en-US'
|
|
42
|
+
*/
|
|
38
43
|
setLocale(locale) {
|
|
39
44
|
if (this.locale.value !== locale) {
|
|
40
45
|
this.locale.value = locale;
|
|
@@ -42,6 +47,11 @@ export class DictManager {
|
|
|
42
47
|
this.pendingRequests.clear();
|
|
43
48
|
}
|
|
44
49
|
}
|
|
50
|
+
/**
|
|
51
|
+
* 获取当前语言。
|
|
52
|
+
*
|
|
53
|
+
* @returns {string} 当前语言代码,如 'zh-CN'
|
|
54
|
+
*/
|
|
45
55
|
getLocale() {
|
|
46
56
|
return this.locale.value;
|
|
47
57
|
}
|
|
@@ -79,6 +89,10 @@ export class DictManager {
|
|
|
79
89
|
/**
|
|
80
90
|
* 获取字典数据。
|
|
81
91
|
* 优先级:内存缓存 → 合并中的请求 → IndexedDB → 网络请求
|
|
92
|
+
*
|
|
93
|
+
* @param {string} type - 字典类型名,如 'gender'
|
|
94
|
+
* @param {string} storeName - 仓库名,默认 'dicts'
|
|
95
|
+
* @returns {Promise<DictEntry>} 包含 items 和可选 tree 的字典条目
|
|
82
96
|
*/
|
|
83
97
|
async getDict(type, storeName = DEFAULT_STORE_NAME) {
|
|
84
98
|
await this.ensureVersionChecked(storeName);
|
|
@@ -134,6 +148,10 @@ export class DictManager {
|
|
|
134
148
|
/**
|
|
135
149
|
* 强制刷新指定字典:跳过缓存,直接从网络获取最新数据。
|
|
136
150
|
* 适用于用户手动刷新、数据变更通知等场景。
|
|
151
|
+
*
|
|
152
|
+
* @param {string} type - 字典类型名,如 'gender'
|
|
153
|
+
* @param {string} storeName - 仓库名,默认 'dicts'
|
|
154
|
+
* @returns {Promise<DictEntry>} 最新的字典条目
|
|
137
155
|
*/
|
|
138
156
|
async refresh(type, storeName = DEFAULT_STORE_NAME) {
|
|
139
157
|
const key = this.buildKey(type, storeName);
|
|
@@ -160,32 +178,68 @@ export class DictManager {
|
|
|
160
178
|
}
|
|
161
179
|
return entry;
|
|
162
180
|
}
|
|
163
|
-
/**
|
|
164
|
-
|
|
181
|
+
/**
|
|
182
|
+
* 同步翻译 value → label,未命中缓存时回退原样返回。
|
|
183
|
+
*
|
|
184
|
+
* @param {string} type - 字典类型名,如 'gender'
|
|
185
|
+
* @param {string | number} value - 字典编码值
|
|
186
|
+
* @param {TranslateOptions} opts - 可选配置(storeName 指定仓库,field 指定取值字段,默认 'label')
|
|
187
|
+
* @returns {string} 翻译后的文本,缓存未命中时返回 value 的字符串形式
|
|
188
|
+
*/
|
|
189
|
+
translate(type, value, opts) {
|
|
190
|
+
const storeName = opts?.storeName ?? DEFAULT_STORE_NAME;
|
|
191
|
+
const field = opts?.field ?? "label";
|
|
165
192
|
const key = this.buildKey(type, storeName);
|
|
166
193
|
const entry = this.memoryCache.get(key);
|
|
167
|
-
if (!entry) return String(
|
|
168
|
-
const item = entry.data.items.find((i) => this.codeMatch(i.
|
|
169
|
-
|
|
194
|
+
if (!entry) return String(value);
|
|
195
|
+
const item = entry.data.items.find((i) => this.codeMatch(i.value, value));
|
|
196
|
+
if (!item) return String(value);
|
|
197
|
+
return item[field] ?? item.label;
|
|
170
198
|
}
|
|
171
|
-
/**
|
|
172
|
-
|
|
199
|
+
/**
|
|
200
|
+
* 从内存缓存中查找编码对应的完整字典项对象。
|
|
201
|
+
* 参数与 translate 一致,但返回整个 DictItem 而非提取字段。
|
|
202
|
+
*
|
|
203
|
+
* @param {string} type - 字典类型名,如 'gender'
|
|
204
|
+
* @param {string | number} value - 字典编码值
|
|
205
|
+
* @param {GetDictItemOptions} opts - 可选配置(storeName 指定仓库)
|
|
206
|
+
* @returns {DictItem | undefined} 完整的字典项对象,缓存未命中时返回 undefined
|
|
207
|
+
*/
|
|
208
|
+
getDictItem(type, value, opts) {
|
|
209
|
+
const storeName = opts?.storeName ?? DEFAULT_STORE_NAME;
|
|
173
210
|
const key = this.buildKey(type, storeName);
|
|
174
211
|
const entry = this.memoryCache.get(key);
|
|
175
|
-
if (!entry
|
|
176
|
-
|
|
177
|
-
return path.length > 0 ? path.join(separator) : String(code);
|
|
212
|
+
if (!entry) return void 0;
|
|
213
|
+
return entry.data.items.find((i) => this.codeMatch(i.value, value));
|
|
178
214
|
}
|
|
179
|
-
/**
|
|
180
|
-
|
|
215
|
+
/**
|
|
216
|
+
* 树形字典中查找 value 的完整层级路径。
|
|
217
|
+
*
|
|
218
|
+
* @param {string} type - 字典类型名,如 'region'
|
|
219
|
+
* @param {string | number} value - 叶子节点编码值
|
|
220
|
+
* @param {TranslatePathOptions} opts - 可选配置(storeName 指定仓库,field 指定取值字段,separator 指定分隔符,默认 ' / ')
|
|
221
|
+
* @returns {string} 用分隔符连接的完整层级路径,未命中时返回 value 字符串
|
|
222
|
+
*/
|
|
223
|
+
translatePath(type, value, opts) {
|
|
224
|
+
const storeName = opts?.storeName ?? DEFAULT_STORE_NAME;
|
|
225
|
+
const field = opts?.field ?? "label";
|
|
226
|
+
const separator = opts?.separator ?? " / ";
|
|
227
|
+
const key = this.buildKey(type, storeName);
|
|
228
|
+
const entry = this.memoryCache.get(key);
|
|
229
|
+
if (!entry || !entry.data.tree) return String(value);
|
|
230
|
+
const path = this.findPathInTree(entry.data.tree, value, field);
|
|
231
|
+
return path.length > 0 ? path.join(separator) : String(value);
|
|
232
|
+
}
|
|
233
|
+
/** DFS 在树形字典中查找目标编码的路径,每节点取指定字段 */
|
|
234
|
+
findPathInTree(nodes, targetCode, field) {
|
|
181
235
|
for (const node of nodes) {
|
|
182
|
-
if (this.codeMatch(node.
|
|
183
|
-
return [node.label];
|
|
236
|
+
if (this.codeMatch(node.value, targetCode)) {
|
|
237
|
+
return [node[field] ?? node.label];
|
|
184
238
|
}
|
|
185
239
|
if (node.children && node.children.length > 0) {
|
|
186
|
-
const childPath = this.findPathInTree(node.children, targetCode);
|
|
240
|
+
const childPath = this.findPathInTree(node.children, targetCode, field);
|
|
187
241
|
if (childPath.length > 0) {
|
|
188
|
-
return [node.label, ...childPath];
|
|
242
|
+
return [node[field] ?? node.label, ...childPath];
|
|
189
243
|
}
|
|
190
244
|
}
|
|
191
245
|
}
|
|
@@ -198,12 +252,19 @@ export class DictManager {
|
|
|
198
252
|
codeMatch(a, b) {
|
|
199
253
|
return String(a) === String(b);
|
|
200
254
|
}
|
|
201
|
-
/**
|
|
255
|
+
/**
|
|
256
|
+
* 初始化管理器。
|
|
257
|
+
* 版本检查已改为惰性执行,在首次 getDict() 调用时触发,避免全量串行请求。
|
|
258
|
+
*
|
|
259
|
+
* @returns {Promise<void>}
|
|
260
|
+
*/
|
|
202
261
|
async initialize() {
|
|
203
262
|
}
|
|
204
263
|
/**
|
|
205
264
|
* 失效缓存数据。
|
|
206
|
-
*
|
|
265
|
+
*
|
|
266
|
+
* @param {string} storeName - 指定要失效的仓库,不传则清空所有仓库及内存缓存
|
|
267
|
+
* @returns {Promise<void>}
|
|
207
268
|
*/
|
|
208
269
|
async invalidateAll(storeName) {
|
|
209
270
|
if (storeName) {
|
|
@@ -1,11 +1,34 @@
|
|
|
1
|
-
import type { ShallowRef, Ref,
|
|
1
|
+
import type { ShallowRef, Ref, DeepReadonly } from 'vue';
|
|
2
2
|
/** 仓库名字面量联合类型,由 addTypeTemplate 根据 stores 配置动态生成 */
|
|
3
3
|
import type { StoreKey } from '#build/types/nuxt-dict-store-names';
|
|
4
4
|
export type { StoreKey };
|
|
5
|
-
/**
|
|
5
|
+
/**
|
|
6
|
+
* 字典项,表示字典中单个编码与其显示文本的映射关系。
|
|
7
|
+
*
|
|
8
|
+
* @description 扁平字典的最小数据单元。每个 DictItem 包含一个编码值(value)
|
|
9
|
+
* 和对应的显示文本(label),并可携带任意扩展字段(如 color、icon 等)。
|
|
10
|
+
* 用于 useDict 返回的 data、$dict.getDictItem 的返回值等场景。
|
|
11
|
+
*
|
|
12
|
+
* @property {string | number} value - 字典编码值,支持字符串和数字类型,用于匹配业务数据中的 code
|
|
13
|
+
* @property {string} label - 编码对应的显示文本(翻译后的文字)
|
|
14
|
+
*
|
|
15
|
+
* @example
|
|
16
|
+
* // 基础条目
|
|
17
|
+
* { value: 'male', label: '男' }
|
|
18
|
+
* { value: 1, label: '启用', color: '#67C23A' }
|
|
19
|
+
*
|
|
20
|
+
* @example
|
|
21
|
+
* // 通过 $dict.getDictItem 获取完整对象
|
|
22
|
+
* import type { DictItem } from '@lacqjs/nuxt-dict'
|
|
23
|
+
* const item:DictItem = $dict.getDictItem('gender', 'male')
|
|
24
|
+
* // item.value → 'male', item.label → '男'
|
|
25
|
+
*/
|
|
6
26
|
export interface DictItem {
|
|
7
|
-
|
|
27
|
+
/** 字典编码值,支持字符串和数字类型 */
|
|
28
|
+
value: string | number;
|
|
29
|
+
/** 编码对应的显示文本 */
|
|
8
30
|
label: string;
|
|
31
|
+
/** 允许携带任意扩展字段(如 color、icon 等) */
|
|
9
32
|
[key: string]: unknown;
|
|
10
33
|
}
|
|
11
34
|
/** 树形字典节点,用于级联选择器 */
|
|
@@ -29,7 +52,23 @@ export interface CacheEntry<T = DictEntry> {
|
|
|
29
52
|
timestamp: number;
|
|
30
53
|
version: string;
|
|
31
54
|
}
|
|
32
|
-
/**
|
|
55
|
+
/**
|
|
56
|
+
* 字典适配器接口,允许用户自定义数据源(REST / GraphQL / 本地文件等)。
|
|
57
|
+
*
|
|
58
|
+
* @example
|
|
59
|
+
* // 自定义适配器示例
|
|
60
|
+
* const customAdapter: DictAdapter = {
|
|
61
|
+
* fetchDict: async (storeName, { types, locale }) => {
|
|
62
|
+
* const res = await fetch(`/api/${storeName}/dict?types=${types.join(',')}&lang=${locale}`)
|
|
63
|
+
* return res.json()
|
|
64
|
+
* },
|
|
65
|
+
* fetchVersion: async (storeName) => {
|
|
66
|
+
* const res = await fetch(`/api/${storeName}/dict/version`)
|
|
67
|
+
* const data = await res.json()
|
|
68
|
+
* return data.version
|
|
69
|
+
* },
|
|
70
|
+
* }
|
|
71
|
+
*/
|
|
33
72
|
export interface DictAdapter {
|
|
34
73
|
fetchDict(storeName: string, options: {
|
|
35
74
|
types: string[];
|
|
@@ -144,28 +183,272 @@ export interface ResolvedModuleOptions {
|
|
|
144
183
|
storageKey: string;
|
|
145
184
|
};
|
|
146
185
|
}
|
|
147
|
-
/**
|
|
186
|
+
/**
|
|
187
|
+
* translate / translatePath 使用的选项。
|
|
188
|
+
*
|
|
189
|
+
* @example
|
|
190
|
+
* // 默认仓库,取 label
|
|
191
|
+
* translate('gender', 'male')
|
|
192
|
+
* // 指定仓库
|
|
193
|
+
* translate('gender', 'male', { storeName: 'dicts2' })
|
|
194
|
+
* // 取自定义字段
|
|
195
|
+
* translate('status', 1, { field: 'color' })
|
|
196
|
+
*/
|
|
197
|
+
export interface TranslateOptions {
|
|
198
|
+
/** 仓库名,默认 'dicts' */
|
|
199
|
+
storeName?: StoreKey;
|
|
200
|
+
/** 取值字段名,默认 'label' */
|
|
201
|
+
field?: string;
|
|
202
|
+
}
|
|
203
|
+
/**
|
|
204
|
+
* translatePath 使用的选项,在 TranslateOptions 基础上增加 separator。
|
|
205
|
+
*
|
|
206
|
+
* @example
|
|
207
|
+
* // 默认仓库,默认分隔符 ' / '
|
|
208
|
+
* translatePath('region', '440104')
|
|
209
|
+
* // 自定义分隔符
|
|
210
|
+
* translatePath('region', '440104', { separator: ' → ' })
|
|
211
|
+
* // 指定仓库 + 自定义字段 + 自定义分隔符
|
|
212
|
+
* translatePath('region', '440104', { storeName: 'dicts2', field: 'value', separator: ' → ' })
|
|
213
|
+
*/
|
|
214
|
+
export interface TranslatePathOptions extends TranslateOptions {
|
|
215
|
+
/** 层级路径分隔符,默认 ' / ' */
|
|
216
|
+
separator?: string;
|
|
217
|
+
}
|
|
218
|
+
/**
|
|
219
|
+
* getDictItem 使用的选项。与 translate 参数一致,但不含 field(返回整个对象)。
|
|
220
|
+
*
|
|
221
|
+
* @example
|
|
222
|
+
* // 默认仓库
|
|
223
|
+
* getDictItem('gender', 'male')
|
|
224
|
+
* // 指定仓库
|
|
225
|
+
* getDictItem('gender', 'male', { storeName: 'dicts2' })
|
|
226
|
+
*/
|
|
227
|
+
export interface GetDictItemOptions {
|
|
228
|
+
/** 仓库名,默认 'dicts' */
|
|
229
|
+
storeName?: StoreKey;
|
|
230
|
+
}
|
|
231
|
+
/**
|
|
232
|
+
* useDict 返回类型。
|
|
233
|
+
*
|
|
234
|
+
* @description useDict 调用后返回的对象,包含字典数据、翻译函数、状态管理和刷新能力。
|
|
235
|
+
* 组件挂载时自动加载数据,卸载时自动清理。支持语言切换后自动重取。
|
|
236
|
+
*
|
|
237
|
+
* @property {Readonly<ShallowRef<DeepReadonly<DictItem[] | null>>>} data - 字典原始数据数组(只读)。初始为 null,加载完成后为 [{ value, label, ... }]
|
|
238
|
+
* @property {(value: string | number, opts?: TranslateOptions) => string} translate - 同步翻译函数,默认从 data ref 查找 code → label(响应式),未命中返回 code 原文
|
|
239
|
+
* @property {(value: string | number, opts?: GetDictItemOptions) => DictItem | undefined} getDictItem - 同步获取完整字典项对象,缓存未命中返回 undefined
|
|
240
|
+
* @property {Ref<boolean>} loading - 是否正在加载字典数据
|
|
241
|
+
* @property {Ref<string | null>} error - 加载失败时的错误信息,正常时为 null
|
|
242
|
+
* @property {() => Promise<void>} refresh - 强制刷新,跳过缓存直接从网络获取最新数据
|
|
243
|
+
*
|
|
244
|
+
* @example
|
|
245
|
+
* const { data, translate, loading, refresh } = useDict('gender')
|
|
246
|
+
* const { data, translate } = useDict('dicts2', 'gender')
|
|
247
|
+
*/
|
|
148
248
|
export interface UseDictReturn {
|
|
149
|
-
|
|
150
|
-
|
|
249
|
+
/** 字典原始数据数组(只读)。初始为 null,加载完成后为 [{ value, label, ... }] */
|
|
250
|
+
data: Readonly<ShallowRef<DeepReadonly<DictItem[] | null>>>;
|
|
251
|
+
/**
|
|
252
|
+
* 同步翻译编码 → 文本,默认从 data ref(shallowRef)查找,Vue 响应式系统可追踪。
|
|
253
|
+
*
|
|
254
|
+
* @description 从当前 useDict 的 data ref 中查找编码对应的翻译文本。
|
|
255
|
+
* 同步执行,不发起网络请求。可放在 computed 中使用。
|
|
256
|
+
* @param {string | number} value - 字典编码值
|
|
257
|
+
* @param {TranslateOptions} [opts] - 可选配置
|
|
258
|
+
* @param {StoreKey} [opts.storeName] - 仓库名。同仓库从 data ref 读取(响应式),跨仓库回退 manager 内存缓存
|
|
259
|
+
* @param {string} [opts.field] - 取值字段名,默认 'label'
|
|
260
|
+
* @returns {string} 翻译后的文本,缓存未命中时返回 value 的字符串形式
|
|
261
|
+
*
|
|
262
|
+
* @example
|
|
263
|
+
* const { translate } = useDict('gender')
|
|
264
|
+
* translate('male') // → '男'
|
|
265
|
+
* translate(1, { field: 'color' }) // 取自定义字段
|
|
266
|
+
*/
|
|
267
|
+
translate: (value: string | number, opts?: TranslateOptions) => string;
|
|
268
|
+
/**
|
|
269
|
+
* 同步获取完整字典项对象,默认从 data ref(shallowRef)中查找,Vue 响应式系统可追踪。
|
|
270
|
+
*
|
|
271
|
+
* @description 与 translate 参数一致,但返回整个 DictItem 对象而非提取字符串字段。
|
|
272
|
+
* 可获取 value、label、以及 color 等扩展属性。可放在 computed 中使用。
|
|
273
|
+
* @param {string | number} value - 字典编码值
|
|
274
|
+
* @param {GetDictItemOptions} [opts] - 可选配置
|
|
275
|
+
* @param {StoreKey} [opts.storeName] - 目标仓库名。同仓库从 data ref 读取(响应式),跨仓库回退 manager 内存缓存
|
|
276
|
+
* @returns {DictItem | undefined} 完整的字典项对象,缓存未命中时返回 undefined
|
|
277
|
+
*
|
|
278
|
+
* @example
|
|
279
|
+
* const { getDictItem } = useDict('status')
|
|
280
|
+
* const item = computed(() => getDictItem(1)) // 响应式 ✅
|
|
281
|
+
* // → { value: 1, label: '启用', color: '#67C23A' }
|
|
282
|
+
*/
|
|
283
|
+
getDictItem: (value: string | number, opts?: GetDictItemOptions) => DictItem | undefined;
|
|
284
|
+
/** 是否正在加载字典数据 */
|
|
151
285
|
loading: Ref<boolean>;
|
|
286
|
+
/** 加载失败时的错误信息,正常时为 null */
|
|
152
287
|
error: Ref<string | null>;
|
|
288
|
+
/**
|
|
289
|
+
* 强制刷新字典数据。
|
|
290
|
+
*
|
|
291
|
+
* @description 跳过内存缓存和 IndexedDB,直接从网络获取最新数据并更新缓存。
|
|
292
|
+
* 适用于后端通知字典更新后手动触发。
|
|
293
|
+
* @returns {Promise<void>}
|
|
294
|
+
*
|
|
295
|
+
* @example
|
|
296
|
+
* const { refresh } = useDict('gender')
|
|
297
|
+
* await refresh() // 强制重新拉取最新数据
|
|
298
|
+
*/
|
|
153
299
|
refresh: () => Promise<void>;
|
|
154
300
|
}
|
|
155
|
-
/**
|
|
156
|
-
|
|
157
|
-
|
|
158
|
-
|
|
159
|
-
|
|
160
|
-
|
|
161
|
-
|
|
162
|
-
|
|
301
|
+
/**
|
|
302
|
+
* $dict 翻译器对象类型,暴露同步翻译和批量翻译方法。
|
|
303
|
+
*
|
|
304
|
+
* @description 注入到 NuxtApp 和 Vue 组件的全局翻译器,从内存缓存中查找已加载的字典数据。
|
|
305
|
+
* 仓库名统一通过 opts.storeName 或 mapping 中指定,不接受首参为 storeName 的旧式写法。
|
|
306
|
+
*
|
|
307
|
+
* @property {(type: string, code: string | number, opts?: TranslateOptions) => string} translate - 同步翻译编码 → 文本,未命中返回 code 原文
|
|
308
|
+
* @property {(type: string, code: string | number, opts?: TranslatePathOptions) => string} translatePath - 树形字典编码 → 层级路径,用分隔符拼接
|
|
309
|
+
* @property {(data, mapping, suffix?) => Record<string, unknown>} translateData - 批量翻译对象中的多个编码字段,返回追加了翻译字段的新对象
|
|
310
|
+
* @property {(type: string, code: string | number, opts?: GetDictItemOptions) => DictItem | undefined} getDictItem - 获取完整字典项对象,缓存未命中返回 undefined
|
|
311
|
+
*
|
|
312
|
+
* @example
|
|
313
|
+
* $dict.translate('gender', 'male')
|
|
314
|
+
* $dict.translate('gender', 'male', { storeName: 'dicts2' })
|
|
315
|
+
* $dict.translatePath('region', '440104', { separator: ' → ' })
|
|
316
|
+
* $dict.translateData({ gender: 'male', status: 1 }, { gender: 'gender', status: 'status' })
|
|
317
|
+
* $dict.getDictItem('gender', 'male')
|
|
318
|
+
*/
|
|
319
|
+
export interface DictTranslator {
|
|
320
|
+
/**
|
|
321
|
+
* 同步翻译编码 → 文本,从内存缓存查找。
|
|
322
|
+
*
|
|
323
|
+
* @description 从全局内存缓存中查找编码对应的翻译文本。需先通过 useDict 加载数据后调用。
|
|
324
|
+
* @param {string} type - 字典类型名,如 'gender'、'status'
|
|
325
|
+
* @param {string | number} code - 字典编码值
|
|
326
|
+
* @param {TranslateOptions} [opts] - 可选配置
|
|
327
|
+
* @param {StoreKey} [opts.storeName] - 仓库名,默认 'dicts'
|
|
328
|
+
* @param {string} [opts.field] - 取值字段名,默认 'label'
|
|
329
|
+
* @returns {string} 翻译后的文本,缓存未命中时返回 code 的字符串形式
|
|
330
|
+
*
|
|
331
|
+
* @example
|
|
332
|
+
* $dict.translate('gender', 'male')
|
|
333
|
+
* $dict.translate('gender', 'male', { storeName: 'dicts2' })
|
|
334
|
+
* $dict.translate('status', 1, { field: 'color' })
|
|
335
|
+
*/
|
|
336
|
+
translate(type: string, code: string | number, opts?: TranslateOptions): string;
|
|
337
|
+
/**
|
|
338
|
+
* 树形字典编码 → 层级路径,从内存缓存查找。
|
|
339
|
+
*
|
|
340
|
+
* @description 从已加载的树形字典数据中通过 DFS 查找目标编码并回溯完整路径,用分隔符拼接。
|
|
341
|
+
* @param {string} type - 树形字典类型名,如 'region'
|
|
342
|
+
* @param {string | number} code - 叶子节点编码值
|
|
343
|
+
* @param {TranslatePathOptions} [opts] - 可选配置
|
|
344
|
+
* @param {StoreKey} [opts.storeName] - 仓库名,默认 'dicts'
|
|
345
|
+
* @param {string} [opts.field] - 节点取值字段名,默认 'label'
|
|
346
|
+
* @param {string} [opts.separator] - 层级分隔符,默认 ' / '
|
|
347
|
+
* @returns {string} 用分隔符连接的完整层级路径,缓存未命中时返回 code 的字符串形式
|
|
348
|
+
*
|
|
349
|
+
* @example
|
|
350
|
+
* $dict.translatePath('region', '440104')
|
|
351
|
+
* $dict.translatePath('region', '440104', { separator: ' → ' })
|
|
352
|
+
*/
|
|
353
|
+
translatePath(type: string, code: string | number, opts?: TranslatePathOptions): string;
|
|
354
|
+
/**
|
|
355
|
+
* 批量翻译数据对象中的多个编码字段。
|
|
356
|
+
*
|
|
357
|
+
* @description 传入一个数据对象和字段 → 字典类型映射表,返回追加了翻译字段的新对象(不修改原对象)。
|
|
358
|
+
* @param {Record<string, unknown>} data - 需要翻译的数据对象,如 { gender: 'male', status: 1 }
|
|
359
|
+
* @param {Record<string, string | { type: string; storeName?: StoreKey }>} mapping - 字段映射表。key 为原字段名,value 为字典类型 string(默认仓库)或 { type, storeName? } 对象(指定仓库)
|
|
360
|
+
* @param {string} [suffix='_label'] - 翻译字段的后缀,如 '_label' → gender_label
|
|
361
|
+
* @returns {Record<string, unknown>} 新对象,包含原数据所有字段 + 追加的翻译字段
|
|
362
|
+
*
|
|
363
|
+
* @example
|
|
364
|
+
* $dict.translateData(
|
|
365
|
+
* { gender: 'male', status: 1 },
|
|
366
|
+
* { gender: 'gender', status: 'status' }
|
|
367
|
+
* )
|
|
368
|
+
* // → { gender: 'male', gender_label: '男', status: 1, status_label: '启用' }
|
|
369
|
+
*/
|
|
370
|
+
translateData(data: Record<string, unknown>, mapping: Record<string, string | {
|
|
371
|
+
type: string;
|
|
372
|
+
storeName?: StoreKey;
|
|
373
|
+
}>, suffix?: string): Record<string, unknown>;
|
|
374
|
+
/**
|
|
375
|
+
* 同步获取完整字典项对象,从内存缓存查找。
|
|
376
|
+
*
|
|
377
|
+
* @description 与 translate 参数一致,但返回整个 DictItem 对象而非提取字符串字段。
|
|
378
|
+
* 可获取 value、label、以及 color 等扩展属性。
|
|
379
|
+
* @param {string} type - 字典类型名,如 'gender'、'status'
|
|
380
|
+
* @param {string | number} code - 字典编码值
|
|
381
|
+
* @param {GetDictItemOptions} [opts] - 可选配置
|
|
382
|
+
* @param {StoreKey} [opts.storeName] - 仓库名,默认 'dicts'
|
|
383
|
+
* @returns {DictItem | undefined} 完整的字典项对象,缓存未命中时返回 undefined
|
|
384
|
+
*
|
|
385
|
+
* @example
|
|
386
|
+
* $dict.getDictItem('gender', 'male')
|
|
387
|
+
* // → { value: 'male', label: '男' }
|
|
388
|
+
* $dict.getDictItem('status', 1, { storeName: 'dicts2' })
|
|
389
|
+
* // → { value: 1, label: '启用', color: '#67C23A' }
|
|
390
|
+
*/
|
|
391
|
+
getDictItem(type: string, code: string | number, opts?: GetDictItemOptions): DictItem | undefined;
|
|
163
392
|
}
|
|
164
|
-
/**
|
|
393
|
+
/**
|
|
394
|
+
* useDictTree 返回类型。
|
|
395
|
+
*
|
|
396
|
+
* @description useDictTree 调用后返回的对象,包含树形字典数据、翻译函数、路径回溯和刷新能力。
|
|
397
|
+
* 适用于级联选择器等需要层级数据的场景。支持语言切换后自动重取。
|
|
398
|
+
*
|
|
399
|
+
* @property {Readonly<ShallowRef<DeepReadonly<TreeNode[] | null>>>} tree - 树形字典节点数组(只读)。初始为 null,加载完成后为完整树结构
|
|
400
|
+
* @property {(value: string | number, opts?: TranslateOptions) => string} translate - 同步翻译树中任意节点的 value → label,默认从 tree ref 查找(响应式)
|
|
401
|
+
* @property {(value: string | number) => string[]} findPath - 查找叶子节点的完整层级路径,从 tree ref 查找(响应式),如 code=440104 → ['广东', '广州', '越秀区']
|
|
402
|
+
* @property {Ref<boolean>} loading - 是否正在加载树形字典数据
|
|
403
|
+
* @property {() => Promise<void>} refresh - 强制刷新,跳过缓存直接从网络获取最新数据
|
|
404
|
+
*
|
|
405
|
+
* @example
|
|
406
|
+
* const { tree, translate, findPath, loading, refresh } = useDictTree('region')
|
|
407
|
+
* const { tree, translate } = useDictTree('dicts2', 'region')
|
|
408
|
+
*/
|
|
165
409
|
export interface UseDictTreeReturn {
|
|
166
|
-
|
|
167
|
-
|
|
168
|
-
|
|
410
|
+
/** 树形字典节点数组(只读)。初始为 null,加载完成后为完整树结构 */
|
|
411
|
+
tree: Readonly<ShallowRef<DeepReadonly<TreeNode[] | null>>>;
|
|
412
|
+
/**
|
|
413
|
+
* 同步翻译树中任意节点的 value → label,默认从 tree ref(shallowRef)递归查找。
|
|
414
|
+
*
|
|
415
|
+
* @description 从当前 useDictTree 的 tree ref 中递归查找节点编码对应的翻译文本,
|
|
416
|
+
* Vue 响应式系统可追踪,可直接放在 computed 中使用。跨仓库时回退 manager 内存缓存。
|
|
417
|
+
* @param {string | number} value - 节点编码值
|
|
418
|
+
* @param {TranslateOptions} [opts] - 可选配置
|
|
419
|
+
* @param {StoreKey} [opts.storeName] - 仓库名。同仓库从 tree ref 读取(响应式),跨仓库回退 manager
|
|
420
|
+
* @param {string} [opts.field] - 取值字段名,默认 'label'
|
|
421
|
+
* @returns {string} 翻译后的文本,缓存未命中时返回 value 的字符串形式
|
|
422
|
+
*
|
|
423
|
+
* @example
|
|
424
|
+
* const { translate } = useDictTree('region')
|
|
425
|
+
* translate('440104') // → '越秀区'
|
|
426
|
+
*/
|
|
427
|
+
translate: (value: string | number, opts?: TranslateOptions) => string;
|
|
428
|
+
/**
|
|
429
|
+
* 查找叶子节点的完整层级路径,从 tree ref(shallowRef)查找,已为响应式。
|
|
430
|
+
*
|
|
431
|
+
* @description 在已加载的树形字典数据(tree ref)中递归查找目标编码,回溯从根到叶的完整路径。
|
|
432
|
+
* Vue 响应式系统可追踪,可直接放在 computed 中使用。
|
|
433
|
+
* @param {string | number} value - 叶子节点编码值
|
|
434
|
+
* @returns {string[]} 从根到叶的 label 数组,如 ['广东', '广州', '越秀区'],未找到返回空数组
|
|
435
|
+
*
|
|
436
|
+
* @example
|
|
437
|
+
* const { findPath } = useDictTree('region')
|
|
438
|
+
* findPath('440104') // → ['广东', '广州', '越秀区']
|
|
439
|
+
*/
|
|
440
|
+
findPath: (value: string | number) => string[];
|
|
441
|
+
/** 是否正在加载树形字典数据 */
|
|
169
442
|
loading: Ref<boolean>;
|
|
443
|
+
/**
|
|
444
|
+
* 强制刷新树形字典数据。
|
|
445
|
+
*
|
|
446
|
+
* @description 跳过内存缓存和 IndexedDB,直接从网络获取最新树形数据并更新缓存。
|
|
447
|
+
* @returns {Promise<void>}
|
|
448
|
+
*
|
|
449
|
+
* @example
|
|
450
|
+
* const { refresh } = useDictTree('region')
|
|
451
|
+
* await refresh() // 强制重新拉取最新数据
|
|
452
|
+
*/
|
|
170
453
|
refresh: () => Promise<void>;
|
|
171
454
|
}
|
|
@@ -1,34 +1,32 @@
|
|
|
1
1
|
import type { DictManager } from '../core/dict-manager.js';
|
|
2
|
+
import type { DictTranslator } from '../types/index.js';
|
|
2
3
|
/**
|
|
3
|
-
* 创建字典翻译器,封装 translate / translatePath 方法。
|
|
4
|
+
* 创建字典翻译器,封装 translate / translatePath / translateData 方法。
|
|
4
5
|
* 作为 $dict 注入到 NuxtApp,供组件直接调用翻译。
|
|
5
6
|
* 使用包装层而非直接暴露 DictManager,以控制公开 API 范围。
|
|
6
7
|
*
|
|
8
|
+
* 仓库名统一通过 opts.storeName 指定,不再接受首参为 storeName 的旧式写法。
|
|
9
|
+
*
|
|
10
|
+
* @param {DictManager} manager - 字典管理器实例,提供底层 translate 能力
|
|
11
|
+
* @returns {DictTranslator} 翻译器对象,含 translate / translatePath / translateData 方法
|
|
12
|
+
*
|
|
7
13
|
* @example
|
|
8
14
|
* // 默认存储库 'dicts'
|
|
9
|
-
* $dict.translate('gender',
|
|
10
|
-
* $dict.translatePath('region',
|
|
15
|
+
* $dict.translate('gender', value)
|
|
16
|
+
* $dict.translatePath('region', value)
|
|
17
|
+
*
|
|
18
|
+
* // 指定存储库 + 自定义字段
|
|
19
|
+
* $dict.translate('gender', value, { storeName: 'dicts2', field: 'name' })
|
|
20
|
+
* $dict.translatePath('region', value, { storeName: 'dicts2', field: 'value', separator: ' -> ' })
|
|
11
21
|
*
|
|
12
|
-
* //
|
|
13
|
-
* $dict.translate('
|
|
14
|
-
* $dict.translatePath('dicts2', 'region', code)
|
|
15
|
-
* $dict.translatePath('dicts2', 'region', code, ' -> ')
|
|
22
|
+
* // 默认存储库 + 自定义字段
|
|
23
|
+
* $dict.translate('gender', value, { field: 'name' })
|
|
16
24
|
*
|
|
17
|
-
* //
|
|
18
|
-
* $dict.
|
|
25
|
+
* // 批量翻译数据对象中的字段
|
|
26
|
+
* $dict.translateData(
|
|
27
|
+
* { gender: 'male', status: 1 },
|
|
28
|
+
* { gender: 'gender', status: 'status' }
|
|
29
|
+
* )
|
|
30
|
+
* // → { gender: 'male', gender_label: '男', status: 1, status_label: '启用' }
|
|
19
31
|
*/
|
|
20
|
-
export declare function createDictTranslator(manager: DictManager):
|
|
21
|
-
/**
|
|
22
|
-
* 通过字典类型和编码获取翻译文本。
|
|
23
|
-
* 2 参:默认存储库;3 参:指定存储库(storeName 为第一个参数)
|
|
24
|
-
*/
|
|
25
|
-
translate(storeOrType: string, codeOrType: string | number, code?: string | number): string;
|
|
26
|
-
/**
|
|
27
|
-
* 获取树形字典中某个编码的完整层级路径。
|
|
28
|
-
* 2 参:默认存储库 + 默认分隔符
|
|
29
|
-
* 3 参:指定存储库 + 默认分隔符(storeName 为第一个参数)
|
|
30
|
-
* 4 参:指定存储库 + 自定义分隔符
|
|
31
|
-
* 默认存储库 + 自定义分隔符需显式传 'dicts' 作为 storeName
|
|
32
|
-
*/
|
|
33
|
-
translatePath(storeOrType: string, codeOrType: string | number, separatorOrCode?: string | number, separator?: string): string;
|
|
34
|
-
};
|
|
32
|
+
export declare function createDictTranslator(manager: DictManager): DictTranslator;
|