更新后前端文档

hyx_brand
hyx 2 months ago
parent 466d816aa2
commit ddc810f5ed

@ -5,15 +5,15 @@
</div> </div>
<div class="book-info"> <div class="book-info">
<h3 class="book-title">{{ book.title }}</h3> <h3 class="book-title">{{ book.title }}</h3>
<div class="book-meta"> <div class="book-meta" v-if="showMeta">
<el-tag type="info" size="small">{{ book.content }}</el-tag> <el-tag type="info" size="small">{{ book.content }}</el-tag>
<el-tag type="success" size="small">{{ book.money }}/</el-tag> <el-tag type="success" size="small">{{ book.money }}/</el-tag>
</div> </div>
<div class="book-status"> <div class="book-status"v-if="showMeta">
<el-tag :type="book.number > 0 ? 'success' : 'danger'" size="small"> <el-tag :type="book.state" size="small">
{{ book.number > 0 ? '可借' : '已借完' }} {{ book.state }}
</el-tag> </el-tag>
<span>库存: {{ book.number }}</span> <span>阅读量: {{ book.number }}</span>
</div> </div>
</div> </div>
</el-card> </el-card>
@ -24,6 +24,10 @@ defineProps({
book: { book: {
type: Object, type: Object,
required: true required: true
},
showMeta: {
type: Boolean,
default: true
} }
}) })
</script> </script>

@ -26,7 +26,7 @@
</div> </div>
<el-table :data="records" border style="width: 100%"> <el-table :data="records" border style="width: 100%">
<el-table-column prop="username" label="用户名" width="150" /> <el-table-column prop="borrower" label="用户名" width="150" />
<el-table-column prop="book_title" label="书名" width="200" /> <el-table-column prop="book_title" label="书名" width="200" />
<el-table-column prop="borrow_time" label="借阅时间" width="200"> <el-table-column prop="borrow_time" label="借阅时间" width="200">
<template #default="scope"> <template #default="scope">
@ -85,45 +85,17 @@
const presetRecords = [ const presetRecords = [
{ {
id: 1, id: 1,
username: 'zhangsan', borrower: 'zhangsan',
book_title: '三体', book_title: '三体',
borrow_time: '2023-10-15 09:30:00', borrow_time: '2023-10-15 09:30:00',
return_time: null // return_time: null //
}, },
{ {
id: 2, id: 2,
username: 'lisi', borrower: 'lisi',
book_title: '人类简史', book_title: '人类简史',
borrow_time: '2023-10-10 14:20:00', borrow_time: '2023-10-10 14:20:00',
return_time: '2023-10-20 16:10:00' // return_time: '2023-10-20 16:10:00' //
},
{
id: 3,
username: 'wangwu',
book_title: '百年孤独',
borrow_time: '2023-09-25 11:15:00',
return_time: null
},
{
id: 4,
username: 'zhangsan',
book_title: '活着',
borrow_time: '2023-09-20 10:00:00',
return_time: '2023-10-05 15:30:00'
},
{
id: 5,
username: 'zhaoliu',
book_title: '小王子',
borrow_time: '2023-10-08 09:45:00',
return_time: null
},
{
id: 6,
username: 'lisi',
book_title: '追风筝的人',
borrow_time: '2023-09-15 16:20:00',
return_time: '2023-09-30 10:10:00'
} }
] ]

