296 lines
7.6 KiB
Vue
296 lines
7.6 KiB
Vue
<template>
|
||
<div class="helpDetail">
|
||
<AiTopFixed>
|
||
<u-tabs :list="tabList" :is-scroll="false" :current="currentTabs" height="96" bar-width="150" @change="change"></u-tabs>
|
||
</AiTopFixed>
|
||
|
||
<div class="tab-content" v-show="currentTabs === 0">
|
||
<div class="tab-content__item">
|
||
<div class="log-item" v-for="(item, index) in helpList" :key="index">
|
||
<div class="log-item__wrapper">
|
||
<div class="log-item__user">
|
||
<div class="left">
|
||
<div class="user">
|
||
<span>{{ item.createUserName.substr(item.createUserName.length - 2) }}</span>
|
||
</div>
|
||
<h2>{{ item.createUserName }}</h2>
|
||
</div>
|
||
<div class="right">
|
||
<span>{{ item.createTime }}</span>
|
||
<u-icon name="list" color="#999" size="28" @click="edit(item.id, '1')" style="margin-left:16px;" v-if="item.createUserId == user.id"></u-icon>
|
||
</div>
|
||
</div>
|
||
<p style="color: #999999;">帮扶措施：{{ $dict.getLabel('fpAssistanceMeasures',item.operationDesc) }}</p>
|
||
<p>{{ item.detail }}</p>
|
||
<div class="imgs" v-if="item.files && item.files.length">
|
||
<image :src="img.url" @click="prevImg(item.files, img.url)" v-for="(img, index) in item.files"
|
||
:key="index"/>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
<AiEmpty v-if="!helpList.length" style="padding-bottom: 20px;"></AiEmpty>
|
||
</div>
|
||
</div>
|
||
|
||
<div class="tab-content__item" v-show="currentTabs == 1">
|
||
<div class="log-item" v-for="(item, index) in logList" :key="index">
|
||
<div class="log-item__wrapper">
|
||
<div class="log-item__user">
|
||
<div class="left">
|
||
<div class="user">
|
||
<span>{{ item.createUserName.substr(item.createUserName.length - 2) }}</span>
|
||
</div>
|
||
<h2>{{ item.createUserName }}</h2>
|
||
</div>
|
||
<div class="right">
|
||
<span>{{ item.createTime }}</span>
|
||
<u-icon name="list" color="#999" size="28" @click="edit(item.id, '0')" style="margin-left:16px;" v-if="item.createUserId == user.id && item.operationDesc == '走访排查'"></u-icon>
|
||
</div>
|
||
</div>
|
||
<p style="color: #999999;">操作类型：{{ item.operationDesc }}</p>
|
||
<p>{{ item.detail }}</p>
|
||
<div class="imgs" v-if="item.files && item.files.length">
|
||
<image :src="img.url" @click="prevImg(item.files, img.url)" v-for="(img, index) in item.files"
|
||
:key="index"/>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
<AiEmpty v-if="!logList.length" style="padding-bottom: 20px;"></AiEmpty>
|
||
</div>
|
||
|
||
<AiFixedBtn v-if="currentTabs === 0">
|
||
<div class="addBtn iconfont iconfont-iconfangda" @tap="toAddLog('1')" v-if="$permissions('app_apppreventionreturntopovertylog_edit')"></div>
|
||
</AiFixedBtn>
|
||
<!-- 走访日志0 帮扶措施1 -->
|
||
<AiFixedBtn v-if="currentTabs === 1">
|
||
<div class="addBtn iconfont iconfont-iconfangda" @tap="toAddLog('0')"></div>
|
||
</AiFixedBtn>
|
||
</div>
|
||
</template>
|
||
|
||
<script>
|
||
import {mapState} from 'vuex'
|
||
export default {
|
||
name: 'helpDetail',
|
||
data() {
|
||
return {
|
||
tabList: [
|
||
{
|
||
name: '帮扶措施',
|
||
},
|
||
{
|
||
name: '走访日志',
|
||
}
|
||
],
|
||
currentTabs: 0,
|
||
helpList: [],
|
||
logList: [],
|
||
id: '',
|
||
}
|
||
},
|
||
computed: {
|
||
...mapState(['user'])
|
||
},
|
||
onLoad(o) {
|
||
this.id = o.id
|
||
this.$dict.load('fpAssistanceMeasures')
|
||
},
|
||
methods: {
|
||
change(index) {
|
||
this.currentTabs = index
|
||
if(index == 0) {
|
||
this.getHelpList()
|
||
} else if(index == 1) {
|
||
this.getLogList()
|
||
}
|
||
},
|
||
getHelpList() {
|
||
this.$http.post(`/app/apppreventionreturntopovertylog/list?pid=${this.id}&size=1000¤t=1&type=1`).then(res => {
|
||
if (res.code === 0) {
|
||
this.helpList = res.data.records || []
|
||
}
|
||
})
|
||
},
|
||
getLogList() {
|
||
this.$http.post(`/app/apppreventionreturntopovertylog/list?pid=${this.id}&size=1000¤t=1&type=0`).then(res => {
|
||
if (res.code === 0) {
|
||
this.logList = res.data.records || []
|
||
}
|
||
})
|
||
},
|
||
toAddLog(type) {
|
||
uni.navigateTo({
|
||
url: `./addLog?pid=${this.id}&type=${type}`
|
||
})
|
||
},
|
||
|
||
prevImg(urls, img) {
|
||
const imgs = urls.map(v => v.url)
|
||
uni.previewImage({
|
||
urls: imgs,
|
||
current: img
|
||
})
|
||
},
|
||
|
||
edit(id,type) {
|
||
uni.showActionSheet({
|
||
itemList: ['编辑', '删除'],
|
||
success: res => {
|
||
if (res.tapIndex === 0) {
|
||
if (type === 0) {
|
||
uni.navigateTo({
|
||
url: `./addLog?pid=${this.id}&id=${id}&type=0`
|
||
})
|
||
} else {
|
||
uni.navigateTo({
|
||
url: `./addLog?pid=${this.id}&id=${id}&type=1`
|
||
})
|
||
}
|
||
|
||
} else if (res.tapIndex === 1) {
|
||
this.$confirm('确定删除该数据？').then(() => {
|
||
uni.showLoading()
|
||
this.$http.post(`/app/apppreventionreturntopovertylog/delete?ids=${id}`).then(res => {
|
||
if (res.code === 0) {
|
||
this.$u.toast('删除成功')
|
||
if(type == 1) {
|
||
this.getHelpList()
|
||
} else if(type == 0) {
|
||
this.getLogList()
|
||
}
|
||
}
|
||
uni.hideLoading()
|
||
})
|
||
}).catch(() => {
|
||
})
|
||
}
|
||
}
|
||
})
|
||
},
|
||
|
||
|
||
|
||
|
||
|
||
|
||
|
||
},
|
||
onShow() {
|
||
document.title = '帮扶情况'
|
||
if(this.id) {
|
||
if(this.currentTabs==0) {
|
||
this.getHelpList()
|
||
} else if (this.currentTabs ==1) {
|
||
this.getLogList()
|
||
}
|
||
|
||
}
|
||
}
|
||
}
|
||
</script>
|
||
|
||
<style lang="scss" scoped>
|
||
.helpDetail {
|
||
::v-deep .AiTopFixed .content{
|
||
padding: 0;
|
||
}
|
||
|
||
.log-item {
|
||
padding: 0 0 0 32px;
|
||
background: #fff;
|
||
|
||
&:first-child {
|
||
margin-top: 16px;
|
||
}
|
||
|
||
&:last-child {
|
||
.log-item__wrapper {
|
||
border: none !important;
|
||
}
|
||
}
|
||
|
||
.log-item__wrapper {
|
||
padding: 32px 32px 32px 0;
|
||
border-bottom: 1px solid #E4E5E6;
|
||
|
||
.log-item__user {
|
||
display: flex;
|
||
align-items: center;
|
||
justify-content: space-between;
|
||
|
||
& > div {
|
||
display: flex;
|
||
align-items: center;
|
||
}
|
||
|
||
.left {
|
||
.user, image {
|
||
width: 80px;
|
||
height: 80px;
|
||
line-height: 80px;
|
||
margin-right: 16px;
|
||
text-align: center;
|
||
border-radius: 50%;
|
||
background: #2266FF;
|
||
|
||
span {
|
||
color: #fff;
|
||
font-size: 28px;
|
||
}
|
||
}
|
||
|
||
h2 {
|
||
color: #333;
|
||
font-size: 32px;
|
||
}
|
||
}
|
||
|
||
.right {
|
||
image {
|
||
width: 32px;
|
||
height: 32px;
|
||
}
|
||
|
||
span {
|
||
margin-right: 6px;
|
||
color: #999999;
|
||
font-size: 28px;
|
||
}
|
||
}
|
||
}
|
||
|
||
p {
|
||
margin: 4px 0 16px 96px;
|
||
color: #343D65;
|
||
font-size: 28px;
|
||
}
|
||
|
||
.imgs {
|
||
margin-left: 96px;
|
||
|
||
image {
|
||
width: 136px;
|
||
height: 136px;
|
||
margin-right: 8px;
|
||
margin-bottom: 8px;
|
||
}
|
||
}
|
||
}
|
||
}
|
||
|
||
|
||
.addBtn {
|
||
width: 96px;
|
||
height: 96px;
|
||
flex-shrink: 0;
|
||
background: $uni-color-primary;
|
||
box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2);
|
||
font-size: 48px;
|
||
color: #fff;
|
||
border-radius: 50%;
|
||
justify-content: center;
|
||
align-items: center;
|
||
display: flex;
|
||
}
|
||
}
|
||
</style> |