@fangzhongya/fang-ui 0.0.21 → 0.0.23

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

@@ -1,293 +0,0 @@
-<template>
-	<div :class="cs.z()" v-bind="attrs.root">
-		<VxeTable
-			v-bind="attrs.assem"
-			ref="tableRef"
-			:height="props.height == 'auto' ? '' : props.height"
-			:class="[cs.z('table'), cs.is('absolute', props.adaptive)]"
-			:size="size"
-			:loading="props.loading"
-			:column-config="config.column"
-			:row-style="rowStyle"
-			:row-config="config.row"
-			:seq-config="config.seq"
-			:sort-config="config.sort"
-			:checkbox-config="config.checkbox"
-			:radio-config="config.radio"
-			:data="props.value"
-			@cell-click="onCellClick"
-			@sort-change="sortChange"
-			@checkbox-all="selectAllChangeEvent"
-			@checkbox-change="selectChangeEvent"
-			@click.stop="onClick"
-		>
-			<TableColumns
-				:table="attrs.assem"
-				:vxeconfig="config"
-				:value="props.value"
-				:list="props.list"
-				:options="props.options"
-				:isComponSelected="isComponSelected"
-				@list-events="onListEvents"
-			>
-				<template
-					v-for="k of Object.keys(slots).filter(
-						(v) => !['empty', 'no-data'].includes(v),
-					)"
-					#[k]="scope"
-					:key="k"
-				>
-					<slot :name="k" v-bind="scope"></slot>
-				</template>
-			</TableColumns>
-			<template #empty>
-				<slot name="no-data">
-					<div :class="cs.z('no-data')">
-						<span>暂无数据</span>
-					</div>
-				</slot>
-			</template>
-		</VxeTable>
-	</div>
-</template>
-<script lang="ts" setup>
-	// import 'vxe-table/es/style.css';
-	import { VxeTable } from 'vxe-table/es/table';
-	import { dataProps, dataEmits, dataExpose } from './data';
-	import {
-		provide,
-		useAttrs,
-		useSlots,
-		ref,
-		onMounted,
-		computed,
-		watch,
-	} from 'vue';
-
-	import TableColumns from './columns.vue';
-	import { uesObjComponSelected } from '../../common/use';
-	import { useInherit } from '../../../hooks/inherit';
-	import { useCssName } from '../../../hooks/cssname';
-	import { getCompons } from '../../common/compons';
-	import type { Slots } from 'vue';
-
-	const cs = useCssName('vtables');
-
-	const slots: Slots = useSlots();
-	const attrs = useInherit(useAttrs());
-
-	const props = defineProps(dataProps);
-
-	provide('tables-compons', getCompons(props.compons));
-
-	const tableRef = ref();
-
-	const emit = defineEmits(dataEmits);
-
-	/**是否单行显示 */
-
-	const rowObj = ref();
-
-	const isfocus = ref(false);
-
-	function onClick() {
-		isfocus.value = true;
-	}
-
-	function isComponSelected(obj: ObjAny, scope: ObjAny) {
-		if (uesObjComponSelected(obj, props)) {
-			if (rowObj.value === scope.row) {
-				if (isfocus.value) {
-					return true;
-				} else {
-					return false;
-				}
-			} else {
-				return false;
-			}
-		} else {
-			return true;
-		}
-	}
-
-	/**是否单行显示 */
-
-	// 排序
-	let isSort = false;
-	// setTimeout(() => {
-	//   isSort = false
-	// }, 400)
-
-	const orderMap: {
-		[key: string]: 'asc' | 'desc';
-	} = {
-		asc: 'asc',
-		ascending: 'asc',
-		desc: 'desc',
-		descending: 'desc',
-	};
-
-	const sizeMap: ObjStr = {
-		large: '',
-		default: 'medium',
-		small: 'small',
-	};
-
-	type SizeMap = '' | 'medium' | 'small';
-
-	const size = computed<SizeMap>(() => {
-		return (sizeMap[props.size] || '') as SizeMap;
-	});
-
-	const tableDefaultSort = computed<{
-		prop: string;
-		order: 'asc' | 'desc' | '';
-	}>(() => {
-		return {
-			prop: props.defaultSort?.prop,
-			order: orderMap[props.defaultSort?.order] || '',
-		};
-	});
-
-	const setHover = () => {
-		const is = attrs.assem.highlightCurrentRow as boolean;
-		if (is === true) {
-			return true;
-		} else {
-			return false;
-		}
-	};
-
-	const config = ref({
-		nocustomize: attrs.assem.__B('nocustomize'),
-		row: {
-			isCurrent: setHover(),
-			isHover: setHover(),
-		},
-		column: {
-			minWidth: attrs.assem.minWidth as string | number,
-			resizable: attrs.assem.resizable as boolean,
-		},
-		sort: {
-			remote: Boolean(attrs.assem.sort),
-			defaultSort: {
-				field: tableDefaultSort.value.prop,
-				order: tableDefaultSort.value.order,
-			},
-		},
-		seq: {},
-		checkbox: {
-			trigger: attrs.assem.noRowSelect ? 'cell' : 'row',
-		} as {
-			trigger: '' | 'default' | 'row' | 'cell' | 'manual';
-		},
-		radio: {
-			trigger: attrs.assem.noRowSelect ? 'cell' : 'row',
-		} as {
-			trigger: '' | 'default' | 'row' | 'cell';
-		},
-	});
-
-	type RowStyle = {
-		[key: string]: string | number;
-	};
-
-	const rowStyle = computed<RowStyle>(() => {
-		const height = props.lineHeight;
-		const rowStyle = attrs.assem.rowStyle as RowStyle;
-		if (height) {
-			if (rowStyle) {
-				if (typeof rowStyle == 'object') {
-					// @ts-ignore
-					rowStyle['height'] = height + 'px';
-					return rowStyle;
-				} else {
-					return rowStyle;
-				}
-			} else {
-				return {
-					height: height + 'px',
-				} as RowStyle;
-			}
-		} else {
-			return {
-				height: '',
-				...rowStyle,
-			};
-		}
-	});
-	watch(tableDefaultSort, (newValue, oldValue) => {
-		let prop = tableDefaultSort.value.prop;
-		let order = tableDefaultSort.value.order;
-		if (tableRef.value) {
-			if (prop) {
-				isSort = true;
-				tableRef.value.sort(prop, order);
-			} else {
-				tableRef.value.clearSort();
-			}
-		}
-	});
-	function sortChange(obj: any) {
-		if (isSort) {
-			isSort = false;
-			return false;
-		}
-		emit('sort-change', obj);
-	}
-
-	function onListEvents(key: string, ...arr: any[]) {
-		if (key == 'checkbox-all') {
-			const $table = tableRef.value;
-			if ($table) {
-				$table.toggleAllCheckboxRow();
-				selectChangeEvent({
-					records: $table.getCheckboxRecords(),
-				});
-			}
-		} else {
-			emit('list-events', key, ...arr);
-		}
-	}
-
-	function selectAllChangeEvent(obj: ObjAny) {
-		const arr = obj.records;
-		emit('selection-change', arr);
-	}
-
-	function selectChangeEvent(obj: ObjAny) {
-		const arr = obj.records;
-		emit('selection-change', arr);
-	}
-
-	function onCellClick(scope: any) {
-		rowObj.value = scope.row;
-		// emit('row-click', scope.row, scope.row, scope)
-	}
-
-	function toggleRowSelection(row: any) {
-		tableRef.value.toggleRowSelection(row);
-	}
-
-	function clearSelection() {
-		tableRef.value.clearCheckboxRow();
-	}
-
-	function clearRadioRow() {
-		tableRef.value.clearRadioRow();
-	}
-
-	onMounted(() => {
-		if (window) {
-			window.addEventListener('click', () => {
-				isfocus.value = false;
-			});
-		}
-	});
-
-	defineExpose({
-		...dataExpose,
-		clearSelection,
-		clearRadioRow,
-	});
-</script>

