feat: 增加右下角检查更新功能

backend/app/api/v1/file.go

@@ -10,6 +10,7 @@ import (
 	"github.com/1Panel-dev/1Panel/backend/buserr"
 	"github.com/1Panel-dev/1Panel/backend/constant"
 	"github.com/1Panel-dev/1Panel/backend/global"
+	"github.com/1Panel-dev/1Panel/backend/utils/files"
 	websocket2 "github.com/1Panel-dev/1Panel/backend/utils/websocket"
 	"github.com/gin-gonic/gin"
 	"github.com/gorilla/websocket"
@@ -17,6 +18,8 @@ import (
 	"net/http"
 	"os"
 	"path"
+	"path/filepath"
+	"strconv"
 	"strings"
 )
 
@@ -492,6 +495,105 @@ func (b *BaseApi) LoadFromFile(c *gin.Context) {
 	helper.SuccessWithData(c, string(content))
 }
 
+func mergeChunks(fileName string, fileDir string, dstDir string, chunkCount int) error {
+	targetFile, err := os.Create(filepath.Join(dstDir, fileName))
+	if err != nil {
+		return err
+	}
+	defer targetFile.Close()
+
+	for i := 0; i < chunkCount; i++ {
+		chunkPath := filepath.Join(fileDir, fmt.Sprintf("%s.%d", fileName, i))
+		chunkData, err := ioutil.ReadFile(chunkPath)
+		if err != nil {
+			return err
+		}
+		_, err = targetFile.Write(chunkData)
+		if err != nil {
+			return err
+		}
+	}
+
+	return files.NewFileOp().DeleteDir(fileDir)
+}
+
+// @Tags File
+// @Summary ChunkUpload file
+// @Description 分片上传文件
+// @Param file formData file true "request"
+// @Success 200
+// @Security ApiKeyAuth
+// @Router /files/chunkupload [post]
+// @x-panel-log {"bodyKeys":["path"],"paramKeys":[],"BeforeFuntions":[],"formatZH":"上传文件 [path]","formatEN":"Upload file [path]"}
+func (b *BaseApi) UploadChunkFiles(c *gin.Context) {
+	fileForm, err := c.FormFile("chunk")
+	if err != nil {
+		helper.ErrorWithDetail(c, constant.CodeErrBadRequest, constant.ErrTypeInvalidParams, err)
+		return
+	}
+	uploadFile, err := fileForm.Open()
+	if err != nil {
+		helper.ErrorWithDetail(c, constant.CodeErrBadRequest, constant.ErrTypeInvalidParams, err)
+		return
+	}
+
+	chunkIndex, err := strconv.Atoi(c.PostForm("chunkIndex"))
+	if err != nil {
+		helper.ErrorWithDetail(c, constant.CodeErrBadRequest, constant.ErrTypeInvalidParams, err)
+		return
+	}
+
+	chunkCount, err := strconv.Atoi(c.PostForm("chunkCount"))
+	if err != nil {
+		helper.ErrorWithDetail(c, constant.CodeErrBadRequest, constant.ErrTypeInvalidParams, err)
+		return
+	}
+
+	fileOp := files.NewFileOp()
+	if err := fileOp.CreateDir("uploads", 0755); err != nil {
+		helper.ErrorWithDetail(c, constant.CodeErrBadRequest, constant.ErrTypeInvalidParams, err)
+		return
+	}
+	//fileID := uuid.New().String()
+	filename := c.PostForm("filename")
+	fileDir := filepath.Join(global.CONF.System.DataDir, "upload", filename)
+
+	os.MkdirAll(fileDir, 0755)
+	filePath := filepath.Join(fileDir, filename)
+
+	emptyFile, err := os.Create(filePath)
+	if err != nil {
+		helper.ErrorWithDetail(c, constant.CodeErrBadRequest, constant.ErrTypeInvalidParams, err)
+		return
+	}
+	emptyFile.Close()
+
+	chunkData, err := ioutil.ReadAll(uploadFile)
+	if err != nil {
+		helper.ErrorWithDetail(c, constant.CodeErrBadRequest, constant.ErrTypeInvalidParams, err)
+		return
+	}
+
+	chunkPath := filepath.Join(fileDir, fmt.Sprintf("%s.%d", filename, chunkIndex))
+	err = ioutil.WriteFile(chunkPath, chunkData, 0644)
+	if err != nil {
+		helper.ErrorWithDetail(c, constant.CodeErrBadRequest, constant.ErrTypeInvalidParams, err)
+		return
+	}
+
+	if chunkIndex+1 == chunkCount {
+		err = mergeChunks(filename, fileDir, c.PostForm("path"), chunkCount)
+		if err != nil {
+			fmt.Println(err.Error())
+			helper.ErrorWithDetail(c, constant.CodeErrInternalServer, constant.ErrAppDelete, err)
+			return
+		}
+		helper.SuccessWithData(c, true)
+	} else {
+		return
+	}
+}
+
 var wsUpgrade = websocket.Upgrader{
 	CheckOrigin: func(r *http.Request) bool {
 		return true

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

@@ -7,11 +7,15 @@
             <a href="https://fit2cloud.com/" target="_blank">杭州飞致云信息科技有限公司</a>
         </div>
         <div class="footer-right">
-            <span>Version V1</span>
+            <SystemUpgrade />
         </div>
     </div>
 </template>
 
+<script setup lang="ts">
+import SystemUpgrade from '@/components/system-upgrade/index.vue';
+</script>
+
 <style scoped lang="scss">
 .footer {
     height: 45px;

frontend/src/components/system-upgrade/index.vue

@@ -0,0 +1,92 @@
+<template>
+    <div>
+        {{ version }}
+        <el-button v-if="version !== 'Waiting'" type="primary" link @click="onLoadUpgradeInfo">
+            {{ $t('setting.upgradeCheck') }}
+        </el-button>
+        <el-tag v-else round style="margin-left: 10px">{{ $t('setting.upgrading') }}</el-tag>
+    </div>
+
+    <el-drawer :close-on-click-modal="false" :key="refresh" v-model="drawerVisiable" size="50%">
+        <template #header>
+            <DrawerHeader :header="$t('setting.upgrade')" :back="handleClose" />
+        </template>
+        <el-form label-width="120px">
+            <el-form-item :label="$t('setting.newVersion')">
+                <el-tag>{{ upgradeInfo.newVersion }}</el-tag>
+            </el-form-item>
+            <el-form-item :label="$t('setting.upgradeNotes')">
+                <MdEditor style="height: calc(100vh - 330px)" v-model="upgradeInfo.releaseNote" previewOnly />
+            </el-form-item>
+        </el-form>
+        <template #footer>
+            <span class="dialog-footer">
+                <el-button @click="drawerVisiable = false">{{ $t('commons.button.cancel') }}</el-button>
+                <el-button type="primary" @click="onUpgrade">{{ $t('setting.upgradeNow') }}</el-button>
+            </span>
+        </template>
+    </el-drawer>
+</template>
+<script setup lang="ts">
+import { getSettingInfo, loadUpgradeInfo, upgrade } from '@/api/modules/setting';
+import i18n from '@/lang';
+import { MsgSuccess } from '@/utils/message';
+import { onMounted, ref } from 'vue';
+
+const version = ref();
+let loading = ref(false);
+const drawerVisiable = ref(false);
+const upgradeInfo = ref();
+const refresh = ref();
+
+const search = async () => {
+    const res = await getSettingInfo();
+    version.value = res.data.systemVersion;
+};
+
+const handleClose = () => {
+    drawerVisiable.value = false;
+};
+
+const onLoadUpgradeInfo = async () => {
+    loading.value = true;
+    await loadUpgradeInfo()
+        .then((res) => {
+            loading.value = false;
+
+            if (!res.data) {
+                MsgSuccess(i18n.global.t('setting.noUpgrade'));
+                return;
+            }
+            upgradeInfo.value = res.data;
+            drawerVisiable.value = true;
+        })
+        .catch(() => {
+            loading.value = false;
+        });
+};
+
+const onUpgrade = async () => {
+    ElMessageBox.confirm(i18n.global.t('setting.upgradeHelper', i18n.global.t('setting.upgrade')), {
+        confirmButtonText: i18n.global.t('commons.button.confirm'),
+        cancelButtonText: i18n.global.t('commons.button.cancel'),
+        type: 'info',
+    }).then(() => {
+        loading.value = true;
+        upgrade(upgradeInfo.value.newVersion)
+            .then(() => {
+                loading.value = false;
+                drawerVisiable.value = false;
+                MsgSuccess(i18n.global.t('commons.msg.operationSuccess'));
+                search();
+            })
+            .catch(() => {
+                loading.value = false;
+            });
+    });
+};
+
+onMounted(() => {
+    search();
+});
+</script>

frontend/src/views/setting/about/index.vue

@@ -8,71 +8,40 @@
                     </div>
                     <h3>{{ $t('setting.description') }}</h3>
                     <h3>
-                        {{ version }}
+                        <SystemUpgrade />
-                        <el-button v-if="version !== 'Waiting'" type="primary" link @click="onLoadUpgradeInfo">
-                            {{ $t('setting.upgradeCheck') }}
-                        </el-button>
-                        <el-tag v-else round style="margin-left: 10px">{{ $t('setting.upgrading') }}</el-tag>
                     </h3>
                     <div style="margin-top: 10px">
                         <el-link @click="toDoc">
                             <el-icon><Document /></el-icon>
                             <span>{{ $t('setting.doc') }}</span>
                         </el-link>
-                        <el-link @click="toGithub" style="margin-left: 15px">
+                        <el-link @click="toGithub" class="system-link">
-                            <svg-icon style="font-size: 7px; margin-bottom: 3px" iconName="p-huaban88"></svg-icon>
+                            <svg-icon iconName="p-huaban88"></svg-icon>
-                            <span style="line-height: 20px">{{ $t('setting.project') }}</span>
+                            <span>{{ $t('setting.project') }}</span>
                         </el-link>
-                        <el-link @click="toIssue" style="margin-left: 15px">
+                        <el-link @click="toIssue" class="system-link">
-                            <svg-icon style="font-size: 7px; margin-bottom: 3px" iconName="p-bug"></svg-icon>
+                            <svg-icon iconName="p-bug"></svg-icon>
                             <span>{{ $t('setting.issue') }}</span>
                         </el-link>
-                        <el-link @click="toGithubStar" style="margin-left: 15px">
+                        <el-link @click="toGithubStar" class="system-link">
-                            <svg-icon style="font-size: 7px; margin-bottom: 3px" iconName="p-star"></svg-icon>
+                            <svg-icon iconName="p-star"></svg-icon>
                             <span>{{ $t('setting.star') }}</span>
                         </el-link>
                     </div>
                 </div>
             </template>
         </LayoutContent>
-        <el-drawer :close-on-click-modal="false" :key="refresh" v-model="drawerVisiable" size="50%">
-            <template #header>
-                <DrawerHeader :header="$t('setting.upgrade')" :back="handleClose" />
-            </template>
-            <el-form label-width="120px">
-                <el-form-item :label="$t('setting.newVersion')">
-                    <el-tag>{{ upgradeInfo.newVersion }}</el-tag>
-                </el-form-item>
-                <el-form-item :label="$t('setting.upgradeNotes')">
-                    <MdEditor style="height: calc(100vh - 330px)" v-model="upgradeInfo.releaseNote" previewOnly />
-                </el-form-item>
-            </el-form>
-            <template #footer>
-                <span class="dialog-footer">
-                    <el-button @click="drawerVisiable = false">{{ $t('commons.button.cancel') }}</el-button>
-                    <el-button type="primary" @click="onUpgrade">{{ $t('setting.upgradeNow') }}</el-button>
-                </span>
-            </template>
-        </el-drawer>
     </div>
 </template>
 
 <script lang="ts" setup>
 import LayoutContent from '@/layout/layout-content.vue';
-import { getSettingInfo, loadUpgradeInfo, upgrade } from '@/api/modules/setting';
+import { getSettingInfo } from '@/api/modules/setting';
 import { onMounted, ref } from 'vue';
-import MdEditor from 'md-editor-v3';
 import 'md-editor-v3/lib/style.css';
-import { ElMessageBox } from 'element-plus';
+import SystemUpgrade from '@/components/system-upgrade/index.vue';
-import i18n from '@/lang';
-import DrawerHeader from '@/components/drawer-header/index.vue';
-import { MsgSuccess } from '@/utils/message';
 
 const version = ref();
-const upgradeInfo = ref();
-const drawerVisiable = ref();
-const refresh = ref();
-
 const loading = ref();
 const search = async () => {
     const res = await getSettingInfo();
@@ -92,47 +61,21 @@ const toGithubStar = () => {
     window.open('https://github.com/1Panel-dev/1Panel', '_blank');
 };
 
-const handleClose = () => {
-    drawerVisiable.value = false;
-};
-
-const onLoadUpgradeInfo = async () => {
-    loading.value = true;
-    await loadUpgradeInfo()
-        .then((res) => {
-            loading.value = false;
-            if (!res.data) {
-                MsgSuccess(i18n.global.t('setting.noUpgrade'));
-                return;
-            }
-            upgradeInfo.value = res.data;
-            drawerVisiable.value = true;
-        })
-        .catch(() => {
-            loading.value = false;
-        });
-};
-const onUpgrade = async () => {
-    ElMessageBox.confirm(i18n.global.t('setting.upgradeHelper', i18n.global.t('setting.upgrade')), {
-        confirmButtonText: i18n.global.t('commons.button.confirm'),
-        cancelButtonText: i18n.global.t('commons.button.cancel'),
-        type: 'info',
-    }).then(() => {
-        loading.value = true;
-        upgrade(upgradeInfo.value.newVersion)
-            .then(() => {
-                loading.value = false;
-                drawerVisiable.value = false;
-                MsgSuccess(i18n.global.t('commons.msg.operationSuccess'));
-                search();
-            })
-            .catch(() => {
-                loading.value = false;
-            });
-    });
-};
-
 onMounted(() => {
     search();
 });
 </script>
+
+<style lang="scss" scoped>
+.system-link {
+    margin-left: 15px;
+
+    .svg-icon {
+        font-size: 7px;
+        margin-bottom: 3px;
+    }
+    span {
+        line-height: 20px;
+    }
+}
+</style>