avana/numeretti
3
0
Fork 0
Code Issues 2 Pull requests Releases Activity

vue rewrite start

Browse source
This commit is contained in:
boyska 2022-08-20 16:48:26 +02:00
parent bd7891d2fb
commit c7c69a8c90
4 changed files with 82 additions and 0 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

9
pizzicore/pages/spa.html Normal file
View file

@ -0,0 +1,9 @@
<html>
<body data-cid="0">
<div id="app">
</div>
<script src="https://cdn.jsdelivr.net/npm/vue@3"></script>
<script type="application/javascript" src="/static/js/spa.js"></script>
</body>
</html>

4
pizzicore/pizzicore.py
View file

@ -214,3 +214,7 @@ async def root_page():
@app.get("/prenota")
async def prenota_page():
return await get_page("pages/prenotati.html")
@app.get("/new")
async def prenota_page():
return await get_page("pages/spa.html")

62
pizzicore/static/js/spa.js Normal file
View file

@ -0,0 +1,62 @@
const { createApp } = Vue
var app = createApp({
data() {
return {
counter: -1,
}
},
components: {
'CounterController': Vue.defineAsyncComponent( () => import('/static/vue/counter.js') )
},
template: `
<CounterController queue_num="0"></CounterController>
<CounterController queue_num="1"></CounterController>
`,
})
app.mount('#app')
app.component(
'counter-controller',
{
data: () => { counter: 0; },
template: `<div class="counter">{{counter}}</div>`,
}
)
function get_cid() {
return document.getElementsByTagName('body')[0].dataset.cid;
}
function get_url(cid)
{
if(cid === undefined) {
cid = get_cid()
}
var url = "";
if(window.location.protocol == "http:") {
url += "ws://"
} else {
url = "wss://"
}
url += window.location.host + '/v1/ws/counter/';
url += cid
return url;
}
function do_websocket(cid, callback)
{
const socket = new WebSocket(get_url(cid));
socket.onmessage = function(evt) {
var msg = JSON.parse(evt.data)
callback(msg.value)
}
socket.onclose = function() {
setTimeout(do_websocket, 3000)
}
socket.onerror = socket.onclose
}
do_websocket()

7
pizzicore/static/vue/counter.js Normal file
View file

@ -0,0 +1,7 @@
const template = ` <div class="counter">{{counter}}</div>`
export default {
props: ["queue_num"],
data() { return { counter: -1 } },
template: template,
}