Skip to content

C
center-psp-show-h5
提交 cb9eb081 authored 作者: 王鹏飞's avatar 王鹏飞
浏览文件
操作

release 1.1

上级 e0d2b073
隐藏空白字符变更
内嵌 并排
正在显示 包含 256 行增加 和 115 行删除
src/modules/home/components/LearningMap.vue
浏览文件 @ cb9eb081
...@@ -65,7 +65,7 @@ function showTips() { ...@@ -65,7 +65,7 @@ function showTips() {
</van-tab> </van-tab>
</van-tabs> </van-tabs>
<div class="learn-banner"> <div class="learn-banner">
<router-link to="/my/course"> <router-link to="/learn/course">
<img src="https://webapp-pub.ezijing.com/project/prp-h5/learning_map_banner.png" /> <img src="https://webapp-pub.ezijing.com/project/prp-h5/learning_map_banner.png" />
</router-link> </router-link>
</div> </div>
......
src/modules/home/components/Questions.vue
浏览文件 @ cb9eb081
...@@ -3,7 +3,7 @@ import { Toast } from 'vant' ...@@ -3,7 +3,7 @@ import { Toast } from 'vant'
import PublishItem from '@/components/PublishItem.vue' import PublishItem from '@/components/PublishItem.vue'
import { createQuestionComment } from '../api' import { createQuestionComment } from '../api'
defineProps<{ data: { total: 0; list: [] } }>() defineProps<{ data: { total: number; list: Record<string, any>[] } }>()
// 评论 // 评论
const onSubmitComment = (data: any, action: string) => { const onSubmitComment = (data: any, action: string) => {
......
src/modules/home/components/TeamRanking.vue
浏览文件 @ cb9eb081
<script setup lang="ts"></script> <script setup lang="ts">
import type { ITeam } from '../types'
defineProps<{ teams: ITeam[] }>()
</script>
<template> <template>
<AppCard title="荣誉总榜" id="team"> <AppCard title="荣誉总榜" id="team">
<template #header-aside> <template #header-aside>
<div class="more">查看更多 <van-icon name="arrow" /></div> <div class="more">
<router-link to="/team">查看更多 <van-icon name="arrow" /></router-link>
</div>
</template> </template>
<div class="team-ranking">
<h2>团队荣誉总榜</h2>
<ul>
<li v-for="item in teams" :key="item.id">
<h4>{{ item.name }}</h4>
<p>{{ item.slogan }}<em>|</em>{{ item.members_count }}人</p>
</li>
</ul>
</div>
</AppCard> </AppCard>
</template> </template>
<style lang="scss">
.team-ranking {
background: #fff url(https://webapp-pub.ezijing.com/project/prp-h5/team_bg.png) no-repeat;
background-size: 100%;
border-radius: 0.2rem;
h2 {
padding: 0.4rem 0 0.2rem;
font-size: 0.36rem;
font-weight: 0.6rem;
color: #955801;
text-align: center;
background: url(https://webapp-pub.ezijing.com/project/prp-h5/team_header_bg.png) no-repeat center center;
background-size: 2.74rem;
}
li {
padding: 0.3rem 0.3rem 0.3rem 1.88rem;
h4 {
font-size: 0.3rem;
color: #4e4e4e;
line-height: 0.42rem;
}
p {
margin-top: 0.08rem;
font-size: 0.26rem;
color: #999999;
line-height: 0.38rem;
em {
padding: 0 0.2rem;
}
}
&:nth-child(1) {
background: url(https://webapp-pub.ezijing.com/project/prp-h5/team_1.png) no-repeat 0.68rem center;
background-size: 0.54rem;
}
&:nth-child(2) {
background: url(https://webapp-pub.ezijing.com/project/prp-h5/team_2.png) no-repeat 0.68rem center;
background-size: 0.54rem;
}
&:nth-child(3) {
background: url(https://webapp-pub.ezijing.com/project/prp-h5/team_3.png) no-repeat 0.68rem center;
background-size: 0.54rem;
}
}
li + li {
border-top: 0.01rem solid #e4e4e4;
}
}
</style>
src/modules/home/types.ts
浏览文件 @ cb9eb081
import type { IVideoItem, ICourseItem } from '@/types' import type { IVideoItem, ICourseItem, ITeam } from '@/types'
export interface HomeInfo { export interface HomeInfo {
banner: IBanner[] banner: IBanner[]
...@@ -6,7 +6,8 @@ export interface HomeInfo { ...@@ -6,7 +6,8 @@ export interface HomeInfo {
admission_guide_videos: IVideoItem[] admission_guide_videos: IVideoItem[]
learning_map_docs: IDocItem[] learning_map_docs: IDocItem[]
exam_strategy_docs: IDocItem[] exam_strategy_docs: IDocItem[]
questions: any questions: { total: number; list: Record<string, any>[] }
ranking: ITeam[]
} }
export interface IBanner { export interface IBanner {
...@@ -24,4 +25,4 @@ export interface IDocItem { ...@@ -24,4 +25,4 @@ export interface IDocItem {
pv: string pv: string
} }
export { IVideoItem, ICourseItem } export { IVideoItem, ICourseItem, ITeam }
src/modules/home/views/Index.vue
浏览文件 @ cb9eb081
...@@ -3,13 +3,13 @@ import { ref, onMounted } from 'vue' ...@@ -3,13 +3,13 @@ import { ref, onMounted } from 'vue'
import type { HomeInfo } from '../types' import type { HomeInfo } from '../types'
import * as api from '../api' import * as api from '../api'
import Banner from '../components/Banner.vue' import Banner from '../components/Banner.vue'
import Menu from '../components/Menu.vue' // import Menu from '../components/Menu.vue'
import AdmissionGuide from '../components/AdmissionGuide.vue' // import AdmissionGuide from '../components/AdmissionGuide.vue'
import LearningMap from '../components/LearningMap.vue' import LearningMap from '../components/LearningMap.vue'
import QueryView from '../components/QueryView.vue' // import QueryView from '../components/QueryView.vue'
import ExamStrategy from '../components/ExamStrategy.vue' // import ExamStrategy from '../components/ExamStrategy.vue'
import TeamRanking from '../components/TeamRanking.vue' // import TeamRanking from '../components/TeamRanking.vue'
import Questions from '../components/Questions.vue' // import Questions from '../components/Questions.vue'
const data = ref<HomeInfo>({ const data = ref<HomeInfo>({
banner: [], banner: [],
...@@ -17,7 +17,8 @@ const data = ref<HomeInfo>({ ...@@ -17,7 +17,8 @@ const data = ref<HomeInfo>({
admission_guide_videos: [], admission_guide_videos: [],
learning_map_docs: [], learning_map_docs: [],
exam_strategy_docs: [], exam_strategy_docs: [],
questions: { total: 0, list: [] } questions: { total: 0, list: [] },
ranking: []
}) })
// 获取首页数据 // 获取首页数据
const fetchHomeData = () => { const fetchHomeData = () => {
...@@ -32,17 +33,17 @@ onMounted(() => { ...@@ -32,17 +33,17 @@ onMounted(() => {
<template> <template>
<Banner :list="data.banner"></Banner> <Banner :list="data.banner"></Banner>
<Menu></Menu> <!-- <Menu></Menu> -->
<!-- 入学指南 --> <!-- 入学指南 -->
<AdmissionGuide :docs="data.admission_guide_docs" :videos="data.admission_guide_videos"></AdmissionGuide> <!-- <AdmissionGuide :docs="data.admission_guide_docs" :videos="data.admission_guide_videos"></AdmissionGuide> -->
<!-- 学习地图 --> <!-- 学习地图 -->
<LearningMap :docs="data.learning_map_docs"></LearningMap> <LearningMap :docs="data.learning_map_docs"></LearningMap>
<!-- 权益查看 --> <!-- 权益查看 -->
<QueryView></QueryView> <!-- <QueryView></QueryView> -->
<!-- 荣誉总榜 --> <!-- 荣誉总榜 -->
<TeamRanking></TeamRanking> <!-- <TeamRanking :teams="data.ranking"></TeamRanking> -->
<!-- 考试攻略 --> <!-- 考试攻略 -->
<ExamStrategy :docs="data.exam_strategy_docs"></ExamStrategy> <!-- <ExamStrategy :docs="data.exam_strategy_docs"></ExamStrategy> -->
<!-- 陪伴问答 --> <!-- 陪伴问答 -->
<Questions :data="data.questions"></Questions> <!-- <Questions :data="data.questions"></Questions> -->
</template> </template>
src/modules/learn/views/Course.vue
浏览文件 @ cb9eb081
<script setup lang="ts"></script> <script setup lang="ts">
import { ref, onMounted } from 'vue'
import CourseItem from '@/components/CourseItem.vue'
import type { ICourseItem } from '@/types'
import { getCourseList } from '../api'
// 学习进度
const dataset = ref<{ total: number; list: ICourseItem[] }>({ total: 0, list: [] })
const fetchCourseList = () => {
getCourseList({ page_size: 100 }).then(res => {
dataset.value = res.data
})
}
onMounted(() => {
fetchCourseList()
})
</script>
<template> <template>
<div class="home"></div> <a href="https://mp.weixin.qq.com/s/fDf4NpPZH4BNI_KEopiSwQ" target="_blank">
<img src="https://webapp-pub.ezijing.com/project/prp-h5/banner_my_course.png" style="width: 100%" />
</a>
<p class="tips">如果你也是知识获得者，点击课程，晒出你的海报、说出你的感想，得到你的星星。</p>
<CourseItem v-for="item in dataset.list" :data="item" :key="item.id"></CourseItem>
</template> </template>
<style lang="scss" scoped>
.tips {
padding: 0.1rem 0 0.2rem;
font-size: 0.24rem;
font-weight: 400;
color: #033974;
line-height: 0.36rem;
}
.course-item {
margin-bottom: 0.3rem;
}
</style>
src/modules/my/views/Index.vue
浏览文件 @ cb9eb081
...@@ -20,7 +20,7 @@ const menus: Array<{ ...@@ -20,7 +20,7 @@ const menus: Array<{
icon: string icon: string
}> = [ }> = [
{ {
path: '/my/course', path: '/learn/course',
name: '我的课程', name: '我的课程',
icon: 'https://webapp-pub.ezijing.com/project/prp-h5/my_menu_1.png' icon: 'https://webapp-pub.ezijing.com/project/prp-h5/my_menu_1.png'
} }
......
src/modules/team/api.ts
浏览文件 @ cb9eb081
import httpRequest from '@/utils/axios' import httpRequest from '@/utils/axios'
// 获取团队列表 // 获取团队列表
export function getTeamList() { export function getTeamList(params?: { page?: number; page_size?: number }) {
return httpRequest.get('/api/psp/v1/team/list') return httpRequest.get('/api/psp/v1/team/list', { params })
}
// 创建团队
export function createTeam(data: { name: string; slogan: string; logo: string; brief: string }) {
return httpRequest.post('/api/psp/v1/team/create-team', data)
} }
src/modules/team/components/TeamList.vue
浏览文件 @ cb9eb081
<script setup lang="ts">
import { onMounted, ref } from 'vue'
import { getTeamList } from '../api'
import type { ITeam } from '@/types'
let list = ref<ITeam[]>([])
function fetchTeamList() {
getTeamList({ page_size: 100 }).then(res => {
list.value = res.data.list.list
})
}
onMounted(() => {
fetchTeamList()
})
</script>
<template> <template>
<ul class="list-card"> <ul class="list-card">
<li v-for="(item, index) in list" :key="index"> <li v-for="(item, index) in list" :key="index">
...@@ -9,138 +26,91 @@ ...@@ -9,138 +26,91 @@
<div class="desc">{{ item.slogan }} | {{ item.members_count }}人</div> <div class="desc">{{ item.slogan }} | {{ item.members_count }}人</div>
</div> </div>
</li> </li>
<!-- <li>
<div class="team-order">
<div class="order"></div>
</div>
<div class="team-info">
<div class="title">团队名称1</div>
<div class="desc">团队1口号 | 3456人</div>
</div>
</li>
<li>
<div class="team-order">
<div class="order"></div>
</div>
<div class="team-info">
<div class="title">团队名称1</div>
<div class="desc">团队1口号 | 3456人</div>
</div>
</li>
<li>
<div class="team-order">
<div class="order">4</div>
</div>
<div class="team-info">
<div class="title">团队名称1</div>
<div class="desc">团队1口号 | 3456人</div>
</div>
</li> -->
</ul> </ul>
</template> </template>
<script setup lang="ts">
import { onMounted, ref } from 'vue'
import { getTeamList } from '../api'
// interface List {}
let list = ref<{
name: string,
slogan: string,
members_count: string
}[]>([])
function fetchTeamList() {
getTeamList().then(res => {
list.value = res.data.list.list
})
}
onMounted(() => {
fetchTeamList()
})
</script>
<style lang="scss" scoped> <style lang="scss" scoped>
.list-card{ .list-card {
background: #FFFFFF; background: #ffffff;
border-radius: 0.15rem; border-radius: 0.15rem;
opacity: 1; opacity: 1;
li{ li {
border-bottom: 0.01rem solid #E4E4E4; border-bottom: 0.01rem solid #e4e4e4;
padding: 0.35rem 0; padding: 0.35rem 0;
display: flex; display: flex;
.team-order{ .team-order {
width: 1.8rem; width: 1.8rem;
display: flex; display: flex;
justify-content: center; justify-content: center;
align-items: center; align-items: center;
.order{ .order {
position: relative; position: relative;
font-size: 0.4rem; font-size: 0.4rem;
// font-weight: bold; color: #e68626;
color: #E68626; &::before {
&::before{
content: ''; content: '';
position: absolute; position: absolute;
bottom: 0.05rem; bottom: 0.05rem;
left: 50%; left: 50%;
opacity: .5; opacity: 0.5;
transform: translateX(-50%); transform: translateX(-50%);
background: linear-gradient(270deg, #FFEAE6 0%, #FFFFFF 100%); background: linear-gradient(270deg, #ffeae6 0%, #ffffff 100%);
width: 0.7rem; width: 0.7rem;
height: 0.1rem; height: 0.1rem;
border-radius: 25%; border-radius: 25%;
} }
} }
} }
&:last-child{ &:last-child {
border: none; border: none;
} }
&:nth-child(1){ &:nth-child(1) {
.order{ .order {
width: 0.54rem; width: 0.54rem;
height: 0.6rem; height: 0.6rem;
background: url(https://webapp-pub.ezijing.com/project/prp-h5/team-rk1.png); background: url(https://webapp-pub.ezijing.com/project/prp-h5/team-rk1.png);
background-size: 100% 100%; background-size: 100% 100%;
&::before{ &::before {
display: none; display: none;
} }
} }
} }
&:nth-child(2){ &:nth-child(2) {
.order{ .order {
width: 0.54rem; width: 0.54rem;
height: 0.6rem; height: 0.6rem;
background: url(https://webapp-pub.ezijing.com/project/prp-h5/team-rk2.png); background: url(https://webapp-pub.ezijing.com/project/prp-h5/team-rk2.png);
background-size: 100% 100%; background-size: 100% 100%;
&::before{ &::before {
display: none; display: none;
} }
} }
} }
&:nth-child(3){ &:nth-child(3) {
.order{ .order {
width: 0.54rem; width: 0.54rem;
height: 0.6rem; height: 0.6rem;
background: url(https://webapp-pub.ezijing.com/project/prp-h5/team-rk3.png); background: url(https://webapp-pub.ezijing.com/project/prp-h5/team-rk3.png);
background-size: 100% 100%; background-size: 100% 100%;
&::before{ &::before {
display: none; display: none;
} }
} }
} }
.team-info{ .team-info {
.title{ .title {
font-size: 0.3rem; font-size: 0.3rem;
font-weight: 400; font-weight: 400;
line-height: 100%; line-height: 100%;
color: #4E4E4E; color: #4e4e4e;
} }
.desc{ .desc {
font-size: 0.26rem; font-size: 0.26rem;
line-height: 100%; line-height: 100%;
margin-top: .1rem; margin-top: 0.1rem;
color: #999999; color: #999999;
} }
} }
} }
} }
</style> </style>
\ No newline at end of file
src/modules/team/index.ts
浏览文件 @ cb9eb081
...@@ -5,6 +5,9 @@ export const routes: Array<RouteRecordRaw> = [ ...@@ -5,6 +5,9 @@ export const routes: Array<RouteRecordRaw> = [
{ {
path: '/team', path: '/team',
component: AppLayout, component: AppLayout,
children: [{ path: '', component: () => import('./views/Index.vue') }] children: [
{ path: '', component: () => import('./views/Index.vue') },
{ path: 'create', component: () => import('./views/Create.vue'), meta: { requireLogin: true } }
]
} }
] ]
src/modules/team/views/Create.vue 0 → 100644
浏览文件 @ cb9eb081
<script setup lang="ts">
import { reactive } from 'vue'
import { useRouter, useRoute } from 'vue-router'
import { createTeam } from '../api'
import UploadImageList from '@/components/UploadImageList.vue'
import { Toast } from 'vant'
const router = useRouter()
const route = useRoute()
const form = reactive({ ...{ chapter_id: '', course_id: '', content: '', picture: [] }, ...route.query })
const pictureValidator = () => !!form.picture.length
function onSubmit() {
const params = Object.assign({}, form, { picture: JSON.stringify(form.picture) })
createTeam(params).then(() => {
Toast.success('创建成功')
router.push({ name: 'learnCourseView', params: { id: form.course_id } })
})
}
</script>
<template>
<AppContainer title="团队创建" backgroundColor="#fff" headerAlign="center">
<van-form @submit="onSubmit">
<van-field
v-model="form.content"
placeholder="团队名称"
:rules="[{ required: true, message: '请输入团队名称' }]"
/>
<van-field
v-model="form.content"
type="textarea"
placeholder="团队简介"
:autosize="{ minHeight: 200 }"
:rules="[{ required: true, message: '请输入团队简介' }]"
/>
<van-field :rules="[{ validator: pictureValidator, message: '请上传图片' }]">
<template #input>
<UploadImageList v-model="form.picture"></UploadImageList>
</template>
</van-field>
<van-button block round native-type="submit" class="my-button">立即创建</van-button>
</van-form>
</AppContainer>
</template>
<style lang="scss" scoped>
:deep(.van-cell) {
padding-left: 0;
padding-right: 0;
&::after {
left: 0;
right: 0;
}
}
.my-button {
margin: 1rem 0;
}
</style>
src/modules/team/views/Index.vue
浏览文件 @ cb9eb081
<template> <template>
<AppContainer title="团队总榜"> <AppContainer title="团队总榜">
<div class="team-handle"> <div class="team-header">
<div class="btn-box"> <div class="btn-box">
<img src="https://webapp-pub.ezijing.com/project/prp-h5/team-h2.png"> <router-link to="/team/create">
<div class="b-text">团队创建</div> <img src="https://webapp-pub.ezijing.com/project/prp-h5/team-h2.png" />
<div class="b-text">团队创建</div>
</router-link>
</div> </div>
<div class="btn-box"> <div class="btn-box">
<img src="https://webapp-pub.ezijing.com/project/prp-h5/team-h1.png"> <img src="https://webapp-pub.ezijing.com/project/prp-h5/team-h1.png" />
<div class="b-text">我的团队</div> <div class="b-text">我的团队</div>
</div> </div>
</div> </div>
...@@ -17,28 +19,22 @@ ...@@ -17,28 +19,22 @@
import TeamList from '../components/TeamList.vue' import TeamList from '../components/TeamList.vue'
</script> </script>
<style lang="scss"> <style lang="scss">
.team-handle{ .team-header {
display: flex; display: flex;
padding: 0.46rem 0 0.42rem; padding: 0.46rem 0 0.42rem;
justify-content: space-evenly; justify-content: space-evenly;
.btn-box{ .btn-box {
img{ img {
width: 0.73rem; height: 0.53rem;
display: block; display: block;
margin: 0 auto; margin: 0 auto;
} }
.b-text{ .b-text {
margin-top: 0.15rem; margin-top: 0.15rem;
font-size: 0.28rem; font-size: 0.28rem;
color: #666666; color: #666666;
line-height: 100%; line-height: 100%;
} }
&:nth-child(2){
img{
width: 0.63rem;
}
}
} }
} }
</style> </style>
src/types.ts
浏览文件 @ cb9eb081
...@@ -39,3 +39,12 @@ export interface ICourseLecturerItem { ...@@ -39,3 +39,12 @@ export interface ICourseLecturerItem {
lecturer_title: string lecturer_title: string
lecturer_office: string lecturer_office: string
} }
// 课程
export interface ITeam {
id: string
members_count: string
name: string
slogan: string
star: string
}
Markdown 格式
0% 或
您添加了 0 人 到此讨论。请谨慎行事。
请先完成此评论的编辑！
请 注册 或者 后发表评论