no message
This commit is contained in:
A1300399510
parent
bc9734adfa
commit
a9b932f19d
@ -94,7 +94,6 @@
|
||||
align-items: flex-start;
|
||||
}
|
||||
.content {
|
||||
height: 1214px;
|
||||
background-color: #ffffff;
|
||||
border: 1px solid #f2f2f2;
|
||||
border-radius: 12px;
|
||||
@ -186,6 +185,9 @@
|
||||
height: 16px;
|
||||
margin-left: 8px;
|
||||
}
|
||||
.content .details-box .mb40 {
|
||||
margin-bottom: 40px;
|
||||
}
|
||||
.content .details-box .ranking {
|
||||
margin-bottom: 40px;
|
||||
}
|
||||
@ -202,6 +204,7 @@
|
||||
background-color: #ffffff;
|
||||
padding: 0 22px;
|
||||
justify-content: space-between;
|
||||
width: 252px;
|
||||
}
|
||||
.content .details-box .ranking .item .rank .logo {
|
||||
height: 24px;
|
||||
@ -235,6 +238,72 @@
|
||||
.content .details-box .ranking .item .rank-box .itemm:first-of-type {
|
||||
margin-bottom: 9px;
|
||||
}
|
||||
.content .details-box .text-box {
|
||||
padding: 20px 16px 20px;
|
||||
position: relative;
|
||||
overflow: hidden;
|
||||
}
|
||||
.content .details-box .text-box .text-head {
|
||||
font-family: "PingFangSC-Semibold", "PingFang SC Semibold", "PingFang SC", sans-serif;
|
||||
font-weight: 650;
|
||||
font-style: normal;
|
||||
font-size: 18px;
|
||||
color: #000000;
|
||||
text-align: center;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
margin-bottom: 20px;
|
||||
}
|
||||
.content .details-box .text-box .text-head .text-icon {
|
||||
width: 16px;
|
||||
height: 9px;
|
||||
margin: auto auto 11px;
|
||||
position: absolute;
|
||||
top: 0;
|
||||
left: 50%;
|
||||
transform: translateX(-50%);
|
||||
}
|
||||
.content .details-box .text-box .text-list {
|
||||
width: 640px;
|
||||
height: 320px;
|
||||
overflow: hidden;
|
||||
white-space: nowrap;
|
||||
}
|
||||
.content .details-box .text-box .text {
|
||||
display: inline-block;
|
||||
font-size: 15px;
|
||||
color: #000000;
|
||||
line-height: 32px;
|
||||
white-space: pre-line;
|
||||
}
|
||||
.content .details-box .text-box .text.text-center {
|
||||
width: 100%;
|
||||
text-align: center;
|
||||
}
|
||||
.content .details-box .text-box .text.textRef {
|
||||
position: absolute;
|
||||
color: transparent;
|
||||
top: -10000%;
|
||||
padding: 20px 16px;
|
||||
}
|
||||
.content .details-box .text-box .indicate {
|
||||
line-height: 12px;
|
||||
margin-top: 24px;
|
||||
}
|
||||
.content .details-box .text-box .indicate .icon {
|
||||
width: 7px;
|
||||
height: 12px;
|
||||
cursor: pointer;
|
||||
}
|
||||
.content .details-box .text-box .indicate .icon.btn-right {
|
||||
transform: rotate(180deg);
|
||||
}
|
||||
.content .details-box .text-box .indicate .text {
|
||||
color: #555555;
|
||||
font-size: 13px;
|
||||
margin: 0 12px;
|
||||
line-height: normal;
|
||||
}
|
||||
.content .details-box .application-schedule {
|
||||
margin-bottom: 40px;
|
||||
}
|
||||
|
||||
@ -107,7 +107,6 @@
|
||||
}
|
||||
|
||||
.content {
|
||||
height: 1214px;
|
||||
background-color: rgba(255, 255, 255, 1);
|
||||
border: 1px solid rgba(242, 242, 242, 1);
|
||||
border-radius: 12px;
|
||||
@ -205,6 +204,10 @@
|
||||
}
|
||||
}
|
||||
|
||||
.mb40 {
|
||||
margin-bottom: 40px;
|
||||
}
|
||||
|
||||
.ranking {
|
||||
margin-bottom: 40px;
|
||||
.item {
|
||||
@ -220,6 +223,7 @@
|
||||
background-color: rgba(255, 255, 255, 1);
|
||||
padding: 0 22px;
|
||||
justify-content: space-between;
|
||||
width: 252px;
|
||||
.logo {
|
||||
height: 24px;
|
||||
}
|
||||
@ -261,6 +265,79 @@
|
||||
}
|
||||
}
|
||||
|
||||
.text-box {
|
||||
padding: 20px 16px 20px;
|
||||
position: relative;
|
||||
overflow: hidden;
|
||||
.text-head {
|
||||
.text-icon {
|
||||
width: 16px;
|
||||
height: 9px;
|
||||
margin: auto auto 11px;
|
||||
position: absolute;
|
||||
top: 0;
|
||||
left: 50%;
|
||||
transform: translateX(-50%);
|
||||
}
|
||||
font-family: "PingFangSC-Semibold", "PingFang SC Semibold", "PingFang SC", sans-serif;
|
||||
font-weight: 650;
|
||||
font-style: normal;
|
||||
font-size: 18px;
|
||||
color: #000000;
|
||||
text-align: center;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
margin-bottom: 20px;
|
||||
}
|
||||
.text-list {
|
||||
width: 640px;
|
||||
height: 320px;
|
||||
overflow: hidden;
|
||||
white-space: nowrap;
|
||||
}
|
||||
.text {
|
||||
display: inline-block;
|
||||
// margin: 20px 0;
|
||||
font-size: 15px;
|
||||
color: #000000;
|
||||
line-height: 32px;
|
||||
white-space: pre-line;
|
||||
|
||||
&.text-center {
|
||||
width: 100%;
|
||||
text-align: center;
|
||||
}
|
||||
&.textRef {
|
||||
position: absolute;
|
||||
color: transparent;
|
||||
top: -10000%;
|
||||
padding: 20px 16px;
|
||||
}
|
||||
}
|
||||
|
||||
.indicate {
|
||||
line-height: 12px;
|
||||
margin-top: 24px;
|
||||
|
||||
.icon {
|
||||
width: 7px;
|
||||
height: 12px;
|
||||
cursor: pointer;
|
||||
|
||||
&.btn-right {
|
||||
transform: rotate(180deg);
|
||||
}
|
||||
}
|
||||
.text {
|
||||
color: #555555;
|
||||
font-size: 13px;
|
||||
margin: 0 12px;
|
||||
// padding: 24px 0 0;
|
||||
line-height: normal;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.application-schedule {
|
||||
margin-bottom: 40px;
|
||||
.list {
|
||||
@ -884,7 +961,6 @@
|
||||
width: 251px;
|
||||
border-radius: 6px;
|
||||
background-color: rgba(247, 247, 247, 1);
|
||||
|
||||
}
|
||||
.brief {
|
||||
display: inline-block;
|
||||
|
||||
@ -6,9 +6,14 @@
|
||||
<title>Document</title>
|
||||
<link rel="stylesheet" href="/css/common.css" />
|
||||
<link rel="stylesheet" href="/css/details.css" />
|
||||
<script src="/js/axios.min.js"></script>
|
||||
<script src="/js/vue.global.js"></script>
|
||||
<script src="/js/common.js"></script>
|
||||
<script src="/js/base.js"></script>
|
||||
<script src="/js/crypto-js.js"></script>
|
||||
</head>
|
||||
<body>
|
||||
<div class="main">
|
||||
<div class="main" id="app">
|
||||
<img class="index-icon" src="/img/index-icon.png" />
|
||||
|
||||
<div class="box">
|
||||
@ -17,33 +22,39 @@
|
||||
<img class="img" src="/img/arrows.svg" />
|
||||
按学科查看
|
||||
<img class="img" src="/img/arrows.svg" />
|
||||
商业及管理
|
||||
{{ disciplineObj[info.disciplineid]?.label || '' }}
|
||||
<img class="img" src="/img/arrows.svg" />
|
||||
<div class="current">理学硕士（金融学）</div>
|
||||
<div class="current">{{ info.name_zh }}</div>
|
||||
</div>
|
||||
<div class="details flexflex">
|
||||
<img class="logo" src="/img/details-icon.png" />
|
||||
<div class="right">
|
||||
<div class="name">理学硕士（金融学）</div>
|
||||
<div class="name-en">The University of Hong Kong</div>
|
||||
<div class="name">{{ info.name_zh }}</div>
|
||||
<div class="name-en">{{ info.name_en }}</div>
|
||||
<div class="school flexacenter">
|
||||
<div class="flexacenter">
|
||||
<img class="icon" src="https://axure-file.lanhuapp.com/md5__68256768938198d279381608ea82d345.png" />
|
||||
香港大学
|
||||
<img class="icon" :src="info.schoollogo" />
|
||||
{{ info.schoolname || '' }}
|
||||
</div>
|
||||
<div class="line">|</div>
|
||||
商学院
|
||||
<div class="line">|</div>
|
||||
经济与金融学系
|
||||
<template v-if="info.au0">
|
||||
<div class="line">|</div>
|
||||
{{ info.au0 }}
|
||||
</template>
|
||||
<template v-if="info.au1">
|
||||
<div class="line">|</div>
|
||||
{{ info.au1 }}
|
||||
</template>
|
||||
</div>
|
||||
|
||||
<div class="word flexacenter">
|
||||
<img class="img" src="/img/quotation-mark.png" />
|
||||
一句话描述独特之处，一句话描述独特之处。
|
||||
111111111111111111111111111
|
||||
</div>
|
||||
|
||||
<div class="tag flexflex">
|
||||
<div class="tag-item admissions">招生官项目</div>
|
||||
<div class="tag-item admissions" v-if="info.admissionsproject">招生官项目</div>
|
||||
<div class="tag-item gray" :class="{'semester': info.semesterState}">{{ info?.semester?.text }}</div>
|
||||
<div class="tag-item" v-for="item in info.tags">{{ item }}</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
@ -52,257 +63,220 @@
|
||||
<div class="body flexflex">
|
||||
<div class="content flex1 flexflex">
|
||||
<div class="side flexflex">
|
||||
<div class="item flexcenter pitch">基本信息</div>
|
||||
<div class="item flexcenter">基本信息</div>
|
||||
<div class="item flexcenter">基本信息</div>
|
||||
<div class="item flex1"></div>
|
||||
<div class="item flexcenter" :class="{'pitch': sideKey == key}" v-for="(item,key) in side">{{ item }}</div>
|
||||
</div>
|
||||
<div class="details-box flex1">
|
||||
<div class="side-item">
|
||||
<div style="display: none;">
|
||||
<div class="item-header flexacenter">
|
||||
<div>专业排名</div>
|
||||
<div class="list-btn flexacenter">
|
||||
榜单
|
||||
<image class="icon" mode="widthFix" src="/img/arrows-circle-black.svg"> </image>
|
||||
</div>
|
||||
<div class="item-header flexacenter">
|
||||
<div>专业排名</div>
|
||||
<div class="list-btn flexacenter">
|
||||
榜单
|
||||
<image class="icon" mode="widthFix" src="/img/arrows-circle-black.svg"> </image>
|
||||
</div>
|
||||
<div class="ranking">
|
||||
<div class="item flexflex">
|
||||
<div class="rank flexacenter">
|
||||
<img class="logo" />
|
||||
<div class="number flexcenter">
|
||||
70
|
||||
<img class="triangle" src="https://app.gter.net/image/miniApp/offer/triangle-qs.svg" />
|
||||
</div>
|
||||
</div>
|
||||
<div class="rank-box flexflex flex1">
|
||||
<div class="itemm flexacenter">
|
||||
<div class="key">年份：</div>
|
||||
<div class="value flex1">2024</div>
|
||||
</div>
|
||||
<div class="itemm flexacenter">
|
||||
<div class="key">学科：</div>
|
||||
<div class="value flex1">Accounting & Finance</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="ranking">
|
||||
<div class="item flexflex" v-for="item in info.rankings">
|
||||
<div class="rank flexacenter">
|
||||
<img class="logo" :src="'/img/' + rankingsObj[item.system].alias + '.png'" />
|
||||
<div class="number flexcenter">
|
||||
{{ item.total_score }}
|
||||
<img class="triangle" src="https://app.gter.net/image/miniApp/offer/triangle-qs.svg" />
|
||||
</div>
|
||||
</div>
|
||||
<div class="item flexflex">
|
||||
<div class="rank flexacenter">
|
||||
<img class="logo" />
|
||||
<div class="number flexcenter">
|
||||
70
|
||||
<img class="triangle" src="https://app.gter.net/image/miniApp/offer/triangle-qs.svg" />
|
||||
</div>
|
||||
<div class="rank-box flexflex flex1">
|
||||
<div class="itemm flexacenter">
|
||||
<div class="key">年份：</div>
|
||||
<div class="value flex1">{{ item.year }}</div>
|
||||
</div>
|
||||
<div class="rank-box flexflex flex1">
|
||||
<div class="itemm flexacenter">
|
||||
<div class="key">年份：</div>
|
||||
<div class="value flex1">2024</div>
|
||||
</div>
|
||||
<div class="itemm flexacenter">
|
||||
<div class="key">学科：</div>
|
||||
<div class="value flex1">Accounting & Finance</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="item flexflex">
|
||||
<div class="rank flexacenter">
|
||||
<img class="logo" />
|
||||
<div class="number flexcenter">
|
||||
70
|
||||
<img class="triangle" src="https://app.gter.net/image/miniApp/offer/triangle-qs.svg" />
|
||||
</div>
|
||||
</div>
|
||||
<div class="rank-box flexflex flex1">
|
||||
<div class="itemm flexacenter">
|
||||
<div class="key">年份：</div>
|
||||
<div class="value flex1">2024</div>
|
||||
</div>
|
||||
<div class="itemm flexacenter">
|
||||
<div class="key">学科：</div>
|
||||
<div class="value flex1">Accounting & Finance</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="item flexflex">
|
||||
<div class="rank flexacenter">
|
||||
<img class="logo" />
|
||||
<div class="number flexcenter">
|
||||
70
|
||||
<img class="triangle" src="https://app.gter.net/image/miniApp/offer/triangle-qs.svg" />
|
||||
</div>
|
||||
</div>
|
||||
<div class="rank-box flexflex flex1">
|
||||
<div class="itemm flexacenter">
|
||||
<div class="key">年份：</div>
|
||||
<div class="value flex1">2024</div>
|
||||
</div>
|
||||
<div class="itemm flexacenter">
|
||||
<div class="key">学科：</div>
|
||||
<div class="value flex1">Accounting & Finance</div>
|
||||
</div>
|
||||
<div class="itemm flexacenter">
|
||||
<div class="key">学科：</div>
|
||||
<div class="value flex1">{{ item.subject }}</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="item-header flexacenter">申请日程</div>
|
||||
<div class="application-schedule block">
|
||||
<div class="list">
|
||||
<div class="time flexflex">
|
||||
<div class="item flex1">
|
||||
<div class="name">2024-01-05</div>
|
||||
<div class="value">开始申请日期</div>
|
||||
</div>
|
||||
<div class="item flex1">
|
||||
<div class="name">2024-01-05</div>
|
||||
<div class="value">截止申请日期</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="application-else">
|
||||
<div class="item flexacenter">
|
||||
<div class="name">面试时间：</div>
|
||||
<div class="value flex1">2024-01-05</div>
|
||||
</div>
|
||||
<div class="item flexacenter">
|
||||
<div class="name">结果通知时间：</div>
|
||||
<div class="value flex1">2024-01-05</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="item-header flexacenter">最低入学要求</div>
|
||||
</div>
|
||||
<div class="item-header flexacenter">项目简介</div>
|
||||
<text-module :text="info.intro || ' - '" class="mb40"></text-module>
|
||||
|
||||
<div class="demand block">
|
||||
<div class="text">· 申请人必须持有认可大学颁发的学士学位； · 最好拥有超过1年的相关行业工作经验； · 如申请人的学士学位在非英语授课的院校获得，则需满足以下英语能力要求：</div>
|
||||
<div class="item-header flexacenter">专业资格认证</div>
|
||||
<text-module :text="info.accreditation || '无'" class="mb40"></text-module>
|
||||
|
||||
<div class="item-header flexacenter">还没 申请日程</div>
|
||||
<div class="application-schedule block">
|
||||
<div class="list">
|
||||
<div class="time flexflex">
|
||||
<div class="item flex1">
|
||||
<div class="name">2024-01-05</div>
|
||||
<div class="value">开始申请日期</div>
|
||||
</div>
|
||||
<div class="item flex1">
|
||||
<div class="name">2024-01-05</div>
|
||||
<div class="value">截止申请日期</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="application-else">
|
||||
<div class="item flexacenter">
|
||||
<div class="name">面试时间：</div>
|
||||
<div class="value flex1">2024-01-05</div>
|
||||
</div>
|
||||
<div class="item flexacenter">
|
||||
<div class="name">结果通知时间：</div>
|
||||
<div class="value flex1">2024-01-05</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="item-header flexacenter">最低入学要求</div>
|
||||
<div class="demand block">
|
||||
<div class="text">{{ info.entrance_requirements || '-' }}</div>
|
||||
<template v-if="info.english_proficiency">
|
||||
<div class="title">英语能力要求</div>
|
||||
<div class="hint">满足以下其中一项即可</div>
|
||||
<div class="list">
|
||||
<div class="item flexflex">
|
||||
<div class="item flexflex" v-for="item in info.english_proficiency">
|
||||
<img class="triangle" src="https://app.gter.net/image/miniApp/offer/triangle-red.svg" />
|
||||
<div class="name">托福网考</div>
|
||||
<div class="value">总分 79 分以上</div>
|
||||
</div>
|
||||
<div class="item flexflex">
|
||||
<img class="triangle" src="https://app.gter.net/image/miniApp/offer/triangle-red.svg" />
|
||||
<div class="name">全国大学英语六级考试</div>
|
||||
<div class="value">总分 6.5 分以上</div>
|
||||
<div class="name">{{ item.name_zh }}</div>
|
||||
<div class="value">总分 {{ item.total }} 分以上</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
</div>
|
||||
|
||||
<div class="tuition-scholarships flexflex">
|
||||
<div class="left">
|
||||
<div class="item-header flexacenter">
|
||||
费用
|
||||
<template v-if="info.documents_required">
|
||||
<div class="item-header flexacenter">必须文件</div>
|
||||
<text-module :text="info.documents_required || '无'" class="mb40"></text-module>
|
||||
</template>
|
||||
|
||||
<div class="tuition-scholarships flexflex">
|
||||
<div class="left">
|
||||
<div class="item-header flexacenter">
|
||||
费用
|
||||
</div>
|
||||
<div class="tuition block flexacenter">
|
||||
<div class="tuition-left flex1 flexjcenter">
|
||||
<div class="unit">{{ info.tuition_currency || 'HK$' }}</div>
|
||||
<div class="number">{{ info.tuition_fee_text || '待确认' }}</div>
|
||||
<div class="text">总学费</div>
|
||||
</div>
|
||||
<div class="tuition block flexacenter">
|
||||
<div class="tuition-left flex1 flexjcenter">
|
||||
<div class="unit">HK$</div>
|
||||
<div class="number">待确认</div>
|
||||
<div class="text">总学费</div>
|
||||
<div class="tuition-right">
|
||||
<div class="item flexacenter">
|
||||
<div class="key">每学分学费</div>
|
||||
<div class="value">{{ info.tuition_fee_per_credit_text || '-' }}</div>
|
||||
</div>
|
||||
<div class="tuition-right">
|
||||
<div class="item flexacenter">
|
||||
<div class="key">每学分学费</div>
|
||||
<div class="value">-</div>
|
||||
</div>
|
||||
<div class="item flexacenter">
|
||||
<div class="key">申请费</div>
|
||||
<div class="value">-</div>
|
||||
</div>
|
||||
<div class="item flexacenter">
|
||||
<div class="key">入学保证金</div>
|
||||
<div class="value">-</div>
|
||||
</div>
|
||||
<div class="item flexacenter">
|
||||
<div class="key">申请费</div>
|
||||
<div class="value">{{ info.application_fee_text || '-' }}</div>
|
||||
</div>
|
||||
<div class="item flexacenter">
|
||||
<div class="key">入学保证金</div>
|
||||
<div class="value">{{ info.admission_deposit_text || '-' }}</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="right">
|
||||
<div class="item-header flexacenter">奖学金</div>
|
||||
<div class="scholarships block flexcenter">非本地学生无</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="right">
|
||||
<div class="item-header flexacenter">奖学金</div>
|
||||
<div class="scholarships block flexcenter">{{ info.scholarships || '-' }}</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<template v-if="info.selection_criteria">
|
||||
<div class="item-header flexacenter">录取选择标准</div>
|
||||
<text-module :text="info.selection_criteria || '- 暂无 -'" class="mb40"></text-module>
|
||||
</template>
|
||||
|
||||
<template v-if="info.recent_admission">
|
||||
<div class="item-header flexacenter">近期录取信息</div>
|
||||
<text-module :text="info.recent_admission || '- 暂无 -'" class="mb40"></text-module>
|
||||
</template>
|
||||
|
||||
<div class="item-header flexacenter">学习模式</div>
|
||||
<div class="pattern block mb40">
|
||||
<div class="tab flexacenter">
|
||||
<div class="item flex1 flexcenter" :class="{'pitch': studyMode == 'ft'}" @click="cutStudyMode('ft')">全日制</div>
|
||||
<div class="item flex1 flexcenter" :class="{'pitch': studyMode == 'pt'}" @click="cutStudyMode('pt')">兼读制</div>
|
||||
</div>
|
||||
|
||||
<div class="item-header flexacenter">学习模式</div>
|
||||
<div class="pattern block">
|
||||
<div class="tab flexacenter">
|
||||
<div class="item flex1 flexcenter pitch">全日制</div>
|
||||
<div class="item flex1 flexcenter">兼读制</div>
|
||||
</div>
|
||||
|
||||
<div class="introduce flexflex">
|
||||
<div class="item flex1">
|
||||
<div class="value">-</div>
|
||||
<div class="name">教学语言</div>
|
||||
</div>
|
||||
<div class="item flex1">
|
||||
<div class="value">-</div>
|
||||
<div class="name">正常学习时长</div>
|
||||
</div>
|
||||
<div class="item flex1">
|
||||
<div class="value">待确认</div>
|
||||
<div class="name">最长学习时长</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- <div class="introduce flexflex">
|
||||
<div class="introduce flexflex" v-if="studyMode == 'ft'">
|
||||
<div class="item flex1">
|
||||
<div class="value">-</div>
|
||||
<div class="value">{{ info.language_of_instruction_text || '-' }}</div>
|
||||
<div class="name">教学语言</div>
|
||||
</div>
|
||||
<div class="item flex1">
|
||||
<div class="value">-</div>
|
||||
<div class="value">{{ info.ft_normal_period || '-' }}</div>
|
||||
<div class="name">正常学习时长</div>
|
||||
</div>
|
||||
<div class="item flex1">
|
||||
<div class="value">待确认</div>
|
||||
<div class="value">{{ info.ft_maximum_period || '待确认' }}</div>
|
||||
<div class="name">最长学习时长</div>
|
||||
</div>
|
||||
</div> -->
|
||||
</div>
|
||||
|
||||
<div class="course block">
|
||||
<img class="icon" src="https://app.gter.net/image/miniApp/offer/triangle-red.svg" />
|
||||
<div class="title">必修课程</div>
|
||||
<div class="hint">（共 24 学分）</div>
|
||||
<div class="table-head flexacenter">
|
||||
<div class="item number">课程编号</div>
|
||||
<div class="item name flex1">课程名称</div>
|
||||
<div class="item credit">学分</div>
|
||||
<div class="introduce flexflex" v-else>
|
||||
<div class="item flex1">
|
||||
<div class="value">{{ info.language_of_instruction_text || '-' }}</div>
|
||||
<div class="name">教学语言</div>
|
||||
</div>
|
||||
<div class="table-body">
|
||||
<div class="list flexflex">
|
||||
<div class="item number flexcenter">EF5042</div>
|
||||
<div class="item name flex1">
|
||||
<div class="text">公司金融</div>
|
||||
<div class="english">Corporate Finance</div>
|
||||
</div>
|
||||
<div class="item credit flexcenter">3</div>
|
||||
<div class="item flex1">
|
||||
<div class="value">{{ info.pt_normal_period || '-' }}</div>
|
||||
<div class="name">正常学习时长</div>
|
||||
</div>
|
||||
<div class="item flex1">
|
||||
<div class="value">{{ info.pt_maximum_period || '待确认' }}</div>
|
||||
<div class="name">最长学习时长</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
|
||||
<template v-if="info.time_of_class">
|
||||
<div class="item-header flexacenter">上课时间</div>
|
||||
<text-module :text="info.time_of_class || '- 暂无 -'" class="mb40"></text-module>
|
||||
</template>
|
||||
|
||||
<div v-if="course.required.length != 0 || course.required.length != 0" class="item-header flexacenter">课程设置</div>
|
||||
<div class="course block">
|
||||
<img class="icon" src="https://app.gter.net/image/miniApp/offer/triangle-red.svg" />
|
||||
<div class="title">必修课程</div>
|
||||
<div class="hint">（共 24 学分）</div>
|
||||
<div class="table-head flexacenter">
|
||||
<div class="item number">课程编号</div>
|
||||
<div class="item name flex1">课程名称</div>
|
||||
<div class="item credit">学分</div>
|
||||
</div>
|
||||
<div class="table-body">
|
||||
<div class="list flexflex">
|
||||
<div class="item number flexcenter">EF5042</div>
|
||||
<div class="item name flex1">
|
||||
<div class="text">公司金融</div>
|
||||
<div class="english">Corporate Finance</div>
|
||||
</div>
|
||||
<div class="list flexflex">
|
||||
<div class="item number flexcenter">EF5042</div>
|
||||
<div class="item name flex1">
|
||||
<div class="text">公司金融</div>
|
||||
<div class="english">Corporate Finance</div>
|
||||
</div>
|
||||
<div class="item credit flexcenter">3</div>
|
||||
<div class="item credit flexcenter">3</div>
|
||||
</div>
|
||||
<div class="list flexflex">
|
||||
<div class="item number flexcenter">EF5042</div>
|
||||
<div class="item name flex1">
|
||||
<div class="text">公司金融</div>
|
||||
<div class="english">Corporate Finance</div>
|
||||
</div>
|
||||
<div class="list flexflex">
|
||||
<div class="item number flexcenter">EF5042</div>
|
||||
<div class="item name flex1">
|
||||
<div class="text">公司金融</div>
|
||||
<div class="english">Corporate Finance</div>
|
||||
</div>
|
||||
<div class="item credit flexcenter">3</div>
|
||||
<div class="item credit flexcenter">3</div>
|
||||
</div>
|
||||
<div class="list flexflex">
|
||||
<div class="item number flexcenter">EF5042</div>
|
||||
<div class="item name flex1">
|
||||
<div class="text">公司金融</div>
|
||||
<div class="english">Corporate Finance</div>
|
||||
</div>
|
||||
<div class="list flexflex">
|
||||
<div class="item number flexcenter">EF5042</div>
|
||||
<div class="item name flex1">
|
||||
<div class="text">公司金融</div>
|
||||
<div class="english">Corporate Finance</div>
|
||||
</div>
|
||||
<div class="item credit flexcenter">3</div>
|
||||
<div class="item credit flexcenter">3</div>
|
||||
</div>
|
||||
<div class="list flexflex">
|
||||
<div class="item number flexcenter">EF5042</div>
|
||||
<div class="item name flex1">
|
||||
<div class="text">公司金融</div>
|
||||
<div class="english">Corporate Finance</div>
|
||||
</div>
|
||||
<div class="item credit flexcenter">3</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
@ -448,9 +422,173 @@
|
||||
</div>
|
||||
</div>
|
||||
<script>
|
||||
function name() {
|
||||
return "123"
|
||||
}
|
||||
const { createApp, ref, onMounted, nextTick, onUnmounted, computed, defineProps } = Vue
|
||||
const subject = createApp({
|
||||
setup() {
|
||||
let side = ref({
|
||||
// pivotal: "关键信息",
|
||||
basic: "基本信息",
|
||||
apply: "申请信息",
|
||||
attend: "就读信息",
|
||||
graduate: "毕业&就业",
|
||||
issue: "常见问题",
|
||||
links: "相关链接",
|
||||
})
|
||||
|
||||
let rankingsObj = ref({})
|
||||
let disciplineObj = ref({})
|
||||
const uniqid = "fOzLnH48yS5C"
|
||||
|
||||
onMounted(() => {
|
||||
// window.addEventListener("scroll", handleScroll)
|
||||
getBaseData().then(data => {
|
||||
rankingsObj.value = data.rankings
|
||||
disciplineObj.value = data.discipline
|
||||
getData()
|
||||
})
|
||||
})
|
||||
|
||||
let info = ref({})
|
||||
let remark = ref("")
|
||||
let sideKey = ref("pivotal")
|
||||
let contras = ref({})
|
||||
let course = ref({})
|
||||
|
||||
const getData = () => {
|
||||
$ajaxget("/api/project.detail", {
|
||||
uniqid,
|
||||
}).then(res => {
|
||||
const data = res.data
|
||||
decodeKey(data.info).then(res => {
|
||||
data.info = res
|
||||
|
||||
let courseObj = {
|
||||
required: [],
|
||||
requiredCount: 0,
|
||||
elective: [],
|
||||
electiveCount: 0,
|
||||
}
|
||||
|
||||
const infoObj = data.info || {}
|
||||
|
||||
const fields = ["tuition_fee", "tuition_fee_per_credit", "application_fee", "admission_deposit"]
|
||||
fields.forEach(field => {
|
||||
const textKey = `${field}_text`
|
||||
infoObj[textKey] = formatNumberWithSpaces(info[field] || "")
|
||||
})
|
||||
|
||||
const curriculum = infoObj.curriculum || []
|
||||
|
||||
if (infoObj.language_of_instruction) {
|
||||
let strOutput = infoObj.language_of_instruction.join(",")
|
||||
infoObj["language_of_instruction_text"] = strOutput
|
||||
}
|
||||
|
||||
curriculum.forEach(element => {
|
||||
if (element.credit == "N/A") element.credit = 0
|
||||
element.type === "必修课" ? (courseObj.required.push(element), (courseObj.requiredCount += element.credit)) : (courseObj.elective.push(element), (courseObj.electiveCount += element.credit))
|
||||
})
|
||||
|
||||
let contrasObj = data.contras
|
||||
if (Array.isArray(contrasObj)) contrasObj = {}
|
||||
remark.value = contrasObj.remarks || ""
|
||||
// 算出最后申请时间
|
||||
infoObj["application_end"] = calculateApplicaDeadline(infoObj.nonlocal_application_end || {})
|
||||
// 算出面试轮时间
|
||||
infoObj["interviewRounds"] = calculateInterviewRound(infoObj.nonlocal_application_end || {})
|
||||
|
||||
if (typeof infoObj.mode_of_study == "string") infoObj.mode_of_study = JSON.parse(info.mode_of_study)
|
||||
|
||||
let sideObj = side.value
|
||||
// 判断是否常见问题 ，没有则删除左侧
|
||||
if (!infoObj.faq || infoObj.faq.length == 0) delete sideObj.issue
|
||||
|
||||
// 判断 毕业就业 没有则删除左侧
|
||||
if (!info.award_zh && !infoObj.graduation_requirements && !infoObj.domains && !infoObj.employers && !infoObj.positions) delete sideObj.graduate
|
||||
|
||||
// 判断奖学金文案
|
||||
if (infoObj.scholarship) infoObj["scholarshipText"] = JudgmentScholarshipText(infoObj.scholarship)
|
||||
|
||||
if (infoObj.leaflet_url) {
|
||||
const leaflet_url = decodeURIComponent(infoObj.leaflet_url)
|
||||
const urlWithoutParams = leaflet_url.split("?")[0]
|
||||
const urlParts = urlWithoutParams.split("/")
|
||||
const fileName = urlParts[urlParts.length - 1]
|
||||
infoObj["leaflet_name"] = fileName
|
||||
}
|
||||
|
||||
// const isadmission = info.admissionsproject || 0
|
||||
// if (isadmission == 1) this.getAdmissionList()
|
||||
|
||||
const date = new Date()
|
||||
const month = date.getMonth() + 1
|
||||
const year = date.getFullYear()
|
||||
const semester = infoObj.semester || {}
|
||||
if (month > semester.month && year + 1 <= semester.year) infoObj["semesterState"] = true
|
||||
|
||||
console.log("infoObj", infoObj.rankings)
|
||||
info.value = infoObj
|
||||
side.value = sideObj
|
||||
sideKey.value = "basic"
|
||||
course.value = courseObj
|
||||
contras.value = contrasObj
|
||||
})
|
||||
})
|
||||
}
|
||||
|
||||
// 判断奖学金文案
|
||||
const JudgmentScholarshipText = obj => {
|
||||
let text = ""
|
||||
if (obj.local && obj.nonlocal) text = "均有"
|
||||
else if (!obj.local && !obj.nonlocal) text = "均无"
|
||||
else if (obj.local && !obj.nonlocal) text = "非本地学生无"
|
||||
else if (!obj.local && obj.nonlocal) text = "非本地学生有"
|
||||
return text
|
||||
}
|
||||
|
||||
// 计算出外地申请截止时间
|
||||
const calculateApplicaDeadline = obj => {
|
||||
// 初始化变量来存储最大时间点的属性和日期
|
||||
let maxDate = null
|
||||
// 遍历对象的属性
|
||||
for (const item in obj) {
|
||||
// 如果当前日期是最大日期或是第一个日期，则更新最大日期和属性
|
||||
if (maxDate === null || obj[item] > maxDate) maxDate = obj[item]
|
||||
}
|
||||
return maxDate
|
||||
}
|
||||
|
||||
// 计算出面试轮的数组
|
||||
const calculateInterviewRound = obj => {
|
||||
let rounds = []
|
||||
const chineseNumbers = ["一", "二", "三", "四", "五", "六", "七", "八", "九", "十"]
|
||||
|
||||
const formatTime = (time, index) => {
|
||||
return {
|
||||
text: `第${chineseNumbers[index]}轮`,
|
||||
time,
|
||||
}
|
||||
}
|
||||
|
||||
Object.keys(obj).forEach((key, index) => {
|
||||
rounds.push(formatTime(obj[key], index))
|
||||
})
|
||||
|
||||
if (rounds.length == 0) rounds = [{}]
|
||||
return rounds || [{}]
|
||||
}
|
||||
|
||||
let studyMode = ref("ft") // 'ft', // 学习模式显示状态 ft 全日制 pt 兼读制
|
||||
|
||||
const cutStudyMode = type => {
|
||||
studyMode.value = type
|
||||
}
|
||||
|
||||
return { side, sideKey, info, disciplineObj, rankingsObj, cutStudyMode, studyMode }
|
||||
},
|
||||
})
|
||||
subject.component("text-module", textModule)
|
||||
subject.mount("#app")
|
||||
</script>
|
||||
</body>
|
||||
</html>
|
||||
|
||||
BIN
img/arrows-triangle-red.png
Normal file
BIN
img/arrows-triangle-red.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 1.4 KiB |
BIN
img/qs.png
Normal file
BIN
img/qs.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 119 KiB |
BIN
img/ruanke.png
Normal file
BIN
img/ruanke.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 7.2 KiB |
BIN
img/times.png
Normal file
BIN
img/times.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 181 KiB |
6
img/triangle-red.svg
Normal file
6
img/triangle-red.svg
Normal file
@ -0,0 +1,6 @@
|
||||
<?xml version="1.0" encoding="utf-8"?>
|
||||
<svg version="1.1" xmlns:xlink="http://www.w3.org/1999/xlink" width="12px" height="7px" xmlns="http://www.w3.org/2000/svg">
|
||||
<g transform="matrix(1 0 0 1 -369 -1147 )">
|
||||
<path d="M 11.77734375 0.230902777777778 C 11.92578125 0.384837962962962 12 0.567129629629628 12 0.777777777777778 C 12 0.988425925925925 11.92578125 1.17071759259259 11.77734375 1.32465277777778 L 6.52734375 6.76909722222222 C 6.37890625 6.92303240740741 6.203125 7 6 7 C 5.796875 7 5.62109375 6.92303240740741 5.47265625 6.76909722222222 L 0.22265625 1.32465277777778 C 0.07421875 1.17071759259259 0 0.988425925925925 0 0.777777777777778 C 0 0.567129629629628 0.07421875 0.384837962962962 0.22265625 0.230902777777778 C 0.37109375 0.0769675925925917 0.546875 0 0.75 0 L 11.25 0 C 11.453125 0 11.62890625 0.0769675925925917 11.77734375 0.230902777777778 Z " fill-rule="nonzero" fill="#f95d5d" stroke="none" transform="matrix(1 0 0 1 369 1147 )" />
|
||||
</g>
|
||||
</svg>
|
||||
BIN
img/usnews.png
Normal file
BIN
img/usnews.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 145 KiB |
78
js/base.js
78
js/base.js
@ -17,7 +17,7 @@ const base = {
|
||||
hideIcon: false,
|
||||
top: 0,
|
||||
left: 0,
|
||||
count:0,
|
||||
count: 0,
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
@ -63,3 +63,79 @@ const base = {
|
||||
},
|
||||
},
|
||||
}
|
||||
|
||||
const textModule = {
|
||||
template: `<div class="text-box block">
|
||||
<div ref="textRef" class="text textRef">{{ text }}</div>
|
||||
<div class="text-head" v-if="title">
|
||||
<img class="text-icon" src="/img/triangle-red.svg" />
|
||||
{{ title }}
|
||||
</div>
|
||||
<div v-if="!isswiper" class="text" :class="{'text-center': text.length < 3}">{{ text }}</div>
|
||||
<div v-else class="text-list" ref="listRef">
|
||||
<div class="text" v-for="(item,index) in page" :style="{'transform': 'translateY(-' + index * h + 'px)'}">{{ text }}</div>
|
||||
</div>
|
||||
<div v-if="isswiper" class="indicate flexcenter">
|
||||
<img class="icon" @click="cutHotListPage('left')" :src="reversedMessage('left')" />
|
||||
<div class="text">{{ current }}/{{ page.length }}</div>
|
||||
<img class="icon btn-right" @click="cutHotListPage('right')" :src="reversedMessage('right')" />
|
||||
</div>
|
||||
</div>`,
|
||||
props: ["text", "title"],
|
||||
setup(props) {
|
||||
console.log(props.text)
|
||||
// let text = ref(`55`)
|
||||
const textRef = ref(null)
|
||||
let page = ref(0)
|
||||
let h = ref(0)
|
||||
let isswiper = ref(false)
|
||||
|
||||
onMounted(() => {
|
||||
console.log("props", props)
|
||||
if (props.text.length < 20) return
|
||||
const lineHeight = 32
|
||||
const height = lineHeight * 10
|
||||
|
||||
const pagecount = textRef.value.clientHeight / height
|
||||
|
||||
let arr = []
|
||||
|
||||
for (let i = 0; i < Math.floor(pagecount); i++) {
|
||||
arr.push(height)
|
||||
}
|
||||
|
||||
const decimalPart = parseFloat("0." + pagecount.toString().split(".")[1])
|
||||
if (decimalPart > 0) arr.push(height * decimalPart)
|
||||
page.value = arr
|
||||
h.value = height
|
||||
isswiper.value = arr.length > 1 ? true : false
|
||||
})
|
||||
|
||||
const listRef = ref(null)
|
||||
let current = ref(1)
|
||||
const cutHotListPage = type => {
|
||||
if (type == "left") {
|
||||
if (current.value > 1) current.value--
|
||||
} else {
|
||||
if (current.value < page.value.length) current.value++
|
||||
}
|
||||
listRef.value.scrollTo({
|
||||
left: 640 * (current.value - 1),
|
||||
behavior: "smooth",
|
||||
})
|
||||
}
|
||||
|
||||
// 计算
|
||||
const reversedMessage = type => {
|
||||
if (type == "left") {
|
||||
if (current.value == 1) return "/img/arrows-triangle-gray.svg"
|
||||
else return "/img/arrows-triangle-red.png"
|
||||
} else {
|
||||
if (current.value == page.value.length) return "/img/arrows-triangle-gray.svg"
|
||||
else return "/img/arrows-triangle-red.png"
|
||||
}
|
||||
}
|
||||
|
||||
return { reversedMessage, cutHotListPage, textRef, isswiper, h, page, current, listRef }
|
||||
},
|
||||
}
|
||||
|
||||
Loading…
Reference in New Issue
Block a user