邓洁 : 修改shopListItem细节

components/ShowShopListItem/ShowShopListItem.vue

@@ -1,12 +1,12 @@
 <template>
 	<view class="list-border">
 		<view class="list-container" @click="enterDetail()">
-			<view class="shop-list-img" >
+			<view class="shop-list-img">
-				<u-image width="80px" height="80px" :src="shopInfo.pics" radius="8px"></u-image>
+				<u-image :src="leftImage" width="80px" height="80px" radius="8px" :lazy-load="true"></u-image>
 			</view>
 			<view class="text-area">
 				<text style="font-weight: 500;">{{shopInfo.tt}}</text>
-				<view v-if="showStyle == 0" class="pos-and-sqr" >
+				<view v-if="showStyle == 0" class="pos-and-sqr">
 					<view>
 						<view>
 							<u-image src="/static/shoplist/sy_icon_lbdw.png" width="12px" height="15px"></u-image>
@@ -17,32 +17,32 @@
 						<view>
 							<u-image src="/static/shoplist/sy_icon_lbpm.png" width="12px" height="15px"></u-image>
 						</view>
-						<text>{{shopInfo.mianji}}m2</text>
+						<text>{{shopInfo.mianji}}m²</text>
 					</view>
 				</view>
-				<view v-else class="pos-and-sqr pos-only" >
+				<view v-else class="pos-and-sqr pos-only">
 					<view>
 						<view>
 							<u-image src="/static/shoplist/dp_icon_hhhdw.png" width="12px" height="15px"></u-image>
 						</view>
-						<text>{{shopInfo.area2}}</text>
+						<text>{{shopInfo.area1}}-{{shopInfo.adress}}</text>
 					</view>
 				</view>
 				<view class="rent-and-date">
 					<text>租金：{{shopInfo.zujin}}元/月</text>
 					<text v-if="showStyle == 0">发布日期：{{$u.timeFormat(shopInfo.pub_time,'yyyy-mm-dd')}}</text>
-					<text v-if="showStyle == 1">转让费：{{shopInfo.zhuanrangfei}}</text>
+					<text v-if="showStyle == 1">转让费：{{shopInfo.zhuanrangfei}}万</text>
 					<!-- 有 bug -->
 				</view>
 			</view>
 		</view>
-		
+
 		<view class="cart-and-date bottom-common" v-if="showStyle == 1 || showStyle == 2">
 			<view>
 				<view>
 					<u-image src="/static/shoplist/sy_icon_lbpm.png" width="12px" height="15px"></u-image>
 				</view>
-				<text>{{shopInfo.mianji}}m2</text>
+				<text>{{shopInfo.mianji}}m²</text>
 			</view>
 			<view>
 				<view>
@@ -63,21 +63,16 @@
 				<text>{{shopInfo.mobile}}</text>
 			</view>
 		</view>
-		
+
-		<view 
+		<view v-if="isADShow" class="list-ads bottom-common" style="font-size: 11px;" @click="handleAD">
-			v-if="isADShow"
-			class="list-ads bottom-common" 
-			style="font-size: 11px;"
-			@click="handleAD"
-			>
 			<view>
-				<text>已将该店推给</text> 
+				<text>已将该店推给</text>
-				<text style="color:#ce3b3b;margin: 0 4px;"> {{shopInfo.num}} </text> 
+				<text style="color:#ce3b3b;margin: 0 4px;"> {{shopInfo.num}} </text>
 				<text> 位潜在客户</text>
 			</view>
 			<text style="color:#ce3b3b">我也要推广>></text>
 		</view>
-		
+
 		<view v-if="isEdit" class="del-and-edit bottom-common">
 			<view class="edit" @click="handleEdit(shopInfo.id)">
 				<u-image src="/static/shoplist/dp_icon_pj.png" width="12px" height="15px"></u-image>
