库管端主页

App.vue

@@ -1,7 +1,6 @@
 <style lang="scss">
 	/* 注意要写在第一行，同时给style标签加入lang="scss"属性 */
 	@import "@/uni_modules/uview-ui/index.scss";
-	// @import '@/assets/font/font.css';
 	
 </style>
 <script>

assets/font/font.css

@@ -2,7 +2,7 @@
 
     font-family: 'Bold';
 
-    src: url('http://www.jsrailway.com.cn/railroad-phone-font/SourceHanSerifSC-SemiBold.otf');
+    src: url('SourceHanSerifSC-Bold.otf');
 
     font-weight: normal;  
 
@@ -13,8 +13,8 @@
   @font-face {  
 
     font-family: 'Medium';
-    src: url('http://www.jsrailway.com.cn/railroad-phone-font/SourceHanSerifSC-SemiBold.otf');
 
+    src: url('SourceHanSerifSC-Medium.otf');
 
     font-weight: normal;  
 
@@ -26,7 +26,7 @@
 
     font-family: 'SemiBold';
 
-    src: url('http://www.jsrailway.com.cn/railroad-phone-font/SourceHanSerifSC-SemiBold.otf');
+    src: url('SourceHanSerifSC-SemiBold.otf');
 
     font-weight: normal;  
 
@@ -37,7 +37,7 @@
 
     font-family: 'Regular';
 
-    src: url('http://www.jsrailway.com.cn/railroad-phone-font/SourceHanSerifSC-SemiBold.otf');
+    src: url('SourceHanSerifSC-Regular.otf');
 
     font-weight: normal;  
 
@@ -48,7 +48,7 @@
   
       font-family: 'Light';
   
-    src: url('http://www.jsrailway.com.cn/railroad-phone-font/SourceHanSerifSC-SemiBold.otf');
+      src: url('SourceHanSerifSC-Light.otf');
   
       font-weight: normal;  
   

main.js

@@ -2,7 +2,7 @@ import App from './App'
 import Vue from 'vue'
 import getOpenId from './apis/utils/init.js'
 import getALIOpenId from './apis/utils/initALI.js'
-
+import './assets/font/font.css'
 var IS_WEIXIN = /MicroMessenger/.test(window.navigator.userAgent)
 var IS_ALI = /AlipayClient/.test(window.navigator.userAgent)
 

pages.json

@@ -6,6 +6,15 @@
 			"style": {
 			}
 		}
+        ,{
+            "path" : "pages/storeManagement/homePage/homePage",
+            "style" :                                                                                    
+            {
+                "navigationBarTitleText": "",
+                "enablePullDownRefresh": false
+            }
+            
+        }
     ],
 
 	

pages/index/index.vue

@@ -1,6 +1,6 @@
 <template>
 	<view>
-	
+	index
 	</view>
 </template>
 

pages/storeManagement/homePage/homePage.vue

