his/openhis-ui-vue3/src/views/inspection/groupRec/index.vue

<template>
   <div class="app-container">
      <el-form :model="queryParams" ref="queryRef" :inline="true" v-show="showSearch" label-width="68px">
         <el-form-item label="数据查询" prop="searchKey">
            <el-input
               v-model="queryParams.searchKey"
               placeholder="患者姓名/项目名称"
               clearable
               style="width: 240px"
               @keyup.enter="handleQuery"
            />
         </el-form-item>
         <el-form-item label="创建时间" style="width: 308px;">
            <el-date-picker
               v-model="authoredTime"
               value-format="YYYY-MM-DD"
               type="daterange"
               range-separator="-"
               start-placeholder="开始日期"
               end-placeholder="结束日期"
            ></el-date-picker>
         </el-form-item>
         <el-form-item>
            <el-button type="primary" icon="Search" @click="handleQuery">搜索</el-button>
            <el-button icon="Refresh" @click="resetQuery">重置</el-button>
         </el-form-item>
      </el-form>

      <el-row :gutter="10" class="mb8">
         <el-col :span="1.5">
            <el-button
               type="primary"
               plain
               icon="Plus"
               :disabled="collect"
               @click="handleCollect('已接收')"
            >样本接收</el-button>
         </el-col>
<!--         <el-col :span="1.5">-->
<!--            <el-button-->
<!--               type="success"-->
<!--               plain-->
<!--               icon="Edit"-->
<!--               :disabled="single"-->
<!--               @click="handleUpdate"-->
<!--            >合管</el-button>-->
<!--         </el-col>-->
         <el-col :span="1.5">
            <el-button
               type="danger"
               plain
               icon="Delete"
               :disabled="multiple"
               @click="handleCollect('已采集')"
            >取消</el-button>
         </el-col>
        <el-col :span="1.5">
          <el-button
              type="primary"
              plain
              icon="Plus"
              :disabled="multiple"
              @click="handleDelete"
          >打印条码</el-button>
        </el-col>
         <right-toolbar v-model:showSearch="showSearch" @queryTable="getList"></right-toolbar>
      </el-row>

     <el-table
         v-if="refreshTable"
         v-loading="loading"
         :data="dataList"
         row-key="chargeName"
         :default-expand-all="false"
     >
       <!-- 子表列 -->
       <el-table-column
           type="expand"
           width="50"
           fixed="left"
       >
         <template #default="props">
           <el-table
               :data="props.row.children"
               style="width: 100%"
               :show-header="true"
               @selection-change="handleSelectionChange($event, props.row)"
               ref="childTable"
           >
             <!-- 子表的多选框 -->
             <el-table-column
                 type="selection"
                 width="55"
                 :selectable="selectable"
             ></el-table-column>
             <el-table-column
                 prop="specimenName"
                 label="样本名称"
             ></el-table-column>
             <el-table-column
                 prop="specimenVolume"
                 label="样本数量"
             >
               <template #default="innerProps">
                 {{ innerProps.row.specimenVolume }} {{ innerProps.row.specimenUnit }}
               </template>
             </el-table-column>
             <el-table-column
                 prop="collectionStatusEnumText"
                 label="样本状态"
                >
             <template #default="nerProp">
                <span v-if="nerProp.row.collectionStatusEnum == 1" style="color:green">
                  已采集
                </span>
               <span v-else-if="nerProp.row.collectionStatusEnum == 0"  style="color:orange">
                  待采集
                </span>
               <span v-else-if="nerProp.row.collectionStatusEnum == 2"  style="color:#0EB396">
                  已接收
                </span>
             </template>
             </el-table-column>
             <el-table-column
                 prop="receivedDate"
                 label="接收时间"
             ></el-table-column>
           </el-table>
         </template>
       </el-table-column>
       <!-- 母表列 -->
       <el-table-column
           prop="chargeName"
           label="项目名称"
           :sortable="true"
       ></el-table-column>
       <el-table-column
           prop="patientName"
           label="患者姓名"
           :sortable="true"
       ></el-table-column>
       <el-table-column
           prop="genderEnumText"
           label="性别"
           :sortable="true"
       ></el-table-column>
       <el-table-column label="样本状态">
         <template #default="sprops">
    <span v-if="hasPendingCollection(sprops.row.children)" style="color:red">
      待接收
    </span>
           <span v-else style="color:#0EB396">
      已接收
    </span>
         </template>
       </el-table-column>
       <el-table-column
           prop="doctorName"
           label="开单医生"
           :sortable="true"
       ></el-table-column>
       <el-table-column
           prop="authoredTime"
           label="开单时间"
           :sortable="true"
       ></el-table-column>
     </el-table>

     <pagination
         v-show="total > 0"
         :total="total"
         v-model:page="queryParams.pageNum"
         v-model:limit="queryParams.pageSize"
         @pagination="getList"
     />

   </div>
</template>

<script setup name="Config">
import { collectionList,editStatus } from "./components/collect.js";
import {formatDateStr} from "@/utils/index.js";

const { proxy } = getCurrentInstance();

const dataList = ref([]);
const refreshTable = ref(true);


const loading = ref(true);
const showSearch = ref(true);
const ids = ref([]);
const single = ref(true);
const collect = ref(true);
const multiple = ref(true);
const total = ref(0);
const title = ref("");
const authoredTime = ref([
    //默认三天前
  formatDateStr(new Date(new Date().setDate(new Date().getDate() - 3)), 'YYYY-MM-DD'),
  formatDateStr(new Date(), 'YYYY-MM-DD'),
]);

const data = reactive({
  form: {},
  queryParams: {
    pageNo: 1,
    pageSize: 10,
    searchKey: undefined
  },
});

const { queryParams, form, rules } = toRefs(data);

/** 查询参数列表 */
function getList() {
  loading.value = true;
  queryParams.value.authoredTimeSTime = authoredTime.value[0] + ' 00:00:00';
  queryParams.value.authoredTimeETime = authoredTime.value[1] + ' 23:59:59';
  collectionList(queryParams.value).then(response => {
    dataList.value = proxy.handleTree(response.data.records , "id");
    total.value = response.data.total;
    loading.value = false;
  });
}
/** 取消按钮 */
function cancel() {
  open.value = false;
  reset();
}
/** 表单重置 */

/** 搜索按钮操作 */
function handleQuery() {
  queryParams.value.pageNo = 1;
  getList();
}
/** 重置按钮操作 */
function resetQuery() {
  dateRange.value = [];
  proxy.resetForm("queryRef");
  handleQuery();
}
/** 多选框选中数据 */
function handleSelectionChange(selection) {
  ids.value = selection.map(item => item.id);
  collect.value = selection.length <= 0;
  single.value = selection.length < 2;
  multiple.value = !selection.length;
}
/** 采集按钮操作 */
function handleCollect(type) {

  editStatus(ids.value,type).then(()=>{
    proxy.$modal.msgSuccess("操作成功");
    getList();
  })
}

function   hasPendingCollection(children) {
  return children.some(child => child.collectionStatusEnum === 0 || child.collectionStatusEnum === 1); // 如果有任意子项是待采集或已采集状态
}
 function selectable(row) {
  // 判断 collectionStatusEnum
  return row.collectionStatusEnum !== 0;
}

getList();
</script>