商学院

app.json

@@ -24,7 +24,10 @@
         "pages/login/retrievePassword",
         "pages/tabbar/smartStore/folder",
         "pages/threadedTree/index",
-        "pages/threadedTree/details/index"
+        "pages/threadedTree/details/index",
+        "pages/classroom/index",
+        "pages/classroom/list",
+        "pages/classroom/detail"
     ],
     "usingComponents": {
         "My_card": "/components/My_card/index",

pages/classroom/detail.js

@@ -0,0 +1,142 @@
+const _Http = getApp().globalData.http,
+    MFT = require("../../utils/matchingFeilType");
+
+let sat_coursewareid = null;
+
+Page({
+    data: {
+
+    },
+    onLoad(options) {
+        sat_coursewareid = options.id;
+        this.getDetail()
+    },
+    getDetail() {
+        _Http.basic({
+            "classname": "saletool.courseware.courseware",
+            "method": "selectDetail",
+            "content": {
+                sat_coursewareid
+            }
+        }).then(res => {
+            console.log("详情", res)
+            if (res.msg != '成功') return wx.showToast({
+                title: res.msg,
+                icon: "none"
+            });
+            let videoList = [], //视频附件列表
+                attinfos = []; //其他附件
+            if (res.data.attinfos.length) MFT.fileList(res.data.attinfos).filter(v => {
+                if (v.usetype != 'cover') v.fileType == 'video' ? videoList.push(v) : attinfos.push(v)
+            });
+            this.setData({
+                videoList,
+                attinfos,
+                play: videoList[0] || null,
+                detailData: res.data,
+            });
+        })
+    },
+    /* 选择播放视频 */
+    playItem(e) {
+        const {
+            item
+        } = e.currentTarget.dataset;
+        if (this.data.play.attachmentid == item.attachmentid) return;
+        this.setData({
+            play: item
+        })
+    },
+    /* 播放结束更改状态 */
+    onEnded() {
+        let play = this.data.play;
+        if (play.status == '已学习') return;
+        _Http.basic({
+            "classname": "saletool.courseware.courseware",
+            "method": "updateAttInfoLearnLog",
+            "content": {
+                sat_coursewareid,
+                attachmentid: play.attachmentid
+            }
+        })
+        play.status = '已学习';
+        this.data.videoList.find(v => v.attachmentid == play.attachmentid).status = '已学习';
+        this.setData({
+            play,
+            videoList: this.data.videoList
+        })
+    },
+    /* 打开文档 */
+    openDoc(e) {
+        const {
+            item
+        } = e.currentTarget.dataset,
+            that = this;
+        if (item.fileType == 'image') {
+            wx.previewImage({
+                urls: [item.url],
+            })
+        } else {
+            wx.showLoading({
+                title: '打开中...',
+                mask: true
+            })
+            wx.downloadFile({
+                // 示例 url，并非真实存在
+                url: item.url,
+                success: function (res) {
+                    const filePath = res.tempFilePath
+                    wx.openDocument({
+                        filePath: filePath,
+                        success: function (res) {
+                            console.log('打开文档成功')
+                            wx.hideLoading()
+                        },
+                        fail(err) {
+                            console.log(err)
+                            that.copyUrl(item)
+                            wx.hideLoading()
+                        }
+                    })
+                },
+                fail(err) {
+                    console.log(err)
+                    that.copyUrl(item)
+                    wx.hideLoading()
+                }
+            })
+        };
+        if (item.status == '已学习') return;
+        _Http.basic({
+            "classname": "saletool.courseware.courseware",
+            "method": "updateAttInfoLearnLog",
+            "content": {
+                sat_coursewareid,
+                attachmentid: item.attachmentid
+            }
+        });
+        this.data.attinfos.find(v => v.attachmentid == item.attachmentid).status = '已学习';
+        this.setData({
+            attinfos: this.data.attinfos
+        })
+    },
+    copyUrl(item) {
+        wx.showModal({
+            title: '提示',
+            content: `该文件不支持在线预览，是否复制链接到剪切板在浏览器中尝试打开文件`,
+            confirmText: "复制",
+            complete: (res) => {
+                if (res.confirm) wx.setClipboardData({
+                    data: item.url,
+                    success(s) {
+                        wx.showToast({
+                            title: '已将文件地址复制到剪切板',
+                            icon: "none",
+                            mask: true
+                        })
+                    }
+                })
+            }
+        })
+    }
+})

pages/classroom/detail.json

@@ -0,0 +1,6 @@
+{
+    "usingComponents": {
+        "My_empty":"/components/My_empty/index"
+    },
+    "navigationBarTitleText": "课程详情"
+}

pages/classroom/detail.scss

@@ -0,0 +1,61 @@
+.header {
+    width: 750rpx;
+    height: 392rpx;
+}
+
+/* 基础盒子 */
+.bsae-box {
+    width: 750rpx;
+    padding: 20rpx 30rpx;
+    box-sizing: border-box;
+    background: #ffffff;
+    font-family: PingFang SC-Regular, PingFang SC;
+}
+
+/* 简介 */
+.brief {
+    .first-line {
+        display: flex;
+        align-items: center;
+        justify-content: space-between;
+        width: 100%;
+        font-size: 30rpx;
+        font-family: PingFang SC-Bold, PingFang SC;
+        font-weight: bold;
+        color: #333333;
+    }
+
+    .by-time {
+        height: 28rpx;
+        display: flex;
+        align-items: center;
+        justify-content: space-between;
+        margin-top: 16rpx;
+        font-size: 20rpx;
+        color: #999999;
+    }
+
+    .notes {
+        margin-top: 10rpx;
+        font-size: 24rpx;
+        color: #666;
+    }
+}
+
+.item {
+    display: flex;
+    justify-content: space-between;
+    box-sizing: border-box;
+    padding: 20rpx 30rpx;
+    background-color: #fff;
+    font-size: 24rpx;
+    border-top: 1rpx solid #ddd;
+
+    text {
+        width: 84%;
+    }
+}
+
+.item:last-child {
+    border-bottom: 1rpx solid #ddd;
+}

pages/classroom/detail.wxml

@@ -0,0 +1,35 @@
+<video class="header" autoplay src="{{play.url}}" enable-play-gesture poster='{{play.subfiles[0].url||""}}' bindended="onEnded" />
+<!--  wx:if="{{play}}" -->
+<!-- 简介 -->
+<view class="brief bsae-box">
+    <view class="first-line">
+        {{detailData.title}}
+    </view>
+    <view class="by-time">
+        <text class="line-1">发布人：{{detailData.changeby}}</text>
+        <text>{{detailData.createdate}}</text>
+        <text>{{detailData.readcount}}人已学习</text>
+    </view>
+    <view wx:if="{{detailData.notes}}" class="notes">
+        {{detailData.notes}}
+    </view>
+</view>
+<view style="height: 20rpx;" />
+<van-tabs color='var(--assist)' title-active-color='var(--assist)'>
+    <van-tab title="课程视频">
+        <My_empty wx:if="{{!videoList.length}}" />
+        <view class="item" hover-class="navigator-hover" wx:for="{{videoList}}" wx:key="attachmentid" data-item="{{item}}" bind:tap='playItem'>
+            <text class="line-1">{{item.document}}</text>
+            <van-tag wx:if="{{item.status=='已学习'}}" type="success">{{item.status}}</van-tag>
+            <van-tag wx:else type="danger">{{item.status}}</van-tag>
+        </view>
+    </van-tab>
+    <van-tab title="课程资料">
+        <My_empty wx:if="{{!attinfos.length}}" />
+        <view class="item" hover-class="navigator-hover" wx:for="{{attinfos}}" wx:key="attachmentid" data-item="{{item}}" bind:tap='openDoc'>
+            <text class="line-1">{{item.document}}</text>
+            <van-tag wx:if="{{item.status=='已学习'}}" type="success">{{item.status}}</van-tag>
+            <van-tag wx:else type="danger">{{item.status}}</van-tag>
+        </view>
+    </van-tab>
+</van-tabs>

pages/classroom/index.js

@@ -0,0 +1,50 @@
+const _Http = getApp().globalData.http;
+let content = null;
+Page({
+    data: {
+
+    },
+    onLoad(options) {},
+    getList() {
+        _Http.basic({
+            "classname": "saletool.courseware.courseware",
+            "method": "selectMenu",
+            "content": {
+                pageSize: 999
+            }
+        }).then(res => {
+            console.log('分类', res)
+            if (res.msg != '成功') return wx.showToast({
+                title: res.msg,
+                icon: "none"
+            });
+            this.setData({
+                list: res.data
+            })
+        })
+
+        _Http.basic({
+            "classname": "saletool.courseware.courseware",
+            "method": "queryReadLog",
+            "content": {
+                "pageNumber": 1,
+                "pageSize": 10,
+                "where": {
+                    "condition": ""
+                }
+            }
+        }).then(res => {
+            console.log('学习足迹', res)
+            if (res.msg != '成功') return wx.showToast({
+                title: res.msg,
+                icon: "none"
+            });
+            this.setData({
+                history: res.data
+            })
+        })
+    },
+    onShow() {
+        this.getList()
+    },
+})

pages/classroom/index.json

@@ -0,0 +1,6 @@
+{
+    "usingComponents": {
+		"list":"./modules/list/index"
+    },
+    "navigationBarTitleText": "商学院"
+}

pages/classroom/index.scss

@@ -0,0 +1,51 @@
+.main {
+    display: flex;
+    flex-wrap: wrap;
+    justify-content: space-between;
+    width: 690rpx;
+    margin: 0 auto;
+
+    .item {
+        display: flex;
+        flex-direction: column;
+        width: 336rpx;
+        height: 280rpx;
+        border-radius: 16rpx;
+        overflow: hidden;
+        background-color: #FFFFFF;
+        margin-top: 20rpx;
+
+        .img {
+            width: 100%;
+            height: 200rpx;
+
+            .noimg {
+                display: flex;
+                align-items: center;
+                justify-content: center;
+                background-color: #EEEEEE;
+                width: 100%;
+                height: 100%;
+
+                .icon {
+                    font-size: 90rpx;
+                }
+            }
+
+            image {
+                width: 100%;
+                height: 200rpx;
+            }
+        }
+
+        .label {
+            text-align: center;
+            line-height: 80rpx;
+            font-size: 28rpx;
+            font-weight: normal;
+            color: #333333;
+            padding: 0 20rpx;
+            box-sizing: border-box;
+        }
+    }
+}

pages/classroom/index.wxml

@@ -0,0 +1,21 @@
+<van-tabs class="tabs" tab-class='tab-class' color='#3874F6' title-active-color='#3874F6' bind:change="tabsChange">
+    <van-tab title="课程列表">
+        <view class="main">
+            <navigator url="./list?id={{item.sat_courseware_classid}}" class="item" wx:for="{{list}}" wx:key="sat_courseware_classid">
+                <view class="img" wx:if="{{item.attinfos[0]}}">
+                    <image src="{{item.attinfos[0].subfiles[0].url}}" mode="aspectFill" />
+                </view>
+                <view class="img" wx:else>
+                    <view class="noimg">
+                        <van-icon custom-class='icon' size='70' color='#AFAFAF' name="photo-o" />
+                    </view>
+                </view>
+                <view class="label line-1">{{item.classname}}</view>
+            </navigator>
+        </view>
+    </van-tab>
+    <van-tab title="学习足迹">
+        <view style="height: 20rpx;" />
+        <list list="{{history}}" />
+    </van-tab>
+</van-tabs>

pages/classroom/list.js

@@ -0,0 +1,54 @@
+const _Http = getApp().globalData.http,
+	getHeight = require("../../utils/getRheRemainingHeight");
+let content = null;
+Page({
+	data: {
+
+	},
+	onLoad(options) {
+		content = {
+			nacache: true,
+			pageNumber: 1,
+			pageSize: 999,
+			where: {
+				condition: "",
+				sat_courseware_classid: options.id,
+				learnstatus: "未学习"
+			}
+		}
+		this.getList()
+	},
+	getList() {
+		_Http.basic({
+			"classname": "saletool.courseware.courseware",
+			"method": "selectList",
+			content
+		}).then(res => {
+			console.log('课程列表', res)
+			this.selectComponent('#ListBox').RefreshToComplete();
+			if (res.msg != '成功') return wx.showToast({
+				title: res.msg,
+				icon: "none"
+			});
+			this.setData({
+				list: res.data,
+				total: res.total
+			})
+		})
+	},
+	tabsChange(e){
+		content.where.learnstatus = e.detail.title;
+		this.getList();
+	},
+	onSearch({
+		detail
+	}) {
+		content.where.condition = detail;
+		this.getList();
+	},
+	onReady() {
+		getHeight.getHeight('.head', this).then(scrollHeight => this.setData({
+			scrollHeight
+		}))
+	},
+})

pages/classroom/list.json

@@ -0,0 +1,6 @@
+{
+	"usingComponents": {
+		"list":"./modules/list/index"
+	},
+	"navigationBarTitleText": "课程列表"
+}

pages/classroom/list.scss

@@ -0,0 +1,12 @@
+page{
+	height: 100vh;
+	overflow: hidden;
+}
+.unread {
+	height: 64rpx;
+	line-height: 64rpx;
+	padding-left: 30rpx;
+	font-size: 24rpx;
+	font-family: PingFang SC-Regular, PingFang SC;
+	color: #666666;
+}

pages/classroom/list.wxml

@@ -0,0 +1,12 @@
+<van-search shape="round" background="#085CDF" placeholder="请输入搜索关键词" bind:search='onSearch' bind:clear='onSearch' />
+<van-tabs class="tabs" tab-class='tab-class' color='#3874F6' title-active-color='#3874F6' bind:change="tabsChange">
+	<van-tab title="未学习" />
+	<van-tab title="学习中" />
+	<van-tab title="已学习" />
+</van-tabs>
+<view class="head"></view>
+
+<My_listBox id='ListBox' height='{{scrollHeight}}' bind:getlist='getList'>
+	<view class="unread">课程数：{{total}}个</view>
+	<list list="{{list}}" />
+</My_listBox>

pages/classroom/modules/list/index.js

@@ -0,0 +1,15 @@
+Component({
+    properties: {
+        list: Array
+    },
+    methods: {
+        toDetail(e) {
+            const {
+                item
+            } = e.currentTarget.dataset;
+            wx.navigateTo({
+                url: '/pages/classroom/detail?id=' + item.sat_coursewareid,
+            })
+        }
+    }
+})

pages/classroom/modules/list/index.json

@@ -0,0 +1,4 @@
+{
+    "component": true,
+    "usingComponents": {}
+}

pages/classroom/modules/list/index.scss

@@ -0,0 +1,100 @@
+.main {
+	padding: 20rpx 30rpx;
+	width: 100vw;
+	background-color: #fff;
+
+	.item {
+		position: relative;
+		display: flex;
+		height: 128rpx;
+		width: 100%;
+		margin-top: 20rpx;
+
+		.img {
+			width: 128rpx;
+			height: 128rpx;
+			border-radius: 16rpx;
+			overflow: hidden;
+			margin-right: 20rpx;
+			flex-shrink: 0;
+
+			image {
+				width: 100%;
+				height: 100%;
+			}
+
+			view {
+				background-color: #EEEEEE;
+				width: 100%;
+				height: 100%;
+				line-height: 128rpx;
+				text-align: center;
+			}
+		}
+
+		.right {
+			flex: 1;
+			width: 0;
+
+			.title {
+				width: 75%;
+				line-height: 40rpx;
+				font-size: 28rpx;
+				font-family: PingFang SC-Bold, PingFang SC;
+				font-weight: bold;
+				color: #333333;
+			}
+
+			.exp {
+				width: 93%;
+				height: 34rpx;
+				font-size: 24rpx;
+				font-family: PingFang SC-Regular, PingFang SC;
+				color: #666666;
+				margin-top: 10rpx;
+			}
+
+			.time {
+				width: 90%;
+				display: flex;
+				height: 28rpx;
+				line-height: 28rpx;
+				font-size: 20rpx;
+				font-family: PingFang SC-Regular, PingFang SC;
+				color: #999999;
+				margin-top: 16rpx;
+
+				.line-1 {
+					width: 230rpx;
+				}
+			}
+		}
+
+		.tag {
+			position: absolute;
+			top: 4rpx;
+			right: 50rpx;
+			width: 96rpx;
+			height: 36rpx;
+			line-height: 36rpx;
+			text-align: center;
+			background: #3874F6;
+			border-radius: 4rpx;
+			font-size: 20rpx;
+			font-family: PingFang SC-Regular, PingFang SC;
+			color: #FFFFFF;
+		}
+	}
+
+	.item:nth-child(1) {
+		margin-top: 0 !important;
+	}
+
+
+}
+
+.line-1 {
+	overflow: hidden;
+	white-space: nowrap;
+	text-overflow: ellipsis;
+}

pages/classroom/modules/list/index.wxml

@@ -0,0 +1,34 @@
+<My_empty wx:if="{{!list.length}}" />
+<view wx:else class="main">
+	<view class="item" wx:for="{{list}}" wx:key="sat_coursewareid" data-item="{{item}}" bindtap="toDetail">
+		<view class="img">
+			<image wx:if="{{item.cover}}" src="{{item.cover}}" mode="aspectFill" />
+			<view wx:else>
+				<van-icon custom-class='icon' size='50' color='#AFAFAF' name="photo-o" />
+			</view>
+		</view>
+		<view class="right">
+			<view class="title line-1">{{item.title ||" --"}}</view>
+			<view class="exp line-1">{{item.notes ||" --"}}</view>
+			<view class="time line-1">
+				<text class="line-1">发布人:{{item.createby}}</text>
+				<text>发布时间:{{item.createdate}}</text>
+			</view>
+		</view>
+		<view class="tag" style="background-color: {{setColor.setColor(item.learnstatus)}};">{{item.learnstatus}}</view>
+	</view>
+</view>
+
+<wxs module="setColor">
+	module.exports.setColor = function (stu) {
+		var color = '';
+		if (stu == '未学习') {
+			color = '#FA8C16';
+		} else if (stu == '学习中') {
+			color = '#3874F6';
+		} else {
+			color = '#BBBBBB'
+		}
+		return color
+	}
+</wxs>

pages/tabbar/home/index.js

@@ -61,7 +61,7 @@ Page({
                     case "商学院":
                         gridList.push({
                             name: "商学院",
-                            path: "/pages/college/index",
+                            path: "/pages/classroom/index",
                             icon: "icon-a-shangxueyuanxuexi",
                             apps: v.apps
                         })