factory_web/src/views/statistics/all.vue

242 lines
9.5 KiB
Vue
Raw Blame History

This file contains invisible Unicode characters

This file contains invisible Unicode characters that are indistinguishable to humans but may be processed differently by a computer. If you think that this is intentional, you can safely ignore this warning. Use the Escape button to reveal them.

<!-- 最新版生产执行页面 -->
<template>
<el-container>
<el-header>
<div class="right-panel">
<el-date-picker v-model="queryDate" type="month" placeholder="查询月份"
value-format="YYYY-MM" style="width:200px">
</el-date-picker>
<el-button type="primary" icon="el-icon-search" @click="handleQuery"></el-button>
<el-button type="primary" @click="downloadPDF">导出</el-button>
</div>
</el-header>
<el-main id="elMain" class="nopadding">
<div id="content">
<!-- 混料统计 -->
<hunliao
class="contentItem"
:firstWeekNum="firstWeekNum"
:endWeekNum="endWeekNum"
:start_date="start_date"
:end_date="end_date"
:queryDate="queryDate"
:queryType="queryType"
:xAxisData="xAxisData"
></hunliao>
<!-- 合格数统计 -->
<pass_num
class="contentItem"
:firstWeekNum="firstWeekNum"
:endWeekNum="endWeekNum"
:start_date="start_date"
:end_date="end_date"
:queryDate="queryDate"
:queryType="queryType"
:xAxisData="xAxisData"
></pass_num>
<!-- 任务进度 -->
<task_rate
class="contentItem"
:start_date="start_date"
:end_date="end_date"
:queryDate="queryDate"
:queryType="queryType"
></task_rate>
<!-- 工序合格数 -->
<ppass_num
class="contentItem"
:start_date="start_date"
:end_date="end_date"
:queryDate="queryDate"
:queryType="queryType"
></ppass_num>
<product_check
class="contentItem"
:start_date="start_date"
:end_date="end_date"
:queryDate="queryDate"
:queryType="queryType"
></product_check>
<product_check2
class="contentItem"
:start_date="start_date"
:end_date="end_date"
:queryDate="queryDate"
:queryType="queryType"
></product_check2>
<material_statistics
class="contentItem"
:start_date="start_date"
:end_date="end_date"
:queryDate="queryDate"
:queryType="queryType"
></material_statistics>
<user_statistics
class="contentItem"
:start_date="start_date"
:end_date="end_date"
:queryDate="queryDate"
:queryType="queryType"
></user_statistics>
<inm_statistics
class="contentItem"
:start_date="start_date"
:end_date="end_date"
:queryDate="queryDate"
:queryType="queryType"
></inm_statistics>
<stock_statistics
class="contentItem"
:start_date="start_date"
:end_date="end_date"
:queryDate="queryDate"
:queryType="queryType"
></stock_statistics>
</div>
</el-main>
</el-container>
</template>
<script>
import getPdf from "@/utils/htmlToPdf";
import PdfLoader from '@/utils/html2pdf';
import hunliao from "./all_sc_hl.vue";//生产-混料统计
import pass_num from "./all_sc_hg.vue";//生产-合格数统计
import task_rate from "./all_sc_rw.vue";//生产-任务进度
import ppass_num from "./all_sc_gx.vue";//生产-工序合格数
import product_check from "./all_jy_sc.vue";//检验-生产检验统计
import product_check2 from "./all_jy_cjg.vue";//检验-生产检验统计(粗加工)
import material_statistics from "./all_cg.vue";//采购统计
import user_statistics from "./all_jx.vue";//绩效统计
import inm_statistics from "./all_xs.vue";//销售统计
import stock_statistics from "./all_kc.vue";//库存统计
export default {
name: "all",
components: {
hunliao,
pass_num,
task_rate,
ppass_num,
product_check,
product_check2,
material_statistics,
user_statistics,
inm_statistics,
stock_statistics},
data() {
return {
queryType:'月',
queryDate: '',
start_date: '',
end_date: '',
xAxisData:[],
xAxisOrigin:[],
firstWeekNum: 1,
endWeekNum: 4,
currentfirstWeekNum: 1,
currentendWeekNum: 4,
pdfDownLoader:null
};
},
mounted() {
let that = this;
let date = new Date();
let year = date.getFullYear();
let month = date.getMonth() + 1;
let days = new Date(year, month, 0).getDate();
that.currentYear = year;
that.currentMonth = month;
that.firstWeekNum = that.currentfirstWeekNum = that.getWeekOfYear(year,month,1);
that.endWeekNum = that.currentendWeekNum = that.getWeekOfYear(year,month,days);
month = month < 10 ? '0' + month : month;
that.start_date = year + '-' + month + '-01';
that.end_date = year + '-' + month + '-' + days;
that.queryDate = year + '-' + month;
let duration = that.endWeekNum - that.firstWeekNum + 1;
for (let i = 1; i <= duration; i++) {
that.xAxisOrigin.push('第' + i + '周');
}
that.xAxisData = that.xAxisOrigin;
const content = document.getElementById('content')
this.pdfDownLoader = new PdfLoader(content, '光子科技生产管理系统月度报告') // exportTables -->防止被截断的class名
},
methods: {
getWeekOfYear(a,b,c) {
var date1 = new Date(a, parseInt(b) - 1, c), //当前日期  
date2 = new Date(a, 0, 1), //当年第一天  
// d是当前日期是今年第多少天  
d = Math.round((date1.valueOf() - date2.valueOf()) / 86400000);
// d + 当前年的第一天的周差距的和在除以7就是本年第几周  
return Math.ceil((d + (date2.getDay() + 1 - 1)) / 7);
},
downloadPDF() {
this.$PRINT('#content');
this.pdfDownLoader.outPutPdfFn('光子科技生产管理系统月度报告')
},
handleQuery() {
let that = this;
if (that.queryDate !== "" && that.queryDate !== null) {
let arr = that.queryDate.split("-");
let year = arr[0];
let month = arr[1];
let days = new Date(year, month, 0).getDate();
that.start_date = that.queryDate + "-01";
that.end_date =that.queryDate +"-" +days;
that.firstWeekNum = that.getWeekOfYear(year,month,1);
that.endWeekNum = that.getWeekOfYear(year,month,days);
let duration = that.endWeekNum - that.firstWeekNum + 1;
let xAxisData = [];
for (let i = 1; i <= duration; i++) {
xAxisData.push("第" + i + "周");
}
that.xAxisData = xAxisData;
} else {
that.start_date =that.currentYear + "-" + that.currentMonth + "-01";
that.end_date =that.currentYear +"-" +that.currentMonth +"-" +new Date(that.currentYear,that.currentMonth,0).getDate();
that.firstWeekNum = that.getWeekOfYear(that.currentYear,that.currentMonth,1);
that.xAxisData = that.xAxisOrigin;
}
// if (that.queryType == "月") {
// if (that.queryDate !== "" && that.queryDate !== null) {
// let arr = that.queryDate.split("-");
// let year = arr[0];
// let month = arr[1];
// let days = new Date(year, month, 0).getDate();
// that.start_date = that.queryDate + "-01";
// that.end_date =that.queryDate +"-" +days;
// that.firstWeekNum = that.getWeekOfYear(year,month,1);
// that.endWeekNum = that.getWeekOfYear(year,month,days);
// let duration = that.endWeekNum - that.firstWeekNum + 1;
// let xAxisData = [];
// for (let i = 1; i <= duration; i++) {
// xAxisData.push("第" + i + "周");
// }
// that.xAxisData = xAxisData;
// } else {
// that.start_date =that.currentYear + "-" + that.currentMonth + "-01";
// that.end_date =that.currentYear +"-" +that.currentMonth +"-" +new Date(that.currentYear,that.currentMonth,0).getDate();
// that.firstWeekNum = that.getWeekOfYear(that.currentYear,that.currentMonth,1);;
// that.xAxisData = that.xAxisOrigin;
// }
// } else {
// if (that.queryDate !== "" && that.queryDate !== null) {
// that.start_date = that.queryDate + "-01-01";
// that.end_date = that.queryDate + "-12-31";
// } else {
// that.start_date = that.currentYear + "-01-01";
// that.end_date = that.currentYear + "-12-31";
// }
// that.xAxisData = that.monthList;
// }
},
},
};
</script>
<style scoped>
#content{
width: 1190px;
}
.contentItem{
margin-top: 20px;
}
</style>