dz-app/pages/ie/entry-analysis/components/college-major-result.vue

<template>
    <num-common-card :num="model.num">
        <template #header>
            <college-item :item="detail.baseInfo" hidden-logo hidden-address/>
        </template>
        <view class="mx-40 my-10">
            <uv-line/>
        </view>
        <view class="mt-20 px-40 fx-col">
            <view v-for="([label, values],i) in groupedResults">
                <view class="text-primary mb-20">{{ label }}</view>
                <view class="fx-col gap-20">
                    <view v-for="(m, idx) in values" class="px-20 fx-row fx-bet-cen" @click="goMajorReport(m)">
                        <view class="fx-col">
                            <view class="fx-row text-sm text-main">
                                <text style="width: 55px">专业{{ ' ' + (idx + 1) }}</text>
                                <view class="fx-col">
                                    <text>{{ m.majorName }}</text>
                                    <text v-if="m.majorDirection" class="text-primary-light text-4xs">
                                        {{ m.majorDirection }}
                                    </text>
                                </view>
                            </view>
                            <view class="text-2xs font-light mt-5">录取概率
                                <text class="text-primary ml-10">{{ m.enrollRate || '-' }}%</text>
                            </view>
                        </view>
                        <view>
                            <uv-text size="12" type="primary" text="查看" class="keep-all" suffix-icon="eye"
                                     :icon-style="{color:'var(--primary-color)'}"/>
                        </view>
                    </view>
                </view>
                <uv-divider v-if="i<groupedResults.length-1"/>
            </view>
        </view>
        <uv-gap height="12"/>
    </num-common-card>
</template>

<script>
import _ from 'lodash';
import NumCommonCard from "@/pages/ie/entry-analysis/components/num-common-card.vue";
import CollegeItem from "@/pages/college-library/components/college-item.vue";
import {useTransfer} from "@/hooks/useTransfer";
import {useCacheStore} from "@/hooks/useCacheStore";
import {universityDetail} from "@/api/webApi/collegemajor";

export default {
    name: "college-major-result",
    components: {CollegeItem, NumCommonCard},
    props: {
        model: {
            type: Object,
            default: () => ({num: 0, code: '', majorCodes: []})
        },
        results: {
            type: Array,
            default: () => []
        }
    },
    data() {
        return {
            detail: {
                baseInfo: {},
                professions: []
            }
        }
    },
    computed: {
        groupedResults() {
            return Object.entries(_.groupBy(this.results, m => m.majorGroup))
        }
    },
    setup() {
        const {transferTo} = useTransfer()
        const {dispatchCache} = useCacheStore()

        return {
            transferTo,
            dispatchCache
        }
    },
    mounted() {
        this.loadDetail()
    },
    methods: {
        async loadDetail() {
            const payload = {code: this.model.code}
            const res = await this.dispatchCache(universityDetail, payload)
            this.detail = res.data
        },
        goMajorReport(single) {
            const path = '/pages/ie/entry-analysis/analysis-major-detail'
            this.transferTo(path, single, null, true)
        }
    }
}
</script>

<style scoped>

</style>