recommend-report
v1.30.0
Published
推荐数字报告组件
Readme
enterprise-report
推荐报告组件
安装
npm install recommendation-report --save使用
<template>
<div>
<!-- 自定义头部 -->
<div class="header">
<button @click="handleDownload">下载报告</button>
</div>
<!-- 使用报告组件 -->
<RecommendReport
:report-info="reportData"
:download-file="downloadFile"
@preview-image="handlePreview"
/>
</div>
</template>
<script>
import RecommendReport from 'recommendation-report';
import { downloadFile } from '@/utils/index.js';
export default {
components: { RecommendReport },
data() {
return {
reportData: null
};
},
async created() {
// 获取报告数据
const res = await this.$api.getReportData({ id: this.reportId });
this.reportData = res.data;
},
methods: {
downloadFile(fid) {
return downloadFile(fid);
},
handlePreview(src) {
// 图片预览处理
console.log('预览图片:', src);
},
handleDownload() {
// 下载逻辑
}
}
};
</script>Props
| 属性 | 类型 | 必填 | 说明 | |------|------|------|------| | reportInfo | Object | 是 | 报告数据 | | downloadFile | Function | 是 | 下载文件方法 |
Events
| 事件名 | 参数 | 说明 | |--------|------|------| | preview-image | src | 点击图片时触发 |
数据结构
const reportInfo = {
fcompanyname: '公司名称',
fcreditcode: '统一社会信用代码',
areaname: '地区',
faddress: '详细地址',
festablishtime: '成立时间',
fscalecompany: '公司规模代码',
amountStr: '注册资金',
groupname: '所属行业',
femail: '邮箱',
web: '网址',
fmainbusiness: '经营范围',
fcompanyprofile: '公司介绍',
count: {
productCount: 0,
qualificationCount: 0,
projectCount: 0,
contractCount: 0
},
enterprise: {
produce: '产品介绍',
license: '营业执照附件'
},
qualification: [
{ name: '资质名称', attach_file: '附件ID,文件名' }
],
project: [
{ bkid: '项目ID', name: '项目名称', amt: '金额', settime: '时间' }
],
product: [
{ bkid: '产品ID', name: '产品名称' }
],
contract: [
{ name: '业绩名称', attach_file: '附件ID,文件名' }
],
credit: [
{ name: '信用证书名称', attach_file: '附件ID,文件名' }
]
};注意事项
- 请确保项目中已引入全局样式重置文件(如 reset.css)
- 需要在项目中引入 Element UI
downloadFile方法需要返回 Promise,resolve 时返回图片 URL
开发
# 安装依赖
npm install
# 开发模式
npm run dev
# 构建
npm run build许可证
MIT
