diff --git a/manifest.json b/manifest.json
index deadf75..0dc1db5 100644
--- a/manifest.json
+++ b/manifest.json
@@ -50,7 +50,7 @@
     "quickapp" : {},
     /* 小程序特有相关 */
     "mp-weixin" : {
-        "appid" : "wxbcf69120e37e6e3a",
+        "appid" : "wx2129de75c4937c40",
         "__usePrivacyCheck__" : true,
         "setting" : {
             "urlCheck" : false,
diff --git a/node_modules/.package-lock.json b/node_modules/.package-lock.json
index 2c02066..ce87525 100644
--- a/node_modules/.package-lock.json
+++ b/node_modules/.package-lock.json
@@ -1,8 +1,13 @@
 {
-  "name": "wx-dangyuanjiaoyujidi",
-  "lockfileVersion": 2,
+  "name": "mkw-visit-wx",
+  "lockfileVersion": 3,
   "requires": true,
   "packages": {
+    "node_modules/image-tools": {
+      "version": "1.4.0",
+      "resolved": "https://registry.npmjs.org/image-tools/-/image-tools-1.4.0.tgz",
+      "integrity": "sha512-TKtvJ6iUwM0mfaD4keMnk1ENHFC470QEjBfA3IlvKdEOufzvWbjbaoNcoyYq6HlViF8+d5tOS1ooE6j7CHf1lQ=="
+    },
     "node_modules/moment": {
       "version": "2.29.3",
       "resolved": "https://registry.npmjs.org/moment/-/moment-2.29.3.tgz",
diff --git a/package-lock.json b/package-lock.json
index b1fa164..440e229 100644
--- a/package-lock.json
+++ b/package-lock.json
@@ -1,21 +1,35 @@
 {
+  "name": "mkw-visit-wx",
+  "lockfileVersion": 3,
   "requires": true,
-  "lockfileVersion": 1,
-  "dependencies": {
-    "image-tools": {
+  "packages": {
+    "": {
+      "dependencies": {
+        "image-tools": "^1.4.0",
+        "moment": "^2.29.3",
+        "uview-ui": "^2.0.31"
+      }
+    },
+    "node_modules/image-tools": {
       "version": "1.4.0",
       "resolved": "https://registry.npmjs.org/image-tools/-/image-tools-1.4.0.tgz",
       "integrity": "sha512-TKtvJ6iUwM0mfaD4keMnk1ENHFC470QEjBfA3IlvKdEOufzvWbjbaoNcoyYq6HlViF8+d5tOS1ooE6j7CHf1lQ=="
     },
-    "moment": {
+    "node_modules/moment": {
       "version": "2.29.3",
       "resolved": "https://registry.npmjs.org/moment/-/moment-2.29.3.tgz",
-      "integrity": "sha512-c6YRvhEo//6T2Jz/vVtYzqBzwvPT95JBQ+smCytzf7c50oMZRsR/a4w88aD34I+/QVSfnoAnSBFPJHItlOMJVw=="
+      "integrity": "sha512-c6YRvhEo//6T2Jz/vVtYzqBzwvPT95JBQ+smCytzf7c50oMZRsR/a4w88aD34I+/QVSfnoAnSBFPJHItlOMJVw==",
+      "engines": {
+        "node": "*"
+      }
     },
-    "uview-ui": {
+    "node_modules/uview-ui": {
       "version": "2.0.31",
       "resolved": "https://registry.npmjs.org/uview-ui/-/uview-ui-2.0.31.tgz",
-      "integrity": "sha512-I/0fGuvtiKHH/mBb864SGYk+SJ7WaF32tsBgYgeBOsxlUp+Th+Ac2tgz2cTvsQJl6eZYWsKZ3ixiSXCAcxZ8Sw=="
+      "integrity": "sha512-I/0fGuvtiKHH/mBb864SGYk+SJ7WaF32tsBgYgeBOsxlUp+Th+Ac2tgz2cTvsQJl6eZYWsKZ3ixiSXCAcxZ8Sw==",
+      "engines": {
+        "HBuilderX": "^3.1.0"
+      }
     }
   }
 }
diff --git a/pages.json b/pages.json
index f70959a..02791ba 100644
--- a/pages.json
+++ b/pages.json
@@ -6,6 +6,7 @@
 		{
 			"path": "pages/index/index",
 			"style": {
+				"navigationStyle": "custom",
 				"navigationBarBackgroundColor": "#fff",
 				"navigationBarTextStyle": "black",
 				"backgroundColor": "#fff"
diff --git a/pages/index/index.vue b/pages/index/index.vue
index a792d9e..047437c 100644
--- a/pages/index/index.vue
+++ b/pages/index/index.vue
@@ -1,115 +1,340 @@
-<template>
-	<view class="containers" :style="{'height':winHeight+'px'}">
-		<view class="title justify-between">
-			<text>迈柯唯访客</text>
-			<text @click="toUrl(0)" style="color: #f27707;">我的拜访记录</text>
-		</view>
-		<view class="bdfk">
-			<!-- <view>
-				<u--image :showLoading="true" :src="ptfk" width="315rpx" height="600rpx" @click="toUrl(1)"></u--image>
-			</view> -->
-			<view class="sgry">
-				<u--image :src="xxpx" width="315rpx" height="280rpx" @click="toUrl(5)"></u--image>
-				<view>
-					<u--image :src="ptfk" width="315rpx" height="280rpx" @click="toUrl(1)"></u--image>
-				</view>
-			</view>
-			<view class="sgry">
-				<u--image :src="wlcl" width="315rpx" height="280rpx" @click="toUrl(3)"></u--image>
-				<view>
-					<u--image :src="sgry" width="315rpx" height="280rpx" @click="toUrl(2)"></u--image>
-				</view>
-			</view>
-		</view>
-		<view class="title  justify-between">
-			<text>迈柯唯管理员</text>
-		</view>
-		<view>
-			<u--image :src="bdgl" width="670rpx" height="336rpx" @click="toUrl(4)"></u--image>
-		</view>
-
-	</view>
-</template>
-
-<script>
-	export default {
-		data() {
-			return {
-				ptfk: require('../../static/img/ptfk.png'),
-				wlcl: require('../../static/img/wlcl1.png'),
-				sgry: require('../../static/img/sgry1.png'),
-				xxpx: require('../../static/img/xxpx.png'),
-				bdgl: require('../../static/img/bdgl.png'),
-				winHeight: 0,
-				isBd:""
-			}
-		},
-		onLoad() {
-			this.winHeight = uni.getSystemInfoSync().screenHeight - uni.getSystemInfoSync().statusBarHeight * 2-20;
-		
-		},
-		onShow(){
-			this.isBd = uni.getStorageSync("userInfo_BD_token").token
-			console.log("bd",this.isBd)
-		},
-		methods: {
-			toUrl(type) {
-				let url = ""
-				switch (type) {
-					case 1:
-						url = "/pages/visit/addrecord?type=1"
-						break;
-					case 2:
-						url = "/pages/visit/addrecord?type=2"
-						break;
-					case 3:
-						url = "/pages/visit/addrecord?type=3"
-						break;
-					case 0:
-						url = "/pages/visit/visithistory"
-						break;
-					case 5:
-						url = "/pages/visit/tostudy"
-						break;
-					case 4:
-						if(!this.util.isNull(this.isBd)){
-							url = "/pages/bd/mine"
-						}else{
-							url = "/pages/index/login"
-						}
-						
-						break;
-				}
-				uni.navigateTo({
-					url:url
-				})
-			}
-		}
-	}
-</script>
-
-<style scoped>
-	.containers {
-		background-color: #fff;
-		padding: 0 40rpx;
-		padding-bottom:20px;
-	}
-
-	.title {
-		color: #182849;
-		font-size: 32rpx;
-		padding: 40rpx 0;
-		padding-top: 70rpx
-	}
-	.title:first-child{
-		padding-top:30rpx
-	}
-	.bdfk {
-		display: flex;
-		justify-content: space-between;
-	}
-
-	.sgry view {
-		margin-top: 40rpx
-	}
-</style>
+<template>
+	<view class="containers" :style="{'height':winHeight+'px', 'padding-top': statusBarHeight + 20 + 'px'}">
+		<view class="header-area">
+			<view class="logo-container">
+				<image class="logo" :src="logoIndex" mode="aspectFit"></image>
+			</view>
+			<view class="visit-record">
+				<view class="visit-text">
+					<text @click="toUrl(0)">拜访记录</text>
+					<text class="english" @click="toUrl(0)">Visit Records</text>
+				</view>
+			</view>
+		</view>
+		<view class="section-title">
+			<view class="title-text">
+				<text class="chinese">迈柯唯访客</text>
+				<text class="english">Visitor</text>
+			</view>
+		</view>
+		<view class="bdfk">
+			<view class="btn-card" @click="toUrl(5)">
+				<image :src="xxpx" class="btn-icon"></image>
+				<view class="btn-text">
+					<text class="chinese">学习培训</text>
+					<text class="english">Learning and training</text>
+				</view>
+			</view>
+			<view class="btn-card" @click="toUrl(1)">
+				<image :src="ptfk" class="btn-icon"></image>
+				<view class="btn-text">
+					<text class="chinese">普通访客</text>
+					<text class="english">Ordinary visitor</text>
+				</view>
+			</view>
+			<view class="btn-card" @click="toUrl(3)">
+				<image :src="wlsj" class="btn-icon"></image>
+				<view class="btn-text">
+					<text class="chinese">物流司机</text>
+					<text class="english">Logistics driver</text>
+				</view>
+			</view>
+			<view class="btn-card" @click="toUrl(2)">
+				<image :src="sgry" class="btn-icon"></image>
+				<view class="btn-text">
+					<text class="chinese">施工人员</text>
+					<text class="english">Construction worker</text>
+				</view>
+			</view>
+		</view>
+		<view class="section-title admin-section">
+			<view class="title-text">
+				<text class="chinese">迈柯唯管理员</text>
+				<text class="english">Administrator</text>
+			</view>
+		</view>
+		<view class="admin-btn-container">
+			<view class="admin-btn" @click="toUrl(4)">
+				<view class="admin-icon">
+					<image :src="gly" class="admin-icon-img"></image>
+				</view>
+				<view class="admin-text">
+					<text class="chinese">迈柯唯管理员</text>
+					<text class="english">Administrator</text>
+				</view>
+				<view class="arrow">
+					<text>></text>
+				</view>
+			</view>
+		</view>
+
+	</view>
+</template>
+
+<script>
+	export default {
+		data() {
+			return {
+				ptfk: require('../../static/img/ptfk.png'),
+				wlsj: require('../../static/img/wlsj.png'),
+				sgry: require('../../static/img/sgry.png'),
+				xxpx: require('../../static/img/xxpx.png'),
+				bdgl: require('../../static/img/bdgl.png'),
+				gly: require('../../static/img/gly.png'),
+				logoIndex: require('../../static/img/logo-index.png'),
+				winHeight: 0,
+				statusBarHeight: 0,
+				isBd:""
+			}
+		},
+		onLoad() {
+			const systemInfo = uni.getSystemInfoSync();
+			this.statusBarHeight = systemInfo.statusBarHeight;
+			this.winHeight = systemInfo.screenHeight - systemInfo.statusBarHeight * 2-20;
+		
+		},
+		onShow(){
+			this.isBd = uni.getStorageSync("userInfo_BD_token").token
+			console.log("bd",this.isBd)
+		},
+		methods: {
+			toUrl(type) {
+				let url = ""
+				switch (type) {
+					case 1:
+						url = "/pages/visit/addrecord?type=1"
+						break;
+					case 2:
+						url = "/pages/visit/addrecord?type=2"
+						break;
+					case 3:
+						url = "/pages/visit/addrecord?type=3"
+						break;
+					case 0:
+						url = "/pages/visit/visithistory"
+						break;
+					case 5:
+						url = "/pages/visit/tostudy"
+						break;
+					case 4:
+						if(!this.util.isNull(this.isBd)){
+							url = "/pages/bd/mine"
+						}else{
+							url = "/pages/index/login"
+						}
+						
+						break;
+				}
+				uni.navigateTo({
+					url:url
+				})
+			}
+		}
+	}
+</script>
+
+<style scoped>
+	.containers {
+		background-color: #fff;
+		background-image: url('../../static/img/bg.png');
+		background-size: 100% 100%;
+		background-position: center;
+		background-repeat: no-repeat;
+		padding: 0 40rpx 20px;
+		position: relative;
+	}
+
+	.header-area {
+		height: 300rpx;
+		display: flex;
+		flex-direction: column;
+		position: relative;
+	}
+	
+	.logo-container {
+		position: absolute;
+		top: 80rpx;
+		right: 40rpx;
+		z-index: 10;
+	}
+	
+	.logo {
+		width: 160rpx;
+		height: 160rpx;
+	}
+	
+	.visit-record {
+		position: absolute;
+		bottom: 115rpx;
+		left: 40rpx;
+	}
+	
+	.visit-text {
+		display: flex;
+		flex-direction: column;
+		line-height: 1.5;
+	}
+	
+	.visit-text text:first-child {
+		color: #ffffff;
+		font-size: 32rpx;
+		font-weight: normal;
+		letter-spacing: 2rpx;
+	}
+	
+	.visit-text .english {
+		color: #cccccc;
+		font-size: 20rpx;
+		font-weight: normal;
+		letter-spacing: 2rpx;
+	}
+	
+	
+	.bdfk {
+		display: grid;
+		grid-template-columns: 1fr 1fr;
+		grid-template-rows: 1fr 1fr;
+		gap: 4%;
+		position: relative;
+		margin-top: 2%;
+	}
+
+	.btn-card {
+		background-color: #ffffff;
+		border-radius: 20rpx;
+		display: flex;
+		flex-direction: column;
+		align-items: center;
+		justify-content: center;
+		box-shadow: 0 4rpx 12rpx rgba(0, 0, 0, 0.1);
+		padding: 4%;
+		box-sizing: border-box;
+		aspect-ratio: 1.5;
+	}
+	
+	.btn-icon {
+		width: 60rpx;
+		height: 60rpx;
+		margin-bottom: 10rpx;
+		flex-shrink: 0;
+	}
+	
+	.btn-text {
+		display: flex;
+		flex-direction: column;
+		align-items: center;
+		line-height: 1.1;
+		flex-shrink: 0;
+	}
+	
+	.btn-text .chinese {
+		color: #182849;
+		font-size: 32rpx;
+		font-weight: normal;
+		margin-bottom: 4rpx;
+	}
+	
+	.btn-text .english {
+		color: #999999;
+		font-size: 20rpx;
+		font-weight: normal;
+	}
+	
+	.section-title {
+		position: relative;
+		padding: 16% 0 2% 0;
+	}
+	
+	.admin-section {
+		padding: 6% 0 2% 0;
+	}
+	
+	.title-text {
+		display: flex;
+		flex-direction: column;
+		line-height: 1.3;
+	}
+	
+	.title-text .chinese {
+		color: #182849;
+		font-size: 28rpx;
+		font-weight: normal;
+		margin-bottom: 2rpx;
+	}
+	
+	.title-text .english {
+		color: #999999;
+		font-size: 20rpx;
+		font-weight: normal;
+	}
+	
+	.admin-btn-container {
+		position: relative;
+		padding: 2% 0;
+	}
+	
+	.admin-btn {
+		width: calc(100% - 10rpx) !important;
+		height: 104px !important;
+		background-color: #ffffff !important;
+		border-radius: 20rpx !important;
+		position: relative !important;
+		box-shadow: 0 4rpx 12rpx rgba(0, 0, 0, 0.1) !important;
+		margin: 0 5rpx !important;
+	}
+	
+	.admin-icon {
+		width: 60rpx !important;
+		height: 60rpx !important;
+		position: absolute !important;
+		left: 110rpx !important;
+		top: 50% !important;
+		transform: translateY(-50%) !important;
+		display: flex !important;
+		align-items: center !important;
+		justify-content: center !important;
+	}
+	
+	.admin-icon-img {
+		width: 60rpx;
+		height: 60rpx;
+	}
+	
+	.admin-text {
+		position: absolute !important;
+		left: 50% !important;
+		top: 50% !important;
+		transform: translate(-50%, -50%) !important;
+		display: flex !important;
+		flex-direction: column !important;
+		align-items: center !important;
+		line-height: 1.3 !important;
+	}
+	
+	.admin-text .chinese {
+		color: #182849;
+		font-size: 32rpx;
+		font-weight: bold;
+		margin-bottom: 4rpx;
+	}
+	
+	.admin-text .english {
+		color: #999999;
+		font-size: 24rpx;
+		font-weight: normal;
+	}
+	
+	.arrow {
+		position: absolute !important;
+		right: 110rpx !important;
+		top: 50% !important;
+		transform: translateY(-50%) !important;
+		color: #999999 !important;
+		font-size: 40rpx !important;
+		font-weight: normal !important;
+	}
+	
+	.sgry view {
+		margin-top: 40rpx
+	}
+</style>
diff --git a/static/img/bdgl.png b/static/img/bdgl.png
deleted file mode 100644
index e90e8a2..0000000
Binary files a/static/img/bdgl.png and /dev/null differ
diff --git a/static/img/bg.png b/static/img/bg.png
new file mode 100644
index 0000000..8c6f86a
Binary files /dev/null and b/static/img/bg.png differ
diff --git a/static/img/gly.png b/static/img/gly.png
new file mode 100644
index 0000000..74a3e01
Binary files /dev/null and b/static/img/gly.png differ
diff --git a/static/img/logo-index.png b/static/img/logo-index.png
new file mode 100644
index 0000000..3d47b09
Binary files /dev/null and b/static/img/logo-index.png differ
diff --git a/static/img/ptfk.png b/static/img/ptfk.png
index 2b2cabb..b73d8e2 100644
Binary files a/static/img/ptfk.png and b/static/img/ptfk.png differ
diff --git a/static/img/ptfk1.png b/static/img/ptfk1.png
deleted file mode 100644
index 3364b40..0000000
Binary files a/static/img/ptfk1.png and /dev/null differ
diff --git a/static/img/sgry.png b/static/img/sgry.png
index 74f51fd..cf2e2dd 100644
Binary files a/static/img/sgry.png and b/static/img/sgry.png differ
diff --git a/static/img/sgry1.png b/static/img/sgry1.png
deleted file mode 100644
index 00302ec..0000000
Binary files a/static/img/sgry1.png and /dev/null differ
diff --git a/static/img/wlcl.png b/static/img/wlcl.png
deleted file mode 100644
index d89fd31..0000000
Binary files a/static/img/wlcl.png and /dev/null differ
diff --git a/static/img/wlcl1.png b/static/img/wlcl1.png
deleted file mode 100644
index e952475..0000000
Binary files a/static/img/wlcl1.png and /dev/null differ
diff --git a/static/img/wlsj.png b/static/img/wlsj.png
new file mode 100644
index 0000000..ed04766
Binary files /dev/null and b/static/img/wlsj.png differ
diff --git a/static/img/xxpx.png b/static/img/xxpx.png
index e346a54..936d93c 100644
Binary files a/static/img/xxpx.png and b/static/img/xxpx.png differ