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
| <template>
| <!-- 添加标签 -->
| <view>
| <search-bar placeholder="搜索标签名称" class="ml-10 mr-10"></search-bar>
| <view class="font-14 content">
| <view class="content-title">
| <text>常用标签</text>
| </view>
| <view>
| <checkbox-group>
| <label v-for="(item,index) in list" class="flex align-center">
| <view class="ml-10">
| <checkbox color="#518EFF"></checkbox>
| </view>
| <view class="ml-10 checkbox-text">{{item.name}}</view>
| </label>
| </checkbox-group>
| </view>
| </view>
| <button class="sticky-footer blue-btn">创建标签</button>
| </view>
| </template>
|
| <script>
| import searchBar from '../../components/searchBar/index.vue';
| export default {
| components:{
| searchBar
| },
| data(){
| return{
| list:[
| {name:'痘坑'},
| {name:'美白'},
| {name:'祛斑'},
| {name:'瘦身'},
| {name:'祛痘'},
| {name:'塑性'},
| {name:'双眼皮'},
| {name:'白富美'},
| {name:'轻度色斑'},
| {name:'瘦脸'},
| {name:'减肥美白'},
| {name:'胎记'}
| ]
| }
| }
| }
| </script>
|
| <style>
| .content{
| margin-bottom: 60px;
| }
| .content-title{
| background: #F2F2F2;
| padding: 10px;
| }
| .checkbox-text{
| width: 100%;
| padding: 10px 0;
| border-bottom: 1px solid #EDEAF4;
| }
| .sticky-footer{
| bottom: 10px;
| }
| </style>
|
|