diff --git a/web/public/js/components.js b/web/public/js/components.js index 71a8fd0e..c17936cb 100644 --- a/web/public/js/components.js +++ b/web/public/js/components.js @@ -305,10 +305,10 @@ Vue.component("traffic-map-box",{props:["v-stats","v-is-attack"],mounted:functio @change="change" ref="comboBox"> -`}),Vue.component("ns-routes-selector",{props:["v-routes"],mounted:function(){let t=this;Tea.action("/ns/routes/options").post().success(function(e){t.routes=e.data.routes})},data:function(){let e=this.vRoutes;return{routeCode:"default",routes:[],isAdding:!1,routeType:"default",selectedRoutes:e=null==e?[]:e}},watch:{routeType:function(t){this.routeCode="";let i=this;this.routes.forEach(function(e){e.type==t&&0==i.routeCode.length&&(i.routeCode=e.code)})}},methods:{add:function(){this.isAdding=!0,this.routeType="default",this.routeCode="default"},cancel:function(){this.isAdding=!1},confirm:function(){if(0!=this.routeCode.length){let t=this;this.routes.forEach(function(e){e.code==t.routeCode&&t.selectedRoutes.push(e)}),this.cancel()}},remove:function(e){this.selectedRoutes.$remove(e)}},template:`
-
+
`}),Vue.component("ns-routes-selector",{props:["v-routes","name"],mounted:function(){let t=this;Tea.action("/ns/routes/options").post().success(function(e){t.routes=e.data.routes})},data:function(){let e=this.vRoutes,t=(null==e&&(e=[]),this.name);return{routeCode:"default",inputName:t="string"==typeof t&&0!=t.length?t:"routeCodes",routes:[],isAdding:!1,routeType:"default",selectedRoutes:e}},watch:{routeType:function(t){this.routeCode="";let i=this;this.routes.forEach(function(e){e.type==t&&0==i.routeCode.length&&(i.routeCode=e.code)})}},methods:{add:function(){this.isAdding=!0,this.routeType="default",this.routeCode="default",this.$emit("add")},cancel:function(){this.isAdding=!1,this.$emit("cancel")},confirm:function(){if(0!=this.routeCode.length){let t=this;this.routes.forEach(function(e){e.code==t.routeCode&&t.selectedRoutes.push(e)}),this.$emit("change",this.selectedRoutes),this.cancel()}},remove:function(e){this.selectedRoutes.$remove(e),this.$emit("change",this.selectedRoutes)}},template:`
+
- + {{route.name}}  
@@ -613,6 +613,46 @@ Vue.component("traffic-map-box",{props:["v-stats","v-is-attack"],mounted:functio  
+
`}),Vue.component("ns-create-records-table",{props:["v-types"],data:function(){let e=this.vTypes;return{types:e=null==e?[]:e,records:[{name:"",type:"A",value:"",routeCodes:[],ttl:600,index:0}],lastIndex:0,isAddingRoutes:!1}},methods:{add:function(){this.records.push({name:"",type:"A",value:"",routeCodes:[],ttl:600,index:++this.lastIndex});let e=this;setTimeout(function(){e.$refs.nameInputs.$last().focus()},100)},remove:function(e){this.records.$remove(e)},addRoutes:function(){this.isAddingRoutes=!0},cancelRoutes:function(){let e=this;setTimeout(function(){e.isAddingRoutes=!1},1e3)},changeRoutes:function(e,t){e.routeCodes=null==t?[]:t.map(function(e){return e.code})}},template:`
+ + + + + + + + + + + + + + + + + + + + +
记录名记录类型线路记录值TTL操作
+ + + + + + + + +
+ + +
+
+ +
+
`}),Vue.component("ns-route-selector",{props:["v-route-code"],mounted:function(){let t=this;Tea.action("/ns/routes/options").post().success(function(e){t.routes=e.data.routes})},data:function(){let e=this.vRouteCode;return{routeCode:e=null==e?"":e,routes:[]}},template:`
+ {{route.name}}  
@@ -2012,6 +2022,109 @@ Vue.component("ns-route-ranges-box", {
` }) +Vue.component("ns-create-records-table", { + props: ["v-types"], + data: function () { + let types = this.vTypes + if (types == null) { + types = [] + } + return { + types: types, + records: [ + { + name: "", + type: "A", + value: "", + routeCodes: [], + ttl: 600, + index: 0 + } + ], + lastIndex: 0, + isAddingRoutes: false // 是否正在添加线路 + } + }, + methods: { + add: function () { + this.records.push({ + name: "", + type: "A", + value: "", + routeCodes: [], + ttl: 600, + index: ++this.lastIndex + }) + let that = this + setTimeout(function () { + that.$refs.nameInputs.$last().focus() + }, 100) + }, + remove: function (index) { + this.records.$remove(index) + }, + addRoutes: function () { + this.isAddingRoutes = true + }, + cancelRoutes: function () { + let that = this + setTimeout(function () { + that.isAddingRoutes = false + }, 1000) + }, + changeRoutes: function (record, routes) { + if (routes == null) { + record.routeCodes = [] + } else { + record.routeCodes = routes.map(function (route) { + return route.code + }) + } + } + }, + template: `
+ + + + + + + + + + + + + + + + + + + + +
记录名记录类型线路记录值TTL操作
+ + + + + + + + +
+ + +
+
+ +
+ +
`, +}) + // 选择单一线路 Vue.component("ns-route-selector", { props: ["v-route-code"], diff --git a/web/public/js/components/ns/ns-create-records-table.js b/web/public/js/components/ns/ns-create-records-table.js new file mode 100644 index 00000000..53535d69 --- /dev/null +++ b/web/public/js/components/ns/ns-create-records-table.js @@ -0,0 +1,102 @@ +Vue.component("ns-create-records-table", { + props: ["v-types"], + data: function () { + let types = this.vTypes + if (types == null) { + types = [] + } + return { + types: types, + records: [ + { + name: "", + type: "A", + value: "", + routeCodes: [], + ttl: 600, + index: 0 + } + ], + lastIndex: 0, + isAddingRoutes: false // 是否正在添加线路 + } + }, + methods: { + add: function () { + this.records.push({ + name: "", + type: "A", + value: "", + routeCodes: [], + ttl: 600, + index: ++this.lastIndex + }) + let that = this + setTimeout(function () { + that.$refs.nameInputs.$last().focus() + }, 100) + }, + remove: function (index) { + this.records.$remove(index) + }, + addRoutes: function () { + this.isAddingRoutes = true + }, + cancelRoutes: function () { + let that = this + setTimeout(function () { + that.isAddingRoutes = false + }, 1000) + }, + changeRoutes: function (record, routes) { + if (routes == null) { + record.routeCodes = [] + } else { + record.routeCodes = routes.map(function (route) { + return route.code + }) + } + } + }, + template: `
+ + + + + + + + + + + + + + + + + + + + +
记录名记录类型线路记录值TTL操作
+ + + + + + + + +
+ + +
+
+ +
+ +
`, +}) \ No newline at end of file diff --git a/web/public/js/components/ns/ns-routes-selector.js b/web/public/js/components/ns/ns-routes-selector.js index 9a208eef..7285fdf0 100644 --- a/web/public/js/components/ns/ns-routes-selector.js +++ b/web/public/js/components/ns/ns-routes-selector.js @@ -1,6 +1,6 @@ // 选择多个线路 Vue.component("ns-routes-selector", { - props: ["v-routes"], + props: ["v-routes", "name"], mounted: function () { let that = this Tea.action("/ns/routes/options") @@ -15,12 +15,18 @@ Vue.component("ns-routes-selector", { selectedRoutes = [] } + let inputName = this.name + if (typeof inputName != "string" || inputName.length == 0) { + inputName = "routeCodes" + } + return { routeCode: "default", + inputName: inputName, routes: [], isAdding: false, routeType: "default", - selectedRoutes: selectedRoutes + selectedRoutes: selectedRoutes, } }, watch: { @@ -39,9 +45,11 @@ Vue.component("ns-routes-selector", { this.isAdding = true this.routeType = "default" this.routeCode = "default" + this.$emit("add") }, cancel: function () { this.isAdding = false + this.$emit("cancel") }, confirm: function () { if (this.routeCode.length == 0) { @@ -54,17 +62,19 @@ Vue.component("ns-routes-selector", { that.selectedRoutes.push(v) } }) + this.$emit("change", this.selectedRoutes) this.cancel() }, remove: function (index) { this.selectedRoutes.$remove(index) + this.$emit("change", this.selectedRoutes) } } , template: `
-
+
- + {{route.name}}