hz/student-h5
1
0
Fork 0
mirror of https://codeup.aliyun.com/67762337eccfc218f6110e0e/vue/student-h5.git synced 2025-12-09 02:46:47 +08:00
Code Issues Packages Projects Releases Wiki Activity

Merge remote-tracking branch 'yx/250207-growth-prod-master-zp' into dev0731

Browse Source
This commit is contained in:
joshen
2025-02-21 14:53:53 +08:00
parent c90b690c79 162f31247d
commit 5990df9b9c
2 changed files with 156 additions and 150 deletions
Download Patch File Download Diff File Expand all files Collapse all files

105
src/views/growth/growthDetails.vue
View File

@@ -4,7 +4,7 @@
<div class="nav-left" @click="returnclick"> <div class="nav-left" @click="returnclick">
<el-icon color="#fff" size="20"><ArrowLeft /></el-icon> <el-icon color="#fff" size="20"><ArrowLeft /></el-icon>
</div> </div>
<div class="nav-title">专业力必修</div> <div class="nav-title">{{ data.growthName }}</div>
</div> </div>
<div class="tabs"> <div class="tabs">
<div <div
@@ -65,65 +65,66 @@
v-loading="loading" v-loading="loading"
:style="stageProcessList.length ? '' : 'height:400px'" :style="stageProcessList.length ? '' : 'height:400px'"
> >
<div <template v-if="stageProcessList && stageProcessList.length">
@click="toFinish(item)" <div
:id="item.id" @click="toFinish(item)"
v-for="(item, key) in stageProcessList" :id="item.id"
:key="key" v-for="(item, key) in stageProcessList"
class="task-item" :key="key"
> class="task-item"
<div class="task-img"> >
<img <div class="task-img">
style="width: 100%; height: 100%" <img
:src="getAssetsFile(item.courseType)" style="width: 100%; height: 100%"
/> :src="getAssetsFile(item.courseType)"
</div> />
<div> </div>
<div style="display: flex; align-items: center"> <div>
<div class="task-type"> <div style="display: flex; align-items: center">
{{ TASK_TYPES.typeName[item.courseType] }} <div class="task-type">
{{ TASK_TYPES.typeName[item.courseType] }}
</div>
<div class="task-name">{{ item.taskName }}</div>
</div> </div>
<div class="task-name">{{ item.taskName }}</div> <div
</div> class="task-state"
<div :style="{
class="task-state" color:
:style="{
color:
item.completionStatus === '0'
? '#C4C2C2'
: item.completionStatus === '1'
? '#0077EC'
: '#FF8726',
}"
>
{{
item.completionStatus === "0"
? "未开始"
: item.completionStatus === "1"
? "已完成"
: "进行中"
}}
</div>
<div style="display: flex; align-items: center">
<div style="flex: 1">
<el-progress
:percentage="item.progress"
:show-text="false"
:stroke-width="3"
:color="
item.completionStatus === '0' item.completionStatus === '0'
? '#C4C2C2' ? '#C4C2C2'
: item.completionStatus === '1' : item.completionStatus === '1'
? '#0077EC' ? '#0077EC'
: '#FF8726' : '#FF8726',
" }"
/> >
{{
item.completionStatus === "0"
? "未开始"
: item.completionStatus === "1"
? "已完成"
: "进行中"
}}
</div>
<div style="display: flex; align-items: center">
<div style="flex: 1">
<el-progress
:percentage="item.progress"
:show-text="false"
:stroke-width="3"
:color="
item.completionStatus === '0'
? '#C4C2C2'
: item.completionStatus === '1'
? '#0077EC'
: '#FF8726'
"
/>
</div>
<div class="progress-text">{{ item.progress }}%</div>
</div> </div>
<div class="progress-text">{{ item.progress }}%</div>
</div> </div>
</div> </div>
</div> </template>
<template v-if="stageProcessList && stageProcessList.length"> </template>
<template v-else> <template v-else>
<el-empty description="暂无数据" /> <el-empty description="暂无数据" />
</template> </template>

201
src/views/growth/growthPath.vue
View File

