打开文件夹功能

Author: saya-ashen

backend/Dockerfile

@@ -38,4 +38,4 @@ EXPOSE 8000
 
 # 运行应用
 #CMD ["uvicorn", "src.main:app", "--host", "0.0.0.0", "--port", "8000"]
-CMD ["gunicorn", "-k", "uvicorn.workers.UvicornWorker", "-w","4", "-b", "0.0.0.0:8000", "src.main:app"]
+CMD ["gunicorn", "-k", "uvicorn.workers.UvicornWorker", "-w","1", "-b", "0.0.0.0:8000", "src.main:app"]

backend/src/__pycache__/settings.cpython-312.pyc

@@ -19,10 +19,6 @@
 def mkdir(
     success: bool = Depends(create_folder_dp),
 ):
-    """user_root_path = get_root_path(user)
-    if not os.path.exists(f"{user_root_path}"):
-        return {"error": "path not exists"}
-    os.mkdir(f"{user_root_path}/{path}")"""
     return {"success": success}
 
 

backend/src/api/__pycache__/users.cpython-312.pyc

@@ -96,4 +96,18 @@ async def register(user: UserCreate, db: Session = Depends(get_db)):
     db_user = get_user_by_email(db, email=user.email)
     if db_user:
         raise HTTPException(status_code=400, detail="邮箱已存在")
-    return create_user(db=db, user=user)
+    user = create_user(db=db, user=user)
+    access_token, expires_access = create_access_token(user.id)
+    refresh_token, expire_refresh = create_refresh_token(user.id)
+    response = LoginResponse(
+        success=True,
+        data=LoginData(
+            username=user.username,
+            roles=["admin"],
+            access_Token=access_token,
+            refresh_Token=refresh_token,
+            expires=expires_access,  # TODO
+        ),
+        access_token=access_token,
+    )
+    return response

backend/src/api/file.py

@@ -91,4 +91,4 @@ def create_folder_dp(
     db: Session = Depends(get_db),
 ):
     create_folder(path, user, db)
-    return {"success": True}
+    return True

backend/src/api/users.py

@@ -36,6 +36,17 @@ export const getLogin = (data?: object) => {
   //return http.request<UserResult>("post", "login", { data, headers: { "Content-Type": "application/x-www-form-urlencoded" } });
 };
 
+/** 注册 */
+export const getRegister = (data?: object) => {
+  const reg_data = {
+    username: data["username"],
+    nickname: data["username"],
+    password: data["password"],
+    email: "test@test",
+  };
+return http.request<UserResult>("post", baseUrlApi("api/register"), { data:reg_data, headers: { "Content-Type": "application/json" } });
+};
+
 /** 刷新token */
 export const refreshTokenApi = (data?: object) => {
   return http.request<RefreshTokenResult>("post", baseUrlApi("api/refreshToken"), { data });

backend/src/dependencies.py

@@ -1,4 +1,4 @@
-import { RefreshTokenResult, UserResult, getLogin, refreshTokenApi } from "@/api/user";
+import { RefreshTokenResult, UserResult, getLogin, getRegister, refreshTokenApi } from "@/api/user";
 import { routerArrays } from "@/layout/types";
 import { resetRouter, router } from "@/router";
 import { store } from "@/store";
@@ -41,6 +41,20 @@ export const useUserStore = defineStore({
                     });
             });
         },
+      async registerByUsername(data) {
+        return new Promise<UserResult>((resolve, reject) => {
+          getRegister(data)
+            .then(data => {
+              if (data) {
+                setToken(data.data);
+                resolve(data);
+              }
+            })
+            .catch(error => {
+              reject(error);
+            });
+        });
+      },
         /** 前端登出（不调用接口） */
         logOut() {
             this.username = "";

frontend/src/api/user.ts

@@ -62,6 +62,30 @@ const onLogin = async (formEl: FormInstance | undefined) => {
     });
 };
 
