chinese-medicine/src/views/ProjectAssistant/General.vue

<template>
  <div class="flex-1 flex-wrap">
    <div style="width: 100%">
      <a-form :form="form" class="d-flex flex-wrap align-center" layout="inline">
        <div class="fill-width">
          <a-form-item>
            <a-select placeholder="请选择医院" style="width: 200px" @change="changeHospitalId" allow-clear>
              <a-select-option :key="item.id" :value="item.id" v-for="item in hospitals">{{ item.name }}</a-select-option>
            </a-select>
          </a-form-item>
          <a-form-item>
            <a-select placeholder="请选择医生" style="width: 200px" @change="changeDoctorId" allow-clear>
              <a-select-option :key="item.id" :value="item.id" v-for="item in doctorList">{{ item.name }}</a-select-option>
            </a-select>
          </a-form-item>
          <a-form-item>
            <a-select placeholder="请选择组别" style="width: 200px" @change="changeInpatientId" allow-clear>
              <a-select-option :key="item.id" :value="item.id" v-for="item in controlGroups">{{ item.name }}</a-select-option>
            </a-select>
          </a-form-item>
        </div>
        <div class="fill-width">
          <a-form-item>
            <a-range-picker @change="changeTime" style="width: 318px">
              <template slot="dateRender" slot-scope="current">
                <div class="ant-calendar-date" :style="getCurrentStyle(current)">
                  {{ current.date() }}
                </div>
              </template>
            </a-range-picker>
          </a-form-item>
          <a-form-item>
            <a-select placeholder="请选择状态" :default-value="recordStatus" style="width: 200px" @change="changeStatus" allow-clear>
              <a-select-option :key="index" :value="index" v-for="(item, index) in status">{{ item }}</a-select-option>
            </a-select>
          </a-form-item>
          <a-button @click="handleSearch" class="mt-1" html-type="submit" icon="search" type="primary">搜索</a-button>
        </div>
      </a-form>
      <a-table
        v-if="lists && lists.list && lists.list.length > 0"
        :columns="columns"
        :data-source="lists.list"
        :loading="loading"
        :pagination="pagination"
        :row-key="record => record.id"
        bordered
        class="white pa-3 mt-3"
      >
        <template slot="id" slot-scope="text, record, index">
          <span>{{ index + 1 }}</span>
        </template>

        <template slot="inputStatus" slot-scope="text, record">
          <span>
            {{
              record.inputStatus === 0
                ? '新建'
                : record.inputStatus === 1
                ? '数据收集中'
                : record.inputStatus === 2
                ? '数据收集按时完成'
                : record.inputStatus === 3
                ? '数据收集超时中'
                : record.inputStatus === 4
                ? '废弃'
                : record.inputStatus === 5
                ? '审核通过'
                : '已结算'
            }}
          </span>
        </template>

        <template slot="edit" slot-scope="text, record">
          <div class="d-flex flex-column">
            <a-popconfirm placement="left" ok-text="确定" cancel-text="取消" @confirm="changeRecordStatus(record.id)">
              <template slot="title">
                <p>是否确定通过该病例记录</p>
              </template>
              <a-button v-if="record.inputStatus === 5" size="small" type="primary">审核通过</a-button>
            </a-popconfirm>

            <a-button type="primary" size="small" class="mt-4" @click="details(record.id, record.hospitalization, record.code)">
              查看详情
            </a-button>
          </div>
        </template>
      </a-table>
      <a-empty v-else />
    </div>
  </div>
