add share to guest by web client
This commit is contained in:
ljw
@@ -0,0 +1,144 @@
|
||||
<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 { getPeerSlat, rustdeskConfig } 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'
|
||||
|
||||
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 = 300
|
||||
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(_ => 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 = `${rustdeskConfig.value.api_server}/webclient/#/?share_token=${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>
|
||||
@@ -116,7 +116,16 @@ export function useRepositories (user_id) {
|
||||
getList()
|
||||
}
|
||||
}
|
||||
|
||||
const shareToWebClientVisible = ref(false)
|
||||
const shareToWebClientForm = reactive({
|
||||
id: '',
|
||||
hash: '',
|
||||
})
|
||||
const toShowShare = (row) => {
|
||||
shareToWebClientForm.id = row.id
|
||||
shareToWebClientForm.hash = row.hash
|
||||
shareToWebClientVisible.value = true
|
||||
}
|
||||
return {
|
||||
listRes,
|
||||
listQuery,
|
||||
@@ -129,5 +138,8 @@ export function useRepositories (user_id) {
|
||||
toEdit,
|
||||
toAdd,
|
||||
submit,
|
||||
shareToWebClientVisible,
|
||||
shareToWebClientForm,
|
||||
toShowShare,
|
||||
}
|
||||
}
|
||||
|
||||
@@ -44,9 +44,10 @@
|
||||
<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 label="操作" align="center" width="500">
|
||||
<template #default="{row}">
|
||||
<el-button type="success" @click="toWebClientLink(row)">Web-Client</el-button>
|
||||
<el-button 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>
|
||||
@@ -139,6 +140,12 @@
|
||||
</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>
|
||||
|
||||
@@ -147,9 +154,10 @@
|
||||
import { list as fetchTagList } from '@/api/tag'
|
||||
import { loadAllUsers } from '@/global'
|
||||
import { useRepositories } from '@/views/address_book/index'
|
||||
import { toWebClientLink } from '@/utils/webclient'
|
||||
import { toWebClientLink, getPeerSlat } from '@/utils/webclient'
|
||||
import { T } from '@/utils/i18n'
|
||||
import { useRoute } from 'vue-router'
|
||||
import shareByWebClient from '@/views/address_book/components/shareByWebClient.vue'
|
||||
|
||||
const route = useRoute()
|
||||
const { allUsers, getAllUsers } = loadAllUsers()
|
||||
@@ -178,7 +186,9 @@
|
||||
toEdit,
|
||||
toAdd,
|
||||
submit,
|
||||
currentColor,
|
||||
shareToWebClientVisible,
|
||||
shareToWebClientForm,
|
||||
toShowShare,
|
||||
} = useRepositories()
|
||||
|
||||
if (route.query?.user_id) {
|
||||
@@ -192,6 +202,7 @@
|
||||
|
||||
watch(() => listQuery.page_size, handlerQuery)
|
||||
|
||||
|
||||
</script>
|
||||
|
||||
<style scoped lang="scss">
|
||||
|
||||
Reference in New Issue
Block a user