节点预览可以预览原始订阅的节点了

web/src/assets/css/app.scss

@@ -1024,22 +1024,6 @@ html, body {
   }
 }
 
-.v-tabs-bar {
-  .v-slide-group__wrapper {
-    overflow: visible;
-    display: -webkit-inline-box;
-    contain: inherit;
-
-    .v-slide-group__content {
-      z-index: 2;
-    }
-  }
-
-  .v-tab:not(:first-child) {
-    margin-left: 5px;
-  }
-}
-
 .v-expansion-panel {
   &:before {
     -webkit-box-shadow: none;
@@ -1503,4 +1487,10 @@ html, body {
   .v-slide-group__wrapper {
     contain: none;
   }
+}
+
+.v-dialog > .v-card > .v-toolbar {
+  position: sticky;
+  top: 0;
+  z-index: 999;
 }

web/src/components/ProxyList.vue

@@ -89,7 +89,7 @@ const flags = new Map([["AC", "🇦🇨"], ["AF", "🇦🇫"], ["AI", "🇦🇮"
 
 export default {
   name: "ProxyList",
-  props: ['url', 'sub'],
+  props: ['url', 'sub', 'raw'],
   components: {VueQRCodeComponent},
   data: function () {
     return {
@@ -114,7 +114,7 @@ export default {
     },
 
     async fetch() {
-      await axios.get(this.url).then(resp => {
+      await axios.get(this.raw ? `${this.url}?raw=true` : this.url).then(resp => {
         let {data} = resp;
         // eslint-disable-next-line no-debugger
         this.proxies = data;
@@ -122,7 +122,7 @@ export default {
         this.$store.commit("SET_ERROR_MESSAGE", err);
       });
 
-      await axios.get(`${this.url}?target=URI`).then(resp => {
+      await axios.get(this.raw ? `${this.url}?target=URI&raw=true` : `${this.url}?target=URI`).then(resp => {
         const {data} = resp;
         this.uris = data.split("\n");
       });

web/src/views/Subscription.vue

@@ -118,27 +118,54 @@
       </v-card-text>
     </v-card>
     <v-dialog fullscreen hide-overlay transition="dialog-bottom-transition" v-model="showProxyList" scrollable>
-      <v-card>
-        <v-card-title class="pa-0">
-          <v-toolbar>
-            <v-icon>mdi-cloud</v-icon>
-            <v-spacer></v-spacer>
-            <v-toolbar-title class="flex text-xs-center">
-              <h4>节点列表</h4>
-            </v-toolbar-title>
-            <v-spacer></v-spacer>
-            <v-toolbar-items>
-              <v-btn icon @click="refreshProxyList" v-if="sub">
-                <v-icon>refresh</v-icon>
-              </v-btn>
-              <v-btn icon @click="showProxyList = false">
-                <v-icon>mdi-close</v-icon>
-              </v-btn>
-            </v-toolbar-items>
-          </v-toolbar>
-        </v-card-title>
-        <v-card-text class="pl-0 pr-0">
-          <proxy-list :url="url" :sub="sub" ref="proxyList" :key="url"></proxy-list>
+      <v-card fluid>
+        <v-toolbar>
+          <v-icon>mdi-cloud</v-icon>
+          <v-spacer></v-spacer>
+          <v-toolbar-title>
+            <h4>节点列表</h4>
+          </v-toolbar-title>
+          <v-spacer></v-spacer>
+          <v-toolbar-items>
+            <v-btn icon @click="showProxyList = false">
+              <v-icon>mdi-close</v-icon>
+            </v-btn>
+          </v-toolbar-items>
+          <template v-slot:extension>
+            <v-tabs
+                grow
+                centered
+                v-model="tab"
+            >
+              <v-tabs-slider color="primary"/>
+              <v-tab
+                  key="raw"
+              >
+                原始节点
+              </v-tab>
+              <v-tab
+                  key="processed"
+              >
+                生成节点
+              </v-tab>
+            </v-tabs>
+          </template>
+        </v-toolbar>
+        <v-card-text>
+          <v-tabs-items
+              v-model="tab"
+          >
+            <v-tab-item key="raw">
+              <v-card-text class="pl-0 pr-0">
+                <proxy-list :url="url" :sub="sub" :raw="true" ref="proxyList" :key="url + 'raw'"></proxy-list>
+              </v-card-text>
+            </v-tab-item>
+            <v-tab-item key="processed">
+              <v-card-text class="pl-0 pr-0">
+                <proxy-list :url="url" :sub="sub" ref="proxyList" :key="url"></proxy-list>
+              </v-card-text>
+            </v-tab-item>
+          </v-tabs-items>
         </v-card-text>
       </v-card>
     </v-dialog>
@@ -157,6 +184,7 @@ export default {
       showProxyList: false,
       url: "",
       sub: [],
+      tab: 1,
       editMenu: [
         {
           title: "复制",
@@ -187,11 +215,11 @@ export default {
       return BACKEND_BASE;
     },
     subscriptions: {
-      get(){
+      get() {
         const subs = this.$store.state.subscriptions;
         return Object.keys(subs).map(k => subs[k]);
       },
-      set(){
+      set() {
 
       }
     },
@@ -272,4 +300,10 @@ export default {
 .invert {
   filter: invert(100%);
 }
+
+.v-dialog > .v-card > .v-toolbar {
+  position: sticky;
+  top: 0;
+  z-index: 999;
+}
 </style>