@veltra/desktop 1.0.9 → 1.0.11
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/dist/components/action/action-group.vue.d.ts +1 -1
- package/dist/components/action/action.vue.d.ts +3 -3
- package/dist/components/auto-complete/auto-complete.vue.d.ts +1 -1
- package/dist/components/batch-edit/batch-edit.js.map +1 -1
- package/dist/components/batch-edit/style.js +2 -2
- package/dist/components/batch-edit/use-edit.js.map +1 -1
- package/dist/components/button/button.js.map +1 -1
- package/dist/components/button/button.vue.d.ts +1 -1
- package/dist/components/cascade/cascade.vue.d.ts +6 -6
- package/dist/components/cascade/use-select.js.map +1 -1
- package/dist/components/checkbox-group/checkbox-group.js.map +1 -1
- package/dist/components/code-editor/code-editor.js +2 -0
- package/dist/components/code-editor/code-editor.js.map +1 -1
- package/dist/components/date-panel/date-panel.js.map +1 -1
- package/dist/components/date-panel/date-panel.vue.d.ts +1 -1
- package/dist/components/date-picker/date-picker.vue.d.ts +1 -1
- package/dist/components/date-range-picker/date-range-picker.vue.d.ts +1 -1
- package/dist/components/drawer/drawer.js.map +1 -1
- package/dist/components/expression-editor/expression-editor.js.map +1 -1
- package/dist/components/expression-editor/internal/editor-runtime/create-runtime.js.map +1 -1
- package/dist/components/expression-editor/internal/features/commands/register-command-packs.js.map +1 -1
- package/dist/components/expression-editor/internal/features/insertion/insertion-service.js.map +1 -1
- package/dist/components/expression-editor/use-decorators.js.map +1 -1
- package/dist/components/expression-editor/use-expression-drag-drop.js.map +1 -1
- package/dist/components/file-picker/file-picker.js.map +1 -1
- package/dist/components/file-picker/file-picker.vue.d.ts +1 -1
- package/dist/components/file-viewer/file-viewer.js +195 -30
- package/dist/components/file-viewer/file-viewer.js.map +1 -1
- package/dist/components/file-viewer/previewers/docx-previewer.js +7 -5
- package/dist/components/file-viewer/previewers/docx-previewer.js.map +1 -1
- package/dist/components/file-viewer/previewers/image-previewer.js +6 -6
- package/dist/components/file-viewer/previewers/image-previewer.js.map +1 -1
- package/dist/components/file-viewer/previewers/pdf-previewer.js +5 -3
- package/dist/components/file-viewer/previewers/pdf-previewer.js.map +1 -1
- package/dist/components/file-viewer/previewers/sheet-previewer.js.map +1 -1
- package/dist/components/file-viewer/style2.css +387 -136
- package/dist/components/form/form-model.js +2 -1
- package/dist/components/form/form-model.js.map +1 -1
- package/dist/components/grid/grid.js.map +1 -1
- package/dist/components/grid/use-responsive.js.map +1 -1
- package/dist/components/grid-input/grid-input.vue.d.ts +1 -1
- package/dist/components/input/input.vue.d.ts +3 -3
- package/dist/components/list/list.js.map +1 -1
- package/dist/components/loading/directive.js.map +1 -1
- package/dist/components/menu/menu-item.js.map +1 -1
- package/dist/components/message/message2.js.map +1 -1
- package/dist/components/multi-select/multi-select.js.map +1 -1
- package/dist/components/multi-select/multi-select.vue.d.ts +3 -3
- package/dist/components/multi-tree-select/multi-tree-select.vue.d.ts +6 -6
- package/dist/components/notification/index.js.map +1 -1
- package/dist/components/notification/notification.vue.d.ts +1 -1
- package/dist/components/number-input/number-input.js.map +1 -1
- package/dist/components/number-input/number-input.vue.d.ts +1 -1
- package/dist/components/number-range-input/number-range-input.vue.d.ts +2 -2
- package/dist/components/palette/color-transform.js.map +1 -1
- package/dist/components/palette/palette-sv.js.map +1 -1
- package/dist/components/password-input/password-input.vue.d.ts +1 -1
- package/dist/components/pop-confirm/pop-confirm.vue.d.ts +1 -1
- package/dist/components/progress/progress.js +1 -1
- package/dist/components/progress/progress.js.map +1 -1
- package/dist/components/progress-nodes/progress-nodes.js.map +1 -1
- package/dist/components/progress-nodes/progress-nodes.vue.d.ts +3 -3
- package/dist/components/rich-text-editor/rich-text-editor.js.map +1 -1
- package/dist/components/rich-text-editor/rich-text-editor.vue.d.ts +2 -2
- package/dist/components/rich-text-editor/toolbar.js.map +1 -1
- package/dist/components/scroll/scroll.js.map +1 -1
- package/dist/components/select/select.vue.d.ts +2 -2
- package/dist/components/slider/slider-thumb.js.map +1 -1
- package/dist/components/table/di.js.map +1 -1
- package/dist/components/table/style.js +1 -1
- package/dist/components/table/table-row.js +1 -2
- package/dist/components/table/table-row.js.map +1 -1
- package/dist/components/table/table.js +1 -2
- package/dist/components/table/table.js.map +1 -1
- package/dist/components/table/use-columns.js +4 -0
- package/dist/components/table/use-columns.js.map +1 -1
- package/dist/components/table/use-table.js +25 -0
- package/dist/components/table/use-table.js.map +1 -1
- package/dist/components/tabs/style2.css +3 -2
- package/dist/components/tabs/tabs-horizontal.js +2 -2
- package/dist/components/tabs/tabs-horizontal.js.map +1 -1
- package/dist/components/tabs/tabs-horizontal.vue.d.ts +14 -3
- package/dist/components/tabs/tabs-vertical.js +2 -2
- package/dist/components/tabs/tabs-vertical.js.map +1 -1
- package/dist/components/tabs/tabs-vertical.vue.d.ts +13 -3
- package/dist/components/tabs/tabs.vue.d.ts +2 -2
- package/dist/components/text/text.js.map +1 -1
- package/dist/components/textarea/textarea.js.map +1 -1
- package/dist/components/textarea/textarea.vue.d.ts +3 -3
- package/dist/components/theme/theme.js.map +1 -1
- package/dist/components/tip/tip.vue.d.ts +2 -2
- package/dist/components/tree/tree-node2.js.map +1 -1
- package/dist/components/tree/tree.vue.d.ts +2 -2
- package/dist/components/tree/use-tree-nodes.js.map +1 -1
- package/dist/components/tree-select/tree-select.vue.d.ts +4 -4
- package/dist/components/watermark/watermark.vue.d.ts +1 -1
- package/package.json +13 -12
- package/src/components/code-editor/code-editor.vue +2 -0
- package/src/components/file-viewer/file-viewer.vue +250 -24
- package/src/components/file-viewer/previewers/docx-previewer.vue +4 -3
- package/src/components/file-viewer/previewers/image-previewer.vue +4 -5
- package/src/components/file-viewer/previewers/pdf-previewer.vue +4 -3
- package/src/components/file-viewer/style.scss +503 -161
- package/src/components/progress/progress.vue +1 -1
- package/src/components/table/di.ts +51 -53
- package/src/components/table/table.vue +0 -1
- package/src/components/tabs/style.scss +7 -4
- package/src/components/tabs/tabs-horizontal.vue +10 -7
- package/src/components/tabs/tabs-vertical.vue +3 -1
|
@@ -56,7 +56,7 @@ var FormModel = class {
|
|
|
56
56
|
* @param proxyData 响应式的值
|
|
57
57
|
*/
|
|
58
58
|
setProxyData(proxyData) {
|
|
59
|
-
|
|
59
|
+
const data = middleProxy(proxyData, {
|
|
60
60
|
set: (field, val) => {
|
|
61
61
|
this.modelChangeCallback.forEach((cb) => cb(field, val));
|
|
62
62
|
},
|
|
@@ -68,6 +68,7 @@ var FormModel = class {
|
|
|
68
68
|
this.validate(fields);
|
|
69
69
|
}
|
|
70
70
|
});
|
|
71
|
+
this.data = data;
|
|
71
72
|
}
|
|
72
73
|
getValidateFields(fields) {
|
|
73
74
|
if (!fields) if (this.formKeys.size) {
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"form-model.js","names":[],"sources":["../../../src/components/form/form-model.ts"],"sourcesContent":["import { o } from '@cat-kit/core'\nimport { middleProxy, Validator } from '@veltra/utils'\nimport { nextTick, reactive, shallowReactive, watch, type Reactive } from 'vue'\n\nimport type {\n FormModelItem,\n ModelData,\n ModelRules,\n DataSettingConfig,\n IFormModel\n} from '../../types'\n\n/**\n * 表单模型\n */\nexport class FormModel<\n Fields extends Record<string, FormModelItem> = Record<string, FormModelItem>\n> implements IFormModel<Fields> {\n /** 表单数据 */\n data!: ModelData<Fields>\n\n /** 表单规则 */\n readonly fields: Fields\n\n /** 所有的键 */\n readonly allKeys: string[]\n\n /**\n * 不同表单所需要校验的字段\n * @description\n * 这个值会在表单组件渲染时由表单设置,因为只有真正渲染的组件才应该被校验\n */\n formKeys: Map<number, (keyof Fields)[]> = new Map()\n\n /** 初始数据 */\n readonly initialData: ModelData<Fields>\n\n readonly errors: Map<keyof Fields, string[] | undefined> = shallowReactive(new Map())\n\n private validator: Validator<ModelRules<Fields>>\n\n /**\n * 是否在表单值更新时校验\n */\n private validateOnFieldChange = true\n\n private modelChangeCallback: Set<(fields: string, val: any) => void> = new Set()\n\n constructor(fields: Fields) {\n this.fields = fields\n const rawData = {} as ModelData<Fields>\n const allKeys: string[] = []\n\n for (const key in fields) {\n const fieldItem = fields[key]!\n allKeys.push(key)\n const { value } = fieldItem\n let v = value\n\n if (typeof value === 'function') {\n watch(value, (v) => {\n o(this.initialData).set(key, v)\n })\n v = value()\n }\n\n o(rawData).set(key, v)\n }\n\n this.allKeys = allKeys\n this.initialData = JSON.parse(JSON.stringify(rawData))\n\n this.setProxyData(reactive(rawData))\n\n this.validator = new Validator(this.fields)\n\n return shallowReactive(this)\n }\n\n /**\n * 设置响应式值, 替换掉原有的数据\n * @description 设置响应式值时,会自动监听值的变化,并进行校验\n * @param proxyData 响应式的值\n */\n setProxyData(proxyData: ModelData<Fields> | Reactive<ModelData<Fields>>): void {\n const data = middleProxy(proxyData, {\n set: (field, val) => {\n this.modelChangeCallback.forEach((cb) => cb(field, val))\n },\n\n changed: (fields) => {\n if (!this.validateOnFieldChange) {\n this.validateOnFieldChange = true\n return\n }\n this.validate(fields)\n }\n })\n\n this.data = data as ModelData<Fields>\n }\n\n private getValidateFields(fields?: keyof Fields | (keyof Fields)[]) {\n if (!fields) {\n if (this.formKeys.size) {\n let _fields: (keyof Fields)[] = []\n this.formKeys.forEach((fields) => {\n _fields = _fields.concat(fields)\n })\n return _fields\n } else {\n return this.allKeys\n }\n }\n\n if (!Array.isArray(fields)) {\n return [fields]\n }\n return fields\n }\n\n /**\n * 模型校验\n * @param fields 需要校验的字段, 不传则校验所有字段\n * @returns\n */\n async validate(fields?: keyof Fields | (keyof Fields)[]): Promise<boolean> {\n const { errors, validator, data } = this\n\n const results = await validator.validate(data, this.getValidateFields(fields))\n\n // 全量校验\n if (!fields) {\n errors.clear()\n\n for (const field in results) {\n errors.set(field, results[field])\n }\n }\n // 局部校验\n else {\n ~(Array.isArray(fields) ? fields : [fields]).forEach((field) => {\n const errs = results[field]\n if (errs?.length) {\n errors.set(field, errs)\n } else {\n errors.delete(field)\n }\n })\n }\n\n if (errors.size > 0) {\n if (!fields) {\n nextTick(() => {\n document.querySelector('.u-form-item.is-error')?.scrollIntoView({ block: 'nearest' })\n })\n }\n return Promise.reject(false)\n }\n\n return true\n }\n\n /**\n * 重置数据\n * @param fields 需要重置的字段\n */\n resetData(keys?: keyof Fields | (keyof Fields)[]): void {\n if (typeof keys === 'string') {\n keys = [keys]\n } else if (Array.isArray(keys)) {\n } else {\n keys = this.allKeys\n }\n\n this.clearValidate()\n\n this.validateOnFieldChange = false\n\n keys.forEach((field) => {\n o(this.data).set(field as string, o(this.initialData).get(field as string))\n })\n }\n\n /**\n * 设置值\n * @param formData 表单值\n * @param options 配置\n */\n setData(\n formData: Partial<ModelData<Fields> & Record<string, any>>,\n config?: DataSettingConfig\n ): FormModel<Fields> {\n const { validate = true } = config || {}\n\n if (!validate) {\n this.validateOnFieldChange = false\n }\n\n this.allKeys.forEach((key) => {\n const value = o(formData).get(key)\n if (value !== undefined) {\n o(this.data).set(key, value)\n }\n })\n\n return this\n }\n\n /**\n * 设置初始值\n * @description 初始值在重置数据和查看原始数据时会用到\n * @param data 初始值\n */\n setInitialData(data: Partial<ModelData<Fields>>): FormModel<Fields> {\n this.allKeys.forEach((key) => {\n o(this.initialData).set(key, o(data).get(key))\n })\n\n return this\n }\n\n /** 清除校验 */\n clearValidate(): void {\n this.errors.clear()\n }\n\n /**\n * 监听值变更\n * @param cb 回调\n */\n onChange(cb: (field: keyof Fields, val: any) => void): void {\n this.modelChangeCallback.add(cb)\n }\n\n /** 关闭监听值变更 */\n offChange(cb: (field: keyof Fields, val: any) => void): void {\n this.modelChangeCallback.delete(cb)\n }\n}\n"],"mappings":";;;;;;;AAeA,IAAa,YAAb,MAEgC;;CAE9B;;CAGA;;CAGA;;;;;;CAOA,2BAA0C,IAAI,KAAK;;CAGnD;CAEA,SAA2D,gCAAgB,IAAI,KAAK,CAAC;CAErF;;;;CAKA,wBAAgC;CAEhC,sCAAuE,IAAI,KAAK;CAEhF,YAAY,QAAgB;AAC1B,OAAK,SAAS;EACd,MAAM,UAAU,EAAE;EAClB,MAAM,UAAoB,EAAE;AAE5B,OAAK,MAAM,OAAO,QAAQ;GACxB,MAAM,YAAY,OAAO;AACzB,WAAQ,KAAK,IAAI;GACjB,MAAM,EAAE,UAAU;GAClB,IAAI,IAAI;AAER,OAAI,OAAO,UAAU,YAAY;AAC/B,UAAM,QAAQ,MAAM;AAClB,OAAE,KAAK,YAAY,CAAC,IAAI,KAAK,EAAE;MAC/B;AACF,QAAI,OAAO;;AAGb,KAAE,QAAQ,CAAC,IAAI,KAAK,EAAE;;AAGxB,OAAK,UAAU;AACf,OAAK,cAAc,KAAK,MAAM,KAAK,UAAU,QAAQ,CAAC;AAEtD,OAAK,aAAa,SAAS,QAAQ,CAAC;AAEpC,OAAK,YAAY,IAAI,UAAU,KAAK,OAAO;AAE3C,SAAO,gBAAgB,KAAK;;;;;;;CAQ9B,aAAa,WAAkE;
|
|
1
|
+
{"version":3,"file":"form-model.js","names":[],"sources":["../../../src/components/form/form-model.ts"],"sourcesContent":["import { o } from '@cat-kit/core'\nimport { middleProxy, Validator } from '@veltra/utils'\nimport { nextTick, reactive, shallowReactive, watch, type Reactive } from 'vue'\n\nimport type {\n FormModelItem,\n ModelData,\n ModelRules,\n DataSettingConfig,\n IFormModel\n} from '../../types'\n\n/**\n * 表单模型\n */\nexport class FormModel<\n Fields extends Record<string, FormModelItem> = Record<string, FormModelItem>\n> implements IFormModel<Fields> {\n /** 表单数据 */\n data!: ModelData<Fields>\n\n /** 表单规则 */\n readonly fields: Fields\n\n /** 所有的键 */\n readonly allKeys: string[]\n\n /**\n * 不同表单所需要校验的字段\n * @description\n * 这个值会在表单组件渲染时由表单设置,因为只有真正渲染的组件才应该被校验\n */\n formKeys: Map<number, (keyof Fields)[]> = new Map()\n\n /** 初始数据 */\n readonly initialData: ModelData<Fields>\n\n readonly errors: Map<keyof Fields, string[] | undefined> = shallowReactive(new Map())\n\n private validator: Validator<ModelRules<Fields>>\n\n /**\n * 是否在表单值更新时校验\n */\n private validateOnFieldChange = true\n\n private modelChangeCallback: Set<(fields: string, val: any) => void> = new Set()\n\n constructor(fields: Fields) {\n this.fields = fields\n const rawData = {} as ModelData<Fields>\n const allKeys: string[] = []\n\n for (const key in fields) {\n const fieldItem = fields[key]!\n allKeys.push(key)\n const { value } = fieldItem\n let v = value\n\n if (typeof value === 'function') {\n watch(value, (v) => {\n o(this.initialData).set(key, v)\n })\n v = value()\n }\n\n o(rawData).set(key, v)\n }\n\n this.allKeys = allKeys\n this.initialData = JSON.parse(JSON.stringify(rawData))\n\n this.setProxyData(reactive(rawData))\n\n this.validator = new Validator(this.fields)\n\n return shallowReactive(this)\n }\n\n /**\n * 设置响应式值, 替换掉原有的数据\n * @description 设置响应式值时,会自动监听值的变化,并进行校验\n * @param proxyData 响应式的值\n */\n setProxyData(proxyData: ModelData<Fields> | Reactive<ModelData<Fields>>): void {\n const data = middleProxy(proxyData, {\n set: (field, val) => {\n this.modelChangeCallback.forEach((cb) => cb(field, val))\n },\n\n changed: (fields) => {\n if (!this.validateOnFieldChange) {\n this.validateOnFieldChange = true\n return\n }\n this.validate(fields)\n }\n })\n\n this.data = data as ModelData<Fields>\n }\n\n private getValidateFields(fields?: keyof Fields | (keyof Fields)[]) {\n if (!fields) {\n if (this.formKeys.size) {\n let _fields: (keyof Fields)[] = []\n this.formKeys.forEach((fields) => {\n _fields = _fields.concat(fields)\n })\n return _fields\n } else {\n return this.allKeys\n }\n }\n\n if (!Array.isArray(fields)) {\n return [fields]\n }\n return fields\n }\n\n /**\n * 模型校验\n * @param fields 需要校验的字段, 不传则校验所有字段\n * @returns\n */\n async validate(fields?: keyof Fields | (keyof Fields)[]): Promise<boolean> {\n const { errors, validator, data } = this\n\n const results = await validator.validate(data, this.getValidateFields(fields))\n\n // 全量校验\n if (!fields) {\n errors.clear()\n\n for (const field in results) {\n errors.set(field, results[field])\n }\n }\n // 局部校验\n else {\n ~(Array.isArray(fields) ? fields : [fields]).forEach((field) => {\n const errs = results[field]\n if (errs?.length) {\n errors.set(field, errs)\n } else {\n errors.delete(field)\n }\n })\n }\n\n if (errors.size > 0) {\n if (!fields) {\n nextTick(() => {\n document.querySelector('.u-form-item.is-error')?.scrollIntoView({ block: 'nearest' })\n })\n }\n return Promise.reject(false)\n }\n\n return true\n }\n\n /**\n * 重置数据\n * @param fields 需要重置的字段\n */\n resetData(keys?: keyof Fields | (keyof Fields)[]): void {\n if (typeof keys === 'string') {\n keys = [keys]\n } else if (Array.isArray(keys)) {\n } else {\n keys = this.allKeys\n }\n\n this.clearValidate()\n\n this.validateOnFieldChange = false\n\n keys.forEach((field) => {\n o(this.data).set(field as string, o(this.initialData).get(field as string))\n })\n }\n\n /**\n * 设置值\n * @param formData 表单值\n * @param options 配置\n */\n setData(\n formData: Partial<ModelData<Fields> & Record<string, any>>,\n config?: DataSettingConfig\n ): FormModel<Fields> {\n const { validate = true } = config || {}\n\n if (!validate) {\n this.validateOnFieldChange = false\n }\n\n this.allKeys.forEach((key) => {\n const value = o(formData).get(key)\n if (value !== undefined) {\n o(this.data).set(key, value)\n }\n })\n\n return this\n }\n\n /**\n * 设置初始值\n * @description 初始值在重置数据和查看原始数据时会用到\n * @param data 初始值\n */\n setInitialData(data: Partial<ModelData<Fields>>): FormModel<Fields> {\n this.allKeys.forEach((key) => {\n o(this.initialData).set(key, o(data).get(key))\n })\n\n return this\n }\n\n /** 清除校验 */\n clearValidate(): void {\n this.errors.clear()\n }\n\n /**\n * 监听值变更\n * @param cb 回调\n */\n onChange(cb: (field: keyof Fields, val: any) => void): void {\n this.modelChangeCallback.add(cb)\n }\n\n /** 关闭监听值变更 */\n offChange(cb: (field: keyof Fields, val: any) => void): void {\n this.modelChangeCallback.delete(cb)\n }\n}\n"],"mappings":"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"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"grid.js","names":[],"sources":["../../../src/components/grid/grid.vue"],"sourcesContent":["<template>\n <component :is=\"tag\" :class=\"cls.b\" ref=\"grid\">\n <slot />\n </component>\n</template>\n\n<script lang=\"ts\" setup>\nimport { bem, removeStyles, setStyles, withUnit } from '@veltra/utils'\nimport { type CSSProperties, provide, watch, useTemplateRef, computed } from 'vue'\n\nimport type { GridProps, GridEmits, _GridExposed } from '../../types'\nimport { getBreakpointCols } from './breakpoint'\nimport { GridDIKey } from './di'\nimport { useResponsive } from './use-responsive'\n\ndefineOptions({\n name: 'Grid'\n})\n\nconst props = withDefaults(defineProps<GridProps>(), {\n tag: 'div'\n})\n\nconst emit = defineEmits<GridEmits>()\n\nconst cls = bem('grid')\n\nconst gridRef = useTemplateRef<HTMLElement>('grid')\n\nconst { currentBreakpoint, gridItemsProps } = useResponsive({\n props,\n emit,\n gridRef\n})\n\nconst styles = computed(() => {\n const { gap, cols } = props\n const result: CSSProperties = {}\n\n // 间距\n if (typeof gap === 'number') {\n if (gap > 0) {\n result.rowGap = result.columnGap = gap + 'px'\n }\n } else if (typeof gap === 'string') {\n const [rowGap, columnGap] = gap.split(' ')\n result.columnGap = withUnit(columnGap || rowGap, 'px')\n result.rowGap = withUnit(rowGap, 'px')\n }\n\n const breakpoint = currentBreakpoint.value\n\n switch (typeof cols) {\n case 'number':\n result.gridTemplateColumns = `repeat(${cols}, minmax(0px, 1fr))`\n break\n case 'function':\n if (breakpoint) {\n result.gridTemplateColumns = `repeat(${cols(breakpoint)}, minmax(0px, 1fr))`\n }\n break\n case 'object':\n if (breakpoint) {\n const amount = getBreakpointCols(cols, breakpoint)\n result.gridTemplateColumns = `repeat(${amount}, minmax(0px, 1fr))`\n }\n }\n\n return result\n})\n\nwatch([styles, gridRef], ([styles, dom]) => {\n if (!dom) return\n\n // 重置并移除样式\n removeStyles(dom, ['gridTemplateColumns', 'columnGap', 'rowGap'])\n setStyles(dom, styles)\n})\n\nprovide(GridDIKey, {\n currentBreakpoint,\n gridItemsProps\n})\n\ndefineExpose<_GridExposed>({\n el: gridRef\n})\n</script>\n"],"mappings":";;;;;;;;;;;;;;;;EAmBA,MAAM,QAAQ;EAId,MAAM,OAAO;EAEb,MAAM,MAAM,IAAI,OAAM;EAEtB,MAAM,UAAU,eAA4B,OAAM;EAElD,MAAM,EAAE,mBAAmB,mBAAmB,cAAc;GAC1D;GACA;GACA;GACD,CAAA;AAsCD,QAAM,CApCS,eAAe;GAC5B,MAAM,EAAE,KAAK,SAAS;GACtB,MAAM,SAAwB,EAAC;AAG/B,OAAI,OAAO,QAAQ;QACb,MAAM,EACR,QAAO,SAAS,OAAO,YAAY,MAAM;cAElC,OAAO,QAAQ,UAAU;IAClC,MAAM,CAAC,QAAQ,aAAa,IAAI,MAAM,IAAG;AACzC,WAAO,YAAY,SAAS,aAAa,QAAQ,KAAI;AACrD,WAAO,SAAS,SAAS,QAAQ,KAAI;;GAGvC,MAAM,aAAa,kBAAkB;AAErC,WAAQ,OAAO,MAAf;IACE,KAAK;AACH,YAAO,sBAAsB,UAAU,KAAK;AAC5C;IACF,KAAK;AACH,SAAI,WACF,QAAO,sBAAsB,UAAU,KAAK,WAAW,CAAC;AAE1D;IACF,KAAK,SACH,KAAI,WAEF,QAAO,sBAAsB,UADd,kBAAkB,MAAM,
|
|
1
|
+
{"version":3,"file":"grid.js","names":[],"sources":["../../../src/components/grid/grid.vue"],"sourcesContent":["<template>\n <component :is=\"tag\" :class=\"cls.b\" ref=\"grid\">\n <slot />\n </component>\n</template>\n\n<script lang=\"ts\" setup>\nimport { bem, removeStyles, setStyles, withUnit } from '@veltra/utils'\nimport { type CSSProperties, provide, watch, useTemplateRef, computed } from 'vue'\n\nimport type { GridProps, GridEmits, _GridExposed } from '../../types'\nimport { getBreakpointCols } from './breakpoint'\nimport { GridDIKey } from './di'\nimport { useResponsive } from './use-responsive'\n\ndefineOptions({\n name: 'Grid'\n})\n\nconst props = withDefaults(defineProps<GridProps>(), {\n tag: 'div'\n})\n\nconst emit = defineEmits<GridEmits>()\n\nconst cls = bem('grid')\n\nconst gridRef = useTemplateRef<HTMLElement>('grid')\n\nconst { currentBreakpoint, gridItemsProps } = useResponsive({\n props,\n emit,\n gridRef\n})\n\nconst styles = computed(() => {\n const { gap, cols } = props\n const result: CSSProperties = {}\n\n // 间距\n if (typeof gap === 'number') {\n if (gap > 0) {\n result.rowGap = result.columnGap = gap + 'px'\n }\n } else if (typeof gap === 'string') {\n const [rowGap, columnGap] = gap.split(' ')\n result.columnGap = withUnit(columnGap || rowGap, 'px')\n result.rowGap = withUnit(rowGap, 'px')\n }\n\n const breakpoint = currentBreakpoint.value\n\n switch (typeof cols) {\n case 'number':\n result.gridTemplateColumns = `repeat(${cols}, minmax(0px, 1fr))`\n break\n case 'function':\n if (breakpoint) {\n result.gridTemplateColumns = `repeat(${cols(breakpoint)}, minmax(0px, 1fr))`\n }\n break\n case 'object':\n if (breakpoint) {\n const amount = getBreakpointCols(cols, breakpoint)\n result.gridTemplateColumns = `repeat(${amount}, minmax(0px, 1fr))`\n }\n }\n\n return result\n})\n\nwatch([styles, gridRef], ([styles, dom]) => {\n if (!dom) return\n\n // 重置并移除样式\n removeStyles(dom, ['gridTemplateColumns', 'columnGap', 'rowGap'])\n setStyles(dom, styles)\n})\n\nprovide(GridDIKey, {\n currentBreakpoint,\n gridItemsProps\n})\n\ndefineExpose<_GridExposed>({\n el: gridRef\n})\n</script>\n"],"mappings":";;;;;;;;;;;;;;;;EAmBA,MAAM,QAAQ;EAId,MAAM,OAAO;EAEb,MAAM,MAAM,IAAI,OAAM;EAEtB,MAAM,UAAU,eAA4B,OAAM;EAElD,MAAM,EAAE,mBAAmB,mBAAmB,cAAc;GAC1D;GACA;GACA;GACD,CAAA;AAsCD,QAAM,CApCS,eAAe;GAC5B,MAAM,EAAE,KAAK,SAAS;GACtB,MAAM,SAAwB,EAAC;AAG/B,OAAI,OAAO,QAAQ;QACb,MAAM,EACR,QAAO,SAAS,OAAO,YAAY,MAAM;cAElC,OAAO,QAAQ,UAAU;IAClC,MAAM,CAAC,QAAQ,aAAa,IAAI,MAAM,IAAG;AACzC,WAAO,YAAY,SAAS,aAAa,QAAQ,KAAI;AACrD,WAAO,SAAS,SAAS,QAAQ,KAAI;;GAGvC,MAAM,aAAa,kBAAkB;AAErC,WAAQ,OAAO,MAAf;IACE,KAAK;AACH,YAAO,sBAAsB,UAAU,KAAK;AAC5C;IACF,KAAK;AACH,SAAI,WACF,QAAO,sBAAsB,UAAU,KAAK,WAAW,CAAC;AAE1D;IACF,KAAK,SACH,KAAI,WAEF,QAAO,sBAAsB,UADd,kBAAkB,MAAM,WACA,CAAO;;AAIpD,UAAO;IAGF,EAAQ,QAAQ,GAAG,CAAC,QAAQ,SAAS;AAC1C,OAAI,CAAC,IAAK;AAGV,gBAAa,KAAK;IAAC;IAAuB;IAAa;IAAS,CAAA;AAChE,aAAU,KAAK,OAAM;IACtB;AAED,UAAQ,WAAW;GACjB;GACA;GACD,CAAA;AAED,WAA2B,EACzB,IAAI,SACL,CAAA;;uBArFC,YAEY,wBAFI,QAAA,IAAG,EAAA;IAAG,OAAK,eAAE,MAAA,IAAG,CAAC,EAAC;IAAE,KAAI;;2BAC9B,CAAR,WAAQ,KAAA,QAAA,UAAA,CAAA,CAAA"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"use-responsive.js","names":[],"sources":["../../../src/components/grid/use-responsive.ts"],"sourcesContent":["import { debounce } from '@cat-kit/core'\nimport type { Undef } from '@veltra/utils'\nimport {\n computed,\n shallowRef,\n watch,\n type ShallowRef,\n shallowReactive,\n onBeforeUnmount,\n type ComputedRef\n} from 'vue'\n\nimport type { Breakpoint, GridEmits, GridItemProps, GridProps } from '../../types'\nimport { getContainerBreakpoint } from './breakpoint'\n\ninterface ResponsiveOptions {\n props: GridProps\n emit: GridEmits\n /** 栅格容器模板引用 */\n gridRef: ShallowRef<HTMLElement | null>\n}\n\ninterface UseResponsiveReturned {\n responsive: ComputedRef<boolean>\n gridItemsProps: Set<GridItemProps>\n currentBreakpoint: ShallowRef<Breakpoint | undefined>\n}\n\nexport function useResponsive(options: ResponsiveOptions): UseResponsiveReturned {\n const { props, gridRef, emit } = options\n\n const gridItemsProps = shallowReactive<Set<GridItemProps>>(new Set())\n\n const responsive = computed(() => {\n return (props.cols && typeof props.cols !== 'number') || !!gridItemsProps.size\n })\n\n const currentBreakpoint = shallowRef<Breakpoint>()\n\n let observer: Undef<ResizeObserver>\n\n watch(\n [responsive, gridRef],\n ([responsive, dom]) => {\n if (!dom) return\n\n observer?.unobserve(dom)\n observer?.disconnect()\n observer = undefined\n\n if (!responsive) {\n currentBreakpoint.value = undefined\n return\n }\n\n observer = new ResizeObserver(\n debounce(([entry]) => {\n const target = entry!.target as HTMLElement\n const rect = target.getBoundingClientRect()\n emit('resize', rect)\n const breakpoint = getContainerBreakpoint(target.offsetWidth)\n const prev = currentBreakpoint.value\n if (\n prev !== undefined &&\n prev.name === breakpoint.name &&\n prev.level === breakpoint.level\n ) {\n return\n }\n currentBreakpoint.value = breakpoint\n emit('breakpoint-change', breakpoint)\n }, 0)\n )\n observer.observe(dom)\n },\n { immediate: true }\n )\n\n onBeforeUnmount(() => {\n gridRef.value && observer?.unobserve(gridRef.value)\n observer?.disconnect()\n })\n\n return { responsive, gridItemsProps, currentBreakpoint }\n}\n"],"mappings":";;;;AA4BA,SAAgB,cAAc,SAAmD;CAC/E,MAAM,EAAE,OAAO,SAAS,SAAS;CAEjC,MAAM,iBAAiB,gCAAoC,IAAI,KAAK,CAAC;CAErE,MAAM,aAAa,eAAe;AAChC,SAAQ,MAAM,QAAQ,OAAO,MAAM,SAAS,YAAa,CAAC,CAAC,eAAe;GAC1E;CAEF,MAAM,oBAAoB,YAAwB;CAElD,IAAI;AAEJ,OACE,CAAC,YAAY,QAAQ,GACpB,CAAC,YAAY,SAAS;AACrB,MAAI,CAAC,IAAK;AAEV,YAAU,UAAU,IAAI;AACxB,YAAU,YAAY;AACtB,aAAW,KAAA;AAEX,MAAI,CAAC,YAAY;AACf,qBAAkB,QAAQ,KAAA;AAC1B;;AAGF,aAAW,IAAI,eACb,UAAU,CAAC,WAAW;GACpB,MAAM,SAAS,MAAO;AAEtB,QAAK,UADQ,OAAO,
|
|
1
|
+
{"version":3,"file":"use-responsive.js","names":[],"sources":["../../../src/components/grid/use-responsive.ts"],"sourcesContent":["import { debounce } from '@cat-kit/core'\nimport type { Undef } from '@veltra/utils'\nimport {\n computed,\n shallowRef,\n watch,\n type ShallowRef,\n shallowReactive,\n onBeforeUnmount,\n type ComputedRef\n} from 'vue'\n\nimport type { Breakpoint, GridEmits, GridItemProps, GridProps } from '../../types'\nimport { getContainerBreakpoint } from './breakpoint'\n\ninterface ResponsiveOptions {\n props: GridProps\n emit: GridEmits\n /** 栅格容器模板引用 */\n gridRef: ShallowRef<HTMLElement | null>\n}\n\ninterface UseResponsiveReturned {\n responsive: ComputedRef<boolean>\n gridItemsProps: Set<GridItemProps>\n currentBreakpoint: ShallowRef<Breakpoint | undefined>\n}\n\nexport function useResponsive(options: ResponsiveOptions): UseResponsiveReturned {\n const { props, gridRef, emit } = options\n\n const gridItemsProps = shallowReactive<Set<GridItemProps>>(new Set())\n\n const responsive = computed(() => {\n return (props.cols && typeof props.cols !== 'number') || !!gridItemsProps.size\n })\n\n const currentBreakpoint = shallowRef<Breakpoint>()\n\n let observer: Undef<ResizeObserver>\n\n watch(\n [responsive, gridRef],\n ([responsive, dom]) => {\n if (!dom) return\n\n observer?.unobserve(dom)\n observer?.disconnect()\n observer = undefined\n\n if (!responsive) {\n currentBreakpoint.value = undefined\n return\n }\n\n observer = new ResizeObserver(\n debounce(([entry]) => {\n const target = entry!.target as HTMLElement\n const rect = target.getBoundingClientRect()\n emit('resize', rect)\n const breakpoint = getContainerBreakpoint(target.offsetWidth)\n const prev = currentBreakpoint.value\n if (\n prev !== undefined &&\n prev.name === breakpoint.name &&\n prev.level === breakpoint.level\n ) {\n return\n }\n currentBreakpoint.value = breakpoint\n emit('breakpoint-change', breakpoint)\n }, 0)\n )\n observer.observe(dom)\n },\n { immediate: true }\n )\n\n onBeforeUnmount(() => {\n gridRef.value && observer?.unobserve(gridRef.value)\n observer?.disconnect()\n })\n\n return { responsive, gridItemsProps, currentBreakpoint }\n}\n"],"mappings":";;;;AA4BA,SAAgB,cAAc,SAAmD;CAC/E,MAAM,EAAE,OAAO,SAAS,SAAS;CAEjC,MAAM,iBAAiB,gCAAoC,IAAI,KAAK,CAAC;CAErE,MAAM,aAAa,eAAe;AAChC,SAAQ,MAAM,QAAQ,OAAO,MAAM,SAAS,YAAa,CAAC,CAAC,eAAe;GAC1E;CAEF,MAAM,oBAAoB,YAAwB;CAElD,IAAI;AAEJ,OACE,CAAC,YAAY,QAAQ,GACpB,CAAC,YAAY,SAAS;AACrB,MAAI,CAAC,IAAK;AAEV,YAAU,UAAU,IAAI;AACxB,YAAU,YAAY;AACtB,aAAW,KAAA;AAEX,MAAI,CAAC,YAAY;AACf,qBAAkB,QAAQ,KAAA;AAC1B;;AAGF,aAAW,IAAI,eACb,UAAU,CAAC,WAAW;GACpB,MAAM,SAAS,MAAO;AAEtB,QAAK,UADQ,OAAO,uBACD,CAAC;GACpB,MAAM,aAAa,uBAAuB,OAAO,YAAY;GAC7D,MAAM,OAAO,kBAAkB;AAC/B,OACE,SAAS,KAAA,KACT,KAAK,SAAS,WAAW,QACzB,KAAK,UAAU,WAAW,MAE1B;AAEF,qBAAkB,QAAQ;AAC1B,QAAK,qBAAqB,WAAW;KACpC,EAAE,CACN;AACD,WAAS,QAAQ,IAAI;IAEvB,EAAE,WAAW,MAAM,CACpB;AAED,uBAAsB;AACpB,UAAQ,SAAS,UAAU,UAAU,QAAQ,MAAM;AACnD,YAAU,YAAY;GACtB;AAEF,QAAO;EAAE;EAAY;EAAgB;EAAmB"}
|
|
@@ -11,8 +11,8 @@ declare const __VLS_export: _$vue.DefineComponent<GridInputProps, _$_veltra_util
|
|
|
11
11
|
onInput?: ((value: string) => any) | undefined;
|
|
12
12
|
}>, {
|
|
13
13
|
length: number;
|
|
14
|
-
zero: false;
|
|
15
14
|
separator: string;
|
|
15
|
+
zero: false;
|
|
16
16
|
}, {}, {}, {}, string, _$vue.ComponentProvideOptions, false, {}, any>;
|
|
17
17
|
declare const _default: typeof __VLS_export;
|
|
18
18
|
//#endregion
|
|
@@ -16,8 +16,8 @@ type __VLS_Slots = {} & {
|
|
|
16
16
|
declare const __VLS_base: _$vue.DefineComponent<__VLS_PublicProps, _InputExposed, {}, {}, {}, _$vue.ComponentOptionsMixin, _$vue.ComponentOptionsMixin, {
|
|
17
17
|
"update:modelValue": (value: string | undefined) => any;
|
|
18
18
|
} & {
|
|
19
|
-
"update:modelValue": (value: string) => any;
|
|
20
19
|
clear: () => any;
|
|
20
|
+
"update:modelValue": (value: string) => any;
|
|
21
21
|
change: (value: string) => any;
|
|
22
22
|
"suffix:click": (value?: string | undefined) => any;
|
|
23
23
|
"prefix:click": (value?: string | undefined) => any;
|
|
@@ -25,8 +25,8 @@ declare const __VLS_base: _$vue.DefineComponent<__VLS_PublicProps, _InputExposed
|
|
|
25
25
|
blur: (value?: string | undefined) => any;
|
|
26
26
|
"native:input": (ev: Event) => any;
|
|
27
27
|
}, string, _$vue.PublicProps, Readonly<__VLS_PublicProps> & Readonly<{
|
|
28
|
-
"onUpdate:modelValue"?: ((value: string) => any) | undefined;
|
|
29
28
|
onClear?: (() => any) | undefined;
|
|
29
|
+
"onUpdate:modelValue"?: ((value: string) => any) | undefined;
|
|
30
30
|
onChange?: ((value: string) => any) | undefined;
|
|
31
31
|
"onSuffix:click"?: ((value?: string | undefined) => any) | undefined;
|
|
32
32
|
"onPrefix:click"?: ((value?: string | undefined) => any) | undefined;
|
|
@@ -35,9 +35,9 @@ declare const __VLS_base: _$vue.DefineComponent<__VLS_PublicProps, _InputExposed
|
|
|
35
35
|
"onNative:input"?: ((ev: Event) => any) | undefined;
|
|
36
36
|
}>, {
|
|
37
37
|
disabled: boolean;
|
|
38
|
-
readonly: boolean;
|
|
39
38
|
placeholder: string;
|
|
40
39
|
clearable: boolean;
|
|
40
|
+
readonly: boolean;
|
|
41
41
|
}, {}, {}, {}, string, _$vue.ComponentProvideOptions, false, {}, any>;
|
|
42
42
|
declare const __VLS_export: __VLS_WithSlots<typeof __VLS_base, __VLS_Slots>;
|
|
43
43
|
declare const _default: typeof __VLS_export;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"list.js","names":[],"sources":["../../../src/components/list/list.vue"],"sourcesContent":["<template>\n <u-scroll tag=\"ul\" :class=\"[cls.b, cls.m(size)]\">\n <slot v-for=\"(item, index) of data\" v-bind=\"{ item, index }\" />\n </u-scroll>\n</template>\n\n<script lang=\"ts\" setup>\nimport { useFallbackProps } from '@veltra/compositions'\nimport { bem } from '@veltra/utils'\n\nimport type { ListProps } from '../../types'\nimport type { ComponentSize } from '../../types'\nimport { UScroll } from '../scroll'\n\ndefineOptions({\n name: 'List'\n})\n\nconst props = withDefaults(defineProps<ListProps>(), {})\n\nconst { size } = useFallbackProps([props], {\n size: 'default' as ComponentSize\n})\n\nconst cls = bem('list')\n</script>\n"],"mappings":";;;;;;;;;;;;;EAoBA,MAAM,EAAE,SAAS,iBAAiB,
|
|
1
|
+
{"version":3,"file":"list.js","names":[],"sources":["../../../src/components/list/list.vue"],"sourcesContent":["<template>\n <u-scroll tag=\"ul\" :class=\"[cls.b, cls.m(size)]\">\n <slot v-for=\"(item, index) of data\" v-bind=\"{ item, index }\" />\n </u-scroll>\n</template>\n\n<script lang=\"ts\" setup>\nimport { useFallbackProps } from '@veltra/compositions'\nimport { bem } from '@veltra/utils'\n\nimport type { ListProps } from '../../types'\nimport type { ComponentSize } from '../../types'\nimport { UScroll } from '../scroll'\n\ndefineOptions({\n name: 'List'\n})\n\nconst props = withDefaults(defineProps<ListProps>(), {})\n\nconst { size } = useFallbackProps([props], {\n size: 'default' as ComponentSize\n})\n\nconst cls = bem('list')\n</script>\n"],"mappings":";;;;;;;;;;;;;EAoBA,MAAM,EAAE,SAAS,iBAAiB,CAAC,QAAM,EAAE,EACzC,MAAM,WACP,CAAA;EAED,MAAM,MAAM,IAAI,OAAM;;uBAvBpB,YAEW,MAAA,YAAA,EAAA;IAFD,KAAI;IAAM,OAAK,eAAA,CAAG,MAAA,IAAG,CAAC,GAAG,MAAA,IAAG,CAAC,EAAE,MAAA,KAAI,CAAA,CAAA,CAAA;;2BACR,EAAA,UAAA,KAAA,EAAnC,mBAA+D,UAAA,MAAA,WAAjC,QAAA,OAAhB,MAAM,UAAK;YAAzB,WAA+D,KAAA,QAAA,WAA/D,WAA+D,EAAA,SAAA,MAAA,EAAA;MAAjB;MAAM;MAAK,CAAA,CAAA"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"directive.js","names":["LoadingComponent"],"sources":["../../../src/components/loading/directive.ts"],"sourcesContent":["import { bem } from '@veltra/utils'\nimport { createVNode, render, type DirectiveBinding, type ObjectDirective } from 'vue'\n\nimport type { LoadingType } from '../../types'\nimport LoadingComponent from './loading.vue'\n\nconst loadingCls = bem('loading')\nconst loadingContainerCls = loadingCls.e('container')\n\nfunction renderLoading(el: HTMLElement, binding: DirectiveBinding) {\n el.classList.add(loadingContainerCls)\n\n const node = createVNode(LoadingComponent, { type: binding.arg as LoadingType })\n\n render(node, el)\n}\n\nfunction removeLoading(el: HTMLElement) {\n render(null, el)\n el.classList.remove(loadingContainerCls)\n}\nexport const vLoading: ObjectDirective<HTMLElement> = {\n mounted(el, binding) {\n binding.value && renderLoading(el, binding)\n },\n\n updated(el, binding) {\n binding.value ? renderLoading(el, binding) : removeLoading(el)\n },\n\n unmounted(el) {\n removeLoading(el)\n }\n}\n"],"mappings":";;;;AAOA,MAAM,sBADa,IAAI,
|
|
1
|
+
{"version":3,"file":"directive.js","names":["LoadingComponent"],"sources":["../../../src/components/loading/directive.ts"],"sourcesContent":["import { bem } from '@veltra/utils'\nimport { createVNode, render, type DirectiveBinding, type ObjectDirective } from 'vue'\n\nimport type { LoadingType } from '../../types'\nimport LoadingComponent from './loading.vue'\n\nconst loadingCls = bem('loading')\nconst loadingContainerCls = loadingCls.e('container')\n\nfunction renderLoading(el: HTMLElement, binding: DirectiveBinding) {\n el.classList.add(loadingContainerCls)\n\n const node = createVNode(LoadingComponent, { type: binding.arg as LoadingType })\n\n render(node, el)\n}\n\nfunction removeLoading(el: HTMLElement) {\n render(null, el)\n el.classList.remove(loadingContainerCls)\n}\nexport const vLoading: ObjectDirective<HTMLElement> = {\n mounted(el, binding) {\n binding.value && renderLoading(el, binding)\n },\n\n updated(el, binding) {\n binding.value ? renderLoading(el, binding) : removeLoading(el)\n },\n\n unmounted(el) {\n removeLoading(el)\n }\n}\n"],"mappings":";;;;AAOA,MAAM,sBADa,IAAI,UACe,CAAC,EAAE,YAAY;AAErD,SAAS,cAAc,IAAiB,SAA2B;AACjE,IAAG,UAAU,IAAI,oBAAoB;AAIrC,QAFa,YAAYA,WAAkB,EAAE,MAAM,QAAQ,KAAoB,CAEpE,EAAE,GAAG;;AAGlB,SAAS,cAAc,IAAiB;AACtC,QAAO,MAAM,GAAG;AAChB,IAAG,UAAU,OAAO,oBAAoB;;AAE1C,MAAa,WAAyC;CACpD,QAAQ,IAAI,SAAS;AACnB,UAAQ,SAAS,cAAc,IAAI,QAAQ;;CAG7C,QAAQ,IAAI,SAAS;AACnB,UAAQ,QAAQ,cAAc,IAAI,QAAQ,GAAG,cAAc,GAAG;;CAGhE,UAAU,IAAI;AACZ,gBAAc,GAAG;;CAEpB"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"menu-item.js","names":[],"sources":["../../../src/components/menu/menu-item.vue"],"sourcesContent":["<template>\n <li\n :class=\"[\n cls.e('item'),\n bem.is('first-level', depth === 0),\n bem.is('active', active),\n bem.is('disabled', menu.disabled ?? false)\n ]\"\n ref=\"item\"\n @click=\"handleClickMenu\"\n >\n <MenuIcon v-if=\"menu.icon\" :icon=\"menu.icon\" :class=\"cls.e('icon')\" />\n\n <!-- 文本 -->\n <span :class=\"cls.e('item-title')\">\n {{ menu.title }}\n </span>\n </li>\n</template>\n\n<script setup lang=\"ts\">\nimport { bem } from '@veltra/utils'\nimport { useTemplateRef } from 'vue'\n\nimport type { MenuItem } from '../../types'\nimport MenuIcon from './menu-icon.vue'\nimport { useMenuItem } from './use-menu-item'\n\ndefineOptions({ name: 'MenuItem' })\n\nconst props = defineProps<{ menu: MenuItem; depth: number }>()\n\nconst itemRef = useTemplateRef('item')\n\nconst { cls, active, handleClickMenu } = useMenuItem({ itemProps: props, itemRef })\n</script>\n"],"mappings":";;;;;;;;;;;;;EAkCA,MAAM,EAAE,KAAK,QAAQ,oBAAoB,YAAY;GAAE,
|
|
1
|
+
{"version":3,"file":"menu-item.js","names":[],"sources":["../../../src/components/menu/menu-item.vue"],"sourcesContent":["<template>\n <li\n :class=\"[\n cls.e('item'),\n bem.is('first-level', depth === 0),\n bem.is('active', active),\n bem.is('disabled', menu.disabled ?? false)\n ]\"\n ref=\"item\"\n @click=\"handleClickMenu\"\n >\n <MenuIcon v-if=\"menu.icon\" :icon=\"menu.icon\" :class=\"cls.e('icon')\" />\n\n <!-- 文本 -->\n <span :class=\"cls.e('item-title')\">\n {{ menu.title }}\n </span>\n </li>\n</template>\n\n<script setup lang=\"ts\">\nimport { bem } from '@veltra/utils'\nimport { useTemplateRef } from 'vue'\n\nimport type { MenuItem } from '../../types'\nimport MenuIcon from './menu-icon.vue'\nimport { useMenuItem } from './use-menu-item'\n\ndefineOptions({ name: 'MenuItem' })\n\nconst props = defineProps<{ menu: MenuItem; depth: number }>()\n\nconst itemRef = useTemplateRef('item')\n\nconst { cls, active, handleClickMenu } = useMenuItem({ itemProps: props, itemRef })\n</script>\n"],"mappings":";;;;;;;;;;;;;EAkCA,MAAM,EAAE,KAAK,QAAQ,oBAAoB,YAAY;GAAE,WAAW;GAAO,SAFzD,eAAe,OAE0C;GAAS,CAAA;;uBAjChF,mBAgBK,MAAA;IAfF,OAAK,eAAA;KAAU,MAAA,IAAG,CAAC,EAAC,OAAA;KAAgB,MAAA,IAAG,CAAC,GAAE,eAAgB,QAAA,UAAK,EAAA;KAAe,MAAA,IAAG,CAAC,GAAE,UAAW,MAAA,OAAM,CAAA;KAAS,MAAA,IAAG,CAAC,GAAE,YAAa,QAAA,KAAK,YAAQ,MAAA;;IAM/I,KAAI;IACH,SAAK,OAAA,OAAA,OAAA,MAAA,GAAA,SAAE,MAAA,gBAAA,IAAA,MAAA,gBAAA,CAAA,GAAA,KAAe;;IAEP,QAAA,KAAK,QAAA,WAAA,EAArB,YAAsE,aAAA;;KAA1C,MAAM,QAAA,KAAK;KAAO,OAAK,eAAE,MAAA,IAAG,CAAC,EAAC,OAAA,CAAA;;IAE1D,mBAAA,OAAW;IACX,mBAEO,QAAA,EAFA,OAAK,eAAE,MAAA,IAAG,CAAC,EAAC,aAAA,CAAA,EAAA,EAAA,gBACd,QAAA,KAAK,MAAK,EAAA,EAAA"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"message2.js","names":["UMessageBox"],"sources":["../../../src/components/message/message.ts"],"sourcesContent":["import { bem, setStyles, zIndex } from '@veltra/utils'\nimport { h, render, shallowReactive } from 'vue'\n\nimport type { MessageOptions, Message, MessageInstance } from '../../types'\nimport UMessageBox from './message-box.vue'\n\nconst cls = bem('message')\n\n/** 消息项数据结构 */\ntype MessageItem = MessageOptions & { key: string }\n\n/** --- 状态管理 --- */\nlet container: HTMLElement | null = null\nconst messages = shallowReactive<MessageItem[]>([])\n\n/** 消息关闭后回调 */\nconst closedCallbacks = new Map<string, () => void>()\n\n/** 用于计数正在显示的 DOM 节点 (包含动画执行中) */\nlet activeCount = 0\nlet uid = 0\n\n/** --- 内部辅助函数 --- */\n\n/** 彻底销毁容器 */\nconst destroy = () => {\n if (container) {\n render(null, container)\n document.body.removeChild(container)\n container = null\n }\n}\n\n/** 离开动画结束后的清理 */\nconst handleClosed = (id: string) => {\n activeCount--\n\n const cb = closedCallbacks.get(id)\n if (cb) {\n cb()\n closedCallbacks.delete(id)\n }\n\n // 没有活跃消息时销毁容器,保持页面干净\n if (activeCount === 0) destroy()\n}\n\n/** 触发关闭 (仅从数组移除,触发 Transition 离开动画) */\nconst handleClose = (id: string) => {\n const index = messages.findIndex((m) => m.key === id)\n if (index !== -1) messages.splice(index, 1)\n}\n\n/** 挂载并渲染容器 */\nconst ensureContainer = () => {\n if (container) return container\n\n container = document.createElement('ul')\n container.className = cls.e('container')\n document.body.appendChild(container)\n return container\n}\n\n/** 执行 Vue 渲染逻辑 */\nconst updateView = () => {\n const el = ensureContainer()\n setStyles(el, { zIndex: zIndex() })\n\n const vnode = h(UMessageBox, {\n messages,\n onClosed: handleClosed,\n onClose: (i: number) => messages.splice(i, 1)\n })\n\n vnode.appContext = message._context\n render(vnode, el)\n}\n\n/** 创建消息实例 */\nconst createMessage = (options: MessageOptions): MessageInstance => {\n const { onClosed: userOnClosed, ...messageOptions } = options\n const id = `msg_${uid++}`\n activeCount++\n\n // 生命周期 Promise\n let resolveClosed: () => void\n const onClosed = new Promise<void>((r) => (resolveClosed = r))\n\n closedCallbacks.set(id, () => {\n userOnClosed?.()\n resolveClosed()\n })\n\n messages.push({ key: id, ...messageOptions })\n updateView()\n\n return { id, close: () => handleClose(id), onClosed }\n}\n\n/** --- 导出 API --- */\n\nexport const message = ((options) => {\n const mergedOptions = typeof options === 'string' ? { message: options } : options\n return createMessage(mergedOptions)\n}) as Message\n\nmessage._context = null\n\n// 挂载快捷方法: message.success(...)\nconst messageTypes = ['success', 'warn', 'info', 'error', 'default'] as const\nmessageTypes.forEach((type) => {\n message[type] = (msg, config) => message({ ...config, message: msg, type })\n})\n\n/** 关闭所有当前显示的消息 */\nmessage.closeAll = () => {\n messages.splice(0)\n}\n"],"mappings":";;;;AAMA,MAAM,MAAM,IAAI,UAAU;;AAM1B,IAAI,YAAgC;AACpC,MAAM,WAAW,gBAA+B,EAAE,CAAC;;AAGnD,MAAM,kCAAkB,IAAI,KAAyB;;AAGrD,IAAI,cAAc;AAClB,IAAI,MAAM;;;AAKV,MAAM,gBAAgB;AACpB,KAAI,WAAW;AACb,SAAO,MAAM,UAAU;AACvB,WAAS,KAAK,YAAY,UAAU;AACpC,cAAY;;;;AAKhB,MAAM,gBAAgB,OAAe;AACnC;CAEA,MAAM,KAAK,gBAAgB,IAAI,GAAG;AAClC,KAAI,IAAI;AACN,MAAI;AACJ,kBAAgB,OAAO,GAAG;;AAI5B,KAAI,gBAAgB,EAAG,UAAS;;;AAIlC,MAAM,eAAe,OAAe;CAClC,MAAM,QAAQ,SAAS,WAAW,MAAM,EAAE,QAAQ,GAAG;AACrD,KAAI,UAAU,GAAI,UAAS,OAAO,OAAO,EAAE;;;AAI7C,MAAM,wBAAwB;AAC5B,KAAI,UAAW,QAAO;AAEtB,aAAY,SAAS,cAAc,KAAK;AACxC,WAAU,YAAY,IAAI,EAAE,YAAY;AACxC,UAAS,KAAK,YAAY,UAAU;AACpC,QAAO;;;AAIT,MAAM,mBAAmB;CACvB,MAAM,KAAK,iBAAiB;AAC5B,WAAU,IAAI,EAAE,QAAQ,QAAQ,EAAE,CAAC;CAEnC,MAAM,QAAQ,EAAEA,WAAa;EAC3B;EACA,UAAU;EACV,UAAU,MAAc,SAAS,OAAO,GAAG,EAAE;EAC9C,CAAC;AAEF,OAAM,aAAa,QAAQ;AAC3B,QAAO,OAAO,GAAG;;;AAInB,MAAM,iBAAiB,YAA6C;CAClE,MAAM,EAAE,UAAU,cAAc,GAAG,mBAAmB;CACtD,MAAM,KAAK,OAAO;AAClB;CAGA,IAAI;CACJ,MAAM,WAAW,IAAI,SAAe,MAAO,gBAAgB,EAAG;AAE9D,iBAAgB,IAAI,UAAU;AAC5B,kBAAgB;AAChB,iBAAe;GACf;AAEF,UAAS,KAAK;EAAE,KAAK;EAAI,GAAG;EAAgB,CAAC;AAC7C,aAAY;AAEZ,QAAO;EAAE;EAAI,aAAa,YAAY,GAAG;EAAE;EAAU;;;AAKvD,MAAa,YAAY,YAAY;AAEnC,QAAO,cADe,OAAO,YAAY,WAAW,EAAE,SAAS,SAAS,GAAG,QACxC;;AAGrC,QAAQ,WAAW;
|
|
1
|
+
{"version":3,"file":"message2.js","names":["UMessageBox"],"sources":["../../../src/components/message/message.ts"],"sourcesContent":["import { bem, setStyles, zIndex } from '@veltra/utils'\nimport { h, render, shallowReactive } from 'vue'\n\nimport type { MessageOptions, Message, MessageInstance } from '../../types'\nimport UMessageBox from './message-box.vue'\n\nconst cls = bem('message')\n\n/** 消息项数据结构 */\ntype MessageItem = MessageOptions & { key: string }\n\n/** --- 状态管理 --- */\nlet container: HTMLElement | null = null\nconst messages = shallowReactive<MessageItem[]>([])\n\n/** 消息关闭后回调 */\nconst closedCallbacks = new Map<string, () => void>()\n\n/** 用于计数正在显示的 DOM 节点 (包含动画执行中) */\nlet activeCount = 0\nlet uid = 0\n\n/** --- 内部辅助函数 --- */\n\n/** 彻底销毁容器 */\nconst destroy = () => {\n if (container) {\n render(null, container)\n document.body.removeChild(container)\n container = null\n }\n}\n\n/** 离开动画结束后的清理 */\nconst handleClosed = (id: string) => {\n activeCount--\n\n const cb = closedCallbacks.get(id)\n if (cb) {\n cb()\n closedCallbacks.delete(id)\n }\n\n // 没有活跃消息时销毁容器,保持页面干净\n if (activeCount === 0) destroy()\n}\n\n/** 触发关闭 (仅从数组移除,触发 Transition 离开动画) */\nconst handleClose = (id: string) => {\n const index = messages.findIndex((m) => m.key === id)\n if (index !== -1) messages.splice(index, 1)\n}\n\n/** 挂载并渲染容器 */\nconst ensureContainer = () => {\n if (container) return container\n\n container = document.createElement('ul')\n container.className = cls.e('container')\n document.body.appendChild(container)\n return container\n}\n\n/** 执行 Vue 渲染逻辑 */\nconst updateView = () => {\n const el = ensureContainer()\n setStyles(el, { zIndex: zIndex() })\n\n const vnode = h(UMessageBox, {\n messages,\n onClosed: handleClosed,\n onClose: (i: number) => messages.splice(i, 1)\n })\n\n vnode.appContext = message._context\n render(vnode, el)\n}\n\n/** 创建消息实例 */\nconst createMessage = (options: MessageOptions): MessageInstance => {\n const { onClosed: userOnClosed, ...messageOptions } = options\n const id = `msg_${uid++}`\n activeCount++\n\n // 生命周期 Promise\n let resolveClosed: () => void\n const onClosed = new Promise<void>((r) => (resolveClosed = r))\n\n closedCallbacks.set(id, () => {\n userOnClosed?.()\n resolveClosed()\n })\n\n messages.push({ key: id, ...messageOptions })\n updateView()\n\n return { id, close: () => handleClose(id), onClosed }\n}\n\n/** --- 导出 API --- */\n\nexport const message = ((options) => {\n const mergedOptions = typeof options === 'string' ? { message: options } : options\n return createMessage(mergedOptions)\n}) as Message\n\nmessage._context = null\n\n// 挂载快捷方法: message.success(...)\nconst messageTypes = ['success', 'warn', 'info', 'error', 'default'] as const\nmessageTypes.forEach((type) => {\n message[type] = (msg, config) => message({ ...config, message: msg, type })\n})\n\n/** 关闭所有当前显示的消息 */\nmessage.closeAll = () => {\n messages.splice(0)\n}\n"],"mappings":";;;;AAMA,MAAM,MAAM,IAAI,UAAU;;AAM1B,IAAI,YAAgC;AACpC,MAAM,WAAW,gBAA+B,EAAE,CAAC;;AAGnD,MAAM,kCAAkB,IAAI,KAAyB;;AAGrD,IAAI,cAAc;AAClB,IAAI,MAAM;;;AAKV,MAAM,gBAAgB;AACpB,KAAI,WAAW;AACb,SAAO,MAAM,UAAU;AACvB,WAAS,KAAK,YAAY,UAAU;AACpC,cAAY;;;;AAKhB,MAAM,gBAAgB,OAAe;AACnC;CAEA,MAAM,KAAK,gBAAgB,IAAI,GAAG;AAClC,KAAI,IAAI;AACN,MAAI;AACJ,kBAAgB,OAAO,GAAG;;AAI5B,KAAI,gBAAgB,EAAG,UAAS;;;AAIlC,MAAM,eAAe,OAAe;CAClC,MAAM,QAAQ,SAAS,WAAW,MAAM,EAAE,QAAQ,GAAG;AACrD,KAAI,UAAU,GAAI,UAAS,OAAO,OAAO,EAAE;;;AAI7C,MAAM,wBAAwB;AAC5B,KAAI,UAAW,QAAO;AAEtB,aAAY,SAAS,cAAc,KAAK;AACxC,WAAU,YAAY,IAAI,EAAE,YAAY;AACxC,UAAS,KAAK,YAAY,UAAU;AACpC,QAAO;;;AAIT,MAAM,mBAAmB;CACvB,MAAM,KAAK,iBAAiB;AAC5B,WAAU,IAAI,EAAE,QAAQ,QAAQ,EAAE,CAAC;CAEnC,MAAM,QAAQ,EAAEA,WAAa;EAC3B;EACA,UAAU;EACV,UAAU,MAAc,SAAS,OAAO,GAAG,EAAE;EAC9C,CAAC;AAEF,OAAM,aAAa,QAAQ;AAC3B,QAAO,OAAO,GAAG;;;AAInB,MAAM,iBAAiB,YAA6C;CAClE,MAAM,EAAE,UAAU,cAAc,GAAG,mBAAmB;CACtD,MAAM,KAAK,OAAO;AAClB;CAGA,IAAI;CACJ,MAAM,WAAW,IAAI,SAAe,MAAO,gBAAgB,EAAG;AAE9D,iBAAgB,IAAI,UAAU;AAC5B,kBAAgB;AAChB,iBAAe;GACf;AAEF,UAAS,KAAK;EAAE,KAAK;EAAI,GAAG;EAAgB,CAAC;AAC7C,aAAY;AAEZ,QAAO;EAAE;EAAI,aAAa,YAAY,GAAG;EAAE;EAAU;;;AAKvD,MAAa,YAAY,YAAY;AAEnC,QAAO,cADe,OAAO,YAAY,WAAW,EAAE,SAAS,SAAS,GAAG,QACxC;;AAGrC,QAAQ,WAAW;AAInB;CADsB;CAAW;CAAQ;CAAQ;CAAS;CAC9C,CAAC,SAAS,SAAS;AAC7B,SAAQ,SAAS,KAAK,WAAW,QAAQ;EAAE,GAAG;EAAQ,SAAS;EAAK;EAAM,CAAC;EAC3E;;AAGF,QAAQ,iBAAiB;AACvB,UAAS,OAAO,EAAE"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"multi-select.js","names":[],"sources":["../../../src/components/multi-select/multi-select.vue"],"sourcesContent":["<template>\n <u-dropdown\n v-if=\"!readonly\"\n trigger=\"click\"\n ref=\"dropdownRef\"\n :class=\"[cls.b, cls.m(size), bem.is('disabled', disabled)]\"\n :content-class=\"[cls.e('panel'), cls.em('panel', size), contentClass]\"\n :content-style=\"contentStyle\"\n :min-width=\"minWidth\"\n :width=\"width\"\n @mouseenter=\"hovered = true\"\n @mouseleave=\"hovered = false\"\n :disabled=\"disabled\"\n @update:visible=\"handleDropdownVisible\"\n >\n <!-- 触发 -->\n <template #trigger>\n <span :class=\"cls.e('placeholder')\" v-show=\"!model?.length\">\n {{ placeholder }}\n </span>\n\n <div v-if=\"model?.length\" :class=\"cls.e('tags')\">\n <u-tag\n v-for=\"option of tags\"\n :key=\"option[valueKey]\"\n :closable=\"!disabled\"\n @close=\"handleClose(option)\"\n >\n {{ option[labelKey] }}\n </u-tag>\n <u-tag v-if=\"restTag\"> {{ restTag }}+ </u-tag>\n </div>\n\n <transition name=\"zoom-in\" mode=\"out-in\">\n <u-icon\n v-if=\"clearable && model?.length && hovered && !disabled\"\n :class=\"cls.e('clear')\"\n @click.stop=\"handleClear\"\n >\n <Close />\n </u-icon>\n\n <u-icon :class=\"cls.e('arrow')\" v-else><ArrowDown /></u-icon>\n </transition>\n </template>\n\n <!-- 下拉内容 -->\n <template #content>\n <!-- 多选栏 -->\n <div :class=\"cls.e('content-header')\">\n <u-checkbox\n :model-value=\"allChecked\"\n :indeterminate=\"indeterminate\"\n @update:model-value=\"handleCheckAll\"\n :disabled=\"max !== undefined\"\n >\n 全选\n </u-checkbox>\n\n <span> 已选 {{ model?.length }}/{{ max ?? options?.length ?? 0 }} </span>\n </div>\n\n <!-- 过滤器 -->\n <div v-if=\"filterable\" :class=\"cls.e('content-filter')\">\n <u-input\n placeholder=\"输入关键字进行过滤\"\n v-model=\"queryString\"\n @keydown.enter.prevent=\"handleCreateByEnter\"\n >\n <template #suffix>\n <u-icon><Search /></u-icon>\n </template>\n </u-input>\n </div>\n\n <!-- 多选列表 -->\n <!--\n 虚拟化启用时内容容器 height 由 useVirtualizer 命令式写入;\n 模板不再绑定 totalSize,避免尺寸变化引起重渲染。\n -->\n <u-scroll\n tag=\"ul\"\n :class=\"[cls.e('options')]\"\n ref=\"scrollRef\"\n v-if=\"options.length\"\n :content-class=\"[cls.e('options-wrap'), bem.is('virtual', virtualEnabled)]\"\n >\n <template v-if=\"virtualEnabled\">\n <u-multi-select-option\n v-for=\"{ option, index, key, label, offset } of virtualOptions\"\n :option=\"option\"\n :disabled=\"isDisabled(option)\"\n :key=\"key\"\n :style=\"{ transform: `translateY(${offset}px)` }\"\n @check=\"handleCheck(option, $event)\"\n :checked=\"checkedSet.has(option)\"\n :index=\"index\"\n :measure-element=\"measureElement\"\n >\n <slot v-bind=\"{ option, index }\">\n {{ label }}\n </slot>\n </u-multi-select-option>\n </template>\n\n <template v-else>\n <u-multi-select-option\n v-for=\"(option, index) of options\"\n :option=\"option\"\n :disabled=\"isDisabled(option)\"\n :key=\"chainObj(option).get(valueKey)\"\n @check=\"handleCheck(option, $event)\"\n :checked=\"checkedSet.has(option)\"\n >\n <slot v-bind=\"{ option, index }\">\n {{ chainObj(option).get(labelKey) }}\n </slot>\n </u-multi-select-option>\n </template>\n </u-scroll>\n\n <div v-else :class=\"cls.e('empty')\">\n <UEmpty />\n </div>\n </template>\n </u-dropdown>\n\n <div v-else-if=\"model?.length\" :class=\"[cls.m(size), cls.e('readonly-tags')]\">\n <div :class=\"cls.e('tags')\">\n <u-tag v-for=\"option of tags\" :key=\"option[valueKey]\">\n {{ option[labelKey] }}\n </u-tag>\n </div>\n </div>\n\n <template v-else>\n {{ FORM_EMPTY_CONTENT }}\n </template>\n</template>\n\n<script lang=\"ts\" setup>\nimport { o as chainObj } from '@cat-kit/core'\nimport { useFormComponent, useFormFallbackProps, useVirtualizer } from '@veltra/compositions'\nimport { ArrowDown, Close, Search } from '@veltra/icons/normal'\nimport { bem, FORM_EMPTY_CONTENT } from '@veltra/utils'\nimport { computed, shallowRef, shallowReactive, watch, provide } from 'vue'\n\nimport type {\n MultiSelectEmits,\n MultiSelectProps,\n ScrollExposed,\n DropdownExposed\n} from '../../types'\nimport { UCheckbox } from '../checkbox'\nimport { UDropdown } from '../dropdown'\nimport { UEmpty } from '../empty'\nimport { UIcon } from '../icon'\nimport { UInput } from '../input'\nimport { UScroll } from '../scroll'\nimport { useOptions } from '../select/use-options'\nimport { UTag } from '../tag'\nimport { MultiSelectDIKey } from './di'\nimport UMultiSelectOption from './multi-select-option.vue'\n\ndefineOptions({ name: 'MultiSelect' })\n\nconst props = withDefaults(defineProps<MultiSelectProps>(), {\n labelKey: 'label',\n valueKey: 'value',\n placeholder: '请选择',\n clearable: true,\n visibilityLimit: 3,\n disabled: undefined,\n readonly: undefined,\n minWidth: '220px'\n})\n\nconst emit = defineEmits<MultiSelectEmits>()\n\nconst cls = bem('multi-select')\n\nconst { formProps } = useFormComponent()\n\nconst { size, disabled, readonly } = useFormFallbackProps([formProps ?? {}, props], {\n size: 'default',\n disabled: false,\n readonly: false\n})\n\nconst scrollRef = shallowRef<ScrollExposed>()\n\nconst hovered = shallowRef(false)\n\nconst { options: rawOptions, queryString, allOptions: rawAllOptions } = useOptions({ props })\n\nconst createdOptions = shallowRef<Record<string, any>[]>([])\n\nconst options = computed(() => {\n const base = rawOptions.value\n if (!props.creatable || !createdOptions.value.length) return base\n\n const { valueKey } = props\n const createdValues = new Set(createdOptions.value.map((o) => chainObj(o).get(valueKey)))\n const deduped = base.filter((o) => !(o.__isTemp && createdValues.has(chainObj(o).get(valueKey))))\n const dedupedValues = new Set(deduped.map((o) => chainObj(o).get(valueKey)))\n const toAdd = createdOptions.value.filter((o) => !dedupedValues.has(chainObj(o).get(valueKey)))\n return [...toAdd, ...deduped]\n})\n\nconst allOptions = computed(() => {\n if (!props.creatable || !createdOptions.value.length) return rawAllOptions.value\n return [...createdOptions.value, ...rawAllOptions.value]\n})\n\nconst virtualEnabled = computed(() => options.value.length > 80)\n\nconst { virtualizer, items } = useVirtualizer({\n estimateSize: () => 40,\n count: computed(() => options.value.length),\n scrollEl: () => scrollRef.value?.containerRef ?? null,\n contentEl: () => (virtualEnabled.value ? (scrollRef.value?.contentRef ?? null) : null)\n})\n\nconst virtualOptions = computed(() => {\n const { valueKey, labelKey } = props\n const _options = options.value\n return items.value.map((v) => {\n const option = _options[v.index]!\n const val = chainObj(option).get(valueKey)\n return {\n option,\n index: v.index,\n val,\n key: v.index,\n offset: v.start,\n label: chainObj(option).get(labelKey)\n }\n })\n})\n\nconst measureElement: (index: number, el: Element | null) => void = (index, el) =>\n virtualizer.measureElement(index, el)\n\nconst filterable = computed(() => {\n return props.filterable || props.creatable || typeof props.options === 'function'\n})\n\nconst model = defineModel<Array<string | number>>()\n\nconst checkedSet = shallowReactive<Set<Record<string, any>>>(new Set())\nconst allChecked = computed(() => {\n return checkedSet.size === options.value.length\n})\nconst indeterminate = computed(() => {\n return checkedSet.size > 0 && !allChecked.value\n})\n\nconst optionsMap = computed(() => {\n const { valueKey } = props\n return new Map<string | number, Record<string, any>>(\n allOptions.value.map((option) => [option[valueKey], option])\n )\n})\n\nconst dropdownRef = shallowRef<DropdownExposed>()\n\nlet internalChange = false\n\nwatch(\n [model, optionsMap],\n ([model, optionsMap]) => {\n if (internalChange) {\n internalChange = false\n return\n }\n checkedSet.clear()\n if (optionsMap.size && model?.length) {\n model.forEach((v) => {\n const option = optionsMap.get(v)\n option && checkedSet.add(option)\n })\n }\n },\n { immediate: true }\n)\n\nconst emitChange = () => {\n emit('change', Array.from(checkedSet))\n}\n\nconst tags = computed(() => {\n let tags: Record<string, any>[] = []\n let { visibilityLimit } = props\n if (visibilityLimit < 0) {\n visibilityLimit = 0\n }\n\n // 禁用时,显示全部\n if (disabled.value || readonly.value) {\n visibilityLimit = model.value?.length ?? 0\n }\n\n model.value?.slice(0, visibilityLimit).forEach((k) => {\n const option = optionsMap.value.get(k)\n option && tags.push(option)\n })\n\n return tags\n})\n\nconst restTag = computed(() => {\n return (model.value?.length ?? 0) - tags.value.length\n})\n\nconst handleDropdownVisible = (visible: boolean) => {\n if (!visible) {\n queryString.value = ''\n }\n}\n\nconst handleCheck = (option: Record<string, any>, checked: boolean) => {\n const { valueKey, labelKey } = props\n if (checked) {\n if (option.__isTemp && props.creatable) {\n const created: Record<string, any> = {\n [labelKey]: chainObj(option).get(labelKey),\n [valueKey]: chainObj(option).get(valueKey)\n }\n createdOptions.value = [...createdOptions.value, created]\n checkedSet.add(created)\n internalChange = true\n model.value = [...(model.value ?? []), chainObj(created).get(valueKey)]\n queryString.value = ''\n } else if (!checkedSet.has(option)) {\n checkedSet.add(option)\n internalChange = true\n model.value = [...(model.value ?? []), chainObj(option).get(valueKey)]\n }\n } else {\n checkedSet.delete(option)\n const val = chainObj(option).get(valueKey)\n internalChange = true\n model.value = (model.value ?? []).filter((v) => v !== val)\n removeCreatedOption(option)\n }\n\n emitChange()\n dropdownRef.value?.updateDropdown()\n}\n\n/** 全选 */\nconst handleCheckAll = (checked: boolean) => {\n const { valueKey } = props\n if (checked) {\n options.value.forEach((option) => {\n if (!option.__isTemp) checkedSet.add(option)\n })\n internalChange = true\n model.value = Array.from(checkedSet).map((o) => chainObj(o).get(valueKey))\n } else {\n checkedSet.clear()\n internalChange = true\n model.value = []\n if (props.creatable) {\n createdOptions.value = []\n }\n }\n\n emitChange()\n dropdownRef.value?.updateDropdown()\n}\n\n/** 清除选项 */\nconst handleClear = () => {\n checkedSet.clear()\n internalChange = true\n model.value = []\n if (props.creatable) {\n createdOptions.value = []\n }\n emit('change', [])\n}\n\nconst handleClose = (option: Record<string, any>) => {\n checkedSet.delete(option)\n const val = chainObj(option).get(props.valueKey)\n internalChange = true\n model.value = (model.value ?? []).filter((v) => v !== val)\n removeCreatedOption(option)\n emitChange()\n}\n\nconst removeCreatedOption = (option: Record<string, any>) => {\n if (!props.creatable || !createdOptions.value.length) return\n const { valueKey } = props\n const val = chainObj(option).get(valueKey)\n createdOptions.value = createdOptions.value.filter((o) => chainObj(o).get(valueKey) !== val)\n}\n\nconst handleCreateByEnter = () => {\n if (!props.creatable) return\n const qs = queryString.value?.trim()\n if (!qs) return\n\n const { labelKey, valueKey } = props\n\n const existingCreated = createdOptions.value.find((o) => chainObj(o).get(valueKey) === qs)\n if (existingCreated) {\n if (!checkedSet.has(existingCreated)) {\n checkedSet.add(existingCreated)\n internalChange = true\n model.value = [...(model.value ?? []), chainObj(existingCreated).get(valueKey)]\n }\n queryString.value = ''\n emitChange()\n dropdownRef.value?.updateDropdown()\n return\n }\n\n const exactMatch = rawOptions.value.find((o) => !o.__isTemp && chainObj(o).get(labelKey) === qs)\n if (exactMatch) {\n if (!checkedSet.has(exactMatch)) {\n checkedSet.add(exactMatch)\n internalChange = true\n model.value = [...(model.value ?? []), chainObj(exactMatch).get(valueKey)]\n }\n queryString.value = ''\n emitChange()\n dropdownRef.value?.updateDropdown()\n return\n }\n\n const created: Record<string, any> = { [labelKey]: qs, [valueKey]: qs }\n createdOptions.value = [...createdOptions.value, created]\n checkedSet.add(created)\n internalChange = true\n model.value = [...(model.value ?? []), qs]\n queryString.value = ''\n emitChange()\n dropdownRef.value?.updateDropdown()\n}\n\nconst isDisabled = (option: Record<string, any>) => {\n const { max } = props\n return max !== undefined && checkedSet.size >= max && !checkedSet.has(option)\n}\n\nconst optionClass = cls.e('option')\nconst rippleClass = cls.e('ripple')\nconst checkboxClass = cls.e('checkbox')\n\nprovide(MultiSelectDIKey, { optionClass, rippleClass, checkboxClass })\n</script>\n"],"mappings":"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"}
|
|
1
|
+
{"version":3,"file":"multi-select.js","names":[],"sources":["../../../src/components/multi-select/multi-select.vue"],"sourcesContent":["<template>\n <u-dropdown\n v-if=\"!readonly\"\n trigger=\"click\"\n ref=\"dropdownRef\"\n :class=\"[cls.b, cls.m(size), bem.is('disabled', disabled)]\"\n :content-class=\"[cls.e('panel'), cls.em('panel', size), contentClass]\"\n :content-style=\"contentStyle\"\n :min-width=\"minWidth\"\n :width=\"width\"\n @mouseenter=\"hovered = true\"\n @mouseleave=\"hovered = false\"\n :disabled=\"disabled\"\n @update:visible=\"handleDropdownVisible\"\n >\n <!-- 触发 -->\n <template #trigger>\n <span :class=\"cls.e('placeholder')\" v-show=\"!model?.length\">\n {{ placeholder }}\n </span>\n\n <div v-if=\"model?.length\" :class=\"cls.e('tags')\">\n <u-tag\n v-for=\"option of tags\"\n :key=\"option[valueKey]\"\n :closable=\"!disabled\"\n @close=\"handleClose(option)\"\n >\n {{ option[labelKey] }}\n </u-tag>\n <u-tag v-if=\"restTag\"> {{ restTag }}+ </u-tag>\n </div>\n\n <transition name=\"zoom-in\" mode=\"out-in\">\n <u-icon\n v-if=\"clearable && model?.length && hovered && !disabled\"\n :class=\"cls.e('clear')\"\n @click.stop=\"handleClear\"\n >\n <Close />\n </u-icon>\n\n <u-icon :class=\"cls.e('arrow')\" v-else><ArrowDown /></u-icon>\n </transition>\n </template>\n\n <!-- 下拉内容 -->\n <template #content>\n <!-- 多选栏 -->\n <div :class=\"cls.e('content-header')\">\n <u-checkbox\n :model-value=\"allChecked\"\n :indeterminate=\"indeterminate\"\n @update:model-value=\"handleCheckAll\"\n :disabled=\"max !== undefined\"\n >\n 全选\n </u-checkbox>\n\n <span> 已选 {{ model?.length }}/{{ max ?? options?.length ?? 0 }} </span>\n </div>\n\n <!-- 过滤器 -->\n <div v-if=\"filterable\" :class=\"cls.e('content-filter')\">\n <u-input\n placeholder=\"输入关键字进行过滤\"\n v-model=\"queryString\"\n @keydown.enter.prevent=\"handleCreateByEnter\"\n >\n <template #suffix>\n <u-icon><Search /></u-icon>\n </template>\n </u-input>\n </div>\n\n <!-- 多选列表 -->\n <!--\n 虚拟化启用时内容容器 height 由 useVirtualizer 命令式写入;\n 模板不再绑定 totalSize,避免尺寸变化引起重渲染。\n -->\n <u-scroll\n tag=\"ul\"\n :class=\"[cls.e('options')]\"\n ref=\"scrollRef\"\n v-if=\"options.length\"\n :content-class=\"[cls.e('options-wrap'), bem.is('virtual', virtualEnabled)]\"\n >\n <template v-if=\"virtualEnabled\">\n <u-multi-select-option\n v-for=\"{ option, index, key, label, offset } of virtualOptions\"\n :option=\"option\"\n :disabled=\"isDisabled(option)\"\n :key=\"key\"\n :style=\"{ transform: `translateY(${offset}px)` }\"\n @check=\"handleCheck(option, $event)\"\n :checked=\"checkedSet.has(option)\"\n :index=\"index\"\n :measure-element=\"measureElement\"\n >\n <slot v-bind=\"{ option, index }\">\n {{ label }}\n </slot>\n </u-multi-select-option>\n </template>\n\n <template v-else>\n <u-multi-select-option\n v-for=\"(option, index) of options\"\n :option=\"option\"\n :disabled=\"isDisabled(option)\"\n :key=\"chainObj(option).get(valueKey)\"\n @check=\"handleCheck(option, $event)\"\n :checked=\"checkedSet.has(option)\"\n >\n <slot v-bind=\"{ option, index }\">\n {{ chainObj(option).get(labelKey) }}\n </slot>\n </u-multi-select-option>\n </template>\n </u-scroll>\n\n <div v-else :class=\"cls.e('empty')\">\n <UEmpty />\n </div>\n </template>\n </u-dropdown>\n\n <div v-else-if=\"model?.length\" :class=\"[cls.m(size), cls.e('readonly-tags')]\">\n <div :class=\"cls.e('tags')\">\n <u-tag v-for=\"option of tags\" :key=\"option[valueKey]\">\n {{ option[labelKey] }}\n </u-tag>\n </div>\n </div>\n\n <template v-else>\n {{ FORM_EMPTY_CONTENT }}\n </template>\n</template>\n\n<script lang=\"ts\" setup>\nimport { o as chainObj } from '@cat-kit/core'\nimport { useFormComponent, useFormFallbackProps, useVirtualizer } from '@veltra/compositions'\nimport { ArrowDown, Close, Search } from '@veltra/icons/normal'\nimport { bem, FORM_EMPTY_CONTENT } from '@veltra/utils'\nimport { computed, shallowRef, shallowReactive, watch, provide } from 'vue'\n\nimport type {\n MultiSelectEmits,\n MultiSelectProps,\n ScrollExposed,\n DropdownExposed\n} from '../../types'\nimport { UCheckbox } from '../checkbox'\nimport { UDropdown } from '../dropdown'\nimport { UEmpty } from '../empty'\nimport { UIcon } from '../icon'\nimport { UInput } from '../input'\nimport { UScroll } from '../scroll'\nimport { useOptions } from '../select/use-options'\nimport { UTag } from '../tag'\nimport { MultiSelectDIKey } from './di'\nimport UMultiSelectOption from './multi-select-option.vue'\n\ndefineOptions({ name: 'MultiSelect' })\n\nconst props = withDefaults(defineProps<MultiSelectProps>(), {\n labelKey: 'label',\n valueKey: 'value',\n placeholder: '请选择',\n clearable: true,\n visibilityLimit: 3,\n disabled: undefined,\n readonly: undefined,\n minWidth: '220px'\n})\n\nconst emit = defineEmits<MultiSelectEmits>()\n\nconst cls = bem('multi-select')\n\nconst { formProps } = useFormComponent()\n\nconst { size, disabled, readonly } = useFormFallbackProps([formProps ?? {}, props], {\n size: 'default',\n disabled: false,\n readonly: false\n})\n\nconst scrollRef = shallowRef<ScrollExposed>()\n\nconst hovered = shallowRef(false)\n\nconst { options: rawOptions, queryString, allOptions: rawAllOptions } = useOptions({ props })\n\nconst createdOptions = shallowRef<Record<string, any>[]>([])\n\nconst options = computed(() => {\n const base = rawOptions.value\n if (!props.creatable || !createdOptions.value.length) return base\n\n const { valueKey } = props\n const createdValues = new Set(createdOptions.value.map((o) => chainObj(o).get(valueKey)))\n const deduped = base.filter((o) => !(o.__isTemp && createdValues.has(chainObj(o).get(valueKey))))\n const dedupedValues = new Set(deduped.map((o) => chainObj(o).get(valueKey)))\n const toAdd = createdOptions.value.filter((o) => !dedupedValues.has(chainObj(o).get(valueKey)))\n return [...toAdd, ...deduped]\n})\n\nconst allOptions = computed(() => {\n if (!props.creatable || !createdOptions.value.length) return rawAllOptions.value\n return [...createdOptions.value, ...rawAllOptions.value]\n})\n\nconst virtualEnabled = computed(() => options.value.length > 80)\n\nconst { virtualizer, items } = useVirtualizer({\n estimateSize: () => 40,\n count: computed(() => options.value.length),\n scrollEl: () => scrollRef.value?.containerRef ?? null,\n contentEl: () => (virtualEnabled.value ? (scrollRef.value?.contentRef ?? null) : null)\n})\n\nconst virtualOptions = computed(() => {\n const { valueKey, labelKey } = props\n const _options = options.value\n return items.value.map((v) => {\n const option = _options[v.index]!\n const val = chainObj(option).get(valueKey)\n return {\n option,\n index: v.index,\n val,\n key: v.index,\n offset: v.start,\n label: chainObj(option).get(labelKey)\n }\n })\n})\n\nconst measureElement: (index: number, el: Element | null) => void = (index, el) =>\n virtualizer.measureElement(index, el)\n\nconst filterable = computed(() => {\n return props.filterable || props.creatable || typeof props.options === 'function'\n})\n\nconst model = defineModel<Array<string | number>>()\n\nconst checkedSet = shallowReactive<Set<Record<string, any>>>(new Set())\nconst allChecked = computed(() => {\n return checkedSet.size === options.value.length\n})\nconst indeterminate = computed(() => {\n return checkedSet.size > 0 && !allChecked.value\n})\n\nconst optionsMap = computed(() => {\n const { valueKey } = props\n return new Map<string | number, Record<string, any>>(\n allOptions.value.map((option) => [option[valueKey], option])\n )\n})\n\nconst dropdownRef = shallowRef<DropdownExposed>()\n\nlet internalChange = false\n\nwatch(\n [model, optionsMap],\n ([model, optionsMap]) => {\n if (internalChange) {\n internalChange = false\n return\n }\n checkedSet.clear()\n if (optionsMap.size && model?.length) {\n model.forEach((v) => {\n const option = optionsMap.get(v)\n option && checkedSet.add(option)\n })\n }\n },\n { immediate: true }\n)\n\nconst emitChange = () => {\n emit('change', Array.from(checkedSet))\n}\n\nconst tags = computed(() => {\n let tags: Record<string, any>[] = []\n let { visibilityLimit } = props\n if (visibilityLimit < 0) {\n visibilityLimit = 0\n }\n\n // 禁用时,显示全部\n if (disabled.value || readonly.value) {\n visibilityLimit = model.value?.length ?? 0\n }\n\n model.value?.slice(0, visibilityLimit).forEach((k) => {\n const option = optionsMap.value.get(k)\n option && tags.push(option)\n })\n\n return tags\n})\n\nconst restTag = computed(() => {\n return (model.value?.length ?? 0) - tags.value.length\n})\n\nconst handleDropdownVisible = (visible: boolean) => {\n if (!visible) {\n queryString.value = ''\n }\n}\n\nconst handleCheck = (option: Record<string, any>, checked: boolean) => {\n const { valueKey, labelKey } = props\n if (checked) {\n if (option.__isTemp && props.creatable) {\n const created: Record<string, any> = {\n [labelKey]: chainObj(option).get(labelKey),\n [valueKey]: chainObj(option).get(valueKey)\n }\n createdOptions.value = [...createdOptions.value, created]\n checkedSet.add(created)\n internalChange = true\n model.value = [...(model.value ?? []), chainObj(created).get(valueKey)]\n queryString.value = ''\n } else if (!checkedSet.has(option)) {\n checkedSet.add(option)\n internalChange = true\n model.value = [...(model.value ?? []), chainObj(option).get(valueKey)]\n }\n } else {\n checkedSet.delete(option)\n const val = chainObj(option).get(valueKey)\n internalChange = true\n model.value = (model.value ?? []).filter((v) => v !== val)\n removeCreatedOption(option)\n }\n\n emitChange()\n dropdownRef.value?.updateDropdown()\n}\n\n/** 全选 */\nconst handleCheckAll = (checked: boolean) => {\n const { valueKey } = props\n if (checked) {\n options.value.forEach((option) => {\n if (!option.__isTemp) checkedSet.add(option)\n })\n internalChange = true\n model.value = Array.from(checkedSet).map((o) => chainObj(o).get(valueKey))\n } else {\n checkedSet.clear()\n internalChange = true\n model.value = []\n if (props.creatable) {\n createdOptions.value = []\n }\n }\n\n emitChange()\n dropdownRef.value?.updateDropdown()\n}\n\n/** 清除选项 */\nconst handleClear = () => {\n checkedSet.clear()\n internalChange = true\n model.value = []\n if (props.creatable) {\n createdOptions.value = []\n }\n emit('change', [])\n}\n\nconst handleClose = (option: Record<string, any>) => {\n checkedSet.delete(option)\n const val = chainObj(option).get(props.valueKey)\n internalChange = true\n model.value = (model.value ?? []).filter((v) => v !== val)\n removeCreatedOption(option)\n emitChange()\n}\n\nconst removeCreatedOption = (option: Record<string, any>) => {\n if (!props.creatable || !createdOptions.value.length) return\n const { valueKey } = props\n const val = chainObj(option).get(valueKey)\n createdOptions.value = createdOptions.value.filter((o) => chainObj(o).get(valueKey) !== val)\n}\n\nconst handleCreateByEnter = () => {\n if (!props.creatable) return\n const qs = queryString.value?.trim()\n if (!qs) return\n\n const { labelKey, valueKey } = props\n\n const existingCreated = createdOptions.value.find((o) => chainObj(o).get(valueKey) === qs)\n if (existingCreated) {\n if (!checkedSet.has(existingCreated)) {\n checkedSet.add(existingCreated)\n internalChange = true\n model.value = [...(model.value ?? []), chainObj(existingCreated).get(valueKey)]\n }\n queryString.value = ''\n emitChange()\n dropdownRef.value?.updateDropdown()\n return\n }\n\n const exactMatch = rawOptions.value.find((o) => !o.__isTemp && chainObj(o).get(labelKey) === qs)\n if (exactMatch) {\n if (!checkedSet.has(exactMatch)) {\n checkedSet.add(exactMatch)\n internalChange = true\n model.value = [...(model.value ?? []), chainObj(exactMatch).get(valueKey)]\n }\n queryString.value = ''\n emitChange()\n dropdownRef.value?.updateDropdown()\n return\n }\n\n const created: Record<string, any> = { [labelKey]: qs, [valueKey]: qs }\n createdOptions.value = [...createdOptions.value, created]\n checkedSet.add(created)\n internalChange = true\n model.value = [...(model.value ?? []), qs]\n queryString.value = ''\n emitChange()\n dropdownRef.value?.updateDropdown()\n}\n\nconst isDisabled = (option: Record<string, any>) => {\n const { max } = props\n return max !== undefined && checkedSet.size >= max && !checkedSet.has(option)\n}\n\nconst optionClass = cls.e('option')\nconst rippleClass = cls.e('ripple')\nconst checkboxClass = cls.e('checkbox')\n\nprovide(MultiSelectDIKey, { optionClass, rippleClass, checkboxClass })\n</script>\n"],"mappings":"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"}
|
|
@@ -29,13 +29,13 @@ declare const __VLS_base: _$vue.DefineComponent<__VLS_PublicProps, {}, {}, {}, {
|
|
|
29
29
|
onChange?: ((options: Record<string, any>[]) => any) | undefined;
|
|
30
30
|
}>, {
|
|
31
31
|
disabled: boolean;
|
|
32
|
+
placeholder: string;
|
|
33
|
+
clearable: boolean;
|
|
32
34
|
readonly: boolean;
|
|
33
35
|
labelKey: string;
|
|
34
36
|
valueKey: string;
|
|
35
|
-
placeholder: string;
|
|
36
|
-
clearable: boolean;
|
|
37
|
-
minWidth: string;
|
|
38
37
|
visibilityLimit: number;
|
|
38
|
+
minWidth: string;
|
|
39
39
|
}, {}, {}, {}, string, _$vue.ComponentProvideOptions, false, {}, any>;
|
|
40
40
|
declare const __VLS_export: __VLS_WithSlots<typeof __VLS_base, __VLS_Slots>;
|
|
41
41
|
declare const _default: typeof __VLS_export;
|
|
@@ -14,24 +14,24 @@ type __VLS_PublicProps = __VLS_Props & __VLS_ModelProps;
|
|
|
14
14
|
declare const __VLS_base: _$vue.DefineComponent<__VLS_PublicProps, {}, {}, {}, {}, _$vue.ComponentOptionsMixin, _$vue.ComponentOptionsMixin, {
|
|
15
15
|
"update:modelValue": (value: (string | number)[]) => any;
|
|
16
16
|
} & {
|
|
17
|
-
"update:modelValue": (value: any[]) => any;
|
|
18
17
|
clear: () => any;
|
|
18
|
+
"update:modelValue": (value: any[]) => any;
|
|
19
19
|
change: (checked: Record<string, any>[]) => any;
|
|
20
20
|
}, string, _$vue.PublicProps, Readonly<__VLS_PublicProps> & Readonly<{
|
|
21
|
-
"onUpdate:modelValue"?: ((value: any[]) => any) | undefined;
|
|
22
21
|
onClear?: (() => any) | undefined;
|
|
22
|
+
"onUpdate:modelValue"?: ((value: any[]) => any) | undefined;
|
|
23
23
|
onChange?: ((checked: Record<string, any>[]) => any) | undefined;
|
|
24
24
|
}>, {
|
|
25
25
|
disabled: boolean;
|
|
26
|
+
placeholder: string;
|
|
27
|
+
clearable: boolean;
|
|
26
28
|
readonly: boolean;
|
|
27
29
|
labelKey: string;
|
|
28
30
|
valueKey: string;
|
|
29
|
-
placeholder: string;
|
|
30
|
-
clearable: boolean;
|
|
31
|
-
minWidth: string;
|
|
32
|
-
expandAll: boolean;
|
|
33
31
|
filterable: boolean;
|
|
34
32
|
visibilityLimit: number;
|
|
33
|
+
minWidth: string;
|
|
34
|
+
expandAll: boolean;
|
|
35
35
|
}, {}, {}, {}, string, _$vue.ComponentProvideOptions, false, {}, any>;
|
|
36
36
|
declare const __VLS_export: __VLS_WithSlots<typeof __VLS_base, __VLS_Slots>;
|
|
37
37
|
declare const _default: typeof __VLS_export;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.js","names":["UNotification"],"sources":["../../../src/components/notification/index.ts"],"sourcesContent":["export { default as UNotification } from './notification.vue'\nimport { zIndex } from '@veltra/utils'\nimport { createVNode, render, type VNode, reactive } from 'vue'\n\nimport type { NotificationProps } from '../../types'\nimport UNotification from './notification.vue'\n\ntype NotificationItem = { vm: VNode }\n\nconst notificationQueue = reactive({\n 'bottom-right': [] as NotificationItem[],\n 'bottom-left': [] as NotificationItem[],\n 'top-right': [] as NotificationItem[],\n 'top-left': [] as NotificationItem[]\n})\n\nconst length = (key: string) => {\n return notificationQueue[key].length\n}\n\nlet count = 1\n\nconst close = (id: string, position: string, userClose?: (vm: VNode) => void) => {\n const index = notificationQueue[position].findIndex(({ vm }) => {\n return id === vm.component!.props.id\n })\n if (index > -1) {\n const { vm } = notificationQueue[position][index]!\n userClose?.(vm)\n let offset = Number(notificationQueue[position][index]!.vm.component!.props.offset)\n notificationQueue[position].splice(index, 1)\n let temp = 0\n for (let i = length(position); i > 0; i--) {\n if (i < index + 1) {\n temp = Number(notificationQueue[position][i - 1]!.vm.component!.props.offset)\n notificationQueue[position][i - 1]!.vm.component!.props.offset = offset\n offset = temp\n }\n }\n }\n if (!notificationQueue[position].length) {\n const wrapper = document.getElementById(`notification-${position}-id`)!\n wrapper.style.removeProperty('height')\n wrapper.style.removeProperty('overflow')\n }\n}\n\nconst createWrapper = (options: NotificationProps) => {\n const position = options.position || 'bottom-right'\n if (document.getElementById(`notification-${position}-id`)) {\n return document.getElementById(`notification-${position}-id`)\n } else {\n const offset = options.offset || 20\n const wrapper = document.createElement('div')\n wrapper.id = `notification-${position}-id`\n Object.assign(\n wrapper.style,\n { position: 'fixed', textAlign: 'center' },\n {\n 'top-right': { top: `${offset}px`, right: `${offset}px` },\n 'top-left': { top: `${offset}px`, left: `${offset}px` },\n 'bottom-left': { bottom: `${offset}px`, left: `${offset}px` },\n 'bottom-right': { bottom: `${offset}px`, right: `${offset}px` }\n }[position]\n )\n wrapper.addEventListener('mouseenter', (e: MouseEvent) => {\n if (length(position)) {\n let innerCount = 0\n let innerOffset = 0\n let width = 0\n let height = 0\n for (let i = length(position); i > 0; i--) {\n notificationQueue[position][i - 1]!.vm.component!.exposed!.clearTimer()\n if (i === length(position)) {\n width = notificationQueue[position][i - 1]!.vm.el?.offsetWidth + 8\n }\n notificationQueue[position][i - 1]!.vm.component!.props.offset = innerOffset\n innerOffset += notificationQueue[position][i - 1]!.vm.el?.offsetHeight / 2 + 5\n if (innerCount < 3) height += notificationQueue[position][i - 1]!.vm.el?.offsetHeight + 10\n innerCount++\n }\n\n Object.assign((e.target as HTMLElement).style, {\n width: `${width}px`,\n height: `${height}px`,\n overflow: 'hidden',\n transition: 'height 0.4s'\n })\n }\n })\n wrapper.addEventListener('mouseleave', (e: MouseEvent) => {\n if (length(position)) {\n let innerOffset = 0\n let innerCount = 0\n let height = 0\n for (let i = length(position); i > 0; i--) {\n notificationQueue[position][i - 1]!.vm.component!.exposed!.startTimer()\n if (i === length(position))\n height = notificationQueue[position][i - 1]!.vm.el?.offsetHeight + 80\n notificationQueue[position][i - 1]!.vm.component!.props.offset = innerOffset\n if (innerCount < 2) innerOffset += 10\n innerCount++\n }\n ;(e.target as HTMLElement).style.transition = 'height 0.45s'\n ;(e.target as HTMLElement).style.height = `${height}px`\n } else {\n ;(e.target as HTMLElement).style.removeProperty('height')\n ;(e.target as HTMLElement).style.removeProperty('overflow')\n }\n })\n document.body.appendChild(wrapper)\n return wrapper\n }\n}\n\nexport const Notification = (options: NotificationProps): void => {\n const position = options.position || 'bottom-right'\n const container = document.createElement('div')\n const id = `notification_${count++}`\n\n if (length(position)) {\n let innerOffset = 0\n let innerCount = 0\n for (let i = length(position); i > 0; i--) {\n if (innerCount < 2) innerOffset += 10\n notificationQueue[position][i - 1]!.vm.component!.props.offset = innerOffset\n innerCount++\n }\n }\n\n const vm = createVNode(UNotification, {\n ...options,\n offset: 0,\n id,\n zIndex: zIndex(),\n onClose: () => {\n close(id, position, options.onClose)\n }\n })\n vm.props!.onDestroy = () => render(null, container)\n render(vm, container)\n notificationQueue[position].push({ vm })\n const wrapper = createWrapper(options)\n wrapper?.appendChild(container.firstElementChild!)\n}\n"],"mappings":"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
|
|
1
|
+
{"version":3,"file":"index.js","names":["UNotification"],"sources":["../../../src/components/notification/index.ts"],"sourcesContent":["export { default as UNotification } from './notification.vue'\nimport { zIndex } from '@veltra/utils'\nimport { createVNode, render, type VNode, reactive } from 'vue'\n\nimport type { NotificationProps } from '../../types'\nimport UNotification from './notification.vue'\n\ntype NotificationItem = { vm: VNode }\n\nconst notificationQueue = reactive({\n 'bottom-right': [] as NotificationItem[],\n 'bottom-left': [] as NotificationItem[],\n 'top-right': [] as NotificationItem[],\n 'top-left': [] as NotificationItem[]\n})\n\nconst length = (key: string) => {\n return notificationQueue[key].length\n}\n\nlet count = 1\n\nconst close = (id: string, position: string, userClose?: (vm: VNode) => void) => {\n const index = notificationQueue[position].findIndex(({ vm }) => {\n return id === vm.component!.props.id\n })\n if (index > -1) {\n const { vm } = notificationQueue[position][index]!\n userClose?.(vm)\n let offset = Number(notificationQueue[position][index]!.vm.component!.props.offset)\n notificationQueue[position].splice(index, 1)\n let temp = 0\n for (let i = length(position); i > 0; i--) {\n if (i < index + 1) {\n temp = Number(notificationQueue[position][i - 1]!.vm.component!.props.offset)\n notificationQueue[position][i - 1]!.vm.component!.props.offset = offset\n offset = temp\n }\n }\n }\n if (!notificationQueue[position].length) {\n const wrapper = document.getElementById(`notification-${position}-id`)!\n wrapper.style.removeProperty('height')\n wrapper.style.removeProperty('overflow')\n }\n}\n\nconst createWrapper = (options: NotificationProps) => {\n const position = options.position || 'bottom-right'\n if (document.getElementById(`notification-${position}-id`)) {\n return document.getElementById(`notification-${position}-id`)\n } else {\n const offset = options.offset || 20\n const wrapper = document.createElement('div')\n wrapper.id = `notification-${position}-id`\n Object.assign(\n wrapper.style,\n { position: 'fixed', textAlign: 'center' },\n {\n 'top-right': { top: `${offset}px`, right: `${offset}px` },\n 'top-left': { top: `${offset}px`, left: `${offset}px` },\n 'bottom-left': { bottom: `${offset}px`, left: `${offset}px` },\n 'bottom-right': { bottom: `${offset}px`, right: `${offset}px` }\n }[position]\n )\n wrapper.addEventListener('mouseenter', (e: MouseEvent) => {\n if (length(position)) {\n let innerCount = 0\n let innerOffset = 0\n let width = 0\n let height = 0\n for (let i = length(position); i > 0; i--) {\n notificationQueue[position][i - 1]!.vm.component!.exposed!.clearTimer()\n if (i === length(position)) {\n width = notificationQueue[position][i - 1]!.vm.el?.offsetWidth + 8\n }\n notificationQueue[position][i - 1]!.vm.component!.props.offset = innerOffset\n innerOffset += notificationQueue[position][i - 1]!.vm.el?.offsetHeight / 2 + 5\n if (innerCount < 3) height += notificationQueue[position][i - 1]!.vm.el?.offsetHeight + 10\n innerCount++\n }\n\n Object.assign((e.target as HTMLElement).style, {\n width: `${width}px`,\n height: `${height}px`,\n overflow: 'hidden',\n transition: 'height 0.4s'\n })\n }\n })\n wrapper.addEventListener('mouseleave', (e: MouseEvent) => {\n if (length(position)) {\n let innerOffset = 0\n let innerCount = 0\n let height = 0\n for (let i = length(position); i > 0; i--) {\n notificationQueue[position][i - 1]!.vm.component!.exposed!.startTimer()\n if (i === length(position))\n height = notificationQueue[position][i - 1]!.vm.el?.offsetHeight + 80\n notificationQueue[position][i - 1]!.vm.component!.props.offset = innerOffset\n if (innerCount < 2) innerOffset += 10\n innerCount++\n }\n ;(e.target as HTMLElement).style.transition = 'height 0.45s'\n ;(e.target as HTMLElement).style.height = `${height}px`\n } else {\n ;(e.target as HTMLElement).style.removeProperty('height')\n ;(e.target as HTMLElement).style.removeProperty('overflow')\n }\n })\n document.body.appendChild(wrapper)\n return wrapper\n }\n}\n\nexport const Notification = (options: NotificationProps): void => {\n const position = options.position || 'bottom-right'\n const container = document.createElement('div')\n const id = `notification_${count++}`\n\n if (length(position)) {\n let innerOffset = 0\n let innerCount = 0\n for (let i = length(position); i > 0; i--) {\n if (innerCount < 2) innerOffset += 10\n notificationQueue[position][i - 1]!.vm.component!.props.offset = innerOffset\n innerCount++\n }\n }\n\n const vm = createVNode(UNotification, {\n ...options,\n offset: 0,\n id,\n zIndex: zIndex(),\n onClose: () => {\n close(id, position, options.onClose)\n }\n })\n vm.props!.onDestroy = () => render(null, container)\n render(vm, container)\n notificationQueue[position].push({ vm })\n const wrapper = createWrapper(options)\n wrapper?.appendChild(container.firstElementChild!)\n}\n"],"mappings":"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"}
|
|
@@ -4,8 +4,8 @@ import * as _$_veltra_utils0 from "@veltra/utils";
|
|
|
4
4
|
|
|
5
5
|
//#region src/components/notification/notification.vue.d.ts
|
|
6
6
|
declare const __VLS_export: _$vue.DefineComponent<NotificationProps, _$_veltra_utils0.DeconstructValue<_NotificationExposed>, {}, {}, {}, _$vue.ComponentOptionsMixin, _$vue.ComponentOptionsMixin, {}, string, _$vue.PublicProps, Readonly<NotificationProps> & Readonly<{}>, {
|
|
7
|
-
duration: number;
|
|
8
7
|
closable: boolean;
|
|
8
|
+
duration: number;
|
|
9
9
|
offset: number;
|
|
10
10
|
buttonText: string;
|
|
11
11
|
position: "top-left" | "top-right" | "bottom-left" | "bottom-right";
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"number-input.js","names":[],"sources":["../../../src/components/number-input/number-input.vue"],"sourcesContent":["<template>\n <u-input\n v-if=\"!readonly\"\n ref=\"inputRef\"\n :class=\"className\"\n :model-value=\"displayed\"\n v-bind=\"inputProps\"\n @update:model-value=\"handleUpdateModelValue\"\n @change=\"handleChange\"\n @keydown.stop=\"handleKeydown\"\n @focus=\"handleFocus\"\n @blur=\"handleBlur\"\n :size=\"size\"\n :readonly=\"readonly\"\n :disabled=\"disabled\"\n >\n <template #suffix v-if=\"step !== undefined && step !== false\">\n <slot name=\"suffix\" />\n <div :class=\"cls.e('step')\">\n <u-icon\n @click=\"increase\"\n v-ripple=\"!disabled && increasable\"\n :class=\"bem.is('disabled', disabled || !increasable)\"\n >\n <ArrowUp />\n </u-icon>\n <u-icon\n @click=\"decrease\"\n v-ripple=\"!disabled && reducible\"\n :class=\"bem.is('disabled', disabled || !reducible)\"\n >\n <ArrowDown />\n </u-icon>\n </div>\n </template>\n\n <template #prefix v-if=\"slots.prefix\">\n <slot name=\"prefix\" />\n </template>\n </u-input>\n\n <template v-else>\n {{ generateDisplayed || FORM_EMPTY_CONTENT }}\n </template>\n</template>\n\n<script lang=\"ts\" setup>\nimport { $n, n, o, isUndef } from '@cat-kit/core'\nimport { useFormComponent, useFormFallbackProps } from '@veltra/compositions'\nimport { vRipple } from '@veltra/directives'\nimport { ArrowDown, ArrowUp } from '@veltra/icons/normal'\nimport { bem, FORM_EMPTY_CONTENT, Tween } from '@veltra/utils'\nimport { computed, shallowRef, watch } from 'vue'\n\nimport type { NumberInputEmits, NumberInputProps, InputExposed } from '../../types'\nimport { UIcon } from '../icon'\nimport { UInput } from '../input'\n\ndefineOptions({\n name: 'NumberInput'\n})\n\nconst props = withDefaults(defineProps<NumberInputProps>(), {\n placeholder: '请输入',\n clearable: true,\n disabled: undefined,\n readonly: undefined\n})\nconst emit = defineEmits<NumberInputEmits>()\n\nconst slots = defineSlots<{\n prefix?: () => any\n suffix?: () => any\n}>()\n\nconst { formProps } = useFormComponent()\n\nconst { size, disabled, readonly } = useFormFallbackProps([formProps ?? {}, props], {\n size: 'default',\n disabled: false,\n readonly: false\n})\n\nconst inputProps = computed(() => {\n return o(props).pick(['clearable', 'disabled', 'placeholder', 'size', 'prefix', 'suffix'])\n})\n\nconst inputRef = shallowRef<InputExposed>()\n\nconst inputDom = computed(() => inputRef.value?.el)\n\nconst cls = bem('number-input')\n\nconst className = computed(() => {\n return [cls.b, cls.m(size.value)]\n})\n\n/** 实际值 */\nconst model = defineModel<NumberInputProps['modelValue']>()\n\n// 展示值\nconst displayed = shallowRef('')\n\nconst focused = shallowRef(false)\n\nconst generateDisplayed = computed(() => {\n if (!displayed.value) return ''\n\n return `${props.prefix ?? ''}${displayed.value}${props.suffix ?? ''}`\n})\n\n/** 步长 */\nconst stepVal = computed<number>(() => {\n const { step } = props\n if (step === undefined) return 1\n return typeof step === 'boolean' ? 1 : step\n})\n\n/** 是否可增 */\nconst increasable = computed(() => {\n const { max, multiple } = props\n if (isUndef(max) || isUndef(model.value)) return true\n // 如果存在倍数,先将 model.value 除以倍数得到原始值再比较\n const rawValue = multiple ? $n.div(model.value, multiple) : model.value\n return rawValue < max\n})\n\n/** 是否可减 */\nconst reducible = computed(() => {\n const { min, multiple } = props\n if (isUndef(min) || isUndef(model.value)) return true\n // 如果存在倍数,先将 model.value 除以倍数得到原始值再比较\n const rawValue = multiple ? $n.div(model.value, multiple) : model.value\n return rawValue > min\n})\n\n// 通过值和步长值计算默认的最大精度\nconst defaultMaxPrecision = computed(() => {\n const { multiple } = props\n // 如果存在倍数,基于原始值计算精度\n const rawValue =\n multiple && model.value !== undefined ? $n.div(model.value, multiple) : model.value\n return Math.max(\n String(rawValue).split('.')[1]?.length ?? 0,\n String(stepVal.value).split('.')[1]?.length ?? 0\n )\n})\n\n/**\n * 获取展示值\n * @param num 实际值\n */\nfunction getDisplayed(num?: number): string {\n if (!num && num !== 0) return ''\n\n const {\n currency,\n precision,\n minPrecision,\n // 如果没有指定最大精度那么设置默认为值和步长值中的较大值\n maxPrecision = defaultMaxPrecision.value,\n multiple\n } = props\n\n // 如果存在倍数,先将实际值除以倍数得到原始值\n const displayValue = multiple ? $n.div(num, multiple) : num\n\n return currency\n ? n(displayValue).currency('CNY', {\n precision,\n minPrecision,\n maxPrecision\n })\n : n(displayValue).fixed(\n precision ?? {\n minPrecision,\n maxPrecision\n }\n )\n}\n\nwatch(\n [model, focused, () => props.currency],\n ([model, focused]) => {\n if (focused) return\n displayed.value = getDisplayed(model)\n },\n { immediate: true }\n)\n\n/**\n * 解析展示值\n * @param str 展示值\n */\nfunction parseDisplayed(str: string): number | undefined {\n if (!str) return undefined\n\n // 将货币格式去掉再转化为数字\n const number = +str.replace(/,/g, '')\n const { multiple } = props\n\n // 如果解析失败,使用当前值作为回退\n // 如果存在倍数,需要先将 model.value 除以倍数得到原始值\n let result: number | undefined\n if (isNaN(number)) {\n if (model.value === undefined) return undefined\n result = multiple ? $n.div(model.value, multiple) : model.value\n } else {\n result = number\n }\n\n if (result === undefined) return undefined\n\n const { precision, maxPrecision, minPrecision } = props\n\n const fixedResult = +n(result).fixed(\n precision ?? {\n minPrecision,\n maxPrecision\n }\n )\n\n // 如果存在倍数,将原始值乘以倍数返回实际值\n return multiple ? $n.mul(fixedResult, multiple) : fixedResult\n}\n\n/**\n * 获取有效值\n * @param val 值\n */\nfunction getValidValue<T extends undefined | number>(val: T): T {\n if (val === undefined) return val\n const { min, max, multiple } = props\n\n // 如果存在倍数,先将值除以倍数得到原始值进行验证,验证后再乘以倍数\n if (multiple) {\n const rawVal = $n.div(val, multiple)\n let validRawVal = rawVal\n if (min !== undefined && rawVal < min) validRawVal = min\n if (max !== undefined && rawVal > max) validRawVal = max\n return $n.mul(validRawVal, multiple) as T\n }\n\n if (min !== undefined && val < min) return min as T\n if (max !== undefined && val > max) return max as T\n return val\n}\n\nfunction handleUpdateModelValue(input: string): void {\n const newVal = parseDisplayed(input)\n model.value = getValidValue(newVal) ?? 0\n displayed.value = input\n}\n\n/**\n * 处理输入值变化的函数, 该函数仅在输入框失去焦点时触发,\n * 主要用于在输入非数字的情况下的修正处理\n * @param input 输入的值\n */\nfunction handleChange() {\n emit('change', model.value)\n}\n\nconst tween = new Tween(\n { n: model.value ?? 0 },\n {\n onUpdate(state) {\n const _rawInput = inputDom.value\n if (!_rawInput) return\n const { multiple } = props\n // 如果存在倍数,tween.state.n 存储的是原始值,需要乘以倍数后传给 getDisplayed\n const actualValue = multiple ? $n.mul(state.n, multiple) : state.n\n _rawInput.value = getDisplayed(actualValue)\n },\n // 动画进行的过程值有可能被改变, 因此在onComplete中确保还原的是原本的值\n onComplete() {\n const _rawInput = inputDom.value\n if (!_rawInput) return\n _rawInput.value = getDisplayed(model.value)\n }\n }\n)\n\n/** 增 */\nfunction increase(): void {\n if (disabled.value) return\n const { multiple } = props\n const val = model.value ?? 0\n\n if (multiple) {\n // 如果存在倍数,先将实际值除以倍数得到原始值\n const rawVal = $n.div(val, multiple)\n // 在原始值基础上加步长\n const newRawVal = $n.plus(rawVal, stepVal.value)\n // 乘以倍数得到新的实际值\n const newVal = $n.mul(newRawVal, multiple)\n const target = getValidValue(newVal)\n model.value = target\n // tween 动画在原始值上进行\n tween.state.n = $n.div(target, multiple)\n tween.to({ n: $n.div(target, multiple) })\n } else {\n tween.state.n = val\n const target = getValidValue($n.plus(val, stepVal.value))\n model.value = target\n tween.to({ n: target })\n }\n}\n\n/** 减 */\nfunction decrease(): void {\n if (disabled.value) return\n const { multiple } = props\n const val = model.value ?? 0\n\n if (multiple) {\n // 如果存在倍数,先将实际值除以倍数得到原始值\n const rawVal = $n.div(val, multiple)\n // 在原始值基础上减步长\n const newRawVal = $n.minus(rawVal, stepVal.value)\n // 乘以倍数得到新的实际值\n const newVal = $n.mul(newRawVal, multiple)\n const target = getValidValue(newVal)\n model.value = target\n // tween 动画在原始值上进行\n tween.state.n = $n.div(target, multiple)\n tween.to({ n: $n.div(target, multiple) })\n } else {\n tween.state.n = val\n const target = getValidValue($n.minus(val, stepVal.value))\n model.value = target\n tween.to({ n: target })\n }\n}\n\nfunction handleKeydown(e: KeyboardEvent): void {\n if (!props.step) return\n if (e.key === 'ArrowUp') {\n e.preventDefault()\n return increase()\n }\n if (e.key === 'ArrowDown') {\n e.preventDefault()\n return decrease()\n }\n}\n\nfunction handleFocus(): void {\n focused.value = true\n\n // 如果初始值和当前设置的精度不匹配则进行精度修正\n if (model.value === undefined) return\n const { precision, maxPrecision, minPrecision, multiple } = props\n\n if (multiple) {\n // 如果存在倍数,先除以倍数得到原始值进行精度修正,再乘以倍数\n const rawVal = $n.div(model.value, multiple)\n const fixedRawVal = +n(rawVal).fixed(\n precision ?? {\n maxPrecision,\n minPrecision\n }\n )\n model.value = $n.mul(fixedRawVal, multiple)\n } else {\n model.value = +n(model.value).fixed(\n precision ?? {\n maxPrecision,\n minPrecision\n }\n )\n }\n}\n\nfunction handleBlur(): void {\n focused.value = false\n model.value = props.modelValue\n}\n</script>\n"],"mappings":"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"}
|
|
1
|
+
{"version":3,"file":"number-input.js","names":[],"sources":["../../../src/components/number-input/number-input.vue"],"sourcesContent":["<template>\n <u-input\n v-if=\"!readonly\"\n ref=\"inputRef\"\n :class=\"className\"\n :model-value=\"displayed\"\n v-bind=\"inputProps\"\n @update:model-value=\"handleUpdateModelValue\"\n @change=\"handleChange\"\n @keydown.stop=\"handleKeydown\"\n @focus=\"handleFocus\"\n @blur=\"handleBlur\"\n :size=\"size\"\n :readonly=\"readonly\"\n :disabled=\"disabled\"\n >\n <template #suffix v-if=\"step !== undefined && step !== false\">\n <slot name=\"suffix\" />\n <div :class=\"cls.e('step')\">\n <u-icon\n @click=\"increase\"\n v-ripple=\"!disabled && increasable\"\n :class=\"bem.is('disabled', disabled || !increasable)\"\n >\n <ArrowUp />\n </u-icon>\n <u-icon\n @click=\"decrease\"\n v-ripple=\"!disabled && reducible\"\n :class=\"bem.is('disabled', disabled || !reducible)\"\n >\n <ArrowDown />\n </u-icon>\n </div>\n </template>\n\n <template #prefix v-if=\"slots.prefix\">\n <slot name=\"prefix\" />\n </template>\n </u-input>\n\n <template v-else>\n {{ generateDisplayed || FORM_EMPTY_CONTENT }}\n </template>\n</template>\n\n<script lang=\"ts\" setup>\nimport { $n, n, o, isUndef } from '@cat-kit/core'\nimport { useFormComponent, useFormFallbackProps } from '@veltra/compositions'\nimport { vRipple } from '@veltra/directives'\nimport { ArrowDown, ArrowUp } from '@veltra/icons/normal'\nimport { bem, FORM_EMPTY_CONTENT, Tween } from '@veltra/utils'\nimport { computed, shallowRef, watch } from 'vue'\n\nimport type { NumberInputEmits, NumberInputProps, InputExposed } from '../../types'\nimport { UIcon } from '../icon'\nimport { UInput } from '../input'\n\ndefineOptions({\n name: 'NumberInput'\n})\n\nconst props = withDefaults(defineProps<NumberInputProps>(), {\n placeholder: '请输入',\n clearable: true,\n disabled: undefined,\n readonly: undefined\n})\nconst emit = defineEmits<NumberInputEmits>()\n\nconst slots = defineSlots<{\n prefix?: () => any\n suffix?: () => any\n}>()\n\nconst { formProps } = useFormComponent()\n\nconst { size, disabled, readonly } = useFormFallbackProps([formProps ?? {}, props], {\n size: 'default',\n disabled: false,\n readonly: false\n})\n\nconst inputProps = computed(() => {\n return o(props).pick(['clearable', 'disabled', 'placeholder', 'size', 'prefix', 'suffix'])\n})\n\nconst inputRef = shallowRef<InputExposed>()\n\nconst inputDom = computed(() => inputRef.value?.el)\n\nconst cls = bem('number-input')\n\nconst className = computed(() => {\n return [cls.b, cls.m(size.value)]\n})\n\n/** 实际值 */\nconst model = defineModel<NumberInputProps['modelValue']>()\n\n// 展示值\nconst displayed = shallowRef('')\n\nconst focused = shallowRef(false)\n\nconst generateDisplayed = computed(() => {\n if (!displayed.value) return ''\n\n return `${props.prefix ?? ''}${displayed.value}${props.suffix ?? ''}`\n})\n\n/** 步长 */\nconst stepVal = computed<number>(() => {\n const { step } = props\n if (step === undefined) return 1\n return typeof step === 'boolean' ? 1 : step\n})\n\n/** 是否可增 */\nconst increasable = computed(() => {\n const { max, multiple } = props\n if (isUndef(max) || isUndef(model.value)) return true\n // 如果存在倍数,先将 model.value 除以倍数得到原始值再比较\n const rawValue = multiple ? $n.div(model.value, multiple) : model.value\n return rawValue < max\n})\n\n/** 是否可减 */\nconst reducible = computed(() => {\n const { min, multiple } = props\n if (isUndef(min) || isUndef(model.value)) return true\n // 如果存在倍数,先将 model.value 除以倍数得到原始值再比较\n const rawValue = multiple ? $n.div(model.value, multiple) : model.value\n return rawValue > min\n})\n\n// 通过值和步长值计算默认的最大精度\nconst defaultMaxPrecision = computed(() => {\n const { multiple } = props\n // 如果存在倍数,基于原始值计算精度\n const rawValue =\n multiple && model.value !== undefined ? $n.div(model.value, multiple) : model.value\n return Math.max(\n String(rawValue).split('.')[1]?.length ?? 0,\n String(stepVal.value).split('.')[1]?.length ?? 0\n )\n})\n\n/**\n * 获取展示值\n * @param num 实际值\n */\nfunction getDisplayed(num?: number): string {\n if (!num && num !== 0) return ''\n\n const {\n currency,\n precision,\n minPrecision,\n // 如果没有指定最大精度那么设置默认为值和步长值中的较大值\n maxPrecision = defaultMaxPrecision.value,\n multiple\n } = props\n\n // 如果存在倍数,先将实际值除以倍数得到原始值\n const displayValue = multiple ? $n.div(num, multiple) : num\n\n return currency\n ? n(displayValue).currency('CNY', {\n precision,\n minPrecision,\n maxPrecision\n })\n : n(displayValue).fixed(\n precision ?? {\n minPrecision,\n maxPrecision\n }\n )\n}\n\nwatch(\n [model, focused, () => props.currency],\n ([model, focused]) => {\n if (focused) return\n displayed.value = getDisplayed(model)\n },\n { immediate: true }\n)\n\n/**\n * 解析展示值\n * @param str 展示值\n */\nfunction parseDisplayed(str: string): number | undefined {\n if (!str) return undefined\n\n // 将货币格式去掉再转化为数字\n const number = +str.replace(/,/g, '')\n const { multiple } = props\n\n // 如果解析失败,使用当前值作为回退\n // 如果存在倍数,需要先将 model.value 除以倍数得到原始值\n let result: number | undefined\n if (isNaN(number)) {\n if (model.value === undefined) return undefined\n result = multiple ? $n.div(model.value, multiple) : model.value\n } else {\n result = number\n }\n\n if (result === undefined) return undefined\n\n const { precision, maxPrecision, minPrecision } = props\n\n const fixedResult = +n(result).fixed(\n precision ?? {\n minPrecision,\n maxPrecision\n }\n )\n\n // 如果存在倍数,将原始值乘以倍数返回实际值\n return multiple ? $n.mul(fixedResult, multiple) : fixedResult\n}\n\n/**\n * 获取有效值\n * @param val 值\n */\nfunction getValidValue<T extends undefined | number>(val: T): T {\n if (val === undefined) return val\n const { min, max, multiple } = props\n\n // 如果存在倍数,先将值除以倍数得到原始值进行验证,验证后再乘以倍数\n if (multiple) {\n const rawVal = $n.div(val, multiple)\n let validRawVal = rawVal\n if (min !== undefined && rawVal < min) validRawVal = min\n if (max !== undefined && rawVal > max) validRawVal = max\n return $n.mul(validRawVal, multiple) as T\n }\n\n if (min !== undefined && val < min) return min as T\n if (max !== undefined && val > max) return max as T\n return val\n}\n\nfunction handleUpdateModelValue(input: string): void {\n const newVal = parseDisplayed(input)\n model.value = getValidValue(newVal) ?? 0\n displayed.value = input\n}\n\n/**\n * 处理输入值变化的函数, 该函数仅在输入框失去焦点时触发,\n * 主要用于在输入非数字的情况下的修正处理\n * @param input 输入的值\n */\nfunction handleChange() {\n emit('change', model.value)\n}\n\nconst tween = new Tween(\n { n: model.value ?? 0 },\n {\n onUpdate(state) {\n const _rawInput = inputDom.value\n if (!_rawInput) return\n const { multiple } = props\n // 如果存在倍数,tween.state.n 存储的是原始值,需要乘以倍数后传给 getDisplayed\n const actualValue = multiple ? $n.mul(state.n, multiple) : state.n\n _rawInput.value = getDisplayed(actualValue)\n },\n // 动画进行的过程值有可能被改变, 因此在onComplete中确保还原的是原本的值\n onComplete() {\n const _rawInput = inputDom.value\n if (!_rawInput) return\n _rawInput.value = getDisplayed(model.value)\n }\n }\n)\n\n/** 增 */\nfunction increase(): void {\n if (disabled.value) return\n const { multiple } = props\n const val = model.value ?? 0\n\n if (multiple) {\n // 如果存在倍数,先将实际值除以倍数得到原始值\n const rawVal = $n.div(val, multiple)\n // 在原始值基础上加步长\n const newRawVal = $n.plus(rawVal, stepVal.value)\n // 乘以倍数得到新的实际值\n const newVal = $n.mul(newRawVal, multiple)\n const target = getValidValue(newVal)\n model.value = target\n // tween 动画在原始值上进行\n tween.state.n = $n.div(target, multiple)\n tween.to({ n: $n.div(target, multiple) })\n } else {\n tween.state.n = val\n const target = getValidValue($n.plus(val, stepVal.value))\n model.value = target\n tween.to({ n: target })\n }\n}\n\n/** 减 */\nfunction decrease(): void {\n if (disabled.value) return\n const { multiple } = props\n const val = model.value ?? 0\n\n if (multiple) {\n // 如果存在倍数,先将实际值除以倍数得到原始值\n const rawVal = $n.div(val, multiple)\n // 在原始值基础上减步长\n const newRawVal = $n.minus(rawVal, stepVal.value)\n // 乘以倍数得到新的实际值\n const newVal = $n.mul(newRawVal, multiple)\n const target = getValidValue(newVal)\n model.value = target\n // tween 动画在原始值上进行\n tween.state.n = $n.div(target, multiple)\n tween.to({ n: $n.div(target, multiple) })\n } else {\n tween.state.n = val\n const target = getValidValue($n.minus(val, stepVal.value))\n model.value = target\n tween.to({ n: target })\n }\n}\n\nfunction handleKeydown(e: KeyboardEvent): void {\n if (!props.step) return\n if (e.key === 'ArrowUp') {\n e.preventDefault()\n return increase()\n }\n if (e.key === 'ArrowDown') {\n e.preventDefault()\n return decrease()\n }\n}\n\nfunction handleFocus(): void {\n focused.value = true\n\n // 如果初始值和当前设置的精度不匹配则进行精度修正\n if (model.value === undefined) return\n const { precision, maxPrecision, minPrecision, multiple } = props\n\n if (multiple) {\n // 如果存在倍数,先除以倍数得到原始值进行精度修正,再乘以倍数\n const rawVal = $n.div(model.value, multiple)\n const fixedRawVal = +n(rawVal).fixed(\n precision ?? {\n maxPrecision,\n minPrecision\n }\n )\n model.value = $n.mul(fixedRawVal, multiple)\n } else {\n model.value = +n(model.value).fixed(\n precision ?? {\n maxPrecision,\n minPrecision\n }\n )\n }\n}\n\nfunction handleBlur(): void {\n focused.value = false\n model.value = props.modelValue\n}\n</script>\n"],"mappings":"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"}
|
|
@@ -21,9 +21,9 @@ declare const __VLS_base: _$vue.DefineComponent<__VLS_PublicProps, {}, {}, {}, {
|
|
|
21
21
|
onChange?: ((value?: number | undefined) => any) | undefined;
|
|
22
22
|
}>, {
|
|
23
23
|
disabled: boolean;
|
|
24
|
-
readonly: boolean;
|
|
25
24
|
placeholder: string;
|
|
26
25
|
clearable: boolean;
|
|
26
|
+
readonly: boolean;
|
|
27
27
|
}, {}, {}, {}, string, _$vue.ComponentProvideOptions, false, {}, any>;
|
|
28
28
|
declare const __VLS_export: __VLS_WithSlots<typeof __VLS_base, __VLS_Slots>;
|
|
29
29
|
declare const _default: typeof __VLS_export;
|
|
@@ -24,10 +24,10 @@ declare const __VLS_export: _$vue.DefineComponent<__VLS_PublicProps, {}, {}, {},
|
|
|
24
24
|
"onUpdate:start"?: ((value: number | undefined) => any) | undefined;
|
|
25
25
|
"onUpdate:end"?: ((value: number | undefined) => any) | undefined;
|
|
26
26
|
}>, {
|
|
27
|
-
separator: string;
|
|
28
27
|
disabled: boolean;
|
|
29
|
-
readonly: boolean;
|
|
30
28
|
clearable: boolean;
|
|
29
|
+
readonly: boolean;
|
|
30
|
+
separator: string;
|
|
31
31
|
startPlaceholder: string;
|
|
32
32
|
endPlaceholder: string;
|
|
33
33
|
}, {}, {}, {}, string, _$vue.ComponentProvideOptions, false, {}, any>;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"color-transform.js","names":[],"sources":["../../../src/components/palette/color-transform.ts"],"sourcesContent":["import type { PaletteRGB, PaletteHSV } from '../../types'\n\n/**\n * 将色相值转换为 RGB 颜色\n * @param h 色相值\n * @returns RGB 颜色\n */\nexport function HUE2RGB(h: number): PaletteRGB {\n // 将色相值映射到0-5的范围\n const segment = h / 60\n const x = 1 - Math.abs((segment % 2) - 1) // 计算中间值\n let r = 0,\n g = 0,\n b = 0\n // 根据色相所在的区间计算RGB值\n if (segment >= 0 && segment < 1) {\n ;[r, g, b] = [1, x, 0]\n } else if (segment < 2) {\n ;[r, g, b] = [x, 1, 0]\n } else if (segment < 3) {\n ;[r, g, b] = [0, 1, x]\n } else if (segment < 4) {\n ;[r, g, b] = [0, x, 1]\n } else if (segment < 5) {\n ;[r, g, b] = [x, 0, 1]\n } else {\n ;[r, g, b] = [1, 0, x]\n }\n // 将RGB值从0-1范围映射到0-255范围\n return { r: Math.round(r * 255), g: Math.round(g * 255), b: Math.round(b * 255) }\n}\n\n/**\n * 将色调、饱和度和亮度转换为 RGB 颜色\n * @param hsv 色调、饱和度和亮度\n */\nexport function HSV2RGB(hsv: PaletteHSV): PaletteRGB {\n const { h, s, v } = hsv\n\n // 使用色相区间映射获取基础RGB值\n const { r, g, b } = HUE2RGB(h)\n\n // 应用饱和度和亮度\n const saturationFactor = 1 - s\n const valueFactor = v\n\n return {\n r: Math.round((r + (255 - r) * saturationFactor) * valueFactor),\n g: Math.round((g + (255 - g) * saturationFactor) * valueFactor),\n b: Math.round((b + (255 - b) * saturationFactor) * valueFactor)\n }\n}\n\n/**\n * 将 RGB 颜色转换为 HEX 颜色\n * @param RGB RGB 颜色\n * @param alpha 透明度\n * @returns HEX 颜色\n */\nexport function RGB2HEX(RGB: PaletteRGB, alpha = 1): string {\n let hexStr = ['r', 'g', 'b']\n .map((key) => RGB[key].toString(16).padStart(2, '0'))\n .join('')\n .toUpperCase()\n\n if (alpha < 1) {\n hexStr += Math.round(alpha * 255)\n .toString(16)\n .padStart(2, '0')\n .toUpperCase()\n }\n\n return hexStr\n}\n\n/**\n * 将 RGB 颜色转换为 HSV 颜色\n * @param RGB RGB 颜色\n * @returns HSV 颜色\n */\nexport function RGB2HSV(RGB: PaletteRGB): PaletteHSV {\n // 归一化到0-1范围\n const red = RGB.r / 255\n const green = RGB.g / 255\n const blue = RGB.b / 255\n const max = Math.max(red, green, blue)\n const min = Math.min(red, green, blue)\n const delta = max - min\n let h = 0\n if (delta !== 0) {\n if (max === red) {\n h = ((green - blue) / delta) % 6\n } else if (max === green) {\n h = (blue - red) / delta + 2\n } else {\n h = (red - green) / delta + 4\n }\n h = (h * 60 + 360) % 360 // 确保正值\n }\n const s = max === 0 ? 0 : delta / max\n const v = max\n return { h, s, v }\n}\n\n/**\n * 将 HEX 颜色转换为 RGB 颜色\n * @param hex HEX 颜色\n * @returns RGB 颜色\n */\nexport function HEX2RGBA(hex: string): { RGB: PaletteRGB; alpha: number } {\n const rgb = { r: 0, g: 0, b: 0 }\n let alpha = 1\n\n if (hex.startsWith('#')) {\n hex = hex.slice(1)\n }\n\n if (hex.length === 3 || hex.length === 4) {\n hex = hex\n .split('')\n .map((char) => char + char)\n .join('')\n }\n\n const alphaStr = hex.slice(6)\n if (alphaStr) {\n alpha = parseInt(alphaStr, 16) / 255\n }\n rgb.r = parseInt(hex.slice(0, 2), 16)\n rgb.g = parseInt(hex.slice(2, 4), 16)\n rgb.b = parseInt(hex.slice(4, 6), 16)\n\n return { RGB: rgb, alpha }\n}\n"],"mappings":";;;;;;AAOA,SAAgB,QAAQ,GAAuB;CAE7C,MAAM,UAAU,IAAI;CACpB,MAAM,IAAI,IAAI,KAAK,IAAK,UAAU,IAAK,EAAE;CACzC,IAAI,IAAI,GACN,IAAI,GACJ,IAAI;AAEN,KAAI,WAAW,KAAK,UAAU,EAC3B,EAAC,GAAG,GAAG,KAAK;EAAC;EAAG;EAAG;EAAE;UACb,UAAU,EAClB,EAAC,GAAG,GAAG,KAAK;EAAC;EAAG;EAAG;EAAE;UACb,UAAU,EAClB,EAAC,GAAG,GAAG,KAAK;EAAC;EAAG;EAAG;EAAE;UACb,UAAU,EAClB,EAAC,GAAG,GAAG,KAAK;EAAC;EAAG;EAAG;EAAE;UACb,UAAU,EAClB,EAAC,GAAG,GAAG,KAAK;EAAC;EAAG;EAAG;EAAE;KAErB,EAAC,GAAG,GAAG,KAAK;EAAC;EAAG;EAAG;EAAE;AAGxB,QAAO;EAAE,GAAG,KAAK,MAAM,IAAI,IAAI;EAAE,GAAG,KAAK,MAAM,IAAI,IAAI;EAAE,GAAG,KAAK,MAAM,IAAI,IAAI;EAAE;;;;;;AAOnF,SAAgB,QAAQ,KAA6B;CACnD,MAAM,EAAE,GAAG,GAAG,MAAM;CAGpB,MAAM,EAAE,GAAG,GAAG,MAAM,QAAQ,EAAE;CAG9B,MAAM,mBAAmB,IAAI;CAC7B,MAAM,cAAc;AAEpB,QAAO;EACL,GAAG,KAAK,OAAO,KAAK,MAAM,KAAK,oBAAoB,YAAY;EAC/D,GAAG,KAAK,OAAO,KAAK,MAAM,KAAK,oBAAoB,YAAY;EAC/D,GAAG,KAAK,OAAO,KAAK,MAAM,KAAK,oBAAoB,YAAY;EAChE;;;;;;;;AASH,SAAgB,QAAQ,KAAiB,QAAQ,GAAW;CAC1D,IAAI,SAAS;EAAC;EAAK;EAAK;EAAI,CACzB,KAAK,QAAQ,IAAI,KAAK,SAAS,GAAG,CAAC,SAAS,GAAG,IAAI,CAAC,CACpD,KAAK,GAAG,CACR,aAAa;AAEhB,KAAI,QAAQ,EACV,WAAU,KAAK,MAAM,QAAQ,IAAI,CAC9B,SAAS,GAAG,CACZ,SAAS,GAAG,IAAI,CAChB,aAAa;AAGlB,QAAO;;;;;;;AAQT,SAAgB,QAAQ,KAA6B;CAEnD,MAAM,MAAM,IAAI,IAAI;CACpB,MAAM,QAAQ,IAAI,IAAI;CACtB,MAAM,OAAO,IAAI,IAAI;CACrB,MAAM,MAAM,KAAK,IAAI,KAAK,OAAO,KAAK;CAEtC,MAAM,QAAQ,MADF,KAAK,IAAI,KAAK,OAAO,
|
|
1
|
+
{"version":3,"file":"color-transform.js","names":[],"sources":["../../../src/components/palette/color-transform.ts"],"sourcesContent":["import type { PaletteRGB, PaletteHSV } from '../../types'\n\n/**\n * 将色相值转换为 RGB 颜色\n * @param h 色相值\n * @returns RGB 颜色\n */\nexport function HUE2RGB(h: number): PaletteRGB {\n // 将色相值映射到0-5的范围\n const segment = h / 60\n const x = 1 - Math.abs((segment % 2) - 1) // 计算中间值\n let r = 0,\n g = 0,\n b = 0\n // 根据色相所在的区间计算RGB值\n if (segment >= 0 && segment < 1) {\n ;[r, g, b] = [1, x, 0]\n } else if (segment < 2) {\n ;[r, g, b] = [x, 1, 0]\n } else if (segment < 3) {\n ;[r, g, b] = [0, 1, x]\n } else if (segment < 4) {\n ;[r, g, b] = [0, x, 1]\n } else if (segment < 5) {\n ;[r, g, b] = [x, 0, 1]\n } else {\n ;[r, g, b] = [1, 0, x]\n }\n // 将RGB值从0-1范围映射到0-255范围\n return { r: Math.round(r * 255), g: Math.round(g * 255), b: Math.round(b * 255) }\n}\n\n/**\n * 将色调、饱和度和亮度转换为 RGB 颜色\n * @param hsv 色调、饱和度和亮度\n */\nexport function HSV2RGB(hsv: PaletteHSV): PaletteRGB {\n const { h, s, v } = hsv\n\n // 使用色相区间映射获取基础RGB值\n const { r, g, b } = HUE2RGB(h)\n\n // 应用饱和度和亮度\n const saturationFactor = 1 - s\n const valueFactor = v\n\n return {\n r: Math.round((r + (255 - r) * saturationFactor) * valueFactor),\n g: Math.round((g + (255 - g) * saturationFactor) * valueFactor),\n b: Math.round((b + (255 - b) * saturationFactor) * valueFactor)\n }\n}\n\n/**\n * 将 RGB 颜色转换为 HEX 颜色\n * @param RGB RGB 颜色\n * @param alpha 透明度\n * @returns HEX 颜色\n */\nexport function RGB2HEX(RGB: PaletteRGB, alpha = 1): string {\n let hexStr = ['r', 'g', 'b']\n .map((key) => RGB[key].toString(16).padStart(2, '0'))\n .join('')\n .toUpperCase()\n\n if (alpha < 1) {\n hexStr += Math.round(alpha * 255)\n .toString(16)\n .padStart(2, '0')\n .toUpperCase()\n }\n\n return hexStr\n}\n\n/**\n * 将 RGB 颜色转换为 HSV 颜色\n * @param RGB RGB 颜色\n * @returns HSV 颜色\n */\nexport function RGB2HSV(RGB: PaletteRGB): PaletteHSV {\n // 归一化到0-1范围\n const red = RGB.r / 255\n const green = RGB.g / 255\n const blue = RGB.b / 255\n const max = Math.max(red, green, blue)\n const min = Math.min(red, green, blue)\n const delta = max - min\n let h = 0\n if (delta !== 0) {\n if (max === red) {\n h = ((green - blue) / delta) % 6\n } else if (max === green) {\n h = (blue - red) / delta + 2\n } else {\n h = (red - green) / delta + 4\n }\n h = (h * 60 + 360) % 360 // 确保正值\n }\n const s = max === 0 ? 0 : delta / max\n const v = max\n return { h, s, v }\n}\n\n/**\n * 将 HEX 颜色转换为 RGB 颜色\n * @param hex HEX 颜色\n * @returns RGB 颜色\n */\nexport function HEX2RGBA(hex: string): { RGB: PaletteRGB; alpha: number } {\n const rgb = { r: 0, g: 0, b: 0 }\n let alpha = 1\n\n if (hex.startsWith('#')) {\n hex = hex.slice(1)\n }\n\n if (hex.length === 3 || hex.length === 4) {\n hex = hex\n .split('')\n .map((char) => char + char)\n .join('')\n }\n\n const alphaStr = hex.slice(6)\n if (alphaStr) {\n alpha = parseInt(alphaStr, 16) / 255\n }\n rgb.r = parseInt(hex.slice(0, 2), 16)\n rgb.g = parseInt(hex.slice(2, 4), 16)\n rgb.b = parseInt(hex.slice(4, 6), 16)\n\n return { RGB: rgb, alpha }\n}\n"],"mappings":"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"}
|