商户管理优化, 商户只能上架下架, 管理员可以编辑

frontend/src/pages/MerchantCenter.tsx

@@ -113,8 +113,6 @@ export default function MerchantCenter({ fixedTab, title = '商户中心' }: Mer
   const [callback, setCallback] = useState<CallbackSubscription | null>(null)
   const [members, setMembers] = useState<MerchantMember[]>([])
   const [loading, setLoading] = useState(false)
-  const [productOpen, setProductOpen] = useState(false)
-  const [editingProduct, setEditingProduct] = useState<MerchantProduct | null>(null)
   const [apiClientOpen, setApiClientOpen] = useState(false)
   const [apiCredential, setApiCredential] = useState<ApiCredential | null>(null)
   const [callbackCredential, setCallbackCredential] = useState<CallbackCredential | null>(null)
@@ -123,7 +121,6 @@ export default function MerchantCenter({ fixedTab, title = '商户中心' }: Mer
   const [testOrderProducts, setTestOrderProducts] = useState<MerchantProduct[]>([])
   const [testOrderProductsLoading, setTestOrderProductsLoading] = useState(false)
   const [testOrderResult, setTestOrderResult] = useState<CreateTestOrderResult | null>(null)
-  const [productForm] = Form.useForm()
   const [walletFilterForm] = Form.useForm()
   const [apiClientForm] = Form.useForm()
   const [callbackForm] = Form.useForm()
@@ -295,45 +292,13 @@ export default function MerchantCenter({ fixedTab, title = '商户中心' }: Mer
     }
   }, [activeTab, routeTab])
 
