Merge pull request #175 from VMatrices/master

Support for adding customized conversion parameters

.env

@@ -6,6 +6,8 @@ VUE_APP_BACKEND_RELEASE = "https://github.com/tindy2013/subconverter/actions"
 
 VUE_APP_SUBCONVERTER_REMOTE_CONFIG = "https://raw.githubusercontent.com/tindy2013/subconverter/master/base/config/example_external_config.ini"
 
+VUE_APP_SUBCONVERTER_DOC_ADVANCED = "https://github.com/tindy2013/subconverter/blob/master/README-cn.md#%E8%BF%9B%E9%98%B6%E9%93%BE%E6%8E%A5"
+
 # API 后端
 VUE_APP_SUBCONVERTER_DEFAULT_BACKEND = "https://api.wcc.best"
 

src/views/Subconverter.vue

@@ -10,7 +10,7 @@
             <div style="display: inline-block; position:absolute; right: 20px">{{ backendVersion }}</div>
           </div>
           <el-container>
-            <el-form :model="form" label-width="80px" label-position="left" style="width: 100%">
+            <el-form :model="form" label-width="140px" label-position="left" style="width: 100%">
               <el-form-item label="模式设置:">
                 <el-radio v-model="advanced" label="1">基础模式</el-radio>
                 <el-radio v-model="advanced" label="2">进阶模式</el-radio>
@@ -50,6 +50,16 @@
                 <el-form-item label="FileName:">
                   <el-input v-model="form.filename" placeholder="返回的订阅文件名" />
                 </el-form-item>
+
+                <el-form-item v-for="(param, i) in customParams" :key="i">
+                  <el-input slot="label" v-model="param.name" placeholder="自定义参数名">
+                    <div slot="suffix" style="width: 10px;">:</div>
+                  </el-input>
+                  <el-input v-model="param.value" placeholder="自定义参数内容">
+                      <el-button slot="suffix" type="text" icon="el-icon-delete" style="margin-right: 5px" @click="customParams.splice(i, 1)"/>
+                  </el-input>
+                </el-form-item>
+
                 <el-form-item label-width="0px">
                   <el-row type="flex">
                     <el-col>
@@ -91,6 +101,12 @@
                       </el-row>
                       <el-button slot="reference">定制功能</el-button>
                     </el-popover>
+                    <el-popover placement="top-end" title="添加自定义转换参数" trigger="hover">
+                      <el-link type="primary" :href="subDocAdvanced" target="_blank" icon="el-icon-info">参考文档</el-link>
+                      <el-button slot="reference" @click="addCustomParam" style="margin-left: 10px">
+                        <i class="el-icon-plus"></i>
+                      </el-button>
+                    </el-popover>
                   </el-row>
                 </el-form-item>
               </div>
@@ -181,6 +197,7 @@
 <script>
 const project = process.env.VUE_APP_PROJECT
 const remoteConfigSample = process.env.VUE_APP_SUBCONVERTER_REMOTE_CONFIG
+const subDocAdvanced = process.env.VUE_APP_SUBCONVERTER_DOC_ADVANCED
 const gayhubRelease = process.env.VUE_APP_BACKEND_RELEASE
 const defaultBackend = process.env.VUE_APP_SUBCONVERTER_DEFAULT_BACKEND + '/sub?'
 const shortUrlBackend = process.env.VUE_APP_MYURLS_API
@@ -321,6 +338,8 @@ export default {
         }
       },
 
+      customParams: [],
+
       loading: false,
       customSubUrl: "",
       curtomShortSubUrl: "",
@@ -332,6 +351,7 @@ export default {
       uploadPassword: "",
       myBot: tgBotLink,
       sampleConfig: remoteConfigSample,
+      subDocAdvanced: subDocAdvanced,
 
       needUdp: false, // 是否需要添加 udp 参数
     };
@@ -388,6 +408,12 @@ export default {
       const url = "surge://install-config?url=";
       window.open(url + this.customSubUrl);
     },
+    addCustomParam(){
+      this.customParams.push({
+        name: "",
+        value: "",
+      })
+    },
     makeUrl() {
       if (this.form.sourceSubUrl === "" || this.form.clientType === "") {
         this.$message.error("订阅链接与客户端为必填项");
@@ -464,6 +490,10 @@ export default {
 
           this.customSubUrl += "&new_name=" + this.form.new_name.toString();
         }
+
+        this.customParams.filter(param => param.name && param.value).forEach(param => {
+          this.customSubUrl += `&${encodeURIComponent(param.name)}=${encodeURIComponent(param.value)}`
+        })
       }
 
       this.$copyText(this.customSubUrl);
@@ -605,6 +635,14 @@ export default {
           // Parse the URL parameters
           const params = new URLSearchParams(url.search);
 
+          // Record parameters have been read
+          const getParam = params.get.bind(params)
+          const excludeParams = new Set()
+          params.get = key => {
+            excludeParams.add(key)
+            return getParam(key)
+          }
+
           // Get the 'target' parameter
           const target = params.get("target");
 
@@ -617,7 +655,7 @@ export default {
           }
 
           // Set other form properties based on the URL parameters
-          this.form.sourceSubUrl = params.get("url");
+          this.form.sourceSubUrl = params.get("url").replace(/\|/g, "\n");
           this.form.insert = params.get("insert") === "true";
           this.form.remoteConfig = params.get("config");
           this.form.excludeRemarks = params.get("exclude");
@@ -631,10 +669,18 @@ export default {
           this.form.fdn = params.get("fdn") === "true";
           this.form.sort = params.get("sort") === "true";
           this.form.udp = params.get("udp") === "true";
+          this.form.expand = params.get("expand") === "true";
           this.form.tpl.surge.doh = params.get("surge.doh") === "true";
           this.form.tpl.clash.doh = params.get("clash.doh") === "true";
           this.form.new_name = params.get("new_name") === "true";
 
+          // Filter custom parameters
+          this.customParams = Array.from(params
+            .entries()
+            .filter(e => !excludeParams.has(e[0]))
+            .map(e => ({ name: e[0], value: e[1] }))
+          )
+
           // Hide the configuration dialog
           this.dialogLoadConfigVisible = false;