🆕为实现数据迁移以及备份新增配置导出

web/src/api/setting.js

@@ -0,0 +1,5 @@
+import { request } from '@/utils'
+
+export default {
+  exportConfig: () => request.get('/setting/export'), // 获取当前登陆用户信息
+}

web/src/layout/components/header/components/Export.vue

@@ -0,0 +1,40 @@
+<template>
+  <n-icon mr-20 size="18" style="cursor: pointer" @click="importConfig()">
+    <icon-gg-import />
+  </n-icon>
+  <n-icon mr-20 size="18" style="cursor: pointer" @click="exportConfig()">
+    <icon-ph-export-bold />
+  </n-icon>
+</template>
+
+<script setup>
+import api from '@/api/setting'
+// 导入
+function importConfig() {
+  console.log('导入配置')
+}
+
+// 导出
+function exportConfig() {
+  $dialog.confirm({
+    type: 'warning',
+    title: '导出配置',
+    content: `是否导出需要导出系统全部配置？`,
+    async confirm() {
+      api.exportConfig().then(response => {
+        const blob = new Blob([JSON.stringify(response.data)], {
+          type: "text/plain"
+        });
+        const link = document.createElement("a"); // 创建a标签
+        link.download = "config.json"; // a标签添加属性
+        link.style.display = "none";
+        link.href = URL.createObjectURL(blob);
+        document.body.appendChild(link);
+        link.click(); // 执行下载
+        URL.revokeObjectURL(link.href); // 释放url
+        document.body.removeChild(link); // 释放标签
+      })
+    },
+  })
+}
+</script>

web/src/layout/components/header/index.vue

@@ -3,7 +3,12 @@
     <MenuCollapse />
     <BreadCrumb ml-15 hidden sm:block />
   </div>
-  <div ml-auto flex items-center>
+  <div ml-auto flex items-center v-if="loginUser.account === 'admin'">
+    <Export/>
+    <FullScreen />
+    <UserAvatar />
+  </div>
+  <div ml-auto flex items-center v-else>
     <FullScreen />
     <UserAvatar />
   </div>
@@ -14,4 +19,7 @@ import BreadCrumb from './components/BreadCrumb.vue'
 import MenuCollapse from './components/MenuCollapse.vue'
 import FullScreen from './components/FullScreen.vue'
 import UserAvatar from './components/UserAvatar.vue'
+import Export from './components/Export.vue'
+import { useUserStore } from '@/store'
+const loginUser = useUserStore()
 </script>