From 33e17ca8f359f0f672ffbddda032a86d3c9d3262 Mon Sep 17 00:00:00 2001
From: yujintao <yujintaodotcn@foxmail.com>
Date: Wed, 11 Dec 2019 14:53:19 +0800
Subject: [PATCH] =?UTF-8?q?=E6=96=87=E4=BB=B6=E4=B8=8A=E4=BC=A0=E9=85=8D?=
 =?UTF-8?q?=E7=BD=AE?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/views/modules/oss/oss-config.vue | 306 +++++++++++----------------
 1 file changed, 125 insertions(+), 181 deletions(-)

diff --git a/src/views/modules/oss/oss-config.vue b/src/views/modules/oss/oss-config.vue
index 1ea60e7b..8a74bbcc 100644
--- a/src/views/modules/oss/oss-config.vue
+++ b/src/views/modules/oss/oss-config.vue
@@ -1,18 +1,15 @@
 <template>
-  <el-dialog
-    :visible.sync="visible"
-    :title="$t('oss.config')"
-    :close-on-click-modal="false"
-    :close-on-press-escape="false"
-  >
-    <el-form
-      :model="dataForm"
-      :rules="dataRule"
-      ref="dataForm"
-      @keyup.enter.native="dataFormSubmitHandle()"
-      label-width="120px"
-    >
-      <el-form-item :label="$t('oss.type')" size="mini">
+  <el-dialog :visible.sync="visible"
+             :title="$t('oss.config')"
+             :close-on-click-modal="false"
+             :close-on-press-escape="false">
+    <el-form :model="dataForm"
+             :rules="dataRule"
+             ref="dataForm"
+             @keyup.enter.native="dataFormSubmitHandle()"
+             label-width="120px">
+      <el-form-item :label="$t('oss.type')"
+                    size="mini">
         <el-radio-group v-model="dataForm.type">
           <el-radio :label="1">{{ $t('oss.type1') }}</el-radio>
           <el-radio :label="2">{{ $t('oss.type2') }}</el-radio>
@@ -22,206 +19,153 @@
         </el-radio-group>
       </el-form-item>
       <template v-if="dataForm.type === 1">
-        <el-form-item prop="qiniuDomain" :label="$t('oss.qiniuDomain')">
-          <el-input
-            v-model="dataForm.qiniuDomain"
-            :placeholder="$t('oss.qiniuDomainTips')"
-          ></el-input>
+        <el-form-item prop="qiniuDomain"
+                      :label="$t('oss.qiniuDomain')">
+          <el-input v-model="dataForm.qiniuDomain"
+                    :placeholder="$t('oss.qiniuDomainTips')"></el-input>
         </el-form-item>
-        <el-form-item prop="qiniuPrefix" :label="$t('oss.qiniuPrefix')">
-          <el-input
-            v-model="dataForm.qiniuPrefix"
-            :placeholder="$t('oss.qiniuPrefixTips')"
-          ></el-input>
+        <el-form-item prop="qiniuPrefix"
+                      :label="$t('oss.qiniuPrefix')">
+          <el-input v-model="dataForm.qiniuPrefix"
+                    :placeholder="$t('oss.qiniuPrefixTips')"></el-input>
         </el-form-item>
-        <el-form-item prop="qiniuAccessKey" :label="$t('oss.qiniuAccessKey')">
-          <el-input
-            v-model="dataForm.qiniuAccessKey"
-            :placeholder="$t('oss.qiniuAccessKeyTips')"
-          ></el-input>
+        <el-form-item prop="qiniuAccessKey"
+                      :label="$t('oss.qiniuAccessKey')">
+          <el-input v-model="dataForm.qiniuAccessKey"
+                    :placeholder="$t('oss.qiniuAccessKeyTips')"></el-input>
         </el-form-item>
-        <el-form-item prop="qiniuSecretKey" :label="$t('oss.qiniuSecretKey')">
-          <el-input
-            v-model="dataForm.qiniuSecretKey"
-            :placeholder="$t('oss.qiniuSecretKeyTips')"
-          ></el-input>
+        <el-form-item prop="qiniuSecretKey"
+                      :label="$t('oss.qiniuSecretKey')">
+          <el-input v-model="dataForm.qiniuSecretKey"
+                    :placeholder="$t('oss.qiniuSecretKeyTips')"></el-input>
         </el-form-item>
