完整性结果详情弹框

src/views/Jyh/Version/Detail/VersionInfo.vue

@@ -209,7 +209,7 @@
       :style="{ width: '800px', height: '400px' }"
       @close="handleClose"
     >
-      <Card simple class="jyh-card mb-4" style="box-shadow: none">
+      <Card simple class="jyh-card mb-4" style="box-shadow: none;padding: 0">
         <d-row class="mb-3">
           <d-col :span="24">
             <span class="card-key width-160">社区哈希类型</span>
@@ -219,13 +219,16 @@
         <d-row class="mb-3">
           <d-col :span="24">
             <span class="card-key width-160">社区哈希值</span>
-            <span class="card-val">23u4guj2i3hni32h2o34io234</span>
+            <span class="card-val">sha5123b831bee9d575a2729065f830a65f830a65f83a65f852...</span>
+            <d-tooltip content="复制" :mouse-enter-delay="800">
+              <Icon name="icon-copy" class="ml-10 w-4 flex-shrink-0" color="#9FA7B3" @click="handleCopy" />
+            </d-tooltip>
           </d-col>
         </d-row>
         <d-row class="mb-3">
           <d-col :span="24">
             <span class="card-key width-160">社区签名校验结果</span>
-            <span class="card-val">通过</span>
+            <span class="card-val card-success">通过</span>
           </d-col>
         </d-row>
         <d-row class="mb-3">
@@ -253,6 +256,12 @@
           </d-col>
         </d-row>
       </Card>
+      <template #footer>
+        <d-modal-footer style="text-align: center;">
+          <d-button variant="solid" color="primary"  @click="handleClose">确认</d-button>
+          <d-button @click="handleClose">取消</d-button>
+        </d-modal-footer>
+      </template>
     </d-modal>
 
   </div>
@@ -263,6 +272,8 @@
 import { ref,defineEmits } from 'vue';
 import { useRouter } from 'vue-router';
 import { discussDetailType, userInfoType } from '@/api/discussion/types';
+import { Message } from 'vue-devui/message';
+import { useClipboard } from '@vueuse/core/index';
 
 const emits = defineEmits(['changeTabs']);
 
@@ -287,10 +298,59 @@ const gotoDetail = (row) => {
   });
 };
 
+// 跳转
+const handleClose = (row) => {
+    visible.value = false
+};
+
+const { copy } = useClipboard();
+const handleCopy = event => {
+  event.stopPropagation();
+
+  copy('');
+  Message.success('复制成功');
+};
+
 </script>
 
 <style scoped lang="scss">
 @import 'devui-theme/styles-var/devui-var.scss';
 
+.card-key {
+  color: #777777;
+  font-family: HarmonyOS Sans SC;
+  font-weight: regular;
+  font-size: 14px;
+  line-height: 22px;
+  letter-spacing: 0px;
+  text-align: left;
+  width: 112px;
+  margin-right: 20px;
+}
 
+.card-val {
+  color: #191919;
+  font-family: HarmonyOS Sans SC;
+  font-weight: regular;
+  font-size: 14px;
+  line-height: 22px;
+  letter-spacing: 0px;
+  text-align: left;
+
+}
+
+.card-success {
+  display: inline-block;
+  border-radius: 4px;
+  background: #81C054;
+  color: #FFFFFF;
+  font-family: HarmonyOS Sans SC;
+  font-weight: medium;
+  font-size: 12px;
+  line-height: 20px;
+  height: 20px;
+  letter-spacing: 0px;
+  text-align: left;
+  padding: 0 8px;
+}
 </style>