yangjun
/
nursing_unit_vue
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

调整员工管理-员工管理-编辑界面样式

This commit is contained in:
1378012178@qq.com 2025-11-03 09:39:11 +08:00
parent 875aa2476e
commit 0f14968dad
2 changed files with 84 additions and 56 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

138
src/views/biz/bizEmployeesInfo/components/BizEmployeesInfoForm.vue
View File

@ -1,74 +1,73 @@
<template>
<a-spin :spinning="confirmLoading">
<JFormContainer :disabled="disabled">
<JFormContainer :disabled="true">
<template #detail>
<a-form ref="formRef" class="antd-modal-form" :labelCol="labelCol" :wrapperCol="wrapperCol"
name="EmployeesApplyForm">
<a-row>
<a-col :span="24">
<a-row class="card-class">
<a-col :span="24" style="border-bottom: 2px solid #f7f7f7; margin-bottom: 14px;">
<SectionDivider :title="'基本信息'" />
</a-col>
</a-row>
<a-row>
<a-col :span="6" :push="2">
<a-form-item label="头像" v-bind="validateInfos.headPath" id="BizEmployeesInfoForm-headPath"
name="headPath">
<j-image-upload :fileMax="1" :bizPath="`employeesHead`" text="头像"
v-model:value="formData.headPath"></j-image-upload>
</a-form-item>
<a-col :span="24">
<a-col :span="12">
<a-form-item label="头像" v-bind="validateInfos.headPath"
id="BizEmployeesInfoForm-headPath" name="headPath">
<j-image-upload :fileMax="1" :bizPath="`employeesHead`" text="头像"
v-model:value="formData.headPath"></j-image-upload>
</a-form-item>
</a-col>
</a-col>
</a-row>
<a-row>
<a-col :span="12">
<a-form-item label="姓名" v-bind="validateInfos.name" id="EmployeesApplyForm-name"
name="name">
<!-- <a-input v-model:value="formData.name" placeholder="请输入姓名" disabled allow-clear></a-input> -->
<span>{{ formData.name }}</span>
<a-input v-model:value="formData.name" placeholder="请输入姓名" disabled
allow-clear></a-input>
<!-- <span>{{ formData.name }}</span> -->
</a-form-item>
</a-col>
<a-col :span="12">
<a-form-item label="联系电话" v-bind="validateInfos.tel" id="EmployeesApplyForm-tel" name="tel">
<!-- <a-input v-model:value="formData.tel" placeholder="请输入联系电话" disabled allow-clear></a-input> -->
<span>{{ formData.tel }}</span>
<a-input v-model:value="formData.tel" placeholder="请输入联系电话" disabled
allow-clear></a-input>
<!-- <span>{{ formData.tel }}</span> -->
</a-form-item>
</a-col>
<a-col :span="12">
<a-form-item label="性别" v-bind="validateInfos.sex" id="EmployeesApplyForm-sex" name="sex">
<a-input v-model:value="formData.sex" placeholder="请输入性别" disabled
allow-clear></a-input>
<!-- <j-dict-select-tag type='radio' v-model:value="formData.sex" dictCode="sex" placeholder="请选择性别" disabled
allow-clear /> -->
<span>{{ formData.sex }}</span>
<!-- <span>{{ formData.sex }}</span> -->
</a-form-item>
</a-col>
<a-col :span="12">
<a-form-item label="年龄" v-bind="validateInfos.sex" id="EmployeesApplyForm-sex" name="sex">
<span> {{ handleComputedAge(formData.dateOfBirth) }}</span>
<a-input v-model:value="ageVal" placeholder="请输入年龄" disabled allow-clear></a-input>
<!-- <span> {{ handleComputedAge(formData.dateOfBirth) }}</span> -->
</a-form-item>
</a-col>
<a-col :span="12">
<a-form-item label="出生日期" v-bind="validateInfos.dateOfBirth"
id="EmployeesApplyForm-dateOfBirth" name="dateOfBirth">
<!-- <a-date-picker placeholder="请选择出生日期" v-model:value="formData.dateOfBirth" value-format="YYYY-MM-DD"
style="width: 100%" disabled allow-clear /> -->
<span>{{ formData.dateOfBirth }}</span>
<a-date-picker placeholder="请选择出生日期" v-model:value="formData.dateOfBirth"
value-format="YYYY-MM-DD" style="width: 100%" disabled allow-clear />
<!-- <span>{{ formData.dateOfBirth }}</span> -->
</a-form-item>
</a-col>
<a-col :span="12">
<a-form-item label="民族" v-bind="validateInfos.national" id="EmployeesApplyForm-national"
name="national">
<!-- <a-input v-model:value="formData.national" placeholder="请输入民族" disabled allow-clear></a-input> -->
<span>{{ formData.national }}</span>
</a-form-item>
</a-col>
<a-col :span="12">
<a-form-item label="家庭住址" v-bind="validateInfos.address" id="EmployeesApplyForm-address"
name="address">
<!-- <a-textarea v-model:value="formData.address" :rows="4" placeholder="请输入家庭住址" disabled /> -->
<span>{{ formData.address }}</span>
<a-input v-model:value="formData.national" placeholder="请输入民族" disabled
allow-clear></a-input>
<!-- <span>{{ formData.national }}</span> -->
</a-form-item>
</a-col>
<a-col :span="12">
<a-form-item label="身份证号">
<span>{{ formData.idCard }}</span>
<a-input v-model:value="formData.idCard" placeholder="请输入身份证号" disabled
allow-clear></a-input>
<!-- <span>{{ formData.idCard }}</span> -->
</a-form-item>
</a-col>
<a-col :span="12">
@ -76,21 +75,25 @@
id="EmployeesApplyForm-marriedOrNot" name="marriedOrNot">
<!-- <j-dict-select-tag type='radio' v-model:value="formData.marriedOrNot" dictCode="married_or_not"
placeholder="请选择婚否" disabled allow-clear /> -->
<span>{{ formData.marriedOrNot }}</span>
<a-input v-model:value="formData.marriedOrNot" placeholder="请输入婚否" disabled
allow-clear></a-input>
<!-- <span>{{ formData.marriedOrNot }}</span> -->
</a-form-item>
</a-col>
<a-col :span="12">
<a-form-item label="身高" v-bind="validateInfos.height" id="EmployeesApplyForm-height"
<a-form-item label="身高(cm)" v-bind="validateInfos.height" id="EmployeesApplyForm-height"
name="height">
<!-- <a-input-number v-model:value="formData.height" placeholder="请输入身高" style="width: 100%" disabled /> -->
<span>{{ formData.height }}cm</span>
<a-input-number v-model:value="formData.height" placeholder="请输入身高" style="width: 100%"
disabled />
<!-- <span>{{ formData.height }}cm</span> -->
</a-form-item>
</a-col>
<a-col :span="12">
<a-form-item label="体重" v-bind="validateInfos.weight" id="EmployeesApplyForm-weight"
<a-form-item label="体重(kg)" v-bind="validateInfos.weight" id="EmployeesApplyForm-weight"
name="weight">
<!-- <a-input-number v-model:value="formData.weight" placeholder="请输入体重" style="width: 100%" disabled /> -->
<span>{{ formData.weight }}kg</span>
<a-input-number v-model:value="formData.weight" placeholder="请输入体重" style="width: 100%"
disabled />
<!-- <span>{{ formData.weight }}kg</span> -->
</a-form-item>
</a-col>
<!-- <a-col :span="12">
@ -106,7 +109,9 @@
id="EmployeesApplyForm-healthStatus" name="healthStatus">
<!-- <j-dict-select-tag type='radio' v-model:value="formData.healthStatus" dictCode="health_status" disabled
placeholder="请选择健康状况" allow-clear /> -->
<span>{{ formData.healthStatus }}</span>
<a-input v-model:value="formData.healthStatus" placeholder="请输入健康状况" style="width: 100%"
disabled />
<!-- <span>{{ formData.healthStatus }}</span> -->
</a-form-item>
</a-col>
<a-col :span="12">
@ -114,37 +119,41 @@
id="EmployeesApplyForm-politicalAppearance" name="politicalAppearance">
<!-- <j-dict-select-tag v-model:value="formData.politicalAppearance" dictCode="political_appearance" disabled
placeholder="请选择政治面貌" allow-clear /> -->
<span>{{ formData.politicalAppearance }}</span>
<a-input v-model:value="formData.politicalAppearance" placeholder="请输入政治面貌"
style="width: 100%" disabled />
<!-- <span>{{ formData.politicalAppearance }}</span> -->
</a-form-item>
</a-col>
<a-col :span="12">
<a-form-item label="户籍所在地" v-bind="validateInfos.houseAddress"
id="EmployeesApplyForm-houseAddress" name="houseAddress">
<!-- <a-input v-model:value="formData.houseAddress" placeholder="请输入户籍所在地" disabled allow-clear></a-input> -->
<span>{{ formData.houseAddress }}</span>
<a-input v-model:value="formData.houseAddress" placeholder="请输入户籍所在地" disabled
allow-clear></a-input>
<!-- <span>{{ formData.houseAddress }}</span> -->
</a-form-item>
</a-col>
<a-col :span="12">
<a-form-item label="紧急联系人" v-bind="validateInfos.emergencyContact"
id="EmployeesApplyForm-emergencyContact" name="emergencyContact">
<!-- <a-input v-model:value="formData.emergencyContact" placeholder="请输入紧急联系人" disabled
allow-clear></a-input> -->
<span>{{ formData.emergencyContact }}</span>
<a-input v-model:value="formData.emergencyContact" placeholder="请输入紧急联系人" disabled
allow-clear></a-input>
<!-- <span>{{ formData.emergencyContact }}</span> -->
</a-form-item>
</a-col>
<a-col :span="12">
<a-form-item label="紧急联系人电话" v-bind="validateInfos.emergencyTel"
id="EmployeesApplyForm-emergencyTel" name="emergencyTel">
<!-- <a-input v-model:value="formData.emergencyTel" placeholder="请输入紧急联系人电话" disabled allow-clear></a-input> -->
<span>{{ formData.emergencyTel }}</span>
<a-input v-model:value="formData.emergencyTel" placeholder="请输入紧急联系人电话" disabled
allow-clear></a-input>
<!-- <span>{{ formData.emergencyTel }}</span> -->
</a-form-item>
</a-col>
<a-col :span="12">
<a-form-item label="与本人关系" v-bind="validateInfos.emergencyRelationship"
id="EmployeesApplyForm-emergencyRelationship" name="emergencyRelationship">
<!-- <a-input v-model:value="formData.emergencyRelationship" placeholder="请输入紧急联系人与本人关系" disabled
allow-clear></a-input> -->
<span>{{ formData.emergencyRelationship }}</span>
<a-input v-model:value="formData.emergencyRelationship" placeholder="请输入紧急联系人与本人关系"
disabled allow-clear></a-input>
<!-- <span>{{ formData.emergencyRelationship }}</span> -->
</a-form-item>
</a-col>
<a-col :span="12">
@ -152,13 +161,17 @@
id="EmployeesApplyForm-hukouNature" name="hukouNature">
<!-- <j-dict-select-tag type='radio' v-model:value="formData.hukouNature" dictCode="hukou_nature" disabled
placeholder="请选择户口性质" allow-clear /> -->
<span>{{ formData.hukouNature }}</span>
<a-input v-model:value="formData.hukouNature" placeholder="请输入户口性质" disabled
allow-clear></a-input>
<!-- <span>{{ formData.hukouNature }}</span> -->
</a-form-item>
</a-col>
<a-col :span="12">
<a-form-item label="现住址" v-bind="validateInfos.currentAddress"
id="EmployeesApplyForm-currentAddress" name="currentAddress">
<span>{{ formData.currentAddress }}</span>
<a-input v-model:value="formData.currentAddress" placeholder="请输入现住址" disabled
allow-clear></a-input>
<!-- <span>{{ formData.currentAddress }}</span> -->
</a-form-item>
</a-col>
</a-row>
@ -169,8 +182,8 @@
<template #detail>
<a-form ref="formRef" class="antd-modal-form" :labelCol="labelCol2" :wrapperCol="wrapperCol2"
name="EmployeesApplyForm">
<a-row>
<a-col :span="24">
<a-row class="card-class">
<a-col :span="24" style="border-bottom: 2px solid #f7f7f7; margin-bottom: 14px;">
<SectionDivider :title="'证件信息'" />
</a-col>
<a-col :span="23" :push="1">
@ -307,6 +320,7 @@ const opeMediaAddress = import.meta.env.VITE_OPE_MEDIA_ADDRESS
const formRef = ref();
const useForm = Form.useForm;
const emit = defineEmits(['register', 'ok']);
const ageVal = ref()
const formData = reactive<Record<string, any>>({
id: '',
name: '',
@ -382,6 +396,7 @@ function add() {
* 编辑
*/
function edit(record) {
ageVal.value = handleComputedAge(record.dateOfBirth)
nextTick(() => {
resetFields();
const tmpData = {};
@ -481,4 +496,17 @@ defineExpose({
.antd-modal-form {
// padding: 14px;
}
.card-class {
padding-top: 24px;
padding-bottom: 24px;
padding-left: 14px;
padding-right: 14px;
// background-color: rgba(255, 255, 255, 0.9);
background-color: #fcfdff;
border-radius: 10px;
// box-shadow: rgba(0, 0, 0, 0.1) 0px 2px 12px;
margin-bottom: 14px;
}
</style>

2
src/views/biz/bizEmployeesInfo/components/BizEmployeesInfoModal.vue
View File

@ -3,7 +3,7 @@
<BizEmployeesInfoForm ref="registerForm" @ok="submitCallback" :formDisabled="disableSubmit" :formBpm="false"></BizEmployeesInfoForm>
</j-modal> -->
<a-drawer :title="title" width="70vw" :visible="visible" :closable="true" :footer-style="{ textAlign: 'right' }"
@close="handleCancel">
:bodyStyle="{ padding: '14px' }" @close="handleCancel">
<template #footer>
<a-button type="primary" style="margin-right: 8px" @click="handleCancel">关闭</a-button>
<a-button type="primary" @click="handleOk" v-if="!disableSubmit">确认</a-button>