Skip to content

C
confucius
Commit a720f723 authored by 罗超's avatar 罗超
Browse files
Options

修改教育页面

parent 17fc05c2
Hide whitespace changes
Inline Side-by-side
Showing with 782 additions and 297 deletions
quasar.conf.js
View file @ a720f723
...@@ -48,7 +48,7 @@ module.exports = function (ctx) { ...@@ -48,7 +48,7 @@ module.exports = function (ctx) {
build: { build: {
vueRouterMode: 'hash', // available values: 'hash', 'history' vueRouterMode: 'hash', // available values: 'hash', 'history'
env: ctx.dev ? { env: ctx.dev ? {
API: 'http://192.168.1.13:8085/api' API: 'http://192.168.1.27:8300/api'
} : { } : {
API: 'http://eduapi.oytour.com/api' API: 'http://eduapi.oytour.com/api'
}, },
......
src/components/course/course-form.vue
View file @ a720f723
...@@ -17,8 +17,8 @@ ...@@ -17,8 +17,8 @@
map-options multiple /> map-options multiple />
</div> </div>
<div class="row wrap"> <div class="row wrap">
<div class="col-6 q-pb-lg"> <div class="col-6 q-pb-lg q-pr-lg">
<q-uploader :style="{backgroundImage:'url(' + objOption.CoverImg + ')'}" flat hide-upload-btn max-files="1" <q-uploader :style="{backgroundImage:'url(' + objOption.CoverImg + ')'}" style="width:auto;height:139px" flat hide-upload-btn max-files="1"
label="课程封面" accept=".jpg, image/*" :factory="uploadFile" auto-upload> label="课程封面" accept=".jpg, image/*" :factory="uploadFile" auto-upload>
</q-uploader> </q-uploader>
</div> </div>
...@@ -81,6 +81,14 @@ ...@@ -81,6 +81,14 @@
:rules="[val => !!val || '请填写续费售价']" /> :rules="[val => !!val || '请填写续费售价']" />
</div> </div>
</div> </div>
<div class="row wrap">
<div class="col-6">
<q-input filled stack-label maxlength="8" :dense="false" mask="#" fill-mask="0"
reverse-fill-mask v-model="objOption.ClassHours" ref="ClassHours"
class="col-6 q-pr-lg q-pb-lg" label="课时数量"
:rules="[val => !!val || '请填写课时信息']" />
</div>
</div>
<div class="text-caption q-my-md q-px-xs text-grey-6">课程介绍 <div class="text-caption q-my-md q-px-xs text-grey-6">课程介绍
</div> </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>
...@@ -153,6 +161,7 @@ ...@@ -153,6 +161,7 @@
RenewSlPrice: 0, //续费售价 RenewSlPrice: 0, //续费售价
Saleplat: "", //销售平台 Saleplat: "", //销售平台
IsKCourse: 0, //是否是K12课程(1-是) IsKCourse: 0, //是否是K12课程(1-是)
ClassHours:0
}, },
optionTitle: "", optionTitle: "",
defaultArray: [], defaultArray: [],
...@@ -248,6 +257,7 @@ ...@@ -248,6 +257,7 @@
this.objOption.CourseFeature = res.Data.CourseFeature; this.objOption.CourseFeature = res.Data.CourseFeature;
this.objOption.OriginalPrice = res.Data.OriginalPrice; this.objOption.OriginalPrice = res.Data.OriginalPrice;
this.objOption.SellPrice = res.Data.SellPrice; this.objOption.SellPrice = res.Data.SellPrice;
this.objOption.ClassHours=res.Data.ClassHours;
this.objOption.IsOpenStepPrice = res.Data.IsOpenStepPrice; this.objOption.IsOpenStepPrice = res.Data.IsOpenStepPrice;
this.objOption.IsRenew = res.Data.IsRenew; this.objOption.IsRenew = res.Data.IsRenew;
this.objOption.RenewOgPrice = res.Data.RenewOgPrice; this.objOption.RenewOgPrice = res.Data.RenewOgPrice;
...@@ -278,6 +288,7 @@ ...@@ -278,6 +288,7 @@
this.objOption.CourseFeature = ""; this.objOption.CourseFeature = "";
this.objOption.OriginalPrice = 0; this.objOption.OriginalPrice = 0;
this.objOption.SellPrice = 0; this.objOption.SellPrice = 0;
this.objOption.ClassHours=0
this.objOption.IsOpenStepPrice = 0; this.objOption.IsOpenStepPrice = 0;
this.objOption.IsRenew = 0; this.objOption.IsRenew = 0;
this.objOption.RenewOgPrice = 0; this.objOption.RenewOgPrice = 0;
...@@ -294,7 +305,8 @@ ...@@ -294,7 +305,8 @@
//保存菜单 //保存菜单
saveCourse() { saveCourse() {
this.$refs.CourseName.validate(); this.$refs.CourseName.validate();
if (!this.$refs.CourseName.hasError) { this.$refs.ClassHours.validate();
if (!this.$refs.CourseName.hasError&&!this.$refs.ClassHours.hasError) {
this.saveCourseLoading = true; this.saveCourseLoading = true;
var Teacher_Ids = ""; var Teacher_Ids = "";
if (this.chooseTeacher && this.chooseTeacher.length > 0) { if (this.chooseTeacher && this.chooseTeacher.length > 0) {
......
src/pages/course/course.vue
View file @ a720f723
...@@ -28,9 +28,13 @@ ...@@ -28,9 +28,13 @@
</template> </template>
<template v-slot:body-cell-CoverImg="props"> <template v-slot:body-cell-CoverImg="props">
<q-td :props="props"> <q-td :props="props">
<q-avatar square size="100px"> <q-img
<img v-if="props.value" :src="props.value" /> :src="props.value"
</q-avatar> spinner-color="white"
style="height: 54px; max-width: 100px"
class="rounded-borders"
>
</q-img>
</q-td> </q-td>
</template> </template>
<template v-slot:body-cell-CourseIntro="props"> <template v-slot:body-cell-CourseIntro="props">
...@@ -38,6 +42,30 @@ ...@@ -38,6 +42,30 @@
<span v-html="props.value"></span> <span v-html="props.value"></span>
</q-td> </q-td>
</template> </template>
<template v-slot:body-cell-PreferentialList="props">
<q-td :props="props" style="padding-right:0px">
<div v-for="x in props.value">
<div class="border-bottom" v-if="x.PriceDiscountType==1">买{{x.BuyNum}}送{{x.SendNum}}</div>
<div class="border-bottom" v-if="x.PriceDiscountType==2">单人报名享{{100-x.PriceMoney}}折优惠</div>
<div class="border-bottom" v-if="x.PriceDiscountType==3">双人报名享{{100-x.PriceMoney}}折优惠</div>
<div class="border-bottom" v-if="x.PriceDiscountType==4">续费享{{100-x.PriceMoney}}折优惠</div>
</div>
</q-td>
</template>
<template v-slot:body-cell-PreferentialListSellCommission="props">
<q-td :props="props" style="padding-right:0px;padding-left:0px">
<div v-for="x in props.value">
<div class="border-bottom" style="padding-left: 16px;padding-right: 16px">{{x.SaleCommissionMoney}}%</div>
</div>
</q-td>
</template>
<template v-slot:body-cell-PreferentialListB2BCommission="props">
<q-td :props="props" style="padding-left:0px">
<div v-for="x in props.value">
<div class="border-bottom" style="padding-left: 16px">{{x.B2BCommissionMoney}}%</div>
</div>
</q-td>
</template>
<template v-slot:body-cell-Status="props"> <template v-slot:body-cell-Status="props">
<q-td :props="props"> <q-td :props="props">
<q-badge :color="props.value==1?'negative':'primary'" :label="props.value==0?'正常':'禁用'" /> <q-badge :color="props.value==1?'negative':'primary'" :label="props.value==0?'正常':'禁用'" />
...@@ -87,12 +115,19 @@ ...@@ -87,12 +115,19 @@
data() { data() {
return { return {
currentUrl: "", currentUrl: "",
columns: [{ columns: [
name: 'CourseId', {
label: '课程编号', name: 'CoverImg',
field: 'CourseId', label: '课程封面',
field: 'CoverImg',
align: 'left' align: 'left'
}, },
// {
// name: 'CourseId',
// label: '课程编号',
// field: 'CourseId',
// align: 'left'
// },
{ {
name: 'CourseName', name: 'CourseName',
required: true, required: true,
...@@ -101,12 +136,40 @@ ...@@ -101,12 +136,40 @@
field: row => row.CourseName field: row => row.CourseName
}, },
{ {
name: 'CoverImg', name: 'OriginalPrice',
label: '课程封面', required: true,
field: 'CoverImg', label: '原价',
align: 'left' align: 'left',
field: row => row.OriginalPrice.toFixed(2)
},
{
name: 'SellPrice',
required: true,
label: '售价',
align: 'left',
field: row => row.SellPrice.toFixed(2)
},
{
name: 'PreferentialList',
required: true,
label: '优惠政策',
align: 'left',
field: row => row.PreferentialList
},
{
name: 'PreferentialListSellCommission',
required: true,
label: '销售佣金',
align: 'left',
field: row => row.PreferentialList
},
{
name: 'PreferentialListB2BCommission',
required: true,
label: '销售佣金',
align: 'left',
field: row => row.PreferentialList
}, },
{ {
name: 'CreateByName', name: 'CreateByName',
label: '创建人', label: '创建人',
...@@ -152,6 +215,7 @@ ...@@ -152,6 +215,7 @@
rowsPerPage: 12, rowsPerPage: 12,
CourseName: "", CourseName: "",
QCateIds: "", QCateIds: "",
  IsQPrice: 1,
Status: "-1", Status: "-1",
}, },
//课程分类树形列表 //课程分类树形列表
...@@ -251,5 +315,8 @@ ...@@ -251,5 +315,8 @@
</script> </script>
<style lang="sass"> <style lang="sass">
@import url('~assets/css/table.sass') @import url('~assets/css/table.sass')
.border-bottom
border-bottom: 1px dashed #EEE
padding-bottom: 5px
margin-bottom: 5px
</style> </style>
src/pages/sale/courseList copy.vue 0 → 100644
View file @ a720f723
<style>
li {
list-style-type: none;
}
.courseList ul {
padding: 0px
}
.courseList li {
background: rgba(221, 222, 224, 0.2);
border-radius: 4px;
margin-top: 15px
}
.courseList li .dline {
display: table;
width: 100%;
display: flex;
flex-direction: row
}
.courseList li .d1,
.courseList li .d2,
.courseList li .d3,
.courseList li .d4,
.courseList li .d5 {
width: 18%;
padding: 20px 20px 10px;
}
.courseList li .d7 {
flex: 1;
width: 1px;
display: flex;
flex-direction: row;
align-items: center;
justify-content: center
}
.courseList li .d1 .di-title {
font-size: 16px;
color: #111111;
}
.courseList li .d1 .di-c {
font-size: 14px;
display: flex;
line-height: 28px;
color: #111111
}
.courseList li .d6 {
padding: 10px 20px;
width: 100%;
height: inherit;
position: relative;
border-top: 1px solid #DDDEE0
}
.courseList li .d6 .progress {
width: 100%;
height: 5px;
position: absolute;
left: 0;
bottom: 0
}
.courseList li .d2 div {
margin: 2px 0;
font-size: 14px;
color: #111111;
}
.courseList li .d2-n {
font-size: 12px;
color: #999999;
margin-right: 20px
}
.courseList li .d3 .d3-s {
color: var(--q-color-negative);
font-weight: bold
}
.courseList li .d3 div {
margin: 2px 0;
font-size: 14px;
}
.courseList li .d4 div {
font-size: 14px;
color: #111111;
margin: 2px 0;
}
.courseList li .d5 div {
font-size: 14px;
color: #111111;
margin: 2px 0;
}
.courseList .myCourseNName {
width: 25px;
height: 25px;
border-radius: 50%;
color: #fff !important;
text-align: center;
line-height: 25px;
background-color: #004d40;
}
</style>
<template>
<div class="page-body courseList">
<div class="page-search row items-center">
<div class="col row wrap q-mr-lg q-col-gutter-md">
<div class="col-3">
<q-input @input="resetSearch" clearable standout="bg-primary text-white" v-model="msg.CourseName" label="课程名称"
@clear="resetSearch" maxlength="20" />
</div>
</div>
</div>
<div class="page-content">
<ul v-if="data.length!=0">
<li v-for="(item,index) in data" :key="index">
<div class="dline">
<div class="d1" style="width:25%">
<div class="di-title">课程名称</div>
<div class="di-c" style="margin-top: 25px;">
<div>
<img :src="item.CoverImg" v-if="item.CoverImg" style="width:60px;height:60px;margin-right:10px;" />
<img style="width:60px;height:60px;margin-right:10px;" v-else src="../../assets/images/default.png"/>
</div>
<div>{{item.CourseName}}</div>
</div>
</div>
<div class="d2">
<div class="di-title">讲师</div>
<div class="di-c" style="margin-top: 25px;">
<div style="display:flex;align-items:center;" v-for="(subItem,sIndex) in item.TeacherList"
:key="sIndex">
<div>
<img v-if="subItem.TeacherIcon" style="width:25px;height:25px;border-radius:50%;"
:src="subItem.TeacherIcon" />
<div v-else class="myCourseNName">{{subItem.TeacherName.substring(0,1)}}</div>
</div>
<div style="margin-left:5px;">{{subItem.TeacherName}}</div>
</div>
</div>
</div>
<div class="d3">
<div class="di-title">销售平台</div>
<div class="di-c" style="margin-top: 25px;">
<span style="margin-right:5px;" v-for="(pItem,pIndex) in item.SalePlatArr">{{pItem}}</span>
</div>
</div>
<div class="d4" style="width:20%">
<div class="di-title">基础价格</div>
<div class="di-c" style="margin-top: 25px;">
<span
style="color: var(--q-color-negative); font-weight: bold;">￥{{item.OriginalPrice.toFixed(2)}}</span>
</div>
</div>
<div class="d5" style="width:19%">
<div class="di-title">优惠价格</div>
<div class="di-c" style="margin-top: 25px;">
<template v-if="item.PreferentialList&&item.PreferentialList.length>0">
<table>
<tbody v-for="(pitem,pindex) in item.PreferentialList" v-if="pindex==0">
<tr>
<td>
<template v-if="pitem.PriceDiscountType==1">
买 <span style="color: var(--q-color-negative); font-weight: bold;">{{pitem.BuyNum}}</span> 送
<span style="color: var(--q-color-negative); font-weight: bold;">{{pitem.SendNum}}</span>
</template>
<template v-else-if="pitem.PriceDiscountType==5">
刷卡分期
</template>
<template v-else>
{{pitem.PriceDiscountTypeStr}} <span
style="color: var(--q-color-negative); font-weight: bold;"> {{pitem.PriceMoney}} %</span>
</template>
</td>
</tr>
<tr>
<td>
同行返佣<span
style="color: var(--q-color-negative); font-weight: bold;"> {{pitem.B2BCommissionMoney}}
%</span>
</td>
</tr>
<tr>
<td>
销售返佣<span
style="color: var(--q-color-negative); font-weight: bold;"> {{pitem.SaleCommissionMoney}}
%</span>
<span class="iconfont icon-xiangxia" style="color: #2961FE;font-size: 10px"
v-if="item.PreferentialList.length>1">
<q-popup-proxy>
<q-banner>
<table style="width:400px;" border="0" cellspacing="0" cellpadding="0">
<thead style="background-color:rgba(221, 222, 224, 0.2);">
<tr>
<td style="width:45%;height:30px;">
优惠条件
</td>
<td style="width:25%;height:30px;">
同行返佣
</td>
<td style="width:25%;height:30px;">
销售返佣
</td>
</tr>
</thead>
<tbody>
<tr v-for="(pitem,pindex) in item.PreferentialList">
<td style="height:30px;">
<template v-if="pitem.PriceDiscountType==1">
买 {{pitem.BuyNum}} 送 {{pitem.SendNum}}
</template>
<template v-else-if="pitem.PriceDiscountType==5">
刷卡分期
</template>
<template v-else>
{{pitem.PriceDiscountTypeStr}} {{pitem.PriceMoney}} %
</template>
</td>
<td style="height:30px;">
{{pitem.B2BCommissionMoney}} %
</td>
<td style="height:30px;">
{{pitem.SaleCommissionMoney}} %
</td>
</tr>
</tbody>
</table>
</q-banner>
</q-popup-proxy>
</span>
</td>
</tr>
</tbody>
</table>
</template>
</div>
</div>
</div>
<div class="d6 row">
<p style="color:var(--q-color-negative);font-weight: bold"><span
style="color:#2D2D2D;">课程特色：</span>{{item.CourseFeature}}</p>
</div>
</li>
<li style="border: none;display: flex;justify-content: flex-end;background: white;padding: 5px 20px">
<q-pagination v-model="msg.pageIndex" :max="pageCount" @input="changePage" class="full-width justify-end"
color="primary" :input="true">
</q-pagination>
</li>
</ul>
<div v-else style="width: 100%;color: #999999;text-align: center;font-size: 15px">暂无数据</div>
</div>
</div>
</template>
<script>
import {
queryCoursePage,
} from '../../api/course/index'
export default {
meta: {
title: "课程预览"
},
components: {
},
data() {
return {
currentUrl: "",
data: [],
loading: true,
msg: {
pageIndex: 1,
pageSize: 12,
rowsPerPage: 12,
CourseName: "",
QCateIds: "",
Status: "0",
IsQPrice: 1, //是否查询优惠价格设置
IsQTeacher: 1, //是否查询课程讲师
},
pageCount: 0,
}
},
mounted() {
this.currentUrl = this.$route.path
this.getcourselist();
},
methods: {
//重新查询
resetSearch() {
this.msg.pageIndex = 1;
this.getcourselist();
},
//翻页
changePage(val) {
this.msg.pageIndex = val;
this.getcourselist()
},
//获取菜单分页列表
getcourselist() {
this.loading = true;
queryCoursePage(this.msg).then(res => {
this.loading = false
this.data = res.Data.PageData
this.pageCount = res.Data.PageCount;
console.log(this.data, 'data');
}).catch(() => {
this.loading = false
})
},
}
}
</script>
<style lang="sass">
@import url('~assets/css/table.sass')
</style>
src/pages/sale/courseList.vue
View file @ a720f723
<style> <style>
li { li {
list-style-type: none; list-style-type: none;
} }
.courseList ul { .courseList ul {
padding: 0px padding: 0px;
} }
.courseList li { .courseList li {
background: rgba(221, 222, 224, 0.2); background: rgba(221, 222, 224, 0.2);
border-radius: 4px; border-radius: 4px;
margin-top: 15px margin-top: 15px;
} }
.courseList li .dline { .courseList li .dline {
display: table; display: table;
width: 100%; width: 100%;
display: flex; display: flex;
flex-direction: row flex-direction: row;
} }
.courseList li .d1, .courseList li .d1,
.courseList li .d2, .courseList li .d2,
.courseList li .d3, .courseList li .d3,
.courseList li .d4, .courseList li .d4,
.courseList li .d5 { .courseList li .d5 {
width: 18%; width: 18%;
padding: 20px 20px 10px; padding: 20px 20px 10px;
} }
.courseList li .d7 { .courseList li .d7 {
flex: 1; flex: 1;
width: 1px; width: 1px;
display: flex; display: flex;
flex-direction: row; flex-direction: row;
align-items: center; align-items: center;
justify-content: center justify-content: center;
} }
.courseList li .d1 .di-title { .courseList li .d1 .di-title {
font-size: 16px; font-size: 16px;
color: #111111; color: #111111;
} }
.courseList li .d1 .di-c { .courseList li .d1 .di-c {
font-size: 14px; font-size: 14px;
display: flex; display: flex;
line-height: 28px; line-height: 28px;
color: #111111 color: #111111;
} }
.courseList li .d6 { .courseList li .d6 {
padding: 10px 20px; padding: 10px 20px;
width: 100%; width: 100%;
height: inherit; height: inherit;
position: relative; position: relative;
border-top: 1px solid #DDDEE0 border-top: 1px solid #dddee0;
} }
.courseList li .d6 .progress { .courseList li .d6 .progress {
width: 100%; width: 100%;
height: 5px; height: 5px;
position: absolute; position: absolute;
left: 0; left: 0;
bottom: 0 bottom: 0;
} }
.courseList li .d2 div { .courseList li .d2 div {
margin: 2px 0; margin: 2px 0;
font-size: 14px; font-size: 14px;
color: #111111; color: #111111;
} }
.courseList li .d2-n { .courseList li .d2-n {
font-size: 12px; font-size: 12px;
color: #999999; color: #999999;
margin-right: 20px margin-right: 20px;
} }
.courseList li .d3 .d3-s { .courseList li .d3 .d3-s {
color: var(--q-color-negative); color: var(--q-color-negative);
font-weight: bold font-weight: bold;
} }
.courseList li .d3 div { .courseList li .d3 div {
margin: 2px 0; margin: 2px 0;
font-size: 14px; font-size: 14px;
} }
.courseList li .d4 div { .courseList li .d4 div {
font-size: 14px; font-size: 14px;
color: #111111; color: #111111;
margin: 2px 0; margin: 2px 0;
} }
.courseList li .d5 div { .courseList li .d5 div {
font-size: 14px; font-size: 14px;
color: #111111; color: #111111;
margin: 2px 0; margin: 2px 0;
} }
.courseList .myCourseNName { .courseList .myCourseNName {
width: 25px; width: 25px;
height: 25px; height: 25px;
border-radius: 50%; border-radius: 50%;
color: #fff !important; color: #fff !important;
text-align: center; text-align: center;
line-height: 25px; line-height: 25px;
background-color: #004d40; background-color: #004d40;
} }
</style> </style>
<template> <template>
<div class="page-body courseList"> <div class="page-body courseList">
<div class="page-search row items-center"> <div class="page-search row items-center">
<div class="col row wrap q-mr-lg q-col-gutter-md"> <div class="col row wrap q-mr-lg q-col-gutter-md">
<div class="col-3"> <div class="col-3">
<q-input @input="resetSearch" clearable standout="bg-primary text-white" v-model="msg.CourseName" label="课程名称" <q-input
@clear="resetSearch" maxlength="20" /> @input="resetSearch"
clearable
standout="bg-primary text-white"
v-model="msg.CourseName"
label="课程名称"
@clear="resetSearch"
maxlength="20"
/>
</div> </div>
</div> </div>
</div> </div>
<div class="page-content"> <div class="page-content">
<ul v-if="data.length!=0"> <q-table
<li v-for="(item,index) in data" :key="index"> :pagination="msg"
<div class="dline"> :loading="loading"
<div class="d1" style="width:25%"> no-data-label="暂无相关数据"
<div class="di-title">课程名称</div> flat
<div class="di-c" style="margin-top: 25px;"> class="sticky-tow-column-table"
<div> separator="none"
<img :src="item.CoverImg" v-if="item.CoverImg" style="width:60px;height:60px;margin-right:10px;" /> :data="data"
<img style="width:60px;height:60px;margin-right:10px;" v-else src="../../assets/images/default.png"/> :columns="columns"
row-key="name"
>
<template v-slot:top="props">
<div class="col-2 q-table__title">课程报价表</div>
<q-space />
<div class="page-option">
<q-btn
color="accent"
size="sm"
class="q-mr-md"
icon="add"
label="创建报价单"
/>
</div>
</template>
<template v-slot:body="props">
<q-tr :props="props">
<q-td auto-width>
<q-btn
size="sm"
color="accent"
round
dense
@click="props.row.expand = !props.row.expand"
:icon="props.row.expand ? 'remove' : 'add'"
/>
</q-td>
<template v-for="col in props.cols">
<q-td v-if="col.name == 'CoverImg'">
<q-img
:src="col.value"
spinner-color="white"
style="height: 54px; max-width: 100px"
class="rounded-borders"
>
</q-img>
</q-td>
<q-td v-else-if="col.name == 'CourseIntro'">
<span v-html="col.value"></span>
</q-td>
<q-td
v-else-if="col.name == 'PreferentialList'"
style="padding-right:0px"
>
<div v-for="x in col.value">
<div class="border-bottom" v-if="x.PriceDiscountType == 1">
买{{ x.BuyNum }}送{{ x.SendNum }}
</div>
<div class="border-bottom" v-if="x.PriceDiscountType == 2">
单人报名享{{ 100 - x.PriceMoney }}折优惠
</div>
<div class="border-bottom" v-if="x.PriceDiscountType == 3">
双人报名享{{ 100 - x.PriceMoney }}折优惠
</div>
<div class="border-bottom" v-if="x.PriceDiscountType == 4">
续费享{{ 100 - x.PriceMoney }}折优惠
</div>
</div> </div>
<div>{{item.CourseName}}</div> </q-td>
</div> <q-td
</div> v-else-if="col.name == 'PreferentialListSellCommission'"
<div class="d2"> style="padding-right:0px;padding-left:0px"
<div class="di-title">讲师</div> >
<div class="di-c" style="margin-top: 25px;"> <div v-for="x in col.value">
<div style="display:flex;align-items:center;" v-for="(subItem,sIndex) in item.TeacherList" <div
:key="sIndex"> class="border-bottom"
<div> style="padding-left: 16px;padding-right: 16px"
<img v-if="subItem.TeacherIcon" style="width:25px;height:25px;border-radius:50%;" >
:src="subItem.TeacherIcon" /> {{ x.SaleCommissionMoney }}%
<div v-else class="myCourseNName">{{subItem.TeacherName.substring(0,1)}}</div>
</div> </div>
<div style="margin-left:5px;">{{subItem.TeacherName}}</div>
</div> </div>
</q-td>
<q-td
v-else-if="col.name == 'PreferentialListB2BCommission'"
style="padding-left:0px"
>
<div v-for="x in col.value">
<div class="border-bottom" style="padding-left: 16px">
{{ x.B2BCommissionMoney }}%
</div>
</div>
</q-td>
<q-td v-else-if="col.name == 'TeacherList'">
<div v-for="x in col.value">
<q-chip>
<q-avatar color="green-1" text-color="green">
<img :src="x.TeacherHead" v-if="x.TeacherHead" />
<span>{{ x.TeacherName.substring(0, 1) }}</span>
</q-avatar>
{{ x.TeacherName }}
</q-chip>
</div>
</q-td>
<q-td
v-else-if="col.name != 'CourseFeature'"
:key="col.name"
:props="props"
>
{{ col.value }}
</q-td>
</template>
</q-tr>
<q-tr v-show="props.row.expand" :props="props">
<q-td colspan="100%" class="bg-grey-2">
<div class="flex row items-start">
<q-badge color="negative" class="q-mr-md">
课程特色
</q-badge>
<div v-html="props.row.CourseFeature" class="text-left col text-negative"></div>
</div> </div>
</div> </q-td>
<div class="d3"> </q-tr>
<div class="di-title">销售平台</div> </template>
<div class="di-c" style="margin-top: 25px;"> <template v-slot:bottom>
<span style="margin-right:5px;" v-for="(pItem,pIndex) in item.SalePlatArr">{{pItem}}</span> <q-pagination
</div> class="full-width justify-end"
</div> v-model="msg.pageIndex"
<div class="d4" style="width:20%"> color="primary"
<div class="di-title">基础价格</div> :max="pageCount"
<div class="di-c" style="margin-top: 25px;"> :input="true"
<span @input="changePage"
style="color: var(--q-color-negative); font-weight: bold;">￥{{item.OriginalPrice.toFixed(2)}}</span> />
</div> </template>
</div> </q-table>
<div class="d5" style="width:19%">
<div class="di-title">优惠价格</div>
<div class="di-c" style="margin-top: 25px;">
<template v-if="item.PreferentialList&&item.PreferentialList.length>0">
<table>
<tbody v-for="(pitem,pindex) in item.PreferentialList" v-if="pindex==0">
<tr>
<td>
<template v-if="pitem.PriceDiscountType==1">
买 <span style="color: var(--q-color-negative); font-weight: bold;">{{pitem.BuyNum}}</span> 送
<span style="color: var(--q-color-negative); font-weight: bold;">{{pitem.SendNum}}</span>
</template>
<template v-else-if="pitem.PriceDiscountType==5">
刷卡分期
</template>
<template v-else>
{{pitem.PriceDiscountTypeStr}} <span
style="color: var(--q-color-negative); font-weight: bold;"> {{pitem.PriceMoney}} %</span>
</template>
</td>
</tr>
<tr>
<td>
同行返佣<span
style="color: var(--q-color-negative); font-weight: bold;"> {{pitem.B2BCommissionMoney}}
%</span>
</td>
</tr>
<tr>
<td>
销售返佣<span
style="color: var(--q-color-negative); font-weight: bold;"> {{pitem.SaleCommissionMoney}}
%</span>
<span class="iconfont icon-xiangxia" style="color: #2961FE;font-size: 10px"
v-if="item.PreferentialList.length>1">
<q-popup-proxy>
<q-banner>
<table style="width:400px;" border="0" cellspacing="0" cellpadding="0">
<thead style="background-color:rgba(221, 222, 224, 0.2);">
<tr>
<td style="width:45%;height:30px;">
优惠条件
</td>
<td style="width:25%;height:30px;">
同行返佣
</td>
<td style="width:25%;height:30px;">
销售返佣
</td>
</tr>
</thead>
<tbody>
<tr v-for="(pitem,pindex) in item.PreferentialList">
<td style="height:30px;">
<template v-if="pitem.PriceDiscountType==1">
买 {{pitem.BuyNum}} 送 {{pitem.SendNum}}
</template>
<template v-else-if="pitem.PriceDiscountType==5">
刷卡分期
</template>
<template v-else>
{{pitem.PriceDiscountTypeStr}} {{pitem.PriceMoney}} %
</template>
</td>
<td style="height:30px;">
{{pitem.B2BCommissionMoney}} %
</td>
<td style="height:30px;">
{{pitem.SaleCommissionMoney}} %
</td>
</tr>
</tbody>
</table>
</q-banner>
</q-popup-proxy>
</span>
</td>
</tr>
</tbody>
</table>
</template>
</div>
</div>
</div>
<div class="d6 row">
<p style="color:var(--q-color-negative);font-weight: bold"><span
style="color:#2D2D2D;">课程特色：</span>{{item.CourseFeature}}</p>
</div>
</li>
<li style="border: none;display: flex;justify-content: flex-end;background: white;padding: 5px 20px">
<q-pagination v-model="msg.pageIndex" :max="pageCount" @input="changePage" class="full-width justify-end"
color="primary" :input="true">
</q-pagination>
</li>
</ul>
<div v-else style="width: 100%;color: #999999;text-align: center;font-size: 15px">暂无数据</div>
</div> </div>
</div> </div>
</template> </template>
<script> <script>
import { import { queryCoursePage } from "../../api/course/index";
queryCoursePage, export default {
} from '../../api/course/index' meta: {
export default { title: "课程预览"
meta: { },
title: "课程预览" components: {},
}, data() {
components: { return {
currentUrl: "",
}, data: [],
data() { loading: true,
return { columns: [
currentUrl: "", {
data: [], name: "CourseFeature",
loading: true, label: "课程特色",
msg: { field: "CourseFeature",
pageIndex: 1, align: "left"
pageSize: 12, },
rowsPerPage: 12, {
CourseName: "", name: "CoverImg",
QCateIds: "", label: "课程封面",
Status: "0", field: "CoverImg",
IsQPrice: 1, //是否查询优惠价格设置 align: "left"
IsQTeacher: 1, //是否查询课程讲师 },
// {
// name: 'CourseId',
// label: '课程编号',
// field: 'CourseId',
// align: 'left'
// },
{
name: "CourseName",
required: true,
label: "课程名称",
align: "left",
field: row => row.CourseName
},
{
name: "OriginalPrice",
required: true,
label: "原价",
align: "left",
field: row => row.OriginalPrice.toFixed(2)
}, },
pageCount: 0, {
} name: "SellPrice",
required: true,
label: "售价",
align: "left",
field: row => row.SellPrice.toFixed(2)
},
{
name: "PreferentialList",
required: true,
label: "优惠政策",
align: "left",
field: row => row.PreferentialList
},
{
name: "PreferentialListSellCommission",
required: true,
label: "销售佣金",
align: "left",
field: row => row.PreferentialList
},
{
name: "PreferentialListB2BCommission",
required: true,
label: "销售佣金",
align: "left",
field: row => row.PreferentialList
},
{
name: "TeacherList",
label: "教师团队",
field: row => row.TeacherList,
align: "left"
},
{
name: "ClassHours",
label: "课时长度",
field: "ClassHours",
align: "left",
format: (val, row) => `${val}课时`
}
],
msg: {
pageIndex: 1,
pageSize: 12,
rowsPerPage: 12,
CourseName: "",
QCateIds: "",
Status: "0",
IsQPrice: 1, //是否查询优惠价格设置
IsQTeacher: 1 //是否查询课程讲师
},
pageCount: 0
};
},
mounted() {
this.currentUrl = this.$route.path;
this.getcourselist();
},
methods: {
//重新查询
resetSearch() {
this.msg.pageIndex = 1;
this.getcourselist();
}, },
mounted() { //翻页
this.currentUrl = this.$route.path changePage(val) {
this.msg.pageIndex = val;
this.getcourselist(); this.getcourselist();
}, },
methods: { //获取菜单分页列表
//重新查询 getcourselist() {
resetSearch() { this.loading = true;
this.msg.pageIndex = 1; queryCoursePage(this.msg)
this.getcourselist(); .then(res => {
}, this.loading = false;
//翻页 res.Data.PageData.forEach(x => {
changePage(val) { x.expand = false;
this.msg.pageIndex = val; x.CourseFeature=x.CourseFeature.replace(new RegExp('\n',"gm"),'<br/>')
this.getcourselist() console.log(x.CourseFeature)
}, });
//获取菜单分页列表 this.data = res.Data.PageData;
getcourselist() {
this.loading = true;
queryCoursePage(this.msg).then(res => {
this.loading = false
this.data = res.Data.PageData
this.pageCount = res.Data.PageCount; this.pageCount = res.Data.PageCount;
console.log(this.data, 'data'); console.log(this.data, "data");
}).catch(() => {
this.loading = false
}) })
}, .catch(() => {
this.loading = false;
});
} }
} }
};
</script> </script>
<style lang="sass"> <style lang="sass">
@import url('~assets/css/table.sass') @import url('~assets/css/table.sass')
</style> </style>
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