v-uni-app-ui 1.0.2 → 1.0.6

package/components/model/compound/v-date-time/v-date-time.vue

@@ -1,261 +0,0 @@
-<template>
-	<v-popup v-model:value="isPopupVisible" :title="title" :scrollHeight="scrollHeight" model="semicircle" @close="handleClose" @confirm="handleConfirm">
-		<view class="drum-select-container">
-			<view class="drum-select-content">
-				<v-scroll-list
-					:value="value.getFullYear()"
-					:options="generateYearRange(props.maxDateTime.getFullYear(), props.minDateTime.getFullYear())"
-					:scrollHeight="scrollHeight"
-					@update:value="handleValueChangeYear($event)"
-				/>
-				<v-text class="separate-symbol">:</v-text>
-				<v-scroll-list
-					:value="value.getMonth() + 1"
-					:options="generateMonthRange(props.maxDateTime.getMonth(), props.minDateTime.getMonth())"
-					:scrollHeight="scrollHeight"
-					@update:value="handleValueChangeMonth($event)"
-				/>
-				<v-text class="separate-symbol">:</v-text>
-				<v-scroll-list
-					:value="value.getDate()"
-					:options="generateDateRange(props.maxDateTime.getDate(), props.minDateTime.getDate())"
-					:scrollHeight="scrollHeight"
-					@update:value="handleValueChangeDate($event)"
-				/>
-				<v-text class="separate-symbol">:</v-text>
-				<v-scroll-list
-					:value="hoursSystem ? value.getHours() || 24 : value.getHours() % 12 || 12"
-					:options="generateHoursRange(props.maxDateTime.getHours(), props.minDateTime.getHours())"
-					:scrollHeight="scrollHeight"
-					@update:value="handleValueChangeHours($event)"
-				/>
-				<v-text class="separate-symbol">:</v-text>
-				<v-scroll-list
-					:value="value.getMinutes()"
-					:options="generateMinutesRange(props.maxDateTime.getMinutes(), props.minDateTime.getMinutes())"
-					:scrollHeight="scrollHeight"
-					@update:value="handleValueChangeMinutes($event)"
-				/>
-				<v-text class="separate-symbol">:</v-text>
-				<v-scroll-list
-					:value="value.getSeconds()"
-					:options="generateSecondsRange(props.maxDateTime.getSeconds(), props.minDateTime.getSeconds())"
-					:scrollHeight="scrollHeight"
-					@update:value="handleValueChangeSeconds($event)"
-				/>
-			</view>
-		</view>
-	</v-popup>
-</template>
-
-<script lang="ts" setup>
-import { ref, computed, watch, inject } from 'vue';
-
-interface DrumSelectPicker {
-	value: any;
-	label: string;
-	children?: DrumSelectPicker[];
-}
-const props = defineProps({
-	title: {
-		type: String,
-		default: '',
-		required: true
-	},
-	scrollHeight: {
-		type: Number,
-		default: 400
-	},
-	value: {
-		type: Date,
-		default: new Date(),
-		required: true
-	},
-	show: {
-		type: Boolean,
-		default: true
-	},
-	minDateTime: {
-		type: Date,
-		default: new Date('1000-1-1'),
-		required: true
-	},
-	maxDateTime: {
-		type: Date,
-		default: new Date('9999-12-31'),
-		required: true
-	},
-	hoursSystem: {
-		type: Boolean,
-		default: false
-	}
-});
-
-const emit = defineEmits([
-	'update:value',
-	'handleValueChangeYear',
-	'handleValueChangeMonth',
-	'handleValueChangeDate',
-	'handleValueChangeHours',
-	'handleValueChangeMinutes',
-	'handleValueChangeSeconds',
-	'close',
-	'confirm',
-	'update:show'
-]);
-
-const isPopupVisible = ref(props.show);
-const config = inject<any>('config');
-function generateYearRange(maxYear: any, minYear: any) {
-	const yearRange = [];
-	for (let year = maxYear; year >= minYear; year--) {
-		yearRange.push({
-			value: year,
-			label: `${year}`
-		});
-	}
-	return yearRange;
-}
-
-function generateMonthRange(maxMonth: any, minMonth: any) {
-	const monthRange = [];
-	for (let month = maxMonth + 1; month > minMonth; month--) {
-		monthRange.push({
-			value: month,
-			label: `${month}`
-		});
-	}
-	return monthRange;
-}
-
-function generateDateRange(maxDate: any, minDate: any) {
-	const dayRange = [];
-	const daysInMonth = new Date(props.value.getFullYear(), props.value.getMonth() + 1, 0).getDate();
-	const actualMaxDate = Math.min(maxDate, daysInMonth);
-	for (let day = actualMaxDate; day >= minDate; day--) {
-		dayRange.push({
-			value: day,
-			label: `${day}`
-		});
-	}
-	return dayRange;
-}
-
-function generateHoursRange() {
-	const hoursRange = [];
-	if (props.hoursSystem) {
-		// 24小时制
-		for (let hour = 24; hour > 0; hour--) {
-			hoursRange.push({
-				value: hour,
-				label: `${hour}`
-			});
-		}
-	} else {
-		// 12小时制
-		for (let hour = 12; hour >= 1; hour--) {
-			hoursRange.push({
-				value: hour,
-				label: `${hour}`
-			});
-		}
-	}
-	return hoursRange;
-}
-
-function generateMinutesRange() {
-	const minutesRange = [];
-	for (let minute = 60; minute > 0; minute--) {
-		minutesRange.push({
-			value: minute,
-			label: `${minute < 10 ? '0' + minute : minute}`
-		});
-	}
-	return minutesRange;
-}
-
-function generateSecondsRange() {
-	const secondsRange = [];
-	for (let second = 60; second > 0; second--) {
-		secondsRange.push({
-			value: second,
-			label: `${second < 10 ? '0' + second : second}`
-		});
-	}
-	return secondsRange;
-}
-
-const handleValueChangeYear = (year: number) => {
-	props.value.setFullYear(year);
-	emit('handleValueChangeYear', year);
-};
-const handleValueChangeMonth = (month: number) => {
-	props.value.setMonth(month);
-	emit('handleValueChangeMonth', month);
-};
-const handleValueChangeDate = (date: number) => {
-	props.value.setDate(date);
-	emit('handleValueChangeDate', date);
-};
-const handleValueChangeHours = (hours: number) => {
-	props.value.setHours(hours);
-	emit('handleValueChangeHours', hours);
-};
-const handleValueChangeMinutes = (minutes: number) => {
-	props.value.setMinutes(minutes);
-	emit('handleValueChangeMinutes', minutes);
-};
-const handleValueChangeSeconds = (seconds: number) => {
-	props.value.setSeconds(seconds);
-	emit('handleValueChangeSeconds', seconds);
-};
-
-watch(
-	() => props.show,
-	(val) => {
-		isPopupVisible.value = val;
-	}
-);
-
-const handleClose = () => {
-	isPopupVisible.value = false;
-	emit('update:show', false);
-	emit('close', false);
-};
-const handleConfirm = () => {
-	isPopupVisible.value = false;
-	emit('update:show', false);
-	emit('confirm', props.value);
-};
-</script>
-
-<style lang="scss" scoped>
-.drum-select-container {
-	position: relative;
-	width: 100%;
-	height: 100%;
-	display: flex;
-	align-items: center;
-}
-
-.drum-select-content {
-	position: relative;
-	width: 100%;
-	height: 60%;
-	overflow: hidden;
-	display: flex;
-	view {
-		flex: 1;
-	}
-}
-
-.separate-symbol {
-	font-size: v-bind("config.fontSize.mediumText");
-	height: 85rpx;
-	line-height: 85rpx !important;
-	display: block !important;
-	background-color: v-bind('config.VDateTime.backgroundColor');
-	border-top: 1rpx solid v-bind('config.border.color');
-	border-bottom: 1rpx solid v-bind('config.border.color');
-}
-</style>

