<script setup>
import { ref, reactive } from "vue";
import { getTemplateInfoList } from "@/api/templateInfo";
import { userPageWhitOrganization } from "@/api/userSetting";
import { getAssessmentPageList } from "@/api/manage";
import { postListTree } from "@/api/department";
import {
  getAssessmentList,
  getModelListByAssessmentId,
  getUserListObjectByModelId,
  getDeptListByUserList
} from "@/api/draw";
import { useRouter, useRoute } from "vue-router";

const value = ref("");
const $emit = defineEmits(["handClick"]);
const dataList = reactive({
  teplist: [],
  personList: [],
  magList: [],
  deptList: [],
  params: {
    assessmentId: "",
    assessmentModelId: "",
    deptCode: "",
    assessmentObjectId: ""
  }
});

// 搜索框----------------------------------------------------
// 考核模版
const getTemplateInfoListApi = async selectedItem => {
  const { data, code } = await getModelListByAssessmentId(selectedItem);
  if (code === 200) {
    dataList.teplist = data;
  }
};
// getTemplateInfoListApi();
// 员工
const userPageWhitOrganizationApi = async (selectedItem, type) => {
  let assessmentId;
  if (type) {
    assessmentId = selectedItem.id;
  } else {
    assessmentId = selectedItem.assessmentId;
  }
  const { data, code } = await getUserListObjectByModelId({
    modelId: selectedItem?.assessmentModelId,
    assessmentId,
    type: 0
  });
  if (code === 200) {
    dataList.personList = data;
    data.map(item => {
      if (
        item.assessmentObjectId &&
        item.assessmentObjectId.substring(0, 4) == "user"
      ) {
        userCodeList.value.push(item.assessmentObjectId);
      }
    });
    getDeptListByUserListApi();
  }
};

// 部门
// const postListTreeApi = async selectedItem => {
//   const { data, code } = await getUserListObjectByModelId({
//     modelId: selectedItem.assessmentModelId,
//     type: 1,
//     assessmentId: selectedItem.assessmentId
//   });
//   if (code === 200) {
//     dataList.deptList = data;
//   }
// };
const userCodeList = ref([]);
const getDeptListByUserListApi = async () => {
  const { data, code } = await getDeptListByUserList(userCodeList.value);
  if (code === 200) {
    const uniqueDeptCodes = {};
    dataList.deptList = data.filter(item => {
      if (!uniqueDeptCodes[item.deptCode]) {
        uniqueDeptCodes[item.deptCode] = true;
        return true; // 保留该项
      }
      return false; // 过滤掉重复项
    });
  }
};
// postListTreeApi();
// -----------------------------------
const init = reactive({
  assessmentName: "",
  assessmentModelName: "",
  deptName: "",
  assessmentObjectName: "",
  dimensionName: ""
});
const handClickInit1 = value => {
  if (value) {
    const selectedItem = dataList.magList.find(item => item.id === value);
    init.assessmentName = selectedItem.name;
    localStorage.setItem("fileName", selectedItem.name);
    getTemplateInfoListApi(selectedItem);
  }
  Object.assign(dataList.params, {
    assessmentModelId: "",
    deptCode: "",
    assessmentObjectId: ""
  });
  Object.assign(init, {
    assessmentModelName: "",
    deptName: "",
    assessmentObjectName: "",
    dimensionName: ""
  });
  $emit(
    "handClick",
    {
      ...dataList.params,
      ...init
    },
    "0"
  );
};
const handClickInit2 = value => {
  if (value) {
    const selectedItem = dataList.teplist.find(
      item => item.assessmentModelId === value
    );
    init.assessmentModelName = selectedItem.assessmentModelName;
    userPageWhitOrganizationApi(selectedItem, 0);
    // postListTreeApi(selectedItem);
  }
  Object.assign(dataList.params, {
    deptCode: "",
    assessmentObjectId: ""
  });
  $emit(
    "handClick",
    {
      ...dataList.params,
      ...init
    },
    "0"
  );
};
const handClickInit3 = value => {
  if (value) {
    const selectedItem = dataList.personList.find(
      item => item.deptCode === value
    );
    init.deptName = selectedItem?.deptName;
    // init.deptName = value.deptName;
  }
  $emit(
    "handClick",
    {
      ...dataList.params,
      ...init
    },
    "0"
  );
};
const handClickInit4 = value => {
  if (value) {
    const selectedItem = dataList.personList.find(
      item => item.assessmentObjectId === value
    );
    init.assessmentObjectName = selectedItem.assessmentObjectName;
  }
  $emit(
    "handClick",
    {
      ...dataList.params,
      ...init
    },
    "1",
    value
  );
};
const route = useRoute();
const getSearchFrom = () => {
  if (Object.keys(route.query).length > 0) {
    const {
      assessmentId,
      assessmentModelId,
      assessmentObjectId,
      assessmentName,
      assessmentModelName,
      assessmentObjectName
    } = route.query;
    dataList.params.assessmentId = assessmentId;
    dataList.params.assessmentModelId = assessmentModelId;
    dataList.params.assessmentObjectId = assessmentObjectId;
    init.assessmentName = assessmentName;
    init.assessmentModelName = assessmentModelName;
    init.assessmentObjectName = assessmentObjectName;
    const selectedItem = dataList.magList.find(
      item => item.id === assessmentId
    );
    getTemplateInfoListApi(selectedItem);
    userPageWhitOrganizationApi(selectedItem, 1);
    setTimeout(() => {
      $emit(
        "handClick",
        {
          ...dataList.params,
          ...init
        },
        1
      );
    }, 100);
  }
};

