optimize: 恢复出厂设置功能优化：1）备份文件的同时，创建一个空的原配置文件；2）恢复出厂前，提示如何找回个性化配置。 (#341)

packages/core/src/config.js

@@ -274,23 +274,26 @@ const configApi = {
     const configPath = _getConfigPath()
     if (fs.existsSync(configPath)) {
       // 读取 config.json 文件内容
-      const fileStr = fs.readFileSync(configPath).toString().replace(/\s/g, '')
+      const fileOriginalStr = fs.readFileSync(configPath).toString()
 
       // 判断文件内容是否为空或空配置
-      if (fileStr === '' || fileStr === '{}') {
+      const fileStr = fileOriginalStr.replace(/\s/g, '')
-        fs.rmSync(configPath)
+      if (fileStr.length < 5) {
+        fs.writeFileSync(configPath, '{}')
         return false // config.json 内容为空，或为空json
       }
 
       // 备份用户自定义配置文件
-      fs.renameSync(configPath, configPath + '.bak' + new Date().getTime() + '.json')
+      fs.writeFileSync(`${configPath}.${Date.now()}.bak.json`, fileOriginalStr)
+      // 原配置文件内容设为空
+      fs.writeFileSync(configPath, '{}')
 
       // 重新加载配置
       configApi.load(null)
 
       return true // 删除并重新加载配置成功
     } else {
-      return false // config.json 文件不存在或内容为配置
+      return false // config.json 文件不存在
     }
   },
   resetDefault (key) {

packages/gui/src/bridge/update/front.js

@@ -144,7 +144,7 @@ function install (app, api) {
       title: '发现新版本：v' + value.version,
       cancelText: '暂不升级',
       okText: '升级',
-      width: 650,
+      width: 700,
       content: h => {
         if (value.releaseNotes) {
           const notes = []
@@ -152,7 +152,7 @@ function install (app, api) {
             const releaseNotes = value.releaseNotes.replace(/\r\n/g, '\n')
             return <div>
               <div>发布公告：<a onClick={openGithubUrl}>https://github.com/docmirror/dev-sidecar/releases</a></div>
-              <div>更新内容：</div>
+              <hr/>
               <pre style="max-height:350px;font-family:auto">
                 {releaseNotes}
               </pre>
@@ -186,7 +186,7 @@ function install (app, api) {
       title: `新版本(v${value.version})已准备好，是否立即升级?`,
       cancelText: '暂不升级',
       okText: '立即升级',
-      width: 550,
+      width: 700,
       content: h => {
         if (value.releaseNotes) {
           const notes = []
@@ -194,7 +194,7 @@ function install (app, api) {
             const releaseNotes = value.releaseNotes.replace(/\r\n/g, '\n')
             return <div>
               <div>发布公告：<a onClick={openGithubUrl}>https://github.com/docmirror/dev-sidecar/releases</a></div>
-              <div>更新内容：</div>
+              <hr/>
               <pre style="max-height:350px;font-family:auto">
                 {releaseNotes}
               </pre>

packages/gui/src/view/pages/setting.vue

@@ -24,6 +24,7 @@
           修改后需要重启应用
         </div>
       </a-form-item>
+      <hr/>
       <a-form-item label="远程配置" :label-col="labelCol" :wrapper-col="wrapperCol">
         <a-checkbox v-model="config.app.remoteConfig.enabled" @change="onRemoteConfigEnabledChange">
           启用远程配置
@@ -47,6 +48,7 @@
           如果重载远程配置后发现下载的还是修改前的内容，请稍等片刻再重试。
         </div>
       </a-form-item>
+      <hr/>
       <a-form-item label="主题设置" :label-col="labelCol" :wrapper-col="wrapperCol">
         <a-radio-group v-model="config.app.theme" default-value="light" button-style="solid">
           <a-radio-button :value="'light'" title="light">
@@ -86,6 +88,7 @@
           点击窗口右上角关闭按钮的效果
         </div>
       </a-form-item>
+      <hr/>
       <a-form-item label="自动检查更新" :label-col="labelCol" :wrapper-col="wrapperCol">
         <a-radio-group v-model="config.app.autoChecked" default-value="light" button-style="solid">
           <a-radio-button :value="true">
@@ -216,8 +219,26 @@ export default {
     },
     async restoreFactorySettings () {
       this.$confirm({
-        title: '提示',
+        title: '确定要恢复出厂设置吗？',
-        content: '确定要恢复出厂设置吗？？？？？？？？？？？？——————————————————————警告：该功能将删除您的所有页面的个性化配置，并重载默认配置及远程配置（如果启用了的话），请谨慎操作！！！',
+        width: 540,
+        content: h =>
+          <div class="restore-factory-settings">
+            <hr/>
+            <p>
+              <h3>操作警告：</h3>
+              <div>
+                该功能将备份您的所有页面的个性化配置，并重载<span>默认配置</span>及<span>远程配置</span>，请谨慎操作！！！
+              </div>
+            </p>
+            <hr/>
+            <p>
+              <h3>找回个性化配置方法：</h3>
+              <div>
+                备份文件路径：<span>~/.dev-sidecar/config.json.时间戳.bak.json</span><br/>
+                将该备份文件重命名为<span>config.json</span>，再重启软件即可恢复配置。
+              </div>
+            </p>
+          </div>,
         cancelText: '取消',
         okText: '确定',
         onOk: async () => {
@@ -225,10 +246,10 @@ export default {
           const result = await this.$api.config.removeUserConfig()
           if (result) {
             this.config = await this.$api.config.get()
-            this.$message.success('恢复出厂配置成功，开始重启代理服务和系统代理')
+            this.$message.success('恢复出厂设置成功，开始重启代理服务和系统代理')
             await this.reloadConfigAndRestart()
           } else {
-            this.$message.info('已是出厂配置，无需恢复')
+            this.$message.info('已是出厂设置，无需恢复')
           }
           this.removeUserConfigLoading = false
         },

packages/gui/src/view/style/index.scss

@@ -64,3 +64,24 @@ ol{
 .ant-radio-button-wrapper {
   margin-bottom: 3px;
 }
+
+hr {
+  border-width: 1px 0 0 0;
+  margin: 10px 0
+}
+
+.ant-modal-content {
+  background-color: #fbfbfb;
+}
+
+.restore-factory-settings {
+  div {
+    padding-left: 1em;
+  }
+  span {
+    display: inline-block;
+    background-color: #eee;
+    padding: 2px 5px;
+    margin: 0 5px 5px 5px;
+  }
+}