lis8.0-vue3/src/views/liswork/micro/labpatlist.vue

<template>
  <div class="table-container">
    <ContextMenu :items="contextMenuItems" @select="handleMenuSelect" menu-width="200">
      <CommonTable :table-data="labPatList" :loading="loading" :columns="tableColumns"
        :row-config="{ isHover: true, keyField: 'ybh' }" @current-change="handleRowClick" size="small"
        :row-style="rowStyle" :cell-style="cellStyle" class="mytable-style" ref="tableRef" :enable-column-drag="true"
        @column-drag-end="handleColumnDragEnd">
        <!-- 完成状态列 -->
        <template #finish="{ row }">
          <el-checkbox :model-value="row.finish == '1'" readonly />
        </template>

        <template #alarmflag="{ row }">
          <el-checkbox :model-value="row.alarmflag == '1'" readonly />
        </template>

        <template #jgbz="{ row }">
          {{ getLableType(row.jgbz) }}
        </template>

        <template #brly="{ row }">
          {{ formatDict(row.brly, 'PT') }}
        </template>
        <template #brxm="{ row }">
          <span :style="{ color: row.jzbz == '1' ? '#f00' : '' }">{{ row.brxm }}</span>
        </template>
        <template #brxb="{ row }">
          {{ formatDict(row.brxb, 'SX') }}
        </template>
        <template #nldw="{ row }">
          {{ formatDict(row.nldw, 'AU') }}
        </template>
        <template #yblx="{ row }">
          {{ formatDict(row.yblx, 'BT') }}
        </template>
        <template #ksdh="{ row }">
          {{ formatDict(row.ksdh, 'DP') }}
        </template>
        <template #yhdh="{ row }">
          {{ formatDict(row.yhdh, 'SRD') }}
        </template>

        <template #autojgbz="{ row }">
          <el-checkbox :model-value="row.autojgbz === '1'" readonly />
        </template>

        <template #dybz="{ row }">
          <el-checkbox :model-value="row.dybz === '1'" readonly />
        </template>
        <template #yljg="{ row }">
          {{ formatDict(row.yljg, 'HOS') }}
        </template>
      </CommonTable>
    </ContextMenu>


    <el-dialog v-model="show" title="操作" width="300" :close-on-click-modal="false" :draggable="true"
      @close="closeHandle">
      <div class="form-box">
        <div class="item">
          <span>仪器：</span>
          <yqSelectTable v-model:data="fcYq" :instrGroup="tableKey.instrGroup" />
        </div>
        <div class="mt10">请输入复查的样本号：</div>
        <el-input v-model="fcYbh" @keyup.enter="subHandle()" />
      </div>
      <div class="mt10" style="text-align: center; width: 100%;">
        <el-button type="primary" @click="subHandle()"> 确认 </el-button>
        <el-button @click="closeHandle">取消</el-button>
      </div>
    </el-dialog>
  </div>
</template>

<script setup lang="ts">
import { ref, nextTick, onMounted, watch } from 'vue'
import CommonTable from '@/components/vxeTable/index.vue'
import ContextMenu from "@/components/contextMenu/index.vue";
import { ContextMenuItem } from '@/types/index'
import yqSelectTable from '@/components/SelectTable/YQSelectTable/index.vue';
import { setredoSample } from '@/api/liswork/work/LisWork'
import { ElMessage } from 'element-plus';
const props = defineProps({
  labPatList: {
    type: Array,
    default: () => []
  },
  loading: {
    type: Boolean,
    default: true
  },
  dictData: {
    type: Object,
    default: () => ({})
  },
  tableKey: {
    type: Object,
    default: () => { }
  }
})

const emits = defineEmits(['select'])
const show = ref(false)

const fcYbh = ref('')
const fcYq = ref('')

const subHandle = () => {
  if (!fcYbh.value.trim()) return ElMessage.warning('请输入复查的样本号')
  const data = {
    newybh: fcYbh.value,
    newyq: fcYq.value,
    ...props.tableKey
  }
  setredoSample(data).then((res: any) => {
    if (res.code == 0) {
      ElMessage.success('操作成功')
      closeHandle()
    }
  })
}
const closeHandle = () => {
  fcYbh.value = ''
  show.value = false
}

