shuhi-app/pages/index/detail/review-book.vue

<template>
    <view class="book-audit" @click="playGlobalSound">
        <view class="bg-white flex flex-a-c" style="padding: 20rpx; border-radius: 10rpx">
            <image :src="detail.cover" mode="aspectFill" style="width: 80px; height: 100px"></image>
            <view class="flex flex-d flex-1 ml-20">
                <text class="common-title mb-20">{{ detail.bookName }}</text>
                <text class="text-sm">ISBN: <text class="color-primary">{{ detail.isbn }}</text>
                </text>
                <text class="text-sm mt-6">作者: <text>{{ detail.author }}</text>
                </text>
                <text class="text-sm mt-6">出版社: <text>{{ detail.publish }}</text>
                </text>
            </view>
        </view>

        <view class="mt-20 bg-white price-info" style="border-radius: 10rpx">
            <view class="flex">
                <view class="flex flex-a-c flex-1">
                    <text class="label">定价</text>
                    <text class="content">¥{{ detail.price }}</text>
                </view>
                <view class="flex flex-a-c flex-1">
                    <text class="label">回收折扣</text>
                    <text class="content">{{ detail.recycleDiscount }}折</text>
                </view>
            </view>
            <view class="flex flex-a-c">
                <view class="flex flex-a-c flex-1">
                    <text class="label">预估金额</text>
                    <text class="content">¥{{ detail.expectPrice }}</text>
                </view>
                <view class="flex flex-a-c flex-1">
                    <text class="label">审核金额</text>
                    <text class="content">¥0.00</text>
                </view>
            </view>
        </view>

        <view class="mt-20">
            <ReviewInfo :detail="reviewInfo" ref="reviewInfoRef" />
        </view>

        <view class="fixed-bottom">
            <u-button type="primary" size="large" @click="handleAudit">确定</u-button>
        </view>
    </view>
</template>

<script setup>
import { ref, nextTick, onUnmounted } from "vue";
import { onLoad, onShow } from "@dcloudio/uni-app";
import ReviewInfo from "./components/ReviewInfo.vue";

const detail = ref({});

function playGlobalSound() {
    uni.$u.playClickSound()
}

// 获取图书详情 /app/book/getSimpleBookInfoByIsbn/{isbn}
const getBookInfo = (isbn) => {
    uni.$u.http.get(`/app/book/getBookByIsbn/${isbn}`).then((res) => {
        if (res.code == 200) {
            detail.value = res.data;
        }
    });
};
//获取图书信息和审核信息
const reviewInfo = ref({});
const getBookInfoAndAuditInfo = (opts) => {
    uni.$u.http.get(`/app/orderreview/getBookReviewInfo?isbn=${opts.isbn}&&orderId=${opts.orderId}&index=${opts.index}`).then((res) => {
        if (res.code == 200) {
            reviewInfo.value = res.data;
        }
    });
};

//复审 
const reviewInfoRef = ref(null)
const handleAudit = () => {
    let form = reviewInfoRef.value.form
    if(form.reviewImg && form.reviewImg.length == 0){
        uni.$u.toast("请上传复审图片");
        return;
    }

    if (!form.reviewAuditSts) {
        uni.$u.toast("请选择复审状态");
        return;
    }
    if(form.reviewAuditSts == 3 && !form.reviewAudit){
        uni.$u.toast("请输入复审原因");
        return;
    }

    uni.$u.http
        .post("/app/orderreview/reviewBook", {
            auditReviewId: auditReviewId.value,
            ...form
        })
        .then((res) => {
            if (res.code == 200) {
                uni.showToast({ title: "复审成功", icon: "none" });
                uni.$u.ttsModule.speak("复审成功");
                uni.navigateBack();
            } else {
                uni.$u.toast(res.msg);
            }
        });
};

const auditReviewId = ref();
const index = ref();
let isbnScan = ref("");
onLoad((options) => {
    options.isbn && getBookInfo(options.isbn);
    isbnScan.value = options.isbn;
    auditReviewId.value = options.auditReviewId;
    index.value = options.index;
    getBookInfoAndAuditInfo(options);
});

</script>

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

    .price-info {
        border-radius: 10rpx;

        .label {
            width: 150rpx;
            background-color: #cecece;
            padding: 16rpx 10rpx;
            text-align: center;
            border: 1rpx solid #e6e6e6;
        }

        .content {
            flex: 1;
            text-align: center;
            padding: 16rpx 10rpx;
            border: 1rpx solid #e6e6e6;
        }
    }
}
</style>