no message

This commit is contained in:
A1300399510 2024-11-07 15:33:39 +08:00
parent a9b932f19d
commit c6dc6f1057
16 changed files with 545 additions and 96 deletions

View File

@ -2,6 +2,7 @@
padding: 0;
margin: 0;
box-sizing: border-box;
text-decoration: auto;
}
.flexflex {
display: flex;

View File

@ -2,6 +2,7 @@
padding: 0;
margin: 0;
box-sizing: border-box;
text-decoration: auto;
}
.flexflex {

View File

@ -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;

View File

@ -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 {

View File

@ -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;
}

View File

@ -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;
}

View File

@ -51,9 +51,14 @@
<div class="item flexflex" v-for="(item,key) in listObj">
<div class="head flexacenter">{{ item }}</div>
<div class="thead flex1" v-for="(it,index) in list">
<!-- <div v-if="key == 'semester'" class="mode1 flexcenter">{{ it.rank || '-' }}</div> -->
<div v-if="key == 'semester'" class="tag flexcenter">
<div class="tag-item gray" :class="{'semester': it.semesterState}">{{ it.semester.text }}</div>
</div>
<div v-if="key == 'rank'" class="mode1 flexcenter">{{ it.rank || '-' }}</div>
<div v-if="key == 'rankings'" class="mode2 flexcenter">{{ it.rankings && it.rankings[0].rank || '-' }}</div>
<div v-if="key == 'rankings'" class="mode2 flexcenter">{{ it.rankings && it.rankings[0]?.rank || '-' }}</div>
<div v-if="key == 'disciplinename'" class="mode2 flexcenter">{{ it.disciplinename || '-' }}</div>
@ -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
})

View File

