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

Merge branch 'master' of ssh://gitlab.dongwu-inc.com:10022/BOE/fe-manage

Browse Source
This commit is contained in:
岳佳鑫
2022-10-20 16:53:39 +08:00
parent ecbcc17087 0d65de1fe5
commit 30429f1d7a
5 changed files with 1126 additions and 173 deletions
Download Patch File Download Diff File Expand all files Collapse all files

BIN
src/assets/images/coursewareManage/imgs.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 1.5 KiB

BIN
src/assets/images/coursewareManage/nostate.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 3.8 KiB

512
src/views/courselibrary/CoursewareManage.vue
View File

@@ -67,7 +67,7 @@
</div>
<div class="btn btn3">
<div class="search"></div>
<div class="btnText">导出</div>
<div class="btnText" @click="openMessage">导出</div>
</div>
<div class="btn btn4">
<div class="search"></div>
@@ -120,7 +120,7 @@
<div class="b_sub">
<div class="bs_header">
<div class="b_left">课程命名规则</div>
<div class="b_right" @click="hideShow">
<div class="b_right" @click="hideShow" style="cursor: pointer">
<div
class="b_zk"
:style="{ display: hideshow ? 'block' : 'none' }"
@@ -295,7 +295,11 @@
<div class="i2_cz">
<div class="i2_top">
<div class="i2_left">课程命名规则</div>
<div class="i2_right" @click="hideShow">
<div
class="i2_right"
@click="hideShow"
style="cursor: pointer"
>
<div
class="b_zk"
:style="{ display: hideshow ? 'block' : 'none' }"
@@ -499,7 +503,7 @@
<span style="margin-right: 10px">附件</span>
</div>
<div class="item_inp">
<div class="accessory">
<div class="accessory" style="cursor: pointer">
<div class="accessory_icon">
<img
src="@/assets/images/coursewareManage/enclosure.png"
@@ -617,19 +621,9 @@
</div>
</div>
</a-modal>
<!-- 确定新建面授课弹窗 -->
<!-- 表格 -->
<div class="tableBox">
<!-- <a-table
:columns="tableDataFunc()"
:data-source="tableData"
:loading="tableDataTotal === -1 ? true : false"
:scroll="{ x: 600 }"
expandRowByClick="true"
@expand="expandTable"
:pagination="false"
/> -->
<a-table
:columns="columns1"
:data-source="tableData1"
@@ -655,7 +649,7 @@
<div class="headerLeft">
<img
style="width: 17px; height: 18px; margin-right: 8px"
src="../../assets/images/basicinfo/add.png"
src="@/assets/images/coursewareManage/pc.png"
/>
<div :style="{ display: ft_1 ? 'none' : 'block' }">
<span class="headerLeftText">在线课程管理</span>
@@ -811,7 +805,7 @@
<div class="headerLeft">
<img
style="width: 17px; height: 18px; margin-right: 8px"
src="../../assets/images/basicinfo/add.png"
src="@/assets/images/coursewareManage/detail.png"
/>
<span class="headerLeftText">查看详情</span>
</div>
@@ -860,7 +854,7 @@
<div class="headerLeft">
<img
style="width: 17px; height: 18px; margin-right: 8px"
src="../../assets/images/basicinfo/add.png"
src="@/assets/images/coursewareManage/givepower.png"
/>
<span class="headerLeftText">授权</span>
</div>
@@ -960,7 +954,7 @@
<div class="headerLeft">
<img
style="width: 17px; height: 18px; margin-right: 8px"
src="../../assets/images/basicinfo/add.png"
src="@/assets/images/coursewareManage/scht.png"
/>
<span class="headerLeftText">开课</span>
</div>
@@ -1019,7 +1013,21 @@
</div>
</div>
</div>
<div class="stm_table">
<!-- 无数据样式 -->
<div class="notable" :style="{ display: stm_hs ? 'none' : 'block' }">
<div class="notablebox">
<div class="boxbody">
<div class="boximg"></div>
<div class="boxtitle"><span style="color:#FFB64E;font-size: 20px;">无课程</span></div>
<div class="boxtitle2"><span style="color:#878B92;">请点击新建开课，创建课程</span></div>
</div>
<div class="smallleft"></div>
<div class="smallright"></div>
</div>
</div>
<!-- 无数据样式 -->
<!-- 有数据表格 -->
<div class="stm_table" :style="{ display: stm_hs ? 'block' : 'none' }">
<a-table
:columns="columns6"
:data-source="tableData6"
@@ -1048,6 +1056,7 @@
}"
/>
</div>
<!-- 有数据表格 -->
</div>
</div>
</div>
@@ -1257,7 +1266,7 @@
<div class="headerLeft">
<img
style="width: 17px; height: 18px; margin-right: 8px"
src="../../assets/images/basicinfo/add.png"
src="@/assets/images/coursewareManage/stum.png"
/>
<span class="headerLeftText">学员管理</span>
</div>
@@ -1407,13 +1416,11 @@
<div class="close_exit" @click="qr_exit"></div>
</div>
<div class="qrm_body"><div class="QR_img"></div></div>
<div class="qrm_btnbox">
<div class="qrm_btn btn1">
<div class="btnText" @click="qr_exit">取消</div>
</div>
<div class="qrm_btn btn2">
<div class="btnText" @click="qr_exit">确定</div>
</div>
<div class="qrm_footer">
<span style="margin-left: 52px">下载二维码</span>
<div class="qrmbtn"><div class="btntext">200*200</div></div>
<div class="qrmbtn"><div class="btntext">400*400</div></div>
<div class="qrmbtn"><div class="btntext">800*800</div></div>
</div>
</div>
</div>
@@ -1600,11 +1607,104 @@
</div>
</a-modal>
<!--请确定是否拒绝此学员学习此课程弹窗 -->
<!--删除弹窗 -->
<a-modal
v-model:visible="delete_hs"
:footer="null"
:closable="closableQR"
wrapClassName="DelModal"
style="margin-top: 400px"
>
<div class="delete" :style="{ display: delete_hs ? 'block' : 'none' }">
<div class="del_header"></div>
<div class="del_main">
<div class="header">
<div class="icon"></div>
<span>提示</span>
<div class="close_exit" @click="delete_exit"></div>
</div>
<div class="body">
<span>您确定要删除此课程吗</span>
</div>
<div class="del_btnbox">
<div class="del_btn btn1">
<div class="btnText" @click="delete_exit">取消</div>
</div>
<div class="del_btn btn2">
<div class="btnText" @click="delete_exit">确定</div>
</div>
</div>
</div>
</div>
</a-modal>
<!--删除弹窗 -->
<!--复制弹窗 -->
<a-modal
v-model:visible="copy_hs"
:footer="null"
:closable="closableQR"
wrapClassName="DelModal"
style="margin-top: 400px"
>
<div class="delete" :style="{ display: copy_hs ? 'block' : 'none' }">
<div class="del_header"></div>
<div class="del_main">
<div class="header">
<div class="icon"></div>
<span>提示</span>
<div class="close_exit" @click="delete_exit"></div>
</div>
<div class="body">
<span>您确定要复制此课程吗</span>
</div>
<div class="del_btnbox">
<div class="del_btn btn1">
<div class="btnText" @click="copy_exit">取消</div>
</div>
<div class="del_btn btn2">
<div class="btnText" @click="copy_exit">确定</div>
</div>
</div>
</div>
</div>
</a-modal>
<!--复制弹窗 -->
<!--停用弹窗 -->
<a-modal
v-model:visible="nouse_hs"
:footer="null"
:closable="closableQR"
wrapClassName="DelModal"
style="margin-top: 400px"
>
<div class="delete" :style="{ display: nouse_hs ? 'block' : 'none' }">
<div class="del_header"></div>
<div class="del_main">
<div class="header">
<div class="icon"></div>
<span>提示</span>
<div class="close_exit" @click="nouse_exit"></div>
</div>
<div class="body">
<span>您确定要停用此课程吗</span>
</div>
<div class="del_btnbox">
<div class="del_btn btn1">
<div class="btnText" @click="nouse_exit">取消</div>
</div>
<div class="del_btn btn2">
<div class="btnText" @click="nouse_exit">确定</div>
</div>
</div>
</div>
</div>
</a-modal>
<!--停用弹窗 -->
</div>
</template>
<script>
import { reactive, toRefs, defineComponent, ref } from "vue";
import { message } from "ant-design-vue";
const columns1 = [
{
title: "序号",
@@ -1963,7 +2063,6 @@ export default defineComponent({
creator: "管理员",
createtime: "2022-07-20 9:30",
pubtime: "2022-07-20 9:30",
ynuse: "启用",
kkty: false,
},
{
@@ -1980,7 +2079,6 @@ export default defineComponent({
creator: "管理员",
createtime: "2022-07-20 9:30",
pubtime: "2022-07-20 9:30",
ynuse: "启用",
kkty: true,
},
{
@@ -1997,7 +2095,6 @@ export default defineComponent({
creator: "管理员",
createtime: "2022-07-20 9:30",
pubtime: "2022-07-20 9:30",
ynuse: "启用",
kkty: true,
},
{
@@ -2014,7 +2111,6 @@ export default defineComponent({
creator: "管理员",
createtime: "2022-07-20 9:30",
pubtime: "2022-07-20 9:30",
ynuse: "停用",
kkty: true,
},
{
@@ -2031,7 +2127,6 @@ export default defineComponent({
creator: "管理员",
createtime: "2022-07-20 9:30",
pubtime: "2022-07-20 9:30",
ynuse: "启用",
kkty: true,
},
{
@@ -2048,7 +2143,6 @@ export default defineComponent({
creator: "管理员",
createtime: "2022-07-20 9:30",
pubtime: "2022-07-20 9:30",
ynuse: "启用",
kkty: true,
},
],
@@ -2264,6 +2358,9 @@ export default defineComponent({
graduate_hs: false,
agreestudy_hs: false,
rejectstudy_hs: false,
delete_hs: false,
copy_hs: false,
nouse_hs: false,
value: "",
value5: "",
value6: "",
@@ -2278,6 +2375,7 @@ export default defineComponent({
selectedRowKeys: [],
faceManageTab: "1",
});
// 渲染列表1操作
const getTableDate = () => {
let datas = state.tableData1;
datas.map((value) => {
@@ -2317,7 +2415,13 @@ export default defineComponent({
</div>
</div>
<div class="ops3">
<div class="jc" style={{ width: "30px" }}>
<div
class="jc"
onClick={() => {
state.copy_hs = true;
}}
style={{ width: "30px" }}
>
复制
</div>
</div>
@@ -2377,13 +2481,6 @@ export default defineComponent({
二维码
</div>
</a-select-option>
<a-select-option
value="复制"
label="复制"
style="padding-left:35px"
>
<div>复制</div>
</a-select-option>
<a-select-option
value="取消"
label="取消"
@@ -2486,7 +2583,13 @@ export default defineComponent({
</div>
</div>
<div class="ops3" style={{ "margin-right": "10px" }}>
<div class="jc" style={{ width: "30px" }}>
<div
class="jc"
onClick={() => {
state.copy_hs = true;
}}
style={{ width: "30px" }}
>
复制
</div>
</div>
@@ -2513,7 +2616,13 @@ export default defineComponent({
</div>
</div>
<div class="ops3">
<div class="jc" style={{ width: "30px" }}>
<div
class="jc"
onClick={() => {
state.copy_hs = true;
}}
style={{ width: "30px" }}
>
复制
</div>
</div>
@@ -2553,7 +2662,13 @@ export default defineComponent({
</div>
</div>
<div class="ops5">
<div class="jc" style="margin-left:22px">
<div
class="jc"
onClick={() => {
state.delete_hs = true;
}}
style="margin-left:22px"
>
删除
</div>
</div>
@@ -2569,6 +2684,7 @@ export default defineComponent({
state.tableData = datas;
};
getTableDate();
//渲染学员管理操作
const getTableDate2 = () => {
let data2 = state.tableData7;
data2.map((value) => {
@@ -2632,6 +2748,7 @@ export default defineComponent({
state.tableData = data2;
};
getTableDate2();
// 渲染开课操作
const getTableDate3 = () => {
let datas = state.tableData6;
datas.map((value) => {
@@ -2641,7 +2758,14 @@ export default defineComponent({
<div class="operation">
<div class="nSelect">
<div class="nselect">
<div class="jc">签到</div>
<div
class="jc"
onClick={() => {
state.QR_hs = true;
}}
>
签到
</div>
<div class="jc">编辑</div>
<div
class="jc"
@@ -2663,19 +2787,38 @@ export default defineComponent({
label="复制"
style="padding-left:35px"
>
<div>复制</div>
<div
onClick={() => {
state.copy_hs = true;
}}
>
复制
</div>
</a-select-option>
<a-select-option
value="取消"
label="取消"
value="删除"
label="删除"
style="padding-left:35px"
>
<div
onClick={() => {
console.log("点击了");
state.delete_hs = true;
}}
>
取消
删除
</div>
</a-select-option>
<a-select-option
value="QR"
label="QR"
style="padding-left:35px"
>
<div
onClick={() => {
state.QR_hs = true;
}}
>
二维码
</div>
</a-select-option>
</a-select>
@@ -2689,6 +2832,7 @@ export default defineComponent({
state.tableData = datas;
};
getTableDate3();
//渲染学员管理结业状态
const getTableDate4 = () => {
let data2 = state.tableData7;
data2.map((value) => {
@@ -2749,6 +2893,40 @@ export default defineComponent({
state.tableData = data2;
};
getTableDate4();
//渲染列表是否停用
const getTableDate5 = () => {
let data2 = state.tableData1;
data2.map((value) => {
{
//单层项目
value.ynuse = (
<div class="ynuse">
<div class="nSelect">
{value.status === "审核未通过" ? (
<div
class="use"
onClick={() => {
state.nouse_hs = true;
}}
>
停用
</div>
) : (
<div></div>
)}
{value.status !== "审核未通过" ? (
<div class="use">启用</div>
) : (
<div></div>
)}
</div>
</div>
);
}
});
state.tableData = data2;
};
getTableDate5();
const options1 = ref([
{
value: "value1",
@@ -2860,6 +3038,15 @@ export default defineComponent({
const rejectstudy_exit = () => {
state.rejectstudy_hs = false;
};
const delete_exit = () => {
state.delete_hs = false;
};
const copy_exit = () => {
state.copy_hs = false;
};
const nouse_exit = () => {
state.nouse_hs = false;
};
const onSelectChange = (selectedRowKeys) => {
console.log("selectedRowKeys changed: ", selectedRowKeys);
state.selectedRowKeys = selectedRowKeys;
@@ -2868,6 +3055,20 @@ export default defineComponent({
const faceManageChange = (e) => {
state.faceManageTab = e;
};
const key = "updatable";
const openMessage = () => {
message.loading({
content: "Loading...",
key,
});
setTimeout(() => {
message.success({
content: "导出成功",
key,
duration: 2,
});
}, 1000);
};
return {
...toRefs(state),
@@ -2901,8 +3102,12 @@ export default defineComponent({
graduate_exit,
agreestudy_exit,
rejectstudy_exit,
delete_exit,
copy_exit,
nouse_exit,
onSelectChange,
faceManageChange,
openMessage,
};
},
});
@@ -2941,8 +3146,8 @@ export default defineComponent({
}
.btns {
display: flex;
// flex-wrap: wrap;
margin-left: 38px;
cursor: pointer;
.btn {
padding: 0px 26px 0px 26px;
height: 38px;
@@ -2983,7 +3188,7 @@ export default defineComponent({
.search {
width: 17px;
height: 18px;
background-image: url("../../assets/images/courseManage/add1.png");
background-image: url("../../assets/images/coursewareManage/export.png");
}
}
.btn4 {
@@ -3015,7 +3220,7 @@ export default defineComponent({
.btn3:hover {
background: rgba(64, 158, 255, 1);
.search {
background-image: url("../../assets/images/courseManage/add0.png");
background-image: url("../../assets/images/coursewareManage/export1.png");
}
.btnText {
color: #ffffff;
@@ -3056,6 +3261,14 @@ export default defineComponent({
justify-content: right;
}
}
.ynuse {
display: flex;
justify-content: center;
align-items: center;
.use {
cursor: pointer;
}
}
}
}
.selectonlineface {
@@ -3368,6 +3581,7 @@ export default defineComponent({
}
.qrm_body {
width: 100%;
margin-bottom: 32px;
.QR_img {
width: 176px;
height: 176px;
@@ -3375,35 +3589,24 @@ export default defineComponent({
background-color: red;
}
}
.qrm_btnbox {
.qrm_footer {
display: flex;
margin: 30px auto;
justify-content: center;
.qrm_btn {
width: 100px;
height: 40px;
background: rgba(64, 158, 255, 0);
border-radius: 8px;
align-items: center;
margin-bottom: 44px;
.qrmbtn {
width: 80px;
height: 32px;
display: flex;
align-items: center;
line-height: 32px;
justify-content: center;
margin-right: 14px;
flex-shrink: 0;
border-radius: 4px;
border: 1px solid #387df7;
margin-left: 16px;
cursor: pointer;
.btnText {
font-size: 14px;
font-weight: 400;
line-height: 40px;
.btntext {
color: #387df7;
}
}
.btn1 {
border: 1px solid rgba(64, 158, 255, 1);
color: #4ea6ff;
}
.btn2 {
background-color: #4ea6ff;
color: #ffffff;
}
}
}
}
@@ -3690,7 +3893,6 @@ export default defineComponent({
display: flex;
align-items: center;
justify-content: center;
margin-right: 14px;
flex-shrink: 0;
cursor: pointer;
.btnText {
@@ -3702,6 +3904,7 @@ export default defineComponent({
.btn1 {
border: 1px solid rgba(64, 158, 255, 1);
color: #4ea6ff;
margin-right: 14px;
}
.btn2 {
background-color: #4ea6ff;
@@ -3778,6 +3981,7 @@ export default defineComponent({
}
.bm_btn {
display: flex;
cursor: pointer;
.btn {
padding: 0px 26px 0px 26px;
height: 40px;
@@ -3912,16 +4116,16 @@ export default defineComponent({
align-items: center;
margin-bottom: 5px;
cursor: pointer;
.addimg{
.addimg {
position: relative;
.heng{
.heng {
position: absolute;
top: 50px;
left: 25px;
width: 50px;
border: 1px solid #4ea6ff;
}
.shu{
.shu {
position: absolute;
top: 25px;
left: 50px;
@@ -4005,8 +4209,8 @@ export default defineComponent({
left: 395px;
bottom: 10px;
}
}
}
}
.mbl_items12 {
width: 440px;
margin-left: 100px;
@@ -4020,7 +4224,7 @@ export default defineComponent({
.file_img {
width: 27px;
height: 32px;
background-color: red;
background-image: url(@/assets/images/coursewareManage/imgs.png);
margin-right: 22px;
}
.file_detail {
@@ -4380,6 +4584,55 @@ export default defineComponent({
}
}
}
.notable{
width:100%;
height:100%;
display: flex;
justify-content: center;
.notablebox{
width: 412px;
height:212px;
background:linear-gradient(180deg, #FEF3DD 0%, #FFFAF0 100%);
border-radius: 10px;
display: flex;
justify-content: center;
text-align: center;
margin-top:77px;
margin-bottom:109px;
cursor: pointer;
position: relative;
.smallleft{
position: absolute;
top:18px;
left:0px;
width:8px;
height:21px;
border-radius: 0px 4px 4px 0px;
background-color:#FFB64E;
}
.smallright{
position: absolute;
bottom:18px;
right:0px;
width:8px;
height:21px;
border-radius: 4px 0px 0px 4px;
background-color:#FFB64E;
}
.boxbody{
.boximg{
width: 72px;
height:72px;
margin:32px auto 20px auto;
background-image: url(@/assets/images/coursewareManage/nostate.png);
background-size: 100% 100%;
}
.boxtitle{
margin-bottom:4px;
}
}
}
}
.stm_table {
width: 90%;
margin: 30px auto;
@@ -4675,4 +4928,97 @@ export default defineComponent({
}
}
}
.DelModal {
.ant-modal {
.ant-modal-content {
width: 424px !important;
.ant-modal-body {
.delete {
z-index: 999;
width: 424px;
background: #ffffff;
box-shadow: 0px 1px 35px 0px rgba(118, 136, 166, 0.21);
border-radius: 4px;
position: absolute;
left: 50%;
top: 10%;
transform: translate(-50%, -50%);
.del_header {
position: absolute;
width: calc(100%);
height: 40px;
background: linear-gradient(
rgba(78, 166, 255, 0.2) 0%,
rgba(78, 166, 255, 0) 100%
);
}
.del_main {
width: 100%;
position: relative;
.header {
display: flex;
align-items: center;
padding-top: 20px;
padding-left: 26px;
font-size: 16px;
.icon {
width: 16px;
height: 16px;
margin-right: 10px;
background-image: url(@/assets/images/coursewareManage/QR.png);
background-size: 100% 100%;
}
.close_exit {
position: absolute;
right: 42px;
cursor: pointer;
width: 20px;
height: 20px;
background-image: url(@/assets/images/coursewareManage/close.png);
background-size: 100% 100%;
}
}
.body {
width: 100%;
margin: 34px auto 56px auto;
display: flex;
justify-content: center;
align-items: center;
}
.del_btnbox {
display: flex;
margin: 30px auto;
justify-content: center;
.del_btn {
width: 100px;
height: 40px;
background: rgba(64, 158, 255, 0);
border-radius: 8px;
display: flex;
align-items: center;
justify-content: center;
margin-right: 14px;
flex-shrink: 0;
cursor: pointer;
.btnText {
font-size: 14px;
font-weight: 400;
line-height: 40px;
}
}
.btn1 {
border: 1px solid rgba(64, 158, 255, 1);
color: #4ea6ff;
}
.btn2 {
background-color: #4ea6ff;
color: #ffffff;
}
}
}
}
}
}
}
}
</style>

772
src/views/learningpath/LearningPath.vue
View File

@@ -71,7 +71,7 @@
:data-source="tableData"
:loading="tableDataTotal === -1 ? true : false"
expandRowByClick="true"
:scroll="{ x: 1600 }"
:scroll="{ x: 1550 }"
@expand="expandTable"
:pagination="false"
/>
@@ -90,6 +90,7 @@
<!-- 表格 -->
<!-- 创建路径弹窗 -->
<a-modal
:closable="sh"
centered="true"
@@ -175,6 +176,228 @@
</div>
</div></a-modal
>
<!-- 发布弹窗 -->
<a-modal
v-model:visible="pub"
:title="null"
:footer="null"
:closable="false"
wrapClassName="pub"
width="679px"
height="437px"
>
<div
class="modalHeader"
style="
width: 100%;
height: 68px;
display: flex;
align-items: center;
justify-content: space-between;
"
>
<div class="headerLeft" style="margin-left: 32px">
<span style="width: 15px; height: 15px"
><img src="../../assets/images/taskpage/pub.png"
/></span>
<span
class="headerLeftText"
style="font-size: 16px; margin-left: 10px"
>路径发布</span
>
</div>
<div style="cursor: pointer; margin-right: 32px" @click="closePub">
<img
style="width: 22px; height: 22px"
src="../../assets/images/basicinfo/close22.png"
/>
</div>
</div>
<div class="modalMain">
<div class="projectname">产品经理上升路径</div>
<div class="projecttime">
<span class="timeti">路径时间：</span
><span class="timeme">2022/08/01-2022/08/30</span>
</div>
<div class="projectbox">
<div class="promessage">
<div class="messageme">路径信息</div>
<div class="messagege">当前路径共0个阶段，0个任务</div>
</div>
<div class="stumessage">
<div class="messageme1">学员信息</div>
<div class="messagege1">路径共0名学员</div>
</div>
</div>
<div class="send">
<a-switch v-model:checked="checked" size="small" />
<span class="sendtext">发送路径通知</span>
</div>
<div class="ckb">
<a-checkbox v-model:checked="checkedTeacher"
><span class="sendpeo">发给老师</span></a-checkbox
>
<a-checkbox v-model:checked="checkStu"
><span class="sendpeo">发给学员</span></a-checkbox
>
</div>
<div class="pubtn">
<a-button class="pubtn1" @click="closeModal">取消</a-button>
<a-button class="pubtn2" @click="closeModal">发布</a-button>
</div>
</div>
</a-modal>
<!-- 复制路径弹窗 -->
<a-modal
v-model:visible="copyModal"
:footer="null"
:closable="closeCopy"
wrapClassName="CopyModal"
centered="true"
>
<div class="delete">
<div class="del_header"></div>
<div class="del_main">
<div class="header">
<div class="icon"></div>
<span>提示</span>
<div class="close_exit" @click="closeCopyModal"></div>
</div>
<div class="body">
<span>您确定要复制此路径吗</span>
</div>
<div class="del_btnbox">
<div class="del_btn btn1">
<div class="btnText" @click="delete_exit">取消</div>
</div>
<div class="del_btn btn2">
<div class="btnText" @click="delete_exit">确定</div>
</div>
</div>
</div>
</div>
</a-modal>
<!-- 停用路径弹窗 -->
<a-modal
v-model:visible="stopModal"
:footer="null"
:closable="closeStop"
wrapClassName="CopyModal"
centered="true"
>
<div class="delete">
<div class="del_header"></div>
<div class="del_main">
<div class="header">
<div class="icon"></div>
<span>提示</span>
<div class="close_exit" @click="closeStopModal"></div>
</div>
<div class="body">
<span>您确定要停用此路径吗</span>
</div>
<div class="del_btnbox">
<div class="del_btn btn1">
<div class="btnText" @click="delete_exit">取消</div>
</div>
<div class="del_btn btn2">
<div class="btnText" @click="delete_exit">确定</div>
</div>
</div>
</div>
</div>
</a-modal>
<!-- 删除路径弹窗 -->
<a-modal
v-model:visible="deleteModal"
:footer="null"
:closable="closeDelete"
wrapClassName="CopyModal"
centered="true"
>
<div class="delete">
<div class="del_header"></div>
<div class="del_main">
<div class="header">
<div class="icon"></div>
<span>提示</span>
<div class="close_exit" @click="closeDeleteModal"></div>
</div>
<div class="body">
<span>您确定要删除此路径吗</span>
</div>
<div class="del_btnbox">
<div class="del_btn btn1">
<div class="btnText" @click="delete_exit">取消</div>
</div>
<div class="del_btn btn2">
<div class="btnText" @click="delete_exit">确定</div>
</div>
</div>
</div>
</div>
</a-modal>
<!-- 启用路径弹窗 -->
<a-modal
v-model:visible="startModal"
:footer="null"
:closable="closeStart"
wrapClassName="CopyModal"
centered="true"
>
<div class="delete">
<div class="del_header"></div>
<div class="del_main">
<div class="header">
<div class="icon"></div>
<span>提示</span>
<div class="close_exit" @click="closeStartModal"></div>
</div>
<div class="body">
<span>您确定要启用此路径吗</span>
</div>
<div class="del_btnbox">
<div class="del_btn btn1">
<div class="btnText" @click="delete_exit">取消</div>
</div>
<div class="del_btn btn2">
<div class="btnText" @click="delete_exit">确定</div>
</div>
</div>
</div>
</div>
</a-modal>
<!-- 撤回路径弹窗 -->
<a-modal
v-model:visible="backModal"
:footer="null"
:closable="closeBack"
wrapClassName="CopyModal"
centered="true"
>
<div class="delete">
<div class="del_header"></div>
<div class="del_main">
<div class="header">
<div class="icon"></div>
<span>提示</span>
<div class="close_exit" @click="closeBackModal"></div>
</div>
<div class="body">
<span>是否撤回路径</span>
<div class="back">（路径撤回后学员进度保留，发布后可继续学习）</div>
</div>
<div class="del_btnbox">
<div class="del_btn btn1">
<div class="btnText" @click="delete_exit">取消</div>
</div>
<div class="del_btn btn2">
<div class="btnText" @click="delete_exit">确定</div>
</div>
</div>
</div>
</div>
</a-modal>
</div>
</template>
<script>
@@ -337,6 +560,20 @@ export default {
},
],
learnPathBg: null, //选择的路径图背景
pub: false, //发布弹窗
checked: false, //发布弹窗switch
checkedTeacher: false, //发布弹窗勾选
checkStu: false, //发布弹窗勾选
copyModal: false, //复制弹窗
closeCopy: false, //复制弹窗关闭图标
stopModal: false, //停用弹窗
closeStop: false, //停用弹窗关闭图标
deleteModal: false, //删除弹窗
closeDelete: false, //删除弹窗关闭图标
startModal: false, //启用弹窗
closeStart: false, //启用弹窗关闭图标
backModal: false, //撤回弹窗
closeBack: false, //撤回弹窗关闭图标
currentPage: 1,
tableDataTotal: 100,
pageSize: 10,
@@ -427,6 +664,42 @@ export default {
console.log(id);
state.learnPathBg = id;
};
const showPub = () => {
state.pub = true;
};
const closePub = () => {
state.pub = false;
};
const showCopyModal = () => {
state.copyModal = true;
};
const closeCopyModal = () => {
state.copyModal = false;
};
const showStopModal = () => {
state.stopModal = true;
};
const closeStopModal = () => {
state.stopModal = false;
};
const showDeleteModal = () => {
state.deleteModal = true;
};
const closeDeleteModal = () => {
state.deleteModal = false;
};
const showStartModal = () => {
state.startModal = true;
};
const closeStartModal = () => {
state.startModal = false;
};
const showBackModal = () => {
state.backModal = true;
};
const closeBackModal = () => {
state.backModal = false;
};
const getTableDate = () => {
let data = state.tableData;
data.map((value) => {
@@ -437,7 +710,15 @@ export default {
<div class="nSelect">
{value.state === "草稿" ? (
<div class="fb">
<div class="jc">发布</div>
<div
style="cursor:pointer"
class="jc"
onClick={() => {
showPub();
}}
>
发布
</div>
<div class="jc">编辑</div>
</div>
) : (
@@ -452,7 +733,15 @@ export default {
)}
{value.state === "已停用" ? (
<div class="fb">
<div class="jc">复制</div>
<div
style="cursor:pointer"
class="jc"
onClick={() => {
showCopyModal();
}}
>
复制
</div>
</div>
) : (
<div></div>
@@ -488,33 +777,140 @@ export default {
<div>管理权</div>
</a-select-option>
</a-select>
<a-select
style="width: 50px;margin-top:2px;margin-left:25px"
value="更多"
// options={state.projectNameList}
dropdownClassName="tabledropdown"
>
<a-select-option
value="复制"
label="复制"
style="padding-left:35px"
>
<div>复制</div>
</a-select-option>
<a-select-option
value="取消"
label="取消"
style="padding-left:35px"
>
<div
onClick={() => {
console.log("点击了");
}}
</div>
<div class="tableSelect">
{value.state === "草稿" ? (
<div>
<a-select
style="width: 50px;margin-top:2px;margin-right:20px;"
value="更多"
// options={state.projectNameList}
dropdownClassName="tabledropdown"
>
取消
</div>
</a-select-option>
</a-select>
<a-select-option
value="复制"
label="复制"
style="padding-left:35px"
>
<div
onClick={() => {
showCopyModal();
}}
>
复制
</div>
</a-select-option>
<a-select-option
value="停用"
label="停用"
style="padding-left:35px"
>
<div
onClick={() => {
showStopModal();
}}
>
停用
</div>
</a-select-option>
<a-select-option
value="删除"
label="删除"
style="padding-left:35px"
>
<div
onClick={() => {
showDeleteModal();
}}
>
删除
</div>
</a-select-option>
</a-select>
</div>
) : (
<div></div>
)}
{value.state === "已发布" ? (
<div>
<a-select
style="width: 50px;margin-top:2px;margin-right:20px;"
value="更多"
// options={state.projectNameList}
dropdownClassName="tabledropdown"
>
<a-select-option
value="复制"
label="复制"
style="padding-left:35px"
>
<div
onClick={() => {
showCopyModal();
}}
>
复制
</div>
</a-select-option>
<a-select-option
value="撤回"
label="撤回"
style="padding-left:35px"
>
<div
onClick={() => {
showBackModal();
}}
>
撤回
</div>
</a-select-option>
</a-select>
</div>
) : (
<div></div>
)}
{value.state === "已停用" ? (
<div>
<a-select
style="width: 50px;margin-top:2px;margin-right:20px;"
value="更多"
// options={state.projectNameList}
dropdownClassName="tabledropdown"
>
<a-select-option
value="启用"
label="启用"
style="padding-left:35px"
>
<div
onClick={() => {
showStartModal();
}}
>
启用
</div>
</a-select-option>
<a-select-option
value="删除"
label="删除"
style="padding-left:35px"
>
<div
onClick={() => {
showDeleteModal();
}}
>
删除
</div>
</a-select-option>
</a-select>
</div>
) : (
<div></div>
)}
</div>
</div>
);
@@ -528,6 +924,18 @@ export default {
selectProjectName,
expandTable,
handleOut,
showPub,
closePub,
showCopyModal,
closeCopyModal,
showStopModal,
closeStopModal,
showDeleteModal,
closeDeleteModal,
showStartModal,
closeStartModal,
showBackModal,
closeBackModal,
tableDataFunc,
chooseImg,
};
@@ -724,6 +1132,253 @@ export default {
}
}
}
.pub {
.ant-modal {
.ant-modal-body {
padding: 0;
.modalHeader {
background: linear-gradient(
rgba(78, 166, 255, 0.2) 0%,
rgba(78, 166, 255, 0) 100%
);
}
.modalMain {
.projectname {
color: rgba(79, 81, 86, 1);
font-size: 14px;
line-height: 36px;
margin-left: 62px;
font-weight: 500;
}
.projecttime {
margin-left: 221px;
.timeti {
color: rgba(153, 155, 163, 1);
font-size: 14px;
line-height: 36px;
}
.timeme {
color: rgba(79, 81, 86, 1);
font-size: 14px;
line-height: 36px;
}
}
.projectbox {
margin-top: 26px;
display: flex;
justify-content: center;
.promessage {
width: 280px;
height: 110px;
background: linear-gradient(
180deg,
rgba(254, 243, 221, 1),
rgba(255, 250, 240, 1)
);
border-radius: 10px;
margin-right: 7px;
.messageme {
color: rgba(255, 182, 78, 1);
font-size: 14px;
line-height: 36px;
margin-top: 17px;
margin-left: 30px;
}
.messagege {
color: rgba(153, 155, 163, 1);
font-size: 14px;
margin-left: 30px;
}
}
.stumessage {
width: 280px;
height: 110px;
background: linear-gradient(
180deg,
rgba(221, 234, 255, 1),
rgba(240, 248, 254, 1)
);
border-radius: 10px;
.messageme1 {
color: rgba(78, 166, 255, 1);
font-size: 14px;
line-height: 36px;
margin-top: 17px;
margin-left: 30px;
}
.messagege1 {
color: rgba(153, 155, 163, 1);
font-size: 14px;
margin-left: 30px;
}
}
}
.send {
margin-top: 30px;
margin-left: 61px;
.sendtext {
margin-left: 11px;
color: rgba(109, 117, 132, 1);
font-size: 14px;
}
}
.ckb {
margin-top: 20px;
margin-left: 62px;
.sendpeo {
color: rgba(109, 117, 132, 1);
font-size: 14px;
}
.ant-checkbox-inner {
border-radius: 4px;
}
}
.pubtn {
display: flex;
justify-content: center;
margin-top: 25px;
//margin-bottom: 29px;
.pubtn1 {
width: 100px;
height: 40px;
margin-right: 16px;
margin-bottom: 29px;
border: 1px solid #409eff;
border-radius: 4px;
color: rgba(78, 166, 255, 1);
font-size: 14px;
//line-height: 36px;
align-items: center;
background: rgba(255, 255, 255, 1);
}
.pubtn2 {
width: 100px;
height: 40px;
margin-bottom: 29px;
border: 1px solid #409eff;
border-radius: 4px;
color: #ffffff;
font-size: 14px;
align-items: center;
//line-height: 36px;
background: #409eff;
}
}
}
}
}
}
.CopyModal {
.ant-modal {
width: 424px !important;
height: 258px !important;
.ant-modal-content {
width: 424px !important;
height: 258px !important;
.ant-modal-body {
width: 424px !important;
height: 258px !important;
padding: 0 !important;
.delete {
z-index: 999;
width: 424px;
height: 258px;
background: #ffffff;
box-shadow: 0px 1px 35px 0px rgba(118, 136, 166, 0.21);
border-radius: 4px;
// position: absolute;
// left: 50%;
// top: 10%;
// transform: translate(-50%, -50%);
.del_header {
position: absolute;
width: calc(100%);
height: 40px;
background: linear-gradient(
rgba(78, 166, 255, 0.2) 0%,
rgba(78, 166, 255, 0) 100%
);
}
.del_main {
width: 100%;
position: relative;
.header {
display: flex;
align-items: center;
padding-top: 20px;
padding-left: 26px;
font-size: 16px;
.icon {
width: 16px;
height: 16px;
margin-right: 10px;
background-image: url(@/assets/images/coursewareManage/QR.png);
background-size: 100% 100%;
}
.close_exit {
position: absolute;
right: 42px;
cursor: pointer;
width: 20px;
height: 20px;
background-image: url(@/assets/images/coursewareManage/close.png);
background-size: 100% 100%;
}
}
.body {
width: 100%;
margin: 34px auto 56px auto;
display: flex;
justify-content: center;
align-items: center;
flex-direction: column;
// background-color: red;
position: relative;
.back {
position: absolute;
top: 30px;
font-size: 12px;
font-weight: 400;
color: #666666;
}
}
.del_btnbox {
display: flex;
margin: 30px auto;
justify-content: center;
.del_btn {
width: 100px;
height: 40px;
background: rgba(64, 158, 255, 0);
border-radius: 8px;
display: flex;
align-items: center;
justify-content: center;
flex-shrink: 0;
cursor: pointer;
.btnText {
font-size: 14px;
font-weight: 400;
line-height: 40px;
}
}
.btn1 {
border: 1px solid rgba(64, 158, 255, 1);
color: #4ea6ff;
margin-right: 14px;
}
.btn2 {
background-color: #4ea6ff;
color: #ffffff;
}
}
}
}
}
}
}
}
.learningPath {
width: 100%;
height: 100%;
@@ -852,78 +1507,27 @@ export default {
.nSelect {
.fb {
display: flex;
white-space: nowrap;
.jc {
color: #4ea6ff;
font-size: 14px;
margin-left: 20px;
white-space: nowrap;
}
}
}
.tableSelect {
margin-right: 20px;
// margin-right: 20px;
display: flex;
align-items: center;
justify-content: right;
white-space: nowrap;
.g1 {
color: #4ea6ff;
font-size: 14px;
}
}
}
// .operation {
// font-size: 14px;
// font-weight: 400;
// color: #4ea6ff;
// // line-height: 36px;
// .operation1 {
// margin-left: 21px;
// width: 28px;
// display: inline-block;
// }
// .operation3 {
// margin-left: 21px;
// width: 70px;
// display: inline-block;
// text-align: center;
// }
// .more {
// width: 50px;
// display: inline-block;
// margin-left: 21px;
// position: relative;
// text-align: left;
// // z-index: 99999;
// .moreArrow {
// width: 13px;
// height: 7px;
// display: inline-block;
// background-image: url("../../assets/images/navtop/down.png");
// background-size: 100%;
// margin: 2px;
// margin-left: 7px;
// }
// .moreItems {
// width: 80px;
// padding: 5px;
// display: none;
// background: #ffffff;
// box-shadow: 2px 3px 9px 3px rgba(0, 0, 0, 0.05);
// border-radius: 3px;
// border: 0px solid #dcdcdc;
// position: absolute;
// left: 0px;
// top: 28px;
// z-index: 100;
// text-align: center;
// }
// }
// .more:hover .moreArrow {
// background-image: url("../../assets/images/navtop/up.png");
// }
// .more:hover .moreItems {
// display: block;
// }
// }
.unout {
display: none;

15
src/views/projectcenter/TaskPage.vue
View File

@@ -1080,11 +1080,6 @@
display: flex;
align-items: center;
justify-content: space-between;
background: linear-gradient(
0deg,
rgba(78, 166, 255, 0) 0%,
rgba(78, 166, 255, 0.2) 100%
);
"
>
<div class="headerLeft" style="margin-left: 32px">
@@ -1499,7 +1494,9 @@ export default {
require("../../assets/images/taskpage/one.png") +
")",
}}
>fewfwe</div>
>
fewfwe
</div>
);
} else if (text.record.rank == "2") {
return <div>ggg</div>;
@@ -1783,6 +1780,12 @@ export default {
.pubproject {
.ant-modal {
.ant-modal-body {
.modalHeader {
background: linear-gradient(
rgba(78, 166, 255, 0.2) 0%,
rgba(78, 166, 255, 0) 100%
);
}
padding: 0;
.modalHeader {
background: linear-gradient(