更新Company页面的UI为FUI风格
This commit is contained in:
@@ -14,7 +14,6 @@ import {
|
|||||||
VStack,
|
VStack,
|
||||||
HStack,
|
HStack,
|
||||||
Spinner,
|
Spinner,
|
||||||
useColorModeValue,
|
|
||||||
Tag,
|
Tag,
|
||||||
Center,
|
Center,
|
||||||
List,
|
List,
|
||||||
@@ -29,15 +28,15 @@ export function SearchBar(props) {
|
|||||||
const navigate = useNavigate();
|
const navigate = useNavigate();
|
||||||
const containerRef = useRef(null);
|
const containerRef = useRef(null);
|
||||||
|
|
||||||
// 颜色配置
|
// 颜色配置 - 固定使用深色主题
|
||||||
const searchIconColor = useColorModeValue("gray.500", "gray.400");
|
const searchIconColor = "gray.400";
|
||||||
const inputBg = useColorModeValue("white", "whiteAlpha.100");
|
const inputBg = "whiteAlpha.100";
|
||||||
const dropdownBg = useColorModeValue("white", "#1a1a2e");
|
const dropdownBg = "#1a1a2e";
|
||||||
const borderColor = useColorModeValue("gray.200", "whiteAlpha.200");
|
const borderColor = "rgba(212, 175, 55, 0.3)";
|
||||||
const hoverBg = useColorModeValue("gray.50", "whiteAlpha.100");
|
const hoverBg = "whiteAlpha.100";
|
||||||
const textColor = useColorModeValue("gray.800", "white");
|
const textColor = "white";
|
||||||
const subTextColor = useColorModeValue("gray.500", "whiteAlpha.600");
|
const subTextColor = "whiteAlpha.600";
|
||||||
const accentColor = useColorModeValue("blue.500", "#D4AF37");
|
const accentColor = "#D4AF37";
|
||||||
|
|
||||||
// 使用搜索 Hook
|
// 使用搜索 Hook
|
||||||
const {
|
const {
|
||||||
|
|||||||
@@ -22,9 +22,10 @@ import type { ActualControl } from "../../types";
|
|||||||
import { THEME } from "../../BasicInfoTab/config";
|
import { THEME } from "../../BasicInfoTab/config";
|
||||||
|
|
||||||
// 格式化工具函数
|
// 格式化工具函数
|
||||||
|
// 注意:API 返回的数据单位已经是 %,无需再乘 100
|
||||||
const formatPercentage = (value: number | null | undefined): string => {
|
const formatPercentage = (value: number | null | undefined): string => {
|
||||||
if (value === null || value === undefined) return "-";
|
if (value === null || value === undefined) return "-";
|
||||||
return `${(value * 100).toFixed(2)}%`;
|
return `${value.toFixed(2)}%`;
|
||||||
};
|
};
|
||||||
|
|
||||||
const formatShares = (value: number | null | undefined): string => {
|
const formatShares = (value: number | null | undefined): string => {
|
||||||
|
|||||||
@@ -21,9 +21,10 @@ import type { Concentration } from "../../types";
|
|||||||
import { THEME } from "../../BasicInfoTab/config";
|
import { THEME } from "../../BasicInfoTab/config";
|
||||||
|
|
||||||
// 格式化工具函数
|
// 格式化工具函数
|
||||||
|
// 注意:API 返回的数据单位已经是 %,无需再乘 100
|
||||||
const formatPercentage = (value: number | null | undefined): string => {
|
const formatPercentage = (value: number | null | undefined): string => {
|
||||||
if (value === null || value === undefined) return "-";
|
if (value === null || value === undefined) return "-";
|
||||||
return `${(value * 100).toFixed(2)}%`;
|
return `${value.toFixed(2)}%`;
|
||||||
};
|
};
|
||||||
|
|
||||||
const formatDate = (dateStr: string | null | undefined): string => {
|
const formatDate = (dateStr: string | null | undefined): string => {
|
||||||
@@ -66,6 +67,7 @@ const ConcentrationCard: React.FC<ConcentrationCardProps> = ({ concentration = [
|
|||||||
}, [concentration]);
|
}, [concentration]);
|
||||||
|
|
||||||
// 计算饼图数据
|
// 计算饼图数据
|
||||||
|
// 注意:API 返回的数据单位已经是 %,无需再乘 100
|
||||||
const pieData = useMemo(() => {
|
const pieData = useMemo(() => {
|
||||||
if (groupedData.length === 0) return [];
|
if (groupedData.length === 0) return [];
|
||||||
|
|
||||||
@@ -76,11 +78,11 @@ const ConcentrationCard: React.FC<ConcentrationCardProps> = ({ concentration = [
|
|||||||
const top10 = items["前10大股东"]?.holding_ratio || 0;
|
const top10 = items["前10大股东"]?.holding_ratio || 0;
|
||||||
|
|
||||||
return [
|
return [
|
||||||
{ name: "前1大股东", value: Number((top1 * 100).toFixed(2)) },
|
{ name: "前1大股东", value: Number(top1.toFixed(2)) },
|
||||||
{ name: "第2-3大股东", value: Number(((top3 - top1) * 100).toFixed(2)) },
|
{ name: "第2-3大股东", value: Number((top3 - top1).toFixed(2)) },
|
||||||
{ name: "第4-5大股东", value: Number(((top5 - top3) * 100).toFixed(2)) },
|
{ name: "第4-5大股东", value: Number((top5 - top3).toFixed(2)) },
|
||||||
{ name: "第6-10大股东", value: Number(((top10 - top5) * 100).toFixed(2)) },
|
{ name: "第6-10大股东", value: Number((top10 - top5).toFixed(2)) },
|
||||||
{ name: "其他股东", value: Number(((1 - top10) * 100).toFixed(2)) },
|
{ name: "其他股东", value: Number((100 - top10).toFixed(2)) },
|
||||||
].filter(item => item.value > 0);
|
].filter(item => item.value > 0);
|
||||||
}, [groupedData]);
|
}, [groupedData]);
|
||||||
|
|
||||||
|
|||||||
@@ -28,9 +28,10 @@ const TABLE_THEME = {
|
|||||||
};
|
};
|
||||||
|
|
||||||
// 格式化工具函数
|
// 格式化工具函数
|
||||||
|
// 注意:API 返回的数据单位已经是 %,无需再乘 100
|
||||||
const formatPercentage = (value: number | null | undefined): string => {
|
const formatPercentage = (value: number | null | undefined): string => {
|
||||||
if (value === null || value === undefined) return "-";
|
if (value === null || value === undefined) return "-";
|
||||||
return `${(value * 100).toFixed(2)}%`;
|
return `${value.toFixed(2)}%`;
|
||||||
};
|
};
|
||||||
|
|
||||||
const formatShares = (value: number | null | undefined): string => {
|
const formatShares = (value: number | null | undefined): string => {
|
||||||
|
|||||||
Reference in New Issue
Block a user