@ -25,18 +25,17 @@
</div> </div>
<el-table :data="books" border style="width: 100%"> <el-table :data="books" border style="width: 100%">
<el-table-column prop="id" label="ID" width="80" /> <el-table-column prop="id" label="ID" width="100" />
<el-table-column label="封面" width="100"> <el-table-column prop="url"label="封面" width="120">
<template #default="scope"> <template #default="scope">
<el-image :src="scope.row.url" width="60" height="80" fit="cover" /> <el-image :src="scope.row.url" width="60" height="80" fit="cover" />
</template> </template>
</el-table-column> </el-table-column>
<el-table-column prop="title" label="书名" /> <el-table-column prop="title" label="书名" width="150"/>
<el-table-column prop="category" label="分类" width="120" /> <el-table-column prop="content" label="内容" />
<el-table-column prop="money" label="日租金" width="100" /> <el-table-column prop="money" label="日租金" width="120" />
<el-table-column prop="number" label="库存" width="80" /> <el-table-column prop="number" label="阅读量" width="120" />
<el-table-column prop="borrowCount" label="借阅次数" width="100" /> <el-table-column prop="state" label="状态" width="120">
<el-table-column label="状态" width="100">
<template #default="scope"> <template #default="scope">
<el-tag :type="scope.row.number > 0 ? 'success' : 'danger'"> <el-tag :type="scope.row.number > 0 ? 'success' : 'danger'">
{{ scope.row.number > 0 ? '可借' : '已借完' }} {{ scope.row.number > 0 ? '可借' : '已借完' }}
@ -122,7 +121,7 @@
} }
const goToAddBook = () => { const goToAddBook = () => {
router.push('/api/add') router.push('/books/add')
} }
const handleDelete = async (book) => { const handleDelete = async (book) => {

@ -37,7 +37,7 @@
:step="0.1" :step="0.1"
:precision="2" /> :precision="2" />
</el-form-item> </el-form-item>
<el-form-item label="库存数量" prop="number"> <el-form-item label="阅读量" prop="number">
<el-input-number v-model="form.number" :min="1" /> <el-input-number v-model="form.number" :min="1" />
</el-form-item> </el-form-item>
<el-form-item> <el-form-item>
@ -84,7 +84,7 @@ const rules = ref({
{ required: true, message: '请输入价格', trigger: 'blur' } { required: true, message: '请输入价格', trigger: 'blur' }
], ],
number: [ number: [
{ required: true, message: '请输入库存数量', trigger: 'blur' } { required: true, message: '请输入阅读量', trigger: 'blur' }
] ]
}) })

@ -6,20 +6,20 @@
<div class="book-info"> <div class="book-info">
<h1 class="title">{{ book.title }}</h1> <h1 class="title">{{ book.title }}</h1>
<div class="meta"> <div class="meta">
<el-tag type="info" size="large">{{ book.content }}</el-tag> <!-- <el-tag type="info" size="large">{{ book.content }}</el-tag> -->
<el-tag type="success" size="large">{{ book.money }}/</el-tag> <el-tag type="success" size="large">{{ book.money }}/</el-tag>
</div> </div>
<div class="status"> <div class="status">
<el-tag :type="book.number > 0 ? 'success' : 'danger'" size="large"> <el-tag :type="book.number > 0 ? 'success' : 'danger'" size="large">
{{ book.number > 0 ? '可借' : '已借完' }} {{ book.state }}
</el-tag> </el-tag>
<span>库存: {{ book.number }}</span> <span>阅读量: {{ book.number }}</span>
</div> </div>
<div class="actions"> <div class="actions">
<el-button <el-button
type="primary" type="primary"
size="large" size="large"
:disabled="book.number <= 0" :disabled="book.state = '维护中'"
@click="borrowBook" @click="borrowBook"
v-if="!isAdmin"> v-if="!isAdmin">
立即借阅 立即借阅
@ -39,7 +39,7 @@
<div class="book-description"> <div class="book-description">
<h3>书籍简介</h3> <h3>书籍简介</h3>
<p>{{ book.description || '暂无简介' }}</p> <p>{{ book.content || '暂无简介' }}</p>
</div> </div>
</el-card> </el-card>
</div> </div>
@ -79,10 +79,8 @@ const fetchBook = async () => {
url: 'https://picsum.photos/id/24/300/400', url: 'https://picsum.photos/id/24/300/400',
money: 5.00, money: 5.00,
number: 8, number: 8,
content: '文学小说', content: '这是一本示例书籍,用于展示书籍详情页面的效果。包含了书籍的基本信息和详细介绍,用户可以在这里查看书籍的具体内容并进行借阅操作。',
description: '这是一本示例书籍,用于展示书籍详情页面的效果。包含了书籍的基本信息和详细介绍,用户可以在这里查看书籍的具体内容并进行借阅操作。', state: '维护中',
author: '示例作者',
publishDate: '2023-01-15'
} }
} }
} }

