|
|
@@ -0,0 +1,327 @@
|
|
|
+<template>
|
|
|
+ <view class="page1" style="background: #fff;">
|
|
|
+ <view class="" style="position: relative;height: 16px;">
|
|
|
+ <view class="top u-flex u-row-between">
|
|
|
+ <view class="u-flex" @click="change(0)">
|
|
|
+ <text :class="current==0?'new':'fen'">教材级别</text>
|
|
|
+ <image src="/static/images/down.png" style="width: 12rpx;height: 8rpx;margin-left: 8rpx;" mode="">
|
|
|
+ </image>
|
|
|
+ </view>
|
|
|
+ <view class="u-flex" @click="change(1)">
|
|
|
+ <text :class="current==1?'new':'fen'">教学层次</text>
|
|
|
+ <image src="/static/images/down.png" style="width: 12rpx;height: 8rpx;margin-left: 8rpx;" mode="">
|
|
|
+ </image>
|
|
|
+ </view>
|
|
|
+ <view class="u-flex" @click="change(2)">
|
|
|
+ <text :class="current==2?'new':'fen'">专业分类</text>
|
|
|
+ <image src="/static/images/down.png" style="width: 12rpx;height: 8rpx;margin-left: 8rpx;" mode="">
|
|
|
+ </image>
|
|
|
+ </view>
|
|
|
+ <view @click="change(3)" class="" :class="current==3?'new':'fen'">获奖教材</view>
|
|
|
+ <view @click="change(4)" :class="current==4?'new':'fen'">新书推荐</view>
|
|
|
+ </view>
|
|
|
+ <view v-show="current==0" class="absolt" v-if="onpageshow">
|
|
|
+ <div style="padding: 8rpx 28rpx 36rpx;box-sizing: border-box;display: flex;flex-wrap: wrap;">
|
|
|
+ <view :class="item1==-1?'itemb':'itema'" @click="changeitem(-1,'')">全部</view>
|
|
|
+ <view :class="item1==index?'itemb':'itema'" v-for="(item,index) in itemlist" :key="index"
|
|
|
+ @click="changeitem(index,item.id)">
|
|
|
+ {{item.title}}
|
|
|
+ </view>
|
|
|
+ </div>
|
|
|
+ <view class="u-flex u-row-between" style="padding: 20rpx 28rpx;box-sizing: border-box;">
|
|
|
+ <view class="btn1" @click="onpageshow=false">取消</view>
|
|
|
+ <view class="btn2" @click="enter">确认</view>
|
|
|
+ </view>
|
|
|
+ </view>
|
|
|
+ <view v-show="current==1" class="absolt" v-if="onpageshow">
|
|
|
+ <div style="padding: 8rpx 28rpx 36rpx;box-sizing: border-box;display: flex;flex-wrap: wrap;">
|
|
|
+ <view :class="item2==-1?'itemb':'itema'" @click="changeitem(-1,'')">全部</view>
|
|
|
+ <view :class="item2==index?'itemb':'itema'" v-for="(item,index) in itemlist" :key="index"
|
|
|
+ @click="changeitem(index,item.id)">
|
|
|
+ {{item.title}}
|
|
|
+ </view>
|
|
|
+ </div>
|
|
|
+ <view class="u-flex u-row-between" style="padding: 20rpx 28rpx;box-sizing: border-box;">
|
|
|
+ <view class="btn1" @click="onpageshow=false">取消</view>
|
|
|
+ <view class="btn2" @click="enter">确认</view>
|
|
|
+ </view>
|
|
|
+ </view>
|
|
|
+ <view v-show="current==2" class="absolt" v-if="onpageshow">
|
|
|
+ <div style="padding: 8rpx 28rpx 36rpx;box-sizing: border-box;display: flex;flex-wrap: wrap;">
|
|
|
+ <view :class="item3==-1?'itemb':'itema'" @click="changeitem(-1,'')">全部</view>
|
|
|
+ <view :class="item3==index?'itemb':'itema'" v-for="(item,index) in itemlist" :key="index"
|
|
|
+ @click="changeitem(index,item.id)">
|
|
|
+ {{item.title}}
|
|
|
+ </view>
|
|
|
+ </div>
|
|
|
+ <view class="u-flex u-row-between" style="padding: 20rpx 28rpx;box-sizing: border-box;">
|
|
|
+ <view class="btn1" @click="onpageshow=false">取消</view>
|
|
|
+ <view class="btn2" @click="enter">确认</view>
|
|
|
+ </view>
|
|
|
+ </view>
|
|
|
+ </view>
|
|
|
+ <scroll-view :scroll-y='true' style="height: calc(100vh - 200px);">
|
|
|
+ <view class="u-flex u-row-between u-flex-wrap">
|
|
|
+ <view class="" @click="toinfo(item.id)" v-for="(item,index) in paperlist" :key="index"
|
|
|
+ style="margin-top: 26rpx;display: inline-block;">
|
|
|
+ <image :src="item.image" style="width: 334rpx;height: 460rpx;" mode=""></image>
|
|
|
+ <view class="title u-line-1">{{item.title}}…</view>
|
|
|
+ <view class="writer u-line-1">{{item.author}}</view>
|
|
|
+ <view class="" style="margin-top: 8rpx;">
|
|
|
+ <text class="ding">定价</text>
|
|
|
+ <text class="money">¥{{item.entity_price}}</text>
|
|
|
+ </view>
|
|
|
+ </view>
|
|
|
+ </view>
|
|
|
+ </scroll-view>
|
|
|
+ </view>
|
|
|
+</template>
|
|
|
+
|
|
|
+<script>
|
|
|
+ export default {
|
|
|
+ data() {
|
|
|
+ return {
|
|
|
+ level_id: '',
|
|
|
+ arrangement_id: '',
|
|
|
+ speciality_id: "",
|
|
|
+ book_type: 1,
|
|
|
+ is_new_recommend: '',
|
|
|
+ is_awards: '',
|
|
|
+ page: 1,
|
|
|
+ limit: 10,
|
|
|
+ current: 0,
|
|
|
+ paperlist: [],
|
|
|
+ itemlist: [],
|
|
|
+ item1: -1,
|
|
|
+ onpageshow: false,
|
|
|
+ itemid: '',
|
|
|
+ item2:-1,
|
|
|
+ item3:-1,
|
|
|
+ itemlist1:[],
|
|
|
+ itemlist2:[]
|
|
|
+ };
|
|
|
+ },
|
|
|
+ created(options) {
|
|
|
+ //新书
|
|
|
+ this.getBooksList()
|
|
|
+ this.getBooksLevel()
|
|
|
+ this.getBooksSpeciality()
|
|
|
+ this.getBooksArrangement()
|
|
|
+ },
|
|
|
+ methods: {
|
|
|
+ toinfo(id) {
|
|
|
+ uni.navigateTo({
|
|
|
+ url: '/pages/index/bookinfo?id=' + id
|
|
|
+ })
|
|
|
+ },
|
|
|
+ //确定
|
|
|
+ enter() {
|
|
|
+ this.onpageshow = false
|
|
|
+ this.getBooksList()
|
|
|
+ },
|
|
|
+ changeitem(index, id) {
|
|
|
+ if (this.current == 0) {
|
|
|
+ this.level_id = id
|
|
|
+ this.item1 = index
|
|
|
+ }
|
|
|
+ if (this.current == 1) {
|
|
|
+ this.arrangement_id = id
|
|
|
+ this.item2 = index
|
|
|
+ }
|
|
|
+
|
|
|
+ if (this.current == 2) {
|
|
|
+ this.speciality_id = id
|
|
|
+ this.item3 = index
|
|
|
+ }
|
|
|
+ },
|
|
|
+ //级别
|
|
|
+ getBooksLevel() {
|
|
|
+ this.$u.post('api/books/getBooksLevel', {}).then(res => {
|
|
|
+ this.itemlist = res.data
|
|
|
+ })
|
|
|
+ },
|
|
|
+ getBooksArrangement() {
|
|
|
+ this.$u.post('api/books/getBooksArrangement', {}).then(res => {
|
|
|
+ this.itemlist1 = res.data
|
|
|
+ })
|
|
|
+ },
|
|
|
+ getBooksSpeciality() {
|
|
|
+ this.$u.post('api/books/getBooksSpeciality', {}).then(res => {
|
|
|
+ this.itemlist2 = res.data
|
|
|
+ })
|
|
|
+ },
|
|
|
+ change(index) {
|
|
|
+ this.onpageshow = true
|
|
|
+ this.current = index
|
|
|
+ this.is_new_recommend = ''
|
|
|
+ this.is_awards = ''
|
|
|
+ this.getBooksList()
|
|
|
+ if (this.current == 0) {
|
|
|
+ this.getBooksLevel()
|
|
|
+ }
|
|
|
+ if (this.current == 1) {
|
|
|
+ this.itemlist = this.itemlist1
|
|
|
+ }
|
|
|
+ if (this.current == 2) {
|
|
|
+ this.itemlist = this.itemlist2
|
|
|
+ }
|
|
|
+ },
|
|
|
+ getBooksList() {
|
|
|
+ if (this.current == 4) {
|
|
|
+ this.is_new_recommend = 0
|
|
|
+ this.onpageshow = false
|
|
|
+ }
|
|
|
+ if (this.current == 3) {
|
|
|
+ this.is_awards = 0
|
|
|
+ this.onpageshow = false
|
|
|
+ }
|
|
|
+ this.$u.post('api/books/getBooksList', {
|
|
|
+ level_id: this.level_id,
|
|
|
+ arrangement_id: this.arrangement_id,
|
|
|
+ speciality_id: this.speciality_id,
|
|
|
+ book_type: this.book_type,
|
|
|
+ is_new_recommend: this.is_new_recommend,
|
|
|
+ is_awards: this.is_awards,
|
|
|
+ page: this.page,
|
|
|
+ limit: this.limit
|
|
|
+ }).then(res => {
|
|
|
+ console.log('list', res);
|
|
|
+ this.paperlist = res.data.data
|
|
|
+ })
|
|
|
+ }
|
|
|
+ },
|
|
|
+ }
|
|
|
+</script>
|
|
|
+
|
|
|
+<style lang="scss">
|
|
|
+ .itema {
|
|
|
+ height: 60rpx;
|
|
|
+ border-radius: 8rpx;
|
|
|
+ border: 1rpx solid rgba(151, 151, 151, 1);
|
|
|
+ font-size: 26rpx;
|
|
|
+ font-family: PingFangSC, PingFang SC;
|
|
|
+ font-weight: 400;
|
|
|
+ color: #444444;
|
|
|
+ margin-right: 24rpx;
|
|
|
+ line-height: 60rpx;
|
|
|
+ text-align: center;
|
|
|
+ padding: 0 27rpx;
|
|
|
+ box-sizing: border-box;
|
|
|
+ margin-top: 20rpx;
|
|
|
+ }
|
|
|
+
|
|
|
+ .itemb {
|
|
|
+ height: 60rpx;
|
|
|
+ border-radius: 8rpx;
|
|
|
+ border: 1rpx solid rgba(6, 169, 113, 0.1);
|
|
|
+ background: rgba(6, 169, 113, 0.1);
|
|
|
+ font-size: 26rpx;
|
|
|
+ font-family: PingFangSC, PingFang SC;
|
|
|
+ font-weight: 400;
|
|
|
+ color: #06A971;
|
|
|
+ margin-right: 24rpx;
|
|
|
+ line-height: 60rpx;
|
|
|
+ text-align: center;
|
|
|
+ padding: 0 27rpx;
|
|
|
+ margin-top: 20rpx;
|
|
|
+ }
|
|
|
+
|
|
|
+ .btn1 {
|
|
|
+ width: 260rpx;
|
|
|
+ height: 76rpx;
|
|
|
+ background: #F3F3F3;
|
|
|
+ border-radius: 12rpx;
|
|
|
+ line-height: 76rpx;
|
|
|
+ text-align: center;
|
|
|
+ font-size: 28rpx;
|
|
|
+ font-family: PingFangSC, PingFang SC;
|
|
|
+ font-weight: 400;
|
|
|
+ color: #333333;
|
|
|
+
|
|
|
+ }
|
|
|
+
|
|
|
+ .btn2 {
|
|
|
+ width: 402rpx;
|
|
|
+ height: 76rpx;
|
|
|
+ background: #06A971;
|
|
|
+ border-radius: 12rpx;
|
|
|
+ line-height: 76rpx;
|
|
|
+ text-align: center;
|
|
|
+ font-size: 28rpx;
|
|
|
+ font-family: PingFangSC, PingFang SC;
|
|
|
+ font-weight: 400;
|
|
|
+ color: #FFFFFF;
|
|
|
+ }
|
|
|
+
|
|
|
+ .absolt {
|
|
|
+ display: flex;
|
|
|
+ flex-direction: column;
|
|
|
+ justify-content: space-between;
|
|
|
+ position: absolute;
|
|
|
+ top: 30rpx;
|
|
|
+ left: -24rpx;
|
|
|
+ // height: 300rpx;
|
|
|
+ box-sizing: border-box;
|
|
|
+ background: #FFFFFF;
|
|
|
+ border-radius: 0rpx 0rpx 20rpx 20rpx;
|
|
|
+ width: 750rpx;
|
|
|
+ z-index: 100;
|
|
|
+ }
|
|
|
+
|
|
|
+ .title {
|
|
|
+ font-size: 28rpx;
|
|
|
+ font-family: PingFangSC, PingFang SC;
|
|
|
+ font-weight: 500;
|
|
|
+ color: #333333;
|
|
|
+ margin-top: 20rpx;
|
|
|
+ width: 334rpx;
|
|
|
+ }
|
|
|
+
|
|
|
+ .writer {
|
|
|
+ font-size: 24rpx;
|
|
|
+ font-family: PingFangSC, PingFang SC;
|
|
|
+ font-weight: 400;
|
|
|
+ color: #444444;
|
|
|
+ margin-top: 8rpx;
|
|
|
+ width: 334rpx;
|
|
|
+ }
|
|
|
+
|
|
|
+ .money {
|
|
|
+ font-size: 28rpx;
|
|
|
+ font-family: SFPro, SFPro;
|
|
|
+ font-weight: 400;
|
|
|
+ color: #CC3300;
|
|
|
+ }
|
|
|
+
|
|
|
+ .ding {
|
|
|
+ font-size: 24rpx;
|
|
|
+ font-family: PingFangSC, PingFang SC;
|
|
|
+ font-weight: 400;
|
|
|
+ color: #222222;
|
|
|
+ }
|
|
|
+
|
|
|
+ .page1 {
|
|
|
+ width: 750rpx;
|
|
|
+ background: #FFFFFF;
|
|
|
+ border-radius: 28rpx 28rpx 0rpx 0rpx;
|
|
|
+ padding: 28rpx 24rpx;
|
|
|
+ // height: 70vh;
|
|
|
+ height: 75.5vh;
|
|
|
+ }
|
|
|
+
|
|
|
+ .top {
|
|
|
+ .fen {
|
|
|
+ font-size: 24rpx;
|
|
|
+ font-family: PingFangSC, PingFang SC;
|
|
|
+ font-weight: 400;
|
|
|
+ color: #444444;
|
|
|
+ }
|
|
|
+
|
|
|
+ .new {
|
|
|
+ font-size: 24rpx;
|
|
|
+ font-family: PingFangSC, PingFang SC;
|
|
|
+ font-weight: 500;
|
|
|
+ color: #06A971;
|
|
|
+ }
|
|
|
+ }
|
|
|
+</style>
|
zhaogongxue
