notes(ui): 选中录音同步到 URL ?id=N(可刷新/分享/前进后退)
deploy notes / build-and-deploy (push) Successful in 3m13s
deploy notes / build-and-deploy (push) Successful in 3m13s
This commit is contained in:
@@ -239,7 +239,8 @@ async function submitPass() {
|
|||||||
await listRecordings()
|
await listRecordings()
|
||||||
needPass.value = false
|
needPass.value = false
|
||||||
authError.value = ''
|
authError.value = ''
|
||||||
refresh()
|
await refresh()
|
||||||
|
syncFromUrl()
|
||||||
startPoll()
|
startPoll()
|
||||||
} catch (e) {
|
} catch (e) {
|
||||||
if (e.unauthorized) {
|
if (e.unauthorized) {
|
||||||
@@ -257,6 +258,7 @@ function logout() {
|
|||||||
list.value = []
|
list.value = []
|
||||||
selected.value = null
|
selected.value = null
|
||||||
selectedId.value = null
|
selectedId.value = null
|
||||||
|
history.replaceState(null, '', window.location.pathname)
|
||||||
stopPoll()
|
stopPoll()
|
||||||
}
|
}
|
||||||
|
|
||||||
@@ -298,12 +300,21 @@ async function refresh(silent = false) {
|
|||||||
|
|
||||||
async function select(id) {
|
async function select(id) {
|
||||||
selectedId.value = id
|
selectedId.value = id
|
||||||
|
// URL 同步:?id=N,方便刷新 / 分享 / bookmark
|
||||||
|
const q = new URLSearchParams(window.location.search)
|
||||||
|
q.set('id', String(id))
|
||||||
|
history.replaceState(null, '', '?' + q.toString())
|
||||||
try { selected.value = await getRecording(id) }
|
try { selected.value = await getRecording(id) }
|
||||||
catch (e) {
|
catch (e) {
|
||||||
if (e.unauthorized) { logout(); return }
|
if (e.unauthorized) { logout(); return }
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
|
function syncFromUrl() {
|
||||||
|
const id = parseInt(new URLSearchParams(window.location.search).get('id'))
|
||||||
|
if (id && id !== selectedId.value) select(id)
|
||||||
|
}
|
||||||
|
|
||||||
function onFile(e) {
|
function onFile(e) {
|
||||||
const f = e.target.files?.[0]
|
const f = e.target.files?.[0]
|
||||||
if (!f) return
|
if (!f) return
|
||||||
@@ -332,6 +343,7 @@ async function remove() {
|
|||||||
await deleteRecording(selectedId.value)
|
await deleteRecording(selectedId.value)
|
||||||
selectedId.value = null
|
selectedId.value = null
|
||||||
selected.value = null
|
selected.value = null
|
||||||
|
history.replaceState(null, '', window.location.pathname)
|
||||||
await refresh()
|
await refresh()
|
||||||
} catch (e) { alert(e.message) }
|
} catch (e) { alert(e.message) }
|
||||||
}
|
}
|
||||||
@@ -421,10 +433,19 @@ function stopPoll() {
|
|||||||
if (pollTimer) { clearInterval(pollTimer); pollTimer = null }
|
if (pollTimer) { clearInterval(pollTimer); pollTimer = null }
|
||||||
}
|
}
|
||||||
|
|
||||||
onMounted(() => {
|
onMounted(async () => {
|
||||||
if (!needPass.value) { refresh(); startPoll() }
|
if (!needPass.value) {
|
||||||
|
await refresh()
|
||||||
|
syncFromUrl()
|
||||||
|
startPoll()
|
||||||
|
}
|
||||||
|
// 浏览器前进/后退按钮也同步
|
||||||
|
window.addEventListener('popstate', syncFromUrl)
|
||||||
|
})
|
||||||
|
onBeforeUnmount(() => {
|
||||||
|
stopPoll()
|
||||||
|
window.removeEventListener('popstate', syncFromUrl)
|
||||||
})
|
})
|
||||||
onBeforeUnmount(stopPoll)
|
|
||||||
</script>
|
</script>
|
||||||
|
|
||||||
<style>
|
<style>
|
||||||
|
|||||||
Reference in New Issue
Block a user