@ -39,7 +39,7 @@
<div class="book-info"> <div class="book-info">
<h3 class="book-title">{{ book.title }}</h3> <h3 class="book-title">{{ book.title }}</h3>
<div class="book-meta"> <div class="book-meta">
<el-tag type="info" size="small">{{ book.category }}</el-tag> <el-tag type="info" size="small">{{ book.content }}</el-tag>
<el-tag type="success" size="small">{{ book.money }}/</el-tag> <el-tag type="success" size="small">{{ book.money }}/</el-tag>
</div> </div>
<div class="book-status"> <div class="book-status">
@ -48,7 +48,7 @@
size="small"> size="small">
{{ book.state }} {{ book.state }}
</el-tag> </el-tag>
<span>库存: {{ book.number }}</span> <span>阅读量: {{ book.number }}</span>
</div> </div>
</div> </div>
</el-card> </el-card>
@ -103,18 +103,18 @@ const fetchBooks = async () => {
console.error('获取书籍列表失败:', error) console.error('获取书籍列表失败:', error)
ElMessage.error('获取书籍列表失败') ElMessage.error('获取书籍列表失败')
books.value = [ books.value = [
{ id: 1, title: '三体', url: 'https://picsum.photos/id/24/200/300', money: 5, number: 12, state: '可借', category: '科幻' }, { id: 1, title: '三体', url: 'https://picsum.photos/id/24/200/300', money: 5, number: 12, state: '可借', content: '科幻' },
{ id: 2, title: '人类简史', url: 'https://picsum.photos/id/25/200/300', money: 4, number: 10, state: '可借', category: '历史' }, { id: 2, title: '人类简史', url: 'https://picsum.photos/id/25/200/300', money: 4, number: 10, state: '可借', content: '历史' },
{ id: 3, title: '百年孤独', url: 'https://picsum.photos/id/26/200/300', money: 6, number: 0, state: '已借完', category: '文学' }, { id: 3, title: '百年孤独', url: 'https://picsum.photos/id/26/200/300', money: 6, number: 0, state: '维护中', content: '文学' },
{ id: 4, title: '活着', url: 'https://picsum.photos/id/27/200/300', money: 3, number: 15, state: '可借', category: '小说' }, { id: 4, title: '活着', url: 'https://picsum.photos/id/27/200/300', money: 3, number: 15, state: '可借', content: '小说' },
{ id: 5, title: '追风筝的人', url: 'https://picsum.photos/id/28/200/300', money: 4, number: 9, state: '可借', category: '小说' }, { id: 5, title: '追风筝的人', url: 'https://picsum.photos/id/28/200/300', money: 4, number: 9, state: '可借', content: '小说' },
{ id: 6, title: '解忧杂货店', url: 'https://picsum.photos/id/29/200/300', money: 5, number: 7, state: '可借', category: '小说' }, { id: 6, title: '解忧杂货店', url: 'https://picsum.photos/id/29/200/300', money: 5, number: 7, state: '可借', content: '小说' },
{ id: 7, title: '小王子', url: 'https://picsum.photos/id/30/200/300', money: 2, number: 20, state: '可借', category: '童话' }, { id: 7, title: '小王子', url: 'https://picsum.photos/id/30/200/300', money: 2, number: 20, state: '可借', content: '童话' },
{ id: 8, title: '围城', url: 'https://picsum.photos/id/31/200/300', money: 4, number: 18, state: '可借', category: '文学' }, { id: 8, title: '围城', url: 'https://picsum.photos/id/31/200/300', money: 4, number: 18, state: '可借', content: '文学' },
{ id: 9, title: '月亮与六便士', url: 'https://picsum.photos/id/32/200/300', money: 5, number: 16, state: '可借', category: '小说' }, { id: 9, title: '月亮与六便士', url: 'https://picsum.photos/id/32/200/300', money: 5, number: 16, state: '可借', content: '小说' },
{ id: 10, title: '哈利波特', url: 'https://picsum.photos/id/33/200/300', money: 7, number: 25, state: '可借', category: '魔幻' }, { id: 10, title: '哈利波特', url: 'https://picsum.photos/id/33/200/300', money: 7, number: 25, state: '可借', content: '魔幻' },
{ id: 11, title: '水浒传', url: 'https://picsum.photos/id/34/200/300', money: 6, number: 14, state: '可借', category: '古典' }, { id: 11, title: '水浒传', url: 'https://picsum.photos/id/34/200/300', money: 6, number: 14, state: '可借', content: '古典' },
{ id: 12, title: '三国演义', url: 'https://picsum.photos/id/35/200/300', money: 6, number: 12, state: '可借', category: '古典' } { id: 12, title: '三国演义', url: 'https://picsum.photos/id/35/200/300', money: 6, number: 12, state: '可借',content: '古典' }
] ]
total.value = books.value.length total.value = books.value.length
} }

