Otsuka-APP/pages/work/OrderManager/components/LookDataSY.vue

<template>
    <view>
        <MBCard style="border-radius: 0;">
            <view class="" style="margin-bottom: 10px;">
                <view class="label">
                    <text>货主:</text>
                    <text>{{ companyName }}</text>
                </view>
            </view>
            <view class="context">
                <view class="label">
                    <text>剩余金额:</text>
                    <text>{{ formatPrice(remainingMoney) }}</text>
                </view>
                <view class="label">
                    <text>订单金额:</text>
                    <text>{{ formatPrice(orderAmount) }}</text>
                </view>
            </view>
        </MBCard>
        <uni-section class="mb-10" padding="0 0 5px 10px" title="商品信息"/>
		<MBLoading v-if="loading"/>
        <uni-card
            v-for="item in goodsList"
            :key="item.goodsname"
            :title="item.goodsname"
        >
			
            <view class="context">
                <view class="label">
                    <text>件装数:</text>
                    <text>{{ item.packingnum }}</text>
                </view>
                <view class="label">
                    <text>供应参考价:</text>
                    <text>{{ item.invoiceprice }}</text>
                </view>
                <view class="label">
                    <text>前三月平均数:</text>
                    <text>{{ formatPrice(item.mon3) }}</text>
                </view>
                <view class="label">
                    <text>采购数量:</text>
                    <text>{{ item.goodsnum }}</text>
                </view>
                <view class="label">
                    <text>小计:</text>
                    <text>{{ formatPrice(item.allmoney) }}</text>
                </view>
                <view class="label">
                    <text>使用票扣:</text>
                    <text>{{ formatPrice(item.piaokou) }}</text>
                </view>
                <view class="label">
                    <text>税率:</text>
                    <text>{{ item.taxrate }}</text>
                </view>
            </view>
        </uni-card>
    </view>
</template>

<script setup>
import { onLoad } from '@dcloudio/uni-app'	
	
import { onMounted, ref } from 'vue'
import { salemainDetail, businessManagerReviewGoodsList, getsalemaincheckAmount } from '../../../../api/orderManager/index.js'
import { listproductList } from '../../../../api/orderManager/index.js'
import { formatPrice } from "@/utils/utils";
import MBCard from "@/components/MB/MBCard.vue";
import MBLoading from "@/components/MB/MBLoading.vue";
const loading = ref(false)
// 商品列表数据
const goodsList = ref([])
const form = ref({
    companyId: null,
})
// 生产单位列表
const companyOptions = ref([])
// 公司名称
const companyName = ref('')
// 剩余金额
const remainingMoney = ref(0)
// 订单金额
const orderAmount = ref(0.00)
// 存储参数
const saleId = ref('')

// 页面加载时获取参数
onLoad((options) => {
    // 获取跳转传递的参数
    saleId.value = options.id || ''
    console.log('接收到的 saleId:', saleId.value)
    
    if (saleId.value) {
        // 先获取部门列表，然后获取详情数据
        getDeptLists().then(() => {
            getAllData()
        })
    } else {
        uni.showToast({
            title: '参数错误',
            icon: 'error'
        })
    }
})

// 获取部门列表
const getDeptLists = () => {
    return listproductList().then(res => {
        if (res.code === 200 && res.data) {
            companyOptions.value = res.data
        }
        return res
    })
}

// 获取所有数据
const getAllData = () => {
    // 获取详情数据
    GetsalemainDetail()
}

// 获取详情数据
function GetsalemainDetail() {
	loading.value = true
    // 使用 Promise.all 等待两个异步请求都完成
    Promise.all([
        salemainDetail(saleId.value),
        businessManagerReviewGoodsList(saleId.value)
    ]).then(([detailRes, goodsRes]) => {
		loading.value = false
        // 设置表单数据
        form.value = detailRes.data
        // 设置商品列表
        goodsList.value = goodsRes.data
        
        // 计算订单金额（商品列表中所有商品的总金额）
        calculateOrderAmount()
        
        // 根据 companyId 设置公司名称
        setCompanyName()
        
        // 获取额度
        getEdu()
    }).catch(error => {
		loading.value = false
        uni.showToast({
            title: '获取数据失败',
            icon: 'error'
        })
    })
}

// 根据 companyId 设置公司名称
function setCompanyName() {
    if (!form.value.companyId || !companyOptions.value.length) {
        companyName.value = ''
        return
    }
    
    console.log('查找公司名称，companyId:', form.value.companyId)
    
    // 在部门列表中查找对应的公司
    const company = companyOptions.value.find(item => item.deptId === form.value.companyId)
    
    if (company) {
        companyName.value = company.deptName
    } else {
        companyName.value = '未知公司'
    }
}

// 计算订单金额
function calculateOrderAmount() {
    if (!goodsList.value.length) {
        orderAmount.value = 0
        return
    }
    
    // 将所有商品的 allmoney 相加
    const total = goodsList.value.reduce((sum, item) => {
        const money = parseFloat(item.allmoney) || 0
        return sum + money
    }, 0)
    
    orderAmount.value = total
}

// 查询额度
function getEdu() {
    const AmountqueryParams = {
        companyId: form.value.companyId,
        saleId: form.value.saleid,
    }
    
    // 查询剩余额度
    getsalemaincheckAmount(AmountqueryParams).then(res => {
        if (res.code === 200) {
            remainingMoney.value = res.data.amounts || 0
        }
    }).catch(error => {
        console.error('获取额度失败:', error)
    })
}

// 取消
const goCancel = () => {
    uni.navigateTo({
        url: '/pages/work/OrderManager/index'
    })
}
</script>
<style>
	.context{
		font-size: 14px;
	}
	.context .label{
		font-size: 14px;
	}
</style>