-        <el-form-item prop="qiniuBucketName" :label="$t('oss.qiniuBucketName')">
-          <el-input
-            v-model="dataForm.qiniuBucketName"
-            :placeholder="$t('oss.qiniuBucketNameTips')"
-          ></el-input>
+        <el-form-item prop="qiniuBucketName"
+                      :label="$t('oss.qiniuBucketName')">
+          <el-input v-model="dataForm.qiniuBucketName"
+                    :placeholder="$t('oss.qiniuBucketNameTips')"></el-input>
         </el-form-item>
       </template>
       <template v-else-if="dataForm.type === 2">
-        <el-form-item prop="aliyunDomain" :label="$t('oss.aliyunDomain')">
-          <el-input
-            v-model="dataForm.aliyunDomain"
-            :placeholder="$t('oss.aliyunDomainTips')"
-          ></el-input>
+        <el-form-item prop="aliyunDomain"
+                      :label="$t('oss.aliyunDomain')">
+          <el-input v-model="dataForm.aliyunDomain"
+                    :placeholder="$t('oss.aliyunDomainTips')"></el-input>
         </el-form-item>
-        <el-form-item prop="aliyunPrefix" :label="$t('oss.aliyunPrefix')">
-          <el-input
-            v-model="dataForm.aliyunPrefix"
-            :placeholder="$t('oss.aliyunPrefixTips')"
-          ></el-input>
+        <el-form-item prop="aliyunPrefix"
+                      :label="$t('oss.aliyunPrefix')">
+          <el-input v-model="dataForm.aliyunPrefix"
+                    :placeholder="$t('oss.aliyunPrefixTips')"></el-input>
         </el-form-item>
-        <el-form-item prop="aliyunEndPoint" :label="$t('oss.aliyunEndPoint')">
-          <el-input
-            v-model="dataForm.aliyunEndPoint"
-            :placeholder="$t('oss.aliyunEndPointTips')"
-          ></el-input>
+        <el-form-item prop="aliyunEndPoint"
+                      :label="$t('oss.aliyunEndPoint')">
+          <el-input v-model="dataForm.aliyunEndPoint"
+                    :placeholder="$t('oss.aliyunEndPointTips')"></el-input>
         </el-form-item>
-        <el-form-item
-          prop="aliyunAccessKeyId"
-          :label="$t('oss.aliyunAccessKeyId')"
-        >
-          <el-input
-            v-model="dataForm.aliyunAccessKeyId"
-            :placeholder="$t('oss.aliyunAccessKeyIdTips')"
-          ></el-input>
+        <el-form-item prop="aliyunAccessKeyId"
+                      :label="$t('oss.aliyunAccessKeyId')">
+          <el-input v-model="dataForm.aliyunAccessKeyId"
+                    :placeholder="$t('oss.aliyunAccessKeyIdTips')"></el-input>
         </el-form-item>
-        <el-form-item
-          prop="aliyunAccessKeySecret"
-          :label="$t('oss.aliyunAccessKeySecret')"
-        >
-          <el-input
-            v-model="dataForm.aliyunAccessKeySecret"
-            :placeholder="$t('oss.aliyunAccessKeySecretTips')"
-          ></el-input>
+        <el-form-item prop="aliyunAccessKeySecret"
+                      :label="$t('oss.aliyunAccessKeySecret')">
+          <el-input v-model="dataForm.aliyunAccessKeySecret"
+                    :placeholder="$t('oss.aliyunAccessKeySecretTips')"></el-input>
         </el-form-item>
-        <el-form-item
-          prop="aliyunBucketName"
-          :label="$t('oss.aliyunBucketName')"
-        >
-          <el-input
-            v-model="dataForm.aliyunBucketName"
-            :placeholder="$t('oss.aliyunBucketNameTips')"
-          ></el-input>
+        <el-form-item prop="aliyunBucketName"
+                      :label="$t('oss.aliyunBucketName')">
+          <el-input v-model="dataForm.aliyunBucketName"
+                    :placeholder="$t('oss.aliyunBucketNameTips')"></el-input>
         </el-form-item>
       </template>
       <template v-else-if="dataForm.type === 3">
-        <el-form-item prop="qcloudDomain" :label="$t('oss.qcloudDomain')">
-          <el-input
-            v-model="dataForm.qcloudDomain"
-            :placeholder="$t('oss.qcloudDomainTips')"
-          ></el-input>
+        <el-form-item prop="qcloudDomain"
+                      :label="$t('oss.qcloudDomain')">
+          <el-input v-model="dataForm.qcloudDomain"
+                    :placeholder="$t('oss.qcloudDomainTips')"></el-input>
         </el-form-item>
