modal的定位維持在中間且在拖曳時不偏移 | fitToView恢復 | 告警加上Device Category說明

src/components/customUI/Modal.vue

@@ -48,7 +48,7 @@ onMounted(() => {
     'modal',
     backdrop
       ? ''
-      : 'h-fit w-fit max-h-fit max-w-fit focus-visible:outline-none backdrop:bg-transparent',
+      : 'focus-visible:outline-none backdrop:bg-transparent',
   )" :style="modalStyle" v-draggable="draggable">
     <div :class="twMerge(
       'modal-box static rounded-md border border-info py-5 px-6 overflow-y-scroll bg-normal',

src/views/alert/components/AlertQuery/AlertSearchTypesButton.vue

@@ -62,8 +62,11 @@ watch(searchParams, (newValue) => {
 
 <template>
   <div class="flex flex-wrap mt-3">
+    <h2 class="text-lg font-bold ps-1 pe-4">
+        {{ $t("history.device_category") }} :
+    </h2>
     <button
-      class="btn btn-success mr-4"
+      class="btn btn-sm btn-success mr-4"
       @click.stop.prevent="changeCheckedItem"
     >
       {{ checkedItem.length === store.subSys.length ? t("button.deselect_all") : t("button.select_all") }}

src/views/system/components/SystemCard.vue

@@ -24,7 +24,7 @@ const fitToView = (forge_dbid) => {
         <p class="title">{{ d.full_name }}</p>
         <div class="grid grid-cols-1 lg:grid-cols-2 gap-5">
           <div class="col-auto relative" v-for="device in d.device_list" :key="device.device_guid">
-            <div class="item h-full">
+            <div class="item h-full cursor-pointer" @click="() => fitToView(device.forge_dbid)">
               <div class="left h-full flex flex-wrap justify-center">
                 <div class="sec02 w-full">
                   <img v-if="device.device_image_url" :src="device.device_image_url" alt="" >

src/views/system/components/SystemInfoModal.vue

@@ -32,8 +32,7 @@ watch(
 </script>
 
 <template>
-  <Modal id="system_info_modal" :onCancel="onCancel" width="600" :draggable="!data?.isMobile" :backdrop="false"
-    :modalStyle="position" class="-translate-x-1/2 -translate-y-1/2">
+  <Modal id="system_info_modal" :onCancel="onCancel" width="600" :draggable="!data?.isMobile" :backdrop="false">
     <template #modalContent>
       <SystemInfoModalContent />
     </template>