@@ -102,87 +97,89 @@
 	export default {
 		props: {
 			shopInfo: {
-				type:Object,
+				type: Object,
-				default(){
+				default () {
 					return {
-						
+
 					}
 				}
 			},
 			// 展示商铺的样式类型
-			showStyle:{
+			showStyle: {
 				type: Number,
-				default() {
+				default () {
 					return 0
 				}
 			},
 			// 是否展示推广广告
 			isADShow: {
 				type: Boolean,
-				default() {
+				default () {
 					return true
 				}
 			},
 			// 推广广告链接
 			adlinkPath: {
 				type: String,
-				default() {
+				default () {
 					return ''
 				}
 			},
 			// 是否可编辑
 			isEdit: {
 				type: Boolean,
-				default() {
+				default () {
 					return false
 				}
 			},
-			
-			
 		},
 		data() {
 			return {
 				delshopid: 0,
+				leftImage: ''
 			}
-			
+
 		},
 		computed: {
-			
+
+		},
+		created() {
+			this.leftImage = this.$api.imgUrl + this.shopInfo.pics.split(',')[0]
 		},
 		methods: {
 			handleEdit(shopid) {
 				// TODO 完成页面跳转
-				console.log("点击了编辑ID为",shopid);
+				console.log("点击了编辑ID为", shopid);
 			},
 			handleDel(shopid) {
 				// 需完善删除请求
 				this.$emit('delItem', shopid)
 			},
-			enterDetail(){
+			enterDetail() {
 				// console.log("进入详情页面");
-				const query=this.$u.queryParams({
+				const query = this.$u.queryParams({
 					id: this.shopInfo.id,
 					type: this.shopInfo.type
 				})
-				console.log("query",query);
+				console.log("query", query);
 				uni.navigateTo({
 					url: '/pages/detail/detail' + `${query}`
 				})
 			},
-			handleAD(){
+			handleAD() {
 				// TODO 完成页面跳转
 				if (this.adlinkPath) {
 					uni.navigateTo({
 						url: this.adlinkPath
 					})
-				}else {
+				} else {
 					uni.navigateTo({
 						url: '/pages/publish/publishTransfer/publishTransfer'
 					})
 				}
 			}
 		},
-		
+
 	}
 </script>
 
@@ -194,39 +191,47 @@
 		border-radius: 7px;
 		box-shadow: 0 1px 2px 0 rgba(224, 224, 224, 0.50);
 		font-size: 12px;
+
 		.list-container {
 			display: flex;
 			height: 80px;
-			margin-bottom: 10px;			
+			margin-bottom: 10px;
 		}
+
 		.text-area {
 			margin-left: 10px;
 			display: flex;
 			flex-direction: column;
 			justify-content: space-between;
-			> text {
+
+			>text {
 				font-size: 14px;
 			}
-			
+
 			.pos-and-sqr {
 				display: flex;
+
 				text {
 					color: #359867;
 					line-height: 12px;
 				}
+
 				>view {
 					margin-right: 24px;
 					display: flex;
+
 					>view {
 						margin-right: 4px;
 					}
 				}
 			}
+
 			.pos-only {
 				text {
 					color: #A0A0A0;
 				}
 			}
+
 			.rent-and-date {
 				text {
 					font-weight: 500;
@@ -235,47 +240,56 @@
 				}
 			}
 		}
-		
+
 		.bottom-common {
 			border-top: 1px solid #f7f7f7;
 			padding-top: 5px;
 			display: flex;
-			> view {
+
+			>view {
 				display: flex;
 			}
 		}
+
 		.cart-and-date {
 			margin-bottom: 6px;
 			justify-content: space-between;
 			font-weight: 500;
+
 			text {
 				color: #359867;
 				line-height: 12px;
 			}
+
 			>view {
-				flex:1;
+				flex: 1;
+
 				>view {
 					margin-right: 4px;
 				}
 			}
 		}
-		.del-and-edit{
+
+		.del-and-edit {
 			margin-top: 6px;
 			justify-content: flex-end;
-			>view{
+
+			>view {
 				margin-left: 38rpx;
 			}
+
 			text {
 				margin-left: 4px;
 				color: #666666;
 			}
 		}
+
 		.list-ads {
 			justify-content: space-between;
+
 			text {
 				color: #359867;
 			}
 		}
 	}
-	
 </style>

pages/index/index.vue

@@ -3,7 +3,7 @@
 		<InputAndSwiper type='0' :bannerURL="swiperList"></InputAndSwiper>
 		<view class="home-content">
 			<view class="service">
-				<u-image src="/static/statistics/sy_icon_lxkf.png" width="108rpx" height="108rpx" />
+				<u-image src="/static/statistics/sy_icon_lxkf.png" width="108rpx" height="108rpx"></u-image>
 				<button open-type="contact" bindcontact="handleContact" session-from="sessionFrom" class="service-btn">
 				</button>
 			</view>