refactor: 页面优化
parent
303284fd96
commit
19cba529b9
|
|
@ -2,7 +2,6 @@
|
|||
{
|
||||
style: {
|
||||
navigationStyle: 'custom',
|
||||
navigationBarTitleText: '新高考选科',
|
||||
},
|
||||
}
|
||||
</route>
|
||||
|
|
|
|||
|
|
@ -74,6 +74,8 @@ const handleClose = () => {
|
|||
transition: all 0.3s ease;
|
||||
z-index: 1000;
|
||||
border-radius: 24rpx 24rpx 0 0;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
|
||||
&-show {
|
||||
transform: translateY(0);
|
||||
|
|
@ -98,6 +100,7 @@ const handleClose = () => {
|
|||
&-content {
|
||||
max-height: 55vh;
|
||||
min-height: 500rpx;
|
||||
flex: 1 1 auto;
|
||||
}
|
||||
|
||||
&-footer {
|
||||
|
|
|
|||
|
|
@ -107,8 +107,8 @@ const checkboxStyle = computed(() => {
|
|||
}
|
||||
|
||||
:deep(.checkbox-group) {
|
||||
display: flex;
|
||||
flex-wrap: wrap;
|
||||
display: grid;
|
||||
grid-template-columns: repeat(3, 1fr);
|
||||
gap: 16rpx;
|
||||
// padding: 32rpx 16rpx 16rpx;
|
||||
}
|
||||
|
|
|
|||
|
|
@ -22,7 +22,7 @@
|
|||
</view>
|
||||
|
||||
<view
|
||||
class="flex flex-col items-center justify-center text-[22rpx] text-[#333] border-body mt-auto flex-1"
|
||||
class="flex flex-col items-center justify-center text-[24rpx] text-[#333] border-body mt-auto flex-1"
|
||||
v-if="data.length === 0"
|
||||
>
|
||||
<image
|
||||
|
|
|
|||
|
|
@ -21,7 +21,7 @@
|
|||
</Badge>
|
||||
|
||||
<image
|
||||
class="w-[286rpx] h-[286rpx] mt-[134rpx]"
|
||||
class="w-[286rpx] h-[286rpx] mt-[134rpx] mix-blend-darken"
|
||||
src="https://api.static.ycymedu.com/sub/images/autoFill/auto-fill.jpg"
|
||||
mode="widthFix"
|
||||
@click="show = true"
|
||||
|
|
|
|||
|
|
@ -10,6 +10,7 @@
|
|||
block
|
||||
class="mt-[24rpx] rounded-[8rpx]! bg-[#f8f8f8]! w-full text-[#303030]! text-[28rpx]! flex! items-center! justify-center! gap-[12rpx]!"
|
||||
@click="handleMore"
|
||||
v-show="tableData.length > 4"
|
||||
>
|
||||
查看全部
|
||||
<view class="i-carbon-chevron-down rotate-270"></view>
|
||||
|
|
|
|||
|
|
@ -1,5 +1,5 @@
|
|||
<template>
|
||||
<view class="flex flex-col pt-[32rpx] px-[32rpx] bg-[#fff]">
|
||||
<view class="flex flex-col pt-[32rpx] px-[32rpx] bg-[#fff] h-full">
|
||||
<view class="flex flex-wrap justify-between items-center">
|
||||
<view
|
||||
@click="handleShow(1)"
|
||||
|
|
|
|||
|
|
@ -1,5 +1,5 @@
|
|||
<template>
|
||||
<view class="flex flex-col pt-[32rpx] px-[32rpx] bg-[#fff]">
|
||||
<view class="flex flex-col pt-[32rpx] px-[32rpx] bg-[#fff] h-full">
|
||||
<view class="flex flex-wrap justify-between items-center">
|
||||
<text class="font-semibold text-[#303030] text-[32rpx] w-full text-center mb-[20rpx]">
|
||||
招生计划({{ provinceName }})
|
||||
|
|
|
|||
|
|
@ -30,6 +30,7 @@
|
|||
block
|
||||
class="mt-[24rpx] rounded-[8rpx]! bg-[#f8f8f8]! w-full text-[#303030]! text-[28rpx]! flex! items-center! justify-center! gap-[16rpx]"
|
||||
@click="show = true"
|
||||
v-if="universityResult.detail"
|
||||
>
|
||||
查看全部
|
||||
<view class="i-carbon-chevron-down rotate-270"></view>
|
||||
|
|
|
|||
File diff suppressed because one or more lines are too long
|
|
@ -42,7 +42,10 @@
|
|||
</text>
|
||||
</view>
|
||||
<button class="collect-btn whitespace-nowrap" plain @click="handleStar">
|
||||
<view class="i-carbon-star-filled min-w-[24rpx] min-h-[24rxp]" v-if="startFlag"></view>
|
||||
<view
|
||||
class="i-carbon-star-filled min-w-[24rpx] min-h-[24rxp] bg-amber"
|
||||
v-if="startFlag"
|
||||
></view>
|
||||
<view class="i-carbon-star min-w-[24rpx] min-h-[24rxp]" v-else></view>
|
||||
收藏
|
||||
</button>
|
||||
|
|
@ -87,12 +90,12 @@
|
|||
<FirstClass :id="collegeId" />
|
||||
<Colleges :id="collegeId" />
|
||||
</view>
|
||||
<view class="bg-[#f8f8f8]" v-show="currentTab === 1">
|
||||
<view class="bg-[#f8f8f8] flex-1" v-show="currentTab === 1">
|
||||
<EnrollmentPlan :id="collegeId"></EnrollmentPlan>
|
||||
</view>
|
||||
<EnrollmentIntro :id="collegeId" v-show="currentTab === 2" />
|
||||
<EnrollmentMark :id="collegeId" v-show="currentTab === 3" />
|
||||
<Situation :id="collegeId" v-show="currentTab === 4" />
|
||||
<EnrollmentMark class="flex-1" :id="collegeId" v-show="currentTab === 3" />
|
||||
<Situation class="flex-1" :id="collegeId" v-show="currentTab === 4" />
|
||||
</view>
|
||||
</view>
|
||||
</template>
|
||||
|
|
@ -110,7 +113,7 @@ import Navbar from '@/pages-sub/components/navbar/Navbar.vue'
|
|||
|
||||
import {
|
||||
getUniversityInfo,
|
||||
getUnCollectionList,
|
||||
getUnCollectionDetail,
|
||||
deleteUnCollection,
|
||||
addUnCollection,
|
||||
} from '@/service/index/api'
|
||||
|
|
@ -137,10 +140,10 @@ onLoad((options) => {
|
|||
getUniversityInfo({ Id: collegeId.value }).then((res) => {
|
||||
if (res.code === 200) {
|
||||
universityBaseInfo.value = res.result
|
||||
getUnCollectionList({
|
||||
SearchKey: universityBaseInfo.value.universityResult.name,
|
||||
getUnCollectionDetail({
|
||||
Id: universityBaseInfo.value.universityResult._id,
|
||||
}).then((resp) => {
|
||||
if (resp.code === 200 && (resp.result as any[]).length > 0) {
|
||||
if (resp.code === 200 && !!resp.result) {
|
||||
startFlag.value = true
|
||||
} else {
|
||||
startFlag.value = false
|
||||
|
|
@ -163,7 +166,7 @@ const handleStar = () => {
|
|||
// 收藏了，取消收藏
|
||||
deleteUnCollection({
|
||||
wxId: userStore.userInfo.estimatedAchievement.wxId,
|
||||
uId: universityBaseInfo.value._id,
|
||||
uId: universityBaseInfo.value.universityResult._id,
|
||||
}).then((resp) => {
|
||||
if (resp.code === 200) {
|
||||
startFlag.value = false
|
||||
|
|
@ -172,7 +175,7 @@ const handleStar = () => {
|
|||
} else {
|
||||
addUnCollection({
|
||||
wxId: userStore.userInfo.estimatedAchievement.wxId,
|
||||
uId: universityBaseInfo.value._id,
|
||||
uId: universityBaseInfo.value.universityResult._id,
|
||||
}).then((resp) => {
|
||||
if (resp.code === 200) {
|
||||
startFlag.value = true
|
||||
|
|
|
|||
|
|
@ -7,7 +7,7 @@
|
|||
</route>
|
||||
|
||||
<template>
|
||||
<view class="h-screen flex flex-col bg-[#f8f8f8] relative z-[-1]">
|
||||
<view class="h-screen flex flex-col bg-[#f8f8f8] relative z-[0]">
|
||||
<view class="relative">
|
||||
<Navbar
|
||||
safeAreaInsetTop
|
||||
|
|
@ -15,7 +15,7 @@
|
|||
:bordered="false"
|
||||
left-arrow
|
||||
title="卡密兑换"
|
||||
@click-left="navigatorBack"
|
||||
@click-left="handleClickLeft"
|
||||
content-class="justify-between"
|
||||
></Navbar>
|
||||
<view class="bg-[#fff] rounded-[8rpx] px-[46rpx] pt-[40rpx] pb-[30rpx] mx-[30rpx] mt-[40rpx]">
|
||||
|
|
@ -136,7 +136,9 @@ const isVIP = computed(() => {
|
|||
return userStore.userInfo.estimatedAchievement.isVIP
|
||||
})
|
||||
|
||||
const navigatorBack = () => {
|
||||
const handleClickLeft = () => {
|
||||
console.log(123)
|
||||
|
||||
uni.navigateBack()
|
||||
}
|
||||
|
||||
|
|
|
|||
|
|
@ -320,8 +320,7 @@
|
|||
"path": "index",
|
||||
"type": "page",
|
||||
"style": {
|
||||
"navigationStyle": "custom",
|
||||
"navigationBarTitleText": "新高考选科"
|
||||
"navigationStyle": "custom"
|
||||
}
|
||||
}
|
||||
]
|
||||
|
|
|
|||
|
|
@ -45,6 +45,12 @@
|
|||
>
|
||||
立即开通
|
||||
</button>
|
||||
<button
|
||||
v-else
|
||||
class="w-[136rpx]! h-[52rpx]! text-[#B38552]! text-[24rpx]! custom-button-bg-active font-normal flex! items-center! justify-center! rounded-[80rpx]! p-[0]! ml-[70rpx]!"
|
||||
>
|
||||
已开通
|
||||
</button>
|
||||
</view>
|
||||
<view class="diagonal-lines"></view>
|
||||
</view>
|
||||
|
|
@ -86,7 +92,7 @@
|
|||
<view class="i-carbon-chevron-down rotate-270 text-[#BFBFBF]"></view>
|
||||
</view>
|
||||
<view class="flex items-center justify-between mx-[32rpx] py-[28rpx]" @click="goActive">
|
||||
<text>激活记录</text>
|
||||
<text>卡密兑换</text>
|
||||
<view class="i-carbon-chevron-down rotate-270 text-[#BFBFBF]"></view>
|
||||
</view>
|
||||
</view>
|
||||
|
|
@ -240,6 +246,9 @@ const toSetting = () => {
|
|||
.custom-button-bg {
|
||||
background: linear-gradient(135deg, #ffcd6c 0%, #fff6c5 100%);
|
||||
}
|
||||
.custom-button-bg-active {
|
||||
background: linear-gradient(135deg, #ffe1a7 0%, #fff9db 100%);
|
||||
}
|
||||
|
||||
.custom-vip-bg {
|
||||
background: linear-gradient(135deg, #000000 0%, #525252 100%);
|
||||
|
|
|
|||
|
|
@ -141,6 +141,10 @@ export const getUnCollectionList = (params: {
|
|||
return http.get('/api/unCollection/list', params)
|
||||
}
|
||||
|
||||
export const getUnCollectionDetail = (params: { Id: number }) => {
|
||||
return http.get('/api/unCollection/detail', params)
|
||||
}
|
||||
|
||||
export const getMajorLevelList = (params: { Type: number; KeyWord: string }) => {
|
||||
return http.get(`/api/zhiYuan/majors`, params)
|
||||
}
|
||||
|
|
|
|||
Loading…
Reference in New Issue