<template>
	<a-modal v-model:visible="openAddModel" title="修改VIP信息" ok-text="提交" cancel-text="取消" @ok="sumbitForm"
		@cancel="cancelModal" width="50%">
		<a-form :model="createForm" layout="vertical">
			<a-row gutter="20">
				<a-col span="24">
					<a-form-item label="企业名称" name="full_name">
						<a-input v-model:value="addOtherForm.full_name" placeholder="请输入企业名称" disabled />
					</a-form-item>
				</a-col>
				<a-col span="24">
					<a-form-item label="见习基地" name="probation">
						<a-radio-group v-model:value="createForm.probation" button-style="solid">
							<a-radio-button :value="1">是</a-radio-button>
							<a-radio-button :value="2">否</a-radio-button>
						</a-radio-group>
					</a-form-item>
				</a-col>
				<a-col span="24">
					<a-form-item label="知名企业" name="famous">
						<a-radio-group v-model:value="createForm.famous" button-style="solid">
							<a-radio-button :value="1">是</a-radio-button>
							<a-radio-button :value="2">否</a-radio-button>
						</a-radio-group>
					</a-form-item>
				</a-col>
				<a-col span="24">
					<a-form-item label="会员类型" name="member_type">
						<a-radio-group v-model:value="createForm.member_type" button-style="solid">
							<a-radio-button :value="1">试用申请中</a-radio-button>
							<a-radio-button :value="2">试用正式</a-radio-button>
							<a-radio-button :value="3">普通申请中</a-radio-button>
							<a-radio-button :value="4">普通正式</a-radio-button>
							<a-radio-button :value="5">VIP申请中</a-radio-button>
							<a-radio-button :value="6">VIP正式</a-radio-button>
						</a-radio-group>
					</a-form-item>
				</a-col>
				<a-col span="24">
					<a-form-item label="会员状态" name="member_status">
						<a-radio-group v-model:value="createForm.member_status" button-style="solid">
							<a-radio-button :value="1">待审</a-radio-button>
							<a-radio-button :value="2">正常</a-radio-button>
							<a-radio-button :value="3">到期</a-radio-button>
							<a-radio-button :value="4">推荐</a-radio-button>
						</a-radio-group>
					</a-form-item>
				</a-col>
				<a-col span="12">
					<a-form-item label="会员开始时间" name="start_date">
						<a-date-picker v-model:value="addOtherForm.kaishi_date" :disabled-date="disabledDate"
							@Change="startDateChange" style="width: 100%;" />
					</a-form-item>
				</a-col>
				<a-col span="12">
					<a-form-item label="会员到期时间" name="end_date">
						<a-date-picker v-model:value="addOtherForm.jieshu_date" :disabled-date="disabledDate"
							@Change="endDateChange" style="width: 100%;" />
					</a-form-item>
				</a-col>
				<a-col span="24">
					<a-form-item label="业务员" name="sale">
						<a-input v-model:value="createForm.sale" placeholder="请输入业务员" />
					</a-form-item>
				</a-col>
			</a-row>
		</a-form>
	</a-modal>
</template>

<script setup lang="ts">
	import { ref, onMounted, computed, defineProps, watch, defineEmits } from 'vue';
	import { PostCompanyVipmanage, GetCompanyVipInfo } from '@/apis/models';
	import { dataForm, otherDataForm, reset } from '@/views/company/list/add/data.ts';
	import { useCommon } from '@/hooks/useCommon';
	let { store, openAddModel, hideModal, dayjs, disabledDate, message, imageprefix } = useCommon();
	const dayjsRef = ref(dayjs);
	const emit = defineEmits();
	let props = defineProps(['edit_record']);

	let createForm = ref<CompanyVipType.addFormType>(dataForm)
	let addOtherForm = ref<CompanyVipType.addOtherFormType>(otherDataForm)

	// 时间选择
	const startDateChange = (val) => {
		createForm.value.start_date = dayjsRef.value(val).format('YYYY-MM-DD');
	}

	const endDateChange = (val) => {
		createForm.value.end_date = dayjsRef.value(val).format('YYYY-MM-DD');
	}

	const sumbitForm = () => {
		console.log(createForm.value)
		PostCompanyVipmanage(createForm.value).then(res => {
			message.success('修改VIP信息成功');
			hideModal();
			resetForm();
			emit('successAdd');
		}).catch(err => {
		})
	}

	const resetForm = () => {
		addOtherForm.value = reset().otherDataForm;
		createForm.value = reset().dataForm;
	}
	const cancelModal = () => {
		emit('closeAdd');
		resetForm();
		hideModal();
	}
	
	openAddModel = computed(() => {
		return store.state.openAddModel;
	})

	watch(() => props.edit_record, (newVal1) => {
		if (newVal1) {
			GetCompanyVipInfo({ id: newVal1.id }).then(res => {
				let newVal = res.data;
				addOtherForm.value = {
					full_name: newVal.full_name,
					kaishi_date: newVal.start_date ? dayjsRef.value(newVal.start_date) : '',
					jieshu_date: newVal.end_date ? dayjsRef.value(newVal.end_date) : '',
				}
				createForm.value = {
					id: newVal.id,
					probation: newVal.probation,
					famous: newVal.famous,
					member_type: newVal.member_type,
					member_status: newVal.member_status,
					start_date: newVal.start_date,
					end_date: newVal.end_date,
					sale: newVal.sales,
				}
			})
		}
	})
</script>

<style>
</style>