<template>
|
<div class="default-main">
|
<el-card shadow="never">
|
<div class="title">订单信息</div>
|
<el-descriptions :column="3" border class="mt10">
|
<el-descriptions-item label="订单编号">{{ detail.orderNo }}</el-descriptions-item>
|
<el-descriptions-item label="交易资源类型">{{ detail.resourceTypeName }}</el-descriptions-item>
|
<el-descriptions-item label="交易状态">{{ detail.statusName }}</el-descriptions-item>
|
<el-descriptions-item label="申请时间">{{ detail.applyTime }}</el-descriptions-item>
|
<el-descriptions-item label="单位">{{ detail.unitName }}</el-descriptions-item>
|
<el-descriptions-item label="用户名">{{ detail.userName }}</el-descriptions-item>
|
</el-descriptions>
|
</el-card>
|
|
<el-card class="mt15" shadow="never">
|
<div class="title">交易内容</div>
|
<el-table :data="detail.items" border class="mt10">
|
<el-table-column label="详情" min-width="280">
|
<template #default="{ row }">
|
<div>
|
<div>{{ row.name }}</div>
|
<div class="gray">客户对象：{{ row.customerTarget }}</div>
|
<div class="gray">并发节点数：{{ row.concurrentNodes }}</div>
|
</div>
|
</template>
|
</el-table-column>
|
<el-table-column label="单价" prop="priceName" width="140" />
|
<el-table-column label="数量" prop="quantity" width="80" />
|
<el-table-column label="期限(年)" prop="period" width="120" />
|
</el-table>
|
|
<div class="total">
|
总计：<span class="price">{{ detail.pointTotal }}</span> 积分
|
<span class="ml20 price">{{ detail.cashTotal }}</span> 元
|
</div>
|
</el-card>
|
|
<el-card class="mt15" shadow="never">
|
<div class="title">交易文件</div>
|
<el-upload
|
class="mt10"
|
:auto-upload="false"
|
v-model:file-list="fileList"
|
:limit="5"
|
:on-exceed="onExceed"
|
>
|
<el-button type="primary">选择文件</el-button>
|
</el-upload>
|
<div class="ba-center mt15">
|
<el-button @click="goBack">返回</el-button>
|
<el-button type="primary" @click="submit">提交</el-button>
|
</div>
|
</el-card>
|
</div>
|
</template>
|
|
<script setup lang="ts">
|
import { onMounted, reactive, ref } from 'vue'
|
import { useRoute, useRouter } from 'vue-router'
|
import { fetchOrderDetail, uploadTradeFile } from '@/api/tradeManage'
|
import { ElMessage } from 'element-plus'
|
|
const route = useRoute()
|
const router = useRouter()
|
const detail = reactive<any>({ items: [] })
|
const fileList = ref<any[]>([])
|
|
onMounted(async () => {
|
const { data } = (await fetchOrderDetail({ id: route.params.id })) as any
|
Object.assign(detail, data || {})
|
})
|
|
const onExceed = () => ElMessage.warning('最多选择5个文件')
|
const goBack = () => router.back()
|
const submit = async () => {
|
const { code } = (await uploadTradeFile({ id: route.params.id, files: fileList.value })) as any
|
if (code === 200) {
|
ElMessage.success('提交成功')
|
router.back()
|
}
|
}
|
</script>
|
|
<style scoped lang="scss">
|
.title { font-weight: 600; }
|
.mt10 { margin-top: 10px; }
|
.mt15 { margin-top: 15px; }
|
.gray { color: #909399; font-size: 12px; }
|
.total { text-align: right; margin-top: 10px; }
|
.price { color: #f56c6c; font-weight: 600; }
|
.ml20 { margin-left: 20px; }
|
</style>
|
