feat: Add Export in some menu

fix: Left menu height
fix: Export csv when double quotation marks in data

src/layout/components/aside.vue

@@ -13,5 +13,8 @@
   })
 </script>
 
-<style scoped>
+<style scoped lang="scss">
+.scroll-sidebar {
+  background-color: #2d3a4b;
+}
 </style>

src/layout/index.vue

@@ -60,7 +60,6 @@
 }
 
 .app-left {
-  height: 100%;
   transition: width 0.5s;
 }
 

src/utils/file.js

@@ -38,7 +38,7 @@ export function jsonToCsv (data) {
   let keys = Object.keys(data[0])
   csv += keys.join(',') + '\n'
   data.forEach(row => {
-    csv += keys.map(key => `"${row[key]}"`).join(',') + '\n'
+    csv += keys.map(key => `"${row[key].toString().replaceAll('"', '""')}"`).join(',') + '\n'
   })
   return new Blob([csv], { type: 'text/csv' })
 }

src/utils/i18n/zh_CN.json

@@ -447,7 +447,7 @@
     "One": "新密码"
   },
   "NewPasswordEqualOldPassword": {
-    "One": "New Password cannot be the same as Old Password"
+    "One": "新密码不能与旧密码相同"
   },
   "ConfirmPassword": {
     "One": "确认密码"

src/views/audit/connList.vue

@@ -11,6 +11,7 @@
         <el-form-item>
           <el-button type="primary" @click="handlerQuery">{{ T('Filter') }}</el-button>
           <el-button type="danger" @click="toBatchDelete">{{ T('BatchDelete') }}</el-button>
+          <el-button type="success" @click="toExport">{{ T('Export') }}</el-button>
         </el-form-item>
       </el-form>
     </el-card>
@@ -62,6 +63,7 @@
     handlerQuery,
     del,
     batchdel,
+    toExport,
   } = useRepositories()
 
   onMounted(getList)

src/views/audit/fileList.vue

@@ -11,6 +11,7 @@
         <el-form-item>
           <el-button type="primary" @click="handlerQuery">{{ T('Filter') }}</el-button>
           <el-button type="danger" @click="toBatchDelete">{{ T('BatchDelete') }}</el-button>
+          <el-button type="success" @click="toExport">{{ T('Export') }}</el-button>
         </el-form-item>
       </el-form>
     </el-card>
@@ -109,6 +110,7 @@
     handlerQuery,
     del,
     batchdel,
+    toExport,
   } = useFileRepositories()
 
   onMounted(getList)

src/views/audit/reponsitories.js

@@ -1,9 +1,9 @@
 import { reactive } from 'vue'
 import { list, remove, fileList, fileRemove, batchDelete, fileBatchDelete } from '@/api/audit'
 import { ElMessage, ElMessageBox } from 'element-plus'
-import { useRoute } from 'vue-router'
 import { formatTime } from '@/utils/time'
 import { T } from '@/utils/i18n'
