<template>
	<view class="item-box">
		<slot name="left">
			<view class="content">{{label}}</view>
		</slot>
		<slot name="right">
			<view class="opear">
				<u-input v-model="valueModel" :clearable="false" type="text" class="input-c"/>
			</view>
		</slot>
	</view>
</template>

<script>
	export default {
		name: 'listitem',
		props: {
			value: {
				type: [String, Number]
			},
			label: {
				type: String
			},
			itemIcon: {
				type: String
			}
		},
		computed: {
			valueModel: {
				get () {
					return this.value
				},
				set (val) {
					this.$emit('input', val)
				}
			}
		},
		methods: {
			
		}
	}
</script>

<style scoped lang="scss">
	.item-box {
		display: flex;
		justify-content: space-between;
		align-items: center;
		padding: 30rpx 0 29rpx;
		
		& .input-c /deep/ input {
			color: #FFFFFF;
		}
		& .input-c /deep/ .input-placeholder {
			color: #757896 !important;
		}
		& .content {
			width: 200rpx;
			height: 33rpx;
			font-size: 24rpx;
			font-family: PingFangSC-Regular, PingFang SC;
			font-weight: 400;
			color: #FFFFFF;
			line-height: 33rpx;
		}
		& .opear {
			flex: 1;
		}
	}
</style>
