|
|
|
@ -177,7 +177,36 @@
|
|
|
|
</el-table>
|
|
|
|
</el-table>
|
|
|
|
</div>
|
|
|
|
</div>
|
|
|
|
|
|
|
|
|
|
|
|
<!-- 销售历史图表 -->
|
|
|
|
<!-- 销售历史图表对话框 -->
|
|
|
|
|
|
|
|
<el-dialog
|
|
|
|
|
|
|
|
v-model="showChartDialog"
|
|
|
|
|
|
|
|
:title="`销售历史 - ${salesChartTitle}`"
|
|
|
|
|
|
|
|
width="90%"
|
|
|
|
|
|
|
|
destroy-on-close
|
|
|
|
|
|
|
|
@close="closeChart"
|
|
|
|
|
|
|
|
>
|
|
|
|
|
|
|
|
<div class="chart-controls">
|
|
|
|
|
|
|
|
<span class="filter-label">时间范围:</span>
|
|
|
|
|
|
|
|
<el-select v-model="selectedTimeRange" @change="onChartTimeRangeChange" style="width: 120px">
|
|
|
|
|
|
|
|
<el-option label="近1天" value="近1天" />
|
|
|
|
|
|
|
|
<el-option label="近3天" value="近3天" />
|
|
|
|
|
|
|
|
<el-option label="近1周" value="近1周" />
|
|
|
|
|
|
|
|
<el-option label="近1月" value="近1月" />
|
|
|
|
|
|
|
|
</el-select>
|
|
|
|
|
|
|
|
<span class="filter-label" style="margin-left: 20px;">显示单位:</span>
|
|
|
|
|
|
|
|
<el-radio-group v-model="chartUnit" @change="onChartUnitChange" size="small">
|
|
|
|
|
|
|
|
<el-radio-button value="box">箱数</el-radio-button>
|
|
|
|
|
|
|
|
<el-radio-button value="weight">重量</el-radio-button>
|
|
|
|
|
|
|
|
</el-radio-group>
|
|
|
|
|
|
|
|
</div>
|
|
|
|
|
|
|
|
<div v-if="salesChartLoading || historyChartLoading" v-loading="true" class="chart-loading" style="height: 400px;"></div>
|
|
|
|
|
|
|
|
<div v-else-if="!hasSalesData && !hasHistoryData" class="no-data-message" style="height: 400px;">
|
|
|
|
|
|
|
|
暂无销售和库存数据
|
|
|
|
|
|
|
|
</div>
|
|
|
|
|
|
|
|
<div v-show="!salesChartLoading && (hasSalesData || hasHistoryData)" ref="salesChartDialogRef" class="chart" style="height: 450px;"></div>
|
|
|
|
|
|
|
|
</el-dialog>
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
<!-- 销售历史图表(表格下方显示) -->
|
|
|
|
<div v-if="showChart" class="sales-chart-container">
|
|
|
|
<div v-if="showChart" class="sales-chart-container">
|
|
|
|
<div class="chart-header">
|
|
|
|
<div class="chart-header">
|
|
|
|
<h4>销售历史 - {{ salesChartTitle }}</h4>
|
|
|
|
<h4>销售历史 - {{ salesChartTitle }}</h4>
|
|
|
|
@ -230,8 +259,6 @@ const selectedEquipment = ref('all')
|
|
|
|
// 完成度筛选相关状态
|
|
|
|
// 完成度筛选相关状态
|
|
|
|
const selectedCompletionLevel = ref('all') // 默认显示全部
|
|
|
|
const selectedCompletionLevel = ref('all') // 默认显示全部
|
|
|
|
|
|
|
|
|
|
|
|
// 销售图表相关状态
|
|
|
|
|
|
|
|
const showChart = ref(false)
|
|
|
|
|
|
|
|
const salesChartLoading = ref(false)
|
|
|
|
const salesChartLoading = ref(false)
|
|
|
|
const historyChartLoading = ref(false)
|
|
|
|
const historyChartLoading = ref(false)
|
|
|
|
const salesData = ref([])
|
|
|
|
const salesData = ref([])
|
|
|
|
@ -243,8 +270,13 @@ const chartUnit = ref('box')
|
|
|
|
const salesChartTitle = ref('')
|
|
|
|
const salesChartTitle = ref('')
|
|
|
|
const currentSalesAxle = ref(null)
|
|
|
|
const currentSalesAxle = ref(null)
|
|
|
|
const salesChartRef = ref(null)
|
|
|
|
const salesChartRef = ref(null)
|
|
|
|
|
|
|
|
const salesChartDialogRef = ref(null)
|
|
|
|
let salesChart = null
|
|
|
|
let salesChart = null
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
// 销售图表相关状态
|
|
|
|
|
|
|
|
const showChart = ref(false)
|
|
|
|
|
|
|
|
const showChartDialog = ref(false)
|
|
|
|
|
|
|
|
|
|
|
|
// 当组件加载时,使用父组件传递的数据
|
|
|
|
// 当组件加载时,使用父组件传递的数据
|
|
|
|
equipmentData.value = props.equipmentData
|
|
|
|
equipmentData.value = props.equipmentData
|
|
|
|
|
|
|
|
|
|
|
|
@ -480,7 +512,12 @@ const showSalesHistory = (row) => {
|
|
|
|
|
|
|
|
|
|
|
|
currentSalesAxle.value = { ...row };
|
|
|
|
currentSalesAxle.value = { ...row };
|
|
|
|
salesChartTitle.value = `${row.equipment_code} - ${row.axle_number} - ${row.specification} - ${row.model}`;
|
|
|
|
salesChartTitle.value = `${row.equipment_code} - ${row.axle_number} - ${row.specification} - ${row.model}`;
|
|
|
|
showChart.value = true;
|
|
|
|
|
|
|
|
|
|
|
|
if (selectedEquipment.value === 'all') {
|
|
|
|
|
|
|
|
showChartDialog.value = true;
|
|
|
|
|
|
|
|
} else {
|
|
|
|
|
|
|
|
showChart.value = true;
|
|
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
|
|
salesData.value = [];
|
|
|
|
salesData.value = [];
|
|
|
|
historyData.value = [];
|
|
|
|
historyData.value = [];
|
|
|
|
@ -494,6 +531,7 @@ const showSalesHistory = (row) => {
|
|
|
|
// 方法:关闭图表
|
|
|
|
// 方法:关闭图表
|
|
|
|
const closeChart = () => {
|
|
|
|
const closeChart = () => {
|
|
|
|
showChart.value = false;
|
|
|
|
showChart.value = false;
|
|
|
|
|
|
|
|
showChartDialog.value = false;
|
|
|
|
if (salesChart) {
|
|
|
|
if (salesChart) {
|
|
|
|
salesChart.dispose();
|
|
|
|
salesChart.dispose();
|
|
|
|
salesChart = null;
|
|
|
|
salesChart = null;
|
|
|
|
@ -603,7 +641,10 @@ const initSalesChart = (retryCount = 0) => {
|
|
|
|
return;
|
|
|
|
return;
|
|
|
|
}
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
|
|
if (!salesChartRef.value) {
|
|
|
|
const isDialog = showChartDialog.value;
|
|
|
|
|
|
|
|
const chartRef = isDialog ? salesChartDialogRef.value : salesChartRef.value;
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
if (!chartRef) {
|
|
|
|
if (retryCount >= 20) {
|
|
|
|
if (retryCount >= 20) {
|
|
|
|
return;
|
|
|
|
return;
|
|
|
|
}
|
|
|
|
}
|
|
|
|
@ -617,7 +658,7 @@ const initSalesChart = (retryCount = 0) => {
|
|
|
|
salesChart.dispose();
|
|
|
|
salesChart.dispose();
|
|
|
|
}
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
|
|
salesChart = echarts.init(salesChartRef.value);
|
|
|
|
salesChart = echarts.init(chartRef);
|
|
|
|
|
|
|
|
|
|
|
|
const salesDateMap = new Map();
|
|
|
|
const salesDateMap = new Map();
|
|
|
|
const historyDateMap = new Map();
|
|
|
|
const historyDateMap = new Map();
|
|
|
|
|