shuhi-app/pages/index/detail/batch-audit.vue

<template>
    <view class="batch-audit">
        <BookItem v-for="(item, index) in scannedBooksDetail" :key="item.isbn" :item="item" showClose
            @close="(isbn) => handleClose(index, isbn)" />

        <view class="fixed-bottom">
            <u-button type="warning" size="large" @click="handleScanCode">扫码</u-button>
            <u-button type="primary" size="large" @click="showQualityModal">确定</u-button>
        </view>

        <u-modal :show="showModal" :title="'品相选择'" @cancel="closeModal" :showCancelButton="true"
            :closeOnClickOverlay="true" @confirm="handleAudit">
            <view class="quality-selector">
                <view class="quality-circle" :class="{ 'selected': isQualitySelected }" @click="toggleQuality">
                    <text>良好</text>
                </view>
            </view>
        </u-modal>
    </view>
</template>

<script setup>
import { ref } from 'vue'
import { onLoad, onShow } from '@dcloudio/uni-app'
import BookItem from './components/BookItem2.vue'

const detailMap = ref({})
const scannedBooksDetail = ref([])
// 获取图书详情 /app/book/getSimpleBookInfoByIsbn/{isbn}
const getBookInfo = (isbn) => {
    if (detailMap.value[isbn]) {
        scannedBooksDetail.value.push(detailMap.value[isbn])
        return
    }
    uni.$u.http.get(`/app/book/getSimpleBookInfoByIsbn/${isbn}`).then(res => {
        if (res.code == 200) {
            detailMap.value[isbn] = res.data
            scannedBooksDetail.value.push(res.data)
            console.log(scannedBooksDetail.value, 'xxaaxx')
        }
    })
}

const handleClose = (index, isbn) => {
    scannedBooksDetail.value.splice(index, 1)
    scannedBooks.value = scannedBooks.value.filter(item => item != isbn)
}
//isbn正则校验是否符合
function checkIsbn(isbn) {
    const isbn13Regex = /^(?:97[89]-?\d{1,5}-?\d{1,7}-?\d{1,6}-?\d)$/;
    if (isbn13Regex.test(isbn)) {
        return true
    }
    return false
}
//存储已经扫码的图书
const scannedBooks = ref([])
//扫码之后的逻辑
function handleScan(isbn) {
    if (!checkIsbn(isbn)) {
        let text = `不是正确的ISBN码`
        uni.$u.ttsModule.speak(text)
        return
    }

    let isbns = orderDetail.value.detailVoList.map(item => item.isbn)
    //订单总数本
    if (isbns.includes(isbn)) {
        let book = orderDetail.value.detailVoList.find(item => item.isbn == isbn)

        if (book.auditCommentList?.length > 0) {
            let text = ''
            if (book.auditCommentList.every(item => item.sts == 1)) {
                text = `${isbn}已审核为良好`
                uni.$u.ttsModule.speak(text)
                return
            }

            //已审核数量
            let hasAuditNum = book.auditCommentList.filter(item => item.sts !== 0).length || 0
            //未审核数量
            let notAuditNum = book.auditCommentList.filter(item => item.sts === 0).length || 0
            //极差数量
            let poorNum = book.auditCommentList?.filter(item => item.sts == 3).length || 0
            //已扫描书籍中当前isbn的数量
            let scannedNum = scannedBooks.value.filter(item => item == isbn).length || 0

            if (scannedNum >= notAuditNum + poorNum) {
                let text = `${isbn}已超出订单中的数量`
                return uni.$u.ttsModule.speak(text)
            } else {
                //扫描到套装书
                if (book.suit == 1) {
                    let text = `${isbn}请注意套装书是否齐全`
                    uni.$u.ttsModule.speak(text)
                }
                //扫描到需要取出的书
                if (book.bookWarn == 1) {
                    let text = `请注意${isbn}需要取出`
                    uni.$u.ttsModule.speak(text)
                }
                if (scannedNum >= notAuditNum && scannedNum < notAuditNum + poorNum) {
                    let text = `${isbn}已审核为极差`
                    uni.$u.ttsModule.speak(text)
                }

                scannedBooks.value.push(isbn)
                getBookInfo(isbn)
            }
        }
    } else {
        let text = `此订单中不存在${isbn}这本书 `
        uni.$u.ttsModule.speak(text)
    }
}

//扫码
function handleScanCode() {
    uni.scanCode({
        success: (res) => {
            handleScan(res.result)
        },
    })
}


const checkUserId = ref()
const orderId = ref()
const orderDetail = ref({})
const showModal = ref(false)
const isQualitySelected = ref(false)

const showQualityModal = () => {
    showModal.value = true
}

const closeModal = () => {
    showModal.value = false
}

const toggleQuality = () => {
    isQualitySelected.value = !isQualitySelected.value
}

//审核 /app/orderinfo/checkOrder
const handleAudit = () => {
    if (!isQualitySelected.value) {
        uni.$u.toast('请选择品相')
        uni.$u.ttsModule.speak('请选择品相')
        return
    }

    let checkUserInfo = uni.getStorageSync('checkUserInfo')
    if (checkUserInfo.userId) {
        checkUserId.value = checkUserInfo.userId
    }

    uni.$u.http.post('/app/orderinfo/checkOrder', {
        "checkUserId": checkUserId.value,
        "orderId": orderId.value,
        "checkList": scannedBooks.value.map(isbn => ({ sts: 1, com: '', isbn }))
    }).then(res => {
        if (res.code == 200) {
            uni.showToast({ title: '审核成功', icon: 'none' })
            uni.$u.ttsModule.speak('审核成功')
            uni.navigateBack({ delta: 2 })
        } else {
            uni.$u.toast(res.msg)
        }
    })
}

onLoad((options) => {
    orderId.value = options.orderId
    orderDetail.value = uni.getStorageSync('orderDetail')
    scannedBooks.value = uni.getStorageSync('scannedBooks')

    scannedBooks.value.forEach(isbn => {
        getBookInfo(isbn)
    })

    // #ifdef APP-PLUS
    uni.$u.useGlobalEvent((e) => {
        if (e.barcode) {
            handleScan(e.barcode)
        }
    })
    // #endif
})
onShow(() => {
    checkUserId.value = uni.getStorageSync('userInfo')?.userId
    orderDetail.value = uni.getStorageSync('orderDetail')
})
</script>


<style lang="scss" scoped>
.batch-audit {
    padding: 20rpx;
    box-sizing: border-box;
    padding-bottom: 140rpx;
}

.quality-selector {
    display: flex;
    justify-content: center;
    align-items: center;
    padding: 30rpx 0;
}

.quality-circle {
    width: 120rpx;
    height: 120rpx;
    border-radius: 50%;
    background-color: #ccc;
    display: flex;
    justify-content: center;
    align-items: center;
    cursor: pointer;

    text {
        color: #fff;
        font-size: 28rpx;
    }

    &.selected {
        background-color: #4CAF50;
    }
}
</style>