Skip to content

phsl / client

Go to a project
Commit ed107576 by Jony.L
Options

订单相关提交01

parent 06a9e9bc
Showing with 117 additions and 62 deletions
src/api/computingResource.js
...@@ -47,6 +47,13 @@ export function orderBuy (query) { ...@@ -47,6 +47,13 @@ export function orderBuy (query) {
}) })
} }
export function bizOrderSubmit(query){
return request({
url: '/api/v1/bizOrderSubmit',
method: 'post',
data: query
})
}
// 确认订单回显数据 // 确认订单回显数据
export function confirmOrderInfo (query) { export function confirmOrderInfo (query) {
return request({ return request({
......
src/views/computingResource/resourceList.vue
...@@ -66,21 +66,21 @@ ...@@ -66,21 +66,21 @@
<el-table-column prop="term" label="时长" sortable/> <el-table-column prop="term" label="时长" sortable/>
<el-table-column label="操作" width="204px"> <el-table-column label="操作" width="204px">
<template #default="{row}"> <template #default="{row}">
<el-button class="action-button" @click="selectedProduct(1,row.id)">加入购物车</el-button> <!-- <el-button class="action-button" @click="selectedProduct(1,row.id)">加入购物车</el-button>-->
<el-button type="primary" class="action-button" @click="selectedProduct(2,row.id)">立即申请 <el-button type="primary" class="action-button" @click="selectedProduct(2,row.id)">立即购买
</el-button> </el-button>
</template> </template>
</el-table-column> </el-table-column>
</el-table> </el-table>
</div> </div>
<!--卡片形式-->
<div v-if="showVersion === 2" class="version-2"> <div v-if="showVersion === 2" class="version-2">
<el-row :gutter="24"> <el-row :gutter="24">
<el-col v-for="(item,index) in tableData" :key="index" :span="6"> <el-col v-for="(item,index) in tableData" :key="index" :span="6">
<div class="product-card"> <div class="product-card">
<div class="top-info"> <div class="top-info">
<div class="title">{{ item.model }}</div> <div class="title">{{ item.model }}</div>
<div class="title">{{item.term}}</div> <div class="title">{{ item.term }}</div>
<div class="tag"> <div class="tag">
<!--<el-tag type="warning" effect="dark">性价比</el-tag>--> <!--<el-tag type="warning" effect="dark">性价比</el-tag>-->
<!--<el-tag type="info" effect="plain">专家推荐</el-tag>--> <!--<el-tag type="info" effect="plain">专家推荐</el-tag>-->
...@@ -119,12 +119,12 @@ ...@@ -119,12 +119,12 @@
</el-col> </el-col>
</el-row> </el-row>
<el-divider></el-divider> <el-divider></el-divider>
<div class="flex-justify-end price">￥{{ item.publicPrice }}{{item.unitTypeName}}</div> <div class="flex-justify-end price">￥{{ item.publicPrice }}{{ item.unitTypeName }}</div>
<!--<div class="flex-justify-end month-expenses">约￥15/月</div>--> <!--<div class="flex-justify-end month-expenses">约￥15/月</div>-->
<el-divider></el-divider> <el-divider></el-divider>
<div class="footer-action flex"> <div class="footer-action flex">
<el-button class="action-button" @click="selectedProduct(1,item.id)">加入购物车</el-button> <!-- <el-button class="action-button" @click="selectedProduct(1,item.id)">加入购物车</el-button>-->
<el-button type="primary" class="action-button" @click="selectedProduct(2,item.id)">立即申请 <el-button type="primary" class="action-button" @click="selectedProduct(2,item.id)">立即购买
</el-button> </el-button>
</div> </div>
</div> </div>
...@@ -155,6 +155,7 @@ ...@@ -155,6 +155,7 @@
<div class="label">型号</div> <div class="label">型号</div>
<div class="value">{{ productDetail.model }}</div> <div class="value">{{ productDetail.model }}</div>
</div> </div>
</div> </div>
<div class="info-block"> <div class="info-block">
...@@ -242,9 +243,9 @@ import { ...@@ -242,9 +243,9 @@ import {
computilityMenu, computilityMenu,
getRListByCategory, getRListByCategory,
getRDetail, getRDetail,
orderBuy, // orderBuy,
shoppingAdd, shoppingAdd,
orderComputer orderComputer, bizOrderSubmit
} from '@/api/computingResource.js' } from '@/api/computingResource.js'
import {useRoute, useRouter} from 'vue-router' import {useRoute, useRouter} from 'vue-router'
...@@ -306,41 +307,43 @@ function selectedProduct(type, id) { ...@@ -306,41 +307,43 @@ function selectedProduct(type, id) {
selectedType.value = type selectedType.value = type
selectedId.value = id selectedId.value = id
getRDetail({id}).then(res => { getRDetail({id}).then(res => {
res.data.options.forEach(item => { // res.data.options.forEach(item => {
if ([0, 1, 4].includes(item.type)) { // if ([0, 1, 4].includes(item.type)) {
item.value = item.options[0].id // item.value = item.options[0].id
} // }
if (item.type === 2) { // if (item.type === 2) {
item.value = 1 // item.value = 1
} // }
}) // })
productDetail.value = res.data productDetail.value = res.data
orderComputerPrice() // orderComputerPrice()
orderPrice.value=res.data.publicPrice;
showDrawer.value = true showDrawer.value = true
}) })
} }
function initSubmitData() { // function initSubmitData() {
return { // return {
id: selectedId.value, // id: selectedId.value,
num: form.value.num, // num: form.value.num,
computerItems: productDetail.value.options.map(item => { // computerItems: productDetail.value.options.map(item => {
if ([0, 1, 4].includes(item.type)) { // if ([0, 1, 4].includes(item.type)) {
return { // return {
id: item.id, // id: item.id,
name: item.label, // name: item.label,
valueId: item.value // valueId: item.value
} // }
} // }
return { // return {
id: item.id, // id: item.id,
name: item.label, // name: item.label,
valueId: item.options[0].id, // valueId: item.options[0].id,
value: item.value.toString() // value: item.value.toString()
} // }
}) // })
} // }
} // }
const orderPrice = ref(0) const orderPrice = ref(0)
...@@ -350,33 +353,78 @@ function orderComputerPrice() { ...@@ -350,33 +353,78 @@ function orderComputerPrice() {
}) })
} }
function submit() { function getSubmitData(){
const data = initSubmitData() return{
if (selectedType.value === 1) { skuId : selectedId.value,
shoppingAdd(data).then(res => {
ElMessageBox.confirm(
'添加到购物车成功',
{
confirmButtonText: '去提交',
cancelButtonText: '关闭',
type: 'success'
}
).then(() => {
router.push('/computingResource/shoppingCart')
}).catch(() => {
})
})
} }
}
if (selectedType.value === 2) { function submit() {
orderBuy(data).then(res => { // 弹出确认对话框
router.push({ ElMessageBox.confirm(
path: '/computingResource/confirmOrder', '确定购买吗？', // 对话框提示文字
query: {id: res.data} '购买确认', // 对话框标题
{
confirmButtonText: '确认', // 确认按钮文字
cancelButtonText: '取消', // 取消按钮文字
type: 'warning' // 对话框类型（警告样式）
}
)
.then(() => {
// 用户点击“确认”时执行
// 1. 获取提交数据（复用之前的 initSubmitData 函数）
const submitData = getSubmitData();
// 2. 调用购买接口（此处用 TODO 标记实际接口逻辑）
// TODO: 实际接口调用代码，例如：
bizOrderSubmit(submitData).then(res => {
// 接口调用成功后的处理（如跳转订单页）
}).catch(err => {
// 接口调用失败的处理（如提示错误）
});
// 3. 关闭抽屉（如果需要）
showDrawer.value = false;
}) })
}) .catch(() => {
} // 用户点击“取消”时执行（不做任何操作）
// console.log('用户取消购买');
// 可以添加取消后的提示（可选）
// ElMessage({
// type: 'info',
// message: '已取消购买'
// });
});
} }
// function submit() {
// const data = initSubmitData()
// if (selectedType.value === 1) {
// shoppingAdd(data).then(res => {
// ElMessageBox.confirm(
// '添加到购物车成功',
// {
// confirmButtonText: '去提交',
// cancelButtonText: '关闭',
// type: 'success'
// }
// ).then(() => {
// router.push('/computingResource/shoppingCart')
// }).catch(() => {
// })
// })
//
// }
//
// if (selectedType.value === 2) {
// orderBuy(data).then(res => {
// router.push({
// path: '/computingResource/confirmOrder',
// query: {id: res.data}
// })
// })
// }
// }
</script> </script>
<style scoped lang="scss"> <style scoped lang="scss">
......
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