From 3871d44d7f578b52e6bcb51d5c9ab1cd59a78559 Mon Sep 17 00:00:00 2001
From: zhangchen <1652267879@qq.com>
Date: 星期六, 26 七月 2025 13:20:53 +0800
Subject: [PATCH] ID1625-定时任务弹框完成

---
 src/views/mobile/bedsideAuxiliaryScreen/index.vue |  110 ++++++++++++++++++++++++++++++++++++++++++++++---------
 1 files changed, 92 insertions(+), 18 deletions(-)

diff --git a/src/views/mobile/bedsideAuxiliaryScreen/index.vue b/src/views/mobile/bedsideAuxiliaryScreen/index.vue
index 406d945..3154799 100644
--- a/src/views/mobile/bedsideAuxiliaryScreen/index.vue
+++ b/src/views/mobile/bedsideAuxiliaryScreen/index.vue
@@ -1,10 +1,18 @@
 <template>
-  <div class="bedside-auxiliary-screen-container">
-    <Header :type="0" device-no="03" />
+  <div
+    class="bedside-auxiliary-screen-container"
+    :style="{ backgroundColor: backgroundColor }"
+  >
+    <Header />
     <div class="bedside-auxiliary-screen-content">
-        <div class="content-position"></div>
-        <!-- <UnplannedSchedule v-if="cotentHeight > 0" :height="cotentHeight"  /> -->
-        <component v-if="cotentHeight > 0" :is="currentComponent" :height="cotentHeight" />
+      <div class="content-position"></div>
+      <transition name="fade" mode="out-in">
+        <component
+          v-if="cotentHeight > 0"
+          :is="currentComponent"
+          :height="cotentHeight"
+        />
+      </transition>
     </div>
   </div>
 </template>
@@ -14,32 +22,87 @@
 // @ts-ignore
 import Header from "./components/Header.vue";
 import { useBedsideAuxiliaryScreenStore } from "@/store/bedsideAuxiliaryScreen";
-import { EPageType } from '@/store/type/bedsideAuxiliaryScreen.type';
-import { getAvailableHeightByClass } from '@/utils/utils';
+import { EPageType } from "@/store/type/bedsideAuxiliaryScreen.type";
+import { getAvailableHeightByClass } from "@/utils/utils";
+import { useWindowSize } from "@/composables/useWindowSize";
 // 未排班时的组件
-const UnplannedSchedule = defineAsyncComponent(() => import('./components/UnplannedSchedule.vue'));
+const UnplannedSchedule = defineAsyncComponent(
+  () => import("./pages/UnplannedSchedule.vue")
+);
 // 未签到时的组件
-const NotSignedIn = defineAsyncComponent(() => import('./components/NotSignedIn.vue'));
+const NotSignedIn = defineAsyncComponent(
+  () => import("./pages/NotSignedIn.vue")
+);
+// 已签到时的组件
+const SignedIn = defineAsyncComponent(() => import("./pages/SignedIn.vue"));
+// 治疗中的组件
+const UnderTreatment = defineAsyncComponent(
+  () => import("./pages/UnderTreatment.vue")
+);
+// 血压计的组件
+const Sphygmomanometer = defineAsyncComponent(
+  () => import("./pages/Sphygmomanometer.vue")
+);
 
 const bedsideAuxiliaryScreenStore = useBedsideAuxiliaryScreenStore();
 const cotentHeight = ref(0);
+const { width, height } = useWindowSize();
+
+const backgroundColor = computed(() => {
+  let color = "#DAE5EC";
+  // 如果是未排班、加载中或未签到页面，背景色为白色
+  if (
+    [
+      EPageType.NOT_INIT,
+      EPageType.LOADING,
+      EPageType.UNPLANNED_SCHEDULE,
+    ].includes(bedsideAuxiliaryScreenStore.deviceData.pageType)
+  ) {
+    color = "#fff";
+  }
+  return color;
+});
 
 const currentComponent = computed(() => {
   let name: any = UnplannedSchedule;
-  // 未签到
-  if ([EPageType.NOT_INIT, EPageType.LOADING, EPageType.UNPLANNED_SCHEDULE].includes(bedsideAuxiliaryScreenStore.deviceData.pageType)) {
+
+  // 血压计
+  if (
+    bedsideAuxiliaryScreenStore.deviceData.pageType ===
+    EPageType.SPHYGMOMANOMETER
+  ) {
+    name = Sphygmomanometer;
+  } else if (
+    [
+      EPageType.NOT_INIT,
+      EPageType.LOADING,
+      EPageType.UNPLANNED_SCHEDULE,
+    ].includes(bedsideAuxiliaryScreenStore.deviceData.pageType)
+  ) {
     name = UnplannedSchedule;
   }
-  else if (bedsideAuxiliaryScreenStore.deviceData.pageType === EPageType.NOT_SIGNED_IN) {
-    name = NotSignedIn
+  // 未签到
+  else if (
+    bedsideAuxiliaryScreenStore.deviceData.pageType === EPageType.NOT_SIGNED_IN
+  ) {
+    name = NotSignedIn;
+  }
+  // 已签到
+  else if (
+    bedsideAuxiliaryScreenStore.deviceData.pageType === EPageType.SIGNED_IN
+  ) {
+    name = SignedIn;
+  }
+  // 透析中
+  else {
+    name = UnderTreatment;
   }
   return name;
 });
 
-watch(
-  () => bedsideAuxiliaryScreenStore.deviceCode,
-  (newVal: string) => {}
-);
+watch([width, height], () => {
+  cotentHeight.value = getAvailableHeightByClass("content-position");
+});
 
 onMounted(() => {
   if (bedsideAuxiliaryScreenStore.deviceCode) {
@@ -49,7 +112,7 @@
       }`
     );
   }
-  cotentHeight.value = getAvailableHeightByClass('content-position')
+  cotentHeight.value = getAvailableHeightByClass("content-position");
 });
 </script>
 
@@ -60,8 +123,19 @@
   box-sizing: border-box;
 }
 .bedside-auxiliary-screen-container {
+  background-color: #409eff;
   .bedside-auxiliary-screen-content {
     padding: 6px 12px 0;
   }
 }
+</style>
+<style scoped>
+.fade-enter-active,
+.fade-leave-active {
+  transition: opacity 0.3s ease;
+}
+.fade-enter-from,
+.fade-leave-to {
+  opacity: 0;
+}
 </style>
\ No newline at end of file

--
Gitblit v1.8.0