ID1643-副屏添加医嘱展示完成

zhangchen

2025-06-20 0a384d93299aa97e988122aa7d3e992eede7be04

ID1643-副屏添加医嘱展示完成

 src/assets/turn.png

 src/components/doctorAdvice/index.vue

New file
@@ -0,0 +1,186 @@
<template>
  <div class="doctor_advice_container" :style="{ height: height + 'px' }">
    <div class="doctor_advice_list">
      <div
        v-for="(item, index) in drugOrders"
        :key="index"
        class="doctor_advice_item"
      >
        <div class="doctor_advice_item_name">{{ item.name }}</div>
        <template v-if="item?.children && item.children.length > 0">
          <div
            v-for="(child, childIndex) in item.children"
            :key="childIndex"
            class="doctor_advice_item_sub"
          >
            <img :src="trunImgSrc" alt="" />
            <span>{{ child }}</span>
          </div>
        </template>
      </div>
    </div>
  </div>
</template>

<script lang="ts">
import { PropType, computed } from "vue";
import type { Order } from "./type";
import trunImgSrc from "../../assets/turn.png";

export default {
  name: "DoctorAdvice",
  props: {
    // 容器的高度
    height: {
      type: Number,
      default: 0,
    },
    // 医嘱列表
    list: {
      type: Array as PropType<Order[]>,
      default: () => [],
    },
  },
  setup(props) {
    const drugOrders = computed(() => {
      // 格式化主医嘱数据（浅拷贝）
      const formatList = props.list
        .filter((e) => e.orderIsSub !== 1)
        .map((e) => ({ ...e }));

      // 处理子医嘱并挂载到对应主医嘱上
      props.list.forEach((e) => {
        if (e.orderIsSub === 1) {
          const i = formatList.findIndex((v) => v.code === e.orderMainCode);
          if (i !== -1) {
            if (!formatList[i].subDrugOrders) {
              formatList[i].subDrugOrders = [];
            }
            formatList[i].subDrugOrders.push(e);
          }
        }
      });

      // 构建显示用的 name 和子医嘱 children
      return formatList.map((order) => {
        let name = "";

        if (order.orderNameInfo) {
          name = order.orderNameInfo.itemName || "";
          const drugSpec = order.orderNameInfo.feeDrugInfo?.drugSpec;
          if (drugSpec) {
            name += ` (${drugSpec})`;
          }
        }

        if (order.orderUsage && order.orderUsage !== 0) {
          name += ` ${order.orderUsage}${
            order.orderNameInfo?.feeDrugInfo?.drugUnitName || ""
          }`;
        }

        if (order.orderCount) {
          name += ` ${order.orderCount}`;
          const pkgUnit = order.orderNameInfo?.feeDrugInfo?.drugPackageUnitName;
          if (pkgUnit) {
            name += pkgUnit;
          }
        }

        if (order.orderFromInfo?.dictText) {
          name += ` ${order.orderFromInfo.dictText}`;
        }

        if (order.orderFreqInfo?.dictText) {
          name += ` ${order.orderFreqInfo.dictText}`;
        }

        const children: string[] = [];

        if (order.subDrugOrders?.length) {
          order.subDrugOrders.forEach((child: any) => {
            let subName = child.orderNameInfo?.itemName || "";

            const childSpec = child.orderNameInfo?.feeDrugInfo?.drugSpec;
            if (childSpec) {
              subName += ` (${childSpec})`;
            }

            if (child.orderUsage) {
              const unit = child.orderNameInfo?.feeDrugInfo?.drugUnitName || "";
              subName += ` ${child.orderUsage}${unit}`;
            }

            if (child.orderCount) {
              const pkgUnit =
                child.orderNameInfo?.feeDrugInfo?.drugPackageUnitName;
              if (pkgUnit) {
                subName += ` ${child.orderCount}${pkgUnit}`;
              }
            }

            children.push(subName);
          });
        }

        return {
          name,
          children,
        };
      });
    });

    return {
      drugOrders,
      trunImgSrc,
    };
  },
};
</script>

