условно работающие статические файлы и "динамический" контент

2024-10-29 15:55:47 +03:00
commit 9502debfee
25 changed files with 13448 additions and 0 deletions
--- a/static/favicon.png
+++ b/static/favicon.png
--- a/static/js/modules/header.js
+++ b/static/js/modules/header.js
@@ -0,0 +1,23 @@
+import { ref } from 'vue'
+export default {
+    el: '#status-header',
+    data: {
+        message: 'Hello Vue!',
+        now: new Date()
+    },
+    methods: {
+        updateDate() {
+            this.now = new Date();
+        }
+    },
+    mounted() {
+        setInterval(() => {
+            this.updateDate();
+        }, 1000);
+    },
+    setup() {
+        const count = ref(0)
+        return { count }
+    },
+    template: `<div>Счётчик: {{ count }}</div>`
+}
--- a/static/js/vue.js
+++ b/static/js/vue.js
--- a/static/login.html
+++ b/static/login.html
@@ -0,0 +1,42 @@
+<!DOCTYPE html>
+<html lang="en">
+<head>
+    <meta charset="UTF-8">
+    <title>Login</title>
+</head>
+<body>
+<header>
+    <div id="app">
+        <h1>{{ message }}</h1>
+        <p>{{ now }}</p>
+    </div>
+
+    <div id="status-header"></div>
+
+    <!-- Версия для разработки включает в себя возможность вывода в консоль полезных уведомлений -->
+    <script src="js/vue.js"></script>
+    <script>
+        const app = new Vue({
+            el: '#app',
+            data: {
+                message: 'Hello Vue!',
+                now: new Date()
+            },
+            methods: {
+                updateDate() {
+                    this.now = new Date();
+                }
+            },
+            mounted() {
+                setInterval(() => {
+                    this.updateDate();
+                }, 1000);
+            }
+        })
+
+        // import MyComponent from './modules/header'
+        // const sh = new Vue(MyComponent)
+    </script>
+</header>
+</body>
+</html>
--- a/static/style.css
+++ b/static/style.css