src/global.js aktualisiert

README.md aktualisiert
2026-05-18 12:40:30 +02:00 · 2026-05-18 11:19:17 +02:00 · 2026-05-18 11:14:11 +02:00 · 2026-05-18 11:09:36 +02:00 · 2026-05-18 11:06:42 +02:00 · 2026-05-18 11:06:08 +02:00
114 changed files with 22228 additions and 5098 deletions
@@ -16,5 +16,4 @@ yarn-error.log*
 *.sln
 *.local

-package-lock.json
 yarn.lock
@@ -1,5 +1,5 @@
 # RustDesk API Web
-# 基于 Vue3 + Element Plus 的后台, 适用于 [RustDesk API](https://github.com/lejianwen/rustdesk-api)
+# An Admin Dashboard built with Vue3 + Element Plus, designed for the [RustDesk API](https://github.com/lejianwen/rustdesk-api).

 <a href="https://github.com/vuejs/vue-next">
    <img src="https://img.shields.io/badge/vue-^3.2.16-brightgreen.svg" alt="vue3">
@@ -7,21 +7,21 @@
  <a href="https://github.com/element-plus/element-plus">
    <img src="https://img.shields.io/badge/element--plus-^2.8.2-brightgreen.svg" alt="element-plus">
  </a>
-  <a href="https://github.com/lejianwen/Gwen-admin/blob/master/LICENSE">
+  <a href="https://gitea.bsmportal.de/ralfu/rustdesk-api-web/LICENSE">
    <img src="https://img.shields.io/github/license/mashape/apistatus.svg" alt="license">
  </a>

-# 安装步骤
+# Installation Steps

 ```shell
-git clone https://github.com/lejianwen/rustdesk-api-web
+git clone https://gitea.bsmportal.de/ralfu/rustdesk-api-web
 cd rustdesk-api-web   
 npm install

-// 本地开发
+// Local Development
 npm run dev

-// 打包
+// Pack
 npm run build

 ```
@@ -1,10 +1,10 @@
 <!DOCTYPE html>
-<html lang="zh">
+<html lang="en">
  <head>
    <meta charset="UTF-8" />
    <link rel="icon" href="/favicon.ico" />
    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
-    <title>Gwen-Admin</title>
+    <title>Rustdesk API Admin</title>
  </head>
  <body>
    <div id="app"></div>
@@ -7,22 +7,26 @@
    "serve": "vite preview"
  },
  "dependencies": {
-    "axios": "1.6.0",
+    "axios": "1.8.2",
+    "clipboard": "2.0.4",
    "element-plus": "^2.8.2",
+    "fast-sha256": "^1.3.0",
    "js-cookie": "^3.0.1",
+    "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": {
    "@element-plus/icons": "0.0.11",
-    "@vitejs/plugin-vue": "^1.9.3",
+    "@vitejs/plugin-vue": "5.2.1",
    "dotenv": "^10.0.0",
    "qs": "^6.10.2",
-    "sass-loader": "^12.3.0",
    "sass": "^1.43.4",
-    "vite": "^2.9.18"
+    "sass-loader": "^12.3.0",
+    "ts-proto": "^1.141.1",
+    "vite": "6.3.4"
  }
 }
@@ -37,10 +37,27 @@ export function remove (data) {
  })
 }

-export function changePwd (data) {
+export function batchCreate (data) {
  return request({
-    url: '/address_book/changePwd',
+    url: '/address_book/batchCreate',
    method: 'post',
    data,
  })
 }
+
+export function shareByWebClient (data) {
+  return request({
+    url: '/address_book/shareByWebClient',
+    method: 'post',
+    data,
+  })
+}
+
+export function batchCreateFromPeers (data) {
+  return request({
+    url: '/address_book/batchCreateFromPeers',
+    method: 'post',
+    data,
+  })
+}
+
@@ -0,0 +1,39 @@
+import request from '@/utils/request'
+
+export function list (params) {
+  return request({
+    url: '/address_book_collection/list',
+    params,
+  })
+}
+
+export function detail (id) {
+  return request({
+    url: `/address_book_collection/detail/${id}`,
+  })
+}
+
+export function create (data) {
+  return request({
+    url: '/address_book_collection/create',
+    method: 'post',
+    data,
+  })
+}
+
+export function update (data) {
+  return request({
+    url: '/address_book_collection/update',
+    method: 'post',
+    data,
+  })
+}
+
+export function remove (data) {
+  return request({
+    url: '/address_book_collection/delete',
+    method: 'post',
+    data,
+  })
+}
+
@@ -0,0 +1,46 @@
+import request from '@/utils/request'
+
+export function list (params) {
+  return request({
+    url: '/address_book_collection_rule/list',
+    params,
+  })
+}
+
+export function detail (id) {
+  return request({
+    url: `/address_book_collection_rule/detail/${id}`,
+  })
+}
+
+export function create (data) {
+  return request({
+    url: '/address_book_collection_rule/create',
+    method: 'post',
+    data,
+  })
+}
+
+export function update (data) {
+  return request({
+    url: '/address_book_collection_rule/update',
+    method: 'post',
+    data,
+  })
+}
+
+export function remove (data) {
+  return request({
+    url: '/address_book_collection_rule/delete',
+    method: 'post',
+    data,
+  })
+}
+
+export function batchCreate (data) {
+  return request({
+    url: '/address_book_collection_rule/batchCreate',
+    method: 'post',
+    data,
+  })
+}
@@ -0,0 +1,47 @@
+import request from '@/utils/request'
+
+export function list (params) {
+  return request({
+    url: '/audit_conn/list',
+    params,
+  })
+}
+
+export function remove (data) {
+  return request({
+    url: '/audit_conn/delete',
+    method: 'post',
+    data,
+  })
+}
+
+export function batchDelete (data) {
+  return request({
+    url: '/audit_conn/batchDelete',
+    method: 'post',
+    data,
+  })
+}
+
+export function fileList (params) {
+  return request({
+    url: '/audit_file/list',
+    params,
+  })
+}
+
+export function fileRemove (data) {
+  return request({
+    url: '/audit_file/delete',
+    method: 'post',
+    data,
+  })
+}
+
+export function fileBatchDelete (data) {
+  return request({
+    url: '/audit_file/batchDelete',
+    method: 'post',
+    data,
+  })
+}
@@ -0,0 +1,22 @@
+import request from '@/utils/request'
+
+export function server () {
+  return request({
+    url: '/config/server',
+    method: 'get',
+  })
+}
+
+export function app () {
+  return request({
+    url: '/config/app',
+    method: 'get',
+  })
+}
+
+export function admin () {
+  return request({
+    url: '/config/admin',
+    method: 'get',
+  })
+}
@@ -0,0 +1,38 @@
+import request from '@/utils/request'
+
+export function list (params) {
+  return request({
+    url: '/device_group/list',
+    params,
+  })
+}
+
+export function detail (id) {
+  return request({
+    url: `/device_group/detail/${id}`,
+  })
+}
+
+export function create (data) {
+  return request({
+    url: '/device_group/create',
+    method: 'post',
+    data,
+  })
+}
+
+export function update (data) {
+  return request({
+    url: '/device_group/update',
+    method: 'post',
+    data,
+  })
+}
+
+export function remove (data) {
+  return request({
+    url: '/device_group/delete',
+    method: 'post',
+    data,
+  })
+}
@@ -0,0 +1,31 @@
+import request from '@/utils/request'
+
+export function loginOptions () {
+  return request({
+    url: '/login-options',
+    method: 'get',
+  })
+}
+
+export function oidcAuth (data) {
+  return request({
+    url: '/oidc/auth',
+    method: 'post',
+    data,
+  })
+}
+
+export function oidcQuery (params) {
+  return request({
+    url: '/oidc/auth-query',
+    method: 'get',
+    params,
+  })
+}
+
+export function captcha () {
+  return request({
+    url: '/captcha',
+    method: 'get',
+  })
+}
@@ -14,3 +14,11 @@ export function remove (data) {
    data,
  })
 }
+
+export function batchDelete (data) {
+  return request({
+    url: '/login_log/batchDelete',
+    method: 'post',
+    data,
+  })
+}
@@ -0,0 +1,48 @@
+import request from '@/utils/request'
+
+export function list (params) {
+  return request({
+    url: '/my/address_book/list',
+    params,
+  })
+}
+
+export function batchCreateFromPeers (data) {
+  return request({
+    url: '/my/address_book/batchCreateFromPeers',
+    method: 'post',
+    data,
+  })
+}
+
+export function batchUpdateTags (data) {
+  return request({
+    url: '/my/address_book/batchUpdateTags',
+    method: 'post',
+    data,
+  })
+}
+
+export function create (data) {
+  return request({
+    url: '/my/address_book/create',
+    method: 'post',
+    data,
+  })
+}
+
+export function update (data) {
+  return request({
+    url: '/my/address_book/update',
+    method: 'post',
+    data,
+  })
+}
+
+export function remove (data) {
+  return request({
+    url: '/my/address_book/delete',
+    method: 'post',
+    data,
+  })
+}
@@ -0,0 +1,33 @@
+import request from '@/utils/request'
+
+export function list (params) {
+  return request({
+    url: '/my/address_book_collection/list',
+    params,
+  })
+}
+
+export function create (data) {
+  return request({
+    url: '/my/address_book_collection/create',
+    method: 'post',
+    data,
+  })
+}
+
+export function update (data) {
+  return request({
+    url: '/my/address_book_collection/update',
+    method: 'post',
+    data,
+  })
+}
+
+export function remove (data) {
+  return request({
+    url: '/my/address_book_collection/delete',
+    method: 'post',
+    data,
+  })
+}
+
@@ -0,0 +1,40 @@
+import request from '@/utils/request'
+
+export function list (params) {
+  return request({
+    url: '/my/address_book_collection_rule/list',
+    params,
+  })
+}
+
+export function create (data) {
+  return request({
+    url: '/my/address_book_collection_rule/create',
+    method: 'post',
+    data,
+  })
+}
+
+export function update (data) {
+  return request({
+    url: '/my/address_book_collection_rule/update',
+    method: 'post',
+    data,
+  })
+}
+
+export function remove (data) {
+  return request({
+    url: '/my/address_book_collection_rule/delete',
+    method: 'post',
+    data,
+  })
+}
+
+export function batchCreate (data) {
+  return request({
+    url: '/my/address_book_collection_rule/batchCreate',
+    method: 'post',
+    data,
+  })
+}
@@ -0,0 +1,24 @@
+import request from '@/utils/request'
+
+export function list (params) {
+  return request({
+    url: '/my/login_log/list',
+    params,
+  })
+}
+
+export function remove (data) {
+  return request({
+    url: '/my/login_log/delete',
+    method: 'post',
+    data,
+  })
+}
+
+export function batchDelete (data) {
+  return request({
+    url: '/my/login_log/batchDelete',
+    method: 'post',
+    data,
+  })
+}
@@ -0,0 +1,8 @@
+import request from '@/utils/request'
+
+export function list (params) {
+  return request({
+    url: '/my/peer/list',
+    params,
+  })
+}
@@ -0,0 +1,24 @@
+import request from '@/utils/request'
+
+export function list (params) {
+  return request({
+    url: '/my/share_record/list',
+    params,
+  })
+}
+
+export function remove (data) {
+  return request({
+    url: '/my/share_record/delete',
+    method: 'post',
+    data,
+  })
+}
+
+export function batchDelete (data) {
+  return request({
+    url: '/my/share_record/batchDelete',
+    method: 'post',
+    data,
+  })
+}
@@ -0,0 +1,33 @@
+import request from '@/utils/request'
+
+export function list (params) {
+  return request({
+    url: '/my/tag/list',
+    params,
+  })
+}
+
+export function create (data) {
+  return request({
+    url: '/my/tag/create',
+    method: 'post',
+    data,
+  })
+}
+
+export function update (data) {
+  return request({
+    url: '/my/tag/update',
+    method: 'post',
+    data,
+  })
+}
+
+export function remove (data) {
+  return request({
+    url: '/my/tag/delete',
+    method: 'post',
+    data,
+  })
+}
+
@@ -36,3 +36,19 @@ export function remove (data) {
    data,
  })
 }
+
+export function batchRemove (data) {
+  return request({
+    url: '/peer/batchDelete',
+    method: 'post',
+    data,
+  })
+}
+
+export function simpleData (data) {
+  return request({
+    url: '/peer/simpleData',
+    method: 'post',
+    data,
+  })
+}
@@ -1,8 +1,40 @@
 import request from '@/utils/request'

-export function config () {
+export function list (params) {
  return request({
-    url: '/server-config',
-    method: 'get',
+    url: '/rustdesk/cmdList',
+    params,
+  })
+}
+
+export function create (data) {
+  return request({
+    url: '/rustdesk/cmdCreate',
+    method: 'post',
+    data,
+  })
+}
+
+export function update (data) {
+  return request({
+    url: '/rustdesk/cmdUpdate',
+    method: 'post',
+    data,
+  })
+}
+
+export function remove (data) {
+  return request({
+    url: '/rustdesk/cmdDelete',
+    method: 'post',
+    data,
+  })
+}
+
+export function sendCmd (data) {
+  return request({
+    url: '/rustdesk/sendCmd',
+    method: 'post',
+    data,
  })
 }
@@ -0,0 +1,24 @@
+import request from '@/utils/request'
+
+export function list (params) {
+  return request({
+    url: '/share_record/list',
+    params,
+  })
+}
+
+export function remove (data) {
+  return request({
+    url: '/share_record/delete',
+    method: 'post',
+    data,
+  })
+}
+
+export function batchDelete (data) {
+  return request({
+    url: '/share_record/batchDelete',
+    method: 'post',
+    data,
+  })
+}
@@ -74,3 +74,26 @@ export function myOauth () {
    method: 'post',
  })
 }
+
+export function myPeer (params) {
+  return request({
+    url: '/user/myPeer',
+    params,
+  })
+}
+
+export function groupUsers (data) {
+  return request({
+    url: '/user/groupUsers',
+    method: 'post',
+    data,
+  })
+}
+
+export function register (data) {
+  return request({
+    url: '/user/register',
+    method: 'post',
+    data,
+  })
+}
@@ -0,0 +1,24 @@
+import request from '@/utils/request'
+
+export function list (params) {
+  return request({
+    url: '/user_token/list',
+    params,
+  })
+}
+
+export function remove (data) {
+  return request({
+    url: '/user_token/delete',
+    method: 'post',
+    data,
+  })
+}
+
+export function batchRemove (data) {
+  return request({
+    url: '/user_token/batchDelete',
+    method: 'post',
+    data,
+  })
+}
@@ -1,18 +1,18 @@
 <template>
-  <el-dialog v-model="visible" width="50%">
-    <el-form ref="cpwd" :model="changePwdForm" :rules="chagePwdRules" label-width="120px" style="margin-top: 20px">
-      <el-form-item label="旧密码" prop="old_password">
-        <el-input v-model="changePwdForm.old_password" show-password></el-input>
+  <el-dialog v-model="v" width="50%" :show-close="false">
+    <el-form ref="cpwd" :model="changePwdForm" :rules="chagePwdRules" label-width="150px" label-position="left" style="margin-top: 20px">
+      <el-form-item :label="T('OldPassword')" prop="old_password">
+        <el-input v-model="changePwdForm.old_password" :placeholder="T('For OIDC login without a password, enter any 4-20 letters')" show-password></el-input>
      </el-form-item>
-      <el-form-item label="新密码" prop="new_password">
+      <el-form-item :label="T('NewPassword')" prop="new_password">
        <el-input v-model="changePwdForm.new_password" show-password></el-input>
      </el-form-item>
-      <el-form-item label="确认密码" prop="confirmPwd">
+      <el-form-item :label="T('ConfirmPassword')" prop="confirmPwd">
        <el-input v-model="changePwdForm.confirmPwd" show-password></el-input>
      </el-form-item>
      <el-form-item>
-        <el-button @click="cancelChangePwd">取消</el-button>
-        <el-button type="primary" @click="changePassword">确定</el-button>
+        <el-button @click="cancelChangePwd">{{ T('Cancel') }}</el-button>
+        <el-button type="primary" @click="changePassword">{{ T('Confirm') }}</el-button>
      </el-form-item>
    </el-form>
  </el-dialog>
@@ -20,15 +20,21 @@

 <script setup>

-  import { reactive, ref } from 'vue'
+  import { computed, reactive, ref } from 'vue'
  import { ElMessageBox } from 'element-plus'
  import { changeCurPwd } from '@/api/user'
  import { useUserStore } from '@/store/user'
+  import { T } from '@/utils/i18n'

  const props = defineProps({
    visible: Boolean,
  })
-
+  const v = computed({
+    get: () => props.visible,
+    set: (val) => {
+      emit('update:visible', val)
+    },
+  })
  const emit = defineEmits(['update:visible'])

  // Watch for changes to the prop and emit an event if necessary
@@ -46,14 +52,14 @@
    new_password: '',
    confirmPwd: '',
  })
-  const chagePwdRules = reactive({
-    old_password: [{ required: true, message: '请输入旧密码', trigger: 'blur' }],
+  const chagePwdRules = computed(_ => ({
+    old_password: [{ required: true, message: T('ParamRequired', { param: T('OldPassword') }), trigger: 'blur' }],
    new_password: [
-      { required: true, message: '请输入新密码', trigger: 'blur' },
+      { required: true, message: T('ParamRequired', { param: T('NewPassword') }), trigger: 'blur' },
      {
        validator: (rule, value, callback) => {
          if (value === changePwdForm.old_password) {
-            callback(new Error('新密码不能与旧密码相同'))
+            callback(new Error(T('NewPasswordEqualOldPassword'))) //'新密码不能与旧密码相同'
          } else {
            callback()
          }
@@ -61,11 +67,11 @@
        trigger: 'blur',
      }],
    confirmPwd: [
-      { required: true, message: '请再次输入新密码', trigger: 'blur' },
+      { required: true, message: T('ParamRequired', { param: T('ConfirmPassword') }), trigger: 'blur' },
      {
        validator: (rule, value, callback) => {
          if (value !== changePwdForm.new_password) {
-            callback(new Error('两次输入密码不一致'))
+            callback(new Error(T('PasswordNotMatchConfirmPassword')))
          } else {
            callback()
          }
@@ -73,7 +79,7 @@
        trigger: 'blur',
      },
    ],
-  })
+  }))
  const cpwd = ref(null)
  const cancelChangePwd = () => {
    emit('update:visible', false)
@@ -88,9 +94,9 @@
      return
    }
    console.log('changePassword')
-    const confirm = await ElMessageBox.confirm('确定修改密码么？', {
-      confirmButtonText: '确定',
-      cancelButtonText: '取消',
+    const confirm = await ElMessageBox.confirm(T('Confirm?', { param: T('ChangePassword') }), {
+      confirmButtonText: T('Confirm'),
+      cancelButtonText: T('Cancel'),
    }).catch(_ => false)
    if (!confirm) {
      return
@@ -99,7 +105,7 @@
    if (!res) {
      return
    }
-    ElMessageBox.alert('修改成功', '修改密码', {
+    ElMessageBox.alert(T('OperationSuccess'), T('ChangePassword'), {
      autofocus: true,
      confirmButtonText: 'OK',
      callback: (action) => {
@@ -0,0 +1,34 @@
+<template>
+  <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 512 512">
+    <path v-if="props.name==='windows'" :fill="props.color||'currentColor'" d="m0 93.7 183.6-25.3v177.4H0V93.7zm0 324.6 183.6 25.3V268.4H0v149.9zm203.8 28L448 480V268.4H203.8v177.9zm0-380.6v180.1H448V32L203.8 65.7z"/>
+    <path v-if="props.name==='android'" :fill="props.color||'currentColor'"
+          d="M77 179a33 33 0 0 0-25 10 33 33 0 0 0-9 24v143a33 33 0 0 0 10 24 33 33 0 0 0 24 10c9 0 17-3 24-10a33 33 0 0 0 10-24V213c0-9-4-17-10-24a33 33 0 0 0-24-10zM352 51l24-44c1-3 1-5-2-6-3-2-5-1-7 2l-24 43a163 163 0 0 0-133 0L186 3c-2-3-4-4-7-2-2 1-3 3-1 6l23 44c-24 12-43 29-57 51a129 129 0 0 0-21 72h307c0-26-7-50-21-72a146 146 0 0 0-57-51zm-136 63a13 13 0 0 1-10 4 13 13 0 0 1-12-13c0-4 1-7 3-9 3-3 6-4 9-4s7 1 10 4c2 2 3 5 3 9s-1 7-3 9zm140 0a12 12 0 0 1-9 4c-4 0-7-1-9-4a12 12 0 0 1-4-9c0-4 1-7 4-9 2-3 5-4 9-4a12 12 0 0 1 9 4c2 2 3 5 3 9s-1 7-3 9zM124 407c0 10 4 19 11 26s15 10 26 10h24v76c0 9 4 17 10 24s15 10 24 10c10 0 18-3 25-10s10-15 10-24v-76h45v76c0 9 4 17 10 24s15 10 25 10c9 0 17-3 24-10s10-15 10-24v-76h25a35 35 0 0 0 25-10c7-7 11-16 11-26V185H124v222zm352-228a33 33 0 0 0-24 10 33 33 0 0 0-10 24v143a34 34 0 0 0 34 34c10 0 18-3 25-10s10-15 10-24V213c0-9-4-17-10-24a33 33 0 0 0-25-10z"/>
+
+    <path v-if="props.name==='linux'" :fill="props.color||'currentColor'"
+          d="M220.499 479.926c-74.052 0-136.663-53.729-147.853-118.13-.591-3.404-3.789-5.476-7.137-4.626l-50.683 12.879C3.107 373.027-2.913 366.27 1.39 354.971q26.627-69.911 87.656-131.908c30.862-31.352 41.876-59.308 43.591-106.328 1.715-47.02 40.427-84.661 87.862-84.661 47.435 0 86.149 37.641 87.864 84.661 1.715 47.02 12.729 74.976 43.591 106.328q61.027 61.997 87.656 131.908c4.303 11.299-1.717 18.056-13.436 15.078l-50.683-12.879c-3.348-.85-6.546 1.222-7.137 4.626-11.192 64.401-73.801 118.13-147.855 118.13Zm0-251.676c-1.591.049-3.181-.338-4.393-1.113l-50.912-32.578c-6.324-4.004-7.244-11.629-2.051-17.02 5.194-5.388 29.297-12.27 57.356-12.27 28.061 0 52.162 6.882 57.356 12.27 5.193 5.391 4.275 13.016-2.049 17.02l-50.912 32.578c-1.214.775-2.804 1.162-4.395 1.113Zm-44.627-7.73c-38.185 15.381-67.218 55.636-67.218 102.62 0 61.729 50.116 111.847 111.845 111.847s111.845-50.118 111.845-111.847c0-46.986-29.035-87.243-67.225-102.622-1.601-.647-4.082-.416-5.538.516l-27.383 17.52c-.03.021-.062.043-.083.064a20.762 20.762 0 0 1-5.705 2.473c-1.848.49-3.755.73-5.676.73h-.177l-.062-.011-.054.011h-.175c-1.921 0-3.83-.24-5.686-.73a20.7 20.7 0 0 1-5.697-2.473 3.83 3.83 0 0 0-.094-.064l-27.376-17.516c-1.456-.931-3.937-1.165-5.541-.518Z"/>
+    <path v-if="props.name==='mac'" :fill="props.color||'currentColor'"
+          d="M318.7 268.7c-.2-36.7 16.4-64.4 50-84.8-18.8-26.9-47.2-41.7-84.7-44.6-35.5-2.8-74.3 20.7-88.5 20.7-15 0-49.4-19.7-76.4-19.7C63.3 141.2 4 184.8 4 273.5q0 39.3 14.4 81.2c12.8 36.7 59 126.7 107.2 125.2 25.2-.6 43-17.9 75.8-17.9 31.8 0 48.3 17.9 76.4 17.9 48.6-.7 90.4-82.5 102.6-119.3-65.2-30.7-61.7-90-61.7-91.9zm-56.6-164.2c27.3-32.4 24.8-61.9 24-72.5-24.1 1.4-52 16.4-67.9 34.9-17.5 19.8-27.8 44.3-25.6 71.9 26.1 2 49.9-11.4 69.5-34.3z"/>
+
+  </svg>
+</template>
+
+<script setup>
+  const props = defineProps({
+    name: {
+      type: String,
+      required: true,
+      default: '',
+      values: ['windows', 'android', 'mac', 'linux'],
+    },
+    color: {
+      type: String,
+      default: '',
+    },
+  })
+</script>
+
+<style scoped lang="scss">
+svg {
+  display: block;
+}
+</style>
@@ -1,6 +1,7 @@
 import { ref, reactive, watch } from 'vue'
 import { list as fetchUsers } from '@/api/user'

+// todo Cache all user information.
 export function loadAllUsers () {
  const allUsers = ref([])
  const getAllUsers = async () => {
@@ -13,8 +13,8 @@
  })
 </script>

-<style scoped>
-  .scroll-sidebar{
-    position: fixed;
-  }
+<style scoped lang="scss">
+.scroll-sidebar {
+  background-color: #2d3a4b;
+}
 </style>
@@ -47,7 +47,7 @@
    min-height: 100vh;
    border-right: none;
    &:not(.el-menu--collapse) {
-      width: 210px;
+      width: var(--sideBarWidth);
    }

  }
@@ -7,7 +7,7 @@
      <el-icon v-if="route.meta?.icon">
        <component :is="`el-icon-${route.meta.icon}`"></component>
      </el-icon>
-      <span>{{route.meta?.title||route.name}}</span>
+      <span>{{ T(route.meta?.title) || T(route.name) }}</span>
    </template>
    <menu-item v-for="(_route,_index) in route.children"
               :route="_route"
@@ -18,12 +18,13 @@
    <el-icon v-if="parseRoute(route).meta?.icon">
      <component :is="`el-icon-${parseRoute(route).meta.icon}`"></component>
    </el-icon>
-    <span>{{parseRoute(route).meta?.title||parseRoute(route).name}}</span>
+    <span>{{ T(parseRoute(route).meta?.title) || T(parseRoute(route).name) }}</span>
  </el-menu-item>
 </template>

 <script>
  import { defineComponent } from 'vue'
+  import { T } from '@/utils/i18n'

  export default defineComponent({
    name: 'MenuItem',
@@ -43,6 +44,7 @@
      }
      return {
        parseRoute,
+        T,
      }
    },
  })
@@ -1,5 +1,37 @@
 <template>
  <div class="setting">
+    <div class="menu-item">
+      <el-switch
+          v-model="isDark"
+          style="--el-switch-on-color:#18222c"
+      >
+        <template #active-action>
+          <el-icon>
+            <Moon/>
+          </el-icon>
+        </template>
+        <template #inactive-action>
+          <el-icon>
+            <Sunny color="#000"/>
+          </el-icon>
+        </template>
+      </el-switch>
+    </div>
+    <el-dropdown class="menu-item">
+      <div class="title">
+        <i class="el-icon el-tooltip__trigger" style="font-size: 24px;">
+          <svg preserveAspectRatio="xMidYMid meet" viewBox="0 0 24 24" width="1.2em" height="1.2em">
+            <path fill="currentColor"
+                  d="m18.5 10l4.4 11h-2.155l-1.201-3h-4.09l-1.199 3h-2.154L16.5 10h2zM10 2v2h6v2h-1.968a18.222 18.222 0 0 1-3.62 6.301a14.864 14.864 0 0 0 2.336 1.707l-.751 1.878A17.015 17.015 0 0 1 9 13.725a16.676 16.676 0 0 1-6.201 3.548l-.536-1.929a14.7 14.7 0 0 0 5.327-3.042A18.078 18.078 0 0 1 4.767 8h2.24A16.032 16.032 0 0 0 9 10.877a16.165 16.165 0 0 0 2.91-4.876L2 6V4h6V2h2zm7.5 10.885L16.253 16h2.492L17.5 12.885z"></path>
+          </svg>
+        </i>
+      </div>
+      <template #dropdown>
+        <el-dropdown-menu>
+          <el-dropdown-item v-for="(v, k) in appStore.setting.langs" @click="changeLang(k)" :key="k">{{ v.name }}</el-dropdown-item>
+        </el-dropdown-menu>
+      </template>
+    </el-dropdown>
    <el-dropdown class="menu-item">
      <div class="title">
        <!--        <el-image class="avatar" :src="user.avatar"></el-image>-->
@@ -7,12 +39,13 @@
        <el-icon>
          <el-icon-arrow-down/>
        </el-icon>
+
      </div>

      <template #dropdown>
        <el-dropdown-menu>
-          <el-dropdown-item @click="showChangePwd">修改密码</el-dropdown-item>
-          <el-dropdown-item @click="logout">退出登录</el-dropdown-item>
+          <el-dropdown-item @click="showChangePwd">{{ T('ChangePassword') }}</el-dropdown-item>
+          <el-dropdown-item @click="logout">{{ T('Logout') }}</el-dropdown-item>
        </el-dropdown-menu>
      </template>
    </el-dropdown>
@@ -22,11 +55,16 @@

 <script setup>
  import { useUserStore } from '@/store/user'
+  import { useAppStore } from '@/store/app'
  import changePwdDialog from '@/components/changePwdDialog.vue'
  import { ref } from 'vue'
+  import { T } from '@/utils/i18n'
+  import { useDark } from '@vueuse/core'
+  import { Sunny, Moon } from '@element-plus/icons'

  const userStore = useUserStore()
  const user = userStore
+  const appStore = useAppStore()

  const logout = () => {
    userStore.logout()
@@ -37,6 +75,11 @@
  const showChangePwd = () => {
    changePwdVisible.value = true
  }
+  const changeLang = (v) => {
+    appStore.changeLang(v)
+  }
+  const isDark = useDark()
+  // const toggleDark = useToggle(isDark)
 </script>

 <style lang="scss" scoped>
@@ -46,12 +89,21 @@
  align-items: center;
  justify-content: space-around;

+  .menu-item {
+    margin-left: 15px;
+
+    * {
+      outline: none;
+    }
+  }
+
  .title {
    color: #fff;
    display: flex;
    align-items: center;
    justify-content: space-around;

+
    .nickname {
      padding: 0 10px;
    }
@@ -7,7 +7,7 @@
          @click="toTag(t)"
          :type="t.active?'primary':'info'"
          :effect="t.active?'dark':'plain'">
-    {{t.title}}
+    {{ T(t.title) }}
  </el-tag>
 </template>

@@ -15,6 +15,7 @@
  import { defineComponent, ref, onMounted, watch } from 'vue'
  import { useTagsStore } from '@/store/tags'
  import { useRoute, useRouter } from 'vue-router'
+  import { T } from '@/utils/i18n'

  export default defineComponent({
    name: 'Index',
@@ -64,6 +65,7 @@
        close,
        toLastTag,
        toTag,
+        T,
      }
    },
  })
@@ -71,10 +73,11 @@

 <style lang="scss" scoped>

-  .tag {
-    border-radius: 0;
-    cursor: pointer;
-    &.active {
-    }
+.tag {
+  border-radius: 0;
+  cursor: pointer;
+
+  &.active {
  }
+}
 </style>
@@ -1,85 +1,71 @@
 <template>
-  <el-container>
-    <el-aside :width="leftWidth" class="app-left">
-      <g-aside></g-aside>
-    </el-aside>
-    <el-container class="app-container ">
-      <el-header class="app-header">
-        <g-header></g-header>
-      </el-header>
-      <div class="header-tags">
-        <tags></tags>
-      </div>
+  <el-config-provider :locale="appStore.setting.locale.value">
+    <el-container :style="{'--sideBarWidth': sideBarWidth}">
+      <el-aside :width="leftWidth" class="app-left">
+        <g-aside></g-aside>
+      </el-aside>
+      <el-container class="app-container ">
+        <el-header class="app-header">
+          <g-header></g-header>
+        </el-header>
+        <div class="header-tags">
+          <tags></tags>
+        </div>

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

-<script>
-  import { useUserStore } from '@/store/user'
-  import { useRouteStore } from '@/store/router'
+<script setup>
  import { useAppStore } from '@/store/app'
  import { useTagsStore } from '@/store/tags'
-  import LayerHeader from '@/layout/components/header.vue'
-  import { defineComponent, ref, onMounted, watch, reactive, computed, toRef } from 'vue'
+  import { ref, computed } from 'vue'
  import Tags from '@/layout/components/tags/index.vue'
  import GAside from '@/layout/components/aside.vue'
  import GHeader from '@/layout/components/header.vue'

-  export default defineComponent({
-    name: 'Layout',
-    components: { LayerHeader, Tags, GAside, GHeader },
-    setup (props) {
-      const userStore = useUserStore()
-      const appStore = useAppStore()
-      const tagStore = useTagsStore()
+  const appStore = useAppStore()
+  const tagStore = useTagsStore()
+  const sideBarWidth = computed(() => appStore.setting.locale.sideBarWidth)
+  const leftWidth = computed(() => appStore.setting.sideIsCollapse ? '64px' : 'var(--sideBarWidth)')

-      const leftWidth = computed(() => appStore.setting.sideIsCollapse ? '64px' : '210px')
+  const cachedTags = ref([])

-      const cachedTags = ref([])
-
-      cachedTags.value = tagStore.cached
-
-      return {
-        cachedTags,
-        leftWidth,
-      }
-    },
-  })
+  cachedTags.value = tagStore.cached
 </script>

 <style lang="scss" scoped>
-  .app-header {
-    background-color: #3f454b;
-    color: var(--basicWhite);
-    display: flex;
-    height: 50px;
-  }
+.app-header {
+  background-color: #3f454b;
+  color: var(--basicWhite);
+  display: flex;
+  height: 50px;
+}

-  .header-tags {
-    height: auto;
-    border-bottom: 1px solid #eee;
-    display: flex;
-    padding: 0;
-  }
+.header-tags {
+  height: auto;
+  border-bottom: 1px solid #eee;
+  display: flex;
+  padding: 0;
+}

-  .app-left {
-    height: 100%;
-    transition: width 0.5s;
-  }
+.app-left {
+  transition: width 0.5s;
+}

-  .app-container {
-    min-height: 100vh;
-  }
+.app-container {
+  min-height: 100vh;
+}
 </style>


@@ -7,6 +7,7 @@ import { router } from '@/router'
 import 'normalize.css/normalize.css'
 import { pinia } from '@/store'
 import '@/permission'
+import 'element-plus/theme-chalk/dark/css-vars.css'
 import '@/styles/style.scss'
 import * as ElementIcons from '@element-plus/icons'

@@ -6,15 +6,17 @@ import { pinia } from '@/store'
 import NProgress from 'nprogress' // progress bar
 import 'nprogress/nprogress.css'
 import { useAppStore } from '@/store/app' // progress bar style
+import { T } from '@/utils/i18n'

 NProgress.configure({ showSpinner: false }) // NProgress Configuration

-const whiteList = ['/login']
+const whiteList = ['/login', '/register']
 const routeStore = useRouteStore(pinia)
 const appStore = useAppStore(pinia)
+appStore.getAdminConfig()
 router.beforeEach(async (to, from, next) => {

-  document.title = (to.meta?.title || 'Rust-api-web') + '-' + appStore.setting.title
+  document.title = T(to.meta?.title) + ' - ' + appStore.setting.title
  NProgress.start()

  const token = getToken()
@@ -39,7 +41,9 @@ router.beforeEach(async (to, from, next) => {
      } else {
        next({ ...to, replace: true })
      }
-    } else {
+    }/* else if (to.path === '/404') {
+      next({path: to.redirectedFrom?.fullPath, replace: true})
+    }*/ else {
      next()
    }
  }
@@ -4,10 +4,15 @@ const constantRoutes = [
  {
    path: '/login',
    name: 'Login',
-    meta: { title: '登录' },
+    meta: { title: 'Login' },
    component: () => import('@/views/login/login.vue'),
  },
-
+  {
+    path: '/register',
+    name: 'Register',
+    meta: { title: 'Register' },
+    component: () => import('@/views/register/index.vue'),
+  },
  {
    path: '/404',
    component: () => import('@/views/error-page/404.vue'),
@@ -15,11 +20,13 @@ const constantRoutes = [
  },
  {
    path: '/oauth/:code',
+    meta: { title: 'OauthLogin' },
    component: () => import('@/views/oauth/login.vue'),
    hidden: true,
  },
  {
    path: '/oauth/bind/:code',
+    meta: { title: 'OauthBind' },
    component: () => import('@/views/oauth/bind.vue'),
    hidden: true,
  },
@@ -44,92 +51,157 @@ export const asyncRoutes = [
  {
    path: '/my',
    name: 'My',
-    redirect: '/my/info',
-    meta: { title: '我的', icon: 'UserFilled' },
+    redirect: '/',
+    meta: { title: 'My', icon: 'UserFilled' },
    component: () => import('@/layout/index.vue'),
    children: [
      {
        path: '/',
        name: 'MyInfo',
-        meta: { title: '个人信息', icon: 'User' /*keepAlive: true*/ },
+        meta: { title: 'Userinfo', icon: 'User' /*keepAlive: true*/ },
        component: () => import('@/views/my/info.vue'),
      },
+      {
+        path: 'peer',
+        name: 'MyPeer',
+        meta: { title: 'MyPeer', icon: 'Monitor' /*keepAlive: true*/ },
+        component: () => import('@/views/my/peer/index.vue'),
+      },
+      {
+        path: 'address_book_collection',
+        name: 'MyAddressBookCollection',
+        meta: { title: 'AddressBookName', icon: 'Collection' /*keepAlive: true*/ },
+        component: () => import('@/views/my/address_book/collection.vue'),
+      },
      {
        path: 'address_book',
        name: 'MyAddressBookList',
-        meta: { title: '地址簿管理', icon: 'Notebook' /*keepAlive: true*/ },
+        meta: { title: 'AddressBooks', icon: 'Notebook' /*keepAlive: true*/ },
        component: () => import('@/views/my/address_book/index.vue'),
      },
      {
        path: 'tag',
        name: 'MyTagList',
-        meta: { title: '标签管理', icon: 'CollectionTag' /*keepAlive: true*/ },
+        meta: { title: 'Tags', icon: 'CollectionTag' /*keepAlive: true*/ },
        component: () => import('@/views/my/tag/index.vue'),
      },
+      {
+        path: 'shareRecord',
+        name: 'MyShareRecordList',
+        meta: { title: 'ShareRecord', icon: 'Share' /*keepAlive: true*/ },
+        component: () => import('@/views/my/share_record/index.vue'),
+      },
+      {
+        path: 'loginLog',
+        name: 'MyLoginLog',
+        meta: { title: 'LoginLog', icon: 'List' /*keepAlive: true*/ },
+        component: () => import('@/views/my/login_log/index.vue'),
+      },
    ],
  },
  {
    path: '/user',
    name: 'User',
    redirect: '/user/index',
-    meta: { title: '系统', icon: 'Setting' },
+    meta: { title: 'System', icon: 'Setting' },
    component: () => import('@/layout/index.vue'),
    children: [
      {
        path: 'peer',
        name: 'Peer',
-        meta: { title: '设备管理', icon: 'Monitor' /*keepAlive: true*/ },
+        meta: { title: 'PeerManage', icon: 'Monitor' /*keepAlive: true*/ },
        component: () => import('@/views/peer/index.vue'),
      },
      {
        path: 'group',
        name: 'UserGroup',
-        meta: { title: '群组管理', icon: 'ChatRound' /*keepAlive: true*/ },
+        meta: { title: 'GroupManage', icon: 'ChatRound' /*keepAlive: true*/ },
        component: () => import('@/views/group/index.vue'),
      },
+      {
+        path: 'deviceGroup',
+        name: 'DeviceGroup',
+        meta: { title: 'DeviceGroupManage', icon: 'ChatRound' /*keepAlive: true*/ },
+        component: () => import('@/views/group/deviceGroupList.vue'),
+      },
      {
        path: 'index',
        name: 'UserList',
-        meta: { title: '用户列表', icon: 'User' /*keepAlive: true*/ },
+        meta: { title: 'UserManage', icon: 'User' /*keepAlive: true*/ },
        component: () => import('@/views/user/index.vue'),
      },
      {
        path: 'add',
        name: 'UserAdd',
-        meta: { title: '用户添加', hide: true },
+        meta: { title: 'UserAdd', hide: true },
        component: () => import('@/views/user/edit.vue'),
      },
      {
        path: 'edit/:id',
        name: 'UserEdit',
-        meta: { title: '用户编辑', hide: true },
+        meta: { title: 'UserEdit', hide: true },
        component: () => import('@/views/user/edit.vue'),
      },
-
+      {
+        path: 'addressBookName',
+        name: 'UserAddressBookName',
+        meta: { title: 'AddressBookNameManage', icon: 'Collection' /*keepAlive: true*/ },
+        component: () => import('@/views/address_book/collection.vue'),
+      },
      {
        path: 'addressBook',
        name: 'UserAddressBook',
-        meta: { title: '地址簿管理', icon: 'Notebook' /*keepAlive: true*/ },
+        meta: { title: 'AddressBookManage', icon: 'Notebook' /*keepAlive: true*/ },
        component: () => import('@/views/address_book/index.vue'),
      },
      {
        path: 'tag',
        name: 'UserTag',
-        meta: { title: '标签管理', icon: 'CollectionTag' /*keepAlive: true*/ },
+        meta: { title: 'TagsManage', icon: 'CollectionTag' /*keepAlive: true*/ },
        component: () => import('@/views/tag/index.vue'),
      },
      {
        path: '/oauth',
        name: 'Oauth',
-        meta: { title: 'Oauth管理', icon: 'Link' /*keepAlive: true*/ },
+        meta: { title: 'OauthManage', icon: 'Link' /*keepAlive: true*/ },
        component: () => import('@/views/oauth/index.vue'),
      },
+      {
+        path: '/userToken',
+        name: 'UserToken',
+        meta: { title: 'UserToken', icon: 'Ticket' /*keepAlive: true*/ },
+        component: () => import('@/views/user/token.vue'),
+      },
      {
        path: '/loginLog',
        name: 'LoginLog',
-        meta: { title: '登录日志', icon: 'List' /*keepAlive: true*/ },
+        meta: { title: 'LoginLog', icon: 'List' /*keepAlive: true*/ },
        component: () => import('@/views/login/log.vue'),
      },
+      {
+        path: '/auditConn',
+        name: 'AuditConn',
+        meta: { title: 'AuditConnLog', icon: 'Tickets' /*keepAlive: true*/ },
+        component: () => import('@/views/audit/connList.vue'),
+      },
+      {
+        path: '/auditFile',
+        name: 'AuditFile',
+        meta: { title: 'AuditFileLog', icon: 'Files' /*keepAlive: true*/ },
+        component: () => import('@/views/audit/fileList.vue'),
+      },
+      {
+        path: '/shareRecord',
+        name: 'ShareRecord',
+        meta: { title: 'ShareRecord', icon: 'Share' /*keepAlive: true*/ },
+        component: () => import('@/views/share_record/index.vue'),
+      },
+      {
+        path: '/serverCmd',
+        name: 'ServerCmd',
+        meta: { title: 'ServerCmd', icon: 'Tools' /*keepAlive: true*/ },
+        component: () => import('@/views/rustdesk/control.vue'),
+      },
    ],
  },
 ]
@@ -1,13 +1,44 @@
 import { defineStore, acceptHMRUpdate } from 'pinia'
 import logo from '@/assets/logo.png'
+import zhCn from 'element-plus/es/locale/lang/zh-cn'
+import en from 'element-plus/es/locale/lang/en'
+import ko from 'element-plus/es/locale/lang/ko'
+import ru from 'element-plus/es/locale/lang/ru'
+import fr from 'element-plus/es/locale/lang/fr'
+import es from 'element-plus/es/locale/lang/es'
+import zhTw from 'element-plus/es/locale/lang/zh-tw'
+import { admin, app, server } from '@/api/config'

+const langs = {
+  'zh-CN': { name: '中文', value: zhCn, sideBarWidth: '210px' },
+  'en': { name: 'English', value: en, sideBarWidth: '230px' },
+  'fr': { name: 'Français', value: fr, sideBarWidth: '280px' },
+  'ko': { name: '한국어', value: ko, sideBarWidth: '230px' },
+  'ru': { name: 'Русский', value: ru, sideBarWidth: '250px' },
+  'es': { name: 'Español', value: es, sideBarWidth: '280px' },
+  'zh-TW': { name: '中文繁体', value: zhTw, sideBarWidth: '210px' },
+}
+const defaultLang = localStorage.getItem('lang') || navigator.language || 'zh-CN'
 export const useAppStore = defineStore({
  id: 'App',
  state: () => ({
    setting: {
-      title: 'Gwen-Admin',
+      title: 'Rustdesk API Admin',
+      hello: '',
      sideIsCollapse: false,
      logo,
+      langs: langs,
+      lang: defaultLang,
+      locale: langs[defaultLang] ? langs[defaultLang] : langs['en'],
+      appConfig: {
+        web_client: 1,
+      },
+      rustdeskConfig: {
+        'id_server': '',
+        'key': '',
+        'relay_server': '',
+        'api_server': '',
+      },
    },
  }),

@@ -15,6 +46,49 @@ export const useAppStore = defineStore({
    sideCollapse () {
      this.setting.sideIsCollapse = !this.setting.sideIsCollapse
    },
+    setLang (lang) {
+      console.log('setLang', lang)
+      this.setting.lang = lang
+      this.setting.locale = langs[lang]
+      localStorage.setItem('lang', lang)
+    },
+    changeLang (v) {
+      this.setLang(v)
+    },
+    loadConfig () {
+      this.getAppConfig()
+      this.getAdminConfig()
+      this.loadRustdeskConfig()
+    },
+    getAppConfig () {
+      console.log('getAppConfig')
+      return app().then(res => {
+        this.setting.appConfig = res.data
+      })
+    },
+    getAdminConfig () {
+      console.log('getAdminConfig')
+      return admin().then(res => {
+        this.replaceAdminTitle(res.data.title)
+        this.setting.hello = res.data.hello
+      })
+    },
+    replaceAdminTitle (newTitle) {
+      document.title = document.title.replace(`- ${this.setting.title}`, `- ${newTitle}`)
+      this.setting.title = newTitle
+    },
+    async loadRustdeskConfig () {
+      console.log('loadRustdeskConfig')
+      const res = await server().catch(_ => false)
+      if (res) {
+        this.setting.rustdeskConfig = res.data
+        const prefix = 'wc-'
+        localStorage.setItem(`${prefix}custom-rendezvous-server`, res.data.id_server)
+        localStorage.setItem(`${prefix}key`, res.data.key)
+        localStorage.setItem(`${prefix}api-server`, res.data.api_server)
+      }
+
+    },
  },
 })

@@ -8,15 +8,15 @@ export const useTagsStore = defineStore({
  }),
  actions: {
    initTags () {
-      this.tags.push(
-        {
-          name: 'Home',
-          path: '/Home',
-          title: '首页',
-          active: false,
-          closeable: false,
-          keepAlive: false,
-        })
+      // this.tags.push(
+      //   {
+      //     name: 'Home',
+      //     path: '/Home',
+      //     title: '首页',
+      //     active: false,
+      //     closeable: false,
+      //     keepAlive: false,
+      //   })
    },
    addTag (route) {
      const tags = this.tags
@@ -1,13 +1,16 @@
 import { defineStore, acceptHMRUpdate } from 'pinia'
 import { current, login } from '@/api/user'
-import { setToken, removeToken } from '@/utils/auth'
+import { setToken, removeToken, setCode, removeCode } from '@/utils/auth'
 import { useRouteStore } from '@/store/router'
+import { useAppStore } from '@/store/app'
+import { oidcAuth, oidcQuery } from '@/api/login'

 export const useUserStore = defineStore({
  id: 'user',
  state: () => ({
    nickname: '',
    username: '',
+    email: '',
    token: '',
    role: '',
    avatar: '',
@@ -17,33 +20,42 @@ export const useUserStore = defineStore({
  actions: {
    logout () {
      removeToken()
+      removeCode()
      this.$patch({
        name: '',
        role: {},
      })
    },

+    saveUserData (userData) {
+      // useAppStore().getAppConfig()
+      setToken(userData.token)
+      //
+      localStorage.setItem('user_info', JSON.stringify({ name: userData.username }))
+      this.$patch({
+        ...userData,
+      })
+      if (userData.route_names && userData.route_names.length) {
+        useRouteStore().addRoutes(userData.route_names)
+      }
+    },
+
    async login (form) {
-      const res = await login(form).catch(_ => false)
-      if (res) {
+      const res = await login(form).catch(e => e)
+      console.log('login', res)
+      if (!res.code) {
+        useAppStore().loadConfig()
        const userData = res.data
-        setToken(userData.token)
-        //
-        localStorage.setItem('user_info', JSON.stringify({ name: userData.username }))
-        this.$patch({
-          ...userData,
-        })
-        if (userData.route_names && userData.route_names.length) {
-          useRouteStore().addRoutes(userData.route_names)
-        }
+        this.saveUserData(userData)
        return userData
      } else {
-        return false
+        return Promise.reject(res)
      }
    },
    async info () {
      const res = await current().catch(_ => false)
      if (res) {
+        useAppStore().loadConfig()
        const userData = res.data
        setToken(userData.token)
        this.$patch({
@@ -54,6 +66,41 @@ export const useUserStore = defineStore({
      }
      return false
    },
+    async oidc (provider, platform, browser) {
+      // oidc data need to be implement
+      const data = {
+        deviceInfo: {
+          name: navigator.userAgent, // 使用浏览器的 User-Agent 作为设备名
+          os: platform, // 获取操作系统信息
+          type: 'webadmin', // any vaule
+        },
+        id: `${platform}-${browser}`,
+        op: provider, // 传入的 provider
+        uuid: '',//crypto.randomUUID(), // 自动生成 UUID
+      }
+      const res = await oidcAuth(data).catch(_ => false)
+      if (res) {
+        const { code, url } = res.data
+        setCode(code)
+        if (provider == 'webauth') {
+          window.open(url)
+        } else {
+          window.location.href = url
+        }
+      }
+    },
+    async query (code) {
+      const params = { 'code': code, uuid: '' }
+      const res = await oidcQuery(params).catch(_ => false)
+      if (res) {
+        removeCode()
+        useAppStore().loadConfig()
+        const userData = res.data
+        this.saveUserData(userData)
+        return userData
+      }
+      return false
+    },
  },
 })

@@ -2,19 +2,50 @@ $basicBlack: #000000;
 $basicWhite: #ffffff;

 $primaryColor: #409eff;
-$sideBarWidth: 210px;

 :root {
  --basicBlack: #000000;
  --basicWhite: #ffffff;
  --primaryColor: #409eff;
+  --tag-bg-color: #efefef;
 }

-.list-body{
+body {
+  font-family: system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", "Roboto",
+    "Helvetica Neue", Arial, "Noto Sans", sans-serif;
+}
+
+.list-body {
  margin: 10px 0;
 }

-.dialog-form{
+.dialog-form {
  max-width: 600px;
  margin: 20px auto;
 }
+
+.list-query {
+  .el-select {
+    --el-select-width: 160px;
+  }
+
+  .el-input {
+    --el-input-width: 160px;
+  }
+}
+
+.table-actions {
+  .el-button {
+    margin-top: 5px;
+    margin-bottom: 5px;
+    margin-left: 5px;
+    margin-right: 5px;
+  }
+}
+
+html.dark {
+  /* Custom Dark Background Color */
+  //--el-bg-color: #626aef;
+  --tag-bg-color: #24252b;
+  --basicBlack: #fff;
+}
@@ -1,13 +1,44 @@
 const TokenKey = 'access_token'
+const OidcCode = 'oidc_code'
+const OidcCodeExpiry = 'oidc_code_expiry';

 export function getToken () {
  return localStorage.getItem(TokenKey)
 }

 export function setToken (token) {
+  localStorage.setItem(`wc-option:local:access_token`, token)
  return localStorage.setItem(TokenKey, token)
 }

 export function removeToken () {
  return localStorage.removeItem(TokenKey)
 }
+
+// 设置 code，并存储当前时间戳（单位：毫秒）
+export function setCode(code) {
+  const now = Date.now(); // 当前时间戳（毫秒）
+  const expiry = now + 60 * 1000; // 60 秒后过期
+
+  localStorage.setItem(OidcCode, code); // 存储 code
+  localStorage.setItem(OidcCodeExpiry, expiry); // 存储过期时间戳
+}
+
+// 获取 code，如果已过期则删除并返回 null
+export function getCode() {
+  const expiry = localStorage.getItem(OidcCodeExpiry); // 获取过期时间戳
+  const now = Date.now(); // 当前时间戳
+
+  if (expiry && now > parseInt(expiry)) {
+    // 如果已过期，删除 code 和过期时间
+    removeCode();
+    return null;
+  }
+  return localStorage.getItem(OidcCode); // 返回 code（如果未过期）
+}
+
+// 删除 code 和过期时间
+export function removeCode() {
+  localStorage.removeItem(OidcCode);
+  localStorage.removeItem(OidcCodeExpiry);
+}
@@ -0,0 +1,36 @@
+import Clipboard from 'clipboard'
+import { ElMessage } from 'element-plus'
+import { T } from '@/utils/i18n'
+
+export function handleClipboard (text, event) {
+  const clipboard = new Clipboard(event.target.toString(), {
+    text: () => text,
+  })
+  clipboard.on('success', () => {
+    ElMessage.success(T('CopySuccess'))
+    clipboard.destroy()
+  })
+  clipboard.on('error', () => {
+    ElMessage.error(T('CopyFailed'))
+    clipboard.destroy()
+  })
+  clipboard.onClick(event)
+}
+
+export function copyImage (targetNode) {
+  if (window.getSelection) {
+    // chrome等主流浏览器
+    var selection = window.getSelection()
+    selection.removeAllRanges()
+    var range = document.createRange()
+    range.selectNode(targetNode)
+    selection.addRange(range)
+  } else if (document.body.createTextRange) {
+    console.log('IE')
+    // ie
+    const range = document.body.createTextRange()
+    range.moveToElementText(targetNode)
+    range.select()
+  }
+  document.execCommand('copy')
+}
@@ -1,4 +1,4 @@
-export function get_suffix(filename) {
+export function get_suffix (filename) {
  var pos = filename.lastIndexOf('.')
  var suffix = ''
  if (pos !== -1) {
@@ -7,7 +7,7 @@ export function get_suffix(filename) {
  return suffix
 }

-export function random_string(len) {
+export function random_string (len) {
  len = len || 32
  var chars = 'ABCDEFGHJKMNPQRSTWXYZabcdefhijkmnprstwxyz2345678'
  var maxPos = chars.length
@@ -18,17 +18,52 @@ export function random_string(len) {
  return pwd
 }

-export function random_filename(filename) {
+export function random_filename (filename) {
  var suffix = get_suffix(filename)
  var time = new Date()
  var time2 = new Date('2020/01/01')
  return Math.ceil((time.getTime() - time2.getTime()) / 1000) + '_' + random_string(10) + suffix
 }

-export function utf8_to_b64(str) {
+export function utf8_to_b64 (str) {
  return window.btoa(unescape(encodeURIComponent(str)))
 }

-export function b64_to_utf8(str) {
+export function b64_to_utf8 (str) {
  return decodeURIComponent(escape(window.atob(str)))
 }
+
+export function jsonToCsv (data) {
+  let csv = ''
+  let keys = Object.keys(data[0])
+  csv += keys.join(',') + '\n'
+  data.forEach(row => {
+    csv += keys.map(key => `"${row[key].toString().replaceAll('"', '""')}"`).join(',') + '\n'
+  })
+  return new Blob([csv], { type: 'text/csv' })
+}
+
+export function downBlob (blob, filename) {
+  const url = window.URL.createObjectURL(blob)
+  const a = document.createElement('a')
+  a.href = url
+  a.download = filename
+  document.body.appendChild(a)
+  a.click()
+  setTimeout(() => {
+    window.URL.revokeObjectURL(url)
+    document.body.removeChild(a)
+  })
+}
+
+export function sizeFormat (size) {
+  if (size < 1024) {
+    return size + 'B'
+  } else if (size < 1024 * 1024) {
+    return (size / 1024).toFixed(2) + 'KB'
+  } else if (size < 1024 * 1024 * 1024) {
+    return (size / 1024 / 1024).toFixed(2) + 'MB'
+  } else {
+    return (size / 1024 / 1024 / 1024).toFixed(2) + 'GB'
+  }
+}
@@ -0,0 +1,33 @@
+import en from '@/utils/i18n/en.json'
+import fr from '@/utils/i18n/fr.json'
+import zhCN from '@/utils/i18n/zh_CN.json'
+import ko from '@/utils/i18n/ko.json'
+import ru from '@/utils/i18n/ru.json'
+import es from '@/utils/i18n/es.json'
+import zhTW from '@/utils/i18n/zh_TW.json'
+import { useAppStore } from '@/store/app'
+
+const trans = {
+  'en': en,
+  'fr': fr,
+  'zh-CN': zhCN,
+  'ko': ko,
+  'ru': ru,
+  'es': es,
+  'zh-TW': zhTW,
+}
+export function T (key, params, num = 0) {
+  const appStore = useAppStore()
+  const lang = appStore.setting.lang
+  const tran = trans[lang]?.[key]
+  if (!tran) {
+    return key
+  }
+  const msg = num > 1 ? (tran.Other ? tran.Other : tran.One) : tran.One
+  //msg 是这样 {name} is name
+  //params 是这样 {name: 'zhangsan'}
+  //替换
+  return msg.replace(/{(\w+)}/g, function (match, key) {
+    return params[key] || match
+  })
+}
@@ -0,0 +1,535 @@
+{
+  "Login": {
+    "One": "Login"
+  },
+  "Logout": {
+    "One": "Logout"
+  },
+  "Register": {
+    "One": "Register"
+  },
+  "Confirm": {
+    "One": "Confirm"
+  },
+  "Username": {
+    "One": "Username"
+  },
+  "Password": {
+    "One": "Password"
+  },
+  "LoginSuccess": {
+    "One": "Login Success"
+  },
+  "ForgotPassword": {
+    "One": "Forgot Password"
+  },
+  "ResetPassword": {
+    "One": "Reset Password"
+  },
+  "ChangePassword": {
+    "One": "Change Password"
+  },
+  "Userinfo": {
+    "One": "User Info"
+  },
+  "ParamRequired": {
+    "One": "{param} is required"
+  },
+  "HasBind": {
+    "One": "Has bind"
+  },
+  "NoBind": {
+    "One": "No bind"
+  },
+  "UnBind": {
+    "One": "UnBind"
+  },
+  "ToBind": {
+    "One": "To Bind"
+  },
+  "Confirm?": {
+    "One": "{param} Confirm?"
+  },
+  "Cancel": {
+    "One": "Cancel"
+  },
+  "Platform": {
+    "One": "Platform"
+  },
+  "Status": {
+    "One": "Status"
+  },
+  "Actions": {
+    "One": "Actions"
+  },
+  "Filter": {
+    "One": "Filter"
+  },
+  "Add": {
+    "One": "Add"
+  },
+  "Hostname": {
+    "One": "Hostname"
+  },
+  "Alias": {
+    "One": "Alias"
+  },
+  "Hash": {
+    "One": "Hash"
+  },
+  "Tags": {
+    "One": "Tags"
+  },
+  "Edit": {
+    "One": "Edit"
+  },
+  "Delete": {
+    "One": "Delete"
+  },
+  "Create": {
+    "One": "Create"
+  },
+  "Update": {
+    "One": "Update"
+  },
+  "LoginName": {
+    "One": "Login Name"
+  },
+  "Submit": {
+    "One": "Submit"
+  },
+  "OperationSuccess": {
+    "One": "Operation Success"
+  },
+  "Owner": {
+    "One": "Owner"
+  },
+  "Name": {
+    "One": "Name"
+  },
+  "Color": {
+    "One": "Color"
+  },
+  "CreatedAt": {
+    "One": "Created At"
+  },
+  "UpdatedAt": {
+    "One": "Updated At"
+  },
+  "Memory": {
+    "One": "Memory"
+  },
+  "Os": {
+    "One": "Os"
+  },
+  "Uuid": {
+    "One": "Uuid"
+  },
+  "Version": {
+    "One": "Version"
+  },
+  "Type": {
+    "One": "Type"
+  },
+  "Group": {
+    "One": "Group"
+  },
+  "CommonGroup": {
+    "One": "Common Group"
+  },
+  "CommonGroupNote": {
+    "One": "Only admins can see group members and their devices"
+  },
+  "SharedGroup": {
+    "One": "Shared Group"
+  },
+  "SharedGroupNote": {
+    "One": "All users can see group members and their devices"
+  },
+  "Nickname": {
+    "One": "Nickname"
+  },
+  "UserTags": {
+    "One": "User Tags"
+  },
+  "UserAddressBook": {
+    "One": "User Address Book"
+  },
+  "IsAdmin": {
+    "One": "Is Admin"
+  },
+  "PleaseInputNewPassword": {
+    "One": "Please input new password"
+  },
+  "AutoRegister": {
+    "One": "Auto Register"
+  },
+  "AutoRegisterNote": {
+    "One": "If Enable,An account will be automatically registered when a user logs in with OAuth without binding an existing account"
+  },
+  "ThirdName": {
+    "One": "Third Name"
+  },
+  "Close": {
+    "One": "Close"
+  },
+  "OauthBinding": {
+    "One": "You are authorizing the binding"
+  },
+  "OauthLogining": {
+    "One": "You are authorizing the login"
+  },
+  "OauthCloseNote": {
+    "One": "If it is not authorized by you, please close the page directly"
+  },
+  "OperationSuccessAndCloseAfter3Seconds": {
+    "One": "Operation Success,Close after 3 seconds"
+  },
+  "ConfirmOauth": {
+    "One": "Confirm Oauth"
+  },
+  "Device": {
+    "One": "Device"
+  },
+  "ChangeLang": {
+    "One": "切换中文"
+  },
+  "My": {
+    "One": "My"
+  },
+  "Info": {
+    "One": "Info"
+  },
+  "AddressBooks": {
+    "One": "Address Books"
+  },
+  "System": {
+    "One": "System"
+  },
+  "PeerManage": {
+    "One": "Peers"
+  },
+  "AddressBookManage": {
+    "One": "Address Books"
+  },
+  "GroupManage": {
+    "One": "Groups"
+  },
+  "UserManage": {
+    "One": "Users"
+  },
+  "UserAdd": {
+    "One": "User Add"
+  },
+  "UserEdit": {
+    "One": "User Edit"
+  },
+  "TagsManage": {
+    "One": "Tags"
+  },
+  "OauthManage": {
+    "One": "Oauth"
+  },
+  "LoginLog": {
+    "One": "Login Log"
+  },
+  "LastOnlineTime": {
+    "One": "Last Online Time"
+  },
+  "JustNow": {
+    "One": "Just Now"
+  },
+  "MinutesAgo": {
+    "One": "{param} Minute Ago",
+    "Other": "{param} Minutes Ago"
+  },
+  "HoursAgo": {
+    "One": "{param} Hour Ago",
+    "Other": "{param} Hours Ago"
+  },
+  "DaysAgo": {
+    "One": "{param} Day Ago",
+    "Other": "{param} Days Ago"
+  },
+  "MonthsAgo": {
+    "One": "{param} Month Ago",
+    "Other": "{param} Months Ago"
+  },
+  "YearsAgo": {
+    "One": "{param} Year Ago",
+    "Other": "{param} Years Ago"
+  },
+  "MinutesLess": {
+    "One": "Less than {param} minute",
+    "Other": "Less than {param} minutes"
+  },
+  "HoursLess": {
+    "One": "Less than {param} hour",
+    "Other": "Less than {param} hours"
+  },
+  "DaysLess": {
+    "One": "Less than {param} day",
+    "Other": "Less than {param} days"
+  },
+  "Export": {
+    "One": "Export"
+  },
+  "AddToAddressBook": {
+    "One": "Add To Address Book"
+  },
+  "BatchDelete": {
+    "One": "Batch Delete"
+  },
+  "PleaseSelectData": {
+    "One": "Please select data"
+  },
+  "PasswordType": {
+    "One": "Password Type"
+  },
+  "OncePassword": {
+    "One": "One-time Password"
+  },
+  "FixedPassword": {
+    "One": "Fixed Password"
+  },
+  "FixedPasswordWarning": {
+    "One": "Fixed passwords may be leaked, so please use them with caution and use one-time passwords is recommended"
+  },
+  "ExpireTime": {
+    "One": "Expire Time"
+  },
+  "ShareByWebClient": {
+    "One": "Share By Web Client"
+  },
+  "Minutes": {
+    "One": "{param} Minute",
+    "Other": "{param} Minutes"
+  },
+  "Hours": {
+    "One": "{param} Hour",
+    "Other": "{param} Hours"
+  },
+  "Days": {
+    "One": "{param} Day",
+    "Other": "{param} Days"
+  },
+  "Weeks": {
+    "One": "{param} Week",
+    "Other": "{param} Weeks"
+  },
+  "Months": {
+    "One": "{param} Month",
+    "Other": "{param} Months"
+  },
+  "Forever": {
+    "One": "Forever"
+  },
+  "Error": {
+    "One": "Error"
+  },
+  "IDNotExist": {
+    "One": "ID does not exist"
+  },
+  "RemoteDesktopOffline": {
+    "One": "Remote desktop is offline"
+  },
+  "KeyMismatch": {
+    "One": "Key mismatch"
+  },
+  "KeyOveruse": {
+    "One": "Key overuse"
+  },
+  "Link": {
+    "One": "Link"
+  },
+  "CopySuccess": {
+    "One": "Copy Success"
+  },
+  "CopyFailed": {
+    "One": "Copy Failed"
+  },
+  "Timeout": {
+    "One": "Timeout"
+  },
+  "AuditConnLog": {
+    "One": "Connection Log"
+  },
+  "Peer": {
+    "One": "Peer",
+    "Other": "Peers"
+  },
+  "FromPeer": {
+    "One": "From Peer"
+  },
+  "FromName": {
+    "One": "From Name"
+  },
+  "CloseTime": {
+    "One": "Close Time"
+  },
+  "AuditFileLog": {
+    "One": "File Log"
+  },
+  "Common": {
+    "One": "Common"
+  },
+  "File": {
+    "One": "File"
+  },
+  "Num": {
+    "One": "Num"
+  },
+  "Ip": {
+    "One": "Ip"
+  },
+  "FileName": {
+    "One": "File Name"
+  },
+  "FileInfo": {
+    "One": "File Info"
+  },
+  "Path": {
+    "One": "Path"
+  },
+  "IndexNum": {
+    "One": "Index Num"
+  },
+  "ToRemote": {
+    "One": "To Remote"
+  },
+  "ToLocal": {
+    "One": "To Local"
+  },
+  "AddressBookName": {
+    "One": "Address Book Name"
+  },
+  "AddRule": {
+    "One": "Add Rule"
+  },
+  "ShareRules": {
+    "One": "Share Rules"
+  },
+  "Rule": {
+    "One": "Rule"
+  },
+  "Read": {
+    "One": "Read"
+  },
+  "ReadWrite": {
+    "One": "Read And Write"
+  },
+  "FullControl": {
+    "One": "Full Control"
+  },
+  "ShareTo": {
+    "One": "Share To"
+  },
+  "MyAddressBook": {
+    "One": "My Address Book"
+  },
+  "AddressBook": {
+    "One": "Address Book"
+  },
+  "AddressBookNameManage": {
+    "One": "Address Book Names"
+  },
+  "MyAddressBookTips": {
+    "One": "\"My Address Book\" is the default of the system, cannot be modified or deleted"
+  },
+  "LastOnlineIp": {
+    "One": "Last Online Ip"
+  },
+  "OldPassword": {
+    "One": "Old Password"
+  },
+  "NewPasswordEqualOldPassword": {
+    "One": "New Password cannot be the same as Old Password"
+  },
+  "NewPassword": {
+    "One": "New Password"
+  },
+  "ConfirmPassword": {
+    "One": "Confirm Password"
+  },
+  "PasswordNotMatchConfirmPassword": {
+    "One": "Password not match Confirm Password"
+  },
+  "ToLogin": {
+    "One": "To Login"
+  },
+  "UserToken": {
+    "One": "User Token"
+  },
+  "BatchAddToAB": {
+    "One": "Batch Add To Address Book"
+  },
+  "BatchEditTags": {
+    "One": "Batch Edit Tags"
+  },
+  "User": {
+    "One": "User"
+  },
+  "ShareRecord": {
+    "One": "Share Record"
+  },
+  "Second": {
+    "One": "Second"
+  },
+  "Captcha": {
+    "One": "Captcha"
+  },
+  "ServerCmd": {
+    "One": "Server Cmd"
+  },
+  "Simple": {
+    "One": "Simple"
+  },
+  "Advanced": {
+    "One": "Advanced"
+  },
+  "Available": {
+    "One": "Available"
+  },
+  "NotAvailable": {
+    "One": "Not Available"
+  },
+  "ServerCmdTips": {
+    "One": "This feature is experimental. Please ensure that the API and hbbs and hbbr are on the same loopback address. For more information, please refer to the {wiki}"
+  },
+  "Refresh": {
+    "One": "Refresh"
+  },
+  "Save": {
+    "One": "Save"
+  },
+  "SendCustom": {
+    "One": "Send Custom"
+  },
+  "Send": {
+    "One": "Send"
+  },
+  "SendCmd": {
+    "One": "Send Cmd"
+  },
+  "Result": {
+    "One": "Result"
+  },
+  "DeviceGroupManage": {
+    "One": "Device Group Manage"
+  },
+  "Drop file here or click to upload": {
+    "One": "Drop file here or click to upload"
+  },
+  "Please upload csv file": {
+    "One": "Please upload csv file"
+  },
+  "Columns": {
+    "One": "Columns"
+  },
+  "You can reference export file": {
+    "One": "You can reference export file"
+  },
+  "Remark": {
+    "One": "Remark"
+  }
+}
@@ -0,0 +1,535 @@
+{
+  "Login": {
+    "One": "Iniciar sesión"
+  },
+  "Logout": {
+    "One": "Cerrar sesión"
+  },
+  "Register": {
+    "One": "Registrar"
+  },
+  "Confirm": {
+    "One": "Confirmar"
+  },
+  "Username": {
+    "One": "Nombre de usuario"
+  },
+  "Password": {
+    "One": "Contraseña"
+  },
+  "LoginSuccess": {
+    "One": "Inicio de sesión exitoso"
+  },
+  "ForgotPassword": {
+    "One": "Olvidó su contraseña"
+  },
+  "ResetPassword": {
+    "One": "Restablecer contraseña"
+  },
+  "ChangePassword": {
+    "One": "Cambiar contraseña"
+  },
+  "Userinfo": {
+    "One": "Información del usuario"
+  },
+  "ParamRequired": {
+    "One": "{param} es requerido"
+  },
+  "HasBind": {
+    "One": "Está vinculado"
+  },
+  "NoBind": {
+    "One": "No está vinculado"
+  },
+  "UnBind": {
+    "One": "Desvincular"
+  },
+  "ToBind": {
+    "One": "Vincular"
+  },
+  "Confirm?": {
+    "One": "¿Confirmar {param}?"
+  },
+  "Cancel": {
+    "One": "Cancelar"
+  },
+  "Platform": {
+    "One": "Plataforma"
+  },
+  "Status": {
+    "One": "Estado"
+  },
+  "Actions": {
+    "One": "Acciones"
+  },
+  "Filter": {
+    "One": "Filtrar"
+  },
+  "Add": {
+    "One": "Agregar"
+  },
+  "Hostname": {
+    "One": "Nombre del host"
+  },
+  "Alias": {
+    "One": "Alias"
+  },
+  "Hash": {
+    "One": "Hash"
+  },
+  "Tags": {
+    "One": "Etiquetas"
+  },
+  "Edit": {
+    "One": "Editar"
+  },
+  "Delete": {
+    "One": "Eliminar"
+  },
+  "Create": {
+    "One": "Crear"
+  },
+  "Update": {
+    "One": "Actualizar"
+  },
+  "LoginName": {
+    "One": "Nombre de inicio de sesión"
+  },
+  "Submit": {
+    "One": "Enviar"
+  },
+  "OperationSuccess": {
+    "One": "Operación exitosa"
+  },
+  "Owner": {
+    "One": "Propietario"
+  },
+  "Name": {
+    "One": "Nombre"
+  },
+  "Color": {
+    "One": "Color"
+  },
+  "CreatedAt": {
+    "One": "Creado en"
+  },
+  "UpdatedAt": {
+    "One": "Actualizado en"
+  },
+  "Memory": {
+    "One": "Memoria"
+  },
+  "Os": {
+    "One": "Sistema operativo"
+  },
+  "Uuid": {
+    "One": "Uuid"
+  },
+  "Version": {
+    "One": "Versión"
+  },
+  "Type": {
+    "One": "Tipo"
+  },
+  "Group": {
+    "One": "Grupo"
+  },
+  "CommonGroup": {
+    "One": "Grupo común"
+  },
+  "CommonGroupNote": {
+    "One": "Solo los administradores pueden ver a los miembros del grupo y sus dispositivos"
+  },
+  "SharedGroup": {
+    "One": "Grupo compartido"
+  },
+  "SharedGroupNote": {
+    "One": "Todos los usuarios pueden ver a los miembros del grupo y sus dispositivos"
+  },
+  "Nickname": {
+    "One": "Apodo"
+  },
+  "UserTags": {
+    "One": "Etiquetas de usuario"
+  },
+  "UserAddressBook": {
+    "One": "Libreta de direcciones de usuario"
+  },
+  "IsAdmin": {
+    "One": "Es administrador"
+  },
+  "PleaseInputNewPassword": {
+    "One": "Por favor, introduzca una nueva contraseña"
+  },
+  "AutoRegister": {
+    "One": "Registro automático"
+  },
+  "AutoRegisterNote": {
+    "One": "Si está habilitado, se registrará automáticamente una cuenta cuando un usuario inicie sesión con OAuth sin vincular una cuenta existente"
+  },
+  "ThirdName": {
+    "One": "Nombre tercero"
+  },
+  "Close": {
+    "One": "Cerrar"
+  },
+  "OauthBinding": {
+    "One": "Está autorizando la vinculación"
+  },
+  "OauthLogining": {
+    "One": "Está autorizando el inicio de sesión"
+  },
+  "OauthCloseNote": {
+    "One": "Si no fue autorizado por usted, cierre directamente la página"
+  },
+  "OperationSuccessAndCloseAfter3Seconds": {
+    "One": "Operación exitosa, cierre después de 3 segundos"
+  },
+  "ConfirmOauth": {
+    "One": "Confirmar OAuth"
+  },
+  "Device": {
+    "One": "Dispositivo"
+  },
+  "ChangeLang": {
+    "One": "Cambiar a chino"
+  },
+  "My": {
+    "One": "Mi"
+  },
+  "Info": {
+    "One": "Información"
+  },
+  "AddressBooks": {
+    "One": "Libretas de direcciones"
+  },
+  "System": {
+    "One": "Sistema"
+  },
+  "PeerManage": {
+    "One": "Pares"
+  },
+  "AddressBookManage": {
+    "One": "Libretas de direcciones"
+  },
+  "GroupManage": {
+    "One": "Grupos"
+  },
+  "UserManage": {
+    "One": "Usuarios"
+  },
+  "UserAdd": {
+    "One": "Agregar usuario"
+  },
+  "UserEdit": {
+    "One": "Editar usuario"
+  },
+  "TagsManage": {
+    "One": "Etiquetas"
+  },
+  "OauthManage": {
+    "One": "OAuth"
+  },
+  "LoginLog": {
+    "One": "Registro de inicio de sesión"
+  },
+  "LastOnlineTime": {
+    "One": "Última vez en línea"
+  },
+  "JustNow": {
+    "One": "Justo ahora"
+  },
+  "MinutesAgo": {
+    "One": "Hace {param} minuto",
+    "Other": "Hace {param} minutos"
+  },
+  "HoursAgo": {
+    "One": "Hace {param} hora",
+    "Other": "Hace {param} horas"
+  },
+  "DaysAgo": {
+    "One": "Hace {param} día",
+    "Other": "Hace {param} días"
+  },
+  "MonthsAgo": {
+    "One": "Hace {param} mes",
+    "Other": "Hace {param} meses"
+  },
+  "YearsAgo": {
+    "One": "Hace {param} año",
+    "Other": "Hace {param} años"
+  },
+  "MinutesLess": {
+    "One": "Menos de {param} minuto",
+    "Other": "Menos de {param} minutos"
+  },
+  "HoursLess": {
+    "One": "Menos de {param} hora",
+    "Other": "Menos de {param} horas"
+  },
+  "DaysLess": {
+    "One": "Menos de {param} día",
+    "Other": "Menos de {param} días"
+  },
+  "Export": {
+    "One": "Exportar"
+  },
+  "AddToAddressBook": {
+    "One": "Agregar a la libreta de direcciones"
+  },
+  "BatchDelete": {
+    "One": "Eliminar por lotes"
+  },
+  "PleaseSelectData": {
+    "One": "Por favor, seleccione datos"
+  },
+  "PasswordType": {
+    "One": "Tipo de contraseña"
+  },
+  "OncePassword": {
+    "One": "Contraseña de un solo uso"
+  },
+  "FixedPassword": {
+    "One": "Contraseña fija"
+  },
+  "FixedPasswordWarning": {
+    "One": "Las contraseñas fijas pueden ser filtradas, por favor úselas con precaución. Se recomienda usar contraseñas de un solo uso."
+  },
+  "ExpireTime": {
+    "One": "Tiempo de expiración"
+  },
+  "ShareByWebClient": {
+    "One": "Compartir por cliente web"
+  },
+  "Minutes": {
+    "One": "{param} minuto",
+    "Other": "{param} minutos"
+  },
+  "Hours": {
+    "One": "{param} hora",
+    "Other": "{param} horas"
+  },
+  "Days": {
+    "One": "{param} día",
+    "Other": "{param} días"
+  },
+  "Weeks": {
+    "One": "{param} semana",
+    "Other": "{param} semanas"
+  },
+  "Months": {
+    "One": "{param} mes",
+    "Other": "{param} meses"
+  },
+  "Forever": {
+    "One": "Para siempre"
+  },
+  "Error": {
+    "One": "Error"
+  },
+  "IDNotExist": {
+    "One": "El ID no existe"
+  },
+  "RemoteDesktopOffline": {
+    "One": "El escritorio remoto está fuera de línea"
+  },
+  "KeyMismatch": {
+    "One": "La clave no coincide"
+  },
+  "KeyOveruse": {
+    "One": "Uso excesivo de la clave"
+  },
+  "Link": {
+    "One": "Enlace"
+  },
+  "CopySuccess": {
+    "One": "Copia exitosa"
+  },
+  "CopyFailed": {
+    "One": "Copia fallida"
+  },
+  "Timeout": {
+    "One": "Tiempo de espera agotado"
+  },
+  "AuditConnLog": {
+    "One": "Registro de conexiones"
+  },
+  "Peer": {
+    "One": "Par",
+    "Other": "Pares"
+  },
+  "FromPeer": {
+    "One": "Desde el par"
+  },
+  "FromName": {
+    "One": "Desde el nombre"
+  },
+  "CloseTime": {
+    "One": "Hora de cierre"
+  },
+  "AuditFileLog": {
+    "One": "Registro de archivos"
+  },
+  "Common": {
+    "One": "Común"
+  },
+  "File": {
+    "One": "Archivo"
+  },
+  "Num": {
+    "One": "Número"
+  },
+  "Ip": {
+    "One": "Ip"
+  },
+  "FileName": {
+    "One": "Nombre del archivo"
+  },
+  "FileInfo": {
+    "One": "Información del archivo"
+  },
+  "Path": {
+    "One": "Ruta"
+  },
+  "IndexNum": {
+    "One": "Número de índice"
+  },
+  "ToRemote": {
+    "One": "A remoto"
+  },
+  "ToLocal": {
+    "One": "A local"
+  },
+  "AddressBookName": {
+    "One": "Nombre de la libreta"
+  },
+  "AddRule": {
+    "One": "Agregar regla"
+  },
+  "ShareRules": {
+    "One": "Reglas de compartición"
+  },
+  "Rule": {
+    "One": "Regla"
+  },
+  "Read": {
+    "One": "Leer"
+  },
+  "ReadWrite": {
+    "One": "Leer y escribir"
+  },
+  "FullControl": {
+    "One": "Control total"
+  },
+  "ShareTo": {
+    "One": "Compartir con"
+  },
+  "MyAddressBook": {
+    "One": "Mi libreta de direcciones"
+  },
+  "AddressBook": {
+    "One": "Libreta de direcciones"
+  },
+  "AddressBookNameManage": {
+    "One": "Nombre de la libreta"
+  },
+  "MyAddressBookTips": {
+    "One": "\"Mi libreta de direcciones\" es la predeterminada del sistema, no puede ser modificada ni eliminada."
+  },
+  "LastOnlineIp": {
+    "One": "Última IP en línea"
+  },
+  "OldPassword": {
+    "One": "Contraseña antigua"
+  },
+  "NewPasswordEqualOldPassword": {
+    "One": "La nueva contraseña no puede ser igual a la antigua"
+  },
+  "NewPassword": {
+    "One": "Nueva contraseña"
+  },
+  "ConfirmPassword": {
+    "One": "Confirmar contraseña"
+  },
+  "PasswordNotMatchConfirmPassword": {
+    "One": "La contraseña no coincide con la contraseña de confirmación"
+  },
+  "ToLogin": {
+    "One": "Iniciar sesión"
+  },
+  "UserToken": {
+    "One": "Token del usuario"
+  },
+  "MyPeer": {
+    "One": "Mis pares"
+  },
+  "BatchAddToAB": {
+    "One": "Agregar en bloque a la libreta de direcciones"
+  },
+  "BatchEditTags": {
+    "One": "Editar etiquetas en bloque"
+  },
+  "User": {
+    "One": "Usuario"
+  },
+  "ShareRecord": {
+    "One": "Registro de compartición"
+  },
+  "Second": {
+    "One": "Segundo"
+  },
+  "Captcha": {
+    "One": "Captcha"
+  },
+  "ServerCmd": {
+    "One": "Comando del servidor"
+  },
+  "Simple": {
+    "One": "Simple"
+  },
+  "Advanced": {
+    "One": "Avanzado"
+  },
+  "Available": {
+    "One": "Disponible"
+  },
+  "NotAvailable": {
+    "One": "No disponible"
+  },
+  "ServerCmdTips": {
+    "One": "Esta función es experimental. Asegúrese de que la API y hbbs y hbbr estén en la misma dirección de bucle de retorno. Para obtener más información, consulte el {wiki}"
+  },
+  "Refresh": {
+    "One": "Actualizar"
+  },
+  "Save": {
+    "One": "Guardar"
+  },
+  "SendCustom": {
+    "One": "Enviar personalizado"
+  },
+  "Send": {
+    "One": "Enviar"
+  },
+  "SendCmd": {
+    "One": "Enviar comando"
+  },
+  "Result": {
+    "One": "Resultado"
+  },
+  "Drop file here or click to upload": {
+    "One": "Suelte el archivo aquí o haga clic para cargar"
+  },
+  "Please upload csv file": {
+    "One": "Por favor, suba un archivo csv"
+  },
+  "Columns": {
+    "One": "Columnas"
+  },
+  "You can reference export file": {
+    "One": "Puede hacer referencia al archivo de exportación"
+  },
+  "Remark": {
+    "One": "Remark"
+  }
+}
@@ -0,0 +1,538 @@
+{
+  "Login": {
+    "One": "Connexion"
+  },
+  "Logout": {
+    "One": "Déconnexion"
+  },
+  "Register": {
+    "One": "S'inscrire"
+  },
+  "Confirm": {
+    "One": "Confirmer"
+  },
+  "Username": {
+    "One": "Nom d'utilisateur"
+  },
+  "Password": {
+    "One": "Mot de passe"
+  },
+  "LoginSuccess": {
+    "One": "Connexion réussie"
+  },
+  "ForgotPassword": {
+    "One": "Mot de passe oublié"
+  },
+  "ResetPassword": {
+    "One": "Réinitialiser le mot de passe"
+  },
+  "ChangePassword": {
+    "One": "Modifier le mot de passe"
+  },
+  "Userinfo": {
+    "One": "Informations utilisateur"
+  },
+  "ParamRequired": {
+    "One": "{param} est obligatoire"
+  },
+  "HasBind": {
+    "One": "A une liaison"
+  },
+  "NoBind": {
+    "One": "Aucune liaison"
+  },
+  "UnBind": {
+    "One": "Délier"
+  },
+  "ToBind": {
+    "One": "Lier"
+  },
+  "Confirm?": {
+    "One": "{param} Confirmer?"
+  },
+  "Cancel": {
+    "One": "Annuler"
+  },
+  "Platform": {
+    "One": "Plateforme"
+  },
+  "Status": {
+    "One": "État"
+  },
+  "Actions": {
+    "One": "Actions"
+  },
+  "Filter": {
+    "One": "Filtre"
+  },
+  "Add": {
+    "One": "Ajouter"
+  },
+  "Hostname": {
+    "One": "Nom d'hôte"
+  },
+  "Alias": {
+    "One": "Alias"
+  },
+  "Hash": {
+    "One": "Hachage"
+  },
+  "Tags": {
+    "One": "Etiquettes"
+  },
+  "Edit": {
+    "One": "Modifier"
+  },
+  "Delete": {
+    "One": "Supprimer"
+  },
+  "Create": {
+    "One": "Créer"
+  },
+  "Update": {
+    "One": "Mise à jour"
+  },
+  "LoginName": {
+    "One": "Nom de connexion"
+  },
+  "Submit": {
+    "One": "Envoyer"
+  },
+  "OperationSuccess": {
+    "One": "Opération réussie"
+  },
+  "Owner": {
+    "One": "Propriétaire"
+  },
+  "Name": {
+    "One": "Nom"
+  },
+  "Color": {
+    "One": "Couleur"
+  },
+  "CreatedAt": {
+    "One": "Créé le"
+  },
+  "UpdatedAt": {
+    "One": "Mis à jour le"
+  },
+  "Memory": {
+    "One": "Mémoire"
+  },
+  "Os": {
+    "One": "Os"
+  },
+  "Uuid": {
+    "One": "Uuid"
+  },
+  "Version": {
+    "One": "Version"
+  },
+  "Type": {
+    "One": "Type"
+  },
+  "Group": {
+    "One": "Groupe"
+  },
+  "CommonGroup": {
+    "One": "Groupe commun"
+  },
+  "CommonGroupNote": {
+    "One": "Seuls les administrateurs peuvent voir les membres du groupe et leurs appareils"
+  },
+  "SharedGroup": {
+    "One": "Groupe partagé"
+  },
+  "SharedGroupNote": {
+    "One": "Tous les utilisateurs peuvent voir les membres du groupe et leurs appareils"
+  },
+  "Nickname": {
+    "One": "Pseudonyme"
+  },
+  "UserTags": {
+    "One": "Etiquettes utilisateur"
+  },
+  "UserAddressBook": {
+    "One": "Carnet d'adresses utilisateur"
+  },
+  "IsAdmin": {
+    "One": "Est administrateur"
+  },
+  "PleaseInputNewPassword": {
+    "One": "Veuillez saisir nouveau mot de passe"
+  },
+  "AutoRegister": {
+    "One": "Enregistrement automatique"
+  },
+  "AutoRegisterNote": {
+    "One": "Si activé, un compte sera automatiquement enregistré lorsqu'un utilisateur se connectera avec OAuth sans lier un compte existant"
+  },
+  "ThirdName": {
+    "One": "Troisième nom"
+  },
+  "Close": {
+    "One": "Fermer"
+  },
+  "OauthBinding": {
+    "One": "Vous autorisez la liaison"
+  },
+  "OauthLogining": {
+    "One": "Vous autorisez la connexion"
+  },
+  "OauthCloseNote": {
+    "One": "Si vous ne l'autorisez pas, veuillez fermer la page directement"
+  },
+  "OperationSuccessAndCloseAfter3Seconds": {
+    "One": "Opération réussie, fermer après 3 secondes"
+  },
+  "ConfirmOauth": {
+    "One": "Confirmer Oauth"
+  },
+  "View": {
+    "One": "Informations"
+  },
+  "Device": {
+    "One": "Appareil"
+  },
+  "ChangeLang": {
+    "One": "Changer la langue"
+  },
+  "My": {
+    "One": "Moi"
+  },
+  "Info": {
+    "One": "Info"
+  },
+  "AddressBooks": {
+    "One": "Carnets d'adresses"
+  },
+  "System": {
+    "One": "Système"
+  },
+  "PeerManage": {
+    "One": "Appareils"
+  },
+  "AddressBookManage": {
+    "One": "Carnets d'adresses"
+  },
+  "GroupManage": {
+    "One": "Groupes"
+  },
+  "UserManage": {
+    "One": "Utilisateurs"
+  },
+  "UserAdd": {
+    "One": "Ajout d'utilisateur"
+  },
+  "UserEdit": {
+    "One": "Utilisateur Modifier"
+  },
+  "TagsManage": {
+    "One": "Etiquettes"
+  },
+  "OauthManage": {
+    "One": "Oauth"
+  },
+  "LoginLog": {
+    "One": "Journal de connexion"
+  },
+  "LastOnlineTime": {
+    "One": "Dernière heure de connexion"
+  },
+  "JustNow": {
+    "One": "Juste maintenant"
+  },
+  "MinutesAgo": {
+    "One": "Il y a {param} minute",
+    "Other": "Il y a {param} minutes"
+  },
+  "HoursAgo": {
+    "One": "Il y a {param} heure",
+    "Other": "Il y a {param} heures"
+  },
+  "DaysAgo": {
+    "One": "Il y a {param} jour",
+    "Other": "Il y a {param} jours"
+  },
+  "MonthsAgo": {
+    "One": " Il y a {param} mois",
+    "Autre": "Il y a {param} mois"
+  },
+  "YearsAgo": {
+    "One": "Il y a {param} an",
+    "Autre": "Il y a {param} ans"
+  },
+  "MinutesLess": {
+    "One": "Moins de {param} minute",
+    "Autre": "Moins de {param} minutes"
+  },
+  "HoursLess": {
+    "One": "Moins de {param} heure",
+    "Autre": "Moins de {param} heures"
+  },
+  "DaysLess": {
+    "One": "Moins de {param} jour",
+    "Autre": "Moins de {param} jours"
+  },
+  "Export": {
+    "One": "Exporter"
+  },
+  "AddToAddressBook": {
+    "One": "Ajouter au carnet d'adresses"
+  },
+  "BatchDelete": {
+    "One": "Suppression par lot"
+  },
+  "PleaseSelectData": {
+    "One": "Veuillez sélectionner des données"
+  },
+  "PasswordType": {
+    "One": "Type de mot de passe"
+  },
+  "OncePassword": {
+    "One": "Mot de passe à usage unique"
+  },
+  "FixedPassword": {
+    "One": "Mot de passe fixe"
+  },
+  "FixedPasswordWarning": {
+    "One": "Les mots de passe fixes peuvent être divulgués, veuillez donc les utiliser avec prudence et l'utilisation de mots de passe à usage unique est recommandée"
+  },
+  "ExpireTime": {
+    "One": "Heure d'expiration"
+  },
+  "Minutes": {
+    "One": "{param} Minute",
+    "Other": "{param} Minutes"
+  },
+  "Hours": {
+    "One": "{param} Heure",
+    "Other": "{param} Heures"
+  },
+  "Days": {
+    "One": "{param} Jour",
+    "Other": "{param} Jours"
+  },
+  "Weeks": {
+    "One": "{param} Semaine",
+    "Other": "{param} Semaines"
+  },
+  "Months": {
+    "One": "{param} Mois",
+    "Other": "{param} Mois"
+  },
+  "Forever": {
+    "One": "Forever"
+  },
+  "Error": {
+    "One": "Erreur"
+  },
+  "IDNotExist": {
+    "One": "L'ID n'existe pas"
+  },
+  "RemoteDesktopOffline": {
+    "One": "Le bureau à distance est hors ligne"
+  },
+  "KeyMismatch": {
+    "One": "Non-correspondance de clé"
+  },
+  "KeyOveruse": {
+    "One": "Surutilisation de clé"
+  },
+  "Link": {
+    "One": "Lien"
+  },
+  "CopySuccess": {
+    "One": "Copie réussie"
+  },
+  "CopyFailed": {
+    "One": "Copie échouée"
+  },
+  "Timeout": {
+    "One": "Expiration du délai"
+  },
+  "AuditConnLog": {
+    "One": "Journal de connexion"
+  },
+  "Peer": {
+    "One": "Appareil",
+    "Other": "Appareils distants"
+  },
+  "FromPeer": {
+    "One": "Par Appareil distant"
+  },
+  "FromName": {
+    "One": "Par nom"
+  },
+  "CloseTime": {
+    "One": "Heure de clôture"
+  },
+  "AuditFileLog": {
+    "One": "Fichier Journal"
+  },
+  "Common": {
+    "One": "Commun"
+  },
+  "File": {
+    "One": "Fichier"
+  },
+  "Num": {
+    "One": "Num"
+  },
+  "Ip": {
+    "One": "Ip"
+  },
+  "FileName": {
+    "One": "Nom du fichier"
+  },
+  "FileInfo": {
+    "One": "Informations sur le fichier"
+  },
+  "Path": {
+    "One": "Chemin"
+  },
+  "IndexNum": {
+    "One": "Num. index"
+  },
+  "ToRemote": {
+    "One": "Vers distant"
+  },
+  "ToLocal": {
+    "One": "Vers local"
+  },
+  "AddressBookName": {
+    "One": "Nom du carnet d'adresses"
+  },
+  "AddRule": {
+    "One": "Ajouter une règle"
+  },
+  "ShareRules": {
+    "One": "Partager des règles"
+  },
+  "Rule": {
+    "One": "Règle"
+  },
+  "Read": {
+    "One": "Lecture"
+  },
+  "ReadWrite": {
+    "One": "Lecture et écriture"
+  },
+  "FullControl": {
+    "One": "Contrôle total"
+  },
+  "ShareTo": {
+    "One": "Partager avec"
+  },
+  "MyAddressBook": {
+    "One": "Mon carnet d'adresses"
+  },
+  "AddressBook": {
+    "One": "Carnet d'adresses"
+  },
+  "AddressBookNameManage": {
+    "One": "Noms du carnet d'adresses"
+  },
+  "MyAddressBookTips": {
+    "One": "\"Mon carnet d'adresses\" est la valeur par défaut du système, ne peut pas être modifié ou supprimé"
+  },
+  "LastOnlineIp": {
+    "One": "Dernière adresse IP en ligne"
+  },
+  "OldPassword": {
+    "One": "Ancien mot de passe"
+  },
+  "NewPasswordEqualOldPassword": {
+    "One": "Le nouveau mot de passe est identique à l'ancien mot de passe"
+  },
+  "NewPassword": {
+    "One": "Nouveau mot de passe"
+  },
+  "ConfirmPassword": {
+    "One": "Confirmer le mot de passe"
+  },
+  "PasswordNotMatchConfirmPassword": {
+    "One": "Les mots de passe ne correspondent pas"
+  },
+  "ToLogin": {
+    "One": "Pour se connecter"
+  },
+  "UserToken": {
+    "One": "Jeton Utilisateur"
+  },
+  "Token": {
+    "One": "Jeton"
+  },
+  "MyPeer": {
+    "One": "Mon appareil"
+  },
+  "BatchAddToAB": {
+    "One": "Ajout par lots au carnet d'adresses"
+  },
+  "BatchEditTags": {
+    "One": "Modification par lots des étiquettes"
+  },
+  "User": {
+    "One": "Utilisateur"
+  },
+  "ShareRecord": {
+    "One": "Enregistrement des partages"
+  },
+  "Second": {
+    "One": "Seconde"
+  },
+  "Captcha": {
+    "One": "Captcha"
+  },
+  "ServerCmd": {
+    "One": "Commande serveur"
+  },
+  "Simple": {
+    "One": "Simple"
+  },
+  "Advanced": {
+    "One": "Avancé"
+  },
+  "Available": {
+    "One": "Disponible"
+  },
+  "NotAvailable": {
+    "One": "Non disponible"
+  },
+  "ServerCmdTips": {
+    "One": "Cette fonctionnalité est expérimentale. Veuillez vous assurer que l'API et hbbs et hbbr sont sur la même adresse de boucle locale. Pour plus d'informations, veuillez consulter le {wiki}"
+  },
+  "Refresh": {
+    "One": "Actualiser"
+  },
+  "Save": {
+    "One": "Enregistrer"
+  },
+  "SendCustom": {
+    "One": "Envoyer personnalisé"
+  },
+  "Send": {
+    "One": "Envoyer"
+  },
+  "SendCmd": {
+    "One": "Envoyer Cmd"
+  },
+  "Result": {
+    "One": "Résultat"
+  },
+  "Drop file here or click to upload": {
+    "One": "Déposez le fichier ici ou cliquez pour télécharger"
+  },
+  "Please upload csv file": {
+    "One": "Veuillez télécharger le fichier csv"
+  },
+  "Columns": {
+    "One": "Colonnes"
+  },
+  "You can reference export file": {
+    "One": "Vous pouvez vous référer au fichier d'exportation"
+  },
+  "Remark": {
+    "One": "Remarque"
+  }
+}
@@ -0,0 +1,521 @@
+{
+  "Login": {
+    "One": "로그인"
+  },
+  "Logout": {
+    "One": "로그아웃"
+  },
+  "Register": {
+    "One": "등록"
+  },
+  "Confirm": {
+    "One": "확인"
+  },
+  "Username": {
+    "One": "사용자 이름"
+  },
+  "Password": {
+    "One": "비밀번호"
+  },
+  "LoginSuccess": {
+    "One": "로그인 성공"
+  },
+  "ForgotPassword": {
+    "One": "비밀번호를 잊으셨나요?"
+  },
+  "ResetPassword": {
+    "One": "비밀번호 재설정"
+  },
+  "ChangePassword": {
+    "One": "비밀번호 변경"
+  },
+  "Userinfo": {
+    "One": "사용자 정보"
+  },
+  "ParamRequired": {
+    "One": "{param} 은 필수입니다"
+  },
+  "HasBind": {
+    "One": "이미 연결됨"
+  },
+  "NoBind": {
+    "One": "연결되지 않음"
+  },
+  "UnBind": {
+    "One": "연결 해제"
+  },
+  "ToBind": {
+    "One": "연결"
+  },
+  "Confirm?": {
+    "One": "{param} 를 확인하시겠습니까?"
+  },
+  "Cancel": {
+    "One": "취소"
+  },
+  "Platform": {
+    "One": "플랫폼"
+  },
+  "Status": {
+    "One": "상태"
+  },
+  "Actions": {
+    "One": "작업"
+  },
+  "Filter": {
+    "One": "필터"
+  },
+  "Add": {
+    "One": "추가"
+  },
+  "Hostname": {
+    "One": "호스트 이름"
+  },
+  "Alias": {
+    "One": "별명"
+  },
+  "Hash": {
+    "One": "해시"
+  },
+  "Tags": {
+    "One": "태그"
+  },
+  "Edit": {
+    "One": "편집"
+  },
+  "Delete": {
+    "One": "삭제"
+  },
+  "Create": {
+    "One": "생성"
+  },
+  "Update": {
+    "One": "업데이트"
+  },
+  "LoginName": {
+    "One": "로그인 이름"
+  },
+  "Submit": {
+    "One": "제출"
+  },
+  "OperationSuccess": {
+    "One": "작업 성공"
+  },
+  "Owner": {
+    "One": "소유자"
+  },
+  "Name": {
+    "One": "이름"
+  },
+  "Color": {
+    "One": "색상"
+  },
+  "CreatedAt": {
+    "One": "생성 시간"
+  },
+  "UpdatedAt": {
+    "One": "업데이트 시간"
+  },
+  "Memory": {
+    "One": "메모리"
+  },
+  "Os": {
+    "One": "운영 체제"
+  },
+  "Uuid": {
+    "One": "UUID"
+  },
+  "Version": {
+    "One": "버전"
+  },
+  "Type": {
+    "One": "유형"
+  },
+  "Group": {
+    "One": "그룹"
+  },
+  "CommonGroup": {
+    "One": "일반 그룹"
+  },
+  "CommonGroupNote": {
+    "One": "관리자만 그룹 멤버 및 그들의 장치를 볼 수 있습니다."
+  },
+  "SharedGroup": {
+    "One": "공유 그룹"
+  },
+  "SharedGroupNote": {
+    "One": "모든 사용자가 그룹 멤버 및 그들의 장치를 볼 수 있습니다."
+  },
+  "Nickname": {
+    "One": "닉네임"
+  },
+  "UserTags": {
+    "One": "사용자 태그"
+  },
+  "UserAddressBook": {
+    "One": "사용자 주소록"
+  },
+  "IsAdmin": {
+    "One": "관리자 여부"
+  },
+  "PleaseInputNewPassword": {
+    "One": "새 비밀번호를 입력하십시오"
+  },
+  "AutoRegister": {
+    "One": "자동 등록"
+  },
+  "AutoRegisterNote": {
+    "One": "사용 시, 사용자가 OAuth로 로그인할 때 기존 계정에 연결하지 않고 자동으로 계정이 등록됩니다."
+  },
+  "ThirdName": {
+    "One": "제3자 이름"
+  },
+  "Close": {
+    "One": "닫기"
+  },
+  "OauthBinding": {
+    "One": "바인딩을 허용하고 있습니다."
+  },
+  "OauthLogining": {
+    "One": "로그인을 허용하고 있습니다."
+  },
+  "OauthCloseNote": {
+    "One": "귀하가 시작한 권한 부여가 아닌 경우 페이지를 닫아 주시기 바랍니다."
+  },
+  "OperationSuccessAndCloseAfter3Seconds": {
+    "One": "작업 성공, 3초 후 자동으로 페이지가 닫힙니다."
+  },
+  "ConfirmOauth": {
+    "One": "권한 부여 확인"
+  },
+  "Device": {
+    "One": "장치"
+  },
+  "ChangeLang": {
+    "One": "영어로 변경"
+  },
+  "My": {
+    "One": "내"
+  },
+  "Info": {
+    "One": "정보"
+  },
+  "AddressBooks": {
+    "One": "주소록"
+  },
+  "System": {
+    "One": "시스템"
+  },
+  "PeerManage": {
+    "One": "장치 관리"
+  },
+  "AddressBookManage": {
+    "One": "주소록 관리"
+  },
+  "GroupManage": {
+    "One": "그룹 관리"
+  },
+  "UserManage": {
+    "One": "사용자 관리"
+  },
+  "UserAdd": {
+    "One": "사용자 추가"
+  },
+  "UserEdit": {
+    "One": "사용자 편집"
+  },
+  "TagsManage": {
+    "One": "태그 관리"
+  },
+  "OauthManage": {
+    "One": "Oauth 관리"
+  },
+  "LoginLog": {
+    "One": "로그인 로그"
+  },
+  "LastOnlineTime": {
+    "One": "마지막 온라인 시간"
+  },
+  "JustNow": {
+    "One": "방금"
+  },
+  "MinutesAgo": {
+    "One": "{param} 분 전"
+  },
+  "HoursAgo": {
+    "One": "{param} 시간 전"
+  },
+  "DaysAgo": {
+    "One": "{param} 일 전"
+  },
+  "MonthsAgo": {
+    "One": "{param} 개월 전"
+  },
+  "YearsAgo": {
+    "One": "{param} 년 전"
+  },
+  "MinutesLess": {
+    "One": "{param} 분 이내"
+  },
+  "HoursLess": {
+    "One": "{param} 시간 이내"
+  },
+  "DaysLess": {
+    "One": "{param} 일 이내"
+  },
+  "Export": {
+    "One": "내보내기"
+  },
+  "AddToAddressBook": {
+    "One": "주소록에 추가"
+  },
+  "BatchDelete": {
+    "One": "일괄 삭제"
+  },
+  "PleaseSelectData": {
+    "One": "데이터를 선택하십시오"
+  },
+  "PasswordType": {
+    "One": "비밀번호 유형"
+  },
+  "OncePassword": {
+    "One": "일회용 비밀번호"
+  },
+  "FixedPassword": {
+    "One": "고정 비밀번호"
+  },
+  "FixedPasswordWarning": {
+    "One": "고정 비밀번호는 유출 위험이 있으므로 주의하여 사용하십시오. 일회용 비밀번호를 사용하는 것이 좋습니다."
+  },
+  "ExpireTime": {
+    "One": "만료 시간"
+  },
+  "ShareByWebClient": {
+    "One": "웹 클라이언트를 통해 공유"
+  },
+  "Minutes": {
+    "One": "{param} 분"
+  },
+  "Hours": {
+    "One": "{param} 시간"
+  },
+  "Days": {
+    "One": "{param} 일"
+  },
+  "Weeks": {
+    "One": "{param} 주"
+  },
+  "Months": {
+    "One": "{param} 개월"
+  },
+  "Forever": {
+    "One": "영구"
+  },
+  "Error": {
+    "One": "오류"
+  },
+  "IDNotExist": {
+    "One": "ID가 존재하지 않음"
+  },
+  "RemoteDesktopOffline": {
+    "One": "원격 컴퓨터가 온라인이 아님"
+  },
+  "KeyMismatch": {
+    "One": "키 불일치"
+  },
+  "KeyOveruse": {
+    "One": "키 과다 사용"
+  },
+  "Link": {
+    "One": "링크"
+  },
+  "CopySuccess": {
+    "One": "복사 성공"
+  },
+  "CopyFailed": {
+    "One": "복사 실패"
+  },
+  "Timeout": {
+    "One": "시간 초과"
+  },
+  "AuditConnLog": {
+    "One": "연결 로그"
+  },
+  "Peer": {
+    "One": "장치"
+  },
+  "FromPeer": {
+    "One": "출처 장치"
+  },
+  "FromName": {
+    "One": "출처 이름"
+  },
+  "CloseTime": {
+    "One": "닫는 시간"
+  },
+  "AuditFileLog": {
+    "One": "파일 로그"
+  },
+  "Common": {
+    "One": "일반"
+  },
+  "File": {
+    "One": "파일"
+  },
+  "Num": {
+    "One": "수량"
+  },
+  "Ip": {
+    "One": "IP"
+  },
+  "FileName": {
+    "One": "파일 이름"
+  },
+  "FileInfo": {
+    "One": "파일 정보"
+  },
+  "Path": {
+    "One": "경로"
+  },
+  "IndexNum": {
+    "One": "순번"
+  },
+  "ToRemote": {
+    "One": "원격으로"
+  },
+  "ToLocal": {
+    "One": "로컬로"
+  },
+  "AddressBookName": {
+    "One": "주소록 이름"
+  },
+  "AddRule": {
+    "One": "규칙 추가"
+  },
+  "ShareRules": {
+    "One": "공유 규칙"
+  },
+  "Rule": {
+    "One": "규칙"
+  },
+  "Read": {
+    "One": "읽기"
+  },
+  "ReadWrite": {
+    "One": "읽기/쓰기"
+  },
+  "FullControl": {
+    "One": "전체 제어"
+  },
+  "ShareTo": {
+    "One": "공유 대상"
+  },
+  "MyAddressBook": {
+    "One": "내 주소록"
+  },
+  "AddressBook": {
+    "One": "주소록"
+  },
+  "AddressBookNameManage": {
+    "One": "주소록 이름 관리"
+  },
+  "MyAddressBookTips": {
+    "One": "\"내 주소록\"은 시스템의 기본값이며 수정하거나 삭제할 수 없습니다."
+  },
+  "LastOnlineIp": {
+    "One": "마지막 온라인 IP"
+  },
+  "OldPassword": {
+    "One": "이전 비밀번호"
+  },
+  "NewPasswordEqualOldPassword": {
+    "One": "새 비밀번호는 이전 비밀번호와 같을 수 없습니다"
+  },
+  "NewPassword": {
+    "One": "새 비밀번호"
+  },
+  "ConfirmPassword": {
+    "One": "비밀번호 확인"
+  },
+  "PasswordNotMatchConfirmPassword": {
+    "One": "비밀번호가 확인 비밀번호와 일치하지 않습니다"
+  },
+  "ToLogin": {
+    "One": "로그인하려면 클릭하십시오"
+  },
+  "UserToken": {
+    "One": "사용자 토큰"
+  },
+  "MyPeer": {
+    "One": "내 피어"
+  },
+  "BatchAddToAB": {
+    "One": "주소록에 일괄 추가"
+  },
+  "BatchEditTags": {
+    "One": "태그 일괄 편집"
+  },
+  "User": {
+    "One": "사용자"
+  },
+  "ShareRecord": {
+    "One": "공유 기록"
+  },
+  "Second": {
+    "One": "초"
+  },
+  "Captcha": {
+    "One": "Captcha"
+  },
+  "ServerCmd": {
+    "One": "서버 명령"
+  },
+  "Simple": {
+    "One": "간단"
+  },
+  "Advanced": {
+    "One": "고급"
+  },
+  "Available": {
+    "One": "사용 가능"
+  },
+  "NotAvailable": {
+    "One": "사용 불가"
+  },
+  "ServerCmdTips": {
+    "One": "이 기능은 실험적입니다. API 및 hbbs 및 hbbr이 동일한 루프백 주소에 있는지 확인하십시오. 자세한 내용은 {wiki}를 참조하십시오."
+  },
+  "Refresh": {
+    "One": "새로 고침"
+  },
+  "Save": {
+    "One": "저장"
+  },
+  "SendCustom": {
+    "One": "사용자 정의 전송"
+  },
+  "Send": {
+    "One": "보내기"
+  },
+  "SendCmd": {
+    "One": "명령 보내기"
+  },
+  "Result": {
+    "One": "결과"
+  },
+  "Drop file here or click to upload": {
+    "One": "여기에 파일을 드롭하거나 클릭하여 업로드하십시오"
+  },
+  "Please upload csv file": {
+    "One": "csv 파일을 업로드하십시오"
+  },
+  "Columns": {
+    "One": "열"
+  },
+  "You can reference export file": {
+    "One": "내보내기 파일을 참조할 수 있습니다"
+  },
+  "Remark": {
+    "One": "비고"
+  }
+}
@@ -0,0 +1,539 @@
+{
+  "Login": {
+    "One": "Вход"
+  },
+  "Logout": {
+    "One": "Выход"
+  },
+  "Register": {
+    "One": "Регистрация"
+  },
+  "Confirm": {
+    "One": "Подтвердить"
+  },
+  "Username": {
+    "One": "Имя пользователя"
+  },
+  "Password": {
+    "One": "Пароль"
+  },
+  "LoginSuccess": {
+    "One": "Успешный вход"
+  },
+  "ForgotPassword": {
+    "One": "Забыли пароль"
+  },
+  "ResetPassword": {
+    "One": "Сбросить пароль"
+  },
+  "ChangePassword": {
+    "One": "Сменить пароль"
+  },
+  "Userinfo": {
+    "One": "Данные пользователя"
+  },
+  "ParamRequired": {
+    "One": "Поле {param} обязательно"
+  },
+  "HasBind": {
+    "One": "Связано"
+  },
+  "NoBind": {
+    "One": "Не связано"
+  },
+  "UnBind": {
+    "One": "Отвязать"
+  },
+  "ToBind": {
+    "One": "Привязать"
+  },
+  "Confirm?": {
+    "One": "Подтвердить {param}?"
+  },
+  "Cancel": {
+    "One": "Отмена"
+  },
+  "Platform": {
+    "One": "Платформа"
+  },
+  "Status": {
+    "One": "Статус"
+  },
+  "Actions": {
+    "One": "Действия"
+  },
+  "Filter": {
+    "One": "Фильтр"
+  },
+  "Add": {
+    "One": "Добавить"
+  },
+  "Hostname": {
+    "One": "Имя хоста"
+  },
+  "Alias": {
+    "One": "Псевдоним"
+  },
+  "Hash": {
+    "One": "Хэш"
+  },
+  "Tags": {
+    "One": "Теги"
+  },
+  "Edit": {
+    "One": "Редактировать"
+  },
+  "Delete": {
+    "One": "Удалить"
+  },
+  "Create": {
+    "One": "Создать"
+  },
+  "Update": {
+    "One": "Обновить"
+  },
+  "LoginName": {
+    "One": "Имя для входа"
+  },
+  "Submit": {
+    "One": "Отправить"
+  },
+  "OperationSuccess": {
+    "One": "Операция выполнена успешно"
+  },
+  "Owner": {
+    "One": "Владелец"
+  },
+  "Name": {
+    "One": "Имя"
+  },
+  "Color": {
+    "One": "Цвет"
+  },
+  "CreatedAt": {
+    "One": "Создано"
+  },
+  "UpdatedAt": {
+    "One": "Обновлено"
+  },
+  "Memory": {
+    "One": "Память"
+  },
+  "Os": {
+    "One": "ОС"
+  },
+  "Uuid": {
+    "One": "UUID"
+  },
+  "Version": {
+    "One": "Версия"
+  },
+  "Type": {
+    "One": "Тип"
+  },
+  "Group": {
+    "One": "Группа"
+  },
+  "CommonGroup": {
+    "One": "Общая группа"
+  },
+  "CommonGroupNote": {
+    "One": "Только администраторы могут видеть участников группы и их устройства"
+  },
+  "SharedGroup": {
+    "One": "Общая группа"
+  },
+  "SharedGroupNote": {
+    "One": "Все пользователи могут видеть участников группы и их устройства"
+  },
+  "Nickname": {
+    "One": "Псевдоним"
+  },
+  "UserTags": {
+    "One": "Теги пользователя"
+  },
+  "UserAddressBook": {
+    "One": "Адресная книга пользователя"
+  },
+  "IsAdmin": {
+    "One": "Является администратором"
+  },
+  "PleaseInputNewPassword": {
+    "One": "Пожалуйста, введите новый пароль"
+  },
+  "AutoRegister": {
+    "One": "Авто-регистрация"
+  },
+  "AutoRegisterNote": {
+    "One": "Если включено, аккаунт будет автоматически зарегистрирован, когда пользователь входит через OAuth без привязки к существующему аккаунту"
+  },
+  "ThirdName": {
+    "One": "Название стороннего сервиса"
+  },
+  "Close": {
+    "One": "Закрыть"
+  },
+  "OauthBinding": {
+    "One": "Вы авторизуете привязку"
+  },
+  "OauthLogining": {
+    "One": "Вы авторизуете вход"
+  },
+  "OauthCloseNote": {
+    "One": "Если это не было авторизовано вами, пожалуйста, закройте страницу"
+  },
+  "OperationSuccessAndCloseAfter3Seconds": {
+    "One": "Операция выполнена успешно, закройте через 3 секунды"
+  },
+  "ConfirmOauth": {
+    "One": "Подтвердить Oauth"
+  },
+  "Device": {
+    "One": "Устройство"
+  },
+  "ChangeLang": {
+    "One": "Переключить на китайский"
+  },
+  "My": {
+    "One": "Мой"
+  },
+  "Info": {
+    "One": "Информация"
+  },
+  "AddressBooks": {
+    "One": "Адресные книги"
+  },
+  "System": {
+    "One": "Система"
+  },
+  "PeerManage": {
+    "One": "Пиры"
+  },
+  "AddressBookManage": {
+    "One": "Адресные книги"
+  },
+  "GroupManage": {
+    "One": "Группы"
+  },
+  "UserManage": {
+    "One": "Пользователи"
+  },
+  "UserAdd": {
+    "One": "Добавить пользователя"
+  },
+  "UserEdit": {
+    "One": "Редактировать пользователя"
+  },
+  "TagsManage": {
+    "One": "Теги"
+  },
+  "OauthManage": {
+    "One": "Oauth"
+  },
+  "LoginLog": {
+    "One": "Журнал входов"
+  },
+  "LastOnlineTime": {
+    "One": "Последнее время онлайн"
+  },
+  "JustNow": {
+    "One": "Только что"
+  },
+  "MinutesAgo": {
+    "One": "{param} минуту назад",
+    "Other": "{param} минут назад"
+  },
+  "HoursAgo": {
+    "One": "{param} час назад",
+    "Other": "{param} часов назад"
+  },
+  "DaysAgo": {
+    "One": "{param} день назад",
+    "Other": "{param} дней назад"
+  },
+  "MonthsAgo": {
+    "One": "{param} месяц назад",
+    "Other": "{param} месяцев назад"
+  },
+  "YearsAgo": {
+    "One": "{param} год назад",
+    "Other": "{param} лет назад"
+  },
+  "MinutesLess": {
+    "One": "Менее {param} минуты",
+    "Other": "Менее {param} минут"
+  },
+  "HoursLess": {
+    "One": "Менее {param} часа",
+    "Other": "Менее {param} часов"
+  },
+  "DaysLess": {
+    "One": "Менее {param} дня",
+    "Other": "Менее {param} дней"
+  },
+  "Export": {
+    "One": "Экспорт"
+  },
+  "AddToAddressBook": {
+    "One": "Добавить в адресную книгу"
+  },
+  "BatchDelete": {
+    "One": "Пакетное удаление"
+  },
+  "PleaseSelectData": {
+    "One": "Пожалуйста, выберите данные"
+  },
+  "PasswordType": {
+    "One": "Тип пароля"
+  },
+  "OncePassword": {
+    "One": "Одноразовый пароль"
+  },
+  "FixedPassword": {
+    "One": "Фиксированный пароль"
+  },
+  "FixedPasswordWarning": {
+    "One": "Фиксированные пароли могут быть скомпрометированы, поэтому используйте их с осторожностью; рекомендуется использовать одноразовые пароли"
+  },
+  "ExpireTime": {
+    "One": "Время истечения"
+  },
+  "ShareByWebClient": {
+    "One": "Поделиться через веб-клиент"
+  },
+  "Minutes": {
+    "One": "{param} минута",
+    "Other": "{param} минуты"
+  },
+  "Hours": {
+    "One": "{param} час",
+    "Other": "{param} часа"
+  },
+  "Days": {
+    "One": "{param} день",
+    "Other": "{param} дня"
+  },
+  "Weeks": {
+    "One": "{param} неделя",
+    "Other": "{param} недели"
+  },
+  "Months": {
+    "One": "{param} месяц",
+    "Other": "{param} месяца"
+  },
+  "Forever": {
+    "One": "Навсегда"
+  },
+  "Error": {
+    "One": "Ошибка"
+  },
+  "IDNotExist": {
+    "One": "ID не существует"
+  },
+  "RemoteDesktopOffline": {
+    "One": "Удаленный рабочий стол отключен"
+  },
+  "KeyMismatch": {
+    "One": "Несоответствие ключа"
+  },
+  "KeyOveruse": {
+    "One": "Чрезмерное использование ключа"
+  },
+  "Link": {
+    "One": "Ссылка"
+  },
+  "CopySuccess": {
+    "One": "Копирование успешно"
+  },
+  "CopyFailed": {
+    "One": "Ошибка копирования"
+  },
+  "Timeout": {
+    "One": "Время ожидания истекло"
+  },
+  "AuditConnLog": {
+    "One": "Журнал соединений"
+  },
+  "Peer": {
+    "One": "Партнер",
+    "Other": "Партнеры"
+  },
+  "FromPeer": {
+    "One": "От партнера"
+  },
+  "FromName": {
+    "One": "От имени"
+  },
+  "CloseTime": {
+    "One": "Время закрытия"
+  },
+  "AuditFileLog": {
+    "One": "Журнал файлов"
+  },
+  "Common": {
+    "One": "Общий"
+  },
+  "File": {
+    "One": "Файл"
+  },
+  "Num": {
+    "One": "Номер"
+  },
+  "Ip": {
+    "One": "IP"
+  },
+  "FileName": {
+    "One": "Имя файла"
+  },
+  "FileInfo": {
+    "One": "Информация о файле"
+  },
+  "Path": {
+    "One": "Путь"
+  },
+  "IndexNum": {
+    "One": "Индексный номер"
+  },
+  "ToRemote": {
+    "One": "К удаленному"
+  },
+  "ToLocal": {
+    "One": "К локальному"
+  },
+  "AddressBookName": {
+    "One": "Имя адресной книги"
+  },
+  "AddRule": {
+    "One": "Добавить правило"
+  },
+  "ShareRules": {
+    "One": "Правила обмена"
+  },
+  "Rule": {
+    "One": "Правило"
+  },
+  "Read": {
+    "One": "Чтение"
+  },
+  "ReadWrite": {
+    "One": "Чтение и запись"
+  },
+  "FullControl": {
+    "One": "Полный доступ"
+  },
+  "ShareTo": {
+    "One": "Поделиться с"
+  },
+  "MyAddressBook": {
+    "One": "Моя адресная книга"
+  },
+  "AddressBook": {
+    "One": "Адресная книга"
+  },
+  "AddressBookNameManage": {
+    "One": "Имена адресных книг"
+  },
+  "MyAddressBookTips": {
+    "One": "«Моя адресная книга» является стандартным для системы, не может быть изменена или удалена"
+  },
+  "LastOnlineIp": {
+    "One": "Последний IP онлайн"
+  },
+  "OldPassword": {
+    "One": "Старый пароль"
+  },
+  "NewPasswordEqualOldPassword": {
+    "One": "Новый пароль совпадает со старым паролем"
+  },
+  "NewPassword": {
+    "One": "Новый пароль"
+  },
+  "ConfirmPassword": {
+    "One": "Подтвердите пароль"
+  },
+  "PasswordNotMatchConfirmPassword": {
+    "One": "Пароль и подтверждение пароля не совпадают"
+  },
+  "ToLogin": {
+    "One": "Войти"
+  },
+  "UserToken": {
+    "One": "Токен пользователя"
+  },
+  "MyPeer": {
+    "One": "Мои партнеры"
+  },
+  "BatchAddToAB": {
+    "One": "Пакетное добавление в адресную книгу"
+  },
+  "BatchEditTags": {
+    "One": "Пакетное редактирование тегов"
+  },
+  "User": {
+    "One": "Пользователь"
+  },
+  "ShareRecord": {
+    "One": "Запись обмена"
+  },
+  "Second": {
+    "One": "Секунда"
+  },
+  "Captcha": {
+    "One": "Captcha"
+  },
+  "ServerCmd": {
+    "One": "Команда сервера"
+  },
+  "Simple": {
+    "One": "Простой"
+  },
+  "Advanced": {
+    "One": "Расширенный"
+  },
+  "Available": {
+    "One": "Доступно"
+  },
+  "NotAvailable": {
+    "One": "Недоступно"
+  },
+  "ServerCmdTips": {
+    "One": "Эта функция экспериментальная. Пожалуйста, убедитесь, что API и hbbs и hbbr находятся на одном адресе обратной петли. Для получения дополнительной информации обратитесь к {wiki}"
+  },
+  "Refresh": {
+    "One": "Обновить"
+  },
+  "Save": {
+    "One": "Сохранить"
+  },
+  "SendCustom": {
+    "One": "Отправить настраиваемое"
+  },
+  "Send": {
+    "One": "Отправить"
+  },
+  "SendCmd": {
+    "One": "Отправить команду"
+  },
+  "Result": {
+    "One": "Результат"
+  },
+  "DeviceGroupManage": {
+    "One": "Группы устройств"
+  },
+  "Drop file here or click to upload": {
+    "One": "Перетащите файл сюда или нажмите, чтобы загрузить"
+  },
+  "Please upload csv file": {
+    "One": "Пожалуйста, загрузите файл csv"
+  },
+  "Columns": {
+    "One": "Столбцы"
+  },
+  "You can reference export file": {
+    "One": "Вы можете ссылаться на экспортируемый файл"
+  },
+  "Remark": {
+    "One": "Примечание"
+  }
+}
+
@@ -0,0 +1,551 @@
+{
+  "Login": {
+    "One": "登录"
+  },
+  "Logout": {
+    "One": "退出登录"
+  },
+  "Register": {
+    "One": "注册"
+  },
+  "Confirm": {
+    "One": "确认"
+  },
+  "Username": {
+    "One": "用户名"
+  },
+  "Password": {
+    "One": "密码"
+  },
+  "LoginSuccess": {
+    "One": "登录成功"
+  },
+  "ForgotPassword": {
+    "One": "忘记密码"
+  },
+  "ResetPassword": {
+    "One": "重置密码"
+  },
+  "ChangePassword": {
+    "One": "修改密码"
+  },
+  "Userinfo": {
+    "One": "用户信息"
+  },
+  "ParamRequired": {
+    "One": "{param} 是必须的"
+  },
+  "HasBind": {
+    "One": "已绑定"
+  },
+  "NoBind": {
+    "One": "未绑定"
+  },
+  "UnBind": {
+    "One": "解绑"
+  },
+  "ToBind": {
+    "One": "绑定"
+  },
+  "Confirm?": {
+    "One": "确定{param}?"
+  },
+  "Cancel": {
+    "One": "取消"
+  },
+  "Platform": {
+    "One": "平台"
+  },
+  "Status": {
+    "One": "状态"
+  },
+  "Actions": {
+    "One": "操作"
+  },
+  "Filter": {
+    "One": "筛选"
+  },
+  "Add": {
+    "One": "添加"
+  },
+  "Hostname": {
+    "One": "主机名"
+  },
+  "Alias": {
+    "One": "别名"
+  },
+  "Hash": {
+    "One": "哈希"
+  },
+  "Tags": {
+    "One": "标签"
+  },
+  "Edit": {
+    "One": "编辑"
+  },
+  "Delete": {
+    "One": "删除"
+  },
+  "Create": {
+    "One": "创建"
+  },
+  "Update": {
+    "One": "更新"
+  },
+  "LoginName": {
+    "One": "登录名"
+  },
+  "Submit": {
+    "One": "提交"
+  },
+  "OperationSuccess": {
+    "One": "操作成功"
+  },
+  "Owner": {
+    "One": "所有者"
+  },
+  "Name": {
+    "One": "名称"
+  },
+  "Color": {
+    "One": "颜色"
+  },
+  "CreatedAt": {
+    "One": "创建时间"
+  },
+  "UpdatedAt": {
+    "One": "更新时间"
+  },
+  "Memory": {
+    "One": "内存"
+  },
+  "Os": {
+    "One": "操作系统"
+  },
+  "Uuid": {
+    "One": "UUID"
+  },
+  "Version": {
+    "One": "版本"
+  },
+  "Type": {
+    "One": "类型"
+  },
+  "Group": {
+    "One": "组"
+  },
+  "CommonGroup": {
+    "One": "普通组"
+  },
+  "CommonGroupNote": {
+    "One": "只有管理员才能查看群组成员及其设备"
+  },
+  "SharedGroup": {
+    "One": "共享组"
+  },
+  "SharedGroupNote": {
+    "One": "所有用户都可以查看群组成员及其设备"
+  },
+  "Nickname": {
+    "One": "昵称"
+  },
+  "UserTags": {
+    "One": "用户标签"
+  },
+  "UserAddressBook": {
+    "One": "用户地址簿"
+  },
+  "IsAdmin": {
+    "One": "是否管理员"
+  },
+  "PleaseInputNewPassword": {
+    "One": "请输入新密码"
+  },
+  "AutoRegister": {
+    "One": "自动注册"
+  },
+  "AutoRegisterNote": {
+    "One": "如果启用，则当用户使用 OAuth 登录时，将自动注册一个帐户，而无需绑定现有帐户"
+  },
+  "ThirdName": {
+    "One": "第三方名称"
+  },
+  "Close": {
+    "One": "关闭"
+  },
+  "OauthBinding": {
+    "One": "您正在授权绑定"
+  },
+  "OauthLogining": {
+    "One": "您正在授权登录"
+  },
+  "OauthCloseNote": {
+    "One": "如不是您发起的授权，请直接关闭页面"
+  },
+  "OperationSuccessAndCloseAfter3Seconds": {
+    "One": "操作成功，3秒后将自动关闭页面"
+  },
+  "ConfirmOauth": {
+    "One": "确认授权"
+  },
+  "Device": {
+    "One": "设备"
+  },
+  "ChangeLang": {
+    "One": "ToEnglish"
+  },
+  "My": {
+    "One": "我的"
+  },
+  "Info": {
+    "One": "信息"
+  },
+  "AddressBooks": {
+    "One": "地址簿"
+  },
+  "System": {
+    "One": "系统"
+  },
+  "PeerManage": {
+    "One": "设备管理"
+  },
+  "AddressBookManage": {
+    "One": "地址簿管理"
+  },
+  "GroupManage": {
+    "One": "群组管理"
+  },
+  "UserManage": {
+    "One": "用户管理"
+  },
+  "UserAdd": {
+    "One": "用户添加"
+  },
+  "UserEdit": {
+    "One": "用户编辑"
+  },
+  "TagsManage": {
+    "One": "标签管理"
+  },
+  "OauthManage": {
+    "One": "Oauth管理"
+  },
+  "LoginLog": {
+    "One": "登录日志"
+  },
+  "LastOnlineTime": {
+    "One": "最后在线时间"
+  },
+  "JustNow": {
+    "One": "刚刚"
+  },
+  "MinutesAgo": {
+    "One": "{param} 分钟前"
+  },
+  "HoursAgo": {
+    "One": "{param} 小时前"
+  },
+  "DaysAgo": {
+    "One": "{param} 天前"
+  },
+  "MonthsAgo": {
+    "One": "{param} 月前"
+  },
+  "YearsAgo": {
+    "One": "{param} 年前"
+  },
+  "MinutesLess": {
+    "One": "{param} 分钟内"
+  },
+  "HoursLess": {
+    "One": "{param} 小时内"
+  },
+  "DaysLess": {
+    "One": "{param} 天内"
+  },
+  "Export": {
+    "One": "导出"
+  },
+  "AddToAddressBook": {
+    "One": "添加到地址簿"
+  },
+  "BatchDelete": {
+    "One": "批量删除"
+  },
+  "PleaseSelectData": {
+    "One": "请选择数据"
+  },
+  "PasswordType": {
+    "One": "密码类型"
+  },
+  "OncePassword": {
+    "One": "一次性密码"
+  },
+  "FixedPassword": {
+    "One": "固定密码"
+  },
+  "FixedPasswordWarning": {
+    "One": "固定密码可能存在泄露风险，请谨慎使用，建议使用一次性密码"
+  },
+  "ExpireTime": {
+    "One": "过期时间"
+  },
+  "ShareByWebClient": {
+    "One": "通过 Web Client 分享"
+  },
+  "Minutes": {
+    "One": "{param} 分钟"
+  },
+  "Hours": {
+    "One": "{param} 小时"
+  },
+  "Days": {
+    "One": "{param} 天"
+  },
+  "Weeks": {
+    "One": "{param} 周"
+  },
+  "Months": {
+    "One": "{param} 月"
+  },
+  "Forever": {
+    "One": "永久"
+  },
+  "Error": {
+    "One": "错误"
+  },
+  "IDNotExist": {
+    "One": "ID 不存在"
+  },
+  "RemoteDesktopOffline": {
+    "One": "远程电脑不在线"
+  },
+  "KeyMismatch": {
+    "One": "KEY不匹配"
+  },
+  "KeyOveruse": {
+    "One": "KEY使用过度"
+  },
+  "Link": {
+    "One": "链接"
+  },
+  "CopySuccess": {
+    "One": "复制成功"
+  },
+  "CopyFailed": {
+    "One": "复制失败"
+  },
+  "Timeout": {
+    "One": "超时"
+  },
+  "AuditConnLog": {
+    "One": "连接日志"
+  },
+  "Peer": {
+    "One": "设备"
+  },
+  "FromPeer": {
+    "One": "来源设备"
+  },
+  "FromName": {
+    "One": "来源名称"
+  },
+  "CloseTime": {
+    "One": "关闭时间"
+  },
+  "AuditFileLog": {
+    "One": "文件日志"
+  },
+  "Common": {
+    "One": "普通"
+  },
+  "File": {
+    "One": "文件"
+  },
+  "Num": {
+    "One": "数量"
+  },
+  "Ip": {
+    "One": "IP"
+  },
+  "FileName": {
+    "One": "文件名"
+  },
+  "FileInfo": {
+    "One": "文件信息"
+  },
+  "Path": {
+    "One": "路径"
+  },
+  "IndexNum": {
+    "One": "序号"
+  },
+  "ToRemote": {
+    "One": "到远程"
+  },
+  "ToLocal": {
+    "One": "到本地"
+  },
+  "AddressBookName": {
+    "One": "地址簿名称"
+  },
+  "AddressBookCollection": {
+    "One": "地址簿集"
+  },
+  "AddRule": {
+    "One": "添加规则"
+  },
+  "ShareRules": {
+    "One": "分享规则"
+  },
+  "Rule": {
+    "One": "规则"
+  },
+  "Read": {
+    "One": "读取"
+  },
+  "ReadWrite": {
+    "One": "读写"
+  },
+  "FullControl": {
+    "One": "完全控制"
+  },
+  "ShareTo": {
+    "One": "分享给"
+  },
+  "MyAddressBook": {
+    "One": "我的地址簿"
+  },
+  "AddressBook": {
+    "One": "地址簿"
+  },
+  "AddressBookNameManage": {
+    "One": "地址簿名称"
+  },
+  "MyAddressBookTips": {
+    "One": "\"我的地址簿\"是系统默认，不可修改、删除"
+  },
+  "LastOnlineIp": {
+    "One": "最后在线IP"
+  },
+  "or login in with": {
+    "One": "或使用以下登陆"
+  },
+  "Optional, default is": {
+    "One": "可选, 默认值是"
+  },
+  "Check your IdP docs, without": {
+    "One": "检查IdP的文档, 不包含"
+  },
+  "For OIDC login without a password, enter any 4-20 letters": {
+    "One": "如果通过 OIDC 登录且未设置密码，请输入任意 4-20 个字符"
+  },
+  "OldPassword": {
+    "One": "旧密码"
+  },
+  "NewPassword": {
+    "One": "新密码"
+  },
+  "NewPasswordEqualOldPassword": {
+    "One": "新密码不能与旧密码相同"
+  },
+  "ConfirmPassword": {
+    "One": "确认密码"
+  },
+  "PasswordNotMatchConfirmPassword": {
+    "One": "密码与确认密码不匹配"
+  },
+  "ToLogin": {
+    "One": "去登录"
+  },
+  "UserToken": {
+    "One": "用户Token"
+  },
+  "Email": {
+    "One": "邮箱"
+  },
+  "MyPeer": {
+    "One": "我的设备"
+  },
+  "View": {
+    "One": "查看"
+  },
+  "Information": {
+    "One": "信息"
+  },
+  "BatchAddToAB": {
+    "One": "批量添加到地址簿"
+  },
+  "BatchEditTags": {
+    "One": "批量编辑标签"
+  },
+  "User": {
+    "One": "用户"
+  },
+  "ShareRecord": {
+    "One": "分享记录"
+  },
+  "Second": {
+    "One": "秒"
+  },
+  "Captcha": {
+    "One": "验证码"
+  },
+  "ServerCmd": {
+    "One": "服务端命令"
+  },
+  "Simple": {
+    "One": "简单"
+  },
+  "Advanced": {
+    "One": "高级"
+  },
+  "Available": {
+    "One": "可用"
+  },
+  "NotAvailable": {
+    "One": "不可用"
+  },
+  "ServerCmdTips": {
+    "One": "此处功能为实验性质，请确保api和 hbbs/hbbr 处于同一回环地址下，更多说明请参考 {wiki}"
+  },
+  "Refresh": {
+    "One": "刷新"
+  },
+  "Save": {
+    "One": "保存"
+  },
+  "SendCustom": {
+    "One": "发送自定义"
+  },
+  "Send": {
+    "One": "发送"
+  },
+  "SendCmd": {
+    "One": "发送命令"
+  },
+  "Result": {
+    "One": "结果"
+  },
+  "DeviceGroupManage": {
+    "One": "设备组管理"
+  },
+  "Import": {
+    "One": "导入"
+  },
+  "Drop file here or click to upload": {
+    "One": "将文件拖到此处或单击上传"
+  },
+  "Please upload csv file": {
+    "One": "请上传csv文件"
+  },
+  "Columns": {
+    "One": "列"
+  },
+  "You can reference export file": {
+    "One": "您可以参考导出文件"
+  },
+  "Remark": {
+    "One": "备注"
+  }
+}
@@ -0,0 +1,551 @@
+{
+  "Login": {
+    "One": "登入"
+  },
+  "Logout": {
+    "One": "退出登入"
+  },
+  "Register": {
+    "One": "註冊"
+  },
+  "Confirm": {
+    "One": "確認"
+  },
+  "Username": {
+    "One": "使用者名稱"
+  },
+  "Password": {
+    "One": "密碼"
+  },
+  "LoginSuccess": {
+    "One": "登入成功"
+  },
+  "ForgotPassword": {
+    "One": "忘記密碼"
+  },
+  "ResetPassword": {
+    "One": "重置密碼"
+  },
+  "ChangePassword": {
+    "One": "修改密碼"
+  },
+  "Userinfo": {
+    "One": "使用者資訊"
+  },
+  "ParamRequired": {
+    "One": "{param} 是必須的"
+  },
+  "HasBind": {
+    "One": "已繫結"
+  },
+  "NoBind": {
+    "One": "未繫結"
+  },
+  "UnBind": {
+    "One": "解綁"
+  },
+  "ToBind": {
+    "One": "繫結"
+  },
+  "Confirm?": {
+    "One": "確定{param}?"
+  },
+  "Cancel": {
+    "One": "取消"
+  },
+  "Platform": {
+    "One": "平臺"
+  },
+  "Status": {
+    "One": "狀態"
+  },
+  "Actions": {
+    "One": "操作"
+  },
+  "Filter": {
+    "One": "篩選"
+  },
+  "Add": {
+    "One": "新增"
+  },
+  "Hostname": {
+    "One": "主機名"
+  },
+  "Alias": {
+    "One": "別名"
+  },
+  "Hash": {
+    "One": "雜湊"
+  },
+  "Tags": {
+    "One": "標籤"
+  },
+  "Edit": {
+    "One": "編輯"
+  },
+  "Delete": {
+    "One": "刪除"
+  },
+  "Create": {
+    "One": "建立"
+  },
+  "Update": {
+    "One": "更新"
+  },
+  "LoginName": {
+    "One": "登入名"
+  },
+  "Submit": {
+    "One": "提交"
+  },
+  "OperationSuccess": {
+    "One": "操作成功"
+  },
+  "Owner": {
+    "One": "所有者"
+  },
+  "Name": {
+    "One": "名稱"
+  },
+  "Color": {
+    "One": "顏色"
+  },
+  "CreatedAt": {
+    "One": "建立時間"
+  },
+  "UpdatedAt": {
+    "One": "更新時間"
+  },
+  "Memory": {
+    "One": "記憶體"
+  },
+  "Os": {
+    "One": "作業系統"
+  },
+  "Uuid": {
+    "One": "UUID"
+  },
+  "Version": {
+    "One": "版本"
+  },
+  "Type": {
+    "One": "型別"
+  },
+  "Group": {
+    "One": "組"
+  },
+  "CommonGroup": {
+    "One": "普通組"
+  },
+  "CommonGroupNote": {
+    "One": "只有管理員才能檢視群組成員及其裝置"
+  },
+  "SharedGroup": {
+    "One": "共享組"
+  },
+  "SharedGroupNote": {
+    "One": "所有使用者都可以檢視群組成員及其裝置"
+  },
+  "Nickname": {
+    "One": "暱稱"
+  },
+  "UserTags": {
+    "One": "使用者標籤"
+  },
+  "UserAddressBook": {
+    "One": "使用者地址簿"
+  },
+  "IsAdmin": {
+    "One": "是否管理員"
+  },
+  "PleaseInputNewPassword": {
+    "One": "請輸入新密碼"
+  },
+  "AutoRegister": {
+    "One": "自動註冊"
+  },
+  "AutoRegisterNote": {
+    "One": "如果啟用，則當用戶使用 OAuth 登入時，將自動註冊一個帳戶，而無需繫結現有帳戶"
+  },
+  "ThirdName": {
+    "One": "第三方名稱"
+  },
+  "Close": {
+    "One": "關閉"
+  },
+  "OauthBinding": {
+    "One": "您正在授權繫結"
+  },
+  "OauthLogining": {
+    "One": "您正在授權登入"
+  },
+  "OauthCloseNote": {
+    "One": "如不是您發起的授權，請直接關閉頁面"
+  },
+  "OperationSuccessAndCloseAfter3Seconds": {
+    "One": "操作成功，3秒後將自動關閉頁面"
+  },
+  "ConfirmOauth": {
+    "One": "確認授權"
+  },
+  "Device": {
+    "One": "裝置"
+  },
+  "ChangeLang": {
+    "One": "ToEnglish"
+  },
+  "My": {
+    "One": "我的"
+  },
+  "Info": {
+    "One": "資訊"
+  },
+  "AddressBooks": {
+    "One": "地址簿"
+  },
+  "System": {
+    "One": "系統"
+  },
+  "PeerManage": {
+    "One": "裝置管理"
+  },
+  "AddressBookManage": {
+    "One": "地址簿管理"
+  },
+  "GroupManage": {
+    "One": "群組管理"
+  },
+  "UserManage": {
+    "One": "使用者管理"
+  },
+  "UserAdd": {
+    "One": "使用者新增"
+  },
+  "UserEdit": {
+    "One": "使用者編輯"
+  },
+  "TagsManage": {
+    "One": "標籤管理"
+  },
+  "OauthManage": {
+    "One": "Oauth 管理"
+  },
+  "LoginLog": {
+    "One": "登入日誌"
+  },
+  "LastOnlineTime": {
+    "One": "最後線上時間"
+  },
+  "JustNow": {
+    "One": "剛剛"
+  },
+  "MinutesAgo": {
+    "One": "{param} 分鐘前"
+  },
+  "HoursAgo": {
+    "One": "{param} 小時前"
+  },
+  "DaysAgo": {
+    "One": "{param} 天前"
+  },
+  "MonthsAgo": {
+    "One": "{param} 月前"
+  },
+  "YearsAgo": {
+    "One": "{param} 年前"
+  },
+  "MinutesLess": {
+    "One": "{param} 分鐘內"
+  },
+  "HoursLess": {
+    "One": "{param} 小時內"
+  },
+  "DaysLess": {
+    "One": "{param} 天內"
+  },
+  "Export": {
+    "One": "匯出"
+  },
+  "AddToAddressBook": {
+    "One": "新增到地址簿"
+  },
+  "BatchDelete": {
+    "One": "批量刪除"
+  },
+  "PleaseSelectData": {
+    "One": "請選擇資料"
+  },
+  "PasswordType": {
+    "One": "密碼型別"
+  },
+  "OncePassword": {
+    "One": "一次性密碼"
+  },
+  "FixedPassword": {
+    "One": "固定密碼"
+  },
+  "FixedPasswordWarning": {
+    "One": "固定密碼可能存在洩露風險，請謹慎使用，建議使用一次性密碼"
+  },
+  "ExpireTime": {
+    "One": "過期時間"
+  },
+  "ShareByWebClient": {
+    "One": "通過 Web Client 分享"
+  },
+  "Minutes": {
+    "One": "{param} 分鐘"
+  },
+  "Hours": {
+    "One": "{param} 小時"
+  },
+  "Days": {
+    "One": "{param} 天"
+  },
+  "Weeks": {
+    "One": "{param} 周"
+  },
+  "Months": {
+    "One": "{param} 月"
+  },
+  "Forever": {
+    "One": "永久"
+  },
+  "Error": {
+    "One": "錯誤"
+  },
+  "IDNotExist": {
+    "One": "ID 不存在"
+  },
+  "RemoteDesktopOffline": {
+    "One": "遠端電腦不線上"
+  },
+  "KeyMismatch": {
+    "One": "KEY 不匹配"
+  },
+  "KeyOveruse": {
+    "One": "KEY 使用過度"
+  },
+  "Link": {
+    "One": "連結"
+  },
+  "CopySuccess": {
+    "One": "複製成功"
+  },
+  "CopyFailed": {
+    "One": "複製失敗"
+  },
+  "Timeout": {
+    "One": "超時"
+  },
+  "AuditConnLog": {
+    "One": "連線日誌"
+  },
+  "Peer": {
+    "One": "裝置"
+  },
+  "FromPeer": {
+    "One": "來源裝置"
+  },
+  "FromName": {
+    "One": "來源名稱"
+  },
+  "CloseTime": {
+    "One": "關閉時間"
+  },
+  "AuditFileLog": {
+    "One": "檔案日誌"
+  },
+  "Common": {
+    "One": "普通"
+  },
+  "File": {
+    "One": "檔案"
+  },
+  "Num": {
+    "One": "數量"
+  },
+  "Ip": {
+    "One": "IP"
+  },
+  "FileName": {
+    "One": "檔名"
+  },
+  "FileInfo": {
+    "One": "檔案資訊"
+  },
+  "Path": {
+    "One": "路徑"
+  },
+  "IndexNum": {
+    "One": "序號"
+  },
+  "ToRemote": {
+    "One": "到遠端"
+  },
+  "ToLocal": {
+    "One": "到本地"
+  },
+  "AddressBookName": {
+    "One": "地址簿名稱"
+  },
+  "AddressBookCollection": {
+    "One": "地址簿集"
+  },
+  "AddRule": {
+    "One": "新增規則"
+  },
+  "ShareRules": {
+    "One": "分享規則"
+  },
+  "Rule": {
+    "One": "規則"
+  },
+  "Read": {
+    "One": "讀取"
+  },
+  "ReadWrite": {
+    "One": "讀寫"
+  },
+  "FullControl": {
+    "One": "完全控制"
+  },
+  "ShareTo": {
+    "One": "分享給"
+  },
+  "MyAddressBook": {
+    "One": "我的地址簿"
+  },
+  "AddressBook": {
+    "One": "地址簿"
+  },
+  "AddressBookNameManage": {
+    "One": "地址簿名稱"
+  },
+  "MyAddressBookTips": {
+    "One": "\"我的地址簿\"是系統預設，不可修改、刪除"
+  },
+  "LastOnlineIp": {
+    "One": "最後線上 IP"
+  },
+  "or login in with": {
+    "One": "或使用以下登陸"
+  },
+  "Optional, default is": {
+    "One": "可選, 預設值是"
+  },
+  "Check your IdP docs, without": {
+    "One": "檢查 IdP 的文件, 不包含"
+  },
+  "For OIDC login without a password, enter any 4-20 letters": {
+    "One": "如果通過 OIDC 登入且未設定密碼，請輸入任意 4-20 個字元"
+  },
+  "OldPassword": {
+    "One": "舊密碼"
+  },
+  "NewPassword": {
+    "One": "新密碼"
+  },
+  "NewPasswordEqualOldPassword": {
+    "One": "新密碼不能與舊密碼相同"
+  },
+  "ConfirmPassword": {
+    "One": "確認密碼"
+  },
+  "PasswordNotMatchConfirmPassword": {
+    "One": "密碼與確認密碼不匹配"
+  },
+  "ToLogin": {
+    "One": "去登入"
+  },
+  "UserToken": {
+    "One": "使用者 Token"
+  },
+  "Email": {
+    "One": "電子信箱"
+  },
+  "MyPeer": {
+    "One": "我的裝置"
+  },
+  "View": {
+    "One": "檢視"
+  },
+  "Information": {
+    "One": "資訊"
+  },
+  "BatchAddToAB": {
+    "One": "批量新增到地址簿"
+  },
+  "BatchEditTags": {
+    "One": "批量編輯標籤"
+  },
+  "User": {
+    "One": "使用者"
+  },
+  "ShareRecord": {
+    "One": "分享記錄"
+  },
+  "Second": {
+    "One": "秒"
+  },
+  "Captcha": {
+    "One": "驗證碼"
+  },
+  "ServerCmd": {
+    "One": "服務端命令"
+  },
+  "Simple": {
+    "One": "簡單"
+  },
+  "Advanced": {
+    "One": "高階"
+  },
+  "Available": {
+    "One": "可用"
+  },
+  "NotAvailable": {
+    "One": "不可用"
+  },
+  "ServerCmdTips": {
+    "One": "此處功能為實驗性質，請確保 API 和 hbbs/hbbr 處於同一迴環地址下，更多說明請參考 {wiki}"
+  },
+  "Refresh": {
+    "One": "重新整理"
+  },
+  "Save": {
+    "One": "儲存"
+  },
+  "SendCustom": {
+    "One": "傳送自定義"
+  },
+  "Send": {
+    "One": "傳送"
+  },
+  "SendCmd": {
+    "One": "傳送命令"
+  },
+  "Result": {
+    "One": "結果"
+  },
+  "DeviceGroupManage": {
+    "One": "設備組管理"
+  },
+  "Import": {
+    "One": "導入"
+  },
+  "Drop file here or click to upload": {
+    "One": "將檔案拖到這裡，或點擊上傳"
+  },
+  "Please upload csv file": {
+    "One": "請上傳 csv 檔案"
+  },
+  "Columns": {
+    "One": "欄位"
+  },
+  "You can reference export file": {
+    "One": "您可以參考匯出檔案"
+  },
+  "Remark": {
+    "One": "備註"
+  }
+}
@@ -0,0 +1,9 @@
+export const connectByClient = (id) => {
+  //不新开窗口打开url protocol ,格式是 rustdesk://<id>
+  // window.open(`rustdesk://${row.id}`)
+  let a = document.createElement('a')
+  a.href = `rustdesk://${id}`
+  a.target = '_self'
+  a.click()
+
+}
@@ -3,6 +3,7 @@ import { ElMessage } from 'element-plus'
 import { getToken, removeToken } from '@/utils/auth'
 import { useUserStore } from '@/store/user'
 import { pinia } from '@/store'
+import { useAppStore } from '@/store/app'

 // create an axios instance
 const service = axios.create({
@@ -14,15 +15,23 @@ const service = axios.create({
 // request interceptor
 service.interceptors.request.use(
  config => {
+    if (!config.headers) {
+      config.headers = {}
+    }
    const userStore = useUserStore(pinia)

    const token = userStore.token || getToken()
    if (token) {
-      if (!config.headers) {
-        config.headers = {}
-      }
      config.headers['api-token'] = token
    }
+
+    const app = useAppStore()
+    const lang = app.setting.lang
+    if (lang) {
+      // console.log('lang', lang)
+      config.headers['Accept-Language'] = lang
+    }
+
    return config
  },
  error => {
@@ -46,6 +55,12 @@ service.interceptors.response.use(
  response => {
    const res = response.data

+    // for the endpoint /login-options
+    // I'm not sure if this is a good idea
+    if (Array.isArray(res)) {
+      return res;
+    }
+
    // if the custom code is not 20000, it is judged as an error.
    if (res.code !== 0) {
      ElMessage({
@@ -58,7 +73,7 @@ service.interceptors.response.use(
        removeToken()
        window.location.reload()
      }
-      return Promise.reject(res.message || 'error')
+      return Promise.reject(res)
    } else {
      return res
    }
@@ -66,7 +81,7 @@ service.interceptors.response.use(
  error => {
    if (error.code === 'ECONNABORTED'
      && error.message.indexOf('timeout') > -1) {
-      error.message = '请求超时！'
+      error.message = 'Connection Time Out!'
    }
    ElMessage({
      message: error.message,
@@ -0,0 +1,47 @@
+import { T } from '@/utils/i18n'
+
+export function timeAgo (time) {
+  let now = new Date().getTime()
+  let after = new Date(time).getTime()
+  let dis = now - after
+  if (dis < 60 * 1000) {
+    return T('JustNow')
+  } else if (dis < 60 * 60 * 1000) {
+    const num = Math.floor(dis / (60 * 1000))
+    return T('MinutesAgo', { param: num }, num)
+  } else if (dis < 24 * 60 * 60 * 1000) {
+    const num = Math.floor(dis / (60 * 60 * 1000))
+    return T('HoursAgo', { param: num }, num)
+  } else if (dis < 30 * 24 * 60 * 60 * 1000) {
+    const num = Math.floor(dis / (24 * 60 * 60 * 1000))
+    return T('DaysAgo', { param: num }, num)
+  } else if (dis < 12 * 30 * 24 * 60 * 60 * 1000) {
+    const num = Math.floor(dis / (30 * 24 * 60 * 60 * 1000))
+    return T('MonthsAgo', { param: num }, num)
+  } else {
+    const num = Math.floor(dis / (12 * 30 * 24 * 60 * 60 * 1000))
+    return T('YearsAgo', { param: num }, num)
+  }
+}
+
+export function formatTime (unix, format = 'yyyy-MM-dd hh:mm:ss') {
+  let date = new Date(unix)
+  let o = {
+    'M+': date.getMonth() + 1,
+    'd+': date.getDate(),
+    'h+': date.getHours(),
+    'm+': date.getMinutes(),
+    's+': date.getSeconds(),
+    'q+': Math.floor((date.getMonth() + 3) / 3),
+    S: date.getMilliseconds(),
+  }
+  if (/(y+)/.test(format)) {
+    format = format.replace(RegExp.$1, (date.getFullYear() + '').substr(4 - RegExp.$1.length))
+  }
+  for (let k in o) {
+    if (new RegExp('(' + k + ')').test(format)) {
+      format = format.replace(RegExp.$1, RegExp.$1.length === 1 ? o[k] : ('00' + o[k]).substr(('' + o[k]).length))
+    }
+  }
+  return format
+}
@@ -1,26 +1,98 @@
-import { ref } from 'vue'
-import { config } from '@/api/rustdesk'
+import Websock from '@/utils/webclient/websock'
+import * as rendezvous from '@/utils/webclient/rendezvous'
+import * as message from '@/utils/webclient/message'
+import { ElMessageBox } from 'element-plus'
+import { T } from '@/utils/i18n'
+import { useAppStore } from '@/store/app'
+
+
+
+const app = useAppStore()

 export const toWebClientLink = (row) => {
-  window.open(`${rustdeskConfig.value.api_server}/webclient/#/?id=${row.id}`)
+  //v2
+  console.log(app.setting.rustdeskConfig)
+  window.open(`${app.setting.rustdeskConfig.api_server}/webclient2/#/${row.id}`)
 }

-export function loadRustdeskConfig () {
-  const rustdeskConfig = ref({})
-  const fetchConfig = async () => {
-    const res = await config().catch(_ => false)
-    if (res) {
-      rustdeskConfig.value = res.data
-      localStorage.setItem('custom-rendezvous-server', res.data.id_server)
-      localStorage.setItem('key', res.data.key)
-      localStorage.setItem('api-server', res.data.api_server)
+export async function getPeerSlat (id) {
+  const [addr, port] = app.setting.rustdeskConfig.id_server.split(':')
+  if (!addr) {
+    return
+  }
+  const scheme = location.protocol === 'https:' ? 'wss' : 'ws'
+  const ws = new Websock(`${scheme}://${addr}:21118`, true)
+  await ws.open()
+  const conn_type = rendezvous.ConnType.DEFAULT_CONN
+  const nat_type = rendezvous.NatType.SYMMETRIC
+  const punch_hole_request = rendezvous.PunchHoleRequest.fromPartial({
+    id,
+    licence_key: app.setting.rustdeskConfig.value.key || undefined,
+    conn_type,
+    nat_type,
+    token: undefined,
+  })
+  ws.sendRendezvous({ punch_hole_request })
+  //rendezvous.RendezvousMessage
+  const msg = (await ws.next())
+  ws.close()
+  console.log(new Date() + ': Got relay response', msg)
+  const phr = msg.punch_hole_response
+  const rr = msg.relay_response
+  if (phr) {
+    if (phr?.other_failure) {
+      this.msgbox('error', 'Error', phr?.other_failure)
+      return
    }
+    if (phr.failure != rendezvous.PunchHoleResponse_Failure.UNRECOGNIZED) {
+      switch (phr?.failure) {
+        case rendezvous.PunchHoleResponse_Failure.ID_NOT_EXIST:
+          ElMessageBox.alert(T('IDNotExist'), T('Error'))
+          break
+        case rendezvous.PunchHoleResponse_Failure.OFFLINE:
+          ElMessageBox.alert(T('RemoteDesktopOffline'), T('Error'))
+          break
+        case rendezvous.PunchHoleResponse_Failure.LICENSE_MISMATCH:
+          ElMessageBox.alert(T('KeyMismatch'), T('Error'))
+          break
+        case rendezvous.PunchHoleResponse_Failure.LICENSE_OVERUSE:
+          ElMessageBox.alert(T('KeyOveruse'), T('Error'))
+          break
+      }
+    }
+    return false
+  } else if (rr) {
+    const uuid = rr.uuid
+    console.log(new Date() + ': Connecting to relay server')
+
+    const _ws = new Websock(`${scheme}://${addr}:21119`, false)
+    await _ws.open()
+    console.log(new Date() + ': Connected to relay server')
+    const request_relay = rendezvous.RequestRelay.fromPartial({
+      licence_key: app.setting.rustdeskConfig.key || undefined,
+      uuid,
+    })
+    _ws.sendRendezvous({ request_relay })
+
+    //暂不支持pk
+    const public_key = message.PublicKey.fromPartial({})
+    _ws?.sendMessage({ public_key })
+    // const secure = (await this.secure(pk)) || false;
+    // globals.pushEvent("connection_ready", { secure, direct: false });
+    while (true) {
+      const msg = (await _ws?.next())
+      console.log('msg', msg)
+      if (msg?.hash) {
+        console.log('hash msg.....', msg.hash)
+        _ws.close()
+        return msg.hash
+      }
+    }
+    return false
  }
-  if (rustdeskConfig.value.id_server === undefined || rustdeskConfig.value.key === undefined) {
-    fetchConfig()
-  }
-  return {
-    rustdeskConfig,
-  }
+
+}
+
+export function getV2ShareUrl (token) {
+  return `${app.setting.rustdeskConfig.api_server}/webclient2/#/?share_token=${token}`
 }
-const { rustdeskConfig } = loadRustdeskConfig()
@@ -0,0 +1,183 @@
+import * as message from "./message.js";
+import * as rendezvous from "./rendezvous.js";
+
+type Keys = "message" | "open" | "close" | "error";
+
+export default class Websock {
+  _websocket: WebSocket;
+  _eventHandlers: { [key in Keys]: Function };
+  _buf: (rendezvous.RendezvousMessage | message.Message)[];
+  _status: any;
+  _latency: number;
+  _secretKey: [Uint8Array, number, number] | undefined;
+  _uri: string;
+  _isRendezvous: boolean;
+
+  constructor(uri: string, isRendezvous: boolean = true) {
+    this._eventHandlers = {
+      message: (_: any) => {},
+      open: () => {},
+      close: () => {},
+      error: () => {},
+    };
+    this._uri = uri;
+    this._status = "";
+    this._buf = [];
+    this._websocket = new WebSocket(uri);
+    this._websocket.onmessage = this._recv_message.bind(this);
+    this._websocket.binaryType = "arraybuffer";
+    this._latency = new Date().getTime();
+    this._isRendezvous = isRendezvous;
+  }
+
+  latency(): number {
+    return this._latency;
+  }
+
+  setSecretKey(key: Uint8Array) {
+    this._secretKey = [key, 0, 0];
+  }
+
+  sendMessage(json: message.DeepPartial<message.Message>) {
+    let data = message.Message.encode(
+      message.Message.fromPartial(json)
+    ).finish();
+    // let k = this._secretKey;
+    // if (k) {
+    //   k[1] += 1;
+    //   data = globals.encrypt(data, k[1], k[0]);
+    // }
+    this._websocket.send(data);
+  }
+
+  sendRendezvous(data: rendezvous.DeepPartial<rendezvous.RendezvousMessage>) {
+    this._websocket.send(
+      rendezvous.RendezvousMessage.encode(
+        rendezvous.RendezvousMessage.fromPartial(data)
+      ).finish()
+    );
+  }
+
+  parseMessage(data: Uint8Array) {
+    return message.Message.decode(data);
+  }
+
+  parseRendezvous(data: Uint8Array) {
+    return rendezvous.RendezvousMessage.decode(data);
+  }
+
+  // Event Handlers
+  off(evt: Keys) {
+    this._eventHandlers[evt] = () => {};
+  }
+
+  on(evt: Keys, handler: Function) {
+    this._eventHandlers[evt] = handler;
+  }
+
+  async open(timeout: number = 12000): Promise<Websock> {
+    return new Promise((resolve, reject) => {
+      setTimeout(() => {
+        if (this._status != "open") {
+          reject(this._status || "Timeout");
+        }
+      }, timeout);
+      this._websocket.onopen = () => {
+        this._latency = new Date().getTime() - this._latency;
+        this._status = "open";
+        console.debug(">> WebSock.onopen");
+        if (this._websocket?.protocol) {
+          console.info(
+            "Server choose sub-protocol: " + this._websocket.protocol
+          );
+        }
+
+        this._eventHandlers.open();
+        console.info("WebSock.onopen");
+        resolve(this);
+      };
+      this._websocket.onclose = (e) => {
+        if (this._status == "open") {
+          // e.code 1000 means that the connection was closed normally.
+          //
+        }
+        this._status = e;
+        console.error("WebSock.onclose: ");
+        console.error(e);
+        this._eventHandlers.close(e);
+        reject("Reset by the peer");
+      };
+      this._websocket.onerror = (e: any) => {
+        if (!this._status) {
+          reject("Failed to connect to " + (this._isRendezvous ? "rendezvous" : "relay") + " server");
+          return;
+        }
+        this._status = e;
+        console.error("WebSock.onerror: ")
+        console.error(e);
+        this._eventHandlers.error(e);
+      };
+    });
+  }
+
+  async next(
+    timeout = 12000
+  ): Promise<rendezvous.RendezvousMessage | message.Message> {
+    const func = (
+      resolve: (value: rendezvous.RendezvousMessage | message.Message) => void,
+      reject: (reason: any) => void,
+      tm0: number
+    ) => {
+      // console.log('next')
+      if (this._buf.length) {
+        resolve(this._buf[0]);
+        this._buf.splice(0, 1);
+      } else {
+        if (this._status != "open") {
+          reject(this._status);
+          return;
+        }
+        if (new Date().getTime() > tm0 + timeout) {
+          reject("Timeout");
+        } else {
+          setTimeout(() => func(resolve, reject, tm0), 1);
+        }
+      }
+    };
+    return new Promise((resolve, reject) => {
+      func(resolve, reject, new Date().getTime());
+    });
+  }
+
+  close() {
+    this._status = "";
+    if (this._websocket) {
+      if (
+        this._websocket.readyState === WebSocket.OPEN ||
+        this._websocket.readyState === WebSocket.CONNECTING
+      ) {
+        console.info("Closing WebSocket connection");
+        this._websocket.close();
+      }
+
+      this._websocket.onmessage = () => {};
+    }
+  }
+
+  _recv_message(e: any) {
+    if (e.data instanceof window.ArrayBuffer) {
+      let bytes = new Uint8Array(e.data);
+      // const k = this._secretKey;
+      // if (k) {
+      //   k[2] += 1;
+      //   bytes = globals.decrypt(bytes, k[2], k[0]);
+      // }
+      this._buf.push(
+        this._isRendezvous
+          ? this.parseRendezvous(bytes)
+          : this.parseMessage(bytes)
+      );
+    }
+    this._eventHandlers.message(e.data);
+  }
+}
@@ -0,0 +1,100 @@
+import { reactive, ref } from 'vue'
+import { list as admin_list, create as admin_create, update as admin_update, remove as admin_remove } from '@/api/address_book_collection'
+import { list as my_list, create as my_create, update as my_update, remove as my_remove } from '@/api/my/address_book_collection'
+import { ElMessage, ElMessageBox } from 'element-plus'
+import { T } from '@/utils/i18n'
+
+const apis = {
+  admin: { list: admin_list, remove: admin_remove, update: admin_update, create: admin_create },
+  my: { list: my_list, remove: my_remove, create: my_create, update: my_update },
+}
+
+export function useRepositories (api_type = 'my') {
+  const listRes = reactive({
+    list: [], total: 0, loading: false,
+  })
+  const listQuery = reactive({
+    page: 1,
+    page_size: 10,
+    name: null,
+    user_id: null,
+  })
+
+  const getList = async () => {
+    listRes.loading = true
+    const res = await apis[api_type].list(listQuery).catch(_ => false)
+    listRes.loading = false
+    if (res) {
+      listRes.list = res.data.list
+      listRes.total = res.data.total
+    }
+  }
+  const handlerQuery = () => {
+    if (listQuery.page === 1) {
+      getList()
+    } else {
+      listQuery.page = 1
+    }
+  }
+
+  const del = async (row) => {
+    const cf = await ElMessageBox.confirm(T('Confirm?', { param: T('Delete') }), {
+      confirmButtonText: T('Confirm'),
+      cancelButtonText: T('Cancel'),
+      type: 'warning',
+    }).catch(_ => false)
+    if (!cf) {
+      return false
+    }
+
+    const res = await apis[api_type].remove({ id: row.id }).catch(_ => false)
+    if (res) {
+      ElMessage.success(T('OperationSuccess'))
+      getList()
+    }
+  }
+
+  const formVisible = ref(false)
+  const formData = reactive({
+    id: 0,
+    name: '',
+  })
+
+  const toEdit = (row) => {
+    formVisible.value = true
+    //将row中的数据赋值给formData
+    Object.keys(formData).forEach(key => {
+      formData[key] = row[key]
+    })
+
+  }
+  const toAdd = () => {
+    formVisible.value = true
+    //重置formData
+    Object.keys(formData).forEach(key => {
+      formData[key] = undefined
+    })
+
+  }
+  const submit = async () => {
+    const api = formData.id ? apis[api_type].update : apis[api_type].create
+    const res = await api(formData).catch(_ => false)
+    if (res) {
+      ElMessage.success(T('OperationSuccess'))
+      formVisible.value = false
+      getList()
+    }
+  }
+  return {
+    listRes,
+    listQuery,
+    getList,
+    handlerQuery,
+    del,
+    formVisible,
+    formData,
+    toEdit,
+    toAdd,
+    submit,
+  }
+}
@@ -0,0 +1,122 @@
+<template>
+  <div>
+    <el-card class="list-query" shadow="hover">
+      <el-form inline label-width="80px">
+        <el-form-item :label="T('Owner')">
+          <el-select v-model="listQuery.user_id" clearable>
+            <el-option
+                v-for="item in allUsers"
+                :key="item.id"
+                :label="item.username"
+                :value="item.id"
+            ></el-option>
+          </el-select>
+        </el-form-item>
+        <el-form-item>
+          <el-button type="primary" @click="handlerQuery">{{ T('Filter') }}</el-button>
+          <el-button type="danger" @click="toAdd">{{ T('Add') }}</el-button>
+        </el-form-item>
+      </el-form>
+    </el-card>
+    <el-card class="list-body" shadow="hover">
+      <el-table :data="listRes.list" v-loading="listRes.loading" border>
+        <el-table-column prop="id" label="ID" align="center"/>
+        <el-table-column prop="user_id" :label="T('Owner')" align="center">
+          <template #default="{row}">
+            <span v-if="row.user_id"> <el-tag>{{ allUsers?.find(u => u.id === row.user_id)?.username }}</el-tag> </span>
+          </template>
+        </el-table-column>
+        <el-table-column prop="name" :label="T('AddressBook')" align="center"/>
+        <el-table-column prop="created_at" :label="T('CreatedAt')" align="center"/>
+        <!--        <el-table-column prop="updated_at" label="更新时间" align="center"/>-->
+        <el-table-column :label="T('Actions')" align="center" class-name="table-actions" width="600" fixed="right">
+          <template #default="{row}">
+            <el-button type="primary" @click="showRules(row)">{{ T('ShareRules') }}</el-button>
+            <el-button @click="toEdit(row)">{{ T('Edit') }}</el-button>
+            <el-button type="danger" @click="del(row)">{{ T('Delete') }}</el-button>
+          </template>
+        </el-table-column>
+      </el-table>
+    </el-card>
+    <el-card class="list-page" shadow="hover">
+      <el-pagination background
+                     layout="prev, pager, next, sizes, jumper"
+                     :page-sizes="[10,20,50,100]"
+                     v-model:page-size="listQuery.page_size"
+                     v-model:current-page="listQuery.page"
+                     :total="listRes.total">
+      </el-pagination>
+    </el-card>
+    <el-dialog v-model="formVisible" width="800" :title="!formData.id?T('Create') :T('Update') ">
+      <el-form class="dialog-form" ref="form" :model="formData" label-width="120px">
+        <el-form-item :label="T('Owner')" prop="user_id" required>
+          <el-select v-model="formData.user_id">
+            <el-option
+                v-for="item in allUsers"
+                :key="item.id"
+                :label="item.username"
+                :value="item.id"
+            ></el-option>
+          </el-select>
+        </el-form-item>
+        <el-form-item :label="T('Name')" prop="name" required>
+          <el-input v-model="formData.name"></el-input>
+        </el-form-item>
+        <el-form-item>
+          <el-button @click="formVisible = false">{{ T('Cancel') }}</el-button>
+          <el-button @click="submit" type="primary">{{ T('Submit') }}</el-button>
+        </el-form-item>
+      </el-form>
+    </el-dialog>
+    <el-dialog v-model="rulesVisible" :title="T('ShareRules')" destroy-on-close top="5vh" width="80%">
+      <Rule :collection="clickRow" :is_my="0"></Rule>
+    </el-dialog>
+
+  </div>
+</template>
+
+<script setup>
+  import { T } from '@/utils/i18n'
+  import { ref } from 'vue'
+  import { useRepositories } from '@/views/address_book/collection'
+  import { onActivated, onMounted, watch } from 'vue'
+  import Rule from '@/views/address_book/rule.vue'
+  import { loadAllUsers } from '@/global'
+
+  const { allUsers, getAllUsers } = loadAllUsers()
+  getAllUsers()
+  const {
+    listRes,
+    listQuery,
+    getList,
+    handlerQuery,
+    del,
+    formVisible,
+    formData,
+    toEdit,
+    toAdd,
+    submit,
+  } = useRepositories('admin')
+
+  listQuery.is_my = 0
+
+  onMounted(getList)
+  onActivated(getList)
+
+  watch(() => listQuery.page, getList)
+
+  watch(() => listQuery.page_size, handlerQuery)
+
+  const clickRow = ref({})
+  const rulesVisible = ref(false)
+  const showRules = (row) => {
+    clickRow.value = row
+    rulesVisible.value = true
+    console.log('showRules')
+  }
+
+</script>
+
+<style scoped lang="scss">
+
+</style>
@@ -0,0 +1,148 @@
+<template>
+  <el-form ref="shareform" :model="formData" label-width="120px" label-suffix=" :">
+    <el-form-item :label="T('ID')" prop="id" required>
+      {{ formData.id }}
+    </el-form-item>
+    <!--    <el-form-item :label="T('PasswordType')">
+          <div>
+            <el-radio-group v-model="formData.password_type" @change="changePwdType">
+              <el-radio value="once">{{ T('OncePassword') }}</el-radio>
+              <el-radio value="fixed">{{ T('FixedPassword') }}</el-radio>
+            </el-radio-group>
+            <div v-if="formData.password_type==='fixed'" style="color: red">
+              {{ T('FixedPasswordWarning') }}
+            </div>
+          </div>
+        </el-form-item>-->
+    <el-form-item :label="T('Password')" prop="password" required>
+      <el-input v-model="formData.password" type="password" show-password></el-input>
+    </el-form-item>
+    <el-form-item :label="T('ExpireTime')" prop="expire" required>
+      <el-select v-model="formData.expire">
+        <el-option
+            v-for="item in expireTimes"
+            :key="item.value"
+            :label="item.label"
+            :value="item.value"
+        ></el-option>
+      </el-select>
+    </el-form-item>
+    <el-form-item v-if="link" :label="T('Link')">
+      <el-input v-model="link" readonly>
+        <template #append>
+          <el-button :icon="CopyDocument" @click="copyLink"/>
+        </template>
+      </el-input>
+    </el-form-item>
+    <el-form-item>
+      <el-button v-if="!link" @click="cancel">{{ T('Cancel') }}</el-button>
+      <el-button v-if="!link" :loading="loading" @click="submitShare" type="primary">{{ T('Submit') }}</el-button>
+      <el-button v-else @click="cancel" type="success">{{ T('Close') }}</el-button>
+    </el-form-item>
+  </el-form>
+</template>
+
+<script setup>
+  import { T } from '@/utils/i18n'
+  import { computed, reactive, ref, watch } from 'vue'
+  import { getV2ShareUrl } from '@/utils/webclient'
+  import * as sha256 from 'fast-sha256'
+  import { shareByWebClient } from '@/api/address_book'
+  import { CopyDocument } from '@element-plus/icons'
+  import { handleClipboard } from '@/utils/clipboard'
+  import { ElMessageBox } from 'element-plus'
+
+  const props = defineProps({
+    id: String,
+    hash: String,
+  })
+  const emits = defineEmits(['cancel', 'success'])
+  const formData = reactive({
+    id: props.id,
+    password_type: 'once',
+    password: '',
+    expire: 1800,
+    hash: props.hash,
+  })
+  watch(() => props.id, () => {
+    init()
+  })
+  const init = () => {
+    console.log('init')
+    formData.id = props.id
+    formData.hash = props.hash
+    formData.password = ''
+    formData.expire = 1800
+    formData.password_type = 'once'
+    link.value = ''
+  }
+  const link = ref('')
+  const expireTimes = computed(() => [
+    { label: T('Minutes', { param: 5 }, 5), value: 300 },
+    { label: T('Minutes', { param: 30 }, 30), value: 1800 },
+    { label: T('Hours', { param: 1 }, 1), value: 3600 },
+    { label: T('Days', { param: 1 }, 1), value: 86400 },
+    { label: T('Weeks', { param: 1 }, 1), value: 604800 },
+    { label: T('Months', { param: 1 }, 1), value: 2592000 },
+    { label: T('Forever'), value: 0 },
+  ])
+  const changePwdType = (val) => {
+    if (val === 'fixed' && !formData.password) {
+      formData.password = props.hash
+    }
+    if (val === 'once') {
+      formData.password = ''
+    }
+  }
+  const cancel = () => {
+    loading.value = false
+    emits('cancel')
+    init()
+  }
+  const loading = ref(false)
+  const submitShare = async () => {
+    if (!formData.password) {
+      return
+    }
+    loading.value = true
+    const _formData = { ...formData }
+    /*if (formData.password !== formData.hash) {
+      const res = await getPeerSlat(formData.id).catch(e => {
+        ElMessageBox.alert(T('Timeout'), T('Error'))
+        return false
+      })
+      if (!res) {
+        loading.value = false
+        return
+      }
+      const p = hash([formData.password, res.salt])
+      _formData.password = btoa(p.toString().split(',').map((v) => String.fromCharCode(v)).join(''))
+    }*/
+    const res = await shareByWebClient(_formData).catch(_ => false)
+    if (res) {
+      link.value = getV2ShareUrl(res.data.share_token)
+      emits('success')
+    }
+    loading.value = false
+  }
+
+  const copyLink = (e) => {
+    handleClipboard(link.value, e)
+  }
+
+  const hash = (datas) => {
+    const hasher = new sha256.Hash()
+    datas.forEach((data) => {
+      if (typeof data == 'string') {
+        data = new TextEncoder().encode(data)
+      }
+      hasher.update(data)
+    })
+    return hasher.digest()
+  }
+
+</script>
+
+<style scoped lang="scss">
+
+</style>
@@ -1,11 +1,24 @@
-import { onActivated, onMounted, reactive, ref, watch } from 'vue'
-import { create, list, remove, update } from '@/api/address_book'
+import { reactive, ref } from 'vue'
+import { create as admin_create, list as admin_list, remove as admin_remove, update as admin_update } from '@/api/address_book'
+import { batchUpdateTags, list as my_list, create as my_create, update as my_update, remove as my_remove } from '@/api/my/address_book'
 import { ElMessage, ElMessageBox } from 'element-plus'
-import { useRoute } from 'vue-router'
+import { T } from '@/utils/i18n'
+import { useRepositories as useCollectionRepositories } from '@/views/address_book/collection'
+import { useRepositories as useTagRepositories } from '@/views/tag/index'
+import { simpleData } from '@/api/peer'

-export function useRepositories () {
-  const route = useRoute()
-  const user_id = route.query?.user_id
+const apis = {
+  admin: { list: admin_list, remove: admin_remove, update: admin_update, create: admin_create },
+  my: { list: my_list, remove: my_remove, create: my_create, update: my_update },
+}
+
+export function useRepositories (api_type = 'my') {
+  const {
+    listRes: collectionListRes,
+    listQuery: collectionListQuery,
+    getList: getCollectionList,
+  } = useCollectionRepositories(api_type)
+  collectionListQuery.page_size = 9999

  const listRes = reactive({
    list: [], total: 0, loading: false,
@@ -13,15 +26,31 @@ export function useRepositories () {
  const listQuery = reactive({
    page: 1,
    page_size: 10,
-    is_my: 0,
-    user_id: user_id ? parseInt(user_id) : null,
+    id: null,
+    user_id: null,
+    username: null,
+    hostname: null,
+    collection_id: null,
  })

  const getList = async () => {
    listRes.loading = true
-    const res = await list(listQuery).catch(_ => false)
+    const res = await apis[api_type].list(listQuery).catch(_ => false)
    listRes.loading = false
    if (res) {
+      const ids = res.data.list.map(item => item.id)
+      if (ids.length) {
+        const peer_data = await simpleData({ ids }).catch(_ => false)
+        if (peer_data) {
+          res.data.list.forEach(item => {
+            const peer = peer_data.data.list.find(peer => peer.id === item.id)
+            if (peer) {
+              item.peer = peer
+            }
+          })
+        }
+      }
+
      listRes.list = res.data.list
      listRes.total = res.data.total
    }
@@ -35,47 +64,62 @@ export function useRepositories () {
  }

  const del = async (row) => {
-    const cf = await ElMessageBox.confirm('确定删除么?', {
-      confirmButtonText: '确定',
-      cancelButtonText: '取消',
+    const cf = await ElMessageBox.confirm(T('Confirm?', { param: T('Delete') }), {
+      confirmButtonText: T('Confirm'),
+      cancelButtonText: T('Cancel'),
      type: 'warning',
    }).catch(_ => false)
    if (!cf) {
      return false
    }

-    const res = await remove({ row_id: row.row_id }).catch(_ => false)
+    const res = await apis[api_type].remove({ row_id: row.row_id }).catch(_ => false)
    if (res) {
-      ElMessage.success('操作成功')
+      ElMessage.success(T('OperationSuccess'))
      getList()
    }
  }

+  //创建或者修改
  const platformList = [
-    { label: 'Windows', value: 'Windows' },
-    { label: 'Linux', value: 'Linux' },
-    { label: 'Mac OS', value: 'Mac OS' },
-    { label: 'Android', value: 'Android' },
+    { label: 'Windows', value: 'Windows', icon: 'windows' },
+    { label: 'Linux', value: 'Linux', icon: 'linux' },
+    { label: 'Mac OS', value: 'Mac OS', icon: 'mac' },
+    { label: 'Android', value: 'Android', icon: 'android' },
  ]
  const formVisible = ref(false)
  const formData = reactive({
    'row_id': 0,
    'alias': '',
-    'force_always_relay': false,
+    'forceAlwaysRelay': false,
    'hash': '',
    'hostname': '',
    'id': '',
-    'login_name': '',
+    'loginName': '',
    'online': false,
    'password': '',
    'platform': '',
-    'rdp_port': '',
-    'rdp_username': '',
-    'same_server': false,
+    'rdpPort': '',
+    'rdpUsername': '',
+    'sameServer': false,
    'tags': [],
    'user_id': null,
+    user_ids: [],
    'username': '',
+    collection_id: null,
  })
+  const {
+    listRes: collectionListResForUpdate,
+    listQuery: collectionListQueryForUpdate,
+    getList: getCollectionListForUpdate,
+  } = useCollectionRepositories(api_type)
+  collectionListQueryForUpdate.page_size = 9999
+  const {
+    listRes: tagListRes,
+    listQuery: tagListQuery,
+    getList: getTagList,
+  } = useTagRepositories(api_type)
+  tagListQuery.page_size = 9999

  const toEdit = (row) => {
    formVisible.value = true
@@ -83,6 +127,10 @@ export function useRepositories () {
    Object.keys(formData).forEach(key => {
      formData[key] = row[key]
    })
+    collectionListQueryForUpdate.user_id = row.user_id
+    tagListQuery.collection_id = row.collection_id
+    getCollectionListForUpdate()
+    getTagList()

  }
  const toAdd = () => {
@@ -90,43 +138,155 @@ export function useRepositories () {
    //重置formData
    formData.row_id = 0
    formData.alias = ''
-    formData.force_always_relay = false
+    formData.forceAlwaysRelay = false
    formData.hash = ''
    formData.hostname = ''
    formData.id = ''
-    formData.login_name = ''
+    formData.loginName = ''
    formData.online = false
    formData.password = ''
    formData.platform = ''
-    formData.rdp_port = ''
-    formData.rdp_username = ''
-    formData.same_server = false
+    formData.rdpPort = ''
+    formData.rdpUsername = ''
+    formData.sameServer = false
    formData.tags = []
    formData.user_id = null
    formData.username = ''

  }
  const submit = async () => {
-    const api = formData.row_id ? update : create
+    const api = formData.row_id ? apis[api_type].update : apis[api_type].create
    const res = await api(formData).catch(_ => false)
    if (res) {
-      ElMessage.success('操作成功')
+      ElMessage.success(T('OperationSuccess'))
      formVisible.value = false
      getList()
    }
  }

+  const changeQueryUser = async (val) => {
+    tagListRes.list = []
+    listQuery.collection_id = null
+    if (!val) {
+      collectionListRes.list = []
+    } else {
+      collectionListQuery.user_id = val
+      getCollectionList()
+    }
+  }
+  const changeUserForUpdate = async (val) => {
+    tagListRes.list = []
+    formData.tags = []
+    formData.collection_id = 0
+    if (!val) {
+      collectionListResForUpdate.list = []
+    } else {
+      collectionListQueryForUpdate.user_id = val
+      getCollectionListForUpdate()
+    }
+  }
+  const changeCollectionForUpdate = async (val) => {
+    tagListRes.list = []
+    formData.tags = []
+    tagListQuery.user_id = formData.user_id
+    tagListQuery.collection_id = val
+    getTagList()
+  }
+
+  const fromPeer = (peer) => {
+    formData.id = peer.id
+    formData.username = peer.username
+    formData.hostname = peer.hostname
+    //匹配os
+    if (peer.os.indexOf('windows') !== -1) {
+      formData.platform = platformList.find(item => item.label === 'Windows').value
+    } else if (peer.os.indexOf('linux') !== -1) {
+      formData.platform = platformList.find(item => item.label === 'Linux').value
+    } else if (peer.os.indexOf('android') !== -1) {
+      formData.platform = platformList.find(item => item.label === 'Android').value
+    } else if (peer.os.indexOf('mac') !== -1) {
+      formData.platform = platformList.find(item => item.label === 'Mac OS').value
+    }
+    formData.uuid = peer.uuid
+  }
+
  return {
    listRes,
    listQuery,
    getList,
    handlerQuery,
-    del,
+    collectionListQuery,
+    getCollectionList,
+    collectionListRes,
+    changeQueryUser,
+
    platformList,
+
+    del,
+
    formVisible,
    formData,
    toEdit,
    toAdd,
    submit,
+    getCollectionListForUpdate,
+    collectionListResForUpdate,
+    changeUserForUpdate,
+    changeCollectionForUpdate,
+    tagListQuery,
+    getTagList,
+    tagListRes,
+
+    fromPeer,
+  }
+}
+
+export function useBatchUpdateTagsRepositories () {
+  const {
+    listRes: tagListRes,
+    listQuery: tagListQuery,
+    getList: getTagList,
+  } = useTagRepositories('my')
+  tagListQuery.page_size = 9999
+
+  const visible = ref(false)
+  const show = () => {
+    if (formData.value.row_ids.length === 0) {
+      ElMessage.warning(T('PleaseSelectData'))
+      return
+    }
+    visible.value = true
+  }
+  const formData = ref({
+    tags: [],
+    row_ids: [],
+  })
+  const submit = async () => {
+    if (formData.value.row_ids.length === 0) {
+      ElMessage.warning(T('PleaseSelectData'))
+      return false
+    }
+    if (formData.value.tags.length === 0) {
+      ElMessage.warning(T('PleaseSelectData'))
+      return false
+    }
+    const res = await batchUpdateTags(formData.value).catch(_ => false)
+    if (res) {
+      ElMessage.success(T('Success'))
+      visible.value = false
+      return true
+    }
+    return false
+  }
+
+  return {
+    tagListQuery,
+    getTagList,
+    tagListRes,
+
+    visible,
+    formData,
+    show,
+    submit,
  }
 }
@@ -1,9 +1,9 @@
 <template>
  <div>
    <el-card class="list-query" shadow="hover">
-      <el-form inline label-width="60px">
-        <el-form-item label="用户">
-          <el-select v-model="listQuery.user_id" clearable>
+      <el-form inline label-width="120px">
+        <el-form-item :label="T('Owner')">
+          <el-select v-model="listQuery.user_id" clearable @change="changeQueryUser">
            <el-option
                v-for="item in allUsers"
                :key="item.id"
@@ -12,34 +12,67 @@
            ></el-option>
          </el-select>
        </el-form-item>
+        <el-form-item :label="T('AddressBookName')">
+          <el-select v-model="listQuery.collection_id" clearable>
+            <el-option :value="0" :label="T('MyAddressBook')"></el-option>
+            <el-option v-for="c in collectionListRes.list" :key="c.id" :label="c.name" :value="c.id"></el-option>
+          </el-select>
+        </el-form-item>
+        <el-form-item :label="T('Id')">
+          <el-input v-model="listQuery.id" clearable></el-input>
+        </el-form-item>
+        <el-form-item :label="T('Username')">
+          <el-input v-model="listQuery.username" clearable></el-input>
+        </el-form-item>
+        <el-form-item :label="T('Hostname')">
+          <el-input v-model="listQuery.hostname" clearable></el-input>
+        </el-form-item>
        <el-form-item>
-          <el-button type="primary" @click="handlerQuery">筛选</el-button>
-          <el-button type="danger" @click="toAdd">添加</el-button>
+          <el-button type="primary" @click="handlerQuery">{{ T('Filter') }}</el-button>
+          <el-button type="danger" @click="toAdd">{{ T('Add') }}</el-button>
        </el-form-item>
      </el-form>
    </el-card>
    <el-card class="list-body" shadow="hover">
      <!--      <el-tag type="danger" style="margin-bottom: 10px">不建议在此操作地址簿，可能会造成数据不同步</el-tag>-->
      <el-table :data="listRes.list" v-loading="listRes.loading" border>
-        <el-table-column prop="id" label="id" align="center"/>
-        <el-table-column label="所属用户" align="center">
+        <el-table-column prop="id" label="ID" align="center" width="200">
+          <template #default="{row}">
+            <div>
+              <PlatformIcons :name="platformList.find(p=>p.label===row.platform)?.icon" style="width: 20px;height: 20px;display: inline-block" color="var(--basicBlack)"/>
+              {{ row.id }}
+              <el-icon @click="handleClipboard(row.id, $event)">
+                <CopyDocument/>
+              </el-icon>
+            </div>
+          </template>
+        </el-table-column>
+        <el-table-column :label="T('Owner')" align="center" width="200">
          <template #default="{row}">
            <span v-if="row.user_id"> <el-tag>{{ allUsers?.find(u => u.id === row.user_id)?.username }}</el-tag> </span>
          </template>
        </el-table-column>
-        <el-table-column prop="username" label="用户名" align="center"/>
-        <el-table-column prop="hostname" label="主机名" align="center"/>
-        <el-table-column prop="alias" label="别名" align="center"/>
-        <el-table-column prop="platform" label="平台" align="center"/>
-        <el-table-column prop="hash" label="hash" align="center"/>
-        <el-table-column prop="tags" label="标签" align="center"/>
+        <el-table-column prop="collection_id" :label="T('AddressBookName')" align="center" width="150">
+          <template #default="{row}">
+            <span v-if="row.collection_id === 0">{{ T('MyAddressBook') }}</span>
+            <span v-else>{{ row.collection?.name }}</span>
+          </template>
+        </el-table-column>
+        <el-table-column prop="username" :label="T('Username')" align="center" width="150"/>
+        <el-table-column prop="hostname" :label="T('Hostname')" align="center" width="150"/>
+        <el-table-column prop="tags" :label="T('Tags')" align="center"/>
        <!--        <el-table-column prop="created_at" label="创建时间" align="center"/>-->
        <!--        <el-table-column prop="updated_at" label="更新时间" align="center"/>-->
-        <el-table-column label="操作" align="center" width="400">
+        <el-table-column prop="alias" :label="T('Alias')" align="center" width="150"/>
+        <el-table-column prop="peer.version" :label="T('Version')" align="center" width="100"/>
+        <el-table-column prop="hash" :label="T('Hash')" align="center" width="150" show-overflow-tooltip/>
+        <el-table-column :label="T('Actions')" align="center" class-name="table-actions" width="500" fixed="right">
          <template #default="{row}">
-            <el-button type="success" @click="toWebClientLink(row)">Web-Client</el-button>
-            <el-button @click="toEdit(row)">编辑</el-button>
-            <el-button type="danger" @click="del(row)">删除</el-button>
+            <el-button type="success" @click="connectByClient(row.id)">{{ T('Link') }}</el-button>
+            <el-button v-if="appStore.setting.appConfig.web_client" type="success" @click="toWebClientLink(row)">Web Client</el-button>
+            <!--            <el-button type="primary" @click="toShowShare(row)">{{ T('ShareByWebClient') }}</el-button>-->
+            <el-button @click="toEdit(row)">{{ T('Edit') }}</el-button>
+            <el-button type="danger" @click="del(row)">{{ T('Delete') }}</el-button>
          </template>
        </el-table-column>
      </el-table>
@@ -53,10 +86,10 @@
                     :total="listRes.total">
      </el-pagination>
    </el-card>
-    <el-dialog v-model="formVisible" width="800" :title="!formData.row_id?'创建':'修改'">
+    <el-dialog v-model="formVisible" width="800" :title="!formData.row_id?T('Create') :T('Update') ">
      <el-form class="dialog-form" ref="form" :model="formData" label-width="120px">
-        <el-form-item label="用户" prop="user_id" required>
-          <el-select v-model="formData.user_id" @change="changeUser">
+        <el-form-item :label="T('Owner')" prop="user_id" required>
+          <el-select v-model="formData.user_id" @change="changeUserForUpdate">
            <el-option
                v-for="item in allUsers"
                :key="item.id"
@@ -65,28 +98,34 @@
            ></el-option>
          </el-select>
        </el-form-item>
-        <el-form-item label="id" prop="id" required>
+        <el-form-item :label="T('AddressBookName')">
+          <el-select v-model="formData.collection_id" clearable @change="changeCollectionForUpdate">
+            <el-option :value="0" :label="T('MyAddressBook')"></el-option>
+            <el-option v-for="c in collectionListResForUpdate.list" :key="c.id" :label="c.name" :value="c.id"></el-option>
+          </el-select>
+        </el-form-item>
+        <el-form-item label="ID" prop="id" required>
          <el-input v-model="formData.id"></el-input>
        </el-form-item>
-        <el-form-item label="用户名" prop="username">
+        <el-form-item :label="T('Username')" prop="username">
          <el-input v-model="formData.username"></el-input>
        </el-form-item>
-        <el-form-item label="别名" prop="alias">
+        <el-form-item :label="T('Alias')" prop="alias">
          <el-input v-model="formData.alias"></el-input>
        </el-form-item>
-        <el-form-item label="hash" prop="hash">
+        <el-form-item :label="T('Hash')" prop="hash">
          <el-input v-model="formData.hash"></el-input>
        </el-form-item>
-        <el-form-item label="主机名" prop="hostname">
+        <el-form-item :label="T('Hostname')" prop="hostname">
          <el-input v-model="formData.hostname"></el-input>
        </el-form-item>
-        <el-form-item label="登录名" prop="login_name">
-          <el-input v-model="formData.login_name"></el-input>
-        </el-form-item>
-        <el-form-item label="密码" prop="password">
-          <el-input v-model="formData.password"></el-input>
-        </el-form-item>
-        <el-form-item label="平台" prop="platform">
+        <!--        <el-form-item :label="T('LoginName')" prop="loginName">
+                  <el-input v-model="formData.loginName"></el-input>
+                </el-form-item>
+                <el-form-item :label="T('Password')" prop="password">
+                  <el-input v-model="formData.password"></el-input>
+                </el-form-item>-->
+        <el-form-item :label="T('Platform')" prop="platform">
          <el-select v-model="formData.platform">
            <el-option
                v-for="item in platformList"
@@ -97,71 +136,71 @@
          </el-select>
        </el-form-item>

-        <el-form-item label="标签" prop="tags">
+        <el-form-item :label="T('Tags')" prop="tags">
          <el-select v-model="formData.tags" multiple>
            <el-option
-                v-for="item in tagList"
+                v-for="item in tagListRes.list"
                :key="item.name"
                :label="item.name"
                :value="item.name"
            ></el-option>
          </el-select>
        </el-form-item>
-        <!-- <el-form-item label="强制中继" prop="force_always_relay" required>
-                <el-switch v-model="formData.force_always_relay"></el-switch>
+        <!-- <el-form-item label="强制中继" prop="forceAlwaysRelay" required>
+                <el-switch v-model="formData.forceAlwaysRelay"></el-switch>
              </el-form-item>
         <el-form-item label="在线" prop="online">
                <el-switch v-model="formData.online"></el-switch>
              </el-form-item>
-              <el-form-item label="rdp端口" prop="rdp_port">
-                <el-input v-model="formData.rdp_port"></el-input>
+              <el-form-item label="rdp端口" prop="rdpPort">
+                <el-input v-model="formData.rdpPort"></el-input>
              </el-form-item>
-              <el-form-item label="rdp用户名" prop="rdp_username">
-                <el-input v-model="formData.rdp_username"></el-input>
+              <el-form-item label="rdp用户名" prop="rdpUsername">
+                <el-input v-model="formData.rdpUsername"></el-input>
              </el-form-item>
-              <el-form-item label="同一服务器" prop="same_server">
-                <el-switch v-model="formData.same_server"></el-switch>
+              <el-form-item label="同一服务器" prop="sameServer">
+                <el-switch v-model="formData.sameServer"></el-switch>
              </el-form-item>-->

-
        <el-form-item>
-          <el-button @click="formVisible = false">取消</el-button>
-          <el-button @click="submit" type="primary">提交</el-button>
+          <el-button @click="formVisible = false">{{ T('Cancel') }}</el-button>
+          <el-button @click="submit" type="primary">{{ T('Submit') }}</el-button>
        </el-form-item>
      </el-form>
    </el-dialog>
+    <!--    <el-dialog v-model="shareToWebClientVisible" width="900" :close-on-click-modal="false">
+          <shareByWebClient :id="shareToWebClientForm.id"
+                            :hash="shareToWebClientForm.hash"
+                            @cancel="shareToWebClientVisible=false"
+                            @success=""/>
+        </el-dialog>-->
  </div>
 </template>

 <script setup>
-  import { onActivated, onMounted, reactive, ref, watch } from 'vue'
-  import { create, list, remove, update } from '@/api/address_book'
-  import { list as fetchTagList } from '@/api/tag'
-  import { ElMessage, ElMessageBox } from 'element-plus'
-  import { loadAllUsers } from '@/global'
-  import { useRoute } from 'vue-router'
+  import { onActivated, onMounted, watch } from 'vue'
  import { useRepositories } from '@/views/address_book/index'
  import { toWebClientLink } from '@/utils/webclient'
+  import { T } from '@/utils/i18n'
+  import { useRoute } from 'vue-router'
+  import { connectByClient } from '@/utils/peer'
+  import { useAppStore } from '@/store/app'
+  import { handleClipboard } from '@/utils/clipboard'
+  import { CopyDocument } from '@element-plus/icons'
+  import PlatformIcons from '@/components/icons/platform.vue'
+  import { loadAllUsers } from '@/global'

+  const appStore = useAppStore()
+  const route = useRoute()
  const { allUsers, getAllUsers } = loadAllUsers()
-  getAllUsers()
-  const changeUser = (v) => {
-    formData.tags = []
-    fetchTagListData(v)
-  }
-  const tagList = ref([])
-  const fetchTagListData = async (user_id) => {
-    const res = await fetchTagList({ user_id }).catch(_ => false)
-    if (res) {
-      tagList.value = res.data.list
-    }
-  }

  const {
    listRes,
    listQuery,
    getList,
    handlerQuery,
+    collectionListRes,
+
    del,
    formVisible,
    platformList,
@@ -169,10 +208,18 @@
    toEdit,
    toAdd,
    submit,
-    activeChange,
-    currentColor,
-  } = useRepositories()
+    changeUserForUpdate,
+    changeCollectionForUpdate,
+    collectionListResForUpdate,
+    tagListRes,

+    changeQueryUser,
+  } = useRepositories('admin')
+
+  if (route.query?.user_id) {
+    listQuery.user_id = parseInt(route.query.user_id)
+  }
+  onMounted(getAllUsers)
  onMounted(getList)
  onActivated(getList)

@@ -180,6 +227,7 @@

  watch(() => listQuery.page_size, handlerQuery)

+
 </script>

 <style scoped lang="scss">
@@ -0,0 +1,160 @@
+import { computed, reactive, ref } from 'vue'
+import { list as admin_list, create as admin_create, update as admin_update, remove as admin_remove } from '@/api/address_book_collection_rule'
+import { list as my_list, create as my_create, update as my_update, remove as my_remove } from '@/api/my/address_book_collection_rule'
+import { groupUsers } from '@/api/user'
+import { ElMessage, ElMessageBox } from 'element-plus'
+import { T } from '@/utils/i18n'
+
+const apis = {
+  admin: { list: admin_list, remove: admin_remove, update: admin_update, create: admin_create },
+  my: { list: my_list, remove: my_remove, create: my_create, update: my_update },
+}
+
+export function useRepositories (api_type = 'my') {
+  const listRes = reactive({
+    list: [], total: 0, loading: false,
+  })
+  const listQuery = reactive({
+    page: 1,
+    page_size: 10,
+    collection_id: null,
+  })
+
+  const getList = async () => {
+    listRes.loading = true
+    const res = await apis[api_type].list(listQuery).catch(_ => false)
+    listRes.loading = false
+    if (res) {
+      listRes.list = res.data.list
+      listRes.total = res.data.total
+    }
+  }
+  const handlerQuery = () => {
+    if (listQuery.page === 1) {
+      getList()
+    } else {
+      listQuery.page = 1
+    }
+  }
+
+  const del = async (row) => {
+    const cf = await ElMessageBox.confirm(T('Confirm?', { param: T('Delete') }), {
+      confirmButtonText: T('Confirm'),
+      cancelButtonText: T('Cancel'),
+      type: 'warning',
+    }).catch(_ => false)
+    if (!cf) {
+      return false
+    }
+
+    const res = await apis[api_type].remove({ id: row.id }).catch(_ => false)
+    if (res) {
+      ElMessage.success(T('OperationSuccess'))
+      getList()
+    }
+  }
+
+  const rules = computed(_ => [
+    { label: T('Read'), value: 1 },
+    { label: T('ReadWrite'), value: 2 },
+    { label: T('FullControl'), value: 3 },
+  ])
+  const TYPE_U = 1
+  const TYPE_G = 2
+  const types = computed(_ => [
+    { label: T('Group'), value: TYPE_G },
+    { label: T('User'), value: TYPE_U },
+  ])
+  const formVisible = ref(false)
+  const formData = reactive({
+    id: 0,
+    collection_id: null,
+    type: TYPE_U,
+    rule: 1,
+    g_id: null,
+    u_id: null,
+    to_id: null,
+    user_id: null,
+  })
+
+  const toEdit = (row) => {
+    formVisible.value = true
+    //将row中的数据赋值给formData
+    Object.keys(formData).forEach(key => {
+      formData[key] = row[key]
+    })
+    if (row.type === TYPE_U) {
+      formData.u_id = row.to_id
+      formData.g_id = users.value.find(u => u.id === row.to_id)?.group_id
+    } else {
+      formData.g_id = row.to_id
+      formData.u_id = null
+    }
+  }
+  const toAdd = () => {
+    //初始化formData
+    formData.id = 0
+    formData.type = TYPE_U
+    formData.rule = 1
+    formData.g_id = null
+    formData.u_id = null
+
+    formVisible.value = true
+
+  }
+  const submit = async () => {
+    const api = formData.id ? apis[api_type].update : apis[api_type].create
+    const form = {
+      ...formData,
+    }
+    form.to_id = form.type === TYPE_G ? form.g_id : form.u_id
+    const res = await api(form).catch(_ => false)
+    if (res) {
+      ElMessage.success(T('OperationSuccess'))
+      formVisible.value = false
+      getList()
+    }
+  }
+  const groups = ref([])
+  const users = ref([])
+  const getGroupUsers = async () => {
+    const res = await groupUsers().catch(_ => false)
+    if (res) {
+      groups.value = res.data.groups.map(item => {
+        if (!item.children) {
+          item.children = []
+        }
+        res.data.users.map(u => {
+          if (item.id === u.group_id) {
+            item.children.push(u)
+          }
+        })
+        return item
+      })
+      users.value = res.data.users
+    }
+  }
+  const changeGId = () => {
+    formData.u_id = null
+  }
+  return {
+    listRes,
+    listQuery,
+    getList,
+    handlerQuery,
+    del,
+    formVisible,
+    formData,
+    toEdit,
+    toAdd,
+    submit,
+    rules,
+    types,
+    groups,
+    users,
+    getGroupUsers,
+    TYPE_G,
+    TYPE_U,
+    changeGId,
+  }
+}
@@ -0,0 +1,160 @@
+<template>
+  <div>
+    <el-card class="list-query" shadow="hover">
+      <el-form inline label-width="80px">
+        <el-form-item>
+          <el-button type="primary" @click="handlerQuery">{{ T('Filter') }}</el-button>
+          <el-button type="danger" @click="toAdd">{{ T('Add') }}</el-button>
+        </el-form-item>
+      </el-form>
+    </el-card>
+    <el-card class="list-body" shadow="hover">
+      <el-table :data="listRes.list" v-loading="listRes.loading" border>
+        <el-table-column prop="rule" :label="T('Rule')" align="center">
+          <template #default="{row}">
+            <div>
+              {{ rules.find(r => r.value === row.rule)?.label }}
+            </div>
+          </template>
+        </el-table-column>
+        <el-table-column prop="type" :label="T('Type')" align="center">
+          <template #default="{row}">
+            <div>
+              {{ types.find(t => t.value === row.type)?.label }}
+            </div>
+          </template>
+        </el-table-column>
+        <el-table-column prop="to_id" :label="T('ShareTo')" align="center">
+          <template #default="{row}">
+            <div v-if="row.type===TYPE_U">
+              {{ users.find(u => u.id === row.to_id)?.username }}
+            </div>
+            <div v-else-if="row.type===TYPE_G">
+              {{ groups.find(g => g.id === row.to_id)?.name }}
+            </div>
+          </template>
+        </el-table-column>
+        <el-table-column prop="created_at" :label="T('CreatedAt')" align="center"/>
+        <!--        <el-table-column prop="updated_at" label="更新时间" align="center"/>-->
+        <el-table-column :label="T('Actions')" align="center" class-name="table-actions" width="300" fixed="right">
+          <template #default="{row}">
+            <el-button @click="toEdit(row)">{{ T('Edit') }}</el-button>
+            <el-button type="danger" @click="del(row)">{{ T('Delete') }}</el-button>
+          </template>
+        </el-table-column>
+      </el-table>
+    </el-card>
+    <el-card class="list-page" shadow="hover">
+      <el-pagination background
+                     layout="prev, pager, next, sizes, jumper"
+                     :page-sizes="[10,20,50,100]"
+                     v-model:page-size="listQuery.page_size"
+                     v-model:current-page="listQuery.page"
+                     :total="listRes.total">
+      </el-pagination>
+    </el-card>
+    <el-dialog v-model="formVisible" width="800" :title="!formData.id?T('Create') :T('Update') " :close-on-click-modal="false">
+      <el-form class="dialog-form" ref="form" :model="formData" label-width="120px">
+        <el-form-item :label="T('AddressBookName')">
+          {{ props.collection.name }}
+        </el-form-item>
+        <el-form-item :label="T('Rule')" prop="rule" required>
+          <el-radio-group v-model="formData.rule">
+            <el-radio v-for="item in rules" :key="item.value" :value="item.value">
+              {{ item.label }}
+            </el-radio>
+          </el-radio-group>
+        </el-form-item>
+        <el-form-item :label="T('Type')" prop="type" required>
+          <el-radio-group v-model="formData.type">
+            <el-radio v-for="item in types" :key="item.value" :value="parseInt(item.value)">
+              {{ item.label }}
+            </el-radio>
+          </el-radio-group>
+        </el-form-item>
+        <el-form-item :label="T('ShareTo')" prop="g_id" required>
+          <!--          <el-input-number v-model="formData.to_id"></el-input-number>-->
+          <div style="width: 30%">
+            <el-select v-model="formData.g_id" @change="changeGId">
+              <el-option
+                  v-for="item in groups"
+                  :key="item.id"
+                  :label="item.name"
+                  :value="item.id"
+              ></el-option>
+            </el-select>
+          </div>
+          <div style="width: 30%;margin-left: 20px">
+            <el-select v-model="formData.u_id" v-if="formData.type===TYPE_U">
+              <el-option
+                  v-for="item in users.filter(u => u.group_id === formData.g_id)"
+                  :key="item.id"
+                  :label="item.username"
+                  :value="item.id"
+              ></el-option>
+            </el-select>
+          </div>
+        </el-form-item>
+        <el-form-item>
+          <el-button @click="formVisible = false">{{ T('Cancel') }}</el-button>
+          <el-button @click="submit" type="primary">{{ T('Submit') }}</el-button>
+        </el-form-item>
+      </el-form>
+    </el-dialog>
+  </div>
+</template>
+
+<script setup>
+
+  import { T } from '@/utils/i18n'
+  import { useRepositories } from '@/views/address_book/rule'
+  import { onActivated, onMounted, watch } from 'vue'
+
+  const props = defineProps({
+    collection: {
+      type: Object,
+      required: true,
+    },
+    is_my: {
+      type: Number,
+      default: 0,
+    },
+  })
+  const {
+    listRes,
+    listQuery,
+    getList,
+    handlerQuery,
+    del,
+    formVisible,
+    formData,
+    toEdit,
+    toAdd,
+    submit,
+    rules,
+    types,
+    groups,
+    users,
+    getGroupUsers,
+    TYPE_G,
+    TYPE_U,
+    changeGId,
+  } = useRepositories(props.is_my ? 'my' : 'admin')
+
+  formData.collection_id = props.collection.id
+  formData.user_id = props.collection.user_id
+  listQuery.collection_id = props.collection.id
+
+  onMounted(getGroupUsers)
+  onMounted(getList)
+  onActivated(getList)
+
+  watch(() => listQuery.page, getList)
+
+  watch(() => listQuery.page_size, handlerQuery)
+
+</script>
+
+<style scoped lang="scss">
+
+</style>
@@ -0,0 +1,89 @@
+<template>
+  <div>
+    <el-card class="list-query" shadow="hover">
+      <el-form inline label-width="80px">
+        <el-form-item :label="T('Peer')">
+          <el-input v-model="listQuery.peer_id" clearable></el-input>
+        </el-form-item>
+        <el-form-item :label="T('FromPeer')">
+          <el-input v-model="listQuery.from_peer" clearable></el-input>
+        </el-form-item>
+        <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>
+    <el-card class="list-body" shadow="hover">
+      <el-table :data="listRes.list" v-loading="listRes.loading" border @selection-change="handleSelectionChange">
+        <el-table-column type="selection" align="center" width="50"/>
+        <el-table-column prop="id" label="ID" align="center" width="100"/>
+        <el-table-column :label="T('Peer')" prop="peer_id" align="center" width="120"/>
+        <el-table-column :label="T('FromPeer')" prop="from_peer" align="center" width="120"/>
+        <el-table-column :label="T('FromName')" prop="from_name" align="center" width="120"/>
+        <el-table-column :label="T('Ip')" prop="ip" align="center" width="120"/>
+        <el-table-column pop="type" :label="T('Type')" align="center" width="120">
+          <template #default="{row}">
+            <el-tag v-if="row.type === 1" type="warning">{{ T('File') }}</el-tag>
+            <el-tag v-else>{{ T('Common') }}</el-tag>
+          </template>
+        </el-table-column>
+        <el-table-column prop="uuid" label="uuid" align="center" width="120" show-overflow-tooltip/>
+        <el-table-column prop="created_at" :label="T('CreatedAt')" align="center"/>
+        <el-table-column :label="T('CloseTime')" prop="close_time" align="center"/>
+        <el-table-column :label="T('Actions')" align="center" width="150">
+          <template #default="{row}">
+            <el-button type="danger" @click="del(row)">{{ T('Delete') }}</el-button>
+          </template>
+        </el-table-column>
+      </el-table>
+    </el-card>
+    <el-card class="list-page" shadow="hover">
+      <el-pagination background
+                     layout="prev, pager, next, sizes, jumper"
+                     :page-sizes="[10,20,50,100]"
+                     v-model:page-size="listQuery.page_size"
+                     v-model:current-page="listQuery.page"
+                     :total="listRes.total">
+      </el-pagination>
+    </el-card>
+  </div>
+</template>
+
+<script setup>
+  import { onActivated, onMounted, ref, watch } from 'vue'
+  import { useRepositories } from '@/views/audit/reponsitories'
+  import { T } from '@/utils/i18n'
+
+  const {
+    listRes,
+    listQuery,
+    getList,
+    handlerQuery,
+    del,
+    batchdel,
+    toExport,
+  } = useRepositories()
+
+  onMounted(getList)
+  onActivated(getList)
+
+  watch(() => listQuery.page, getList)
+
+  watch(() => listQuery.page_size, handlerQuery)
+  const multipleSelection = ref([])
+  const handleSelectionChange = (val) => {
+    multipleSelection.value = val
+  }
+  const toBatchDelete = () => {
+    if (multipleSelection.value.length === 0) {
+      return
+    }
+    batchdel(multipleSelection.value)
+  }
+</script>
+
+<style scoped lang="scss">
+
+</style>
@@ -0,0 +1,144 @@
+<template>
+  <div>
+    <el-card class="list-query" shadow="hover">
+      <el-form inline label-width="80px">
+        <el-form-item :label="T('Peer')">
+          <el-input v-model="listQuery.peer_id" clearable></el-input>
+        </el-form-item>
+        <el-form-item :label="T('FromPeer')">
+          <el-input v-model="listQuery.from_peer" clearable></el-input>
+        </el-form-item>
+        <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>
+    <el-card class="list-body" shadow="hover">
+      <el-table :data="listRes.list" v-loading="listRes.loading" border max-height="750" @selection-change="handleSelectionChange">
+        <el-table-column type="selection" align="center" width="50"/>
+        <el-table-column prop="id" label="ID" align="center" width="100"/>
+        <el-table-column :label="T('Peer')" prop="peer_id" align="center" width="120"/>
+        <el-table-column :label="T('FromPeer')" prop="from_peer" align="center" width="120"/>
+        <el-table-column :label="T('FromName')" prop="from_name" align="center" width="120"/>
+        <el-table-column :label="T('Ip')" prop="ip" align="center" width="120"/>
+        <el-table-column prop="type" :label="T('Type')" align="center" width="200">
+          <template #default="{row}">
+            <el-tag v-if="row.type === 1" type="warning"> {{ T('ToRemote') }}:
+              <el-icon>
+                <Right/>
+              </el-icon>
+              {{ row.peer_id }}
+            </el-tag>
+            <el-tag v-else>{{ T('ToLocal') }}:
+              <el-icon>
+                <Right/>
+              </el-icon>
+              {{ row.from_peer }}
+            </el-tag>
+          </template>
+        </el-table-column>
+        <el-table-column prop="num" :label="T('Num')" align="center" width="100"/>
+        <el-table-column :label="T('FileInfo')" align="center" width="300">
+          <template #default="{row}">
+            <template v-if="!row.is_file">
+              <el-table size="small" :data="row.info?.files?.filter((v,k) => k<showDirFileNum)" fit>
+                <el-table-column prop="0" :label="T('FileName')" align="center" width="150" show-overflow-tooltip></el-table-column>
+                <el-table-column prop="1" :label="T('Size')" align="center">
+                  <template #default="{row:_row}">
+                    {{ sizeFormat(_row[1]) }}
+                  </template>
+                </el-table-column>
+              </el-table>
+              <el-button size="small" v-if="row.info.files.length>showDirFileNum" style="width: 100%;margin-top: 5px" type="primary" @click="showAllFile(row.info.files)">
+                {{ T('More') }}({{ row.info.files.length - showDirFileNum }})
+              </el-button>
+            </template>
+            <div v-else>
+              {{ sizeFormat(row.info.files[0][1]) }}
+            </div>
+
+          </template>
+        </el-table-column>
+        <el-table-column prop="path" :label="T('Path')" align="center" width="150" show-overflow-tooltip/>
+        <el-table-column prop="uuid" label="uuid" align="center" width="120" show-overflow-tooltip/>
+        <el-table-column prop="created_at" :label="T('CreatedAt')" align="center" min-width="120"/>
+        <el-table-column :label="T('Actions')" align="center" width="150" fixed="right">
+          <template #default="{row}">
+            <el-button type="danger" @click="del(row)">{{ T('Delete') }}</el-button>
+          </template>
+        </el-table-column>
+      </el-table>
+    </el-card>
+    <el-card class="list-page" shadow="hover">
+      <el-pagination background
+                     layout="prev, pager, next, sizes, jumper"
+                     :page-sizes="[10,20,50,100]"
+                     v-model:page-size="listQuery.page_size"
+                     v-model:current-page="listQuery.page"
+                     :total="listRes.total">
+      </el-pagination>
+    </el-card>
+    <el-dialog v-model="allFilesVisible" :title="T('File')">
+      <el-table :data="showFiles" max-height="800px">
+        <el-table-column type="index" :label="T('IndexNum')" width="120" align="center"></el-table-column>
+        <el-table-column prop="0" :label="T('FileName')" align="center"></el-table-column>
+        <el-table-column prop="1" :label="T('Size')" align="center">
+          <template #default="{row:_row}">
+            {{ sizeFormat(_row[1]) }}
+          </template>
+        </el-table-column>
+      </el-table>
+      <el-button @click="allFilesVisible=false" style="margin-top: 20px;width: 100%" type="primary">{{ T('Close') }}</el-button>
+    </el-dialog>
+  </div>
+</template>
+
+<script setup>
+  import { onActivated, onMounted, ref, watch } from 'vue'
+  import { useFileRepositories } from '@/views/audit/reponsitories'
+  import { T } from '@/utils/i18n'
+  import { sizeFormat } from '@/utils/file'
+  import { Right } from '@element-plus/icons'
+
+  const showDirFileNum = 3
+  const {
+    listRes,
+    listQuery,
+    getList,
+    handlerQuery,
+    del,
+    batchdel,
+    toExport,
+  } = useFileRepositories()
+
+  onMounted(getList)
+  onActivated(getList)
+
+  watch(() => listQuery.page, getList)
+
+  watch(() => listQuery.page_size, handlerQuery)
+
+  const allFilesVisible = ref(false)
+  const showFiles = ref([])
+  const showAllFile = (files) => {
+    showFiles.value = files
+    allFilesVisible.value = true
+  }
+
+  const multipleSelection = ref([])
+  const handleSelectionChange = (val) => {
+    multipleSelection.value = val
+  }
+  const toBatchDelete = () => {
+    if (multipleSelection.value.length === 0) {
+      return
+    }
+    batchdel(multipleSelection.value)
+  }
+</script>
+
+<style scoped lang="scss">
+
+</style>
@@ -0,0 +1,187 @@
+import { reactive } from 'vue'
+import { list, remove, fileList, fileRemove, batchDelete, fileBatchDelete } from '@/api/audit'
+import { ElMessage, ElMessageBox } from 'element-plus'
+import { formatTime } from '@/utils/time'
+import { T } from '@/utils/i18n'
+import { downBlob, jsonToCsv } from '@/utils/file'
+
+export function useRepositories () {
+  const listRes = reactive({
+    list: [], total: 0, loading: false,
+  })
+  const listQuery = reactive({
+    page: 1,
+    page_size: 10,
+    peer_id: null,
+    from_peer: null,
+  })
+
+  const getList = async () => {
+    listRes.loading = true
+    const res = await list(listQuery).catch(_ => false)
+    listRes.loading = false
+    if (res) {
+      listRes.list = res.data.list.map(item => {
+        item.close_time = item.close_time ? formatTime(item.close_time * 1000) : '-'
+        return item
+      })
+      listRes.total = res.data.total
+    }
+  }
+  const handlerQuery = () => {
+    if (listQuery.page === 1) {
+      getList()
+    } else {
+      listQuery.page = 1
+    }
+  }
+
+  const del = async (row) => {
+    const cf = await ElMessageBox.confirm(T('Confirm?', { param: T('Delete') }), {
+      confirmButtonText: T('Confirm'),
+      cancelButtonText: T('Cancel'),
+      type: 'warning',
+    }).catch(_ => false)
+    if (!cf) {
+      return false
+    }
+
+    const res = await remove({ id: row.id }).catch(_ => false)
+    if (res) {
+      ElMessage.success(T('OperationSuccess'))
+      getList()
+    }
+  }
+  const batchdel = async (rows) => {
+    const ids = rows.map(r => r.id)
+    if (!ids.length) {
+      ElMessage.warning(T('PleaseSelectData'))
+      return false
+    }
+    const cf = await ElMessageBox.confirm(T('Confirm?', { param: T('BatchDelete') }), {
+      confirmButtonText: T('Confirm'),
+      cancelButtonText: T('Cancel'),
+      type: 'warning',
+    }).catch(_ => false)
+    if (!cf) {
+      return false
+    }
+
+    const res = await batchDelete({ ids }).catch(_ => false)
+    if (res) {
+      ElMessage.success(T('OperationSuccess'))
+      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,
+    getList,
+    handlerQuery,
+    del,
+    batchdel,
+    toExport,
+  }
+}
+
+export function useFileRepositories () {
+  const listRes = reactive({
+    list: [], total: 0, loading: false,
+  })
+  const listQuery = reactive({
+    page: 1,
+    page_size: 10,
+    peer_id: null,
+    from_peer: null,
+  })
+
+  const getList = async () => {
+    listRes.loading = true
+    const res = await fileList(listQuery).catch(_ => false)
+    listRes.loading = false
+    if (res) {
+      listRes.list = res.data.list.map(item => {
+        item.info = item.info ? JSON.parse(item.info) : '-'
+        return item
+      })
+      listRes.total = res.data.total
+    }
+  }
+  const handlerQuery = () => {
+    if (listQuery.page === 1) {
+      getList()
+    } else {
+      listQuery.page = 1
+    }
+  }
+
+  const del = async (row) => {
+    const cf = await ElMessageBox.confirm(T('Confirm?', { param: T('Delete') }), {
+      confirmButtonText: T('Confirm'),
+      cancelButtonText: T('Cancel'),
+      type: 'warning',
+    }).catch(_ => false)
+    if (!cf) {
+      return false
+    }
+
+    const res = await fileRemove({ id: row.id }).catch(_ => false)
+    if (res) {
+      ElMessage.success(T('OperationSuccess'))
+      getList()
+    }
+  }
+  const batchdel = async (rows) => {
+    const ids = rows.map(r => r.id)
+    if (!ids.length) {
+      ElMessage.warning(T('PleaseSelectData'))
+      return false
+    }
+    const cf = await ElMessageBox.confirm(T('Confirm?', { param: T('BatchDelete') }), {
+      confirmButtonText: T('Confirm'),
+      cancelButtonText: T('Cancel'),
+      type: 'warning',
+    }).catch(_ => false)
+    if (!cf) {
+      return false
+    }
+
+    const res = await fileBatchDelete({ ids }).catch(_ => false)
+    if (res) {
+      ElMessage.success(T('OperationSuccess'))
+      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,
+    getList,
+    handlerQuery,
+    del,
+    batchdel,
+    toExport,
+  }
+}
@@ -0,0 +1,138 @@
+<template>
+  <div>
+    <el-card class="list-query" shadow="hover">
+      <el-form inline label-width="80px">
+        <!--        <el-form-item label="名称">
+                  <el-input v-model="listQuery.name"></el-input>
+                </el-form-item>-->
+        <el-form-item>
+          <el-button type="primary" @click="handlerQuery">{{ T('Filter') }}</el-button>
+          <el-button type="danger" @click="toAdd">{{ T('Add') }}</el-button>
+        </el-form-item>
+      </el-form>
+    </el-card>
+    <el-card class="list-body" shadow="hover">
+      <el-table :data="listRes.list" v-loading="listRes.loading" border>
+        <el-table-column prop="id" label="ID" align="center"></el-table-column>
+        <el-table-column prop="name" :label="T('Name')" align="center"/>
+        <el-table-column prop="created_at" :label="T('CreatedAt')" align="center"/>
+        <el-table-column prop="updated_at" :label="T('UpdatedAt')" align="center"/>
+        <el-table-column :label="T('Actions')" align="center">
+          <template #default="{row}">
+            <el-button @click="toEdit(row)">{{ T('Edit') }}</el-button>
+            <el-button type="danger" @click="del(row)">{{ T('Delete') }}</el-button>
+          </template>
+        </el-table-column>
+      </el-table>
+    </el-card>
+    <el-card class="list-page" shadow="hover">
+      <el-pagination background
+                     layout="prev, pager, next, sizes, jumper"
+                     :page-sizes="[10,20,50,100]"
+                     v-model:page-size="listQuery.page_size"
+                     v-model:current-page="listQuery.page"
+                     :total="listRes.total">
+      </el-pagination>
+    </el-card>
+    <el-dialog v-model="formVisible" :title="!formData.id?T('Create'):T('Update')" width="800">
+      <el-form class="dialog-form" ref="form" :model="formData" label-width="120px">
+        <el-form-item :label="T('Name')" prop="name" required>
+          <el-input v-model="formData.name"></el-input>
+        </el-form-item>
+        <el-form-item>
+          <el-button @click="formVisible = false">{{ T('Cancel') }}</el-button>
+          <el-button @click="submit" type="primary">{{ T('Submit') }}</el-button>
+        </el-form-item>
+      </el-form>
+    </el-dialog>
+  </div>
+</template>
+
+<script setup>
+  import { onMounted, reactive, watch, ref, onActivated } from 'vue'
+  import { list, create, update, detail, remove } from '@/api/device_group'
+  import { ElMessage, ElMessageBox } from 'element-plus'
+  import { T } from '@/utils/i18n'
+
+  const listRes = reactive({
+    list: [], total: 0, loading: false,
+  })
+  const listQuery = reactive({
+    page: 1,
+    page_size: 10,
+  })
+
+  const getList = async () => {
+    listRes.loading = true
+    const res = await list(listQuery).catch(_ => false)
+    listRes.loading = false
+    if (res) {
+      listRes.list = res.data.list
+      listRes.total = res.data.total
+    }
+  }
+  const handlerQuery = () => {
+    if (listQuery.page === 1) {
+      getList()
+    } else {
+      listQuery.page = 1
+    }
+  }
+
+  const del = async (row) => {
+    const cf = await ElMessageBox.confirm(T('Confirm?', { param: T('Delete') }), {
+      confirmButtonText: T('Confirm'),
+      cancelButtonText: T('Cancel'),
+      type: 'warning',
+    }).catch(_ => false)
+    if (!cf) {
+      return false
+    }
+
+    const res = await remove({ id: row.id }).catch(_ => false)
+    if (res) {
+      ElMessage.success(T('OperationSuccess'))
+      getList()
+    }
+  }
+  onMounted(getList)
+  onActivated(getList)
+
+  watch(() => listQuery.page, getList)
+
+  watch(() => listQuery.page_size, handlerQuery)
+
+  const formVisible = ref(false)
+  const formData = reactive({
+    id: 0,
+    name: '',
+    type: 1,
+  })
+
+  const toEdit = (row) => {
+    formVisible.value = true
+    formData.id = row.id
+    formData.name = row.name
+    formData.type = row.type
+  }
+  const toAdd = () => {
+    formVisible.value = true
+    formData.id = 0
+    formData.name = ''
+    formData.type = 1
+  }
+  const submit = async () => {
+    const api = formData.id ? update : create
+    const res = await api(formData).catch(_ => false)
+    if (res) {
+      ElMessage.success(T('OperationSuccess'))
+      formVisible.value = false
+      getList()
+    }
+  }
+
+</script>
+
+<style scoped lang="scss">
+
+</style>
@@ -1,26 +1,32 @@
 <template>
  <div>
    <el-card class="list-query" shadow="hover">
-      <el-form inline label-width="60px">
+      <el-form inline label-width="80px">
        <!--        <el-form-item label="名称">
                  <el-input v-model="listQuery.name"></el-input>
                </el-form-item>-->
        <el-form-item>
-          <el-button type="primary" @click="handlerQuery">筛选</el-button>
-          <el-button type="danger" @click="toAdd">添加</el-button>
+          <el-button type="primary" @click="handlerQuery">{{ T('Filter') }}</el-button>
+          <el-button type="danger" @click="toAdd">{{ T('Add') }}</el-button>
        </el-form-item>
      </el-form>
    </el-card>
    <el-card class="list-body" shadow="hover">
      <el-table :data="listRes.list" v-loading="listRes.loading" border>
-        <el-table-column prop="id" label="id" align="center"></el-table-column>
-        <el-table-column prop="name" label="名称" align="center"/>
-        <el-table-column prop="created_at" label="创建时间" align="center"/>
-        <el-table-column prop="updated_at" label="更新时间" align="center"/>
-        <el-table-column label="操作" align="center">
+        <el-table-column prop="id" label="ID" align="center"></el-table-column>
+        <el-table-column prop="name" :label="T('Name')" align="center"/>
+        <el-table-column prop="type" :label="T('Type')" align="center">
          <template #default="{row}">
-            <el-button @click="toEdit(row)">编辑</el-button>
-            <el-button type="danger" @click="del(row)">删除</el-button>
+            <span v-if="row.type === 1">{{ T('CommonGroup') }}</span>
+            <span v-else>{{ T('SharedGroup') }}</span>
+          </template>
+        </el-table-column>
+        <el-table-column prop="created_at" :label="T('CreatedAt')" align="center"/>
+        <el-table-column prop="updated_at" :label="T('UpdatedAt')" align="center"/>
+        <el-table-column :label="T('Actions')" align="center">
+          <template #default="{row}">
+            <el-button @click="toEdit(row)">{{ T('Edit') }}</el-button>
+            <el-button type="danger" @click="del(row)">{{ T('Delete') }}</el-button>
          </template>
        </el-table-column>
      </el-table>
@@ -34,22 +40,22 @@
                     :total="listRes.total">
      </el-pagination>
    </el-card>
-    <el-dialog v-model="formVisible" :title="!formData.id?'创建':'修改'" width="800">
+    <el-dialog v-model="formVisible" :title="!formData.id?T('Create'):T('Update')" width="800">
      <el-form class="dialog-form" ref="form" :model="formData" label-width="120px">
-        <el-form-item label="名称" prop="name" required>
+        <el-form-item :label="T('Name')" prop="name" required>
          <el-input v-model="formData.name"></el-input>
        </el-form-item>
-        <el-form-item label="类型" prop="type" required>
+        <el-form-item :label="T('Type')" prop="type" required>
          <el-radio-group v-model="formData.type">
            <el-radio v-for="item in groupTypes" :key="item.value" :label="item.value" style="display: block">
              {{ item.label }}
-            <span style="font-size: 12px;color: #999">{{item.note}}</span>
+              <span style="font-size: 12px;color: #999">{{ item.note }}</span>
            </el-radio>
          </el-radio-group>
        </el-form-item>
        <el-form-item>
-          <el-button @click="formVisible = false">取消</el-button>
-          <el-button @click="submit" type="primary">提交</el-button>
+          <el-button @click="formVisible = false">{{ T('Cancel') }}</el-button>
+          <el-button @click="submit" type="primary">{{ T('Submit') }}</el-button>
        </el-form-item>
      </el-form>
    </el-dialog>
@@ -60,6 +66,7 @@
  import { onMounted, reactive, watch, ref, onActivated } from 'vue'
  import { list, create, update, detail, remove } from '@/api/group'
  import { ElMessage, ElMessageBox } from 'element-plus'
+  import { T } from '@/utils/i18n'

  const listRes = reactive({
    list: [], total: 0, loading: false,
@@ -87,9 +94,9 @@
  }

  const del = async (row) => {
-    const cf = await ElMessageBox.confirm('确定删除么?', {
-      confirmButtonText: '确定',
-      cancelButtonText: '取消',
+    const cf = await ElMessageBox.confirm(T('Confirm?', { param: T('Delete') }), {
+      confirmButtonText: T('Confirm'),
+      cancelButtonText: T('Cancel'),
      type: 'warning',
    }).catch(_ => false)
    if (!cf) {
@@ -98,7 +105,7 @@

    const res = await remove({ id: row.id }).catch(_ => false)
    if (res) {
-      ElMessage.success('操作成功')
+      ElMessage.success(T('OperationSuccess'))
      getList()
    }
  }
@@ -110,14 +117,14 @@
  watch(() => listQuery.page_size, handlerQuery)

  const groupTypes = [
-    { label: '普通组', value: 1, note: '只有管理员能看到小组成员和成员地址簿' },
-    { label: '共享组', value: 2, note: '所有用户都能看到小组成员和成员地址簿' },
+    { label: T('CommonGroup'), value: 1, note: T('CommonGroupNote') },
+    { label: T('SharedGroup'), value: 2, note: T('SharedGroupNote') },
  ]
  const formVisible = ref(false)
  const formData = reactive({
    id: 0,
    name: '',
-    type: 1
+    type: 1,
  })

  const toEdit = (row) => {
@@ -136,7 +143,7 @@
    const api = formData.id ? update : create
    const res = await api(formData).catch(_ => false)
    if (res) {
-      ElMessage.success('操作成功')
+      ElMessage.success(T('OperationSuccess'))
      formVisible.value = false
      getList()
    }
@@ -1,11 +1,18 @@
-import { reactive } from 'vue'
-import { list, remove } from '@/api/login_log'
+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'

-export function useRepositories () {
-  const route = useRoute()
-  const user_id = route.query?.user_id
+const apis = {
+  admin: { batchDelete: admin_batchDelete, list: admin_list, remove: admin_remove, fetchPeers: admin_fetchPeers },
+  my: { batchDelete: my_batchDelete, list: my_list, remove: my_remove, fetchPeers: my_fetchPeers },
+}
+
+export function useRepositories (api_type = 'my') {

  const listRes = reactive({
    list: [], total: 0, loading: false,
@@ -14,14 +21,29 @@ export function useRepositories () {
    page: 1,
    page_size: 10,
    is_my: 0,
-    user_id: user_id ? parseInt(user_id) : null,
+    user_id: null,
  })

  const getList = async () => {
    listRes.loading = true
-    const res = await list(listQuery).catch(_ => false)
+    const res = await apis[api_type].list(listQuery).catch(_ => false)
    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) {
+        //uuids去重
+        const uniqueUuids = [...new Set(uuids)]
+        const peers = await apis[api_type].fetchPeers({ uuids: uniqueUuids }).catch(_ => false)
+        if (peers?.data?.list) {
+          res.data.list.forEach(item => {
+            if (item.uuid) {
+              item.peer = peers.data.list.find(peer => peer.uuid === item.uuid)
+            }
+          })
+        }
+      }
+
      listRes.list = res.data.list
      listRes.total = res.data.total
    }
@@ -35,27 +57,66 @@ export function useRepositories () {
  }

  const del = async (row) => {
-    const cf = await ElMessageBox.confirm('确定删除么?', {
-      confirmButtonText: '确定',
-      cancelButtonText: '取消',
+    const cf = await ElMessageBox.confirm(T('Confirm?', { param: T('Delete') }), {
+      confirmButtonText: T('Confirm'),
+      cancelButtonText: T('Cancel'),
      type: 'warning',
    }).catch(_ => false)
    if (!cf) {
      return false
    }

-    const res = await remove({ id: row.id }).catch(_ => false)
+    const res = await apis[api_type].remove({ id: row.id }).catch(_ => false)
    if (res) {
-      ElMessage.success('操作成功')
+      ElMessage.success(T('OperationSuccess'))
      getList()
    }
  }

+  const batchdel = async (rows) => {
+    const ids = rows.map(r => r.id)
+    if (!ids.length) {
+      ElMessage.warning(T('PleaseSelectData'))
+      return false
+    }
+    const cf = await ElMessageBox.confirm(T('Confirm?', { param: T('BatchDelete') }), {
+      confirmButtonText: T('Confirm'),
+      cancelButtonText: T('Cancel'),
+      type: 'warning',
+    }).catch(_ => false)
+    if (!cf) {
+      return false
+    }
+
+    const res = await apis[api_type].batchDelete({ ids }).catch(_ => false)
+    if (res) {
+      ElMessage.success(T('OperationSuccess'))
+      getList()
+    }
+  }
+
+  // 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,
    getList,
    handlerQuery,
    del,
+    batchdel,
+    toExport,
  }
 }
@@ -1,8 +1,8 @@
 <template>
  <div>
    <el-card class="list-query" shadow="hover">
-      <el-form inline label-width="60px">
-        <el-form-item label="用户">
+      <el-form inline label-width="80px">
+        <el-form-item :label="T('User')">
          <el-select v-model="listQuery.user_id" clearable>
            <el-option
                v-for="item in allUsers"
@@ -13,29 +13,35 @@
          </el-select>
        </el-form-item>
        <el-form-item>
-          <el-button type="primary" @click="handlerQuery">筛选</el-button>
-          <el-button type="danger" @click="toAdd">添加</el-button>
+          <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>
    <el-card class="list-body" shadow="hover">
-      <!--      <el-tag type="danger" style="margin-bottom: 10px">不建议在此操作地址簿，可能会造成数据不同步</el-tag>-->
-      <el-table :data="listRes.list" v-loading="listRes.loading" border>
-        <el-table-column prop="id" label="id" align="center" width="100"/>
-        <el-table-column label="所属用户" align="center" width="120">
+      <el-table :data="listRes.list" v-loading="listRes.loading" border @selection-change="handleSelectionChange">
+        <el-table-column type="selection" align="center" width="50"/>
+        <el-table-column prop="id" label="ID" align="center" width="100"/>
+        <el-table-column :label="T('Owner')" align="center" width="120">
          <template #default="{row}">
            <span v-if="row.user_id"> <el-tag>{{ allUsers?.find(u => u.id === row.user_id)?.username }}</el-tag> </span>
          </template>
        </el-table-column>
        <el-table-column prop="client" label="client" align="center" width="120"/>
+        <el-table-column prop="peer.id" :label="T('Peer')" align="center">
+          <template #default="{row}">
+            {{ row.device_id ? row.device_id : peer?.id }}
+          </template>
+        </el-table-column>
        <el-table-column prop="uuid" label="uuid" align="center"/>
        <el-table-column prop="ip" label="ip" align="center" width="150"/>
        <el-table-column prop="type" label="type" align="center" width="100"/>
-        <el-table-column prop="platform" label="platform" align="center" width="120"/>
-        <el-table-column prop="created_at" label="时间" align="center"/>
-        <el-table-column label="操作" align="center" width="400">
+        <el-table-column prop="platform" label="Platform/UA" align="center" width="120" show-overflow-tooltip/>
+        <el-table-column prop="created_at" :label="T('CreatedAt')" align="center"/>
+        <el-table-column :label="T('Actions')" align="center" width="400">
          <template #default="{row}">
-            <el-button type="danger" @click="del(row)">删除</el-button>
+            <el-button type="danger" @click="del(row)">{{ T('Delete') }}</el-button>
          </template>
        </el-table-column>
      </el-table>
@@ -53,9 +59,12 @@
 </template>

 <script setup>
-  import { onActivated, onMounted, watch } from 'vue'
+  import { onActivated, onMounted, ref, watch } from 'vue'
  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()
@@ -66,7 +75,9 @@
    getList,
    handlerQuery,
    del,
-  } = useRepositories()
+    batchdel,
+    toExport,
+  } = useRepositories('admin')

  onMounted(getList)
  onActivated(getList)
@@ -74,6 +85,16 @@
  watch(() => listQuery.page, getList)

  watch(() => listQuery.page_size, handlerQuery)
+  const multipleSelection = ref([])
+  const handleSelectionChange = (val) => {
+    multipleSelection.value = val
+  }
+  const toBatchDelete = () => {
+    if (multipleSelection.value.length === 0) {
+      return
+    }
+    batchdel(multipleSelection.value)
+  }

 </script>

@@ -1,105 +1,296 @@
 <template>
-  <div class="login">
-    <el-card class="login-card">
-      <h1>登录</h1>
-      <el-form label-width="60px">
-        <el-form-item label="用户名">
-          <el-input v-model="form.username"></el-input>
+  <div class="login-container">
+    <div class="login-card">
+      <img src="@/assets/logo.png" alt="logo" class="login-logo"/>
+
+      <el-form v-if="!disablePwd" label-position="top" class="login-form">
+        <el-form-item :label="T('Username')">
+          <el-input v-model="form.username" type="username" class="login-input"></el-input>
        </el-form-item>
-        <el-form-item label="密码">
-          <el-input v-model="form.password" type="password" @keyup.enter.native="login" show-password></el-input>
+
+        <el-form-item :label="T('Password')">
+          <el-input v-model="form.password" type="password" @keyup.enter.native="login" show-password
+                    class="login-input"></el-input>
+        </el-form-item>
+        <el-form-item :label="T('Captcha')" v-if="captchaCode">
+          <el-input v-model="form.captcha" @keyup.enter.native="login"  class="login-input captcha-input">
+            <template #append>
+              <img :src="captchaCode.b64" @click="loadCaptcha" class="captcha" alt="captcha"/>
+            </template>
+          </el-input>
        </el-form-item>
        <el-form-item>
-          <el-button @click="login" type="primary">登录</el-button>
+          <el-button @click="login" type="primary" class="login-button">{{ T('Login') }}</el-button>
+          <el-button v-if="allowRegister" @click="register" class="login-button">{{ T('Register') }}</el-button>
        </el-form-item>
      </el-form>
-    </el-card>
+
+      <div class="divider" v-if="options.length > 0 && !disablePwd">
+        <span>{{ T('or login in with') }}</span>
+      </div>
+
+      <div class="oidc-options">
+        <div v-for="(option, index) in options" :key="index" class="oidc-option">
+          <el-button @click="handleOIDCLogin(option.name)" class="oidc-btn">
+            <img :src="getProviderImage(option.name)" alt="provider" class="oidc-icon"/>
+            <span>{{ T(option.name) }}</span>
+          </el-button>
+        </div>
+      </div>
+    </div>
  </div>
 </template>

-<script>
-  import { defineComponent, reactive } from 'vue'
+<script setup>
+  import { reactive, onMounted, ref } from 'vue'
  import { useUserStore } from '@/store/user'
  import { ElMessage } from 'element-plus'
+  import { T } from '@/utils/i18n'
  import { useRoute, useRouter } from 'vue-router'
+  import { loginOptions, captcha } from '@/api/login'
+  import { getCode, removeCode } from '@/utils/auth'

-  export default defineComponent({
-    setup (props) {
-      const userStore = useUserStore()
-      const route = useRoute()
-      const router = useRouter()
+  const oauthInfo = ref({})
+  const userStore = useUserStore()
+  const route = useRoute()
+  const router = useRouter()
+  const options = reactive([]) // 存储 OIDC 登录选项

-      let platform = window.navigator.platform
-      if (navigator.platform.indexOf('Mac') === 0) {
-        platform = 'mac'
-      } else if (navigator.platform.indexOf('Win') === 0) {
-        platform = 'windows'
-      } else if (navigator.platform.indexOf('Linux armv') === 0) {
-        platform = 'android'
-      } else if (navigator.platform.indexOf('Linux') === 0) {
-        platform = 'linux'
-      }
+  let platform = window.navigator.platform
+  if (navigator.platform.indexOf('Mac') === 0) {
+    platform = 'mac'
+  } else if (navigator.platform.indexOf('Win') === 0) {
+    platform = 'windows'
+  } else if (navigator.platform.indexOf('Linux armv') === 0) {
+    platform = 'android'
+  } else if (navigator.platform.indexOf('Linux') === 0) {
+    platform = 'linux'
+  }
+  const userAgent = navigator.userAgent
+  let browser = 'Unknown Browser'
+  if (/chrome|crios/i.test(userAgent)) browser = 'Chrome'
+  else if (/firefox|fxios/i.test(userAgent)) browser = 'Firefox'
+  else if (/safari/i.test(userAgent) && !/chrome/i.test(userAgent)) browser = 'Safari'
+  else if (/edg/i.test(userAgent)) browser = 'Edge'

-      const form = reactive({
-        username: '',
-        password: '',
-        platform: platform,
-      })
-      const redirect = route.query?.redirect
-      const login = async () => {
-        const res = await userStore.login(form)
-        if (res) {
-          ElMessage.success('登录成功')
-          router.push({ path: redirect || '/', replace: true })
-        }
-      }
-      return {
-        redirect,
-        form,
-        login,
-      }
-    },
+  const form = reactive({
+    username: '',
+    password: '',
+    platform: platform,
+    captcha: '',
+    captcha_id: ''
  })
+
+  const captchaCode = ref('')
+  const redirect = route.query?.redirect
+  const login = async () => {
+    const res = await userStore.login(form).catch(e => e)
+    if (!res.code) {
+      ElMessage.success(T('LoginSuccess'))
+      router.push({ path: redirect || '/', replace: true })
+      return
+    }
+    if (res.code === 110) {
+      // need captcha
+      loadCaptcha()
+    }
+  }
+
+  const loadCaptcha = async () => {
+    const captchaRes = await captcha().catch(_ => false)
+    console.log(captchaRes)
+    captchaCode.value = captchaRes.data.captcha
+    form.captcha_id = captchaRes.data.captcha.id
+  }
+
+  const handleOIDCLogin = (provider) => {
+    userStore.oidc(provider, platform, browser)
+  }
+
+  import googleImage from '@/assets/google.png'
+  import githubImage from '@/assets/github.png'
+  import oidcImage from '@/assets/oidc.png'
+  import webauthImage from '@/assets/webauth.png'
+  import defaultImage from '@/assets/oidc.png'
+
+  const providerImageMap = {
+    google: googleImage,
+    github: githubImage,
+    oidc: oidcImage,
+    // WebAuth: webauthImage,
+    default: defaultImage,
+  }
+
+  const getProviderImage = (provider) => {
+    return providerImageMap[provider.toLowerCase()] || providerImageMap.default
+  }
+
+  const allowRegister = ref(false)
+  const disablePwd = ref(false)
+  const loadLoginOptions = async () => {
+    try {
+      const res = await loginOptions().catch(_ => false)
+      if (!res || !res.data) return console.error('No valid response received')
+      res.data.ops.map(option => (options.push({ name: option }))) // 创建新的对象数组
+      if (res.data.auto_oidc) {
+        // 如果有自动OIDC登录选项，直接调用第一个
+        handleOIDCLogin(res.data.ops[0])
+      }
+      disablePwd.value = res.data.disable_pwd
+      allowRegister.value = res.data.register
+      if (res.data.need_captcha) {
+        loadCaptcha()
+      }
+    } catch (error) {
+      console.error('Error loading login options:', error.message)
+    }
+  }
+
+  onMounted(async () => {
+    const code = getCode()
+    if (code) {
+      // 如果code存在，进行query获取user info
+      const res = await userStore.query(code)
+      if (res) {
+        // 删除code，确保跳转之前对code进行清楚
+        removeCode()
+        ElMessage.success(T('LoginSuccess'))
+        router.push({ path: redirect || '/', replace: true })
+      }
+    } else {
+      // 如果code不存在, 现实登陆页面
+      loadLoginOptions() // 组件挂载后调用登录选项加载函数
+    }
+  })
+
+  const register = () => {
+    router.push('/register')
+  }
 </script>

 <style scoped lang="scss">
-.login {
-  width: 100vw;
+.login-container {
+  display: flex;
+  justify-content: center;
+  align-items: center;
  height: 100vh;
  background-color: #2d3a4b;
-  padding-top: 25vh;
+  padding: 20px;
  box-sizing: border-box;
+}

-  .tips {
-    font-size: 12px;
-    color: #fff;
-    margin-left: 60px;
+.login-card {
+  width: 360px;
+  background-color: #283342;
+  padding: 40px;
+  border-radius: 8px;
+  box-shadow: 0 4px 8px rgba(0, 0, 0, 0.1);
+  text-align: center;
+}
+
+h1 {
+  margin-bottom: 20px;
+  font-size: 24px;
+  font-weight: bold;
+}
+
+.login-form {
+  margin-bottom: 20px;
+}
+
+.login-input {
+  width: 100%;
+  .captcha{
+    cursor: pointer;
+    width: 150px;
+  }
+}
+.captcha-input{
+  :deep(.el-input-group__append) {
+    border-radius: 5px;
+    padding: 0;
+    overflow: hidden;
+  }
+}
+
+.login-button {
+  width: 100%;
+  height: 40px;
+  margin-bottom: 20px;
+  margin-left: 0;
+}
+
+.divider {
+  display: flex;
+  align-items: center;
+  margin: 20px 0;
+  font-size: 14px;
+  color: #888;
+
+  &::before,
+  &::after {
+    content: '';
+    flex: 1;
+    height: 1px;
+    background-color: #ddd;
  }

-  .login-card {
-    max-width: 500px;
-    background-color: #283342;
+  &::before {
+    margin-right: 10px;
+  }
+
+  &::after {
+    margin-left: 10px;
+  }
+}
+
+.oidc-options {
+  display: flex;
+  flex-direction: column;
+  gap: 10px;
+}
+
+.oidc-btn {
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  gap: 10px;
+  width: 100%;
+  height: 50px;
+  background-color: white;
+  border: 1px solid #ddd;
+  border-radius: 4px;
+  color: black;
+  font-size: 14px;
+  box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1);
+}
+
+.oidc-icon {
+  width: 24px;
+  height: 24px;
+  margin-right: 10px;
+}
+
+.login-logo {
+  width: 80px;
+  height: 80px;
+  margin: 0 auto 20px;
+  display: block;
+}
+
+.el-form-item {
+  ::v-deep(.el-form-item__label) {
    color: #fff;
-    border: none;
-    margin: 0 auto;
+  }

-    .el-form-item {
+  .el-input {
+    ::v-deep(.el-input__wrapper) {
+      border: 1px solid rgba(255, 255, 255, 0.1);
+      background: transparent;
+    }

-      ::v-deep(.el-form-item__label) {
-        color: #fff;
-      }
-
-      .el-input {
-
-        ::v-deep(.el-input__wrapper) {
-          border: 1px solid rgba(255, 255, 255, 0.1);
-          background: transparent;
-        }
-
-        ::v-deep(input) {
-          color: #fff;
-        }
-      }
+    ::v-deep(input) {
+      color: #fff;
    }
  }
 }
@@ -0,0 +1,102 @@
+<template>
+  <div>
+    <el-card class="list-query" shadow="hover">
+      <el-form inline label-width="80px">
+        <el-form-item>
+          <el-button type="primary" @click="handlerQuery">{{ T('Filter') }}</el-button>
+          <el-button type="danger" @click="toAdd">{{ T('Add') }}</el-button>
+        </el-form-item>
+      </el-form>
+    </el-card>
+    <el-card class="list-body" shadow="hover">
+      <el-tag type="danger" effect="light" style="margin-bottom: 10px">{{ T('MyAddressBookTips') }}</el-tag>
+      <el-table :data="list" v-loading="listRes.loading" border>
+        <!--        <el-table-column prop="id" label="ID" align="center"/>-->
+        <el-table-column prop="name" :label="T('Name')" align="center"/>
+        <el-table-column prop="created_at" :label="T('CreatedAt')" align="center"/>
+        <!--        <el-table-column prop="updated_at" label="更新时间" align="center"/>-->
+        <el-table-column :label="T('Actions')" align="center" class-name="table-actions" width="600" fixed="right">
+          <template #default="{row}">
+            <template v-if="row.id>0">
+              <el-button type="primary" @click="showRules(row)">{{ T('ShareRules') }}</el-button>
+              <el-button @click="toEdit(row)">{{ T('Edit') }}</el-button>
+              <el-button type="danger" @click="del(row)">{{ T('Delete') }}</el-button>
+            </template>
+          </template>
+        </el-table-column>
+      </el-table>
+    </el-card>
+    <el-card class="list-page" shadow="hover">
+      <el-pagination background
+                     layout="prev, pager, next, sizes, jumper"
+                     :page-sizes="[10,20,50,100]"
+                     v-model:page-size="listQuery.page_size"
+                     v-model:current-page="listQuery.page"
+                     :total="listRes.total">
+      </el-pagination>
+    </el-card>
+    <el-dialog v-model="formVisible" width="800" :title="!formData.id?T('Create') :T('Update') ">
+      <el-form class="dialog-form" ref="form" :model="formData" label-width="120px">
+        <el-form-item :label="T('Name')" prop="name" required>
+          <el-input v-model="formData.name"></el-input>
+        </el-form-item>
+        <el-form-item>
+          <el-button @click="formVisible = false">{{ T('Cancel') }}</el-button>
+          <el-button @click="submit" type="primary">{{ T('Submit') }}</el-button>
+        </el-form-item>
+      </el-form>
+    </el-dialog>
+    <el-dialog v-model="rulesVisible" :title="T('ShareRules')" destroy-on-close top="5vh" width="80%">
+      <Rule :collection="clickRow" :is_my="1"></Rule>
+    </el-dialog>
+
+  </div>
+</template>
+
+<script setup>
+  import { T } from '@/utils/i18n'
+  import { computed, ref } from 'vue'
+  import { useRepositories } from '@/views/address_book/collection'
+  import { onActivated, onMounted, watch } from 'vue'
+  import Rule from '@/views/address_book/rule.vue'
+
+  const {
+    listRes,
+    listQuery,
+    getList,
+    handlerQuery,
+    del,
+    formVisible,
+    formData,
+    toEdit,
+    toAdd,
+    submit,
+  } = useRepositories('my')
+
+  onMounted(getList)
+
+  watch(() => listQuery.page, getList)
+
+  watch(() => listQuery.page_size, handlerQuery)
+  const list = computed(_ => {
+    if (listQuery.page > 1) {
+      return listRes.list
+    } else {
+      return [
+        { id: 0, name: T('MyAddressBook') },
+        ...listRes.list,
+      ]
+    }
+  })
+  const clickRow = ref({})
+  const rulesVisible = ref(false)
+  const showRules = (row) => {
+    clickRow.value = row
+    rulesVisible.value = true
+  }
+
+</script>
+
+<style scoped lang="scss">
+
+</style>
@@ -1,30 +1,65 @@
 <template>
  <div>
    <el-card class="list-query" shadow="hover">
-      <el-form inline label-width="60px">
+      <el-form inline label-width="120px">
+        <el-form-item :label="T('AddressBookName')">
+          <el-select v-model="listQuery.collection_id" clearable>
+            <el-option :value="0" :label="T('MyAddressBook')"></el-option>
+            <el-option v-for="c in collectionListRes.list" :key="c.id" :label="c.name" :value="c.id"></el-option>
+          </el-select>
+        </el-form-item>
+        <el-form-item :label="T('Id')">
+          <el-input v-model="listQuery.id" clearable></el-input>
+        </el-form-item>
+        <el-form-item :label="T('Username')">
+          <el-input v-model="listQuery.username" clearable></el-input>
+        </el-form-item>
+        <el-form-item :label="T('Hostname')">
+          <el-input v-model="listQuery.hostname" clearable></el-input>
+        </el-form-item>
        <el-form-item>
-          <el-button type="primary" @click="handlerQuery">筛选</el-button>
-          <el-button type="danger" @click="toAdd">添加</el-button>
+          <el-button type="primary" @click="handlerQuery">{{ T('Filter') }}</el-button>
+          <el-button type="danger" @click="toAdd">{{ T('Add') }}</el-button>
+          <el-button type="primary" @click="showBatchEditTags">{{ T('BatchEditTags') }}</el-button>
        </el-form-item>
      </el-form>
    </el-card>
    <el-card class="list-body" shadow="hover">
-      <!--      <el-tag type="danger" style="margin-bottom: 10px">不建议在此操作地址簿，可能会造成数据不同步</el-tag>-->
-      <el-table :data="listRes.list" v-loading="listRes.loading" border>
-        <el-table-column prop="id" label="id" align="center"/>
-        <el-table-column prop="username" label="用户名" align="center"/>
-        <el-table-column prop="hostname" label="主机名" align="center"/>
-        <el-table-column prop="alias" label="别名" align="center"/>
-        <el-table-column prop="platform" label="平台" align="center"/>
-        <el-table-column prop="hash" label="hash" align="center"/>
-        <el-table-column prop="tags" label="标签" align="center"/>
+      <el-table :data="listRes.list" v-loading="listRes.loading" border @selection-change="handleSelectionChange">
+        <el-table-column type="selection" width="50" align="center"></el-table-column>
+        <el-table-column prop="id" label="ID" align="center" width="200">
+          <template #default="{row}">
+            <div>
+              <PlatformIcons :name="platformList.find(p=>p.label===row.platform)?.icon" style="width: 20px;height: 20px;display: inline-block" color="var(--basicBlack)"/>
+              {{ row.id }}
+              <el-icon @click="handleClipboard(row.id, $event)">
+                <CopyDocument/>
+              </el-icon>
+            </div>
+          </template>
+        </el-table-column>
+        <el-table-column prop="collection_id" :label="T('AddressBookName')" align="center" width="150">
+          <template #default="{row}">
+            <span v-if="row.collection_id === 0">{{ T('MyAddressBook') }}</span>
+            <span v-else>{{ collectionListRes.list.find(c => c.id === row.collection_id)?.name }}</span>
+          </template>
+        </el-table-column>
+        <el-table-column prop="username" :label="T('Username')" align="center" width="150"/>
+        <el-table-column prop="hostname" :label="T('Hostname')" align="center" width="150"/>
+        <!--        <el-table-column prop="platform" :label="T('Platform')" align="center" width="120"/>-->
+        <el-table-column prop="tags" :label="T('Tags')" align="center"/>
        <!--        <el-table-column prop="created_at" label="创建时间" align="center"/>-->
        <!--        <el-table-column prop="updated_at" label="更新时间" align="center"/>-->
-        <el-table-column label="操作" align="center" width="400">
+        <el-table-column prop="alias" :label="T('Alias')" align="center" width="150"/>
+        <el-table-column prop="peer.version" :label="T('Version')" align="center" width="100"/>
+        <el-table-column prop="hash" :label="T('Hash')" align="center" width="150" show-overflow-tooltip/>
+        <el-table-column :label="T('Actions')" align="center" class-name="table-actions" width="600" fixed="right">
          <template #default="{row}">
-            <el-button type="success" @click="toWebClientLink(row)">Web-Client</el-button>
-            <el-button @click="toEdit(row)">编辑</el-button>
-            <el-button type="danger" @click="del(row)">删除</el-button>
+            <el-button type="success" @click="connectByClient(row.id)">{{ T('Link') }}</el-button>
+            <el-button v-if="appStore.setting.appConfig.web_client" type="success" @click="toWebClientLink(row)">Web Client</el-button>
+            <el-button v-if="appStore.setting.appConfig.web_client" type="primary" @click="toShowShare(row)">{{ T('ShareByWebClient') }}</el-button>
+            <el-button @click="toEdit(row)">{{ T('Edit') }}</el-button>
+            <el-button type="danger" @click="del(row)">{{ T('Delete') }}</el-button>
          </template>
        </el-table-column>
      </el-table>
@@ -38,30 +73,36 @@
                     :total="listRes.total">
      </el-pagination>
    </el-card>
-    <el-dialog v-model="formVisible" width="800" :title="!formData.row_id?'创建':'修改'">
+    <el-dialog v-model="formVisible" width="800" :title="!formData.row_id?T('Create') :T('Update') ">
      <el-form class="dialog-form" ref="form" :model="formData" label-width="120px">
-        <el-form-item label="id" prop="id" required>
+        <el-form-item :label="T('AddressBookName')" required prop="collection_id">
+          <el-select v-model="formData.collection_id" clearable @change="changeCollectionForUpdate">
+            <el-option :value="0" :label="T('MyAddressBook')"></el-option>
+            <el-option v-for="c in collectionListResForUpdate.list" :key="c.id" :label="c.name" :value="c.id"></el-option>
+          </el-select>
+        </el-form-item>
+        <el-form-item label="ID" prop="id" required>
          <el-input v-model="formData.id"></el-input>
        </el-form-item>
-        <el-form-item label="用户名" prop="username">
+        <el-form-item :label="T('Username')" prop="username">
          <el-input v-model="formData.username"></el-input>
        </el-form-item>
-        <el-form-item label="别名" prop="alias">
+        <el-form-item :label="T('Alias')" prop="alias">
          <el-input v-model="formData.alias"></el-input>
        </el-form-item>
-        <el-form-item label="hash" prop="hash">
+        <el-form-item :label="T('Hash')" prop="hash">
          <el-input v-model="formData.hash"></el-input>
        </el-form-item>
-        <el-form-item label="主机名" prop="hostname">
+        <el-form-item :label="T('Hostname')" prop="hostname">
          <el-input v-model="formData.hostname"></el-input>
        </el-form-item>
-        <el-form-item label="登录名" prop="login_name">
-          <el-input v-model="formData.login_name"></el-input>
-        </el-form-item>
-        <el-form-item label="密码" prop="password">
-          <el-input v-model="formData.password"></el-input>
-        </el-form-item>
-        <el-form-item label="平台" prop="platform">
+        <!--        <el-form-item :label="T('LoginName')" prop="loginName">
+                  <el-input v-model="formData.loginName"></el-input>
+                </el-form-item>-->
+        <!--        <el-form-item :label="T('Password')" prop="password">
+                          <el-input v-model="formData.password"></el-input>
+                        </el-form-item>-->
+        <el-form-item :label="T('Platform')" prop="platform">
          <el-select v-model="formData.platform">
            <el-option
                v-for="item in platformList"
@@ -72,36 +113,60 @@
          </el-select>
        </el-form-item>

-        <el-form-item label="标签" prop="tags">
+        <el-form-item :label="T('Tags')" prop="tags">
          <el-select v-model="formData.tags" multiple>
            <el-option
-                v-for="item in tagList"
+                v-for="item in tagListRes.list"
                :key="item.name"
                :label="item.name"
                :value="item.name"
            ></el-option>
          </el-select>
        </el-form-item>
-        <!-- <el-form-item label="强制中继" prop="force_always_relay" required>
-                <el-switch v-model="formData.force_always_relay"></el-switch>
-              </el-form-item>
-         <el-form-item label="在线" prop="online">
-                <el-switch v-model="formData.online"></el-switch>
-              </el-form-item>
-              <el-form-item label="rdp端口" prop="rdp_port">
-                <el-input v-model="formData.rdp_port"></el-input>
-              </el-form-item>
-              <el-form-item label="rdp用户名" prop="rdp_username">
-                <el-input v-model="formData.rdp_username"></el-input>
-              </el-form-item>
-              <el-form-item label="同一服务器" prop="same_server">
-                <el-switch v-model="formData.same_server"></el-switch>
-              </el-form-item>-->
+        <!-- <el-form-item label="强制中继" prop="forceAlwaysRelay" required>
+                 <el-switch v-model="formData.forceAlwaysRelay"></el-switch>
+               </el-form-item>
+          <el-form-item label="在线" prop="online">
+                 <el-switch v-model="formData.online"></el-switch>
+               </el-form-item>
+               <el-form-item label="rdp端口" prop="rdpPort">
+                 <el-input v-model="formData.rdpPort"></el-input>
+               </el-form-item>
+               <el-form-item label="rdp用户名" prop="rdpUsername">
+                 <el-input v-model="formData.rdpUsername"></el-input>
+               </el-form-item>
+               <el-form-item label="同一服务器" prop="sameServer">
+                 <el-switch v-model="formData.sameServer"></el-switch>
+               </el-form-item>-->


        <el-form-item>
-          <el-button @click="formVisible = false">取消</el-button>
-          <el-button @click="submit" type="primary">提交</el-button>
+          <el-button @click="formVisible = false">{{ T('Cancel') }}</el-button>
+          <el-button @click="submit" type="primary">{{ T('Submit') }}</el-button>
+        </el-form-item>
+      </el-form>
+    </el-dialog>
+    <el-dialog v-model="shareToWebClientVisible" width="900" :close-on-click-modal="false">
+      <shareByWebClient :id="shareToWebClientForm.id"
+                        :hash="shareToWebClientForm.hash"
+                        @cancel="shareToWebClientVisible=false"
+                        @success=""/>
+    </el-dialog>
+    <el-dialog v-model="batchEditTagVisible" width="800">
+      <el-form :model="batchEditTagsFormData" label-width="120px" class="dialog-form">
+        <el-form-item :label="T('Tags')" prop="tags">
+          <el-select v-model="batchEditTagsFormData.tags" multiple>
+            <el-option
+                v-for="item in tagListResForBatchEdit.list"
+                :key="item.name"
+                :label="item.name"
+                :value="item.name"
+            ></el-option>
+          </el-select>
+        </el-form-item>
+        <el-form-item>
+          <el-button @click="batchEditTagVisible = false">{{ T('Cancel') }}</el-button>
+          <el-button @click="submitBatchEditTags" type="primary">{{ T('Submit') }}</el-button>
        </el-form-item>
      </el-form>
    </el-dialog>
@@ -110,38 +175,43 @@

 <script setup>
  import { onActivated, onMounted, reactive, ref, watch } from 'vue'
-  import { create, list, remove, update } from '@/api/address_book'
-  import { list as fetchTagList } from '@/api/tag'
-  import { useRepositories } from '@/views/address_book'
+  import { useBatchUpdateTagsRepositories, useRepositories } from '@/views/address_book'
  import { toWebClientLink } from '@/utils/webclient'
+  import { T } from '@/utils/i18n'
+  import shareByWebClient from '@/views/address_book/components/shareByWebClient.vue'
+  import { useAppStore } from '@/store/app'
+  import { connectByClient } from '@/utils/peer'
+  import { handleClipboard } from '@/utils/clipboard'
+  import { CopyDocument } from '@element-plus/icons'
+  import PlatformIcons from '@/components/icons/platform.vue'

-  const tagList = ref([])
-  const fetchTagListData = async () => {
-    const res = await fetchTagList({ is_my: 1 }).catch(_ => false)
-    if (res) {
-      tagList.value = res.data.list
-    }
-  }
-  fetchTagListData()
-
+  const appStore = useAppStore()
  const {
    listRes,
    listQuery,
    getList,
    handlerQuery,
+    collectionListRes,
+    getCollectionList,
+
    del,
+
    formVisible,
    platformList,
    formData,
    toEdit,
    toAdd,
    submit,
-    activeChange,
-    currentColor,
-  } = useRepositories()
+    tagListRes,
+    changeCollectionForUpdate,
+    getCollectionListForUpdate,
+    collectionListResForUpdate,
+    // collectionListQuery,

-  listQuery.is_my = 1
+  } = useRepositories('my')

+  onMounted(getCollectionList)
+  onMounted(getCollectionListForUpdate)
  onMounted(getList)
  onActivated(getList)

@@ -149,35 +219,43 @@

  watch(() => listQuery.page_size, handlerQuery)

-  watch(() => listRes.list, () => {
-        const peers = {}
-        listRes.list.map(item => {
-          peers[item.id] = {
-            'view-style': 'shrink',
-            tm: new Date().getTime(),
-            info: {
-              'id': item.id,
-              'username': item.username,
-              'hostname': item.hostname,
-              'alias': item.alias,
-              'platform': item.platform,
-              'hash': item.hash,
-              'tags': item.tags,
-            },
-          }
-        })
-        localStorage.setItem('peers', JSON.stringify(peers))
-      },
-      {
-        immediate: true,
-      })
+  const shareToWebClientVisible = ref(false)
+  const shareToWebClientForm = reactive({
+    id: '',
+    hash: '',
+  })
+  const toShowShare = (row) => {
+    shareToWebClientForm.id = row.id
+    shareToWebClientForm.hash = row.hash
+    shareToWebClientVisible.value = true
+  }
+  const {
+    tagListRes: tagListResForBatchEdit,
+    getTagList: getTagListForBatchEdit,
+    visible: batchEditTagVisible,
+    show: showBatchEditTags,
+    formData: batchEditTagsFormData,
+    submit: _submitBatchEditTags,
+  } = useBatchUpdateTagsRepositories()
+  onMounted(getTagListForBatchEdit)
+  const submitBatchEditTags = async () => {
+    const res = await _submitBatchEditTags().catch(_ => false)
+    if (res) {
+      getList()
+    }
+  }
+
+  const multipleSelection = ref([])
+  const handleSelectionChange = (val) => {
+    multipleSelection.value = val
+
+    batchEditTagsFormData.value.row_ids = val.map(v => v.row_id)
+  }
+

 </script>

 <style scoped lang="scss">
-.list-query .el-select {
-  --el-select-width: 160px;
-}

 .colors {
  display: flex;
@@ -0,0 +1,313 @@
+<template>
+  <el-container class="address-book-con">
+    <el-aside width="200px" class="aside">
+      <el-select style="width: 100%;" v-model="listQuery.collection_id" filterable>
+        <el-option :value="0" :label="T('MyAddressBook')"></el-option>
+        <el-option v-for="c in collectionListRes.list" :key="c.id" :label="c.name" :value="c.id"></el-option>
+      </el-select>
+      <div class="aside-tags">
+        <div class="top" style="width: 100%">标签</div>
+        <div v-for="t in tagListRes.list"
+             :key="t.id" class="tag"
+             :class="{checked: checkedTags.includes(t.name)}"
+             :style="{backgroundColor: checkedTags.includes(t.name)?t.color:''}"
+             @click="toggleTag(t)"
+        >
+          <span class="dot" :style="{background:checkedTags.includes(t.name)?'#fff':t.color}"></span> <span>{{ t.name }}</span>
+        </div>
+
+      </div>
+    </el-aside>
+
+    <el-main class="con">
+      <el-card class="list-query" shadow="hover">
+        <el-form inline label-width="80px">
+<!--          <el-form-item :label="T('Name')">
+            <el-select v-model="listQuery.collection_id" clearable>
+              <el-option :value="0" :label="T('MyAddressBook')"></el-option>
+              <el-option v-for="c in collectionListRes.list" :key="c.id" :label="c.name" :value="c.id"></el-option>
+            </el-select>
+          </el-form-item>-->
+          <el-form-item :label="T('Id')">
+            <el-input v-model="listQuery.id" clearable></el-input>
+          </el-form-item>
+          <el-form-item :label="T('Username')">
+            <el-input v-model="listQuery.username" clearable></el-input>
+          </el-form-item>
+          <el-form-item :label="T('Hostname')">
+            <el-input v-model="listQuery.hostname" clearable></el-input>
+          </el-form-item>
+          <el-form-item>
+            <el-button type="primary" @click="handlerQuery">{{ T('Filter') }}</el-button>
+            <el-button type="danger" @click="toAdd">{{ T('Add') }}</el-button>
+          </el-form-item>
+        </el-form>
+      </el-card>
+      <el-card class="list-body" shadow="hover">
+        <!--      <el-tag type="danger" style="margin-bottom: 10px">不建议在此操作地址簿，可能会造成数据不同步</el-tag>-->
+        <el-table :data="listRes.list" v-loading="listRes.loading" border>
+          <el-table-column prop="id" label="ID" align="center" width="200">
+            <template #default="{row}">
+              <span>{{ row.id }} <el-icon @click="handleClipboard(row.id, $event)"><CopyDocument/></el-icon></span>
+            </template>
+          </el-table-column>
+          <el-table-column prop="collection_id" :label="T('Name')" align="center" width="150">
+            <template #default="{row}">
+              <span v-if="row.collection_id === 0">{{ T('MyAddressBook') }}</span>
+              <span v-else>{{ collectionListRes.list.find(c => c.id === row.collection_id)?.name }}</span>
+            </template>
+          </el-table-column>
+          <el-table-column prop="username" :label="T('Username')" align="center" width="150"/>
+          <el-table-column prop="hostname" :label="T('Hostname')" align="center" width="150"/>
+          <el-table-column prop="platform" :label="T('Platform')" align="center" width="120"/>
+          <el-table-column prop="tags" :label="T('Tags')" align="center"/>
+          <!--        <el-table-column prop="created_at" label="创建时间" align="center"/>-->
+          <!--        <el-table-column prop="updated_at" label="更新时间" align="center"/>-->
+          <el-table-column prop="alias" :label="T('Alias')" align="center" width="150"/>
+          <el-table-column prop="hash" :label="T('Hash')" align="center" width="150" show-overflow-tooltip/>
+          <el-table-column :label="T('Actions')" align="center" class-name="table-actions" width="600" fixed="right">
+            <template #default="{row}">
+              <el-button type="success" @click="connectByClient(row.id)">{{ T('Link') }}</el-button>
+              <el-button v-if="appStore.setting.appConfig.web_client" type="success" @click="toWebClientLink(row)">Web Client</el-button>
+              <el-button v-if="appStore.setting.appConfig.web_client" type="primary" @click="toShowShare(row)">{{ T('ShareByWebClient') }}</el-button>
+              <el-button @click="toEdit(row)">{{ T('Edit') }}</el-button>
+              <el-button type="danger" @click="del(row)">{{ T('Delete') }}</el-button>
+            </template>
+          </el-table-column>
+        </el-table>
+      </el-card>
+      <el-card class="list-page" shadow="hover">
+        <el-pagination background
+                       layout="prev, pager, next, sizes, jumper"
+                       :page-sizes="[10,20,50,100]"
+                       v-model:page-size="listQuery.page_size"
+                       v-model:current-page="listQuery.page"
+                       :total="listRes.total">
+        </el-pagination>
+      </el-card>
+    </el-main>
+
+
+    <el-dialog v-model="formVisible" width="800" :title="!formData.row_id?T('Create') :T('Update') ">
+      <el-form class="dialog-form" ref="form" :model="formData" label-width="120px">
+        <el-form-item label="ID" prop="id" required>
+          <el-input v-model="formData.id"></el-input>
+        </el-form-item>
+        <el-form-item :label="T('Username')" prop="username">
+          <el-input v-model="formData.username"></el-input>
+        </el-form-item>
+        <el-form-item :label="T('Alias')" prop="alias">
+          <el-input v-model="formData.alias"></el-input>
+        </el-form-item>
+        <el-form-item :label="T('Hash')" prop="hash">
+          <el-input v-model="formData.hash"></el-input>
+        </el-form-item>
+        <el-form-item :label="T('Hostname')" prop="hostname">
+          <el-input v-model="formData.hostname"></el-input>
+        </el-form-item>
+        <!--        <el-form-item :label="T('LoginName')" prop="loginName">
+                  <el-input v-model="formData.loginName"></el-input>
+                </el-form-item>-->
+        <!--        <el-form-item :label="T('Password')" prop="password">
+                          <el-input v-model="formData.password"></el-input>
+                        </el-form-item>-->
+        <el-form-item :label="T('Platform')" prop="platform">
+          <el-select v-model="formData.platform">
+            <el-option
+                v-for="item in platformList"
+                :key="item.value"
+                :label="item.label"
+                :value="item.value"
+            ></el-option>
+          </el-select>
+        </el-form-item>
+
+        <el-form-item :label="T('Tags')" prop="tags">
+          <el-select v-model="formData.tags" multiple>
+            <el-option
+                v-for="item in tagList"
+                :key="item.name"
+                :label="item.name"
+                :value="item.name"
+            ></el-option>
+          </el-select>
+        </el-form-item>
+        <!-- <el-form-item label="强制中继" prop="forceAlwaysRelay" required>
+                 <el-switch v-model="formData.forceAlwaysRelay"></el-switch>
+               </el-form-item>
+          <el-form-item label="在线" prop="online">
+                 <el-switch v-model="formData.online"></el-switch>
+               </el-form-item>
+               <el-form-item label="rdp端口" prop="rdpPort">
+                 <el-input v-model="formData.rdpPort"></el-input>
+               </el-form-item>
+               <el-form-item label="rdp用户名" prop="rdpUsername">
+                 <el-input v-model="formData.rdpUsername"></el-input>
+               </el-form-item>
+               <el-form-item label="同一服务器" prop="sameServer">
+                 <el-switch v-model="formData.sameServer"></el-switch>
+               </el-form-item>-->
+
+
+        <el-form-item>
+          <el-button @click="formVisible = false">{{ T('Cancel') }}</el-button>
+          <el-button @click="submit" type="primary">{{ T('Submit') }}</el-button>
+        </el-form-item>
+      </el-form>
+    </el-dialog>
+    <el-dialog v-model="shareToWebClientVisible" width="900" :close-on-click-modal="false">
+      <shareByWebClient :id="shareToWebClientForm.id"
+                        :hash="shareToWebClientForm.hash"
+                        @cancel="shareToWebClientVisible=false"
+                        @success=""/>
+    </el-dialog>
+  </el-container>
+</template>
+
+<script setup>
+  import { onActivated, onMounted, reactive, ref, watch } from 'vue'
+  import { list as fetchTagList } from '@/api/tag'
+  import { useRepositories } from '@/views/address_book'
+  import { useRepositories as useCollectionRepositories } from '@/views/address_book/collection'
+  import { useRepositories as useTagRepositories } from '@/views/tag/index'
+  import { toWebClientLink } from '@/utils/webclient'
+  import { T } from '@/utils/i18n'
+  import shareByWebClient from '@/views/address_book/components/shareByWebClient.vue'
+  import { useAppStore } from '@/store/app'
+  import { connectByClient } from '@/utils/peer'
+  import { handleClipboard } from '@/utils/clipboard'
+  import { CopyDocument } from '@element-plus/icons'
+
+  const appStore = useAppStore()
+  const tagList = ref([])
+  const fetchTagListData = async () => {
+    const res = await fetchTagList({ is_my: 1 }).catch(_ => false)
+    if (res) {
+      tagList.value = res.data.list
+    }
+  }
+  fetchTagListData()
+
+  const {
+    listRes,
+    listQuery,
+    getList,
+    handlerQuery,
+    del,
+    formVisible,
+    platformList,
+    formData,
+    toEdit,
+    toAdd,
+    submit,
+    shareToWebClientVisible,
+    shareToWebClientForm,
+    toShowShare,
+  } = useRepositories()
+
+  listQuery.is_my = 1
+
+  onMounted(getList)
+  onActivated(getList)
+
+  watch(() => listQuery.page, getList)
+
+  watch(() => listQuery.page_size, handlerQuery)
+  const {
+    listRes: collectionListRes,
+    listQuery: collectionListQuery,
+    getList: getCollectionList,
+  } = useCollectionRepositories()
+  collectionListQuery.is_my = 1
+  collectionListQuery.page_size = 999
+  onMounted(getCollectionList)
+
+  const alert = (msg) => {
+    window.alert(msg)
+  }
+
+  const {
+    listRes: tagListRes,
+    listQuery: tagListQuery,
+    getList: getTagList,
+  } = useTagRepositories()
+  tagListQuery.is_my = 1
+  tagListQuery.page_size = 999
+  onMounted(getTagList)
+  const checkedTags = ref(['111'])
+  const toggleTag = async (tag) => {
+    if (checkedTags.value.includes(tag.name)) {
+      checkedTags.value = checkedTags.value.filter(t => t !== tag.name)
+    } else {
+      checkedTags.value.push(tag.name)
+    }
+    // listQuery.tags = checkedTags.value.join(',')
+    // getList()
+  }
+</script>
+
+<style scoped lang="scss">
+.app-main {
+  border-left: 0;
+}
+
+.address-book-con {
+  height: calc(100vh - 120px);
+
+  .aside {
+    .aside-tags {
+      margin-top: 15px;
+      border: 1px solid #eee;
+      border-radius: 5px;
+      min-height: calc(100vh - 200px);
+      padding: 10px;
+      display: flex;
+      flex-wrap: wrap;
+      align-content: start;
+
+      .tag {
+        margin-right: 10px;
+        margin-bottom: 5px;
+        padding: 0 10px;
+        display: flex;
+        align-items: center;
+        justify-content: center;
+        line-height: 1;
+        height: 28px;
+        background-color: var(--tag-bg-color);
+        font-size: 14px;
+        border-radius: 8px;
+        cursor: pointer;
+
+        &.checked {
+          color: #fff;
+        }
+
+        span {
+          display: block;
+        }
+
+        .dot {
+          width: 8px;
+          height: 8px;
+          display: block;
+          border-radius: 50%;
+          line-height: 1;
+          font-size: 12px;
+          margin-right: 6px;
+        }
+
+      }
+    }
+  }
+
+  .con {
+    padding-top: 0;
+  }
+
+  .name-menu {
+    height: calc(100vh - 75px);
+  }
+
+}
+</style>
@@ -1,44 +1,54 @@
 <template>
  <div>
-    <el-card title="个人信息">
+    <el-card :title="T('Userinfo')" shadow="hover">
      <el-form class="info-form" ref="form" label-width="120px" label-suffix="：">
-        <el-form-item label="用户名">
+        <el-form-item :label="T('Username')">
          <div>{{ userStore.username }}</div>
        </el-form-item>
-        <el-form-item label="密码" prop="password">
-          <el-button type="danger" @click="showChangePwd">修改密码</el-button>
+        <el-form-item :label="T('Email')">
+          <div>{{ userStore.email }}</div>
+        </el-form-item>
+        <el-form-item :label="T('Password')" prop="password">
+          <el-button type="danger" @click="showChangePwd">{{ T('ChangePassword') }}</el-button>
        </el-form-item>
        <el-form-item label="OIDC">
          <el-table :data="oidcData" border fit>
-            <el-table-column label="平台" prop="third_type" align="center"></el-table-column>
-            <el-table-column label="状态" prop="status" align="center">
+            <el-table-column :label="T('IdP')" prop="op" align="center"></el-table-column>
+            <el-table-column :label="T('Status')" prop="status" align="center">
              <template #default="{ row }">
-                <el-tag v-if="row.status === 1" type="success">已绑定</el-tag>
-                <el-tag v-else type="danger">未绑定</el-tag>
+                <el-tag v-if="row.status === 1" type="success">{{ T('HasBind') }}</el-tag>
+                <el-tag v-else type="danger">{{ T('NoBind') }}</el-tag>
              </template>
            </el-table-column>
-            <el-table-column label="操作" align="center" width="200">
+            <el-table-column :label="T('Actions')" align="center" width="200">
              <template #default="{ row }">
-                <el-button v-if="row.status === 1" type="danger" size="small" @click="toUnBind(row)">解除绑定</el-button>
-                <el-button v-else type="success" size="small" @click="toBind(row)">去绑定</el-button>
+                <el-button v-if="row.status === 1" type="danger" size="small" @click="toUnBind(row)">{{ T('UnBind') }}</el-button>
+                <el-button v-else type="success" size="small" @click="toBind(row)">{{ T('ToBind') }}</el-button>
              </template>
            </el-table-column>
          </el-table>
        </el-form-item>
      </el-form>
    </el-card>
+    <el-card shadow="hover" style="margin-top: 20px">
+      <div v-html="html"></div>
+    </el-card>
    <changePwdDialog v-model:visible="changePwdVisible"></changePwdDialog>
  </div>
 </template>

 <script setup>
  import changePwdDialog from '@/components/changePwdDialog.vue'
-  import { ref } from 'vue'
+  import { computed, ref } from 'vue'
  import { useUserStore } from '@/store/user'
+  import { useAppStore } from '@/store/app'
  import { bind, unbind } from '@/api/oauth'
  import { myOauth } from '@/api/user'
  import { ElMessageBox } from 'element-plus'
+  import { T } from '@/utils/i18n'
+  import { marked } from 'marked'

+  const appStore = useAppStore()
  const userStore = useUserStore()
  const changePwdVisible = ref(false)
  const showChangePwd = () => {
@@ -54,27 +64,30 @@
  }
  getMyOauth()
  const toBind = async (row) => {
-    const res = await bind({ op: row.third_type }).catch(_ => false)
+    const res = await bind({ op: row.op }).catch(_ => false)
    if (res) {
      const { code, url } = res.data
      window.open(url)
    }
  }
  const toUnBind = async (row) => {
-    const cf = await ElMessageBox.confirm('确定解除绑定么?', {
-      confirmButtonText: '确定',
-      cancelButtonText: '取消',
+    const cf = await ElMessageBox.confirm(T('Confirm?', { param: T('UnBind') }), {
+      confirmButtonText: T('Confirm'),
+      cancelButtonText: T('Cancel'),
      type: 'warning',
    }).catch(_ => false)
    if (!cf) {
      return false
    }
-    const res = await unbind({ op: row.third_type }).catch(_ => false)
+    const res = await unbind({ op: row.op }).catch(_ => false)
    if (res) {
      getMyOauth()
    }

  }
+
+  const html = computed(_ => marked(appStore.setting.hello||''))
+
 </script>

 <style scoped lang="scss">
@@ -0,0 +1,82 @@
+<template>
+  <div>
+    <el-card class="list-query" shadow="hover">
+      <el-form inline label-width="80px">
+        <el-form-item>
+          <el-button type="primary" @click="handlerQuery">{{ T('Filter') }}</el-button>
+          <el-button type="danger" @click="toBatchDelete">{{ T('BatchDelete') }}</el-button>
+        </el-form-item>
+      </el-form>
+    </el-card>
+    <el-card class="list-body" shadow="hover">
+      <el-table :data="listRes.list" v-loading="listRes.loading" border @selection-change="handleSelectionChange">
+        <el-table-column type="selection" align="center" width="50"/>
+        <el-table-column prop="client" label="client" align="center" width="120"/>
+        <el-table-column prop="peer.id" :label="T('Peer')" align="center">
+          <template #default="{row}">
+            {{ row.device_id ? row.device_id : peer?.id }}
+          </template>
+        </el-table-column>
+        <el-table-column prop="uuid" label="uuid" align="center"/>
+        <el-table-column prop="ip" label="ip" align="center" width="150"/>
+        <el-table-column prop="type" label="type" align="center" width="100"/>
+        <el-table-column prop="platform" label="Platform/UA" align="center" width="120" show-overflow-tooltip/>
+        <el-table-column prop="created_at" :label="T('CreatedAt')" align="center"/>
+        <el-table-column :label="T('Actions')" align="center" width="400">
+          <template #default="{row}">
+            <el-button type="danger" @click="del(row)">{{ T('Delete') }}</el-button>
+          </template>
+        </el-table-column>
+      </el-table>
+    </el-card>
+    <el-card class="list-page" shadow="hover">
+      <el-pagination background
+                     layout="prev, pager, next, sizes, jumper"
+                     :page-sizes="[10,20,50,100]"
+                     v-model:page-size="listQuery.page_size"
+                     v-model:current-page="listQuery.page"
+                     :total="listRes.total">
+      </el-pagination>
+    </el-card>
+  </div>
+</template>
+
+<script setup>
+  import { onActivated, onMounted, ref, watch } from 'vue'
+  import { useRepositories } from '@/views/login/log.js'
+  import { T } from '@/utils/i18n'
+
+  const {
+    listRes,
+    listQuery,
+    getList,
+    handlerQuery,
+    del,
+    batchdel,
+  } = useRepositories('my')
+
+  onMounted(getList)
+  onActivated(getList)
+
+  watch(() => listQuery.page, getList)
+
+  watch(() => listQuery.page_size, handlerQuery)
+  const multipleSelection = ref([])
+  const handleSelectionChange = (val) => {
+    multipleSelection.value = val
+  }
+  const toBatchDelete = () => {
+    if (multipleSelection.value.length === 0) {
+      return
+    }
+    batchdel(multipleSelection.value)
+  }
+</script>
+
+<style scoped lang="scss">
+.list-query .el-select {
+  --el-select-width: 160px;
+}
+
+
+</style>
@@ -0,0 +1,406 @@
+<template>
+  <div>
+    <el-card class="list-query" shadow="hover">
+      <el-form inline label-width="150px">
+        <el-form-item label="ID">
+          <el-input v-model="listQuery.id" clearable/>
+        </el-form-item>
+        <el-form-item :label="T('Hostname')">
+          <el-input v-model="listQuery.hostname" clearable/>
+        </el-form-item>
+        <el-form-item :label="T('LastOnlineTime')">
+          <el-select v-model="listQuery.time_ago" clearable>
+            <el-option
+                v-for="item in timeFilters"
+                :key="item.value"
+                :label="item.text"
+                :value="item.value"
+                :disabled="item.value === 0"
+            ></el-option>
+          </el-select>
+        </el-form-item>
+        <el-form-item>
+          <el-button type="primary" @click="handlerQuery">{{ T('Filter') }}</el-button>
+          <el-button type="success" @click="toExport">{{ T('Export') }}</el-button>
+          <!--          <el-button type="danger" @click="toBatchDelete">{{ T('BatchDelete') }}</el-button>-->
+          <el-button type="primary" @click="toBatchAddToAB">{{ T('BatchAddToAB') }}</el-button>
+
+        </el-form-item>
+      </el-form>
+    </el-card>
+    <el-card class="list-body" shadow="hover">
+      <el-table :data="listRes.list" v-loading="listRes.loading" border size="small" @selection-change="handleSelectionChange">
+        <el-table-column type="selection" width="55" align="center"/>
+        <el-table-column prop="id" label="ID" align="center" width="150">
+          <template #default="{row}">
+            <span>{{ row.id }} <el-icon @click="handleClipboard(row.id, $event)"><CopyDocument/></el-icon></span>
+          </template>
+        </el-table-column>
+        <el-table-column prop="cpu" label="CPU" align="center" width="100" show-overflow-tooltip/>
+        <el-table-column prop="hostname" :label="T('Hostname')" align="center" width="120"/>
+        <el-table-column prop="memory" :label="T('Memory')" align="center" width="120"/>
+        <el-table-column prop="os" :label="T('Os')" align="center" width="120" show-overflow-tooltip/>
+        <el-table-column prop="last_online_time" :label="T('LastOnlineTime')" align="center" min-width="120">
+          <template #default="{row}">
+            <div class="last_oline_time">
+              <span> {{ row.last_online_time ? timeAgo(row.last_online_time * 1000) : '-' }}</span> <span class="dot" :class="{red: timeDis(row.last_online_time) >= 60, green: timeDis(row.last_online_time)< 60}"></span>
+            </div>
+          </template>
+        </el-table-column>
+        <el-table-column prop="last_online_ip" :label="T('LastOnlineIp')" align="center" min-width="120"/>
+        <el-table-column prop="username" :label="T('Username')" align="center" width="120"/>
+        <el-table-column prop="uuid" :label="T('Uuid')" align="center" width="120" show-overflow-tooltip/>
+        <el-table-column prop="version" :label="T('Version')" align="center" width="80"/>
+        <el-table-column prop="alias" :label="T('Alias')" align="center" width="80"/>
+        <el-table-column prop="created_at" :label="T('CreatedAt')" align="center" width="150"/>
+        <el-table-column prop="updated_at" :label="T('UpdatedAt')" align="center" width="150"/>
+        <el-table-column :label="T('Actions')" align="center" width="500" class-name="table-actions" fixed="right">
+          <template #default="{row}">
+            <el-button type="success" @click="connectByClient(row.id)">{{ T('Link') }}</el-button>
+            <el-button v-if="appStore.setting.appConfig.web_client" type="success" @click="toWebClientLink(row)">Web Client</el-button>
+            <el-button type="primary" @click="toAddressBook(row)">{{ T('AddToAddressBook') }}</el-button>
+            <el-button @click="toView(row)">{{ T('View') }}</el-button>
+            <!--            <el-button type="danger" @click="del(row)">{{ T('Delete') }}</el-button>-->
+          </template>
+        </el-table-column>
+      </el-table>
+    </el-card>
+    <el-card class="list-page" shadow="hover">
+      <el-pagination background
+                     layout="prev, pager, next, sizes, jumper"
+                     :page-sizes="[10,20,50,100]"
+                     v-model:page-size="listQuery.page_size"
+                     v-model:current-page="listQuery.page"
+                     :total="listRes.total">
+      </el-pagination>
+    </el-card>
+    <el-dialog v-model="formVisible" :title="T('Information')" width="800" :style="{ textAlign: 'center' }">
+      <el-form class="dialog-form" ref="form" :model="formData" label-width="120px">
+        <el-form-item label="ID" prop="id">
+          <el-input v-model="formData.id" disabled></el-input>
+        </el-form-item>
+        <el-form-item :label="T('Username')" prop="username">
+          <el-input v-model="formData.username" disabled></el-input>
+        </el-form-item>
+        <el-form-item :label="T('Hostname')" prop="hostname">
+          <el-input v-model="formData.hostname" disabled></el-input>
+        </el-form-item>
+        <el-form-item label="CPU" prop="cpu">
+          <el-input v-model="formData.cpu" disabled></el-input>
+        </el-form-item>
+        <el-form-item :label="T('Memory')" prop="memory">
+          <el-input v-model="formData.memory" disabled></el-input>
+        </el-form-item>
+        <el-form-item :label="T('Os')" prop="os">
+          <el-input v-model="formData.os" disabled></el-input>
+        </el-form-item>
+        <el-form-item :label="T('Uuid')" prop="uuid">
+          <el-input v-model="formData.uuid" disabled></el-input>
+        </el-form-item>
+        <el-form-item :label="T('Version')" prop="version">
+          <el-input v-model="formData.version" disabled></el-input>
+        </el-form-item>
+      </el-form>
+    </el-dialog>
+
+    <el-dialog v-model="ABFormVisible" width="800" :title="T('Create')">
+      <el-form class="dialog-form" ref="form" :model="ABFormData" label-width="120px">
+        <el-form-item :label="T('AddressBookName')" required prop="collection_id">
+          <el-select v-model="ABFormData.collection_id" clearable @change="changeCollectionForUpdate">
+            <el-option :value="0" :label="T('MyAddressBook')"></el-option>
+            <el-option v-for="c in collectionListResForUpdate.list" :key="c.id" :label="c.name" :value="c.id"></el-option>
+          </el-select>
+        </el-form-item>
+        <el-form-item label="ID" prop="id" required>
+          <el-input v-model="ABFormData.id"></el-input>
+        </el-form-item>
+        <el-form-item :label="T('Username')" prop="username">
+          <el-input v-model="ABFormData.username"></el-input>
+        </el-form-item>
+        <el-form-item :label="T('Alias')" prop="alias">
+          <el-input v-model="ABFormData.alias"></el-input>
+        </el-form-item>
+        <el-form-item :label="T('Hostname')" prop="hostname">
+          <el-input v-model="ABFormData.hostname"></el-input>
+        </el-form-item>
+        <el-form-item :label="T('Platform')" prop="platform">
+          <el-select v-model="ABFormData.platform">
+            <el-option
+                v-for="item in ABPlatformList"
+                :key="item.value"
+                :label="item.label"
+                :value="item.value"
+            ></el-option>
+          </el-select>
+        </el-form-item>
+
+        <el-form-item :label="T('Tags')" prop="tags">
+          <el-select v-model="ABFormData.tags" multiple>
+            <el-option
+                v-for="item in tagListRes.list"
+                :key="item.name"
+                :label="item.name"
+                :value="item.name"
+            ></el-option>
+          </el-select>
+        </el-form-item>
+        <el-form-item>
+          <el-button @click="ABFormVisible = false">{{ T('Cancel') }}</el-button>
+          <el-button @click="ABSubmit" type="primary">{{ T('Submit') }}</el-button>
+        </el-form-item>
+      </el-form>
+    </el-dialog>
+
+    <el-dialog v-model="batchABFormVisible" width="800" :title="T('Create')">
+      <el-form class="dialog-form" ref="form" :model="batchABFormData" label-width="120px">
+        <el-form-item :label="T('AddressBookName')" required prop="collection_id">
+          <el-select v-model="batchABFormData.collection_id" clearable @change="changeCollectionForBatchCreateAB">
+            <el-option :value="0" :label="T('MyAddressBook')"></el-option>
+            <el-option v-for="c in collectionListResForUpdate.list" :key="c.id" :label="c.name" :value="c.id"></el-option>
+          </el-select>
+        </el-form-item>
+        <el-form-item :label="T('Tags')" prop="tags">
+          <el-select v-model="batchABFormData.tags" multiple>
+            <el-option
+                v-for="item in tagListRes.list"
+                :key="item.name"
+                :label="item.name"
+                :value="item.name"
+            ></el-option>
+          </el-select>
+        </el-form-item>
+        <el-form-item>
+          <el-button @click="batchABFormVisible = false">{{ T('Cancel') }}</el-button>
+          <el-button @click="submitBatchAddToAB" type="primary">{{ T('Submit') }}</el-button>
+        </el-form-item>
+      </el-form>
+    </el-dialog>
+  </div>
+</template>
+
+<script setup>
+  import { computed, onActivated, onMounted, reactive, ref, watch } from 'vue'
+  import { list } from '@/api/my/peer'
+  import { ElMessage, ElMessageBox } from 'element-plus'
+  import { toWebClientLink } from '@/utils/webclient'
+  import { T } from '@/utils/i18n'
+  import { timeAgo } from '@/utils/time'
+  import { jsonToCsv, downBlob } from '@/utils/file'
+  import { useRepositories as useABRepositories } from '@/views/address_book/index'
+  import { useAppStore } from '@/store/app'
+  import { connectByClient } from '@/utils/peer'
+  import { CopyDocument } from '@element-plus/icons'
+  import { handleClipboard } from '@/utils/clipboard'
+  import { batchCreateFromPeers } from '@/api/my/address_book'
+
+  const appStore = useAppStore()
+  const listRes = reactive({
+    list: [], total: 0, loading: false,
+  })
+  const listQuery = reactive({
+    page: 1,
+    page_size: 10,
+    time_ago: null,
+    id: '',
+    hostname: '',
+  })
+
+  const getList = async () => {
+    listRes.loading = true
+    const res = await list(listQuery).catch(_ => false)
+    listRes.loading = false
+    if (res) {
+      listRes.list = res.data.list
+      listRes.total = res.data.total
+    }
+  }
+  const handlerQuery = () => {
+    if (listQuery.page === 1) {
+      getList()
+    } else {
+      listQuery.page = 1
+    }
+  }
+
+  /*const del = async (row) => {
+    const cf = await ElMessageBox.confirm(T('Confirm?', { param: T('Delete') }), {
+      confirmButtonText: T('Confirm'),
+      cancelButtonText: T('Cancel'),
+      type: 'warning',
+    }).catch(_ => false)
+    if (!cf) {
+      return false
+    }
+
+    const res = await remove({ row_id: row.row_id }).catch(_ => false)
+    if (res) {
+      ElMessage.success(T('OperationSuccess'))
+      getList()
+    }
+  }*/
+  onMounted(getList)
+  onActivated(getList)
+
+  watch(() => listQuery.page, getList)
+
+  watch(() => listQuery.page_size, handlerQuery)
+
+  const formVisible = ref(false)
+  const formData = reactive({
+    row_id: 0,
+    cpu: '',
+    hostname: '',
+    id: '',
+    memory: '',
+    os: '',
+    username: '',
+    uuid: '',
+    version: '',
+  })
+
+  const toView = (row) => {
+    formVisible.value = true
+    //将row中的数据赋值给formData
+    Object.keys(formData).forEach(key => {
+      formData[key] = row[key]
+    })
+  }
+
+  const timeDis = (time) => {
+    let now = new Date().getTime()
+    let after = new Date(time * 1000).getTime()
+    return (now - after) / 1000
+  }
+
+  const timeFilters = computed(() => [
+    { text: T('MinutesLess', { param: 1 }, 1), value: -60 },
+    { text: T('HoursLess', { param: 1 }, 1), value: -3600 },
+    { text: T('DaysLess', { param: 1 }, 1), value: -86400 },
+    { text: '---------', value: 0 },
+    { text: T('MinutesAgo', { param: 1 }, 1), value: 60 },
+    { text: T('HoursAgo', { param: 1 }, 1), value: 3600 },
+    { text: T('DaysAgo', { param: 1 }, 1), value: 86400 },
+    { text: T('MonthsAgo', { param: 1 }, 1), value: 2592000 },
+    // { text: T('YearsAgo', { param: 1 }, 1), value: 31536000 },
+  ])
+
+  const toExport = async () => {
+    const q = { ...listQuery }
+    q.page_size = 10000
+    q.page = 1
+    const res = await list(q).catch(_ => false)
+    if (res) {
+      const data = res.data.list.map(item => {
+        item.last_online_time = item.last_online_time ? new Date(item.last_online_time * 1000).toLocaleString() : '-'
+        delete item.user_id
+        delete item.user
+        return item
+      })
+      const csv = jsonToCsv(data)
+      downBlob(csv, 'peers.csv')
+    }
+  }
+
+  const {
+    platformList: ABPlatformList,
+    formVisible: ABFormVisible,
+    formData: ABFormData,
+    collectionListResForUpdate,
+    getCollectionListForUpdate,
+    tagListRes,
+    changeCollectionForUpdate,
+    submit: ABSubmit,
+    fromPeer,
+  } = useABRepositories('my')
+  onMounted(getCollectionListForUpdate)
+  const toAddressBook = (peer) => {
+    fromPeer(peer)
+    ABFormVisible.value = true
+  }
+
+  const multipleSelection = ref([])
+  const handleSelectionChange = (val) => {
+    multipleSelection.value = val
+  }
+  /*const toBatchDelete = async () => {
+    if (!multipleSelection.value.length) {
+      ElMessage.warning(T('PleaseSelectData'))
+      return false
+    }
+    const cf = await ElMessageBox.confirm(T('Confirm?', { param: T('BatchDelete') }), {
+      confirmButtonText: T('Confirm'),
+      cancelButtonText: T('Cancel'),
+      type: 'warning',
+    }).catch(_ => false)
+    if (!cf) {
+      return false
+    }
+
+    const res = await batchRemove({ row_ids: multipleSelection.value.map(i => i.row_id) }).catch(_ => false)
+    if (res) {
+      ElMessage.success(T('OperationSuccess'))
+      getList()
+    }
+  }*/
+
+  const batchABFormVisible = ref(false)
+  const toBatchAddToAB = () => {
+    batchABFormVisible.value = true
+  }
+  const batchABFormData = ref({
+    collection_id: 0,
+    tags: [],
+    peer_ids: [],
+  })
+  const changeCollectionForBatchCreateAB = (val) => {
+    batchABFormData.value.tags = []
+    changeCollectionForUpdate(val)
+  }
+  const submitBatchAddToAB = async () => {
+    if (multipleSelection.value.length === 0) {
+      ElMessage.warning(T('PleaseSelectData'))
+      return false
+    }
+    batchABFormData.value.peer_ids = multipleSelection.value.map(i => i.row_id)
+    if (!batchABFormData.value.peer_ids.length) {
+      ElMessage.warning(T('PleaseSelectData'))
+      return false
+    }
+
+    const res = await batchCreateFromPeers(batchABFormData.value).catch(_ => false)
+    if (res) {
+      ElMessage.success(T('OperationSuccess'))
+      batchABFormVisible.value = false
+    }
+  }
+
+
+</script>
+
+<style scoped lang="scss">
+.list-query .el-select {
+  --el-select-width: 180px;
+}
+
+.last_oline_time {
+  display: flex;
+  justify-content: center;
+  align-items: center;
+}
+
+.dot {
+  width: 6px;
+  height: 6px;
+  display: block;
+  border-radius: 50%;
+  margin-left: 10px;
+
+  &.red {
+    background-color: red;
+  }
+
+  &.green {
+    background-color: green;
+  }
+}
+</style>
@@ -0,0 +1,76 @@
+<template>
+  <div>
+    <el-card class="list-query" shadow="hover">
+      <el-form inline label-width="80px">
+        <el-form-item>
+          <el-button type="primary" @click="handlerQuery">{{ T('Filter') }}</el-button>
+          <el-button type="danger" @click="toBatchDelete">{{ T('BatchDelete') }}</el-button>
+        </el-form-item>
+      </el-form>
+    </el-card>
+    <el-card class="list-body" shadow="hover">
+      <el-table :data="listRes.list" v-loading="listRes.loading" border @selection-change="handleSelectionChange">
+        <el-table-column type="selection" align="center" width="50"/>
+        <el-table-column prop="id" label="ID" align="center" width="100"/>
+        <el-table-column prop="peer_id" :label="T('Peer')" align="center"/>
+        <el-table-column prop="created_at" :label="T('CreatedAt')" align="center"/>
+        <el-table-column :label="`${T('ExpireTime')} (${T('Second')})`" prop="expire" align="center">
+          <template #default="{row}">
+            <el-tag :type="expired(row)?'info':'success'">{{ row.expire ? row.expire : T('Forever') }}</el-tag>
+          </template>
+        </el-table-column>
+        <el-table-column :label="T('Actions')" align="center" width="400">
+          <template #default="{row}">
+            <el-button type="danger" @click="del(row)">{{ T('Delete') }}</el-button>
+          </template>
+        </el-table-column>
+      </el-table>
+    </el-card>
+    <el-card class="list-page" shadow="hover">
+      <el-pagination background
+                     layout="prev, pager, next, sizes, jumper"
+                     :page-sizes="[10,20,50,100]"
+                     v-model:page-size="listQuery.page_size"
+                     v-model:current-page="listQuery.page"
+                     :total="listRes.total">
+      </el-pagination>
+    </el-card>
+  </div>
+</template>
+
+<script setup>
+  import { onActivated, onMounted, watch } from 'vue'
+  import { T } from '@/utils/i18n'
+  import { useRepositories } from '@/views/share_record'
+
+  const {
+    listRes,
+    listQuery,
+    getList,
+    handlerQuery,
+    del,
+    multipleSelection,
+    toBatchDelete,
+    expired,
+  } = useRepositories('my')
+
+  onMounted(getList)
+  onActivated(getList)
+
+  watch(() => listQuery.page, getList)
+
+  watch(() => listQuery.page_size, handlerQuery)
+  const handleSelectionChange = (val) => {
+    multipleSelection.value = val
+  }
+
+
+</script>
+
+<style scoped lang="scss">
+.list-query .el-select {
+  --el-select-width: 160px;
+}
+
+
+</style>
@@ -1,37 +1,45 @@
 <template>
  <div>
    <el-card class="list-query" shadow="hover">
-      <el-form inline label-width="60px">
+      <el-form inline label-width="120px">
+        <el-form-item :label="T('AddressBookName')">
+          <el-select v-model="listQuery.collection_id" clearable>
+            <el-option :value="0" :label="T('MyAddressBook')"></el-option>
+            <el-option v-for="c in collectionListRes.list" :key="c.id" :label="c.name" :value="c.id"></el-option>
+          </el-select>
+        </el-form-item>
        <el-form-item>
-          <el-button type="primary" @click="handlerQuery">筛选</el-button>
-          <el-button type="danger" @click="toAdd">添加</el-button>
+          <el-button type="primary" @click="handlerQuery">{{ T('Filter') }}</el-button>
+          <el-button type="danger" @click="toAdd">{{ T('Add') }}</el-button>
        </el-form-item>
      </el-form>
    </el-card>
    <el-card class="list-body" shadow="hover">
      <el-table :data="listRes.list" v-loading="listRes.loading" border>
-        <el-table-column prop="id" label="id" align="center"/>
-        <el-table-column prop="name" label="名称" align="center"/>
-        <el-table-column prop="color" label="颜色" align="center">
+        <el-table-column prop="id" label="ID" align="center"/>
+        <el-table-column prop="collection_id" :label="T('AddressBook')" align="center" width="150">
+          <template #default="{row}">
+            <span v-if="row.collection_id === 0">{{ T('MyAddressBook') }}</span>
+            <span v-else>{{ collectionListRes.list.find(c => c.id === row.collection_id)?.name }}</span>
+          </template>
+        </el-table-column>
+        <el-table-column prop="name" :label="T('Name')" align="center"/>
+        <el-table-column prop="color" :label="T('Color')" align="center">
          <template #default="{row}">
            <div class="colors">
-              <div style="background-color: #efeff2" class="colorbox">
-                <div :style="{backgroundColor: row.color}" class="dot">
-                </div>
-              </div>
-              <div style="background-color: #24252b" class="colorbox">
+              <div style="background-color: var(--tag-bg-color)" class="colorbox">
                <div :style="{backgroundColor: row.color}" class="dot">
                </div>
              </div>
            </div>
          </template>
        </el-table-column>
-        <el-table-column prop="created_at" label="创建时间" align="center"/>
-        <el-table-column prop="updated_at" label="更新时间" align="center"/>
-        <el-table-column label="操作" align="center">
+        <el-table-column prop="created_at" :label="T('CreatedAt')" align="center"/>
+        <el-table-column prop="updated_at" :label="T('UpdatedAt')" align="center"/>
+        <el-table-column :label="T('Actions')" align="center">
          <template #default="{row}">
-            <el-button @click="toEdit(row)">编辑</el-button>
-            <el-button type="danger" @click="del(row)">删除</el-button>
+            <el-button @click="toEdit(row)">{{ T('Edit') }}</el-button>
+            <el-button type="danger" @click="del(row)">{{ T('Delete') }}</el-button>
          </template>
        </el-table-column>
      </el-table>
@@ -45,28 +53,29 @@
                     :total="listRes.total">
      </el-pagination>
    </el-card>
-    <el-dialog v-model="formVisible" :title="!formData.id?'创建':'修改'" width="800">
+    <el-dialog v-model="formVisible" :title="!formData.id?T('Create'):T('Update')" width="800">
      <el-form class="dialog-form" ref="form" :model="formData" label-width="120px">
-        <el-form-item label="名称" prop="name" required>
+        <el-form-item :label="T('AddressBookName')">
+          <el-select v-model="formData.collection_id" clearable>
+            <el-option :value="0" :label="T('MyAddressBook')"></el-option>
+            <el-option v-for="c in collectionListResForUpdate.list" :key="c.id" :label="c.name" :value="c.id"></el-option>
+          </el-select>
+        </el-form-item>
+        <el-form-item :label="T('Name')" prop="name" required>
          <el-input v-model="formData.name"></el-input>
        </el-form-item>
-        <el-form-item label="颜色" prop="color" required>
+        <el-form-item :label="T('Color')" prop="color" required>
          <el-color-picker v-model="formData.color" show-alpha @active-change="activeChange"></el-color-picker>
-          <br>
          <div class="colors">
-            <div style="background-color: #efeff2" class="colorbox">
-              <div :style="{backgroundColor: currentColor}" class="dot">
-              </div>
-            </div>
-            <div style="background-color: #24252b" class="colorbox">
+            <div style="background-color: var(--tag-bg-color)" class="colorbox">
              <div :style="{backgroundColor: currentColor}" class="dot">
              </div>
            </div>
          </div>
        </el-form-item>
        <el-form-item>
-          <el-button @click="formVisible = false">取消</el-button>
-          <el-button @click="submit" type="primary">提交</el-button>
+          <el-button @click="formVisible = false">{{ T('Cancel') }}</el-button>
+          <el-button @click="submit" type="primary">{{ T('Submit') }}</el-button>
        </el-form-item>
      </el-form>
    </el-dialog>
@@ -76,6 +85,7 @@
 <script setup>
  import { onMounted, watch, onActivated } from 'vue'
  import { useRepositories } from '@/views/tag'
+  import { T } from '@/utils/i18n'

  const {
    listRes,
@@ -90,9 +100,13 @@
    submit,
    activeChange,
    currentColor,
-  } = useRepositories()

-  listQuery.is_my = 1
+    collectionListRes,
+    getCollectionList,
+
+    collectionListResForUpdate,
+    getCollectionListForUpdate,
+  } = useRepositories('my')

  onMounted(getList)
  onActivated(getList)
@@ -101,6 +115,9 @@

  watch(() => listQuery.page_size, handlerQuery)

+  onMounted(getCollectionList)
+  onMounted(getCollectionListForUpdate)
+
 </script>

 <style scoped lang="scss">
@@ -1,22 +1,22 @@
 <template>
  <div class="oauth">
    <el-card class="card">
-      <h2>您正在授权绑定</h2>
+      <h2>{{ T('OauthBinding') }}</h2>
      <el-form class="info" label-width="100px">
-        <el-form-item label="平台">
+        <el-form-item :label="T('Op')">
          <div class="impt">{{ oauthInfo.op }}</div>
        </el-form-item>
-        <el-form-item label="用户名">
+        <el-form-item :label="T('ThirdName')">
          <div class="impt">{{ oauthInfo.third_name }}</div>
        </el-form-item>
        <el-form-item label-width="0">
-          <el-button style="width: 100%" v-if="!resStatus" type="success" size="large" @click="toConfirm">绑定</el-button>
+          <el-button style="width: 100%" v-if="!resStatus" type="success" size="large" @click="toConfirm">{{ T('Bind') }}</el-button>
        </el-form-item>
        <el-form-item label-width="0">
-          <el-button style="width: 100%" size="large" @click="out">关闭页面</el-button>
+          <el-button style="width: 100%" size="large" @click="out">{{ T('Close') }}</el-button>
        </el-form-item>
      </el-form>
-      如果不是您操作的授权，请直接关闭页面
+      {{ T('OauthCloseNote') }}
    </el-card>
  </div>
 </template>
@@ -26,6 +26,7 @@
  import { info, confirm, bindConfirm } from '@/api/oauth'
  import { useRoute, useRouter } from 'vue-router'
  import { ElMessage } from 'element-plus'
+  import { T } from '@/utils/i18n'

  const oauthInfo = ref({})
  const route = useRoute()
@@ -48,10 +49,17 @@
    const res = await bindConfirm({ code }).catch(_ => false)
    if (res) {
      resStatus.value = 1
-      ElMessage.success('操作成功,3秒后将自动关闭本页面')
-      setTimeout(_ => {
-        out()
-      }, 3000)
+      if (res.data.device_type === 'webadmin') {
+        ElMessage.success(T('OperationSuccess'))
+        //后台登录
+        router.push('/')
+      } else {
+        ElMessage.success(T('OperationSuccessAndCloseAfter3Seconds'))
+        setTimeout(_ => {
+          out()
+        }, 3000)
+      }
+
    }
  }
  const out = () => {
@@ -1,24 +1,27 @@
 <template>
  <div>
    <el-card class="list-query" shadow="hover">
-      <el-form inline label-width="60px">
+      <el-form inline label-width="80px">
        <el-form-item>
-          <el-button type="primary" @click="handlerQuery">筛选</el-button>
-          <el-button type="danger" @click="toAdd">添加</el-button>
+          <el-button type="primary" @click="handlerQuery">{{ T('Filter') }}</el-button>
+          <el-button type="danger" @click="toAdd">{{ T('Add') }}</el-button>
        </el-form-item>
      </el-form>
    </el-card>
    <el-card class="list-body" shadow="hover">
      <el-table :data="listRes.list" v-loading="listRes.loading" border>
-        <el-table-column prop="id" label="id" align="center"/>
-        <el-table-column prop="op" label="名称" align="center"/>
-        <el-table-column prop="auto_register" label="自动注册" align="center"/>
-        <el-table-column prop="created_at" label="创建时间" align="center"/>
-        <el-table-column prop="updated_at" label="更新时间" align="center"/>
-        <el-table-column label="操作" align="center">
+        <el-table-column prop="id" label="ID" align="center"/>
+        <el-table-column prop="op" :label="T('IdP')" align="center"/>
+        <el-table-column prop="oauth_type" :label="T('Type')" align="center"/>
+        <el-table-column prop="auto_register" :label="T('AutoRegister')" align="center"/>
+        <el-table-column prop="pkce_enable" :label="T('PkceEnable')" align="center"/>
+        <el-table-column prop="pkce_method" :label="T('PkceMethod')" align="center"/>
+        <el-table-column prop="created_at" :label="T('CreatedAt')" align="center"/>
+        <el-table-column prop="updated_at" :label="T('UpdatedAt')" align="center"/>
+        <el-table-column :label="T('Actions')" align="center">
          <template #default="{row}">
-            <el-button @click="toEdit(row)">编辑</el-button>
-            <el-button type="danger" @click="del(row)">删除</el-button>
+            <el-button @click="toEdit(row)">{{ T('Edit') }}</el-button>
+            <el-button type="danger" @click="del(row)">{{ T('Delete') }}</el-button>
          </template>
        </el-table-column>
      </el-table>
@@ -32,34 +35,65 @@
                     :total="listRes.total">
      </el-pagination>
    </el-card>
-    <el-dialog v-model="formVisible" :title="!formData.id?'创建':'修改'" width="800">
+    <el-dialog v-model="formVisible" :title="!formData.id?T('Create') :T('Update')" width="800">
      <el-form class="dialog-form" ref="form" :model="formData" :rules="rules" label-width="120px">
-        <el-form-item label="ClientId" prop="client_id">
-          <el-input v-model="formData.client_id"></el-input>
-        </el-form-item>
-        <el-form-item label="ClientSecret" prop="client_secret">
-          <el-input v-model="formData.client_secret"></el-input>
-        </el-form-item>
-        <el-form-item label="RedirectUrl" prop="redirect_url">
-          <el-input v-model="formData.redirect_url"></el-input>
-        </el-form-item>
-        <el-form-item label="类型" prop="op" >
-          <el-radio-group v-model="formData.op" :disabled="!!formData.id">
-            <el-radio v-for="item in ops" :key="item.value" :label="item.value" style="display: block">
+        <el-form-item label="Type" prop="oauth_type">
+          <el-radio-group v-model="formData.oauth_type" :disabled="!!formData.id">
+            <el-radio v-for="item in types" :key="item.value" :value="item.value" style="display: block">
              {{ item.label }}
            </el-radio>
          </el-radio-group>
        </el-form-item>
-        <el-form-item label="自动注册" prop="open_auto_register">
+        <el-form-item v-if="formData.oauth_type === 'oidc'" label="IdP" prop="op">
+          <el-input v-model="formData.op" :placeholder="T('Your IdP Name')"></el-input>
+        </el-form-item>
+        <el-form-item v-if="formData.oauth_type === 'oidc'" label="Issuer" prop="issuer">
+          <el-input v-model="formData.issuer" :placeholder="`${T('Check your IdP docs, without')} '/.well-known/openid-configuration'`"></el-input>
+        </el-form-item>
+        <el-form-item v-show="formData.oauth_type === 'oidc'" label="Scopes" prop="scopes">
+          <el-input v-model="formData.scopes" :placeholder="`${T('Optional, default is')} 'openid,profile,email'`"></el-input>
+        </el-form-item>
+        <el-form-item label="ClientId" prop="client_id">
+          <el-input v-model="formData.client_id"></el-input>
+        </el-form-item>
+        <el-form-item label="ClientSecret" prop="client_secret">
+          <el-input
+              v-model="formData.client_secret"
+              :type="formData.id ? 'password' : 'text'"
+              :show-password="!formData.id"
+          >
+          </el-input>
+        </el-form-item>
+        <el-form-item label="RedirectUrl" prop="redirect_url">
+          <div @click="copyRedirectUrl">{{ defaultRedirect() }}
+            <el-icon>
+              <CopyDocument></CopyDocument>
+            </el-icon>
+          </div>
+        </el-form-item>
+        <el-form-item label="PkceEnable" prop="pkce_enable">
+          <el-switch v-model="formData.pkce_enable"
+                     :active-value="true"
+                     :inactive-value="false">
+          </el-switch>
+        </el-form-item>
+
+        <el-form-item v-if="formData.pkce_enable" label="PkceMethod" prop="pkce_method">
+          <el-select v-model="formData.pkce_method" placeholder="Select PKCE Method">
+            <el-option label="S256 (Recommended)" value="S256"></el-option>
+            <el-option label="Plain" value="plain"></el-option>
+          </el-select>
+        </el-form-item>
+        <el-form-item :label="T('AutoRegister')" prop="auto_register">
          <el-switch v-model="formData.auto_register"
                     :active-value="true"
                     :inactive-value="false"
          ></el-switch>
-          <div style="display: block;margin-left: 10px">如果开启,当用户使用oauth登录而没绑定时,会自动注册一个账号</div>
+          <div style="display: block;margin-left: 10px">{{ T('AutoRegisterNote') }}</div>
        </el-form-item>
        <el-form-item>
-          <el-button @click="formVisible = false">取消</el-button>
-          <el-button @click="submit" type="primary">提交</el-button>
+          <el-button @click="formVisible = false">{{ T('Cancel') }}</el-button>
+          <el-button @click="submit" type="primary">{{ T('Submit') }}</el-button>
        </el-form-item>
      </el-form>
    </el-dialog>
@@ -70,6 +104,16 @@
  import { onMounted, reactive, watch, ref, onActivated } from 'vue'
  import { list, create, update, detail, remove } from '@/api/oauth'
  import { ElMessage, ElMessageBox } from 'element-plus'
+  import { T } from '@/utils/i18n'
+  import { handleClipboard } from '@/utils/clipboard'
+  import { useAppStore } from '@/store/app'
+  import { CopyDocument } from '@element-plus/icons'
+
+  const app = useAppStore()
+
+  const copyRedirectUrl = (e) => {
+    handleClipboard(defaultRedirect(), e)
+  }

  const listRes = reactive({
    list: [], total: 0, loading: false,
@@ -78,8 +122,11 @@
    page: 1,
    page_size: 10,
  })
-  const ops = [
-    { value: 'github', label: 'Github' },
+  const types = [
+    { value: 'github', label: 'GitHub' },
+    { value: 'google', label: 'Google' },
+    { value: 'linuxdo', label: 'LinuxDo' },
+    { value: 'oidc', label: 'OIDC' },
  ]
  const getList = async () => {
    listRes.loading = true
@@ -99,9 +146,9 @@
  }

  const del = async (row) => {
-    const cf = await ElMessageBox.confirm('确定删除么?', {
-      confirmButtonText: '确定',
-      cancelButtonText: '取消',
+    const cf = await ElMessageBox.confirm(T('Confirm?', { param: T('Delete') }), {
+      confirmButtonText: T('Confirm'),
+      cancelButtonText: T('Cancel'),
      type: 'warning',
    }).catch(_ => false)
    if (!cf) {
@@ -110,7 +157,7 @@

    const res = await remove({ id: row.id }).catch(_ => false)
    if (res) {
-      ElMessage.success('操作成功')
+      ElMessage.success(T('OperationSuccess'))
      getList()
    }
  }
@@ -125,35 +172,69 @@
  const formData = reactive({
    id: 0,
    op: '',
+    oauth_type: '',
+    issuer: '',
    client_id: '',
    client_secret: '',
    redirect_url: '',
+    scopes: '',
    auto_register: false,
+    pkce_enable: false,
+    pkce_method: 'S256',
  })
  const rules = {
-    client_id: [{ required: true, message: '请输入ClientId', trigger: 'blur' }],
-    client_secret: [{ required: true, message: '请输入ClientSecret', trigger: 'blur' }],
-    redirect_url: [{ required: true, message: '请输入RedirectUrl', trigger: 'blur' }],
-    op: [{ required: true, message: '请选择类型', trigger: 'blur' }],
+    client_id: [{ required: true, message: T('ParamRequired', { param: 'client_id' }), trigger: 'blur' }],
+    client_secret: [{ required: true, message: T('ParamRequired', { param: 'client_secret' }), trigger: 'blur' }],
+    // redirect_url: [{ required: true, message: T('ParamRequired', { param: 'redirect_url' }), trigger: 'blur' }],
+    oauth_type: [{ required: true, message: T('ParamRequired', { param: 'oauth_type' }), trigger: 'blur' }],
+    issuer: [{ required: true, message: T('ParamRequired', { param: 'issuer' }), trigger: 'blur' }],
+    pkce_method: [
+      { required: false, message: T('ParamRequired', { param: 'pkce_method' }), trigger: 'blur' },
+      {
+        validator: (rule, value, callback) => {
+          const allowedValues = ['S256', 'plain']
+          if (!allowedValues.includes(value)) {
+            callback(new Error(T('InvalidParam', { param: 'pkce_method' })))
+          } else {
+            callback() // 校验通过
+          }
+        },
+        trigger: 'change',
+      },
+    ],
  }
+
+  const defaultRedirect = () => {
+    return `${app.setting.rustdeskConfig.api_server || window.location.origin}/api/oidc/callback`
+  }
+
  const toEdit = (row) => {
    formVisible.value = true
    formData.id = row.id
    formData.op = row.op
+    formData.oauth_type = row.oauth_type
+    formData.issuer = row.issuer
    formData.client_id = row.client_id
    formData.client_secret = row.client_secret
-    formData.redirect_url = row.redirect_url
+    // formData.redirect_url = row.redirect_url || defaultRedirect()
+    formData.scopes = row.scopes
    formData.auto_register = row.auto_register
-
+    formData.pkce_enable = row.pkce_enable
+    formData.pkce_method = row.pkce_method
  }
  const toAdd = () => {
    formVisible.value = true
    formData.id = 0
    formData.op = ''
+    formData.oauth_type = ''
+    formData.issuer = ''
    formData.client_id = ''
    formData.client_secret = ''
-    formData.redirect_url = ''
+    // formData.redirect_url = defaultRedirect()
+    formData.scopes = ''
    formData.auto_register = false
+    formData.pkce_enable = false
+    formData.pkce_method = 'S256'
  }
  const form = ref(null)
  const submit = async () => {
@@ -164,7 +245,7 @@
    const api = formData.id ? update : create
    const res = await api(formData).catch(_ => false)
    if (res) {
-      ElMessage.success('操作成功')
+      ElMessage.success(T('OperationSuccess'))
      formVisible.value = false
      getList()
    }
@@ -1,22 +1,22 @@
 <template>
  <div class="oauth">
    <el-card class="card">
-      <h2>您正在授权登录</h2>
+      <h2>{{ T('OauthLogining') }}</h2>
      <el-form class="info" label-width="100px">
-        <el-form-item label="设备">
+        <el-form-item :label="T('Device')">
          <div class="impt">{{ oauthInfo.device_name }}</div>
        </el-form-item>
        <el-form-item label="ID">
          <div class="impt">{{ oauthInfo.id }}</div>
        </el-form-item>
        <el-form-item label-width="0">
-          <el-button style="width: 100%" v-if="!resStatus" type="success" size="large" @click="toConfirm">授权登录</el-button>
+          <el-button style="width: 100%" v-if="!resStatus" type="success" size="large" @click="toConfirm">{{ T('ConfirmOauth') }}</el-button>
        </el-form-item>
        <el-form-item label-width="0">
-          <el-button style="width: 100%" size="large" @click="out">关闭页面</el-button>
+          <el-button style="width: 100%" size="large" @click="out">{{ T('Close') }}</el-button>
        </el-form-item>
      </el-form>
-      如果不是您操作的授权，请直接关闭页面
+      {{ T('OauthCloseNote') }}
    </el-card>
  </div>
 </template>
@@ -26,6 +26,7 @@
  import { info, confirm } from '@/api/oauth'
  import { useRoute, useRouter } from 'vue-router'
  import { ElMessage } from 'element-plus'
+  import { T } from '@/utils/i18n'

  const oauthInfo = ref({})
  const route = useRoute()
@@ -48,7 +49,7 @@
    const res = await confirm({ code }).catch(_ => false)
    if (res) {
      resStatus.value = 1
-      ElMessage.success('操作成功,3秒后将自动关闭本页面')
+      ElMessage.success(T('OperationSuccessAndCloseAfter3Seconds'))
      setTimeout(_ => {
        out()
      }, 3000)
@@ -0,0 +1,129 @@
+<template>
+
+  <el-form class="dialog-form" ref="form" :model="ABFormData" label-width="120px">
+    <el-form-item :label="T('Owner')" prop="user_ids" required>
+      <el-select v-model="ABFormData.user_ids" multiple @change="changeUser">
+        <el-option
+            v-for="item in allUsers"
+            :key="item.id"
+            :label="item.username"
+            :value="item.id"
+        ></el-option>
+      </el-select>
+    </el-form-item>
+    <el-form-item :label="T('AddressBookName')" v-if="ABFormData.user_ids.length<=1" required prop="collection_id">
+      <el-select v-model="ABFormData.collection_id" clearable @change="changeCollectionForUpdate">
+        <el-option :value="0" :label="T('MyAddressBook')"></el-option>
+        <el-option v-for="c in collectionListResForUpdate.list" :key="c.id" :label="c.name" :value="c.id"></el-option>
+      </el-select>
+    </el-form-item>
+    <el-form-item label="ID" prop="id" required>
+      <el-input v-model="ABFormData.id"></el-input>
+    </el-form-item>
+    <el-form-item :label="T('Username')" prop="username">
+      <el-input v-model="ABFormData.username"></el-input>
+    </el-form-item>
+    <el-form-item :label="T('Alias')" prop="alias">
+      <el-input v-model="ABFormData.alias"></el-input>
+    </el-form-item>
+    <el-form-item :label="T('Hostname')" prop="hostname">
+      <el-input v-model="ABFormData.hostname"></el-input>
+    </el-form-item>
+    <el-form-item :label="T('Platform')" prop="platform">
+      <el-select v-model="ABFormData.platform">
+        <el-option
+            v-for="item in ABPlatformList"
+            :key="item.value"
+            :label="item.label"
+            :value="item.value"
+        ></el-option>
+      </el-select>
+    </el-form-item>
+
+    <el-form-item :label="T('Tags')" prop="tags" v-if="ABFormData.user_ids.length<=1">
+      <el-select v-model="ABFormData.tags" multiple>
+        <el-option
+            v-for="item in tagListRes.list"
+            :key="item.name"
+            :label="item.name"
+            :value="item.name"
+        ></el-option>
+      </el-select>
+    </el-form-item>
+    <el-form-item>
+      <el-button @click="cancel">{{ T('Cancel') }}</el-button>
+      <el-button @click="ABSubmit" type="primary">{{ T('Submit') }}</el-button>
+    </el-form-item>
+  </el-form>
+</template>
+<script setup>
+
+  import { T } from '@/utils/i18n'
+  import { loadAllUsers } from '@/global'
+  import { onMounted, defineProps, defineEmits, onActivated } from 'vue'
+  import { useRepositories as useABRepositories } from '@/views/address_book'
+  import { batchCreate } from '@/api/address_book'
+  import { ElMessage } from 'element-plus'
+
+  const emits = defineEmits(['cancel', 'success'])
+  const props = defineProps({
+    peer: {
+      type: Object,
+      required: true,
+    },
+  })
+  const { allUsers, getAllUsers } = loadAllUsers()
+  onMounted(getAllUsers)
+  const {
+    platformList: ABPlatformList,
+    formData: ABFormData,
+    changeUserForUpdate,
+    changeCollectionForUpdate,
+    collectionListResForUpdate,
+    tagListRes,
+    fromPeer,
+  } = useABRepositories('admin')
+  onMounted(() => {
+    fromPeer(props.peer)
+    console.log(collectionListResForUpdate)
+  })
+
+  const changeUser = async (val) => {
+    ABFormData.collection_id = 0
+    ABFormData.tags = []
+    if (val.length === 1) {
+      changeUserForUpdate(val[0])
+    }
+    if (val.length === 0) {
+      collectionListResForUpdate.list = []
+    }
+  }
+
+  const ABSubmit = async () => {
+    if (ABFormData.user_ids.length === 0) {
+      ElMessage.error(T('ParamRequired', { param: T('Owner') }))
+      return
+    }
+    if (!ABFormData.id) {
+      ElMessage.error(T('ParamRequired', { param: 'ID' }))
+      return
+    }
+    if (ABFormData.user_ids.length > 1) {
+      ABFormData.collection_id = 0
+      ABFormData.tags = []
+    }
+    const res = await batchCreate(ABFormData).catch(_ => false)
+    if (res) {
+      ElMessage.success(T('OperationSuccess'))
+      emits('success')
+    }
+  }
+  const cancel = () => {
+    emits('cancel')
+  }
+
+</script>
+
+<style scoped lang="scss">
+
+</style>
@@ -2,29 +2,111 @@
  <div>
    <el-card class="list-query" shadow="hover">
      <el-form inline label-width="60px">
+        <el-form-item label="ID">
+          <el-input v-model="listQuery.id" clearable/>
+        </el-form-item>
+        <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-select v-model="listQuery.time_ago" clearable>
+            <el-option
+                v-for="item in timeFilters"
+                :key="item.value"
+                :label="item.text"
+                :value="item.value"
+                :disabled="item.value === 0"
+            ></el-option>
+          </el-select>
+        </el-form-item>
+        <el-form-item :label="T('Username')">
+          <el-input v-model="listQuery.username" clearable/>
+        </el-form-item>
+        <el-form-item label="IP">
+          <el-input v-model="listQuery.ip" clearable/>
+        </el-form-item>
        <el-form-item>
-          <el-button type="primary" @click="handlerQuery">筛选</el-button>
-          <el-button type="danger" @click="toAdd">添加</el-button>
+          <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">
+                {{ T('Drop file here or click to upload') }}
+              </div>
+              <template #tip>
+                <div class="el-upload__tip">
+                  {{ T('Please upload csv file') }} <br>
+                  {{ T('Columns') }}: <span style="font-weight: bold;font-size: 15px">id,cpu,hostname,memory,os,username,uuid,version,group_id</span>
+                  <br>
+                  <span>{{ T('You can reference 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" :icon="ArrowDown">{{ 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>
      </el-form>
    </el-card>
    <el-card class="list-body" shadow="hover">
-      <el-table :data="listRes.list" v-loading="listRes.loading" border size="small">
-        <el-table-column prop="id" label="id" align="center"/>
-        <el-table-column prop="cpu" label="cpu" align="center"/>
-        <el-table-column prop="hostname" label="主机名" align="center"/>
-        <el-table-column prop="memory" label="内存" align="center"/>
-        <el-table-column prop="os" label="系统" align="center"/>
-        <el-table-column prop="username" label="username" align="center"/>
-        <el-table-column prop="uuid" label="uuid" align="center"/>
-        <el-table-column prop="version" label="版本号" align="center"/>
-        <el-table-column prop="created_at" label="创建时间" align="center"/>
-        <el-table-column prop="updated_at" label="更新时间" align="center"/>
-        <el-table-column label="操作" align="center" width="400">
+      <div style="text-align: right; margin-bottom: 10px">
+        <el-button :icon="Setting" @click="showColumnSetting"></el-button>
+      </div>
+
+      <el-table :data="listRes.list" v-loading="listRes.loading" border size="small" @selection-change="handleSelectionChange">
+        <el-table-column type="selection" width="55" align="center"/>
+        <template v-for="c in visibleColumns.filter(cc => cc.visible)" :key="c">
+          <el-table-column v-if="c.name==='id'" prop="id" label="ID" align="center" width="150">
+            <template #default="{row}">
+              <span>{{ row.id }} <el-icon @click="handleClipboard(row.id, $event)"><CopyDocument/></el-icon></span>
+            </template>
+          </el-table-column>
+          <el-table-column v-if="c.name==='cpu'" prop="cpu" label="CPU" align="center" width="100" show-overflow-tooltip/>
+          <el-table-column v-if="c.name==='hostname'" prop="hostname" :label="T('Hostname')" align="center" width="120"/>
+          <el-table-column v-if="c.name==='memory'" prop="memory" :label="T('Memory')" align="center" width="120"/>
+          <el-table-column v-if="c.name==='os'" prop="os" :label="T('Os')" align="center" width="120" show-overflow-tooltip/>
+          <el-table-column v-if="c.name==='last_online_time'" prop="last_online_time" :label="T('LastOnlineTime')" align="center" min-width="120">
+            <template #default="{row}">
+              <div class="last_oline_time">
+                <span> {{ row.last_online_time ? timeAgo(row.last_online_time * 1000) : '-' }}</span> <span class="dot" :class="{red: timeDis(row.last_online_time) >= 60, green: timeDis(row.last_online_time)< 60}"></span>
+              </div>
+            </template>
+          </el-table-column>
+          <el-table-column v-if="c.name==='last_online_ip'" prop="last_online_ip" :label="T('LastOnlineIp')" align="center" min-width="120"/>
+          <el-table-column v-if="c.name==='username'" prop="username" :label="T('Username')" align="center" width="120"/>
+          <el-table-column v-if="c.name==='group_id'" prop="group_id" :label="T('Group')" align="center" width="120">
+            <template #default="{row}">
+              <span v-if="row.group_id"> <el-tag>{{ groupListRes.list?.find(g => g.id === row.group_id)?.name }} </el-tag> </span>
+              <span v-else> - </span>
+            </template>
+          </el-table-column>
+          <el-table-column v-if="c.name==='uuid'" prop="uuid" :label="T('Uuid')" align="center" width="120" show-overflow-tooltip/>
+          <el-table-column v-if="c.name==='version'" prop="version" :label="T('Version')" align="center" width="80"/>
+          <el-table-column v-if="c.name==='alias'" prop="alias" :label="T('Alias')" align="center" width="80"/>
+          <el-table-column v-if="c.name==='created_at'" prop="created_at" :label="T('CreatedAt')" align="center" width="150"/>
+          <el-table-column v-if="c.name==='updated_at'" prop="updated_at" :label="T('UpdatedAt')" align="center" width="150"/>
+        </template>
+
+        <el-table-column :label="T('Actions')" align="center" width="500" class-name="table-actions" fixed="right">
          <template #default="{row}">
-            <el-button type="success" @click="toWebClientLink(row)">Web-Client</el-button>
-            <el-button @click="toEdit(row)">编辑</el-button>
-            <el-button type="danger" @click="del(row)">删除</el-button>
+            <el-button type="success" @click="connectByClient(row.id)">{{ T('Link') }}</el-button>
+            <el-button v-if="appStore.setting.appConfig.web_client" type="success" @click="toWebClientLink(row)">Web Client</el-button>
+            <el-button type="primary" @click="toAddressBook(row)">{{ T('AddToAddressBook') }}</el-button>
+            <el-button @click="toEdit(row)">{{ T('Edit') }}</el-button>
+            <el-button type="danger" @click="del(row)">{{ T('Delete') }}</el-button>
          </template>
        </el-table-column>
      </el-table>
@@ -38,49 +120,155 @@
                     :total="listRes.total">
      </el-pagination>
    </el-card>
-    <el-dialog v-model="formVisible" :title="!formData.row_id?'创建':'修改'" width="800">
+    <el-dialog v-model="formVisible" :title="!formData.row_id?T('Create'):T('Update')" width="800">
      <el-form class="dialog-form" ref="form" :model="formData" label-width="120px">
-        <el-form-item label="id" prop="id" required>
+        <el-form-item label="ID" prop="id" required>
          <el-input v-model="formData.id"></el-input>
        </el-form-item>
-        <el-form-item label="用户名" prop="username">
+        <el-form-item :label="T('Group')" prop="group_id">
+          <el-select v-model="formData.group_id">
+            <el-option
+                v-for="item in groupListRes.list"
+                :key="item.id"
+                :label="item.name"
+                :value="item.id"
+            ></el-option>
+          </el-select>
+        </el-form-item>
+        <el-form-item :label="T('Username')" prop="username">
          <el-input v-model="formData.username"></el-input>
        </el-form-item>
-        <el-form-item label="主机名" prop="hostname">
+        <el-form-item :label="T('Hostname')" prop="hostname">
          <el-input v-model="formData.hostname"></el-input>
        </el-form-item>
-        <el-form-item label="cpu" prop="cpu">
+        <el-form-item label="CPU" prop="cpu">
          <el-input v-model="formData.cpu"></el-input>
        </el-form-item>
-        <el-form-item label="内存" prop="memory">
+        <el-form-item :label="T('Memory')" prop="memory">
          <el-input v-model="formData.memory"></el-input>
        </el-form-item>
-        <el-form-item label="系统" prop="os">
+        <el-form-item :label="T('Os')" prop="os">
          <el-input v-model="formData.os"></el-input>
        </el-form-item>
-        <el-form-item label="uuid" prop="uuid">
+        <el-form-item :label="T('Uuid')" prop="uuid">
          <el-input v-model="formData.uuid"></el-input>
        </el-form-item>
-        <el-form-item label="版本" prop="version">
+        <el-form-item :label="T('Version')" prop="version">
          <el-input v-model="formData.version"></el-input>
        </el-form-item>
-
+        <el-form-item :label="T('Alias')" prop="alias">
+          <el-input v-model="formData.alias"></el-input>
+        </el-form-item>
        <el-form-item>
-          <el-button @click="formVisible = false">取消</el-button>
-          <el-button @click="submit" type="primary">提交</el-button>
+          <el-button @click="formVisible = false">{{ T('Cancel') }}</el-button>
+          <el-button @click="submit" type="primary">{{ T('Submit') }}</el-button>
        </el-form-item>
      </el-form>
    </el-dialog>
+
+    <el-dialog v-model="ABFormVisible" width="800" :title="T('Create')" destroy-on-close>
+      <createABForm :peer="clickRow" @success="ABFormVisible=false" @cancel="ABFormVisible=false"></createABForm>
+    </el-dialog>
+
+    <el-dialog v-model="batchABFormVisible" width="800" :title="T('Create')">
+      <el-form class="dialog-form" ref="form" :model="batchABFormData" label-width="120px">
+        <el-form-item :label="T('Owner')" prop="user_id" required>
+          <el-select v-model="batchABFormData.user_id" @change="changeUserForBatchCreateAB">
+            <el-option
+                v-for="item in allUsers"
+                :key="item.id"
+                :label="item.username"
+                :value="item.id"
+            ></el-option>
+          </el-select>
+        </el-form-item>
+        <el-form-item :label="T('AddressBookName')" required prop="collection_id">
+          <el-select v-model="batchABFormData.collection_id" clearable>
+            <el-option :value="0" :label="T('MyAddressBook')"></el-option>
+            <el-option v-for="c in collectionListResForBatchCreateAB.list" :key="c.id" :label="c.name" :value="c.id"></el-option>
+          </el-select>
+        </el-form-item>
+        <!--        <el-form-item :label="T('Tags')" prop="tags">
+                  <el-select v-model="batchABFormData.tags" multiple>
+                    <el-option
+                        v-for="item in tagListRes.list"
+                        :key="item.name"
+                        :label="item.name"
+                        :value="item.name"
+                    ></el-option>
+                  </el-select>
+                </el-form-item>-->
+        <el-form-item>
+          <el-button @click="batchABFormVisible = false">{{ T('Cancel') }}</el-button>
+          <el-button @click="submitBatchAddToAB" type="primary">{{ T('Submit') }}</el-button>
+        </el-form-item>
+      </el-form>
+    </el-dialog>
+
+    <el-dialog v-model="columnSettingVisible" title="Column Setting">
+      <div v-for="(row, key) in visibleColumns" :key="key" style="margin-bottom: 10px;display: flex;align-items: center">
+        <div style="width: 200px">
+          <el-checkbox v-model="row.visible" :label="true">{{ T(row.label) }}</el-checkbox>
+        </div>
+        <div @click="upColumn(key)" style="width: 100px;cursor: pointer">
+          <el-icon :size="20">
+            <ArrowUp/>
+          </el-icon>
+        </div>
+        <div @click="downColumn(key)" style="width: 100px;cursor: pointer">
+          <el-icon :size="20">
+            <ArrowDown/>
+          </el-icon>
+        </div>
+      </div>
+      <span slot="footer" class="dialog-footer">
+        <el-button @click="columnSettingVisible = false">{{ T('Cancel') }}</el-button>
+        <el-button type="primary" @click="saveColumnSetting">{{ T('Save') }}</el-button>
+      </span>
+    </el-dialog>
  </div>
 </template>

 <script setup>
-  import { onActivated, onMounted, reactive, ref, watch } from 'vue'
-  import { create, list, remove, update } from '@/api/peer'
-  import { list as fetchTagList } from '@/api/tag'
+  import { computed, onActivated, onMounted, reactive, ref, watch } from 'vue'
+  import { batchRemove, create, list, remove, update } from '@/api/peer'
+  import { list as groupList } from '@/api/device_group'
  import { ElMessage, ElMessageBox } from 'element-plus'
-  import { loadAllUsers } from '@/global'
  import { toWebClientLink } from '@/utils/webclient'
+  import { T } from '@/utils/i18n'
+  import { timeAgo } from '@/utils/time'
+  import { jsonToCsv, downBlob } from '@/utils/file'
+  import { loadAllUsers } from '@/global'
+  import { useAppStore } from '@/store/app'
+  import { connectByClient } from '@/utils/peer'
+  import { ArrowDown, ArrowUp, CopyDocument, Setting } from '@element-plus/icons'
+  import { handleClipboard } from '@/utils/clipboard'
+  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()
+
+  //group
+  const groupListRes = reactive({
+    list: [], total: 0, loading: false,
+  })
+  const groupListQuery = reactive({
+    page: 1,
+    page_size: 999,
+  })
+  const getGroupList = async () => {
+    groupListRes.loading = true
+    const res = await groupList(groupListQuery).catch(_ => false)
+    groupListRes.loading = false
+    if (res) {
+      groupListRes.list = res.data.list
+      groupListRes.total = res.data.total
+    }
+  }
+  onMounted(getGroupList)
+  //

  const listRes = reactive({
    list: [], total: 0, loading: false,
@@ -88,6 +276,11 @@
  const listQuery = reactive({
    page: 1,
    page_size: 10,
+    time_ago: null,
+    id: '',
+    hostname: '',
+    username: '',
+    ip: '',
  })

  const getList = async () => {
@@ -108,9 +301,9 @@
  }

  const del = async (row) => {
-    const cf = await ElMessageBox.confirm('确定删除么?', {
-      confirmButtonText: '确定',
-      cancelButtonText: '取消',
+    const cf = await ElMessageBox.confirm(T('Confirm?', { param: T('Delete') }), {
+      confirmButtonText: T('Confirm'),
+      cancelButtonText: T('Cancel'),
      type: 'warning',
    }).catch(_ => false)
    if (!cf) {
@@ -119,7 +312,7 @@

    const res = await remove({ row_id: row.row_id }).catch(_ => false)
    if (res) {
-      ElMessage.success('操作成功')
+      ElMessage.success(T('OperationSuccess'))
      getList()
    }
  }
@@ -130,15 +323,10 @@

  watch(() => listQuery.page_size, handlerQuery)

-  const platformList = [
-    { label: 'Windows', value: 'Windows' },
-    { label: 'Linux', value: 'Linux' },
-    { label: 'Mac OS', value: 'Mac OS' },
-    { label: 'Android', value: 'Android' },
-  ]
  const formVisible = ref(false)
  const formData = reactive({
    row_id: 0,
+    group_id: null,
    cpu: '',
    hostname: '',
    id: '',
@@ -173,39 +361,237 @@
    const api = formData.row_id ? update : create
    const res = await api(formData).catch(_ => false)
    if (res) {
-      ElMessage.success('操作成功')
+      ElMessage.success(T('OperationSuccess'))
      formVisible.value = false
      getList()
    }
  }

+  const timeDis = (time) => {
+    let now = new Date().getTime()
+    let after = new Date(time * 1000).getTime()
+    return (now - after) / 1000
+  }
+
+  const timeFilters = computed(() => [
+    { text: T('MinutesLess', { param: 1 }, 1), value: -60 },
+    { text: T('HoursLess', { param: 1 }, 1), value: -3600 },
+    { text: T('DaysLess', { param: 1 }, 1), value: -86400 },
+    { text: '---------', value: 0 },
+    { text: T('MinutesAgo', { param: 1 }, 1), value: 60 },
+    { text: T('HoursAgo', { param: 1 }, 1), value: 3600 },
+    { text: T('DaysAgo', { param: 1 }, 1), value: 86400 },
+    { text: T('MonthsAgo', { param: 1 }, 1), value: 2592000 },
+    // { text: T('YearsAgo', { param: 1 }, 1), value: 31536000 },
+  ])
+
+  const toExport = async () => {
+    const q = { ...listQuery }
+    q.page_size = 10000
+    q.page = 1
+    const res = await list(q).catch(_ => false)
+    if (res) {
+      const data = res.data.list.map(item => {
+        item.last_online_time = item.last_online_time ? new Date(item.last_online_time * 1000).toLocaleString() : '-'
+        delete item.user_id
+        delete item.user
+        return item
+      })
+      const csv = jsonToCsv(data)
+      downBlob(csv, 'peers.csv')
+    }
+  }
+
+  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) => {
+    clickRow.value = row
+    ABFormVisible.value = true
+  }
+
+  const multipleSelection = ref([])
+  const handleSelectionChange = (val) => {
+    multipleSelection.value = val
+  }
+  const toBatchDelete = async () => {
+    if (!multipleSelection.value.length) {
+      ElMessage.warning(T('PleaseSelectData'))
+      return false
+    }
+    const cf = await ElMessageBox.confirm(T('Confirm?', { param: T('BatchDelete') }), {
+      confirmButtonText: T('Confirm'),
+      cancelButtonText: T('Cancel'),
+      type: 'warning',
+    }).catch(_ => false)
+    if (!cf) {
+      return false
+    }
+
+    const res = await batchRemove({ row_ids: multipleSelection.value.map(i => i.row_id) }).catch(_ => false)
+    if (res) {
+      ElMessage.success(T('OperationSuccess'))
+      getList()
+    }
+  }
+
+  // 批量添加到地址簿 start
+  const { allUsers, getAllUsers } = loadAllUsers()
+  onMounted(getAllUsers)
+  const {
+    listRes: collectionListResForBatchCreateAB,
+    listQuery: collectionListQueryForBatchCreateAB,
+    getList: getCollectionListForBatchCreateAB,
+  } = useCollectionRepositories('admin')
+  collectionListQueryForBatchCreateAB.page_size = 9999
+  const changeUserForBatchCreateAB = (val) => {
+    batchABFormData.value.collection_id = 0
+    collectionListQueryForBatchCreateAB.user_id = val
+    getCollectionListForBatchCreateAB()
+  }
+  const batchABFormVisible = ref(false)
+  const toBatchAddToAB = () => {
+    batchABFormVisible.value = true
+  }
+  const batchABFormData = ref({
+    collection_id: 0,
+    tags: [],
+    peer_ids: [],
+    user_id: null,
+  })
+  const submitBatchAddToAB = async () => {
+    if (multipleSelection.value.length === 0) {
+      ElMessage.warning(T('PleaseSelectData'))
+      return false
+    }
+    batchABFormData.value.peer_ids = multipleSelection.value.map(i => i.row_id)
+    if (!batchABFormData.value.peer_ids.length) {
+      ElMessage.warning(T('PleaseSelectData'))
+      return false
+    }
+
+    const res = await batchCreateFromPeers(batchABFormData.value).catch(_ => false)
+    if (res) {
+      ElMessage.success(T('OperationSuccess'))
+      batchABFormVisible.value = false
+    }
+  }
+  // 批量添加到地址簿 end
+
+  const columnSettingVisible = ref(false)
+  const allColumns = ref([
+    { name: 'id', visible: true, label: 'Id' },
+    { name: 'cpu', visible: true, label: 'Cpu' },
+    { name: 'hostname', visible: true, label: 'Hostname' },
+    { name: 'memory', visible: true, label: 'Memory' },
+    { name: 'os', visible: true, label: 'Os' },
+    { name: 'last_online_time', visible: true, label: 'LastOnlineTime' },
+    { name: 'last_online_ip', visible: true, label: 'LastOnlineIp' },
+    { name: 'username', visible: true, label: 'Username' },
+    { name: 'group_id', visible: true, label: 'Group' },
+    { name: 'uuid', visible: true, label: 'Uuid' },
+    { name: 'version', visible: true, label: 'Version' },
+    { name: 'alias', visible: true, label: 'Alias' },
+    { name: 'created_at', visible: true, label: 'CreatedAt' },
+    { name: 'updated_at', visible: true, label: 'UpdatedAt' },
+  ])
+  const visibleColumns = ref(JSON.parse(localStorage.getItem('peer_visible_columns')) || allColumns.value)
+  const showColumnSetting = () => {
+    columnSettingVisible.value = true
+  }
+  const saveColumnSetting = () => {
+    localStorage.setItem('peer_visible_columns', JSON.stringify(visibleColumns.value))
+    ElMessage.success(T('OperationSuccess'))
+    columnSettingVisible.value = false
+  }
+
+  const upColumn = (index) => {
+    if (index === 0) return
+    const col = visibleColumns.value[index]
+    visibleColumns.value.splice(index, 1)
+    visibleColumns.value.splice(index - 1, 0, col)
+
+  }
+  const downColumn = (index) => {
+    if (index === visibleColumns.value.length - 1) return
+    const col = visibleColumns.value[index]
+    visibleColumns.value.splice(index, 1)
+    visibleColumns.value.splice(index + 1, 0, col)
+
+  }
 </script>

 <style scoped lang="scss">
 .list-query .el-select {
-  --el-select-width: 160px;
+  --el-select-width: 180px;
 }

-.colors {
+.last_oline_time {
  display: flex;
  justify-content: center;
  align-items: center;
-
-  .colorbox {
-    width: 50px;
-    height: 30px;
-    display: flex;
-    justify-content: center;
-    align-items: center;
-
-    .dot {
-      width: 10px;
-      height: 10px;
-      display: block;
-      border-radius: 50%;
-    }
-  }
-
 }

+.dot {
+  width: 6px;
+  height: 6px;
+  display: block;
+  border-radius: 50%;
+  margin-left: 10px;
+
+  &.red {
+    background-color: red;
+  }
+
+  &.green {
+    background-color: green;
+  }
+}
 </style>
@@ -0,0 +1,157 @@
+<template>
+  <div class="login-container">
+    <div class="login-card">
+      <img src="@/assets/logo.png" alt="logo" class="login-logo"/>
+      <el-form ref="f" :model="form" label-position="top" class="login-form" :rules="rules">
+        <el-form-item :label="T('Username')" prop="username">
+          <el-input v-model="form.username" class="login-input"></el-input>
+        </el-form-item>
+
+        <el-form-item :label="T('Email')" prop="email">
+          <el-input v-model="form.email" class="login-input"></el-input>
+        </el-form-item>
+
+        <el-form-item :label="T('Password')" prop="password">
+          <el-input v-model="form.password" type="password" show-password
+                    class="login-input"></el-input>
+        </el-form-item>
+        <el-form-item :label="T('ConfirmPassword')" prop="confirm_password">
+          <el-input v-model="form.confirm_password" type="password" @keyup.enter.native="submit" show-password
+                    class="login-input"></el-input>
+        </el-form-item>
+        <el-form-item label="">
+          <el-button @click="submit" class="login-button" type="success">{{ T('Submit') }}</el-button>
+          <el-button @click="toLogin" class="login-button">{{ T('ToLogin') }}</el-button>
+        </el-form-item>
+      </el-form>
+    </div>
+  </div>
+</template>
+
+<script setup>
+  import { reactive, ref } from 'vue'
+  import { ElMessage } from 'element-plus'
+  import { T } from '@/utils/i18n'
+  import { useRoute, useRouter } from 'vue-router'
+  import { register } from '@/api/user'
+  import { useUserStore } from '@/store/user'
+  import { useAppStore } from '@/store/app'
+
+  const router = useRouter()
+  const userStore = useUserStore()
+  const form = reactive({
+    username: '',
+    email: '',
+    password: '',
+    confirm_password: '',
+  })
+  const rules = {
+    username: [
+      { required: true, message: T('ParamRequired', { param: T('Username') }), trigger: 'blur' },
+    ],
+    // email: [
+    //   { required: true, message: T('ParamRequired', { param: T('Email') }), trigger: 'blur' },
+    // ],
+    password: [
+      { required: true, message: T('ParamRequired', { param: T('Password') }), trigger: 'blur' },
+    ],
+    confirm_password: [
+      { required: true, message: T('ParamRequired', { param: T('ConfirmPassword') }), trigger: 'blur' },
+      {
+        validator: (rule, value, callback) => {
+          if (value !== form.password) {
+            callback(new Error(T('PasswordNotMatchConfirmPassword')))
+          } else {
+            callback()
+          }
+        }, trigger: 'blur',
+      },
+    ],
+  }
+  const f = ref(null)
+  const submit = async () => {
+    const v = await f.value.validate().catch(_ => false)
+    if (!v) {
+      return
+    }
+    const res = await register(form).catch(_ => false)
+    if (!res) {
+      return
+    }
+    userStore.saveUserData(res.data)
+    useAppStore().loadConfig()
+    ElMessage.success('Submit')
+    router.push('/')
+  }
+  const toLogin = () => {
+    router.push('/login')
+
+  }
+</script>
+
+<style scoped lang="scss">
+.login-container {
+  display: flex;
+  justify-content: center;
+  align-items: center;
+  height: 100vh;
+  background-color: #2d3a4b;
+  padding: 20px;
+  box-sizing: border-box;
+}
+
+.login-card {
+  width: 360px;
+  background-color: #283342;
+  padding: 40px;
+  border-radius: 8px;
+  box-shadow: 0 4px 8px rgba(0, 0, 0, 0.1);
+  text-align: center;
+}
+
+h1 {
+  margin-bottom: 20px;
+  font-size: 24px;
+  font-weight: bold;
+}
+
+.login-form {
+  margin-bottom: 20px;
+}
+
+.login-input {
+  width: 100%;
+}
+
+.login-button {
+  width: 100%;
+  height: 40px;
+  margin-bottom: 20px;
+  margin-top: 20px;
+  margin-left: 0;
+}
+
+.login-logo {
+  width: 80px;
+  height: 80px;
+  margin: 0 auto 20px;
+  display: block;
+}
+
+.el-form-item {
+  ::v-deep(.el-form-item__label) {
+    color: #fff;
+  }
+
+  .el-input {
+    ::v-deep(.el-input__wrapper) {
+      border: 1px solid rgba(255, 255, 255, 0.1);
+      background: transparent;
+    }
+
+    ::v-deep(input) {
+      color: #fff;
+    }
+  }
+}
+</style>
@@ -0,0 +1,69 @@
+<template>
+  <el-card class="simple-card" shadow="hover" v-loading="form.loading">
+    <template #header>
+      <div class="card-header">
+        <span>ALWAYS_USE_RELAY</span>
+      </div>
+    </template>
+    <el-form :disabled="!canSend">
+      <el-form-item>
+        <el-switch v-model="form.option" active-value="Y" inactive-value="N"></el-switch>
+      </el-form-item>
+      <el-form-item>
+        <el-button @click="get">{{ T('Refresh') }}</el-button>
+        <el-button @click="save" type="primary">{{ T('Save') }}</el-button>
+      </el-form-item>
+    </el-form>
+  </el-card>
+</template>
+<script setup>
+
+  import { T } from '@/utils/i18n'
+  import { reactive, watch } from 'vue'
+  import { sendCmd } from '@/api/rustdesk'
+  import { ElMessage } from 'element-plus'
+  import { ID_TARGET } from '@/views/rustdesk/options'
+
+  const emits = defineEmits('success')
+  const props = defineProps({
+    canSend: Boolean,
+  })
+
+  const form = reactive({
+    cmd: 'aur',
+    option: '',
+    target: ID_TARGET,
+    value: 0,
+    loading: false,
+  })
+  const get = async () => {
+    form.loading = true
+    const res = await sendCmd({ cmd: 'aur', target: ID_TARGET }).catch(_ => false)
+    form.loading = false
+    if (res) {
+      if (res.data === 'ALWAYS_USE_RELAY: true' || res.data === 'ALWAYS_USE_RELAY: true\n') {
+        form.option = 'Y'
+      } else {
+        form.option = 'N'
+      }
+    }
+  }
+  const save = async () => {
+    const res = await sendCmd(form).catch(_ => false)
+    if (res) {
+      ElMessage.success(T('OperationSuccess'))
+      emits('success')
+    }
+  }
+
+  watch(() => props.canSend, (v) => {
+    if (v) {
+      get()
+    }
+  })
+</script>
+
+
+<style scoped lang="scss">
+
+</style>
@@ -0,0 +1,93 @@
+<template>
+  <el-card class="simple-card" shadow="hover" v-loading="form.loading">
+    <template #header>
+      <div class="card-header">
+        <span>BLACK_LIST</span>
+      </div>
+    </template>
+    <el-form :disabled="!canSend">
+      <el-form-item>
+        <el-input type="textarea" :model-value="form.list.join('|')" :rows="5"></el-input>
+      </el-form-item>
+      <el-form-item>
+        <el-button @click="getList">{{ T('Refresh') }}</el-button>
+        <el-button @click="showForm('add')" type="primary">{{ T('Add') }}</el-button>
+        <el-button @click="showForm('delete')" type="danger">{{ T('Delete') }}</el-button>
+      </el-form-item>
+    </el-form>
+    <el-dialog v-model="form.form_visible" :title="form.form_type">
+      <el-form label-width="100px">
+        <el-form-item label="IP">
+          <el-input v-model="form.form_input"></el-input>
+          <div>多个IP以 | 分割</div>
+          <div v-if="form.form_type==='delete'">, 全部填 <strong>all</strong></div>
+        </el-form-item>
+        <el-form-item>
+          <el-button @click="form.form_visible=false">{{ T('Cancel') }}</el-button>
+          <el-button @click="form.form_type === 'add' ? add() : remove()" type="primary">{{ T('Submit') }}</el-button>
+        </el-form-item>
+      </el-form>
+    </el-dialog>
+  </el-card>
+</template>
+<script setup>
+
+  import { T } from '@/utils/i18n'
+  import { reactive, watch } from 'vue'
+  import { sendCmd } from '@/api/rustdesk'
+  import { ElMessage } from 'element-plus'
+  import { RELAY_TARGET } from '@/views/rustdesk/options'
+
+  const props = defineProps({
+    canSend: Boolean,
+  })
+
+  const form = reactive({
+    get_cmd: 'blacklist',
+    add_cmd: 'blacklist-add',
+    remove_cmd: 'blacklist-remove',
+    list: [],
+    target: RELAY_TARGET,
+    loading: false,
+    form_visible: false,
+    form_input: '',
+    form_type: '',
+  })
+  const getList = async () => {
+    form.loading = true
+    const res = await sendCmd({ cmd: form.get_cmd, target: RELAY_TARGET }).catch(_ => false)
+    form.loading = false
+    if (res) {
+      form.list = res.data.split('\n').filter(i => i)
+    }
+  }
+  const showForm = (type) => {
+    form.form_visible = true
+    form.form_input = ''
+    form.form_type = type
+  }
+  const add = async () => {
+    const res = await sendCmd({ cmd: form.add_cmd, option: form.form_input, target: RELAY_TARGET }).catch(_ => false)
+    if (res) {
+      ElMessage.success(T('OperationSuccess'))
+      getList()
+    }
+  }
+  const remove = async () => {
+    const res = await sendCmd({ cmd: form.remove_cmd, option: form.form_input, target: RELAY_TARGET }).catch(_ => false)
+    if (res) {
+      ElMessage.success(T('OperationSuccess'))
+      getList()
+    }
+  }
+  watch(() => props.canSend, (v) => {
+    if (v) {
+      getList()
+    }
+  })
+
+
+</script>
+<style scoped lang="scss">
+
+</style>
@@ -0,0 +1,93 @@
+<template>
+  <el-card class="simple-card" shadow="hover" v-loading="form.loading">
+    <template #header>
+      <div class="card-header">
+        <span>BLOCK_LIST</span>
+      </div>
+    </template>
+    <el-form :disabled="!canSend">
+      <el-form-item>
+        <el-input type="textarea" :model-value="form.list.join('|')" :rows="5"></el-input>
+      </el-form-item>
+      <el-form-item>
+        <el-button @click="getList">{{ T('Refresh') }}</el-button>
+        <el-button @click="showForm('add')" type="primary">{{ T('Add') }}</el-button>
+        <el-button @click="showForm('delete')" type="danger">{{ T('Delete') }}</el-button>
+      </el-form-item>
+    </el-form>
+    <el-dialog v-model="form.form_visible" :title="form.form_type">
+      <el-form label-width="100px">
+        <el-form-item label="IP">
+          <el-input v-model="form.form_input"></el-input>
+          <div>多个IP以 | 分割</div>
+          <div v-if="form.form_type==='delete'">, 全部填 <strong>all</strong></div>
+        </el-form-item>
+        <el-form-item>
+          <el-button @click="form.form_visible=false">{{ T('Cancel') }}</el-button>
+          <el-button @click="form.form_type === 'add' ? add() : remove()" type="primary">{{ T('Submit') }}</el-button>
+        </el-form-item>
+      </el-form>
+    </el-dialog>
+  </el-card>
+</template>
+<script setup>
+
+  import { T } from '@/utils/i18n'
+  import { reactive, watch } from 'vue'
+  import { sendCmd } from '@/api/rustdesk'
+  import { ElMessage } from 'element-plus'
+  import { RELAY_TARGET } from '@/views/rustdesk/options'
+
+  const props = defineProps({
+    canSend: Boolean,
+  })
+
+  const form = reactive({
+    get_cmd: 'blocklist',
+    add_cmd: 'blocklist-add',
+    remove_cmd: 'blocklist-remove',
+    list: [],
+    target: RELAY_TARGET,
+    loading: false,
+    form_visible: false,
+    form_input: '',
+    form_type: '',
+  })
+  const getList = async () => {
+    form.loading = true
+    const res = await sendCmd({ cmd: form.get_cmd, target: RELAY_TARGET }).catch(_ => false)
+    form.loading = false
+    if (res) {
+      form.list = res.data.split('\n').filter(i => i)
+    }
+  }
+  const showForm = (type) => {
+    form.form_visible = true
+    form.form_input = ''
+    form.form_type = type
+  }
+  const add = async () => {
+    const res = await sendCmd({ cmd: form.add_cmd, option: form.form_input, target: RELAY_TARGET }).catch(_ => false)
+    if (res) {
+      ElMessage.success(T('OperationSuccess'))
+      getList()
+    }
+  }
+  const remove = async () => {
+    const res = await sendCmd({ cmd: form.remove_cmd, option: form.form_input, target: RELAY_TARGET }).catch(_ => false)
+    if (res) {
+      ElMessage.success(T('OperationSuccess'))
+      getList()
+    }
+  }
+  watch(() => props.canSend, (v) => {
+    if (v) {
+      getList()
+    }
+  })
+
+
+</script>
+<style scoped lang="scss">
+
+</style>
@@ -0,0 +1,289 @@
+<template>
+  <div>
+    <h4 v-html="T('ServerCmdTips', {wiki: '<a target=\'_blank\' href=\'https://github.com/lejianwen/rustdesk-api/wiki/Rustdesk-Command\'>WIKI</a>'})"></h4>
+    <h5>
+      <span>ID {{ T('Status') }}: </span>
+      <el-tag v-if="canSendIdServerCmd" type="success">{{ T('Available') }}</el-tag>
+      <el-tag v-else type="danger">{{ T('NotAvailable') }}</el-tag>
+      <el-button size="small" type="text" @click="refreshCanSendIdServerCmd">{{ T('Refresh') }}</el-button>
+    </h5>
+    <h5>
+      <span>RELAY {{ T('Status') }}: </span>
+      <el-tag v-if="canSendRelayServerCmd" type="success">{{ T('Available') }}</el-tag>
+      <el-tag v-else type="danger">{{ T('NotAvailable') }}</el-tag>
+      <el-button size="small" type="text" @click="refreshCanSendRelayServerCmd">{{ T('Refresh') }}</el-button>
+    </h5>
+    <el-tabs
+        v-model="activeName"
+        type="card"
+    >
+      <el-tab-pane :label="T('Simple')" name="Simple">
+        <el-space wrap>
+          <RelayServers ref="rs" :can-send="canSendIdServerCmd"/>
+          <alwaysUseRelay :can-send="canSendIdServerCmd" @success="handleAlwaysUseRelaySuccess"/>
+          <mustLogin :can-send="canControlMustLogin&&canSendIdServerCmd"/>
+          <usage :can-send="canSendRelayServerCmd"/>
+          <blocklist :can-send="canSendRelayServerCmd"/>
+          <blacklist :can-send="canSendRelayServerCmd"/>
+        </el-space>
+
+
+      </el-tab-pane>
+      <el-tab-pane :label="T('Advanced')" name="Advanced">
+        <el-card class="list-query" shadow="hover">
+          <el-form inline label-width="80px">
+            <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" :disabled="!canSendIdServerCmd" @click="showCmd({cmd:'',option:'',target:ID_TARGET})">{{ T('Send') }} To Id</el-button>
+              <el-button type="success" :disabled="!canSendRelayServerCmd" @click="showCmd({cmd:'',option:'',target:RELAY_TARGET})">{{ T('Send') }} To Relay</el-button>
+            </el-form-item>
+          </el-form>
+        </el-card>
+        <el-card class="list-body" shadow="hover">
+          <el-table :data="listRes.list" v-loading="listRes.loading" border>
+            <el-table-column prop="cmd" label="cmd" align="center"></el-table-column>
+            <el-table-column prop="alias" label="alias" align="center"></el-table-column>
+            <el-table-column prop="option" label="option" align="center"></el-table-column>
+            <el-table-column prop="explain" label="explain" align="center"></el-table-column>
+            <el-table-column label="actions" align="center">
+              <template #default="{row}">
+                <el-button type="success" :disabled="!canSendCmd(row.target)" @click="showCmd(row)">{{ T('Send') }}</el-button>
+                <el-button v-if="row.id" type="primary" @click="toUpdate(row)">{{ T('Edit') }}</el-button>
+                <el-button v-if="row.id" type="danger" @click="del(row)">{{ T('Delete') }}</el-button>
+              </template>
+            </el-table-column>
+          </el-table>
+
+          <el-dialog v-model="formVisible">
+            <el-form label-width="150">
+              <el-form-item label="cmd">
+                <el-input v-model="formData.cmd"></el-input>
+              </el-form-item>
+              <el-form-item label="alias">
+                <el-input v-model="formData.alias"></el-input>
+              </el-form-item>
+              <el-form-item label="option">
+                <el-input v-model="formData.option"></el-input>
+              </el-form-item>
+              <el-form-item label="target">
+                <el-radio-group v-model="formData.target">
+                  <el-radio label="id_server" value="21115"></el-radio>
+                  <el-radio label="relay_server" value="21117"></el-radio>
+                </el-radio-group>
+              </el-form-item>
+              <el-form-item label="explain">
+                <el-input v-model="formData.explain"></el-input>
+              </el-form-item>
+              <el-form-item>
+                <el-button type="primary" @click="submit">{{ T('Submit') }}</el-button>
+                <el-button @click="cancel">{{ T('Cancel') }}</el-button>
+              </el-form-item>
+            </el-form>
+          </el-dialog>
+
+          <el-dialog :title="T('SendCmd')" v-model="showCmdForm">
+            <el-form label-width="150" :disabled="!canSendCmd(customCmd.target)">
+              <el-form-item label="cmd">
+                <el-input v-model="customCmd.cmd"></el-input>
+              </el-form-item>
+              <el-form-item label="option">
+                <el-input v-model="customCmd.option"></el-input>
+                <el-text v-if="customCmd.example.trim()" style="margin-top: 5px">Example:
+                  <el-text type="primary">{{ customCmd.example }}</el-text>
+                </el-text>
+              </el-form-item>
+              <!--              <el-form-item label="target">
+                              <el-radio-group v-model="customCmd.target">
+                                <el-radio label="id_server" value="21115"></el-radio>
+                                <el-radio label="relay_server" value="21117"></el-radio>
+                              </el-radio-group>
+                            </el-form-item>-->
+              <el-form-item>
+                <el-button type="primary" @click="submitCmd">{{ T('Send') }}</el-button>
+              </el-form-item>
+              <el-form-item :label="T('Result')">
+                <el-input type="textarea" readonly disabled v-model="customCmd.res" rows="15"></el-input>
+              </el-form-item>
+            </el-form>
+          </el-dialog>
+        </el-card>
+      </el-tab-pane>
+    </el-tabs>
+
+  </div>
+</template>
+
+
+<script setup>
+  import { create, list, remove, sendCmd, update } from '@/api/rustdesk'
+  import { onMounted, reactive, ref } from 'vue'
+  import { T } from '@/utils/i18n'
+  import { ElMessage, ElMessageBox } from 'element-plus'
+  import { ID_TARGET, RELAY_TARGET } from '@/views/rustdesk/options'
+  import blocklist from '@/views/rustdesk/blocklist.vue'
+  import blacklist from '@/views/rustdesk/blacklist.vue'
+  import alwaysUseRelay from '@/views/rustdesk/always_use_relay.vue'
+  import RelayServers from '@/views/rustdesk/relay_servers.vue'
+  import mustLogin from '@/views/rustdesk/must_login.vue'
+  import usage from '@/views/rustdesk/usage.vue'
+
+  const activeName = ref('Simple')
+
+  const canSendIdServerCmd = ref(false)
+  const checkCanSendIdServerCmd = async () => {
+    const res = await sendCmd({ cmd: 'h', target: ID_TARGET }).catch(_ => false)
+    canSendIdServerCmd.value = !!res.data
+    if (canSendIdServerCmd.value) {
+      const commands = res.data.split('\n').filter(i => i)
+      console.log(commands)
+      canControlMustLogin.value = commands.some(i => i.includes('must-login'))
+    }
+  }
+
+  const canControlMustLogin = ref(false)
+  const refreshCanSendIdServerCmd = () => {
+    checkCanSendIdServerCmd()
+  }
+  onMounted(refreshCanSendIdServerCmd)
+
+  const canSendRelayServerCmd = ref(false)
+
+  const checkCanSendRelayServerCmd = async () => {
+    const res = await sendCmd({ cmd: 'h', target: RELAY_TARGET }).catch(_ => false)
+    canSendRelayServerCmd.value = !!res.data
+  }
+  const refreshCanSendRelayServerCmd = () => {
+    checkCanSendRelayServerCmd()
+  }
+  onMounted(refreshCanSendRelayServerCmd)
+
+  const rs = ref(null)
+  const handleAlwaysUseRelaySuccess = () => {
+    rs.value.save()
+  }
+
+  const canSendCmd = (target) => {
+    if (target === ID_TARGET) {
+      return canSendIdServerCmd.value
+    }
+    if (target === RELAY_TARGET) {
+      return canSendRelayServerCmd.value
+    }
+    return false
+  }
+
+  const listRes = reactive({
+    list: [], total: 0, loading: false,
+  })
+  const listQuery = reactive({
+    page: 1,
+    page_size: 10,
+  })
+  const getList = async () => {
+    listRes.loading = true
+    const res = await list(listQuery).catch(_ => false)
+    listRes.loading = false
+    if (res) {
+      listRes.list = res.data.list
+      listRes.total = res.data.total
+    }
+  }
+  const handlerQuery = () => {
+    if (listQuery.page === 1) {
+      getList()
+    } else {
+      listQuery.page = 1
+    }
+  }
+  onMounted(getList)
+  const del = async (row) => {
+    const cf = await ElMessageBox.confirm(T('Confirm?', { param: T('Delete') }), {
+      confirmButtonText: T('Confirm'),
+      cancelButtonText: T('Cancel'),
+      type: 'warning',
+    }).catch(_ => false)
+    if (!cf) {
+      return false
+    }
+
+    const res = await remove({ id: row.id }).catch(_ => false)
+    if (res) {
+      ElMessage.success(T('OperationSuccess'))
+      getList()
+    }
+  }
+  const formData = reactive({
+    cmd: '',
+    alias: '',
+    option: '',
+    target: '',
+    explain: '',
+  })
+  const formVisible = ref(false)
+  const toAdd = () => {
+    formVisible.value = true
+    formData.cmd = ''
+    formData.alias = ''
+    formData.option = ''
+    formData.explain = ''
+  }
+  const toUpdate = (row) => {
+    formVisible.value = true
+    formData.id = row.id
+    formData.cmd = row.cmd
+    formData.alias = row.alias
+    formData.option = row.option
+    formData.target = row.target
+    formData.explain = row.explain
+  }
+  const submit = async () => {
+    if (!formData.cmd) {
+      ElMessage.error(T('ParamRequired', { param: 'cmd' }))
+      return
+    }
+    const api = formData.id ? update : create
+    const res = await api(formData).catch(_ => false)
+    if (res) {
+      ElMessage.success(T('OperationSuccess'))
+      formVisible.value = false
+      getList()
+    }
+  }
+  const cancel = () => {
+    formVisible.value = false
+  }
+
+  const showCmdForm = ref(false)
+  const customCmd = reactive({
+    cmd: '',
+    option: '',
+    target: '',
+    res: '',
+    example: '',
+  })
+  const showCmd = (row) => {
+    showCmdForm.value = true
+    customCmd.cmd = row.cmd
+    customCmd.option = ''
+    customCmd.res = ''
+    customCmd.target = row.target
+    customCmd.example = `${row.cmd} ${row.option}`
+  }
+  const submitCmd = async () => {
+    sendCmd(customCmd).then(res => {
+      console.log(res)
+      customCmd.res = res.data
+      ElMessage.success(T('OperationSuccess'))
+    })
+  }
+
+</script>
+
+<style scoped lang="scss">
+.simple-card {
+  min-width: 300px;
+  margin: 10px;
+  min-height: 300px;
+}
+</style>
@@ -0,0 +1,67 @@
+<template>
+  <el-card class="simple-card" shadow="hover" v-loading="form.loading">
+    <template #header>
+      <div class="card-header">
+        <span>MUST_LOGIN</span>
+      </div>
+    </template>
+    <el-form :disabled="!canSend">
+      <el-form-item>
+        <el-switch v-model="form.option" active-value="Y" inactive-value="N"></el-switch>
+      </el-form-item>
+      <el-form-item>
+        <el-button @click="get">{{ T('Refresh') }}</el-button>
+        <el-button @click="save" type="primary">{{ T('Save') }}</el-button>
+      </el-form-item>
+    </el-form>
+  </el-card>
+</template>
+<script setup>
+
+  import { T } from '@/utils/i18n'
+  import { reactive, watch } from 'vue'
+  import { sendCmd } from '@/api/rustdesk'
+  import { ElMessage } from 'element-plus'
+  import { ID_TARGET } from '@/views/rustdesk/options'
+
+  const props = defineProps({
+    canSend: Boolean,
+  })
+
+  const form = reactive({
+    cmd: 'ml',
+    option: '',
+    target: ID_TARGET,
+    value: 0,
+    loading: false,
+  })
+  const get = async () => {
+    form.loading = true
+    const res = await sendCmd({ cmd: 'ml', target: ID_TARGET }).catch(_ => false)
+    form.loading = false
+    if (res) {
+      if (res.data === 'MUST_LOGIN: true' || res.data === 'MUST_LOGIN: true\n') {
+        form.option = 'Y'
+      } else {
+        form.option = 'N'
+      }
+    }
+  }
+  const save = async () => {
+    const res = await sendCmd(form).catch(_ => false)
+    if (res) {
+      ElMessage.success(T('OperationSuccess'))
+    }
+  }
+
+  watch(() => props.canSend, (v) => {
+    if (v) {
+      get()
+    }
+  })
+</script>
+
+
+<style scoped lang="scss">
+
+</style>
--- a/Show More
+++ b/Show More
Author	SHA1	Message	Date
ralfu	9edb8aa930	src/global.js aktualisiert	2026-05-18 12:40:30 +02:00
ralfu	cc3a5c77a0	README.md aktualisiert	2026-05-18 11:19:17 +02:00
ralfu	98b93835e6	README.md aktualisiert	2026-05-18 11:14:11 +02:00
ralfu	5dfedbab6b	src/styles/style.scss aktualisiert	2026-05-18 11:09:36 +02:00
ralfu	7afa2d301b	README.md aktualisiert	2026-05-18 11:06:42 +02:00
ralfu	7feb05c977	vite.config.js aktualisiert	2026-05-18 11:06:08 +02:00
ralfu	a1a12a1a10	README.md aktualisiert	2026-05-18 11:03:20 +02:00
lejianwen	3998c2a921	fix: webclient share feat: peer list	2025-08-31 13:38:27 +08:00
lejianwen	ffe0961b4a	feat: Oauth	2025-08-10 15:46:29 +08:00
lejianwen	c5d16aed80	feat: Oauth	2025-08-10 15:39:25 +08:00
lejianwen	fe2626f6cb	feat: Update package	2025-08-10 11:19:09 +08:00
Tao Chen	4be05adb0c	feat: 优化oauth设置页面 (#22 ) * hide ClientSecret when re-edit * add rediret_url at oauth form(readonly, for user to know what's the redirect url) * format defaultRedirect	2025-08-10 11:15:48 +08:00
Tao Chen	09a40d3502	feat: Login (#21 ) * if auto_oidc=true, auto login by oidc and hiden login-form if diable_pwd * also hide divider	2025-07-31 10:46:35 +08:00
lejianwen	35bac6b91c	fix:	2025-07-20 17:50:47 +08:00
ludong	15443701c6	fix: i18n (#18 ) * zh_TW添加缺少的DeviceGroupManager以及Import * 使用繁體	2025-07-14 20:00:39 +08:00
lejianwen	5bbf0ca7d8	feat: user remark fix: remove oauth redirect url	2025-07-08 12:18:25 +08:00
Plynksiy Nikita	9b2af8794a	feat: Update HTML language, improve SCSS font settings, and enhance Russian translations (#16 )	2025-06-19 15:09:02 +08:00
lejianwen	fc7e0595a1	feat: Add Export in some menu fix: Left menu height fix: Export csv when double quotation marks in data	2025-06-15 17:16:27 +08:00
lejianwen	42cc3974d4	feat: Add Oauth via LinuxDo	2025-06-15 15:43:32 +08:00
lejianwen	3084e40039	fix:	2025-05-28 17:06:12 +08:00
lejianwen	4b818f73e5	fix: after register page empty	2025-05-25 17:11:57 +08:00
lejianwen	269bd0fd87	feat: user check	2025-05-25 16:33:12 +08:00
lejianwen	48a38156f7	fix: i18n (lejianwen/rustdesk-api#222 )	2025-05-08 11:11:13 +08:00
lejianwen	357f34e0e4	fix: user edit	2025-05-08 11:08:29 +08:00
lejianwen	0dfab9edfb	fix:	2025-04-24 11:51:53 +08:00
lejianwen	0967e78ab7	style:	2025-04-24 08:51:02 +08:00
lejianwen	83f25444ba	style:	2025-04-14 21:13:43 +08:00
lejianwen	7129dccbbc	fix: el-radio	2025-04-14 20:33:48 +08:00
lejianwen	68bbcf17b0	feat: share to group	2025-04-14 19:09:25 +08:00
lejianwen	24c480b2b7	feat: trans	2025-04-14 12:41:38 +08:00
lejianwen	00b09aae76	fix	2025-03-15 21:07:56 +08:00
lejianwen	f822e5bebf	feat: Add import	2025-03-15 21:00:07 +08:00
lejianwen	cb7837e6e7	feat(admin): Add filter by ip and username	2025-03-15 19:50:01 +08:00
lejianwen	b1ebedefc6	feat: Add device group	2025-02-23 21:34:56 +08:00
lejianwen	c20592620d	fix: PKCE plain value	2025-02-20 19:41:28 +08:00
lejianwen	d22aae110f	fix: PKCE plain value	2025-02-20 19:26:42 +08:00
Tao Chen	a631c7f8f0	feat: Feat/OIDC pcke (#14 ) * add pkce for oidc * fix * test * test	2025-02-19 09:56:22 +08:00
lejianwen	aeafcdde60	fix: Document title	2025-02-12 21:08:33 +08:00
lejianwen	8617959d15	feat(i18n): add zh-tw	2025-01-19 21:19:57 +08:00
Jia-Bin	68ebc75e59	Add Traditional Chinese	2025-01-19 21:06:50 +08:00
lejianwen	8d89478913	docs:	2025-01-16 20:56:33 +08:00
lejianwen	cc8fa46299	fix: must_login	2025-01-16 20:49:25 +08:00
lejianwen	e4342ae3af	style: usage	2025-01-15 21:23:39 +08:00
lejianwen	ce7ee9cce3	feat: usage	2025-01-15 20:26:56 +08:00
lejianwen	96cf2b29d5	fix: Rustdesk Commands Must Login	2025-01-12 21:56:00 +08:00
lejianwen	0e9391a4c5	refactor: Rustdesk Commands	2025-01-12 21:22:29 +08:00
lejianwen	127419e89b	feat: Add Relay server cmd	2025-01-04 20:48:46 +08:00
lejianwen	7cf1a14950	feat: Upgrade Server command	2025-01-02 21:48:02 +08:00
lejianwen	aab4ea4785	feat: Add rustdesk command	2024-12-31 23:17:08 +08:00
lejianwen	bf00eb3fed	feat: Add My Login log	2024-12-27 19:25:22 +08:00
lejianwen	a1e5e9a9da	fix: Support markdown to welcome msg	2024-12-25 19:59:41 +08:00
lejianwen	21254e2b2c	feat: Support markdown to welcome msg	2024-12-25 19:21:14 +08:00
乐	f589d923e9	feat(i18n): Merge pull request #9 from jimmyGALLAND/trans-fr add locale french	2024-12-22 13:58:39 +08:00
jimmyGALLAND	ab949ed6ac	add locale french	2024-12-21 22:32:29 +01:00
lejianwen	2a6bda9b9e	optimize add ab from peer	2024-12-20 11:10:06 +08:00
lejianwen	6a329b1f42	fix captcha	2024-12-18 13:34:02 +08:00
lejianwen	f20003e619	add captcha	2024-12-18 12:42:55 +08:00
lejianwen	8ecfe9cbd0	Split my and admin	2024-12-17 21:41:12 +08:00
lejianwen	a0ef4af33e	up	2024-12-13 16:25:27 +08:00
lejianwen	848832a94b	add batch add address book from peers	2024-12-13 16:24:31 +08:00
lejianwen	05e8227c49	up share record	2024-12-13 13:34:23 +08:00
lejianwen	502bea8dc3	add share record	2024-12-13 12:31:00 +08:00
lejianwen	2ea5a6eab3	up	2024-12-06 19:48:39 +08:00
lejianwen	f70764f4c6	add batch create ab from peer add batch update ab tags	2024-12-06 19:46:58 +08:00
lejianwen	c571aaa3ab	fix create ab in my peer	2024-12-06 10:59:55 +08:00
lejianwen	529e67095a	add batch delete user token	2024-12-06 10:59:10 +08:00
lejianwen	ce242e344a	add es lang	2024-11-26 10:42:21 +08:00
lejianwen	ad33afb154	up web client v2	2024-11-18 21:57:09 +08:00
lejianwen	f68a9a9562	up web client v2	2024-11-18 21:41:54 +08:00
lejianwen	cb96146f10	up	2024-11-16 18:33:24 +08:00
ljw	cb1bf5307a	add batch delete for log	2024-11-12 09:07:42 +08:00
ljw	4d1da2e89e	add admin conf	2024-11-11 22:26:55 +08:00
ljw	a1ed3df60f	oauth login not need uuid. if has uuid, peer will be created by uuid	2024-11-05 16:31:34 +08:00
ljw	771fada3e1	email not required	2024-11-05 11:57:07 +08:00
ljw	ba3f1d9fa6	email not required	2024-11-05 11:45:28 +08:00
Tao Chen	cbcfe9365a	add MyPeer for user	2024-11-02 07:36:34 +08:00
Tao Chen	6c60a77ec7	add email for register	2024-11-02 05:45:25 +08:00
Tao Chen	9706a6d7d1	ew-construct oidc	2024-11-02 04:02:38 +08:00
ljw	d8c129e465	fix changepwd dialog	2024-10-31 23:16:31 +08:00
ljw	ee83b739f2	add package-lock.json	2024-10-31 22:56:30 +08:00
ljw	130235fdc1	add user_token	2024-10-31 22:27:30 +08:00
乐	fffc2658e3	Merge pull request #4 from IamTaoChen/changeOwnPasswd add placeholder at changePassWD for Oauth user	2024-10-31 18:46:47 +08:00
Tao Chen	a8d98b5f82	i18n	2024-10-31 16:31:23 +08:00
Tao Chen	0277334e4b	:show-close="false"	2024-10-31 16:27:19 +08:00
Tao Chen	53bcc305e3	Merge branch 'master' into changeOwnPasswd	2024-10-31 16:16:27 +08:00
Tao Chen	9c8d0ca508	add placeholder for old_password	2024-10-31 16:06:17 +08:00
Tao Chen	9af9cd2da0	i18n	2024-10-31 15:35:38 +08:00
Tao Chen	a8fae4ca50	zh-cn for OIDC config	2024-10-31 15:32:02 +08:00
Tao Chen	a0b2daf609	label="cpu" -> label="CPU"	2024-10-31 15:31:31 +08:00
Tao Chen	20f0e9e869	chang label="id" -> label="ID"	2024-10-31 15:31:15 +08:00
ljw	d3031ae5d8	add register	2024-10-31 15:12:46 +08:00
ljw	31dbe5c8e2	up oauth	2024-10-31 14:02:34 +08:00
乐	a40324a4a9	Merge pull request #3 from IamTaoChen/oidc-for-web OIDC for web	2024-10-31 11:10:56 +08:00
Tao Chen	28222c8b29	chang oidc_code_expiry time to 60s	2024-10-31 09:17:24 +08:00
Tao Chen	65eb3e73ea	fix bug	2024-10-31 09:14:32 +08:00
Tao Chen	c165f54ce8	modify Login UI for OIDC login	2024-10-31 08:57:31 +08:00
Tao Chen	40a2d889ed	add pic	2024-10-31 01:04:53 +08:00
Tao Chen	aaedf3cbf1	oauth 'op' displayName -> 'Type'	2024-10-30 19:49:35 +08:00
Tao Chen	9baaf8ccb2	optimize oauth config	2024-10-30 19:42:25 +08:00
ljw	e2dec2a190	up	2024-10-30 19:37:38 +08:00
乐	5b7fb018a4	Merge pull request #2 from IamTaoChen/oidc Add General OIDC Login Configuration	2024-10-30 14:41:14 +08:00
Tao Chen	325b711d3c	add oidc config	2024-10-29 23:16:23 +08:00
ljw	8dc25a8589	add last online ip	2024-10-28 20:23:57 +08:00
ljw	5c05a56ed6	ab add version	2024-10-28 19:48:53 +08:00
ljw	d52ec7cda3	add share address book	2024-10-28 15:05:20 +08:00
ljw	c7b70471b2	add share address book	2024-10-28 14:25:41 +08:00
ljw	67ecc0192b	add ru lang	2024-10-22 19:46:05 +08:00
ljw	1969f7d196	up	2024-10-22 14:07:53 +08:00
ljw	bd490d9f7e	up i18n	2024-10-22 12:40:44 +08:00
ljw	933c955fc3	up i18n	2024-10-22 12:20:05 +08:00
ljw	df3209b576	add audit file log	2024-10-21 21:07:11 +08:00
ljw	20477e29f9	up group	2024-10-20 20:12:58 +08:00
ljw	d7291d81a4	add dark mode add audit conn log	2024-10-18 15:01:39 +08:00
ljw	0ccfc8e154	up screen	2024-10-15 08:19:19 +08:00
ljw	96f93cc071	up logo	2024-10-14 14:21:43 +08:00
ljw	8460d8e9b2	fix	2024-10-14 12:27:12 +08:00
ljw	fb41baa842	fix	2024-10-14 11:30:49 +08:00
ljw	3cc460ac8b	add url protocol & add web client on/off by api server	2024-10-14 10:34:40 +08:00
ljw	182f383d70	fix	2024-10-10 10:47:08 +08:00
ljw	bf98a51285	add share to guest by web client	2024-10-09 15:52:17 +08:00
ljw	3d203971b8	fix title	2024-09-29 14:59:58 +08:00
ljw	43ff24d2a7	fix export	2024-09-29 14:12:37 +08:00
ljw	777510c7ec	fix bugs & add batchdelete peer & add peer to ab	2024-09-29 11:50:23 +08:00
ljw	8be855ff3e	add i18n	2024-09-25 22:24:16 +08:00
ljw	b765154156	up	2024-09-24 19:40:35 +08:00
ljw	4e9a033a58	up	2024-09-24 19:39:37 +08:00
ljw	3873bb3740	add google oauth	2024-09-20 12:02:16 +08:00