测试完成

WXL (wul)

16 小时以前 a9d2b856e0f6be6475319c2dc36bf405c2f908fc

 src/views/patient/archives/maternalHealth/detail.vue

@@ -3,10 +3,18 @@
    <template v-if="archive">
      <div class="action-bar">
        <el-button @click="$router.go(-1)" icon="el-icon-back">返回</el-button>
        <el-button :type="editing ? 'success' : 'primary'" :icon="editing ? 'el-icon-check' : 'el-icon-edit'" @click="toggleEdit">{{ editing ? '保存' : '编辑' }}</el-button>
        <el-tag :type="archive.subType === 'pregnancy' ? 'success' : 'warning'" style="margin-left:12px">{{ archive.subTypeLabel }}</el-tag>
        <el-button :type="editing ? 'success' : 'primary'" :icon="editing ? 'el-icon-check' : 'el-icon-edit'" @click="toggleEdit">
          {{ editing ? '保存' : '编辑' }}
        </el-button>
        <el-button v-if="archive.closeStatus != 1" type="danger" plain icon="el-icon-circle-close" @click="handleCloseCase">结案</el-button>
        <el-tag :type="archive.closeStatus == 1 ? 'info' : 'success'" style="margin-left:12px">
          {{ archive.closeStatus == 1 ? '已结案' : '未结案' }}
        </el-tag>
        <el-tag :type="archive.subType === 'pregnancy' ? 'success' : 'warning'" style="margin-left:8px">{{ archive.subTypeLabel }}</el-tag>
      </div>

      <el-tabs v-model="mainTab" type="border-card">
        <el-tab-pane label="档案详情" name="detail">
      <!-- 患者基本信息 -->
      <el-card class="info-card" shadow="never">
        <div slot="header" class="card-header"><span>患者基本信息</span></div>
