@fangzhongya/fang-ui 0.0.13 → 0.0.15

package/dist/components/tables/common/util.ts

@@ -0,0 +1,169 @@
+import { withModifiers } from 'vue';
+
+import { firstUpper, isArray, splitUpper } from '../../../utils/index';
+
+import { useAttrValue } from '../../../hooks/inherit';
+
+export function setMinWidth(obj: ObjAny, props?: ObjAny) {
+	const config = props?.table ?? {};
+	if (obj.width) {
+		return;
+	}
+	const minWidth = useAttrValue(obj, 'minWidth');
+	if (minWidth) {
+		if (typeof minWidth == 'function') {
+			return minWidth(obj, config);
+		} else if (typeof minWidth == 'boolean') {
+			return (obj.label || '').length * 16 + 24;
+		} else {
+			return minWidth;
+		}
+	} else {
+		const minWidth = useAttrValue(config, 'minWidth');
+		if (minWidth) {
+			return minWidth;
+		} else {
+			return;
+		}
+	}
+}
+
+interface OnceEventTarget extends EventTarget {
+	__once__?: boolean;
+}
+
+interface OnceEvent extends Event {
+	readonly currentTarget: OnceEventTarget | null;
+}
+/**
+ * 事件别名处理对象
+ */
+const eventAliasObj = {
+	//.stop - 调用 event.stopPropagation()。
+	stop(event: Event) {
+		event.stopPropagation();
+		return true;
+	},
+	// .prevent - 调用 event.preventDefault()。
+	prevent(event: Event) {
+		event.preventDefault();
+		return true;
+	},
+	// .self - 只有事件从元素本身发出才触发处理函数。
+	self(event: Event) {
+		return event.target === event.currentTarget;
+	},
+	// .once - 最多触发一次处理函数。
+	once(event: OnceEvent) {
+		if (event.currentTarget?.__once__) {
+			return false;
+		} else {
+			if (event.currentTarget) {
+				event.currentTarget.__once__ = true;
+			}
+			return true;
+		}
+	},
+	// .capture - 在捕获模式添加事件监听器。
+	// 处理事件是异步的，只有在触发了事件后才执行方法,
+	// 目前无法支持 capture
+	// capture(event) {
+	//     console.log('event', event);
+	//     return true;
+	// },
+};
+type ModifierGuardsKeys =
+	| 'stop'
+	| 'prevent'
+	| 'self'
+	| 'ctrl'
+	| 'shift'
+	| 'alt'
+	| 'meta'
+	| 'left'
+	| 'middle'
+	| 'right'
+	| 'exact';
+
+/**
+ * 支持事件别名处理
+ * @param {*} key
+ * @param {*} callback
+ * @param {*} obj
+ * @param {*} $event
+ */
+function eventAlias(
+	key: string,
+	callback: Function,
+	obj: ObjAny,
+	$event: Event,
+) {
+	let is = false;
+	const name = 'on' + firstUpper(key);
+	const arr: string[] = [];
+	Object.keys(obj).forEach((k) => {
+		if (k.startsWith(name)) {
+			arr.push(k);
+		}
+	});
+	const reg = new RegExp('^' + name);
+	arr.forEach((v) => {
+		let s = v.replace(reg, '');
+		if (s && $event) {
+			let ns = splitUpper(s);
+			if (ns.includes('passive')) {
+				ns = ns.filter((k) => {
+					return k != 'prevent';
+				});
+			}
+			const fn = () => {
+				// 不支持.capture
+				if (ns.includes('once')) {
+					let isc = eventAliasObj.once($event);
+					if (isc) {
+						callback(obj[v]);
+					}
+				} else {
+					callback(obj[v]);
+				}
+			};
+			// 不支持.capture
+			withModifiers(fn, ns as ModifierGuardsKeys[])();
+		} else {
+			callback(obj[v]);
+		}
+		is = true;
+	});
+	return is;
+}
+
+/**
+ * 支持事件别名处理
+ * @param {*} callback
+ * @param {*} arr
+ * @param {*} obj
+ * @param {*} $event
+ */
+export function eventAliass(
+	callback: Function,
+	arr: string | string[],
+	obj: ObjAny,
+	$event: Event,
+) {
+	let is = false;
+	if (callback && obj) {
+		if (arr && arr.length > 0) {
+			if (isArray(arr)) {
+				arr = arr as string[];
+				arr.forEach((key) => {
+					if (eventAlias(key, callback, obj, $event)) {
+						is = true;
+					}
+				});
+			} else {
+				is = eventAlias(arr as string, callback, obj, $event);
+			}
+		}
+	}
+	return is;
+}

