保存进度！

2022-10-23 15:32:03 +08:00
parent 6a3f5d820f
commit e4fff250d2
2 changed files with 48 additions and 3 deletions
--- a/code/web/car_dealer/vue/todo-list.html
+++ b/code/web/car_dealer/vue/todo-list.html
@@ -2,7 +2,7 @@
 * @Author: Kane
 * @Date: 2022-10-21 16:36:51
 * @LastEditors: Kane
- * @LastEditTime: 2022-10-23 00:07:47
+ * @LastEditTime: 2022-10-23 15:22:51
 * @FilePath: \car_dealer\vue\todo-list.html
 * @Description: 
 * 
@@ -25,12 +25,18 @@

 <body>
    <div id="app">
+        <div id="message_border">
+            <div class="message_box">
+                <span>{{errorMessage}}</span>
+                <button type="button" @click="closeMessageBox()">关闭</button>
+            </div>
+        </div>
        <div class="content">
            <h1>{{title}}</h1>
            <div class="border">
                <div class="add_todo">
                    <input type="text" placeholder="请输入待办事项" />
-                    <button type="button">添加</button>
+                    <button type="button" @click="showMessageBox()">添加</button>
                </div>
                <hr>
                <div class="todo_list">
@@ -51,12 +57,14 @@
            </div>
        </div>
    </div>
+
 </body>
 <script>
    const app = {
        data() {
            return {
                title: "待办任务",
+                errorMessage: "奇怪的错误！",
                todo_list: [{
                        selected: false,
                        todo_text: "回家",
@@ -170,6 +178,16 @@
            },
            removeTodo(index) {
                this.todo_list.splice(index, 1);
+            },
+            showMessageBox() {
+                const message = document.getElementById("message_border");
+
+                message.style["display"] = "flex";
+            },
+            closeMessageBox() {
+                const message = document.getElementById("message_border");
+
+                message.style["display"] = "none";
            }
        },
        computed: {