<template>
	<v-dialog :title="title" v-model="visible" width="1000px">
		<el-form
			:model="inputForm"
			ref="inputForm"
			@keyup.enter="doSubmit()"
			label-width="120px"
			v-loading="loading"
			:class="method === 'view' ? 'readonly' : ''"
			:disabled="method === 'view'"
			@submit.prevent
		>
			<el-divider content-position="left"
				><el-icon> <lock /></el-icon> 登录信息</el-divider
			>
			<el-row :gutter="15">
				<el-col :span="12" v-if="$TOOL.data.get('IS_PRIMARY_TENANT')">
					<el-form-item
						label="所属租户"
						prop="tenantDTO.id"
						:rules="[
							{
								required: true,
								message: '租户不能为空',
								trigger: 'blur',
							},
						]"
					>
						<el-select
							v-model="inputForm.tenantDTO.id"
							@change="handleChangeTenant"
							style="width: 100%"
							placeholder="请选择"
						>
							<el-option
								v-for="item in $TOOL.data.get('TENANT_LIST')"
								:key="item.id"
								:label="item.name"
								:value="item.id"
							>
							</el-option>
						</el-select>
					</el-form-item>
				</el-col>
				<el-col :span="12">
					<el-form-item
						label="账号"
						prop="loginName"
						:rules="[
							{
								required: true,
								message: '登录名不能为空',
								trigger: 'blur',
							},
						]"
					>
						<el-input
							v-model="inputForm.loginName"
							maxlength="50"
							placeholder=""
						></el-input>
					</el-form-item>
				</el-col>
				<el-col :span="12">
					<el-form-item
						label="密码:"
						prop="newPassword"
						:rules="
							inputForm.id
								? []
								: [
										{
											required: true,
											message: '密码不能为空',
											trigger: 'blur',
										},
								  ]
						"
					>
						<el-input
							v-model="inputForm.newPassword"
							maxlength="50"
							placeholder="若不修改，请留空"
							show-password
						></el-input>
					</el-form-item>
				</el-col>
				<el-col :span="12">
					<el-form-item
						label="确认密码"
						prop="confirmNewPassword"
						:rules="
							inputForm.id
								? [
										{
											validator: validatePass2,
											trigger: 'blur',
										},
								  ]
								: [
										{
											required: true,
											message: '确认密码不能为空',
											trigger: 'blur',
										},
										{
											validator: validatePass2,
											trigger: 'blur',
										},
								  ]
						"
					>
						<el-input
							v-model="inputForm.confirmNewPassword"
							maxlength="50"
							placeholder=""
							show-password
						></el-input>
					</el-form-item>
				</el-col>
				<el-col :span="12">
					<el-form-item
						label="是否允许登录"
						prop="loginFlag"
						:rules="[
							{
								required: true,
								message: '必须选择',
								trigger: 'blur',
							},
						]"
					>
						<el-radio-group v-model="inputForm.loginFlag">
							<el-radio
								v-for="item in this.$dictUtils.getDictList(
									'yes_no'
								)"
								:label="item.value"
								:key="item.id"
								>{{ item.label }}</el-radio
							>
						</el-radio-group>
					</el-form-item>
				</el-col>
			</el-row>
			<el-divider content-position="left"
				><el-icon> <user /></el-icon> 身份信息</el-divider
			>
			<el-row :gutter="15">
				<el-col :span="12">
					<el-form-item
						label="姓名"
						:rules="[
							{
								required: true,
								message: '姓名不能为空',
								trigger: 'blur',
							},
						]"
						prop="name"
					>
						<el-input
							v-model="inputForm.name"
							maxlength="50"
							placeholder=""
						></el-input>
					</el-form-item>
				</el-col>
				<el-col :span="12">
					<el-form-item
						label="手机"
						prop="mobile"
						:rules="[
							{required: true, message: '手机号不能为空', validator: validator.isMobile, trigger: 'blur' },
						]"
					>
						<el-input
							v-model="inputForm.mobile"
							maxlength="50"
							placeholder=""
						></el-input>
					</el-form-item>
				</el-col>
				<el-col :span="12">
					<el-form-item
						label="电话"
						prop="phone"
						:rules="[
							{ validator: validator.isPhone, trigger: 'blur' },
						]"
					>
						<el-input
							v-model="inputForm.phone"
							maxlength="50"
							placeholder=""
						></el-input>
					</el-form-item>
				</el-col>
				<el-col :span="12">
					<el-form-item
						label="邮箱"
						prop="email"
						:rules="[
							{
								type: 'email',
								message: '请输入正确的邮箱地址',
								trigger: 'blur',
							},
						]"
					>
						<el-input
							v-model="inputForm.email"
							maxlength="50"
							placeholder=""
						></el-input>
					</el-form-item>
				</el-col>
				<el-col :span="12">
					<el-form-item label="证件类型" prop="otherInfoDto.certificatesType"
								  :rules="[{required: true, message: '证件类型不能为空', trigger: 'blur'}
                 ]">
						<el-select v-model="inputForm.otherInfoDto.certificatesType" placeholder="请选择证件类型" style="width:100%;">
							<el-option
								v-for="item in $dictUtils.getDictList('certificates_type')"
								:key="item.value"
								:label="item.label"
								:value="item.value">
							</el-option>
						</el-select>
					</el-form-item>
				</el-col>
				<el-col :span="12" >
					<el-form-item label="证件号" prop="otherInfoDto.idCard" :rules="[
                    {required: true, message: '证件号不能为空', trigger: 'blur'},
                    {validator: checkIdCardRule, trigger: 'blur'}
                  ]">
						<el-input v-model="inputForm.otherInfoDto.idCard" placeholder="请填写证件号"  clearable></el-input>
					</el-form-item>
				</el-col>
				<el-col :span="12">
					<el-form-item label="证件照正面" prop="otherInfoDto.certificatesFront" :rules="[]">
						<el-upload
							:action="`${$http.BASE_URL}/public-modules-server/oss/file/webUpload/upload`"
								   :limit="limitNum"
								   :disabled="hideUploadEdit"
								   list-type="picture-card"
								   :auto-upload="true"
									:on-success="(response, file, fileList) => handleUploadSuccess(response, file, fileList,'front')"
								   v-model:file-list="fileList"
									:before-upload="checkIsPic"
						>
							<el-icon><Plus /></el-icon>

							<template #file="{ file }">
								<div>
									<img class="el-upload-list__item-thumbnail" :src="file.url" alt="" />
									<span class="el-upload-list__item-actions">
										  <span
											  class="el-upload-list__item-preview"
											  @click="handlePictureCardPreview(file,'front')"
										  >
											<el-icon><zoom-in /></el-icon>
										  </span>
										  <span
											  v-if="!disabled"
											  class="el-upload-list__item-delete"
											  @click="handleDownload(file,'front')"
										  >
											<el-icon><Download /></el-icon>
										  </span>
										  <span
											  v-if="!disabled"
											  class="el-upload-list__item-delete"
											  @click="handleRemove(file,fileList,'front')"
										  >
											<el-icon><Delete /></el-icon>
										  </span>
									</span>
								</div>
							</template>
						</el-upload>
						<el-dialog v-model="dialogVisible">
							<img w-full :src="inputForm.certificatesFrontLsUrl" alt="Preview Image" :style="{ maxWidth: '100%', maxHeight: '100%' }"/>
						</el-dialog>

					</el-form-item>
				</el-col>
				<el-col :span="12">
					<el-form-item label="证件照反面" prop="otherInfoDto.certificatesBack" :rules="[]">
						<el-upload :action="`${$http.BASE_URL}/public-modules-server/oss/file/webUpload/upload`"
								   :limit="limitNum"
								   :disabled="hideUploadEdit2"
								   list-type="picture-card"
								   :auto-upload="true"
								   :on-success="(response, file, fileList) => handleUploadSuccess(response, file, fileList,'back')"
								   v-model:file-list="fileList2"
								   :before-upload="checkIsPic"
						>
							<el-icon><Plus /></el-icon>

							<template #file="{ file }">
								<div>
									<img class="el-upload-list__item-thumbnail" :src="file.url" alt="" />
									<span class="el-upload-list__item-actions">
										  <span
											  class="el-upload-list__item-preview"
											  @click="handlePictureCardPreview(file,'back')"
										  >
											<el-icon><zoom-in /></el-icon>
										  </span>
										  <span
											  v-if="!disabled"
											  class="el-upload-list__item-delete"
											  @click="handleDownload(file,'back')"
										  >
											<el-icon><Download /></el-icon>
										  </span>
										  <span
											  v-if="!disabled"
											  class="el-upload-list__item-delete"
											  @click="handleRemove(file,fileList2,'back')"
										  >
											<el-icon><Delete /></el-icon>
										  </span>
									</span>
								</div>
							</template>
						</el-upload>
						<el-dialog v-model="dialogVisible2">
							<img w-full :src="inputForm.certificatesBackLsUrl" alt="Preview Image" :style="{ maxWidth: '100%', maxHeight: '100%' }"/>
						</el-dialog>

					</el-form-item>
				</el-col>
				<el-col :span="12">
					<el-form-item label="性别" prop="otherInfoDto.sex"
								  :rules="[
                 ]">
						<el-select v-model="inputForm.otherInfoDto.sex" placeholder="请选择性别" style="width:100%;">
							<el-option
								v-for="item in $dictUtils.getDictList('sex')"
								:key="item.value"
								:label="item.label"
								:value="item.value">
							</el-option>
						</el-select>
					</el-form-item>
				</el-col>
				<el-col :span="12" >
					<el-form-item label="出生日期" prop="otherInfoDto.birthDate">
						<el-date-picker
							style="width: 100%"
							value-format="YYYY-MM-DD"
							v-model="inputForm.otherInfoDto.birthDate"
							placeholder="选择出生日期">
						</el-date-picker>
					</el-form-item>
				</el-col>
				<el-col :span="12" >
					<el-form-item label="员工类型" prop="otherInfoDto.workerType"
								  :rules="[{required: true, message: '员工类型不能为空', trigger: 'blur'}
                 ]">
						<el-select v-model="inputForm.otherInfoDto.workerType" placeholder="请选择员工类型" style="width:100%;">
							<el-option
								v-for="item in $dictUtils.getDictList('worker_type')"
								:key="item.value"
								:label="item.label"
								:value="item.value">
							</el-option>
						</el-select>
					</el-form-item>
				</el-col>
				<el-col :span="12" >
					<el-form-item label="入职日期" prop="otherInfoDto.onboardingDate"
								  :rules="[
                            {required: true, message: '入职日期不能为空', trigger: 'blur'}]"
					>
						<el-date-picker
							placement="bottom-start"
							style="width: 100%"
							v-model="inputForm.otherInfoDto.onboardingDate"
							type="date"
							value-format="YYYY-MM-DD"
							placeholder="选择入职日期">
						</el-date-picker>
					</el-form-item>
				</el-col>
				<el-col :span="12">
					<el-form-item label="民族" prop="otherInfoDto.ethnic"
								  :rules="[
                 ]">
						<el-select v-model="inputForm.otherInfoDto.ethnic" filterable placeholder="请选择民族" style="width:100%;">
							<el-option
								v-for="item in $dictUtils.getDictList('ethnic')"
								:key="item.value"
								:label="item.label"
								:value="item.value">
							</el-option>
						</el-select>
					</el-form-item>
				</el-col>
				<el-col :span="12" >
					<el-form-item label="联系地址" prop="otherInfoDto.contactAddress"
								  :rules="[
                 ]">
						<el-input v-model="inputForm.otherInfoDto.contactAddress" placeholder="请填写联系地址" clearable></el-input>
					</el-form-item>
				</el-col>
				<el-col :span="12" >
					<el-form-item label="户口类型" prop="otherInfoDto.accountType"
								  :rules="[
                 ]">
						<el-select v-model="inputForm.otherInfoDto.accountType" placeholder="请选择户口类型" style="width:100%;">
							<el-option
								v-for="item in $dictUtils.getDictList('account_type')"
								:key="item.value"
								:label="item.label"
								:value="item.value">
							</el-option>
						</el-select>
					</el-form-item>
				</el-col>
				<el-col :span="12" >
					<el-form-item label="户口所在地" prop="otherInfoDto.accountAddr"
								  :rules="[
                 ]">
						<el-input v-model="inputForm.otherInfoDto.accountAddr" placeholder="请填写户口所在地" clearable></el-input>
					</el-form-item>
				</el-col>
				<el-col :span="12" >
					<el-form-item label="籍贯" prop="otherInfoDto.origin"
								  :rules="[
                 ]">
						<el-input v-model="inputForm.otherInfoDto.origin" placeholder="请填写籍贯" clearable></el-input>
					</el-form-item>
				</el-col>
				<el-col :span="12" >
					<el-form-item label="居住地址" prop="otherInfoDto.liveAddr"
								  :rules="[
                 ]">
						<el-input v-model="inputForm.otherInfoDto.liveAddr" placeholder="请填写居住地址" clearable></el-input>
					</el-form-item>
				</el-col>
				<el-col :span="12" >
					<el-form-item label="最高学历" prop="otherInfoDto.highestEducation"
								  :rules="[
                 ]">
						<el-select v-model="inputForm.otherInfoDto.highestEducation" placeholder="请选择最高学历" style="width:100%;">
							<el-option
								v-for="item in $dictUtils.getDictList('highest_education')"
								:key="item.value"
								:label="item.label"
								:value="item.value">
							</el-option>
						</el-select>
					</el-form-item>
				</el-col>
				<el-col :span="12" >
					<el-form-item label="政治面貌" prop="otherInfoDto.politicalFace"
								  :rules="[
                 ]">
						<el-select v-model="inputForm.otherInfoDto.politicalFace" placeholder="请选择政治面貌" style="width:100%;">
							<el-option
								v-for="item in $dictUtils.getDictList('political_face')"
								:key="item.value"
								:label="item.label"
								:value="item.value">
							</el-option>
						</el-select>
					</el-form-item>
				</el-col>
				<el-col :span="12" >
					<el-form-item label="婚姻状况" prop="otherInfoDto.maritalStatus"
								  :rules="[
                 ]">
						<el-select v-model="inputForm.otherInfoDto.maritalStatus" placeholder="请选择婚姻状况" style="width:100%;">
							<el-option
								v-for="item in $dictUtils.getDictList('marital_status')"
								:key="item.value"
								:label="item.label"
								:value="item.value">
							</el-option>
						</el-select>
					</el-form-item>
				</el-col>
				<el-col :span="12">
					<el-form-item label="血型" prop="otherInfoDto.bloodType"
								  :rules="[
                 ]">
						<el-select v-model="inputForm.otherInfoDto.bloodType" placeholder="请选择血型" style="width:100%;">
							<el-option
								v-for="item in $dictUtils.getDictList('blood_type')"
								:key="item.value"
								:label="item.label"
								:value="item.value">
							</el-option>
						</el-select>
					</el-form-item>
				</el-col>
				<el-col :span="12" >
					<el-form-item label="紧急联系人姓名" prop="otherInfoDto.emergencyContactName"
								  :rules="[
                 ]">
						<el-input v-model="inputForm.otherInfoDto.emergencyContactName" placeholder="请填写紧急联系人姓名" clearable></el-input>
					</el-form-item>
				</el-col>
				<el-col :span="12" >
					<el-form-item label="紧急联系人电话" prop="otherInfoDto.emergencyContactTel"
								  :rules="[
                 ]">
						<el-input v-model="inputForm.otherInfoDto.emergencyContactTel" placeholder="请填写紧急联系人电话" clearable></el-input>
					</el-form-item>
				</el-col>
				<el-col :span="12">
					<el-form-item label="QQ" prop="otherInfoDto.qq">
						<el-input v-model="inputForm.otherInfoDto.qq" placeholder="请填写QQ" clearable></el-input>
					</el-form-item>
				</el-col>
				<el-col :span="12">
					<el-form-item label="微信" prop="otherInfoDto.wechat"
								  :rules="[
                 ]">
						<el-input v-model="inputForm.otherInfoDto.wechat" placeholder="请填写微信" clearable></el-input>
					</el-form-item>
				</el-col>
				<el-col :span="24">
					<el-form-item label="备注" prop="otherInfoDto.remarks"
								  :rules="[
                 ]">
						<el-input type="textarea" style="width:100%" maxlength="1000" v-model="inputForm.otherInfoDto.remarks" placeholder="请填写备注"     ></el-input>
					</el-form-item>
				</el-col>
			</el-row>
			<el-divider content-position="left"
				><el-icon> <postcard /></el-icon> 岗位信息</el-divider
			>
			<el-row :gutter="15">
				<el-col :span="12">
					<el-form-item
						prop="companyDTO.id"
						:rules="[
							{
								required: true,
								message: '公司不能为空',
								trigger: 'blur',
							},
						]"
						label="公司"
					>
						<el-tree-select
							ref="companyTree"
							value-key="id"
							:props="{
								label: 'name', // 显示名称
								children: 'children', // 子级字段名
							}"
							@change="handleChangeCompany"
							:data="companyTreeData"
							v-model="inputForm.companyDTO.id"
							check-strictly
							style="width: 100%"
							:clearable="true"
							:accordion="true"
						>
							<template #default="{ node, data }">
								<span
									class="custom-tree-node el-tree-node__label"
								>
									<span class="label">
										<el-icon class="m-r-5">
											<qiye
												v-if="data.type === '1'"
												:style="{
													color:
														$TOOL.data.get(
															'IS_PRIMARY_TENANT'
														) &&
														data.tenantDTO &&
														$utils.getTenantColorById(
															data.tenantDTO.id
														),
												}"
											></qiye>
											<bumen
												v-else
												:style="{
													color:
														$TOOL.data.get(
															'IS_PRIMARY_TENANT'
														) &&
														data.tenantDTO &&
														$utils.getTenantColorById(
															data.tenantDTO.id
														),
												}"
											></bumen>
										</el-icon>
										{{ node.label }}
									</span>
								</span>
							</template>
						</el-tree-select>
					</el-form-item>
				</el-col>
				<el-col :span="12">
					<el-form-item
						prop="officeDTO.id"
						:rules="[
							{
								required: true,
								message: '部门不能为空',
								trigger: 'blur',
							},
						]"
						label="部门"
					>
						<el-tree-select
							ref="officeTree"
							value-key="id"
							:props="{
								label: 'name', // 显示名称
								children: 'children', // 子级字段名
							}"
							:data="officeTreeData"
							v-model="inputForm.officeDTO.id"
							check-strictly
							style="width: 100%"
							:clearable="true"
							:accordion="true"
						>
							<template #default="{ node, data }">
								<span
									class="custom-tree-node el-tree-node__label"
								>
									<span class="label">
										<el-icon class="m-r-5">
											<qiye
												v-if="data.type === '1'"
												:style="{
													color:
														$TOOL.data.get(
															'IS_PRIMARY_TENANT'
														) &&
														data.tenantDTO &&
														$utils.getTenantColorById(
															data.tenantDTO.id
														),
												}"
											></qiye>
											<bumen
												v-else
												:style="{
													color:
														$TOOL.data.get(
															'IS_PRIMARY_TENANT'
														) &&
														data.tenantDTO &&
														$utils.getTenantColorById(
															data.tenantDTO.id
														),
												}"
											></bumen>
										</el-icon>
										{{ node.label }}
									</span>
								</span>
							</template>
						</el-tree-select>
					</el-form-item>
				</el-col>

				<el-col :span="12">
					<el-form-item  prop="manageOfficeIds" label="管理部门" >
						<!-- 单选 -->
						<!--<el-select v-model="form.treeData" placeholder="请选择" style="width: 16rem">-->
						<!-- 多选 -->
						<SelectTree
							ref="officeTree"
							:props="{
                  value: 'id',             // ID字段名
                  label: 'name',         // 显示名称
                  children: 'children'    // 子级字段名
                }"
							size="middle"
							:url="`/jeeplus-system/sys/office/treeData3?type=2`"
							:value="inputForm.manageOfficeIds"
							:clearable="false"
							:accordion="true"
							:showCheckbox="true"
							:checkStrictly="true"
							:checkOnClickNode="true"
							@getValue="(value) => {inputForm.manageOfficeIds=value}"/>
					</el-form-item>
				</el-col>

				<el-col :span="12">
					<el-form-item
						label="工号"
						prop="no"
						:rules="[
						]"
					>
						<el-input
							v-model="inputForm.no"
							maxlength="50"
							placeholder=""
						></el-input>
					</el-form-item>
				</el-col>
				<el-col :span="12">
					<el-form-item label="岗位" prop="postIdList">
						<el-select
							v-model="inputForm.postIdList"
							style="width: 100%"
							multiple
							placeholder="请选择"
						>
							<el-option
								v-for="item in postList"
								:key="item.id"
								:label="item.name"
								:value="item.id"
							>
							</el-option>
						</el-select>
					</el-form-item>
				</el-col>
				<el-col :span="12">
					<el-form-item
						label="角色"
						prop="roleIdList"
						:rules="[
							{
								required: true,
								message: '角色不能为空',
								trigger: 'blur',
							},
						]"
					>
						<el-select
							v-model="inputForm.roleIdList"
							style="width: 100%"
							multiple
							placeholder="请选择"
						>
							<el-option
								v-for="role in roleList"
								:key="role.id"
								:label="role.name"
								:value="role.id"
							>
							</el-option>
						</el-select>
					</el-form-item>
				</el-col>
			</el-row>
			<el-divider content-position="left"><el-icon> <wenjian /></el-icon> 合同信息</el-divider>
			<el-row  :gutter="15">
				<el-col :span="12">
					<el-form-item label="当前合同起始日" prop="rosterContractDTO.beginDate"
								  :rules="[
               ]">
						<el-date-picker
							placement="bottom-start"
							style="width: 100%"
							v-model="inputForm.rosterContractDTO.beginDate"
							type="date"
							value-format="YYYY-MM-DD"
							placeholder="选择当前合同起始日">
						</el-date-picker>
					</el-form-item>
				</el-col>
				<el-col :span="12">
					<el-form-item label="当前合同终止日" prop="rosterContractDTO.endDate"
								  :rules="[
               ]">
						<el-date-picker
							placement="bottom-start"
							style="width: 100%"
							v-model="inputForm.rosterContractDTO.endDate"
							type="date"
							value-format="YYYY-MM-DD"
							placeholder="选择当前合同终止日">
						</el-date-picker>
					</el-form-item>
				</el-col>
				<el-col :span="12">
					<el-form-item label="工作邮箱" prop="rosterContractDTO.workEmail">
						<el-input v-model="inputForm.rosterContractDTO.workEmail" placeholder="请填写工作邮箱" clearable></el-input>
					</el-form-item>
				</el-col>
				<el-col :span="12">
					<el-form-item label="工作电话" prop="rosterContractDTO.workMobile"
								  :rules="[
               ]">
						<el-input v-model="inputForm.rosterContractDTO.workMobile" placeholder="请填写工作电话" clearable></el-input>
					</el-form-item>
				</el-col>
				<el-col :span="12">
					<el-form-item label="试用期到期日" prop="rosterContractDTO.probationPeriodEndDate"
								  :rules="[
               ]">
						<el-date-picker
							placement="bottom-start"
							style="width: 100%"
							v-model="inputForm.rosterContractDTO.probationPeriodEndDate"
							type="date"
							value-format="YYYY-MM-DD"
							placeholder="选择试用期到期日">
						</el-date-picker>
					</el-form-item>
				</el-col>
				<el-col :span="12">
					<el-form-item label="试用期(月)" prop="rosterContractDTO.probationPeriodMonth">
						<el-input v-model="inputForm.rosterContractDTO.probationPeriodMonth" placeholder="请填写试用期(月)" clearable></el-input>
					</el-form-item>
				</el-col>
			</el-row>
			<el-divider content-position="left"><el-icon> <yinhangka /></el-icon> 银行卡信息</el-divider>
			<div>
				<el-row  :gutter="15" :key="index_bank" v-for="(item,index_bank) in inputForm.rosterBankCardsDTOList">
					<el-col :span="24">
						<el-form-item label="" >
							<el-divider content-position="left"> 银行卡 {{index_bank + 1}}</el-divider>
						</el-form-item>
					</el-col>
					<el-col :span="12">
						<el-form-item label="工资卡开户银行" :prop="'rosterBankCardsDTOList[' + index_bank + '].payrollCardOpenBank'"
									  :rules="[
               ]">
							<el-select v-model="inputForm.rosterBankCardsDTOList[index_bank].payrollCardOpenBank" filterable placeholder="请选择工资卡开户银行"  style="width: 100%;">
								<el-option
									v-for="item in $dictUtils.getDictList('bank_name')"
									:key="item.value"
									:label="item.label"
									:value="item.value">
								</el-option>
							</el-select>
						</el-form-item>
					</el-col>
					<el-col :span="12">
						<el-form-item label="工资卡分支行" :prop="'rosterBankCardsDTOList[' + index_bank + '].payrollCardBranches'"
									  :rules="[
               ]">
							<el-input v-model="inputForm.rosterBankCardsDTOList[index_bank].payrollCardBranches" placeholder="请填写工资卡分支行"></el-input>

						</el-form-item>
					</el-col>
					<el-col :span="12">
						<el-form-item label="工资卡银行账号" :prop="'rosterBankCardsDTOList[' + index_bank + '].payrollCardBankAccount'"
									  :rules="[
                          {validator: validatorXG.isBankNum, trigger: 'change'},
                          {validator: validatorXG.isBankNum, trigger: 'blur'}
               ]">
							<el-input v-model="inputForm.rosterBankCardsDTOList[index_bank].payrollCardBankAccount" placeholder="请填写工资卡银行账号"     clearable></el-input>
						</el-form-item>
					</el-col>
					<el-col :span="12">
						<el-form-item label="工资卡开户名" :prop="'rosterBankCardsDTOList[' + index_bank + '].payrollCardOpeningName'"
									  :rules="[
               ]">
							<el-input v-model="inputForm.rosterBankCardsDTOList[index_bank].payrollCardOpeningName" placeholder="请填写工资卡开户名"     clearable></el-input>
						</el-form-item>
					</el-col>
					<el-col :span="12">
						<el-form-item label="工资卡照片" :prop="'rosterBankCardsDTOList[' + index_bank + '].payrollCardPic'"
									  :rules="[
               ]">
							<el-upload :action="`${$http.BASE_URL}/public-modules-server/oss/file/webUpload/upload`"
									   :limit="limitNum"
									   :disabled="hideUploadEdit3[index_bank]"
									   list-type="picture-card"
									   :auto-upload="true"
									   :on-success="(response, file, fileList) => handleUploadSuccess(response, file, fileList,'bankCards',index_bank)"
									   v-model:file-list="fileList3[index_bank]"
									   :before-upload="checkIsPic"
							>
								<el-icon><Plus /></el-icon>

								<template #file="{ file }">
									<div>
										<img class="el-upload-list__item-thumbnail" :src="file.url" alt="" />
										<span class="el-upload-list__item-actions">
										  <span
											  class="el-upload-list__item-preview"
											  @click="handlePictureCardPreview(file,'bankCards',index_bank)"
										  >
											<el-icon><zoom-in /></el-icon>
										  </span>
										  <span
											  v-if="!disabled"
											  class="el-upload-list__item-delete"
											  @click="handleDownload(file,'bankCards',index_bank)"
										  >
											<el-icon><Download /></el-icon>
										  </span>
										  <span
											  v-if="!disabled"
											  class="el-upload-list__item-delete"
											  @click="handleRemove(file,fileList3,'bankCards',index_bank)"
										  >
											<el-icon><Delete /></el-icon>
										  </span>
									</span>
									</div>
								</template>
							</el-upload>
							<el-dialog v-model="dialogVisible3[index_bank]">
								<img w-full :src="inputForm.rosterBankCardsDTOList[index_bank].payrollCardPicLsUrl" alt="Preview Image" :style="{ maxWidth: '100%', maxHeight: '100%' }"/>
							</el-dialog>
						</el-form-item>
					</el-col>
					<el-col :span="12">
