CPICXIM/car_deal_util
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

保存进度！

Browse Source
This commit is contained in:
Kane
2022-10-23 15:32:03 +08:00
parent 6a3f5d820f
commit e4fff250d2
2 changed files with 48 additions and 3 deletions
Download Patch File Download Diff File Expand all files Collapse all files

29
code/web/car_dealer/css/todo-list/to-list.css
View File

@@ -2,7 +2,7 @@
* @Author: Kane
* @Date: 2022-10-21 16:39:27
* @LastEditors: Kane
* @LastEditTime: 2022-10-23 00:10:50
* @LastEditTime: 2022-10-23 15:26:59
* @FilePath: \car_dealer\css\todo-list\to-list.css
* @Description: 用于待办事项页面的css！
*
@@ -158,3 +158,30 @@ hr {
text-align: right;
margin: 0px 1rem;
}
#message_border {
position: fixed;
display: none;
left: 0px;
top: 0px;
right: 0px;
bottom: 0px;
background-color: rgba(128, 128, 128, 0.8);
justify-content: center;
align-items: center;
}
.message_box {
display: flex;
flex-direction: column;
justify-content: center;
align-items: center;
background-color: var(--backupground-color);
padding: 2rem;
border-radius: 5px;
}
.message_box > button {
padding: 0.5rem 2rem;
font-size: 1rem;
}

22
code/web/car_dealer/vue/todo-list.html
View File

@@ -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: {