hz/fe-student
1
0
Fork 0
mirror of https://codeup.aliyun.com/67762337eccfc218f6110e0e/vue/fe-student.git synced 2025-12-07 18:06:48 +08:00
Code Issues Packages Projects Releases Wiki Activity

提交

Browse Source
This commit is contained in:
Pengxiansen
2025-02-17 10:06:18 +08:00
parent 99a7805190
commit d6b1727906
2 changed files with 71 additions and 54 deletions
Download Patch File Download Diff File Expand all files Collapse all files

7
src/views/growth/growthList.vue
View File

@@ -666,8 +666,13 @@ function toOffcoursePlanPage(id) {
}
.item-img {
width: 100%;
background: #cccccc;
border-radius: 14px 14px 0px 0px;
overflow: hidden;
img:hover {
transform: scale(1.1);
transition: all 1s ease;
}
}
.item-content {
padding: 29px 24px 31px 26px;

118
src/views/growth/growthRoadmap.vue
View File

@@ -86,45 +86,15 @@
<div class="path-container">
<div
:class="
(index + 1) % 2 && index + 1 != 15
? 'path-item-top'
: 'path-item-bottom'
(item.position + 1) % 2 || item.position + 1 == 15
? 'path-item-bottom'
: 'path-item-top'
"
@click="toFinish(item)"
:style="point[index]"
:style="point[item.position]"
v-for="(item, index) of stageProcessList"
>
<template v-if="(index + 1) % 2 && index + 1 != 15">
<div>
<div class="item-name">{{ item.taskName }}</div>
<div class="triangle"></div>
</div>
<div class="f-a-c">
<div class="item-progress">
<el-progress
:percentage="parseInt(item.progress)"
:show-text="false"
:stroke-width="6"
:color="stateData(item).progressColor"
/>
</div>
<div
class="item-state"
:style="{
color: stateData(item).color,
background: stateData(item).bgColor,
}"
>
{{ stateData(item).text }}
</div>
</div>
<div class="item-link">
<div class="line"></div>
<div class="circle"></div>
</div>
</template>
<template v-else>
<template v-if="(item.position + 1) % 2 || item.position + 1 == 15">
<div class="item-link">
<div class="circle"></div>
<div class="line"></div>
@@ -154,6 +124,36 @@
</div>
</div>
</template>
<template v-else>
<div>
<div class="item-name">{{ item.taskName }}</div>
<div class="triangle"></div>
</div>
<div class="f-a-c">
<div class="item-progress">
<el-progress
:percentage="parseInt(item.progress)"
:show-text="false"
:stroke-width="6"
:color="stateData(item).progressColor"
/>
</div>
<div
class="item-state"
:style="{
color: stateData(item).color,
background: stateData(item).bgColor,
}"
>
{{ stateData(item).text }}
</div>
</div>
<div class="item-link">
<div class="line"></div>
<div class="circle"></div>
</div>
</template>
</div>
</div>
</template>
@@ -305,62 +305,63 @@ const {
} = useRoute();
const point = [
{
top: 0,
right: "234px",
},
{
top: "226px",
right: "128px",
},
{
top: "92px",
right: "455px",
top: 0,
right: "234px",
},
{
top: "347px",
right: "341px",
},
{
top: "155px",
right: "673px",
top: "92px",
right: "455px",
},
{
top: "443px",
right: "561px",
},
{
top: "200px",
right: "893px",
top: "155px",
right: "673px",
},
{
top: "512px",
right: "780px",
},
{
top: "232px",
right: "1111px",
top: "200px",
right: "893px",
},
{
top: "565px",
right: "1000px",
},
{
top: "254px",
right: "1331px",
top: "232px",
right: "1111px",
},
{
top: "602px",
right: "1220px",
},
{
top: "267px",
right: "1551px",
top: "254px",
right: "1331px",
},
{
top: "630px",
right: "1440px",
},
{
top: "267px",
right: "1551px",
},
{
top: "650px",
right: "1660px",
@@ -463,8 +464,17 @@ const getList = () => {
}
loading.value = true;
growthRequest(PROFESSIONAL_STUDENT_TASKLIST, params).then((res) => {
console.log(res);
stageProcessList.value = res.data;
let newData = res.data.slice(0, 15);
// 默认第一个在第一点位
let num = 15 / newData.length;
stageProcessList.value = newData.map((item, index) => {
// 默认第一个在第一点位
if (index === 0) {
item.position = 0;
}
item.position = Number((index * num).toFixed());
return item;
});
loading.value = false;
});
};
@@ -815,6 +825,7 @@ function toOffcoursePlanPage(id) {
.path-item-bottom {
position: absolute;
width: 210px;
cursor: pointer;
.item-progress {
flex: 1;
}
@@ -871,6 +882,7 @@ function toOffcoursePlanPage(id) {
.path-item-top {
position: absolute;
width: 210px;
cursor: pointer;
.item-progress {
flex: 1;
}