城阳pc工作端前端代码
You can not select more than 25 topics Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.

944 lines
30 KiB

<template>
<div class="resi-container">
3 years ago
<el-card ref="searchCard"
class="search-card">
<el-form :inline="true"
:model="dataForm"
@keyup.enter.native="getDataList()">
<div>
3 years ago
<el-form-item prop="gridId"
label="所属网格"
3 years ago
label-width="80px">
<div class="resi-cell-value">
3 years ago
<el-select v-model.trim="dataForm.gridId"
placeholder="请选择网格"
size="small"
clearable
class="resi-cell-select"
@change="handleChangeGrid">
<el-option v-for="item in optionsG"
:key="item.value"
:label="item.label"
:value="item.value">
</el-option>
</el-select>
</div>
</el-form-item>
<el-form-item label="所属房屋">
<div class="resi-cell-value">
<div class="resi-cell-col">
<el-form-item prop="villageId">
3 years ago
<el-select v-model.trim="dataForm.villageId"
placeholder="请选择小区"
size="small"
clearable
class="resi-cell-select"
@change="handleChangeV">
<el-option v-for="item in optionsV"
:key="item.value"
:label="item.label"
:value="item.value">
</el-option>
</el-select>
</el-form-item>
<el-form-item prop="buildId">
3 years ago
<el-select v-model.trim="dataForm.buildId"
placeholder="楼号"
size="small"
clearable
:disabled="changeVDisabled"
class="resi-cell-select resi-cell-select-middle"
@change="handleChangeB">
<el-option v-for="item in optionsB"
:key="item.value"
:label="item.label"
:value="item.value">
</el-option>
</el-select>
</el-form-item>
<el-form-item prop="unitId">
3 years ago
<el-select v-model.trim="dataForm.unitId"
placeholder="单元"
size="small"
clearable
:disabled="changeBDisabled"
class="resi-cell-select resi-cell-select-middle"
@change="handleChangeD">
<el-option v-for="item in optionsD"
:key="item.value"
:label="item.label"
:value="item.value">
</el-option>
</el-select>
</el-form-item>
<el-form-item prop="homeId">
3 years ago
<el-select v-model.trim="dataForm.homeId"
placeholder="房号"
size="small"
clearable
:disabled="changeDDisabled"
class="resi-cell-select resi-cell-select-middle">
<el-option v-for="item in optionsH"
:key="item.value"
:label="item.label"
:value="item.value">
</el-option>
</el-select>
</el-form-item>
</div>
</div>
</el-form-item>
</div>
<div>
3 years ago
<el-form-item label="姓名"
prop="name"
3 years ago
label-width="80px">
3 years ago
<el-input v-model="dataForm.name"
placeholder="姓名"
clearable></el-input>
</el-form-item>
<el-form-item label="证件号"
prop="idCard">
<el-input v-model="dataForm.idCard"
placeholder="证件号"
clearable></el-input>
</el-form-item>
<el-form-item label="联系电话"
prop="mobile">
<el-input v-model="dataForm.mobile"
placeholder="联系电话"
clearable></el-input>
</el-form-item>
<el-form-item label="是否接种"
prop="isVaccination">
<el-select v-model="dataForm.isVaccination"
placeholder="是否接种"
clearable>
<el-option v-for="item in isVaccinationArr"
:key="item.dictValue"
:label="item.dictName"
:value="item.dictValue">
</el-option>
</el-select>
</el-form-item>
<el-form-item>
<el-button class="diy-button--search"
size="small"
@click="getDataList()">{{ $t('query') }}</el-button>
<el-button class="diy-button--reset"
size="small"
@click="resetForm()">重置</el-button>
</el-form-item>
</div>
</el-form>
3 years ago
</el-card>
<el-card class="resi-card-table">
<div class="resi-row-btn">
<el-button class="diy-button--add"
type="primary"
size="small"
@click="handleAdd">{{ $t('add') }}</el-button>
<el-button class="diy-button--export"
size="small"
@click="handleExportModule()">下载模板</el-button>
<el-upload :headers="$getElUploadHeaders()"
ref="upload"
class="upload-btn"
:multiple="false"
:show-file-list="false"
:before-upload="
(file) => {
beforeUpload(file);
}
"
3 years ago
action=""
accept=".xls,.xlsx"
:http-request="
() => {
uploadFile();
}
3 years ago
">
<el-button size="small"
class="diy-button--delete">导入</el-button>
</el-upload>
<el-button class="diy-button--reset"
size="small"
@click="handleExport">导出</el-button>
</div>
<el-table v-loading="dataListLoading"
:data="dataList"
border
class="resi-table"
@selection-change="dataListSelectionChangeHandle"
3 years ago
style="width: 100%;"
:height="maxTableHeight">
3 years ago
<el-table-column label="序号"
header-align="center"
align="center"
width="50px">
<template slot-scope="scope">
{{scope.$index+1}}
</template>
</el-table-column>
3 years ago
<el-table-column prop="gridName"
label="网格名称"
header-align="center"
align="center"
width="120"
show-overflow-tooltip></el-table-column>
<el-table-column prop="villageName"
label="所属小区"
header-align="center"
align="center"
width="130"
show-overflow-tooltip></el-table-column>
<el-table-column prop="buildName"
label="所属楼宇"
header-align="center"
align="center"
width="80"
show-overflow-tooltip></el-table-column>
<el-table-column prop="unitName"
label="单元"
header-align="center"
align="center"
width="80"
show-overflow-tooltip></el-table-column>
<el-table-column prop="homeName"
label="房间名"
header-align="center"
align="center"
width="80"
show-overflow-tooltip></el-table-column>
<el-table-column prop="householdTypeName"
label="户口性质"
header-align="center"
align="center"
width="80"
show-overflow-tooltip></el-table-column>
<el-table-column prop="name"
label="姓名"
header-align="center"
align="center"
width="80"
show-overflow-tooltip></el-table-column>
<el-table-column prop="mobile"
label="联系电话"
header-align="center"
align="center"
width="120"
show-overflow-tooltip></el-table-column>
<el-table-column prop="idCard"
label="证件号"
header-align="center"
align="center"
width="170"
show-overflow-tooltip></el-table-column>
<el-table-column prop="isVaccinationName"
label="是否接种"
header-align="center"
align="center"
width="80"
show-overflow-tooltip></el-table-column>
<el-table-column prop="firstVacTime"
label="第一次接种时间"
header-align="center"
align="center"
width="110"
show-overflow-tooltip></el-table-column>
<el-table-column prop="firstVacSite"
label="第一次接种地点"
header-align="center"
align="center"
width="110"
show-overflow-tooltip></el-table-column>
<el-table-column prop="secondVacTime"
label="第二次接种时间"
header-align="center"
align="center"
width="110"
show-overflow-tooltip></el-table-column>
<el-table-column prop="secondVacSite"
label="第二次接种地点"
header-align="center"
align="center"
width="110"
show-overflow-tooltip></el-table-column>
<el-table-column prop="thirdVacTime"
label="第三次接种时间"
header-align="center"
align="center"
width="110"
show-overflow-tooltip></el-table-column>
<el-table-column prop="thirdVacSite"
label="第三次接种地点"
header-align="center"
align="center"
width="110"
show-overflow-tooltip></el-table-column>
<el-table-column prop="reason"
label="原因"
header-align="center"
align="center"
width="110"
show-overflow-tooltip></el-table-column>
<el-table-column prop="note"
label="备注"
header-align="center"
align="center"
width="110"
show-overflow-tooltip></el-table-column>
<el-table-column prop="checkStateName"
label="审核状态"
header-align="center"
align="center"
width="80"
show-overflow-tooltip></el-table-column>
<el-table-column prop="checkReason"
label="审核理由"
header-align="center"
align="center"
width="80"
show-overflow-tooltip></el-table-column>
<el-table-column :label="$t('handle')"
fixed="right"
header-align="center"
align="center"
width="170">
<template slot-scope="scope">
3 years ago
<el-button v-if="scope.row.checkState === '0'"
type="text"
size="small"
class="div-table-button--edit"
@click="handleEdit(scope.$index)">{{ $t('update') }}</el-button>
<el-button v-if="scope.row.checkState !== '2'"
type="text"
size="small"
class="div-table-button--delete--noline"
@click="handleDelete(scope.row.id)">{{ $t('delete') }}</el-button>
<el-button v-if="scope.row.checkState === '0'"
type="text"
class="div-table-button--detail"
size="small"
@click="handleWatch(scope.row)">审核</el-button>
<el-button type="text"
class="div-table-button--detail"
size="small"
@click="handleLook(scope.$index)">查看</el-button>
</template>
</el-table-column>
</el-table>
3 years ago
<el-pagination :current-page="page"
:page-sizes="[10, 20, 50, 100]"
:page-size="limit"
:total="total"
layout="total, sizes, prev, pager, next, jumper"
@size-change="pageSizeChangeHandle"
@current-change="pageCurrentChangeHandle">
</el-pagination>
<!-- 弹窗, 新增 / 修改 -->
3 years ago
<!-- <add-or-update v-if="addOrUpdateVisible" ref="addOrUpdate" @refreshDataList="getDataList"></add-or-update>-->
<!-- <icvaccineprarmeter-check v-if="checkVisible" ref="checkPage" @refreshDataList="getDataList"></icvaccineprarmeter-check>-->
</el-card>
<el-dialog :visible.sync="checkVisible"
:close-on-click-modal="false"
:close-on-press-escape="false"
:title="formTitle"
width="850px"
top="5vh"
class="dialog-h"
@closed="addDiaClose">
<add-or-update ref="add_parameter"
@dialogCancle="addDiaClose"
@dialogOk="addFormOk">
</add-or-update>
</el-dialog>
<el-dialog :visible.sync="detailShow"
:close-on-click-modal="false"
:close-on-press-escape="false"
:title="'详情'"
width="850px"
top="5vh"
class="dialog-h"
@closed="diaDetailClose">
<detail ref="ref_detail"
@dialogCancle="diaDetailClose">
</detail>
</el-dialog>
<!-- 审核 -->
<el-dialog :visible.sync="formShow"
:close-on-click-modal="false"
:close-on-press-escape="false"
:title="formTitle_shenhe"
width="900px"
top="5vh"
class="dialog-h"
@closed="diaClose">
<icvaccineprarmeter-check ref="icvaccineprarmeter_check"
@dialogCancle="addFormCancle"
@dialogOk="addFormOk_shenhe"></icvaccineprarmeter-check>
</el-dialog>
</div>
</template>
<script>
import mixinViewModule from '@/mixins/view-module'
import AddOrUpdate from './icvaccineprarmeter-add-or-update'
3 years ago
import detail from './icvaccineprarmeter-detail'
import nextTick from "dai-js/tools/nextTick";
3 years ago
import { requestPost, requestGet } from "@/js/dai/request";
import IcvaccineprarmeterCheck from './icvaccineprarmeter-check'
3 years ago
import { mapGetters } from "vuex";
export default {
mixins: [mixinViewModule],
data () {
return {
mixinViewModuleOptions: {
getDataListURL: '/epmetuser/icVaccinePrarmeter/page',
getDataListIsPage: true,
deleteURL: '/epmetuser/icVaccinePrarmeter',
deleteIsBatch: true
},
dataForm: {
3 years ago
id: '',
gridId: '',
villageId: '',
buildId: '',
unitId: '',
homeId: '',
name: '',
idCard: '',
mobile: '',
isVaccination: ''
},
isVaccinationArr: [
{ dictValue: '0', dictName: '否' },
{ dictValue: '1', dictName: '是' }
],
optionsV: [],
optionsB: [],
optionsH: [],
optionsD: [],
optionsG: [],
checkVisible: false,
formTitle: "新增",
// 审核
formShow: false,
formTitle_shenhe: "审核",
// 审核 end
detailShow: false
}
},
components: {
AddOrUpdate,
3 years ago
IcvaccineprarmeterCheck,
detail
},
3 years ago
computed: {
maxTableHeight () {
return this.$store.state.inIframe
? this.clientHeight - 360 + this.iframeHeigh
: this.clientHeight - 360;
},
...mapGetters(["clientHeight", "iframeHeight"]),
changeVDisabled () {
return !this.dataForm.villageId
},
changeBDisabled () {
return !this.dataForm.buildId
},
changeDDisabled () {
return !this.dataForm.unitId
}
},
3 years ago
mounted () {
this.getGridList()
this.getValiheList()
},
3 years ago
methods: {
// 审核 s
diaClose () {
// this.$refs.icvaccineprarmeter_check.resetData();
this.formShow = false;
},
addFormCancle () {
this.formShow = false;
},
addFormOk_shenhe () {
this.formShow = false;
this.getDataList();
},
// 审核 end
//新增
handleAdd () {
this.formTitle = "新增";
this.checkVisible = true;
this.$nextTick(() => {
this.$refs.add_parameter.init();
});
// await this.$refs.ref_form_add.init();
},
async handleEdit (rowIndex) {
this.formTitle = "修改";
this.checkVisible = true;
await nextTick();
this.$refs.add_parameter.init(this.dataList[rowIndex]);
},
async handleDelete (id) {
this.$confirm("确认删除?", "提示", {
confirmButtonText: "确定",
cancelButtonText: "取消",
type: "warning",
})
.then(() => {
this.deleteNat(id);
})
.catch((err) => {
if (err == "cancel") {
}
3 years ago
});
3 years ago
},
async deleteNat (id) {
const url = "/epmetuser/icVaccinePrarmeter/delete";
let params = [id];
const { data, code, msg } = await requestPost(url, params);
if (code === 0) {
this.$message({
type: "success",
message: "删除成功",
});
this.getDataList();
} else {
this.$message.error(msg);
}
},
// 审核
async handleWatch (row) {
await nextTick();
const url = "/gov/org/ichouse/checkHomeInfo";
const { data, code, msg } = await requestPost(url, {
gridId: row.gridId,
gridName: row.gridName,
villageName: row.villageName,
buildName: row.buildName,
unitName: row.unitName,
homeName: row.homeName,
});
if (code === 0) {
console.log("data----de", data);
if (data.code === '1') {
this.$message.success(data.msg);
} else {
// 打开审核页面
// this.checkVisible = true
// this.$nextTick(() => {
// this.$refs.checkPage.dataForm.id = row.id
// // 是否新增房屋:0:否;1:是
// this.$refs.checkPage.isAdd = data.isAdd
// // 单元ID
// this.$refs.checkPage.unitId = data.unitId
// this.$refs.checkPage.init()
// })
// 打开审核页面
this.formShow = true;
this.$nextTick(() => {
this.$refs.icvaccineprarmeter_check.initForm("add", row.id, data.isAdd, data.unitId, data);
// this.$refs.checkPage.dataForm.id = row.id
// // 是否新增房屋:0:否;1:是
// this.$refs.checkPage.isAdd = data.isAdd
// // 单元ID
// this.$refs.checkPage.unitId = data.unitId
// this.$refs.checkPage.init()
})
3 years ago
}
3 years ago
} else {
this.$message.success("操作失败!");
}
},
async handleLook (rowIndex) {
// this.formTitle = "查看";
3 years ago
this.detailShow = true;
this.$nextTick(() => {
this.$refs.ref_detail.init(this.dataList[rowIndex], true);
})
3 years ago
},
diaDetailClose () {
3 years ago
this.detailShow = false
3 years ago
},
handleClearVillage () {
this.dataForm.buildId = ''
this.dataForm.homeId = ''
},
handleClearBuild () {
this.dataForm.buildId = ''
this.dataForm.unitId = ''
this.dataForm.homeId = ''
},
handleClearDan () {
this.dataForm.unitId = ''
this.dataForm.homeId = ''
},
handleChangeGrid (val) {
console.log('val', val)
this.dataForm.villageId = ''
this.dataForm.buildId = ''
this.dataForm.unitId = ''
this.dataForm.homeId = ''
this.getValiheList()
},
handleChangeV (val) {
console.log('val', val)
this.dataForm.buildId = ''
this.dataForm.unitId = ''
this.dataForm.homeId = ''
this.getBuildList()
},
handleChangeB (val) {
console.log('val', val)
this.dataForm.unitId = ''
this.dataForm.homeId = ''
this.getUniList()
},
handleChangeD (val) {
console.log('val', val)
this.dataForm.homeId = ''
this.getHouseList()
},
addFormOk () {
this.checkVisible = false;
this.getDataList();
},
addDiaClose () {
this.checkVisible = false;
this.$refs.add_parameter.resetData()
},
getGridList () {
const { user } = this.$store.state
this.$http
.post('/gov/org/customergrid/gridoption', {
agencyId: user.agencyId,
purpose: 'addorupdate'
})
.then(({ data: res }) => {
if (res.code !== 0) {
return this.$message.error(res.msg)
} else {
3 years ago
console.log('获取查询详情成功', res.data)
this.optionsG = res.data
}
3 years ago
})
.catch(() => {
return this.$message.error('网络错误')
})
},
getValiheList () {
const { user } = this.$store.state
this.$http
.post('/actual/base/communityQuarters/listQuartersOptions', {
3 years ago
gridId: this.dataForm.gridId,
agencyId: ''
// agencyId: user.agencyId
})
.then(({ data: res }) => {
if (res.code !== 0) {
return this.$message.error(res.msg)
} else {
3 years ago
console.log('获取查询详情成功', res.data)
this.optionsV = res.data
}
3 years ago
})
.catch(() => {
return this.$message.error('网络错误')
})
},
getBuildList () {
this.$http
.post('/actual/base/communityBuilding/buildingoption', {
quartersId: this.dataForm.villageId
3 years ago
})
.then(({ data: res }) => {
if (res.code !== 0) {
return this.$message.error(res.msg)
} else {
console.log('获取查询详情成功', res.data)
this.optionsB = res.data
}
3 years ago
})
.catch(() => {
return this.$message.error('网络错误')
})
},
getUniList () {
this.$http
.post('/actual/base/communityBuildingUnit/unitoption', {
3 years ago
buildingId: this.dataForm.buildId
})
.then(({ data: res }) => {
if (res.code !== 0) {
return this.$message.error(res.msg)
} else {
console.log('获取查询详情成功', res.data)
this.optionsD = res.data
}
3 years ago
})
.catch(() => {
return this.$message.error('网络错误')
})
},
getHouseList () {
this.$http
.post('/actual/base/communityHouse/houseoption', { unitId: this.dataForm.unitId })
3 years ago
.then(({ data: res }) => {
if (res.code !== 0) {
return this.$message.error(res.msg)
} else {
console.log('获取查询详情成功', res.data)
this.optionsH = res.data
}
})
.catch(() => {
return this.$message.error('网络错误')
})
},
//重置搜索条件
resetForm () {
this.dataForm = {
gridId: '',
villageId: '',
buildId: '',
unitId: '',
homeId: '',
name: '',
idCard: '',
mobile: '',
isVaccination: ''
};
this.pageNo = 1
this.getDataList()
},
// 上传文件之前的钩子
beforeUpload (file) {
this.files = file;
const isText = file.type === "application/vnd.ms-excel";
const isTextComputer =
file.type ===
"application/vnd.openxmlformats-officedocument.spreadsheetml.sheet";
if (!isText && !isTextComputer) {
this.$message.error("请选择正确格式的文件");
this.files = null;
this.fileName = "";
return false;
} else {
this.fileName = file.name;
return true;
}
},
async uploadFile () {
if (this.fileName == "") {
this.$message.warning("请选择要上传的文件!");
return false;
}
3 years ago
this.$message({
showClose: true,
dangerouslyUseHTMLString: true,
message: "导入中,请到系统管理-<a id='clickA' style='cursor: pointer;'>导入记录</a>中查看进度",
duration: 3000
});
let than = this
document.getElementById('clickA').addEventListener('click',function(){
than.$router.replace('/main/importRecord-index');
})
3 years ago
//清空上传列表
this.$refs["upload"].clearFiles();
let url = "";
let fileFormData = new FormData();
fileFormData.append("file", this.files); //filename是键,file是值,就是要传的文件,test.zip是要传的文件名
url = "/epmetuser/icVaccinePrarmeter/importFile";
window.app.ajax.post2(
url,
fileFormData,
(data, rspMsg) => {
if (data.code === 0 && data.msg == "success") {
// this.$message.success('导入成功')
} else {
// this.$message({
// showClose: true,
// message: rspMsg,
// duration: 0,
// type: "error"
// })
// this.$message.error(rspMsg)
}
3 years ago
this.loadTable();
},
(rspMsg, data) => { },
{ headers: { "Content-Type": "multipart/form-data" } }
);
},
//导出表格
async handleExport () {
let title = "新冠病毒疫苗接种人员信息台账";
const url = "/epmetuser/icVaccinePrarmeter/vaccine-export";
app.ajax.exportFilePost(
url,
this.dataForm,
(data, rspMsg) => {
console.log(data)
this.download(data, title + ".xlsx");
},
(rspMsg, data) => {
this.$message.error(rspMsg);
}
);
},
// 下载文件
download (data, fileName) {
if (!data) {
return;
}
var csvData = new Blob([data]);
if (window.navigator && window.navigator.msSaveOrOpenBlob) {
window.navigator.msSaveOrOpenBlob(csvData, fileName);
}
else {
var a = document.createElement("a");
document.body.appendChild(a);
a.style = "display: none";
var url = window.URL.createObjectURL(csvData);
a.href = url;
a.download = fileName;
a.click();
a.remove();
window.URL.revokeObjectURL(url);
}
},
handleExportModule () {
let title = "新冠病毒疫苗接种人员信息台账模板";
let url = "/epmetuser/icVaccinePrarmeter/exporttemplate";
let params = {};
app.ajax.exportFilePost(
url,
params,
(data, rspMsg) => {
this.download(data, title + ".xls");
},
(rspMsg, data) => {
this.$message.error(rspMsg);
}
);
},
3 years ago
}
}
</script>
<style lang="scss" scoped>
3 years ago
@import "@/assets/scss/buttonstyle.scss";
@import "@/assets/scss/modules/visual/communityManage.scss";
@import "@/assets/scss/modules/management/list-main.scss";
.resi-container .resi-card-table {
::v-deep .el-table th {
color: #fff;
background-color: rgba(33, 149, 254, 1);
// border-right: 1px solid rgba(33, 149, 254, 1);
}
3 years ago
}
.resi-table {
::v-deep .el-button--text {
text-decoration: underline;
}
3 years ago
}
.resi-card-table {
margin-top: 20px;
}
.resi-row-btn {
margin-bottom: 13px;
.upload-btn {
display: inline-block;
margin: 0 10px;
}
3 years ago
}
3 years ago
.resi-btns {
margin-top: 20px;
text-align: center;
}
3 years ago
.resi-container .resi-card {
position: relative;
overflow: visible;
}
3 years ago
.demo-form-inline {
// display: flex;
// align-items: center;
// margin-bottom: 20px;
.resi-cell-label {
flex-shrink: 0;
min-width: 0;
box-sizing: border-box;
margin-right: 15px;
// text-align: right;
// line-height: 32;
}
.resi-cell-label1 {
width: max-content;
}
.resi-cell-value-radio {
display: flex;
align-items: center;
min-height: 32px;
}
.resi-cell-input {
width: 200px;
}
.resi-cell--daterange {
max-width: 260px;
}
.resi-cell-select {
width: 200px;
box-sizing: border-box;
margin-right: 10px;
&-middle {
width: 120px;
}
3 years ago
&-small {
width: 88px;
}
}
3 years ago
.resi-cell-select:last-child {
margin-right: 0;
}
3 years ago
}
.mt10 {
margin-top: 10px;
}
</style>