<template>
|
<div class="applyPage">
|
<div class="topBox">
|
<van-nav-bar
|
title="我的申请"
|
left-text=""
|
right-text=""
|
left-arrow
|
@click-left="onClickLeft"
|
/>
|
<div class="tips">
|
如您在教材试用申请过程中遇到问题,请于工作时间联系我们。<span>
|
QQ号:3565269931 / 咨询电话010-65778403(工作时间:9:00~17:00)</span
|
>
|
</div>
|
</div>
|
<!-- 列表 -->
|
<div class="listBox">
|
<p class="line"></p>
|
<van-pull-refresh
|
class="refreshBox"
|
v-model="refreshing"
|
@refresh="onRefresh"
|
>
|
<van-list
|
v-model="loading"
|
:finished="finished"
|
:finished-text="finishedtext"
|
@load="onLoad"
|
>
|
<div class="collectBox">
|
<div v-if="dataList && dataList.length > 0">
|
<div v-for="(item, index) in dataList" :key="index" class="list">
|
<div class="infor">
|
<div class="infoBox">
|
<div>
|
审核状态:
|
<span
|
:class="{
|
reviewstatus: true,
|
reviewstatusRed: item.state == 'Reject',
|
reviewstatusWait: item.state == 'WaitAudit'
|
}"
|
>{{
|
item.state == "WaitAudit"
|
? "审核中"
|
: item.state == "Normal"
|
? "通过"
|
: "拒绝"
|
}}</span
|
>
|
</div>
|
|
<div style="color: orangered" v-if="item.isExpiry">
|
阅读期限:<span>已过期</span>
|
</div>
|
<div class="time">申请时间:{{ item.updateDate }}</div>
|
</div>
|
<div
|
style="color: orangered"
|
class="reasonForFailure"
|
v-if="
|
item.state == 'Normal' && item.feedBack && !item.isExpiry
|
"
|
>
|
试用期限:<span>{{ item.updateDate }}</span> --
|
<span>{{ item.feedBack.endDate }}</span>
|
</div>
|
<div
|
class="reasonForFailure"
|
style="margin: 10px 0"
|
v-if="item.state == 'Reject'"
|
>
|
<div class="centerVertically">未通过原因:</div>
|
<div
|
style="flex: 1"
|
:title="
|
item.feedBack.reason ? item.feedBack.reason : ' - '
|
"
|
>
|
{{ item.feedBack.reason ? item.feedBack.reason : " - " }}
|
</div>
|
</div>
|
</div>
|
<div class="bookContent" @click="gotoDetails(item, index)">
|
<img :src="item.content.icon" alt="" class="bookImg" />
|
<div class="centerContent">
|
<p class="bookName">{{ item.content.name }}</p>
|
<p class="sameTitle">
|
作者 :
|
{{
|
item.content.tourism_author
|
? item.content.tourism_author
|
: "-"
|
}}
|
</p>
|
</div>
|
</div>
|
</div>
|
</div>
|
</div>
|
</van-list>
|
</van-pull-refresh>
|
</div>
|
</div>
|
</template>
|
|
<script>
|
import { mapState } from "vuex";
|
import { getPublicImage } from "@/assets/js/middleGround/tool";
|
export default {
|
data() {
|
return {
|
refreshing: false,
|
loading: false,
|
finished: false,
|
finishedtext: "",
|
dataList: [],
|
paginationData: {
|
page: 1,
|
limit: 10,
|
totalCount: 0,
|
totalPage: 0
|
}
|
};
|
},
|
computed: {
|
...mapState(["userInfo"])
|
},
|
created() {
|
this.getdataList();
|
},
|
methods: {
|
onRefresh() {
|
// 清空列表数据
|
this.paginationData.page = 1;
|
this.finished = false;
|
this.loading = true;
|
this.refreshing = false;
|
this.getdataList(true);
|
},
|
onLoad() {
|
this.getdataList();
|
},
|
//获取列表
|
getdataList(isLode) {
|
var that = this;
|
this.finished = false;
|
this.loading = true;
|
this.finishedtext = "加载中";
|
let { page, limit } = this.paginationData;
|
const data = {
|
start: limit * page - limit,
|
size: limit,
|
topicIdOrRefCode: "applyDigitalBook",
|
appRefCode: "tourismWebsite",
|
sort: {
|
type: "Desc",
|
field: "CreateDate"
|
},
|
coverSize: {
|
width: 880
|
}
|
|
};
|
this.MG.ugc.getTopicMessageList(data).then(res => {
|
res.datas.forEach(item => {
|
item.icon = item.icon ? item.icon : getPublicImage(null);
|
item.updateDate = item.updateDate.split("T")[0];
|
if (item.feedBack) {
|
item.feedBack = JSON.parse(item.feedBack);
|
if (item.feedBack.endDate) {
|
let times = new Date(
|
item.feedBack.endDate + " 23:59:59"
|
).getTime();
|
if (times < sessionStorage.currentDate) {
|
item.isExpiry = true;
|
}
|
}
|
}
|
if (item.content) {
|
item.content = JSON.parse(item.content);
|
}
|
});
|
|
if (isLode) {
|
that.dataList = res.datas;
|
} else {
|
that.dataList = [...that.dataList, ...res.datas];
|
}
|
console.log(that.dataList);
|
//分页
|
that.paginationData.totalCount = res.totalSize;
|
if (res.totalSize > that.paginationData.limit) {
|
that.paginationData.totalPage = parseInt(
|
res.totalSize / that.paginationData.limit
|
);
|
if (res.totalSize % that.paginationData.limit > 0) {
|
that.paginationData.totalPage++;
|
}
|
} else {
|
that.paginationData.totalPage = 1;
|
}
|
that.sum = Number(Math.ceil(res.totalSize / this.paginationData.limit));
|
// 加载状态结束
|
that.loading = false;
|
that.refreshing = false;
|
if (that.paginationData.page == this.sum) {
|
that.finished = true;
|
that.finishedtext = "没有更多了";
|
return false;
|
}
|
if (that.dataList.length < 1) {
|
that.loading = false;
|
that.finished = true;
|
that.finishedtext = "暂无数据";
|
}
|
that.paginationData.page++;
|
});
|
},
|
|
gotoDetails(item) {
|
this.$router.push({
|
path: "/bookDetail",
|
query: {
|
shopId: item.id
|
}
|
});
|
},
|
onClickLeft() {
|
var that = this;
|
that.$router.go(-1);
|
}
|
},
|
|
};
|
</script>
|
|
<style scoped>
|
.tips {
|
padding: 15px;
|
}
|
.tips span {
|
color: #2b68cd;
|
}
|
.refreshBox {
|
flex: 1;
|
overflow: auto;
|
}
|
.collectBox {
|
padding: 0 15px;
|
}
|
|
.line {
|
height: 5px;
|
background-color: #eee;
|
}
|
.listBox {
|
height: 100%;
|
box-sizing: border-box;
|
display: flex;
|
flex-direction: column;
|
}
|
/* 列表 */
|
.list {
|
padding: 15px 0 15px 0;
|
border-bottom: 1px solid #e8e8e8;
|
}
|
.infoBox {
|
line-height: 30px;
|
display: flex;
|
justify-content: space-between;
|
align-items: center;
|
}
|
|
.time {
|
color: #999;
|
}
|
.reviewstatus {
|
color: #0bc266;
|
}
|
.reviewstatusWait {
|
color: #ffbe00;
|
}
|
.reviewstatusRed {
|
color: red;
|
}
|
|
.reasonForFailure {
|
display: flex;
|
line-height: 30px;
|
}
|
|
.centerVertically {
|
width: 80px;
|
}
|
|
.bookContent {
|
display: flex;
|
margin-top: 10px;
|
}
|
|
.bookImg {
|
width: 75px;
|
height: 100px;
|
display: inline-block;
|
box-shadow: 0 3px 6px 1px #00000029;
|
}
|
|
.centerContent {
|
margin-left: 14px;
|
}
|
|
.bookName {
|
color: #333333;
|
font-size: 14px;
|
}
|
|
.sameTitle {
|
margin: 4px 0 5px 0;
|
color: #999;
|
}
|
</style>
|