feat(admin): show HQ product list as SPU with expandable SKUs

Group catalog rows by product, add paid bottle sales, and keep multi-SKU fulfillment on SKU rows only.

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

apps/admin-web/src/components/ProductSpecsEditor.tsx

@@ -1,10 +1,11 @@
 import { useMemo, useState } from 'react';
 import {
-  Button, Input, InputNumber, Radio, Select, Space, Switch, Table, Typography, message,
+  Button, Image, Input, InputNumber, Modal, Radio, Select, Space, Switch, Table, Typography, message,
 } from 'antd';
-import { MinusCircleOutlined, PlusOutlined } from '@ant-design/icons';
+import { EditOutlined, MinusCircleOutlined, PlusOutlined } from '@ant-design/icons';
 import { request } from '../lib/api';
 import { PRODUCT_STATUS_LABELS } from '../lib/constants';
+import OssUpload from './OssUpload';
 
 type SpecValue = { id?: string; name: string; sortOrder?: number };
 type SpecAttr = { id?: string; name: string; sortOrder?: number; values: SpecValue[] };
@@ -24,6 +25,7 @@ type SkuRow = {
   isDefault: boolean;
   sortOrder?: number;
   specText?: string;
+  imageUrl?: string | null;
 };
 
 function cartesian(attrs: SpecAttr[]): string[][] {
@@ -73,6 +75,7 @@ export default function ProductSpecsEditor({ productId, initialAttrs, initialSku
           saleUnit: s.saleUnit === 'BOX' ? 'BOX' : 'BOTTLE',
           bottlesPerUnit: s.bottlesPerUnit || (s.saleUnit === 'BOX' ? 6 : 1),
           isDefault: !!s.isDefault,
+          imageUrl: s.imageUrl ?? '',
         }))
       : [
           {
@@ -86,10 +89,12 @@ export default function ProductSpecsEditor({ productId, initialAttrs, initialSku
             saleUnit: 'BOTTLE',
             bottlesPerUnit: 1,
             isDefault: true,
+            imageUrl: '',
           },
         ],
   );
   const [saving, setSaving] = useState(false);
+  const [editIndex, setEditIndex] = useState<number | null>(null);
 
   const combos = useMemo(() => cartesian(attrs.filter((a) => a.name.trim() && a.values.some((v) => v.name.trim()))), [attrs]);
 
@@ -111,12 +116,21 @@ export default function ProductSpecsEditor({ productId, initialAttrs, initialSku
         bottlesPerUnit: 1,
         isDefault: i === 0,
         sortOrder: i,
+        imageUrl: '',
       };
     });
     if (next.length && !next.some((s) => s.isDefault)) next[0].isDefault = true;
     setSkus(next.length ? next : skus);
   }
 
+  function patchSku(index: number, patch: Partial<SkuRow>) {
+    setSkus((prev) => {
+      const next = [...prev];
+      next[index] = { ...next[index], ...patch };
+      return next;
+    });
+  }
+
   async function handleSave() {
     setSaving(true);
     try {
@@ -168,6 +182,7 @@ export default function ProductSpecsEditor({ productId, initialAttrs, initialSku
         bottlesPerUnit: s.saleUnit === 'BOX' ? s.bottlesPerUnit || 6 : 1,
         isDefault: !!s.isDefault,
         sortOrder: i,
+        imageUrl: s.imageUrl?.trim() || null,
       }));
 
       const barcodes = payloadSkus.map((row) => row.barcode69);
@@ -189,11 +204,13 @@ export default function ProductSpecsEditor({ productId, initialAttrs, initialSku
     }
   }
 
+  const editing = editIndex != null ? skus[editIndex] : null;
+
   return (
     <div>
       <Typography.Paragraph type="secondary">
-        SKU 码由系统自动生成（DK 开头），无需填写。每个规格必须填写<strong>互不相同</strong>的 69 码。
+        SKU 码由系统自动生成（DK 开头），无需填写。每个规格必须填写<strong>互不相同</strong>的 69 码，并可单独上传主图。
-        先配置销售规格轴（如「包装」），再生成 SKU 矩阵；未配置规格时仅保留默认一行。
+        点「填写」在弹窗中编辑。先配置销售规格轴（如「包装」），再生成 SKU 矩阵。
       </Typography.Paragraph>
 
       <Typography.Title level={5}>规格轴</Typography.Title>
@@ -446,12 +463,154 @@ export default function ProductSpecsEditor({ productId, initialAttrs, initialSku
               />
             ),
           },
+          {
+            title: '主图',
+            width: 72,
+            render: (_, row) =>
+              row.imageUrl ? (
+                <Image src={row.imageUrl} width={40} height={40} style={{ objectFit: 'cover', borderRadius: 4 }} />
+              ) : (
+                <Typography.Text type="secondary">无</Typography.Text>
+              ),
+          },
+          {
+            title: '编辑',
+            width: 80,
+            fixed: 'right',
+            render: (_, row, index) => (
+              <Button type="link" size="small" icon={<EditOutlined />} onClick={() => setEditIndex(index)}>
+                填写
+              </Button>
+            ),
+          },
         ]}
       />
 
       <Button type="primary" loading={saving} style={{ marginTop: 16 }} onClick={() => void handleSave()}>
         保存规格与 SKU
       </Button>
