<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">
					<view class="choose-list u-flex u-row-between" v-for="(item, i) in list" :key="item.id" @click="getChooseItem(i)">
						<view>{{ item.dispName }}</view>
						<u-icon v-show="item.isChecked" name="checkbox-mark" color="#2979ff" size="28"></u-icon>
					</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,
			chooseFlag: -1,
			list: []
		};
	},
	methods: {
		getList() {
			if (this.code == 'SALES_BILL_STATUS') {
				var newList = [
					{ id: 1099, isChecked: false, code: 'WAIT_SUBMIT', dispName: '待提交' },
					{ id: 1100, isChecked: false, code: 'WAIT_AUDIT', dispName: '待审核' },
					{ id: 1102, isChecked: false, code: 'WAIT_OUT_WAREHOUSE', dispName: '待出库' },
					{ id: 1103, isChecked: false, code: 'FINISH', dispName: '已完结' }
				];
				if (this.val) {
					//勾选上次选中值
					let valArr = this.val.split(',');
					newList.forEach(con => {
						valArr.forEach(item => {
							if (con.code == item) {
								con.isChecked = true;
							} else {
								con.isChecked = false;
							}
						});
					});
				}
				this.list = newList;
			} else {
				getLookUpDatas({
					lookupCode: this.code,
					pageNo: 1,
					pageSize: 1000
				}).then(result => {
					if (result && result.status == 200) {
						if (this.val) {
							//勾选上次选中值
							let valArr = this.val.split(',');
							result.data.list.forEach(con => {
								valArr.forEach(item => {
									if (con.code == item) {
										con.isChecked = true;
									} else {
										con.isChecked = false;
									}
								});
							});
						} else {
							result.data.list.forEach(con => {
								con.isChecked = false;
							});
						}
						this.list = result.data.list;
					}
				});
			}
		},
		submit(index) {
			let arr = [];
			this.list.forEach(con => {
				if (con.isChecked) {
					arr.push(con);
				}
			});
			this.$emit('chooseCon', arr);
			this.isShow = false;
		},
		getChooseItem(index) {
			this.list[index].isChecked = !this.list[index].isChecked;
		}
	},
	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;
			}
		}
	}
	.btn {
		border-top: 1rpx solid #efefef;
		.cancleStyle,
		.confimStyle {
			width: 50%;
			text-align: center;
			height: 89rpx;
			line-height: 89rpx;
			text-align: center;
		}
	}
}
</style>