feat(mobile-h5): add follow service-account entry on login page

Co-authored-by: Cursor <cursoragent@cursor.com>

mobile-h5/pages/login/index.vue

@@ -75,6 +75,8 @@
       </view>
     </view>
 
+    <view class="login-follow-mp" @click="onFollowMp">关注服务号，接收审批通知</view>
+
     <view class="login-divider">或</view>
 
     <button
@@ -125,6 +127,20 @@
       </text>
       <text>。是否同意并继续登录？</text>
     </ConfirmDialog>
+
+    <view v-if="showMpQrcode" class="login-mp-qrcode">
+      <view class="login-mp-qrcode__mask" @click="showMpQrcode = false" />
+      <view class="login-mp-qrcode__panel">
+        <image
+          class="login-mp-qrcode__img"
+          :src="mpQrcodeUrl"
+          mode="aspectFit"
+          show-menu-by-longpress
+        />
+        <text class="login-mp-qrcode__tip">长按识别关注</text>
+        <view class="login-mp-qrcode__close" @click="showMpQrcode = false">关闭</view>
+      </view>
+    </view>
   </view>
 </template>
 
@@ -136,6 +152,7 @@
     clearLegacyMockSessionIfNeeded
   } from '../../utils/auth.js'
   import { validateCredentials } from '../../utils/validate-credentials.js'
+  import { MP_GH_USERNAME, MP_QRCODE_URL } from '../../utils/config.js'
   import ConfirmDialog from '../../components/ConfirmDialog.vue'
 
   export default {
@@ -154,6 +171,8 @@
         loading: false,
         focusUser: false,
         focusPwd: false,
+        showMpQrcode: false,
+        mpQrcodeUrl: MP_QRCODE_URL,
         errors: {
           username: '',
           password: ''
@@ -212,6 +231,21 @@
       openProtocol(type) {
         uni.navigateTo({ url: `/pages/protocol/index?type=${type}` })
       },
+      onFollowMp() {
+        const username = (MP_GH_USERNAME || '').trim()
+        const openProfile =
+          typeof wx !== 'undefined' && typeof wx.openOfficialAccountProfile === 'function'
+        if (openProfile && username) {
+          wx.openOfficialAccountProfile({
+            username,
+            fail: () => {
+              this.showMpQrcode = true
+            }
+          })
+          return
+        }
+        this.showMpQrcode = true
+      },
       goHome() {
         uni.reLaunch({ url: '/pages/index/index' })
       },

mobile-h5/static/mp-qrcode.README.txt

@@ -0,0 +1,5 @@
+Replace this placeholder with the real WeChat 服务号关注二维码 image from ops before production.
+
+Recommended: square PNG, clear enough for long-press recognize in WeChat.
+
+Config path: mobile-h5/utils/config.js → MP_QRCODE_URL (default /static/mp-qrcode.png)

mobile-h5/styles/components/login.scss

@@ -136,6 +136,75 @@
   color: var(--brand-green);
 }
 
+.login-follow-mp {
+  margin-top: 28rpx;
+  text-align: center;
+  font-size: 24rpx;
+  color: var(--text-muted);
+  line-height: 1.45;
+  text-decoration: underline;
+  text-underline-offset: 6rpx;
+}
+
+.login-mp-qrcode {
+  position: fixed;
+  inset: 0;
+  z-index: 1100;
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  padding: 48rpx;
+  box-sizing: border-box;
+}
+
+.login-mp-qrcode__mask {
+  position: absolute;
+  inset: 0;
+  background: rgba(15, 30, 24, 0.32);
+}
+
+.login-mp-qrcode__panel {
+  position: relative;
+  z-index: 1;
+  width: 100%;
+  max-width: 560rpx;
+  padding: 44rpx 36rpx 32rpx;
+  background: var(--surface, #fff);
+  border-radius: 28rpx;
+  box-shadow: 0 20rpx 56rpx rgba(0, 0, 0, 0.14);
+  text-align: center;
+  box-sizing: border-box;
+}
+
+.login-mp-qrcode__img {
+  display: block;
+  width: 360rpx;
+  height: 360rpx;
+  margin: 0 auto;
+  background: #f8fbfa;
+  border: 1px solid var(--border);
+  border-radius: 16rpx;
+}
+
+.login-mp-qrcode__tip {
+  display: block;
+  margin-top: 24rpx;
+  font-size: 26rpx;
+  color: var(--text-muted);
+  line-height: 1.45;
+}
+
+.login-mp-qrcode__close {
+  margin-top: 28rpx;
+  height: 80rpx;
+  line-height: 80rpx;
+  border-radius: 20rpx;
+  border: 1px solid var(--border);
+  font-size: 28rpx;
+  font-weight: 500;
+  color: var(--brand-green);
+}
+
 .login-divider {
   display: flex;
   align-items: center;

mobile-h5/utils/config.js

@@ -31,3 +31,10 @@ export const OA_H5_ORIGIN = USE_REMOTE_TEST ? REMOTE_OA_H5_ORIGIN : LOCAL_OA_H5_
 export const MINIO_BASE_URL = USE_REMOTE_TEST
   ? REMOTE_MINIO_BASE_URL
   : LOCAL_MINIO_BASE_URL
+
+/** 服务号原始 ID（gh_…），用于 openOfficialAccountProfile */
+export const MP_GH_USERNAME = '' // 上线前填写
+/** 关注二维码图片（兜底） */
+export const MP_QRCODE_URL = '/static/mp-qrcode.png'
+/** 绑定 H5 路径（相对 OA_H5_ORIGIN） */
+export const MP_BIND_H5_PATH = '/oa-mp-bind/'