办事进度

This commit is contained in:
shijingjing
2022-05-19 16:12:11 +08:00
parent c3ce556dc4
commit 4ac2be55fa
4 changed files with 553 additions and 114 deletions

View File

@@ -0,0 +1,339 @@
<template>
<div class="SelectUser">
<div class="header-middle">
<div class="hint">
<span v-for="(item, index) in slectList" :key="index"><span v-if="index" style="margin:0 4px;">/</span><span style="color:#3F8DF5" @click="girdNameClick(item, index)">{{item.girdName}}</span></span>
</div>
<div class="showTypes" v-if="!userList.length">
<div v-if="treeList.length > 0">
<div class="cards" v-for="(item, index) in treeList" :key="index" @click="itemClick(item)">
<div class="imges">
<span v-if="item.girdLevel == 2">
<img src="./components/img/xzh.png" alt="" class="imgselect" v-if="item.isChecked" @click.stop="girdClick(item, index)" />
<img src="./components/img/xz.png" alt="" class="imgselect" v-else @click.stop="girdClick(item, index)" />
</span>
<img src="./components/img/gird--select-icon.png" alt="" class="avatras" />
</div>
<div class="rightes">
<div class="applicationNames">{{ item.girdName }}</div>
<img src="./components/img/right-icon.png" alt="" class="imgs" />
</div>
</div>
</div>
<AiEmpty description="暂无数据" class="emptyWrap" v-else></AiEmpty>
</div>
<div class="showUsers" v-else>
<div v-if="userList.length > 0">
<div class="cards" v-for="(e, index) in userList" :key="index">
<div class="imges">
<img src="./components/img/xzh.png" alt="" class="imgselect" v-if="e.isChecked" @click="userClick(e, index)" />
<img src="./components/img/xz.png" alt="" class="imgselect" v-else @click="userClick(e, index)" />
<img src="./components/img/tx@2x.png" alt="" class="avatras" />
</div>
<div class="rights">
<div class="applicationNames">{{ e.name }}</div>
<div class="idNumbers">{{ e.phone }}</div>
</div>
</div>
</div>
<AiEmpty description="暂无数据" class="emptyWrap" v-else></AiEmpty>
</div>
</div>
<div class="subBtn" @click="submit">
<div>确定选择</div>
</div>
</div>
</template>
<script>
export default {
name: 'SelectUser',
data() {
return {
selectUser: {},
allData: null,
treeList: [],
slectList: [],
userList: [],
}
},
onLoad() {
this.getTree()
},
onShow() {
document.title = '选择人员'
},
methods: {
getTree() {
this.slectList = []
this.$http.post('/app/appgirdinfo/listAllByTop').then((res) => {
if (res?.data) {
this.allData = res.data
this.treeInit()
}
})
},
treeInit() {
if(this.allData[0].girdLevel == 2) {
if(this.allData[0].girdMemberList && this.allData[0].girdMemberList.length) {
this.userList = this.allData[0].girdMemberList
this.userList.map((item) => {
item.isChecked = false
})
}
}else {
this.treeList = this.allData[0].girdList
}
var obj = {
girdName: this.allData[0].girdName,
id: this.allData[0].id,
girdLevel: this.allData[0].girdLevel
}
this.slectList.push(obj)
},
itemClick(row) {
console.log(row)
var obj = {
girdName: row.girdName,
id: row.id,
girdLevel: row.girdLevel
}
this.slectList.push(obj)
this.searckGird(row)
},
searckGird(row) {
this.treeList = []
if(row.girdLevel != 2) { //查网格
this.$http.post(`/app/appgirdinfo/list?parentGirdId=${row.id}&size=999`).then((res) => {
if (res?.data) {
this.treeList = res.data.records
}
})
}else { //查网格员
this.userList = []
this.$http.post(`/app/appgirdmemberinfo/listByGirdIdByThree?girdId=${row.id}`).then((res) => {
if (res?.data) {
this.userList = res.data
this.userList.map((item) => {
item.isChecked = false
})
}
})
}
},
girdNameClick(row, index) {
this.userList = []
if(!index) { //第一级别
this.slectList = []
this.treeInit()
}else {
var list = []
this.slectList.map((item, i) => {
if(i <= index) {
list.push(item)
}
})
this.slectList = list
this.searckGird(row)
}
},
girdClick(row, index) {
if (this.treeList[index].isChecked) {//取消
this.treeList[index].isChecked = false
this.selectUser = {}
} else {
this.treeList.map((item) => {
item.isChecked = false
})
this.treeList[index].isChecked = true
this.selectUser = row
}
this.$forceUpdate()
},
userClick(row, index) {
if (this.userList[index].isChecked) {//取消
this.userList[index].isChecked = false
this.selectUser = {}
} else {
this.userList.map((item) => {
item.isChecked = false
})
this.userList[index].isChecked = true
this.selectUser = row
}
this.$forceUpdate()
},
submit() {
if (this.selectUser.id != null) {
uni.$emit('goback', this.selectUser)
uni.navigateBack()
} else {
return this.$u.toast('请选择网格或网格员')
}
},
}
}
</script>
<style scoped lang="scss">
.SelectUser {
height: 100%;
background: #fff;
.header-top {
background: #fff;
padding: 20px 32px;
}
.header-middle {
padding-bottom: 140px;
.hint {
padding: 28px 20px 28px 32px;
line-height: 56px;
box-shadow: 0px 1px 0px 0px #e4e5e6;
font-size: 30px;
font-weight: 500;
word-break: break-all;
}
.showTypes {
.empty-div {
height: 16px;
background: #f5f5f5;
}
.cards {
display: flex;
align-items: center;
height: 120px;
line-height: 120px;
// background: pink;
padding: 0 0 0 32px;
.imges {
display: flex;
align-items: center;
// width: 200px;
.imgselect {
width: 48px;
height: 48px;
vertical-align: middle;
}
.avatras {
width: 74px;
height: 74px;
border-radius: 8px;
margin-left: 36px;
}
}
img {
width: 74px;
height: 74px;
border-radius: 8px;
}
.rightes {
width: 100%;
display: flex;
justify-content: space-between;
align-items: center;
margin-left: 32px;
border-bottom: 1px solid #e4e5e6;
.applicationNames {
font-size: 36px;
font-weight: 500;
color: #333333;
}
.imgs {
width: 40px;
height: 40px;
margin-right: 20px;
}
}
}
}
.showUsers {
.cards {
display: flex;
align-items: center;
height: 120px;
line-height: 120px;
// background: pink;
padding: 0 0 0 32px;
.imges {
display: flex;
align-items: center;
width: 200px;
.imgselect {
width: 48px;
height: 48px;
}
.avatras {
width: 74px;
height: 74px;
border-radius: 8px;
margin-left: 36px;
}
}
.rights {
width: 100%;
display: flex;
justify-content: space-between;
align-items: center;
margin-left: 32px;
border-bottom: 1px solid #e4e5e6;
padding-right: 40px;
.applicationNames {
font-size: 36px;
font-weight: 500;
color: #333333;
}
.idNumbers {
color: #666;
}
}
}
}
}
.subBtn {
position: fixed;
bottom: 0;
left: 0;
width: 100%;
height: 118px;
background: #f4f8fb;
div {
width: 192px;
height: 80px;
line-height: 80px;
text-align: center;
background: #1365dd;
border-radius: 4px;
font-size: 32px;
color: #fff;
margin: 20px 34px 0 0;
float: right;
}
}
}
</style>

