销售统计

This commit is contained in:
shijing 2024-01-05 17:54:27 +08:00
parent 6472e9adcb
commit b9e1fe491c
3 changed files with 323 additions and 197 deletions

View File

@ -38,22 +38,23 @@
<el-header>
<div class="right-panel">
<h2>棒管交付数</h2>
<el-select v-model="product" clearable @change="productChange">
<!-- <el-select v-model="product" clearable @change="productChange">
<el-option v-for="item in inmData"
:key="item.id"
:label="item.material_.name"
:value="item.id"
>
</el-option>
</el-select>
</el-select> -->
</div>
</el-header>
<el-row>
<el-col>
<scEcharts height="300px" :option="option1"></scEcharts>
<div id="bachart1" style="width:100%;height:300px;"></div>
<!-- <scEcharts height="300px" :option="option1"></scEcharts> -->
</el-col>
<el-col>
<el-table :data="tableData">
<el-table :data="tableData1">
<el-table-column type="index" width="50" />
<el-table-column label="日期" prop="date">
</el-table-column>
@ -71,22 +72,23 @@
<el-header>
<div class="right-panel">
<h2>棒交付数</h2>
<el-select v-model="product" clearable @change="productChange">
<!-- <el-select v-model="product" clearable @change="productChange">
<el-option v-for="item in outData"
:key="item.id"
:label="item.material_.name"
:value="item.id"
>
</el-option>
</el-select>
</el-select> -->
</div>
</el-header>
<el-row>
<el-col>
<scEcharts height="300px" :option="option2"></scEcharts>
<div id="bachart2" style="width:100%;height:300px;"></div>
<!-- <scEcharts height="300px" :option="option2"></scEcharts> -->
</el-col>
<el-col>
<el-table :data="tableData">
<el-table :data="tableData2">
<el-table-column type="index" width="50" />
<el-table-column label="日期" prop="date">
</el-table-column>
@ -105,8 +107,13 @@
</template>
<script>
import * as echarts from "echarts";
import T from '@/components/scEcharts/echarts-theme-T.js';
echarts.registerTheme('T', T);
import scEcharts from '@/components/scEcharts';
const xAxisData = ['第一周','第二周','第三周','第四周'];
function deepCopy(obj) {
return JSON.parse(JSON.stringify(obj));
}
export default {
name: 'chart',
components: {
@ -120,9 +127,14 @@
end_date:'',
currentYear:'',
currentMonth:'',
xAxisData:['第一周','第二周','第三周','第四周'],
xAxisOrigin:[],
xAxisData:[],
typeOptions:['月','年'],
option1: {
basicOption: {
backgroundColor: 'transparent',
title: {
text: '',
},
grid: {
top: '80px'
},
@ -131,137 +143,209 @@
},
xAxis: {
type: 'category',
data:xAxisData
data: []
},
yAxis: {
type: 'value'
},
lenged:[],
series: [{
data: [120, 200, 150, 80, 70, 110, 130],
type: 'bar',
barWidth: '15px',
},
{
data: [110, 180, 120, 120, 60, 90, 110],
type: 'bar',
barWidth: '15px',
}]
},
option2: {
grid: {
top: '80px'
},
tooltip: {
trigger: 'axis'
},
xAxis: {
type: 'category',
data: xAxisData
},
yAxis: {
type: 'value'
},
series: [{
data: [120, 200, 150, 80, 70, 110, 130],
data: [0, 0, 0, 0, 0, 0, 0],
stack: 'Ad',
type: 'bar',
barWidth: '15px',
}]
},
// option1: {
// grid: {
// top: '80px'
// },
// tooltip: {
// trigger: 'axis'
// },
// xAxis: {
// type: 'category',
// data:xAxisData
// },
// yAxis: {
// type: 'value'
// },
// series: [{
// data: [120, 200, 150, 80, 70, 110, 130],
// type: 'bar',
// barWidth: '15px',
// }]
// },
// option2: {
// grid: {
// top: '80px'
// },
// tooltip: {
// trigger: 'axis'
// },
// xAxis: {
// type: 'category',
// data: xAxisData
// },
// yAxis: {
// type: 'value'
// },
// series: [{
// data: [120, 200, 150, 80, 70, 110, 130],
// type: 'bar',
// barWidth: '15px',
// }]
// },
tableData:[
{id:1,date:'2023-12-11',name:'ZJ2-1',count:200},
{id:1,date:'2023-12-11',name:'ZJ2-2',count:200},
{id:1,date:'2023-12-11',name:'ZJ2-3',count:200},
{id:1,date:'2023-12-11',name:'ZJ2-4',count:200},
],
inmData:[],
outData:[],
tableData1:[],
tableData2:[],
firstWeekNum:1,
endWeekNum:4,
monthList:['一月','二月','三月','四月','五月','六月','七月','八月','九月','十月','十一月','十二月']
}
},
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();
this.currentYear = year;
this.currentMonth = month;
this.start_date =year+'-'+month+'-01';
this.end_date = year+'-'+month+'-'+new Date(year, month, 0).getDate();
this.queryDate = year+'-'+month;
this.getInmData();
this.getOutData();
that.currentYear = year;
that.currentMonth = month;
that.start_date =year+'-'+month+'-01';
that.end_date = year+'-'+month+'-'+new Date(year, month, 0).getDate();
let month1=month;
if(month1<10){month1='0'+month1}
that.queryDate = year+'-'+month1;
that.firstWeekNum = that.getWeekOfYear(new Date(that.start_date));
that.endWeekNum = that.getWeekOfYear(new Date(that.end_date));
let duration = that.endWeekNum - that.firstWeekNum + 1;
for(let i =1;i<=duration;i++ ){
that.xAxisOrigin.push('第'+i+'周');
}
that.xAxisData = that.xAxisOrigin;
this.getTableData();
// this.getTableData2();
},
methods:{
getInmData(){},
getOutData(){},
setChart(name, option = null) {
// name , optionoption
var myChart = echarts.getInstanceByDom(document.getElementById(name));
if (myChart == undefined) {
myChart = echarts.init(document.getElementById(name), 'T');
}
if (option == null) {
option = Object.assign({}, this.basicOption)
}
setTimeout(() => {
try {
myChart.setOption(option);
} catch (error) { }
}, 500)
},
queryTypeChange(value){
console.log(value)
this.queryDate = '';
if(value=='月'){
this.xAxisData = ['第一周','第二周','第三周','第四周'];
},
getWeekOfYear(date) {
var target = new Date(date.getFullYear(), date.getMonth(), date.getDate()); //
var firstDayOfYear = new Date(target.getFullYear(), 0, 1); //
if(target.getTime()==firstDayOfYear.getTime()){
return 1;
}else{
this.xAxisData = ['一月','二月','三月','四月','五月','六月','七月','八月','九月','十月','十一月','十二月']
return Math.ceil((target - firstDayOfYear + 8 * (firstDayOfYear.getTimezoneOffset() / 480)) / 604800000);
}
this.option1.xAxis.data = this.xAxisData;
this.option2.xAxis.data = this.xAxisData;
//
},
getData6(){
getTableData(){
let that = this;
let exec = that.queryType=='月'?'lineWeek':'lineMonth';
let option1 = deepCopy(that.basicOption);
let option2 = deepCopy(that.basicOption);
option1.xAxis.data = that.xAxisData;
option2.xAxis.data = that.xAxisData;
let exec = that.queryType=='月'?'saleOutWeek':'saleOutMonth';
let obj = {
query: { start_date: this.start_date, end_date: this.end_date, dept_name: "6车间" },
query: { start_date: that.start_date, end_date: that.end_date },
};
that.$API.bi.dataset.exec.req(exec, obj).then((doInRes) => {
console.log('6生产车间统计:',doInRes);
debugger;
});
},
getData7(){
let that = this;
let obj = {
query: { start_date: this.start_date, end_date: this.end_date, dept_name: "7车间" },
};
let exec = that.queryType=='月'?'lineWeek':'lineMonth';
that.$API.bi.dataset.exec.req(exec, obj).then((doInRes) => {
console.log('7生产车间统计:',doInRes);
debugger;
});
},
getData10(){
let that = this;
let obj = {
query: { start_date: this.start_date, end_date: this.end_date, dept_name: "10·车间" },
};
let exec = that.queryType=='月'?'lineWeek':'lineMonth';
that.$API.bi.dataset.exec.req(exec, obj).then((doInRes) => {
console.log('10生产车间统计:',doInRes);
debugger;
});
that.$API.bi.dataset.exec.req(exec, obj).then((res) => {
// console.log(':',res);
if(res.length>0){
let data1 = [],data2 = [],seriesData1=[],seriesData2=[];
for(let i=0;i<res.length;i++){
if(res[i].物料名.indexOf('棒')){
data1.push(res[i]);
}else if(res[i].物料名.indexOf('管')){
data2.push(res[i]);
}
}
that.tableData1 = data1;
that.tableData2 = data2;
data1.forEach(item1=>{
let index =0;
if(that.queryType=='月'){
index = item1.-1;
}else{
index = item1.-that.firstWeekNum;
}
seriesData1[index]=item1.交付数;
})
data2.forEach(item2=>{
let index2 =0;
if(that.queryType=='月'){
index2 = item2.-1;
}else{
index2 = item2.-that.firstWeekNum;
}
seriesData2[index2]=item2.交付数;
})
option1.seriesData1 = seriesData1;
option2.seriesData2 = seriesData2;
that.setChart("bachart1", option1);
that.setChart("bachart2", option2);
}else{
that.setChart("bachart1", option1);
that.setChart("bachart2", option2);
}
})
},
handleQuery(){
if(this.queryDate!==''){
if(this.queryType=='月'){
let that = this;
if(this.queryType=='月'){
if(this.queryDate!==''&&this.queryDate!==null){
this.start_date =this.queryDate+'-01';
let arr = this.queryDate.split('-');
this.end_date = this.queryDate+'-'+new Date(arr[0], arr[1], 0).getDate();
this.firstWeekNum = this.getWeekOfYear(new Date(this.start_date));
this.endWeekNum = this.getWeekOfYear(new Date(this.end_date));
let duration = this.endWeekNum - this.firstWeekNum + 1;
let xAxisData = [];
for(let i =1;i<=duration;i++ ){
xAxisData.push('第'+i+'周');
}
that.xAxisData = xAxisData;
}else{
this.start_date = this.queryDate+'-01-01';
this.end_date = this.queryDate+'-12-31';
}
}else{
if(this.queryType=='月'){
this.start_date =this.currentYear+'-'+this.currentMonth+'-01';
this.end_date = this.currentYear+'-'+this.currentMonth+'-'+new Date(this.currentYear, this.currentMonth, 0).getDate();
let date = new Date(this.start_date);
this.firstWeekNum = this.getWeekOfYear(date);
this.xAxisData = this.xAxisOrigin;
}
}else{
if(this.queryDate!==''&&this.queryDate!==null){
this.start_date = this.queryDate+'-01-01';
this.end_date = this.queryDate+'-12-31';
}else{
this.start_date = this.currentYear+'-01-01';
this.end_date = this.currentYear+'-12-31';
}
that.xAxisData = that.monthList;
}
debugger;
console.log(this.query)
this.getData6();
this.getData7();
this.getData10();
this.getTableData();
},
},
}

View File

@ -39,9 +39,9 @@
<div class="right-panel">
<h2>采购统计</h2>
<el-select v-model="product" clearable @change="productChange">
<el-option v-for="item in inmData"
<el-option v-for="item in inmOption"
:key="item.id"
:label="item.material_.name"
:label="item.name"
:value="item.id"
>
</el-option>
@ -50,7 +50,8 @@
</el-header>
<el-row>
<el-col>
<scEcharts height="300px" :option="option2"></scEcharts>
<div id="bachart1" style="width:100%;height:300px;"></div>
<!-- <scEcharts height="300px" :option="option2"></scEcharts> -->
</el-col>
<el-col>
<el-table :data="tableData">
@ -72,9 +73,9 @@
<div class="right-panel">
<h2>消耗统计</h2>
<el-select v-model="product" clearable @change="productChange">
<el-option v-for="item in outData"
<el-option v-for="item in inmOption"
:key="item.id"
:label="item.material_.name"
:label="item.name"
:value="item.id"
>
</el-option>
@ -83,7 +84,8 @@
</el-header>
<el-row>
<el-col>
<scEcharts height="300px" :option="option2"></scEcharts>
<div id="bachart2" style="width:100%;height:300px;"></div>
<!-- <scEcharts height="300px" :option="option2"></scEcharts> -->
</el-col>
<el-col>
<el-table :data="tableData">
@ -105,8 +107,13 @@
</template>
<script>
import * as echarts from "echarts";
import T from '@/components/scEcharts/echarts-theme-T.js';
echarts.registerTheme('T', T);
import scEcharts from '@/components/scEcharts';
const xAxisData = ['第一周','第二周','第三周','第四周'];
function deepCopy(obj) {
return JSON.parse(JSON.stringify(obj));
}
export default {
name: 'chart',
components: {
@ -120,9 +127,14 @@
end_date:'',
currentYear:'',
currentMonth:'',
xAxisData:['第一周','第二周','第三周','第四周'],
xAxisOrigin:[],
xAxisData:[],
typeOptions:['月','年'],
option1: {
basicOption: {
backgroundColor: 'transparent',
title: {
text: '',
},
grid: {
top: '80px'
},
@ -131,43 +143,15 @@
},
xAxis: {
type: 'category',
data:xAxisData
data: []
},
yAxis: {
type: 'value'
},
lenged:[],
series: [{
data: [120, 200, 150, 80, 70, 110, 130],
type: 'bar',
barWidth: '15px',
},
{
data: [110, 180, 120, 120, 60, 90, 110],
type: 'bar',
barWidth: '15px',
}]
},
option2: {
grid: {
top: '80px'
},
tooltip: {
trigger: 'axis'
},
xAxis: {
type: 'category',
data: xAxisData
},
yAxis: {
type: 'value'
},
series: [{
data: [120, 200, 150, 80, 70, 110, 130],
type: 'bar',
barWidth: '15px',
},
{
data: [110, 180, 120, 120, 60, 90, 110],
data: [0, 0, 0, 0, 0, 0, 0],
stack: 'Ad',
type: 'bar',
barWidth: '15px',
}]
@ -178,95 +162,153 @@
{id:1,date:'2023-12-11',name:'ZJ2-3',count:200},
{id:1,date:'2023-12-11',name:'ZJ2-4',count:200},
],
firstWeekNum:1,
endWeekNum:1,
product:'',
inmData:[],
outData:[],
inmOption:[],
outOption:[],
monthList:['一月','二月','三月','四月','五月','六月','七月','八月','九月','十月','十一月','十二月']
}
},
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();
this.currentYear = year;
this.currentMonth = month;
this.start_date =year+'-'+month+'-01';
this.end_date = year+'-'+month+'-'+new Date(year, month, 0).getDate();
this.queryDate = year+'-'+month;
this.getInmData();
this.getOutData();
that.currentYear = year;
that.currentMonth = month;
that.start_date =year+'-'+month+'-01';
that.end_date = year+'-'+month+'-'+new Date(year, month, 0).getDate();
let month1=month;
if(month1<10){month1='0'+month1}
that.queryDate = year+'-'+month1;
that.firstWeekNum = that.getWeekOfYear(new Date(that.firstWeekNum));
that.endWeekNum = that.getWeekOfYear(new Date(that.end_date));
let duration = that.endWeekNum - that.firstWeekNum + 1;
for(let i =1;i<=duration;i++ ){
that.xAxisOrigin.push('第'+i+'周');
}
that.xAxisData = that.xAxisOrigin;
this.getInmOption();
// this.getOutOption();
let option = deepCopy(that.basicOption);
option.xAxis.data = that.xAxisData;
that.setChart("bachart1", option);
let option2 = deepCopy(that.basicOption);
option2.xAxis.data = that.xAxisData;
that.setChart("bachart2", option2);
},
methods:{
getInmData(){},
getOutData(){},
setChart(name, option = null) {
var myChart = echarts.getInstanceByDom(document.getElementById(name));
if (myChart == undefined) {
myChart = echarts.init(document.getElementById(name), 'T');
}
if (option == null) {
option = Object.assign({}, this.basicOption)
}
setTimeout(() => {
try {
myChart.setOption(option);
} catch (error) { }
}, 500)
},
getWeekOfYear(date) {
var target = new Date(date.getFullYear(), date.getMonth(), date.getDate()); //
var firstDayOfYear = new Date(target.getFullYear(), 0, 1); //
if(target.getTime()==firstDayOfYear.getTime()){
return 1;
}else{
return Math.ceil((target - firstDayOfYear + 8 * (firstDayOfYear.getTimezoneOffset() / 480)) / 604800000);
}
},
queryTypeChange(value){
console.log(value)
this.queryDate = '';
if(value=='月'){
this.xAxisData = ['第一周','第二周','第三周','第四周'];
}else{
this.xAxisData = ['一月','二月','三月','四月','五月','六月','七月','八月','九月','十月','十一月','十二月']
}
this.option1.xAxis.data = this.xAxisData;
this.option2.xAxis.data = this.xAxisData;
},
getData6(){
//
getInmOption(){
let that = this;
let exec = that.queryType=='月'?'lineWeek':'lineMonth';
let obj = {
query: { start_date: this.start_date, end_date: this.end_date, dept_name: "6车间" },
};
that.$API.bi.dataset.exec.req(exec, obj).then((doInRes) => {
console.log('6生产车间统计:',doInRes);
debugger;
});
let obj = {};
obj.page=0;
obj.type__in = '30,40,50,60,70';
that.$API.mtm.material.list.req( obj).then((res) => {
that.inmOption = res;
console.log('inmOption',res)
that.product = res[0].id;
that.getInmData();
})
},
getData7(){
//
getInmData(){
let that = this;
let obj = {
query: { start_date: this.start_date, end_date: this.end_date, dept_name: "7车间" },
};
let exec = that.queryType=='月'?'lineWeek':'lineMonth';
that.$API.bi.dataset.exec.req(exec, obj).then((doInRes) => {
console.log('7生产车间统计:',doInRes);
let obj = {};
obj.mio__state = 20;
obj.mio__type = 'pur_in';
obj.material = that.product;
obj.mio__inout_date__gte = this.start_date;
obj.mio__inout_date__lte = this.end_date;
obj.page=0;
that.$API.inm.mioitem.list.req( obj).then((res) => {
debugger;
});
},
getData10(){
let that = this;
let obj = {
query: { start_date: this.start_date, end_date: this.end_date, dept_name: "10·车间" },
};
let exec = that.queryType=='月'?'lineWeek':'lineMonth';
that.$API.bi.dataset.exec.req(exec, obj).then((doInRes) => {
console.log('10生产车间统计:',doInRes);
debugger;
});
},
handleQuery(){
if(this.queryDate!==''){
if(this.queryType=='月'){
console.log('getInmData',res);
res.forEach(item => {
});
})
},
//
getOutOption(){
let that = this;
let obj = {};
obj.page=0;
that.$API.inm.mioitem.list.req( obj).then((res) => {
that.inmOption = res;
console.log('inmOption',res)
that.product = res[0].id;
that.getOutData();
})
},
//
getOutData(){},
handleQuery(){
let that = this;
if(this.queryType=='月'){
if(this.queryDate!==''&&this.queryDate!==null){
this.start_date =this.queryDate+'-01';
let arr = this.queryDate.split('-');
this.end_date = this.queryDate+'-'+new Date(arr[0], arr[1], 0).getDate();
this.firstWeekNum = this.getWeekOfYear(new Date(this.start_date));
this.endWeekNum = this.getWeekOfYear(new Date(this.end_date));
let duration = this.endWeekNum - this.firstWeekNum + 1;
let xAxisData = [];
for(let i =1;i<=duration;i++ ){
xAxisData.push('第'+i+'周');
}
that.xAxisData = xAxisData;
}else{
this.start_date = this.queryDate+'-01-01';
this.end_date = this.queryDate+'-12-31';
}
}else{
if(this.queryType=='月'){
this.start_date =this.currentYear+'-'+this.currentMonth+'-01';
this.end_date = this.currentYear+'-'+this.currentMonth+'-'+new Date(this.currentYear, this.currentMonth, 0).getDate();
let date = new Date(this.start_date);
this.firstWeekNum = this.getWeekOfYear(date);
this.xAxisData = this.xAxisOrigin;
}
}else{
if(this.queryDate!==''&&this.queryDate!==null){
this.start_date = this.queryDate+'-01-01';
this.end_date = this.queryDate+'-12-31';
}else{
this.start_date = this.currentYear+'-01-01';
this.end_date = this.currentYear+'-12-31';
}
that.xAxisData = that.monthList;
}
debugger;
console.log(this.query)
this.getData6();
this.getData7();
this.getData10();
this.getInmData();
this.getOutData();
},
},
}

View File

@ -219,8 +219,8 @@
let month1=month;
if(month1<10){month1='0'+month1}
that.queryDate = year+'-'+month1;
that.firstWeekNum = that.getWeekOfYear(new Date('2024-1-01'));
that.endWeekNum = that.getWeekOfYear(new Date('2024-1-31'));
that.firstWeekNum = that.getWeekOfYear(new Date(that.start_date));
that.endWeekNum = that.getWeekOfYear(new Date(that.end_date));
let duration = that.endWeekNum - that.firstWeekNum + 1;
for(let i =1;i<=duration;i++ ){
that.xAxisOrigin.push('第'+i+'周');