@@ -14,140 +22,243 @@
          <el-col :span="6"><InfoField label="姓名" :value="archive.patname" /></el-col>
          <el-col :span="6"><InfoField label="性别" :value="archive.sex == 1 ? '男' : '女'" /></el-col>
          <el-col :span="6"><InfoField label="年龄" :value="archive.age" /></el-col>
          <el-col :span="6"><InfoField label="电话" :value="archive.telcode" /></el-col>
              <el-col :span="6"><InfoField label="联系电话" :value="archive.telcode" /></el-col>
        </el-row>
        <el-row :gutter="20" style="margin-top:10px">
          <el-col :span="6"><InfoField label="科室" :value="archive.deptname" /></el-col>
          <el-col :span="6"><InfoField label="诊断" :value="archive.diagname" /></el-col>
          <el-col :span="6"><InfoField label="主治医生" :value="archive.drname" /></el-col>
          <el-col :span="6"><InfoField label="来源" :value="sourceLabel" /></el-col>
        </el-row>
      </el-card>

      <!-- 档案基本信息 -->
      <el-card class="info-card" shadow="never" style="margin-top:14px">
        <div slot="header" class="card-header">
          <span>档案基本信息</span>
          <span class="header-sub">{{ archive.createTime ? archive.createTime.substring(0,10) : '-' }} 建档</span>
        </div>
          <!-- ===== 孕妇随访：档案信息 + 首诊信息 + 妊娠情况 合并区块 ===== -->
          <el-card v-if="archive.subType === 'pregnancy'" class="info-card" shadow="never" style="margin-top:14px">
            <div class="sub-section">
              <div class="sub-title">档案信息</div>
              <el-form :model="archive" label-width="110px" size="small" :disabled="!editing">
        <el-row :gutter="20">
          <el-col :span="8"><InfoField label="建档类型" :value="archive.subTypeLabel" /></el-col>
          <el-col :span="8"><InfoField label="建档医生" :value="archive.archiveForm.doctorName" :editing="editing" v-model="archive.archiveForm.doctorName" /></el-col>
          <el-col :span="8"><InfoField label="建档时间" :value="archive.createTime" /></el-col>
                  <el-col :span="8"><el-form-item label="身份证号"><el-input v-model="archive.idcardno" class="w-md" /></el-form-item></el-col>
                  <el-col :span="8"><el-form-item label="出生日期"><el-date-picker v-model="archive.birthday" value-format="yyyy-MM-dd" class="w-md" /></el-form-item></el-col>
                  <el-col :span="8"><el-form-item label="诊断日期"><el-date-picker v-model="archive.diagnosisDate" value-format="yyyy-MM-dd" class="w-md" /></el-form-item></el-col>
        </el-row>
        <!-- 孕妇专属 -->
        <el-row v-if="archive.subType === 'pregnancy'" :gutter="20" style="margin-top:10px">
          <el-col :span="6"><InfoField label="孕周" :value="archive.archiveForm.gestationalWeek" :editing="editing" v-model="archive.archiveForm.gestationalWeek" type="number" /></el-col>
          <el-col :span="6"><InfoField label="孕次/产次" :value="'G'+(archive.archiveForm.gravidity||1)+'P'+(archive.archiveForm.parity||0)" /></el-col>
          <el-col :span="6"><InfoField label="预产期" :value="archive.archiveForm.edd" /></el-col>
          <el-col :span="6"><InfoField label="高危妊娠" :value="archive.archiveForm.highRiskPregnancy ? '是' : '否'" /></el-col>
                <el-row :gutter="20">
                  <el-col :span="8"><el-form-item label="主治医生"><el-input v-model="archive.attendingDoctor" class="w-sm" /></el-form-item></el-col>
                  <el-col :span="8"><el-form-item label="经管医生"><el-input v-model="archive.managingDoctor" class="w-sm" /></el-form-item></el-col>
                  <el-col :span="8"><el-form-item label="登记人员"><el-input v-model="archive.registrant" class="w-sm" /></el-form-item></el-col>
        </el-row>
        <el-row v-if="archive.subType === 'menopause'" :gutter="20" style="margin-top:10px">
          <el-col :span="8"><InfoField label="月经状态" :value="menstrualLabel" /></el-col>
          <el-col :span="8"><InfoField label="末次月经" :value="archive.archiveForm.lmp" /></el-col>
              </el-form>
            </div>

            <div class="sub-section">
              <div class="sub-title">孕妇首诊信息登记</div>
              <el-form :model="pregForm.firstVisit" label-width="120px" size="small" :disabled="!editing">
                <el-row :gutter="20">
                  <el-col :span="8"><el-form-item label="就诊号"><el-input v-model="pregForm.firstVisit.visitNo" class="w-sm" /></el-form-item></el-col>
                  <el-col :span="8"><el-form-item label="本人联系方式"><el-input v-model="pregForm.firstVisit.selfPhone" class="w-sm" /></el-form-item></el-col>
                  <el-col :span="8"><el-form-item label="病区姓名"><el-input v-model="pregForm.firstVisit.wardName" class="w-sm" /></el-form-item></el-col>
        </el-row>
                <el-row :gutter="20">
                  <el-col :span="8"><el-form-item label="联系人联系方式"><el-input v-model="pregForm.firstVisit.contactPhone" class="w-sm" /></el-form-item></el-col>
                  <el-col :span="8"><el-form-item label="身份证号"><el-input v-model="pregForm.firstVisit.idcardno" class="w-md" /></el-form-item></el-col>
                  <el-col :span="8"><el-form-item label="首诊医生"><el-input v-model="pregForm.firstVisit.firstDoctor" class="w-sm" /></el-form-item></el-col>
                </el-row>
                <el-row :gutter="20">
                  <el-col :span="8"><el-form-item label="诊断名称"><el-input v-model="pregForm.firstVisit.diagname" class="w-full" /></el-form-item></el-col>
                  <el-col :span="16"><el-form-item label="居住地址"><el-input v-model="pregForm.firstVisit.address" class="w-full" /></el-form-item></el-col>
                </el-row>
              </el-form>
            </div>

            <div class="sub-section">
              <div class="sub-title">妊娠情况</div>
              <el-form label-width="0" size="small" :disabled="!editing">
                <el-row :gutter="24" class="preg-cascade">
                  <el-col :span="8">
                    <div class="cascade-col">
                      <div class="cascade-label">妊娠情况</div>
                      <el-radio-group v-model="pregForm.pregnancy.status" @change="onPregnancyStatusChange">
                        <el-radio v-for="(opt, key) in PREGNANCY_OPTIONS" :key="key" :label="key">{{ opt.label }}</el-radio>
                      </el-radio-group>
                    </div>
                  </el-col>
                  <el-col :span="8">
                    <div class="cascade-col">
                      <div class="cascade-label">具体情况</div>
                      <el-checkbox-group v-model="pregForm.pregnancy.details" :disabled="!pregForm.pregnancy.status">
                        <el-checkbox v-for="d in pregnancySubOptions" :key="d" :label="d">{{ d }}</el-checkbox>
                      </el-checkbox-group>
                      <div v-if="!pregForm.pregnancy.status" class="cascade-empty">请先选择妊娠情况</div>
                    </div>
                  </el-col>
                  <el-col :span="8">
                    <div class="cascade-col">
                      <div class="cascade-label">处理建议</div>
                      <el-checkbox-group v-model="pregForm.pregnancy.hint" :disabled="!pregForm.pregnancy.status">
                        <el-checkbox v-for="h in pregnancyHintOptions" :key="h" :label="h">{{ h }}</el-checkbox>
                      </el-checkbox-group>
                      <div v-if="!pregForm.pregnancy.status" class="cascade-empty">请先选择妊娠情况</div>
                    </div>
                  </el-col>
                </el-row>
              </el-form>
            </div>
      </el-card>

      <!-- ===== 孕妇随访：3个表单 ===== -->
      <template v-if="archive.subType === 'pregnancy'">
          <!-- 是否建册（孕妇随访） -->
          <el-card v-if="archive.subType === 'pregnancy'" class="info-card" shadow="never" style="margin-top:14px">
            <div slot="header" class="card-header"><span>是否建册</span></div>
            <el-form :model="pregForm.registration" label-width="120px" size="small" :disabled="!editing">
              <el-row :gutter="20">
                <el-col :span="8"><el-form-item label="是否建册">
                  <el-radio-group v-model="pregForm.registration.isRegistered">
                    <el-radio label="是">是</el-radio><el-radio label="否">否</el-radio>
                  </el-radio-group>
                </el-form-item></el-col>
                <el-col :span="8"><el-form-item label="预产期"><el-date-picker v-model="pregForm.registration.edd" value-format="yyyy-MM-dd" class="w-md" /></el-form-item></el-col>
                <el-col :span="8"><el-form-item label="记录者"><el-input v-model="pregForm.registration.recorder" class="w-sm" /></el-form-item></el-col>
              </el-row>
              <el-form-item v-if="pregForm.registration.isRegistered === '否'" label="未建档原因">
                <el-input v-model="pregForm.registration.unregisteredReason" type="textarea" :rows="2" class="w-lg" />
              </el-form-item>
            </el-form>
          </el-card>

          <!-- ===== 围绝经期MHI：档案信息（含随访周期次数） ===== -->
          <el-card v-if="archive.subType === 'menopause'" class="info-card" shadow="never" style="margin-top:14px">
            <div slot="header" class="card-header">
              <span>档案信息</span>
              <span class="header-sub">{{ archive.createTime ? archive.createTime.substring(0,10) : '-' }} 建档</span>
            </div>
            <el-form :model="archive" label-width="110px" size="small" :disabled="!editing">
              <el-row :gutter="20">
                <el-col :span="8"><el-form-item label="身份证号"><el-input v-model="archive.idcardno" class="w-md" /></el-form-item></el-col>
                <el-col :span="8"><el-form-item label="出生日期"><el-date-picker v-model="archive.birthday" value-format="yyyy-MM-dd" class="w-md" /></el-form-item></el-col>
                <el-col :span="8"><el-form-item label="诊断日期"><el-date-picker v-model="archive.diagnosisDate" value-format="yyyy-MM-dd" class="w-md" /></el-form-item></el-col>
              </el-row>
              <el-row :gutter="20">
                <el-col :span="8"><el-form-item label="主治医生"><el-input v-model="archive.attendingDoctor" class="w-sm" /></el-form-item></el-col>
                <el-col :span="8"><el-form-item label="经管医生"><el-input v-model="archive.managingDoctor" class="w-sm" /></el-form-item></el-col>
                <el-col :span="8"><el-form-item label="登记人员"><el-input v-model="archive.registrant" class="w-sm" /></el-form-item></el-col>
              </el-row>
              <el-row :gutter="20">
                <el-col :span="8"><el-form-item label="随访周期(次数)"><el-input v-model="archive.followupCycles" class="w-xs" /></el-form-item></el-col>
              </el-row>
            </el-form>
          </el-card>

          <!-- ===== 孕妇随访：早孕随访表 + 评分表（选中「经咨询指导后继续妊娠并在产科建档」后出现） ===== -->
          <template v-if="archive.subType === 'pregnancy' && showFollowUp">
        <el-card class="info-card" shadow="never" style="margin-top:14px">
          <div slot="header" class="card-header"><span>孕妇随访管理</span></div>
          <el-tabs v-model="activeTab" type="border-card">
            <!-- 1. 孕妇随访系统问题 -->
            <el-tab-pane label="孕妇随访系统问题" name="sysQ">
              <el-form :model="form.pregSysQ" label-width="150px" size="small" :disabled="!editing">
              <div slot="header" class="card-header"><span>早孕随访表</span></div>
              <el-form :model="pregForm.earlyFollow" label-width="140px" size="small" :disabled="!editing">
                <el-row :gutter="20">
                  <el-col :span="8"><el-form-item label="填写日期"><el-date-picker v-model="form.pregSysQ.date" value-format="yyyy-MM-dd" style="width:100%" /></el-form-item></el-col>
                  <el-col :span="8"><el-form-item label="孕周"><el-input-number v-model="form.pregSysQ.gestWeek" :min="1" :max="42" /></el-form-item></el-col>
                  <el-col :span="8"><el-form-item label="姓名"><el-input v-model="pregForm.earlyFollow.name" class="w-sm" /></el-form-item></el-col>
                  <el-col :span="8"><el-form-item label="年龄"><el-input v-model="pregForm.earlyFollow.age" class="w-xs" /></el-form-item></el-col>
                  <el-col :span="8"><el-form-item label="就诊号"><el-input v-model="pregForm.earlyFollow.visitNo" class="w-sm" /></el-form-item></el-col>
                </el-row>
                <el-row :gutter="20">
                  <el-col :span="8"><el-form-item label="体重(kg)"><el-input-number v-model="form.pregSysQ.weight" :precision="1" /></el-form-item></el-col>
                  <el-col :span="8"><el-form-item label="血压"><el-input v-model="form.pregSysQ.bloodPressure" placeholder="收缩压/舒张压" /></el-form-item></el-col>
                  <el-col :span="8"><el-form-item label="宫高(cm)"><el-input-number v-model="form.pregSysQ.fundalHeight" /></el-form-item></el-col>
                  <el-col :span="8"><el-form-item label="联系方式(微信)"><el-input v-model="pregForm.earlyFollow.wechat" class="w-sm" /></el-form-item></el-col>
                  <el-col :span="8"><el-form-item label="户籍"><el-input v-model="pregForm.earlyFollow.household" class="w-sm" /></el-form-item></el-col>
                  <el-col :span="8"><el-form-item label="孕产史"><el-input v-model="pregForm.earlyFollow.gravidaPara" placeholder="G_P_" class="w-xs" /></el-form-item></el-col>
                </el-row>
                <el-row :gutter="20">
                  <el-col :span="8"><el-form-item label="胎心(次/分)"><el-input-number v-model="form.pregSysQ.fetalHeart" /></el-form-item></el-col>
                  <el-col :span="8"><el-form-item label="水肿"><el-select v-model="form.pregSysQ.edema" style="width:100%"><el-option label="无" value="无" /><el-option label="+" value="+" /><el-option label="++" value="++" /><el-option label="+++" value="+++" /></el-select></el-form-item></el-col>
                  <el-col :span="8"><el-form-item label="尿蛋白"><el-select v-model="form.pregSysQ.urineProtein" style="width:100%"><el-option label="-" value="-" /><el-option label="±" value="±" /><el-option label="+" value="+" /><el-option label="++" value="++" /></el-select></el-form-item></el-col>
                  <el-col :span="8"><el-form-item label="婚姻状况">
                    <el-select v-model="pregForm.earlyFollow.maritalStatus" class="w-sm">
                      <el-option label="未婚" value="未婚" /><el-option label="已婚" value="已婚" /><el-option label="不详" value="不详" />
                    </el-select>
                  </el-form-item></el-col>
                  <el-col :span="8"><el-form-item label="建表日期"><el-date-picker v-model="pregForm.earlyFollow.buildDate" value-format="yyyy-MM-dd" class="w-md" /></el-form-item></el-col>
                  <el-col :span="8"><el-form-item label="预产期"><el-date-picker v-model="pregForm.earlyFollow.edd" value-format="yyyy-MM-dd" class="w-md" /></el-form-item></el-col>
                </el-row>
                <el-form-item label="自觉症状"><el-input v-model="form.pregSysQ.symptoms" type="textarea" :rows="2" placeholder="头晕/眼花/胸闷/腹痛等" /></el-form-item>
                <el-form-item label="处理意见"><el-input v-model="form.pregSysQ.advice" type="textarea" :rows="2" /></el-form-item>
                <el-form-item label="下次随访日期"><el-date-picker v-model="form.pregSysQ.nextVisit" value-format="yyyy-MM-dd" style="width:200px" /></el-form-item>
                <el-form-item label="随访医生"><el-input v-model="form.pregSysQ.doctor" style="width:200px" /></el-form-item>
                <el-form-item label="计划流产主要原因(可多选)">
                  <el-checkbox-group v-model="pregForm.earlyFollow.abortionReasons">
                    <el-checkbox label="已有多孩" /><el-checkbox label="经济因素" /><el-checkbox label="药物暴露" />
                    <el-checkbox label="未达结婚年龄" /><el-checkbox label="身体因素" /><el-checkbox label="家庭支持不足" />
                    <el-checkbox label="自身不愿生育" /><el-checkbox label="其他" />
                  </el-checkbox-group>
                  <el-input v-if="pregForm.earlyFollow.abortionReasons.includes('其他')" v-model="pregForm.earlyFollow.otherReason" placeholder="其他原因" class="w-md" style="margin-top:8px" />
                </el-form-item>
                <el-form-item label="继续妊娠">
                  <el-radio-group v-model="pregForm.earlyFollow.continuePregnancy">
                    <el-radio label="是">是</el-radio><el-radio label="否">否</el-radio>
                  </el-radio-group>
                </el-form-item>
                <el-row :gutter="20">
                  <el-col :span="16"><el-form-item label="早孕建册单位"><el-input v-model="pregForm.earlyFollow.registrationUnit" class="w-full" /></el-form-item></el-col>
                </el-row>
              </el-form>
            </el-tab-pane>

            <!-- 2. 孕妇首诊信息登记表 -->
            <el-tab-pane label="丽水妇幼保健院孕妇首诊信息登记表" name="firstVisit">
              <el-form :model="form.pregFirst" label-width="160px" size="small" :disabled="!editing">
                <el-divider content-position="left">基本信息</el-divider>
                <el-row :gutter="20">
                  <el-col :span="8"><el-form-item label="建档日期"><el-date-picker v-model="form.pregFirst.regDate" value-format="yyyy-MM-dd" style="width:100%" /></el-form-item></el-col>
                  <el-col :span="8"><el-form-item label="丈夫姓名"><el-input v-model="form.pregFirst.husbandName" /></el-form-item></el-col>
                  <el-col :span="8"><el-form-item label="丈夫电话"><el-input v-model="form.pregFirst.husbandPhone" /></el-form-item></el-col>
                </el-row>
                <el-row :gutter="20">
                  <el-col :span="8"><el-form-item label="末次月经"><el-date-picker v-model="form.pregFirst.lmp" value-format="yyyy-MM-dd" style="width:100%" /></el-form-item></el-col>
                  <el-col :span="8"><el-form-item label="预产期"><el-date-picker v-model="form.pregFirst.edd" value-format="yyyy-MM-dd" style="width:100%" /></el-form-item></el-col>
                  <el-col :span="8"><el-form-item label="孕次/产次"><el-input v-model="form.pregFirst.gp" placeholder="G_P_" /></el-form-item></el-col>
                </el-row>
                <el-divider content-position="left">既往史</el-divider>
                <el-row :gutter="20">
                  <el-col :span="8"><el-form-item label="剖宫产史"><el-select v-model="form.pregFirst.csHistory" style="width:100%"><el-option label="无" :value="0" /><el-option label="有" :value="1" /></el-select></el-form-item></el-col>
                  <el-col :span="8"><el-form-item label="流产史"><el-select v-model="form.pregFirst.abortionHistory" style="width:100%"><el-option label="无" :value="0" /><el-option label="有" :value="1" /></el-select></el-form-item></el-col>
                  <el-col :span="8"><el-form-item label="疾病史"><el-input v-model="form.pregFirst.diseaseHistory" placeholder="高血压/糖尿病/甲状腺等" /></el-form-item></el-col>
                </el-row>
                <el-divider content-position="left">本次妊娠情况</el-divider>
                <el-row :gutter="20">
                  <el-col :span="8"><el-form-item label="身高(cm)"><el-input-number v-model="form.pregFirst.height" :precision="1" /></el-form-item></el-col>
                  <el-col :span="8"><el-form-item label="孕前体重(kg)"><el-input-number v-model="form.pregFirst.preWeight" :precision="1" /></el-form-item></el-col>
                </el-row>
                <el-form-item label="高危因素评估"><el-input v-model="form.pregFirst.riskAssessment" type="textarea" :rows="2" /></el-form-item>
                <el-form-item label="建册医生"><el-input v-model="form.pregFirst.doctor" style="width:200px" /></el-form-item>
              </el-form>
            </el-tab-pane>
              <div class="sub-section">
                <div class="sub-title">辅导内容</div>
                <el-table :data="pregForm.counseling" border size="small">
                  <el-table-column label="辅导次数" width="120" align="center">
                    <template slot-scope="scope">{{ ['第一次辅导','第二次辅导','第三次辅导','第四次辅导'][scope.$index] }}</template>
                  </el-table-column>
                  <el-table-column label="辅导日期" width="160" align="center">
                    <template slot-scope="scope">
                      <el-date-picker v-if="editing" v-model="scope.row.date" value-format="yyyy-MM-dd" size="small" style="width:100%" />
                      <span v-else>{{ scope.row.date || '-' }}</span>
                    </template>
                  </el-table-column>
                  <el-table-column label="辅导内容" align="center">
                    <template slot-scope="scope">
                      <el-input v-if="editing" v-model="scope.row.content" size="small" />
                      <span v-else>{{ scope.row.content || '-' }}</span>
                    </template>
                  </el-table-column>
                  <el-table-column label="辅导人员" width="140" align="center">
                    <template slot-scope="scope">
                      <el-input v-if="editing" v-model="scope.row.person" size="small" />
                      <span v-else>{{ scope.row.person || '-' }}</span>
                    </template>
                  </el-table-column>
                </el-table>
              </div>

            <!-- 3. 早孕随访登记表 -->
            <el-tab-pane label="丽水妇幼保健院早孕随访登记表" name="earlyFollow">
              <el-form :model="form.pregEarly" label-width="150px" size="small" :disabled="!editing">
                <el-row :gutter="20">
                  <el-col :span="8"><el-form-item label="随访日期"><el-date-picker v-model="form.pregEarly.date" value-format="yyyy-MM-dd" style="width:100%" /></el-form-item></el-col>
                  <el-col :span="8"><el-form-item label="孕周"><el-input-number v-model="form.pregEarly.gestWeek" :min="1" :max="14" /></el-form-item></el-col>
                </el-row>
                <el-row :gutter="20">
                  <el-col :span="8"><el-form-item label="早孕反应"><el-select v-model="form.pregEarly.morningSickness" style="width:100%"><el-option label="无" value="无" /><el-option label="轻度" value="轻度" /><el-option label="中度" value="中度" /><el-option label="重度" value="重度" /></el-select></el-form-item></el-col>
                  <el-col :span="8"><el-form-item label="阴道出血"><el-select v-model="form.pregEarly.bleeding" style="width:100%"><el-option label="无" value="无" /><el-option label="有" value="有" /></el-select></el-form-item></el-col>
                  <el-col :span="8"><el-form-item label="腹痛"><el-select v-model="form.pregEarly.abdominalPain" style="width:100%"><el-option label="无" value="无" /><el-option label="有" value="有" /></el-select></el-form-item></el-col>
                </el-row>
                <el-row :gutter="20">
                  <el-col :span="8"><el-form-item label="血常规"><el-input v-model="form.pregEarly.bloodRoutine" placeholder="Hb/PLT等" /></el-form-item></el-col>
                  <el-col :span="8"><el-form-item label="尿常规"><el-input v-model="form.pregEarly.urineRoutine" /></el-form-item></el-col>
                  <el-col :span="8"><el-form-item label="B超检查"><el-input v-model="form.pregEarly.ultrasound" placeholder="CRL/NT等" /></el-form-item></el-col>
                </el-row>
                <el-form-item label="叶酸补充"><el-select v-model="form.pregEarly.folicAcid" style="width:200px"><el-option label="规律服用" value="规律服用" /><el-option label="偶尔服用" value="偶尔服用" /><el-option label="未服用" value="未服用" /></el-select></el-form-item>
                <el-form-item label="指导意见"><el-input v-model="form.pregEarly.advice" type="textarea" :rows="2" /></el-form-item>
                <el-form-item label="随访医生"><el-input v-model="form.pregEarly.doctor" style="width:200px" /></el-form-item>
              <div class="sub-section">
                <div class="sub-title">评分表</div>
                <el-form :model="pregForm.score" label-width="140px" size="small" :disabled="!editing" inline>
                  <el-form-item label="评分总分"><el-input-number v-model="pregForm.score.total" :controls="false" style="width:140px" /></el-form-item>
                  <el-form-item label="评估结果"><el-input v-model="pregForm.score.result" class="w-lg" /></el-form-item>
              </el-form>
            </el-tab-pane>
          </el-tabs>
              </div>
            </el-card>

            <!-- 随访周期 -->
            <el-card class="info-card" shadow="never" style="margin-top:14px">
              <div slot="header" class="card-header"><span>随访周期</span></div>
              <EditableTable :data.sync="pregForm.followupCycle" :editing="editing" :columns="followupColumns" />
            </el-card>

            <!-- 当前患者随访记录表 -->
            <el-card class="info-card" shadow="never" style="margin-top:14px">
              <div slot="header" class="card-header"><span>当前患者随访记录表</span></div>
              <el-table :data="currentFollowRecords" border size="small">
                <el-table-column type="index" label="序号" width="60" align="center" />
                <el-table-column prop="planDate" label="拟随访日期" width="130" align="center" />
                <el-table-column prop="status" label="状况" width="100" align="center" />
                <el-table-column prop="method" label="随访方式" width="110" align="center" />
                <el-table-column prop="situation" label="随访情况" align="center" show-overflow-tooltip />
                <el-table-column prop="followDate" label="随访日期" width="130" align="center" />
                <el-table-column prop="staff" label="随访人员" width="110" align="center" />
              </el-table>
        </el-card>
      </template>

      <!-- ===== 更年期随访：6个表单 ===== -->
          <!-- ===== 围绝经期MHI：6 个量表 tab ===== -->
      <template v-if="archive.subType === 'menopause'">
        <el-card class="info-card" shadow="never" style="margin-top:14px">
          <div slot="header" class="card-header"><span>更年期随访管理</span></div>
              <div slot="header" class="card-header"><span>围绝经期MHI管理</span></div>
          <el-tabs v-model="activeTab" type="border-card">
            <!-- 1. 更年期随访系统问题表 -->
            <el-tab-pane label="更年期随访系统问题表" name="sysQ">
              <el-form :model="form.menoSysQ" label-width="150px" size="small" :disabled="!editing">
                <el-row :gutter="20">
                  <el-col :span="8"><el-form-item label="填写日期"><el-date-picker v-model="form.menoSysQ.date" value-format="yyyy-MM-dd" style="width:100%" /></el-form-item></el-col>
                      <el-col :span="8"><el-form-item label="填写日期"><el-date-picker v-model="form.menoSysQ.date" value-format="yyyy-MM-dd" class="w-md" /></el-form-item></el-col>
                  <el-col :span="8"><el-form-item label="年龄"><el-input-number v-model="form.menoSysQ.age" /></el-form-item></el-col>
                </el-row>
                <el-row :gutter="20">
                  <el-col :span="8"><el-form-item label="月经情况"><el-input v-model="form.menoSysQ.menstruation" placeholder="周期/经期/经量" /></el-form-item></el-col>
                  <el-col :span="8"><el-form-item label="末次月经"><el-date-picker v-model="form.menoSysQ.lmp" value-format="yyyy-MM-dd" style="width:100%" /></el-form-item></el-col>
                      <el-col :span="8"><el-form-item label="月经情况"><el-input v-model="form.menoSysQ.menstruation" placeholder="周期/经期/经量" class="w-md" /></el-form-item></el-col>
                      <el-col :span="8"><el-form-item label="末次月经"><el-date-picker v-model="form.menoSysQ.lmp" value-format="yyyy-MM-dd" class="w-md" /></el-form-item></el-col>
                  <el-col :span="8"><el-form-item label="绝经年龄"><el-input-number v-model="form.menoSysQ.menopauseAge" /></el-form-item></el-col>
                </el-row>
                <el-row :gutter="20">
