Commit 6a8d857c by lijinqi

api订单和算力订单发票添加完成

parent 24b4d35f
import request from "@/utils/request.js";
/**
* 获取 API 类型列表
* @returns {Promise}
*/
export function getApiCategories() {
return request({
url: '/apihub/api-category/list', // 后端提供的接口地址
method: 'get'
})
}
\ No newline at end of file
......@@ -60,3 +60,12 @@ export function orderReason (id) {
method: 'get'
})
}
export function appOrderInvoiceRequest (data){
return request({
url: '/apihub/api-order/invoiceRequest',
method: 'post',
data: data
})
}
......@@ -10,7 +10,7 @@ export function listOrder (query) {
}
export function appInvoiceRequest (data){
export function orderInvoiceRequest (data){
return request({
url: '/trade/order/invoiceRequest',
method: 'post',
......@@ -18,6 +18,7 @@ export function appInvoiceRequest (data){
})
}
// 查询订单管理-需求单管理详细
export function getOrder (id) {
return request({
......@@ -69,3 +70,15 @@ export function orderReason (id) {
method: 'get'
})
}
/**
* 获取 算力资源 类型列表
* @returns {Promise}
*/
export function getCategories() {
return request({
url: '/product/category/list-by-parentid?id=92', // 后端提供的接口地址
method: 'get'
})
}
......@@ -264,7 +264,7 @@ const interval = ref(undefined)
const checkbox = ref(false)
const protocol = ref(false)
const pdfBlobUrl = ref('');
const pdfUrl = ref('https://luhu-ltx.oss-cn-shenzhen.aliyuncs.com/20250828/文字文稿1_1756349853834.pdf')
const pdfUrl = ref(import.meta.env.VITE_APP_BASE_API+'/infra/file/preview?url=https://luhu-ltx.oss-cn-shenzhen.aliyuncs.com/20250918/buy_1758208746972.pdf')
const qrCode = ref({
url: '',
......
<template>
<!-- 图片查看弹窗 -->
<el-dialog
v-model="dialogVisible"
title="查看发票图片"
:width="`600px`"
:close-on-click-modal="false">
<div class="flex justify-center p-4">
<img
:src="formData.invoiceUrl"
alt="发票图片"
style="
display: block; /* 避免图片底部留白 */
max-width: 100% !important; /* 最大宽度不超过父容器 */
width: auto !important; /* 宽度自动适应 */
max-height: 500px !important; /* 最大高度固定500px */
height: auto !important; /* 高度自动适应,保持比例 */
object-fit: contain; /* 完整显示图片,不裁剪 */
margin: 0 auto; /* 水平居中 */
"
@error="handleImageError"
/>
</div>
</el-dialog>
</template>
<script setup lang="ts">
const dialogVisible = ref(false) // 弹窗是否展示
const formData = ref({
id: undefined, // 订单编号
invoiceStatus: undefined,
invoiceUrl: ''
})
const open = async (row) => {
resetForm()
// 设置数据
formData.value.id = row.id
formData.value.invoiceStatus = row.invoiceStatus
formData.value.invoiceUrl = row.invoiceUrl
dialogVisible.value = true
}
defineExpose({open}) // 提供 open 方法,用于打开弹窗
/** 重置表单 */
const resetForm = () => {
formData.value = {
id: undefined, // 订单编号
invoiceStatus: undefined,
invoiceUrl: ''
}
}
const handleImageError = (e) => {
e.target.src = 'https://picsum.photos/600/400?grayscale&blur=2'; // 占位图
e.target.alt = '图片加载失败';
};
</script>
<style scoped lang="scss">
</style>
......@@ -15,20 +15,23 @@
<!-- @keyup.enter="handleQuery"-->
<!-- />-->
<!-- </el-form-item>-->
<el-form-item label="API类型" prop="category">
<el-form-item label="API类型" prop="categoryId">
<el-select
v-model="queryParams.category"
v-model="queryParams.categoryId"
placeholder="请选择API类型"
clearable
class="custom-select"
>
<el-option
v-for="dict in application_category"
:key="dict.value"
:label="dict.label"
:value="dict.value"
v-for="item in applicationCategory"
:key="item.id"
:label="item.name"
:value="item.id"
/>
</el-select>
</el-form-item>
<!-- <el-form-item label="型号" prop="model">-->
<!-- <el-select-->
<!-- v-model="queryParams.model"-->
......@@ -116,14 +119,7 @@
{{ (scope.row.costPrice / 100).toFixed(2) }}
</template>
</el-table-column>
<!-- <el-table-column label="商品类别" align="center" prop="category">-->
<!-- <template #default="scope">-->
<!-- <dict-tag-->
<!-- :options="application_category"-->
<!-- :value="scope.row.category"-->
<!-- />-->
<!-- </template>-->
<!-- </el-table-column>-->
<el-table-column label="资源类别" align="center" prop="categoryName"/>
<!-- <el-table-column-->
<!-- v-for="(item, index) in orderList[0]?.properties.length!==0?orderList[0]?.properties.slice(0,4):orderList[0]?.properties"-->
<!-- :key="index"-->
......@@ -134,6 +130,11 @@
<!-- </template>-->
<!-- </el-table-column>-->
<el-table-column label="订单状态" align="center" prop="statusName"/>
<el-table-column label="开票状态" align="center" prop="invoiceStatusName">
<template #default="scope">
<!-- <dict-tag :type="invoice_status" :value="scope.row.invoiceStatus" />-->
</template>
</el-table-column>
<el-table-column label="下单时间" align="center" prop="createTime" width="180">
<template #default="scope">
<span>{{ parseTime(scope.row.createTime, '{y}-{m}-{d} {h}:{i}:{s}') }}</span>
......@@ -146,20 +147,21 @@
class-name="small-padding fixed-width">
<template #default="scope">
<el-button
v-if="scope.row.invoiceStatus === InvoiceRequestEnum.UNINVOICED.type"
link
type="primary"
@click="handleDetails(scope.row)"
@click="invoiceRequest(scope.row)"
>
详情
申请开票
</el-button>
<el-button
v-if="scope.row.invoiceStatus === InvoiceRequestEnum.INVOICED.type"
v-if="scope.row.invoiceUrl"
link
type="success"
plain
type="primary"
@click="viewInvoice(scope.row)"
>
展示发票
查看发票
</el-button>
</template>
</el-table-column>
......@@ -170,8 +172,21 @@
:total="total"
v-model:page="queryParams.pageNo"
v-model:limit="queryParams.pageSize"
@pagination="getList"
@pagination="loadList"
/>
<!-- 发票预览弹窗 -->
<el-dialog
v-model="pdfDialogVisible"
title="发票预览"
width="80%"
top="5vh"
>
<iframe
v-if="invoiceUrl"
:src="invoiceUrl"
style="width: 100%; height: 80vh; border: none;"
/>
</el-dialog>
<!-- 添加或修改订单管理-需求单管理对话框 -->
<el-dialog :title="title" v-model="open" width="500px" append-to-body>
......@@ -222,7 +237,6 @@
</el-dialog>
</div>
<OrderViewInvoiceForm ref="OrderViewInvoiceFormRef" @success="getList"/>
</template>
<script setup name="ApiOrder">
......@@ -231,7 +245,6 @@ import {
} from '@/api/apiorder.js'
import {parseTime} from "../../utils/ruoyi.js";
import {InvoiceRequestEnum} from "@/utils/constants.js";
import OrderViewInvoiceForm from "@/views/console/OrderViewInvoiceForm.vue";
const {proxy} = getCurrentInstance()
......@@ -291,11 +304,18 @@ function loadList() {
})
}
const OrderViewInvoiceFormRef = ref()
const viewInvoice = (row) => {
OrderViewInvoiceFormRef.value.open(row)
import { getApiCategories } from '@/api/apicategory.js'
import {appOrderInvoiceRequest} from "@/api/apiorder.js";
const applicationCategory = ref([])
function loadCategories() {
getApiCategories().then(res => {
applicationCategory.value = res.data || []
})
}
// 取消按钮
function cancel() {
open.value = false
......@@ -332,7 +352,28 @@ function handleDetails(row) {
// })
}
function invoiceRequest(row) {
appOrderInvoiceRequest(row).then((response) => {
loadList();
proxy.$modal.msgSuccess("已成功申请");
}).catch((r) => {
}
)
}
const pdfDialogVisible = ref(false)
const invoiceUrl = ref('')
function viewInvoice(row) {
invoiceUrl.value = import.meta.env.VITE_APP_BASE_API+'/infra/file/preview?url=' + row.invoiceUrl // 从接口带回的 pdf 地址
pdfDialogVisible.value = true
}
loadList()
loadCategories()
</script>
......@@ -369,4 +410,10 @@ loadList()
color: #303233;
}
}
/* 控制下拉列表文字左侧间距 */
.custom-select .el-select-dropdown__item {
padding-left: 12px; /* 调整数值即可 */
}
</style>
......@@ -15,17 +15,19 @@
<!-- @keyup.enter="handleQuery"-->
<!-- />-->
<!-- </el-form-item>-->
<el-form-item label="商品类别" prop="category">
<el-form-item label="资源类型" prop="category">
<el-select
v-model="queryParams.category"
placeholder="请选择商品类别"
v-model="queryParams.categoryId"
placeholder="请选择资源类型"
clearable
class="custom-select"
>
<el-option
v-for="dict in application_category"
:key="dict.value"
:label="dict.label"
:value="dict.value"
v-for="item in applicationCategory"
:key="item.id"
:label="item.name"
:value="item.id"
/>
</el-select>
</el-form-item>
......@@ -145,13 +147,6 @@
class-name="small-padding fixed-width">
<template #default="scope">
<el-button
link
type="primary"
@click="handleDetails(scope.row)"
>
详情
</el-button>
<el-button
v-if="scope.row.invoiceStatus === InvoiceRequestEnum.UNINVOICED.type"
link
type="primary"
......@@ -159,17 +154,18 @@
>
申请开票
</el-button>
<el-button
v-if="scope.row.invoiceStatus === InvoiceRequestEnum.INVOICED.type"
v-if="scope.row.invoiceUrl"
link
type="success"
plain
type="primary"
@click="viewInvoice(scope.row)"
>
展示发票
查看发票
</el-button>
</template>
</el-table-column>
</el-table>
<pagination
......@@ -180,6 +176,21 @@
@pagination="getList"
/>
<!-- 发票预览弹窗 -->
<el-dialog
v-model="pdfDialogVisible"
title="发票预览"
width="80%"
top="5vh"
>
<iframe
v-if="invoiceUrl"
:src="invoiceUrl"
style="width: 100%; height: 80vh; border: none;"
/>
</el-dialog>
<!-- 添加或修改订单管理-需求单管理对话框 -->
<el-dialog :title="title" v-model="open" width="500px" append-to-body>
<div>
......@@ -198,7 +209,7 @@
</div>
<div class="info-item flex-align-center flex-space-between">
<div class="label">商品类别</div>
<div class="label">资源类型</div>
<div class="value">{{ form.categoryName }}</div>
</div>
......@@ -229,21 +240,17 @@
</el-dialog>
</div>
<OrderViewInvoiceForm ref="OrderViewInvoiceFormRef" @success="getList"/>
</template>
<script setup name="MyOrder">
import {
listOrder
} from '@/api/computility/order'
import {appInvoiceRequest} from '@/api/computility/order'
import {orderInvoiceRequest, getCategories} from '@/api/computility/order'
import {parseTime} from "../../utils/ruoyi.js";
import {getResources} from "@/api/computility/resources.js";
import {ElMessage} from "element-plus";
import {InvoiceRequestEnum} from "@/utils/constants.js";
import OrderViewInvoiceForm from "@/views/console/OrderViewInvoiceForm.vue";
const {proxy} = getCurrentInstance()
const orderList = ref([])
......@@ -260,7 +267,7 @@ const data = reactive({
pageNum: 1,
pageSize: 10,
orderNo: null,
category: null,
categoryId: null,
model: null,
cpu: null,
gpu: null,
......@@ -315,9 +322,13 @@ function getList() {
})
}
const OrderViewInvoiceFormRef = ref()
const viewInvoice = (row) => {
OrderViewInvoiceFormRef.value.open(row)
const applicationCategory = ref([])
function loadCategories() {
getCategories().then(res => {
applicationCategory.value = res.data || []
})
}
// 取消按钮
......@@ -331,7 +342,7 @@ function reset() {
form.value = {
id: null,
orderNo: null,
category: null,
categoryId: null,
model: null,
cpu: null,
gpu: null,
......@@ -377,7 +388,7 @@ function handleDetails(row) {
}
function invoiceRequest(row) {
appInvoiceRequest(row).then((response) => {
orderInvoiceRequest(row).then((response) => {
getList();
proxy.$modal.msgSuccess("已成功申请");
}).catch((r) => {
......@@ -385,7 +396,18 @@ function invoiceRequest(row) {
)
}
const pdfDialogVisible = ref(false)
const invoiceUrl = ref('')
function viewInvoice(row) {
invoiceUrl.value = import.meta.env.VITE_APP_BASE_API+'/infra/file/preview?url=' + row.invoiceUrl // 从接口带回的 pdf 地址
pdfDialogVisible.value = true
}
getList()
loadCategories()
</script>
......
......@@ -2,7 +2,7 @@
<div class="app-container">
<el-table v-loading="loading" :data="resourcesList" :max-height="620">
<el-table-column label="订单编号" align="center" prop="tradeOrderNo"/>
<el-table-column label="商品类别" align="center" prop="categoryName"/>
<!-- <el-table-column label="商品类别" align="center" prop="categoryName"/>-->
<el-table-column
v-for="(item, index) in resourcesList[0]?.properties.length!==0?resourcesList[0]?.properties.slice(0,4):resourcesList[0]?.properties"
:key="index"
......@@ -47,10 +47,10 @@
<div class="value">{{ form.tradeOrderNo }}</div>
</div>
<div class="info-item flex-align-center flex-space-between">
<div class="label">商品类别</div>
<div class="value">{{ form.categoryName }}</div>
</div>
<!-- <div class="info-item flex-align-center flex-space-between">-->
<!-- <div class="label">商品类别</div>-->
<!-- <div class="value">{{ form.categoryName }}</div>-->
<!-- </div>-->
</div>
......
......@@ -301,8 +301,7 @@ const selectSpec = (idx) => {
};
const pdfUrl_unuse = ref('https://luhu-ltx.oss-cn-shenzhen.aliyuncs.com/20250828/文字文稿1_1756349853834.pdf')
const pdfUrl = ref('http://localhost:48080/admin-api/infra/file/preview')
const pdfUrl = ref(import.meta.env.VITE_APP_BASE_API+'/infra/file/preview?url=https://luhu-ltx.oss-cn-shenzhen.aliyuncs.com/20250918/buy_1758208746972.pdf')
const qrCode = ref({
url: '',
......
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or sign in to comment