JLBA202505130001_关于吉林银行新建AI智能培训系统的需求_完成首页的两个列表
This commit is contained in:
+2
-2
@@ -47,8 +47,8 @@ VITE_APP_BASE_API_Url = 'http://25.18.122.65:7001'
|
||||
|
||||
# VITE_APP_BASE_H5_API_Url_TRAASK = 'http://25.64.16.144:9605'
|
||||
|
||||
# VITE_APP_BASE_H5_API_Url_TRAEXAM = 'http://25.64.16.154:9604'
|
||||
VITE_APP_BASE_H5_API_Url_TRAPRACTICE = 'http://25.64.32.157:9603'
|
||||
VITE_APP_BASE_H5_API_Url_TRAAPP = 'http://25.64.32.154:9601'
|
||||
#VITE_APP_BASE_H5_API_Url_TRAPRACTICE = 'http://25.64.32.157:9603'
|
||||
|
||||
|
||||
|
||||
|
||||
@@ -16,6 +16,8 @@ export const getStatisticsData = (data) => {
|
||||
});
|
||||
};
|
||||
|
||||
|
||||
|
||||
// 最新课程查询接口
|
||||
export const queryCrsInfoByLastnew = (data) => {
|
||||
/**
|
||||
@@ -89,3 +91,13 @@ export const queryCrsInfoByRecmd = (data) => {
|
||||
|
||||
|
||||
|
||||
// 新政新品
|
||||
export const queryNewPolicyNewProducts = (data) => {
|
||||
|
||||
return request({
|
||||
url: '/traapp/mycrs/queryNewPolicyNewProducts',
|
||||
method: 'post',
|
||||
data
|
||||
});
|
||||
};
|
||||
|
||||
|
||||
@@ -10,17 +10,21 @@
|
||||
<view class="hot_class_div">
|
||||
<scroll-view class="scroll-view" :scroll-x="true" :show-scrollbar="false">
|
||||
<view class="scroll-view-item" v-for="(item, index) in class_list" :key="index">
|
||||
<!-- 角标 -->
|
||||
<view class="icon" v-if="item.type">
|
||||
<image class="img_100" :src="item.type==='00'?kcIcon:plIcon" mode="widthFix" />
|
||||
</view>
|
||||
<view class="item_div">
|
||||
<uv-skeletons :loading="!item.crsNum" avatar avatar-shape="square" :title="false" :skeleton="skeleton">
|
||||
<view class="item" @click="goto_course_detail(item.crsId)">
|
||||
<uv-skeletons :loading="!item.id" avatar avatar-shape="square" :title="false" :skeleton="skeleton">
|
||||
<view class="item" @click="goto_course_detail(item)">
|
||||
<view class="title ellipsis-text">
|
||||
{{ item.crsName }}
|
||||
{{ item.nama }}
|
||||
</view>
|
||||
<view class="content">
|
||||
<view class="left">
|
||||
<image-preview
|
||||
class="img-box img"
|
||||
:imgId="item.imgId"
|
||||
:imgId="item.ossKey"
|
||||
:isCache="true"
|
||||
:width="240"
|
||||
:height="160"
|
||||
@@ -28,7 +32,7 @@
|
||||
</view>
|
||||
<view class="right">
|
||||
<view class="note ellipsis-text">更新:{{ (item.mtTime || '').substr(0, 10) }}</view>
|
||||
<view class="note ellipsis-text">已学:{{ item.accmStdyCnt }}人次</view>
|
||||
<view class="note ellipsis-text">已学:{{ item.accmCnt }}</view>
|
||||
<view class="button_div">
|
||||
<view class="button">去学习</view>
|
||||
</view>
|
||||
@@ -44,11 +48,21 @@
|
||||
|
||||
<script setup>
|
||||
import { computed, nextTick, onBeforeMount, onMounted, reactive, ref } from 'vue';
|
||||
import { queryCrsInfoByLastnew, queryCrsInfoByPopular, queryCrsInfoByRecmd } from '@/api/index.js';
|
||||
|
||||
import {
|
||||
queryCrsInfoByLastnew,
|
||||
queryCrsInfoByPopular,
|
||||
queryCrsInfoByRecmd,
|
||||
queryNewPolicyNewProducts
|
||||
} from '@/api/index.js';
|
||||
|
||||
import common from '@/common/common';
|
||||
import hostIcon from '@/static/images/index/hot.png';
|
||||
import recommendIcon from '@/static/images/index/recommend.png';
|
||||
import newIcon from '@/static/images/index/new.png';
|
||||
import kcIcon from '@/static/images/index/kc_icon.png';
|
||||
import plIcon from '@/static/images/index/pl_icon.png';
|
||||
|
||||
const props = defineProps({
|
||||
name: {
|
||||
type: String
|
||||
@@ -56,22 +70,16 @@
|
||||
});
|
||||
// 1. 先定义命名函数,明确函数用途
|
||||
const getConfigByProps = () => {
|
||||
if (props.name === 'hot_class') {
|
||||
return {
|
||||
fetchFunction: queryCrsInfoByPopular,
|
||||
title: '热门课程',
|
||||
icon: hostIcon
|
||||
};
|
||||
} else if (props.name === 'recommend_class') {
|
||||
if (props.name === 'recommend_class') {
|
||||
return {
|
||||
fetchFunction: queryCrsInfoByRecmd,
|
||||
title: '推荐课程',
|
||||
title: '精选推荐',
|
||||
icon: recommendIcon
|
||||
};
|
||||
} else if (props.name === 'new_class') {
|
||||
return {
|
||||
fetchFunction: queryCrsInfoByLastnew,
|
||||
title: '最新课程',
|
||||
fetchFunction: queryNewPolicyNewProducts,
|
||||
title: '新政新品',
|
||||
icon: newIcon
|
||||
};
|
||||
}
|
||||
@@ -79,21 +87,21 @@
|
||||
|
||||
// 2. 调用命名函数,解构赋值
|
||||
const { fetchFunction, title, icon } = getConfigByProps(); // 调用函数,获取返回对象后解构
|
||||
|
||||
|
||||
const init_class_data = [
|
||||
{
|
||||
crsNum: '',
|
||||
img: '',
|
||||
crsName: '',
|
||||
issuTm: '',
|
||||
accmStdyCnt: ''
|
||||
id: '',
|
||||
ossKey: '',
|
||||
nama: '',
|
||||
mtTime: '',
|
||||
accmCnt: ''
|
||||
},
|
||||
{
|
||||
crsNum: '',
|
||||
id: '',
|
||||
img: '',
|
||||
crsName: '',
|
||||
issuTm: '',
|
||||
accmStdyCnt: ''
|
||||
nama: '',
|
||||
mtTime: '',
|
||||
accmCnt: ''
|
||||
}
|
||||
];
|
||||
const class_list = ref([]);
|
||||
@@ -129,8 +137,16 @@
|
||||
defineExpose({ get_data });
|
||||
|
||||
// 进入课程详情页
|
||||
const goto_course_detail = (crsId) => {
|
||||
common.navigateTo('/pages/courseDetail/index?crsId=' + crsId);
|
||||
const goto_course_detail = ({id, type}) => {
|
||||
// 00课程 01陪练
|
||||
if(type === '00') {
|
||||
common.navigateTo('/pages/courseDetail/index?crsId=' + id);
|
||||
} else if(type === '01') {
|
||||
common.navigateTo('/pages/sparring/detail?traId=' + id);
|
||||
}
|
||||
|
||||
// todo
|
||||
//
|
||||
};
|
||||
</script>
|
||||
|
||||
@@ -144,29 +160,40 @@
|
||||
white-space: nowrap;
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
.scroll-view-item {
|
||||
display: inline-block;
|
||||
margin-right: 30rpx;
|
||||
background-color: #ffffff;
|
||||
border-radius: 22rpx;
|
||||
box-shadow: #eaeaea 0 0 6rpx;
|
||||
padding: 20rpx 20rpx 36rpx 34rpx;
|
||||
padding: 20rpx 20rpx 26rpx 34rpx;
|
||||
position: relative;
|
||||
overflow: hidden;
|
||||
.icon {
|
||||
position: absolute;
|
||||
right: 0;
|
||||
top: 0;
|
||||
width: 76rpx;
|
||||
height: 76rpx;
|
||||
}
|
||||
}
|
||||
|
||||
.item_div {
|
||||
width: calc(562rpx + 56rpx);
|
||||
// width: calc(562rpx + 56rpx);
|
||||
width: 562rpx;
|
||||
}
|
||||
|
||||
.item {
|
||||
display: flex;
|
||||
width: calc(562rpx + 56rpx);
|
||||
width: 562rpx;
|
||||
flex-direction: column;
|
||||
|
||||
.title {
|
||||
font-weight: 500;
|
||||
font-size: 30rpx;
|
||||
color: #333333;
|
||||
margin-bottom: 10rpx;
|
||||
padding-right: 30rpx;
|
||||
width: 100%;
|
||||
}
|
||||
.content {
|
||||
@@ -224,11 +251,11 @@
|
||||
|
||||
.module_title_div {
|
||||
display: flex;
|
||||
margin: 30rpx $bg-margin-left;
|
||||
margin: 20rpx $bg-margin-left;
|
||||
align-items: center;
|
||||
|
||||
.icon {
|
||||
margin-right: 6rpx;
|
||||
margin-right: 8rpx;
|
||||
margin-top: 12rpx;
|
||||
}
|
||||
|
||||
.icon_1 {
|
||||
@@ -254,7 +281,7 @@
|
||||
height: 31rpx;
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
.title {
|
||||
font-size: 34rpx;
|
||||
color: #323e57;
|
||||
|
||||
@@ -153,7 +153,7 @@
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
<classScroll :ref="(el) => (classScrollRef[0] = el)" name="hot_class"></classScroll>
|
||||
<!-- <classScroll :ref="(el) => (classScrollRef[0] = el)" name="hot_class"></classScroll> -->
|
||||
<classScroll :ref="(el) => (classScrollRef[1] = el)" name="recommend_class"></classScroll>
|
||||
<classScroll :ref="(el) => (classScrollRef[2] = el)" name="new_class"></classScroll>
|
||||
<toDoCom></toDoCom>
|
||||
|
||||
Binary file not shown.
|
After Width: | Height: | Size: 3.5 KiB |
Binary file not shown.
|
Before Width: | Height: | Size: 881 B After Width: | Height: | Size: 1.5 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 3.5 KiB |
Reference in New Issue
Block a user