ralfu/rustdesk-api-web
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

fix bugs & add batchdelete peer & add peer to ab

Browse Source
This commit is contained in:
ljw
2024-09-29 11:50:23 +08:00
parent 8be855ff3e
commit 777510c7ec
14 changed files with 427 additions and 65 deletions
Download Patch File Download Diff File Expand all files Collapse all files
src/api/address_book.js
+2 -2
View File
@@ -37,9 +37,9 @@ 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,
})
src/api/peer.js
+8
View File
@@ -36,3 +36,11 @@ export function remove (data) {
data,
})
}
export function batchRemove (data) {
return request({
url: '/peer/batchDelete',
method: 'post',
data,
})
}
src/store/app.js
+1 -1
View File
@@ -11,7 +11,7 @@ export const useAppStore = defineStore({
sideIsCollapse: false,
logo,
lang: localStorage.getItem('lang') || 'zh-CN',
locale: zhCn,
locale: localStorage.getItem('lang') === 'en' ? en : zhCn,
},
}),
src/styles/style.scss
+12 -2
View File
@@ -10,11 +10,21 @@ $sideBarWidth: 210px;
--primaryColor: #409eff;
}
.list-body{
.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;
}
}
src/utils/file.js
+28 -5
View File
@@ -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,40 @@ 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]}"`).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)
})
}
src/utils/i18n.js
+2 -3
View File
@@ -1,17 +1,16 @@
import en from '@/utils/i18n/en.json'
import zhCN from '@/utils/i18n/zh_CN.json'
import { useAppStore } from '@/store/app'
import { pinia } from '@/store'
export function T (key, params, num = 0) {
const appStore = useAppStore(pinia)
const appStore = useAppStore()
const lang = appStore.setting.lang
const trans = lang === 'zh-CN' ? zhCN : en
const tran = trans[key]
if (!tran) {
return key
}
const msg = num > 0 ? (tran.Other ? tran.Other : tran.One) : tran.One
const msg = num > 1 ? (tran.Other ? tran.Other : tran.One) : tran.One
//msg 是这样 {name} is name
//params 是这样 {name: 'zhangsan'}
//替换
src/utils/i18n/en.json
+50
View File
@@ -232,5 +232,55 @@
},
"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"
}
}
src/utils/i18n/zh_CN.json
+42
View File
@@ -232,5 +232,47 @@
},
"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": "请选择数据"
}
}
src/utils/time.js
+25
View File
@@ -0,0 +1,25 @@
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)
}
}
src/views/address_book/index.js
+6 -6
View File
@@ -1,13 +1,9 @@
import { reactive, ref } from 'vue'
import { create, list, remove, update } from '@/api/address_book'
import { ElMessage, ElMessageBox } from 'element-plus'
import { useRoute } from 'vue-router'
import { T } from '@/utils/i18n'
export function useRepositories () {
const route = useRoute()
const user_id = route.query?.user_id
export function useRepositories (user_id) {
const listRes = reactive({
list: [], total: 0, loading: false,
})
@@ -15,7 +11,10 @@ export function useRepositories () {
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,
})
const getList = async () => {
@@ -75,6 +74,7 @@ export function useRepositories () {
'sameServer': false,
'tags': [],
'user_id': null,
user_ids: [],
'username': '',
})
src/views/address_book/index.vue
+17 -3
View File
@@ -12,6 +12,15 @@
></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>
@@ -80,12 +89,12 @@
<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-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>-->
<el-form-item :label="T('Platform')" prop="platform">
<el-select v-model="formData.platform">
<el-option
@@ -140,7 +149,9 @@
import { useRepositories } from '@/views/address_book/index'
import { toWebClientLink } from '@/utils/webclient'
import { T } from '@/utils/i18n'
import { useRoute } from 'vue-router'
const route = useRoute()
const { allUsers, getAllUsers } = loadAllUsers()
getAllUsers()
const changeUser = (v) => {
@@ -167,10 +178,13 @@
toEdit,
toAdd,
submit,
activeChange,
currentColor,
} = useRepositories()
if (route.query?.user_id) {
listQuery.user_id = parseInt(route.query.user_id)
}
onMounted(getList)
onActivated(getList)
src/views/my/address_book/index.vue
+13 -7
View File
@@ -2,6 +2,15 @@
<div>
<el-card class="list-query" shadow="hover">
<el-form inline label-width="80px">
<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>
@@ -55,12 +64,12 @@
<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-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-form-item>-->
<!-- <el-form-item :label="T('Password')" prop="password">
<el-input v-model="formData.password"></el-input>
</el-form-item>
</el-form-item>-->
<el-form-item :label="T('Platform')" prop="platform">
<el-select v-model="formData.platform">
<el-option
@@ -150,9 +159,6 @@
</script>
<style scoped lang="scss">
.list-query .el-select {
--el-select-width: 160px;
}
.colors {
display: flex;
src/views/peer/index.vue
+206 -26
View File
@@ -1,15 +1,29 @@
<template>
<div>
<el-card class="list-query" shadow="hover">
<el-form inline label-width="80px">
<el-form inline label-width="150px">
<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="danger" @click="toAdd">{{ T('Add') }}</el-button>
<el-button type="success" @click="toExport">{{ T('Export') }}</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 size="small">
<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"/>
<el-table-column prop="cpu" label="cpu" align="center"/>
<el-table-column prop="hostname" :label="T('Hostname')" align="center"/>
@@ -17,12 +31,21 @@
<el-table-column prop="os" :label="T('Os')" align="center"/>
<el-table-column prop="username" :label="T('Username')" align="center"/>
<el-table-column prop="uuid" :label="T('Uuid')" align="center"/>
<el-table-column prop="version" :label="T('Version')" align="center"/>
<el-table-column prop="version" :label="T('Version')" align="center" width="80"/>
<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" width="400">
<el-table-column prop="last_online_time" :label="T('LastOnlineTime')" align="center">
<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 :label="T('Actions')" align="center" width="500">
<template #default="{row}">
<el-button 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>
@@ -71,15 +94,73 @@
</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('Owner')" prop="user_ids" required>
<el-select v-model="ABFormData.user_ids" multiple>
<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="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 tagList"
: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>
</div>
</template>
<script setup>
import { onActivated, onMounted, reactive, ref, watch } from 'vue'
import { create, list, remove, update } from '@/api/peer'
import { computed, onActivated, onMounted, reactive, ref, watch } from 'vue'
import { batchRemove, create, list, remove, update } from '@/api/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 { loadAllUsers } from '@/global'
import { list as fetchTagList } from '@/api/tag'
import { batchCreate } from '@/api/address_book'
const listRes = reactive({
list: [], total: 0, loading: false,
@@ -87,6 +168,7 @@
const listQuery = reactive({
page: 1,
page_size: 10,
time_ago: null,
})
const getList = async () => {
@@ -129,12 +211,6 @@
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,
@@ -178,33 +254,137 @@
}
}
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() : '-'
return item
})
const csv = jsonToCsv(data)
downBlob(csv, 'peers.csv')
}
}
const {
platformList: ABPlatformList,
formVisible: ABFormVisible,
formData: ABFormData,
} = useABRepositories()
const toAddressBook = (peer) => {
ABFormData.id = peer.id
ABFormData.username = peer.username
ABFormData.hostname = peer.hostname
//匹配os
if (peer.os.indexOf('windows') !== -1) {
ABFormData.platform = ABPlatformList.find(item => item.label === 'Windows').value
} else if (peer.os.indexOf('linux') !== -1) {
ABFormData.platform = ABPlatformList.find(item => item.label === 'Linux').value
} else if (peer.os.indexOf('android') !== -1) {
ABFormData.platform = ABPlatformList.find(item => item.label === 'Android').value
} else if (peer.os.indexOf('mac') !== -1) {
ABFormData.platform = ABPlatformList.find(item => item.label === 'Mac OS').value
}
ABFormData.uuid = peer.uuid
ABFormVisible.value = true
}
const ABSubmit = async () => {
const res = await batchCreate(ABFormData).catch(_ => false)
if (res) {
ElMessage.success(T('OperationSuccess'))
ABFormVisible.value = false
}
}
const { allUsers, getAllUsers } = loadAllUsers()
const tagList = ref([])
const fetchTagListData = async (user_id) => {
const res = await fetchTagList({ user_id }).catch(_ => false)
if (res) {
const ls = []
res.data.list.map(item => {
if (!ls.includes(item.name)) {
ls.push(item.name)
}
})
tagList.value = ls.map(item => ({ name: item }))
}
}
onMounted(getAllUsers)
onMounted(fetchTagListData)
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()
}
}
</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;
.dot {
width: 6px;
height: 6px;
display: block;
border-radius: 50%;
}
margin-left: 10px;
&.red {
background-color: red;
}
&.green {
background-color: green;
}
}
</style>
src/views/tag/index.js
+5
View File
@@ -22,6 +22,10 @@ export function useRepositories () {
// color 是十进制的数字,先转成16进制
let hex = color.toString(16)
console.log('hex', hex)
if (hex.length < 8) {
//前面补0
hex = '0'.repeat(8 - hex.length) + hex
}
//前两位是透明度
let alpha = hex.slice(0, 2)
//后六位是颜色
@@ -51,6 +55,7 @@ export function useRepositories () {
if (b.length === 1) {
b = '0' + b
}
console.log('to f color', alpha + r + g + b, parseInt(alpha + r + g + b, 16))
return parseInt(alpha + r + g + b, 16)
}