diff --git a/src/main/java/com/budwk/app/zhgh/staffmanage/member/controller/info/MemberInfoBoardController.java b/src/main/java/com/budwk/app/zhgh/staffmanage/member/controller/info/MemberInfoBoardController.java index 3dced777..952b4d88 100644 --- a/src/main/java/com/budwk/app/zhgh/staffmanage/member/controller/info/MemberInfoBoardController.java +++ b/src/main/java/com/budwk/app/zhgh/staffmanage/member/controller/info/MemberInfoBoardController.java @@ -72,7 +72,8 @@ public class MemberInfoBoardController { List result = new ArrayList<>(); int year = DateUtil.thisYear(); for (int i = year - 5; i < year; i++) { - int count = memberInfoService.count(Sqls.create("select count(1) from member_history where year = @year ").setParam("year", year)); + // 历史趋势必须按循环中的年份分别统计,避免五个历史节点都查询成当前年份。 + int count = memberInfoService.count(Sqls.create("select count(1) from member_history where year = @year ").setParam("year", i)); result.add(Map.of("label", i, "value", count)); } result.add(Map.of("label", year, "value", memberInfoService.count(Sqls.create("select count(1) from sys_user where member = 1")))); diff --git a/src/main/resources/views/layouts/platform_h5.html b/src/main/resources/views/layouts/platform_h5.html index 02c1edda..cdb9dfe0 100644 --- a/src/main/resources/views/layouts/platform_h5.html +++ b/src/main/resources/views/layouts/platform_h5.html @@ -245,6 +245,8 @@ //初始化pjax ;(function initPjax() { if ($.support.pjax) { + // jquery-pjax 的历史缓存读取全局默认值;必须在初始化前关闭,避免返回时恢复缺少 Vue 动态样式的旧 DOM。 + $.pjax.defaults.maxCacheLength = 0 $(document).pjax("a[data-pjax]", "#container", { maxCacheLength: 0, push: true, @@ -271,22 +273,9 @@ toggleShowBar() }) - // 监听浏览器的前进和后退操作 + // PJAX 已内置页面前进、后退处理;这里只同步 H5 弹层历史,禁止再次发起 PJAX 请求。 $(window).on("popstate", function (event) { - if (window.h5HistoryLayerManager.handlePopState(event.originalEvent)) { - return - } - if (event.originalEvent.state) { - // 如果存在历史记录状态,触发 Pjax 加载对应内容 - $.pjax({ - url: event.originalEvent.state.url, - container: "#container", - fragment: "#container", - timeout: 8000, - push: false, - scrollTo: false - }) - } + window.h5HistoryLayerManager.handlePopState(event.originalEvent) }) } })() diff --git a/src/main/resources/views/platform/zhghh5/staffmanage/member/apply/branchunionapproval/index.html b/src/main/resources/views/platform/zhghh5/staffmanage/member/apply/branchunionapproval/index.html index 27ae8bac..be480f84 100644 --- a/src/main/resources/views/platform/zhghh5/staffmanage/member/apply/branchunionapproval/index.html +++ b/src/main/resources/views/platform/zhghh5/staffmanage/member/apply/branchunionapproval/index.html @@ -1,49 +1,326 @@ -
- - - - - - - - - - + +
+
+ +
+
+
+
+ +
+
+
+
+ +
+ + + + + +
+
+ +
+
+
+ 暂无分工会审核数据 +
暂无审核数据
+
当前筛选条件下没有需要办理的入会申请
+
+ + +
+
@@ -60,13 +337,15 @@ layout("/layouts/platform_h5.html"){ show-word-limit > -
- 同意 - 拒绝 - 退回 +
+ 同意 + 拒绝 + 退回
+
+
diff --git a/src/main/resources/views/platform/zhghh5/staffmanage/member/apply/common/info.js b/src/main/resources/views/platform/zhghh5/staffmanage/member/apply/common/info.js index 7e486ccb..41f178fc 100644 --- a/src/main/resources/views/platform/zhghh5/staffmanage/member/apply/common/info.js +++ b/src/main/resources/views/platform/zhghh5/staffmanage/member/apply/common/info.js @@ -1,8 +1,17 @@ const INFO = { template: /*language=HTML*/ ` - -
- + +
+
+
+ +
+
+
@@ -109,36 +126,68 @@ const INFO = { row: {}, viewData: {}, doneTasks: [], + detailLoading: false, + historyUnsubscribe: null, + historyLayerName: "member-apply-info" } }, methods: { + /** + * 打开入会申请详情。 + * row 传列表当前申请记录,至少包含申请 id;无返回值,详情和已办任务并行加载。 + */ onOpen(row) { - this.row = row - this.visible = true - this.info() - this.getDoneTasks() + this.$set(this, "row", row) + window.h5HistoryLayerManager.ensureRegistered("member-apply-detail") + window.h5HistoryLayerManager.open(this.historyLayerName) + this.detailLoading = true + Promise.all([this.info(), this.getDoneTasks()]).finally(() => { + this.detailLoading = false + }) }, // 关闭 onClose(){ - this.visible = false + window.h5HistoryLayerManager.close(this.historyLayerName) }, + handleComponentClose() { + if (window.h5HistoryLayerManager.stack.includes(this.historyLayerName)) { + window.h5HistoryLayerManager.close(this.historyLayerName) + } + }, + + // id 为入会申请记录主键;接口返回会员申请详情对象。 info() { - this.$axios.post("/platform/member/apply/mine/findMemberApplyRecord", { id: this.row.id }).then((res) => { + return this.$axios.post("/platform/member/apply/mine/findMemberApplyRecord", { id: this.row.id }, {h5SkeletonLoading: true}).then((res) => { if (res.code === 0) { - this.viewData = res.data + this.$set(this, "viewData", res.data) } }) }, + // bizId 为入会申请记录主键;接口返回该申请已完成的 WF 任务数组。 getDoneTasks() { - this.$axios.post("/flow/common/doneTasks", { bizId: this.row.id }).then((res) => { + return this.$axios.post("/flow/common/doneTasks", { bizId: this.row.id }, {h5SkeletonLoading: true}).then((res) => { if (res.code === 0) { - this.doneTasks = res.data + this.$set(this, "doneTasks", res.data) } }) }, }, + created() { + window.h5HistoryLayerManager.ensureRegistered("member-apply-detail") + this.historyUnsubscribe = window.h5HistoryLayerManager.subscribe((stack) => { + this.$set(this, "visible", stack.includes(this.historyLayerName)) + }) + }, + beforeDestroy() { + if (this.historyUnsubscribe) { + this.historyUnsubscribe() + } + if (window.h5HistoryLayerManager.pageKey === "member-apply-detail") { + window.h5HistoryLayerManager.unregister("member-apply-detail") + } + }, style: /*language=CSS*/ ` .column-cell { flex-direction: column; @@ -149,12 +198,11 @@ const INFO = { border-collapse: collapse; table-layout: auto; text-align: center; - font-family: 'Arial', sans-serif; - margin: 20px 0; + margin: 10px 0 0; } .table-header { - background-color: gray; - color: white; + background-color: #edf5ff; + color: #4f6f98; font-weight: bold; text-transform: uppercase; } @@ -166,8 +214,10 @@ const INFO = { background-color: #f1f1f1; } .table-cell { - padding: 10px 20px; - border: 1px solid #ddd; + padding: 8px 6px; + border: 1px solid #e8eef6; + color: #596779; + font-size: 11px; text-align: center; } ` diff --git a/src/main/resources/views/platform/zhghh5/staffmanage/member/apply/mine/index.html b/src/main/resources/views/platform/zhghh5/staffmanage/member/apply/mine/index.html index 3adfaf51..debfe84e 100644 --- a/src/main/resources/views/platform/zhghh5/staffmanage/member/apply/mine/index.html +++ b/src/main/resources/views/platform/zhghh5/staffmanage/member/apply/mine/index.html @@ -1,62 +1,382 @@ +
- - - - - - - - - - +
+ +
+
+
+
+ +
+
+
+
+ +
+ + + + + + + + +
+
- - +
+
+
+ 暂无入会申请记录 +
暂无入会申请记录
+
当前筛选条件下暂时没有入会申请
+
+ + +
+
+
+
diff --git a/src/main/resources/views/platform/zhghh5/staffmanage/member/apply/schoolunionapproval/index.html b/src/main/resources/views/platform/zhghh5/staffmanage/member/apply/schoolunionapproval/index.html index 3a907ae5..9c9aef85 100644 --- a/src/main/resources/views/platform/zhghh5/staffmanage/member/apply/schoolunionapproval/index.html +++ b/src/main/resources/views/platform/zhghh5/staffmanage/member/apply/schoolunionapproval/index.html @@ -1,49 +1,326 @@ -
- - - - - - - - - - + +
+
+ +
+
+
+
+ +
+
+
+
+ +
+ + + + + +
+
+ +
+
+
+ 暂无校工会审核数据 +
暂无审核数据
+
当前筛选条件下没有需要办理的入会申请
+
+ + +
+
@@ -60,13 +337,15 @@ layout("/layouts/platform_h5.html"){ show-word-limit > -
- 同意 - 拒绝 - 退回 +
+ 同意 + 拒绝 + 退回
+
+
diff --git a/src/main/resources/views/platform/zhghh5/staffmanage/member/apply/submit/index.html b/src/main/resources/views/platform/zhghh5/staffmanage/member/apply/submit/index.html index 17913cb5..2eef542f 100644 --- a/src/main/resources/views/platform/zhghh5/staffmanage/member/apply/submit/index.html +++ b/src/main/resources/views/platform/zhghh5/staffmanage/member/apply/submit/index.html @@ -1,7 +1,9 @@ -
- +
+ - +
+
+
+
+ +
+
+
+ +
+
+
会员入会
+
凝聚职工 · 温暖同行
+
+
+ +
+
+ +
+
入会信息确认
+
请核对个人信息并完整填写申请资料,带星号的内容为必填项。
+
+
+ + @@ -28,14 +95,14 @@ layout("/layouts/platform_h5.html"){ label="民族" readonly placeholder="请点击选择民族" - @click="showNationPicker = true" + @click="setLayerVisible('showNationPicker', true)" clickable > - + - + - + - + - + - + @@ -215,25 +282,21 @@ layout("/layouts/platform_h5.html"){
-
-
-
- 家庭主要成员及联系方式 -
-
+
+ 家庭主要成员及联系方式
@@ -266,26 +330,28 @@ layout("/layouts/platform_h5.html"){ - -
+
我自愿申请加入学校工会,并委托学校按规定代为扣缴工会会员会费。
-
+
我将严格遵守工会章程,认真执行工会决议,积极参与工会活动,主动融入“学校健康幸福家”建设,为营造温暖、和谐、奋进的校园氛围贡献力量,以实际行动助力学校各项事业发展。
-
- 保存 - 提交 - 提交 +
+ 保存草稿 + 提交申请 + 重新提交
+
+
diff --git a/src/main/resources/views/platform/zhghh5/staffmanage/member/common/mobileMemberInfo.js b/src/main/resources/views/platform/zhghh5/staffmanage/member/common/mobileMemberInfo.js index b799f659..79d1f1bf 100644 --- a/src/main/resources/views/platform/zhghh5/staffmanage/member/common/mobileMemberInfo.js +++ b/src/main/resources/views/platform/zhghh5/staffmanage/member/common/mobileMemberInfo.js @@ -1,5 +1,12 @@ const MOBILE_MEMBER_INFO = { template: /*language=HTML*/ ` +
+
+
+ +
+
+ + +
+
`, props: { @@ -89,12 +101,13 @@ }, data() { return { - viewData: {} + viewData: {}, + detailLoading: false } }, watch: { userId: { - handler: function () { + handler() { this.findUserInfoByUserId() }, immediate: true @@ -113,14 +126,18 @@ } return mobile.replace(/^(\d{3})\d+(\d{4})$/, "$1****$2") }, + // userId 为系统用户主键;接口返回会员档案详情对象,加载期间显示档案骨架屏。 findUserInfoByUserId() { if (!this.userId) { return } - this.$axios.post("/platform/member/apply/common/findOne", { id: this.userId }).then((res) => { + this.detailLoading = true + this.$axios.post("/platform/member/apply/common/findOne", { id: this.userId }, {h5SkeletonLoading: true}).then((res) => { if (res.code === 0) { - this.viewData = res.data + this.$set(this, "viewData", res.data) } + }).finally(() => { + this.detailLoading = false }) } } diff --git a/src/main/resources/views/platform/zhghh5/staffmanage/member/info/board/index.html b/src/main/resources/views/platform/zhghh5/staffmanage/member/info/board/index.html index b9bf4134..f37cd26e 100644 --- a/src/main/resources/views/platform/zhghh5/staffmanage/member/info/board/index.html +++ b/src/main/resources/views/platform/zhghh5/staffmanage/member/info/board/index.html @@ -2,536 +2,346 @@ layout("/layouts/platform_h5.html"){ #--> +
- - - -
会员数
-
- {{memberNumberData.memberNum}} -  人 +
+ +
+
+
+
+
-
- 年同比 {{memberNumberData.ratio}}  - +
+
+
- -
- +
+
+
+
会员总数
+
{{formatNumber(memberNumberData.memberNum)}}
+
+ 年同比 {{memberNumberData.ratio}} +
+
+
+
增长趋势
+
+
+
- -
增长趋势
-
-
- +
+
+
会员占比
+
+
+
{{memberPercentageText}}
+
+
+
+
性别占比
+
+
+
+
{{malePercentage}}
+
{{femalePercentage}}
+
+
+
+
- - -
会员占比
-
-
- -
性别占比
-
-
-
- - - -
在职状态
-
- -
人员类型
-
-
-
- - - -
工会会员数
-
- -
- - - 序号 - 工会名称 - 会员人数 - - - - - {{ index+1 }} - - {{ item.unionname }} - - {{ item.value }} - -
-
-
+
+
在职状态分布
+
+
+
+
人员类型分布
+
+
+
+
+
工会会员数统计(按工会)
+
共 {{unionMember.length}} 个工会
+
+
+
+
排名工会名称会员人数
+
+ {{index + 1}}{{item.unionname}}{{item.value}} +
+ +
+
+
数据更新于 {{updateTime || "--"}}
+
+
- - +
- - - - - - - - - - +
+ +
+
+
+
+ +
+
+
+
+ +
+ + + + + +
+
- - +
+
共 {{pageForm.totalCount}} 名会员
+
+
+ 暂无会员档案 +
暂无会员档案
+
请尝试调整工会、单位或搜索关键词
+
+ + +
+
-
- 总人数:{{pageForm.totalCount}}人 - -
- - + +
+
diff --git a/src/main/resources/views/platform/zhghh5/staffmanage/member/theme.css b/src/main/resources/views/platform/zhghh5/staffmanage/member/theme.css new file mode 100644 index 00000000..af823290 --- /dev/null +++ b/src/main/resources/views/platform/zhghh5/staffmanage/member/theme.css @@ -0,0 +1,495 @@ +:root { + --member-primary: #1989fa; + --member-page-bg: #f3f7fd; + --member-text: #263548; + --member-muted: #8c98aa; + --member-border: #e8eef6; + --color-primary: #1989fa; +} + +body { + background: var(--member-page-bg); +} + +.member-h5-page { + min-height: 100vh; + padding-bottom: calc(24px + env(safe-area-inset-bottom)); + box-sizing: border-box; + color: var(--member-text); + background: var(--member-page-bg); +} + +.member-h5-page.has-fixed-actions { + padding-bottom: calc(78px + env(safe-area-inset-bottom)); +} + +.member-h5-page .van-nav-bar { + background: #fff; +} + +.member-h5-page .van-nav-bar__title { + color: #1f2937; + font-size: 16px; + font-weight: 600; +} + +.member-h5-page .van-nav-bar .van-icon, +.member-h5-page .van-nav-bar__text { + color: var(--member-primary); +} + +.member-hero { + position: relative; + height: 116px; + padding: 18px 18px 0; + overflow: hidden; + box-sizing: border-box; + background-color: #edf5ff; + background-image: url("/assets/mobile/img/home/v4/hero-campus.png"); + background-position: 66% 46%; + background-size: cover; +} + +.member-hero::after { + position: absolute; + inset: 0; + background: rgba(242, 247, 255, .76); + content: ""; +} + +.member-hero__content { + position: relative; + z-index: 1; +} + +.member-hero__title { + color: var(--member-primary); + font-size: 23px; + font-weight: 700; + line-height: 30px; + letter-spacing: 1px; +} + +.member-hero__subtitle { + margin-top: 2px; + color: #718096; + font-size: 11px; + line-height: 18px; +} + +.member-page-main { + position: relative; + z-index: 2; + margin-top: -34px; + padding: 0 12px; +} + +.member-toolbar { + padding: 10px; + border: 1px solid var(--member-border); + border-radius: 12px; + background: rgba(255, 255, 255, .98); + box-shadow: 0 5px 16px rgba(43, 73, 112, .09); +} + +.member-toolbar .van-search { + padding: 0; + background: transparent; +} + +.member-toolbar .van-search__content { + height: 42px; + align-items: center; + border-radius: 10px; + background: #f5f8fc; +} + +.member-toolbar .van-field__control { + color: var(--member-text); + font-size: 14px; +} + +.member-toolbar .van-search__action { + padding: 0 4px 0 12px; + color: var(--member-primary); + font-size: 14px; +} + +.member-toolbar .van-dropdown-menu { + margin-top: 8px; + /* Vant 下拉选项弹层位于菜单内部,吸顶状态下必须允许弹层超出筛选卡片显示。 */ + overflow: visible; + border-top: 1px solid #edf1f6; +} + +.member-toolbar .van-dropdown-menu__bar { + height: 42px; + background: transparent; +} + +.member-toolbar .van-dropdown-menu__title { + color: #66758a; + font-size: 13px; +} + +.member-list-section { + margin-top: 10px; +} + +.member-list-section .table-list-container { + margin-top: 0; +} + +.member-list-section .table-list-item { + border-color: var(--member-border) !important; + border-radius: 12px !important; + box-shadow: 0 7px 20px rgba(55, 85, 126, .08) !important; +} + +.member-list-section .item-title { + color: #263548 !important; + font-size: 15px !important; +} + +.member-list-section .action-btn { + color: var(--member-primary) !important; + background: #eaf4ff !important; +} + +.member-list-section .action-btn.delete { + color: #e95757 !important; + background: #fff0f0 !important; +} + +.member-empty { + display: flex; + min-height: 280px; + padding: 20px 18px 30px; + align-items: center; + justify-content: flex-start; + flex-direction: column; + box-sizing: border-box; + text-align: center; +} + +.member-empty img { + display: block; + width: 84%; + max-width: 290px; + height: auto; + object-fit: contain; +} + +.member-empty__title { + margin-top: -8px; + color: #50627a; + font-size: 15px; + line-height: 22px; + font-weight: 500; +} + +.member-empty__hint { + margin-top: 6px; + color: #9aa7b8; + font-size: 12px; + line-height: 18px; +} + +.member-list-skeleton { + padding-top: 10px; +} + +.member-list-skeleton__card { + min-height: 154px; + margin-bottom: 10px; + padding: 14px; + border-radius: 12px; + background: #fff; + box-sizing: border-box; + box-shadow: 0 7px 20px rgba(55, 85, 126, .08); +} + +.member-list-skeleton__card .van-skeleton { + padding: 0; +} + +.member-list-skeleton__card .van-skeleton__title { + height: 17px; +} + +.member-list-skeleton__card .van-skeleton__row { + height: 12px; + margin-top: 13px; +} + +/* 页面首次进入时统一遮住尚未完成初始化的横幅、筛选栏和列表,避免返回页面时出现空筛选项。 */ +.member-page-skeleton { + min-height: calc(100vh - 46px); + padding: 12px; + box-sizing: border-box; + background: var(--member-page-bg); +} + +.member-page-skeleton__hero { + height: 82px; + margin-bottom: 10px; + padding: 18px; + border-radius: 12px; + background: linear-gradient(135deg, #e4f1ff 0%, #f2f7ff 100%); + box-sizing: border-box; +} + +.member-page-skeleton__toolbar { + min-height: 96px; + margin-bottom: 10px; + padding: 14px; + border-radius: 12px; + background: #fff; + box-sizing: border-box; + box-shadow: 0 5px 16px rgba(43, 73, 112, .07); +} + +.member-page-skeleton__toolbar .van-skeleton, +.member-page-skeleton__hero .van-skeleton { + padding: 0; +} + +.member-page-skeleton__cards .member-list-skeleton { + padding-top: 0; +} + +.member-count-chip { + display: inline-flex; + height: 28px; + margin: 10px 0 0; + padding: 0 11px; + align-items: center; + border-radius: 14px; + color: #397de0; + background: #edf5ff; + font-size: 12px; +} + +.member-form-intro { + display: flex; + min-height: 58px; + margin-bottom: 10px; + padding: 11px 12px; + align-items: flex-start; + box-sizing: border-box; + border: 1px solid #dfeafb; + border-radius: 10px; + background: rgba(246, 250, 255, .98); + box-shadow: 0 3px 10px rgba(53, 98, 154, .08); +} + +.member-form-intro .van-icon { + margin: 1px 9px 0 0; + color: var(--member-primary); + font-size: 19px; +} + +.member-form-intro__title { + color: var(--member-primary); + font-size: 12px; + line-height: 18px; + font-weight: 600; +} + +.member-form-intro__text { + margin-top: 2px; + color: #8a97a8; + font-size: 10px; + line-height: 17px; +} + +.member-application-form.form-container { + padding-bottom: 0; + background: transparent; +} + +.member-application-form .form-section { + margin-bottom: 10px; + overflow: hidden; + border: 1px solid var(--member-border); + border-radius: 12px; + background: #fff; + box-shadow: 0 5px 16px rgba(55, 85, 126, .07); +} + +.member-application-form .van-cell-group__title { + padding: 12px 14px 8px 21px; + color: #354255; + background: #fff; + font-size: 13px; + line-height: 20px; +} + +.member-application-form .van-cell-group__title::before { + top: 15px; + bottom: 11px; + left: 12px; + width: 2px; + border-radius: 2px; +} + +.member-application-form .van-cell { + min-height: 44px; + padding: 10px 14px; + background: #fff; +} + +.member-application-form .van-field__label { + width: 84px; + color: #596779; + font-size: 12px; + line-height: 24px; +} + +.member-application-form .van-field__control, +.member-application-form .van-field__value { + color: #4f5d70; + font-size: 12px; + line-height: 24px; +} + +.member-form-actions, +.member-approval-actions { + position: fixed; + right: 0; + bottom: 0; + left: 0; + z-index: 100; + display: flex; + gap: 9px; + padding: 10px 12px calc(10px + env(safe-area-inset-bottom)); + border-top: 1px solid #edf1f6; + background: rgba(255, 255, 255, .98); + box-sizing: border-box; + box-shadow: 0 -4px 14px rgba(50, 78, 112, .06); +} + +.member-form-actions .van-button, +.member-approval-actions .van-button { + height: 42px; + margin: 0; + border-radius: 14px; + font-size: 14px; +} + +.member-form-actions .member-save-button { + color: var(--member-primary); + border-color: var(--member-primary); + background: #fff; +} + +.member-form-actions .member-submit-button, +.member-approval-actions .member-agree-button { + color: #fff; + border-color: var(--member-primary); + background: var(--member-primary); +} + +.member-approval-actions .member-return-button { + color: #fff; + border-color: #e6a23c; + background: #e6a23c; +} + +.member-form-skeleton { + padding: 0 12px 24px; +} + +.member-form-skeleton__card { + min-height: 200px; + margin-bottom: 10px; + padding: 16px 14px; + border-radius: 12px; + background: #fff; + box-sizing: border-box; +} + +.member-form-skeleton__card .van-skeleton { + padding: 0; +} + +.member-info-sheet { + height: 88%; + overflow: hidden; + border-radius: 16px 16px 0 0; + background: var(--member-page-bg); +} + +.member-info-sheet .van-action-sheet__header { + height: 48px; + color: #1f2937; + background: #fff; + font-size: 16px; + line-height: 48px; + font-weight: 600; +} + +.member-info-scroll { + height: calc(100% - 48px); + padding: 12px 12px calc(82px + env(safe-area-inset-bottom)); + overflow-y: auto; + box-sizing: border-box; + -webkit-overflow-scrolling: touch; +} + +.member-detail-card { + margin-bottom: 10px; + overflow: hidden; + border-radius: 12px; + background: #fff; + box-shadow: 0 5px 16px rgba(55, 85, 126, .07); +} + +.member-detail-card__title { + position: relative; + padding: 12px 14px 8px 21px; + color: #354255; + font-size: 13px; + line-height: 20px; + font-weight: 600; +} + +.member-detail-card__title::before { + position: absolute; + top: 15px; + bottom: 11px; + left: 12px; + width: 2px; + border-radius: 2px; + background: var(--member-primary); + content: ""; +} + +.member-detail-card .van-cell { + padding: 10px 14px; + color: #4f5d70; + font-size: 12px; +} + +.member-detail-card .van-cell__title { + color: #7b899b; +} + +@media (min-width: 600px) { + .member-hero__content, + .member-page-main, + .member-form-skeleton { + max-width: 520px; + margin-right: auto; + margin-left: auto; + box-sizing: border-box; + } + + .member-form-actions, + .member-approval-actions { + right: 50%; + left: auto; + width: 520px; + transform: translateX(50%); + } +}