邓洁 : "我的"模块删除功能

components/SearchShopList/SearchShopList.vue

@@ -1,13 +1,7 @@
 <template>
 	<view>
-		<SearchShopListItem
-			v-for="item in searchInfoList"
-			:key="searchid"
-			:shopInfo="item"
-			:show-style="showStyle"
-			:isEdit="isEdit"
-			@delItem="handleDel"
-		></SearchShopListItem>
+		<SearchShopListItem v-for="item in searchInfoList" :key="searchid" :shopInfo="item" :show-style="showStyle"
+			:isEdit="isEdit" @delItem="handleDel" @updateItem="handleUpdate"></SearchShopListItem>
 	</view>
 </template>
 
@@ -19,7 +13,7 @@
 	 * @property  {Object}    customQuery      自定义查询参数
 	 */
 	export default {
-		name:"SearchShopList",
+		name: "SearchShopList",
 		data() {
 			return {
 				pageSize: 5,
@@ -27,40 +21,44 @@
 			};
 		},
 		props: {
-			searchInfoList:{
+			searchInfoList: {
 				type: Array,
-				default(){
+				default () {
 					return []
 				}
 			},
-			showStyle:{
+			showStyle: {
 				type: Number,
-				default() {
+				default () {
 					return 0
 				}
 			},
 			isEdit: {
 				type: Boolean,
-				default() {
+				default () {
 					return false
 				}
 			},
-			listType:{
+			listType: {
 				type: Number,
-				default(){
+				default () {
 					return 2
 				}
 			},
-			customQuery:{
+			customQuery: {
 				type: Object,
-				default(){
+				default () {
 					return {}
 				}
 			}
 		},
 		methods: {
-			handleDel(shopid){
+			handleUpdate(searchid) {
+				this.$emit('updateItem', searchid)
+			},
+			handleDel(shopid) {
 				console.log("删除了商铺", shopid);
+				this.$emit('delItem', shopid)
 				// const delindex = this.shopInfoList.findIndex((item,index)=> item.shopid === shopid)
 				// TODO：不能直接修改
 				// if(delindex !== -1)  this.shopInfoList = this.shopInfoList.slice(delindex,1)

components/SearchShopListItem/SearchShopListItem.vue

@@ -6,7 +6,7 @@
 		<view class="list-container">
 			<view class="text-area">
 				<text>{{shopInfo.tt}}</text>
-				
+
 				<view class="style2" v-if="showStyle === 1">
 					<view class="rent-and-cost">
 						<text>租金：{{shopInfo.zujin}}元/月</text>
@@ -44,7 +44,7 @@
 						</view>
 					</view>
 				</view>
-				
+
 				<view class="sqr-and-lx" :class="{pb0: showStyle === 2}">
 					<view>
 						<view>
@@ -68,7 +68,7 @@
 						<text :class="{style3: showStyle === 2}">{{shopInfo.mobile}}</text>
 					</view>
 				</view>
-				
+
 				<view class="cart-and-date" v-if="showStyle === 0">
 					<view>
 						<view>
@@ -89,7 +89,7 @@
 						<text>发布日期：{{$u.timeFormat(shopInfo.pub_time,'yyyy-mm-dd')}}</text>
 					</view>
 				</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>
@@ -100,7 +100,7 @@
 						<text>删除</text>
 					</view>
 				</view>
-				
+
 			</view>
 		</view>
 	</view>
@@ -110,41 +110,41 @@
 	export default {
 		props: {
 			shopInfo: {
-				type:Object,
-				default(){
+				type: Object,
+				default () {
 					return {
-						
+
 					}
 				}
 			},
 			showStyle: {
-				type:Number,
-				default() {
+				type: Number,
+				default () {
 					return 0
 				}
 			},
 			isEdit: {
-				type:Boolean,
-				default(){
+				type: Boolean,
+				default () {
 					return false
 				}
 			}
-			
+
 		},
 		data() {
 			return {
-				
+
 			}
-			
+
 		},
 		computed: {
-			
+
 		},
 		methods: {
 			handleEdit(searchid) {
 				// TODO 完成页面跳转
-				console.log("点击了编辑ID为",searchid);
-				
+				console.log("点击了编辑ID为", searchid);
+				this.$emit('updateItem', searchid)
 			},
 			handleDel(searchid) {
 				this.$emit('delItem', searchid)
@@ -156,23 +156,28 @@
 <style lang="scss" scoped>
 	.style3 {
 		position: relative;
-		color:#696969 !important;
-		.cart-and-pos{
+		color: #696969 !important;
+
+		.cart-and-pos {
 			border-top: 1px solid #eee !important;
 		}
 	}
-	.pb0{
+
+	.pb0 {
 		padding-bottom: 0 !important;
 	}
+
 	.yzr {
 		position: absolute;
 		top: 30rpx;
 		right: 13rpx;
 	}
+
 	.cjsj {
 		margin-top: 20rpx;
 		margin-bottom: 12rpx;
 	}
+
 	.list-border {
 		position: relative;
 		margin: 10px 0;
@@ -181,101 +186,125 @@
 		border-radius: 7px;
 		box-shadow: 0 1px 2px 0 rgba(224, 224, 224, 0.50);
 		font-size: 12px;
+
 		.list-container {
 			display: flex;
 			height: auto;
 		}
+
 		.bottom-common {
 			border-top: 1px solid #f7f7f7;
 			padding-top: 5px;
 			display: flex;
-			> view {
+
+			>view {
 				display: flex;
 			}
 		}
-		.del-and-edit{
+
+		.del-and-edit {
 			margin-top: 6px;
 			justify-content: flex-end;
-			>view{
+
+			>view {
 				margin-left: 38rpx;
 			}
+
 			text {
 				margin-left: 4px;
 				color: #666666;
 			}
 		}
+
 		.text-area {
 			display: flex;
 			flex-direction: column;
 			justify-content: space-between;
-			> text {
+
+			>text {
 				font-size: 14px;
 			}
+
 			>view {
 				display: flex;
+
 				>view {
 					display: flex;
+
 					>view {
 						margin-right: 4px;
 					}
 				}
 			}
-			
-			.style2,.style3 {
+
+			.style2,
+			.style3 {
 				display: flex;
 				flex-direction: column;
 				color: #CC3333;
 				font-weight: 500;
+
 				.rent-and-cost {
-					text{
+					text {
 						margin-right: 26rpx;
 					}
+
 					margin-top: 5px;
 					padding-top: 5px;
 					padding-bottom: 6px;
 				}
-				.cart-and-pos{
-					> view{
+
+				.cart-and-pos {
+					>view {
 						margin-right: 50rpx;
 						display: flex;
 					}
+
 					display: flex;
 					border-top: 1px solid #f7f7f7;
 					padding-top: 5px;
 					margin-bottom: 5px;
 					justify-content: start;
 					font-weight: 500;
+
 					text {
 						color: #CC3333;
 						line-height: 12px;
 					}
 				}
 			}
+
 			.sqr-and-lx {
 				justify-content: space-between;
 				margin-top: 5px;
 				padding-bottom: 6px;
+
 				text {
 					color: #359867;
 					line-height: 12px;
 				}
+
 				.style3 {
 					color: #696969;
 				}
+
 				>view {
-					flex:1;
+					flex: 1;
 					display: flex;
+
 					>view {
 						margin-right: 4px;
 					}
 				}
 			}
+
 			.cart-and-date {
 				display: flex;
 				border-top: 1px solid #f7f7f7;
 				padding-top: 5px;
 				justify-content: space-between;
 				font-weight: 500;
+
 				text {
 					color: #CC3333;
 					line-height: 12px;

components/ShowShopList/ShowShopList.vue

@@ -1,15 +1,7 @@
 <template>
 	<view>
-		<ShowShopListItem 
-			v-for="item in shopInfoList"
-			:key="shopid"
-			:shopInfo="item"
-			:is-adshow="isADshow"
-			:adlinkPath="adlinkPath"
-			:show-style="showStyle"
-			:is-edit="isEdit"
-			@delItem="handleDel"
-		></ShowShopListItem>
+		<ShowShopListItem v-for="item in shopInfoList" :key="shopid" :shopInfo="item" :is-adshow="isADshow"
+			:adlinkPath="adlinkPath" :show-style="showStyle" :is-edit="isEdit" @delItem="handleDel"></ShowShopListItem>
 	</view>
 </template>
 
@@ -24,7 +16,7 @@
 	 * @property {Object}    customQuery      自定义查询参数
 	 */
 	export default {
-		name:"ShowShopList",
+		name: "ShowShopList",
 		data() {
 			return {
 				pageSize: 5,
@@ -33,54 +25,55 @@
 			};
 		},
 		props: {
-			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
 				}
 			},
 			// //获取列表类型传递参数部分
-			listType:{
+			listType: {
 				type: Number,
-				default() {
+				default () {
 					return 1
 				}
 			},
-			customQuery:{
+			customQuery: {
 				type: Object,
-				default() {
+				default () {
 					return {}
 				}
 			},
 			shopInfoList: {
 				type: Array,
-				default() {
+				default () {
 					return []
 				}
 			}
 		},
-		
+
 		methods: {
-			handleDel(shopid){
+			handleDel(shopid) {
 				console.log("删除了商铺", shopid);
+				this.$emit('delItem', shopid)
 				// const delindex = this.shopInfoList.findIndex((item,index)=> item.shopid === shopid)
 				// TODO：不能直接修改
 				// if(delindex !== -1)  this.shopInfoList = this.shopInfoList.slice(delindex,1)
@@ -93,17 +86,17 @@
 					pageNum: this.pageNum,
 					...this.customQuery
 				})
-				console.log("query",query);
+				console.log("query", query);
 				this.$api.getShopList(query).then(res => {
 					this.shopInfoList = res.data.data
-					this.shopInfoList.forEach(item=>{
-						item.pics =this.$api.imgUrl + item.pics
+					this.shopInfoList.forEach(item => {
+						item.pics = this.$api.imgUrl + item.pics
 					});
 
 				})
 			}
 		},
-		
+
 	}
 </script>
 

components/ShowShopListItem/ShowShopListItem.vue

@@ -2,7 +2,7 @@
 	<view class="list-border">
 		<view class="list-container" @click="enterDetail()">
 			<view class="shop-list-img">
-				<u-image :src="leftImage" width="80px" height="80px" radius="8px" :lazy-load="true"></u-image>
+				<u-image :src="leftImage" width="80px" height="80px" radius="8px"></u-image>
 			</view>
 			<view class="text-area">
 				<text style="font-weight: 500;">{{shopInfo.tt}}</text>