From c6dc6f1057390ff99535e2f1d825f5d5beeedd29 Mon Sep 17 00:00:00 2001 From: A1300399510 Date: Thu, 7 Nov 2024 15:33:39 +0800 Subject: [PATCH] no message --- css/common.css | 1 + css/common.less | 1 + css/contrastDetails.css | 9 +- css/contrastDetails.less | 14 +- css/details.css | 98 +++++++++++- css/details.less | 124 ++++++++++++++- html/contrastDetails.html | 17 +- html/details.html | 323 ++++++++++++++++++++++++++++---------- img/delete-light-grey.svg | 6 + img/triangle-qs1.svg | 6 + img/triangle-rk.svg | 6 + img/triangle-rk1.svg | 6 + img/triangle-ti.svg | 12 ++ img/triangle-ti1.svg | 6 + img/triangle-us.svg | 6 + img/triangle-us1.svg | 6 + 16 files changed, 545 insertions(+), 96 deletions(-) create mode 100644 img/delete-light-grey.svg create mode 100644 img/triangle-qs1.svg create mode 100644 img/triangle-rk.svg create mode 100644 img/triangle-rk1.svg create mode 100644 img/triangle-ti.svg create mode 100644 img/triangle-ti1.svg create mode 100644 img/triangle-us.svg create mode 100644 img/triangle-us1.svg diff --git a/css/common.css b/css/common.css index f21eeb2..3c22055 100644 --- a/css/common.css +++ b/css/common.css @@ -2,6 +2,7 @@ padding: 0; margin: 0; box-sizing: border-box; + text-decoration: auto; } .flexflex { display: flex; diff --git a/css/common.less b/css/common.less index 322b163..a383663 100644 --- a/css/common.less +++ b/css/common.less @@ -2,6 +2,7 @@ padding: 0; margin: 0; box-sizing: border-box; + text-decoration: auto; } .flexflex { diff --git a/css/contrastDetails.css b/css/contrastDetails.css index cddce1a..01fae46 100644 --- a/css/contrastDetails.css +++ b/css/contrastDetails.css @@ -22,10 +22,15 @@ } .body .item .thead { text-align: center; - border-right: 1px solid #ebebeb; padding: 20px; border-bottom: 1px solid #ebebeb; } +.body .item .thead:not(:last-of-type) { + border-right: 1px solid #ebebeb; +} +.body .item .thead .tag .tag-item { + margin: 0; +} .body .item .thead.no-padding { padding: 0; border-bottom: none; @@ -90,6 +95,7 @@ -webkit-box-shadow: 0px 0px 5px rgba(0, 0, 0, 0.2); box-shadow: 0px 0px 5px rgba(0, 0, 0, 0.2); cursor: pointer; + z-index: 1; } .body .item .thead .operate .add .icon { width: 16px; @@ -145,6 +151,7 @@ position: fixed; top: 0; left: 0; + z-index: 1; } .handle-project-mask .handle-project { width: 640px; diff --git a/css/contrastDetails.less b/css/contrastDetails.less index 6dae508..87a0ce7 100644 --- a/css/contrastDetails.less +++ b/css/contrastDetails.less @@ -31,10 +31,20 @@ .thead { text-align: center; - border-right: 1px solid rgb(235, 235, 235); + // border-right: 1px solid rgb(235, 235, 235); padding: 20px; border-bottom: 1px solid rgb(235, 235, 235); + &:not(:last-of-type) { + border-right: 1px solid rgb(235, 235, 235); + } + + .tag { + .tag-item { + margin: 0; + } + } + &.no-padding { padding: 0; border-bottom: none; @@ -104,6 +114,7 @@ -webkit-box-shadow: 0px 0px 5px rgba(0, 0, 0, 0.2); box-shadow: 0px 0px 5px rgba(0, 0, 0, 0.2); cursor: pointer; + z-index: 1; .icon { width: 16px; height: 16px; @@ -172,6 +183,7 @@ position: fixed; top: 0; left: 0; + z-index: 1; .handle-project { .handle-header { diff --git a/css/details.css b/css/details.css index 64ac9fe..88937c0 100644 --- a/css/details.css +++ b/css/details.css @@ -103,7 +103,8 @@ border-radius: 12px 0 0 0; width: 141px; height: 500px; - overflow: hidden; + position: sticky; + top: 0; flex-direction: column; } .content .side .item { @@ -112,9 +113,9 @@ font-size: 15px; color: #555555; cursor: pointer; - border-right: 1px solid #ebebeb; } .content .side .item.pitch { + width: 101%; background-color: #fbfbfb; border-top: 1px solid #ebebeb; border-bottom: 1px solid #ebebeb; @@ -145,6 +146,7 @@ padding-right: 30px; background-color: #fbfbfb; border-radius: 0 12px 0 0; + border-left: 1px solid #ebebeb; } .content .details-box .block { background-color: #ffffff; @@ -179,6 +181,7 @@ font-weight: 400; font-size: 14px; color: #000000; + cursor: pointer; } .content .details-box .item-header .list-btn .icon { width: 16px; @@ -213,12 +216,34 @@ width: 90px; height: 30px; line-height: 30px; - background-color: #f7a602; border-radius: 4px; font-family: "Arial-Black", "Arial Black", sans-serif; font-weight: 900; font-size: 18px; color: #ffffff; + position: relative; +} +.content .details-box .ranking .item .rank .number.qs { + background-color: #f7a602; +} +.content .details-box .ranking .item .rank .number.times { + background: -webkit-linear-gradient(311.63353934deg, #fc392d 0%, #3948ff 135%); + background: -moz-linear-gradient(138.36646066deg, #fc392d 0%, #3948ff 135%); + background: linear-gradient(138.36646066deg, #fc392d 0%, #3948ff 135%); +} +.content .details-box .ranking .item .rank .number.usnews { + background-color: #025ea7; +} +.content .details-box .ranking .item .rank .number.ruanke { + background-color: #e5122d; +} +.content .details-box .ranking .item .rank .number .triangle { + position: absolute; + top: 50%; + transform: translateY(-50%); + left: -5px; + width: 5px; + height: 8px; } .content .details-box .ranking .item .rank-box { background-color: #f6f6f6; @@ -275,6 +300,7 @@ color: #000000; line-height: 32px; white-space: pre-line; + width: 100%; } .content .details-box .text-box .text.text-center { width: 100%; @@ -303,6 +329,7 @@ font-size: 13px; margin: 0 12px; line-height: normal; + width: fit-content; } .content .details-box .application-schedule { margin-bottom: 40px; @@ -866,10 +893,14 @@ vertical-align: bottom; } .base { + width: 100vw; background-color: transparent; + transform: none; + left: 0; } .base .type1 { width: 100%; + width: 640px; height: 100%; border-radius: 153px; border: 1px solid #dbe0f2; @@ -901,6 +932,7 @@ font-size: 15px; color: #ffffff; margin-right: 5px; + cursor: pointer; } .base .type1 .add .img { width: 16px; @@ -909,6 +941,7 @@ } .base .type2 { width: 100%; + width: 640px; height: 100%; background-color: #f2f2f2; border: 1px solid #d7d7d7; @@ -948,22 +981,73 @@ border: none; outline: none; } +.base .type2 .state-box { + position: relative; +} +.base .type2 .state-box.undetermined .state-btn { + background-color: #f95d5d; +} +.base .type2 .state-box.undetermined .state .state-list .state-item.pitch { + color: #f95d5d; +} .base .type2 .state-box .state-btn { width: 100px; height: 40px; - background-color: #f95d5d; + background-color: #04b0d5; border-radius: 158px; font-size: 15px; color: #ffffff; cursor: pointer; + transition: all 0.3s; } .base .type2 .state-box .state-btn .img { width: 11px; height: 6px; margin-left: 8px; } +.base .type2 .state-box .state-mask { + width: 100vw; + height: 100vh; + position: fixed; + top: 0; + left: 0; +} +.base .type2 .state-box .state { + background-color: #ffffff; + border: 1px solid #ebebeb; + border-radius: 12px; + position: absolute; + bottom: 40px; + width: 100px; + background-color: #f5fcfd; + box-shadow: 0 0 7px rgba(0, 0, 0, 0.2); + animation: show 0.3s; +} +@keyframes show { + 0% { + opacity: 0; + } + 100% { + opacity: 1; + } +} +.base .type2 .state-box .state .state-item { + color: #555555; + font-size: 16px; + height: 55px; + cursor: pointer; +} +.base .type2 .state-box .state .state-item.pitch { + color: #04b0d5; +} +.base .type2 .state-box .state .delete { + cursor: pointer; + height: 55px; + border-top: 1px dotted #d7d7d7; +} .base .type3 { width: 100%; + width: 640px; height: 100%; background-color: #f2f2f2; border: 1px solid #d7d7d7; @@ -990,6 +1074,7 @@ font-size: 15px; color: #ffffff; border-radius: 158px; + cursor: pointer; } .base .type3 .add-btn.already { background-color: #fbfbfb; @@ -1001,3 +1086,8 @@ height: 16px; margin-right: 10px; } +.upglide { + font-size: 10px; + color: #aaaaaa; + padding-bottom: 60px; +} diff --git a/css/details.less b/css/details.less index 4a0a398..6963c0a 100644 --- a/css/details.less +++ b/css/details.less @@ -116,20 +116,23 @@ border-radius: 12px 0 0 0; width: 141px; height: 500px; - overflow: hidden; + // overflow: hidden; + position: sticky; + top: 0; flex-direction: column; + .item { width: 100%; height: 56px; font-size: 15px; color: #555555; cursor: pointer; - border-right: 1px solid rgba(235, 235, 235, 1); &.pitch { &:first-of-type { border-top: none; } + width: 101%; background-color: rgba(251, 251, 251, 1); border-top: 1px solid rgba(235, 235, 235, 1); border-bottom: 1px solid rgba(235, 235, 235, 1); @@ -161,6 +164,7 @@ padding-right: 30px; background-color: #fbfbfb; border-radius: 0 12px 0 0; + border-left: 1px solid rgba(235, 235, 235, 1); .block { background-color: rgba(255, 255, 255, 1); @@ -196,6 +200,7 @@ font-weight: 400; font-size: 14px; color: #000000; + cursor: pointer; .icon { width: 16px; height: 16px; @@ -207,7 +212,7 @@ .mb40 { margin-bottom: 40px; } - + .ranking { margin-bottom: 40px; .item { @@ -231,13 +236,40 @@ width: 90px; height: 30px; line-height: 30px; - background-color: rgba(247, 166, 2, 1); + // background-color: rgba(247, 166, 2, 1); border-radius: 4px; font-family: "Arial-Black", "Arial Black", sans-serif; font-weight: 900; font-size: 18px; color: #ffffff; + + position: relative; + + &.qs { + background-color: rgba(247, 166, 2, 1); + } + + &.times { + background: -webkit-linear-gradient(311.63353933657deg, rgba(252, 57, 45, 1) 0%, rgba(57, 72, 255, 1) 135%); + background: -moz-linear-gradient(138.36646066343deg, rgba(252, 57, 45, 1) 0%, rgba(57, 72, 255, 1) 135%); + background: linear-gradient(138.36646066343deg, rgba(252, 57, 45, 1) 0%, rgba(57, 72, 255, 1) 135%); + } + + &.usnews { + background-color: rgba(2, 94, 167, 1); + } + + &.ruanke { + background-color: rgba(229, 18, 45, 1); + } + .triangle { + position: absolute; + top: 50%; + transform: translateY(-50%); + left: -5px; + width: 5px; + height: 8px; } } } @@ -302,6 +334,7 @@ color: #000000; line-height: 32px; white-space: pre-line; + width: 100%; &.text-center { width: 100%; @@ -334,6 +367,7 @@ margin: 0 12px; // padding: 24px 0 0; line-height: normal; + width: fit-content; } } } @@ -990,10 +1024,13 @@ } .base { + width: 100vw; background-color: transparent; - + transform: none; + left: 0; .type1 { width: 100%; + width: 640px; height: 100%; border-radius: 153px; border: 1px solid rgb(219, 224, 242); @@ -1028,6 +1065,7 @@ font-size: 15px; color: #ffffff; margin-right: 5px; + cursor: pointer; .img { width: 16px; height: 16px; @@ -1038,6 +1076,8 @@ .type2 { width: 100%; + width: 640px; + height: 100%; background-color: rgba(242, 242, 242, 1); border: 1px solid rgba(215, 215, 215, 1); @@ -1080,25 +1120,90 @@ } .state-box { + &.undetermined { + .state-btn { + background-color: rgba(249, 93, 93, 1); + } + + .state { + .state-list { + .state-item { + &.pitch { + color: #f95d5d; + } + } + } + } + } .state-btn { width: 100px; height: 40px; - background-color: rgba(249, 93, 93, 1); + background-color: rgba(4, 176, 213, 1); border-radius: 158px; font-size: 15px; color: #ffffff; cursor: pointer; + transition: all 0.3s; .img { width: 11px; height: 6px; margin-left: 8px; } } + position: relative; + + .state-mask { + width: 100vw; + height: 100vh; + position: fixed; + top: 0; + left: 0; + } + + .state { + background-color: #ffffff; + border: 1px solid #ebebeb; + border-radius: 12px; + position: absolute; + bottom: 40px; + width: 100px; + background-color: #f5fcfd; + box-shadow: 0 0 7px rgba(0, 0, 0, 0.2); + animation: show 0.3s; + + @keyframes show { + 0% { + opacity: 0; + } + + 100% { + opacity: 1; + } + } + + .state-item { + color: #555555; + font-size: 16px; + height: 55px; + cursor: pointer; + + &.pitch { + color: #04b0d5; + } + } + .delete { + cursor: pointer; + height: 55px; + border-top: 1px dotted #d7d7d7; + } + } } } .type3 { width: 100%; + width: 640px; + height: 100%; background-color: rgba(242, 242, 242, 1); border: 1px solid rgba(215, 215, 215, 1); @@ -1127,6 +1232,7 @@ font-size: 15px; color: #ffffff; border-radius: 158px; + cursor: pointer; &.already { background-color: rgba(251, 251, 251, 1); font-size: 16px; @@ -1140,3 +1246,9 @@ } } } + +.upglide { + font-size: 10px; + color: #aaaaaa; + padding-bottom: 60px; +} diff --git a/html/contrastDetails.html b/html/contrastDetails.html index 5217656..87508c1 100644 --- a/html/contrastDetails.html +++ b/html/contrastDetails.html @@ -51,9 +51,14 @@
{{ item }}
+ +
+
{{ it.semester.text }}
+
+
{{ it.rank || '-' }}
-
{{ it.rankings && it.rankings[0].rank || '-' }}
+
{{ it.rankings && it.rankings[0]?.rank || '-' }}
{{ it.disciplinename || '-' }}
@@ -174,6 +179,7 @@ }) const listObj = ref({ + semester: "招生季", rank: "专业排名", rankings: "学校合排名", disciplinename: "学科领域", @@ -214,6 +220,10 @@ let allArr = [] dataList.forEach(element => allArr.push(decodeKey(element))) + const date = new Date() + const month = date.getMonth() + 1 + const year = date.getFullYear() + const obj = disciplineObj Promise.allSettled(allArr).then(res => { let targetList = [] @@ -239,8 +249,11 @@ if (element.scholarship) element["scholarshipText"] = JudgmentScholarshipText(element.scholarship) element["disciplinename"] = obj[element.disciplineid] || "" - }) + const semester = element.semester || {} + if (month > semester.month && year + 1 <= semester.year) element["semesterState"] = true + }) + console.log("targetList", targetList) list.value = targetList isquick.value = data.isquick }) diff --git a/html/details.html b/html/details.html index 7c9de3e..e73386b 100644 --- a/html/details.html +++ b/html/details.html @@ -63,10 +63,10 @@
-
{{ item }}
+
{{ item }}
-
-
+
+
专业排名
@@ -78,9 +78,12 @@
-
- {{ item.total_score }} - +
+ {{ item.rank }} + + + +
@@ -100,7 +103,9 @@
专业资格认证
+
+
还没 申请日程
@@ -190,7 +195,8 @@
近期录取信息
- +
+
学习模式
@@ -229,59 +235,65 @@
- -
课程设置
-
+
课程设置
+
必修课程
-
（共 24 学分）
+
（共 {{ course?.requiredCount }} 学分）
课程编号
课程名称
学分
-
-
EF5042
+
+
{{ item.course_code || '-' }}
-
公司金融
-
Corporate Finance
+
{{ item.course_name_zh }}
+
{{ item.course_name_en }}
-
3
+
{{ item.credit || '-' }}
-
-
EF5042
+
+
+
+ +
选修课程
+
+
课程编号
+
课程名称
+
学分
+
+
+
+
{{ item.course_code || '-' }}
-
公司金融
-
Corporate Finance
+
{{ item.course_name_zh }}
+
{{ item.course_name_en }}
-
3
-
-
-
EF5042
-
-
公司金融
-
Corporate Finance
-
-
3
-
-
-
EF5042
-
-
公司金融
-
Corporate Finance
-
-
3
+
{{ item.credit || '-' }}
-
+
+
申请页项目详情
+
{{ info.catalog_url }}
+
+
+ + 复制链接 +
+ 打开链接 +
+
+ + +
+
学位
-
+
学位名称
-
理学硕士（金融学）
-
Master of Science in Finance
+
{{ info.award_zh }}
+
{{ info.award_en }}
-
+ + +
历届毕业生就业方向
+ + + +
+
+
-
1
+
{{ item.num }}
-
我需要拥有“与商业相关”的学位吗？
-
申请人如果在非金融或非商业专业拥有优秀的学术记录，也会被考虑。
-
-
- -
宣传册
-
-
- -
-
宣传册
-
MSF-MSFE_A4_poster_chi_2024.pdf
-
-
-
-
- - 下载文件 -
-
打开文件
+
{{ item.question }}
+
{{ item.answer }}
+
+ + +
+
学院网站项目详情
+
{{ info.program_url }}
+
+
+ + 复制链接 +
+ 打开链接 +
+
+ +
+
项目目录项目详情
+
{{ info.catalog_url }}
+
+
+ + 复制链接 +
+ 打开链接 +
+
+
+ + - End -
@@ -388,35 +441,48 @@
-