@@ -164,16 +275,15 @@
                </el-row>
                <el-form-item label="其他症状"><el-input v-model="form.menoSysQ.otherSymptoms" type="textarea" :rows="2" /></el-form-item>
                <el-form-item label="处理意见"><el-input v-model="form.menoSysQ.advice" type="textarea" :rows="2" /></el-form-item>
                <el-form-item label="医生"><el-input v-model="form.menoSysQ.doctor" style="width:200px" /></el-form-item>
                    <el-form-item label="医生"><el-input v-model="form.menoSysQ.doctor" class="w-sm" /></el-form-item>
              </el-form>
            </el-tab-pane>

            <!-- 2. MHT首诊病历表 -->
            <el-tab-pane label="MHT首诊病历表" name="mhtFirst">
              <el-form :model="form.mhtFirst" label-width="160px" size="small" :disabled="!editing">
                <el-row :gutter="20">
                  <el-col :span="8"><el-form-item label="就诊日期"><el-date-picker v-model="form.mhtFirst.date" value-format="yyyy-MM-dd" style="width:100%" /></el-form-item></el-col>
                  <el-col :span="8"><el-form-item label="主诉"><el-input v-model="form.mhtFirst.chiefComplaint" /></el-form-item></el-col>
                      <el-col :span="8"><el-form-item label="就诊日期"><el-date-picker v-model="form.mhtFirst.date" value-format="yyyy-MM-dd" class="w-md" /></el-form-item></el-col>
                      <el-col :span="8"><el-form-item label="主诉"><el-input v-model="form.mhtFirst.chiefComplaint" class="w-sm" /></el-form-item></el-col>
                  <el-col :span="8"><el-form-item label="绝经年限"><el-input-number v-model="form.mhtFirst.menopauseYears" :precision="1" /></el-form-item></el-col>
                </el-row>
                <el-row :gutter="20">
