H5

2024-04-30 18:07:59 +08:00
parent b72c4d7af1
commit 56863dd624
1369 changed files with 156460 additions and 0 deletions
--- a/pages/index/businesscategory.vue
+++ b/pages/index/businesscategory.vue
@@ -0,0 +1,186 @@
+<template>
+	<view class="Box">
+		<view class="Box_top"><input placeholder="请输入开票服务名称" :showAction='false' :focus='true' v-model="keyword"
+				@input="onInput" />
+		</view>
+		<view class="nav">
+			<view class="nav-right">
+				<scroll-view scroll-y :scroll-top="scrollTop" @scroll="scroll" @scrolltolower="loadMores" :style="h"
+					scroll-with-animation>
+					<view class="nav-right-item" v-for="(item, index2) in subCategoryList" :key="index2"
+						@click="categorySubClick(item)">
+						<view>{{ item.name }}</view>
+					</view>
+				</scroll-view>
+			</view>
+		</view>
+		<view class="empty-wrap">
+			<!-- <view class="empty" v-if="!subCategoryList.length && loadStatus == 'nomore'"><u-empty text="暂无数据"
+					:icon="require('@/static/notice/icon_empty.png')"></u-empty></view>
+			<u-loadmore color="#999" :status="loadStatus" v-else></u-loadmore> -->
+		</view>
+	</view>
+</template>
+<script>
+	// import category from '@/components/qiyue-category/qiyue-category.vue';
+	export default {
+		// components: {
+		// 	category
+		// },
+		data() {
+			return {
+				current: 1,
+				size: 20,
+				page: 1,
+				keyWord: '',
+				subCategoryList: [],
+				loadStatus: 'nomore',
+				h: null,
+				namelang: '',
+				height: 0,
+				scrollTop: 0,
+				scrollHeight: 0,
+				categoryActive: 0,
+			};
+		},
+		onLoad() {},
+		mounted() {
+			this.computed_h();
+		},
+		onReachBottom() {
+			this.loadMores()
+		},
+		methods: {
+			onInput(e) {
+				// 【不用v-model绑定表单,直接时间获取值】这种方式是uni-app官方的方式,测试结果正确！
+				console.log(e.detail)
+				this.keyword = e.detail.value
+				if (e.detail.value) {
+					uni.$u.debounce(this.getOrder(), 500)
+				} else {
+					this.subCategoryList = []
+				}
+			},
+			async computed_h() {
+				//获取div宽度
+				try {
+					let content_Icon = await uni.utils.info_distance('Box_top');
+					let content_top_box = await uni.utils.info_distance('Box_text');
+					let system_info = await uni.pro.getSystemInfo();
+					var h_ = system_info.windowHeight - content_Icon.height - content_top_box.height - 45 + 'px';
+					this.h = {
+						height: h_
+					};
+				} catch (e) {
+					//TODO handle the exception
+				}
+			},
+			categorySubClick(category) {
+				uni.$emit("businesscategorys", category)
+				uni.cache.set('keyword', category.name)
+				uni.pro.navigateBack();
+			},
+
+			loadMores() {
+				if (this.loadStatus != 'nomore') {
+					this.loadStatus = 'loading'
+					this.page++;
+					this.getOrder();
+				}
+			},
+			searchkeyword(e) {
+				this.name = e
+				this.page = 1
+				this.getOrder()
+			},
+			async getOrder() {
+				uni.request({
+					url:  uni.conf.baseUrl  + 'store/industrylist',
+					data: {
+						//参数
+						name: this.keyword,
+						page: this.page
+					},
+					method: 'POST', //请求方式，必须为大写
+					success: res => {
+						setTimeout(() => {
+							if (this.page == 1) {
+								this.subCategoryList = res.data.msg;
+								this.loadStatus = 'loadmore'
+							} else {
+								this.subCategoryList.push(...res.data.msg);
+							}
+							if (res.data.msg.length == 20) {
+								this.loadStatus = 'loadmore';
+							} else {
+								this.loadStatus = 'nomore';
+							}
+							console.log('接口返回------', res);
+						}, 500)
+
+					}
+				});
+			}
+		},
+	};
+</script>
+<style lang="scss">
+	page {
+		background: #fff;
+	}
+
+	.Box {
+
+		.Box_top {
+			width: 100%;
+			background: #FFFFFF;
+			padding: 32rpx 28rpx;
+
+			input {
+				padding: 18rpx 16rpx;
+				width: 100%;
+				border: 2rpx solid #2F87FD;
+				border-radius: 36rpx 36rpx 36rpx 36rpx;
+			}
+		}
+
+		.nav {
+			display: flex;
+			width: 100%;
+
+			.nav-right {
+				width: 100%;
+
+				.nav-right-item {
+					width: 100%;
+					/* height: 100px; */
+					text-align: left;
+					padding: 24rpx 32rpx;
+					font-size: 13px;
+				}
+
+				.nav-right-item image {
+					width: 50px;
+					height: 50px;
+				}
+			}
+		}
+
+		.Box_text {
+			background: #F1F0F5;
+			padding: 10rpx 28rpx;
+			font-size: 28rpx;
+			font-family: Source Han Sans CN-Regular, Source Han Sans CN;
+			font-weight: 400;
+			color: #999999;
+
+			text {
+				margin-left: 16rpx;
+				font-size: 28rpx;
+				font-family: Source Han Sans CN-Medium, Source Han Sans CN;
+				font-weight: 500;
+				color: #333333;
+			}
+		}
+	}
+</style>