@fangzhongya/fang-ui 0.0.21 → 0.0.22

package/dist/components/select-popover/src/index.vue

@@ -1,167 +0,0 @@
-<template>
-	<Popover
-		trigger="click"
-		:popper-class="cs.z('popper')"
-		:visible="visible"
-		:disabled="props.disabled"
-		:width="width"
-	>
-		<slot :name="dataSlot.default"></slot>
-		<template #reference>
-			<div
-				:class="[cs.z(), cs.is('disabled', props.disabled)]"
-				v-bind="attrs.root"
-				@click="onClick"
-			>
-				<Inputs
-					ref="refInput"
-					v-expose="{}"
-					v-model="value"
-					v-bind="attrs.assem"
-					:disabled="props.disabled"
-					:readonly="props.readonly"
-					@input="onInput"
-					@focus="onFocus"
-					@blur="onBlur"
-					:clearable="false"
-				>
-					<template
-						v-for="(k, index) in Object.keys(slots)"
-						v-slot:[k]
-						:key="k"
-					>
-						<slot :name="k"></slot>
-					</template>
-					<template #suffix>
-						<span
-							v-if="isclear"
-							:class="[cs.z('select-icon'), 'clear']"
-							@click.stop="onClear"
-						>
-							<svg
-								viewBox="0 0 1024 1024"
-								xmlns="http://www.w3.org/2000/svg"
-								data-v-ea893728=""
-							>
-								<path
-									fill="currentColor"
-									d="m466.752 512-90.496-90.496a32 32 0 0 1 45.248-45.248L512 466.752l90.496-90.496a32 32 0 1 1 45.248 45.248L557.248 512l90.496 90.496a32 32 0 1 1-45.248 45.248L512 557.248l-90.496 90.496a32 32 0 0 1-45.248-45.248L466.752 512z"
-								></path>
-								<path
-									fill="currentColor"
-									d="M512 896a384 384 0 1 0 0-768 384 384 0 0 0 0 768zm0 64a448 448 0 1 1 0-896 448 448 0 0 1 0 896z"
-								></path>
-							</svg>
-						</span>
-						<slot name="suffix"></slot>
-						<span
-							:class="[
-								cs.z('select-icon'),
-								cs.is('reverse', visible),
-							]"
-						>
-							<slot :name="dataSlot.iconSelect">
-								<svg
-									viewBox="0 0 1024 1024"
-									xmlns="http://www.w3.org/2000/svg"
-									data-v-ea893728=""
-								>
-									<path
-										fill="currentColor"
-										d="M831.872 340.864 512 652.672 192.128 340.864a30.592 30.592 0 0 0-42.752 0 29.12 29.12 0 0 0 0 41.6L489.664 714.24a32 32 0 0 0 44.672 0l340.288-331.712a29.12 29.12 0 0 0 0-41.728 30.592 30.592 0 0 0-42.752 0z"
-									></path>
-								</svg>
-							</slot>
-						</span>
-					</template>
-				</Inputs>
-			</div>
-		</template>
-	</Popover>
-</template>
-<script lang="ts" setup>
-	import vExpose from '../../../directives/expose';
-	import { getCss } from '@fangzhongya/utils/css/getCss';
-	import { dataProps, dataEmits, dataExpose, dataSlot } from './data';
-	import Popover from '../../popover/index';
-	import Inputs from '../../inputs/index';
-	import { useCssName, useLocale, useInherit } from '../../../hooks/index';
-	import { useSlots, computed, ref, onMounted, nextTick } from 'vue';
-	import type { Slots } from 'vue';
-	const attrs = useInherit();
-	const slots: Slots = useSlots();
-	// 获取国际化字段
-	const { getLocale } = useLocale();
-	// 样式设置方法
-	const cs = useCssName('select-popover');
-	const props = defineProps(dataProps);
-	const emit = defineEmits(dataEmits);
-	const visible = ref(false);
-	const width = ref(200);
-	const refInput = ref();
-	const isfocus = ref(false);
-	const isFiletr = ref(false);
-	const value = computed({
-		get() {
-			let v = props.modelValue;
-			return v;
-		},
-		set(value) {
-			emit('update:modelValue', value);
-		},
-	});
-
-	const isclear = computed(() => {
-		if (props.readonly) {
-			return false;
-		}
-		if (props.clearable && value.value && isfocus.value) {
-			return true;
-		}
-		return false;
-	});
-	function setWidth() {
-		if (refInput.value && refInput.value.el) {
-			width.value = getCss(refInput.value.el, 'width');
-		}
-	}
-	function onInput(v: string, ...arr: any[]) {
-		emit('input', v, ...arr);
-	}
-	let timeout: NodeJS.Timeout;
-	function onBlur(...arr: any[]) {
-		emit('blur', ...arr);
-		timeout = setTimeout(() => {
-			isfocus.value = false;
-			visible.value = false;
-		}, 200);
-	}
-	function clearBlur() {
-		clearTimeout(timeout);
-	}
-	function onFocus(...arr: any[]) {
-		isfocus.value = true;
-		clearBlur();
-		emit('focus', ...arr);
-	}
-	function onClear() {
-		clearBlur();
-		value.value = '';
-		refInput.value.focus();
-	}
-	function onClick() {
-		if (!props.readonly) {
-			isFiletr.value = false;
-			visible.value = !visible.value;
-		}
-	}
-	onMounted(() => {
-		setWidth();
-	});
-	defineOptions({ inheritAttrs: false });
-	defineExpose({
-		...dataExpose,
-	});
-</script>
-
-<style lang="scss"></style>

