---
# System prepended metadata

title: '[File Management] 問題整理'
tags: [filemgr]

---

# [File Management] 問題整理
###### tags: `filemgr`

## 1. 上傳方式
可透過檔案拖拉/點選上傳按鈕兩種方式，選擇的檔案會直接進行上傳
1. 點選上傳按鈕：需選取 file 類型(不支援 folder)
2. 拖拉至頁面：若選取 folder，會遞迴展開 folder 內的所有檔案
    - <font color="#e93748">~~**限制最多取到第 n 層?**~~</font>
    - <font color="#e93748">~~**可能調整限制資料夾上傳，僅上傳檔案?**~~</font>
    考量相同檔案位於檔案列表中不同資料夾位置
- <font color="#e93748">**僅可上傳 '檔案'**</font>
    > 3/28 討論後決定目前上傳檔案類型限制為 file(folder 不可)

## 2. 重複檔案
> 1. resumeFileList.on('`fileAdded`', function (file, event) { ... }
> 2. resumeFileList.on('`filesAdded`', function (arrayAdded, arraySkipped) { ... }
> 可得知重覆檔案陣列，是比對 resumeFileList.files 陣列中的檔案
> 檔名相同且**未**修改: skip
> 檔名相同且**有**修改: 視為新檔案
    
- <font color="#e93748">**調整元件 `.filesAdded()`，處理重複檔案過濾的問題**</font>
不過濾檔案為 added/skipped
  > 透過回呼函式比對上傳的目的地與檔名是否重複，若上傳目的地與檔名兩者皆相同 -> 為重複檔案，需過濾(重複檔案不顯示於上傳清單中)
- 不需詢問是否覆蓋檔案，上傳檔案 api 會進行檢查，根據 api return 的結果顯示即可

> google drive 作法
> 上傳中：若是未上傳完畢，會重複加到上傳清單中
> 已上傳：與檔案列表做比對，只要檔名相同，不管是否有修改過皆會跳出視窗詢問
> 　　　　可選擇 1.覆蓋檔案 2.另上傳成新檔案(串上編號) 3.取消(不上傳)
> 　　　　![](https://i.imgur.com/D0aYnKA.png)


## 3. 取消上傳
![](https://i.imgur.com/D051qS5.png)
1. 點選檔案取消按鈕，取消單一檔案上傳
    - 改變按鈕狀態
    - 將此筆檔案取消(`file.abort() -> removeFile(file)`)
    - 繼續上傳其他檔案
    > `removeFile(file)` 會將檔案從上傳清單中移除
    > <font color="#e93748">**- 調整元件 `.removeFile()`，另外紀錄移除的檔案資訊**</font>
    > 以便後續若相同檔案要進行 retry 時可取得對應檔案內容
  
2. 點選視窗關閉按鈕
    - 若有檔案還在上傳，跳出視窗確認是否要關閉
    - 若檔案皆上傳完畢，關閉視窗

- 取消的檔案是否可重新上傳
  - 可重新上傳，比對 `removeFile` 的檔案資訊，加回上傳清單中繼續上傳
  - 不可重新上傳，取消上傳時就將上傳清單的檔案一併移除顯示


## 4. 切換頁面
- File 頁面中，資料夾之間進行切換不影響
![](https://i.imgur.com/vg5lbuE.png)

- 若檔案仍在上傳中要切換至其他頁面，跳出視窗確認是否要切換
  - **YES**: 取消檔案上傳，切換至其他頁面
  - **NO**: 停留在原畫面且繼續上傳檔案
  - <font color="#e93748">**需 return 確認結果，在 `main.js` 可藉由結果判斷是否切換頁面**</font>
![](https://i.imgur.com/0sctO2W.png)


## 5. 上傳檔案視窗
保留之前上傳紀錄，直到關閉視窗才清除內容
- 需紀錄個別檔案上傳的結果(以便更新狀態)
![](https://i.imgur.com/RhbgAXn.png)


---


### 新增檔案重複時

彙整新加入的檔案若為重複時，在不同情況下 `filesAdded` callback function 中的參數類型
```javascript=
resumeFileList.on('filesAdded', function (addfiles, skipfiles, suspendfiles) {
  // ...
}
```


| 情境     | 類型                            |
| -------- |:------------------------------- |
| 尚未上傳 | skip                            |
| 上傳中   | skip                            |
| 已完成   | skip                            |
| 取消重傳 | add/suspend >> 比對是否在清單中 |
| 有編輯過 | add                             |


### 檔案狀態彙整
判斷檔案上傳清單的檔案狀態(`listFile[i].xxx`)，以利更新檔案的圖示(success, failed, uploading, readyUpload..)

| Status   | .isComplete() | .isUploading() | .progress() | .paused |
| -------- | ------------- | -------------- | ----------- | ------- |
| 未上傳   | false         | false          | 0           | false   |
| 上傳中   | false         | true           | 0.1458...   | false   |
| 已完成   | true          | false          | 1           | false   |
| 暫停     | false         | false          | 0.2551..    | true    |
| 上傳失敗 | true          | false          | 1           | false   |



## [待討論] 3/10 待討論項目 (3/10 已完成)

### create_folder
1. 名稱是否能輸入 `.` ，以及 `.` 符號的卡控規則
2. 名稱參數帶 `/abc` API 為成功，但取清單無資料
   用相同名稱在 create folder 時，會 return `Folder already exist`
    - 測試符號 `\ / : * " < > |` API 皆可成功
4. 名稱是否支援空白

-> 討論後的名稱輸入限制
 - 不可輸入 `/` 符號
 - 不可皆為空白或是 `.`
   - 空白或是 `.` 僅可以在名稱的前後或是中間
   - UI 會濾掉前後為空白(trim)
### rename
1. **[file]** rename 與其他 file 名稱相同時，API 成功，檔案會覆蓋掉
2. **[folder]** rename 有內容 API 失敗，無內容會成功，且 folder 會覆蓋掉

-> rename 相關行為由 api 進行處理，UI 不須特別做檢查
### 其他
1. default folder user 名稱是 0，要如何顯示？
-> 按照 api 回傳的內容顯示即可


