pika_shangjia/machineAndCell/cellSearch/cellSearch.vue

<template>
	<view style="overflow: hidden;">
		<view class="top-box">
			<view class="search-box ddflex">
				<image class="search-saoma" src="../../static/pages/images/saoma.png" @click="saomaFn()"></image>
				<view class="search-input ddflex fflex">
					<image class="search-input-icon" src="../../static/pages/images/search.png"></image>
					<input class="fflex" v-model="searchValue" confirm-type="search" @confirm="searchFn" placeholder="请输入编号查询"/>
					<view class="search-btn" @click="searchFn">搜索</view>
				</view>
			</view>
		</view>
		
		<view :style="'height: '+ (134) + 'rpx;'"></view>
		
		<!-- 电池 -->
		<view>
			<view class="cell-box" v-for="item,index in groupList">
				<view class="ddflex">
					<view style="margin-right: 35rpx;">
						<cell :width="99" :height="197" :soc="item.leaseStatus==1?50:100" :showsoc="false"></cell>
					</view>
					<view class="cell-info fflex">
						<view class="ddflex">
							<view class="cell-title">{{item.model}}</view>
							<view class="cell-state" :style="item.leaseStatus==1?'':'background-color: #0FCB27;'">{{item.leaseStatus==1?'已租':'空闲'}}</view>
						</view>
						<view class="cell-info  ddflex">
							<view>电池Id：</view>
							<view>{{item.batteryId}}</view>
						</view>
						<view class="cell-info  ddflex">
							<view>设备编号：</view>
							<view>{{item.number}}</view>
						</view>
						<view class="cell-info ddflex">
							<view>门店：</view>
							<view>{{item.storeName}}</view>
						</view>
						<view class="cell-info ddflex">
							<view>到期时间：</view>
							<view>{{item.blockDate}}</view>
						</view>
					</view>
				</view>
				<view class="cell-option ddflex">
					<view class="fflex" @click="jumpUrl('/machineAndCell/map/map?id='+item.batteryId)">定位</view>
					<view class="fflex" @click="jumpUrl('/machineAndCell/BMS/BMS?id='+item.batteryId)">BMS</view>
					<view class="fflex" @click="jumpUrl('/machineAndCell/cellDetail/cellDetail?id='+item.batteryId)">详情</view>
				</view>
			</view>
		</view>

	</view>
</template>

<script>
	const app = getApp();
	const req = require("../../utils/request.js");
	import cell from "../../components/cell/index";

	export default {
		components: {
			cell,
		},
		props: {},
		data() {
			return {
				systems: {},
				isTop:0,
				
				userInfo:{},
				
				showPop: false,
				tempData: null,
				
				groupList: [],
				page: 1,
				limit: 10,
				searchValue:'',
				isQuerying:false,//正在查询数据
				
				queryType:'',
				
				merchantList: [],
				merchantPage: 1,
				merchantLimit: 10,
				
				actMerchant:null,//当前门店
				
				count:{},
				
				storeId:null
			}
		},
		onLoad(options) {
			this.storeId = options.storeId
			if(options.searchValue){
				this.searchValue = options.searchValue
			}
			if(options.type){
				this.queryType = options.type
			}
			this.getMachineList()
		},
		onShow() {
		},
		onReachBottom() {
			this.getMachineList(true)
		},
		methods: {
			jumpUrl(url){
				if(req.isLogins(true)){
					uni.navigateTo({
						url:url
					})
				}
			},
			queryTypeChange(val) {
				if (this.queryType == val) return false
				this.queryType = val
				this.queryType = val==-1?'':val
				this.getMachineList()
			},
			// 获取电池列表
			getMachineList(isPage){
				if(this.isQuerying) return
				else this.isQuerying = true
				if (!isPage) {
					this.page = 1
				}
				let queryParams = {
					page: this.page,
					limit: this.limit,
				}
				if(this.searchValue){
					queryParams.number=this.searchValue
				}
				if(this.queryType){
					queryParams.type = this.queryType
				}
				queryParams.storeId = this.storeId
				req.getRequest(
					'/admin/v2/battery/page',
					queryParams,
					data => {
						if (data != null && data.list.length > 0) {
							if (!isPage) {
								this.groupList = data.list
							} else {
								this.groupList = this.groupList.concat(data.list)
							}
							this.page++
						} else {
							if (!isPage)
								this.groupList = data.list
							else {}
						}
						uni.hideLoading()
						this.isQuerying = false
					}
				)
			},
			searchFn(){
				this.getMachineList()
			},
			saomaFn(){
				// 只允许通过相机扫码
				uni.scanCode({
					onlyFromCamera: false,
					success: (res) =>{
						console.log('条码类型：' + res.scanType);
						console.log('条码内容：' + res.result);
						// did设备id
						this.searchValue = res.result
						this.searchFn()
					}
				});
			}
		},
		mounted() {
			const systemInfo = uni.getSystemInfoSync();
			// px转换到rpx的比例
			let pxToRpxScale = 750 / systemInfo.windowWidth;
			let systems = {
				ktxStatusHeight: systemInfo.statusBarHeight * pxToRpxScale, // 状态栏的高度
				navigationHeight: 44 * pxToRpxScale // 导航栏的高度
			};
			systems.barHeight = systems.ktxStatusHeight + systems.navigationHeight;
			this.systems = systems;
		},
		onPageScroll: function(e) {
			if (e.scrollTop > this.systems.barHeight) {
				this.isTop = 1;
			} else {
				this.isTop = 0;
			}
		}
	}
</script>

<style>
	@import "./cellSearch.css";
</style>