mirror of
https://codeup.aliyun.com/67762337eccfc218f6110e0e/vue/fe-manage.git
synced 2025-12-09 10:56:46 +08:00
1678 lines
50 KiB
Vue
1678 lines
50 KiB
Vue
<!-- 确定新建面授课弹窗 -->
|
||
<template>
|
||
<a-modal
|
||
v-model:visible="ft_hs"
|
||
title="Title"
|
||
:footer="null"
|
||
:closable="false"
|
||
wrapClassName="modalStyle facteachModal coursemodal"
|
||
width="80%"
|
||
@cancel="visibleClose"
|
||
@ok="handlePush"
|
||
>
|
||
<div class="modalHeader">
|
||
<div class="headerLeft">
|
||
<img
|
||
style="width: 17px; height: 18px; margin-right: 8px"
|
||
src="@/assets/images/basicinfo/add.png"
|
||
/>
|
||
<span v-if="ft_eidt" class="headerLeftText">编辑面授课</span>
|
||
<span v-else class="headerLeftText"></span>
|
||
</div>
|
||
<div style="margin-right: 57px; cursor: pointer">
|
||
<img
|
||
@click="noEditClose"
|
||
style="width: 22px; height: 22px"
|
||
src="@/assets/images/basicinfo/close22.png"
|
||
/>
|
||
</div>
|
||
</div>
|
||
<div class="modalMain">
|
||
<!-- 审核理由 -->
|
||
<div v-if="statusJuJue" class="statusJuJue">
|
||
<span>审核意见：</span>
|
||
<span>{{ auditDescription }}</span>
|
||
</div>
|
||
<div class="faceteach" :style="{ display: ft_hs ? 'block' : 'none' }">
|
||
<div class="ft_main">
|
||
<div class="m_title">课程信息</div>
|
||
<div class="m_body">
|
||
<div class="mb_left">
|
||
<div class="mbl_items">
|
||
<div class="item_nam">
|
||
<div class="asterisk_icon">
|
||
<img
|
||
src="@/assets/images/coursewareManage/asterisk.png"
|
||
alt="asterisk"
|
||
/>
|
||
</div>
|
||
<span style="margin-right: 14px">课程名称</span>
|
||
</div>
|
||
<div class="item_inp">
|
||
<div class="i1_input">
|
||
<NameInput
|
||
ref="inputRef"
|
||
placeholder="请输入课程名称"
|
||
v-model:value="qdms_inputV1"
|
||
v-model:validated="validated"
|
||
:maxlength="20"
|
||
show-count
|
||
:type="2"
|
||
:id="offcourseId"
|
||
></NameInput>
|
||
<!-- <a-input-->
|
||
<!-- v-model:value="qdms_inputV1"-->
|
||
<!-- maxlength="90"-->
|
||
<!-- style="width: 440px; height: 40px; border-radius: 8px"-->
|
||
<!-- placeholder="请输入课程名称"-->
|
||
<!-- />-->
|
||
<!-- <div class="inp_num">-->
|
||
<!-- <span style="color: #c7cbd2">-->
|
||
<!-- {{ qdms_inputV1.length }}/90-->
|
||
<!-- </span>-->
|
||
<!-- </div>-->
|
||
</div>
|
||
</div>
|
||
</div>
|
||
<div class="i2_cz">
|
||
<div class="i2_top">
|
||
<div class="i2_left">
|
||
<span style="color: #999ba3">课程命名规则</span>
|
||
</div>
|
||
<div
|
||
class="i2_right"
|
||
@click="hideShow"
|
||
style="cursor: pointer"
|
||
>
|
||
<div
|
||
class="b_zk"
|
||
:style="{ display: hideshow ? 'block' : 'none' }"
|
||
>
|
||
<span style="color: #4ea6ff">收起</span>
|
||
</div>
|
||
<div
|
||
class="b_sq"
|
||
:style="{ display: hideshow ? 'none' : 'block' }"
|
||
>
|
||
<span style="color: #4ea6ff">展开</span>
|
||
</div>
|
||
<div class="b_icon"></div>
|
||
</div>
|
||
</div>
|
||
<div
|
||
class="i2_detail"
|
||
:style="{ display: hideshow ? 'block' : 'none' }"
|
||
>
|
||
<span style="color: #999ba3">
|
||
1、课程名称统一不加书名号。<br />
|
||
2、项目名称、属地等信息如需体现在课程名称中，请放在课程名称信息
|
||
之后，如“时间管理（GROW180项目）”或“时间管理（B*）”确保首先
|
||
看到的是课程内容主题。<br />
|
||
3、同一课程如先后有多个版本，原则上仅开放最新版本，旧版本应停用
|
||
版本如必须以年份标明，请以“沟通技巧（2022年）”的方式呈现。
|
||
</span>
|
||
</div>
|
||
</div>
|
||
<div class="mbl_items2">
|
||
<div class="item_nam" style="margin-top: 8px">
|
||
<div class="asterisk_icon">
|
||
<img
|
||
src="@/assets/images/coursewareManage/asterisk.png"
|
||
alt=""
|
||
/>
|
||
</div>
|
||
<span style="margin-right: 14px">封面图</span>
|
||
</div>
|
||
<div class="item_inp">
|
||
<div
|
||
style="
|
||
width: 440px;
|
||
height: 100px;
|
||
display: flex;
|
||
justify-content: flex-start;
|
||
align-items: center;
|
||
"
|
||
>
|
||
<img
|
||
v-for="(item, index) in optionsUrl"
|
||
:key="index"
|
||
class="choiceoptionurl"
|
||
:style="{
|
||
border:
|
||
pathBgId === item.id
|
||
? '3px solid rgba(78, 166, 255, 1)'
|
||
: '1px solid #ccc',
|
||
display: index >= 3 ? 'none' : 'flex',
|
||
}"
|
||
:src="item.value"
|
||
:alt="item.name"
|
||
@click="chooseImg(item)"
|
||
/>
|
||
<div
|
||
@click="showLearnBgMore"
|
||
class="learnBgItem learnBgMore"
|
||
>
|
||
查看更多
|
||
<img src="../../assets/images/projectadd/go.png" />
|
||
</div>
|
||
</div>
|
||
|
||
<!-- <img
|
||
class="i_upload_img"
|
||
v-if="feng_mian_1"
|
||
:src="feng_mian_1"
|
||
style="width: 220px; height: 120px; border-radius: 8px"
|
||
alt="avatar"
|
||
/>
|
||
<div class="i_bottom">
|
||
<span style="color: #999ba3">
|
||
高宽比为16:9 (如:800*450) png或jpg图片
|
||
</span>
|
||
</div> -->
|
||
</div>
|
||
</div>
|
||
<div class="mbl_items">
|
||
<div class="item_nam" style="margin-bottom: 102px">
|
||
<div class="asterisk_icon">
|
||
<img
|
||
style="width: 10px; height: 10px"
|
||
src="@/assets/images/coursewareManage/asterisk.png"
|
||
alt=""
|
||
/>
|
||
</div>
|
||
<span style="margin-right: 14px">目标人群</span>
|
||
</div>
|
||
<div class="item_inp">
|
||
<div class="i1_input">
|
||
<!-- <a-input v-model:value="qdms_inputV2" maxlength="50"
|
||
style="width: 440px; height: 40px; border-radius: 8px" placeholder="请输入目标人群" />
|
||
<div class="inp_num">
|
||
<span style="color: #c7cbd2">
|
||
{{ qdms_inputV2.length }}/50
|
||
</span>
|
||
</div> -->
|
||
<div>
|
||
<OrgClassCheck
|
||
v-model:value="orgSelect"
|
||
v-model:name="orgSelectName"
|
||
></OrgClassCheck>
|
||
</div>
|
||
<div style="margin-top: 10px">
|
||
<a-select
|
||
v-model:value="selectJobId"
|
||
mode="multiple"
|
||
style="width: 440px; min-height: 40px"
|
||
placeholder="请选择岗位"
|
||
:options="jobType"
|
||
@change="handleChangeJob"
|
||
:fieldNames="{
|
||
key: 'id',
|
||
label: 'name',
|
||
value: 'id',
|
||
}"
|
||
></a-select>
|
||
</div>
|
||
<div style="margin-top: 10px">
|
||
<a-select
|
||
v-model:value="selectBandId"
|
||
mode="multiple"
|
||
style="width: 440px; min-height: 40px"
|
||
placeholder="请选择Band"
|
||
:options="bandList"
|
||
@change="handleChangeBand"
|
||
:fieldNames="{
|
||
key: 'id',
|
||
label: 'name',
|
||
value: 'id',
|
||
}"
|
||
></a-select>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
<div class="mbl_items">
|
||
<div class="item_nam">
|
||
<div class="asterisk_icon">
|
||
<img
|
||
src="@/assets/images/coursewareManage/asterisk.png"
|
||
alt="asterisk"
|
||
/>
|
||
</div>
|
||
<span style="margin-right: 14px">资源归属</span>
|
||
</div>
|
||
<div class="item_inp">
|
||
<div class="select i6_input" style="width: 440px">
|
||
<OrgClass
|
||
v-model:value="sourceBelongId"
|
||
v-model:name="sourceBelongName"
|
||
></OrgClass>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
<div class="mbl_items">
|
||
<div class="item_nam">
|
||
<div class="asterisk_icon">
|
||
<img
|
||
src="@/assets/images/coursewareManage/asterisk.png"
|
||
alt="asterisk"
|
||
/>
|
||
</div>
|
||
<span style="margin-right: 14px">内容分类</span>
|
||
</div>
|
||
<div class="item_inp">
|
||
<div class="select i6_input">
|
||
<a-tree-select
|
||
style="width: 440px"
|
||
placeholder="请选择内容分类"
|
||
:treeDefaultExpandAll="true"
|
||
:getPopupContainer="
|
||
(triggerNode) => triggerNode.parentNode || document.body
|
||
"
|
||
v-model:value="fen_lei"
|
||
:tree-data="sysTypeOptions"
|
||
:fieldNames="{
|
||
children: 'children',
|
||
label: 'name',
|
||
value: 'code',
|
||
}"
|
||
>
|
||
</a-tree-select>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
<div v-if="fen_lei" class="mbl_items">
|
||
<div class="item_nam">
|
||
<div class="asterisk_icon"></div>
|
||
<span style="margin-right: 14px"> </span>
|
||
</div>
|
||
<div class="item_inp">
|
||
<div class="select i6_input">
|
||
<div
|
||
style="
|
||
width: 440px;
|
||
height: 26px;
|
||
font-size: 14px;
|
||
color: rgb(153, 155, 163);
|
||
"
|
||
>
|
||
所属层级：{{ fen_lei1 }}
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
<div class="mbl_items">
|
||
<div class="item_nam" style="margin-bottom: 110px">
|
||
<span style="margin-right: 14px">课程价值</span>
|
||
</div>
|
||
<div class="item_inp">
|
||
<div class="i1_input">
|
||
<a-textarea
|
||
v-model:value="qdms_inputV3"
|
||
maxlength="200"
|
||
style="width: 440px; height: 140px; border-radius: 8px"
|
||
placeholder="请输入课程价值"
|
||
/>
|
||
<div class="inp_num" style="top: 110px">
|
||
<span style="color: #c7cbd2">
|
||
{{ qdms_inputV3.length }}/200
|
||
</span>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
|
||
<div class="mbl_items">
|
||
<div class="item_nam">
|
||
<span style="margin-right: 14px">场景</span>
|
||
</div>
|
||
<div class="item_inp">
|
||
<div class="i1_input">
|
||
<a-input
|
||
v-model:value="chang_jin"
|
||
maxlength="50"
|
||
style="width: 440px; height: 40px; border-radius: 8px"
|
||
placeholder="请输入场景"
|
||
/>
|
||
<div class="inp_num">
|
||
<span style="color: #c7cbd2">
|
||
{{ chang_jin.length }}/50
|
||
</span>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
<!-- <div class="item_inp">
|
||
<div class="select i7_input">
|
||
<a-select :getPopupContainer="
|
||
(triggerNode) => {
|
||
return triggerNode.parentNode || document.body;
|
||
}
|
||
" v-model:value="chang_jin" dropdownClassName="dropdown-style" style="width: 440px" placeholder="请选择"
|
||
:options="options3" allowClear showSearch />
|
||
</div>
|
||
</div> -->
|
||
</div>
|
||
|
||
<div class="mbl_items">
|
||
<div class="item_nam">
|
||
<span style="margin-right: 14px">内容标签</span>
|
||
</div>
|
||
<div class="item_inp">
|
||
<a-input
|
||
v-model:value="tags_val_single"
|
||
style="width: 440px; height: 40px; border-radius: 8px"
|
||
placeholder="请输入内容标签按回车键添加内容标签，可添加多个内容标签。"
|
||
@pressEnter="handleTagChange"
|
||
/>
|
||
<div class="tag-content">
|
||
<a-tag
|
||
v-for="(item, index) in tags_val"
|
||
:key="index"
|
||
closable
|
||
@close="handleTagClose(item)"
|
||
>
|
||
{{ item }}
|
||
</a-tag>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
|
||
<div class="mb_right">
|
||
<!--
|
||
<div class="mbl_items">
|
||
<div class="item_nam" style="margin-top:5px;">
|
||
<div class="asterisk_icon">
|
||
<img src="@/assets/images/coursewareManage/asterisk.png" alt="asterisk" />
|
||
</div>
|
||
|
||
<span style="margin-right: 14px">授课教师</span>
|
||
</div>
|
||
<div class="item_inp">
|
||
<div class="select" style="width:88%;">
|
||
<ProjectManager v-model:value="member.value" v-model:name="member.name" />
|
||
</div>
|
||
</div>
|
||
</div>
|
||
-->
|
||
|
||
<div class="mbl_items2">
|
||
<div class="item_nam" style="margin-top: 8px">
|
||
<div class="asterisk_icon">
|
||
<img
|
||
src="@/assets/images/coursewareManage/asterisk.png"
|
||
alt="asterisk"
|
||
/>
|
||
</div>
|
||
<span style="margin-right: 14px">课程简介</span>
|
||
</div>
|
||
<div class="item_inp">
|
||
<div class="i10_textarea">
|
||
<a-textarea
|
||
v-model:value="qdms_inputV6"
|
||
maxlength="150"
|
||
style="width: 440px; height: 100px; border-radius: 8px"
|
||
placeholder="请输入"
|
||
/>
|
||
<div class="inp_num">
|
||
<span style="color: #c7cbd2">
|
||
{{ qdms_inputV6.length }}/150
|
||
</span>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
<div class="mbl_items">
|
||
<div class="item_nam" style="margin-top: 8px">
|
||
<span style="margin-right: 10px">附件</span>
|
||
</div>
|
||
<div class="item_inp">
|
||
<FJUpload v-model:value="attach" @changevalue="changevalue" />
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
<div class="m_footer">
|
||
<div class="fotnam">
|
||
<span>课程大纲</span>
|
||
</div>
|
||
<div v-if="ft_hs" class="fotarea">
|
||
<div style="border: 1px solid #ccc">
|
||
<Toolbar
|
||
style="border-bottom: 1px solid #ccc"
|
||
:editor="editorRef"
|
||
:defaultConfig="toolbarConfig"
|
||
:mode="mode"
|
||
/>
|
||
<Editor
|
||
style="height: 250px; overflow-y: hidden"
|
||
v-model="valueHtml"
|
||
:defaultConfig="editorConfig"
|
||
:mode="mode"
|
||
@onCreated="handleCreated"
|
||
/>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
<div class="m_btn">
|
||
<div class="btn btn5" @click="noEditClose">
|
||
<div class="btnText">取消</div>
|
||
</div>
|
||
<a-button
|
||
class="btn btn6"
|
||
@click="handlePush"
|
||
:loading="validated === 1"
|
||
>
|
||
<div class="btnText">保存</div>
|
||
</a-button>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
<div class="aeLoading" :style="{ display: addLoading ? 'flex' : 'none' }">
|
||
<a-spin :spinning="addLoading" tip="" />
|
||
</div>
|
||
</a-modal>
|
||
|
||
<!-- 更多背景图 v-model:visible="learnBgMore" -->
|
||
<a-modal
|
||
:closable="sh"
|
||
centered="true"
|
||
v-model:visible="learnBgMore"
|
||
:footer="null"
|
||
wrapClassName="courseBgMoreModal"
|
||
:z-index="9999"
|
||
>
|
||
<div class="main">
|
||
<div class="top">
|
||
<div class="topc">面授课封面</div>
|
||
<div @click="closeLearnBgMore">
|
||
<img
|
||
style="width: 20px; height: 20px"
|
||
src="../../assets/images/basicinfo/close.png"
|
||
/>
|
||
</div>
|
||
</div>
|
||
<div class="imagesBox">
|
||
<div
|
||
@click="chooseImg(item)"
|
||
v-for="item in optionsUrl"
|
||
:key="item.id"
|
||
class="learnBgItem"
|
||
:style="{
|
||
border:
|
||
pathBgId === item.id
|
||
? '3px solid rgba(78, 166, 255, 1)'
|
||
: '1px solid #ccc',
|
||
'background-image': 'url(' + item.value + ')',
|
||
}"
|
||
>
|
||
<!-- <img class="im" :src="item.source" /> -->
|
||
</div>
|
||
</div>
|
||
<div class="btn">
|
||
<button class="samtn btn1" @click="closeLearnBgMore">取消</button>
|
||
<a-button class="samtn btn2" @click="closeLearnBgMore">确定</a-button>
|
||
</div>
|
||
</div>
|
||
</a-modal>
|
||
</template>
|
||
<script>
|
||
import {
|
||
reactive,
|
||
toRefs,
|
||
defineComponent,
|
||
ref,
|
||
shallowRef,
|
||
onUnmounted,
|
||
computed,
|
||
watch,
|
||
} from "vue";
|
||
import { validateName } from "@/api/index1";
|
||
import { message } from "ant-design-vue";
|
||
import { edit, detail, handle } from "@/api/indexCourse";
|
||
import { fileUp } from "../../api/indexEval";
|
||
import "@wangeditor/editor/dist/css/style.css";
|
||
import { Editor, Toolbar } from "@wangeditor/editor-for-vue";
|
||
import NameInput from "@/components/project/NameInput";
|
||
import FJUpload from "@/components/common/FJUpload";
|
||
import * as moment from "moment";
|
||
import * as api2 from "../../api/indexAudit";
|
||
import { useStore } from "vuex";
|
||
import OrgClassCheck from "@/components/project/OrgClassCheck";
|
||
import OrgClass from "@/components/project/OrgClass";
|
||
export default defineComponent({
|
||
components: {
|
||
Editor,
|
||
Toolbar,
|
||
FJUpload,
|
||
NameInput,
|
||
OrgClassCheck,
|
||
OrgClass,
|
||
},
|
||
props: {
|
||
xzinputV1: {
|
||
type: String,
|
||
default: null,
|
||
},
|
||
},
|
||
setup(props, { expose, emit }) {
|
||
const state = reactive({
|
||
hideshow: true,
|
||
ft_eidt: false,
|
||
attach: "",
|
||
validated: 2,
|
||
ft_hs: false,
|
||
addLoading: false,
|
||
statusJuJue: 0,
|
||
statusTingQi: 1,
|
||
member: { name: "", value: "" },
|
||
|
||
offcourseId: null,
|
||
qdms_inputV1: "",
|
||
qdms_inputV2: "",
|
||
qdms_inputV3: "",
|
||
fen_lei: null,
|
||
fen_lei1: null,
|
||
feng_mian_1: null,
|
||
chang_jin: "",
|
||
tags_val_single: "",
|
||
tags_val: [],
|
||
qdms_inputV6: "",
|
||
imgList: [],
|
||
auditDescription: "",
|
||
contentClassify: [],
|
||
// 课程三级分类
|
||
projectInfo: { id: "" },
|
||
//选择的封面图id及url
|
||
pathBgId: null,
|
||
pathBgUrl: null,
|
||
learnBgMore: false, //封面图弹窗
|
||
|
||
//目标任务
|
||
orgSelect: [],
|
||
orgSelectName: [],
|
||
orgSelectFullName: [],
|
||
selectJobName: [],
|
||
selectJobId: [],
|
||
selectBandName: [],
|
||
selectBandId: [],
|
||
//资源归属
|
||
sourceBelongId: null,
|
||
sourceBelongName: null,
|
||
sourceBelongFullName: null,
|
||
});
|
||
const store = useStore();
|
||
console.log(store, 666);
|
||
const sysTypeOptions = computed(() => store.state.content_type);
|
||
const optionsUrl = computed(() => store.state.course_pic);
|
||
console.log("optionsUrl", optionsUrl);
|
||
//获取岗位
|
||
const jobType = computed(() => store.state.job_type);
|
||
//获取band
|
||
const bandList = computed(() => store.state.band);
|
||
const userInfo = computed(() => store.state.userInfo);
|
||
console.log("jobTypebandList", jobType, bandList);
|
||
if (userInfo.value.departId && userInfo.value.departName) {
|
||
state.sourceBelongName = userInfo.value.departName;
|
||
state.sourceBelongId = userInfo.value.departId;
|
||
}
|
||
watch(
|
||
() => state.fen_lei,
|
||
() => {
|
||
state.fen_lei1 = findClassFullName(sysTypeOptions.value);
|
||
}
|
||
);
|
||
|
||
function findClassFullName(list, name = "") {
|
||
return (
|
||
list &&
|
||
list.length > 0 &&
|
||
list
|
||
.map((e) => {
|
||
return state.fen_lei === e.code
|
||
? name
|
||
? name + "-" + e.name
|
||
: e.name
|
||
: findClassFullName(
|
||
e.children,
|
||
name ? name + "-" + e.name : e.name
|
||
);
|
||
})
|
||
.filter((name) => name)
|
||
.join("")
|
||
);
|
||
}
|
||
|
||
// 删除文件返回参数
|
||
const changevalue = (e) => {
|
||
let arr = state.attach.split(",");
|
||
let newarr = [];
|
||
for (let i = 0; i < arr.length; i++) {
|
||
if (i !== e) {
|
||
newarr.push(arr[i]);
|
||
}
|
||
}
|
||
if (newarr.length == 0) {
|
||
state.attach = "";
|
||
} else {
|
||
state.attach = newarr.toString();
|
||
}
|
||
console.log("changevalue", e, newarr, state.attach);
|
||
};
|
||
|
||
const visibleOpen = (offcourseId, name) => {
|
||
state.offcourseId = offcourseId;
|
||
|
||
if (state.offcourseId) {
|
||
state.ft_hs = true;
|
||
state.ft_eidt = true;
|
||
handleEditInfo(state.offcourseId);
|
||
} else {
|
||
state.ft_hs = true;
|
||
state.ft_eidt = false;
|
||
state.qdms_inputV1 = name;
|
||
console.log(" state.qdms_inputV1 ", state.qdms_inputV1);
|
||
}
|
||
};
|
||
const visibleClose = () => {
|
||
state.ft_hs = false;
|
||
valueHtml.value = "";
|
||
ft_exit();
|
||
emit("visibleClose");
|
||
};
|
||
|
||
// 未编辑直接离开的 不予刷新
|
||
const noEditClose = () => {
|
||
state.ft_hs = false;
|
||
ft_exit();
|
||
emit("noEdit");
|
||
};
|
||
|
||
expose({
|
||
visibleOpen,
|
||
visibleClose,
|
||
});
|
||
|
||
const ft_exit = () => {
|
||
state.hideshow = true;
|
||
state.ft_hs = false;
|
||
state.addLoading = false;
|
||
state.statusJuJue = 0;
|
||
state.statusTingQi = 1;
|
||
state.member = { name: "", value: "" };
|
||
|
||
state.offcourseId = null;
|
||
state.qdms_inputV1 = "";
|
||
state.qdms_inputV2 = "";
|
||
state.qdms_inputV3 = "";
|
||
state.fen_lei = null;
|
||
state.fen_lei1 = null;
|
||
state.feng_mian_1 = null;
|
||
state.chang_jin = "";
|
||
state.tags_val_single = "";
|
||
state.tags_val = [];
|
||
state.qdms_inputV6 = "";
|
||
state.imgList = [];
|
||
state.attach = "";
|
||
state.auditDescription = "";
|
||
|
||
valueHtml.value = "";
|
||
|
||
//目标任务
|
||
state.orgSelect = [];
|
||
state.orgSelectName = [];
|
||
state.orgSelectFullName = [];
|
||
state.selectJobName = [];
|
||
state.selectJobId = [];
|
||
state.selectBandName = [];
|
||
state.selectBandId = [];
|
||
//资源归属
|
||
state.sourceBelongId = null;
|
||
state.sourceBelongName = null;
|
||
state.sourceBelongFullName = null;
|
||
// valueHtml.value = "";
|
||
console.log("清空");
|
||
};
|
||
|
||
// 富文本 sssssssssssssss
|
||
// 编辑器实例，必须用 shallowRef
|
||
const editorRef = shallowRef();
|
||
// 内容 HTML
|
||
const valueHtml = ref("");
|
||
// // 模拟 ajax 异步获取内容
|
||
// onMounted(() => {
|
||
// setTimeout(() => {
|
||
// // valueHtml.value = "<p>模拟 Ajax 异步设置内容</p>";
|
||
// console.log(editorRef.value);
|
||
// // const toolbar = DomEditor.getToolbar(editorRef.value);
|
||
// // const menu = editorRef.value.getAllMenuKeys();
|
||
// // const bar = toolbar.getConfig().toolbarKeys;
|
||
// // console.log(menu);
|
||
// // console.log(bar);
|
||
// }, 3500);
|
||
// });
|
||
const toolbarConfig = {
|
||
excludeKeys: ["insertVideo", "insertImage"],
|
||
};
|
||
const editorConfig = { placeholder: "请输入内容...", MENU_CONF: {} };
|
||
editorConfig.MENU_CONF["uploadImage"] = {
|
||
// 自定义上传
|
||
async customUpload(file, insertFn) {
|
||
const formData = new FormData();
|
||
formData.append("file", file);
|
||
fileUp(formData).then((res) => {
|
||
if (res.data.code === 200) {
|
||
// 最后插入图片 url alt href
|
||
console.log(
|
||
"上传图片结果",
|
||
process.env.VUE_APP_FILE_PATH + res.data.data
|
||
);
|
||
insertFn(
|
||
process.env.VUE_APP_FILE_PATH + res.data.data,
|
||
file.name,
|
||
res.data.data
|
||
);
|
||
}
|
||
});
|
||
},
|
||
};
|
||
const handleCreated = (editor) => {
|
||
editorRef.value = editor; // 记录 editor 实例，重要！
|
||
};
|
||
// const handleDestory = () => {
|
||
// const editor = editorRef.value;
|
||
// if (editor == null) return;
|
||
// editor.destroy();
|
||
// };
|
||
// 组件销毁时，也及时销毁编辑器
|
||
onUnmounted(() => {
|
||
console.log("组件销毁时，也及时销毁编辑器");
|
||
// handleDestory();
|
||
});
|
||
// 富文本 eeeeeeeeeeeeee
|
||
|
||
// 点击图片选择图片
|
||
const chooseImg = (item) => {
|
||
console.log(item);
|
||
state.pathBgId = item.id;
|
||
state.feng_mian_1 = item.value;
|
||
};
|
||
|
||
//获取分类、场景、封面图、-----------字典配置-------------------------------
|
||
const options2 = ref([]);
|
||
const options3 = ref([]);
|
||
const options4 = ref([]);
|
||
|
||
//获取分类、场景、封面图、----------------字典配置---------------------------
|
||
|
||
const hideShow = () => {
|
||
if (state.hideshow == true) {
|
||
state.hideshow = false;
|
||
} else {
|
||
state.hideshow = true;
|
||
}
|
||
};
|
||
const checkVal = (checkList) => {
|
||
let count = 0;
|
||
for (const keyName of checkList) {
|
||
if (!keyName) {
|
||
count++;
|
||
console.log("keyname", keyName);
|
||
}
|
||
}
|
||
|
||
return !count;
|
||
};
|
||
|
||
//保存面授课
|
||
const handlePush = async (param) => {
|
||
console.log(
|
||
"组织、岗位、Band、资源归属选择" + JSON.stringify(state)
|
||
// state.orgSelect,
|
||
// state.selectJobId,
|
||
// state.selectBandId,
|
||
// state.sourceBelongId
|
||
);
|
||
let files = "";
|
||
if (state.imgList.length) {
|
||
state.imgList.forEach((item) => {
|
||
files += item.img + ",";
|
||
});
|
||
}
|
||
files = files.slice(0, files.length - 1);
|
||
|
||
let orgSelectIds = "";
|
||
let orgSelectNames = "";
|
||
if (state.orgSelect && state.orgSelect.length) {
|
||
state.orgSelect.forEach((item) => {
|
||
orgSelectIds += item.value + ",";
|
||
});
|
||
state.orgSelect.forEach((item) => {
|
||
orgSelectNames += item.label + ",";
|
||
});
|
||
}
|
||
console.log("orgSelectIds&orgSelectNames2", orgSelectIds, orgSelectNames);
|
||
orgSelectIds = orgSelectIds.slice(0, orgSelectIds.length - 1);
|
||
orgSelectNames = orgSelectNames.slice(0, orgSelectNames.length - 1);
|
||
|
||
let selectJobId = "";
|
||
if (state.selectJobId.length) {
|
||
state.selectJobId.forEach((item) => {
|
||
selectJobId += item + ",";
|
||
});
|
||
}
|
||
selectJobId = selectJobId.slice(0, selectJobId.length - 1);
|
||
|
||
let selectBandId = "";
|
||
if (state.selectBandId.length) {
|
||
state.selectBandId.forEach((item) => {
|
||
selectBandId += item + ",";
|
||
});
|
||
}
|
||
selectBandId = selectBandId.slice(0, selectBandId.length - 1);
|
||
|
||
console.log("filesfiles", files);
|
||
const offName = await validateName({
|
||
name: state.qdms_inputV1,
|
||
type: 2,
|
||
id: state.offcourseId,
|
||
}).then((res) => {
|
||
return res.data.data === 1;
|
||
});
|
||
console.log("校验重复", offName);
|
||
if (offName) {
|
||
message.destroy();
|
||
return message.warning("课程名称重复，请重新填写");
|
||
}
|
||
|
||
const postData = {
|
||
id: state.offcourseId, //不传代表新增
|
||
name: state.qdms_inputV1,
|
||
picUrl: state.feng_mian_1,
|
||
targetUser: state.qdms_inputV2,
|
||
meaning: state.qdms_inputV3,
|
||
// categoryId: state.fen_lei,
|
||
sysTypeId: state.fen_lei,
|
||
sceneContent: state.chang_jin,
|
||
tips: state.tags_val ? state.tags_val.join(",") : null,
|
||
// teacherId: state.member.value,
|
||
// teacher: state.member.name,
|
||
intro: state.qdms_inputV6,
|
||
attach: state.attach,
|
||
outline: valueHtml.value,
|
||
// organizationIds: orgSelect, //todo 传的不对
|
||
organizationIds: orgSelectIds,
|
||
organizationNames: orgSelectNames,
|
||
jobTypeIds: selectJobId,
|
||
bandIds: selectBandId,
|
||
sourceBelongId: state.sourceBelongId,
|
||
sourceBelongFullName: state.sourceBelongName,
|
||
};
|
||
console.log("postData", postData);
|
||
const checkList = [
|
||
postData.name,
|
||
// postData.targetUser,
|
||
// postData.categoryId,
|
||
postData.sysTypeId,
|
||
// postData.teacherId,
|
||
postData.picUrl,
|
||
postData.intro,
|
||
postData.sourceBelongId,
|
||
];
|
||
console.log("checkList", checkList);
|
||
if (
|
||
(!postData.organizationIds &&
|
||
!postData.jobTypeIds &&
|
||
!postData.bandIds) ||
|
||
!checkVal(checkList)
|
||
) {
|
||
message.destroy();
|
||
return message.error("请输入必填项");
|
||
} else {
|
||
state.addLoading = true;
|
||
}
|
||
|
||
edit(postData).then((res) => {
|
||
state.addLoading = false;
|
||
if (res.data.code === 200) {
|
||
state.statusTingQi = 1;
|
||
if (param === "review") {
|
||
//新建时点击审核按钮
|
||
submitReview(res.data.data.id);
|
||
} else {
|
||
message.destroy();
|
||
message.success("保存成功");
|
||
visibleClose();
|
||
}
|
||
} else if (res.data.code === -1) {
|
||
message.destroy();
|
||
message.success("无此操作权限");
|
||
visibleClose();
|
||
}
|
||
});
|
||
};
|
||
|
||
//编辑面授课渲染绑定
|
||
const handleEditInfo = async (offcourseId) => {
|
||
console.log("jjjaj");
|
||
state.validate = true;
|
||
state.qdms_inputV1 = "";
|
||
const item = await detail({
|
||
offcourseId: Number(offcourseId),
|
||
}).then((res) => {
|
||
if (res.data.code === 200) return res.data.data;
|
||
});
|
||
|
||
state.statusJuJue = Number(item.auditStatus) === -1 ? 1 : 0;
|
||
|
||
if (Number(item.auditStatus) === 2 && Number(item.status) === 1) {
|
||
state.statusTingQi = 1;
|
||
}
|
||
if (Number(item.auditStatus) === 2 && Number(item.status) === 0) {
|
||
state.statusTingQi = 0;
|
||
}
|
||
if (Number(item.auditStatus) === -1) {
|
||
let obj = {
|
||
offcourseId: offcourseId,
|
||
type: 2,
|
||
pageNo: 1,
|
||
pageSize: 1,
|
||
};
|
||
const res = await api2.auditList(obj).then((res) => {
|
||
if (res.data.code === 200) return res.data.data;
|
||
});
|
||
if (res.rows && res.rows.length > 0) {
|
||
let i = res.rows.length;
|
||
state.auditDescription = res.rows[i - 1].description
|
||
? res.rows[i - 1].description
|
||
: "-";
|
||
}
|
||
}
|
||
|
||
state.qdms_inputV1 = item.name;
|
||
state.feng_mian_1 = item.picUrl;
|
||
state.qdms_inputV2 = item.targetUser;
|
||
state.qdms_inputV3 = item.meaning;
|
||
// state.fen_lei = item.categoryId;
|
||
state.fen_lei = item.sysTypeId;
|
||
state.chang_jin = String(item.sceneContent ? item.sceneContent : "");
|
||
state.tags_val = item.tips ? item.tips.split(",") : [];
|
||
state.qdms_inputV6 = item.intro;
|
||
state.member = { value: item.teacherId, name: item.teacher };
|
||
valueHtml.value = item.outline;
|
||
let arrss = item.attach.split(",");
|
||
let str = "";
|
||
for (let i = 0; i < arrss.length; i++) {
|
||
i == arrss.length - 1
|
||
? (str += arrss[i].slice(arrss[i].lastIndexOf("/") + 1))
|
||
: (str += arrss[i].slice(arrss[i].lastIndexOf("/") + 1) + ",");
|
||
}
|
||
console.log(str);
|
||
state.attach = str;
|
||
|
||
if (item.jobTypeIds) {
|
||
state.selectJobId = item.jobTypeIds.split(",");
|
||
}
|
||
if (item.bandIds) {
|
||
state.selectBandId = item.bandIds.split(",");
|
||
}
|
||
console.log("state.selectBandId", state.selectBandId);
|
||
state.sourceBelongId = item.sourceBelongId;
|
||
state.sourceBelongName = item.sourceBelongFullName;
|
||
if (item.organizationIds && item.organizationNames) {
|
||
let orgSelectIds = item.organizationIds;
|
||
let orgSelectNames = item.organizationNames;
|
||
orgSelectIds = orgSelectIds.split(",");
|
||
orgSelectNames = orgSelectNames.split(",");
|
||
console.log(
|
||
"orgSelectIds&orgSelectNames",
|
||
orgSelectIds,
|
||
orgSelectNames
|
||
);
|
||
let arrObj = [];
|
||
arrObj = orgSelectIds.map((item, index) => {
|
||
return { value: item, label: orgSelectNames[index] };
|
||
});
|
||
console.log("arrObj-------------", arrObj);
|
||
state.orgSelect = arrObj;
|
||
}
|
||
const imgDict = optionsUrl.value.find(
|
||
(img) => img.value.split(",")[0] === item.picUrl
|
||
);
|
||
console.log("imgDict", imgDict);
|
||
if (imgDict) {
|
||
state.pathBgId = imgDict.id;
|
||
}
|
||
};
|
||
|
||
const handleTagChange = () => {
|
||
if (state.tags_val_single) {
|
||
state.tags_val.push(state.tags_val_single);
|
||
}
|
||
state.tags_val_single = "";
|
||
};
|
||
const handleTagClose = (item) => {
|
||
const arr = state.tags_val.filter((itm) => itm !== item);
|
||
state.tags_val = arr;
|
||
};
|
||
|
||
//提交审核
|
||
const reviewClick = () => {
|
||
if (state.offcourseId) {
|
||
submitReview(state.offcourseId);
|
||
} else {
|
||
handlePush("review");
|
||
}
|
||
};
|
||
const submitReview = (id) => {
|
||
state.addLoading = true;
|
||
|
||
if (id === "") {
|
||
return message.error("请先完成保存");
|
||
}
|
||
let obj = {
|
||
offcourseId: id ? id : state.offcourseId,
|
||
type: 1,
|
||
};
|
||
console.log("提交审核参数", obj);
|
||
handle(obj).then((res) => {
|
||
console.log("提交审核成功", res.data);
|
||
if (res.data.code === 200) {
|
||
message.destroy();
|
||
message.success("已提交审核");
|
||
state.addLoading = false;
|
||
visibleClose();
|
||
} else if (res.data.code === -1) {
|
||
message.destroy();
|
||
message.success("无此操作权限");
|
||
}
|
||
});
|
||
};
|
||
//目标人群
|
||
const handleChangeJob = (e, k) => {
|
||
console.log("eeee", e, k);
|
||
state.selectJobId = e;
|
||
};
|
||
const handleChangeBand = (e, k) => {
|
||
console.log("eeeeeeeeeee", e, k);
|
||
state.selectBandId = e;
|
||
};
|
||
//封面图
|
||
const showLearnBgMore = () => {
|
||
state.learnBgMore = true;
|
||
};
|
||
//关闭更多路径背景弹窗
|
||
const closeLearnBgMore = () => {
|
||
state.learnBgMore = false;
|
||
};
|
||
|
||
return {
|
||
...toRefs(state),
|
||
sysTypeOptions,
|
||
moment,
|
||
options2,
|
||
options3,
|
||
options4,
|
||
optionsUrl,
|
||
jobType,
|
||
bandList,
|
||
hideShow,
|
||
visibleOpen,
|
||
visibleClose,
|
||
handleTagChange,
|
||
handleTagClose,
|
||
handlePush,
|
||
reviewClick,
|
||
noEditClose,
|
||
editorRef,
|
||
valueHtml,
|
||
mode: "simple", // 或 'simple'
|
||
toolbarConfig,
|
||
editorConfig,
|
||
handleCreated,
|
||
chooseImg,
|
||
changevalue,
|
||
showLearnBgMore,
|
||
closeLearnBgMore,
|
||
handleChangeJob,
|
||
handleChangeBand,
|
||
};
|
||
},
|
||
});
|
||
</script>
|
||
<style lang="scss">
|
||
.facteachModal {
|
||
.ant-modal {
|
||
.ant-modal-content {
|
||
.ant-modal-body {
|
||
.modalHeader {
|
||
display: flex;
|
||
align-items: center;
|
||
justify-content: space-between;
|
||
|
||
.headerLeft {
|
||
margin-left: 27px;
|
||
display: flex;
|
||
align-items: center;
|
||
|
||
.headerLeftText {
|
||
font-size: 16px;
|
||
font-weight: 400;
|
||
color: #000000;
|
||
line-height: 36px;
|
||
}
|
||
}
|
||
}
|
||
|
||
.modalMain {
|
||
.m_title {
|
||
margin-bottom: 20px;
|
||
}
|
||
|
||
.m_body {
|
||
display: flex;
|
||
flex-wrap: wrap;
|
||
|
||
.mb_left {
|
||
width: 50%;
|
||
|
||
.mbl_items {
|
||
display: flex;
|
||
align-items: center;
|
||
justify-content: flex-end;
|
||
margin-bottom: 10px;
|
||
|
||
.item_nam {
|
||
width: 100px;
|
||
display: flex;
|
||
align-items: center;
|
||
justify-content: flex-end;
|
||
white-space: nowrap;
|
||
|
||
.asterisk_icon {
|
||
width: 10px;
|
||
height: 10px;
|
||
margin-right: 5px;
|
||
margin-top: -15px;
|
||
}
|
||
}
|
||
|
||
.item_inp {
|
||
flex: 1;
|
||
position: relative;
|
||
|
||
.inp_num {
|
||
position: absolute;
|
||
left: 398px;
|
||
top: 10px;
|
||
}
|
||
}
|
||
}
|
||
|
||
.mbl_items2 {
|
||
display: flex;
|
||
align-items: start;
|
||
margin-top: 10px;
|
||
margin-bottom: 10px;
|
||
|
||
.item_nam {
|
||
width: 100px;
|
||
display: flex;
|
||
align-items: center;
|
||
justify-content: flex-end;
|
||
white-space: nowrap;
|
||
|
||
.asterisk_icon {
|
||
width: 10px;
|
||
height: 10px;
|
||
margin-right: 5px;
|
||
margin-top: -15px;
|
||
}
|
||
}
|
||
|
||
.item_inp {
|
||
flex: 1;
|
||
|
||
.i_upload_img {
|
||
margin-top: 10px;
|
||
width: 100px;
|
||
height: 100px;
|
||
border-radius: 8px;
|
||
}
|
||
|
||
.i_upload {
|
||
width: 100px;
|
||
height: 100px;
|
||
border: 1px solid #4ea6ff;
|
||
border-radius: 8px;
|
||
text-align: center;
|
||
align-items: center;
|
||
cursor: pointer;
|
||
|
||
.addimg {
|
||
position: relative;
|
||
|
||
.heng {
|
||
position: absolute;
|
||
top: 50px;
|
||
left: 25px;
|
||
width: 50px;
|
||
border: 1px solid #4ea6ff;
|
||
}
|
||
|
||
.shu {
|
||
position: absolute;
|
||
top: 25px;
|
||
left: 50px;
|
||
height: 50px;
|
||
border: 1px solid #4ea6ff;
|
||
}
|
||
}
|
||
}
|
||
}
|
||
}
|
||
|
||
.i2_cz {
|
||
width: 440px;
|
||
margin-left: 100px;
|
||
|
||
.i2_top {
|
||
display: flex;
|
||
justify-content: space-between;
|
||
}
|
||
}
|
||
|
||
.i8_bottom {
|
||
display: flex;
|
||
width: 440px;
|
||
margin-left: 100px;
|
||
}
|
||
}
|
||
|
||
.mb_right {
|
||
width: 50%;
|
||
|
||
.mbl_items {
|
||
display: flex;
|
||
align-items: flex-start;
|
||
justify-content: flex-end;
|
||
margin-bottom: 10px;
|
||
|
||
.item_nam {
|
||
width: 100px;
|
||
display: flex;
|
||
align-items: center;
|
||
justify-content: flex-end;
|
||
white-space: nowrap;
|
||
|
||
.asterisk_icon {
|
||
width: 10px;
|
||
height: 10px;
|
||
margin-top: -15px;
|
||
margin-right: 5px;
|
||
}
|
||
}
|
||
|
||
.item_inp {
|
||
flex: 1;
|
||
}
|
||
|
||
.accessory {
|
||
display: flex;
|
||
align-items: center;
|
||
|
||
.accessory_icon {
|
||
width: 16px;
|
||
height: 16px;
|
||
margin-top: -8px;
|
||
margin-right: 5px;
|
||
}
|
||
}
|
||
}
|
||
|
||
.mbl_items2 {
|
||
display: flex;
|
||
align-items: start;
|
||
margin-bottom: 10px;
|
||
|
||
.item_nam {
|
||
width: 100px;
|
||
display: flex;
|
||
align-items: center;
|
||
justify-content: flex-end;
|
||
white-space: nowrap;
|
||
|
||
.asterisk_icon {
|
||
width: 10px;
|
||
height: 10px;
|
||
margin-right: 5px;
|
||
margin-top: -15px;
|
||
}
|
||
}
|
||
|
||
.item_inp {
|
||
flex: 1;
|
||
position: relative;
|
||
|
||
.inp_num {
|
||
position: absolute;
|
||
left: 395px;
|
||
bottom: 10px;
|
||
}
|
||
}
|
||
}
|
||
.fujian {
|
||
display: none;
|
||
}
|
||
.mbl_items12 {
|
||
width: 440px;
|
||
margin-right: 56px;
|
||
|
||
.i12_box1 {
|
||
display: flex;
|
||
align-items: center;
|
||
padding: 17px 0px 17px 21px;
|
||
border: 1px solid #eff4fc;
|
||
border-radius: 8px;
|
||
margin-bottom: 10px;
|
||
|
||
.file_img {
|
||
width: 27px;
|
||
height: 32px;
|
||
background-image: url(@/assets/images/coursewareManage/imgs.png);
|
||
margin-right: 22px;
|
||
|
||
img {
|
||
width: 100%;
|
||
height: 100%;
|
||
}
|
||
}
|
||
|
||
.file_detail {
|
||
width: 250px;
|
||
margin-right: 21px;
|
||
|
||
.file_updata {
|
||
display: flex;
|
||
align-items: center;
|
||
|
||
.updatabox {
|
||
position: relative;
|
||
width: 230px;
|
||
height: 5px;
|
||
background-color: rgba(192, 192, 192, 0.25);
|
||
border-radius: 3px;
|
||
|
||
.updatacolor {
|
||
position: absolute;
|
||
left: 0;
|
||
width: 100%;
|
||
height: 5px;
|
||
background-color: #57c887;
|
||
border-radius: 3px;
|
||
}
|
||
|
||
.updatacolor2 {
|
||
position: absolute;
|
||
left: 0;
|
||
width: 80%;
|
||
height: 5px;
|
||
background-color: #ff7474;
|
||
border-radius: 3px;
|
||
}
|
||
|
||
.updatacolor3 {
|
||
position: absolute;
|
||
left: 0;
|
||
width: 60%;
|
||
height: 5px;
|
||
background-color: #4ea6ff;
|
||
border-radius: 3px;
|
||
}
|
||
|
||
.updataxq {
|
||
position: absolute;
|
||
right: 2px;
|
||
top: -30px;
|
||
color: #57c887;
|
||
}
|
||
|
||
.updataxq2 {
|
||
position: absolute;
|
||
right: 2px;
|
||
top: -30px;
|
||
color: #ff7474;
|
||
}
|
||
|
||
.updataxq3 {
|
||
position: absolute;
|
||
right: 2px;
|
||
top: -30px;
|
||
color: #4ea6ff;
|
||
}
|
||
}
|
||
}
|
||
}
|
||
|
||
.file_operation {
|
||
display: flex;
|
||
|
||
.fobox {
|
||
margin-right: 5px;
|
||
cursor: pointer;
|
||
}
|
||
}
|
||
}
|
||
}
|
||
}
|
||
}
|
||
|
||
.m_footer {
|
||
display: flex;
|
||
margin: 20px 0;
|
||
|
||
.fotnam {
|
||
width: 100px;
|
||
display: flex;
|
||
justify-content: end;
|
||
padding-right: 15px;
|
||
}
|
||
|
||
.fotarea {
|
||
width: calc(100% - 150px);
|
||
position: relative;
|
||
|
||
.fuwenben {
|
||
width: 90%;
|
||
height: 20px;
|
||
background-color: rgb(95, 95, 95);
|
||
position: absolute;
|
||
left: 50%;
|
||
transform: translate(-50%, 0);
|
||
top: 3px;
|
||
z-index: 9999;
|
||
}
|
||
}
|
||
}
|
||
|
||
.m_btn {
|
||
width: 100%;
|
||
margin-top: 25px;
|
||
margin-bottom: 20px;
|
||
display: flex;
|
||
justify-content: center;
|
||
align-content: center;
|
||
|
||
.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;
|
||
}
|
||
}
|
||
|
||
.btn5 {
|
||
border: 1px solid rgba(64, 158, 255, 1);
|
||
color: #4ea6ff;
|
||
}
|
||
|
||
.btn6 {
|
||
background-color: #4ea6ff;
|
||
color: #ffffff;
|
||
}
|
||
}
|
||
}
|
||
}
|
||
}
|
||
}
|
||
|
||
.statusJuJue {
|
||
margin-bottom: 20px;
|
||
}
|
||
|
||
.choiceoptionurl {
|
||
width: 100px;
|
||
height: 100px;
|
||
margin-right: 10px;
|
||
border-radius: 8px;
|
||
}
|
||
.learnBgItem {
|
||
border-radius: 8px;
|
||
width: 100px;
|
||
height: 100px;
|
||
background-size: 100%;
|
||
background-repeat: no-repeat;
|
||
// margin-bottom: 20px;
|
||
margin-right: 6px;
|
||
}
|
||
|
||
.learnBgMore {
|
||
display: flex;
|
||
align-items: center;
|
||
justify-content: center;
|
||
border: 1px solid #c7cbd2;
|
||
font-size: 14px;
|
||
font-weight: 400;
|
||
color: #4ea6ff;
|
||
line-height: 36px;
|
||
cursor: pointer;
|
||
}
|
||
|
||
.aeLoading {
|
||
z-index: 10000;
|
||
}
|
||
}
|
||
.coursemodal {
|
||
.i1_input {
|
||
.ant-select-selector {
|
||
min-height: 40px !important;
|
||
border-radius: 8px !important;
|
||
border: 1px solid #c7cbd2 !important;
|
||
}
|
||
}
|
||
}
|
||
.courseBgMoreModal {
|
||
.ant-modal {
|
||
width: 680px !important;
|
||
height: 528px !important;
|
||
|
||
.ant-modal-content {
|
||
width: 680px !important;
|
||
height: 528px !important;
|
||
|
||
.ant-modal-body {
|
||
width: 680px !important;
|
||
height: 528px !important;
|
||
padding: 0 !important;
|
||
|
||
.main {
|
||
display: flex;
|
||
flex-direction: column;
|
||
|
||
.top {
|
||
padding-left: 51px;
|
||
padding-right: 51px;
|
||
padding-top: 28px;
|
||
display: flex;
|
||
align-items: center;
|
||
justify-content: space-between;
|
||
cursor: pointer;
|
||
|
||
.topc {
|
||
font-size: 16px;
|
||
font-weight: bold;
|
||
color: #000000;
|
||
line-height: 36px;
|
||
}
|
||
}
|
||
|
||
.imagesBox {
|
||
display: flex;
|
||
// justify-content: space-between;
|
||
flex-wrap: wrap;
|
||
padding-left: 51px;
|
||
padding-right: 39px;
|
||
margin-top: 20px;
|
||
height: 350px;
|
||
overflow-y: auto;
|
||
|
||
.learnBgItem {
|
||
border-radius: 8px;
|
||
width: 136px;
|
||
height: 106px;
|
||
background-size: 100%;
|
||
background-repeat: no-repeat;
|
||
margin-bottom: 20px;
|
||
margin-right: 10px;
|
||
}
|
||
}
|
||
|
||
.btn {
|
||
width: 100%;
|
||
position: absolute;
|
||
bottom: 30px;
|
||
margin-top: 30px;
|
||
display: flex;
|
||
justify-content: center;
|
||
|
||
.samtn {
|
||
width: 100px;
|
||
height: 40px;
|
||
font-size: 14px;
|
||
border: 1px solid #4ea6ff;
|
||
border-radius: 8px;
|
||
cursor: pointer;
|
||
}
|
||
|
||
.btn1 {
|
||
background-color: #fff;
|
||
color: #4ea6ff;
|
||
}
|
||
|
||
.btn2 {
|
||
background-color: #4ea6ff;
|
||
color: #fff;
|
||
margin-left: 16px;
|
||
}
|
||
}
|
||
}
|
||
}
|
||
}
|
||
.ant-modal-close-x {
|
||
display: none;
|
||
}
|
||
}
|
||
}
|
||
</style>
|