各表单布局调整

WXL

4 天以前 c4599aa279fd2f90b741608392e056fbae2282d5

 src/views/business/decide/DecideInfo.vue

@@ -1,6 +1,6 @@
<template>
  <div class="death-judgment-detail">
    <case-basic-info :case-id="caseId" :show-attachment="true" />
    <case-basic-info :case-id="caseId" :show-attachment="true":column="3" />
    <!-- 公共信息模块（独立显示） -->

    <!-- 判定类型标签页 -->
@@ -51,7 +51,7 @@
      </el-form>
    </el-card> -->
    <!-- 脑死亡判定模块 -->
    <el-card v-if="activeJudgmentType === 'brain'" class="detail-card">
    <el-card v-if="activeJudgmentType === 'brain'" class="detail-card paper-card">
      <div slot="header" class="clearfix">
        <span class="detail-title">脑死亡判定信息</span>

@@ -65,18 +65,15 @@
        </el-button>
      </div>

      <el-form :model="form" ref="brainForm" :rules="rules" label-width="120px">
        <el-row :gutter="20">
          <el-col :span="8">
            <el-form-item label="死亡原因" prop="deathreason">
      <el-form :model="form" ref="brainForm" :rules="rules" label-width="120px" class="paper-form">
        <div class="form-row">
          <el-form-item label="死亡原因" prop="deathreason" class="col-1-3">
              <el-input v-model="form.deathreason" :readonly="!isEdit" />
            </el-form-item>
          </el-col>
        </el-row>
        </div>

        <el-row :gutter="20">
          <el-col :span="8">
            <el-form-item label="死亡时间" prop="deathtime">
        <div class="form-row">
          <el-form-item label="死亡时间" prop="deathtime" class="col-1-3">
              <el-date-picker
                v-model="form.deathtime"
                type="datetime"
@@ -85,21 +82,15 @@
                :disabled="!isEdit"
              />
            </el-form-item>
          </el-col>
          <el-col :span="8">
            <el-form-item label="判定医生一" prop="deathjudgedocto">
          <el-form-item label="判定医生一" prop="deathjudgedocto" class="col-1-3">
              <el-input v-model="form.deathjudgedocto" :readonly="!isEdit" />
            </el-form-item>
          </el-col>
          <el-col :span="8">
            <el-form-item label="判定医生二" prop="deathjudgedoctt">
          <el-form-item label="判定医生二" prop="deathjudgedoctt" class="col-1-3">
              <el-input v-model="form.deathjudgedoctt" :readonly="!isEdit" />
            </el-form-item>
          </el-col>
        </el-row>
        <el-row :gutter="20">
          <el-col :span="24">
            <el-form-item label="其他判定医生">
        </div>
        <div class="form-row">
          <el-form-item label="其他判定医生" class="col-full">
              <div
                v-for="(doctor, index) in brainExtraDoctors"
                :key="index"
@@ -130,8 +121,7 @@
                添加医生
              </el-button>
            </el-form-item>
          </el-col>
        </el-row>
        </div>
      </el-form>

      <!-- 脑死亡评估表附件 -->
@@ -253,7 +243,7 @@
    </el-card>

    <!-- 心死亡判定模块 -->
    <el-card v-else class="detail-card">
    <el-card v-else class="detail-card paper-card">
      <div slot="header" class="clearfix">
        <span class="detail-title">心死亡判定信息</span>
        <el-button
@@ -275,18 +265,15 @@
        </el-button>
      </div>

      <el-form :model="form" ref="heartForm" :rules="rules" label-width="120px">
        <el-row :gutter="20">
          <el-col :span="8">
            <el-form-item label="心死亡原因" prop="heartdeathreason">
      <el-form :model="form" ref="heartForm" :rules="rules" label-width="120px" class="paper-form">
        <div class="form-row">
          <el-form-item label="心死亡原因" prop="heartdeathreason" class="col-1-3">
              <el-input v-model="form.heartdeathreason" :readonly="!isEdit" />
            </el-form-item>
          </el-col>
        </el-row>
        </div>

        <el-row :gutter="20">
          <el-col :span="8">
            <el-form-item label="心死亡判定完成时间" prop="heartdeathtime">
        <div class="form-row">
          <el-form-item label="心死亡判定完成时间" prop="heartdeathtime" class="col-1-3">
              <el-date-picker
                v-model="form.heartdeathtime"
                type="datetime"
@@ -295,27 +282,21 @@
                :disabled="!isEdit"
              />
            </el-form-item>
          </el-col>
          <el-col :span="8">
            <el-form-item label="判定医生一" prop="heartdeathjudgedocto">
          <el-form-item label="判定医生一" prop="heartdeathjudgedocto" class="col-1-3">
              <el-input
                v-model="form.heartdeathjudgedocto"
                :readonly="!isEdit"
              />
            </el-form-item>
          </el-col>
          <el-col :span="8">
            <el-form-item label="判定医生二" prop="heartdeathjudgedoctt">
          <el-form-item label="判定医生二" prop="heartdeathjudgedoctt" class="col-1-3">
              <el-input
                v-model="form.heartdeathjudgedoctt"
                :readonly="!isEdit"
              />
            </el-form-item>
          </el-col>
        </el-row>
        <el-row :gutter="20">
          <el-col :span="24">
            <el-form-item label="其他判定医生">
        </div>
        <div class="form-row">
          <el-form-item label="其他判定医生" class="col-full">
              <div
                v-for="(doctor, index) in heartExtraDoctors"
                :key="index"
@@ -346,8 +327,7 @@
                添加医生
              </el-button>
            </el-form-item>
          </el-col>
        </el-row>
        </div>
      </el-form>

      <!-- 心死亡评估表附件 -->
@@ -1398,4 +1378,73 @@
:deep(.image-preview-dialog .el-message-box__content) {
  text-align: center;
}

/* ===== 纸质表格网格样式 ===== */
.paper-card >>> .el-card__body {
  padding: 16px;
}

.paper-form {
  border-left: 1px solid #d0d3db;
  background: #fff;
}

.paper-form >>> .form-row {
  display: flex;
  width: 100%;
  border-top: 1px solid #d0d3db;
}

.paper-form >>> .el-form-item {
  flex: 0 0 33.3333%;
  display: flex;
  margin: 0;
  background: #fff;
  border-right: 1px solid #d0d3db;
  border-bottom: 1px solid #d0d3db;
}
.paper-form >>> .el-form-item::after,
.paper-form >>> .el-form-item::before {
  display: none;
}

.paper-form >>> .col-1-3 { flex: 0 0 33.3333%; }
.paper-form >>> .col-half { flex: 0 0 50%; }
.paper-form >>> .col-2-3 { flex: 0 0 66.6666%; }
.paper-form >>> .col-full { flex: 0 0 100%; }

.paper-form >>> .el-form-item__label {
  flex: 0 0 120px;
  width: 120px !important;
  float: none;
  padding: 0 8px !important;
  background: #ecf5ff;
  border-right: 1px solid #d0d3db;
  display: flex;
  align-items: center;
  justify-content: center;
  text-align: center;
  font-size: 13px;
  font-weight: 600;
  color: #2c3038;
  line-height: 1.3;
  white-space: normal;
  word-break: break-all;
}
.paper-form >>> .el-form-item.is-required:not(.is-no-asterisk) > .el-form-item__label:before {
  color: #f56c6c;
  margin-right: 2px;
}

.paper-form >>> .el-form-item__content {
  flex: 1;
  margin-left: 0 !important;
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  padding: 6px 10px;
  background: #fff;
  min-height: 42px;
  line-height: 1.4;
}
</style>