affiliate-dash 领取界面优化(合并多次迭代为一次提交)

- 第 2 步绑定页:移除金额/单号/商品信息区,移除标题上方 affiliate-dash 标签
- 二维码区参考旧设计:左右竖排红字 Q区用Q扫/V区用V扫,去浅蓝背景,放大至 220px
- 第 4 步结果页:废弃 canvas 生成发货成功图,改用旧版结果卡片(绿勾+兑换成功+信息网格+商品明细)
- 开发 Mock:新增 affiliate-dash 领取五步 mock(uid/bind/submitted/completed/failed,不调真实平台)

apps/frontend/src/pages/admin/AdminDevMockPage.tsx

@@ -21,6 +21,7 @@ import { Link } from 'react-router'
 import PageHeader from '@/components/admin/PageHeader'
 import {
   buildOpen91QueryDevMock,
+  createAffiliateDashDevMock,
   createFeifeiDevMock,
   createLewanDevMock,
   fetchDevMockStatus,
@@ -64,6 +65,17 @@ export default function AdminDevMockPage() {
     },
   })
 
+  const affiliateDashMutation = useMutation({
+    mutationFn: createAffiliateDashDevMock,
+    onSuccess: (response) => {
+      setLastCreate(response.data)
+      message.success('affiliate-dash mock 已生成')
+    },
+    onError: (error) => {
+      message.error(error instanceof Error ? error.message : '生成失败')
+    },
+  })
+
   const open91Mutation = useMutation({
     mutationFn: buildOpen91QueryDevMock,
     onSuccess: (response) => {
@@ -145,8 +157,17 @@ export default function AdminDevMockPage() {
           </Card>
         </Col>
 
+        <Col xs={24} xl={12}>
+          <Card title="3. affiliate-dash 领取（mock 二维码/提交发货）" bordered={false}>
+            <AffiliateDashMockForm
+              loading={affiliateDashMutation.isPending}
+              onSubmit={(values) => affiliateDashMutation.mutate(values)}
+            />
+          </Card>
+        </Col>
+
         <Col xs={24}>
-          <Card title="3. 模拟 91 查单（open-91/query）" bordered={false}>
+          <Card title="4. 模拟 91 查单（open-91/query）" bordered={false}>
             <Form
               layout="inline"
               initialValues={{ orderNo: defaultOrderNo, execute: '1' }}
@@ -428,3 +449,70 @@ function FeifeiMockForm({
     </Form>
   )
 }
+
+function AffiliateDashMockForm({
+  loading,
+  onSubmit,
+}: {
+  loading: boolean
+  onSubmit: (values: Record<string, unknown>) => void
+}) {
+  const [form] = Form.useForm()
+  const step = Form.useWatch('step', form)
+  const uidRequired = step !== 'uid'
+
+  return (
+    <Form
+      form={form}
+      layout="vertical"
+      initialValues={{
+        step: 'bind',
+        uid: '166909256',
+        productName: '幸运币90个',
+        productSku: 'lucky_coin_x90',
+      }}
+      onFinish={onSubmit}
+    >
+      <Form.Item label="页面步骤" name="step">
+        <Select
+          options={[
+            { value: 'uid', label: 'uid · 待填 UID（第一步）' },
+            { value: 'bind', label: 'bind · 已填 UID + mock 绑定二维码（第二步，推荐）' },
+            { value: 'submitted', label: 'submitted · 已绑定待提交发货（第三步）' },
+            { value: 'completed', label: 'completed · 模拟发货成功（第四步）' },
+            { value: 'failed', label: 'failed · 模拟发货失败' },
+          ]}
+        />
+      </Form.Item>
+      <Form.Item
+        label="游戏 UID"
+        name="uid"
+        required={uidRequired}
+        rules={
+          uidRequired
+            ? [{ required: true, whitespace: true, message: '后续步骤请填写游戏 UID' }]
+            : []
+        }
+        extra={
+          step === 'uid'
+            ? '「待填 UID」步骤可不填，打开领取页会停留在第一步让用户填写'
+            : '后续步骤用于模拟已提交的编号'
+        }
+      >
+        <Input allowClear placeholder="166909256" />
+      </Form.Item>
+      <Form.Item label="商品名" name="productName">
+        <Input />
+      </Form.Item>
+      <Form.Item label="affiliate-dash sku（可空）" name="productSku">
+        <Input placeholder="lucky_coin_x90" />
+      </Form.Item>
+      <Form.Item label="订单号 orderNo（可空）" name="orderNo">
+        <Input placeholder="留空自动 MOCKAD…" />
+      </Form.Item>
+      <Button type="primary" htmlType="submit" loading={loading} block>
+        生成 affiliate-dash Mock
+      </Button>
+    </Form>
+  )
+}