<style scoped>
.doctor_advice_container {
  padding: 20px;
  box-sizing: border-box;
}
.doctor_advice_container .doctor_advice_list {
  box-sizing: border-box;
  height: 100%;
  background: #ffffff;
  border-radius: 8px;
  overflow: hidden;
  overflow-y: auto;
}
.doctor_advice_container .doctor_advice_item {
  box-sizing: border-box;
  padding: 12px 24px;
  border-bottom: 2px solid #e6e5e5;
}
.doctor_advice_container .doctor_advice_item:last-child {
  box-sizing: border-box;
  border-bottom: none;
}
.doctor_advice_container .doctor_advice_item .doctor_advice_item_name {
  box-sizing: border-box;
  font-weight: 400;
  font-size: 26px;
  color: #333333;
  line-height: 35px;
  text-align: left;
  font-style: normal;
}
.doctor_advice_container .doctor_advice_item_sub {
  padding-left: 15px;
  font-weight: 400;
  font-size: 26px;
  color: #777777;
  line-height: 35px;
  text-align: left;
  font-style: normal;
}
.doctor_advice_container .doctor_advice_item_sub img {
  width: 24px;
  height: 24px;
  margin-right: 5px;
}
</style>

 src/components/doctorAdvice/type.ts

New file
@@ -0,0 +1,375 @@
export interface Order {
    orderType: number;
    code: string;
    orderFreq: string;
    orderDoctor: string;
    confirmUserInfo: any | null; 
    remark: string | null;
    isConfirm: number;
    isDeleted: number;
    orderExecuteCheckUser: any | null; 
    orderIsSub: number;
    orderExecuteTime: any | null; 
    id: number;
    recordCode: string;
    deletedTime: any | null; 
    orderExecutePatient: any | null; 
    orderExecuteUser: any | null; 
    orderName: string;
    orderExecuteCheckUserInfo: any | null; 
    subDrugOrders: any | null; 
    orderSort: number;
    orderCount: number;
    hisOrderNo: string | null;
    updateUser: any | null; 
    confirmTime: any | null; 
    confirmUser: any | null; 
    updateTime: number;
    orderDoctorInfo: UserDoctorInfo;
    orderMainCode: string | null;
    createTime: number;
    orderFreqInfo: OrderFreqInfo;
    orderNameInfo: OrderNameInfo;
    createUser: any | null; 
    orderFrom: string;
    orderUsage: number;
    orderIsSpin: number;
    orderExecuteUserInfo: any | null; 
    orderFromInfo: OrderFromInfo;
    orderStartTime: number;
}

interface UserDoctorInfo {
    isRecvAlarmEmail: number;
    prepareWorkMedicineStat: any | null;
    userDegree: any | null;
    isRecvAlarmWechat: number;
    listReadyRows: any | null;
    selectedFieldsInInventory2OutPage: any | null;
    currentClientInfo: any | null;
    signedInCountByDa: any | null;
    selectFieldsInShangjiCanshuPage: any | null;
    relatedClients: any | null;
    userWorkState: any | null;
    userIdentityCode: any | null;
    clientInfos: any | null;
    userMobile: string;
    id: number;
    loginWechatMpId: any | null;
    userIsTongluDoctor: number;
    canModifyHistoryHms: boolean;
    是否自动出库至二级默认仓库: any | null;
    userGoDepartment: any | null;
    userRfid: any | null;
    userGraduateTime: any | null;
    管理员能看到的客户列表: any | null;
    userSortOrder: number;
    userCustomSetting: string;
    hisCode: any | null;
    isRecvAlarm: any | null;
    selectedFieldsInCleanStatPage: any | null;
    排班时段选择项: any | null;
    userVsRoleList: any | null;
    userPassword: string;
    code: string;
    userSignPicUrl: any | null;
    userFromDepartment: any | null;
    roles: any | null;
    userAvatar: any | null;
    userNo: string;
    admin: boolean;
    remark: string;
    userAdmin: boolean;
    checkVersionCode: string;
    selectedFieldsInMedStat2: any | null;
    userTitle: string;
    isDeleted: number;
    nurse: boolean;
    canDeleteHistoryHms: boolean;
    userEmail: string;
    deletedTime: any | null;
    userWorkTimeFrom: any | null;
    prepareWorkMedicine: any | null;
    clientVsUserList: any | null;
    isValid: number;
    teamState: any | null;
    updateUser: number;
    updateTime: number;
    隐藏自备药: any | null;
    userName: string;
    selectFieldsInTodayOrderPage: any | null;
    isShow: number;
    doctor: boolean;
    isValidForClient: number;
    loginWechatUnionId: any | null;
    userGoDate: any | null;
    createTime: number;
    userInDate: any | null;
    clientCode: any | null;
    selectedFieldsInInventory2QueryPage: any | null;
    signedInCountByStatistics: any | null;
    createUser: number;
    userGender: number;
    userPinyin: string;
    listStatInfo: any | null;
}

