文件浏览功能

admin/dashboard/templates/file_browser.html

@@ -11,20 +11,20 @@
                     <span>文件浏览</span>
                     <div style="float: right;">
                         <el-input
-                            v-model="fileBrowser.currentPath"
+                            v-model="currentPath"
                             placeholder="当前路径"
                             style="width: 300px; margin-right: 10px;"
                             readonly>
                         </el-input>
-                        <el-button type="primary" size="small" @click="fileBrowser.navigateUp">
+                        <el-button type="primary" size="small" @click="navigateUp">
                             <i class="el-icon-arrow-up"></i> 上级目录
                         </el-button>
                     </div>
                 </div>
                 <el-table
-                    :data="fileBrowser.fileList"
+                    :data="fileList"
                     style="width: 100%"
-                    v-loading="fileBrowser.loading">
+                    v-loading="loading">
                     <el-table-column
                         prop="name"
                         label="名称"
@@ -32,7 +32,7 @@
                         <template slot-scope="scope">
                             <el-link
                                 :type="scope.row.is_dir ? 'primary' : 'info'"
-                                @click="scope.row.is_dir ? fileBrowser.navigateTo(scope.row.name) : null">
+                                @click="scope.row.is_dir ? navigateTo(scope.row.name) : null">
                                 <i :class="scope.row.is_dir ? 'el-icon-folder' : 'el-icon-document'"></i>
                                 [[ scope.row.name ]]
                             </el-link>
@@ -51,7 +51,7 @@
                         label="大小"
                         width="120">
                         <template slot-scope="scope">
-                            [[ fileBrowser.formatFileSize(scope.row.size) ]]
+                            [[ scope.row.is_dir ? '-' : formatFileSize(scope.row.size) ]]
                         </template>
                     </el-table-column>
                     <el-table-column
@@ -59,7 +59,7 @@
                         label="修改时间"
                         width="180">
                         <template slot-scope="scope">
-                            [[ fileBrowser.formatDate(scope.row.modified) ]]
+                            [[ formatDate(scope.row.modified) ]]
                         </template>
                     </el-table-column>
                     <el-table-column
@@ -70,7 +70,7 @@
                                 v-if="!scope.row.is_dir"
                                 type="primary"
                                 size="mini"
-                                @click="fileBrowser.downloadFile(scope.row.name)">
+                                @click="downloadFile(scope.row.name)">
                                 下载
                             </el-button>
                         </template>
@@ -84,31 +84,21 @@
 
 {% block scripts %}
 <script>
-// 扩展基础Vue实例
-Object.assign(baseApp, {
-    data() {
-        return {
-            ...baseApp.data(),
-            fileBrowser: {
+    new Vue({
+        el: '#app',
+        delimiters: ['[[', ']]'],
+        data() {
+            return {
                 currentPath: '',
                 fileList: [],
                 loading: false
             }
-        }
-    },
-    created() {
-        // 调用原始created方法
-        if (baseApp.created) {
-            baseApp.created.call(this);
-        }
-        // 设置当前视图为文件浏览
-        this.currentView = '15';
-        // 加载文件列表
-        this.fileBrowser.loadFiles('');
-    },
-    methods: {
-        ...baseApp.methods,
-        fileBrowser: {
+        },
+        created() {
+            this.currentView = '15';
+            this.loadFiles('');
+        },
+        methods: {
             formatFileSize(bytes) {
                 if (bytes === 0) return '0 B';
                 const k = 1024;
@@ -160,7 +150,6 @@ Object.assign(baseApp, {
                 window.location.href = '/api/download_file?path=' + encodeURIComponent(filePath);
             }
         }
-    }
-});
+    });
 </script>
 {% endblock %}