package/dist/components/tables/index.ts

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

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

@@ -0,0 +1,152 @@
+<template>
+	<div :class="cs.z()">
+		<!-- table表单 -->
+		<template v-if="tableConfig.type == 1">
+			<fv-vxe-table
+				v-bind="tableConfig.config"
+				v-on="formEvent"
+				ref="refTable"
+				:class="[cs.z('main')]"
+				:size="tableConfig.config?.size"
+				:value="data.list"
+				:list="tableList"
+				:paginat="paginat"
+				:loading="loading"
+				:options="props.options"
+				:compons="props.compons"
+				@sort-change="onSortChange"
+				@radio-change="onRadioChange"
+				@selection-change="onChange"
+				@list-events="onListEvents"
+			>
+				<template
+					v-for="(k, i) in Object.keys(slots)"
+					#[k]="scope"
+					:key="k"
+				>
+					<slot :name="k" v-bind="scope"></slot>
+				</template>
+			</fv-vxe-table>
+		</template>
+		<template v-else>
+			<fv-tables
+				v-bind="tableConfig.config"
+				v-on="formEvent"
+				ref="refTable"
+				:class="[
+					cs.z('main'),
+					cs.is('radio', tableConfig.config?.isradio),
+				]"
+				:value="data.list"
+				:list="tableList"
+				:size="tableConfig.config?.size"
+				:paginat="paginat"
+				:loading="loading"
+				:options="props.options"
+				:compons="props.compons"
+				@sort-change="onSortChange"
+				@list-events="onListEvents"
+				@select="onSelect"
+				@row-click="onRowClick"
+				@selection-change="onChange"
+			>
+				<template
+					v-for="(k, i) in Object.keys(slots)"
+					#[k]="scope"
+					:key="k"
+				>
+					<slot :name="k" v-bind="scope"></slot>
+				</template>
+			</fv-tables>
+		</template>
+		<!-- 分页 -->
+		<template v-if="tableConfig.paginat?.is">
+			<Pagination
+				v-bind="pagconfig"
+				:class="cs.z('paginat')"
+				:paginat="paginat"
+				:total="data.total"
+				@size-change="onSizeChange"
+				@current-change="onCurrentChange"
+			></Pagination>
+		</template>
+	</div>
+</template>
+<script setup lang="ts">
+	import FvTables from '../../el-tables/index';
+	import FvVxeTable from '../../vxe-tables/index';
+	import Pagination from '../../pagin/index';
+	import { ref, useSlots } from 'vue';
+	import { dataProps, dataEmit, useInit } from '../common/pagin';
+	import { useCssName } from '../../../hooks/cssname';
+	import type { Slots } from 'vue';
+	const cs = useCssName('table-pag');
+	const slots: Slots = useSlots();
+	const props = defineProps(dataProps);
+
+	const emit = defineEmits(dataEmit);
+
+	const refTable = ref();
+
+	const {
+		getSelection,
+		initData,
+		getData,
+		empty,
+		loading,
+		tableList,
+		tableConfig,
+		onRadioChange,
+		onSortChange,
+		onListEvents,
+		onSelect,
+		onRowClick,
+		onChange,
+		pagconfig,
+		formEvent,
+		onSizeChange,
+		onCurrentChange,
+		paginat,
+		data,
+	} = useInit(props, emit, refTable);
+
+	defineExpose({
+		getSelection,
+		initData,
+		getList: getData,
+		empty,
+	});
+</script>
+<style lang="scss" scoped>
+	$namespace: 'el';
+	$table-pag: 'table-pag';
+	.#{$table-pag} {
+		width: 100%;
+		height: 100%;
+		flex: 1;
+		display: flex;
+		flex-direction: column;
+
+		.#{$table-pag}-main {
+			display: flex;
+			flex-direction: column;
+			flex: 1;
+			width: 100%;
+			&.is-radio {
+				:deep(.#{$namespace}-table__header) {
+					.#{$namespace}-table-column--selection {
+						.#{$namespace}-checkbox {
+							display: none;
+						}
+					}
+				}
+			}
+		}
+		.#{$table-pag}-paginat {
+			overflow: hidden;
+			.#{$namespace}-pagination {
+				justify-content: flex-end;
+			}
+		}
+	}
+</style>

package/dist/components/tables/src/index2.cjs

@@ -1,21 +1,21 @@
 "use strict";
 Object.defineProperties(exports, { __esModule: { value: true }, [Symbol.toStringTag]: { value: "Module" } });