@ -63,10 +63,10 @@
<div class="body flexflex">
<div class="content flex1 flexflex">
<div class="side flexflex">
<div class="item flexcenter" :class="{'pitch': sideKey == key}" v-for="(item,key) in side">{{ item }}</div>
<div class="item flexcenter" :class="{'pitch': sideKey == key}" v-for="(item,key) in side" @click="cutSide(key)">{{ item }}</div>
</div>
<div class="details-box flex1">
<div class="side-item">
<div class="details-box flex1" ref="detailsRef">
<div class="side-item" type="basic">
<div class="item-header flexacenter">
<div>专业排名</div>
<div class="list-btn flexacenter">
@ -78,9 +78,12 @@
<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 class="number flexcenter" :class="rankingsObj[item.system].alias">
{{ item.rank }}
<img v-if="item.system == 'QS'" class="triangle" src="/img/triangle-qs1.svg" />
<img v-if="item.system == 'Shanghai Ranking'" class="triangle" src="/img/triangle-rk1.svg" />
<img v-if="item.system == 'Times Higher Education'" class="triangle" src="/img/triangle-ti1.svg" />
<img v-if="item.system == 'U.S. News'" class="triangle" src="/img/triangle-us1.svg" />
</div>
</div>
<div class="rank-box flexflex flex1">
@ -100,7 +103,9 @@
<div class="item-header flexacenter">专业资格认证</div>
<text-module :text="info.accreditation || '无'" class="mb40"></text-module>
</div>
<div class="side-item" type="apply">
<div class="item-header flexacenter">还没 申请日程</div>
<div class="application-schedule block">
<div class="list">
@ -190,7 +195,8 @@
<div class="item-header flexacenter">近期录取信息</div>
<text-module :text="info.recent_admission || '- 暂无 -'" class="mb40"></text-module>
</template>
</div>
<div class="side-item" type="attend">
<div class="item-header flexacenter">学习模式</div>
<div class="pattern block mb40">
<div class="tab flexacenter">
@ -229,59 +235,65 @@
</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">
<div v-if="course?.required?.length != 0 || course?.required?.length != 0" class="item-header flexacenter">课程设置</div>
<div class="course block" v-if="course.required?.length != 0">
<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="hint">(共 {{ course?.requiredCount }} 学分)</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="list flexflex" v-for="item in course?.required">
<div class="item number flexcenter">{{ item.course_code || '-' }}</div>
<div class="item name flex1">
<div class="text">公司金融</div>
<div class="english">Corporate Finance</div>
<div class="text">{{ item.course_name_zh }}</div>
<div class="english">{{ item.course_name_en }}</div>
</div>
<div class="item credit flexcenter">3</div>
<div class="item credit flexcenter">{{ item.credit || '-' }}</div>
</div>
<div class="list flexflex">
<div class="item number flexcenter">EF5042</div>
</div>
</div>
<div class="course block" v-if="course.elective?.length != 0">
<img class="icon" src="https://app.gter.net/image/miniApp/offer/triangle-red.svg" />
<div class="title">选修课程</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" v-for="item in course?.elective">
<div class="item number flexcenter">{{ item.course_code || '-' }}</div>
<div class="item name flex1">
<div class="text">公司金融</div>
<div class="english">Corporate Finance</div>
<div class="text">{{ item.course_name_zh }}</div>
<div class="english">{{ item.course_name_en }}</div>
</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 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">{{ item.credit || '-' }}</div>
</div>
</div>
</div>
<div class="link block">
<div class="link block mb40" v-if="info.catalog_url">
<div class="title">申请页项目详情</div>
<div class="text">{{ info.catalog_url }}</div>
<div class="flexflex" style="justify-content: flex-end;">
<div class="btn flexcenter" @click="copy(info.catalog_url)">
<img class="icon" src="https://app.gter.net/image/miniApp/offer/copy-icon.png" mode="widthFix" />
复制链接
</div>
<a class="btn open flexcenter" target="_blank" :href="info.catalog_url">打开链接</a>
</div>
</div>
<!-- <div class="link block">
<div class="title">项目目录项目详情</div>
<div class="text">https://www.cityu.edu.hk/catalogue/pg/202324/programme/MSF.html</div>
<div class="flexflex" style="justify-content: flex-end;">
@ -291,45 +303,86 @@
</div>
<div class="btn open flexcenter">打开链接</div>
</div>
</div>
</div> -->
</div>
<div class="side-item" type="graduate">
<div class="item-header flexacenter">学位</div>
<div class="degree block">
<div class="degree block mb40">
<div class="title flexcenter">
<img class="icon" src="https://app.gter.net/image/miniApp/offer/name-bj.svg" mode="widthFix" />
学位名称
</div>
<div class="name">理学硕士(金融学)</div>
<div class="english">Master of Science in Finance</div>
<div class="name">{{ info.award_zh }}</div>
<div class="english">{{ info.award_en }}</div>
</div>
<div class="issue-bj">
<template v-if="info.graduation_requirements">
<div class="item-header flexacenter">毕业要求</div>
<text-module :text="info.graduation_requirements || '- 暂无 -'" class="mb40"></text-module>
</template>
<div v-if="info.domains || info.employers || info.positions" class="item-header flexacenter">历届毕业生就业方向</div>
<text-module v-if="info.domains" :text="info.domains || '- 暂无 -'" title="就业领域" class="mb40"></text-module>
<text-module v-if="info.employers" :text="info.employers || '- 暂无 -'" title="主要雇主名单" class="mb40"></text-module>
<text-module v-if="info.positions" :text="info.positions || '- 暂无 -'" title="职业岗位" class="mb40"></text-module>
</div>
<div class="side-item" type="issue">
<div class="issue-bj mb40" v-for="item in info.faq">
<div class="issue block">
<div class="index flexcenter">1</div>
<div class="index flexcenter">{{ item.num }}</div>
<img class="index-bj" src="https://app.gter.net/image/miniApp/offer/index-bj.svg" />
<div class="title">我需要拥有“与商业相关”的学位吗?</div>
<div class="text">申请人如果在非金融或非商业专业拥有优秀的学术记录,也会被考虑。</div>
</div>
</div>
<div class="item-header flexacenter">宣传册</div>
<div class="link brochure block">
<div class="top flexacenter">
<img class="img" src="/img/pdf-icon.svg" />
<div class="right">
<div class="title">宣传册</div>
<div class="name">MSF-MSFE_A4_poster_chi_2024.pdf</div>
</div>
</div>
<div class="flexflex" style="justify-content: flex-end;">
<div class="btn flexcenter">
<img class="icon" src="/img/download-icon.png" />
下载文件
</div>
<div class="btn open flexcenter">打开文件</div>
<div class="title">{{ item.question }}</div>
<div class="text">{{ item.answer }}</div>
</div>
</div>
</div>
<div class="side-item" type="links">
<template v-if="info.leaflet_url">
<div class="item-header flexacenter">宣传册</div>
<div class="link brochure block mb40">
<div class="top flexacenter">
<img class="img" src="/img/pdf-icon.svg" />
<div class="right">
<div class="title">官方宣传册</div>
<div class="name">{{ info.leaflet_name || '-' }}</div>
</div>
</div>
<div class="flexflex" style="justify-content: flex-end;">
<div class="btn flexcenter" @click="download(info.leaflet_url)">
<img class="icon" src="/img/download-icon.png" />
下载文件
</div>
<a class="btn open flexcenter" target="_blank" :href="info.leaflet_url">打开文件</a>
</div>
</div>
</template>
<div class="link block mb40" v-if="info.program_url">
<div class="title">学院网站项目详情</div>
<div class="text">{{ info.program_url }}</div>
<div class="flexflex" style="justify-content: flex-end;">
<div class="btn flexcenter" @click="copy(info.program_url)">
<img class="icon" src="https://app.gter.net/image/miniApp/offer/copy-icon.png" mode="widthFix" />
复制链接
</div>
<a class="btn open flexcenter" target="_blank" :href="info.program_url">打开链接</a>
</div>
</div>
<div class="link block mb40" v-if="info.catalog_url">
<div class="title">项目目录项目详情</div>
<div class="text">{{ info.catalog_url }}</div>
<div class="flexflex" style="justify-content: flex-end;">
<div class="btn flexcenter" @click="copy(info.catalog_url)">
<img class="icon" src="https://app.gter.net/image/miniApp/offer/copy-icon.png" mode="widthFix" />
复制链接
</div>
<a class="btn open flexcenter" target="_blank" :href="info.catalog_url">打开链接</a>
</div>
</div>
</div>
<view class="upglide flexcenter">- End -</view>
</div>
</div>
@ -388,35 +441,48 @@
<!-- 底部 -->
<div class="base flexcenter">
<div style="display: none;" class="type1 flexacenter">
<div v-if="(contras.ismanage == null || contras.ismanage == 0) && (contras.status == null || contras.status == 0)" class="type1 flexacenter">
<div class="btn flexacenter"><img class="img" src="/img/contrast-icon.png" />项目对比</div>
<div class="line"></div>
<div class="btn flexacenter"><img class="img" src="/img/manage-icon.png" />项目管理</div>
<div class="add flex1"><img class="img" src="" />加入对比单</div>
<div class="add flex1" @click="addComparison()"><img class="img" src="/img/add-circle-white.svg" />加入对比单</div>
</div>
<div style="display: none;" class="type2 flexacenter">
<div v-else-if="contras.ismanage == 1 && contras.status == 1" class="type2 flexacenter">
<div class="btn flexacenter">我的项目 <img class="img" src="/img/arrows-circle-green.svg" /></div>
<div class="input-box flexacenter">
<img class="img" src="/img/edit-icon.png" />
<input class="input flex1" placeholder="添加备注" />
<input class="input flex1" placeholder="添加备注" v-model="remark" @blur="bindblur" maxlength="100" />
</div>
<div class="state-box">
<div class="state-btn flexcenter">待定<img class="img" src="/img/arrows-triangle-white.svg" /></div>
<div class="state-box" :class="{'undetermined': contras.typeid == 0 }">
<template v-if="stateState">
<div class="state-mask" @click="cutState()"></div>
<div class="state">
<div class="state-list">
<div class="state-item flexcenter" :class="{'pitch': contras.typeid == index}" v-for="(item,index) in stateObj" @click="changeType(index)">{{ item }}</div>
</div>
<div class="delete flexcenter" @click="deletee()">
<img class="icon" mode="widthFix" src="/img/delete-light-grey.svg" />
</div>
</div>
</template>
<div @click="cutState()" class="state-btn flexcenter">{{ stateObj[contras.typeid || 0] }}<img class="img" src="/img/arrows-triangle-white.svg" /></div>
</div>
</div>
<div class="type3 flexacenter">
<div v-else class="type3 flexacenter">
<div class="btn flexacenter">我的项目 <img class="img" src="/img/arrows-circle-green.svg" /></div>
<div class="add-btn flexcenter already" style="margin-right: 10px;">
<img class="img" src="/img/tick-circle-gray.svg" />
已加入对比单
<div class="add-btn flexcenter" :class="{'already': contras.status == 1}" style="margin-right: 10px;" @click="addComparison()">
<img v-if="contras.status == 1" class="icon" src="/img/tick-circle-gray.svg" />
<img v-else class="img" src="/img/add-circle-white.svg" />
{{ contras.status == 1 ? '已' : '' }}加入对比单
</div>
<div class="add-btn flexcenter">
<img class="img" src="/img/add-circle-white.svg" />
加入对比单
<div class="add-btn flexcenter" :class="{'already': contras.ismanage == 1}" @click="addComparison()">
<img v-if="contras.ismanage == 1" class="icon" src="/img/tick-circle-gray.svg" />
<img v-else class="img" src="/img/add-circle-white.svg" />
{{ contras.ismanage == 1 ? '已' : '' }}加入项目管理
</div>
</div>
</div>
@ -435,12 +501,19 @@
links: "相关链接",
})
const stateObj = ref({
0: "待定",
1: "主申",
2: "冲刺",
3: "保底",
})
let rankingsObj = ref({})
let disciplineObj = ref({})
const uniqid = "fOzLnH48yS5C"
const uniqid = "IwdCOvZ08KUhkXtjXQ5vhAPHczKneFd45T-d55pDZx8TvBsGm2D9tbuIj9YdJhDq2Zy09bXaoc4-lAhiMmE1"
onMounted(() => {
// window.addEventListener("scroll", handleScroll)
window.addEventListener("scroll", handleScroll)
getBaseData().then(data => {
rankingsObj.value = data.rankings
disciplineObj.value = data.discipline
@ -448,6 +521,19 @@
})
})
const handleScroll = () => {
const keyElements = detailsRef.value.querySelectorAll(".side-item")
for (const keyElement of keyElements) {
const rect = keyElement.getBoundingClientRect()
// console.log(rect)
if (rect.top + rect.height > 0) {
// console.log("keyElement", keyElement.getAttribute("type"))
sideKey.value = keyElement.getAttribute("type")
break
}
}
}
let info = ref({})
let remark = ref("")
let sideKey = ref("pivotal")
@ -584,7 +670,80 @@
studyMode.value = type
}
return { side, sideKey, info, disciplineObj, rankingsObj, cutStudyMode, studyMode }
const copy = url => {
let copyInput = document.createElement("input")
document.body.appendChild(copyInput)
copyInput.setAttribute("value", url)
copyInput.select()
document.execCommand("Copy")
copyInput.remove()
}
// 下载文件
const download = url => {
// 下载文件
window.open(url)
}
const bindblur = () => {
$ajax("/api/project.user/remarks", {
token: contras.value.token,
remarks: remark.value,
}).then(res => {})
}
// 点击加入对比单
const addComparison = () => {
$ajax("/api/project.contrast/add", {
projectid: info.value.id,
}).then(res => {
if (res.code != 200) return
const data = res.data
contras.value["status"] = 1
contras.value["ismanage"] = 1
contras.value["typeid"] = 0 // 默认是待定
contras.value["token"] = data.token
})
}
const detailsRef = ref(null)
// 使 页面滚动到
const cutSide = key => {
// sideKey.value = key
const keyElement = detailsRef.value.querySelector(`.side-item[type=${key}]`)
keyElement.scrollIntoView({ behavior: "smooth" })
}
let stateState = ref(false)
const cutState = () => {
stateState.value = !stateState.value
}
// 修改 项目 状态
const changeType = typeid => {
$ajax("/api/project.user/changeType", {
token: contras.value.token || "",
typeid,
}).then(res => {
if (res.code != 200) return
contras.value["typeid"] = typeid
cutState()
})
}
const deletee = () => {
const contras = this.data.contras
$ajax("/api/project.user/delete", {
token: contras.value.token,
}).then(res => {
if (res.code != 200) return
contras.value["ismanage"] = 0
stateState.value = false
})
}
return { side, sideKey, info, disciplineObj, rankingsObj, cutStudyMode, studyMode, course, contras, copy, download, stateObj, bindblur, remark, addComparison, cutSide, detailsRef, stateState, cutState, changeType, deletee }
},
})
subject.component("text-module", textModule)