interface OrderFreqInfo {
    code: string;
    dictIsCustom: number;
    updateUser: any | null;
    remark: any | null;
    updateTime: number;
    dictNo: string;
    dictType: string;
    dictIsEnable: number;
    isDeleted: number;
    createTime: number;
    hisCode: any | null;
    sortOrder: number;
    createUser: number;
    id: number;
    deletedTime: any | null;
    dictText: string;
}

interface OrderNameInfo {
    itemAgent: any | null;
    itemPermissionCode: any | null;
    inventoryItemTypeInfo: InventoryItemTypeInfo;
    itemIsUse: number;
    itemIsRestrictUse: number;
    itemCode: string;
    itemHisType: any | null;
    itemUnit: any | null;
    suntopItemCode: any | null;
    itemOutPrice: number;
    itemFactoryInfo: any | null;
    itemName: string;
    itemCommonUseInBothSide: any | null;
    id: number;
    当前使用量: any | null;
    剩余总量: any | null;
    storageCode: any | null;
    入库总量: any | null;
    透析器国网上报: DialyzerReport;
    hisCode: any | null;
    itemIsOutToPatient: number;
    itemSalePrice: number;
    itemIsReUse: number;
    itemPackageUnit: any | null;
    inStorageCountInfo: any | null;
    itemPackageUnitName: string;
    itemIsFavor: number;
    itemSpec: string;
    itemYibaoPrice: any | null;
    inventoryTypeCode: string;
    code: string;
    itemLicenseCode: any | null;
    itemAgentInfo: any | null;
    itemOperator: any | null;
    remark: any | null;
    批号对象列表: any | null;
    isDeleted: number;
    itemIsEnableManage: number;
    deletedTime: any | null;
    itemIsUseAsXt: number;
    itemName2: string;
    inventoryItemType: number;
    itemMoMaterial: any | null;
    itemMoArea: number;
    itemPinyin: string;
    itemTxqCleanRate: any | null;
    inventoryTypeName: any | null;
    itemSortOrder: number;
    updateUser: any | null;
    updateTime: number;
    结存: any | null;
    isShow: number;
    itemFactory: any | null;
    feeDrugInfo: FeeDrugInfo;
    itemOperatorInfo: any | null;
    itemPackageCount: any | null;
    createTime: number;
    clientCode: string;
    itemExtendJson: string;
    itemPeriodAlarmDays: number;
    itemRestrictUseRemark: any | null;
    createUser: number;
    itemUnitInfo: any | null;
    itemInPrice: number;
    itemInventoryAlarmCount: number;
    itemYibaoCode: any | null;
}

interface InventoryItemTypeInfo {
    code: string;
    typeName: string;
    updateUser: any | null;
    remark: any | null;
    updateTime: number;
    typeCategory: number;
    isShow: boolean;
    isDeleted: number;
    isEditable: number;
    createTime: number;
    clientCode: any | null;
    sortOrder: number;
    createUser: any | null;
    id: number;
    deletedTime: any | null;
}

