@fangzhongya/fang-ui 0.0.21 → 0.0.23

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

@@ -1,538 +0,0 @@
-import {
-	computed,
-	ref,
-	reactive,
-	watch,
-	type Ref,
-	type Component,
-	type ExtractPropTypes,
-} from 'vue';
-
-import {
-	firstLower,
-	lineToSmallHump,
-	executionMethod,
-	getObjValue,
-	setObjValue,
-} from '../../../utils/index';
-
-import { props, comHandle } from '../../common/urls';
-
-export const dataProps = {
-	...props,
-	// 总表格的配置
-	configs: {
-		type: Object as () => Config,
-	},
-	// 表格的配置
-	config: {
-		type: Object as () => TableConfig,
-		default() {
-			return {};
-		},
-	},
-	list: {
-		type: Array<ListObj>,
-		default() {
-			return [];
-		},
-	},
-	load: {
-		type: Boolean,
-		default: true,
-	},
-
-	/**
-	 * @props { Object } options 选择数据集合
-	 */
-	options: {
-		type: Object,
-		default() {
-			return {};
-		},
-	},
-	/**
-	 * @props { Object } compons 外部组件集合
-	 */
-	compons: {
-		type: Object as () => { [key: string]: Component },
-		default() {
-			return {};
-		},
-	},
-};
-
-export const dataEmit = ['list-events', 'selection'];
-
-export const useInit = (
-	props: ExtractPropTypes<typeof dataProps>,
-	emit: Function,
-	refTable: Ref,
-	isEl?: boolean,
-) => {
-	const loading = ref(false);
-
-	const mpagconfig = {
-		pageSize: 10,
-		pageSizes: [10, 20, 30, 40, 50, 100],
-		layout: 'total, slot,  ->, prev, pager, next, sizes, jumper',
-		// sizes, prev, pager, next, jumper, ->, total, slot
-		data: {
-			// 列表数据字段
-			list: 'items',
-			// 总数据字段
-			total: 'totalCount',
-
-			current: 'pageNum',
-			pageSize: 'pageSize',
-			prop: 'sortField',
-			order: 'sortType',
-		},
-	};
-
-	const pagconfig = ref(mpagconfig);
-
-	// 分页的配置
-	const paginat = reactive<PaginatType>({
-		current: 1,
-		pageSize: mpagconfig.pageSize,
-		order: '',
-		prop: '',
-	});
-
-	type TableData = {
-		total: number;
-		list: ObjAny[];
-	};
-
-	// table 数据
-	const data = reactive<TableData>({
-		total: 0,
-		list: [],
-	});
-
-	const orderMap: ObjStr = {
-		asc: 'asc',
-		ascending: 'asc',
-		desc: 'desc',
-		descending: 'desc',
-	};
-
-	const tableList = ref<ListObj[]>(props.configs?.list ?? props.list);
-	const tableConfig = ref<TableConfig>(props.configs?.config ?? props.config);
-	const width = {
-		index: 66,
-		selection: 46,
-	};
-
-	const setList = () => {
-		const configs = props.configs;
-		const list: ListObj[] = configs?.list ?? props.list;
-		const config: TableConfig = configs?.config ?? props.config;
-
-		if (config.config?.ischecked || config.config?.isserial) {
-			let isx = config.config?.ischecked;
-			let iss = config.config?.isserial;
-			let i = -1;
-			for (let t = 0; t < list.length; t++) {
-				const obj = list[t];
-				if (obj?.type == 'selection') {
-					if (!obj.width) {
-						obj.width = width.selection;
-					}
-					if (!obj.selectable) {
-						obj.selectable = config.config?.selectable;
-					}
-					i = t;
-					isx = false;
-				}
-				if (obj?.type == 'index') {
-					if (!obj.width) {
-						obj.width = width.index;
-					}
-					iss = false;
-				}
-				if (!isx && !iss) {
-					break;
-				}
-			}
-			if (iss) {
-				if (i != -1) {
-					list.splice(i + 1, 0, {
-						type: 'index',
-						width: width.index,
-						label: '序号',
-						fixed: true,
-					});
-				} else {
-					list.unshift({
-						type: 'index',
-						width: width.index,
-						label: '序号',
-						fixed: true,
-					});
-				}
-			}
-			if (isx) {
-				list.unshift({
-					type: 'selection',
-					width: width.selection,
-					selectable: config.config?.selectable,
-					fixed: true,
-				});
-			}
-		}
-
-		// if (c.config?.isserial) {
-		//   list.unshift({
-		//     type: 'index',
-		//     width: width.index,
-		//     label: '序号',
-		//   })
-		// }
-		// if (c.config?.isradio || c.config?.ischecked) {
-		//   list.unshift({
-		//     type: 'selection',
-		//     width: width.selection,
-		//     radio: c.config?.isradio,
-		//     selectable: c.config?.selectable,
-		//   })
-		// }
-
-		tableList.value = list;
-	};
-
-	const setConfig = () => {
-		const configs = props.configs;
-		const config: TableConfig = configs?.config ?? props.config;
-		// 排序
-		if (config.config?.defaultSort) {
-			const v = config.config.defaultSort;
-			paginat.order = orderMap[v.order] ?? '';
-			paginat.prop = v.prop;
-		}
-
-		// 分页
-		const pagin = config.paginat ?? {};
-		paginat.pageSize = pagin.size || mpagconfig.pageSize;
-		pagconfig.value = Object.assign({}, mpagconfig, pagin.config || {});
-
-		tableConfig.value = config;
-	};
-
-	watch(
-		[() => props.configs, () => props.config, () => props.list],
-		() => {
-			setList();
-			setConfig();
-		},
-		{ immediate: true },
-	);
-
-	const formEvent = computed(() => {
-		const obj: {
-			[key: string]: Function;
-		} = {};
-		const es = tableConfig.value.events || ({} as ObjStr);
-		Object.keys(es).forEach((key) => {
-			let ml = key;
-			if (/on[A-Z]/.test(key)) {
-				ml = firstLower(key.replace(/^on/, ''));
-			}
-			ml = lineToSmallHump(ml);
-			obj[ml] = (...data: any[]) => {
-				executionMethod(es[key], ...data);
-			};
-		});
-		return obj;
-	});
-
-	const istype = computed(() => {
-		if (isEl) {
-			return true;
-		} else {
-			return tableConfig.value.type == 1;
-		}
-	});
-
-	function onChange(arr: ObjStr[]) {
-		if (!tableConfig.value.config?.isradio) {
-			console.log('onChange');
-			emit('selection', arr);
-		}
-	}
-	function onRowClick(row: ObjAny, obj: ObjAny) {
-		if (!tableConfig.value.config?.noRowSelect) {
-			const selectable = tableConfig.value.config?.selectable;
-			if (selectable) {
-				const index = data.list.findIndex((obj) => {
-					obj === row;
-				});
-				if (selectable(row, index)) {
-					if (tableConfig.value.config?.isradio) {
-						refTable.value.clearSelection();
-						refTable.value.toggleRowSelection(row, true);
-						console.log('onRowClick');
-						emit('selection', [row]);
-					} else {
-						refTable.value.toggleRowSelection(row);
-					}
-				}
-			} else {
-				if (tableConfig.value.config?.isradio) {
-					refTable.value.clearSelection();
-					refTable.value.toggleRowSelection(row, true);
-					console.log('onRowClick');
-					emit('selection', [row]);
-				} else {
-					refTable.value.toggleRowSelection(row);
-				}
-			}
-		}
-	}
-
-	function empty() {
-		if (istype.value && tableConfig.value.config?.isradio) {
-			refTable.value?.clearRadioRow();
-		}
-		refTable.value?.clearSelection();
-		console.log('empty');
-		emit('selection', []);
-	}
-
-	function onSelect(s: ObjAny, row: ObjStr) {
-		if (tableConfig.value.config?.isradio) {
-			refTable.value.clearSelection();
-			refTable.value.toggleRowSelection(row, true);
-			console.log('onSelect');
-			emit('selection', [row]);
-		}
-	}
-
-	function onRadioChange(obj: ObjAny) {
-		if (tableConfig.value.config?.isradio) {
-			console.log('onRadioChange');
-			emit('selection', [obj.row]);
-		}
-	}
-
-	// 前端默认排序
-	function defaultSort(arr: ObjStr[]) {
-		if (!tableConfig.value.config?.sort) {
-			return arr;
-		} else {
-			const prop = tableConfig.value.config?.defaultSort?.prop;
-			const order =
-				orderMap[tableConfig.value.config?.defaultSort?.order] || '';
-			if (prop && order) {
-				const vs = arr.sort((ao, bo) => {
-					const a = ao[prop];
-					const b = bo[prop];
-					const c = Number(a) - Number(b);
-					if (isNaN(c)) {
-						return (a + '').length - (b + '').length;
-					} else {
-						return c;
-					}
-				});
-				if (order == 'asc') {
-					return vs;
-				} else {
-					return vs.reverse();
-				}
-			} else {
-				return arr;
-			}
-		}
-	}
-
-	/**
-	 * 排序显示数据
-	 * @param obj
-	 */
-	function onSortChange(obj: ObjAny) {
-		if (!tableConfig.value.config?.sort) {
-			paginat.order = orderMap[obj.order] || '';
-			paginat.prop = obj.field || obj.prop;
-			paginat.current = 1;
-			getData();
-		}
-	}
-
-	function onSizeChange() {
-		paginat.current = 1;
-		getData();
-	}
-	function onCurrentChange() {
-		getData();
-	}
-
-	function onListEvents(...arr: any) {
-		console.log('onListEvents', arr);
-		emit('list-events', ...arr);
-	}
-
-	/**
-	 * 初次加载数据
-	 */
-	function initData(callback?: () => void) {
-		paginat.current = 1;
-		getData({}, callback);
-	}
-	/**
-	 * 清除缓存数据
-	 */
-	function clean() {
-		refTable.value?.clearSelection();
-		console.log('clean');
-		emit('selection', []);
-	}
-
-	function getParam(param: ObjAny) {
-		const arr: Array<keyof PaginatType> = [
-			'current',
-			'pageSize',
-			'prop',
-			'order',
-		];
-		let data: ObjAny = {};
-		if (typeof tableConfig.value.ajax === 'object') {
-			data = tableConfig.value.ajax?.data ?? {};
-		}
-		for (const key of arr) {
-			const current = data[key] ?? mpagconfig.data[key];
-			setObjValue(param, current, paginat[key]);
-		}
-
-		return param;
-	}
-
-	/**
-	 * 获取接口数据
-	 * @param p
-	 * @param callback
-	 */
-	function getData(p: ObjAny = {}, callback?: (d?: ObjAny) => void) {
-		clean();
-		loading.value = true;
-		let ajaxConfig = props.ajaxConfig;
-		let ajax = props.ajax;
-		if (typeof tableConfig.value.ajax === 'object') {
-			ajaxConfig = ajaxConfig ?? tableConfig.value.ajax?.config;
-			ajax = ajax ?? tableConfig.value.ajax?.url;
-		} else {
-			ajax = ajax ?? tableConfig.value.ajax;
-		}
-		comHandle(
-			{
-				onRequestBefore: inParamFilter,
-				onRequestAfter: inDataFilter,
-				ajax,
-				ajaxConfig,
-				value: props.value,
-				param: {},
-			},
-			getParam({
-				...props.param,
-				...p,
-			}),
-		)
-			.then((list: TableData) => {
-				let dlist = list?.list || [];
-				if (dlist instanceof Array === false) {
-					dlist = [dlist];
-				}
-				if (
-					tableConfig.value.paginat?.is &&
-					dlist.length > paginat.pageSize
-				) {
-					dlist = dlist.slice(0, paginat.pageSize);
-				}
-				data.list = defaultSort(dlist);
-				data.total = list?.total || dlist.length;
-				loading.value = false;
-				if (callback) {
-					callback(data);
-				}
-			})
-			.catch(() => {
-				loading.value = false;
-				if (callback) {
-					callback();
-				}
-			});
-	}
-
-	/**
-	 * 请求前过滤数据
-	 * @param obj
-	 */
-	function inParamFilter(obj: ObjStr): ObjStr {
-		let before: string | Function | undefined = props.onRequestBefore;
-		if (typeof tableConfig.value.ajax === 'object') {
-			before = before ?? tableConfig.value.ajax?.onRequestBefore;
-		}
-		if (before) {
-			return executionMethod(before, obj);
-		} else {
-			return obj;
-		}
-	}
-
-	/**
-	 * 请求成功后过滤数据
-	 * @param data
-	 * @param obj
-	 */
-	function inDataFilter(data: ObjAny, obj: ObjAny) {
-		let after: string | Function | undefined = props.onRequestAfter;
-		let ajaxData: ObjAny = {};
-		if (typeof tableConfig.value.ajax === 'object') {
-			ajaxData = tableConfig.value.ajax?.data ?? {};
-			after = after ?? tableConfig.value.ajax?.onRequestAfter;
-		}
-		if (after) {
-			return executionMethod(after, data, obj);
-		} else {
-			const l = ajaxData?.list ?? mpagconfig.data.list;
-			const t = ajaxData?.total ?? mpagconfig.data.total;
-			const list = (getObjValue(l, data) ?? data) as ObjAny[];
-			const total = t == '' ? list.length : getObjValue(t, data);
-			return {
-				list: list,
-				total: total,
-			};
-		}
-	}
-
-	if (props.load || tableConfig.value.load) {
-		initData();
-	}
-
-	const height = computed(() => {
-		return tableConfig.value.config?.height ?? 'auto';
-	});
-
-	return {
-		height,
-		tableConfig,
-		tableList,
-		onRadioChange,
-		getSelection,
-		initData,
-		getData,
-		empty,
-		loading,
-		onSortChange,
-		onListEvents,
-		onSelect,
-		onRowClick,
-		onChange,
-		pagconfig,
-		formEvent,
-		onSizeChange,
-		onCurrentChange,
-		paginat,
-		data,
-	};
-};

