@fangzhongya/fang-ui 0.0.14 → 0.0.16

package/dist/components/lists/src/index.vue

@@ -0,0 +1,373 @@
+<script lang="ts">
+	import {
+		ref,
+		computed,
+		defineComponent,
+		h,
+		onMounted,
+		type VNode,
+		type Component,
+	} from 'vue';
+	import { setLabel, setSslot } from './util';
+	import { setStyles } from '../../common/css';
+	import { useHide, uesObjComponSelected } from '../../common/use';
+	import { getCompons } from '../../common/compons';
+	import { useCssName } from '../../../hooks/cssname';
+	import { dataProps, dataEmits, dataExpose } from './data';
+	import FImg from '../common/img.vue';
+
+	const Components: { [key: string]: Component } = {
+		Img: FImg,
+	};
+
+	export default defineComponent({
+		emits: dataEmits,
+		components: Components,
+		expose: dataExpose,
+		props: dataProps,
+		setup(props, { emit, slots }) {
+			const compons = getCompons(props.compons);
+			const cs = useCssName('lists');
+
+			const isfocus = ref(false);
+			const rowObj = ref();
+
+			const borderColor = computed<string>(() => {
+				const d = '#ccc';
+				if (typeof props.border === 'boolean') {
+					return d;
+				} else {
+					return props.border ?? d;
+				}
+			});
+
+			function isComponSelected(obj: ObjAny) {
+				if (uesObjComponSelected(obj, props)) {
+					if (rowObj.value == obj) {
+						if (isfocus.value) {
+							return true;
+						} else {
+							return false;
+						}
+					} else {
+						return false;
+					}
+				} else {
+					return true;
+				}
+			}
+
+			const getLists = (arrs: ListObj[], listobj?: ListObj) => {
+				let arr = [],
+					trs: VNode[] = [],
+					lin = 0;
+				arrs.forEach((obj, index) => {
+					if (listobj) {
+						obj.father = obj.father ?? listobj;
+					}
+					if (!useHide(obj, props.value)) {
+						let is = false;
+						if (obj.whole) {
+							lin = props.column;
+							is = true;
+						} else {
+							let k = (obj.column || 1) + lin;
+							if (k > props.column) {
+								lin = obj.column || 1;
+								is = true;
+							} else {
+								lin = k;
+								is = false;
+							}
+						}
+						if (is) {
+							arr.push(h('tr', {}, trs));
+							trs = [];
+						}
+						trs.push(...getTd(obj, index));
+						if (lin >= props.column) {
+							arr.push(h('tr', {}, trs));
+							trs = [];
+							lin = 0;
+						}
+					}
+				});
+				if (trs.length > 0) {
+					arr.push(h('tr', {}, trs));
+				}
+				return arr;
+			};
+
+			const getListTops = (arrs: ListObj[], listobj?: ListObj) => {
+				let arr = [],
+					trvs: VNode[] = [],
+					trls: VNode[] = [],
+					lin = 0;
+				arrs.forEach((obj, index) => {
+					if (listobj) {
+						obj.father = obj.father ?? listobj;
+					}
+					if (!useHide(obj, props.value)) {
+						let is = false;
+						if (obj.whole) {
+							lin = props.column;
+							is = true;
+						} else {
+							let k = (obj.column || 1) + lin;
+							if (k > props.column) {
+								lin = obj.column || 1;
+								is = true;
+							} else {
+								lin = k;
+								is = false;
+							}
+						}
+						if (is) {
+							arr.push(h('tr', {}, trls));
+							trls = [];
+							arr.push(h('tr', {}, trvs));
+							trvs = [];
+						}
+						if (obj.isdiv) {
+							trls.push(getValue(obj, index, true));
+						} else {
+							trls.push(getlabel(obj, index));
+							trvs.push(getValue(obj, index));
+							// trvs.push();
+						}
+						if (lin >= props.column) {
+							arr.push(h('tr', {}, trls));
+							arr.push(h('tr', {}, trvs));
+							trls = [];
+							trvs = [];
+							lin = 0;
+						}
+					}
+				});
+				if (trls.length > 0) {
+					arr.push(h('tr', {}, trls));
+					arr.push(h('tr', {}, trvs));
+				}
+				return arr;
+			};
+
+			const getlabel = (obj: ListObj, index: number) => {
+				return h(
+					'th',
+					{
+						style: {
+							width: obj.labelWidth ?? props.labelWidth,
+						},
+						class: [
+							cs.z('table-th'),
+							cs.is('whole', obj.whole),
+							obj.class ?? '',
+						].join(' '),
+						colspan:
+							props.labelPosition == 'top'
+								? setColspan(obj)
+								: undefined,
+
+						onClick: (event: Event) => {
+							isfocus.value = true;
+							rowObj.value = obj;
+							event.stopPropagation();
+							return false;
+						},
+					},
+					[
+						h(
+							'span',
+							{
+								class: cs.z('table-label'),
+							},
+							[
+								setLabel(
+									obj,
+									props,
+									compons,
+									emit,
+									slots,
+									isComponSelected,
+									index,
+								),
+							],
+						),
+					],
+				);
+			};
+
+			const getChildrenValue = (obj: ListObj, index: number) => {
+				if (obj.children) {
+					return [
+						h(
+							'div',
+							{
+								class: cs.z('table-children'),
+							},
+							[
+								props.labelPosition == 'top'
+									? getListTops(obj.children, obj)
+									: getLists(obj.children, obj),
+							],
+						),
+					];
+				} else {
+					return [
+						h(
+							'span',
+							{
+								class: cs.z('table-value'),
+							},
+							[
+								setSslot(
+									obj,
+									props.value,
+									props,
+									compons,
+									emit,
+									slots,
+									isComponSelected,
+									index,
+								),
+							],
+						),
+					];
+				}
+			};
+
+			const getValue = (obj: ListObj, index: number, isRow?: boolean) => {
+				return h(
+					'td',
+					{
+						style: setStyles(obj, props.value, props),
+						class: [
+							cs.z('table-td'),
+							cs.is('whole', obj.whole),
+							obj.class ?? '',
+						].join(' '),
+						colspan: setColspan(obj),
+						rowspan: isRow ? 2 : undefined,
+						onClick: (event: Event) => {
+							isfocus.value = true;
+							rowObj.value = obj;
+							event.stopPropagation();
+							return false;
+						},
+					},
+					[...getChildrenValue(obj, index)],
+				);
+			};
+
+			const getTd = (obj: ListObj, index: number) => {
+				const arr = [getValue(obj, index)];
+				if (!obj.isdiv) {
+					arr.unshift(getlabel(obj, index));
+				}
+				if (props.labelPosition == 'auto') {
+					return [
+						h(
+							'td',
+							{
+								colspan: setColspan(obj),
+								class: cs.is('whole', obj.whole),
+							},
+							[
+								h(
+									'div',
+									{
+										class: cs.z('table-auto'),
+									},
+									arr,
+								),
+							],
+						),
+					];
+				} else {
+					return arr;
+				}
+			};
+
+			const setColspan = (obj: ListObj) => {
+				if (['auto', 'top'].includes(props.labelPosition)) {
+					if (obj.whole) {
+						return props.column;
+					} else if (obj.column) {
+						return obj.column;
+					} else {
+						return '';
+					}
+				} else {
+					const j = !obj.isdiv ? 0 : 1;
+					if (obj.whole) {
+						return (props.column - 1) * 2 + 1 + j;
+					} else if (obj.column) {
+						return (obj.column - 1) * 2 + 1 + j;
+					} else {
+						return 1 + j;
+					}
+				}
+			};
+
+			const renderValue = () => {
+				if (props.list && props.list.length > 0) {
+					return h(
+						'div',
+						{
+							class: cs.z('div'),
+							style: cs.vdo({
+								borderColor: borderColor.value,
+							}),
+
+							// onClick(event: Event) {
+							// 	isfocus.value = true;
+							// 	event.stopPropagation();
+							// 	return false;
+							// },
+						},
+						[
+							h(
+								'table',
+								{
+									class: [
+										cs.z('table'),
+										props.labelPosition ?? '',
+										cs.is(
+											'border',
+											props.border ? true : false,
+										),
+										cs.is('aliquots', props.aliquots),
+									].join(' '),
+									cellspacing: '0',
+									cellpadding: '0',
+									border: '0',
+								},
+								props.labelPosition == 'top'
+									? getListTops(props.list)
+									: getLists(props.list),
+							),
+						],
+					);
+				} else {
+					return '';
+				}
+			};
+
+			onMounted(() => {
+				if (window) {
+					window.addEventListener('click', () => {
+						isfocus.value = false;
+					});
+				}
+			});
+
+			return {
+				renderValue,
+				borderColor,
+			};
+		},
+		render(props: ObjAny) {
+			return props.renderValue();
+		},
+	});
+</script>