interface DialyzerReport {
    eSA_促红素种类: string;
    抗凝剂_低分子肝素首剂量_IU: string;
    抗凝剂_总剂量: string;
    透析器透析膜: string;
    铁剂_其它静脉种类: string;
    eSA_用药方式: any[]; // 根据实际元素类型替换 any
    eSA_静脉剂量单位: string;
    铁剂_静脉剂量周: string;
    抗凝剂_枸橼酸钠速率每小时_ml: string;
    抗凝剂_阿加曲班追加速率_IU每小时: string;
    抗凝剂_肝素追加速率_mg每小时: string;
    透析器使用: string;
    抗凝剂_低分子肝素单位: string;
    抗凝剂_肝素首剂量_mg: string;
    抗凝剂_枸橼酸钠_其它钠浓度: string;
    抗凝剂_追加剂量: string;
    抗凝剂_其它抗凝剂: string;
    透析器类型: string;
    抗凝剂_阿加曲班_追加时间小时: string;
    抗凝剂_阿加曲班追加速率_mg每小时: string;
    抗凝剂_低分子肝素首剂量_mg: string;
    抗凝剂_阿加曲班首剂量_mg: string;
    透析器通量: string;
    抗凝剂_肝素首剂量_IU: string;
    铁剂_静脉种类: string;
    药品类型: string;
    eSA_皮下剂量: string;
    铁剂_口服剂量日: string;
    eSA_静脉剂量: string;
    抗凝剂_种类: string;
    抗凝剂_阿加曲班_追加时间分钟: string;
    eSA_促红素名称: string;
    抗凝剂_低分子肝素类型: string;
    铁剂_给药方式: string;
    抗凝剂_首剂量: string;
    抗凝剂_低分子肝素总剂量: string;
    抗凝剂_低分子肝素追加时间: string;
    抗凝剂_低分子肝素追加剂量_mg: string;
    抗凝剂_肝素_追加时间小时: string;
    铁剂_其它口服种类: string;
    抗凝剂_阿加曲班首剂量_IU: string;
    抗凝剂_枸橼酸钠_使用时间小时: string;
    抗凝剂_肝素_追加时间分钟: string;
    抗凝剂_枸橼酸钠浓度百分比: string;
    抗凝剂_肝素单位: string;
    抗凝剂_阿加曲班单位: string;
    eSA_皮下剂量单位: string;
    抗高血压药_分类: any[];
    抗凝剂_枸橼酸钠_使用时间分钟: string;
    抗凝剂_肝素追加速率_IU每小时: string;
    铁剂_口服种类: string;
    透析器膜面积: string;
    抗凝剂_是否使用华法林: string;
    抗凝剂_低分子肝素追加剂量_IU: string;
    eSA_其它促红素说明: string;
    铁剂_口服剂量单位: string;
    铁剂_静脉剂量单位: string;
}

interface FeeDrugInfo {
    drugBarcode: string;
    drugIsNeedTest: number;
    drugUsePeriodName: string;
    drugProduceLocation: string;
    drugPriceYibao: number;
    drugUseTypeName: string;
    drugPermissionCode: string;
    drugCategory: number;
    drugPackageType: number;
    drugPackageUnitAlias: string;
    drugSpec: string;
    drugAntibioticLevel: number;
    drugJixing: string;
    drugHisCode: any | null;
    drugInventoryPackageTypeName: any | null;
    drugBenweiCode: string;
    id: number;
    drugUseMethodName: string;
    drugIsFavor: number;
    drugPackageUnitName: string;
    drugPackageSum: number;
    drugSortOrder: number;
    drugYibaoCode: string;
    inventoryItemDetailCode: string;
    drugName2: string;
    drugUseUnitName: string;
    drugUnit: string;
    drugUsePeriod: string;
    drugInventoryPackageCount: number;
    drugUseMethod: string;
    drugName: string;
    drugUseUnit: string;
    drugInventoryPackageType: string;
    drugUseOnetime: string;
    code: string;
    drugCode: string;
    drugPackageUnit: string;
    drugProduceFactoryName: any | null;
    drugYlCode: string;
    remark: string;
    drugLimitUseText: string;
    drugProduceFactory: string;
    drugUnitName: string;
    isDeleted: number;
    drugInventoryAlertDays: number;
    drugPriceIn: number;
    drugStatus: number;
    drugPriceCategory: number;
    drugVsDiagnoseName: any | null;
    drugSyncPrice: number;
    deletedTime: any | null;
    drugPackageUnitAliasName: string;
    drugPinyin: string;
    drugVsDiagnose: string;
    drugGansuUseLimit: any | null;
    drugProperty: string;
    drugJixingName: string;
    drugPriceSale: number;
    updateUser: any | null;
    drugTransfer1: any | null;
    updateTime: number;
    drugTransfer2: any | null;
    drugUseType: string;
    drugLimitUseType: number;
    drugInventoryAlertValidDays: number;
    createTime: number;
    createUser: any | null;
    drugMonitorCode: string;
    drugPlusPercent: number;
    drugInHospitalUseType: number;
    drugSpecialProperty: number;
    drugBaseType: number;
}

