<!--
 * @Author: lixg lixg@dongwu-inc.com
 * @Date: 2023-01-16 10:08:44
 * @LastEditors: lixg lixg@dongwu-inc.com
 * @LastEditTime: 2023-01-16 13:55:43
 * @FilePath: /stu_h5/src/views/pathmap/LearnPath.vue
 * @Description: 这是默认设置,请设置`customMade`, 打开koroFileHeader查看配置 进行设置: https://github.com/OBKoro1/koro1FileHeader/wiki/%E9%85%8D%E7%BD%AE
-->
<template>
  <div class="learnpath">
    <div class="main">
      <div v-for="(el, index) in data" :key="index">
        <div @click="goDetails(el)">{{ el.name }}</div>
      </div>
    </div>
  </div>
</template>

<script setup>
import { computed, ref } from "vue";
// import nostarted from "../../assets/image/nostarted.png";
// import completed from "../../assets/image/completed.png";
// import ongoing from "../../assets/image/ongoing.png";
import { usePage } from "@/api/request";
import { ROUTER_LIST } from "@/api/api";
import { useRouter } from "vue-router";
import store from "@/store";
// import PathDetailImage from "@/components/PathDetailImage.vue";

const detail = ref();
const showmapdetail = ref(false);
const currentStageId = ref();
const userInfo = computed(() => store.state.userInfo);
console.log("userInfo", userInfo);
const { data } = usePage(ROUTER_LIST, { pageSize: 60 });
console.log("学习路径列表", data, data.value);
const router = useRouter();
const goDetails = (item) => {
  // console.log("item", item);
  router.push({
    path: "/pathmappage",
    query: { routerId: item.routerId, routerName: item.routerName },
  });
};
</script>

<style lang="scss">
.learnpath {
  width: 100%;
  display: flex;
  flex-direction: column;
  align-items: center;
  .main {
    width: 100%;
    display: flex;
    flex-direction: column;
    //justify-content: center;
  }
}
</style>
