Browse Source

no message

sys 2 years ago
parent
commit
7f52d8f2f4

+ 6 - 0
api/goods.js

@@ -0,0 +1,6 @@
+import { request } from './ajax.js'
+// 商品模块路由
+const goodsUrl = '/api/goods/'
+// 猜你喜欢
+export const likeGoods = (data) => request(goodsUrl + 'like_goods', 'post', { ...data })
+

+ 85 - 56
components/en-list/en-list.vue

@@ -1,66 +1,95 @@
 <template>
-	<view class="list">		
-		<Blank v-if="false"></Blank>
-		<view class="scroll-view" v-else>
-			<scroll-view scroll-y="true" style="height: 100%;" @scrolltolower="onReachScollBottom">
-				<slot name="listInfo"></slot>
-				<view class="toMore" v-show="list.length<this.total">加载更多</view>
-			</scroll-view>
-		</view>
-		
-	</view>
+  <view class="list">
+    <Blank v-if="list.length<0"></Blank>
+    <view class="scroll-view" v-else>
+      <scroll-view class="scroll-list" scroll-y="true" style="height: 100%;" @scrolltolower="onReachScollBottom">
+        sadasdsakjdjaks
+        <slot name="listInfo" v-bind:pagingData="list"  ></slot>
+
+<!--          <slot name="listInfo" v-for="(item,itemKey) in list"></slot>-->
+        <view class="toMore" v-show="list.length<this.total">加载更多</view>
+      </scroll-view>
+    </view>
+
+  </view>
 </template>
 
 <script>
-	import Black from '@/components/en-utils/en-blank.vue'
+import Blank from 'components/en-utils/en-blank/en-blank'
 
-	export default {
-		components: {Blank},
-		data() {
-			return {
-				list:[],
-				page:1,
-				total:null,
-				status:'',
-			}
-		},
-		mounted() {
+export default {
+  components: {Blank},
+  data() {
+    return {
+      list: [],
+      page: 1,
+      total: null,
+      isAjax: false,
+    }
+  },
+  mounted() {
+    this.getList()
+  },
+  methods: {
+    onReachScollBottom() {
+      if (this.isAjax || this.list.length === this.total) {
+        return
+      }
+      this.getList()
+    },
+    getList() {
+      this.isAjax = true
+      this.$emit('getList',this.page)
+    },
+    startList() {
+      this.list = []
+      this.page = 1
+      this.isAjax = false
+    },
+    setList(list, total) {
+      list.forEach((item) => {
+        console.log(item)
+        this.list.push(item)
+      })
+      this.total = total
+      this.isAjax = false
+      ++this.page;
+    }
 
-		},
-		methods:{
-			onReachScollBottom(){
-				if(this.list.length == this.total){
-					return
-				}else{
-					
-				}
-			},
-		},
-	}
+  },
+}
 </script>
 
 <style scoped lang="scss">
-	.list{
-		height: 100%;
-		display: flex;
-		flex-direction: column;
-		.scroll-view{
-			flex: 1;
-			overflow: auto;
-		}
-		.toMore{
-			color: #999;
-			font-size: 20rpx;
-			margin: 25rpx 0;
-			text-align: center;
-		}
-		::-webkit-scrollbar {
-			display: none;
-			width: 0;
-			height: 0;
-			background-color: transparent;
-		}
-		
-		
-	}
+.list {
+  height: 100%;
+  display: flex;
+  flex-direction: column;
+
+  .scroll-view {
+    flex: 1;
+    overflow: auto;
+
+    .scroll-list {
+      width: 100%;
+      max-height: 100vh;
+    }
+  }
+
+  .toMore {
+    color: #999;
+    font-size: 20rpx;
+    margin: 25rpx 0;
+    text-align: center;
+  }
+
+  ::-webkit-scrollbar {
+    display: none;
+    width: 0;
+    height: 0;
+    background-color: transparent;
+  }
+
+
+}
 </style>

+ 1 - 1
components/en-utils/en-blank/en-blank.vue

@@ -32,7 +32,7 @@
 			},
 			message: {
 				type: String,
-				default: '暂无信息!!'
+				default: '暂无数据!'
 			},
 			buttonText: {
 				type: String,

+ 1 - 1
pages/index/index.vue

@@ -14,7 +14,7 @@
 		<enUpload v-model="imgs" ></enUpload>
 
 
-<!--		<view class="" @click="toList()">进入列表演示</view>-->
+		<view class="" @click="toList()">进入列表演示</view>
 	</view>
 
 </template>

+ 22 - 1
pages/text/index.vue

@@ -1,17 +1,38 @@
 <template>
 	<view>
 		<Nav title="列表组件演示"></Nav>
-		<Black></Black>
+		<pagingList ref="likeGoodsList" @getList="getGoodsList">
+      <template v-slot:listInfo="{pagingData}">
+        <view v-for="item in pagingData">
+          <view>{{item.good_name}}</view>
+          <view>{{item.price}}</view>
+          <view>{{item.good_name}}</view>
+          <view>{{item.good_name}}</view>
+        </view>
+      </template>
+    </pagingList>
 	</view>
 </template>
 
 <script>
 	import Black from '@/components/en-utils/en-blank/en-blank'
+	import pagingList from '@/components/en-list/en-list'
+  import {likeGoods} from "@/api/goods";
 
 	export default {
 		components:{
 			Black,
+      pagingList,
 		},
+    methods:{
+      getGoodsList(page){
+          likeGoods({'page':page}).then((res)=>{
+            if(res.code===1){
+              this.$refs.likeGoodsList.setList(res.data.list,res.data.total)
+            }
+          })
+      }
+    }
 	}
 </script>