|
2 | 2 | <div class="btn-group mr-1 mt-1 position-static" v-click-outside="handleClickAway"> |
3 | 3 | <div style="display: inline-block;"> |
4 | 4 | <button class="btn btn-sm dropdown-toggle" :class="activeClass" v-on:click="showDropDown = !showDropDown"> |
5 | | - {{compositeTitle}} |
| 5 | + {{compositeTitle}} |
6 | 6 | </button> |
7 | 7 | <div v-if="showDropDown" class="dropdown-menu shadow show"> |
8 | 8 | <form class="p-2"> |
|
11 | 11 | <template v-for="(group, groupKey) in nonCollapseFiltSet" :key="groupKey"> |
12 | 12 | <ul style="list-style-type: none; padding-left: 0;"> |
13 | 13 | <div class="custom-control custom-checkbox"> |
14 | | - <input class="custom-control-input" type="checkbox" :value="groupKey" |
| 14 | + <input class="custom-control-input" type="checkbox" :value="groupKey" |
15 | 15 | :id="groupKey" v-model="group.allTrue" @change="handleGroupToggle(group)"> |
16 | 16 | <label class="custom-control-label" :for="groupKey">{{group.title}}</label> |
17 | 17 | </div> |
18 | 18 | <ul style="list-style-type: none; padding-left: 1rem; padding-top: 0.2rem;"> |
19 | 19 | <template v-for="(member, memberKey) in group.members" :key="memberKey"> |
20 | 20 | <li> |
21 | 21 | <div class="custom-control custom-checkbox"> |
22 | | - <input class="custom-control-input" type="checkbox" :value="memberKey" :id="memberKey" |
| 22 | + <input class="custom-control-input" type="checkbox" :value="memberKey" :id="memberKey" |
23 | 23 | v-model="member.val" @change="handleMemberToggle(member, group)"> |
24 | 24 | <label class="custom-control-label" :for="memberKey">{{member.title}}</label> |
25 | 25 | <small class="form-text text-muted">{{member.desc}}</small> |
|
40 | 40 | <div v-if="showHidden"> |
41 | 41 | <li> |
42 | 42 | <div class="custom-control custom-checkbox"> |
43 | | - <input class="custom-control-input" type="checkbox" :value="groupKey" |
| 43 | + <input class="custom-control-input" type="checkbox" :value="groupKey" |
44 | 44 | :id="groupKey" v-model="group.allTrue" @change="handleGroupToggle(group)"> |
45 | 45 | <label class="custom-control-label" :for="groupKey">{{group.title}}</label> |
46 | 46 | </div> |
47 | 47 | <ul style="list-style-type: none; padding-left: 1rem; padding-top: 0.2rem;"> |
48 | 48 | <template v-for="(member, memberKey) in group.members" :key="memberKey"> |
49 | 49 | <li> |
50 | 50 | <div class="custom-control custom-checkbox"> |
51 | | - <input class="custom-control-input" type="checkbox" :value="memberKey" :id="memberKey" |
| 51 | + <input class="custom-control-input" type="checkbox" :value="memberKey" :id="memberKey" |
52 | 52 | v-model="member.val" @change="handleMemberToggle(member, group)"> |
53 | 53 | <label class="custom-control-label" :for="memberKey">{{member.title}}</label> |
54 | 54 | <small class="form-text text-muted">{{member.desc}}</small> |
@@ -100,34 +100,34 @@ export default { |
100 | 100 | }, |
101 | 101 | data: function() { |
102 | 102 | return { |
103 | | - // persisted form values. Loaded on show. Updated on save. |
| 103 | + // persisted form values. Loaded on show. Updated on save. |
104 | 104 | pFiltSet: { |
105 | 105 | gColorFilter: { |
106 | 106 | title: "Example Filter Group", |
107 | 107 | members: { |
108 | | - red: { |
109 | | - title: "Red", |
| 108 | + red: { |
| 109 | + title: "Red", |
110 | 110 | desc: "Is red." |
111 | 111 | }, |
112 | | - green: { |
113 | | - title: "Green", |
| 112 | + green: { |
| 113 | + title: "Green", |
114 | 114 | desc: "Is green" |
115 | 115 | } |
116 | 116 | } |
117 | 117 | }, |
118 | 118 | gQCFails:{ |
119 | 119 | title: "Quality Control Failures", |
120 | 120 | members: { |
121 | | - mainQC: { |
122 | | - title: "Main Quality Control", |
| 121 | + mainQC: { |
| 122 | + title: "Main Quality Control", |
123 | 123 | desc: "Failed primary quality control" |
124 | 124 | }, |
125 | | - secondary: { |
126 | | - title: "Secondary", |
| 125 | + secondary: { |
| 126 | + title: "Secondary", |
127 | 127 | desc: "Failed Secondary quality control" |
128 | 128 | }, |
129 | | - alice: { |
130 | | - title: "Project alICE", |
| 129 | + alice: { |
| 130 | + title: "Project alICE", |
131 | 131 | desc: "Failed QC for the fictional alICE project" |
132 | 132 | } |
133 | 133 | } |
@@ -159,8 +159,8 @@ export default { |
159 | 159 | this.eFiltSet = clone(this.pFiltSet) |
160 | 160 | }, |
161 | 161 | computed: { |
162 | | - activeClass() { |
163 | | - if(this.appliedFiltersCount > 0){ |
| 162 | + activeClass() { |
| 163 | + if(this.appliedFiltersCount > 0){ |
164 | 164 | return('btn-primary') |
165 | 165 | } |
166 | 166 | else { |
|
0 commit comments