<template>
  <div class="pt-[32rpx] pb-[30rpx] flex gap-[30rpx] not-last:border-b border-[#EDEDED]">
    <div class="flex flex-col gap-[16rpx]">
      <span class="text-[32rpx] font-semibold text-[#000]">{{ major.percentAge || "0%" }}</span>
    </div>
    <div class="flex flex-col gap-[16rpx] flex-1">
      <div class="flex justify-between flex-auto">
        <div class="flex flex-col">
          <div class="flex items-center">
            <div class="text-[32rpx] text-[#000] font-semibold max-w-[400rpx]">
              {{ major.major.replace(/(\r\n|\n|\r)/g, "") }}
            </div>
            <div v-if="major.majorGroup" class="bg-[#E2EDF9] rounded-[4rpx] text-[20rpx] text-[#1580FF] flex items-center justify-center ml-[10rpx] px-[6rpx] py-[4rpx] leading-[1]">专业组{{ major.majorGroup }}</div>
          </div>
          <span class="text-[22rpx] text-[#1F2329] mt-[14rpx]">{{ major.remark }}</span>
          <div class="flex justify-between text-[22rpx] text-[#1F2329] mt-[14rpx] gap-[16rpx]">
            <div class="flex flex-col gap-[16rpx]">
              <span>代码{{ major.majorCode }}</span>
              <span>{{ year }}计划{{ major.planCount }}人</span>
            </div>
            <div class="flex flex-col gap-[16rpx]">
              <span>选科:{{ major.subjectClam }}</span>
              <span>学费/学制:{{ major.fee }}/{{ major.academic }}</span>
            </div>
          </div>
        </div>
        <div class="flex gap-[40rpx]">
          <div class="i-carbon-move handle-major"></div>
          <div class="i-carbon-trash-can" @click="handleDelete"></div>
        </div>
      </div>
      <DataTable :data="major.planItems" :score="score" />
    </div>
  </div>
</template>

<script setup lang="ts">
import DataTable from './DataTable.vue';

const props = defineProps<{
    major: any;
    score: number;
    year: number;
    majorIndex: number;
    collegeIndex: number;
  }>();

  const emit = defineEmits([ "delete"]);

  const {removeMajor} = inject<{removeMajor:(index:number,mIndex:number) => void}>('sort') || {}


  const handleDelete = () => {
    if(removeMajor){
        removeMajor(props.collegeIndex,props.majorIndex)
    }
  };
</script>

<style lang="scss" scoped></style>
