21 changed files with 1834 additions and 1097 deletions
-
72api/book.js
-
8components/book-list-item/book-list-item.vue
-
111components/lending-list-item/lending-list-item.vue
-
6pages.json
-
35pages/home/home.vue
-
273pages/lendCar/lendCar copy.vue
-
293pages/lendCar/lendCar.vue
-
279pages/search/search.vue
-
1pages/user/user.vue
-
4static/iconfont.css
-
BINstatic/iconfont.ttf
-
BINstatic/images/default-book.png
-
157subpkg/pages/activity-list/activity-list copy.vue
-
125subpkg/pages/activity-list/activity-list.vue
-
204subpkg/pages/book-detail/book-detail.vue
-
8subpkg/pages/book-list/book-list.vue
-
76subpkg/pages/feedback-list/feedback-list.vue
-
335subpkg/pages/myLending/myLending copy.vue
-
538subpkg/pages/myLending/myLending.vue
-
217subpkg/pages/ranking/ranking.vue
-
189subpkg/pages/unbind-card/unbind-card.vue
@ -0,0 +1,273 @@ |
|||||
|
<template> |
||||
|
<view class="item-container"> |
||||
|
<!-- 图书数量 + 右侧设置按钮 --> |
||||
|
<view class="count-text"> |
||||
|
<text>图书数量 ({{ bookList.length }})</text> |
||||
|
<text class="edit-btn" @click="toggleEdit">{{ editMode ? "完成" : "管理" }}</text> |
||||
|
</view> |
||||
|
|
||||
|
<checkbox-group @change="checkboxChange"> |
||||
|
<view class="car-list" v-for="item in bookList" :key="item.isbn"> |
||||
|
<checkbox :value="item.isbn" :checked="item.checked" /> |
||||
|
<view class="book-item-box"> |
||||
|
<view class="item-box-left"> |
||||
|
<image class="img-item" :src="defaultCover" mode="aspectFill" /> |
||||
|
</view> |
||||
|
<view class="item-box-right"> |
||||
|
<view class="item-title line-clamp-2">{{ item.title || '暂无标题' }}</view> |
||||
|
<view class="tag-box"> |
||||
|
<text class="item-author">{{ item.author || '佚名' }}</text> |
||||
|
</view> |
||||
|
<view class="item-desc"> |
||||
|
应还时间：{{ item.returndate || '暂无' }} |
||||
|
</view> |
||||
|
</view> |
||||
|
</view> |
||||
|
</view> |
||||
|
</checkbox-group> |
||||
|
|
||||
|
<view class="bottom-placeholder"></view> |
||||
|
|
||||
|
<view class="car-bottom"> |
||||
|
<!-- 全选 --> |
||||
|
<view class="all-check" @click="handleAllCheck"> |
||||
|
<checkbox :checked="isAllChecked" /> |
||||
|
<text style="margin-left:6px">全选</text> |
||||
|
</view> |
||||
|
|
||||
|
<!-- 根据编辑状态切换按钮：续借 / 删除 --> |
||||
|
<button |
||||
|
class="join-btn" |
||||
|
@click="editMode ? handleDelete() : handleRenew()" |
||||
|
:disabled="!hasChecked" |
||||
|
> |
||||
|
{{ editMode ? "删除选中" : "一键续借" }} |
||||
|
</button> |
||||
|
</view> |
||||
|
</view> |
||||
|
</template> |
||||
|
|
||||
|
<script> |
||||
|
import { FetchInitScreenSetting } from '@/api/user'; |
||||
|
import { FetchRdloanlist, FetchRenewbook } from '@/api/book'; |
||||
|
|
||||
|
export default { |
||||
|
data() { |
||||
|
return { |
||||
|
editMode: false, |
||||
|
bookList: [], |
||||
|
defaultCover: 'https://qiniu.aiyxlib.com/1606124577077', |
||||
|
screenConfig: {}, |
||||
|
// 用数组维护选中项（更稳定） |
||||
|
checkedValues: [] |
||||
|
}; |
||||
|
}, |
||||
|
onLoad() { |
||||
|
this.getConfigAndList(); |
||||
|
}, |
||||
|
computed: { |
||||
|
isAllChecked() { |
||||
|
return this.bookList.length > 0 && this.checkedValues.length === this.bookList.length; |
||||
|
}, |
||||
|
hasChecked() { |
||||
|
return this.checkedValues.length > 0; |
||||
|
} |
||||
|
}, |
||||
|
methods: { |
||||
|
async getConfigAndList() { |
||||
|
try { |
||||
|
const res = await FetchInitScreenSetting({ libcode: '1201' }); |
||||
|
this.screenConfig = { |
||||
|
thirdUrl: res.data.open_lib_http?.context || '', |
||||
|
thirdAppid: res.data.open_lib_appId?.context || '', |
||||
|
thirdSecret: res.data.open_lib_secret?.context || '', |
||||
|
sm4Key: res.data.sm4_key?.context || '' |
||||
|
}; |
||||
|
this.getLendingList(); |
||||
|
} catch (err) {} |
||||
|
}, |
||||
|
|
||||
|
async getLendingList() { |
||||
|
try { |
||||
|
const params = { |
||||
|
...this.screenConfig, |
||||
|
rdid: uni.getStorageSync('currentReaderCard'), |
||||
|
}; |
||||
|
const res = await FetchRdloanlist(params); |
||||
|
const result = typeof res.data === 'string' ? JSON.parse(res.data) : res.data; |
||||
|
this.bookList = result.loanlist || []; |
||||
|
// 切换列表时清空选中 |
||||
|
this.checkedValues = []; |
||||
|
} catch (err) { |
||||
|
uni.showToast({ title: '加载失败', icon: 'none' }); |
||||
|
} |
||||
|
}, |
||||
|
|
||||
|
toggleEdit() { |
||||
|
this.editMode = !this.editMode; |
||||
|
if (!this.editMode) { |
||||
|
this.checkedValues = []; |
||||
|
} |
||||
|
}, |
||||
|
|
||||
|
// ✅ 修复2：稳定的 checkbox 变更 |
||||
|
checkboxChange(e) { |
||||
|
// 直接保存数组（字符串类型） |
||||
|
this.checkedValues = e.detail.value; |
||||
|
}, |
||||
|
|
||||
|
handleAllCheck() { |
||||
|
if (this.isAllChecked) { |
||||
|
// 取消全选 |
||||
|
this.checkedValues = []; |
||||
|
} else { |
||||
|
// 全选：把所有 isbn 转字符串放进数组 |
||||
|
this.checkedValues = this.bookList.map(item => String(item.isbn)); |
||||
|
} |
||||
|
}, |
||||
|
|
||||
|
async handleRenew() { |
||||
|
// 从 checkedValues 过滤出对应图书 |
||||
|
const checkedBooks = this.bookList.filter(item => |
||||
|
this.checkedValues.includes(String(item.isbn)) |
||||
|
); |
||||
|
|
||||
|
if (checkedBooks.length === 0) { |
||||
|
uni.showToast({ title: '请选择要续借的图书', icon: 'none' }); |
||||
|
return; |
||||
|
} |
||||
|
|
||||
|
const barcodes = checkedBooks.map(item => item.barcode).join('|'); |
||||
|
uni.showLoading({ title: '续借中...' }); |
||||
|
|
||||
|
try { |
||||
|
const params = { |
||||
|
...this.screenConfig, |
||||
|
rdid: uni.getStorageSync('currentReaderCard'), |
||||
|
barcode: barcodes, |
||||
|
logtype: '30007' |
||||
|
}; |
||||
|
console.log('续借参数', params); |
||||
|
await FetchRenewbook(params); |
||||
|
|
||||
|
uni.hideLoading(); |
||||
|
uni.showToast({ |
||||
|
title: `成功续借 ${checkedBooks.length} 本`, |
||||
|
icon: 'success' |
||||
|
}); |
||||
|
this.getLendingList(); |
||||
|
} catch (err) { |
||||
|
uni.hideLoading(); |
||||
|
uni.showToast({ title: '续借失败', icon: 'none' }); |
||||
|
} |
||||
|
}, |
||||
|
|
||||
|
handleDelete() { |
||||
|
// 只保留未选中的 |
||||
|
this.bookList = this.bookList.filter(item => |
||||
|
!this.checkedValues.includes(String(item.isbn)) |
||||
|
); |
||||
|
uni.showToast({ |
||||
|
title: `已删除 ${this.checkedValues.length} 本`, |
||||
|
icon: "success" |
||||
|
}); |
||||
|
this.checkedValues = []; |
||||
|
this.editMode = false; |
||||
|
} |
||||
|
} |
||||
|
}; |
||||
|
</script> |
||||
|
|
||||
|
<style lang="scss" scss> |
||||
|
.item-container { |
||||
|
padding: 10px; |
||||
|
background: #f5f6f7; |
||||
|
min-height: 100vh; |
||||
|
} |
||||
|
.count-text { |
||||
|
margin-bottom: 10px; |
||||
|
display: flex; |
||||
|
justify-content: space-between; |
||||
|
align-items: center; |
||||
|
} |
||||
|
.edit-btn { |
||||
|
color: #01a4fe; |
||||
|
font-size: 14px; |
||||
|
} |
||||
|
.car-list { |
||||
|
display: flex; |
||||
|
align-items: flex-start; |
||||
|
margin-bottom: 10px; |
||||
|
checkbox { |
||||
|
margin-top: 15px; |
||||
|
padding: 0 10px; |
||||
|
} |
||||
|
} |
||||
|
.book-item-box { |
||||
|
flex: 1; |
||||
|
background: #fff; |
||||
|
border-radius: 8px; |
||||
|
padding: 12px; |
||||
|
display: flex; |
||||
|
.item-box-left { |
||||
|
margin-right: 12px; |
||||
|
.img-item { |
||||
|
width: 64px; |
||||
|
height: 90px; |
||||
|
border-radius: 6px; |
||||
|
} |
||||
|
} |
||||
|
.item-box-right { |
||||
|
flex: 1; |
||||
|
} |
||||
|
.item-title { |
||||
|
font-weight: bold; |
||||
|
margin-bottom: 4px; |
||||
|
} |
||||
|
.item-author { |
||||
|
font-size: 12px; |
||||
|
background: #f4f6fc; |
||||
|
padding: 2px 6px; |
||||
|
border-radius: 4px; |
||||
|
margin-right: 6px; |
||||
|
} |
||||
|
.item-desc { |
||||
|
font-size: 12px; |
||||
|
color: #999; |
||||
|
margin-top: 6px; |
||||
|
} |
||||
|
} |
||||
|
.bottom-placeholder { |
||||
|
height: 60px; |
||||
|
} |
||||
|
.car-bottom { |
||||
|
position: fixed; |
||||
|
left: 0; |
||||
|
bottom: 0; |
||||
|
right: 0; |
||||
|
background: #fff; |
||||
|
padding: 12px 15px; |
||||
|
display: flex; |
||||
|
justify-content: space-between; |
||||
|
align-items: center; |
||||
|
box-shadow: 0 -2px 5px rgba(0, 0, 0, 0.05); |
||||
|
} |
||||
|
.all-check { |
||||
|
display: flex; |
||||
|
align-items: center; |
||||
|
} |
||||
|
.join-btn { |
||||
|
font-size: 14px; |
||||
|
color: #fff; |
||||
|
margin: 0 !important; |
||||
|
background-color: #01a4fe !important; |
||||
|
border-radius: 23px; |
||||
|
padding: 0 30px; |
||||
|
&::after{ |
||||
|
border: none !important; |
||||
|
} |
||||
|
&[disabled] { |
||||
|
background: #ccc !important; |
||||
|
} |
||||
|
} |
||||
|
</style> |
||||
|
After Width: 756 | Height: 1063 | Size: 8.1 KiB |
@ -0,0 +1,157 @@ |
|||||
|
<template> |
||||
|
<view class="activity-list"> |
||||
|
<!-- 下拉刷新区域 --> |
||||
|
<scroll-view |
||||
|
scroll-y |
||||
|
refresher-enabled |
||||
|
:refresher-triggered="refreshing" |
||||
|
@refresherrefresh="onRefresh" |
||||
|
@scrolltolower="onLoadMore" |
||||
|
lower-threshold="100" |
||||
|
> |
||||
|
<view class="activity-item" v-for="(item, index) in activityList" @click="toActivityDetail(item)" :key="index"> |
||||
|
<image class="activity-img" :src="item.imgUrl"></image> |
||||
|
<view class="activity-info"> |
||||
|
<view class="activity-info-left"> |
||||
|
<text class="title">{{ item.title }}</text> |
||||
|
<view class="time"> |
||||
|
<uni-icons class="time-icon" custom-prefix="iconfont" type="icon-shijian" size="15"></uni-icons> |
||||
|
<text>{{ item.time }}</text> |
||||
|
</view> |
||||
|
</view> |
||||
|
<button |
||||
|
class="activity-btn" |
||||
|
:class="item.status === 0 ? 'disabled-btn' : ''" |
||||
|
type="primary" |
||||
|
:disabled="item.status === 0" |
||||
|
> |
||||
|
{{ item.status === 1 ? '立即参加' : '活动结束' }} |
||||
|
</button> |
||||
|
</view> |
||||
|
</view> |
||||
|
|
||||
|
<!-- 加载提示 --> |
||||
|
<view class="load-tip" v-if="loading"> |
||||
|
<text>加载中...</text> |
||||
|
</view> |
||||
|
<view class="load-tip" v-if="noMore"> |
||||
|
<text>没有更多数据了</text> |
||||
|
</view> |
||||
|
</scroll-view> |
||||
|
</view> |
||||
|
</template> |
||||
|
|
||||
|
<script> |
||||
|
export default { |
||||
|
data() { |
||||
|
return { |
||||
|
activityList: [], // 活动列表数据 |
||||
|
refreshing: false, // 下拉刷新状态 |
||||
|
loading: false, // 加载中 |
||||
|
noMore: false, // 是否没有更多数据 |
||||
|
page: 1, // 当前页码 |
||||
|
pageSize: 5, // 每页条数 |
||||
|
total: 20, // 模拟总数据量 |
||||
|
}; |
||||
|
}, |
||||
|
onLoad() { |
||||
|
// 页面加载时获取第一页数据 |
||||
|
this.getActivityList(); |
||||
|
}, |
||||
|
methods: { |
||||
|
/** |
||||
|
* 模拟请求活动列表接口 |
||||
|
* @param {Number} page 页码 |
||||
|
* @param {Number} pageSize 每页条数 |
||||
|
*/ |
||||
|
getActivityList() { |
||||
|
this.loading = true; |
||||
|
|
||||
|
// 模拟网络请求延迟 |
||||
|
setTimeout(() => { |
||||
|
// 生成模拟数据 |
||||
|
const list = this.mockData(this.page, this.pageSize); |
||||
|
|
||||
|
// 下拉刷新：直接替换数据 |
||||
|
if (this.refreshing) { |
||||
|
this.activityList = list; |
||||
|
this.refreshing = false; |
||||
|
} else { |
||||
|
// 上拉加载：追加数据 |
||||
|
this.activityList = [...this.activityList, ...list]; |
||||
|
} |
||||
|
|
||||
|
// 判断是否还有更多数据 |
||||
|
if (this.activityList.length >= this.total) { |
||||
|
this.noMore = true; |
||||
|
} else { |
||||
|
this.noMore = false; |
||||
|
} |
||||
|
|
||||
|
this.loading = false; |
||||
|
}, 1000); |
||||
|
}, |
||||
|
|
||||
|
/** |
||||
|
* 模拟生成活动数据 |
||||
|
*/ |
||||
|
mockData(page, pageSize) { |
||||
|
let arr = []; |
||||
|
for (let i = 0; i < pageSize; i++) { |
||||
|
const num = (page - 1) * pageSize + i + 1; |
||||
|
arr.push({ |
||||
|
imgUrl: "https://qiniu.aiyxlib.com/1605060269830", |
||||
|
title: `活动标题${num}`, |
||||
|
time: "2025-11-03 00:00 ~2025-11-09 00:00", |
||||
|
status: num % 3 === 0 ? 0 : 1, // 0=结束 1=可参加 |
||||
|
}); |
||||
|
} |
||||
|
return arr; |
||||
|
}, |
||||
|
|
||||
|
/** |
||||
|
* 下拉刷新 |
||||
|
*/ |
||||
|
onRefresh() { |
||||
|
// 重置状态 |
||||
|
this.page = 1; |
||||
|
this.noMore = false; |
||||
|
this.refreshing = true; |
||||
|
this.getActivityList(); |
||||
|
}, |
||||
|
|
||||
|
/** |
||||
|
* 上拉加载更多 |
||||
|
*/ |
||||
|
onLoadMore() { |
||||
|
if (this.loading || this.noMore) return; |
||||
|
this.page++; |
||||
|
this.getActivityList(); |
||||
|
}, |
||||
|
toActivityDetail(item){ |
||||
|
uni.navigateTo({ |
||||
|
url: "/subpkg/pages/activity-detail/activity-detail?title=" + item.title |
||||
|
}) |
||||
|
} |
||||
|
}, |
||||
|
}; |
||||
|
</script> |
||||
|
|
||||
|
<style lang="scss" scoped> |
||||
|
.activity-list { |
||||
|
padding: 20px; |
||||
|
height: 100vh; |
||||
|
box-sizing: border-box; |
||||
|
} |
||||
|
|
||||
|
scroll-view { |
||||
|
height: 100%; |
||||
|
} |
||||
|
|
||||
|
.load-tip { |
||||
|
text-align: center; |
||||
|
padding: 20px; |
||||
|
color: #999; |
||||
|
font-size: 14px; |
||||
|
} |
||||
|
</style> |
||||
@ -0,0 +1,335 @@ |
|||||
|
<template> |
||||
|
<view class="lending-container"> |
||||
|
<view class="tab-sticky"> |
||||
|
<my-tabs |
||||
|
:tabData="tabData" |
||||
|
:defaultIndex="currentIndex" |
||||
|
:config="{ textColor: '#333' }" |
||||
|
@tabClick="tabClick" |
||||
|
/> |
||||
|
</view> |
||||
|
|
||||
|
<swiper |
||||
|
class="swiper" |
||||
|
:current="currentIndex" |
||||
|
:style="{ height: currentSwiperHeight + 'px' }" |
||||
|
@animationfinish="onSwiperEnd" |
||||
|
@change="onSwiperChange" |
||||
|
> |
||||
|
<swiper-item v-for="(tabItem, idx) in tabData" :key="idx"> |
||||
|
<view class="list-wrapper"> |
||||
|
<!-- 首次加载 --> |
||||
|
<uni-load-more status="loading" v-if="loadingMap[tabItem.status]" /> |
||||
|
|
||||
|
<!-- 空数据 --> |
||||
|
<view class="empty" v-else-if="!listData[tabItem.status] || listData[tabItem.status].length === 0"> |
||||
|
暂无{{ tabItem.label }}记录 |
||||
|
</view> |
||||
|
|
||||
|
<!-- 列表 --> |
||||
|
<block v-else> |
||||
|
<lending-list-item |
||||
|
:class="'list-item-' + tabItem.status" |
||||
|
v-for="(item, index) in listData[tabItem.status]" |
||||
|
:key="index" |
||||
|
:data="item" |
||||
|
:ranking="index + 1" |
||||
|
/> |
||||
|
</block> |
||||
|
|
||||
|
<!-- 上拉加载更多 --> |
||||
|
<uni-load-more |
||||
|
v-if="listData[tabItem.status] && listData[tabItem.status].length > 0 && !loadingMap[tabItem.status]" |
||||
|
:status="loadMoreStatusMap[tabItem.status]" |
||||
|
/> |
||||
|
</view> |
||||
|
</swiper-item> |
||||
|
</swiper> |
||||
|
</view> |
||||
|
</template> |
||||
|
|
||||
|
<script> |
||||
|
import { FetchInitScreenSetting } from '@/api/user'; |
||||
|
import { FetchHistoryloan, FetchRdloanlist } from '@/api/book'; |
||||
|
import myTabs from "@/components/my-tabs/my-tabs.vue"; |
||||
|
import lendingListItem from "@/components/lending-list-item/lending-list-item.vue"; |
||||
|
|
||||
|
export default { |
||||
|
components: { myTabs, lendingListItem }, |
||||
|
data() { |
||||
|
return { |
||||
|
screenConfig: {}, |
||||
|
tabData: [ |
||||
|
{ label: "全部", status: "all", apiStatus: -1 }, |
||||
|
{ label: "在借中", status: "lending", apiStatus: 0 }, |
||||
|
// { label: "将过期", status: "expiring", apiStatus: 1 }, |
||||
|
// { label: "已过期", status: "expired", apiStatus: 2 }, |
||||
|
], |
||||
|
currentIndex: 0, |
||||
|
listData: {}, |
||||
|
loadingMap: {}, |
||||
|
loadMoreStatusMap: {}, |
||||
|
pageMap: {}, |
||||
|
sizeMap: {}, |
||||
|
hasMoreMap: {}, |
||||
|
|
||||
|
swiperHeightData: {}, |
||||
|
currentSwiperHeight: 400, |
||||
|
currentPageScrollTop: 0, |
||||
|
isRefreshing: false |
||||
|
}; |
||||
|
}, |
||||
|
|
||||
|
onLoad() { |
||||
|
this.getScreenSetting(); |
||||
|
this.initDataStructure(); |
||||
|
}, |
||||
|
|
||||
|
onShow() { |
||||
|
const tabIndex = uni.getStorageSync('switch_tab_index'); |
||||
|
if (tabIndex !== undefined && tabIndex !== '') { |
||||
|
this.currentIndex = Number(tabIndex); |
||||
|
uni.removeStorageSync('switch_tab_index'); |
||||
|
} |
||||
|
}, |
||||
|
|
||||
|
onPullDownRefresh() { |
||||
|
this.isRefreshing = true; |
||||
|
const currentTab = this.getCurrentTab(); |
||||
|
this.refreshList(currentTab.status); |
||||
|
}, |
||||
|
|
||||
|
onReachBottom() { |
||||
|
const currentTab = this.getCurrentTab(); |
||||
|
this.loadMoreList(currentTab.status); |
||||
|
}, |
||||
|
|
||||
|
onPageScroll(res) { |
||||
|
this.currentPageScrollTop = res.scrollTop; |
||||
|
}, |
||||
|
|
||||
|
methods: { |
||||
|
async getScreenSetting() { |
||||
|
try { |
||||
|
const res = await FetchInitScreenSetting({ libcode: '1201' }); |
||||
|
const data = res.data; |
||||
|
this.screenConfig = { |
||||
|
thirdUrl: data.open_lib_http?.context || '', |
||||
|
thirdAppid: data.open_lib_appId?.context || '', |
||||
|
thirdSecret: data.open_lib_secret?.context || '', |
||||
|
sm4Key: data.sm4_key?.context || '' |
||||
|
}; |
||||
|
} catch (err) { |
||||
|
console.error('获取配置失败：', err); |
||||
|
} |
||||
|
}, |
||||
|
|
||||
|
// 获取 在借中 列表（字段已对齐） |
||||
|
async getRealBorrowList(statusKey) { |
||||
|
this.loadingMap[statusKey] = true; |
||||
|
try { |
||||
|
const rdid = uni.getStorageSync('currentReaderCard'); |
||||
|
const params = { ...this.screenConfig, rdid }; |
||||
|
const res = await FetchRdloanlist(params); |
||||
|
|
||||
|
const result = typeof res.data === 'string' ? JSON.parse(res.data) : res.data; |
||||
|
let loanList = result.loanlist || []; |
||||
|
|
||||
|
// 对齐字段：loandate → loantime，returndate → returntime |
||||
|
loanList = loanList.map(item => { |
||||
|
const loantime = item.loandate || ''; |
||||
|
const returntime = item.returndate || ''; |
||||
|
|
||||
|
const now = new Date(); |
||||
|
const returnDate = new Date(returntime); |
||||
|
const diffDay = Math.ceil((returnDate - now) / (1000 * 3600 * 24)); |
||||
|
|
||||
|
let returnBook = 0; |
||||
|
if (diffDay < 0) { |
||||
|
returnBook = 3; |
||||
|
} else if (diffDay <= 3) { |
||||
|
returnBook = 1; |
||||
|
} else { |
||||
|
returnBook = 0; |
||||
|
} |
||||
|
|
||||
|
return { |
||||
|
...item, |
||||
|
loantime, |
||||
|
returntime, |
||||
|
startTime: loantime, |
||||
|
returnTime: returntime, |
||||
|
returnBook |
||||
|
}; |
||||
|
}); |
||||
|
console.log('当前借阅', loanList); |
||||
|
this.listData['lending'] = loanList; |
||||
|
this.listData['expiring'] = loanList.filter(i => i.returnBook === 1); |
||||
|
this.listData['expired'] = loanList.filter(i => i.returnBook === 3); |
||||
|
|
||||
|
this.hasMoreMap[statusKey] = false; |
||||
|
this.loadMoreStatusMap[statusKey] = "no-more"; |
||||
|
|
||||
|
} catch (err) { |
||||
|
console.error('获取在借列表失败', err); |
||||
|
this.listData[statusKey] = []; |
||||
|
} finally { |
||||
|
this.loadingMap[statusKey] = false; |
||||
|
this.isRefreshing = false; |
||||
|
uni.stopPullDownRefresh(); |
||||
|
setTimeout(() => this.calcSwiperHeight(statusKey), 0); |
||||
|
} |
||||
|
}, |
||||
|
|
||||
|
// 获取 全部/历史 列表 |
||||
|
async getHistoryList(statusKey) { |
||||
|
this.loadingMap[statusKey] = true; |
||||
|
try { |
||||
|
const rdid = uni.getStorageSync('currentReaderCard'); |
||||
|
const params = { ...this.screenConfig, rdid, logtype:'30002' }; |
||||
|
const res = await FetchHistoryloan(params); |
||||
|
|
||||
|
const result = typeof res.data === 'string' ? JSON.parse(res.data) : res.data; |
||||
|
let loanList = result.hloanlist || []; |
||||
|
|
||||
|
loanList = loanList.map(item => { |
||||
|
return { |
||||
|
...item, |
||||
|
returnTime: item.returntime || '', |
||||
|
startTime: item.loantime || item.optime || '', |
||||
|
returnBook: 2 |
||||
|
}; |
||||
|
}); |
||||
|
console.log('历史借阅', loanList); |
||||
|
this.listData[statusKey] = loanList; |
||||
|
this.hasMoreMap[statusKey] = false; |
||||
|
this.loadMoreStatusMap[statusKey] = "no-more"; |
||||
|
|
||||
|
} catch (err) { |
||||
|
console.error('获取历史列表失败', err); |
||||
|
this.listData[statusKey] = []; |
||||
|
} finally { |
||||
|
this.loadingMap[statusKey] = false; |
||||
|
this.isRefreshing = false; |
||||
|
uni.stopPullDownRefresh(); |
||||
|
setTimeout(() => this.calcSwiperHeight(statusKey), 0); |
||||
|
} |
||||
|
}, |
||||
|
|
||||
|
initDataStructure() { |
||||
|
this.tabData.forEach(tab => { |
||||
|
const key = tab.status; |
||||
|
this.$set(this.listData, key, []); |
||||
|
this.$set(this.loadingMap, key, true); |
||||
|
this.$set(this.loadMoreStatusMap, key, ""); |
||||
|
this.$set(this.pageMap, key, 1); |
||||
|
this.$set(this.sizeMap, key, 10); |
||||
|
this.$set(this.hasMoreMap, key, true); |
||||
|
}); |
||||
|
}, |
||||
|
|
||||
|
getCurrentTab() { |
||||
|
return this.tabData[this.currentIndex]; |
||||
|
}, |
||||
|
|
||||
|
async getListData(statusKey) { |
||||
|
if (statusKey === 'all') { |
||||
|
await this.getHistoryList(statusKey); |
||||
|
} |
||||
|
if (statusKey === 'lending') { |
||||
|
await this.getRealBorrowList(statusKey); |
||||
|
} |
||||
|
if (statusKey === 'expiring' || statusKey === 'expired') { |
||||
|
await this.getRealBorrowList('lending'); |
||||
|
this.loadingMap[statusKey] = false; |
||||
|
} |
||||
|
}, |
||||
|
|
||||
|
loadMoreList(statusKey) { |
||||
|
this.loadMoreStatusMap[statusKey] = "no-more"; |
||||
|
}, |
||||
|
|
||||
|
refreshList(statusKey) { |
||||
|
this.getListData(statusKey); |
||||
|
}, |
||||
|
|
||||
|
calcSwiperHeight(statusKey) { |
||||
|
const selector = `.list-item-${statusKey}`; |
||||
|
const query = uni.createSelectorQuery().in(this); |
||||
|
query.selectAll(selector).boundingClientRect((res) => { |
||||
|
let total = 200; |
||||
|
if (res?.length) { |
||||
|
total = res.reduce((t, h) => t + h.height + 8, 0); |
||||
|
} |
||||
|
this.swiperHeightData[statusKey] = total; |
||||
|
this.currentSwiperHeight = total; |
||||
|
}).exec(); |
||||
|
}, |
||||
|
|
||||
|
tabClick(index) { |
||||
|
this.currentIndex = index; |
||||
|
const tab = this.getCurrentTab(); |
||||
|
if (this.currentPageScrollTop > 100) { |
||||
|
uni.pageScrollTo({ scrollTop: 0, duration: 100 }); |
||||
|
} |
||||
|
this.getListData(tab.status); |
||||
|
}, |
||||
|
|
||||
|
onSwiperChange(e) { |
||||
|
if (e.detail.source === "touch") { |
||||
|
this.currentIndex = e.detail.current; |
||||
|
} |
||||
|
}, |
||||
|
|
||||
|
onSwiperEnd() { |
||||
|
const tab = this.getCurrentTab(); |
||||
|
this.getListData(tab.status); |
||||
|
}, |
||||
|
|
||||
|
goToDetail(item) { |
||||
|
uni.navigateTo({ |
||||
|
url: `/subpkg/pages/book-detail/book-detail?isbn=${item.isbn}` |
||||
|
}); |
||||
|
} |
||||
|
} |
||||
|
}; |
||||
|
</script> |
||||
|
|
||||
|
<style lang="scss" scoped> |
||||
|
.lending-container { |
||||
|
background-color: #f5f5f5; |
||||
|
min-height: 100vh; |
||||
|
|
||||
|
.tab-sticky { |
||||
|
position: sticky; |
||||
|
top: 0; |
||||
|
z-index: 99; |
||||
|
background: #fff; |
||||
|
} |
||||
|
|
||||
|
.swiper { |
||||
|
width: 100%; |
||||
|
min-height: 300px; |
||||
|
} |
||||
|
|
||||
|
.swiper-item { |
||||
|
width: 100%; |
||||
|
height: 100%; |
||||
|
} |
||||
|
|
||||
|
.list-wrapper { |
||||
|
padding: 10px; |
||||
|
box-sizing: border-box; |
||||
|
} |
||||
|
|
||||
|
.empty { |
||||
|
text-align: center; |
||||
|
padding: 100px 0; |
||||
|
color: #999; |
||||
|
font-size: 14px; |
||||
|
} |
||||
|
} |
||||
|
::v-deep .uni-load-more{ |
||||
|
height: auto !important; |
||||
|
} |
||||
|
</style> |
||||
@ -1,189 +0,0 @@ |
|||||
<template> |
|
||||
<view class="reader-card"> |
|
||||
<image class="card-top-bg" src="@/static/images/card-img1.png" mode="widthFix" /> |
|
||||
|
|
||||
<view class="card-list"> |
|
||||
<view |
|
||||
class="card-list-item" |
|
||||
v-for="(item, index) in cardList" |
|
||||
:key="item.id" |
|
||||
@click="handleSelectItem(item.bindValue)" |
|
||||
:class="{ active: selectedValue === item.bindValue }" |
|
||||
> |
|
||||
<image class="card-left-img" src="@/static/images/card-img2.png" mode="widthFix" /> |
|
||||
<view class="card-right-info"> |
|
||||
<text class="info-title">读者证号</text> |
|
||||
<text class="info-num">{{ item.bindValue }}</text> |
|
||||
</view> |
|
||||
<radio :value="item.bindValue" :checked="selectedValue === item.bindValue"/> |
|
||||
</view> |
|
||||
</view> |
|
||||
|
|
||||
<button |
|
||||
class="unbind-btn" |
|
||||
:disabled="!selectedValue" |
|
||||
:class="{disabled: !selectedValue}" |
|
||||
@click="handleUnbind" |
|
||||
> |
|
||||
确认解绑 |
|
||||
</button> |
|
||||
</view> |
|
||||
</template> |
|
||||
|
|
||||
<script> |
|
||||
import { |
|
||||
FetchFindAllReaderBindByOpenId, |
|
||||
FetchUnbindReadCard, |
|
||||
FetchSetDefaultReadCard |
|
||||
} from '@/api/user'; |
|
||||
|
|
||||
const READLIST = 'reader-card-list'; |
|
||||
|
|
||||
export default { |
|
||||
data() { |
|
||||
return { |
|
||||
selectedValue: '', |
|
||||
cardList: [], |
|
||||
} |
|
||||
}, |
|
||||
onShow() { |
|
||||
this.getBindReaderCardList(); |
|
||||
}, |
|
||||
methods: { |
|
||||
async getBindReaderCardList() { |
|
||||
try { |
|
||||
const openId = uni.getStorageSync('wx_login_code'); |
|
||||
if (!openId) return; |
|
||||
|
|
||||
const res = await FetchFindAllReaderBindByOpenId({ |
|
||||
libcode: '1201', |
|
||||
openId: openId |
|
||||
}); |
|
||||
|
|
||||
if (res.code === 200) { |
|
||||
this.cardList = res.data; |
|
||||
uni.setStorageSync(READLIST, res.data); |
|
||||
} else { |
|
||||
this.cardList = []; |
|
||||
uni.setStorageSync(READLIST, []); |
|
||||
} |
|
||||
} catch (err) { |
|
||||
this.cardList = uni.getStorageSync(READLIST) || []; |
|
||||
} |
|
||||
}, |
|
||||
|
|
||||
handleSelectItem(value) { |
|
||||
if (this.selectedValue === value) { |
|
||||
this.selectedValue = ''; |
|
||||
} else { |
|
||||
this.selectedValue = value; |
|
||||
} |
|
||||
}, |
|
||||
|
|
||||
// 确认解绑 |
|
||||
async handleUnbind() { |
|
||||
if (!this.selectedValue) { |
|
||||
uni.showToast({ title: '请选择要解绑的读者证', icon: 'none' }); |
|
||||
return; |
|
||||
} |
|
||||
|
|
||||
const openId = uni.getStorageSync('wx_login_code'); |
|
||||
if (!openId) return; |
|
||||
|
|
||||
// 判断：当前解绑的是不是【默认证】 |
|
||||
const unbindItem = this.cardList.find(item => item.bindValue === this.selectedValue); |
|
||||
const isUnbindDefault = unbindItem?.bindDefault === true; |
|
||||
|
|
||||
uni.showModal({ |
|
||||
title: '提示', |
|
||||
content: `确定要解绑读者证【${this.selectedValue}】吗？`, |
|
||||
success: async (res) => { |
|
||||
if (!res.confirm) return; |
|
||||
|
|
||||
try { |
|
||||
// 1. 执行解绑 |
|
||||
const result = await FetchUnbindReadCard({ |
|
||||
bindType: "rdid", |
|
||||
bindValue: this.selectedValue, |
|
||||
libcode: "1201", |
|
||||
openid: openId |
|
||||
}); |
|
||||
|
|
||||
if (result.code !== 200) { |
|
||||
uni.showToast({ title: result.msg || '解绑失败', icon: 'none' }); |
|
||||
return; |
|
||||
} |
|
||||
|
|
||||
uni.showToast({ title: '解绑成功', icon: 'success' }); |
|
||||
this.selectedValue = ''; |
|
||||
|
|
||||
// 刷新列表 |
|
||||
await this.getBindReaderCardList(); |
|
||||
|
|
||||
if (isUnbindDefault && this.cardList.length > 0) { |
|
||||
const newDefaultCard = this.cardList[0]; |
|
||||
const newValue = newDefaultCard.bindValue; |
|
||||
|
|
||||
const setResult = await FetchSetDefaultReadCard({ |
|
||||
bindType: 'rdid', |
|
||||
bindValue: newValue, |
|
||||
libcode: '1201', |
|
||||
openid: openId |
|
||||
}); |
|
||||
|
|
||||
if (setResult.code === 200) { |
|
||||
uni.setStorageSync('currentReaderCard', newValue); |
|
||||
// 刷新列表，让界面显示新默认 |
|
||||
await this.getBindReaderCardList(); |
|
||||
uni.showToast({ title: '已自动设置默认证', icon: 'success' }); |
|
||||
} |
|
||||
} |
|
||||
|
|
||||
if (this.cardList.length === 0) { |
|
||||
setTimeout(() => { |
|
||||
uni.navigateBack(); |
|
||||
}, 1500); |
|
||||
} |
|
||||
|
|
||||
} catch (err) { |
|
||||
uni.showToast({ title: '解绑失败', icon: 'none' }); |
|
||||
} |
|
||||
} |
|
||||
}); |
|
||||
}, |
|
||||
} |
|
||||
} |
|
||||
</script> |
|
||||
|
|
||||
<style lang="scss" scoped> |
|
||||
.reader-card{ |
|
||||
position: relative; |
|
||||
min-height: 100vh; |
|
||||
background-color: #f5f5f5; |
|
||||
|
|
||||
.card-top-bg{ |
|
||||
position: absolute; |
|
||||
left: 0; |
|
||||
top: 0; |
|
||||
width: 100%; |
|
||||
display: block; |
|
||||
} |
|
||||
|
|
||||
.unbind-btn{ |
|
||||
position: fixed; |
|
||||
bottom: 40px; |
|
||||
left: 0; |
|
||||
right: 0; |
|
||||
width: calc(100% - 40px); |
|
||||
margin: 0 auto; |
|
||||
padding: 4px 0; |
|
||||
color: #fff; |
|
||||
background-color: #01a4fe; |
|
||||
border-radius: 23px; |
|
||||
font-size: 16px; |
|
||||
&.disabled{ |
|
||||
background-color: #ccc; |
|
||||
} |
|
||||
} |
|
||||
} |
|
||||
</style> |
|
||||
Write
Preview
Loading…
Cancel
Save
Reference in new issue