diff options
Diffstat (limited to 'web/html/modals')
| -rw-r--r-- | web/html/modals/dns_presets_modal.html | 110 | ||||
| -rw-r--r-- | web/html/modals/fakedns_modal.html | 57 | ||||
| -rw-r--r-- | web/html/modals/xray_dns_modal.html (renamed from web/html/modals/dns_modal.html) | 111 | ||||
| -rw-r--r-- | web/html/modals/xray_fakedns_modal.html | 56 |
4 files changed, 228 insertions, 106 deletions
diff --git a/web/html/modals/dns_presets_modal.html b/web/html/modals/dns_presets_modal.html new file mode 100644 index 00000000..010b973a --- /dev/null +++ b/web/html/modals/dns_presets_modal.html @@ -0,0 +1,110 @@ +{{define "modals/dnsPresetsModal"}} +<a-modal id="dnsPresets-modal" v-model="dnsPresetsModal.visible" :title="dnsPresetsModal.title" :closable="true" + :mask-closable="false" :footer="null" :class="themeSwitcher.currentTheme"> + <a-list class="ant-dns-presets-list" bordered :style="{ width: '100%' }"> + <a-list-item v-for="dns in dnsPresetsDatabase" :style="{ padding: '12px 16px' }"> + <a-row justify="space-between" align="middle"> + <a-col :span="12"> + <a-space direction="vertical" size="small"> + <span class="ant-dns-presets-list-name">[[ dns.name ]]</span> + <a-tag :color="dns.family ? 'purple' : 'green'">[[ dns.family ? '{{ i18n "pages.xray.dns.dnsPresetFamily" }}' : 'DNS' ]]</a-tag> + </a-space> + </a-col> + <a-col :span="12" :style="{ textAlign: 'right' }"> + <a-button type="primary" @click="dnsPresetsModal.install(dns.data)">{{ i18n "install" }}</a-button> + </a-col> + </a-row> + </a-list-item> + </a-list> +</a-modal> + +<style> + .dark .ant-dns-presets-list { + border-color: var(--dark-color-stroke) + } + + .dark .ant-dns-presets-list-name { + color: var(--dark-color-text-primary); + } +</style> + +<script> + const dnsPresetsDatabase = [ + { + name: 'Google DNS', + family: false, + data: [ + "8.8.8.8", + "8.8.4.4", + "2001:4860:4860::8888", + "2001:4860:4860::8844" + ] + }, + { + name: 'Cloudflare DNS', + family: false, + data: [ + "1.1.1.1", + "1.0.0.1", + "2606:4700:4700::1111", + "2606:4700:4700::1001" + ] + }, + { + name: 'Adguard DNS', + family: false, + data: [ + "94.140.14.14", + "94.140.15.15", + "2a10:50c0::ad1:ff", + "2a10:50c0::ad2:ff" + ] + }, + { + name: 'Adguard Family DNS', + family: true, + data: [ + "94.140.14.14", + "94.140.15.15", + "2a10:50c0::ad1:ff", + "2a10:50c0::ad2:ff" + ] + }, + { + name: 'Cloudflare Family DNS', + family: true, + data: [ + "1.1.1.3", + "1.0.0.3", + "2606:4700:4700::1113", + "2606:4700:4700::1003" + ] + } + ] + + const dnsPresetsModal = { + title: '', + visible: false, + selected: null, + install(selectedPreset) { + return ObjectUtil.execute(dnsPresetsModal.selected, selectedPreset); + }, + show({ title = '', selected = (selectedPreset) => { }, isEdit = false }) { + this.title = title; + this.selected = selected; + this.visible = true; + }, + close() { + dnsPresetsModal.visible = false; + }, + }; + + new Vue({ + delimiters: ['[[', ']]'], + el: '#dnsPresets-modal', + data: { + dnsPresetsModal: dnsPresetsModal, + } + }); +</script> +{{end}}
\ No newline at end of file diff --git a/web/html/modals/fakedns_modal.html b/web/html/modals/fakedns_modal.html deleted file mode 100644 index 8e554ac0..00000000 --- a/web/html/modals/fakedns_modal.html +++ /dev/null @@ -1,57 +0,0 @@ -{{define "modals/fakednsModal"}} -<a-modal id="fakedns-modal" v-model="fakednsModal.visible" :title="fakednsModal.title" @ok="fakednsModal.ok" - :closable="true" :mask-closable="false" - :ok-text="fakednsModal.okText" cancel-text='{{ i18n "close" }}' :class="themeSwitcher.currentTheme"> - <a-form :colon="false" :label-col="{ md: {span:8} }" :wrapper-col="{ md: {span:14} }"> - <a-form-item label='{{ i18n "pages.xray.fakedns.ipPool" }}'> - <a-input v-model.trim="fakednsModal.fakeDns.ipPool"></a-input> - </a-form-item> - <a-form-item label='{{ i18n "pages.xray.fakedns.poolSize" }}'> - <a-input-number v-model.number="fakednsModal.fakeDns.poolSize" :min="1"></a-input-number> - </a-form-item> - </a-form> -</a-modal> -<script> - const fakednsModal = { - title: '', - visible: false, - okText: '{{ i18n "confirm" }}', - isEdit: false, - confirm: null, - fakeDns: { - ipPool: "198.18.0.0/16", - poolSize: 65535, - }, - ok() { - ObjectUtil.execute(fakednsModal.confirm, fakednsModal.fakeDns); - }, - show({ title='', okText='{{ i18n "confirm" }}', fakeDns, confirm=(fakeDns)=>{}, isEdit=false }) { - this.title = title; - this.okText = okText; - this.confirm = confirm; - this.visible = true; - if(isEdit) { - this.fakeDns = fakeDns; - } else { - this.fakeDns = { - ipPool: "198.18.0.0/16", - poolSize: 65535, - } - } - this.isEdit = isEdit; - }, - close() { - fakednsModal.visible = false; - }, - }; - - new Vue({ - delimiters: ['[[', ']]'], - el: '#fakedns-modal', - data: { - fakednsModal: fakednsModal, - } - }); - -</script> -{{end}} diff --git a/web/html/modals/dns_modal.html b/web/html/modals/xray_dns_modal.html index e6266c06..484bd2f8 100644 --- a/web/html/modals/dns_modal.html +++ b/web/html/modals/xray_dns_modal.html @@ -6,6 +6,16 @@ <a-form-item label='{{ i18n "pages.xray.outbound.address" }}'> <a-input v-model.trim="dnsModal.dnsServer.address"></a-input> </a-form-item> + <a-form-item label='{{ i18n "pages.inbounds.port" }}'> + <a-input-number v-model.number="dnsModal.dnsServer.port" :min="1" :max="65531"></a-input-number> + </a-form-item> + <a-form-item label='{{ i18n "pages.xray.dns.strategy" }}'> + <a-select v-model="dnsModal.dnsServer.queryStrategy" :style="{ width: '100%' }" + :dropdown-class-name="themeSwitcher.currentTheme"> + <a-select-option :value="l" :label="l" v-for="l in ['UseSystem', 'UseIP', 'UseIPv4', 'UseIPv6']"> [[ l ]] </a-select-option> + </a-select> + </a-form-item> + <a-divider :style="{ margin: '5px 0' }"></a-divider> <a-form-item label='{{ i18n "pages.xray.dns.domains" }}'> <a-button icon="plus" size="small" type="primary" @click="dnsModal.dnsServer.domains.push('')"></a-button> <template v-for="(domain, index) in dnsModal.dnsServer.domains"> @@ -15,15 +25,6 @@ </a-input> </template> </a-form-item> - <a-form-item label='{{ i18n "pages.xray.dns.strategy" }}' v-if="isAdvanced"> - <a-select v-model="dnsModal.dnsServer.queryStrategy" :style="{ width: '100%' }" - :dropdown-class-name="themeSwitcher.currentTheme"> - <a-select-option :value="l" :label="l" v-for="l in ['UseIP', 'UseIPv4', 'UseIPv6']"> [[ l ]] </a-select-option> - </a-select> - </a-form-item> - <a-form-item label='Skip Fallback' v-if="isAdvanced"> - <a-switch v-model="dnsModal.dnsServer.skipFallback"></a-switch> - </a-form-item> <a-form-item label='{{ i18n "pages.xray.dns.expectIPs"}}'> <a-button icon="plus" size="small" type="primary" @click="dnsModal.dnsServer.expectIPs.push('')"></a-button> <template v-for="(domain, index) in dnsModal.dnsServer.expectIPs"> @@ -33,31 +34,50 @@ </a-input> </template> </a-form-item> + <a-form-item label='{{ i18n "pages.xray.dns.unexpectIPs"}}'> + <a-button icon="plus" size="small" type="primary" @click="dnsModal.dnsServer.unexpectedIPs.push('')"></a-button> + <template v-for="(domain, index) in dnsModal.dnsServer.unexpectedIPs"> + <a-input v-model.trim="dnsModal.dnsServer.unexpectedIPs[index]"> + <a-button icon="minus" size="small" slot="addonAfter" + @click="dnsModal.dnsServer.unexpectedIPs.splice(index,1)"></a-button> + </a-input> + </template> + </a-form-item> + <a-divider :style="{ margin: '5px 0' }"></a-divider> + <a-form-item label='Skip Fallback'> + <a-switch v-model="dnsModal.dnsServer.skipFallback"></a-switch> + </a-form-item> + <a-form-item label='Disable Cache'> + <a-switch v-model="dnsModal.dnsServer.disableCache"></a-switch> + </a-form-item> + <a-form-item label='Final Query'> + <a-switch v-model="dnsModal.dnsServer.finalQuery"></a-switch> + </a-form-item> </a-form> </a-modal> <script> + const defaultDnsObject = { + address: "localhost", + port: 53, + domains: [], + expectIPs: [], + unexpectedIPs: [], + queryStrategy: 'UseIP', + skipFallback: true, + disableCache: false, + finalQuery: false + } + const dnsModal = { title: '', visible: false, okText: '{{ i18n "confirm" }}', isEdit: false, confirm: null, - dnsServer: { - address: "localhost", - domains: [], - expectIPs: [], - queryStrategy: 'UseIP', - skipFallback: true, + dnsServer: { ...defaultDnsObject }, + ok() { + ObjectUtil.execute(dnsModal.confirm, { ...dnsModal.dnsServer }); }, - ok() { - domains = dnsModal.dnsServer.domains.filter(d => d.length > 0); - expectIPs = dnsModal.dnsServer.expectIPs.filter(ip => ip.length > 0); - dnsModal.dnsServer.domains = domains; - dnsModal.dnsServer.expectIPs = expectIPs; - newDnsServer = (domains.length > 0 || expectIPs.length > 0) ? dnsModal.dnsServer : dnsModal.dnsServer.address; - ObjectUtil.execute(dnsModal.confirm, newDnsServer); - }, - show({ title = '', okText = '{{ i18n "confirm" }}', @@ -69,28 +89,28 @@ this.okText = okText; this.confirm = confirm; this.visible = true; + this.isEdit = isEdit; + if (isEdit) { - if (typeof dnsServer == 'object') { - this.dnsServer = dnsServer; - } else { - this.dnsServer = { - address: dnsServer ?? "", - domains: [], - expectIPs: [], - queryStrategy: 'UseIP', - skipFallback: true, - } + switch (typeof dnsServer) { + case 'string': + const dnsObj = { ...defaultDnsObject }; + + dnsObj.address = dnsServer; + + this.dnsServer = dnsObj; + break; + case 'object': + this.dnsServer = dnsServer; + break; } } else { - this.dnsServer = { - address: "localhost", - domains: [], - expectIPs: [], - queryStrategy: 'UseIP', - skipFallback: true, - } + this.dnsServer = { ...defaultDnsObject }; + + this.dnsServer.domains = []; + this.dnsServer.expectIPs = []; + this.dnsServer.unexpectedIPs = []; } - this.isEdit = isEdit; }, close() { dnsModal.visible = false; @@ -101,13 +121,6 @@ el: '#dns-modal', data: { dnsModal: dnsModal, - }, - computed: { - isAdvanced: { - get: function () { - return dnsModal.dnsServer.domains.length > 0; - } - } } }); </script> diff --git a/web/html/modals/xray_fakedns_modal.html b/web/html/modals/xray_fakedns_modal.html new file mode 100644 index 00000000..f1f4429c --- /dev/null +++ b/web/html/modals/xray_fakedns_modal.html @@ -0,0 +1,56 @@ +{{define "modals/fakednsModal"}} +<a-modal id="fakedns-modal" v-model="fakednsModal.visible" :title="fakednsModal.title" @ok="fakednsModal.ok" + :closable="true" :mask-closable="false" :ok-text="fakednsModal.okText" cancel-text='{{ i18n "close" }}' + :class="themeSwitcher.currentTheme"> + <a-form :colon="false" :label-col="{ md: {span:8} }" :wrapper-col="{ md: {span:14} }"> + <a-form-item label='{{ i18n "pages.xray.fakedns.ipPool" }}'> + <a-input v-model.trim="fakednsModal.fakeDns.ipPool"></a-input> + </a-form-item> + <a-form-item label='{{ i18n "pages.xray.fakedns.poolSize" }}'> + <a-input-number v-model.number="fakednsModal.fakeDns.poolSize" :min="1"></a-input-number> + </a-form-item> + </a-form> +</a-modal> +<script> + const fakednsDefaultData = { + ipPool: "198.18.0.0/16", + poolSize: 65535, + } + + const fakednsModal = { + title: '', + visible: false, + okText: '{{ i18n "confirm" }}', + isEdit: false, + confirm: null, + fakeDns: { ...fakednsDefaultData }, + ok() { + ObjectUtil.execute(fakednsModal.confirm, fakednsModal.fakeDns); + }, + show({ title = '', okText = '{{ i18n "confirm" }}', fakeDns, confirm = (fakeDns) => { }, isEdit = false }) { + this.title = title; + this.okText = okText; + this.confirm = confirm; + this.visible = true; + if (isEdit) { + this.fakeDns = fakeDns; + } else { + this.fakeDns = { ...fakednsDefaultData } + } + this.isEdit = isEdit; + }, + close() { + fakednsModal.visible = false; + }, + }; + + new Vue({ + delimiters: ['[[', ']]'], + el: '#fakedns-modal', + data: { + fakednsModal: fakednsModal, + } + }); + +</script> +{{end}}
\ No newline at end of file |