-        <el-form-item prop="qcloudPrefix" :label="$t('oss.qcloudPrefix')">
-          <el-input
-            v-model="dataForm.qcloudPrefix"
-            :placeholder="$t('oss.qcloudPrefixTips')"
-          ></el-input>
+        <el-form-item prop="qcloudPrefix"
+                      :label="$t('oss.qcloudPrefix')">
+          <el-input v-model="dataForm.qcloudPrefix"
+                    :placeholder="$t('oss.qcloudPrefixTips')"></el-input>
         </el-form-item>
-        <el-form-item prop="qcloudAppId" :label="$t('oss.qcloudAppId')">
-          <el-input
-            v-model="dataForm.qcloudAppId"
-            :placeholder="$t('oss.qcloudAppIdTips')"
-          ></el-input>
+        <el-form-item prop="qcloudAppId"
+                      :label="$t('oss.qcloudAppId')">
+          <el-input v-model="dataForm.qcloudAppId"
+                    :placeholder="$t('oss.qcloudAppIdTips')"></el-input>
         </el-form-item>
-        <el-form-item prop="qcloudSecretId" :label="$t('oss.qcloudSecretId')">
-          <el-input
-            v-model="dataForm.qcloudSecretId"
-            :placeholder="$t('oss.qcloudSecretIdTips')"
-          ></el-input>
+        <el-form-item prop="qcloudSecretId"
+                      :label="$t('oss.qcloudSecretId')">
+          <el-input v-model="dataForm.qcloudSecretId"
+                    :placeholder="$t('oss.qcloudSecretIdTips')"></el-input>
         </el-form-item>
-        <el-form-item prop="qcloudSecretKey" :label="$t('oss.qcloudSecretKey')">
-          <el-input
-            v-model="dataForm.qcloudSecretKey"
-            :placeholder="$t('oss.qcloudSecretKeyTips')"
-          ></el-input>
+        <el-form-item prop="qcloudSecretKey"
+                      :label="$t('oss.qcloudSecretKey')">
+          <el-input v-model="dataForm.qcloudSecretKey"
+                    :placeholder="$t('oss.qcloudSecretKeyTips')"></el-input>
         </el-form-item>
-        <el-form-item
-          prop="qcloudBucketName"
-          :label="$t('oss.qcloudBucketName')"
-        >
-          <el-input
-            v-model="dataForm.qcloudBucketName"
-            :placeholder="$t('oss.qcloudBucketNameTips')"
-          ></el-input>
+        <el-form-item prop="qcloudBucketName"
+                      :label="$t('oss.qcloudBucketName')">
+          <el-input v-model="dataForm.qcloudBucketName"
+                    :placeholder="$t('oss.qcloudBucketNameTips')"></el-input>
         </el-form-item>
