mirror of
https://codeup.aliyun.com/67762337eccfc218f6110e0e/vue/fe-manage.git
synced 2025-12-12 12:26:47 +08:00
feat:taskAdd无数据样式 模板库任务大纲（差一点样式没找到）
This commit is contained in:
dongwug
@@ -8,7 +8,9 @@
|
||||
<div class="forz">管理者进阶-腾飞班1备份</div>
|
||||
<div class="fort">
|
||||
<div class="fort1">项目经理：黄华、刘俊备份</div>
|
||||
<div class="fort2">起止时间：2022-09-21 00:00 至 2022-10-21 00:00</div>
|
||||
<div class="fort2">
|
||||
起止时间：2022-09-21 00:00 至 2022-10-21 00:00
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="right">
|
||||
@@ -48,29 +50,259 @@
|
||||
:tabBarStyle="{ marginLeft: '10px' }"
|
||||
>
|
||||
<a-tab-pane key="1" tab="任务">
|
||||
1
|
||||
<div class="taskBox" style="flex: 1">
|
||||
<div class="split"></div>
|
||||
<div class="onerow">
|
||||
<div class="taskmain">任务大纲</div>
|
||||
<button class="btn" @click="showFaceIn">批量面授报名</button>
|
||||
<router-link to="/taskadd" class="edit">
|
||||
<img
|
||||
class="editimg"
|
||||
src="../../assets/images/projectadd/edit.png"
|
||||
/>
|
||||
<span class="editext">编辑</span>
|
||||
</router-link>
|
||||
</div>
|
||||
<!-- <div class="taskSyllabus">
|
||||
<a-collapse v-model:activeKey="taskSyllabusActive" accordion>
|
||||
<template #expandIcon="{ isActive }">
|
||||
<img
|
||||
class="editimg"
|
||||
src="../../assets/images/projectadd/edit.png"
|
||||
/>
|
||||
<span class="editext">编辑</span>
|
||||
</router-link>
|
||||
</div> -->
|
||||
<div class="taskSyllabus">
|
||||
<a-collapse v-model:activeKey="taskSyllabusActive" accordion>
|
||||
<template #expandIcon="{ isActive }">
|
||||
<img
|
||||
:style="{
|
||||
width: isActive ? 9.1 : 8.1,
|
||||
height: isActive ? 8.1 : 9.1,
|
||||
'margin-right': isActive ? '12px' : '13px',
|
||||
}"
|
||||
:src="
|
||||
isActive
|
||||
? require('../../assets/images/projectadd/open.png')
|
||||
: require('../../assets/images/projectadd/close.png')
|
||||
"
|
||||
/>
|
||||
<div></div>
|
||||
</template>
|
||||
<a-collapse-panel
|
||||
v-for="(value, index) in taskSyllabus"
|
||||
:key="index"
|
||||
:header="value.text"
|
||||
>
|
||||
<div
|
||||
class="course"
|
||||
v-for="(item, key) in value.children"
|
||||
:key="key"
|
||||
>
|
||||
<!-- :style="{width:item.course==='在线'?'28px':
|
||||
height:item.course==='在线'?'27px':}" -->
|
||||
<div class="first">
|
||||
<div class="icon">
|
||||
<div
|
||||
style="
|
||||
width: 31px;
|
||||
height: 28px;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
"
|
||||
>
|
||||
<img
|
||||
:src="
|
||||
item.course === '在线'
|
||||
? require('../../assets/images/leveladd/zai.png')
|
||||
: item.course === '面授'
|
||||
? require('../../assets/images/leveladd/mian.png')
|
||||
: item.course === '案例'
|
||||
? require('../../assets/images/leveladd/an.png')
|
||||
: item.course === '作业'
|
||||
? require('../../assets/images/leveladd/zuo.png')
|
||||
: item.course === '考试'
|
||||
? require('../../assets/images/leveladd/kao.png')
|
||||
: item.course === '直播'
|
||||
? require('../../assets/images/leveladd/zhi.png')
|
||||
: item.course === '外链'
|
||||
? require('../../assets/images/leveladd/wai.png')
|
||||
: item.course === '讨论'
|
||||
? require('../../assets/images/leveladd/tao.png')
|
||||
: item.course === '活动'
|
||||
? require('../../assets/images/leveladd/huo.png')
|
||||
: item.course === '测评'
|
||||
? require('../../assets/images/leveladd/ce.png')
|
||||
: item.course === '调研'
|
||||
? require('../../assets/images/leveladd/diao.png')
|
||||
: item.course === '投票'
|
||||
? require('../../assets/images/leveladd/tou.png')
|
||||
: null
|
||||
"
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
<div>
|
||||
<div class="iconame">「{{ item.course }}」</div>
|
||||
<div class="icontext">{{ item.name }}</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="type">
|
||||
<div
|
||||
:class="
|
||||
item.classify == '必修' ? 'typename1' : 'typename'
|
||||
"
|
||||
>
|
||||
{{ item.classify }}
|
||||
</div>
|
||||
</div>
|
||||
<div class="time">
|
||||
<div class="timetext">开始时间</div>
|
||||
<div class="timetext">{{ item.beginTime }}</div>
|
||||
</div>
|
||||
<div class="progress">
|
||||
<div class="progresstext">
|
||||
{{ item.complete }}/{{ item.total }}人
|
||||
</div>
|
||||
<div style="display: flex">
|
||||
<a-progress
|
||||
:showInfo="false"
|
||||
:percent="item.percent"
|
||||
strokeColor="#FFC067"
|
||||
trailColor="rgba(253, 209, 98, 0.2)"
|
||||
/>
|
||||
<span class="progresstext" style="margin-left: 10px"
|
||||
>{{ item.percent }}%</span
|
||||
>
|
||||
</div>
|
||||
</div>
|
||||
<div class="operations">
|
||||
<div
|
||||
class="operation"
|
||||
style="cursor: pointer"
|
||||
:style="{
|
||||
display: item.course === '面授' ? 'flex' : 'none',
|
||||
}"
|
||||
@click="showFS"
|
||||
>
|
||||
学员
|
||||
</div>
|
||||
<div
|
||||
class="operation"
|
||||
style="cursor: pointer"
|
||||
@click="showAA"
|
||||
:style="{
|
||||
display:
|
||||
item.course === '直播' || item.course === '活动'
|
||||
? 'flex'
|
||||
: 'none',
|
||||
}"
|
||||
>
|
||||
考勤
|
||||
</div>
|
||||
<div
|
||||
class="operation"
|
||||
style="cursor: pointer"
|
||||
:style="{
|
||||
display:
|
||||
item.course === '直播' ||
|
||||
item.course === '活动' ||
|
||||
item.course === '面授'
|
||||
? 'flex'
|
||||
: 'none',
|
||||
}"
|
||||
>
|
||||
二维码
|
||||
</div>
|
||||
<div
|
||||
class="operation"
|
||||
style="cursor: pointer; margin-right: 35px"
|
||||
@click="
|
||||
item.course === '在线' ||
|
||||
item.course === '案例' ||
|
||||
item.course === '外链' ||
|
||||
item.course === '讨论' ||
|
||||
item.course === '直播' ||
|
||||
item.course === '调研' ||
|
||||
item.course === '投票' ||
|
||||
item.course === '活动'
|
||||
? showTime(item.course, item.name)
|
||||
: item.course === '考试' || item.course === '测评'
|
||||
? showTest(item.course, item.name)
|
||||
: item.course === '面授'
|
||||
? showFace(item.course)
|
||||
: item.course === '作业'
|
||||
? showWork(item.course)
|
||||
: null
|
||||
"
|
||||
>
|
||||
管理
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</a-collapse-panel>
|
||||
</a-collapse>
|
||||
<!-- 无数据创建任务 -->
|
||||
<div
|
||||
class="taskbox"
|
||||
style="
|
||||
background: linear-gradient(180deg, #ddeaff, #f0f8fe);
|
||||
display: none;
|
||||
"
|
||||
>
|
||||
<div class="leftt">
|
||||
<img src="../../assets/images/taskpage/left2.png" />
|
||||
</div>
|
||||
<div class="photo">
|
||||
<img src="../../assets/images/taskpage/picture8.png" />
|
||||
</div>
|
||||
<div class="rightt">
|
||||
<img src="../../assets/images/taskpage/right2.png" />
|
||||
</div>
|
||||
<div class="centerbox" style="color: rgba(78, 166, 255, 1)">
|
||||
创建任务
|
||||
</div>
|
||||
<div class="centermain">点击创建项目任务</div>
|
||||
</div>
|
||||
<!-- 无数据创建任务 -->
|
||||
</div>
|
||||
<div style="display: flex; height: 20px"></div>
|
||||
</div>
|
||||
</a-tab-pane>
|
||||
<a-tab-pane key="2" tab="公告" force-render>
|
||||
<div class="notice">
|
||||
<div class="ntc_tit"><span>公告</span></div>
|
||||
<hr color="#E8E8E8"/>
|
||||
<hr color="#E8E8E8" />
|
||||
<div class="ntc_body">
|
||||
<div class="ntc_switch">
|
||||
<a-switch v-model:checked="checked" @click="changeopclo"/>
|
||||
<div class="opclo"
|
||||
:style="{ display: hideshow ? 'block' : 'none' }">
|
||||
<a-switch v-model:checked="checked" @click="changeopclo" />
|
||||
<div
|
||||
class="opclo"
|
||||
:style="{ display: hideshow ? 'block' : 'none' }"
|
||||
>
|
||||
<span>关闭</span>
|
||||
</div>
|
||||
<div class="opclo"
|
||||
:style="{ display: hideshow ? 'none' : 'block' }">
|
||||
<div
|
||||
class="opclo"
|
||||
:style="{ display: hideshow ? 'none' : 'block' }"
|
||||
>
|
||||
<span>开启</span>
|
||||
</div>
|
||||
</div>
|
||||
<div class="ntc_content"
|
||||
:style="{ display: hideshow ? 'block' : 'none' }">
|
||||
<div
|
||||
class="ntc_content"
|
||||
:style="{ display: hideshow ? 'block' : 'none' }"
|
||||
>
|
||||
<div class="ntcc_tit">公告内容</div>
|
||||
<div class="textarea">
|
||||
<a-textarea v-model:value="value2" placeholder="公告信息最多输入150个字。" :maxlength="textnum" allow-clear />
|
||||
<a-textarea
|
||||
v-model:value="value2"
|
||||
placeholder="公告信息最多输入150个字。"
|
||||
:maxlength="textnum"
|
||||
allow-clear
|
||||
/>
|
||||
<div class="btnarea">
|
||||
<div> </div>
|
||||
<div class="area_btn">
|
||||
@@ -88,7 +320,7 @@
|
||||
<div class="pjc_tit">
|
||||
<span>获取规则</span>
|
||||
</div>
|
||||
<hr color="#E8E8E8"/>
|
||||
<hr color="#E8E8E8" />
|
||||
<div class="pjc_body">
|
||||
<div class="pjcb_header">
|
||||
<span>规则</span>
|
||||
@@ -98,9 +330,15 @@
|
||||
</div>
|
||||
</div>
|
||||
<div class="pjcb_content">
|
||||
<div class="content content1"><span>当前设计下，学员可以获得 10 积分</span></div>
|
||||
<div class="content content2"><span>完成【必修/选修】获得 5 积分</span></div>
|
||||
<div class="content content3"><span>优秀学员可获得 5 积分</span></div>
|
||||
<div class="content content1">
|
||||
<span>当前设计下，学员可以获得 10 积分</span>
|
||||
</div>
|
||||
<div class="content content2">
|
||||
<span>完成【必修/选修】获得 5 积分</span>
|
||||
</div>
|
||||
<div class="content content3">
|
||||
<span>优秀学员可获得 5 积分</span>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
@@ -110,66 +348,74 @@
|
||||
<div class="set_tit">
|
||||
<span>基本信息</span>
|
||||
</div>
|
||||
<hr color="#E8E8E8"/>
|
||||
<hr color="#E8E8E8" />
|
||||
<div class="set_body">
|
||||
<div class="set_content">
|
||||
<div class="setc_name"><span>项目名称：</span></div>
|
||||
<div class="setc_main">
|
||||
<span style="color:#999999;">管理者进阶 - 管理者腾飞班</span>
|
||||
<span style="color: #999999">管理者进阶 - 管理者腾飞班</span>
|
||||
</div>
|
||||
</div>
|
||||
<div class="set_content">
|
||||
<div class="setc_name"><span>封面图：</span></div>
|
||||
<div class="setc_main">
|
||||
<img src="@/assets/images/projectadd/picture.png" alt="">
|
||||
<img src="@/assets/images/projectadd/picture.png" alt="" />
|
||||
</div>
|
||||
</div>
|
||||
<div class="set_content">
|
||||
<div class="setc_name"><span>项目时间：</span></div>
|
||||
<div class="setc_main">
|
||||
<span style="color:#999999;">2022-7-16 12:30 ～ 2022-7-30 12:30</span>
|
||||
<span style="color: #999999"
|
||||
>2022-7-16 12:30 ～ 2022-7-30 12:30</span
|
||||
>
|
||||
</div>
|
||||
</div>
|
||||
<div class="set_content">
|
||||
<div class="setc_name"><span>项目经理：</span></div>
|
||||
<div class="setc_main">
|
||||
<span style="color:#999999;">张雪</span>
|
||||
<span style="color: #999999">张雪</span>
|
||||
</div>
|
||||
</div>
|
||||
<div class="set_content">
|
||||
<div class="setc_name"><span>资源归属：</span></div>
|
||||
<div class="setc_main">
|
||||
<span style="color:#999999;">-</span>
|
||||
<span style="color: #999999">-</span>
|
||||
</div>
|
||||
</div>
|
||||
<div class="set_content">
|
||||
<div class="setc_name"><span>项目说明：</span></div>
|
||||
<div class="setc_main">
|
||||
<span style="color:#999999;">-</span>
|
||||
<span style="color: #999999">-</span>
|
||||
</div>
|
||||
</div>
|
||||
<div class="set_content">
|
||||
<div class="setc_name"><span>同步学习记录：</span></div>
|
||||
<div class="setc_main" @click="changecheck2">
|
||||
<a-radio v-model:checked="checked2"><span style="color:#333333">同步课程学习记录（如学员在课程库中拥有课程的学习记录，自动免修该课程）</span></a-radio>
|
||||
<a-radio v-model:checked="checked2"
|
||||
><span style="color: #333333"
|
||||
>同步课程学习记录（如学员在课程库中拥有课程的学习记录，自动免修该课程）</span
|
||||
></a-radio
|
||||
>
|
||||
</div>
|
||||
</div>
|
||||
<div class="set_content">
|
||||
<div class="setc_name"><span>项目级别：</span></div>
|
||||
<div class="setc_main">
|
||||
<span style="color:#999999;">-</span>
|
||||
<span style="color: #999999">-</span>
|
||||
</div>
|
||||
</div>
|
||||
<div class="set_content">
|
||||
<div class="setc_name"><span>培训体系：</span></div>
|
||||
<div class="setc_main">
|
||||
<span style="color:#999999;">-</span>
|
||||
<span style="color: #999999">-</span>
|
||||
</div>
|
||||
</div>
|
||||
<div class="set_content">
|
||||
<div class="setc_name"><span>是否BOEU实施：</span></div>
|
||||
<div class="setc_main" @click="changecheck3">
|
||||
<a-radio v-model:checked="checked3"><span style="color:#333333">BOEU实施</span></a-radio>
|
||||
<a-radio v-model:checked="checked3"
|
||||
><span style="color: #333333">BOEU实施</span></a-radio
|
||||
>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
@@ -223,27 +469,153 @@ export default defineComponent({
|
||||
name: "LibraryAdd",
|
||||
setup() {
|
||||
const state = reactive({
|
||||
//任务大纲列表
|
||||
taskSyllabus: [
|
||||
{
|
||||
text: "阶段1腾飞班阶段1",
|
||||
children: [
|
||||
{
|
||||
course: "在线",
|
||||
name: "时间管理",
|
||||
classify: "选修",
|
||||
beginTime: "2022-09-10 14:03",
|
||||
total: 50, //总人数
|
||||
complete: 20, //完成人数
|
||||
percent: 40,
|
||||
},
|
||||
{
|
||||
course: "直播",
|
||||
name: "管理直播间",
|
||||
classify: "必修",
|
||||
beginTime: "2022-09-12 14:03",
|
||||
total: 50, //总人数
|
||||
complete: 10, //完成人数
|
||||
percent: 20,
|
||||
},
|
||||
{
|
||||
course: "面授",
|
||||
name: "管理面授课",
|
||||
classify: "必修",
|
||||
beginTime: "2022-09-16 14:03",
|
||||
total: 80, //总人数
|
||||
complete: 0, //完成人数
|
||||
percent: 0,
|
||||
},
|
||||
{
|
||||
course: "活动",
|
||||
name: "管理活动",
|
||||
classify: "必修",
|
||||
beginTime: "2022-09-16 14:03",
|
||||
total: 50, //总人数
|
||||
complete: 40, //完成人数
|
||||
percent: 80,
|
||||
},
|
||||
{
|
||||
course: "作业",
|
||||
name: "管理者作业",
|
||||
classify: "选修",
|
||||
beginTime: "2022-09-16 14:03",
|
||||
total: 50, //总人数
|
||||
complete: 30, //完成人数
|
||||
percent: 60,
|
||||
},
|
||||
{
|
||||
course: "考试",
|
||||
name: "管理者考试",
|
||||
classify: "必修",
|
||||
beginTime: "2022-09-16 14:03",
|
||||
total: 50, //总人数
|
||||
complete: 50, //完成人数
|
||||
percent: 100,
|
||||
},
|
||||
{
|
||||
course: "案例",
|
||||
name: "管理直播间",
|
||||
classify: "必修",
|
||||
beginTime: "2022-09-16 14:03",
|
||||
total: 50, //总人数
|
||||
complete: 10, //完成人数
|
||||
percent: 20,
|
||||
},
|
||||
{
|
||||
course: "外链",
|
||||
name: "管理直播间",
|
||||
classify: "必修",
|
||||
beginTime: "2022-09-16 14:03",
|
||||
total: 50, //总人数
|
||||
complete: 10, //完成人数
|
||||
percent: 20,
|
||||
},
|
||||
],
|
||||
},
|
||||
{
|
||||
text: "阶段2腾飞班阶段2",
|
||||
children: [
|
||||
{
|
||||
course: "讨论",
|
||||
name: "时间管理",
|
||||
classify: "选修",
|
||||
beginTime: "2022-09-16 14:03",
|
||||
total: 50, //总人数
|
||||
complete: 20, //完成人数
|
||||
percent: 40,
|
||||
},
|
||||
{
|
||||
course: "测评",
|
||||
name: "管理直播间",
|
||||
classify: "必修",
|
||||
beginTime: "2022-09-16 14:03",
|
||||
total: 50, //总人数
|
||||
complete: 10, //完成人数
|
||||
percent: 20,
|
||||
},
|
||||
{
|
||||
course: "调研",
|
||||
name: "管理直播间",
|
||||
classify: "必修",
|
||||
beginTime: "2022-09-16 14:03",
|
||||
total: 50, //总人数
|
||||
complete: 10, //完成人数
|
||||
percent: 20,
|
||||
},
|
||||
{
|
||||
course: "投票",
|
||||
name: "管理直播间",
|
||||
classify: "必修",
|
||||
beginTime: "2022-09-16 14:03",
|
||||
total: 50, //总人数
|
||||
complete: 10, //完成人数
|
||||
percent: 20,
|
||||
},
|
||||
],
|
||||
},
|
||||
],
|
||||
taskSyllabusActive: 0,
|
||||
//在线管理等页面传递参数
|
||||
showTimeText: "",
|
||||
//考试、测评页面传递参数
|
||||
showTestText: "",
|
||||
activeKey: ref("1"),
|
||||
// value: ref(" "),
|
||||
checked: false,
|
||||
checked2: false,
|
||||
checked3: false,
|
||||
value3:false,
|
||||
value4:false,
|
||||
hideshow:false,
|
||||
value3: false,
|
||||
value4: false,
|
||||
hideshow: false,
|
||||
});
|
||||
const value = ref('');
|
||||
const value2 = ref('');
|
||||
const textnum = '150'
|
||||
const value = ref("");
|
||||
const value2 = ref("");
|
||||
const textnum = "150";
|
||||
const changeopclo = () => {
|
||||
state.hideshow = !state.hideshow
|
||||
}
|
||||
state.hideshow = !state.hideshow;
|
||||
};
|
||||
const changecheck2 = () => {
|
||||
state.checked2 = !state.checked2
|
||||
}
|
||||
state.checked2 = !state.checked2;
|
||||
};
|
||||
const changecheck3 = () => {
|
||||
state.checked3 = !state.checked3
|
||||
}
|
||||
state.checked3 = !state.checked3;
|
||||
};
|
||||
return {
|
||||
...toRefs(state),
|
||||
value,
|
||||
@@ -254,8 +626,7 @@ export default defineComponent({
|
||||
changecheck3,
|
||||
};
|
||||
},
|
||||
})
|
||||
|
||||
});
|
||||
</script>
|
||||
<style lang="scss" scoped>
|
||||
.clearfix:before,
|
||||
@@ -331,7 +702,7 @@ export default defineComponent({
|
||||
}
|
||||
.pub {
|
||||
// color: #ffb64e;
|
||||
color: #65A4F8;
|
||||
color: #65a4f8;
|
||||
font-size: 14px;
|
||||
margin-top: 5px;
|
||||
margin-right: 30px;
|
||||
@@ -344,7 +715,7 @@ export default defineComponent({
|
||||
margin-right: 60px;
|
||||
}
|
||||
.more {
|
||||
color: #7895DD;
|
||||
color: #7895dd;
|
||||
position: relative;
|
||||
margin-right: 30px;
|
||||
height: 30px;
|
||||
@@ -413,51 +784,279 @@ export default defineComponent({
|
||||
}
|
||||
}
|
||||
}
|
||||
.bom {
|
||||
.ant-tabs-top > .ant-tabs-nav::before,
|
||||
.ant-tabs-bottom > .ant-tabs-nav::before,
|
||||
.ant-tabs-top > div > .ant-tabs-nav::before,
|
||||
.ant-tabs-bottom > div > .ant-tabs-nav::before {
|
||||
border-bottom: 0px;
|
||||
}
|
||||
.ant-tabs-nav-wrap {
|
||||
margin-left: 30px;
|
||||
margin-top: 10px;
|
||||
}
|
||||
|
||||
.taskBox {
|
||||
.split {
|
||||
width: 100%;
|
||||
height: 20px;
|
||||
background-color: #edf0f5;
|
||||
}
|
||||
.bom {
|
||||
.tab {
|
||||
margin-top: 10px;
|
||||
// margin-left: 10px;
|
||||
.onerow {
|
||||
//width: 100%;
|
||||
display: flex;
|
||||
height: 40px;
|
||||
position: relative;
|
||||
margin-top: 15px;
|
||||
margin-left: 38px;
|
||||
//margin-right: 38px;
|
||||
.taskmain {
|
||||
font-size: 18px;
|
||||
padding-top: 7px;
|
||||
color: #000000;
|
||||
}
|
||||
.ant-tabs > .ant-tabs-nav,
|
||||
.ant-tabs > div > .ant-tabs-nav {
|
||||
margin-left: 0px !important;
|
||||
padding-left: 32px !important;
|
||||
.btn {
|
||||
position: absolute;
|
||||
top: 0;
|
||||
right: 168px;
|
||||
background-color: #409eff;
|
||||
width: 130px;
|
||||
height: 40px;
|
||||
border-radius: 8px;
|
||||
border: 1px solid #409eff;
|
||||
color: #ffffff;
|
||||
cursor: pointer;
|
||||
}
|
||||
.edit {
|
||||
position: absolute;
|
||||
right: 38px;
|
||||
top: 0;
|
||||
color: #409eff;
|
||||
width: 100px;
|
||||
height: 40px;
|
||||
border: 1px solid #409eff;
|
||||
border-radius: 8px;
|
||||
.editimg {
|
||||
width: 15px;
|
||||
height: 15px;
|
||||
margin-top: -2px;
|
||||
margin-left: 25px;
|
||||
margin-right: 5px;
|
||||
}
|
||||
.editext {
|
||||
line-height: 40px;
|
||||
}
|
||||
}
|
||||
.edit:hover {
|
||||
color: #ffffff;
|
||||
background-color: #409eff;
|
||||
cursor: pointer;
|
||||
.editimg {
|
||||
background-image: url("../../assets/images/projectadd/edit1.png");
|
||||
}
|
||||
}
|
||||
}
|
||||
.taskSyllabus {
|
||||
// flex: 1;
|
||||
overflow-x: scroll;
|
||||
|
||||
.ant-collapse {
|
||||
border: 0px;
|
||||
background-color: rgba(255, 255, 255, 0);
|
||||
min-width: 1040px;
|
||||
}
|
||||
|
||||
.notice{
|
||||
.ntc_tit{
|
||||
margin-left: 34px;
|
||||
font-size:18px;
|
||||
font-weight: 500;
|
||||
color:#232425;
|
||||
.ant-collapse-content > .ant-collapse-content-box {
|
||||
padding-top: 0px;
|
||||
padding-bottom: 0px;
|
||||
}
|
||||
.ntc_body{
|
||||
.ant-collapse > .ant-collapse-item {
|
||||
border: 0px;
|
||||
}
|
||||
.ant-collapse-header {
|
||||
display: flex;
|
||||
height: 49px;
|
||||
background-color: #fcf0ef;
|
||||
align-items: center;
|
||||
margin-top: 20px;
|
||||
margin-left: 38px;
|
||||
margin-right: 40px;
|
||||
font-size: 16px;
|
||||
font-weight: 400;
|
||||
color: #409eff;
|
||||
line-height: 36px;
|
||||
.ant-collapse-arrow {
|
||||
margin-left: 15px !important;
|
||||
}
|
||||
}
|
||||
.ant-collapse-content {
|
||||
border-top: 0px;
|
||||
}
|
||||
}
|
||||
.course {
|
||||
//width: 100%;
|
||||
flex-shrink: 0;
|
||||
margin-right: 24px;
|
||||
|
||||
display: flex;
|
||||
flex-wrap: wrap;
|
||||
align-items: center;
|
||||
padding: 25px 0px;
|
||||
margin-left: 22px;
|
||||
|
||||
//margin: 0 12px;
|
||||
border: 1px solid #f2f6fc;
|
||||
border-top: 0px;
|
||||
.first {
|
||||
//position: relative;
|
||||
display: flex;
|
||||
flex-grow: 1;
|
||||
align-items: center;
|
||||
//height: 71px;
|
||||
margin-left: 12px;
|
||||
margin-right: 50px;
|
||||
|
||||
.iconame {
|
||||
//position: absolute;
|
||||
color: #4f5156;
|
||||
font-size: 16px;
|
||||
margin-left: 4px;
|
||||
}
|
||||
.icontext {
|
||||
//positipn: absolute;
|
||||
color: #999ba3;
|
||||
font-size: 14px;
|
||||
margin-left: 12px;
|
||||
width: 83px;
|
||||
}
|
||||
}
|
||||
.type {
|
||||
//height: 71px;
|
||||
display: flex;
|
||||
flex-grow: 1;
|
||||
align-items: center;
|
||||
margin-right: 50px;
|
||||
.typename {
|
||||
width: 63px;
|
||||
height: 23px;
|
||||
color: #5dc988;
|
||||
font-size: 14px;
|
||||
background-color: #f2f6fc;
|
||||
border-radius: 4px;
|
||||
text-align: center;
|
||||
}
|
||||
.typename1 {
|
||||
width: 63px;
|
||||
height: 23px;
|
||||
color: #f0f4fe;
|
||||
font-size: 14px;
|
||||
background-color: #5dc988;
|
||||
border-radius: 4px;
|
||||
text-align: center;
|
||||
}
|
||||
}
|
||||
.time {
|
||||
//height: 71px;
|
||||
flex-grow: 1;
|
||||
margin-right: 50px;
|
||||
.timetext {
|
||||
font-size: 14px;
|
||||
color: #999ba3;
|
||||
}
|
||||
}
|
||||
.progress {
|
||||
width: 168px;
|
||||
margin-left: 10px;
|
||||
margin-right: 50px;
|
||||
flex-grow: 1;
|
||||
.progresstext {
|
||||
color: #ffc067;
|
||||
font-size: 14px;
|
||||
}
|
||||
}
|
||||
.operations {
|
||||
display: flex;
|
||||
width: 200px;
|
||||
//flex-grow: 1;
|
||||
.operation {
|
||||
color: #4ea6ff;
|
||||
font-size: 14px;
|
||||
padding: 10px;
|
||||
margin-left: auto;
|
||||
}
|
||||
}
|
||||
}
|
||||
.taskbox {
|
||||
width: 412px;
|
||||
height: 160px;
|
||||
border-radius: 10px;
|
||||
position: relative;
|
||||
margin-left: 68px;
|
||||
margin-bottom: 40px;
|
||||
margin-top: 32px;
|
||||
cursor: pointer;
|
||||
.leftt {
|
||||
position: absolute;
|
||||
top: 18px;
|
||||
left: 0;
|
||||
}
|
||||
.photo {
|
||||
position: absolute;
|
||||
top: 42px;
|
||||
left: 37px;
|
||||
}
|
||||
.rightt {
|
||||
position: absolute;
|
||||
top: 69px;
|
||||
right: 26px;
|
||||
}
|
||||
.centerbox {
|
||||
position: absolute;
|
||||
top: 52px;
|
||||
left: 145px;
|
||||
font-size: 20px;
|
||||
font-weight: 700;
|
||||
//line-height: 36px;
|
||||
}
|
||||
.centermain {
|
||||
color: rgba(135, 139, 146, 1);
|
||||
font-size: 14px;
|
||||
position: absolute;
|
||||
left: 144px;
|
||||
bottom: 49px;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.notice {
|
||||
.ntc_tit {
|
||||
margin-left: 34px;
|
||||
font-size: 18px;
|
||||
font-weight: 500;
|
||||
color: #232425;
|
||||
}
|
||||
.ntc_body {
|
||||
margin-left: 34px;
|
||||
margin-right: 34px;
|
||||
.ntc_switch{
|
||||
.ntc_switch {
|
||||
display: flex;
|
||||
margin: 32px 0px;
|
||||
.opclo{
|
||||
.opclo {
|
||||
margin-left: 9px;
|
||||
}
|
||||
}
|
||||
.ntc_content{
|
||||
.ntcc_tit{
|
||||
.ntc_content {
|
||||
.ntcc_tit {
|
||||
margin-bottom: 16px;
|
||||
}
|
||||
.textarea{
|
||||
.textarea {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
.btnarea{
|
||||
.btnarea {
|
||||
display: flex;
|
||||
justify-content: flex-end;
|
||||
}
|
||||
.area_btn{
|
||||
.area_btn {
|
||||
width: 100px;
|
||||
// padding: 0px 26px 0px 26px;
|
||||
height: 38px;
|
||||
@@ -489,22 +1088,22 @@ export default defineComponent({
|
||||
}
|
||||
}
|
||||
|
||||
.projectscore{
|
||||
.pjc_tit{
|
||||
.projectscore {
|
||||
.pjc_tit {
|
||||
margin-left: 34px;
|
||||
font-size:18px;
|
||||
font-size: 18px;
|
||||
font-weight: 500;
|
||||
color:#232425;
|
||||
color: #232425;
|
||||
}
|
||||
.pjc_body{
|
||||
margin-left:34px;
|
||||
margin-right:34px;
|
||||
.pjcb_header{
|
||||
.pjc_body {
|
||||
margin-left: 34px;
|
||||
margin-right: 34px;
|
||||
.pjcb_header {
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
align-items: center;
|
||||
margin:24px auto;
|
||||
.edit_btn{
|
||||
margin: 24px auto;
|
||||
.edit_btn {
|
||||
width: 100px;
|
||||
// padding: 0px 26px 0px 26px;
|
||||
height: 38px;
|
||||
@@ -531,41 +1130,40 @@ export default defineComponent({
|
||||
}
|
||||
}
|
||||
}
|
||||
.pjcb_content{
|
||||
border: 1px solid #388BE1;
|
||||
.pjcb_content {
|
||||
border: 1px solid #388be1;
|
||||
padding: 32px;
|
||||
.pjcb_content :last-child{
|
||||
margin-bottom:0px;
|
||||
.pjcb_content :last-child {
|
||||
margin-bottom: 0px;
|
||||
}
|
||||
.content{
|
||||
margin-bottom:24px;
|
||||
.content {
|
||||
margin-bottom: 24px;
|
||||
}
|
||||
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.setting{
|
||||
.set_tit{
|
||||
.setting {
|
||||
.set_tit {
|
||||
margin-left: 34px;
|
||||
font-size:18px;
|
||||
font-size: 18px;
|
||||
font-weight: 500;
|
||||
color:#232425;
|
||||
color: #232425;
|
||||
}
|
||||
.set_body{
|
||||
margin-left:34px;
|
||||
margin-right:34px;
|
||||
.set_content{
|
||||
.set_body {
|
||||
margin-left: 34px;
|
||||
margin-right: 34px;
|
||||
.set_content {
|
||||
margin: 32px auto;
|
||||
display: flex;
|
||||
// justify-content: end;
|
||||
.setc_name{
|
||||
width:150px;
|
||||
.setc_name {
|
||||
width: 150px;
|
||||
display: flex;
|
||||
justify-content: end;
|
||||
}
|
||||
.setc_main{
|
||||
flex:1;
|
||||
.setc_main {
|
||||
flex: 1;
|
||||
margin-left: 12px;
|
||||
}
|
||||
}
|
||||
|
||||
@@ -252,6 +252,23 @@
|
||||
<span class="editext">批量删除</span>
|
||||
</div>
|
||||
</div>
|
||||
<!-- 无数据样式 -->
|
||||
<div class="notable" style="display:none;">
|
||||
<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="rwbox">
|
||||
<div class="talk">
|
||||
<img class="im" src="../../assets/images/leveladd/gan.png" />
|
||||
<div class="xu">
|
||||
@@ -293,6 +310,8 @@
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- 编辑在线侧弹窗 -->
|
||||
<div>
|
||||
<edit-online v-model:editonlineVisible="editonlinevisible" />
|
||||
@@ -1695,7 +1714,6 @@ export default {
|
||||
}
|
||||
}
|
||||
.boom {
|
||||
position: relative;
|
||||
width: 100%;
|
||||
flex: 1;
|
||||
background-color: #fff;
|
||||
@@ -1758,6 +1776,56 @@ export default {
|
||||
}
|
||||
}
|
||||
}
|
||||
.notable {
|
||||
width: 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;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
.rwbox {
|
||||
position: relative;
|
||||
.talk {
|
||||
margin-top: 24px;
|
||||
margin-bottom: 11px;
|
||||
@@ -1792,7 +1860,7 @@ export default {
|
||||
}
|
||||
}
|
||||
.tableBox {
|
||||
margin-bottom: 80px;
|
||||
padding-bottom: 80px;
|
||||
.classify {
|
||||
margin-left: 10px !important;
|
||||
padding-left: 9px !important;
|
||||
@@ -1830,6 +1898,7 @@ export default {
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
// .drawerbox {
|
||||
// // margin: 20px 38px 30px;
|
||||
// th.h {
|
||||
|
||||
@@ -211,22 +211,6 @@
|
||||
<a-tab-pane key="2" tab="任务" force-render>
|
||||
<div style="flex: 1">
|
||||
<div class="split"></div>
|
||||
<!-- 无数据样式 -->
|
||||
<div class="notable" style="display: none">
|
||||
<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="onerow">
|
||||
<div class="taskmain">任务大纲</div>
|
||||
<button class="btn" @click="showFaceIn">批量面授报名</button>
|
||||
@@ -2983,55 +2967,6 @@ export default {
|
||||
margin-left: 30px;
|
||||
margin-top: 10px;
|
||||
}
|
||||
.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;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
.onerow {
|
||||
//width: 100%;
|
||||
display: flex;
|
||||
|
||||
Reference in New Issue
Block a user