Skip to content

C
CFFP-HB
Commit 33792b3f by kyle
Options

我的分享

parent 62409892
Showing with 413 additions and 9 deletions
api/api.ts
...@@ -96,5 +96,9 @@ export default { ...@@ -96,5 +96,9 @@ export default {
// 我的学习,学习记录 // 我的学习,学习记录
userStudyList(params){ userStudyList(params){
return request(`${cffpURL}/study/userStudyList`, "POST", params) return request(`${cffpURL}/study/userStudyList`, "POST", params)
},
// 我的分享
userShareQuery(params){
return request(`${cffpURL}/share/userShareQuery`, "POST", params)
} }
} }
components/listItem/listItem.vue 0 → 100644
<template>
<view>
<view class="titleContent">
</view>
<view class="listContent">
</view>
</view>
</template>
<script>
export default {
name:"listItem",
props: {
title:Array<any>,
lists:Array<any>
},
data() {
return {
};
}
}
</script>
<style lang="scss">
</style>
\ No newline at end of file
pages.json
...@@ -140,7 +140,16 @@ ...@@ -140,7 +140,16 @@
"enablePullDownRefresh": false "enablePullDownRefresh": false
} }
} },
{
"path" : "pages/myShare/myShare",
"style" :
{
"navigationBarTitleText": "",
"enablePullDownRefresh": false
}
}
], ],
// "tabBar": { // "tabBar": {
// "color": "#7A7E83", // tab 上的文字默认颜色 // "color": "#7A7E83", // tab 上的文字默认颜色
......
pages/myShare/myShare.vue 0 → 100644
<template>
<view class="container">
<!-- 时间选择 -->
<view class="timeSelectContent">
<picker mode="date" :value="queryDate" :end="maxDate" fields="month" @change="bindDateChange">
<view class="uni-input">{{queryDate}}</view>
</picker>
<i class="iconfont icon-youjiantou"></i>
</view>
<!-- 分享统计 -->
<view class="shareStatisticalContent">
<view class="statisticItem">
<text>{{coursesCountInfos.shareFrequencyMonth}}</text>
<text>本月分享（频次）</text>
</view>
<view class="statisticItem">
<text class="colorText">{{coursesCountInfos.integralMonth}}</text>
<text>本月获得积分</text>
</view>
<view class="statisticItem">
<text>{{coursesCountInfos.shareSectionMonth}}</text>
<text>本月统计(节)</text>
</view>
<view class="statisticItem">
<text>{{coursesCountInfos.shareFrequencyCount}}</text>
<text>累计分享(频次)</text>
</view>
<view class="statisticItem">
<text class="colorText">{{coursesCountInfos.integralCount}}</text>
<text>累计获得积分</text>
</view>
<view class="statisticItem">
<text>{{coursesCountInfos.shareSectionCount}}</text>
<text>累计分享(节)</text>
</view>
</view>
<!-- 分享明细 -->
<view class="shareDetailContent">
<h3>分享明细</h3>
<h4 class="noListTip" v-if="!userShareCourses">暂无分享记录！</h4>
<template v-if="userShareCourses">
<view class="shareOrderInfoItem" v-for="item in userShareCourses" :key="item.fileId">
<view class="timeBox">{{item.shareDate}}</view>
<view class="courseInfoContent">
<view class="thumbnailBox">
<img :src="item.displayImage" alt="">
</view>
<view class="courseDetailBox">
<h4>{{item.fileTitle}}</h4>
<view class="summaryBox">
<text>{{item.fileSynopsis}}</text>
</view>
<view class="dataBox">
<strong>￥{{item.coursePrice}}</strong>
<text>{{item.salesNumber}}人购买</text>
</view>
<view class="tagListBox">
<view class="tagItem">{{item.fileLecturerName}}</view>
<view class="tagItem">{{item.fileLecturerRanks}}</view>
</view>
</view>
</view>
<view class="countsContent">
<view>
<i class="iconfont icon-zhuanfa"></i>
<text>分享</text>
<text>{{item.shareCount}}</text>
</view>
<view>
<i class="iconfont icon-yidu"></i>
<text>阅读</text>
<text>{{item.readCount}}</text>
</view>
<view>
<i class="iconfont icon-yifukuan"></i>
<text>购买</text>
<text>{{item.buyCount}}</text>
</view>
</view>
</view>
</template>
</view>
</view>
</template>
<script>
import api from "@/api/api";
export default {
data() {
return {
queryDate:`${new Date().getFullYear()}-${new Date().getMonth() + 1}`,
maxDate:`${new Date().getFullYear()}-${new Date().getMonth() + 1}`,
userId:null,
coursesCountInfos:{},
userShareCourse:[]
}
},
methods: {
bindDateChange: function(e) {
this.queryDate = e.detail.value
},
userShareQuery(){
const params = {
userId:this.userId,
queryDate:this.queryDate
}
this.coursesCountInfos ={
shareFrequencyMonth:'XXX',
integralMonth:'XXX',
shareSectionMonth:'XXX',
shareFrequencyCount:'XXX',
integralCount:'XXX',
shareSectionCount:'XXX'
}
this.userShareCourses = [
{fileId:1,fileTitle:'11111',fileLecturerName:'sssss',fileLecturerRanks:'nnnnnn',coursePrice:'12312',salesNumber:123,shareDate:'2022-11-11 17:33',shareCount:123,readCount:111,buyCount:111}
]
console.log(this.userShareCourses)
// api.userShareQuery(params).then(res=>{
// console.log(res)
// if(res['success']){
// this.coursesCountInfos = res['data']['coursesCountInfos'];
// this.userShareCourses = res['data']['userShareCourses'];
// }
// })
},
// 查看详情
goDetail(){
}
},
onLoad() {
this.userShareQuery()
},
mounted() {
}
}
</script>
<style lang="scss">
.container{
height: 100%;
.timeSelectContent{
background-color: #fff;
padding: 10rpx 0;
display: flex;
justify-content: center;
align-items: baseline;
color: #333;
.iconfont{
color: #999;
font-size: 24rpx;
transform: rotate(90deg);
margin-left: 8rpx;
}
}
.shareStatisticalContent{
background-color: #fff;
margin: 10rpx 20rpx;
padding: 20rpx 14rpx;
display: flex;
flex-wrap: wrap;
.statisticItem{
flex: 1;
min-width: 33%;
display: flex;
flex-direction: column;
align-items: center;
border-right: 1px solid #F4F4F4;
margin-bottom: 10rpx;
&:nth-of-type(3n){
border-right: none;
}
text{
color: #333;
font-size: 36rpx;
&:last-child{
color: #666;
font-size: 28rpx;
}
&.colorText{
color: #F15A1F;
}
}
}
}
.shareDetailContent{
h3{
color: #333;
font-size: 36rpx;
position: relative;
margin: 10rpx 0 10rpx 58rpx;
&::before{
content: '';
display: block;
position: absolute;
left: -5px;
top: 4px;
width: 2px;
height: 70%;
border-radius: 4rpx;
background-color: #FA882F;
}
}
.shareOrderInfoItem{
margin: 0 20rpx;
.timeBox{
font-size: 28rpx;
color: #999;
margin: 10rpx 0 10rpx 50rpx;
}
.countsContent{
background-color: #fff;
display: flex;
border-bottom-left-radius: 20rpx;
border-bottom-right-radius: 20rpx;
padding: 10rpx 10rpx 20rpx 10rpx;
view{
flex: 1;
font-size: 24rpx;
display: flex;
align-items: center;
text{
color: #666;
&:last-child{
margin-left: 10rpx;
color: #0A2F99;
font-weight: bold;
}
}
}
}
}
}
.courseInfoContent{
display: flex;
align-items: center;
background-color: #fff;
border-top-left-radius: 20rpx;
border-top-right-radius: 20rpx;
padding: 5rpx 10rpx;
.thumbnailBox{
width: 200rpx;
height: 200rpx;
background-color: #888;
margin-right: 26rpx;
img{
max-width: 100%;
height: auto;
}
}
.courseDetailBox{
width: 100%;
color: #333;
h4{
font-size: 32rpx;
}
.summaryBox{
font-size: 24rpx;
margin: 10rpx 0;
text{
margin-right: 20rpx;
}
}
.dataBox{
strong{
color: #F15A1F;
font-size: 30rpx;
margin-right: 20rpx;
}
text{
font-size: 28rpx;
}
}
.tagListBox{
display: flex;
.tagItem{
color: #20279B;
font-size: 28rpx;
border-radius: 20rpx;
border-top-left-radius: 0;
border-bottom-right-radius: 0;
padding: 10rpx 18rpx;
border: 1px solid #20279B;
margin-right: 20rpx;
}
}
}
}
}
</style>
pages/personalCenter/personalCenter.vue
...@@ -77,7 +77,7 @@ ...@@ -77,7 +77,7 @@
children:[ children:[
{title:'我的学习',icon:'myLearning',link:'/pages/myLearning/myLearning',isOpen:true,isShow:true}, {title:'我的学习',icon:'myLearning',link:'/pages/myLearning/myLearning',isOpen:true,isShow:true},
{title:'学习认证',icon:'learningCertify',link:'',isOpen:true,isShow:true}, {title:'学习认证',icon:'learningCertify',link:'',isOpen:true,isShow:true},
{title:'我的分享',icon:'share',link:'',isOpen:true,isShow:true} {title:'我的分享',icon:'share',link:'/pages/myShare/myShare',isOpen:true,isShow:true}
], ],
}, },
{id:'03',categoryName:'人员管理', {id:'03',categoryName:'人员管理',
......
static/font/demo_index.html
...@@ -55,6 +55,18 @@ ...@@ -55,6 +55,18 @@
<ul class="icon_lists dib-box"> <ul class="icon_lists dib-box">
<li class="dib"> <li class="dib">
<span class="icon iconfont">&#xe719;</span>
<div class="name">已付款</div>
<div class="code-name">&amp;#xe719;</div>
</li>
<li class="dib">
<span class="icon iconfont">&#xe686;</span>
<div class="name">已读</div>
<div class="code-name">&amp;#xe686;</div>
</li>
<li class="dib">
<span class="icon iconfont">&#xe72f;</span> <span class="icon iconfont">&#xe72f;</span>
<div class="name">圆形未选中</div> <div class="name">圆形未选中</div>
<div class="code-name">&amp;#xe72f;</div> <div class="code-name">&amp;#xe72f;</div>
...@@ -264,9 +276,9 @@ ...@@ -264,9 +276,9 @@
<pre><code class="language-css" <pre><code class="language-css"
>@font-face { >@font-face {
font-family: 'iconfont'; font-family: 'iconfont';
src: url('iconfont.woff2?t=1668068371193') format('woff2'), src: url('iconfont.woff2?t=1668154480160') format('woff2'),
url('iconfont.woff?t=1668068371193') format('woff'), url('iconfont.woff?t=1668154480160') format('woff'),
url('iconfont.ttf?t=1668068371193') format('truetype'); url('iconfont.ttf?t=1668154480160') format('truetype');
} }
</code></pre> </code></pre>
<h3 id="-iconfont-">第二步：定义使用 iconfont 的样式</h3> <h3 id="-iconfont-">第二步：定义使用 iconfont 的样式</h3>
...@@ -293,6 +305,24 @@ ...@@ -293,6 +305,24 @@
<ul class="icon_lists dib-box"> <ul class="icon_lists dib-box">
<li class="dib"> <li class="dib">
<span class="icon iconfont icon-yifukuan"></span>
<div class="name">
已付款
</div>
<div class="code-name">.icon-yifukuan
</div>
</li>
<li class="dib">
<span class="icon iconfont icon-yidu"></span>
<div class="name">
已读
</div>
<div class="code-name">.icon-yidu
</div>
</li>
<li class="dib">
<span class="icon iconfont icon-yuanxingweixuanzhong"></span> <span class="icon iconfont icon-yuanxingweixuanzhong"></span>
<div class="name"> <div class="name">
圆形未选中 圆形未选中
...@@ -609,6 +639,22 @@ ...@@ -609,6 +639,22 @@
<li class="dib"> <li class="dib">
<svg class="icon svg-icon" aria-hidden="true"> <svg class="icon svg-icon" aria-hidden="true">
<use xlink:href="#icon-yifukuan"></use>
</svg>
<div class="name">已付款</div>
<div class="code-name">#icon-yifukuan</div>
</li>
<li class="dib">
<svg class="icon svg-icon" aria-hidden="true">
<use xlink:href="#icon-yidu"></use>
</svg>
<div class="name">已读</div>
<div class="code-name">#icon-yidu</div>
</li>
<li class="dib">
<svg class="icon svg-icon" aria-hidden="true">
<use xlink:href="#icon-yuanxingweixuanzhong"></use> <use xlink:href="#icon-yuanxingweixuanzhong"></use>
</svg> </svg>
<div class="name">圆形未选中</div> <div class="name">圆形未选中</div>
......
static/font/iconfont.css
@font-face { @font-face {
font-family: "iconfont"; /* Project id 3749283 */ font-family: "iconfont"; /* Project id 3749283 */
src: url('iconfont.woff2?t=1668068371193') format('woff2'), src: url('iconfont.woff2?t=1668154480160') format('woff2'),
url('iconfont.woff?t=1668068371193') format('woff'), url('iconfont.woff?t=1668154480160') format('woff'),
url('iconfont.ttf?t=1668068371193') format('truetype'); url('iconfont.ttf?t=1668154480160') format('truetype');
} }
.iconfont { .iconfont {
...@@ -13,6 +13,14 @@ ...@@ -13,6 +13,14 @@
-moz-osx-font-smoothing: grayscale; -moz-osx-font-smoothing: grayscale;
} }
.icon-yifukuan:before {
content: "\e719";
}
.icon-yidu:before {
content: "\e686";
}
.icon-yuanxingweixuanzhong:before { .icon-yuanxingweixuanzhong:before {
content: "\e72f"; content: "\e72f";
} }
......
static/font/iconfont.json
...@@ -6,6 +6,20 @@ ...@@ -6,6 +6,20 @@
"description": "", "description": "",
"glyphs": [ "glyphs": [
{ {
"icon_id": "7090083",
"name": "已付款",
"font_class": "yifukuan",
"unicode": "e719",
"unicode_decimal": 59161
},
{
"icon_id": "16853982",
"name": "已读",
"font_class": "yidu",
"unicode": "e686",
"unicode_decimal": 59014
},
{
"icon_id": "577322", "icon_id": "577322",
"name": "圆形未选中", "name": "圆形未选中",
"font_class": "yuanxingweixuanzhong", "font_class": "yuanxingweixuanzhong",
......
static/font/iconfont.ttf
No preview for this file type
util/dataHandling.ts
...@@ -31,5 +31,5 @@ export default{ ...@@ -31,5 +31,5 @@ export default{
const m = Math.floor(value % 3600 / 60) > 0 ? Math.floor(value % 3600 / 60) : '00'; const m = Math.floor(value % 3600 / 60) > 0 ? Math.floor(value % 3600 / 60) : '00';
const s = Math.floor(value % 60) > 0 ? Math.floor(value % 60) : '00'; const s = Math.floor(value % 60) > 0 ? Math.floor(value % 60) : '00';
return h + ':' + m + ':' + s; return h + ':' + m + ':' + s;
} },
} }
\ No newline at end of file
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