@@ -0,0 +1,256 @@
+<template>
+	<view>
+		<!-- 头部 -->
+		<view class="header">
+			<view class="main">
+				<view class="title">
+					<view class="name">
+						<view class="text">
+							你好，孙斌！
+						</view>
+						<view class="icon">
+							<u-icon name='arrow-down' color="#fff" size="28"></u-icon>
+						</view>
+					</view>
+					
+					<view class="qr-code">
+						<img src="../../../assets/img/riLine-qr-scan-line@1x.png" alt="">
+					</view>
+				</view>
+				<!-- 公告 -->
+				<view class="notice">
+					
+					<u-icon name="volume-up-fill" size="40" color="#fff"></u-icon>
+					<text>库存PDA设备将于2023年4月1日升级维护</text>
+				</view>
+			</view>
+			
+		</view>
+		<!-- 宫格 -->
+		<view class="gird">
+			<view class="item">
+				<view class="title">
+					设备出库
+				</view>
+				<view class="hint">
+					申请物品登记核准出库
+				</view>
+				<view class="img">
+					<img src="../../../assets/img/girdH1.png" alt="">
+				</view>
+			</view>
+			<view class="item">
+				<view class="title">
+					设备入库
+				</view>
+				<view class="hint">
+					申购采购收货入库登记
+				</view>
+				<view class="img">
+					<img src="../../../assets/img/girdH2.png" alt="">
+				</view>
+			</view>
+			<view class="item">
+				<view class="title">
+					设备巡检
+				</view>
+				<view class="hint">
+					当前物品计量库存盘点
+				</view>
+				<view class="img">
+					<img src="../../../assets/img/girdH3.png" alt="">
+				</view>
+			</view>
+			<view class="item">
+				<view class="title">
+					设备检索
+				</view>
+				<view class="hint">
+					库存物品信息检索
+				</view>
+				<view class="img">
+					<img src="../../../assets/img/girdH4.png" alt="">
+				</view>
+			</view>
+			
+		</view>
+		
+		<!-- 其他功能 -->
+		  <view class="other-functions">
+			  <view class="title">
+			  	其他功能
+			  </view>
+		  	  <view class="function-gird">
+		  	  	<view class="item">
+		  	  		<img src="../../../assets/img/riLine-file-add-line@1x.png" alt="">
+		  	  	   <text>新增巡检</text>
+				</view>
+				<view class="item">
+					<img src="../../../assets/img/riLine-printer-line@1x.png" alt="">
+				   <text>打印标签</text>
+				</view>
+				<view class="item">
+					<img src="../../../assets/img/riLine-spam-line@1x.png" alt="">
+				   <text>故障申报</text>
+				</view>
+				<view class="item">
+					<img src="../../../assets/img/riLine-arrow-left-right-line@1x.png" alt="">
+				   <text>设备移交</text>
+				</view>
+		  	  </view>
+		  </view>
+	</view>
+</template>
+
+<script>
+	export default {
+		data() {
+			return {
+				
+			}
+		},
+		methods: {
+			
+		}
+	}
+</script>
+
+<style lang="scss" scoped>
+	page{
+		background-color: rgba(1,122,255,1);
+		padding-bottom: 100rpx;
+	}
+	// 头部
+	.header{
+		width: 100%;
+		height: 339px;
+		background:linear-gradient(180deg, rgba(0,45,194,1) 0%,rgba(0,59,254,1) 49%,rgba(1,122,255,1) 100%);
+		padding: 0 40rpx;
+		.main{
+			width: 100%;
+			height: 100%;
+			background: url(../../../assets/img/background.png) no-repeat;
+			background-position: top -70rpx right -50rpx;
+			position: relative;
+		}
+		.title{
+			display: flex;
+			justify-content: space-between;
+			align-items: center;
+			color: rgba(255, 255, 255, 1);
+			line-height: 88rpx;
+			font-family: 'SemiBold';
+			.name{
+				display: flex;
+				font-size: 40rpx;
+				
+			}
+			.qr-code{
+				display: flex;
+				
+			}
+		}
+		// 公告
+		.notice{
+			font-family: 'Regular';
+			display: flex;
+			align-items: center;
+			background-color: rgba(255, 255, 255, 0.35);
+			color: rgba(255, 255, 255, 1);
+			font-weight: bold;
+			border-radius: 8px;
+			height: 80rpx;
+			line-height: 80rpx;
+			padding: 0 24rpx;
+			position: absolute;
+			bottom: 260rpx;
+			left: 0;
+			right: 0;
+			
+			text{
+				font-size: 28rpx;
+				width: 542px;
+				margin-left: 16rpx;
+				white-space: nowrap;
+				overflow: hidden;
+				text-overflow: ellipsis;
+			}
+		}
+	}
+	
+ // 宫格
+ .gird{
+	 font-family: 'Regular';
+	 padding: 0 40rpx;
+	 display: flex;
+	 justify-content: space-between;
+	 flex-wrap: wrap;
+	 margin-top: -216rpx;
+	 .item{
+		 width: 320rpx;
+		 height: 320rpx;
+		 background-color: rgba(255, 255, 255, 1);
+		 border-radius: 8px;
+		 padding: 32rpx 24rpx;
+		 position: relative;
+		 margin-bottom: 30rpx;
+		 .title{
+			 color: rgba(16, 16, 16, 1);
+			 font-size: 36rpx;
+			 margin-bottom: 8rpx;
+			 font-family: 'Medium';
+		 }
+		 .hint{
+			 color: rgba(106, 121, 142, 1);
+			 font-size: 24rpx;
+			 margin-bottom: 44rpx;
+		 }
+		 .img{
+			 width: 128rpx;
+			 height: 128rpx;
+			 position: absolute;
+			 right: 24rpx;
+			 bottom: 24rpx;
+			 img{
+				 width: 100%;
+				 height: 100%;
+			 }
+		 }
+	 }
+ }
+ 
+ // 其他功能
+ .other-functions{
+	 font-family: 'Regular';
+	 padding: 0 40rpx;
+	 .title{
+		 color: rgba(255, 255, 255, 1);
+		 font-size: 36rpx;
+		 margin-bottom: 16rpx;
+	 }
+	 .function-gird{
+		 display: flex;
+		 flex-wrap: wrap;
+		 justify-content: space-between;
+		 .item{
+			 display: flex;
+			 align-items: center;
+			 justify-content: center;
+			 width: 320rpx;
+			 height: 80rpx;
+			 line-height: 80rpx;
+			 margin-bottom: 24rpx;
+			 color: rgba(255, 255, 255, 1);
+			 border-radius: 8px;
+			 background-color: rgba(255, 255, 255, 0.25);
+			 text-align: center;
+			 border: 1px solid rgba(255, 255, 255, 0.35);
+			 img{
+				 width: 32rpx;
+				 height: 32rpx;
+				margin-right: 8rpx;
+			 }
+		 }
+	 }
+ }
+</style>