feat: Add import

package.json

@@ -15,8 +15,8 @@
     "marked": "^15.0.4",
     "normalize.css": "^8.0.1",
     "nprogress": "^0.2.0",
-    "pinia": "2.0.3",
-    "vue": "3.2.37",
+    "pinia": "2.2.8",
+    "vue": "3.5.13",
     "vue-router": "^4.0.12"
   },
   "devDependencies": {
@@ -27,6 +27,6 @@
     "sass": "^1.43.4",
     "sass-loader": "^12.3.0",
     "ts-proto": "^1.141.1",
-    "vite": "^2.9.18"
+    "vite": "6.0.9"
   }
 }

src/layout/index.vue

@@ -15,7 +15,7 @@
         <el-main class="app-main">
           <router-view v-slot="{ Component }">
             <transition mode="out-in" name="el-fade-in-linear">
-              <keep-alive :include="[...cachedTags]">
+              <keep-alive :include="cachedTags">
                 <component :is="Component"/>
               </keep-alive>
             </transition>

src/views/peer/index.vue

@@ -8,7 +8,7 @@
         <el-form-item :label="T('Hostname')">
           <el-input v-model="listQuery.hostname" clearable/>
         </el-form-item>
-        <el-form-item :label="T('LastOnlineTime')"  label-width="100px">
+        <el-form-item :label="T('LastOnlineTime')" label-width="100px">
           <el-select v-model="listQuery.time_ago" clearable>
             <el-option
                 v-for="item in timeFilters"
@@ -29,6 +29,35 @@
           <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-popover :visible="showImport" placement="bottom" :width="600">
+            <el-upload
+                class="upload-demo"
+                drag
+                accept=".csv"
+                :before-upload="parseCsv"
+            >
+              <el-icon class="el-icon--upload">
+                <upload-filled/>
+              </el-icon>
+              <div class="el-upload__text">
+                Drop file here or <em>click to upload</em>
+              </div>
+              <template #tip>
+                <div class="el-upload__tip">
+                  please upload csv file <br>
+                  columns: <span style="font-weight: bold;font-size: 15px">id,cpu,hostname,memory,os,username,uuid,version,group_id</span>
+                  <br>
+                  <span>you can see export file</span>
+                </div>
+
+              </template>
+
+            </el-upload>
+            <el-button @click="showImport=false" type="primary">{{ T('Cancel') }}</el-button>
+            <template #reference>
+              <el-button @click="showImport=true" type="danger">{{ T('Import') }}</el-button>
+            </template>
+          </el-popover>
           <el-button type="danger" @click="toBatchDelete">{{ T('BatchDelete') }}</el-button>
           <el-button type="primary" @click="toBatchAddToAB">{{ T('BatchAddToAB') }}</el-button>
         </el-form-item>
@@ -187,6 +216,7 @@
   import { batchCreateFromPeers } from '@/api/address_book'
   import { useRepositories as useCollectionRepositories } from '@/views/address_book/collection'
   import createABForm from '@/views/peer/createABForm.vue'
+  import { UploadFilled } from '@element-plus/icons-vue'
 
   const appStore = useAppStore()
 
@@ -210,8 +240,6 @@
   onMounted(getGroupList)
   //
 
-
-
   const listRes = reactive({
     list: [], total: 0, loading: false,
   })
@@ -344,6 +372,54 @@
     }
   }
 
+  const showImport = ref(false)
+  const canKeys = ['id', 'cpu', 'hostname', 'memory', 'os', 'username', 'uuid', 'version', 'group_id']
+  const parseCsv = (file) => {
+    const reader = new FileReader()
+    reader.onload = async (e) => {
+      const data = e.target.result
+      console.log(data)
+      //组装数据
+      const rows = data.split('\n')
+      const keys = rows[0].split(',')
+      console.log(keys, rows.slice(1).map(row => row.split(',')))
+      const values = rows.slice(1).map(row => {
+        const obj = {}
+        row.split(/,(?=(?:(?:[^"]*"){2})*[^"]*$)/).forEach((v, i) => {
+          //去掉两边的"
+          obj[keys[i]] = v.trim().replace(/^"|"$/g, '')
+        })
+        return obj
+      }).filter(item => item.id)
+      // console.log(values)
+      //移除不需要的key
+      values.forEach(item => {
+        item.group_id = parseInt(item.group_id)
+        Object.keys(item).forEach(key => {
+          if (!canKeys.includes(key)) {
+            delete item[key]
+          }
+        })
+      })
+      console.log(values)
+      const pa = []
+      values.map(item => {
+        pa.push(create(item))
+      })
+      const res = await Promise.all(pa).catch(_ => false)
+      if (res) {
+        ElMessage.success(T('OperationSuccess'))
+        getList()
+      }
+
+    }
+    reader.readAsText(file)
+    return false
+  }
+  const toImport = () => {
+    ElMessage.warning('暂未实现')
+  }
+
   const ABFormVisible = ref(false)
   const clickRow = ref({})
   const toAddressBook = (row) => {