Merge branch 'ID1825-床旁副屏改版' into test

zhangchen

2025-07-25 ade34b5d028f42c71cdea15eb95ae9ffcd49b19c

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

@@ -308,8 +308,9 @@
          class="btn"
        />
        <BlockBotttom
          v-if="!whetherDialysisHasBeenEnded"
          :icon="kaiShiImg"
          text="j结束透析"
          text="结束透析"
          backgroundColor="#E6A23C"
          @click="() => onEndClick()"
          class="btn"
@@ -317,9 +318,11 @@
      </div>
    </div>
  </div>
  <!-- 定时任务 -->
  <ScheduledTaskDialog ref="scheduledTaskDialogRef" />
</template>
<script lang="ts" setup name="UnderTreatment">
import { computed, ref, onMounted, onBeforeUnmount } from "vue";
import { computed, ref, onMounted, onBeforeUnmount, watch, defineAsyncComponent } from "vue";
import * as echarts from "echarts";
import dayjs from "dayjs";

@@ -330,6 +333,9 @@
import DoctorAdvice from "../components/DoctorAdvice/index.vue";
// @ts-ignore
import BlockBotttom from "../components/BlockBotttom.vue";
const ScheduledTaskDialog = defineAsyncComponent(
  () => import("../components/ScheduledTask.vue")
);
import { useBedsideAuxiliaryScreenStore } from "@/store/bedsideAuxiliaryScreen";
import {
  formatSubstituteMode,
@@ -355,6 +361,7 @@
import cljdImg from "@/img/cljd.png";
import sjjdImg from "@/img/sjjd.png";
import yizhuImg from "@/img/yizhu.png";
import { ElMessage } from "element-plus";

interface Props {
  height: number;
@@ -362,6 +369,9 @@
const props = defineProps<Props>();

const bedsideAuxiliaryScreenStore = useBedsideAuxiliaryScreenStore();

const scheduledTaskDialogRef = ref<any>(null);


// ktv趋势图的
const ktvListEchartRef = ref<HTMLElement | null>(null);
@@ -385,7 +395,36 @@
  return "未知状态";
});

// const;
/** 是否已结束透析 */
const whetherDialysisHasBeenEnded = computed(() => {
  return (
    +bedsideAuxiliaryScreenStore.deviceData.treatmentStatus >= EMedStatus.END
  );
});

watch(
  () => pageData.value.ktvList,
  (newVal) => {
    generateKtvListEchart(newVal);
  },
  { deep: true }
);

watch(
  () => pageData.value.monitoringRecord,
  (newVal) => {
    generatBloodPressureAndPulseEchart(newVal);
  },
  { deep: true }
);

watch(
  () => props.height,
  () => {
    generateKtvListEchart(pageData.value.ktvList);
    generatBloodPressureAndPulseEchart(pageData.value.monitoringRecord);
  }
);

/** 生成ktv趋势图 */
const generateKtvListEchart = (ktvList: KtvItem[]) => {
@@ -431,7 +470,7 @@
          color: "#70CAAE",
        },
        itemStyle: {
          color: "#70CAAE",
          color: (params: any) => getColor(params.value),
        },
      },
    ],
@@ -441,6 +480,12 @@
  };

  chart.setOption(option, true); // 第二个参数为 true 表示全量更新
};

const getColor = (val: number) => {
  if (val < 1.2) return "#FE0201"; // 红色
  if (val <= 1.6) return "#70CAAE"; // 绿色
  return "#FE6500"; // 橙色
};

/** 生成血压脉搏趋势图 */
@@ -468,9 +513,9 @@

  const option = {
    grid: [
      { top: "20%", height: "27%", left: 30, right: 20 }, // 伸缩压
      { top: "45%", height: "27%", left: 30, right: 20 }, // 舒张压
      { top: "67%", height: "27%", left: 30, right: 20 }, // 脉搏
      { top: "5%", height: "28%", left: 40, right: 20, containLabel: true },
      { top: "35%", height: "28%", left: 40, right: 20, containLabel: true },
      { top: "65%", height: "28%", left: 40, right: 20, containLabel: true },
    ],
    tooltip: {
      trigger: "axis",
@@ -485,6 +530,7 @@
        axisLabel: { show: false },
        splitLine: { show: false },
        gridIndex: 0,
        show: false,
      },
      {
        type: "category",
@@ -495,6 +541,7 @@
        axisLabel: { show: false },
        splitLine: { show: false },
        gridIndex: 1,
        show: false,
      },
      {
        type: "category",
@@ -505,6 +552,7 @@
        axisLabel: { show: true }, // 最下面一层显示时间轴
        splitLine: { show: false },
        gridIndex: 2,
        show: false,
      },
    ],
    yAxis: [
@@ -515,9 +563,9 @@
        axisTick: { show: false },
        axisLabel: { show: false },
        splitLine: { show: false },
        min: 80,
        max: 180,
        interval: 20,
        min: 0,
        max: 300,
        interval: 2,
        gridIndex: 0,
      },
      {
@@ -527,9 +575,9 @@
        axisTick: { show: false },
        axisLabel: { show: false },
        splitLine: { show: false },
        min: 40,
        max: 120,
        interval: 20,
        min: 0,
        max: 300,
        interval: 2,
        gridIndex: 1,
      },
      {
@@ -539,9 +587,9 @@
        axisTick: { show: false },
        axisLabel: { show: false },
        splitLine: { show: false },
        min: 40,
        max: 140,
        interval: 20,
        min: 0,
        max: 300,
        interval: 2,
        gridIndex: 2,
      },
    ],
@@ -604,16 +652,34 @@
};

/** 定时任务 */
const onScheduledTasksClick = () => {};
const onScheduledTasksClick = () => {
  if (!bedsideAuxiliaryScreenStore.deviceCode || !bedsideAuxiliaryScreenStore.deviceData.deviceCode) return ElMessage.warning('未初始化或正在进行初始化操作中');
  scheduledTaskDialogRef.value?.openDialog();
};

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

/** 添加记录 */
const onAddRecordClick = () => {};
const onAddRecordClick = () => {
  ElMessage({
    message: "功能开发中，敬请期待！",
    type: "warning",
  });
};

/** 结束透析 */
const onEndClick = () => {};
const onEndClick = () => {
  ElMessage({
    message: "功能开发中，敬请期待！",
    type: "warning",
  });
};

onMounted(() => {
  // 生成ktv趋势图