index.html 25 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367368369370371372373374375376377378379380381382383384385386387388389390391392393394395396397398399400401402403404405406407408409410411412413414415416417418419420421422423424425426427428429430431432433434435436437438439440441442443444445446447448449450451452453454455456457458459460461462463464465466467468469470471472473474475476477
  1. <!DOCTYPE html>
  2. <html lang="zh-CN">
  3. <head>
  4. <meta charset="UTF-8">
  5. <meta name="viewport" content="width=device-width, initial-scale=1.0">
  6. <title>叁强鲜配 - 小程序端原型图</title>
  7. <link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/vant@3/lib/index.css" />
  8. <style>
  9. * { margin: 0; padding: 0; box-sizing: border-box; }
  10. body { font-family: -apple-system, BlinkMacSystemFont, 'PingFang SC', 'Helvetica Neue', Arial, sans-serif; background: #f5f5f5; color: #333; }
  11. /* 手机容器 */
  12. .phone-container { max-width: 414px; margin: 20px auto; background: #fff; border-radius: 40px; overflow: hidden; box-shadow: 0 10px 40px rgba(0,0,0,0.15); position: relative; }
  13. .phone-header { height: 44px; background: #fff; display: flex; align-items: center; justify-content: center; position: relative; border-bottom: 1px solid #eee; }
  14. .phone-title { font-size: 16px; font-weight: 500; }
  15. /* 状态栏模拟 */
  16. .status-bar { height: 44px; background: #fff; display: flex; align-items: center; justify-content: space-between; padding: 0 16px; font-size: 12px; color: #666; }
  17. .status-time { font-weight: 500; }
  18. /* 登录页 */
  19. .login-page { height: 100vh; background: linear-gradient(135deg, #1989fa 0%, #07c160 100%); display: flex; flex-direction: column; justify-content: center; padding: 40px; }
  20. .login-logo { text-align: center; margin-bottom: 60px; }
  21. .login-logo h1 { font-size: 36px; color: #fff; font-weight: bold; margin-bottom: 8px; }
  22. .login-logo p { font-size: 14px; color: rgba(255,255,255,0.8); }
  23. .login-form { background: #fff; border-radius: 24px; padding: 40px 24px; }
  24. .login-input { width: 100%; height: 48px; background: #f5f5f5; border-radius: 12px; padding: 0 16px; font-size: 15px; margin-bottom: 16px; border: none; outline: none; }
  25. .login-btn { width: 100%; height: 48px; background: #1989fa; color: #fff; border: none; border-radius: 24px; font-size: 16px; font-weight: 500; cursor: pointer; }
  26. .login-btn:active { opacity: 0.8; }
  27. /* 首页通用 */
  28. .page-header { padding: 24px 20px; color: #fff; }
  29. .page-header h2 { font-size: 24px; font-weight: 600; margin-bottom: 8px; }
  30. .page-header p { font-size: 14px; opacity: 0.9; }
  31. /* 功能卡片 */
  32. .menu-grid { display: flex; flex-wrap: wrap; padding: 0 10px; }
  33. .menu-card { width: 44%; background: #fff; border-radius: 16px; padding: 24px 16px; margin: 1%; display: flex; flex-direction: column; align-items: center; box-shadow: 0 2px 12px rgba(0,0,0,0.05); }
  34. .menu-icon { font-size: 40px; margin-bottom: 12px; }
  35. .menu-text { font-size: 14px; color: #333; }
  36. /* 通用列表 */
  37. .list-container { background: #fff; margin: 12px; border-radius: 12px; overflow: hidden; }
  38. .list-item { display: flex; align-items: center; padding: 16px 20px; border-bottom: 1px solid #f5f5f5; }
  39. .list-item:last-child { border-bottom: none; }
  40. .list-item:active { background: #fafafa; }
  41. .list-icon { font-size: 24px; margin-right: 16px; }
  42. .list-content { flex: 1; }
  43. .list-title { font-size: 15px; color: #333; }
  44. .list-desc { font-size: 13px; color: #999; margin-top: 4px; }
  45. .list-arrow { color: #ccc; font-size: 14px; }
  46. /* 状态标签 */
  47. .status-tag { padding: 4px 10px; border-radius: 4px; font-size: 12px; }
  48. .status-tag.primary { background: #e6f7ff; color: #1989fa; }
  49. .status-tag.success { background: #f6ffed; color: #07c160; }
  50. .status-tag.warning { background: #fff7e6; color: #ff976a; }
  51. .status-tag.danger { background: #fff1f0; color: #ee0a24; }
  52. .status-tag.info { background: #f5f5f5; color: #999; }
  53. /* 底部Tab */
  54. .tab-bar { position: fixed; bottom: 0; left: 0; right: 0; height: 50px; background: #fff; display: flex; border-top: 1px solid #eee; }
  55. .tab-item { flex: 1; display: flex; flex-direction: column; align-items: center; justify-content: center; font-size: 10px; color: #999; }
  56. .tab-item.active { color: #1989fa; }
  57. .tab-icon { font-size: 20px; margin-bottom: 2px; }
  58. /* 订单卡片 */
  59. .order-card { background: #fff; margin: 12px; border-radius: 12px; padding: 16px; }
  60. .order-header { display: flex; justify-content: space-between; align-items: center; margin-bottom: 12px; }
  61. .order-no { font-size: 13px; color: #999; }
  62. .order-status { font-size: 13px; }
  63. .order-shop { font-size: 15px; font-weight: 500; margin-bottom: 8px; }
  64. .order-items { font-size: 13px; color: #666; margin-bottom: 12px; }
  65. .order-footer { display: flex; justify-content: space-between; align-items: center; padding-top: 12px; border-top: 1px solid #f5f5f5; }
  66. .order-amount { font-size: 18px; font-weight: 600; color: #ee0a24; }
  67. .order-actions { display: flex; gap: 8px; }
  68. .action-btn { padding: 6px 16px; border-radius: 16px; font-size: 13px; border: 1px solid #1989fa; color: #1989fa; background: #fff; }
  69. .action-btn.primary { background: #1989fa; color: #fff; }
  70. /* 价格卡片 */
  71. .price-card { background: #fff; margin: 12px; border-radius: 12px; padding: 16px; }
  72. .price-header { display: flex; justify-content: space-between; align-items: center; margin-bottom: 16px; }
  73. .price-version { font-size: 14px; color: #999; }
  74. .price-list { display: flex; flex-direction: column; gap: 12px; }
  75. .price-item { display: flex; justify-content: space-between; align-items: center; padding: 12px; background: #f9f9f9; border-radius: 8px; }
  76. .price-name { font-size: 14px; }
  77. .price-value { font-size: 16px; font-weight: 600; color: #07c160; }
  78. /* 任务卡片 */
  79. .task-card { background: #fff; margin: 12px; border-radius: 12px; padding: 16px; }
  80. .task-header { display: flex; justify-content: space-between; align-items: center; margin-bottom: 12px; }
  81. .task-no { font-size: 14px; font-weight: 500; }
  82. .task-info { display: flex; flex-direction: column; gap: 8px; margin-bottom: 16px; }
  83. .task-row { display: flex; align-items: center; font-size: 14px; color: #666; }
  84. .task-row .icon { margin-right: 8px; }
  85. /* 表单 */
  86. .form-container { background: #fff; margin: 12px; border-radius: 12px; padding: 20px; }
  87. .form-item { margin-bottom: 16px; }
  88. .form-label { font-size: 14px; color: #666; margin-bottom: 8px; display: block; }
  89. .form-input { width: 100%; height: 44px; background: #f5f5f5; border-radius: 8px; padding: 0 16px; font-size: 14px; border: none; }
  90. /* 退出按钮 */
  91. .logout-btn { position: fixed; bottom: 80px; left: 50%; transform: translateX(-50%); width: 200px; height: 44px; background: #fff; color: #666; border: none; border-radius: 22px; font-size: 15px; box-shadow: 0 4px 12px rgba(0,0,0,0.1); }
  92. /* 页面切换 */
  93. .page { display: none; min-height: 100vh; padding-bottom: 60px; }
  94. .page.active { display: block; }
  95. /* 原型导航 */
  96. .prototype-nav { position: fixed; top: 20px; right: 20px; background: #fff; border-radius: 12px; padding: 16px; box-shadow: 0 4px 16px rgba(0,0,0,0.1); z-index: 100; max-height: 80vh; overflow-y: auto; }
  97. .prototype-nav h4 { font-size: 13px; color: #999; margin-bottom: 12px; }
  98. .prototype-nav a { display: block; padding: 8px 12px; color: #333; text-decoration: none; font-size: 13px; border-radius: 6px; margin-bottom: 4px; }
  99. .prototype-nav a:hover, .prototype-nav a.active { background: #e6f7ff; color: #1989fa; }
  100. .prototype-nav .role-label { font-size: 12px; color: #1989fa; font-weight: 500; margin-top: 8px; }
  101. </style>
  102. </head>
  103. <body>
  104. <!-- 原型导航 -->
  105. <div class="prototype-nav">
  106. <h4>切换页面</h4>
  107. <div class="role-label">【小程序端】</div>
  108. <a href="#" onclick="showPage('login')" class="active">登录页</a>
  109. <a href="#" onclick="showPage('supplier-home')">供应商-首页</a>
  110. <a href="#" onclick="showPage('supplier-inquiry')">供应商-询价单</a>
  111. <a href="#" onclick="showPage('supplier-quotation')">供应商-我的报价</a>
  112. <a href="#" onclick="showPage('client-home')">客户-首页</a>
  113. <a href="#" onclick="showPage('client-price')">客户-商品列表</a>
  114. <a href="#" onclick="showPage('client-order')">客户-我的订单</a>
  115. <a href="#" onclick="showPage('deliver-home')">配送员-首页</a>
  116. <a href="#" onclick="showPage('deliver-task')">配送员-配送任务</a>
  117. </div>
  118. <!-- 手机容器 -->
  119. <div class="phone-container" style="height: auto; min-height: 800px;">
  120. <!-- 登录页 -->
  121. <div id="login" class="page active">
  122. <div class="login-page" style="border-radius: 40px;">
  123. <div class="login-logo">
  124. <h1>叁强鲜配</h1>
  125. <p>新鲜配送每一天</p>
  126. </div>
  127. <div class="login-form">
  128. <input type="text" class="login-input" placeholder="请输入用户名" />
  129. <input type="password" class="login-input" placeholder="请输入密码" />
  130. <button class="login-btn" onclick="showPage('supplier-home')">登 录</button>
  131. </div>
  132. </div>
  133. </div>
  134. <!-- 供应商-首页 -->
  135. <div id="supplier-home" class="page">
  136. <div class="page-header" style="background: linear-gradient(135deg, #ff976a 0%, #ff4444 100%);">
  137. <h2>供应商中心</h2>
  138. <p>欢迎,张伟(城东区域)</p>
  139. </div>
  140. <div class="menu-grid">
  141. <div class="menu-card" onclick="showPage('supplier-inquiry')">
  142. <span class="menu-icon">📋</span>
  143. <span class="menu-text">询价单</span>
  144. </div>
  145. <div class="menu-card" onclick="showPage('supplier-quotation')">
  146. <span class="menu-icon">💰</span>
  147. <span class="menu-text">我的报价</span>
  148. </div>
  149. <div class="menu-card">
  150. <span class="menu-icon">🚚</span>
  151. <span class="menu-text">取货任务</span>
  152. </div>
  153. <div class="menu-card">
  154. <span class="menu-icon">📦</span>
  155. <span class="menu-text">基本信息</span>
  156. </div>
  157. </div>
  158. <div class="list-container">
  159. <div class="list-item">
  160. <span class="list-icon">🔔</span>
  161. <div class="list-content">
  162. <div class="list-title">待报价询价单</div>
  163. <div class="list-desc">您有 2 个询价单待报价</div>
  164. </div>
  165. <span class="list-arrow">›</span>
  166. </div>
  167. <div class="list-item">
  168. <span class="list-icon">📄</span>
  169. <div class="list-content">
  170. <div class="list-title">待取货任务</div>
  171. <div class="list-desc">您有 3 个待取货任务</div>
  172. </div>
  173. <span class="list-arrow">›</span>
  174. </div>
  175. </div>
  176. <button class="logout-btn" onclick="showPage('login')">退出登录</button>
  177. </div>
  178. <!-- 供应商-询价单 -->
  179. <div id="supplier-inquiry" class="page">
  180. <div class="page-header" style="background: linear-gradient(135deg, #ff976a 0%, #ff4444 100%);">
  181. <h2>询价单列表</h2>
  182. </div>
  183. <div class="list-container">
  184. <div class="list-item">
  185. <div class="list-content">
  186. <div class="list-title">2026年3月第3周询价单</div>
  187. <div class="list-desc">城东区域 | 发布于 2026-03-17</div>
  188. </div>
  189. <span class="status-tag warning">待报价</span>
  190. </div>
  191. <div class="list-item">
  192. <div class="list-content">
  193. <div class="list-title">2026年3月第2周询价单</div>
  194. <div class="list-desc">城东区域 | 发布于 2026-03-10</div>
  195. </div>
  196. <span class="status-tag success">已报价</span>
  197. </div>
  198. <div class="list-item">
  199. <div class="list-content">
  200. <div class="list-title">2026年3月第1周询价单</div>
  201. <div class="list-desc">城东区域 | 发布于 2026-03-03</div>
  202. </div>
  203. <span class="status-tag success">已报价</span>
  204. </div>
  205. </div>
  206. <button class="logout-btn" onclick="showPage('login')">退出登录</button>
  207. </div>
  208. <!-- 供应商-我的报价 -->
  209. <div id="supplier-quotation" class="page">
  210. <div class="page-header" style="background: linear-gradient(135deg, #ff976a 0%, #ff4444 100%);">
  211. <h2>我的报价</h2>
  212. </div>
  213. <div class="list-container">
  214. <div class="list-item">
  215. <div class="list-content">
  216. <div class="list-title">2026年3月第2周询价单</div>
  217. <div class="list-desc">提交时间:2026-03-12 14:30</div>
  218. </div>
  219. <span class="status-tag success">已通过</span>
  220. </div>
  221. <div class="list-item">
  222. <div class="list-content">
  223. <div class="list-title">2026年3月第1周询价单</div>
  224. <div class="list-desc">提交时间:2022026-03-05 10:20</div>
  225. </div>
  226. <span class="status-tag success">已通过</span>
  227. </div>
  228. </div>
  229. <button class="logout-btn" onclick="showPage('login')">退出登录</button>
  230. </div>
  231. <!-- 客户-首页 -->
  232. <div id="client-home" class="page">
  233. <div class="page-header" style="background: linear-gradient(135deg, #07c160 0%, #1989fa 100%);">
  234. <h2>客户中心</h2>
  235. <p>欢迎,李娜(城东区域)</p>
  236. </div>
  237. <div class="price-card" style="margin-top: -30px;">
  238. <div class="price-header">
  239. <span style="font-size:16px;font-weight:600;">今日价格清单</span>
  240. <span class="status-tag success">最新</span>
  241. </div>
  242. <p style="font-size:13px;color:#999;margin-bottom:16px;">版本号:V3 | 生效时间:2026-03-19</p>
  243. <div style="display:flex;justify-content:space-between;align-items:center;padding:12px;background:#f6ffed;border-radius:8px;">
  244. <span style="font-size:14px;">查看商品详情</span>
  245. <span style="color:#07c160;">›</span>
  246. </div>
  247. </div>
  248. <div class="menu-grid">
  249. <div class="menu-card" onclick="showPage('client-price')">
  250. <span class="menu-icon">📦</span>
  251. <span class="menu-text">商品列表</span>
  252. </div>
  253. <div class="menu-card">
  254. <span class="menu-icon">🛒</span>
  255. <span class="menu-text">购物车</span>
  256. </div>
  257. <div class="menu-card" onclick="showPage('client-order')">
  258. <span class="menu-icon">📄</span>
  259. <span class="menu-text">我的订单</span>
  260. </div>
  261. <div class="menu-card">
  262. <span class="menu-icon">👤</span>
  263. <span class="menu-text">个人信息</span>
  264. </div>
  265. </div>
  266. <button class="logout-btn" onclick="showPage('login')">退出登录</button>
  267. </div>
  268. <!-- 客户-商品列表 -->
  269. <div id="client-price" class="page">
  270. <div class="page-header" style="background: linear-gradient(135deg, #07c160 0%, #1989fa 100%);">
  271. <h2>商品列表</h2>
  272. <p>当前价格版本:V3</p>
  273. </div>
  274. <div class="price-card">
  275. <div class="price-list">
  276. <div class="price-item">
  277. <span class="price-name">新鲜猪肉</span>
  278. <span class="price-value">¥25.00/斤</span>
  279. </div>
  280. <div class="price-item">
  281. <span class="price-name">新鲜蔬菜</span>
  282. <span class="price-value">¥8.00/斤</span>
  283. </div>
  284. <div class="price-item">
  285. <span class="price-name">新鲜水果</span>
  286. <span class="price-value">¥12.00/斤</span>
  287. </div>
  288. <div class="price-item">
  289. <span class="price-name">鸡蛋</span>
  290. <span class="price-value">¥6.00/个</span>
  291. </div>
  292. <div class="price-item">
  293. <span class="price-name">大米</span>
  294. <span class="price-value">¥3.00/斤</span>
  295. </div>
  296. </div>
  297. </div>
  298. <div style="padding:20px;text-align:center;">
  299. <button class="action-btn primary" style="width:100%;height:44px;border-radius:22px;">加入购物车</button>
  300. </div>
  301. <button class="logout-btn" onclick="showPage('login')">退出登录</button>
  302. </div>
  303. <!-- 客户-我的订单 -->
  304. <div id="client-order" class="page">
  305. <div class="page-header" style="background: linear-gradient(135deg, #07c160 0%, #1989fa 100%);">
  306. <h2>我的订单</h2>
  307. </div>
  308. <div class="order-card">
  309. <div class="order-header">
  310. <span class="order-no">ORD202603190001</span>
  311. <span class="status-tag warning">待支付</span>
  312. </div>
  313. <div class="order-shop">XX餐厅</div>
  314. <div class="order-items">新鲜猪肉 x10斤、新鲜蔬菜 x20斤...</div>
  315. <div class="order-footer">
  316. <span class="order-amount">¥710.00</span>
  317. <div class="order-actions">
  318. <button class="action-btn">取消</button>
  319. <button class="action-btn primary">去支付</button>
  320. </div>
  321. </div>
  322. </div>
  323. <div class="order-card">
  324. <div class="order-header">
  325. <span class="order-no">ORD202603180056</span>
  326. <span class="status-tag primary">待确认收货</span>
  327. </div>
  328. <div class="order-shop">XX餐厅</div>
  329. <div class="order-items">新鲜猪肉 x10斤、新鲜蔬菜 x20斤...</div>
  330. <div class="order-footer">
  331. <span class="order-amount">¥710.00</span>
  332. <div class="order-actions">
  333. <button class="action-btn primary">确认收货</button>
  334. </div>
  335. </div>
  336. </div>
  337. <div class="order-card">
  338. <div class="order-header">
  339. <span class="order-no">ORD202603150023</span>
  340. <span class="status-tag success">已完成</span>
  341. </div>
  342. <div class="order-shop">XX餐厅</div>
  343. <div class="order-items">新鲜猪肉 x10斤、新鲜蔬菜 x20斤...</div>
  344. <div class="order-footer">
  345. <span class="order-amount">¥560.00</span>
  346. <div class="order-actions">
  347. <button class="action-btn">再次购买</button>
  348. </div>
  349. </div>
  350. </div>
  351. <button class="logout-btn" onclick="showPage('login')">退出登录</button>
  352. </div>
  353. <!-- 配送员-首页 -->
  354. <div id="deliver-home" class="page">
  355. <div class="page-header" style="background: linear-gradient(135deg, #ee0a24 0%, #ff976a 100%);">
  356. <h2>配送员中心</h2>
  357. <p>欢迎,王强(城东区域)</p>
  358. </div>
  359. <div class="task-card" style="margin-top: -30px;">
  360. <div style="display:flex;justify-content:space-around;text-align:center;">
  361. <div>
  362. <div style="font-size:28px;font-weight:600;color:#1989fa;">3</div>
  363. <div style="font-size:13px;color:#999;margin-top:4px;">待取货</div>
  364. </div>
  365. <div>
  366. <div style="font-size:28px;font-weight:600;color:#ff976a;">5</div>
  367. <div style="font-size:13px;color:#999;margin-top:4px;">配送中</div>
  368. </div>
  369. <div>
  370. <div style="font-size:28px;font-weight:600;color:#07c160;">28</div>
  371. <div style="font-size:13px;color:#999;margin-top:4px;">已完成</div>
  372. </div>
  373. </div>
  374. </div>
  375. <div class="menu-grid">
  376. <div class="menu-card" onclick="showPage('deliver-task')">
  377. <span class="menu-icon">📋</span>
  378. <span class="menu-text">待取货</span>
  379. </div>
  380. <div class="menu-card">
  381. <span class="menu-icon">🚚</span>
  382. <span class="menu-text">配送中</span>
  383. </div>
  384. <div class="menu-card">
  385. <span class="menu-icon">📄</span>
  386. <span class="menu-text">历史任务</span>
  387. </div>
  388. <div class="menu-card">
  389. <span class="menu-icon">👤</span>
  390. <span class="menu-text">个人信息</span>
  391. </div>
  392. </div>
  393. <button class="logout-btn" onclick="showPage('login')">退出登录</button>
  394. </div>
  395. <!-- 配送员-配送任务 -->
  396. <div id="deliver-task" class="page">
  397. <div class="page-header" style="background: linear-gradient(135deg, #ee0a24 0%, #ff976a 100%);">
  398. <h2>待取货任务</h2>
  399. </div>
  400. <div class="task-card">
  401. <div class="task-header">
  402. <span class="task-no">DLV20260319001</span>
  403. <span class="status-tag warning">待取货</span>
  404. </div>
  405. <div class="task-info">
  406. <div class="task-row">
  407. <span class="icon">🏪</span>
  408. <span>供应商:XX供应商</span>
  409. </div>
  410. <div class="task-row">
  411. <span class="icon">📍</span>
  412. <span>取货地址:城东区XX路XX号</span>
  413. </div>
  414. <div class="task-row">
  415. <span class="icon">🏠</span>
  416. <span>送货地址:城东区YY路YY号</span>
  417. </div>
  418. <div class="task-row">
  419. <span class="icon">👤</span>
  420. <span>客户:XX餐厅 | 13800138001</span>
  421. </div>
  422. </div>
  423. <div style="display:flex;gap:12px;">
  424. <button class="action-btn" style="flex:1;">查看详情</button>
  425. <button class="action-btn primary" style="flex:1;">确认取货</button>
  426. </div>
  427. </div>
  428. <div class="task-card">
  429. <div class="task-header">
  430. <span class="task-no">DLV20260319002</span>
  431. <span class="status-tag warning">待取货</span>
  432. </div>
  433. <div class="task-info">
  434. <div class="task-row">
  435. <span class="icon">🏪</span>
  436. <span>供应商:YY供应商</span>
  437. </div>
  438. <div class="task-row">
  439. <span class="icon">📍</span>
  440. <span>取货地址:城西区XX路XX号</span>
  441. </div>
  442. <div class="task-row">
  443. <span class="icon">🏠</span>
  444. <span>送货地址:城西区YY路YY号</span>
  445. </div>
  446. </div>
  447. <div style="display:flex;gap:12px;">
  448. <button class="action-btn" style="flex:1;">查看详情</button>
  449. <button class="action-btn primary" style="flex:1;">确认取货</button>
  450. </div>
  451. </div>
  452. <button class="logout-btn" onclick="showPage('login')">退出登录</button>
  453. </div>
  454. </div>
  455. <script>
  456. function showPage(pageId) {
  457. document.querySelectorAll('.page').forEach(p => p.classList.remove('active'));
  458. document.getElementById(pageId).classList.add('active');
  459. document.querySelectorAll('.prototype-nav a').forEach(a => a.classList.remove('active'));
  460. event.target.classList.add('active');
  461. }
  462. </script>
  463. </body>
  464. </html>