-        <el-form-item prop="qcloudRegion" :label="$t('oss.qcloudRegion')">
-          <el-select
-            v-model="dataForm.qcloudRegion"
-            clearable
-            :placeholder="$t('oss.qcloudRegionTips')"
-            class="w-percent-100"
-          >
-            <el-option
-              value="ap-beijing-1"
-              :label="$t('oss.qcloudRegionBeijing1')"
-            ></el-option>
-            <el-option
-              value="ap-beijing"
-              :label="$t('oss.qcloudRegionBeijing')"
-            ></el-option>
-            <el-option
-              value="ap-shanghai"
-              :label="$t('oss.qcloudRegionShanghai')"
-            ></el-option>
-            <el-option
-              value="ap-guangzhou"
-              :label="$t('oss.qcloudRegionGuangzhou')"
-            ></el-option>
-            <el-option
-              value="ap-chengdu"
-              :label="$t('oss.qcloudRegionChengdu')"
-            ></el-option>
-            <el-option
-              value="ap-chongqing"
-              :label="$t('oss.qcloudRegionChongqing')"
-            ></el-option>
-            <el-option
-              value="ap-singapore"
-              :label="$t('oss.qcloudRegionSingapore')"
-            ></el-option>
-            <el-option
-              value="ap-hongkong"
-              :label="$t('oss.qcloudRegionHongkong')"
-            ></el-option>
-            <el-option
-              value="na-toronto"
-              :label="$t('oss.qcloudRegionToronto')"
-            ></el-option>
-            <el-option
-              value="eu-frankfurt"
-              :label="$t('oss.qcloudRegionFrankfurt')"
-            ></el-option>
+        <el-form-item prop="qcloudRegion"
+                      :label="$t('oss.qcloudRegion')">
+          <el-select v-model="dataForm.qcloudRegion"
+                     clearable
+                     :placeholder="$t('oss.qcloudRegionTips')"
+                     class="w-percent-100">
+            <el-option value="ap-beijing-1"
+                       :label="$t('oss.qcloudRegionBeijing1')"></el-option>
+            <el-option value="ap-beijing"
+                       :label="$t('oss.qcloudRegionBeijing')"></el-option>
+            <el-option value="ap-shanghai"
+                       :label="$t('oss.qcloudRegionShanghai')"></el-option>
+            <el-option value="ap-guangzhou"
+                       :label="$t('oss.qcloudRegionGuangzhou')"></el-option>
+            <el-option value="ap-chengdu"
+                       :label="$t('oss.qcloudRegionChengdu')"></el-option>
+            <el-option value="ap-chongqing"
+                       :label="$t('oss.qcloudRegionChongqing')"></el-option>
+            <el-option value="ap-singapore"
+                       :label="$t('oss.qcloudRegionSingapore')"></el-option>
+            <el-option value="ap-hongkong"
+                       :label="$t('oss.qcloudRegionHongkong')"></el-option>
+            <el-option value="na-toronto"
+                       :label="$t('oss.qcloudRegionToronto')"></el-option>
+            <el-option value="eu-frankfurt"
+                       :label="$t('oss.qcloudRegionFrankfurt')"></el-option>
           </el-select>
         </el-form-item>
       </template>
       <template v-else-if="dataForm.type === 4">
-        <el-form-item prop="fastdfsDomain" :label="$t('oss.fastdfsDomain')">
-          <el-input
-            v-model="dataForm.localDomain"
-            :placeholder="$t('oss.fastdfsDomainTips')"
-          ></el-input>
+        <el-form-item prop="fastdfsDomain"
+                      :label="$t('oss.fastdfsDomain')">
+          <el-input v-model="dataForm.fastdfsDomain"
+                    :placeholder="$t('oss.fastdfsDomainTips')"></el-input>
         </el-form-item>
       </template>
       <template v-else-if="dataForm.type === 5">
-        <el-form-item prop="localDomain" :label="$t('oss.localDomain')">
-          <el-input
-            v-model="dataForm.fastdfsDomain"
-            :placeholder="$t('oss.localDomainTips')"
-          ></el-input>
+        <el-form-item prop="localDomain"
+                      :label="$t('oss.localDomain')">
+          <el-input v-model="dataForm.localDomain"
+                    :placeholder="$t('oss.localDomainTips')"></el-input>
         </el-form-item>
-        <el-form-item prop="localPrefix" :label="$t('oss.localPrefix')">
-          <el-input
-            v-model="dataForm.localPrefix"
-            :placeholder="$t('oss.localPrefixTips')"
-          ></el-input>
+        <el-form-item prop="localPrefix"
+                      :label="$t('oss.localPrefix')">
+          <el-input v-model="dataForm.localPrefix"
+                    :placeholder="$t('oss.localPrefixTips')"></el-input>
         </el-form-item>
-        <el-form-item prop="localPath" :label="$t('oss.localPath')">
-          <el-input
-            v-model="dataForm.localPath"
-            :placeholder="$t('oss.localPathTips')"
-          ></el-input>
+        <el-form-item prop="localPath"
+                      :label="$t('oss.localPath')">
+          <el-input v-model="dataForm.localPath"
+                    :placeholder="$t('oss.localPathTips')"></el-input>
         </el-form-item>
       </template>
     </el-form>
     <template slot="footer">
       <el-button @click="visible = false">{{ $t('cancel') }}</el-button>
-      <el-button type="primary" @click="dataFormSubmitHandle()">{{
+      <el-button type="primary"
+                 @click="dataFormSubmitHandle()">{{
         $t('confirm')
       }}</el-button>
     </template>
@@ -416,7 +360,7 @@ export default {
           }
           this.dataForm = res.data
         })
-        .catch(() => {})
+        .catch(() => { })
     },
     // 表单提交
     dataFormSubmitHandle: debounce(
@@ -441,7 +385,7 @@ export default {
                 }
               })
             })
-            .catch(() => {})
+            .catch(() => { })
         })
       },
       1000,