初代测试版本

src/component/Detail/DesignDetailAlter.vue

@@ -107,7 +107,7 @@
 										class="select_category"
 										@click.stop="showFileCategory(file)"
 									>
-										{{ getSketchLabel(file.level2Type) }}
+										{{ file.level2Type }}
 										<div
 											:class="[
 												'icon',
@@ -143,6 +143,9 @@
 							</div>
                         </div>
                     </div>
+					<div v-show="total > clothesList.length" class="material_content_list_loding" v-observe>
+						<img src="@/assets/images/homePage/loading.gif" alt="">
+					</div>
                 </div>
                 <div class="no_data_block loading_block" v-show="isShowLoading">
                     <a-spin size="large"></a-spin>
@@ -297,6 +300,9 @@ export default defineComponent({
                     label: "Skirt",
                 },
             ]
+		let total = ref(0)
+        let pageSize = ref(10)
+        let currentPage = ref(1)
 
 		let isShowLoading = ref(false)
 		let clothesList = ref([])
@@ -318,6 +324,9 @@ export default defineComponent({
 			openClick,
 			searchPictureName,
 			disignTypeList,
+			total,
+			pageSize,
+			currentPage,
 			isShowLoading,
 			clothesList,
 			uploadList,
@@ -374,7 +383,30 @@ export default defineComponent({
 			workspaceCom:{}
         }
     },
-	
+	directives:{
+		observe:{
+			mounted (el,binding) {
+				// console.log(binding.instance);
+				const ob = new IntersectionObserver(callback,{
+					root:null,
+					threshold:[.5]
+				})
+				ob.observe(el)
+				// this.currentPage = 1
+				// this.pageSize = 12
+				let this_ = binding.instance
+				function callback(entries, observer) {
+					entries.forEach((entry) => {
+						if (entry.isIntersecting) {
+							console.log(11);
+							this_.getLibraryList()
+						} else {
+						}
+					});
+				}
+			},
+		},
+	},
 	computed:{
 		getSketchLabel(value) {
             return (value) => {
@@ -630,19 +662,23 @@ export default defineComponent({
         },
 		//请求我的印花&&模型
 		getLibraryList(){
+			let workspace = this.store.state.Workspace.workspace
             let data = {
                 level1Type:this.selectCode,
                 // level2Type:this.designType,
-                page:1,
+				modelSex:workspace?.sex,
+                page:this.currentPage,
                 pictureName:this.searchPictureName,
-                size:10,
+                size:this.pageSize+this.clothesList.length,
             }
             this.isShowLoading = true
 
             Https.axiosPost(Https.httpUrls.queryLibraryPage,data).then(
                 (rv) => {
+
 					this.clothesList = rv.content
                     this.isShowLoading = false
+                    this.total = rv.total
                 }
             ).catch((res)=>{
                 this.isShowLoading = false
@@ -990,6 +1026,13 @@ export default defineComponent({
 				&.scroll_style::-webkit-scrollbar{display: none;}
 
 			}
+			.material_content_list_loding{
+				text-align: center;
+				width: 100%;
+				img{
+					height: 10rem;
+				}
+			}
             .content_img_item{
                 display: inline-block;
                 vertical-align: top;