@@ -4,7 +4,7 @@
<div class="nav-left" @click="returnclick"> <div class="nav-left" @click="returnclick">
<el-icon color="#fff" size="20"><ArrowLeft /></el-icon> <el-icon color="#fff" size="20"><ArrowLeft /></el-icon>
</div> </div>
<div class="nav-title">{{ growthInfo.growthName }}</div> <div class="nav-title">{{ data.growthName }}</div>
</div> </div>
<div class="tabs"> <div class="tabs">
<div <div
@@ -60,117 +60,122 @@
<!-- <img class="icon" src="@/assets/image/growth/list.png" /> --> <!-- <img class="icon" src="@/assets/image/growth/list.png" /> -->
<img class="icon" @click="toPath" src="@/assets/image/growth/list.png" /> <img class="icon" @click="toPath" src="@/assets/image/growth/list.png" />
</div> </div>
<div class="container" v-loading="loading"> <template v-if="stageProcessList && stageProcessList.length">
<div :style="{ transform: 'scale(' + transformSize + ')' }"> <div class="container" v-loading="loading">
<template v-if="growthInfo.template == 2"> <div :style="{ transform: 'scale(' + transformSize + ')' }">
<div class="path-container"> <template v-if="growthInfo.template == 2">
<div <div class="path-container">
:class=" <div
item.position + 1 < 3 || :class="
item.position + 1 == 4 ||
item.position + 1 == 6
? 'path-item-left'
: 'path-item-right'
"
@click="toFinish(item)"
:style="point[item.position]"
v-for="(item, index) of stageProcessList"
>
<template
v-if="
item.position + 1 < 3 || item.position + 1 < 3 ||
item.position + 1 == 4 || item.position + 1 == 4 ||
item.position + 1 == 6 item.position + 1 == 6
? 'path-item-left'
: 'path-item-right'
" "
@click="toFinish(item)"
:style="point[item.position]"
v-for="(item, index) of stageProcessList"
> >
<div> <template
<div class="item-name">{{ item.taskName }}</div> v-if="
<div class="triangle"></div> item.position + 1 < 3 ||
</div> item.position + 1 == 4 ||
<div class="f-a-c"> item.position + 1 == 6
<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
:style="{
width: widthConfig(item.position).width,
marginLeft: widthConfig(item.position).margin,
}"
class="line"
></div>
<div class="circle"></div>
</div>
</div>
</template>
<template v-else>
<div class="item-link">
<div class="circle"></div>
<div
:style="{
width: widthConfig(item.position).width,
marginRight: widthConfig(item.position).margin,
}"
class="line"
></div>
</div>
<div>
<div> <div>
<div class="item-name">{{ item.taskName }}</div> <div class="item-name">{{ item.taskName }}</div>
<div class="triangle"></div> <div class="triangle"></div>
</div> </div>
<div class="f-a-c" style="justify-content: flex-end"> <div class="f-a-c">
<div class="item-progress"> <div class="f-a-c">
<el-progress <div class="item-progress">
:percentage="parseInt(item.progress)" <el-progress
:show-text="false" :percentage="parseInt(item.progress)"
:stroke-width="6" :show-text="false"
:color="stateData(item).progressColor" :stroke-width="6"
/> :color="stateData(item).progressColor"
</div> />
</div>
<div <div
class="item-state" class="item-state"
:style="{ :style="{
color: stateData(item).color, color: stateData(item).color,
background: stateData(item).bgColor, background: stateData(item).bgColor,
}" }"
> >
{{ stateData(item).text }} {{ stateData(item).text }}
</div>
</div>
<div class="item-link">
<div
:style="{
width: widthConfig(item.position).width,
marginLeft: widthConfig(item.position).margin,
}"
class="line"
></div>
<div class="circle"></div>
</div> </div>
</div> </div>
</div> </template>
</template> <template v-else>
</div> <div class="item-link">
</div> <div class="circle"></div>
</template> <div
<template v-else> :style="{
<GrowthPath2 @toFinish="toFinish" :stageProcessList="stageProcessList"></GrowthPath2> width: widthConfig(item.position).width,
</template> marginRight: widthConfig(item.position).margin,
</div> }"
class="line"
></div>
</div>
<div>
<div>
<div class="item-name">{{ item.taskName }}</div>
<div class="triangle"></div>
</div>
<div class="f-a-c" style="justify-content: flex-end">
<div class="item-progress">
<el-progress
:percentage="parseInt(item.progress)"
:show-text="false"
:stroke-width="6"
:color="stateData(item).progressColor"
/>
</div>
<template v-if="stageProcessList && stageProcessList.length"> </template> <div
<template v-else> class="item-state"
:style="{
color: stateData(item).color,
background: stateData(item).bgColor,
}"
>
{{ stateData(item).text }}
</div>
</div>
</div>
</template>
</div>
</div>
</template>
<template v-else>
<GrowthPath2
@toFinish="toFinish"
:stageProcessList="stageProcessList"
></GrowthPath2>
</template>
</div>
</div>
</template>
<template v-else>
<div class="container" style="background-image: none">
<el-empty description="暂无数据" /> <el-empty description="暂无数据" />
</template> </div>
</div> </template>
<!-- 开课列表弹框 --> <!-- 开课列表弹框 -->
<el-dialog <el-dialog
top="120px" top="120px"