hospital/admin-ui/src/views/work/visit/index.vue

<template>
  <div class="app-container">
    <el-row :gutter="20" style="margin-top: 0">
      <el-col :span="4" style="box-shadow: 0 3px 10px 0 rgb(0 0 0 / 6%); border-right: 1px solid #f1f2f4; overflow-y: auto; height: 100%">
          <el-input
            placeholder="输入部门关键字"
            :clearable="true"
            v-model="filterText">
          </el-input>
        <div style="height: calc(-203px + 100vh);overflow-y: auto; margin-top: 3px">
          <el-tree
            class="filter-tree"
            :data="deptOptions"
            default-expand-all
            :filter-node-method="filterNode"
            @node-click="handleNodeClick"
            ref="tree">
          </el-tree>
        </div>
      </el-col>
      <el-col :span="20" style="height: 100%">
        <el-form :model="queryParams" ref="queryForm" :inline="true" style="margin-top: 0;">
          <el-form-item prop="physician">
            <el-input v-model="queryParams.physician" placeholder="请输入主治医生" clearable @keyup.enter.native="handleQuery" class="se" />
          </el-form-item>
          <el-form-item prop="patientName">
            <el-input v-model="queryParams.patientName" placeholder="请输入患者姓名" clearable @keyup.enter.native="handleQuery" class="se" />
          </el-form-item>
          <el-form-item >
            <el-date-picker
              v-model="dischargeTime"
              type="daterange"
              start-placeholder="开始时间"
              end-placeholder="结束时间"
              value-format="yyyy-MM-dd"
            />
          </el-form-item>
          <el-form-item>
            <el-button type="primary" icon="el-icon-search" @click="handleQuery">搜索</el-button>
            <el-button icon="el-icon-refresh" @click="resetQuery">重置</el-button>
          </el-form-item>
        </el-form>
        <el-table :data="patientList" border @selection-change="selects" height="calc(100vh - 250px)">
          <el-table-column type="selection" width="55" align="center" />
          <el-table-column label="科室" align="center" prop="department" />
          <el-table-column label="患者姓名" align="center" prop="name" />
          <el-table-column label="主治医生" align="center" prop="physician" />
          <el-table-column label="出院方式" align="center" prop="dischargeMethod">
            <template slot-scope="scope">
            <dict-tag :options="dict.type.discharge_method" :value="scope.row.dischargeMethod"></dict-tag>
            </template>
          </el-table-column>
          <el-table-column label="出院时间" align="center" prop="dischargeTime" />
          <el-table-column label="操作" align="center" class-name="small-padding fixed-width">
            <template slot-scope="scope">
              <el-button size="mini" type="text" icon="el-icon-search" @click="op('search',scope.row)">查看</el-button>
            </template>
          </el-table-column>
        </el-table>
        <pagination v-if="total>0" :total="total" :page.sync="queryParams.pageNum" :limit.sync="queryParams.pageSize" @pagination="getList"/>
      </el-col>
    </el-row>
  </div>
</template>

<script>
import search from "@/views/work/visit/search.vue";
export default {
  dicts:['discharge_method'],
  name: 'User',
  data() {
    return {
      dischargeTime:[],
      filterText:'',
      total:0,
      // 选中数组
      ids: [],
      SearchShow:false,
      // 非单个禁用
      single: true,
      // 非多个禁用
      multiple: true,
      //科室名称
      deptName:undefined,
      // 部门树选项
      deptOptions: null,
      //患者表
      patientList:null,
      //查询参数
      queryParams: {
        pageNum:1,
        pageSize:10,
        physician: undefined,
        patientName:undefined,
        department:undefined,
        deptId:undefined,
        startTime:undefined,
        endTime: undefined
      },
    };
  },
  watch: {
    dischargeTime(newVal) {
      if (newVal && newVal.length === 2) {
        this.queryParams.startTime = newVal[0]; // 开始日期
        this.queryParams.endTime = newVal[1]; // 结束日期
      }
    },
    filterText(val) {
      this.$refs.tree.filter(val);
    }
  },
  created() {
    this.getDepartment();
  },
  methods: {
    filterNode(value, data) {
      if (!value) return true;
      return data.label.indexOf(value) !== -1;
    },
    // 表单重置
    reset() {
      this.form = {
        physician:undefined,
        name:undefined
      };
      this.resetForm('form');
    },
    /** 查询患者列表*/
    getList(){
      this.get({
        url:'/work/visit/patientCard',
        data: {
          ...this.queryParams,
        }
      }).then((response)=>{
        this.patientList = response.rows;
        this.total = response.total;
      })
    },
    /** 查询部门 */
    getDepartment() {
      this.get({
        url:'/system/user/deptTree'
      }).then((response) => {
        this.deptOptions = response.data;
        this.queryParams.deptId = response.data[0].id;
        this.getList();
      });
    },
    handleNodeClick(data){
      if(this.queryParams.deptId === data.id){
        return;
      }
      this.queryParams.deptId = data.id;
      this.getList();
    },
    selects(rows) {
      this.ids = rows.map(item => item.id)
    },
    op(tag, row) {
      if (tag === 'search') {
        this.iframe({ obj: search, param: {id:row.patId, cardId:row.cardId, name:row.name, department:row.department}, title:'查看患者信息',width: '90%', height: '93%'});
      }
    },
    handleQuery() {
      this.queryParams.pageNum = 1;
      this.getList();
    },
    /** 重置按钮操作 */
    resetQuery() {
      this.dischargeTime = [];
      this.queryParams.startTime='';
      this.queryParams.endTime='';
      this.resetForm('queryForm');
      this.handleQuery();
    },
  }
};
</script>