Files
medicine_app/pages/course/chapterDetailAndorid.vue
2024-07-20 10:44:32 +08:00

1408 lines
36 KiB
Vue
Raw Blame History

This file contains invisible Unicode characters
This file contains invisible Unicode characters that are indistinguishable to humans but may be processed differently by a computer. If you think that this is intentional, you can safely ignore this warning. Use the Escape button to reveal them.
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">
<!-- 公共组件-每个页面必须引入 -->
<public-module></public-module>
<template v-show="!screenLoading">
<z-nav-bar bgColor="#333" fontColor="#fff" title="教学内容"></z-nav-bar>
<view
class="contentBox curriculum_box"
:style="`height:calc(100% - ${60 + statusBarHeight}px !important;${
isFullScreen ? 'background:#000' : ''
}`"
>
<!-- 加密视频 -->
<view :style="`background:#000`">
<common-video
@changeScreen="changeScreen"
@changeScreenLoading="changeScreenLoading"
v-if="isfresh"
ref="commonVideo"
 :videoTitle="curriculumData.title"
:currentVideo="currentVideo"
:noRecored = "noRecored"
:currentVideoList="videoArray"
>
</common-video>
<view style="height: 200px" v-else></view>
</view>
<!-- <common-sticky
style=""
itemStyle="width:auto; height: 80rpx;font-size:20rpx;color:#fff"
:list="ordersTabs"
label="name"
:currentCateIndex="currentCateIndex"
@handleselectCate="ordersTabCLi"
></common-sticky> -->
<scroll-view
:style="`height:calc(100% - 200px - 40rpx) ;`"
scroll-y="true"
class="scroll-Y"
style="background-color: #fff"
>
<view
class="PM_font"
style="padding: 20rpx; font-size: 40rpx; color: #2979ff"
>视频教学</view
>
<view class="scroll-view-item">
<view style="padding: 20rpx; font-size: 26rpx">
课程{{ options.navTitle }}
</view>
<view
style="padding: 20rpx; margin-bottom: 40rpx; font-size: 26rpx"
>
章节{{ curriculumData.title }}
</view>
<common-curriculum-video
v-if="videoArray && videoArray.length > 0"
:detailInfo="curriculumData"
:currentVideo="currentVideo"
:dataList="videoArray"
@open="changeVideo"
>
</common-curriculum-video>
</view>
<view
class="PM_font"
style="padding: 20rpx; font-size: 40rpx; color: #333"
>文章简介</view
>
<view class="scroll-view-item">
<common-rich-detail :detailInfo="{ ...curriculumData, title: '' }">
<template #richHeadImg>
<image
v-if="curriculumData.imgUrl"
@click="previewImage(curriculumData.imgUrl)"
: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>
</scroll-view>
<p class="aui-text-danger" style="text-align: center">
本课程版权归天津众妙之门科技有限公司所有翻版必究!
</p>
<!-- <view class="small_class_teaching_box" v-if="medicalCasesList.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"> </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>
</template>
<template slot="rightSlot" slot-scope="slotProps">
<text class="aui-text-danger">
{{ slotProps.row.courseFee }}</text
>
<view> </view>
</template>
</common-curriculum-list>
</view>
</view>
<view
class="small_class_teaching_box correlation_box"
v-for="(v, i) in correlationiList"
>
<view class="small_class_teaching_top">
<view class="small_class_teaching_top_left">
<template v-if="v.iconType == 'uni'">
<uni-icons
:type="v.icon"
:color="v.color ? v.color : '#71d5a1'"
:size="v.iconSize"
style="display: inline-block; margin-right: 10rpx"
></uni-icons>
</template>
<template v-else>
<u-icon
:name="v.icon"
:color="v.color ? v.color : '#71d5a1'"
:size="v.iconSize"
style="display: inline-block; margin-right: 10rpx"
></u-icon>
</template>
<text
:style="`color:${v.color ? v.color : '#71d5a1'}`"
class="title"
>{{ v.name }}</text
>
</view>
<view class="small_class_teaching_top_right"
><text
:style="`color:#b0b0b0`"
class="more"
@click="handleClickMore(v, i, true)"
v-show="!v.isOpen"
v-if="v.type != 'dashang'"
>查看全部</text
>
</view>
</view>
<view
:class="`small_class_teaching_content dianzan_box ${
v.isOpen ? '' : 'hidden5'
}`"
v-if="v.type == 'dianzan'"
>
{{ praise }}
</view>
<view
:class="`small_class_teaching_content dianzan_box ${
v.isOpen ? '' : 'hidden5'
}`"
v-if="v.type == 'pinglun'"
>
<view v-for="(item, index) in commentLst">
<text>{{ item.name }}:</text>
<text>{{ item.content }}</text>
</view>
</view>
<view
:class="`small_class_teaching_content dianzan_box dashang_box ${
v.isOpen ? '' : 'hidden5'
}`"
v-if="v.type == 'dashang'"
>
<rich-text :nodes="reward"></rich-text>
</view>
<view
@click="handleClickMore(v, i, false)"
class="close"
v-show="v.isOpen"
>收起
<u-icon
name="arrow-up"
color="#b0b0b0"
size="18"
style="display: inline-block; margin-left: 10rpx"
></u-icon>
</view>
</view> -->
</view>
</template>
<view
style="
background-color: red;
position: fixed;
top: 0;
left: 0;
right: 0;
bottom: 0;
"
v-show="screenLoading"
>
</view>
<!-- <u-modal
:show="show"
:title="modalInfo.title"
:content="modalInfo.content"
showCancelButton
@confirm="hancleModalConfirm"
@cancel="hancleModalCancel"
></u-modal> -->
<!-- <z-navigation></z-navigation> -->
</view>
</template>
<script>
import courseDescription from "@/pages/component/commonComponents/list";
import curriculumMp3 from "./mp3Detail.vue";
import price from "./price/index.vue";
import $http from "@/config/requestConfig.js";
import { mapState } from "vuex";
export default {
components: {
courseDescription, //课程说明
price, //课程价格
curriculumMp3, //mp3
},
data() {
return {
isFullScreen: false,
screenLoading: false,
isfresh: false,
currentCateIndex: 0,
currentVideo: {},
videoList: {},
isOpenMp3: false,
praise: "",
reward: "",
commentLst: [],
correlationiList: [
// { name: "点赞", type: 'dianzan', icon: "thumb-up-fill", iconType: 'uview', iconSize: 22, color: '$themeColor' },
//{ name: "打赏", type: 'dashang', icon: "red-packet-fill", iconType: 'uview', iconSize: 22, color: '#ff3d00' },
//{ name: "评论", type: 'pinglun', icon: "chat-fill", iconType: 'uview', iconSize: 22 },
],
options: {},
videoArrayHW: [],
videoArray: [],
relatedCoursesList: [], //相关课程
medicalCasesList: [], //相关医案
curriculumData: {},
curriculumInfo: {},
fdButtonStyle: {
width: "120rpx",
"border-color": "#000",
color: "#000",
float: "right",
"margin-right": "20rpx",
"margin-left": "30rpx",
},
modalInfo: {},
show: false,
playData: {},
taiHuClassInfo: {},
searchValue: "",
ordersTabs: [
{
name: "视频教学",
type: "1",
},
{
name: "文章简介",
type: "2",
},
], // 一级分类标题1
cateList: [], // 一级分类标题1
twoCateList: [], // 二级分类标题
dataList: [], // 方剂标题
allDataList: [], // 方剂标题
currentStatusIndex: 0, // 当前选中的一级分类
curTwoCateIndex: 0, // 当前选中的二级分类
searchList: [], // 搜索结果数组
showSearchList: false,
userMes: {}, // 用户信息
searchDisable: false, // 搜索不可用
limitShow: false,
limitTitle: "提示",
limitContent: "",
scrollViewHeight: 0,
noRecored:null, // 是否为试听资源
urlList: {
detail: "sociology/course/getCourseCatalogueChapterDetail",
curriculumInfo: "app/phone.do?getCourseInfo",
},
};
},
onLoad(options) {
// #ifdef APP-PLUS
plus.screen.lockOrientation("default");
// #endif
this.options = options;
this.noRecored = options.noRecored
console.log('this.noRecored=>',this.noRecored)
this.screenLoading = false;
this.currentCateIndex = this.options.videoIndex
? this.options.videoIndex
: 0;
// #ifdef APP-PLUS
plus.screen.unlockOrientation(); //解除锁定屏幕方向
plus.screen.lockOrientation("portrait-primary");
this.getCourseDescriptionData();
// this.getUserInfo()
// this.getCateList()
},
onUnload(){
console.log('页面卸载')
this.$nextTick(()=>{
this.$refs.commonVideo.handleEnd();
})
},
onHide() {
// this.showSearchList = false
// this.searchList = []
},
onShow() {
// #endif
},
computed: {
...mapState(["userInfo"]),
},
methods: {
// 放大图片
//课程详情
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("请先购买课程");
}
},
changeScreenLoading(status) {
this.screenLoading = status;
},
changeScreen(status) {
this.isFullScreen = status;
},
ordersTabCLi(data) {
console.log("i at line 312:", data);
this.currentCateIndex = data.index;
this.$forceUpdate();
},
initVideo() {
this.screenLoading = false;
this.isfresh = false;
this.$nextTick(() => {
this.isfresh = true;
setTimeout(() => {
this.$refs.commonVideo.init({
currentVideo: this.currentVideo,
currentVideoList: this.videoArray,
});
}, 200);
});
},
changeVideo(data) {
console.log("data at line 370:", data);
if (data.id != this.currentVideo.id) {
// handleEnd
this.$refs.commonVideo.handleEnd();
setTimeout(() => {
this.currentVideo = data;
this.initVideo();
this.isOpenMp3 = false;
}, 500);
} else {
this.currentVideo = data;
this.initVideo();
this.isOpenMp3 = false;
}
console.log("data at line 380111111111111111111:", data.type);
// var mynavData = JSON.stringify(data); // 这里转换成 字符串
// if (data.type == 0 || data.type == 2) {
// //1 mp4 2 mp3
// uni.navigateTo({
// url: `/pages/curriculum/order/curriculum/videoDetail?data=${mynavData}`,
// });
// } else if (data.type == 1) {
// //视频云点播
// uni.navigateTo({
// url: `/pages/curriculum/order/curriculum/videoDetailOss?data=${mynavData}`,
// });
// }
// else if (data.type == 2) {
// //mp3
// this.isOpenMp3 = true;
// this.$nextTick(() => {
// this.$refs.mp3Detail.init({ data: mynavData });
// });
// }
// uni.navigateTo({
// // url: '../bookShop/commodityDetail?id=' + item.id
// url: `/pages/curriculum/order/curriculum/detail?navTitle=${v.title}&title=${v.title}&oid=${v.oid}`,
// });
},
hancleModalCancel() {
this.show = false;
},
handleClickMore(v, i, status) {
console.log("i at line 357:", i);
this.$set(this.correlationiList[i], "isOpen", status);
// [i].=!this.correlationiList[i].isOpen;
},
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();
// });
},
//课程详情
gotoDetail(v) {
console.log(v);
uni.navigateTo({
// url: '../bookShop/commodityDetail?id=' + item.id
url: `/pages/curriculum/order/curriculum/detail?navTitle=${v.title}&title=${v.title}&oid=${v.oid}`,
});
},
//相关课程
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}&id=${v.id}`,
});
},
getCourseDescriptionData() {
var data = {
id: this.options.id,
load: false,
// id: "16457",
};
var that = this;
console.log(this.$store.state, "11111111111");
$http
.request({
// url: "book/buyOrder/buySave",
url: `${this.urlList.detail}`,
method: "POST", // POST、GET、PUT、DELETE具体说明查看官方文档
data,
header: {
//默认 无 说明:请求头
"Content-Type": "application/json",
},
})
.then(async (res) => {
that.curriculumData = res.data.detail;
that.videoArray = res.data.videos;
console.log("that.videoArray at line 这是关联的视频519:", res);
var isHaveHistorySeekVideo = that.videoArray.findIndex(
(e) => e.id == res.data.current
);
console.log(
"isHaveHistorySeekVideo at line 522:",
isHaveHistorySeekVideo
);
that.currentCateIndex =
isHaveHistorySeekVideo != -1 ? isHaveHistorySeekVideo : 0;
if (that.videoArray.length > 0) {
this.currentVideo = that.videoArray[that.currentCateIndex];
this.initVideo();
}
// if (res.obj.correlatedList && res.obj.correlatedList.length > 0) {
// this.relatedCoursesList =
// res.obj.correlatedList && res.obj.correlatedList.length > 0
// ? res.obj.correlatedList
// : [];
// this.medicalCasesList =
// res.obj.dataList && res.obj.dataList.length > 0
// ? res.obj.dataList
// : [];
// this.commentLst =
// res.obj.commentLst && res.obj.commentLst.length > 0
// ? res.obj.commentLst
// : [];
// this.praise = res.obj.praise
// ? res.obj.praise
// .split("")
// .filter((e) => e != "")
// .join("")
// : "";
// this.reward = res.obj.reward
// ? res.obj.reward
// .split("")
// .filter((e) => e != "")
// .join("")
// : "";
// correlatedListEl.innerHTML = courseDot(ret.correlatedList);
// }
var videoArray = [];
var videoArrayHW = [];
// break;
// switch (that.curriculumData.videoType) {
// case "01":
// // allDataList
// // voices
// that.videoArray = res.obj.videos.split(",");
// that.videoArrayHW = res.obj.videos.split(",");
// if (res.obj.dataLst && res.obj.dataLst.length > 0) {
// // dataGrid.innerHTML = dot(ret.dataLst);
// }
// break;
// case "02":
// that.videoArray = res.obj.videoId.split(",");
// if (res.obj.dataLst && res.obj.dataLst.length > 0) {
// // res.obj.dataLst
// console.log("res.obj.dataLst at line 436:", res.obj.dataLst);
// }
// break;
// // console.log(this.dataList.length, 6666666)
// break;
// }
// if (res.obj.w_videoIds != "") {
// // 海外视频
// // $mars.initAVDataHW(ret.oid,'1', 'videoHW', ret.w_videoIds, 'taiHuClass/');
// that.videoArrayHW = res.obj.w_videoIds.split(",");
// // if (ret.dataLst && ret.dataLst.length > 0) {
// // dataGrid.innerHTML = dot(ret.dataLst);
// // }
// // if (ret.correlatedList && ret.correlatedList.length > 0) {
// // correlatedListEl.innerHTML = courseDot(ret.correlatedList);
// // }
// }
// that.cateList = res.obj.courseTabs
// that.relatedCoursesList = res.obj.correlatedList
// await that.handleselectCate({ ...this.cateList[0], index: 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) {
this.dataList = [];
var data = [];
console.log(item, index, 99999);
var that = this;
// curriculumInfo
this.$http
.post(this.urlList.curriculumInfo, {
customerType: "D",
token: uni.getStorageSync("token"),
customerOid: uni.getStorageSync("customerOid"),
oid: item.coid,
})
.then(async (res) => {
that.curriculumInfo = res.obj;
that.dataList = res.obj.courseList;
// socket.init();
});
// this.$nextTick(() => {
// switch (item.type) {
// case 1:
// // allDataList
// this.dataList = that.allDataList.result1Lst
// break;
// case 2:
// this.dataList = that.allDataList.result2Lst
// break;
// case 3:
// this.dataList = that.allDataList.result3Lst
// break;
// case 4:
// this.dataList = that.allDataList.result4Lst.filter(e =>
// e.oid != '5fcf991c027b11e7ae62008cfae40c18' && e.oid != 'b3d8a938b8e147bc877613bb712a9cb3' && e.oid != '4d4730163135420ea962bfac4805e026' && e.oid != '49fb76ca3d6b43718d78c6aa9a3003c2' && e.oid != 'c7b047ed9246469b9ae2b1013fc3df9c'
// )
// console.log(this.dataList.length, 6666666)
// break;
// }
// this.currentCateIndex = item.index
// })
console.log(this.allDataList, this.dataList, "1688");
// if(this.userMes.tgdzPower == 0){
// let that = this
// uni.showModal({
// content: "购买 针灸六经法要上册和下册 后方可使用此功能",
// confirmText: '好的',
// showCancel: false,
// success: function(res) {
// if (res.confirm) {
// // console.log('用户点击确定');
// }
// }
// })
// return
// }
// if(item.title == "时辰取穴"){
// uni.navigateTo({
// url: "../timeAcupoint/timeAcupoint"
// })
// return
// }
// this.currentStatusIndex = index
this.searchValue = "";
this.searchList = [];
this.showSearchList = false;
// if (index != 2) {
// uni.createSelectorQuery().select('.statusList').boundingClientRect(function (rect) {
// var height = rect.height
// console.log('元素高度:',);
// }).exec();
// } else {
// this.getJFList(dictType)
// }
return data;
},
async setOneCateIndex(item, index) {
this.allDataList = [];
console.log(index, 99999);
var that = this;
// if(this.userMes.tgdzPower == 0){
// let that = this
// uni.showModal({
// content: "购买 针灸六经法要上册和下册 后方可使用此功能",
// confirmText: '好的',
// showCancel: false,
// success: function(res) {
// if (res.confirm) {
// // console.log('用户点击确定');
// }
// }
// })
// return
// }
// if(item.title == "时辰取穴"){
// uni.navigateTo({
// url: "../timeAcupoint/timeAcupoint"
// })
// return
// }
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;
},
// getJFList(id) {
// $http.request({
// url: "book/prescript/prescriptListForJF",
// method: "POST", // POST、GET、PUT、DELETE具体说明查看官方文档
// data: {
// loadAnimate: 'none', // 请求加载动画
// 'categoryId': id
// },
// header: { //默认 无 说明:请求头
// 'Content-Type': 'application/json'
// },
// }).then(res => {
// if (res.code == 0 && res.list.length > 0) {
// this.twoCateList = []
// this.dataList = this.transformData(res.list)
// console.log('JF经方', this.dataList)
// } else {
// this.twoCateList = []
// this.dataList = []
// }
// }).catch(e => {
// this.twoCateList = []
// this.dataList = []
// console.log(e)
// })
// },
getCateList(id) {
id ? "" : (id = 0);
this.twoCateList = [];
this.curTwoCateIndex = 0;
// 0为获取顶级分类其他为搜索下级分类目前的逻辑顶级是写死的所以可能只会涉及到搜索第二级
// $http.request({
// url: "book/prescript/prescriptCategoryList",
// method: "POST", // POST、GET、PUT、DELETE具体说明查看官方文档
// data: {
// loadAnimate: 'none', // 请求加载动画
// 'categoryId': id
// },
// header: { //默认 无 说明:请求头
// 'Content-Type': 'application/json'
// },
// }).then(res => {
// console.log(res, '脉穴分类获取成功')
// if (res.code == 0 && res.list.length > 0) {
// this.statusList = res.list
// this.getTowCateList(this.statusList[0].type)
// } else {
// this.statusList = []
// }
// }).catch(e => {
// this.statusList = []
// console.log(e)
// })
},
// 放大图片
previewImage(url) {
console.log("这是点击了图片啊啊啊啊", url);
uni.previewImage({
urls: [url],
longPressActions: {
itemList: ["很抱歉,暂不支持保存图片到本地"],
success: function (res) {
// console.log(res,'+++++')
},
},
});
},
// getSearch() {
// $http.request({
// url: "book/prescript/searchPrescript",
// method: "POST", // POST、GET、PUT、DELETE具体说明查看官方文档
// data: {
// loadAnimate: 'none', // 请求加载动画
// 'keywords': this.searchValue,
// type: this.currentStatusIndex + 1
// },
// header: { //默认 无 说明:请求头
// 'Content-Type': 'application/json'
// },
// }).then(res => {
// console.log(res, '搜索结果')
// if (res.code == 0 && res.list.length >= 0) {
// this.showSearchList = true
// this.searchList = res.list
// } else {
// this.searchList = []
// }
// }).catch(e => {
// // this.dataList = []
// this.searchList = []
// console.log(e)
// })
// },
// search(res) {
// console.log(res, 'res')
// // uni.showToast({
// // title: '搜索:' + res,
// // icon: 'none'
// // })
// if (res == '') {
// this.showSearchList = false
// this.searchList = []
// } else {
// this.getSearch()
// }
// },
// input(res) {
// console.log('----input:', res)
// if (res == '') {
// this.searchList = []
// } else {
// this.getSearch()
// }
// },
// clear(res) {
// console.log('----clear:', res)
// // uni.showToast({
// // title: 'clear事件清除值为',
// // icon: 'none'
// // })
// this.searchValue = ''
// this.showSearchList = false
// },
// blur(res) {
// // console.log('----blur:', res)
// // if (res == '') {
// // this.showSearchList = false
// // this.searchList = []
// // } else {
// // this.getSearch()
// // }
// },
// focus(e) {
// console.log('----focus:')
// // uni.showToast({
// // title: 'focus事件输出值为' + e.value,
// // icon: 'none'
// // })
// // 等于1 就是有权限
// // this.showSearchList = true
// },
// cancel(res) {
// uni.showToast({
// title: '点击取消,输入值为:' + res.value,
// icon: 'none'
// })
// }
},
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: 100vh;
.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;
}
.headImage {
// height: 400rpx !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;
.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);
}
.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;
}
}
.curriculum_box {
.curriculum_title {
padding: 20rpx 40rpx 0;
font-size: 38rpx;
line-height: 66rpx;
font-weight: bold;
text-align: center;
box-sizing: border-box;
margin-bottom: 20rpx;
}
}
// .common_curriculum_list{
.curriculum_content {
background-color: #fff;
padding-bottom: 40rpx;
.richDetail {
height: auto !important;
margin-bottom: 20rpx;
}
}
.dianzan_box {
width: calc(100% - 80rpx);
margin: 0 auto;
padding: 20rpx 20rpx;
color: #6e6e6e;
font-weight: 600;
text-align: justify;
background: #f4fffb;
border-radius: 10rpx;
box-shadow: 0px 0px 6rpx 0px #e9dccc;
}
.dashang_box {
color: #ff5521;
background: #fff7f4;
box-shadow: 0px 0px 6rpx 0px rgba(255, 85, 33, 0.4);
}
.correlation_box {
background-color: #fff;
padding-bottom: 40rpx;
.title {
font-family: PangMenZhengDaoBiaoTiTiMianFeiBan;
font-weight: normal;
font-size: 40rpx;
color: #018f89;
}
.more {
font-size: 24rpx;
}
.close {
text-align: center;
color: #b0b0b0;
line-height: 40rpx;
margin-top: 10rpx;
// padding-bottom: 30rpx;
display: flex;
align-items: center;
justify-content: center;
}
}
</style>