6 changed files with 386 additions and 13 deletions
@ -0,0 +1,46 @@
|
||||
.body-background{ |
||||
background: { |
||||
color:#F5F5F6; |
||||
}; |
||||
height:100vh; |
||||
} |
||||
.app-wallpaper{ |
||||
padding:16rpx 26rpx; |
||||
.leave-tab{ |
||||
background-color: #fff; |
||||
border-top-left-radius: 20rpx; |
||||
border-top-right-radius: 20rpx; |
||||
padding-bottom:15rpx; |
||||
border-bottom:2rpx solid #f5f5f6; |
||||
} |
||||
.leave-advisor-tab{ |
||||
background-color: #fff; |
||||
border-radius: 20rpx; |
||||
padding-bottom:15rpx; |
||||
border-bottom:2rpx solid #f5f5f6; |
||||
margin-bottom:16rpx; |
||||
} |
||||
.leave-content{ |
||||
.leave-item{ |
||||
margin-bottom:8rpx; |
||||
background-color:#fff; |
||||
padding:0 30rpx; |
||||
.icon{ |
||||
flex: 0 0 64rpx; |
||||
} |
||||
.body{ |
||||
padding:0 18rpx; |
||||
} |
||||
} |
||||
.ask{ |
||||
padding:18rpx 0; |
||||
border-bottom: 2rpx solid #f5f5f6; |
||||
} |
||||
.answer{ |
||||
padding:24rpx 0; |
||||
} |
||||
.ask{ |
||||
padding:30rpx 0 22rpx 0; |
||||
} |
||||
} |
||||
} |
||||
@ -0,0 +1,186 @@
|
||||
<template> |
||||
<view class="body-background"></view> |
||||
<u-navbar |
||||
:title="title" |
||||
:auto-back="true" |
||||
left-icon-size="40rpx" |
||||
:safe-area-inset-top="true" |
||||
:placeholder="true" |
||||
bgColor="#ffffff" |
||||
></u-navbar> |
||||
<view class="app-wallpaper"> |
||||
<mz-sticky type="sticky"> |
||||
<view class="leave-tab"> |
||||
|
||||
<u-tabs |
||||
:list="listItem" |
||||
u-sticky |
||||
lineWidth="40" |
||||
lineHeight="4" |
||||
:inactiveStyle="{color:'#AFB5BE'}" |
||||
:activeStyle="{color:'#F47210'}" |
||||
lineColor="#F47210" |
||||
:custom-style="{margin:'auto',width:'100%'}" |
||||
:scrollable="false" |
||||
:current="current" |
||||
@change="tabsChange" |
||||
></u-tabs> |
||||
</view> |
||||
</mz-sticky> |
||||
|
||||
<view class="leave-content"> |
||||
<view class="leave-item" v-for="item in lists"> |
||||
<view class="ask row"> |
||||
<view class="icon"> |
||||
<u-text text="建议：" size="32" color="#178AF2" line-height="50rpx" custom-style="white-space:nowrap;"></u-text> |
||||
</view> |
||||
<view class="body col"> |
||||
<view class="name"> |
||||
<u-text line-height="50" :text="item.street + ' ' + item.community" size="32" color="#020b18"></u-text> |
||||
</view> |
||||
<view class="content"> |
||||
<u-text line-height="50" :text="item.remark" size="28" color="#020b18"></u-text> |
||||
</view> |
||||
<view class="" v-if="item.path?.length > 0"> |
||||
<u-album multipleSize="170rpx" space="16rpx" :urls="item.path" key-name="url" custom-style="border-radius:8rpx;"></u-album> |
||||
</view> |
||||
</view> |
||||
</view> |
||||
<view class="answer row" v-if="item.status === 2"> |
||||
<view class="row"> |
||||
<u-text text="结果答复" size="32" color="#0EAF4E" line-height="50rpx"></u-text> |
||||
</view> |
||||
</view> |
||||
<view class="row" style="padding-bottom:30rpx;"> |
||||
<view class="icon"> |
||||
<u-text text="占位：" size="32" color="transparent" line-height="50rpx" custom-style="white-space:nowrap;"></u-text> |
||||
</view> |
||||
<view class="body col"> |
||||
<view class="content"> |
||||
<!-- 状态：1=未回答,2=已回答--> |
||||
<u-text v-if="item.status === 2" line-height="50" size="28" color="#020b18" :text="item.reply"></u-text> |
||||
|
||||
<view class="" v-if="item.status === 2 && item.reply_path?.length > 0"> |
||||
<u-album multipleSize="170rpx" space="16rpx" :urls="item.reply_path" key-name="url" custom-style="border-radius:8rpx;"></u-album> |
||||
</view> |
||||
</view> |
||||
</view> |
||||
</view> |
||||
</view> |
||||
</view> |
||||
<u-loadmore :custom-style="{display:'flex'}" :status="status" fontSize="28" |
||||
marginBottom="30" marginTop="30" @loadmore="getUserLeave()"/> |
||||
</view> |
||||
|
||||
</template> |
||||
|
||||
<script> |
||||
import { |
||||
imghost |
||||
} from '@/config/host.js' |
||||
import MzSubsection from '@/components/MzSubsection/Index.vue'; |
||||
import api from '@/utils/functions.js'; |
||||
import {goodsOrder, orderLogistics, roomOrder, tabCount} from "@/api/user"; |
||||
import {userLeave} from "@/api/other"; |
||||
import {goodsList} from "@/api/shop"; |
||||
import {feedList} from "../../api/other"; |
||||
|
||||
export default { |
||||
components: { |
||||
MzSubsection |
||||
}, |
||||
data() { |
||||
return { |
||||
userInfo:{}, |
||||
listItem:[ |
||||
{name:'全部建议',id:''}, |
||||
{name:'已回复',id:2}, |
||||
{name:'未回复',id:1}, |
||||
], |
||||
listAdvisor:[ |
||||
{name:'我的提问',id:1}, |
||||
{name:'提问我的',id:2}, |
||||
], |
||||
tabCheck:'room', |
||||
title: '社区留言板', |
||||
loading: true, |
||||
staticImage: { |
||||
bg: imghost + '/BG.png', |
||||
newIcon: imghost + '/new-icon.png', |
||||
shopThumb: imghost + '/new-1.png', |
||||
ask:imghost+ '/ask.png', |
||||
answer:imghost+ '/answer.png', |
||||
}, |
||||
pages:{ |
||||
page:1, |
||||
limit:10, |
||||
status:'', |
||||
}, |
||||
lists:[], |
||||
status:'loadmore', |
||||
current:0, |
||||
} |
||||
}, |
||||
onLoad() { |
||||
|
||||
}, |
||||
onReady() { |
||||
|
||||
}, |
||||
computed: { |
||||
api() { |
||||
return api |
||||
} |
||||
|
||||
}, |
||||
methods: { |
||||
tabsAdvisorChange(e){ |
||||
this.pages.user_type = e.id; |
||||
this.getUserLeave(true); |
||||
}, |
||||
tabsChange(e){ |
||||
this.tabCheck = e.id |
||||
this.pages.status = e.id |
||||
this.getUserLeave(true); |
||||
}, |
||||
getUserLeave(clear = false){ |
||||
if (clear) { |
||||
this.status = 'loadmore' |
||||
this.pages.page = 1; |
||||
// this.pages.status = ''; |
||||
this.lists = []; |
||||
} |
||||
if (this.status === 'nomore') { |
||||
return false; |
||||
} |
||||
feedList(this.pages).then(res => { |
||||
this.lists.push.apply(this.lists, res.data); |
||||
if (res.data.length === 0) { |
||||
this.status = 'nomore' |
||||
} |
||||
}) |
||||
this.pages.page++; |
||||
}, |
||||
}, |
||||
onReachBottom() { |
||||
this.getUserLeave(); |
||||
}, |
||||
onPageScroll(res) { |
||||
|
||||
}, |
||||
mounted() { |
||||
this.getUserLeave(); |
||||
this.userInfo = uni.getStorageSync('user'); |
||||
}, |
||||
created() { |
||||
|
||||
} |
||||
} |
||||
</script> |
||||
|
||||
<style lang="scss"> |
||||
@import './components/leave.scss'; |
||||
::v-deep .u-tabs__wrapper__nav__line{ |
||||
left:24rpx; |
||||
} |
||||
</style> |
||||
Loading…
Reference in new issue