From b22438134ced8ede7bc70da3cf05851f6756c45a Mon Sep 17 00:00:00 2001
From: zwz <zwz@qq.com>
Date: Wed, 17 Jun 2026 16:56:03 +0800
Subject: [PATCH] =?UTF-8?q?=E5=8F=96=E5=8F=B7=E6=9C=BA=E3=80=81=E5=8F=AB?=
 =?UTF-8?q?=E5=8F=B7=E6=9C=BA=E5=AF=B9=E6=8E=A5?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 api/ticket.js                      | 179 +++++++
 components/container/container.vue | 355 ++++++-------
 pages.json                         |  19 +-
 pages/callTicket/callTicket.vue    | 783 +++++++++++++++++++++++++++++
 pages/callTicket/chooseWindow.vue  | 259 ++++++++++
 pages/home/businessList.vue        | 427 ++++++++--------
 pages/home/chooseMachine.vue       | 212 ++++++++
 pages/home/dept.vue                | 209 ++++----
 pages/home/guide.vue               | 241 +++++----
 pages/home/home.vue                | 180 +++----
 pages/home/theme.vue               | 210 ++++----
 pages/home/ticket.vue              |  81 +--
 pages/login/login-account.vue      |   2 +-
 pages/screen/index.vue             | 514 ++++++++++---------
 pages/takeTicket/index.vue         | 262 ----------
 15 files changed, 2581 insertions(+), 1352 deletions(-)
 create mode 100644 pages/callTicket/callTicket.vue
 create mode 100644 pages/callTicket/chooseWindow.vue
 create mode 100644 pages/home/chooseMachine.vue
 delete mode 100644 pages/takeTicket/index.vue

diff --git a/api/ticket.js b/api/ticket.js
index d80e324..2fa50d1 100644
--- a/api/ticket.js
+++ b/api/ticket.js
@@ -1,5 +1,7 @@
 import http from '@/http/api.js'
 
+// ==================== 自助取号机接口 ====================
+
 /**
  * 主题取号列表
  * @param {*} params
@@ -56,4 +58,181 @@ export const takeNumber = data => {
 		method: 'POST',
 		data
 	});
+};
+
+/**
+ * 事项详情
+ * @param {*} params { id }
+ * @returns
+ */
+export const getItemDetail = params => {
+	return http.request({
+		url: 'api/blade-item/detail',
+		method: 'GET',
+		params
+	});
+};
+
+// ==================== 叫号机窗口端接口 ====================
+
+/**
+ * 获取可选窗口列表
+ * @param {*} params { status, serviceStatus, current, size }
+ * @returns
+ */
+export const getWindowList = params => {
+	return http.request({
+		url: '/api/blade-windows/list',
+		method: 'GET',
+		params: {
+			status: 1,
+			serviceStatus: 1,
+			current: 1,
+			size: 100,
+			...params
+		}
+	});
+};
+
+/**
+ * 选择窗口
+ * @param {*} data { windowId }
+ * @returns
+ */
+export const selectWindow = data => {
+	return http.request({
+		url: '/api/blade-windows/select-window',
+		method: 'POST',
+		data
+	});
+};
+
+/**
+ * 窗口工作台（获取当前叫号和等候人数）
+ * @param {*} params { windowId }
+ * @returns
+ */
+export const getWindowWorkbench = params => {
+	return http.request({
+		url: '/api/blade-queuerecord/queueRecord/window-workbench',
+		method: 'GET',
+		params
+	});
+};
+
+/**
+ * 呼叫下一位
+ * @param {*} data { windowId }
+ * @returns
+ */
+export const callNext = data => {
+	return http.request({
+		url: '/api/blade-queuerecord/queueRecord/call-next',
+		method: 'POST',
+		data
+	});
+};
+
+/**
+ * 重呼
+ * @param {*} data { recordId, windowId }
+ * @returns
+ */
+export const recall = data => {
+	return http.request({
+		url: '/api/blade-queuerecord/queueRecord/recall',
+		method: 'POST',
+		data
+	});
+};
+
+/**
+ * 开始办理
+ * @param {*} data { recordId, windowId }
+ * @returns
+ */
+export const startHandle = data => {
+	return http.request({
+		url: '/api/blade-queuerecord/queueRecord/start-handle',
+		method: 'POST',
+		data
+	});
+};
+
+/**
+ * 完成办理
+ * @param {*} data { recordId, windowId }
+ * @returns
+ */
+export const finishHandle = data => {
+	return http.request({
+		url: '/api/blade-queuerecord/queueRecord/finish',
+		method: 'POST',
+		data
+	});
+};
+
+/**
+ * 过号
+ * @param {*} data { recordId, windowId }
+ * @returns
+ */
+export const passRecord = data => {
+	return http.request({
+		url: '/api/blade-queuerecord/queueRecord/pass',
+		method: 'POST',
+		data
+	});
+};
+
+/**
+ * 转移窗口
+ * @param {*} data { recordId, windowId, targetWindowId }
+ * @returns
+ */
+export const transferRecord = data => {
+	return http.request({
+		url: '/api/blade-queuerecord/queueRecord/transfer',
+		method: 'POST',
+		data
+	});
+};
+
+/**
+ * 挂起窗口
+ * @param {*} data { windowId, reason }
+ * @returns
+ */
+export const suspendWindow = data => {
+	return http.request({
+		url: '/api/blade-windows/suspend',
+		method: 'POST',
+		data
+	});
+};
+
+/**
+ * 恢复窗口
+ * @param {*} data { windowId }
+ * @returns
+ */
+export const resumeWindow = data => {
+	return http.request({
+		url: '/api/blade-windows/resume',
+		method: 'POST',
+		data
+	});
+};
+
+/**
+ * 窗口统计
+ * @param {*} params { windowId, date }
+ * @returns
+ */
+export const getWindowStat = params => {
+	return http.request({
+		url: '/api/blade-queuerecord/queueRecord/window-stat',
+		method: 'GET',
+		params
+	});
 };
\ No newline at end of file
diff --git a/components/container/container.vue b/components/container/container.vue
index ae4665b..f8c269d 100644
--- a/components/container/container.vue
+++ b/components/container/container.vue
@@ -1,195 +1,196 @@
 <template>
-	<view class="container">
-		<!-- 顶部标题栏 -->
-		<view class="header">
-			<text class="header-left">环江毛南族自治县政务服务中心</text>
-			<text class="header-center">自助取号机</text>
-			<view class="btn-group">
-				<view class="btn" v-if="backBtn" @click="back">
-					<img src="../../static/images/home/back_icon.png" alt="" />
-					<text class="btn-text">返回</text>
-				</view>
-				<view class="btn" v-if="logoutBtn" @click="logout">
-					<img src="../../static/images/home/logout_icon.png" alt="" />
-					<text class="btn-text">退出</text>
-				</view>
-			</view>
-		</view>
+  <view class="container">
+    <!-- 顶部标题栏 -->
+    <view class="header">
+      <text class="header-left">环江毛南族自治县政务服务中心</text>
+      <text class="header-center">自助取号机</text>
+      <view class="btn-group">
+        <view class="btn" v-if="backBtn" @click="back">
+          <img src="../../static/images/home/back_icon.png" alt="" />
+          <text class="btn-text">返回</text>
+        </view>
+        <view class="btn" v-if="logoutBtn" @click="logout">
+          <img src="../../static/images/home/logout_icon.png" alt="" />
+          <text class="btn-text">退出</text>
+        </view>
+      </view>
+    </view>
 
-		<!-- 主体内容区 -->
-		<view class="main">
-			<slot name="main"></slot>
-		</view>
+    <!-- 主体内容区 -->
+    <view class="main">
+      <slot name="main"></slot>
+    </view>
 
-		<!-- 底部状态栏 -->
-		<view class="footer">
-			<text class="footer-left">本机编号: YJS0001</text>
-			<text class="footer-right">{{ currentTime }}</text>
-		</view>
-	</view>
+    <!-- 底部状态栏 -->
+    <view class="footer">
+      <text class="footer-left">本机编号: YJS0001</text>
+      <text class="footer-right">{{ currentTime }}</text>
+    </view>
+  </view>
 </template>
 
 <script>
-	export default {
-		props: {
-			backBtn: {
-				type: Boolean,
-				default: false
-			},
-			logoutBtn: {
-				type: Boolean,
-				default: false
-			}
-		},
-		data() {
-			return {
-				currentTime: ''
-			}
-		},
-		mounted() {
-			this.updateTime()
-			setInterval(() => {
-				this.updateTime()
-			}, 1000)
-			// APP端强制横屏
-			// #ifdef APP-PLUS
-			plus.screen.lockOrientation('landscape-primary')
-			// #endif
-		},
-		methods: {
-			updateTime() {
-				const now = new Date()
-				const year = now.getFullYear()
-				const month = String(now.getMonth() + 1).padStart(2, '0')
-				const day = String(now.getDate()).padStart(2, '0')
-				const hours = String(now.getHours()).padStart(2, '0')
-				const minutes = String(now.getMinutes()).padStart(2, '0')
-				const seconds = String(now.getSeconds()).padStart(2, '0')
-				this.currentTime = `${year}年${month}月${day}日 ${hours}:${minutes}:${seconds}`
-			},
-			back() {
-				this.$emit('handleBack')
-			},
-			logout() {
-				uni.showModal({
-					title: '提示',
-					content: '确定要退出吗？',
-					success: (res) => {
-						if (res.confirm) {
-							uni.reLaunch({
-								url: '/pages/home/home'
-							})
-						}
-					}
-				})
-			},
-		}
-	}
+export default {
+  props: {
+    backBtn: {
+      type: Boolean,
+      default: false
+    },
+    logoutBtn: {
+      type: Boolean,
+      default: false
+    }
+  },
+  data() {
+    return {
+      currentTime: ''
+    }
+  },
+  mounted() {
+    this.updateTime()
+    setInterval(() => {
+      this.updateTime()
+    }, 1000)
+    // APP端强制横屏
+    // #ifdef APP-PLUS
+    plus.screen.lockOrientation('landscape-primary')
+    // #endif
+  },
+  methods: {
+    updateTime() {
+      const now = new Date()
+      const year = now.getFullYear()
+      const month = String(now.getMonth() + 1).padStart(2, '0')
+      const day = String(now.getDate()).padStart(2, '0')
+      const hours = String(now.getHours()).padStart(2, '0')
+      const minutes = String(now.getMinutes()).padStart(2, '0')
+      const seconds = String(now.getSeconds()).padStart(2, '0')
+      this.currentTime = `${year}年${month}月${day}日 ${hours}:${minutes}:${seconds}`
+    },
+    back() {
+      this.$emit('handleBack')
+    },
+    logout() {
+      uni.showModal({
+        title: '提示',
+        content: '确定要退出吗？',
+        success: res => {
+          if (res.confirm) {
+            // 清空存储的身份证号
+            uni.removeStorageSync('idcard')
+            uni.reLaunch({
+              url: '/pages/home/home'
+            })
+          }
+        }
+      })
+    }
+  }
+}
 </script>
 
 <style scoped>
-	/* 全屏自适应容器 - 百分比布局 */
-	.container {
-		width: 100%;
-		height: 100vh;
-		display: flex;
-		flex-direction: column;
-		overflow: hidden;
-		position: fixed;
-		top: 0;
-		left: 0;
-	}
+/* 全屏自适应容器 - viewport弹性布局 */
+.container {
+  width: 100vw;
+  height: 100vh;
+  display: flex;
+  flex-direction: column;
+  overflow: hidden;
+  position: fixed;
+  top: 0;
+  left: 0;
+}
 
-	/* 顶部标题栏 - 百分比高度 */
-	.header {
-		position: absolute;
-		left: 0;
-		top: 0;
-		width: 100%;
-		height: 22%;
-		background: url('../../static/images/home/top_bg.png');
-		background-size: 100% 100%;
-		display: flex;
-		padding: 35px 4% 0;
-		border-radius: 0 0 2% 2%;
-	}
+/* 顶部标题栏 */
+.header {
+  position: absolute;
+  left: 0;
+  top: 0;
+  width: 100%;
+  height: 22vh;
+  background: url('../../static/images/home/top_bg.png');
+  background-size: 100% 100%;
+  display: flex;
+  padding: 3vh 4% 0;
+  border-radius: 0 0 2% 2%;
+}
 
-	.header-left {
-		color: #fff;
-		font-size: 36px;
-		font-weight: 500;
-	}
+.header-left {
+  color: #fff;
+  font-size: 2.5vw;
+  font-weight: 500;
+  white-space: nowrap;
+}
 
-	.header-center {
-		position: absolute;
-		left: 50%;
-		top: 35px;
-		transform: translateX(-50%);
-		color: #fff;
-		font-size: 36px;
-		font-weight: bold;
-	}
+.header-center {
+  position: absolute;
+  left: 50%;
+  top: 3.2vh;
+  transform: translateX(-50%);
+  color: #fff;
+  font-size: 2.5vw;
+  font-weight: bold;
+  white-space: nowrap;
+}
 
-	.btn-group {
-		position: absolute;
-		right: 4%;
-		top: 35px;
-		display: flex;
-		justify-content: center;
-		align-items: center;
+.btn-group {
+  position: absolute;
+  right: 4%;
+  top: 3.2vh;
+  display: flex;
+  justify-content: center;
+  align-items: center;
 
+  .btn {
+    display: flex;
+    justify-content: center;
+    align-items: center;
+    margin-right: 1vw;
+    width: 8.5vw;
+    height: 5.5vh;
+    border-radius: 3vh;
+    background: #fff;
+    font-size: 1.6vw;
+    color: rgba(51, 51, 51, 1);
 
-		.btn {
-			display: flex;
-			justify-content: center;
-			align-items: center;
-			margin-right: 20px;
-			width: 160px;
-			height: 60px;
-			border-radius: 30px;
-			background: #fff;
-			font-size: 30px;
-			color: rgba(51, 51, 51, 1);
+    img {
+      margin-right: 0.8vw;
+      width: 2vw;
+      height: 2vw;
+    }
+  }
+}
 
-			img {
-				margin-right: 15px;
-				width: 40px;
-				height: 40px;
-			}
-		}
-	}
+/* 主体内容区 - 自动占满剩余空间 */
+.main {
+  flex: 1;
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  background: url('../../static/images/home/bg.png');
+  background-size: 100% 100%;
+}
 
