yxy/uniapp/pages/index/console.vue

<template>
	<view class="con_box" v-if="consoleData.code==1">
		<view class="con_title">
			借单数量
		</view>
		<uv-line></uv-line>
		<view class="con_neiro">
			<view class="con_neiro_box">
				<view class="con_neiro_shu">
					{{consoleData.data.apply}}
				</view>
				<view class="con_neiro_font">
					待审批借单
				</view>
			</view>
			<view class="con_neiro_box">
				<view class="con_neiro_shu">
					{{consoleData.data.useing}}
				</view>
				<view class="con_neiro_font">
					使用中借单
				</view>
			</view>
			<view class="con_neiro_box">
				<view class="con_neiro_shu">
					{{consoleData.data.overdue}}
				</view>
				<view class="con_neiro_font">
					逾期借单
				</view>
			</view>
		</view>
	</view>
	<view class="con_box"  v-if="consoleData.code==1">
		<view class="con_title">
			仪器数量
		</view>
		<uv-line></uv-line>
		<view class="con_neiro">
			<view class="con_neiro_box con_neiro_box2">
				<view class="con_neiro_shu">
					{{consoleData.data.asset_count}}
				</view>
				<view class="con_neiro_font">
					仪器总数
				</view>
			</view>
			<view class="" style="font-size: 28rpx;">
				<view class="con_neiro_box3">
					<view class="con_neiro_hen">
						<text class="con_neiro_hen1">仪器借出</text>
						<text>{{consoleData.data.asset_lent}}</text>
					</view>
				</view>	
				<view class="con_neiro_box3">
					<view class="con_neiro_hen">
						<text class="con_neiro_hen1">损坏仪器</text>
						<text>{{consoleData.data.damage_num}}</text>
					</view>
				
				</view>
				
			</view>
			<view class="" style="font-size: 28rpx;">
				<text class="con_neiro_hen5">仪器总价值</text>
				<text>{{consoleData.data.asset_value}}(元)</text>
			</view>
		</view>
	</view>


</template>

<script setup>
	import {
		ref
	} from 'vue'
	import {
		requestApi
	} from '@/api/request.js'
	// onShow是uni-app中的一个全局生命周期函数，当页面从后台进入前台显示时会被触发。
	import {
		onShow,
		onLoad
	} from '@dcloudio/uni-app'
	const consoleData = ref([])
	onLoad(async () => {
		wx.showLoading({
		  title: '加载中',
		})
		const res = await requestApi('admin/borrow.borrowApp/consoleInformation?server=1')
		wx.hideLoading()
		// console.log(res)
		consoleData.value = res
		// console.log(consoleData.value)
	})
	
</script>

<style  lang="less">
	page{
		background-color:  rgb(244,245,249);
	}
	.con_box{
		margin: auto;
		width: 84%;
		background-color: #fff;
		height: 240rpx;
		border-radius: 20rpx;
		padding: 20rpx 30rpx;
		margin-top:30rpx;
	}
	.con_title{
		margin-bottom: 20rpx;
		font-weight: 600;
		font-size: 32rpx;
	}
	.con_neiro_box{
		float: left;
		width: 33.3%;
		text-align: center;
		margin-top: 30rpx;
	}
	.con_neiro_shu{
		font-size: 70rpx;
	}
	.con_neiro_font{
		font-size: 30rpx;
	}
	.con_neiro_box2{
		border-right: 1rpx solid #d6d7d9;
	}
		
	.con_neiro_box3{
		float: left;
		width: 31.3%;
		// text-align: center;
		margin-top: 30rpx;
		padding-left: 10rpx;
	}
	.con_neiro_hen{
		margin: 20rpx 0;
	}
	.con_neiro_hen1{
		color: rgb(125,136,141);
		margin-right: 15rpx;
	}
	.con_neiro_hen5{
		color: rgb(125,136,141);
		margin-right: 15rpx;
		padding-left: 10rpx;
	}
</style>