–首页添加预警信息、每日类型占比

pages/basics/home.vue

@@ -64,6 +64,40 @@
 				<canvas canvas-id="canvasColumn" id="canvasColumn" disable-scroll=true class="charts" @touchstart="touchColumn"></canvas>
 				<image :src="imgSrc2" style="width: 750upx;height: 500upx;"></image>
 			</view>
+			
+			<!-- 预警信息模块 -->
+			<view class="section-header">
+				<view class="header-icon">⚠️</view>
+				<view class="header-title">预警信息</view>
+			</view>
+			<view class="warning-stats">
+				<view class="warning-card warning-today">
+					<view class="warning-icon">🔔</view>
+					<view class="warning-value">{{warningInfo.today_warning || 0}}</view>
+					<view class="warning-label">今日预警数</view>
+				</view>
+				<view class="warning-card warning-history">
+					<view class="warning-icon">📋</view>
+					<view class="warning-value">{{warningInfo.history_warning || 0}}</view>
+					<view class="warning-label">历史预警数</view>
+				</view>
+				<view class="warning-card warning-handled">
+					<view class="warning-icon">✅</view>
+					<view class="warning-value">{{warningInfo.handled_warning || 0}}</view>
+					<view class="warning-label">已处理预警数</view>
+				</view>
+			</view>
+			
+			<!-- 每日类型占比模块 -->
+			<view class="section-header">
+				<view class="header-icon">📊</view>
+				<view class="header-title">每日类型占比</view>
+			</view>
+			<view class="qiun-charts">
+				<canvas canvas-id="canvasPie" id="canvasPie" disable-scroll=true class="charts" @touchstart="touchPie"></canvas>
+				<image :src="imgSrc3" style="width: 750upx;height: 500upx;"></image>
+			</view>
+			
 				<view class="cu-tabbar-height"></view>
 			</view>
 		</scroll-view>
@@ -76,6 +110,7 @@
 	var _self;
 	var canvaLineA=null;
 	var canvaColumn=null;
