Commit f211ab6e authored by Mac's avatar Mac

提交了课程的新增图标 背景色 和重点

parent 841e9502
...@@ -17,6 +17,7 @@ ...@@ -17,6 +17,7 @@
"benz-amr-recorder": "^1.1.3", "benz-amr-recorder": "^1.1.3",
"browser-md5-file": "^1.0.0", "browser-md5-file": "^1.0.0",
"co": "^4.6.0", "co": "^4.6.0",
"colorthief": "^2.3.2",
"core-js": "^3.6.5", "core-js": "^3.6.5",
"cos-js-sdk-v5": "^1.1.5", "cos-js-sdk-v5": "^1.1.5",
"echarts": "^5.1.2", "echarts": "^5.1.2",
......
...@@ -620,4 +620,15 @@ export function SetImportCourse(data) { ...@@ -620,4 +620,15 @@ export function SetImportCourse(data) {
method: 'post', method: 'post',
data data
}) })
}
/**
* 保存选择 以导入
* @param {JSON对象} data
*/
export function getCourseEmphasisEnumList(data) {
return request({
url: '/course/GetCourseEmphasisEnumList',
method: 'post',
data
})
} }
\ No newline at end of file
...@@ -20,7 +20,7 @@ ...@@ -20,7 +20,7 @@
<q-uploader :style="{ backgroundImage: 'url(' + objOption.CoverImg + ')' }" <q-uploader :style="{ backgroundImage: 'url(' + objOption.CoverImg + ')' }"
style="width: auto; height: 139px" flat hide-upload-btn max-files="1" label="课程封面" accept=".jpg, image/*" style="width: auto; height: 139px" flat hide-upload-btn max-files="1" label="课程封面" accept=".jpg, image/*"
:factory="uploadFile" auto-upload> :factory="uploadFile" auto-upload>
</q-uploader> </q-uploader>
</div> </div>
<div class="col-6 q-pr-lg q-pb-lg"> <div class="col-6 q-pr-lg q-pb-lg">
<q-input v-model="objOption.CourseFeature" filled type="textarea" placeholder="课程特色" /> <q-input v-model="objOption.CourseFeature" filled type="textarea" placeholder="课程特色" />
...@@ -104,6 +104,35 @@ ...@@ -104,6 +104,35 @@
map-options /> map-options />
</div> </div>
</div> </div>
<div class="row wrap">
<div class="col-6">
<q-select filled stack-label option-value="Id" option-label="Name" v-model="CourseEmphasis" multiple use-chips
ref="CourseEmphasis" :options="keynoteList" label="课程重点" class="col-6 q-pr-lg q-pb-lg" emit-value
map-options />
</div>
<div class="col-6 q-pb-lg q-pr-lg">
<q-uploader :style="{ backgroundImage: 'url(' + objOption.B2BIcon + ')' }"
style="width: auto; height: 139px" flat hide-upload-btn max-files="1" label="图标" accept=".jpg, image/*"
:factory="uploadFile2" auto-upload>
</q-uploader>
<q-input
filled
label="背景颜色"
v-model="objOption.B2BBackground"
:rules="['anyColor']"
class="my-input"
>
<template v-slot:append>
<q-icon name="colorize" class="cursor-pointer">
<q-popup-proxy transition-show="scale" transition-hide="scale">
<q-color v-model="objOption.B2BBackground" />
</q-popup-proxy>
</q-icon>
</template>
</q-input>
<img id="background" :src="objOption.B2BIcon" height="100" width="100" crossorigin="anonymous" style="display:none"/>
</div>
</div>
<div class="text-caption q-my-md q-px-xs text-grey-6">课程介绍</div> <div class="text-caption q-my-md q-px-xs text-grey-6">课程介绍</div>
<ext-editor :defaultMsg="objOption.CourseIntro" classStr="col-12" @getEditValue="getEditValue"></ext-editor> <ext-editor :defaultMsg="objOption.CourseIntro" classStr="col-12" @getEditValue="getEditValue"></ext-editor>
<div class="row wrap"> <div class="row wrap">
...@@ -138,6 +167,7 @@ ...@@ -138,6 +167,7 @@
</template> </template>
<script> <script>
import ColorThief from "colorthief";
import { import {
queryCourseCategoryTree, queryCourseCategoryTree,
saveCourseInfo, saveCourseInfo,
...@@ -145,6 +175,7 @@ ...@@ -145,6 +175,7 @@
querySaleplatList, querySaleplatList,
getCourseRate, getCourseRate,
getCourseSubject, getCourseSubject,
getCourseEmphasisEnumList
} from "../../api/course/index"; } from "../../api/course/index";
import { import {
getTeacherDropDownList getTeacherDropDownList
...@@ -190,7 +221,11 @@ ...@@ -190,7 +221,11 @@
CategoryList: [], CategoryList: [],
CourseRate: "", //课程等级 CourseRate: "", //课程等级
CourseSubject: "", //课程科目 CourseSubject: "", //课程科目
B2BIcon:'',//图标
B2BBackground:'',//背景
CourseEmphasis:[],//课程重点 多选 英文逗号分隔
}, },
CourseEmphasis:[],//数据临时存放
optionTitle: "", optionTitle: "",
defaultArray: [], defaultArray: [],
ladderPriceList: [], //阶梯定价数组 ladderPriceList: [], //阶梯定价数组
...@@ -206,6 +241,7 @@ ...@@ -206,6 +241,7 @@
modifyClassifyList: [], //修改时返回的分类列表 modifyClassifyList: [], //修改时返回的分类列表
courseLevelList: [], //课程等级列表 courseLevelList: [], //课程等级列表
courseSubjectList: [], //课程科目列表 courseSubjectList: [], //课程科目列表
keynoteList:[],//重点枚举列表
}; };
}, },
created() { created() {
...@@ -213,6 +249,7 @@ ...@@ -213,6 +249,7 @@
this.getSaleplat(); this.getSaleplat();
this.getGoodsClassify(); this.getGoodsClassify();
this.getCourseRateList(); this.getCourseRateList();
this.getCourseEmphasisList();//获取课程重点枚举列表
}, },
computed: mapState({ computed: mapState({
isHaveCourseHoursEdit(state) { isHaveCourseHoursEdit(state) {
...@@ -265,6 +302,16 @@ ...@@ -265,6 +302,16 @@
} }
}) })
}, },
getCourseEmphasisList(){
getCourseEmphasisEnumList({}).then((res) => {
if (res.Code == 1) {
this.keynoteList = res.Data;
this.keynoteList.map((x)=>{
this.CourseEmphasis.push(x.Id)
})
}
});
},
//获取教师下拉 //获取教师下拉
GetTeacherList() { GetTeacherList() {
getTeacherDropDownList({}).then((res) => { getTeacherDropDownList({}).then((res) => {
...@@ -297,6 +344,37 @@ ...@@ -297,6 +344,37 @@
} }
}); });
}, },
uploadFile2(files){
UploadSelfFile("course", files[0], (res) => {
if (res.Code == 1) {
this.objOption.B2BIcon = res.FileUrl;
this.ImgColor();
}
});
},
ImgColor() {//获取图标上传的主色
let domImg = document.querySelector('#background');
let colorthief = new ColorThief();
domImg.addEventListener('load', () => {
// console.log('加载好了并取色', colorthief.getPalette(domImg));//第二个参数可选(1~10)
// console.log('加载好了并取色', colorthief.getColor(domImg));//第二个参数可选(1~10)
let color = colorthief.getColor(domImg)
this.objOption.B2BBackground = this.rgb2Hex(color[0],color[1],color[2])
})
},
rgb2Hex(r,g,b){//rhg转化为16进制
r = Math.max(Math.min(Number(r), 100), 0) * 2.55
g = Math.max(Math.min(Number(g), 100), 0) * 2.55
b = Math.max(Math.min(Number(b), 100), 0) * 2.55
r = ('0' + (Math.round(r) || 0).toString(16)).slice(-2)
g = ('0' + (Math.round(g) || 0).toString(16)).slice(-2)
b = ('0' + (Math.round(b) || 0).toString(16)).slice(-2)
return '#' + r + g + b
},
getCategorytree() { getCategorytree() {
this.TreeCategoryList = []; this.TreeCategoryList = [];
var qMsg = {}; var qMsg = {};
...@@ -351,6 +429,17 @@ ...@@ -351,6 +429,17 @@
this.objOption.IsKCourse = res.Data.IsKCourse; this.objOption.IsKCourse = res.Data.IsKCourse;
this.objOption.CourseRate = res.Data.CourseRate; this.objOption.CourseRate = res.Data.CourseRate;
this.objOption.CourseSubject = res.Data.CourseSubject; this.objOption.CourseSubject = res.Data.CourseSubject;
this.objOption.B2BIcon = res.Data.B2BIcon ;
this.objOption.B2BBackground = res.Data.B2BBackground;
this.objOption.CourseEmphasis = res.Data.CourseEmphasis;
if(this.objOption.CourseEmphasis && this.objOption.CourseEmphasis!=''){
this.CourseEmphasis=this.objOption.CourseEmphasis.split(",")
}else{
this.CourseEmphasis=[]
this.keynoteList.map((x)=>{
this.CourseEmphasis.push(x.Id)
})
}
if (res.Data.StepPriceList && res.Data.StepPriceList.length > 0) { if (res.Data.StepPriceList && res.Data.StepPriceList.length > 0) {
this.ladderPriceList = res.Data.StepPriceList; this.ladderPriceList = res.Data.StepPriceList;
} }
...@@ -431,6 +520,11 @@ ...@@ -431,6 +520,11 @@
this.objOption.StepPriceList = this.ladderPriceList; this.objOption.StepPriceList = this.ladderPriceList;
this.objOption.Teacher_Ids = Teacher_Ids; this.objOption.Teacher_Ids = Teacher_Ids;
this.objOption.Saleplat = salePlat; this.objOption.Saleplat = salePlat;
if(this.CourseEmphasis.length>0){
this.objOption.CourseEmphasis = this.CourseEmphasis.join(',')
}else{
this.objOption.CourseEmphasis =''
}
saveCourseInfo(this.objOption) saveCourseInfo(this.objOption)
.then((res) => { .then((res) => {
this.saveCourseLoading = false; this.saveCourseLoading = false;
......
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment