ID1625-已签到页面暂存

zhangchen

2025-07-22 f8fe2290f6279451beaa96142765343edaee25be

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

@@ -1,19 +1,25 @@
<template>
  <div class="under-treatment-container" :style="{ '--height': height + 'px' }">
    <div class="row-1">
      <div class="row-1-col-1">
        <el-image
          :src="pageData.patientPhone"
          style="width: 100%; height: 100%"
        >
          <template #placeholder>
            <div class="image-slot">加载中<span class="dot">...</span></div>
          </template>
        </el-image>
    <div class="left-box">
      <div class="left-row1">
        <div class="left-row1-col1">
          <el-image
            :src="pageData.patientPhone"
            style="width: 100%; height: 100%"
          >
            <template #placeholder>
              <div class="image-slot">加载中<span class="dot">...</span></div>
            </template>
          </el-image>
        </div>
        <div class="left-row1-col2"></div>
        <div class="left-row1-col3"></div>
      </div>
      <div class="left-row2"></div>
      <div class="left-row3"></div>
      <div class="left-row4"></div>
    </div>
    <div class="row-2"></div>
    <div class="row-3"></div>
    <div class="right-box"></div>
  </div>
</template>
<script lang="ts" setup name="UnderTreatment">
@@ -37,11 +43,60 @@
</script>

<style lang="less" scoped>
* {
  box-sizing: border-box;
}

.under-treatment-container {
  display: flex;
  align-items: center;
  flex-direction: column;
  align-items: flex-start;
  height: var(--height);
  gap: 4px;
  padding-bottom: 2px;
  overflow: hidden;
  .left-box {
    flex: 0 0 58.25%;
    height: calc(100% - 12px);
    display: flex;
    align-items: flex-start;
    flex-direction: column;
    gap: 4px;
    div {
      width: 100%;
    }
    .left-row1 {
      flex: 0 0 41.99%;
      // width: calc(100% - 8px);
      gap: 4px;
      display: flex;
      background: blue;
      .left-row1-col1 {
        flex: 0 0 26.94%;
      }
      .left-row1-col2 {
        flex: 0 0 26.42%;
      }
      .left-row1-col3 {
        flex: 0 0 46.63%;
      }
    }
    .left-row2 {
      flex: 0 0 22.65%;
      background: yellow;
    }
    .left-row3 {
      flex: 0 0 22.65%;
      background: orange;
    }
    .left-row4 {
      flex: 0 0 12.71%;
      background: purple;
    }
  }
  .right-box {
    flex: 0 0 41.75%;
    height: 100%;
    background: green;
  }
}
</style>