65 lines
1.8 KiB
HTML
65 lines
1.8 KiB
HTML
<!DOCTYPE html>
|
|
<html>
|
|
<body>
|
|
<style>
|
|
.block {margin-bottom: 10px}
|
|
#projects > div {cursor: pointer}
|
|
</style>
|
|
<div class = "block">
|
|
<label for = "user">USER</label>
|
|
<select id = "user"></select>
|
|
</div>
|
|
|
|
<div class = "block">
|
|
<div id = "project-title">ПРОЕКТЫ</div>
|
|
<div id = "projects">EMPTY</div>
|
|
</div>
|
|
|
|
<div class = "block">
|
|
<div id = "member-title">УЧАСТНИКИ</div>
|
|
<div id = "members"></div>
|
|
</div>
|
|
|
|
|
|
<script type="text/javascript">
|
|
(async function () {
|
|
try {
|
|
const $user = document.getElementById('user')
|
|
const $projects = document.getElementById('projects')
|
|
const $members = document.getElementById('members')
|
|
|
|
let members = {}
|
|
|
|
$user.addEventListener('change', async () => {
|
|
const user_id = $user.value
|
|
const projects = await fetch('/api/miniapp/project?user_id=' + user_id).then(res => res.json())
|
|
$projects.innerHTML = projects.data.map(e =>
|
|
`<div id = "${e.id}" title = '${JSON.stringify(e)}'>${e.name} - ${e.description}</div>`
|
|
).join('')
|
|
$members.innerHTML = ''
|
|
})
|
|
|
|
$projects.addEventListener('click', async (evt) => {
|
|
if (evt.target.parentNode != $projects)
|
|
return
|
|
|
|
const _members = await fetch('/api/miniapp/project/' + evt.target.id + '/member?user_id=' + $user.value).then(res => res.json())
|
|
members = _members.data
|
|
$members.innerHTML = members.map(e =>
|
|
`<div id = "${e.id}" title = '${JSON.stringify(e)}' is-blocked = '${e.is_blocked}'>${e.id} - ${e.telegram_name}</div>`
|
|
).join('')
|
|
})
|
|
|
|
|
|
const user_ids = await fetch('/api/miniapp/user').then(res => res.json())
|
|
$user.innerHTML = user_ids.data.map(id => `<option value = '${id}'>${id}</option>`).join('')
|
|
$user.dispatchEvent(new Event('change'))
|
|
} catch (err) {
|
|
console.error(err)
|
|
alert(err.message)
|
|
}
|
|
})();
|
|
</script>
|
|
|
|
</body>
|
|
</html> |