xt-front/src/views/biz/visit/ready/index.vue

<template>
  <div class="m-4">
    <!-- 透前准备
    <a-button type="primary" @click="plusFn">
      {{ countRef }}
    </a-button> -->
    <XTTitle title="透析病历" :right-data="titleData" @click="cellTitle" />
    <div class="flex justify-between my-4">
      <XTTab
        type="illness"
        :width="120"
        :selected="tabSelected"
        :data="tabData"
        @item-click="callTab"
      />
      <XTForm :form-data="formData" @change="cellFrom" />
    </div>
    <div>
      <XTCard class="flex justify-around my-2" :data="dataCard" @item-click="cellCard" />
    </div>
    <importView @register="registerModal" />
  </div>
</template>

<script setup lang="ts">
  import { ref } from 'vue';
  import { XTTab } from '/@/components/XTTab/index';
  import { XTCard } from '/@/components/XTCard/index';
  import { XTForm } from '/@/components/XTForm/index';
  import { XTTitle } from '/@/components/XTTitle/index';
  import { onMounted } from 'vue';
  import { readyPrepare, prePrepareSailing, wardInfo } from '/@/api/biz/visit/prepareApi';
  import { TitleEnum } from './data';
  import { nanoid } from 'nanoid';
  import { useModal } from '/@/components/Modal';
  import importView from './importView.vue';
  const dataCard = ref([]) as any; // 卡片数据
  const tabSelected = ref('0'); // 默认病区 // 病区id
  const SailingList = ref([]) as any; // 班次列表
  const tabData = ref([]);
  const Status = ref(''); // 状态
  const Name = ref('');
  const Sailing = ref('1'); //班次
  // const wardId = ref('');
  // const abcdefg = [
  //   { key: '0', label: '全部' },
  //   { key: '1', label: 'A区' },
  //   { key: '2', label: 'B区' },
  // ];
  // 默认状态

  const [registerModal, { openModal }] = useModal();
  const titleData = [
    {
      type: 'import',
      icon: 'icon-xt-import_default',
    },
    {
      type: 'export',
      icon: 'icon-xt-export_default',
    },
    {
      type: 'add',
      btnIcon: 'icon-xt-add_default',
      btnText: '患者建档',
    },
  ];

  onMounted(async () => {
    const PrepareData = await readyPrepare({ sailingSort: '1' });
    const SailingData = await prePrepareSailing();
    const wardData = await wardInfo();
    for (const i of SailingData) {
      const obj = {
        label: i.name,
        value: i.sort,
      };
      SailingList.value.push(obj);
    }
    for (const i of wardData) {
      if (!i.disable) {
        const obj = {
          key: i.id,
          label: i.name,
        };
        tabData.value.push(obj);
      }
    }
    console.log('PrepareData', PrepareData);
    for (const i in PrepareData) {
      // console.log('i', i, PrepareData[i]);
      if (PrepareData[i] == null) continue;
      const obj = {
        groupKey: PrepareData[i] ? i : nanoid(),
        groupTit: TitleEnum[i],
        groupMode: 'simple',
        groupValue: [
          {
            value: PrepareData[i] ? PrepareData[i].length : 0,
            color: TitleEnum[i + 'Color'],
            background: TitleEnum[i + 'Bg'],
          },
        ],
        groupValueShow: true,
        groupData: PrepareData[i].map(ele => {
          return {
            id: ele.patientBasicId,
            type: '1',
            borderLeftColor: TitleEnum[i + 'Color'],
            ward: ele.inpatientWard,
            bed: ele.bed,
            cure: 'HDF/AVF',
            name: ele.name,
            age: ele.age,
            gender: ele.gender,
            infoShow: false,
            way: [
              { label: '透前称量', type: '2' },
              { label: '确认配方', type: '3' },
            ],
          };
        }),
      };
      dataCard.value.push(obj);
    }
    console.log(' dataCard.value', dataCard.value);
  });

  // formdata
  const formData = [
    {
      name: 'prepareStatus',
      label: '全部',
      componentType: 'Select',
      placeholder: '请选择',
      width: 100,
      defaultValue: '',
      dicts: [
        { label: '全部', value: '' },
        { label: '未称量', value: 'pds_unWeighed', prefixColor: TitleEnum.unWeighedColor },
        { label: '待确认', value: 'pds_unconfirmed', prefixColor: TitleEnum.unconfirmedColor },
        { label: '可打印', value: 'pds_printable', prefixColor: TitleEnum.printableColor },
        { label: '已完成', value: 'pds_finish', prefixColor: TitleEnum.finishColor },
      ],
    },
    {
      name: 'sailingSort',
      componentType: 'Select',
      placeholder: '请选择',
      width: 120,
      defaultValue: '1班',
      label: '班次',
      dicts: SailingList.value,
    },
    {
      name: 'name',
      componentType: 'Input',
      placeholder: '请输入',
      width: 200,
    },
  ];

  // 回调
  async function callTab(data) {
    console.log('🚀 ~ file: index.vue:41 ~ callTab ~ data:', data);
    tabSelected.value = data.value;
    const formData = {
      prepareStatus: Status.value,
      sailingSort: Sailing.value,
      name: Name.value,
      inpatientWardId: tabSelected.value,
    };
    const PrepareData = await readyPrepare(formData);
    console.log('PrepareData', PrepareData);
    dataCard.value = [];
    for (const i in PrepareData) {
      // console.log('i', i, PrepareData[i]);
      if (PrepareData[i] == null) continue;
      const obj = {
        groupKey: PrepareData[i] ? i : nanoid(),
        groupTit: TitleEnum[i],
        groupMode: 'simple',
        groupValue: [
          {
            value: PrepareData[i] ? PrepareData[i].length : 0,
            color: TitleEnum[i + 'Color'],
            background: TitleEnum[i + 'Bg'],
          },
        ],
        groupValueShow: true,
        groupData: PrepareData[i].map(ele => {
          return {
            id: ele.patientBasicId,
            type: '1',
            borderLeftColor: TitleEnum[i + 'Color'],
            ward: ele.inpatientWard,
            bed: ele.bed,
            cure: 'HDF/AVF',
            name: ele.name,
            age: ele.age,
            gender: ele.gender,
            infoShow: false,
            way: [
              { label: '透前称量', type: '2' },
              { label: '确认配方', type: '3' },
            ],
          };
        }),
      };
      dataCard.value.push(obj);
    }
  }

  function cellCard(data) {
    console.log('🚀 ~ file: index.vue:106 ~ cellCard ~ data:', data);
  }
  //  导入导出回调
  function cellTitle(data) {
    console.log('🚀 ~ file: index.vue:106 ~ cellTitle ~ data:', data);
    if (data.type == 'import') {
      openModal(true);
    }
  }
  async function cellFrom(data) {
    Status.value = data.prepareStatus;
    if (data.sailingSort) {
      Sailing.value = data.sailingSort;
    }
    Name.value = data.name;
    data.inpatientWardId = tabSelected.value;
    console.log('🚀 ~ file: index.vue:106 ~ cellFrom ~ data:', data);
    if (!data.sailingSort) {
      data.sailingSort = '1';
    }
    const PrepareData = await readyPrepare(data);
    console.log('PrepareData', PrepareData);
    dataCard.value = [];
    for (const i in PrepareData) {
      // console.log('i', i, PrepareData[i]);
      if (PrepareData[i] == null) continue;
      const obj = {
        groupKey: PrepareData[i] ? i : nanoid(),
        groupTit: TitleEnum[i],
        groupMode: 'simple',
        groupValue: [
          {
            value: PrepareData[i] ? PrepareData[i].length : 0,
            color: TitleEnum[i + 'Color'],
            background: TitleEnum[i + 'Bg'],
          },
        ],
        groupValueShow: true,
        groupData: PrepareData[i].map(ele => {
          return {
            id: ele.patientBasicId,
            type: '1',
            borderLeftColor: TitleEnum[i + 'Color'],
            ward: ele.inpatientWard,
            bed: ele.bed,
            cure: 'HDF/AVF',
            name: ele.name,
            age: ele.age,
            gender: ele.gender,
            infoShow: false,
            way: [
              { label: '透前称量', type: '2' },
              { label: '确认配方', type: '3' },
            ],
          };
        }),
      };
      dataCard.value.push(obj);
    }
  }

  // function callHover() {
  //   timeOuter.value = true;
  // }
</script>

<style lang="less" scoped>
  ::v-deep(.ant-form-item-label > label) {
    width: 100% !important;
  }

  .timeline-outer {
    display: flex;
    margin-left: 20px;
    transition: all 0.3s ease-in-out;

    &_item {
      padding: 0 30px;
      height: 40px;
      line-height: 40px;
      border-radius: 30px;
      color: #fff;
      background: #0075ff;
      margin-right: 20px;
      cursor: pointer;
    }
  }
</style>