package/dist/components/window/index.ts

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

package/dist/components/window/src/data.ts

@@ -1,110 +0,0 @@
-import type { ExtractPublicPropTypes } from 'vue';
-
-import { buildProps } from '../../../utils/vues/buildProps';
-import { definePropType } from '../../../utils/vues/definePropType';
-
-import {
-	dataProps as BoxProps,
-	dataEmits as BoxEmits,
-	dataExpose as BoxExpose,
-	dataSlot as BoxSlot,
-} from '../../box/src/data';
-
-type Pallet = {
-	add: (s: symbol, a: () => void, r: () => void, t?: string) => void;
-	remove: (s: symbol, t?: string) => void;
-	[key: string]: any;
-};
-
-export const dataProps = buildProps({
-	...BoxProps,
-	/**
-	 * @props { String, Boolean } drag='.com-title-name' ( ) 可拖拽的元素样式 为空字符串就不拖拽
-	 */
-	drag: {
-		type: [String, Boolean],
-		default: '.com-title-name',
-	},
-	/**
-	 * @props { Boolean } adjust=true ( ) 是否支持改变大小
-	 */
-	adjust: {
-		type: Boolean,
-		default: true,
-	},
-	/**
-	 * @props { Boolean } mask=true ( ) 是否要遮罩
-	 */
-	mask: {
-		type: Boolean,
-		default: true,
-	},
-	/**
-	 * @props { Boolean } maskClose=false ( ) 是否要遮罩是否关闭
-	 */
-	maskClose: {
-		type: Boolean,
-		default: false,
-	},
-	/**
-	 * @props {Object} pallet= ( ) 最小化的托盘对象或者设置方法
-	 */
-	pallet: {
-		type: definePropType<Pallet>(Object),
-	},
-
-	/**
-	 * @props {Boolean} minChange=true ( ) 是否允许在最小化后改变值
-	 */
-	minChange: {
-		type: Boolean,
-		default: true,
-	},
-	/**
-	 * @props {Boolean} closeHave=true ( ) 关闭后是否保持位置
-	 */
-	closeHave: {
-		type: Boolean,
-		default: true,
-	},
-	/**
-	 * @props {Boolean} noMin=false ( ) 是否不要最小化
-	 */
-	noMin: {
-		type: Boolean,
-		default: false,
-	},
-	/**
-	 * @props { Boolean } often= ( ) 是否时时变化
-	 */
-	often: {
-		type: Boolean,
-	},
-	max: {
-		type: Boolean,
-	},
-});
-
-export type DataProps = ExtractPublicPropTypes<typeof dataProps>;
-
-/**
- */
-export const dataEmits = [...BoxEmits, 'minimize', 'changesize'];
-
-export type DataEmits = typeof dataEmits;
-
-/**
- * @slot icon-min 最小化图标
- * @slot icon-max 最大化图标
- * @slot icon-full 全屏图标
- */
-export const dataSlot = {
-	...BoxSlot,
-	'icon-min': 'icon-min',
-	'icon-max': 'icon-max',
-	'icon-full': 'icon-full',
-};
-
-/**
- */
-export const dataExpose = { ...BoxExpose };

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

