<template>
	<el-dialog :title="titleMap" v-model="visible" :width="700" destroy-on-close @closed="$emit('closed')">
		<el-form :model="form" :rules="rules" :disabled="mode=='show'"  ref="dialogForm" label-width="100px" label-position="left">
			<el-row :gutter="15">
				<el-col :span="12">
					<el-form-item :label="$t('user.fullName')" prop="fullName">
						<el-input v-model="form.fullName" disabled clearable></el-input>
					</el-form-item>
				</el-col>
				<el-col :span="12">
					<el-form-item :label="$t('user.phone')" prop="phone">
						<el-input v-model="form.phone" disabled clearable></el-input>
					</el-form-item>
				</el-col>
			</el-row>
			<el-row :gutter="15">
				<el-col :span="12">
					<el-form-item :label="$t('user.email')" prop="email">
						<el-input v-model="form.email" disabled clearable></el-input>
					</el-form-item>
				</el-col>
				<el-col :span="12">
					<el-form-item :label="$t('device.searchHosptial')" prop="hospital">
						<el-input v-model="form.hospital" disabled clearable></el-input>
					</el-form-item>
				</el-col>
			</el-row>
			<el-row :gutter="15">
				<el-col :span="12">
					<el-form-item :label="$t('device.departmentColumnTitle')" prop="department">
						<el-input v-model="form.department" disabled clearable></el-input>
					</el-form-item>
				</el-col>
				<el-col :span="12">
					<el-form-item :label="$t('user.applyRoleName')" prop="applyRoleName">
						<el-input v-model="form.applyRoleName" disabled clearable></el-input>
					</el-form-item>
				</el-col>
			</el-row>
			<el-row :gutter="15">
				<el-col :span="12">
					<el-form-item :label="$t('user.cardFront')">
						<el-image v-show="form.cardFront!=''" :src="form.cardFront" style="width:100%;height:135px"></el-image>
					</el-form-item>
				</el-col>
				<el-col :span="12">
					<el-form-item :label="$t('user.cardreverse')">
						<el-image v-show="form.cardreverse!=''" :src="form.cardreverse" style="width:100%;height:135px"></el-image>
					</el-form-item>
				</el-col>
			</el-row>
			<el-row :gutter="15">
				<el-col :span="24">
					<el-form-item :label="$t('user.doctorLicense')">
						<el-image v-show="form.doctorLicense!=''" :src="form.doctorLicense" style="width:40%;height:135px"></el-image>
					</el-form-item>
				</el-col>
			</el-row>
			<el-row :gutter="15">
				<el-col :span="24">
					<el-form-item :label="$t('user.auditText')">
						<el-radio-group v-model="form.radio">
							<el-radio v-for="_item in radioList" :key="_item.value" :label="_item.value">{{_item.label}}</el-radio>
						</el-radio-group>
					</el-form-item>
				</el-col>
			</el-row>
			<el-row :gutter="15">
				<el-col :span="24">
					<el-form-item v-if="form.radio=='2'" :label="$t('user.rejectReason')">
						<el-input type="textarea"  v-if="form.radio=='2'" v-model="form.rejectReason" :laceholder="$t('user.inputRejectReason')" clearable></el-input>
					</el-form-item>
				</el-col>
			</el-row>
		</el-form>
		<template #footer>
			<el-button @click="visible=false" >{{$t('dialogBox.cancelButtonText')}}</el-button>
			<el-button type="primary" :loading="isSaveing" @click="submit()">{{$t('dialogBox.saveButtonText')}}</el-button>
		</template>
	</el-dialog>
</template>

<script>
	export default {
		emits: ['success', 'closed'],
		data() {
			return {
				titleMap: this.$t('user.certificationAudit'),
				visible: false,
				isSaveing: false,
				//表单数据
				form: {
					fullName: '',
					phone: '',
					email: '',
					hospital: '',
					department: '',
					applyRoleName: '',
					radio: '',
					rejectReason: '',
					identityApplyCode: '',
					cardFront:'',
					cardreverse:'',
					doctorLicense:''
				},
				//审核列表
				radioList:[
					{ label: this.$t('yes'), value: 1 },
					{ label: this.$t('no'), value: 2 }
				],
			}
		},
		methods: {
			//显示
			open(userCode = ''){
				this.queryUserInfo(userCode);
				this.visible = true;
				return this
			},
			//用户详情信息
			async queryUserInfo(code){
				this.isSaveing = true;
				var res = await this.$API.user.userDetailInfo.post(code);
				this.isSaveing = false;
				if (res){
					this.form.fullName = res.FullName;
					this.form.phone = res.Phone
					this.form.email = res.Email
					this.form.hospital = res.HospitalName
					this.form.department = res.DepartmentName
					this.form.applyRoleName = res.IdentityApplyRoleName
					this.form.identityApplyCode = res.IdentityApplyCode
					if (res.IdentityCard != null && res.IdentityCard.length > 0) {
						this.form.cardFront = res.IdentityCard[0]
						if (res.IdentityCard.length > 1) {
							this.form.cardreverse = res.IdentityCard[1]
						}
					}
					if (res.LicenseCard != null && res.LicenseCard.length > 0) {
						this.form.doctorLicense = res.LicenseCard[0]
					}
				}
			},
			//表单提交方法
			async submit(){
				//通过
				if (this.form.radio === 1) {
					this.isSaveing = true;
					var res = await this.$API.user.AuditPass.post(this.form.identityApplyCode);
					this.isSaveing = false;
					if(res){	
						this.$emit('success');
						this.visible = false;
						this.$message.success(this.$t('response.operateSuccess'))
					}else{
						this.$alert(res.message, this.$t('dialogBox.confirmWarningTitle'), {type: 'error'})
					}
				}
				//驳回
				else if (this.form.radio === 2) {
					//驳回原因必填
					if (this.form.rejectReason === '') {
						this.$alert(this.$t("device.rejectReasonRequired"), this.$t('dialogBox.confirmWarningTitle'), {type: 'error'})
						return false
					}
					this.isSaveing = true;
					var result = await this.$API.user.AuditReject.post(this.form.identityApplyCode, this.form.rejectReason);
					this.isSaveing = false;
					if(result){
						this.$emit('success');
						this.visible = false;
						this.$message.success(this.$t('response.operateSuccess'))
					}else{
						this.$alert(result.message, this.$t('dialogBox.confirmWarningTitle'), {type: 'error'})
					}
				}
				//审核状态必填
				else {
					this.$alert(this.$t("user.checkIsPass"), this.$t('dialogBox.confirmWarningTitle'), {type: 'error'})
					return false
				}
			}
		}
	}
</script>

<style>
.el-dialog__header {
    padding: var(--el-dialog-padding-primary);
    padding-bottom: 10px;
	border-bottom: 2px solid rgba(0,0,0,.06);
 }
.el-dialog__body {
    padding: calc(var(--el-dialog-padding-primary) + 10px) var(--el-dialog-padding-primary);
    color: var(--el-text-color-regular);
    font-size: var(--el-dialog-content-font-size);
    word-break: break-all;
    padding-top: 10px;
    padding-bottom: 10px;
}
.el-dialog__footer {
    padding: var(--el-dialog-padding-primary);
    padding-top: 10px;
    text-align: right;
    box-sizing: border-box;
    border-top: 2px solid rgba(0,0,0,.06);
}
.el-form-item__label {
    font-weight: bold;
    line-height: 32px;
}
</style>