73 changed files with 39454 additions and 2153 deletions
File diff suppressed because it is too large
|
After Width: | Height: | Size: 234 KiB |
|
After Width: | Height: | Size: 6.1 KiB |
@ -1,25 +1,32 @@ |
|||
const state = { |
|||
chooseName: { |
|||
orgId: '', |
|||
level: '', |
|||
}, |
|||
chooseName: { |
|||
orgId: "", |
|||
level: "", |
|||
}, |
|||
realScale: null, |
|||
}; |
|||
|
|||
const mutations = { |
|||
CHOOSE_NAME: (state, name) => { |
|||
state.chooseName = name; |
|||
}, |
|||
CHOOSE_NAME: (state, name) => { |
|||
state.chooseName = name; |
|||
}, |
|||
CHOOSE_REAL_SCALE: (state, name) => { |
|||
state.realScale = name; |
|||
}, |
|||
}; |
|||
|
|||
const actions = { |
|||
chooseName({commit}, name) { |
|||
commit("CHOOSE_NAME", name); |
|||
}, |
|||
chooseName({ commit }, name) { |
|||
commit("CHOOSE_NAME", name); |
|||
}, |
|||
chooseScale({ commit }, name) { |
|||
commit("CHOOSE_REAL_SCALE", name); |
|||
}, |
|||
}; |
|||
|
|||
export default { |
|||
namespaced: true, |
|||
state, |
|||
mutations, |
|||
actions, |
|||
namespaced: true, |
|||
state, |
|||
mutations, |
|||
actions, |
|||
}; |
|||
|
|||
@ -0,0 +1,41 @@ |
|||
<template> |
|||
<div> |
|||
<div class="breadcrumb"> |
|||
<el-breadcrumb separator="/"> |
|||
<el-breadcrumb-item v-for="(item,index) in list" :to="item.path" :key="index">{{ item.name }}</el-breadcrumb-item> |
|||
</el-breadcrumb> |
|||
</div> |
|||
</div> |
|||
</template> |
|||
|
|||
<script> |
|||
export default { |
|||
name: "Breadcrumb", |
|||
props: { |
|||
list: { |
|||
type: Array, |
|||
default: () => [] |
|||
} |
|||
} |
|||
} |
|||
</script> |
|||
|
|||
<style scoped lang="scss"> |
|||
|
|||
.breadcrumb { |
|||
background: url("@/assets/images/manyidu/breadcrumb_bg.png") no-repeat left top; |
|||
height: 50px; |
|||
color: #fff; |
|||
padding-left: 20px; |
|||
display: flex; |
|||
align-items: center; |
|||
|
|||
/deep/ .el-breadcrumb__inner { |
|||
color: #fff!important; |
|||
|
|||
&.is-link { |
|||
color: #A3B9DA!important; |
|||
} |
|||
} |
|||
} |
|||
</style> |
|||
@ -0,0 +1,138 @@ |
|||
<template> |
|||
<div :class="{'hidden':hidden}" class="pagination-container"> |
|||
<el-pagination |
|||
:background="background" |
|||
:current-page.sync="currentPage" |
|||
:page-size.sync="pageSize" |
|||
:layout="layout" |
|||
:page-sizes="pageSizes" |
|||
:pager-count="pagerCount" |
|||
:total="total" |
|||
v-bind="$attrs" |
|||
@size-change="handleSizeChange" |
|||
@current-change="handleCurrentChange" |
|||
/> |
|||
</div> |
|||
</template> |
|||
|
|||
<script> |
|||
|
|||
export default { |
|||
name: 'Pagination', |
|||
props: { |
|||
total: { |
|||
required: true, |
|||
type: Number |
|||
}, |
|||
page: { |
|||
type: Number, |
|||
default: 1 |
|||
}, |
|||
limit: { |
|||
type: Number, |
|||
default: 20 |
|||
}, |
|||
pageSizes: { |
|||
type: Array, |
|||
default() { |
|||
return [10, 20, 30, 50] |
|||
} |
|||
}, |
|||
// 移动端页码按钮的数量端默认值5 |
|||
pagerCount: { |
|||
type: Number, |
|||
default: document.body.clientWidth < 992 ? 5 : 7 |
|||
}, |
|||
layout: { |
|||
type: String, |
|||
default: 'total, prev, pager, next, jumper, sizes' |
|||
}, |
|||
background: { |
|||
type: Boolean, |
|||
default: true |
|||
}, |
|||
autoScroll: { |
|||
type: Boolean, |
|||
default: true |
|||
}, |
|||
hidden: { |
|||
type: Boolean, |
|||
default: false |
|||
} |
|||
}, |
|||
data() { |
|||
return { |
|||
}; |
|||
}, |
|||
computed: { |
|||
currentPage: { |
|||
get() { |
|||
return this.page |
|||
}, |
|||
set(val) { |
|||
this.$emit('update:page', val) |
|||
} |
|||
}, |
|||
pageSize: { |
|||
get() { |
|||
return this.limit |
|||
}, |
|||
set(val) { |
|||
this.$emit('update:limit', val) |
|||
} |
|||
} |
|||
}, |
|||
methods: { |
|||
handleSizeChange(val) { |
|||
if (this.currentPage * val > this.total) { |
|||
this.currentPage = 1 |
|||
} |
|||
this.$emit('pagination', { page: this.currentPage, limit: val }) |
|||
}, |
|||
handleCurrentChange(val) { |
|||
this.$emit('pagination', { page: val, limit: this.pageSize }) |
|||
} |
|||
} |
|||
} |
|||
</script> |
|||
|
|||
<style scoped lang="scss"> |
|||
.pagination-container { |
|||
padding: 32px 16px; |
|||
display: flex; |
|||
justify-content: flex-end; |
|||
position: relative; |
|||
|
|||
/deep/ .el-pagination__total { |
|||
position: absolute; |
|||
left: 16px; |
|||
top: 32px; |
|||
color: #A3B9DA; |
|||
} |
|||
/deep/ .el-pagination__jump { |
|||
color: #A3B9DA; |
|||
} |
|||
/deep/ .el-pagination.is-background .btn-next, |
|||
/deep/ .el-pagination.is-background .btn-prev, |
|||
/deep/ .el-pagination.is-background .el-pager li { |
|||
background: rgba(0,23,66,0.3); |
|||
border: 1px solid #126AC5; |
|||
border-radius: 2px; |
|||
color: #A3B9DA; |
|||
} |
|||
/deep/ .el-input__inner { |
|||
background: rgba(0,23,66,0.3); |
|||
border: 1px solid #126AC5; |
|||
border-radius: 2px; |
|||
color: #A3B9DA; |
|||
} |
|||
/deep/ .el-pagination.is-background .el-pager li:not(.disabled).active { |
|||
background: #1A95FF; |
|||
border-radius: 2px; |
|||
color: #FFFFFF!important; |
|||
} |
|||
} |
|||
.pagination-container.hidden { |
|||
display: none; |
|||
} |
|||
</style> |
|||
@ -0,0 +1,59 @@ |
|||
<template> |
|||
<div class="tabs"> |
|||
<div class="tab" :class="value2 === item.value?'cur':''" v-for="(item,index) in list" @click="tabClick(index)" :key="index"> |
|||
{{item.label}} |
|||
</div> |
|||
</div> |
|||
</template> |
|||
|
|||
<script> |
|||
export default { |
|||
name: "Tabs", |
|||
props: { |
|||
list:{ |
|||
type: Array, |
|||
default: () => [] |
|||
}, |
|||
value:{ |
|||
type: [String,Number], |
|||
default: '' |
|||
} |
|||
}, |
|||
data() { |
|||
return { |
|||
value2: this.value, |
|||
} |
|||
}, |
|||
mounted() { |
|||
this.value2 = this.value |
|||
}, |
|||
methods: { |
|||
tabClick(index) { |
|||
this.value2 = this.list[index].value |
|||
this.$emit('changeVal',this.value) |
|||
this.$emit('changeLabel',this.list[index].label) |
|||
} |
|||
} |
|||
} |
|||
</script> |
|||
|
|||
<style scoped lang="scss"> |
|||
.tabs { |
|||
display: flex; |
|||
.tab { |
|||
cursor: pointer; |
|||
padding: 10px 11px; |
|||
font-size: 14px; |
|||
font-weight: 400; |
|||
color: #96B1CE; |
|||
min-width: 120px; |
|||
background: url("@/assets/images/manyidu/tab.png") repeat-x top left; |
|||
margin-right: 4px; |
|||
text-align: center; |
|||
&.cur { |
|||
color: #FFFFFF; |
|||
background: url("@/assets/images/manyidu/tab_cur.png") repeat-x top left; |
|||
} |
|||
} |
|||
} |
|||
</style> |
|||
@ -0,0 +1,63 @@ |
|||
<template> |
|||
<div class="title" :class="noBg?'no-bg':''"> |
|||
<span class="text"> |
|||
<span class="txt">{{ text }}</span> |
|||
<span class="text-shadow">{{ text }}</span> |
|||
</span> |
|||
<slot></slot> |
|||
</div> |
|||
</template> |
|||
|
|||
<script> |
|||
export default { |
|||
name: "Title", |
|||
props: { |
|||
text: { |
|||
type: String, |
|||
default: '' |
|||
}, |
|||
noBg: { |
|||
type: Boolean, |
|||
default: false |
|||
} |
|||
} |
|||
} |
|||
</script> |
|||
|
|||
<style scoped lang="scss"> |
|||
.title { |
|||
background: url(../../../../../assets/images/shuju/overview/title-bg.png) |
|||
no-repeat 0 0 fixed; |
|||
padding: 8px 16px 8px 32px; |
|||
display: flex; |
|||
align-items: center; |
|||
justify-content: space-between; |
|||
|
|||
.text { |
|||
position: relative; |
|||
font-size: 22px; |
|||
font-family: HYShuYuanHeiJ; |
|||
font-weight: 400; |
|||
|
|||
.txt { |
|||
color: #1f79ff; |
|||
background: linear-gradient(0deg, #2dc1ff 0%, #ffffff 58.5205078125%); |
|||
-webkit-background-clip: text; |
|||
-webkit-text-fill-color: transparent; |
|||
position: relative; |
|||
z-index: 2; |
|||
} |
|||
|
|||
.text-shadow { |
|||
top: 4px; |
|||
left: 3px; |
|||
position: absolute; |
|||
color: #020f21; |
|||
white-space: nowrap; |
|||
} |
|||
} |
|||
} |
|||
.no-bg { |
|||
background: none; |
|||
} |
|||
</style> |
|||
@ -0,0 +1,81 @@ |
|||
<template> |
|||
<div> |
|||
<el-row> |
|||
<el-col :span="10"> |
|||
<data-title title="家庭标签"> |
|||
</data-title> |
|||
<MatterDetails /> |
|||
<data-title title="家庭关系" /> |
|||
<Family @setJuminData="setJuminData" /> |
|||
</el-col> |
|||
<el-col :span="13" :offset="1"> |
|||
<data-title title="居民各项业务记录" /> |
|||
<BusinessRecords :juminArr="juminArr" /> |
|||
<data-title title="人口变化情况" /> |
|||
<EnjoyService /> |
|||
</el-col> |
|||
</el-row> |
|||
<resi-details |
|||
@close="popupShow = false" |
|||
:resi-id="resId" |
|||
v-if="popupShow" |
|||
/> |
|||
</div> |
|||
</template> |
|||
|
|||
<script> |
|||
import dataTitle from "@/views/dataBoard/renfang/visualizing/components/dataTitle.vue"; |
|||
import MatterDetails from "./modules/MatterDetails"; |
|||
import Family from "./modules/Family"; |
|||
import BusinessRecords from "./modules/BusinessRecords"; |
|||
import EnjoyService from "./modules/EnjoyService"; |
|||
import PointsRecord from "./modules/PointsRecord"; |
|||
import resiDetails from "@/views/dataBoard/cpts/resi-details"; |
|||
|
|||
export default { |
|||
name: "OrgPersonnel", |
|||
components: { |
|||
MatterDetails, |
|||
Family, |
|||
BusinessRecords, |
|||
EnjoyService, |
|||
PointsRecord, |
|||
dataTitle, |
|||
resiDetails, |
|||
}, |
|||
data() { |
|||
return { |
|||
popupShow: false, |
|||
resId: "", |
|||
juminArr: [], |
|||
}; |
|||
}, |
|||
mounted() { |
|||
const query = this.$route.query; |
|||
this.resId = query.user_id; |
|||
}, |
|||
methods: { |
|||
setJuminData(arr) { |
|||
this.juminArr = arr; |
|||
}, |
|||
}, |
|||
}; |
|||
</script> |
|||
|
|||
<style scoped lang="scss"> |
|||
.sub-title { |
|||
background: url("@/assets/images/manyidu/icon_fk.png") no-repeat left center; |
|||
font-size: 18px; |
|||
font-weight: 500; |
|||
color: #ffffff; |
|||
line-height: 22px; |
|||
padding-left: 26px; |
|||
margin-bottom: 20px; |
|||
} |
|||
.breadcrumb { |
|||
margin-bottom: 25px; |
|||
} |
|||
a:hover { |
|||
cursor: pointer; |
|||
} |
|||
</style> |
|||
@ -0,0 +1,189 @@ |
|||
<template> |
|||
<div class="business-records"> |
|||
<Tabs v-model="type" :list="typeList" @changeVal="typeChange" /> |
|||
<complaint |
|||
@changeTotal="changeTotal" |
|||
:juminArr="juminArr" |
|||
v-show="type == 1" |
|||
/> |
|||
<economize |
|||
@changeTotal="changeTotal" |
|||
:juminArr="juminArr" |
|||
v-show="type == 2" |
|||
/> |
|||
<community |
|||
@changeTotal="changeTotal" |
|||
:juminArr="juminArr" |
|||
v-show="type == 3" |
|||
/> |
|||
<reporting-events |
|||
@changeTotal="changeTotal" |
|||
:juminArr="juminArr" |
|||
v-show="type == 4" |
|||
/> |
|||
<resident |
|||
@changeTotal="changeTotal" |
|||
:juminArr="juminArr" |
|||
v-show="type == 5" |
|||
/> |
|||
<giveService |
|||
@changeTotal="changeTotal" |
|||
:juminArr="juminArr" |
|||
v-show="type == 6" |
|||
/> |
|||
</div> |
|||
</template> |
|||
|
|||
<script> |
|||
import Tabs from "@/views/dataBoard/satisfactionEval/components/Tabs/index.vue"; |
|||
import complaint from "./businessTables/complaint.vue"; |
|||
import economize from "./businessTables/economize.vue"; |
|||
import community from "./businessTables/community.vue"; |
|||
import reportingEvents from "./businessTables/reporting-events.vue"; |
|||
import resident from "./businessTables/resident.vue"; |
|||
import giveService from "./businessTables/give-service.vue"; |
|||
|
|||
export default { |
|||
name: "BusinessRecords", |
|||
props: { |
|||
juminArr: { |
|||
type: Array, |
|||
default: () => [], |
|||
}, |
|||
}, |
|||
components: { |
|||
Tabs, |
|||
complaint, |
|||
reportingEvents, |
|||
economize, |
|||
community, |
|||
resident, |
|||
giveService, |
|||
}, |
|||
data() { |
|||
return { |
|||
type: 1, |
|||
typeList: [ |
|||
{ |
|||
label: "12345投诉", |
|||
value: 1, |
|||
}, |
|||
{ |
|||
label: "省满意度调查", |
|||
value: 2, |
|||
}, |
|||
{ |
|||
label: "社区满意度自查", |
|||
value: 3, |
|||
}, |
|||
{ |
|||
label: "上报事件", |
|||
value: 4, |
|||
}, |
|||
{ |
|||
label: "居民需求", |
|||
value: 5, |
|||
}, |
|||
{ |
|||
label: "社区服务", |
|||
value: 6, |
|||
}, |
|||
], |
|||
typeLists: [ |
|||
{ |
|||
label: "12345投诉", |
|||
value: 1, |
|||
}, |
|||
{ |
|||
label: "省满意度调查", |
|||
value: 2, |
|||
}, |
|||
{ |
|||
label: "社区满意度自查", |
|||
value: 3, |
|||
}, |
|||
{ |
|||
label: "上报事件", |
|||
value: 4, |
|||
}, |
|||
{ |
|||
label: "居民需求", |
|||
value: 5, |
|||
}, |
|||
{ |
|||
label: "社区服务", |
|||
value: 6, |
|||
}, |
|||
], |
|||
}; |
|||
}, |
|||
created() {}, |
|||
methods: { |
|||
typeChange(e) { |
|||
this.type = e; |
|||
}, |
|||
changeTotal(item) { |
|||
this.typeList[item.name].label = item.total |
|||
? `${this.typeLists[item.name].label}（${item.total}）` |
|||
: this.typeLists[item.name].label; |
|||
}, |
|||
}, |
|||
}; |
|||
</script> |
|||
|
|||
<style scoped lang="scss"> |
|||
.business-records { |
|||
margin-top: 12px; |
|||
margin-bottom: 25px; |
|||
} |
|||
.table { |
|||
/deep/ .el-table td, |
|||
/deep/ .el-table th, |
|||
/deep/ .el-table tr { |
|||
padding: 14px !important; |
|||
border: none !important; |
|||
min-height: 52px; |
|||
} |
|||
/deep/ .el-table td, |
|||
/deep/ .el-table th { |
|||
background: none !important; |
|||
} |
|||
/deep/ .el-table td { |
|||
font-size: 14px; |
|||
font-weight: 400; |
|||
color: #ffffff; |
|||
text-shadow: 1px 2px 4px rgba(10, 32, 60, 0.51); |
|||
} |
|||
|
|||
/deep/ .el-table tr { |
|||
background: none; |
|||
&:hover { |
|||
background-color: rgba(26, 149, 255, 0.3) !important; |
|||
} |
|||
} |
|||
/deep/ .el-table__body-wrapper tr:nth-of-type(odd) { |
|||
background: rgba(14, 56, 115, 0.4); |
|||
} |
|||
|
|||
/deep/ .el-table { |
|||
background: none !important; |
|||
|
|||
&:before { |
|||
background: none; |
|||
} |
|||
} |
|||
/deep/ .el-table__header-wrapper tr { |
|||
color: #a3b9da !important; |
|||
font-size: 14px; |
|||
font-weight: 400; |
|||
opacity: 0.76; |
|||
background: none; |
|||
&:hover { |
|||
background: none !important; |
|||
} |
|||
} |
|||
/deep/ .el-table__header-wrapper { |
|||
background: none !important; |
|||
} |
|||
} |
|||
</style> |
|||
@ -0,0 +1,120 @@ |
|||
<template> |
|||
<div class="table"> |
|||
<el-table :data="list" max-height="390px" height="390px"> |
|||
<el-table-column label="序号" type="index" width="80" /> |
|||
<el-table-column label="变更人" prop="resiName" width="140" /> |
|||
<el-table-column label="变更类型" prop="typeName" width="" /> |
|||
<el-table-column label="变更前" prop="beforeChange" width="120" /> |
|||
<el-table-column label="变更后" prop="afterChange" width="120" /> |
|||
<el-table-column label="操作人" prop="operatorName" width="120" /> |
|||
<el-table-column label="调整时间" prop="changeTime" width="190" /> |
|||
</el-table> |
|||
</div> |
|||
</template> |
|||
|
|||
<script> |
|||
export default { |
|||
name: "community", |
|||
props: { |
|||
juminArr: { |
|||
type: Array, |
|||
default: () => [], |
|||
}, |
|||
}, |
|||
data() { |
|||
return { |
|||
houseId: "", |
|||
list: [], |
|||
total: 0, |
|||
}; |
|||
}, |
|||
created() { |
|||
const query = this.$route.query; |
|||
this.houseId = query.houseId; |
|||
this.getList(); |
|||
}, |
|||
methods: { |
|||
getList() { |
|||
// 办理状态(-2：未知，-1：不接受回访，0：接受回访/待回访，1已回访) |
|||
const completeFlags = { |
|||
"-2": "未知", |
|||
"-1": "不接受回访", |
|||
0: "接受回访/待回访", |
|||
1: "已回访", |
|||
}; |
|||
// 省满意度列表 |
|||
this.$http |
|||
.get( |
|||
"/actual/base/peopleRoomOverview/houseResidentChangeRecord?houseId=" + |
|||
this.houseId |
|||
) |
|||
.then(({ data: res }) => { |
|||
console.log('res::',res); |
|||
this.list = res.data.map((item) => { |
|||
return { |
|||
...item, |
|||
completeFlag: completeFlags[item.completeFlag], |
|||
}; |
|||
}); |
|||
this.total = res.data.length; |
|||
}); |
|||
}, |
|||
}, |
|||
}; |
|||
</script> |
|||
|
|||
<style scoped lang="scss"> |
|||
.business-records { |
|||
margin-bottom: 25px; |
|||
} |
|||
.table { |
|||
/deep/ .el-table td, |
|||
/deep/ .el-table th, |
|||
/deep/ .el-table tr { |
|||
padding: 14px !important; |
|||
border: none !important; |
|||
min-height: 52px; |
|||
} |
|||
/deep/ .el-table td, |
|||
/deep/ .el-table th { |
|||
background: none !important; |
|||
} |
|||
/deep/ .el-table td { |
|||
font-size: 14px; |
|||
font-weight: 400; |
|||
color: #ffffff; |
|||
text-shadow: 1px 2px 4px rgba(10, 32, 60, 0.51); |
|||
} |
|||
|
|||
/deep/ .el-table tr { |
|||
background: none; |
|||
&:hover { |
|||
background-color: rgba(26, 149, 255, 0.3) !important; |
|||
} |
|||
} |
|||
/deep/ .el-table__body-wrapper tr:nth-of-type(odd) { |
|||
background: rgba(14, 56, 115, 0.4); |
|||
} |
|||
|
|||
/deep/ .el-table { |
|||
background: none !important; |
|||
|
|||
&:before { |
|||
background: none; |
|||
} |
|||
} |
|||
/deep/ .el-table__header-wrapper tr { |
|||
color: #a3b9da !important; |
|||
font-size: 14px; |
|||
font-weight: 400; |
|||
opacity: 0.76; |
|||
background: none; |
|||
&:hover { |
|||
background: none !important; |
|||
} |
|||
} |
|||
/deep/ .el-table__header-wrapper { |
|||
background: none !important; |
|||
} |
|||
} |
|||
</style> |
|||
@ -0,0 +1,161 @@ |
|||
<template> |
|||
<div class="family"> |
|||
<div class="tag" v-for="item in data" :key="item.id"> |
|||
<div> |
|||
{{ item.name }} |
|||
<span v-if="item.houseHolderRel" |
|||
>({{ item.houseHolderRel == "本人" ? "户主" : item.houseHolderRel }}) |
|||
</span> |
|||
</div> |
|||
<div v-if="item.householdSituation"> |
|||
入户状态：{{ item.householdSituation }} |
|||
</div> |
|||
<div>居民分类：{{ getType(item.classificationOfInhabitantsList) }}</div> |
|||
</div> |
|||
<div style="padding-top: 220px; margin-left: 148px"> |
|||
<div class="user-name">{{ hzData.name }}</div> |
|||
<div class="user-gx">（户主）</div> |
|||
</div> |
|||
</div> |
|||
</template> |
|||
|
|||
<script> |
|||
export default { |
|||
name: "Family", |
|||
data() { |
|||
return { |
|||
data: [], |
|||
queryParam: { |
|||
type: "1", |
|||
}, |
|||
info: {}, |
|||
}; |
|||
}, |
|||
computed: { |
|||
getType() { |
|||
return (arr) => { |
|||
if (arr.length > 0) { |
|||
let txt = ""; |
|||
arr.forEach((item, index) => { |
|||
if (arr.length == index + 1) { |
|||
txt = txt + item; |
|||
} else { |
|||
txt = txt + item + ","; |
|||
} |
|||
}); |
|||
return txt; |
|||
} else { |
|||
return "暂无"; |
|||
} |
|||
}; |
|||
}, |
|||
}, |
|||
created() { |
|||
const query = this.$route.query; |
|||
this.queryParam.resid = query.houseId; |
|||
this.getDatas(); |
|||
}, |
|||
methods: { |
|||
getDatas() { |
|||
this.$http |
|||
.post( |
|||
"/actual/base/peopleRoomOverview/getFamilyRelationshipList?type=1&resid=" + |
|||
this.queryParam.resid |
|||
) |
|||
.then(({ data: res }) => { |
|||
const data = res.data; |
|||
this.data = data; |
|||
this.hzData = data.filter((item) => item.houseHolderRel == "本人")[0]; |
|||
this.$emit("setJuminData", data); |
|||
}); |
|||
}, |
|||
// getUserInfo() { |
|||
// this.$http |
|||
// .post( |
|||
// "/actual/base/peopleRoomOverview/getPersonalFile?resid=" + |
|||
// this.queryParam.resid, |
|||
// this.queryParam |
|||
// ) |
|||
// .then(({ data: res }) => { |
|||
// this.info = res.data; |
|||
// }); |
|||
// }, |
|||
}, |
|||
}; |
|||
</script> |
|||
|
|||
<style scoped lang="scss"> |
|||
.family { |
|||
width: 464px; |
|||
height: 340px; |
|||
background: url("@/assets/images/manyidu/gx_bg.png") no-repeat center; |
|||
position: relative; |
|||
margin: 40px auto; |
|||
} |
|||
.tag { |
|||
font-size: 14px; |
|||
font-weight: 400; |
|||
color: #ffffff; |
|||
line-height: 22px; |
|||
padding: 18px 24px; |
|||
box-sizing: border-box; |
|||
position: absolute; |
|||
background: url("@/assets/images/manyidu/gx_big.png") no-repeat center; |
|||
background-size: 100% 100%; |
|||
width: 180px; |
|||
min-height: 80px; |
|||
&:nth-of-type(1) { |
|||
left: -24px; |
|||
top: -24px; |
|||
} |
|||
&:nth-of-type(2) { |
|||
right: -24px; |
|||
top: -24px; |
|||
} |
|||
&:nth-of-type(3) { |
|||
left: -24px; |
|||
bottom: -20px; |
|||
} |
|||
&:nth-of-type(4) { |
|||
right: -24px; |
|||
top: 274px; |
|||
} |
|||
&:nth-of-type(5) { |
|||
left: -94px; |
|||
top: 74px; |
|||
} |
|||
&:nth-of-type(6) { |
|||
right: -94px; |
|||
top: 74px; |
|||
} |
|||
&:nth-of-type(7) { |
|||
left: -124px; |
|||
top: 174px; |
|||
} |
|||
&:nth-of-type(8) { |
|||
right: -124px; |
|||
top: 174px; |
|||
} |
|||
} |
|||
.user-name { |
|||
width: 174px; |
|||
text-align: center; |
|||
height: 17px; |
|||
font-size: 18px; |
|||
font-family: PingFang SC; |
|||
font-weight: bold; |
|||
color: #ffffff; |
|||
line-height: 22px; |
|||
margin-top: -12px; |
|||
} |
|||
.user-gx { |
|||
width: 174px; |
|||
text-align: center; |
|||
height: 17px; |
|||
font-size: 16px; |
|||
font-family: PingFang SC; |
|||
font-weight: bold; |
|||
color: #ffffff; |
|||
line-height: 32px; |
|||
} |
|||
</style> |
|||
@ -0,0 +1,148 @@ |
|||
<template> |
|||
<div class="matter-details"> |
|||
<div class="user-img"> |
|||
<!-- <img src="@/assets/images/manyidu/dn_bg1.png" alt="" /> --> |
|||
<div class="user-name">{{ data.name }}</div> |
|||
</div> |
|||
<div class="tags"> |
|||
<div |
|||
:class="`tag ${index % 2 == 0 ? 'small' : ''} ${ |
|||
item.red == '0' ? '' : 'red' |
|||
}`" |
|||
v-for="(item, index) in data" |
|||
:key="item.tagName" |
|||
> |
|||
{{ item.tagName }} |
|||
</div> |
|||
</div> |
|||
<div class="jtxxdz">四季景园1号楼1单元101</div> |
|||
</div> |
|||
</template> |
|||
|
|||
<script> |
|||
export default { |
|||
name: "MatterDetails", |
|||
data() { |
|||
return { |
|||
data: [], |
|||
queryParams: {}, |
|||
genderArr: ["未知", "男", "女"], |
|||
}; |
|||
}, |
|||
|
|||
created() { |
|||
const query = this.$route.query; |
|||
this.queryParams.houseId = query.houseId; |
|||
this.getDatas(); |
|||
}, |
|||
methods: { |
|||
getDatas() { |
|||
this.$http |
|||
.get( |
|||
"/actual/base/peopleRoomOverview/getHouseTag?houseId=" + |
|||
this.queryParams.houseId |
|||
) |
|||
.then(({ data: res }) => { |
|||
this.data = res.data; |
|||
}); |
|||
}, |
|||
}, |
|||
}; |
|||
</script> |
|||
|
|||
<style scoped lang="scss"> |
|||
.jtxxdz { |
|||
width: 100%; |
|||
text-align: center; |
|||
height: 14px; |
|||
font-size: 14px; |
|||
font-family: PingFang SC; |
|||
font-weight: 400; |
|||
color: #ffffff !important; |
|||
line-height: 32px; |
|||
position: absolute; |
|||
top:370px; |
|||
left: 0; |
|||
} |
|||
.matter-details { |
|||
width: 607px; |
|||
height: 372px; |
|||
background: url("@/assets/images/manyidu/dn_bg3.png") no-repeat center bottom; |
|||
background-size: 454px 230px; |
|||
position: relative; |
|||
margin: 12px auto 60px; |
|||
} |
|||
.user-img { |
|||
position: absolute; |
|||
left: calc(50% - 87px); |
|||
top: calc(50% - 37px); |
|||
} |
|||
.tag { |
|||
position: absolute; |
|||
background: url("@/assets/images/manyidu/dn_big.png") center no-repeat; |
|||
width: 108px; |
|||
height: 107px; |
|||
display: flex; |
|||
align-items: center; |
|||
justify-content: center; |
|||
font-size: 14px; |
|||
font-weight: 400; |
|||
color: #ffffff; |
|||
line-height: 16px; |
|||
box-sizing: border-box; |
|||
padding: 24px; |
|||
text-align: center; |
|||
word-break: break-all; |
|||
&.small { |
|||
width: 89px; |
|||
height: 89px; |
|||
background: url("@/assets/images/manyidu/dn_small.png") center no-repeat; |
|||
padding: 16px; |
|||
} |
|||
&.red { |
|||
background: url("@/assets/images/manyidu/dn_red.png") center no-repeat; |
|||
color: #fe0000; |
|||
} |
|||
&:nth-of-type(1) { |
|||
left: 0; |
|||
bottom: 15px; |
|||
} |
|||
|
|||
&:nth-of-type(2) { |
|||
left: 42px; |
|||
bottom: 185px; |
|||
} |
|||
|
|||
&:nth-of-type(3) { |
|||
left: 194px; |
|||
bottom: 245px; |
|||
} |
|||
|
|||
&:nth-of-type(4) { |
|||
left: 384px; |
|||
bottom: 240px; |
|||
} |
|||
|
|||
&:nth-of-type(5) { |
|||
left: 499px; |
|||
bottom: 157px; |
|||
} |
|||
|
|||
&:nth-of-type(6) { |
|||
left: 453px; |
|||
bottom: 10px; |
|||
} |
|||
} |
|||
|
|||
.user-name { |
|||
width: 174px; |
|||
text-align: center; |
|||
height: 17px; |
|||
font-size: 18px; |
|||
font-family: PingFang SC; |
|||
font-weight: bold; |
|||
color: #ffffff; |
|||
line-height: 22px; |
|||
margin-top: -12px; |
|||
} |
|||
</style> |
|||
@ -0,0 +1,67 @@ |
|||
<template> |
|||
<div> |
|||
<div class="enjoy-service"> |
|||
<div class="enjoy-service-item" v-for="(item, index) in data"> |
|||
<div class="num">+{{ item.classificationNum }}</div> |
|||
<div class="info"> |
|||
<div class="title">{{ item.classification }}</div> |
|||
<div class="time">{{ item.recordTime }}</div> |
|||
</div> |
|||
</div> |
|||
</div> |
|||
</div> |
|||
</template> |
|||
|
|||
<script> |
|||
export default { |
|||
name: "PointsRecord", |
|||
data() { |
|||
return { |
|||
data:[], |
|||
}; |
|||
}, |
|||
created() { |
|||
this.getData(); |
|||
}, |
|||
methods: { |
|||
getData() { |
|||
this.$http |
|||
.get("/actual/base/peopleRoomOverview/recorHistory") |
|||
.then(({ data: res }) => { |
|||
this.data = res.data; |
|||
}); |
|||
}, |
|||
}, |
|||
}; |
|||
</script> |
|||
|
|||
<style scoped lang="scss"> |
|||
.enjoy-service { |
|||
padding-left: 26px; |
|||
margin-top: 12px; |
|||
} |
|||
.enjoy-service-item { |
|||
color: #ffffff; |
|||
display: flex; |
|||
padding: 14px 16px 14px; |
|||
margin-bottom: 8px; |
|||
background: #07266b; |
|||
.num { |
|||
font-size: 24px; |
|||
font-weight: 500; |
|||
line-height: 22px; |
|||
} |
|||
.info { |
|||
font-size: 14px; |
|||
margin-left: 40px; |
|||
.title { |
|||
font-weight: 500; |
|||
margin-bottom: 10px; |
|||
} |
|||
.time { |
|||
font-weight: 400; |
|||
color: #a3b9da; |
|||
} |
|||
} |
|||
} |
|||
</style> |
|||
@ -0,0 +1,130 @@ |
|||
<template> |
|||
<div class="table"> |
|||
<el-table :data="list" max-height="363px" height="363px"> |
|||
<el-table-column label="序号" type="index" width="80" /> |
|||
<el-table-column label="不满意事项类型" prop="scope" width="190" /> |
|||
<el-table-column label="不满意事项描述" prop="problemDesc" width="" /> |
|||
<el-table-column label="办理状态" prop="completeFlag" width="120" /> |
|||
<el-table-column label="是否回访" prop="isReturn" width="120" /> |
|||
<el-table-column label="操作" width="90" align="center"> |
|||
<template slot-scope="data"> |
|||
<el-button type="text" @click="handleView">查看</el-button> |
|||
</template> |
|||
</el-table-column> |
|||
</el-table> |
|||
</div> |
|||
</template> |
|||
|
|||
<script> |
|||
export default { |
|||
name: "community", |
|||
props: { |
|||
juminArr: { |
|||
type: Array, |
|||
default: () => [], |
|||
}, |
|||
}, |
|||
data() { |
|||
return { |
|||
queryParams: { |
|||
residList: [], |
|||
}, |
|||
list: [], |
|||
total: 0, |
|||
}; |
|||
}, |
|||
watch: { |
|||
juminArr(newVal, oldVal) { |
|||
if (newVal.length > 0) { |
|||
this.queryParams.residList = newVal.map((item) => { |
|||
return item.id; |
|||
}); |
|||
this.getList(); |
|||
} |
|||
}, |
|||
}, |
|||
methods: { |
|||
getList() { |
|||
// 办理状态(-2：未知，-1：不接受回访，0：接受回访/待回访，1已回访) |
|||
const completeFlags = { |
|||
"-2": "未知", |
|||
"-1": "不接受回访", |
|||
0: "接受回访/待回访", |
|||
1: "已回访", |
|||
}; |
|||
// 省满意度列表 |
|||
this.$http |
|||
.post( |
|||
"/actual/base/peopleRoomOverview/communitySatisfactionPageList", |
|||
this.queryParams |
|||
) |
|||
.then(({ data: res }) => { |
|||
this.list = res.data.map((item) => { |
|||
return { |
|||
...item, |
|||
completeFlag: completeFlags[item.completeFlag], |
|||
}; |
|||
}); |
|||
this.total = res.data.length; |
|||
this.$emit("changeTotal", { name: 2, total: this.total }); |
|||
}); |
|||
}, |
|||
}, |
|||
}; |
|||
</script> |
|||
|
|||
<style scoped lang="scss"> |
|||
.business-records { |
|||
margin-bottom: 25px; |
|||
} |
|||
.table { |
|||
/deep/ .el-table td, |
|||
/deep/ .el-table th, |
|||
/deep/ .el-table tr { |
|||
padding: 14px !important; |
|||
border: none !important; |
|||
min-height: 52px; |
|||
} |
|||
/deep/ .el-table td, |
|||
/deep/ .el-table th { |
|||
background: none !important; |
|||
} |
|||
/deep/ .el-table td { |
|||
font-size: 14px; |
|||
font-weight: 400; |
|||
color: #ffffff; |
|||
text-shadow: 1px 2px 4px rgba(10, 32, 60, 0.51); |
|||
} |
|||
|
|||
/deep/ .el-table tr { |
|||
background: none; |
|||
&:hover { |
|||
background-color: rgba(26, 149, 255, 0.3) !important; |
|||
} |
|||
} |
|||
/deep/ .el-table__body-wrapper tr:nth-of-type(odd) { |
|||
background: rgba(14, 56, 115, 0.4); |
|||
} |
|||
|
|||
/deep/ .el-table { |
|||
background: none !important; |
|||
|
|||
&:before { |
|||
background: none; |
|||
} |
|||
} |
|||
/deep/ .el-table__header-wrapper tr { |
|||
color: #a3b9da !important; |
|||
font-size: 14px; |
|||
font-weight: 400; |
|||
opacity: 0.76; |
|||
background: none; |
|||
&:hover { |
|||
background: none !important; |
|||
} |
|||
} |
|||
/deep/ .el-table__header-wrapper { |
|||
background: none !important; |
|||
} |
|||
} |
|||
</style> |
|||
@ -0,0 +1,137 @@ |
|||
<template> |
|||
<div class="table"> |
|||
<el-table :data="list" max-height="363px" height="363px"> |
|||
<el-table-column label="序号" type="index" width="80" /> |
|||
<el-table-column label="事件类型" prop="categorycode" width="" /> |
|||
<el-table-column label="事件描述" prop="eventcontent" width="" /> |
|||
<el-table-column label="办理状态" prop="status" width="" /> |
|||
<el-table-column label="接收时间" prop="happentime" width="180" /> |
|||
<el-table-column label="标记" prop="marktype" width="" /> |
|||
<el-table-column label="操作" width="90" align="center"> |
|||
<template slot-scope="data"> |
|||
<el-button type="text" @click="handleView">查看</el-button> |
|||
</template> |
|||
</el-table-column> |
|||
</el-table> |
|||
<Pagination |
|||
v-show="total > 0" |
|||
:total="total" |
|||
:page.sync="queryParams.pageNo" |
|||
:limit.sync="queryParams.pageSize" |
|||
@pagination="getList" |
|||
/> |
|||
</div> |
|||
</template> |
|||
|
|||
<script> |
|||
export default { |
|||
name: "complaint", |
|||
props: { |
|||
juminArr: { |
|||
type: Array, |
|||
default: () => [], |
|||
}, |
|||
}, |
|||
data() { |
|||
return { |
|||
queryParams: { |
|||
pageNo: 1, |
|||
pageSize: 10, |
|||
eventType: "3", |
|||
residList: [], |
|||
}, |
|||
list: [], |
|||
total: 0, |
|||
}; |
|||
}, |
|||
watch: { |
|||
juminArr(newVal, oldVal) { |
|||
if (newVal.length > 0) { |
|||
this.queryParams.residList = newVal.map((item) => { |
|||
return item.id; |
|||
}); |
|||
this.getList(); |
|||
} |
|||
}, |
|||
}, |
|||
methods: { |
|||
getList() { |
|||
// 事件分页查询 |
|||
const statusArr = { |
|||
processing: "处理中", |
|||
closed_case: "已办结", |
|||
}; |
|||
const marktypes = ["普通事件", "难点读点", "矛盾纠纷", "自身问题"]; |
|||
this.$http |
|||
.post("/actual/base/peopleRoomOverview/eventPageList", this.queryParams) |
|||
.then(({ data: res }) => { |
|||
this.list = res.data.list.map((item) => { |
|||
return { |
|||
...item, |
|||
status: item.status?statusArr[item.status]:null, |
|||
marktype: marktypes[item.marktype], |
|||
}; |
|||
}); |
|||
this.total = res.data.total; |
|||
this.$emit("changeTotal", { name: 0, total: this.total }); |
|||
}); |
|||
}, |
|||
}, |
|||
}; |
|||
</script> |
|||
|
|||
<style scoped lang="scss"> |
|||
.business-records { |
|||
margin-bottom: 25px; |
|||
} |
|||
.table { |
|||
/deep/ .el-table td, |
|||
/deep/ .el-table th, |
|||
/deep/ .el-table tr { |
|||
padding: 14px !important; |
|||
border: none !important; |
|||
min-height: 52px; |
|||
} |
|||
/deep/ .el-table td, |
|||
/deep/ .el-table th { |
|||
background: none !important; |
|||
} |
|||
/deep/ .el-table td { |
|||
font-size: 14px; |
|||
font-weight: 400; |
|||
color: #ffffff; |
|||
text-shadow: 1px 2px 4px rgba(10, 32, 60, 0.51); |
|||
} |
|||
|
|||
/deep/ .el-table tr { |
|||
background: none; |
|||
&:hover { |
|||
background-color: rgba(26, 149, 255, 0.3) !important; |
|||
} |
|||
} |
|||
/deep/ .el-table__body-wrapper tr:nth-of-type(odd) { |
|||
background: rgba(14, 56, 115, 0.4); |
|||
} |
|||
|
|||
/deep/ .el-table { |
|||
background: none !important; |
|||
|
|||
&:before { |
|||
background: none; |
|||
} |
|||
} |
|||
/deep/ .el-table__header-wrapper tr { |
|||
color: #a3b9da !important; |
|||
font-size: 14px; |
|||
font-weight: 400; |
|||
opacity: 0.76; |
|||
background: none; |
|||
&:hover { |
|||
background: none !important; |
|||
} |
|||
} |
|||
/deep/ .el-table__header-wrapper { |
|||
background: none !important; |
|||
} |
|||
} |
|||
</style> |
|||
@ -0,0 +1,115 @@ |
|||
<template> |
|||
<div class="table"> |
|||
<el-table :data="list" max-height="363px" height="363px"> |
|||
<el-table-column label="序号" type="index" width="80" /> |
|||
<el-table-column label="不满意事项类型" prop="scope" width="190" /> |
|||
<el-table-column label="不满意事项描述" prop="problemDesc" width="" /> |
|||
<el-table-column label="办理状态" prop="completeFlag" width="120" /> |
|||
<el-table-column label="是否回访" prop="isReturn" width="120" /> |
|||
<el-table-column label="操作" width="90" align="center"> |
|||
<template slot-scope="data"> |
|||
<el-button type="text" @click="handleView">查看</el-button> |
|||
</template> |
|||
</el-table-column> |
|||
</el-table> |
|||
</div> |
|||
</template> |
|||
|
|||
<script> |
|||
export default { |
|||
name: "economize", |
|||
props: { |
|||
juminArr: { |
|||
type: Array, |
|||
default: () => [], |
|||
}, |
|||
}, |
|||
data() { |
|||
return { |
|||
queryParams: { |
|||
residList: [], |
|||
}, |
|||
list: [], |
|||
total: 0, |
|||
}; |
|||
}, |
|||
watch: { |
|||
juminArr(newVal, oldVal) { |
|||
if (newVal.length > 0) { |
|||
this.queryParams.residList = newVal.map((item) => { |
|||
return item.id; |
|||
}); |
|||
this.getList(); |
|||
} |
|||
}, |
|||
}, |
|||
methods: { |
|||
getList() { |
|||
// 省满意度列表 |
|||
this.$http |
|||
.post("/actual/base/peopleRoomOverview/provincialSatisfactionPageList", this.queryParams) |
|||
.then(({ data: res }) => { |
|||
this.list = res.data; |
|||
this.total = res.data.length; |
|||
this.$emit("changeTotal", { name: 1, total: this.total }); |
|||
}); |
|||
}, |
|||
}, |
|||
}; |
|||
</script> |
|||
|
|||
<style scoped lang="scss"> |
|||
.business-records { |
|||
margin-bottom: 25px; |
|||
} |
|||
.table { |
|||
/deep/ .el-table td, |
|||
/deep/ .el-table th, |
|||
/deep/ .el-table tr { |
|||
padding: 14px !important; |
|||
border: none !important; |
|||
min-height: 52px; |
|||
} |
|||
/deep/ .el-table td, |
|||
/deep/ .el-table th { |
|||
background: none !important; |
|||
} |
|||
/deep/ .el-table td { |
|||
font-size: 14px; |
|||
font-weight: 400; |
|||
color: #ffffff; |
|||
text-shadow: 1px 2px 4px rgba(10, 32, 60, 0.51); |
|||
} |
|||
|
|||
/deep/ .el-table tr { |
|||
background: none; |
|||
&:hover { |
|||
background-color: rgba(26, 149, 255, 0.3) !important; |
|||
} |
|||
} |
|||
/deep/ .el-table__body-wrapper tr:nth-of-type(odd) { |
|||
background: rgba(14, 56, 115, 0.4); |
|||
} |
|||
|
|||
/deep/ .el-table { |
|||
background: none !important; |
|||
|
|||
&:before { |
|||
background: none; |
|||
} |
|||
} |
|||
/deep/ .el-table__header-wrapper tr { |
|||
color: #a3b9da !important; |
|||
font-size: 14px; |
|||
font-weight: 400; |
|||
opacity: 0.76; |
|||
background: none; |
|||
&:hover { |
|||
background: none !important; |
|||
} |
|||
} |
|||
/deep/ .el-table__header-wrapper { |
|||
background: none !important; |
|||
} |
|||
} |
|||
</style> |
|||
@ -0,0 +1,119 @@ |
|||
<template> |
|||
<div class="table"> |
|||
<el-table :data="list" max-height="363px" height="363px"> |
|||
<el-table-column label="序号" type="index" width="80" /> |
|||
<el-table-column label="需求类型" prop="serviceCategoryKey" width="" /> |
|||
<el-table-column label="事件描述" prop="serviceName" width="" /> |
|||
<el-table-column label="服务情况" prop="state" width="" /> |
|||
<el-table-column label="创建时间" prop="serviceTimeStart" width="180" /> |
|||
<el-table-column label="操作" width="90" align="center"> |
|||
<template slot-scope="data"> |
|||
<el-button type="text" @click="handleView">查看</el-button> |
|||
</template> |
|||
</el-table-column> |
|||
</el-table> |
|||
</div> |
|||
</template> |
|||
|
|||
<script> |
|||
export default { |
|||
name: "give-service", |
|||
props: { |
|||
juminArr: { |
|||
type: Array, |
|||
default: () => [], |
|||
}, |
|||
}, |
|||
data() { |
|||
return { |
|||
queryParams: { |
|||
residList: [], |
|||
}, |
|||
list: [], |
|||
total: 0, |
|||
}; |
|||
}, |
|||
watch: { |
|||
juminArr(newVal, oldVal) { |
|||
if (newVal.length > 0) { |
|||
this.queryParams.residList = newVal.map((item) => { |
|||
return item.id; |
|||
}); |
|||
this.getList(); |
|||
} |
|||
}, |
|||
}, |
|||
methods: { |
|||
getList() { |
|||
// 社区服务列表 |
|||
this.$http |
|||
.post("/actual/base/peopleRoomOverview/communityServicePageList", this.queryParams) |
|||
.then(({ data: res }) => { |
|||
this.list = res.data.map((item) => { |
|||
return { |
|||
...item, |
|||
}; |
|||
}); |
|||
this.total = res.data.length; |
|||
this.$emit("changeTotal", { name: 5, total: this.total }); |
|||
}); |
|||
}, |
|||
}, |
|||
}; |
|||
</script> |
|||
|
|||
<style scoped lang="scss"> |
|||
.business-records { |
|||
margin-bottom: 25px; |
|||
} |
|||
.table { |
|||
/deep/ .el-table td, |
|||
/deep/ .el-table th, |
|||
/deep/ .el-table tr { |
|||
padding: 14px !important; |
|||
border: none !important; |
|||
min-height: 52px; |
|||
} |
|||
/deep/ .el-table td, |
|||
/deep/ .el-table th { |
|||
background: none !important; |
|||
} |
|||
/deep/ .el-table td { |
|||
font-size: 14px; |
|||
font-weight: 400; |
|||
color: #ffffff; |
|||
text-shadow: 1px 2px 4px rgba(10, 32, 60, 0.51); |
|||
} |
|||
|
|||
/deep/ .el-table tr { |
|||
background: none; |
|||
&:hover { |
|||
background-color: rgba(26, 149, 255, 0.3) !important; |
|||
} |
|||
} |
|||
/deep/ .el-table__body-wrapper tr:nth-of-type(odd) { |
|||
background: rgba(14, 56, 115, 0.4); |
|||
} |
|||
|
|||
/deep/ .el-table { |
|||
background: none !important; |
|||
|
|||
&:before { |
|||
background: none; |
|||
} |
|||
} |
|||
/deep/ .el-table__header-wrapper tr { |
|||
color: #a3b9da !important; |
|||
font-size: 14px; |
|||
font-weight: 400; |
|||
opacity: 0.76; |
|||
background: none; |
|||
&:hover { |
|||
background: none !important; |
|||
} |
|||
} |
|||
/deep/ .el-table__header-wrapper { |
|||
background: none !important; |
|||
} |
|||
} |
|||
</style> |
|||
@ -0,0 +1,135 @@ |
|||
<template> |
|||
<div class="table"> |
|||
<el-table :data="list" max-height="363px" height="363px"> |
|||
<el-table-column label="序号" type="index" width="80" /> |
|||
<el-table-column label="事件类型" prop="categorycode" width="" /> |
|||
<el-table-column label="事件描述" prop="eventcontent" width="" /> |
|||
<el-table-column label="办理状态" prop="status" width="" /> |
|||
<el-table-column label="接收时间" prop="happentime" width="180" /> |
|||
<el-table-column label="操作" width="90" align="center"> |
|||
<template slot-scope="data"> |
|||
<el-button type="text" @click="handleView">查看</el-button> |
|||
</template> |
|||
</el-table-column> |
|||
</el-table> |
|||
<Pagination |
|||
v-show="total > 0" |
|||
:total="total" |
|||
:page.sync="queryParams.pageNo" |
|||
:limit.sync="queryParams.pageSize" |
|||
@pagination="getList" |
|||
/> |
|||
</div> |
|||
</template> |
|||
|
|||
<script> |
|||
export default { |
|||
name: "reporting-events", |
|||
props: { |
|||
juminArr: { |
|||
type: Array, |
|||
default: () => [], |
|||
}, |
|||
}, |
|||
data() { |
|||
return { |
|||
queryParams: { |
|||
pageNo: 1, |
|||
pageSize: 10, |
|||
residList: [], |
|||
}, |
|||
list: [], |
|||
total: 0, |
|||
}; |
|||
}, |
|||
watch: { |
|||
juminArr(newVal, oldVal) { |
|||
if (newVal.length > 0) { |
|||
this.queryParams.residList = newVal.map((item) => { |
|||
return item.id; |
|||
}); |
|||
this.getList(); |
|||
} |
|||
}, |
|||
}, |
|||
methods: { |
|||
getList() { |
|||
// 事件分页查询 |
|||
const statusArr = { |
|||
processing: "处理中", |
|||
closed_case: "已办结", |
|||
}; |
|||
const marktypes = ["普通事件", "难点读点", "矛盾纠纷", "自身问题"]; |
|||
this.$http |
|||
.post("/actual/base/peopleRoomOverview/eventPageList", this.queryParams) |
|||
.then(({ data: res }) => { |
|||
this.list = res.data.list.map((item) => { |
|||
return { |
|||
...item, |
|||
status: item.status?statusArr[item.status]:null, |
|||
marktype: marktypes[item.marktype], |
|||
}; |
|||
}); |
|||
this.total = res.data.total; |
|||
this.$emit("changeTotal", { name: 3, total: this.total }); |
|||
}); |
|||
}, |
|||
}, |
|||
}; |
|||
</script> |
|||
|
|||
<style scoped lang="scss"> |
|||
.business-records { |
|||
margin-bottom: 25px; |
|||
} |
|||
.table { |
|||
/deep/ .el-table td, |
|||
/deep/ .el-table th, |
|||
/deep/ .el-table tr { |
|||
padding: 14px !important; |
|||
border: none !important; |
|||
min-height: 52px; |
|||
} |
|||
/deep/ .el-table td, |
|||
/deep/ .el-table th { |
|||
background: none !important; |
|||
} |
|||
/deep/ .el-table td { |
|||
font-size: 14px; |
|||
font-weight: 400; |
|||
color: #ffffff; |
|||
text-shadow: 1px 2px 4px rgba(10, 32, 60, 0.51); |
|||
} |
|||
|
|||
/deep/ .el-table tr { |
|||
background: none; |
|||
&:hover { |
|||
background-color: rgba(26, 149, 255, 0.3) !important; |
|||
} |
|||
} |
|||
/deep/ .el-table__body-wrapper tr:nth-of-type(odd) { |
|||
background: rgba(14, 56, 115, 0.4); |
|||
} |
|||
|
|||
/deep/ .el-table { |
|||
background: none !important; |
|||
|
|||
&:before { |
|||
background: none; |
|||
} |
|||
} |
|||
/deep/ .el-table__header-wrapper tr { |
|||
color: #a3b9da !important; |
|||
font-size: 14px; |
|||
font-weight: 400; |
|||
opacity: 0.76; |
|||
background: none; |
|||
&:hover { |
|||
background: none !important; |
|||
} |
|||
} |
|||
/deep/ .el-table__header-wrapper { |
|||
background: none !important; |
|||
} |
|||
} |
|||
</style> |
|||
@ -0,0 +1,122 @@ |
|||
<template> |
|||
<div class="table"> |
|||
<el-table :data="list" max-height="363px" height="363px"> |
|||
<el-table-column label="序号" type="index" width="80" /> |
|||
<el-table-column label="需求类型" prop="categoryName" width="" /> |
|||
<el-table-column label="需求描述" prop="content" width="" /> |
|||
<el-table-column label="办理情况" prop="status" width="" /> |
|||
<el-table-column label="上报时间" prop="reportTime" width="180" /> |
|||
<el-table-column label="操作" width="90" align="center"> |
|||
<template slot-scope="data"> |
|||
<el-button type="text" @click="handleView">查看</el-button> |
|||
</template> |
|||
</el-table-column> |
|||
</el-table> |
|||
</div> |
|||
</template> |
|||
|
|||
<script> |
|||
export default { |
|||
name: "complaint", |
|||
props: { |
|||
juminArr: { |
|||
type: Array, |
|||
default: () => [], |
|||
}, |
|||
}, |
|||
data() { |
|||
return { |
|||
queryParams: { |
|||
residList: [], |
|||
}, |
|||
list: [], |
|||
total: 0, |
|||
}; |
|||
}, |
|||
watch: { |
|||
juminArr(newVal, oldVal) { |
|||
if (newVal.length > 0) { |
|||
this.queryParams.residList = newVal.map((item) => { |
|||
return item.id; |
|||
}); |
|||
this.getList(); |
|||
} |
|||
}, |
|||
}, |
|||
methods: { |
|||
getList() { |
|||
// 居民需求列表 |
|||
this.$http |
|||
.post( |
|||
"/actual/base/peopleRoomOverview/demandOfResidentsPageList", |
|||
this.queryParams |
|||
) |
|||
.then(({ data: res }) => { |
|||
this.list = res.data.map((item) => { |
|||
return { |
|||
...item, |
|||
}; |
|||
}); |
|||
this.total = res.data.length; |
|||
this.$emit("changeTotal", { name: 4, total: this.total }); |
|||
}); |
|||
}, |
|||
}, |
|||
}; |
|||
</script> |
|||
|
|||
<style scoped lang="scss"> |
|||
.business-records { |
|||
margin-bottom: 25px; |
|||
} |
|||
.table { |
|||
/deep/ .el-table td, |
|||
/deep/ .el-table th, |
|||
/deep/ .el-table tr { |
|||
padding: 14px !important; |
|||
border: none !important; |
|||
min-height: 52px; |
|||
} |
|||
/deep/ .el-table td, |
|||
/deep/ .el-table th { |
|||
background: none !important; |
|||
} |
|||
/deep/ .el-table td { |
|||
font-size: 14px; |
|||
font-weight: 400; |
|||
color: #ffffff; |
|||
text-shadow: 1px 2px 4px rgba(10, 32, 60, 0.51); |
|||
} |
|||
|
|||
/deep/ .el-table tr { |
|||
background: none; |
|||
&:hover { |
|||
background-color: rgba(26, 149, 255, 0.3) !important; |
|||
} |
|||
} |
|||
/deep/ .el-table__body-wrapper tr:nth-of-type(odd) { |
|||
background: rgba(14, 56, 115, 0.4); |
|||
} |
|||
|
|||
/deep/ .el-table { |
|||
background: none !important; |
|||
|
|||
&:before { |
|||
background: none; |
|||
} |
|||
} |
|||
/deep/ .el-table__header-wrapper tr { |
|||
color: #a3b9da !important; |
|||
font-size: 14px; |
|||
font-weight: 400; |
|||
opacity: 0.76; |
|||
background: none; |
|||
&:hover { |
|||
background: none !important; |
|||
} |
|||
} |
|||
/deep/ .el-table__header-wrapper { |
|||
background: none !important; |
|||
} |
|||
} |
|||
</style> |
|||
@ -0,0 +1,38 @@ |
|||
<template> |
|||
<div class="personalWrap"> |
|||
<div class="bread"> |
|||
<bread-crumb :list="list" /> |
|||
</div> |
|||
<div class="wrap-content"> |
|||
<personnel-person /> |
|||
</div> |
|||
</div> |
|||
</template> |
|||
|
|||
<script> |
|||
import BreadCrumb from "@/views/dataBoard/cpts/personnel/components/Breadcrumb/index.vue"; |
|||
import PersonnelPerson from "@/views/dataBoard/cpts/personnel/index.vue"; |
|||
export default { |
|||
name: "PersonalPage", |
|||
components: { |
|||
BreadCrumb, |
|||
PersonnelPerson, |
|||
}, |
|||
data() { |
|||
return { |
|||
list: [ |
|||
{ |
|||
path: "/organizational/dangTree", |
|||
name: "党组织架构", |
|||
}, |
|||
{ |
|||
path: "", |
|||
name: "人员信息", |
|||
}, |
|||
], |
|||
}; |
|||
}, |
|||
}; |
|||
</script> |
|||
|
|||
<style scope lang="scss"></style> |
|||
@ -0,0 +1,166 @@ |
|||
<template> |
|||
<div class="follow-up"> |
|||
<div class="content"> |
|||
<div class="left"> |
|||
<div class="total"> |
|||
<div class="tit">回访总数</div> |
|||
<div class="num"><span>{{ sumNum ? sumNum : 0 }}</span>个</div> |
|||
</div> |
|||
<div class="left-item"> |
|||
<div class="tit">电话回访</div> |
|||
<div class="num"><span>{{ mobileNum ? mobileNum : 0 }}</span>个</div> |
|||
</div> |
|||
<div class="left-item"> |
|||
<div class="tit">上门回访</div> |
|||
<div class="num"><span>{{ visitNum ? visitNum : 0 }}</span>个</div> |
|||
</div> |
|||
</div> |
|||
<div class="xc"> |
|||
<div class="tit">回访消除 <br/> 风险人数</div> |
|||
<div class="num blue">{{ notRiskyNum ? notRiskyNum : 0 }}</div> |
|||
</div> |
|||
</div> |
|||
</div> |
|||
</template> |
|||
|
|||
<script> |
|||
export default { |
|||
name: "FollowUp", |
|||
props: { |
|||
date: { |
|||
type: String, |
|||
default: '' |
|||
} |
|||
}, |
|||
data() { |
|||
return { |
|||
org: this.$store.state.chooseArea.chooseName, |
|||
typeList: [{ |
|||
label: '12345事件', |
|||
value: '12345' |
|||
}, { |
|||
label: '事件回访', |
|||
value: 'follow' |
|||
}], |
|||
type: 'follow', |
|||
sumNum: 0, |
|||
mobileNum: 0, |
|||
visitNum: 0, |
|||
notRiskyNum: 0, |
|||
} |
|||
}, |
|||
watch: { |
|||
"$store.state.chooseArea.chooseName"(val) { |
|||
if (val.orgId) { |
|||
this.getData() |
|||
} |
|||
}, |
|||
date() { |
|||
this.getData() |
|||
} |
|||
}, |
|||
mounted() { |
|||
if (this.org.orgId) { |
|||
this.getData() |
|||
} |
|||
}, |
|||
methods: { |
|||
getData() { |
|||
this.$http.get('/actual/base/streetOverview/eventAndFollowGroup?month=' + this.date + '&level=' + this.$store.state.chooseArea.chooseName.level + '&orgId=' + this.$store.state.chooseArea.chooseName.orgId + '&queryType=' + this.type).then(({data: {data}}) => { |
|||
this.sumNum = data.sumNum |
|||
this.mobileNum = data.mobileNum |
|||
this.visitNum = data.visitNum |
|||
this.notRiskyNum = data.notRiskyNum |
|||
}) |
|||
}, |
|||
typeChange(val) { |
|||
console.log(val,'val') |
|||
this.type = val |
|||
this.getData() |
|||
} |
|||
} |
|||
} |
|||
</script> |
|||
|
|||
<style scoped lang="scss"> |
|||
.follow-up { |
|||
padding: 10px 16px; |
|||
} |
|||
.content { |
|||
background: linear-gradient(90deg, rgba(1, 94, 234, 0.1) 0%, rgba(16, 50, 103, 0) 50%, rgba(1, 94, 234, 0.1) 100%); |
|||
padding: 40px 19px; |
|||
display: flex; |
|||
justify-content: space-between; |
|||
align-items: center; |
|||
} |
|||
|
|||
.left { |
|||
border-right: 1px solid #96B1CE; |
|||
padding-right: 35px; |
|||
display: flex; |
|||
align-items: center; |
|||
justify-content: space-between; |
|||
|
|||
.total { |
|||
.tit { |
|||
font-size: 16px; |
|||
font-weight: 400; |
|||
color: #FFFFFF; |
|||
margin-bottom: 20px; |
|||
} |
|||
|
|||
.num { |
|||
font-size: 14px; |
|||
font-weight: 500; |
|||
color: #A3B9DA; |
|||
|
|||
span { |
|||
font-size: 36px; |
|||
font-weight: bold; |
|||
font-style: italic; |
|||
color: #08EBAE; |
|||
} |
|||
} |
|||
} |
|||
|
|||
.left-item { |
|||
margin-left: 24px; |
|||
.tit { |
|||
font-size: 14px; |
|||
font-weight: 400; |
|||
color: #A3B9DA; |
|||
line-height: 24px; |
|||
margin-bottom: 24px; |
|||
} |
|||
|
|||
.num { |
|||
font-size: 14px; |
|||
font-weight: 500; |
|||
color: #A3B9DA; |
|||
span { |
|||
font-size: 30px; |
|||
font-weight: bold; |
|||
font-style: italic; |
|||
color: #78C4F3; |
|||
} |
|||
} |
|||
} |
|||
} |
|||
|
|||
.xc { |
|||
.tit { |
|||
font-size: 16px; |
|||
font-weight: 400; |
|||
color: #FFFFFF; |
|||
line-height: 24px; |
|||
margin-bottom: 10px; |
|||
} |
|||
|
|||
.num { |
|||
font-size: 32px; |
|||
font-weight: bold; |
|||
font-style: italic; |
|||
color: #FFB73C; |
|||
} |
|||
} |
|||
</style> |
|||
@ -0,0 +1,70 @@ |
|||
<template> |
|||
<div class="m-subbox m-sqrfph"> |
|||
<div class="table"> |
|||
<div class="tr"> |
|||
<div class="th">排名</div> |
|||
<div class="th">社区</div> |
|||
<div class="th">房屋更新数</div> |
|||
<div class="th">人口更新数</div> |
|||
<div class="th">人房更新总数</div> |
|||
</div> |
|||
<div class="tr" v-for="(item,index) in pmList" :key="index"> |
|||
<div :class="index - 0 + 1 < 4 ? `td tdbg${index-0+1}` : 'td'"> |
|||
{{ index - 0 + 1 }} |
|||
</div> |
|||
<div class="td">{{ item.orgName }}</div> |
|||
<div class="td">{{ item.houseNum }}</div> |
|||
<div class="td">{{ item.residentNum }}</div> |
|||
<div class="td">{{ item.sumNum }}</div> |
|||
</div> |
|||
</div> |
|||
</div> |
|||
</template> |
|||
<script> |
|||
export default { |
|||
name: "GridUpdateRanking", |
|||
props: { |
|||
date: { |
|||
type: String, |
|||
default: '' |
|||
} |
|||
}, |
|||
data() { |
|||
return { |
|||
org: this.$store.state.chooseArea.chooseName, |
|||
pmList: [], |
|||
}; |
|||
}, |
|||
watch: { |
|||
"$store.state.chooseArea.chooseName"(val) { |
|||
if (val.orgId) { |
|||
this.getList() |
|||
} |
|||
}, |
|||
date() { |
|||
this.getList() |
|||
} |
|||
}, |
|||
mounted() { |
|||
if (this.org.orgId) { |
|||
this.getList() |
|||
} |
|||
}, |
|||
methods: { |
|||
getList() { |
|||
this.$http.get('/actual/base/streetOverview/residentHouseUpdateGroup?level=' + this.$store.state.chooseArea.chooseName.level + '&orgId=' + this.$store.state.chooseArea.chooseName.orgId).then(({data: {data}}) => { |
|||
this.pmList = data |
|||
}) |
|||
} |
|||
} |
|||
}; |
|||
</script> |
|||
|
|||
<style lang="scss" src="@/assets/scss/dataBoard/overview/index.scss" scoped/> |
|||
<style lang="scss" scoped> |
|||
.m-sqrfph { |
|||
padding-top: 0 !important; |
|||
height: 160px !important; |
|||
} |
|||
|
|||
</style> |
|||
File diff suppressed because it is too large
@ -0,0 +1,747 @@ |
|||
<template> |
|||
<div class="g-pgi"> |
|||
<!-- 组织路由 --> |
|||
<cpt-bread |
|||
:separator="'/'" |
|||
@tap="handleClickBreadItem" |
|||
:breadList="breadList" |
|||
></cpt-bread> |
|||
|
|||
<div class="m-title"> |
|||
<img class="title_img" src="@/assets/images/index/list-logo.png" alt /> |
|||
<div class="tip_title">{{ tableTitle }}</div> |
|||
<div class="title_line"></div> |
|||
|
|||
<div class="second-select" v-if="type == 'old'"> |
|||
<el-select |
|||
v-model="oldVal" |
|||
:popper-append-to-body="false" |
|||
placeholder="请选择年龄" |
|||
> |
|||
<el-option |
|||
v-for="item in oldList" |
|||
:key="item.value" |
|||
:label="item.label" |
|||
:value="item.value" |
|||
></el-option> |
|||
</el-select> |
|||
|
|||
<el-select |
|||
v-model="searchParams.resideSituation" |
|||
:popper-append-to-body="false" |
|||
@change="changeSearch" |
|||
placeholder="请选择居住情况" |
|||
> |
|||
<el-option |
|||
v-for="item in resideArr" |
|||
:key="item.value" |
|||
:label="item.label" |
|||
:value="item.value" |
|||
></el-option> |
|||
</el-select> |
|||
</div> |
|||
<div class="second-select" v-if="type == 'dibao'"> |
|||
<el-select |
|||
v-model="searchParams.lowIncomeType" |
|||
:popper-append-to-body="false" |
|||
@change="changeSearch" |
|||
placeholder="请选择低保类型" |
|||
> |
|||
<el-option |
|||
v-for="item in lowIncomeTypeArr" |
|||
:key="item.value" |
|||
:label="item.label" |
|||
:value="item.value" |
|||
></el-option> |
|||
</el-select> |
|||
|
|||
<el-select |
|||
v-model="searchParams.lowIncomeReason" |
|||
:popper-append-to-body="false" |
|||
@change="changeSearch" |
|||
placeholder="请选择低保原因" |
|||
> |
|||
<el-option |
|||
v-for="item in lowIncomeReasonArr" |
|||
:key="item.value" |
|||
:label="item.label" |
|||
:value="item.value" |
|||
></el-option> |
|||
</el-select> |
|||
</div> |
|||
<div class="second-select" v-if="type == 'zhiyuanzhe'"> |
|||
<el-select |
|||
v-model="oldVal" |
|||
:popper-append-to-body="false" |
|||
placeholder="请选择年龄" |
|||
> |
|||
<el-option |
|||
v-for="item in oldAllList" |
|||
:key="item.value" |
|||
:label="item.label" |
|||
:value="item.value" |
|||
></el-option> |
|||
</el-select> |
|||
|
|||
<el-select |
|||
v-model="searchParams.gategoryCode" |
|||
:popper-append-to-body="false" |
|||
@change="changeSearch" |
|||
placeholder="请选择志愿者类型" |
|||
> |
|||
<el-option |
|||
v-for="item in volunteerArr" |
|||
:key="item.value" |
|||
:label="item.label" |
|||
:value="item.value" |
|||
></el-option> |
|||
</el-select> |
|||
</div> |
|||
<div class="second-select" v-if="type == 'dangyuan'"> |
|||
<el-select |
|||
v-model="oldVal" |
|||
:popper-append-to-body="false" |
|||
placeholder="请选择年龄" |
|||
> |
|||
<el-option |
|||
v-for="item in oldAllList" |
|||
:key="item.value" |
|||
:label="item.label" |
|||
:value="item.value" |
|||
></el-option> |
|||
</el-select> |
|||
|
|||
<el-select |
|||
v-model="searchParams.cultureLevel" |
|||
:popper-append-to-body="false" |
|||
@change="changeSearch" |
|||
placeholder="请选择学历" |
|||
> |
|||
<el-option |
|||
v-for="item in PostDictonArr" |
|||
:key="item.value" |
|||
:label="item.label" |
|||
:value="item.value" |
|||
></el-option> |
|||
</el-select> |
|||
</div> |
|||
<div class="second-select" v-if="type == 'shiye'"> |
|||
<el-select |
|||
v-model="oldVal" |
|||
:popper-append-to-body="false" |
|||
@change="changeSearch" |
|||
placeholder="请选择年龄" |
|||
> |
|||
<el-option |
|||
v-for="item in oldAllList" |
|||
:key="item.value" |
|||
:label="item.label" |
|||
:value="item.value" |
|||
></el-option> |
|||
</el-select> |
|||
|
|||
<el-select |
|||
v-model="searchParams.employmentWish" |
|||
:popper-append-to-body="false" |
|||
@change="changeSearch" |
|||
placeholder="请选择就业愿望" |
|||
> |
|||
<el-option |
|||
v-for="item in careerArr" |
|||
:key="item.value" |
|||
:label="item.label" |
|||
:value="item.value" |
|||
></el-option> |
|||
</el-select> |
|||
|
|||
<el-select |
|||
v-model="searchParams.unemploymentReason" |
|||
:popper-append-to-body="false" |
|||
@change="changeSearch" |
|||
placeholder="请选择失业原因" |
|||
> |
|||
<el-option |
|||
v-for="item in unemploymentArr" |
|||
:key="item.value" |
|||
:label="item.label" |
|||
:value="item.value" |
|||
></el-option> |
|||
</el-select> |
|||
</div> |
|||
<div |
|||
class="second-select" |
|||
v-if=" |
|||
type == 'fuwu' || |
|||
type == 'wennuan' || |
|||
type == 'jineng' || |
|||
type == 'gangwei' |
|||
" |
|||
> |
|||
<el-input |
|||
type="text" |
|||
v-model="searchParams.serviceOrgName" |
|||
placeholder="请输入服务方名称" |
|||
@blur="changeFwfmc" |
|||
/> |
|||
</div> |
|||
</div> |
|||
|
|||
<div class="g-listbox"> |
|||
<cpt-tb |
|||
:col-list="colList" |
|||
:loading="loading" |
|||
:header="header" |
|||
:list="list" |
|||
:total="total" |
|||
@handleSizeChange="handleSizeChange" |
|||
@handlePageNoChange="handlePageNoChange" |
|||
@operate="jumpPage" |
|||
></cpt-tb> |
|||
</div> |
|||
</div> |
|||
</template> |
|||
|
|||
<script> |
|||
import cptTb from "@/views/dataBoard/cpts/tb"; |
|||
import cptBread from "@/views/dataBoard/renfang/cpts/bread"; |
|||
import getQueryPara from "dai-js/modules/getQueryPara"; |
|||
|
|||
export default { |
|||
name: "resi-list", |
|||
|
|||
components: { |
|||
cptTb, |
|||
cptBread, |
|||
}, |
|||
|
|||
data() { |
|||
return { |
|||
breadList: [ |
|||
{ |
|||
path: "/dataBoard/renfang/index", |
|||
meta: { |
|||
title: "人房总览", |
|||
}, |
|||
}, |
|||
{ |
|||
path: "/dataBoard/renfang/visualizing", |
|||
meta: { |
|||
title: "", |
|||
}, |
|||
}, |
|||
{ |
|||
meta: { |
|||
title: "居民列表", |
|||
}, |
|||
}, |
|||
], |
|||
tableTitle: "居民列表", |
|||
pageType: "", |
|||
orgLevel: "", |
|||
org_id: "", |
|||
type_id: "", // 居民列表 |
|||
type_name: "", |
|||
loading: true, |
|||
pageSize: parseInt(localStorage.getItem("dataBoard_PageSize")) || 20, |
|||
pageNo: 1, |
|||
total: 0, |
|||
srcTableData: [], |
|||
list: [], |
|||
listData: [], |
|||
oldList: [ |
|||
{ |
|||
label: "60-69岁", |
|||
value: ["60", "69"], |
|||
}, |
|||
{ |
|||
label: "70-79岁", |
|||
value: ["70", "79"], |
|||
}, |
|||
{ |
|||
label: "80-89岁", |
|||
value: ["80", "89"], |
|||
}, |
|||
{ |
|||
label: "90岁以上", |
|||
value: ["90", "139"], |
|||
}, |
|||
], |
|||
oldAllList: [ |
|||
{ |
|||
label: "0-9岁", |
|||
value: ["0", "9"], |
|||
}, |
|||
{ |
|||
label: "10-19岁", |
|||
value: ["10", "19"], |
|||
}, |
|||
{ |
|||
label: "20-29岁", |
|||
value: ["20", "29"], |
|||
}, |
|||
{ |
|||
label: "30-39岁", |
|||
value: ["30", "39"], |
|||
}, |
|||
{ |
|||
label: "40-49岁", |
|||
value: ["40", "49"], |
|||
}, |
|||
{ |
|||
label: "50-59岁", |
|||
value: ["50", "59"], |
|||
}, |
|||
{ |
|||
label: "60-69岁", |
|||
value: ["60", "69"], |
|||
}, |
|||
{ |
|||
label: "70-79岁", |
|||
value: ["70", "79"], |
|||
}, |
|||
{ |
|||
label: "80-89岁", |
|||
value: ["80", "89"], |
|||
}, |
|||
{ |
|||
label: "90岁以上", |
|||
value: ["90", "139"], |
|||
}, |
|||
], |
|||
jzList: [ |
|||
{ |
|||
label: "不知奥", |
|||
value: "90,120", |
|||
}, |
|||
], |
|||
colList: [ |
|||
{ |
|||
align: "left", |
|||
width: "5%", |
|||
}, |
|||
{ |
|||
align: "left", |
|||
width: "10%", |
|||
}, |
|||
{ |
|||
align: "left", |
|||
width: "20%", |
|||
}, |
|||
{ |
|||
align: "left", |
|||
width: "20%", |
|||
}, |
|||
{ |
|||
align: "left", |
|||
width: "15%", |
|||
}, |
|||
{ |
|||
align: "left", |
|||
width: "10%", |
|||
}, |
|||
{ |
|||
align: "left", |
|||
width: "5%", |
|||
}, |
|||
{ |
|||
align: "left", |
|||
width: "10%", |
|||
}, |
|||
{ |
|||
align: "left", |
|||
width: "10%", |
|||
}, |
|||
], |
|||
header: [ |
|||
"序号", |
|||
"姓名", |
|||
"所属网格", |
|||
"所属房屋", |
|||
"联系电话", |
|||
"证件号", |
|||
"性别", |
|||
"出生日期", |
|||
"操作", |
|||
], |
|||
type: null, |
|||
typeList: [ |
|||
{ |
|||
type: "old", |
|||
name: "老年人", |
|||
url: "/actual/base/peopleRoomOverview/oldPeoplePageList", |
|||
}, |
|||
{ |
|||
type: "dibao", |
|||
name: "低保人员", |
|||
url: "/actual/base/peopleRoomOverview/lowIncomePageList", |
|||
}, |
|||
{ |
|||
type: "zhiyuanzhe", |
|||
name: "志愿者", |
|||
url: "/actual/base/peopleRoomOverview/volunteerPageList", |
|||
}, |
|||
{ |
|||
type: "dangyuan", |
|||
name: "党员", |
|||
url: "/actual/base/peopleRoomOverview/partyPageList", |
|||
}, |
|||
{ |
|||
type: "shiye", |
|||
name: "失业人员", |
|||
url: "/actual/base/peopleRoomOverview/unemployedPageList", |
|||
}, |
|||
{ |
|||
type: "fuwu", |
|||
name: "服务找人分页查询", |
|||
url: "/actual/base/peopleRoomOverview/servicePageList", |
|||
}, |
|||
{ |
|||
type: "wennuan", |
|||
name: "温暖找人查询", |
|||
url: "/actual/base/peopleRoomOverview/warmthPageList", |
|||
}, |
|||
{ |
|||
type: "jineng", |
|||
name: "技能找人查询", |
|||
url: "/actual/base/peopleRoomOverview/skillPageList", |
|||
}, |
|||
{ |
|||
type: "gangwei", |
|||
name: "岗位找人分页查询", |
|||
url: "/actual/base/peopleRoomOverview/postPageList", |
|||
}, |
|||
], |
|||
oldVal: ["60", "69"], |
|||
jzVal: "", |
|||
searchParams: {}, |
|||
unemploymentArr: [], |
|||
PostDictonArr: [], |
|||
resideArr: [], |
|||
careerArr: [], |
|||
lowIncomeReasonArr: [], |
|||
lowIncomeTypeArr: [], |
|||
}; |
|||
}, |
|||
|
|||
activated() { |
|||
const query = this.$route.query; |
|||
this.org_id = query.org_id; |
|||
this.type = query.type; |
|||
this.type_id = query.type_id; |
|||
this.pageType = query.pageType; |
|||
this.type_name = query.type_name; |
|||
const type_name = query.type_name; |
|||
let title = type_name; |
|||
if (this.type == "jineng" || this.type == "gangwei") { |
|||
title = "失业人员"; |
|||
} |
|||
if (this.type == "wennuan" || this.type == "fuwu") { |
|||
title = "低保人员"; |
|||
} |
|||
this.type_name1 = title; |
|||
this.breadList[1].meta.title = title; |
|||
this.tableTitle = type_name + "居民列表"; |
|||
this.pageNo = 1; |
|||
const type = this.type; |
|||
if (type == "dibao") { |
|||
this.searchParams = { |
|||
lowIncomeType: null, // 低保类型 |
|||
lowIncomeReason: null, // 低保原因 |
|||
}; |
|||
} |
|||
if (type == "shiye") { |
|||
this.searchParams = { |
|||
employmentWish: null, // 就业愿望 |
|||
unemploymentReason: null, // 失业原因 |
|||
startAge: null, |
|||
endAge: null, |
|||
}; |
|||
} |
|||
if (type == "dangyuan") { |
|||
this.searchParams = { |
|||
cultureLevel: null, // 学历 |
|||
startAge: null, |
|||
endAge: null, |
|||
}; |
|||
} |
|||
if (type == "zhiyuan") { |
|||
this.searchParams = { |
|||
gategoryCode: null, // 志愿者类型 |
|||
startAge: null, |
|||
endAge: null, |
|||
}; |
|||
} |
|||
if ( |
|||
type == "fuwu" || |
|||
type == "wennuan" || |
|||
type == "jineng" || |
|||
type == "gangwei" |
|||
) { |
|||
this.searchParams = { |
|||
serviceOrgName: null, // 服务方名称 |
|||
}; |
|||
} |
|||
this.getList(); |
|||
if (this.pageType != "normal") { |
|||
this.colList = [ |
|||
{ |
|||
align: "left", |
|||
width: "5%", |
|||
}, |
|||
{ |
|||
align: "left", |
|||
width: "15%", |
|||
}, |
|||
{ |
|||
align: "left", |
|||
width: "20%", |
|||
}, |
|||
{ |
|||
align: "left", |
|||
width: "15%", |
|||
}, |
|||
{ |
|||
align: "left", |
|||
width: "15%", |
|||
}, |
|||
{ |
|||
align: "left", |
|||
width: "15%", |
|||
}, |
|||
{ |
|||
align: "left", |
|||
width: "10%", |
|||
}, |
|||
{ |
|||
align: "left", |
|||
width: "10%", |
|||
}, |
|||
]; |
|||
|
|||
this.header = [ |
|||
"序号", |
|||
"服务类型", |
|||
"服务事项", |
|||
"来源", |
|||
"服务时间", |
|||
"服务方", |
|||
"服务人数", |
|||
"操作", |
|||
]; |
|||
} |
|||
// 字典 |
|||
this.getResideNation(); |
|||
this.getPostNation(); |
|||
this.getUnemployment(); |
|||
this.getCareer(); |
|||
this.getVolunteer(); |
|||
this.getLowIncomeReason(); |
|||
this.getLowIncomeType(); |
|||
}, |
|||
created() { |
|||
this.pageNo = 1; |
|||
}, |
|||
watch: { |
|||
$route(to, from) { |
|||
this.$router.go(0); |
|||
}, |
|||
oldVal: { |
|||
handler(newVal, oldVal) { |
|||
this.pageNo = 1; |
|||
const searchParams = { |
|||
startAge: newVal[0], |
|||
endAge: newVal[1], |
|||
}; |
|||
this.getList(searchParams); |
|||
}, |
|||
}, |
|||
searchParams(newVal, oldVal) { |
|||
this.getList(); |
|||
}, |
|||
}, |
|||
|
|||
methods: { |
|||
handleClickBreadItem({ item }) { |
|||
this.$router.push({ |
|||
path: item.path, |
|||
query: { |
|||
org_id: this.org_id, |
|||
type_id: this.type_id, |
|||
type_name: item.meta.title, |
|||
pageType: this.pageType, |
|||
type: this.type, |
|||
pageType: this.pageType, |
|||
}, |
|||
}); |
|||
}, |
|||
changeFwfmc(e) { |
|||
this.searchParams = { |
|||
serviceOrgName: e.target.value || null, |
|||
}; |
|||
this.getList(); |
|||
}, |
|||
changeSearch() { |
|||
this.getList(); |
|||
}, |
|||
jumpPage(index) { |
|||
let item = this.listData[index]; |
|||
this.$router.push({ |
|||
path: "/dataBoard/renfang/resident", |
|||
query: { |
|||
org_id: this.org_id, |
|||
type_id: this.type_id, |
|||
user_id: item.id, |
|||
type: this.type, |
|||
pageType: this.pageType, |
|||
type_name: this.type_name, |
|||
}, |
|||
}); |
|||
}, |
|||
handlePageNoChange(pageNo) { |
|||
this.pageNo = pageNo; |
|||
this.getList(); |
|||
}, |
|||
handleSizeChange(pageSize) { |
|||
localStorage.setItem("dataBoard_PageSize", pageSize); |
|||
this.pageSize = pageSize; |
|||
this.getList(); |
|||
}, |
|||
async getList(item) { |
|||
const { url } = this.typeList.filter((item) => item.type == this.type)[0]; |
|||
const sourceType = ["公共服务", "共性需求", "政策找人", "服务找人"]; |
|||
this.loading = true; |
|||
let queryParam = { |
|||
pageNo: this.pageNo, |
|||
pageSize: this.pageSize, |
|||
...this.searchParams, |
|||
...item, |
|||
}; |
|||
this.$http.post(url, queryParam).then(({ data: res }) => { |
|||
this.loading = false; |
|||
const { data, code, msg } = res; |
|||
const { list, total } = data; |
|||
const gender = ["未知", "男", "女"]; |
|||
if (code === 0) { |
|||
this.listData = list; |
|||
if (this.pageType == "normal") { |
|||
this.list = list.map((item, index) => { |
|||
return [ |
|||
index + 1, |
|||
item.name ? item.name : "--", |
|||
item.gridName ? item.gridName : "--", |
|||
item.fullName ? item.fullName : "--", |
|||
item.mobile ? item.mobile : "--", |
|||
item.idNum ? item.idNum : "--", |
|||
item.gender ? gender[item.gender] : "--", |
|||
item.birthday ? item.birthday : "--", |
|||
{ type: "operate", list: ["查看"] }, |
|||
]; |
|||
}); |
|||
} else { |
|||
this.list = list.map((item, index) => { |
|||
return [ |
|||
index + 1, |
|||
item.serviceCategoryKey ? item.serviceCategoryKey : "--", |
|||
item.serviceName ? item.serviceName : "--", |
|||
item.awardPoint ? sourceType[item.awardPoint] : "--", |
|||
item.serviceTimeStart ? item.serviceTimeStart : "--", |
|||
item.serviceOrgName ? item.serviceOrgName : "--", |
|||
item.servedPersonQty ? item.servedPersonQty : "--", |
|||
{ type: "operate", list: ["查看"] }, |
|||
]; |
|||
}); |
|||
} |
|||
this.total = total; |
|||
} else { |
|||
this.$message.error(msg); |
|||
} |
|||
}); |
|||
}, |
|||
async getResideNation() { |
|||
try { |
|||
const { data } = await this.$http.post("sys/dict/data/dictlist", { |
|||
dictType: "reside_situation", |
|||
}); |
|||
this.resideArr = data.data; |
|||
} catch (error) { |
|||
console.log(error, "获取居住情况字典"); |
|||
} |
|||
}, |
|||
// async getPostNation() { |
|||
// try { |
|||
// let { data } = await this.$http.post("sys/dict/data/dictlist", { |
|||
// dictType: "welfare_post", |
|||
// }); |
|||
// this.PostDictonArr = data.data; |
|||
// } catch (error) { |
|||
// console.log(error, "获取学历字典"); |
|||
// } |
|||
// }, |
|||
async getUnemployment() { |
|||
try { |
|||
const { data } = await this.$http.post("sys/dict/data/dictlist", { |
|||
dictType: "unemployment_cause", |
|||
}); |
|||
this.unemploymentArr = data.data; |
|||
} catch (error) { |
|||
console.log(error, "获取失业原因字典"); |
|||
} |
|||
}, |
|||
async getCareer() { |
|||
try { |
|||
const { data } = await this.$http.post("sys/dict/data/dictlist", { |
|||
dictType: "career_goals", |
|||
}); |
|||
this.careerArr = data.data; |
|||
} catch (error) { |
|||
console.log(error, "获取就业愿望字典"); |
|||
} |
|||
}, |
|||
async getVolunteer() { |
|||
try { |
|||
const { data } = await this.$http.post("sys/dict/data/dictlist", { |
|||
dictType: "VOLUNTEER_CATEGORY", |
|||
}); |
|||
this.volunteerArr = data.data; |
|||
} catch (error) { |
|||
console.log(error, "获取志愿者类别字典"); |
|||
} |
|||
}, |
|||
async getLowIncomeReason() { |
|||
try { |
|||
const { data } = await this.$http.post("sys/dict/data/dictlist", { |
|||
dictType: "low_income_reason", |
|||
}); |
|||
this.lowIncomeReasonArr = data.data; |
|||
} catch (error) { |
|||
console.log(error, "获取低保原因字典"); |
|||
} |
|||
}, |
|||
async getLowIncomeType() { |
|||
try { |
|||
const { data } = await this.$http.post("sys/dict/data/dictlist", { |
|||
dictType: "low_income_type", |
|||
}); |
|||
this.lowIncomeTypeArr = data.data; |
|||
} catch (error) { |
|||
console.log(error, "获取低保类型字典"); |
|||
} |
|||
}, |
|||
async getPostNation() { |
|||
try { |
|||
let { data } = await this.$http.post("sys/dict/data/education", { |
|||
formCode: "resi_base_info", |
|||
}); |
|||
this.PostDictonArr = data.data; |
|||
} catch (error) { |
|||
console.log(error, "获取学历字典"); |
|||
} |
|||
}, |
|||
}, |
|||
destroyed() { |
|||
console.log("我已经离开了！"); |
|||
}, |
|||
}; |
|||
</script> |
|||
|
|||
<style lang="scss" src="@/assets/scss/dataBoard/listBox.scss" scoped></style> |
|||
@ -1,150 +0,0 @@ |
|||
<template> |
|||
<div class="business-records"> |
|||
<Tabs v-model="type" :list="typeList" @changeVal="typeChange"/> |
|||
<div class="table"> |
|||
<el-table :data="list"> |
|||
<el-table-column |
|||
label="序号" |
|||
type="index" |
|||
width="80"/> |
|||
<el-table-column |
|||
label="评价周期" |
|||
prop="key" |
|||
width=""/> |
|||
<el-table-column |
|||
label="姓名" |
|||
prop="key" |
|||
width=""/> |
|||
<el-table-column |
|||
label="电话" |
|||
prop="key" |
|||
width=""/> |
|||
<el-table-column |
|||
label="不满意类型" |
|||
prop="key" |
|||
width=""/> |
|||
<el-table-column |
|||
label="不满意原因" |
|||
prop="key" |
|||
width=""/> |
|||
<el-table-column label="操作" width="90" align="center"> |
|||
<template slot-scope="data"> |
|||
<el-button type="text" @click="handleView">查看</el-button> |
|||
</template> |
|||
</el-table-column> |
|||
</el-table> |
|||
<Pagination |
|||
v-show="total>0" |
|||
:total="total" |
|||
:page.sync="queryParams.pageNum" |
|||
:limit.sync="queryParams.pageSize" |
|||
@pagination="getList" |
|||
/> |
|||
</div> |
|||
</div> |
|||
</template> |
|||
|
|||
<script> |
|||
import Tabs from "@/views/dataBoard/satisfactionEval/components/Tabs/index.vue"; |
|||
|
|||
export default { |
|||
name: "BusinessRecords", |
|||
components: {Tabs}, |
|||
data() { |
|||
return { |
|||
total: 10, |
|||
queryParams: { |
|||
pageNum: 0, |
|||
pageSize: 10, |
|||
}, |
|||
type: 1, |
|||
typeList: [{ |
|||
label: ' 12345投诉', |
|||
value: 1 |
|||
}, { |
|||
label: '省满意度调查', |
|||
value: 2 |
|||
}, { |
|||
label: '社区满意度自查', |
|||
value: 3 |
|||
}, { |
|||
label: '事件', |
|||
value: 4 |
|||
}, { |
|||
label: '需求', |
|||
value: 5 |
|||
}, { |
|||
label: '服务', |
|||
value: 6 |
|||
}, { |
|||
label: '回访记录', |
|||
value: 7 |
|||
}], |
|||
list: [{},{},{},{},{}] |
|||
} |
|||
}, |
|||
methods: { |
|||
typeChange() { |
|||
|
|||
}, |
|||
getList() { |
|||
|
|||
} |
|||
} |
|||
} |
|||
</script> |
|||
|
|||
<style scoped lang="scss"> |
|||
.business-records { |
|||
margin-bottom: 25px; |
|||
} |
|||
.table { |
|||
/deep/ .el-table td, /deep/ .el-table th, /deep/ .el-table tr { |
|||
padding: 14px !important; |
|||
border:none!important; |
|||
min-height: 52px; |
|||
|
|||
} |
|||
/deep/ .el-table td, /deep/ .el-table th { |
|||
background: none!important; |
|||
} |
|||
/deep/ .el-table td { |
|||
font-size: 14px; |
|||
font-weight: 400; |
|||
color: #FFFFFF; |
|||
text-shadow: 1px 2px 4px rgba(10,32,60,0.51); |
|||
} |
|||
|
|||
/deep/ .el-table tr { |
|||
background: none; |
|||
&:hover { |
|||
background-color: rgba(26, 149, 255, 0.3) !important; |
|||
} |
|||
|
|||
} |
|||
/deep/ .el-table__body-wrapper tr:nth-of-type(odd) { |
|||
background: rgba(14, 56, 115, 0.4); |
|||
} |
|||
|
|||
/deep/ .el-table { |
|||
background: none !important; |
|||
|
|||
&:before { |
|||
background: none; |
|||
} |
|||
} |
|||
/deep/ .el-table__header-wrapper tr { |
|||
color: #A3B9DA !important; |
|||
font-size: 14px; |
|||
font-weight: 400; |
|||
opacity: 0.76; |
|||
background: none; |
|||
&:hover { |
|||
background: none!important; |
|||
} |
|||
} |
|||
/deep/ .el-table__header-wrapper { |
|||
background: none!important; |
|||
} |
|||
} |
|||
</style> |
|||
@ -1,188 +0,0 @@ |
|||
<template> |
|||
<div className="event-statistics"> |
|||
<div id="enjoyServiceChart" style="height: 360px;"></div> |
|||
</div> |
|||
</template> |
|||
|
|||
<script> |
|||
import * as echarts from "echarts"; |
|||
|
|||
export default { |
|||
name: "EnjoyService", |
|||
data() { |
|||
return {} |
|||
}, |
|||
mounted() { |
|||
this.initCharts() |
|||
}, |
|||
methods: { |
|||
initCharts() { |
|||
let div = document.getElementById('enjoyServiceChart'); |
|||
this.myChart = echarts.init(div); |
|||
|
|||
let xData = ['岗位找人', '技能找人', '温暖找人', '服务找人']; |
|||
let tq = [300, 90, 48, 39]; |
|||
const max = Math.max(...tq) |
|||
|
|||
let barArray = new Array(xData.length).fill((parseInt(max / 100) + 1) * 100) |
|||
var option = { |
|||
title: { |
|||
show: false, |
|||
text: '', |
|||
x: 'center', |
|||
top: '15px', |
|||
textStyle: { |
|||
color: '#333333', |
|||
fontWeight: 500, |
|||
fontSize: 18, |
|||
}, |
|||
}, |
|||
tooltip: { |
|||
trigger: 'axis', |
|||
backgroundColor: 'rgba(13, 64, 71, 0.50)', |
|||
borderColor: 'rgba(143, 225, 252, 0.60)', |
|||
padding: 8, |
|||
textStyle: { |
|||
color: '#fff', |
|||
}, |
|||
formatter: function (params) { |
|||
console.log(params) |
|||
var res = '' |
|||
for (var i = 0; i < params.length; i++) { |
|||
if (params[i].seriesName != "") { |
|||
res += '<p>' + params[0].name + ':' + params[i].data + '</p>' |
|||
} |
|||
} |
|||
return res; |
|||
}, |
|||
}, |
|||
grid: { |
|||
top: '0', |
|||
left: '1%', |
|||
right: '2%', |
|||
bottom: '0', |
|||
containLabel: true |
|||
}, |
|||
yAxis: [ |
|||
{ |
|||
type: 'category', |
|||
axisTick: { |
|||
show: false, |
|||
}, |
|||
splitLine: { |
|||
show: false, |
|||
}, |
|||
axisLine: { |
|||
lineStyle: { |
|||
color: '#323c41' |
|||
} |
|||
}, |
|||
axisLabel: { |
|||
align: 'right', |
|||
textStyle: { |
|||
fontSize: 12, |
|||
color: '#A3B9DA' |
|||
} |
|||
}, |
|||
boundaryGap: true, |
|||
data: xData, |
|||
}, { |
|||
type: 'category', |
|||
data: xData, |
|||
axisTick: { |
|||
show: false, |
|||
}, |
|||
axisLine: {show: false}, |
|||
axisLabel: { |
|||
show: false, |
|||
}, |
|||
boundaryGap: true, |
|||
|
|||
} |
|||
], |
|||
|
|||
xAxis: [ |
|||
{ |
|||
type: 'value', |
|||
splitLine: { |
|||
show: true, |
|||
lineStyle: { |
|||
color: 'rgba(4,187,255,0.18)', |
|||
type: 'dashed' |
|||
}, |
|||
}, |
|||
nameTextStyle: { |
|||
color: '#A3B9DA', |
|||
textStyle: { |
|||
fontSize: 12 |
|||
}, |
|||
align: 'center' |
|||
}, |
|||
axisLabel: { |
|||
show: true, |
|||
color: '#A3B9DA', |
|||
textStyle: { |
|||
fontSize: 12 |
|||
} |
|||
}, |
|||
axisTick: { |
|||
show: false |
|||
} |
|||
} |
|||
], |
|||
series: [ |
|||
{ |
|||
type: 'bar', |
|||
barWidth: 16, |
|||
itemStyle: { |
|||
// lenged文本 |
|||
opacity: 1, // 这个是 透明度 |
|||
color: new echarts.graphic.LinearGradient( |
|||
1, |
|||
0, |
|||
0, |
|||
0, |
|||
[ |
|||
{ |
|||
offset: 0, |
|||
color: '#6EDDFE' // 0% 处的颜色 |
|||
}, |
|||
{ |
|||
offset: 1, |
|||
color: '#0B1F57' // 100% 处的颜色 |
|||
} |
|||
], |
|||
false |
|||
) |
|||
}, |
|||
data: tq, //data.values |
|||
}, |
|||
{ |
|||
name: '', |
|||
type: 'bar', |
|||
|
|||
barWidth: 66, |
|||
barGap: '-60%', |
|||
data: barArray, |
|||
itemStyle: { |
|||
normal: { |
|||
color: 'rgba(89,130,194,0.12)' |
|||
} |
|||
}, |
|||
zlevel: -1, |
|||
yAxisIndex: 1, |
|||
} |
|||
], |
|||
}; |
|||
this.myChart.setOption(option); |
|||
window.addEventListener("resize", () => this.myChart.resize()); |
|||
}, |
|||
} |
|||
} |
|||
</script> |
|||
|
|||
<style scoped lang="scss"> |
|||
.event-statistics { |
|||
padding: 16px 16px; |
|||
} |
|||
</style> |
|||
@ -1,76 +0,0 @@ |
|||
<template> |
|||
<div class="family"> |
|||
<div class="tag"> |
|||
<div>张三(户主)</div> |
|||
<div>入户状态：入户一致</div> |
|||
<div>居民分类：老年人</div> |
|||
</div> |
|||
<div class="tag"> |
|||
<div>张三(户主)</div> |
|||
<div>入户状态：入户一致</div> |
|||
<div>居民分类：老年人</div> |
|||
</div> |
|||
<div class="tag"> |
|||
<div>张三(户主)</div> |
|||
<div>入户状态：入户一致</div> |
|||
</div> |
|||
<div class="tag"> |
|||
<div>张三(户主)</div> |
|||
<div>入户状态：入户一致</div> |
|||
</div> |
|||
</div> |
|||
</template> |
|||
|
|||
<script> |
|||
export default { |
|||
name: "Family" |
|||
} |
|||
</script> |
|||
|
|||
<style scoped lang="scss"> |
|||
.family { |
|||
width: 464px; |
|||
height: 340px; |
|||
background: url('@/assets/images/manyidu/gx_bg.png') no-repeat center; |
|||
position: relative; |
|||
margin: 40px auto; |
|||
} |
|||
.tag { |
|||
font-size: 14px; |
|||
font-weight: 400; |
|||
color: #FFFFFF; |
|||
line-height: 22px; |
|||
padding: 18px 24px; |
|||
box-sizing: border-box; |
|||
position: absolute; |
|||
&:nth-of-type(1), |
|||
&:nth-of-type(2) { |
|||
background: url("@/assets/images/manyidu/gx_big.png") no-repeat center; |
|||
width: 180px; |
|||
height: 100px; |
|||
} |
|||
&:nth-of-type(3), |
|||
&:nth-of-type(4) { |
|||
background: url("@/assets/images/manyidu/gx_small.png") no-repeat center; |
|||
width: 180px; |
|||
height: 70px; |
|||
padding: 15px 24px; |
|||
} |
|||
&:nth-of-type(1) { |
|||
left: -98px; |
|||
top: 34px; |
|||
} |
|||
&:nth-of-type(2) { |
|||
right: -68px; |
|||
top: 34px; |
|||
} |
|||
&:nth-of-type(3) { |
|||
left: -91px; |
|||
bottom: 41px; |
|||
} |
|||
&:nth-of-type(4) { |
|||
right: -44px; |
|||
bottom: 41px; |
|||
} |
|||
} |
|||
</style> |
|||
@ -1,93 +0,0 @@ |
|||
<template> |
|||
<div class="matter-details"> |
|||
<div class="user-img"> |
|||
<img src="@/assets/images/manyidu/dn_bg1.png" alt=""> |
|||
</div> |
|||
<div class="tags"> |
|||
<div class="tag red">满意度风险人员</div> |
|||
<div class="tag small">与子女同住</div> |
|||
<div class="tag">第三网格</div> |
|||
<div class="tag small">入户一致</div> |
|||
<div class="tag">13343999999</div> |
|||
<div class="tag">四季景园1号楼1单元101</div> |
|||
</div> |
|||
</div> |
|||
</template> |
|||
|
|||
<script> |
|||
export default { |
|||
name: "MatterDetails" |
|||
} |
|||
</script> |
|||
|
|||
<style scoped lang="scss"> |
|||
.matter-details { |
|||
width: 607px; |
|||
height: 372px; |
|||
background: url("@/assets/images/manyidu/dn_bg2.png") no-repeat center bottom; |
|||
position: relative; |
|||
margin: 12px auto 60px; |
|||
} |
|||
.user-img { |
|||
position: absolute; |
|||
left: calc(50% - 87px); |
|||
top: calc(50% - 37px); |
|||
} |
|||
.tag { |
|||
position: absolute; |
|||
background: url("@/assets/images/manyidu/dn_big.png") center no-repeat; |
|||
width: 108px; |
|||
height: 107px; |
|||
display: flex; |
|||
align-items: center; |
|||
justify-content: center; |
|||
font-size: 14px; |
|||
font-weight: 400; |
|||
color: #FFFFFF; |
|||
line-height: 16px; |
|||
box-sizing: border-box; |
|||
padding: 24px; |
|||
text-align: center; |
|||
word-break: break-all; |
|||
&.small { |
|||
width: 89px; |
|||
height: 89px; |
|||
background: url("@/assets/images/manyidu/dn_small.png") center no-repeat; |
|||
padding: 16px; |
|||
} |
|||
&.red { |
|||
background: url("@/assets/images/manyidu/dn_red.png") center no-repeat; |
|||
color: #FE0000; |
|||
} |
|||
&:nth-of-type(1) { |
|||
left: 0; |
|||
bottom: 15px; |
|||
} |
|||
|
|||
&:nth-of-type(2) { |
|||
left: 42px; |
|||
bottom: 185px; |
|||
} |
|||
|
|||
&:nth-of-type(3) { |
|||
left: 194px; |
|||
bottom: 245px; |
|||
} |
|||
|
|||
&:nth-of-type(4) { |
|||
left: 384px; |
|||
bottom: 240px; |
|||
} |
|||
|
|||
&:nth-of-type(5) { |
|||
left: 499px; |
|||
bottom: 157px; |
|||
} |
|||
|
|||
&:nth-of-type(6) { |
|||
left: 453px; |
|||
bottom: 10px; |
|||
} |
|||
} |
|||
|
|||
</style> |
|||
@ -1,51 +0,0 @@ |
|||
<template> |
|||
<div> |
|||
<div class="enjoy-service"> |
|||
<div class="enjoy-service-item" v-for="(item,index) in 5"> |
|||
<div class="num">+10</div> |
|||
<div class="info"> |
|||
<div class="title">便民服务-配餐服务</div> |
|||
<div class="time">2023-07-15 15:30:30</div> |
|||
</div> |
|||
</div> |
|||
</div> |
|||
</div> |
|||
</template> |
|||
|
|||
<script> |
|||
export default { |
|||
name: "PointsRecord" |
|||
} |
|||
</script> |
|||
|
|||
<style scoped lang="scss"> |
|||
|
|||
.enjoy-service { |
|||
padding-left: 26px; |
|||
} |
|||
.enjoy-service-item { |
|||
color: #FFFFFF; |
|||
display: flex; |
|||
padding: 14px 16px 14px; |
|||
margin-bottom: 8px; |
|||
background: #07266B; |
|||
.num { |
|||
font-size: 24px; |
|||
font-weight: 500; |
|||
line-height: 22px; |
|||
} |
|||
.info { |
|||
font-size: 14px; |
|||
margin-left: 40px; |
|||
.title { |
|||
font-weight: 500; |
|||
margin-bottom: 10px; |
|||
} |
|||
.time { |
|||
font-weight: 400; |
|||
color: #A3B9DA; |
|||
} |
|||
} |
|||
} |
|||
|
|||
</style> |
|||
File diff suppressed because it is too large
Loading…
Reference in new issue