package/dist/components/lists/src/setup.d.ts

@@ -1,9 +1,9 @@
-import { VNode, Component } from 'vue';
+import { VNode, Component, RendererNode, RendererElement } from 'vue';
 import { UseCssNameReturn } from '../../../hooks/cssname';
 type Compons = {
     [key: string]: Component;
 };
-export declare function render(props: ObjAny, emit: Function, slots: ObjAny, cs: UseCssNameReturn, compons: Compons): "" | VNode<import('vue').RendererNode, import('vue').RendererElement, {
+export declare function render(props: ObjAny, emit: Function, slots: ObjAny, cs: UseCssNameReturn, compons: Compons): "" | VNode< RendererNode, RendererElement, {
     [key: string]: any;
 }>;
 export {};

package/dist/components/lists/src/util.ts

@@ -0,0 +1,99 @@
+import { type Component } from 'vue';
+
+import {
+	useGetDomValue,
+	useSetSlot,
+	useSetCompon,
+} from '../../common/use';
+import { isObject } from '../../../utils/util';
+
+type Compons = { [key: string]: Component };
+
+export const setClass = (item: ListObj, data: ObjStr, index: number) => {
+	const v = data[item.state ?? item.prop];
+	if (item.setcss) {
+		return item.setcss(item, data, v, index);
+	}
+	return v;
+};
+
+export function setSslot(
+	obj: ListObj,
+	data: ObjAny,
+	props: ObjAny,
+	compons: Compons,
+	emit: Function,
+	slots: ObjAny,
+	isComponSelected: Function,
+	index?: number,
+) {
+	const slot = useSetSlot(obj, data, slots, index);
+	if (slot) {
+		return slot;
+	}
+	const optionss = props.options || {};
+	if (obj.compon) {
+		if (isComponSelected(obj)) {
+			const column = useSetCompon(
+				obj,
+				data,
+				optionss,
+				compons,
+				emit,
+				index,
+			);
+			if (column) {
+				return column;
+			}
+		}
+	}
+	return useGetDomValue(obj, data, optionss, index);
+}
+
+export function setLabel(
+	obj: ListObj,
+	props: ObjAny,
+	compons: Compons,
+	emit: Function,
+	slots: ObjAny,
+	isComponSelected: Function,
+	index?: number,
+) {
+	let label = obj.label ?? '';
+	if (label) {
+		if (isObject(label)) {
+			label = Object.assign({}, obj, label) as ListObj;
+			const slot = useSetSlot(label, props.value, slots, index);
+			if (slot) {
+				return slot;
+			}
+			if (label.compon) {
+				if (isComponSelected(obj)) {
+					const column = useSetCompon(
+						label,
+						props.value,
+						props.optionss,
+						compons,
+						emit,
+						index,
+					);
+					if (column) {
+						return column;
+					}
+				}
+			}
+			label = useGetDomValue(label, props.value, props.optionss, index);
+		}
+	}
+
+	let colon = props.colon;
+	if (colon) {
+		if (colon === true) {
+			colon = '：';
+		}
+		if (label) {
+			return label + colon;
+		}
+	}
+	return label;
+}

package/dist/components/loading/index.ts

@@ -0,0 +1,21 @@
+/**
+ * @config cover=true
+ */
+import { Loading as sLoading, vLoading } from './src/index';
+
+import type { App } from 'vue';
+
+const Loading: {
+	install(app: App): void;
+	directive: typeof vLoading;
+	service: typeof sLoading;
+} = {
+	install(app: App) {
+		app.directive('loading', vLoading);
+		app.config.globalProperties.$Loading = sLoading;
+	},
+	directive: vLoading,
+	service: sLoading,
+};
+
+export { Loading, vLoading, Loading as default };

package/dist/components/loading/src/index.d.ts

@@ -1,33 +1,35 @@
 import { ElLoadingDirective } from 'element-plus';
+import { LoadingOptions, LoadingParentElement } from 'element-plus/es/index';
+import { ComponentPublicInstance, ComponentOptionsBase, Ref, AppContext } from 'vue';
 /**
  * @title {h2} Loading 加载
  * @text 目前完全继承 element-plus 中 ElLoading
  */
 export declare const vLoading: typeof ElLoadingDirective;
 export declare const Loading: {
-    (options?: import('element-plus/es/index').LoadingOptions): {
+    (options?: LoadingOptions): {
         setText: (text: string) => void;
         removeElLoadingChild: () => void;
         close: () => void;
         handleAfterLeave: () => void;
-        vm: import('vue').ComponentPublicInstance<{}, {}, {}, {}, {}, {}, {}, {}, false, import('vue').ComponentOptionsBase<any, any, any, any, any, any, any, any, any, {}>>;
+        vm: ComponentPublicInstance<{}, {}, {}, {}, {}, {}, {}, {}, false, ComponentOptionsBase<any, any, any, any, any, any, any, any, any, {}>>;
         $el: HTMLElement;
-        originalPosition: import('vue').Ref<string>;
-        originalOverflow: import('vue').Ref<string>;
-        visible: import('vue').Ref<boolean>;
-        parent: import('vue').Ref<import('element-plus/es/index').LoadingParentElement>;
-        background: import('vue').Ref<string>;
-        svg: import('vue').Ref<string>;
-        svgViewBox: import('vue').Ref<string>;
-        spinner: import('vue').Ref<string | boolean>;
-        text: import('vue').Ref<string>;
-        fullscreen: import('vue').Ref<boolean>;
-        lock: import('vue').Ref<boolean>;
-        customClass: import('vue').Ref<string>;
-        target: import('vue').Ref<HTMLElement>;
-        beforeClose?: import('vue').Ref<(() => boolean) | undefined> | undefined;
-        closed?: import('vue').Ref<(() => void) | undefined> | undefined;
+        originalPosition: Ref<string>;
+        originalOverflow: Ref<string>;
+        visible: Ref<boolean>;
+        parent: Ref<LoadingParentElement>;
+        background: Ref<string>;
+        svg: Ref<string>;
+        svgViewBox: Ref<string>;
+        spinner: Ref<string | boolean>;
+        text: Ref<string>;
+        fullscreen: Ref<boolean>;
+        lock: Ref<boolean>;
+        customClass: Ref<string>;
+        target: Ref<HTMLElement>;
+        beforeClose?: Ref<(() => boolean) | undefined> | undefined;
+        closed?: Ref<(() => void) | undefined> | undefined;
     };
-    _context: import('vue').AppContext | null;
+    _context: AppContext | null;
 };
 export default Loading;

package/dist/components/loading/src/index.ts

@@ -0,0 +1,11 @@
+import { ElLoadingDirective, ElLoadingService } from 'element-plus';
+/**
+ * @title {h2} Loading 加载
+ * @text 目前完全继承 element-plus 中 ElLoading
+ */
+
+export const vLoading: typeof ElLoadingDirective = ElLoadingDirective;
+
+export const Loading = ElLoadingService;
+
+export default Loading;

package/dist/components/menu/index.d.ts

@@ -1,12 +1,13 @@
+import { CreateComponentPublicInstanceWithMixins, ExtractPropTypes, Component, ComponentOptionsMixin, PublicProps, GlobalComponents, GlobalDirectives, ComponentProvideOptions, ComponentOptionsBase, VNodeProps, AllowedComponentProps, ComponentCustomProps, Plugin } from 'vue';
 declare const Menu: {
-    new (...args: any[]): import('vue').CreateComponentPublicInstanceWithMixins<Readonly<import('vue').ExtractPropTypes<{
+    new (...args: any[]): CreateComponentPublicInstanceWithMixins<Readonly< ExtractPropTypes<{
         config: {
             type: () => ObjAny;
             default(): {};
         };
         compons: {
             type: () => {
-                [key: string]: import('vue').Component;
+                [key: string]: Component;
             };
             default(): {};
         };
@@ -35,29 +36,29 @@ declare const Menu: {
         };
     }>> & Readonly<{
         onSelect?: ((...args: any[]) => any) | undefined;
-    }>, {}, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {
+    }>, {}, {}, {}, {}, ComponentOptionsMixin, ComponentOptionsMixin, {
         select: (...args: any[]) => void;
-    }, import('vue').PublicProps, {
+    }, PublicProps, {
         config: ObjAny;
         list: ListObj[];
         compons: {
-            [key: string]: import('vue').Component;
+            [key: string]: Component;
         };
-    }, true, {}, {}, import('vue').GlobalComponents, import('vue').GlobalDirectives, string, {}, any, import('vue').ComponentProvideOptions, {
+    }, true, {}, {}, GlobalComponents, GlobalDirectives, string, {}, any, ComponentProvideOptions, {
         P: {};
         B: {};
         D: {};
         C: {};
         M: {};
         Defaults: {};
-    }, Readonly<import('vue').ExtractPropTypes<{
+    }, Readonly< ExtractPropTypes<{
         config: {
             type: () => ObjAny;
             default(): {};
         };
         compons: {
             type: () => {
-                [key: string]: import('vue').Component;
+                [key: string]: Component;
             };
             default(): {};
         };
@@ -90,20 +91,20 @@ declare const Menu: {
         config: ObjAny;
         list: ListObj[];
         compons: {
-            [key: string]: import('vue').Component;
+            [key: string]: Component;
         };
     }>;
     __isFragment?: never;
     __isTeleport?: never;
     __isSuspense?: never;
-} & import('vue').ComponentOptionsBase<Readonly<import('vue').ExtractPropTypes<{
+} & ComponentOptionsBase<Readonly< ExtractPropTypes<{
     config: {
         type: () => ObjAny;
         default(): {};
     };
     compons: {
         type: () => {
-            [key: string]: import('vue').Component;
+            [key: string]: Component;
         };
         default(): {};
     };
@@ -132,15 +133,15 @@ declare const Menu: {
     };
 }>> & Readonly<{
     onSelect?: ((...args: any[]) => any) | undefined;
-}>, {}, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {
+}>, {}, {}, {}, {}, ComponentOptionsMixin, ComponentOptionsMixin, {
     select: (...args: any[]) => void;
 }, string, {
     config: ObjAny;
     list: ListObj[];
     compons: {
-        [key: string]: import('vue').Component;
+        [key: string]: Component;
     };
-}, {}, string, {}, import('vue').GlobalComponents, import('vue').GlobalDirectives, string, import('vue').ComponentProvideOptions> & import('vue').VNodeProps & import('vue').AllowedComponentProps & import('vue').ComponentCustomProps & (new () => {
+}, {}, string, {}, GlobalComponents, GlobalDirectives, string, ComponentProvideOptions> & VNodeProps & AllowedComponentProps & ComponentCustomProps & (new () => {
     $slots: Partial<Record<string, (_: any) => any>>;
-}) & import('vue').Plugin;
+}) & Plugin;
 export { Menu, Menu as default };

package/dist/components/menu/index.ts

@@ -0,0 +1,7 @@
+import { withInstall } from '../../utils/vues/withInstall'
+import SrcVue from './src/index.vue'
+const Menu = withInstall(SrcVue, 'Menu');
+export {
+   Menu,
+   Menu as default
+};