Files
dvcp_v2_wxcp_app/library/apps/AppFourNeighbor/Detail.vue
2024-10-31 14:34:57 +08:00

155 lines
3.4 KiB
Vue

<template>
<div class="detail">
<div class="flex mar-b16">
<div class="label">审核状态</div>
<div class="value" :class="`status${form.status}`">{{$dict.getLabel('partyFourLinkageStatus', form.status)}}</div>
</div>
<div class="flex mar-b16">
<div class="label">党员信息</div>
<div class="value">{{form.partyName}}</div>
</div>
<div class="flex mar-b16">
<div class="label">四邻对象</div>
<div class="value">{{form.residentName}}</div>
</div>
<div class="flex mar-b16">
<div class="label">事件日期</div>
<div class="value">{{form.linksageDate}}</div>
</div>
<div class="flex">
<div class="label">事件描述</div>
</div>
<div class="content mar-b16">{{form.description}}</div>
<div class="flex" v-if="form.status == 2">
<div class="label">审核意见</div>
</div>
<div class="content" v-if="form.status == 2">{{form.remark}}</div>
<div class="footer" v-if="form.status == 0">
<div @click="toContent">审核不通过</div>
<div class="btn" @click="pass">审核通过</div>
</div>
</div>
</template>
<script>
import {mapState} from "vuex";
export default {
name: 'detail',
data() {
return {
id: '',
form: {}
}
},
computed: {
...mapState(['user']),
},
onLoad(option) {
this.id = option.id
this.$dict.load('partyFourLinkageStatus').then(() => {
this.getDetail()
})
uni.$on('reload', () => {
this.getDetail()
})
},
onShow() {
document.title = '四邻联动'
},
methods: {
toContent() {
uni.navigateTo({url: `./Content?id=${this.id}`})
},
getDetail() {
this.$http.post(`/app/apppartyfourlinkage/queryDetailById?id=${this.id}`).then((res) => {
if (res.code == 0) {
this.form = res.data
}
})
},
pass() {
this.$confirm('是否确认审核通过?').then(() => {
this.$http.post(`/app/apppartyfourlinkage/auditById?id=${this.id}&status=1`).then((res) => {
if (res.code == 0) {
this.$u.toast('审核成功')
uni.$emit('reload')
setTimeout(() => {
uni.navigateBack({
delta: 1
})
}, 600)
}
})
})
}
},
}
</script>
<style lang="scss" scoped>
.detail {
.flex{
display: flex;
justify-content: space-between;
padding: 34px 32px 34px 32px;
font-size: 32px;
font-family: PingFangSC-Regular, PingFang SC;
color: #333;
line-height: 44px;
background-color: #fff;
.label{
width: 150px;
}
}
.mar-b16{
margin-bottom: 16px;
}
.content{
width: 100%;
padding: 0 32px 32px;
background-color: #fff;
box-sizing: border-box;
font-size: 32px;
font-family: PingFangSC-Regular, PingFang SC;
color: #333;
line-height: 44px;
word-break: break-all;
}
.footer {
width: 100%;
position: fixed;
bottom: 0;
left: 0;
display: flex;
background: #fff;
color: #f46;
div{
flex: 1;
height: 112px;
line-height: 112px;
text-align: center;
font-size: 32px;
font-family: PingFangSC-Medium, PingFang SC;
font-weight: 500;
}
.btn {
background: #3975C6;
color: #fff;
}
}
.status0{
color: #FF883C;
}
.status1{
color: #2EA222;
}
.status2{
color: #F46;
}
}
</style>