Browse Source

定制报表开发

master
Rui_Li 4 years ago
parent
commit
de4055ccd0
  1. 7
      src/api/report/customer_report_show.js
  2. 2
      src/api/yieldReport/com_switch_roll.js
  3. 1
      src/router/index.js
  4. 2
      src/views/modules/report/com_run_customer_report.vue
  5. 23
      src/views/modules/report/com_show_customer_report_search_column.vue
  6. 283
      src/views/modules/report/customer_report_show.vue
  7. 16
      src/views/modules/report/user_customer_report.vue
  8. 4
      src/views/modules/yieldReport/com_split_order_switch_roll.vue

7
src/api/report/customer_report_show.js

@ -0,0 +1,7 @@
import { createAPI } from '@/utils/httpRequest.js'
// 获取派工单的最新信息
export const getCustomerReportData = data => createAPI('report/getCustomerReportData', 'POST', data)
// 获取派工单的最新信息
export const runCustomerReport = data => createAPI('report/runCustomerReport', 'POST', data)

2
src/api/yieldReport/com_switch_roll.js

@ -22,3 +22,5 @@ export const switchrollRepackAction = data => createAPI('schedule/switchrollRepa
// 换分切工单切换卷校验
export const checkSplitScheduleSwitchRoll = data => createAPI('schedule/checkSplitScheduleSwitchRoll', 'POST', data)
//分切工单切换卷操作
export const splitScheduleSwitchRoll = data => createAPI('schedule/splitScheduleSwitchRoll', 'POST', data)

1
src/router/index.js

@ -38,6 +38,7 @@ const mainRoutes = {
{ path: '/theme', component: _import('common/theme'), name: 'theme', meta: { title: '主题' } },
{ path: '/demo-echarts', component: _import('demo/echarts'), name: 'demo-echarts', meta: { title: 'demo-echarts', isTab: true } },
// { path: '/demo-ueditor', component: _import('demo/ueditor'), name: 'demo-ueditor', meta: { title: 'demo-ueditor', isTab: true } }
{ path: '/customer_report_show', component: _import('modules/report/customer_report_show'), name: 'report', meta: { title: '自定义报表展示' } },//2022-04-20 自定义报表路径
],
beforeEnter (to, from, next) {
let token =Vue.cookie.get('token')

2
src/views/modules/report/com_run_customer_report.vue

@ -49,7 +49,7 @@
worksheet="导出信息"
class="el-button el-button--primary el-button--medium">
导出
</download-excel>
</download-excel>
</span>
</el-dialog>
</div>

23
src/views/modules/report/com_show_customer_report_search_column.vue

@ -67,6 +67,7 @@ export default {
site: this.$store.state.user.site,
username: this.$store.state.user.name,
reportId: '',
closedFlag: false,
},
searchColumnList: [],
searchColumnlArray: [
@ -158,9 +159,10 @@ export default {
methods: {
/*初始化页面参数*/
init(reportId) {
init(reportId, closedFlag) {
//
this.pageData.reportId = reportId;
this.pageData.closedFlag = closedFlag;
//
this.refreshPageData();
},
@ -202,10 +204,21 @@ export default {
/*保存已经修改好的参数数据*/
runCustomerReportModal(){
this.$nextTick(() => {
this.showRunCustomerReportFlag = true;
this.$refs.runCustomerReport.init(this.pageData.reportId, this.searchColumnList);
});
//
if(this.pageData.closedFlag){
//
this.closeDialog()
//
this.$emit('initSearchColumns', this.searchColumnList);
}else{
//dialog
this.$nextTick(() => {
this.showRunCustomerReportFlag = true;
this.$refs.runCustomerReport.init(this.pageData.reportId, this.searchColumnList);
//dialog
this.closeDialog();
});
}
},
},

283
src/views/modules/report/customer_report_show.vue

@ -0,0 +1,283 @@
<template>
<div class="customer-css" >
<!-- 查询时间和产品 -->
<el-form :inline="true" label-position="top" label-width="100px" style="margin-top: 0px;" >
<el-row>
<el-form-item :label="'报表名称:'">
<el-input v-model="pageData.reportName" readonly="readonly" style="width: 120px"></el-input>
</el-form-item>
<el-form-item :label="'报表分类:'">
<el-input v-model="pageData.reportType" readonly="readonly" style="width: 120px"></el-input>
</el-form-item>
<el-form-item :label="'报表ID:'">
<el-input v-model="pageData.reportId" readonly="readonly" style="width: 120px"></el-input>
</el-form-item>
<el-form-item :label="''" style="margin-left: 50px; margin-top: 20px;">
<el-button class="customer-bun-min" type="primary" @click="showCustomerReportSearchColumnModal" style="margin-left: 10px; margin-bottom: 5px;">查询</el-button>
<download-excel style="width: 50px; padding: 5px; margin-bottom: 10px;"
:fields="fields()"
:data="exportData"
type="xls"
:name="exportName"
:footer="exportFooter"
:defaultValue="exportDefaultValue"
:fetch="createExportData"
worksheet="导出信息"
class="el-button el-button--primary el-button--medium">
导出
</download-excel>
</el-form-item>
</el-row>
</el-form>
<!-- 工单主表信息 -->
<el-main style="margin-top: 5px; padding: 0px; width: 100%;">
<el-table :height="height"
:data="customerReportList"
border
v-loading="dataListLoading"
style="width: 100%; margin-top: 0px;">
<el-table-column
v-for="(item,index) in customerColumnlArray" :key="index"
:sortable="item.columnSortable"
:prop="item.columnProp"
:header-align="item.headerAlign"
:show-overflow-tooltip="item.showOverflowTooltip"
:align="item.align"
:fixed="item.fixed"
:width="item.columnWidth"
:label="item.columnLabel">
<template slot-scope="scope">
<el-input type="number" class="table-number-input" v-if="item.columnAttr === 'number'"
v-model="scope.row[item.columnProp]"></el-input>
<el-input type="text" class="table-text-input" v-if="item.columnAttr === 'text'"
v-model="scope.row[item.columnProp]"></el-input>
<span v-else>{{scope.row[item.columnProp]}}</span>
<span v-if="item.columnImage"><img :src="scope.row[item.columnProp]"
style="width: 100px; height: 80px"/></span>
</template>
</el-table-column>
</el-table>
</el-main>
<!-- 查询列展示 -->
<showCustomerReportSearchColumn ref="showCustomerReportSearchColumn" :close-on-click-modal="false"
:visible.sync="showCustomerReportSearchColumnFlag"
@initSearchColumns = "initSearchColumns">
</showCustomerReportSearchColumn>
</div>
</template>
<script>
/*组件*/
import showCustomerReportSearchColumn from '@/views/modules/report/com_show_customer_report_search_column';/*新增自定义报表的功能*/
import {
getCustomerReportData,
runCustomerReport,
} from '@/api/report/customer_report_show.js'
export default {
data() {
return {
height: 200,
pageData: {
site: this.$store.state.user.site,
username: this.$store.state.user.name,
reportId: '',
reportName: '',
reportType: '',
seqNo: 0,
status: 1,
},
showCustomerReportSearchColumnFlag: false,
customerReportList: [],
customerColumnlArray: [],
currentReportRow: {},
customerReport: [],
searchColumns: [],
// start
exportData: [],
exportName: "定制报表导出",
exportFooter: [],
exportDefaultValue: "这一行这一列没有数据",
// end
reportList: [],
dataListLoading: false,
}
},
/*组件*/
components: {
showCustomerReportSearchColumn,/*显示查询列参数*/
},
mounted() {
this.$nextTick(() => {
this.height = window.innerHeight - 195;
})
},
methods: {
/*刷新报工的类型*/
refreshCustomerReportData(){
//Id
let reportId = this.$route.query.reportId;
let requestData = {'site': this.pageData.site, 'reportId': reportId};
//
getCustomerReportData(requestData).then(({data}) => {
//
if(data.code === 200){
this.customerColumnlArray = data.resultMap.columnRows;
this.customerReport = data.resultMap.customerReport;
//
this.pageData.reportId = this.customerReport.reportId;
this.pageData.reportName = this.customerReport.reportName;
this.pageData.reportType = this.customerReport.reportType;
//modal
this.showCustomerReportSearchColumnModal(this.customerReport);
}else{
this.$message.error(data.msg);
}
})
},
/*刷新页面table*/
refreshCurrentPage(){
this.refreshPageTables();
},
/*展示查询列*/
showCustomerReportSearchColumnModal(){
this.$nextTick(() => {
this.showCustomerReportSearchColumnFlag = true;
let closedFlag = true;
this.$refs.showCustomerReportSearchColumn.init(this.pageData.reportId, closedFlag);
});
},
/*页面参数的条件查询*/
initSearchColumns(searchColumns){
//
this.searchColumns = searchColumns;
//
let requestData = {searchColumnList: JSON.stringify(this.searchColumns), pageData: JSON.stringify(this.pageData)};
runCustomerReport(requestData).then(({data}) => {
//
if(data.code === 200){
this.customerReportList = data.resultMap.resultRows;
this.customerColumnlArray = data.resultMap.columnRows;
}else{
this.$message.error(data.msg);
}
});
},
/*设置工艺的行*/
setCurrentReportRow(row, column, event) {
this.currentReportRow = row;
},
// excel
fields() {
//
this.exportName = this.customerReport.reportName +"-"+ this.dayjs().format('YYYYMMDDHHmmss');
//
let json = "{"
this.customerColumnlArray.forEach((item, index) => {
if (index == this.customerColumnlArray.length - 1) {
json += "\"" + item.columnLabel + "\"" + ":" + "\"" + item.columnProp + "\""
} else {
json += "\"" + item.columnLabel + "\"" + ":" + "\"" + item.columnProp + "\"" + ","
}
})
json += "}"
let s = eval("(" + json + ")")
return s
},
createExportData() {
// ,,
return this.customerReportList;
},
},
created() {
//
this.refreshCustomerReportData();
},
}
</script>
<!--当前页面的标签样式-->
<style scoped lang="scss">
/*针对el-card*/
.customer-card .el-form-item__content{
margin-top: -15px;
}
.customer-card .el-form-item{
height: 22px;
}
.customer-border .el-form-item__content{
margin-top: -30px;
}
/*全局年与日类型 宽度*/
div.el-time-width{
width: 110px !important;
}
/* 全局时间右边框*/
.customer-css input.el-input__inner{
height: 22px !important;
padding-right: 0px !important;
}
/* 控制el-card标签的数据*/
div.customer-el-card {
margin-left: 110px;
margin-top: -15px;
height: 20px;
width: 60px;
}
/* 颜色控制 */
div.customer-el-card-pink {
background: #FF00FF;
}
div.customer-el-card-orange {
background: #FFD700;
}
div.customer-el-card-blue {
background: #0000CD;
}
/*清掉样式*/
.el-radio+.el-radio {
margin-left: 0px;
}
/*当前按钮的通用样式*/
.customer-css .customer-bun-mid{
width: 60px;
text-align: center;
}
.customer-css .customer-bun-min{
width: 50px;
text-align: center;
}
.customer-css .customer-bun-max{
width: 80px;
text-align: center;
}
/*当前按钮的通用样式*/
.customer-css .el-button--medium {
padding: 5px 5px;
}
</style>

16
src/views/modules/report/user_customer_report.vue

@ -1,5 +1,6 @@
<template>
<div class="customer-css" >
<a class="customer-report" href="" ref="customerReport" target="_blank" style="display: none;"></a>
<!-- 查询时间和产品 -->
<el-form :inline="true" label-position="top" label-width="100px" style="margin-top: 0px;" >
<el-row>
@ -39,7 +40,8 @@
width="220"
:label="'操作'">
<template slot-scope="scope">
<a class="customer-a" @click="showCustomerReportSearchColumnModal(scope.row)">查询</a>
<!--<a class="customer-a" @click="showCustomerReportSearchColumnModal(scope.row)">查询</a>-->
<a class="customer-a" @click="openCustomerReportPage(scope.row)">查询</a>
</template>
</el-table-column>
<el-table-column
@ -221,6 +223,18 @@ export default {
});
},
/*打开新的查询页面*/
openCustomerReportPage(currentRow){
//
let customerReport= this.$refs.customerReport;
debugger;
//
customerReport.setAttribute('href', window.location.origin+'/#/customer_report_show'+"?reportId="+currentRow.reportId);
//
customerReport.click();
},
/*设置工艺的行*/
setCurrentReportRow(row, column, event) {
this.currentReportRow = row;

4
src/views/modules/yieldReport/com_split_order_switch_roll.vue

@ -29,7 +29,7 @@ import comExceptionReason from "./com_exception_reason";//异常远远
/*添加js的方法和请求*/
import {
checkSplitScheduleSwitchRoll,/*校验是否可以切换卷*/
switchSfdcRoll,/*执行切换卷的操作*/
splitScheduleSwitchRoll,/*执行切换卷的操作*/
} from '@/api/yieldReport/com_switch_roll.js'
export default {
name: "com_merge_roll",
@ -149,7 +149,7 @@ export default {
/*执行切换卷的操作*/
switchRollOperation() {
//
switchSfdcRoll(this.pageData).then(({data}) => {
splitScheduleSwitchRoll(this.pageData).then(({data}) => {
//
if (data.code === 200) {
//

Loading…
Cancel
Save