<template>
	<view>
		<view class="keyboard" @click.stop="_handleKeyPress">
			<block v-if="!hideInputNumber">
				<view class="key-row">
					<view class="key-cell cell_b" data-num="7">7</view>
					<view class="key-cell cell_b" data-num="8">8</view>
					<view class="key-cell cell_b" data-num="9">9</view>
					<view class="key-cell cell_b" data-num="-1"></view>
				</view>
				<view class="key-row">
					<view class="key-cell cell_b" data-num="4">4</view>
					<view class="key-cell cell_b" data-num="5">5</view>
					<view class="key-cell cell_b" data-num="6">6</view>
					<view class="key-cell cell_b" data-num="-1"></view>
				</view>
				<view class="key-row">
					<view class="key-cell cell_b" data-num="1">1</view>
					<view class="key-cell cell_b" data-num="2">2</view>
					<view class="key-cell cell_b" data-num="3">3</view>
					<view class="key-cell cell_b" data-num="-1"></view>
				</view>
			</block>

			<block v-if="!hideInputNumber">
				<view class="key-zero-and-point">
					<view class="a cell_b zero" data-num="0">0</view>
					<view class="a cell_b point" data-num=".">.</view>
				</view>

				<view @touchstart="touchstart" @touchend="touchend" data-num="D" class="key-confirm2"><text data-num="D" class="jian-btn">←</text></view>
			</block>
			<view class="key-confirm cell_b" :class="hideInputNumber ? 'longConfirmBtn' : ''" :style="{ background: btnColor }" data-num="S">
				<view data-num="S" class="">
					<view data-num="S" class="title">{{ title }}</view>
				</view>
			</view>
		</view>
	</view>
</template>

<script>
import js from './cwx-keyboard.js';
export default js;
</script>

<style>
@import './cwx-keyboard.css';
</style>
