Add backend suggestions

src/views/Subconverter.vue

@@ -26,13 +26,14 @@
 
               <div v-if="advanced === '2'">
                 <el-form-item label="后端地址:">
-                  <el-input
-                    ref="backend"
+                  <el-autocomplete
+                    style="width: 100%"
                     v-model="form.customBackend"
+                    :fetch-suggestions="backendSearch"
                     placeholder="动动小手，（建议）自行搭建后端服务。例：http://127.0.0.1:25500/sub?"
                   >
                     <el-button slot="append" @click="gotoGayhub" icon="el-icon-link">前往项目仓库</el-button>
-                  </el-input>
+                  </el-autocomplete>
                 </el-form-item>
                 <el-form-item label="远程配置:">
                   <el-select
@@ -233,6 +234,9 @@ export default {
           ssr: "ssr",
           ssd: "ssd"
         },
+        backendOptions: [
+          { value: "http://127.0.0.1:25500/sub?" }
+        ],
         remoteConfig: [
           {
             label: "universal",
@@ -396,14 +400,6 @@ export default {
     gotoRemoteConfig() {
       window.open(remoteConfigSample);
     },
-    createFilter(queryString) {
-      return restaurant => {
-        return (
-          restaurant.value.toLowerCase().indexOf(queryString.toLowerCase()) ===
-          0
-        );
-      };
-    },
     clashInstall() {
       if (this.customSubUrl === "") {
         this.$message.error("请先填写必填项，生成订阅链接");
@@ -558,6 +554,23 @@ export default {
         .finally(() => {
           this.loading = false;
         });
+    },
+    backendSearch(queryString, cb) {
+      let backends = this.options.backendOptions;
+
+      let results = queryString
+        ? backends.filter(this.createFilter(queryString))
+        : backends;
+
+      // 调用 callback 返回建议列表的数据
+      cb(results);
+    },
+    createFilter(queryString) {
+      return candidate => {
+        return (
+          candidate.value.toLowerCase().indexOf(queryString.toLowerCase()) === 0
+        );
+      };
     }
   }
 };