+	var canvaPie=null;
 	export default {
 		data() {
 			return {
@@ -93,8 +128,10 @@
 				phone: '',
 				hospitalBasisInfo: [],
 				stockBasisInfo: [],
+				warningInfo: [],
 				imgSrc: '',
-				imgSrc2: ''
+				imgSrc2: '',
+				imgSrc3: ''
 			}
 		},
 		mounted() {
@@ -128,12 +165,14 @@
 			this.getHospitalBasisInfo();
 			this.getStockBasisInfo();
 			this.getDepartmentRankList();
+			this.getWarningInfo();
+			this.getDailyTypeRatio();
 		},
 		methods: {
 			getServerData(){
 				let that = this;
 				uni.request({
-					 url: 'https://lekapi.opmonitor.com/?c=app_api&a=getMedicalData7Days',
+					 url: 'https://mtx.mini.opmonitor.com/?c=app_api&a=getMedicalData7Days',
 					data:{
 						hospital: that.hospital,
 						sortHospital: that.sortHospital,
@@ -232,7 +271,7 @@
 			getHospitalBasisInfo(){
 				let that = this;
 				uni.request({
-					url: 'https://lekapi.opmonitor.com/?c=app_api&a=getHospitalBasisInfo',
+					url: 'https://mtx.mini.opmonitor.com/?c=app_api&a=getHospitalBasisInfo',
 					data: {hospital: that.hospital,sortHospital: that.sortHospital,department: that.department,duty: that.duty},
 					header: {
 						'Content-type': 'application/json'
@@ -249,7 +288,7 @@
 			getStockBasisInfo(){
 				let that = this;
 				uni.request({
-					url: 'https://lekapi.opmonitor.com/?c=app_api&a=getStockBasisInfo',
+					url: 'https://mtx.mini.opmonitor.com/?c=app_api&a=getStockBasisInfo',
 					data: {hospital: that.hospital, sortHospital: that.sortHospital, department: that.department, duty: that.duty},
 					header: {
 						'Content-type': 'application/json'
@@ -266,7 +305,7 @@
 			getDepartmentRankList(){
 				let that = this;
 				uni.request({
-					url: "https://lekapi.opmonitor.com/?c=app_api&a=getDepartmentRankList",
+					url: "https://mtx.mini.opmonitor.com/?c=app_api&a=getDepartmentRankList",
 					data:{
 						hospital: that.hospital,
 						sortHospital: that.sortHospital,
@@ -368,6 +407,104 @@
 				uni.navigateTo({
 					url: "/pages/main/inventory_month"
 				})
+			},
+			// 获取预警信息
+			getWarningInfo(){
+				let that = this;
+				uni.request({
+					url: 'https://mtx.mini.opmonitor.com/?c=app_api&a=getWarningInfo',
+					data: {hospital: that.hospital, sortHospital: that.sortHospital, department: that.department, duty: that.duty},
+					header: {
+						'Content-type': 'application/json'
+					},
+					success: function(res){
+						that.warningInfo = res.data.data || {}
+					},
+					fail: () => {
+						console.info('获取预警信息失败')
+					}
+				})
+			},
+			// 获取每日类型占比
+			getDailyTypeRatio(){
+				let that = this;
+				uni.request({
+					url: 'https://mtx.mini.opmonitor.com/?c=app_api&a=getDailyTypeRatio',
+					data: {hospital: that.hospital, sortHospital: that.sortHospital, department: that.department, duty: that.duty},
+					header: {
+						'Content-type': 'application/json'
+					},
+					success: function(res) {
+						let Pie={series:[]};
+						Pie.series=res.data.data.series;
+						_self.showPie("canvasPie",Pie);
+					},
+					fail: () => {
+						_self.tips="网络错误，小程序端请检查合法域名";
+					}
+				})
+			},
+			showPie(canvasId,chartData){
+				canvaPie=new uCharts({
+					$this:_self,
+					canvasId: canvasId,
+					type: 'pie',
+					colors:['#4a90e2', '#1abc9c', '#e67e22', '#9b59b6', '#e74c3c'],
+					fontSize:11,
+					padding:[15,15,0,15],
+					legend:{
+						show:true,
+						padding:5,
+						lineHeight:11,
+						margin:0,
+						position:'bottom',
+						float:'center'
+					},
+					dataLabel:true,
+					background:'#FFFFFF',
+					pixelRatio:_self.pixelRatio,
+					series: chartData.series,
+					animation: true,
+					width: _self.cWidth*_self.pixelRatio,
+					height: _self.cHeight*_self.pixelRatio,
+					extra: {
+						pie:{
+							activeOpacity: 0.5,
+							activeRadius: 10,
+							offsetAngle: 0,
+							labelWidth: 15,
+							ringWidth: 0,
+							border: true,
+							borderWidth: 2,
+							borderColor: '#FFFFFF'
+						}
+					}
+				});
+				canvaPie.addEventListener('renderComplete', () => {
+					setTimeout(function(){
+						uni.canvasToTempFilePath({
+							x: 0,
+							y: 0,
+							width: _self.cWidth*_self.pixelRatio,
+							height: _self.cHeight*_self.pixelRatio,
+							fileType: 'png',
+							canvasId: 'canvasPie',
+							success: function(res) {
+								_self.imgSrc3=res.tempFilePath;
+							},
+							fail:function(res){
+								console.info(res)
+							}
+						},_self);
+					},50);
+				})
+			},
+			touchPie(e) {
+				canvaPie.showToolTip(e, {
+					format: function (item, category) {
+						return item.name + ':' + item.data + 'kg'
+					}
+				});
 			}
 		}
 	}
@@ -559,4 +696,80 @@
 		background: linear-gradient(135deg, #e74c3c 0%, #c0392b 100%);
 		box-shadow: 0 6rpx 24rpx rgba(231, 76, 60, 0.35);
 	}
+
+	/* 预警统计容器 */
+	.warning-stats {
+		display: flex;
+		justify-content: space-around;
+		padding: 30rpx 20rpx;
+		margin: 20rpx;
+		background: rgba(255, 255, 255, 0.95);
+		border-radius: 24rpx;
+		box-shadow: 0 8rpx 32rpx rgba(0, 0, 0, 0.12);
+		backdrop-filter: blur(10rpx);
+		border: 1px solid rgba(255, 255, 255, 0.6);
+	}
+
+	/* 预警卡片 */
+	.warning-card {
+		display: flex;
+		flex-direction: column;
+		align-items: center;
+		justify-content: center;
+		padding: 20rpx 16rpx;
+		border-radius: 20rpx;
+		width: 180rpx;
+		position: relative;
+		overflow: hidden;
+		transition: all 0.3s ease;
+	}
+
+	.warning-card::before {
+		content: '';
+		position: absolute;
+		top: -50%;
+		right: -50%;
+		width: 100%;
+		height: 100%;
+		background: radial-gradient(circle, rgba(255,255,255,0.2) 0%, transparent 70%);
+		border-radius: 50%;
+	}
+
+	.warning-icon {
+		font-size: 40rpx;
+		margin-bottom: 8rpx;
+		filter: drop-shadow(0 2rpx 8rpx rgba(0, 0, 0, 0.15));
+	}
+
+	.warning-value {
+		font-size: 44rpx;
+		font-weight: 800;
+		color: #fff;
+		margin-bottom: 4rpx;
+		text-shadow: 0 2rpx 8rpx rgba(0, 0, 0, 0.2);
+	}
+
+	.warning-label {
+		font-size: 22rpx;
+		color: rgba(255, 255, 255, 0.85);
+		font-weight: 500;
+	}
+
+	/* 今日预警 - 黄色 */
+	.warning-today {
+		background: linear-gradient(135deg, #f39c12 0%, #e67e22 100%);
+		box-shadow: 0 6rpx 24rpx rgba(243, 156, 18, 0.35);
+	}
+
+	/* 历史预警 - 橙色 */
+	.warning-history {
+		background: linear-gradient(135deg, #e67e22 0%, #d35400 100%);
+		box-shadow: 0 6rpx 24rpx rgba(230, 126, 34, 0.35);
+	}
+
+	/* 已处理预警 - 绿色 */
+	.warning-handled {
+		background: linear-gradient(135deg, #27ae60 0%, #1e8449 100%);
+		box-shadow: 0 6rpx 24rpx rgba(39, 174, 96, 0.35);
+	}
 </style>