3 changed files with 341 additions and 31 deletions
@ -1,49 +1,329 @@ |
|||||
<template> |
<template> |
||||
<div class="g-main"> |
<div class="g-main"> |
||||
<div class="title-small title_postion">基础信息</div> |
<div> |
||||
<el-row type="flex" class="f-m-top29"> |
<div class="title-small"></div> |
||||
<el-col :span="12" class="f-flex"> |
<el-row type="flex" class="f-m-top29"> |
||||
<div class="f-label">所属网格:</div> |
<el-col :span="12" class="f-flex"> |
||||
<div class="f-left8 f-font-color">{{ gridName }}</div> |
<div class="f-label">姓名:</div> |
||||
</el-col> |
<div class="f-left8 f-font-color">{{ name }}</div> |
||||
<el-col :span="12" class="f-flex"> |
</el-col> |
||||
<div class="f-label">所属房屋:</div> |
</el-row> |
||||
<div class="f-left8 f-font-color">{{ homeName }}</div> |
<el-row type="flex" class="f-m-top29"> |
||||
</el-col> |
<el-col :span="12" class="f-flex"> |
||||
</el-row> |
<div class="f-label">联系电话:</div> |
||||
|
<div class="f-left8 f-font-color">{{ mobile }}</div> |
||||
|
</el-col> |
||||
|
</el-row> |
||||
|
<el-row type="flex" class="f-m-top29"> |
||||
|
<el-col :span="12" class="f-flex"> |
||||
|
<div class="f-label">所属组织:</div> |
||||
|
<div class="f-left8 f-font-color">{{ gridName }}</div> |
||||
|
</el-col> |
||||
|
</el-row> |
||||
|
<el-row type="flex" class="f-m-top29"> |
||||
|
<el-col :span="12" class="f-flex"> |
||||
|
<div class="f-label">所属房屋:</div> |
||||
|
<div class="f-left8 f-font-color">{{ homeName }}</div> |
||||
|
</el-col> |
||||
|
</el-row> |
||||
|
</div> |
||||
|
<div> |
||||
|
<div class="m-table"> |
||||
|
<div class="div_btn"> |
||||
|
<el-radio-group v-model="labelPosition" size="small" @change="selectPosition"> |
||||
|
<el-radio-button label="event">12345投诉</el-radio-button> |
||||
|
<el-radio-button label="province">省满意度调查</el-radio-button> |
||||
|
<el-radio-button label="community">社区自评</el-radio-button> |
||||
|
</el-radio-group> |
||||
|
</div> |
||||
|
<el-table :visible.sync="showEvent" v-if="showEvent" :data="eventList" class="m-table-item" |
||||
|
:height="maxTableHeight"> |
||||
|
<el-table-column label="序号" fixed="left" type="index" align="center" /> |
||||
|
<el-table-column prop="gridName" align="center" min-width="140" label="所属组织" |
||||
|
:show-overflow-tooltip="true" /> |
||||
|
<el-table-column prop="categoryName" label="事件分类" min-width="100" align="center" |
||||
|
:show-overflow-tooltip="true" /> |
||||
|
<el-table-column prop="happenTime" align="center" :show-overflow-tooltip="true" label="接收时间" /> |
||||
|
<el-table-column prop="eventContent" label="问题描述" width="140" align="center" |
||||
|
:show-overflow-tooltip="true" /> |
||||
|
<el-table-column prop="timeLimit" align="center" :show-overflow-tooltip="true" label="办结时限" /> |
||||
|
<el-table-column prop="name" align="center" label="联系人" :show-overflow-tooltip="true" /> |
||||
|
<el-table-column prop="mobile" align="center" label="联系电话" :show-overflow-tooltip="true" /> |
||||
|
<el-table-column prop="address" align="center" :show-overflow-tooltip="true" label="详细地址" /> |
||||
|
</el-table> |
||||
|
<el-table :visible.sync="showProvince" v-if="showProvince" :data="provinceList" class="m-table-item" |
||||
|
:height="maxTableHeight"> |
||||
|
<el-table-column label="序号" header-align="center" align="center" type="index" /> |
||||
|
<el-table-column label="街道" prop="streetName" header-align="center" align="center" |
||||
|
show-overflow-tooltip /> |
||||
|
<el-table-column label="社区" prop="communityName" header-align="center" align="center" |
||||
|
show-overflow-tooltip /> |
||||
|
<el-table-column label="姓名" prop="name" header-align="center" align="center" /> |
||||
|
<el-table-column label="回访电话" prop="mobile" header-align="center" align="center" |
||||
|
show-overflow-tooltip /> |
||||
|
<el-table-column label="领域" prop="scopeName" header-align="center" align="center" |
||||
|
show-overflow-tooltip /> |
||||
|
<el-table-column label="问题" prop="problemDesc" header-align="center" align="center" |
||||
|
show-overflow-tooltip /> |
||||
|
<el-table-column label="是否完成" prop="completeFlag" header-align="center" align="center" |
||||
|
show-overflow-tooltip> |
||||
|
<template slot-scope="scope"> |
||||
|
{{ scope.row.completeFlag != null ? scope.row.completeFlag === 1 ? '已完成' : |
||||
|
scope.row.completeFlag |
||||
|
=== 0 ? '正在推进' : '已完成并取消风险标记' : '--' }} |
||||
|
</template> |
||||
|
</el-table-column> |
||||
|
<el-table-column label="完成时限" prop="completeTime" header-align="center" align="center" |
||||
|
show-overflow-tooltip> |
||||
|
<template slot-scope="scope"> |
||||
|
{{ scope.row.completeTime ? scope.row.completeTime.substr(0, 10) : '--' }} |
||||
|
</template> |
||||
|
</el-table-column> |
||||
|
<el-table-column label="备注" prop="remark" header-align="center" align="center" show-overflow-tooltip /> |
||||
|
</el-table> |
||||
|
<el-table :visible.sync="showCommunity" v-if="showCommunity" :data="communityList" class="m-table-item" |
||||
|
:height="maxTableHeight"> |
||||
|
<el-table-column label="序号" header-align="center" align="center" type="index" width="50" /> |
||||
|
<el-table-column label="填写时间" prop="createdTime" header-align="center" align="center" /> |
||||
|
<el-table-column label="姓名" prop="reporterName" header-align="center" align="center" /> |
||||
|
<el-table-column label="联系电话" prop="reporterMobile" :show-overflow-tooltip="true" header-align="center" |
||||
|
align="center" /> |
||||
|
<el-table-column label="回访方式" prop="followUpWay" :formatter="formatterFollowUpWay" header-align="center" |
||||
|
align="center" /> |
||||
|
<el-table-column label="文化设施" prop="evaCulturalFacility" :formatter="formatter" header-align="center" |
||||
|
align="center" /> |
||||
|
<el-table-column label="体育设施" prop="evaSportsFacility" :formatter="formatter" header-align="center" |
||||
|
align="center" /> |
||||
|
<el-table-column label="生态环境" prop="evaEcologicalEnv" :formatter="formatter" header-align="center" |
||||
|
align="center" /> |
||||
|
<el-table-column label="社会治安" prop="evaSocialSecurity" :formatter="formatter" header-align="center" |
||||
|
align="center" /> |
||||
|
<el-table-column label="社会救助" prop="evaSocialAssistance" :formatter="formatter" header-align="center" |
||||
|
align="center" /> |
||||
|
<el-table-column label="老有所养" prop="evaOldPeopleProvide" :formatter="formatter" header-align="center" |
||||
|
align="center" /> |
||||
|
<el-table-column label="基础教育" prop="evaBasicEducation" :formatter="formatter" header-align="center" |
||||
|
align="center" /> |
||||
|
<el-table-column label="病有所医" prop="evaMedical" :formatter="formatter" header-align="center" |
||||
|
align="center" /> |
||||
|
<el-table-column label="回访状态" prop="followUpStatus" :formatter="formatterFollowUpStatus" |
||||
|
header-align="center" align="center" /> |
||||
|
</el-table> |
||||
|
<div style="margin-block: 10px;display: flex;justify-content: end;"> |
||||
|
<el-pagination @size-change="handleSizeChange" @current-change="handleCurrentChange" |
||||
|
:current-page.sync="pageNo" :page-sizes="[20, 50, 100, 200]" :page-size="parseInt(pageSize)" |
||||
|
layout="sizes, prev, pager, next, total" :total="total"> |
||||
|
</el-pagination> |
||||
|
</div> |
||||
|
</div> |
||||
|
</div> |
||||
</div> |
</div> |
||||
</template> |
</template> |
||||
<script> |
<script> |
||||
|
import { requestPost, requestGet } from "@/js/dai/request"; |
||||
|
import { mapGetters } from "vuex"; |
||||
export default { |
export default { |
||||
name: "eventInspces", |
name: "eventInspces", |
||||
props: { |
props: { |
||||
resiId: { |
resiId: { |
||||
type: String, |
type: String |
||||
}, |
}, |
||||
|
orgName: { |
||||
|
type: String |
||||
|
} |
||||
}, |
}, |
||||
data() { |
data() { |
||||
return {} |
return { |
||||
|
name: '', |
||||
|
mobile: '', |
||||
|
resiDetail: {}, |
||||
|
eventList: [], |
||||
|
provinceList: [], |
||||
|
communityList: [], |
||||
|
pageNo: 0, |
||||
|
pageSize: window.localStorage.getItem("pageSize") || 20, |
||||
|
total: 1, |
||||
|
showEvent: false, |
||||
|
showProvince: false, |
||||
|
showCommunity: false, |
||||
|
labelPosition: 'event', |
||||
|
formLabelAlign: { |
||||
|
name: '', |
||||
|
region: '', |
||||
|
type: '' |
||||
|
} |
||||
|
} |
||||
}, |
}, |
||||
async created() { |
async created() { |
||||
this.loadEvent(); |
this.getResiDetail(); |
||||
|
await this.loadEvent(); |
||||
|
}, |
||||
|
computed: { |
||||
|
maxTableHeight() { |
||||
|
const h = this.clientHeight - this.searchH - 275 + this.iframeHeight; |
||||
|
const _h = this.clientHeight - 275 - this.searchH; |
||||
|
return this.$store.state.inIframe ? h : _h; |
||||
|
}, |
||||
|
...mapGetters(["clientHeight", "iframeHeight"]), |
||||
|
gridName() { |
||||
|
let arr = []; |
||||
|
if (this.resiDetail.houseInfo && this.resiDetail.houseInfo.gridName) { |
||||
|
arr = this.resiDetail.houseInfo.gridName; |
||||
|
} else { |
||||
|
arr = "--"; |
||||
|
} |
||||
|
return arr; |
||||
|
}, |
||||
|
homeName() { |
||||
|
let arr = []; |
||||
|
if (this.resiDetail.houseInfo && this.resiDetail.houseInfo.homeName) { |
||||
|
arr = this.resiDetail.houseInfo.homeName; |
||||
|
} else { |
||||
|
arr = "--"; |
||||
|
} |
||||
|
return arr; |
||||
|
}, |
||||
}, |
}, |
||||
mounted() { }, |
mounted() { }, |
||||
methods: { |
methods: { |
||||
//加载事件列表 |
//加载事件列表 |
||||
async loadEvent() { |
async loadEvent() { |
||||
|
this.eventList = [] |
||||
|
this.pageNo = 0 |
||||
const url = "/governance/eventInspect/getEventByResiId"; |
const url = "/governance/eventInspect/getEventByResiId"; |
||||
const { data, code, msg } = await requestPost(url, { |
const { data, code, msg } = await requestPost(url, { |
||||
resiId: row.resiId |
resiId: this.resiId, |
||||
|
pageNo: this.pageNo, |
||||
|
pageSize: this.pageSize |
||||
}); |
}); |
||||
if (code === 0) { |
if (code === 0) { |
||||
// this.getTableData(); |
this.total = data.total || 0; |
||||
|
this.eventList = data.list ? data.list.map((item) => { return item; }) : []; |
||||
|
this.showEvent = true; |
||||
} else { |
} else { |
||||
this.$message.error(msg); |
this.$message.error(msg); |
||||
} |
} |
||||
} |
}, |
||||
|
async getResiDetail() { |
||||
|
this.$http |
||||
|
.post(`/actual/base/residentBaseInfo/detail/${this.resiId}`) |
||||
|
.then((res) => { |
||||
|
this.resiDetail = res.data.data; |
||||
|
this.name = this.resiDetail.name; |
||||
|
this.mobile = this.resiDetail.mobile; |
||||
|
}).catch((err) => { |
||||
|
this.$message.error(err); |
||||
|
}); |
||||
|
}, |
||||
|
loadCommunity() { |
||||
|
this.communityList = [] |
||||
|
this.pageNo = 0 |
||||
|
const url = '/governance/satisfaction/communitySelfInsp/inspResult/list'; |
||||
|
this.$http.get(url + `?resiId=${this.resiId}&pageNo=${this.pageNo}&pageSize=${this.pageSize}`) |
||||
|
.then((res) => { |
||||
|
const data = res.data.data; |
||||
|
if (res.status === 200) { |
||||
|
this.total = data.total || 0; |
||||
|
this.communityList = data.list; |
||||
|
} |
||||
|
}).catch((msg) => { |
||||
|
this.$message.error(msg); |
||||
|
}); |
||||
|
}, |
||||
|
loadProvince() { |
||||
|
this.provinceList = [] |
||||
|
this.pageNo = 0 |
||||
|
const url = '/governance/provinceEvaluationRecord/pageInfo'; |
||||
|
let params = { |
||||
|
resiId: this.resiId, |
||||
|
pageNo: this.pageNo, |
||||
|
pageSize: this.pageSize |
||||
|
} |
||||
|
this.$http.post(url, params).then((res => { |
||||
|
const data = res.data.data; |
||||
|
if (res.status === 200) { |
||||
|
this.total = data.total || 0; |
||||
|
this.provinceList = data.childData; |
||||
|
} |
||||
|
})).catch((err => { |
||||
|
this.$message.error(err); |
||||
|
})); |
||||
|
}, |
||||
|
handleSizeChange(val) { |
||||
|
this.pageSize = val; |
||||
|
window.localStorage.setItem("pageSize", val); |
||||
|
this.selectPosition(); |
||||
|
}, |
||||
|
handleCurrentChange(val) { |
||||
|
this.pageNo = val; |
||||
|
this.selectPosition(); |
||||
|
}, |
||||
|
//切换标签 |
||||
|
selectPosition() { |
||||
|
if (this.labelPosition === 'event') { |
||||
|
this.showEvent = true |
||||
|
this.showProvince = false |
||||
|
this.showCommunity = false |
||||
|
this.eventList = [] |
||||
|
this.loadEvent(); |
||||
|
} else if (this.labelPosition === 'province') { |
||||
|
this.showEvent = false |
||||
|
this.showCommunity = false |
||||
|
this.showProvince = true |
||||
|
this.provinceList = [] |
||||
|
this.loadProvince(); |
||||
|
} else if (this.labelPosition === 'community') { |
||||
|
this.showEvent = false |
||||
|
this.showProvince = false |
||||
|
this.showCommunity = true |
||||
|
this.communityList = [] |
||||
|
this.loadCommunity(); |
||||
|
} |
||||
|
}, |
||||
|
formatter: function (row) { |
||||
|
let value = ''; |
||||
|
if (row.evaCulturalFacility) { |
||||
|
value = row.evaCulturalFacility |
||||
|
} else if (row.evaSportsFacility) { |
||||
|
value = row.evaSportsFacility |
||||
|
} else if (row.evaEcologicalEnv) { |
||||
|
value = row.evaEcologicalEnv |
||||
|
} else if (row.evaSocialSecurity) { |
||||
|
value = row.evaSocialSecurity |
||||
|
} else if (row.evaSocialAssistance) { |
||||
|
value = row.evaSocialAssistance |
||||
|
} else if (row.evaOldPeopleProvide) { |
||||
|
value = row.evaOldPeopleProvide |
||||
|
} else if (row.evaBasicEducation) { |
||||
|
value = row.evaBasicEducation |
||||
|
} else if (row.evaMedical) { |
||||
|
value = row.evaMedical |
||||
|
} |
||||
|
return value === 'veryGood' ? '满意' : value === 'good' ? '基本满意' : value === 'bad' ? '不满意' : ''; |
||||
|
}, |
||||
|
formatterFollowUpWay: function (row) { |
||||
|
return row.followUpWay === 1 ? '电话回访' : row.followUpWay === 2 ? '上门回访' : '未知'; |
||||
|
}, |
||||
|
formatterFollowUpStatus: function (row) { |
||||
|
return row.followUpStatus === 0 ? '接受回访' : row.followUpStatus === 1 ? '已回访' : |
||||
|
row.followUpStatus === -1 ? '不接受回访' : '未知'; |
||||
|
}, |
||||
} |
} |
||||
} |
} |
||||
</script> |
</script> |
||||
<style lang="scss" scoped> |
<style lang="scss" scoped> |
||||
@import "@/assets/scss/modules/management/list-main.scss"; |
@import "@/assets/scss/modules/management/list-main.scss"; |
||||
</style> |
|
||||
|
.f-m-top29 { |
||||
|
margin-top: 29px; |
||||
|
padding-left: 20px; |
||||
|
} |
||||
|
|
||||
|
.f-left8 { |
||||
|
margin-left: 8px; |
||||
|
} |
||||
|
|
||||
|
.f-font-color { |
||||
|
color: #000; |
||||
|
font-weight: 400; |
||||
|
}</style> |
Loading…
Reference in new issue