<script setup>
import { ref, reactive, onMounted } from "vue";
import { useRoute } from "vue-router";
import { getUserListObjectByModelId, getAssessmentIndName } from "@/api/draw";

const props = defineProps({
  // 行数
  activeName: {
    type: String,
    default: "0"
  }
});
const $emit = defineEmits(["handClick"]);
const dataList = reactive({
  teplist: [],
  personList: [],
  magList: [],
  deptList: [],
  params: {
    assessmentId: "",
    assessmentModelId: "",
    deptCode: "",
    assessmentObjectId: "",
    indName: ""
  }
});

// 部门
const postListTreeApi = async selectedItem => {
  const { data, code } = await getUserListObjectByModelId({
    type: 1,
    assessmentId: selectedItem.assessmentId,
    modelId: selectedItem.assessmentModelId
  });
  if (code === 200) {
    dataList.deptList = data;
    data.map(item => {
      if (route.query.uname === item.assessmentObjectName) {
        dataList.params.assessmentObjectId = item.assessmentObjectId;
      }
    });
  }
};

// 指标
const route = useRoute();
const assessmentList = ref([]);
const getAssessmentIndNameApi = async () => {
  const { data, code } = await getAssessmentIndName({
    assessmentId: route.query.id
  });
  if (code === 200) {
    assessmentList.value = data;
  }
};

onMounted(async () => {
  dataList.params.assessmentId = route.query.id;
  dataList.params.assessmentModelId = route.query.mid;
  init.assessmentName = route.query.name;
  init.assessmentModelName = route.query.mname;
  await postListTreeApi({
    assessmentId: route.query.id,
    assessmentModelId: route.query.mid
  });
  getAssessmentIndNameApi();
  handClickInit3("init");
});

// -----------------------------------
const init = reactive({
  assessmentName: "",
  assessmentModelName: "",
  deptName: "",
  assessmentObjectName: "",
  dimensionName: ""
});
const handClickInit3 = value => {
  if (value) {
    if (value === "init") {
      init.assessmentObjectName = route.query.uname || "";
    } else {
      const selectedItem = dataList.deptList.find(
        item => item.assessmentObjectId === value
      );
      init.assessmentObjectName = selectedItem.assessmentObjectName;
    }
  } else {
    init.assessmentObjectName = "";
  }

  $emit(
    "handClick",
    {
      ...dataList.params,
      ...init
    },
    1
  );
};
const handClickInit5 = value => {
  $emit(
    "handClick",
    {
      ...dataList.params,
      ...init,
      indName: value
    },
    "1"
  );
};
</script>

<template>
  <div class="w-full">
    <div class="mb-2 flex gap-2 justify-between flex-wrap">
      <div class="w-[100%] flex mt-2">
        <div v-if="props.activeName === '0'" class="flex mr-2">
          <div class="text-sm leading-8 mr-3">科室</div>
          <el-select
            v-model="dataList.params.assessmentObjectId"
            clearable
            filterable
            placeholder="请选择"
            style="width: 200px"
            @change="handClickInit3"
          >
            <el-option
              v-for="item in dataList.deptList"
              :key="item.assessmentObjectId"
              :label="item.assessmentObjectName"
              :value="item.assessmentObjectId"
            />
          </el-select>
        </div>
        <div v-else class="flex mr-2">
          <div class="text-sm leading-8 mr-3">指标</div>
          <el-select
            v-model="dataList.params.indName"
            clearable
            filterable
            placeholder="请选择"
            style="width: 200px"
            @change="handClickInit5"
          >
            <el-option
              v-for="(item, idx) in assessmentList"
              :key="idx"
              :label="item"
              :value="item"
            />
          </el-select>
        </div>
      </div>
    </div>
  </div>
</template>
