health.admin/src/service/IntroduceProjectList.vue

<script lang="ts" setup>
import { ref } from 'vue';
import type { SystemItemModel, SystemCwModel } from '@/model/care.model';
import { VxeUI } from 'vxe-pc-ui';
import { getConditioningRecordDetailMethod } from '@/request/api/care.api';
const tableData = ref<SystemItemModel[]>([]);

type FollowModel = Partial<SystemCwModel>;
const props = defineProps<{ data: FollowModel; id: string }>();

// 引入已有项目
async function handleAdd(row: any) {
  // 关闭引入服务包弹窗
  VxeUI.modal.close(`systemService-list-modal`);
  // 关闭引入已有项目弹窗
  VxeUI.modal.close(`introduceProjectList-modal`);
}

function handleCancel() {
  VxeUI.modal.close(`introduceProjectList-modal`);
}
const dataObj = reactive<SystemCwModel>({
  type: 'institution',
  id: props.id,
});
onMounted(async () => {
  const res: any = await getConditioningRecordDetailMethod(dataObj);
  tableData.value = res.items;
});
const checked = ref(true);
</script>

<template>
  <div style="background: #fff; border-radius: 6px">
    <vxe-table :data="tableData" border :row-class-name="({ row }) => (!row.canImport ? 'highlight-row' : '')">
      <vxe-column field="conditioningProgramDetail.name" title="项目名称" width="200" />
      <vxe-column field="conditioningProgramDetail.conditioningProgramType" title="方案类型" width="300" />
      <vxe-column title="是否可引入" width="200" align="center">
        <template #default="{ row }">
          <a-checkbox v-if="true" v-model:checked="checked" disabled />
          <span v-else style="color: #f5222d; margin-right: 8px; font-size: 8px">{{ row.reason }}</span>
        </template>
      </vxe-column>
    </vxe-table>
    <div style="display: flex; justify-content: center; margin-top: 24px">
      <a-button style="margin-right: 24px" @click="handleCancel">取消</a-button>
      <a-button type="primary" @click="handleAdd">引入已有项目</a-button>
    </div>
  </div>
</template>

<style scoped>
.highlight-row {
  background: #f8f5e6 !important;
}
</style>