+import { downBlob, jsonToCsv } from '@/utils/file'
 
 export function useRepositories () {
   const listRes = reactive({
@@ -73,6 +73,17 @@ export function useRepositories () {
       getList()
     }
   }
+
+  const toExport = async () => {
+    const q = { ...listQuery }
+    q.page_size = 1000000
+    q.page = 1
+    const res = await list(q).catch(_ => false)
+    if (res) {
+      const csv = jsonToCsv(res.data.list)
+      downBlob(csv, 'connectLog.csv')
+    }
+  }
   return {
     listRes,
     listQuery,
@@ -80,6 +91,7 @@ export function useRepositories () {
     handlerQuery,
     del,
     batchdel,
+    toExport,
   }
 }
 
@@ -151,6 +163,18 @@ export function useFileRepositories () {
       getList()
     }
   }
+
+  const toExport = async () => {
+    const q = { ...listQuery }
+    q.page_size = 1000000
+    q.page = 1
+    const res = await fileList(q).catch(_ => false)
+    if (res) {
+      const csv = jsonToCsv(res.data.list)
+      downBlob(csv, 'fileTransformLog.csv')
+    }
+  }
+
   return {
     listRes,
     listQuery,
@@ -158,5 +182,6 @@ export function useFileRepositories () {
     handlerQuery,
     del,
     batchdel,
+    toExport,
   }
 }

src/views/login/log.js

@@ -2,10 +2,10 @@ import { reactive, ref } from 'vue'
 import { list as admin_fetchPeers } from '@/api/peer'
 import { list as my_fetchPeers } from '@/api/my/peer'
 import { ElMessage, ElMessageBox } from 'element-plus'
-import { useRoute } from 'vue-router'
 import { T } from '@/utils/i18n'
 import { batchDelete as admin_batchDelete, list as admin_list, remove as admin_remove } from '@/api/login_log'
 import { batchDelete as my_batchDelete, list as my_list, remove as my_remove } from '@/api/my/login_log'
+import { downBlob, jsonToCsv } from '@/utils/file'
 
 const apis = {
   admin: { batchDelete: admin_batchDelete, list: admin_list, remove: admin_remove, fetchPeers: admin_fetchPeers },
@@ -30,8 +30,8 @@ export function useRepositories (api_type = 'my') {
     listRes.loading = false
     if (res) {
       //通过uuid补全peer信息
-      const uuids = res.data.list.filter(item => item.uuid&&item.client==='client'&&!item.device_id).map(item => item.uuid)
-      if(uuids.length > 0){
+      const uuids = res.data.list.filter(item => item.uuid && item.client === 'client' && !item.device_id).map(item => item.uuid)
+      if (uuids.length > 0) {
         //uuids去重
         const uniqueUuids = [...new Set(uuids)]
         const peers = await apis[api_type].fetchPeers({ uuids: uniqueUuids }).catch(_ => false)
@@ -95,6 +95,21 @@ export function useRepositories (api_type = 'my') {
     }
   }
 
+  // only Admin
+  const toExport = async () => {
+    if (api_type !== 'admin') {
+      return false
+    }
+    const q = { ...listQuery }
+    q.page_size = 1000000
+    q.page = 1
+    const res = await admin_list(q).catch(_ => false)
+    if (res) {
+      const csv = jsonToCsv(res.data.list)
+      downBlob(csv, 'loginLog.csv')
+    }
+  }
+
   return {
     listRes,
     listQuery,
@@ -102,5 +117,6 @@ export function useRepositories (api_type = 'my') {
     handlerQuery,
     del,
     batchdel,
+    toExport,
   }
 }

src/views/login/log.vue

@@ -15,6 +15,7 @@
         <el-form-item>
           <el-button type="primary" @click="handlerQuery">{{ T('Filter') }}</el-button>
           <el-button type="danger" @click="toBatchDelete">{{ T('BatchDelete') }}</el-button>
+          <el-button type="success" @click="toExport">{{ T('Export') }}</el-button>
         </el-form-item>
       </el-form>
     </el-card>
@@ -62,6 +63,8 @@
   import { loadAllUsers } from '@/global'
   import { useRepositories } from '@/views/login/log.js'
   import { T } from '@/utils/i18n'
+  import { list } from '@/api/peer'
+  import { downBlob, jsonToCsv } from '@/utils/file'
 
   const { allUsers, getAllUsers } = loadAllUsers()
   getAllUsers()
@@ -73,6 +76,7 @@
     handlerQuery,
     del,
     batchdel,
+    toExport,
   } = useRepositories('admin')
 
   onMounted(getList)
@@ -91,6 +95,7 @@
     }
     batchdel(multipleSelection.value)
   }
+
 </script>
 
 <style scoped lang="scss">

src/views/user/composables/index.js

@@ -1,9 +1,10 @@
-import { onMounted, reactive, watch } from 'vue'
+import { reactive } from 'vue'
 import { list, remove, changePwd } from '@/api/user'
 import { list as groups } from '@/api/group'
 import { useRouter } from 'vue-router'
 import { ElMessageBox, ElMessage } from 'element-plus'
 import { T } from '@/utils/i18n'
+import { downBlob, jsonToCsv } from '@/utils/file'
 
 export function useRepositories () {
 
@@ -42,18 +43,24 @@ export function useRepositories () {
       listRes.groups = res.data.list
     }
   }
-  onMounted(getGroups)
 
-  onMounted(getList)
-
-  watch(() => listQuery.page, getList)
-  watch(() => listQuery.page_size, handlerQuery)
+  const toExport = async () => {
+    const q = { ...listQuery }
+    q.page_size = 1000000
+    q.page = 1
+    const res = await list(q).catch(_ => false)
+    if (res) {
+      const csv = jsonToCsv(res.data.list)
+      downBlob(csv, 'users.csv')
+    }
+  }
   return {
     listRes,
     listQuery,
     handlerQuery,
     getList,
     getGroups,
+    toExport,
   }
 }
 

src/views/user/index.vue

@@ -8,6 +8,7 @@
         <el-form-item>
           <el-button type="primary" @click="handlerQuery">{{ T('Filter') }}</el-button>
           <el-button type="danger" @click="toAdd">{{ T('Add') }}</el-button>
+          <el-button type="success" @click="toExport">{{ T('Export') }}</el-button>
         </el-form-item>
       </el-form>
     </el-card>
@@ -63,14 +64,24 @@
   import { DISABLE_STATUS, ENABLE_STATUS } from '@/utils/common_options'
   import { update } from '@/api/user'
   import { ElMessageBox, ElMessage } from 'element-plus'
+  import { onMounted, watch } from 'vue'
   //列表
   const {
     listRes,
     listQuery,
     handlerQuery,
     getList,
+    getGroups,
+    toExport,
   } = useRepositories()
 
+  onMounted(getGroups)
+
+  onMounted(getList)
+
+  watch(() => listQuery.page, getList)
+  watch(() => listQuery.page_size, handlerQuery)
+
   const { toEdit, toAdd, toAddressBook, toTag } = useToEditOrAdd()
 
   const { changePass } = useChangePwd()