<template>
        <el-row>
            <el-col :span="24" style=" padding-left: 5px">
                <el-row style="margin-bottom: 15px">
                    <el-col :span="24">
                        <div style="display: flex;justify-content: end;margin-top: 15px">
                            <div style="display: flex;align-items: center; margin-right: 5px;">
                                <span> 产品数量: {{ssdSkuDetailVOList.totalNumber}}</span>
                                <span style="margin-left: 15px">产品总金额(￥): {{$formatNumber(ssdSkuDetailVOList.productTotalOrderAmt)}}</span>
                                <span style="margin-left: 15px">其他费用(￥): {{$formatNumber(ssdSkuDetailVOList.otherAmt)}}</span>
                                <el-button v-hasPermi="[`${perPrefix}:detail:tab_cpbj_bj`]"  :disabled="!ssdSkuDetailVOList.ssdSkuDetailVOList || ssdSkuDetailVOList.ssdSkuDetailVOList?.length <= 0" :loading="editeLoading" icon="Edit" style="margin-left: 10px" @click="edite" type="primary">编辑</el-button>
                                <el-button v-hasPermi="[`${perPrefix}:detail:tab_cpbj_xzzwbjd`]" :disabled="!ssdSkuDetailVOList.ssdSkuDetailVOList || ssdSkuDetailVOList.ssdSkuDetailVOList?.length <= 0" style="margin-left: 15px" @click="downPdf(1)" icon="Download" type="primary" >下载中文报价单</el-button>
                                <el-button v-hasPermi="[`${perPrefix}:detail:tab_cpbj_xzywbjd`]" :disabled="!ssdSkuDetailVOList.ssdSkuDetailVOList || ssdSkuDetailVOList.ssdSkuDetailVOList?.length <= 0" style="margin-left: 15px" @click="downPdf(2)" icon="Download" type="primary" >下载英文报价单</el-button>
                            </div>
                        </div>
                    </el-col>
                </el-row>
                <el-table :data="ssdSkuDetailVOList.ssdSkuDetailVOList" >
                    <el-table-column  prop="ssdSkuCode"  label="内部编号" > </el-table-column>
                    <el-table-column  prop="ssdSkuCode"  label="规格"  width="120">
                        <template #default="scope">
                            <template v-if="scope.row.ssdSkuCode != '外部产品' && scope.row.ssdSkuCode != '其他费用'">

                             <span class="ss">{{scope.row.connectorType}}<small>|</small>{{scope.row.productSize}}<small>|</small>{{scope.row.connectorProtocol}}<small>|</small>{{scope.row.coreChipType}}<small>|</small>{{scope.row.productLevel}}<small>|</small>{{scope.row.flashChipType}}<small>|</small>{{scope.row.capacity}}</span>
                            </template>
                            <template v-else>
                                <span>
                                    {{scope.row.specificationRemarks}}
                                </span>
                            </template>
                        </template>
                    </el-table-column>
                    <el-table-column  prop="interface"  label="功能配置" >
                        <template  #default="scope">
                            <template v-if="scope.row.ssdSkuCode != '外部产品' && scope.row.ssdSkuCode != '其他费用'">
                                <label style="color:#999999;">逻辑销毁：</label><span style="color: #555555;">{{scope.row.forceOpenLogicDestroy  ? '开通' : '不开通'}} </span><br>
                                <label style="color:#999999;">物理销毁：</label><span style="color: #555555;">{{scope.row.forceOpenPhysicalDestroy ? '开通' : '不开通'}}</span><br>
                                <label style="color:#999999;">AES加密：</label><span style="color: #555555;">{{scope.row.forceOpenAesEncrypt ? '开通' : '不开通'}}</span><br>
                                <label style="color:#999999;">r-Backup：</label><span style="color: #555555;">{{scope.row.forceOpenRapidBackup? '开通' : '不开通'}}</span><br>
                            </template>
                            <template v-else>
                                <span>
                                    {{scope.row.functionRemarks}}
                                </span>
                            </template>
                        </template>
                    </el-table-column>
                    <el-table-column  prop="interface"  label="数量" width="130">
                        <template  #default="scope">
                            {{ scope.row.productCount }}
                        </template>
                    </el-table-column>
                    <el-table-column  prop="interface"  label="国内不含税总价(￥)" >
                        <template  #default="scope">
