<style lang="scss" scoped>
	.change-input-box{
		display: flex;
		align-items: center;
		.change-input {
			position: relative;
			width: 212upx;
			height: 80upx;
			line-height: 80upx;
			border: 1px solid #dddddd;
			border-radius: 4upx;
			text-align: center;
			margin-right: 24upx;
			font-size: 40upx;
			input{
				position: absolute;
				width: 100%;
				height: 100%;
				opacity:1;
				&.active{
					opacity:0;
				}
			}
			text{
				&.active{
					background: rgba(10,150,210,0.6);
				}
			}
		}
		.unit{
			width: 50upx;
			text-align: center;
		}
	}

</style>
<template>
	<view class="change-input-box">
		<view class="change-input">
				<input :focus="isFocus" :style="isActive?'caret-color:rgba(0,0,0,0)':'caret-color:rgba(0,0,0,1)'" type="number" @focus="initAllInput" @blur="moveAllInput" v-model="inputVal" @input="changeAllInput" >
				<text :class="isActive?'active':''">{{value?value:''}}</text>
		</view>
		<view class="unit">扎</view>
		<view class="change-input">
			<input :focus="isFocusOne" :style="isActiveOne?'caret-color:rgba(0,0,0,0)':'caret-color:rgba(0,0,0,1)'" type="number" @focus="initAllInputOne" @blur="moveAllInputOne" v-model="inputValOne" @input="changeAllInputOne" >
			<text :class="isActiveOne?'active':''">{{valueOne?valueOne:''}}</text>
		</view>
		<view class="unit">支</view>
	</view>
</template>
<script>
export default {
  name: "allSelectInput",
	props: {
		isActive: '',
		isFocus: '',
		value: '',

		isActiveOne: '',
		isFocusOne: '',
		valueOne: '',
	},
	data() {
		return {
			inputVal:'',
			inputValOne:'',
		};
	},
	onLoad(e){
  	this.title = e.title
	},
  methods: {
			initAllInput() {
				this.$emit('initAllInput')
    },
			moveAllInput(){
				let inputVal = this.inputVal
				this.inputVal = '';
				this.$emit('moveAllInput',inputVal)
			},
			changeAllInput(e){
    	if(e.detail.keyCode==8){
    		this.$emit('deleteInputVal')
						return;
					}
				this.$emit('deleteInputVal')
			},


			initAllInputOne() {
				this.$emit('initAllInputOne')
    },
			moveAllInputOne(){
				let inputVal = this.inputValOne
				this.inputValOne = '';
				this.$emit('moveAllInputOne',inputVal)
			},
			changeAllInputOne(e){
    	if(e.detail.keyCode==8){
    		this.$emit('deleteInputValOne')
						return;
					}
				this.$emit('deleteInputValOne')
			},
  },
};
</script>
