大德通墓地App
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.
 
 
 

393 lines
8.6 KiB

<template>
<view class="mian">
<u-navbar back-text="返回" :is-back="false">
<view class="slot-wrap">
<!-- 如果使用u-search组件必须要给v-model绑定一个变量 :show-action="showAction" -->
<u-search v-model="search" bg-color="#f5f7fa" :show-action="false" @click.native="toSearch" height="72"
:action-style="{color: '#fff'}">
</u-search>
</view>
</u-navbar>
<!-- <view class="title">
<u-icon name="search" size="30" class="icon" color="#737373"></u-icon>
</view>
-->
<!-- 轮播图 -->
<view class="swiper">
<u-swiper :list="adPosList" name="apImgPath" height="360 " border-radius="12"></u-swiper>
</view>
<!-- 公告 -->
<view class="notice">
<u-notice-bar mode="horizontal" :list="gg_list" bg-color="#f7f9fc"></u-notice-bar>
</view>
<!-- 购买管理 -->
<view class="mannage">
<view class="item " @click="toBeforehand">
<view class="left">
<u-image mode="widthFix" width="80rpx" height="80rpx" border-radius="50%" :src="mannage.buy.imgUrl">
</u-image>
</view>
<view class="right">
<view class="title2">
{{mannage.buy.title}}
</view>
<view class="info">
{{mannage.buy.info}}
</view>
</view>
</view>
<view class="item lease" @click="toSell">
<view class="left">
<u-image mode="widthFix" width="80rpx" height="80rpx" border-radius="50%"
:src="mannage.lease.imgUrl"></u-image>
</view>
<view class="right">
<view class="title2">
{{mannage.lease.title}}
</view>
<view class="info">
{{mannage.lease.info}}
</view>
</view>
</view>
</view>
<!-- 祭扫 -->
<view class="saoji" :style="{background: 'url('+ saoji.bgUrl + ')'}">
<view class="left">
<view class="icon">
</view>
云祭扫
</view>
<view class="right">
<view class="btn">
立即查看
</view>
</view>
</view>
<!-- 购买投资 -->
<view class="invest">
<u-cell-group :border="false">
<u-cell-item :arrow="false" :title-style="{'font-size': '32rpx','font-weight': '600' , 'color': '#000'}"
:border-bottom="false" title="购买投资">
<view sloat="right-icon" @click="toInvestList">
更多<u-icon name="arrow-right" style="margin-left: 10rpx;"></u-icon>
</view>
</u-cell-item>
</u-cell-group>
<view class="top">
<scroll-view class="list" scroll-x="true" scroll-left="0">
<Cart @toLink="toLink" :info="item" @click.native="toInfo(item,'reselling')" width="328rpx" height="246rpx"
class="item" v-for="(item, index) in reselling" :key="index" />
</scroll-view>
</view>
</view>
<!-- 归属租赁 -->
<view class="affiliation ">
<u-cell-group :border="false">
<u-cell-item :arrow="false" :title-style="{'font-size': '32rpx','font-weight': '600' , 'color': '#000'}"
:border-bottom="false" title="归属租赁">
<view sloat="right-icon" @click="toAffiliationList">
更多<u-icon name="arrow-right" style="margin-left: 10rpx;"></u-icon>
</view>
</u-cell-item>
</u-cell-group>
<view class="top">
<scroll-view class="list" scroll-x="true" scroll-left="0">
<Cart :info="item" @toLink="toLink" @click.native="toInfo(item,'renting')" width="328rpx" height="246rpx"
class="item" v-for="(item, index) in rentingList" :key="index" />
</scroll-view>
</view>
</view>
<u-tabbar v-model="vuex_current" :inactive-color="vuex_inactiveColor" :activeColor="vuex_activeColor"
:list="vuex_tabBar"></u-tabbar>
</view>
</template>
<script>
import Cart from '../../components/cart.vue'
export default {
data() {
return {
search: '',
// 轮播图
list: [{
image: 'https://cdn.uviewui.com/uview/swiper/1.jpg',
title: '昨夜星辰昨夜风,画楼西畔桂堂东'
},
{
image: 'https://cdn.uviewui.com/uview/swiper/2.jpg',
title: '身无彩凤双飞翼,心有灵犀一点通'
},
{
image: 'https://cdn.uviewui.com/uview/swiper/3.jpg',
title: '谁念西风独自凉,萧萧黄叶闭疏窗,沉思往事立残阳'
}
],
// 公告
gg_list: [
'寒雨连江夜入吴',
'平明送客楚山孤',
'洛阳亲友如相问',
'一片冰心在玉壶'
],
mannage: {
lease: {
imgUrl: '../../static/mod_icon.png',
title: '购买管理',
info: '精选风水安家地'
},
buy: {
imgUrl: '../../static/mod_icon2.png',
title: '租赁管理',
info: '首个无界神度空间'
}
},
saoji: {
bgUrl: '../../static/saoji.png'
},
queryData: {
pageNum: 1,
pageSize: 10,
pagodaStatus: '', // 神塔状态reselling售卖中,renting出租中
},
total: 0,
// 租赁列表
rentingList: [],
// 出售列表
reselling: [],
// 轮播广告
adPosList: [],
adPosQuery:{
pageNum: 1,
pageSize: 10,
type: 'index_banner'
}
}
},
methods: {
async getAdPosList() {
let res = await this.$u.api.getAdPosList(this.adPosQuery)
this.adPosList.push(...res.data.rows)
console.log(res, 8800)
},
toBeforehand() {
// 记录当前页面
this.$u.vuex('vuex_backUrl', 'mian')
uni.navigateTo({
url: '../user/beforehand_lease/beforehand_lease'
})
},
toSell() {
this.$u.vuex('vuex_backUrl', 'mian')
uni.navigateTo({
url: '../user/purchase/purchase'
})
},
async getList(type) {
// 出租
if (type === 'renting') {
this.queryData.pagodaStatus = type
let res = await this.$u.api.pagoda.getPagodaList(this.queryData)
this.rentingList = res.data.rows
console.log(res, 88899)
} else {
// 出售
this.queryData.pagodaStatus = type
let res = await this.$u.api.pagoda.getPagodaList(this.queryData)
this.reselling = res.data.rows
console.log(res, 888000)
}
},
toInvestList() {
uni.navigateTo({
url: './Invest_list/Invest_list?type=1'
})
},
toAffiliationList() {
uni.navigateTo({
url: './Invest_list/Invest_list?type=2'
})
},
toSearch() {
uni.navigateTo({
url: './search/search'
})
},
toInfo(info, type) {
uni.navigateTo({
url: './cemeteryInfo/cemeteryInfo?id=' + info.pagodaId + '&type=' + type
})
},
toLink() {
uni.navigateTo({
url: './linkInfo/linkInfo'
})
}
},
components: {
Cart,
},
onLoad() {
// 获取出售神塔
this.getList('reselling')
// 获取出租神塔
this.getList('renting')
// 获取广告
this.getAdPosList()
}
}
</script>
<style lang="scss" scoped>
.mian {
.swiper,
.notice,
.saoji,
{
width: 678rpx;
margin: 0 auto;
margin-top: 24rpx;
}
.slot-wrap {
display: flex;
align-items: center;
flex: 1;
padding: 0 36rpx;
}
// .title {
// position: relative;
// padding: 12rpx 20rpx 12rpx;
// box-shadow: 0 2rpx 20rpx -1px rgba($color: #ccc, $alpha: 0.2);
// .icon {
// position: absolute;
// top: 30rpx;
// left: 40rpx;
// z-index: 2;
// }
// .input {
// text-indent: 60rpx;
// border-radius: 12rpx;
// }
// }
.mannage {
padding: 36rpx 36rpx 0;
display: flex;
.item {
width: 328rpx;
height: 160rpx;
box-shadow: 0 2px 12px 0 rgba(116, 116, 116, 0.1);
display: flex;
align-items: center;
padding-left: 20rpx;
border-radius: 12rpx;
.right {
margin-left: 16rpx;
.title2 {
font-size: 32rpx;
font-weight: 600;
}
.info {
margin-top: 5rpx;
font-size: 24rpx;
color: #BFC2CC;
}
}
}
.lease {
margin-left: 22rpx;
}
}
.saoji {
height: 160rpx;
background-size: 100% 100% !important;
display: flex;
align-items: center;
.left {
margin-left: 36rpx;
display: flex;
flex: 1;
color: #FFFFFF;
line-height: 30rpx;
.icon {
margin-right: 20rpx;
width: 40rpx;
height: 30rpx;
background: url('../../static/cloud.png');
background-size: 100% 100%;
}
}
.right {
.btn {
width: 168rpx;
height: 64rpx;
flex: 1;
margin-right: 36rpx;
line-height: 64rpx;
text-align: center;
background: #2753c1;
color: #FFFFFF;
opacity: 1;
border-radius: 36rpx;
font-size: 24rpx;
}
}
}
.invest,
.affiliation {
// padding-right: 36rpx;
margin-top: 36rpx;
/deep/ .uni-scroll-view-content {
display: flex;
}
/deep/ .item {
padding-right: 20rpx;
&:first-child {
padding-left: 36rpx;
}
&:last-child {
padding-right: 36rpx;
}
}
}
.affiliation {
margin-bottom: 60rpx;
}
}
</style>