@ -1,8 +1,9 @@ |
||||
import axios from '@/utils/request'; |
||||
|
||||
export const pageStuAssessment = async (data: Record<string, any>): Promise<any> => (await axios.post('/occupationlab/occupationlab/assessment/pageStuAssessment', data)).data; |
||||
export const getProjectBySystemId = async (data: Record<string, any>): Promise<any> => |
||||
(await axios.get('/occupationlab/occupationlab/projectManage/getProjectBySystemId', data)).data; |
||||
export const getProjectDetail = async (data: Record<string, any>): Promise<any> => (await axios.get('/occupationlab/occupationlab/projectManage/getProjectDetail', data)).data; |
||||
export const getProjectBySystemId = async (params: Record<string, any>): Promise<any> => |
||||
(await axios.get('/occupationlab/occupationlab/projectManage/getProjectBySystemId', { params })).data; |
||||
export const getProjectDetail = async (params: Record<string, any>): Promise<any> => |
||||
(await axios.get('/occupationlab/occupationlab/projectManage/getProjectDetail', { params })).data; |
||||
export const getDetailById = async (id: number | string): Promise<any> => (await axios.get(`/occupationlab/occupationlab/assessment/getDetailById?id=${id}`)).data; |
||||
export const getCompetition = async (id: number | string): Promise<any> => (await axios.post(`/competition/competition/management/getCompetition?competitionId=${id}`)).data; |
||||
|
After Width: | Height: | Size: 2.5 KiB |
After Width: | Height: | Size: 677 B |
After Width: | Height: | Size: 706 B |
After Width: | Height: | Size: 1.8 KiB |
After Width: | Height: | Size: 1.8 KiB |
After Width: | Height: | Size: 8.4 KiB |
After Width: | Height: | Size: 1.2 MiB |
@ -0,0 +1,171 @@ |
||||
<template> |
||||
<div class="min-h-[100vh] bg-[url('@/assets/images/role/bg.png')] bg-[length:100%_auto] bg-no-repeat"></div> |
||||
<div class="fixed top-4 right-[80px]"> |
||||
<div class="flex items-center h-[60px] px-4 rounded-tl-[20px] rounded-tr-[20px]" |
||||
style="background: linear-gradient(180deg, #7ebaff 0%, #0076ff 100%)"> |
||||
<div class="w-[112px] h-[28px] bg-[url('@/assets/images/role/1.png')] bg-[length:100%_100%] bg-no-repeat"></div> |
||||
<ul class="range inline-flex items-center px-3"> |
||||
<li v-for="item in ranges" |
||||
:key="item" |
||||
class="w-[48px] py-[2px] text-center text-xs text-white cursor-pointer">{{ item.name }}</li> |
||||
</ul> |
||||
<ul class="inline-flex items-center px-2"> |
||||
<li v-for="item in rank" |
||||
:key="item" |
||||
class="rank relative px-1 text-center text-sm text-white cursor-pointer">{{ item.name }}</li> |
||||
</ul> |
||||
</div> |
||||
<div class="py-[10px] px-5 bg-white"> |
||||
<div class="table"> |
||||
<ul class="thead"> |
||||
<li class="w-[100px]">排名</li> |
||||
<li class="w-[160px]">商品名称</li> |
||||
<li class="w-[160px]">产品经理</li> |
||||
<li class="w-[160px]">金额(元)</li> |
||||
</ul> |
||||
<div class="tbody"> |
||||
<div v-for="(item, i) in ranks" |
||||
:key="i" |
||||
class="line"> |
||||
<div class="w-[100px]">{{ i + 1 }}</div> |
||||
<div class="w-[160px]">{{ item.name }}</div> |
||||
<div class="w-[160px]">{{ item.user }}</div> |
||||
<div class="w-[160px]">{{ item.money }}</div> |
||||
</div> |
||||
</div> |
||||
</div> |
||||
</div> |
||||
</div> |
||||
<Panel /> |
||||
</template> |
||||
|
||||
<script setup lang="ts"> |
||||
import { ref, onMounted } from 'vue'; |
||||
import { checkPointList } from '@/api/judgment'; |
||||
import Panel from '@/components/Panel/index.vue'; |
||||
|
||||
const collected = ref<boolean>(false); |
||||
const curLevel = ref<number | string>(''); |
||||
const levels = ref<Record<string, any>[]>([]); |
||||
const ranges = ref<Record<string, any>[]>([ |
||||
{ |
||||
id: 1, |
||||
name: '今天', |
||||
}, |
||||
{ |
||||
id: 2, |
||||
name: '近1周', |
||||
}, |
||||
{ |
||||
id: 3, |
||||
name: '近1月', |
||||
}, |
||||
]); |
||||
const rank = ref<Record<string, any>[]>([ |
||||
{ |
||||
id: 1, |
||||
name: '收益排行', |
||||
}, |
||||
{ |
||||
id: 2, |
||||
name: '总资产排行', |
||||
}, |
||||
{ |
||||
id: 3, |
||||
name: '交易订单排行', |
||||
}, |
||||
{ |
||||
id: 4, |
||||
name: '查看更多', |
||||
}, |
||||
]); |
||||
const ranks = ref<Record<string, any>[]>([ |
||||
{ |
||||
id: 1, |
||||
name: '沙盘名称', |
||||
user: '沙盘名称', |
||||
money: '沙盘名称', |
||||
}, |
||||
{ |
||||
id: 1, |
||||
name: '沙盘名称', |
||||
user: '沙盘名称', |
||||
money: '沙盘名称', |
||||
}, |
||||
{ |
||||
id: 1, |
||||
name: '沙盘名称', |
||||
user: '沙盘名称', |
||||
money: '沙盘名称', |
||||
}, |
||||
{ |
||||
id: 1, |
||||
name: '沙盘名称', |
||||
user: '沙盘名称', |
||||
money: '沙盘名称', |
||||
}, |
||||
{ |
||||
id: 1, |
||||
name: '沙盘名称', |
||||
user: '沙盘名称', |
||||
money: '沙盘名称', |
||||
}, |
||||
]); |
||||
// 关卡列表 |
||||
const getLevel = async () => { |
||||
const { data } = await checkPointList(1); |
||||
levels.value = data; |
||||
}; |
||||
// 点击关卡回调 |
||||
const selecLevel = (item: Record<string, any>) => { |
||||
curLevel.value = item.id; |
||||
}; |
||||
onMounted(() => { |
||||
getLevel(); |
||||
}); |
||||
</script> |
||||
|
||||
<style lang="scss" scoped> |
||||
.range { |
||||
li { |
||||
border: 1px solid #2864ac; |
||||
&:first-child { |
||||
border-radius: 4px 0px 0px 4px; |
||||
border-right: 0; |
||||
} |
||||
&:last-child { |
||||
border-radius: 0px 4px 4px 0px; |
||||
border-left: 0; |
||||
} |
||||
} |
||||
.active { |
||||
@apply bg-[#2864AC]; |
||||
} |
||||
} |
||||
.rank { |
||||
font-family: PingFangSC-Light, PingFang SC; |
||||
text-shadow: 0px 2px 4px #0e3868; |
||||
&.active { |
||||
font-family: PingFangSC-Medium, PingFang SC; |
||||
&:after { |
||||
content: ''; |
||||
@apply absolute bottom-0 left-[50%] w-5 h-[3px] bg-white rounded translate-x-[-50%]; |
||||
} |
||||
} |
||||
} |
||||
.thead { |
||||
@apply flex items-center h-[32px] text-white text-center text-sm rounded-lg; |
||||
background: linear-gradient(180deg, #7ebaff 0%, #0076ff 100%); |
||||
} |
||||
.tbody { |
||||
.line { |
||||
@apply flex items-center h-[32px] my-1 text-[#333] text-center text-sm rounded-lg bg-[#FAFAFA]; |
||||
box-shadow: 0px 2px 0px 0px rgba(0, 0, 0, 0.1); |
||||
&:first-child, |
||||
&:nth-child(2), |
||||
&:nth-child(3) { |
||||
@apply bg-[#FFEFDE]; |
||||
} |
||||
} |
||||
} |
||||
</style> |