mirror of
https://codeup.aliyun.com/67762337eccfc218f6110e0e/vue/fe-manage.git
synced 2025-12-11 20:06:47 +08:00
1174 lines
35 KiB
Vue
1174 lines
35 KiB
Vue
<template>
|
||
<div class="addwrapper">
|
||
<div class="addhead">
|
||
<div class="leftimg">
|
||
<img class="img" src="../../assets/images/projectadd/picture.png" />
|
||
</div>
|
||
<div class="imgfor">
|
||
<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>
|
||
</div>
|
||
<div class="right">
|
||
<img class="img1" src="../../assets/images/leveladd/ma.png" />
|
||
<div class="line"></div>
|
||
<img class="img2" src="../../assets/images/projectadd/ending.png" />
|
||
<div class="pub">结束项目</div>
|
||
<div class="line"></div>
|
||
<img
|
||
style="margin-right: 15px"
|
||
class="img2"
|
||
src="../../assets/images/leveladd/more.png"
|
||
/>
|
||
<div class="more">
|
||
<span style="color: #7096e3; cursor: pointer">更多</span>
|
||
<div class="moreArrow"></div>
|
||
<div class="moreItems">
|
||
<div class="sammo">撤回</div>
|
||
<div class="sammo">复制</div>
|
||
</div>
|
||
</div>
|
||
<div class="line"></div>
|
||
<router-link to="/templatelibrary"
|
||
><div style="display: flex">
|
||
<img class="img2" src="../../assets/images/leveladd/back.png" />
|
||
<div class="return">返回</div>
|
||
</div></router-link
|
||
>
|
||
</div>
|
||
</div>
|
||
<div class="split"></div>
|
||
<div class="bom clearfix">
|
||
<a-tabs
|
||
class="tab"
|
||
v-model:activeKey="activeKey"
|
||
size="large"
|
||
:tabBarStyle="{ marginLeft: '10px' }"
|
||
>
|
||
<a-tab-pane key="1" tab="任务">
|
||
<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" />
|
||
<div class="ntc_body">
|
||
<div class="ntc_switch">
|
||
<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' }"
|
||
>
|
||
<span>开启</span>
|
||
</div>
|
||
</div>
|
||
<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
|
||
/>
|
||
<div class="btnarea">
|
||
<div> </div>
|
||
<div class="area_btn">
|
||
<div class="pub"></div>
|
||
<div class="btnText">发布</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</a-tab-pane>
|
||
<a-tab-pane key="3" tab="项目积分">
|
||
<div class="projectscore">
|
||
<div class="pjc_tit">
|
||
<span>获取规则</span>
|
||
</div>
|
||
<hr color="#E8E8E8" />
|
||
<div class="pjc_body">
|
||
<div class="pjcb_header">
|
||
<span>规则</span>
|
||
<div class="edit_btn">
|
||
<div class="edit"></div>
|
||
<div class="btnText">编辑</div>
|
||
</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>
|
||
</div>
|
||
</div>
|
||
</a-tab-pane>
|
||
<a-tab-pane key="4" tab="设置">
|
||
<div class="setting">
|
||
<div class="set_tit">
|
||
<span>基本信息</span>
|
||
</div>
|
||
<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>
|
||
</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="" />
|
||
</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
|
||
>
|
||
</div>
|
||
</div>
|
||
<div class="set_content">
|
||
<div class="setc_name"><span>项目经理：</span></div>
|
||
<div class="setc_main">
|
||
<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>
|
||
</div>
|
||
</div>
|
||
<div class="set_content">
|
||
<div class="setc_name"><span>项目说明：</span></div>
|
||
<div class="setc_main">
|
||
<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
|
||
>
|
||
</div>
|
||
</div>
|
||
<div class="set_content">
|
||
<div class="setc_name"><span>项目级别：</span></div>
|
||
<div class="setc_main">
|
||
<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>
|
||
</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
|
||
>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</a-tab-pane>
|
||
</a-tabs>
|
||
<a-modal
|
||
style="padding: 0"
|
||
:closable="sh"
|
||
v-model:visible="visible"
|
||
:footer="null"
|
||
centered="true"
|
||
>
|
||
<div class="con">
|
||
<div class="header">
|
||
<div class="inhe">
|
||
<div class="mod"></div>
|
||
<div class="tz">调整关卡</div>
|
||
<div class="mg"></div>
|
||
</div>
|
||
</div>
|
||
<div class="mid">
|
||
<div class="inher">
|
||
<div class="cur">当前关卡：</div>
|
||
<div class="select">
|
||
<a-select
|
||
v-model:value="projectName"
|
||
style="width: 100%"
|
||
placeholder="请选择关卡"
|
||
:options="projectNameList4"
|
||
@change="selectProjectName4"
|
||
allowClear
|
||
showSearch
|
||
></a-select>
|
||
</div>
|
||
<div class="btn">
|
||
<button class="sameb btn1">取消</button>
|
||
<button class="sameb btn2">确定</button>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div></a-modal
|
||
>
|
||
</div>
|
||
</div>
|
||
</template>
|
||
|
||
<script>
|
||
import { ref, reactive, defineComponent, toRefs } from "vue";
|
||
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,
|
||
});
|
||
const value = ref("");
|
||
const value2 = ref("");
|
||
const textnum = "150";
|
||
const changeopclo = () => {
|
||
state.hideshow = !state.hideshow;
|
||
};
|
||
const changecheck2 = () => {
|
||
state.checked2 = !state.checked2;
|
||
};
|
||
const changecheck3 = () => {
|
||
state.checked3 = !state.checked3;
|
||
};
|
||
return {
|
||
...toRefs(state),
|
||
value,
|
||
value2,
|
||
textnum,
|
||
changeopclo,
|
||
changecheck2,
|
||
changecheck3,
|
||
};
|
||
},
|
||
});
|
||
</script>
|
||
<style lang="scss" scoped>
|
||
.clearfix:before,
|
||
.clearfix:after {
|
||
content: " ";
|
||
display: block;
|
||
clear: both;
|
||
}
|
||
|
||
.addwrapper {
|
||
width: 100%;
|
||
height: 100%;
|
||
// background-color: green;
|
||
.addhead {
|
||
width: 100%;
|
||
height: 130px;
|
||
// background-color: lightgreen;
|
||
display: flex;
|
||
align-items: center;
|
||
position: relative;
|
||
.leftimg {
|
||
width: 151px;
|
||
height: 100px;
|
||
border: 10px solid #e7f2ff;
|
||
border-radius: 8px;
|
||
margin-left: 20px;
|
||
.img {
|
||
width: 100%;
|
||
height: 100%;
|
||
}
|
||
}
|
||
.imgfor {
|
||
margin-left: 32px;
|
||
color: #333333;
|
||
.forz {
|
||
font-size: 16px;
|
||
font-weight: 500;
|
||
}
|
||
.fort {
|
||
font-weight: 400;
|
||
font-size: 14px;
|
||
margin-top: 20px;
|
||
}
|
||
}
|
||
@media screen and (max-width: 1030px) {
|
||
.imgfor {
|
||
margin-left: 20px;
|
||
}
|
||
}
|
||
.right {
|
||
// width: 500px;
|
||
height: 100%;
|
||
// background-color: red;
|
||
position: absolute;
|
||
right: 0;
|
||
display: flex;
|
||
align-items: center;
|
||
.img1 {
|
||
width: 24px;
|
||
height: 24px;
|
||
margin-right: 50px;
|
||
}
|
||
.line {
|
||
height: 65%;
|
||
width: 1px;
|
||
background-color: #e8effa;
|
||
margin-right: 28px;
|
||
}
|
||
.img2 {
|
||
width: 42px;
|
||
height: 42px;
|
||
margin-right: 22px;
|
||
}
|
||
.pub {
|
||
// color: #ffb64e;
|
||
color: #65a4f8;
|
||
font-size: 14px;
|
||
margin-top: 5px;
|
||
margin-right: 30px;
|
||
cursor: pointer;
|
||
}
|
||
.return {
|
||
color: #4ea6ff;
|
||
font-size: 14px;
|
||
margin-top: 10px;
|
||
margin-right: 60px;
|
||
}
|
||
.more {
|
||
color: #7895dd;
|
||
position: relative;
|
||
margin-right: 30px;
|
||
height: 30px;
|
||
display: flex;
|
||
align-items: center;
|
||
.moreArrow {
|
||
width: 13px;
|
||
height: 7px;
|
||
display: inline-block;
|
||
background-image: url("../../assets/images/navtop/down.png");
|
||
background-size: 100%;
|
||
margin: 2px;
|
||
margin-left: 15px;
|
||
}
|
||
.moreItems {
|
||
width: 110px;
|
||
height: 80px;
|
||
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: -48px;
|
||
top: 30px;
|
||
z-index: 100;
|
||
cursor: pointer;
|
||
.sammo {
|
||
text-align: center;
|
||
margin-top: 12px;
|
||
cursor: pointer;
|
||
}
|
||
.sammo:hover {
|
||
color: #4ea6ff;
|
||
}
|
||
}
|
||
.moreItems:hover {
|
||
display: block;
|
||
}
|
||
}
|
||
@media screen and (max-width: 1240px) {
|
||
.line {
|
||
margin-right: 10px;
|
||
}
|
||
.img1 {
|
||
margin-right: 15px;
|
||
}
|
||
.img2 {
|
||
margin-right: 10px;
|
||
}
|
||
.return {
|
||
margin-right: 10px;
|
||
}
|
||
.pub {
|
||
margin-right: 10px;
|
||
}
|
||
.more {
|
||
margin-right: 10px;
|
||
}
|
||
}
|
||
.more:hover .moreArrow {
|
||
background-image: url("../../assets/images/navtop/up.png");
|
||
}
|
||
.more:hover .moreItems {
|
||
display: block;
|
||
}
|
||
}
|
||
}
|
||
.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;
|
||
}
|
||
.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;
|
||
}
|
||
.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;
|
||
}
|
||
|
||
.ant-collapse-content > .ant-collapse-content-box {
|
||
padding-top: 0px;
|
||
padding-bottom: 0px;
|
||
}
|
||
.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 {
|
||
display: flex;
|
||
margin: 32px 0px;
|
||
.opclo {
|
||
margin-left: 9px;
|
||
}
|
||
}
|
||
.ntc_content {
|
||
.ntcc_tit {
|
||
margin-bottom: 16px;
|
||
}
|
||
.textarea {
|
||
display: flex;
|
||
flex-direction: column;
|
||
.btnarea {
|
||
display: flex;
|
||
justify-content: flex-end;
|
||
}
|
||
.area_btn {
|
||
width: 100px;
|
||
// padding: 0px 26px 0px 26px;
|
||
height: 38px;
|
||
margin-top: 24px;
|
||
background: rgb(64, 158, 255);
|
||
border-radius: 8px;
|
||
border: 1px solid rgba(64, 158, 255, 1);
|
||
display: flex;
|
||
align-items: center;
|
||
justify-content: center;
|
||
flex-shrink: 0;
|
||
cursor: pointer;
|
||
.pub {
|
||
width: 15px;
|
||
height: 15px;
|
||
background-image: url(@/assets/images/coursewareManage/export1.png);
|
||
background-size: 100% 100%;
|
||
}
|
||
.btnText {
|
||
font-size: 14px;
|
||
font-weight: 400;
|
||
color: rgb(255, 255, 255);
|
||
line-height: 36px;
|
||
margin-left: 5px;
|
||
}
|
||
}
|
||
}
|
||
}
|
||
}
|
||
}
|
||
|
||
.projectscore {
|
||
.pjc_tit {
|
||
margin-left: 34px;
|
||
font-size: 18px;
|
||
font-weight: 500;
|
||
color: #232425;
|
||
}
|
||
.pjc_body {
|
||
margin-left: 34px;
|
||
margin-right: 34px;
|
||
.pjcb_header {
|
||
display: flex;
|
||
justify-content: space-between;
|
||
align-items: center;
|
||
margin: 24px auto;
|
||
.edit_btn {
|
||
width: 100px;
|
||
// padding: 0px 26px 0px 26px;
|
||
height: 38px;
|
||
background: rgb(64, 158, 255);
|
||
border-radius: 8px;
|
||
border: 1px solid rgba(64, 158, 255, 1);
|
||
display: flex;
|
||
align-items: center;
|
||
justify-content: center;
|
||
flex-shrink: 0;
|
||
cursor: pointer;
|
||
.edit {
|
||
width: 15px;
|
||
height: 15px;
|
||
background-image: url(@/assets/images/coursewareManage/export1.png);
|
||
background-size: 100% 100%;
|
||
}
|
||
.btnText {
|
||
font-size: 14px;
|
||
font-weight: 400;
|
||
color: rgb(255, 255, 255);
|
||
line-height: 36px;
|
||
margin-left: 5px;
|
||
}
|
||
}
|
||
}
|
||
.pjcb_content {
|
||
border: 1px solid #388be1;
|
||
padding: 32px;
|
||
.pjcb_content :last-child {
|
||
margin-bottom: 0px;
|
||
}
|
||
.content {
|
||
margin-bottom: 24px;
|
||
}
|
||
}
|
||
}
|
||
}
|
||
|
||
.setting {
|
||
.set_tit {
|
||
margin-left: 34px;
|
||
font-size: 18px;
|
||
font-weight: 500;
|
||
color: #232425;
|
||
}
|
||
.set_body {
|
||
margin-left: 34px;
|
||
margin-right: 34px;
|
||
.set_content {
|
||
margin: 32px auto;
|
||
display: flex;
|
||
// justify-content: end;
|
||
.setc_name {
|
||
width: 150px;
|
||
display: flex;
|
||
justify-content: end;
|
||
}
|
||
.setc_main {
|
||
flex: 1;
|
||
margin-left: 12px;
|
||
}
|
||
}
|
||
}
|
||
}
|
||
}
|
||
}
|
||
</style> |