-  const openProductCreate = () => {
-    setEditingProduct(null)
-    productForm.resetFields()
-    productForm.setFieldsValue({
-      currency: 'POINT',
-      stock: -1,
-      status: 'active',
-      price_amount: 0,
-      cost_amount: 0,
-    })
-    setProductOpen(true)
-  }
-
-  const openProductEdit = (record: MerchantProduct) => {
-    setEditingProduct(record)
-    productForm.setFieldsValue({
-      ...record,
-    })
-    setProductOpen(true)
-  }
-
-  const submitProduct = async () => {
-    const values = await productForm.validateFields()
-    try {
-      const payload = {
-        ...values,
-      }
-      if (editingProduct) {
-        await merchantApi.updateProduct(editingProduct.id, payload)
-        message.success('商品已更新')
-      } else {
-        await merchantApi.createProduct(payload)
-        message.success('商品已创建')
-      }
-      setProductOpen(false)
-      loadProducts()
-    } catch (e) {
-      message.error(e instanceof Error ? e.message : '保存失败')
-    }
+  const openProductToggle = (record: MerchantProduct) => {
+    merchantApi.updateProductStatus(record.id, record.status === 'active' ? 'inactive' : 'active')
+      .then(() => {
+        message.success(record.status === 'active' ? '商品已下架，商户无法再下单' : '商品已上架')
+        loadProducts()
+      })
+      .catch((e) => message.error(e instanceof Error ? e.message : '操作失败'))
   }
 
   const handleWalletFilter = async () => {
@@ -542,7 +507,16 @@ export default function MerchantCenter({ fixedTab, title = '商户中心' }: Mer
       width: 90,
       fixed: 'right',
       render: (_, record) => canManage ? (
-        <Button type="link" size="small" onClick={() => openProductEdit(record)}>编辑</Button>
+        <Popconfirm
+          title={record.status === 'active' ? '下架该商品？' : '上架该商品？'}
+          description={record.status === 'active' ? '下架后商户将无法再创建该商品订单' : '上架后商户可正常下单'}
+          okText="确认"
+          onConfirm={() => openProductToggle(record)}
+        >
+          <Button type="link" size="small">
+            {record.status === 'active' ? '下架' : '上架'}
+          </Button>
+        </Popconfirm>
       ) : '-',
     },
   ]
@@ -646,16 +620,11 @@ export default function MerchantCenter({ fixedTab, title = '商户中心' }: Mer
       <Card size="small" style={{ background: '#f8fafc', border: '1px solid #e2e8f0', borderRadius: 8 }}>
         <div style={{ display: 'flex', alignItems: 'center', justifyContent: 'space-between' }}>
           <div>
-            <span style={{ fontWeight: 600, color: '#0f172a', marginRight: 8 }}>商品上架与定额售价管理</span>
+            <span style={{ fontWeight: 600, color: '#0f172a', marginRight: 8 }}>商品上架与售卖管理</span>
             <Typography.Text type="secondary" style={{ fontSize: 13 }}>
-              通用皮肤与游戏道具通过唯一的商户 SKU 进行对外销售与统一发货。
+              商户可自主上架/下架商品；下架后不可再创建该商品订单。
             </Typography.Text>
           </div>
-          {canManage && (
-            <Button type="primary" icon={<PlusOutlined />} onClick={openProductCreate}>
-              新增商品
-            </Button>
-          )}
         </div>
       </Card>
       <Table
@@ -1005,7 +974,7 @@ export default function MerchantCenter({ fixedTab, title = '商户中心' }: Mer
   )
 
   const tabItems = [
-    { key: 'products', label: '商品', disabled: !hasFeature('products'), children: productContent },
+    { key: 'products', label: '商品列表', disabled: !hasFeature('products'), children: productContent },
     { key: 'orders', label: '发货订单', disabled: !hasFeature('orders'), children: orderContent },
     { key: 'wallet', label: '钱包', disabled: !hasFeature('wallet'), children: walletContent },
     { key: 'api', label: 'API 密钥', disabled: !hasFeature('api'), children: apiKeyContent },
@@ -1035,56 +1004,6 @@ export default function MerchantCenter({ fixedTab, title = '商户中心' }: Mer
         />
       )}
 
-      <Modal title={editingProduct ? '编辑商品' : '新增商品'} open={productOpen} onOk={submitProduct} onCancel={() => setProductOpen(false)} destroyOnClose width={620}>
-        <Form form={productForm} layout="vertical" style={{ marginTop: 16 }}>
-          {!editingProduct && (
-            <>
-              <Form.Item name="product_code" label="目录编码">
-                <Input placeholder="已有目录编码可选填" />
-              </Form.Item>
-              <Form.Item name="product_name" label="商品名称" rules={[{ required: true }]}>
-                <Input />
-              </Form.Item>
-            </>
-          )}
-          <Space size="middle" style={{ width: '100%' }}>
-            <Form.Item name="sku" label="商户 SKU" rules={[{ required: true }]} style={{ width: 280 }}>
-              <Input disabled={!!editingProduct} />
-            </Form.Item>
-            <Form.Item name="display_name" label="展示名" style={{ width: 280 }}>
-              <Input />
-            </Form.Item>
-          </Space>
-          <Space size="middle" style={{ width: '100%' }}>
-            <Form.Item name="price_amount" label="售价（积分）" rules={[{ required: true }]} style={{ width: 180 }}>
-              <InputNumber min={0} precision={0} style={{ width: '100%' }} />
-            </Form.Item>
-            <Form.Item name="cost_amount" label="成本（积分）" style={{ width: 180 }}>
-              <InputNumber min={0} precision={0} style={{ width: '100%' }} />
-            </Form.Item>
-            <Form.Item name="currency" label="币种" style={{ width: 180 }}>
-              <Select options={[{ value: 'POINT', label: 'POINT（积分）' }]} />
-            </Form.Item>
-          </Space>
-          <Space size="middle" style={{ width: '100%' }}>
-            <Form.Item name="stock" label="库存（-1 无限）" style={{ width: 180 }}>
-              <InputNumber style={{ width: '100%' }} />
-            </Form.Item>
-            <Form.Item name="status" label="状态" style={{ width: 180 }}>
-              <Select options={[{ value: 'active', label: '上架' }, { value: 'inactive', label: '下架' }]} />
-            </Form.Item>
-            {!editingProduct && (
-              <Form.Item name="category" label="品类" style={{ width: 180 }}>
-                <Input />
-              </Form.Item>
-            )}
-          </Space>
-          <Form.Item name="fulfillment_config" label="发货配置">
-            <Input.TextArea rows={3} placeholder='{"provider":"manual"}' />
-          </Form.Item>
-        </Form>
-      </Modal>
-
       <Modal title="创建测试订单" open={testOrderOpen} onOk={submitTestOrder} onCancel={() => setTestOrderOpen(false)} destroyOnClose width={560}>
         <Form form={testOrderForm} layout="vertical" style={{ marginTop: 16 }}>
           <Form.Item name="sku" label="商品皮肤" rules={[{ required: true, message: '请选择商品' }]}>

frontend/src/pages/PlatformMerchants.tsx

@@ -45,9 +45,13 @@ export default function PlatformMerchants() {
   const [adjustLoading, setAdjustLoading] = useState(false)
   const [adjustSubmitting, setAdjustSubmitting] = useState(false)
   const [adjustWallet, setAdjustWallet] = useState<WalletAccount | null>(null)
+  const [editProduct, setEditProduct] = useState<ProductCatalogItem | null>(null)
+  const [editProductOpen, setEditProductOpen] = useState(false)
+  const [editProductSubmitting, setEditProductSubmitting] = useState(false)
   const [createForm] = Form.useForm()
   const [settingsForm] = Form.useForm()
   const [adjustForm] = Form.useForm()
+  const [editProductForm] = Form.useForm()
 
   const load = useCallback(async (page = data.page, size = data.size) => {
     setLoading(true)
@@ -184,6 +188,42 @@ export default function PlatformMerchants() {
     }
   }
 
+  const openProductEdit = (record: ProductCatalogItem) => {
+    setEditProduct(record)
+    editProductForm.resetFields()
+    editProductForm.setFieldsValue({
+      display_name: record.display_name,
+      price_amount: record.price_amount,
+      cost_amount: record.cost_amount,
+      stock: record.stock,
+      status: record.status,
+    })
+    setEditProductOpen(true)
+  }
+
+  const submitProductEdit = async () => {
+    if (!selectedMerchant || !editProduct) return
+    const values = await editProductForm.validateFields()
+    setEditProductSubmitting(true)
+    try {
+      await platformApi.updateMerchantProduct(selectedMerchant.id, editProduct.id, {
+        display_name: values.display_name,
+        price_amount: Number(values.price_amount || 0),
+        cost_amount: Number(values.cost_amount || 0),
+        stock: Number(values.stock ?? -1),
+        status: values.status,
+      })
+      message.success('商品已更新')
+      setEditProductOpen(false)
+      const productsData = await platformApi.merchantProducts(selectedMerchant.id)
+      setMerchantProducts(productsData || [])
+    } catch (e) {
+      message.error(e instanceof Error ? e.message : '保存失败')
+    } finally {
+      setEditProductSubmitting(false)
+    }
+  }
+
   const columns: ColumnsType<Merchant> = [
     { title: 'ID', dataIndex: 'id', width: 70, align: 'center' },
     { title: '编码', dataIndex: 'code', width: 160, render: (v) => <Typography.Text code copyable={{ text: v }}>{v}</Typography.Text> },
@@ -515,6 +555,14 @@ export default function PlatformMerchants() {
                     width: 80,
                     render: (v) => (v === 'active' ? <Tag color="green">上架</Tag> : <Tag>下架</Tag>),
                   },
+                  {
+                    title: '操作',
+                    key: 'action',
+                    width: 60,
+                    render: (_, record: ProductCatalogItem) => (
+                      <Button type="link" size="small" onClick={() => openProductEdit(record)}>编辑</Button>
+                    ),
+                  },
                 ]}
               />
             </Checkbox.Group>
@@ -524,6 +572,40 @@ export default function PlatformMerchants() {
           </Space>
         </Spin>
       </Modal>
+
+      <Modal
+        title={editProduct ? `编辑商品：${editProduct.sku}` : '编辑商品'}
+        open={editProductOpen}
+        onOk={submitProductEdit}
+        onCancel={() => setEditProductOpen(false)}
+        destroyOnClose
+        width={560}
+        confirmLoading={editProductSubmitting}
+        okText="保存"
+      >
+        <Form form={editProductForm} layout="vertical" style={{ marginTop: 16 }}>
+          <Form.Item name="display_name" label="展示名">
+            <Input maxLength={160} />
+          </Form.Item>
+          <Space size="middle" style={{ width: '100%' }}>
+            <Form.Item name="price_amount" label="售价（积分）" rules={[{ required: true }]} style={{ width: 160 }}>
+              <InputNumber min={0} precision={0} style={{ width: '100%' }} />
+            </Form.Item>
+            <Form.Item name="cost_amount" label="成本（积分）" rules={[{ required: true }]} style={{ width: 160 }}>
+              <InputNumber min={0} precision={0} style={{ width: '100%' }} />
+            </Form.Item>
+            <Form.Item name="stock" label="库存（-1 无限）" style={{ width: 160 }}>
+              <InputNumber min={-1} precision={0} style={{ width: '100%' }} />
+            </Form.Item>
+          </Space>
+          <Form.Item name="status" label="状态" rules={[{ required: true }]}>
+            <Select options={[{ value: 'active', label: '上架' }, { value: 'inactive', label: '下架' }]} />
+          </Form.Item>
+          <Typography.Text type="secondary">
+            下架后商户将无法再创建该商品订单；价格/成本调整立即对后续订单生效。
+          </Typography.Text>
+        </Form>
+      </Modal>
     </div>
   )
 }