style: 样式调整

backend/app/service/file.go

@@ -101,7 +101,7 @@ func (f FileService) GetContent(op dto.FileOption) (dto.FileInfo, error) {
 	if err != nil {
 		return dto.FileInfo{}, err
 	}
-	return dto.FileInfo{*info}, nil
+	return dto.FileInfo{FileInfo: *info}, nil
 }
 
 func (f FileService) SaveContent(edit dto.FileEdit) error {
@@ -169,7 +169,7 @@ func (f FileService) FileDownload(d dto.FileDownload) (string, error) {
 
 func getUuid() string {
 	b := make([]byte, 16)
-	io.ReadFull(rand.Reader, b)
+	_, _ = io.ReadFull(rand.Reader, b)
 	b[6] = (b[6] & 0x0f) | 0x40
 	b[8] = (b[8] & 0x3f) | 0x80
 	return fmt.Sprintf("%x-%x-%x-%x-%x", b[0:4], b[4:6], b[6:8], b[8:10], b[10:])

backend/init/cache/badger_db/badger_db.go

@@ -55,7 +55,7 @@ func (c *Cache) Get(key string) ([]byte, error) {
 			result = append([]byte{}, val...)
 			return nil
 		})
-		return nil
+		return err
 	})
 	return result, err
 }

backend/init/cache/cache.go

@@ -1,7 +1,6 @@
 package cache
 
 import (
-	"fmt"
 	"github.com/1Panel-dev/1Panel/global"
 	"github.com/1Panel-dev/1Panel/init/cache/badger_db"
 	"github.com/dgraph-io/badger/v3"
@@ -51,25 +50,4 @@ func Init() {
 	}
 
 	global.CACHE = badger_db.NewCacheDB(cache)
-
-	err = cache.View(func(txn *badger.Txn) error {
-		opts := badger.DefaultIteratorOptions
-		opts.PrefetchValues = false
-		it := txn.NewIterator(opts)
-		defer it.Close()
-		for it.Rewind(); it.Valid(); it.Next() {
-			item := it.Item()
-			k := item.Key()
-			fmt.Printf("key=%s\n", k)
-		}
-		return nil
-	})
-	if err != nil {
-		panic(err)
-	}
-	fmt.Printf("run gc")
-	err = cache.RunValueLogGC(0.01)
-	if err != nil {
-		fmt.Printf(err.Error())
-	}
 }

backend/init/session/psession/psession.go

@@ -28,7 +28,7 @@ func (p *PSession) Get(sessionID string) (SessionUser, error) {
 	if err != nil {
 		return result, err
 	}
-	json.Unmarshal(item, &result)
+	_ = json.Unmarshal(item, &result)
 	return result, nil
 }
 

backend/utils/files/file_op.go

