弹窗

src/components/body-d-right/oneR.vue

@@ -1,6 +1,6 @@
 <template>
-  <div>
-    <public-title title="健康终端报警"/>
+  <div class="terminal-container">
+    <public-title title="健康终端报警" :isShowMore="true" @clickMore="handleDialog"/>
     <div class="inner">
       <vue3-seamless-scroll :list="policeLists" class="scroll" :hover="true" :limitScrollNum="7">
         <div class="item" v-for="(item, index) in policeLists" :key="index">
@@ -13,11 +13,17 @@
         </div>
       </vue3-seamless-scroll>
     </div>
+    <Dialog :openVis="open" width="40%" title="健康终端报警列表" @close="handleClose">
+      <template #container>
+        <div>34534</div>
+      </template>
+    </Dialog>
   </div>
 </template>
 <script setup lang="ts">
   import { ref } from 'vue';
   import PublicTitle from "../publicTitle.vue";
+  import Dialog from '../dialog/Dialog.vue';
   import { Vue3SeamlessScroll } from "vue3-seamless-scroll";
   const policeLists = ref([
     {
@@ -51,10 +57,17 @@
       time: '2023-8-25',
     }
   ])
+  const open = ref<boolean>(false);
 
+  function handleDialog(){
+    open.value = true
+  }
+  function handleClose(){
+    open.value = false
+  }
 </script>
 <style scoped lang="less">
-.inner {
+  .inner {
   height: calc(100% - 40px);
   display: flex;
   align-items: center;