View File

@@ -60,7 +60,7 @@
<div class="cardss"> <div class="cardss">
<div class="cardss-left"> <div class="cardss-left">
<span> <span>
{{ item.girdMemberName && item.girdMemberName.substring(item.girdMemberName.length, item.girdMemberName.length - 2) }} {{ item.doUsername && item.doUsername.substring(item.doUsername.length, item.doUsername.length - 2) }}
</span> </span>
<img src="./components/1.png" class="avatarIcon" alt="" /> <img src="./components/1.png" class="avatarIcon" alt="" />
@@ -69,9 +69,9 @@
<div class="cardss-right"> <div class="cardss-right">
<div class="cardsss-right-left"> <div class="cardsss-right-left">
<div class="cardssss-right-left-top"> <div class="cardssss-right-left-top">
<span>{{ item.systemExplain }}</span> <span>{{ item.description }}</span>
<div style="color: #2ea222; font-size: 16px; margin-top: 5px"> <div style="color: #2ea222; font-size: 16px; margin-top: 5px">
{{ $dict.getLabel('clapDoStatus', item.doStatus) }} {{ $dict.getLabel('helpDeclarationStatus', item.status) }}
</div> </div>
</div> </div>
</div> </div>
@@ -106,7 +106,7 @@
<div class="endDoIt" v-if="data.eventStatus == 1 && data.rightType == 0" @click="toContent(3)">前往办理</div> <div class="endDoIt" v-if="data.eventStatus == 1 && data.rightType == 0" @click="toContent(3)">前往办理</div>
</div> </div>
<u-modal v-model="doItShow" :mask-close-able="true" z-index="99" content="确定处理该事件?" :show-cancel-button="true" @confirm="doThings"></u-modal>
</div> </div>
</template> </template>
@@ -117,6 +117,7 @@ export default {
list: [], list: [],
data: {}, data: {},
id: '', id: '',
doItShow: false,
} }
}, },
onLoad(o) { onLoad(o) {
@@ -141,6 +142,9 @@ export default {
current: img current: img
}) })
}, },
toContent(status) {
uni.navigateTo({ url: `./result?status=${status}` })
},
} }
} }
</script> </script>

