linfeng
/
staff_data
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

add

This commit is contained in:
ditiqi 2025-02-26 09:09:52 +08:00
parent 8bf670074d
commit 9c228e4c5f
3 changed files with 98 additions and 67 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

4
apps/web/src/app/admin/base-setting/page.tsx
View File

@ -40,7 +40,7 @@ export default function BaseSettingPage() {
form.setFieldsValue(baseSetting);
}
setIsFormChanged(false);
}
}
function onSaveClick() {
if (form) form.submit();
}
@ -56,7 +56,7 @@ export default function BaseSettingPage() {
meta: {
...baseSetting,
appConfig: {
...baseSetting.appConfig,
...(baseSetting?.appConfig || {}),
...appConfig,
},
},

34
apps/web/src/app/main/home/components/HeroSection.tsx
View File

@ -49,10 +49,26 @@ const HeroSection = () => {
const carouselRef = useRef<CarouselRef>(null);
const { statistics, baseSetting } = useAppConfig();
const platformStats: PlatformStat[] = [
{ icon: <TeamOutlined />, value: statistics.staffs.toString(), label: "注册学员" },
{ icon: <StarOutlined />, value: statistics.courses.toString(), label: "精品课程" },
{ icon: <BookOutlined />, value: statistics.lectures.toString(), label: '课程章节' },
{ icon: <EyeOutlined />, value: statistics.reads.toString(), label: "观看次数" },
{
icon: <TeamOutlined />,
value: statistics.staffs.toString(),
label: "注册学员",
},
{
icon: <StarOutlined />,
value: statistics.courses.toString(),
label: "精品课程",
},
{
icon: <BookOutlined />,
value: statistics.lectures.toString(),
label: "课程章节",
},
{
icon: <EyeOutlined />,
value: statistics.reads.toString(),
label: "观看次数",
},
];
const handlePrev = useCallback(() => {
carouselRef.current?.prev();
@ -61,10 +77,10 @@ const HeroSection = () => {
const handleNext = useCallback(() => {
carouselRef.current?.next();
}, []);
const { slides } = useAppConfig()
const { slides } = useAppConfig();
useEffect(() => {
console.log(statistics)
}, [statistics])
console.log(statistics);
}, [statistics]);
return (
<section className="relative ">
<div className="group">
@ -76,8 +92,8 @@ const HeroSection = () => {
dots={{
className: "carousel-dots !bottom-32 !z-20",
}}>
{Array.isArray(slides)?
(slides.map((item, index) => (
{Array.isArray(slides) ? (
slides.map((item, index) => (
<div key={index} className="relative h-[600px]">
<div
className="absolute inset-0 bg-cover bg-center transform transition-[transform,filter] duration-[2000ms] group-hover:scale-105 group-hover:brightness-110 will-change-[transform,filter]"

127
apps/web/src/components/common/uploader/MultiAvatarUploader.tsx
View File

@ -3,66 +3,81 @@ import { useEffect, useState } from "react";
import { Upload, Progress, Button, Image, Form } from "antd";
import { DeleteOutlined } from "@ant-design/icons";
import AvatarUploader from "./AvatarUploader";
import { isEqual } from 'lodash';
import { isEqual } from "lodash";
interface MultiAvatarUploaderProps {
value?: string[];
onChange?: (value: string[]) => void;
value?: string[];
onChange?: (value: string[]) => void;
}
export function MultiAvatarUploader({
value,
onChange,
value,
onChange,
}: MultiAvatarUploaderProps) {
const [imageList, setImageList] = useState<string[]>(value || [])
const [previewImage, setPreviewImage] = useState<string>("");
useEffect(() => {
if (!isEqual(value, imageList)) {
setImageList(value || []);
}
}, [value]);
useEffect(() => {
onChange?.(imageList)
}, [imageList])
return <>
<div className="flex gap-2 mb-2" style={{ width: "1200px" }}>
{imageList.map((image, index) => {
return (
<div className="mr-2px relative" key={index} style={{ width: "200px", height: "100px" }} >
<Image alt="" style={{ width: "200px", height: "100px" }} src={image}
preview={{
visible: previewImage === image,
onVisibleChange: (visible) =>
setPreviewImage(visible ? image || "" : "")
}} >
</Image>
<Button
type="text"
danger
icon={<DeleteOutlined className="text-red" />}
onClick={() => image && setImageList(imageList.filter((_, i) => i !== index))}
style={{
position: "absolute", // 绝对定位
top: "0", // 顶部对齐
right: "0", // 右侧对齐
zIndex: 1, // 确保按钮在图片上方
padding: "4px", // 调整按钮内边距
backgroundColor: "rgba(255, 255, 255, 0.2)", // 半透明背景
borderRadius: "50%", // 圆形按钮
}}
/>
</div>
)
})}
</div>
<div className="flex">
<AvatarUploader showCover={false} successText={'轮播图上传成功'} onChange={(value) => {
console.log(value);
setImageList([...imageList, value])
}}></AvatarUploader>
</div>
</>;
const [imageList, setImageList] = useState<string[]>(value || []);
const [previewImage, setPreviewImage] = useState<string>("");
useEffect(() => {
if (!isEqual(value, imageList)) {
setImageList(value || []);
}
}, [value]);
useEffect(() => {
onChange?.(imageList);
}, [imageList]);
return (
<>
<div className="flex gap-2 mb-2" style={{ width: "1200px" }}>
{(imageList || [])?.map((image, index) => {
return (
<div
className="mr-2px relative"
key={index}
style={{ width: "200px", height: "100px" }}>
<Image
alt=""
style={{ width: "200px", height: "100px" }}
src={image}
preview={{
visible: previewImage === image,
onVisibleChange: (visible) =>
setPreviewImage(
visible ? image || "" : ""
),
}}></Image>
<Button
type="text"
danger
icon={<DeleteOutlined className="text-red" />}
onClick={() =>
image &&
setImageList(
imageList.filter((_, i) => i !== index)
)
}
style={{
position: "absolute", // 绝对定位
top: "0", // 顶部对齐
right: "0", // 右侧对齐
zIndex: 1, // 确保按钮在图片上方
padding: "4px", // 调整按钮内边距
backgroundColor: "rgba(255, 255, 255, 0.2)", // 半透明背景
borderRadius: "50%", // 圆形按钮
}}
/>
</div>
);
})}
</div>
<div className="flex">
<AvatarUploader
showCover={false}
successText={"轮播图上传成功"}
onChange={(value) => {
console.log(value);
setImageList([...imageList, value]);
}}></AvatarUploader>
</div>
</>
);
}
export default MultiAvatarUploader;
export default MultiAvatarUploader;