package/dist/components/tables/common/table-but.vue

@@ -1,124 +0,0 @@
-<template>
-	<span class="table-but">
-		<ElButton
-			v-for="(item, index) in valueArr"
-			class="table-but-li"
-			:key="index"
-			:class="item.class"
-			:style="item.style"
-			@click="onClick(item, $event)"
-			:type="item.type"
-			:round="item.round"
-			:text="typeof item.text == 'undefined' ? true : item.text"
-		>
-			{{ item.value }}
-		</ElButton>
-	</span>
-</template>
-<script lang="ts" setup>
-	import { ElButton } from 'element-plus';
-	import { eventAliass } from './util';
-	import { isObject } from '@fangzhongya/utils/basic/object/isObject';
-	import { isArray } from '@fangzhongya/utils/basic/array/isArray';
-	import { computed } from 'vue';
-	const props = defineProps({
-		/**
-		 * table列表
-		 * {
-		 *      label:"列表名称"
-		 *      prop:"列表取值"
-		 *      type:"列表类型"
-		 * }
-		 *
-		 */
-		tableListObj: {
-			type: Object,
-			default() {
-				return {};
-			},
-		},
-		/**
-		 * table数据
-		 * row, column, $index
-		 *
-		 */
-		tableScope: {
-			type: Object,
-			default() {
-				return {};
-			},
-		},
-	});
-	const emit = defineEmits(['scope-click']);
-	/**
-	 * 设置值
-	 */
-	function setValue(v: any) {
-		if (isArray(v)) {
-			return v;
-		} else if (isObject(v)) {
-			return [v];
-		} else {
-			return [
-				{
-					value: v,
-				},
-			];
-		}
-	}
-
-	function getValue(
-		row: ObjAny,
-		column: ObjAny,
-		cellValue: any,
-		index: number,
-		formatter?: Function,
-	) {
-		if (formatter) {
-			const v = formatter(row, column, cellValue, index);
-			return setValue(v);
-		} else {
-			return setValue(cellValue);
-		}
-	}
-
-	function onClick(obj: ObjAny, $event: Event) {
-		// const onClick = props.list?.onClick;
-		// if (onClick) {
-		//     onClick(obj, props.scope, props.list, 'but');
-		// }
-		eventAliass(
-			(callback: Function) => {
-				callback(obj, props.tableScope, props.tableListObj, 'but');
-			},
-			'click',
-			props.tableListObj,
-			$event,
-		);
-		emit('scope-click', obj, props.tableScope, props.tableListObj, 'but');
-	}
-
-	/**
-	 * {
-	 *     value: 展示文字
-	 *     class: 设置样式
-	 *     style: 设置样式
-	 * }
-	 */
-	const valueArr = computed(() => {
-		const prop = props.tableListObj.prop || '';
-		const row = props.tableScope.row || {};
-		const column = props.tableScope.column || {};
-		const cellValue = row[prop];
-		const index = props.tableScope.$index;
-		const formatter = props.tableListObj.formatter;
-		const configFormatter = props.tableListObj.config?.formatter;
-		if (configFormatter) {
-			const arr = configFormatter(row, column, cellValue, index);
-			return setValue(arr);
-		} else {
-			return getValue(row, column, cellValue, index, formatter);
-		}
-	});
-</script>
-<style lang="scss" scoped></style>