Skip to content

C
CFFP-HB
Commit 3655df5e by sunchao
Options

合并冲突

parents 911e578b 9e990c87
Showing with 441 additions and 18 deletions
App.vue
......@@ -53,4 +53,19 @@
.richTextContent img{
width: 100% !important;
}
.popupContainer .uni-popup .uni-popup__wrapper{
width: 80%;
border-radius: 20rpx;
}
.container uni-slider{
margin: 0;
}
.container uni-slider .uni-slider-value{
text-align: right;
}
.noListTip{
text-align: center;
margin-top: 10%;
color: #999;
}
</style>
api/api.ts
......@@ -92,5 +92,9 @@ export default {
//学习认证结果
userCertificateResult(params){
return request(`${cffpURL}/certificate/userCertificateList`, "POST", params)
},
// 我的学习,学习记录
userStudyList(params){
return request(`${cffpURL}/study/userStudyList`, "POST", params)
}
}
components/login/login.vue
<template>
<view class="wrapper">
<view class="logo">
<img src="/static/cffp_logo.jpg" alt="logo" srcset="">
<img :src="imgSrc" alt="logo" srcset="">
<view>欢迎登录使用CFFP</view>
</view>
<view class="content">
......@@ -97,7 +97,8 @@
account:null,
doublePassword:null,
agreeFlag:false,
userId:null
userId:null,
imgSrc:'static/cffp_logo.jpg'
}
},
methods: {
......@@ -303,10 +304,26 @@
password:null,
}
},
checkToken(){
api.checkToken().then(res=>{
if(res['success']){}else{
api.obtainToken().then(res=>{
if(res.success){
uni.setStorageSync('uni-token',res.data['token']);
}
})
}
})
},
},
mounted() {
<<<<<<< HEAD
this.checkToken();
=======
this.checkToken()
>>>>>>> 9e990c8792924f087e76b52a4e61cccfbae779c9
}
}
</script>
......
manifest.json
......@@ -88,8 +88,7 @@
"router" : {
"base" : "/cffp/",
"mode" : "history"
}
,
},
"devServer" : {
"proxy" : {
"/api" : {
......
pages.json
......@@ -131,7 +131,16 @@
"navigationBarTitleText": "认证详情",
"enablePullDownRefresh": false
}
}
},
{
"path" : "pages/myLearning/myLearning",
"style" :
{
"navigationBarTitleText": "",
"enablePullDownRefresh": false
}
}
],
// "tabBar": {
// "color": "#7A7E83", // tab 上的文字默认颜色
......
pages/index/index.vue
......@@ -71,7 +71,7 @@
{ key: '01', name: '我的积分', icon: 'integral', link: '', isOpen: false },
{ key: '02', name: '申请加盟', icon: 'applyJoin', link: '../application-process/basic-info', isOpen: true },
{ key: '03', name: '学习认证', icon: 'learningCertify', link: '../learnCertify/learnCertify', isOpen: true },
{ key: '04', name: '邀请加盟', icon: 'shareJoin', link: '../inviteJoin/inviteJoin', isOpen: false },
{ key: '04', name: '邀请加盟', icon: 'shareJoin', link: '../inviteJoin/inviteJoin', isOpen: true },
{ key: '05', name: '我的分享', icon: 'share', link: '', isOpen: false },
{ key: '06', name: '我的团队', icon: 'team', link: '', isOpen: false },
{ key: '07', name: '更多功能', icon: 'more', link: '../personalCenter/personalCenter', isOpen: true }
......
pages/myLearning/myLearning.vue 0 → 100644
<template>
<view class="container">
<!-- tab选项 -->
<view class="tabTitle">
<text :class="{'actived': tabType===1}" @click="switchTab(1)">学习记录</text>
<text :class="{'actived': tabType===2}" @click="switchTab(2)">学习统计</text>
</view>
<!-- tab内容 -->
<view class="tabContent">
<view class="learningRecordContainer" v-if="tabType===1">
<h3 class="noListTip">暂无学习记录!</h3>
<view class="learningRecordItem" v-for="item in userStudyList">
<view class="dateBox">{{item.studyTime}}</view>
<!-- 课程详情 -->
<view class="courseInfoContent" v-for="subItem in item.userStudyInfos" :key="subItem.fileId">
<view class="thumbnailBox">
<img :src="subItem.displayImage" alt="">
</view>
<view class="courseDetailBox">
<h4>{{subItem.fileTitle}}</h4>
<view class="summaryBox">
<text>学习时长：{{subItem.studyDuration}}分钟</text>
</view>
<view class="processBox">
<view class="sliderBox">
<slider :value="subItem.progressBar" show-value block-size="14" disabled activeColor="#20269B"/>
</view>
<view>%</view>
</view>
<view class="dataBox">
<text>可观看截至：{{subItem.effectiveEndDate}}</text>
</view>
</view>
</view>
</view>
</view>
<view class="learningStatisticsContainer" v-if="tabType===2">
</view>
</view>
</view>
</template>
<script>
import api from "@/api/api";
export default {
data() {
return {
tabType:1,
userStudyList:[],
userId:null
}
},
methods: {
switchTab(type){
this.tabType = type;
if(type===1){
}else{
}
},
userStudyList(){
api.userStudyList({userId:this.userId}).then(res=>{
if(res['success']){
this.userStudyList = res['data']['userStudyTimeInfos'];
}
console.log(res)
})
}
},
onLoad() {
},
mounted() {
}
}
</script>
<style lang="scss">
.container{
position: relative;
height: 100%;
.tabTitle{
color: #666666;
background-color:#fff;
display: flex;
align-items: center;
justify-content: space-around;
padding: 30rpx 60rpx 0;
text{
&.actived{
color: #333;
border-bottom: 4rpx solid #20269B;
}
}
}
.learningRecordContainer{
padding: 20rpx 30rpx;
.dateBox{
padding-left: 16rpx;
}
.courseInfoContent{
display: flex;
align-items: center;
background-color: #fff;
border-radius: 20rpx;
margin-bottom: 10rpx;
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;
}
}
.processBox{
display: flex;
justify-content: flex-start;
font-size: 28rpx;
color: #888;
.sliderBox{
width: 100%;
}
}
.dataBox{
text{
font-size: 28rpx;
}
}
}
}
}
}
</style>
pages/orderConfirm/orderConfirm.vue
......@@ -25,30 +25,30 @@
<h4>价格明细</h4>
<view><text>现价</text><text>￥{{courseInfoItem.coursePrice}}</text></view>
<view>
<text>积分抵扣<i class="iconfont icon-31tishi"></i></text>
<text class="integralBox">未选积分，可抵扣XXX<i class="iconfont icon-youjiantou"></i></text>
<text @click="toggle(1,'bottom')">积分抵扣<i class="iconfont icon-31tishi"></i></text>
<text class="integralBox" @click="toggle(2,'bottom')">未选积分，可抵扣XXX<i class="iconfont icon-youjiantou"></i></text>
</view>
<view><text>合计</text><text>￥{{courseInfoItem.coursePrice}}</text></view>
</view>
<!-- 支付方式 -->
<view class="paymentMethodContent">
<h4>选择支付方式</h4>
<view class="paymentItem">
<view class="paymentItem" @click="selectPaymentMethod(1)">
<view>
<i class="iconfont icon-zhifubao"></i>
<text>支付宝支付</text>
</view>
<view class="selectRadio actived">
<view class="selectRadio" :class="{'actived':paymentMethod===1}">
<i class="iconfont icon-duihao"></i>
</view>
</view>
<view class="paymentItem">
<view class="paymentItem" @click="selectPaymentMethod(2)">
<view>
<i class="iconfont icon-py_weixinzhifu"></i>
<text>微信支付</text>
</view>
<view class="selectRadio">
<view class="selectRadio" :class="{'actived':paymentMethod===2}">
<i class="iconfont icon-duihao"></i>
</view>
</view>
......@@ -61,6 +61,70 @@
</view>
<view class="confirmOrder">提交订单</view>
</view>
<!-- 普通弹窗 -->
<uni-popup ref="popup" background-color="#fff">
<view class="popup-content">
<view class="title">
<text></text>
<h3>{{popupTitle}}</h3>
<i class="iconfont icon-guanbi" @click="closePopup(1)"></i>
</view>
<view v-if="popupType===1"><text>1积分=1元,积分抵扣如同现金,所有课程均可使用.</text></view>
<view v-if="popupType===2">
<view class="deductionInfoItem" :class="{'actived':isDeduction}" @click="selectDeduction(true)">
<view style="display: flex;">
<text>可抵扣</text>
<view class="integralInfoBox">
<text class="deductionCount">￥500</text>
<text>需5000积分兑换</text>
</view>
</view>
<view class="selectRadio">
<i class="iconfont icon-duihao"></i>
</view>
</view>
<view class="deductionInfoItem" :class="{'actived':!isDeduction}" @click="selectDeduction(false)">
<view>
<text>不使用积分抵扣</text>
</view>
<view class="selectRadio">
<i class="iconfont icon-duihao"></i>
</view>
</view>
<view class="confirmBtn" @click="closePopup(1);toggle(3,'center')">
确认
</view>
</view>
</view>
</uni-popup>
<view class="popupContainer">
<uni-popup ref="popup1" background-color="#fff">
<view class="popup1-content">
<view class="title">
<text></text>
<h3>{{popupTitle}}</h3>
<i class="iconfont icon-guanbi" @click="closePopup(1)"></i>
</view>
<view class="integralDeductionContent">
<view class="intergralItem">
<text>可兑换积分:</text>
<text>XXX积分</text>
</view>
<view class="intergralItem">
<text>本次兑换消耗积分:</text>
<text>XXX积分</text>
</view>
<view class="intergralItem">
<text>剩余可兑换积分:</text>
<text>XXX积分</text>
</view>
<view class="confirmBtn" @click="closePopup(2)">
确认兑换
</view>
</view>
</view>
</uni-popup>
</view>
</view>
</template>
......@@ -70,7 +134,11 @@
data() {
return {
courseInfoItem:{},
fileId:null
fileId:null,
paymentMethod:1,
popupTitle:'积分抵扣规则',
popupType:1,
isDeduction:true
}
},
methods: {
......@@ -83,6 +151,44 @@
}
})
},
// 选择支付方式
selectPaymentMethod(value){
this.paymentMethod = value;
},
// 从下往上弹出
toggle(val,type) {
// type 1为积分抵扣规则，2为优惠详情
this.popupType = val;
// open 方法传入参数 等同在 uni-popup 组件上绑定 type属性
if(this.popupType===3){
this.$refs.popup1.open(type);
}else{
this.$refs.popup.open(type);
}
if(this.popupType===1){
this.popupTitle = '积分抵扣规则'
}else if(this.popupType===2){
this.popupTitle = '优惠详情'
}else if(this.popupType===3){
this.popupTitle = '积分兑换'
}
},
// 关闭弹出层
closePopup(val){
if(val===1){
this.$refs.popup.close()
}else{
this.$refs.popup1.close()
}
},
// 选择是否抵扣
selectDeduction(type){
this.isDeduction = type;
},
// 确认积分兑换
confirmIntergralDeduction(){
}
},
onLoad(option){
console.log(option)
......@@ -99,6 +205,127 @@
.container{
position: relative;
height: 100%;
.popup-content{
.title{
display: flex;
justify-content: space-between;
align-items: baseline;
h3{
text-align: center;
color: #333;
font-size: 32rpx;
margin-bottom: 30rpx;
}
.iconfont{
color: #999;
}
}
text{
color: #666;
font-size: 30rpx;
}
.deductionInfoItem{
display: flex;
justify-content: space-between;
align-items: center;
color: #333;
font-size: 30rpx;
padding: 10rpx 30rpx;
background-color: #F5f5f5;
border-radius: 20rpx;
min-height: 90rpx;
margin-top: 30rpx;
.integralInfoBox{
display: flex;
flex-direction: column;
margin-left: 10rpx;
text{
font-size: 30rpx;
color: #333333;
}
.deductionCount{
font-size: 36rpx;
color: #F15A1F;
}
}
.selectRadio{
color: transparent;
width: 40rpx;
height: 40rpx;
border: 1px solid #D8D8D8;
border-radius: 50%;
display: flex;
justify-content: center;
align-items: center;
}
&.actived{
border: 3rpx solid #20269B;
background-color: #fff;
.selectRadio{
background-color: #20269B;
color: #fff;
}
}
}
.integralDeductionContent{
.intergralItem{
display: flex;
justify-content: space-between;
margin-bottom: 10rpx;
}
}
.confirmBtn{
border-radius: 80rpx;
height: 80rpx;
width: 60%;
background-color: #20269B;
color: #fff;
margin: 64rpx auto 0;
display: flex;
justify-content: center;
align-items: center;
}
}
.popup1-content{
padding: 30rpx 34rpx 20rpx 42rpx;
border-radius: 20rpx;
.title{
display: flex;
justify-content: space-between;
align-items: baseline;
h3{
text-align: center;
color: #333;
font-size: 32rpx;
margin-bottom: 30rpx;
}
.iconfont{
color: #999;
}
}
.integralDeductionContent{
.intergralItem{
display: flex;
justify-content: space-between;
color: #333;
font-size: 30rpx;
margin-bottom: 10rpx;
}
}
.confirmBtn{
border-radius: 80rpx;
height: 80rpx;
width: 60%;
background-color: #20269B;
color: #fff;
margin: 64rpx auto 0;
display: flex;
justify-content: center;
align-items: center;
}
}
.courseInfoContent{
display: flex;
align-items: center;
......@@ -252,6 +479,7 @@
border-radius: 80rpx;
}
}
}
</style>
pages/personalCenter/personalCenter.vue
......@@ -75,7 +75,7 @@
},
{id:'02',categoryName:'活动管理',
children:[
{title:'我的学习',icon:'myLearning',link:'',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:'share',link:'',isOpen:true,isShow:true}
],
......
util/interceptor.ts
......@@ -10,14 +10,14 @@ export const interceptor = () => {
// 请求拦截器
invoke(args) {
// console.log('请求拦截器',args);
console.log('请求拦截器',args);
// 加载loading
uni.showLoading({
title: '加载中...'
})
// 当本地没有token，并且接口地址没在白名单内，需要重新获取token
if (!uni.getStorageSync('uni-token') && !whiteApiList.includes(args.url)) {
// console.log('-----------')
console.log('-----------')
return new Promise((resolve, reject)=>{
uni.request({
url: '/api/authorize/obtainToken',
......@@ -44,7 +44,7 @@ export const interceptor = () => {
'content-type': args.method === 'POST' ? 'application/json' : 'application/x-www-form-urlencoded',
'X-Authorization': uni.getStorageSync('uni-token')
}
// console.log(args.header)
console.log(args.header)
},
// 响应拦截器，可以对数据进行预处理
......
util/request.ts
import {interceptor} from "./interceptor";
// 全局请求封装
export default (url, method, params) => {
export default (url:string, method:any, params:any) => {
interceptor();
return new Promise((resolve, reject) => {
uni.request({
......
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