package/dist/components/select-scroll/index.ts

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

package/dist/components/select-scroll/src/data.ts

@@ -1,56 +0,0 @@
-import type { ExtractPropTypes } from 'vue';
-
-export const dataProps = {
-	options: {
-		type: Array,
-		default() {
-			return [];
-		},
-	},
-	label: {
-		type: String,
-		default: 'label',
-	},
-	height: {
-		type: String,
-		default: '34px',
-	},
-	limit: {
-		type: Number,
-		default: 2,
-	},
-	// 页面没有显示无法滚动
-	modelValue: {
-		type: Number,
-		default: 0,
-	},
-	max: {
-		type: Number,
-	},
-	min: {
-		type: Number,
-	},
-};
-
-export type DataProps = ExtractPropTypes<typeof dataProps>;
-
-/**
- * @emits change (val:[String, Array])
- * 选择的时间
- */
-export const dataEmits = ['update:modelValue'];
-
-export type DataEmits = typeof dataEmits;
-
-/**
- * @slot default 默认插槽
- */
-export const dataSlot = {
-	default: 'default',
-};
-
-/**
- * @expose setValue (val:<string>设置的数据 )
- * 设置值
- */
-export const dataExpose = {};

package/dist/components/select-scroll/src/index.vue

@@ -1,225 +0,0 @@
-<template>
-	<div :class="cs.z()">
-		<div
-			:class="cs.z('div')"
-			:style="{
-				height: h * (props.limit * 2 + 1) + 'px',
-			}"
-		>
-			<div :class="cs.z('box')">
-				<div
-					:class="cs.z('after')"
-					:style="{
-						'margin-top': (h / 2) * -1 + 'px',
-					}"
-				></div>
-				<div
-					:class="cs.z('before')"
-					:style="{
-						'margin-top': h / 2 + 'px',
-					}"
-				></div>
-				<div ref="refScroll" :class="cs.z('list')">
-					<div
-						v-for="(item, ind) in props.options"
-						:class="[cs.z('list-li'), setClass(ind, item)]"
-						@click.stop="onClick(ind, item)"
-						:style="{
-							height: h + 'px',
-							'line-height': h + 'px',
-							'margin-top':
-								ind == 0 ? h * props.limit + 'px' : '',
-							'margin-bottom':
-								ind == props.options.length - 1
-									? h * props.limit + 'px'
-									: '',
-						}"
-					>
-						{{ useVueValue(item, props.label) }}
-					</div>
-				</div>
-			</div>
-		</div>
-	</div>
-</template>
-<script lang="ts" setup>
-	import { dataProps, dataEmits, dataExpose, dataSlot } from './data';
-	import { useCssName } from '../../../hooks/cssname';
-	import { useVueValue } from '../../common/use';
-	import { onMounted, computed, ref, watch, onBeforeUnmount } from 'vue';
-	// 样式设置方法
-	const cs = useCssName('select-scroll');
-	const props = defineProps(dataProps);
-	const emit = defineEmits(dataEmits);
-
-	const h = computed(() => {
-		let h = props.height || '';
-		return Number(h.replace('px', ''));
-	});
-
-	let timeout: any;
-	const refScroll = ref();
-
-	const index = ref(0);
-
-	watch(
-		() => index.value,
-		() => {
-			setScroll(index.value);
-			emit('update:modelValue', index.value);
-		},
-	);
-
-	watch(
-		() => props.modelValue,
-		() => {
-			setPropsValue();
-		},
-	);
-
-	function setClass(index: number, _obj?: any) {
-		if (props.max) {
-			if (index > props.max) {
-				return 'hide';
-			}
-		}
-		if (props.min) {
-			if (index < props.min) {
-				return 'hide';
-			}
-		}
-	}
-	function onReplace(key: number) {
-		let k = props.options.length;
-		if (key == 1) {
-			if (index.value < k && !setClass(index.value)) {
-				index.value++;
-			}
-		} else {
-			if (index.value > 0 && !setClass(index.value)) {
-				index.value--;
-			}
-		}
-	}
-	function onClick(i: number, obj: any) {
-		if (!setClass(i)) {
-			index.value = i;
-		}
-	}
-
-	function setScroll(value: number) {
-		if (refScroll.value) {
-			let v = h.value * value;
-			refScroll.value.scrollTop = v;
-		}
-	}
-
-	function setMinMax(v: number) {
-		if (props.min && v < props.min) {
-			v = props.min;
-		} else if (props.max && v > props.max) {
-			v = props.max;
-		}
-		setScroll(v);
-	}
-
-	function setPropsValue() {
-		let v = props.modelValue;
-		if (!setClass(v)) {
-			setScroll(v);
-		} else {
-			setMinMax(v);
-		}
-	}
-
-	function getScroll() {
-		clearTimeout(timeout);
-		timeout = setTimeout(() => {
-			if (refScroll.value) {
-				let r = refScroll.value.scrollTop;
-				let v = Math.round(r / h.value);
-				if (!setClass(v)) {
-					index.value = v;
-				} else {
-					setMinMax(v);
-				}
-			}
-		}, 200);
-	}
-
-	function handleScroll() {
-		if (refScroll.value) {
-			refScroll.value.addEventListener('scroll', () => {
-				getScroll();
-			});
-		}
-	}
-	onMounted(() => {
-		handleScroll();
-		setPropsValue();
-	});
-	onBeforeUnmount(() => {
-		if (refScroll.value) {
-			refScroll.value.removeEventListener('scroll', () => {}); // 离开当前组件别忘记移除事件监听
-		}
-	});
-	defineExpose({
-		...dataExpose,
-	});
-</script>
-<style lang="scss" scoped>
-	$select-scrolls: 'select-scroll';
-	.#{$select-scrolls} {
-		flex: 1;
-		float: left;
-		display: flex;
-		flex-direction: column;
-		width: 148px;
-		&:first-child {
-			margin-right: 12px;
-		}
-		.#{$select-scrolls}-div {
-			display: flex;
-			padding: 2px;
-			overflow: hidden;
-			// border: 1px solid #ccc;
-			.#{$select-scrolls}-box {
-				position: relative;
-				width: 140px;
-				overflow: hidden;
-				.#{$select-scrolls}-after,
-				.#{$select-scrolls}-before {
-					position: absolute;
-					top: 50%;
-					width: 100%;
-					z-index: 0;
-					border-top: 1px solid var(--el-border-color-lighter);
-					height: 1px;
-				}
-			}
-			.#{$select-scrolls}-list {
-				width: 156px;
-				height: 100%;
-				overflow: auto;
-				&:first-child {
-					padding-right: 4px;
-				}
-				&:last-child {
-					padding-left: 4px;
-				}
-				.#{$select-scrolls}-list-li {
-					padding: 0 20px 0 7px;
-					text-align: center;
-					&:hover {
-						background-color: var(--el-color-primary);
-						cursor: pointer;
-					}
-					&.hide {
-						color: #a8abb2;
-						cursor: not-allowed;
-					}
-				}
-			}
-		}
-	}
-</style>

