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
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>
|
|
|