feat：发布 0.2.3

feat：表格列最新净值和估算净值增加日期显示
feat：更新用户支持群二维码
2026-03-09 22:26:35 +08:00 · 2026-03-09 21:32:03 +08:00 · 2026-03-09 21:16:23 +08:00 · 2026-03-09 21:00:28 +08:00 · 2026-03-09 20:46:59 +08:00 · 2026-03-09 20:22:08 +08:00
18 changed files with 646 additions and 318 deletions
--- a/app/assets/weChatGroup.jpg
+++ b/app/assets/weChatGroup.jpg
--- a/app/components/Announcement.jsx
+++ b/app/components/Announcement.jsx
@@ -3,7 +3,7 @@
 import { useState, useEffect } from 'react';
 import { motion, AnimatePresence } from 'framer-motion';

-const ANNOUNCEMENT_KEY = 'hasClosedAnnouncement_v13';
+const ANNOUNCEMENT_KEY = 'hasClosedAnnouncement_v14';

 export default function Announcement() {
  const [isVisible, setIsVisible] = useState(false);
@@ -75,12 +75,11 @@ export default function Announcement() {
              <span>公告</span>
            </div>
            <div style={{ color: 'var(--text)', lineHeight: '1.6', fontSize: '15px', overflowY: 'auto', minHeight: 0, flex: 1, paddingRight: '4px' }}>
-              <p>v0.2.2 版本更新内容如下：</p>
-              <p>1. 新增 ios pwa 应用支持。</p>
-              <p>2. 引入 shadcn ui 组件库，逐步调整项目样式。</p>
-              <p>3. 列表模式表头固定。</p>
-              <p>4. 列表模式点击名称，展示基金详情弹框。</p>
-              <p>注：强烈建议苹果用户通过 Safari 浏览器→分享→添加应用到主屏幕，实现保存网页成APP效果。（安卓同理）</p>
+              <p>v0.2.3 版本更新内容如下：</p>
+              <p>1. 二次确认弹框层级问题修复。</p>
+              <p>2. 净值列新增日期。</p>
+              <p>3. 重发新用户支持群二维码(底部提交反馈处)。</p>
+              <p>注：用户支持群禁止讨论基金及金融买卖相关内容。</p>
            </div>

            <div style={{ display: 'flex', justifyContent: 'flex-end', marginTop: '8px' }}>
--- a/app/components/ConfirmModal.jsx
+++ b/app/components/ConfirmModal.jsx
@@ -15,19 +15,31 @@ export default function ConfirmModal({
  onConfirm,
  onCancel,
  confirmText = '确定删除',
+  icon,
+  confirmVariant = 'danger', // 'danger' | 'primary' | 'secondary'
 }) {
  const handleOpenChange = (open) => {
    if (!open) onCancel();
  };

+  const confirmButtonToneClass =
+    confirmVariant === 'primary'
+      ? 'button'
+      : confirmVariant === 'secondary'
+        ? 'button secondary'
+        : 'button danger';
+
  return (
    <Dialog open onOpenChange={handleOpenChange}>
      <DialogContent
+        overlayClassName="!z-[12000]"
        showCloseButton={false}
-        className="max-w-[400px] flex flex-col gap-5 p-6"
+        className="!z-[12010] max-w-[400px] flex flex-col gap-5 p-6"
      >
        <DialogHeader className="flex flex-row items-center gap-3 text-left">
-          <TrashIcon width="20" height="20" className="shrink-0 text-[var(--danger)]" />
+          {icon || (
+            <TrashIcon width="20" height="20" className="shrink-0 text-[var(--danger)]" />
+          )}
          <DialogTitle className="flex-1 text-base font-semibold">{title}</DialogTitle>
        </DialogHeader>
        <DialogDescription className="text-left text-sm leading-relaxed text-[var(--muted-foreground)]">
@@ -43,7 +55,7 @@ export default function ConfirmModal({
          </button>
          <button
            type="button"
-            className="button danger min-w-0 flex-1 cursor-pointer h-auto min-h-[48px] py-3 sm:h-11 sm:min-h-0 sm:py-0"
+            className={`${confirmButtonToneClass} min-w-0 flex-1 cursor-pointer h-auto min-h-[48px] py-3 sm:h-11 sm:min-h-0 sm:py-0`}
            onClick={onConfirm}
          >
            {confirmText}
--- a/app/components/DcaModal.jsx
+++ b/app/components/DcaModal.jsx
@@ -187,156 +187,176 @@ export default function DcaModal({ fund, plan, onClose, onConfirm }) {
        exit={{ opacity: 0, scale: 0.95, y: 20 }}
        className="glass card modal dca-modal"
        onClick={(e) => e.stopPropagation()}
-        style={{ maxWidth: '420px' }}
+        style={{
+          maxWidth: '420px',
+          maxHeight: '90vh',
+          display: 'flex',
+          flexDirection: 'column',
+        }}
      >
-        <div className="title" style={{ marginBottom: 20, justifyContent: 'space-between' }}>
-          <div style={{ display: 'flex', alignItems: 'center', gap: 10 }}>
-            <span style={{ fontSize: '20px' }}>🔁</span>
-            <span>定投</span>
-          </div>
-          <button className="icon-button" onClick={onClose} style={{ border: 'none', background: 'transparent' }}>
-            <CloseIcon width="20" height="20" />
-          </button>
-        </div>
-
-        <div style={{ marginBottom: 16 }}>
-          <div className="fund-name" style={{ fontWeight: 600, fontSize: '16px', marginBottom: 4 }}>{fund?.name}</div>
-          <div className="muted" style={{ fontSize: '12px' }}>#{fund?.code}</div>
-        </div>
-
-        <form onSubmit={handleSubmit}>
-          <div className="form-group" style={{ marginBottom: 8 }}>
-            <label className="muted" style={{ display: 'flex', alignItems: 'center', justifyContent: 'space-between', fontSize: '14px' }}>
-              <span>是否启用定投</span>
-              <button
-                type="button"
-                onClick={() => setEnabled(v => !v)}
-                style={{
-                  border: 'none',
-                  background: 'transparent',
-                  cursor: 'pointer',
-                  display: 'inline-flex',
-                  alignItems: 'center',
-                  gap: 6
-                }}
-              >
-                <span className={`dca-toggle-track ${enabled ? 'enabled' : ''}`}>
-                  <span className="dca-toggle-thumb" style={{ left: enabled ? 16 : 2 }} />
-                </span>
-                <span style={{ fontSize: 12, color: enabled ? 'var(--primary)' : 'var(--muted)' }}>
-                  {enabled ? '已启用' : '未启用'}
-                </span>
-              </button>
-            </label>
-          </div>
-
-          <div className="form-group" style={{ marginBottom: 16 }}>
-            <label className="muted" style={{ display: 'block', marginBottom: 8, fontSize: '14px' }}>
-              定投金额 (¥) <span style={{ color: 'var(--danger)' }}>*</span>
-            </label>
-            <div style={{ border: (!amount || parseFloat(amount) <= 0) ? '1px solid var(--danger)' : '1px solid var(--border)', borderRadius: 12 }}>
-              <NumericInput
-                value={amount}
-                onChange={setAmount}
-                step={100}
-                min={0}
-                placeholder="请输入每次定投金额"
-              />
+        <div
+          className="scrollbar-y-styled"
+          style={{
+            overflowY: 'auto',
+            paddingRight: 4,
+            flex: 1,
+          }}
+        >
+          <div className="title" style={{ marginBottom: 20, justifyContent: 'space-between' }}>
+            <div style={{ display: 'flex', alignItems: 'center', gap: 10 }}>
+              <span style={{ fontSize: '20px' }}>🔁</span>
+              <span>定投</span>
            </div>
+            <button className="icon-button" onClick={onClose} style={{ border: 'none', background: 'transparent' }}>
+              <CloseIcon width="20" height="20" />
+            </button>
          </div>

-          <div className="row" style={{ gap: 12, marginBottom: 16 }}>
-            <div className="form-group" style={{ flex: 1 }}>
-              <label className="muted" style={{ display: 'block', marginBottom: 8, fontSize: '14px' }}>
-                买入费率 (%) <span style={{ color: 'var(--danger)' }}>*</span>
+          <div style={{ marginBottom: 16 }}>
+            <div className="fund-name" style={{ fontWeight: 600, fontSize: '16px', marginBottom: 4 }}>{fund?.name}</div>
+            <div className="muted" style={{ fontSize: '12px' }}>#{fund?.code}</div>
+          </div>
+
+          <form onSubmit={handleSubmit}>
+            <div className="form-group" style={{ marginBottom: 8 }}>
+              <label className="muted" style={{ display: 'flex', alignItems: 'center', justifyContent: 'space-between', fontSize: '14px' }}>
+                <span>是否启用定投</span>
+                <button
+                  type="button"
+                  onClick={() => setEnabled(v => !v)}
+                  style={{
+                    border: 'none',
+                    background: 'transparent',
+                    cursor: 'pointer',
+                    display: 'inline-flex',
+                    alignItems: 'center',
+                    gap: 6
+                  }}
+                >
+                  <span className={`dca-toggle-track ${enabled ? 'enabled' : ''}`}>
+                    <span className="dca-toggle-thumb" style={{ left: enabled ? 16 : 2 }} />
+                  </span>
+                  <span style={{ fontSize: 12, color: enabled ? 'var(--primary)' : 'var(--muted)' }}>
+                    {enabled ? '已启用' : '未启用'}
+                  </span>
+                </button>
              </label>
-              <div style={{ border: feeRate === '' ? '1px solid var(--danger)' : '1px solid var(--border)', borderRadius: 12 }}>
+            </div>
+
+            <div className="form-group" style={{ marginBottom: 16 }}>
+              <label className="muted" style={{ display: 'block', marginBottom: 8, fontSize: '14px' }}>
+                定投金额 (¥) <span style={{ color: 'var(--danger)' }}>*</span>
+              </label>
+              <div style={{ border: (!amount || parseFloat(amount) <= 0) ? '1px solid var(--danger)' : '1px solid var(--border)', borderRadius: 12 }}>
                <NumericInput
-                  value={feeRate}
-                  onChange={setFeeRate}
-                  step={0.01}
+                  value={amount}
+                  onChange={setAmount}
+                  step={100}
                  min={0}
-                  placeholder="0.12"
+                  placeholder="请输入每次定投金额"
                />
              </div>
            </div>
-            <div className="form-group" style={{ flex: 1 }}>
-              <label className="muted" style={{ display: 'block', marginBottom: 8, fontSize: '14px' }}>
-                定投周期 <span style={{ color: 'var(--danger)' }}>*</span>
-              </label>
-              <div className="dca-option-group row" style={{ gap: 4 }}>
-                {CYCLES.map((opt) => (
-                  <button
-                    key={opt.value}
-                    type="button"
-                    className={`dca-option-btn ${cycle === opt.value ? 'active' : ''}`}
-                    onClick={() => setCycle(opt.value)}
-                  >
-                    {opt.label}
-                  </button>
-                ))}
-              </div>
-            </div>
-          </div>

-          {(cycle === 'weekly' || cycle === 'biweekly') && (
-            <div className="form-group" style={{ marginBottom: 16 }}>
-              <label className="muted" style={{ display: 'block', marginBottom: 8, fontSize: '14px' }}>
-                扣款星期 <span style={{ color: 'var(--danger)' }}>*</span>
-              </label>
-              <div className="dca-option-group row" style={{ gap: 4 }}>
-                {WEEKDAY_OPTIONS.map((opt) => (
-                  <button
-                    key={opt.value}
-                    type="button"
-                    className={`dca-option-btn dca-weekday-btn ${weeklyDay === opt.value ? 'active' : ''}`}
-                    onClick={() => setWeeklyDay(opt.value)}
-                  >
-                    {opt.label}
-                  </button>
-                ))}
+            <div className="row" style={{ gap: 12, marginBottom: 16 }}>
+              <div className="form-group" style={{ flex: 1 }}>
+                <label className="muted" style={{ display: 'block', marginBottom: 8, fontSize: '14px' }}>
+                  买入费率 (%) <span style={{ color: 'var(--danger)' }}>*</span>
+                </label>
+                <div style={{ border: feeRate === '' ? '1px solid var(--danger)' : '1px solid var(--border)', borderRadius: 12 }}>
+                  <NumericInput
+                    value={feeRate}
+                    onChange={setFeeRate}
+                    step={0.01}
+                    min={0}
+                    placeholder="0.12"
+                  />
+                </div>
              </div>
-            </div>
-          )}
-
-          {cycle === 'monthly' && (
-            <div className="form-group" style={{ marginBottom: 16 }}>
-              <label className="muted" style={{ display: 'block', marginBottom: 8, fontSize: '14px' }}>
-                扣款日 <span style={{ color: 'var(--danger)' }}>*</span>
-              </label>
-              <div className="dca-monthly-day-group scrollbar-y-styled">
-                {Array.from({ length: 28 }).map((_, idx) => {
-                  const day = idx + 1;
-                  const active = monthlyDay === day;
-                  return (
+              <div className="form-group" style={{ flex: 1 }}>
+                <label className="muted" style={{ display: 'block', marginBottom: 8, fontSize: '14px' }}>
+                  定投周期 <span style={{ color: 'var(--danger)' }}>*</span>
+                </label>
+                <div className="dca-option-group row" style={{ gap: 4 }}>
+                  {CYCLES.map((opt) => (
                    <button
-                      key={day}
-                      ref={active ? monthlyDayRef : null}
+                      key={opt.value}
                      type="button"
-                      className={`dca-option-btn dca-monthly-btn ${active ? 'active' : ''}`}
-                      onClick={() => setMonthlyDay(day)}
+                      className={`dca-option-btn ${cycle === opt.value ? 'active' : ''}`}
+                      onClick={() => setCycle(opt.value)}
                    >
-                      {day}日
+                      {opt.label}
                    </button>
-                  );
-                })}
+                  ))}
+                </div>
              </div>
            </div>
-          )}

-          <div className="form-group" style={{ marginBottom: 16 }}>
-            <label className="muted" style={{ display: 'block', marginBottom: 4, fontSize: '14px' }}>
-              首次扣款日期
-            </label>
-            <div className="dca-first-date-display">
-              {firstDate}
-            </div>
-            <div className="muted" style={{ marginTop: 4, fontSize: 12 }}>
-              * 基于当前日期和所选周期/扣款日自动计算：每日=当天；每周/每两周=从今天起最近的所选工作日；每月=从今天起最近的所选日期（1-28日）。
-            </div>
-          </div>
+            {(cycle === 'weekly' || cycle === 'biweekly') && (
+              <div className="form-group" style={{ marginBottom: 16 }}>
+                <label className="muted" style={{ display: 'block', marginBottom: 8, fontSize: '14px' }}>
+                  扣款星期 <span style={{ color: 'var(--danger)' }}>*</span>
+                </label>
+                <div className="dca-option-group row" style={{ gap: 4 }}>
+                  {WEEKDAY_OPTIONS.map((opt) => (
+                    <button
+                      key={opt.value}
+                      type="button"
+                      className={`dca-option-btn dca-weekday-btn ${weeklyDay === opt.value ? 'active' : ''}`}
+                      onClick={() => setWeeklyDay(opt.value)}
+                    >
+                      {opt.label}
+                    </button>
+                  ))}
+                </div>
+              </div>
+            )}

-          <div className="row" style={{ gap: 12, marginTop: 12 }}>
+            {cycle === 'monthly' && (
+              <div className="form-group" style={{ marginBottom: 16 }}>
+                <label className="muted" style={{ display: 'block', marginBottom: 8, fontSize: '14px' }}>
+                  扣款日 <span style={{ color: 'var(--danger)' }}>*</span>
+                </label>
+                <div className="dca-monthly-day-group scrollbar-y-styled">
+                  {Array.from({ length: 28 }).map((_, idx) => {
+                    const day = idx + 1;
+                    const active = monthlyDay === day;
+                    return (
+                      <button
+                        key={day}
+                        ref={active ? monthlyDayRef : null}
+                        type="button"
+                        className={`dca-option-btn dca-monthly-btn ${active ? 'active' : ''}`}
+                        onClick={() => setMonthlyDay(day)}
+                      >
+                        {day}日
+                      </button>
+                    );
+                  })}
+                </div>
+              </div>
+            )}
+
+            <div className="form-group" style={{ marginBottom: 16 }}>
+              <label className="muted" style={{ display: 'block', marginBottom: 4, fontSize: '14px' }}>
+                首次扣款日期
+              </label>
+              <div className="dca-first-date-display">
+                {firstDate}
+              </div>
+              <div className="muted" style={{ marginTop: 4, fontSize: 12 }}>
+                * 基于当前日期和所选周期/扣款日自动计算：每日=当天；每周/每两周=从今天起最近的所选工作日；每月=从今天起最近的所选日期（1-28日）。
+              </div>
+            </div>
+          </form>
+        </div>
+        <div
+          style={{
+            paddingTop: 12,
+            marginTop: 4,
+          }}
+        >
+          <div className="row" style={{ gap: 12 }}>
            <button
              type="button"
              className="button secondary dca-cancel-btn"
@@ -346,15 +366,16 @@ export default function DcaModal({ fund, plan, onClose, onConfirm }) {
              取消
            </button>
            <button
-              type="submit"
+              type="button"
              className="button"
              disabled={!isValid()}
+              onClick={handleSubmit}
              style={{ flex: 1, opacity: isValid() ? 1 : 0.6 }}
            >
              保存定投
            </button>
          </div>
-        </form>
+        </div>
      </motion.div>
    </motion.div>
  );
--- a/app/components/MobileFundTable.jsx
+++ b/app/components/MobileFundTable.jsx
@@ -1,6 +1,6 @@
 'use client';

-import { useEffect, useMemo, useRef, useState } from 'react';
+import { createContext, useContext, useEffect, useMemo, useRef, useState } from 'react';
 import ReactDOM from 'react-dom';
 import { AnimatePresence, motion } from 'framer-motion';
 import {
@@ -34,7 +34,7 @@ import {
 import FitText from './FitText';
 import FundCard from './FundCard';
 import MobileSettingModal from './MobileSettingModal';
-import { CloseIcon, ExitIcon, SettingsIcon, StarIcon } from './Icons';
+import { CloseIcon, DragIcon, ExitIcon, SettingsIcon, SortIcon, StarIcon } from './Icons';

 const MOBILE_NON_FROZEN_COLUMN_IDS = [
  'yesterdayChangePercent',
@@ -55,6 +55,8 @@ const MOBILE_COLUMN_HEADERS = {
  holdingProfit: '持有收益',
 };

+const RowSortableContext = createContext(null);
+
 function SortableRow({ row, children, isTableDragging, disabled }) {
  const {
    attributes,
@@ -84,7 +86,9 @@ function SortableRow({ row, children, isTableDragging, disabled }) {
      style={{ ...style, position: 'relative' }}
      {...attributes}
    >
-      {typeof children === 'function' ? children(setActivatorNodeRef, listeners) : children}
+      <RowSortableContext.Provider value={{ setActivatorNodeRef, listeners }}>
+        {typeof children === 'function' ? children(setActivatorNodeRef, listeners) : children}
+      </RowSortableContext.Provider>
    </motion.div>
  );
 }
@@ -123,9 +127,12 @@ export default function MobileFundTable({
  blockDrawerClose = false,
  closeDrawerRef,
 }) {
+  const [isNameSortMode, setIsNameSortMode] = useState(false);
+
+  // 排序模式下拖拽手柄无需长按，直接拖动即可；非排序模式长按整行触发拖拽
  const sensors = useSensors(
    useSensor(PointerSensor, {
-      activationConstraint: { delay: 400, tolerance: 5 },
+      activationConstraint: isNameSortMode ? { delay: 0, tolerance: 5 } : { delay: 400, tolerance: 5 },
    }),
    useSensor(KeyboardSensor)
  );
@@ -297,6 +304,19 @@ export default function MobileFundTable({
  };

  const [settingModalOpen, setSettingModalOpen] = useState(false);
+
+  useEffect(() => {
+    if (sortBy !== 'default') setIsNameSortMode(false);
+  }, [sortBy]);
+
+  // 排序模式下，点击页面任意区域（含表格外）退出排序；使用冒泡阶段，避免先于排序按钮处理
+  useEffect(() => {
+    if (!isNameSortMode) return;
+    const onDocClick = () => setIsNameSortMode(false);
+    document.addEventListener('click', onDocClick);
+    return () => document.removeEventListener('click', onDocClick);
+  }, [isNameSortMode]);
+
  const [cardSheetRow, setCardSheetRow] = useState(null);
  const tableContainerRef = useRef(null);
  const portalHeaderRef = useRef(null);
@@ -334,13 +354,19 @@ export default function MobileFundTable({
      const nextStickyTop = getEffectiveStickyTop();
      setEffectiveStickyTop((prev) => (prev === nextStickyTop ? prev : nextStickyTop));

-      const tableRect = tableContainerRef.current?.getBoundingClientRect();
+      const tableEl = tableContainerRef.current;
+      const tableRect = tableEl?.getBoundingClientRect();
      if (!tableRect) {
        setShowPortalHeader(window.scrollY >= nextStickyTop);
        return;
      }

-      setShowPortalHeader(tableRect.top <= nextStickyTop);
+      const headerEl = tableEl?.querySelector('.table-header-row');
+      const headerHeight = headerEl?.getBoundingClientRect?.().height ?? 0;
+      const hasPassedHeader = (tableRect.top + headerHeight) <= nextStickyTop;
+      const hasTableInView = tableRect.bottom > nextStickyTop;
+
+      setShowPortalHeader(hasPassedHeader && hasTableInView);
    };

    const throttledVerticalUpdate = throttle(updateVerticalState, 1000/60, { leading: true, trailing: true });
@@ -442,7 +468,8 @@ export default function MobileFundTable({
  };

  // 移动端名称列：无拖拽把手，长按整行触发排序；点击名称可打开底部卡片弹框（需传入 getFundCardProps）
-  const MobileFundNameCell = ({ info, showFullFundName, onOpenCardSheet }) => {
+  // 当 isNameSortMode 且 sortBy==='default' 时，左侧显示排序/拖拽图标，可拖动行排序
+  const MobileFundNameCell = ({ info, showFullFundName, onOpenCardSheet, isNameSortMode: nameSortMode, sortBy: currentSortBy }) => {
    const original = info.row.original || {};
    const code = original.code;
    const isUpdated = original.isUpdated;
@@ -451,10 +478,23 @@ export default function MobileFundTable({
    const holdingAmountDisplay = hasHoldingAmount ? (original.holdingAmount ?? '—') : null;
    const isFavorites = favorites?.has?.(code);
    const isGroupTab = currentTab && currentTab !== 'all' && currentTab !== 'fav';
+    const rowSortable = useContext(RowSortableContext);
+    const showDragHandle = nameSortMode && currentSortBy === 'default' && rowSortable;

    return (
      <div className="name-cell-content" style={{ display: 'flex', alignItems: 'center', gap: 8 }}>
-        {isGroupTab ? (
+        {showDragHandle ? (
+          <span
+            ref={rowSortable.setActivatorNodeRef}
+            className="icon-button fav-button"
+            title="拖动排序"
+            style={{ backgroundColor: 'transparent', touchAction: 'none', cursor: 'grab', display: 'flex', alignItems: 'center', justifyContent: 'center' }}
+            onClick={(e) => e.stopPropagation()}
+            {...rowSortable.listeners}
+          >
+            <DragIcon width="18" height="18" />
+          </span>
+        ) : isGroupTab ? (
          <button
            className="icon-button fav-button"
            onClick={(e) => {
@@ -581,6 +621,31 @@ export default function MobileFundTable({
            >
              <SettingsIcon width="18" height="18" />
            </button>
+            {sortBy === 'default' && (
+              <button
+                type="button"
+                className={`icon-button ${isNameSortMode ? 'active' : ''}`}
+                onClick={(e) => {
+                  e.stopPropagation?.();
+                  setIsNameSortMode((prev) => !prev);
+                }}
+                title={isNameSortMode ? '退出排序' : '拖动排序'}
+                style={{
+                  border: 'none',
+                  width: '28px',
+                  height: '28px',
+                  minWidth: '28px',
+                  backgroundColor: 'transparent',
+                  color: isNameSortMode ? 'var(--primary)' : 'var(--text)',
+                  flexShrink: 0,
+                  display: 'flex',
+                  alignItems: 'center',
+                  justifyContent: 'center',
+                }}
+              >
+                <SortIcon width="18" height="18" />
+              </button>
+            )}
          </div>
        ),
        cell: (info) => (
@@ -588,6 +653,8 @@ export default function MobileFundTable({
            info={info}
            showFullFundName={showFullFundName}
            onOpenCardSheet={getFundCardProps ? (row) => setCardSheetRow(row) : undefined}
+            isNameSortMode={isNameSortMode}
+            sortBy={sortBy}
          />
        ),
        meta: { align: 'left', cellClassName: 'name-cell', width: columnWidthMap.fundName },
@@ -595,25 +662,41 @@ export default function MobileFundTable({
      {
        accessorKey: 'latestNav',
        header: '最新净值',
-        cell: (info) => (
-          <span style={{ display: 'block', width: '100%', fontWeight: 700 }}>
-            <FitText maxFontSize={14} minFontSize={10}>
-              {info.getValue() ?? '—'}
-            </FitText>
-          </span>
-        ),
+        cell: (info) => {
+          const original = info.row.original || {};
+          const date = original.latestNavDate ?? '-';
+          return (
+            <div style={{ display: 'flex', flexDirection: 'column', alignItems: 'flex-end', gap: 0 }}>
+              <span style={{ display: 'block', width: '100%', fontWeight: 700 }}>
+                <FitText maxFontSize={14} minFontSize={10}>
+                  {info.getValue() ?? '—'}
+                </FitText>
+              </span>
+              <span className="muted" style={{ fontSize: '10px' }}>{date}</span>
+            </div>
+          );
+        },
        meta: { align: 'right', cellClassName: 'value-cell', width: columnWidthMap.latestNav },
      },
      {
        accessorKey: 'estimateNav',
        header: '估算净值',
-        cell: (info) => (
-          <span style={{ display: 'block', width: '100%', fontWeight: 700 }}>
-            <FitText maxFontSize={14} minFontSize={10}>
-              {info.getValue() ?? '—'}
-            </FitText>
-          </span>
-        ),
+        cell: (info) => {
+          const original = info.row.original || {};
+          const date = original.estimateNavDate ?? '-';
+          const displayDate = typeof date === 'string' && date.length > 5 ? date.slice(5) : date;
+
+          return (
+            <div style={{ display: 'flex', flexDirection: 'column', alignItems: 'flex-end', gap: 0 }}>
+              <span style={{ display: 'block', width: '100%', fontWeight: 700 }}>
+                <FitText maxFontSize={14} minFontSize={10}>
+                  {info.getValue() ?? '—'}
+                </FitText>
+              </span>
+              <span className="muted" style={{ fontSize: '10px' }}>{displayDate}</span>
+            </div>
+          );
+        },
        meta: { align: 'right', cellClassName: 'value-cell', width: columnWidthMap.estimateNav },
      },
      {
@@ -746,7 +829,7 @@ export default function MobileFundTable({
        meta: { align: 'right', cellClassName: 'holding-cell', width: columnWidthMap.holdingProfit },
      },
    ],
-    [currentTab, favorites, refreshing, columnWidthMap, showFullFundName, getFundCardProps]
+    [currentTab, favorites, refreshing, columnWidthMap, showFullFundName, getFundCardProps, isNameSortMode, sortBy]
  );

  const table = useReactTable({
@@ -934,7 +1017,7 @@ export default function MobileFundTable({
                    >
                      {(setActivatorNodeRef, listeners) => (
                        <div
-                          ref={sortBy === 'default' ? setActivatorNodeRef : undefined}
+                          ref={sortBy === 'default' && !isNameSortMode ? setActivatorNodeRef : undefined}
                          className="table-row"
                          style={{
                            background: 'var(--bg)',
@@ -942,7 +1025,8 @@ export default function MobileFundTable({
                            zIndex: 1,
                            ...(mobileGridLayout.gridTemplateColumns ? { gridTemplateColumns: mobileGridLayout.gridTemplateColumns } : {}),
                          }}
-                          {...(sortBy === 'default' ? listeners : {})}
+                          onClick={isNameSortMode ? () => setIsNameSortMode(false) : undefined}
+                          {...(sortBy === 'default' && !isNameSortMode ? listeners : {})}
                        >
                          {row.getVisibleCells().map((cell, cellIndex) => {
                            const columnId = cell.column.id;
--- a/app/components/MobileSettingModal.jsx
+++ b/app/components/MobileSettingModal.jsx
@@ -198,6 +198,8 @@ export default function MobileSettingModal({
            key="mobile-reset-confirm"
            title="重置表头设置"
            message="是否重置表头顺序和显示/隐藏为默认值？"
+            icon={<ResetIcon width="20" height="20" className="shrink-0 text-[var(--primary)]" />}
+            confirmVariant="primary"
            onConfirm={() => {
              onResetColumnOrder?.();
              onResetColumnVisibility?.();
--- a/app/components/PcFundTable.jsx
+++ b/app/components/PcFundTable.jsx
@@ -34,7 +34,7 @@ import {
  DialogHeader,
  DialogTitle,
 } from '@/components/ui/dialog';
-import { CloseIcon, DragIcon, ExitIcon, SettingsIcon, StarIcon, TrashIcon } from './Icons';
+import { CloseIcon, DragIcon, ExitIcon, SettingsIcon, StarIcon, TrashIcon, ResetIcon } from './Icons';

 const NON_FROZEN_COLUMN_IDS = [
  'yesterdayChangePercent',
@@ -412,7 +412,12 @@ export default function PcFundTable({
        return;
      }

-      setShowPortalHeader(rect.top <= nextStickyTop);
+      const headerEl = tableEl?.querySelector('.table-header-row');
+      const headerHeight = headerEl?.getBoundingClientRect?.().height ?? 0;
+      const hasPassedHeader = (rect.top + headerHeight) <= nextStickyTop;
+      const hasTableInView = rect.bottom > nextStickyTop;
+
+      setShowPortalHeader(hasPassedHeader && hasTableInView);

      setPortalHorizontal((prev) => {
        const next = {
@@ -561,11 +566,20 @@ export default function PcFundTable({
        header: '最新净值',
        size: 100,
        minSize: 80,
-        cell: (info) => (
-          <FitText style={{ fontWeight: 700 }} maxFontSize={14} minFontSize={10}>
-            {info.getValue() ?? '—'}
-          </FitText>
-        ),
+        cell: (info) => {
+          const original = info.row.original || {};
+          const date = original.latestNavDate ?? '-';
+          return (
+            <div style={{ display: 'flex', flexDirection: 'column', alignItems: 'flex-end', gap: 0 }}>
+              <FitText style={{ fontWeight: 700 }} maxFontSize={14} minFontSize={10} as="div">
+                {info.getValue() ?? '—'}
+              </FitText>
+              <span className="muted" style={{ fontSize: '11px' }}>
+                {date}
+              </span>
+            </div>
+          );
+        },
        meta: {
          align: 'right',
          cellClassName: 'value-cell',
@@ -576,11 +590,20 @@ export default function PcFundTable({
        header: '估算净值',
        size: 100,
        minSize: 80,
-        cell: (info) => (
-          <FitText style={{ fontWeight: 700 }} maxFontSize={14} minFontSize={10}>
-            {info.getValue() ?? '—'}
-          </FitText>
-        ),
+        cell: (info) => {
+          const original = info.row.original || {};
+          const date = original.estimateNavDate ?? '-';
+          return (
+            <div style={{ display: 'flex', flexDirection: 'column', alignItems: 'flex-end', gap: 0 }}>
+              <FitText style={{ fontWeight: 700 }} maxFontSize={14} minFontSize={10} as="div">
+                {info.getValue() ?? '—'}
+              </FitText>
+              <span className="muted" style={{ fontSize: '11px' }}>
+                {date}
+              </span>
+            </div>
+          );
+        },
        meta: {
          align: 'right',
          cellClassName: 'value-cell',
@@ -1112,6 +1135,8 @@ export default function PcFundTable({
        <ConfirmModal
          title="重置列宽"
          message="是否重置表格列宽为默认值？"
+          icon={<ResetIcon width="20" height="20" className="shrink-0 text-[var(--primary)]" />}
+          confirmVariant="primary"
          onConfirm={handleResetSizing}
          onCancel={() => setResetConfirmOpen(false)}
          confirmText="重置"
--- a/app/components/PcTableSettingModal.jsx
+++ b/app/components/PcTableSettingModal.jsx
@@ -267,6 +267,8 @@ export default function PcTableSettingModal({
          key="reset-order-confirm"
          title="重置表头设置"
          message="是否重置表头顺序和显示/隐藏为默认值？"
+          icon={<ResetIcon width="20" height="20" className="shrink-0 text-[var(--primary)]" />}
+          confirmVariant="primary"
          onConfirm={() => {
            onResetColumnOrder?.();
            onResetColumnVisibility?.();
--- a/app/components/SettingsModal.jsx
+++ b/app/components/SettingsModal.jsx
@@ -1,6 +1,8 @@
-'use client';
+"use client";

-import { useEffect, useState } from 'react';
+import { useEffect, useRef, useState } from "react";
+import { Dialog, DialogContent, DialogTitle } from '@/components/ui/dialog';
+import { Progress } from '@/components/ui/progress';
 import ConfirmModal from './ConfirmModal';
 import { ResetIcon, SettingsIcon } from './Icons';

@@ -20,6 +22,22 @@ export default function SettingsModal({
 }) {
  const [sliderDragging, setSliderDragging] = useState(false);
  const [resetWidthConfirmOpen, setResetWidthConfirmOpen] = useState(false);
+  const [localSeconds, setLocalSeconds] = useState(tempSeconds);
+  const pageWidthTrackRef = useRef(null);
+
+  const clampedWidth = Math.min(2000, Math.max(600, Number(containerWidth) || 1200));
+  const pageWidthPercent = ((clampedWidth - 600) / (2000 - 600)) * 100;
+
+  const updateWidthByClientX = (clientX) => {
+    if (!pageWidthTrackRef.current || !setContainerWidth) return;
+    const rect = pageWidthTrackRef.current.getBoundingClientRect();
+    if (!rect.width) return;
+    const ratio = (clientX - rect.left) / rect.width;
+    const clampedRatio = Math.min(1, Math.max(0, ratio));
+    const rawWidth = 600 + clampedRatio * (2000 - 600);
+    const snapped = Math.round(rawWidth / 10) * 10;
+    setContainerWidth(snapped);
+  };

  useEffect(() => {
    if (!sliderDragging) return;
@@ -32,129 +50,158 @@ export default function SettingsModal({
    };
  }, [sliderDragging]);

+  // 外部的 tempSeconds 变更时，同步到本地显示，但不立即生效
+  useEffect(() => {
+    setLocalSeconds(tempSeconds);
+  }, [tempSeconds]);
+
  return (
-    <div
-      className={`modal-overlay ${sliderDragging ? 'modal-overlay-translucent' : ''}`}
-      role="dialog"
-      aria-modal="true"
-      aria-label="设置"
-      onClick={onClose}
+    <Dialog
+      open
+      onOpenChange={(open) => {
+        if (!open) onClose?.();
+      }}
    >
-      <div className="glass card modal" onClick={(e) => e.stopPropagation()}>
-        <div className="title" style={{ marginBottom: 12 }}>
-          <SettingsIcon width="20" height="20" />
-          <span>设置</span>
-        </div>
-
-        <div className="form-group" style={{ marginBottom: 16 }}>
-          <div className="muted" style={{ marginBottom: 8, fontSize: '0.8rem' }}>刷新频率</div>
-          <div className="chips" style={{ marginBottom: 12 }}>
-            {[30, 60, 120, 300].map((s) => (
-              <button
-                key={s}
-                type="button"
-                className={`chip ${tempSeconds === s ? 'active' : ''}`}
-                onClick={() => setTempSeconds(s)}
-                aria-pressed={tempSeconds === s}
-              >
-                {s} 秒
-              </button>
-            ))}
+      <DialogContent
+        overlayClassName={`modal-overlay ${sliderDragging ? 'modal-overlay-translucent' : ''} z-[9999]`}
+        className="!p-0 z-[10000]"
+        showCloseButton={false}
+      >
+        <div className="glass card modal">
+          <div className="title" style={{ marginBottom: 12 }}>
+            <SettingsIcon width="20" height="20" />
+            <DialogTitle asChild>
+              <span>设置</span>
+            </DialogTitle>
          </div>
-          <input
-            className="input"
-            type="number"
-            inputMode="numeric"
-            min="30"
-            step="5"
-            value={tempSeconds}
-            onChange={(e) => setTempSeconds(Number(e.target.value))}
-            placeholder="自定义秒数"
-          />
-          {tempSeconds < 30 && (
-            <div className="error-text" style={{ marginTop: 8 }}>
-              最小 30 秒
-            </div>
-          )}
-        </div>

-        {!isMobile && setContainerWidth && (
          <div className="form-group" style={{ marginBottom: 16 }}>
-            <div style={{ display: 'flex', alignItems: 'center', gap: 6, marginBottom: 8 }}>
-              <div className="muted" style={{ fontSize: '0.8rem' }}>页面宽度</div>
-              {onResetContainerWidth && (
+            <div className="muted" style={{ marginBottom: 8, fontSize: '0.8rem' }}>刷新频率</div>
+            <div className="chips" style={{ marginBottom: 12 }}>
+              {[30, 60, 120, 300].map((s) => (
                <button
+                  key={s}
                  type="button"
-                  className="icon-button"
-                  onClick={() => setResetWidthConfirmOpen(true)}
-                  title="重置页面宽度"
-                  style={{
-                    border: 'none',
-                    width: '24px',
-                    height: '24px',
-                    padding: 0,
-                    backgroundColor: 'transparent',
-                    color: 'var(--muted)',
+                className={`chip ${localSeconds === s ? 'active' : ''}`}
+                onClick={() => setLocalSeconds(s)}
+                aria-pressed={localSeconds === s}
+                >
+                  {s} 秒
+                </button>
+              ))}
+            </div>
+            <input
+              className="input"
+              type="number"
+              inputMode="numeric"
+              min="30"
+              step="5"
+            value={localSeconds}
+            onChange={(e) => setLocalSeconds(Number(e.target.value))}
+              placeholder="自定义秒数"
+            />
+          {localSeconds < 30 && (
+              <div className="error-text" style={{ marginTop: 8 }}>
+                最小 30 秒
+              </div>
+            )}
+          </div>
+
+          {!isMobile && setContainerWidth && (
+            <div className="form-group" style={{ marginBottom: 16 }}>
+              <div style={{ display: 'flex', alignItems: 'center', gap: 6, marginBottom: 8 }}>
+                <div className="muted" style={{ fontSize: '0.8rem' }}>页面宽度</div>
+                {onResetContainerWidth && (
+                  <button
+                    type="button"
+                    className="icon-button"
+                    onClick={() => setResetWidthConfirmOpen(true)}
+                    title="重置页面宽度"
+                    style={{
+                      border: 'none',
+                      width: '24px',
+                      height: '24px',
+                      padding: 0,
+                      backgroundColor: 'transparent',
+                      color: 'var(--muted)',
+                    }}
+                  >
+                    <ResetIcon width="14" height="14" />
+                  </button>
+                )}
+              </div>
+              <div style={{ display: 'flex', alignItems: 'center', gap: 12 }}>
+                <div
+                  ref={pageWidthTrackRef}
+                  className="group relative"
+                  style={{ flex: 1, height: 14, cursor: 'pointer', display: 'flex', alignItems: 'center' }}
+                  onPointerDown={(e) => {
+                    setSliderDragging(true);
+                    updateWidthByClientX(e.clientX);
+                    e.currentTarget.setPointerCapture?.(e.pointerId);
+                  }}
+                  onPointerMove={(e) => {
+                    if (!sliderDragging) return;
+                    updateWidthByClientX(e.clientX);
                  }}
                >
-                  <ResetIcon width="14" height="14" />
-                </button>
-              )}
-            </div>
-            <div style={{ display: 'flex', alignItems: 'center', gap: 12 }}>
-              <input
-                type="range"
-                min={600}
-                max={2000}
-                step={10}
-                value={Math.min(2000, Math.max(600, Number(containerWidth) || 1200))}
-                onChange={(e) => setContainerWidth(Number(e.target.value))}
-                onPointerDown={() => setSliderDragging(true)}
-                className="page-width-slider"
-                style={{
-                  flex: 1,
-                  height: 6,
-                  accentColor: 'var(--primary)',
-                }}
-              />
-              <span className="muted" style={{ fontSize: '0.8rem', minWidth: 48 }}>
-                {Math.min(2000, Math.max(600, Number(containerWidth) || 1200))}px
-              </span>
-            </div>
-          </div>
-        )}
-
-        <div className="form-group" style={{ marginBottom: 16 }}>
-          <div className="muted" style={{ marginBottom: 8, fontSize: '0.8rem' }}>数据导出</div>
-          <div className="row" style={{ gap: 8 }}>
-            <button type="button" className="button" onClick={exportLocalData}>导出配置</button>
-          </div>
-          <div className="muted" style={{ marginBottom: 8, fontSize: '0.8rem', marginTop: 26 }}>数据导入</div>
-          <div className="row" style={{ gap: 8, marginTop: 8 }}>
-            <button type="button" className="button" onClick={() => importFileRef.current?.click?.()}>导入配置</button>
-          </div>
-          <input
-            ref={importFileRef}
-            type="file"
-            accept="application/json"
-            style={{ display: 'none' }}
-            onChange={handleImportFileChange}
-          />
-          {importMsg && (
-            <div className="muted" style={{ marginTop: 8 }}>
-              {importMsg}
+                  <Progress value={pageWidthPercent} />
+                  <div
+                    className="pointer-events-none absolute top-1/2 -translate-y-1/2"
+                    style={{ left: `${pageWidthPercent}%`, transform: 'translate(-50%, -50%)' }}
+                  >
+                    <div
+                      className="h-3 w-3 rounded-full bg-primary shadow-md shadow-primary/40"
+                    />
+                  </div>
+                </div>
+                <span className="muted" style={{ fontSize: '0.8rem', minWidth: 48 }}>
+                  {clampedWidth}px
+                </span>
+              </div>
            </div>
          )}
-        </div>

-        <div className="row" style={{ justifyContent: 'flex-end', marginTop: 24 }}>
-          <button className="button" onClick={saveSettings} disabled={tempSeconds < 30}>保存并关闭</button>
+          <div className="form-group" style={{ marginBottom: 16 }}>
+            <div className="muted" style={{ marginBottom: 8, fontSize: '0.8rem' }}>数据导出</div>
+            <div className="row" style={{ gap: 8 }}>
+              <button type="button" className="button" onClick={exportLocalData}>导出配置</button>
+            </div>
+            <div className="muted" style={{ marginBottom: 8, fontSize: '0.8rem', marginTop: 26 }}>数据导入</div>
+            <div className="row" style={{ gap: 8, marginTop: 8 }}>
+              <button type="button" className="button" onClick={() => importFileRef.current?.click?.()}>导入配置</button>
+            </div>
+            <input
+              ref={importFileRef}
+              type="file"
+              accept="application/json"
+              style={{ display: 'none' }}
+              onChange={handleImportFileChange}
+            />
+            {importMsg && (
+              <div className="muted" style={{ marginTop: 8 }}>
+                {importMsg}
+              </div>
+            )}
+          </div>
+
+          <div className="row" style={{ justifyContent: 'flex-end', marginTop: 24 }}>
+            <button
+              className="button"
+              onClick={(e) => saveSettings(e, localSeconds)}
+              disabled={localSeconds < 30}
+            >
+              保存并关闭
+            </button>
+          </div>
        </div>
-      </div>
+      </DialogContent>
      {resetWidthConfirmOpen && onResetContainerWidth && (
        <ConfirmModal
          title="重置页面宽度"
          message="是否重置页面宽度为默认值 1200px？"
+          icon={<ResetIcon width="20" height="20" className="shrink-0 text-[var(--primary)]" />}
+          confirmVariant="primary"
          onConfirm={() => {
            onResetContainerWidth();
            setResetWidthConfirmOpen(false);
@@ -163,6 +210,6 @@ export default function SettingsModal({
          confirmText="重置"
        />
      )}
-    </div>
+    </Dialog>
  );
 }
--- a/app/components/WeChatModal.jsx
+++ b/app/components/WeChatModal.jsx
@@ -34,6 +34,12 @@ export default function WeChatModal({ onClose }) {
            <CloseIcon width="20" height="20" />
          </button>
        </div>
+        <div
+          className="trade-pending-alert"
+          onClick={() => setShowPendingList(true)}
+        >
+          <span>⚠️ 入群须知：禁止讨论和基金买卖以及投资的有关内容，可反馈软件相关需求和问题。</span>
+        </div>
        <div style={{ display: 'flex', justifyContent: 'center' }}>
          <Image
            src={weChatGroupImg}
--- a/app/globals.css
+++ b/app/globals.css
@@ -1695,6 +1695,11 @@ input[type="number"] {
    padding-left: 12px;
  }

+  /* 基金名称表头排序按钮在排序模式下的高亮 */
+  .mobile-fund-table .mobile-fund-table-header .icon-button.active {
+    color: var(--primary);
+  }
+
  .mobile-fund-table .table-row .name-cell .name-cell-content {
    min-height: 100%;
  }
@@ -2073,7 +2078,6 @@ input[type="number"] {

 /* shadcn Dialog：符合项目规范(ui-ux-pro-max)，适配亮/暗主题，略微玻璃拟态 */
 [data-slot="dialog-content"] {
-  background: rgba(17, 24, 39, 0.96);
  backdrop-filter: blur(8px);
  -webkit-backdrop-filter: blur(8px);
 }
--- a/app/layout.jsx
+++ b/app/layout.jsx
@@ -1,3 +1,4 @@
+import { Toaster } from '@/components/ui/sonner';
 import './globals.css';
 import AnalyticsGate from './components/AnalyticsGate';
 import packageJson from '../package.json';
@@ -27,8 +28,9 @@ export default function RootLayout({ children }) {
      />
    </head>
    <body>
-    <AnalyticsGate GA_ID={GA_ID} />
-    {children}
+      <AnalyticsGate GA_ID={GA_ID} />
+      {children}
+      <Toaster />
    </body>
    </html>
  );
--- a/app/page.jsx
+++ b/app/page.jsx
@@ -61,6 +61,7 @@ import WeChatModal from "./components/WeChatModal";
 import DcaModal from "./components/DcaModal";
 import githubImg from "./assets/github.svg";
 import { supabase, isSupabaseConfigured } from './lib/supabase';
+import { toast as sonnerToast } from 'sonner';
 import { recordValuation, getAllValuationSeries, clearFund } from './lib/valuationTimeseries';
 import { loadHolidaysForYears, isTradingDay as isDateTradingDay } from './lib/tradingCalendar';
 import { parseFundTextWithLLM, fetchFundData, fetchLatestRelease, fetchShanghaiIndexDate, fetchSmartFundNetValue, searchFunds } from './api/fund';
@@ -659,7 +660,9 @@ export default function HomePage() {
          isUpdated: f.jzrq === todayStr,
          hasDca: dcaPlans[f.code]?.enabled === true,
          latestNav,
+          latestNavDate: yesterdayDate,
          estimateNav,
+          estimateNavDate: estimateTime,
          yesterdayChangePercent,
          yesterdayChangeValue,
          yesterdayDate,
@@ -2585,9 +2588,11 @@ export default function HomePage() {
    await refreshAll(codes);
  };

-  const saveSettings = (e) => {
+  const saveSettings = (e, secondsOverride) => {
    e?.preventDefault?.();
-    const ms = Math.max(30, Number(tempSeconds)) * 1000;
+    const seconds = secondsOverride ?? tempSeconds;
+    const ms = Math.max(30, Number(seconds)) * 1000;
+    setTempSeconds(Math.round(ms / 1000));
    setRefreshMs(ms);
    storageHelper.setItem('refreshMs', String(ms));
    const w = Math.min(2000, Math.max(600, Number(containerWidth) || 1200));
@@ -3067,9 +3072,6 @@ export default function HomePage() {
      const dataToSync = payload || collectLocalPayload(); // Fallback to full sync if no payload
      const now = nowInTz().toISOString();

-      let upsertData = null;
-      let updateError = null;
-
      if (isPartial) {
        // 增量更新：使用 RPC 调用
        const { error: rpcError } = await supabase.rpc('update_user_config_partial', {
@@ -3080,7 +3082,7 @@ export default function HomePage() {
          console.error('增量同步失败，尝试全量同步', rpcError);
          // RPC 失败回退到全量更新
          const fullPayload = collectLocalPayload();
-          const { data, error } = await supabase
+          const { error } = await supabase
            .from('user_configs')
            .upsert(
              {
@@ -3089,17 +3091,12 @@ export default function HomePage() {
                updated_at: now
              },
              { onConflict: 'user_id' }
-            )
-            .select();
-          upsertData = data;
-          updateError = error;
-        } else {
-          // RPC 成功，模拟 upsertData 格式以便后续逻辑通过
-          upsertData = [{ id: 'rpc_success' }];
+            );
+          if (error) throw error;
        }
      } else {
        // 全量更新
-        const { data, error } = await supabase
+        const { error } = await supabase
          .from('user_configs')
          .upsert(
            {
@@ -3108,15 +3105,8 @@ export default function HomePage() {
              updated_at: now
            },
            { onConflict: 'user_id' }
-          )
-          .select();
-        upsertData = data;
-        updateError = error;
-      }
-
-      if (updateError) throw updateError;
-      if (!upsertData || upsertData.length === 0) {
-        throw new Error('同步失败：未写入任何数据，请检查账号状态或重新登录');
+          );
+        if (error) throw error;
      }

      storageHelper.setItem('localUpdatedAt', now);
@@ -4210,6 +4200,7 @@ export default function HomePage() {
          <ConfirmModal
            title="确认登出"
            message="确定要退出当前账号吗？"
+            icon={<LogoutIcon width="20" height="20" className="shrink-0 text-[var(--danger)]" />}
            confirmText="确认登出"
            onConfirm={() => {
              setLogoutConfirmOpen(false);
@@ -4229,6 +4220,10 @@ export default function HomePage() {
            <button
              className="link-button"
              onClick={() => {
+                if (!user?.id) {
+                  sonnerToast.error('请先登录后再提交反馈');
+                  return;
+                }
                setFeedbackNonce((n) => n + 1);
                setFeedbackOpen(true);
              }}
--- a/components/ui/dialog.jsx
+++ b/components/ui/dialog.jsx
@@ -49,11 +49,12 @@ function DialogContent({
  className,
  children,
  showCloseButton = true,
+  overlayClassName,
  ...props
 }) {
  return (
    <DialogPortal data-slot="dialog-portal">
-      <DialogOverlay />
+      <DialogOverlay className={overlayClassName} />
      <DialogPrimitive.Content
        data-slot="dialog-content"
        className={cn(
--- a/components/ui/progress.jsx
+++ b/components/ui/progress.jsx
@@ -0,0 +1,43 @@
+"use client"
+
+import * as React from "react"
+import { Progress as ProgressPrimitive } from "radix-ui"
+
+import { cn } from "@/lib/utils"
+
+function Progress({
+  className,
+  value,
+  ...props
+}) {
+  return (
+    <ProgressPrimitive.Root
+      data-slot="progress"
+      className={cn(
+        // 细高条，轻玻璃质感，统一用 CSS 变量
+        "relative w-full overflow-hidden rounded-full",
+        "h-1.5 sm:h-1.5",
+        "bg-[var(--input)]/70 dark:bg-[var(--input)]/40",
+        "border border-[var(--border)]/80 dark:border-[var(--border)]/80",
+        "shadow-[0_0_0_1px_rgba(15,23,42,0.02)] dark:shadow-[0_0_0_1px_rgba(15,23,42,0.6)]",
+        className
+      )}
+      {...props}>
+      <ProgressPrimitive.Indicator
+        data-slot="progress-indicator"
+        className={cn(
+          "h-full w-full flex-1",
+          // 金融风轻渐变，兼容明暗主题
+          "bg-gradient-to-r from-[var(--primary)] to-[var(--primary)]/80",
+          "dark:from-[var(--primary)] dark:to-[var(--secondary)]/90",
+          // 柔和发光，不喧宾夺主
+          "shadow-[0_0_8px_rgba(245,158,11,0.35)] dark:shadow-[0_0_14px_rgba(245,158,11,0.45)]",
+          // 平滑进度动画
+          "transition-[transform,box-shadow] duration-250 ease-out"
+        )}
+        style={{ transform: `translateX(-${100 - (value || 0)}%)` }} />
+    </ProgressPrimitive.Root>
+  );
+}
+
+export { Progress }
--- a/components/ui/sonner.jsx
+++ b/components/ui/sonner.jsx
@@ -0,0 +1,61 @@
+"use client"
+
+import {
+  CircleCheckIcon,
+  InfoIcon,
+  Loader2Icon,
+  OctagonXIcon,
+  TriangleAlertIcon,
+} from "lucide-react"
+import { useTheme } from "next-themes"
+import { Toaster as Sonner } from "sonner";
+
+const Toaster = ({ ...props }) => {
+  const { theme = "system" } = useTheme();
+
+  return (
+    <Sonner
+      theme={theme}
+      // 外层容器：固定在页面顶部中间
+      className="toaster pointer-events-none fixed inset-x-0 top-4 z-[70] flex items-start justify-center px-4 sm:top-6"
+      icons={{
+        success: <CircleCheckIcon className="h-4 w-4 text-emerald-500" />,
+        info: <InfoIcon className="h-4 w-4 text-sky-500" />,
+        warning: <TriangleAlertIcon className="h-4 w-4 text-amber-500" />,
+        error: <OctagonXIcon className="h-4 w-4 text-destructive" />,
+        loading: <Loader2Icon className="h-4 w-4 animate-spin text-primary" />,
+      }}
+      richColors
+      // 统一 toast 样式，使用 ui-ux-pro-max 建议的明暗主题对比度
+      toastOptions={{
+        classNames: {
+          toast:
+            // 基础：浅色模式下使用高对比白色卡片，暗色模式使用深色卡片
+            "pointer-events-auto relative flex w-full max-w-sm items-start gap-3 rounded-xl border border-slate-200 bg-white/90 text-slate-900 px-4 py-3 shadow-lg shadow-black/10 backdrop-blur-md transition-all duration-200 " +
+            "data-[state=open]:animate-in data-[state=open]:fade-in data-[state=open]:slide-in-from-top sm:data-[state=open]:slide-in-from-bottom " +
+            "data-[state=closed]:animate-out data-[state=closed]:fade-out data-[state=closed]:slide-out-to-right " +
+            "data-[swipe=move]:translate-x-[var(--sonner-swipe-move-x)] data-[swipe=move]:transition-none " +
+            "data-[swipe=cancel]:translate-x-0 data-[swipe=cancel]:transition-transform data-[swipe=end]:translate-x-[var(--sonner-swipe-end-x)] " +
+            "dark:border-slate-800 dark:bg-slate-900/90 dark:text-slate-100",
+          title: "text-sm font-medium",
+          description: "mt-1 text-xs text-slate-600 dark:text-slate-400",
+          closeButton:
+            "cursor-pointer text-muted-foreground/70 transition-colors hover:text-foreground focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2",
+          actionButton:
+            "inline-flex h-8 items-center justify-center rounded-full bg-primary px-3 text-xs font-medium text-primary-foreground shadow-sm transition-colors hover:bg-primary/90 focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-primary focus-visible:ring-offset-2",
+          cancelButton:
+            "inline-flex h-8 items-center justify-center rounded-full border border-border bg-background px-3 text-xs font-medium text-foreground shadow-sm transition-colors hover:bg-accent hover:text-accent-foreground focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2",
+          // 状态色：成功/信息/警告只强化边框，错误使用红色背景，满足你“提示为红色”的需求
+          success: "border-emerald-500/70",
+          info: "border-sky-500/70",
+          warning: "border-amber-500/70",
+          error: "bg-destructive text-destructive-foreground border-destructive/80",
+          loading: "border-primary/60",
+        },
+      }}
+      {...props}
+    />
+  );
+};
+
+export { Toaster }
--- a/package-lock.json
+++ b/package-lock.json
@@ -1,12 +1,12 @@
 {
  "name": "real-time-fund",
-  "version": "0.2.2",
+  "version": "0.2.3",
  "lockfileVersion": 3,
  "requires": true,
  "packages": {
    "": {
      "name": "real-time-fund",
-      "version": "0.2.2",
+      "version": "0.2.3",
      "dependencies": {
        "@dicebear/collection": "^9.3.1",
        "@dicebear/core": "^9.3.1",
@@ -26,10 +26,12 @@
        "lodash": "^4.17.23",
        "lucide-react": "^0.577.0",
        "next": "^16.1.5",
+        "next-themes": "^0.4.6",
        "radix-ui": "^1.4.3",
        "react": "18.3.1",
        "react-chartjs-2": "^5.3.1",
        "react-dom": "18.3.1",
+        "sonner": "^2.0.7",
        "tailwind-merge": "^3.5.0",
        "tesseract.js": "^5.1.1",
        "uuid": "^13.0.0",
@@ -9903,6 +9905,16 @@
        }
      }
    },
+    "node_modules/next-themes": {
+      "version": "0.4.6",
+      "resolved": "https://registry.npmmirror.com/next-themes/-/next-themes-0.4.6.tgz",
+      "integrity": "sha512-pZvgD5L0IEvX5/9GWyHMf3m8BKiVQwsCMHfoFosXtXBMnaS0ZnIJ9ST4b4NqLVKDEm8QBxoNNGNaBv2JNF6XNA==",
+      "license": "MIT",
+      "peerDependencies": {
+        "react": "^16.8 || ^17 || ^18 || ^19 || ^19.0.0-rc",
+        "react-dom": "^16.8 || ^17 || ^18 || ^19 || ^19.0.0-rc"
+      }
+    },
    "node_modules/next/node_modules/postcss": {
      "version": "8.4.31",
      "resolved": "https://registry.npmjs.org/postcss/-/postcss-8.4.31.tgz",
@@ -11669,6 +11681,16 @@
        "url": "https://github.com/chalk/ansi-styles?sponsor=1"
      }
    },
+    "node_modules/sonner": {
+      "version": "2.0.7",
+      "resolved": "https://registry.npmmirror.com/sonner/-/sonner-2.0.7.tgz",
+      "integrity": "sha512-W6ZN4p58k8aDKA4XPcx2hpIQXBRAgyiWVkYhT7CvK6D3iAu7xjvVyhQHg2/iaKJZ1XVJ4r7XuwGL+WGEK37i9w==",
+      "license": "MIT",
+      "peerDependencies": {
+        "react": "^18.0.0 || ^19.0.0 || ^19.0.0-rc",
+        "react-dom": "^18.0.0 || ^19.0.0 || ^19.0.0-rc"
+      }
+    },
    "node_modules/source-map": {
      "version": "0.6.1",
      "resolved": "https://registry.npmjs.org/source-map/-/source-map-0.6.1.tgz",
--- a/package.json
+++ b/package.json
@@ -1,6 +1,6 @@
 {
  "name": "real-time-fund",
-  "version": "0.2.2",
+  "version": "0.2.3",
  "private": true,
  "scripts": {
    "dev": "next dev",
@@ -29,10 +29,12 @@
    "lodash": "^4.17.23",
    "lucide-react": "^0.577.0",
    "next": "^16.1.5",
+    "next-themes": "^0.4.6",
    "radix-ui": "^1.4.3",
    "react": "18.3.1",
    "react-chartjs-2": "^5.3.1",
    "react-dom": "18.3.1",
+    "sonner": "^2.0.7",
    "tailwind-merge": "^3.5.0",
    "tesseract.js": "^5.1.1",
    "uuid": "^13.0.0",
Author	SHA1	Message	Date
hzm	c71759153f	feat：发布 0.2.3	2026-03-09 22:26:35 +08:00
hzm	a4a881860b	feat：表格列最新净值和估算净值增加日期显示	2026-03-09 21:32:03 +08:00
hzm	95514eb52f	feat：更新用户支持群二维码	2026-03-09 21:16:23 +08:00
hzm	9516a4f874	feat: 微信群弹框增加入群须知描述	2026-03-09 21:00:28 +08:00
hzm	750e72823b	feat: 反馈前需登录	2026-03-09 20:46:59 +08:00
hzm	c3515c7011	feat: 优化定投样式	2026-03-09 20:22:08 +08:00
hzm	f39f152efa	feat: 部分二次确认弹框样式调整	2026-03-09 20:16:04 +08:00
hzm	d4255fc1c8	feat: 设置弹框组件样式调整	2026-03-09 20:00:18 +08:00
hzm	480abbcf47	fix: 删除记录弹框层级问题	2026-03-09 19:24:09 +08:00
hzm	3ed129afb2	fix: PC端表头初始化渲染问题	2026-03-09 17:23:59 +08:00
hzm	5f909cc669	feat: supabase upsert 操作不再返回 select 信息以减少 edgress 流量	2026-03-09 10:55:45 +08:00
hzm	f379c9fef5	feat：改进移动端表格行排序形式	2026-03-09 08:41:01 +08:00
hzm	412b22ec1c	feat：Dialog 组件内容背景色统一	2026-03-09 08:19:02 +08:00