package/dist/components/selector/index.ts

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

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

@@ -1,57 +0,0 @@
-import type { ExtractPropTypes } from 'vue';
-
-export const dataProps = {
-	rangeSeparator: { type: String, default: '至' },
-	startPlaceholder: { type: String, default: '开始' },
-	endPlaceholder: { type: String, default: '结束' },
-	clearable: {
-		type: Boolean,
-		default: true,
-	},
-
-	disabled: { type: Boolean, default: false },
-	width: {
-		type: [String, Number],
-		default: '320px',
-	},
-	options: {
-		type: Array,
-		default() {
-			return [];
-		},
-	},
-	prop: {
-		type: String,
-		default: 'value',
-	},
-	label: {
-		type: String,
-		default: 'label',
-	},
-	modelValue: {
-		type: Array,
-	},
-};
-
-export type DataProps = ExtractPropTypes<typeof dataProps>;
-
-/**
- * @emits change (val:[String, Array])
- * 选择的时间
- */
-export const dataEmits = ['update:modelValue', 'change'];
-
-export type DataEmits = typeof dataEmits;
-
-/**
- * @slot default 默认插槽
- */
-export const dataSlot = {
-	default: 'default',
-};
-
-/**
- * @expose setValue (val:<string>设置的数据 )
- * 设置值
- */
-export const dataExpose = {};