148 lines
3.7 KiB
Vue
148 lines
3.7 KiB
Vue
|
<template>
|
||
|
|
<view class="my-card-box">
|
||
|
|
<navigation-bar-vue title="我的反馈" style="width: 100%;" background-color="#ffffff"
|
||
|
|
title-color="#000000"></navigation-bar-vue>
|
||
|
|
<view class="addr-list-box">
|
||
|
|
<scroll-view style="height: 100%;" scroll-y="true" @scrolltolower="onReachBottomCus" refresher-enabled
|
||
|
|
@refresherrefresh="onRefresherrefresh" :refresher-triggered="isTriggered">
|
||
|
|
<view v-for="(item,index) in dataList" class="addr-item-box">
|
||
|
|
<view class="addr-item-top">
|
||
|
|
{{item.content}}
|
||
|
|
</view>
|
||
|
|
<view class="addr-item-opt">
|
||
|
|
<uni-file-picker samll="true" :value="item.imagesList" readonly="true"
|
||
|
|
limit="9"></uni-file-picker>
|
||
|
|
</view>
|
||
|
|
<view class="addr-bottom">
|
||
|
|
{{item.createTime}}
|
||
|
|
</view>
|
||
|
|
</view>
|
||
|
|
<view style="text-align: center" v-if="dataList.length==0">
|
||
|
|
<image class="" src="@/static/images/nothing.png"></image>
|
||
|
|
</view>
|
||
|
|
</scroll-view>
|
||
|
|
</view>
|
||
|
|
</view>
|
||
|
|
</template>
|
||
|
|
|
||
|
|
<script>
|
||
|
|
import navigationBarVue from '@/components/navigation/navigationBar.vue';
|
||
|
|
export default {
|
||
|
|
components: {
|
||
|
|
navigationBarVue
|
||
|
|
},
|
||
|
|
data() {
|
||
|
|
return {
|
||
|
|
dataList: [{
|
||
|
|
createTime: "2024-02-10 12:22:44",
|
||
|
|
content: "我的意见我的意见我的意见我的意见我的意见我的意见我的意见我的意见我的意见我的意见我的意见我的意见我的意见",
|
||
|
|
images: "",
|
||
|
|
imagesList: [
|
||
|
|
'/profile/upload/2025/03/18/f936812fd66e18007385b187cc6b12c_20250318105540A001.png',
|
||
|
|
'/profile/upload/2025/03/18/5_20250318172439A002.png'
|
||
|
|
],
|
||
|
|
backContent: "反馈内容",
|
||
|
|
backImages: [],
|
||
|
|
backTime: "2024-02-10 12:22:44",
|
||
|
|
}],
|
||
|
|
queryParams: {
|
||
|
|
pageNum: 1,
|
||
|
|
pageSize: 10,
|
||
|
|
},
|
||
|
|
total: 0,
|
||
|
|
//下来刷新状态
|
||
|
|
isTriggered: false
|
||
|
|
}
|
||
|
|
},
|
||
|
|
methods: {
|
||
|
|
/**
|
||
|
|
* 上滑加载数据
|
||
|
|
*/
|
||
|
|
onReachBottomCus() {
|
||
|
|
//判断 如果页码*页容量大于等于总条数，提示该页数据加载完毕
|
||
|
|
if (this.queryParams.pageNum * this.queryParams.pageSize >= this.total) {
|
||
|
|
toast("没有更多数据了")
|
||
|
|
return
|
||
|
|
}
|
||
|
|
//页码+1,调用获取数据的方法获取第二页数据
|
||
|
|
this.queryParams.pageNum++
|
||
|
|
},
|
||
|
|
/**
|
||
|
|
* 下拉刷新数据
|
||
|
|
*/
|
||
|
|
onRefresherrefresh() {
|
||
|
|
this.isTriggered = true
|
||
|
|
this.queryParams.pageNum = 1
|
||
|
|
this.total = 0
|
||
|
|
},
|
||
|
|
}
|
||
|
|
}
|
||
|
|
</script>
|
||
|
|
|
||
|
|
<style lang="scss">
|
||
|
|
.my-card-box {
|
||
|
|
padding-top: calc(90rpx + var(--status-bar-height));
|
||
|
|
background-color: white;
|
||
|
|
width: 100%;
|
||
|
|
color: #363636;
|
||
|
|
font-size: 32rpx;
|
||
|
|
height: 100%;
|
||
|
|
display: flex;
|
||
|
|
flex-direction: column;
|
||
|
|
align-items: self-start;
|
||
|
|
justify-content: center;
|
||
|
|
position: relative;
|
||
|
|
|
||
|
|
.addr-list-box {
|
||
|
|
background-color: #F6F6F6;
|
||
|
|
height: calc(100vh - var(--status-bar-height) - var(--window-bottom) - 91rpx);
|
||
|
|
overflow-y: scroll;
|
||
|
|
padding: 0 30rpx;
|
||
|
|
width: 100%;
|
||
|
|
display: flex;
|
||
|
|
flex-direction: column;
|
||
|
|
align-items: center;
|
||
|
|
padding-top: 20rpx;
|
||
|
|
justify-content: start;
|
||
|
|
|
||
|
|
.addr-item-box {
|
||
|
|
width: 100%;
|
||
|
|
display: flex;
|
||
|
|
background-color: white;
|
||
|
|
margin-top: 20rpx;
|
||
|
|
border-radius: 20rpx;
|
||
|
|
padding: 20rpx;
|
||
|
|
flex-direction: column;
|
||
|
|
align-items: center;
|
||
|
|
justify-content: center;
|
||
|
|
border-bottom: 1rpx solid #F2F2F2;
|
||
|
|
|
||
|
|
.addr-item-top {
|
||
|
|
width: 100%;
|
||
|
|
display: -webkit-box;
|
||
|
|
-webkit-box-orient: vertical;
|
||
|
|
-webkit-line-clamp: 2;
|
||
|
|
overflow: hidden;
|
||
|
|
text-overflow: ellipsis;
|
||
|
|
}
|
||
|
|
|
||
|
|
.addr-item-opt {
|
||
|
|
width: 100%;
|
||
|
|
padding-top: 20rpx;
|
||
|
|
display: flex;
|
||
|
|
align-items: center;
|
||
|
|
justify-content: flex-end;
|
||
|
|
|
||
|
|
}
|
||
|
|
|
||
|
|
.addr-bottom {
|
||
|
|
padding-top: 20rpx;
|
||
|
|
width: 100%;
|
||
|
|
text-align: left;
|
||
|
|
font-size: 22rpx;
|
||
|
|
color: #999999;
|
||
|
|
}
|
||
|
|
}
|
||
|
|
}
|
||
|
|
}
|
||
|
|
</style>
|