Files
sociology_app/pages/curriculum/order/curriculum/index copy.vue
2024-06-25 17:07:59 +08:00

1418 lines
36 KiB
Vue
Raw Blame History

This file contains ambiguous Unicode characters
This file contains Unicode characters that might be confused with other characters. If you think that this is intentional, you can safely ignore this warning. Use the Escape button to reveal them.
<template>
<view
class="container commonPageBox commonDetailPage"
style="height: auto !important"
>
<!-- 公共组件-每个页面必须引入 -->
<public-module></public-module>
<z-nav-bar
:title="options.navTitle"
bgColor="#3AB3AE"
fontColor="#fff"
></z-nav-bar>
<view class="contentBox commonPageContentBox">
<u-alert
style="position: fixed; width: 100%; z-index: 10"
type="warning"
@click="handleClickGetGoodsList"
:title="goBuyTitle"
:show-icon="true"
v-if="
cateList.length > 0 &&
cateList[currentCateIndex].isBuy == 0 &&
vip.type == '0'
"
>
<template slot="rightSlot" slot-scope="slotProps">
<!-- {{ slotProps.row.bxType }} -->
<text
:class="`fdButtonBox ${
cateList[currentCateIndex].type == 0
? ''
: 'aui-text-danger fdButtonBoxRed'
} `"
>
{{
cateList[currentCateIndex].type == 0 ? "开始学习" : "立即购买"
}}</text
>
<view> </view>
</template>
</u-alert>
<u-alert
style="position: fixed; width: 100%; z-index: 10"
type="warning"
@click="handleClickGetGoodsList"
:title="`尊贵的${vip.type==1?'超级':vip.type==2?'吴门医述':'众妙之门'}VIP会员,您的有效期到 ${
vip.endTime && vip.endTime.split(' ')[0]
}`"
:show-icon="true"
v-if="cateList.length > 0 && vip.type != 0"
>
</u-alert>
<view
v-if="curriculumData.image"
:style="`height: auto !important;${
(cateList.length > 0 &&
cateList[currentCateIndex].isBuy == 0 &&
vip.type == '0') ||
vip.type != 0
? 'padding-top:80rpx'
: ''
}`"
>
<image
style="width: 100%"
:src="curriculumData.image"
mode="widthFix"
@click="previewImage(curriculumData.image)"
>
</image>
</view>
<!-- <image
v-if="curriculumData.image"
:src="curriculumData.image"
mode="widthFix"
class="headImage"
></image> -->
<view
v-else
class="headImage"
style="height: 400rpx; background-color: #f5f5f5"
>
</view>
<view class="curriulum_box" v-if="curriculumData.content">
<view class="curriulum_title_box">
<view class="curriulum_title">
<view style="font-weight: 600; color: #018f89; margin-bottom: 20rpx"
>介绍</view
>
<common-rich-detail
v-if="curriculumData.content"
:detailInfo="{
content: curriculumData.content ? curriculumData.content : '',
}"
style="padding: 10rpx"
>
<template #richHeadImg>
<!-- <image :src="curriculumData.imgUrl" mode="widthFix" class="headImage"></image> -->
<!-- <image :src="detailInfo.imgUrl" v-if="detailInfo.imgUrl" mode="widthFix" class="headImage"></image> -->
</template>
</common-rich-detail>
</view>
<!-- <view class="buy">购买</view> -->
</view>
</view>
<template v-if="cateList.length > 1">
<common-sticky
label="title"
:itemStyle="`width:${
cateList.length == 2 ? '50' : '33'
}%;padding-left: 15px; padding-right: 15px; height: 68rpx;`"
:list="cateList"
:currentCateIndex="currentCateIndex"
@handleselectCate="handleselectCate"
>
<template slot="labelSlot" slot-scope="slotProps">
<!-- {{ slotProps.data }} -->
<!-- @click.native.stop="handleClickEdit(slotProps.row)" -->
<uni-icons
class="editIcon"
type="locked-filled"
color="#b0b0b0"
size="24"
v-if="slotProps.data.isBuy == 0 && vip.type == '0'"
style="display: inline-block; margin-left: 10rpx"
></uni-icons>
</template>
</common-sticky>
</template>
<!-- <view :class="`priceDetail`" v-if="this.statusList[this.currentStatusIndex].type == 'price'">
<scroll-view scroll-y="true" class="scroll-Y">
<price ref="priceDetail" type="price" :oid="this.statusList[this.currentStatusIndex].oid"></price>
</scroll-view>
</view>
<view :class="`priceDetail`" v-else-if="this.statusList[this.currentStatusIndex].type == 'purchaseNotice'">
<scroll-view scroll-y="true" class="scroll-Y">
<price ref="purchaseNotice" :oid="this.statusList[this.currentStatusIndex].oid"></price>
</scroll-view>
</view>
-->
<view :class="`dataList `" style="background-color: #fff">
<courseDescription
:isCondition="true"
:dataList="dataList"
@hancleClick="gotoDetail"
label="title"
>
<template slot="labelSlot" slot-scope="slotProps">
<view
:style="`${
slotProps.rowIndex < 3
? 'width:calc(100% - 100rpx);float:left;'
: 'width:100%;'
}`"
>
<text
:class="`${
slotProps.row.viewFlg == 1 ? 'aui-text-success' : ''
}`"
>{{ slotProps.row.title }}</text
>
</view>
<!-- <text v-if="slotProps.row.conditions!='03'">【试听】</text> -->
</template>
<template slot="leftSlot" slot-scope="slotProps">
<!-- {{ slotProps.row.bxType }} -->
<!-- <text v-if="slotProps.row.conditions!='03'">【试听】</text> -->
</template>
<template slot="rightSlot" slot-scope="slotProps">
<!-- {{ slotProps.row.bxType }} -->
<text
class="fdButtonBox aui-text-success"
v-if="slotProps.row.isAudition == 1 && vip.type == '0'"
>试听</text
>
<view> </view>
</template>
</courseDescription>
</view>
<view class="small_class_teaching_box">
<!-- <view class="small_class_teaching_top">
<view class="small_class_teaching_top_left">
<image src="@/static/icon/course_ic.png" mode="aspectFil" class="icon1"></image>
<text>小班教学</text>
</view>
<text>{{ curriculumInfo.remainingDays }}</text>
</view> -->
<view class="small_class_teaching_content">
<!-- <view class="top">
<view class="top_item" v-for="(v, i) in teachingList">
{{ v.title }}
</view>
</view> -->
<view class="schedule">
<view class="icon_box">
<image
src="@/static/icon/course_07.png"
mode="aspectFil"
class="icon1"
>学习进度</image
>
</view>
<view class="progress_box">
<view class="progress_icon" style=""
><u-line-progress
activeColor="#3AB3AE"
height="18"
:percentage="percentage"
:showText="false"
></u-line-progress>
<text
v-if="percentage"
style="
font-size: 28rpx;
margin-left: 10rpx;
margin-top: -2rpx;
font-weight: 700;
"
>
{{ percentage }} %</text
>
</view>
<image
src="@/static/icon/curriculum_05.png"
mode="aspectFil"
class="icon1"
/>
<image
src="@/static/icon/curriculum_07.png"
mode="aspectFil"
class="icon2"
/>
</view>
</view>
</view>
</view>
<view
class="small_class_teaching_box related_courses_box"
v-if="relatedCoursesList.length > 0"
>
<view class="small_class_teaching_top">
<view class="small_class_teaching_top_left">
<image
src="@/static/icon/course_ic.png"
mode="aspectFil"
class="icon1"
></image>
<text>相关课程</text>
</view>
</view>
<view class="small_class_teaching_content">
<common-curriculum-list
imgUrl="url"
:isCondition="true"
:dataList="relatedCoursesList"
@hancleClick="goCourseDescription"
label="title"
>
<template slot="labelSlot" slot-scope="slotProps">
<view class="related_courses_name hidden1">{{
slotProps.row.title
}}</view>
<!-- <text v-if="slotProps.row.conditions!='03'">【试听】</text> -->
</template>
<template slot="rightSlot" slot-scope="slotProps">
<!-- {{ slotProps.row.bxType }} -->
<text class="aui-text-danger">
¥{{ slotProps.row.courseFee }}</text
>
<view> </view>
</template>
</common-curriculum-list>
</view>
</view>
</view>
<!-- <u-modal
:show="show"
:title="modalInfo.title"
:content="modalInfo.content"
showCancelButton
@confirm="hancleModalConfirm"
@cancel="hancleModalCancel"
></u-modal> -->
<common-select-goods
ref="commonSelectGoods"
:selectGoodsData="selectGoodsData"
:goodsList="goodsList"
:buyOptions="buyOptions"
:customButtonGroup1="customButtonGroup1"
@selectGoods="handleClickSelectGoods"
@onHandleClickBuy="
$refs.commonSelectGoods.close();
protocolShow = true;
"
></common-select-goods>
<z-navigation></z-navigation>
<u-popup :show="protocolShow" mode="center" round="6">
<view class="popup_box">
<view class="title">温馨提示</view>
<view class="content">
<view class="center"
>用户您好,本软件对于一个用户名及密码仅允许一部电子设备登陆,多部设备使用同一用户名操作软件的行为属于违规操作,发现违规一次将提出警告,再次违规您的用户名将被封号,无法正常登陆,如因此对您使用带来不便,敬请谅解。<br />
课程购买之后一年内不打开,此一年内不会计算有效学习时间,一年后会自动开始计算有效学习时间。<br />
本课程一经购买,暂不支持退款,敬请谅解。<br />
<view style="color: red; font-weight: bold"> 注: </view>
<view>
1.手机、pad、电脑均为可登陆电子设备均有唯一标识码一个用户名仅允许在一个手机或一个ipad或一个电脑登陆请根据您的使用习惯自行选择。<br />
2.如若申请变更登陆设备请联系客服,<br />
客服电话:13110039505;022-24142321<br />
客服微信号:yilujiankangkefu<br />
3.如因违反上述使用规定...概不退款,本公司保留追究用户相关法律责任的权利。<br />
4.点击“同意”按钮即表示您同意遵守以上条款。
</view>
</view>
<view class="bottom">
<view class="button_box">
<u-button
size="small"
text="不同意"
@click="protocolShow = false"
></u-button>
<u-button
text="同意"
color="#3AB3AE"
size="small"
@click="onHandleClickBuy"
></u-button>
</view>
</view>
</view>
</view>
</u-popup>
</view>
</template>
<script>
import courseDescription from "@/pages/component/commonComponents/list";
import price from "../price/index.vue";
import $http from "@/config/requestConfig.js";
import { mapState } from "vuex";
export default {
components: {
courseDescription, //课程说明
price, //课程价格
},
data() {
return {
showGoBuy: true,
protocolShow: false,
options: {},
percentage: 0,
selectGoodsData: {},
buyOptions: [
// {
// icon: 'chat',
// text: '客服'
// },
// {
// icon: 'shop',
// text: '店铺',
// // info: 2,
// infoBackgroundColor: '#007aff',
// infoColor: "#f5f5f5"
// },
// {
// icon: 'cart',
// text: '购物车',
// info: 2
// }
],
customButtonGroup1: [
{
with: 200,
text: "立即购买",
backgroundColor: "linear-gradient(90deg, #3AB3AE 0%, #117e4c 100%)",
color: "#fff",
},
],
relatedCoursesList: [], //相关课程
goodsList: [], //课程相关商品
curriculumData: {},
curriculumInfo: {},
fdButtonStyle: {
width: "120rpx",
"border-color": "$themeColor",
color: "$themeColor",
float: "right",
"margin-right": "20rpx",
"margin-left": "30rpx",
},
modalInfo: {},
vip: {},
show: false,
playData: {},
taiHuClassInfo: {},
searchValue: "",
goBuyTitle: "",
description: "",
teachingList: [
{
title: "临床实践",
type: "02",
apiUrl: "app/phoneDoctor.do?getTaiHuToShine",
},
{
title: "学习问答",
type: "03",
oid: "8a9fb99809e4428888aad6b56a3096a6",
},
{
title: "学习心得",
type: "01",
},
{
title: "在线作业",
type: "04",
oid: "d0f47071c2194e94845fbb373d06f59d",
},
], // 一级分类标题1
cateList: [], // 一级分类标题1
twoCateList: [], // 二级分类标题
dataList: [], // 方剂标题
allDataList: [], // 方剂标题
currentStatusIndex: 0, // 当前选中的一级分类
currentCateIndex: 0, // 当前选中的一级分类
curTwoCateIndex: 0, // 当前选中的二级分类
searchList: [], // 搜索结果数组
showSearchList: false,
userMes: {}, // 用户信息
searchDisable: false, // 搜索不可用
limitShow: false,
limitTitle: "提示",
limitContent: "",
scrollViewHeight: 0,
urlList: {
curriculumInfo: "sociology/course/getCourseCatalogueChapterList",
list: "sociology/course/getCourseDetail",
goodsList: "sociology/product/getProductListForCourse",
startStudyForMF: "sociology/course/startStudyForMF",
},
};
},
onLoad(options) {
this.options = options;
// this.getUserInfo()
// this.getCateList()
},
onHide() {
this.selectGoodsData = {};
this.protocolShow = false;
this.handleClickClose();
this.$refs.commonSelectGoods.close();
// this.showSearchList = false
// this.searchList = []
},
onUnload() {
this.selectGoodsData = {};
this.protocolShow = false;
this.$refs.commonSelectGoods.close();
// this.showSearchList = false
// this.searchList = []
},
computed: {
...mapState(["userInfo"]),
},
onShow() {
this.protocolShow = false;
this.getUserInfo();
this.getCourseDescriptionData();
// 也可以通过主题形式调用,如:
// this.$refs.uNotify.primary('Primary主题')
// 关闭 notify
// this.$refs.uNotify.close()
},
methods: {
getUserInfo() {
this.$http.post("common/user/getUserInfo").then((res) => {
console.log("res at line 505:", res);
if (res.result.userVip) {
this.vip = res.result.userVip ;
}else{
this.vip ={ type: 0 }
}
});
},
close() {
this.show = false;
},
getPercentage() {
console.log(this.cateList[this.currentCateIndex]);
if (this.cateList) {
return this.cateList[this.currentCateIndex]
? this.cateList[this.currentCateIndex].completion
: 0;
} else {
return 0;
}
},
handleClickSelectGoods(data) {
this.selectGoodsData = data;
this.$forceUpdate();
},
onHandleClickBuy(e) {
console.log("e at line 387:", e);
// if (e.index == 0) {
// this.handleClickClose();
// }
// if (e.index == 0) {
var mynavData = JSON.stringify({
goods: [this.selectGoodsData],
typeId: 0,
navTitle: this.options.navTitle,
title: this.options.title,
sourceType: "curriculum",
}); // 这里转换成 字符串
uni.navigateTo({
url: `/pages/goods/order/index?data=${mynavData}`,
});
// }
},
handleClickGoBuy() {},
handleClickClose() {
this.show = false;
this.goodsList = [];
this.selectGoodsData = {};
},
//获取相关关联课程商品
handleClickGetGoodsList(data) {
// console.log("data at line 313:", data);
if (this.cateList[this.currentCateIndex].type == 0) {
//免费
this.$http
.request({
url: this.urlList.startStudyForMF,
method: "POST",
data: {
catalogueId: this.cateList[this.currentCateIndex].id,
},
header: {
//默认 无 说明:请求头
"Content-Type": "application/json",
},
})
.then(async (res) => {
console.log("res at line 493:", res);
if (res.code == 0) {
this.getCourseDescriptionData();
// this.$commonJS.showToast("");
}
// if (res.productList.length > 0) {
// this.goodsList = res.productList;
// this.selectGoodsData = this.goodsList[0];
// this.$refs.commonSelectGoods.open();
// this.show = true;
// } else {
// this.$commonJS.showToast("此课程暂无购买方式");
// }
this.$forceUpdate();
});
} else {
this.$http
.request({
url: this.urlList.goodsList,
method: "POST",
data: {
id: this.cateList[this.currentCateIndex].id,
},
header: {
//默认 无 说明:请求头
"Content-Type": "application/json",
},
})
.then(async (res) => {
if (res.productList.length > 0) {
this.goodsList = res.productList;
this.selectGoodsData = this.goodsList[0];
this.$refs.commonSelectGoods.open();
this.show = true;
} else {
this.$commonJS.showToast("此课程暂无购买方式");
}
this.$forceUpdate();
});
}
},
hancleModalConfirm() {
var data = {
values: {
customerType: "D",
token: uni.getStorageSync("token"),
customerOid: uni.getStorageSync("customerOid"),
...this.taiHuClassInfo,
},
};
// $mars.progressBegin('申请中...');
// $mars.post(customerType, 'applyRelearn', data, function (ret) {
// api.hideProgress();
// fnLoadDataGrid();
// });
},
fnRelearn(oid, days, courseFee) {
//99和199课程复读一个月60三个月120; 299和399课程复读一个月80三个月180
//499和599课程复读一个月90三个月220; 699和799课程复读一个月100三个月248
var feeAs = [
[60, 120],
[80, 180],
[90, 220],
[100, 248],
];
var fee = 0;
if (courseFee < 206) {
fee = feeAs[0][days == 30 ? 0 : 1];
} else if (courseFee < 406) {
fee = feeAs[1][days == 30 ? 0 : 1];
} else if (courseFee < 606) {
fee = feeAs[2][days == 30 ? 0 : 1];
} else {
fee = feeAs[3][days == 30 ? 0 : 1];
}
this.modalInfo = {
title: "提示信息",
content:
"用户您好,该课程已到期,通过支付" +
fee +
"元,本门课程可获得" +
days +
"天延期学习时间,点击确认即完成自动扣费,感谢配合!",
};
this.taiHuClassInfo = {
taiHuClassOid: oid,
days: days,
fee: fee,
};
this.show = true;
// $aui.alert({
// title: ,
// content: '用户您好,该课程已到期,通过支付' + fee + '元,本门课程可获得' + days + '天延期学习时间,点击确认即完成自动扣费,感谢配合!',
// buttons: ['取消', '确认'],
// radius: 6,
// titleColor: '#ff3300',
// contColor: '#333',
// btnColor: ''
},
//课程详情
async gotoDetail(v, index) {
console.log(
this.cateList[this.currentCateIndex],
8888888888888888888888888
);
// var result = await this.$commonJS.getCheckCourseStatus({
// oid: v.courseOid,
// });
// console.log("result at line 364:", result);
// if (result.buyFlg == 0 && v.conditions != "01") {
// this.$commonJS.showToast("请先购买课程");
// return;
// }
if (
this.cateList[this.currentCateIndex].isBuy == 1 ||
v.isAudition == 1 ||
this.vip.type != "0"
) {
uni.navigateTo({
// url: '../bookShop/commodityDetail?id=' + item.id
url: `/pages/curriculum/order/curriculum/detail?navTitle=${this.options.navTitle}&title=${v.title}&id=${v.id}&conditions=${v.conditions}&detailOid=${v.detailOid}`,
});
} else {
this.$commonJS.showToast("请先购买课程");
}
},
//相关课程
goCourseDescription(v) {
console.log(v);
uni.navigateTo({
// url: '../bookShop/commodityDetail?id=' + item.id
url: `/pages/curriculum/order/curriculum/index?navTitle=${v.title}&title=${v.title}&oid=${v.oid}`,
});
},
getCourseDescriptionData() {
var data = {};
var that = this;
console.log(this.$store.state, "11111111111");
this.$http
.request({
url: this.urlList.list,
method: "POST",
data: {
id: this.options.id,
},
header: {
//默认 无 说明:请求头
"Content-Type": "application/json",
},
})
.then(async (res) => {
that.curriculumData = res.data.course;
that.cateList = res.data.catalogues;
// this..getPercentage();
that.relatedCoursesList = res.data.correlatedList
? res.data.correlatedList
: [];
await that.handleselectCate(this.cateList[0], 0);
// socket.init();
});
},
getPriceData() {
var that = this;
setTimeout(() => {
that.$nextTick(() => {
that.$refs.priceDetail.getData();
});
}, 100);
},
// 检查是有权限使用搜索功能
checkDisable() {
console.log("点击了");
},
// 显示无权限弹窗
// showNoRights() {
// let that = this
// uni.showModal({
// content: "",
// confirmText: '好的',
// showCancel: false,
// success: function(res) {
// if (res.confirm) {
// // console.log('用户点击确定');
// that.clear()
// }
// }
// })
// },
// // 获取用户详情
// getUserInfo() {
// // 用户详情
// if (this.userInfo.id != undefined) {
// this.$http.post("book/user/info/" + this.userInfo.id).then((res) => {
// this.userMes = res.user;
// this.getCateList();
// console.log(this.userMes, "呼呼");
// });
// }
// },
async handleselectCate(item, index) {
console.log("item at line 662:", item);
console.log("index at line 637:", index);
// this.description=`您还未购买当前【${item.title}】课程,`
var title1 = "";
this.currentCateIndex = index;
if (item.type == 0) {
if (this.cateList.length > 1) {
this.goBuyTitle = `【${item.title}】课程为免费课程`;
} else if (this.cateList.length == 1) {
this.goBuyTitle = `为免费课程`;
}
} else {
if (this.cateList.length > 1) {
this.goBuyTitle = `您还未购买当前【${item.title}】课程`;
} else if (this.cateList.length == 1) {
this.goBuyTitle = `您还未购买当前课程`;
}
}
// this.currentCateIndex = index;
this.dataList = [];
var data = [];
console.log(item, index, 99999);
var that = this;
// curriculumInfo
this.$http
.request({
url: this.urlList.curriculumInfo,
method: "POST",
data: {
id: item.id,
},
header: {
//默认 无 说明:请求头
"Content-Type": "application/json",
},
})
.then(async (res) => {
// that.curriculumInfo = res.obj;
// that.currentCateIndex = index;
that.percentage = item.completion;
that.dataList = res.chapterList;
// that.getPercentage();
that.$forceUpdate();
// socket.init();
});
console.log(this.allDataList, this.dataList, "1688");
this.searchValue = "";
this.searchList = [];
this.showSearchList = false;
return data;
},
async setOneCateIndex(item, index) {
this.allDataList = [];
console.log(index, 99999);
var that = this;
this.currentStatusIndex = index;
// this.currentCateIndex = 0
this.searchValue = "";
this.searchList = [];
this.showSearchList = false;
this.$nextTick(async () => {
await that.getCourseDescriptionData();
this.$forceUpdate();
});
// this.handleselectCate(this.cateList[this.currentCateIndex])
// if (index != 2) {
// uni.createSelectorQuery().select('.statusList').boundingClientRect(function (rect) {
// var height = rect.height
// console.log('元素高度:',);
// }).exec();
// } else {
// this.getJFList(dictType)
// }
},
transformData(inputData) {
const result = {};
inputData.forEach((item) => {
const { letter } = item;
if (!result[letter]) {
result[letter] = [];
}
result[letter].push(item);
});
// const finalResult = Object.keys(result).map(key => ({ [key]: result[key] }));
return result;
},
// 放大图片
previewImage(url) {
console.log(url);
uni.previewImage({
urls: [url],
longPressActions: {
itemList: ["很抱歉,暂不支持保存图片到本地"],
success: function (res) {
// console.log(res,'+++++')
},
},
});
},
},
onBackPress() {
// #ifdef APP-PLUS
plus.key.hideSoftKeybord();
// #endif
},
};
</script>
<style lang="scss" scoped>
@import "@/style/mixin.scss";
.u-grid-list {
// height: 40rpx;
}
.searchList {
.item {
font-size: 28rpx;
padding: 20rpx;
border-bottom: 1px solid #dadbde;
}
}
.scroll-view_H {
background-color: #fff;
white-space: nowrap;
padding: 10rpx;
}
.contentBox {
height: calc(100% - 50px);
.statusList {
padding: 10rpx;
box-sizing: border-box;
justify-content: space-between;
text {
text-align: center;
display: inline-block;
width: 32%;
padding: 20rpx 0;
font-size: 34rpx;
border-radius: 10rpx;
}
.cur {
background-color: $themeColor;
color: #fff;
box-shadow: 0 2px 12px 0 rgba(0, 0, 0, 0.1);
}
}
.twoCateList {
font-size: 28rpx;
margin-top: 20rpx;
.grid-text {
padding: 10rpx 0rpx;
text-align: center;
}
.cur {
color: $themeColor;
}
// .u-grid-list{border: 0.5px solid #dadbde;}
}
.dataList {
font-size: 26rpx;
// margin-top: 20rpx;
// padding: 32rpx 0rpx;
border-radius: 10rpx;
background-color: #f8f9fa;
box-sizing: border-box;
.JFtitleItem {
background-color: #ffffff;
padding: 20rpx 10rpx;
width: 100%;
border-bottom: 0.5px solid #f8f9fa;
}
.wmzhimg {
width: 220rpx;
height: 220rpx;
}
}
}
.search_box {
margin: 0 auto;
overflow: hidden;
align-items: center;
width: calc(100% - 10px);
margin-top: 20rpx;
margin-bottom: 20rpx;
.search {
height: 56upx;
display: flex;
width: 86%;
margin: 0 auto;
align-items: center;
padding: 0upx 40upx;
background-color: #fff;
border-radius: 20upx;
box-shadow: 0 0px 10px 1px $themeColor;
}
.prompt {
color: #838383;
font-size: 24rpx;
}
.icon_search {
background-image: url("@/static/icon/map_ic_search.png");
background-position: center center;
background-repeat: no-repeat;
background-size: cover;
width: 36upx;
height: 36upx;
margin-right: 20upx;
}
}
.flexbox {
display: flex;
}
.uni-modal .uni-modal__bd {
text-align: left;
}
.limiTy {
font-size: 28rpx;
line-height: 46rpx;
}
.chImage {
height: 100rpx;
}
.dataList {
height: 100%;
}
.titleList2 {
height: calc(100% - 150rpx);
}
.priceDetail {
height: calc(100% - 180rpx) !important;
padding: 0rpx 0;
box-sizing: border-box;
}
.componentPage {
height: calc(100% - 90rpx) !important;
}
.dateReminder {
width: 100%;
font-size: 24rpx;
text-align: right;
line-height: 40rpx;
}
.fdButtonBox {
border: 1rpx solid $themeColor;
background-color: $themeColor;
color: #fff;
// width: 100%;
float: right;
padding: 4rpx 14rpx;
font-size: 24rpx;
font-weight: 500;
line-height: 30rpx;
border-radius: 10rpx;
box-sizing: border-box;
// margin-top: 20rpx;
// display: flex;
// align-items: center;
}
.fdButtonBoxRed {
border: 1rpx solid red;
background-color: red;
padding: 8rpx 14rpx;
font-size: 28rpx;
}
.headImage {
// height: 600rpx !important;
}
.commonDetailPage {
}
.curriulum_box {
margin-top: 20rpx;
width: 100%;
.curriulum_title_box {
display: flex;
align-items: center;
margin-bottom: 20rpx;
background-color: #fff;
.curriulum_title {
width: calc(100% - 80rpx);
font-size: 32rpx;
line-height: 40rpx;
padding: 20rpx;
box-sizing: border-box;
}
}
}
/deep/.titleItem {
// width: calc(100% - 120rpx) !important;
}
/deep/.scroll-view-item:nth-child(2n-1) {
background-color: transparent !important;
}
.dataList {
height: auto !important;
}
.small_class_teaching_box {
width: 100%;
margin-top: 20rpx;
background: #b7e0e2;
.small_class_teaching_top {
padding: 20rpx 20rpx 0 10rpx;
box-sizing: border-box;
display: flex;
align-items: center;
justify-content: space-between;
// background: #EDFCF7;
color: #8f8e8e;
// box-shadow: 0px 0px 6rpx 0px #E9DCCC;
.icon1 {
width: 50rpx;
height: 50rpx;
}
.small_class_teaching_top_left {
display: flex;
align-items: center;
color: #018f89;
font-family: MicrosoftYaHei;
}
}
.small_class_teaching_content {
margin-top: 20rpx;
// background: #EDFCF7;
padding-bottom: 10rpx;
.top {
padding: 20rpx 20rpx;
box-sizing: border-box;
display: flex;
align-items: center;
justify-content: space-between;
border-bottom: 4rpx solid #fff;
.top_item {
width: 23%;
font-family: PangMenZhengDaoBiaoTiTiMianFeiBan;
font-weight: normal;
font-size: 34rpx;
color: #018f89;
line-height: 80rpx;
background: #cef8ea;
text-align: center;
border-radius: 10rpx;
box-shadow: 0px 0px 6rpx 0px #e9dccc;
}
}
.schedule {
width: 100%;
overflow: hidden;
padding: 20rpx 20rpx;
box-sizing: border-box;
align-items: center;
color: #018f89;
// font-family: MicrosoftYaHei;
.icon_box {
width: 100%;
display: flex;
align-items: center;
margin-bottom: 0rpx;
font-weight: 700;
.icon1 {
width: 50rpx;
height: 50rpx;
margin-right: 10rpx;
}
}
.progress_box {
width: 100%;
display: flex;
align-items: center;
position: relative;
.progress_icon {
width: calc(100% - 240rpx);
display: flex;
}
.icon1 {
width: 60rpx;
height: 60rpx;
margin: 0 20rpx;
}
.icon2 {
width: 140rpx;
height: 100rpx;
position: absolute;
right: 0;
// margin-top: -20rpx;
}
}
}
}
}
.related_courses_box {
background-color: #fff;
.small_class_teaching_content {
padding: 10rpx 20rpx;
box-sizing: border-box;
}
}
.related_courses_name {
display: inline-block;
width: calc(100% - 150rpx) !important;
.aui-text-danger {
display: inline-block;
float: right;
}
}
// .common_curriculum_list{
// }
.goods_box {
padding: 40rpx 20rpx;
padding-bottom: 150rpx;
.goods_item {
overflow: hidden;
display: flex;
align-items: center;
justify-content: space-between;
margin-bottom: 20rpx;
padding: 10rpx 20rpx;
border: 2rpx solid #fff;
border-radius: 10rpx;
}
.title {
box-sizing: border-box;
font-weight: bold;
margin-bottom: 20rpx;
}
.image_box {
width: 70rpx !important;
height: 70rpx !important;
float: left;
background-color: #f5f5f5;
}
.goods_image {
width: 100%;
height: 100%;
}
.goods_info {
width: calc(100% - 100rpx);
// padding: 10rpx 20rpx;
box-sizing: border-box;
// height: 100rpx;
display: flex;
align-items: center;
justify-content: space-between;
float: left;
.name {
font-size: 30rpx;
font-weight: 600;
color: #333;
}
.price {
font-size: 26rpx;
color: #aaa;
font-weight: 600;
}
}
.isSelectGoods {
color: $themeColor !important;
.name {
color: $themeColor !important;
}
.price {
color: $themeColor !important;
}
border: 2rpx solid $themeColor;
border-radius: 10rpx;
}
}
.popup_box {
padding-bottom: 20rpx;
width: 85vw;
overflow: hidden;
position: relative;
height: auto;
.title {
font-family: PangMenZhengDaoBiaoTiTiMianFeiBan;
font-weight: normal;
font-size: 46rpx;
color: $themeColor;
background-color: #f5f5f5;
// line-height: 46rpx;
padding: 20rpx;
// border-leradius: 6px;
border-top-left-radius: 6px;
border-top-right-radius: 6px;
}
.content {
font-size: 26rpx;
letter-spacing: 0.15rpx;
padding: 20rpx;
color: #3f3f3f;
.top {
margin: 30rpx 0;
}
.center {
line-height: 40rpx;
// padding:0 10rpx;
}
.bottom {
width: 100%;
margin-top: 60rpx;
font-size: 24rpx;
line-height: 26rpx;
color: #b0b0b0;
}
}
.button_box {
display: flex;
align-items: center;
justify-content: space-between;
margin-top: 20rpx;
.u-button {
margin-left: 40rpx;
}
.u-button:nth-child(1) {
margin-left: 0;
}
}
}
</style>