From cd9bd9940cb24b3895ad580094edb744812547ab Mon Sep 17 00:00:00 2001
From: zhengkunwang223 <zhengkun@fit2cloud.com>
Date: Sun, 4 Dec 2022 15:29:55 +0800
Subject: [PATCH] =?UTF-8?q?feat:=20=E5=A2=9E=E5=8A=A0=E6=96=87=E4=BB=B6?=
 =?UTF-8?q?=E7=B1=BB=E5=9E=8B?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 frontend/src/lang/modules/zh.ts               |  2 +
 .../host/file-management/detail/index.vue     | 50 +++++++++++++++++++
 .../src/views/host/file-management/index.vue  | 16 ++++--
 3 files changed, 63 insertions(+), 5 deletions(-)
 create mode 100644 frontend/src/views/host/file-management/detail/index.vue

diff --git a/frontend/src/lang/modules/zh.ts b/frontend/src/lang/modules/zh.ts
index 9523e74c5..20bc3f089 100644
--- a/frontend/src/lang/modules/zh.ts
+++ b/frontend/src/lang/modules/zh.ts
@@ -629,6 +629,8 @@ export default {
         uploadSuccess: '上传成功!',
         downloadProcess: '下载进度',
         downloading: '正在下载...',
+        infoDetail: '文件属性',
+        type: '类型',
     },
     setting: {
         all: '全部',
diff --git a/frontend/src/views/host/file-management/detail/index.vue b/frontend/src/views/host/file-management/detail/index.vue
new file mode 100644
index 000000000..ce0777e9f
--- /dev/null
+++ b/frontend/src/views/host/file-management/detail/index.vue
@@ -0,0 +1,50 @@
+<template>
+    <el-dialog v-model="open" :title="$t('file.info')" :column="1" width="30%">
+        <el-row>
+            <el-col>
+                <el-descriptions :column="1" border>
+                    <el-descriptions-item :label="$t('file.fileName')">{{ data.name }}</el-descriptions-item>
+                    <!-- <el-descriptions-item :label="$t('file.type')">{{ data.type }}</el-descriptions-item> -->
+                    <el-descriptions-item :label="$t('file.path')">{{ data.path }}</el-descriptions-item>
+                    <el-descriptions-item :label="$t('file.size')">{{ computeSize(data.size) }}</el-descriptions-item>
+                    <el-descriptions-item :label="$t('file.role')">{{ data.mode }}</el-descriptions-item>
+                    <el-descriptions-item :label="$t('file.user')">{{ data.user }}</el-descriptions-item>
+                    <el-descriptions-item :label="$t('file.group')">{{ data.group }}</el-descriptions-item>
+                    <el-descriptions-item :label="$t('commons.table.updatedAt')">
+                        {{ dateFromat(0, 0, data.modTime) }}
+                    </el-descriptions-item>
+                </el-descriptions>
+            </el-col>
+        </el-row>
+    </el-dialog>
+</template>
+
+<script lang="ts" setup>
+import { GetFileContent } from '@/api/modules/files';
+import { computeSize } from '@/utils/util';
+import { ref } from 'vue';
+import { dateFromat } from '@/utils/util';
+
+interface InfoProps {
+    path: string;
+}
+const props = ref<InfoProps>({
+    path: '',
+});
+
+let open = ref(false);
+let data = ref();
+
+const acceptParams = async (params: InfoProps): Promise<void> => {
+    props.value = params;
+    GetFileContent({ path: params.path, expand: false, page: 1, pageSize: 1 }).then((res) => {
+        data.value = res.data;
+        console.log(data.value);
+        open.value = true;
+    });
+};
+
+defineExpose({
+    acceptParams,
+});
+</script>
diff --git a/frontend/src/views/host/file-management/index.vue b/frontend/src/views/host/file-management/index.vue
index b8a966470..494ba7006 100644
--- a/frontend/src/views/host/file-management/index.vue
+++ b/frontend/src/views/host/file-management/index.vue
@@ -170,6 +170,7 @@
                 @close="closeDownload"
             ></Download>
             <Process :open="processPage.open" @close="closeProcess"></Process>
+            <Detail ref="detailRef"></Detail>
         </el-row>
     </LayoutContent>
 </template>
@@ -205,6 +206,7 @@ import Move from './move/index.vue';
 import Download from './download/index.vue';
 import { Mimetypes } from '@/global/mimetype';
 import Process from './process/index.vue';
+import Detail from './detail/index.vue';
 
 const data = ref();
 let selects = ref<any>([]);
@@ -227,6 +229,7 @@ const wgetPage = reactive({ open: false, path: '' });
 const movePage = reactive({ open: false, oldPaths: [''], type: '' });
 const downloadPage = reactive({ open: false, paths: [''], name: '' });
 const processPage = reactive({ open: false });
+const detailRef = ref();
 
 const defaultProps = {
     children: 'children',
@@ -522,12 +525,10 @@ const quickSave = (content: string) => {
     });
 };
 
-onMounted(() => {
-    search();
-});
+const openDetail = (row: File.File) => {
+    detailRef.value.acceptParams({ path: row.path });
+};
 
-//TODO button增加v-if判断
-//openDeCompress 增加是否可以解压判断
 const buttons = [
     {
         label: i18n.global.t('file.open'),
@@ -560,8 +561,13 @@ const buttons = [
     },
     {
         label: i18n.global.t('file.info'),
+        click: openDetail,
     },
 ];
+
+onMounted(() => {
+    search();
+});
 </script>
 
 <style>