File diff suppressed because one or more lines are too long

6
img/triangle-qs1.svg Normal file
View 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="5px" height="8px" xmlns="http://www.w3.org/2000/svg">
<g transform="matrix(1 0 0 1 -688 -600 )">
<path d="M 4.83506944444444 0.1484375 C 4.94502314814815 0.247395833333332 5 0.364583333333332 5 0.5 L 5 7.5 C 5 7.63541666666667 4.94502314814815 7.75260416666667 4.83506944444444 7.8515625 C 4.72511574074074 7.95052083333333 4.59490740740741 8 4.44444444444444 8 C 4.29398148148148 8 4.16377314814815 7.95052083333333 4.05381944444444 7.8515625 L 0.164930555555556 4.3515625 C 0.0549768518518519 4.25260416666667 0 4.13541666666667 0 4 C 0 3.86458333333333 0.0549768518518519 3.74739583333333 0.164930555555556 3.6484375 L 4.05381944444444 0.1484375 C 4.16377314814815 0.0494791666666661 4.29398148148148 0 4.44444444444444 0 C 4.59490740740741 0 4.72511574074074 0.0494791666666661 4.83506944444444 0.1484375 Z " fill-rule="nonzero" fill="#f7a602" stroke="none" transform="matrix(1 0 0 1 688 600 )" />
</g>
</svg>

