hospital-project/src/views/draw/children/health/dataDetail.vue

<script setup lang="ts">
defineOptions({
  name: "healthDataDetail"
});
import rankTableDraw from "@/components/rankTable/index.vue";
import assessmentRank from "@/components/rankTable/assessmentRank.vue";
import { getPersonDimensionChartsList, getChartsList } from "@/api/draw";
import seachData from "./componements/seach.vue";
import { ref, nextTick } from "vue";
import { useRouter } from "vue-router";
import { useAppStoreHook } from "@/store/modules/app";

// tab逻辑
const activeName = ref("0");
const handleClick = val => {
  activeName.value = val;
};

const rankTableRef = ref();
const seachParams = ref();
const lengthData = ref();
const getPersonDimensionChartsListApi = async () => {
  const { code, data } = await getChartsList({
    ...seachParams.value,
    type: 2
  });

  if (code == 200) {
    if (data.length > 0) {
      lengthData.value = data.length;
      setTimeout(() => {
        nextTick(() => {
          rankTableRef.value && rankTableRef.value.init(data, "科室", "姓名");
        });
      }, 500);
    }
  }

  // console.log(res);
};
const init = (item, type) => {
  seachParams.value = item;
  if (Number(type)) {
    getPersonDimensionChartsListApi();
  }
};

// 返回上一页
const router = useRouter();
const backChange = () => {
  useAppStoreHook().toggleSideBar(true, "打开");
  router.push("/draw/children/health/healthRank");
};
</script>

<template>
  <div class="w-full">
    <div class="flex mb20">
      <el-text class="cursor-pointer" @click="backChange">
        <el-icon>
          <ArrowLeft />
        </el-icon>
        返回
      </el-text>
      <!-- <el-radio-group v-model="activeName" @change="handleClick">
        <el-radio-button value="0">科室维度</el-radio-button>
        <el-radio-button value="1">指标维度</el-radio-button>
      </el-radio-group> -->
    </div>
    <div v-if="activeName === '0'">
      <div class="mb-2 flex gap-2 justify-between flex-wrap">
        <seachData :activeName="activeName" @handClick="init" />
      </div>
      <rankTableDraw v-if="lengthData > 0" ref="rankTableRef" />
    </div>
    <!-- <div v-else-if="activeName === '1'">
      <div class="mb-2 flex gap-2 justify-between flex-wrap">
        <seachData :activeName="activeName" @handClick="init" />
      </div>
      <assessmentRank ref="rankTableRef2" />
    </div> -->
  </div>
</template>
<style lang="scss" scoped>
.cursor-pointer {
  margin-right: 23px;
}

.mb20 {
  padding-top: 20px;
  margin-bottom: 20px;
}
</style>