<template>
	<view class="yiCheckbox">
		<view class="typesname">{{chinddata.name}}:</view>
		<view class="yiCheckbox_body flex  flex-wrap">
			<!-- v-for="(value,index) in chinddata.spec_item" -->
			<view class="chindboxitem" :class="{'cur': rSelect.indexOf(index)!=-1}" v-for="(value, key, index) in chinddata.spec_item"  :key="index" @tap="tapInfo(index,key, index)">
			<!-- {{value.name}} -->
				{{ value }}
			</view>
		</view>
	</view>
</template>

<script>
	export default {
		props:{
			//数据
			chinddata:{
				type:Object,
				default:()=>{
					return {};
				}
			},
			isindex:{
				type:Number,
				default:0,
			}
		},
		data(){
		        return{
		            rSelect:[],//选中的列表
					isdataarr:[],//选中的数据
					infoArr:[
						{name:"石霸天"},
						{name:"石1天"}
					],
					
		        }
		},
		methods:{
			tapInfo(e,key, index) {
				//console.info(e,key, index);
				
				if (this.rSelect.indexOf(e) == -1) {
					//console.log(e)//打印下标
					this.rSelect.push(e);//选中添加到数组里
					
					this.isdataarr.push({name:this.chinddata.spec_item[key],id:key});//选中的数据 真实的
					
				} else {
					this.rSelect.splice(this.rSelect.indexOf(e), 1); //取消
					
					this.isdataarr.splice(this.rSelect.indexOf(e), 1);
				}
				
				//把选中的值传回去
				this.$emit("changecheckbox",{index:this.isindex,child:this.isdataarr,specList_item_id:this.chinddata.id});
			}
		},
		onLoad() {
			
		},
	}
</script>

<style lang="scss">
	.yiCheckbox{
		margin-top: 20upx;
	}
	.typesname{
		color:#000000;
		font-weight: bold;
		margin-bottom: 10upx;
	}
	.chindboxitem{
		padding:8upx 20upx;
		margin-right: 15upx;
		border-radius: 10upx;
		color:#FFFFFF;
		background-color: #c8c7cc;
		margin-bottom: 10upx;
	}
	.cur {
			color: white;
			border: 1px solid #e5e5e5;
			background-color: #ff5d00;
	}
</style>