@ -73,14 +73,18 @@ const fetchBooks = async () => {
ElMessage.error('获取书籍列表失败') ElMessage.error('获取书籍列表失败')
// //
books.value = [ books.value = [
{ id: 1, title: '三体', url: 'https://picsum.photos/id/24/200/300', money: 5, number: 12 }, { id: 1, title: '三体', url: 'https://picsum.photos/id/24/200/300', money: 5, number: 12, state: '可借', content: '科幻' },
{ id: 2, title: '人类简史', url: 'https://picsum.photos/id/25/200/300', money: 4, number: 10 }, { id: 2, title: '人类简史', url: 'https://picsum.photos/id/25/200/300', money: 4, number: 10, state: '可借', content: '历史' },
{ id: 3, title: '百年孤独', url: 'https://picsum.photos/id/26/200/300', money: 6, number: 0 }, { id: 3, title: '百年孤独', url: 'https://picsum.photos/id/26/200/300', money: 6, number: 0, state: '维护中', content: '文学' },
{ id: 4, title: '活着', url: 'https://picsum.photos/id/27/200/300', money: 3, number: 15 }, { id: 4, title: '活着', url: 'https://picsum.photos/id/27/200/300', money: 3, number: 15, state: '可借', content: '小说' },
{ id: 5, title: '追风筝的人', url: 'https://picsum.photos/id/28/200/300', money: 4, number: 9 }, { id: 5, title: '追风筝的人', url: 'https://picsum.photos/id/28/200/300', money: 4, number: 9, state: '可借', content: '小说' },
{ id: 6, title: '解忧杂货店', url: 'https://picsum.photos/id/29/200/300', money: 5, number: 7 }, { id: 6, title: '解忧杂货店', url: 'https://picsum.photos/id/29/200/300', money: 5, number: 7, state: '可借', content: '小说' },
{ id: 7, title: '小王子', url: 'https://picsum.photos/id/30/200/300', money: 2, number: 20 }, { id: 7, title: '小王子', url: 'https://picsum.photos/id/30/200/300', money: 2, number: 20, state: '可借', content: '童话' },
{ id: 8, title: '围城', url: 'https://picsum.photos/id/31/200/300', money: 4, number: 18 } { id: 8, title: '围城', url: 'https://picsum.photos/id/31/200/300', money: 4, number: 18, state: '可借', content: '文学' },
{ id: 9, title: '月亮与六便士', url: 'https://picsum.photos/id/32/200/300', money: 5, number: 16, state: '可借', content: '小说' },
{ id: 10, title: '哈利波特', url: 'https://picsum.photos/id/33/200/300', money: 7, number: 25, state: '可借', content: '魔幻' },
{ id: 11, title: '水浒传', url: 'https://picsum.photos/id/34/200/300', money: 6, number: 14, state: '可借', content: '古典' },
{ id: 12, title: '三国演义', url: 'https://picsum.photos/id/35/200/300', money: 6, number: 12, state: '可借',content: '古典' }
] ]
total.value = books.value.length total.value = books.value.length
} }
@ -94,7 +98,7 @@ const searchBooks = () => {
const handleBorrow = async (book) => { const handleBorrow = async (book) => {
try { try {
if (book.number <= 0) { if (book.number <= 0) {
ElMessage.warning('该书籍已无库存') ElMessage.warning('该书籍维护中,无法借阅')
return return
} }

@ -18,6 +18,7 @@
v-for="book in weeklyRank" v-for="book in weeklyRank"
:key="book.id || book.title" :key="book.id || book.title"
:book="book" :book="book"
:show-meta="false"
@click="goToBookDetail(book.id)" /> @click="goToBookDetail(book.id)" />
</div> </div>
<div class="section-more"> <div class="section-more">
@ -32,6 +33,7 @@
v-for="book in monthlyRank" v-for="book in monthlyRank"
:key="book.id || book.title" :key="book.id || book.title"
:book="book" :book="book"
:show-meta="false"
@click="goToBookDetail(book.id)" /> @click="goToBookDetail(book.id)" />
</div> </div>
<div class="section-more"> <div class="section-more">

@ -11,19 +11,13 @@
</template> </template>
</el-table-column> </el-table-column>
<el-table-column prop="title" label="书名" width="200" /> <el-table-column prop="title" label="书名" width="200" />
<el-table-column prop="number" label="租借次数" width="120" /> <el-table-column prop="number" label="阅读量" width="120" />
<el-table-column prop="money" label="价格(元/天)" width="120"> <el-table-column prop="money" label="价格(元/天)" width="120">
<template #default="scope"> <template #default="scope">
{{ scope.row.money }} {{ scope.row.money }}
</template> </template>
</el-table-column> </el-table-column>
<el-table-column label="状态" width="100">
<template #default="scope">
<el-tag :type="scope.row.number > 0 ? 'success' : 'danger'">
{{ scope.row.number > 0 ? '可借' : '已借完' }}
</el-tag>
</template>
</el-table-column>
<el-table-column label="操作" width="120"> <el-table-column label="操作" width="120">
<template #default="scope"> <template #default="scope">
<el-button <el-button
@ -64,14 +58,14 @@ const fetchMonthlyRank = async () => {
ElMessage.error('获取本月热租榜失败') ElMessage.error('获取本月热租榜失败')
// //
books.value = [ books.value = [
{ id: 1, title: '三体', url: 'https://picsum.photos/id/24/200/300', money: 5, number: 12, borrowCount: 128 }, { title: '三体', url: 'https://picsum.photos/id/24/200/300', money: 5, number: 12},
{ id: 2, title: '人类简史', url: 'https://picsum.photos/id/25/200/300', money: 4, number: 10, borrowCount: 112 }, { title: '人类简史', url: 'https://picsum.photos/id/25/200/300', money: 4, number: 10 },
{ id: 3, title: '百年孤独', url: 'https://picsum.photos/id/26/200/300', money: 6, number: 8, borrowCount: 98 }, { title: '百年孤独', url: 'https://picsum.photos/id/26/200/300', money: 6, number: 8},
{ id: 4, title: '活着', url: 'https://picsum.photos/id/27/200/300', money: 3, number: 15, borrowCount: 92 }, { title: '活着', url: 'https://picsum.photos/id/27/200/300', money: 3, number: 15 },
{ id: 5, title: '追风筝的人', url: 'https://picsum.photos/id/28/200/300', money: 4, number: 9, borrowCount: 85 }, { title: '追风筝的人', url: 'https://picsum.photos/id/28/200/300', money: 4, number: 9 },
{ id: 6, title: '解忧杂货店', url: 'https://picsum.photos/id/29/200/300', money: 5, number: 7, borrowCount: 76 }, { title: '解忧杂货店', url: 'https://picsum.photos/id/29/200/300', money: 5, number: 7 },
{ id: 7, title: '小王子', url: 'https://picsum.photos/id/30/200/300', money: 2, number: 20, borrowCount: 72 }, { title: '小王子', url: 'https://picsum.photos/id/30/200/300', money: 2, number: 20 },
{ id: 8, title: '围城', url: 'https://picsum.photos/id/31/200/300', money: 4, number: 18, borrowCount: 68 } { title: '围城', url: 'https://picsum.photos/id/31/200/300', money: 4, number: 18 }
] ]
} }
} }

@ -17,13 +17,6 @@
{{ scope.row.money }} {{ scope.row.money }}
</template> </template>
</el-table-column> </el-table-column>
<el-table-column label="状态" width="100">
<template #default="scope">
<el-tag :type="scope.row.number > 0 ? 'success' : 'danger'">
{{ scope.row.number > 0 ? '可借' : '已借完' }}
</el-tag>
</template>
</el-table-column>
<el-table-column label="操作" width="120"> <el-table-column label="操作" width="120">
<template #default="scope"> <template #default="scope">
<el-button <el-button
@ -64,14 +57,14 @@ const fetchWeeklyRank = async () => {
ElMessage.error('获取本周热租榜失败') ElMessage.error('获取本周热租榜失败')
// //
books.value = [ books.value = [
{ id: 1, title: '三体', url: 'https://picsum.photos/id/24/200/300', money: 5, number: 12, borrowCount: 128 }, { title: '三体', url: 'https://picsum.photos/id/24/200/300', money: 5, number: 12},
{ id: 2, title: '人类简史', url: 'https://picsum.photos/id/25/200/300', money: 4, number: 10, borrowCount: 112 }, { title: '人类简史', url: 'https://picsum.photos/id/25/200/300', money: 4, number: 10 },
{ id: 3, title: '百年孤独', url: 'https://picsum.photos/id/26/200/300', money: 6, number: 8, borrowCount: 98 }, { title: '百年孤独', url: 'https://picsum.photos/id/26/200/300', money: 6, number: 8},
{ id: 4, title: '活着', url: 'https://picsum.photos/id/27/200/300', money: 3, number: 15, borrowCount: 92 }, { title: '活着', url: 'https://picsum.photos/id/27/200/300', money: 3, number: 15 },
{ id: 5, title: '追风筝的人', url: 'https://picsum.photos/id/28/200/300', money: 4, number: 9, borrowCount: 85 }, { title: '追风筝的人', url: 'https://picsum.photos/id/28/200/300', money: 4, number: 9 },
{ id: 6, title: '解忧杂货店', url: 'https://picsum.photos/id/29/200/300', money: 5, number: 7, borrowCount: 76 }, { title: '解忧杂货店', url: 'https://picsum.photos/id/29/200/300', money: 5, number: 7 },
{ id: 7, title: '小王子', url: 'https://picsum.photos/id/30/200/300', money: 2, number: 20, borrowCount: 72 }, { title: '小王子', url: 'https://picsum.photos/id/30/200/300', money: 2, number: 20 },
{ id: 8, title: '围城', url: 'https://picsum.photos/id/31/200/300', money: 4, number: 18, borrowCount: 68 } { title: '围城', url: 'https://picsum.photos/id/31/200/300', money: 4, number: 18 }
] ]
} }
} }