6
img/triangle-rk.svg Normal file
View 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="5px" height="10px" xmlns="http://www.w3.org/2000/svg">
<g transform="matrix(1 0 0 1 -1121 -870 )">
<path d="M 4.83506944444444 0.185546875 C 4.94502314814815 0.309244791666665 5 0.455729166666665 5 0.625 L 5 9.375 C 5 9.54427083333333 4.94502314814815 9.69075520833333 4.83506944444444 9.814453125 C 4.72511574074074 9.93815104166667 4.59490740740741 10 4.44444444444444 10 C 4.29398148148148 10 4.16377314814815 9.93815104166667 4.05381944444444 9.814453125 L 0.164930555555556 5.439453125 C 0.0549768518518519 5.31575520833333 0 5.16927083333333 0 5 C 0 4.83072916666667 0.0549768518518519 4.68424479166667 0.164930555555556 4.560546875 L 4.05381944444444 0.185546875 C 4.16377314814815 0.0618489583333326 4.29398148148148 0 4.44444444444444 0 C 4.59490740740741 0 4.72511574074074 0.0618489583333326 4.83506944444444 0.185546875 Z " fill-rule="nonzero" fill="#e5122d" stroke="none" transform="matrix(1 0 0 1 1121 870 )" />
</g>
</svg>

