volunteer-secondary/src/pages/evaluation/index.vue

68 lines
1.7 KiB
Vue

<template>
<view class="custom-background flex flex-col pb-safe">
<view>
<sar-navbar :fixed="true" fixation-style="top:unset;"
:root-style="{ '--sar-navbar-bg': `rgba(255, 255, 255, ${opacity})`, '--sar-navbar-height': `${safeAreaInsets?.top + 44}px` }">
<template #title>
<view class="text-[32rpx] font-500" :style="{ 'padding-top': `${safeAreaInsets?.top}px` }">
志愿填报
</view>
</template>
</sar-navbar>
</view>
<view class="px-[32rpx] mt-[30rpx]">
<EvaluationItem :item="value"
v-for="value in evaluationList" :key="value.id" />
</view>
</view>
</template>
<script lang="ts" setup>
import { safeAreaInsets } from '@/utils/systemInfo'
import EvaluationItem from './components/EvaluationItem.vue'
import {getEvaluationList} from "@/service/requestApi"
// #ifdef MP-WEIXIN
definePage({
style: {
navigationStyle: 'custom',
},
})
// #endif
// #ifndef MP-WEIXIN
definePage({
style: {
navigationStyle: 'custom',
transparentTitle: 'always',
navigationBarTitleText: '',
},
})
// #endif
const opacity = ref(0)
onPageScroll((e) => {
const scrollTop = e.scrollTop
opacity.value = Math.min(scrollTop / 100, 1)
})
const evaluationList = ref<{name:string,minImg:string,id:number}[]>([])
onLoad(() => {
getEvaluationList({query:{menuid:'340509778657349'}}).then(resp => {
if(resp.code === 200){
evaluationList.value = resp.result
}
})
})
</script>
<style lang="scss" scoped>
.custom-background {
background: linear-gradient(180deg, #ecf2ff 0%,#f6f8ff 40rpx, #fff 128rpx);
background-position: 50% 50%;
background-origin: padding-box;
background-clip: border-box;
background-size: auto auto;
}
</style>