-
Notifications
You must be signed in to change notification settings - Fork 0
/
Copy pathindex.html
80 lines (76 loc) · 3.73 KB
/
index.html
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta http-equiv="X-UA-Compatible" content="ie=edge">
<title>叶剑锋便签</title>
<link rel="stylesheet" href="https://g.alicdn.com/msui/sm/0.6.2/css/sm.min.css">
<link rel="stylesheet" href="./css/index.min.css">
</head>
<body>
<div id="app">
<!-- page集合的容器，里面放多个平行的.page，其他.page作为内联页面由路由控制展示 -->
<div class="page-group">
<!-- 单个page ,第一个.page默认被展示-->
<div class="page page-current">
<!-- 头部展示区 -->
<header class="bar bar-nav">
<a class="icon icon-star pull-left"></a>
<a class="icon icon-edit pull-right" @click="modelShow=!modelShow"></a>
<h1 class="title">前端锋神便签</h1>
</header>
<!-- 添加弹出的模态框 -->
<div class="module" v-show="modelShow">
<div class="bg">
<div class="addbox">
<div>
<input type="text" v-model="inputContent">
</div>
<div class="content-block" @click="clearContent">
<button class="button button-fill" @click="addItem">添加</button>
</div>
<div class="content-block">
<button class="button button-danger button-fill" @click="modelShow=!modelShow">取消</button>
</div>
</div>
</div>
</div>
<!-- 删除弹出的警告框 -->
<div class="module" v-show="wraning">
<div class="bg">
<div class="wranbox">
<p>你确定要删除这条信息吗？</p>
<div @click="wraning=!wraning">
<button class="button button-fill" @click="remove()">确定</button>
<button class="button button-danger button-fill">取消</button>
</div>
</div>
</div>
</div>
<!-- 内容展示区 -->
<div class="content">
<!-- 卡片展示 -->
<div class="card" v-for="(todo,index) in newTodos">
<div class="card-content">
<div class="card-content-inner">
<p>{{todo.content}}</p>
<div class="btnbox">
<button class="button button-success" @click="todo.f=!todo.f" :class='[todo.f?"button-fill":""]'><i class="icon icon-check"></i></button>
<button class="button button-danger" @click="checkItem(index)"><i class="icon icon-remove"></i></button>
</div>
</div>
</div>
</div>
<!-- 底部nav -->
<div class="footer">
<div v-for="navBar in navBars" :key=' navBar.id ' class="circle" :class='[ "circle-" + navBar.style, type == navBar.nav?"circle-choose":"" ]' @click=' type = navBar.nav '>{{navBar.nav}}</div>
</div>
</div>
</div>
</div>
</div>
</body>
<script src="./js/vue.js"></script>
<script src="./js/index.js"></script>
</html>