17 changed files with 893 additions and 1204 deletions
-
BINlibrary-activity/src/assets/images/640.jpg
-
6library-activity/src/main.js
-
21library-activity/src/utils/api.js
-
5library-activity/src/views/bookList/bookList.vue
-
872library-activity/src/views/cart/cart.vue
-
13library-activity/src/views/index.vue
-
62library-activity/src/views/mine/mine.vue
-
72library-activity/src/views/myAddress/addAddress.vue
-
54library-activity/src/views/myAddress/myAddress.vue
-
353library-activity/src/views/myLending/myLending.vue
-
442library-activity/src/views/order/order.vue
-
82library-activity/src/views/orderDetail/orderDetail.vue
-
4library-activity/vite.config.js
-
84selfServiceMachine/src/api/bookshelf.js
-
2selfServiceMachine/src/utils/request.js
-
18selfServiceMachine/src/views/bookRecommend.vue
-
7selfServiceMachine/vue.config.js
|
After Width: 1080 | Height: 1080 | Size: 197 KiB |
@ -1,395 +1,589 @@ |
|||||
<template> |
<template> |
||||
<div class="main"> |
<div class="main"> |
||||
<div class="cart-main"> |
|
||||
<div class="cart-top"> |
|
||||
<div class="cart-num">图书数量<span>({{list.length}})</span></div> |
|
||||
<span @click="cartDelt">{{ !isDeltHandle ? '管理' : '完成' }}</span> |
|
||||
</div> |
|
||||
<div class="cart-list"> |
|
||||
<div class="cart-item" v-if="list.length !== 0"> |
|
||||
<div class="list-top"> |
|
||||
<van-checkbox v-model="activeSelect" @change="handleselectedAll"></van-checkbox> |
|
||||
<div class="top-info"> |
|
||||
<p class="active-name">{{ list[0].selectName }}<i></i></p> |
|
||||
<p class="dealer">{{ list[0].supplierName }}</p> |
|
||||
|
<div class="cart-main"> |
||||
|
<div class="cart-top"> |
||||
|
<div class="cart-num"> |
||||
|
图书数量<span>({{ totalLength }})</span> |
||||
|
</div> |
||||
|
<span @click="cartDelt">{{ |
||||
|
!isDeltHandle ? '管理' : '完成' |
||||
|
}}</span> |
||||
|
</div> |
||||
|
<div class="cart-list"> |
||||
|
<div v-for="(bookItem, index) in list" :key="index" > |
||||
|
<div class="cart-item" v-if="bookItem.length !== 0"> |
||||
|
<div class="list-top"> |
||||
|
<van-checkbox v-model="bookItem.activeSelect" @change="handleselectedAll(index)"></van-checkbox> |
||||
|
<div class="top-info"> |
||||
|
<p class="active-name"> |
||||
|
{{ bookItem[0] && bookItem[0].selectName }}<i></i> |
||||
|
</p> |
||||
|
<p class="dealer">{{ bookItem[0] && bookItem[0].supplierName}}</p> |
||||
|
</div> |
||||
</div> |
</div> |
||||
</div> |
|
||||
<div class="product-list"> |
|
||||
<div v-for="(item,index) in list" :key="item.id" class="product-item" > |
|
||||
<van-checkbox v-model="item.checked" @change="handleSingle(index)"></van-checkbox> |
|
||||
<div class="product-cont" @click="getOnlineBookDetail(item.bookId)"> |
|
||||
<div class="product-img"><img :src="'http://192.168.99.67:8080/demoOnlineSelect/getBookCover.do?id='+item.bookId" alt="" /></div> |
|
||||
<div class="product-txt"> |
|
||||
<div class="product-info"> |
|
||||
<h4 class="overflow-txt-only">{{item.bookName}} </h4> |
|
||||
<div class="author-date"> |
|
||||
<p class="author overflow-txt-only">{{item.author}}</p> |
|
||||
<p class="date overflow-txt-only">{{item.createdDate}}</p> |
|
||||
</div> |
|
||||
<div class="intro overflow-txt">{{item.introduce}}</div> |
|
||||
|
<div class="product-list" v-for="(item, i) in bookItem" :key="item.id"> |
||||
|
<div class="product-item"> |
||||
|
<!-- @change="handleSingle(index)" --> |
||||
|
<van-checkbox v-model="item.checked"></van-checkbox> |
||||
|
<div |
||||
|
class="product-cont" |
||||
|
@click="getOnlineBookDetail(item.bookId)" |
||||
|
> |
||||
|
<div class="product-img"> |
||||
|
<img |
||||
|
:src=" |
||||
|
'http://192.168.99.67:8080/demoOnlineSelect/getBookCover.do?id=' + |
||||
|
item.bookId |
||||
|
" |
||||
|
alt="" |
||||
|
/> |
||||
</div> |
</div> |
||||
<div class="product-bottom"> |
|
||||
<p class="product-price">实付款 <span><i class="rmb">￥</i>0</span><i><em>￥</em>{{item.price}}</i></p> |
|
||||
<span v-if="!isDeltHandle" class="product-num">x1</span> |
|
||||
<span v-else class="item-delt" @click.stop="deltCurrentItem(item.bookId)"></span> |
|
||||
|
<div class="product-txt"> |
||||
|
<div class="product-info"> |
||||
|
<h4 class="overflow-txt-only"> |
||||
|
{{ item.bookName }} |
||||
|
</h4> |
||||
|
<div class="author-date"> |
||||
|
<p class="author overflow-txt-only"> |
||||
|
{{ item.author }} |
||||
|
</p> |
||||
|
<p class="date overflow-txt-only"> |
||||
|
{{ item.createdDate }} |
||||
|
</p> |
||||
|
</div> |
||||
|
<div class="intro overflow-txt"> |
||||
|
{{ item.introduce }} |
||||
|
</div> |
||||
|
</div> |
||||
|
<div class="product-bottom"> |
||||
|
<p class="product-price"> |
||||
|
实付款 |
||||
|
<span><i class="rmb">￥</i>0</span |
||||
|
><i><em>￥</em>{{ item.price }}</i> |
||||
|
</p> |
||||
|
<span |
||||
|
v-if="!isDeltHandle" |
||||
|
class="product-num" |
||||
|
>x1</span |
||||
|
> |
||||
|
<span |
||||
|
v-else |
||||
|
class="item-delt" |
||||
|
@click.stop=" |
||||
|
deltCurrentItem(item.id) |
||||
|
" |
||||
|
></span> |
||||
|
</div> |
||||
</div> |
</div> |
||||
</div> |
</div> |
||||
</div> |
</div> |
||||
</div> |
</div> |
||||
</div> |
</div> |
||||
</div> |
</div> |
||||
|
<div class="empty-data" v-if="list.length === 0"> |
||||
|
<img src="@assets/images/empty.png" alt="" /> |
||||
|
</div> |
||||
|
</div> |
||||
|
</div> |
||||
|
|
||||
<div class="empty-data" v-if="list.length === 0"> |
|
||||
<img src="@assets/images/empty.png" alt="" /> |
|
||||
</div> |
|
||||
</div> |
|
||||
</div> |
|
||||
|
<div class="cart-pay" v-if="list.length !== 0"> |
||||
|
<van-checkbox v-model="allSelected">全选</van-checkbox> |
||||
|
<div v-if="!isDeltHandle" class="payment-right"> |
||||
|
<div class="total-num"> |
||||
|
合计:<span><i class="rmb">￥</i>0</span> |
||||
|
</div> |
||||
|
<p class="pay-btn" @click="goPay">下单</p> |
||||
|
</div> |
||||
|
<div v-else class="payment-right"> |
||||
|
<p class="delt-btn" @click="confirmDelt">删除</p> |
||||
|
</div> |
||||
|
</div> |
||||
|
|
||||
<div class="cart-pay" v-if="list.length !== 0"> |
|
||||
<van-checkbox v-model="activeSelect">全选</van-checkbox> |
|
||||
<div v-if="!isDeltHandle" class="payment-right"> |
|
||||
<div class="total-num">合计:<span><i class="rmb">￥</i>0</span></div> |
|
||||
<p class="pay-btn" @click="goPay">下单</p> |
|
||||
</div> |
|
||||
<div v-else class="payment-right"> |
|
||||
<p class="delt-btn" @click="confirmDelt">删除</p> |
|
||||
</div> |
|
||||
</div> |
|
||||
|
|
||||
<TabBar :tabCur.sync="tabCur" /> |
<TabBar :tabCur.sync="tabCur" /> |
||||
|
|
||||
<van-dialog v-model:show="showDetial" :show-confirm-button="false"> |
|
||||
<div class="bookItem-dialog-detail"> |
|
||||
<div class="list-top"> |
|
||||
<div class="top-info"> |
|
||||
<p class="active-name">你选书，我买单<i></i></p> |
|
||||
</div> |
|
||||
</div> |
|
||||
<div class="product-cont"> |
|
||||
<div class="product-cont-left"> |
|
||||
<div class="product-img"> |
|
||||
<img :src="'http://192.168.99.67:8080/demoOnlineSelect/getBookCover.do?id='+detailBook.id" alt="" /> |
|
||||
</div> |
|
||||
<div class="book-inventory"> |
|
||||
<p>剩余库存</p> |
|
||||
<span><i>{{ parseInt(detailBook.total)-parseInt(detailBook.purchase) }}</i>册</span> |
|
||||
</div> |
|
||||
</div> |
|
||||
<div class="product-txt"> |
|
||||
<div class="product-info"> |
|
||||
<h4>{{ detailBook.bookName }}</h4> |
|
||||
<div class="bookItem-txt"> |
|
||||
<span>著者：</span> |
|
||||
<p class="author">{{ detailBook.author }}</p> |
|
||||
</div> |
|
||||
<div class="bookItem-txt"> |
|
||||
<span>出版社：</span> |
|
||||
<p>{{ detailBook.publish }}</p> |
|
||||
</div> |
|
||||
<div class="bookItem-txt"> |
|
||||
<span>出版时间：</span> |
|
||||
<p>{{ detailBook.createdDate }}</p> |
|
||||
</div> |
|
||||
<div class="bookItem-txt"> |
|
||||
<!-- :style="{ width: detailBook.introduce !== '' ? '1.42rem' : 'auto' }" --> |
|
||||
<span class="txt-title">简介：</span> |
|
||||
<p class="intro-txt">{{ detailBook.introduce !== '' ? detailBook.introduce : '暂无简介'}}</p> |
|
||||
</div> |
|
||||
</div> |
|
||||
</div> |
|
||||
</div> |
|
||||
<div class="order-dealer"> |
|
||||
<p class="dealer">{{ detailBook.supplierName }}</p> |
|
||||
<div class="order-pay"> |
|
||||
<p>实付款<span><i>￥</i>0</span></p> |
|
||||
<span class="yj-price"><i>￥</i><em>{{ detailBook.price }}</em></span> |
|
||||
</div> |
|
||||
</div> |
|
||||
</div> |
|
||||
<div class="dialog-btn"> |
|
||||
<span @click="showDetial=false">关闭</span> |
|
||||
</div> |
|
||||
</van-dialog> |
|
||||
|
<van-dialog v-model:show="showDetial" :show-confirm-button="false"> |
||||
|
<div class="bookItem-dialog-detail"> |
||||
|
<div class="list-top"> |
||||
|
<div class="top-info"> |
||||
|
<p class="active-name">你选书，我买单<i></i></p> |
||||
|
</div> |
||||
|
</div> |
||||
|
<div class="product-cont"> |
||||
|
<div class="product-cont-left"> |
||||
|
<div class="product-img"> |
||||
|
<img |
||||
|
:src=" |
||||
|
$coverUrl+'/demoOnlineSelect/getBookCover.do?id=' + |
||||
|
detailBook.id |
||||
|
" |
||||
|
alt="" |
||||
|
/> |
||||
|
</div> |
||||
|
<div class="book-inventory"> |
||||
|
<p>剩余库存</p> |
||||
|
<span |
||||
|
><i>{{ |
||||
|
parseInt(detailBook.total) - |
||||
|
parseInt(detailBook.purchase) |
||||
|
}}</i |
||||
|
>册</span |
||||
|
> |
||||
|
</div> |
||||
|
</div> |
||||
|
<div class="product-txt"> |
||||
|
<div class="product-info"> |
||||
|
<h4>{{ detailBook.bookName }}</h4> |
||||
|
<div class="bookItem-txt"> |
||||
|
<span>著者：</span> |
||||
|
<p class="author">{{ detailBook.author }}</p> |
||||
|
</div> |
||||
|
<div class="bookItem-txt"> |
||||
|
<span>出版社：</span> |
||||
|
<p>{{ detailBook.publish }}</p> |
||||
|
</div> |
||||
|
<div class="bookItem-txt"> |
||||
|
<span>出版时间：</span> |
||||
|
<p>{{ detailBook.createdDate }}</p> |
||||
|
</div> |
||||
|
<div class="bookItem-txt"> |
||||
|
<span class="txt-title">简介：</span> |
||||
|
<p class="intro-txt"> |
||||
|
{{ |
||||
|
detailBook.introduce !== '' |
||||
|
? detailBook.introduce |
||||
|
: '暂无简介' |
||||
|
}} |
||||
|
</p> |
||||
|
</div> |
||||
|
</div> |
||||
|
</div> |
||||
|
</div> |
||||
|
<div class="order-dealer"> |
||||
|
<p class="dealer">{{ detailBook.supplierName }}</p> |
||||
|
<div class="order-pay"> |
||||
|
<p> |
||||
|
实付款<span><i>￥</i>0</span> |
||||
|
</p> |
||||
|
<span class="yj-price" |
||||
|
><i>￥</i><em>{{ detailBook.price }}</em></span |
||||
|
> |
||||
|
</div> |
||||
|
</div> |
||||
|
</div> |
||||
|
<div class="dialog-btn"> |
||||
|
<span @click="showDetial = false">关闭</span> |
||||
|
</div> |
||||
|
</van-dialog> |
||||
</div> |
</div> |
||||
</template> |
</template> |
||||
|
|
||||
<script> |
<script> |
||||
import { Toast } from 'vant' |
import { Toast } from 'vant' |
||||
import { reactive, computed, onMounted, getCurrentInstance, toRefs } from 'vue' |
|
||||
|
import { reactive, computed, watch, onMounted, getCurrentInstance, toRefs } from 'vue' |
||||
import TabBar from '@/components/tabBar/index.vue' |
import TabBar from '@/components/tabBar/index.vue' |
||||
|
|
||||
export default { |
export default { |
||||
name: 'Cart', |
name: 'Cart', |
||||
components: { TabBar }, |
components: { TabBar }, |
||||
setup() { |
setup() { |
||||
const { proxy } = getCurrentInstance() |
const { proxy } = getCurrentInstance() |
||||
let data = reactive({ |
let data = reactive({ |
||||
tabCur: 1, |
|
||||
activeSelect: false, |
|
||||
allSelected: false, |
|
||||
isDeltHandle: false, |
|
||||
showDetial: false, |
|
||||
list:[], |
|
||||
checkedCount: [], |
|
||||
detailBook: null |
|
||||
|
tabCur: 1, |
||||
|
allSelected: false, |
||||
|
isDeltHandle: false, |
||||
|
showDetial: false, |
||||
|
list: [], |
||||
|
totalLength: 0, |
||||
|
checkedCount: [], |
||||
|
detailBook: null, |
||||
|
checkedBooks:[], |
||||
|
checkedBooksPay:[] |
||||
}) |
}) |
||||
|
|
||||
|
watch(data.list, () => { |
||||
|
data.allSelected = allSelected; |
||||
|
}, { deep: true }); |
||||
|
|
||||
onMounted(() => { |
onMounted(() => { |
||||
getMyshoppingCart() |
|
||||
}) |
|
||||
|
getMyshoppingCart() |
||||
|
}) |
||||
|
|
||||
|
const allSelected = computed({ |
||||
|
get() { |
||||
|
return data.list.every(bookItem => { |
||||
|
return bookItem.every(item => item.checked); |
||||
|
}); |
||||
|
}, |
||||
|
set(checked) { |
||||
|
data.list.forEach(bookItem => { |
||||
|
bookItem.forEach(item => { |
||||
|
item.checked = checked; |
||||
|
}); |
||||
|
}); |
||||
|
} |
||||
|
}); |
||||
|
|
||||
let getMyshoppingCart = () => { |
|
||||
let param = { |
|
||||
} |
|
||||
proxy.$http |
|
||||
.get(proxy.$API.MYSHOPPINGCART, |
|
||||
{ |
|
||||
params: param |
|
||||
} |
|
||||
) |
|
||||
.then(res => { |
|
||||
data.list = res.data[0] |
|
||||
}) |
|
||||
.catch((res) => { |
|
||||
console.log(res) |
|
||||
}) |
|
||||
|
let getMyshoppingCart = () => { |
||||
|
let param = {} |
||||
|
proxy.$http |
||||
|
.get(proxy.$API.MYSHOPPINGCART, { |
||||
|
params: param, |
||||
|
}) |
||||
|
.then((res) => { |
||||
|
if(res.data.length === 0){ |
||||
|
data.list = [] |
||||
|
}else{ |
||||
|
let allArraysEmpty = true; |
||||
|
for (let i = 0; i < res.data.length; i++) { |
||||
|
if (res.data[i].length !== 0) { // 如果当前子数组不为空 |
||||
|
allArraysEmpty = false; // 设置所有子数组都不为空的标记为 false |
||||
|
break; |
||||
|
} |
||||
|
} |
||||
|
if (allArraysEmpty) { |
||||
|
data.list = [] |
||||
|
console.log('都为空') |
||||
|
} else { |
||||
|
data.list = res.data |
||||
|
data.list.forEach(bookItem => { |
||||
|
watch(bookItem, () => { |
||||
|
bookItem.activeSelect = bookItem.every(item => item.checked); |
||||
|
}, { deep: true }); |
||||
|
}) |
||||
|
data.totalLength = data.list.map(books => books.length).reduce((total, length) => total + length, 0); |
||||
|
} |
||||
|
} |
||||
|
}) |
||||
|
.catch((res) => { |
||||
|
console.log(res) |
||||
|
}) |
||||
} |
} |
||||
|
|
||||
let getOnlineBookDetail = (bookId) => { |
|
||||
proxy.$http |
|
||||
.post(proxy.$API.BOOKONLINEDETAIL, |
|
||||
{ |
|
||||
bookId: bookId |
|
||||
}, |
|
||||
{ |
|
||||
headers: { |
|
||||
'Content-Type': 'application/x-www-form-urlencoded' |
|
||||
} |
|
||||
} |
|
||||
) |
|
||||
.then(res => { |
|
||||
data.detailBook = res.data.book |
|
||||
data.showDetial = true |
|
||||
}) |
|
||||
.catch((res) => { |
|
||||
console.log(res) |
|
||||
}) |
|
||||
} |
|
||||
|
let getOnlineBookDetail = (bookId) => { |
||||
|
proxy.$http |
||||
|
.post( |
||||
|
proxy.$API.BOOKONLINEDETAIL, |
||||
|
{ |
||||
|
bookId: bookId, |
||||
|
}, |
||||
|
{ |
||||
|
headers: { |
||||
|
'Content-Type': 'application/x-www-form-urlencoded', |
||||
|
}, |
||||
|
} |
||||
|
) |
||||
|
.then((res) => { |
||||
|
data.detailBook = res.data.book |
||||
|
data.showDetial = true |
||||
|
}) |
||||
|
.catch((res) => { |
||||
|
console.log(res) |
||||
|
}) |
||||
|
} |
||||
|
let deltBookShoppingCart = (ids) => { |
||||
|
let param = { |
||||
|
ids: ids, |
||||
|
} |
||||
|
proxy.$http |
||||
|
.put( |
||||
|
proxy.$API.DELETBOOKTOSHOPPINGCART, |
||||
|
param, |
||||
|
{ |
||||
|
headers: { |
||||
|
'Content-Type': 'application/x-www-form-urlencoded' |
||||
|
}, |
||||
|
} |
||||
|
) |
||||
|
.then((res) => { |
||||
|
getMyshoppingCart() |
||||
|
Toast("删除成功") |
||||
|
}) |
||||
|
.catch((res) => { |
||||
|
console.log(res) |
||||
|
}) |
||||
|
} |
||||
|
|
||||
let deltBookShoppingCart = (ids) => { |
|
||||
let param = { |
|
||||
ids: ids |
|
||||
} |
|
||||
proxy.$http |
|
||||
.post(proxy.$API.DELETBOOKTOSHOPPINGCART, |
|
||||
param,{ |
|
||||
headers: { |
|
||||
'Content-Type': 'application/x-www-form-urlencoded' |
|
||||
} |
|
||||
} |
|
||||
) |
|
||||
.then(res => { |
|
||||
|
|
||||
}) |
|
||||
.catch((res) => { |
|
||||
console.log(res) |
|
||||
}) |
|
||||
} |
|
||||
|
let confirmDelt = () => { |
||||
|
// let ids = data.list.filter(item => item.checked).map(item => item.id); |
||||
|
// console.log('ids',ids) |
||||
|
// if(ids.length === 0){ |
||||
|
// Toast('请选择你需要删除的书籍') |
||||
|
// }else{ |
||||
|
// ids = ids.join(',') |
||||
|
// console.log(ids) |
||||
|
// deltBookShoppingCart(ids) |
||||
|
// } |
||||
|
data.checkedBooks = data.list |
||||
|
.flat() // 将二维数组转为一维数组 |
||||
|
.filter(item => item.checked === true) |
||||
|
.map(item => item.id); |
||||
|
|
||||
let goPay = () => { |
|
||||
proxy.$router.push({ path: '/CartResult' }) |
|
||||
} |
|
||||
let cartDelt = () =>{ |
|
||||
data.isDeltHandle = !data.isDeltHandle |
|
||||
} |
|
||||
let deltCurrentItem = (bookId) =>{ |
|
||||
// const targetList = type === 'active1' ? data.list : data.list2 |
|
||||
const index = data.list.findIndex(item => item.bookId === bookId) |
|
||||
if (index !== -1) { |
|
||||
// data.list.splice(index, 1) |
|
||||
let ids = []; |
|
||||
ids.push(data.list[index].bookId) |
|
||||
ids = ids.join(','); |
|
||||
|
if(data.checkedBooks.length === 0){ |
||||
|
Toast('请选择你需要删除的书籍') |
||||
|
}else{ |
||||
|
const ids = data.checkedBooks.join(',') |
||||
|
console.log(ids) |
||||
deltBookShoppingCart(ids) |
deltBookShoppingCart(ids) |
||||
} |
} |
||||
} |
|
||||
|
} |
||||
|
|
||||
// 商品单选 |
|
||||
let handleSingle = (index) => { |
|
||||
const selectedProductsCount = data.list.filter(item => item.checked).length; |
|
||||
if (selectedProductsCount === 1 && !data.list.find(p => p.checked).checked) { |
|
||||
data.activeSelect = false; |
|
||||
} else { |
|
||||
data.activeSelect = selectedProductsCount === data.list.length; |
|
||||
} |
|
||||
} |
|
||||
|
let cartDelt = () => { |
||||
|
data.isDeltHandle = !data.isDeltHandle |
||||
|
} |
||||
|
|
||||
|
let deltCurrentItem = (bookId) => { |
||||
|
deltBookShoppingCart(bookId) |
||||
|
} |
||||
|
|
||||
|
// 商品单选 |
||||
|
let handleSingle = (index) => { |
||||
|
// const selectedProductsCount = data.list.filter((item) => item.checked).length |
||||
|
// if ( |
||||
|
// selectedProductsCount === 1 && !data.list.find((p) => p.checked).checked |
||||
|
// ) { |
||||
|
// data.activeSelect = false |
||||
|
// } else { |
||||
|
// data.activeSelect = selectedProductsCount === data.list.length |
||||
|
// } |
||||
|
} |
||||
|
|
||||
// 全选 |
|
||||
let handleselectedAll = () =>{ |
|
||||
data.list.forEach(item => { |
|
||||
item.checked = data.activeSelect; |
|
||||
|
// 全选 |
||||
|
let handleselectedAll = (index) => { |
||||
|
data.list[index].forEach(item=>{ |
||||
|
item.checked = data.list[index].activeSelect |
||||
}) |
}) |
||||
} |
|
||||
|
} |
||||
|
|
||||
let confirmDelt = () => { |
|
||||
if(data.activeSelect){ |
|
||||
// data.list = [] |
|
||||
// let ids = []; |
|
||||
// for (let i = 0; i < data.list.length; i++) { |
|
||||
// ids.push(data.list[i].bookId) |
|
||||
// } |
|
||||
// ids = parse.ids.join(','); |
|
||||
// deltBookShoppingCart(ids) |
|
||||
|
let goPay = () => { |
||||
|
// let bookIds = data.list.filter(item => item.checked).map(item => item.bookId); |
||||
|
// console.log('bookIds',bookIds) |
||||
|
// if(bookIds.length === 0){ |
||||
|
// Toast('请选择您需要下单的书籍') |
||||
|
// }else{ |
||||
|
// bookIds = bookIds.join(',') |
||||
|
// console.log(bookIds) |
||||
|
// getMyAddress() |
||||
|
// // addPlaceOrder(bookIds) |
||||
|
// } |
||||
|
data.checkedBooksPay = data.list |
||||
|
.flat() // 将二维数组转为一维数组 |
||||
|
.filter(item => item.checked === true) |
||||
|
.map(item => item); |
||||
|
console.log(data.checkedBooksPay) |
||||
|
if(data.checkedBooksPay.length === 0){ |
||||
|
Toast('请选择你需要下单的书籍') |
||||
}else{ |
}else{ |
||||
const index = data.list.findIndex(p => p.checked); |
|
||||
if (index !== -1) { |
|
||||
data.list.splice(index, 1); |
|
||||
}else{ |
|
||||
Toast('请选择你需要删除的书籍') |
|
||||
} |
|
||||
|
getMyAddress() |
||||
|
} |
||||
|
} |
||||
|
|
||||
|
let addPlaceOrder = (param) => { |
||||
|
proxy.$http |
||||
|
.put( |
||||
|
proxy.$API.PLACEORDER, |
||||
|
param, |
||||
|
{ |
||||
|
headers: { |
||||
|
'Content-Type': 'application/x-www-form-urlencoded', |
||||
|
}, |
||||
|
} |
||||
|
) |
||||
|
.then((res) => { |
||||
|
if(res.errCode === 0){ |
||||
|
proxy.$router.push({ path: '/CartResult' }) |
||||
|
} |
||||
|
}) |
||||
|
.catch((res) => { |
||||
|
console.log(res) |
||||
|
}) |
||||
|
} |
||||
|
|
||||
|
let getMyAddress = () => { |
||||
|
let param = { |
||||
|
openid: 'ocHu-sysUQ6-xb9knAJ5mATqCOJE' |
||||
} |
} |
||||
} |
|
||||
|
|
||||
|
proxy.$http |
||||
|
.get(proxy.$API.MYADDRESS, { |
||||
|
params: param, |
||||
|
}) |
||||
|
.then((res) => { |
||||
|
if(res.data.myAddress.length !== 0){ |
||||
|
const defaultAddress = res.data.myAddress.find(function(address) { |
||||
|
return address.isDefault === 1; |
||||
|
}); |
||||
|
|
||||
|
// 将数据按照 supplierName 进行分组 |
||||
|
const bookIdMap = new Map(); |
||||
|
for (const item of data.checkedBooksPay) { |
||||
|
if (!bookIdMap.has(item.supplierName)) { |
||||
|
bookIdMap.set(item.supplierName, []); |
||||
|
} |
||||
|
bookIdMap.get(item.supplierName).push(item.bookId); |
||||
|
} |
||||
|
|
||||
|
// 遍历每个 supplierName 对应的 bookId，进行相应的操作 |
||||
|
for (const [key, value] of bookIdMap) { |
||||
|
console.log(`SupplierName: ${key}`); |
||||
|
console.log(`BookId list: ${value}`); |
||||
|
let param = { |
||||
|
addressId: defaultAddress.id, |
||||
|
bookIds: value.join(',') |
||||
|
} |
||||
|
console.log(param) |
||||
|
addPlaceOrder(param) |
||||
|
} |
||||
|
|
||||
|
}else{ |
||||
|
Toast('请先添加收货地址后再下单') |
||||
|
} |
||||
|
}) |
||||
|
.catch((res) => { |
||||
|
console.log(res) |
||||
|
}) |
||||
|
} |
||||
|
|
||||
return { |
return { |
||||
...toRefs(data), |
...toRefs(data), |
||||
goPay, |
goPay, |
||||
cartDelt, |
|
||||
deltCurrentItem, |
|
||||
handleselectedAll, |
|
||||
handleSingle, |
|
||||
confirmDelt, |
|
||||
getMyshoppingCart, |
|
||||
getOnlineBookDetail, |
|
||||
deltBookShoppingCart |
|
||||
|
cartDelt, |
||||
|
deltCurrentItem, |
||||
|
handleselectedAll, |
||||
|
handleSingle, |
||||
|
confirmDelt, |
||||
|
getMyshoppingCart, |
||||
|
getOnlineBookDetail, |
||||
|
deltBookShoppingCart, |
||||
|
addPlaceOrder, |
||||
|
allSelected, |
||||
|
getMyAddress |
||||
} |
} |
||||
} |
|
||||
|
}, |
||||
} |
} |
||||
</script> |
</script> |
||||
|
|
||||
<style scoped lang="scss"> |
<style scoped lang="scss"> |
||||
.cart-main{ |
|
||||
padding: 0 .16rem 2.2rem .16rem; |
|
||||
color: #191A1A; |
|
||||
.cart-top{ |
|
||||
position: fixed; |
|
||||
top: 0; |
|
||||
right: 0; |
|
||||
left: 0; |
|
||||
display: flex; |
|
||||
justify-content: space-between; |
|
||||
align-items: center; |
|
||||
font-size: .32rem; |
|
||||
height: 1rem; |
|
||||
padding: 0 .32rem; |
|
||||
background-color: #fff; |
|
||||
box-shadow: 0 0.06rem 0.1rem 1px #EFECEC; |
|
||||
z-index: 999; |
|
||||
.cart-num{ |
|
||||
font-size: .32rem; |
|
||||
opacity: 0.6; |
|
||||
span{ |
|
||||
font-size: 0.3rem; |
|
||||
} |
|
||||
} |
|
||||
} |
|
||||
} |
|
||||
.cart-list{ |
|
||||
padding-top: 1.2rem; |
|
||||
} |
|
||||
.cart-item{ |
|
||||
padding: .24rem; |
|
||||
margin-bottom: .2rem; |
|
||||
box-shadow: 0px .03rem 0.6rem 1px rgba(0,0,0,0.08); |
|
||||
border-radius: 0.1rem; |
|
||||
background-color: #fff; |
|
||||
|
|
||||
} |
|
||||
|
.cart-main { |
||||
|
padding: 0 0.16rem 2.2rem 0.16rem; |
||||
|
color: #191a1a; |
||||
|
.cart-top { |
||||
|
position: fixed; |
||||
|
top: 0; |
||||
|
right: 0; |
||||
|
left: 0; |
||||
|
display: flex; |
||||
|
justify-content: space-between; |
||||
|
align-items: center; |
||||
|
font-size: 0.32rem; |
||||
|
height: 1rem; |
||||
|
padding: 0 0.32rem; |
||||
|
background-color: #fff; |
||||
|
box-shadow: 0 0.06rem 0.1rem 1px #efecec; |
||||
|
z-index: 999; |
||||
|
.cart-num { |
||||
|
font-size: 0.32rem; |
||||
|
opacity: 0.6; |
||||
|
span { |
||||
|
font-size: 0.3rem; |
||||
|
} |
||||
|
} |
||||
|
} |
||||
|
} |
||||
|
.cart-list { |
||||
|
padding-top: 1.2rem; |
||||
|
} |
||||
|
.cart-item { |
||||
|
padding: 0.24rem; |
||||
|
margin-bottom: 0.2rem; |
||||
|
box-shadow: 0px 0.03rem 0.6rem 1px rgba(0, 0, 0, 0.08); |
||||
|
border-radius: 0.1rem; |
||||
|
background-color: #fff; |
||||
|
} |
||||
|
|
||||
.product-list{ |
|
||||
.product-item{ |
|
||||
display: flex; |
|
||||
justify-content: flex-start; |
|
||||
margin-top: .3rem; |
|
||||
} |
|
||||
} |
|
||||
|
.product-list { |
||||
|
.product-item { |
||||
|
display: flex; |
||||
|
justify-content: flex-start; |
||||
|
margin-top: 0.3rem; |
||||
|
} |
||||
|
} |
||||
|
|
||||
.cart-pay{ |
|
||||
position: fixed; |
|
||||
left: 0; |
|
||||
right: 0; |
|
||||
bottom: 0.98rem; |
|
||||
padding: 0 .32rem; |
|
||||
height: 1rem; |
|
||||
background: linear-gradient(#fff, #f1f1f1); |
|
||||
display: flex; |
|
||||
justify-content: space-between; |
|
||||
align-items: center; |
|
||||
.payment-right{ |
|
||||
display: flex; |
|
||||
justify-content: space-between; |
|
||||
align-items: center; |
|
||||
font-size: .28rem; |
|
||||
.total-num{ |
|
||||
font-size: 0.28rem; |
|
||||
span{ |
|
||||
font-size: .4rem; |
|
||||
font-weight: bold; |
|
||||
color: #FF3871; |
|
||||
.rmb{ |
|
||||
font-style: normal; |
|
||||
font-size: .28rem; |
|
||||
text-decoration: none; |
|
||||
} |
|
||||
} |
|
||||
} |
|
||||
.pay-btn{ |
|
||||
width: 1.5rem; |
|
||||
height: 0.6rem; |
|
||||
margin-left: 0.4rem; |
|
||||
line-height: 0.6rem; |
|
||||
text-align: center; |
|
||||
color: #fff; |
|
||||
background: url('@assets/images/btn3.png') no-repeat center center; |
|
||||
background-size: 100% 100%; |
|
||||
} |
|
||||
.delt-btn{ |
|
||||
width: 1.5rem; |
|
||||
height: 0.6rem; |
|
||||
line-height: 0.6rem; |
|
||||
font-size: .28rem; |
|
||||
color: #000; |
|
||||
text-align: center; |
|
||||
border: 0.02rem solid #000; |
|
||||
opacity: 0.6; |
|
||||
border-radius: .4rem; |
|
||||
} |
|
||||
} |
|
||||
} |
|
||||
|
.cart-pay { |
||||
|
position: fixed; |
||||
|
left: 0; |
||||
|
right: 0; |
||||
|
bottom: 0.98rem; |
||||
|
padding: 0 0.32rem; |
||||
|
height: 1rem; |
||||
|
background: linear-gradient(#fff, #f1f1f1); |
||||
|
display: flex; |
||||
|
justify-content: space-between; |
||||
|
align-items: center; |
||||
|
.payment-right { |
||||
|
display: flex; |
||||
|
justify-content: space-between; |
||||
|
align-items: center; |
||||
|
font-size: 0.28rem; |
||||
|
.total-num { |
||||
|
font-size: 0.28rem; |
||||
|
span { |
||||
|
font-size: 0.4rem; |
||||
|
font-weight: bold; |
||||
|
color: #ff3871; |
||||
|
.rmb { |
||||
|
font-style: normal; |
||||
|
font-size: 0.28rem; |
||||
|
text-decoration: none; |
||||
|
} |
||||
|
} |
||||
|
} |
||||
|
.pay-btn { |
||||
|
width: 1.5rem; |
||||
|
height: 0.6rem; |
||||
|
margin-left: 0.4rem; |
||||
|
line-height: 0.6rem; |
||||
|
text-align: center; |
||||
|
color: #fff; |
||||
|
background: url('@assets/images/btn3.png') no-repeat center center; |
||||
|
background-size: 100% 100%; |
||||
|
} |
||||
|
.delt-btn { |
||||
|
width: 1.5rem; |
||||
|
height: 0.6rem; |
||||
|
line-height: 0.6rem; |
||||
|
font-size: 0.28rem; |
||||
|
color: #000; |
||||
|
text-align: center; |
||||
|
border: 0.02rem solid #000; |
||||
|
opacity: 0.6; |
||||
|
border-radius: 0.4rem; |
||||
|
} |
||||
|
} |
||||
|
} |
||||
|
|
||||
.van-checkbox{ |
|
||||
margin-right: .2rem; |
|
||||
} |
|
||||
|
.van-checkbox { |
||||
|
margin-right: 0.2rem; |
||||
|
} |
||||
|
|
||||
:deep(.van-checkbox__icon){ |
|
||||
height: .35rem; |
|
||||
} |
|
||||
:deep(.van-checkbox__icon .van-icon){ |
|
||||
width: .35rem; |
|
||||
height: .35rem; |
|
||||
border-color: rgba(0,0,0,.3); |
|
||||
} |
|
||||
:deep(.van-checkbox__icon--checked .van-icon){ |
|
||||
border: none; |
|
||||
background: url('@assets/images/selected.png') no-repeat transparent; |
|
||||
background-size: .35rem .35rem; |
|
||||
} |
|
||||
:deep(.van-icon-success:before){ |
|
||||
display: none; |
|
||||
} |
|
||||
:deep(.van-checkbox__label){ |
|
||||
font-size: .28rem; |
|
||||
} |
|
||||
|
:deep(.van-checkbox__icon) { |
||||
|
height: 0.35rem; |
||||
|
} |
||||
|
:deep(.van-checkbox__icon .van-icon) { |
||||
|
width: 0.35rem; |
||||
|
height: 0.35rem; |
||||
|
border-color: rgba(0, 0, 0, 0.3); |
||||
|
} |
||||
|
:deep(.van-checkbox__icon--checked .van-icon) { |
||||
|
border: none; |
||||
|
background: url('@assets/images/selected.png') no-repeat transparent; |
||||
|
background-size: 0.35rem 0.35rem; |
||||
|
} |
||||
|
:deep(.van-icon-success:before) { |
||||
|
display: none; |
||||
|
} |
||||
|
:deep(.van-checkbox__label) { |
||||
|
font-size: 0.28rem; |
||||
|
} |
||||
|
|
||||
.bookItem-dialog-detail{ |
|
||||
border-bottom: none; |
|
||||
|
.bookItem-dialog-detail { |
||||
|
border-bottom: none; |
||||
} |
} |
||||
</style> |
</style> |
||||
@ -1,96 +1,26 @@ |
|||||
import request from '@/utils/request' |
import request from '@/utils/request' |
||||
// import qs from 'qs'
|
// import qs from 'qs'
|
||||
|
|
||||
// 数字资源
|
|
||||
export function initNumberResoures(params) { |
|
||||
|
// 书单推荐二级页面
|
||||
|
export function FetchBookRecommendList(params) { |
||||
return request({ |
return request({ |
||||
url: '/dxhtsg/initNumberResoures', |
|
||||
|
url: '/frontDemoApi/bookRecommendList', |
||||
method: 'get', |
method: 'get', |
||||
params: params |
params: params |
||||
}) |
}) |
||||
} |
} |
||||
|
|
||||
// 新书推荐
|
|
||||
export function FetchNewBookRecommend(params) { |
|
||||
|
export function FetchbookOnlineList(params) { |
||||
return request({ |
return request({ |
||||
url: '/dxhtsg/newBookRecommend', |
|
||||
|
url: '/frontDemoApi/bookOnlineList', |
||||
method: 'get', |
method: 'get', |
||||
params: params |
params: params |
||||
}) |
}) |
||||
} |
} |
||||
|
|
||||
// 热门图书
|
|
||||
export function FetchHotBookRecommend(params) { |
|
||||
return request({ |
|
||||
url: '/dxhtsg/hotBookRecommend', |
|
||||
method: 'get', |
|
||||
params: params |
|
||||
}) |
|
||||
} |
|
||||
|
|
||||
// 通过isbn获取图书封面
|
|
||||
export function FetchCoverByISBN(params) { |
|
||||
return request({ |
|
||||
url: '/dxhtsg/getCoverByISBN', |
|
||||
method: 'get', |
|
||||
params: params |
|
||||
// responseType: 'blob'
|
|
||||
}) |
|
||||
} |
|
||||
|
|
||||
// 图书详情
|
|
||||
export function getBookDetailsByISBN(params) { |
|
||||
return request({ |
|
||||
url: '/dxhtsg/getBookDetailsByISBN', |
|
||||
method: 'get', |
|
||||
params: params |
|
||||
}) |
|
||||
} |
|
||||
|
|
||||
// 获取首页书架基本信息
|
|
||||
export function initSmartBookshelf(params) { |
|
||||
return request({ |
|
||||
url: '/dxhtsg/initSmartBookshelf', |
|
||||
method: 'get', |
|
||||
params |
|
||||
}) |
|
||||
} |
|
||||
|
|
||||
// 智能书架-书架详情
|
|
||||
export function FetchInitBookshelfDetails(params) { |
|
||||
return request({ |
|
||||
url: '/dxhtsg/initBookshelfDetails', |
|
||||
method: 'get', |
|
||||
params |
|
||||
}) |
|
||||
} |
|
||||
|
|
||||
// 作者推荐
|
|
||||
export function FetchProposeAuthor(params) { |
|
||||
return request({ |
|
||||
url: '/dxhtsg/proposeAuthor', |
|
||||
method: 'get', |
|
||||
params: params |
|
||||
}) |
|
||||
} |
|
||||
|
|
||||
// 作者推荐
|
|
||||
export function initBookshelfDetails(params) { |
|
||||
return request({ |
|
||||
url: '/dxhtsg/initBookshelfDetails', |
|
||||
method: 'get', |
|
||||
params |
|
||||
}) |
|
||||
} |
|
||||
|
|
||||
export default { |
export default { |
||||
FetchNewBookRecommend, |
|
||||
FetchCoverByISBN, |
|
||||
initNumberResoures, |
|
||||
getBookDetailsByISBN, |
|
||||
initSmartBookshelf, |
|
||||
FetchInitBookshelfDetails, |
|
||||
FetchHotBookRecommend, |
|
||||
FetchProposeAuthor, |
|
||||
initBookshelfDetails |
|
||||
|
FetchBookRecommendList, |
||||
|
FetchbookOnlineList |
||||
} |
} |
||||
Write
Preview
Loading…
Cancel
Save
Reference in new issue