| | |
| | | :colspan="getColspan(priceItem)" |
| | | class="feature-value" |
| | | > |
| | | <div class="order-methods"> |
| | | <span |
| | | v-for="method in priceItem.priceSettings" |
| | | :key="method" |
| | | class="method-item" |
| | | > |
| | | ✓ {{ getPriceSettingText(method) }} |
| | | </span> |
| | | </div> |
| | | {{ priceItem.priceSettings.map((m:any) => getPriceSettingText(m)).join('、') }} |
| | | </td> |
| | | </tr> |
| | | <tr> |
| | |
| | | :colspan="getColspan(priceItem)" |
| | | class="feature-value" |
| | | > |
| | | <div class="price-info"> |
| | | <div |
| | | v-if="priceItem.priceSettings.includes('POINTS') && priceItem.pointsAmount > 0" |
| | | class="price-item" |
| | | > |
| | | <div class="price-lable-icon"> |
| | | <el-icon class="price-icon points"><Coin /></el-icon> |
| | | <span class="price-label">积分</span> |
| | | </div> |
| | | <span class="price-value points">{{ formatNumber(priceItem.pointsAmount) }} / {{ getPriceUnitText(priceItem.priceUnit) }}</span> |
| | | </div> |
| | | <div |
| | | v-if="priceItem.priceSettings.includes('CURRENCY') && priceItem.currencyAmount > 0" |
| | | class="price-item" |
| | | > |
| | | <div class="price-lable-icon"> |
| | | <span class="price-icon currency">¥</span> |
| | | <span class="price-label">货币</span> |
| | | </div> |
| | | <span class="price-value currency">{{ formatNumber(priceItem.currencyAmount) }} / {{ getPriceUnitText(priceItem.priceUnit) }}</span> |
| | | </div> |
| | | <div |
| | | v-if="priceItem.priceSettings.includes('FREE')" |
| | | class="price-item" |
| | | > |
| | | <span class="price-label">费用</span> |
| | | <span class="price-value free">免费</span> |
| | | </div> |
| | | <div |
| | | v-if="priceItem.priceSettings.includes('AGREEMENT')" |
| | | class="price-item" |
| | | > |
| | | <span class="price-label">协议:</span> |
| | | <span class="price-value agreement">每{{ getPriceUnitText(priceItem.priceUnit) }}</span> |
| | | </div> |
| | | </div> |
| | | {{ renderPrice(priceItem) }} |
| | | </td> |
| | | </tr> |
| | | <tr> |
| | |
| | | <table class="order-info-table"> |
| | | <tbody> |
| | | <tr> |
| | | <td class="label">订单编号:</td> |
| | | <td class="value">{{ orderStatus.id }}</td> |
| | | <td class="label">申请时间:</td> |
| | | <td class="label">订单编号</td> |
| | | <td class="value"> |
| | | {{ orderStatus.id }} |
| | | <el-link type="primary" @click="goBuyerCenter" style="margin-left: 8px">点击查看</el-link> |
| | | </td> |
| | | <td class="label">申请时间</td> |
| | | <td class="value">{{ orderStatus.applyTime }}</td> |
| | | </tr> |
| | | <tr> |
| | | <td class="label">产品名称:</td> |
| | | <td class="label">产品名称</td> |
| | | <td class="value">{{ orderStatus.productName }}</td> |
| | | <td class="label">提供者:</td> |
| | | <td class="label">提供者</td> |
| | | <td class="value">{{ orderStatus.provider }}</td> |
| | | </tr> |
| | | <tr> |
| | | <td class="label">订单状态:</td> |
| | | <td class="label">订单状态</td> |
| | | <td class="value">{{ statusText(orderStatus.status) }}</td> |
| | | <td></td> |
| | | <td class="value link"> |
| | | <el-link type="primary" @click="viewOrder">查看订单信息</el-link> |
| | | <!-- <el-link type="primary" @click="viewOrder">查看订单信息</el-link>--> |
| | | </td> |
| | | </tr> |
| | | </tbody> |
| | |
| | | <div class="footer" v-if="showPricePanel"> |
| | | <el-button type="primary" @click="handleOrder">立即订购</el-button> |
| | | </div> |
| | | <div class="footer" v-else> |
| | | <div class="footer" v-if="showOrderPanel"> |
| | | <el-button @click="returnPricePanel">返回价格对比</el-button> |
| | | <el-button type="primary" @click="submitOrder">提交申请</el-button> |
| | | </div> |
| | |
| | | |
| | | <script setup lang="ts"> |
| | | import { ref, watch, computed, onMounted } from 'vue' |
| | | import { useRouter } from 'vue-router' |
| | | import { ElMessage } from 'element-plus' |
| | | import { useRoute } from 'vue-router' |
| | | import productPricingApi from '@/api/productPricingApi' |
| | |
| | | import workFlowApi from '@/api/workFlowApi' |
| | | |
| | | const route = useRoute() |
| | | const router = useRouter() |
| | | |
| | | interface PriceItem { |
| | | id: number |
| | |
| | | const viewOrder = () => { |
| | | window.alert('这里可跳转到订单详情页(示例)') |
| | | } |
| | | |
| | | const goBuyerCenter = () => { |
| | | router.push({ name: 'tradeBuyerCenter', query: { t: String(Date.now()) } }) |
| | | } |
| | | |
| | | const selectedCount = computed(() => orderSuites.value.filter(s => s.selected).length) |
| | | const totalByType = computed(() => { |
| | |
| | | try { |
| | | await removeFromCart(String(suite.id)) |
| | | orderSuites.value.splice(index, 1) |
| | | selectedSuiteIds.value.delete(suite.id) |
| | | } catch (e) { |
| | | } |
| | | } |
| | |
| | | |
| | | loading.value = true |
| | | try { |
| | | // 只查询一起用的定价 |
| | | // 只查询已启用的定价 |
| | | const res: any = await productPricingApi.listBycondition({ productId: productId,isActive: true }) |
| | | if (res?.code === 200) { |
| | | const list = Array.isArray(res.data) ? res.data : [] |
| | |
| | | }else{ |
| | | paymentType = '协议' |
| | | } |
| | | let processdefId: string = '' |
| | | const type = hasAGREEMENT ? 'trade_agreement' : 'trade_point'; |
| | | // 获取工作流参数 |
| | | const wkParamsRes: any = await workFlowApi.getWorkFlowParams({ |
| | | type: type, |
| | | // unitId: '1', |
| | | businessKey: type |
| | | }) |
| | | if(wkParamsRes?.code === 200 && wkParamsRes.data?.processTemplateId){ |
| | | processdefId = wkParamsRes.data.processTemplateId |
| | | }else { |
| | | ElMessage.error('获取工作流参数失败!') |
| | | return |
| | | } |
| | | |
| | | // 组装创建订单参数(CreateOrderDTO) |
| | | const payload = { |
| | | userId: currentUserId.value, |
| | |
| | | providerId: productHeader.value.createUserId, |
| | | paymentType: paymentType, |
| | | buyerRemarks: '', |
| | | processdefId: processdefId, |
| | | items: items.map(it => ({ |
| | | pricingId: it.id, |
| | | productId: it.productId, |
| | |
| | | applyTime: data.applyTime ? String(data.applyTime) : new Date().toLocaleString() |
| | | } |
| | | // 调用工作流接口发起审批流程,拿到流程实例ID后回写订单workflow_id |
| | | try { |
| | | // 根据是否包含协议明细,配置不同流程定义与业务Key(先用静态值占位) |
| | | // const processdefId = hasAGREEMENT ? 'Process_Agreement_Static' : 'Process_Points_Static' |
| | | const businessKey = hasAGREEMENT ? 'agreement_biz_key' : 'points_biz_key' |
| | | const type = hasAGREEMENT ? 'trade_agreement' : 'trade_point'; |
| | | // 获取工作流参数 |
| | | const wkParamsRes: any = await workFlowApi.getWorkFlowParams({ |
| | | type: type, |
| | | unitId: '1' |
| | | }) |
| | | if(wkParamsRes?.code === 200 && wkParamsRes.data?.processTemplateId){ |
| | | const wfRes: any = await workFlowApi.startWorkflowAndComplete({ |
| | | processdefId: wkParamsRes.data.processTemplateId, |
| | | userid: String(currentUserId.value || ''), |
| | | businessKey: businessKey |
| | | }) |
| | | if (wfRes?.code === 200 && wfRes.data?.processinstId) { |
| | | await orderApi.updateWorkflowId(data.orderId, wfRes.data.processinstId) |
| | | } |
| | | } |
| | | |
| | | } catch (e) { |
| | | console.warn('启动工作流失败或更新workflow_id失败', e) |
| | | } |
| | | // 放后端处理 |
| | | // try { |
| | | // // 根据是否包含协议明细,配置不同流程定义与业务Key(先用静态值占位) |
| | | // // const processdefId = hasAGREEMENT ? 'Process_Agreement_Static' : 'Process_Points_Static' |
| | | // const businessKey = hasAGREEMENT ? 'agreement_biz_key' : 'points_biz_key' |
| | | // const type = hasAGREEMENT ? 'trade_agreement' : 'trade_point'; |
| | | // // 获取工作流参数 |
| | | // const wkParamsRes: any = await workFlowApi.getWorkFlowParams({ |
| | | // type: type, |
| | | // unitId: '1' |
| | | // }) |
| | | // if(wkParamsRes?.code === 200 && wkParamsRes.data?.processTemplateId){ |
| | | // const wfRes: any = await workFlowApi.startWorkflowAndComplete({ |
| | | // processdefId: wkParamsRes.data.processTemplateId, |
| | | // userid: String(currentUserId.value || ''), |
| | | // businessKey: businessKey |
| | | // }) |
| | | // if (wfRes?.code === 200 && wfRes.data?.processinstId) { |
| | | // await orderApi.updateWorkflowId(data.orderId, wfRes.data.processinstId) |
| | | // } |
| | | // } |
| | | // |
| | | // } catch (e) { |
| | | // console.warn('启动工作流失败或更新workflow_id失败', e) |
| | | // } |
| | | |
| | | // 清空购物车(后端 + 本地状态) |
| | | try { |
| | | const clearRes: any = await cartApi.clearCart(currentUserId.value, currentUnitId.value,currentProductId.value) |
| | | const clearRes: any = await cartApi.clearCart(currentUserId.value, currentUnitId.value,currentProductId.value ? currentProductId.value : '') |
| | | if (clearRes?.code === 200) { |
| | | cartItems.value = [] |
| | | orderSuites.value = [] |
| | |
| | | |
| | | const removeFromCart = async (pricingId: string) => { |
| | | try { |
| | | const res: any = await cartApi.removeFromCart(currentUserId.value, currentUnitId.value, currentProductId.value,pricingId) |
| | | const res: any = await cartApi.removeFromCart(currentUserId.value, currentUnitId.value, currentProductId.value? currentProductId.value : '',pricingId) |
| | | if (res?.code === 200) { |
| | | ElMessage.success('已从购物车移除') |
| | | } else { |
| | |
| | | } |
| | | } |
| | | |
| | | const updateCartItem = async (pricingId: number, quantity: number, duration: number) => { |
| | | const updateCartItem = async (pricingId: number, quantity: number | null, duration: number | null) => { |
| | | try { |
| | | // 这里需要根据实际接口调整,可能需要传递更多参数 |
| | | let res: any = {} |
| | | if(quantity){ |
| | | res = await cartApi.updateCartItem(currentUserId.value, currentUnitId.value, currentProductId.value, pricingId, quantity) |
| | | res = await cartApi.updateCartItem(currentUserId.value, currentUnitId.value, currentProductId.value? currentProductId.value : '', pricingId, quantity) |
| | | } |
| | | if(duration){ |
| | | res = await cartApi.updateCartItemDuration(currentUserId.value, currentUnitId.value, currentProductId.value, pricingId, duration) |
| | | res = await cartApi.updateCartItemDuration(currentUserId.value, currentUnitId.value, currentProductId.value? currentProductId.value : '', pricingId, duration) |
| | | } |
| | | if (res?.code === 200) { |
| | | ElMessage.success('购物车已更新') |
| | |
| | | const fetchCartItems = async () => { |
| | | cartLoading.value = true |
| | | try { |
| | | const res: any = await cartApi.getCartItems(currentUserId.value, currentUnitId.value, currentProductId.value) |
| | | const res: any = await cartApi.getCartItems(currentUserId.value, currentUnitId.value, currentProductId.value? currentProductId.value : '') |
| | | if (res?.code === 200) { |
| | | cartItems.value = res.data || [] |
| | | // 将购物车数据转换为订单套件格式 |
| | |
| | | PRIVATE_INCREMENT: '私有增量包', |
| | | PUBLIC_INCREMENT: '公有增量包', |
| | | OTA: 'OTA服务', |
| | | CLOUD: '云服务' |
| | | CLOUD: '云服务', |
| | | RESOURCE_PACKAGE: '资源包', |
| | | PERSONAL: '个人' |
| | | } |
| | | return map[salesForm] || salesForm |
| | | } |
| | |
| | | return map[unit] || unit |
| | | } |
| | | |
| | | // 统一渲染价格:去除“积分/货币/费用/协议”等类型前缀,仅输出纯价格文本 |
| | | const renderPrice = (priceItem: PriceItem) => { |
| | | const segments: string[] = [] |
| | | if (priceItem.priceSettings.includes('POINTS') && priceItem.pointsAmount > 0) { |
| | | segments.push(`${formatNumber(priceItem.pointsAmount)} / ${getPriceUnitText(priceItem.priceUnit)}`) |
| | | } |
| | | if (priceItem.priceSettings.includes('CURRENCY') && priceItem.currencyAmount > 0) { |
| | | segments.push(`${formatNumber(priceItem.currencyAmount)} / ${getPriceUnitText(priceItem.priceUnit)}`) |
| | | } |
| | | if (priceItem.priceSettings.includes('FREE')) { |
| | | segments.push('免费') |
| | | } |
| | | if (priceItem.priceSettings.includes('AGREEMENT')) { |
| | | segments.push(`每${getPriceUnitText(priceItem.priceUnit)}`) |
| | | } |
| | | return segments.join(';') |
| | | } |
| | | |
| | | // 获取分组后的表头数据 |
| | | const getGroupedHeaders = (tabData: PriceItem[]) => { |
| | | const groups: Record<string, { count: number; productSuite: string }> = {} |