罗世杰：feat：商铺展示列表提供删除和编辑按钮

components/ShowShopList/ShowShopList.vue

@@ -6,6 +6,7 @@
 			:shopInfo="item"
 			:is-adshow="isADshow"
 			:show-style="showStyle"
+			@delItem="handleDel"
 		></ShowShopListItem>
 	</view>
 </template>
@@ -15,6 +16,7 @@
 	 * @property {Array}    shopInfoList     对象数组，（带图片）需要展示的商铺列表
 	 * @property {Number}   showStyle        展示商铺的样式类型(0为首页默认)
 	 * @property {Boolean}  isADshow         是否显示推广广告
+	 * @property {Boolean}  isEdit           是否显示编辑和删除
 	 */
 	export default {
 		name:"ShowShopList",
@@ -27,7 +29,7 @@
 			showStyle:{
 				type: Number,
 				default() {
-					return 0
+					return 1
 				}
 			},
 			isADshow: {
@@ -76,6 +78,15 @@
 		},
 		computed: {
 			
+		},
+		methods: {
+			handleDel(shopid){
+				console.log("删除了商铺", shopid);
+				// const delindex = this.shopInfoList.findIndex((item,index)=> item.shopid === shopid)
+				// TODO：不能直接修改
+				// if(delindex !== -1)  this.shopInfoList = this.shopInfoList.slice(delindex,1)
+				// console.log(this.shopInfoList);
+			}
 		}
 	}
 </script>

components/ShowShopListItem/ShowShopListItem.vue

@@ -35,7 +35,8 @@
 				</view>
 			</view>
 		</view>
-		<view class="cart-and-date" v-if="showStyle==1">
+		
+		<view class="cart-and-date bottom-common" v-if="showStyle==1">
 			<view>
 				<view>
 					<u-image src="/static/shoplist/sy_icon_lbpm.png" width="12px" height="15px"></u-image>
@@ -61,14 +62,26 @@
 				<text>{{shopInfo.phoneNum}}</text>
 			</view>
 		</view>
-		<view v-if="isADShow" class="list-ads" style="font-size: 11px;">
+		
+		<view v-if="isADShow" class="list-ads bottom-common" style="font-size: 11px;">
 			<view>
-				<text>已将该店推给 </text> 
+				<text>已将该店推给</text> 
 				<text style="color:#ce3b3b;margin: 0 4px;"> {{shopInfo.promotionNum}} </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.shopid)">
+				<u-image src="/static/shoplist/dp_icon_pj.png" width="12px" height="15px"></u-image>
+				<text>编辑</text>
+			</view>
+			<view class="del" @click="handleDel(shopInfo.shopid)">
+				<u-image src="/static/shoplist/dp_icon_sc.png" width="12px" height="15px"></u-image>
+				<text>删除</text>
+			</view>
+		</view>
 	</view>
 </template>
 
@@ -89,7 +102,7 @@
 			showStyle:{
 				type: Number,
 				default() {
-					return 1
+					return 0
 				}
 			},
 			isADShow: {
@@ -97,17 +110,33 @@
 				default() {
 					return true
 				}
+			},
+			isEdit: {
+				type: Boolean,
+				default() {
+					return false
+				}
 			}
 			
 		},
 		data() {
 			return {
-				
+				delshopid: 0,
 			}
 			
 		},
 		computed: {
 			
+		},
+		methods: {
+			handleEdit(shopid) {
+				// TODO 完成页面跳转
+				console.log("edit clicked");
+				console.log(shopid);
+			},
+			handleDel(shopid) {
+				this.$emit('delItem', shopid)
+			}
 		}
 	}
 </script>
@@ -161,10 +190,16 @@
 				}
 			}
 		}
-		.cart-and-date {
-			display: flex;
+		
+		.bottom-common {
 			border-top: 1px solid #f7f7f7;
 			padding-top: 5px;
+			display: flex;
+			> view {
+				display: flex;
+			}
+		}
+		.cart-and-date {
 			margin-bottom: 6px;
 			justify-content: space-between;
 			font-weight: 500;
@@ -174,17 +209,27 @@
 			}
 			>view {
 				flex:1;
-				display: flex;
 				>view {
 					margin-right: 4px;
 				}
 			}
 		}
+		.del-and-edit{
+			margin-top: 6px;
+			justify-content: flex-end;
+			>view{
+				margin-left: 38rpx;
+			}
+			text {
+				margin-left: 4px;
+				color: #666666;
+			}
+		}
 		.list-ads {
-			border-top: 1px solid #f7f7f7;
-			padding-top: 5px;
-			display: flex;
 			justify-content: space-between;
+			text {
+				color: #359867;
+			}
 		}
 	}