zd_wechatApp/pages/noLogin/regulatorBoxList.vue

<template>
	<view>
		<image src="/static/icon/background-from.png" mode="" class="background"></image>
		<view>
			<view class="sousuo">
				<u-search  placeholder="调压箱名称" @search="getProjectList()" v-model="name"  :show-action="false"></u-search>
				<!-- <u-select v-model="showName" :list="workList"  label-name="name" value-name="id" @confirm="worker()" @cancel="cancelWorker()"></u-select> -->
					<u-search placeholder="调压箱编号" v-model="code"  :show-action="false" :action-style="{'font-size':'40rpx'}" 
						@search="getProjectList()"></u-search>
						<u-search placeholder="管理所编号" v-model="administrativeOffice"  :show-action="false" :action-style="{'font-size':'40rpx'}"
							@search="getProjectList()"></u-search>
			</view>

			<view v-for="(item,index) in list" :key="index">
				<view class="project-content houseList" @click="gotoindex(item)">
					<view class="font-forty-eight houseList_in">
						<view style="display: flex;flex-direction: column;">
						<span>调压箱名称:{{item.name}}</span>
						<span>调压箱编号:{{item.code}}</span>
						<span>管理所:{{item.administrativeOffice}}</span>
						</view>
						<u-icon name="arrow-right"></u-icon>
					</view>
				</view>
			</view>
		</view>
	</view>
	</view>
</template>

<script>
	import service from '@/api/index.js'
	export default {
		data() {
			return {
				params: {
					year: true,
					month: true,
					day: true,
					hour: true,
					minute: false,
					second: false
				},
				showName:false,
				showTime: false,
				list: [],
				workList: [],
				value: '',
				nameValue: '',
				name:'',
				userName:'',
				civilPower: '',
				form:{},
				userId:'',
				code:'',administrativeOffice:''
			}
			
		},
		onLoad() {
			this.getProjectList();
			this.getUserName();
			this.getWorker();
			uni.setNavigationBarColor({
			    frontColor: '#ffffff',
			    backgroundColor: '#2d95f4',
			})
		},
		methods: {
			getWorker()
			{
				service.getWorker().then(res => {
					this.workList=res
				})
			},
			worker(e)
			{
				this.userName=e[0].label
				this.userId=e[0].value
				this.getProjectList()
			},
			cancelWorker()
			{
				this.userName=''
				this.userId=''
			},
			time(e)
			{
				 this.form.time=e
			},
			gotoindex(item) {
				console.log(item)
				uni.navigateTo({
					url:`/pages/noLogin/PressureRegulatingBox/PressureRegulatingBox?code=${item.code}&name=${item.name}&administrativeOffice=${item.administrativeOffice}`
				})
			},
			topage(url) {
				uni.navigateTo({
					url
				})
			},
			getProjectList() {
				this.list=[]
				service.getregulatorBoxList({name:this.name,code:this.code,administrativeOffice:this.administrativeOffice}).then(res => {
					console.log('getregulatorBoxList', res)
					if (res.length == 0) {
						this.$UTILS.showPrompt('暂无项目!')
					}
					this.list = res
				})
			},
			getUserName() {
				service.getUserName().then(res => {
					this.civilPower = res.civilPower;
				})
			},
		},
	}
</script>

<style lang="scss" scoped>
	.background {
		z-index: -1;
		position: fixed;
		width: 100%;
		height: 100%;
		background-size: 100% 100%;
	}

	.project {
		border-radius: 72rpx;
		padding: 25rpx 0;
		text-align: center;
		margin: 170rpx 55rpx 0;
	}

	.project-content {
		width: 90%;
		margin: 40rpx auto;
		padding: 30rpx 20rpx;
		border-radius: 20rpx;
		background: #edf5ff;
		box-shadow: 0rpx 6rpx 8rpx #d3e6ff;
	}
	.houseList_in{
		display: flex;
		justify-content:space-between;
		align-items:center;
		color: #cbcbcb;
		font-size: 38rpx;
	}
	.houseList_in span{
		font-size: 36rpx;
		color: #333;
	}
	.sousuo{
		display: flex;
		justify-content:space-between;
		align-items:center;
	}
	.position {
		position: absolute;
		bottom: 100rpx;
		right: 50rpx;

		.arrow {
			width: 152rpx;
			height: 152rpx;
			border-radius: 50%;
			padding: 25rpx;
			margin-left: 20rpx;
		}
	}

</style>