interface OrderFromInfo {
    code: string;
    dictIsCustom: number;
    updateUser: any | null;
    remark: any | null;
    updateTime: number;
    dictNo: string;
    dictType: string;
    dictIsEnable: number;
    isDeleted: number;
    createTime: number;
    hisCode: any | null;
    sortOrder: number;
    createUser: any | null;
    id: number;
    deletedTime: any | null;
    dictText: string;
}

 src/main.ts

@@ -6,4 +6,9 @@
import router from './router';
import App from './App.vue'

// 如果需要在手机平板上打开控制台，安装一个这个
// import VConsole from 'vconsole'
// const vConsole = new VConsole()
// console.log('vConsole is ready.')

createApp(App).use(router).use(ElementPlus).use(Vant).mount('#app')

 src/views/deviceWindoes2.vue

@@ -2,7 +2,7 @@
  <div class="divice">
    <!-- {{数据初始化}} -->
    <div class="youzhiliao" style="height: 100%" v-if="deviceData.患者姓名">
      <div class="toubu" style="height: 11%">
      <div id="toubu" class="toubu" style="height: 11%">
        <el-row
          v-if="deviceData.患者姓名 !== ''"
          style="
@@ -79,6 +79,8 @@
          </div>
        </el-row>
      </div>
      <el-carousel v-if="contentHeight > 0" height="auto" :autoplay="false" motion-blur :initial-index="0">
        <el-carousel-item :style="{ height: (contentHeight - 10) + 'px' }">
      <div class="chongjian" style="height: 50%">
        <el-row :gutter="20" style="height: 100%; padding: 20px 20px 10px 20px">
          <el-col :span="6" style="height: 100%; padding-bottom: 10px">
@@ -1088,6 +1090,11 @@
          </el-col>
        </el-row>
      </div>
      </el-carousel-item>
      <el-carousel-item :style="{ height: (contentHeight - 10) + 'px' }">
        <DoctorAdvice :height="(contentHeight - 10)" :list="deviceData.透析单医嘱列表" />
      </el-carousel-item>
    </el-carousel>
    </div>
    <div v-else style="height: 100%">
      <div class="toubu" style="height: 11%">
@@ -1676,11 +1683,13 @@
  watch,
  onUnmounted,
  onBeforeUnmount,
  nextTick
} from "vue";
import { Local } from "../utils/storage";
import * as echarts from "echarts";
import { jgTime4 } from "../utils/formatTime";
import { setTimeoutAlert } from "../utils/httpApi";
import DoctorAdvice from '../components/doctorAdvice/index.vue';
// 创建 Audio 对象，指向 public 目录下的音频文件
const alarmSound = new Audio(alertbaojin)

@@ -1734,6 +1743,7 @@

const 当前客户耗材集合 = ref({});
const deviceData = ref({
  透析单医嘱列表: [],
  iot_传输时间: "2025-01-10 19:15:24",
  iot_当前脱水量: 2.04,
  iot_脱水目标量: 3.3,
@@ -1908,6 +1918,7 @@
const wd = ref("");
const ls = ref("");
const ddd = ref("");
const contentHeight = ref(0); // 中间内容的高度
const isShowXY = computed(() => {
  if (床旁血压计.value.zuihouTime > shishiTime.value) {
    return true;
@@ -1920,9 +1931,11 @@
  () => {
    if (床旁血压计.value.zuihouTime > shishiTime.value) {
    } else {
            nextTick(() => {
      setTimeout(() => {
        initTupiao();
      }, 500);
            });
    }
  }
);
@@ -2240,9 +2253,24 @@
      if (!xiaoduzhuangti.value) {
        initTupiao();
      }
    }, 500);
    }, 1000);
  }
);

