From 5dfef8cf5ce7372338b400df978bfc5bf7c9153c Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?=E5=A2=A8=E5=A4=A7=E5=8F=94?= <494979559@qq.com>
Date: Fri, 9 Aug 2024 10:20:20 +0800
Subject: [PATCH] =?UTF-8?q?=E7=A7=98=E9=92=A5=E5=B1=95=E7=A4=BA=E4=BC=98?=
 =?UTF-8?q?=E5=8C=96?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/components/LineField/index.vue |  4 +--
 src/views/mch/access/index.vue     | 54 +++++++++++++++++++-----------
 2 files changed, 36 insertions(+), 22 deletions(-)

diff --git a/src/components/LineField/index.vue b/src/components/LineField/index.vue
index b637d64..5aa8036 100644
--- a/src/components/LineField/index.vue
+++ b/src/components/LineField/index.vue
@@ -1,5 +1,4 @@
 <template>
-
   <div class="line-field">
     <div class="label">
       {{label}}
@@ -39,6 +38,7 @@ export default {
   justify-content: space-between;
   .label {
     width: fit-content;
+    margin-right: 2em;
   }
   .right-box {
     flex: 1;
@@ -53,7 +53,7 @@ export default {
     margin: 0 0.5em;
   }
 }
-.line-field:nth-child(n +2) {
+.line-field:nth-child(n + 2) {
   border-top: 1px solid #ededed;
 }
 .line-field:hover {
diff --git a/src/views/mch/access/index.vue b/src/views/mch/access/index.vue
index 1ab7a37..2b2dd4e 100644
--- a/src/views/mch/access/index.vue
+++ b/src/views/mch/access/index.vue
@@ -64,21 +64,22 @@
     />
 
     <!-- 添加或修改第三方API秘钥对对话框 -->
-    <el-dialog :title="title" :visible.sync="open" width="500px" append-to-body>
-      <el-form ref="form" :model="form" :rules="rules" label-width="80px">
-        <el-form-item label="申请用户ID" prop="userId">
-          <el-input v-model="form.userId" placeholder="请输入申请用户ID" />
-        </el-form-item>
-        <el-form-item label="秘钥键" prop="accessKey">
-          <el-input v-model="form.accessKey" placeholder="请输入秘钥键" />
-        </el-form-item>
-        <el-form-item label="秘钥" prop="accessSecret">
-          <el-input v-model="form.accessSecret" placeholder="请输入秘钥" />
-        </el-form-item>
-      </el-form>
+    <el-dialog :visible.sync="open" width="500px" append-to-body center :close-on-click-modal="false">
+      <el-result icon="success" :title="title" subTitle="仅展示一次，请妥善保管您的秘钥，请勿泄露"/>
+      <div>
+        <line-field v-if="accessKey" label="秘钥键" :value="accessKey">
+          <el-link :underline="false" icon="el-icon-document-copy" v-clipboard:copy="accessKey" v-clipboard:success="clipboardSuccess">
+            {{accessKey}}
+          </el-link>
+        </line-field>
+        <line-field v-if="secret" label="秘钥" :value="secret">
+          <el-link :underline="false" icon="el-icon-document-copy" v-clipboard:copy="secret" v-clipboard:success="clipboardSuccess" >
+            {{secret}}
+          </el-link>
+        </line-field>
+      </div>
       <div slot="footer" class="dialog-footer">
-        <el-button type="primary" @click="submitForm">确 定</el-button>
-        <el-button @click="cancel">取 消</el-button>
+        <el-button @click="open = false" type="primary">关 闭</el-button>
       </div>
     </el-dialog>
 
@@ -90,9 +91,11 @@
 import { listAccess, getAccess, delAccess, addAccess, updateAccess } from "@/api/ss/access";
 import { $view } from '@/utils/mixins'
 import { appAddAccess, appListAccess, appResetAccess, mchDelAccess } from '@/api/app/access'
+import LineField from '@/components/LineField/index.vue'
 
 export default {
   name: "MchAccess",
+  components: { LineField },
   mixins: [$view],
   props: {
     query: {
@@ -146,7 +149,10 @@ export default {
         createTime: [
           { required: true, message: "创建时间不能为空", trigger: "blur" }
         ]
-      }
+      },
+      accessKey: null,
+      secret: null,
+      showAccess: false,
     };
   },
   created() {
@@ -157,11 +163,15 @@ export default {
     this.getList();
   },
   methods: {
+    clipboardSuccess() {
+      this.$message.success("复制成功");
+    },
     /** 申请按钮操作 */
     handleAdd() {
       appAddAccess().then(res => {
         if (res.code === 200) {
-          this.showSecret(res.data.accessSecret)
+          this.showSecret(res.data.accessKey, res.data.accessSecret, "申请成功")
+          this.getList();
         }
       })
     },
@@ -174,14 +184,18 @@ export default {
       }).then(() => {
         appResetAccess(row.accessId).then(res => {
           if (res.code === 200) {
-            this.showSecret(res.data)
+            this.showSecret(null, res.data, "重置成功")
+            this.getList();
           }
         })
       })
     },
-    // TODO 展示秘钥
-    showSecret(secret) {
-      this.$alert(`您的秘钥：${secret}`, '申请成功', {})
+    // 展示秘钥
+    showSecret(key, secret, title) {
+      this.accessKey = key;
+      this.secret = secret;
+      this.title = title;
+      this.open = true;
     },
     /** 查询第三方API秘钥对列表 */
     getList() {