+
+      <Modal
+        title={`编辑规格${editing?.specText ? ` · ${editing.specText}` : editing?.skuCode ? ` · ${editing.skuCode}` : ''}`}
+        open={editIndex != null}
+        onCancel={() => setEditIndex(null)}
+        onOk={() => setEditIndex(null)}
+        okText="完成"
+        width={560}
+        destroyOnClose
+      >
+        {editing && editIndex != null ? (
+          <Space direction="vertical" size={14} style={{ width: '100%' }}>
+            <div>
+              <Typography.Text type="secondary">SKU</Typography.Text>
+              <div>{editing.skuCode || '保存后自动生成'}</div>
+            </div>
+            <div>
+              <Typography.Text>69 码 <Typography.Text type="danger">*</Typography.Text></Typography.Text>
+              <Input
+                placeholder="本规格独立 69 码"
+                value={editing.barcode69}
+                onChange={(e) => patchSku(editIndex, { barcode69: e.target.value })}
+              />
+            </div>
+            <div>
+              <Typography.Text>主图</Typography.Text>
+              <OssUpload
+                bizType="COVER"
+                value={editing.imageUrl || ''}
+                onChange={(url) => patchSku(editIndex, { imageUrl: url })}
+              />
+            </div>
+            <Space>
+              <div>
+                <Typography.Text>售价</Typography.Text>
+                <InputNumber
+                  min={0}
+                  style={{ width: 140 }}
+                  value={editing.price}
+                  onChange={(v) => patchSku(editIndex, { price: Number(v) || 0 })}
+                />
+              </div>
+              <div>
+                <Typography.Text>权益</Typography.Text>
+                <InputNumber
+                  min={0}
+                  style={{ width: 140 }}
+                  value={editing.benefitAmount}
+                  onChange={(v) => patchSku(editIndex, { benefitAmount: v == null ? undefined : Number(v) })}
+                />
+              </div>
+            </Space>
+            <div>
+              <Typography.Text>状态</Typography.Text>
+              <Select
+                style={{ width: '100%' }}
+                value={editing.status}
+                options={Object.entries(PRODUCT_STATUS_LABELS).map(([value, label]) => ({ value, label }))}
+                onChange={(status) => patchSku(editIndex, { status })}
+              />
+            </div>
+            <Space>
+              <Select
+                style={{ width: 100 }}
+                value={editing.saleUnit}
+                options={[
+                  { value: 'BOTTLE', label: '瓶' },
+                  { value: 'BOX', label: '箱' },
+                ]}
+                onChange={(saleUnit) =>
+                  patchSku(editIndex, {
+                    saleUnit,
+                    bottlesPerUnit: saleUnit === 'BOX' ? editing.bottlesPerUnit || 6 : 1,
+                  })
+                }
+              />
+              {editing.saleUnit === 'BOX' ? (
+                <InputNumber
+                  min={1}
+                  value={editing.bottlesPerUnit}
+                  onChange={(v) => patchSku(editIndex, { bottlesPerUnit: Number(v) || 6 })}
+                />
+              ) : null}
+            </Space>
+            <Space>
+              <Switch
+                checkedChildren="线上"
+                unCheckedChildren="线上"
+                checked={editing.allowOnlinePurchase}
+                onChange={(checked) =>
+                  patchSku(editIndex, {
+                    allowOnlinePurchase: checked,
+                    allowCrossCityDelivery: checked ? editing.allowCrossCityDelivery : false,
+                  })
+                }
+              />
+              <Switch
+                checkedChildren="跨城"
+                unCheckedChildren="跨城"
+                disabled={!editing.allowOnlinePurchase}
+                checked={editing.allowCrossCityDelivery}
+                onChange={(checked) => patchSku(editIndex, { allowCrossCityDelivery: checked })}
+              />
+              <Switch
+                checkedChildren="现场"
+                unCheckedChildren="现场"
+                checked={editing.allowOnSitePickup}
+                onChange={(checked) => patchSku(editIndex, { allowOnSitePickup: checked })}
+              />
+              <Switch
+                checkedChildren="默认"
+                unCheckedChildren="默认"
+                checked={editing.isDefault}
+                onChange={(checked) => {
+                  if (!checked) return;
+                  setSkus((prev) => prev.map((s, i) => ({ ...s, isDefault: i === editIndex })));
+                }}
+              />
+            </Space>
+          </Space>
+        ) : null}
+      </Modal>
     </div>
   );
 }

apps/admin-web/src/pages/ProductsPage.tsx

@@ -21,6 +21,22 @@ type ProductDetailContentDto = {
   features?: Array<{ icon: string; title: string; desc: string }>;
 };
 
