删除 App.vue
This commit is contained in:
parent
b87a66811b
commit
914f4513fc
354
App.vue
354
App.vue
|
|
@ -1,354 +0,0 @@
|
||||||
<script setup>
|
|
||||||
import {
|
|
||||||
ref,
|
|
||||||
onMounted,
|
|
||||||
reactive
|
|
||||||
} from 'vue'
|
|
||||||
import axios from 'axios';
|
|
||||||
const msg = ref("hello world")
|
|
||||||
//生命周期方法
|
|
||||||
onMounted(() => {
|
|
||||||
console.log("onMounted")
|
|
||||||
myClick()
|
|
||||||
myClick_1()
|
|
||||||
})
|
|
||||||
const booksList = ref(null)
|
|
||||||
const borrowList = ref(null)
|
|
||||||
|
|
||||||
function myClick() {
|
|
||||||
axios({
|
|
||||||
method: 'GET',
|
|
||||||
url: 'http://127.0.0.1:8081/getAllBook'
|
|
||||||
}).then(res => {
|
|
||||||
console.log(res.data)
|
|
||||||
booksList.value = res.data.data.map(book => ({
|
|
||||||
...book,
|
|
||||||
evaluations: book.reviews202201020128List.map(review =>
|
|
||||||
`${review.username}: ${review.evaluate}`)
|
|
||||||
}));
|
|
||||||
}).catch(err => {
|
|
||||||
console.log(err)
|
|
||||||
})
|
|
||||||
}
|
|
||||||
|
|
||||||
function myClick_1() {
|
|
||||||
axios({
|
|
||||||
method: 'GET',
|
|
||||||
url: 'http://127.0.0.1:8081/getAllBorrowRecords'
|
|
||||||
}).then(res => {
|
|
||||||
console.log(res.data)
|
|
||||||
borrowList.value = res.data.data
|
|
||||||
}).catch(err => {
|
|
||||||
console.log(err)
|
|
||||||
})
|
|
||||||
}
|
|
||||||
|
|
||||||
function deleteBook(row) {
|
|
||||||
console.log(row)
|
|
||||||
axios({
|
|
||||||
method: 'POST',
|
|
||||||
url: 'http://127.0.0.1:8081/deleteBook',
|
|
||||||
params: {
|
|
||||||
id: row.id
|
|
||||||
}
|
|
||||||
}).then(res => {
|
|
||||||
console.log(res.data)
|
|
||||||
myClick()
|
|
||||||
}).catch(err => {
|
|
||||||
console.log(err)
|
|
||||||
})
|
|
||||||
}
|
|
||||||
|
|
||||||
function deleteBorrow(row) {
|
|
||||||
console.log(row)
|
|
||||||
axios({
|
|
||||||
method: 'POST',
|
|
||||||
url: 'http://127.0.0.1:8081/deleteBorrowRecords',
|
|
||||||
params: {
|
|
||||||
id: row.id
|
|
||||||
}
|
|
||||||
}).then(res => {
|
|
||||||
console.log(res.data)
|
|
||||||
myClick_1()
|
|
||||||
}).catch(err => {
|
|
||||||
console.log(err)
|
|
||||||
})
|
|
||||||
}
|
|
||||||
const dialogVisible = ref(false)
|
|
||||||
const diareview = ref(false)
|
|
||||||
const diaborrow = ref(false)
|
|
||||||
|
|
||||||
const form = reactive({
|
|
||||||
id: null,
|
|
||||||
title: '',
|
|
||||||
author: '',
|
|
||||||
isbn: '',
|
|
||||||
publisher: '',
|
|
||||||
published_date: ''
|
|
||||||
})
|
|
||||||
|
|
||||||
const review = reactive({
|
|
||||||
id: null,
|
|
||||||
evaluate: '',
|
|
||||||
username: '',
|
|
||||||
bookid: ''
|
|
||||||
})
|
|
||||||
|
|
||||||
const borrow = reactive({
|
|
||||||
id: null,
|
|
||||||
borrowid: '',
|
|
||||||
recordsid: ''
|
|
||||||
})
|
|
||||||
|
|
||||||
function updateBook(row) {
|
|
||||||
console.log(row)
|
|
||||||
dialogVisible.value = true
|
|
||||||
Object.assign(form, {
|
|
||||||
id: row.id,
|
|
||||||
title: row.title,
|
|
||||||
author: row.author,
|
|
||||||
isbn: row.isbn,
|
|
||||||
publisher: row.publisher,
|
|
||||||
published_date: row.published_date
|
|
||||||
})
|
|
||||||
|
|
||||||
}
|
|
||||||
|
|
||||||
function updateReview(row_1) {
|
|
||||||
console.log(row_1)
|
|
||||||
diareview.value = true
|
|
||||||
Object.assign(review, {
|
|
||||||
id: row_1.id,
|
|
||||||
evaluate: row_1.evaluate,
|
|
||||||
username: row_1.username,
|
|
||||||
bookid: row_1.bookid
|
|
||||||
})
|
|
||||||
|
|
||||||
}
|
|
||||||
|
|
||||||
function updateBorrow(row) {
|
|
||||||
console.log(row)
|
|
||||||
diaborrow.value = true
|
|
||||||
Object.assign(borrow, {
|
|
||||||
id: row.id,
|
|
||||||
borrowid: row.borrowid,
|
|
||||||
recordsid: row.recordsid
|
|
||||||
})
|
|
||||||
|
|
||||||
}
|
|
||||||
|
|
||||||
function updateBookcommit() {
|
|
||||||
axios({
|
|
||||||
method: 'POST',
|
|
||||||
url: 'http://127.0.0.1:8081/updateBookcommit',
|
|
||||||
params: form
|
|
||||||
}).then(res => {
|
|
||||||
console.log(res.data)
|
|
||||||
dialogVisible.value = false
|
|
||||||
myClick()
|
|
||||||
myClick_1()
|
|
||||||
}).catch(err => {
|
|
||||||
console.log(err)
|
|
||||||
})
|
|
||||||
}
|
|
||||||
|
|
||||||
function updateReviewcommit() {
|
|
||||||
axios({
|
|
||||||
method: 'POST',
|
|
||||||
url: 'http://127.0.0.1:8081/updateReviewcommit',
|
|
||||||
params: review
|
|
||||||
}).then(res => {
|
|
||||||
console.log(res.data)
|
|
||||||
diareview.value = false
|
|
||||||
myClick()
|
|
||||||
myClick_1()
|
|
||||||
}).catch(err => {
|
|
||||||
console.log(err)
|
|
||||||
})
|
|
||||||
}
|
|
||||||
|
|
||||||
function updateBorrowcommit() {
|
|
||||||
axios({
|
|
||||||
method: 'POST',
|
|
||||||
url: 'http://127.0.0.1:8081/updateBorrowRecordscommit',
|
|
||||||
params: borrow
|
|
||||||
}).then(res => {
|
|
||||||
console.log(res.data)
|
|
||||||
diaborrow.value = false
|
|
||||||
myClick()
|
|
||||||
myClick_1()
|
|
||||||
}).catch(err => {
|
|
||||||
console.log(err)
|
|
||||||
})
|
|
||||||
}
|
|
||||||
|
|
||||||
|
|
||||||
function addBook() {
|
|
||||||
dialogVisible.value = true
|
|
||||||
Object.assign(from, {
|
|
||||||
id: null,
|
|
||||||
title: '',
|
|
||||||
author: '',
|
|
||||||
isbn: '',
|
|
||||||
publisher: '',
|
|
||||||
published_date: ''
|
|
||||||
})
|
|
||||||
}
|
|
||||||
|
|
||||||
function addReview() {
|
|
||||||
diareview.value = true
|
|
||||||
Object.assign(review, {
|
|
||||||
id: null,
|
|
||||||
evaluate: '',
|
|
||||||
username: '',
|
|
||||||
bookid: ''
|
|
||||||
})
|
|
||||||
}
|
|
||||||
|
|
||||||
function addBorrow() {
|
|
||||||
diaborrow.value = true
|
|
||||||
Object.assign(borrow, {
|
|
||||||
id: null,
|
|
||||||
borrowid: '',
|
|
||||||
recordsid: ''
|
|
||||||
})
|
|
||||||
}
|
|
||||||
</script>
|
|
||||||
|
|
||||||
<template>
|
|
||||||
<el-table :data="booksList" stripe style="width: 100%;" class="table-spacing">
|
|
||||||
<el-table-column prop="id" label="id" width="180" />
|
|
||||||
<el-table-column prop="title" label="书名" width="180" />
|
|
||||||
<el-table-column prop="author" label="作者" width="180" />
|
|
||||||
<el-table-column prop="isbn" label="ISBN" width="180" />
|
|
||||||
<el-table-column prop="publisher" label="出版社" width="180" />
|
|
||||||
<el-table-column prop="published_date" label="出版日期" width="180" />
|
|
||||||
<el-table-column label="评论">
|
|
||||||
<template #default="{ row }">
|
|
||||||
<ul>
|
|
||||||
<li v-for="evaluation in row.evaluations" :key="evaluation">{{ evaluation }}</li>
|
|
||||||
</ul>
|
|
||||||
</template>
|
|
||||||
</el-table-column>
|
|
||||||
<el-table-column label="借阅信息">
|
|
||||||
<template #default="{ row }">
|
|
||||||
<ul>
|
|
||||||
<li v-for="borrow in row.borrowList" :key="borrow.id">
|
|
||||||
{{borrow.username}} - {{borrow.status}}
|
|
||||||
</li>
|
|
||||||
</ul>
|
|
||||||
</template>
|
|
||||||
</el-table-column>
|
|
||||||
<el-table-column fixed="right" label="操作" min-width="120">
|
|
||||||
<template #default="{row}">
|
|
||||||
<el-button type="danger" size="small" @click="deleteBook(row)">
|
|
||||||
删除
|
|
||||||
</el-button>
|
|
||||||
<el-button link type="primary" size="small" @click="updateBook(row)">
|
|
||||||
编辑
|
|
||||||
</el-button>
|
|
||||||
</template>
|
|
||||||
</el-table-column>
|
|
||||||
</el-table>
|
|
||||||
|
|
||||||
<el-dialog v-model="dialogVisible" title="增加或修改" width="500" :before-close="handleClose">
|
|
||||||
<el-form :model="form" label-width="auto" style="max-width: 600px">
|
|
||||||
<el-form-item label="id">
|
|
||||||
<el-input v-model="form.id" />
|
|
||||||
</el-form-item>
|
|
||||||
<el-form-item label="书名">
|
|
||||||
<el-input v-model="form.title" />
|
|
||||||
</el-form-item>
|
|
||||||
<el-form-item label="作者">
|
|
||||||
<el-input v-model="form.author" />
|
|
||||||
</el-form-item>
|
|
||||||
<el-form-item label="ISBN">
|
|
||||||
<el-input v-model="form.isbn" />
|
|
||||||
</el-form-item>
|
|
||||||
<el-form-item label="出版社">
|
|
||||||
<el-input v-model="form.publisher" />
|
|
||||||
</el-form-item>
|
|
||||||
<el-form-item label="出版时间">
|
|
||||||
<el-input v-model="form.published_date" />
|
|
||||||
</el-form-item>
|
|
||||||
</el-form>
|
|
||||||
<template #footer>
|
|
||||||
<div class="dialog-footer">
|
|
||||||
<el-button @click="dialogVisible = false">取消</el-button>
|
|
||||||
<el-button type="primary" @click="updateBookcommit()">
|
|
||||||
确认
|
|
||||||
</el-button>
|
|
||||||
</div>
|
|
||||||
</template>
|
|
||||||
</el-dialog>
|
|
||||||
<el-dialog v-model="diareview" title="增加或修改" width="500" :before-close="handleClose">
|
|
||||||
<el-form :model="review" label-width="auto" style="max-width: 600px">
|
|
||||||
<el-form-item label="id">
|
|
||||||
<el-input v-model="review.id" />
|
|
||||||
</el-form-item>
|
|
||||||
<el-form-item label="评论">
|
|
||||||
<el-input v-model="review.evaluate" />
|
|
||||||
</el-form-item>
|
|
||||||
<el-form-item label="用户名">
|
|
||||||
<el-input v-model="review.username" />
|
|
||||||
</el-form-item>
|
|
||||||
<el-form-item label="bookid">
|
|
||||||
<el-input v-model="review.bookid" />
|
|
||||||
</el-form-item>
|
|
||||||
</el-form>
|
|
||||||
<template #footer>
|
|
||||||
<div class="dialog-footer">
|
|
||||||
<el-button @click="diareview = false">取消</el-button>
|
|
||||||
<el-button type="primary" @click="updateReviewcommit()">
|
|
||||||
确认
|
|
||||||
</el-button>
|
|
||||||
</div>
|
|
||||||
</template>
|
|
||||||
</el-dialog>
|
|
||||||
<el-button @click="addBook">增加书籍</el-button>
|
|
||||||
<el-button @click="addReview">增加评论</el-button>
|
|
||||||
<el-table :data="borrowList" stripe style="width: 100%;">
|
|
||||||
<el-table-column prop="id" label="id" width="180" />
|
|
||||||
<el-table-column prop="borrowid" label="书名id" width="180" />
|
|
||||||
<el-table-column prop="recordsid" label="用户id" width="180" />
|
|
||||||
<el-table-column fixed="right" label="操作" min-width="120">
|
|
||||||
<template #default="{row}">
|
|
||||||
<el-button type="danger" size="small" @click="deleteBorrow(row)">
|
|
||||||
删除
|
|
||||||
</el-button>
|
|
||||||
<el-button link type="primary" size="small" @click="updateBorrow(row_2)">
|
|
||||||
编辑
|
|
||||||
</el-button>
|
|
||||||
</template>
|
|
||||||
</el-table-column>
|
|
||||||
</el-table>
|
|
||||||
<el-dialog v-model="diaborrow" title="增加或修改" width="500" :before-close="handleClose">
|
|
||||||
<el-form :model="borrow" label-width="auto" style="max-width: 600px">
|
|
||||||
<el-form-item label="id">
|
|
||||||
<el-input v-model="borrow.id" />
|
|
||||||
</el-form-item>
|
|
||||||
<el-form-item label="用户id">
|
|
||||||
<el-input v-model="borrow.borrowid" />
|
|
||||||
</el-form-item>
|
|
||||||
<el-form-item label="书id">
|
|
||||||
<el-input v-model="borrow.recordsid" />
|
|
||||||
</el-form-item>
|
|
||||||
</el-form>
|
|
||||||
<template #footer>
|
|
||||||
<div class="dialog-footer">
|
|
||||||
<el-button @click="diareview = false">取消</el-button>
|
|
||||||
<el-button type="primary" @click="updateBorrowcommit()">
|
|
||||||
确认
|
|
||||||
</el-button>
|
|
||||||
</div>
|
|
||||||
</template>
|
|
||||||
</el-dialog>
|
|
||||||
<el-button @click="addBorrow">增加评论</el-button>
|
|
||||||
</template>
|
|
||||||
|
|
||||||
<style>
|
|
||||||
.table-spacing {
|
|
||||||
margin-bottom: 20px;
|
|
||||||
/* 调整这个值来控制两个表格之间的间隔 */
|
|
||||||
}
|
|
||||||
</style>
|
|
||||||
Loading…
Reference in New Issue