// 考核活动
const getAssessmentPageListApi = async () => {
  const { data, code } = await getAssessmentList({
    type: 0
  });
  if (code === 200) {
    dataList.magList = data;
    getSearchFrom();
  }
};
if (route.query) {
  getAssessmentPageListApi();
}
// 清除条件
const handClickClear1 = () => {
  dataList.teplist = [];
  dataList.deptList = [];
  dataList.personList = [];
};
const handClickClear2 = () => {
  dataList.deptList = [];
  dataList.personList = [];
};
const handClickClear3 = () => {
  dataList.personList = [];
};
</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 class="flex mr-2">
          <div class="text-sm leading-8 mr-3">考核活动</div>
          <el-select
            v-model="dataList.params.assessmentId"
            clearable
            filterable
            placeholder="请选择"
            style="width: 200px"
            @change="handClickInit1"
            @clear="handClickClear1"
          >
            <el-option
              v-for="item in dataList.magList"
              :key="item.id"
              :label="item.name"
              :value="item.id"
            />
          </el-select>
        </div>
        <div class="flex mr-2">
          <div class="text-sm leading-8 mr-3">考核模板</div>
          <el-select
            v-model="dataList.params.assessmentModelId"
            clearable
            filterable
            placeholder="请选择"
            style="width: 200px"
            @change="handClickInit2"
            @clear="handClickClear2"
          >
            <el-option
              v-for="item in dataList.teplist"
              :key="item.assessmentModelId"
              :label="item.assessmentModelName"
              :value="item.assessmentModelId"
            />
          </el-select>
        </div>
        <div class="flex mr-2">
          <div class="text-sm leading-8 mr-3">科室</div>
          <el-select
            v-model="dataList.params.deptCode"
            clearable
            filterable
            placeholder="请选择"
            style="width: 200px"
            @change="handClickInit3"
            @clear="handClickClear3"
          >
            <el-option
              v-for="item in dataList.deptList"
              :key="item.deptCode"
              :label="item.deptName"
              :value="item.deptCode"
            />
          </el-select>
        </div>
        <div 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="handClickInit4"
          >
            <el-option
              v-for="item in dataList.personList"
              :key="item.assessmentObjectId"
              :label="item.assessmentObjectName"
              :value="item.assessmentObjectId"
            />
          </el-select>
        </div>
      </div>
    </div>
  </div>
</template>
