first commit

2026-07-27 14:54:21 +08:00
commit 4d086758e8
161 changed files with 63776 additions and 0 deletions
@@ -0,0 +1,135 @@
+import { View, Text, ScrollView } from '@tarojs/components'
+import Taro from '@tarojs/taro'
+import { useState, useEffect, useCallback } from 'react'
+import './index.scss'
+import { getDesignList, getTheme, type DesignItem } from '../../utils/store'
+import ThemeToggle from '../../components/ThemeToggle'
+import { useThemeContext } from '../../context/ThemeContext'
+
+const STATUS_TABS = [
+  { code: 'all', label: '全部' },
+  { code: 'undesigned', label: '未设计' },
+  { code: 'designing', label: '设计中' },
+  { code: 'ordered', label: '已下单' }
+]
+
+const STATUS_STYLE: Record<string, { label: string; cls: string }> = {
+  undesigned: { label: '未设计', cls: 'badge-pink' },
+  designing: { label: '设计中', cls: 'badge-blue' },
+  ordered: { label: '已下单', cls: 'badge-green' }
+}
+
+export default function DesignListPage() {
+  const { theme } = useThemeContext()
+  const [activeTab, setActiveTab] = useState('all')
+  const [list, setList] = useState<DesignItem[]>([])
+
+  const load = useCallback(() => {
+    setList(getDesignList())
+  }, [])
+
+  // 页面每次显示时刷新（保证加入清单后切回能看到最新数据）
+  useEffect(() => {
+    const onShow = () => load()
+    const page = Taro.getCurrentInstance().page
+    if (page) {
+      const orig = page.onShow
+      page.onShow = function () {
+        onShow()
+        if (orig) orig.apply(this)
+      }
+    }
+    load()
+  }, [load])
+
+  const filtered = activeTab === 'all'
+    ? list
+    : list.filter(d => d.status === activeTab)
+
+  const goDesign = (item: DesignItem) => {
+    if (item.status === 'ordered') {
+      Taro.showToast({ title: '该商品已下单，请查看订单', icon: 'none' })
+      return
+    }
+    Taro.navigateTo({
+      url: `/pages/diy/index?source=designList&designId=${item.id}`
+    })
+  }
+
+  return (
+    <View className={`theme-${theme}`}>
+      <View className='design-page'>
+        <ThemeToggle />
+
+        <View className='page-header dashed-card mt-20'>
+          <View className='star-badge' />
+          <Text className='page-title'>我的设计清单</Text>
+        </View>
+
+        {/* 状态筛选 */}
+        <View className='status-tabs'>
+          <ScrollView className='tabs-scroll' scrollX>
+            {STATUS_TABS.map(tab => (
+              <View
+                key={tab.code}
+                className={`tab-item ${activeTab === tab.code ? 'active' : ''}`}
+                onClick={() => setActiveTab(tab.code)}
+              >
+                <Text className='tab-label'>{tab.label}</Text>
+                {activeTab === tab.code && <View className='tab-underline' />}
+              </View>
+            ))}
+          </ScrollView>
+        </View>
+
+        {/* 列表 */}
+        <ScrollView className='design-list' scrollY>
+          {filtered.map(item => {
+            const style = STATUS_STYLE[item.status]
+            return (
+              <View key={item.id} className='design-card dashed-card'>
+                <View className='star-badge' />
+                <View className='design-body'>
+                  <Text className='design-icon'>{item.productIcon}</Text>
+                  <View className='design-info'>
+                    <View className='design-title-row'>
+                      <Text className='design-name'>{item.productName}</Text>
+                      <Text className={`badge ${style.cls}`}>{style.label}</Text>
+                    </View>
+                    <Text className='design-meta'>数量: {item.count} 件 | 单价: ¥{item.unitPrice}</Text>
+                    <Text className='design-total'>小计: ¥{(item.unitPrice * item.count).toFixed(2)}</Text>
+                  </View>
+                </View>
+                <View className='design-actions'>
+                  {item.status !== 'ordered' && (
+                    <View className='btn-gradient design-btn' onClick={() => goDesign(item)}>
+                      <Text>{item.status === 'undesigned' ? '开始设计' : '继续设计'}</Text>
+                    </View>
+                  )}
+                  {item.status === 'ordered' && (
+                    <View className='btn-outline design-btn' onClick={() => Taro.switchTab({ url: '/pages/orders/index' })}>
+                      <Text>查看订单</Text>
+                    </View>
+                  )}
+                </View>
+              </View>
+            )
+          })}
+
+          {filtered.length === 0 && (
+            <View className='empty-state'>
+              <Text className='empty-icon'>📐</Text>
+              <Text className='empty-text'>还没有设计清单</Text>
+              <Text className='empty-sub'>去首页逛逛，找到喜欢的定制品</Text>
+              <View className='btn-gradient' onClick={() => Taro.switchTab({ url: '/pages/index/index' })}>
+                <Text>去逛逛</Text>
+              </View>
+            </View>
+          )}
+        </ScrollView>
+
+        <View style={{ height: '40px' }} />
+      </View>
+    </View>
+  )
+}