From 4ace8a5322c3d16411ec88cb9d5bfef2fc8ac19c Mon Sep 17 00:00:00 2001
From: xiaojunnuo <xiaojunnuo@qq.com>
Date: Fri, 26 Mar 2021 00:58:46 +0800
Subject: [PATCH] refactor: mode

---
 packages/core/src/config/index.js             |   4 +
 packages/gui/src/view/pages/index.vue         | 103 ++++++++++++------
 packages/gui/src/view/pages/server.vue        |  15 ++-
 .../src/lib/proxy/mitmproxy/index.js          |   2 +-
 .../mitmproxy/src/lib/speed/SpeedTester.js    |   2 +-
 packages/mitmproxy/src/lib/speed/index.js     |   9 +-
 6 files changed, 85 insertions(+), 50 deletions(-)

diff --git a/packages/core/src/config/index.js b/packages/core/src/config/index.js
index 005baa9..5d7ef7a 100644
--- a/packages/core/src/config/index.js
+++ b/packages/core/src/config/index.js
@@ -10,6 +10,9 @@ function getRootCaKeyPath () {
   return getUserBasePath() + '/dev-sidecar.ca.key.pem'
 }
 module.exports = {
+  app: {
+    mode: 'default'
+  },
   server: {
     enabled: true,
     port: 1181,
@@ -199,6 +202,7 @@ module.exports = {
       },
       speedTest: {
         enabled: true,
+        interval: 60000,
         hostnameList: ['github.com'],
         dnsProviders: ['usa', 'quad9', 'rubyfish']
       }
diff --git a/packages/gui/src/view/pages/index.vue b/packages/gui/src/view/pages/index.vue
index 68843b5..8ed514e 100644
--- a/packages/gui/src/view/pages/index.vue
+++ b/packages/gui/src/view/pages/index.vue
@@ -17,50 +17,65 @@
       </span>
     </template>
 
-    <div v-if="status" style="margin-top:50px;display: flex; align-items:center;justify-content:space-around;flex-direction: row">
-      <div style="text-align: center">
-        <div class="big_button">
-          <a-button shape="circle" :type="startup.type()" :loading="startup.loading" @click="startup.doClick">
-            <img v-if="!startup.loading && !status.server.enabled" width="50" src="/logo/logo-simple.svg">
-            <img v-if="!startup.loading && status.server.enabled" width="50" src="/logo/logo-fff.svg">
-          </a-button>
-          <div style="margin-top: 10px">{{ status.server.enabled ? '已开启' : '已关闭' }}</div>
-
-        </div>
+    <div class="box">
+      <div class="mode-bar" style="margin:20px;" v-if="config && config.app">
+        <a-radio-group   v-model="config.app.mode"  button-style="solid" @change="modeChange">
+          <a-radio-button value="default">
+            默认模式
+          </a-radio-button>
+          <a-radio-button value="ow">
+            增强模式
+          </a-radio-button>
+        </a-radio-group>
       </div>
-      <div :span="12">
-        <a-form style="margin-top:20px" :label-col="{ span: 12 }" :wrapper-col="{ span: 12 }">
 
-          <a-form-item v-for=" (item, key) in switchBtns" :key="key" :label="item.label">
-            <a-switch style="margin-left:10px" :loading="item.loading" :checked="item.status()" default-checked @change="item.doClick">
-              <a-icon slot="checkedChildren" type="check"/>
-              <a-icon slot="unCheckedChildren" type="close"/>
-            </a-switch>
-          </a-form-item>
-        </a-form>
+      <div v-if="status" style="margin-top:20px;display: flex; align-items:center;justify-content:space-around;flex-direction: row">
+
+        <div style="text-align: center">
+          <div class="big_button">
+            <a-button shape="circle" :type="startup.type()" :loading="startup.loading" @click="startup.doClick">
+              <img v-if="!startup.loading && !status.server.enabled" width="50" src="/logo/logo-simple.svg">
+              <img v-if="!startup.loading && status.server.enabled" width="50" src="/logo/logo-fff.svg">
+            </a-button>
+            <div class="mt10">{{ status.server.enabled ? '已开启' : '已关闭' }}</div>
+
+          </div>
+        </div>
+        <div :span="12">
+          <a-form style="margin-top:20px" :label-col="{ span: 12 }" :wrapper-col="{ span: 12 }">
+
+            <a-form-item v-for=" (item, key) in switchBtns" :key="key" :label="item.label">
+              <a-switch style="margin-left:10px" :loading="item.loading" :checked="item.status()" default-checked @change="item.doClick">
+                <a-icon slot="checkedChildren" type="check"/>
+                <a-icon slot="unCheckedChildren" type="close"/>
+              </a-switch>
+            </a-form-item>
+          </a-form>
+        </div>
       </div>
 
     </div>
-    <setup-ca title="安装证书" :visible.sync="setupCa.visible" @setup="handleCaSetuped"></setup-ca>
-    <div slot="footer">
-      <div class="star" style="padding:10px;">
+      <setup-ca title="安装证书" :visible.sync="setupCa.visible" @setup="handleCaSetuped"></setup-ca>
+      <div slot="footer">
+        <div class="star" style="padding:10px;">
 
-        <div class="donate" @click="donateModal=true"> <a-icon  type="like" theme="outlined" /> 捐赠</div>
-        <div class="right">
-          <div>如果它解决了你的问题，请不要吝啬你的star哟！ <a-icon style="margin-right:10px;" type="smile" theme="outlined" /></div>
-          <a @click="openExternal('https://gitee.com/docmirror/dev-sidecar')"><img src='https://gitee.com/docmirror/dev-sidecar/badge/star.svg?theme=dark' alt='star'/></a>
-          <a @click="openExternal('https://github.com/docmirror/dev-sidecar')"><img alt="GitHub stars" src="https://img.shields.io/github/stars/docmirror/dev-sidecar?logo=github"></a>
+          <div class="donate" @click="donateModal=true"> <a-icon  type="like" theme="outlined" /> 捐赠</div>
+          <div class="right">
+            <div>如果它解决了你的问题，请不要吝啬你的star哟！ <a-icon style="margin-right:10px;" type="smile" theme="outlined" /></div>
+            <a @click="openExternal('https://gitee.com/docmirror/dev-sidecar')"><img src='https://gitee.com/docmirror/dev-sidecar/badge/star.svg?theme=dark' alt='star'/></a>
+            <a @click="openExternal('https://github.com/docmirror/dev-sidecar')"><img alt="GitHub stars" src="https://img.shields.io/github/stars/docmirror/dev-sidecar?logo=github"></a>
+          </div>
         </div>
-       </div>
 
-      <a-modal title="捐赠" v-model="donateModal" width="550px" cancelText="不了" okText="支持一下" @ok="goDonate">
+        <a-modal title="捐赠" v-model="donateModal" width="550px" cancelText="不了" okText="支持一下" @ok="goDonate">
           <div>* 随着越来越多用户来使用，我的1m带宽的小服务器已经满负荷运转了。</div>
           <div>* 请大家不要看油管视频，把带宽留给想要访问github的同学，致敬爱学习的你。</div>
-        <div class="payQrcode">
-          <img height="200px" src="/pay.jpg"/>
-        </div>
-      </a-modal>
-    </div>
+          <div class="payQrcode">
+            <img height="200px" src="/pay.jpg"/>
+          </div>
+        </a-modal>
+      </div>
+
   </ds-container>
 
 </template>
@@ -137,6 +152,21 @@ export default {
     console.log('index mounted')
   },
   methods: {
+    modeChange (mode) {
+      if (mode === 'ow') {
+        this.config.server.dns.speedTest.enabled = false
+        this.config.plugins.overwall.enabled = true
+      } else if (mode === 'default') {
+        this.config.server.dns.speedTest.enabled = false
+        this.config.plugins.overwall.enabled = true
+      }
+      this.$api.config.save(this.config).then(() => {
+        this.$message.info('设置已保存')
+      })
+      if (this.status.server.enabled) {
+        return this.$api.server.restart()
+      }
+    },
     doCheckRootCa () {
       this.$api.setting.load().then(setting => {
         console.log('setting', setting)
@@ -254,7 +284,10 @@ export default {
 </script>
 <style lang="scss">
 .page_index {
-
+  .mode-bar{
+    margin:30px;
+    text-align: center;
+  }
   .star {
     display: flex;
     flex-direction: row;
diff --git a/packages/gui/src/view/pages/server.vue b/packages/gui/src/view/pages/server.vue
index 4dc8f6c..352cdac 100644
--- a/packages/gui/src/view/pages/server.vue
+++ b/packages/gui/src/view/pages/server.vue
@@ -83,7 +83,7 @@
 
           </div>
         </a-tab-pane>
-        <a-tab-pane tab="DNS测速设置" key="4">
+        <a-tab-pane tab="IP测速" key="4">
           <div>
             <a-alert type="info" message="对从dns获取到的ip进行测速，使用速度最快的ip进行访问。（对使用增强功能的域名没啥用）"></a-alert>
             <a-form-item label="开启dns测速" :label-col="labelCol" :wrapper-col="wrapperCol">
@@ -91,6 +91,9 @@
                 启用
               </a-checkbox>
             </a-form-item>
+            <a-form-item label="自动测试间隔" :label-col="labelCol" :wrapper-col="wrapperCol">
+              <a-input-number id="inputNumber" v-model="getSpeedTestConfig().interval" :step="1000" :min="1" />
+            </a-form-item>
             <div>使用以下dns获取ip进行测速</div>
             <a-row style="margin-top:10px">
               <a-col span="24">
@@ -117,15 +120,11 @@
               </a-col>
             </a-row>
 
-          </div>
-        </a-tab-pane>
-        <a-tab-pane tab="DNS测速详情" key="5">
-          <div>
-            <div>对获取到的ip进行测速</div>
+            <a-divider />
             <a-row :gutter="10" class="mt10">
               <a-col span="24">
-                <a-button  type="primary" icon="plus" @click="reSpeedTest()" >重新测速</a-button>
-                <a-button class="md-ml-10" type="primary" icon="refresh" @click="reloadAllSpeedTester()" >刷新</a-button>
+                <a-button  type="primary" icon="plus" @click="reSpeedTest()" >立即重新测速</a-button>
+                <a-button class="md-ml-10" type="primary" icon="reload" @click="reloadAllSpeedTester()" >刷新</a-button>
               </a-col>
             </a-row>
 
diff --git a/packages/mitmproxy/src/lib/proxy/mitmproxy/index.js b/packages/mitmproxy/src/lib/proxy/mitmproxy/index.js
index f0257d4..0edb114 100644
--- a/packages/mitmproxy/src/lib/proxy/mitmproxy/index.js
+++ b/packages/mitmproxy/src/lib/proxy/mitmproxy/index.js
@@ -70,7 +70,7 @@ module.exports = {
           map[dnsProvider] = dnsMap[dnsProvider]
         }
       }
-      speedTest.initSpeedTest({ enabled: speedTestConfig.enabled, hostnameList: speedTestConfig.hostnameList, dnsMap: map })
+      speedTest.initSpeedTest({ ...speedTestConfig, dnsMap: map })
     }
 
     const requestHandler = createRequestHandler(
diff --git a/packages/mitmproxy/src/lib/speed/SpeedTester.js b/packages/mitmproxy/src/lib/speed/SpeedTester.js
index 293eb22..714344c 100644
--- a/packages/mitmproxy/src/lib/speed/SpeedTester.js
+++ b/packages/mitmproxy/src/lib/speed/SpeedTester.js
@@ -51,7 +51,7 @@ class SpeedTester {
         return
       }
       this.test()
-    }, 60 * 1000)
+    }, config.getConfig().interval)
   }
 
   async getIpListFromDns (dnsMap) {
diff --git a/packages/mitmproxy/src/lib/speed/index.js b/packages/mitmproxy/src/lib/speed/index.js
index ee834b9..b263f4d 100644
--- a/packages/mitmproxy/src/lib/speed/index.js
+++ b/packages/mitmproxy/src/lib/speed/index.js
@@ -5,17 +5,16 @@ const log = require('../../utils/util.log.js')
 const SpeedTestPool = {
 
 }
-function initSpeedTest ({ enabled, hostnameList, dnsMap }) {
+function initSpeedTest (runtimeConfig) {
+  const { enabled, hostnameList } = runtimeConfig
   const conf = config.getConfig()
-  conf.enabled = enabled
-  if (!conf.enabled) {
+  _.merge(conf, runtimeConfig)
+  if (!enabled) {
     return
   }
-  conf.dnsMap = dnsMap
   _.forEach(hostnameList, (hostname) => {
     SpeedTestPool[hostname] = new SpeedTester({ hostname })
   })
-
   log.info('[speed] enabled')
 }