From 03e7f91fc254aa81b8ec6d17ee82f95d84b24519 Mon Sep 17 00:00:00 2001
From: xuhuajiao <13476289682@163.com>
Date: Thu, 14 May 2026 11:38:08 +0800
Subject: [PATCH] =?UTF-8?q?=E5=9C=A8=E7=BA=BF=E5=8A=9E=E8=AF=81/=E9=A6=96?=
 =?UTF-8?q?=E9=A1=B5=E4=BA=8C=E7=BB=B4=E7=A0=81?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 pages/home/home.vue                      |  97 +++++++-
 pages/login/login.vue                    |  10 +-
 pages/register/register.vue              | 289 +++++++++++------------
 static/iconfont.css                      |   8 +
 static/iconfont.ttf                      | Bin 18184 -> 19088 bytes
 styles/global.scss                       |  33 ++-
 subpkg/pages/reader-card/reader-card.vue |  12 +-
 7 files changed, 278 insertions(+), 171 deletions(-)

diff --git a/pages/home/home.vue b/pages/home/home.vue
index 1d12b55..2079ee2 100644
--- a/pages/home/home.vue
+++ b/pages/home/home.vue
@@ -1,12 +1,13 @@
 <template>
 	<view style="padding-bottom: 20px;">
 		<view class="top-bar">
+      <uni-icons class="erweima-top" custom-prefix="iconfont" type="icon-erweima" size="22" color="#fff" @click="showTopImgPopup"></uni-icons>
 		  <image class="top-bar-bg" src="@/static/images/mingqi-beij@2x.png" mode="aspectFill"></image>
 		  <view class="library-info">
         <image class="avatar" src="@/static/images/logo.jpg" mode="aspectFill"></image>
         <view class="library-name">葛店经济技术开发区图书馆</view>
       </view>
-      <uni-icons class="search-icon" type="search" size="30" @click="onToSearch"></uni-icons>
+      <uni-icons class="search-icon" type="search" size="24" @click="onToSearch"></uni-icons>
 		</view>
 
     <view class="status-cards">
@@ -99,7 +100,7 @@
           </view>
            <view class="menu-item" @click="goRegister">
             <view class="menu-icon">
-              <uni-icons custom-prefix="iconfont" type="icon-yonghuxinxi-gerenxinxi" size="20"></uni-icons>
+              <uni-icons custom-prefix="iconfont" type="icon-a-28-banzhengjian" size="25"></uni-icons>
             </view>
             <view class="menu-label">在线办证</view>
           </view>
@@ -147,8 +148,7 @@
         ref="popup"
         type="center"
         :mask-click="true"
-        @maskClick="closePopup"
-        :custom-style="popupFixedStyle"
+        @maskClick="closeAllPopup"
       >
         <view class="qrcode-popup">
           <view class="qrcode-title">读者证二维码</view>
@@ -159,8 +159,28 @@
             foreground="#333"
             background="#ffffff"
           />
-          <view class="qrcode-num">{{ qrcodeText }}</view>
-          <view class="close-btn" @click="closePopup">关闭</view>
+          <view class="qrcode-num" v-if="qrcodeText">{{ qrcodeText }}</view>
+          <!-- <view class="close-btn" @click="closeAllPopup" style="margin-top:15px;">关闭</view> -->
+        </view>
+      </uni-popup>
+
+      <uni-popup
+        ref="erweimapopup"
+        type="center"
+        :mask-click="true"
+        @maskClick="closeErweiPopup"
+        :custom-style="popupFixedStyle"
+      >
+        <view class="qrcode-popup" style="width: auto !important;">
+          <image 
+            v-if="wecharQRCode" 
+            :src="wecharQRCode" 
+            style="width:200px;height:200px;" 
+            mode="aspectFit"
+            :show-menu-by-longpress="true"
+            @longpress="onQRCodeLongPress"
+          ></image>
+          <!-- <view class="qrcode-tip">长按二维码可识别</view> -->
         </view>
       </uni-popup>
     </root-portal>
@@ -196,7 +216,7 @@
 </template>
 
 <script>
-import { FetchOpenId, FetchFindAllReaderBindByOpenId} from '@/api/user';
+import { FetchInitScreenSetting, FetchOpenId, FetchFindAllReaderBindByOpenId} from '@/api/user';
 import { FetchInitScreenBookRecommend } from '@/api/book';
 import config from '@/utils/config';
 import { STORAGE_KEYS } from '@/utils/storage';
