制造成本分析部分字段
This commit is contained in:
252
src/views/home/budgetSubmissionDetails.vue
Normal file
252
src/views/home/budgetSubmissionDetails.vue
Normal file
@@ -0,0 +1,252 @@
|
|||||||
|
<template>
|
||||||
|
<div id="dayReport" class="dayReport" :style="styles">
|
||||||
|
<div v-if="device === 'mobile' && sidebar.opened" class="drawer-bg" @click="handleClickOutside" />
|
||||||
|
<sidebar v-if="!sidebar.hide" class="sidebar-container" />
|
||||||
|
<ReportHeader top-title="预算填报" :is-full-screen="isFullScreen" @screenfullChange="screenfullChange"
|
||||||
|
@getTimeType="handleTimeChange" :isBudget="true" />
|
||||||
|
<div class="main-body" style="
|
||||||
|
flex: 1;
|
||||||
|
display: flex;
|
||||||
|
padding: 0px 16px 0 272px;
|
||||||
|
flex-direction: column;
|
||||||
|
">
|
||||||
|
<div class="top" style="margin-top: -20px; display: flex; gap: 16px">
|
||||||
|
<div class="top-three" style="
|
||||||
|
display: grid;
|
||||||
|
gap: 12px;
|
||||||
|
grid-template-columns:186px 1422px;
|
||||||
|
">
|
||||||
|
<indicatorCalendar :timeType="timeType" :calendarObj='calendarObj'/>
|
||||||
|
<indicatorDetails :timeType="timeType" @updateLeft='getData' @updateLevel='getLevel'/>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<!-- <div class="top" style="margin-top: -20px; display: flex; gap: 16px">
|
||||||
|
<div class="top-three" style="
|
||||||
|
display: grid;
|
||||||
|
gap: 12px;
|
||||||
|
grid-template-columns:416px 1192px;
|
||||||
|
">
|
||||||
|
</div>
|
||||||
|
</div> -->
|
||||||
|
<!-- <div class="centerImg" style="
|
||||||
|
position: absolute;
|
||||||
|
top: 0;
|
||||||
|
left: 0;
|
||||||
|
width: 100%;
|
||||||
|
height: 100%;
|
||||||
|
z-index: 1; /* 确保在 backp 之上、内容之下 */
|
||||||
|
"></div> -->
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</template>
|
||||||
|
<script>
|
||||||
|
import ReportHeader from "./components/budgetHeader.vue";
|
||||||
|
import { Sidebar } from "../../layout/components";
|
||||||
|
import screenfull from "screenfull";
|
||||||
|
import indicatorCalendar from "./components/budgetCalendar.vue";
|
||||||
|
import indicatorDetails from "./components/budgetDetails.vue";
|
||||||
|
// import premProdStatus from "./components/premProdStatus.vue";
|
||||||
|
import { mapState } from "vuex";
|
||||||
|
// import operatingLineChart from "../operatingComponents/operatingLineChart";
|
||||||
|
// import operatingLineChartCumulative from "../operatingComponents/operatingLineChartCumulative.vue";
|
||||||
|
import { getSalesRevenueGroupData } from '@/api/cockpit'
|
||||||
|
import moment from "moment";
|
||||||
|
import {getCalendar, getCalendarYear} from '@/api/cockpit';
|
||||||
|
export default {
|
||||||
|
name: "DayReport",
|
||||||
|
components: {
|
||||||
|
ReportHeader,
|
||||||
|
indicatorCalendar,
|
||||||
|
indicatorDetails,
|
||||||
|
// operatingLineChartCumulative,
|
||||||
|
// operatingLineChart,
|
||||||
|
// premProdStatus,
|
||||||
|
Sidebar,
|
||||||
|
},
|
||||||
|
data() {
|
||||||
|
return {
|
||||||
|
weekArr: ["周日", "周一", "周二", "周三", "周四", "周五", "周六"],
|
||||||
|
isFullScreen: false,
|
||||||
|
timer: null,
|
||||||
|
beilv: 1,
|
||||||
|
timeType:'month',
|
||||||
|
value: 100,
|
||||||
|
sort:1,
|
||||||
|
selectDate:{},
|
||||||
|
monthData: {},
|
||||||
|
ytdData: {},
|
||||||
|
calendarObj:{},
|
||||||
|
levelId: null
|
||||||
|
};
|
||||||
|
},
|
||||||
|
created() {
|
||||||
|
this.init();
|
||||||
|
this.windowWidth(document.documentElement.clientWidth);
|
||||||
|
},
|
||||||
|
computed: {
|
||||||
|
...mapState({
|
||||||
|
theme: (state) => state.settings.theme,
|
||||||
|
sideTheme: (state) => state.settings.sideTheme,
|
||||||
|
sidebar: (state) => state.app.sidebar,
|
||||||
|
device: (state) => state.app.device,
|
||||||
|
needTagsView: (state) => state.settings.tagsView,
|
||||||
|
fixedHeader: (state) => state.settings.fixedHeader,
|
||||||
|
}),
|
||||||
|
classObj() {
|
||||||
|
return {
|
||||||
|
hideSidebar: !this.sidebar.opened,
|
||||||
|
openSidebar: this.sidebar.opened,
|
||||||
|
withoutAnimation: this.sidebar.withoutAnimation,
|
||||||
|
mobile: this.device === "mobile",
|
||||||
|
};
|
||||||
|
},
|
||||||
|
variables() {
|
||||||
|
return variables;
|
||||||
|
},
|
||||||
|
// ...mapGetters(['sidebar']),
|
||||||
|
styles() {
|
||||||
|
const v = Math.floor(this.value * this.beilv * 100) / 10000;
|
||||||
|
return {
|
||||||
|
transform: `scale(${v})`,
|
||||||
|
transformOrigin: "left top",
|
||||||
|
// overflow: hidden;
|
||||||
|
};
|
||||||
|
},
|
||||||
|
},
|
||||||
|
watch: {
|
||||||
|
clientWidth(val) {
|
||||||
|
if (!this.timer) {
|
||||||
|
this.clientWidth = val;
|
||||||
|
this.beilv2 = this.clientWidth / 1920;
|
||||||
|
this.timer = true;
|
||||||
|
let _this = this;
|
||||||
|
setTimeout(function () {
|
||||||
|
_this.timer = false;
|
||||||
|
}, 500);
|
||||||
|
}
|
||||||
|
// 这里可以添加修改时的方法
|
||||||
|
this.windowWidth(val);
|
||||||
|
},
|
||||||
|
},
|
||||||
|
beforeDestroy() {
|
||||||
|
clearInterval(this.timer);
|
||||||
|
this.destroy();
|
||||||
|
},
|
||||||
|
mounted() {
|
||||||
|
const _this = this;
|
||||||
|
_this.beilv = document.documentElement.clientWidth / 1920;
|
||||||
|
window.onresize = () => {
|
||||||
|
return (() => {
|
||||||
|
_this.clientWidth = `${document.documentElement.clientWidth}`;
|
||||||
|
this.beilv = _this.clientWidth / 1920;
|
||||||
|
})();
|
||||||
|
};
|
||||||
|
// this.getData()
|
||||||
|
},
|
||||||
|
methods: {
|
||||||
|
getData() {
|
||||||
|
if(this.timeType == 'month'){
|
||||||
|
getCalendar({levelId: this.levelId}).then((res) => {
|
||||||
|
this.calendarObj = res.data
|
||||||
|
})
|
||||||
|
}else{
|
||||||
|
getCalendarYear({levelId: this.levelId}).then((res) => {
|
||||||
|
this.calendarObj = res.data
|
||||||
|
})
|
||||||
|
}
|
||||||
|
},
|
||||||
|
// 层级变动
|
||||||
|
getLevel(id) {
|
||||||
|
this.levelId = id
|
||||||
|
this.getData()
|
||||||
|
},
|
||||||
|
handleTimeChange(obj) {
|
||||||
|
console.log(obj, 'obj');
|
||||||
|
this.timeType = obj
|
||||||
|
this.getData()
|
||||||
|
},
|
||||||
|
handleClickOutside() {
|
||||||
|
this.$store.dispatch("app/closeSideBar", { withoutAnimation: false });
|
||||||
|
},
|
||||||
|
windowWidth(value) {
|
||||||
|
this.clientWidth = value;
|
||||||
|
this.beilv2 = this.clientWidth / 1920;
|
||||||
|
},
|
||||||
|
change() {
|
||||||
|
this.isFullScreen = screenfull.isFullscreen;
|
||||||
|
},
|
||||||
|
init() {
|
||||||
|
if (!screenfull.isEnabled) {
|
||||||
|
this.$message({
|
||||||
|
message: "you browser can not work",
|
||||||
|
type: "warning",
|
||||||
|
});
|
||||||
|
return false;
|
||||||
|
}
|
||||||
|
screenfull.on("change", this.change);
|
||||||
|
},
|
||||||
|
destroy() {
|
||||||
|
if (!screenfull.isEnabled) {
|
||||||
|
this.$message({
|
||||||
|
message: "you browser can not work",
|
||||||
|
type: "warning",
|
||||||
|
});
|
||||||
|
return false;
|
||||||
|
}
|
||||||
|
screenfull.off("change", this.change);
|
||||||
|
},
|
||||||
|
// 全屏
|
||||||
|
screenfullChange() {
|
||||||
|
console.log("screenfull.enabled", screenfull.isEnabled);
|
||||||
|
if (!screenfull.isEnabled) {
|
||||||
|
this.$message({
|
||||||
|
message: "you browser can not work",
|
||||||
|
type: "warning",
|
||||||
|
});
|
||||||
|
return false;
|
||||||
|
}
|
||||||
|
screenfull.toggle(this.$refs.dayReportB);
|
||||||
|
},
|
||||||
|
// 导出
|
||||||
|
// exportPDF() {
|
||||||
|
// this.$message.success('正在导出,请稍等!')
|
||||||
|
// const element = document.getElementById('dayRepDom')
|
||||||
|
// element.style.display = 'block'
|
||||||
|
// const fileName = '株洲碲化镉生产日报' + moment().format('yyMMDD') + '.pdf'
|
||||||
|
// html2canvas(element, {
|
||||||
|
// dpi: 300, // Set to 300 DPI
|
||||||
|
// scale: 3 // Adjusts your resolution
|
||||||
|
// }).then(function(canvas) {
|
||||||
|
// const imgWidth = 595.28
|
||||||
|
// const imgHeight = 841.89
|
||||||
|
// const pageData = canvas.toDataURL('image/jpeg', 1.0)
|
||||||
|
// const PDF = new JsPDF('', 'pt', [imgWidth, imgHeight])
|
||||||
|
// PDF.addImage(pageData, 'JPEG', 0, 0, imgWidth, imgHeight)
|
||||||
|
// setTimeout(() => {
|
||||||
|
// PDF.save(fileName) // 导出文件名
|
||||||
|
// }, 1000)
|
||||||
|
// })
|
||||||
|
// element.style.display = 'none'
|
||||||
|
// }
|
||||||
|
},
|
||||||
|
};
|
||||||
|
</script>
|
||||||
|
<style scoped lang="scss">
|
||||||
|
@import "~@/assets/styles/mixin.scss";
|
||||||
|
@import "~@/assets/styles/variables.scss";
|
||||||
|
.dayReport {
|
||||||
|
width: 1920px;
|
||||||
|
height: 1080px;
|
||||||
|
background: url("../../assets/img/backp.png") no-repeat;
|
||||||
|
background-size: cover;
|
||||||
|
}
|
||||||
|
.hideSidebar .fixed-header {
|
||||||
|
width: calc(100% - 54px);
|
||||||
|
}
|
||||||
|
.sidebarHide .fixed-header {
|
||||||
|
width: calc(100%);
|
||||||
|
}
|
||||||
|
.mobile .fixed-header {
|
||||||
|
width: 100%;
|
||||||
|
}
|
||||||
|
</style>
|
||||||
197
src/views/home/indicatorSubmissionDetails.vue
Normal file
197
src/views/home/indicatorSubmissionDetails.vue
Normal file
@@ -0,0 +1,197 @@
|
|||||||
|
<template>
|
||||||
|
<div id="dayReport" class="dayReport" :style="styles">
|
||||||
|
<div v-if="device === 'mobile' && sidebar.opened" class="drawer-bg" @click="handleClickOutside" />
|
||||||
|
<sidebar v-if="!sidebar.hide" class="sidebar-container" />
|
||||||
|
<ReportHeader top-title="指标填报" :is-full-screen="isFullScreen" @screenfullChange="screenfullChange"
|
||||||
|
:isBudget="false" />
|
||||||
|
<div class="main-body" style="
|
||||||
|
flex: 1;
|
||||||
|
display: flex;
|
||||||
|
padding: 0px 16px 0 272px;
|
||||||
|
flex-direction: column;
|
||||||
|
">
|
||||||
|
<div class="top" style="margin-top: -20px; display: flex; gap: 16px">
|
||||||
|
<div class="top-three" style="
|
||||||
|
display: grid;
|
||||||
|
gap: 12px;
|
||||||
|
grid-template-columns:186px 1422px;
|
||||||
|
">
|
||||||
|
<indicatorCalendar :calendarList="calendarList" />
|
||||||
|
<indicatorDetails @updateLeft='getData' @updateLevel='getLevel'/>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</template>
|
||||||
|
<script>
|
||||||
|
import ReportHeader from "./components/budgetHeader.vue";
|
||||||
|
import { Sidebar } from "../../layout/components";
|
||||||
|
import screenfull from "screenfull";
|
||||||
|
import indicatorCalendar from "./components/indicatorCalendar.vue";
|
||||||
|
import indicatorDetails from "./components/indicatorDetails.vue";
|
||||||
|
import { mapState } from "vuex";
|
||||||
|
import { getRealMonthCalendar } from '@/api/cockpit'
|
||||||
|
export default {
|
||||||
|
name: "DayReport",
|
||||||
|
components: {
|
||||||
|
ReportHeader,
|
||||||
|
indicatorCalendar,
|
||||||
|
indicatorDetails,
|
||||||
|
Sidebar,
|
||||||
|
},
|
||||||
|
data() {
|
||||||
|
return {
|
||||||
|
weekArr: ["周日", "周一", "周二", "周三", "周四", "周五", "周六"],
|
||||||
|
isFullScreen: false,
|
||||||
|
timer: null,
|
||||||
|
beilv: 1,
|
||||||
|
value: 100,
|
||||||
|
sort:1,
|
||||||
|
selectDate:{},
|
||||||
|
monthData: {},
|
||||||
|
ytdData: {},
|
||||||
|
calendarList:{},
|
||||||
|
levelId:null
|
||||||
|
};
|
||||||
|
},
|
||||||
|
created() {
|
||||||
|
this.init();
|
||||||
|
this.windowWidth(document.documentElement.clientWidth);
|
||||||
|
},
|
||||||
|
computed: {
|
||||||
|
...mapState({
|
||||||
|
theme: (state) => state.settings.theme,
|
||||||
|
sideTheme: (state) => state.settings.sideTheme,
|
||||||
|
sidebar: (state) => state.app.sidebar,
|
||||||
|
device: (state) => state.app.device,
|
||||||
|
needTagsView: (state) => state.settings.tagsView,
|
||||||
|
fixedHeader: (state) => state.settings.fixedHeader,
|
||||||
|
}),
|
||||||
|
classObj() {
|
||||||
|
return {
|
||||||
|
hideSidebar: !this.sidebar.opened,
|
||||||
|
openSidebar: this.sidebar.opened,
|
||||||
|
withoutAnimation: this.sidebar.withoutAnimation,
|
||||||
|
mobile: this.device === "mobile",
|
||||||
|
};
|
||||||
|
},
|
||||||
|
variables() {
|
||||||
|
return variables;
|
||||||
|
},
|
||||||
|
// ...mapGetters(['sidebar']),
|
||||||
|
styles() {
|
||||||
|
const v = Math.floor(this.value * this.beilv * 100) / 10000;
|
||||||
|
return {
|
||||||
|
transform: `scale(${v})`,
|
||||||
|
transformOrigin: "left top",
|
||||||
|
// overflow: hidden;
|
||||||
|
};
|
||||||
|
},
|
||||||
|
},
|
||||||
|
watch: {
|
||||||
|
clientWidth(val) {
|
||||||
|
if (!this.timer) {
|
||||||
|
this.clientWidth = val;
|
||||||
|
this.beilv2 = this.clientWidth / 1920;
|
||||||
|
this.timer = true;
|
||||||
|
let _this = this;
|
||||||
|
setTimeout(function () {
|
||||||
|
_this.timer = false;
|
||||||
|
}, 500);
|
||||||
|
}
|
||||||
|
// 这里可以添加修改时的方法
|
||||||
|
this.windowWidth(val);
|
||||||
|
},
|
||||||
|
},
|
||||||
|
beforeDestroy() {
|
||||||
|
clearInterval(this.timer);
|
||||||
|
this.destroy();
|
||||||
|
},
|
||||||
|
mounted() {
|
||||||
|
const _this = this;
|
||||||
|
_this.beilv = document.documentElement.clientWidth / 1920;
|
||||||
|
window.onresize = () => {
|
||||||
|
return (() => {
|
||||||
|
_this.clientWidth = `${document.documentElement.clientWidth}`;
|
||||||
|
this.beilv = _this.clientWidth / 1920;
|
||||||
|
})();
|
||||||
|
};
|
||||||
|
},
|
||||||
|
methods: {
|
||||||
|
// 层级变动
|
||||||
|
getLevel(id) {
|
||||||
|
this.levelId = id
|
||||||
|
this.getData()
|
||||||
|
},
|
||||||
|
getData() {
|
||||||
|
getRealMonthCalendar({
|
||||||
|
levelId: this.levelId
|
||||||
|
}).then((res) => {
|
||||||
|
console.log(res, 'res');
|
||||||
|
this.calendarList = res.data
|
||||||
|
})
|
||||||
|
},
|
||||||
|
handleClickOutside() {
|
||||||
|
this.$store.dispatch("app/closeSideBar", { withoutAnimation: false });
|
||||||
|
},
|
||||||
|
windowWidth(value) {
|
||||||
|
this.clientWidth = value;
|
||||||
|
this.beilv2 = this.clientWidth / 1920;
|
||||||
|
},
|
||||||
|
change() {
|
||||||
|
this.isFullScreen = screenfull.isFullscreen;
|
||||||
|
},
|
||||||
|
init() {
|
||||||
|
if (!screenfull.isEnabled) {
|
||||||
|
this.$message({
|
||||||
|
message: "you browser can not work",
|
||||||
|
type: "warning",
|
||||||
|
});
|
||||||
|
return false;
|
||||||
|
}
|
||||||
|
screenfull.on("change", this.change);
|
||||||
|
},
|
||||||
|
destroy() {
|
||||||
|
if (!screenfull.isEnabled) {
|
||||||
|
this.$message({
|
||||||
|
message: "you browser can not work",
|
||||||
|
type: "warning",
|
||||||
|
});
|
||||||
|
return false;
|
||||||
|
}
|
||||||
|
screenfull.off("change", this.change);
|
||||||
|
},
|
||||||
|
// 全屏
|
||||||
|
screenfullChange() {
|
||||||
|
console.log("screenfull.enabled", screenfull.isEnabled);
|
||||||
|
if (!screenfull.isEnabled) {
|
||||||
|
this.$message({
|
||||||
|
message: "you browser can not work",
|
||||||
|
type: "warning",
|
||||||
|
});
|
||||||
|
return false;
|
||||||
|
}
|
||||||
|
screenfull.toggle(this.$refs.dayReportB);
|
||||||
|
}
|
||||||
|
},
|
||||||
|
};
|
||||||
|
</script>
|
||||||
|
<style scoped lang="scss">
|
||||||
|
@import "~@/assets/styles/mixin.scss";
|
||||||
|
@import "~@/assets/styles/variables.scss";
|
||||||
|
.dayReport {
|
||||||
|
width: 1920px;
|
||||||
|
height: 1080px;
|
||||||
|
background: url("../../assets/img/backp.png") no-repeat;
|
||||||
|
background-size: cover;
|
||||||
|
}
|
||||||
|
.hideSidebar .fixed-header {
|
||||||
|
width: calc(100% - 54px);
|
||||||
|
}
|
||||||
|
.sidebarHide .fixed-header {
|
||||||
|
width: calc(100%);
|
||||||
|
}
|
||||||
|
.mobile .fixed-header {
|
||||||
|
width: 100%;
|
||||||
|
}
|
||||||
|
</style>
|
||||||
@@ -179,6 +179,7 @@ export default {
|
|||||||
methods: {
|
methods: {
|
||||||
handleChange(value) {
|
handleChange(value) {
|
||||||
this.index =value
|
this.index =value
|
||||||
|
console.log('+++++++++++++++++++++++++++++++++111111')
|
||||||
this.getData()
|
this.getData()
|
||||||
},
|
},
|
||||||
getData() {
|
getData() {
|
||||||
@@ -202,19 +203,21 @@ export default {
|
|||||||
},
|
},
|
||||||
|
|
||||||
handleTimeChange(obj) {
|
handleTimeChange(obj) {
|
||||||
|
console.log('=====================================222222222222',obj);
|
||||||
this.month = obj.targetMonth
|
this.month = obj.targetMonth
|
||||||
this.dateData = {
|
this.dateData = {
|
||||||
startTime: obj.startTime,
|
startTime: obj.startTime,
|
||||||
endTime: obj.endTime,
|
endTime: obj.endTime,
|
||||||
// mode: obj.mode,
|
// mode: obj.mode,
|
||||||
}
|
}
|
||||||
|
console.log('+++++++++++++++++++++++++++++++++22222')
|
||||||
this.getData()
|
this.getData()
|
||||||
},
|
},
|
||||||
selectChange(data) {
|
selectChange(data) {
|
||||||
console.log('选中的数据:', data);
|
console.log('选中的数据:', data);
|
||||||
this.factory = data
|
this.factory = data
|
||||||
if (this.dateData.startTime && this.dateData.endTime) {
|
if (this.dateData.startTime && this.dateData.endTime) {
|
||||||
|
console.log('+++++++++++++++++++++++++++++++++33333')
|
||||||
this.getData();
|
this.getData();
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
@@ -263,8 +266,6 @@ export default {
|
|||||||
},
|
},
|
||||||
changeDate(val) {
|
changeDate(val) {
|
||||||
this.date = val;
|
this.date = val;
|
||||||
// this.weekDay = this.weekArr[moment(this.date).format('e')]
|
|
||||||
// this.getData()
|
|
||||||
if (this.date === moment().format("yyyy-MM-DD")) {
|
if (this.date === moment().format("yyyy-MM-DD")) {
|
||||||
this.loopTime();
|
this.loopTime();
|
||||||
} else {
|
} else {
|
||||||
|
|||||||
@@ -193,7 +193,7 @@ export default {
|
|||||||
const requestParams = {
|
const requestParams = {
|
||||||
startTime: this.dateData.startTime,
|
startTime: this.dateData.startTime,
|
||||||
endTime: this.dateData.endTime,
|
endTime: this.dateData.endTime,
|
||||||
trendName: '原料' + this.meterialName + this.trendName,
|
trendName: this.trendName,
|
||||||
analysisObject: [this.meterialName],
|
analysisObject: [this.meterialName],
|
||||||
levelId: this.factory,
|
levelId: this.factory,
|
||||||
isOriginal:0,//0:原片 1:加工
|
isOriginal:0,//0:原片 1:加工
|
||||||
|
|||||||
@@ -187,19 +187,19 @@ export default {
|
|||||||
// 调用接口
|
// 调用接口
|
||||||
getSingleMaterialCostAnalysis(requestParams).then((res) => {
|
getSingleMaterialCostAnalysis(requestParams).then((res) => {
|
||||||
this.monData = res.data.currentMonthData.find(item => {
|
this.monData = res.data.currentMonthData.find(item => {
|
||||||
return item.name === this.overheadName+'成本';
|
return item.name === '原片'+this.overheadName+'成本';
|
||||||
});
|
});
|
||||||
|
|
||||||
this.totalData = res.data.totalMonthData.find(item => {
|
this.totalData = res.data.totalMonthData.find(item => {
|
||||||
return item.name === this.overheadName+'成本';
|
return item.name === '原片'+this.overheadName+'成本';
|
||||||
});
|
});
|
||||||
// this.relatedMon = res.data.relatedMon
|
// this.relatedMon = res.data.relatedMon
|
||||||
this.relatedData = {
|
this.relatedData = {
|
||||||
relatedMon: res.data.currentMonthData.filter(item => {
|
relatedMon: res.data.currentMonthData.filter(item => {
|
||||||
return item.name !== this.overheadName+'成本';
|
return item.name !== '原片'+this.overheadName+'成本';
|
||||||
}), // 兜底月度数据
|
}), // 兜底月度数据
|
||||||
relatedTotal: res.data.totalMonthData.filter(item => {
|
relatedTotal: res.data.totalMonthData.filter(item => {
|
||||||
return item.name !== this.overheadName+'成本';
|
return item.name !== '原片'+this.overheadName+'成本';
|
||||||
}) // 兜底累计数据
|
}) // 兜底累计数据
|
||||||
}
|
}
|
||||||
this.trend = res.data.dataTrend
|
this.trend = res.data.dataTrend
|
||||||
|
|||||||
@@ -37,8 +37,8 @@
|
|||||||
grid-template-columns: 804px 804px;
|
grid-template-columns: 804px 804px;
|
||||||
">
|
">
|
||||||
<monthlyRelatedMetrics :dateData="dateData" :factory="factory" :relatedData="monthRelatedData"
|
<monthlyRelatedMetrics :dateData="dateData" :factory="factory" :relatedData="monthRelatedData"
|
||||||
:title="'月度概览'" />
|
:title="'月度·相关指标分析'" />
|
||||||
<yearRelatedMetrics :dateData="dateData" :factory="factory" :relatedData="totalRelatedData" :title="'累计概览'" />
|
<yearRelatedMetrics :dateData="dateData" :factory="factory" :relatedData="totalRelatedData" :title="'累计·相关指标分析'" />
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
<div class="bottom" style="display: flex; gap: 16px;margin-top: 6px;">
|
<div class="bottom" style="display: flex; gap: 16px;margin-top: 6px;">
|
||||||
|
|||||||
@@ -231,17 +231,33 @@ export default {
|
|||||||
// 调用接口
|
// 调用接口
|
||||||
getSingleMaterialAnalysis(requestParams).then((res) => {
|
getSingleMaterialAnalysis(requestParams).then((res) => {
|
||||||
this.monData = res.data.currentMonthData.find(item => {
|
this.monData = res.data.currentMonthData.find(item => {
|
||||||
|
if(this.fuelName === '水') {
|
||||||
|
return item.name === '原片'+this.fuelName + '成本';
|
||||||
|
}else{
|
||||||
return item.name === this.fuelName + '成本';
|
return item.name === this.fuelName + '成本';
|
||||||
|
}
|
||||||
});
|
});
|
||||||
this.totalData = res.data.totalMonthData.find(item => {
|
this.totalData = res.data.totalMonthData.find(item => {
|
||||||
|
if(this.fuelName === '水') {
|
||||||
|
return item.name === '原片'+this.fuelName + '成本';
|
||||||
|
}else{
|
||||||
return item.name === this.fuelName + '成本';
|
return item.name === this.fuelName + '成本';
|
||||||
|
}
|
||||||
});
|
});
|
||||||
this.relatedData = {
|
this.relatedData = {
|
||||||
relatedMon: res.data.currentMonthData.filter(item => {
|
relatedMon: res.data.currentMonthData.filter(item => {
|
||||||
|
if(this.fuelName === '水') {
|
||||||
|
return item.name !== '原片'+this.fuelName + '成本';
|
||||||
|
}else{
|
||||||
return item.name !== this.fuelName + '成本';
|
return item.name !== this.fuelName + '成本';
|
||||||
|
}
|
||||||
}), // 兜底月度数据
|
}), // 兜底月度数据
|
||||||
relatedTotal: res.data.totalMonthData.filter(item => {
|
relatedTotal: res.data.totalMonthData.filter(item => {
|
||||||
|
if(this.fuelName === '水') {
|
||||||
|
return item.name !== '原片'+this.fuelName + '成本';
|
||||||
|
}else{
|
||||||
return item.name !== this.fuelName + '成本';
|
return item.name !== this.fuelName + '成本';
|
||||||
|
}
|
||||||
}) // 兜底累计数据
|
}) // 兜底累计数据
|
||||||
}
|
}
|
||||||
this.trend = res.data.dataTrend
|
this.trend = res.data.dataTrend
|
||||||
|
|||||||
@@ -190,7 +190,7 @@ export default {
|
|||||||
const requestParams = {
|
const requestParams = {
|
||||||
startTime: this.dateData.startTime,
|
startTime: this.dateData.startTime,
|
||||||
endTime: this.dateData.endTime,
|
endTime: this.dateData.endTime,
|
||||||
trendName: this.auxMatName + this.trendName,
|
trendName: this.trendName,
|
||||||
analysisObject: [this.auxMatName],
|
analysisObject: [this.auxMatName],
|
||||||
levelId: this.factory,
|
levelId: this.factory,
|
||||||
isOriginal:1,//0:原片 1:加工
|
isOriginal:1,//0:原片 1:加工
|
||||||
@@ -218,6 +218,7 @@ export default {
|
|||||||
},
|
},
|
||||||
|
|
||||||
handleTimeChange(obj) {
|
handleTimeChange(obj) {
|
||||||
|
console.log('=====================================222222222222',obj);
|
||||||
this.month = obj.targetMonth
|
this.month = obj.targetMonth
|
||||||
this.dateData = {
|
this.dateData = {
|
||||||
startTime: obj.startTime,
|
startTime: obj.startTime,
|
||||||
|
|||||||
@@ -174,11 +174,11 @@ export default {
|
|||||||
// 调用接口
|
// 调用接口
|
||||||
getSingleMaterialCostAnalysis(requestParams).then((res) => {
|
getSingleMaterialCostAnalysis(requestParams).then((res) => {
|
||||||
this.monData = res.data.currentMonthData.find(item => {
|
this.monData = res.data.currentMonthData.find(item => {
|
||||||
return item.name === this.overheadName+'成本';
|
return item.name === '加工'+this.overheadName+'成本';
|
||||||
});
|
});
|
||||||
|
|
||||||
this.totalData = res.data.totalMonthData.find(item => {
|
this.totalData = res.data.totalMonthData.find(item => {
|
||||||
return item.name === this.overheadName+'成本';
|
return item.name === '加工'+this.overheadName+'成本';
|
||||||
});
|
});
|
||||||
this.trend = res.data.dataTrend
|
this.trend = res.data.dataTrend
|
||||||
});
|
});
|
||||||
|
|||||||
@@ -74,7 +74,7 @@ export default {
|
|||||||
computed: {
|
computed: {
|
||||||
// 1. 销量数据:从当前激活数据集中筛选(依赖 activeData,自动响应变化)
|
// 1. 销量数据:从当前激活数据集中筛选(依赖 activeData,自动响应变化)
|
||||||
dianData() {
|
dianData() {
|
||||||
return (this.relatedData.find(item => item.name === "电成本")) || {
|
return (this.relatedData.find(item => item.name === "加工电成本")) || {
|
||||||
targetValue: 0,
|
targetValue: 0,
|
||||||
value: 0,
|
value: 0,
|
||||||
completed: 0,
|
completed: 0,
|
||||||
@@ -84,7 +84,7 @@ export default {
|
|||||||
},
|
},
|
||||||
// 2. 单价数据:从当前激活数据集中筛选
|
// 2. 单价数据:从当前激活数据集中筛选
|
||||||
shuiData() {
|
shuiData() {
|
||||||
return (this.relatedData.find(item => item.name === "水成本")) || {
|
return (this.relatedData.find(item => item.name === "加工水成本")) || {
|
||||||
targetValue: 0,
|
targetValue: 0,
|
||||||
value: 0,
|
value: 0,
|
||||||
proportion: 0,
|
proportion: 0,
|
||||||
|
|||||||
@@ -20,7 +20,7 @@
|
|||||||
</div>
|
</div>
|
||||||
<div class="dashboard">
|
<div class="dashboard">
|
||||||
<div class="title">
|
<div class="title">
|
||||||
产量.{{unitList[1]}}
|
产量·{{unitList[1]}}
|
||||||
</div>
|
</div>
|
||||||
<div style='font-size: 14px;text-align: right;padding-right: 5px;'>
|
<div style='font-size: 14px;text-align: right;padding-right: 5px;'>
|
||||||
<span>完成率:<span style='color: #0B58FF;'>{{productData.proportion}}%</span></span>
|
<span>完成率:<span style='color: #0B58FF;'>{{productData.proportion}}%</span></span>
|
||||||
|
|||||||
@@ -81,7 +81,7 @@ export default {
|
|||||||
const list = (Array.isArray(this.activeData) ? this.activeData : [])
|
const list = (Array.isArray(this.activeData) ? this.activeData : [])
|
||||||
|
|
||||||
return this.indicatorDefs.map(def => {
|
return this.indicatorDefs.map(def => {
|
||||||
const data = list.find(item => item && item.name === def.label) || fallback
|
const data = list.find(item => item && item.name.includes(def.label)) || fallback
|
||||||
return {
|
return {
|
||||||
...def,
|
...def,
|
||||||
data,
|
data,
|
||||||
|
|||||||
@@ -74,7 +74,7 @@ export default {
|
|||||||
computed: {
|
computed: {
|
||||||
// 1. 销量数据:从当前激活数据集中筛选(依赖 activeData,自动响应变化)
|
// 1. 销量数据:从当前激活数据集中筛选(依赖 activeData,自动响应变化)
|
||||||
dianData() {
|
dianData() {
|
||||||
return (this.relatedData.find(item => item.name === "电成本")) || {
|
return (this.relatedData.find(item => item.name === "加工电成本")) || {
|
||||||
targetValue: 0,
|
targetValue: 0,
|
||||||
value: 0,
|
value: 0,
|
||||||
completed: 0,
|
completed: 0,
|
||||||
@@ -84,7 +84,7 @@ export default {
|
|||||||
},
|
},
|
||||||
// 2. 单价数据:从当前激活数据集中筛选
|
// 2. 单价数据:从当前激活数据集中筛选
|
||||||
shuiData() {
|
shuiData() {
|
||||||
return (this.relatedData.find(item => item.name === "水成本")) || {
|
return (this.relatedData.find(item => item.name === "加工水成本")) || {
|
||||||
targetValue: 0,
|
targetValue: 0,
|
||||||
value: 0,
|
value: 0,
|
||||||
proportion: 0,
|
proportion: 0,
|
||||||
|
|||||||
Reference in New Issue
Block a user