<!--						<el-form-item label="是否为默认" :prop="'rosterBankCardsDTOList[' + index_bank + '].isDefault'"-->
<!--									  :rules="[-->
<!--               ]">-->
<!--							&lt;!&ndash;              <el-input v-model="inputForm.rosterBankCardsDTOList[index_bank].isDefault" placeholder="请填写试用期(月)" clearable></el-input>&ndash;&gt;-->

<!--							<el-radio @change="checkBankDefault(index_bank)" v-model="inputForm.rosterBankCardsDTOList[index_bank].isDefault" label="1" size="mini" style="margin-right: 0px" border>是</el-radio>-->
<!--							<el-radio @change="checkBankDefault(index_bank)" v-model="inputForm.rosterBankCardsDTOList[index_bank].isDefault" label="2" size="mini" border>否</el-radio>-->
<!--						</el-form-item>-->
<!--						-->
						<el-form-item label="是否为默认" :prop="'rosterBankCardsDTOList[' + index_bank + '].isDefault'"
									  :rules="[]">
							<el-radio-group v-model="inputForm.rosterBankCardsDTOList[index_bank].isDefault" size="mini">
								<el-radio @change="checkBankDefault(index_bank)" v-model="inputForm.rosterBankCardsDTOList[index_bank].isDefault" label="1" size="mini"  >是</el-radio>-->
								<el-radio @change="checkBankDefault(index_bank)" v-model="inputForm.rosterBankCardsDTOList[index_bank].isDefault" label="2" size="mini" >否</el-radio>
							</el-radio-group>
						</el-form-item>
					</el-col>
					<el-col :span="24" style="text-align: center">
						<el-form-item label="" style="padding-left: 20%">
							<el-button style="width: 70%" type="danger" @click="delRow(index_bank,'bank')" plain>删除银行卡 {{index_bank + 1}}</el-button>
						</el-form-item>
					</el-col>
				</el-row>
				<el-row :gutter="15">
					<el-col :span="24">
						<el-form-item label="" >
							<el-button style="width: 100%" type="primary" @click="addRow('bank')" plain>新增银行卡</el-button>
						</el-form-item>
					</el-col>
				</el-row>
			</div>
			<el-divider content-position="left"><el-icon> <yinhangka /></el-icon> 人员资质</el-divider>
			<div>
				<el-row  :gutter="15" :key="index_certDto" v-for="(item,index_certDto) in inputForm.certDTOList">
					<el-col :span="24">
						<el-form-item label="" >
							<el-divider content-position="left"> 人员资质 {{index_certDto + 1}}</el-divider>
						</el-form-item>
					</el-col>
					<el-col :span="12">
						<el-form-item label="证书类型" :prop="'certDTOList[' + index_certDto + '].type'"
									  :rules="[
                            {required: true, message: '证书类型不能为空', trigger: 'change'}
             ]">
							<el-select v-model="inputForm.certDTOList[index_certDto].type" filterable @change="changeType(index_certDto)" placeholder="请选择证书类型"  style="width: 100%;">
								<el-option
									v-for="item in $dictUtils.getDictList('sys_cert_type')"
									:key="item.value"
									:label="item.label"
									:value="item.value">
								</el-option>
							</el-select>
						</el-form-item>
					</el-col>
					<el-col :span="12">
						<el-form-item label="证书编号" :prop="'certDTOList[' + index_certDto + '].no'"
									  :rules="[
                            {required: true, message: '证书编号不能为空', trigger: 'change'}
             ]">
							<el-input v-model="inputForm.certDTOList[index_certDto].no" placeholder="请填写证书编号"     clearable></el-input>
						</el-form-item>
					</el-col>
					<el-col :span="12">
						<el-form-item label="发证机关" :prop="'certDTOList[' + index_certDto + '].authorities'"
									  :rules="[
             ]">
							<el-input v-model="inputForm.certDTOList[index_certDto].authorities" placeholder="请填写发证机关"     clearable></el-input>
						</el-form-item>
					</el-col>
					<el-col :span="12">
						<el-form-item label="发证日期" :prop="'certDTOList[' + index_certDto + '].issuedDate'"
									  :rules="[
             ]">
							<el-date-picker
								placement="bottom-start"
								style="width: 100%"
								v-model="inputForm.certDTOList[index_certDto].issuedDate"
								type="date"
								value-format="YYYY-MM-DD"
								placeholder="选择发证日期">
							</el-date-picker>
						</el-form-item>
					</el-col>
					<el-col :span="12">
						<el-form-item label="注册日期" :prop="'certDTOList[' + index_certDto + '].enrollDate'"
									  :rules="[
             ]">
							<el-date-picker
								placement="bottom-start"
								style="width: 100%"
								v-model="inputForm.certDTOList[index_certDto].enrollDate"
								type="date"
								value-format="YYYY-MM-DD"
								placeholder="选择注册日期">
							</el-date-picker>
						</el-form-item>
					</el-col>
					<el-col :span="12">
						<el-form-item label="到期日期" :prop="'certDTOList[' + index_certDto + '].expireDate'"
									  :rules="[
                            {required: true, message: '到期日期不能为空', trigger: 'blur'}
             ]">
							<el-date-picker
								placement="bottom-start"
								style="width: 100%"
								v-model="inputForm.certDTOList[index_certDto].expireDate"
								type="date"
								value-format="YYYY-MM-DD"
								placeholder="选择到期日期">
							</el-date-picker>
						</el-form-item>
					</el-col>
					<el-col :span="12">
						<el-form-item label="注册证书编号" :prop="'certDTOList[' + index_certDto + '].enrollCertNo'"
									  :rules="[
             ]">
							<el-input v-model="inputForm.certDTOList[index_certDto].enrollCertNo" placeholder="请填写注册证书编号"     clearable></el-input>
						</el-form-item>
					</el-col>
					<el-col :span="12">
						<el-form-item label="专业" :prop="'certDTOList[' + index_certDto + '].profession'"
									  :rules="[
             ]">
							<el-select v-model="inputForm.certDTOList[index_certDto].profession" @change="changeProfession" placeholder="请填写专业"  style="width: 100%;">
								<el-option
									v-for="item in inputForm.certDTOList[index_certDto].professionList"
									:key="item.value"
									:label="item.label"
									:value="item.value">
								</el-option>
							</el-select>
						</el-form-item>
					</el-col>
					<el-col :span="12">
						<el-form-item label="附件" :prop="'certDTOList[' + index_certDto + '].fileUrl'"
									  :rules="[
               ]">
							<el-upload :action="`${$http.BASE_URL}/public-modules-server/oss/file/webUpload/upload`"
									   :limit="limitNum"
									   :disabled="hideUploadEdit4[index_certDto]"
									   list-type="picture-card"
									   :auto-upload="true"
									   :on-success="(response, file, fileList) => handleUploadSuccess(response, file, fileList,'certDTO',index_certDto)"
									   v-model:file-list="fileList4[index_certDto]"
									   :before-upload="checkIsPic"
							>
								<el-icon><Plus /></el-icon>

								<template #file="{ file }">
									<div>
										<img class="el-upload-list__item-thumbnail" :src="file.url" alt="" />
										<span class="el-upload-list__item-actions">
										  <span
											  class="el-upload-list__item-preview"
											  @click="handlePictureCardPreview(file,'certDTO',index_certDto)"
										  >
											<el-icon><zoom-in /></el-icon>
										  </span>
										  <span
											  v-if="!disabled"
											  class="el-upload-list__item-delete"
											  @click="handleDownload(file,'certDTO',index_certDto)"
										  >
											<el-icon><Download /></el-icon>
										  </span>
										  <span
											  v-if="!disabled"
											  class="el-upload-list__item-delete"
											  @click="handleRemove(file,fileList4,'certDTO',index_certDto)"
										  >
											<el-icon><Delete /></el-icon>
										  </span>
									</span>
									</div>
								</template>
							</el-upload>
							<el-dialog v-model="dialogVisible4[index_certDto]">
								<img w-full :src="inputForm.certDTOList[index_certDto].fileLsUrl" alt="Preview Image" :style="{ maxWidth: '100%', maxHeight: '100%' }"/>
							</el-dialog>
						</el-form-item>
					</el-col>
					<el-col :span="24" style="text-align: center">
						<el-form-item label="" style="padding-left: 20%">
							<el-button style="width: 70%" type="danger" @click="delRow(index_certDto,'certDto')" plain>删除人员资质 {{index_certDto + 1}}</el-button>
						</el-form-item>
					</el-col>
				</el-row>
				<el-row :gutter="15">
					<el-col :span="24">
						<el-form-item label="" >
							<el-button style="width: 100%" type="primary" @click="addRow('certDto')" plain>新增人员资质</el-button>
						</el-form-item>
					</el-col>
				</el-row>
			</div>
			<el-divider content-position="left"><el-icon> <yinhangka /></el-icon> 员工证书</el-divider>
			<div>
				<el-row  :gutter="15" :key="index_certificate" v-for="(item,index_certificate) in inputForm.rosterCertificateDTOList">
					<el-col :span="24">
						<el-form-item label="" >
							<el-divider content-position="left"> 员工证书 {{index_certificate + 1}}</el-divider>
						</el-form-item>
					</el-col>
					<el-col :span="12">
						<el-form-item label="证书名称" :prop="'rosterCertificateDTOList[' + index_certificate + '].certName'"
									  :rules="[
               ]">
							<el-input v-model="inputForm.rosterCertificateDTOList[index_certificate].certName" placeholder="请填写证书名称"     clearable></el-input>
						</el-form-item>
					</el-col>
					<el-col :span="12">
						<el-form-item label="证书类型" :prop="'rosterCertificateDTOList[' + index_certificate + '].certType'"
									  :rules="[
               ]">
							<el-select v-model="inputForm.rosterCertificateDTOList[index_certificate].certType" filterable placeholder="请选择证书类型"  style="width: 100%;">
								<el-option
									v-for="item in $dictUtils.getDictList('cert_type')"
									:key="item.value"
									:label="item.label"
									:value="item.value">
								</el-option>
							</el-select>
						</el-form-item>
					</el-col>
					<el-col :span="12">
						<el-form-item label="证书编号" :prop="'rosterCertificateDTOList[' + index_certificate + '].certNo'"
									  :rules="[
               ]">
							<el-input v-model="inputForm.rosterCertificateDTOList[index_certificate].certNo" placeholder="请填写证书编号"     clearable></el-input>
						</el-form-item>
					</el-col>
					<el-col :span="12">
						<el-form-item label="发证机构" :prop="'rosterCertificateDTOList[' + index_certificate + '].issuedInstitution'"
									  :rules="[
               ]">
							<el-input v-model="inputForm.rosterCertificateDTOList[index_certificate].issuedInstitution" placeholder="请填写发证机构"     clearable></el-input>
						</el-form-item>
					</el-col>
					<el-col :span="12">
						<el-form-item label="发证日期" :prop="'rosterCertificateDTOList[' + index_certificate + '].issuedDate'"
									  :rules="[
               ]">
							<el-date-picker
								placement="bottom-start"
								style="width: 100%"
								v-model="inputForm.rosterCertificateDTOList[index_certificate].issuedDate"
								type="date"
								value-format="YYYY-MM-DD"
								placeholder="选择发证日期">
							</el-date-picker>
						</el-form-item>
					</el-col>
					<el-col :span="12">
						<el-form-item label="备案日期" :prop="'rosterCertificateDTOList[' + index_certificate + '].recordDate'"
									  :rules="[
               ]">
							<el-date-picker
								placement="bottom-start"
								style="width: 100%"
								v-model="inputForm.rosterCertificateDTOList[index_certificate].recordDate"
								type="date"
								value-format="YYYY-MM-DD"
								placeholder="选择备案日期">
							</el-date-picker>
						</el-form-item>
					</el-col>
					<el-col :span="12">
						<el-form-item label="提醒日期" :prop="'rosterCertificateDTOList[' + index_certificate + '].remindDate'"
									  :rules="[
               ]">
							<el-date-picker
								placement="bottom-start"
								style="width: 100%"
								v-model="inputForm.rosterCertificateDTOList[index_certificate].remindDate"
								type="date"
								value-format="YYYY-MM-DD"
								placeholder="选择提醒日期">
							</el-date-picker>
						</el-form-item>
					</el-col>
					<el-col :span="12">
						<el-form-item label="到期日期" :prop="'rosterCertificateDTOList[' + index_certificate + '].expireDate'"
									  :rules="[
               ]">
							<el-date-picker
								placement="bottom-start"
								style="width: 100%"
								v-model="inputForm.rosterCertificateDTOList[index_certificate].expireDate"
								type="date"
								value-format="YYYY-MM-DD"
								placeholder="选择到期日期">
							</el-date-picker>
						</el-form-item>
					</el-col>
					<el-col :span="12">
						<el-form-item label="专业" :prop="'rosterCertificateDTOList[' + index_certificate + '].profession'"
									  :rules="[
               ]">
							<el-input v-model="inputForm.rosterCertificateDTOList[index_certificate].profession" placeholder="请填写专业"     clearable></el-input>
						</el-form-item>
					</el-col>
					<el-col :span="12">
						<el-form-item label="级别" :prop="'rosterCertificateDTOList[' + index_certificate + '].level'"
									  :rules="[
               ]">
							<el-input v-model="inputForm.rosterCertificateDTOList[index_certificate].level" placeholder="请填写级别"     clearable></el-input>
						</el-form-item>
					</el-col>
					<el-col :span="24">
						<el-form-item label="描述" :prop="'rosterCertificateDTOList[' + index_certificate + '].description'"
									  :rules="[
               ]">
							<el-input type="textarea" v-model="inputForm.rosterCertificateDTOList[index_certificate].description" placeholder="请填写描述"     clearable></el-input>
						</el-form-item>
					</el-col>
					<el-col :span="24" style="text-align: center">
						<el-form-item label="" style="padding-left: 20%">
							<el-button style="width: 70%" type="danger" @click="delRow(index_certificate,'certificate')" plain>删除员工证书 {{index_certificate + 1}}</el-button>
						</el-form-item>
					</el-col>
				</el-row>
				<el-row :gutter="15">
					<el-col :span="24">
						<el-form-item label="" >
							<el-button style="width: 100%" type="primary" @click="addRow('certificate')" plain>新增员工证书</el-button>
						</el-form-item>
					</el-col>
				</el-row>
			</div>
		</el-form>

		<!-- <template #footer>
      <span class="dialog-footer">
        <el-button  @click="visible = false" icon="circle-close">关闭</el-button>
        <el-button  type="primary" v-if="method != 'view'" @click="doSubmit()" icon="circle-check" v-noMoreClick>确定</el-button>
      </span>
     </template> -->