const contextMenuItems = computed<ContextMenuItem[]>(() => [
  { label: '本标本结果作其复查结果', action: 'view' }
]);
const handleMenuSelect = ((item: ContextMenuItem) => {
  show.value = true
  fcYq.value = props.tableKey.yq
})
// 表格列配置
const tableColumns = ref([
  { field: 'jyrq', title: '录入时间', width: 80, align: 'center', resizable: true },
  { field: 'finish', title: '敏', width: 30, align: 'center', slotName: 'finish', resizable: true },
  { field: 'alarmflag', title: '警', width: 30, align: 'center', slotName: 'alarmflag', resizable: true },
  { field: 'cp_pyzq', title: '培养周期', width: 60, align: 'center', resizable: true },
  { field: 'jgbz', title: '状态', width: 50, align: 'center', resizable: true, slotName: 'jgbz' },
  { field: 'ybh', title: '样本号', width: 100, align: 'center', resizable: true },
  { field: 'brxm', title: '姓名', width: 40, align: 'center', resizable: true, slotName: 'brxm' },
  { field: 'brdh', title: '病历号', width: 80, align: 'center', resizable: true },
  { field: 'ch', title: '床号', width: 40, align: 'center', resizable: true },
  { field: 'brxb', title: '性别', width: 40, align: 'center', slotName: 'brxb', resizable: true },
  { field: 'nl', title: '年', width: 30, align: 'center', resizable: true },
  { field: 'nldw', title: '龄', width: 20, align: 'center', slotName: 'nldw', resizable: true },
  { field: 'ksdh', title: '科室', width: 80, align: 'center', slotName: 'ksdh', resizable: true },
  { field: 'yblx', title: '标本', width: 50, align: 'center', resizable: true, slotName: 'yblx' },
  { field: 'sqh', title: '申请号/条码', width: 100, align: 'center', resizable: true, },
  { field: 'jymd', title: '检验目的', width: 120, align: 'center', resizable: true },
  { field: 'yhdh', title: '检验医生', width: 60, align: 'center', resizable: true, slotName: 'yhdh' },
  { field: 'brly', title: '类型', width: 50, align: 'center', slotName: 'brly', resizable: true },
  { field: 'dybz', title: '印', width: 30, align: 'center', slotName: 'dybz', resizable: true },
  { field: 'shcs', title: '次数', width: 40, align: 'center', resizable: true },
])

const getLableType = (type: string) => {
  switch (type) {
    case '0':
      return '';
    case '1':
      return '初审';
    case '2':
      return '终报';
    case '3':
      return '初报';
    case '4':
      return '二报';
    case '5':
      return '已锁定';
    default:
      return '';
  }
}

// 更新列配置
const handleColumnDragEnd = (data: any) => {
  // 先清空再赋值，强制触发重新渲染
  tableColumns.value = [];
  // 使用nextTick确保DOM更新后再设置新值
  nextTick(() => {
    tableColumns.value = [...data.columns];
  });
}
const handleRowClick = (row: any) => {
  emits('select', row)
}

const tableRef = ref()

const setCurrentRow = (row: any) => {
  tableRef.value.setCurrentRow(row)
}
const clearCurrentRow = () => {
  tableRef.value.clearCurrentRow()
}

const cellStyle = ({ row, column }: any) => {
  if (column.title == "警" && row.alarmflag == 1) {
    return { background: '#f00  !important' };
  }
  if (column.title == "状态" && row.jgbz == '2') {
    return {
      background: 'pink  !important',
    };
  }
  if (column.title == "状态" && row.jgbz == '3') {
    return {
      background: '#00ff64  !important',
    };
  }
  if (column.title == "状态" && row.jgbz == '4') {
    return { background: '#ffff64  !important' };
  }

  if (column.title == "类型" && row.brly == '1') { //门诊
    return { background: '#e9e930 !important' };
  }
  if (column.title == "类型" && row.brly == '3') {  // 住院
    return { background: '#8bdaf1 !important' };
  }
  if (column.title == "类型" && row.brly == '4') { //体检
    return { background: '#9ae382 !important' };
  }
}

const rowStyle = ({ row }: any) => {
  if (row.dybz == '1') {
    return { background: '#C0C0C0 !important' };
  }
  if (row.lstd == '1') {
    return { background: '#ed4ced !important' };
  }
  if (row.jgbz == '2') {
    return { background: '#C0FFC0 !important' };
  }
}
// 引入公共组件的字典格式化方法
const formatDict = (v: string, dictType: string) => {
  return props.dictData[dictType]?.find((item: any) => item.value == v)?.label || v;
}
onMounted(() => {
  const row = props.labPatList.find((item: any) => item.ybh == props.tableKey.ybh)
  if (!row) return
  setTimeout(() => { setCurrentRow(row) }, 100)
})
// 暴露公共方法
defineExpose({
  setCurrentRow,
  clearCurrentRow,
  tableRef,
})
</script>

<style lang="scss" scoped>
.table-container {
  height: 72vh;

  .form-box {
    font-family: SourceHanSansCN, SourceHanSansCN;

    .item {
      display: flex;
      align-items: center;

      span {
        display: inline-block;
        width: 3.75rem;
      }

    }
  }

}
</style>