PC-application/component/statistics/FollowRecord/index.html

<!-- css文件位置位于/component/common/jtbc.css -->

<div id="app" class="jtbc">
  <div class="copd-filter-group ui-col-1 bgc-fff" style="min-width: 900px">
    <div class="searchDiv pb20 pr20">
      <label class="c-333 c-f14">
        <el-radio v-model="yearType" label="1">按下转年份：</el-radio>
        <el-select v-model="chooseYear" class="formWidth wd160">
          <el-option v-for="(item , index) in years" :key="index" :label="item" :value="item"></el-option>
        </el-select>
      </label>
    </div>
    <div class="searchDiv pb20 pr20">
      <label class="c-333 c-f14" style="display: flex; align-items: center">
        <el-radio v-model="yearType" label="2">下转时间：</el-radio>
        <el-date-picker
          v-model="chooseTime"
          type="daterange"
          range-separator="至"
          start-placeholder="开始日期"
          end-placeholder="结束日期"
          value-format="yyyy-MM-dd"></el-date-picker>
      </label>
    </div>
    <div class="searchDiv pb20 pr20">
      <label class="c-333 c-f14">居民姓名：</label>
      <el-input v-model="form.name" placeholder="请输入居民姓名查询"></el-input>
    </div>
    <div class="searchDiv pb20 pr20">
      <label class="c-333 c-f14">下转医生：</label>
      <el-input v-model="form.turnDoctorName" placeholder="请输入居民姓名查询"></el-input>
    </div>
    <div class="searchDiv pb20 pr20">
      <label class="c-333 c-f14">随访医生：</label>
      <el-input v-model="form.doctorName" placeholder="请输入居民姓名查询"></el-input>
    </div>
    <div class="searchDiv pb20 pr20">
      <label class="c-333 c-f14">数据范围：</label>
      <el-select class="formWidth" v-model="form.range" placeholder="请选择" @change="resetArea">
        <el-option v-for="(option, index) in rangeOptions" :label="option.label" :value="option.value" :key="option.value"></el-option>
      </el-select>
    </div>
    <div class="searchDiv pb20 pr20">
      <label class="c-333 c-f14">地区：</label>
      <el-select class="formWidth" v-model="form.area" placeholder="请选择" @change="getHospital">
        <el-option v-for="(option, index) in areaOptions" :label="option.label" :value="option.value" :key="option.value"></el-option>
      </el-select>
    </div>
    <div class="searchDiv pb20 pr20" v-if="form.range == 'hospital'||form.range == 'team'">
      <label class="c-333 c-f14">社区：</label>
      <el-select class="formWidth" v-model="form.hospital" placeholder="请选择" @change="getTeam">
        <el-option v-for="(option, index) in hospitalOptions" :label="option.name" :value="option.code" :key="option.code"></el-option>
      </el-select>
    </div>
    <div class="searchDiv pb20 pr20" v-if="form.range == 'team'">
      <label class="c-333 c-f14">团队：</label>
      <el-select class="formWidth" v-model="form.team" placeholder="请选择">
        <el-option v-for="(option, index) in teamOptions" :label="option.name" :value="option.id" :key="option.id"></el-option>
      </el-select>
    </div>
    <div class="searchDiv pb20">
      <el-button type="primary" size="mini" @click="queryDate">查询</el-button>
      <el-button type="ff9526" size="mini" @click="exportTable" :disabled="exportLoading">导出</el-button>
      <span class="eliminate" @click="eliminateClick">清除筛选条件</span>
    </div>
  </div>
  <el-table :data="tableData" style="width: 100%" v-loading="loading">
    <el-table-column type="index" min-width="60" label="序号"></el-table-column>
    <el-table-column :label="item.label" v-for="item in tableHeader" :min-width="item.width" :key="item.prop">
      <template slot-scope="scope">{{scope.row[item.prop]}}</template>
    </el-table-column>
    <el-table-column label="操作" align="center" width="130px">
      <template slot-scope="scope">
        <el-button type="text" @click="openDialog(scope)">查看筛查表单</el-button>
      </template>
    </el-table-column>
  </el-table>
  <el-pagination
    @current-change="handleCurrentChange"
    @size-change="handleSizeChange"
    :current-page.sync="page"
    :page-size="size"
    :page-sizes="[10, 20, 50]"
    layout="total, sizes, prev, pager, next, jumper"
    :total="total"
    class="pagination"></el-pagination>
  <el-dialog :visible="visible" title="查看随访结果" @close="closeDialog" width="850px">
    <el-row :gutter="20" style="margin-top: -20px;">
      <el-col :span="12" class="follow-col">随访表单：冠心病日常随访（社区）</el-col>
      <el-col :span="12" class="follow-col">随访医生：{{info.doctorName}}</el-col>
      <el-col :span="12" class="follow-col">随访对象：{{info.name}}（{{info.sex}} {{info.age}}岁）</el-col>
    </el-row>
    <el-form label-position="left" label-width="120px" class="follow-dialog-form">
      <el-form-item label="姓名" required>
        <el-input v-model="record.patientName" placeholder="请输入姓名" :readonly="readonly"></el-input>
      </el-form-item>
      <el-form-item label="随访日期" required>
        <el-date-picker v-model="record.followupDate" type="datetime" format="yyyy-MM-dd HH:mm" value-format="yyyy-MM-dd HH:mm" placeholder="请选择随访日期"></el-date-picker>
      </el-form-item>
      <el-form-item label="随访医生" required>
        <el-input v-model="record.doctorName" placeholder="请输入随访医生" :readonly="readonly"></el-input>
      </el-form-item>
      <el-form-item label="血压" required>
        <el-row :gutter="10" style="display: flex">
          <el-col :span="8">
            <el-input v-model="record.bloodPressure" placeholder="" readonly></el-input>
          </el-col>
          <el-col :span="2">/</el-col>
          <el-col :span="8">
            <el-input v-model="record.bloodPressureDown" placeholder="" readonly></el-input>
          </el-col>
          <el-col :span="6">mmHg</el-col>
        </el-row>
      </el-form-item>
      <el-form-item label="心率" required>
        <el-input v-model="record.heartRate" placeholder="请输入心率" readonly>
          <template slot="append">次/分钟</template>
        </el-input>
      </el-form-item>
      <el-form-item label="LDL-C" required>
        <el-input v-model="record.ldlc" placeholder="请输入LDL-C" readonly>
          <template slot="append">mmol/L</template>
        </el-input>
      </el-form-item>
      <el-form-item label="糖化血红蛋白" required>
        <el-input v-model="record.thxhdb" placeholder="请输入糖化血红蛋白" readonly>
          <template slot="append">%</template>
        </el-input>
      </el-form-item>
      <el-form-item label="吸烟情况" required>
        <el-radio-group v-model="record.smoking" disabled class="follow-record">
          <el-radio label="1">已戒烟或从未吸烟</el-radio>
          <el-radio label="5">仍吸烟</el-radio>
        </el-radio-group>
      </el-form-item>
      <el-form-item label="饮酒情况" required>
        <el-radio-group v-model="record.drinking" disabled class="follow-record">
          <el-radio label="1">戒酒或不饮酒</el-radio>
          <el-radio label="4">仍饮酒</el-radio>
        </el-radio-group>
      </el-form-item>
      <el-form-item label="目前服用药物" required>
        <el-checkbox-group v-model="takingListChecked" disabled v-if="selectTak.length==0" class="follow-record">
          <el-checkbox v-for="(item,index) in takingList" :key="item.code" :label="index">{{ item.value }}</el-checkbox>
        </el-checkbox-group>
        <el-checkbox-group v-model="takingListChecked" disabled v-else class="follow-record">
          <el-checkbox v-for="(item,index) in selectTak" :key="item.code" :label="item.index">{{ item.value }}</el-checkbox>
        </el-checkbox-group>
      </el-form-item>
      <el-form-item label="不良事件种类">
        <el-checkbox-group v-model="adverseEventArr" disabled v-if="selectAdverse.length==0" class="follow-record">
          <el-checkbox v-for="(item,index) in badEventList1" :key="item.key" :label="index">{{ item.name }}</el-checkbox>
        </el-checkbox-group>
        <el-checkbox-group v-model="adverseEventArr" disabled v-else class="follow-record">
          <el-checkbox v-for="(item,index) in selectAdverse" :key="item.key" :label="item.index">{{ item.name }}</el-checkbox>
        </el-checkbox-group>
      </el-form-item>
      <el-form-item label="其他事件">
        <el-input type="textarea" v-model="record.otherEvents" placeholder="请输入其他事件情况" :rows="3" :maxlength="200" show-word-limit readonly></el-input>
      </el-form-item>
      <el-form-item label="是否转诊上级医院" required label-width="150px">
        <el-radio-group v-model="record.isMoveSuperiorHospital" disabled class="follow-record">
          <el-radio label="1">是</el-radio>
          <el-radio label="2">否</el-radio>
        </el-radio-group>
      </el-form-item>
      <el-form-item label="随访医院" required>
        <el-input v-model="record.followHospital" placeholder="请输入随访医院" :readonly="readonly"></el-input>
      </el-form-item>
    </el-form>
  </el-dialog>
</div>