<template>
	<view>
		<u-radio-group v-model="currentSelectedHotelId" placement="column" @change="groupChange">
			<u-radio :customStyle="{ marginTop: '20px' , marginLeft: '20px'}" v-for="(item,index) in hotelList"
				:key="index" :label="item.name" :name="item.hotelId">
			</u-radio>
		</u-radio-group>
	</view>
</template>

<script>
	import {
		mapState,
		mapMutations
	} from 'vuex'
	export default {
		data() {
			return {
				hotelList: [],
				currentSelectedHotelId: ''
			};
		},
		computed: {
			...mapState('m_business', ['currentHotelId']),
		},
		methods: {
			...mapMutations('m_business', ['updateCurrentHotelId', 'updateCurrentHotelName']),
			async getHotelAndNames() {
				let res = await uni.$http.get('/hotelNameAndIds')
				this.hotelList = res.data.data
			},
			groupChange(hotelId) {
				console.log(hotelId)
				console.log(this.currentSelectedHotelId)

				let hotelName
				this.hotelList.forEach(hotelInfo => {
					if (hotelInfo.hotelId == hotelId) {
						hotelName = hotelInfo.name
						return
					}
				})
				this.updateCurrentHotelId(hotelId)
				this.updateCurrentHotelName(hotelName)

				uni.$showMsg('选择酒店成功！')
			}
		},
		onLoad() {
			this.getHotelAndNames()
			this.currentSelectedHotelId = this.currentHotelId
		}
	}
</script>

<style lang="scss">

</style>