1.4.5.2

EdgeUser/web/public/js/components/server/origin-input-box.js

@@ -0,0 +1,134 @@
+Vue.component("origin-input-box", {
+	props: ["v-family", "v-oss-types"],
+	data: function () {
+		let family = this.vFamily
+		if (family == null) {
+			family = "http"
+		}
+
+		let ossTypes = this.vOssTypes
+		if (ossTypes == null) {
+			ossTypes = []
+		}
+
+		return {
+			origins: [],
+			isAdding: false,
+			family: family,
+			ossTypes: ossTypes
+		}
+	},
+	methods: {
+		add: function () {
+			let scheme = ""
+			switch (this.family) {
+				case "http":
+					scheme = "http"
+					break
+				case "tcp":
+					scheme = "tcp"
+					break
+				case "udp":
+					scheme = "udp"
+					break
+			}
+			this.origins.push({
+				id: "",
+				host: "",
+				isPrimary: true,
+				isPrimaryValue: 1,
+				scheme: scheme
+			})
+
+			let that = this
+			setTimeout(function () {
+				let inputs = that.$refs.originHost
+				if (inputs != null) {
+					inputs[inputs.length - 1].focus()
+				}
+			}, 10)
+		},
+		confirm: function () {
+		},
+		cancel: function () {
+		},
+		remove: function (index) {
+			this.origins.$remove(index)
+		},
+		changePrimary: function (origin) {
+			origin.isPrimary = origin.isPrimaryValue == 1
+		},
+		changeFamily: function (family) {
+			this.family = family
+			let that = this
+			this.origins.forEach(function (origin) {
+				let scheme = ""
+				switch (that.family) {
+					case "http":
+						scheme = "http"
+						break
+					case "tcp":
+						scheme = "tcp"
+						break
+					case "udp":
+						scheme = "udp"
+						break
+				}
+				origin.scheme = scheme
+			})
+		}
+	},
+	template: `<div>
+	<input type="hidden" name="originsJSON" :value="JSON.stringify(origins)"/>
+	<div>
+		<div class="ui fields inline">
+			<div class="ui field" style="padding-left: 0.1em; width:6.8em; color: grey">源站协议</div>
+			<div class="ui field" style="width:21em; color: grey">源站地址（Host:Port）</div>
+			<div class="ui field" style="color: grey">优先级 &nbsp;<tip-icon content="优先级：优先使用主源站，如果主源站无法连接时才会连接备用源站"></tip-icon></div>
+		</div>
+		<div class="ui divider"></div>
+		<div v-for="(origin, index) in origins">
+			<div class="ui fields inline" style="margin-top: 0.6em">
+				<div class="ui field">
+					<select class="ui dropdown auto-width" v-model="origin.scheme">
+						<option value="http" v-if="family == 'http'">http://</option>
+						<option value="https" v-if="family == 'http'">https://</option>
+						
+						<!-- 对象存储 -->
+						<optgroup label="对象存储" v-if="family == 'http' && ossTypes.length > 0"></optgroup>
+						<option v-if="family == 'http'" v-for="ossType in ossTypes" :value="ossType.code">{{ossType.name}}</option>
+						
+						<option value="tcp" v-if="family == 'tcp'">tcp://</option>
+						<option value="tls" v-if="family == 'tcp'">tls://</option>
+						<option value="udp" v-if="family == 'udp'">udp://</option>
+					</select>
+				</div>
+				<div class="ui field">
+					<div v-show="origin.scheme != null && origin.scheme.startsWith('oss:')">
+						请在创建网站后，再在对应网站设置"源站"功能中进行添加对象存储源站。
+					</div>
+					<div v-show="!origin.scheme.startsWith('oss:')">
+						<input type="text" placeholder="源站地址" v-model="origin.host" ref="originHost" style="width:20em"/>
+					</div>	
+				</div>
+				<div class="ui field">
+					<div v-show="origin.scheme != null && origin.scheme.startsWith('oss:')">
+					</div>
+					<div v-show="!origin.scheme.startsWith('oss:')">
+						<select class="ui dropdown auto-width small" v-model="origin.isPrimaryValue" @change="changePrimary(origin)">
+							<option value="1">主</option>
+							<option value="0">备</option>
+						</select>
+					</div>	
+				</div>
+				<div class="ui field">
+					<a href="" title="删除" @click.prevent="remove(index)"><i class="icon remove icon small"></i></a>
+				</div>
+			</div>
+		</div>
+	</div>
+	<div style="margin-top: 1em">
+		<button class="ui button tiny" type="button" @click.prevent="add()">+</button>
+	</div>
+</div>`
+})