1544 lines
35 KiB
Vue
1544 lines
35 KiB
Vue
<template>
|
||
<view class="container">
|
||
<view class="content">
|
||
<view class="form-card">
|
||
<!-- 第一行:订单编号和ISBN扫码 -->
|
||
<view class="form-row">
|
||
<view class="form-item-half">
|
||
<text class="label">订单编号</text>
|
||
<view class="order-sn-wrapper">
|
||
<text class="order-sn-value">{{ formData.orderSn }}</text>
|
||
<button class="refresh-btn-mini" @click="generateOrderSn" size="mini">刷新</button>
|
||
</view>
|
||
</view>
|
||
<view class="form-item-half">
|
||
<text class="label">ISBN扫码</text>
|
||
<view class="scan-input-wrapper">
|
||
<input
|
||
class="input"
|
||
type="text"
|
||
v-model="formData.isbn"
|
||
placeholder="请点击扫码或输入ISBN"
|
||
placeholder-style="color: #999;"
|
||
/>
|
||
<button class="scan-btn" @click="startScanning" size="mini">扫码</button>
|
||
</view>
|
||
</view>
|
||
</view>
|
||
|
||
<!-- 第二行:支付金额和收货地址 -->
|
||
<view class="form-row">
|
||
<view class="form-item-half">
|
||
<text class="label">支付金额</text>
|
||
<input
|
||
class="input"
|
||
type="digit"
|
||
v-model="formData.payAmount"
|
||
placeholder="请输入支付金额"
|
||
placeholder-style="color: #999;"
|
||
/>
|
||
</view>
|
||
<view class="form-item-half">
|
||
<text class="label">收货地址</text>
|
||
<view class="address-input-wrapper" @click="openAddressModal">
|
||
<input
|
||
class="input"
|
||
type="text"
|
||
:value="displayAddress"
|
||
placeholder="请选择省/市/区/街道"
|
||
placeholder-style="color: #999;"
|
||
readonly
|
||
/>
|
||
<text class="address-arrow">›</text>
|
||
</view>
|
||
</view>
|
||
</view>
|
||
|
||
<!-- 第三行:选择书籍按钮 -->
|
||
<view class="form-item">
|
||
<button class="select-books-btn" @click="showBookSelector">
|
||
<text class="btn-icon">📚</text>
|
||
<text>选择书籍 (共{{ allPagination.total }}本)</text>
|
||
</button>
|
||
</view>
|
||
|
||
<!-- 选中的书籍信息 -->
|
||
<view v-if="selectedBooks.length > 0" class="selected-books-card">
|
||
<view class="selected-books-header">
|
||
<text class="selected-books-title">已选书籍 ({{ selectedBooks.length }})</text>
|
||
<view class="header-actions">
|
||
<text class="change-book-btn" @click="showBookSelector">添加/修改</text>
|
||
<text class="clear-books-btn" @click="clearSelectedBooks">清空已选</text>
|
||
</view>
|
||
</view>
|
||
<scroll-view class="selected-books-list" scroll-y :style="{ 'max-height': selectedBooks.length > 2 ? '600rpx' : 'auto' }">
|
||
<view class="selected-book-item" v-for="(book, index) in selectedBooks" :key="book.id">
|
||
<view class="book-item-left">
|
||
<image
|
||
:src="book.bookPic || '/static/placeholder-book.png'"
|
||
class="book-thumb"
|
||
mode="aspectFill"
|
||
></image>
|
||
<view class="book-info-compact">
|
||
<text class="book-name-compact">{{ book.goodsName }}</text>
|
||
<text class="book-isbn">ISBN: {{ book.isbn }}</text>
|
||
<text class="book-price-compact">¥{{ (book.price / 100).toFixed(2) }}</text>
|
||
</view>
|
||
</view>
|
||
<view class="book-item-right">
|
||
<view class="inventory-control-mini" :class="{ 'disabled-control': book.inventory === 0 }">
|
||
<button class="mini-btn" @click.stop="decreaseBookStock(index)" :class="{ 'disabled': book.inventory === 0 || book.updateStock <= 0 }">−</button>
|
||
<input class="mini-input" type="number" v-model.number="book.updateStock" :disabled="book.inventory === 0" @click.stop />
|
||
<button class="mini-btn" @click.stop="increaseBookStock(index)" :class="{ 'disabled': book.inventory === 0 || book.updateStock >= book.inventory }">+</button>
|
||
</view>
|
||
<view class="stock-info-row">
|
||
<text class="original-stock">原库存: {{ book.inventory }}</text>
|
||
</view>
|
||
<view class="stock-info-row">
|
||
<text class="new-stock" :class="{ 'stock-changed': book.updateStock > 0 }">
|
||
修改后: {{ book.inventory - book.updateStock }}
|
||
</text>
|
||
</view>
|
||
</view>
|
||
</view>
|
||
</scroll-view>
|
||
</view>
|
||
|
||
</view>
|
||
|
||
<!-- 固定在底部的提交按钮 -->
|
||
<view class="submit-btn-wrapper">
|
||
<button class="submit-btn" @click="handleSubmit">提交</button>
|
||
</view>
|
||
</view>
|
||
|
||
<!-- 书籍选择弹窗 -->
|
||
<view v-if="showBookModal" class="book-modal-mask" @click="closeBookModal">
|
||
<view class="book-modal" @click.stop>
|
||
<view class="book-modal-header">
|
||
<text class="book-modal-title">选择书籍 (共{{ pagination.total }}本)</text>
|
||
<text class="close-modal-btn" @click="closeBookModal">✕</text>
|
||
</view>
|
||
<scroll-view class="book-modal-content" scroll-y>
|
||
<view class="book-list">
|
||
<view
|
||
class="book-item"
|
||
v-for="book in bookList"
|
||
:key="book.id"
|
||
:class="{ 'selected-book': selectedBookIds.includes(book.id) }"
|
||
@click="selectBook(book)"
|
||
>
|
||
<view class="book-image-wrapper">
|
||
<image
|
||
:src="book.bookPic || '/static/placeholder-book.png'"
|
||
class="book-image"
|
||
mode="aspectFill"
|
||
></image>
|
||
<view class="stock-badge" :class="{ 'in-stock': book.inventory > 0 }">
|
||
{{ book.inventory > 0 ? '库存:' + book.inventory : '无库存' }}
|
||
</view>
|
||
</view>
|
||
|
||
<view class="book-info">
|
||
<view class="book-name">{{ book.goodsName }}</view>
|
||
<view class="book-detail-item">
|
||
<text class="detail-label">ISBN:</text>
|
||
<text class="detail-value">{{ book.isbn }}</text>
|
||
</view>
|
||
<view class="book-detail-item">
|
||
<text class="detail-label">品相:</text>
|
||
<text class="detail-value condition-tag">{{ book.conditionCode }}</text>
|
||
</view>
|
||
<view class="book-detail-item">
|
||
<text class="detail-label">价格:</text>
|
||
<text class="detail-value price-text">¥{{ (book.price / 100).toFixed(2) }}</text>
|
||
</view>
|
||
<view class="book-detail-item">
|
||
<text class="detail-label">仓库:</text>
|
||
<text class="detail-value">{{ book.warehouseName }}</text>
|
||
</view>
|
||
<view class="book-detail-item">
|
||
<text class="detail-label">位置:</text>
|
||
<text class="detail-value">{{ book.templateName }}</text>
|
||
</view>
|
||
<view class="book-detail-item">
|
||
<text class="detail-label">货号:</text>
|
||
<text class="detail-value art-no">{{ book.artNo }}</text>
|
||
</view>
|
||
</view>
|
||
|
||
<view class="book-action">
|
||
<view class="select-indicator" v-if="selectedBookIds.includes(book.id)">
|
||
<text>✓</text>
|
||
</view>
|
||
</view>
|
||
</view>
|
||
</view>
|
||
|
||
<!-- 加载更多按钮 -->
|
||
<view v-if="pagination.pageNum < pagination.totalPages" class="load-more-container">
|
||
<button class="load-more-btn" @click="loadNextPage">
|
||
加载更多 ({{ pagination.pageNum }}/{{ pagination.totalPages }})
|
||
</button>
|
||
</view>
|
||
|
||
<!-- 没有更多数据提示 -->
|
||
<view v-if="pagination.pageNum >= pagination.totalPages && bookList.length > 0" class="no-more-tip">
|
||
<text class="no-more-text">已加载全部 {{ pagination.total }} 本书籍</text>
|
||
</view>
|
||
</scroll-view>
|
||
<view class="book-modal-footer">
|
||
<button class="modal-btn cancel-btn" @click="closeBookModal">取消</button>
|
||
<button class="modal-btn confirm-btn" @click="confirmBookSelection">确定</button>
|
||
</view>
|
||
</view>
|
||
</view>
|
||
|
||
<!-- 地址输入弹窗 -->
|
||
<view v-if="showAddressModal" class="address-modal-mask" @click="closeAddressModal">
|
||
<view class="address-modal" @click.stop>
|
||
<view class="address-modal-header">
|
||
<text class="address-modal-title">填写收货地址</text>
|
||
<text class="close-modal-btn" @click="closeAddressModal">✕</text>
|
||
</view>
|
||
<view class="address-modal-content">
|
||
<view class="address-form-item">
|
||
<text class="modal-label">省份</text>
|
||
<input class="modal-input" type="text" v-model="formData.province" placeholder="请输入省份" />
|
||
</view>
|
||
<view class="address-form-item">
|
||
<text class="modal-label">城市</text>
|
||
<input class="modal-input" type="text" v-model="formData.city" placeholder="请输入城市" />
|
||
</view>
|
||
<view class="address-form-item">
|
||
<text class="modal-label">区县</text>
|
||
<input class="modal-input" type="text" v-model="formData.country" placeholder="请输入区县" />
|
||
</view>
|
||
<view class="address-form-item">
|
||
<text class="modal-label">街道</text>
|
||
<input class="modal-input" type="text" v-model="formData.town" placeholder="请输入街道" />
|
||
</view>
|
||
</view>
|
||
<view class="address-modal-footer">
|
||
<button class="modal-btn cancel-btn" @click="closeAddressModal">取消</button>
|
||
<button class="modal-btn confirm-btn" @click="confirmAddress">确定</button>
|
||
</view>
|
||
</view>
|
||
</view>
|
||
|
||
<!-- 空状态提示 -->
|
||
<view v-if="hasSearched && bookList.length === 0 && !showBookModal && !showAddressModal" class="empty-state">
|
||
<text class="empty-icon">📚</text>
|
||
<text class="empty-text">暂无相关书籍</text>
|
||
</view>
|
||
</view>
|
||
</template>
|
||
|
||
<script>
|
||
export default {
|
||
data() {
|
||
return {
|
||
formData: {
|
||
orderSn: '',
|
||
isbn: '',
|
||
payAmount: '',
|
||
province: '',
|
||
city: '',
|
||
country: '',
|
||
town: ''
|
||
},
|
||
allBookList: [], // 所有书籍列表
|
||
allPagination: { // 所有书籍的分页信息
|
||
pageSize: 10,
|
||
pageNum: 1,
|
||
total: 0,
|
||
totalPages: 0
|
||
},
|
||
bookList: [], // 当前显示的书籍列表(用于弹窗显示)
|
||
selectedBookIds: [], // 选中的书籍ID数组(多选)
|
||
selectedBooks: [], // 选中的书籍完整信息数组
|
||
showBookModal: false, // 控制书籍选择弹窗显示
|
||
showAddressModal: false, // 控制地址输入弹窗显示
|
||
hasSearched: false, // 是否已搜索过
|
||
updateInventory: 0, // 修改后的库存数量
|
||
isbnFilter: false, // 是否正在进行ISBN筛选
|
||
pagination: {
|
||
pageSize: 10,
|
||
pageNum: 1,
|
||
total: 0,
|
||
totalPages: 0
|
||
} // 分页信息
|
||
}
|
||
},
|
||
computed: {
|
||
// 显示完整地址
|
||
displayAddress() {
|
||
const { province, city, country, town } = this.formData
|
||
const parts = [province, city, country, town].filter(Boolean)
|
||
return parts.length > 0 ? parts.join(' ') : ''
|
||
}
|
||
},
|
||
onLoad() {
|
||
this.generateOrderSn()
|
||
// 页面加载时获取所有商品
|
||
this.fetchAllBooks()
|
||
},
|
||
methods: {
|
||
// 生成订单编号
|
||
generateOrderSn() {
|
||
const timestamp = Date.now()
|
||
const random = Math.floor(Math.random() * 1000)
|
||
this.formData.orderSn = `${timestamp}${random}`.substring(0, 19)
|
||
},
|
||
|
||
// 获取所有商品列表
|
||
async fetchAllBooks(pageNum = 1) {
|
||
try {
|
||
if (pageNum === 1) {
|
||
uni.showLoading({
|
||
title: '加载中...'
|
||
})
|
||
}
|
||
|
||
// 从本地获取 userId
|
||
const userId = uni.getStorageSync('userId') || ''
|
||
|
||
// 调用接口获取所有商品
|
||
const res = await uni.request({
|
||
url: 'https://api.buzhiyushu.cn/zhishu/shopGoods/list',
|
||
method: 'GET',
|
||
data: {
|
||
pageSize: this.allPagination.pageSize,
|
||
pageNum: pageNum,
|
||
isQueryAllGoods: 1,
|
||
userId: userId
|
||
}
|
||
})
|
||
|
||
if (pageNum === 1) {
|
||
uni.hideLoading()
|
||
}
|
||
|
||
console.log('获取所有商品接口响应:', res)
|
||
|
||
// 判断是否成功
|
||
if (res[1].data && res[1].data.code === 200) {
|
||
const rows = res[1].data.rows || []
|
||
const total = res[1].data.total || 0
|
||
|
||
// 如果是第一页,替换列表;否则追加
|
||
if (pageNum === 1) {
|
||
this.bookList = rows
|
||
this.allBookList = rows
|
||
} else {
|
||
this.bookList = [...this.bookList, ...rows]
|
||
this.allBookList = [...this.allBookList, ...rows]
|
||
}
|
||
|
||
this.hasSearched = true
|
||
this.allPagination.total = total
|
||
this.allPagination.totalPages = Math.ceil(total / this.allPagination.pageSize)
|
||
this.allPagination.pageNum = pageNum
|
||
|
||
// 同步更新 pagination(如果不是ISBN筛选模式)
|
||
if (!this.isbnFilter) {
|
||
this.pagination = {
|
||
total: total,
|
||
totalPages: Math.ceil(total / this.allPagination.pageSize),
|
||
pageNum: pageNum,
|
||
pageSize: this.allPagination.pageSize
|
||
}
|
||
}
|
||
} else {
|
||
uni.showToast({
|
||
title: res[1].data.msg || '获取商品列表失败',
|
||
icon: 'none',
|
||
duration: 2000
|
||
})
|
||
}
|
||
|
||
} catch (error) {
|
||
uni.hideLoading()
|
||
console.error('获取所有商品失败:', error)
|
||
this.hasSearched = true
|
||
uni.showToast({
|
||
title: '网络请求失败',
|
||
icon: 'none',
|
||
duration: 2000
|
||
})
|
||
}
|
||
},
|
||
|
||
// 扫码功能
|
||
startScanning() {
|
||
uni.scanCode({
|
||
onlyFromCamera: true,
|
||
scanType: ['bar'],
|
||
success: (res) => {
|
||
console.log('扫码结果:', res.result)
|
||
this.formData.isbn = res.result
|
||
// 扫码成功后调用接口
|
||
this.fetchBookInfoByIsbn(res.result)
|
||
},
|
||
fail: (err) => {
|
||
console.error('扫码失败:', err)
|
||
uni.showToast({
|
||
title: '扫码失败',
|
||
icon: 'none',
|
||
duration: 2000
|
||
})
|
||
}
|
||
})
|
||
},
|
||
|
||
// 根据ISBN调用接口获取书籍信息
|
||
async fetchBookInfoByIsbn(isbn, pageNum = 1) {
|
||
try {
|
||
uni.showLoading({
|
||
title: '加载中...'
|
||
})
|
||
|
||
// 从本地获取 userId
|
||
const userId = uni.getStorageSync('userId') || ''
|
||
|
||
// 调用实际的接口
|
||
const res = await uni.request({
|
||
url: 'https://api.buzhiyushu.cn/zhishu/shopGoods/list',
|
||
method: 'GET',
|
||
data: {
|
||
pageSize: this.pagination.pageSize,
|
||
pageNum: pageNum,
|
||
isQueryAllGoods: 1,
|
||
isbn: isbn,
|
||
userId: userId
|
||
}
|
||
})
|
||
|
||
uni.hideLoading()
|
||
|
||
console.log('接口响应:', res)
|
||
|
||
// 判断是否成功
|
||
if (res[1].data && res[1].data.code === 200) {
|
||
const rows = res[1].data.rows || []
|
||
const total = res[1].data.total || 0
|
||
|
||
// 如果是第一页,替换列表;否则追加
|
||
if (pageNum === 1) {
|
||
this.bookList = rows
|
||
this.isbnFilter = true // 标记正在进行ISBN筛选
|
||
} else {
|
||
this.bookList = [...this.bookList, ...rows]
|
||
}
|
||
|
||
this.hasSearched = true
|
||
this.pagination.total = total
|
||
this.pagination.totalPages = Math.ceil(total / this.pagination.pageSize)
|
||
this.pagination.pageNum = pageNum
|
||
|
||
if (this.bookList.length > 0 && pageNum === 1) {
|
||
// 自动打开书籍选择弹窗
|
||
this.showBookModal = true
|
||
} else if (rows.length === 0 && pageNum === 1) {
|
||
uni.showToast({
|
||
title: '暂无相关书籍',
|
||
icon: 'none',
|
||
duration: 2000
|
||
})
|
||
}
|
||
} else {
|
||
uni.showToast({
|
||
title: res[1].data.msg || '查询失败',
|
||
icon: 'none',
|
||
duration: 2000
|
||
})
|
||
}
|
||
|
||
} catch (error) {
|
||
uni.hideLoading()
|
||
console.error('获取书籍信息失败:', error)
|
||
this.hasSearched = true
|
||
uni.showToast({
|
||
title: '网络请求失败',
|
||
icon: 'none',
|
||
duration: 2000
|
||
})
|
||
}
|
||
},
|
||
|
||
// 加载下一页
|
||
async loadNextPage() {
|
||
// 根据是否是ISBN筛选模式来决定加载哪个数据源
|
||
if (this.isbnFilter) {
|
||
// ISBN筛选模式:加载ISBN筛选的下一页
|
||
if (this.pagination.pageNum < this.pagination.totalPages) {
|
||
await this.fetchBookInfoByIsbn(this.formData.isbn, this.pagination.pageNum + 1)
|
||
} else {
|
||
uni.showToast({
|
||
title: '没有更多数据了',
|
||
icon: 'none'
|
||
})
|
||
}
|
||
} else {
|
||
// 所有书籍模式:加载所有书籍的下一页
|
||
if (this.allPagination.pageNum < this.allPagination.totalPages) {
|
||
await this.fetchAllBooks(this.allPagination.pageNum + 1)
|
||
} else {
|
||
uni.showToast({
|
||
title: '没有更多数据了',
|
||
icon: 'none'
|
||
})
|
||
}
|
||
}
|
||
},
|
||
|
||
// 显示书籍选择器
|
||
showBookSelector() {
|
||
if (this.allBookList.length === 0) {
|
||
uni.showToast({
|
||
title: '暂无商品列表',
|
||
icon: 'none'
|
||
})
|
||
return
|
||
}
|
||
// 显示所有书籍,清除ISBN筛选状态
|
||
this.bookList = this.allBookList
|
||
// 使用所有书籍的分页信息
|
||
this.pagination = { ...this.allPagination }
|
||
this.isbnFilter = false
|
||
// 清除ISBN输入,表示显示全部书籍
|
||
this.formData.isbn = ''
|
||
this.showBookModal = true
|
||
},
|
||
|
||
// 关闭书籍选择弹窗
|
||
closeBookModal() {
|
||
this.showBookModal = false
|
||
// 关闭弹窗后,如果不是扫码筛选模式,恢复显示所有书籍
|
||
// 如果是扫码筛选模式,保持筛选结果,以便用户可以继续操作
|
||
if (!this.isbnFilter) {
|
||
this.bookList = this.allBookList
|
||
this.formData.isbn = ''
|
||
}
|
||
// 如果没有选中书籍,重置选中状态
|
||
if (this.selectedBooks.length === 0) {
|
||
this.selectedBookIds = []
|
||
}
|
||
},
|
||
|
||
// 选择书籍(多选)
|
||
selectBook(book) {
|
||
const index = this.selectedBookIds.indexOf(book.id)
|
||
if (index > -1) {
|
||
// 已选中,取消选择
|
||
this.selectedBookIds.splice(index, 1)
|
||
} else {
|
||
// 未选中,添加选择
|
||
this.selectedBookIds.push(book.id)
|
||
}
|
||
console.log('选中的书籍ID:', this.selectedBookIds)
|
||
},
|
||
|
||
// 打开地址弹窗
|
||
openAddressModal() {
|
||
this.showAddressModal = true
|
||
},
|
||
|
||
// 关闭地址弹窗
|
||
closeAddressModal() {
|
||
this.showAddressModal = false
|
||
},
|
||
|
||
// 确认地址
|
||
confirmAddress() {
|
||
this.showAddressModal = false
|
||
},
|
||
|
||
// 确认书籍选择
|
||
confirmBookSelection() {
|
||
if (this.selectedBookIds.length === 0) {
|
||
uni.showToast({
|
||
title: '请至少选择一本书籍',
|
||
icon: 'none'
|
||
})
|
||
return
|
||
}
|
||
|
||
// 合并所有可能的书籍来源(allBookList + 当前bookList中独特的书籍)
|
||
let allBooks = [...this.allBookList]
|
||
|
||
// 如果当前bookList中有allBookList中没有的书籍(比如ISBN筛选的结果),也要合并进去
|
||
this.bookList.forEach(book => {
|
||
if (!allBooks.find(ab => ab.id === book.id)) {
|
||
allBooks.push(book)
|
||
}
|
||
})
|
||
|
||
// 从合并后的所有书籍中查找选中的书籍
|
||
let newSelectedBooks = allBooks.filter(book => this.selectedBookIds.includes(book.id))
|
||
|
||
// 保留现有的 updateStock 值,避免重新选择时丢失之前的修改
|
||
// 初始值为 0,表示要减去的库存数量
|
||
newSelectedBooks = newSelectedBooks.map(book => {
|
||
const existing = this.selectedBooks.find(sb => sb.id === book.id)
|
||
return {
|
||
...book,
|
||
updateStock: existing ? existing.updateStock : 0
|
||
}
|
||
})
|
||
|
||
this.selectedBooks = newSelectedBooks
|
||
this.showBookModal = false
|
||
uni.showToast({
|
||
title: `已选择 ${this.selectedBooks.length} 本书籍`,
|
||
icon: 'success',
|
||
duration: 1500
|
||
})
|
||
},
|
||
|
||
// 增加书籍库存(实际是增加要减去的数量)
|
||
increaseBookStock(index) {
|
||
const book = this.selectedBooks[index]
|
||
// 只有当原库存大于0时,才允许增加要减去的数量
|
||
// 最大值不能超过原库存
|
||
if (book.inventory > 0 && book.updateStock < book.inventory) {
|
||
book.updateStock++
|
||
}
|
||
},
|
||
|
||
// 减少书籍库存(实际是减少要减去的数量)
|
||
decreaseBookStock(index) {
|
||
const book = this.selectedBooks[index]
|
||
// 只有当原库存大于0且当前要减去的数量大于0时,才允许减少
|
||
// 最小值为 0
|
||
if (book.inventory > 0 && book.updateStock > 0) {
|
||
book.updateStock--
|
||
}
|
||
},
|
||
|
||
// 清空已选书籍
|
||
clearSelectedBooks() {
|
||
uni.showModal({
|
||
title: '确认清空',
|
||
content: '确定要清空所有已选书籍吗?',
|
||
success: (res) => {
|
||
if (res.confirm) {
|
||
this.selectedBooks = []
|
||
this.selectedBookIds = []
|
||
uni.showToast({
|
||
title: '已清空所有书籍',
|
||
icon: 'success',
|
||
duration: 1500
|
||
})
|
||
}
|
||
}
|
||
})
|
||
},
|
||
|
||
// 提交表单
|
||
async handleSubmit() {
|
||
if (this.selectedBooks.length === 0) {
|
||
uni.showToast({
|
||
title: '请至少选择一本书籍',
|
||
icon: 'none'
|
||
})
|
||
return
|
||
}
|
||
if (!this.formData.payAmount) {
|
||
uni.showToast({
|
||
title: '请输入支付金额',
|
||
icon: 'none'
|
||
})
|
||
return
|
||
}
|
||
if (!this.formData.province) {
|
||
uni.showToast({
|
||
title: '请输入省份',
|
||
icon: 'none'
|
||
})
|
||
return
|
||
}
|
||
if (!this.formData.city) {
|
||
uni.showToast({
|
||
title: '请输入城市',
|
||
icon: 'none'
|
||
})
|
||
return
|
||
}
|
||
if (!this.formData.country) {
|
||
uni.showToast({
|
||
title: '请输入区县',
|
||
icon: 'none'
|
||
})
|
||
return
|
||
}
|
||
if (!this.formData.town) {
|
||
uni.showToast({
|
||
title: '请输入街道',
|
||
icon: 'none'
|
||
})
|
||
return
|
||
}
|
||
|
||
// 从本地获取 userId
|
||
const userId = uni.getStorageSync('userId') || ''
|
||
|
||
// 构建提交数据
|
||
const submitData = {
|
||
orderSn: this.formData.orderSn,
|
||
payAmount: parseFloat(this.formData.payAmount),
|
||
province: this.formData.province,
|
||
city: this.formData.city,
|
||
country: this.formData.country,
|
||
town: this.formData.town,
|
||
createdBy: userId,
|
||
zhishuShopGoodsList: this.selectedBooks.map(book => ({
|
||
id: book.id,
|
||
goodsName: book.goodsName,
|
||
price: book.price,
|
||
inventory: book.inventory,
|
||
updateInventory: book.updateStock,
|
||
artNo: book.artNo,
|
||
bookPic: book.bookPic
|
||
}))
|
||
}
|
||
|
||
console.log('提交的数据:', submitData)
|
||
|
||
try {
|
||
uni.showLoading({
|
||
title: '提交中...'
|
||
})
|
||
|
||
// 调用接口
|
||
const res = await uni.request({
|
||
url: 'http://192.168.101.127:8080/zhishu/erpGoodsOrder/addErpGoodsOrder',
|
||
method: 'POST',
|
||
data: submitData,
|
||
header: {
|
||
'Content-Type': 'application/json'
|
||
}
|
||
})
|
||
|
||
uni.hideLoading()
|
||
|
||
console.log('接口响应:', res)
|
||
|
||
if (res[1].data && res[1].data.code === 200) {
|
||
uni.showToast({
|
||
title: '提交成功',
|
||
icon: 'success',
|
||
duration: 2000
|
||
})
|
||
|
||
// 清空表单和已选书籍(保留收货地址)
|
||
setTimeout(() => {
|
||
this.generateOrderSn()
|
||
this.formData.isbn = ''
|
||
this.formData.payAmount = ''
|
||
// 不清空收货地址字段
|
||
// this.formData.province = ''
|
||
// this.formData.city = ''
|
||
// this.formData.country = ''
|
||
// this.formData.town = ''
|
||
this.selectedBooks = []
|
||
this.selectedBookIds = []
|
||
}, 2000)
|
||
} else {
|
||
uni.showToast({
|
||
title: res[1].data.msg || '提交失败',
|
||
icon: 'none',
|
||
duration: 2000
|
||
})
|
||
}
|
||
} catch (error) {
|
||
uni.hideLoading()
|
||
console.error('提交失败:', error)
|
||
uni.showToast({
|
||
title: '网络请求失败',
|
||
icon: 'none',
|
||
duration: 2000
|
||
})
|
||
}
|
||
}
|
||
}
|
||
}
|
||
</script>
|
||
|
||
<style scoped>
|
||
.container {
|
||
min-height: 100vh;
|
||
background-color: #f5f5f5;
|
||
}
|
||
|
||
.content {
|
||
padding: 30rpx;
|
||
padding-bottom: 150rpx;
|
||
}
|
||
|
||
.form-card {
|
||
background-color: #fff;
|
||
border-radius: 20rpx;
|
||
padding: 30rpx;
|
||
margin-bottom: 0;
|
||
height: calc(100vh - 240rpx);
|
||
overflow-y: auto;
|
||
}
|
||
|
||
.form-item {
|
||
margin-bottom: 30rpx;
|
||
}
|
||
|
||
/* 表单行布局 */
|
||
.form-row {
|
||
display: flex;
|
||
gap: 20rpx;
|
||
margin-bottom: 30rpx;
|
||
}
|
||
|
||
.form-item-half {
|
||
flex: 1;
|
||
min-width: 0;
|
||
}
|
||
|
||
.form-item-half .label {
|
||
display: block;
|
||
font-size: 28rpx;
|
||
color: #333;
|
||
margin-bottom: 15rpx;
|
||
font-weight: 500;
|
||
}
|
||
|
||
/* 订单编号小号按钮 */
|
||
.refresh-btn-mini {
|
||
height: 60rpx;
|
||
line-height: 60rpx;
|
||
font-size: 24rpx;
|
||
background-color: #3c9cff;
|
||
color: #fff;
|
||
border: none;
|
||
padding: 0 20rpx;
|
||
}
|
||
|
||
.order-sn-wrapper {
|
||
display: flex;
|
||
align-items: center;
|
||
gap: 15rpx;
|
||
}
|
||
|
||
.order-sn-value {
|
||
flex: 1;
|
||
height: 70rpx;
|
||
line-height: 70rpx;
|
||
border: 1rpx solid #e5e5e5;
|
||
border-radius: 10rpx;
|
||
padding: 0 15rpx;
|
||
font-size: 22rpx;
|
||
color: #666;
|
||
background-color: #f5f5f5;
|
||
white-space: nowrap;
|
||
overflow: hidden;
|
||
text-overflow: ellipsis;
|
||
}
|
||
|
||
.scan-input-wrapper {
|
||
display: flex;
|
||
align-items: center;
|
||
gap: 15rpx;
|
||
}
|
||
|
||
.scan-input-wrapper .input {
|
||
flex: 1;
|
||
height: 70rpx;
|
||
}
|
||
|
||
.scan-btn {
|
||
height: 60rpx;
|
||
line-height: 60rpx;
|
||
font-size: 24rpx;
|
||
background-color: #3c9cff;
|
||
color: #fff;
|
||
border: none;
|
||
padding: 0 20rpx;
|
||
white-space: nowrap;
|
||
}
|
||
|
||
.label {
|
||
display: block;
|
||
font-size: 28rpx;
|
||
color: #333;
|
||
margin-bottom: 15rpx;
|
||
font-weight: 500;
|
||
}
|
||
|
||
.input {
|
||
width: 100%;
|
||
height: 80rpx;
|
||
border: 1rpx solid #e5e5e5;
|
||
border-radius: 10rpx;
|
||
padding: 0 20rpx;
|
||
font-size: 28rpx;
|
||
box-sizing: border-box;
|
||
}
|
||
|
||
/* 固定在底部的提交按钮 */
|
||
.submit-btn-wrapper {
|
||
position: fixed;
|
||
bottom: 0;
|
||
left: 0;
|
||
right: 0;
|
||
background-color: #fff;
|
||
padding: 20rpx 30rpx;
|
||
box-shadow: 0 -2rpx 10rpx rgba(0, 0, 0, 0.1);
|
||
z-index: 100;
|
||
}
|
||
|
||
.submit-btn {
|
||
width: 100%;
|
||
height: 90rpx;
|
||
line-height: 90rpx;
|
||
background-color: #3c9cff;
|
||
color: #fff;
|
||
font-size: 32rpx;
|
||
border: none;
|
||
border-radius: 10rpx;
|
||
}
|
||
|
||
.submit-btn:active {
|
||
opacity: 0.8;
|
||
}
|
||
|
||
/* 选择书籍按钮 */
|
||
.select-books-btn {
|
||
width: 100%;
|
||
height: 90rpx;
|
||
line-height: 90rpx;
|
||
background-color: #fff;
|
||
border: 2rpx dashed #3c9cff;
|
||
color: #3c9cff;
|
||
font-size: 30rpx;
|
||
border-radius: 10rpx;
|
||
display: flex;
|
||
align-items: center;
|
||
justify-content: center;
|
||
gap: 10rpx;
|
||
margin-top: 10rpx;
|
||
}
|
||
|
||
.select-books-btn .btn-icon {
|
||
font-size: 36rpx;
|
||
}
|
||
|
||
.select-books-btn:active {
|
||
background-color: #f0f7ff;
|
||
}
|
||
|
||
/* 已选书籍卡片(简化版) */
|
||
.selected-books-card {
|
||
background-color: #fff;
|
||
border-radius: 16rpx;
|
||
padding: 25rpx;
|
||
margin-bottom: 30rpx;
|
||
box-shadow: 0 2rpx 12rpx rgba(0, 0, 0, 0.08);
|
||
}
|
||
|
||
.selected-books-header {
|
||
display: flex;
|
||
justify-content: space-between;
|
||
align-items: center;
|
||
margin-bottom: 20rpx;
|
||
padding-bottom: 15rpx;
|
||
border-bottom: 1rpx solid #f0f0f0;
|
||
}
|
||
|
||
.selected-books-title {
|
||
font-size: 30rpx;
|
||
font-weight: bold;
|
||
color: #333;
|
||
}
|
||
|
||
.header-actions {
|
||
display: flex;
|
||
gap: 15rpx;
|
||
align-items: center;
|
||
}
|
||
|
||
.change-book-btn {
|
||
font-size: 24rpx;
|
||
color: #3c9cff;
|
||
padding: 8rpx 16rpx;
|
||
background-color: #f0f7ff;
|
||
border-radius: 20rpx;
|
||
}
|
||
|
||
.clear-books-btn {
|
||
font-size: 24rpx;
|
||
color: #ff5722;
|
||
padding: 8rpx 16rpx;
|
||
background-color: #fff3e0;
|
||
border-radius: 20rpx;
|
||
}
|
||
|
||
.selected-books-list {
|
||
max-height: 400rpx;
|
||
}
|
||
|
||
.selected-book-item {
|
||
display: flex;
|
||
justify-content: space-between;
|
||
align-items: center;
|
||
padding: 15rpx;
|
||
background-color: #f9f9f9;
|
||
border-radius: 10rpx;
|
||
margin-bottom: 12rpx;
|
||
transition: all 0.2s;
|
||
}
|
||
|
||
.selected-book-item:last-child {
|
||
margin-bottom: 0;
|
||
}
|
||
|
||
.book-item-left {
|
||
display: flex;
|
||
align-items: center;
|
||
flex: 1;
|
||
min-width: 0;
|
||
}
|
||
|
||
.book-thumb {
|
||
width: 80rpx;
|
||
height: 110rpx;
|
||
border-radius: 6rpx;
|
||
background-color: #e5e5e5;
|
||
margin-right: 15rpx;
|
||
flex-shrink: 0;
|
||
}
|
||
|
||
.book-info-compact {
|
||
flex: 1;
|
||
display: flex;
|
||
flex-direction: column;
|
||
gap: 6rpx;
|
||
min-width: 0;
|
||
}
|
||
|
||
.book-name-compact {
|
||
font-size: 26rpx;
|
||
font-weight: 500;
|
||
color: #333;
|
||
line-height: 36rpx;
|
||
overflow: hidden;
|
||
text-overflow: ellipsis;
|
||
white-space: nowrap;
|
||
}
|
||
|
||
.book-isbn {
|
||
font-size: 22rpx;
|
||
color: #999;
|
||
}
|
||
|
||
.book-price-compact {
|
||
font-size: 24rpx;
|
||
font-weight: bold;
|
||
color: #ff5722;
|
||
margin-top: 4rpx;
|
||
}
|
||
|
||
.book-item-right {
|
||
display: flex;
|
||
flex-direction: column;
|
||
align-items: flex-end;
|
||
gap: 8rpx;
|
||
flex-shrink: 0;
|
||
margin-left: 15rpx;
|
||
min-width: 140rpx;
|
||
}
|
||
|
||
/* 迷你库存控制器 */
|
||
.inventory-control-mini {
|
||
display: flex;
|
||
align-items: center;
|
||
gap: 8rpx;
|
||
background-color: #f5f5f5;
|
||
border-radius: 8rpx;
|
||
padding: 4rpx;
|
||
}
|
||
|
||
.inventory-control-mini.disabled-control {
|
||
opacity: 0.5;
|
||
}
|
||
|
||
.mini-btn {
|
||
width: 44rpx;
|
||
height: 44rpx;
|
||
background-color: #fff;
|
||
border: 1rpx solid #e0e0e0;
|
||
border-radius: 6rpx;
|
||
display: flex;
|
||
align-items: center;
|
||
justify-content: center;
|
||
font-size: 28rpx;
|
||
color: #3c9cff;
|
||
padding: 0;
|
||
line-height: 1;
|
||
flex-shrink: 0;
|
||
transition: all 0.2s;
|
||
}
|
||
|
||
.mini-btn:active {
|
||
background-color: #3c9cff;
|
||
color: #fff;
|
||
transform: scale(0.95);
|
||
}
|
||
|
||
.mini-btn.disabled {
|
||
opacity: 0.3;
|
||
background-color: #f5f5f5;
|
||
}
|
||
|
||
.mini-input:disabled {
|
||
opacity: 0.5;
|
||
background-color: #e5e5e5;
|
||
}
|
||
|
||
.mini-input {
|
||
width: 70rpx;
|
||
height: 44rpx;
|
||
text-align: center;
|
||
font-size: 24rpx;
|
||
font-weight: bold;
|
||
color: #333;
|
||
background-color: #fff;
|
||
border: 1rpx solid #e0e0e0;
|
||
border-radius: 6rpx;
|
||
padding: 0;
|
||
flex-shrink: 0;
|
||
}
|
||
|
||
.stock-info-row {
|
||
display: flex;
|
||
align-items: center;
|
||
gap: 8rpx;
|
||
font-size: 20rpx;
|
||
}
|
||
|
||
.original-stock {
|
||
color: #999;
|
||
}
|
||
|
||
.new-stock {
|
||
color: #999;
|
||
}
|
||
|
||
.new-stock.stock-changed {
|
||
color: #ff5722;
|
||
font-weight: 500;
|
||
}
|
||
|
||
.stock-change {
|
||
color: #999;
|
||
background-color: #f5f5f5;
|
||
padding: 2rpx 8rpx;
|
||
border-radius: 4rpx;
|
||
}
|
||
|
||
.stock-change.changed {
|
||
color: #fff;
|
||
background-color: #3c9cff;
|
||
font-weight: 500;
|
||
}
|
||
|
||
/* 书籍选择模态框 */
|
||
.book-modal-mask {
|
||
position: fixed;
|
||
top: 0;
|
||
left: 0;
|
||
right: 0;
|
||
bottom: 0;
|
||
background-color: rgba(0, 0, 0, 0.5);
|
||
z-index: 1000;
|
||
display: flex;
|
||
align-items: center;
|
||
justify-content: center;
|
||
padding: 30rpx;
|
||
}
|
||
|
||
.book-modal {
|
||
width: 100%;
|
||
max-width: 660rpx;
|
||
background-color: #fff;
|
||
border-radius: 20rpx;
|
||
overflow: hidden;
|
||
display: flex;
|
||
flex-direction: column;
|
||
max-height: 80vh;
|
||
}
|
||
|
||
.book-modal-header {
|
||
display: flex;
|
||
justify-content: space-between;
|
||
align-items: center;
|
||
padding: 30rpx;
|
||
border-bottom: 1rpx solid #e5e5e5;
|
||
background-color: #fff;
|
||
flex-shrink: 0;
|
||
}
|
||
|
||
.book-modal-title {
|
||
font-size: 32rpx;
|
||
font-weight: bold;
|
||
color: #333;
|
||
}
|
||
|
||
.close-modal-btn {
|
||
font-size: 40rpx;
|
||
color: #999;
|
||
padding: 0 10rpx;
|
||
line-height: 1;
|
||
}
|
||
|
||
.book-modal-content {
|
||
flex: 1;
|
||
overflow-y: auto;
|
||
padding: 20rpx 30rpx;
|
||
background-color: #f9f9f9;
|
||
width: 100%;
|
||
box-sizing: border-box;
|
||
}
|
||
|
||
.book-list {
|
||
display: flex;
|
||
flex-direction: column;
|
||
gap: 20rpx;
|
||
width: 100%;
|
||
box-sizing: border-box;
|
||
}
|
||
|
||
.book-item {
|
||
display: flex;
|
||
padding: 20rpx;
|
||
padding-right: 80rpx;
|
||
background-color: #fff;
|
||
border-radius: 12rpx;
|
||
border: 2rpx solid transparent;
|
||
transition: all 0.3s;
|
||
position: relative;
|
||
box-shadow: 0 2rpx 8rpx rgba(0, 0, 0, 0.05);
|
||
width: 100%;
|
||
box-sizing: border-box;
|
||
overflow: hidden;
|
||
}
|
||
|
||
.book-item.selected-book {
|
||
border-color: #3c9cff;
|
||
background-color: #f0f7ff;
|
||
box-shadow: 0 4rpx 12rpx rgba(60, 156, 255, 0.2);
|
||
}
|
||
|
||
.book-image-wrapper {
|
||
width: 140rpx;
|
||
height: 200rpx;
|
||
margin-right: 20rpx;
|
||
position: relative;
|
||
flex-shrink: 0;
|
||
flex-grow: 0;
|
||
}
|
||
|
||
.book-image {
|
||
width: 100%;
|
||
height: 100%;
|
||
border-radius: 8rpx;
|
||
background-color: #e5e5e5;
|
||
}
|
||
|
||
.stock-badge {
|
||
position: absolute;
|
||
bottom: 0;
|
||
left: 0;
|
||
right: 0;
|
||
background-color: rgba(0, 0, 0, 0.7);
|
||
color: #fff;
|
||
font-size: 20rpx;
|
||
text-align: center;
|
||
padding: 6rpx 0;
|
||
border-bottom-left-radius: 8rpx;
|
||
border-bottom-right-radius: 8rpx;
|
||
}
|
||
|
||
.stock-badge.in-stock {
|
||
background-color: rgba(76, 175, 80, 0.9);
|
||
}
|
||
|
||
.book-info {
|
||
flex: 1;
|
||
display: flex;
|
||
flex-direction: column;
|
||
gap: 6rpx;
|
||
min-width: 0;
|
||
overflow: hidden;
|
||
flex-shrink: 1;
|
||
}
|
||
|
||
.book-name {
|
||
font-size: 26rpx;
|
||
font-weight: bold;
|
||
color: #333;
|
||
line-height: 36rpx;
|
||
display: -webkit-box;
|
||
-webkit-box-orient: vertical;
|
||
-webkit-line-clamp: 2;
|
||
overflow: hidden;
|
||
text-overflow: ellipsis;
|
||
}
|
||
|
||
.book-detail-item {
|
||
display: flex;
|
||
align-items: center;
|
||
font-size: 22rpx;
|
||
line-height: 30rpx;
|
||
}
|
||
|
||
.detail-label {
|
||
color: #999;
|
||
margin-right: 6rpx;
|
||
flex-shrink: 0;
|
||
}
|
||
|
||
.detail-value {
|
||
color: #666;
|
||
flex: 1;
|
||
word-break: break-all;
|
||
overflow: hidden;
|
||
text-overflow: ellipsis;
|
||
white-space: nowrap;
|
||
min-width: 0;
|
||
}
|
||
|
||
.condition-tag {
|
||
display: inline-block;
|
||
padding: 2rpx 10rpx;
|
||
background-color: #fff3cd;
|
||
color: #856404;
|
||
border-radius: 4rpx;
|
||
font-size: 20rpx;
|
||
}
|
||
|
||
.price-text {
|
||
color: #ff5722;
|
||
font-weight: bold;
|
||
font-size: 26rpx;
|
||
}
|
||
|
||
.art-no {
|
||
font-family: monospace;
|
||
font-size: 18rpx;
|
||
color: #999;
|
||
}
|
||
|
||
.book-action {
|
||
position: absolute;
|
||
top: 20rpx;
|
||
right: 20rpx;
|
||
flex-shrink: 0;
|
||
width: 45rpx;
|
||
height: 45rpx;
|
||
}
|
||
|
||
.select-indicator {
|
||
width: 45rpx;
|
||
height: 45rpx;
|
||
background-color: #3c9cff;
|
||
border-radius: 50%;
|
||
display: flex;
|
||
align-items: center;
|
||
justify-content: center;
|
||
color: #fff;
|
||
font-size: 28rpx;
|
||
font-weight: bold;
|
||
}
|
||
|
||
/* 加载更多按钮 */
|
||
.load-more-container {
|
||
padding: 20rpx 0;
|
||
display: flex;
|
||
justify-content: center;
|
||
}
|
||
|
||
.load-more-btn {
|
||
width: 100%;
|
||
height: 70rpx;
|
||
line-height: 70rpx;
|
||
background-color: #fff;
|
||
border: 2rpx solid #3c9cff;
|
||
color: #3c9cff;
|
||
font-size: 28rpx;
|
||
border-radius: 10rpx;
|
||
text-align: center;
|
||
}
|
||
|
||
.load-more-btn:active {
|
||
background-color: #3c9cff;
|
||
color: #fff;
|
||
}
|
||
|
||
/* 没有更多提示 */
|
||
.no-more-tip {
|
||
padding: 20rpx 0;
|
||
text-align: center;
|
||
}
|
||
|
||
.no-more-text {
|
||
font-size: 24rpx;
|
||
color: #999;
|
||
}
|
||
|
||
.book-modal-footer {
|
||
display: flex;
|
||
gap: 20rpx;
|
||
padding: 20rpx 30rpx;
|
||
border-top: 1rpx solid #e5e5e5;
|
||
background-color: #fff;
|
||
flex-shrink: 0;
|
||
}
|
||
|
||
.modal-btn {
|
||
flex: 1;
|
||
height: 80rpx;
|
||
line-height: 80rpx;
|
||
border-radius: 10rpx;
|
||
font-size: 28rpx;
|
||
border: none;
|
||
}
|
||
|
||
.cancel-btn {
|
||
background-color: #f5f5f5;
|
||
color: #666;
|
||
}
|
||
|
||
.confirm-btn {
|
||
background-color: #3c9cff;
|
||
color: #fff;
|
||
}
|
||
|
||
/* 空状态 */
|
||
.empty-state {
|
||
display: flex;
|
||
flex-direction: column;
|
||
align-items: center;
|
||
justify-content: center;
|
||
padding: 100rpx 0;
|
||
background-color: #fff;
|
||
border-radius: 20rpx;
|
||
margin-top: 30rpx;
|
||
}
|
||
|
||
.empty-icon {
|
||
font-size: 80rpx;
|
||
margin-bottom: 20rpx;
|
||
}
|
||
|
||
.empty-text {
|
||
font-size: 28rpx;
|
||
color: #999;
|
||
}
|
||
|
||
/* 地址输入框 */
|
||
.address-input-wrapper {
|
||
position: relative;
|
||
display: flex;
|
||
align-items: center;
|
||
}
|
||
|
||
.address-arrow {
|
||
position: absolute;
|
||
right: 20rpx;
|
||
font-size: 40rpx;
|
||
color: #999;
|
||
font-weight: bold;
|
||
line-height: 80rpx;
|
||
pointer-events: none;
|
||
}
|
||
|
||
/* 地址输入弹窗 */
|
||
.address-modal-mask {
|
||
position: fixed;
|
||
top: 0;
|
||
left: 0;
|
||
right: 0;
|
||
bottom: 0;
|
||
background-color: rgba(0, 0, 0, 0.5);
|
||
z-index: 1001;
|
||
display: flex;
|
||
align-items: center;
|
||
justify-content: center;
|
||
padding: 30rpx;
|
||
}
|
||
|
||
.address-modal {
|
||
width: 100%;
|
||
max-width: 600rpx;
|
||
background-color: #fff;
|
||
border-radius: 20rpx;
|
||
overflow: hidden;
|
||
display: flex;
|
||
flex-direction: column;
|
||
}
|
||
|
||
.address-modal-header {
|
||
display: flex;
|
||
justify-content: space-between;
|
||
align-items: center;
|
||
padding: 30rpx;
|
||
border-bottom: 1rpx solid #e5e5e5;
|
||
background-color: #fff;
|
||
flex-shrink: 0;
|
||
}
|
||
|
||
.address-modal-title {
|
||
font-size: 32rpx;
|
||
font-weight: bold;
|
||
color: #333;
|
||
}
|
||
|
||
.address-modal-content {
|
||
padding: 30rpx;
|
||
background-color: #fff;
|
||
}
|
||
|
||
.address-form-item {
|
||
margin-bottom: 25rpx;
|
||
}
|
||
|
||
.address-form-item:last-child {
|
||
margin-bottom: 0;
|
||
}
|
||
|
||
.modal-label {
|
||
display: block;
|
||
font-size: 28rpx;
|
||
color: #333;
|
||
margin-bottom: 15rpx;
|
||
font-weight: 500;
|
||
}
|
||
|
||
.modal-input {
|
||
width: 100%;
|
||
height: 80rpx;
|
||
border: 1rpx solid #e5e5e5;
|
||
border-radius: 10rpx;
|
||
padding: 0 20rpx;
|
||
font-size: 28rpx;
|
||
box-sizing: border-box;
|
||
background-color: #f9f9f9;
|
||
}
|
||
|
||
.address-modal-footer {
|
||
display: flex;
|
||
gap: 20rpx;
|
||
padding: 20rpx 30rpx;
|
||
border-top: 1rpx solid #e5e5e5;
|
||
background-color: #fff;
|
||
flex-shrink: 0;
|
||
}
|
||
</style>
|