<template>
	<view class="recommend-filter-pick-type">
		<u-radio-group v-model="type" :active-color="$u.color.primary" border-bottom placement="column"
			icon-placement="right">
			<u-radio label="所有"></u-radio>
			<u-radio v-for="opt in typeOptions" :key="opt.value" :name="opt.value" :label="opt.text"></u-radio>
		</u-radio-group>
	</view>
</template>

<script>
	import MxConst from '@/common/MxConst'
	export default {
		name: 'recommend-filter-pick-type',
		props: {
			filter: {
				type: Object,
				default: () => ({})
			}
		},
		data() {
			return {
				typeOptions: MxConst.enum.simulatePickTypes,
				type: ''
			}
		},
		mounted() {
			this.type = this.filter.pickType
		},
		methods: {
			handleReset() {
				this.type = ''
			},
			handleConfirm() {
				const changed = this.type !== this.filter.pickType
				this.filter.pickType = this.type
				return changed
			}
		}
	}
</script>

<style lang="scss" scoped>
	.recommend-filter-pick-type {
		padding: 12px 15px;

		.u-radio+.u-radio {
			margin-top: 10px;
		}

		.u-button+.u-button {
			margin-left: 10px;
		}
	}
</style>