6
img/triangle-rk1.svg Normal file
View 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="5px" height="8px" xmlns="http://www.w3.org/2000/svg">
<g transform="matrix(1 0 0 1 -688 -854 )">
<path d="M 4.83506944444444 0.1484375 C 4.94502314814815 0.247395833333332 5 0.364583333333332 5 0.5 L 5 7.5 C 5 7.63541666666667 4.94502314814815 7.75260416666667 4.83506944444444 7.8515625 C 4.72511574074074 7.95052083333333 4.59490740740741 8 4.44444444444444 8 C 4.29398148148148 8 4.16377314814815 7.95052083333333 4.05381944444444 7.8515625 L 0.164930555555556 4.3515625 C 0.0549768518518519 4.25260416666667 0 4.13541666666667 0 4 C 0 3.86458333333333 0.0549768518518519 3.74739583333333 0.164930555555556 3.6484375 L 4.05381944444444 0.1484375 C 4.16377314814815 0.0494791666666661 4.29398148148148 0 4.44444444444444 0 C 4.59490740740741 0 4.72511574074074 0.0494791666666661 4.83506944444444 0.1484375 Z " fill-rule="nonzero" fill="#e5122d" stroke="none" transform="matrix(1 0 0 1 688 854 )" />
</g>
</svg>

12
img/triangle-ti.svg Normal file
View File

@ -0,0 +1,12 @@
<?xml version="1.0" encoding="utf-8"?>
<svg version="1.1" xmlns:xlink="http://www.w3.org/1999/xlink" width="5px" height="10px" xmlns="http://www.w3.org/2000/svg">
<defs>
<linearGradient gradientUnits="userSpaceOnUse" x1="4.99999999999986" y1="1.4210854715202E-13" x2="-1.4210854715202E-13" y2="8.07608695652178" id="LinearGradient1">
<stop id="Stop2" stop-color="#fc392d" offset="0" />
<stop id="Stop3" stop-color="#3948ff" offset="1" />
</linearGradient>
</defs>
<g transform="matrix(1 0 0 1 -1122 -689 )">
<path d="M 4.83506944444444 0.185546875 C 4.94502314814815 0.309244791666665 5 0.455729166666665 5 0.625 L 5 9.375 C 5 9.54427083333333 4.94502314814815 9.69075520833333 4.83506944444444 9.814453125 C 4.72511574074074 9.93815104166667 4.59490740740741 10 4.44444444444444 10 C 4.29398148148148 10 4.16377314814815 9.93815104166667 4.05381944444444 9.814453125 L 0.164930555555556 5.439453125 C 0.0549768518518519 5.31575520833333 0 5.16927083333333 0 5 C 0 4.83072916666667 0.0549768518518519 4.68424479166667 0.164930555555556 4.560546875 L 4.05381944444444 0.185546875 C 4.16377314814815 0.0618489583333326 4.29398148148148 0 4.44444444444444 0 C 4.59490740740741 0 4.72511574074074 0.0618489583333326 4.83506944444444 0.185546875 Z " fill-rule="nonzero" fill="url(#LinearGradient1)" stroke="none" transform="matrix(1 0 0 1 1122 689 )" />
</g>
</svg>

