Commit 222a680f authored by 黄奎's avatar 黄奎
parents 76b027b8 4db9dd63
<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;
align-items: center;
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: 10px 0;
font-size: 14px;
}
.courseList li .d4 div {
font-size: 14px;
color: #111111;
margin: 10px 0;
}
.courseList li .d5 div {
font-size: 14px;
color: #111111;
margin: 10px 0;
}
</style>
<template> <template>
<div class="page-body"> <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">
...@@ -9,75 +113,92 @@ ...@@ -9,75 +113,92 @@
</div> </div>
</div> </div>
<div class="page-content"> <div class="page-content">
<q-table :pagination="msg" :loading="loading" no-data-label="暂无相关数据" flat class="sticky-tow-column-table" <ul v-if="data.length!=0">
separator="none" :data="data" :columns="columns" row-key="name"> <li v-for="(item,index) in data" :key="index">
<template v-slot:top="props"> <div class="dline">
<div class="col-2 q-table__title">课程信息</div> <div class="d1" style="width:25%">
</template> <div class="di-title">课程名称</div>
<template v-slot:body-cell-CoverImg="props"> <div class="di-c" style="margin-top: 25px;">
<q-td :props="props"> <img :src="item.CoverImg" style="width:60px;height:60px;margin-right:10px;" />{{item.CourseName}}
<q-avatar square size="100px"> </div>
<img v-if="props.value" :src="props.value" /> </div>
</q-avatar> <div class="d2">
</q-td> <div class="di-title">讲师</div>
</template> <div class="di-c" style="margin-top: 25px;">
<template v-slot:body-cell-CourseIntro="props"> <div style="display:flex;align-items:center;" v-for="(subItem,sIndex) in item.TeacherList"
<q-td :props="props"> :key="sIndex">
<span v-html="props.value"></span> <div><img style="width:25px;height:25px;border-radius:50%;" :src="subItem.TeacherIcon" /></div>
</q-td> <div style="margin-left:5px;">{{subItem.TeacherName}}</div>
</template> </div>
<template v-slot:body-cell-Status="props"> </div>
<q-td :props="props"> </div>
<q-badge :color="props.value==1?'negative':'primary'" :label="props.value==0?'正常':'禁用'" /> <div class="d3">
</q-td> <div class="di-title">销售平台</div>
</template> <div class="di-c" style="margin-top: 25px;">
<template v-slot:body-cell-optioned="props"> <span style="margin-right:5px;" v-for="(pItem,pIndex) in item.SalePlatArr">{{pItem}}</span>
<q-td :props="props"> </div>
<template v-if="props.row.PreferentialList&&props.row.PreferentialList.length>0"> </div>
<div class="d4" style="width:10%">
<div class="di-title">基础价格</div>
<div class="di-c" style="margin-top: 25px;">
<span>{{item.OriginalPrice}}</span>
</div>
</div>
<div class="d5" style="width:29%">
<div class="di-title">优惠价格</div>
<div class="di-c" style="margin-top: 25px;">
<template v-if="item.PreferentialList&&item.PreferentialList.length>0">
<table> <table>
<thead> <thead>
<tr> <tr>
<td> <td style="width:55%">
优惠条件 优惠条件
</td> </td>
<td> <td style="width:25%">
同行返佣 同行返佣
</td> </td>
<td> <td style="width:25%">
销售返佣 销售返佣
</td> </td>
</tr> </tr>
</thead> </thead>
<tbody> <tbody>
<tr v-for="item in props.row.PreferentialList"> <tr v-for="pitem in item.PreferentialList">
<td> <td>
<template v-if="item.PriceDiscountType==1"> <template v-if="pitem.PriceDiscountType==1">
{{item.BuyNum}}{{item.SendNum}} {{pitem.BuyNum}}{{pitem.SendNum}}
</template> </template>
<template v-else-if="item.PriceDiscountType==5"> <template v-else-if="pitem.PriceDiscountType==5">
刷卡分期 刷卡分期
</template> </template>
<template v-else> <template v-else>
{{item.PriceDiscountTypeStr}} {{item.PriceMoney}} % {{pitem.PriceDiscountTypeStr}} {{pitem.PriceMoney}} %
</template> </template>
</td> </td>
<td> <td>
{{item.B2BCommissionMoney}} % {{pitem.B2BCommissionMoney}} %
</td> </td>
<td> <td>
{{item.SaleCommissionMoney}} % {{pitem.SaleCommissionMoney}} %
</td> </td>
</tr> </tr>
</tbody> </tbody>
</table> </table>
</template> </template>
</q-td> </div>
</template> </div>
<template v-slot:bottom> </div>
<q-pagination class="full-width justify-end" v-model="msg.pageIndex" color="primary" :max="pageCount" <div class="d6 row">
:input="true" @input="changePage" /> <p style="color:var(--q-color-negative);font-weight: bold"><span style="color:#2D2D2D;">课程特色:</span>{{item.CourseFeature}}</p>
</template> </div>
</q-table> </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>
...@@ -95,43 +216,6 @@ ...@@ -95,43 +216,6 @@
data() { data() {
return { return {
currentUrl: "", currentUrl: "",
columns: [{
name: 'CourseId',
label: '课程编号',
field: 'CourseId',
align: 'left'
},
{
name: 'CourseName',
required: true,
label: '课程名称',
align: 'left',
field: row => row.CourseName
},
{
name: 'CoverImg',
label: '课程封面',
field: 'CoverImg',
align: 'left'
},
{
name: 'OriginalPrice',
label: '基础价格',
field: 'OriginalPrice',
align: 'left'
},
{
name: 'optioned',
label: '价格信息',
field: 'CourseId'
},
{
name: 'Status',
label: '状态',
align: 'left',
field: 'Status'
}
],
data: [], data: [],
loading: true, loading: true,
msg: { msg: {
...@@ -142,7 +226,7 @@ ...@@ -142,7 +226,7 @@
QCateIds: "", QCateIds: "",
Status: "0", Status: "0",
IsQPrice: 1, //是否查询优惠价格设置 IsQPrice: 1, //是否查询优惠价格设置
IsQTeacher:1,//是否查询课程讲师 IsQTeacher: 1, //是否查询课程讲师
}, },
pageCount: 0, pageCount: 0,
} }
...@@ -168,7 +252,8 @@ ...@@ -168,7 +252,8 @@
queryCoursePage(this.msg).then(res => { queryCoursePage(this.msg).then(res => {
this.loading = false this.loading = false
this.data = res.Data.PageData this.data = res.Data.PageData
this.pageCount = res.Data.PageCount this.pageCount = res.Data.PageCount;
console.log(this.data, 'data');
}).catch(() => { }).catch(() => {
this.loading = false this.loading = 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