@@ -50,10 +50,7 @@ func (f FileOp) DeleteDir(dst string) error {
 
 func (f FileOp) Stat(dst string) bool {
 	info, _ := f.Fs.Stat(dst)
-	if info != nil {
+	return info != nil
-		return true
-	}
-	return false
 }
 
 func (f FileOp) DeleteFile(dst string) error {

backend/utils/files/fileinfo.go

@@ -22,6 +22,7 @@ type FileInfo struct {
 	Size       int64       `json:"size"`
 	IsDir      bool        `json:"isDir"`
 	IsSymlink  bool        `json:"isSymlink"`
+	IsHidden   bool        `json:"isHidden"`
 	LinkPath   string      `json:"linkPath"`
 	Type       string      `json:"type"`
 	Mode       string      `json:"mode"`
@@ -33,10 +34,11 @@ type FileInfo struct {
 }
 
 type FileOption struct {
-	Path   string `json:"path"`
+	Path       string `json:"path"`
-	Search string `json:"search"`
+	Search     string `json:"search"`
-	Expand bool   `json:"expand"`
+	Expand     bool   `json:"expand"`
-	Dir    bool   `json:"dir"`
+	Dir        bool   `json:"dir"`
+	ShowHidden bool   `json:"showHidden"`
 }
 
 func NewFileInfo(op FileOption) (*FileInfo, error) {
@@ -57,6 +59,7 @@ func NewFileInfo(op FileOption) (*FileInfo, error) {
 		Size:      info.Size(),
 		IsSymlink: IsSymlink(info.Mode()),
 		Extension: filepath.Ext(info.Name()),
+		IsHidden:  IsHidden(op.Path),
 		Mode:      fmt.Sprintf("%04o", info.Mode().Perm()),
 		User:      GetUsername(info.Sys().(*syscall.Stat_t).Uid),
 		Group:     GetGroup(info.Sys().(*syscall.Stat_t).Gid),
@@ -64,13 +67,10 @@ func NewFileInfo(op FileOption) (*FileInfo, error) {
 	}
 	if file.IsSymlink {
 		file.LinkPath = GetSymlink(op.Path)
-	}
-	if op.Search != "" {
-
 	}
 	if op.Expand {
 		if file.IsDir {
-			if err := file.listChildren(op.Dir); err != nil {
+			if err := file.listChildren(op.Dir, op.ShowHidden); err != nil {
 				return nil, err
 			}
 			return file, nil
@@ -83,7 +83,7 @@ func NewFileInfo(op FileOption) (*FileInfo, error) {
 	return file, nil
 }
 
-func (f *FileInfo) listChildren(dir bool) error {
+func (f *FileInfo) listChildren(dir, showHidden bool) error {
 	afs := &afero.Afero{Fs: f.Fs}
 	files, err := afs.ReadDir(f.Path)
 	if err != nil {
@@ -98,6 +98,10 @@ func (f *FileInfo) listChildren(dir bool) error {
 		name := df.Name()
 		fPath := path.Join(f.Path, df.Name())
 
+		if !showHidden && IsHidden(name) {
+			continue
+		}
+
 		isSymlink, isInvalidLink := false, false
 		if IsSymlink(df.Mode()) {
 			isSymlink = true
@@ -117,6 +121,7 @@ func (f *FileInfo) listChildren(dir bool) error {
 			FileMode:  df.Mode(),
 			IsDir:     df.IsDir(),
 			IsSymlink: isSymlink,
+			IsHidden:  IsHidden(fPath),
 			Extension: filepath.Ext(name),
 			Path:      fPath,
 			Mode:      fmt.Sprintf("%04o", df.Mode().Perm()),

backend/utils/files/utils.go

@@ -42,3 +42,9 @@ func GetSymlink(path string) string {
 	}
 	return linkPath
 }
+
+const dotCharacter = 46
+
+func IsHidden(path string) bool {
+	return path[0] == dotCharacter
+}

frontend/.prettierrc.js

@@ -29,9 +29,9 @@ module.exports = {
     // 不需要自动在文件开头插入 @prettier
     insertPragma: false,
     // 使用默认的折行标准
-    proseWrap: 'preserve',
+    proseWrap: 'never',
     // 根据显示样式决定 html 要不要折行
-    htmlWhitespaceSensitivity: 'css',
+    htmlWhitespaceSensitivity: 'ignore',
     // 换行符使用 lf
     endOfLine: 'auto',
 };

frontend/src/api/interface/file.ts

@@ -23,6 +23,7 @@ export namespace File {
         search?: string;
         expand: boolean;
         dir?: boolean;
+        showHidden?: boolean;
     }
 
     export interface FileTree {

frontend/src/assets/iconfont/iconfont.css

@@ -1,9 +1,9 @@
 @font-face {
   font-family: "panel"; /* Project id 3575356 */
-  src: url('iconfont.woff2?t=1662608296116') format('woff2'),
+  src: url('iconfont.woff2?t=1662692062751') format('woff2'),
-       url('iconfont.woff?t=1662608296116') format('woff'),
+       url('iconfont.woff?t=1662692062751') format('woff'),
-       url('iconfont.ttf?t=1662608296116') format('truetype'),
+       url('iconfont.ttf?t=1662692062751') format('truetype'),
-       url('iconfont.svg?t=1662608296116#panel') format('svg');
+       url('iconfont.svg?t=1662692062751#panel') format('svg');
 }
 
 .panel {
@@ -14,6 +14,22 @@
   -moz-osx-font-smoothing: grayscale;
 }
 
+.p-logout:before {
+  content: "\e8fe";
+}
+
+.p-terminal2:before {
+  content: "\e82a";
+}
+
+.p-yingwen:before {
+  content: "\e6c3";
+}
+
+.p-zhongwen:before {
+  content: "\e6c8";
+}
+
 .p-plan:before {
   content: "\e746";
 }

frontend/src/assets/iconfont/iconfont.svg

@@ -14,6 +14,14 @@
     />
       <missing-glyph />
       
+      <glyph glyph-name="logout" unicode="&#59646;" d="M610.87695313-11.5078125L149.45117213-11.5078125c-19.77539063 0-32.95898463 13.18359399-32.95898463 32.95898463L116.4921875 746.54882787c0 19.77539063 13.18359399 32.95898463 32.95898463 32.95898463l461.425781 0c19.77539063 0 32.95898463-13.18359399 32.95898462-32.95898463l0-230.71289088c0-19.77539063-13.18359399-32.95898463-32.95898462-32.95898464s-32.95898463 13.18359399-32.95898463 32.95898464L577.9179685 713.589844 182.410156 713.589844l0-659.17968724 395.5078125 0 0 197.75390625c0 19.77539063 13.18359399 32.95898463 32.95898463 32.95898464s32.95898463-13.18359399 32.95898462-32.95898464l0-230.71289088C643.83593775 1.675781499999971 630.65234375-11.5078125 610.87695313-11.5078125zM874.54882787 351.04101536999997L380.16406225 351.04101536999997c-19.77539063 0-32.95898463 13.18359399-32.95898464 32.95898463s13.18359399 32.95898463 32.95898464 32.95898463l494.38476562 0c19.77539063 0 32.95898463-13.18359399 32.95898463-32.95898463S894.3242185 351.04101536999997 874.54882787 351.04101536999997zM874.54882787 351.04101536999997c-9.88769531 0-16.47949193 3.29589869-23.07128931 9.88769531l-131.83593778 131.83593776c-13.18359399 13.18359399-13.18359399 32.95898463 0 46.14257787s32.95898463 13.18359399 46.14257788 0l131.83593775-131.83593774c13.18359399-13.18359399 13.18359399-32.95898463 0-46.14257789C891.02832057 354.33691406 884.43652318 351.04101536999997 874.54882787 351.04101536999997zM742.71289088 219.20507838000003c-9.88769531 0-16.47949193 3.29589869-23.07128932 9.88769531-13.18359399 13.18359399-13.18359399 32.95898463 0 46.14257787l131.83593776 131.83593776c13.18359399 13.18359399 32.95898463 13.18359399 46.14257787 0s13.18359399-32.95898463 0-46.14257787l-131.83593776-131.83593776C759.19238281 222.50097631000006 752.60058619 219.20507838000003 742.71289088 219.20507838000003z"  horiz-adv-x="1024" />
+      
+      <glyph glyph-name="terminal2" unicode="&#59434;" d="M366.272 334.272l-266.272-266.272q-5.728-5.728-13.152-5.728t-13.152 5.728l-28.576 28.576q-5.728 5.728-5.728 13.152t5.728 13.152l224.576 224.576-224.576 224.576q-5.728 5.728-5.728 13.152t5.728 13.152l28.576 28.576q5.728 5.728 13.152 5.728t13.152-5.728l266.272-266.272q5.728-5.728 5.728-13.152t-5.728-13.152zM982.848 73.152l0-36.576q0-8-5.152-13.152t-13.152-5.152l-548.576 0q-8 0-13.152 5.152t-5.152 13.152l0 36.576q0 8 5.152 13.152t13.152 5.152l548.576 0q8 0 13.152-5.152t5.152-13.152z"  horiz-adv-x="1024" />
+      
+      <glyph glyph-name="yingwen" unicode="&#59075;" d="M827.446642 168.450665h-80.351338v155.002256c0 32.799081-1.717712 54.027541-5.13146 63.654674a44.548518 44.548518 0 0 1-16.758075 22.435012 47.68411 47.68411 0 0 1-27.895204 8.019601c-13.911478 0-26.358114-3.802085-37.448282-11.45683-11.057656-7.611395-18.672664-17.713563-22.742069-30.306503-4.096499-12.594746-6.142942-35.880486-6.142942-69.78136v-137.56685H550.625935V472.182188h74.640081v-44.620767c26.50803 34.334365 59.854395 51.468133 100.078832 51.468133 17.758718 0 33.938804-3.186166 48.614311-9.55669 14.686345-6.404843 25.812637-14.529204 33.319272-24.45075 7.542759-9.91974 12.811492-21.159824 15.73395-33.75457 2.935101-12.594746 4.436067-30.602722 4.436067-54.07089l-0.001806-188.745989zM197.680437 168.450665V587.720425h310.875109v-70.910245H282.319732v-92.980402h210.491026v-70.659181H282.319732v-114.062557h234.255414v-70.657375h-318.85136z"  horiz-adv-x="1024" />
+      
+      <glyph glyph-name="zhongwen" unicode="&#59080;" d="M555.231787 565.796571v107.997284h-68.202727v-108.038827H263.433935v-273.457531H487.02906v-210.976899h68.202727V292.29569h224.21827V565.796571H555.231787z m-68.202727-209.074952h-157.337694v144.605675h157.335888v-144.605675z m226.131053 0H555.195662v144.605675h157.962645v-144.605675z"  horiz-adv-x="1024" />
+      
       <glyph glyph-name="plan" unicode="&#59206;" d="M234.666667 682.666667h57.706666v-63.978667L234.666667 618.666667v-106.666667h554.666666v106.666667h-55.232v64H789.333333a64 64 0 0 0 64-64v-512a64 64 0 0 0-64-64H234.666667a64 64 0 0 0-64 64V618.666667a64 64 0 0 0 64 64z m554.666666-234.666667H234.666667v-341.333333h554.666666V448z m-384-192v-64h-106.666666v64h106.666666z m160 0v-64h-106.666666v64h106.666666z m160 0v-64h-106.666666v64h106.666666z m-320 128v-64h-106.666666v64h106.666666z m160 0v-64h-106.666666v64h106.666666z m160 0v-64h-106.666666v64h106.666666zM697.728 725.333333v-106.666666h-64.021333V725.333333h64z m-104.170667-42.666666v-64l-160.618666 0.021333V682.666667h160.618666z m-197.013333 42.666666v-106.666666h-64V725.333333h64z"  horiz-adv-x="1024" />
       
       <glyph glyph-name="database" unicode="&#59220;" d="M94.64086164 251.18037332999995l146.54173153-70.34521008 270.97275142-131.24028917 261.3154951 126.60584297 156.27666015 74.85020205a77.6722963 77.6722963 0 0 0-36.35063467-103.12291791l-347.37639939-168.23819378a77.6722963 77.6722963 0 0 0-67.73024237 0L130.91382401 147.92800119000003A77.6722963 77.6722963 0 0 0 94.64086164 251.18037332999995z m834.77005866 162.54222578a77.6722963 77.6722963 0 0 0-36.01405513-103.82196978L545.99457541 141.66243555000005a77.6722963 77.6722963 0 0 0-67.73024236 0L130.91382401 309.90062933A77.6722963 77.6722963 0 0 0 93.08741571 409.63185778l384.73677392-181.46837451 34.33115496-16.62187141 347.3763994 168.23819378-0.18123496 0.0776723 70.06041127 33.83922961zM546.02046578 779.89569422l347.35050904-168.21230341a77.6722963 77.6722963 0 0 0 0-139.81013334l-347.35050904-168.23819378a77.6722963 77.6722963 0 0 0-67.73024237 0L130.91382401 471.87325747a77.6722963 77.6722963 0 0 0 0 139.81013334L478.29022341 779.86980386a77.6722963 77.6722963 0 0 0 67.73024237 0z m-33.86512119-69.90506667l-347.3763994-168.21230341 347.3763994-168.23819378 347.3763994 168.23819378-347.3763994 168.21230341z"  horiz-adv-x="1024" />
@@ -28,7 +36,7 @@
       
       <glyph glyph-name="appstore1" unicode="&#59282;" d="M464 752H160c-8.8 0-16-7.2-16-16v-304c0-8.8 7.2-16 16-16h304c8.8 0 16 7.2 16 16V736c0 8.8-7.2 16-16 16z m-52-268H212V684h200v-200zM864 752H560c-8.8 0-16-7.2-16-16v-304c0-8.8 7.2-16 16-16h304c8.8 0 16 7.2 16 16V736c0 8.8-7.2 16-16 16z m-52-268H612V684h200v-200zM464 352H160c-8.8 0-16-7.2-16-16v-304c0-8.8 7.2-16 16-16h304c8.8 0 16 7.2 16 16V336c0 8.8-7.2 16-16 16z m-52-268H212V284h200v-200zM864 352H560c-8.8 0-16-7.2-16-16v-304c0-8.8 7.2-16 16-16h304c8.8 0 16 7.2 16 16V336c0 8.8-7.2 16-16 16z m-52-268H612V284h200v-200z"  horiz-adv-x="1024" />
       
-      <glyph glyph-name="log" unicode="&#59283;" d="M880 784H144c-17.7 0-32-14.3-32-32v-736c0-17.7 14.3-32 32-32h736c17.7 0 32 14.3 32 32V752c0 17.7-14.3 32-32 32z m-40-728H184V712h656v-656zM492 496h184c4.4 0 8 3.6 8 8v48c0 4.4-3.6 8-8 8H492c-4.4 0-8-3.6-8-8v-48c0-4.4 3.6-8 8-8zM492 352h184c4.4 0 8 3.6 8 8v48c0 4.4-3.6 8-8 8H492c-4.4 0-8-3.6-8-8v-48c0-4.4 3.6-8 8-8zM492 208h184c4.4 0 8 3.6 8 8v48c0 4.4-3.6 8-8 8H492c-4.4 0-8-3.6-8-8v-48c0-4.4 3.6-8 8-8zM380 528m-40 0a40 40 0 1 1 80 0 40 40 0 1 1-80 0ZM380 384m-40 0a40 40 0 1 1 80 0 40 40 0 1 1-80 0ZM380 240m-40 0a40 40 0 1 1 80 0 40 40 0 1 1-80 0Z"  horiz-adv-x="1024" />
+      <glyph glyph-name="log" unicode="&#59283;" d="M857 759H167c-16.59375 0-30-13.40625-30-30v-690c0-16.59375 13.40625-30 30-30h690c16.59375 0 30 13.40625 30 30V729c0 16.59375-13.40625 30-30 30z m-37.5-682.5H204.5V691.5h615v-615zM493.25 489h172.5c4.125 0 7.5 3.375 7.5 7.5v45c0 4.125-3.375 7.5-7.5 7.5H493.25c-4.125 0-7.5-3.375-7.5-7.5v-45c0-4.125 3.375-7.5 7.5-7.5zM493.25 354h172.5c4.125 0 7.5 3.375 7.5 7.5v45c0 4.125-3.375 7.5-7.5 7.5H493.25c-4.125 0-7.5-3.375-7.5-7.5v-45c0-4.125 3.375-7.5 7.5-7.5zM493.25 219h172.5c4.125 0 7.5 3.375 7.5 7.5v45c0 4.125-3.375 7.5-7.5 7.5H493.25c-4.125 0-7.5-3.375-7.5-7.5v-45c0-4.125 3.375-7.5 7.5-7.5zM388.25 519m-37.5 0a37.5 37.5 0 1 1 75 0 37.5 37.5 0 1 1-75 0ZM388.25 384m-37.5 0a37.5 37.5 0 1 1 75 0 37.5 37.5 0 1 1-75 0ZM388.25 249m-37.5 0a37.5 37.5 0 1 1 75 0 37.5 37.5 0 1 1-75 0Z"  horiz-adv-x="1024" />
       
       <glyph glyph-name="host" unicode="&#59313;" d="M832 832H192c-17.7 0-32-14.3-32-32v-832c0-17.7 14.3-32 32-32h640c17.7 0 32 14.3 32 32V800c0 17.7-14.3 32-32 32z m-600-72h560v-208H232V760z m560-480H232V488h560v-208z m0-272H232V216h560v-208zM496 688H312c-4.4 0-8-3.6-8-8v-48c0-4.4 3.6-8 8-8h184c4.4 0 8 3.6 8 8v48c0 4.4-3.6 8-8 8zM312 352h184c4.4 0 8 3.6 8 8v48c0 4.4-3.6 8-8 8H312c-4.4 0-8-3.6-8-8v-48c0-4.4 3.6-8 8-8zM680 108m-40 0a40 40 0 1 1 80 0 40 40 0 1 1-80 0Z"  horiz-adv-x="1024" />
       

frontend/src/components/app-layout/footer/index.vue

@@ -3,7 +3,7 @@
         <slot></slot>
     </div>
     <div class="footer flx-center">
-        <a href="http://www.spicyboy.cn/" target="_blank"> 2022 © 1Panel By 飞致云. </a>
+        <a href="http://www.spicyboy.cn/" target="_blank">2022 © 1Panel By 飞致云.</a>
     </div>
 </template>
 

frontend/src/components/app-layout/header/components/Avatar.vue

@@ -1,69 +0,0 @@
-<template>
-    <el-dropdown trigger="click">
-        <div class="avatar">
-            <img src="@/assets/images/avatar.gif" alt="avatar" />
-        </div>
-        <template #dropdown>
-            <el-dropdown-menu>
-                <el-dropdown-item @click="openDialog('infoRef')">{{
-                    $t('commons.header.personalData')
-                }}</el-dropdown-item>
-                <el-dropdown-item @click="openDialog('passwordRef')">{{
-                    $t('commons.header.changePassword')
-                }}</el-dropdown-item>
-                <el-dropdown-item @click="logout" divided>{{ $t('commons.header.logout') }}</el-dropdown-item>
-            </el-dropdown-menu>
-        </template>
-    </el-dropdown>
-    <InfoDialog ref="infoRef"></InfoDialog>
-    <PasswordDialog ref="passwordRef"></PasswordDialog>
-</template>
-
-<script setup lang="ts">
-import { ref } from 'vue';
-import InfoDialog from './info-dialog.vue';
-import PasswordDialog from './password-dialog.vue';
-import { ElMessageBox, ElMessage } from 'element-plus';
-import { useRouter } from 'vue-router';
-import { GlobalStore } from '@/store';
-import { logOutApi } from '@/api/modules/login';
-import i18n from '@/lang';
-
-const router = useRouter();
-const globalStore = GlobalStore();
-
-const logout = () => {
-    ElMessageBox.confirm(i18n.global.t('commons.msg.sureLogOut'), i18n.global.t('commons.msg.infoTitle'), {
-        confirmButtonText: i18n.global.t('commons.button.confirm'),
-        cancelButtonText: i18n.global.t('commons.button.cancel'),
-        type: 'warning',
-    }).then(() => {
-        systemLogOut();
-        router.push({ name: 'login' });
-        globalStore.setLogStatus(false);
-        ElMessage({
-            type: 'success',
-            message: i18n.global.t('commons.msg.operationSuccess'),
-        });
-    });
-};
-
-const systemLogOut = async () => {
-    await logOutApi();
-};
-
-interface DialogExpose {
-    openDialog: () => void;
-}
-const infoRef = ref<null | DialogExpose>(null);
-const passwordRef = ref<null | DialogExpose>(null);
-
-const openDialog = (refName: string) => {
-    if (refName == 'infoRef') return infoRef.value?.openDialog();
-    passwordRef.value?.openDialog();
-};
-</script>
-
-<style scoped lang="scss">
-@import '../index.scss';
-</style>

frontend/src/components/app-layout/header/components/Info-dialog.vue

@@ -1,19 +0,0 @@
-<template>
-    <el-dialog v-model="dialogVisible" :title="$t('commons.header.personalData')" width="500px" draggable>
-        <span>This is userInfo</span>
-    </el-dialog>
-</template>
-
-<script setup lang="ts">
-import { ref } from 'vue';
-const dialogVisible = ref(false);
-
-// openDialog
-const openDialog = () => {
-    dialogVisible.value = true;
-};
-
-defineExpose({
-    openDialog,
-});
-</script>

frontend/src/components/app-layout/header/components/Language.vue

@@ -1,44 +0,0 @@
-<template>
-    <el-dropdown trigger="click" @command="handleSetLanguage">
-        <span>
-            <el-tooltip effect="dark" :content="$t('commons.header.language')" placement="bottom">
-                <i :class="'panel p-language'" class="icon-style"></i>
-            </el-tooltip>
-        </span>
-        <template #dropdown>
-            <el-dropdown-menu>
-                <el-dropdown-item :disabled="language && language === 'zh'" command="zh">{{
-                    $t('commons.header.zh')
-                }}</el-dropdown-item>
-                <el-dropdown-item :disabled="language === 'en'" command="en">{{
-                    $t('commons.header.en')
-                }}</el-dropdown-item>
-            </el-dropdown-menu>
-        </template>
-    </el-dropdown>
-</template>
-
-<script setup lang="ts">
-import { computed, onMounted } from 'vue';
-import { useI18n } from 'vue-i18n';
-import { GlobalStore } from '@/store';
-import { getBrowserLang } from '@/utils/util';
-
-const i18n = useI18n();
-const globalStore = GlobalStore();
-const language = computed((): string => globalStore.language);
-
-// 切换语言
-const handleSetLanguage = (lang: string) => {
-    i18n.locale.value = lang;
-    globalStore.updateLanguage(lang);
-};
-
-onMounted(() => {
-    handleSetLanguage(language.value || getBrowserLang());
-});
-</script>
-
-<style scoped lang="scss">
-@import '../index.scss';
-</style>

frontend/src/components/app-layout/header/components/Theme.vue

@@ -10,8 +10,11 @@
             </el-divider>
             <div class="theme-item">
                 <span>{{ $t('commons.header.themeColor') }}</span>
-                <el-color-picker v-model="themeConfig.primary" :predefine="colorList" @change="changePrimary">
+                <el-color-picker
-                </el-color-picker>
+                    v-model="themeConfig.primary"
+                    :predefine="colorList"
+                    @change="changePrimary"
+                ></el-color-picker>
             </div>
             <div class="theme-item">
                 <span>{{ $t('commons.header.darkTheme') }}</span>

frontend/src/components/app-layout/header/components/password-dialog.vue

@@ -1,25 +0,0 @@
-<template>
-    <el-dialog v-model="dialogVisible" :title="$t('commons.header.changePassword')" width="500px" draggable>
-        <span>This is Password</span>
-        <template #footer>
-            <span class="dialog-footer">
-                <el-button @click="dialogVisible = false">{{ $t('commons.button.cancel') }}</el-button>
-                <el-button type="primary" @click="dialogVisible = false">{{ $t('commons.button.confirm') }}</el-button>
-            </span>
-        </template>
-    </el-dialog>
-</template>
-
-<script setup lang="ts">
-import { ref } from 'vue';
-const dialogVisible = ref(false);
-
-// openDialog
-const openDialog = () => {
-    dialogVisible.value = true;
-};
-
-defineExpose({
-    openDialog,
-});
-</script>

frontend/src/components/app-layout/header/index.vue

@@ -4,23 +4,12 @@
             <CollapseIcon id="collapseIcon"></CollapseIcon>
             <Breadcrumb id="breadcrumb" v-if="themeConfig.breadcrumb"></Breadcrumb>
         </div>
-        <div class="header-ri flx-center">
-            <div class="header-icon">
-                <Language id="language"></Language>
-                <Theme id="theme"></Theme>
-            </div>
-            <span class="username">1Panel</span>
-            <Avatar></Avatar>
-        </div>
     </div>
 </template>
 <script setup lang="ts">
 import { computed } from 'vue';
 import CollapseIcon from './components/collapseicon.vue';
 import Breadcrumb from './components/breadcrumb.vue';
-import Language from './components/language.vue';
-import Theme from './components/theme.vue';
-import Avatar from './components/avatar.vue';
 import { GlobalStore } from '@/store';
 
 const globalStore = GlobalStore();

frontend/src/components/app-layout/menu/index.vue

@@ -20,11 +20,16 @@
                 active-text-color="#fff"
             >
                 <SubItem :menuList="routerMenus"></SubItem>
+                <el-menu-item>
+                    <el-icon>
+                        <SvgIcon :iconName="'p-logout'" :className="'svg-icon'"></SvgIcon>
+                    </el-icon>
+                    <template #title>
+                        <span @click="logout">{{ $t('commons.header.logout') }}</span>
+                    </template>
+                </el-menu-item>
             </el-menu>
         </el-scrollbar>
-        <div class="menu-footer">
-            <CollapseIcon></CollapseIcon>
-        </div>
     </div>
 </template>
 
@@ -35,10 +40,14 @@ import { MenuStore } from '@/store/modules/menu';
 import { loadingSvg } from '@/utils/svg';
 import Logo from './components/logo.vue';
 import SubItem from './components/sub-item.vue';
-import { menuList } from '@/routers/router';
+import router, { menuList } from '@/routers/router';
-import CollapseIcon from '../header/components/collapseicon.vue';
+import { logOutApi } from '@/api/modules/login';
+import i18n from '@/lang';
+import { ElMessageBox, ElMessage } from 'element-plus';
+import { GlobalStore } from '@/store';
 const route = useRoute();
 const menuStore = MenuStore();
+const globalStore = GlobalStore();
 
 onMounted(async () => {
     menuStore.setMenuList(menuList);
@@ -66,6 +75,26 @@ const listeningWindow = () => {
     };
 };
 listeningWindow();
+
+const logout = () => {
+    ElMessageBox.confirm(i18n.global.t('commons.msg.sureLogOut'), i18n.global.t('commons.msg.infoTitle'), {
+        confirmButtonText: i18n.global.t('commons.button.confirm'),
+        cancelButtonText: i18n.global.t('commons.button.cancel'),
+        type: 'warning',
+    }).then(() => {
+        systemLogOut();
+        router.push({ name: 'login' });
+        globalStore.setLogStatus(false);
+        ElMessage({
+            type: 'success',
+            message: i18n.global.t('commons.msg.operationSuccess'),
+        });
+    });
+};
+
+const systemLogOut = async () => {
+    await logOutApi();
+};
 </script>
 
 <style scoped lang="scss">

frontend/src/components/bread-crumbs/bread-crumbs-item.vue

@@ -1,6 +1,7 @@
 <template>
     <div class="bread-crumbs-item">
-        <el-link><slot></slot></el-link> <i v-if="!props.right" :class="'panel p-arrow-right'"></i>
+        <el-link><slot></slot></el-link>
+        <i v-if="!props.right" :class="'panel p-arrow-right'"></i>
     </div>
 </template>
 

frontend/src/components/file-list/index.vue

@@ -11,12 +11,13 @@
                     :key="key"
                     @click="jump(key)"
                     :right="key == paths.length - 1"
-                    >{{ item }}</BreadCrumbItem
                 >
+                    {{ item }}
+                </BreadCrumbItem>
             </BreadCrumbs>
         </div>
         <div>
-            <el-input :prefix-icon="Search"> </el-input>
+            <el-input :prefix-icon="Search"></el-input>
             <el-table :data="data" highlight-current-row height="40vh">
                 <el-table-column width="40" fix>
                     <template #default="{ row }">

frontend/src/lang/modules/en.ts

@@ -82,11 +82,23 @@ export default {
         },
     },
     menu: {
-        home: 'Dashboard',
+        home: 'Overview',
-        demo: 'Demo',
+        demo: 'Example',
-        monitor: 'Monitor',
         terminal: 'Terminal',
-        operations: 'Operation logs',
+        apps: 'App Store',
+        website: 'Website',
+        project: 'Project',
+        config: 'Config',
+        firewall: 'Firewall',
+        database: 'Database',
+        container: 'Container',
+        plan: 'Planned Task',
+        host: 'Host',
+        security: 'Security',
+        systemConfig: 'Panel Settings',
+        toolbox: 'Toolbox',
+        monitor: 'Monitor',
+        operations: 'Operation Records',
         files: 'File Management',
     },
     home: {

frontend/src/lang/modules/zh.ts

@@ -32,7 +32,7 @@ export default {
             delete: '此操作不可回滚,是否继续',
             deleteTitle: '删除',
             deleteSuccess: '删除成功',
-            loginSuccess: '登陆成功',
+            loginSuccess: '登录成功',
             operationSuccess: '操作成功',
             requestTimeout: '请求超时,请稍后重试',
             infoTitle: '提示',
@@ -85,8 +85,6 @@ export default {
         home: '概览',
         demo: '样例',
         terminal: '终端',
-        operations: '操作日志',
-        files: '文件',
         apps: '应用商店',
         website: '网站',
         project: '项目',
@@ -99,7 +97,6 @@ export default {
         security: '安全',
         systemConfig: '面板设置',
         toolbox: '工具箱',
-        terminal: '终端管理',
         monitor: '监控',
         operations: '操作记录',
         files: '文件管理',

frontend/src/layout/index.vue

@@ -16,25 +16,25 @@
                     <View></View>
                 </Content>
             </el-main>
-            <el-footer v-if="themeConfig.footer">
+            <!-- <el-footer v-if="themeConfig.footer">
                 <Footer>
                     <slot name="footer"></slot>
                 </Footer>
-            </el-footer>
+            </el-footer> -->
         </el-container>
     </el-container>
 </template>
 
 <script setup lang="ts">
-import { computed } from 'vue';
+// import { computed } from 'vue';
 import Menu from './layout-menu.vue';
 import Header from './layout-header.vue';
-import Footer from './layout-footer.vue';
+// import Footer from './layout-footer.vue';
 import View from './layout-view.vue';
 import Content from './layout-content.vue';
-import { GlobalStore } from '@/store';
+// import { GlobalStore } from '@/store';
-const globalStore = GlobalStore();
+// const globalStore = GlobalStore();
-const themeConfig = computed(() => globalStore.themeConfig);
+// const themeConfig = computed(() => globalStore.themeConfig);
 </script>
 
 <style scoped lang="scss">

frontend/src/layout/layout-content.vue

@@ -9,7 +9,7 @@
                     :header="header"
                     v-if="showBack"
                 ></back-button>
-                <span v-else> {{ header }}</span>
+                <span v-else>{{ header }}</span>
             </slot>
         </div>
         <div class="content-container__toolbar" v-if="slots.toolbar">

frontend/src/routers/modules/app-store.ts

@@ -1,6 +1,5 @@
 import { Layout } from '@/routers/constant';
 
-// demo
 const appStoreRouter = {
     sort: 2,
     path: '/apps',
@@ -15,9 +14,7 @@ const appStoreRouter = {
             path: '/apps',
             name: 'App',
             component: () => import('@/views/app-store/index.vue'),
-            meta: {
+            meta: {},
-                keepAlive: true,
-            },
         },
     ],
 };

frontend/src/routers/modules/config.ts

@@ -1,23 +1,20 @@
 import { Layout } from '@/routers/constant';
 
 const systemConfigRouter = {
-    sort: 7,
+    sort: 8,
-    path: '/config',
+    path: '/configs',
     component: Layout,
-    redirect: '/config',
+    redirect: '/configs',
     meta: {
         icon: 'p-config',
         title: 'menu.systemConfig',
     },
     children: [
         {
-            path: '/config',
+            path: '/configs',
             name: 'SystemConfig',
             component: () => import('@/views/system-config/index.vue'),
-            meta: {
+            meta: {},
-                hidden: true,
-                keepAlive: true,
-            },
         },
     ],
 };

frontend/src/routers/modules/container.ts

@@ -1,6 +1,6 @@
 import { Layout } from '@/routers/constant';
 
-const webSiteRouter = {
+const containerRouter = {
     sort: 5,
     path: '/containers',
     component: Layout,
@@ -14,11 +14,9 @@ const webSiteRouter = {
             path: '/containers',
             name: 'Container',
             component: () => import('@/views/container/index.vue'),
-            meta: {
+            meta: {},
-                keepAlive: true,
-            },
         },
     ],
 };
 
-export default webSiteRouter;
+export default containerRouter;

frontend/src/routers/modules/database.ts

@@ -14,9 +14,7 @@ const databaseRouter = {
             path: '/database',
             name: 'Database',
             component: () => import('@/views/database/index.vue'),
-            meta: {
+            meta: {},
-                keepAlive: true,
-            },
         },
     ],
 };

frontend/src/routers/modules/host.ts

@@ -1,42 +1,48 @@
 import { Layout } from '@/routers/constant';
 
 const hostRouter = {
-    sort: 6,
+    sort: 7,
-    path: '/host',
+    path: '/hosts',
     component: Layout,
-    redirect: '/host/security',
+    redirect: '/hosts/security',
     meta: {
         icon: 'p-host',
         title: 'menu.host',
     },
     children: [
         {
-            path: '/host/security',
+            path: '/hosts/security',
             name: 'Security',
             component: () => import('@/views/host/security/index.vue'),
             meta: {
                 title: 'menu.security',
-                keepAlive: true,
             },
         },
         {
-            path: '/host/files',
+            path: '/hosts/files',
             name: 'File',
             component: () => import('@/views/host/file-management/index.vue'),
             meta: {
                 title: 'menu.files',
+            },
+        },
+        {
+            path: '/hosts/monitor',
+            name: 'Monitor',
+            component: () => import('@/views/monitor/index.vue'),
+            meta: {
+                title: 'menu.monitor',
+            },
+        },
+        {
+            path: '/host/terminal',
+            name: 'Terminal',
+            component: () => import('@/views/host/terminal/index.vue'),
+            meta: {
+                title: 'menu.terminal',
                 keepAlive: true,
             },
         },
-        // {
-        //     path: '/host/terminal',
-        //     name: 'Terminal',
-        //     component: () => import('@/views/host/terminal/index.vue'),
-        //     meta: {
-        //         title: 'menu.terminal',
-        //         keepAlive: true,
-        //     },
-        // },
     ],
 };
 

frontend/src/routers/modules/monitor.ts

@@ -1,28 +0,0 @@
-import { Layout } from '@/routers/constant';
-
-const monitorRouter = {
-    sort: 2,
-    path: '/monitors',
-    component: Layout,
-    redirect: '/monitor',
-    meta: {
-        title: 'menu.monitor',
-        icon: 'monitor',
-    },
-    children: [
-        {
-            path: '/monitors/monitor',
-            name: 'Monitor',
-            component: () => import('@/views/monitor/index.vue'),
-            meta: {
-                requiresAuth: true,
-                key: 'Monitor',
-                title: 'menu.monitor',
-                icon: 'Connection',
-                activeMenu: '/monitors',
-            },
-        },
-    ],
-};
-
-export default monitorRouter;

frontend/src/routers/modules/operation-log.ts

@@ -1,7 +1,7 @@
 import { Layout } from '@/routers/constant';
 
 const operationRouter = {
-    sort: 8,
+    sort: 10,
     path: '/operations',
     component: Layout,
     redirect: '/operation',
@@ -14,10 +14,7 @@ const operationRouter = {
             path: '/operation',
             name: 'OperationLog',
             component: () => import('@/views/operation-log/index.vue'),
-            meta: {
+            meta: {},
-                requiresAuth: true,
-                key: 'OperationLog',
-            },
         },
     ],
 };

frontend/src/routers/modules/plan.ts

@@ -1,7 +1,7 @@
 import { Layout } from '@/routers/constant';
 
 const planRouter = {
-    sort: 5,
+    sort: 6,
     path: '/plans',
     component: Layout,
     redirect: '/plans',
@@ -14,9 +14,7 @@ const planRouter = {
             path: '/plans',
             name: 'Plan',
             component: () => import('@/views/plan/index.vue'),
-            meta: {
+            meta: {},
-                keepAlive: true,
-            },
         },
     ],
 };

frontend/src/routers/modules/toolbox.ts

@@ -1,7 +1,7 @@
 import { Layout } from '@/routers/constant';
 
 const toolBoxRouter = {
-    sort: 7,
+    sort: 9,
     path: '/toolbox',
     component: Layout,
     redirect: '/toolbox',
@@ -14,9 +14,7 @@ const toolBoxRouter = {
             path: '/toolbox',
             name: 'ToolBox',
             component: () => import('@/views/toolbox/index.vue'),
-            meta: {
+            meta: {},
-                keepAlive: true,
-            },
         },
     ],
 };

frontend/src/routers/modules/website.ts

@@ -16,7 +16,6 @@ const webSiteRouter = {
             component: () => import('@/views/website/project/index.vue'),
             meta: {
                 title: 'menu.project',
-                keepAlive: true,
             },
         },
         {
@@ -25,7 +24,6 @@ const webSiteRouter = {
             component: () => import('@/views/website/config/index.vue'),
             meta: {
                 title: 'menu.config',
-                keepAlive: true,
             },
         },
         {
@@ -34,7 +32,6 @@ const webSiteRouter = {
             component: () => import('@/views/website/project/index.vue'),
             meta: {
                 title: 'menu.firewall',
-                keepAlive: true,
             },
         },
     ],

frontend/src/styles/element.scss

@@ -182,11 +182,11 @@
 .row-box {
     display: flex;
     flex-flow: wrap;
-  }
+}
-.row-box .el-card {
+.row-box .el-card {
-  min-width: 100%;
+    min-width: 100%;
-  height: 100%;
+    height: 100%;
-  margin-right: 20px;
+    margin-right: 20px;
-  border: 0;
+    border: 0;
-  // box-shadow: 0 2px 12px 0 rgb(0 0 0 / 10%);
+    // box-shadow: 0 2px 12px 0 rgb(0 0 0 / 10%);
 }

frontend/src/views/demos/table/index.vue

@@ -4,9 +4,9 @@
             <template #toolbar>
                 <el-button type="primary" @click="openOperate(null)">{{ $t('commons.button.create') }}</el-button>
                 <el-button type="primary" plain>{{ '其他操作' }}</el-button>
-                <el-button type="danger" plain :disabled="selects.length === 0" @click="batchDelete(null)">{{
+                <el-button type="danger" plain :disabled="selects.length === 0" @click="batchDelete(null)">
-                    $t('commons.button.delete')
+                    {{ $t('commons.button.delete') }}
-                }}</el-button>
+                </el-button>
             </template>
             <el-table-column type="selection" fix />
             <el-table-column label="ID" min-width="100" prop="id" fix />

frontend/src/views/demos/table/operate/index.vue

@@ -14,9 +14,9 @@
             </el-form>
             <div class="form-button">
                 <el-button @click="router.back()">{{ $t('commons.button.cancel') }}</el-button>
-                <el-button type="primary" @click="submitForm(ruleFormRef)">{{
+                <el-button type="primary" @click="submitForm(ruleFormRef)">
-                    $t('commons.button.confirm')
+                    {{ $t('commons.button.confirm') }}
-                }}</el-button>
+                </el-button>
             </div>
         </template>
     </LayoutContent>

frontend/src/views/host/file-management/change-role/index.vue

@@ -1,14 +1,6 @@
 <template>
-    <el-dialog
+    <el-dialog v-model="open" :before-close="handleClose" :title="$t('file.setRole')" width="30%" @open="onOpen">
-        v-model="open"
+        <FileRole v-loading="loading" :mode="mode" @get-mode="getMode"></FileRole>
-        :before-close="handleClose"
-        :title="$t('file.setRole')"
-        width="30%"
-        @open="onOpen"
-        v-loading="loading"
-        destory-on-close
-    >
-        <FileRole :mode="mode" @get-mode="getMode"></FileRole>
         <template #footer>
             <span class="dialog-footer">
                 <el-button @click="handleClose">{{ $t('commons.button.cancel') }}</el-button>

frontend/src/views/host/file-management/compress/index.vue

@@ -1,6 +1,13 @@
 <template>
-    <el-dialog v-model="open" :title="title" :before-close="handleClose" width="30%" @open="onOpen" v-loading="loading">
+    <el-dialog v-model="open" :title="title" :before-close="handleClose" width="30%" @open="onOpen">
-        <el-form ref="fileForm" label-position="left" :model="form" label-width="100px" :rules="rules">
+        <el-form
+            ref="fileForm"
+            label-position="left"
+            :model="form"
+            label-width="100px"
+            :rules="rules"
+            v-loading="loading"
+        >
             <el-form-item :label="$t('file.compressType')" prop="type">
                 <el-select v-model="form.type">
                     <el-option v-for="item in options" :key="item" :label="item" :value="item" />
@@ -8,13 +15,13 @@
             </el-form-item>
             <el-form-item :label="$t('file.name')" prop="name">
                 <el-input v-model="form.name">
-                    <template #append>{{ extension }}</template></el-input
+                    <template #append>{{ extension }}</template>
-                >
+                </el-input>
             </el-form-item>
             <el-form-item :label="$t('file.compressDst')" prop="dst">
                 <el-input v-model="form.dst">
-                    <template #append> <FileList :path="props.dst" @choose="getLinkPath"></FileList> </template
+                    <template #append><FileList :path="props.dst" @choose="getLinkPath"></FileList></template>
-                ></el-input>
+                </el-input>
             </el-form-item>
             <el-form-item>
                 <el-checkbox v-model="form.replace" :label="$t('file.replace')"></el-checkbox>

frontend/src/views/host/file-management/create/index.vue

@@ -5,14 +5,20 @@
         :title="$t('commons.button.create')"
         width="30%"
         @open="onOpen"
-        v-loading="loading"
     >
-        <el-form ref="fileForm" label-position="left" :model="addForm" label-width="100px" :rules="rules">
+        <el-form
-            <el-form-item :label="$t('file.path')" prop="path"> <el-input v-model="getPath" disabled /></el-form-item>
+            ref="fileForm"
-            <el-form-item :label="$t('file.name')" prop="name"> <el-input v-model="addForm.name" /></el-form-item>
+            label-position="left"
+            :model="addForm"
+            label-width="100px"
+            :rules="rules"
+            v-loading="loading"
+        >
+            <el-form-item :label="$t('file.path')" prop="path"><el-input v-model="getPath" disabled /></el-form-item>
+            <el-form-item :label="$t('file.name')" prop="name"><el-input v-model="addForm.name" /></el-form-item>
             <el-form-item v-if="!addForm.isDir">
-                <el-checkbox v-model="addForm.isLink" :label="$t('file.link')"></el-checkbox
+                <el-checkbox v-model="addForm.isLink" :label="$t('file.link')"></el-checkbox>
-            ></el-form-item>
+            </el-form-item>
             <el-form-item :label="$t('file.linkType')" v-if="addForm.isLink" prop="linkType">
                 <el-radio-group v-model="addForm.isSymlink">
                     <el-radio :label="true">{{ $t('file.softLink') }}</el-radio>

frontend/src/views/host/file-management/decompress/index.vue

@@ -1,29 +1,31 @@
 <template>
-    <el-dialog
+    <div>
-        v-model="open"
+        <el-dialog v-model="open" :title="$t('file.deCompress')" :before-close="handleClose" width="30%" @open="onOpen">
-        :title="$t('file.deCompress')"
+            <el-form
-        :before-close="handleClose"
+                ref="fileForm"
-        width="30%"
+                label-position="left"
-        @open="onOpen"
+                :model="form"
-        v-loading="loading"
+                label-width="100px"
-    >
+                :rules="rules"
-        <el-form ref="fileForm" label-position="left" :model="form" label-width="100px" :rules="rules">
+                v-loading="loading"
-            <el-form-item :label="$t('file.name')">
+            >
-                <el-input v-model="name" disabled></el-input>
+                <el-form-item :label="$t('file.name')">
-            </el-form-item>
+                    <el-input v-model="name" disabled></el-input>
-            <el-form-item :label="$t('file.deCompressDst')" prop="dst">
+                </el-form-item>
-                <el-input v-model="form.dst">
+                <el-form-item :label="$t('file.deCompressDst')" prop="dst">
-                    <template #append> <FileList :path="props.dst" @choose="getLinkPath"></FileList> </template
+                    <el-input v-model="form.dst">
-                ></el-input>
+                        <template #append><FileList :path="props.dst" @choose="getLinkPath"></FileList></template>
-            </el-form-item>
+                    </el-input>
-        </el-form>
+                </el-form-item>
-        <template #footer>
+            </el-form>
-            <span class="dialog-footer">
+            <template #footer>
-                <el-button @click="handleClose">{{ $t('commons.button.cancel') }}</el-button>
+                <span class="dialog-footer">
-                <el-button type="primary" @click="submit(fileForm)">{{ $t('commons.button.confirm') }}</el-button>
+                    <el-button @click="handleClose">{{ $t('commons.button.cancel') }}</el-button>
-            </span>
+                    <el-button type="primary" @click="submit(fileForm)">{{ $t('commons.button.confirm') }}</el-button>
-        </template>
+                </span>
-    </el-dialog>
+            </template>
+        </el-dialog>
+    </div>
 </template>
 
 <script setup lang="ts">

frontend/src/views/host/file-management/download/index.vue

@@ -1,31 +1,33 @@
 <template>
-    <el-dialog
+    <div>
-        v-model="open"
+        <el-dialog v-model="open" :title="$t('file.download')" :before-close="handleClose" width="30%" @open="onOpen">
-        :title="$t('file.download')"
+            <el-form
-        :before-close="handleClose"
+                ref="fileForm"
-        width="30%"
+                label-position="left"
-        @open="onOpen"
+                :model="addForm"
-        v-loading="loading"
+                label-width="100px"
-    >
+                :rules="rules"
-        <el-form ref="fileForm" label-position="left" :model="addForm" label-width="100px" :rules="rules">
+                v-loading="loading"
-            <el-form-item :label="$t('file.compressType')" prop="type">
+            >
-                <el-select v-model="addForm.type">
+                <el-form-item :label="$t('file.compressType')" prop="type">
-                    <el-option v-for="item in options" :key="item" :label="item" :value="item" />
+                    <el-select v-model="addForm.type">
-                </el-select>
+                        <el-option v-for="item in options" :key="item" :label="item" :value="item" />
-            </el-form-item>
+                    </el-select>
-            <el-form-item :label="$t('file.name')" prop="name">
+                </el-form-item>
-                <el-input v-model="addForm.name">
+                <el-form-item :label="$t('file.name')" prop="name">
-                    <template #append>{{ extension }}</template></el-input
+                    <el-input v-model="addForm.name">
-                >
+                        <template #append>{{ extension }}</template>
-            </el-form-item>
+                    </el-input>
-        </el-form>
+                </el-form-item>
-        <template #footer>
+            </el-form>
-            <span class="dialog-footer">
+            <template #footer>
-                <el-button @click="handleClose">{{ $t('commons.button.cancel') }}</el-button>
+                <span class="dialog-footer">
-                <el-button type="primary" @click="submit(fileForm)">{{ $t('commons.button.confirm') }}</el-button>
+                    <el-button @click="handleClose">{{ $t('commons.button.cancel') }}</el-button>
-            </span>
+                    <el-button type="primary" @click="submit(fileForm)">{{ $t('commons.button.confirm') }}</el-button>
-        </template>
+                </span>
-    </el-dialog>
+            </template>
+        </el-dialog>
+    </div>
 </template>
 
 <script setup lang="ts">

frontend/src/views/host/file-management/index.vue

@@ -33,8 +33,9 @@
                             :key="key"
                             @click="jump(key)"
                             :right="key == paths.length - 1"
-                            >{{ item }}</BreadCrumbItem
                         >
+                            {{ item }}
+                        </BreadCrumbItem>
                     </BreadCrumbs>
                 </div>
                 <ComplexTable
@@ -44,34 +45,46 @@
                     v-loading="loading"
                 >
                     <template #toolbar>
-                        <el-dropdown split-button type="primary" @command="handleCreate">
+                        <el-button-group>
-                            {{ $t('commons.button.create') }}
+                            <el-dropdown split-button type="primary" @command="handleCreate">
-                            <template #dropdown>
+                                {{ $t('commons.button.create') }}
-                                <el-dropdown-menu>
+                                <template #dropdown>
-                                    <el-dropdown-item command="dir">
+                                    <el-dropdown-menu>
-                                        <svg-icon iconName="p-file-folder"></svg-icon>{{ $t('file.dir') }}
+                                        <el-dropdown-item command="dir">
-                                    </el-dropdown-item>
+                                            <svg-icon iconName="p-file-folder"></svg-icon>
-                                    <el-dropdown-item command="file">
+                                            {{ $t('file.dir') }}
-                                        <svg-icon iconName="p-file-normal"></svg-icon>{{ $t('file.file') }}
+                                        </el-dropdown-item>
-                                    </el-dropdown-item>
+                                        <el-dropdown-item command="file">
-                                </el-dropdown-menu>
+                                            <svg-icon iconName="p-file-normal"></svg-icon>
-                            </template>
+                                            {{ $t('file.file') }}
-                        </el-dropdown>
+                                        </el-dropdown-item>
-                        <el-button type="primary" plain @click="openUpload"> {{ $t('file.upload') }}</el-button>
+                                    </el-dropdown-menu>
-                        <!-- <el-button type="primary" plain> {{ $t('file.search') }}</el-button> -->
+                                </template>
-                        <el-button type="primary" plain @click="openWget"> {{ $t('file.remoteFile') }}</el-button>
+                            </el-dropdown>
-                        <el-button type="primary" plain @click="openMove('copy')" :disabled="selects.length === 0">
+                        </el-button-group>
-                            {{ $t('file.copy') }}</el-button
+                        <el-button-group style="margin-left: 5px">
-                        >
+                            <el-button type="primary" plain @click="openUpload">{{ $t('file.upload') }}</el-button>
-                        <el-button type="primary" plain @click="openMove('cut')" :disabled="selects.length === 0">
+                            <!-- <el-button type="primary" plain> {{ $t('file.search') }}</el-button> -->
-                            {{ $t('file.move') }}</el-button
+                            <el-button type="primary" plain @click="openWget">{{ $t('file.remoteFile') }}</el-button>
-                        >
+                            <el-button type="primary" plain @click="openMove('copy')" :disabled="selects.length === 0">
-                        <el-button type="primary" plain @click="openCompress(selects)" :disabled="selects.length === 0">
+                                {{ $t('file.copy') }}
-                            {{ $t('file.compress') }}</el-button
+                            </el-button>
-                        >
+                            <el-button type="primary" plain @click="openMove('cut')" :disabled="selects.length === 0">
-                        <el-button type="primary" plain @click="openDownload" :disabled="selects.length === 0">
+                                {{ $t('file.move') }}
-                            {{ $t('file.download') }}</el-button
+                            </el-button>
-                        >
+                            <el-button
+                                type="primary"
+                                plain
+                                @click="openCompress(selects)"
+                                :disabled="selects.length === 0"
+                            >
+                                {{ $t('file.compress') }}
+                            </el-button>
+                            <el-button type="primary" plain @click="openDownload" :disabled="selects.length === 0">
+                                {{ $t('file.download') }}
+                            </el-button>
+                        </el-button-group>
+
                         <!-- <el-button type="primary" plain> {{ $t('file.sync') }}</el-button>
                         <el-button type="primary" plain> {{ $t('file.terminal') }}</el-button>
                         <el-button type="primary" plain> {{ $t('file.shareList') }}</el-button> -->
@@ -82,7 +95,7 @@
                             <svg-icon v-if="row.isDir" className="table-icon" iconName="p-file-folder"></svg-icon>
                             <svg-icon v-else className="table-icon" iconName="p-file-normal"></svg-icon>
                             <el-link :underline="false" @click="open(row)">{{ row.name }}</el-link>
-                            <span v-if="row.isSymlink"> -> {{ row.linkPath }}</span>
+                            <span v-if="row.isSymlink">-> {{ row.linkPath }}</span>
                         </template>
                     </el-table-column>
                     <el-table-column :label="$t('file.mode')" prop="mode">
@@ -90,17 +103,16 @@
                             <el-link :underline="false" @click="openMode(row)">{{ row.mode }}</el-link>
                         </template>
                     </el-table-column>
-                    <el-table-column :label="$t('file.user')" prop="user"> </el-table-column>
+                    <el-table-column :label="$t('file.user')" prop="user"></el-table-column>
-                    <el-table-column :label="$t('file.group')" prop="group"> </el-table-column>
+                    <el-table-column :label="$t('file.group')" prop="group"></el-table-column>
-                    <el-table-column :label="$t('file.size')" prop="size"> </el-table-column>
+                    <el-table-column :label="$t('file.size')" prop="size"></el-table-column>
                     <el-table-column
                         :label="$t('file.updateTime')"
                         prop="modTime"
                         :formatter="dateFromat"
                         min-width="100"
                         show-overflow-tooltip
-                    >
+                    ></el-table-column>
-                    </el-table-column>
 
                     <fu-table-operations
                         :ellipsis="1"
@@ -181,7 +193,7 @@ import Download from './download/index.vue';
 
 const data = ref();
 const selects = ref<any>([]);
-const req = reactive({ path: '/', expand: true });
+const req = reactive({ path: '/', expand: true, showHidden: false });
 const loading = ref(false);
 const treeLoading = ref(false);
 const paths = ref<string[]>([]);

frontend/src/views/host/file-management/move/index.vue

@@ -10,16 +10,16 @@
         >
             <el-form-item :label="$t('file.path')" prop="newPath">
                 <el-input v-model="addForm.newPath">
-                    <template #append> <FileList @choose="getPath" :dir="true"></FileList> </template>
+                    <template #append><FileList @choose="getPath" :dir="true"></FileList></template>
                 </el-input>
             </el-form-item>
         </el-form>
         <template #footer>
             <span class="dialog-footer">
                 <el-button @click="handleClose" :disabled="loading">{{ $t('commons.button.cancel') }}</el-button>
-                <el-button type="primary" @click="submit(fileForm)" :disabled="loading">{{
+                <el-button type="primary" @click="submit(fileForm)" :disabled="loading">
-                    $t('commons.button.confirm')
+                    {{ $t('commons.button.confirm') }}
-                }}</el-button>
+                </el-button>
             </span>
         </template>
     </el-dialog>

frontend/src/views/host/file-management/rename/index.vue

@@ -1,18 +1,18 @@
 <template>
-    <el-dialog
+    <el-dialog v-model="open" :before-close="handleClose" :title="$t('file.setRole')" width="30%" @open="onOpen">
-        v-model="open"
+        <el-form
-        :before-close="handleClose"
+            ref="fileForm"
-        :title="$t('file.setRole')"
+            label-position="left"
-        width="30%"
+            :model="addForm"
-        @open="onOpen"
+            label-width="100px"
-        v-loading="loading"
+            :rules="rules"
-    >
+            v-loading="loading"
-        <el-form ref="fileForm" label-position="left" :model="addForm" label-width="100px" :rules="rules">
+        >
             <el-form-item :label="$t('file.path')" prop="path">
-                <el-input v-model="props.path" disabled
+                <el-input v-model="props.path" disabled />
-            /></el-form-item>
+            </el-form-item>
-            <el-form-item :label="$t('file.name')" prop="newName"> <el-input v-model="addForm.newName" /></el-form-item
+            <el-form-item :label="$t('file.name')" prop="newName"><el-input v-model="addForm.newName" /></el-form-item>
-        ></el-form>
+        </el-form>
         <template #footer>
             <span class="dialog-footer">
                 <el-button @click="handleClose">{{ $t('commons.button.cancel') }}</el-button>

frontend/src/views/host/file-management/upload/index.vue

@@ -5,7 +5,6 @@
                 <el-button type="primary">{{ $t('file.selectFile') }}</el-button>
             </template>
         </el-upload>
-
         <template #footer>
             <span class="dialog-footer">
                 <el-button @click="handleClose">{{ $t('commons.button.cancel') }}</el-button>

frontend/src/views/host/file-management/wget/index.vue

@@ -13,8 +13,8 @@
             </el-form-item>
             <el-form-item :label="$t('file.path')" prop="path">
                 <el-input v-model="addForm.path">
-                    <template #append> <FileList :path="path" @choose="getPath"></FileList> </template
+                    <template #append><FileList :path="path" @choose="getPath"></FileList></template>
-                ></el-input>
+                </el-input>
             </el-form-item>
             <el-form-item :label="$t('file.name')" prop="name">
                 <el-input v-model="addForm.name"></el-input>
@@ -23,9 +23,9 @@
         <template #footer>
             <span class="dialog-footer">
                 <el-button @click="handleClose" :disabled="loading">{{ $t('commons.button.cancel') }}</el-button>
-                <el-button type="primary" @click="submit(fileForm)" :disabled="loading">{{
+                <el-button type="primary" @click="submit(fileForm)" :disabled="loading">
-                    $t('commons.button.confirm')
+                    {{ $t('commons.button.confirm') }}
-                }}</el-button>
+                </el-button>
             </span>
         </template>
     </el-dialog>
@@ -37,6 +37,7 @@ import { Rules } from '@/global/form-rues';
 import i18n from '@/lang';
 import { ElMessage, FormInstance, FormRules } from 'element-plus';
 import { reactive, ref, toRefs } from 'vue';
+import FileList from '@/components/file-list/index.vue';
 
 const props = defineProps({
     open: {

frontend/src/views/host/terminal/command/index.vue

@@ -3,9 +3,9 @@
         <ComplexTable :pagination-config="paginationConfig" v-model:selects="selects" :data="data" @search="search">
             <template #toolbar>
                 <el-button @click="onCreate()">{{ $t('commons.button.create') }}</el-button>
-                <el-button type="danger" plain :disabled="selects.length === 0" @click="batchDelete(null)">{{
+                <el-button type="danger" plain :disabled="selects.length === 0" @click="batchDelete(null)">
-                    $t('commons.button.delete')
+                    {{ $t('commons.button.delete') }}
-                }}</el-button>
+                </el-button>
             </template>
             <el-table-column type="selection" fix />
             <el-table-column :label="$t('commons.table.name')" min-width="100" prop="name" fix />

frontend/src/views/host/terminal/index.vue

@@ -30,7 +30,7 @@
                                 <el-icon style="margin-top: 1px" color="#F56C6C" v-if="item.status === 'closed'">
                                     <circleClose />
                                 </el-icon>
-                                <span> &nbsp;{{ item.title }}&nbsp;&nbsp;</span>
+                                <span>&nbsp;{{ item.title }}&nbsp;&nbsp;</span>
                             </span>
                         </template>
                         <Terminal

frontend/src/views/monitor/index.vue

@@ -15,8 +15,7 @@
                             :end-placeholder="$t('commons.search.timeEnd')"
                             :shortcuts="shortcuts"
                             style="float: right; right: 20px"
-                        >
+                        ></el-date-picker>
-                        </el-date-picker>
                     </template>
                     <div id="loadLoadChart" style="width: 100%; height: 400px"></div>
                 </el-card>
@@ -37,8 +36,7 @@
                             :end-placeholder="$t('commons.search.timeEnd')"
                             :shortcuts="shortcuts"
                             style="float: right; right: 20px"
-                        >
+                        ></el-date-picker>
-                        </el-date-picker>
                     </template>
                     <div id="loadCPUChart" style="width: 100%; height: 400px"></div>
                 </el-card>
@@ -57,8 +55,7 @@
                             :end-placeholder="$t('commons.search.timeEnd')"
                             :shortcuts="shortcuts"
                             style="float: right; right: 20px"
-                        >
+                        ></el-date-picker>
-                        </el-date-picker>
                     </template>
                     <div id="loadMemoryChart" style="width: 100%; height: 400px"></div>
                 </el-card>
@@ -79,8 +76,7 @@
                             :end-placeholder="$t('commons.search.timeEnd')"
                             :shortcuts="shortcuts"
                             style="float: right; right: 20px"
-                        >
+                        ></el-date-picker>
-                        </el-date-picker>
                     </template>
                     <div id="loadIOChart" style="width: 100%; height: 400px"></div>
                 </el-card>
@@ -110,8 +106,7 @@
                             :end-placeholder="$t('commons.search.timeEnd')"
                             :shortcuts="shortcuts"
                             style="float: right; right: 20px"
-                        >
+                        ></el-date-picker>
-                        </el-date-picker>
                     </template>
                     <div id="loadNetworkChart" style="width: 100%; height: 400px"></div>
                 </el-card>