feat: implement miniapp C-group pages with real API calls and design tokens

2026-09-14 10:02:22 +08:00
parent bb380d40f6
commit 63cbbff2de
20 changed files with 300 additions and 23 deletions
@@ -1 +1,27 @@
-Page({data:{warnings:['刚认识就引导投资或博彩','以生病、工程、周转为由借款','催促脱离平台并索要隐私资料']},report(){wx.navigateTo({url:'/pages/report/report?type=fraud'})}})
+Page({
+  data: {
+    risks: [
+      { title: '投资博彩诱导', description: '刚认识便引导投资、博彩或下载陌生应用' },
+      { title: '借款资金周转', description: '以生病、工程或临时周转为由反复借款' },
+      { title: '索取隐私资料', description: '催促脱离平台并索要验证码、银行卡或证件信息' },
+      { title: '冒充平台人员', description: '以认证、保证金或解冻账户为由要求转账' },
+    ],
+  },
+
+  report() {
+    wx.navigateTo({ url: '/pages/report/report?type=fraud' })
+  },
+
+  requestHelp() {
+    wx.showModal({
+      title: '安全求助',
+      content: '如有财产损失或人身危险，请立即拨打 110；非紧急问题可前往平台帮助中心。',
+      confirmText: '拨打 110',
+      cancelText: '帮助中心',
+      success(result) {
+        if (result.confirm) wx.makePhoneCall({ phoneNumber: '110' })
+        else if (result.cancel) wx.navigateTo({ url: '/pages/help-center/help-center' })
+      },
+    })
+  },
+})
@@ -1 +1,7 @@
-{"navigationBarTitleText":"婚恋反诈","backgroundColor":"#FAFAF8"}
+{
+  "navigationBarTitleText": "婚恋反诈",
+  "backgroundColor": "#F4F5FA",
+  "usingComponents": {
+    "ui-service-hero": "/components/service-hero/index"
+  }
+}
@@ -1 +1,19 @@
-<view class="service-page reference-page"><view class="hero"><text class="eyebrow">婚恋反诈中心</text><text class="hero-title">真诚交往，也要守住安全边界</text><text class="hero-desc">平台不会以任何理由要求转账、投资或提供银行卡密码。</text></view><view class="content"><view class="block"><text class="block-title">常见风险信号</text><view class="card danger-card"><view wx:for="{{warnings}}" wx:key="*this" class="feature-row"><view class="feature-icon">!</view><view class="feature-copy"><text class="feature-title">{{item}}</text><text class="feature-desc">遇到异常请停止转账并保存相关记录</text></view></view></view></view><view class="block"><text class="block-title">遇到可疑情况怎么办</text><view class="card"><view class="feature-row"><view class="feature-icon">1</view><view class="feature-copy"><text class="feature-title">停止资金操作</text><text class="feature-desc">不要继续转账、充值或提供验证码</text></view></view><view class="feature-row"><view class="feature-icon">2</view><view class="feature-copy"><text class="feature-title">保存相关证据</text><text class="feature-desc">保留聊天、付款与账号信息</text></view></view><view class="feature-row"><view class="feature-icon">3</view><view class="feature-copy"><text class="feature-title">及时举报或报警</text><text class="feature-desc">紧急情况请直接拨打 110</text></view></view></view></view></view><view class="fixed-action"><view class="primary-btn" bindtap="report">举报可疑行为</view></view></view>
+<view class="service-shell fraud-page app-page reference-page">
+  <ui-service-hero eyebrow="提高警惕 · 守护真心" title="婚恋反诈" subtitle="识别风险信号，守护你的真心与财产安全" image-src="/assets/service/anti-fraud-hero.jpg" tone="rose" />
+  <view class="service-content">
+    <view class="block"><text class="block-title">常见风险信号</text><text class="block-subtitle">出现以下情况，请先停止资金或隐私操作</text>
+      <view class="risk-grid">
+        <view wx:for="{{risks}}" wx:key="title" class="risk-card"><image src="/assets/icons/ui/warning.png" mode="aspectFit" /><text class="risk-title">{{item.title}}</text><text class="risk-desc">{{item.description}}</text></view>
+      </view>
+    </view>
+
+    <view class="block"><text class="block-title">遇到可疑情况怎么办</text>
+      <view class="safety-steps">
+        <view class="safety-step"><image src="/assets/icons/home/anti-fraud.png" mode="aspectFit" /><view><text>立即停止资金操作</text><text>不要继续转账、充值或提供验证码</text></view></view>
+        <view class="safety-step"><image src="/assets/icons/home/classroom.png" mode="aspectFit" /><view><text>保存相关证据</text><text>保留聊天、付款和对方账号信息</text></view></view>
+        <view class="safety-step"><image src="/assets/icons/home/service-station.png" mode="aspectFit" /><view><text>及时举报或报警</text><text>平台举报不会通知被举报人，紧急情况请拨打 110</text></view></view>
+      </view>
+    </view>
+  </view>
+  <view class="fixed-action"><view class="service-actions"><view class="secondary-btn" bindtap="requestHelp">安全求助</view><view class="primary-btn" bindtap="report">举报可疑行为</view></view></view>
+</view>
@@ -1 +1,2 @@
-@import "../../styles/service-page.wxss";
+@import "../../styles/service-page.wxss";
+.risk-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:16rpx;margin-top:18rpx}.risk-card{display:flex;min-height:174rpx;flex-direction:column;padding:20rpx;border:1rpx solid #F7DCE2;border-radius:24rpx;background:#FFF9FA}.risk-card image{width:42rpx;height:42rpx}.risk-title{margin-top:10rpx;color:#9E4054;font-size:23rpx;font-weight:650}.risk-desc{margin-top:7rpx;color:#846F78;font-size:18rpx;line-height:1.5}.safety-steps{overflow:hidden;margin-top:18rpx;border-radius:24rpx;background:#fff;box-shadow:0 8rpx 26rpx rgba(35,35,95,.06)}.safety-step{display:flex;align-items:center;gap:16rpx;min-height:104rpx;padding:16rpx 20rpx;border-bottom:1rpx solid #EFF0F5}.safety-step:last-child{border-bottom:0}.safety-step>image{width:48rpx;height:48rpx;flex:none}.safety-step>view{display:flex;flex:1;flex-direction:column}.safety-step view text:first-child{color:#303654;font-size:23rpx;font-weight:650}.safety-step view text:last-child{margin-top:5rpx;color:#858A9E;font-size:19rpx;line-height:1.45}