@@ -212,16 +232,42 @@ export default {
       readerCardList: [], // 多个借阅证
       baseUrl: config.baseUrl,
       qrcodeText: '', // 二维码内容
-      popupFixedStyle: 'position:fixed;top:0;left:0;right:0;bottom:0;' 
+      popupFixedStyle: 'position:fixed;top:0;left:0;right:0;bottom:0;',
+      wecharQRCode: null
 		};
 	},
   onLoad() {
     this.getRecommendBooks();
+    this.getScreenSetting()
   },
   onShow() {
     this.initUserAndCheckBind();
   },
   methods:{
+    async getScreenSetting() {
+      const res = await FetchInitScreenSetting({ libcode: config.LIB_CODE });
+
+      if (res.data.wechar_qr_code && res.data.wechar_qr_code.context) {
+        const imageUrl = this.baseUrl + '/api/fileRelevant/getImg?imgType=1&imgId=' + res.data.wechar_qr_code.context;
+        try {
+          const base64 = await this.urlToBase64(imageUrl);
+          this.wecharQRCode = base64;
+        } catch (err) {
+          this.wecharQRCode = null;
+        }
+      } else {
+        this.wecharQRCode = null;
+      }
+    },
+    // 显示顶部微信二维码弹窗
+    showTopImgPopup() {
+      if (!this.wecharQRCode) {
+        uni.showToast({ title: '暂无图片', icon: 'none' })
+        return
+      }
+      this.$refs.erweimapopup.open()
+    },
+
     // 格式化读者证号
     formatCardNo(cardNo) {
       if (!cardNo) return '';
@@ -448,10 +494,23 @@ export default {
       this.qrcodeText = bindValue;
       this.$refs.popup.open();
     },
-    closePopup() {
+    closeAllPopup() {
       this.qrcodeText = '';
       this.$refs.popup.close();
     },
+    closeErweiPopup() {
+      this.$refs.erweimapopup.close()
+    },
+    /**
+     * 二维码长按事件
+     */
+    onQRCodeLongPress() {
+      // uni.showToast({
+      //   title: '长按识别二维码',
+      //   icon: 'none',
+      //   duration: 1500
+      // });
+    },
     urlToBase64(url) {
       return new Promise((resolve, reject) => {
         uni.request({
@@ -487,6 +546,12 @@ export default {
 
 <style lang="scss" scoped>
 .top-bar{
+  .erweima-top{
+    position: absolute;
+    left: 16px;
+    top: 15px;
+    z-index: 999;
+  }
   .search-icon{
     position: absolute;
     right: 16px;
@@ -734,4 +799,18 @@ swiper.menu-swiper{
     color: #999 !important;
   }
 }
+
+// .qrcode-popup {
+//   padding: 20px;
+//   border-radius: 12px;
+//   background: #fff;
+  
+//   .qrcode-tip {
+//     text-align: center;
+//     font-size: 12px;
+//     color: #999;
+//     margin-top: 10px;
+//   }
+// }
+
 </style>
\ No newline at end of file
diff --git a/pages/login/login.vue b/pages/login/login.vue
index 291f54d..f7df942 100644
--- a/pages/login/login.vue
+++ b/pages/login/login.vue
@@ -31,7 +31,7 @@
       <view class="item">
         <uni-icons class="form-icon" type="locked" size="24"></uni-icons>
         <input class="input" placeholder="请输入密码" :password="!showPwd" v-model="rdpasswd" />
-        <uni-icons class="form-right-icon" :type="showPwd ? 'eye-slash' : 'eye'" size="20"
+        <uni-icons class="form-right-icon" :type="showPwd ? 'eye' : 'eye-slash'" size="20"
           @click="togglePwd"></uni-icons>
       </view>
       
@@ -362,12 +362,4 @@ export default {
     margin-right: 10px;
   }
 }
-
-.register-btn {
-  position: fixed;
-  bottom: 40px;
-  left: 50%;
-  transform: translateX(-50%);
-  width: calc(100% - 40px);
-}
 </style>
\ No newline at end of file
diff --git a/pages/register/register.vue b/pages/register/register.vue
index 06642a9..190ca7d 100644
--- a/pages/register/register.vue
+++ b/pages/register/register.vue
@@ -1,21 +1,23 @@
 <template>
-  <view style="background-color: #fff; height: calc(100vh);">
+  <view class="page-container">
+    <!-- 顶部背景 + 标题 -->
     <view class="top-bar">
       <image class="top-bar-bg" src="@/static/images/mingqi-beij@2x.png" mode="aspectFill"></image>
       <view class="library-info">
         <image class="avatar" src="@/static/images/logo.jpg" mode="aspectFill"></image>
         <view class="library-name">葛店经济技术开发区图书馆</view>
+        <view class="sub-title">读者证办理</view>
       </view>
     </view>
 
-    <!-- 表单区域 -->
-    <view class="form-box">
+    <!-- 表单卡片 -->
+    <view class="form-card">
       <!-- 姓名 -->
       <view class="form-item">
         <uni-icons class="form-icon" custom-prefix="iconfont" type="icon-user" size="24"></uni-icons>
         <input 
           class="input" 
-          placeholder="请输入姓名" 
+          placeholder="请输入真实姓名" 
           v-model="formData.name"
           maxlength="20"
         />
@@ -26,7 +28,7 @@
         <uni-icons class="form-icon" custom-prefix="iconfont" type="icon-shenfen" size="24"></uni-icons>
         <input 
           class="input" 
-          placeholder="请输入身份证号" 
+          placeholder="请输入18位身份证号" 
           v-model="formData.idCard"
           maxlength="18"
         />
@@ -43,7 +45,7 @@
           maxlength="11"
         />
         <button class="get-phone-btn" open-type="getPhoneNumber" @getphonenumber="getPhoneNumber">
-          获取手机号
+          一键获取
         </button>
       </view>
 
@@ -52,14 +54,14 @@
         <uni-icons class="form-icon" type="locked" size="24"></uni-icons>
         <input 
           class="input" 
-          placeholder="请输入密码" 
+          placeholder="请设置6-20位密码" 
           :password="!showPwd" 
           v-model="formData.password"
           maxlength="20"
         />
         <uni-icons 
           class="pwd-icon" 
-          :type="showPwd ? 'eye-slash' : 'eye'" 
+          :type="showPwd ? 'eye' : 'eye-slash'" 
           size="20"
           @click="togglePwd"
         ></uni-icons>
@@ -70,14 +72,14 @@
         <uni-icons class="form-icon" type="locked" size="24"></uni-icons>
         <input 
           class="input" 
-          placeholder="请再次输入密码" 
+          placeholder="请再次确认密码" 
           :password="!showConfirmPwd" 
           v-model="formData.confirmPassword"
           maxlength="20"
         />
         <uni-icons 
           class="pwd-icon" 
-          :type="showConfirmPwd ? 'eye-slash' : 'eye'" 
+          :type="showConfirmPwd ? 'eye' : 'eye-slash'" 
           size="20"
           @click="toggleConfirmPwd"
         ></uni-icons>
@@ -85,19 +87,19 @@
 
       <!-- 提交按钮 -->
       <button class="submit-btn" type="primary" @click="submit" :loading="loading">
-        {{ loading ? '提交中...' : '提交办证' }}
+        {{ loading ? '提交中...' : '确认办理' }}
       </button>
     </view>
 
     <!-- 温馨提示 -->
-    <!-- <view class="tips">
-      <text class="tips-title">温馨提示：</text>
-      <view class="tips-content">
-        <text>1、请确保填写的信息真实准确</text>
-        <text>2、密码建议设置为6-20位数字和字母组合</text>
-        <text>3、提交后工作人员将在1-3个工作日内审核</text>
+    <view class="tips-card">
+      <view class="tips-title">温馨提示</view>
+      <view class="tips-text">
+        1. 请填写真实身份信息，用于办理读者证<br>
+        2. 密码请牢记，用于登录和借阅查询<br>
+        <!-- 3. 提交后工作人员将尽快审核 -->
       </view>
-    </view> -->
+    </view>
   </view>
 </template>
 
@@ -121,24 +123,17 @@ export default {
     };
   },
 
-  onLoad() {
-  },
+  onLoad() {},
 
   methods: {
-    /**
-     * 获取手机号（通过后端接口解密）
-     */
     getPhoneNumber(e) {
       if (e.detail.errMsg !== 'getPhoneNumber:ok') {
         uni.showToast({ title: '取消授权', icon: 'none' });
         return;
       }
-      
       // #ifdef MP-WEIXIN
-      // 获取 login code
       uni.login({
         success: (loginRes) => {
-          // 调用后端接口解密手机号
           uni.request({
             url: config.baseUrl + '/api/wx/decryptPhone',
             method: 'POST',
@@ -148,154 +143,143 @@ export default {
               iv: e.detail.iv
             },
             success: (res) => {
-              if (res.data && res.data.code === 200) {
+              if (res.data?.code === 200) {
                 this.formData.phone = res.data.data.phoneNumber || '';
               } else {
-                uni.showToast({
-                  title: res.data?.message || '获取手机号失败',
-                  icon: 'none'
-                });
+                uni.showToast({ title: res.data?.message || '获取失败', icon: 'none' });
               }
             },
-            fail: () => {
-              uni.showToast({
-                title: '获取手机号失败',
-                icon: 'none'
-              });
-            }
+            fail: () => uni.showToast({ title: '获取手机号失败', icon: 'none' })
           });
         },
-        fail: () => {
-          uni.showToast({
-            title: '获取手机号失败',
-            icon: 'none'
-          });
-        }
+        fail: () => uni.showToast({ title: '登录失败', icon: 'none' })
       });
       // #endif
-      
       // #ifndef MP-WEIXIN
-      uni.showToast({ title: '该功能仅支持微信小程序', icon: 'none' });
+      uni.showToast({ title: '仅支持微信小程序', icon: 'none' });
       // #endif
     },
 
-
-    /**
-     * 切换密码显示
-     */
     togglePwd() {
       this.showPwd = !this.showPwd;
     },
-
-    /**
-     * 切换确认密码显示
-     */
     toggleConfirmPwd() {
       this.showConfirmPwd = !this.showConfirmPwd;
     },
 
-    /**
-     * 验证身份证号
-     */
+    // 身份证验证（完整版）
     validateIdCard(idCard) {
       const reg = /^[1-9]\d{5}(18|19|20)\d{2}(0[1-9]|1[0-2])(0[1-9]|[12]\d|3[01])\d{3}[\dXx]$/;
-      return reg.test(idCard);
+      if (!reg.test(idCard)) return false;
+      const year = +idCard.substring(6, 10);
+      const month = +idCard.substring(10, 12);
+      const day = +idCard.substring(12, 14);
+      const date = new Date(year, month - 1, day);
+      if (date.getFullYear() !== year || date.getMonth() !== month - 1 || date.getDate() !== day) return false;
+      const weights = [7,9,10,5,8,4,2,1,6,3,7,9,10,5,8,4,2];
+      const codes = ['1','0','X','9','8','7','6','5','4','3','2'];
+      let sum = 0;
+      for (let i=0;i<17;i++) sum += +idCard[i] * weights[i];
+      return idCard[17].toUpperCase() === codes[sum % 11];
     },
 
-    /**
-     * 验证手机号
-     */
+    // 手机号验证
     validatePhone(phone) {
-      const reg = /^1[3-9]\d{9}$/;
-      return reg.test(phone);
+      return /^1[3-9]\d{9}$/.test(phone);
     },
 
-    /**
-     * 表单验证
-     */
+    // ✅ 【核心修复】表单验证（更严谨）
     validateForm() {
       const { name, idCard, phone, password, confirmPassword } = this.formData;
 
-      if (!name || name.trim().length === 0) {
+      // 1. 姓名：必须非空且trim后有内容
+      if (!name || name.trim() === '') {
         uni.showToast({ title: '请输入姓名', icon: 'none' });
         return false;
       }
 
-      if (!idCard || idCard.trim().length === 0) {
+      // 2. 身份证：非空 + 格式正确
+      if (!idCard || idCard.trim() === '') {
         uni.showToast({ title: '请输入身份证号', icon: 'none' });
         return false;
       }
-
-      if (!this.validateIdCard(idCard)) {
+      if (!this.validateIdCard(idCard.trim())) {
         uni.showToast({ title: '身份证号格式不正确', icon: 'none' });
         return false;
       }
 
-      if (!phone || phone.trim().length === 0) {
+      // 3. 手机号：非空 + 格式正确
+      if (!phone || phone.trim() === '') {
         uni.showToast({ title: '请输入手机号', icon: 'none' });
         return false;
       }
-
-      if (!this.validatePhone(phone)) {
+      if (!this.validatePhone(phone.trim())) {
         uni.showToast({ title: '手机号格式不正确', icon: 'none' });
         return false;
       }
 
+      // 4. 密码：至少6位
       if (!password || password.length < 6) {
-        uni.showToast({ title: '密码至少需要6位', icon: 'none' });
+        uni.showToast({ title: '密码至少6位', icon: 'none' });
         return false;
       }
 
+      // 5. 确认密码：必须一致
       if (password !== confirmPassword) {
-        uni.showToast({ title: '两次输入的密码不一致', icon: 'none' });
+        uni.showToast({ title: '两次密码不一致', icon: 'none' });
         return false;
       }
 
+      // 所有校验通过
       return true;
     },
 
-    /**
-     * 提交表单
-     */
     async submit() {
+      // 防止重复点击
+      if (this.loading) return;
+
+      // 小程序关键：等 input 数据同步到 data
+      await this.$nextTick();
+
+      // 校验不通过直接 return
       if (!this.validateForm()) {
         return;
       }
 
       this.loading = true;
-
       try {
         const openId = await getOpenId();
         if (!openId) {
           uni.showToast({ title: '获取用户信息失败', icon: 'none' });
-          this.loading = false;
           return;
         }
 
-        const res = await uni.request({
-          url: config.baseUrl + '/api/reader/register',
-          method: 'POST',
-          data: {
-            name: this.formData.name,
-            idCard: this.formData.idCard,
-            phone: this.formData.phone,
-            password: this.formData.password,
-            openId: openId,
-            libcode: config.LIB_CODE
-          }
-        });
-
-        if (res.data && res.data.code === 200) {
-          uni.showToast({ title: '提交成功', icon: 'success' });
-          setTimeout(() => {
-            uni.navigateBack();
-          }, 1500);
-        } else {
-          uni.showToast({ title: res.data?.message || '提交失败', icon: 'none' });
-        }
-      } catch (error) {
-        console.error('注册失败:', error);
-        uni.showToast({ title: '提交失败', icon: 'none' });
+        uni.showToast({ title: '后续流程正在研发中~',  icon: 'none' });
+        // setTimeout(() => uni.navigateBack(), 1500);
+
+        // 提交（trim 后再发）
+        // const res = await uni.request({
+        //   url: config.baseUrl + '/api/reader/register',
+        //   method: 'POST',
+        //   data: {
+        //     name: this.formData.name.trim(),
+        //     idCard: this.formData.idCard.trim(),
+        //     phone: this.formData.phone.trim(),
+        //     password: this.formData.password,
+        //     openId,
+        //     libcode: config.LIB_CODE
+        //   }
+        // });
+
+        // if (res.data?.code === 200) {
+        //   uni.showToast({ title: '办理成功', icon: 'success' });
+        //   setTimeout(() => uni.navigateBack(), 1500);
+        // } else {
+        //   uni.showToast({ title: res.data?.message || '提交失败', icon: 'none' });
+        // }
+      } catch (err) {
+        console.error('提交异常', err);
+        uni.showToast({ title: '网络异常，请重试', icon: 'none' });
       } finally {
         this.loading = false;
       }
@@ -305,71 +289,83 @@ export default {
 </script>
 
 <style lang="scss" scoped>
+page {
+  background-color: #f5f7fa;
+}
+.page-container {
+  min-height: 100vh;
+  background-color: #f5f7fa;
+  padding-bottom: 20px;
+}
+
+/* 顶部 */
 .top-bar {
-  position: relative;
-  width: 100%;
-  height: 180px;
-  
-  .top-bar-bg {
-    width: 100%;
-    height: 100%;
-  }
-  
-  .page-title {
-    position: absolute;
-    bottom: 20px;
-    left: 20px;
-    font-size: 28px;
-    font-weight: bold;
+  height: 210px;
+  .library-info {
+    position: relative;
+    z-index: 2;
     color: #fff;
-    text-shadow: 0 2px 4px rgba(0, 0, 0, 0.3);
   }
 }
 
-.form-box {
-  padding: 20px 15px;
+/* 表单卡片 */
+.form-card {
+  margin: -30px 12px 12px;
+  background: #fff;
+  border-radius: 12px;
+  padding: 20px 16px;
+  box-shadow: 0 4px 15px rgba(0,0,0,0.08);
+  position: relative;
+  z-index: 3;
 }
+
 .form-item {
-  position: relative;
   display: flex;
   align-items: center;
   height: 44px;
-  border-bottom: 1px solid #f0f0f0;
-  margin-bottom: 10px;
+  border-bottom: 1rpx solid #f2f3f5;
+  margin-bottom: 4px;
   
   .form-icon {
-    margin-right: 12px;
+    font-size: 14px;
     color: #01a4fe;
+    margin-right: 10px;
   }
   
   .input {
     flex: 1;
-    height: 100%;
     font-size: 14px;
     color: #333;
   }
   
   .pwd-icon {
-    margin-left: 10px;
     color: #999;
+    padding: 5px;
   }
   
   .get-phone-btn {
-    background-color: #01a4fe;
-    color: #fff;
     font-size: 12px;
+    color: #fff;
+    background-color: #01a4fe;
     border-radius: 20px;
+    padding: 6px 10px;
     border: none;
+    line-height: 1.2;
+    
+    &::after {
+      border: none;
+    }
   }
 }
 
+/* 提交按钮 */
 .submit-btn {
   width: 100%;
-  height: 48px;
+  height: 44px;
   background-color: #01a4fe;
   color: #fff;
-  border-radius: 24px;
-  font-size: 16px;
+  border-radius: 22px;
+  font-size: 15px;
   margin-top: 20px;
   border: none;
   
@@ -378,28 +374,25 @@ export default {
   }
 }
 
-.tips {
+/* 温馨提示 */
+.tips-card {
+  margin: 0 12px;
+  background: #fff;
+  border-radius: 10px;
   padding: 15px;
-  background-color: #fff;
-  margin: 0 15px;
-  border-radius: 12px;
-  box-shadow: 0 2px 12px rgba(0, 0, 0, 0.08);
+  box-shadow: 0 2px 10px rgba(0,0,0,0.05);
   
   .tips-title {
-    font-size: 14px;
-    font-weight: bold;
+    font-size: 13px;
     color: #333;
-    display: block;
+    font-weight: 500;
     margin-bottom: 8px;
   }
   
-  .tips-content {
-    text {
-      display: block;
-      font-size: 13px;
-      color: #999;
-      line-height: 1.8;
-    }
+  .tips-text {
+    font-size: 12px;
+    color: #666;
+    line-height: 1.6;
   }
 }
-</style>
+</style>
\ No newline at end of file
diff --git a/static/iconfont.css b/static/iconfont.css
index dcbd00e..24d1aaf 100644
--- a/static/iconfont.css
+++ b/static/iconfont.css
@@ -11,6 +11,14 @@
   -moz-osx-font-smoothing: grayscale;
 }
 
+.icon-daohang-banzhengxuzhi:before {
+  content: "\e614";
+}
+
+.icon-a-28-banzhengjian:before {
+  content: "\e6a4";
+}
+
 .icon-yihuifu1:before {
   content: "\e676";
 }
diff --git a/static/iconfont.ttf b/static/iconfont.ttf
index 217bb6e62745c77ea7d7ef7945a03ede451a56e0..86abb1a6f9775c18c2073db669cf44cc7bc97c41 100644
GIT binary patch
delta 2068
zcmZvcYit`;7RS$-vB%GN>||!#*v`22jGeTNonj|Wf!2|r726`VOL?e82ykeLi`q0m
zDJ4M|@luh{DqBN@pllKJLzU$NE2LFdq6qN;5ELN<DwPVT0_nypfy5$JNNDTq|9S);
zRy%io_xe8Oo^$@^B**^Di!bt`(;6n?=ZWZ^dk;3|iqE<a5h<sMd}8LnqxVHGiC2jN
zKM`$tv$?Oacl^okZp7J3pw`4f^vB>A`27xWn+FdcJ(pTt#eF}>wF8IlZ5(;y>A&Lp
zMa=Ix*f=`JxA14!UxWGD*~Y<r@i$VN-y+&}0!C-%4n1^uZ{-&p_=6Ag=l=4JGc`tx
zvtawoo29$;&6g>HJv?IlXU=cq>gwu)AzfX<JV=UM#UsBPYuo$)?`|)0L&dcH1AjQR
z)Y~CmB(?Wz6k{0XmdM9@ai~sf$w#&z;TK^M7lz0PM-;?O;)r-$oNE81O!299S#7kW
zjXK&^+CjVM*8kIX(;ffQ?j+gn>NSW=Lu6By(y*DMJUNu4VRC7Z)=&z!`)Pps$%2O=
z#1%kv>!?T>T2CX?m!}P6kWQmiA`Kx#C`t(`Q-R`SQViZ{?W=shw&&DPD~iBK`IGGN
zY=nFmByfQQB$L1y63|Hkw@Ao6sdg5l-vh3a2zbD05<w5RPa@=jKuADR2|^+fg;YYi
zki^*MfjCLPNeLn*p?e^95^)cxKw`iHdXO+YWZp!^0~(Q#MgY_zQSg9nByRGcmW3Zj
zJRl~C$2}k`iBlf3aKuL*kebBj9uS?xc@M}>;wuj%g2V+6q=dvp4<v`g*B(d{iAzK+
z*%2aN!9fX9M=P5=kVIP9>Vb69%61PVmR1mf1SzJKA3cz4>Oe7xtlSPFmY@Kr0|zB2
z1?t@Ffud+p=VeR)>VrD3c%V|KgTFQjYKA)h_CWQ}za~9UN35iK$n>$2=|M6zz2|*i
zQs&gA=F@g-X98N_+2EP*=14yBVC3g$Gx~lkA3LG{v85l^m-TLZKK^B*mRRmD_P;eS
zJ@B3}YkXktGCS6(<Tc68n*R)*N&C{TXKu}ip=0(n_IVj8k@~H20p)lz9igN27#$-j
z<nm>nNQ~FHnyc76#LmQc(aGgCGhtZO+<?tVOM@?HreX87+^SefGseTYd~vwAg~w~x
za-}vgJ~3PzE_0nHYg3%Z=@?r{Cm+LwM$(pd*BOV)yn$<zHJmKu%-lrI@8pZU8!SUp
z{N0n8jTyYk2)b(4x^ltFW-V@9v`c<1qKBhlm9<thu;0iqXN>Nr`k<x`8O^Y+s6lH`
z%_O6Je!prNxZhltE~NuegfyNmr}2)2wNNOu{mLHY-7D8A?{@olMsz*0Gpy^kWi}4+
z-#yc3&q|Zsoz_}-S{zE25|MyEqAFS>m^QA4-FT}n6uR0-$0CZN1$?nmbwk9@<IJJN
z4YxR{a(a`|pUKHFT~75Ij$7X13|3#$Egdg1fFfJ{Lj6T`P{JwHcbTSXj-Em)o~M`a
zf5ypch6PFMQmo1G;s*8>tXctEP_u<ys|GELfr+Z=Pe}R9-X~bBR;(eePV{t^eJ=qr
z4alagRH1mj$cBbXd#S5fCJz_$I%{}wuS{N@b!AEk3{T3BZKckr2j%2^+%)6!;Y2vx
zN-SCWWjVd9Tiv^lr(AbXcCRgTe;&;)SDk66x||)|KC*RW*{$!WyUXjYAF<ZgY<{78
zAUn$c4EU%00k`7vKlb>->N$mN4*JzcROOt?hZo$?!Zsz%-9wRqpf7G2eHN!J+YBcL
z65(0hvh1eG*6nWUZz+dm?|yT<{RBUg9SypbiW?lwo<0qG3AbJ-)ZN6$_3OF|c5Quf
z$0)D(128=Zce@jNe7;Xq^${&(vvSTC9-9vr7Gj)M_(IgQbbqKns+(`W7YJ?PvG&JX
x?<nyYZzOYX<506PJ5!o&%+5FW&CVQsc)qzm(I{0m{l0Yn{>JRvg>B#Se*x^?nWz8&

delta 1160
zcmZvaOGs2v9LB#h&ghKu)EQsnXf~rgd_;?=C|`+$1wl%Pn302;E*!NIv5iyEB1FQt
z6jYlai3ozg7A+(~TC^yn7A57vNd8VxP(h2Ln!YoqHqkx&?!D*CnR~wf_x)!ts|y#^
zY%Ey=s2KpgeTn$koVzgr*lqy!#lhh-Cl1=K9tCn90ej944aEC*ob$Zp-c_=5hzp*N
z&gXnzAeBRj@yW;GbeiA$!1?{*(Y|=c&)!P@zn}A-M0|2gwW}rmUd(yLNIWqRxEZd$
z2edTv(800M)8n0YqJE(DHs{AKEySAYptzUpPd;-U_t$@g+s*|*wyur*eWugtQ!anj
z70#Wo=~Z6(e|1*5I;ncBSrxawsl|rr%qrA*WM$rJ`OM`})3B>9?ypA$?1%`&A-NKe
zphP4lRdPrsWXk$(YqIuc^(Gbf)uRP%IQ*Y+1fBnkF6hyn89WT7h@cE5D8~k#w-E)X
zLKH<PL^1W`A%GCo<-mb#Y(^!**n&-PV=MCEMRgc86zPPE(*3AK3_b+mVa3_jKKn20
zk#bl~j_l-a?E<fDG>Z?7Hb?$I8IUXk1wrVmhSFHRfg&L}2Fisv4HOP>8CU{@CTds=
zgi16?)&=nzSRuq`V66~_tYOuVfPwWxf(AMP(V_@Ffy4}S2co}4=o93SfsR2Y3_4kv
z;`zL>_c(cCprH`9tA^G>UK(gJ<duPTLzWFR9`eS(2p}s4h5=bMFcz#+q=o@uovv$;
zpX5ucfvI8rfC1HfQniLbV*R6mks`&zH4GOiR;XdjNb$oO-K(i~1EWXknt@G#)O7>f
z0jVXD<c*zy)Mo>G1n+kl*e%LdngNVS*&-RBBgkB@)eHNGebEthj5$8#M4h)>Gp?1~
zp4=DiTF;C(+xx)#!x!=m`PTf6{u_Z%U^XwD_cXsce>u24xDe_n@D<F33OkBU6h})&
h!k+NM(!-@+B6DTU^AWeJLDgBC+PW3y@3y^DzX7j`^ojrg

diff --git a/styles/global.scss b/styles/global.scss
index c960318..92b83f5 100644
--- a/styles/global.scss
+++ b/styles/global.scss
@@ -77,8 +77,15 @@
       margin-bottom: 10px;
     }
     .library-name {
-      font-size: 14px;
-      text-shadow: 0 2rpx 10rpx rgba(0, 0, 0, 0.2);
+      font-size: 16px;
+      font-weight: bold;
+      margin-top: 8px;
+      text-shadow: 0 2px 5px rgba(0,0,0,0.2);
+    }
+    .sub-title {
+      font-size: 12px;
+      opacity: 0.9;
+      margin-top: 4px;
     }
   }
 }
@@ -259,7 +266,7 @@
 }
 
 .qrcode-popup {
-  width: 300px;
+  width: 240px;
   padding: 20px;
   background: #fff;
   border-radius: 12px;
@@ -284,4 +291,24 @@
   border-radius: 20px;
   font-size: 14px;
   padding: 5px 20px;
+}
+
+.register-btn {
+  position: fixed;
+  bottom: 40px;
+  left: 50%;
+  transform: translateX(-50%);
+  width: calc(100% - 40px);
+  height: 44px;
+  line-height: 44px;
+  border-radius: 24px;
+  background-color: #fff !important;
+  color: #01a4fe !important;
+  border: 1px solid #01a4fe !important;
+  font-size: 16px;
+  font-weight: 500;
+  
+  &::after {
+    border: none !important;
+  }
 }
\ No newline at end of file
diff --git a/subpkg/pages/reader-card/reader-card.vue b/subpkg/pages/reader-card/reader-card.vue
index 78f95db..895d412 100644
--- a/subpkg/pages/reader-card/reader-card.vue
+++ b/subpkg/pages/reader-card/reader-card.vue
@@ -33,7 +33,7 @@
 
       <view class="add-card-btn" @click="toAddReaderCard" v-if="!isEditMode">
         <uni-icons type="plus" size="20" color="#01a4fe"></uni-icons>
-        <text>新增读者证</text>
+        <text>绑定读者证</text>
       </view>
     </view>
 
@@ -60,9 +60,11 @@
             background="#f5f5f5"
           />
         <view class="qrcode-num">{{ qrcodeText }}</view>
-        <view class="close-btn" @click="closePopup">关闭</view>
+        <!-- <view class="close-btn" @click="closePopup">关闭</view> -->
       </view>
     </uni-popup>
+
+    <button class="register-btn" type="primary" @click="goRegister">在线办证</button>
 	</view>
 </template>
 
@@ -239,6 +241,12 @@ export default {
     toAddReaderCard() {
       uni.navigateTo({ url: "/pages/login/login" });
     },
+    // 跳转到在线办证页面
+    goRegister() {
+      uni.navigateTo({
+        url: '/pages/register/register'
+      });
+    }
   }
 }
 </script>