| | |
| | | |
| | | <el-descriptions v-if="productDetail" :column="2" border> |
| | | <el-descriptions-item label="产品名称" label-width="10%">{{ productDetail.name }}</el-descriptions-item> |
| | | <el-descriptions-item label="提报单位" label-width="10%">{{ productDetail.submitUnit }}</el-descriptions-item> |
| | | <el-descriptions-item label="提报人" label-width="10%">{{ productDetail.submitter }}</el-descriptions-item> |
| | | <el-descriptions-item label="行业领域" label-width="10%">{{ productDetail.industry }}</el-descriptions-item> |
| | | <el-descriptions-item label="单位工程" label-width="10%">{{ productDetail.projectUnit }}</el-descriptions-item> |
| | | <el-descriptions-item label="产业阶段" label-width="10%">{{ productDetail.industryStage }}</el-descriptions-item> |
| | | <el-descriptions-item label="产品类型"label-width="10%">{{ productDetail.productType }}</el-descriptions-item> |
| | | <el-descriptions-item label="提报单位" label-width="10%">{{ productDetail.submissionUnit }}</el-descriptions-item> |
| | | <el-descriptions-item label="提报人" label-width="10%">{{ productDetail.createBy }}</el-descriptions-item> |
| | | <el-descriptions-item label="行业领域" label-width="10%">{{ productDetail.industrialChainName }}</el-descriptions-item> |
| | | <el-descriptions-item label="单位工程" label-width="10%">{{ productDetail.importantAreaName }}</el-descriptions-item> |
| | | <el-descriptions-item label="产业阶段" label-width="10%">{{ productDetail.businessProcessName }}</el-descriptions-item> |
| | | <el-descriptions-item label="产品类型"label-width="10%">{{ productDetail.typeName }}</el-descriptions-item> |
| | | <el-descriptions-item label="产品简介" :span="3"> |
| | | <div class="intro">{{ productDetail.description }}</div> |
| | | <div class="intro">{{ productDetail.describe }}</div> |
| | | </el-descriptions-item> |
| | | </el-descriptions> |
| | | <el-empty v-else description="未找到该产品的详情" /> |
| | |
| | | class="pricing-group" |
| | | > |
| | | <div class="group-header">{{ group.suiteName }}</div> |
| | | <div class="pricing-cards-wrapper"> |
| | | <div |
| | | <div class="pricing-cards-wrapper"> |
| | | <div |
| | | v-for="pricing in group.items" |
| | | :key="pricing.id" |
| | | class="pricing-card" |
| | | :class="{ |
| | | 'pricing-card-enabled': pricing.enableStatus === 'ENABLED', |
| | | 'pricing-card-disabled': pricing.enableStatus === 'DISABLED' |
| | | }" |
| | | > |
| | | :key="pricing.id" |
| | | class="pricing-card" |
| | | :class="{ |
| | | 'pricing-card-enabled': pricing.enableStatus === 'ENABLED', |
| | | 'pricing-card-disabled': pricing.enableStatus === 'DISABLED' |
| | | }" |
| | | > |
| | | <div class="pricing-card-table"> |
| | | <div class="pricing-row"> |
| | | <div class="pricing-cell label-cell">销售形式</div> |
| | |
| | | class="price-form" |
| | | > |
| | | |
| | | <el-form-item label="产品套件" prop="productSuite"> |
| | | <el-form-item label="产品套件" prop="productSuite"> |
| | | <el-select v-model="formData.productSuite" placeholder="请选择" style="width: 60%"> |
| | | <el-option v-for="opt in productSuiteOptions" :key="opt.value" :label="opt.label" :value="opt.value" /> |
| | | </el-select> |
| | | </el-form-item> |
| | | <el-form-item label="客户对象" prop="customerObject"> |
| | | <el-form-item label="客户对象" prop="customerObject"> |
| | | <el-radio-group v-model="formData.customerObject"> |
| | | <el-radio v-for="opt in customerObjectOptions" :key="opt.value" :label="opt.value">{{ opt.label }}</el-radio> |
| | | </el-radio-group> |
| | | </el-form-item> |
| | | </el-form-item> |
| | | <el-form-item label="销售形式" prop="salesForm" class="sales-form-item"> |
| | | <el-radio-group v-model="formData.salesForm" class="sales-form-group"> |
| | | <el-radio v-for="opt in salesFormOptions" :key="opt.value" :label="opt.value">{{ opt.label }}</el-radio> |
| | |
| | | <el-radio v-for="opt in enableStatusOptions" :key="opt.value" :label="opt.value">{{ opt.label }}</el-radio> |
| | | </el-radio-group> |
| | | </el-form-item> |
| | | |
| | | |
| | | |
| | | <el-form-item label="备注"> |
| | | <el-input type="textarea" v-model="formData.remark" :rows="3" placeholder="请输入备注" /> |
| | |
| | | </template> |
| | | </el-dialog> |
| | | |
| | | <!-- 价格查看器 --> |
| | | <ProductPriceViewer |
| | | v-model="showPriceViewer" |
| | | :product-id="currentProductId" |
| | | @order="handleOrderResult" |
| | | /> |
| | | </div> |
| | | </template> |
| | | |
| | |
| | | import { Goods, Lock, Unlock } from '@element-plus/icons-vue' |
| | | import ProductPriceViewer from '@/views/productManage/productPriceViewer/index.vue' |
| | | import productPricingApi from '@/api/productPricingApi' |
| | | import productApi from '@/api/productApi' |
| | | |
| | | |
| | | interface ProductDetail { |
| | | id: string |
| | | name: string |
| | | submitUnit: string |
| | | submitter: string |
| | | industry: string |
| | | projectUnit: string |
| | | industryStage: string |
| | | productType: string |
| | | description: string |
| | | submissionUnit: string |
| | | createBy: string |
| | | industrialChainName: string |
| | | importantAreaName: string |
| | | businessProcessName: string |
| | | typeName: string |
| | | describe: string |
| | | shelfStatus?: '待上架' | '已上架' | '已下架' |
| | | listingStatusName?: '' |
| | | } |
| | | |
| | | interface PriceItem { |
| | |
| | | }) |
| | | |
| | | const productDetail = ref<ProductDetail | null>(null) |
| | | const shelfStatus = computed(() => productDetail.value?.shelfStatus || '待上架') |
| | | const shelfStatus = computed(() => productDetail.value?.listingStatusName || '待上架') |
| | | const statusClass = computed(() => { |
| | | switch (shelfStatus.value) { |
| | | case '已上架': |
| | |
| | | }) |
| | | |
| | | // 模拟产品详情数据源 |
| | | const mockProductMap: Record<string, ProductDetail> = { |
| | | '1': { |
| | | id: '1', |
| | | name: '数字化产品A', |
| | | submitUnit: '中交一公局', |
| | | submitter: '张三', |
| | | industry: '交通基础设施', |
| | | projectUnit: '某高速公路工程', |
| | | industryStage: '应用阶段', |
| | | productType: '软件/平台', |
| | | description: '本产品定位为以建设期BIM数字资产作为数字底盘,结合项目运营维保需求的实时性、交互性、便捷性的三维可视化运维管理系统。系统提供项目数字化、智能化运维管理功能,能够解决建筑运行维护管理中的实际问题,实现信息快速整合与查询、信息有效共享与传递,提升项目综合管理与维护水平。', |
| | | shelfStatus: '待上架' |
| | | }, |
| | | '2': { |
| | | id: '2', |
| | | name: '数字化产品B', |
| | | submitUnit: '中交二航局', |
| | | submitter: '李四', |
| | | industry: '市政工程', |
| | | projectUnit: '智慧管廊项目', |
| | | industryStage: '研发阶段', |
| | | productType: '硬件/传感', |
| | | description: '面向城市管廊监测的传感设备与采集网关,支持边缘计算与远程运维。', |
| | | shelfStatus: '已上架' |
| | | } |
| | | } |
| | | // const mockProductMap: Record<string, ProductDetail> = { |
| | | // '1': { |
| | | // id: '1', |
| | | // name: '数字化产品A', |
| | | // submitUnit: '中交一公局', |
| | | // submitter: '张三', |
| | | // industry: '交通基础设施', |
| | | // projectUnit: '某高速公路工程', |
| | | // industryStage: '应用阶段', |
| | | // productType: '软件/平台', |
| | | // description: '本产品定位为以建设期BIM数字资产作为数字底盘,结合项目运营维保需求的实时性、交互性、便捷性的三维可视化运维管理系统。系统提供项目数字化、智能化运维管理功能,能够解决建筑运行维护管理中的实际问题,实现信息快速整合与查询、信息有效共享与传递,提升项目综合管理与维护水平。', |
| | | // shelfStatus: '待上架' |
| | | // }, |
| | | // '2': { |
| | | // id: '2', |
| | | // name: '数字化产品B', |
| | | // submitUnit: '中交二航局', |
| | | // submitter: '李四', |
| | | // industry: '市政工程', |
| | | // projectUnit: '智慧管廊项目', |
| | | // industryStage: '研发阶段', |
| | | // productType: '硬件/传感', |
| | | // description: '面向城市管廊监测的传感设备与采集网关,支持边缘计算与远程运维。', |
| | | // shelfStatus: '已上架' |
| | | // } |
| | | // } |
| | | |
| | | const loading = ref(false) |
| | | const priceList = ref<any[]>([]) |
| | |
| | | } |
| | | loading.value = true |
| | | try { |
| | | productDetail.value = mockProductMap[productId] || null |
| | | // const detailRes: any = await productApi.getProductDetail({ id: productId }) |
| | | // if (detailRes?.code === 200) { |
| | | // productDetail.value = detailRes.data || null |
| | | // } else { |
| | | // productDetail.value = null |
| | | // ElMessage.error(detailRes?.msg || '获取产品详情失败') |
| | | // } |
| | | // productDetail.value = mockProductMap[productId] || null |
| | | const data = { |
| | | id: productId |
| | | } |
| | | const detailRes: any = await productApi.getProductById(data) |
| | | if (detailRes?.code === 200) { |
| | | productDetail.value = detailRes.data || null |
| | | } else { |
| | | productDetail.value = null |
| | | ElMessage.error(detailRes?.msg || '获取产品详情失败') |
| | | } |
| | | await loadPricingList(productId) |
| | | } catch (e) { |
| | | productDetail.value = null |
| | |
| | | |
| | | return { |
| | | id: row.id, |
| | | productId: Number(row.productId), |
| | | productId: row.productId, |
| | | productName: productDetail.value?.name, |
| | | suiteName: row.productSuite, |
| | | salesForm: mapSalesFormToCN(row.salesForm), |
| | |
| | | |
| | | return { |
| | | id: isEditMode.value && formData.id ? formData.id : undefined, |
| | | productId: Number(currentProductId.value), |
| | | productId: currentProductId.value, |
| | | productName: productDetail.value?.name, |
| | | suiteName: formData.productSuite, |
| | | salesForm: mapSalesFormToCN(formData.salesForm), |
| | |
| | | const res: any = await productPricingApi.update(payload) |
| | | if (res?.code === 200) { |
| | | ElMessage.success('修改成功') |
| | | } else { |
| | | } else { |
| | | ElMessage.error(res?.msg || '修改失败') |
| | | return |
| | | } |
| | |
| | | return |
| | | } |
| | | ElMessage.success('新建成功') |
| | | // 修改产品状态为已订价 |
| | | // 判断 产品定价列表是否为空,为空则更新状态,不为空则说明更新过了,不需要在此更新 |
| | | if (priceList.value.length === 0) { |
| | | const updateParams = { |
| | | id: currentProductId.value, |
| | | listingStatus: 'PRICED' |
| | | } |
| | | const res: any = await productApi.updateProductStatus(updateParams) |
| | | if (res?.code !== 200) { |
| | | console.log('产品状态更新失败!!') |
| | | } |
| | | } |
| | | } |
| | | |
| | | dialogVisible.value = false |