@ -53,25 +53,22 @@ const fetchRecords = async () => {
ElMessage.error('获取借阅记录失败') ElMessage.error('获取借阅记录失败')
records.value = [ records.value = [
{ {
id: 1, title: '三体',
book_title: '三体',
borrow_time: '2023-10-01 10:30:00', borrow_time: '2023-10-01 10:30:00',
return_time: null, return_time: null,
status: '未归还'
}, },
{ {
id: 2, title: '人类简史',
book_title: '人类简史',
borrow_time: '2023-09-15 09:15:00', borrow_time: '2023-09-15 09:15:00',
return_time: '2023-09-30 16:40:00', return_time: '2023-09-30 16:40:00',
status: '已归还'
}, },
{ {
id: 3, title: '百年孤独',
book_title: '百年孤独',
borrow_time: '2023-08-20 15:20:00', borrow_time: '2023-08-20 15:20:00',
return_time: '2023-09-05 11:30:00', return_time: '2023-09-05 11:30:00',
status: '已归还'
} }
] ]
} }

@ -6,7 +6,7 @@
<div class="user-info"> <div class="user-info">
<h2>{{ user.username }}</h2> <h2>{{ user.username }}</h2>
<div class="vip-level"> <div class="vip-level">
<el-tag type="warning" size="large">VIP{{ vipLevel }}</el-tag> <el-tag type="warning" size="large">VIP{{ vip }}</el-tag>
</div> </div>
<div class="balance"> <div class="balance">
<el-text type="primary" size="large"> <el-text type="primary" size="large">
@ -29,8 +29,7 @@
</el-descriptions-item> </el-descriptions-item>
<el-descriptions-item label="注册时间">{{ formatDate(user.create_time) }}</el-descriptions-item> <el-descriptions-item label="注册时间">{{ formatDate(user.create_time) }}</el-descriptions-item>
<el-descriptions-item label="最后登录时间">{{ formatDate(user.update_time) }}</el-descriptions-item> <el-descriptions-item label="最后登录时间">{{ formatDate(user.update_time) }}</el-descriptions-item>
<el-descriptions-item label="当前借阅数量">{{ borrowedBooks.length }}</el-descriptions-item>
<el-descriptions-item label="累计借阅">{{ user.totalBorrowed || 0 }}</el-descriptions-item>
</el-descriptions> </el-descriptions>
</div> </div>
@ -54,9 +53,9 @@ const router = useRouter()
const user = computed(() => store.state.user || {}) const user = computed(() => store.state.user || {})
const balance = computed(() => store.state.balance) const balance = computed(() => store.state.balance)
const vipLevel = computed(() => store.state.vipLevel) const vip = computed(() => store.state.vip)
const isAdmin = computed(() => store.getters.isAdmin) const isAdmin = computed(() => store.getters.isAdmin)
const borrowedBooks = computed(() => store.state.borrowedBooks)
onMounted(async () => { onMounted(async () => {
try { try {
@ -64,17 +63,7 @@ onMounted(async () => {
}catch (error) { }catch (error) {
console.error('获取用户信息失败:', error) console.error('获取用户信息失败:', error)
ElMessage.error('获取用户信息失败,展示示例数据') ElMessage.error('获取用户信息失败,展示示例数据')
//
store.commit('setUser', {
username: 'testuser',
passworf:111111,
pic: 'https://picsum.photos/id/64/100/100',
admin: false
})
store.commit('setBalanceAndVip', {
balance: 100.50,
vip: 2
})
} }
}) })

@ -31,7 +31,7 @@
<h3>快捷充值</h3> <h3>快捷充值</h3>
<div class="options-grid"> <div class="options-grid">
<el-button <el-button
v-for="amount in [10, 50, 100, 200, 500]" v-for="amount in [10, 50, 100,150,200,300,400,500]"
:key="amount" :key="amount"
@click="quickRecharge(amount)"> @click="quickRecharge(amount)">
{{ amount }} {{ amount }}

Loading…
Cancel
Save