merge
Change-Id: I5227831adac7f85854cbe7321c2a3aa39d8c1d7a
diff --git a/src/components/selfStatus/selfStatus.tsx b/src/components/selfStatus/selfStatus.tsx
index 834e841..61d3f4e 100644
--- a/src/components/selfStatus/selfStatus.tsx
+++ b/src/components/selfStatus/selfStatus.tsx
@@ -5,11 +5,17 @@
import request from "@/utils/request";
import { getUserInfo } from "@/api/user";
import { useAppDispatch } from "@/hooks/store";
+
+import { useNavigate } from "react-router";
+
+
interface SelfStatusProps {
className?: string;
}
const SelfStatus: React.FC<SelfStatusProps> = () => {
+
+ const nav = useNavigate()
const userName = useAppSelector(state => state.user.userName);
const role = useAppSelector(state => state.user.role);
const uploadTraffic = useAppSelector(state => state.user.uploadTraffic);
@@ -30,6 +36,10 @@
}
}, [data, dispatch]);
+ function handleAvatarClick(){
+ nav('/homepage')
+ }
+
return (
<div className={style.container}>
<div className={style.left}>
diff --git a/src/components/upload/upload.module.css b/src/components/upload/upload.module.css
new file mode 100644
index 0000000..2fb6278
--- /dev/null
+++ b/src/components/upload/upload.module.css
@@ -0,0 +1,39 @@
+.uploadContainer {
+ display: flex;
+ flex-direction: column;
+ align-items: center;
+ justify-content: center;
+ border: 2px dashed #1890ff;
+ padding: 40px;
+ border-radius: 8px;
+ background-color: #f0f5ff;
+ transition: border-color 0.3s;
+}
+
+.uploadContainer:hover {
+ border-color: #40a9ff;
+}
+
+.uploadLabel {
+ font-size: 16px;
+ margin-bottom: 10px;
+ color: #333;
+}
+
+.uploadInput {
+ display: none;
+}
+
+.uploadButton {
+ padding: 8px 16px;
+ background-color: #1890ff;
+ color: white;
+ border: none;
+ border-radius: 4px;
+ cursor: pointer;
+ font-size: 14px;
+}
+
+.uploadButton:hover {
+ background-color: #40a9ff;
+}
diff --git a/src/components/upload/upload.tsx b/src/components/upload/upload.tsx
new file mode 100644
index 0000000..708e9d1
--- /dev/null
+++ b/src/components/upload/upload.tsx
@@ -0,0 +1,44 @@
+// src/component/upload/upload.tsx
+import React, { useState } from 'react'
+import './upload.css'
+
+const UploadComponent: React.FC = () => {
+ const [selectedFile, setSelectedFile] = useState<File | null>(null)
+
+ const handleFileChange = (e: React.ChangeEvent<HTMLInputElement>) => {
+ if (e.target.files && e.target.files.length > 0) {
+ setSelectedFile(e.target.files[0])
+ }
+ }
+
+ const handleUpload = () => {
+ if (selectedFile) {
+ console.log('上传文件：', selectedFile)
+ // 此处可以添加实际上传逻辑
+ }
+ }
+
+ return (
+ <div className="uploadContainer">
+ <label className="uploadLabel" htmlFor="upload-input">请选择文件上传：</label>
+ <input
+ type="file"
+ id="upload-input"
+ className="uploadInput"
+ data-testid="upload-input"
+ onChange={handleFileChange}
+ />
+ <label htmlFor="upload-input">
+ <div
+ className="uploadButton"
+ data-testid="upload-button"
+ onClick={handleUpload}
+ >
+ 点击上传
+ </div>
+ </label>
+ </div>
+ )
+}
+
+export default UploadComponent