routing.html 6.4 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119
  1. {{define "settings/xray/routing"}}
  2. <a-space direction="vertical" size="middle">
  3. <a-button type="primary" icon="plus" @click="addRule">{{ i18n "pages.xray.rules.add" }}</a-button>
  4. <a-table-sortable :columns="isMobile ? rulesMobileColumns : rulesColumns" bordered :row-key="r => r.key"
  5. :data-source="routingRuleData" :scroll="isMobile ? {} : { x: 1000 }" :pagination="false" :indent-size="0"
  6. v-on:onSort="replaceRule">
  7. <template slot="action" slot-scope="text, rule, index">
  8. <a-table-sort-trigger :item-index="index"></a-table-sort-trigger>
  9. <span class="ant-table-row-index"> [[ index+1 ]] </span>
  10. <a-dropdown :trigger="['click']">
  11. <a-icon @click="e => e.preventDefault()" type="more"
  12. :style="{ fontSize: '16px', textDecoration: 'bold' }"></a-icon>
  13. <a-menu slot="overlay" :theme="themeSwitcher.currentTheme">
  14. <a-menu-item v-if="index>0" @click="replaceRule(index,0)">
  15. <a-icon type="vertical-align-top"></a-icon>
  16. {{ i18n "pages.xray.rules.first"}}
  17. </a-menu-item>
  18. <a-menu-item v-if="index>0" @click="replaceRule(index,index-1)">
  19. <a-icon type="arrow-up"></a-icon>
  20. {{ i18n "pages.xray.rules.up"}}
  21. </a-menu-item>
  22. <a-menu-item v-if="index<routingRuleData.length-1" @click="replaceRule(index,index+1)">
  23. <a-icon type="arrow-down"></a-icon>
  24. {{ i18n "pages.xray.rules.down"}}
  25. </a-menu-item>
  26. <a-menu-item v-if="index<routingRuleData.length-1"
  27. @click="replaceRule(index,routingRuleData.length-1)">
  28. <a-icon type="vertical-align-bottom"></a-icon>
  29. {{ i18n "pages.xray.rules.last"}}
  30. </a-menu-item>
  31. <a-menu-item @click="editRule(index)">
  32. <a-icon type="edit"></a-icon>
  33. {{ i18n "edit" }}
  34. </a-menu-item>
  35. <a-menu-item @click="deleteRule(index)">
  36. <span :style="{ color: '#FF4D4F' }">
  37. <a-icon type="delete"></a-icon> {{ i18n "delete"}}
  38. </span>
  39. </a-menu-item>
  40. </a-menu>
  41. </a-dropdown>
  42. </template>
  43. <template slot="inbound" slot-scope="text, rule, index">
  44. <a-popover :overlay-class-name="themeSwitcher.currentTheme">
  45. <template slot="content">
  46. <p v-if="rule.inboundTag">Inbound Tag: [[ rule.inboundTag ]]</p>
  47. <p v-if="rule.user">User email: [[ rule.user ]]</p>
  48. </template>
  49. [[ [rule.inboundTag,rule.user].join('\n') ]]
  50. </a-popover>
  51. </template>
  52. <template slot="outbound" slot-scope="text, rule, index">
  53. <a-popover :overlay-class-name="themeSwitcher.currentTheme">
  54. <template slot="content">
  55. <p v-if="rule.outboundTag">Outbound Tag: [[ rule.outboundTag ]]</p>
  56. </template>
  57. [[ rule.outboundTag ]]
  58. </a-popover>
  59. </template>
  60. <template slot="balancer" slot-scope="text, rule, index">
  61. <a-popover :overlay-class-name="themeSwitcher.currentTheme">
  62. <template slot="content">
  63. <p v-if="rule.balancerTag">Balancer Tag: [[ rule.balancerTag ]]</p>
  64. </template>
  65. [[ rule.balancerTag ]]
  66. </a-popover>
  67. </template>
  68. <template slot="info" slot-scope="text, rule, index">
  69. <a-popover placement="bottomRight"
  70. v-if="(rule.source+rule.sourcePort+rule.network+rule.protocol+rule.attrs+rule.ip+rule.domain+rule.port).length>0"
  71. :overlay-class-name="themeSwitcher.currentTheme" trigger="click">
  72. <template slot="content">
  73. <table cellpadding="2" :style="{ maxWidth: '300px' }">
  74. <tr v-if="rule.source">
  75. <td>Source</td>
  76. <td><a-tag color="blue" v-for="r in rule.source.split(',')">[[ r ]]</a-tag></td>
  77. </tr>
  78. <tr v-if="rule.sourcePort">
  79. <td>Source Port</td>
  80. <td><a-tag color="green" v-for="r in rule.sourcePort.split(',')">[[ r ]]</a-tag></td>
  81. </tr>
  82. <tr v-if="rule.network">
  83. <td>Network</td>
  84. <td><a-tag color="blue" v-for="r in rule.network.split(',')">[[ r ]]</a-tag></td>
  85. </tr>
  86. <tr v-if="rule.protocol">
  87. <td>Protocol</td>
  88. <td><a-tag color="green" v-for="r in rule.protocol.split(',')">[[ r ]]</a-tag></td>
  89. </tr>
  90. <tr v-if="rule.attrs">
  91. <td>Attrs</td>
  92. <td><a-tag color="blue" v-for="r in rule.attrs.split(',')">[[ r ]]</a-tag></td>
  93. </tr>
  94. <tr v-if="rule.ip">
  95. <td>IP</td>
  96. <td><a-tag color="green" v-for="r in rule.ip.split(',')">[[ r ]]</a-tag></td>
  97. </tr>
  98. <tr v-if="rule.domain">
  99. <td>Domain</td>
  100. <td><a-tag color="blue" v-for="r in rule.domain.split(',')">[[ r ]]</a-tag></td>
  101. </tr>
  102. <tr v-if="rule.port">
  103. <td>Port</td>
  104. <td><a-tag color="green" v-for="r in rule.port.split(',')">[[ r ]]</a-tag></td>
  105. </tr>
  106. <tr v-if="rule.balancerTag">
  107. <td>Balancer Tag</td>
  108. <td><a-tag color="blue">[[ rule.balancerTag ]]</a-tag></td>
  109. </tr>
  110. </table>
  111. </template>
  112. <a-button shape="round" size="small" :style="{ fontSize: '14px', padding: '0 10px' }">
  113. <a-icon type="info"></a-icon>
  114. </a-button>
  115. </a-popover>
  116. </template>
  117. </a-table-sortable>
  118. </a-space>
  119. {{end}}