tianyan/tra-app
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

课程详情，知识点接口

Browse Source
This commit is contained in:
李泉德
2025-06-20 10:14:01 +08:00
parent 491bcf668d
commit 68bf17b7e2
4 changed files with 106 additions and 22 deletions
Download Patch File Download Diff File Expand all files Collapse all files
.env.development
+1 -1
View File
@@ -3,6 +3,6 @@ ENV = 'development'
# 'development'
# base api
# VITE_APP_BASE_API_Url = 'http://25.18.122.66:9786'
#VITE_APP_BASE_API_Url = 'http://25.18.122.66:9786'
# 苗扬
VITE_APP_BASE_API_Url = 'http://25.64.16.133:9786'
src/App.vue
+20 -5
View File
@@ -15,8 +15,8 @@ export default {
<style lang="scss">
/* 注意要写在第一行，同时给style标签加入lang="scss"属性 */
// @import "@/uni_modules/uview-ui/index.scss";
view{
box-sizing: border-box;
view {
box-sizing: border-box;
}
@font-face {
font-family: 'PingFangSC';
@@ -42,18 +42,33 @@ view{
.mb-8 {
margin-bottom: 8rpx;
}
.mb-18{
.pt-8 {
padding-top: 8rpx;
}
.mb- {
margin-bottom: 10rpx;
}
.mb-18 {
margin-bottom: 18rpx;
}
.mb-64{
.mb-64 {
margin-bottom: 64rpx;
}
.mb-30 {
margin-bottom: 30rpx;
}
.mb-36 {
margin-bottom: 36rpx;
}
.mb-4 {
margin-bottom: 4rpx;
}
.fz-30{
.fz-30 {
font-size: 30rpx;
}
.fz-24 {
font-size: 24rpx;
}
.w_100 {
width: 100%;
}
src/api/courseDetail.js
+12
View File
@@ -0,0 +1,12 @@
import request from '@/api/request'
const base_url = '/traapp'
// 获取课程分类树接口
export const getCourseDetailApi = (data) => {
return request({
url: base_url + '/crsInfo/queryCrsInfoDetail',
method: 'post',
data
});
};
src/pages/courseDetail/index.vue
+73 -16
View File
@@ -3,17 +3,17 @@
<image src="/src/static/images/courseDetail/mipmap-xhdpi/bg.png" mode="widthFix" class="back-image"></image>
<view class="detail-body">
<view class="head-title font_pf">
<view class="title-text">课程标题课程标题111111</view>
<view class="title-text">{{ form.crsName }}</view>
<view class="title-num">
<view class="num-item">
<image class="title-icon" src="/src/static/images/courseDetail/mipmap-xhdpi/zhishidian.png" mode="widthFix"></image>
<view class="mr-10">知识点</view>
<view class="c-000">4</view>
<view class="c-000">{{ form.pgrphNum }}</view>
</view>
<view class="num-item">
<image class="title-icon" src="/src/static/images/courseDetail/mipmap-xhdpi/yixue.png" mode="widthFix"></image>
<view class="mr-10">已学</view>
<view class="c-000">1</view>
<view class="c-000">{{ form.styParaGraphNum }}</view>
</view>
</view>
</view>
@@ -29,36 +29,36 @@
:inactive-style="{ color: '#666666', 'font-size': '30rpx' }"
></uv-tabs>
</view>
<view class="course-info">
<view class="course-info" v-if="tabAct == '课程介绍'">
<view class="info-top font_pf">
<view class="top-left font_pf">
<view class="fz-30 fw-600 mb-8">课程类别</view>
<view class="fz-30 fw-600">核心业务类</view>
<view class="fz-30 fw-600">{{ form.catalogName }}</view>
</view>
<view class="top-right font_pf">
<view class="rate-text mb-4">评分</view>
<view class="rate-num">7.8</view>
<view class="rate-num">{{ form.evalGrade }}</view>
</view>
</view>
<view class="info-middle font_pf">
<view class="fz-30 fw-600 mb-8">发布日期</view>
<view class="fz-30 fw-600">2025-06-04 14:45</view>
<view class="fz-30 fw-600">{{ common.formatDate2(form.issuTm, 'yyyy-MM-dd HH:mm') }}</view>
</view>
<view class="info-bottom">
<view class="bottom-left">
<view class="mb-64">
<view class="fz-30 font_pf fw-600 mb-18">标签</view>
<view class="label">
<text class="label-item font_pf" v-for="item in 6">零售业务</text>
<view class="label" v-if="form.tagCataList">
<text class="label-item font_pf" v-for="item in form.tagCataList" :key="item.tagId">{{ item.tagName }}</text>
</view>
</view>
<view class="mb-64">
<view class="fz-30 fw-600 font_pf mb-4">创建人</view>
<view class="fz-30 font_pf fw-600">李少全</view>
<view class="fz-30 font_pf fw-600">{{ form.ctUserName }}</view>
</view>
<view class="mb-64">
<view class="fz-30 font_pf fw-600 mb-4">归属部门</view>
<view class="fz-30 font_pf fw-600">机构业务部</view>
<view class="fz-30 font_pf fw-600">{{ form.belgOrgName }}</view>
</view>
</view>
<view class="bottom-right">
@@ -66,6 +66,23 @@
</view>
</view>
</view>
<view class="point" v-if="tabAct == '知识点'">
<view class="point-item mb-30" v-for="(item, index) in form.pgrphData" :key="item.index">
<view class="flex">
<view class="blue-ball">
<view class="ball"></view>
</view>
<view class="item-label">
<view class="fz-30 font_pf fw-600 mb-30">知识点0{{ index + 1 }}</view>
<view class="fz-30 font_pf fw-600 mb-36">{{ item.pgrphContent }}</view>
</view>
</view>
<view class="pt-8">
<view class="font_pf fz-24" :class="item.pgrphStdyStateName == '已学习' ? 'learn' : 'unlearn'">{{ item.pgrphStdyStateName }}</view>
</view>
</view>
</view>
<view class="evaluate" v-if="tabAct == '评价'"></view>
</view>
</view>
<view class="btn-box font_pf">
@@ -77,15 +94,26 @@
</template>
<script setup>
import { ref } from 'vue';
import { reactive, ref } from 'vue';
import { onLoad } from '@dcloudio/uni-app';
import { getCourseDetailApi } from '@/api/courseDetail.js';
// import {formatDate2} from '@/common/common.js'
import common from '@/common/common';
// tab栏
const tabList = ref([{ name: '课程介绍' }, { name: '知识点' }, { name: '评价' }]);
const form = ref({});
const crsNum = ref('');
const tabAct = ref('课程介绍');
const tabSwitch = (item) => {
console.log(item);
tabAct.value = item.name;
};
onLoad(() => {
console.log('onLoad');
const getData = async () => {
const { body } = await getCourseDetailApi({ crsNum: crsNum.value });
form.value = body;
};
onLoad((params) => {
crsNum.value = params.crsNum;
getData();
});
</script>
@@ -96,7 +124,7 @@ onLoad(() => {
}
.detail-body {
box-sizing: border-box;
height: calc(100vh - 256rpx);
min-height: calc(100vh - 256rpx);
position: absolute;
top: 256rpx;
border-radius: 23rpx 23rpx 0rpx 0rpx;
@@ -242,6 +270,35 @@ onLoad(() => {
margin-right: 30rpx;
color: #666666;
}
.point {
width: 100%;
}
.point-item {
background-color: #fff;
display: flex;
padding-top: 24rpx;
padding-left: 36rpx;
padding-right: 52rpx;
border-radius: 22rpx;
justify-content: space-between;
.blue-ball {
padding-top: 16rpx;
margin-right: 12rpx;
.ball {
width: 12rpx;
height: 12rpx;
background-color: #0066ff;
border-radius: 50%;
}
}
}
.learn {
color: #1dd17a;
}
.unlearn {
color: #666666;
}
.c-000 {
font-weight: 600;
color: #000000;