@@ -1,305 +0,0 @@
-<template>
-	<BoxTeleport :disabled="props.disabled" :to="props.to">
-		<template v-if="!isClose">
-			<div ref="refBox" :class="cs.z()">
-				<BoxMask
-					v-if="props.mask"
-					@click="onMaskClose"
-					:cssprefix="cs.z()"
-				></BoxMask>
-				<div
-					ref="refBody"
-					v-drag="{
-						dom: props.drag,
-						onMousedown: onMousedown,
-					}"
-					v-adjust="{
-						often: props.often,
-						onChange: onChangeAdjust,
-						all: { position: true, getDisabled: getDisabled },
-					}"
-					:class="cs.z('body')"
-				>
-					<slot :name="dataSlot.title">
-						<BoxTitle
-							:cssprefix="cs.z()"
-							@close="onClose"
-							:title="props.title"
-						>
-							<template #icon>
-								<i
-									v-if="!props.noMin"
-									:title="getLocale('minh')"
-									@click="onMin"
-									:class="cs.z('title-min')"
-								>
-									<slot :name="dataSlot['icon-min']">
-										<svg
-											viewBox="0 0 1024 1024"
-											xmlns="http://www.w3.org/2000/svg"
-											data-v-ea893728=""
-										>
-											<path
-												fill="currentColor"
-												d="M128 544h768a32 32 0 1 0 0-64H128a32 32 0 0 0 0 64z"
-											></path>
-										</svg>
-									</slot>
-								</i>
-								<i
-									:title="getLocale(isMax ? 'tmaxh' : 'maxh')"
-									@click="onMax"
-									:class="cs.z('title-max')"
-								>
-									<template v-if="isMax">
-										<slot :name="dataSlot['icon-full']">
-											<svg
-												viewBox="0 0 1024 1024"
-												xmlns="http://www.w3.org/2000/svg"
-												data-v-ea893728=""
-											>
-												<path
-													fill="currentColor"
-													d="m160 96.064 192 .192a32 32 0 0 1 0 64l-192-.192V352a32 32 0 0 1-64 0V96h64v.064zm0 831.872V928H96V672a32 32 0 1 1 64 0v191.936l192-.192a32 32 0 1 1 0 64l-192 .192zM864 96.064V96h64v256a32 32 0 1 1-64 0V160.064l-192 .192a32 32 0 1 1 0-64l192-.192zm0 831.872-192-.192a32 32 0 0 1 0-64l192 .192V672a32 32 0 1 1 64 0v256h-64v-.064z"
-												></path>
-											</svg>
-										</slot>
-									</template>
-									<template v-else>
-										<slot :name="dataSlot['icon-max']">
-											<svg
-												viewBox="0 0 1024 1024"
-												xmlns="http://www.w3.org/2000/svg"
-												data-v-ea893728=""
-											>
-												<path
-													fill="currentColor"
-													d="m512 747.84 228.16 119.936a6.4 6.4 0 0 0 9.28-6.72l-43.52-254.08 184.512-179.904a6.4 6.4 0 0 0-3.52-10.88l-255.104-37.12L517.76 147.904a6.4 6.4 0 0 0-11.52 0L392.192 379.072l-255.104 37.12a6.4 6.4 0 0 0-3.52 10.88L318.08 606.976l-43.584 254.08a6.4 6.4 0 0 0 9.28 6.72L512 747.84zM313.6 924.48a70.4 70.4 0 0 1-102.144-74.24l37.888-220.928L88.96 472.96A70.4 70.4 0 0 1 128 352.896l221.76-32.256 99.2-200.96a70.4 70.4 0 0 1 126.208 0l99.2 200.96 221.824 32.256a70.4 70.4 0 0 1 39.04 120.064L774.72 629.376l37.888 220.928a70.4 70.4 0 0 1-102.144 74.24L512 820.096l-198.4 104.32z"
-												></path>
-											</svg>
-										</slot>
-									</template>
-								</i>
-							</template>
-						</BoxTitle>
-					</slot>
-					<div :class="cs.z('body-div')">
-						<slot :name="dataSlot.default"></slot>
-					</div>
-					<slot :name="dataSlot.footer"> </slot>
-				</div>
-			</div>
-		</template>
-	</BoxTeleport>
-</template>
-<script lang="ts" setup>
-	/**
-	 * :class 修改样式时页面dom进行了更新
-	 */
-	import { getCss } from '@fangzhongya/utils/css/getCss';
-	import { setCss } from '@fangzhongya/utils/css/setCss';
-	import { dataProps, dataEmits, dataExpose, dataSlot } from './data';
-	import { useCssName } from '../../../hooks/cssname';
-	import { useLocale } from '../../../hooks/locale';
-	// import BoxTitle from '../../common/box-title.vue';
-	// import BoxMask from '../../common/box-mask.vue';
-	// import BoxTeleport from '../../common/box-teleport.vue';
-
-	// import BoxTitle from '../../box-titleindex';
-	// import BoxMask from '../../box-maskindex';
-	// import BoxTeleport from '../../box-teleportindex';
-	import vAdjust from '../../../directives/adjust';
-	import BoxTitle from '../../box-title/index';
-	import BoxMask from '../../box-mask/index';
-	import BoxTeleport from '../../box-teleport/index';
-	import { setClassName } from '@fangzhongya/utils/css/setClassName';
-	import vDrag from '../../../directives/drag';
-	import {
-		watch,
-		shallowRef,
-		computed,
-		onUnmounted,
-		onMounted,
-		nextTick,
-	} from 'vue';
-	// 创建唯一数
-	const wykey = Symbol('Window-' + new Date().getTime() + Math.random());
-	const refBody = shallowRef();
-	// 获取国际化字段
-	const { getLocale } = useLocale();
-	// 样式设置方法
-	const cs = useCssName('window');
-	const props = defineProps(dataProps);
-	const emit = defineEmits(dataEmits);
-	const isMax = shallowRef(props.max);
-	const isMin = shallowRef(false);
-	const isClose = shallowRef(true);
-
-	const refBox = shallowRef();
-	const position = shallowRef<{
-		[key: string]: number;
-	}>({});
-
-	watch(
-		() => props.modelValue,
-		() => {
-			if (props.modelValue) {
-				isClose.value = false;
-				isMin.value = false;
-				if (props.closeHave) {
-					nextTick(() => {
-						setPosition();
-					});
-				} else {
-					isMax.value = false;
-				}
-				setBoxClass();
-			} else {
-				isClose.value = true;
-			}
-		},
-		{ immediate: true },
-	);
-
-	function getPosition(el: HTMLDivElement) {
-		const keys = ['left', 'right', 'top', 'bottom', 'width', 'height'];
-		const obj: {
-			[key: string]: number;
-		} = {};
-		keys.forEach((key) => {
-			obj[key] = Number(getCss(el, key).replace(/[a-z|A-Z]*$/, ''));
-		});
-		return obj;
-	}
-	function setPosition() {
-		const el = refBody.value;
-		if (el && position.value) {
-			setCss(el, {
-				top: position.value.top + 'px',
-				left: position.value.left + 'px',
-				width: position.value.width + 'px',
-				height: position.value.height + 'px',
-			});
-			setMax();
-		}
-	}
-	function getDisabled() {
-		return isMax.value;
-	}
-	function onMousedown(
-		e: MouseEvent,
-		ecs: {
-			[key: string]: number;
-		},
-	) {
-		if (isMax.value) {
-			isMax.value = false;
-			ecs.left = e.clientX - position.value.width / 2;
-			return ecs;
-		}
-	}
-	const restore = () => {
-		isMin.value = false;
-	};
-	const remove = () => {
-		isClose.value = true;
-		emit('update:modelValue', false);
-		emit('close');
-	};
-	watch(
-		() => isMin.value,
-		() => {
-			setMin();
-		},
-	);
-	watch(
-		() => isMax.value,
-		() => {
-			setMax();
-		},
-	);
-	function setMin() {
-		if (refBox.value) {
-			if (isMin.value) {
-				setCss(refBox.value, 'display', 'none');
-			} else {
-				setCss(refBox.value, 'display', 'block');
-			}
-		}
-	}
-	function setMax() {
-		if (refBody.value) {
-			if (isMax.value) {
-				refBody.value.className = cs.z('body') + ' max';
-			} else {
-				refBody.value.className = cs.z('body');
-			}
-			onChangeAdjust();
-		}
-	}
-	function onMin() {
-		isMin.value = true;
-		if (props.pallet) {
-			props.pallet.add(wykey, restore, remove, props.title);
-		}
-		emit('minimize', restore, props.title, wykey);
-		if (props.minChange) {
-			emit('update:modelValue', false);
-		}
-	}
-	function onMax() {
-		if (isMax.value) {
-			isMax.value = false;
-		} else {
-			position.value = getPosition(refBody.value);
-			isMax.value = true;
-		}
-	}
-	function onMaskClose() {
-		if (props.maskClose) {
-			onClose();
-		}
-	}
-	/**
-	 * 关闭窗口
-	 */
-	function onClose() {
-		if (!isMax.value) {
-			position.value = getPosition(refBody.value);
-		}
-		if (props.pallet) {
-			props.pallet.remove(wykey, props.title);
-		}
-		remove();
-	}
-	function onChangeAdjust() {
-		emit('changesize');
-	}
-
-	function setBoxClass(oldValue: string = '') {
-		nextTick(() => {
-			setClassName(refBox.value, props.boxClass, oldValue);
-		});
-	}
-	let stop: () => void;
-	onMounted(() => {
-		stop = watch(
-			() => props.boxClass,
-			(newValue, oldValue) => {
-				setBoxClass(oldValue);
-			},
-			{ immediate: true },
-		);
-	});
-	onUnmounted(() => {
-		if (stop) {
-			stop();
-		}
-		if (props.pallet) {
-			props.pallet.remove(wykey, props.title);
-		}
-	});
-	defineExpose({
-		...dataExpose,
-	});
-</script>