liuning/mwims-mtx-mini-program
1
0
Fork 0
Code Issues 1 Pull Requests Actions Packages Projects Releases Wiki Activity

小程序完成（账号密码登录、风格修改、签字功能）

Browse Source
This commit is contained in:
liuning
2026-03-06 18:47:52 +08:00
parent 6f7604897f
commit 96be55b0be
13 changed files with 1173 additions and 186 deletions
Download Patch File Download Diff File Expand all files Collapse all files
pages/basics/home.vue
+224 -74
View File
@@ -1,82 +1,71 @@
<template name="basics">
<view>
<scroll-view scroll-y class="page">
<cu-custom bgColor="bg-cyan"><block slot="content">首页</block></cu-custom>
<view class="cu-bar bg-white">
<view class="action">
<text class="cuIcon-title text-green"></text>
<text>医院基本信息</text>
<cu-custom bgColor="bg-blue"><block slot="content">首页</block></cu-custom>
<view class="content-area">
<view class="section-header first-section">
<view class="header-icon">🏥</view>
<view class="header-title">医院基本信息</view>
</view>
</view>
<view class="grid col-3 padding-sm">
<view class="padding-sm">
<view class="padding radius text-center shadow-blur bg-blue" @click="buttonClickToday">
<!-- <view class="text-lg" v-if="hospitalBasisInfo.today_collection === undefined ">0kg</view> -->
<view class="text-lg">{{hospitalBasisInfo.today_collection}}kg</view>
<view class="margin-top-sm text-Abc">今日收集</view>
<!-- 今日/本周/本月收集数据 -->
<view class="collection-stats">
<view class="stat-card stat-today" @click="buttonClickToday">
<view class="stat-icon">📅</view>
<view class="stat-value">{{hospitalBasisInfo.today_collection || 0}}</view>
<view class="stat-unit">kg</view>
<view class="stat-label">今日收集</view>
</view>
<view class="stat-card stat-week" @click="buttonClickWeek">
<view class="stat-icon">📊</view>
<view class="stat-value">{{hospitalBasisInfo.week_collection || 0}}</view>
<view class="stat-unit">kg</view>
<view class="stat-label">本周收集</view>
</view>
<view class="stat-card stat-month" @click="buttonClickMonth">
<view class="stat-icon">📈</view>
<view class="stat-value">{{hospitalBasisInfo.month_collection || 0}}</view>
<view class="stat-unit">kg</view>
<view class="stat-label">本月收集</view>
</view>
</view>
<view class="padding-sm">
<view class="padding radius text-center shadow-blur bg-cyan" @click="buttonClickWeek">
<view class="text-lg">{{hospitalBasisInfo.week_collection}}kg</view>
<view class="margin-top-sm text-Abc">本周收集</view>
</view>
<view class="section-header">
<view class="header-icon">📉</view>
<view class="header-title">一周数据变化图</view>
</view>
<view class="padding-sm">
<view class="padding radius text-center shadow-blur bg-red" @click="buttonClickMonth">
<view class="text-lg">{{hospitalBasisInfo.month_collection}}kg</view>
<view class="margin-top-sm text-Abc">本月收集</view>
</view>
</view>
</view>
<view class="cu-bar bg-white margin-top">
<view class="action">
<text class="cuIcon-title text-green"></text>
<text>一周数据变化图</text>
</view>
</view>
<view class="qiun-charts">
<canvas canvas-id="canvasLineA" id="canvasLineA" disable-scroll=true class="charts" :width="cWidth*pixelRatio" :height="cHeight*pixelRatio" @touchstart="touchLineA"></canvas>
<image :src="imgSrc" style="width: 750upx;height: 500upx;"></image>
</view>
<!-- <canvas canvas-id="canvas1" class="canvas" disable-scroll="true"></canvas> -->
<view class="cu-bar bg-white margin-top">
<view class="action">
<text class="cuIcon-title text-green"></text>
<text>医废库存</text>
<view class="section-header">
<view class="header-icon">📦</view>
<view class="header-title">医废库存</view>
</view>
</view>
<view class="grid col-3 padding-sm">
<view class="padding-sm">
<view class="padding radius text-center shadow-blur bg-blue">
<view class="text-lg">{{stockBasisInfo.now_stock}}kg</view>
<view class="margin-top-sm text-Abc">当前库存</view>
<!-- 今日入库/今日出库 -->
<view class="stock-stats">
<view class="stat-card stat-in">
<view class="stat-icon">📥</view>
<view class="stat-value">{{stockBasisInfo.today_in_ware || 0}}</view>
<view class="stat-unit">kg</view>
<view class="stat-label">今日入库</view>
</view>
<view class="stat-card stat-out">
<view class="stat-icon">📤</view>
<view class="stat-value">{{stockBasisInfo.today_out_ware || 0}}</view>
<view class="stat-unit">kg</view>
<view class="stat-label">今日出库</view>
</view>
</view>
<view class="padding-sm">
<view class="padding radius text-center shadow-blur bg-cyan">
<view class="text-lg">{{stockBasisInfo.today_in_ware}}kg</view>
<view class="margin-top-sm text-Abc">今日入库</view>
</view>
<view class="section-header">
<view class="header-icon">🏆</view>
<view class="header-title">科室排行</view>
</view>
<view class="padding-sm">
<view class="padding radius text-center shadow-blur bg-red">
<view class="text-lg">{{stockBasisInfo.today_out_ware}}kg</view>
<view class="margin-top-sm text-Abc">今日出库</view>
</view>
</view>
</view>
<view class="cu-bar bg-white margin-top">
<view class="action">
<text class="cuIcon-title text-green"></text>
<text>科室排行</text>
</view>
</view>
<view class="qiun-charts" >
<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="cu-tabbar-height"></view>
<view class="cu-tabbar-height"></view>
</view>
</scroll-view>
</view>
</template>
@@ -121,11 +110,11 @@
}
});
//#endif
// if(getApp().globalData.openid == '' || getApp().globalData.openid == undefined){
// uni.reLaunch({
// url: '/pages/register/registerRegulatory'
// })
// }
if(getApp().globalData.hospital == '' || getApp().globalData.hospital == undefined){
uni.reLaunch({
url: '/pages/register/login'
})
}
this.cWidth=uni.upx2px(750);
this.cHeight=uni.upx2px(500);
this.hospital = getApp().globalData.hospital;
@@ -175,7 +164,7 @@
$this:_self,
canvasId: canvasId,
type: 'line',
colors:['#f04864', '#facc14', '#8543e0', '#90ed7d'],
colors:['#4a90e2', '#1abc9c', '#e67e22', '#9b59b6'],
fontSize:11,
padding:[15,15,0,15],
legend:{
@@ -193,13 +182,13 @@
animation: true,
xAxis: {
type:'grid',
gridColor:'#CCCCCC',
gridColor:'#E8F4F8',
gridType:'dash',
dashLength:8
},
yAxis: {
gridType:'dash',
gridColor:'#CCCCCC',
gridColor:'#E8F4F8',
dashLength:8,
format:(val)=>{return val.toFixed(0)}
},
@@ -207,7 +196,8 @@
height: _self.cHeight*_self.pixelRatio,
extra: {
line:{
type: 'straight'
type: 'curve',
width: 3
}
}
});
@@ -313,9 +303,11 @@
disableGrid:true,
},
yAxis: {
//disabled:true
gridColor:'#E8F4F8',
gridType:'dash',
dashLength:8,
splitLine: {
show: false
show: true
},
format:(val)=>{return val.toFixed(0)}
},
@@ -325,7 +317,10 @@
extra: {
column: {
type:'group',
width: _self.cWidth*_self.pixelRatio*0.45/chartData.categories.length
width: _self.cWidth*_self.pixelRatio*0.5/chartData.categories.length,
linearType:'custom',
linearOpacity:0.8,
customColor:[['#4a90e2', '#357abd']]
}
}
});
@@ -379,34 +374,189 @@
</script>
<style>
.page {
background: #f5f5f5;
}
.content-area {
background: #f5f5f5;
}
.first-section {
margin-top: 10rpx;
}
/* 区块标题样式 */
.section-header {
display: flex;
align-items: center;
margin: 30rpx 20rpx 20rpx 20rpx;
padding: 24rpx 30rpx;
background: linear-gradient(135deg, #4a90e2 0%, #357abd 100%);
border-radius: 20rpx;
box-shadow: 0 6rpx 24rpx rgba(74, 144, 226, 0.3);
position: relative;
overflow: hidden;
}
.section-header::before {
content: '';
position: absolute;
top: -50%;
right: -20%;
width: 200rpx;
height: 200rpx;
background: radial-gradient(circle, rgba(255,255,255,0.15) 0%, transparent 70%);
border-radius: 50%;
}
.header-icon {
font-size: 44rpx;
margin-right: 20rpx;
filter: drop-shadow(0 2rpx 8rpx rgba(0, 0, 0, 0.15));
position: relative;
z-index: 1;
}
.header-title {
font-size: 32rpx;
font-weight: 700;
color: #fff;
text-shadow: 0 2rpx 8rpx rgba(0, 0, 0, 0.2);
position: relative;
z-index: 1;
letter-spacing: 2rpx;
}
.section-title {
margin-top: 20rpx;
}
.box {
margin: 20upx 0;
}
.box view.cu-bar {
margin-top: 20upx;
}
.text-custom {
font-weight: 600;
font-size: 30rpx;
}
.qiun-charts {
margin: 20upx 0;
margin: 20upx;
width: 750upx;
height: 500upx;
background-color: #FFFFFF;
}
.charts {
width: 750upx;
height: 500upx;
background-color: #FFFFFF;
}
canvas{
position: absolute;
width: 100%;
right: -900px;
top: -600px;
}
/* 统计数据容器 */
.collection-stats, .stock-stats {
display: flex;
justify-content: space-around;
padding: 40rpx 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);
}
/* 统计卡片 */
.stat-card {
display: flex;
flex-direction: column;
align-items: center;
justify-content: center;
padding: 24rpx 20rpx;
border-radius: 20rpx;
width: 200rpx;
position: relative;
overflow: hidden;
transition: all 0.3s ease;
}
.stat-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%;
}
.stat-icon {
font-size: 44rpx;
margin-bottom: 8rpx;
filter: drop-shadow(0 2rpx 8rpx rgba(0, 0, 0, 0.15));
}
.stat-value {
font-size: 48rpx;
font-weight: 800;
color: #fff;
margin-bottom: 4rpx;
text-shadow: 0 2rpx 8rpx rgba(0, 0, 0, 0.2);
}
.stat-unit {
font-size: 22rpx;
color: rgba(255, 255, 255, 0.8);
font-weight: 500;
margin-bottom: 6rpx;
}
.stat-label {
font-size: 24rpx;
color: rgba(255, 255, 255, 0.85);
font-weight: 500;
}
/* 今日收集卡片 - 蓝色 */
.stat-today {
background: linear-gradient(135deg, #4a90e2 0%, #357abd 100%);
box-shadow: 0 6rpx 24rpx rgba(74, 144, 226, 0.35);
}
/* 本周收集卡片 - 青色 */
.stat-week {
background: linear-gradient(135deg, #1abc9c 0%, #16a085 100%);
box-shadow: 0 6rpx 24rpx rgba(26, 188, 156, 0.35);
}
/* 本月收集卡片 - 紫色 */
.stat-month {
background: linear-gradient(135deg, #9b59b6 0%, #8e44ad 100%);
box-shadow: 0 6rpx 24rpx rgba(155, 89, 182, 0.35);
}
/* 今日入库卡片 - 橙色 */
.stat-in {
background: linear-gradient(135deg, #e67e22 0%, #d35400 100%);
box-shadow: 0 6rpx 24rpx rgba(230, 126, 34, 0.35);
}
/* 今日出库卡片 - 红色 */
.stat-out {
background: linear-gradient(135deg, #e74c3c 0%, #c0392b 100%);
box-shadow: 0 6rpx 24rpx rgba(231, 76, 60, 0.35);
}
</style>