watch(() => deviceData.value.患者姓名, (newVal: string) => {
  console.log("患者姓名变化:", newVal);
  if (newVal) {
    contentHeight.value = 0; // 重置高度
    setTimeout(() => {
    const windowHeight = window.innerHeight
    const toubu = document.getElementById('toubu')
    const toubuHeight = toubu ? toubu.offsetHeight : 0
    contentHeight.value = windowHeight - toubuHeight
    console.log("contentHeight.value: ", contentHeight.value)
    }, 500);
  }
})

const 数据初始化 = ref(false);
//创建链接对象
const creatSource = () => {
@@ -2307,9 +2335,13 @@
              dbp: dataBody?.床旁血压结果?.dbp,
              zuihouTime: date,
            };

            nextTick(() => {
            setTimeout(() => {
              initTupiao();
            }, 500);
            });

          } else if (dataBody.推送类型 === "中央监控大屏信息") {
            数据初始化.value = false;
            // loading.close()
@@ -2329,6 +2361,9 @@
            deviceData.value.属性历史列表 = dataBody?.IOT信息?.属性历史列表;
            console.log(deviceData.value.设备变化);
            deviceData.value.设备状态列表 = dataBody.IOT信息.状态列表;
            if ('透析单医嘱列表' in dataBody.透析状态) {
              deviceData.value.透析单医嘱列表 = dataBody.透析状态.透析单医嘱列表;
            }
          }
        }
      }
@@ -2580,9 +2615,14 @@
        xAxisData.push(1);
      }
      try {
        const myChart = echarts.init(
        let myChart = null;

        if (proxy.$refs["echartsDiv" + deviceData.value.设备编号]) {
          myChart = echarts.init(
          proxy.$refs["echartsDiv" + deviceData.value.设备编号]
        );
        }

        const option = {
          // backgroundColor: 床旁血压计.value.zuihouTime>shishiTime.value?'#ffffff':textcolor.value,
          backgroundColor: "#ffffff",
@@ -2619,15 +2659,22 @@
          },
          series: seriesData,
        };
        if (myChart) {
        myChart.setOption(option);
        }
      } catch (e) {
        console.log("图标渲染异常异常");
      }
    } else {
      try {
        const myChart = echarts.init(
        let myChart = null;

        if (proxy.$refs["echartsDiv" + deviceData.value.设备编号]) {
          myChart = echarts.init(
          proxy.$refs["echartsDiv" + deviceData.value.设备编号]
        );
        }


        const option = {
          backgroundColor:
@@ -2662,8 +2709,11 @@
          },
          series: [],
        };
        if (myChart) {
        myChart.setOption(option);
        }
      } catch (e) {
        console.log("图表渲染异常异常: ", e);
        console.log(
          "异常",
          proxy.$refs["echartsDiv" + deviceData.value.设备编号]
@@ -2671,7 +2721,6 @@
      }
    }
  } else if (deviceData.value.患者姓名 === "") {
    console.log("2222");
    const tbdata1 = [];
    const tbdata2 = [];
    const tbdata3 = [];
@@ -2707,15 +2756,28 @@
    }
    try {
      console.log("渲染设备");
      const myChart1 = echarts.init(
      let myChart1 = null;
      let myChart2 = null;
      let myChart3 = null;

      if (proxy.$refs["echartsDivwd" + deviceData.value.设备编号]) {
        myChart1 = echarts.init(
        proxy.$refs["echartsDivwd" + deviceData.value.设备编号]
      );
      const myChart2 = echarts.init(
      }

      if (proxy.$refs["echartsDivls" + deviceData.value.设备编号]) {
          myChart2 = echarts.init(
        proxy.$refs["echartsDivls" + deviceData.value.设备编号]
      );
      const myChart3 = echarts.init(
      }

      if (proxy.$refs["echartsDivddd" + deviceData.value.设备编号]) {
        myChart3 = echarts.init(
        proxy.$refs["echartsDivddd" + deviceData.value.设备编号]
      );
      }

      const option1 = {
        // backgroundColor: textcolor.value,
        tooltip: {
@@ -2838,9 +2900,15 @@
          },
        ],
      };
      if (myChart1) {
      myChart1.setOption(option1);
      }
      if (myChart2) {
      myChart2.setOption(option2);
      }
      if (myChart3) {
      myChart3.setOption(option3);
      }
    } catch (e) {
      console.log("图标渲染异常异常");
    }