View File

@@ -42,9 +42,12 @@
</div> </div>
<AiEmpty v-else description="暂无数据"/> <AiEmpty v-else description="暂无数据"/>
<AiFixedBtn> <!-- <AiFixedBtn>
<div class="addBtn iconfont iconfont-iconfangda" @tap="toAdd()"/> <div class="addBtn iconfont iconfont-iconfangda" @tap="toAdd()"/>
</AiFixedBtn> </AiFixedBtn> -->
<div style="height: 56px"></div>
<div class="btn" @click="toAdd">申请帮扶</div>
</div> </div>
</template> </template>
@@ -110,7 +113,6 @@ export default {
<style lang="scss" scoped> <style lang="scss" scoped>
.list { .list {
// padding-top: 24px;
::v-deep .AiTopFixed .content { ::v-deep .AiTopFixed .content {
padding: 0; padding: 0;
} }
@@ -214,5 +216,17 @@ export default {
} }
} }
} }
.btn {
position: fixed;
left: 0;
bottom: 0;
width: 100%;
height: 112px;
line-height: 112px;
text-align: center;
color: #FFF;
background: #3975C6;
}
} }
</style> </style>

View File

@@ -1,38 +1,41 @@
<template> <template>
<div class="result" showPage='false'> <div class="result">
<div class="contents">
<div class="type"> <u-form :model="forms" ref="uForm" label-width="auto" :border-bottom="false">
<div class="left"> <u-form-item label="转交给" prop="status" required :border-bottom="false" right-icon="arrow-right" class="first-form" v-if="status == 1">
<span>*</span> <u-input v-model="forms.name" placeholder="请选择转交对象" @click="toSelectUser" disabled />
<span v-if="checkType == 1">处理意见</span> </u-form-item>
<span v-if="checkType == 2">处理结果</span> <u-form-item label="事件分类" prop="groupName" required :border-bottom="false" right-icon="arrow-right" v-if="status != 1">
</div> <!-- <u-input v-model="forms.groupName" placeholder="请选择事件分类" /> -->
<div class="right"> <span @click="show = true" class="right-span" :style="forms.groupName ? '' : 'color:#999;'">{{forms.groupName || '请选择事件分类'}}</span>
<AiSelect v-model="operation" dict="fpRiskPersonOperation1" v-if="checkType == 1" />
<AiSelect v-model="operation" dict="fpRiskPersonOperation2" v-if="checkType == 2" /> <u-select v-model="show" :list="myList" value-name="id" label-name="groupName" @confirm="selectStatus"></u-select>
</div> </u-form-item>
<u-form-item :label="status == 3 ? '办结意见' : status == 2 ? '拒绝受理意见' : '办理意见'" prop="content" required :border-bottom="false" label-position="top" class="contents">
<u-input v-model="forms.content" :placeholder="status == 2 ? '请写下拒绝受理意见…' : '请写下你的办结意见...'" type="textarea" auto-height height="100" maxlength="500" />
</u-form-item>
<div class="line"></div>
<u-form-item label="图片上传(最多9张)" prop="files" :border-bottom="false" class="avatars" label-position="top">
<AiUploader :def.sync="forms.files" multiple placeholder="上传图片" :limit="9" action="/admin/file/add2"></AiUploader>
</u-form-item>
</u-form>
</div> </div>
<div class="remark"> <div class="btn" v-if="this.status == 1" @click="confirm">
<div class="top"> <span>转交事件</span>
<span>*</span><span>备注说明</span>
</div>
<div class="bottom">
<u-input type="textarea" v-model="opinion" placeholder="请简要说明情况" maxlength="500" height="200"/>
</div>
</div> </div>
<div class="picture"> <div class="btn" v-if="this.status == 2" @click="confirm">
<div class="top"> <span>拒绝受理</span>
<span style="margin-right: 8px"></span><span>图片<span style="color: #999;font-size:14px;">最多9张</span></span>
</div>
<div class="bottom">
<AiUploader :def.sync="files" multiple placeholder="上传图片" :limit="9" action="/admin/file/add2"></AiUploader>
</div>
</div> </div>
<div class="btn" @click="submit">提交</div> <div class="btn" v-if="this.status == 3" @click="confirm">
<span>我已办结</span>
</div>
</div> </div>
</template> </template>
@@ -40,111 +43,190 @@
export default { export default {
data() { data() {
return { return {
operation: '', forms: {
opinion: '', groupName: '',
checkType: '', groupId: '',
files: [], content: '',
showPage: false, files: [],
id:'' name: ''
},
flag: false,
show: false,
status: '', //1转交 2拒绝受理 3我已办结
myList: [],
id: '',
selectUser: {},
titleList: ['', '转交事件', '拒绝受理', '我已办结']
} }
}, },
onLoad(o) { onLoad(option) {
this.$dict.load('fpRiskPersonOperation1','fpRiskPersonOperation2','fpRiskType').then(()=>{ this.status = option.status
this.checkType = o.checkType this.id = option.id
this.id = o.id this.forms.groupId = option.groupId
this.showPage = true this.forms.groupName = option.groupName
this.typeList()
uni.$on('goback', (res) => {
this.selectUser = res
if(res.name) {
this.forms.name = res.name
}else{
this.forms.name = res.girdName
}
}) })
}, },
onShow() {
console.log(this.titleList[this.status])
document.title = this.titleList[this.status]
},
methods: { methods: {
submit() {
typeList() {
if(!this.operation) { this.$http.post(`/app/appclapeventgroup/list`, null, {
return this.$u.toast('请选择处理意见') params: {
} size: 9999,
if(!this.opinion) { },
return this.$u.toast('请输入备注说明') })
} .then((res) => {
let ids = [];
ids.push(this.id);
this.$http.post('/app/apppreventionreturntopovertyriskperson/monitor',{
operation: this.operation,
opinion: this.opinion,
files: this.files,
ids: ids,
}).then(res => {
if (res.code == 0) { if (res.code == 0) {
this.$u.toast('提交成功') this.myList = res.data.records
uni.$emit('update') this.$forceUpdate()
}
})
},
confirm() {
if(this.status == 1 && !this.forms.name) {
return this.$u.toast('请选择转交对象')
}
if(this.status != 1 && !this.forms.groupName) {
return this.$u.toast('请选择分类')
}
if(this.status != 1 && !this.forms.content) {
return this.$u.toast('请输入意见')
}
this.submit()
},
submit() { //status 1转交 2拒绝受理 3我已办结
var url = '', successText= '', params= ''
if(this.status == 1) {
url = `/app/appclapeventinfo/transfer`
successText = '转交成功'
params = {
...this.forms,
girdId: this.selectUser.id,
girdName: this.selectUser.girdName,
}
if(this.selectUser.name) { //选择的网格员
params.girdId = this.selectUser.girdId
params.girdMemberId = this.selectUser.id
params.girdMemberName = this.selectUser.name
}
}
if(this.status == 2) {
url = `/app/appclapeventinfo/refuse`
successText = '拒绝成功'
params = {...this.forms}
}
if(this.status == 3) {
url = `/app/appclapeventinfo/finishByGirdMember`
successText = '办结成功'
params = {...this.forms}
}
params.id = this.id
this.$http.post(url, params).then((res) => {
if (res.code == 0) {
this.$u.toast(successText)
uni.$emit('updateDeatil')
uni.$emit('getListInit')
setTimeout(() => { setTimeout(() => {
uni.navigateBack({delta: 2}) if(this.status == 1) {
uni.navigateBack({delta: 2})
}else {
uni.navigateBack()
}
},600) },600)
} }
}) })
} },
selectStatus(e) {
this.forms.groupName = e[0].label
this.forms.groupId = e[0].value
},
toSelectUser() {
uni.navigateTo({ url: './SelectUser' })
},
}, },
onShow() {
document.title = this.checkType == 1? "处理意见":this.checkType == 2? "处理结果": ''
}
} }
</script> </script>
<style lang="scss" scoped> <style scoped lang="scss">
.result { .result {
padding-bottom: 112px; height: 100%;
::v-deep .ai-uploader .fileList .default { .contents {
width: 160px; padding-bottom: 140px;
height: 160px; ::v-deep .u-form {
} .u-form-item {
.type { padding: 0 45px !important;
height: 112px; .u-form-item__body {
line-height: 112px; .u-form-item--right__content__slot {
background: #FFF; padding-bottom: 0;
font-size: 32px; .u-input {
display: flex; text-align: right !important;
justify-content: space-between; }
padding: 0 32px; }
box-sizing: border-box; }
.left {
span:first-child {
color: #FF4466;
} }
span:last-child {
color: #333333; .u-form-item:first-child {
.u-form-item__body {
border-bottom: 1px solid #ddd;
}
} }
}
} .line {
.remark, height: 24px;
.picture { background: #f3f6f9;
box-sizing: border-box;
margin-top: 16px;
background: #FFF;
padding: 0 32px;
font-size: 32px;
.top {
padding-top: 20px;
span:first-child {
color: #FF4466;
} }
span:last-child {
color: #333333; .contents {
padding-bottom: 20px !important;
.u-form-item__body {
.u-form-item--right__content__slot {
.u-input {
text-align: left !important;
}
}
}
}
.avatars {
padding-bottom: 20px !important;
.u-form-item__body {
.default {
width: 160px;
height: 160px;
}
}
} }
}
.bottom {
padding: 30px 0;
} }
} }
.btn { .btn {
height: 112px;
line-height: 112px;
text-align: center;
background: #3192F4;
color: #FFF;
position: fixed; position: fixed;
bottom: 0; bottom: 0;
left: 0;
width: 100%; width: 100%;
box-sizing: border-box;
background: #3975c6;
padding: 34px 0;
text-align: center;
font-size: 32px; font-size: 32px;
font-weight: 500;
color: #ffffff;
}
.right-span{
display: inline-block;
width: 100%;
text-align: right;
} }
} }
</style> </style>