529 lines
14 KiB
Vue
529 lines
14 KiB
Vue
<!--
|
||
文化分测算 详情页 页面
|
||
-->
|
||
<script>
|
||
import StaticConstant from "@/common/StaticConstant";
|
||
import ApiConstant from "@/common/ApiConstant";
|
||
import Request from '@/common/request'
|
||
import ImagesConstant from "@/common/ImagesConstant";
|
||
|
||
let request = new Request()
|
||
export default {
|
||
name: "test-cultural-detail",
|
||
components: {},
|
||
computed: {
|
||
ImagesConstant() {
|
||
return ImagesConstant
|
||
},
|
||
StaticConstant() {
|
||
return StaticConstant
|
||
}
|
||
},
|
||
data() {
|
||
return {
|
||
schoolCode: '',
|
||
year:'2022',
|
||
schoolInfo: {},
|
||
collectSchoolList: [],//已关注院校信息
|
||
collectFlag: false,//是否激活关注按钮
|
||
majorIndex:0,
|
||
majorArray: [
|
||
{
|
||
majorName: '设计学类(环境设计、视觉传达设计)',
|
||
|
||
}
|
||
],//专业列表
|
||
}
|
||
},
|
||
onLoad(e) {
|
||
console.log(e)
|
||
if (e.schoolCode) {
|
||
this.schoolCode = e.schoolCode
|
||
}
|
||
this.getSchoolInfo()
|
||
},
|
||
onShareAppMessage(){
|
||
return {
|
||
title: "文化分测算", //分享标题
|
||
path: "/pages/zyb/testCultural/detail?schoolCode="+this.schoolCode,//分享链接
|
||
}
|
||
},
|
||
// 分享到微信朋友圈
|
||
onShareTimeline(res) {
|
||
return {
|
||
title: "文化分测算", //分享标题
|
||
path: "/pages/zyb/testCultural/detail?schoolCode="+this.schoolCode,//分享链接
|
||
}
|
||
},
|
||
methods: {
|
||
gotoSchoolDetail() {
|
||
uni.navigateTo({
|
||
url: '/pages/zyb/school/detail?schoolCode=' + this.schoolCode
|
||
})
|
||
},
|
||
/*院校详情信息*/
|
||
getSchoolInfo() {
|
||
request.get(ApiConstant.School.schoolInfo, {
|
||
schoolCode: this.schoolCode
|
||
}).then(r => {
|
||
console.log(r)
|
||
if (r.success) {
|
||
this.schoolInfo = r.result
|
||
if (this.schoolInfo.city.includes(this.schoolInfo.province)) {
|
||
this.schoolInfo.cityProvince = true
|
||
}
|
||
}
|
||
this.checkCollect()
|
||
this.getTestCultural()
|
||
}).catch(err => {
|
||
}).finally(() => {
|
||
});
|
||
},
|
||
checkCollect() {
|
||
// 判断该院校是否关注了
|
||
if (this.schoolInfo && this.schoolInfo.schoolCode) {
|
||
let collectSchoolList = uni.getStorageSync('collectSchoolList')
|
||
if (collectSchoolList === undefined || collectSchoolList === null || collectSchoolList === '') {
|
||
collectSchoolList = []
|
||
}
|
||
for (let i = 0; i < collectSchoolList.length; i++) {
|
||
if (collectSchoolList[i].schoolCode === this.schoolInfo.schoolCode) {
|
||
//关注了
|
||
this.collectFlag = true
|
||
this.collectIndex = i
|
||
break
|
||
}
|
||
}
|
||
}
|
||
},
|
||
/*关注按钮点击事件*/
|
||
clickCollectSchool() {
|
||
let collectSchoolList = uni.getStorageSync('collectSchoolList')
|
||
console.log(collectSchoolList)
|
||
if (collectSchoolList === undefined || collectSchoolList === null || collectSchoolList === '') {
|
||
collectSchoolList = []
|
||
}
|
||
if (this.collectFlag === true) {
|
||
//取消收藏
|
||
//获取 收藏的学校列表中，当前的index
|
||
this.checkCollect()
|
||
this.collectFlag = false
|
||
//移除
|
||
collectSchoolList.splice(this.collectIndex, 1)
|
||
} else {
|
||
//收藏
|
||
this.collectFlag = true
|
||
collectSchoolList.push(this.schoolInfo)
|
||
}
|
||
uni.setStorageSync('collectSchoolList', collectSchoolList)
|
||
},
|
||
bindMajorArrayPickerChange(e){
|
||
this.majorIndex = e.detail.value
|
||
},
|
||
getTestCultural(){
|
||
request.get(ApiConstant.Major.testCultural, {
|
||
schoolCode: this.schoolCode,
|
||
year:this.year
|
||
}).then(r => {
|
||
console.log(r)
|
||
if (r.success) {
|
||
this.majorArray = r.result
|
||
}
|
||
}).catch(err => {
|
||
}).finally(() => {
|
||
});
|
||
},
|
||
/**/
|
||
shareToggle() {
|
||
uni.share({
|
||
provider: "weixin",
|
||
scene: "WXSceneSession",
|
||
type: 1,
|
||
summary: "我正在使用HBuilderX开发uni-app，赶紧跟我一起来体验！",
|
||
success: function (res) {
|
||
console.log("success:" + JSON.stringify(res));
|
||
},
|
||
fail: function (err) {
|
||
console.log("fail:" + JSON.stringify(err));
|
||
}
|
||
});
|
||
}
|
||
}
|
||
}
|
||
</script>
|
||
|
||
<template>
|
||
<view class="head">
|
||
<view class="school-item">
|
||
<view class="uni-flex flex">
|
||
<view class="flex-item-25 t_item">
|
||
<image :src="schoolInfo.schoolIcon||ImagesConstant.defaultIcon" style="width: 128rpx;height: 128rpx" mode="aspectFill"/>
|
||
</view>
|
||
<view class="flex-item-75 t_item">
|
||
<view class="uni-flex flex">
|
||
<view class="flex-item-6 t_item" style="display: flex;height: 80rpx;">
|
||
<text style="font-size: 35rpx;">{{ schoolInfo.schoolName }}</text>
|
||
</view>
|
||
<view class="flex-item-4 t_item" style="display: flex;height: 60rpx;font-size: 30rpx;">
|
||
<view class="address adrs" v-if="schoolInfo.cityProvince">
|
||
<!--直辖市-->
|
||
<view class="address-item address-item-before" v-if="schoolInfo.city">{{ schoolInfo.city }}</view>
|
||
<view class="address-item" v-if="schoolInfo.area && schoolInfo.area.length<4">{{ schoolInfo.area }}
|
||
</view>
|
||
</view>
|
||
<view class="address adrs" v-else>
|
||
<view class="address-item address-item-before" v-if="schoolInfo.province">{{ schoolInfo.province }}
|
||
</view>
|
||
<view class="address-item" v-if="schoolInfo.city">{{ schoolInfo.city }}</view>
|
||
<!-- <view class="address-item" v-if="item.area && item.area.length<4">{{item.area}}</view>-->
|
||
</view>
|
||
</view>
|
||
</view>
|
||
<view class="uni-flex flex">
|
||
<view class="flex-item-10 t_item" style="display: flex;">
|
||
<view class="tags">
|
||
<text class="tag" v-for="(tag,tindex) in schoolInfo.tagsList" :key="tindex" v-show="tag !=='普通本科'">
|
||
{{ tag }}
|
||
</text>
|
||
</view>
|
||
</view>
|
||
</view>
|
||
</view>
|
||
</view>
|
||
<view class="uni-flex flex other">
|
||
<view class="flex-item-33 t_item center" @click="gotoSchoolDetail">
|
||
<view class="t-item-b">
|
||
<view style="display: flex">
|
||
<image :src="ImagesConstant.yxjs"/>
|
||
</view>
|
||
<text class="text">院校介绍</text>
|
||
</view>
|
||
</view>
|
||
<view class="flex-item-33 t_item center" @click="gotoSchoolDetail">
|
||
<view class="t-item-b">
|
||
<view style="display: flex">
|
||
<image :src="ImagesConstant.zlsj"/>
|
||
</view>
|
||
<text class="text">招录数据</text>
|
||
</view>
|
||
</view>
|
||
<view class="flex-item-33 t_item center end" @click="gotoSchoolDetail">
|
||
<view class="t-item-b">
|
||
<view style="display: flex">
|
||
<image :src="ImagesConstant.lqxx"/>
|
||
</view>
|
||
<text class="text">录取信息</text>
|
||
</view>
|
||
</view>
|
||
</view>
|
||
</view>
|
||
</view>
|
||
<view class="body">
|
||
<view class="detail">
|
||
<picker @change="bindMajorArrayPickerChange" :value="majorIndex" :range="majorArray" range-key='majorNameAll'>
|
||
<view class="flex">
|
||
<view style="width: 80%">
|
||
<view class="flex majorTitle">专业名称</view>
|
||
<view class="flex" style="padding: 0 30rpx 30rpx 30rpx">
|
||
<view class="majorName">{{ majorArray[majorIndex].majorNameAll }}</view>
|
||
</view>
|
||
</view>
|
||
<view class="" style="width: 20%;margin: auto 0">
|
||
<image :src="ImagesConstant.keyboard.arrowDown" style="width: 70rpx;height: 55rpx;background-color: #42c6c6;border-radius: 10rpx"/>
|
||
<text class="flex">共{{majorArray.length}}个</text>
|
||
</view>
|
||
</view>
|
||
|
||
</picker>
|
||
|
||
</view>
|
||
<view class="detail">
|
||
<view class="flex">
|
||
<view class="title darkturquoise">
|
||
测算结果
|
||
</view>
|
||
</view>
|
||
<!--分数限制-->
|
||
<view class="flex" v-if='!majorArray[majorIndex].score'>
|
||
<view class="mntext marginCenter">
|
||
未收录信息
|
||
</view>
|
||
</view>
|
||
<view v-else>
|
||
<view class="flex">
|
||
<view class="mntext marginCenter">
|
||
<text v-if="majorArray[majorIndex].rulesEnrollProbability==='专过文排'">文化需达院校控线{{majorArray[majorIndex].score}}分</text>
|
||
<text v-else-if="majorArray[majorIndex].rulesEnrollProbability==='文过专排'">专业需达院校控线{{majorArray[majorIndex].score}}分</text>
|
||
<text v-else>文化及专业总分需达院校控线{{majorArray[majorIndex].score}}分</text>
|
||
</view>
|
||
</view>
|
||
<view style="border-bottom:5rpx solid #f4f4f4">
|
||
<view class="flex" style="padding:0 30rpx">
|
||
<view class="mnTitle">注:</view>
|
||
</view>
|
||
<view class="flex" style="padding:0 30rpx">
|
||
<view class="mntext">
|
||
<text>{{year}}河南文化分控线为
|
||
<text class="darkturquoise">{{ majorArray[majorIndex].culturalScore}}</text>
|
||
分
|
||
</text>
|
||
</view>
|
||
</view>
|
||
<view class="flex" style="padding:0 30rpx">
|
||
<view class="mntext">
|
||
<text>{{year}}河南专业分控线为
|
||
<text class="darkturquoise">{{ majorArray[majorIndex].specialScore}}</text>
|
||
分
|
||
</text>
|
||
</view>
|
||
</view>
|
||
</view>
|
||
<!--录取限制-->
|
||
<view style="padding: 30rpx 20rpx">
|
||
<view class="flex">
|
||
<view class="mntext2">
|
||
<text>录取方式</text>
|
||
</view>
|
||
</view>
|
||
<view class="flex">
|
||
<view class="mntext3 darkturquoise">
|
||
<text>{{ majorArray[majorIndex].rulesEnrollProbability}}</text>
|
||
</view>
|
||
</view>
|
||
<view class="flex">
|
||
<view class="mntext2">
|
||
<text>院校限制</text>
|
||
</view>
|
||
</view>
|
||
<view class="flex">
|
||
<view class="mntext3 darkturquoise">
|
||
<text>身体要求：非色盲、色弱</text>
|
||
</view>
|
||
</view>
|
||
</view>
|
||
</view>
|
||
</view>
|
||
<!--收藏按钮-->
|
||
<view class="uni-flex flex" style="margin-top: 20rpx;">
|
||
<view style="width: 50%;">
|
||
<view :class="collectFlag?'collect-active':'collect'" @click="clickCollectSchool">
|
||
<view class="uni-flex flex">
|
||
<view class="flex-item-2">
|
||
<image :src="collectFlag? ImagesConstant.loveWhile:ImagesConstant.loveDarkturquoise"
|
||
style="width: 50rpx;height: 50rpx;"/>
|
||
</view>
|
||
<view class="flex-item-7">
|
||
<text style="font-size: 30rpx;line-height: 50rpx;">收藏院校</text>
|
||
</view>
|
||
</view>
|
||
</view>
|
||
</view>
|
||
</view>
|
||
</view>
|
||
<view>
|
||
<!-- 分享示例 -->
|
||
<uni-popup ref="share" type="share" safeArea backgroundColor="#fff">
|
||
<uni-popup-share></uni-popup-share>
|
||
</uni-popup>
|
||
</view>
|
||
<!--底部固定-->
|
||
<view class="bottom">
|
||
<view class="shareBtn" open-type="share">分享给朋友一起测</view>
|
||
</view>
|
||
</template>
|
||
|
||
<style scoped lang="scss">
|
||
/*院校列表*/
|
||
.school-item {
|
||
padding: 30rpx;
|
||
background-color: white;
|
||
border-radius: 15rpx;
|
||
|
||
.other {
|
||
margin-top: 60rpx;
|
||
height: 100rpx;
|
||
}
|
||
|
||
.other .t_item {
|
||
border-right: 1rpx solid #efeaea;
|
||
height: 60rpx;
|
||
}
|
||
|
||
.t-item-b {
|
||
position: relative;
|
||
top: -30rpx;
|
||
|
||
image {
|
||
width: 80rpx;
|
||
height: 80rpx;
|
||
margin: 0 auto 10rpx auto;
|
||
}
|
||
}
|
||
|
||
.other .end {
|
||
border: none;
|
||
}
|
||
}
|
||
|
||
.majorTitle {
|
||
font-size: 35rpx;
|
||
color: #939292;
|
||
padding: 30rpx;
|
||
}
|
||
|
||
.majorName {
|
||
|
||
}
|
||
|
||
.body {
|
||
padding: 30rpx;
|
||
height: 80%;
|
||
|
||
.detail {
|
||
background-color: white;
|
||
border-radius: 30rpx;
|
||
margin-bottom: 30rpx;
|
||
/*标题*/
|
||
.title {
|
||
font-size: 40rpx;
|
||
margin: 40rpx auto 30rpx auto;
|
||
}
|
||
|
||
.mntext {
|
||
font-size: 25rpx;
|
||
color: #939292;
|
||
margin-top: 20rpx;
|
||
margin-bottom: 20rpx;
|
||
}
|
||
|
||
.mntext2 {
|
||
font-size: 30rpx;
|
||
color: #939292;
|
||
line-height: 40rpx;
|
||
}
|
||
|
||
.mntext3 {
|
||
font-size: 26rpx;
|
||
line-height: 40rpx;
|
||
}
|
||
|
||
.mnTitle {
|
||
font-size: 25rpx;
|
||
color: #939292;
|
||
}
|
||
}
|
||
}
|
||
|
||
.bottom {
|
||
position: fixed;
|
||
bottom: 0;
|
||
border-radius: 30rpx 30rpx 0 0;
|
||
height: 200rpx;
|
||
width: 100%;
|
||
background: linear-gradient(#ffffff, #f9f58f);
|
||
|
||
.shareBtn {
|
||
width: 60%;
|
||
text-align: center;
|
||
margin: 50rpx auto;
|
||
border-radius: 50rpx;
|
||
background: linear-gradient(45deg, #f9a418, #fad81d, #f9a418);
|
||
padding: 30rpx;
|
||
color: white;
|
||
font-weight: 600;
|
||
font-size: 40rpx;
|
||
font-style: italic; //字体倾斜
|
||
-webkit-animation-name: animationScale; /*关键帧名称*/
|
||
-webkit-animation-timing-function: ease-in-out; /*动画的速度曲线*/
|
||
-webkit-animation-iteration-count: infinite; /*动画播放的次数*/
|
||
-webkit-animation-duration: 4s; /*动画所花费的时间*/
|
||
}
|
||
}
|
||
|
||
.center {
|
||
text-align: center;
|
||
margin: 0 auto;
|
||
}
|
||
|
||
/*省市区*/
|
||
.adrs {
|
||
display: flex;
|
||
flex-direction: row;
|
||
flex-wrap: wrap;
|
||
margin: 0 0 0 auto;
|
||
line-height: 60rpx;
|
||
}
|
||
|
||
.address .address-item-before {
|
||
margin-left: 0 !important;
|
||
}
|
||
|
||
.address .address-item {
|
||
margin-left: 10rpx;
|
||
color: #8999a3;
|
||
font-size: 23rpx;
|
||
line-height: 40rpx;
|
||
}
|
||
|
||
/*标签*/
|
||
.tags .tag {
|
||
color: #8999a3;
|
||
font-size: 23rpx;
|
||
line-height: 40rpx;
|
||
margin-right: 10rpx;
|
||
border: 1rpx solid #52c6c6;
|
||
border-radius: 10rpx;
|
||
padding: 0 8rpx;
|
||
text-align: right;
|
||
}
|
||
|
||
|
||
.introduceBlock {
|
||
text-indent: 2em;
|
||
}
|
||
|
||
// 二
|
||
.introduceBlock::before {
|
||
content: "\2003";
|
||
}
|
||
|
||
.darkturquoise{
|
||
font-weight: 600;
|
||
}
|
||
|
||
//关注院校 按钮样式
|
||
.collect {
|
||
background-color: white;
|
||
color: darkturquoise;
|
||
height: 50rpx;
|
||
border-radius: 15rpx;
|
||
padding: 30rpx 0 30rpx 30rpx;
|
||
text-align: center
|
||
}
|
||
|
||
.collect-active {
|
||
background-color: darkturquoise;
|
||
color: white;
|
||
height: 50rpx;
|
||
border-radius: 15rpx;
|
||
padding: 30rpx 0 30rpx 30rpx;
|
||
text-align: center
|
||
}
|
||
|
||
// 动画
|
||
@keyframes animationScale {
|
||
0% {
|
||
transform: scale(1); /*开始为原始大小*/
|
||
}
|
||
25% {
|
||
transform: scale(1.1); /*放大1.1倍*/
|
||
}
|
||
50% {
|
||
transform: scale(1);
|
||
}
|
||
75% {
|
||
transform: scale(1.1);
|
||
}
|
||
}
|
||
</style>
|