<!--                            <p>总价(￥):{{ $formatNumber(scope.row.skuPriceCNYWithNoRate) }}</p>-->
<!--                            <p>单价(￥):{{ $formatNumber(scope.row.unitPriceCNYWithNoRate) }}</p>-->

                            <template v-if="scope.row.ssdSkuCode != '外部产品' && scope.row.ssdSkuCode != '其他费用'">
                                <p style="font-weight: 600">标准价格：</p>
                                <p>总价:{{ $formatNumber(scope.row.skuPriceCNYWithNoRate) }}</p>
                                <p>单价:{{ $formatNumber(scope.row.unitPriceCNYWithNoRate) }}</p>
                                <p style="font-weight: 600"> 报价金额：</p>
                                <p>总价:{{ $formatNumber(scope.row.skuPriceCNYWithNoRateActual) }}</p>
                                <p>单价:{{ $formatNumber(scope.row.unitPriceCNYWithNoRateActual) }}</p>
                            </template>
                            <template v-else>
                                <p style="font-weight: 600"> 报价金额：</p>
                                <p>总价:{{ $formatNumber(scope.row.skuPriceCNYWithNoRateActual) }}</p>
                                <p>单价:{{ $formatNumber(scope.row.unitPriceCNYWithNoRateActual) }}</p>
                            </template>

                        </template>
                    </el-table-column>
                    <el-table-column  prop="interface"  label="国内价格(￥)(含13%增值税)" >
<!--                        <template  #default="scope">-->
<!--                            <p>总价(￥):{{ $formatNumber(scope.row.skuPriceCNY) }}</p>-->
<!--                            <p>单价(￥):{{ $formatNumber(scope.row.unitPriceCNY) }}</p>-->
<!--                        </template>-->
                        <template #default="scope">
                            <template v-if="scope.row.ssdSkuCode != '外部产品' && scope.row.ssdSkuCode != '其他费用'">
                                <p style="font-weight: 600">标准价格：</p>
                                <p>总价:{{ $formatNumber(scope.row.skuPriceCNY) }}</p>
                                <p>单价:{{ $formatNumber(scope.row.unitPriceCNY) }}</p>
                                <p style="font-weight: 600">报价金额：</p>
                                <p >总价:{{ $formatNumber(scope.row.skuPriceCNYActual ) }}</p>
                                <p >单价:{{ $formatNumber(scope.row.unitPriceCNYActual) }}</p>
                            </template>
                            <template v-else>
                                <p style="font-weight: 600"> 报价金额：</p>
                                <p>总价:{{ $formatNumber(scope.row.skuPriceCNYActual) }}</p>
                                <p>单价:{{ $formatNumber(scope.row.unitPriceCNYActual) }}</p>
                            </template>
                        </template>
                    </el-table-column>

                    <el-table-column  prop="interface"  :label="`国外价格($)(不含税，美元汇率${USDToCNYRate ? USDToCNYRate.toFixed(4): '' })`" >
<!--                        <template  #default="scope">-->
<!--                            <p>总价($):{{ $formatNumber(scope.row.skuPriceUSD) }}</p>-->
<!--                            <p>单价($):{{ $formatNumber(scope.row.unitPriceUSD) }}</p>-->
<!--                        </template>-->

                        <template #default="scope">
                            <template v-if="scope.row.ssdSkuCode != '外部产品' && scope.row.ssdSkuCode != '其他费用'">
                                <p style="font-weight: 600">标准价格：</p>
                                <p>总价:{{ $formatNumber(scope.row.skuPriceUSD) }}</p>
                                <p>单价:{{ $formatNumber(scope.row.unitPriceUSD) }}</p>
                                <p style="font-weight: 600">报价金额：</p>
                                <p>总价:{{ $formatNumber(scope.row.skuPriceUSDActual) }}</p>
                                <p>单价:{{ $formatNumber(scope.row.unitPriceUSDActual) }}</p>
                            </template>
                            <template v-else>
                                <p style="font-weight: 600"> 报价金额：</p>
                                <p>总价:{{ $formatNumber(scope.row.skuPriceUSDActual) }}</p>
                                <p>单价:{{ $formatNumber(scope.row.unitPriceUSDActual) }}</p>
                            </template>
                        </template>
                    </el-table-column>
                    <el-table-column  prop="deliveryDays"  label="预计生产天数" > </el-table-column>
                    <el-table-column  prop="interface"  label="操作" >
                        <template  #default="scope">
                            <el-link @click="openSkuDetail(scope.row)" style="margin-right: 5px" type="primary">产品详情</el-link>
                        </template>
                    </el-table-column>
                </el-table>
            </el-col>
        </el-row>
    <GetProductPrice ref="getProductPriceRef" @ok="getQuotationList"></GetProductPrice>
    <skuDetail ref="skuDetailRef"></skuDetail>
