单应用项目,可以创建很多独立工具类页面 ,不用登录 初始化的页面
zhangchen
2025-07-25 ade34b5d028f42c71cdea15eb95ae9ffcd49b19c
src/views/mobile/bedsideAuxiliaryScreen/components/Header.vue
@@ -23,10 +23,16 @@
            {{ patientInfo.patForm }}:{{ patientInfo.patFormNumber }}</span
          >
        </template>
        {{ taskCountdown }}
      </template>
    </div>
    <div class="header-right">
      <img :src="atRegularTimeImg" class="btn-img" alt="" />
      <img
        :src="atRegularTimeImg"
        class="btn-img"
        alt=""
        @click="openScheduledTaskDialog"
      />
      <img
        :src="setUpImg"
        class="btn-img"
@@ -38,12 +44,26 @@
  </div>
  <!-- 设置设备编号组件 -->
  <SettingDeviceDialog ref="settingDeviceDialogRef" />
  <!-- 定时任务组件 -->
  <ScheduledTaskDialog ref="scheduledTaskDialogRef" />
</template>
<script lang="ts" setup name="Header">
import { ref, computed, defineAsyncComponent } from "vue";
import {
  ref,
  computed,
  defineAsyncComponent,
  onMounted,
  onUnmounted,
  watch,
} from "vue";
import dayjs from "dayjs";
import type { Task } from "@/store/type/task.type";
const SettingDeviceDialog = defineAsyncComponent(
  () => import("./SettingDeviceDialog.vue")
);
const ScheduledTaskDialog = defineAsyncComponent(
  () => import("./ScheduledTask.vue")
);
import atRegularTimeImg from "../../../../img/dingshi.png";
import setUpImg from "../../../../img/shezhi.png";
@@ -55,7 +75,11 @@
const bedsideAuxiliaryScreenStore = useBedsideAuxiliaryScreenStore();
let timer: number;
const settingDeviceDialogRef = ref<any>(null);
const scheduledTaskDialogRef = ref<any>(null);
const taskCountdown = ref(""); // 定时任务倒计时文本
const pageType = computed(() => {
  return bedsideAuxiliaryScreenStore.deviceData.pageType;
@@ -76,8 +100,30 @@
  };
});
// watch(
//   () => bedsideAuxiliaryScreenStore.taskData,
//   (newData: Task[]) => {
//     console.log('定时任务更新了')
//     if (
//       bedsideAuxiliaryScreenStore.deviceData.deviceCode &&
//       newData.length > 0
//     ) {
//       console.log('newData: ', newData)
//       updateCountdown(newData[0].taskDate);
//     } else {
//       taskCountdown.value = "";
//     }
//   },
//   { deep: true }
// );
const openSettingDeviceDialog = () => {
  settingDeviceDialogRef.value?.openDialog();
};
const openScheduledTaskDialog = () => {
  if (!bedsideAuxiliaryScreenStore.deviceCode || !bedsideAuxiliaryScreenStore.deviceData.deviceCode) return ElMessage.warning('未初始化或正在进行初始化操作中');
  scheduledTaskDialogRef.value?.openDialog();
};
const openLoginDialog = () => {
@@ -86,6 +132,38 @@
    type: "warning",
  });
};
const getCountdown = (taskDate: string) => {
  const now = dayjs();
  const target = dayjs(taskDate).second(0).millisecond(0);
  const diff = target.diff(now, "second");
  if (diff <= 0) return "";
  const minutes = Math.floor(diff / 60);
  const seconds = diff % 60;
  return `${minutes}m${seconds}s`;
};
const updateCountdown = (taskDate: string) => {
  taskCountdown.value = getCountdown(taskDate);
  timer = window.setInterval(updateCountdown, 1000);
};
onMounted(() => {
  if (
    bedsideAuxiliaryScreenStore.deviceData.deviceCode &&
    bedsideAuxiliaryScreenStore.taskData.length > 0
  ) {
    getCountdown(bedsideAuxiliaryScreenStore.taskData[0].taskDate);
  }
});
onUnmounted(() => {
  timer && clearInterval(timer);
});
</script>
<style lang="less" scoped>