hz/learning-system-portal
1
0
Fork 0
mirror of https://codeup.aliyun.com/67762337eccfc218f6110e0e/vue/learning-system-portal.git synced 2025-12-06 09:26:43 +08:00
Code Issues Packages Projects Releases Wiki Activity

提示

Browse Source
This commit is contained in:
670788339
2025-11-10 18:49:54 +08:00
parent 702255d9d0
commit 8228b33cb0
3 changed files with 470 additions and 212 deletions
Download Patch File Download Diff File Expand all files Collapse all files

9
src/api/modules/course.js
View File

@@ -440,6 +440,12 @@ const queryCrowd=function(query){
const ids=function (data){ const ids=function (data){
return ajax.postJson('/xboe/m/course/manage/ids',data); return ajax.postJson('/xboe/m/course/manage/ids',data);
} }
const saveTip = function() {
return ajax.postJson('/xboe/m/course/manage/saveTip');
}
export default { export default {
saveBase, saveBase,
submitCourse, submitCourse,
@@ -482,6 +488,7 @@ export default {
exportCourseAudit, exportCourseAudit,
exportCourse, exportCourse,
queryCrowd, queryCrowd,
ids ids,
saveTip
} }

633
src/components/Course/courseForm.vue
View File

@@ -5,15 +5,15 @@
<el-form label-width="120px" label-position="left" > <el-form label-width="120px" label-position="left" >
<el-form-item label="课程名称" required><el-input maxlength="90" v-model="courseInfo.name" show-word-limit placeholder="课程名称(限90字以内)"></el-input></el-form-item> <el-form-item label="课程名称" required><el-input maxlength="90" v-model="courseInfo.name" show-word-limit placeholder="课程名称(限90字以内)"></el-input></el-form-item>
<el-form-item label="是否设置目录" required> <el-form-item label="是否设置目录" required>
<div> <div>
<el-radio v-model="courseInfo.type" :label="20">是</el-radio> <el-radio v-model="courseInfo.type" :label="20">是</el-radio>
<el-radio v-model="courseInfo.type" :label="10">否</el-radio> <el-radio v-model="courseInfo.type" :label="10">否</el-radio>
</div> </div>
</el-form-item> </el-form-item>
<!-- <div style="margin-top:40px">适合您<span style="color:#e83d3a;font-size: 16px;">快速</span>分享<span style="color:#e83d3a;font-size: 16px;">单一</span>的视频、音频或者文档制作说明</div> --> <!-- <div style="margin-top:40px">适合您<span style="color:#e83d3a;font-size: 16px;">快速</span>分享<span style="color:#e83d3a;font-size: 16px;">单一</span>的视频、音频或者文档制作说明</div> -->
<!-- <div v-show="courseExample == 1">适合您<span class="tip">快速</span>分享<span class="tip">单一</span>的视频、音频或者文档制作说明</div> <!-- <div v-show="courseExample == 1">适合您<span class="tip">快速</span>分享<span class="tip">单一</span>的视频、音频或者文档制作说明</div>
<div v-show="courseExample == 2">适合您分享<span class="tip">体系化</span>、<span class="tip">结构化</span>的课程内容制作说明</div> <div v-show="courseExample == 2">适合您分享<span class="tip">体系化</span>、<span class="tip">结构化</span>的课程内容制作说明</div>
--> -->
</el-form> </el-form>
</div> </div>
<!-- <div style="height:100px"></div> --> <!-- <div style="height:100px"></div> -->
@@ -41,6 +41,41 @@
<el-button @click="toInputCourse()" type="primary">确定</el-button> <el-button @click="toInputCourse()" type="primary">确定</el-button>
</span> --> </span> -->
</el-dialog> </el-dialog>
<!-- 蒙层引导组件 -->
<div v-if="showGuidance" class="guidance-overlay" @click="closeGuidance">
<div class="guidance-content">
<div class="guidance-title">操作引导</div>
<div class="guidance-steps">
<div class="guidance-step" :class="{ active: currentStep === 1 }">
<div class="step-number">1</div>
<div class="step-content">
<div class="step-title">设置内容分类</div>
<div class="step-desc">当选择内容分类后，其关联标签将在下拉列表中优先显示。</div>
</div>
</div>
<div class="guidance-step" :class="{ active: currentStep === 2 }">
<div class="step-number">2</div>
<div class="step-content">
<div class="step-title">添加课程标签</div>
<div class="step-desc">为课程添加相关标签,最多5个，便于搜索和分类,可回车创建新标签</div>
</div>
</div>
</div>
<!-- <div class="guidance-actions">
<el-button @click="previousStep1" v-if="currentStep > 1">上一步</el-button>
<el-button type="primary" @click="nextStep">
{{ currentStep === 2 ? '完成' : '下一步' }}
</el-button>
<el-button @click="closeGuidance">跳过引导</el-button>
</div>-->
</div>
</div>
<!-- 高亮指引元素 -->
<div v-if="showGuidance" class="highlight-element" :style="highlightStyle"></div>
<!--微课--> <!--微课-->
<el-dialog v-if="weike.dlgShow" width="980px" :title="curCourseId == '' ? '新建课程' : '编辑课程'" :visible.sync="weike.dlgShow" :close-on-click-modal="false" custom-class="g-dialog" top="8vh"> <el-dialog v-if="weike.dlgShow" width="980px" :title="curCourseId == '' ? '新建课程' : '编辑课程'" :visible.sync="weike.dlgShow" :close-on-click-modal="false" custom-class="g-dialog" top="8vh">
<el-form label-width="100px" size="small" class="wei-from" style="min-height: 600px;"> <el-form label-width="100px" size="small" class="wei-from" style="min-height: 600px;">
@@ -64,22 +99,30 @@
</span> </span>
</div> </div>
</el-form-item> </el-form-item>
<el-form-item label="内容分类" required> <el-form-item label="内容分类" required class="guidance-highlight" data-step="1">
<el-cascader <el-cascader
placeholder="选择内容分类" placeholder="选择内容分类"
style="width: 100%;" style="width: 100%;"
clearable clearable
v-model="sysTypeList" v-model="sysTypeList"
:props="{ value: 'id', label: 'name' }" :props="{ value: 'id', label: 'name' }"
:options="sysTypeListMap"></el-cascader> :options="sysTypeListMap"
@focus="onContentTypeFocus"
@change="onContentTypeChange">
</el-cascader>
</el-form-item> </el-form-item>
<el-form-item label="标签" required>
<courseTag ref="courseTag" :courseId="curCourseId" :sysTypeList="sysTypeList" :initialTags="courseTags" @change="handleTagsChange"></courseTag> <el-form-item label="标签" required class="guidance-highlight" data-step="2">
<courseTag ref="courseTag" :courseId="curCourseId" :sysTypeList="sysTypeList"
:initialTags="courseTags" @change="handleTagsChange"
@focus="onTagFocus">
</courseTag>
</el-form-item> </el-form-item>
<el-form-item label="资源归属" required> <el-form-item label="资源归属" required>
<el-input placeholder="请选择" v-model="orgName" > <el-input placeholder="请选择" v-model="orgName" >
<el-button v-if="identity==3 || identity==5" @click="showChooseOrg()" slot="append" icon="el-icon-search">选择</el-button> <el-button v-if="identity==3 || identity==5" @click="showChooseOrg()" slot="append" icon="el-icon-search">选择</el-button>
</el-input> </el-input>
</el-form-item> </el-form-item>
<el-form-item label="场景" v-show="!weike.onlyRequired"> <el-form-item label="场景" v-show="!weike.onlyRequired">
<el-col :span="18"> <el-col :span="18">
@@ -112,11 +155,11 @@
<el-input maxlength="50" v-model="courseInfo.forUsers" show-word-limit placeholder="目标人群(限50字以内)"></el-input> <el-input maxlength="50" v-model="courseInfo.forUsers" show-word-limit placeholder="目标人群(限50字以内)"></el-input>
</el-form-item> </el-form-item>
<el-form-item v-if="visibleShow" label="学员可见"> <el-form-item v-if="visibleShow" label="学员可见">
<el-checkbox v-model="courseInfo.visible"></el-checkbox> <el-checkbox v-model="courseInfo.visible"></el-checkbox>
</el-form-item> </el-form-item>
<el-form-item label="受众" v-if="!weike.onlyRequired"> <el-form-item label="受众" v-if="!weike.onlyRequired">
<el-select value-key="id" style="width: 100%;" v-model="courseCrowds" filterable multiple :clearable="false" @remove-tag="removeCrowd" placeholder="请选择"> <el-select value-key="id" style="width: 100%;" v-model="courseCrowds" filterable multiple :clearable="false" @remove-tag="removeCrowd" placeholder="请选择">
<el-option v-for="item in userGroupList" :key="item.id" :disabled="item.disabled" :label="item.name" :value="item"></el-option> <el-option v-for="item in userGroupList" :key="item.id" :disabled="item.disabled" :label="item.name" :value="item"></el-option>
</el-select> </el-select>
</el-form-item> </el-form-item>
<el-form-item label="课程价值" v-if="!weike.onlyRequired"> <el-form-item label="课程价值" v-if="!weike.onlyRequired">
@@ -153,11 +196,11 @@
</el-form-item> </el-form-item>
<el-form-item v-if="!weike.onlyRequired" label="课程简介"> <el-form-item v-if="!weike.onlyRequired" label="课程简介">
<el-input type="textarea" <el-input type="textarea"
maxlength="255" maxlength="255"
show-word-limit show-word-limit
:rows="3" :rows="3"
v-model="courseInfo.summary" v-model="courseInfo.summary"
placeholder="请尽量填写课程简介，用于列表中显示，可以让用户更容易了解课程信息"> placeholder="请尽量填写课程简介，用于列表中显示，可以让用户更容易了解课程信息">
</el-input> </el-input>
</el-form-item> </el-form-item>
</el-col> </el-col>
@@ -221,14 +264,16 @@
</div> </div>
</el-col> </el-col>
<el-col :span="12"> <el-col :span="12">
<el-form-item label="内容分类" required> <el-form-item label="内容分类" required class="guidance-highlight" data-step="1">
<el-cascader <el-cascader
placeholder="选择内容分类" placeholder="选择内容分类"
style="width: 100%;" style="width: 100%;"
clearable clearable
v-model="sysTypeList" v-model="sysTypeList"
:props="{ value: 'id', label: 'name' }" :props="{ value: 'id', label: 'name' }"
:options="sysTypeListMap"> :options="sysTypeListMap"
@focus="onContentTypeFocus"
@change="onContentTypeChange">
</el-cascader> </el-cascader>
</el-form-item> </el-form-item>
@@ -256,21 +301,25 @@
</el-select> --> </el-select> -->
<choice :teacherValue="teacherValues" @getTeacherList="getTeacherList"></choice> <choice :teacherValue="teacherValues" @getTeacherList="getTeacherList"></choice>
</el-form-item> </el-form-item>
<el-form-item label="标签" required> <el-form-item label="标签" required class="guidance-highlight" data-step="2">
<courseTag ref="courseTag" :courseId="curCourseId" :sysTypeList="sysTypeList" :initialTags="courseTags" @change="handleTagsChange"></courseTag> <courseTag ref="courseTag" :courseId="curCourseId" :sysTypeList="sysTypeList"
:initialTags="courseTags" @change="handleTagsChange"
@focus="onTagFocus">
</courseTag>
</el-form-item> </el-form-item>
<el-form-item label="关键字"> <el-form-item label="关键字">
<el-input v-model.trim="keywords" maxlength="100" @keyup.enter.native="changeKeywords" placeholder="请输入关键字"></el-input> <el-input v-model.trim="keywords" maxlength="100" @keyup.enter.native="changeKeywords" placeholder="请输入关键字"></el-input>
<el-tag v-for="(tag,index) in tips" size="small" :key="index" closable type="info" @close="closeKeywordsTag(tag,index)"> <el-tag v-for="(tag,index) in tips" size="small" :key="index" closable type="info" @close="closeKeywordsTag(tag,index)">
{{ tag }} {{ tag }}
</el-tag> </el-tag>
</el-form-item> </el-form-item>
</el-col> </el-col>
</el-form-item> </el-form-item>
<el-form-item label="资源归属" required> <el-form-item label="资源归属" required>
<el-input placeholder="请选择" v-model="orgName" > <el-input placeholder="请选择" v-model="orgName" >
<el-button v-if="identity==3 || identity==5" @click="showChooseOrg()" slot="append" icon="el-icon-search">选择</el-button> <el-button v-if="identity==3 || identity==5" @click="showChooseOrg()" slot="append" icon="el-icon-search">选择</el-button>
</el-input> </el-input>
</el-form-item> </el-form-item>
<el-form-item label="目标人群" required> <el-form-item label="目标人群" required>
<el-col :span="14"> <el-col :span="14">
@@ -278,13 +327,13 @@
</el-col> </el-col>
<el-col :span="10"> <el-col :span="10">
<el-form-item v-if="visibleShow" label="学员可见"> <el-form-item v-if="visibleShow" label="学员可见">
<el-checkbox v-model="courseInfo.visible"></el-checkbox> <el-checkbox v-model="courseInfo.visible"></el-checkbox>
</el-form-item> </el-form-item>
</el-col> </el-col>
</el-form-item> </el-form-item>
<el-form-item label="受众"><!--:disabled="item.disabled"--> <el-form-item label="受众"><!--:disabled="item.disabled"-->
<el-select value-key="id" style="width: 100%;" v-model="courseCrowds" filterable multiple :clearable="false" @remove-tag="removeCrowd" placeholder="请选择"> <el-select value-key="id" style="width: 100%;" v-model="courseCrowds" filterable multiple :clearable="false" @remove-tag="removeCrowd" placeholder="请选择">
<el-option v-for="item in userGroupList" :key="item.id" :label="item.name" :value="item"></el-option> <el-option v-for="item in userGroupList" :key="item.id" :label="item.name" :value="item"></el-option>
</el-select> </el-select>
</el-form-item> </el-form-item>
<el-form-item label="课程价值"><el-input maxlength="200" v-model="courseInfo.value" show-word-limit placeholder="课程价值(限200字以内)"></el-input></el-form-item> <el-form-item label="课程价值"><el-input maxlength="200" v-model="courseInfo.value" show-word-limit placeholder="课程价值(限200字以内)"></el-input></el-form-item>
@@ -397,8 +446,8 @@
</span> </span>
</el-dialog> </el-dialog>
<el-dialog class="checked-show" :visible.sync="courseInfoFormCheckedShow" top="14vh" width="800px" :show-close="false" :modal="false"> <el-dialog class="checked-show" :visible.sync="courseInfoFormCheckedShow" top="14vh" width="800px" :show-close="false" :modal="false">
<agreement></agreement> <agreement></agreement>
<span slot="footer" class="dialog-footer"> <span slot="footer" class="dialog-footer">
<el-button style="margin-right:10px" type="primary" @click="courseInfoFormCheckedShow = false">确 定</el-button> <el-button style="margin-right:10px" type="primary" @click="courseInfoFormCheckedShow = false">确 定</el-button>
</span> </span>
</el-dialog> </el-dialog>
@@ -536,7 +585,13 @@ export default {
dlgShow: false dlgShow: false
}, },
rightTypeId: {}, rightTypeId: {},
catalogSortDialogShow: false catalogSortDialogShow: false,
// 蒙层引导相关数据
showGuidance: false,
currentStep: 1,
highlightStyle: {},
guidanceElements: [],
isFirstCreate: false, // 标记是否为首次创建
}; };
}, },
created() { created() {
@@ -620,14 +675,14 @@ export default {
this.$emit('change', tags.slice(0, 5)); // 确保传出数据也不超过5个 this.$emit('change', tags.slice(0, 5)); // 确保传出数据也不超过5个
}, },
showChooseOrg(){ showChooseOrg(){
this.$refs.refChooseOrg.dlgShow = true; this.$refs.refChooseOrg.dlgShow = true;
}, },
removeCrowd(e){ removeCrowd(e){
//console.log(e); //console.log(e);
if(e.disabled){ if(e.disabled){
this.$message.error("您不能移除创建人加的受众"); this.$message.error("您不能移除创建人加的受众");
this.courseCrowds.push(e); this.courseCrowds.push(e);
return false; return false;
} }
}, },
confirmChooseOrg(orgInfo,parentInfo){ confirmChooseOrg(orgInfo,parentInfo){
@@ -696,17 +751,17 @@ export default {
// } // }
// }); // });
apiUserBasic.getUserAudiences(params).then(rs=>{ apiUserBasic.getUserAudiences(params).then(rs=>{
if(rs.status==200){ if(rs.status==200){
let crowdList=[]; let crowdList=[];
rs.result.list.forEach(item=>{ rs.result.list.forEach(item=>{
crowdList.push({ crowdList.push({
id:item.id, id:item.id,
name:item.audienceName, name:item.audienceName,
disabled:false disabled:false
}) })
}); });
this.userGroupList=crowdList; this.userGroupList=crowdList;
} }
}) })
}, },
resOwnerName(code) { resOwnerName(code) {
@@ -799,9 +854,9 @@ export default {
if (!editData) { if (!editData) {
this.tips=[]; this.tips=[];
this.courseTags=[], this.courseTags=[],
//console.log("新建课程？"); //console.log("新建课程？");
//以下为了保证初始化处理 //以下为了保证初始化处理
this.weikeReset = Math.round(Math.random()) + ''; this.weikeReset = Math.round(Math.random()) + '';
this.onlineReset = Math.round(Math.random()) + ''; this.onlineReset = Math.round(Math.random()) + '';
this.courseChooseShow = true; this.courseChooseShow = true;
this.biaoke.tabIndex = 'base'; this.biaoke.tabIndex = 'base';
@@ -822,11 +877,11 @@ export default {
// }); // });
apiUserBasic.getOrgInfo(this.courseInfo.orgId).then(rs=>{ apiUserBasic.getOrgInfo(this.courseInfo.orgId).then(rs=>{
if(rs.status==200){ if(rs.status==200){
this.orgName=rs.result.name; this.orgName=rs.result.name;
this.courseInfo.orgName=rs.result.name; this.courseInfo.orgName=rs.result.name;
//this.orgKid=rs.result.kid; //this.orgKid=rs.result.kid;
this.orgNamePath=rs.result.namePath; this.orgNamePath=rs.result.namePath;
} }
}); });
} }
@@ -849,7 +904,7 @@ export default {
}, },
resetCurCourseContent() { resetCurCourseContent() {
this.curContent = { id: '', contentType: 0, contentName: '', content: '', csectionId: '', contentName: '', contentRefId: '', courseId: this.courseInfo.id }; this.curContent = { id: '', contentType: 0, contentName: '', content: '', csectionId: '', contentRefId: '', courseId: this.courseInfo.id };
}, },
// chooseCourseType(item, idx, open) { // chooseCourseType(item, idx, open) {
// this.courseChooseId = item.id; // this.courseChooseId = item.id;
@@ -897,6 +952,12 @@ export default {
this.courseInfo = rs.result; this.courseInfo = rs.result;
this.curCourseId = this.courseInfo.id this.curCourseId = this.courseInfo.id
console.log('保存课程成功',this.curCourseId) console.log('保存课程成功',this.curCourseId)
console.log('isTip ',this.courseInfo.isTip)
if(this.courseInfo.isTip){
// 检查是否为首次创建，显示引导
this.checkAndShowGuidance();
}
if (this.courseChooseId == 1) { if (this.courseChooseId == 1) {
this.weike.dlgShow = true; this.weike.dlgShow = true;
} else { } else {
@@ -904,12 +965,102 @@ export default {
} }
this.$nextTick(() => { this.$nextTick(() => {
this.initTagComponent(); this.initTagComponent();
// 如果显示引导，初始化高亮元素
if (this.showGuidance) {
this.$nextTick(() => {
this.initGuidanceElements();
this.highlightCurrentStep();
});
}
}); });
} else { } else {
this.$message.error(rs.message); this.$message.error(rs.message);
} }
}); });
}, },
// 检查并显示引导
checkAndShowGuidance() {
// 检查本地存储，判断是否为首次创建
const hasShownGuidance = localStorage.getItem('course_creation_guidance_shown');
if (!hasShownGuidance) {
this.showGuidance = true;
this.currentStep = 1;
this.isFirstCreate = true;
// 标记引导已显示
localStorage.setItem('course_creation_guidance_shown', 'true');
apiCourse.saveTip();
}
},
// 初始化引导元素
initGuidanceElements() {
this.guidanceElements = Array.from(document.querySelectorAll('.guidance-highlight'));
},
// 高亮当前步骤对应的元素
highlightCurrentStep() {
if (this.guidanceElements.length === 0) return;
const currentElement = this.guidanceElements[this.currentStep - 1];
if (currentElement) {
const rect = currentElement.getBoundingClientRect();
this.highlightStyle = {
top: `${rect.top}px`,
left: `${rect.left}px`,
width: `${rect.width}px`,
height: `${rect.height}px`,
};
// 滚动到可见区域
currentElement.scrollIntoView({ behavior: 'smooth', block: 'center' });
}
},
// 下一步
nextStep() {
if (this.currentStep < 2) {
this.currentStep++;
this.highlightCurrentStep();
} else {
this.closeGuidance();
}
},
// 上一步
previousStep1() {
if (this.currentStep > 1) {
this.currentStep--;
this.highlightCurrentStep();
}
},
// 关闭引导
closeGuidance() {
this.showGuidance = false;
this.currentStep = 1;
this.highlightStyle = {};
},
// 内容分类获得焦点时的处理
onContentTypeFocus() {
if (this.showGuidance && this.currentStep === 1) {
this.currentStep = 2;
this.highlightCurrentStep();
}
},
// 内容分类改变时的处理
onContentTypeChange() {
if (this.showGuidance && this.currentStep === 1) {
this.currentStep = 2;
this.highlightCurrentStep();
}
},
// 标签获得焦点时的处理
onTagFocus() {
if (this.showGuidance && this.currentStep === 2) {
this.closeGuidance();
}
},
// 新增初始化标签方法 // 新增初始化标签方法
initTagComponent() { initTagComponent() {
if (this.$refs.courseTag) { if (this.$refs.courseTag) {
@@ -956,29 +1107,29 @@ export default {
if(!this.courseInfo.orgId){ if(!this.courseInfo.orgId){
//根据课程创建者获取机构id //根据课程创建者获取机构id
apiUser.getOrgSimpleByUserId(result.course.sysCreateAid).then(ors=>{ apiUser.getOrgSimpleByUserId(result.course.sysCreateAid).then(ors=>{
if(ors.status==200){ if(ors.status==200){
$this.courseInfo.orgId=ors.result.id; $this.courseInfo.orgId=ors.result.id;
// apiOrg.getSimple(ors.result.id).then(rrs=>{ // apiOrg.getSimple(ors.result.id).then(rrs=>{
// if(rrs.status==200){ // if(rrs.status==200){
// $this.orgName=rrs.result.name; // $this.orgName=rrs.result.name;
// $this.orgKid=rrs.result.kid; // $this.orgKid=rrs.result.kid;
// $this.orgNamePath=rrs.result.namePath; // $this.orgNamePath=rrs.result.namePath;
// } // }
// }) // })
apiUserBasic.getOrgInfo(ors.result.id).then(rrs=>{ apiUserBasic.getOrgInfo(ors.result.id).then(rrs=>{
if(rrs.status==200){ if(rrs.status==200){
$this.orgName=rrs.result.name; $this.orgName=rrs.result.name;
this.courseInfo.orgName=rrs.result.name; this.courseInfo.orgName=rrs.result.name;
//$this.orgKid=rrs.result.kid; //$this.orgKid=rrs.result.kid;
$this.orgNamePath=rrs.result.namePath; $this.orgNamePath=rrs.result.namePath;
}else{ }else{
this.courseInfo.orgId=''; this.courseInfo.orgId='';
//this.$message.error('资源归属已变更，请重新选择'); //this.$message.error('资源归属已变更，请重新选择');
} }
}) })
}else{ }else{
//this.$message.error('无机构关联，不需要提示'); //this.$message.error('无机构关联，不需要提示');
} }
}) })
}else{ }else{
@@ -994,14 +1145,14 @@ export default {
// }); // });
apiUserBasic.getOrgInfo(this.courseInfo.orgId).then(rs=>{ apiUserBasic.getOrgInfo(this.courseInfo.orgId).then(rs=>{
if(rs.status==200){ if(rs.status==200){
$this.orgName=rs.result.name; $this.orgName=rs.result.name;
$this.courseInfo.orgName=rs.result.name; $this.courseInfo.orgName=rs.result.name;
//$this.orgKid=rs.result.kid; //$this.orgKid=rs.result.kid;
$this.orgNamePath=rs.result.namePath; $this.orgNamePath=rs.result.namePath;
}else{ }else{
$this.courseInfo.orgId=''; $this.courseInfo.orgId='';
$this.$message.error('资源归属已变更，请重新选择'); $this.$message.error('资源归属已变更，请重新选择');
} }
}); });
} }
this.resOwnerArray=[]; this.resOwnerArray=[];
@@ -1016,33 +1167,33 @@ export default {
} }
this.sysTypeList=[]; this.sysTypeList=[];
if(result.course.sysType1!='' && result.course.sysType1!='0'){ if(result.course.sysType1!='' && result.course.sysType1!='0'){
this.sysTypeList.push(result.course.sysType1); this.sysTypeList.push(result.course.sysType1);
} }
if(result.course.sysType2!='' && result.course.sysType2!='0'){ if(result.course.sysType2!='' && result.course.sysType2!='0'){
this.sysTypeList.push(result.course.sysType2); this.sysTypeList.push(result.course.sysType2);
} }
if(result.course.sysType3!='' && result.course.sysType3!='0'){ if(result.course.sysType3!='' && result.course.sysType3!='0'){
this.sysTypeList.push(result.course.sysType3); this.sysTypeList.push(result.course.sysType3);
} }
//console.log(this.sysTypeList,'this.sysTypeList'); //console.log(this.sysTypeList,'this.sysTypeList');
//受众处理，crowds //受众处理，crowds
let crowdList=[]; let crowdList=[];
if(result.crowds && result.crowds.length>0){ if(result.crowds && result.crowds.length>0){
result.crowds.forEach(crowd=>{ result.crowds.forEach(crowd=>{
let newCrowd={ let newCrowd={
id:crowd.groupId, id:crowd.groupId,
name:crowd.groupName, name:crowd.groupName,
disabled:false disabled:false
} }
crowdList.push(newCrowd); crowdList.push(newCrowd);
let hasUG=$this.userGroupList.some(ug=>{ let hasUG=$this.userGroupList.some(ug=>{
return ug.id==crowd.groupId; return ug.id==crowd.groupId;
});
if(!hasUG){
newCrowd.disabled=true;
$this.userGroupList.push(newCrowd);
}
}); });
if(!hasUG){
newCrowd.disabled=true;
$this.userGroupList.push(newCrowd);
}
});
} }
this.courseCrowds=crowdList; this.courseCrowds=crowdList;
//反向看userGroupList是否有 //反向看userGroupList是否有
@@ -1110,7 +1261,7 @@ export default {
inputValue: sec.name, inputValue: sec.name,
confirmButtonText: '确定', confirmButtonText: '确定',
cancelButtonText: '取消', cancelButtonText: '取消',
inputPattern:/^(a-z|A-Z|0-9)*[^$%^&*;:,<>?()\""\']{1,20}$/, inputPattern:/^(a-z|A-Z|0-9)*[^$%^&*;:,<>?()\""\']{1,20}$/,
inputErrorMessage:'不要超过20个字' inputErrorMessage:'不要超过20个字'
}) })
.then(({ value }) => { .then(({ value }) => {
@@ -1171,7 +1322,7 @@ export default {
let order = []; let order = [];
if(cha.contents.length > 0) { if(cha.contents.length > 0) {
cha.contents.forEach(con=>{ cha.contents.forEach(con=>{
order.push(con.sortIndex); order.push(con.sortIndex);
}) })
let addOrder = order.sort(function(a,b) {return b-a;}) let addOrder = order.sort(function(a,b) {return b-a;})
this.addOrder = addOrder[0] + 1; this.addOrder = addOrder[0] + 1;
@@ -1339,9 +1490,9 @@ export default {
if(this.curContent.id == '') {// 新增 if(this.curContent.id == '') {// 新增
if(this.curContent.contentType == 60) { // 判断作业是否保存 if(this.curContent.contentType == 60) { // 判断作业是否保存
if(courseware.homework.content || courseware.homework.name || courseware.homework.deadTime){ if(courseware.homework.content || courseware.homework.name || courseware.homework.deadTime){
pass = false; pass = false;
} }
} else if(this.curContent.contentType == 61) { //考试 } else if(this.curContent.contentType == 61) { //考试
// if(courseware.exam.paperContent != '') { // if(courseware.exam.paperContent != '') {
@@ -1352,11 +1503,11 @@ export default {
// } // }
}else if(this.curContent.contentType == 41) { //图文 }else if(this.curContent.contentType == 41) { //图文
if(courseware.htmlContent.length > 7){ if(courseware.htmlContent.length > 7){
pass = false; pass = false;
} }
}else if(this.curContent.contentType == 52) { //外部链接 }else if(this.curContent.contentType == 52) { //外部链接
if(courseware.linkInfo.url != '') { if(courseware.linkInfo.url != '') {
pass = false; pass = false;
} }
} }
} else {// 编辑 } else {// 编辑
@@ -1371,15 +1522,15 @@ export default {
// } // }
} else if(this.curContent.contentType == 41) { //图文 } else if(this.curContent.contentType == 41) { //图文
if(this.curContent.content !== courseware.htmlContent) { if(this.curContent.content !== courseware.htmlContent) {
pass = false; pass = false;
} }
} else if(this.curContent.contentType == 52) { //外部链接 } else if(this.curContent.contentType == 52) { //外部链接
if(this.curContent.content !== JSON.stringify(courseware.linkInfo)) { if(this.curContent.content !== JSON.stringify(courseware.linkInfo)) {
pass = false; pass = false;
} }
} else if(this.curContent.contentType == 10 || this.curContent.contentType == 20) {// 视频 } else if(this.curContent.contentType == 10 || this.curContent.contentType == 20) {// 视频
if(this.curContent.content !== JSON.stringify(courseware.curriculumData)) { if(this.curContent.content !== JSON.stringify(courseware.curriculumData)) {
pass = false; pass = false;
} }
} }
} }
@@ -1541,61 +1692,61 @@ export default {
//2023-1-5 对于默认管理员，不需要提交hrbp。直接提交并发布 //2023-1-5 对于默认管理员，不需要提交hrbp。直接提交并发布
let adminType=this.userInfo.adminType; let adminType=this.userInfo.adminType;
if(adminType==1){ //默认管理员,直接审核通过 if(adminType==1){ //默认管理员,直接审核通过
apiCourseAudit.submitAndPublish(postData).then(res=>{ apiCourseAudit.submitAndPublish(postData).then(res=>{
setTimeout(function() { setTimeout(function() {
$this.btnLoading = false; $this.btnLoading = false;
}, 1000); }, 1000);
if (res.status === 200) { if (res.status === 200) {
//提交成功，直接关闭当前窗口 //提交成功，直接关闭当前窗口
this.$message.success('提交成功！！！'); this.$message.success('提交成功！！！');
} else { } else {
this.$message.error(res.message); this.$message.error(res.message);
} }
this.biaoke.dlgShow = false; this.biaoke.dlgShow = false;
this.weike.dlgShow = false; this.weike.dlgShow = false;
this.$emit('submitSuccess'); this.$emit('submitSuccess');
}); });
}else{ }else{
//先获取HRBP审核 人员信息，姓名，机构路径，工号，用于邮件中的信息 //先获取HRBP审核 人员信息，姓名，机构路径，工号，用于邮件中的信息
apiUserBasic.getOrgHrbpInfo(this.courseInfo.orgId).then(rs=>{ apiUserBasic.getOrgHrbpInfo(this.courseInfo.orgId).then(rs=>{
if(rs.status==200 && rs.result){ if(rs.status==200 && rs.result){
postData.auditUser={ postData.auditUser={
email:rs.result.email, email:rs.result.email,
code:rs.result.userNo, code:rs.result.userNo,
name:rs.result.name, name:rs.result.name,
aid:rs.result.id, aid:rs.result.id,
orgId:rs.result.orgId orgId:rs.result.orgId
}
//下面的机构名称，路径不对，应该取课程的资源归属（机构）的路径
postData.course.orgName=rs.result.orgNamePath+'/'+rs.result.orgName;
apiCourse.submitCourse(postData).then(res => {
//this.btnLoading=false;
setTimeout(function() {
$this.btnLoading = false;
}, 1000);
if (res.status === 200) {
//提交成功，直接关闭当前窗口
this.$message.success('提交成功！！！');
this.biaoke.dlgShow = false;
this.weike.dlgShow = false;
//提交成功回调处理
this.$emit('submitSuccess');
} else {
this.$message.error(res.message);
this.biaoke.dlgShow = false;
this.weike.dlgShow = false;
this.$emit('submitSuccess');
}
});
}else{
$this.btnLoading = false;
this.$message.error('获取审核HRBP失败:'+rs.message);
} }
}).catch(err=>{ //下面的机构名称，路径不对，应该取课程的资源归属（机构）的路径
//this.$message.error('获取审核HRBP失败:'+err); postData.course.orgName=rs.result.orgNamePath+'/'+rs.result.orgName;
this.$message.error('获取审核HRBP失败，请检查资源归属下是否有HRBP审核人员'); apiCourse.submitCourse(postData).then(res => {
$this.btnLoading = false; //this.btnLoading=false;
}) setTimeout(function() {
$this.btnLoading = false;
}, 1000);
if (res.status === 200) {
//提交成功，直接关闭当前窗口
this.$message.success('提交成功！！！');
this.biaoke.dlgShow = false;
this.weike.dlgShow = false;
//提交成功回调处理
this.$emit('submitSuccess');
} else {
this.$message.error(res.message);
this.biaoke.dlgShow = false;
this.weike.dlgShow = false;
this.$emit('submitSuccess');
}
});
}else{
$this.btnLoading = false;
this.$message.error('获取审核HRBP失败:'+rs.message);
}
}).catch(err=>{
//this.$message.error('获取审核HRBP失败:'+err);
this.$message.error('获取审核HRBP失败，请检查资源归属下是否有HRBP审核人员');
$this.btnLoading = false;
})
} }
}, },
// 教师列标，远程查询 // 教师列标，远程查询
@@ -1704,19 +1855,19 @@ export default {
</script> </script>
<style lang="scss" scoped> <style lang="scss" scoped>
.red-tip{ .red-tip{
margin-top: 8px; margin-top: 8px;
color: red; color: red;
font-size: 14px; font-size: 14px;
float: left; float: left;
font-weight: 600; font-weight: 600;
} }
::v-deep .wei-from{ ::v-deep .wei-from{
.el-form-item{ .el-form-item{
margin-bottom: 10px; margin-bottom: 10px;
} }
.el-textarea__inner{ .el-textarea__inner{
padding-right: 40px; padding-right: 40px;
} }
} }
::v-deep .checked-show{ ::v-deep .checked-show{
@@ -1725,9 +1876,9 @@ export default {
} }
} }
.el-dialog__body { .el-dialog__body {
padding: 10px 10px; padding: 10px 10px;
// overflow-y: auto; // overflow-y: auto;
max-height: calc(70vh - 140px); max-height: calc(70vh - 140px);
} }
.example { .example {
height: 100%; height: 100%;
@@ -1780,8 +1931,8 @@ export default {
margin-left: 5px; margin-left: 5px;
} }
.tip{ .tip{
font-size: 16px; font-size: 16px;
color:#ffb30f; color:#ffb30f;
} }
.cctree { .cctree {
.cctree-chapter { .cctree-chapter {
@@ -1807,13 +1958,109 @@ export default {
</style> </style>
<style lang="scss"> <style lang="scss">
.cusprompt{ .cusprompt{
padding: 20px 30px; padding: 20px 30px;
.el-message-box__content{ .el-message-box__content{
margin-top: 30px; margin-top: 30px;
.el-message-box__input{ .el-message-box__input{
} }
}
} }
}
/* 蒙层样式 */
.guidance-overlay {
position: fixed;
top: 0;
left: 0;
width: 100%;
height: 100%;
background: rgba(0, 0, 0, 0.6);
z-index: 9999;
display: flex;
justify-content: center;
align-items: center;
}
.guidance-content {
background: white;
border-radius: 8px;
padding: 24px;
max-width: 500px;
box-shadow: 0 4px 20px rgba(0, 0, 0, 0.15);
z-index: 10000;
}
.guidance-title {
font-size: 18px;
font-weight: bold;
margin-bottom: 20px;
text-align: center;
}
.guidance-steps {
margin-bottom: 20px;
}
.guidance-step {
display: flex;
align-items: flex-start;
margin-bottom: 16px;
opacity: 0.5;
transition: opacity 0.3s;
}
.guidance-step.active {
opacity: 1;
}
.step-number {
width: 24px;
height: 24px;
background: #409EFF;
color: white;
border-radius: 50%;
display: flex;
align-items: center;
justify-content: center;
margin-right: 12px;
font-size: 14px;
}
.step-content {
flex: 1;
}
.step-title {
font-weight: bold;
margin-bottom: 4px;
}
.step-desc {
color: #666;
font-size: 14px;
}
.guidance-actions {
display: flex;
justify-content: center;
gap: 12px;
}
/* 高亮元素样式 */
.highlight-element {
position: fixed;
border: 2px solid #409EFF;
border-radius: 4px;
box-shadow: 0 0 0 9999px rgba(0, 0, 0, 0.4), 0 0 15px rgba(64, 158, 255, 0.5);
z-index: 9998;
pointer-events: none;
transition: all 0.3s ease;
}
/* 被高亮元素的样式 */
.guidance-highlight {
position: relative;
z-index: 10001;
}
</style> </style>

40
src/components/Course/courseTag.vue
View File

@@ -1,23 +1,22 @@
<template> <template>
<div class="tag-container"> <div class="tag-container" @click="handleContainerClick">
<el-select style="width: 100%;" <el-select style="width: 100%;"
v-model="selectedTags" v-model="selectedTags"
multiple multiple
filterable filterable
value-key="id" value-key="id"
remote remote
reserve-keyword reserve-keyword
:remote-method="debouncedSearch" :remote-method="debouncedSearch"
:loading="loading" :loading="loading"
:placeholder="'回车创建新标签'" :placeholder="'回车创建新标签'"
:no-data-text="'无此标签，按回车键创建'" :no-data-text="'无此标签，按回车键创建'"
@remove-tag="handleTagRemove" @remove-tag="handleTagRemove"
@change="handleSelectionChange" @change="handleSelectionChange"
@keyup.enter.native="handleEnterKey" @keyup.enter.native="handleEnterKey"
@keyup.delete.native="handleDeleteKey" @keyup.delete.native="handleDeleteKey"
@focus="handleFocus" @focus="handleFocus"
ref="tagSelect" ref="tagSelect"
> >
<el-option <el-option
v-for="item in searchResults" v-for="item in searchResults"
@@ -142,6 +141,11 @@ export default {
if (this.sysTypeList.length > 0) { if (this.sysTypeList.length > 0) {
await this.doSearch(''); await this.doSearch('');
} }
this.$emit('focus');
},
handleContainerClick() {
// 容器点击时也触发焦点事件
this.$emit('focus');
}, },
// 新增：重置标签状态的方法 // 新增：重置标签状态的方法
resetTagState() { resetTagState() {