<template>
	<view>
		<u-popup v-model="isShow" @close="isShow = false" mode="bottom" safe-area-inset-bottom border-radius="20">
			<view class="content flex flex_column">
				<view class="con" v-if="dataList.length > 0">
					<view class="choose-list u-flex u-row-between" v-for="(item, i) in dataList" :key="item.id">
						<view>{{ item.dispName }}</view>
						<!-- <u-icon v-show="chooseFlag==i" name="checkbox-mark" color="#2979ff" size="28"></u-icon> -->
						<u-radio-group v-model="chooseVal">
							<u-radio :name="item.code" @change="getChooseItem"></u-radio>
						</u-radio-group>
					</view>
				</view>
				<view class="btn u-flex">
					<view class="cancleStyle" @click="isShow = false">取消</view>
					<view class="confimStyle" :style="{ background: $config('primaryColor'), color: '#fff' }" @click="submit">确定</view>
				</view>
			</view>
		</u-popup>
	</view>
</template>

<script>
import { getLookUpDatas } from '@/api/data';
export default {
	props: {
		showModal: {
			type: Boolean,
			default: false
		},
		code: {
			type: String,
			default: ''
		},
		val: {
			type: String,
			default: ''
		}
	},
	data() {
		return {
			isShow: this.showModal,
			chooseObj: null,
			chooseVal: null,
			dataList: []
		};
	},
	methods: {
		getList() {
			getLookUpDatas({
				lookupCode: this.code,
				pageNo: 1,
				pageSize: 1000
			}).then(result => {
				if (result && result.status + '' === '200') {
					this.dataList = result.data.list;
					//勾选上次选中值
					if (this.val) {
						this.chooseVal = this.val;
					}
				}
			});
		},
		submit(index) {
			if (!this.chooseVal) {
				this.chooseObj = null;
				uni.showToast({
					title:'参数值不能为空',
					icon:'none'
				})
				return;
			}
			this.$emit('chooseItem', this.chooseObj);
			this.isShow = false;
		},
		getChooseItem(e) {
			if (this.chooseVal == e) {
				this.chooseVal ='';
			} else {
				this.chooseVal = e;
			}
			const index = this.dataList.findIndex(item => {
				return item.code == e;
			});
			this.chooseObj = this.dataList[index];
		}
	},
	watch: {
		//  父页面传过来的弹框状态
		showModal(newValue, oldValue) {
			this.isShow = newValue;
		},
		//  重定义的弹框状态
		isShow(newValue, oldValue) {
			if (!newValue) {
				this.$emit('close');
			} else {
				this.getList();
			}
		}
	}
};
</script>

<style lang="scss" scoped>
.content {
	width: 100%;
	height: 100%;
	.con {
		flex-grow: 1;
		overflow: auto;
		padding: 0 40rpx;
		.choose-list {
			border-bottom: 1rpx solid #efefef;
			padding: 20rpx 0;
			&:last-child {
				border-bottom: 0rpx solid #efefef;
			}
			.u-radio{
				display: inline-block !important;
			}
		}
	}
	.btn {
		border-top: 1rpx solid #efefef;
		.cancleStyle,
		.confimStyle {
			width: 50%;
			text-align: center;
			height: 89rpx;
			line-height: 89rpx;
			text-align: center;
		}
	}
}
</style>
