资料归集，文件操作调整

app/public/js/file_detail.js

@@ -93,12 +93,20 @@ $(document).ready(function() {
             this.refreshFileCountHint();
         }
         _getFileNameHtml(file) {
-            const moveHtml = file.canEdit || canEdit ? `<a href="javascript: void(0);" class="mr-1" name="move-file" fid="${file.id}"><i class="fa fa-exchange fa-fw"></i></a>` : '';
-            const editHtml = file.canEdit || canEdit ? `<a href="javascript: void(0);" class="mr-1" name="edit-file" fid="${file.id}"><i class="fa fa-pencil fa-fw"></i></a>` : '';
-            const viewHtml = file.viewpath ? `<a href="${file.viewpath}" class="mr-1" target="_blank"><i class="fa fa-eye fa-fw"></i></a>` : '';
-            const downHtml = `<a href="javascript: void(0);" onclick="AliOss.downloadFile('${file.filepath}', '${file.filename + file.fileext}')" class="mr-1"><i class="fa fa-download fa-fw"></i></a>`;
-            const delHtml = file.canEdit || canEdit ? `<a href="javascript: void(0);" class="mr-1 text-danger" name="del-file" fid="${file.id}"><i class="fa fa-trash-o fa-fw"></i></a>` : '';
-            return `<div class="d-flex justify-content-between align-items-center table-file"><div name="filename" fid="${file.id}">${file.filename}${file.fileext}</div><div class="btn-group-table" style="display: none;">${moveHtml}${editHtml}${viewHtml}${downHtml}${delHtml}</div></div>`;
+            return `<div class="d-flex justify-content-between align-items-center table-file"><div name="filename" fid="${file.id}">${file.filename}${file.fileext}</div></div>`;
+        }
+        _getFileControlHtml(file) {
+            const moveHtml = file.canEdit || canEdit ? `<a href="javascript: void(0);" class="dropdown-item text-primary" name="move-file" fid="${file.id}"><i class="fa fa-exchange fa-fw"></i> 移动</a>` : '';
+            const editHtml = file.canEdit || canEdit ? `<a href="javascript: void(0);" class="dropdown-item text-primary" name="edit-file" fid="${file.id}"><i class="fa fa-pencil fa-fw"></i> 重命名</a>` : '';
+            const viewHtml = file.viewpath ? `<a href="${file.viewpath}" class="dropdown-item text-primary" target="_blank"><i class="fa fa-eye fa-fw"></i> 预览</a>` : '';
+            const downHtml = `<a href="javascript: void(0);" onclick="AliOss.downloadFile('${file.filepath}', '${file.filename + file.fileext}')" class="dropdown-item text-primary"><i class="fa fa-download fa-fw"></i> 下载</a>`;
+            const delHtml = file.canEdit || canEdit ? `<div class="dropdown-divider"></div><a href="javascript: void(0);" class="dropdown-item text-danger" name="del-file" fid="${file.id}"><i class="fa fa-trash-o fa-fw"></i> 删除</a>` : '';
+            return `<div class="dropdown">
+                        <a href="javascript: void(0);" class="dropdown-toggle text-primary" id="dropdownMenuButton" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false"><i class="fa fa-bars"></i></a>
+                        <div class="dropdown-menu" style="will-change: transform;">
+                            ${editHtml}${viewHtml}${moveHtml}${downHtml}${delHtml}
+                        </div>
+                    </div>`;
         }
         _getEditFileNameHtml(file) {
             const inputHtml = `<input type="text" class="form-control form-control-sm form-control-width" maxlength="100" value="${file.filename + file.fileext}" fid="${file.id}">`;
@@ -113,6 +121,7 @@ $(document).ready(function() {
             html.push(`<td class="text-center">${file.user_name}</td>`);
             html.push(`<td class="text-center">${moment(file.create_time).format('YYYY-MM-DD HH:mm:ss')}</td>`);
             html.push(`<td class="text-center">${file.fileext_str}</td>`);
+            html.push(`<td class="text-center">${this._getFileControlHtml(file)}</td>`);
             html.push('</tr>');
             return html.join('');
         }

app/view/file/file.ejs

@@ -60,6 +60,7 @@
                                     <th width="10%">上传人</th>
                                     <th width="20%">上传时间 <span name="file-sort" field="create_time" tag="create_time|asc"><i class="fa fa-sort-amount-desc" aria-hidden="true"></i></span></th>
                                     <th width="10%">文件类型</th>
+                                    <th width="60px">操作</th>
                                 </tr>
                                 </thead>
                                 <tbody id="file-list">