阶段性提交

web/public/js/components/common/network-addresses-box.js

@@ -1,12 +1,17 @@
 Vue.component("network-addresses-box", {
-	props: ["vServerType", "vAddresses"],
+	props: ["v-server-type", "v-addresses", "v-protocol"],
 	data: function () {
 		let addresses = this.vAddresses
 		if (addresses == null) {
 			addresses = []
 		}
+		let protocol = this.vProtocol
+		if (protocol == null) {
+			protocol = ""
+		}
 		return {
-			addresses: addresses
+			addresses: addresses,
+			protocol: protocol
 		}
 	},
 	watch: {
@@ -17,7 +22,7 @@ Vue.component("network-addresses-box", {
 	methods: {
 		addAddr: function () {
 			let that = this
-			teaweb.popup("/servers/addPortPopup?serverType=" + this.vServerType, {
+			teaweb.popup("/servers/addPortPopup?serverType=" + this.vServerType + "&protocol=" + this.protocol, {
 				callback: function (resp) {
 					var addr = resp.data.address;
 					that.addresses.push(addr);

web/public/js/components/common/size-capacity-box.js

@@ -0,0 +1,46 @@
+Vue.component("size-capacity-box", {
+	props: ["v-name", "v-value", "v-count", "v-unit"],
+	data: function () {
+		let v = this.vValue
+		if (v == null) {
+			v = {
+				count: this.vCount,
+				unit: this.vUnit
+			}
+		}
+		if (typeof (v["count"]) != "number") {
+			v["count"] = -1
+		}
+		return {
+			"size": v,
+			countString: (v.count >= 0) ? v.count.toString() : ""
+		}
+	},
+	watch: {
+		"countString": function (newValue) {
+			let value = newValue.trim()
+			if (value.length == 0) {
+				this.size.count = -1
+				return
+			}
+			let count = parseInt(value)
+			if (!isNaN(count)) {
+				this.size.count = count
+			}
+		}
+	},
+	template: `<div class="ui fields inline">
+	<input type="hidden" :name="vName" :value="JSON.stringify(size)"/>
+	<div class="ui field">
+		<input type="text" v-model="countString" maxlength="11" size="11"/>
+	</div>
+	<div class="ui field">
+		<select class="ui dropdown" v-model="size.unit">
+			<option value="byte">字节</option>
+			<option value="kb">KB</option>
+			<option value="mb">MB</option>
+			<option value="gb">GB</option>
+		</select>
+	</div>
+</div>`
+})