修复库存分布问题

This commit is contained in:
2025-10-31 14:50:19 +08:00
parent 331faa3971
commit 6431f0e0eb
6 changed files with 460 additions and 77 deletions

View File

@@ -99,6 +99,8 @@
</template>
<script>
import { listStoppage } from '@/api/pocket/plantState'
// 2. 独立工具函数避免data初始化时调用this.methods的问题
/**
* 获取默认日期(根据视图类型)
@@ -353,11 +355,14 @@ export default {
const defaultDate = getDefaultDate();
this.startDate = defaultDate;
this.endDate = tab === "day" ? defaultDate : getDefaultDate(tab);
// 切换视图时重新加载数据
this.loadStoppageData();
},
// 日模式:日期选择器变更
handleDateChange(e) {
this.startDate = e.detail.value;
this.endDate = e.detail.value; // 日模式首尾日期一致
this.loadStoppageData();
},
// 月模式:开始月份变更
handleStartMonthChange(e) {
@@ -369,19 +374,105 @@ export default {
if (new Date(this.endDate) > maxEndDate) {
this.endDate = maxEndStr;
}
this.loadStoppageData();
},
// 月模式:结束月份变更
handleEndMonthChange(e) {
this.endDate = e.detail.value;
this.loadStoppageData();
},
// 年模式:开始年份变更
handleStartYearChange(e) {
this.startDate = e.detail.value;
this.loadStoppageData();
},
// 年模式:结束年份变更
handleEndYearChange(e) {
this.endDate = e.detail.value;
this.loadStoppageData();
},
// 加载停机数据
loadStoppageData() {
uni.showLoading({ title: '加载中' })
const queryParams = {
pageNum: 1,
pageSize: 100,
startDate: this.startDate,
endDate: this.endDate
}
listStoppage(queryParams).then(response => {
uni.hideLoading()
if (response.code === 200 && response.rows && response.rows.length > 0) {
// 处理停机数据
console.log('停机数据:', response.rows)
// 更新表格数据(日视图)
this.tableData = response.rows.map(item => ({
time: this.formatDateTime(item.startDate) + ' - ' + this.formatDateTime(item.endDate),
duration: item.duration + 'min',
remark: item.remark || '-',
machine: item.unit || '-'
}))
// 计算汇总数据
const totalDuration = response.rows.reduce((sum, item) => sum + (item.duration || 0), 0)
const totalCount = response.rows.length
this.summaryData = [
{ label: '停机时间', value: totalDuration, unit: 'min' },
{ label: '停机次数', value: totalCount },
{ label: '作业率', value: this.calculateWorkRate(totalDuration), unit: '%' }
]
// 更新饼图数据(按班组统计)
const crewMap = {}
response.rows.forEach(item => {
const crew = item.crew || '未知班组'
crewMap[crew] = (crewMap[crew] || 0) + (item.duration || 0)
})
this.pieChartData = {
series: [{
data: Object.keys(crewMap).map(crew => ({
name: crew,
value: crewMap[crew]
}))
}]
}
} else {
// 没有数据时使用默认值
console.log('暂无停机数据')
}
}).catch(error => {
uni.hideLoading()
console.error('加载停机数据失败:', error)
})
},
// 格式化日期时间
formatDateTime(dateStr) {
if (!dateStr) return '-'
const date = new Date(dateStr)
const year = date.getFullYear()
const month = String(date.getMonth() + 1).padStart(2, '0')
const day = String(date.getDate()).padStart(2, '0')
const hours = String(date.getHours()).padStart(2, '0')
const minutes = String(date.getMinutes()).padStart(2, '0')
return `${year}-${month}-${day} ${hours}:${minutes}`
},
// 计算作业率
calculateWorkRate(stopDuration) {
// 假设一天工作24小时1440分钟
const totalMinutes = 1440
const workRate = ((totalMinutes - stopDuration) / totalMinutes) * 100
return Math.max(0, Math.min(100, workRate)).toFixed(2)
}
},
// 生命周期钩子
mounted() {
this.loadStoppageData()
}
};
</script>

View File

@@ -101,7 +101,8 @@
<script>
import HeadTabsVue from '../panels/klp-tabs/klp-tabs.vue';
import { listPlantStateCurrent, listPlantStateHistory } from '@/api/pocket/plantState'
export default {
components: {
HeadTabsVue
@@ -169,41 +170,98 @@ export default {
},
mounted() {
this.getServerData();
this.loadCurrentState();
},
methods: {
// 加载当前设备状态
loadCurrentState() {
listPlantStateCurrent({ pageNum: 1, pageSize: 10 }).then(response => {
if (response.code === 200 && response.rows && response.rows.length > 0) {
const currentData = response.rows[0]
// 更新能耗状态数据
this.energyStatus = [
{ label: '工艺缎带钢线速度', value: currentData.value1 || '9.9' },
{ label: '轧机出口带钢线速度', value: currentData.value2 || '126.0' }
]
console.log('当前状态数据:', response.rows)
}
}).catch(error => {
console.error('加载设备状态失败:', error)
})
},
// 从服务器获取历史数据
getServerData() {
// 模拟从服务器获取数据时的延时
uni.showLoading({
title: '加载中'
});
setTimeout(() => {
let res = {
categories: ['2016', '2017', '2018', '2019', '2020', '2021'],
series: [
{
name: '目标值',
data: [35, 36, 31, 33, 13, 34],
},
{
name: '完成量',
data: [18, 27, 21, 24, 6, 28],
},
],
};
this.chartData = JSON.parse(JSON.stringify(res));
const queryParams = {
pageNum: 1,
pageSize: 20
}
// 如果有时间范围选择,添加到查询参数中
if (this.selectedTimeRange && this.selectedTimeRange.length === 2) {
queryParams.startTime = this.selectedTimeRange[0]
queryParams.endTime = this.selectedTimeRange[1]
}
listPlantStateHistory(queryParams).then(response => {
uni.hideLoading();
}, 500);
if (response.code === 200 && response.rows && response.rows.length > 0) {
const categories = []
const targetData = []
const completeData = []
response.rows.forEach(item => {
const dateStr = this.formatDate(item.insdate)
categories.push(dateStr)
targetData.push(item.value1 || 0)
completeData.push(item.value2 || 0)
})
const res = {
categories: categories,
series: [
{ name: '目标值', data: targetData },
{ name: '完成量', data: completeData }
]
}
this.chartData = JSON.parse(JSON.stringify(res))
} else {
this.loadDefaultChartData()
}
}).catch(error => {
uni.hideLoading();
console.error('加载历史数据失败:', error)
this.loadDefaultChartData()
});
},
// 加载默认图表数据
loadDefaultChartData() {
const res = {
categories: ['2016', '2017', '2018', '2019', '2020', '2021'],
series: [
{ name: '目标值', data: [35, 36, 31, 33, 13, 34] },
{ name: '完成量', data: [18, 27, 21, 24, 6, 28] }
]
}
this.chartData = JSON.parse(JSON.stringify(res))
},
// 格式化日期
formatDate(dateStr) {
if (!dateStr) return ''
const date = new Date(dateStr)
return `${date.getMonth() + 1}/${date.getDate()}`
},
openTimePicker() {
this.$refs.timePickerPopup.open();
uni.showLoading({
title: '加载中'
});
// 模拟数据加载
setTimeout(() => {
uni.hideLoading();
}, 500);
},
closeTimePicker() {
this.$refs.timePickerPopup.close();
@@ -217,7 +275,7 @@ export default {
if (!e) return;
this.selectedTimeRange = e;
this.closeTimePicker();
// 这里可以调用接口重新获取数据
// 根据时间范围重新获取数据
this.getServerData();
}
}

View File

@@ -152,6 +152,8 @@
</template>
<script>
import { listPlantStateCurrent, listPlantStateHistory } from '@/api/pocket/plantState'
export default {
// 响应式数据(替代 Vue 3 的 ref
data() {
@@ -173,22 +175,86 @@ export default {
// 生命周期钩子(替代 Vue 3 的 onMounted
mounted() {
this.getServerData() // 页面挂载后加载数据
this.loadCurrentState() // 加载当前状态
},
// 方法定义(所有函数需放在 methods 中)
methods: {
// 模拟从服务器获取数据
getServerData() {
setTimeout(() => {
const res = {
categories: ['2016', '2017', '2018', '2019', '2020', '2021'],
series: [
{ name: '目标值', data: [35, 36, 31, 33, 13, 34] },
{ name: '完成量', data: [18, 27, 21, 24, 6, 28] }
]
// 加载当前设备状态
loadCurrentState() {
uni.showLoading({ title: '加载中' })
listPlantStateCurrent({ pageNum: 1, pageSize: 10 }).then(response => {
uni.hideLoading()
if (response.code === 200 && response.rows) {
// 处理当前状态数据
console.log('当前状态数据:', response.rows)
// 可以根据实际需求更新status数据
}
// 深拷贝避免引用问题Vue 2 响应式兼容)
this.chartData = JSON.parse(JSON.stringify(res))
}, 500)
}).catch(error => {
uni.hideLoading()
console.error('加载设备状态失败:', error)
})
},
// 从服务器获取历史数据用于图表
getServerData() {
uni.showLoading({ title: '加载中' })
listPlantStateHistory({ pageNum: 1, pageSize: 20 }).then(response => {
uni.hideLoading()
if (response.code === 200 && response.rows && response.rows.length > 0) {
// 处理历史数据,转换为图表需要的格式
const categories = []
const targetData = []
const completeData = []
response.rows.forEach(item => {
// 根据实际数据结构调整
const dateStr = this.formatDate(item.insdate)
categories.push(dateStr)
// 这里使用value1和value2作为示例实际应根据业务需求调整
targetData.push(item.value1 || 0)
completeData.push(item.value2 || 0)
})
const res = {
categories: categories,
series: [
{ name: '目标值', data: targetData },
{ name: '完成量', data: completeData }
]
}
this.chartData = JSON.parse(JSON.stringify(res))
} else {
// 如果没有数据,使用默认数据
this.loadDefaultChartData()
}
}).catch(error => {
uni.hideLoading()
console.error('加载历史数据失败:', error)
// 加载失败时使用默认数据
this.loadDefaultChartData()
})
},
// 加载默认图表数据
loadDefaultChartData() {
const res = {
categories: ['2016', '2017', '2018', '2019', '2020', '2021'],
series: [
{ name: '目标值', data: [35, 36, 31, 33, 13, 34] },
{ name: '完成量', data: [18, 27, 21, 24, 6, 28] }
]
}
this.chartData = JSON.parse(JSON.stringify(res))
},
// 格式化日期
formatDate(dateStr) {
if (!dateStr) return ''
const date = new Date(dateStr)
return `${date.getMonth() + 1}/${date.getDate()}`
}
}
}

View File

@@ -173,6 +173,8 @@
</template>
<script>
import { listPlantStateCurrent, listPlantStateHistory } from '@/api/pocket/plantState'
export default {
// 3. 响应式数据(替代 Vue 3 的 ref
data() {
@@ -190,23 +192,77 @@ export default {
// 4. 生命周期钩子(替代 Vue 3 的 onMounted
mounted() {
this.getServerData(); // 页面挂载后加载图表数据
this.loadCurrentState(); // 加载当前状态
},
// 5. 方法定义(所有数据处理与逻辑)
methods: {
// 模拟从服务器获取图表数据
// 加载当前设备状态
loadCurrentState() {
listPlantStateCurrent({ pageNum: 1, pageSize: 10 }).then(response => {
if (response.code === 200 && response.rows) {
console.log('当前状态数据:', response.rows)
// 可以根据实际需求更新页面数据
}
}).catch(error => {
console.error('加载设备状态失败:', error)
})
},
// 从服务器获取图表数据
getServerData() {
setTimeout(() => {
// 模拟服务器返回的图表数据
const serverRes = {
categories: ["2016", "2017", "2018", "2019", "2020", "2021"],
series: [
{ name: "目标值", data: [35, 36, 31, 33, 13, 34] },
{ name: "完成量", data: [18, 27, 21, 24, 6, 28] }
]
};
// 深拷贝避免 Vue 2 响应式引用问题
this.chartData = JSON.parse(JSON.stringify(serverRes));
}, 500);
uni.showLoading({ title: '加载中' })
listPlantStateHistory({ pageNum: 1, pageSize: 20 }).then(response => {
uni.hideLoading()
if (response.code === 200 && response.rows && response.rows.length > 0) {
const categories = []
const targetData = []
const completeData = []
response.rows.forEach(item => {
const dateStr = this.formatDate(item.insdate)
categories.push(dateStr)
targetData.push(item.value1 || 0)
completeData.push(item.value2 || 0)
})
const serverRes = {
categories: categories,
series: [
{ name: "目标值", data: targetData },
{ name: "完成量", data: completeData }
]
}
this.chartData = JSON.parse(JSON.stringify(serverRes))
} else {
this.loadDefaultChartData()
}
}).catch(error => {
uni.hideLoading()
console.error('加载历史数据失败:', error)
this.loadDefaultChartData()
})
},
// 加载默认图表数据
loadDefaultChartData() {
const serverRes = {
categories: ["2016", "2017", "2018", "2019", "2020", "2021"],
series: [
{ name: "目标值", data: [35, 36, 31, 33, 13, 34] },
{ name: "完成量", data: [18, 27, 21, 24, 6, 28] }
]
}
this.chartData = JSON.parse(JSON.stringify(serverRes))
},
// 格式化日期
formatDate(dateStr) {
if (!dateStr) return ''
const date = new Date(dateStr)
return `${date.getMonth() + 1}/${date.getDate()}`
}
}
};

View File

@@ -169,6 +169,8 @@
</template>
<script>
import { listPlantStateCurrent, listPlantStateHistory } from '@/api/pocket/plantState'
export default {
// 3. 响应式数据(替代 Vue 3 的 ref
data() {
@@ -186,23 +188,77 @@ export default {
// 4. 生命周期钩子(替代 Vue 3 的 onMounted
mounted() {
this.getServerData(); // 页面挂载后加载图表数据
this.loadCurrentState(); // 加载当前状态
},
// 5. 方法定义(所有数据处理与逻辑)
methods: {
// 模拟从服务器获取图表数据
// 加载当前设备状态
loadCurrentState() {
listPlantStateCurrent({ pageNum: 1, pageSize: 10 }).then(response => {
if (response.code === 200 && response.rows) {
console.log('当前状态数据:', response.rows)
// 可以根据实际需求更新页面数据
}
}).catch(error => {
console.error('加载设备状态失败:', error)
})
},
// 从服务器获取图表数据
getServerData() {
setTimeout(() => {
// 模拟服务器返回的图表数据
const serverRes = {
categories: ["2016", "2017", "2018", "2019", "2020", "2021"],
series: [
{ name: "目标值", data: [35, 36, 31, 33, 13, 34] },
{ name: "完成量", data: [18, 27, 21, 24, 6, 28] }
]
};
// 深拷贝避免 Vue 2 响应式引用问题
this.chartData = JSON.parse(JSON.stringify(serverRes));
}, 500);
uni.showLoading({ title: '加载中' })
listPlantStateHistory({ pageNum: 1, pageSize: 20 }).then(response => {
uni.hideLoading()
if (response.code === 200 && response.rows && response.rows.length > 0) {
const categories = []
const targetData = []
const completeData = []
response.rows.forEach(item => {
const dateStr = this.formatDate(item.insdate)
categories.push(dateStr)
targetData.push(item.value1 || 0)
completeData.push(item.value2 || 0)
})
const serverRes = {
categories: categories,
series: [
{ name: "目标值", data: targetData },
{ name: "完成量", data: completeData }
]
}
this.chartData = JSON.parse(JSON.stringify(serverRes))
} else {
this.loadDefaultChartData()
}
}).catch(error => {
uni.hideLoading()
console.error('加载历史数据失败:', error)
this.loadDefaultChartData()
})
},
// 加载默认图表数据
loadDefaultChartData() {
const serverRes = {
categories: ["2016", "2017", "2018", "2019", "2020", "2021"],
series: [
{ name: "目标值", data: [35, 36, 31, 33, 13, 34] },
{ name: "完成量", data: [18, 27, 21, 24, 6, 28] }
]
}
this.chartData = JSON.parse(JSON.stringify(serverRes))
},
// 格式化日期
formatDate(dateStr) {
if (!dateStr) return ''
const date = new Date(dateStr)
return `${date.getMonth() + 1}/${date.getDate()}`
}
}
};

View File

@@ -169,6 +169,8 @@
</template>
<script>
import { listPlantStateCurrent, listPlantStateHistory } from '@/api/pocket/plantState'
export default {
// 3. 响应式数据(替代 Vue 3 的 ref
data() {
@@ -186,23 +188,77 @@ export default {
// 4. 生命周期钩子(替代 Vue 3 的 onMounted
mounted() {
this.getServerData(); // 页面挂载后加载图表数据
this.loadCurrentState(); // 加载当前状态
},
// 5. 方法定义(所有数据处理与逻辑)
methods: {
// 模拟从服务器获取图表数据
// 加载当前设备状态
loadCurrentState() {
listPlantStateCurrent({ pageNum: 1, pageSize: 10 }).then(response => {
if (response.code === 200 && response.rows) {
console.log('当前状态数据:', response.rows)
// 可以根据实际需求更新页面数据
}
}).catch(error => {
console.error('加载设备状态失败:', error)
})
},
// 从服务器获取图表数据
getServerData() {
setTimeout(() => {
// 模拟服务器返回的图表数据
const serverRes = {
categories: ["2016", "2017", "2018", "2019", "2020", "2021"],
series: [
{ name: "目标值", data: [35, 36, 31, 33, 13, 34] },
{ name: "完成量", data: [18, 27, 21, 24, 6, 28] }
]
};
// 深拷贝避免 Vue 2 响应式引用问题
this.chartData = JSON.parse(JSON.stringify(serverRes));
}, 500);
uni.showLoading({ title: '加载中' })
listPlantStateHistory({ pageNum: 1, pageSize: 20 }).then(response => {
uni.hideLoading()
if (response.code === 200 && response.rows && response.rows.length > 0) {
const categories = []
const targetData = []
const completeData = []
response.rows.forEach(item => {
const dateStr = this.formatDate(item.insdate)
categories.push(dateStr)
targetData.push(item.value1 || 0)
completeData.push(item.value2 || 0)
})
const serverRes = {
categories: categories,
series: [
{ name: "目标值", data: targetData },
{ name: "完成量", data: completeData }
]
}
this.chartData = JSON.parse(JSON.stringify(serverRes))
} else {
this.loadDefaultChartData()
}
}).catch(error => {
uni.hideLoading()
console.error('加载历史数据失败:', error)
this.loadDefaultChartData()
})
},
// 加载默认图表数据
loadDefaultChartData() {
const serverRes = {
categories: ["2016", "2017", "2018", "2019", "2020", "2021"],
series: [
{ name: "目标值", data: [35, 36, 31, 33, 13, 34] },
{ name: "完成量", data: [18, 27, 21, 24, 6, 28] }
]
}
this.chartData = JSON.parse(JSON.stringify(serverRes))
},
// 格式化日期
formatDate(dateStr) {
if (!dateStr) return ''
const date = new Date(dateStr)
return `${date.getMonth() + 1}/${date.getDate()}`
}
}
};