6
img/triangle-ti1.svg Normal file
View 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="5px" height="8px" xmlns="http://www.w3.org/2000/svg">
<g transform="matrix(1 0 0 1 -688 -686 )">
<path d="M 4.83506944444444 0.1484375 C 4.94502314814815 0.247395833333332 5 0.364583333333332 5 0.5 L 5 7.5 C 5 7.63541666666667 4.94502314814815 7.75260416666667 4.83506944444444 7.8515625 C 4.72511574074074 7.95052083333333 4.59490740740741 8 4.44444444444444 8 C 4.29398148148148 8 4.16377314814815 7.95052083333333 4.05381944444444 7.8515625 L 0.164930555555556 4.3515625 C 0.0549768518518519 4.25260416666667 0 4.13541666666667 0 4 C 0 3.86458333333333 0.0549768518518519 3.74739583333333 0.164930555555556 3.6484375 L 4.05381944444444 0.1484375 C 4.16377314814815 0.0494791666666661 4.29398148148148 0 4.44444444444444 0 C 4.59490740740741 0 4.72511574074074 0.0494791666666661 4.83506944444444 0.1484375 Z " fill-rule="nonzero" fill="#f33a38" stroke="none" transform="matrix(1 0 0 1 688 686 )" />
</g>
</svg>

6
img/triangle-us.svg Normal file
View 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="5px" height="10px" xmlns="http://www.w3.org/2000/svg">
<g transform="matrix(1 0 0 1 -1122 -784 )">
<path d="M 4.83506944444444 0.185546875 C 4.94502314814815 0.309244791666665 5 0.455729166666665 5 0.625 L 5 9.375 C 5 9.54427083333333 4.94502314814815 9.69075520833333 4.83506944444444 9.814453125 C 4.72511574074074 9.93815104166667 4.59490740740741 10 4.44444444444444 10 C 4.29398148148148 10 4.16377314814815 9.93815104166667 4.05381944444444 9.814453125 L 0.164930555555556 5.439453125 C 0.0549768518518519 5.31575520833333 0 5.16927083333333 0 5 C 0 4.83072916666667 0.0549768518518519 4.68424479166667 0.164930555555556 4.560546875 L 4.05381944444444 0.185546875 C 4.16377314814815 0.0618489583333326 4.29398148148148 0 4.44444444444444 0 C 4.59490740740741 0 4.72511574074074 0.0618489583333326 4.83506944444444 0.185546875 Z " fill-rule="nonzero" fill="#2456c8" stroke="none" transform="matrix(1 0 0 1 1122 784 )" />
</g>
</svg>

6
img/triangle-us1.svg Normal file
View 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="5px" height="8px" xmlns="http://www.w3.org/2000/svg">
<g transform="matrix(1 0 0 1 -688 -772 )">
<path d="M 4.83506944444444 0.1484375 C 4.94502314814815 0.247395833333332 5 0.364583333333332 5 0.5 L 5 7.5 C 5 7.63541666666667 4.94502314814815 7.75260416666667 4.83506944444444 7.8515625 C 4.72511574074074 7.95052083333333 4.59490740740741 8 4.44444444444444 8 C 4.29398148148148 8 4.16377314814815 7.95052083333333 4.05381944444444 7.8515625 L 0.164930555555556 4.3515625 C 0.0549768518518519 4.25260416666667 0 4.13541666666667 0 4 C 0 3.86458333333333 0.0549768518518519 3.74739583333333 0.164930555555556 3.6484375 L 4.05381944444444 0.1484375 C 4.16377314814815 0.0494791666666661 4.29398148148148 0 4.44444444444444 0 C 4.59490740740741 0 4.72511574074074 0.0494791666666661 4.83506944444444 0.1484375 Z " fill-rule="nonzero" fill="#025ea7" stroke="none" transform="matrix(1 0 0 1 688 772 )" />
</g>
</svg>