details.vue 4.91 KB
<template>
  <view>
	<view class="banner-img">
		<u-image :showLoading="true" :src="tableData.displayMainImage || tableData.displayImage" width="100%" height="100%"></u-image>
	</view>
	<view class="banner">
		<view class="banner-item info">
			<view class="info-title">
				{{tableData.shopName || tableData.venueName}}

			</view>
			<view class="info-text">{{tableData.shopDescription}}</view>
			<view class="info-racord">
				<view class="info-price"><span>{{tableData.id *160}}</span>元/月</view>
				<view class="info-intention">{{tableData.id}}人有意向</view>
			</view>
		</view>
		<view class="banner-item field">
			<view class="banner-item-title">场地信息</view>
			<view class="banner-item-form">
				<u-row gutter="10">
					<u-col span="6">
						<view class="form-item">
							<view class="label">场地类型:</view>
							<text>{{tableData.architecturalForm || tableData.venueType}}</text>
						</view>
					</u-col>
					<u-col span="6">
						<view class="form-item">
							<view class="label">实际使用面积:</view>
							<text>{{tableData.actualUsableArea || tableData.actualArea}}m²</text>
						</view>
					</u-col>
					<u-col span="6">
						<view class="form-item">
							<view class="label">所属区域:</view>
							<text>{{tableData.belongingRegion || tableData.district}}</text>
						</view>
					</u-col>
					<u-col span="12">
						<view class="form-item">
							<view class="label">规划图纸:</view>
							<view>
								<u-image v-if="tableData.architecturalDrawings" :showLoading="true" :src="tableData.architecturalDrawings" width="calc(90vw - 140rpx)" height="300rpx"></u-image>
								<text v-else>暂无</text>
							</view>
						</view>
					</u-col>
					<u-col span="12">
						<view class="form-item">
							<view class="label" style="width: 142rpx;">位置描述:</view>
							<text style='flex: 1;'>{{tableData.detailedLocation }}</text>
						</view>
					</u-col>
				</u-row>
			</view>
		</view>
		<view class="banner-item position">
			<view class="banner-item-title">位置信息</view>
			<view style="margin-top: 16rpx;">
				<map style="width: 100%; height: 150rpx;">
					<view class="position-info">
						<u-image :showLoading="true"  :src="$imgUrl('/location-icon.png')"  width="20rpx" height="20rpx"></u-image>
						<text>{{tableData.shopName || tableData.venueName}}</text>
					</view>
				</map>
			</view>
		</view>
		<!-- <view class="banner-item other-business">
			<view class="banner-item-title">周边商铺</view>
			<view style="margin-top: 16rpx;">
				<scroll-view class="scroll-view_H" scroll-x="true" scroll-left="120">
					<view v-for="(item, index) in 10" :key="index" class="scroll-view-item_H">
						<view class="business-card">
							<u-image :showLoading="true" src="https://cdn.uviewui.com/uview/album/1.jpg" width="100%" height="210rpx"></u-image>
							<view class="business-card-title">
								这里是标题这里是标题这里是标题这里是标题这里是标题
							</view>
							<view class="business-card-item">租金:¥<span>1067</span>/月</view>
							<view class="business-card-item">面积:<span>81</span>/m2</view>
						</view>
					</view>
				</scroll-view>
			</view>
		</view> -->
	</view>
    <!-- 底部 -->
    <view class="page-footer">
		<!-- <view class="footer-service">
				<u-image :showLoading="true" :src="$imgUrl('/sevice-icon.png')"  width="30rpx" height="30rpx"></u-image>
				<text>客服</text>
			</view> -->
		<view class="footer-btn">
			<u-button type="primary" @click="leaseAdd('/pages/intentionApply/intentionApply')" style="margin-right:10px;height: 35px;">意向申请</u-button>
			<u-button type="success" style="height: 35px;" @click="leaseAdd('/pages/leaseAdd/leaseAdd')" >租赁申请</u-button>
			<!-- <u-button type="success" style="margin-left: unset;" @click="leaseAdd">广告申请</u-button> -->
		</view>
			<!-- <view class="footer-service">
				<u-image :showLoading="true"  :src="$imgUrl('/share-icon.png')"  width="30rpx" height="30rpx"></u-image>
				<text>分享</text>
			</view> -->
		
    </view>
  </view>
</template>

<script>

export default {
  data() {
    return {
		tableData:{},
		swiperList: [
			{
				id: 0,
				type: 'image',
				url: this.$imgUrl('/img/1.jpg')
			}
		],
		latitude: 39.909,
		longitude: 116.39742,
		qianzui:'',
    };
  },
  onLoad(option){
	  
	let data = JSON.parse(option.item)
	console.log(data)
	if(data.shopName){
		this.qianzui = 'sp'
	}else{
		this.qianzui = 'cd'
	}
	this.swiperList[0].url =  data.displayMainImage || data.locationDiagram
	this.tableData = data
	let location
	if(data.mapPunctuation){
		location = JSON.parse(data.mapPunctuation)
	}else{
		location = JSON.parse(data.mapMarker)
	}
	this.latitude = location.latitude;
	this.longitude = location.longitude;

  },
  methods: {
		leaseAdd(url){
			uni.navigateTo({
				url:`${url}?ids=${this.qianzui+this.tableData.id}`
			})
		}
  }
};
</script>

<style scoped lang="scss">
@import 'details.scss';
</style>