572 lines
16 KiB
Vue
572 lines
16 KiB
Vue
<script>
|
||
import StaticConstant from "@/common/StaticConstant";
|
||
import ApiConstant from "@/common/ApiConstant";
|
||
import Request from '@/common/request'
|
||
import ImagesConstant from "@/common/ImagesConstant";
|
||
import {arrayIsNotEmpty, yearAbridge} from "@/common/util";
|
||
|
||
let request = new Request()
|
||
export default {
|
||
name: "school-list",
|
||
computed: {
|
||
ImagesConstant() {
|
||
return ImagesConstant
|
||
},
|
||
StaticConstant() {
|
||
return StaticConstant
|
||
}
|
||
},
|
||
data() {
|
||
return {
|
||
schoolName: '',
|
||
defaultIcon: ImagesConstant.defaultIcon,//默认图片
|
||
/*筛选项 参数 start*/
|
||
selectForm: {
|
||
addressList: [],
|
||
institutionTypeList: [],
|
||
schoolType: "",
|
||
tagsList: [],
|
||
schoolNatureList: []
|
||
},
|
||
defaultSelected: [],
|
||
menuList: StaticConstant.schoolMenuData,
|
||
/*筛选项 参数 end*/
|
||
options: [
|
||
{
|
||
title: "省控线",
|
||
icon: ImagesConstant.skx,
|
||
url: "/pages/zyb/historyScoreControlLine/index"
|
||
},
|
||
{
|
||
title: "测文化",
|
||
icon: ImagesConstant.cwh,
|
||
url: "/pages/zyb/testCultural/index"
|
||
},
|
||
{
|
||
title: "查位次",
|
||
icon: ImagesConstant.cwc,
|
||
url: "/pages/zyb/other/checkRanking"
|
||
},
|
||
{
|
||
title: "算投档",
|
||
icon: ImagesConstant.std,
|
||
url: "/pages/zyb/other/calculateInvestment"
|
||
}
|
||
],
|
||
userInfo: {},
|
||
vipInfo: {},
|
||
topFlag: false,
|
||
nowProvince: {
|
||
status: 'more',
|
||
schoolList: [],
|
||
pages: 0,
|
||
current: 1,
|
||
size: 5,
|
||
total: 0
|
||
},//本省
|
||
otherProvince: {
|
||
schoolList: [],
|
||
pages: 0,
|
||
current: 1,
|
||
size: 10,
|
||
total: 0
|
||
},//外省
|
||
statusTypes: StaticConstant.loadStatusTypes,
|
||
contentText: StaticConstant.loadContentText
|
||
}
|
||
},
|
||
onShow() {
|
||
|
||
},
|
||
onLoad() {
|
||
this.getSchoolList()
|
||
this.userInfo = uni.getStorageSync('userInfo')
|
||
this.vipInfo = uni.getStorageSync('vipInfo')
|
||
},
|
||
onReachBottom() {
|
||
console.log("已经滚动到底部了")
|
||
if (this.vipInfo && this.vipInfo.vipFlag) {
|
||
this.loadMore()
|
||
}
|
||
},
|
||
onShareAppMessage() {
|
||
return {
|
||
title: '查院校', //分享标题
|
||
path: "/pages/zyb/school/list"
|
||
}
|
||
},
|
||
// 分享到微信朋友圈
|
||
onShareTimeline(res) {
|
||
return {
|
||
title: '查院校', //分享标题
|
||
path: "/pages/zyb/school/list"
|
||
}
|
||
},
|
||
methods: {
|
||
yearAbridge,
|
||
search(res) {
|
||
uni.showToast({
|
||
title: '搜索：' + res.value,
|
||
icon: 'none'
|
||
})
|
||
},
|
||
/*跳转页面*/
|
||
goto(url) {
|
||
uni.navigateTo({
|
||
url: url
|
||
})
|
||
},
|
||
onConfirm(e) {
|
||
console.log('onConfirm')
|
||
if (e.type === 'filter' && e.children) {
|
||
for (let i = 0; i < e.children.length; i++) {
|
||
if (e.children[i].title === '院校标签') {
|
||
this.selectForm.tagsList = e.children[i].value
|
||
if (this.selectForm.tagsList === null) {
|
||
this.selectForm.tagsList = []
|
||
}
|
||
} else if (e.children[i].title === '院校层次') {
|
||
this.selectForm.schoolType = e.children[i].value
|
||
} else if (e.children[i].title === '办学类型') {
|
||
this.selectForm.schoolNatureList = e.children[i].value
|
||
if (this.selectForm.schoolNatureList === null) {
|
||
this.selectForm.schoolNatureList = []
|
||
}
|
||
} else if (e.children[i].title === '地区') {
|
||
this.selectForm.addressList = e.children[i].value
|
||
} else if (e.children[i].title === '院校类型') {
|
||
this.selectForm.institutionTypeList = e.children[i].value
|
||
}
|
||
}
|
||
}
|
||
console.log(e)
|
||
this.clearData()
|
||
this.getSchoolList()
|
||
},
|
||
onChange(e, index) {
|
||
console.log('onChange')
|
||
console.log(e, index)
|
||
},
|
||
clearData() {
|
||
this.nowProvince.schoolList = []
|
||
this.nowProvince.current = 1
|
||
},
|
||
/*点击 操作菜单*/
|
||
optionItemChange(e) {
|
||
console.log(e)
|
||
if (this.options && this.options[e.detail.index].url) {
|
||
this.goto(this.options[e.detail.index].url)
|
||
}
|
||
},
|
||
/*院校列表*/
|
||
getSchoolList() {
|
||
this.nowProvince.status = 'loading'
|
||
//地区
|
||
let province = ''
|
||
if (arrayIsNotEmpty(this.selectForm.addressList)) {
|
||
province = this.selectForm.addressList.join(",")
|
||
}
|
||
//院校类型
|
||
let institutionType = ''
|
||
if (arrayIsNotEmpty(this.selectForm.institutionTypeList)) {
|
||
institutionType = this.selectForm.institutionTypeList.join(",")
|
||
}
|
||
//院校标签
|
||
let tagsStrs = ''
|
||
if (arrayIsNotEmpty(this.selectForm.tagsList)) {
|
||
tagsStrs = this.selectForm.tagsList.join(",")
|
||
}
|
||
//办学类型
|
||
let schoolNatureStrs = ''
|
||
if (arrayIsNotEmpty(this.selectForm.schoolNatureList)) {
|
||
schoolNatureStrs = this.selectForm.schoolNatureList.join(",")
|
||
}
|
||
request.get(ApiConstant.School.searchSchoolList, {
|
||
schoolName: this.schoolName,
|
||
province: province,
|
||
institutionType: institutionType,
|
||
tagsStrs: tagsStrs,
|
||
schoolNatureStrs: schoolNatureStrs,
|
||
schoolType: this.selectForm.schoolType,
|
||
pageNum: this.nowProvince.current, pageSize: this.nowProvince.size
|
||
}, {showLoad: false}).then(r => {
|
||
console.log(r)
|
||
if (r.success) {
|
||
this.nowProvince.current = r.result.current
|
||
this.nowProvince.pages = r.result.pages
|
||
this.nowProvince.size = r.result.size
|
||
this.nowProvince.total = r.result.total
|
||
//追加到列表数据中
|
||
this.nowProvince.schoolList = [...this.nowProvince.schoolList, ...r.result.records]
|
||
if (r.result.current >= r.result.pages) {
|
||
this.nowProvince.status = 'noMore'
|
||
} else {
|
||
this.nowProvince.status = 'more'
|
||
}
|
||
}
|
||
}).catch(err => {
|
||
}).finally(() => {
|
||
});
|
||
},
|
||
searchSchoolClick() {
|
||
this.checkVip()
|
||
this.nowProvince.current = 1
|
||
this.nowProvince.schoolList = []
|
||
this.nowProvince.total = 0
|
||
this.nowProvince.pages = 0
|
||
this.getSchoolList()
|
||
},
|
||
clearSchoolInput() {
|
||
this.schoolName = ''
|
||
this.nowProvince.current = 1
|
||
this.nowProvince.schoolList = []
|
||
this.nowProvince.total = 0
|
||
this.nowProvince.pages = 0
|
||
this.getSchoolList()
|
||
},
|
||
loadMore() {
|
||
if (this.nowProvince.status === 'noMore') {
|
||
return;
|
||
}
|
||
//加载中
|
||
this.nowProvince.current++;
|
||
this.getSchoolList()
|
||
},
|
||
top() { //回到顶部
|
||
uni.pageScrollTo({
|
||
scrollTop: 0,
|
||
duration: 300
|
||
});
|
||
},
|
||
|
||
/*判断vip*/
|
||
checkVip() {
|
||
if (!this.vipInfo || !this.vipInfo.vipFlag) {
|
||
uni.showToast({
|
||
title: '开通VIP无限次查询',
|
||
duration: 1000,
|
||
icon: "none"
|
||
});
|
||
return
|
||
}
|
||
}
|
||
},
|
||
onPageScroll(e) { //根据距离顶部距离是否显示回到顶部按钮
|
||
//当距离大于600时显示回到顶部按钮，//当距离小于600时隐藏回到顶部按钮
|
||
this.topFlag = e.scrollTop > 600;
|
||
}
|
||
}
|
||
</script>
|
||
|
||
<template>
|
||
<view class="header">
|
||
<view class="search-view">
|
||
<view style="display: flex;height: 100rpx;border-bottom: 1px solid #f5f5f5;">
|
||
<view style="width: 90%">
|
||
<uni-search-bar class="uni-mt-10" radius="100" placeholder="请输入院校名称" v-model="schoolName"
|
||
@clear="clearSchoolInput" cancelButton="none" @confirm="searchSchoolClick"/>
|
||
</view>
|
||
<view style="width: 10%;line-height: 100rpx">
|
||
<text @click="searchSchoolClick">搜索</text>
|
||
</view>
|
||
</view>
|
||
</view>
|
||
<!--其他按钮-->
|
||
<view class="options">
|
||
<uni-grid :column="4" :highlight="true" :show-border="false" @change="optionItemChange">
|
||
<uni-grid-item v-for="(item, index) in options" :index="index" :key="index">
|
||
<view class="grid-item-box">
|
||
<image :src="item.icon?item.icon:defaultIcon"
|
||
style="height: 90rpx;width: 90rpx;"/>
|
||
<text class="text">{{ item.title }}</text>
|
||
</view>
|
||
</uni-grid-item>
|
||
</uni-grid>
|
||
</view>
|
||
<!--筛选项-->
|
||
<le-dropdown v-if="vipInfo && vipInfo.vipFlag"
|
||
v-model:menuList="menuList"
|
||
themeColor="#3d76fd"
|
||
:duration="200"
|
||
:isCeiling="true"
|
||
@onConfirm="onConfirm"
|
||
@onChange="onChange"></le-dropdown>
|
||
</view>
|
||
<view class="body">
|
||
<!--院校列表-->
|
||
<view class="school-list">
|
||
<view class="school-item uni-flex" v-for="(item,index) in nowProvince.schoolList" :key="index"
|
||
@click="goto('/pages/zyb/school/detail?schoolCode='+item.schoolCode)">
|
||
<view class="flex-item-10">
|
||
<view class="flex">
|
||
<view class="flex-item-22 t_item">
|
||
<image lazy-load :src="item.schoolIcon||ImagesConstant.defaultIcon" class="icon128 margin-left-10"
|
||
mode="aspectFill"/>
|
||
</view>
|
||
<view class="flex-item-8 t_item">
|
||
<view class="uni-flex flex">
|
||
<view class="flex-item-10 t_item" style="display: flex;height: 60rpx;line-height: 60rpx">
|
||
<text class="font-size-mini2">{{ item.schoolName }}</text>
|
||
<view class="address adrs" v-if="item.cityProvince">
|
||
<!--直辖市-->
|
||
<view class="address-item address-item-before" v-if="item.city">{{ item.city }}</view>
|
||
<view class="address-item" v-if="item.area && item.area.length<4">{{ item.area }}
|
||
</view>
|
||
</view>
|
||
<view class="address adrs" v-else>
|
||
<view class="address-item address-item-before" v-if="item.province">{{ item.province }}
|
||
</view>
|
||
<view class="address-item" v-if="item.city">{{ item.city }}</view>
|
||
</view>
|
||
</view>
|
||
</view>
|
||
<view class="tags">
|
||
<text class="tag" v-for="(tag,tindex) in item.tagsList" :key="tindex">
|
||
{{ tag }}
|
||
</text>
|
||
</view>
|
||
</view>
|
||
</view>
|
||
<!--校考-->
|
||
<view class="flex" style="height: 30rpx;line-height: 30rpx" v-if="item.kslx && item.kslx==='校考'">
|
||
<view class="flex-item-2">
|
||
<view style="text-align: center;margin: 0 20rpx;border-radius: 10rpx;" class="xk-background">
|
||
<text class="font-size-mini font-weight-550 xk-color">{{ item.kslx }}</text>
|
||
</view>
|
||
</view>
|
||
<!-- <view class="flex-item-42">
|
||
<view class="font-size-mini-mini" v-if="item.zdf">
|
||
<text class="slateGray">{{ yearAbridge(item.zdfYear) }}年录取最低分:</text>
|
||
<text class="font-weight-b xk-color">{{ item.zdf }}分</text>
|
||
</view>
|
||
</view>-->
|
||
<view class="flex-item-4">
|
||
<view class="font-size-mini-mini float-right" v-if="item.jhs">
|
||
<text class="slateGray">23年省内计划录取:</text>
|
||
<text class="font-weight-b xk-color">{{ item.jhs }}人</text>
|
||
</view>
|
||
</view>
|
||
</view>
|
||
<!--统考-->
|
||
<view class="flex" style="height: 30rpx;line-height: 30rpx" v-else>
|
||
<view class="flex-item-2">
|
||
<view style="text-align: center;margin: 0 20rpx;border-radius: 10rpx;" class="tk-background">
|
||
<text class="font-size-mini font-weight-550 tk-color">{{ item.kslx }}</text>
|
||
</view>
|
||
</view>
|
||
<view class="flex-item-4">
|
||
<view class="font-size-mini-mini" v-if="item.zdf">
|
||
<text class="slateGray">{{ yearAbridge(item.zdfYear) }}年录取最低分:</text>
|
||
<text class="font-weight-b tk-color">{{ item.zdf }}分</text>
|
||
</view>
|
||
</view>
|
||
<view class="flex-item-4">
|
||
<view class="font-size-mini-mini float-right" v-if="item.jhs">
|
||
<text class="slateGray">{{item.luquYear}}年省内计划录取:</text>
|
||
<text class="font-weight-b tk-color">{{ item.jhs }}人</text>
|
||
</view>
|
||
</view>
|
||
</view>
|
||
</view>
|
||
</view>
|
||
</view>
|
||
<view class="container" @click="loadMore" v-if="vipInfo && vipInfo.vipFlag">
|
||
<uni-load-more :status="nowProvince.status" :content-text="contentText"/>
|
||
</view>
|
||
</view>
|
||
<!--判断vip-->
|
||
<view v-if="nowProvince && nowProvince.schoolList && nowProvince.schoolList.length>0">
|
||
<my-checkvip :vip-flag="(vipInfo && vipInfo.vipFlag)"/>
|
||
</view>
|
||
<view class="top" :style="{'display':(topFlag===true? 'block':'none')}">
|
||
<uni-icons class="topc" type="arrowthinup" size="40" @click="top"></uni-icons>
|
||
</view>
|
||
</template>
|
||
|
||
<style scoped lang="scss">
|
||
//顶部
|
||
.header {
|
||
border-top: 3rpx solid #f6f6f6;
|
||
background-color: white;
|
||
//min-height: 500rpx;
|
||
//搜索栏
|
||
.search-view {
|
||
width: 95%;
|
||
margin: 0 auto;
|
||
border-bottom: 3rpx solid #f6f6f6;
|
||
}
|
||
|
||
//操作菜单
|
||
.options {
|
||
border-radius: 10rpx;
|
||
padding: 8rpx;
|
||
background-color: white;
|
||
position: relative;
|
||
//top: 100rpx;
|
||
border-bottom: 3rpx solid #f6f6f6;
|
||
}
|
||
}
|
||
|
||
/*院校列表*/
|
||
.school-list {
|
||
padding: 10rpx 10rpx;
|
||
|
||
.school-item {
|
||
margin-bottom: 10rpx;
|
||
padding: 20rpx 10rpx;
|
||
background-color: white;
|
||
border-radius: 15rpx;
|
||
box-shadow: 0 0 5px 1px rgba(0, 0, 0, 0.2);
|
||
}
|
||
}
|
||
|
||
.t_item {
|
||
margin-bottom: 10rpx;
|
||
}
|
||
|
||
/*省市区*/
|
||
.adrs {
|
||
display: flex;
|
||
flex-direction: row;
|
||
flex-wrap: wrap;
|
||
margin: 0 0 0 auto;
|
||
}
|
||
|
||
.address .address-item {
|
||
margin-right: 10rpx;
|
||
color: #8999a3;
|
||
font-size: 25rpx;
|
||
font-weight: 550;
|
||
}
|
||
|
||
/*标签*/
|
||
.tags {
|
||
display: flex;
|
||
flex-direction: row;
|
||
flex-wrap: wrap;
|
||
}
|
||
|
||
.tags .tag {
|
||
margin-bottom: 5rpx;
|
||
margin-right: 10rpx;
|
||
color: #8999a3;
|
||
font-size: 25rpx;
|
||
border: 3rpx solid #acadba;
|
||
border-radius: 8rpx;
|
||
padding: 5rpx;
|
||
}
|
||
|
||
/*宫格 start*/
|
||
.image {
|
||
width: 25px;
|
||
height: 25px;
|
||
}
|
||
|
||
.text {
|
||
font-size: 14px;
|
||
margin-top: 5px;
|
||
}
|
||
|
||
.example-body {
|
||
/* #ifndef APP-NVUE */
|
||
// display: block;
|
||
/* #endif */
|
||
}
|
||
|
||
.grid-dynamic-box {
|
||
margin-bottom: 15px;
|
||
}
|
||
|
||
.grid-item-box {
|
||
flex: 1;
|
||
// position: relative;
|
||
/* #ifndef APP-NVUE */
|
||
display: flex;
|
||
/* #endif */
|
||
flex-direction: column;
|
||
align-items: center;
|
||
justify-content: center;
|
||
padding: 15px 0;
|
||
}
|
||
|
||
.grid-item-box-row {
|
||
flex: 1;
|
||
// position: relative;
|
||
/* #ifndef APP-NVUE */
|
||
display: flex;
|
||
/* #endif */
|
||
flex-direction: row;
|
||
align-items: center;
|
||
justify-content: center;
|
||
padding: 15px 0;
|
||
}
|
||
|
||
.grid-dot {
|
||
position: absolute;
|
||
top: 5px;
|
||
right: 15px;
|
||
}
|
||
|
||
.swiper {
|
||
height: 420px;
|
||
}
|
||
|
||
/* #ifdef H5 */
|
||
@media screen and (min-width: 768px) and (max-width: 1425px) {
|
||
.swiper {
|
||
height: 630px;
|
||
}
|
||
}
|
||
|
||
@media screen and (min-width: 1425px) {
|
||
.swiper {
|
||
height: 830px;
|
||
}
|
||
}
|
||
|
||
/* #endif */
|
||
/*宫格 end*/
|
||
|
||
|
||
/*搜索栏*/
|
||
:deep(.uni-searchbar) {
|
||
padding: 15rpx 10rpx !important;
|
||
}
|
||
|
||
/* 回到顶部 start*/
|
||
.top {
|
||
position: relative;
|
||
display: none; /* 先将元素隐藏 */
|
||
transition: 0.5s;
|
||
}
|
||
|
||
.topc {
|
||
position: fixed;
|
||
right: 10rpx;
|
||
//background: #F0F0F0;
|
||
background: #e1e1e1;
|
||
border-radius: 50%;
|
||
top: 80%;
|
||
height: 40px;
|
||
line-height: 40px;
|
||
}
|
||
|
||
/* 回到顶部 end*/
|
||
.tk-color {
|
||
color: #7568e9 !important;
|
||
}
|
||
|
||
.xk-color {
|
||
color: #f96543 !important;
|
||
}
|
||
|
||
.tk-background {
|
||
background-color: #eaecff;
|
||
|
||
}
|
||
|
||
.xk-background {
|
||
background-color: #fef4f4;
|
||
}
|
||
</style>
|