路径图 项目基本信息

This commit is contained in:
宋文超
2022-11-16 11:41:31 +08:00
parent efcfb3efe6
commit 3dc053d4ad
4 changed files with 627 additions and 345 deletions

View File

@@ -2,11 +2,11 @@
<div class="addwrapper"> <div class="addwrapper">
<div class="addhead"> <div class="addhead">
<div class="leftimg"> <div class="leftimg">
<img class="img" src="../../assets/px.jpg" /> <img class="img" :src="picUrl" />
</div> </div>
<div class="imgfor"> <div class="imgfor">
<div class="forz">产品经理进阶路径</div> <div class="forz">{{ styTitle }}</div>
<div class="fort">创建时间2022-07-21 00:00</div> <div class="fort">创建时间{{ cretime }}</div>
</div> </div>
<div class="right"> <div class="right">
<img class="img1" src="../../assets/images/leveladd/ma.png" /> <img class="img1" src="../../assets/images/leveladd/ma.png" />
@@ -116,34 +116,46 @@
<div class="onerow"><div class="taskmain">关卡概览</div></div> <div class="onerow"><div class="taskmain">关卡概览</div></div>
<div class="second" style="margin-top: 0"> <div class="second" style="margin-top: 0">
<div class="nubbox"> <div class="nubbox">
<span class="nub1">{{routerInfoOverview.totalStudentCnt}}</span> <span class="nub1">{{
routerInfoOverview.totalStudentCnt
}}</span>
<div class="nub2">总人数</div> <div class="nub2">总人数</div>
</div> </div>
<div class="nubbox"> <div class="nubbox">
<span class="nub1" style="color: #ff90ae">{{routerInfoOverview.studyStudentCnt}}</span> <span class="nub1" style="color: #ff90ae">{{
routerInfoOverview.studyStudentCnt
}}</span>
<div class="nub2">学习人数</div> <div class="nub2">学习人数</div>
</div> </div>
<div class="nubbox"> <div class="nubbox">
<span class="nub1" style="color: #a497ff">{{routerInfoOverview.completeStudentCnt}}</span> <span class="nub1" style="color: #a497ff">{{
routerInfoOverview.completeStudentCnt
}}</span>
<div class="nub2">完成人数</div> <div class="nub2">完成人数</div>
</div> </div>
<div class="nubbox"> <div class="nubbox">
<div> <div>
<span class="nub1" style="color: #5dc988">{{routerInfoOverview.onlineCourseCnt}}</span <span class="nub1" style="color: #5dc988">{{
routerInfoOverview.onlineCourseCnt
}}</span
><span style="color: #5dc988; font-size: 14px">%</span> ><span style="color: #5dc988; font-size: 14px">%</span>
</div> </div>
<div class="nub2">在线课程数</div> <div class="nub2">在线课程数</div>
</div> </div>
<div class="nubbox"> <div class="nubbox">
<div> <div>
<span class="nub1" style="color: #ff90ae">{{routerInfoOverview.offLineCourseCnt}}</span <span class="nub1" style="color: #ff90ae">{{
routerInfoOverview.offLineCourseCnt
}}</span
><span style="color: #ff90ae; font-size: 14px">%</span> ><span style="color: #ff90ae; font-size: 14px">%</span>
</div> </div>
<div class="nub2">面授课程数</div> <div class="nub2">面授课程数</div>
</div> </div>
<div class="nubbox"> <div class="nubbox">
<div> <div>
<span class="nub1" style="color: #a497ff">{{routerInfoOverview.completeRatio}}</span <span class="nub1" style="color: #a497ff">{{
routerInfoOverview.completeRatio
}}</span
><span style="color: #a497ff; font-size: 14px">%</span> ><span style="color: #a497ff; font-size: 14px">%</span>
</div> </div>
<div class="nub2">总完成率</div> <div class="nub2">总完成率</div>
@@ -151,11 +163,17 @@
</div> </div>
<div class="onerow"><div class="taskmain">关卡信息</div></div> <div class="onerow"><div class="taskmain">关卡信息</div></div>
<div class="stagemess"> <div class="stagemess">
<div v-for="item in stageList" <div
:class= "{ 'stage1': item.stageId == choosedStageId, 'stage2': item.stageId != choosedStageId }" v-for="item in stageList"
:key="item.stageId" @click="choosedStageId = item.stageId"> :class="{
{{item.stage}} stage1: item.stageId == choosedStageId,
</div> stage2: item.stageId != choosedStageId,
}"
:key="item.stageId"
@click="choosedStageId = item.stageId"
>
{{ item.stage }}
</div>
<!-- <div class="stage1">阶段1</div> <!-- <div class="stage1">阶段1</div>
<div class="stage2">阶段2</div> --> <div class="stage2">阶段2</div> -->
</div> </div>
@@ -192,20 +210,35 @@
<div class="protext">作业完成率</div> <div class="protext">作业完成率</div>
</div> </div>
<div class="proright"> <div class="proright">
<div class="pronub" style="margin-left: 280px">{{chapterOverviewList.totalTaskCnt}}</div> <div class="pronub" style="margin-left: 280px">
{{ chapterOverviewList.totalTaskCnt }}
</div>
<div class="proright1"> <div class="proright1">
<span class="textpro">关卡任务总数</span> <span class="textpro">关卡任务总数</span>
<a-progress :percent="chapterOverviewList.totalTaskCnt" style="width: 369px" /> <a-progress
:percent="chapterOverviewList.totalTaskCnt"
style="width: 369px"
/>
</div>
<div class="pronub" style="margin-left: 206px">
{{ chapterOverviewList.totalReqCnt }}
</div> </div>
<div class="pronub" style="margin-left: 206px">{{chapterOverviewList.totalReqCnt}}</div>
<div class="proright1"> <div class="proright1">
<span class="textpro">必修课</span> <span class="textpro">必修课</span>
<a-progress :percent="chapterOverviewList.totalReqCnt" style="width: 369px" /> <a-progress
:percent="chapterOverviewList.totalReqCnt"
style="width: 369px"
/>
</div>
<div class="pronub" style="margin-left: 142px">
{{ chapterOverviewList.totalOptCnt }}
</div> </div>
<div class="pronub" style="margin-left: 142px">{{chapterOverviewList.totalOptCnt}}</div>
<div class="proright1"> <div class="proright1">
<span class="textpro">选修课</span> <span class="textpro">选修课</span>
<a-progress :percent="chapterOverviewList.totalOptCnt" style="width: 369px" /> <a-progress
:percent="chapterOverviewList.totalOptCnt"
style="width: 369px"
/>
</div> </div>
</div> </div>
</div> </div>
@@ -264,27 +297,27 @@
</div> </div>
<!-- 无数据显示快速创建 --> <!-- 无数据显示快速创建 -->
<div v-show="!taskSyllabus.length"> <div v-show="!taskSyllabus.length">
<router-link :to="{ path: '/leveladddetail' }"> <router-link :to="{ path: '/leveladddetail' }">
<div <div
class="taskbox" class="taskbox"
style="background: linear-gradient(180deg, #fef3dd, #fffaf0)" style="background: linear-gradient(180deg, #fef3dd, #fffaf0)"
> >
<div class="leftt"> <div class="leftt">
<img src="../../assets/images/taskpage/left1.png" /> <img src="../../assets/images/taskpage/left1.png" />
</div>
<div class="photo">
<img src="../../assets/images/taskpage/picture1.png" />
</div>
<div class="rightt">
<img src="../../assets/images/taskpage/right1.png" />
</div>
<div class="centerbox" style="color: rgba(255, 182, 78, 1)">
添加关卡
</div>
<div class="centermain">快速创建关卡任务</div>
</div> </div>
<div class="photo"> </router-link>
<img src="../../assets/images/taskpage/picture1.png" /> </div>
</div>
<div class="rightt">
<img src="../../assets/images/taskpage/right1.png" />
</div>
<div class="centerbox" style="color: rgba(255, 182, 78, 1)">
添加关卡
</div>
<div class="centermain">快速创建关卡任务</div>
</div>
</router-link>
</div>
<!-- 无数据显示快速创建 --> <!-- 无数据显示快速创建 -->
<!-- 有数据--> <!-- 有数据-->
@@ -360,16 +393,14 @@
</div> </div>
</div> </div>
<div> <div>
<div class="iconame">{{checkType(item.type)}}</div> <div class="iconame">
{{ checkType(item.type) }}
</div>
<div class="icontext">{{ item.name }}</div> <div class="icontext">{{ item.name }}</div>
</div> </div>
</div> </div>
<div class="type"> <div class="type">
<div <div :class="item.flag ? 'typename1' : 'typename'">
:class="
item.flag ? 'typename1' : 'typename'
"
>
{{ item.flag ? "必修" : "选修" }} {{ item.flag ? "必修" : "选修" }}
</div> </div>
</div> </div>
@@ -429,7 +460,7 @@
: 'none', : 'none',
}" }"
@click=" @click="
item.type ===2 item.type === 2
? showCopyModal(item.type) ? showCopyModal(item.type)
: item.type === 6 : item.type === 6
? showzhibModal(item.type) ? showzhibModal(item.type)
@@ -546,7 +577,7 @@
:current="currentPage" :current="currentPage"
:total="tableDataTotal" :total="tableDataTotal"
class="pagination" class="pagination"
style="display:none" style="display: none"
/> />
</div> </div>
</div> </div>
@@ -559,136 +590,153 @@
<a-tabs> <a-tabs>
<a-tab-pane key="1" tab="基本信息"> <a-tab-pane key="1" tab="基本信息">
<div class="sametab"> <div class="sametab">
<div class="Gcon"> <div class="Gcon">
<div class="pad"></div> <div class="pad"></div>
<div class="Gin"> <div class="Gin">
<div class="headone"> <div class="headone">
<div class="box"></div> <div class="box"></div>
<div class="onetitle">关卡内容可见可学设置</div> <div class="onetitle">关卡内容可见可学设置</div>
<div class="oneedi" @click="showbtn" v-show="twobtn"> <div class="oneedi" @click="showbtn" v-show="twobtn">
编辑 编辑
</div> </div>
<div v-show="twobtnn" class="twobtn"> <div v-show="twobtnn" class="twobtn">
<div class="btnone" @click="closebtn">取消</div> <div class="btnone" @click="closebtn">取消</div>
<div class="btntwo" @click="closebtn">确定</div> <div class="btntwo" @click="closebtn">确定</div>
</div>
</div>
<div class="onemain clearfix">
<div class="checkcon">
<input
type="checkbox"
name="cb1"
value="yulan"
class="in"
/>
<span class="yulan">预览其他关卡</span><br />
<div style="width: 10px; height: 4px"></div>
<div style="display: flex; align-items: center">
<span class="yulan2">学员可预览第</span>
<span style="color: #4ea6ff" v-show="number">1</span>
<a-input-number
v-model:value="nubvalue"
v-show="inputbox"
:controls="false"
:autofocus="true"
:min="1"
/>
<span>-</span
><span style="color: #4ea6ff" v-show="number">4</span>
<a-input-number
v-model:value="nubvalue1"
v-show="inputbox"
:controls="false"
:autofocus="true"
:min="1"
/>
<span>关内容</span>
</div> </div>
</div> </div>
<div class="checkcon" style="margin-top: 20px"> <div class="onemain clearfix">
<input <div class="checkcon">
type="checkbox" <input
name="cb1" type="checkbox"
value="xuexi" name="cb1"
class="in" value="yulan"
/> class="in"
<span class="yulan">学习其他关卡</span><br />
<div style="width: 10px; height: 4px"></div>
<div style="display: flex; align-items: center">
<span class="yulan2">学员可预览第</span>
<span style="color: #4ea6ff" v-show="number">1</span>
<a-input-number
v-model:value="nubvalue2"
v-show="inputbox"
:controls="false"
:autofocus="true"
:min="1"
/> />
<span>-</span <span class="yulan">预览其他关卡</span><br />
><span style="color: #4ea6ff" v-show="number">4</span> <div style="width: 10px; height: 4px"></div>
<a-input-number <div style="display: flex; align-items: center">
v-model:value="nubvalue3" <span class="yulan2">学员可预览第</span>
v-show="inputbox" <span style="color: #4ea6ff" v-show="number">1</span>
:controls="false" <a-input-number
:autofocus="true" v-model:value="nubvalue"
:min="1" v-show="inputbox"
/> :controls="false"
<span>关内容</span> :autofocus="true"
:min="1"
/>
<span>-</span
><span style="color: #4ea6ff" v-show="number">4</span>
<a-input-number
v-model:value="nubvalue1"
v-show="inputbox"
:controls="false"
:autofocus="true"
:min="1"
/>
<span>关内容</span>
</div>
</div> </div>
<div class="checkcon" style="margin-top: 20px">
<input
type="checkbox"
name="cb1"
value="xuexi"
class="in"
/>
<span class="yulan">学习其他关卡</span><br />
<div style="width: 10px; height: 4px"></div>
<div style="display: flex; align-items: center">
<span class="yulan2">学员可预览第</span>
<span style="color: #4ea6ff" v-show="number">1</span>
<a-input-number
v-model:value="nubvalue2"
v-show="inputbox"
:controls="false"
:autofocus="true"
:min="1"
/>
<span>-</span
><span style="color: #4ea6ff" v-show="number">4</span>
<a-input-number
v-model:value="nubvalue3"
v-show="inputbox"
:controls="false"
:autofocus="true"
:min="1"
/>
<span>关内容</span>
</div>
</div>
<br />
</div> </div>
<br />
</div> </div>
</div> </div>
</div> </div>
</a-tab-pane>
</div>
</a-tab-pane>
<a-tab-pane key="2" tab="共享文档"> <a-tab-pane key="2" tab="共享文档">
<div class="sametab"> <div class="sametab">
<div class="Gcon"> <div class="Gcon">
<div class="pad"></div> <div class="pad"></div>
<div class="Gin"> <div class="Gin">
<div class="headone"> <div class="headone">
<div class="box"></div> <div class="box"></div>
<div class="onetitle">上传共享文档</div> <div class="onetitle">上传共享文档</div>
<div class="oneedi"> <div class="oneedi">
<a-switch v-model:checked="docChecked" ></a-switch> <a-switch v-model:checked="docChecked"></a-switch>
</div>
</div>
<div class="btnbox" style="margin: 20px">
<a-upload
v-model:file-list="fileList"
name="file"
action="/api/file/upload"
@change="handleChange"
>
<span
class="xkbtn"
style="cursor: pointer; font-size: 17px"
>上传</span
>
<img
src="@/assets/images/basicinfo/cloud.png"
style="cursor: pointer; width: 34px; height: 34px"
alt=""
/>
</a-upload>
<div class="btnbox" style="margin: 20px">
<span style="color: #999999">
支持pdf.ppt.pptx.doc.docx.xls.xlsx.jpeg.png.gif.zip
</span>
</div>
<div
v-for="item in docList"
:key="item.src"
class="docListStyle"
>
<img
src="@/assets/images/basicinfo/download.png"
style="
cursor: pointer;
width: 40px;
height: 40px;
margin-right: 40px;
"
alt=""
/>
<span style="font: oblique 16px Sans-serif">{{
item.name
}}</span>
<span style="color: #4ea6ff; float: right">删除</span>
</div>
</div> </div>
</div> </div>
<div class="btnbox" style="margin:20px;">
<a-upload
v-model:file-list="fileList"
name="file"
action="/api/file/upload"
@change="handleChange"
>
<span class="xkbtn" style="cursor: pointer; font-size: 17px" >上传</span>
<img src="@/assets/images/basicinfo/cloud.png" style="cursor: pointer;
width:34px;height:34px;
" alt="">
</a-upload>
<div class="btnbox" style="margin:20px;">
<span style="color: #999999">
支持pdf.ppt.pptx.doc.docx.xls.xlsx.jpeg.png.gif.zip
</span>
</div>
<div v-for="item in docList" :key="item.src" class="docListStyle">
<img src="@/assets/images/basicinfo/download.png" style="cursor: pointer;
width:40px;height:40px;margin-right:40px;
" alt="">
<span style="font: oblique 16px Sans-serif">{{item.name}}</span>
<span style="color: #4ea6ff;float:right;">删除</span>
</div>
</div>
</div> </div>
</div> </div>
</div> </a-tab-pane>
</a-tab-pane>
</a-tabs> </a-tabs>
</a-tab-pane> </a-tab-pane>
</a-tabs> </a-tabs>
<a-modal <a-modal
style="padding: 0" style="padding: 0"
@@ -848,10 +896,10 @@
<!-- 导入学员抽屉 --> <!-- 导入学员抽屉 -->
<imp-stu v-model:AddImpStuvisible="AddImpStuvisible" /> <imp-stu v-model:AddImpStuvisible="AddImpStuvisible" />
<!-- 学员管理查看抽屉 --> <!-- 学员管理查看抽屉 -->
<check-stu <check-stu
v-model:CheckStuvisible="CheckStuvisible" v-model:CheckStuvisible="CheckStuvisible"
v-model:studentId="studentId" v-model:studentId="studentId"
/> />
<!-- 面授学员抽屉 --> <!-- 面授学员抽屉 -->
<face-stu v-model:FSvisible="FSvisible" /> <face-stu v-model:FSvisible="FSvisible" />
<!-- 活动考勤抽屉 --> <!-- 活动考勤抽屉 -->
@@ -875,8 +923,8 @@
</div> </div>
</template> </template>
<script> <script>
import { ref, reactive, toRefs,onMounted, createVNode } from "vue"; import { ref, reactive, toRefs, onMounted, createVNode } from "vue";
import { ExclamationCircleOutlined } from '@ant-design/icons-vue'; import { ExclamationCircleOutlined } from "@ant-design/icons-vue";
import { message, Modal } from "ant-design-vue"; import { message, Modal } from "ant-design-vue";
import PathAddStu from "../../components/drawers/pathStuAdd"; import PathAddStu from "../../components/drawers/pathStuAdd";
import ImpStu from "../../components/drawers/AddLevelImportStu"; import ImpStu from "../../components/drawers/AddLevelImportStu";
@@ -893,6 +941,7 @@ import { storage } from "../../api/storage";
import { getRouterOverview } from "@/api/indexLearningPath"; import { getRouterOverview } from "@/api/indexLearningPath";
import { GetRouterDetail } from "@/api/indexTask"; import { GetRouterDetail } from "@/api/indexTask";
import * as api from "../../api/index1"; import * as api from "../../api/index1";
import { toDate } from "../../api/method";
export default { export default {
name: "LevelAdd", name: "LevelAdd",
@@ -912,36 +961,41 @@ export default {
// const routers = useRoute(); // const routers = useRoute();
// const store = useStore(); // const store = useStore();
const state = reactive({ const state = reactive({
routerId: storage.get("routerId") ?JSON.parse(storage.get("routerId")) : null, //学习路径页面传的学习路径id routerId: storage.get("routerId")
? JSON.parse(storage.get("routerId"))
: null, //学习路径页面传的学习路径id
gatename: null, //关卡名称 gatename: null, //关卡名称
gatenamee: null, //学员管理关卡名称 gatenamee: null, //学员管理关卡名称
deleteAll: false, //批量删除学员弹窗 deleteAll: false, //批量删除学员弹窗
Stuvisible: false, //添加学员抽屉 Stuvisible: false, //添加学员抽屉
AddImpStuvisible: false, //导入学员抽屉 AddImpStuvisible: false, //导入学员抽屉
CheckStuvisible: false, //学员管理的查看抽屉 CheckStuvisible: false, //学员管理的查看抽屉
addLoading:false, // 加载动画 addLoading: false, // 加载动画
choosedStageId:1, // 选择的阶段id choosedStageId: 1, // 选择的阶段id
twobtn: true, twobtn: true,
number: true, number: true,
twobtnn: false, twobtnn: false,
inputbox: false, inputbox: false,
Wvisible: false, //作业管理 Wvisible: false, //作业管理
studentId:null, studentId: null,
styTitle: null,
cretime: null,
picUrl: null,
// 共享文档列表 // 共享文档列表
docList:[ docList: [
{ {
name:'测试文档1.doc', name: "测试文档1.doc",
src:"", src: "",
}, },
{ {
name:'测试文档2.doc', name: "测试文档2.doc",
src:"", src: "",
}, },
{ {
name:'测试文档3.doc', name: "测试文档3.doc",
src:"", src: "",
} },
], ],
huodModal: false, huodModal: false,
zhibModal: false, zhibModal: false,
//任务大纲列表 //任务大纲列表
@@ -957,11 +1011,10 @@ export default {
total: 50, //总人数 total: 50, //总人数
complete: 20, //完成人数 complete: 20, //完成人数
percent: 40, percent: 40,
routerTaskId:0, routerTaskId: 0,
} },
], ],
} },
], ],
activeKey: ref("1"), activeKey: ref("1"),
value: ref(" "), value: ref(" "),
@@ -969,8 +1022,8 @@ export default {
nubvalue2: ref("1"), nubvalue2: ref("1"),
nubvalue3: ref("4"), nubvalue3: ref("4"),
nubvalue1: ref("4"), nubvalue1: ref("4"),
fileList:ref([]), fileList: ref([]),
docChecked:true, docChecked: true,
currentPage: 1, currentPage: 1,
tableDataTotal: 100, tableDataTotal: 100,
pageSize: 10, pageSize: 10,
@@ -1022,33 +1075,36 @@ export default {
}); });
const levelList = reactive({ const levelList = reactive({
routerInfoOverview:{ // 路径图整体数据概览 routerInfoOverview: {
totalStudentCnt:0, // 路径图整体数据概览
studyStudentCnt:0, totalStudentCnt: 0,
completeStudentCnt:0, studyStudentCnt: 0,
onlineCourseCnt:0, completeStudentCnt: 0,
offLineCourseCnt:0, onlineCourseCnt: 0,
completeRatio:0, offLineCourseCnt: 0,
completeRatio: 0,
}, },
chapterOverviewList:{ // 路径图阶段数据概览 chapterOverviewList: {
completeCourseRatio:0, // 路径图阶段数据概览
completeExamRatio:0, completeCourseRatio: 0,
completeRatio:0, completeExamRatio: 0,
totalTaskCnt:0, completeRatio: 0,
totalReqCnt:0, totalTaskCnt: 0,
totalOptCnt:0, totalReqCnt: 0,
totalOptCnt: 0,
}, },
stageList: [ // 阶段列表 stageList: [
// 阶段列表
{ {
stageId:1, stageId: 1,
stage:"关卡一" stage: "关卡一",
}, },
{ {
stageId:2, stageId: 2,
stage:"关卡二" stage: "关卡二",
} },
] ],
}) });
const tableDataFunc = () => { const tableDataFunc = () => {
const columns = [ const columns = [
@@ -1148,9 +1204,14 @@ export default {
> >
调整 调整
</span> </span>
<span style="color:#4EA6FF;cursor:pointer" <span
onClick={() => {delConfirm(text.record.studentId)}} style="color:#4EA6FF;cursor:pointer"
>删除</span> onClick={() => {
delConfirm(text.record.studentId);
}}
>
删除
</span>
</div> </div>
</div> </div>
); );
@@ -1250,8 +1311,8 @@ export default {
const changeTabs = (e) => { const changeTabs = (e) => {
console.log("切换tabs", e, state.routerId); console.log("切换tabs", e, state.routerId);
if(e == 2) { if (e == 2) {
myGetRouterDetail() myGetRouterDetail();
} }
//学员管理 //学员管理
if (e == 3) { if (e == 3) {
@@ -1272,21 +1333,21 @@ export default {
.then((res) => { .then((res) => {
console.log("获取学员列表", res); console.log("获取学员列表", res);
let data = res.data.data.rows || null; let data = res.data.data.rows || null;
state.tableData = [] state.tableData = [];
if(data.length){ if (data.length) {
for(let i in data) { for (let i in data) {
let _time = new Date(data[i].beginStudyTime*1000); let _time = new Date(data[i].beginStudyTime * 1000);
state.tableData.push({ state.tableData.push({
key:i+1, key: i + 1,
com:data[i].userInfoBo.deptName, com: data[i].userInfoBo.deptName,
name:data[i].userInfoBo.userName, name: data[i].userInfoBo.userName,
gang:data[i].userInfoBo.jobName, gang: data[i].userInfoBo.jobName,
cur:data[i].currentChapterName || '0', cur: data[i].currentChapterName || "0",
jin:data[i].completeChapterCnt+'/'+ data[i].totalChapterCnt, jin: data[i].completeChapterCnt + "/" + data[i].totalChapterCnt,
time:_time.toLocaleDateString(), time: _time.toLocaleDateString(),
studentId:data[i].studentId, studentId: data[i].studentId,
}) });
// state.tableData[i].key = i+1; // state.tableData[i].key = i+1;
// state.tableData[i].com = data[i].userInfoBo.deptName; // state.tableData[i].com = data[i].userInfoBo.deptName;
// state.tableData[i].name = data[i].userInfoBo.userName // state.tableData[i].name = data[i].userInfoBo.userName
@@ -1301,8 +1362,8 @@ export default {
console.log("获取学员列表失败", err); console.log("获取学员列表失败", err);
}); });
}; };
const checkType = (type) => { const checkType = (type) => {
let typeRules = [ let typeRules = [
"", "",
"在线", "在线",
"面授", "面授",
@@ -1318,57 +1379,71 @@ export default {
"投票", "投票",
]; ];
return typeRules[type]; return typeRules[type];
} };
//学员管理------------------------------------------------ //学员管理------------------------------------------------
onMounted(() => { onMounted(() => {
state.addLoading = true; state.addLoading = true;
getOverview() getOverview();
}) GetRouterDetail(state.routerId).then((res) => {
state.styTitle = res.data.data.routerInfo.name;
state.cretime = toDate(
res.data.data.routerInfo.createTime / 1000,
"Y-M-D h:m"
);
state.picUrl = res.data.data.routerInfo.picUrl;
});
});
// 获取项目概览 // 获取项目概览
const getOverview = () =>{ const getOverview = () => {
getRouterOverview(state.routerId).then((res) => { getRouterOverview(state.routerId)
Object.keys(res.data.data.routerInfoOverview).forEach(item => { .then((res) => {
levelList.routerInfoOverview[item] = res.data.data.routerInfoOverview[item] || 0 Object.keys(res.data.data.routerInfoOverview).forEach((item) => {
levelList.routerInfoOverview[item] =
res.data.data.routerInfoOverview[item] || 0;
});
Object.keys(res.data.data.chapterOverviewList).forEach((item) => {
levelList.chapterOverviewList[item] =
res.data.data.chapterOverviewList[item] || 0;
});
// res.data.data.routerInfoOverview.forEach((r) => {
// console.log(r)
// })
state.addLoading = false;
console.log("项目概览--" + res);
}) })
Object.keys(res.data.data.chapterOverviewList).forEach(item => { .catch((err) => {
levelList.chapterOverviewList[item] = res.data.data.chapterOverviewList[item] || 0 state.addLoading = false;
}) message.error("概览获取失败");
// res.data.data.routerInfoOverview.forEach((r) => { console.log("获取失败" + err);
// console.log(r) });
// }) };
state.addLoading = false;
console.log("项目概览--"+res)
}).catch(err => {
state.addLoading = false;
message.error("概览获取失败")
console.log("获取失败"+err)
})
}
// 获取路径列表 // 获取路径列表
const myGetRouterDetail = () => { const myGetRouterDetail = () => {
GetRouterDetail(state.routerId).then(res => { GetRouterDetail(state.routerId)
let data = res.data.data.chapterList .then((res) => {
state.taskSyllabus = data let data = res.data.data.chapterList;
// for(let i in data) {
// state.taskSyllabus[i].name = data[i].name
// if(data[i].taskList.length > 0) {
// for(let j in data[i].taskList) {
// Object.keys(data[i].taskList[j]).forEach(item => {
// state.taskSyllabus[i].taskList[j][item] = data[i].taskList[j][item] || 0
// })
// }
// }
// }
}).catch(err => {
console.log(err)
message.error('获取路径列表失败'+err);
})
} state.taskSyllabus = data;
// for(let i in data) {
// state.taskSyllabus[i].name = data[i].name
// if(data[i].taskList.length > 0) {
// for(let j in data[i].taskList) {
// Object.keys(data[i].taskList[j]).forEach(item => {
// state.taskSyllabus[i].taskList[j][item] = data[i].taskList[j][item] || 0
// })
// }
// }
// }
})
.catch((err) => {
console.log(err);
message.error("获取路径列表失败" + err);
});
};
const handleChange = (info) => { const handleChange = (info) => {
if (info.file.status !== "uploading") { if (info.file.status !== "uploading") {
@@ -1383,23 +1458,26 @@ export default {
}; };
const delConfirm = (id) => { const delConfirm = (id) => {
Modal.confirm({ Modal.confirm({
title: '是否确认删除', title: "是否确认删除",
icon: createVNode(ExclamationCircleOutlined), icon: createVNode(ExclamationCircleOutlined),
content: '', content: "",
okText: '确认', okText: "确认",
cancelText: '取消', cancelText: "取消",
onOk(){ onOk() {
api.delStudent({routerId:100,studentIds:[id]}).then(res => { api
message.success("删除成功") .delStudent({ routerId: 100, studentIds: [id] })
console.log(res) .then((res) => {
}).catch(err => { message.success("删除成功");
message.error("删除失败"+err) console.log(res);
console.log(err) })
}) .catch((err) => {
} message.error("删除失败" + err);
console.log(err);
});
},
}); });
} };
return { return {
...toRefs(state), ...toRefs(state),

View File

@@ -179,11 +179,11 @@
<div class="filt"> <div class="filt">
<div class="le"> <div class="le">
<div class="leftimg"> <div class="leftimg">
<img class="img" src="../../assets/px.jpg" /> <img class="img" :src="picUrl" />
</div> </div>
<div class="imgfor"> <div class="imgfor">
<div class="forz">产品经理进阶路径</div> <div class="forz">{{ styTitle }}</div>
<div class="fort">创建时间2022-07-21 00:00</div> <div class="fort">创建时间{{ creTime }}</div>
</div> </div>
</div> </div>
<div class="rightt"> <div class="rightt">
@@ -266,7 +266,7 @@
<div> <div>
<add-test <add-test
v-model:addtestVisible="addtestvisible" v-model:addtestVisible="addtestvisible"
:isLevel="isLevel" :isLevel="isLevel"
@changeData="updateTableData" @changeData="updateTableData"
v-model:isactive="isactive" v-model:isactive="isactive"
v-model:edit="edit" v-model:edit="edit"
@@ -288,7 +288,7 @@
<div> <div>
<add-live <add-live
v-model:addliveVisible="addlivevisible" v-model:addliveVisible="addlivevisible"
:isLevel="isLevel" :isLevel="isLevel"
@changeData="updateTableData" @changeData="updateTableData"
v-model:isactive="isactive" v-model:isactive="isactive"
v-model:routerId="routerId" v-model:routerId="routerId"
@@ -310,7 +310,7 @@
<div> <div>
<add-ref <add-ref
v-model:addrefVisible="addrefvisible" v-model:addrefVisible="addrefvisible"
:isLevel="isLevel" :isLevel="isLevel"
@changeData="updateTableData" @changeData="updateTableData"
v-model:isactive="isactive" v-model:isactive="isactive"
v-model:routerId="routerId" v-model:routerId="routerId"
@@ -333,7 +333,7 @@
<add-discuss <add-discuss
v-model:adddiscussVisible="adddiscussvisible" v-model:adddiscussVisible="adddiscussvisible"
@changeData="updateTableData" @changeData="updateTableData"
:isLevel="isLevel" :isLevel="isLevel"
v-model:isactive="isactive" v-model:isactive="isactive"
v-model:edit="edit" v-model:edit="edit"
v-model:routerId="routerId" v-model:routerId="routerId"
@@ -354,7 +354,7 @@
<div> <div>
<add-active <add-active
v-model:addactiveVisible="addactivevisible" v-model:addactiveVisible="addactivevisible"
:isLevel="isLevel" :isLevel="isLevel"
v-model:edit="edit" v-model:edit="edit"
v-model:isactive="isactive" v-model:isactive="isactive"
@changeData="updateTableData" @changeData="updateTableData"
@@ -376,7 +376,7 @@
<div> <div>
<add-eval <add-eval
v-model:addevalVisible="addevalvisible" v-model:addevalVisible="addevalvisible"
:isLevel="isLevel" :isLevel="isLevel"
@changeData="updateTableData" @changeData="updateTableData"
v-model:isactive="isactive" v-model:isactive="isactive"
v-model:edit="edit" v-model:edit="edit"
@@ -399,7 +399,7 @@
<div> <div>
<add-invist <add-invist
v-model:addinvistVisible="addinvistvisible" v-model:addinvistVisible="addinvistvisible"
:isLevel="isLevel" :isLevel="isLevel"
@changeData="updateTableData" @changeData="updateTableData"
v-model:isactive="isactive" v-model:isactive="isactive"
v-model:edit="edit" v-model:edit="edit"
@@ -423,7 +423,7 @@
<div> <div>
<add-vote <add-vote
v-model:addvoteVisible="addvotevisible" v-model:addvoteVisible="addvotevisible"
:isLevel="isLevel" :isLevel="isLevel"
@changeData="updateTableData" @changeData="updateTableData"
v-model:isactive="isactive" v-model:isactive="isactive"
v-model:edit="edit" v-model:edit="edit"
@@ -456,7 +456,7 @@
<span>任务列表</span> <span>任务列表</span>
</div> </div>
<div class="tit_right"> <div class="tit_right">
<div class="btn btn1" @click="moveTask"> <div class="btn btn1" @click="showChangeModal">
<div class="btnText">移动到任务阶段</div> <div class="btnText">移动到任务阶段</div>
</div> </div>
<div class="btn btn2"> <div class="btn btn2">
@@ -895,6 +895,57 @@
</div> </div>
</div> </div>
</a-modal> </a-modal>
<!-- 移动任务到阶段 -->
<a-modal
style="padding: 0"
:closable="sh"
v-model:visible="visiblene"
:footer="null"
centered="true"
wrapClassName="moveModal"
>
<div class="con">
<div class="header">
<div class="inhe">
<div class="mod"></div>
<div class="tz">选择任务移动到阶段</div>
</div>
</div>
<div class="mid">
<div class="inher">
<div class="cur">已选中{{ selectRow.length }}个任务</div>
<div class="select">
<a-select
v-model:value="curLevel"
style="width: 100%"
placeholder="请选择阶段"
:options="level"
@change="handleChangeStage"
allowClear
showSearch
></a-select>
</div>
<div class="btn">
<button
style="cursor: pointer"
class="sameb btn1"
@click="closeChangeModal"
>
取消
</button>
<button
style="cursor: pointer"
class="sameb btn2"
@click="moveTask"
>
确定
</button>
</div>
</div>
</div>
</div></a-modal
>
</div> </div>
</template> </template>
@@ -918,6 +969,7 @@ import { storage } from "../../api/storage";
import { deleteStudyTask } from "../../api/indexStudy"; import { deleteStudyTask } from "../../api/indexStudy";
import draggable from "vuedraggable"; import draggable from "vuedraggable";
import { editTask } from "../../api/indexTaskadd"; import { editTask } from "../../api/indexTaskadd";
import { toDate } from "../../api/method";
export default { export default {
name: "LevelAddDetail", name: "LevelAddDetail",
components: { components: {
@@ -1162,7 +1214,7 @@ export default {
value2: "", value2: "",
selectedRowKeys: [], selectedRowKeys: [],
edit: false, //是否点击编辑 edit: false, //是否点击编辑
isLevel:1,//学习路径1项目2模板库3 isLevel: 1, //学习路径1项目2模板库3
gqxy_hs: true, gqxy_hs: true,
isactive: 0, isactive: 0,
projectChecked: null, //项目单选框 projectChecked: null, //项目单选框
@@ -1178,6 +1230,11 @@ export default {
ListChoosedId: 0, ListChoosedId: 0,
selectRow: [], //选择行 selectRow: [], //选择行
selectAll: 0, //0未选择1全选2部分选择 selectAll: 0, //0未选择1全选2部分选择
visiblene: false, //移动任务弹窗
removeStageId: null,
styTitle: null,
creTime: null,
picUrl: null,
}); });
//新建关卡 //新建关卡
@@ -1318,6 +1375,18 @@ export default {
.then((res) => { .then((res) => {
console.log("res.data.data.chapterList", res.data.data.chapterList); console.log("res.data.data.chapterList", res.data.data.chapterList);
state.level = res.data.data.chapterList; state.level = res.data.data.chapterList;
state.styTitle = res.data.data.routerInfo.name;
state.creTime = toDate(
res.data.data.routerInfo.createTime / 1000,
"Y-M-D h:m"
);
state.picUrl = res.data.data.routerInfo.picUrl;
//增加两个字段
state.level.forEach((item) => {
item["value"] = item.chapterId;
item["label"] = item.name;
});
if (state.level.length > 0) { if (state.level.length > 0) {
dataAssignment(state.level[0].chapterId); dataAssignment(state.level[0].chapterId);
state.isactive = state.level[0].chapterId; state.isactive = state.level[0].chapterId;
@@ -1676,20 +1745,29 @@ export default {
}; };
//移动任务到关卡 //移动任务到关卡
const moveTask = () => { const moveTask = () => {
let obj = { if (state.isactive == state.removeStageId) {
chapterId: state.isactive, message.destroy();
routerTaskIdList: state.selectRow, message.warning("选择的任务已在当前阶段");
}; } else if (state.removeStageId == null) {
api message.destroy();
.moveTask(obj) message.warning("请选择关卡");
.then((res) => { } else {
console.log("移动成功", res); let obj = {
message.destroy(); chapterId: state.removeStageId,
message.success("移动成功"); routerTaskIdList: state.selectRow,
}) };
.catch((err) => { api
console.log("移动失败", err); .moveTask(obj)
}); .then((res) => {
console.log("移动成功", res);
message.destroy();
message.success("移动成功");
})
.catch((err) => {
console.log("移动失败", err);
});
state.visiblene = false;
}
}; };
//编辑的按钮 //编辑的按钮
@@ -1757,6 +1835,21 @@ export default {
message.warning("修改失败"); message.warning("修改失败");
}); });
}; };
const showChangeModal = () => {
if (state.selectRow.length == 0) {
message.destroy();
return message.warning("请选择要移动的任务");
} else {
state.visiblene = true;
}
};
const closeChangeModal = () => {
state.visiblene = false;
};
const handleChangeStage = (value, option) => {
console.log("阶段改变", value, option);
state.removeStageId = option.chapterId;
};
return { return {
...toRefs(state), ...toRefs(state),
// tableDataFunc, // tableDataFunc,
@@ -1799,6 +1892,9 @@ export default {
updateTableData, updateTableData,
deleteChapter, deleteChapter,
changeCourseType, changeCourseType,
showChangeModal,
closeChangeModal,
handleChangeStage,
}; };
}, },
}; };
@@ -1916,6 +2012,107 @@ export default {
} }
} }
} }
.moveModal {
.ant-modal {
width: 549px !important;
height: 245px !important;
.ant-modal-content {
width: 549px !important;
height: 245px !important;
.ant-modal-body {
padding: 0 !important;
width: 549px !important;
height: 245px !important;
.con {
// background-color: #bfa;
width: 100%;
height: 100%;
.header {
width: 100%;
display: flex;
height: 68px;
position: relative;
justify-content: center;
background: linear-gradient(
rgba(78, 166, 255, 0.2) 0%,
rgba(78, 166, 255, 0) 100%
);
.inhe {
width: 80%;
height: 100%;
display: flex;
justify-content: space-between;
align-items: center;
.mod {
left: 30px;
top: 27px;
position: absolute;
width: 18px;
height: 17px;
background-image: url(../../assets/images/leveladd/mod.png);
}
.tz {
color: #000000;
font-weight: 400;
font-size: 16px;
}
.mg {
width: 20px;
height: 20px;
background-image: url(../../assets/images/basicinfo/close22.png);
background-size: 100% 100%;
cursor: pointer;
}
}
}
.mid {
width: 100%;
display: flex;
height: 100%;
justify-content: center;
.inher {
width: 80%;
height: 100%;
.cur {
color: #6f6f6f;
font-size: 14px;
}
.select {
margin-top: 10px;
}
.btn {
width: 100%;
display: flex;
justify-content: center;
margin-top: 30px;
.sameb {
width: 100px;
height: 40px;
font-size: 14px;
border-radius: 8px;
}
.btn1 {
color: #4ea6ff;
background: #ffffff;
border: 1px solid #4ea6ff;
}
.btn2 {
margin-left: 16px;
border: 0;
color: #ffffff;
background: #4ea6ff;
}
}
}
}
}
}
}
}
}
.clearfix:after, .clearfix:after,
.clearfix:before { .clearfix:before {
content: " "; content: " ";

View File

@@ -53,13 +53,12 @@
<div class="filt"> <div class="filt">
<div class="le"> <div class="le">
<div class="leftimg"> <div class="leftimg">
<img <img class="img" :src="picUrl" />
class="img"
src="../../assets/images/projectadd/picture.png"
/>
</div> </div>
<div class="imgfor"> <div class="imgfor">
<div class="forz" style="font-weight: 700">管理者进阶-腾飞班</div> <div class="forz" style="font-weight: 700">
{{ projectTitle }}
</div>
</div> </div>
</div> </div>
<div class="rightt"> <div class="rightt">
@@ -97,15 +96,16 @@
</div> </div>
<!-- 添加在线侧弹窗 --> <!-- 添加在线侧弹窗 -->
<div> <div>
<add-online <add-online
v-model:addonlineVisible="addonlinevisible" v-model:addonlineVisible="addonlinevisible"
@changeData="updateTableData" @changeData="updateTableData"
:isLevel="isLevel" :isLevel="isLevel"
v-model:edit="edit" v-model:edit="edit"
v-model:projectId="projectId" v-model:projectId="projectId"
v-model:chooseStageId="chooseStageId" v-model:chooseStageId="chooseStageId"
v-model:projectTaskId="projectTaskId" v-model:projectTaskId="projectTaskId"
v-model:EditOnlineId = "EditOnlineId"/> v-model:EditOnlineId="EditOnlineId"
/>
</div> </div>
<!-- 添加在线侧弹窗 --> <!-- 添加在线侧弹窗 -->
<div class="lin"></div> <div class="lin"></div>
@@ -119,8 +119,9 @@
</div> </div>
<!-- 添加面授侧弹窗 --> <!-- 添加面授侧弹窗 -->
<div> <div>
<add-faceteach v-model:addfaceteachVisible="addfaceteachvisible" <add-faceteach
v-model:EditEvalId="EditEvalId" v-model:addfaceteachVisible="addfaceteachvisible"
v-model:EditEvalId="EditEvalId"
/> />
</div> </div>
<!-- 添加面授侧弹窗 --> <!-- 添加面授侧弹窗 -->
@@ -135,14 +136,16 @@
</div> </div>
<!-- 添加案例侧弹窗 --> <!-- 添加案例侧弹窗 -->
<div> <div>
<add-case v-model:addcaseVisible="addcasevisible" <add-case
@changeData="updateTableData" v-model:addcaseVisible="addcasevisible"
:isLevel="isLevel" @changeData="updateTableData"
:isLevel="isLevel"
v-model:edit="edit" v-model:edit="edit"
v-model:projectId="projectId" v-model:projectId="projectId"
v-model:chooseStageId="chooseStageId" v-model:chooseStageId="chooseStageId"
v-model:projectTaskId="projectTaskId" v-model:projectTaskId="projectTaskId"
v-model:EditCaseId="EditCaseId" /> v-model:EditCaseId="EditCaseId"
/>
</div> </div>
<!-- 添加案例侧弹窗 --> <!-- 添加案例侧弹窗 -->
<div class="lin"></div> <div class="lin"></div>
@@ -980,7 +983,7 @@ export default {
chooseStageId: null, chooseStageId: null,
removeStageId: null, removeStageId: null,
edit: false, edit: false,
isLevel:2,//学习路径1项目2模板库3 isLevel: 2, //学习路径1项目2模板库3
// isRefEdit: 1, //外链编辑 // isRefEdit: 1, //外链编辑
// isLiveEdit: 1, //直播编辑 // isLiveEdit: 1, //直播编辑
isRefEdit: false, //外链编辑 isRefEdit: false, //外链编辑
@@ -992,9 +995,9 @@ export default {
EditActiveId: null, //要编辑的活动id EditActiveId: null, //要编辑的活动id
EditWorkId: null, // 要编辑的作业id EditWorkId: null, // 要编辑的作业id
EditTestId: null, // 要编辑的考试id EditTestId: null, // 要编辑的考试id
EditCaseId:null,//要编辑的案例id EditCaseId: null, //要编辑的案例id
EditOnlineId:null,//要编辑的在线id EditOnlineId: null, //要编辑的在线id
EditFaceTeach:null, EditFaceTeach: null,
EditEvalId: null, EditEvalId: null,
EditInvistId: null, EditInvistId: null,
EditVoteId: null, //编辑需要投票的id EditVoteId: null, //编辑需要投票的id
@@ -1037,6 +1040,8 @@ export default {
//阶段数据 //阶段数据
level: [], level: [],
projectTitle: null,
picUrl: null,
//任务数据 //任务数据
tableData: [], tableData: [],
drawertableData: [ drawertableData: [
@@ -1251,7 +1256,7 @@ export default {
tit: value.name, tit: value.name,
name: value.remark, name: value.remark,
taskList: value.taskList, taskList: value.taskList,
value: value.name, value: value.stageId,
label: value.name, label: value.name,
}; };
array.push(obj); array.push(obj);
@@ -1400,6 +1405,8 @@ export default {
if (res.status == 200) { if (res.status == 200) {
console.log("22222", res.data.data.stageList); console.log("22222", res.data.data.stageList);
// console.log("22222", res.data.data.stageList); // console.log("22222", res.data.data.stageList);
state.projectTitle = res.data.data.projectInfo.name;
state.picUrl = res.data.data.projectInfo.picUrl;
let leng = res.data.data.stageList.length; let leng = res.data.data.stageList.length;
if (leng > 0) { if (leng > 0) {
// let stage = localStorage.getItem("stageId") // let stage = localStorage.getItem("stageId")
@@ -1643,12 +1650,12 @@ export default {
state.projectTaskId = eleId; state.projectTaskId = eleId;
}; };
const showDrawerAddInvist = (id, eleId) => { const showDrawerAddInvist = (id, eleId) => {
console.log(id, eleId, '213312'); console.log(id, eleId, "213312");
state.addinvistvisible = true; state.addinvistvisible = true;
state.projectTaskId = eleId; state.projectTaskId = eleId;
}; };
const showDrawerAddVote = (id, eleId) => { const showDrawerAddVote = (id, eleId) => {
console.log(id, eleId, '95835325932953295325'); console.log(id, eleId, "95835325932953295325");
state.addvotevisible = true; state.addvotevisible = true;
state.EditVoteId = id; state.EditVoteId = id;
state.projectTaskId = eleId; state.projectTaskId = eleId;

View File

@@ -3,12 +3,12 @@
<div class="taskpage"> <div class="taskpage">
<div class="addhead" style="flex-shrink: 0"> <div class="addhead" style="flex-shrink: 0">
<div class="leftimg"> <div class="leftimg">
<img class="img" src="../../assets/images/projectadd/picture.png" /> <img class="img" :src="picUrl" />
</div> </div>
<div class="imgfor"> <div class="imgfor">
<div class="forz">管理者进阶-腾飞班</div> <div class="forz">{{ name }}</div>
<div class="fort">项目经理黄华刘俊</div> <div class="fort">项目经理{{ manager }}</div>
<div class="fort">起止时间2022-07-21 00:00至2022-10-21 00:00</div> <div class="fort">起止时间{{ startTime }}{{ endTime }}</div>
</div> </div>
<div class="right"> <div class="right">
<img class="img1" src="../../assets/images/leveladd/ma.png" /> <img class="img1" src="../../assets/images/leveladd/ma.png" />
@@ -2973,8 +2973,8 @@ export default {
}).then((res) => { }).then((res) => {
console.log("get task", res.data.data); console.log("get task", res.data.data);
let info = res.data.data.projectInfo; let info = res.data.data.projectInfo;
let start = toDate(info.beginTime / 1000, "Y-M-D"); let start = toDate(info.beginTime / 1000, "Y-M-D h:m");
let end = toDate(info.endTime / 1000, "Y-M-D"); let end = toDate(info.endTime / 1000, "Y-M-D h:m");
state.parentId = info.parentId; state.parentId = info.parentId;
state.name = info.name; state.name = info.name;
state.startTime = start; state.startTime = start;