lis8.0-vue3/src/views/liswork/Issueorder/index.vue

/**
* @file index.vue 科内开单
* @author: w
* @since: 2026-03-02
*/

<template>
  <div class="app-container">
    <el-row :gutter="10" class="row-box">
      <el-col :span="13" style="height: 100%;">
        <div class="box-shadow">
          <el-row :gutter="5">
            <el-col :span="8">
              <Info :lab-pat="labpat" :dict-data="dictData" />
            </el-col>
            <el-col :span="16">

            </el-col>
          </el-row>
        </div>
      </el-col>
      <el-col :span="11" style="height: 100%;">
        <div class="box-shadow">
          <el-form :model="queryParams" inline size="small" label-width="5.5rem">

            <el-form-item label="姓名：" prop="brxm">
              <el-input v-model="queryParams.brxm" style="width: 9rem;" />
            </el-form-item>
            <el-form-item label="条码号：" prop="sqh">
              <el-input v-model="queryParams.sqh" style="width: 9rem;" />
            </el-form-item>
            <el-form-item label="状态：" prop="zt">
              <el-select v-model="queryParams.zt" placeholder="请选择" style="width: 9rem;" clearable>
                <el-option label="已申请未打印" value="1" />
                <el-option label="显示所有" value="0" />
              </el-select>
            </el-form-item>
            <el-form-item label="登记时间：" prop="st">
              <el-date-picker v-model="queryParams.st" type="date" format="YYYY-MM-DD" value-format="YYYY-MM-DD"
                style="width: 7.5rem;" />&nbsp; -&nbsp;
              <el-date-picker v-model="queryParams.et" type="date" format="YYYY-MM-DD" value-format="YYYY-MM-DD"
                style="width: 7.5rem;" />
            </el-form-item>
            <el-form-item label="">
              <el-button type="primary" @click="handleQuery"> 查询 </el-button>
            </el-form-item>
          </el-form>
          <div class="table-box">
            <CustomVxeTable :table-data="labPatList" :loading="loading" :columns="tableColumns"
              @current-change="handleRowClick" size="small"
              :scrollYConfig="{ enabled: true, rSize: 30, height: '100%', }" :row-style="rowStyle"
              :cell-style="cellStyle" class="mytable-style" ref="tableRef" :enable-column-drag="true"
              @column-drag-end="handleColumnDragEnd">
            </CustomVxeTable>
          </div>
        </div>
      </el-col>
    </el-row>
  </div>
</template>

<script setup>
import { templateRef } from '@vueuse/core'
import Info from './components/info.vue'
import { getDictData, formatDict, dictData } from '@/hooks'
import dayjs from 'dayjs'
const labpat = ref({})

const loading = ref(false)
const tableRef = templateRef('tableRef')
const labPatList = ref([])
const queryParams = ref({})
const tableColumns = ref([
  { field: 'brdh', title: '病历号', width: 80, align: 'center', resizable: true },
  { field: 'brxm', title: '姓名', width: 40, align: 'center', resizable: true, slotName: 'brxm' },
  { field: 'brxb', title: '性别', width: 30, align: 'center', slotName: 'brxb', resizable: true },
  { field: 'sqh', title: '条码号', width: 100, align: 'center', resizable: true, },
  { field: 'zt', title: '状态', width: 40, align: 'center', resizable: true, },
  { field: 'nl', title: '年', width: 30, align: 'center', resizable: true },
  { field: 'nldw', title: '龄', width: 20, align: 'center', slotName: 'nldw', resizable: true },
  { field: 'yblx', title: '标本', width: 50, align: 'center', resizable: true, slotName: 'yblx' },
  { field: 'yhdh', title: '检验医生', width: 60, align: 'center', resizable: true, slotName: 'yhdh' },
  { field: 'ksdh', title: '科室', width: 80, align: 'center', slotName: 'ksdh', resizable: true },
  { field: 'time', title: '登记时间', width: 80, align: 'center', resizable: true },
  { field: 'brly', title: '病人来源', width: 90, align: 'center', slotName: 'brly', resizable: true },
  { field: 'xmdh', title: '项目', width: 90, align: 'center', resizable: true },
])

const rowStyle = ({ row }) => {
}

const cellStyle = ({ row, column }) => {
}

const handleRowClick = (row) => {
  labpat.value = row
}

// 更新列配置
const handleColumnDragEnd = (data) => {

  tableColumns.value = [];

  nextTick(() => {
    tableColumns.value = [...data.columns];
  });
}

onMounted(() => {
  queryParams.value.st = dayjs().format('YYYY-MM-DD')
  queryParams.value.et = dayjs().format('YYYY-MM-DD')
})

</script>

<style scoped lang="scss">
.app-container {
  background: #F0F3F8;
}

.box-shadow {
  height: 100%;
  box-shadow: 2px 2px 4px 0px rgba(206, 217, 234, 0.7);
  border-radius: .75rem;
  padding: .5rem;
  background-color: #fff;

  .flex-between {
    margin-bottom: .5rem;
  }
}

.row-box {
  height: 100%;
}

.table-box {
  height: calc(100% - 60px);
}

.el-form-item {
  margin-bottom: 5px;
}
</style>