+type SkuListRow = {
+  id: string;
+  skuCode: string;
+  barcode69: string;
+  specText: string;
+  price: number;
+  benefitAmount: number;
+  status: string;
+  isDefault?: boolean;
+  allowOnSitePickup?: boolean;
+  allowOnlinePurchase?: boolean;
+  allowCrossCityDelivery?: boolean;
+  soldBottles?: number;
+  virtual?: boolean;
+};
+
 type Row = {
   id: string;
   skuCode: string;
@@ -30,9 +46,15 @@ type Row = {
   aromaType: string;
   spec: string;
   price: number;
+  priceMin?: number;
+  priceMax?: number;
+  soldBottles?: number;
   benefitAmount: number;
   status: string;
   sortOrder: number;
+  skuCount?: number;
+  specEnabled?: boolean;
+  skus?: SkuListRow[];
   allowOnSitePickup?: boolean;
   allowOnlinePurchase?: boolean;
   allowCrossCityDelivery?: boolean;
@@ -214,7 +236,33 @@ function VisibilityWhitelistFields({ form }: { form: FormInstance }) {
   );
 }
 
-function BaseInfoFields({ mode, form }: { mode: 'create' | 'edit'; form: FormInstance }) {
+function FulfillmentTags(row: {
+  allowOnlinePurchase?: boolean;
+  allowCrossCityDelivery?: boolean;
+  allowOnSitePickup?: boolean;
+}) {
+  return (
+    <Space size={[0, 4]} wrap>
+      {row.allowOnlinePurchase !== false ? <Tag color="blue">线上</Tag> : null}
+      {row.allowOnlinePurchase !== false && row.allowCrossCityDelivery !== false ? (
+        <Tag color="cyan">跨城</Tag>
+      ) : null}
+      {row.allowOnSitePickup ? <Tag color="green">现场</Tag> : null}
+      {row.allowOnlinePurchase === false && !row.allowOnSitePickup ? <Tag>无</Tag> : null}
+    </Space>
+  );
+}
+
+function BaseInfoFields({
+  mode,
+  form,
+  hideFulfillment,
+}: {
+  mode: 'create' | 'edit';
+  form: FormInstance;
+  /** 多规格商品：履约只在规格 SKU 上编辑 */
+  hideFulfillment?: boolean;
+}) {
   return (
     <>
       {mode === 'create' && (
@@ -256,39 +304,47 @@ function BaseInfoFields({ mode, form }: { mode: 'create' | 'edit'; form: FormIns
       <Form.Item name="sortOrder" label="排序">
         <InputNumber min={0} style={{ width: '100%' }} />
       </Form.Item>
-      <Form.Item
+      {hideFulfillment ? (
-        name="allowOnlinePurchase"
+        <Typography.Paragraph type="secondary" style={{ marginBottom: 16 }}>
-        label="允许线上购买"
+          该商品有多种规格，履约（线上 / 跨城 / 现场）请到「规格与 SKU」中按规格设置。
-        valuePropName="checked"
+        </Typography.Paragraph>
-        extra="配送到址（同城）"
+      ) : (
-      >
+        <>
-        <Switch
-          checkedChildren="开"
-          unCheckedChildren="关"
-          onChange={(checked) => {
-            if (!checked) form.setFieldsValue({ allowCrossCityDelivery: false });
-          }}
-        />
-      </Form.Item>
-      <Form.Item noStyle shouldUpdate={(prev, cur) => prev.allowOnlinePurchase !== cur.allowOnlinePurchase}>
-        {() => (
           <Form.Item
-            name="allowCrossCityDelivery"
+            name="allowOnlinePurchase"
-            label="允许跨城配送"
+            label="允许线上购买"
             valuePropName="checked"
-            extra="须先开启线上购买"
+            extra="配送到址（同城）"
           >
             <Switch
               checkedChildren="开"
               unCheckedChildren="关"
-              disabled={!form.getFieldValue('allowOnlinePurchase')}
+              onChange={(checked) => {
+                if (!checked) form.setFieldsValue({ allowCrossCityDelivery: false });
+              }}
             />
           </Form.Item>
-        )}
+          <Form.Item noStyle shouldUpdate={(prev, cur) => prev.allowOnlinePurchase !== cur.allowOnlinePurchase}>
-      </Form.Item>
+            {() => (
-      <Form.Item name="allowOnSitePickup" label="允许现场取货" valuePropName="checked">
+              <Form.Item
-        <Switch checkedChildren="开" unCheckedChildren="关" />
+                name="allowCrossCityDelivery"
-      </Form.Item>
+                label="允许跨城配送"
+                valuePropName="checked"
+                extra="须先开启线上购买"
+              >
+                <Switch
+                  checkedChildren="开"
+                  unCheckedChildren="关"
+                  disabled={!form.getFieldValue('allowOnlinePurchase')}
+                />
+              </Form.Item>
+            )}
+          </Form.Item>
+          <Form.Item name="allowOnSitePickup" label="允许现场取货" valuePropName="checked">
+            <Switch checkedChildren="开" unCheckedChildren="关" />
+          </Form.Item>
+        </>
+      )}
       <VisibilityWhitelistFields form={form} />
       <Form.Item name="coverUrl" label="封面">
         <OssUpload bizType="COVER" mediaType="IMAGE" />
@@ -332,12 +388,35 @@ export default function ProductsPage() {
   }
 
   const columns: ColumnsType<Row> = useMemo(() => [
-    { title: 'SKU', dataIndex: 'skuCode', width: 90 },
-    { title: '商品名', dataIndex: 'name', width: 180, ellipsis: true },
     { title: '香型', dataIndex: 'aromaType', width: 80, render: (v) => AROMA_TYPE_LABELS[v] || v },
-    { title: '规格', dataIndex: 'spec', width: 120, ellipsis: true },
+    { title: '品名', dataIndex: 'name', width: 200, ellipsis: true },
-    { title: '售价', dataIndex: 'price', width: 80, render: (v) => `¥${v}` },
+    {
-    { title: '权益额', dataIndex: 'benefitAmount', width: 80, render: (v) => `¥${v}` },
+      title: '累计销售',
+      dataIndex: 'soldBottles',
+      width: 110,
+      render: (v: number | undefined) => `累计 ${v ?? 0} 瓶`,
+    },
+    {
+      title: '售价',
+      key: 'priceRange',
+      width: 120,
+      render: (_, row) => {
+        const min = row.priceMin ?? row.price;
+        const max = row.priceMax ?? row.price;
+        if (min === max) return `¥${min}`;
+        return `¥${min} ~ ¥${max}`;
+      },
+    },
+    {
+      title: '规格数',
+      dataIndex: 'skuCount',
+      width: 80,
+      render: (v: number | undefined, row) => {
+        const real = v ?? 0;
+        if (real > 0) return real;
+        return row.skus?.some((s) => s.virtual) ? 1 : 0;
+      },
+    },
     { title: '状态', dataIndex: 'status', width: 80, render: (s) => (
       <Tag color={s === 'ON_SALE' ? 'green' : undefined}>{PRODUCT_STATUS_LABELS[s] || s}</Tag>
     ) },
@@ -348,23 +427,7 @@ export default function ProductsPage() {
       render: (v: boolean) =>
         v ? <Tag color="orange">限测</Tag> : <Tag>公开</Tag>,
     },
-    {
-      title: '履约',
-      key: 'fulfillment',
-      width: 160,
-      render: (_, row) => (
-        <Space size={[0, 4]} wrap>
-          {row.allowOnlinePurchase !== false ? <Tag color="blue">线上</Tag> : null}
-          {row.allowOnlinePurchase !== false && row.allowCrossCityDelivery !== false ? (
-            <Tag color="cyan">跨城</Tag>
-          ) : null}
-          {row.allowOnSitePickup ? <Tag color="green">现场</Tag> : null}
-          {row.allowOnlinePurchase === false && !row.allowOnSitePickup ? <Tag>无</Tag> : null}
-        </Space>
-      ),
-    },
     { title: '排序', dataIndex: 'sortOrder', width: 60 },
-    { title: '创建', dataIndex: 'createdAt', width: 160, render: fmtTime },
     {
       title: '操作', width: 120,
       render: (_, row) => (
@@ -377,7 +440,7 @@ export default function ProductsPage() {
           }}>编辑</Button>
           <Popconfirm
             title="确认删除该商品？"
-            description={`将永久删除「${row.name}」（${row.skuCode}），此操作不可恢复。`}
+            description={`将永久删除「${row.name}」，此操作不可恢复。`}
             okText="确认删除"
             cancelText="取消"
             okButtonProps={{ danger: true }}
@@ -390,6 +453,46 @@ export default function ProductsPage() {
     },
   ], [detail, editForm]);
 
+  const skuColumns: ColumnsType<SkuListRow> = useMemo(() => [
+    {
+      title: '规格',
+      dataIndex: 'specText',
+      width: 140,
+      ellipsis: true,
+      render: (v: string, row) => (
+        <Space size={4}>
+          <span>{v || '默认'}</span>
+          {row.isDefault ? <Tag color="blue">默认</Tag> : null}
+          {row.virtual ? <Tag>未建SKU</Tag> : null}
+        </Space>
+      ),
+    },
+    { title: 'SKU', dataIndex: 'skuCode', width: 110 },
+    { title: '69码', dataIndex: 'barcode69', width: 160, ellipsis: true },
+    { title: '售价', dataIndex: 'price', width: 90, render: (v) => `¥${v}` },
+    { title: '权益额', dataIndex: 'benefitAmount', width: 90, render: (v) => `¥${v}` },
+    {
+      title: '累计销售',
+      dataIndex: 'soldBottles',
+      width: 100,
+      render: (v: number | undefined) => `${v ?? 0} 瓶`,
+    },
+    {
+      title: '履约',
+      key: 'fulfillment',
+      width: 160,
+      render: (_, row) => <FulfillmentTags {...row} />,
+    },
+    {
+      title: '状态',
+      dataIndex: 'status',
+      width: 90,
+      render: (s) => (
+        <Tag color={s === 'ON_SALE' ? 'green' : undefined}>{PRODUCT_STATUS_LABELS[s] || s}</Tag>
+      ),
+    },
+  ], []);
+
   return (
     <div>
       <Space style={{ marginBottom: 16, width: '100%', justifyContent: 'space-between' }}>
@@ -397,7 +500,9 @@ export default function ProductsPage() {
         <Button type="primary" onClick={() => setCreateOpen(true)}>新建商品</Button>
       </Space>
       <Form form={form} layout="inline" style={{ marginBottom: 16 }} onFinish={(v) => { setFilters(v); setPage(1); }}>
-        <Form.Item name="name" label="名称"><Input allowClear /></Form.Item>
+        <Form.Item name="name" label="名称">
+          <Input allowClear placeholder="名称 / SKU / 69 码" style={{ width: 200 }} />
+        </Form.Item>
         <Form.Item name="status" label="状态">
           <Select allowClear style={{ width: 110 }} options={Object.entries(PRODUCT_STATUS_LABELS).map(([value, label]) => ({ value, label }))} />
         </Form.Item>
@@ -406,17 +511,46 @@ export default function ProductsPage() {
         </Form.Item>
         <Form.Item><Button type="primary" htmlType="submit">查询</Button></Form.Item>
       </Form>
-      <Table rowKey="id" className="admin-table-nowrap" loading={loading} columns={columns} dataSource={data?.items ?? []} scroll={{ x: 1320 }}
+      <Table
-        pagination={{ current: page, pageSize, total: data?.total ?? 0, showSizeChanger: true, onChange: (p, ps) => { setPage(p); setPageSize(ps); } }} />
+        rowKey="id"
-      <Drawer title="编辑商品" width={720} open={drawerOpen} onClose={() => setDrawerOpen(false)}
+        className="admin-table-nowrap"
+        loading={loading}
+        columns={columns}
+        dataSource={data?.items ?? []}
+        scroll={{ x: 1080 }}
+        expandable={{
+          rowExpandable: () => true,
+          expandedRowRender: (row) => (
+            <div style={{ margin: '-8px -8px -8px 24px', padding: 12, background: '#f5f5f5', borderRadius: 6 }}>
+              <Table
+                size="small"
+                rowKey="id"
+                pagination={false}
+                columns={skuColumns}
+                dataSource={row.skus ?? []}
+                scroll={{ x: 980 }}
+                style={{ background: 'transparent' }}
+              />
+            </div>
+          ),
+        }}
+        pagination={{ current: page, pageSize, total: data?.total ?? 0, showSizeChanger: true, onChange: (p, ps) => { setPage(p); setPageSize(ps); } }}
+      />
+      <Drawer title="编辑商品" width={1100} open={drawerOpen} onClose={() => setDrawerOpen(false)}
         extra={detail && (
           <Button type="primary" onClick={async () => {
             const v = await editForm.validateFields();
-            if (!v.allowOnlinePurchase && !v.allowOnSitePickup) {
+            const multiSku = Array.isArray(detail.skus) && (detail.skus as unknown[]).length > 1;
+            if (!multiSku && !v.allowOnlinePurchase && !v.allowOnSitePickup) {
               message.error('请至少勾选「允许线上购买」或「允许现场取货」之一');
               return;
             }
             const payload = buildProductPayload(v);
+            if (multiSku) {
+              delete (payload as { allowOnlinePurchase?: boolean }).allowOnlinePurchase;
+              delete (payload as { allowCrossCityDelivery?: boolean }).allowCrossCityDelivery;
+              delete (payload as { allowOnSitePickup?: boolean }).allowOnSitePickup;
+            }
             await request(`/admin/products/${detail.id}`, { method: 'PUT', body: JSON.stringify(payload) });
             message.success('已保存');
             setDrawerOpen(false);
@@ -426,13 +560,24 @@ export default function ProductsPage() {
         {detail && (
           <>
             <Descriptions column={1} bordered size="small" style={{ marginBottom: 16 }}>
-              <Descriptions.Item label="SKU">{String(detail.skuCode)}（系统生成）</Descriptions.Item>
+              <Descriptions.Item label="默认 SKU">{String(detail.skuCode)}（系统生成）</Descriptions.Item>
               <Descriptions.Item label="默认 69 码">{String(detail.barcode69)}</Descriptions.Item>
               <Descriptions.Item label="香型">{AROMA_TYPE_LABELS[String(detail.aromaType)] || String(detail.aromaType)}</Descriptions.Item>
+              <Descriptions.Item label="创建时间">{fmtTime(String(detail.createdAt ?? ''))}</Descriptions.Item>
             </Descriptions>
             <Form form={editForm} layout="vertical">
               <Tabs items={[
-                { key: 'base', label: '基础信息', children: <BaseInfoFields mode="edit" form={editForm} /> },
+                {
+                  key: 'base',
+                  label: '基础信息',
+                  children: (
+                    <BaseInfoFields
+                      mode="edit"
+                      form={editForm}
+                      hideFulfillment={Array.isArray(detail.skus) && (detail.skus as unknown[]).length > 1}
+                    />
+                  ),
+                },
                 {
                   key: 'detail',
                   label: '详情页',

apps/mini-user/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@dukang/mini-user",
-  "version": "3.4.15",
+  "version": "3.5.4",
   "private": true,
   "description": "杜康好客 · C 端用户微信小程序（Taro）",
   "scripts": {

apps/mini-user/src/lib/client-version.ts

@@ -2,7 +2,7 @@ import Taro from '@tarojs/taro';
 import { fetchClientConfig } from './pay-wechat';
 
 /** 与 package.json version 同步，供服务端 minClientVersion 比对 */
-export const APP_VERSION = '3.4.15';
+export const APP_VERSION = '3.5.4';
 
 export const APP_VERSION_LABEL = `v${APP_VERSION}`;
 

apps/mini-user/src/pages/pay/index.tsx

@@ -16,10 +16,10 @@ import {
   saveWechatLoginResult,
 } from '../../lib/pay-wechat';
 import { applyWechatLoginResult } from '../../lib/wechat-auth';
-import { getBrandAssetsSync, loadBrandAssets } from '../../lib/brand-assets';
 import { isWechatEnv } from '../../lib/weixin';
 import { goLogin } from '../../lib/auth-nav';
 import { request, toast } from '../../lib/api';
+import payLogo from '../../assets/logo2.png';
 
 export default function PayPage() {
   const router = useRouter();
@@ -31,7 +31,6 @@ export default function PayPage() {
   const [orderNo, setOrderNo] = useState('');
   const [payAmount, setPayAmount] = useState('—');
   const [deliveryType, setDeliveryType] = useState('');
-  const [brandMarkUrl, setBrandMarkUrl] = useState(() => getBrandAssetsSync().brandLogoMarkUrl);
 
   const returnPath = orderId
     ? `/pages/pay/index?orderId=${orderId}`
@@ -51,10 +50,6 @@ export default function PayPage() {
     void refreshPayReadiness();
   });
 
-  useEffect(() => {
-    void loadBrandAssets().then((brand) => setBrandMarkUrl(brand.brandLogoMarkUrl));
-  }, []);
-
   useEffect(() => {
     if (!orderId) return;
     if (process.env.TARO_ENV === 'weapp') {
@@ -178,7 +173,7 @@ export default function PayPage() {
       <View className="sub-page-body">
         <View className="pay-status">
           <View className="pay-status-icon">
-            <Image className="pay-status-brand" src={brandMarkUrl} mode="aspectFit" />
+            <Image className="pay-status-brand" src={payLogo} mode="aspectFit" />
           </View>
           <Text className="pay-status-title">
             {needsWechatAuth ? '需完成微信授权' : '待支付'}

apps/mini-user/src/pages/product-detail/index.tsx

@@ -165,6 +165,12 @@ export default function ProductDetailPage() {
         allowOnSitePickup: activeSku.allowOnSitePickup,
       }
     : product;
+  const carouselImages = (() => {
+    const base = getProductCarouselImages(product);
+    const skuImg = activeSku?.imageUrl?.trim();
+    if (!skuImg) return base;
+    return [skuImg, ...base.filter((url) => url !== skuImg)];
+  })();
 
   const sharePayload = useMemo(
     () =>
@@ -172,9 +178,9 @@ export default function ProductDetailPage() {
         path: `/pages/product-detail/index?id=${productId}`,
         dynamicTitle: product?.name,
         dynamicDesc: product?.subtitle,
-        dynamicImageUrl: product ? getProductMainImage(product) : undefined,
+        dynamicImageUrl: (activeSku?.imageUrl?.trim() || (product ? getProductMainImage(product) : undefined)),
       }),
-    [product, productId],
+    [product, productId, activeSku],
   );
 
   useShareAppMessage(() => toWeappShareMessage(sharePayload));
@@ -249,7 +255,6 @@ export default function ProductDetailPage() {
 
   const allowOnline = canBuyOnline(fulfillment ?? {});
   const allowOnSite = canPickupOnSite(fulfillment ?? {});
-  const carouselImages = getProductCarouselImages(product);
   const detailImages = getProductDetailImages(product);
   const detail = product.detailContent ?? {};
   const features = detail.features ?? [];

apps/mini-user/src/pages/store-detail/index.tsx

@@ -1,5 +1,5 @@
 import { useCallback, useEffect, useMemo, useRef, useState } from 'react';
-import { View, Text, Image } from '@tarojs/components';
+import { View, Text, Image, ScrollView } from '@tarojs/components';
 import '../../styles/store-detail.css';
 import Taro, {
   useDidShow,
@@ -444,17 +444,19 @@ export default function StoreDetailPage() {
         </View>
       ) : null}
 
-      {intro ? (
+      {benefitRule ? (
         <View className="store-detail-section">
-          <Text className="store-detail-section-title">门店详情</Text>
+          <Text className="store-detail-section-title store-detail-section-title--rule">使用规则</Text>
-          <Text className="store-detail-intro">{intro}</Text>
+          <Text className="store-detail-intro">{benefitRule}</Text>
         </View>
       ) : null}
 
-      {benefitRule ? (
+      {intro ? (
         <View className="store-detail-section">
-          <Text className="store-detail-section-title">好客权益使用规则</Text>
+          <Text className="store-detail-section-title">门店详情</Text>
-          <Text className="store-detail-intro">{benefitRule}</Text>
+          <ScrollView className="store-detail-intro-scroll" scrollY showScrollbar>
+            <Text className="store-detail-intro">{intro}</Text>
+          </ScrollView>
         </View>
       ) : null}
 

apps/mini-user/src/styles/order.css

@@ -488,12 +488,10 @@
 }
 
 .pay-status-icon {
-  width: 72px;
+  width: 88px;
-  height: 72px;
+  height: 88px;
   border-radius: 50%;
-  background: rgba(166, 29, 36, 0.08);
+  background: #f7f4ee;
-  color: var(--color-heritage-red);
-  font-size: 36px;
   display: flex;
   align-items: center;
   justify-content: center;
@@ -502,8 +500,8 @@
 }
 
 .pay-status-brand {
-  width: 44px;
+  width: 72px;
-  height: 44px;
+  height: 72px;
 }
 
 .pay-status-title {

apps/mini-user/src/styles/product-detail.css

@@ -130,6 +130,7 @@
 
 .product-detail-promo {
   position: relative;
+  margin-top: 8px;
   padding: 16px;
   border-radius: var(--radius-lg);
   background: linear-gradient(135deg, #fff9e6 0%, #fff0c2 100%);
@@ -377,7 +378,7 @@
 }
 
 .product-detail-specs {
-  margin: 12px 0 4px;
+  margin: 16px 0 28px;
   display: flex;
   flex-direction: column;
   gap: 12px;

apps/mini-user/src/styles/store-detail.css

@@ -211,6 +211,17 @@
   color: var(--color-on-surface);
 }
 
+.store-detail-section-title--rule {
+  color: var(--color-heritage-red, #a61d24);
+}
+
+.store-detail-intro-scroll {
+  max-height: 168px;
+  height: 168px;
+  overflow-y: auto;
+  -webkit-overflow-scrolling: touch;
+}
+
 .store-detail-env-grid {
   display: flex;
   flex-direction: column;

docs/杜康好客-v3.5.4-开发文档.md

@@ -10,26 +10,51 @@
 | 1 | 数据模型 | `common_product_item` 升级为 SPU；新增 `spec_attr` / `spec_value` / `sku` / `sku_spec`；订单快照 `sku_id` / `sale_unit` / `bottles_per_unit` |
 | 2 | 存量迁移 | 每商品 1 个默认瓶装 SKU；SQL：`prisma/migrate-product-sku-v354.sql`；脚本：`prisma/backfill-product-skus.ts` |
 | 3 | Catalog | 列表附加 `specEnabled`/`saleUnit`；详情附加 `specAttrs`/`skus`/`defaultSkuId`；旧字段拍平保留 |
-| 4 | Trade | preview/create 可选 `skuId`；单可售 SKU 自动回落；起购按瓶当量 |
+| 4 | Trade | preview/create 可选 `skuId`；无 SKU 回落 SPU；有可售 SKU 用默认/唯一 |
-| 5 | Admin | `PUT /admin/products/:id/specs`、`PUT .../skus`；商品抽屉「规格与 SKU」 |
+| 5 | Admin | `PUT /admin/products/:id/specs`、`PUT .../skus`；商品抽屉加宽；规格弹窗填写；每规格主图 |
-| 6 | mini-user | 详情规格 chips；确认页带 `skuId`；箱装数量文案 |
+| 6 | mini-user | 详情规格 chips；选规格切主图；确认页带 `skuId`；箱装数量文案 |
 | 7 | 代下单 | HQ / 合伙人可选规格 SKU |
 | 8 | 权益文案 | 「好客权益券」→「好客权益」；首页角标「享{amount}好客权益」（去掉门店 icon） |
+| 9 | SKU 码 | 系统生成 `DK` + 6 位数字，后台不可填；每规格独立 69 码 |
+| 10 | 规格主图 | `common_product_sku.image_url` 可选；空则 C 端回落商品封面 |
 
-**不做**：SKU 规格图、库存、把现有酒祖 10/15/20 合并为一个 SPU。
+**不做**：库存、把现有酒祖 10/15/20 合并为一个 SPU。
 
 ## 兼容规则（线上）
 
 - 不改 `/api/v1` 前缀；**只增字段，不删旧字段语义**。
-- 旧客户端不传 `skuId`：若该 SPU **恰好 1 个可售 SKU** → 自动使用（现网行为）；多个可售 → `400 请选择规格`。
+- 旧客户端不传 `skuId`：
-- 旧 admin `PUT /admin/products/:id` 不传规格时：仅同步**唯一**默认 SKU（多规格时不同步，防误改）。
+  - 有 ≥1 个可售 SKU → 用默认（或第一个）可售 SKU
+  - **没有任何可售 SKU（未回填）→ 回落 SPU 字段，照常下单**（禁止再报「商品暂无可售规格」）
+- 传入 `skuId`（新客户端选规格）→ 按该 SKU 校验。
+- 旧 admin `PUT /admin/products/:id` 不传规格时：仅同步**唯一**默认 SKU（多规格时不同步，防误改）；不同步覆盖已生成的 DK 码。
 - SPU 上 `sku_code` / `barcode_69` 去掉唯一约束，唯一下沉到 `common_product_sku`；SPU 列保留为默认 SKU 冗余。
+- 订单 `sku_id` 可空；无规格快照走商品 69 码 / 价格。
 
-## 发版顺序
+## 发版一并执行
 
-1. API + DB 迁移（每商品仅默认 SKU）。**此时不要给任何商品加第二 SKU。**
+按顺序在**目标环境库**执行（先测试后生产）。本机 `npx ts-node …` 只改本地 `.env` 库，不会自动打线上。
-2. 发布新 mini-user + admin 规格页 + 代下单 SKU 选择。
+
-3. 运营再配置「单瓶 / 整箱」等第二规格。
+1. **规格表** `server/dukang-api/prisma/migrate-product-sku-v354.sql`  
+   建 spec/sku 表，订单加 `sku_id` / `sale_unit` / `bottles_per_unit`。
+2. **回填默认 SKU**  
+   `cd server/dukang-api && npx ts-node prisma/backfill-product-skus.ts`  
+   尚无 SKU 的商品各建 1 条默认瓶装 SKU（码用 DK）。
+3. **SKU 主图列** `server/dukang-api/prisma/migrate-sku-image.sql`  
+   ```sql
+   ALTER TABLE `common_product_sku`
+     ADD COLUMN `image_url` VARCHAR(512) NULL AFTER `sort_order`;
+   ```
+4. **SKU 码改 DK**（生产须在服务器用 `.env.production` 的 `DATABASE_URL`）  
+   `npx dotenv -e .env.production -- npx ts-node prisma/rewrite-sku-codes-dk.ts`  
+   已是 `DK`+数字的不动；`JZ-10` / `QX-001` 等会改。**不改 69 码、订单、价格。**
+5. **发票品类列**（同批次）`server/dukang-api/prisma/migrate-invoice-category.sql`  
+   ```sql
+   ALTER TABLE `user_invoice`
+     ADD COLUMN `invoice_category` VARCHAR(16) NOT NULL DEFAULT 'LIQUOR' AFTER `invoice_kind`;
+   ```
+6. 发布 API + mini-user + admin-web。  
+   **此时不要给商品加第二规格**，等新小程序上线后再配「单瓶 / 整箱」。
 
 ## 起购与物流
 
@@ -40,23 +65,37 @@
 ## 关键表摘要
 
 - `common_product_spec_attr` / `common_product_spec_value`
-- `common_product_sku`（`sale_unit`=`BOTTLE|BOX`，`bottles_per_unit`）
+- `common_product_sku`（`sale_unit`=`BOTTLE|BOX`，`bottles_per_unit`，`image_url` 可选）
 - `common_product_sku_spec`
 - `user_order.sku_id` / `sale_unit` / `bottles_per_unit`
+- `user_invoice.invoice_category`：`LIQUOR` 酒水类 / `CATERING` 餐饮类；票种 C 端固定增值税普通发票
 
-## 权益文案（mini-user）
+## SKU 码与 69 码
+
+- SKU 码：服务端生成 `DK000001` 起，后台只展示。
+- 每个规格必须填写**互不相同**的 69 码（全局不可与其它商品 SKU 冲突）。
+- 总部「规格与 SKU」点「填写」弹窗编辑 69 码 / 价 / 履约 / 主图。
+
+## 权益与小程序 UI（同批次）
 
 | 位置 | 变更 |
 |------|------|
-| 门店详情等 | 「好客权益券」→「好客权益」（如「好客权益使用规则」） |
+| 门店详情等 | 「好客权益券」→「好客权益」 |
-| 首页商品角标 `CouponBadge` | 由「享 + 门店 icon + 金额 + 好客权益」改为纯文案 **「享{amount}好客权益」** |
+| 首页商品角标 `CouponBadge` | 纯文案 **「享{amount}好客权益」**，无门店 icon |
+| 商品详情 | 规格区与「好客权益」说明之间加大间距 |
+| 待支付 / 收银台 | 顶部 logo 使用 `public/images/logo2.png`（杜康印章） |
+| 门店详情 | 「使用规则」四字红色，放在「门店详情」**上面**；门店详情正文限高，超出上下滚动 |
+| 发票申请 | 票种写死增值税普通发票；类型选酒水类/餐饮类；申请备注；抬头邮箱必填打 `*` |
 
 其它页 `BenefitFigure`（我的/权益/核销等）仍保留门店核销图标，仅首页角标去 icon。
 
 ## 验收
 
-- [ ] 未配规格：旧小程序/H5/代下单路径与现网一致
+- [ ] 未配规格：旧小程序/H5/代下单路径与现网一致（无 SKU 也能下单）
-- [ ] 多规格：详情选规格后价格/权益/履约变化；漏选下单 400
+- [ ] 多规格：详情选规格后价格/权益/履约/主图变化
 - [ ] 整箱 SKU：数量 1 过起购；订单快照 `bottles_per_unit=6`
 - [ ] `GET /catalog/products/:id` 仍含 `id/name/price/spec/skuCode/...`
 - [ ] 小程序无「好客权益券」字样；首页角标为「享{金额}好客权益」且无门店 icon
+- [ ] 后台 SKU 码为 DK 开头且不可手填；每规格独立 69 码与主图
+- [ ] 门店详情「使用规则」红色且在门店详情上方；门店详情超长可滚动
+- [ ] 待支付页顶部为 logo2 印章

packages/shared-types/src/catalog.ts

@@ -35,6 +35,8 @@ export interface ProductSkuDto {
   saleUnit: ProductSaleUnit;
   bottlesPerUnit: number;
   isDefault: boolean;
+  /** 规格主图；无则详情页回落商品封面/轮播 */
+  imageUrl?: string | null;
 }
 
 export interface ProductDto {
@@ -142,4 +144,5 @@ export interface AdminProductSkuInput {
   bottlesPerUnit?: number;
   isDefault?: boolean;
   sortOrder?: number;
+  imageUrl?: string | null;
 }

server/dukang-api/prisma/migrate-sku-image.sql

@@ -0,0 +1,3 @@
+-- SKU 规格主图（可选；空则 C 端回落商品封面）
+ALTER TABLE `common_product_sku`
+  ADD COLUMN `image_url` VARCHAR(512) NULL AFTER `sort_order`;

server/dukang-api/prisma/schema.prisma

@@ -894,6 +894,8 @@ model CommonProductSku {
   bottlesPerUnit         Int             @default(1) @map("bottles_per_unit")
   isDefault              Boolean         @default(false) @map("is_default")
   sortOrder              Int             @default(0) @map("sort_order")
+  /// 规格主图；空则回落商品封面
+  imageUrl               String?         @map("image_url") @db.VarChar(512)
   createdAt              DateTime        @default(now()) @map("created_at") @db.DateTime(3)
   updatedAt              DateTime        @updatedAt @map("updated_at") @db.DateTime(3)
 

server/dukang-api/src/modules/catalog/product-sku.util.ts

@@ -188,6 +188,7 @@ export function mapSkuDto(sku: SkuWithSpecs) {
     isDefault: sku.isDefault,
     skuCode: sku.skuCode,
     barcode69: sku.barcode69,
+    imageUrl: (sku as { imageUrl?: string | null }).imageUrl || undefined,
     sortOrder: sku.sortOrder,
   };
 }

server/dukang-api/src/modules/ops/admin-products.service.ts

@@ -86,7 +86,19 @@ export class AdminProductsService {
     const page = query.page ?? 1;
     const pageSize = query.pageSize ?? 20;
     const where: Prisma.CommonProductItemWhereInput = {};
-    if (query.name) where.name = { contains: query.name };
+    if (query.name?.trim()) {
+      const kw = query.name.trim();
+      where.OR = [
+        { name: { contains: kw } },
+        {
+          skus: {
+            some: {
+              OR: [{ skuCode: { contains: kw } }, { barcode69: { contains: kw } }],
+            },
+          },
+        },
+      ];
+    }
     if (query.status) where.status = query.status as Prisma.EnumProductStatusFilter['equals'];
     if (query.aromaType) where.aromaType = query.aromaType as Prisma.EnumAromaTypeFilter['equals'];
 
@@ -99,7 +111,25 @@ export class AdminProductsService {
         include: {
           coverResource: true,
           visibilityPhones: { select: { phone: true }, orderBy: { phone: 'asc' } },
-          skus: { select: { id: true }, take: 2 },
+          skus: {
+            orderBy: [{ sortOrder: 'asc' }, { id: 'asc' }],
+            select: {
+              id: true,
+              skuCode: true,
+              barcode69: true,
+              specText: true,
+              price: true,
+              benefitAmount: true,
+              status: true,
+              isDefault: true,
+              sortOrder: true,
+              allowOnSitePickup: true,
+              allowOnlinePurchase: true,
+              allowCrossCityDelivery: true,
+              saleUnit: true,
+              bottlesPerUnit: true,
+            },
+          },
           specAttrs: { select: { id: true } },
         },
       }),
@@ -120,13 +150,101 @@ export class AdminProductsService {
       : [];
     const resourceMap = groupResourcesByProductId(resources);
 
+    /** productId → skuIdKey → bottles；skuIdKey 用 '' 表示历史无 sku */
+    const soldByProductSku = new Map<string, Map<string, number>>();
+    if (productIds.length) {
+      const saleOrders = await this.prisma.order.findMany({
+        where: {
+          productId: { in: productIds },
+          payStatus: 'PAID',
+          isTest: false,
+          status: { notIn: ['PENDING_PAY', 'CANCELLED', 'REFUNDED'] },
+        },
+        select: {
+          productId: true,
+          skuId: true,
+          quantity: true,
+          bottlesPerUnit: true,
+        },
+      });
+      for (const o of saleOrders) {
+        const pid = o.productId.toString();
+        const sid = o.skuId?.toString() ?? '';
+        const bottles = o.quantity * (o.bottlesPerUnit > 0 ? o.bottlesPerUnit : 1);
+        let bySku = soldByProductSku.get(pid);
+        if (!bySku) {
+          bySku = new Map();
+          soldByProductSku.set(pid, bySku);
+        }
+        bySku.set(sid, (bySku.get(sid) ?? 0) + bottles);
+      }
+    }
+
     return serializeBigInt({
       items: items.map((p) => {
         const { skus, specAttrs, ...rest } = p;
+        const formatted = this.formatProduct(rest as never, resourceMap.get(p.id.toString()) ?? []);
+        const prices = skus.length
+          ? skus.map((s) => Number(s.price))
+          : [Number(p.price)];
+        const priceMin = Math.min(...prices);
+        const priceMax = Math.max(...prices);
+        const pid = p.id.toString();
+        const bySku = soldByProductSku.get(pid);
+        let soldBottles = 0;
+        if (bySku) {
+          for (const n of bySku.values()) soldBottles += n;
+        }
+
+        const skuRows =
+          skus.length > 0
+            ? skus.map((s) => ({
+                id: s.id.toString(),
+                skuCode: s.skuCode,
+                barcode69: s.barcode69,
+                specText: s.specText,
+                price: Number(s.price),
+                benefitAmount: Number(s.benefitAmount ?? s.price),
+                status: s.status,
+                isDefault: s.isDefault,
+                sortOrder: s.sortOrder,
+                allowOnSitePickup: s.allowOnSitePickup,
+                allowOnlinePurchase: s.allowOnlinePurchase,
+                allowCrossCityDelivery: s.allowCrossCityDelivery,
+                saleUnit: s.saleUnit,
+                bottlesPerUnit: s.bottlesPerUnit,
+                soldBottles: bySku?.get(s.id.toString()) ?? 0,
+                virtual: false,
+              }))
+            : [
+                {
+                  id: `virtual-${pid}`,
+                  skuCode: p.skuCode,
+                  barcode69: p.barcode69,
+                  specText: p.spec,
+                  price: Number(p.price),
+                  benefitAmount: Number(p.benefitAmount ?? p.price),
+                  status: p.status,
+                  isDefault: true,
+                  sortOrder: 0,
+                  allowOnSitePickup: p.allowOnSitePickup,
+                  allowOnlinePurchase: p.allowOnlinePurchase,
+                  allowCrossCityDelivery: p.allowCrossCityDelivery,
+                  saleUnit: 'BOTTLE' as const,
+                  bottlesPerUnit: 1,
+                  soldBottles,
+                  virtual: true,
+                },
+              ];
+
         return {
-          ...this.formatProduct(rest as never, resourceMap.get(p.id.toString()) ?? []),
+          ...formatted,
           specEnabled: specAttrs.length > 0 || skus.length > 1,
           skuCount: skus.length,
+          priceMin,
+          priceMax,
+          soldBottles,
+          skus: skuRows,
         };
       }),
       total,
@@ -246,10 +364,14 @@ export class AdminProductsService {
     const existing = await this.prisma.commonProductItem.findUnique({ where: { id } });
     if (!existing) throw new NotFoundException('商品不存在');
 
+    const skuCount = await this.prisma.commonProductSku.count({ where: { productId: id } });
+    /** 多规格时履约只在规格 SKU 上改；忽略基础信息里的履约字段，避免误覆盖默认 SKU 冗余 */
+    const applyFulfillment = skuCount <= 1;
     const fulfillmentTouched =
-      dto.allowOnlinePurchase !== undefined ||
+      applyFulfillment &&
-      dto.allowCrossCityDelivery !== undefined ||
+      (dto.allowOnlinePurchase !== undefined ||
-      dto.allowOnSitePickup !== undefined;
+        dto.allowCrossCityDelivery !== undefined ||
+        dto.allowOnSitePickup !== undefined);
     const flags = fulfillmentTouched
       ? resolveFulfillmentFlags({
           allowOnlinePurchase: dto.allowOnlinePurchase,
@@ -555,7 +677,8 @@ export class AdminProductsService {
               bottlesPerUnit,
               isDefault: !!row.isDefault,
               sortOrder: row.sortOrder ?? i,
-            },
+              imageUrl: row.imageUrl?.trim() || null,
+            } as never,
           });
           await tx.commonProductSkuSpec.deleteMany({ where: { skuId } });
         } else {
@@ -574,7 +697,8 @@ export class AdminProductsService {
               bottlesPerUnit,
               isDefault: !!row.isDefault,
               sortOrder: row.sortOrder ?? i,
-            },
+              imageUrl: row.imageUrl?.trim() || null,
+            } as never,
           });
           skuId = created.id;
         }

server/dukang-api/src/modules/ops/dto/admin-mutate.dto.ts

@@ -9,6 +9,7 @@ import {
   IsObject,
   IsOptional,
   IsString,
+  MaxLength,
   Min,
   Max,
   MinLength,
@@ -1400,6 +1401,12 @@ class AdminSkuRowDto {
   @IsOptional()
   @IsNumber()
   sortOrder?: number;
+
+  /** 规格主图 URL；空则回落商品封面 */
+  @IsOptional()
+  @IsString()
+  @MaxLength(512)
+  imageUrl?: string | null;
 }
 
 export class SaveProductSkusDto {