<template>
  <div class="awaitList-container">
    <div class="operate">
      <el-space>
        <el-input
          v-model="queryParams.searchKey"
          style="max-width: 600px"
          placeholder="请输入内容"
          class="input-with-select"
        >
        </el-input>
        <el-button @click="resetQuery">重置</el-button>
        <el-button type="primary" @click="handleQuery">查询</el-button>
      </el-space>
      <el-space>
        <!-- <el-button>读卡</el-button> -->
        <!-- <el-button type="primary">无档登记</el-button> -->
      </el-space>
    </div>
    <div class="table-container">
      <el-table
        :data="treatHospitalizedData"
        style="width: 100%"
        height="100%"
        show-overflow-tooltip
      >
        <el-table-column type="index" width="54" align="center" label="序号" />
        <el-table-column prop="patientName" align="center" label="申请患者" />
        <el-table-column prop="genderEnum_enumText" label="性别" align="center" />
        <el-table-column label="年龄" align="center">
  <template #default="scope">
    {{ scope.row.age ? `${scope.row.age}岁` : '-' }}
  </template>
</el-table-column>
        <el-table-column prop="sourceName" align="center" label="申请来源">
          <template #default="scope">
            {{ scope.row.sourceName || '-' }}
          </template>
        </el-table-column>
        <el-table-column prop="requestTime" align="center" label="申请时间" />
        <el-table-column prop="wardName" align="center" label="入院病区" />
        <el-table-column prop="registrar" align="center" label="登记员" />
        <el-table-column fixed="right" align="center" label="操作" width="88">
          <template #default="scope">
            <el-button type="primary" text @click="doEdit(scope.row)"> 查看 </el-button>
          </template>
        </el-table-column>
      </el-table>
      <pagination
        v-show="total > 0"
        :total="total"
        v-model:page="queryParams.pageNo"
        v-model:limit="queryParams.pageSize"
        @pagination="getList"
      />
    </div>
  </div>
  <PatientRegister
    v-model="patientRegisterVisible"
    :patientInfo="patient"
    :inHospitalInfo="inHospitalInfo"
    title="登记"
    :registrationType="registrationType"
    :alreadyEdit="alreadyEdit"
    :noFile="noFile"
    @okAct="patientRegisterOK"
    @cancelAct="cancelAct"
  />
</template>
<script setup >
import PatientRegister from './patientRegister.vue';
import { getAdmissionPage, getPatientBasicInfo, getInHospitalInfo } from './api';
//const { proxy } = getCurrentInstance();
const emits = defineEmits([]);
// const props = defineProps({});
const searchForm = reactive({
  searchType: 'name',
  searchKey: '',
});
const total = ref();
const inHospitalInfo = ref({});
const alreadyEdit = ref(true);
const queryParams = ref({
  pageNo: 1,
  pageSize: 10,
  searchKey: undefined,
  registeredFlag: '1',
  searchKey: '',
});

const treatHospitalizedData = ref([]);
const patientRegisterVisible = ref(false);
const noFile = ref(false);
const registrationType = ref(true);
const patient = ref({});
const doEdit = (row) => {
  getPatientBasicInfo(row.patientId).then((res) => {
    patient.value = res.data;
  });
  getInHospitalInfo(row.encounterId).then((res) => {
    inHospitalInfo.value = res.data;
    patientRegisterVisible.value = true;
    noFile.value = false;
  });
};
onBeforeMount(() => {});
onMounted(() => {
  getList();
});
const activeName = ref('first');

const patientRegisterOK = () => {
  patientRegisterVisible.value = false;
  queryParams.value.searchKey = '';
  emits('okList');
  resetQuery();
};

const cancelAct = () => {
  patientRegisterVisible.value = false;
};

/** 搜索按钮操作 */
function handleQuery() {
  queryParams.value.pageNo = 1;
  getList();
}

function resetQuery() {
  queryParams.value = {
    pageNo: 1,
    pageSize: 10,
    searchKey: undefined,
    registeredFlag: '1',
    searchKey: '',
  };
  getList();
}

const getList = () => {
  getAdmissionPage(queryParams.value).then((res) => {
    treatHospitalizedData.value = res.data.records;
    total.value = res.data.total;
  });
};
</script>
<style lang="scss" scoped>
.awaitList-container {
  width: 100%;
  height: 100%;
  .operate {
    display: flex;
    justify-content: space-between;
    height: 40px;
    padding: 0 16px;
    align-items: center;
  }
  .table-container {
    padding: 8px 16px;
  }
}
</style>
