优化代码

web/public/js/components/common/combo-box.js

@@ -1,8 +1,16 @@
 Vue.component("combo-box", {
 	// data-url 和 data-key 成对出现
-	props: ["name", "title", "placeholder", "size", "v-items", "v-value", "data-url", "data-key", "width"],
+	props: [
+		"name", "title", "placeholder", "size", "v-items", "v-value",
+		"data-url", // 数据源URL
+		"data-key", // 数据源中数据的键名
+		"data-search", // 是否启用动态搜索，如果值为on或true，则表示启用
+		"width"
+	],
 	mounted: function () {
+		if (this.dataURL.length > 0) {
 			this.search("")
+		}
 
 		// 设定菜单宽度
 		let searchBox = this.$refs.searchBox
@@ -42,6 +50,12 @@ Vue.component("combo-box", {
 			}
 		}
 
+		// data url
+		let dataURL = ""
+		if (typeof this.dataUrl == "string" && this.dataUrl.length > 0) {
+			dataURL = this.dataUrl
+		}
+
 		return {
 			allItems: items, // 原始的所有的items
 			items: items.$copy(), // 候选的items
@@ -53,20 +67,20 @@ Vue.component("combo-box", {
 			styleWidth: width,
 
 			isInitial: true,
+			dataURL: dataURL,
 			urlRequestId: 0 // 记录URL请求ID，防止并行冲突
 		}
 	},
 	methods: {
 		search: function (keyword) {
 			// 从URL中获取选项数据
-			let dataUrl = this.dataUrl
+			let dataUrl = this.dataURL
 			let dataKey = this.dataKey
 			let that = this
 
 			let requestId = Math.random()
 			this.urlRequestId = requestId
 
-			if (dataUrl != null && dataUrl.length > 0 && dataKey != null) {
 			Tea.action(dataUrl)
 				.params({
 					keyword: (keyword == null) ? "" : keyword
@@ -96,7 +110,6 @@ Vue.component("combo-box", {
 						}
 					}
 				})
-			}
 		},
 		formatItems: function (items) {
 			items.forEach(function (v) {
@@ -124,10 +137,12 @@ Vue.component("combo-box", {
 			this.hoverIndex = 0
 		},
 		changeKeyword: function () {
+			let shouldSearch = this.dataURL.length > 0 && (this.dataSearch == "on" || this.dataSearch == "true")
+
 			this.hoverIndex = 0
 			let keyword = this.keyword
 			if (keyword.length == 0) {
-				if (this.dataUrl != null && this.dataUrl.length > 0) {
+				if (shouldSearch) {
 					this.search(keyword)
 				} else {
 					this.items = this.allItems.$copy()
@@ -136,7 +151,7 @@ Vue.component("combo-box", {
 			}
 
 
-			if (this.dataUrl != null && this.dataUrl.length > 0) {
+			if (shouldSearch) {
 				this.search(keyword)
 			} else {
 				this.items = this.allItems.$copy().filter(function (v) {
@@ -222,6 +237,13 @@ Vue.component("combo-box", {
 					break
 				}
 			}
+		},
+
+		setDataURL: function (dataURL) {
+			this.dataURL = dataURL
+		},
+		reloadData: function () {
+			this.search("")
 		}
 	},
 	template: `<div style="display: inline; z-index: 10; background: white" class="combo-box">

web/public/js/components/ns/ns-domain-group-selector.js

@@ -0,0 +1,39 @@
+Vue.component("ns-domain-group-selector", {
+	props: ["v-domain-group-id"],
+	data: function () {
+		let groupId = this.vDomainGroupId
+		if (groupId == null) {
+			groupId = 0
+		}
+		return {
+			userId: 0,
+			groupId: groupId
+		}
+	},
+	methods: {
+		change: function (group) {
+			if (group != null) {
+				this.$emit("change", group.id)
+			} else {
+				this.$emit("change", 0)
+			}
+		},
+		reload: function (userId) {
+			this.userId = userId
+			this.$refs.comboBox.clear()
+			this.$refs.comboBox.setDataURL("/ns/domains/groups/options?userId=" + userId)
+			this.$refs.comboBox.reloadData()
+		}
+	},
+	template: `<div>
+	<combo-box 
+		data-url="/ns/domains/groups/options" 
+		placeholder="选择分组" 
+		data-key="groups" 
+		name="groupId"
+		:v-value="groupId" 
+		@change="change"
+		ref="comboBox">	
+	</combo-box>
+</div>`
+})

web/public/js/components/server/user-selector.js

@@ -27,6 +27,6 @@ Vue.component("user-selector", {
 		}
 	},
 	template: `<div>
-	<combo-box placeholder="选择用户" :data-url="dataURL" :data-key="'users'" name="userId" :v-value="userId" @change="change"></combo-box>
+	<combo-box placeholder="选择用户" :data-url="dataURL" :data-key="'users'" data-search="on" name="userId" :v-value="userId" @change="change"></combo-box>
 </div>`
 })