@@ -182,74 +292,70 @@
                  <el-col :span="8"><el-form-item label="BMI"><el-input-number v-model="form.mhtFirst.bmi" :precision="1" disabled /></el-form-item></el-col>
                </el-row>
                <el-row :gutter="20">
                  <el-col :span="8"><el-form-item label="血压"><el-input v-model="form.mhtFirst.bloodPressure" /></el-form-item></el-col>
                      <el-col :span="8"><el-form-item label="血压"><el-input v-model="form.mhtFirst.bloodPressure" class="w-xs" /></el-form-item></el-col>
                  <el-col :span="8"><el-form-item label="血糖"><el-input-number v-model="form.mhtFirst.glucose" :precision="1" /></el-form-item></el-col>
                  <el-col :span="8"><el-form-item label="血脂"><el-input v-model="form.mhtFirst.lipid" placeholder="TC/TG/LDL/HDL" /></el-form-item></el-col>
                      <el-col :span="8"><el-form-item label="血脂"><el-input v-model="form.mhtFirst.lipid" placeholder="TC/TG/LDL/HDL" class="w-md" /></el-form-item></el-col>
                </el-row>
                <el-form-item label="既往史"><el-input v-model="form.mhtFirst.pastHistory" type="textarea" :rows="2" placeholder="高血压/糖尿病/血栓/乳腺癌/子宫肌瘤等" /></el-form-item>
                <el-form-item label="妇科检查"><el-input v-model="form.mhtFirst.gynExam" type="textarea" :rows="2" /></el-form-item>
                <el-form-item label="乳腺检查"><el-input v-model="form.mhtFirst.breastExam" type="textarea" :rows="2" /></el-form-item>
                <el-form-item label="辅助检查"><el-input v-model="form.mhtFirst.auxExam" type="textarea" :rows="2" placeholder="B超/骨密度/激素水平等" /></el-form-item>
                <el-form-item label="MHT方案"><el-input v-model="form.mhtFirst.mhtPlan" type="textarea" :rows="2" placeholder="药物名称/剂量/用法/疗程" /></el-form-item>
                <el-form-item label="医生"><el-input v-model="form.mhtFirst.doctor" style="width:200px" /></el-form-item>
                    <el-form-item label="医生"><el-input v-model="form.mhtFirst.doctor" class="w-sm" /></el-form-item>
              </el-form>
            </el-tab-pane>

            <!-- 3. MHT复诊病历表 -->
            <el-tab-pane label="MHT复诊病历表" name="mhtFollow">
              <el-form :model="form.mhtFollow" label-width="160px" size="small" :disabled="!editing">
                <el-row :gutter="20">
                  <el-col :span="8"><el-form-item label="复诊日期"><el-date-picker v-model="form.mhtFollow.date" value-format="yyyy-MM-dd" style="width:100%" /></el-form-item></el-col>
                      <el-col :span="8"><el-form-item label="复诊日期"><el-date-picker v-model="form.mhtFollow.date" value-format="yyyy-MM-dd" class="w-md" /></el-form-item></el-col>
                  <el-col :span="8"><el-form-item label="用药依从性"><el-select v-model="form.mhtFollow.compliance" style="width:100%"><el-option label="良好" value="良好" /><el-option label="一般" value="一般" /><el-option label="差" value="差" /></el-select></el-form-item></el-col>
                </el-row>
                <el-row :gutter="20">
                  <el-col :span="8"><el-form-item label="症状改善"><el-select v-model="form.mhtFollow.symptomImprove" style="width:100%"><el-option label="明显" value="明显" /><el-option label="部分" value="部分" /><el-option label="无变化" value="无变化" /></el-select></el-form-item></el-col>
                  <el-col :span="8"><el-form-item label="不良反应"><el-input v-model="form.mhtFollow.sideEffect" placeholder="如乳房胀痛/阴道出血等" /></el-form-item></el-col>
                      <el-col :span="8"><el-form-item label="不良反应"><el-input v-model="form.mhtFollow.sideEffect" placeholder="如乳房胀痛/阴道出血等" class="w-md" /></el-form-item></el-col>
                  <el-col :span="8"><el-form-item label="阴道出血"><el-select v-model="form.mhtFollow.bleeding" style="width:100%"><el-option label="无" value="无" /><el-option label="点滴" value="点滴" /><el-option label="少量" value="少量" /><el-option label="中量" value="中量" /></el-select></el-form-item></el-col>
                </el-row>
                <el-row :gutter="20">
                  <el-col :span="8"><el-form-item label="体重(kg)"><el-input-number v-model="form.mhtFollow.weight" :precision="1" /></el-form-item></el-col>
                  <el-col :span="8"><el-form-item label="血压"><el-input v-model="form.mhtFollow.bloodPressure" /></el-form-item></el-col>
                      <el-col :span="8"><el-form-item label="血压"><el-input v-model="form.mhtFollow.bloodPressure" class="w-xs" /></el-form-item></el-col>
                </el-row>
                <el-form-item label="复查结果"><el-input v-model="form.mhtFollow.reExamResult" type="textarea" :rows="2" placeholder="B超/乳腺/激素等检查结果" /></el-form-item>
                <el-form-item label="方案调整"><el-input v-model="form.mhtFollow.planAdjust" type="textarea" :rows="2" /></el-form-item>
                <el-form-item label="下次复诊"><el-date-picker v-model="form.mhtFollow.nextVisit" value-format="yyyy-MM-dd" style="width:200px" /></el-form-item>
                <el-form-item label="医生"><el-input v-model="form.mhtFollow.doctor" style="width:200px" /></el-form-item>
                    <el-form-item label="下次复诊"><el-date-picker v-model="form.mhtFollow.nextVisit" value-format="yyyy-MM-dd" class="w-md" /></el-form-item>
                    <el-form-item label="医生"><el-input v-model="form.mhtFollow.doctor" class="w-sm" /></el-form-item>
              </el-form>
            </el-tab-pane>

            <!-- 4. 改良Kupperman评分标准表 -->
            <el-tab-pane label="改良Kupperman评分标准表" name="kupperman">
              <el-form :model="form.kupperman" label-width="160px" size="small" :disabled="!editing">
                <el-row :gutter="20">
                  <el-col :span="8"><el-form-item label="评估日期"><el-date-picker v-model="form.kupperman.date" value-format="yyyy-MM-dd" style="width:100%" /></el-form-item></el-col>
                </el-row>
                    <el-row :gutter="20"><el-col :span="8"><el-form-item label="评估日期"><el-date-picker v-model="form.kupperman.date" value-format="yyyy-MM-dd" class="w-md" /></el-form-item></el-col></el-row>
                <KuppermanScoreTable v-model="form.kupperman" :editing="editing" />
              </el-form>
            </el-tab-pane>

            <!-- 5. 更年期评分量表(MRS) -->
            <el-tab-pane label="更年期评分量表（MRS）" name="mrs">
              <el-form :model="form.mrs" label-width="160px" size="small" :disabled="!editing">
                <el-row :gutter="20">
                  <el-col :span="8"><el-form-item label="评估日期"><el-date-picker v-model="form.mrs.date" value-format="yyyy-MM-dd" style="width:100%" /></el-form-item></el-col>
                </el-row>
                    <el-row :gutter="20"><el-col :span="8"><el-form-item label="评估日期"><el-date-picker v-model="form.mrs.date" value-format="yyyy-MM-dd" class="w-md" /></el-form-item></el-col></el-row>
                <MRSScoreTable v-model="form.mrs" :editing="editing" />
              </el-form>
            </el-tab-pane>

            <!-- 6. 匹兹堡睡眠质量评分量表(PSQI) -->
            <el-tab-pane label="匹兹堡睡眠质量评分量表（PSQI）" name="psqi">
              <el-form :model="form.psqi" label-width="160px" size="small" :disabled="!editing">
                <el-row :gutter="20">
                  <el-col :span="8"><el-form-item label="评估日期"><el-date-picker v-model="form.psqi.date" value-format="yyyy-MM-dd" style="width:100%" /></el-form-item></el-col>
                </el-row>
                    <el-row :gutter="20"><el-col :span="8"><el-form-item label="评估日期"><el-date-picker v-model="form.psqi.date" value-format="yyyy-MM-dd" class="w-md" /></el-form-item></el-col></el-row>
                <PSQIScoreTable v-model="form.psqi" :editing="editing" />
              </el-form>
            </el-tab-pane>
          </el-tabs>
        </el-card>
      </template>
        </el-tab-pane>

        <el-tab-pane label="服务记录" name="service">
          <ServiceRecords :patid="archive.patid" />
        </el-tab-pane>
      </el-tabs>
    </template>
    <div v-else class="empty-wrap">档案不存在或已删除</div>
  </div>