</template>
<script>
import { mapState, mapActions, mapMutations } from 'vuex';
import { selPatientMes, upPatientMes, getHList } from 'config/api';
const columns = [
  {
    title: '研究编号',
    align: 'center',
    dataIndex: 'code',
    key: 'code',
  },
  {
    title: '住院号',
    align: 'center',
    dataIndex: 'hospitalization',
    key: 'hospitalization',
  },
  {
    title: '主治医生',
    align: 'center',
    dataIndex: 'doctorName',
    key: 'doctorName',
  },
  {
    title: '组别',
    align: 'center',
    dataIndex: 'name',
    key: 'name',
  },
  {
    title: '状态',
    align: 'center',
    dataIndex: 'inputStatus',
    key: 'inputStatus',
    scopedSlots: { customRender: 'inputStatus' },
  },
  {
    title: '编辑',
    align: 'center',
    dataIndex: 'edit',
    key: 'edit',
    width: 80,
    scopedSlots: { customRender: 'edit' },
  },
];
export default {
  name: 'General',
  data() {
    return {
      str: '项目助理审核界面',
      columns,
      form: this.$form.createForm(this, { name: 'search' }),
      loading: false,
      visible: false,
      lists: { pageNum: 1, pageSize: 10, total: 1, list: [] },
      codes: '',
      pagination: {
        current: 1,
        pageSize: 10,
        total: 0,
      },
      hospitals: [],
      hospitalization: '',
      inpatientId: '',
      statusModal: false,
      recordStatus: 5,
      status: ['新建', '数据搜集中', '数据搜集完成', '数据搜集超时', '废弃', '审核通过', '已结算'],
      startTime: '',
      endTime: '',
      doctorId: '',
      HospitalId: '',
    };
  },
  computed: mapState('home', ['controlGroups', 'doctorList']),
  created() {
    this.getHospital();
    this.getControlGroups();
    this.getDoctor(1);
    this.handleSelPatientMes();
  },
  methods: {
    ...mapMutations('home', ['setPatientId', 'setHospitalization', 'setRecordCode']),
    ...mapActions('home', ['getDoctor', 'getControlGroups']),
    //修改所选医院
    changeHospitalId(e) {
      console.log(typeof e);
      if (typeof e === 'string') {
        this.HospitalId = e;
      } else {
        this.HospitalId = '';
      }
    },
    // 获取所有医院
    async getHospital() {
      try {
        const res = await getHList();
        const { code, msg, data } = res.data;
        if (code === 200) {
          this.hospitals = data;
          console.log(data);
        } else {
          this.$message.error('查询医院列表失败');
        }
      } catch (error) {
        this.$message.error('查询医院列表失败');
      }
    },
    handleSearch() {
      this.pagination.current = 1;
      this.handleSelPatientMes();
    },
    async handleSelPatientMes() {
      try {
        const { HospitalId, hospitalization, pagination, inpatientId, doctorId, codes, startTime, endTime, recordStatus } = this;
        const params = {
          param: {
            hospitalId: HospitalId,
            hospitalization,
            inpatientId,
            pageNum: pagination.current,
            code: codes,
            inputStatus: recordStatus,
            pageSize: 10,
            doctorId,
            role: 1,
            startTime,
            endTime,
          },
        };
        const res = await selPatientMes(params);
        const { code, msg, data } = res.data;
        console.log('获取列表');
        if (code === 200) {
          let { lists } = this;
          lists = { ...data };
          this.lists = { ...lists };
        } else {
          this.$message.error(msg || '查询失败');
          throw msg;
        }
      } catch (error) {
        throw new Error(error);
      }
    },
    // 查看病例的详情
    details(Id, hospitalization, code) {
      this.setPatientId(Id);
      this.setHospitalization(hospitalization);
      this.setRecordCode(code);
      localStorage.setItem('patientId', Id);
      localStorage.setItem('hospitalization', hospitalization);
      localStorage.setItem('recordCode', code);
      this.$router.push('/patientInfo');
    },
    // 显示修改审核状态框
    showStatus(inputStatus) {
      this.recordStatus = inputStatus;
      this.statusModal = true;
    },
    // 时间选择框的样式
    getCurrentStyle(current, today) {
      const style = {};
      if (current.date() === 1) {
        style.border = '1px solid #1890ff';
        style.borderRadius = '50%';
      }
      return style;
    },
    // 修改医生
    changeDoctorId(e) {
      if (typeof e !== 'number') {
        this.doctorId = e;
      } else {
        this.doctorId = '';
      }
    },
    // 修改时间
    changeTime(e) {
      if (e && e.length) {
        this.startTime = this.$moment(e[0]._d).format('YYYY-MM-DD HH:mm:ss');
        this.endTime = this.$moment(e[1]._d).format('YYYY-MM-DD HH:mm:ss');
      } else {
        this.startTime = '';
        this.endTime = '';
      }
    },
    // 修改对照组
    changeInpatientId(e) {
      if (typeof e !== 'number') {
        this.inpatientId = e;
      } else {
        this.inpatientId = '';
      }
    },
    // 修改状态
    changeStatus(e) {
      if (typeof e) {
        this.recordStatus = e;
      } else {
        this.changeStatus = '';
      }
    },
    // 确认通过当前信息
    async changeRecordStatus(id) {
      try {
        const params = {
          param: {
            id,
            inputStatus: 6,
          },
        };
        const res = await upPatientMes(params);
        const { code } = res.data;
        if (code === 200) {
          this.$message.success('已通过');
          this.handleSelPatientMes();
        }
      } catch (error) {
        this.$message.error(error);
      }
    },
  },
};
</script>

<style lang="stylus" scoped ></style>