package/components/model/compound/v-dialog/v-dialog.vue

@@ -1,178 +0,0 @@
-<template>
-	<view class="v-dialog-overlay" v-if="visible">
-		<view :class="['v-dialog', `v-dialog--${size}`]" :style="dialogStyle">
-			<view class="v-dialog-header">
-				<slot name="header">
-					<text class="v-dialog-title">{{ title }}</text>
-					<button class="v-dialog-close" @click="handleClose">×</button>
-				</slot>
-			</view>
-
-			<view class="v-dialog-body">
-				<slot></slot>
-			</view>
-			<view class="v-dialog-footer">
-				<slot name="footer">
-					<view class="v-dialog-buttons">
-						<v-button type="info" @click="handleClose">取消</v-button>
-						<v-button @click="handleSubmit">确定</v-button>
-					</view>
-				</slot>
-			</view>
-		</view>
-	</view>
-</template>
-
-<script setup lang="ts">
-import { ref, computed, watch,inject } from 'vue';
-
-/**
- * v-dialog 对话框
- * value	是否显示
- * title	标题
- * size		大小
- * width	宽度
- * height	长度
- * isCover	是否需要遮罩层		默认值:true		可选值:false不需要	true需要
- *
- * 相关事件close、submit
- */
-const props = defineProps({
-	value: {
-		type: Boolean,
-		default: false
-	},
-	title: {
-		type: String,
-		default: ''
-	},
-	size: {
-		type: String,
-		default: 'medium',
-		validator: (value: string) => {
-			return ['small', 'medium', 'large'].includes(value);
-		}
-	},
-	width: {
-		type: [String, Number],
-		default: ''
-	},
-	height: {
-		type: [String, Number],
-		default: ''
-	},
-	isCover: {
-		type: Boolean,
-		default: true
-	}
-});
-
-const emit = defineEmits(['update:value', 'close', 'submit']);
-
-const config = inject<any>('config');
-const visible = ref(props.value);
-
-watch(
-	() => props.value,
-	(newVal) => {
-		visible.value = newVal;
-	}
-);
-
-const dialogStyle = computed(() => {
-	const style: Record<string, string | number> = {};
-	if (props.width) style.width = `${props.width}`;
-	if (props.height) style.height = `${props.height}`;
-	return style;
-});
-
-const handleClose = () => {
-	visible.value = false;
-	emit('update:value', false);
-	emit('close');
-};
-
-const handleSubmit = () => {
-	visible.value = false;
-	emit('update:value', false);
-	emit('submit');
-};
-const overlay = props.isCover ? `rgba(0,0,0,${config.opacity.mask})` : 'transparent';
-</script>
-
-<style lang="scss" scoped>
-.v-dialog-overlay {
-	position: fixed;
-	top: 0;
-	left: 0;
-	right: 0;
-	bottom: 0;
-	background-color: v-bind("overlay");
-	display: flex;
-	justify-content: center;
-	align-items: center;
-	z-index: 1000;
-}
-
-.v-dialog {
-	width: 600rpx;
-	background-color: v-bind("config.backgroundColor.reversal");
-	overflow: hidden;
-
-	&--small {
-		width: 500rpx;
-	}
-
-	&--medium {
-		width: 600rpx;
-	}
-
-	&--large {
-		width: 700rpx;
-	}
-
-	.v-dialog-header {
-		display: flex;
-		justify-content: space-between;
-		align-items: center;
-		padding: 16rpx;
-		border-bottom: 1rpx solid v-bind("config.border.color");
-	}
-
-	.v-dialog-title {
-		font-size: v-bind("config.fontSize.smallTitle");
-		font-weight: bold;
-		color: v-bind("config.fontColor.mianTitle");
-	}
-
-	.v-dialog-close {
-		background: none;
-		border: none;
-		font-size: v-bind("config.fontSize.mediumText");
-		cursor: pointer;
-		color: v-bind("config.fontColor.text");
-		margin: 0;
-	}
-
-	.v-dialog-body {
-		padding: 16rpx;
-		overflow-y: auto;
-	}
-
-	.v-dialog-footer {
-		padding: 16rpx;
-		border-top: 1rpx solid v-bind("config.border.color");
-		text-align: right;
-		.v-dialog-buttons {
-			display: flex;
-			justify-content: right;
-			width: 100%;
-			height: 100%;
-
-			.v-button {
-				margin: 0 10rpx;
-			}
-		}
-	}
-}
-</style>