-	/* 主体内容区 - 自动占满剩余空间 */
-	.main {
-		flex: 1;
-		display: flex;
-		align-items: center;
-		justify-content: center;
-		background: url('../../static/images/home/bg.png');
-		background-size: 100% 100%;
-	}
+/* 底部状态栏 */
+.footer {
+  position: absolute;
+  left: 0;
+  bottom: 0;
+  width: 100%;
+  height: 7vh;
+  background: url('../../static/images/home/footer_bg.png');
+  background-size: 100% 100%;
+  display: flex;
+  align-items: center;
+  justify-content: space-between;
+  padding: 0 3%;
+  border-radius: 2% 2% 0 0;
+}
 
-
-
-	/* 底部状态栏 - 百分比高度 */
-	.footer {
-		position: absolute;
-		left: 0;
-		bottom: 0;
-		width: 100%;
-		height: 80px;
-		background: url('../../static/images/home/footer_bg.png');
-		background-size: 100% 100%;
-		display: flex;
-		align-items: center;
-		justify-content: space-between;
-		padding: 0 3%;
-		border-radius: 2% 2% 0 0;
-	}
-
-	.footer-left,
-	.footer-right {
-		color: #fff;
-		font-size: 3vh;
-	}
-</style>
\ No newline at end of file
+.footer-left,
+.footer-right {
+  color: #fff;
+  font-size: 2vw;
+}
+</style>
diff --git a/pages.json b/pages.json
index f1191ed..35106fe 100644
--- a/pages.json
+++ b/pages.json
@@ -4,7 +4,14 @@
 		"^wf-(.*)": "@/components/wf-ui/components/wf-$1/wf-$1.vue"
 	},
 	"pages": [ //pages数组中第一项表示应用启动页，参考：https://uniapp.dcloud.io/collocation/pages
-		
+		{
+			"path": "pages/home/chooseMachine",
+			"style": {
+				"navigationBarTitleText": "选择机器类别",
+				"enablePullDownRefresh": false,
+				"navigationStyle": "custom"
+			}
+		},
 		{
 			"path": "pages/home/home",
 			"style": {
@@ -54,7 +61,15 @@
 			}
 		},
 		{
-			"path": "pages/takeTicket/index",
+			"path": "pages/callTicket/chooseWindow",
+			"style": {
+				"navigationBarTitleText": "选择叫号机窗口",
+				"enablePullDownRefresh": false,
+				"navigationStyle": "custom"
+			}
+		},
+		{
+			"path": "pages/callTicket/callTicket",
 			"style": {
 				"navigationBarTitleText": "叫号机",
 				"enablePullDownRefresh": false,
diff --git a/pages/callTicket/callTicket.vue b/pages/callTicket/callTicket.vue
new file mode 100644
index 0000000..a0eb9b3
--- /dev/null
+++ b/pages/callTicket/callTicket.vue
@@ -0,0 +1,783 @@
+<template>
+  <!-- 外层容器，使用 vw/vh 自适应屏幕 -->
+  <view class="wrap">
+    <!-- 顶部蓝色头部 -->
+    <view class="header-bar">
+      <view class="header-left">
+        <text class="win-no">窗口号：{{ windowName }}</text>
+        <view class="user-dept">
+          <text>{{ handlerUserName }}</text>
+          <text>{{ handlerDeptName }}</text>
+        </view>
+      </view>
+      <view class="exit-btn" @click="handleExit">
+        <image class="icon-exit" src="../../static/images/home/logout_icon.png" />
+        <text>退出</text>
+      </view>
+    </view>
+
+    <!-- 中间内容区域 -->
+    <view class="content-box">
+      <view class="item-col">
+        <text class="col-title">当前叫号</text>
+        <text class="call-no">{{ currentCallNo }}</text>
+      </view>
+      <view class="item-col">
+        <text class="col-title">当前等候</text>
+        <text class="wait-num">{{ waitingCount }}人</text>
+      </view>
+    </view>
+
+    <!-- 挂起提示条 -->
+    <view class="suspend-bar" v-if="serviceStatus === 2">
+      <text>窗口已挂起，无法进行叫号操作</text>
+    </view>
+
+    <!-- 底部功能按钮区 -->
+    <view class="btn-group">
+      <view class="btn-item green" @click="handleCall" :class="{ disabled: callDisabled }">
+        <image class="btn-icon" src="../../static/images/takeTicket/hj_icon.png" mode="aspectFit" />
+        <text>呼叫</text>
+      </view>
+      <view class="btn-item blue" @click="handleReCall" :class="{ disabled: recallDisabled }">
+        <image class="btn-icon" src="../../static/images/takeTicket/ch_icon.png" mode="aspectFit" />
+        <text>重呼</text>
+      </view>
+      <view class="btn-item sky" @click="handleTransfer" :class="{ disabled: transferDisabled }">
+        <image class="btn-icon" src="../../static/images/takeTicket/zy_icon.png" mode="aspectFit" />
+        <text>转移</text>
+      </view>
+      <view class="btn-item orange" @click="handlePass" :class="{ disabled: passDisabled }">
+        <image class="btn-icon" src="../../static/images/takeTicket/gh_icon.png" mode="aspectFit" />
+        <text>过号</text>
+      </view>
+      <view class="btn-item red" @click="handleSuspend" v-if="serviceStatus === 1">
+        <image class="btn-icon" src="../../static/images/takeTicket/gq_icon.png" mode="aspectFit" />
+        <text>挂起</text>
+      </view>
+      <view class="btn-item green" @click="handleResume" v-if="serviceStatus === 2">
+        <image class="btn-icon" src="../../static/images/takeTicket/hj_icon.png" mode="aspectFit" />
+        <text>恢复</text>
+      </view>
+    </view>
+
+    <!-- 转移弹窗：选择目标窗口 -->
+    <view class="transfer-mask" v-if="showTransfer" @click="showTransfer = false">
+      <view class="transfer-dialog" @click.stop>
+        <text class="dialog-title">请选择目标窗口</text>
+        <scroll-view class="dialog-list" scroll-y>
+          <view class="transfer-item" v-for="win in targetWindowList" :key="win.id" @click="confirmTransfer(win)">
+            <text class="transfer-name">{{ win.windowName }}</text>
+          </view>
+          <view class="dialog-empty" v-if="targetWindowList.length === 0">
+            <text>暂无可转移的窗口</text>
+          </view>
+        </scroll-view>
+        <view class="dialog-cancel" @click="showTransfer = false">
+          <text>取消</text>
+        </view>
+      </view>
+    </view>
+
+    <!-- 挂起原因弹窗 -->
+    <view class="transfer-mask" v-if="showSuspend" @click="showSuspend = false">
+      <view class="suspend-dialog" @click.stop>
+        <text class="dialog-title">请输入挂起原因</text>
+        <input class="suspend-input" v-model="suspendReason" placeholder="请输入挂起原因（选填）" />
+        <view class="suspend-btns">
+          <view class="dialog-cancel" @click="showSuspend = false">
+            <text>取消</text>
+          </view>
+          <view class="dialog-confirm" @click="confirmSuspend">
+            <text>确认挂起</text>
+          </view>
+        </view>
+      </view>
+    </view>
+  </view>
+</template>
+
+<script>
+import { getWindowWorkbench, callNext, recall, transferRecord, passRecord, suspendWindow, resumeWindow, getWindowList } from '@/api/ticket.js'
+
+export default {
+  name: 'CallWindow',
+  data() {
+    return {
+      // 窗口信息（从本地存储读取）
+      windowId: '',
+      windowName: '',
+      serviceStatus: 1, // 1=接号中, 2=挂起中
+      handlerUserName: '',
+      handlerDeptName: '',
+      handlerUserId: '',
+
+      // 当前叫号信息
+      currentRecord: null, // 当前叫号记录对象
+      waitingCount: 0, // 等候人数
+      currentDeptName: '', // 当前办理的部门名称
+
+      // 转移弹窗
+      showTransfer: false,
+      targetWindowList: [],
+
+      // 挂起弹窗
+      showSuspend: false,
+      suspendReason: '',
+
+      // 操作锁（防止重复点击）
+      actionLock: false
+    }
+  },
+
+  computed: {
+    // 当前叫号显示
+    currentCallNo() {
+      return this.currentRecord ? this.currentRecord.queueNo : '----'
+    },
+
+    // 状态文字
+    statusText() {
+      if (!this.currentRecord) return ''
+      const map = { 1: '等待办理', 2: '已叫号', 3: '已过号', 4: '已完成', 5: '已取消', 7: '办理中' }
+      return map[this.currentRecord.status] || ''
+    },
+
+    // 状态标签样式
+    statusTagClass() {
+      if (!this.currentRecord) return ''
+      if (this.currentRecord.status === 2) return 'tag-called'
+      if (this.currentRecord.status === 7) return 'tag-handling'
+      return ''
+    },
+
+    // 按钮禁用逻辑：挂起中全部禁用操作按钮
+    suspended() {
+      return this.serviceStatus === 2
+    },
+
+    // 呼叫按钮：挂起中 或 已有当前记录时禁用
+    callDisabled() {
+      return this.suspended || !!this.currentRecord || this.actionLock
+    },
+
+    // 重呼按钮：挂起中 或 无当前记录 或 状态不是已叫号/办理中 时禁用
+    recallDisabled() {
+      if (this.suspended || !this.currentRecord || this.actionLock) return true
+      return ![2, 7].includes(this.currentRecord.status)
+    },
+
+    // 转移按钮：挂起中 或 无当前记录时禁用
+    transferDisabled() {
+      return this.suspended || !this.currentRecord || this.actionLock
+    },
+
+    // 过号按钮：挂起中 或 无当前记录 或 状态不是已叫号/办理中 时禁用
+    passDisabled() {
+      if (this.suspended || !this.currentRecord || this.actionLock) return true
+      return ![2, 7].includes(this.currentRecord.status)
+    }
+  },
+
+  onLoad() {
+    // 读取窗口信息
+    const winInfo = uni.getStorageSync('windowInfo')
+    if (!winInfo || !winInfo.windowId) {
+      uni.showToast({ title: '请先选择窗口', icon: 'none' })
+      setTimeout(() => {
+        uni.redirectTo({ url: '/pages/callTicket/chooseWindow' })
+      }, 1000)
+      return
+    }
+
+    this.windowId = winInfo.windowId
+    this.windowName = winInfo.windowName
+    this.serviceStatus = winInfo.serviceStatus || 1
+    this.handlerUserName = winInfo.handlerUserName || ''
+    this.handlerDeptName = winInfo.handlerDeptName || ''
+    this.handlerUserId = winInfo.handlerUserId || ''
+
+    // 首次加载工作台
+    this.fetchWorkbench()
+  },
+
+  methods: {
+    // ========== 数据获取 ==========
+
+    // 获取窗口工作台数据
+    async fetchWorkbench() {
+      try {
+        const res = await getWindowWorkbench({ windowId: this.windowId })
+        if (res.success && res.data) {
+          const data = res.data
+          // 更新窗口状态
+          this.serviceStatus = data.serviceStatus
+          this.waitingCount = data.waitingCount || 0
+          this.currentRecord = data.currentRecord || null
+
+          // 同步更新本地存储中的窗口状态
+          const winInfo = uni.getStorageSync('windowInfo') || {}
+          winInfo.serviceStatus = data.serviceStatus
+          uni.setStorageSync('windowInfo', winInfo)
+
+          // 提取部门名称
+          if (data.currentRecord && data.currentRecord.itemDeptName) {
+            this.currentDeptName = data.currentRecord.itemDeptName
+          }
+        }
+      } catch (e) {
+        console.error('获取工作台数据失败', e)
+      }
+    },
+
+    // 操作后刷新
+    async refreshAfterAction(delay = 500) {
+      await new Promise(resolve => setTimeout(resolve, delay))
+      await this.fetchWorkbench()
+    },
+
+    // ========== 按钮操作 ==========
+
+    // 退出
+    handleExit() {
+      uni.showModal({
+        title: '确认退出',
+        content: '确定要退出当前窗口吗？退出后需重新选择窗口。',
+        success: res => {
+          if (res.confirm) {
+            uni.removeStorageSync('windowInfo')
+            uni.redirectTo({ url: '/pages/callTicket/chooseWindow' })
+          }
+        }
+      })
+    },
+
+    // 呼叫下一位
+    async handleCall() {
+      if (this.callDisabled) return
+      this.actionLock = true
+      uni.showLoading({ title: '呼叫中...', mask: true })
+      try {
+        const res = await callNext({ windowId: this.windowId })
+        if (res.success && res.data) {
+          this.currentRecord = res.data
+          this.waitingCount = Math.max(0, this.waitingCount - 1)
+          if (res.data.itemDeptName) {
+            this.currentDeptName = res.data.itemDeptName
+          }
+          uni.showToast({ title: `已呼叫 ${res.data.queueNo}`, icon: 'success', duration: 1500 })
+          await this.refreshAfterAction(1000)
+        }
+      } catch (e) {
+        console.error('呼叫失败', e)
+      } finally {
+        uni.hideLoading()
+        this.actionLock = false
+      }
+    },
+
+    // 重呼
+    async handleReCall() {
+      if (this.recallDisabled) return
+      if (!this.currentRecord) return
+
+      this.actionLock = true
+      uni.showLoading({ title: '重呼中...', mask: true })
+      try {
+        const res = await recall({
+          recordId: this.currentRecord.id,
+          windowId: this.windowId
+        })
+        if (res.success && res.data) {
+          this.currentRecord = res.data
+          uni.showToast({ title: `已重呼 ${res.data.queueNo}`, icon: 'success', duration: 1500 })
+          await this.refreshAfterAction()
+        }
+      } catch (e) {
+        console.error('重呼失败', e)
+      } finally {
+        uni.hideLoading()
+        this.actionLock = false
+      }
+    },
+
+    // 转移 - 打开目标窗口选择弹窗
+    async handleTransfer() {
+      if (this.transferDisabled) return
+      // 获取可选目标窗口（排除自身，只选启用未挂起的）
+      uni.showLoading({ title: '加载窗口...', mask: true })
+      try {
+        const res = await getWindowList({ status: 1, serviceStatus: 1 })
+        if (res.success && res.data) {
+          const allWindows = res.data.records || []
+          this.targetWindowList = allWindows.filter(w => w.id !== this.windowId)
+          if (this.targetWindowList.length === 0) {
+            uni.showToast({ title: '暂无可转移的窗口', icon: 'none' })
+            return
+          }
+          this.showTransfer = true
+        }
+      } catch (e) {
+        console.error('获取窗口列表失败', e)
+        uni.showToast({ title: '获取窗口列表失败', icon: 'none' })
+      } finally {
+        uni.hideLoading()
+      }
+    },
+
+    // 确认转移
+    async confirmTransfer(win) {
+      if (!this.currentRecord) return
+      this.showTransfer = false
+      this.actionLock = true
+      uni.showLoading({ title: '转移中...', mask: true })
+      try {
+        const res = await transferRecord({
+          recordId: this.currentRecord.id,
+          windowId: this.windowId,
+          targetWindowId: win.id
+        })
+        if (res.success) {
+          uni.showToast({ title: `已转移至 ${win.windowName}`, icon: 'success', duration: 1500 })
+          await this.refreshAfterAction(1000)
+        }
+      } catch (e) {
+        console.error('转移失败', e)
+      } finally {
+        uni.hideLoading()
+        this.actionLock = false
+      }
+    },
+
+    // 过号
+    async handlePass() {
+      if (this.passDisabled) return
+      if (!this.currentRecord) return
+
+      uni.showModal({
+        title: '确认过号',
+        content: `确定将 ${this.currentRecord.queueNo} 标记为过号吗？`,
+        success: async modalRes => {
+          if (!modalRes.confirm) return
+          this.actionLock = true
+          uni.showLoading({ title: '处理中...', mask: true })
+          try {
+            const res = await passRecord({
+              recordId: this.currentRecord.id,
+              windowId: this.windowId
+            })
+            if (res.success) {
+              uni.showToast({ title: '已标记过号', icon: 'success', duration: 1500 })
+              await this.refreshAfterAction(1000)
+            }
+          } catch (e) {
+            console.error('过号失败', e)
+          } finally {
+            uni.hideLoading()
+            this.actionLock = false
+          }
+        }
+      })
+    },
+
+    // 挂起 - 打开原因输入弹窗
+    handleSuspend() {
+      this.suspendReason = ''
+      this.showSuspend = true
+    },
+
+    // 确认挂起
+    async confirmSuspend() {
+      this.showSuspend = false
+      this.actionLock = true
+      uni.showLoading({ title: '挂起中...', mask: true })
+      try {
+        const res = await suspendWindow({
+          windowId: this.windowId,
+          reason: this.suspendReason || '临时离岗'
+        })
+        if (res.success && res.data) {
+          this.serviceStatus = res.data.serviceStatus
+
+          // 同步更新本地存储
+          const winInfo = uni.getStorageSync('windowInfo') || {}
+          winInfo.serviceStatus = res.data.serviceStatus
+          uni.setStorageSync('windowInfo', winInfo)
+
+          uni.showToast({ title: '窗口已挂起', icon: 'success', duration: 1500 })
+          await this.refreshAfterAction()
+        }
+      } catch (e) {
+        console.error('挂起失败', e)
+      } finally {
+        uni.hideLoading()
+        this.actionLock = false
+      }
+    },
+
+    // 恢复窗口
+    async handleResume() {
+      this.actionLock = true
+      uni.showLoading({ title: '恢复中...', mask: true })
+      try {
+        const res = await resumeWindow({ windowId: this.windowId })
+        if (res.success && res.data) {
+          this.serviceStatus = res.data.serviceStatus
+
+          // 同步更新本地存储
+          const winInfo = uni.getStorageSync('windowInfo') || {}
+          winInfo.serviceStatus = res.data.serviceStatus
+          uni.setStorageSync('windowInfo', winInfo)
+
+          uni.showToast({ title: '窗口已恢复', icon: 'success', duration: 1500 })
+          await this.refreshAfterAction()
+        }
+      } catch (e) {
+        console.error('恢复失败', e)
+      } finally {
+        uni.hideLoading()
+        this.actionLock = false
+      }
+    }
+  }
+}
+</script>
+
+<style scoped>
+* {
+  box-sizing: border-box;
+}
+
+.wrap {
+  width: 100vw;
+  height: 100vh;
+  display: flex;
+  flex-direction: column;
+  overflow: hidden;
+  background: url('../../static/images/home/bg.png') no-repeat center center;
+  background-size: cover;
+}
+
+/* 顶部头部 */
+.header-bar {
+  width: 100%;
+  background-color: rgba(19, 114, 255, 1);
+  display: flex;
+  justify-content: space-between;
+  align-items: center;
+  padding: 1.944vh 2.083vw 1.296vh;
+  box-sizing: border-box;
+}
+
+.header-left {
+  display: flex;
+  flex-direction: column;
+  justify-content: center;
+}
+
+.win-no {
+  font-size: 3.125vw;
+  color: #fff;
+  font-weight: bold;
+}
+
+.user-dept {
+  display: flex;
+  margin-top: 1.111vh;
+}
+
+.user-dept text {
+  font-size: 2.083vw;
+  color: #fff;
+  margin-right: 2.604vw;
+}
+
+.exit-btn {
+  background: #fff;
+  border-radius: 2.604vw;
+  display: flex;
+  align-items: center;
+  padding: 1.389vh 1.302vw;
+  cursor: pointer;
+}
+
+.icon-exit {
+  width: 2.604vw;
+  height: 2.604vw;
+  margin-right: 1.042vw;
+}
+
+.exit-btn text {
+  font-size: 2.083vw;
+}
+
+/* 中间内容 */
+.content-box {
+  flex: 1;
+  display: flex;
+}
+
+.item-col {
+  flex: 1;
+  display: flex;
+  flex-direction: column;
+  align-items: center;
+  justify-content: center;
+}
+
+.col-title {
+  font-size: 3.125vw;
+  color: rgba(51, 51, 51, 1);
+  /* margin-bottom: 2.778vh; */
+}
+
+.call-no {
+  font-size: 11.458vw;
+  color: rgba(19, 114, 255, 1);
+  font-weight: bold;
+}
+
+.call-name {
+  font-size: 2.5vw;
+  color: #333;
+  margin-top: 2vh;
+}
+
+.call-item {
+  font-size: 2vw;
+  color: #666;
+  margin-top: 1vh;
+}
+
+/* 状态标签 */
+.status-tag {
+  margin-top: 2vh;
+  padding: 1vh 2vw;
+  border-radius: 2vw;
+}
+
+.status-tag text {
+  font-size: 2vw;
+  color: #fff;
+}
+
+.tag-called {
+  background-color: #1976f2;
+}
+
+.tag-handling {
+  background-color: #28c958;
+}
+
+.wait-num {
+  font-size: 11.458vw;
+  color: #ff5522;
+  font-weight: bold;
+}
+
+/* 挂起提示条 */
+.suspend-bar {
+  width: 100%;
+  background-color: #ff6633;
+  padding: 2vh 0;
+  text-align: center;
+}
+
+.suspend-bar text {
+  font-size: 2.5vw;
+  color: #fff;
+  font-weight: bold;
+}
+
+/* 底部按钮 */
+.btn-group {
+  display: flex;
+  padding: 0 2.083vw 5.556vh;
+  gap: 1.667vw;
+}
+
+.btn-item {
+  flex: 1;
+  height: 22.222vh;
+  border-radius: 1.667vw;
+  display: flex;
+  flex-direction: column;
+  align-items: center;
+  justify-content: center;
+  cursor: pointer;
+  transition: opacity 0.2s ease;
+}
+
+.btn-item:active {
+  opacity: 0.8;
+}
+
+.btn-icon {
+  width: 3.646vw;
+  height: 3.646vw;
+  margin-bottom: 1.667vh;
+}
+
+.btn-item text {
+  font-size: 3.021vw;
+  color: #fff;
+}
+
+.green {
+  background-color: #28c958;
+}
+
+.blue {
+  background-color: #1976f2;
+}
+
+.sky {
+  background-color: #18a0f0;
+}
+
+.orange {
+  background-color: #ff9922;
+}
+
+.red {
+  background-color: #ff6633;
+}
+
+/* 按钮禁用态 */
+.btn-item.disabled {
+  opacity: 0.4;
+  pointer-events: none;
+}
+
+/* ========== 弹窗通用 ========== */
+.transfer-mask {
+  position: fixed;
+  top: 0;
+  left: 0;
+  right: 0;
+  bottom: 0;
+  background: rgba(0, 0, 0, 0.5);
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  z-index: 999;
+}
+
+/* 转移弹窗 */
+.transfer-dialog {
+  width: 55vw;
+  max-height: 70vh;
+  background: #fff;
+  border-radius: 2vw;
+  padding: 3vh 2vw;
+  display: flex;
+  flex-direction: column;
+}
+
+.suspend-dialog {
+  width: 45vw;
+  background: #fff;
+  border-radius: 2vw;
+  padding: 4vh 3vw;
+  display: flex;
+  flex-direction: column;
+}
+
+.dialog-title {
+  font-size: 3vw;
+  font-weight: bold;
+  color: #333;
+  text-align: center;
+  margin-bottom: 3vh;
+  flex-shrink: 0;
+}
+
+.dialog-list {
+  flex: 1;
+  max-height: 45vh;
+  overflow-y: auto;
+  margin-bottom: 2vh;
+}
+
+.transfer-item {
+  display: flex;
+  justify-content: space-between;
+  align-items: center;
+  padding: 3vh 2vw;
+  border-bottom: 1px solid #eee;
+  cursor: pointer;
+}
+
+.transfer-item:active {
+  background: #f0f4ff;
+}
+
+.transfer-name {
+  font-size: 2.4vw;
+  font-weight: bold;
+  color: #1976f2;
+}
+
+.transfer-desc {
+  font-size: 2vw;
+  color: #999;
+}
+
+.dialog-empty {
+  text-align: center;
+  padding: 6vh 0;
+  font-size: 2.2vw;
+  color: #999;
+}
+
+.dialog-cancel {
+  text-align: center;
+  padding: 2vh 0;
+  font-size: 2.5vw;
+  color: #999;
+  cursor: pointer;
+}
+
+/* 挂起弹窗 */
+.suspend-input {
+  width: 100%;
+  height: 8vh;
+  border: 1px solid #ddd;
+  border-radius: 1vw;
+  padding: 0 2vw;
+  font-size: 2.2vw;
+  margin-bottom: 3vh;
+}
+
+.suspend-btns {
+  display: flex;
+  justify-content: space-between;
+  gap: 3vw;
+}
+
+.dialog-confirm {
+  flex: 1;
+  text-align: center;
+  padding: 2.5vh 0;
+  font-size: 2.5vw;
+  background: #ff6633;
+  color: #fff;
+  border-radius: 1.5vw;
+  cursor: pointer;
+}
+
+.dialog-confirm:active {
+  opacity: 0.8;
+}
+
+.dialog-cancel {
+  flex: 1;
+  text-align: center;
+  padding: 2.5vh 0;
+  font-size: 2.5vw;
+  background: #eee;
+  color: #666;
+  border-radius: 1.5vw;
+  cursor: pointer;
+}
+</style>
diff --git a/pages/callTicket/chooseWindow.vue b/pages/callTicket/chooseWindow.vue
new file mode 100644
index 0000000..eea2662
--- /dev/null
+++ b/pages/callTicket/chooseWindow.vue
@@ -0,0 +1,259 @@
+<template>
+  <view class="choose-win-wrap">
+    <!-- 顶部标题栏 -->
+    <view class="top-header">
+      <text class="header-title">环江毛南族自治县政务服务中心</text>
+    </view>
+
+    <!-- 主体内容区 -->
+    <view class="main-content">
+      <text class="main-title">请选择窗口</text>
+      <text class="main-subtitle">选择您当前所在的窗口工位</text>
+
+      <!-- 窗口列表卡片 -->
+      <view class="window-list" v-if="windowList.length > 0">
+        <view class="window-card" v-for="item in windowList" :key="item.id" @click="handleSelect(item)">
+          <view class="win-icon-text">{{ item.windowName }}</view>
+
+          <!-- <view class="win-info">
+            <text class="win-type">{{ item.windowType || '综合窗口' }}</text>
+            <text class="win-biz">{{ item.businessType || '综合业务' }}</text>
+          </view> -->
+        </view>
+      </view>
+
+      <!-- 空状态 -->
+      <view class="empty-state" v-else-if="!loading">
+        <text class="empty-text">暂无可选窗口</text>
+        <text class="empty-sub">请联系管理员检查窗口配置</text>
+      </view>
+
+      <!-- 加载中 -->
+      <view class="loading-state" v-if="loading">
+        <text class="loading-text">正在加载窗口列表...</text>
+      </view>
+    </view>
+  </view>
+</template>
+
+<script>
+import { getWindowList, selectWindow } from '@/api/ticket.js'
+
+export default {
+  name: 'ChooseWindow',
+  data() {
+    return {
+      windowList: [],
+      loading: false
+    }
+  },
+  mounted() {
+    this.fetchWindowList()
+  },
+  methods: {
+    // 获取可选窗口列表
+    async fetchWindowList() {
+      this.loading = true
+      try {
+        const res = await getWindowList({ status: 1, serviceStatus: 1 })
+        if (res.success && res.data) {
+          this.windowList = res.data.records || []
+        }
+      } catch (e) {
+        console.error('获取窗口列表失败', e)
+        uni.showToast({ title: '获取窗口列表失败', icon: 'none' })
+      } finally {
+        this.loading = false
+      }
+    },
+
+    // 选择窗口
+    async handleSelect(item) {
+      uni.showLoading({ title: '选择中...', mask: true })
+      try {
+        const res = await selectWindow({ windowId: item.id })
+        if (res.success && res.data) {
+          // 保存窗口信息到本地存储
+          const winInfo = {
+            windowId: res.data.windowId,
+            windowName: res.data.windowName,
+            serviceStatus: res.data.serviceStatus,
+            handlerUserId: res.data.handlerUserId,
+            handlerUserName: res.data.handlerUserName,
+            handlerDeptName: res.data.handlerDeptName
+          }
+          uni.setStorageSync('windowInfo', winInfo)
+
+          uni.hideLoading()
+          uni.showToast({ title: `已选择 ${res.data.windowName}`, icon: 'success', duration: 1000 })
+
+          // 跳转到叫号工作台
+          setTimeout(() => {
+            uni.redirectTo({
+              url: '/pages/callTicket/callTicket'
+            })
+          }, 800)
+        }
+      } catch (e) {
+        uni.hideLoading()
+        console.error('选择窗口失败', e)
+        uni.showToast({ title: '选择窗口失败，请重试', icon: 'none' })
+      }
+    }
+  }
+}
+</script>
+
+<style scoped>
+* {
+  box-sizing: border-box;
+}
+
+.choose-win-wrap {
+  width: 100vw;
+  height: 100vh;
+  display: flex;
+  flex-direction: column;
+  overflow: hidden;
+}
+
+/* ========== 顶部标题栏 ========== */
+.top-header {
+  width: 100%;
+  background-color: rgba(19, 114, 255, 1);
+  display: flex;
+  align-items: center;
+  padding: 2.5vh 0;
+  box-sizing: border-box;
+}
+
+.header-title {
+  font-size: 3.125vw;
+  color: #ffffff;
+  font-weight: bold;
+  padding-left: 2.083vw;
+  /* letter-spacing: 0.3vw; */
+  white-space: nowrap;
+}
+
+/* ========== 主体内容区 ========== */
+.main-content {
+  flex: 1;
+  display: flex;
+  flex-direction: column;
+  align-items: center;
+  justify-content: center;
+  padding: 2vh 3vw;
+  overflow: hidden;
+}
+
+.main-title {
+  font-size: 3.125vw;
+  font-weight: bold;
+  color: #1a1a2e;
+  margin-bottom: 1vh;
+  flex-shrink: 0;
+}
+
+.main-subtitle {
+  font-size: 2vw;
+  color: rgba(26, 26, 46, 0.55);
+  margin-bottom: 2vh;
+  flex-shrink: 0;
+}
+
+/* ========== 窗口列表 ========== */
+.window-list {
+  display: flex;
+  flex-wrap: wrap;
+  justify-content: center;
+  /* align-content: center; */
+  /* gap: 2vh 1.5vw; */
+  width: 100%;
+  flex: 1;
+}
+
+.window-card {
+  margin-right: 2vw;
+  width: 14vw;
+  height: 28vh;
+  background: #ffffff;
+  border-radius: 1.5vw;
+  display: flex;
+  flex-direction: column;
+  align-items: center;
+  justify-content: center;
+  box-shadow: 0 0.4vw 2vw rgba(95, 136, 255, 0.12);
+  cursor: pointer;
+  transition:
+    transform 0.2s ease,
+    box-shadow 0.2s ease;
+}
+
+.window-card:active {
+  transform: scale(0.95);
+  box-shadow: 0 0.2vw 1vw rgba(95, 136, 255, 0.3);
+}
+
+.win-icon-text {
+  padding: 0 1vw;
+  font-size: 2vw;
+  font-weight: bold;
+  color: #1976f2;
+  text-align: center;
+  /* white-space: nowrap; */
+}
+
+.win-info {
+  display: flex;
+  flex-direction: column;
+  align-items: center;
+  text-align: center;
+  width: 100%;
+  overflow: hidden;
+}
+
+.win-type {
+  font-size: 1.4vw;
+  font-weight: bold;
+  color: #1a1a2e;
+  margin-bottom: 0.5vh;
+  white-space: nowrap;
+  overflow: hidden;
+  text-overflow: ellipsis;
+  max-width: 90%;
+}
+
+.win-biz {
+  font-size: 1.1vw;
+  color: #999999;
+  white-space: nowrap;
+  overflow: hidden;
+  text-overflow: ellipsis;
+  max-width: 90%;
+}
+
+/* ========== 空状态 ========== */
+.empty-state {
+  display: flex;
+  flex-direction: column;
+  align-items: center;
+}
+
+.empty-text {
+  font-size: 3vw;
+  color: #999;
+  margin-bottom: 1vh;
+}
+
+.empty-sub {
+  font-size: 2vw;
+  color: #bbb;
+}
+
+/* ========== 加载中 ========== */
+.loading-text {
+  font-size: 2.5vw;
+  color: #999;
+}
+</style>
diff --git a/pages/home/businessList.vue b/pages/home/businessList.vue
index dd0263c..cc1f4d6 100644
--- a/pages/home/businessList.vue
+++ b/pages/home/businessList.vue
@@ -1,241 +1,234 @@
 <template>
-	<!-- backBtn+logoutBtn 开启顶部两个按钮 -->
-	<Container backBtn logoutBtn @handleBack="goBack">
-		<template #main>
-			<view class="wrap">
-				<view class="list-card">
-					<view class="page-title" v-if="titleName">{{ titleName }}</view>
-					<view class="item" v-for="(item, idx) in businessList" :key="idx">
-						<view class="left">
-							<text class="dot">◆</text>
-							<text class="title-text">{{ item.itemName }}</text>
-						</view>
-						<view class="btn-box">
-							<view class="btn-guide" @click="openGuide(item)">办事指南</view>
-							<view class="btn-take" @click="toTakeNum(item)">取号</view>
-						</view>
-					</view>
-					<view class="empty" v-if="businessList.length === 0">
-						暂无事项
-					</view>
-				</view>
-			</view>
-		</template>
-	</Container>
+  <!-- backBtn+logoutBtn 开启顶部两个按钮 -->
+  <Container backBtn logoutBtn @handleBack="goBack">
+    <template #main>
+      <view class="wrap">
+        <view class="list-card">
+          <view class="item" v-for="(item, idx) in businessList" :key="idx">
+            <view class="left">
+              <text class="dot">◆</text>
+              <text class="title-text">{{ item.itemName }}</text>
+            </view>
+            <view class="btn-box">
+              <view class="btn-guide" @click="openGuide(item)">办事指南</view>
+              <view class="btn-take" @click="toTakeNum(item)">取号</view>
+            </view>
+          </view>
+          <view class="empty" v-if="isEmpty === false"> 暂无事项 </view>
+        </view>
+      </view>
+    </template>
+  </Container>
 </template>
 
 <script>
-	import Container from '@/components/container/container.vue'
-	import {
-		getBusinessList,
-		getHistoryList,
-		takeNumber,
-	} from '@/api/ticket.js'
+import Container from '@/components/container/container.vue'
+import { getBusinessList, getHistoryList, takeNumber } from '@/api/ticket.js'
 
-	export default {
-		components: {
-			Container
-		},
-		data() {
-			return {
-				titleName: '',
-				source: '',
-				subjectId: '',
-				deptId: '',
-				idcard: '',
-				businessList: []
-			}
-		},
-		onLoad(options) {
-			this.source = options.source || ''
-			this.subjectId = options.subjectId || ''
-			this.deptId = options.deptId || ''
-			this.idcard = options.idcard || ''
-			this.titleName = options.titleName || options.subjectName || options.deptName || ''
-			this.fetchList()
-		},
-		methods: {
-			// 返回上一页
-			goBack() {
-				uni.navigateBack()
-			},
+export default {
+  components: {
+    Container
+  },
+  data() {
+    return {
+      titleName: '',
+      source: '',
+      subjectId: '',
+      deptId: '',
+      businessList: [],
+      isEmpty: null
+    }
+  },
+  computed: {
+    idcard() {
+      return uni.getStorageSync('idcard') || ''
+    }
+  },
+  onLoad(options) {
+    this.source = options.source || ''
+    this.subjectId = options.subjectId || ''
+    this.deptId = options.deptId || ''
+    this.titleName = options.titleName || options.subjectName || options.deptName || ''
+    this.fetchList()
+  },
+  methods: {
+    // 返回上一页
+    goBack() {
+      uni.navigateBack()
+    },
 
-			// 根据 source 调用不同接口
-			async fetchList() {
-				let res = null
-				try {
-					switch (this.source) {
-						case 'history':
-							// 历史取号
-							if (!this.idcard) {
-								console.warn('历史取号缺少身份证号')
-								return
-							}
-							res = await getHistoryList({
-								applicantIdCard: this.idcard
-							})
-							break
-						case 'business':
-							// 业务取号（全部事项）
-							res = await getBusinessList({
-								status: 1
-							})
-							break
-						case 'subject':
-						default:
-							// 主题取号 / 部门取号（兼容无 source 的旧跳转）
-							const params = { status: 1 }
-							if (this.subjectId) {
-								params.subjectId = this.subjectId
-							} else if (this.deptId) {
-								params.deptId = this.deptId
-							} else {
-								// 兼容默认：无筛选查全部
-							}
-							res = await getBusinessList(params)
-							break
-					}
-					if (res && res.success && res.data) {
-						this.businessList = res.data.records || []
-					}
-				} catch (e) {
-					console.error('获取列表失败', e)
-				}
-			},
+    // 根据 source 调用不同接口
+    async fetchList() {
+      let res = null
+      try {
+        switch (this.source) {
+          case 'history':
+            // 历史取号
+            if (!this.idcard) {
+              console.warn('历史取号缺少身份证号')
+              return
+            }
+            res = await getHistoryList({
+              applicantIdCard: this.idcard
+            })
+            break
+          case 'business':
+            // 业务取号（全部事项）
+            res = await getBusinessList({
+              status: 1
+            })
+            break
+          case 'subject':
+          default:
+            // 主题取号 / 部门取号（兼容无 source 的旧跳转）
+            const params = {
+              status: 1
+            }
+            if (this.subjectId) {
+              params.subjectId = this.subjectId
+            } else if (this.deptId) {
+              params.deptId = this.deptId
+            } else {
+              // 兼容默认：无筛选查全部
+            }
+            res = await getBusinessList(params)
+            break
+        }
+        if (res && res.success && res.data) {
+          this.businessList = res.data.records || []
+          this.isEmpty = this.businessList.length > 0 ? true : false
+        }
+      } catch (e) {
+        console.error('获取列表失败', e)
+      }
+    },
 
-			// 获取事项 ID（历史记录用 itemId，事项列表用 id）
-			getItemId(item) {
-				return item.itemId || item.id
-			},
+    // 获取事项 ID（历史记录用 itemId，事项列表用 id）
+    getItemId(item) {
+      return item.itemId || item.id
+    },
 
-			// 点击取号
-			async toTakeNum(row) {
-				if (!this.idcard) {
-					uni.showToast({
-						title: '请先刷身份证',
-						icon: 'none'
-					})
-					return
-				}
-				try {
-					const res = await takeNumber({
-						applicantIdCard: this.idcard,
-						itemId: this.getItemId(row)
-					})
-					if (res.success) {
-						uni.showToast({
-							title: '取号成功',
-							icon: 'none'
-						})
-					}
-				} catch (e) {
-					console.error('取号失败', e)
-				}
-			},
+    // 点击取号
+    async toTakeNum(row) {
+      if (!this.idcard) {
+        uni.showToast({
+          title: '请先刷身份证',
+          icon: 'none'
+        })
+        return
+      }
+      try {
+        const res = await takeNumber({
+          applicantIdCard: this.idcard,
+          itemId: this.getItemId(row)
+        })
+        if (res.success) {
+          uni.showToast({
+            title: '取号成功',
+            icon: 'none'
+          })
+        }
+      } catch (e) {
+        console.error('取号失败', e)
+      }
+    },
 
-			// 办事指南
-			openGuide(item) {
-				const id = this.getItemId(item)
-				uni.navigateTo({
-					url: `/pages/home/guide?id=${id}&itemName=${item.itemName}`
-				})
-			}
-		}
-	}
+    // 办事指南
+    openGuide(item) {
+      const id = this.getItemId(item)
+      uni.navigateTo({
+        url: `/pages/home/guide?id=${id}&itemName=${item.itemName}`
+      })
+    }
+  }
+}
 </script>
 
 <style scoped>
-	.wrap {
-		width: 100%;
-		height: 100%;
-		padding: 200px 60px 150px;
-		display: flex;
-		align-items: center;
-		justify-content: center;
-		box-sizing: border-box;
-	}
+.wrap {
+  width: 100%;
+  height: 100%;
+  padding: 15vh 5vw 10vh;
+  display: flex;
+  flex-direction: column;
+  align-items: center;
+  justify-content: center;
+  box-sizing: border-box;
+}
 
-	.list-card {
-		width: 100%;
-		height: 740px;
-		background: #fff;
-		border-radius: 60px;
-		padding: 30px 80px;
-		display: flex;
-		flex-direction: column;
-		overflow-y: auto;
-	}
+.list-card {
+  position: relative;
+  z-index: 100;
+  width: 100%;
+  height: 75vh;
+  background: #fff;
+  border-radius: 5vh;
+  padding: 3vh 5vw;
+  display: flex;
+  flex-direction: column;
+  overflow-y: auto;
+}
 
-	.page-title {
-		font-size: 36px;
-		font-weight: bold;
-		color: rgba(51, 51, 51, 1);
-		text-align: center;
-		padding: 20px 0 30px;
-		border-bottom: 2px solid rgba(188, 200, 209, 1);
-		margin-bottom: 20px;
-	}
+.item {
+  display: flex;
+  align-items: center;
+  justify-content: space-between;
+  padding: 2vh 0;
+  border-bottom: 0.1vh solid rgba(188, 200, 209, 1);
+}
 
-	.item {
-		display: flex;
-		align-items: center;
-		justify-content: space-between;
-		padding: 20px;
-		border-bottom: 1px solid rgba(188, 200, 209, 1);
-	}
+.item:first-child {
+  padding-top: 0;
+}
 
-	.item:first-child {
-		padding-top: 0;
-	}
+.item:last-child {
+  padding-bottom: 0;
+  border-bottom: none;
+}
 
-	.item:last-child {
-		padding-bottom: 0;
-		border-bottom: none;
-	}
+.left {
+  display: flex;
+  align-items: flex-start;
+  width: 68%;
+}
 
-	.left {
-		display: flex;
-		align-items: flex-start;
-		width: 68%;
-	}
+.dot {
+  color: #3688ff;
+  font-size: 1.6vw;
+  margin-right: 1.5vw;
+}
 
-	.dot {
-		color: #3688ff;
-		font-size: 30px;
-		margin-right: 20px;
-	}
+.title-text {
+  font-size: 1.6vw;
+  color: rgba(51, 51, 51, 1);
+  line-height: 1.5;
+}
 
-	.title-text {
-		font-size: 30px;
-		color: rgba(51, 51, 51, 1);
-		line-height: 1.5;
-	}
+.btn-box {
+  display: flex;
+  gap: 1.5vw;
+}
 
-	.btn-box {
-		display: flex;
-		gap: 20px;
-	}
+.btn-guide {
+  background: #28c068;
+  color: #fff;
+  font-size: 1.6vw;
+  padding: 1.2vh 3vw;
+  border-radius: 99px;
+}
 
-	.btn-guide {
-		background: #28c068;
-		color: #fff;
-		font-size: 30px;
-		padding: 1.2vh 3vw;
-		border-radius: 99px;
-	}
+.btn-take {
+  background: #367bfa;
+  color: #fff;
+  font-size: 1.6vw;
+  padding: 1.2vh 3vw;
+  border-radius: 99px;
+}
 
-	.btn-take {
-		background: #367bfa;
-		color: #fff;
-		font-size: 30px;
-		padding: 1.2vh 3vw;
-		border-radius: 99px;
-	}
-
-	.empty {
-		text-align: center;
-		font-size: 30px;
-		color: #999;
-		padding: 100px 0;
-	}
+.empty {
+  text-align: center;
+  font-size: 1.6vw;
+  color: #999;
+  padding: 10vh 0;
+}
 </style>
diff --git a/pages/home/chooseMachine.vue b/pages/home/chooseMachine.vue
new file mode 100644
index 0000000..119dd5c
--- /dev/null
+++ b/pages/home/chooseMachine.vue
@@ -0,0 +1,212 @@
+<template>
+  <view class="choose-wrap">
+    <!-- 顶部标题栏 -->
+    <view class="top-header">
+      <text class="header-title">环江毛南族自治县政务服务中心</text>
+    </view>
+
+    <!-- 主体内容区 -->
+    <view class="main-content">
+      <text class="main-title">请选择设备类型</text>
+      <text class="main-subtitle">请根据当前设备用途选择对应的使用模式</text>
+
+      <!-- 三个选项卡片 -->
+      <view class="card-group">
+        <!-- 取号机 -->
+        <view class="card" @click="goToPage('/pages/home/home', '取号机')">
+          <view class="card-icon-box ticket-bg">
+            <text class="card-icon-text">取</text>
+          </view>
+          <text class="card-title">取号机</text>
+          <text class="card-desc">自助排队取号</text>
+        </view>
+
+        <!-- 叫号机 -->
+        <view class="card" @click="goToPage('/pages/callTicket/chooseWindow', '叫号机')">
+          <view class="card-icon-box call-bg">
+            <text class="card-icon-text call-text">叫</text>
+          </view>
+          <text class="card-title">叫号机</text>
+          <text class="card-desc">窗口叫号管理</text>
+        </view>
+
+        <!-- 公告屏 -->
+        <view class="card" @click="goToPage('/pages/screen/index', '公告屏')">
+          <view class="card-icon-box screen-bg">
+            <text class="card-icon-text screen-text">屏</text>
+          </view>
+          <text class="card-title">公告屏</text>
+          <text class="card-desc">大屏信息展示</text>
+        </view>
+      </view>
+    </view>
+  </view>
+</template>
+
+<script>
+export default {
+  name: 'ChooseMachine',
+  methods: {
+    goToPage(url, name) {
+      uni.showModal({
+        title: '确认选择',
+        content: `确定进入【${name}】模式吗？选择后需重新登录才能切换。`,
+        success: res => {
+          if (res.confirm) {
+            uni.redirectTo({
+              url: url,
+              fail() {
+                uni.switchTab({
+                  url: url
+                })
+              }
+            })
+          }
+        }
+      })
+    }
+  }
+}
+</script>
+
+<style scoped>
+* {
+  box-sizing: border-box;
+}
+
+/* 全屏自适应容器 - flex弹性布局 */
+.choose-wrap {
+  width: 100vw;
+  height: 100vh;
+  display: flex;
+  flex-direction: column;
+  overflow: hidden;
+  /* background: linear-gradient(180deg, #5f88ff 0%, #e8edfa 45%, #f5f7fc 100%); */
+}
+
+/* ========== 顶部标题栏 ========== */
+.top-header {
+  width: 100%;
+  height: 16vh;
+  min-height: 100px;
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  background: rgba(19, 114, 255, 0.95);
+}
+
+.header-title {
+  font-size: clamp(32px, 5vw, 64px);
+  color: #ffffff;
+  font-weight: bold;
+  letter-spacing: 0.4vw;
+  white-space: nowrap;
+}
+
+/* ========== 主体内容区 ========== */
+.main-content {
+  flex: 1;
+  display: flex;
+  flex-direction: column;
+  align-items: center;
+  justify-content: center;
+  padding: 0 4vw 4vh;
+}
+
+.main-title {
+  font-size: clamp(36px, 6vw, 72px);
+  font-weight: bold;
+  color: #1a1a2e;
+  margin-bottom: 1.5vh;
+  letter-spacing: 0.3vw;
+}
+
+.main-subtitle {
+  font-size: clamp(22px, 3vw, 36px);
+  color: rgba(26, 26, 46, 0.55);
+  margin-bottom: 7vh;
+  letter-spacing: 0.1vw;
+}
+
+/* ========== 卡片组 ========== */
+.card-group {
+  display: flex;
+  flex-wrap: wrap;
+  justify-content: center;
+  gap: clamp(30px, 5vw, 80px);
+  width: 100%;
+}
+
+.card {
+  width: clamp(260px, 22vw, 400px);
+  min-width: 200px;
+  background: #ffffff;
+  border-radius: 32px;
+  padding: clamp(40px, 6vh, 80px) clamp(30px, 4vw, 50px) clamp(35px, 5vh, 70px);
+  display: flex;
+  flex-direction: column;
+  align-items: center;
+  box-shadow: 0 0.8vw 4vw rgba(95, 136, 255, 0.15);
+  cursor: pointer;
+  transition:
+    transform 0.2s ease,
+    box-shadow 0.2s ease;
+}
+
+.card:active {
+  transform: scale(0.95);
+  box-shadow: 0 0.4vw 2vw rgba(95, 136, 255, 0.3);
+}
+
+/* 图标圆形 */
+.card-icon-box {
+  width: clamp(100px, 12vw, 180px);
+  height: clamp(100px, 12vw, 180px);
+  border-radius: 50%;
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  margin-bottom: clamp(24px, 4vh, 48px);
+}
+
+.ticket-bg {
+  background: linear-gradient(135deg, #e8f0ff, #c5d8ff);
+}
+
+.call-bg {
+  background: linear-gradient(135deg, #e0f5e8, #b0e0c0);
+}
+
+.screen-bg {
+  background: linear-gradient(135deg, #fff3e8, #ffe0c0);
+}
+
+/* 图标文字 */
+.card-icon-text {
+  font-size: clamp(40px, 5vw, 80px);
+  font-weight: bold;
+  color: #5f88ff;
+}
+
+.call-text {
+  color: #2e9e5f;
+}
+
+.screen-text {
+  color: #e89840;
+}
+
+/* 卡片文字 */
+.card-title {
+  font-size: clamp(28px, 3.5vw, 52px);
+  font-weight: bold;
+  color: #1a1a2e;
+  margin-bottom: 1.5vh;
+}
+
+.card-desc {
+  font-size: clamp(18px, 2.2vw, 30px);
+  color: #999999;
+  letter-spacing: 0.1vw;
+}
+</style>
diff --git a/pages/home/dept.vue b/pages/home/dept.vue
index bf1a901..527fef8 100644
--- a/pages/home/dept.vue
+++ b/pages/home/dept.vue
@@ -1,119 +1,120 @@
 <template>
-	<Container backBtn logoutBtn @handleBack="handleBack">
-		<template #main>
-			<view class="theme-page">
-				<view class="card">
-					<view class="title">部门取号</view>
-					<view class="btn-group">
-						<view class="btn-item" v-for="(item, index) in deptList" :key="index"
-							@click="handleSelect(item)">
-							{{ item.deptName }}
-						</view>
-					</view>
-				</view>
-			</view>
-		</template>
-	</Container>
+  <Container backBtn logoutBtn @handleBack="handleBack">
+    <template #main>
+      <view class="theme-page">
+        <view class="card">
+          <view class="title">部门取号</view>
+          <view class="btn-group">
+            <view class="btn-item" v-for="(item, index) in deptList" :key="index" @click="handleSelect(item)">
+              {{ item.deptName }}
+            </view>
+          </view>
+        </view>
+      </view>
+    </template>
+  </Container>
 </template>
 
 <script>
-	import Container from '@/components/container/container.vue'
-	import {
-		getList,
-	} from '@/api/system/dept.js'
+import Container from '@/components/container/container.vue'
+import { getList } from '@/api/system/dept.js'
 
-	export default {
-		components: {
-			Container
-		},
-		data() {
-			return {
-				deptList: [],
-				idcard: ''
-			}
-		},
-		onLoad(options) {
-			this.idcard = options.idcard || ''
-		},
-		mounted() {
-			this.fetchDeptList()
-		},
-		methods: {
-			handleBack() {
-				uni.navigateBack()
-			},
+export default {
+  components: {
+    Container
+  },
+  data() {
+    return {
+      deptList: []
+    }
+  },
+  computed: {
+    idcard() {
+      return uni.getStorageSync('idcard') || ''
+    }
+  },
+  mounted() {
+    this.fetchDeptList()
+  },
+  methods: {
+    handleBack() {
+      uni.navigateBack()
+    },
 
-			handleSelect(item) {
-				uni.navigateTo({
-					url: `/pages/home/businessList?source=dept&deptId=${item.id}&deptName=${item.deptName}&idcard=${this.idcard}`
-				})
-			},
+    handleSelect(item) {
+      uni.navigateTo({
+        url: `/pages/home/businessList?source=dept&deptId=${item.id}&deptName=${item.deptName}`
+      })
+    },
 
-			async fetchDeptList() {
-				try {
-					const res = await getList({ parentId: '1123598813738675202' })
-					if (res.success && res.data) {
-						this.deptList = res.data.records || res.data || []
-					}
-				} catch (e) {
-					console.error('获取部门列表失败', e)
-				}
-			}
-		}
-	}
+    async fetchDeptList() {
+      try {
+        const res = await getList({ parentId: '1123598813738675202' })
+        if (res.success && res.data) {
+          this.deptList = res.data.records || res.data || []
+        }
+      } catch (e) {
+        console.error('获取部门列表失败', e)
+      }
+    }
+  }
+}
 </script>
 
 <style scoped>
-	.theme-page {
-		width: 100%;
-		height: 100%;
-		padding: 200px 60px 150px;
-		display: flex;
-		align-items: center;
-		justify-content: center;
-		box-sizing: border-box;
-	}
+.theme-page {
+  width: 100%;
+  height: 100%;
+  padding: 15vh 5vw 10vh;
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  box-sizing: border-box;
+}
 
-	.card {
-		width: 100%;
-		height: 740px;
-		background: #fff;
-		border-radius: 60px;
-		box-sizing: border-box;
-		display: flex;
-		flex-direction: column;
-		align-items: center;
-		padding: 40px;
-	}
+.card {
+  width: 100%;
+  height: 100%;
+  background: #fff;
+  border-radius: 5vh;
+  box-sizing: border-box;
+  display: flex;
+  flex-direction: column;
+  align-items: center;
+  padding: 4vh 3vw;
+}
 
-	.title {
-		font-size: 40px;
-		font-weight: bold;
-		color: rgba(51, 51, 51, 1);
-		margin-bottom: 60px;
-	}
+.title {
+  font-size: 2.5vw;
+  font-weight: bold;
+  color: rgba(51, 51, 51, 1);
+  margin-bottom: 5vh;
+}
 
-	.btn-group {
-		width: 100%;
-		flex: 1;
-		display: flex;
-		flex-wrap: wrap;
-		align-content: flex-start;
-		gap: 40px;
-	}
+.btn-group {
+  width: 100%;
+  flex: 1;
+  display: flex;
+  flex-wrap: wrap;
+  align-content: flex-start;
+}
 
-	.btn-item {
-		padding: 17px 25px;
-		width: 400px;
-		height: 140px;
-		text-align: center;
-		background: rgba(236, 243, 255, 1);
-		border-radius: 20px;
-		display: flex;
-		align-items: center;
-		justify-content: center;
-		font-size: 40px;
-		color: rgba(51, 51, 51, 1);
-		cursor: pointer;
-	}
+.btn-item {
+  margin: 0 2vw 2vw 0;
+  padding: 1.5vh 1.5vw;
+  width: 19vw;
+  height: 11vh;
+  text-align: center;
+  background: rgba(236, 243, 255, 1);
+  border-radius: 2vh;
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  font-size: 1.7vw;
+  color: rgba(51, 51, 51, 1);
+  cursor: pointer;
+}
+.btn-item:nth-child(4n) {
+  margin-right: 0;
+}
 </style>
diff --git a/pages/home/guide.vue b/pages/home/guide.vue
index 8cd5716..c893d43 100644
--- a/pages/home/guide.vue
+++ b/pages/home/guide.vue
@@ -1,115 +1,154 @@
 <template>
-	<Container backBtn logoutBtn @handleBack="backPrev">
-		<template #main>
-			<view class="page-wrap">
-				<view class="content-card">
-					<!-- 标题+右上角按钮 -->
-					<view class="top-row">
-						<view class="title">{{ info.title }}</view>
-						<view class="btn-take" @click="goScanCard">立即取号</view>
-					</view>
-					<!-- 部门信息 -->
-					<view class="dept-text">部门：{{ info.dept }}</view>
-					<!-- 办事详情正文 -->
-					<view class="desc-text">{{ info.content }}</view>
-				</view>
-			</view>
-		</template>
-	</Container>
+  <Container backBtn logoutBtn @handleBack="backPrev">
+    <template #main>
+      <view class="page-wrap">
+        <view class="content-card">
+          <!-- 标题+右上角按钮 -->
+          <view class="top-row">
+            <view class="title">{{ info.title }}</view>
+            <view class="btn-take" @click="goScanCard">立即取号</view>
+          </view>
+          <!-- 部门信息 -->
+          <view class="dept-text">部门：{{ info.dept }}</view>
+          <!-- 办事详情正文 -->
+          <view class="desc-text">{{ info.content }}</view>
+        </view>
+      </view>
+    </template>
+  </Container>
 </template>
 
 <script>
-	import Container from '@/components/container/container.vue'
-	export default {
-		components: {
-			Container
-		},
-		data() {
-			return {
-				// 接收上一页传过来的业务参数，没有则默认示例数据
-				info: {
-					title: '城镇职工基本养老保险关系转移接续申请',
-					dept: '公积金',
-					content: '《住房公积金管理条例》(1999年4月3日中华人民共和国国务院令第262号发布  根据2002年3月24日《国务院关于修改<住房公积金管理条例>的决定》和2019年3月24日《国务院关于修改部分行政法规的决定》修订)： 第二十四条 职工有下列情形之一的，可以提取职工住房公积金账户内的存储余额： (一)购买、建造、翻建、大修自住住房的; (二)离休、退休的; (三)完全丧失劳动能力，并与单位终止劳动关系的;(四)出境定居的; (五)偿还购房贷款本息的; (六)房租超出家庭工资收入的规定比例的。'
-				}
-			}
-		},
-		onLoad(options) {
-			// 接收业务列表页传参，动态赋值标题和内容
-			if (options.businessName) {
-				this.info.title = decodeURIComponent(options.businessName)
-			}
-		},
-		methods: {
-			// 返回上一页
-			backPrev() {
-				uni.navigateBack()
-			},
+import Container from '@/components/container/container.vue'
+import { getItemDetail, takeNumber } from '@/api/ticket.js'
 
-			// 立即取号→跳转刷身份证页面
-			goScanCard() {
-				uni.showToast({
-					title: '取号成功',
-					icon: 'none'
-				})
-			}
-		}
-	}
+export default {
+  components: {
+    Container
+  },
+  data() {
+    return {
+      itemId: '',
+      info: {
+        title: '',
+        dept: '',
+        content: ''
+      }
+    }
+  },
+  computed: {
+    idcard() {
+      return uni.getStorageSync('idcard') || ''
+    }
+  },
+  onLoad(options) {
+    this.itemId = options.id || ''
+    if (this.itemId) {
+      this.fetchDetail(this.itemId)
+    }
+  },
+  methods: {
+    // 返回上一页
+    backPrev() {
+      uni.navigateBack()
+    },
+
+    // 查询事项详情
+    async fetchDetail(id) {
+      try {
+        const res = await getItemDetail({ id })
+        if (res.success && res.data) {
+          const d = res.data
+          this.info.title = d.itemName || ''
+          this.info.dept = d.deptName || ''
+          this.info.content = d.guideContent || ''
+        }
+      } catch (e) {
+        console.error('获取事项详情失败', e)
+      }
+    },
+
+    // 立即取号
+    async goScanCard() {
+      if (!this.idcard) {
+        uni.showToast({
+          title: '请先刷身份证',
+          icon: 'none'
+        })
+        return
+      }
+      try {
+        const res = await takeNumber({
+          applicantIdCard: this.idcard,
+          itemId: this.itemId
+        })
+        if (res.success) {
+          uni.showToast({
+            title: '取号成功',
+            icon: 'none'
+          })
+        }
+      } catch (e) {
+        console.error('取号失败', e)
+      }
+    }
+  }
+}
 </script>
 
 <style scoped>
-	.page-wrap {
-		width: 100%;
-		height: 100%;
-		padding: 200px 60px 150px;
-		display: flex;
-		align-items: center;
-		justify-content: center;
-		box-sizing: border-box;
-	}
+.page-wrap {
+  width: 100%;
+  height: 100%;
+  padding: 15vh 5vw 10vh;
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  box-sizing: border-box;
+}
 
-	.content-card {
-		width: 100%;
-		height: 740px;
-		background: #fff;
-		border-radius: 60px;
-		padding: 30px 80px;
-		display: flex;
-		flex-direction: column;
-		overflow-y: auto;
-	}
+.content-card {
+  width: 100%;
+  height: 100%;
+  background: #fff;
+  border-radius: 5vh;
+  padding: 3vh 5vw;
+  display: flex;
+  flex-direction: column;
+  overflow-y: auto;
+}
 
-	.top-row {
-		display: flex;
-		justify-content: space-between;
-		align-items: flex-start;
-		margin-bottom: 1vh;
-	}
+.top-row {
+  display: flex;
+  justify-content: space-between;
+  align-items: flex-start;
+  margin-bottom: 1vh;
+}
 
-	.title {
-		font-size: 40px;
-		font-weight: bold;
-		color: rgba(51, 51, 51, 1);
-		width: 75%;
-	}
+.title {
+  font-size: 2vw;
+  font-weight: bold;
+  color: rgba(51, 51, 51, 1);
+  width: 75%;
+}
 
-	.btn-take {
-		background-color: #367bfa;
-		color: #fff;
-		font-size: 40px;
-		padding: 2vh 5vw;
-		border-radius: 999px;
-	}
+.btn-take {
+  background-color: #367bfa;
+  color: #fff;
+  font-size: 2vw;
+  padding: 1.5vh 4vw;
+  border-radius: 999px;
+}
 
-	.dept-text {
-		font-size: 36px;
-		color: rgba(51, 51, 51, 1);
-		margin-bottom: 3vh;
-	}
+.dept-text {
+  font-size: 2vw;
+  color: rgba(51, 51, 51, 1);
+  margin-bottom: 3vh;
+}
 
-	.desc-text {
-		font-size: 36px;
-		color: rgba(51, 51, 51, 1);
-		line-height: 1.8;
-	}
-</style>
\ No newline at end of file
+.desc-text {
+  font-size: 2vw;
+  color: rgba(51, 51, 51, 1);
+  line-height: 1.8;
+}
+</style>
diff --git a/pages/home/home.vue b/pages/home/home.vue
index 5ebd393..2a04f1c 100644
--- a/pages/home/home.vue
+++ b/pages/home/home.vue
@@ -1,101 +1,101 @@
 <template>
-	<view class="container">
-		<Container>
-			<template #main>
-				<view class="card">
-					<!-- 身份证图标区域 -->
-					<view class="id-card">
-					</view>
-					<!-- 提示文字 -->
-					<text class="tip">请刷身份证取号</text>
-					<input v-model="inputVal" placeholder="请输入内容" confirm-type="done" @confirm="goRoute" />
-				</view>
-			</template>
-		</Container>
-	</view>
+  <view class="container">
+    <Container>
+      <template #main>
+        <view class="card">
+          <!-- 身份证图标区域 -->
+          <view class="id-card"> </view>
+          <!-- 提示文字 -->
+          <text class="tip">请刷身份证取号</text>
+          <input v-model="inputVal" placeholder="请输入内容" confirm-type="done" @confirm="goRoute" />
+        </view>
+      </template>
+    </Container>
+  </view>
 </template>
 
 <script>
-	import Container from '@/components/container/container.vue'
-	export default {
-		name: 'SelfServiceMachine',
-		components: {
-			Container
-		},
-		data() {
-			return {
-				inputVal: '',
-				currentTime: ''
-			}
-		},
-		mounted() {
-			this.updateTime()
-			setInterval(() => {
-				this.updateTime()
-			}, 1000)
-			// APP端强制横屏
-			// #ifdef APP-PLUS
-			plus.screen.lockOrientation('landscape-primary')
-			// #endif
-		},
-		methods: {
-			updateTime() {
-				const now = new Date()
-				const year = now.getFullYear()
-				const month = String(now.getMonth() + 1).padStart(2, '0')
-				const day = String(now.getDate()).padStart(2, '0')
-				const hours = String(now.getHours()).padStart(2, '0')
-				const minutes = String(now.getMinutes()).padStart(2, '0')
-				const seconds = String(now.getSeconds()).padStart(2, '0')
-				this.currentTime = `${year}年${month}月${day}日 ${hours}:${minutes}:${seconds}`
-			},
-			goRoute() {
-				uni.navigateTo({
-					url: `/pages/home/ticket?idcard=${this.inputVal}`
-				})
-			}
-		}
-	}
+import Container from '@/components/container/container.vue'
+export default {
+  name: 'SelfServiceMachine',
+  components: {
+    Container
+  },
+  data() {
+    return {
+      inputVal: '',
+      currentTime: ''
+    }
+  },
+  mounted() {
+    this.updateTime()
+    setInterval(() => {
+      this.updateTime()
+    }, 1000)
+    // APP端强制横屏
+    // #ifdef APP-PLUS
+    plus.screen.lockOrientation('landscape-primary')
+    // #endif
+  },
+  methods: {
+    updateTime() {
+      const now = new Date()
+      const year = now.getFullYear()
+      const month = String(now.getMonth() + 1).padStart(2, '0')
+      const day = String(now.getDate()).padStart(2, '0')
+      const hours = String(now.getHours()).padStart(2, '0')
+      const minutes = String(now.getMinutes()).padStart(2, '0')
+      const seconds = String(now.getSeconds()).padStart(2, '0')
+      this.currentTime = `${year}年${month}月${day}日 ${hours}:${minutes}:${seconds}`
+    },
+    goRoute() {
+      // 全局存储身份证号
+      uni.setStorageSync('idcard', this.inputVal)
+      uni.navigateTo({
+        url: '/pages/home/ticket'
+      })
+    }
+  }
+}
 </script>
 
 <style scoped>
-	/* 中间卡片 - 百分比宽高 */
-	.card {
-		background: #ffffff;
-		width: 1200px;
-		height: 740px;
-		border-radius: 2.5%;
-		box-shadow: 0 1vh 3vh rgba(0, 123, 255, 0.15);
-		display: flex;
-		flex-direction: column;
-		align-items: center;
-		justify-content: center;
-	}
+/* 中间卡片 - 自适应宽高 */
+.card {
+  background: #ffffff;
+  width: 63vw;
+  height: 68vh;
+  border-radius: 2.5%;
+  box-shadow: 0 1vh 3vh rgba(0, 123, 255, 0.15);
+  display: flex;
+  flex-direction: column;
+  align-items: center;
+  justify-content: center;
+}
 
-	/* 身份证卡片 */
-	.id-card {
-		width: 511px;
-		height: 307px;
-		background: url('../../static/images/home/idcard_bg.png');
-		background-size: 100% 100%;
-		display: flex;
-		align-items: center;
-		padding: 0 5%;
-		margin-bottom: 5%;
-		box-sizing: border-box;
-	}
+/* 身份证卡片 */
+.id-card {
+  width: 27vw;
+  height: 28vh;
+  background: url('../../static/images/home/idcard_bg.png');
+  background-size: 100% 100%;
+  display: flex;
+  align-items: center;
+  padding: 0 5%;
+  margin-bottom: 5%;
+  box-sizing: border-box;
+}
 
+/* 提示文字 */
+.tip {
+  font-size: 5vh;
+  color: #222;
+  font-weight: 500;
+  letter-spacing: 0.2vh;
+}
 
-	/* 提示文字 */
-	.tip {
-		font-size: 5vh;
-		color: #222;
-		font-weight: 500;
-		letter-spacing: 0.2vh;
-	}
-
-	::v-deep .uni-input-wrapper {
-		width: 800rpx;
-		border: 2rpx solid #ccc;
-	}
+::v-deep .uni-input-wrapper {
+  width: 60vw;
+  border: 0.2vh solid #ccc;
+}
 </style>
diff --git a/pages/home/theme.vue b/pages/home/theme.vue
index 1460ffa..244ec2e 100644
--- a/pages/home/theme.vue
+++ b/pages/home/theme.vue
@@ -1,119 +1,121 @@
 <template>
-	<Container backBtn logoutBtn @handleBack="handleBack">
-		<template #main>
-			<view class="theme-page">
-				<view class="card">
-					<view class="title">主题取号</view>
-					<view class="btn-group">
-						<view class="btn-item" v-for="(item, index) in themeList" :key="index"
-							@click="handleSelect(item)">
-							{{ item.subjectName }}
-						</view>
-					</view>
-				</view>
-			</view>
-		</template>
-	</Container>
+  <Container backBtn logoutBtn @handleBack="handleBack">
+    <template #main>
+      <view class="theme-page">
+        <view class="card">
+          <view class="title">主题取号</view>
+          <view class="btn-group">
+            <view class="btn-item" v-for="(item, index) in themeList" :key="index" @click="handleSelect(item)">
+              {{ item.subjectName }}
+            </view>
+          </view>
+        </view>
+      </view>
+    </template>
+  </Container>
 </template>
 
 <script>
-	import Container from '@/components/container/container.vue'
-	import {
-		getThemeList,
-	} from '@/api/ticket.js'
+import Container from '@/components/container/container.vue'
+import { getThemeList } from '@/api/ticket.js'
 
-	export default {
-		components: {
-			Container
-		},
-		data() {
-			return {
-				themeList: [],
-				idcard: ''
-			}
-		},
-		onLoad(options) {
-			this.idcard = options.idcard || ''
-		},
-		mounted() {
-			this.fetchThemeList()
-		},
-		methods: {
-			handleBack() {
-				uni.navigateBack()
-			},
+export default {
+  components: {
+    Container
+  },
+  data() {
+    return {
+      themeList: []
+    }
+  },
+  computed: {
+    idcard() {
+      return uni.getStorageSync('idcard') || ''
+    }
+  },
+  mounted() {
+    this.fetchThemeList()
+  },
+  methods: {
+    handleBack() {
+      uni.navigateBack()
+    },
 
-			handleSelect(item) {
-				uni.navigateTo({
-					url: `/pages/home/businessList?source=subject&subjectId=${item.id}&subjectName=${item.subjectName}&idcard=${this.idcard}`
-				})
-			},
+    handleSelect(item) {
+      uni.navigateTo({
+        url: `/pages/home/businessList?source=subject&subjectId=${item.id}&subjectName=${item.subjectName}`
+      })
+    },
 
-			async fetchThemeList() {
-				try {
-					const res = await getThemeList({ status: 1 })
-					if (res.success && res.data) {
-						this.themeList = res.data.records || []
-					}
-				} catch (e) {
-					console.error('获取主题列表失败', e)
-				}
-			}
-		}
-	}
+    async fetchThemeList() {
+      try {
+        const res = await getThemeList({ status: 1 })
+        if (res.success && res.data) {
+          this.themeList = res.data.records || []
+        }
+      } catch (e) {
+        console.error('获取主题列表失败', e)
+      }
+    }
+  }
+}
 </script>
 
 <style scoped>
-	.theme-page {
-		width: 100%;
-		height: 100%;
-		padding: 200px 60px 150px;
-		display: flex;
-		align-items: center;
-		justify-content: center;
-		box-sizing: border-box;
-	}
+.theme-page {
+  width: 100%;
+  height: 100%;
+  padding: 15vh 5vw 10vh;
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  box-sizing: border-box;
+}
 
-	.card {
-		width: 100%;
-		height: 740px;
-		background: #fff;
-		border-radius: 60px;
-		box-sizing: border-box;
-		display: flex;
-		flex-direction: column;
-		align-items: center;
-		padding: 40px;
-	}
+.card {
+  width: 100%;
+  height: 100%;
+  background: #fff;
+  border-radius: 5vh;
+  box-sizing: border-box;
+  display: flex;
+  flex-direction: column;
+  align-items: center;
+  padding: 4vh 3vw;
+}
 
-	.title {
-		font-size: 40px;
-		font-weight: bold;
-		color: rgba(51, 51, 51, 1);
-		margin-bottom: 60px;
-	}
+.title {
+  font-size: 2.5vw;
+  font-weight: bold;
+  color: rgba(51, 51, 51, 1);
+  margin-bottom: 5vh;
+}
 
-	.btn-group {
-		width: 100%;
-		flex: 1;
-		display: flex;
-		flex-wrap: wrap;
-		align-content: flex-start;
-		gap: 40px;
-	}
+.btn-group {
+  width: 100%;
+  flex: 1;
+  display: flex;
+  flex-wrap: wrap;
+  align-content: flex-start;
+}
 
-	.btn-item {
-		padding: 17px 25px;
-		width: 400px;
-		height: 140px;
-		text-align: center;
-		background: rgba(236, 243, 255, 1);
-		border-radius: 20px;
-		display: flex;
-		align-items: center;
-		justify-content: center;
-		font-size: 40px;
-		color: rgba(51, 51, 51, 1);
-		cursor: pointer;
-	}
+.btn-item {
+  margin: 0 2vw 2vw 0;
+  padding: 1.5vh 1.5vw;
+  width: 19vw;
+  height: 11vh;
+  text-align: center;
+  background: rgba(236, 243, 255, 1);
+  border-radius: 2vh;
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  font-size: 2vw;
+  color: rgba(51, 51, 51, 1);
+  cursor: pointer;
+}
+
+.btn-item:nth-child(4n) {
+  margin-right: 0;
+}
 </style>
diff --git a/pages/home/ticket.vue b/pages/home/ticket.vue
index f7c36b6..831833f 100644
--- a/pages/home/ticket.vue
+++ b/pages/home/ticket.vue
@@ -35,12 +35,13 @@ export default {
   },
   data() {
     return {
-      recommendList: [],
-      idcard: ''
+      recommendList: []
     }
   },
-  onLoad(options) {
-    this.idcard = options.idcard || ''
+  computed: {
+    idcard() {
+      return uni.getStorageSync('idcard') || ''
+    }
   },
   mounted() {
     this.fetchHotList()
@@ -53,7 +54,7 @@ export default {
           hot: 1,
           status: 1,
           current: 1,
-          size: 6,
+          size: 12,
           descs: 'create_time,id'
         })
         if (res.success && res.data) {
@@ -74,25 +75,25 @@ export default {
     // 主题取号
     goTheme() {
       uni.navigateTo({
-        url: `/pages/home/theme?idcard=${this.idcard}`
+        url: '/pages/home/theme'
       })
     },
     // 部门取号
     goDept() {
       uni.navigateTo({
-        url: `/pages/home/dept?idcard=${this.idcard}`
+        url: '/pages/home/dept'
       })
     },
     // 历史取号
     goHistory() {
       uni.navigateTo({
-        url: `/pages/home/businessList?source=history&idcard=${this.idcard}&titleName=历史取号`
+        url: '/pages/home/businessList?source=history&titleName=历史取号'
       })
     },
     // 业务取号
     goBusiness() {
       uni.navigateTo({
-        url: `/pages/home/businessList?source=business&titleName=业务取号`
+        url: '/pages/home/businessList?source=business&titleName=业务取号'
       })
     }
   }
@@ -109,33 +110,42 @@ export default {
   height: 100%;
   display: flex;
   align-items: center;
-  justify-content: space-around;
-  padding: 0 5%;
+  justify-content: space-between;
+  padding: 0 4vw;
   box-sizing: border-box;
 }
 
-/* 左侧按钮组 */
+/* 左侧四大功能按钮 - 2×2 网格 */
 .btn-group {
-  /* width: 60%; */
-  /* height: 85%; */
+  padding-top: 2vw;
   display: flex;
   flex-wrap: wrap;
-  /* justify-content: space-between; */
-  align-content: space-around;
+  align-content: center;
+  /* justify-content: center; */
+  /* gap: 3vh 3vw; */
 }
 
 .btn-item {
-  width: 500px;
-  height: 340px;
+  margin: 0 2vw 2vw 0;
+  width: 28vw;
+  height: 32vh;
   display: flex;
   flex-direction: column;
   align-items: center;
   justify-content: center;
+  background-size: 100% 100%;
+  background-repeat: no-repeat;
+  background-position: center;
+}
+.btn-item:nth-child(n + 3),
+.btn-item:nth-child(n + 4) {
+  margin-bottom: 0;
+}
+.btn-item:nth-child(2n) {
+  margin-right: 0;
 }
 
 .btn-item.blue {
-  margin-right: 60px;
-  margin-bottom: 60px;
   background: url('../../static/images/ticket/theme_bg.png');
   background-size: 100% 100%;
 }
@@ -146,7 +156,6 @@ export default {
 }
 
 .btn-item.orange {
-  margin-right: 60px;
   background: url('../../static/images/ticket/history_bg.png');
   background-size: 100% 100%;
 }
@@ -158,28 +167,33 @@ export default {
 
 /* 右侧热门推荐 */
 .hot-recommend {
-  width: 55%;
-  height: 740px;
+  margin-top: 2vw;
+  width: 54vw;
+  height: 68vh;
   background: #fff;
-  border-radius: 20px;
-  box-shadow: 0 4px 12px rgba(0, 0, 0, 0.08);
-  padding: 40px 40px 16px;
+  border-radius: 1.5vw;
+  box-shadow: 0 0.5vh 1.5vh rgba(0, 0, 0, 0.08);
+  padding: 3vh 2vw 2vh;
   box-sizing: border-box;
+  display: flex;
+  flex-direction: column;
 }
 
 .recommend-title {
-  font-size: 40px;
+  font-size: 2.4vw;
   font-weight: bold;
   color: rgba(51, 51, 51, 1);
   text-align: center;
-  margin-bottom: 30px;
+  margin-bottom: 2.5vh;
+  flex-shrink: 0;
 }
 
 .recommend-list {
   display: flex;
   flex-direction: column;
-  justify-content: space-around;
-  height: 85%;
+  gap: 2.5vh;
+  flex: 1;
+  overflow-y: auto;
 }
 
 .recommend-item {
@@ -190,12 +204,13 @@ export default {
 
 .dot {
   color: #4080ff;
-  font-size: 30px;
-  margin-right: 10px;
+  font-size: 1.8vw;
+  margin-right: 0.8vw;
+  flex-shrink: 0;
 }
 
 .text {
-  font-size: 30px;
+  font-size: 1.8vw;
   color: rgba(51, 51, 51, 1);
 }
 </style>
diff --git a/pages/login/login-account.vue b/pages/login/login-account.vue
index 1e3717c..8daa8fa 100644
--- a/pages/login/login-account.vue
+++ b/pages/login/login-account.vue
@@ -47,7 +47,7 @@
 				username: '',
 				password: '',
 				disabled: false,
-				redirect: '/pages/home/home'
+				redirect: '/pages/home/chooseMachine'
 			}
 		},
 		methods: {
diff --git a/pages/screen/index.vue b/pages/screen/index.vue
index c9c6b7c..b9fac9b 100644
--- a/pages/screen/index.vue
+++ b/pages/screen/index.vue
@@ -1,284 +1,276 @@
 <template>
-	<view class="screen-wrap" :style="scaleWrap">
-		<!-- 顶部标题栏 -->
-		<view class="top-header">
-			<text class="title-left">环江毛南族自治县政务服务中心</text>
-			<view class="title-right">
-				<text>{{dateStr}}</text>
-				<text>{{weekStr}} {{timeStr}}</text>
-			</view>
-		</view>
-		<!-- 中间大字播报区 -->
-		<view class="big-call">
-			<text class="normal-text">请</text>
-			<text class="yellow-text">{{currCallNo}}</text>
-			<text class="normal-text">到</text>
-			<text class="yellow-text">{{currWinNo}}号窗口</text>
-		</view>
-		<!-- 左右双栏表格区域 -->
-		<view class="table-box">
-			<!-- 左：当前呼叫 -->
-			<view class="table-left">
-				<view class="table-head">
-					<text>当前呼叫</text>
-					<text class="tip-text">(过号需重新取号)</text>
-				</view>
-				<view class="table-row" v-for="(item,idx) in callList" :key="idx" :class="idx%2===1?'row-blue':''">
-					<text>请</text>
-					<text class="row-no">{{item.no}}</text>
-					<text>到</text>
-					<text class="row-no">{{item.win}}号窗口</text>
-				</view>
-			</view>
-			<!-- 右：等候办理 -->
-			<view class="table-right">
-				<view class="table-head">等候办理</view>
-				<view class="table-row wait-row" v-for="(row,idx) in waitList" :key="idx"
-					:class="idx%2===1?'row-blue':''">
-					<text v-for="(item,i) in row" :key="i">{{item}}</text>
-				</view>
-			</view>
-		</view>
-	</view>
+  <view class="screen-wrap">
+    <!-- 顶部标题栏 -->
+    <view class="top-header">
+      <text class="title-left">环江毛南族自治县政务服务中心</text>
+      <view class="title-right">
+        <text>{{ dateStr }}</text>
+        <text>{{ weekStr }} {{ timeStr }}</text>
+      </view>
+    </view>
+    <!-- 中间大字播报区 -->
+    <view class="big-call">
+      <text class="normal-text">请</text>
+      <text class="yellow-text">{{ currCallNo }}</text>
+      <text class="normal-text">到</text>
+      <text class="yellow-text">{{ currWinNo }}号窗口</text>
+    </view>
+    <!-- 左右双栏表格区域 -->
+    <view class="table-box">
+      <!-- 左：当前呼叫 -->
+      <view class="table-left">
+        <view class="table-head">
+          <text>当前呼叫</text>
+          <text class="tip-text">(过号需重新取号)</text>
+        </view>
+        <view class="table-list">
+          <view class="table-row" v-for="(item, idx) in callList" :key="idx" :class="idx % 2 === 1 ? 'row-blue' : ''">
+            <text>请</text>
+            <text class="row-no">{{ item.no }}</text>
+            <text>到</text>
+            <text class="row-no">{{ item.win }}号窗口</text>
+          </view>
+        </view>
+      </view>
+      <!-- 右：等候办理 -->
+      <view class="table-right">
+        <view class="table-head">等候办理</view>
+        <view class="table-list">
+          <view class="table-row wait-row" v-for="(row, idx) in waitList" :key="idx" :class="idx % 2 === 1 ? 'row-blue' : ''">
+            <text v-for="(item, i) in row" :key="i">{{ item }}</text>
+          </view>
+        </view>
+      </view>
+    </view>
+  </view>
 </template>
 
 <script>
-	export default {
-		name: "CallScreen",
-		data() {
-			return {
-				designW: 1920,
-				designH: 1080,
-				scaleWrap: {
-					width: "1920px",
-					height: "1080px",
-					transformOrigin: "left top",
-					transform: "scale(1)"
-				},
-				// 实时日期时间
-				dateStr: "",
-				weekStr: "",
-				timeStr: "",
-				timer: null, // 定时器
-				//顶部大字播报
-				currCallNo: "A010",
-				currWinNo: "2",
-				//左侧当前呼叫数据
-				callList: [{
-						no: "A0009",
-						win: "1"
-					},
-					{
-						no: "A0009",
-						win: "1"
-					},
-					{
-						no: "A0009",
-						win: "1"
-					},
-					{
-						no: "A0009",
-						win: "1"
-					},
-					{
-						no: "A0009",
-						win: "1"
-					},
-					{
-						no: "A0009",
-						win: "1"
-					},
-					{
-						no: "A0009",
-						win: "1"
-					},
-					{
-						no: "A0009",
-						win: "1"
-					},
-				],
-				//右侧等候队列 三列一组
-				waitList: [
-					["A0001", "A0002", "A0003"],
-					["A0004", "A0005", "A0006"],
-					["A0001", "A0001", "A0001"],
-					["A0001", "A0001", "A0001"],
-					["A0001", "A0001", "A0001"],
-					["A0001", "A0001", "A0001"],
-					["A0001", "A0001", "A0001"],
-					["A0001", "A0001", "A0001"],
-				]
-			}
-		},
-		onLoad() {
-			this.setScale()
-			this.getNowTime() // 首次赋值时间
-			// 每秒刷新时间
-			this.timer = setInterval(() => {
-				this.getNowTime()
-			}, 1000)
-			window.addEventListener("resize", this.setScale)
-		},
-		onUnload() {
-			window.removeEventListener("resize", this.setScale)
-			// 销毁定时器防止内存泄漏
-			clearInterval(this.timer)
-		},
-		methods: {
-			//大屏自适应缩放
-			setScale() {
-				const w = document.documentElement.clientWidth
-				const h = document.documentElement.clientHeight
-				const sX = w / this.designW
-				const sY = h / this.designH
-				const scale = Math.min(sX, sY)
-				this.scaleWrap.transform = `scale(${scale})`
-			},
-			// 获取系统实时时间
-			getNowTime() {
-				const now = new Date()
-				const year = now.getFullYear()
-				const month = this.addZero(now.getMonth() + 1)
-				const day = this.addZero(now.getDate())
-				const hour = this.addZero(now.getHours())
-				const minute = this.addZero(now.getMinutes())
-				// const second = this.addZero(now.getSeconds())
-				// 星期映射
-				const weekArr = ["星期日", "星期一", "星期二", "星期三", "星期四", "星期五", "星期六"]
-				const week = weekArr[now.getDay()]
+export default {
+  name: 'CallScreen',
+  data() {
+    return {
+      // 实时日期时间
+      dateStr: '',
+      weekStr: '',
+      timeStr: '',
+      timer: null, // 定时器
+      //顶部大字播报
+      currCallNo: 'A010',
+      currWinNo: '2',
+      //左侧当前呼叫数据
+      callList: [
+        {
+          no: 'A0009',
+          win: '1'
+        },
+        {
+          no: 'A0009',
+          win: '1'
+        },
+        {
+          no: 'A0009',
+          win: '1'
+        },
+        {
+          no: 'A0009',
+          win: '1'
+        },
+        {
+          no: 'A0009',
+          win: '1'
+        },
+        {
+          no: 'A0009',
+          win: '1'
+        },
+        {
+          no: 'A0009',
+          win: '1'
+        },
+        {
+          no: 'A0009',
+          win: '1'
+        }
+      ],
+      //右侧等候队列 三列一组
+      waitList: [
+        ['A0001', 'A0002', 'A0003'],
+        ['A0004', 'A0005', 'A0006'],
+        ['A0001', 'A0001', 'A0001'],
+        ['A0001', 'A0001', 'A0001'],
+        ['A0001', 'A0001', 'A0001'],
+        ['A0001', 'A0001', 'A0001'],
+        ['A0001', 'A0001', 'A0001'],
+        ['A0001', 'A0001', 'A0001']
+      ]
+    }
+  },
+  onLoad() {
+    this.getNowTime() // 首次赋值时间
+    // 每秒刷新时间
+    this.timer = setInterval(() => {
+      this.getNowTime()
+    }, 1000)
+  },
+  onUnload() {
+    // 销毁定时器防止内存泄漏
+    clearInterval(this.timer)
+  },
+  methods: {
+    // 获取系统实时时间
+    getNowTime() {
+      const now = new Date()
+      const year = now.getFullYear()
+      const month = this.addZero(now.getMonth() + 1)
+      const day = this.addZero(now.getDate())
+      const hour = this.addZero(now.getHours())
+      const minute = this.addZero(now.getMinutes())
+      // const second = this.addZero(now.getSeconds())
+      // 星期映射
+      const weekArr = ['星期日', '星期一', '星期二', '星期三', '星期四', '星期五', '星期六']
+      const week = weekArr[now.getDay()]
 
-				this.dateStr = `${year}年${month}月${day}日`
-				this.weekStr = week
-				this.timeStr = `${hour}:${minute}`
-			},
-			// 数字补0
-			addZero(num) {
-				return num < 10 ? '0' + num : num
-			}
-		}
-	}
+      this.dateStr = `${year}年${month}月${day}日`
+      this.weekStr = week
+      this.timeStr = `${hour}:${minute}`
+    },
+    // 数字补0
+    addZero(num) {
+      return num < 10 ? '0' + num : num
+    }
+  }
+}
 </script>
 
 <style scoped>
-	/*基准1920*1080大屏 */
-	.screen-wrap {
-		width: 1920px;
-		height: 1080px;
-		background: #083378;
-		display: flex;
-		flex-direction: column;
-		overflow: hidden;
-	}
+* {
+  box-sizing: border-box;
+}
 
-	/*顶部蓝色栏 */
-	.top-header {
-		width: 100%;
-		height: 140px;
-		background: #167bff;
-		display: flex;
-		justify-content: space-between;
-		align-items: center;
-		padding: 0 50px;
-		box-sizing: border-box;
-	}
+/* 使用 vw/vh 自适应屏幕，设计基准 1920*1080 */
+.screen-wrap {
+  width: 100vw;
+  height: 100vh;
+  background: #083378;
+  display: flex;
+  flex-direction: column;
+  overflow: hidden;
+}
 
-	.title-left {
-		font-size: 62px;
-		color: #fff;
-		font-weight: bold;
-	}
+/*顶部蓝色栏 */
+.top-header {
+  width: 100%;
+  height: 12.963vh; /* 140/1080*100 */
+  background: #167bff;
+  display: flex;
+  justify-content: space-between;
+  align-items: center;
+  padding: 0 2.604vw; /* 50/1920*100 */
+  box-sizing: border-box;
+}
 
-	.title-right {
-		display: flex;
-		flex-direction: column;
-		align-items: flex-end;
-	}
+.title-left {
+  font-size: 3.229vw; /* 62/1920*100 */
+  color: #fff;
+  font-weight: bold;
+}
 
-	.title-right text {
-		font-size: 40px;
-		color: #fff;
-		line-height: 50px;
-	}
+.title-right {
+  display: flex;
+  flex-direction: column;
+  align-items: flex-end;
+}
 
-	/*中间大字叫号 */
-	.big-call {
-		height: 260px;
-		display: flex;
-		justify-content: center;
-		align-items: center;
-		gap: 30px;
-	}
+.title-right text {
+  font-size: 2.083vw; /* 40/1920*100 */
+  color: #fff;
+  line-height: 4.63vh; /* 50/1080*100 */
+}
 
-	.normal-text {
-		font-size: 120px;
-		color: #ffffff;
-		font-weight: bold;
-	}
+/*中间大字叫号 */
+.big-call {
+  height: 24.074vh; /* 260/1080*100 */
+  display: flex;
+  justify-content: center;
+  align-items: center;
+  gap: 1.563vw; /* 30/1920*100 */
+}
 
-	.yellow-text {
-		font-size: 120px;
-		color: #ffef33;
-		font-weight: bold;
-	}
+.normal-text {
+  font-size: 6.25vw; /* 120/1920*100 */
+  color: #ffffff;
+  font-weight: bold;
+}
 
-	/*左右表格容器 */
-	.table-box {
-		flex: 1;
-		display: flex;
-		gap: 30px;
-		padding: 0 30px 30px;
-		box-sizing: border-box;
-	}
+.yellow-text {
+  font-size: 6.25vw; /* 120/1920*100 */
+  color: #ffef33;
+  font-weight: bold;
+}
 
-	.table-left,
-	.table-right {
-		flex: 1;
-		display: flex;
-		flex-direction: column;
-		border-radius: 16px;
-		overflow: hidden;
-	}
+/*左右表格容器 */
+.table-box {
+  flex: 1;
+  display: flex;
+  gap: 1.563vw; /* 30/1920*100 */
+  padding: 0 1.563vw 2.778vh; /* 0 30/1920*100 30/1080*100 */
+  box-sizing: border-box;
+}
 
-	.table-head {
-		width: 100%;
-		height: 110px;
-		background: #167bff;
-		display: flex;
-		justify-content: center;
-		align-items: center;
-		font-size: 52px;
-		color: #fff;
-		font-weight: bold;
-	}
+.table-left,
+.table-right {
+  flex: 1;
+  display: flex;
+  flex-direction: column;
+  border-radius: 0.833vw; /* 16/1920*100 */
+}
 
-	.tip-text {
-		font-size: 36px;
-		margin-left: 20px;
-		opacity: 0.9;
-	}
+.table-head {
+  width: 100%;
+  height: 10.185vh; /* 110/1080*100 */
+  background: #167bff;
+  display: flex;
+  justify-content: center;
+  align-items: center;
+  font-size: 2.708vw; /* 52/1920*100 */
+  color: #fff;
+  font-weight: bold;
+}
 
-	/*表格行样式 */
-	.table-row {
-		width: 100%;
-		flex: 1;
-		display: flex;
-		justify-content: center;
-		align-items: center;
-		font-size: 54px;
-		background: #ffffff;
-	}
+.tip-text {
+  font-size: 1.875vw; /* 36/1920*100 */
+  margin-left: 1.042vw; /* 20/1920*100 */
+  opacity: 0.9;
+}
 
-	.wait-row {
-		justify-content: space-around;
-	}
+.table-list {
+  height: 60vh;
+  overflow-y: auto;
+}
 
-	.row-blue {
-		background: #e6f0ff;
-	}
+/*表格行样式 */
+.table-row {
+  width: 100%;
+  flex: 1;
+  display: flex;
+  justify-content: center;
+  align-items: center;
+  font-size: 2.813vw; /* 54/1920*100 */
+  background: #ffffff;
+}
 
-	.row-no {
-		color: #0055ff;
-		font-weight: bold;
-		margin: 0 20px;
-	}
-</style>
\ No newline at end of file
+.wait-row {
+  justify-content: space-around;
+}
+
+.row-blue {
+  background: #e6f0ff;
+}
+
+.row-no {
+  color: #0055ff;
+  font-weight: bold;
+  margin: 0 1.042vw; /* 20/1920*100 */
+}
+</style>
diff --git a/pages/takeTicket/index.vue b/pages/takeTicket/index.vue
deleted file mode 100644
index 20c25bf..0000000
--- a/pages/takeTicket/index.vue
+++ /dev/null
@@ -1,262 +0,0 @@
-<template>
-	<!-- 外层容器固定设计稿1920*1080，大屏自动等比缩放 -->
-	<view class="wrap" :style="scaleStyle">
-		<!-- 顶部蓝色头部 -->
-		<view class="header-bar">
-			<view class="header-left">
-				<text class="win-no">窗口号：001</text>
-				<view class="user-dept">
-					<text>王专员</text>
-					<text>人社局</text>
-				</view>
-			</view>
-			<view class="exit-btn" @click="handleExit">
-				<!-- 退出电源图标 预留image -->
-				<img class="icon-exit" src="../../static/images/home/logout_icon.png" />
-				<text>退出</text>
-			</view>
-		</view>
-
-		<!-- 中间内容区域 -->
-		<view class="content-box">
-			<view class="item-col">
-				<text class="col-title">当前叫号</text>
-				<text class="call-no">A0001</text>
-			</view>
-			<view class="item-col">
-				<text class="col-title">当前等候</text>
-				<text class="wait-num">10人</text>
-			</view>
-		</view>
-
-		<!-- 底部功能按钮区 -->
-		<view class="btn-group">
-			<view class="btn-item green" @click="handleCall">
-				<img class="btn-icon" src="../../static/images/takeTicket/hj_icon.png" mode="aspectFit"></img>
-				<text>呼叫</text>
-			</view>
-			<view class="btn-item blue" @click="handleReCall">
-				<img class="btn-icon" src="../../static/images/takeTicket/ch_icon.png" mode="aspectFit"></img>
-				<text>重呼</text>
-			</view>
-			<view class="btn-item sky" @click="handleTransfer">
-				<img class="btn-icon" src="../../static/images/takeTicket/zy_icon.png" mode="aspectFit"></img>
-				<text>转移</text>
-			</view>
-			<view class="btn-item orange" @click="handleOver">
-				<img class="btn-icon" src="../../static/images/takeTicket/gh_icon.png" mode="aspectFit"></img>
-				<text>过号</text>
-			</view>
-			<view class="btn-item red" @click="handleHang">
-				<img class="btn-icon" src="../../static/images/takeTicket/gq_icon.png" mode="aspectFit"></img>
-				<text>挂起</text>
-			</view>
-		</view>
-	</view>
-</template>
-
-<script>
-	export default {
-		name: 'CallWindow',
-		data() {
-			return {
-				// 设计稿尺寸 1920*1080
-				designW: 1920,
-				designH: 1080,
-				scaleStyle: {
-					width: '1920px',
-					height: '1080px',
-					transformOrigin: 'left top',
-					transform: 'scale(1)'
-				}
-			}
-		},
-		onMounted() {
-			// 大屏自动缩放适配屏幕
-			this.calcScale()
-			window.addEventListener('resize', this.calcScale)
-		},
-		onUnload() {
-			window.removeEventListener('resize', this.calcScale)
-		},
-		methods: {
-			// 计算缩放比例
-			calcScale() {
-				const screenW = document.documentElement.clientWidth
-				const screenH = document.documentElement.clientHeight
-				const scaleX = screenW / this.designW
-				const scaleY = screenH / this.designH
-				const scale = Math.min(scaleX, scaleY)
-				this.scaleStyle.transform = `scale(${scale})`
-			},
-			// 按钮事件
-			handleExit() {
-				uni.navigateBack()
-			},
-			handleCall() {
-				console.log('呼叫')
-			},
-			handleReCall() {
-				console.log('重呼')
-			},
-			handleTransfer() {
-				console.log('转移')
-			},
-			handleOver() {
-				console.log('过号')
-			},
-			handleHang() {
-				console.log('挂起')
-			}
-		}
-	}
-</script>
-
-<style scoped>
-	* {
-		box-sizing: border-box;
-	}
-
-	.wrap {
-		width: 100%;
-		height: 100%;
-		display: flex;
-		flex-direction: column;
-		overflow: hidden;
-		background: url('../../static/images/home/bg.png');
-		background-size: 100% 100%;
-	}
-
-	/* 顶部头部 */
-	.header-bar {
-		width: 100%;
-		/* height: 180px; */
-		background-color: rgba(19, 114, 255, 1);
-		display: flex;
-		justify-content: space-between;
-		align-items: center;
-		padding: 21px 40px 14px;
-		box-sizing: border-box;
-	}
-
-	.header-left {
-		display: flex;
-		flex-direction: column;
-		justify-content: center;
-	}
-
-	.win-no {
-		font-size: 60px;
-		color: #fff;
-		font-weight: bold;
-	}
-
-	.user-dept {
-		display: flex;
-		margin-top: 12px;
-	}
-
-	.user-dept text {
-		font-size: 40px;
-		color: #fff;
-		margin-right: 50px;
-	}
-
-	.exit-btn {
-		background: #fff;
-		border-radius: 50px;
-		display: flex;
-		align-items: center;
-		padding: 15px 25px;
-	}
-
-	.icon-exit {
-		width: 50px;
-		height: 50px;
-		margin-right: 20px;
-	}
-
-	.exit-btn text {
-		font-size: 40px;
-	}
-
-	/* 中间内容 */
-	.content-box {
-		flex: 1;
-		display: flex;
-	}
-
-	.item-col {
-		flex: 1;
-		display: flex;
-		flex-direction: column;
-		align-items: center;
-		justify-content: center;
-	}
-
-	.col-title {
-		font-size: 60px;
-		color: rgba(51, 51, 51, 1);
-		margin-bottom: 30px;
-	}
-
-	.call-no {
-		font-size: 220px;
-		color: rgba(19, 114, 255, 1);
-		font-weight: bold;
-	}
-
-	.wait-num {
-		font-size: 220px;
-		color: #ff5522;
-		font-weight: bold;
-	}
-
-	/* 底部按钮 */
-	.btn-group {
-		display: flex;
-		padding: 0 40px 60px;
-		gap: 32px;
-	}
-
-	.btn-item {
-		flex: 1;
-		height: 240px;
-		border-radius: 32px;
-		display: flex;
-		flex-direction: column;
-		align-items: center;
-		justify-content: center;
-	}
-
-	.btn-icon {
-		width: 70px;
-		height: 70px;
-		margin-bottom: 18px;
-	}
-
-	.btn-item text {
-		font-size: 58px;
-		color: #fff;
-	}
-
-	.green {
-		background-color: #28c958;
-	}
-
-	.blue {
-		background-color: #1976f2;
-	}
-
-	.sky {
-		background-color: #18a0f0;
-	}
-
-	.orange {
-		background-color: #ff9922;
-	}
-
-	.red {
-		background-color: #ff6633;
-	}
-</style>
\ No newline at end of file