|
@@ -12,7 +12,7 @@
|
|
|
width: '600px',
|
|
|
height: '400px',
|
|
|
// position: 'absolute',
|
|
|
- // left: '-9999px',
|
|
|
+ left: '650px',
|
|
|
// top: '-9999px',
|
|
|
// visibility: 'hidden'
|
|
|
}" />
|
|
@@ -124,6 +124,7 @@
|
|
|
import { JeecgListMixin } from '@/mixins/JeecgListMixin'
|
|
|
import ProdPlanModal from './modules/ProdPlanModal'
|
|
|
import { getAction,downFile,postAction} from '@/api/manage'
|
|
|
+ import { reactive, ref } from 'vue';
|
|
|
|
|
|
export default {
|
|
|
name: 'ProdPlanList',
|
|
@@ -136,6 +137,8 @@
|
|
|
description: '生产计划管理页面',
|
|
|
analysisLoading: false,
|
|
|
emailLoading: false,
|
|
|
+ pieInside: [],
|
|
|
+ pieOutside: [],
|
|
|
// 表头
|
|
|
columns: [
|
|
|
{
|
|
@@ -201,6 +204,7 @@
|
|
|
deleteBatch: "/ProdPlan/prodPlan/deleteBatch",
|
|
|
exportXlsUrl: "/ProdPlan/prodPlan/exportXls",
|
|
|
importExcelUrl: "ProdPlan/prodPlan/importExcel",
|
|
|
+ initPieAndColumnar: "/ProdPlan/delayProduct/getDelayProductByWeek"
|
|
|
|
|
|
},
|
|
|
dictOptions:{},
|
|
@@ -216,7 +220,7 @@
|
|
|
},
|
|
|
},
|
|
|
mounted() {
|
|
|
- this.initPie();
|
|
|
+ this.initPieAndColumnar();
|
|
|
},
|
|
|
methods: {
|
|
|
customRequest(options){
|
|
@@ -303,7 +307,24 @@
|
|
|
}
|
|
|
});
|
|
|
},
|
|
|
- initPie(){
|
|
|
+ initPieAndColumnar(){
|
|
|
+ let data;
|
|
|
+ let color;
|
|
|
+ let columnarInside;
|
|
|
+ let columnarOutside;
|
|
|
+ getAction(this.url.initPieAndColumnar, 'get').then((res) => {
|
|
|
+ if(res.success) {
|
|
|
+ data = res.result;
|
|
|
+ this.pieInside = res.result.pieInside;
|
|
|
+ this.pieOutside = res.result.pieOutside;
|
|
|
+ this.loadingPie();
|
|
|
+ this.loadingShadow();
|
|
|
+ console.log(res);
|
|
|
+ }
|
|
|
+ });
|
|
|
+
|
|
|
+ },
|
|
|
+ loadingPie() {
|
|
|
this.pieChart = this.$echarts.init(this.$refs.pie)
|
|
|
let option = {
|
|
|
color: ['#70bfe5', '#eb6a6c', '#f9c942', '#91c974', '#5a6ac0'],
|
|
@@ -333,10 +354,7 @@
|
|
|
labelLine: {
|
|
|
show: false
|
|
|
},
|
|
|
- data: [
|
|
|
- { value: 280, name: 'R&D',itemStyle: {color:'#fc8251'} },
|
|
|
- { value: 494, name: '制造',itemStyle: {color:'#033E6B'}, selected: true }
|
|
|
- ]
|
|
|
+ data: this.pieInside
|
|
|
},
|
|
|
{
|
|
|
name: 'Access From',
|
|
@@ -377,16 +395,245 @@
|
|
|
}
|
|
|
}
|
|
|
},
|
|
|
- data: [
|
|
|
- { value: 280, name: '开发未完' ,itemStyle: {color:'#fc8251'}},
|
|
|
- { value: 376, name: '日别Capa不足',itemStyle: {color:'#25567B'} },
|
|
|
- { value: 40, name: '合并生产',itemStyle: {color:'#0B61A4'} },
|
|
|
- { value: 78, name: 'LOT不良',itemStyle: {color:'#66A3D2'} },
|
|
|
- ]
|
|
|
+ data: this.pieOutside
|
|
|
}
|
|
|
]
|
|
|
};
|
|
|
this.pieChart.setOption(option)
|
|
|
+ },
|
|
|
+ loadingShadow() {
|
|
|
+ this.barlineChart = this.$echarts.init(this.$refs.barline)
|
|
|
+ let option = {
|
|
|
+ "backgroundColor": "#fff",
|
|
|
+ "color": [
|
|
|
+ "#72A9FE",
|
|
|
+ "#FFC533",
|
|
|
+ "#56C994",
|
|
|
+ "#F6856E",
|
|
|
+ ],
|
|
|
+ "title": {
|
|
|
+ },
|
|
|
+ "legend": {
|
|
|
+ "orient": "horizontal",
|
|
|
+ "data": [
|
|
|
+ {
|
|
|
+ "name": "R&D LOSS数量"
|
|
|
+ },
|
|
|
+ {
|
|
|
+ "name": "制造 LOSS数量"
|
|
|
+ },
|
|
|
+
|
|
|
+ {
|
|
|
+ "name": "LOSS率"
|
|
|
+ },
|
|
|
+
|
|
|
+ ],
|
|
|
+ "left": 0,
|
|
|
+ "top": "4%",
|
|
|
+ "textStyle": {
|
|
|
+ "color": "#666",
|
|
|
+ "fontSize": 14
|
|
|
+ }
|
|
|
+ },
|
|
|
+ "grid": {
|
|
|
+ left: '2%',
|
|
|
+ right: '4%',
|
|
|
+ bottom: '6%',
|
|
|
+ top: '16%',
|
|
|
+ "containLabel": true
|
|
|
+ },
|
|
|
+ "tooltip": {
|
|
|
+ "trigger": "axis",
|
|
|
+ "axisPointer": {
|
|
|
+ "type": "shadow"
|
|
|
+ },
|
|
|
+ "textStyle": {
|
|
|
+ "align": "left"
|
|
|
+ }
|
|
|
+ },
|
|
|
+ "xAxis": [
|
|
|
+ {
|
|
|
+ "type": "category",
|
|
|
+ "data": [
|
|
|
+ 'W10', 'W11', 'W12', 'W13', 'W14', 'W15'
|
|
|
+ ],
|
|
|
+ "axisTick": {
|
|
|
+ "show": false,
|
|
|
+
|
|
|
+ },
|
|
|
+ "axisLine": {
|
|
|
+ "show": true,
|
|
|
+ lineStyle: {
|
|
|
+ color: '#cdd5e2'
|
|
|
+ }
|
|
|
+ },
|
|
|
+ "axisLabel": {
|
|
|
+ "show": true,
|
|
|
+ "textStyle": {
|
|
|
+ "color": "#282828",
|
|
|
+ "fontSize": 14
|
|
|
+ },
|
|
|
+ "formatter": "{value}"
|
|
|
+ },
|
|
|
+
|
|
|
+ }
|
|
|
+ ],
|
|
|
+ "yAxis": [
|
|
|
+ {
|
|
|
+ "type": "value",
|
|
|
+ "max": "600",
|
|
|
+ "axisTick": {
|
|
|
+ "show": false
|
|
|
+ },
|
|
|
+ "axisLine": {
|
|
|
+ "show": true,
|
|
|
+ lineStyle: {
|
|
|
+ color: '#cdd5e2'
|
|
|
+ }
|
|
|
+ },
|
|
|
+ "axisLabel": {
|
|
|
+ "show": true,
|
|
|
+ "textStyle": {
|
|
|
+ "color": "#282828",
|
|
|
+ "fontSize": 14
|
|
|
+ }
|
|
|
+ },
|
|
|
+ "splitLine": {
|
|
|
+ "show": false,
|
|
|
+ "lineStyle": {
|
|
|
+ "color": "rgba(255,255,255,0.2)"
|
|
|
+ }
|
|
|
+ }
|
|
|
+ },
|
|
|
+ {
|
|
|
+ type: "value",
|
|
|
+ name: "百分比",
|
|
|
+ "max": "10",
|
|
|
+ nameTextStyle: {
|
|
|
+ color: "#666666"
|
|
|
+ },
|
|
|
+ position: "right",
|
|
|
+ axisLine: {
|
|
|
+ lineStyle: {
|
|
|
+ color: '#cdd5e2'
|
|
|
+ }
|
|
|
+ },
|
|
|
+ splitLine: {
|
|
|
+ show: false,
|
|
|
+ },
|
|
|
+ axisLabel: {
|
|
|
+ show: true,
|
|
|
+ formatter: "{value} %", //右侧Y轴文字显示
|
|
|
+ textStyle: {
|
|
|
+ color: "#666666",
|
|
|
+ fontSize: 14,
|
|
|
+ }
|
|
|
+ }
|
|
|
+ }
|
|
|
+ ],
|
|
|
+ dataZoom: [
|
|
|
+ {
|
|
|
+ show: true,
|
|
|
+ realtime: true,
|
|
|
+ "height": 12,
|
|
|
+ start: 0,
|
|
|
+ end: 70,
|
|
|
+ bottom: '2%',
|
|
|
+ },
|
|
|
+ {
|
|
|
+ type: 'inside',
|
|
|
+ realtime: true,
|
|
|
+ "height": 12,
|
|
|
+ start: 0,
|
|
|
+ end: 70
|
|
|
+ }
|
|
|
+ ],
|
|
|
+ "series": [
|
|
|
+ // {symbol: 'circle'},
|
|
|
+ {
|
|
|
+ "name": "R&D",
|
|
|
+ "type": "bar",
|
|
|
+ "stack": "总量",
|
|
|
+ "barWidth": "40%",
|
|
|
+ "data": [
|
|
|
+ "42",
|
|
|
+ "44",
|
|
|
+ "40",
|
|
|
+ "78",
|
|
|
+ "101",
|
|
|
+ "376",
|
|
|
+ ],
|
|
|
+ itemStyle: {
|
|
|
+ normal: {
|
|
|
+ label: {
|
|
|
+ show: true, //开启显示
|
|
|
+ //
|
|
|
+ textStyle: { //数值样式
|
|
|
+ color: '#333',
|
|
|
+ fontSize: 14
|
|
|
+ }
|
|
|
+ }
|
|
|
+ }
|
|
|
+ }
|
|
|
+
|
|
|
+ },
|
|
|
+ {
|
|
|
+ "name": "制造",
|
|
|
+ "type": "bar",
|
|
|
+ "stack": "总量",
|
|
|
+ "barWidth": "40%",
|
|
|
+ "data": [
|
|
|
+ "12",
|
|
|
+ "14",
|
|
|
+ "10",
|
|
|
+ "92",
|
|
|
+ "24",
|
|
|
+ "208",
|
|
|
+ ],
|
|
|
+ itemStyle: {
|
|
|
+ normal: {
|
|
|
+ label: {
|
|
|
+ show: true, //开启显示
|
|
|
+ textStyle: { //数值样式
|
|
|
+ color: '#333',
|
|
|
+ fontSize: 14
|
|
|
+ }
|
|
|
+ }
|
|
|
+ }
|
|
|
+ }
|
|
|
+
|
|
|
+ },
|
|
|
+ {
|
|
|
+ name: "LOSS",
|
|
|
+ type: "line",
|
|
|
+ yAxisIndex: 1, //使用的 y 轴的 index,在单个图表实例中存在多个 y轴的时候有用
|
|
|
+ smooth: false, //平滑曲线显示
|
|
|
+ symbol: "circle", //标记的图形为实心圆
|
|
|
+ symbolSize: 8, //标记的大小
|
|
|
+ itemStyle: {
|
|
|
+ normal: {
|
|
|
+ color: '#72A9FE',
|
|
|
+ borderColor: 'rgba(114, 169, 254, 0.5)', //圆点透明 边框
|
|
|
+ borderWidth: 7
|
|
|
+ },
|
|
|
+
|
|
|
+ },
|
|
|
+ lineStyle: {
|
|
|
+ color: "#72A9FE"
|
|
|
+ },
|
|
|
+ data: [
|
|
|
+ "0.35",
|
|
|
+ "0.4",
|
|
|
+ "0.3",
|
|
|
+ "0.3",
|
|
|
+ "0.9",
|
|
|
+ "4.0",
|
|
|
+ ]
|
|
|
+ },
|
|
|
+
|
|
|
+ ]
|
|
|
+ }
|
|
|
+ this.barlineChart.setOption(option);
|
|
|
}
|
|
|
}
|
|
|
}
|