</template>

<script setup lang="ts">
import GetProductPrice from './GetProductPrice.vue'
import skuDetail from './skuDetail.vue'
import {downLodaQuotation, downLodaQuotationById, getDetail, getUSDtoCnyRate} from '@/api/product/index'
import downloadPlugins from '@/plugins/download'
import {
    SsdSkuDetailVOList
} from '@/api/product/types'
import {AllBusinessForm, AllBusinessQuery} from "@/api/business/allBusiness/types";
const emits = defineEmits(['ok'])
const props = defineProps({
    resourceTypeId:{
        type: [Number, String],
        required: true
    },
    resourceType:{
        type: [Number, String]
    },
    perPrefix:{
        type:String
    }
})
watch(()=>props.resourceTypeId, (newValue)=>{

    getQuotationList()
})

const leftBtn = ref([
    {type: 'edit', hasPermi: `${props.perPrefix}:business:edit`},
    {type: 'export', hasPermi: `${props.perPrefix}:business:export`}
])


const ssdSkuDetailVOList = ref<SsdSkuDetailVOList>({
    ssdSkuDetailVOList:[],
    totalEarnestAmt:0,
    totalNumber:0,
    totalOrderAmt:0,
    productTotalOrderAmt: 0,
    otherAmt: 0
})
const skuDetailRef = ref()
const USDToCNYRate = ref(0)

const getRate =  ()=>{
    getUSDtoCnyRate().then(res=>{
        USDToCNYRate.value = res.result
    })
}


const openSkuDetail = (data)=>{
    skuDetailRef.value.open(data)
}

const getQuotationList = async () =>{
    if(!props.resourceTypeId) return
    let param:{businessId?:number|string, orderFormId?:number|string, id?:number|string} = {
        businessId: undefined,
        orderFormId: undefined,
        id: undefined
    }
    const regex = /business/i;  // 'i' 表示不区分大小写
    const regexCustomer = /customer/i;  // 'i' 表示不区分大小写
    if(props.perPrefix && regex.test(props.perPrefix)) {
        param.businessId = props.resourceTypeId
    } else  if(props.perPrefix && regexCustomer.test(props.perPrefix)) {
        param.id = props.resourceTypeId
    } else {
        param.orderFormId = props.resourceTypeId

    }

    let data = await getDetail(param);
    ssdSkuDetailVOList.value = data.result
}

const getProductPriceRef = ref()
const editeLoading = ref(false)
const edite = ()=>{
    editeLoading.value = true
    if(!ssdSkuDetailVOList || ssdSkuDetailVOList?.value.ssdSkuDetailVOList.length <= 0){
        ElMessage.error('没有找到报价单，请先添加报价单')
        editeLoading.value = false
        return
    }
    let param:{businessId?:number|string, orderFormId?:number|string, id: number|string} = {
        businessId: undefined,
        orderFormId: undefined,
        id: undefined
    }
    const regex = /business/i;  // 'i' 表示不区分大小写
    const regexCustomer = /customer/i;  // 'i' 表示不区分大小写
    if(props.perPrefix && regex.test(props.perPrefix)) {
        param.businessId = props.resourceTypeId
    } else  if(props.perPrefix && regexCustomer.test(props.perPrefix)) {
        param.id = props.resourceTypeId
    } else {
        param.orderFormId = props.resourceTypeId

    }

    getProductPriceRef.value.edite(param, ()=>{
        editeLoading.value = false
    })
}

//随机生成
const download = (url)=>{
    downloadPlugins.oss(url)
}

const downPdf = async (type)=>{
    let time = new Date().getTime()
    let name = type === 1 ? `报价单-${time}.docx` : `Quotation-${time}.docx`
    let param:{businessId?:number|string, orderFormId?:number|string, languageType: number, id:number|string} = {
        businessId: undefined,
        orderFormId: undefined,
        languageType: undefined,
        id: undefined
    }
    const regex = /business/i;  // 'i' 表示不区分大小写
    const regexCustomer = /customer/i;  // 'i' 表示不区分大小写
    if(props.perPrefix && regex.test(props.perPrefix)) {
        param.businessId = props.resourceTypeId
    } else  if(props.perPrefix && regexCustomer.test(props.perPrefix)) {
        param.id = props.resourceTypeId
    } else {
        param.orderFormId = props.resourceTypeId

    }
    param.languageType = type
    await downLodaQuotationById(param, name)
}
defineExpose({

    getQuotationList
})
onMounted(()=>{
    getQuotationList()
    getRate()
})
</script>

<style lang="scss" scoped>

</style>
