源文件

2024-05-23 14:39:33 +08:00
commit a1128dd791
2997 changed files with 500069 additions and 0 deletions
--- a/jeepay-ui-uapp-cashier/components/syb-keyboard/syb-keyboard.vue
+++ b/jeepay-ui-uapp-cashier/components/syb-keyboard/syb-keyboard.vue
@@ -0,0 +1,153 @@
+<template>
+	<view class="jq-keyboard">
+		<view class="left">
+			<view v-for="(item,index) in vdata.number" :key="index" @tap="change(item)" 
+				class="common" hover-class="hover-but"   hover-start-time="10" hover-stay-time="60">
+				{{ item }}
+			</view>
+			<view @tap="change('.')" class="common" hover-class="hover-but"   hover-start-time="10" hover-stay-time="60">.</view>
+			<view @tap="change('0')" class="common zero" hover-class="hover-but"   hover-start-time="10" hover-stay-time="60">0</view>
+		</view>
+		<view class="right">
+			<view class="common del" hover-class="hover-but" hover-start-time="10" hover-stay-time="60" @tap="del">
+				<image src="/static/img/del.svg"></image>
+			</view>
+			<view class="common del" style="display: none;" hover-class="hover-but"  hover-start-time="10" hover-stay-time="60" @tap="clear">C</view>
+			<view
+				class="common pay"
+				hover-class="hover-but"	
+				hover-start-time="10" hover-stay-time="60"
+				:style="{'backgroundColor': '#387CE7'}"
+				@tap="pay">
+				<div>付</div>
+				<div>款</div>
+			</view>
+				<!-- :style="{'backgroundColor': props.primaryColor}" -->
+		</view>
+	</view>
+</template>
+
+<script setup>
+import { reactive, onMounted } from 'vue'
+
+	const props = defineProps({
+		primaryColor: {
+			type: String,
+			default: '#FFFFFF'
+		}
+	})
+	const vdata = reactive({
+		number: ['1', '2', '3', '4', '5', '6', '7', '8', '9'],
+		value: '0'
+	})
+	const emit = defineEmits(['change', 'pay'])
+	
+	function change(k) {
+		
+		let currentVal = vdata.value
+		if(currentVal === '0' && k != '.') {
+			currentVal = k
+		}else {
+			currentVal += k;
+		}
+		
+		if(!matchNum(currentVal)) {
+			return
+		}
+		vdata.value = currentVal
+	
+		uni.vibrateShort()
+		emit('change', vdata.value)
+	}
+	function del() {
+		
+		let currentVal = vdata.value
+		if(!currentVal || currentVal.length <= 1) {
+			vdata.value = '0'
+		}else {
+			vdata.value = vdata.value.substring(0, currentVal.length - 1)
+		}
+		
+		uni.vibrateShort()
+		emit('change', vdata.value)
+	}
+	function clear() {
+		
+		vdata.value = '0'
+		
+		uni.vibrateShort()
+		emit('change', vdata.value)
+	}
+	function matchNum(currentVal) {
+		const pattern = /^(([1-9]{1}\d{0,5})|(0{1}))(\.\d{0,2})?$/
+		return pattern.test(currentVal)
+	}
+	function pay() {
+		
+		uni.vibrateShort()
+		emit('pay')
+	}
+	function setValue(value) {
+		vdata.value = value
+	}
+	
+	defineExpose({ setValue })
+</script>
+
+<style lang="scss">
+	.jq-keyboard {
+		width: 100%;
+		display: flex;
+		flex-direction: row;
+		justify-content: center;
+		padding: 0 5rpx;
+		box-sizing: border-box;
+		
+		.left {
+			width: 75%;
+			display: flex;
+			flex-direction: row;
+			flex-wrap: wrap;
+			justify-content: space-around;
+		}
+		.right {
+			width: 25%;
+			margin-left: 5rpx;
+			margin-right: 5rpx;
+		}
+	}
+	.common {
+		width: calc(100%/3 - 10rpx);
+		height: 24%;
+		display: flex;
+		justify-content: center;
+		align-items: center;
+		box-sizing: border-box;
+		margin-bottom: 10rpx;
+		background: #FFFFFF;
+		border-radius: 10rpx;
+		font-size: 55rpx;
+		letter-spacing: 0.04em;
+		color: $uni-text-color;
+	}
+	.zero {
+		width: calc(100%/3*2 - 10rpx);
+	}
+	.del {
+		width: 100%;
+		image {
+			width: 51rpx;
+			height: 37rpx;
+			pointer-events: none;
+		}
+	}
+	.pay {
+		width: 100%;
+		height: 406rpx;
+		font-size: 36rpx;
+		color: $uni-text-color-inverse;
+	}
+	.hover-but {
+		filter: brightness(80%);
+	}
+</style>