+const onRegister = async (formEl: FormInstance | undefined) => {
+    loading.value = true;
+    if (!formEl) return;
+    await formEl.validate((valid, fields) => {
+        if (valid) {
+            const formData = { grant_type: 'password', username: ruleForm.username, password: ruleForm.password }
+            useUserStoreHook()
+                .registerByUsername(formData)
+                .then(res => {
+                    if (res.success) {
+                        // 获取后端路由
+                        initRouter().then(() => {
+                            router.push(getTopMenu(true).path);
+                            message("注册成功", { type: "success" });
+                        });
+                    }
+                });
+        } else {
+            loading.value = false;
+            return fields;
+        }
+    });
+};
+
 /** 使用公共函数，避免`removeEventListener`失效 */
 function onkeypress({ code }: KeyboardEvent) {
     if (code === "Enter") {
@@ -124,6 +148,12 @@ onBeforeUnmount(() => {
                                 登录
                             </el-button>
                         </Motion>
+                    <Motion :delay="300">
+                    <el-button class="w-full mt-4" size="default" type="primary" :loading="loading"
+                        @click="onRegister(ruleFormRef)">
+                        注册
+                    </el-button>
+                    </Motion>
                     </el-form>
                 </div>
             </div>

frontend/src/store/modules/user.ts

@@ -1,7 +1,6 @@
 <script setup lang="ts">
 import { baseUrlApi } from "@/api/utils";
 import { http } from "@/utils/http";
-import data from "@iconify-icons/ri/fullscreen-fill";
 import PureTable from "@pureadmin/table";
 import qs from "qs";
 import { onMounted, ref } from "vue";
@@ -25,7 +24,11 @@ const tableData = ref([]);
 // 在 'onMounted' 钩子中发起 HTTP 请求
 onMounted(async () => {
     try {
-        const response = await http.request<FilesResult>("get", baseUrlApi("/api/list/"));
+      const response = await http.request<FilesResult>("get", baseUrlApi("/api/list/"));
+      const items = response.items;
+      items.forEach(item => {
+        item.type = item.type === 0 ? '文件夹' : '文件';
+      });
         tableData.value = response.items;
     } catch (error) {
         console.error('There was an error fetching the data:', error);
@@ -47,6 +50,22 @@ const toggleSelection = (rows?: any) => {
 const handleSelectionChange = val => {
     multipleSelection.value = val;
 };
+const handleRowClick = async row => {
+  if (row.type === '文件夹') {
+    try {
+      const response = await http.request<FilesResult>("get", baseUrlApi("/api/list/") + row.name);
+      const items = response.items;
+      items.forEach(item => {
+        item.type = item.type === 0 ? '文件夹' : '文件';
+      });
+      tableData.value = response.items;
+    } catch (error) {
+      console.error('There was an error fetching the data:', error);
+    }
+  } else {
+    alert('这是一个文件，无法打开！');
+  }
+};
 const handleDownload = async () => {
   if (multipleSelection.value.length === 0) {
         alert('请至少选择一项进行下载！');
@@ -101,7 +120,7 @@ const handleDownload = async () => {
     }
 
 };
-const handleUpload = async (uploadPath) => {
+const handleUpload = async () => {
     // 创建一个文件输入控件
     const input = document.createElement('input');
     input.type = 'file';
@@ -125,6 +144,8 @@ const handleUpload = async (uploadPath) => {
           
             if (response.success === true) {
                 alert('上传成功！');
+            // 刷新页面
+                window.location.reload();
             } else {
                 console.error('上传失败:', response);
             }
@@ -134,6 +155,27 @@ const handleUpload = async (uploadPath) => {
     };
 };
 
+const handleNewFolder = async () => {
+    const folderName = prompt('请输入文件夹名称：');
+    if (!folderName) {
+        return;
+    }
+
+    try {
+        const response = await http.request<FilesResult>("post",baseUrlApi("api/mkdir/"+ folderName) , {
+        });
+
+        if (response.success === true) {
+            alert('创建成功！');
+            // 刷新页面
+            window.location.reload();
+        } else {
+            console.error('创建失败:', response);
+        }
+    } catch (error) {
+        console.error('创建文件夹时出错:', error);
+    }
+};
 
 const columns: TableColumnList = [
     {
@@ -148,22 +190,25 @@ const columns: TableColumnList = [
         label: "大小",
         prop: "size"
     },
-    {
-        label: "日期",
-        prop: "date"
+  {
+    label: "类型",
+    prop: "type"
     }
 ];
 </script>
 
 <template>
-    <pure-table ref="tableRef" :data="tableData" :columns="columns"
-        @selection-change="handleSelectionChange" height="360" />
+      <pure-table ref="tableRef" :data="tableData" :columns="columns"
+                @selection-change="handleSelectionChange" 
+                @row-click="handleRowClick" height="360"> </pure-table>
   <div style="display: flex; justify-content: space-between; align-items: center; margin-top: 20px;">
             <div>
                 <el-button @click="toggleSelection(tableData)">全选</el-button>
                 <el-button @click="toggleSelection()">清除</el-button>
             </div>
             <div>
+
+                <el-button type="primary" icon="el-icon-download" @click="handleNewFolder">新建文件夹</el-button>
                 <el-button type="primary" icon="el-icon-download" @click="handleDownload">下载</el-button>
                 <el-button type="primary" icon="el-icon-download" @click="handleUpload">上传</el-button>
             </div>