-const require$$0 = require("vue");
+const vue = require("vue");
 const index$2 = require("../../el-tables/index.cjs");
 const index$1 = require("../../vxe-tables/index.cjs");
 const index$3 = require("../../pagin/index.cjs");
 const pagin = require("../common/pagin.cjs");
 const index = require("../../../hooks/cssname/index.cjs");
-const _sfc_main = /* @__PURE__ */ require$$0.defineComponent({
+const _sfc_main = /* @__PURE__ */ vue.defineComponent({
   __name: "index",
   props: pagin.dataProps,
   emits: pagin.dataEmit,
   setup(__props, { expose: __expose, emit: __emit }) {
     const cs = index.useCssName("table-pag");
-    const slots = require$$0.useSlots();
+    const slots = vue.useSlots();
     const props = __props;
     const emit = __emit;
-    const refTable = require$$0.ref();
+    const refTable = vue.ref();
     const {
       getSelection,
       initData,
@@ -45,69 +45,69 @@ const _sfc_main = /* @__PURE__ */ require$$0.defineComponent({
     });
     return (_ctx, _cache) => {
       var _a, _b, _c, _d;
-      return require$$0.openBlock(), require$$0.createElementBlock("div", {
-        class: require$$0.normalizeClass(require$$0.unref(cs).z())
+      return vue.openBlock(), vue.createElementBlock("div", {
+        class: vue.normalizeClass(vue.unref(cs).z())
       }, [
-        require$$0.unref(tableConfig).type == 1 ? (require$$0.openBlock(), require$$0.createBlock(require$$0.unref(index$1.VxeTables), require$$0.mergeProps({ key: 0 }, require$$0.unref(tableConfig).config, require$$0.toHandlers(require$$0.unref(formEvent)), {
+        vue.unref(tableConfig).type == 1 ? (vue.openBlock(), vue.createBlock(vue.unref(index$1.VxeTables), vue.mergeProps({ key: 0 }, vue.unref(tableConfig).config, vue.toHandlers(vue.unref(formEvent)), {
           ref_key: "refTable",
           ref: refTable,
-          class: [require$$0.unref(cs).z("main")],
-          size: (_a = require$$0.unref(tableConfig).config) == null ? void 0 : _a.size,
-          value: require$$0.unref(data).list,
-          list: require$$0.unref(tableList),
-          paginat: require$$0.unref(paginat),
-          loading: require$$0.unref(loading),
+          class: [vue.unref(cs).z("main")],
+          size: (_a = vue.unref(tableConfig).config) == null ? void 0 : _a.size,
+          value: vue.unref(data).list,
+          list: vue.unref(tableList),
+          paginat: vue.unref(paginat),
+          loading: vue.unref(loading),
           options: props.options,
           compons: props.compons,
-          onSortChange: require$$0.unref(onSortChange),
-          onRadioChange: require$$0.unref(onRadioChange),
-          onSelectionChange: require$$0.unref(onChange),
-          onListEvents: require$$0.unref(onListEvents)
-        }), require$$0.createSlots({ _: 2 }, [
-          require$$0.renderList(Object.keys(require$$0.unref(slots)), (k, i) => {
+          onSortChange: vue.unref(onSortChange),
+          onRadioChange: vue.unref(onRadioChange),
+          onSelectionChange: vue.unref(onChange),
+          onListEvents: vue.unref(onListEvents)
+        }), vue.createSlots({ _: 2 }, [
+          vue.renderList(Object.keys(vue.unref(slots)), (k, i) => {
             return {
               name: k,
-              fn: require$$0.withCtx((scope) => [
-                require$$0.renderSlot(_ctx.$slots, k, require$$0.normalizeProps(require$$0.guardReactiveProps(scope)), void 0, true)
+              fn: vue.withCtx((scope) => [
+                vue.renderSlot(_ctx.$slots, k, vue.normalizeProps(vue.guardReactiveProps(scope)), void 0, true)
               ])
             };
           })
-        ]), 1040, ["class", "size", "value", "list", "paginat", "loading", "options", "compons", "onSortChange", "onRadioChange", "onSelectionChange", "onListEvents"])) : (require$$0.openBlock(), require$$0.createBlock(require$$0.unref(index$2.ElTables), require$$0.mergeProps({ key: 1 }, require$$0.unref(tableConfig).config, require$$0.toHandlers(require$$0.unref(formEvent)), {
+        ]), 1040, ["class", "size", "value", "list", "paginat", "loading", "options", "compons", "onSortChange", "onRadioChange", "onSelectionChange", "onListEvents"])) : (vue.openBlock(), vue.createBlock(vue.unref(index$2.ElTables), vue.mergeProps({ key: 1 }, vue.unref(tableConfig).config, vue.toHandlers(vue.unref(formEvent)), {
           ref_key: "refTable",
           ref: refTable,
           class: [
-            require$$0.unref(cs).z("main"),
-            require$$0.unref(cs).is("radio", (_b = require$$0.unref(tableConfig).config) == null ? void 0 : _b.isradio)
+            vue.unref(cs).z("main"),
+            vue.unref(cs).is("radio", (_b = vue.unref(tableConfig).config) == null ? void 0 : _b.isradio)
           ],
-          value: require$$0.unref(data).list,
-          list: require$$0.unref(tableList),
-          size: (_c = require$$0.unref(tableConfig).config) == null ? void 0 : _c.size,
-          paginat: require$$0.unref(paginat),
-          loading: require$$0.unref(loading),
+          value: vue.unref(data).list,
+          list: vue.unref(tableList),
+          size: (_c = vue.unref(tableConfig).config) == null ? void 0 : _c.size,
+          paginat: vue.unref(paginat),
+          loading: vue.unref(loading),
           options: props.options,
           compons: props.compons,
-          onSortChange: require$$0.unref(onSortChange),
-          onListEvents: require$$0.unref(onListEvents),
-          onSelect: require$$0.unref(onSelect),
-          onRowClick: require$$0.unref(onRowClick),
-          onSelectionChange: require$$0.unref(onChange)
-        }), require$$0.createSlots({ _: 2 }, [
-          require$$0.renderList(Object.keys(require$$0.unref(slots)), (k, i) => {
+          onSortChange: vue.unref(onSortChange),
+          onListEvents: vue.unref(onListEvents),
+          onSelect: vue.unref(onSelect),
+          onRowClick: vue.unref(onRowClick),
+          onSelectionChange: vue.unref(onChange)
+        }), vue.createSlots({ _: 2 }, [
+          vue.renderList(Object.keys(vue.unref(slots)), (k, i) => {
             return {
               name: k,
-              fn: require$$0.withCtx((scope) => [
-                require$$0.renderSlot(_ctx.$slots, k, require$$0.normalizeProps(require$$0.guardReactiveProps(scope)), void 0, true)
+              fn: vue.withCtx((scope) => [
+                vue.renderSlot(_ctx.$slots, k, vue.normalizeProps(vue.guardReactiveProps(scope)), void 0, true)
               ])
             };
           })
         ]), 1040, ["class", "value", "list", "size", "paginat", "loading", "options", "compons", "onSortChange", "onListEvents", "onSelect", "onRowClick", "onSelectionChange"])),
-        ((_d = require$$0.unref(tableConfig).paginat) == null ? void 0 : _d.is) ? (require$$0.openBlock(), require$$0.createBlock(require$$0.unref(index$3.Pagin), require$$0.mergeProps({ key: 2 }, require$$0.unref(pagconfig), {
-          class: require$$0.unref(cs).z("paginat"),
-          paginat: require$$0.unref(paginat),
-          total: require$$0.unref(data).total,
-          onSizeChange: require$$0.unref(onSizeChange),
-          onCurrentChange: require$$0.unref(onCurrentChange)
-        }), null, 16, ["class", "paginat", "total", "onSizeChange", "onCurrentChange"])) : require$$0.createCommentVNode("", true)
+        ((_d = vue.unref(tableConfig).paginat) == null ? void 0 : _d.is) ? (vue.openBlock(), vue.createBlock(vue.unref(index$3.Pagin), vue.mergeProps({ key: 2 }, vue.unref(pagconfig), {
+          class: vue.unref(cs).z("paginat"),
+          paginat: vue.unref(paginat),
+          total: vue.unref(data).total,
+          onSizeChange: vue.unref(onSizeChange),
+          onCurrentChange: vue.unref(onCurrentChange)
+        }), null, 16, ["class", "paginat", "total", "onSizeChange", "onCurrentChange"])) : vue.createCommentVNode("", true)
       ], 2);
     };
   }

package/dist/components/tables-form/index.ts

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

package/dist/components/tables-form/src/column.cjs

@@ -1,8 +1,9 @@
 "use strict";
 Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
-const require$$0 = require("vue");
+const vue = require("vue");
 const common = require("../../../utils/vues/common.cjs");
 require("../../../utils/vues/getBuildProps.cjs");
+require("../../../utils/vues/withInstall.cjs");
 require("@fangzhongya/utils/css/setObjStyle");
 require("@fangzhongya/utils/css/getCss");
 require("@fangzhongya/utils/basic/string/splitUpper");
@@ -102,7 +103,7 @@ function setSslot(obj, scope, emit, table, index, form, formValue) {
           trigger: ["blur", "change"]
         });
       }
-      return require$$0.h(
+      return vue.h(
         elementPlus.ElFormItem,
         {
           class: "table-form-item",
@@ -113,9 +114,9 @@ function setSslot(obj, scope, emit, table, index, form, formValue) {
         {
           default: () => {
             if (typeof obj.compon == "string") {
-              return require$$0.h(require$$0.resolveComponent(obj.compon), componObj);
+              return vue.h(vue.resolveComponent(obj.compon), componObj);
             } else {
-              return require$$0.h(obj.compon, componObj);
+              return vue.h(obj.compon, componObj);
             }
           }
         }
@@ -134,9 +135,9 @@ function setSslot(obj, scope, emit, table, index, form, formValue) {
       tableScope: scope
     };
     if (typeof obj.compon == "string") {
-      return require$$0.h(require$$0.resolveComponent(obj.compon), componObj);
+      return vue.h(vue.resolveComponent(obj.compon), componObj);
     } else {
-      return require$$0.h(obj.compon, componObj);
+      return vue.h(obj.compon, componObj);
     }
   } else {
     return defaultDom(obj, scope, table, index);
@@ -174,14 +175,14 @@ function defaultDom(obj, scope, table, index) {
   } else if (obj.asynccall) {
     const key = "_async_" + (prop || "_" + index);
     if (!row[key] || typeof row[key].value == "undefined") {
-      row[key] = require$$0.reactive({
+      row[key] = vue.reactive({
         value: cellValue || ""
       });
       obj.asynccall(scope, (v) => {
         row[key].value = v;
       });
     }
-    return require$$0.h(
+    return vue.h(
       "span",
       {
         class: "text"
@@ -192,7 +193,7 @@ function defaultDom(obj, scope, table, index) {
     domValue = cellValue;
   }
   domValue = domValue ?? "";
-  return require$$0.h(
+  return vue.h(
     "span",
     {
       class: "text",
@@ -207,17 +208,17 @@ function defaultDom(obj, scope, table, index) {
 }
 function setHeader(obj) {
   if (isArray.isArray(obj.label)) {
-    return require$$0.h(
+    return vue.h(
       "span",
       {
         class: "th-header " + (obj.required ? "is-required " : "") + (obj.class || "")
       },
       obj.label.map((v) => {
-        return require$$0.h("span", { class: "th-header-span" }, v);
+        return vue.h("span", { class: "th-header-span" }, v);
       })
     );
   } else if (obj.required) {
-    return require$$0.h(
+    return vue.h(
       "span",
       { class: "th-header is-required " + (obj.class || "") },
       obj.label
@@ -229,7 +230,7 @@ function setHeader(obj) {
 function getDom(obj, emit, table, index, form, formValue) {
   if (common.setHide(obj)) {
     const props = setProps(obj, table);
-    return require$$0.h(
+    return vue.h(
       elementPlus.ElTableColumn,
       {
         ...props,

package/dist/components/tables-form/src/column.d.ts

@@ -1,8 +1,9 @@
+import { VNode, RendererNode, RendererElement } from 'vue';
 export declare function setProps(obj: ObjAny, table: ObjAny): ObjAny;
 export declare function getOnObjs(list: ObjAny, scope: any, emit: any): {
     [key: string]: () => void;
 };
 export declare function setHeader(obj: any): any;
-export declare function columnRender(obj: ObjAny, emit: any, table: ObjAny, index: number, form: ObjAny, formValue: ObjAny): import('vue').VNode<import('vue').RendererNode, import('vue').RendererElement, {
+export declare function columnRender(obj: ObjAny, emit: any, table: ObjAny, index: number, form: ObjAny, formValue: ObjAny): VNode<RendererNode, RendererElement, {
     [key: string]: any;
 }> | undefined;

package/dist/components/tables-form/src/column.js

@@ -1,6 +1,7 @@
 import { h, resolveComponent, reactive } from "vue";
 import { setHide, setMinWidth } from "../../../utils/vues/common.js";
 import "../../../utils/vues/getBuildProps.js";
+import "../../../utils/vues/withInstall.js";
 import "@fangzhongya/utils/css/setObjStyle";
 import "@fangzhongya/utils/css/getCss";
 import "@fangzhongya/utils/basic/string/splitUpper";