| 123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367368369370371372373374375376377378379380381382383384385386387388389390391392393394395396397398399400401402403404405406407408409410411412413414415416417418419420421422423424425426427428429430431432433434435436437438439440441442443444445446447448449450451452453454455456457458459460461462463464465466467468469470471472473474475476477478479480481482483484485486487488489490491492493494495496497498499500501502503504505506507508509510511512513514515516517518519520521522523524525526527528529530531532533534535536537538539540541542543544545546547548549550551552553554555556557558559560561562563564565566567568569570571572573574575576577578579580581582583584585586587588589590591592593594595596597598599600601602603604605606607608609610611612613614615616617618619620621622623624625626627628629630631632633634635636637638639640641642643644645646647648649650651652653654655656657658659660661662663664665666667668669670671672673674675676677678679680681682683684685686687688689690691692693694695696697698699700701702703704705706707708709710711712713714715716717718719720721722723724725726727728729730731732733734735736737738739740741742743744745746747748749750751752753754755756757758759760761762763764765766767768769770771772773774775776777778779780781782783784785786787788789790791792793794795796797798799800801802803804805806807808809810811812813814815816817818819820821822823824825826827828829830831832833834835836837838839840841842843844845846847848849850851852853854855856857858859860861862863864865866867868869870871872873874875876877878879880881882883884885886887888889890891892893894895896897898899900901902903904905906907908909910911912913914915916917918919920921922923924925926927928929930931932933934935936937938939940941942943944945946947948949950951952953954955956957958959960961962963964965966967968969970971972973974975976977978979980981982983984985986987988989990991992993994995996997998999100010011002100310041005100610071008100910101011101210131014101510161017101810191020102110221023102410251026102710281029103010311032103310341035103610371038103910401041104210431044104510461047104810491050105110521053105410551056105710581059106010611062106310641065106610671068106910701071107210731074107510761077107810791080108110821083108410851086108710881089109010911092109310941095109610971098109911001101110211031104110511061107110811091110111111121113111411151116111711181119112011211122112311241125112611271128112911301131113211331134113511361137113811391140114111421143114411451146114711481149115011511152115311541155115611571158115911601161116211631164116511661167116811691170117111721173117411751176117711781179118011811182118311841185118611871188118911901191119211931194119511961197119811991200120112021203120412051206120712081209121012111212121312141215121612171218121912201221122212231224122512261227122812291230123112321233123412351236123712381239124012411242124312441245124612471248124912501251125212531254125512561257125812591260126112621263126412651266126712681269127012711272127312741275127612771278127912801281128212831284128512861287128812891290129112921293129412951296129712981299130013011302130313041305130613071308130913101311131213131314131513161317131813191320132113221323132413251326132713281329133013311332133313341335133613371338133913401341134213431344134513461347134813491350135113521353135413551356135713581359136013611362136313641365136613671368136913701371137213731374137513761377137813791380138113821383138413851386138713881389139013911392139313941395139613971398139914001401140214031404140514061407140814091410141114121413141414151416141714181419142014211422142314241425142614271428142914301431143214331434143514361437143814391440144114421443144414451446144714481449145014511452145314541455145614571458145914601461146214631464146514661467146814691470147114721473147414751476147714781479148014811482148314841485148614871488148914901491149214931494149514961497149814991500150115021503150415051506150715081509151015111512151315141515151615171518151915201521152215231524152515261527152815291530153115321533153415351536153715381539154015411542154315441545154615471548154915501551155215531554155515561557155815591560156115621563156415651566156715681569157015711572157315741575157615771578157915801581158215831584158515861587158815891590159115921593159415951596159715981599160016011602160316041605160616071608160916101611161216131614161516161617161816191620162116221623162416251626162716281629163016311632163316341635163616371638163916401641164216431644164516461647164816491650165116521653165416551656165716581659166016611662166316641665166616671668166916701671167216731674167516761677167816791680168116821683168416851686168716881689169016911692169316941695169616971698169917001701170217031704170517061707170817091710171117121713171417151716171717181719172017211722172317241725172617271728172917301731173217331734173517361737173817391740174117421743174417451746174717481749175017511752175317541755175617571758175917601761176217631764176517661767176817691770177117721773177417751776177717781779178017811782178317841785178617871788178917901791179217931794179517961797179817991800180118021803180418051806180718081809181018111812181318141815181618171818181918201821182218231824182518261827182818291830183118321833183418351836183718381839184018411842184318441845184618471848184918501851185218531854185518561857185818591860186118621863186418651866186718681869187018711872187318741875187618771878187918801881188218831884188518861887188818891890189118921893189418951896189718981899190019011902190319041905190619071908190919101911191219131914191519161917191819191920192119221923192419251926192719281929193019311932193319341935193619371938193919401941194219431944194519461947194819491950195119521953195419551956195719581959196019611962196319641965196619671968196919701971197219731974197519761977197819791980198119821983198419851986198719881989199019911992199319941995199619971998199920002001200220032004200520062007200820092010201120122013201420152016201720182019202020212022202320242025202620272028202920302031203220332034203520362037203820392040204120422043204420452046204720482049205020512052205320542055205620572058205920602061206220632064206520662067206820692070207120722073207420752076207720782079208020812082208320842085208620872088208920902091209220932094209520962097209820992100210121022103210421052106210721082109211021112112211321142115211621172118211921202121212221232124212521262127212821292130213121322133213421352136213721382139214021412142214321442145214621472148214921502151215221532154215521562157215821592160216121622163216421652166216721682169217021712172217321742175217621772178217921802181218221832184218521862187218821892190219121922193219421952196219721982199220022012202220322042205220622072208220922102211221222132214221522162217221822192220222122222223222422252226222722282229223022312232223322342235223622372238223922402241224222432244224522462247224822492250225122522253225422552256225722582259226022612262226322642265226622672268226922702271227222732274227522762277227822792280228122822283228422852286228722882289229022912292 | <!DOCTYPE html><html lang="en">{{template "head" .}}<link rel="stylesheet" href="{{ .base_path }}assets/codemirror/codemirror.min.css?{{ .cur_ver }}"><link rel="stylesheet" href="{{ .base_path }}assets/codemirror/fold/foldgutter.css"><link rel="stylesheet" href="{{ .base_path }}assets/codemirror/xq.min.css?{{ .cur_ver }}"><link rel="stylesheet" href="{{ .base_path }}assets/codemirror/lint/lint.css"><script src="{{ .base_path }}assets/base64/base64.min.js"></script><script src="{{ .base_path }}assets/js/model/outbound.js?{{ .cur_ver }}"></script><script src="{{ .base_path }}assets/codemirror/codemirror.min.js?{{ .cur_ver }}"></script><script src="{{ .base_path }}assets/codemirror/javascript.js"></script><script src="{{ .base_path }}assets/codemirror/jshint.js"></script><script src="{{ .base_path }}assets/codemirror/jsonlint.js"></script><script src="{{ .base_path }}assets/codemirror/lint/lint.js"></script><script src="{{ .base_path }}assets/codemirror/lint/javascript-lint.js"></script><script src="{{ .base_path }}assets/codemirror/hint/javascript-hint.js"></script><script src="{{ .base_path }}assets/codemirror/fold/foldcode.js"></script><script src="{{ .base_path }}assets/codemirror/fold/foldgutter.js"></script><script src="{{ .base_path }}assets/codemirror/fold/brace-fold.js"></script><style>  @media (min-width: 769px) {    .ant-layout-content {      margin: 24px 16px;    }  }  @media (max-width: 768px) {    .ant-tabs-nav .ant-tabs-tab {      margin: 0;      padding: 12px .5rem;    }    .ant-table-thead>tr>th,    .ant-table-tbody>tr>td {      padding: 10px 0px;    }  }  .ant-tabs-bar {    margin: 0;  }  .ant-list-item {    display: block;  }  .collapse-title {    color: inherit;    font-weight: bold;    font-size: 18px;    padding: 10px 20px;    border-bottom: 2px solid;  }  .collapse-title>i {    color: inherit;    font-size: 24px;  }  .ant-collapse-content-box>li {    padding: 12px 0 0 0 !important;  }  .ant-list-item>li {    padding: 10px 20px !important;  }</style><body>  <a-layout id="app" v-cloak :class="themeSwitcher.currentTheme">    {{ template "commonSider" . }}    <a-layout id="content-layout">      <a-layout-content>        <a-spin :spinning="spinning" :delay="500" tip='{{ i18n "loading"}}'>          <transition name="list" appear>            <a-alert type="error" v-if="showAlert" style="margin-bottom: 10px"              message='{{ i18n "secAlertTitle" }}'              color="red"              description='{{ i18n "secAlertSsl" }}'              show-icon closable>            </a-alert>          </transition>          <a-space direction="vertical">            <a-card hoverable style="margin-bottom: .5rem;">              <a-row style="display: flex; flex-wrap: wrap; align-items: center;">                <a-col :xs="24" :sm="10" style="padding: 4px;">                  <a-space direction="horizontal">                    <a-button type="primary" :disabled="saveBtnDisable" @click="updateXraySetting">{{ i18n "pages.xray.save" }}</a-button>                    <a-button type="danger" :disabled="!saveBtnDisable" @click="restartXray">{{ i18n "pages.xray.restart" }}</a-button>                    <a-popover v-if="restartResult"                        :overlay-class-name="themeSwitcher.currentTheme">                      <span slot="title" style="font-size: 12pt">Error in running xray-core</span>                      <template slot="content">                        <p style="max-width: 400px" v-for="line in restartResult.split('\n')">[[ line ]]</p>                      </template>                      <a-icon type="question-circle"></a-icon>                    </a-popover>                  </a-space>                </a-col>                <a-col :xs="24" :sm="14">                  <template>                    <div>                      <a-back-top :target="() => document.getElementById('content-layout')" visibility-height="200"></a-back-top>                      <a-alert type="warning" style="float: right; width: fit-content" message='{{ i18n "pages.settings.infoDesc" }}' show-icon>                      </a-alert>                    </div>                  </template>                </a-col>              </a-row>            </a-card>            <a-tabs class="ant-card-dark-box-nohover" default-active-key="1"                @change="(activeKey) => { this.changePage(activeKey); }"                :class="themeSwitcher.currentTheme">              <a-tab-pane key="tpl-basic" tab='{{ i18n "pages.xray.basicTemplate"}}' style="padding-top: 20px;">                <a-collapse>                  <a-collapse-panel header='{{ i18n "pages.xray.generalConfigs"}}'>                    <a-row :xs="24" :sm="24" :lg="12">                      <a-alert type="warning" style="text-align: center;">                        <template slot="message">                          <a-icon type="exclamation-circle" theme="filled" style="color: #FFA031"></a-icon>                          {{ i18n "pages.xray.generalConfigsDesc" }}                        </template>                      </a-alert>                    </a-row>                    <a-list-item>                      <a-row style="padding: 10px 20px">                        <a-col :lg="24" :xl="12">                          <a-list-item-meta title='{{ i18n "pages.xray.FreedomStrategy" }}'                            description='{{ i18n "pages.xray.FreedomStrategyDesc" }}'>                          </a-list-item-meta>                        </a-col>                        <a-col :lg="24" :xl="12">                          <template>                            <a-select v-model="freedomStrategy" :dropdown-class-name="themeSwitcher.currentTheme"                                style="width: 100%">                              <a-select-option v-for="s in OutboundDomainStrategies" :value="s">[[ s ]]</a-select-option>                            </a-select>                          </template>                        </a-col>                      </a-row>                      <a-row style="padding: 10px 20px">                        <a-col :lg="24" :xl="12">                          <a-list-item-meta title='{{ i18n "pages.xray.RoutingStrategy" }}'                            description='{{ i18n "pages.xray.RoutingStrategyDesc" }}'>                          </a-list-item-meta>                        </a-col>                        <a-col :lg="24" :xl="12">                          <a-select v-model="routingStrategy" :dropdown-class-name="themeSwitcher.currentTheme"                              style="width: 100%">                            <a-select-option v-for="s in routingDomainStrategies" :value="s">[[ s ]]</a-select-option>                          </a-select>                        </a-col>                      </a-row>                    </a-list-item>                  </a-collapse-panel>                  <a-collapse-panel header='{{ i18n "pages.xray.logConfigs" }}'>                    <a-row :xs="24" :sm="24" :lg="12">                      <a-alert type="warning" style="text-align: center;">                        <template slot="message">                          <a-icon type="exclamation-circle" theme="filled" style="color: #FFA031"></a-icon>                          {{ i18n "pages.xray.logConfigsDesc" }}                        </template>                      </a-alert>                    </a-row>                    <a-list-item>                      <a-row style="padding: 10px 20px">                        <a-col :lg="24" :xl="12">                          <a-list-item-meta title='{{ i18n "pages.xray.logLevel" }}'                            description='{{ i18n "pages.xray.logLevelDesc" }}'>                          </a-list-item-meta>                        </a-col>                        <a-col :lg="24" :xl="12">                          <template>                            <a-select v-model="logLevel" :dropdown-class-name="themeSwitcher.currentTheme" style="width: 100%">                                <a-select-option v-for="s in log.loglevel" :value="s">[[ s ]]</a-select-option>                            </a-select>                          </template>                        </a-col>                      </a-row>                      <a-row style="padding: 10px 20px">                        <a-col :lg="24" :xl="12">                          <a-list-item-meta title='{{ i18n "pages.xray.accessLog" }}'                            description='{{ i18n "pages.xray.accessLogDesc" }}'>                          </a-list-item-meta>                        </a-col>                        <a-col :lg="24" :xl="12">                          <template>                            <a-select v-model="accessLog" :dropdown-class-name="themeSwitcher.currentTheme" style="width: 100%">                                <a-select-option value=''>Empty</a-select-option>                                <a-select-option v-for="s in log.access" :value="s">[[ s ]]</a-select-option>                            </a-select>                          </template>                        </a-col>                      </a-row>                      <a-row style="padding: 10px 20px">                        <a-col :lg="24" :xl="12">                          <a-list-item-meta title='{{ i18n "pages.xray.errorLog" }}'                            description='{{ i18n "pages.xray.errorLogDesc" }}'>                          </a-list-item-meta>                        </a-col>                        <a-col :lg="24" :xl="12">                          <template>                            <a-select v-model="errorLog" :dropdown-class-name="themeSwitcher.currentTheme" style="width: 100%">                                <a-select-option value=''>Empty</a-select-option>                                <a-select-option v-for="s in log.error" :value="s">[[ s ]]</a-select-option>                            </a-select>                          </template>                        </a-col>                      </a-row>                      <a-row style="padding: 10px 20px">                        <a-col :lg="24" :xl="12">                          <a-list-item-meta title='{{ i18n "pages.xray.maskAddress" }}'                            description='{{ i18n "pages.xray.maskAddressDesc" }}'>                          </a-list-item-meta>                        </a-col>                        <a-col :lg="24" :xl="12">                          <template>                            <a-select v-model="maskAddressLog" :dropdown-class-name="themeSwitcher.currentTheme" style="width: 100%">                                <a-select-option value=''>Empty</a-select-option>                                <a-select-option v-for="s in log.maskAddress" :value="s">[[ s ]]</a-select-option>                            </a-select>                          </template>                        </a-col>                      </a-row>                      <setting-list-item type="switch" title='{{ i18n "pages.xray.dnsLog"}}' desc='{{ i18n "pages.xray.dnsLogDesc"}}' v-model="dnslog"></setting-list-item>                    </a-list-item>                  </a-collapse-panel>                  <a-collapse-panel header='{{ i18n "pages.xray.blockConfigs"}}'>                    <a-row :xs="24" :sm="24" :lg="12">                      <a-alert type="warning" style="text-align: center;">                        <template slot="message">                          <a-icon type="exclamation-circle" theme="filled" style="color: #FFA031"></a-icon>                          {{ i18n "pages.xray.blockConfigsDesc" }}                        </template>                      </a-alert>                    </a-row>                    <a-list-item>                      <setting-list-item type="switch" title='{{ i18n "pages.xray.Torrent"}}' desc='{{ i18n "pages.xray.TorrentDesc"}}' v-model="torrentSettings"></setting-list-item>                      <setting-list-item type="switch" title='{{ i18n "pages.xray.PrivateIp"}}' desc='{{ i18n "pages.xray.PrivateIpDesc"}}' v-model="privateIpSettings"></setting-list-item>                      <setting-list-item type="switch" title='{{ i18n "pages.xray.Ads"}}' desc='{{ i18n "pages.xray.AdsDesc"}}' v-model="AdsSettings"></setting-list-item>                      <setting-list-item type="switch" title='{{ i18n "pages.xray.Family"}}' desc='{{ i18n "pages.xray.FamilyDesc"}}' v-model="familyProtectSettings"></setting-list-item>                      <setting-list-item type="switch" title='{{ i18n "pages.xray.Security"}}' desc='{{ i18n "pages.xray.SecurityDesc"}}' v-model="SecuritySettings"></setting-list-item>                      <setting-list-item type="switch" title='{{ i18n "pages.xray.Speedtest"}}' desc='{{ i18n "pages.xray.SpeedtestDesc"}}' v-model="SpeedTestSettings"></setting-list-item>                    </a-list-item>                  </a-collapse-panel>                  <a-collapse-panel header='{{ i18n "pages.xray.blockConnectionsConfigs"}}'>                    <a-row :xs="24" :sm="24" :lg="12">                      <a-alert type="warning" style="text-align: center;">                        <template slot="message">                          <a-icon type="exclamation-circle" theme="filled" style="color: #FFA031"></a-icon>                          {{ i18n "pages.xray.blockConnectionsConfigsDesc" }}                        </template>                      </a-alert>                    </a-row>                    <a-list-item>                        <a-collapse>                            <a-collapse-panel header='{{ i18n "pages.xray.blockips"}}'>                                <setting-list-item type="switch" title='🇮🇷 Iran'                                    v-model="IRIpSettings"></setting-list-item>                                <setting-list-item type="switch" title='🇨🇳 China'                                    v-model="ChinaIpSettings"></setting-list-item>                                <setting-list-item type="switch" title='🇷🇺 Russia'                                    v-model="RussiaIpSettings"></setting-list-item>                                <setting-list-item type="switch" title='🇻🇳 Vietnam'                                    v-model="VNIpSettings"></setting-list-item>                            </a-collapse-panel>                        </a-collapse>                        <br>                        <a-collapse>                            <a-collapse-panel header='{{ i18n "pages.xray.blockdomains"}}'>                                <setting-list-item type="switch" title='🇮🇷 Iran'                                    v-model="IRDomainSettings"></setting-list-item>                                <setting-list-item type="switch" title='🇨🇳 China'                                    v-model="ChinaDomainSettings"></setting-list-item>                                <setting-list-item type="switch" title='🇷🇺 Russia'                                    v-model="RussiaDomainSettings"></setting-list-item>                                <setting-list-item type="switch" title='🇻🇳 Vietnam'                                    v-model="VNDomainSettings"></setting-list-item>                            </a-collapse-panel>                        </a-collapse>                    </a-list-item>                  </a-collapse-panel>                  <a-collapse-panel header='{{ i18n "pages.xray.directConnectionsConfigs"}}'>                    <a-row :xs="24" :sm="24" :lg="12">                      <a-alert type="warning" style="text-align: center;">                        <template slot="message">                          <a-icon type="exclamation-circle" theme="filled" style="color: #FFA031"></a-icon>                          {{ i18n "pages.xray.directConnectionsConfigsDesc" }}                        </template>                      </a-alert>                    </a-row>                    <a-list-item>                        <a-collapse>                            <a-collapse-panel header='{{ i18n "pages.xray.directips"}}'>                                <setting-list-item type="switch" title='🇮🇷 Iran'                                    v-model="IRIpDirectSettings"></setting-list-item>                                <setting-list-item type="switch" title='🇨🇳 China'                                    v-model="ChinaIpDirectSettings"></setting-list-item>                                <setting-list-item type="switch" title='🇷🇺 Russia'                                    v-model="RussiaIpDirectSettings"></setting-list-item>                                <setting-list-item type="switch" title='🇻🇳 Vietnam'                                    v-model="VNIpDirectSettings"></setting-list-item>                            </a-collapse-panel>                        </a-collapse>                        <br>                        <a-collapse>                            <a-collapse-panel header='{{ i18n "pages.xray.directdomains"}}'>                                <setting-list-item type="switch" title='🇮🇷 Iran'                                    v-model="IRDomainDirectSettings"></setting-list-item>                                <setting-list-item type="switch" title='🇨🇳 China'                                    v-model="ChinaDomainDirectSettings"></setting-list-item>                                <setting-list-item type="switch" title='🇷🇺 Russia'                                    v-model="RussiaDomainDirectSettings"></setting-list-item>                                <setting-list-item type="switch" title='🇻🇳 Vietnam'                                    v-model="VNDomainDirectSettings"></setting-list-item>                            </a-collapse-panel>                        </a-collapse>                    </a-list-item>                  </a-collapse-panel>                  <a-collapse-panel header='{{ i18n "pages.xray.ipv4Configs"}}'>                    <a-row :xs="24" :sm="24" :lg="12">                      <a-alert type="warning" style="text-align: center;">                        <template slot="message">                          <a-icon type="exclamation-circle" theme="filled" style="color: #FFA031"></a-icon>                          {{ i18n "pages.xray.ipv4ConfigsDesc" }}                        </template>                      </a-alert>                    </a-row>                    <a-list-item>                      <setting-list-item type="switch" title='{{ i18n "pages.xray.GoogleIPv4"}}' desc='{{ i18n "pages.xray.GoogleIPv4Desc"}}' v-model="GoogleIPv4Settings"></setting-list-item>                      <setting-list-item type="switch" title='{{ i18n "pages.xray.NetflixIPv4"}}' desc='{{ i18n "pages.xray.NetflixIPv4Desc"}}' v-model="NetflixIPv4Settings"></setting-list-item>                    </a-list-item>                  </a-collapse-panel>                  <a-collapse-panel header='{{ i18n "pages.xray.warpConfigs"}}'>                    <a-row :xs="24" :sm="24" :lg="12">                      <a-alert type="warning" style="text-align: center;">                        <template slot="message">                          <a-icon type="exclamation-circle" theme="filled" style="color: #FFA031"></a-icon>                          {{ i18n "pages.xray.warpConfigsDesc" }}                        </template>                      </a-alert>                    </a-row>                    <a-list-item>                      <template v-if="WarpExist">                        <setting-list-item type="switch" title='{{ i18n "pages.xray.GoogleWARP"}}' desc='{{ i18n "pages.xray.GoogleWARPDesc"}}' v-model="GoogleWARPSettings"></setting-list-item>                        <setting-list-item type="switch" title='{{ i18n "pages.xray.OpenAIWARP"}}' desc='{{ i18n "pages.xray.OpenAIWARPDesc"}}' v-model="OpenAIWARPSettings"></setting-list-item>                        <setting-list-item type="switch" title='{{ i18n "pages.xray.NetflixWARP"}}' desc='{{ i18n "pages.xray.NetflixWARPDesc"}}' v-model="NetflixWARPSettings"></setting-list-item>                        <setting-list-item type="switch" title='{{ i18n "pages.xray.SpotifyWARP"}}' desc='{{ i18n "pages.xray.SpotifyWARPDesc"}}' v-model="SpotifyWARPSettings"></setting-list-item>                        <setting-list-item type="switch" title='{{ i18n "pages.xray.MetaWARP"}}' desc='{{ i18n "pages.xray.MetaWARPDesc"}}' v-model="MetaWARPSettings"></setting-list-item>                        <setting-list-item type="switch" title='{{ i18n "pages.xray.AppleWARP"}}' desc='{{ i18n "pages.xray.AppleWARPDesc"}}' v-model="AppleWARPSettings"></setting-list-item>                        <setting-list-item type="switch" title='{{ i18n "pages.xray.RedditWARP"}}' desc='{{ i18n "pages.xray.RedditWARPDesc"}}' v-model="RedditWARPSettings"></setting-list-item>                      </template>                      <a-button style="margin-left: 20px;" v-else type="primary" icon="cloud" @click="showWarp()">WARP</a-button>                    </a-list-item>                  </a-collapse-panel>                  <a-collapse-panel header='{{ i18n "pages.settings.resetDefaultConfig"}}'>                    <a-space direction="horizontal" style="padding: 0 20px">                      <a-button type="danger" @click="resetXrayConfigToDefault">{{ i18n "pages.settings.resetDefaultConfig" }}</a-button>                    </a-space>                  </a-collapse-panel>                </a-collapse>              </a-tab-pane>              <a-tab-pane key="tpl-routing" tab='{{ i18n "pages.xray.Routings"}}' style="padding-top: 20px;">                <a-button type="primary" icon="plus" @click="addRule">{{ i18n "pages.xray.rules.add" }}</a-button>                <a-table-sortable :columns="isMobile ? rulesMobileColumns : rulesColumns" bordered                    :row-key="r => r.key"                    :data-source="routingRuleData"                    :scroll="isMobile ? {} : { x: 1000 }"                    :pagination="false"                    :indent-size="0"                     :style="isMobile ? 'padding: 5px 0' : 'margin-top: 10px;'"                    v-on:onSort="replaceRule">                  <template slot="action" slot-scope="text, rule, index">                    <table-sort-trigger :item-index="index"></table-sort-trigger>                    <span class="ant-table-row-index"> [[ index+1 ]] </span>                    <a-dropdown :trigger="['click']">                      <a-icon @click="e => e.preventDefault()" type="more" style="font-size: 16px; text-decoration: bold;"></a-icon>                      <a-menu slot="overlay" :theme="themeSwitcher.currentTheme">                        <a-menu-item v-if="index>0" @click="replaceRule(index,0)">                          <a-icon type="vertical-align-top"></a-icon>                          {{ i18n "pages.xray.rules.first"}}                        </a-menu-item>                        <a-menu-item v-if="index>0" @click="replaceRule(index,index-1)">                          <a-icon type="arrow-up"></a-icon>                          {{ i18n "pages.xray.rules.up"}}                        </a-menu-item>                        <a-menu-item v-if="index<routingRuleData.length-1" @click="replaceRule(index,index+1)">                          <a-icon type="arrow-down"></a-icon>                          {{ i18n "pages.xray.rules.down"}}                        </a-menu-item>                        <a-menu-item v-if="index<routingRuleData.length-1" @click="replaceRule(index,routingRuleData.length-1)">                          <a-icon type="vertical-align-bottom"></a-icon>                          {{ i18n "pages.xray.rules.last"}}                        </a-menu-item>                        <a-menu-item @click="editRule(index)">                          <a-icon type="edit"></a-icon>                          {{ i18n "edit" }}                        </a-menu-item>                        <a-menu-item @click="deleteRule(index)">                          <span style="color: #FF4D4F">                            <a-icon type="delete"></a-icon> {{ i18n "delete"}}                          </span>                        </a-menu-item>                      </a-menu>                    </a-dropdown>                  </template>                  <template slot="inbound" slot-scope="text, rule, index">                    <a-popover :overlay-class-name="themeSwitcher.currentTheme">                      <template slot="content">                        <p v-if="rule.inboundTag">Inbound Tag: [[ rule.inboundTag ]]</p>                        <p v-if="rule.user">User email: [[ rule.user ]]</p>                      </template>                      [[ [rule.inboundTag,rule.user].join('\n') ]]                    </a-popover>                  </template>                  <template slot="outbound" slot-scope="text, rule, index">                    <a-popover :overlay-class-name="themeSwitcher.currentTheme">                      <template slot="content">                        <p v-if="rule.outboundTag">Outbound Tag: [[ rule.outboundTag ]]</p>                      </template>                      [[ rule.outboundTag ]]                    </a-popover>                  </template>                  <template slot="balancer" slot-scope="text, rule, index">                    <a-popover :overlay-class-name="themeSwitcher.currentTheme">                      <template slot="content">                        <p v-if="rule.balancerTag">Balancer Tag: [[ rule.balancerTag ]]</p>                      </template>                      [[ rule.balancerTag ]]                    </a-popover>                  </template>                  <template slot="info" slot-scope="text, rule, index">                    <a-popover placement="bottomRight"                        v-if="(rule.source+rule.sourcePort+rule.network+rule.protocol+rule.attrs+rule.ip+rule.domain+rule.port).length>0"                        :overlay-class-name="themeSwitcher.currentTheme" trigger="click">                      <template slot="content">                        <table cellpadding="2" style="max-width: 300px;">                          <tr v-if="rule.source">                            <td>Source</td>                            <td><a-tag color="blue" v-for="r in rule.source.split(',')">[[ r ]]</a-tag></td>                          </tr>                          <tr v-if="rule.sourcePort">                            <td>Source Port</td>                            <td><a-tag color="green" v-for="r in rule.sourcePort.split(',')">[[ r ]]</a-tag></td>                          </tr>                          <tr v-if="rule.network">                            <td>Network</td>                            <td><a-tag color="blue" v-for="r in rule.network.split(',')">[[ r ]]</a-tag></td>                          </tr>                          <tr v-if="rule.protocol">                            <td>Protocol</td>                            <td><a-tag color="green" v-for="r in rule.protocol.split(',')">[[ r ]]</a-tag></td>                          </tr>                          <tr v-if="rule.attrs">                            <td>Attrs</td>                            <td><a-tag color="blue" v-for="r in rule.attrs.split(',')">[[ r ]]</a-tag></td>                          </tr>                          <tr v-if="rule.ip">                            <td>IP</td>                            <td><a-tag color="green" v-for="r in rule.ip.split(',')">[[ r ]]</a-tag></td>                          </tr>                          <tr v-if="rule.domain">                            <td>Domain</td>                            <td><a-tag color="blue" v-for="r in rule.domain.split(',')">[[ r ]]</a-tag></td>                          </tr>                          <tr v-if="rule.port">                            <td>Port</td>                            <td><a-tag color="green" v-for="r in rule.port.split(',')">[[ r ]]</a-tag></td>                          </tr>                          <tr v-if="rule.balancerTag">                            <td>Balancer Tag</td>                            <td><a-tag color="blue">[[ rule.balancerTag ]]</a-tag></td>                          </tr>                        </table>                      </template>                      <a-button shape="round" size="small" style="font-size: 14px; padding: 0 10px;">                        <a-icon type="info"></a-icon>                      </a-button>                    </a-popover>                  </template>                </a-table-sortable>              </a-tab-pane>              <a-tab-pane key="tpl-outbound" tab='{{ i18n "pages.xray.Outbounds"}}' style="padding-top: 20px;" force-render="true">                <a-row>                  <a-col :xs="12" :sm="12" :lg="12">                    <a-button type="primary" icon="plus" @click="addOutbound()" style="margin-bottom: 10px;">                      {{ i18n "pages.xray.outbound.addOutbound" }}                    </a-button>                    <a-button type="primary" icon="cloud" @click="showWarp()" style="margin-bottom: 10px;">WARP</a-button>                  </a-col>                  <a-col :xs="12" :sm="12" :lg="12" style="text-align: right;">                    <a-icon type="sync" :spin="refreshing" @click="refreshOutboundTraffic()" style="margin: 0 5px;"></a-icon>                    <a-popconfirm placement="topRight" @confirm="resetOutboundTraffic(-1)"                        title='{{ i18n "pages.inbounds.resetTrafficContent"}}'                        :overlay-class-name="themeSwitcher.currentTheme"                        ok-text='{{ i18n "reset"}}'                        cancel-text='{{ i18n "cancel"}}'>                      <a-icon slot="icon" type="question-circle-o" :style="themeSwitcher.isDarkTheme ? 'color: #008771' : 'color: #008771'"></a-icon>                      <a-icon type="retweet" style="cursor: pointer;"></a-icon>                    </a-popconfirm>                  </a-col>                </a-row>                <a-table :columns="outboundColumns" bordered                    :row-key="r => r.key"                    :data-source="outboundData"                    :scroll="isMobile ? {} : { x: 800 }"                    :pagination="false"                    :indent-size="0"                    :style="isMobile ? 'padding: 5px 5px' : 'margin-right: 1px;'">                  <template slot="action" slot-scope="text, outbound, index">                    [[ index+1 ]]                    <a-dropdown :trigger="['click']">                      <a-icon @click="e => e.preventDefault()" type="more" style="font-size: 16px; text-decoration: bold;"></a-icon>                      <a-menu slot="overlay" :theme="themeSwitcher.currentTheme">                        <a-menu-item v-if="index>0" @click="setFirstOutbound(index)">                          <a-icon type="vertical-align-top"></a-icon>                          {{ i18n "pages.xray.rules.first"}}                        </a-menu-item>                        <a-menu-item @click="editOutbound(index)">                          <a-icon type="edit"></a-icon>                          {{ i18n "edit" }}                        </a-menu-item>                        <a-menu-item @click="resetOutboundTraffic(index)">                          <span>                            <a-icon type="retweet"></a-icon> {{ i18n "pages.inbounds.resetTraffic"}}                          </span>                        </a-menu-item>                        <a-menu-item @click="deleteOutbound(index)">                          <span style="color: #FF4D4F">                            <a-icon type="delete"></a-icon> {{ i18n "delete"}}                          </span>                        </a-menu-item>                      </a-menu>                    </a-dropdown>                  </template>                  <template slot="address" slot-scope="text, outbound, index">                    <p style="margin: 0 5px;" v-for="addr in findOutboundAddress(outbound)">[[ addr ]]</p>                  </template>                  <template slot="protocol" slot-scope="text, outbound, index">                    <a-tag style="margin:0;" color="purple">[[ outbound.protocol ]]</a-tag>                    <template v-if="[Protocols.VMess, Protocols.VLESS, Protocols.Trojan, Protocols.Shadowsocks].includes(outbound.protocol)">                      <a-tag style="margin:0;" color="blue">[[ outbound.streamSettings.network ]]</a-tag>                      <a-tag style="margin:0;" v-if="outbound.streamSettings.security=='tls'" color="green">tls</a-tag>                      <a-tag style="margin:0;" v-if="outbound.streamSettings.security=='reality'" color="green">reality</a-tag>                    </template>                  </template>                  <template slot="traffic" slot-scope="text, outbound, index">                    <a-tag color="green">[[ findOutboundTraffic(outbound) ]]</a-tag>                  </template>                </a-table>              </a-tab-pane>              <a-tab-pane key="tpl-reverse" tab='{{ i18n "pages.xray.outbound.reverse"}}' style="padding-top: 20px;" force-render="true">                <a-button type="primary" icon="plus" @click="addReverse()" style="margin-bottom: 10px;">                  {{ i18n "pages.xray.outbound.addReverse" }}                </a-button>                <a-table :columns="reverseColumns" bordered v-if="reverseData.length>0"                    :row-key="r => r.key"                    :data-source="reverseData"                    :scroll="isMobile ? {} : { x: 200 }"                    :pagination="false"                    :indent-size="0"                    :style="isMobile ? 'padding: 5px 0' : 'margin-left: 1px;'">                  <template slot="action" slot-scope="text, reverse, index">                    [[ index+1 ]]                    <a-dropdown :trigger="['click']">                      <a-icon @click="e => e.preventDefault()" type="more" style="font-size: 16px; text-decoration: bold;"></a-icon>                      <a-menu slot="overlay" :theme="themeSwitcher.currentTheme">                        <a-menu-item @click="editReverse(index)">                          <a-icon type="edit"></a-icon>                          {{ i18n "edit" }}                        </a-menu-item>                        <a-menu-item @click="deleteReverse(index)">                          <span style="color: #FF4D4F">                            <a-icon type="delete"></a-icon> {{ i18n "delete"}}                          </span>                        </a-menu-item>                      </a-menu>                    </a-dropdown>                  </template>                </a-table>              </a-tab-pane>              <a-tab-pane key="tpl-balancer" tab='{{ i18n "pages.xray.Balancers"}}' style="padding-top: 20px;" force-render="true">                <a-button type="primary" icon="plus" @click="addBalancer()" style="margin-bottom: 10px;">                  {{ i18n "pages.xray.balancer.addBalancer"}}                </a-button>                <a-table :columns="balancerColumns" bordered v-if="balancersData.length>0"                    :row-key="r => r.key"                    :data-source="balancersData"                    :scroll="isMobile ? {} : { x: 200 }"                    :pagination="false"                    :indent-size="0"                    :style="isMobile ? 'padding: 5px 0' : 'margin-left: 1px;'">                  <template slot="action" slot-scope="text, balancer, index">                    [[ index+1 ]]                    <a-dropdown :trigger="['click']">                      <a-icon @click="e => e.preventDefault()" type="more" style="font-size: 16px; text-decoration: bold;"></a-icon>                      <a-menu slot="overlay" :theme="themeSwitcher.currentTheme">                        <a-menu-item @click="editBalancer(index)">                          <a-icon type="edit"></a-icon>                          {{ i18n "edit" }}                        </a-menu-item>                        <a-menu-item @click="deleteBalancer(index)">                          <span style="color: #FF4D4F">                            <a-icon type="delete"></a-icon> {{ i18n "delete"}}                          </span>                        </a-menu-item>                      </a-menu>                    </a-dropdown>                  </template>                  <template slot="strategy" slot-scope="text, balancer, index">                    <a-tag style="margin:0;" v-if="balancer.strategy=='random'" color="purple">Random</a-tag>                    <a-tag style="margin:0;" v-if="balancer.strategy=='roundRobin'" color="green">Round Robin</a-tag>                    <a-tag style="margin:0;" v-if="balancer.strategy=='leastLoad'" color="green">Least Load</a-tag>                    <a-tag style="margin:0;" v-if="balancer.strategy=='leastPing'" color="green">Least Ping</a-tag>                  </template>                  <template slot="selector" slot-scope="text, balancer, index">                    <a-tag class="info-large-tag" style="margin:1;" v-for="sel in balancer.selector">[[ sel ]]</a-tag>                  </template>                </a-table>                <a-radio-group                    v-if="observatoryEnable || burstObservatoryEnable"                    v-model="obsSettings"                    @change="changeObsCode"                    button-style="solid"                    style="margin: 10px 0;"                    :size="isMobile ? 'small' : ''">                  <a-radio-button value="observatory" v-if="observatoryEnable">Observatory</a-radio-button>                  <a-radio-button value="burstObservatory" v-if="burstObservatoryEnable">Burst Observatory</a-radio-button>                </a-radio-group>                <textarea style="position:absolute; left: -800px;" id="obsSetting"></textarea>              </a-tab-pane>            <a-tab-pane key="tpl-dns" tab='DNS' style="padding-top: 20px;" force-render="true">                <setting-list-item type="switch" title='{{ i18n "pages.xray.dns.enable" }}'                    desc='{{ i18n "pages.xray.dns.enableDesc" }}' v-model="enableDNS"></setting-list-item>                <template v-if="enableDNS">                    <setting-list-item style="padding: 10px 20px" type="text" title='{{ i18n "pages.xray.dns.tag" }}'                        desc='{{ i18n "pages.xray.dns.tagDesc" }}' v-model="dnsTag"></setting-list-item>                    <a-list-item style="padding: 10px 20px">                        <a-row>                            <a-col :lg="24" :xl="12">                                <a-list-item-meta title='{{ i18n "pages.xray.dns.strategy" }}'                                    description='{{ i18n "pages.xray.dns.strategyDesc" }}' />                            </a-col>                            <a-col :lg="24" :xl="12">                                <a-select v-model="dnsStrategy" 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-col>                        </a-row>                    </a-list-item>                    <a-divider>DNS</a-divider>                    <a-button type="primary" icon="plus" @click="addDNSServer()" style="margin-bottom: 10px;">{{ i18n                        "pages.xray.dns.add" }}</a-button>                    <a-table :columns="dnsColumns" bordered v-if="dnsServers.length>0" :row-key="r => r.key"                        :data-source="dnsServers" :scroll="isMobile ? {} : { x: 200 }" :pagination="false" :indent-size="0"                        :style="isMobile ? 'padding: 5px 0' : 'margin-left: 1px;'">                        <template slot="action" slot-scope="text,dns,index">                            [[ index+1 ]]                            <a-dropdown :trigger="['click']">                                <a-icon @click="e => e.preventDefault()" type="more"                                    style="font-size: 16px; text-decoration: bold;"></a-icon>                                <a-menu slot="overlay" :theme="themeSwitcher.currentTheme">                                    <a-menu-item @click="editDNSServer(index)">                                        <a-icon type="edit"></a-icon>                                        {{ i18n "edit" }}                                    </a-menu-item>                                    <a-menu-item @click="deleteDNSServer(index)">                                        <span style="color: #FF4D4F">                                            <a-icon type="delete"></a-icon> {{ i18n "delete"}}                                        </span>                                    </a-menu-item>                                </a-menu>                            </a-dropdown>                        </template>                        <template slot="address" slot-scope="dns,index">                            <span v-if="typeof dns == 'object'">[[ dns.address ]]</span>                            <span v-else>[[ dns ]]</span>                        </template>                        <template slot="domain" slot-scope="dns,index">                            <span v-if="typeof dns == 'object'">[[ dns.domains.join(",") ]]</span>                        </template>                        <template slot="expectIPs" slot-scope="dns,index">                            <span v-if="typeof dns == 'object'">[[ dns.expectIPs.join(",") ]]</span>                        </template>                    </a-table>                    <a-divider>Fake DNS</a-divider>                    <a-button type="primary" icon="plus" @click="addFakedns()" style="margin-bottom: 10px;">{{ i18n                        "pages.xray.fakedns.add" }}</a-button>                    <a-table :columns="fakednsColumns" bordered v-if="fakeDns && fakeDns.length>0" :row-key="r => r.key"                        :data-source="fakeDns" :scroll="isMobile ? {} : { x: 200 }" :pagination="false" :indent-size="0"                        :style="isMobile ? 'padding: 5px 0' : 'margin-left: 1px;'">                        <template slot="action" slot-scope="text,fakedns,index">                            [[ index+1 ]]                            <a-dropdown :trigger="['click']">                                <a-icon @click="e => e.preventDefault()" type="more"                                    style="font-size: 16px; text-decoration: bold;"></a-icon>                                <a-menu slot="overlay" :theme="themeSwitcher.currentTheme">                                    <a-menu-item @click="editFakedns(index)">                                        <a-icon type="edit"></a-icon>                                        {{ i18n "edit" }}                                    </a-menu-item>                                    <a-menu-item @click="deleteFakedns(index)">                                        <span style="color: #FF4D4F">                                            <a-icon type="delete"></a-icon> {{ i18n "delete"}}                                        </span>                                    </a-menu-item>                                </a-menu>                            </a-dropdown>                        </template>                    </a-table>                </template>            </a-tab-pane>              <a-tab-pane key="tpl-advanced" tab='{{ i18n "pages.xray.advancedTemplate"}}' style="padding-top: 20px;" force-render="true">                <a-list-item-meta title='{{ i18n "pages.xray.Template"}}' description='{{ i18n "pages.xray.TemplateDesc"}}'></a-list-item-meta>                <a-radio-group v-model="advSettings" @change="changeCode" button-style="solid" style="margin: 10px 0;" :size="isMobile ? 'small' : ''">                  <a-radio-button value="xraySetting">{{ i18n "pages.xray.completeTemplate"}}</a-radio-button>                  <a-radio-button value="inboundSettings">{{ i18n "pages.xray.Inbounds" }}</a-radio-button>                  <a-radio-button value="outboundSettings">{{ i18n "pages.xray.Outbounds" }}</a-radio-button>                  <a-radio-button value="routingRuleSettings">{{ i18n "pages.xray.Routings" }}</a-radio-button>                </a-radio-group>                <textarea style="position:absolute; left: -800px;" id="xraySetting"></textarea>              </a-tab-pane>            </a-tabs>          </a-space>        </a-spin>      </a-layout-content>    </a-layout>  </a-layout>{{template "js" .}}{{template "component/themeSwitcher" .}}{{template "component/sortableTable" .}}{{template "component/setting"}}{{template "ruleModal"}}{{template "outModal"}}{{template "reverseModal"}}{{template "balancerModal"}}{{template "dnsModal"}}{{template "fakednsModal"}}{{template "warpModal"}}<script>        const rulesColumns = [        { title: "#", align: 'center', width: 15, scopedSlots: { customRender: 'action' } },        { title: '{{ i18n "pages.xray.rules.source"}}', children: [            { title: 'IP', dataIndex: "source", align: 'center', width: 20, ellipsis: true },            { title: 'Port', dataIndex: 'sourcePort', align: 'center', width: 10, ellipsis: true } ]},        { title: '{{ i18n "pages.inbounds.network"}}', children: [            { title: 'L4', dataIndex: 'network', align: 'center', width: 10 },            { title: 'Protocol', dataIndex: 'protocol', align: 'center', width: 10, ellipsis: true },            { title: 'Attrs', dataIndex: 'attrs', align: 'center', width: 20, ellipsis: true } ]},         { title: '{{ i18n "pages.xray.rules.dest"}}', children: [            { title: 'IP', dataIndex: 'ip', align: 'center', width: 20, ellipsis: true },            { title: 'Domain', dataIndex: 'domain', align: 'center', width: 20, ellipsis: true },            { title: 'Port', dataIndex: 'port', align: 'center', width: 10, ellipsis: true }]},        { title: '{{ i18n "pages.xray.rules.inbound"}}', children: [            { title: 'Inbound Tag', dataIndex: 'inboundTag', align: 'center', width: 15, ellipsis: true },            { title: 'Client Email', dataIndex: 'user', align: 'center', width: 20, ellipsis: true }]},        { title: '{{ i18n "pages.xray.rules.outbound"}}', dataIndex: 'outboundTag', align: 'center', width: 15 },        { title: '{{ i18n "pages.xray.rules.balancer"}}', dataIndex: 'balancerTag', align: 'center', width: 15 },    ];    const rulesMobileColumns = [        { title: "#", align: 'center', width: 20, scopedSlots: { customRender: 'action' } },        { title: '{{ i18n "pages.xray.rules.inbound"}}', align: 'center', width: 50, ellipsis: true, scopedSlots: { customRender: 'inbound' } },        { title: '{{ i18n "pages.xray.rules.outbound"}}', align: 'center', width: 50, ellipsis: true, scopedSlots: { customRender: 'outbound' } },        { title: '{{ i18n "pages.xray.rules.info"}}', align: 'center', width: 50, ellipsis: true, scopedSlots: { customRender: 'info' } },    ];    const outboundColumns = [        { title: "#", align: 'center', width: 20, scopedSlots: { customRender: 'action' } },        { title: '{{ i18n "pages.xray.outbound.tag"}}', dataIndex: 'tag', align: 'center', width: 50 },        { title: '{{ i18n "protocol"}}', align: 'center', width: 50, scopedSlots: { customRender: 'protocol' }  },        { title: '{{ i18n "pages.xray.outbound.address"}}', align: 'center', width: 50, scopedSlots: { customRender: 'address' } },        { title: '{{ i18n "pages.inbounds.traffic" }}', align: 'center', width: 50, scopedSlots: { customRender: 'traffic' } },    ];    const reverseColumns = [        { title: "#", align: 'center', width: 20, scopedSlots: { customRender: 'action' } },        { title: '{{ i18n "pages.xray.outbound.type"}}', dataIndex: 'type', align: 'center', width: 50 },        { title: '{{ i18n "pages.xray.outbound.tag"}}', dataIndex: 'tag', align: 'center', width: 50 },        { title: '{{ i18n "pages.xray.outbound.domain"}}', dataIndex: 'domain', align: 'center', width: 50 },    ];    const balancerColumns = [        { title: "#", align: 'center', width: 20, scopedSlots: { customRender: 'action' } },        { title: '{{ i18n "pages.xray.balancer.tag"}}', dataIndex: 'tag', align: 'center', width: 50 },        { title: '{{ i18n "pages.xray.balancer.balancerStrategy"}}', align: 'center', width: 50, scopedSlots: { customRender: 'strategy' }},        { title: '{{ i18n "pages.xray.balancer.balancerSelectors"}}', align: 'center', width: 100, scopedSlots: { customRender: 'selector' }},    ];    const dnsColumns = [        { title: "#", align: 'center', width: 20, scopedSlots: { customRender: 'action' } },        { title: '{{ i18n "pages.xray.outbound.address"}}', align: 'center', width: 50, scopedSlots: { customRender: 'address' } },        { title: '{{ i18n "pages.xray.dns.domains"}}', align: 'center', width: 50, scopedSlots: { customRender: 'domain' } },        { title: '{{ i18n "pages.xray.dns.expectIPs"}}', align: 'center', width: 50, scopedSlots: { customRender: 'expectIPs' } },    ];    const fakednsColumns = [        { title: "#", align: 'center', width: 20, scopedSlots: { customRender: 'action' } },        { title: '{{ i18n "pages.xray.fakedns.ipPool"}}', dataIndex: 'ipPool', align: 'center', width: 50 },        { title: '{{ i18n "pages.xray.fakedns.poolSize"}}', dataIndex: 'poolSize', align: 'center', width: 50 },    ];    const app = new Vue({        delimiters: ['[[', ']]'],        el: '#app',        data: {            siderDrawer,            themeSwitcher,            isDarkTheme: themeSwitcher.isDarkTheme,            spinning: false,            oldXraySetting: '',            xraySetting: '',            inboundTags: [],            outboundsTraffic: [],            saveBtnDisable: true,            refreshing: false,            restartResult: '',            showAlert: false,            isMobile: window.innerWidth <= 768,            advSettings: 'xraySetting',            obsSettings: '',            cm: null,            cmOptions: {                lineNumbers: true,                mode: "application/json",                lint: true,                styleActiveLine: true,                matchBrackets: true,                theme: "xq",                autoCloseTags: true,                lineWrapping: true,                indentUnit: 2,                indentWithTabs: true,                smartIndent: true,                tabSize: 2,                lineWiseCopyCut: false,                foldGutter: true,                gutters: [                    "CodeMirror-lint-markers",                    "CodeMirror-linenumbers",                    "CodeMirror-foldgutter",                ],            },            ipv4Settings: {                tag: "IPv4",                protocol: "freedom",                settings: {                    domainStrategy: "UseIPv4"                }            },            directSettings: {                tag: "direct",                protocol: "freedom"            },            routingDomainStrategies: ["AsIs", "IPIfNonMatch", "IPOnDemand"],            log: {                loglevel: ["none", "debug", "info", "warning", "error"],                access: ["none", "./access.log"],                error: ["none", "./error.log"],                dnsLog: false,                maskAddress: ["quarter", "half", "full"],            },            settingsData: {                protocols: {                    bittorrent: ["bittorrent"],                },                ips: {                    local: ["geoip:private"],                    cn: ["geoip:cn"],                    ir: ["ext:geoip_IR.dat:ir"],                    ru: ["geoip:ru"],                    vn: ["ext:geoip_VN.dat:vn"],                },                domains: {                    ads: [                        "geosite:category-ads-all",                        "ext:geosite_IR.dat:category-ads-all"                    ],                    security: [                        "ext:geosite_IR.dat:malware",                        "ext:geosite_IR.dat:phishing",                        "ext:geosite_IR.dat:cryptominers"                    ],                    speedtest: ["geosite:speedtest"],                    openai: ["geosite:openai"],                    google: ["geosite:google"],                    spotify: ["geosite:spotify"],                    netflix: ["geosite:netflix"],                    meta: ["geosite:meta"],                    apple: ["geosite:apple"],                    reddit: ["geosite:reddit"],                    cn: [                        "regexp:.*\\.cn$",                        "geosite:cn"                    ],                    ru: [                        "regexp:.*\\.ru$",                        "geosite:category-ru"  //https://github.com/v2fly/domain-list-community/blob/master/data/category-ru                                            ],                    ir: [                        "regexp:.*\\.ir$",                        "ext:geosite_IR.dat:ir",                        "geosite:category-ir",  // https://github.com/v2fly/domain-list-community/blob/master/data/category-ir                        "regexp:.*\\.xn--mgba3a4f16a$"  // .ایران                    ],                    vn: [                        "regexp:.*\\.vn$",                        "ext:geosite_VN.dat:vn",                        "ext:geosite_VN.dat:ads"                    ]                },                familyProtectDNS: {                    "servers": [                        "1.1.1.3",  // https://developers.cloudflare.com/1.1.1.1/setup/                        "1.0.0.3",                        "2606:4700:4700::1113",                        "2606:4700:4700::1003"                    ],                    "queryStrategy": "UseIP"                },            },            defaultObservatory: {                subjectSelector: [],                probeURL: "http://www.google.com/gen_204",                probeInterval: "10m",                enableConcurrency: true            },            defaultBurstObservatory: {                subjectSelector: [],                pingConfig: {                    destination: "http://www.google.com/gen_204",                    interval: "30m",                    connectivity: "http://connectivitycheck.platform.hicloud.com/generate_204",                    timeout: "10s",                    sampling: 2                }            }        },        methods: {            loading(spinning = true) {                this.spinning = spinning;            },            async getOutboundsTraffic() {                const msg = await HttpUtil.get("/panel/xray/getOutboundsTraffic");                if (msg.success) {                    this.outboundsTraffic = msg.obj;                }            },            async getXraySetting() {                this.loading(true);                const msg = await HttpUtil.post("/panel/xray/");                this.loading(false);                if (msg.success) {                    result = JSON.parse(msg.obj);                    xs = JSON.stringify(result.xraySetting, null, 2);                    this.oldXraySetting = xs;                    this.xraySetting = xs;                    this.inboundTags = result.inboundTags;                    this.saveBtnDisable = true;                }            },            async updateXraySetting() {                this.loading(true);                const msg = await HttpUtil.post("/panel/xray/update", {xraySetting : this.xraySetting});                this.loading(false);                if (msg.success) {                    await this.getXraySetting();                }            },            async restartXray() {                this.loading(true);                const msg = await HttpUtil.post("server/restartXrayService");                this.loading(false);                if (msg.success) {                    await PromiseUtil.sleep(500);                    await this.getXrayResult();                }                this.loading(false);            },            async getXrayResult() {                const msg = await HttpUtil.get("/panel/xray/getXrayResult");                if (msg.success) {                    this.restartResult=msg.obj;                    if(msg.obj.length > 1) Vue.prototype.$message.error(msg.obj);                }            },            async fetchUserSecret() {                this.loading(true);                const userMessage = await HttpUtil.post("/panel/setting/getUserSecret", this.user);                if (userMessage.success) {                    this.user = userMessage.obj;                }                this.loading(false);            },            async updateSecret() {                this.loading(true);                const msg = await HttpUtil.post("/panel/setting/updateUserSecret", this.user);                if (msg.success) {                    this.user = msg.obj;                    window.location.replace(basePath + "logout");                }                this.loading(false);                await this.updateXraySetting();            },            generateRandomString(length) {                var chars = "abcdefghijklmnopqrstuvwxyzABCDEFGHIJKLMNOPQRSTUVWXYZ1234567890";                let randomString = "";                for (let i = 0; i < length; i++) {                    randomString += chars[Math.floor(Math.random() * chars.length)];                }                return randomString;            },            async getNewSecret() {                this.loading(true);                await PromiseUtil.sleep(600);                const newSecret = this.generateRandomString(64);                this.user.loginSecret = newSecret;                document.getElementById("token").textContent = newSecret;                this.loading(false);            },            async toggleToken(value) {                if (value) {                    await this.getNewSecret();                } else {                    this.user.loginSecret = "";                }            },            async resetXrayConfigToDefault() {                this.loading(true);                const msg = await HttpUtil.get("/panel/setting/getDefaultJsonConfig");                this.loading(false);                if (msg.success) {                    this.templateSettings = JSON.parse(JSON.stringify(msg.obj, null, 2));                    this.saveBtnDisable = true;                }            },            changePage(pageKey) {                if(pageKey == 'tpl-advanced') this.changeCode();                if(pageKey == 'tpl-balancer') this.changeObsCode();            },            syncRulesWithOutbound(tag, setting) {                const newTemplateSettings = this.templateSettings;                const haveRules = newTemplateSettings.routing.rules.some((r) => r?.outboundTag === tag);                const outboundIndex = newTemplateSettings.outbounds.findIndex((o) => o.tag === tag);                if (!haveRules && outboundIndex > 0) {                    newTemplateSettings.outbounds.splice(outboundIndex);                }                if (haveRules && outboundIndex < 0) {                    newTemplateSettings.outbounds.push(setting);                }                this.templateSettings = newTemplateSettings;            },            templateRuleGetter(routeSettings) {                const { property, outboundTag } = routeSettings;                let result = [];                if (this.templateSettings != null) {                    this.templateSettings.routing.rules.forEach(                        (routingRule) => {                            if (                                routingRule.hasOwnProperty(property) &&                                routingRule.hasOwnProperty("outboundTag") &&                                routingRule.outboundTag === outboundTag                            ) {                                result.push(...routingRule[property]);                            }                        }                    );                }                return result;            },            templateRuleSetter(routeSettings) {                const { data, property, outboundTag } = routeSettings;                const oldTemplateSettings = this.templateSettings;                const newTemplateSettings = oldTemplateSettings;                currentProperty = this.templateRuleGetter({ outboundTag, property })                if (currentProperty.length == 0) {                    const propertyRule = {                        type: "field",                        outboundTag,                        [property]: data                    };                    newTemplateSettings.routing.rules.push(propertyRule);                }                else {                    const newRules = [];                    insertedOnce = false;                    newTemplateSettings.routing.rules.forEach(                        (routingRule) => {                            if (                                routingRule.hasOwnProperty(property) &&                                routingRule.hasOwnProperty("outboundTag") &&                                routingRule.outboundTag === outboundTag                            ) {                                if (!insertedOnce && data.length > 0) {                                    insertedOnce = true;                                    routingRule[property] = data;                                    newRules.push(routingRule);                                }                            }                            else {                                newRules.push(routingRule);                            }                        }                    );                    newTemplateSettings.routing.rules = newRules;                }                this.templateSettings = newTemplateSettings;            },            changeCode() {                if(this.cm != null) {                    this.cm.toTextArea();                }                textAreaObj = document.getElementById('xraySetting');                textAreaObj.value = this[this.advSettings];                this.cm = CodeMirror.fromTextArea(textAreaObj, this.cmOptions);                this.cm.on('change',editor => {                    value = editor.getValue();                    if (this.isJsonString(value)) {                        this[this.advSettings] = value;                    }                });            },            changeObsCode() {                if(this.cm != null) {                    this.cm.toTextArea();                }                if (this.obsSettings == ''){                    this.cm = null;                    return                }                textAreaObj = document.getElementById('obsSetting');                textAreaObj.value = this[this.obsSettings];                this.cm = CodeMirror.fromTextArea(textAreaObj, this.cmOptions);                this.cm.on('change',editor => {                    value = editor.getValue();                    if(this.isJsonString(value)){                        this[this.obsSettings] = value;                    }                });            },            isJsonString(str) {                try {                    JSON.parse(str);                } catch (e) {                    return false;                }                return true;            },            findOutboundTraffic(o) {                for (const otraffic of this.outboundsTraffic) {                    if (otraffic.tag == o.tag) {                        return sizeFormat(otraffic.up) + ' / ' + sizeFormat(otraffic.down);                    }                }                return sizeFormat(0) + ' / ' + sizeFormat(0);            },            findOutboundAddress(o) {                serverObj = null;                switch(o.protocol){                    case Protocols.VMess:                    case Protocols.VLESS:                        serverObj = o.settings.vnext;                        break;                    case Protocols.HTTP:                    case Protocols.Socks:                    case Protocols.Shadowsocks:                    case Protocols.Trojan:                        serverObj = o.settings.servers;                        break;                    case Protocols.DNS:                        return [o.settings?.address + ':' + o.settings?.port];                        case Protocols.Wireguard:                        return o.settings.peers.map(peer => peer.endpoint);                    default:                        return null;                }                return serverObj ? serverObj.map(obj => obj.address + ':' + obj.port) : null;            },            addOutbound(){                outModal.show({                    title: '{{ i18n "pages.xray.outbound.addOutbound"}}',                    okText: '{{ i18n "pages.xray.outbound.addOutbound" }}',                    confirm: (outbound) => {                        outModal.loading();                        if(outbound.tag.length > 0){                            this.templateSettings.outbounds.push(outbound);                            this.outboundSettings = JSON.stringify(this.templateSettings.outbounds);                        }                        outModal.close();                    },                    isEdit: false,                    tags: this.templateSettings.outbounds.map(obj => obj.tag)                });            },            editOutbound(index){                outModal.show({                    title: '{{ i18n "pages.xray.outbound.editOutbound"}} ' + (index+1),                    outbound: app.templateSettings.outbounds[index],                    confirm: (outbound) => {                        outModal.loading();                        this.templateSettings.outbounds[index] = outbound;                        this.outboundSettings = JSON.stringify(this.templateSettings.outbounds);                        outModal.close();                    },                    isEdit: true,                    tags: this.outboundData.filter((o) => o.key != index ).map(obj => obj.tag)                });            },            deleteOutbound(index){                outbounds = this.templateSettings.outbounds;                outbounds.splice(index,1);                this.outboundSettings = JSON.stringify(outbounds);            },            setFirstOutbound(index){                outbounds = this.templateSettings.outbounds;                outbounds.splice(0, 0, outbounds.splice(index, 1)[0]);                this.outboundSettings = JSON.stringify(outbounds);            },            addReverse(){                reverseModal.show({                    title: '{{ i18n "pages.xray.outbound.addReverse"}}',                    okText: '{{ i18n "pages.xray.outbound.addReverse" }}',                    confirm: (reverse, rules) => {                        reverseModal.loading();                        if(reverse.tag.length > 0){                            newTemplateSettings = this.templateSettings;                            if(newTemplateSettings.reverse == undefined) newTemplateSettings.reverse = {};                            if(newTemplateSettings.reverse[reverse.type+'s']  == undefined) newTemplateSettings.reverse[reverse.type+'s'] = [];                            newTemplateSettings.reverse[reverse.type+'s'].push({ tag: reverse.tag, domain: reverse.domain });                            this.templateSettings = newTemplateSettings;                            // Add related rules                            this.templateSettings.routing.rules.push(...rules);                            this.routingRuleSettings = JSON.stringify(this.templateSettings.routing.rules);                        }                        reverseModal.close();                    },                    isEdit: false                });            },            editReverse(index){                if(this.reverseData[index].type == "bridge") {                    oldRules = this.templateSettings.routing.rules.filter(r => r.inboundTag && r.inboundTag[0] == this.reverseData[index].tag);                } else {                    oldRules = this.templateSettings.routing.rules.filter(r => r.outboundTag && r.outboundTag == this.reverseData[index].tag);                }                reverseModal.show({                    title: '{{ i18n "pages.xray.outbound.editReverse"}} ' + (index+1),                    reverse: this.reverseData[index],                    rules: oldRules,                    confirm: (reverse, rules) => {                        reverseModal.loading();                        if(reverse.tag.length > 0){                            oldData = this.reverseData[index];                            newTemplateSettings = this.templateSettings;                            oldReverseIndex = newTemplateSettings.reverse[oldData.type+'s'].findIndex(rs => rs.tag == oldData.tag);                            oldRuleIndex0 = oldRules.length>0 ? newTemplateSettings.routing.rules.findIndex(r => JSON.stringify(r) == JSON.stringify(oldRules[0])) : -1;                            oldRuleIndex1 = oldRules.length==2 ? newTemplateSettings.routing.rules.findIndex(r => JSON.stringify(r) == JSON.stringify(oldRules[1])) : -1;                            if(oldData.type == reverse.type){                                newTemplateSettings.reverse[oldData.type + 's'][oldReverseIndex] = { tag: reverse.tag, domain: reverse.domain };                            } else {                                newTemplateSettings.reverse[oldData.type+'s'].splice(oldReverseIndex,1);                                // delete empty object                                if(newTemplateSettings.reverse[oldData.type+'s'].length == 0) Reflect.deleteProperty(newTemplateSettings.reverse, oldData.type+'s');                                // add other type of reverse if it is not exist                                if(!newTemplateSettings.reverse[reverse.type+'s']) newTemplateSettings.reverse[reverse.type+'s'] = [];                                newTemplateSettings.reverse[reverse.type+'s'].push({ tag: reverse.tag, domain: reverse.domain });                            }                            this.templateSettings = newTemplateSettings;                            // Adjust Rules                            newRules = this.templateSettings.routing.rules;                            oldRuleIndex0 != -1 ? newRules[oldRuleIndex0] = rules[0] : newRules.push(rules[0]);                            oldRuleIndex1 != -1 ? newRules[oldRuleIndex1] = rules[1] : newRules.push(rules[1]);                            this.routingRuleSettings = JSON.stringify(newRules);                        }                        reverseModal.close();                    },                    isEdit: true                });            },            deleteReverse(index){                oldData = this.reverseData[index];                newTemplateSettings = this.templateSettings;                reverseTypeObj = newTemplateSettings.reverse[oldData.type+'s'];                realIndex = reverseTypeObj.findIndex(r => r.tag==oldData.tag && r.domain==oldData.domain);                newTemplateSettings.reverse[oldData.type+'s'].splice(realIndex,1);                // delete empty objects                if(reverseTypeObj.length == 0) Reflect.deleteProperty(newTemplateSettings.reverse, oldData.type+'s');                if(Object.keys(newTemplateSettings.reverse).length === 0) Reflect.deleteProperty(newTemplateSettings, 'reverse');                // delete related routing rules                newRules = newTemplateSettings.routing.rules;                if(oldData.type == "bridge"){                    newRules = newTemplateSettings.routing.rules.filter(r => !( r.inboundTag && r.inboundTag.length == 1 && r.inboundTag[0] == oldData.tag));                } else if(oldData.type == "portal"){                    newRules = newTemplateSettings.routing.rules.filter(r => r.outboundTag != oldData.tag);                }                newTemplateSettings.routing.rules = newRules;                this.templateSettings = newTemplateSettings;            },            async refreshOutboundTraffic() {                if (!this.refreshing) {                    this.refreshing = true;                    await this.getOutboundsTraffic();                    data = []                    if (this.templateSettings != null) {                        this.templateSettings.outbounds.forEach((o, index) => {                            data.push({'key': index, ...o});                        });                    }                    this.outboundData = data;                    this.refreshing = false;                }            },            async resetOutboundTraffic(index) {                let tag = "-alltags-";                if (index >= 0) {                    tag = this.outboundData[index].tag ? this.outboundData[index].tag : ""                }                const msg = await HttpUtil.post("/panel/xray/resetOutboundsTraffic", { tag: tag });                if (msg.success) {                    await this.refreshOutboundTraffic();                }            },            addBalancer() {                balancerModal.show({                    title: '{{ i18n "pages.xray.balancer.addBalancer"}}',                    okText: '{{ i18n "pages.xray.balancer.addBalancer"}}',                    balancerTags: this.balancersData.filter((o) => !ObjectUtil.isEmpty(o.tag)).map(obj => obj.tag),                    balancer: {                        tag: '',                        strategy: 'random',                        selector: [],                        fallbackTag: ''                    },                    confirm: (balancer) => {                        balancerModal.loading();                        newTemplateSettings = this.templateSettings;                        if (newTemplateSettings.routing.balancers == undefined) {                            newTemplateSettings.routing.balancers = [];                        }                        let tmpBalancer = {                            'tag': balancer.tag,                            'selector': balancer.selector,                            'fallbackTag': balancer.fallbackTag                        };                        if (balancer.strategy && balancer.strategy != 'random') {                            tmpBalancer.strategy = {                                'type': balancer.strategy                            };                        }                        newTemplateSettings.routing.balancers.push(tmpBalancer);                        this.templateSettings = newTemplateSettings;                        if (balancer.strategy == 'leastPing' || balancer.strategy == 'leastLoad')                            this.updateObservatorySelectors();                        balancerModal.close();                        this.changeObsCode();                    },                    isEdit: false                });            },            editBalancer(index) {                const oldTag = this.balancersData[index].tag;                balancerModal.show({                    title: '{{ i18n "pages.xray.balancer.editBalancer"}}',                    okText: '{{ i18n "sure" }}',                    balancerTags: this.balancersData.filter((o) => !ObjectUtil.isEmpty(o.tag)).map(obj => obj.tag),                    balancer: this.balancersData[index],                    confirm: (balancer) => {                        balancerModal.loading();                        newTemplateSettings = this.templateSettings;                        let tmpBalancer = {                            'tag': balancer.tag,                            'selector': balancer.selector,                            'fallbackTag': balancer.fallbackTag                        };                        // Remove old tag                        if (newTemplateSettings.observatory){                            newTemplateSettings.observatory.subjectSelector = newTemplateSettings.observatory.subjectSelector.filter(s => s != oldTag);                        }                        if (newTemplateSettings.burstObservatory){                            newTemplateSettings.burstObservatory.subjectSelector = newTemplateSettings.burstObservatory.subjectSelector.filter(s => s != oldTag);                        }                        if (balancer.strategy && balancer.strategy != 'random') {                            tmpBalancer.strategy = {                                'type': balancer.strategy                            };                        }                        newTemplateSettings.routing.balancers[index] = tmpBalancer;                        // change edited tag if used in rule section                        if (oldTag != balancer.tag) {                            newTemplateSettings.routing.rules.forEach((rule) => {                                if (rule.balancerTag && rule.balancerTag == oldTag) {                                    rule.balancerTag = balancer.tag;                                }                            });                        }                        this.templateSettings = newTemplateSettings;                        if (balancer.strategy == 'leastPing' || balancer.strategy == 'leastLoad')                            this.updateObservatorySelectors();                        balancerModal.close();                        this.changeObsCode();                    },                    isEdit: true                });            },            updateObservatorySelectors(){                newTemplateSettings = this.templateSettings;                const leastPings = this.balancersData.filter((b) => b.strategy == 'leastPing');                const leastLoads = this.balancersData.filter((b) => b.strategy == 'leastLoad');                if (leastPings.length>0){                    if (!newTemplateSettings.observatory)                        newTemplateSettings.observatory = this.defaultObservatory;                    newTemplateSettings.observatory.subjectSelector = [];                    leastPings.forEach((b) => {                        b.selector.forEach((s) => {                            if (!newTemplateSettings.observatory.subjectSelector.includes(s))                                newTemplateSettings.observatory.subjectSelector.push(s);                        });                    });                } else {                    delete newTemplateSettings.observatory                }                if (leastLoads.length>0){                    if (!newTemplateSettings.burstObservatory)                        newTemplateSettings.burstObservatory = this.defaultBurstObservatory;                    newTemplateSettings.burstObservatory.subjectSelector = [];                    leastLoads.forEach((b) => {                        b.selector.forEach((s) => {                            if (!newTemplateSettings.burstObservatory.subjectSelector.includes(s))                                newTemplateSettings.burstObservatory.subjectSelector.push(s);                        });                    });                } else {                    delete newTemplateSettings.burstObservatory                }                this.templateSettings = newTemplateSettings;                this.changeObsCode();            },            deleteBalancer(index) {                newTemplateSettings = this.templateSettings;                // Remove from balancers                const removedBalancer = this.balancersData.splice(index, 1)[0];                // Remove from settings                let realIndex = newTemplateSettings.routing.balancers.findIndex((b) => b.tag === removedBalancer.tag);                newTemplateSettings.routing.balancers.splice(realIndex, 1);                                // Update balancers property to an empty array if there are no more balancers                if (newTemplateSettings.routing.balancers.length === 0) {                    delete newTemplateSettings.routing.balancers;                }                this.templateSettings = newTemplateSettings;                this.updateObservatorySelectors();                this.obsSettings = '';                this.changeObsCode()            },            addDNSServer(){                dnsModal.show({                    title: '{{ i18n "pages.xray.dns.add" }}',                    confirm: (dnsServer) => {                        dnsServers = this.dnsServers;                        dnsServers.push(dnsServer);                        this.dnsServers = dnsServers;                        dnsModal.close();                    },                    isEdit: false                });            },            editDNSServer(index){                dnsModal.show({                    title: '{{ i18n "pages.xray.dns.edit" }} #' + (index+1),                    dnsServer: this.dnsServers[index],                    confirm: (dnsServer) => {                        dnsServers = this.dnsServers;                        dnsServers[index] = dnsServer;                        this.dnsServers = dnsServers;                        dnsModal.close();                    },                    isEdit: true                });            },            deleteDNSServer(index){                newDnsServers = this.dnsServers;                newDnsServers.splice(index,1);                this.dnsServers = newDnsServers;            },            addFakedns() {                fakednsModal.show({                    title: '{{ i18n "pages.xray.fakedns.add" }}',                    confirm: (item) => {                        fakeDns = this.fakeDns?? [];                        fakeDns.push(item);                        this.fakeDns = fakeDns;                        fakednsModal.close();                    },                    isEdit: false                });            },            editFakedns(index){                fakednsModal.show({                    title: '{{ i18n "pages.xray.fakedns.edit" }} #' + (index+1),                    fakeDns: this.fakeDns[index],                    confirm: (item) => {                        fakeDns = this.fakeDns;                        fakeDns[index] = item;                        this.fakeDns = fakeDns;                        fakednsModal.close();                    },                    isEdit: true                });            },            deleteFakedns(index){                fakeDns = this.fakeDns;                fakeDns.splice(index,1);                this.fakeDns = fakeDns;            },            addRule(){                ruleModal.show({                    title: '{{ i18n "pages.xray.rules.add"}}',                    okText: '{{ i18n "pages.xray.rules.add" }}',                    confirm: (rule) => {                        ruleModal.loading();                        if(JSON.stringify(rule).length > 3){                            this.templateSettings.routing.rules.push(rule);                            this.routingRuleSettings = JSON.stringify(this.templateSettings.routing.rules);                        }                        ruleModal.close();                    },                    isEdit: false                });            },            editRule(index){                ruleModal.show({                    title: '{{ i18n "pages.xray.rules.edit"}} ' + (index+1),                    rule: app.templateSettings.routing.rules[index],                    confirm: (rule) => {                        ruleModal.loading();                        if(JSON.stringify(rule).length > 3){                            this.templateSettings.routing.rules[index] = rule;                            this.routingRuleSettings = JSON.stringify(this.templateSettings.routing.rules);                        }                        ruleModal.close();                    },                    isEdit: true                });            },            replaceRule(old_index,new_index){                rules = this.templateSettings.routing.rules;                if (new_index >= rules.length) rules.push(undefined);                rules.splice(new_index, 0, rules.splice(old_index, 1)[0]);                this.routingRuleSettings = JSON.stringify(rules);            },            deleteRule(index){                rules = this.templateSettings.routing.rules;                rules.splice(index,1);                this.routingRuleSettings = JSON.stringify(rules);            },            showWarp(){                warpModal.show();            }        },        async mounted() {            if (window.location.protocol !== "https:") {                this.showAlert = true;            }            await this.getXraySetting();            await this.getXrayResult();            await this.getOutboundsTraffic();            while (true) {                await PromiseUtil.sleep(800);                this.saveBtnDisable = this.oldXraySetting === this.xraySetting;            }        },        computed: {            templateSettings: {                get: function () {                    const parsedSettings = this.xraySetting ? JSON.parse(this.xraySetting) : null;                    return parsedSettings;                },                set: function (newValue) {                    if (newValue) {                        this.xraySetting = JSON.stringify(newValue, null, 2);                    }                },            },            inboundSettings: {                get: function () { return this.templateSettings ? JSON.stringify(this.templateSettings.inbounds, null, 2) : null; },                set: function (newValue) {                    newTemplateSettings = this.templateSettings;                    newTemplateSettings.inbounds = JSON.parse(newValue);                    this.templateSettings = newTemplateSettings;                },            },            outboundSettings: {                get: function () { return this.templateSettings ? JSON.stringify(this.templateSettings.outbounds, null, 2) : null; },                set: function (newValue) {                    newTemplateSettings = this.templateSettings;                    newTemplateSettings.outbounds = JSON.parse(newValue);                    this.templateSettings = newTemplateSettings;                },            },            outboundData: {                get: function () {                    data = []                    if (this.templateSettings != null) {                        this.templateSettings.outbounds.forEach((o, index) => {                            data.push({'key': index, ...o});                        });                    }                    return data;                },            },            reverseData: {                get: function () {                    data = []                    if (this.templateSettings != null && this.templateSettings.reverse != null) {                        if(this.templateSettings.reverse.bridges) {                            this.templateSettings.reverse.bridges.forEach((o, index) => {                                data.push({'key': index, 'type':'bridge', ...o});                            });                        }                        if(this.templateSettings.reverse.portals){                            this.templateSettings.reverse.portals.forEach((o, index) => {                                data.push({'key': index, 'type':'portal', ...o});                            });                        }                    }                    return data;                },            },            routingRuleSettings: {                get: function () { return this.templateSettings ? JSON.stringify(this.templateSettings.routing.rules, null, 2) : null; },                set: function (newValue) {                    newTemplateSettings = this.templateSettings;                    newTemplateSettings.routing.rules = JSON.parse(newValue);                    this.templateSettings = newTemplateSettings;                },            },            routingRuleData: {                get: function () {                    data = [];                    if (this.templateSettings != null) {                        this.templateSettings.routing.rules.forEach((r, index) => {                            data.push({'key': index, ...r});                        });                        // Make rules readable                        data.forEach(r => {                            if(r.domain) r.domain = r.domain.join(',')                            if(r.ip) r.ip = r.ip.join(',')                            if(r.source) r.source = r.source.join(',');                            if(r.user) r.user = r.user.join(',')                            if(r.inboundTag) r.inboundTag = r.inboundTag.join(',')                            if(r.protocol) r.protocol = r.protocol.join(',')                            if(r.attrs) r.attrs = JSON.stringify(r.attrs, null, 2)                        });                    }                    return data;                }            },            balancersData: {                get: function () {                    data = []                    if (this.templateSettings != null && this.templateSettings.routing != null && this.templateSettings.routing.balancers != null) {                        this.templateSettings.routing.balancers.forEach((o, index) => {                            data.push({                                'key': index,                                'tag': o.tag ? o.tag : "",                                'strategy': o.strategy?.type ?? "random",                                'selector': o.selector ? o.selector : [],                                'fallbackTag': o.fallbackTag?? '',                            });                        });                    }                    return data;                }            },            observatory: {                get: function () {                     return this.templateSettings?.observatory ? JSON.stringify(this.templateSettings.observatory, null, 2) : null;                },                set: function (newValue) {                    newTemplateSettings = this.templateSettings;                    newTemplateSettings.observatory = JSON.parse(newValue);                    this.templateSettings = newTemplateSettings;                },            },            burstObservatory: {                get: function () {                     return this.templateSettings?.burstObservatory ? JSON.stringify(this.templateSettings.burstObservatory, null, 2) : null;                 },                set: function (newValue) {                    newTemplateSettings = this.templateSettings;                    newTemplateSettings.burstObservatory = JSON.parse(newValue);                    this.templateSettings = newTemplateSettings;                },            },            observatoryEnable: function () { return this.templateSettings != null && this.templateSettings.observatory != undefined },            burstObservatoryEnable: function () { return this.templateSettings != null && this.templateSettings.burstObservatory != undefined },            freedomStrategy: {                get: function () {                    if (!this.templateSettings) return "AsIs";                    freedomOutbound = this.templateSettings.outbounds.find((o) => o.protocol === "freedom" && o.tag == "direct");                    if (!freedomOutbound) return "AsIs";                    if (!freedomOutbound.settings || !freedomOutbound.settings.domainStrategy) return "AsIs";                    return freedomOutbound.settings.domainStrategy;                },                set: function (newValue) {                    newTemplateSettings = this.templateSettings;                    freedomOutboundIndex = newTemplateSettings.outbounds.findIndex((o) => o.protocol === "freedom" && o.tag == "direct");                    if(freedomOutboundIndex == -1){                        newTemplateSettings.outbounds.push({protocol: "freedom", tag: "direct", settings: { "domainStrategy": newValue }});                    } else if (!newTemplateSettings.outbounds[freedomOutboundIndex].settings) {                        newTemplateSettings.outbounds[freedomOutboundIndex].settings = {"domainStrategy": newValue};                    } else {                        newTemplateSettings.outbounds[freedomOutboundIndex].settings.domainStrategy = newValue;                    }                    this.templateSettings = newTemplateSettings;                }            },            routingStrategy: {                get: function () {                    if (!this.templateSettings || !this.templateSettings.routing || !this.templateSettings.routing.domainStrategy) return "AsIs";                    return this.templateSettings.routing.domainStrategy;                },                set: function (newValue) {                    newTemplateSettings = this.templateSettings;                    newTemplateSettings.routing.domainStrategy = newValue;                    this.templateSettings = newTemplateSettings;                }            },            logLevel: {                get: function () {                    if (!this.templateSettings || !this.templateSettings.log || !this.templateSettings.log.loglevel) return "warning";                    return this.templateSettings.log.loglevel;                },                set: function (newValue) {                    newTemplateSettings = this.templateSettings;                    newTemplateSettings.log.loglevel = newValue;                    this.templateSettings = newTemplateSettings;                }            },            accessLog: {                get: function () {                    if (!this.templateSettings || !this.templateSettings.log || !this.templateSettings.log.access) return "";                    return this.templateSettings.log.access;                },                set: function (newValue) {                    newTemplateSettings = this.templateSettings;                    newTemplateSettings.log.access = newValue;                    this.templateSettings = newTemplateSettings;                }            },            errorLog: {                get: function () {                    if (!this.templateSettings || !this.templateSettings.log || !this.templateSettings.log.error) return "";                    return this.templateSettings.log.error;                },                set: function (newValue) {                    newTemplateSettings = this.templateSettings;                    newTemplateSettings.log.error = newValue;                    this.templateSettings = newTemplateSettings;                }            },            dnslog: {                get: function () {                    if (!this.templateSettings || !this.templateSettings.log || !this.templateSettings.log.dnsLog) return false;                    return this.templateSettings.log.dnsLog;                },                set: function (newValue) {                    newTemplateSettings = this.templateSettings;                    newTemplateSettings.log.dnsLog = newValue;                    this.templateSettings = newTemplateSettings;                }            },            maskAddressLog: {                get: function () {                    if (!this.templateSettings || !this.templateSettings.log || !this.templateSettings.log.maskAddress) return "";                    return this.templateSettings.log.maskAddress;                },                set: function (newValue) {                    newTemplateSettings = this.templateSettings;                    newTemplateSettings.log.maskAddress = newValue;                    this.templateSettings = newTemplateSettings;                }            },            blockedIPs: {                get: function () {                    return this.templateRuleGetter({ outboundTag: "blocked", property: "ip" });                },                set: function (newValue) {                    this.templateRuleSetter({ outboundTag: "blocked", property: "ip", data: newValue });                }            },            blockedDomains: {                get: function () {                    return this.templateRuleGetter({ outboundTag: "blocked", property: "domain" });                },                set: function (newValue) {                    this.templateRuleSetter({ outboundTag: "blocked", property: "domain", data: newValue });                }            },            blockedProtocols: {                get: function () {                    return this.templateRuleGetter({ outboundTag: "blocked", property: "protocol" });                },                set: function (newValue) {                    this.templateRuleSetter({ outboundTag: "blocked", property: "protocol", data: newValue });                }            },            directIPs: {                get: function () {                    return this.templateRuleGetter({ outboundTag: "direct", property: "ip" });                },                set: function (newValue) {                    this.templateRuleSetter({ outboundTag: "direct", property: "ip", data: newValue });                    this.syncRulesWithOutbound("direct", this.directSettings);                }            },            directDomains: {                get: function () {                    return this.templateRuleGetter({ outboundTag: "direct", property: "domain" });                },                set: function (newValue) {                    this.templateRuleSetter({ outboundTag: "direct", property: "domain", data: newValue });                    this.syncRulesWithOutbound("direct", this.directSettings);                }            },            ipv4Domains: {                get: function () {                    return this.templateRuleGetter({ outboundTag: "IPv4", property: "domain" });                },                set: function (newValue) {                    this.templateRuleSetter({ outboundTag: "IPv4", property: "domain", data: newValue });                    this.syncRulesWithOutbound("IPv4", this.ipv4Settings);                }            },            warpDomains: {                get: function () {                    return this.templateRuleGetter({ outboundTag: "warp", property: "domain" });                },                set: function (newValue) {                    this.templateRuleSetter({ outboundTag: "warp", property: "domain", data: newValue });                }            },            torrentSettings: {                get: function () {                    return doAllItemsExist(this.settingsData.protocols.bittorrent, this.blockedProtocols);                },                set: function (newValue) {                    if (newValue) {                        this.blockedProtocols = [...this.blockedProtocols, ...this.settingsData.protocols.bittorrent];                    } else {                        this.blockedProtocols = this.blockedProtocols.filter(data => !this.settingsData.protocols.bittorrent.includes(data));                    }                },            },            privateIpSettings: {                get: function () {                    return doAllItemsExist(this.settingsData.ips.local, this.blockedIPs);                },                set: function (newValue) {                    if (newValue) {                        this.blockedIPs = [...this.blockedIPs, ...this.settingsData.ips.local];                    } else {                        this.blockedIPs = this.blockedIPs.filter(data => !this.settingsData.ips.local.includes(data));                    }                },            },            AdsSettings: {                get: function () {                    return doAllItemsExist(this.settingsData.domains.ads, this.blockedDomains);                },                set: function (newValue) {                    if (newValue) {                        this.blockedDomains = [...this.blockedDomains, ...this.settingsData.domains.ads];                    } else {                        this.blockedDomains = this.blockedDomains.filter(data => !this.settingsData.domains.ads.includes(data));                    }                },            },            SecuritySettings: {                get: function () {                    return doAllItemsExist(this.settingsData.domains.security, this.blockedDomains);                },                set: function (newValue) {                    if (newValue) {                        this.blockedDomains = [...this.blockedDomains, ...this.settingsData.domains.security];                    } else {                        this.blockedDomains = this.blockedDomains.filter(data => !this.settingsData.domains.security.includes(data));                    }                },            },            SpeedTestSettings: {                get: function () {                    return doAllItemsExist(this.settingsData.domains.speedtest, this.blockedDomains);                },                set: function (newValue) {                    if (newValue) {                        this.blockedDomains = [...this.blockedDomains, ...this.settingsData.domains.speedtest];                    } else {                        this.blockedDomains = this.blockedDomains.filter(data => !this.settingsData.domains.speedtest.includes(data));                    }                },            },            familyProtectSettings: {                get: function () {                    if (!this.templateSettings || !this.templateSettings.dns || !this.templateSettings.dns.servers) return false;                    return doAllItemsExist(this.settingsData.familyProtectDNS.servers, this.templateSettings.dns.servers);                },                set: function (newValue) {                    newTemplateSettings = this.templateSettings;                    if (newValue) {                        newTemplateSettings.dns = this.settingsData.familyProtectDNS;                    } else {                        newTemplateSettings.dns.servers = newTemplateSettings.dns?.servers?.filter(data => !this.settingsData.familyProtectDNS.servers.includes(data))                    }                    this.templateSettings = newTemplateSettings;                },            },            GoogleIPv4Settings: {                get: function () {                    return doAllItemsExist(this.settingsData.domains.google, this.ipv4Domains);                },                set: function (newValue) {                    if (newValue) {                        this.ipv4Domains = [...this.ipv4Domains, ...this.settingsData.domains.google];                    } else {                        this.ipv4Domains = this.ipv4Domains.filter(data => !this.settingsData.domains.google.includes(data));                    }                },            },            NetflixIPv4Settings: {                get: function () {                    return doAllItemsExist(this.settingsData.domains.netflix, this.ipv4Domains);                },                set: function (newValue) {                    if (newValue) {                        this.ipv4Domains = [...this.ipv4Domains, ...this.settingsData.domains.netflix];                    } else {                        this.ipv4Domains = this.ipv4Domains.filter(data => !this.settingsData.domains.netflix.includes(data));                    }                },            },            IRIpSettings: {                get: function () {                    return doAllItemsExist(this.settingsData.ips.ir, this.blockedIPs);                },                set: function (newValue) {                    if (newValue) {                        this.blockedIPs = [...this.blockedIPs, ...this.settingsData.ips.ir];                    } else {                        this.blockedIPs = this.blockedIPs.filter(data => !this.settingsData.ips.ir.includes(data));                    }                }            },            IRDomainSettings: {                get: function () {                    return doAllItemsExist(this.settingsData.domains.ir, this.blockedDomains);                },                set: function (newValue) {                    if (newValue) {                        this.blockedDomains = [...this.blockedDomains, ...this.settingsData.domains.ir];                    } else {                        this.blockedDomains = this.blockedDomains.filter(data => !this.settingsData.domains.ir.includes(data));                    }                }            },            ChinaIpSettings: {                get: function () {                    return doAllItemsExist(this.settingsData.ips.cn, this.blockedIPs);                },                set: function (newValue) {                    if (newValue) {                        this.blockedIPs = [...this.blockedIPs, ...this.settingsData.ips.cn];                    } else {                        this.blockedIPs = this.blockedIPs.filter(data => !this.settingsData.ips.cn.includes(data));                    }                }            },            ChinaDomainSettings: {                get: function () {                    return doAllItemsExist(this.settingsData.domains.cn, this.blockedDomains);                },                set: function (newValue) {                    if (newValue) {                        this.blockedDomains = [...this.blockedDomains, ...this.settingsData.domains.cn];                    } else {                        this.blockedDomains = this.blockedDomains.filter(data => !this.settingsData.domains.cn.includes(data));                    }                }            },            RussiaIpSettings: {                get: function () {                    return doAllItemsExist(this.settingsData.ips.ru, this.blockedIPs);                },                set: function (newValue) {                    if (newValue) {                        this.blockedIPs = [...this.blockedIPs, ...this.settingsData.ips.ru];                    } else {                        this.blockedIPs = this.blockedIPs.filter(data => !this.settingsData.ips.ru.includes(data));                    }                }            },            RussiaDomainSettings: {                get: function () {                    return doAllItemsExist(this.settingsData.domains.ru, this.blockedDomains);                },                set: function (newValue) {                    if (newValue) {                        this.blockedDomains = [...this.blockedDomains, ...this.settingsData.domains.ru];                    } else {                        this.blockedDomains = this.blockedDomains.filter(data => !this.settingsData.domains.ru.includes(data));                    }                }            },            VNIpSettings: {                get: function () {                    return doAllItemsExist(this.settingsData.ips.vn, this.blockedIPs);                },                set: function (newValue) {                    if (newValue) {                        this.blockedIPs = [...this.blockedIPs, ...this.settingsData.ips.vn];                    } else {                        this.blockedIPs = this.blockedIPs.filter(data => !this.settingsData.ips.vn.includes(data));                    }                }            },            VNDomainSettings: {                get: function () {                    return doAllItemsExist(this.settingsData.domains.vn, this.blockedDomains);                },                set: function (newValue) {                    if (newValue) {                        this.blockedDomains = [...this.blockedDomains, ...this.settingsData.domains.vn];                    } else {                        this.blockedDomains = this.blockedDomains.filter(data => !this.settingsData.domains.vn.includes(data));                    }                }            },            IRIpDirectSettings: {                get: function () {                    return doAllItemsExist(this.settingsData.ips.ir, this.directIPs);                },                set: function (newValue) {                    if (newValue) {                        this.directIPs = [...this.directIPs, ...this.settingsData.ips.ir];                    } else {                        this.directIPs = this.directIPs.filter(data => !this.settingsData.ips.ir.includes(data));                    }                }            },            IRDomainDirectSettings: {                get: function () {                    return doAllItemsExist(this.settingsData.domains.ir, this.directDomains);                },                set: function (newValue) {                    if (newValue) {                        this.directDomains = [...this.directDomains, ...this.settingsData.domains.ir];                    } else {                        this.directDomains = this.directDomains.filter(data => !this.settingsData.domains.ir.includes(data));                    }                }            },            ChinaIpDirectSettings: {                get: function () {                    return doAllItemsExist(this.settingsData.ips.cn, this.directIPs);                },                set: function (newValue) {                    if (newValue) {                        this.directIPs = [...this.directIPs, ...this.settingsData.ips.cn];                    } else {                        this.directIPs = this.directIPs.filter(data => !this.settingsData.ips.cn.includes(data));                    }                }            },            ChinaDomainDirectSettings: {                get: function () {                    return doAllItemsExist(this.settingsData.domains.cn, this.directDomains);                },                set: function (newValue) {                    if (newValue) {                        this.directDomains = [...this.directDomains, ...this.settingsData.domains.cn];                    } else {                        this.directDomains = this.directDomains.filter(data => !this.settingsData.domains.cn.includes(data));                    }                }            },            RussiaIpDirectSettings: {                get: function () {                    return doAllItemsExist(this.settingsData.ips.ru, this.directIPs);                },                set: function (newValue) {                    if (newValue) {                        this.directIPs = [...this.directIPs, ...this.settingsData.ips.ru];                    } else {                        this.directIPs = this.directIPs.filter(data => !this.settingsData.ips.ru.includes(data));                    }                }            },            RussiaDomainDirectSettings: {                get: function () {                    return doAllItemsExist(this.settingsData.domains.ru, this.directDomains);                },                set: function (newValue) {                    if (newValue) {                        this.directDomains = [...this.directDomains, ...this.settingsData.domains.ru];                    } else {                        this.directDomains = this.directDomains.filter(data => !this.settingsData.domains.ru.includes(data));                    }                }            },            VNIpDirectSettings: {                get: function () {                    return doAllItemsExist(this.settingsData.ips.vn, this.directIPs);                },                set: function (newValue) {                    if (newValue) {                        this.directIPs = [...this.directIPs, ...this.settingsData.ips.vn];                    } else {                        this.directIPs = this.directIPs.filter(data => !this.settingsData.ips.vn.includes(data));                    }                }            },            VNDomainDirectSettings: {                get: function () {                    return doAllItemsExist(this.settingsData.domains.vn, this.directDomains);                },                set: function (newValue) {                    if (newValue) {                        this.directDomains = [...this.directDomains, ...this.settingsData.domains.vn];                    } else {                        this.directDomains = this.directDomains.filter(data => !this.settingsData.domains.vn.includes(data));                    }                }            },            WarpExist: {                get: function() {                    return this.templateSettings ? this.templateSettings.outbounds.findIndex((o) => o.tag == "warp")>=0  : false;                },            },            GoogleWARPSettings: {                get: function () {                    return doAllItemsExist(this.settingsData.domains.google, this.warpDomains);                },                set: function (newValue) {                    if (newValue) {                        this.warpDomains = [...this.warpDomains, ...this.settingsData.domains.google];                    } else {                        this.warpDomains = this.warpDomains.filter(data => !this.settingsData.domains.google.includes(data));                    }                },            },            OpenAIWARPSettings: {                get: function () {                    return doAllItemsExist(this.settingsData.domains.openai, this.warpDomains);                },                set: function (newValue) {                    if (newValue) {                        this.warpDomains = [...this.warpDomains, ...this.settingsData.domains.openai];                    } else {                        this.warpDomains = this.warpDomains.filter(data => !this.settingsData.domains.openai.includes(data));                    }                },            },            NetflixWARPSettings: {                get: function () {                    return doAllItemsExist(this.settingsData.domains.netflix, this.warpDomains);                },                set: function (newValue) {                    if (newValue) {                        this.warpDomains = [...this.warpDomains, ...this.settingsData.domains.netflix];                    } else {                        this.warpDomains = this.warpDomains.filter(data => !this.settingsData.domains.netflix.includes(data));                    }                },            },            MetaWARPSettings: {                get: function () {                    return doAllItemsExist(this.settingsData.domains.meta, this.warpDomains);                },                set: function (newValue) {                    if (newValue) {                        this.warpDomains = [...this.warpDomains, ...this.settingsData.domains.meta];                    } else {                        this.warpDomains = this.warpDomains.filter(data => !this.settingsData.domains.meta.includes(data));                    }                },            },            AppleWARPSettings: {                get: function () {                    return doAllItemsExist(this.settingsData.domains.apple, this.warpDomains);                },                set: function (newValue) {                    if (newValue) {                        this.warpDomains = [...this.warpDomains, ...this.settingsData.domains.apple];                    } else {                        this.warpDomains = this.warpDomains.filter(data => !this.settingsData.domains.apple.includes(data));                    }                },            },            RedditWARPSettings: {                get: function () {                    return doAllItemsExist(this.settingsData.domains.reddit, this.warpDomains);                },                set: function (newValue) {                    if (newValue) {                        this.warpDomains = [...this.warpDomains, ...this.settingsData.domains.reddit];                    } else {                        this.warpDomains = this.warpDomains.filter(data => !this.settingsData.domains.reddit.includes(data));                    }                },            },            SpotifyWARPSettings: {                get: function () {                    return doAllItemsExist(this.settingsData.domains.spotify, this.warpDomains);                },                set: function (newValue) {                    if (newValue) {                        this.warpDomains = [...this.warpDomains, ...this.settingsData.domains.spotify];                    } else {                        this.warpDomains = this.warpDomains.filter(data => !this.settingsData.domains.spotify.includes(data));                    }                },            },            enableDNS: {                get: function () {                    return this.templateSettings ? this.templateSettings.dns != null : false;                },                set: function (newValue) {                    newTemplateSettings = this.templateSettings;                    if (newValue) {                        newTemplateSettings.dns = { servers: [], queryStrategy: "UseIP", tag: "dns_inbound" };                        newTemplateSettings.fakedns = null;                     } else {                        delete newTemplateSettings.dns;                        delete newTemplateSettings.fakedns;                    }                    this.templateSettings = newTemplateSettings;                }            },            dnsTag: {                get: function () {                    return this.enableDNS ? this.templateSettings.dns.tag : "";                },                set: function (newValue) {                    newTemplateSettings = this.templateSettings;                    newTemplateSettings.dns.tag =  newValue;                    this.templateSettings = newTemplateSettings;                }            },            dnsStrategy: {                get: function () {                    return this.enableDNS ? this.templateSettings.dns.queryStrategy : null;                },                set: function (newValue) {                    newTemplateSettings = this.templateSettings;                    newTemplateSettings.dns.queryStrategy =  newValue;                    this.templateSettings = newTemplateSettings;                }            },            dnsServers: {                get: function () { return this.enableDNS ? this.templateSettings.dns.servers : []; },                set: function (newValue) {                    newTemplateSettings = this.templateSettings;                    newTemplateSettings.dns.servers =  newValue;                    this.templateSettings = newTemplateSettings;                }            },            fakeDns: {                get: function () { return this.templateSettings && this.templateSettings.fakedns ? this.templateSettings.fakedns : []; },                set: function (newValue) {                    newTemplateSettings = this.templateSettings;                    if (this.enableDNS) {                        newTemplateSettings.fakedns = newValue.length > 0 ? newValue : null;                    } else {                        delete newTemplateSettings.fakedns;                    }                    this.templateSettings = newTemplateSettings;                }            }        },    });</script></body></html>
 |