This commit is contained in:
‘937886381’
2026-01-06 13:48:11 +08:00
parent 20ef2b9763
commit 5605eeab06
287 changed files with 1890 additions and 1381 deletions

BIN
dist.zip

Binary file not shown.

View File

@@ -159,8 +159,8 @@ export default {
// this.ytdData = res.data.ytd
})
// getSalesRevenueGroupData({
// startTime: this.selectDate.startTime,
// endTime: this.selectDate.endTime,
// startTime: this.dateData.startTime,
// endTime: this.dateData.endTime,
// sort: this.sort,
// index: undefined,
// factory: undefined

View File

@@ -32,7 +32,7 @@
<div class="label">
<span class="label-text">月份选择</span>
</div>
<el-date-picker v-model="date" type="month" placeholder="请选择月份" class="custom-date-picker"
<el-date-picker :clearable="false" v-model="date" type="month" placeholder="请选择月份" class="custom-date-picker"
style="width: 132px;height: 29px;" @change="emitTimeRange" />
</div>
</div>
@@ -45,7 +45,11 @@ export default {
name: 'Header',
props: {
isFullScreen: { type: Boolean, default: false },
topTitle: { type: String, default: '' }
topTitle: { type: String, default: '' },
dateData: {
type: Object,
default: {} // 默认值设为350px
},
},
data() {
return {
@@ -162,6 +166,19 @@ export default {
this.date = undefined;
// this.emitTimeRange();
}
},
dateData: {
immediate: true, // 初始化时立即执行
handler(newVal) {
if (newVal && (newVal.startTime || newVal.endTime)) {
// 优先使用 startTime 转换为月份格式
const timeStamp = newVal.startTime || newVal.endTime;
if (timeStamp !== 0) {
const monthStr = moment(timeStamp).format('YYYY-MM');
this.date = monthStr; // 赋值给选择器
}
}
}
}
},
mounted() {

View File

@@ -137,7 +137,7 @@ export default {
nameTextStyle: { color: 'rgba(255,255,255,0.7)', fontSize: 14, align: 'left' },
min: () => 0,
max: (value) => Math.ceil(value.max),
scale: true,
axisTick: { show: false },
axisLabel: { color: 'rgba(255,255,255,0.7)', fontSize: 12 },
splitLine: { lineStyle: { color: 'RGBA(24, 88, 100, 0.6)', type: 'dashed' } },

View File

@@ -42,7 +42,7 @@
export default {
name: "Container",
components: {},
props: ["purchase"],
props: ["purchase",'dateData'],
data() {
return {
itemList: []
@@ -62,7 +62,10 @@ export default {
methods: {
handleRoute(path) {
this.$router.push({
path:path
path: path,
query: {
dateData: this.dateData
}
})
},
transformData(rawData) {
@@ -114,7 +117,9 @@ export default {
background: #f9fcff;
padding: 12px 12px 0 12px;
box-sizing: border-box;
&:hover {
box-shadow: 0px 4px 12px 2px #B5CDE5;
}
.unit {
height: 18px;
font-family: PingFangSC, PingFang SC;

View File

@@ -3,7 +3,7 @@
<Container name="采购重点指标" nameTwo="存货重点指标" icon="cockpitItemIcon" size="bottomBasic">
<!-- 1. 移除 .kpi-content 的固定高度改为自适应 -->
<div class="bottom-left-content" style="display: flex;gap: 9px;padding: 14px 16px;">
<coreBottomLeftItem :purchase="purchase">
<coreBottomLeftItem :dateData="dateData" :purchase="purchase">
</coreBottomLeftItem>
<div class="content-right" style="background: #F9FCFF;padding: 15px 12px;">
<base-table style="height: 180px;width: 260px;" :page="1" :limit="10" :show-index="true" :beilv="1"
@@ -29,6 +29,10 @@ export default {
type: Object,
default: () => {} // 默认空数组,避免报错
},
dateData: { // 接收父组件传递的设备数据数组
type: Object,
default: () => { } // 默认空数组,避免报错
},
inventory: { // 恢复生产概览数据(原代码注释了,需根据实际需求保留)
type: Object,
default: () => ({})

View File

@@ -78,7 +78,7 @@ export default {
label: { backgroundColor: '#6a7985' }
}
},
grid: { top: 10, bottom: 20, right: 25, left: 70 },
grid: { top: 35, bottom: 20, right: 25, left: 70 },
xAxis: [
{
type: 'category',
@@ -119,10 +119,12 @@ export default {
],
yAxis: {
// type: 'value',
nameTextStyle: { color: 'rgba(0, 0, 0, 0.45)', fontSize: 14, align: 'left' },
name: '元/㎡',
// nameLocation:'center',
nameTextStyle: { color: 'rgba(0, 0, 0, 0.45)', fontSize: 14, align: 'right' },
// min: () => 0,
// max: (value) => Math.ceil(value.max),
scale: true,
axisTick: { show: false },
axisLabel: { color: 'rgba(0, 0, 0, 0.45)', fontSize: 12 },
splitLine: { lineStyle: { color: 'rgba(0, 0, 0, 0.15)' } },

View File

@@ -41,7 +41,11 @@ export default {
cost: { // 接收父组件传递的 cost 数据对象
type: Object,
default: () => ({})
}
},
dateData: { // 接收父组件传递的 cost 数据对象
type: Object,
default: () => ({})
},
},
data() {
return {
@@ -65,7 +69,8 @@ export default {
this.$router.push({
path: path,
query: {
factory: this.$route.query.factory ? this.$route.query.factory : 5
factory: this.$route.query.factory ? this.$route.query.factory : 5,
dateData: this.dateData
}
})
},
@@ -134,7 +139,10 @@ export default {
background: #f9fcff;
padding: 12px 0px 17px 12px;
box-sizing: border-box;
&:hover {
box-shadow: 0px 4px 12px 2px #B5CDE5;
transform: translateY(-2px);
}
.unit {
height: 18px;
font-family: PingFangSC, PingFang SC;

View File

@@ -14,7 +14,7 @@
</template>
<template v-else-if="activeTab === 'inventory'">
<!-- 存货重点指标对应的内容 -->
<costItem :cost="cost"></costItem>
<costItem :dateData="dateData" :cost="cost"></costItem>
<div class="bottom"
style="display: flex; width: 100%;margin-top: 8px;background-color: rgba(249, 252, 255, 1);">
<CostsBottomBar :line="cost.line" :dateData="dateData">
@@ -144,7 +144,7 @@ export default {
nameTextStyle: { color: 'rgba(255,255,255,0.7)', fontSize: 14, align: 'left' },
min: 0,
max: (value) => Math.ceil(value.max),
scale: true,
axisTick: { show: false },
axisLabel: { color: 'rgba(255,255,255,0.7)', fontSize: 12 },
splitLine: { lineStyle: { color: 'RGBA(24, 88, 100, 0.6)', type: 'dashed' } },

View File

@@ -42,7 +42,7 @@ export default {
tableData: [],
tableProps: [
{ prop: 'name', label: '攻坚指标', align: 'center' },
{ prop: 'target', label: '攻坚目标', align: 'center' },
{ prop: 'target', label: '攻坚预算', align: 'center' },
{ prop: 'monthlyActual', label: '当月实际', align: 'center' },
{ prop: 'accumulated', label: '累计', align: 'center', subcomponent: finishDiv },
]

View File

@@ -46,7 +46,11 @@ export default {
leftMargin: {
type: [String, Number],
default: '350px' // 默认值设为350px
}
},
dateData: {
type: Object,
default: {} // 默认值设为350px
},
},
data() {
return {
@@ -75,11 +79,26 @@ export default {
this.date = undefined;
// this.emitTimeRange();
}
},
dateData: {
immediate: true, // 初始化时立即执行
handler(newVal) {
console.log('newVal', newVal);
if (newVal && (newVal.startTime || newVal.endTime)) {
// 优先使用 startTime 转换为月份格式
const timeStamp = newVal.startTime || newVal.endTime;
if (timeStamp !== 0) {
const monthStr = moment(timeStamp).format('YYYY-MM');
this.date = monthStr; // 赋值给选择器
}
}
}
}
},
mounted() {
// 初始化默认日期当前月格式yyyy-MM
console.log(this.$router);
// console.log(this.$router);
this.date = moment().format('YYYY-MM');
this.$nextTick(() => this.emitTimeRange());
},

View File

@@ -120,7 +120,7 @@ export default {
},
// min: 0,
// max: (value) => Math.ceil((value.max || 0) * 1.1),
scale: true,
axisTick: { show: false },
axisLabel: {
color: 'rgba(0, 0, 0, 0.45)',

View File

@@ -117,7 +117,7 @@ export default {
fontSize: 12,
align: 'right'
},
scale: true,
splitNumber: 4,
axisTick: { show: false },
axisLabel: {

View File

@@ -115,7 +115,7 @@ export default {
fontSize: 12,
align: 'right'
},
scale: true,
splitNumber: 4,
axisTick: { show: false },
axisLabel: {
@@ -144,7 +144,7 @@ export default {
},
splitLine: { show: false },
axisLine: { lineStyle: { color: 'rgba(0, 0, 0, 0.15)' } },
// scale: true,
//
splitNumber: 4,
}
],

View File

@@ -31,7 +31,9 @@
<div class="yield" style="display: flex;justify-content: space-between;">
<div class="progress-percent">完成率</div>
<!-- 百分比颜色动态绑定 -->
<div class="progress-percent">
<div class="progress-percent" :style="{
color: getColor(itemList[0].currentValue, itemList[0].targetValue)
}">
{{ itemList[0].progress }}%
</div>
</div>

View File

@@ -97,7 +97,7 @@ export default {
}
},
grid: {
top: 20,
top: 35,
bottom: 20,
right: 25,
},
@@ -140,14 +140,12 @@ export default {
],
yAxis: {
type: 'value',
nameTextStyle: {
color: 'rgba(0, 0, 0, 0.45)',
fontSize: 14,
align: 'left'
},
name: '元/㎡',
// nameLocation:'center',
nameTextStyle: { color: 'rgba(0, 0, 0, 0.45)', fontSize: 14, align: 'right' },
min: 0,
// max: function (value) { return Math.ceil(value.max * 1.1); }, // 增加一点余量
scale: true,
axisTick: { show: false },
axisLabel: {
color: 'rgba(0, 0, 0, 0.45)',

View File

@@ -151,7 +151,7 @@ export default {
fontSize: 12,
align: 'right'
},
scale: true,
splitNumber: 4,
axisTick: { show: false },
axisLabel: {

View File

@@ -121,7 +121,7 @@ export default {
path: route,
query: {
// 关键修复4dateData是对象需序列化后传递否则路由query无法正常接收对象
dateData: JSON.stringify(this.dateData)
dateData: this.dateData
}
});
}

View File

@@ -120,7 +120,7 @@ export default {
}
.item {
width: 252px;
width: 253px;
height: 110px;
background: #f9fcff;
padding: 12px;

View File

@@ -181,10 +181,16 @@ export default {
.coreItem> :nth-child(4) {
grid-area: item4;
&:hover {
box-shadow: 0px 4px 12px 2px #B5CDE5;
}
}
.coreItem> :nth-child(5) {
grid-area: item5;
&:hover {
box-shadow: 0px 4px 12px 2px #B5CDE5;
}
}
.item {

View File

@@ -122,7 +122,7 @@ export default {
},
// min: 0,
// max: (value) => value.max > 0 ? Math.ceil(value.max * 1.1) : 100, // 留10%余量
scale: true,
axisTick: { show: false },
axisLabel: {
color: 'rgba(0, 0, 0, 0.45)',

View File

@@ -2,7 +2,7 @@
<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"
<ReportHeader :dateData="dateData" top-title="费用分析" :is-full-screen="isFullScreen" @screenfullChange="screenfullChange"
@timeRangeChange="handleTimeChange" />
<div class="main-body" style="
flex: 1;
@@ -16,7 +16,7 @@
gap: 12px;
grid-template-columns:1624px;
">
<operatingLineChart :monthData="monthData" />
<operatingLineChart :dateData="dateData" :monthData="monthData" />
</div>
</div>
<div class="top" style="display: flex; gap: 16px;margin-top: 6px;">
@@ -25,7 +25,7 @@
gap: 12px;
grid-template-columns: 1624px;
">
<operatingLineChartCumulative :ytdData="ytdData" />
<operatingLineChartCumulative :dateData="dateData" :ytdData="ytdData" />
<!-- <keyWork /> -->
</div>
</div>
@@ -69,7 +69,7 @@ export default {
beilv: 1,
value: 100,
sort: 1,
selectDate: {},
dateData: {},
monthData: {},
ytdData: {},
};
@@ -137,12 +137,13 @@ export default {
this.beilv = _this.clientWidth / 1920;
})();
};
this.dateData = this.$route.query.dateData ? this.$route.query.dateData : undefined
},
methods: {
getData() {
getExpenseAnalysisGroupData({
startTime: this.selectDate.startTime,
endTime: this.selectDate.endTime,
startTime: this.dateData.startTime,
endTime: this.dateData.endTime,
sort: this.sort,
index: undefined,
factory: undefined
@@ -161,7 +162,7 @@ export default {
},
handleTimeChange(obj) {
console.log(obj, 'obj');
this.selectDate = obj
this.dateData= obj
this.getData()
},
handleClickOutside() {

View File

@@ -2,7 +2,7 @@
<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 size="psi" @timeRangeChange="handleTimeChange" top-title="基地费用分析" :is-full-screen="isFullScreen"
<ReportHeader :dateData="dateData" size="psi" @timeRangeChange="handleTimeChange" top-title="基地费用分析" :is-full-screen="isFullScreen"
@screenfullChange="screenfullChange" />
<div class="main-body" style="
margin-top: -20px;
@@ -186,6 +186,7 @@ export default {
})();
};
this.factory = this.$route.query.factory ? Number(this.$route.query.factory) : 5
this.dateData = this.$route.query.dateData ? this.$route.query.dateData : undefined
},
methods: {
handleChange(value) {

View File

@@ -63,9 +63,9 @@ export default {
deep: true,
},
},
mounted() {
this.processTrendData(this.trend);
},
// mounted() {
// this.processTrendData(this.trend);
// },
methods: {
handleChange(value) {
this.$emit("handleChange", value);
@@ -76,9 +76,9 @@ export default {
*/
processTrendData(trendData) {
// 数据兜底确保是数组且长度为12
const validTrend = Array.isArray(trendData) && trendData.length === 12
const validTrend = Array.isArray(trendData)
? trendData
: this.$props.trend.default();
: {}
// 初始化空数组
const months = [];

View File

@@ -2,9 +2,6 @@
<div class="coreBar">
<!-- 新增行容器包裹各基地情况和barTop -->
<div class="header-row">
<div class="base-title">
各基地情况
</div>
<div class="barTop">
<!-- 关键新增右侧容器包裹图例和按钮组实现整体靠右 -->
<div class="right-container">
@@ -263,9 +260,9 @@ export default {
// 新增:头部行容器,实现一行排列
.header-row {
display: flex;
justify-content: space-between; // 左右两端对齐
justify-content: flex-end; // 左右两端对齐
align-items: center; // 垂直居中
width: 100%;
// width: 100%;
margin-bottom: 8px; // 与下方图表区保留间距(可根据需求调整)
}
@@ -287,7 +284,6 @@ export default {
// 保留原有align-items确保内部元素垂直居中
align-items: center;
gap: 16px;
// 1. 右侧容器:包裹图例和按钮组,整体靠右
.right-container {
display: flex;

View File

@@ -6,7 +6,7 @@
<!-- 管理费用模块 -->
<div class="dashboard">
<div class="title">
管理费用·单位/万元
管理费用·万元
</div>
<div class="chart-wrap">
<operatingSingleBar :detailData="manageCostData"></operatingSingleBar>
@@ -15,7 +15,7 @@
<!-- 销售费用模块 -->
<div class="dashboard">
<div class="title">
销售费用·单位/万元
销售费用·万元
</div>
<div class="chart-wrap">
<operatingSingleBar :detailData="saleCostData"></operatingSingleBar>
@@ -24,7 +24,7 @@
<!-- 财务费用模块 -->
<div class="dashboard">
<div class="title">
财务费用·单位/万元
财务费用·万元
</div>
<div class="chart-wrap">
<operatingSingleBar :detailData="financeCostData"></operatingSingleBar>

View File

@@ -39,7 +39,7 @@
</div>
</div>
<div class="lineBottom" style="height: 100%; width: 100%">
<operatingLineBar :chartData="chartD" style="height: 99%; width: 100%" />
<operatingLineBar :dateData="dateData" :chartData="chartD" style="height: 99%; width: 100%" />
</div>
</div>
</template>
@@ -51,7 +51,7 @@ import * as echarts from 'echarts';
export default {
name: "Container",
components: { operatingLineBar },
props: ["chartData"],
props: ["chartData",'dateData'],
emits: ['sort-change'], // 声明事件Vue3 推荐)
data() {
return {

View File

@@ -120,7 +120,7 @@ export default {
},
// min: 0,
// max: (value) => Math.ceil((value.max || 0) * 1.1),
scale: true,
axisTick: { show: false },
axisLabel: {
color: 'rgba(0, 0, 0, 0.45)',

View File

@@ -117,7 +117,7 @@ export default {
fontSize: 12,
align: 'right'
},
scale: true,
splitNumber: 4,
axisTick: { show: false },
axisLabel: {

View File

@@ -28,7 +28,11 @@ export default {
chartData: {
type: Object,
default: () => ({}),
}
},
dateData: {
type: Object,
default: () => ({}),
},
},
mounted() {
this.$nextTick(() => {
@@ -80,7 +84,8 @@ export default {
path: 'expenseAnalysisBase',
query: { // 使用query传递参数推荐也可使用params
// baseName: itemName,
factory: baseIndex
factory: baseIndex,
dateData: this.dateData
}
// 若仍需用base作为参数
// base: itemName,
@@ -116,11 +121,11 @@ export default {
}
}
},
grid: {
grid: {
top: 30,
bottom: 30,
right: 70,
left: 40
left: 60
},
xAxis: [
{
@@ -154,7 +159,7 @@ export default {
fontSize: 12,
align: 'right'
},
scale: true,
splitNumber: 4,
axisTick: { show: false },
axisLabel: {

View File

@@ -117,7 +117,7 @@ export default {
fontSize: 12,
align: 'right'
},
scale: true,
splitNumber: 4,
axisTick: { show: false },
axisLabel: {
@@ -146,7 +146,7 @@ export default {
},
splitLine: { show: false },
axisLine: { lineStyle: { color: 'rgba(0, 0, 0, 0.15)' } },
// scale: true,
//
splitNumber: 4,
}
],

View File

@@ -123,7 +123,7 @@ export default {
type: 'solid' // 实线可选dashed虚线、dotted点线
}
},
scale: true,
splitNumber: 2,
axisTick: { show: false },
axisLabel: {

View File

@@ -30,7 +30,7 @@
background-color: rgba(249, 252, 255, 1);
">
<!-- <top-item /> -->
<operatingBar :chartData="chartData" @sort-change="sortChange" />
<operatingBar :dateData="dateData" :chartData="chartData" @sort-change="sortChange" />
</div>
</div>
</Container>
@@ -56,8 +56,11 @@ export default {
target: 0
},
factory: []
}),
required: true
})
},
dateData: {
type: Object,
default: () => ({})
},
},
data() {

View File

@@ -30,7 +30,7 @@
background-color: rgba(249, 252, 255, 1);
">
<!-- <top-item /> -->
<operatingBar @sort-change="sortChange" :chartData="chartData" />
<operatingBar :dateData="dateData" @sort-change="sortChange" :chartData="chartData" />
</div>
</div>
</Container>
@@ -53,6 +53,10 @@ export default {
type: Object,
default: () => ({}),
},
dateData: {
type: Object,
default: () => ({}),
},
},
data() {
return {

View File

@@ -14,7 +14,7 @@
{{ ytdData?.rate || 0 }}%
</div>
<div class="mom">
{{ ytdData?.yoyRate || 0 }}%
{{ ytdData?.yoyRate || 0 }}%
<img v-if="ytdData?.yoyRate >= 0" class="arrow" src="../../../assets/img/topArrow.png" alt="">
<img v-else class="arrow" src="../../../assets/img/downArrow.png" alt="">
</div>

View File

@@ -99,7 +99,7 @@ export default {
// boundaryGap: [10, 0], // 可根据需要开启,控制轴的留白
axisTick: { show: false },
min: 0,
// scale: true,
//
splitNumber: 4,
axisLine: {
show: true,

View File

@@ -6,7 +6,7 @@
<!-- 管理费用模块 -->
<div class="dashboard">
<div class="title">
管理费用·单位/万元
管理费用·万元
</div>
<div class="chart-wrap">
<operatingSingleBar :detailData="manageCostData"></operatingSingleBar>
@@ -15,7 +15,7 @@
<!-- 销售费用模块 -->
<div class="dashboard">
<div class="title">
销售费用·单位/万元
销售费用·万元
</div>
<div class="chart-wrap">
<operatingSingleBar :detailData="saleCostData"></operatingSingleBar>
@@ -24,7 +24,7 @@
<!-- 财务费用模块 -->
<div class="dashboard">
<div class="title">
财务费用·单位/万元
财务费用·万元
</div>
<div class="chart-wrap">
<operatingSingleBar :detailData="financeCostData"></operatingSingleBar>

View File

@@ -2,8 +2,8 @@
<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"
@timeRangeChange="handleTimeChange" />
<ReportHeader :dateData="dateData" top-title="全成本分析" :is-full-screen="isFullScreen"
@screenfullChange="screenfullChange" @timeRangeChange="handleTimeChange" />
<div class="main-body" style="
flex: 1;
display: flex;
@@ -16,7 +16,7 @@
gap: 12px;
grid-template-columns:1624px;
">
<operatingLineChart :thisMonData="thisMonData" />
<operatingLineChart :dateData="dateData" :thisMonData="thisMonData" />
</div>
</div>
<div class="top" style="display: flex; gap: 16px;margin-top: 6px;">
@@ -25,7 +25,7 @@
gap: 12px;
grid-template-columns: 1624px;
">
<operatingLineChartCumulative :totalData="totalData" />
<operatingLineChartCumulative :dateData="dateData" :totalData="totalData" />
<!-- <keyWork /> -->
</div>
</div>
@@ -68,7 +68,7 @@ export default {
timer: null,
beilv: 1,
value: 100,
selectDate: {},
dateData: {},
thisMonData: {},
totalData: {},
};
@@ -136,14 +136,15 @@ export default {
this.beilv = _this.clientWidth / 1920;
})();
};
this.dateData = this.$route.query.dateData ? this.$route.query.dateData : undefined
},
methods: {
getData(obj) {
getUnitPriceAnalysisGroupData({
startTime: this.selectDate.startTime,
endTime: this.selectDate.endTime,
startTime: this.dateData.startTime,
endTime: this.dateData.endTime,
paramName: '全成本'
// timeDim: this.selectDate.mode
// timeDim: this.dateData.mode
}).then((res) => {
console.log(res);
this.thisMonData = res.data.thisMonData
@@ -158,7 +159,7 @@ export default {
},
handleTimeChange(obj) {
// console.log(obj, 'obj');
this.selectDate = obj
this.dateData= obj
this.getData()
},
handleClickOutside() {

View File

@@ -2,8 +2,8 @@
<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 size="psi" @timeRangeChange="handleTimeChange" top-title="基地全成本分析" :is-full-screen="isFullScreen"
@screenfullChange="screenfullChange" />
<ReportHeader :dateData="dateData" size="psi" @timeRangeChange="handleTimeChange" top-title="基地全成本分析"
:is-full-screen="isFullScreen" @screenfullChange="screenfullChange" />
<div class="main-body" style="
margin-top: -20px;
flex: 1;
@@ -37,7 +37,8 @@
gap: 12px;
grid-template-columns: 1624px;
">
<relatedIndicatorsAnalysis :factory="factory" :relatedData="relatedData" :title="'相关指标分析·单位/万元'" />
<relatedIndicatorsAnalysis :dateData="dateData" :factory="factory" :relatedData="relatedData"
:title="'相关指标分析'" />
</div>
</div>
@@ -173,7 +174,8 @@ export default {
this.beilv = _this.clientWidth / 1920;
})();
};
this.factory = this.$route.query.factory ? Number(this.$route.query.factory) : 5
this.factory = this.$route.query.factory ? Number(this.$route.query.factory) : 5
this.dateData = this.$route.query.dateData ? this.$route.query.dateData : undefined
},
methods: {
handleChange(value) {

View File

@@ -2,9 +2,6 @@
<div class="coreBar">
<!-- 新增行容器包裹各基地情况和barTop -->
<div class="header-row">
<div class="base-title">
各基地情况
</div>
<div class="barTop">
<!-- 关键新增右侧容器包裹图例和按钮组实现整体靠右 -->
<div class="right-container">
@@ -298,10 +295,10 @@ export default {
// 新增:头部行容器,实现一行排列
.header-row {
display: flex;
justify-content: space-between; // 左右两端对齐
justify-content: flex-end; // 左右两端对齐
align-items: center; // 垂直居中
width: 100%;
margin-bottom: 8px; // 与下方图表区保留间距(可根据需求调整)
// width: 100%;
margin-bottom: 8px; // 与下方图表区保留间距(可根据需求调整)整)
}
// 各基地情况标题样式

View File

@@ -108,8 +108,8 @@ export default {
*/
getRateFlag(rate) {
if (isNaN(rate) || rate === null || rate === undefined) return 0;
return rate >= 100 ? 1 : 0;
}
return +(rate >= 100 || rate === 0); // + 号将布尔值转为数字true→1false→0
},
}
}
</script>

View File

@@ -7,7 +7,7 @@
<div class="topItem-container" style="display: flex; gap: 8px;">
<div class="dashboard left">
<div class="title">
销量·单位/万元
销量·万元
</div>
<div class="line">
<operatingSingleBar></operatingSingleBar>
@@ -15,7 +15,7 @@
</div>
<div class="dashboard right">
<div class="title">
单价·单位/万元
单价·万元
</div>
<div class="line">
<operatingSingleBar></operatingSingleBar>

View File

@@ -39,7 +39,7 @@
</div>
</div>
<div class="lineBottom" style="height: 100%; width: 100%">
<operatingLineBar :chartData="chartD" style="height: 99%; width: 100%" />
<operatingLineBar :dateData="dateData" :chartData="chartD" style="height: 99%; width: 100%" />
</div>
</div>
</template>
@@ -51,7 +51,7 @@ import * as echarts from 'echarts';
export default {
name: "Container",
components: { operatingLineBar },
props: ["chartData"],
props: ["chartData", 'dateData'],
emits: ['sort-change'], // 声明事件Vue3 推荐)
data() {
return {

View File

@@ -120,7 +120,7 @@ export default {
},
// min: 0,
// max: (value) => Math.ceil((value.max || 0) * 1.1),
scale: true,
axisTick: { show: false },
axisLabel: {
color: 'rgba(0, 0, 0, 0.45)',

View File

@@ -117,7 +117,7 @@ export default {
fontSize: 12,
align: 'right'
},
scale: true,
splitNumber: 4,
axisTick: { show: false },
axisLabel: {

View File

@@ -28,7 +28,11 @@ export default {
chartData: {
type: Object,
default: () => ({}),
}
},
dateData: {
type: Object,
default: () => ({}),
},
},
mounted() {
this.$nextTick(() => {
@@ -80,7 +84,8 @@ export default {
path: 'fullCostAnalysisBase',
query: { // 使用query传递参数推荐也可使用params
// baseName: itemName,
factory: baseIndex
factory: baseIndex,
dateData: this.dateData
}
// 若仍需用base作为参数
// base: itemName,
@@ -116,11 +121,11 @@ export default {
}
}
},
grid: {
grid: {
top: 30,
bottom: 30,
right: 70,
left: 40
left: 60
},
xAxis: [
{
@@ -154,7 +159,7 @@ export default {
fontSize: 12,
align: 'right'
},
scale: true,
splitNumber: 4,
axisTick: { show: false },
axisLabel: {

View File

@@ -117,7 +117,7 @@ export default {
fontSize: 12,
align: 'right'
},
scale: true,
splitNumber: 4,
axisTick: { show: false },
axisLabel: {
@@ -146,7 +146,7 @@ export default {
},
splitLine: { show: false },
axisLine: { lineStyle: { color: 'rgba(0, 0, 0, 0.15)' } },
// scale: true,
//
splitNumber: 4,
}
],

View File

@@ -83,11 +83,11 @@ export default {
// return html;
// }
},
grid: {
top: 40,
bottom: 40,
right: 70,
left: 60,
grid: {
top: 30,
bottom: 60,
right: 30,
left: 50,
},
xAxis: [
{
@@ -123,7 +123,7 @@ export default {
type: 'solid' // 实线可选dashed虚线、dotted点线
}
},
scale: true,
splitNumber: 2,
axisTick: { show: false },
axisLabel: {

View File

@@ -30,7 +30,7 @@
background-color: rgba(249, 252, 255, 1);
">
<!-- <top-item /> -->
<operatingBar :chartData="chartData" @sort-change="sortChange" />
<operatingBar :dateData="dateData" :chartData="chartData" @sort-change="sortChange" />
</div>
</div>
</Container>
@@ -51,6 +51,10 @@ export default {
default: () => ({}),
required: true, // 标记为必填,避免空数据导致异常
},
dateData: {
type: Object,
default: () => ({})
},
},
data() {
return {

View File

@@ -30,7 +30,7 @@
background-color: rgba(249, 252, 255, 1);
">
<!-- <top-item /> -->
<operatingBar :chartData="chartData" @sort-change="sortChange" />
<operatingBar :dateData="dateData" :chartData="chartData" @sort-change="sortChange" />
</div>
</div>
</Container>
@@ -51,6 +51,10 @@ export default {
default: () => ({}),
required: true, // 标记为必填,避免空数据导致异常
},
dateData: {
type: Object,
default: () => ({}),
},
},
data() {
return {

View File

@@ -9,7 +9,7 @@
<div class="dashboard left"
@click="handleDashboardClick('/productionCostAnalysis/productionCostAnalysisBase')">
<div class="title">
制造成本·单位/万元
制造成本·/
</div>
<div class="line">
<operatingSingleBar :detailData="{
@@ -20,7 +20,7 @@
</div>
<div class="dashboard right" @click="handleDashboardClick('/expenseAnalysis/expenseAnalysisBase')">
<div class="title">
财务费用·单位/万元
财务费用·/
</div>
<div class="line">
<operatingSingleBar :detailData="{
@@ -31,7 +31,7 @@
</div>
<div class="dashboard right" @click="handleDashboardClick('/expenseAnalysis/expenseAnalysisBase')">
<div class="title">
销售费用·单位/万元
销售费用·/
</div>
<div class="line">
<operatingSingleBar :detailData="{
@@ -42,7 +42,7 @@
</div>
<div class="dashboard right" @click="handleDashboardClick('/expenseAnalysis/expenseAnalysisBase')">
<div class="title">
管理费用·单位/万元
管理费用·/
</div>
<div class="line">
<operatingSingleBar :detailData="{
@@ -53,7 +53,7 @@
</div>
<div class="dashboard right">
<div class="title">
运费·单位/万元
运费·/
</div>
<div class="line">
<operatingSingleBar :detailData="{
@@ -85,6 +85,10 @@ export default {
relatedTotal: {} // 兜底累计数据
})
},
dateData: {
type: Object,
default: () => ({})
},
factory: {
type: [Number,String],
default: ''
@@ -136,7 +140,8 @@ export default {
this.$router.push({
path: path,
query: {
factory: this.$route.query.factory ? this.$route.query.factory : this.factory
factory: this.$route.query.factory ? this.$route.query.factory : this.factory,
dateData: this.dateData
}
})
},

View File

@@ -14,7 +14,7 @@
{{ formatRate(factoryData?.completeRate) }}%
</div>
<div class="mom">
{{ formatRate(factoryData?.thb) }}%
{{ formatRate(factoryData?.thb) }}%
<img v-if="factoryData?.thb >= 0" class="arrow" src="../../../assets/img/topArrow.png" alt="">
<img v-else class="arrow" src="../../../assets/img/downArrow.png" alt="">
</div>
@@ -111,8 +111,8 @@ export default {
*/
getRateFlag(rate) {
if (isNaN(rate) || rate === null || rate === undefined) return 0;
return rate >= 100 ? 1 : 0;
}
return +(rate >= 100 || rate === 0); // + 号将布尔值转为数字true→1false→0
},
}
}
</script>

View File

@@ -7,7 +7,7 @@
<div class="topItem-container" style="display: flex; gap: 8px;">
<div class="dashboard left">
<div class="title">
销量·单位/万元
销量·万元
</div>
<div class="line">
<operatingSingleBar></operatingSingleBar>
@@ -15,7 +15,7 @@
</div>
<div class="dashboard right">
<div class="title">
单价·单位/万元
单价·万元
</div>
<div class="line">
<operatingSingleBar></operatingSingleBar>

View File

@@ -2,8 +2,8 @@
<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"
@timeRangeChange="handleTimeChange" />
<ReportHeader :dateData="dateData" top-title="毛利率" :is-full-screen="isFullScreen"
@screenfullChange="screenfullChange" @timeRangeChange="handleTimeChange" />
<div class="main-body" style="
flex: 1;
display: flex;
@@ -16,7 +16,7 @@
gap: 12px;
grid-template-columns:1624px;
">
<operatingLineChart :monthData="monthData" />
<operatingLineChart :dateData="dateData" :monthData="monthData" />
</div>
</div>
<div class="top" style="display: flex; gap: 16px;margin-top: 6px;">
@@ -25,7 +25,7 @@
gap: 12px;
grid-template-columns: 1624px;
">
<operatingLineChartCumulative :ytdData="ytdData" />
<operatingLineChartCumulative :dateData="dateData" :ytdData="ytdData" />
<!-- <keyWork /> -->
</div>
</div>
@@ -68,7 +68,7 @@ export default {
timer: null,
beilv: 1,
sort: 1,
selectDate: {},
dateData: {},
monthData: {},
ytdData: {},
value: 100,
@@ -142,12 +142,13 @@ export default {
this.beilv = _this.clientWidth / 1920;
})();
};
this.dateData = this.$route.query.dateData ? this.$route.query.dateData : undefined
},
methods: {
getData() {
getGrossMarginGroupData({
startTime: this.selectDate.startTime,
endTime: this.selectDate.endTime,
startTime: this.dateData.startTime,
endTime: this.dateData.endTime,
sort: this.sort,
index: undefined,
factory: undefined
@@ -166,7 +167,7 @@ export default {
},
handleTimeChange(obj) {
console.log(obj, 'obj');
this.selectDate = obj
this.dateData= obj
this.getData()
},
handleClickOutside() {

View File

@@ -2,8 +2,8 @@
<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 size="psi" @timeRangeChange="handleTimeChange" top-title="基地毛利率" :is-full-screen="isFullScreen"
@screenfullChange="screenfullChange" />
<ReportHeader :dateData="dateData" size="psi" @timeRangeChange="handleTimeChange" top-title="基地毛利率"
:is-full-screen="isFullScreen" @screenfullChange="screenfullChange" />
<div class="main-body" style="
margin-top: -20px;
flex: 1;
@@ -37,8 +37,9 @@
gap: 12px;
grid-template-columns: 804px 804px;
">
<monthlyRelatedMetrics :factory="factory" :monthAnalysis="monthAnalysis" :title="'月度·相关指标分析'" />
<yearRelatedMetrics :factory="factory" :ytdAnalysis="ytdAnalysis" :title="'累计·相关指标分析'" />
<monthlyRelatedMetrics :dateData="dateData" :factory="factory" :monthAnalysis="monthAnalysis"
:title="'月度·相关指标分析'" />
<yearRelatedMetrics :dateData="dateData" :factory="factory" :ytdAnalysis="ytdAnalysis" :title="'累计·相关指标分析'" />
</div>
</div>
@@ -188,6 +189,7 @@ export default {
})();
};
this.factory = this.$route.query.factory ? Number(this.$route.query.factory) : 5
this.dateData = this.$route.query.dateData ? this.$route.query.dateData : undefined
},
methods: {
handleChange(value) {

View File

@@ -76,9 +76,9 @@ export default {
*/
processTrendData(trendData) {
// 数据兜底确保是数组且长度为12
const validTrend = Array.isArray(trendData) && trendData.length === 12
const validTrend = Array.isArray(trendData)
? trendData
: this.$props.trend.default();
: []
// 初始化空数组
const months = [];

View File

@@ -2,9 +2,6 @@
<div class="coreBar">
<!-- 新增行容器包裹各基地情况和barTop -->
<div class="header-row">
<div class="base-title">
各基地情况
</div>
<div class="barTop">
<!-- 关键新增右侧容器包裹图例和按钮组实现整体靠右 -->
<div class="right-container">
@@ -342,10 +339,10 @@ export default {
// 新增:头部行容器,实现一行排列
.header-row {
display: flex;
justify-content: space-between; // 左右两端对齐
display: flex;
justify-content: flex-end; // 左右两端对齐
align-items: center; // 垂直居中
width: 100%;
// width: 100%;
margin-bottom: 8px; // 与下方图表区保留间距(可根据需求调整)
}

View File

@@ -50,6 +50,7 @@ export default {
type: Object,
default: () => {} // 默认空数组,避免报错
},
title: { // 接收父组件传递的设备数据数组
type: String,
default: () => '' // 默认空数组,避免报错

View File

@@ -6,7 +6,7 @@
<!-- 累计指标1 -->
<div class="dashboard left" @click="handleDashboardClick('/operatingRevenue/operatingRevenueBase')">
<div class="title">
收入·单位/万元
收入·万元
</div>
<div class="chart-wrap">
<operatingSingleBar :detailData="ytdIncomeData"></operatingSingleBar>
@@ -15,7 +15,7 @@
<!-- 累计指标2 -->
<div class="dashboard right" @click="handleDashboardClick('/fullCostAnalysis/fullCostAnalysisBase')">
<div class="title">
全成本·单位/万元
全成本·/
</div>
<div class="chart-wrap">
<operatingSingleBar :detailData="ytdCostData"></operatingSingleBar>
@@ -43,6 +43,10 @@ export default {
{ title: "累计全成本", budget: 0, real: 0, rate: 0, diff: 0 }
]
},
dateData: { // 接收父组件传递的设备数据数组
type: Object,
default: () => { } // 默认空数组,避免报错
},
factory: {
type: [String, Number],
default: ''
@@ -75,7 +79,8 @@ export default {
this.$router.push({
path: path,
query: {
factory: this.$route.query.factory ? this.$route.query.factory : this.factory
factory: this.$route.query.factory ? this.$route.query.factory : this.factory,
dateData:this.dateData
}
})
},

View File

@@ -39,7 +39,7 @@
</div>
</div>
<div class="lineBottom" style="height: 100%; width: 100%">
<operatingLineBar :chartData="chartD" style="height: 99%; width: 100%" />
<operatingLineBar :dateData="dateData" :chartData="chartD" style="height: 99%; width: 100%" />
</div>
</div>
</template>
@@ -51,7 +51,7 @@ import * as echarts from 'echarts';
export default {
name: "Container",
components: { operatingLineBar },
props: ["chartData"],
props: ["chartData",'dateData'],
emits: ['sort-change'], // 声明事件Vue3 推荐)
data() {
return {

View File

@@ -120,7 +120,7 @@ export default {
},
// min: 0,
// max: (value) => Math.ceil((value.max || 0) * 1.1),
scale: true,
axisTick: { show: false },
axisLabel: {
color: 'rgba(0, 0, 0, 0.45)',

View File

@@ -117,7 +117,7 @@ export default {
fontSize: 12,
align: 'right'
},
scale: true,
splitNumber: 4,
axisTick: { show: false },
axisLabel: {

View File

@@ -28,7 +28,11 @@ export default {
chartData: {
type: Object,
default: () => ({}),
}
},
dateData: {
type: Object,
default: () => ({}),
},
},
mounted() {
this.$nextTick(() => {
@@ -80,7 +84,8 @@ export default {
path: 'grossMarginBase',
query: { // 使用query传递参数推荐也可使用params
// baseName: itemName,
factory: baseIndex
factory: baseIndex,
dateData:this.dateData
}
// 若仍需用base作为参数
// base: itemName,
@@ -120,7 +125,7 @@ export default {
top: 30,
bottom: 30,
right: 70,
left: 40
left: 60
},
xAxis: [
{
@@ -154,7 +159,7 @@ export default {
fontSize: 12,
align: 'right'
},
scale: true,
splitNumber: 4,
axisTick: { show: false },
axisLabel: {

View File

@@ -117,7 +117,7 @@ export default {
fontSize: 12,
align: 'right'
},
scale: true,
splitNumber: 4,
axisTick: { show: false },
axisLabel: {
@@ -146,7 +146,7 @@ export default {
},
splitLine: { show: false },
axisLine: { lineStyle: { color: 'rgba(0, 0, 0, 0.15)' } },
// scale: true,
//
splitNumber: 4,
}
],

View File

@@ -83,11 +83,11 @@ export default {
// return html;
// }
},
grid: {
top: 40,
bottom: 40,
right: 70,
left: 60,
grid: {
top: 30,
bottom: 60,
right: 30,
left: 50,
},
xAxis: [
{
@@ -123,7 +123,7 @@ export default {
type: 'solid' // 实线可选dashed虚线、dotted点线
}
},
scale: true,
splitNumber: 2,
axisTick: { show: false },
axisLabel: {

View File

@@ -30,7 +30,7 @@
background-color: rgba(249, 252, 255, 1);
">
<!-- <top-item /> -->
<operatingBar :chartData="chartData" @sort-change="sortChange" />
<operatingBar :dateData="dateData" :chartData="chartData" @sort-change="sortChange" />
</div>
</div>
</Container>
@@ -59,6 +59,10 @@ export default {
}),
required: true
},
dateData: {
type: Object,
default: () => ({}),
},
},
data() {
return {
@@ -85,12 +89,10 @@ export default {
* @param {number} rate 处理后的rate值已*100
* @returns {0|1} flag值
*/
getRateFlag(rate) {
// 处理非数字/空值,默认返回 0
if (isNaN(rate) || rate === null || rate === undefined) return 0;
// 核心逻辑≥100 → 1<100 → 0
return rate >= 100 ? 1 : 0;
},
getRateFlag(rate) {
if (isNaN(rate) || rate === null || rate === undefined) return 0;
return +(rate >= 100 || rate === 0); // + 号将布尔值转为数字true→1false→0
},
/**
* 核心处理函数:在所有数据都准备好后,才组装 chartData

View File

@@ -30,7 +30,7 @@
background-color: rgba(249, 252, 255, 1);
">
<!-- <top-item /> -->
<operatingBar @sort-change="sortChange" :chartData="chartData" />
<operatingBar :dateData="dateData" @sort-change="sortChange" :chartData="chartData" />
</div>
</div>
</Container>
@@ -53,6 +53,10 @@ export default {
type: Object,
default: () => ({}),
},
dateData: {
type: Object,
default: () => ({}),
},
},
data() {
return {
@@ -79,12 +83,11 @@ export default {
* @param {number} rate 处理后的rate值已*100
* @returns {0|1} flag值
*/
getRateFlag(rate) {
// 处理非数字/空值,默认返回 0
if (isNaN(rate) || rate === null || rate === undefined) return 0;
// 核心逻辑≥100 → 1<100 → 0
return rate >= 100 ? 1 : 0;
},
getRateFlag(rate) {
if (isNaN(rate) || rate === null || rate === undefined) return 0;
return +(rate >= 100 || rate === 0); // + 号将布尔值转为数字true→1false→0
},
/**
* 核心处理函数:在所有数据都准备好后,才组装 chartData

View File

@@ -242,90 +242,8 @@ export default {
]
};
// 毛利率场景数据
const grossProfitData = {
series: [
// 1. 完成率(折线图)
{
name: '完成率',
type: 'line',
yAxisIndex: 1,
lineStyle: { color: 'rgba(40, 138, 255, .5)', width: 2 },
itemStyle: {
color: 'rgba(40, 138, 255, 1)',
borderColor: 'rgba(40, 138, 255, 1)',
borderWidth: 2,
radius: 4
},
areaStyle: {
opacity: 0.2,
color: new echarts.graphic.LinearGradient(0, 0, 0, 1, [
{ offset: 0, color: 'rgba(40, 138, 255, .9)' },
{ offset: 1, color: 'rgba(40, 138, 255, 0)' }
])
},
data: [106.7, 96.9, 106.5, 106.1, 93.8, 105.9], // 毛利率完成率(%
symbol: 'circle',
symbolSize: 6
},
// 2. 目标(柱状图)
{
name: '目标',
type: 'bar',
yAxisIndex: 0,
barWidth: 14,
itemStyle: {
color: {
type: 'linear',
x: 0, y: 0, x2: 0, y2: 1,
colorStops: [
{ offset: 0, color: 'rgba(130, 204, 255, 1)' },
{ offset: 1, color: 'rgba(75, 157, 255, 1)' }
]
},
borderRadius: [4, 4, 0, 0],
borderWidth: 0
},
data: [30, 32, 31, 33, 32, 34] // 目标毛利率(万元)
},
// 3. 实际(柱状图)
{
name: '实际',
type: 'bar',
yAxisIndex: 0,
barWidth: 14,
itemStyle: {
color: (params) => {
const safeFlag = [1, 0, 1, 1, 0, 1]; // 达标状态
const currentFlag = safeFlag[params.dataIndex] || 0;
return currentFlag === 1
? {
type: 'linear',
x: 0, y: 0, x2: 0, y2: 1,
colorStops: [
{ offset: 0, color: 'rgba(174, 239, 224, 1)' },
{ offset: 1, color: 'rgba(118, 218, 190, 1)' }
]
}
: {
type: 'linear',
x: 0, y: 0, x2: 0, y2: 1,
colorStops: [
{ offset: 0, color: 'rgba(253, 209, 129, 1)' },
{ offset: 1, color: 'rgba(249, 164, 74, 1)' }
]
};
},
borderRadius: [4, 4, 0, 0],
borderWidth: 0
},
data: [32, 31, 33, 35, 30, 36] // 实际毛利率(万元)
}
]
};
// 根据按钮状态返回对应数据
return this.activeButton === 0 ? salesData : grossProfitData;
return salesData
}
},
methods: {},

View File

@@ -14,7 +14,7 @@
{{ ytdData?.rate || 0 }}%
</div>
<div class="mom">
{{ ytdData?.yoyRate || 0 }}%
{{ ytdData?.yoyRate || 0 }}%
<img v-if="ytdData?.yoyRate >= 0" class="arrow" src="../../../assets/img/topArrow.png" alt="">
<img v-else class="arrow" src="../../../assets/img/downArrow.png" alt="">
</div>

View File

@@ -99,7 +99,7 @@ export default {
// boundaryGap: [10, 0], // 可根据需要开启,控制轴的留白
axisTick: { show: false },
min: 0,
// scale: true,
//
splitNumber: 4,
axisLine: {
show: true,

View File

@@ -6,7 +6,7 @@
<!-- 收入模块传递整合了flag的incomeData -->
<div class="dashboard left" @click="handleDashboardClick('/operatingRevenue/operatingRevenueBase')">
<div class="title">
收入·单位/万元
收入·万元
</div>
<div class="chart-wrap">
<operatingSingleBar :detailData="incomeData"></operatingSingleBar>
@@ -15,7 +15,7 @@
<!-- 全成本模块传递整合了flag的totalCostData -->
<div class="dashboard right" @click="handleDashboardClick('/fullCostAnalysis/fullCostAnalysisBase')">
<div class="title">
全成本·单位/万元
全成本·万元
</div>
<div class="chart-wrap">
<operatingSingleBar :detailData="totalCostData"></operatingSingleBar>
@@ -44,6 +44,10 @@ export default {
{ title: "全成本", budget: 0, real: 0, rate: 0, diff: 0 }
]
},
dateData: { // 接收父组件传递的设备数据数组
type: Object,
default: () => { } // 默认空数组,避免报错
},
title: {
type: String,
default: ''
@@ -80,7 +84,8 @@ export default {
this.$router.push({
path: path,
query: {
factory: this.$route.query.factory ? this.$route.query.factory : this.factory
factory: this.$route.query.factory ? this.$route.query.factory : this.factory,
dateData: this.dateData
}
})
},

View File

@@ -11,7 +11,7 @@
grid-template-columns: 560px 745px 560px ;
">
<coreSalesKPIs :sale="sale" :dateData="dateData" />
<financeCosts :finance="finance" :dateData="dateData" :cost="cost" />
<financeCosts :finance="finance" :dateData="dateData" :cost="cost" />
<keyProductionIndicators :productData="productData" :dateData="dateData" />
</div>
</div>
@@ -22,7 +22,7 @@
grid-template-columns:745px 560px 560px ;
">
<orderProgress @getData="getOrderData" :baseOrder="orderTableData" :orderOutput="orderOutput" />
<coreBottomLeft :purchase="purchase" :inventory="inventory" />
<coreBottomLeft :dateData="dateData" :purchase="purchase" :inventory="inventory" />
<keyWork :importantWork="importantWork" />
</div>
</div>

View File

@@ -156,8 +156,8 @@ export default {
this.calendarList = res.data
})
// getSalesRevenueGroupData({
// startTime: this.selectDate.startTime,
// endTime: this.selectDate.endTime,
// startTime: this.dateData.startTime,
// endTime: this.dateData.endTime,
// sort: this.sort,
// index: undefined,
// factory: undefined
@@ -170,7 +170,7 @@ export default {
},
handleTimeChange(obj) {
console.log(obj, 'obj');
this.selectDate = obj
this.dateData= obj
this.getData()
},
handleClickOutside() {

View File

@@ -2,8 +2,8 @@
<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"
@timeRangeChange="handleTimeChange" />
<ReportHeader :dateData="dateData" top-title="投入产出率" :is-full-screen="isFullScreen"
@screenfullChange="screenfullChange" @timeRangeChange="handleTimeChange" />
<div class="main-body" style="
flex: 1;
display: flex;
@@ -16,7 +16,7 @@
gap: 12px;
grid-template-columns:1624px;
">
<operatingLineChart :monthData="monthData" />
<operatingLineChart :dateData="dateData" :monthData="monthData" />
</div>
</div>
<div class="top" style="display: flex; gap: 16px;margin-top: 6px;">
@@ -25,7 +25,7 @@
gap: 12px;
grid-template-columns: 1624px;
">
<operatingLineChartCumulative :salesTrendMap="salesTrendMap" :ytdData="ytdData" />
<operatingLineChartCumulative :dateData="dateData" :salesTrendMap="salesTrendMap" :ytdData="ytdData" />
<!-- <keyWork /> -->
</div>
</div>
@@ -69,7 +69,7 @@ export default {
beilv: 1,
value: 100,
sort: 1,
selectDate: {},
dateData: {},
monthData: {},
ytdData: {},
};
@@ -137,12 +137,13 @@ export default {
this.beilv = _this.clientWidth / 1920;
})();
};
this.dateData = this.$route.query.dateData ? this.$route.query.dateData : undefined
},
methods: {
getData() {
getInputOutputRateGroupData({
startTime: this.selectDate.startTime,
endTime: this.selectDate.endTime,
startTime: this.dateData.startTime,
endTime: this.dateData.endTime,
sort: this.sort,
index: undefined,
factory: undefined
@@ -161,7 +162,7 @@ export default {
},
handleTimeChange(obj) {
console.log(obj, 'obj');
this.selectDate = obj
this.dateData= obj
this.getData()
},
handleClickOutside() {

View File

@@ -2,8 +2,8 @@
<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 size="psi" @timeRangeChange="handleTimeChange" top-title="基地投入产出率" :is-full-screen="isFullScreen"
@screenfullChange="screenfullChange" />
<ReportHeader :dateData="dateData" size="psi" @timeRangeChange="handleTimeChange" top-title="基地投入产出率"
:is-full-screen="isFullScreen" @screenfullChange="screenfullChange" />
<div class="main-body" style="
margin-top: -20px;
flex: 1;
@@ -185,6 +185,7 @@ export default {
})();
};
this.factory = this.$route.query.factory ? Number(this.$route.query.factory) : 5
this.dateData = this.$route.query.dateData ? this.$route.query.dateData : undefined
},
methods: {
handleChange(value) {

View File

@@ -76,9 +76,9 @@ export default {
*/
processTrendData(trendData) {
// 数据兜底确保是数组且长度为12
const validTrend = Array.isArray(trendData) && trendData.length === 12
const validTrend = Array.isArray(trendData)
? trendData
: this.$props.trend.default();
: []
// 初始化空数组
const months = [];
@@ -129,10 +129,8 @@ export default {
*/
getRateFlag(rate) {
if (isNaN(rate) || rate === null || rate === undefined) return 0;
// 原始rate若为小数如0.8 → 80%1.1 → 110%),则*100后判断
const ratePercent = rate;
return ratePercent >= 100 ? 1 : 0;
}
return +(rate >= 100 || rate === 0); // + 号将布尔值转为数字true→1false→0
},
},
};
</script>

View File

@@ -2,9 +2,6 @@
<div class="coreBar">
<!-- 新增行容器包裹各基地情况和barTop -->
<div class="header-row">
<div class="base-title">
各基地情况
</div>
<div class="barTop">
<!-- 关键新增右侧容器包裹图例和按钮组实现整体靠右 -->
<div class="right-container">
@@ -260,10 +257,10 @@ export default {
// 新增:头部行容器,实现一行排列
.header-row {
display: flex;
justify-content: space-between; // 左右两端对齐
display: flex;
justify-content: flex-end; // 左右两端对齐
align-items: center; // 垂直居中
width: 100%;
// width: 100%;
margin-bottom: 8px; // 与下方图表区保留间距(可根据需求调整)
}

View File

@@ -6,7 +6,7 @@
<!-- 领用量模块传递整合了flag的useData -->
<div class="dashboard left">
<div class="title">
领用量·单位/万元
领用量·
</div>
<div class="chart-wrap">
<operatingSingleBar :detailData="useData"></operatingSingleBar>
@@ -15,7 +15,7 @@
<!-- 加工产量模块传递整合了flag的processData -->
<div class="dashboard right">
<div class="title">
加工产量·单位/万元
加工产量·
</div>
<div class="chart-wrap">
<operatingSingleBar :detailData="processData"></operatingSingleBar>

View File

@@ -39,7 +39,7 @@
</div>
</div>
<div class="lineBottom" style="height: 100%; width: 100%">
<operatingLineBar :chartData="chartD" style="height: 99%; width: 100%" />
<operatingLineBar :dateData="dateData" :chartData="chartD" style="height: 99%; width: 100%" />
</div>
</div>
</template>
@@ -51,7 +51,7 @@ import * as echarts from 'echarts';
export default {
name: "Container",
components: { operatingLineBar },
props: ["chartData"],
props: ["chartData",'dateData'],
emits: ['sort-change'], // 声明事件Vue3 推荐)
data() {
return {

View File

@@ -120,7 +120,7 @@ export default {
},
// min: 0,
// max: (value) => Math.ceil((value.max || 0) * 1.1),
scale: true,
axisTick: { show: false },
axisLabel: {
color: 'rgba(0, 0, 0, 0.45)',

View File

@@ -117,7 +117,7 @@ export default {
fontSize: 12,
align: 'right'
},
scale: true,
splitNumber: 4,
axisTick: { show: false },
axisLabel: {

View File

@@ -28,7 +28,11 @@ export default {
chartData: {
type: Object,
default: () => ({}),
}
},
dateData: {
type: Object,
default: () => ({}),
},
},
mounted() {
this.$nextTick(() => {
@@ -80,7 +84,8 @@ export default {
path: 'inputOutputRatioBase',
query: { // 使用query传递参数推荐也可使用params
// baseName: itemName,
factory: baseIndex
factory: baseIndex,
dateData: this.dateData
}
// 若仍需用base作为参数
// base: itemName,
@@ -116,11 +121,11 @@ export default {
}
}
},
grid: {
grid: {
top: 30,
bottom: 30,
right: 70,
left: 40
left: 60
},
xAxis: [
{
@@ -154,7 +159,7 @@ export default {
fontSize: 12,
align: 'right'
},
scale: true,
splitNumber: 4,
axisTick: { show: false },
axisLabel: {

View File

@@ -117,7 +117,7 @@ export default {
fontSize: 12,
align: 'right'
},
scale: true,
splitNumber: 4,
axisTick: { show: false },
axisLabel: {
@@ -146,7 +146,7 @@ export default {
},
splitLine: { show: false },
axisLine: { lineStyle: { color: 'rgba(0, 0, 0, 0.15)' } },
// scale: true,
//
splitNumber: 4,
}
],

View File

@@ -83,11 +83,11 @@ export default {
// return html;
// }
},
grid: {
top: 40,
bottom: 40,
right: 70,
left: 60,
grid: {
top: 30,
bottom: 60,
right: 30,
left: 50,
},
xAxis: [
{
@@ -123,7 +123,7 @@ export default {
type: 'solid' // 实线可选dashed虚线、dotted点线
}
},
scale: true,
splitNumber: 2,
axisTick: { show: false },
axisLabel: {

View File

@@ -30,7 +30,7 @@
background-color: rgba(249, 252, 255, 1);
">
<!-- <top-item /> -->
<operatingBar :chartData="chartData" @sort-change="sortChange" />
<operatingBar :dateData="dateData" :chartData="chartData" @sort-change="sortChange" />
</div>
</div>
</Container>
@@ -59,6 +59,10 @@ export default {
}),
required: true
},
dateData: {
type: Object,
default: () => ({}),
}
},
data() {
return {
@@ -85,12 +89,10 @@ export default {
* @param {number} rate 处理后的rate值已*100
* @returns {0|1} flag值
*/
getRateFlag(rate) {
// 处理非数字/空值,默认返回 0
if (isNaN(rate) || rate === null || rate === undefined) return 0;
// 核心逻辑≥100 → 1<100 → 0
return rate >= 100 ? 1 : 0;
},
getRateFlag(rate) {
if (isNaN(rate) || rate === null || rate === undefined) return 0;
return +(rate >= 100 || rate === 0); // + 号将布尔值转为数字true→1false→0
},
/**
* 核心处理函数:在所有数据都准备好后,才组装 chartData

View File

@@ -30,7 +30,7 @@
background-color: rgba(249, 252, 255, 1);
">
<!-- <top-item /> -->
<operatingBar @sort-change="sortChange" :chartData="chartData" />
<operatingBar :dateData="dateData" @sort-change="sortChange" :chartData="chartData" />
</div>
</div>
</Container>
@@ -53,6 +53,10 @@ export default {
type: Object,
default: () => ({}),
},
dateData: {
type: Object,
default: () => ({}),
}
},
data() {
return {
@@ -79,12 +83,10 @@ export default {
* @param {number} rate 处理后的rate值已*100
* @returns {0|1} flag值
*/
getRateFlag(rate) {
// 处理非数字/空值,默认返回 0
if (isNaN(rate) || rate === null || rate === undefined) return 0;
// 核心逻辑≥100 → 1<100 → 0
return rate >= 100 ? 1 : 0;
},
getRateFlag(rate) {
if (isNaN(rate) || rate === null || rate === undefined) return 0;
return +(rate >= 100 || rate === 0); // + 号将布尔值转为数字true→1false→0
},
/**
* 核心处理函数:在所有数据都准备好后,才组装 chartData

View File

@@ -14,7 +14,7 @@
{{ ytdData?.rate || 0 }}%
</div>
<div class="mom">
{{ ytdData?.yoyRate || 0 }}%
{{ ytdData?.yoyRate || 0 }}%
<img v-if="ytdData?.yoyRate >= 0" class="arrow" src="../../../assets/img/topArrow.png" alt="">
<img v-else class="arrow" src="../../../assets/img/downArrow.png" alt="">
</div>

View File

@@ -99,7 +99,7 @@ export default {
// boundaryGap: [10, 0], // 可根据需要开启,控制轴的留白
axisTick: { show: false },
min: 0,
// scale: true,
//
splitNumber: 4,
axisLine: {
show: true,

View File

@@ -6,7 +6,7 @@
<!-- 领用量模块传递整合了flag的useData -->
<div class="dashboard left">
<div class="title">
领用量·单位/万元
领用量·
</div>
<div class="chart-wrap">
<operatingSingleBar :detailData="useData"></operatingSingleBar>
@@ -15,7 +15,7 @@
<!-- 加工产量模块传递整合了flag的processData -->
<div class="dashboard right">
<div class="title">
加工产量·单位/万元
加工产量·
</div>
<div class="chart-wrap">
<operatingSingleBar :detailData="processData"></operatingSingleBar>

View File

@@ -2,8 +2,8 @@
<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"
@timeRangeChange="handleTimeChange" />
<ReportHeader :dateData="dateData" top-title="净价分析" :is-full-screen="isFullScreen"
@screenfullChange="screenfullChange" @timeRangeChange="handleTimeChange" />
<div class="main-body" style="
flex: 1;
display: flex;
@@ -16,7 +16,7 @@
gap: 12px;
grid-template-columns:1624px;
">
<operatingLineChart :thisMonData="thisMonData" />
<operatingLineChart :dateData="dateData" :thisMonData="thisMonData" />
</div>
</div>
<div class="top" style="display: flex; gap: 16px;margin-top: 6px;">
@@ -25,7 +25,7 @@
gap: 12px;
grid-template-columns: 1624px;
">
<operatingLineChartCumulative :totalData="totalData" />
<operatingLineChartCumulative :dateData="dateData" :totalData="totalData" />
<!-- <keyWork /> -->
</div>
</div>
@@ -68,7 +68,7 @@ export default {
timer: null,
beilv: 1,
value: 100,
selectDate: {},
dateData: {},
thisMonData: {},
totalData: {},
};
@@ -136,14 +136,15 @@ export default {
this.beilv = _this.clientWidth / 1920;
})();
};
this.dateData = this.$route.query.dateData ? this.$route.query.dateData : undefined
},
methods: {
getData(obj) {
getUnitPriceAnalysisGroupData({
startTime: this.selectDate.startTime,
endTime: this.selectDate.endTime,
startTime: this.dateData.startTime,
endTime: this.dateData.endTime,
paramName: '净价'
// timeDim: this.selectDate.mode
// timeDim: this.dateData.mode
}).then((res) => {
console.log(res);
this.thisMonData = res.data.thisMonData
@@ -158,7 +159,7 @@ export default {
},
handleTimeChange(obj) {
// console.log(obj, 'obj');
this.selectDate = obj
this.dateData= obj
this.getData()
},
handleClickOutside() {

View File

@@ -2,8 +2,8 @@
<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 size="psi" @timeRangeChange="handleTimeChange" top-title="基地净价分析" :is-full-screen="isFullScreen"
@screenfullChange="screenfullChange" />
<ReportHeader :dateData="dateData" size="psi" @timeRangeChange="handleTimeChange" top-title="基地净价分析"
:is-full-screen="isFullScreen" @screenfullChange="screenfullChange" />
<div class="main-body" style="
margin-top: -20px;
flex: 1;
@@ -178,7 +178,8 @@ export default {
this.beilv = _this.clientWidth / 1920;
})();
};
this.factory = this.$route.query.factory ? Number(this.$route.query.factory) : 5
this.factory = this.$route.query.factory ? Number(this.$route.query.factory) : 5
this.dateData = this.$route.query.dateData ? this.$route.query.dateData : undefined
},
methods: {
handleChange(value) {

View File

@@ -1,9 +1,6 @@
<template>
<div class="coreBar">
<div class="header-row">
<div class="base-title">
各基地情况
</div>
<div class="barTop">
<div class="right-container">
<div class="legend">
@@ -294,11 +291,11 @@ export default {
padding: 12px;
.header-row {
display: flex;
justify-content: space-between;
align-items: center;
width: 100%;
margin-bottom: 8px;
display: flex;
justify-content: flex-end; // 左右两端对齐
align-items: center; // 垂直居中
// width: 100%;
margin-bottom: 8px; // 与下方图表区保留间距(可根据需求调整)
}
.base-title {

View File

@@ -108,8 +108,8 @@ export default {
*/
getRateFlag(rate) {
if (isNaN(rate) || rate === null || rate === undefined) return 0;
return rate >= 100 ? 1 : 0;
}
return +(rate >= 100 || rate === 0); // + 号将布尔值转为数字true→1false→0
},
}
}
</script>

View File

@@ -7,7 +7,7 @@
<div class="topItem-container" style="display: flex; gap: 8px;">
<div class="dashboard left" @click="handleDashboardClick('/unitPriceAnalysis/unitPriceAnalysisBase')">
<div class="title">
单价·单位/万元
单价·
</div>
<div class="line">
<operatingSingleBar :detailData="{
@@ -18,7 +18,7 @@
</div>
<div class="dashboard right">
<div class="title">
运费·单位/万元
运费·
</div>
<div class="line">
<operatingSingleBar :detailData="{
@@ -50,6 +50,10 @@ export default {
运费: { completeRate: 0, diff: 0, real: 0, target: 0, thb: 0 },
})
},
dateData: {
type: Object,
default: () => ({})
},
factory: {
type: [String, Number],
default: ''
@@ -90,7 +94,8 @@ export default {
this.$router.push({
path: path,
query: {
factory: this.$route.query.factory ? this.$route.query.factory : this.factory
factory: this.$route.query.factory ? this.$route.query.factory : this.factory,
dateData:this.dateData
}
})
},

View File

@@ -39,7 +39,7 @@
</div>
</div>
<div class="lineBottom" style="height: 100%; width: 100%">
<operatingLineBar :chartData="chartD" style="height: 99%; width: 100%" />
<operatingLineBar :dateData="dateData" :chartData="chartD" style="height: 99%; width: 100%" />
</div>
</div>
</template>
@@ -51,7 +51,7 @@ import * as echarts from 'echarts';
export default {
name: "Container",
components: { operatingLineBar },
props: ["chartData"],
props: ["chartData",'dateData'],
emits: ['sort-change'], // 声明事件Vue3 推荐)
data() {
return {

View File

@@ -120,7 +120,7 @@ export default {
},
// min: 0,
// max: (value) => Math.ceil((value.max || 0) * 1.1),
scale: true,
axisTick: { show: false },
axisLabel: {
color: 'rgba(0, 0, 0, 0.45)',

View File

@@ -117,7 +117,7 @@ export default {
fontSize: 12,
align: 'right'
},
scale: true,
splitNumber: 4,
axisTick: { show: false },
axisLabel: {

View File

@@ -28,7 +28,11 @@ export default {
chartData: {
type: Object,
default: () => ({}),
}
},
dateData: {
type: Object,
default: () => ({}),
},
},
mounted() {
this.$nextTick(() => {
@@ -44,7 +48,7 @@ export default {
},
deep: true,
immediate: true
}
},
},
beforeDestroy() {
// 组件销毁时清理资源
@@ -80,7 +84,8 @@ export default {
path: 'netPriceAnalysisBase',
query: { // 使用query传递参数推荐也可使用params
// baseName: itemName,
factory: baseIndex
factory: baseIndex,
dateData: this.dateData
}
// 若仍需用base作为参数
// base: itemName,
@@ -116,11 +121,11 @@ export default {
}
}
},
grid: {
grid: {
top: 30,
bottom: 30,
right: 70,
left: 40
left: 60
},
xAxis: [
{
@@ -154,7 +159,7 @@ export default {
fontSize: 12,
align: 'right'
},
scale: true,
splitNumber: 4,
axisTick: { show: false },
axisLabel: {

View File

@@ -117,7 +117,7 @@ export default {
fontSize: 12,
align: 'right'
},
scale: true,
splitNumber: 4,
axisTick: { show: false },
axisLabel: {
@@ -146,7 +146,7 @@ export default {
},
splitLine: { show: false },
axisLine: { lineStyle: { color: 'rgba(0, 0, 0, 0.15)' } },
// scale: true,
//
splitNumber: 4,
}
],

View File

@@ -83,11 +83,11 @@ export default {
// return html;
// }
},
grid: {
top: 40,
bottom: 40,
right: 70,
left: 60,
grid: {
top: 30,
bottom: 60,
right: 30,
left: 50,
},
xAxis: [
{
@@ -123,7 +123,7 @@ export default {
type: 'solid' // 实线可选dashed虚线、dotted点线
}
},
scale: true,
splitNumber: 2,
axisTick: { show: false },
axisLabel: {

Some files were not shown because too many files have changed in this diff Show More