勾选框调整变大

搜索框支持空格分隔多个搜索

index.html

@@ -44,9 +44,9 @@
 	<div class="row navbar-btn" v-if="allServiceList.length">
 	<div class="row navbar-btn" v-if="allServiceList.length">
 		<div class="col-lg-6">
 		<div class="col-lg-6">
 			<div class="input-group">
 			<div class="input-group">
-				<input type="text" class="form-control" v-model="searchText" placeholder="Search for...">
+				<input type="text" class="form-control" v-model="searchText" placeholder="输入搜索内容">
 				<span class="input-group-btn">
 				<span class="input-group-btn">
-        <button class="btn btn-danger" type="button" @click="cleanSearchText">clean</button>
+        <button class="btn btn-danger" type="button" @click="cleanSearchText">清楚搜索内容</button>
       </span>
       </span>
 			</div>
 			</div>
 		</div>
 		</div>
@@ -67,7 +67,7 @@
 				<h3 v-if="!item.isWebService">{{item.serviceName}}</h3>
 				<h3 v-if="!item.isWebService">{{item.serviceName}}</h3>
 				<h4 v-else>{{item.serviceName}}</h4>
 				<h4 v-else>{{item.serviceName}}</h4>
 			</td>
 			</td>
-			<td><input class="form-check-input" type="checkbox" v-model="item.isOpen"/></td>
+			<td><input class="form-check-input" type="checkbox" style="zoom: 230%;" v-model="item.isOpen"/></td>
 		</tr>
 		</tr>
 		</tbody>
 		</tbody>
 	</table>
 	</table>
@@ -85,14 +85,30 @@
             },
             },
             searchText: function (val) {
             searchText: function (val) {
                 //在allServiceList中找到包含val的
                 //在allServiceList中找到包含val的
+				if (val.indexOf(" ") != -1) {
+					let valArr = val.split(" ");
 					let serviceList = [];
 					let serviceList = [];
+					for (let i = 0; i < valArr.length; i++) {
+						let val = valArr[i];
 						this.allServiceList.forEach((item) => {
 						this.allServiceList.forEach((item) => {
 							console.log(item)
 							console.log(item)
 							if (item.serviceName.indexOf(val) != -1) {
 							if (item.serviceName.indexOf(val) != -1) {
 								serviceList.push(item);
 								serviceList.push(item);
 							}
 							}
 						});
 						});
+					}
 					this.serviceList = serviceList;
 					this.serviceList = serviceList;
+				}else {
+					let serviceList = [];
+					this.allServiceList.forEach((item) => {
+						console.log(item)
+						if (item.serviceName.indexOf(val) != -1) {
+							serviceList.push(item);
+						}
+					});
+					this.serviceList = serviceList;
+				}
+                
             }
             }
         },
         },
         data: {
         data: {