ZhiYeJianKang_ZhiFa_APP/pages/information/information.vue

<template>
	<view class="app">
		<view class="top">
			<view class="inputs">
				<i class="icon"></i>
				<input v-model="qyName" type="text" name="" id="" class="input" placeholder="请输入企业名称">
			</view>
			<view class="query" @tap='info()'>
				搜索
			</view>
		
		</view>
		<view class="items">
			<uni-table border stripe emptyText="">
				<uni-tr class='toptr'>
					<uni-th width="90" align="center">企业名称</uni-th>
					<uni-th width="90" align="center">区县</uni-th>
					<uni-th width="90" align="center">乡镇/街道</uni-th>
					<uni-th width="110" align="center">操作</uni-th>
				</uni-tr>
				<uni-tr v-for="(item,index) in list" :key='index' class='tr'>
					<uni-td align="center">{{item.companyName}}</uni-td>
					<uni-td align="center">{{item.atAreaName}}</uni-td>
					<uni-td align="center">{{item.atStreetName}}</uni-td>
					<uni-td align="center">
						<view class="" style="color: #169BD5;" @tap="report(item)">详情

						</view>
					</uni-td>

				</uni-tr>
			</uni-table>
		</view>
		<u-back-top :scroll-top="scrollTop"></u-back-top>
	</view>

	</view>
</template>

<script>
	import {
		getQyListDataAll,
	} from '@/api/information/information.js'
	import baseUrl from '@/api/baseurl.js'
	export default {
		data() {
			return {
				list: null,
				scrollTop: 0,
				enterprisId: '',
				qyName: '',
				page: 1,
				limit: 10,
				count: null,
			}

		},
		// 返回顶部
		onPageScroll(e) {
			this.scrollTop = e.scrollTop;
		},
		onLoad() {

			this.info()

		},
		methods: {
			// 查看报告
			report(item) {
				console.log('11', item)
				// var enterprisId= item.id
				uni.navigateTo({
				    url: `/pages/details/details?enterprisId=${item.id}`
				})
			},
		
		
			info() {
				this.page = 1;
				// this.wordsName = ''
				getQyListDataAll(this.page, this.limit,this.qyName).then(res => {
					this.list = res.data
					this.count = res.count
				})
			},
		},
		onReachBottom() { //下滑加载
			if (this.list.length >= this.count) {} else {
				this.page++;
				getQyListDataAll(this.page, this.limit,this.qyName).then(res => {
					res.data.forEach(e => {
						this.list.push(e)
					})
					this.count = res.count
				})
			}
		},
		onPullDownRefresh() { //下拉刷新
		console.log('111111')
			this.page = 1;
			// this.keyword = '甲类'
			// this.value = 1
			// this.title = '甲类'
			getQyListDataAll(this.page, this.limit,this.qyName).then(res => {
				this.list = res.data
				this.count = res.count
			})
			setTimeout(function() {
				uni.stopPullDownRefresh();
			}, 1000);
		},

	}
</script>

<style lang="scss">
	//css函数 声明函数
	    @function tovmin($rpx){//$rpx为需要转换的字号
	        @return #{$rpx * 100 / 750}vmin; 
			}
	::v-deep .uni-table {
		min-width: 100% !important;
	}
	::v-deep .u-iconfont::before{
		font-size: tovmin(10);
	
	}
	::v-deep .uni-table-td{
			// background-color: red;
		padding: tovmin(35) tovmin(10) !important;
		
		
	}
	::v-deep .u-back-top{
		    width:tovmin(84) !important;
		    height: tovmin(84) !important;
		
	}
	

	// ::v-deep .uni-table-td{
	// 	background-color: red;/
	// 	height: 50rpx;
	// 	line-height: 50rpx;
	// }

	.app {
		// padding: 0 0 100rpx;
		margin-top: tovmin(10);
		height: 100%;
		position: relative;

		.topbody {
			display: flex;

			// background-color: red;
			.text {
				font-size: tovmin(30);

				text-align: center;
				height: tovmin(80);
				line-height: tovmin(80);
				// margin-top: 1rpx;
			}
		}

		.items {
			width: 98%;
			margin: tovmin(10) auto;
			padding-bottom: 0rpx;
			position: absolute;
			top: tovmin(120);


			.toptr {}
		}

		.radio {
			// background-color: red;
			// margin-left: 10rpx;
			width: 20%;

		}

		.radio::v-deep .u-dropdown__content__mask {
			background: none;
		}

		.query {
			font-size: tovmin(24);
			background-color: #169BD5;
			width: 17%;
			border-radius: tovmin(20);
			height: tovmin(65);
			line-height: tovmin(65);
			text-align: center;
			color: #Ffffff;
			position: absolute;
			top: tovmin(30);
			left: 60%;
		}

		.top {
			height: 10%;
			position: relative;
			// left: tovmin(170);
			// top: tovmin(-100);
		}
		.statistics{
			width: 100%;
			color: #169BD5;
			position: absolute;
			left: 4%;
		}

		.inputs {
			box-shadow: tovmin(0) tovmin(9) tovmin(31) tovmin(9) rgba(0, 0, 0, 0.03);
			border: 1px solid #f0f0f0;
			width: 52%;
			height: tovmin(65);
			margin: tovmin(30) 0 tovmin(10) 5%;
			// transform: translateX(-50%);
			border-radius: tovmin(20);
			background-color: #Ffffff;
			z-index: 999;
			float: left;
			position: relative;

			.input {
				margin: 0 auto;
				position: absolute;
				height: tovmin(62);
				left: 15%;
				width: 80%;
				font-size: tovmin(26);
				color: #000000;
			}

			.icon {
				background: url(@/static/sousuo.png) no-repeat;
				width: tovmin(30);
				height: tovmin(28);
				background-size: cover;
				position: absolute;
				top: 50%;
				transform: translateY(-50%);
				left: 3%;
			}
		}
	}
</style>