@@ -257,20 +363,48 @@

<script>
import InfoField from "../childHealth/InfoField.vue";
import EditableTable from "../components/EditableTable.vue";
import ServiceRecords from "../components/ServiceRecords.vue";
import KuppermanScoreTable from "./KuppermanScoreTable.vue";
import MRSScoreTable from "./MRSScoreTable.vue";
import PSQIScoreTable from "./PSQIScoreTable.vue";
import { loadArchives, saveArchives } from "../types";

const PREGNANCY_OPTIONS = {
  planBirth: { label: "首诊拟生育", details: ["先兆流产"], hints: ["医学处置后继续妊娠并在产科建档"] },
  earlyAbnormal: { label: "首诊早孕异常", details: ["自然流产", "胚胎停育"], hints: ["为女性再次妊娠提供备孕指导"] },
  planAbortion: { label: "首诊拟人工流产", details: ["药物流产", "手术流产"], hints: ["经咨询指导后继续妊娠并在产科建档"] },
};

export default {
  name: "MaternalHealthArchiveDetail",
  components: { InfoField, KuppermanScoreTable, MRSScoreTable, PSQIScoreTable },
  components: { InfoField, EditableTable, ServiceRecords, KuppermanScoreTable, MRSScoreTable, PSQIScoreTable },
  data() {
    return {
      loading: false, archive: null, editing: false, activeTab: "sysQ",
      PREGNANCY_OPTIONS,
      loading: false, archive: null, editing: true, activeTab: "sysQ", mainTab: "detail",
      followupColumns: [
        { prop: "seq", label: "序号", width: 60 },
        { prop: "planDate", label: "拟随访日期", width: 130, type: "date" },
        { prop: "status", label: "状况", width: 100, type: "select", options: ["已完成", "未完成"] },
        { prop: "method", label: "随访方式", width: 110 },
        { prop: "situation", label: "随访情况", minWidth: 160 },
        { prop: "followDate", label: "随访日期", width: 130, type: "date" },
        { prop: "staff", label: "随访人员", width: 110 },
      ],
      pregForm: {
        firstVisit: { visitNo: "", selfPhone: "", wardName: "", contactPhone: "", idcardno: "", address: "", diagname: "", firstDoctor: "" },
        pregnancy: { status: "", details: [], hint: [] },
        earlyFollow: { name: "", age: "", visitNo: "", wechat: "", household: "", gravidaPara: "", maritalStatus: "", buildDate: "", abortionReasons: [], otherReason: "", continuePregnancy: "", edd: "", registrationUnit: "" },
        counseling: [
          { date: "", content: "", person: "" }, { date: "", content: "", person: "" },
          { date: "", content: "", person: "" }, { date: "", content: "", person: "" },
        ],
        score: { total: null, result: "" },
        registration: { isRegistered: "", unregisteredReason: "", edd: "", recorder: "" },
        followupCycle: [],
      },
      form: {
        pregSysQ: { date:"", gestWeek:null, weight:null, bloodPressure:"", fundalHeight:null, fetalHeart:null, edema:"无", urineProtein:"-", symptoms:"", advice:"", nextVisit:"", doctor:"" },
        pregFirst: { regDate:"", husbandName:"", husbandPhone:"", lmp:"", edd:"", gp:"", csHistory:0, abortionHistory:0, diseaseHistory:"", height:null, preWeight:null, riskAssessment:"", doctor:"" },
        pregEarly: { date:"", gestWeek:null, morningSickness:"无", bleeding:"无", abdominalPain:"无", bloodRoutine:"", urineRoutine:"", ultrasound:"", folicAcid:"规律服用", advice:"", doctor:"" },
        menoSysQ: { date:"", age:null, menstruation:"", lmp:"", menopauseAge:null, hotFlash:0, insomnia:0, mood:0, fatigue:0, jointPain:0, palpitation:0, dryness:0, libido:0, otherSymptoms:"", advice:"", doctor:"" },
        mhtFirst: { date:"", chiefComplaint:"", menopauseYears:null, height:null, weight:null, bmi:null, bloodPressure:"", glucose:null, lipid:"", pastHistory:"", gynExam:"", breastExam:"", auxExam:"", mhtPlan:"", doctor:"" },
        mhtFollow: { date:"", compliance:"良好", symptomImprove:"部分", sideEffect:"", bleeding:"无", weight:null, bloodPressure:"", reExamResult:"", planAdjust:"", nextVisit:"", doctor:"" },
@@ -282,48 +416,168 @@
  },
  computed: {
    sourceLabel() { const m={standalone:"独立建档",outpatient:"门诊记录",inpatient:"在院记录"}; return m[this.archive?.sourcePage]||this.archive?.sourcePage||"-"; },
    menstrualLabel() { const m={irregular:"月经紊乱",amenorrhea_short:"闭经（<12个月）",menopause:"绝经（≥12个月）",surgical:"人工绝经"}; return m[this.archive?.archiveForm?.menstrualStatus]||"-"; },
    pregnancySubOptions() {
      const opt = PREGNANCY_OPTIONS[this.pregForm.pregnancy.status];
      return opt ? opt.details : [];
    },
    pregnancyHintOptions() {
      const opt = PREGNANCY_OPTIONS[this.pregForm.pregnancy.status];
      return opt ? opt.hints : [];
    },
    showFollowUp() {
      return this.pregForm.pregnancy.status === "planAbortion" &&
        this.pregForm.pregnancy.hint.includes("经咨询指导后继续妊娠并在产科建档");
    },
    currentFollowRecords() {
      return (this.pregForm.followupCycle || []).filter((r) => r.status === "已完成");
    },
  },
  created() {
    const id = this.$route.query.id;
    if (id) this.loadArchive(id);
    if (id) this.loadArchive(id, this.$route.query.edit == 1);
  },
  methods: {
    loadArchive(id) {
    loadArchive(id, autoEdit) {
      this.loading = true;
      const all = JSON.parse(localStorage.getItem("patientArchives") || "[]");
      this.archive = all.find(item => item.id === id) || null;
      this.archive = loadArchives().find((item) => item.id === id) || null;
      if (this.archive) {
        if (this.archive.subType === 'pregnancy') this.activeTab = "sysQ";
        else if (this.archive.subType === 'menopause') this.activeTab = "sysQ";
        if (this.archive.subType === "pregnancy") {
          if (this.archive.pregFormData) {
            const saved = JSON.parse(JSON.stringify(this.archive.pregFormData));
            this.pregForm = Object.assign({}, this.pregForm, saved);
            if (!this.pregForm.pregnancy) this.pregForm.pregnancy = { status: "", details: [], hint: [] };
          }
        } else if (this.archive.subType === "menopause") {
        if (this.archive.formData) {
          Object.keys(this.form).forEach(k => {
            Object.keys(this.form).forEach((k) => {
            if (this.archive.formData[k]) Object.assign(this.form[k], this.archive.formData[k]);
          });
        }
      }
      }
      if (autoEdit) this.editing = true;
      this.loading = false;
    },
    onPregnancyStatusChange() {
      this.pregForm.pregnancy.details = [];
      this.pregForm.pregnancy.hint = [];
      const opt = PREGNANCY_OPTIONS[this.pregForm.pregnancy.status];
      if (this.archive) this.archive.pregnancyStatus = opt ? opt.label : "";
    },
    toggleEdit() {
      if (this.editing) {
        this.archive.formData = JSON.parse(JSON.stringify(this.form));
        if (this.archive.subType === "pregnancy") this.archive.pregFormData = JSON.parse(JSON.stringify(this.pregForm));
        if (this.archive.subType === "menopause") this.archive.formData = JSON.parse(JSON.stringify(this.form));
        this.archive.updateTime = new Date().toISOString().replace("T"," ").substring(0,19);
        const all = JSON.parse(localStorage.getItem("patientArchives") || "[]");
        const idx = all.findIndex(item => item.id === this.archive.id);
        const all = loadArchives();
        const idx = all.findIndex((item) => item.id === this.archive.id);
        if (idx >= 0) all[idx] = JSON.parse(JSON.stringify(this.archive));
        localStorage.setItem("patientArchives", JSON.stringify(all));
        saveArchives(all);
        this.$message.success("保存成功");
      }
      this.editing = !this.editing;
    },
    handleCloseCase() {
      this.$modal.confirm("确认将该档案结案？结案后可在列表页查看结案状态。").then(() => {
        this.archive.closeStatus = 1;
        this.archive.updateTime = new Date().toISOString().replace("T", " ").substring(0, 19);
        const all = loadArchives();
        const idx = all.findIndex((item) => item.id === this.archive.id);
        if (idx >= 0) all[idx] = JSON.parse(JSON.stringify(this.archive));
        saveArchives(all);
        this.$message.success("已结案");
      }).catch(() => {});
    },
  },
};
</script>

<style lang="scss" scoped>
$primary: #3f6ef0;

// 输入框宽度（按字段长短区分）
.w-xs { width: 90px; }
.w-sm { width: 150px; }
.w-md { width: 200px; }
.w-lg { width: 280px; }
.w-full { width: 100%; }

.action-bar { margin-bottom: 16px; }
.info-card { margin-bottom: 0; }
.card-header { display: flex; justify-content: space-between; align-items: center; font-size: 16px; font-weight: 600; }
.header-sub { font-size: 13px; color: #909399; font-weight: normal; }
.empty-wrap { text-align: center; padding: 100px 0; color: #c0c4cc; font-size: 16px; }

// 蓝色分割线 + 小标题
.sub-section {
  & + .sub-section {
    margin-top: 24px;
  }
}
.sub-title {
  position: relative;
  padding-left: 12px;
  margin-bottom: 16px;
  font-size: 15px;
  font-weight: 600;
  color: #303133;
  line-height: 1.2;

  &::before {
    content: "";
    position: absolute;
    left: 0;
    top: 1px;
    bottom: 1px;
    width: 3px;
    border-radius: 2px;
    background: $primary;
  }

  &::after {
    content: "";
    position: absolute;
    left: 0;
    right: 0;
    bottom: -7px;
    border-bottom: 1px solid #dbe5ff;
  }
}

// 妊娠情况 三级勾选
.preg-cascade {
  .cascade-col {
    padding: 14px 16px;
    min-height: 120px;
    border: 1px solid #e6ecfb;
    border-radius: 8px;
    background: #fafbff;

    .el-radio-group,
    .el-checkbox-group {
      display: flex;
      flex-direction: column;
      align-items: flex-start;

      .el-radio,
      .el-checkbox {
        margin-right: 0;
        margin-bottom: 8px;
      }
    }
  }

  .cascade-label {
    margin-bottom: 10px;
    font-size: 13px;
    font-weight: 600;
    color: $primary;
  }

  .cascade-empty {
    padding: 10px 0;
    font-size: 12px;
    color: #c0c4cc;
  }
}
</style>