<!--		附件-->
		<UpLoadComponent ref="uploadComponent"></UpLoadComponent>
		<template #footer>
			<span class="dialog-footer">
				<el-button @click="close()" icon="circle-close"
					>关闭</el-button
				>
				<el-button
					type="primary"
					v-show="method != 'view'"
					@click="doSubmit()"
					icon="circle-check"
					>确定</el-button
				>
			</span>
		</template>
	</v-dialog>
</template>

<script>
	import UpLoadComponent from '@/views/common/UpLoadComponent'
	import OSSSerivce, {
		httpRequest,
		fileName,
		toHref,
	} from '@/api/sys/OSSService'
import SelectTree from '@/components/treeSelect/treeSelect.vue'
import userService from "@/api/sys/userService";
import postService from "@/api/sys/postService";
import roleService from "@/api/sys/roleService";
import officeService from "@/api/sys/officeService";
export default {
	data() {
		return {
			idCardBJ: '',
			limitNum: 1,
			hideUploadEdit: false, //隐藏上传按钮
			hideUploadEdit2: false, //隐藏上传按钮
			hideUploadEdit3: [], //隐藏上传按钮
			hideUploadEdit4: [], //隐藏上传按钮
			disabled: false,
			dialogVisible: false,
			dialogVisible2: false,
			dialogVisible3: [],
			dialogVisible4: [],
			fileList: [],
			fileList2: [],
			fileList3: [],
			fileList4: [],
			hideUploadButton: false, // 控制上传按钮显示与隐藏
			visible: false,
			loading: false,
			title: "",
			method: "",
			roleList: [],
			postList: [],
			companyTreeData: [],
			officeTreeData: [],
			inputForm: {
				id: "",
				tenantDTO: {
					// 租户信息
					id: null,
					name: null,
				},
				companyDTO: {
					// 归属公司
					id: "",
					name: "",
				},
				officeDTO: {
					id: "",
					name: "",
				},
				roleIdList: [],
				postIdList: [],
				loginName: "", // 登录名
				no: "", // 工号
				name: "", // 姓名
				email: "", // 邮箱
				phone: "", // 电话
				mobile: "", // 手机
				loginFlag: "1", // 是否允许登陆
				photo: "", // 头像
				qrCode: "", // 二维码
				oldLoginName: "", // 原登录名
				newPassword: "", // 新密码
				confirmNewPassword: "",
				sign: "", // 签名
				remarks: "", // 备注
				rosterContractDTO: {
					baseId: '',
					beginDate: '',
					endDate: '',
					workEmail: '',
					workMobile: '',
					probationPeriodEndDate: '',
					probationPeriodMonth: ''
				},
				otherInfoDto: {
					id: '',
					certificatesType: "", // 证件类型
					idCard: "", // 证件号
					certificatesFront: "", // 证件照正面
					certificatesFrontLsUrl: "", // 证件照正面
					certificatesBack: "", // 证件照反面
					certificatesBackLsUrl: "", // 证件照反面
					sex: "", // 性别
					birthDate: "", // 出生日期
					workerType: '', //员工类型
					onboardingDate: '', //入职日期
					ethnic: '', //民族
					contactAddress: '', //联系地址
					accountType: '', //户口类型
					accountAddr: '', //户口所在地
					origin: '', //籍贯
					liveAddr: '', //居住地址
					highestEducation: '', //最高学历
					politicalFace: '', //政治面貌
					maritalStatus: '', //婚姻状况
					bloodType: '', //血型
					emergencyContactName: '', //紧急联系人姓名
					emergencyContactTel: '', //紧急联系人电话
					qq: '', //QQ
					wechat: '', //微信
					remarks: '', //微信
				},
				rosterBankCardsDTOList: [],
				certDTOList: [],
				rosterCertificateDTOList: [],
				files: [] // 附件信息
			},
		};
	},
	created () {
		this.ossService = new OSSSerivce()
	},
	components: {
		SelectTree,
		UpLoadComponent,
	},
	methods: {
		init(method, id, tenantId) {
			this.method = method;
			this.fileList = []
			this.fileList2 = []
			this.fileList3 = []
			this.fileList4 = []
			this.inputForm.rosterBankCardsDTOList = []
			this.inputForm.certDTOList = []
			this.inputForm.rosterCertificateDTOList = []
			if (method === "add") {
				this.title = `新建用户`;
			} else if (method === "edit") {
				this.title = "修改用户";
			} else if (method === "view") {
				this.title = "查看用户";
			}
			this.visible = true;
			this.$nextTick(() => {
				this.$refs.uploadComponent.clearUpload()
				if (this.$refs.inputForm !== undefined) {
					this.$refs.inputForm.resetFields();
				}
				this.idCardBJ = ''
				this.inputForm.oldLoinName = "";
				this.inputForm.id = id;
				this.inputForm.tenantDTO.id = tenantId;
				if (method === "edit" || method === "view") {
					// 修改或者查看
					let p = userService.queryById(this.inputForm.id);
					this.initTenant(p).then((data) => {
						this.inputForm = this.recover(this.inputForm, data);
						this.inputForm.oldLoginName = this.inputForm.loginName;
						this.$refs.uploadComponent.newUpload(method, this.inputForm.files, 'reimbursement')

						this.inputForm.certDTOList.forEach(item => {
							if (item.type === '1' || item.type === '2') {
								item.professionList = this.$dictUtils.getDictList('sys_cert_profession_build')
							} else if (item.type === '3' || item.type === '4') {
								item.professionList = this.$dictUtils.getDictList('sys_cert_profession_cost')
							} else if (item.type === '5') {
								item.professionList = this.$dictUtils.getDictList('sys_cert_profession_supervision')
							} else if (item.type === '6') {
								item.professionList = this.$dictUtils.getDictList('sys_cert_profession_accounting')
							}
						})
						this.idCardBJ = this.inputForm.otherInfoDto.idCard
						if (this.commonJS.isNotEmpty(this.inputForm.otherInfoDto.certificatesFront)){
							console.log('jlasd')
							this.ossService.getTemporaryUrl(this.inputForm.otherInfoDto.certificatesFront).then((data) => {
								console.log('data', data)
								let file = {
									url: data
								}
								this.fileList.push(file)
							})
						}
						if (this.commonJS.isNotEmpty(this.inputForm.otherInfoDto.certificatesBack)){
							console.log('jlasd')
							this.ossService.getTemporaryUrl(this.inputForm.otherInfoDto.certificatesBack).then((data) => {
								let file = {
									url: data
								}
								this.fileList2.push(file)
							})
						}

						if (this.commonJS.isEmpty(this.inputForm.rosterBankCardsDTOList)){
							this.inputForm.rosterBankCardsDTOList = []
						} else {
							this.inputForm.rosterBankCardsDTOList.forEach( (item,index) => {
								if (this.commonJS.isNotEmpty(item.payrollCardPic)) {
									 this.ossService.getTemporaryUrl(item.payrollCardPic).then((data) => {
										let file = {
											url: data
										}
										 this.fileList3[index] = []
										this.fileList3[index].push(file)
										 console.log('this.fileList3',this.fileList3[index])

										 // 手动触发 Vue 的更新
										 this.$forceUpdate();
									})
								}

							})
						}
						if (this.commonJS.isEmpty(this.inputForm.rosterCertificateDTOList)){
							this.inputForm.rosterCertificateDTOList = []
						}
						if (this.commonJS.isEmpty(this.inputForm.certDTOList)){
							this.inputForm.certDTOList = []
						} else {
							this.inputForm.certDTOList.forEach( (item,index) => {
								if (this.commonJS.isNotEmpty(item.fileUrl)) {
									this.ossService.getTemporaryUrl(item.fileUrl).then((data) => {
										let file = {
											url: data
										}
										this.fileList4[index] = []
										this.fileList4[index].push(file)

										// 手动触发 Vue 的更新
										this.$forceUpdate();
									})
								}

							})
						}
					});
				} else {
					this.initTenant();
				}
			});
		},
		initTenant(callback) {
			return new Promise((resolve) => {
				if (
					!this.$TOOL.data.get("IS_PRIMARY_TENANT") ||
					this.inputForm.tenantDTO.id ||
					this.inputForm.id
				) {
					Promise.all([
						roleService.list({
							current: 1,
							size: -1,
							tenantId: this.inputForm.tenantDTO.id,
						}),
						postService.list({
							current: 1,
							size: -1,
							tenantId: this.inputForm.tenantDTO.id,
						}),
						officeService.treeData({
							type: 1,
							tenantId: this.inputForm.tenantDTO.id,
						}),
						officeService.treeData({
							type: 2,
							tenantId: this.inputForm.tenantDTO.id,
							parentId: this.inputForm.companyDTO.id,
						}),
					]).then((result) => {
						this.roleList = result[0].records;
						this.postList = result[1].records;
						this.companyTreeData = result[2];
						this.officeTreeData = result[3];
						if (callback && typeof callback.then == "function") {
							callback.then((data) => {
								resolve(data);
							});
						}
					});
				} else {
					this.officeTreeData = [];
					this.companyTreeData = [];
					this.roleList = [];
					this.postList = [];
				}

				this.inputForm.companyDTO.id = "";
				this.inputForm.companyDTO.name = "";
				this.inputForm.officeDTO.id = "";
				this.inputForm.officeDTO.name = "";
				this.inputForm.postIdList = [];
				this.inputForm.roleIdList = [];
			});
		},
		handleChangeCompany(companyId) {
			officeService
				.treeData({
					type: 2,
					tenantId: this.inputForm.tenantDTO.id,
					parentId: companyId,
				})
				.then((data) => {
					this.officeTreeData = data;
					this.inputForm.officeDTO.id = "";
					this.inputForm.officeDTO.name = "";
				});
		},
		handleChangeTenant(tenantId) {
			if (
				!this.$TOOL.data.get("IS_PRIMARY_TENANT") ||
				this.inputForm.tenantDTO.id
			) {
				Promise.all([
					roleService.list({
						current: 1,
						size: -1,
						tenantId: tenantId,
					}),
					postService.list({
						current: 1,
						size: -1,
						tenantId: tenantId,
					}),
					officeService.treeData({ type: 1, tenantId: tenantId }),
				]).then((result) => {
					this.roleList = result[0].records;
					this.postList = result[1].records;
					this.companyTreeData = result[2];
				});
			} else {
				this.companyTreeData = [];
				this.roleList = [];
				this.postList = [];
			}

			this.inputForm.companyDTO.id = "";
			this.inputForm.companyDTO.name = "";
			this.inputForm.officeDTO.id = "";
			this.inputForm.officeDTO.name = "";
			this.inputForm.postIdList = [];
			this.inputForm.roleIdList = [];
			this.officeTreeData = [];
		},
		// 表单提交
		doSubmit() {
			this.$refs["inputForm"].validate((valid) => {
				if (valid) {
					this.loading = true;

					if (this.$refs.uploadComponent.checkProgress()) {
						this.loading = false
						return
					}
					if (this.commonJS.isEmpty(this.inputForm.files)) {
						this.loading = false
						this.inputForm.files = []
					}
					this.inputForm.files = this.$refs.uploadComponent.getDataList()
					userService
						.save(this.inputForm)
						.then((data) => {
							this.loading = false;
							this.visible = false;
							this.$message.success(data);
							this.$emit("refreshDataList");
						})
						.catch(() => {
							this.loading = false;
						});
				}
			});
		},
		validatePass2(rule, value, callback) {
			if (value !== this.inputForm.newPassword) {
				callback(new Error("两次输入密码不一致!"));
			} else {
				callback();
			}
		},
		// 身份证号rule验证
		checkIdCardRule (rule, value, callback) {
			if (this.idCardBJ !== this.inputForm.otherInfoDto.idCard) {
				//将证件类型与证件号传入到后台进行唯一性判断
				let param = {certificatesType: this.inputForm.otherInfoDto.certificatesType, idCard: this.inputForm.otherInfoDto.idCard}
				userService.findIdCardOnly(param).then((data) => {
					if (data !== 0) {
						callback(new Error('身份证号已存在，请重新确认!'))
						this.inputForm.otherInfoDto.idCard = ''
					} else {
						this.blurIdCard(value, callback)
					}
				})
			} else {
				this.blurIdCard(value, callback)
			}

		},
		blurIdCard (value, callback) {
			if (!this.commonJS.isEmpty(this.inputForm.otherInfoDto.certificatesType)) {
				if (this.inputForm.otherInfoDto.certificatesType === '1') {
					if (!this.commonJS.isEmpty(value)) {
						if (!this.commonJS.isIDCardNo(value)) {
							callback(new Error('居民身份证填写格式不正确'))
						} else {
							const info = this.commonJS.decomposeIdCard(value)
							console.log('info', info)
							this.inputForm.otherInfoDto.birthDate = info.birth
							this.inputForm.otherInfoDto.sex = info.sex
							callback()
						}
					} else {
						callback()
					}
				} else {
					callback()
				}
			} else {
				callback()
			}
		},
		handleUploadSuccess(response, file,fileList,fileType,index) {
			return this.handleAvatarSuccess(response,file,fileList,index,fileType)

		},
		handleAvatarSuccess (res, file, fileList, index, val) {
			if (val === 'front') {
				this.inputForm.otherInfoDto.certificatesFront = '/' + res.url
				this.inputForm.otherInfoDto.certificatesFrontLsUrl = res.lsUrl
				this.hideUploadEdit = true
			}
			if (val === 'back') {
				this.inputForm.otherInfoDto.certificatesBack = '/' + res.url
				this.inputForm.otherInfoDto.certificatesBackLsUrl = res.lsUrl
				this.hideUploadEdit2 = true
			}
			if (val === 'bankCards') {
				this.inputForm.rosterBankCardsDTOList[index].payrollCardPic = '/' + res.url
				this.inputForm.rosterBankCardsDTOList[index].payrollCardPicLsUrl = res.lsUrl
				this.hideUploadEdit3[index] = true
				this.fileList3[index] = fileList;
			}
			if (val === 'certDTO') {
				this.inputForm.certDTOList[index].fileUrl = '/' + res.url
				this.inputForm.certDTOList[index].fileLsUrl = res.lsUrl
				this.hideUploadEdit4[index] = true
				this.fileList4[index] = fileList;
			}

			this.$forceUpdate()
		},
		handleRemove(file, fileList,type,index) {
			if (type === 'front') {
				this.hideUploadEdit = false
				// 如果需要删除图片信息，可以根据file或其他标识从相应的数据结构中删除信息
				const fileIndex = this.fileList.indexOf(file);
				if (fileIndex !== -1) {
					this.fileList.splice(fileIndex, 1); // 从fileList中删除该图片信息
				}
			}
			if (type === 'back') {
				this.hideUploadEdit2 = false
				// 如果需要删除图片信息，可以根据file或其他标识从相应的数据结构中删除信息
				const fileIndex = this.fileList2.indexOf(file);
				if (fileIndex !== -1) {
					this.fileList2.splice(fileIndex, 1); // 从fileList中删除该图片信息
				}
			}
			if (type === 'bankCards') {
				this.hideUploadEdit3[index] = false
				// 如果需要删除图片信息，可以根据file或其他标识从相应的数据结构中删除信息
				const fileIndex = this.fileList3[index].indexOf(file);
				if (fileIndex !== -1) {
					this.fileList3[index].splice(fileIndex, 1); // 从fileList中删除该图片信息
				}
			}
			if (type === 'certDTO') {
				this.hideUploadEdit4[index] = false
				// 如果需要删除图片信息，可以根据file或其他标识从相应的数据结构中删除信息
				const fileIndex = this.fileList4[index].indexOf(file);
				if (fileIndex !== -1) {
					this.fileList4[index].splice(fileIndex, 1); // 从fileList中删除该图片信息
				}
			}

		},
		handlePictureCardPreview(file,type,index) {
			if (type === 'front') {
				this.inputForm.otherInfoDto.certificatesFrontLsUrl = file.url
				this.dialogVisible = true;
			}
			if (type === 'back') {
				this.inputForm.otherInfoDto.certificatesBackLsUrl = file.url
				this.dialogVisible2 = true;
			}
			if (type === 'bankCards') {
				this.inputForm.rosterBankCardsDTOList[index].payrollCardPicLsUrl = file.url
				this.dialogVisible3[index] = true;
			}
			if (type === 'certDTO') {
				this.inputForm.certDTOList[index].fileLsUrl = file.url
				this.dialogVisible4[index] = true;
			}

		},
		handleDownload(file,type,index) {
			let file2
			if (type === 'front') {
				file2 = {
					url: this.inputForm.otherInfoDto.certificatesFront
				}
			}
			if (type === 'back') {
				file2 = {
					url: this.inputForm.certificatesBack
				}
			}
			if (type === 'bankCards') {
				file2 = {
					url: this.inputForm.rosterBankCardsDTOList[index].payrollCardPic
				}
			}
			if (type === 'certDTO') {
				file2 = {
					url: this.inputForm.certDTOList[index].fileUrl
				}
			}

			toHref(file2)
		},
		close () {
			this.$refs.inputForm.resetFields()
			this.idCardBJ = ''
			this.fileList = []
			this.fileList2 = []
			this.fileList3 = []
			this.fileList4 = []
			this.inputForm.rosterBankCardsDTOList = []
			this.inputForm.otherInfoDto = {}
			this.inputForm.certDTOList = []
			this.inputForm.rosterCertificateDTOList = []
			this.$refs.uploadComponent.clearUpload()
			this.visible = false
		},
		// 是否默认银行卡  change事件
		checkBankDefault (index) {
			if (this.inputForm.rosterBankCardsDTOList[index].isDefault === '1') {
				const list = this.inputForm.rosterBankCardsDTOList
				for (let i = 0; i < list.length; i++) {
					if (index !== i) {
						this.inputForm.rosterBankCardsDTOList[i].isDefault = '2'
					}
				}
			}
		},
		addRow (val) {
			if (val === 'bank') {
				const bankCard = {
					id: '',
					baseId: '',
					payrollCardOpenBank: '',
					payrollCardBranches: '',
					payrollCardBankAccount: '',
					payrollCardOpeningName: '',
					payrollCardPic: '',
					isDefault: '',
					payrollCardPicLsUrl: ''
				}
				this.inputForm.rosterBankCardsDTOList.push(bankCard)
				// 初始化 fileList3 和 dialogVisible3 数组
				this.inputForm.rosterBankCardsDTOList.forEach(() => {
					this.fileList3.push([]);
					this.dialogVisible3.push(false);
				});
			}
			if (val === 'certDto') {
				const cert = {
					id: '',
					baseId: '',
					type: '',
					no: '',
					authorities: '',
					issuedDate: '',
					enrollDate: '',
					expireDate: '',
					enrollCertNo: '',
					profession: '',
					fileUrl: '',
					fileLsUrl: ''
				}
				this.inputForm.certDTOList.push(cert)
				this.inputForm.certDTOList.forEach(() => {
					this.fileList4.push([]);
					this.dialogVisible4.push(false);
				});
			}
			if (val === 'certificate') {
				const certificate = {
					id: '',
					baseId: '',
					certName: '',
					certType: '',
					certNo: '',
					issuedInstitution: '',
					issuedDate: '',
					recordDate: '',
					remindDate: '',
					expireDate: '',
					profession: '',
					level: '',
					description: ''
				}
				console.log('this.inputForm', this.inputForm)
				this.inputForm.rosterCertificateDTOList.push(certificate)
			}
		},
		delRow (index, val) {
			if (val === 'bank') {
				this.fileList3.splice(index,1)
				this.hideUploadEdit3.splice(index, 1);
				this.inputForm.rosterBankCardsDTOList.splice(index, 1)
			}
			if (val === 'certDto') {
				this.fileList4.splice(index,1)
				this.hideUploadEdit4.splice(index, 1);
				this.inputForm.certDTOList.splice(index, 1)
			}
			if (val === 'certificate') {
				this.inputForm.rosterCertificateDTOList.splice(index, 1)
			}
		},
		// 切换证书类型时，替换专业下拉选项
		changeType (index) {
			this.inputForm.certDTOList[index].profession = ''
			if (this.inputForm.certDTOList[index].type === '1' || this.inputForm.certDTOList[index].type === '2') {
				this.inputForm.certDTOList[index].professionList = this.$dictUtils.getDictList('sys_cert_profession_build')
			} else if (this.inputForm.certDTOList[index].type === '3' || this.inputForm.certDTOList[index].type === '4') {
				this.inputForm.certDTOList[index].professionList = this.$dictUtils.getDictList('sys_cert_profession_cost')
			} else if (this.inputForm.certDTOList[index].type === '5') {
				this.inputForm.certDTOList[index].professionList = this.$dictUtils.getDictList('sys_cert_profession_supervision')
			} else if (this.inputForm.certDTOList[index].type === '6') {
				this.inputForm.certDTOList[index].professionList = this.$dictUtils.getDictList('sys_cert_profession_accounting')
			}
		},
		checkIsPic (file) {
			return this.commonJS.isPic(file)
		},
	},
};
</script>
<style scoped>
.avatar {
	height: 100px;
}
.el-divider__text {
	font-weight: bold;
	font-size: 16px;
}
</style>
