ID1825-已签到页面暂存

zhangchen

2025-07-22 ac68116a9dbb46d450bad38a03b18441649f0ef4

ID1825-已签到页面暂存

 src/img/dingshi2.png

 src/img/jiaoHao.png

 src/img/kaiShi.png

 src/views/mobile/bedsideAuxiliaryScreen/components/BlockBotttom.vue

New file
@@ -0,0 +1,48 @@
<template>
  <div
    class="block-botttom"
    :style="{
      '--backgroundColor': props.backgroundColor,
    }"
    @click="props.onClick"
  >
    <img :src="icon" alt="" class="icon" />
    <span class="text">{{ text }}</span>
  </div>
</template>

<script lang="ts" setup name="BlockBotttom">
interface Props {
  icon: string; // 图标
  text: string; // 文本
  backgroundColor: string; // 背景颜色
  onClick: () => void; // 点击事件
}
const props = defineProps<Props>();
</script>

<style lang="less" scoped>
.block-botttom {
  width: 18px;
  height: 18px;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  background: var(--backgroundColor, #70a3dd);
  border-radius: 2px;
  .icon {
    margin-bottom: 2px;
    width: 6px;
    height: 6px;
  }
  .text {
    font-family: AlibabaPuHuiTi, AlibabaPuHuiTi;
    font-weight: 500;
    font-size: 3px;
    color: #ffffff;
    text-align: left;
    font-style: normal;
  }
}
</style>

 src/views/mobile/bedsideAuxiliaryScreen/index.vue

@@ -17,16 +17,18 @@
import { EPageType } from '@/store/type/bedsideAuxiliaryScreen.type';
import { getAvailableHeightByClass } from '@/utils/utils';
// 未排班时的组件
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('./components/SignedIn.vue'));
const SignedIn = defineAsyncComponent(() => import('./pages/SignedIn.vue'));
// 治疗中的组件
const UnderTreatment = defineAsyncComponent(() => import('./components/UnderTreatment.vue'));
const UnderTreatment = defineAsyncComponent(() => import('./pages/UnderTreatment.vue'));

const bedsideAuxiliaryScreenStore = useBedsideAuxiliaryScreenStore();
const cotentHeight = ref(0);


const backgroundColor = computed(() => {
  let color = '#DAE5EC';
  // 如果是未排班、加载中或未签到页面，背景色为白色

 src/views/mobile/bedsideAuxiliaryScreen/pages/NotSignedIn.vue

File was renamed from src/views/mobile/bedsideAuxiliaryScreen/components/NotSignedIn.vue
@@ -186,7 +186,7 @@
<script lang="ts" setup name="NotSignedIn">
import { computed } from "vue";
// @ts-ignore
import Card from "./Card.vue";
import Card from "../components/Card.vue";
import { useBedsideAuxiliaryScreenStore } from "@/store/bedsideAuxiliaryScreen";
import tslImg from "@/img/tsl.png";


 src/views/mobile/bedsideAuxiliaryScreen/pages/SignedIn.vue

File was renamed from src/views/mobile/bedsideAuxiliaryScreen/components/SignedIn.vue
@@ -153,20 +153,49 @@
        </div>
      </Card>
    </div>
    <div class="row3"></div>
    <div class="row3">
      <BlockBotttom
        :icon="dingShiImg"
        text="定时任务"
        backgroundColor="#20C6B6"
        @click="() => onScheduledTasksClick()"
        class="btn"
      />
      <BlockBotttom
        :icon="jiaoHaoImg"
        text="叫号"
        backgroundColor="#20C6B6"
        @click="() => onCallBumberClick()"
        class="btn"
      />
      <BlockBotttom
        :icon="kaiShiImg"
        text="开始"
        backgroundColor="#409EFF"
        @click="() => onStartClick()"
        class="btn"
      />
    </div>
  </div>
</template>
<script lang="ts" setup name="SignedIn">
import { computed } from "vue";
// @ts-ignore
import Card from "./Card.vue";
import Card from "../components/Card.vue";
import { useBedsideAuxiliaryScreenStore } from "@/store/bedsideAuxiliaryScreen";
import tslImg from "@/img/tsl.png";
import dingShiImg from "@/img/dingshi2.png";
import jiaoHaoImg from "@/img/jiaoHao.png";
import kaiShiImg from "@/img/kaiShi.png";

import {
  getItemName,
  formatTestColr,
  formatTestFlag,
} from "@/store/type/bedsideAuxiliaryScreen.type";
// @ts-ignore
import BlockBotttom from "../components/BlockBotttom.vue";
import { ElMessage } from "element-plus/es";

interface Props {
  height: number;
@@ -180,6 +209,23 @@
    patientPhone: bedsideAuxiliaryScreenStore.deviceData.patientPhone,
  });
});

/** 点击定时任务 */
const onScheduledTasksClick = () => {};

const onCallBumberClick = () => {
  ElMessage({
    message: "功能开发中，敬请期待！",
    type: "warning",
  });
};

const onStartClick = () => {
  ElMessage({
    message: "功能开发中，敬请期待！",
    type: "warning",
  });
};
</script>
<style lang="less" scoped>
* {
@@ -315,9 +361,17 @@
    position: absolute;
    width: 100%;
    bottom: 2px;
    height: 11.33%;
    height: 13.33%;
    display: flex;
    align-items: center;
    justify-content: flex-end;
    padding-right: 13px;
    overflow: hidden;
    background-color: blue;
    background: #ffffff;
    border-radius: 2px;
    .btn {
      margin-left: 9px;
    }
  }
  .item-box {
    height: 100%;

 src/views/mobile/bedsideAuxiliaryScreen/pages/UnderTreatment.vue

File was renamed from src/views/mobile/bedsideAuxiliaryScreen/components/UnderTreatment.vue
@@ -25,7 +25,7 @@
<script lang="ts" setup name="UnderTreatment">
import { computed } from "vue";
// @ts-ignore
import Card from "./Card.vue";
import Card from "../components/Card.vue";
import { useBedsideAuxiliaryScreenStore } from "@/store/bedsideAuxiliaryScreen";

interface Props {

 src/views/mobile/bedsideAuxiliaryScreen/pages/UnplannedSchedule.vue

File was renamed from src/views/mobile/bedsideAuxiliaryScreen/components/UnplannedSchedule.vue
@@ -117,7 +117,7 @@
<script lang="ts" setup name="UnplannedSchedule">
import { computed } from "vue";
// @ts-ignore
import Card from "./Card.vue";
import Card from "../components/Card.vue";
import tslImg from "@/img/tsl.png";
import { useBedsideAuxiliaryScreenStore } from "@/store/bedsideAuxiliaryScreen";