From 8d3cd7f7bdf1624a1d5f0a2de13e5dabc6223797 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?=E5=AE=89=E8=99=B9=E7=9D=BF?= <297504645@qq.com>
Date: Fri, 4 Aug 2023 17:00:51 +0800
Subject: [PATCH] =?UTF-8?q?json/detial=E6=B6=88=E6=81=AF=E5=A4=8D=E5=88=B6?=
 =?UTF-8?q?=E5=B1=82=E4=BC=98=E5=8C=96?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 .../src/components/showCopyJsonPop/index.vue  | 54 ++++++++++++-------
 Code/Fe/src/components/umyTable/index.vue     | 15 ++++--
 2 files changed, 46 insertions(+), 23 deletions(-)

diff --git a/Code/Fe/src/components/showCopyJsonPop/index.vue b/Code/Fe/src/components/showCopyJsonPop/index.vue
index ebb2c6a..1377929 100644
--- a/Code/Fe/src/components/showCopyJsonPop/index.vue
+++ b/Code/Fe/src/components/showCopyJsonPop/index.vue
@@ -4,22 +4,27 @@
   
       <!-- 点开查看Json转换后table弹窗 -->
       <el-dialog 
+        top="50px"
         :visible.sync="JsonTableShow"
         :modal-append-to-body="true"
         :append-to-body="true"
         :show-close="true"
         :close-on-click-modal="true"
         :close-on-press-escape="true"
-        :title="'内容详情'"
         width="90%"
         @close="closePop"
       >
-        <el-button 
+        <template #title>
+          内容详情
+          <el-button 
+            size="mini"
             @click="copyJsonHandle()" 
             type="primary" 
-            style="margin-bottom: 10px;float: right;"
-        >复制JSON</el-button>
+            style="margin-right: 30px;float: right;"
+          >复制JSON</el-button>
+        </template>
         <el-table
+          height="calc(100vh - 220px)"
           :data="JsonTableData"
           :border="true"
           style="width: 100%">
@@ -85,7 +90,7 @@
       
       <!-- json复制内容弹窗 -->
       <el-dialog
-        id="copyJsonTextarea_dialog_ref"
+        top="50px"
         :visible.sync="JsonCopyShow"
         :modal-append-to-body="false"
         :append-to-body="true"
@@ -95,6 +100,7 @@
         :title="'JSON详情'"
       >
         <el-input
+          class="copyJsonTextarea"
           ref="copyJsonTextarea_ref"
           type="textarea"
           readonly
@@ -119,6 +125,7 @@
         <umyTable
           :isShowIndex="true"
           :tableBorder="true"
+          :setUTableHeight="240"
           :tableData="detailTableRow.value"
           :tableColumns="detailTableColumns"
           :selectionTable="false"
@@ -207,20 +214,25 @@
         this.JsonTableData = _arr
         this.JsonCopyData = JSON.stringify(_json, null, '\t')//复制使用
       },
+      // 复制后选择框处理
+      copyJsonInputHandle(type){
+        if(type == 'error')this.$message.error('复制失败');
+        if(type == 'success')this.$message.success('复制成功');
+        if(this.$refs.copyJsonTextarea_ref){
+          this.$refs.copyJsonTextarea_ref.focus()
+          this.$refs.copyJsonTextarea_ref.$refs.textarea.scrollTop = 0
+        }
+      },
       // 复制Json按钮
       copyJsonHandle(){
         this.JsonCopyShow = true
         if (navigator.clipboard && window.isSecureContext) {
           navigator.clipboard.writeText(this.JsonCopyData)
             .then(() => {
-              this.$message.success('复制成功');
-              this.$refs.copyJsonTextarea_ref.focus()
-              document.getElementById('copyJsonTextarea_dialog_ref').scrollTop = 0
+              this.copyJsonInputHandle('success')
             })
             .catch(err => {
-              this.$message.error('复制失败');
-              this.$refs.copyJsonTextarea_ref.focus()
-              document.getElementById('copyJsonTextarea_dialog_ref').scrollTop = 0
+              this.copyJsonInputHandle('error')
             });
         }else {
           // 创建text area
@@ -236,16 +248,10 @@
               textArea.remove()
           }).then(() => {
             this.$nextTick(()=>{
-              if(this.$refs.copyJsonTextarea_ref){
-                this.$message.success('复制成功');
-                this.$refs.copyJsonTextarea_ref.focus()
-                document.getElementById('copyJsonTextarea_dialog_ref').scrollTop = 0
-              }
+              this.copyJsonInputHandle('success')
             })
           },() => {
-            this.$message.error('复制失败');
-            this.$refs.copyJsonTextarea_ref.focus()
-            document.getElementById('copyJsonTextarea_dialog_ref').scrollTop = 0
+              this.copyJsonInputHandle('error')
           })
         }
         
@@ -264,4 +270,12 @@
       }
     }
   }
-  </script>
\ No newline at end of file
+  </script>
+<style lang="scss" scoped>
+::v-deep .copyJsonTextarea{
+  textarea{
+    max-height: calc(100vh - 220px) !important;
+    overflow: auto !important;
+  }
+}
+</style>
\ No newline at end of file
diff --git a/Code/Fe/src/components/umyTable/index.vue b/Code/Fe/src/components/umyTable/index.vue
index 5df6312..5c494de 100644
--- a/Code/Fe/src/components/umyTable/index.vue
+++ b/Code/Fe/src/components/umyTable/index.vue
@@ -175,7 +175,7 @@
 
     <!-- 点开查看全部弹窗 -->
     <el-dialog 
-      id="copyDetailInput_dialog_ref"
+      top="50px"
       :visible.sync="showDetailDialog"
       width="35%"
       :modal-append-to-body="false"
@@ -186,6 +186,7 @@
       :close-on-press-escape="true"
     >
       <el-input
+        class="copyDetailInput"
         ref="copyDetailInput_ref"
         type="textarea"
         readonly
@@ -609,8 +610,10 @@ export default {
       this.showDetailData = type == 'time' ? formatTimeStrToStr(row) : _row
       this.$emit("showDetailInfo", this.showDetailData);
       this.$nextTick(()=>{
-        this.$refs.copyDetailInput_ref.focus()
-        document.getElementById('copyDetailInput_dialog_ref').scrollTop = 0
+        if(this.$refs.copyDetailInput_ref){
+          this.$refs.copyDetailInput_ref.focus()
+          this.$refs.copyDetailInput_ref.$refs.textarea.scrollTop = 0
+        }
       })
     },
     closeJsonPop(){
@@ -765,4 +768,10 @@ span {
 .itemSpan{
   white-space: nowrap !important
 }
+::v-deep .copyDetailInput{
+  textarea{
+    max-height: calc(100vh - 220px) !important;
+    overflow: auto !important;
+  }
+}
 </style>
\ No newline at end of file