package/components/model/compound/v-drum-select-picker/v-drum-select-picker.vue

@@ -1,83 +0,0 @@
-<template>
-	<v-popup v-model:value="isPopupVisible" :title="title" :scrollHeight="400" model="square" @close="handleClose">
-		<view class="drum-select-container">
-			<view class="drum-select-content">
-				<v-scroll-list :options="options" v-model="selectedValue" :scroll-height="scrollHeight" :item-height="itemHeight" @update:value="handleValueUpdate" />
-			</view>
-		</view>
-	</v-popup>
-</template>
-
-<script lang="ts" setup>
-import { ref, watch, inject } from 'vue';
-
-interface DrumSelectPicker {
-	value: any;
-	label: string;
-}
-
-const props = defineProps({
-	title: {
-		type: String,
-		default: '选择选项'
-	},
-	scrollHeight: {
-		type: Number,
-		default: 300
-	},
-	options: {
-		type: Array,
-		default: () => [],
-		required: true
-	},
-	value: {
-		type: [String, Number],
-		default: ''
-	},
-	show: {
-		type: Boolean,
-		default: false
-	},
-	itemHeight: {
-		type: Number,
-		default: 80
-	}
-});
-
-const emit = defineEmits(['update:value', 'close']);
-
-const isPopupVisible = ref(props.show);
-const selectedValue = ref(props.value);
-const config = inject<any>('config');
-
-watch(
-	() => props.value,
-	(newVal) => {
-		selectedValue.value = newVal;
-	}
-);
-
-function openPopup() {
-	isPopupVisible.value = true;
-}
-
-function handleClose() {
-	isPopupVisible.value = false;
-	emit('close');
-}
-
-function handleValueUpdate(value: any) {
-	emit('update:value', value);
-}
-</script>
-
-<style lang="scss" scoped>
-.drum-select-container {
-	padding: 20rpx;
-}
-
-.drum-select-content {
-	max-height: 500rpx;
-	overflow: hidden;
-}
-</style>