admin/zhgdyun
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

劳务管理(防疫管理):编辑功能以及页面调整图片回显

Browse Source
This commit is contained in:
骆乐 2022-09-26 11:10:44 +08:00
parent f880d10c22
commit 2c45d1ddc7
2 changed files with 57 additions and 52 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

BIN
dist.zip
View File

Binary file not shown.

109
src/views/projectFront/laborManage/EpidemicPrevention/index.vue
View File

@ -85,13 +85,13 @@
<!-- 用户信息 -->
<div class="user-info cell-height">
<div class="user-photo">
<el-image :preview-src-list="[$store.state.FILEURL + row.idCardBigPhotoUrl]" :src="$store.state.FILEURL + row.idCardBigPhotoUrl" fit="cover" />
<el-image :preview-src-list="[$store.state.FILEURL + row.fieldAcquisitionUrl]" :src="$store.state.FILEURL + row.fieldAcquisitionUrl" fit="cover" />
</div>
<div class="user-info-right">
<!-- 人员名称和健康码 -->
<div class="top">
<span class="user-name">{{ row.workerName }}</span>
<span :class="['health-code', returnCodeClass(row.codeState)]">{{ codeStateEnum[row.codeState] }}</span>
<!-- <span :class="['health-code', returnCodeClass(row.codeState)]">{{ codeStateEnum[row.codeState] }}</span> -->
</div>
<div class="user-info-bottom">
<span class="user-sex">{{ row.sex == 1 ? '男' : '女' }}</span>
@ -120,7 +120,7 @@
</div>
</template>
</el-table-column>
<el-table-column align="center" prop="idCard">
<el-table-column align="left" prop="idCard">
<template #default="{ row }">
<!-- 进场日期和在职状态 -->
<div class="space-around cell-height">
@ -135,7 +135,7 @@
</div>
</template>
</el-table-column>
<el-table-column align="center" prop="team">
<el-table-column align="left" prop="team">
<template #default="{ row }">
<!-- 身份证号和人员类型 -->
<div class="space-around cell-height">
@ -151,17 +151,21 @@
</template>
</el-table-column>
<!-- 所属企业 -->
<el-table-column align="center" prop="enterpriseName">
<el-table-column align="left" prop="enterpriseName">
<template #default="{ row }">
<div class="space-around cell-height">
<div class="company">
<span class="label">所属企业：</span>
<span class="value">{{ row.enterpriseName }}</span>
</div>
<div class="health-code">
<span class="label">健康码状态：</span>
<span class="value" :class="['health-code', returnCodeClass(row.codeState)]">{{ codeStateEnum[row.codeState] }}</span>
</div>
</div>
</template>
</el-table-column>
<el-table-column align="center">
<el-table-column align="left">
<template #default="{ row }">
<!-- 核酸时间和疫苗接种针次 -->
<div class="space-around cell-height">
@ -195,13 +199,13 @@
<!-- 核酸检测记录和疫苗接种记录的弹窗 -->
<el-dialog :close-on-click-modal="false" :visible.sync="open" width="800px" append-to-body :title="title">
<el-row>
<!-- <el-row> -->
<!-- 核酸检测记录 -->
<template v-if="title == '核酸检测记录'">
<el-form ref="nucleicAcidForm" :model="nucleicAcidForm" :inline="true" :rules="nucleicAcidFormRules" label-width="80px">
<el-form ref="nucleicAcidForm" :model="nucleicAcidForm" :rules="nucleicAcidFormRules" label-width="80px">
<el-form-item label="核酸时间" prop="detectionTime">
<el-date-picker v-model="nucleicAcidForm.detectionTime" format="yyyy-MM-dd"
value-format="yyyy-MM-dd" :style="{width: '100%'}" placeholder="请选择核酸时间" clearable></el-date-picker>
<el-date-picker type="datetime" v-model="nucleicAcidForm.detectionTime" format="yyyy-MM-dd HH:mm:ss"
value-format="yyyy-MM-dd HH:mm:ss" placeholder="请选择核酸时间" clearable></el-date-picker>
</el-form-item>
<el-form-item class="upload" label="图片上传" prop="imageUrl">
<el-upload
@ -216,8 +220,9 @@
<i v-else class="el-icon-plus image-uploader-icon"></i>
</el-upload>
</el-form-item>
<el-form-item style="display: flex;justify-content: flex-end;">
<el-button size="small" type="primary" @click="submitNucleicAcidForm">提交</el-button>
<el-form-item style="display: flex;justify-content: center;">
<el-button size="small" type="primary" @click="submitCancel">取消</el-button>
<el-button size="small" type="primary" @click="submitNucleicAcidForm">保存</el-button>
</el-form-item>
</el-form>
</template>
@ -226,7 +231,7 @@
<el-form ref="vaccineForm" :model="vaccineForm" :inline="true" :rules="vaccineFormRules" size="medium"
label-width="110px">
<el-form-item label="疫苗接种时间" prop="inoculationTime">
<el-date-picker v-model="vaccineForm.inoculationTime" format="yyyy-MM-dd" value-format="yyyy-MM-dd"
<el-date-picker type="datetime" v-model="vaccineForm.inoculationTime" format="yyyy-MM-dd HH:mm:ss" value-format="yyyy-MM-dd HH:mm:ss"
:style="{width: '100%'}" placeholder="请选择疫苗接种时间" clearable></el-date-picker>
</el-form-item>
<el-form-item label="疫苗接种针次" prop="needleTimes">
@ -240,31 +245,33 @@
<el-input v-model="vaccineForm.remarks" type="textarea" placeholder="可备注疫苗厂商"
:autosize="{minRows: 4, maxRows: 4}" :style="{width: '100%'}"></el-input>
</el-form-item>
<el-form-item style="display: flex;justify-content: flex-end;">
<el-button size="small" type="primary" @click="submitVaccineForm">提交</el-button>
<el-form-item style="display: flex;justify-content: center;">
<el-button size="small" type="primary" @click="submitCancel2">取消</el-button>
<el-button size="small" type="primary" @click="submitVaccineForm">保存</el-button>
</el-form-item>
</el-form>
</template>
</el-row>
<!-- </el-row> -->
<el-table v-loading="detailLoading" :data="detailList" style="width: 100%">
<el-table-column align="center" prop="workerName" label="姓名"></el-table-column>
<el-table-column align="center" prop="phoneNumber" label="联系电话"></el-table-column>
<el-table-column align="center" prop="personType" label="人员类型">
<el-table-column align="center" width="120" prop="workerName" label="姓名"></el-table-column>
<el-table-column align="center" width="140" prop="phoneNumber" label="联系电话"></el-table-column>
<el-table-column align="center" width="100" prop="personType" label="人员类型">
<template #default="{ row }">
<span>{{ personTypeEnum[row.personType] }}</span>
</template>
</el-table-column>
<el-table-column align="center" prop="teamName" label="所属班组/部门">
<el-table-column width="130" align="center" prop="teamName" label="所属班组/部门">
<template #default="{ row }">
<span class="value">{{ row.personType == 1 ? row.teamName : row.personType == 2 ? row.departmentName : '' }}</span>
</template>
</el-table-column>
<!-- 核酸检测记录 -->
<template v-if="title == '核酸检测记录'">
<el-table-column align="center" prop="detectionTime" label="核酸时间"></el-table-column>
<el-table-column align="center" width="170" prop="detectionTime" label="核酸时间"></el-table-column>
<el-table-column align="center" prop="imageUrl" label="图片">
<template #default="{ row }">
<el-image style="width: 50px; height: 60px" :src="row.imageUrl" fit="cover"></el-image>
<!-- $store.state.FILEURL + row.idCardBigPhotoUrl -->
<el-image style="width: 50px; height: 60px" :src="$store.state.FILEURL + row.imageUrl" fit="cover"></el-image>
</template>
</el-table-column>
</template>
@ -452,6 +459,7 @@ export default {
this.loading = true;
this.queryParams.projectSn = this.projectSn;
workerList(this.queryParams).then(res => {
console.log('=========找图片',res)
this.userList = res.result.records;
this.total = res.result.total
this.loading = false;
@ -607,6 +615,13 @@ export default {
this.submitVaccineForm()
}
},
// 取消按钮
submitCancel(){
this.cancel();
},
submitCancel2(){
this.cancel();
},
/** 核酸提交按钮 */
submitNucleicAcidForm: function() {
this.$refs['nucleicAcidForm'].validate(valid => {
@ -676,6 +691,25 @@ export default {
height: calc(100% - 200px);
.cell-height {
height: 80px !important;
.health-code {
&.empty-code {
background-color: #f0f0f0;
color: #999;
}
&.green-code {
background-color: #edf7e8;
color: #58B024;
}
&.yellow-code {
background-color: #fcf7e5;
color: #FFCA00;
}
&.red-code {
background-color: #fbecec;
color: #B02424;
}
}
}
.label {
color: #737996;
@ -704,41 +738,12 @@ export default {
display: flex;
flex-direction: column;
justify-content: space-around;
.top {
box-sizing: border-box;
display: flex;
justify-content: space-between;
align-items: center;
padding-left: 10px;
.user-name {
.user-name {
font-size: 15px;
font-weight: bold;
white-space: nowrap;
color: #5181F6;
}
.health-code {
display: grid;
place-items: center;
width: 42px;
height: 25px;
&.empty-code {
background-color: #f0f0f0;
color: #999;
}
&.green-code {
background-color: #edf7e8;
color: #58B024;
}
&.yellow-code {
background-color: #fcf7e5;
color: #FFCA00;
}
&.red-code {
background-color: #fbecec;
color: #B02424;
}
}
}
.user-info-bottom {
display: flex;
justify-content: space-between;