You can not select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
120 lines
3.2 KiB
120 lines
3.2 KiB
2 years ago
|
<template>
|
||
|
|
<view class="body-background" :style="{backgroundImage:'url('+staticImage.bodyBackground+')'}"></view>
|
||
|
|
<view class="app-wallpaper">
|
||
|
|
|
||
|
|
<view class="chat-list-container row">
|
||
|
|
<view v-for="item in chartList" class="chat-list-item-container col-12" :style="{
|
||
|
|
backgroundImage:'url('+staticImage.chatBgImage+')'
|
||
|
|
}">
|
||
|
|
<view class="chat-item-background" @click="chatDetail(item)" :style="{
|
||
|
|
backgroundImage:'url('+staticImage.chatLTBgImage+')'
|
||
|
|
}">
|
||
|
|
<view class="chat-item-content row">
|
||
|
|
<view class="chat-item-left">
|
||
|
|
<image class="img" :src="staticImage.screenActiveImg" mode="aspectFill"/>
|
||
|
|
</view>
|
||
|
|
<view class="chat-item-right">
|
||
|
|
<view class="chat-item-title-group row">
|
||
|
|
<view class="chat-item-title">{{item.title}}</view>
|
||
|
|
<view class="chat-item-time">{{item.time}}</view>
|
||
|
|
</view>
|
||
|
|
<view class="chat-item-desc">
|
||
|
|
{{item.desc}}
|
||
|
|
</view>
|
||
|
|
</view>
|
||
|
|
</view>
|
||
|
|
</view>
|
||
|
|
</view>
|
||
|
|
<view class="chat-item-end row">
|
||
|
|
— 没有更多内容了 —
|
||
|
|
</view>
|
||
|
|
</view>
|
||
|
|
</view>
|
||
|
|
|
||
|
|
</template>
|
||
|
|
|
||
|
|
<script>
|
||
|
|
import {
|
||
|
|
imghost
|
||
|
|
} from '@/config/host.js'
|
||
|
|
import HeaderNav from '@/components/HeaderNav/Index.vue';
|
||
|
|
import FooterNav from '@/components/FooterNav/Index.vue';
|
||
|
|
import RightNav from '@/components/RightNav/Index.vue';
|
||
|
|
import MzButton from '@/components/MzButton/Index.vue';
|
||
|
|
import api from '@/utils/functions.js';
|
||
|
|
export default {
|
||
|
|
components: {
|
||
|
|
HeaderNav,
|
||
|
|
FooterNav,
|
||
|
|
RightNav,
|
||
|
|
MzButton
|
||
|
|
},
|
||
|
|
data() {
|
||
|
|
return {
|
||
|
|
title: 'Hello',
|
||
|
|
loading: true,
|
||
|
|
staticImage: {
|
||
|
|
screenActiveImg: imghost + '/static/image/banner.png',
|
||
|
|
orderCardBackground: imghost + '/static/image/order-card-background.png',
|
||
|
|
wallpaperBgImage:imghost +'/static/image/background.png',
|
||
|
|
chatBgImage:imghost +'/static/image/chat-list-background.png',
|
||
|
|
chatLTBgImage:imghost +'/static/image/chat-list-lt-background.png',
|
||
|
|
bodyBackground:imghost+'/static/image/background.png'
|
||
|
|
},
|
||
|
|
user: {
|
||
|
|
avatar: imghost + '/static/image/banner.png',
|
||
|
|
nickname: '清晨的风',
|
||
|
|
coupons: 221,
|
||
|
|
id: 88685,
|
||
|
|
},
|
||
|
|
isTop: false,
|
||
|
|
chartList:[
|
||
|
|
{
|
||
|
|
id:1,
|
||
|
|
avatar:'成都市武侯区丰德国际4栋...',
|
||
|
|
title:'2023.05.06订单',
|
||
|
|
desc:'需要您带一点猫砂上门，谢谢',
|
||
|
|
time:'2023/06/16',
|
||
|
|
},{
|
||
|
|
id:2,
|
||
|
|
avatar:'成都市武侯区丰德国际4栋...',
|
||
|
|
title:'2023.05.06订单',
|
||
|
|
desc:'需要您带一点猫砂上门，谢谢',
|
||
|
|
time:'2023/06/16',
|
||
|
|
},{
|
||
|
|
id:3,
|
||
|
|
avatar:'成都市武侯区丰德国际4栋...',
|
||
|
|
title:'2023.05.06订单',
|
||
|
|
desc:'需要您带一点猫砂上门，谢谢',
|
||
|
|
time:'2023/06/16',
|
||
|
|
},
|
||
|
|
]
|
||
|
|
}
|
||
|
|
},
|
||
|
|
onLoad() {
|
||
|
|
|
||
|
|
},
|
||
|
|
methods: {
|
||
|
|
chatDetail(item){
|
||
|
|
wx.navigateTo({
|
||
|
|
url:'/pages/ChatDetail/index?id='+item.id
|
||
|
|
});
|
||
|
|
}
|
||
|
|
},
|
||
|
|
onPageScroll(res) {
|
||
|
|
if(res.scrollTop <= 20){
|
||
|
|
uni.$emit('isTop', true);
|
||
|
|
}else{
|
||
|
|
uni.$emit('isTop', false);
|
||
|
|
}
|
||
|
|
},
|
||
|
|
created() {
|
||
|
|
// this.pagePadding = (api.navHeight().navPaddingTop +
|
||
|
|
// api.navHeight().navHeight + (api.navHeight().headerPadding * 2))
|
||
|
|
}
|
||
|
|
}
|
||
|
|
</script>
|
||
|
|
|
||
|
|
<style lang="scss">
|
||
|
|
@import '@/pages/Index/components/ChatPage/components/index.scss';
|
||
|
|
</style>
|