xjc-vue/src/views/xjc-integratedmachine/wakeup/career_maturity/evaluation.vue

<template>
  <div class="maturity-game-page">
    <head-component :headinfo=headinfo></head-component>
    <div class="page-content">
      <div></div>
      <div>
        <div class="content-img">
          <img src="@/assets/images/wakeup/maturity/shadow-bg.png" >
        </div>
        <div>
          <img src="@/assets/images/wakeup/maturity/shadow-bg.png" >
          <img src="@/assets/images/wakeup/maturity/shadow-bg.png" >
          <img src="@/assets/images/wakeup/maturity/shadow-bg.png" >
          <img src="@/assets/images/wakeup/maturity/shadow-bg.png" >
          <img src="@/assets/images/wakeup/maturity/shadow-bg.png" >
        </div>
      </div>
      <div></div>
<!--      <div class="top">-->
<!--        <img src="@/assets/images/wakeup/maturity/maturity-game-title.png" >-->
<!--      </div>-->
<!--      <div class="bottom">-->
<!--        <img src="@/assets/images/wakeup/maturity/maturity-game-left.png" >-->
<!--        <img src="@/assets/images/wakeup/maturity/maturity-game-right.png" >-->
<!--      </div>-->
    </div>
  </div>

</template>

<script setup>
import headComponent from '@/views/xjc-integratedmachine/components/head_component.vue'


const router = useRouter()

const headinfo = ref({})


const draggedItem = ref(null);

function dragStart(event) {
  draggedItem.value = event.target;
}

function drop(event) {
  event.preventDefault(); // 防止默认处理（例如打开链接）
  if (event.target !== draggedItem.value) {
    const target = event.target; // 获取放置的目标元素
    const item = draggedItem.value; // 获取被拖拽的元素
    // 交换位置或进行其他操作
    item.parentNode.insertBefore(item, target); // 将被拖拽的元素插入到目标元素之前
  }
}

function setHeadinfo(){
  headinfo.value = {
    title: '生涯成熟度测评',
    user: {
      avatar: '头像路径',
      nickName: '张三'
    },
    backUrl : '/index'
  }
}


function jumpTo(path) {
  router.push({
    path: path,
    query: {name: 123}
  })
}

onMounted(() => {
  setHeadinfo()
})



</script>


<style scoped lang="scss">
.maturity-game-page{
  background: url('@/assets/images/wakeup/maturity/maturity-game-bg.png') no-repeat;
  background-size: 1920px 1080px;
  z-index:10;
  width: 100%;
  height: 1080px;
  .page-content{
    width: 100%;
    position: absolute;
    top: 123px;
    bottom: 0;
   .content-img{
     width: 1187px;
     height: 345px;
     border: 1px solid;
     img{
       width: 1187px;
       height: 345px;
     }
   }
  }

}

</style>