Skip to content

D
DC-TOM
Commit b631dafc authored by Cai Wei's avatar Cai Wei
Browse files
Options

feat(*): 除尘器总览连调

parent 0c3e67ce
Hide whitespace changes
Inline Side-by-side
Showing with 114 additions and 85 deletions
src/components/CommonTable/index.vue
View file @ b631dafc
......@@ -81,6 +81,10 @@ const props = defineProps({
jumper: "前往",
}),
},
total: {
type: Number,
default: 0,
},
// 表格最小高度
minHeight: {
type: Number,
......@@ -136,7 +140,7 @@ watch(
// 分页相关
const currentPage = ref(1);
const pageSize = ref(props.defaultPageSize);
const total = computed(() => props.data.length);
const total = computed(() => props.total);
// 当前页数据
const currentPageData = computed(() => {
......
src/views/dustOverview/components/roomSettingDialog.vue
View file @ b631dafc
......@@ -20,7 +20,7 @@
<el-form-item label="仓室分几排">
<el-input-number
v-model="roomForm.rows"
:min="1"
:min="0"
:max="20"
controls-position="right"
@change="handleRowsChange"
......@@ -33,7 +33,7 @@
<div class="table-title">
仓室数量分布
<div
v-if="distributionDiff !== 0"
v-if="distributionDiff > 0"
:class="[
'distribution-warning',
distributionDiff > 0 ? 'warning-less' : 'warning-less',
......@@ -59,7 +59,7 @@
<el-input-number
v-model="row.compartPositionColumnNum"
:min="1"
:max="50"
:max="1000"
controls-position="right"
size="small"
@change="handleDistributionChange"
......@@ -72,7 +72,7 @@
<template #footer>
<span class="dialog-footer">
<el-button @click="$emit('update:modelValue', false)">取消</el-button>
<el-button type="primary" @click="handleConfirm" :disabled="distributionDiff !== 0">
<el-button type="primary" @click="handleConfirm" :disabled="distributionDiff > 0">
确认
</el-button>
</span>
......@@ -101,7 +101,6 @@ const roomForm = ref({
const distributionData = ref([]);
const initializeState = () => {
console.log(props.data.deviceNo)
if (props.data.deviceNo) {
const { compartNum, compartRowNum, compartHealthList } = props.data;
roomForm.value.totalRooms = compartNum || 0;
......@@ -136,19 +135,21 @@ const distributionDiff = computed(() => {
const handleRowsChange = (value) => {
const total = roomForm.value.totalRooms;
console.log('total', total, value);
if (!total || !value) return;
// 计算每行的基础数量（向下取整）和余数
const baseValue = Math.floor(total / value);
const remainder = total % value;
console.log(baseValue, remainder)
// 生成分布数据
distributionData.value = Array.from({ length: value }, (_, index) => {
return {
compartPositionRow: index + 1,
compartPositionColumnNum: index < remainder ? baseValue + 1 : baseValue
compartPositionColumnNum: index < remainder ? baseValue + 1 : baseValue
};
});
console.log
};
const handleDistributionChange = () => {
......@@ -156,7 +157,7 @@ const handleDistributionChange = () => {
};
const handleConfirm = () => {
if (distributionDiff.value === 0) {
if (distributionDiff.value <= 0) {
const { deviceNo, compartNum } = props.data;
emit("confirm", {
compartNum,
......
src/views/dustOverview/components/valveSettingDialog.vue
View file @ b631dafc
......@@ -6,7 +6,6 @@
:close-on-click-modal="false"
:close-on-press-escape="false"
@update:model-value="$emit('update:modelValue', $event)"
@open="initializeState"
>
<div class="valve-setting">
<div class="setting-row">
......@@ -22,19 +21,19 @@
<div class="setting-row">
<div class="input-group">
<span>仓室编号：</span>
<el-select v-model="valveForm.roomNo" style="width: 120px" @change="handleRoomChange">
<el-select v-model="valveForm.compartNo" style="width: 120px" @change="handleRoomChange">
<el-option
v-for="cell in statusData"
:key="cell.index"
:label="`${cell.index}仓`"
:value="cell.index"
:key="cell.compartNo"
:label="`${cell.compartNo}仓`"
:value="cell.compartNo"
/>
</el-select>
</div>
<div class="input-group">
<span>电磁阀分布数量：</span>
<el-input-number
v-model="valveForm.valveCount"
v-model="valveForm.valveNum"
:min="1"
controls-position="right"
style="width: 120px"
......@@ -44,7 +43,7 @@
<div class="input-group">
<span>布袋数量：</span>
<el-input-number
v-model="valveForm.distribution"
v-model="valveForm.bagNum"
:min="1"
controls-position="right"
style="width: 120px"
......@@ -63,30 +62,30 @@
type="primary"
class="save-btn"
@click="handleSave"
:disabled="!!errorMessage || valveForm.valveCount === null || valveForm.distribution === null"
>保存</el-button>
:disabled="!!errorMessage || valveForm.valveNum === null || valveForm.bagNum === null"
>设置</el-button>
</div>
</div>
<!-- 分布表格 -->
<div class="distribution-table">
<div class="bagNum-table">
<div class="table-title">
仓室脉冲阀数量分布
<span class="valve-count-info">
<span class="valve-valveNum-info">
(当前分配: {{ currentTotalValves }}/{{ valveForm.total }})
</span>
</div>
<div class="valve-distribution-grid">
<div class="valve-bagNum-grid">
<div class="valve-row">
<div
v-for="(cell, colIndex) in statusData"
:key="colIndex"
class="valve-cell"
:class="{ 'active-cell': cell.index === valveForm.roomNo }"
@click="valveForm.roomNo = cell.index; handleRoomChange(cell.index)"
:class="{ 'active-cell': cell.compartNo === valveForm.compartNo }"
@click="valveForm.compartNo = cell.compartNo; handleRoomChange(cell.compartNo)"
>
<div class="cell-index">{{ cell.index }}仓</div>
<div class="cell-value">{{ cell.count }}</div>
<div class="cell-index">{{ cell.compartNo }}仓</div>
<div class="cell-value">{{ cell.valveNum }} <span>({{ cell.bagNum }})</span></div>
</div>
</div>
</div>
......@@ -105,6 +104,7 @@
<script setup>
import { ref, watch, computed } from "vue";
import { getValveAllocation } from "@/request/api/dustOverview";
const props = defineProps({
modelValue: Boolean,
......@@ -119,9 +119,9 @@ const emit = defineEmits(["update:modelValue", "confirm"]);
const valveForm = ref({
total: 0,
rows: 0,
roomNo: 0,
valveCount: 0,
distribution: 0
compartNo: 0,
valveNum: 0,
bagNum: 0
});
const statusData = ref([]);
......@@ -129,17 +129,17 @@ const errorMessage = ref("");
// 计算当前已分配的电磁阀总数量
const currentTotalValves = computed(() => {
return statusData.value.reduce((sum, cell) => sum + cell.count, 0);
return statusData.value.reduce((sum, cell) => sum + cell.valveNum, 0);
});
// 计算当前修改后的总数量
const projectedTotalValves = computed(() => {
// 找到当前修改的仓室
const selectedRoom = statusData.value.find(cell => cell.index === valveForm.value.roomNo);
const selectedRoom = statusData.value.find(cell => cell.compartNo === valveForm.value.compartNo);
if (!selectedRoom) return currentTotalValves.value;
// 计算替换后的总数
const diff = valveForm.value.valveCount - selectedRoom.count;
const diff = valveForm.value.valveNum - selectedRoom.valveNum;
return currentTotalValves.value + diff;
});
......@@ -156,28 +156,46 @@ const validateValveCount = computed(() => {
const initializeState = () => {
if (props.modelValue) {
console.log(props.data)
console.log(props.data);
valveForm.value.total = props.data.valveNum;
getAllocation({
customerId: props.data.customerId,
dusterNo: props.data.deviceNo
});
// valveForm.value.total = props.totalValves;
// statusData.value = [...props.statusData]; // 深拷贝状态数据
// errorMessage.value = "";
// // 如果有数据，默认选中第一个仓室
// if (statusData.value.length > 0) {
// valveForm.value.roomNo = statusData.value[0].index;
// valveForm.value.valveCount = statusData.value[0].count;
// valveForm.value.distribution = statusData.value[0].count; // 默认布阀数量等于电磁阀数量
// valveForm.value.compartNo = statusData.value[0].index;
// valveForm.value.valveNum = statusData.value[0].valveNum;
// valveForm.value.bagNum = statusData.value[0].valveNum; // 默认布阀数量等于电磁阀数量
// }
}
};
const getAllocation = (params) => {
getValveAllocation(params).then(res => {
console.log(res, res.data.valveList);
if (res.code === 1 && res.data.valveList.length > 0) {
statusData.value = res.data.valveList;
console.log(statusData.value);
valveForm.value.compartNo = statusData.value[0].compartNo;
valveForm.value.valveNum = statusData.value[0].valveNum;
valveForm.value.bagNum = statusData.value[0].bagNum;
}
})
}
// getToken("customerId"),
// 当选中的仓室改变时，更新电磁阀分布数量
const handleRoomChange = (roomIndex) => {
const selectedRoom = statusData.value.find(cell => cell.index === roomIndex);
const selectedRoom = statusData.value.find(cell => cell.compartNo === roomIndex);
if (selectedRoom) {
valveForm.value.valveCount = selectedRoom.count;
valveForm.value.distribution = selectedRoom.count;
valveForm.value.valveNum = selectedRoom.valveNum;
valveForm.value.bagNum = selectedRoom.bagNum;
errorMessage.value = "";
}
};
......@@ -189,7 +207,7 @@ watch(() => props.modelValue, (newVal) => {
}, { immediate: true });
// 监听阀门数量变化，实时验证
watch(() => valveForm.value.valveCount, () => {
watch(() => valveForm.value.valveNum, () => {
const validation = validateValveCount.value;
errorMessage.value = validation.valid ? "" : validation.message;
});
......@@ -208,28 +226,28 @@ const handleAverageDistribute = () => {
// 平均分配阀数量 多余的阀数量分配到前面的仓室
statusData.value.forEach((cell, index) => {
cell.count = baseValue + (index < remainder ? 1 : 0);
cell.valveNum = baseValue + (index < remainder ? 1 : 0);
});
// 更新当前选中仓室的值
handleRoomChange(valveForm.value.roomNo);
handleRoomChange(valveForm.value.compartNo);
errorMessage.value = ""; // 重置错误信息
};
const handleSave = () => {
// 验证是否超出限制
const validation = validateValveCount.value;
console.log(valveForm.value.valveCount);
console.log(valveForm.value.valveNum);
if (!validation.valid) {
errorMessage.value = validation.message;
return;
}
// 保存当前选中仓室的电磁阀分布数量
const selectedRoom = statusData.value.find(cell => cell.index === valveForm.value.roomNo);
const selectedRoom = statusData.value.find(cell => cell.compartNo === valveForm.value.compartNo);
if (selectedRoom) {
selectedRoom.count = valveForm.value.valveCount;
selectedRoom.valveNum = valveForm.value.valveNum;
selectedRoom.bagNum = valveForm.value.bagNum;
// 更新错误信息
errorMessage.value = "";
}
......@@ -237,14 +255,14 @@ const handleSave = () => {
const handleConfirm = () => {
// 最终确认时再次验证总数是否符合要求
const totalValves = statusData.value.reduce((sum, cell) => sum + cell.count, 0);
const totalValves = statusData.value.reduce((sum, cell) => sum + cell.valveNum, 0);
if (totalValves > valveForm.value.total) {
errorMessage.value = `电磁阀总数超出限制 ${totalValves - valveForm.value.total} 个，请调整后再提交`;
return;
}
emit("confirm", statusData.value);
emit("update:modelValue", false);
// emit("update:modelValue", false);
};
</script>
......@@ -296,7 +314,7 @@ const handleConfirm = () => {
}
}
.distribution-table {
.bagNum-table {
margin-top: 20px;
border-top: 1px solid #ebeef5;
padding-top: 20px;
......@@ -308,14 +326,14 @@ const handleConfirm = () => {
margin-bottom: 16px;
font-weight: 500;
.valve-count-info {
.valve-valveNum-info {
font-size: 12px;
color: #909399;
margin-left: 8px;
}
}
.valve-distribution-grid {
.valve-bagNum-grid {
display: flex;
flex-direction: column;
gap: 8px;
......@@ -332,7 +350,7 @@ const handleConfirm = () => {
.valve-cell {
width: 41px;
background: white;
padding: 4px;
padding: 4px 8px;
border-radius: 4px;
text-align: center;
border: 1px solid #dcdfe6;
......@@ -351,8 +369,16 @@ const handleConfirm = () => {
}
.cell-value {
font-size: 14px;
display: flex;
justify-content: center;
align-items: center;
font-size: 16px;
color: #606266;
span {
font-size: 12px;
color: #909399;
margin-left: 2px;
}
}
}
}
......
src/views/dustOverview/index.vue
View file @ b631dafc
......@@ -78,6 +78,7 @@
:columns="tableColumns"
:default-page-size="10"
@pagination-change="handlePaginationChange"
:total="total"
:pagination-texts="{
total: '共',
sizeChange: '条/页',
......@@ -166,7 +167,7 @@
<script setup>
import { ref, onMounted, onBeforeUnmount, computed, watch } from "vue";
import { getDusterLeakNum, getHealthPercent, getCloseLoopNum, getProductionLine, getDusterList, postAddDuster, postUpdateDuster, postAddCompartAllocation } from "@/request/api/dustOverview";
import { getDusterLeakNum, getHealthPercent, getCloseLoopNum, getProductionLine, getDusterList, postAddDuster, postUpdateDuster, postAddCompartAllocation, postAddValveInfo } from "@/request/api/dustOverview";
import { getToken } from "@/utils/auth";
import CommonTable from "@/components/commonTable/index.vue";
import { ElMessageBox, ElMessage } from "element-plus";
......@@ -181,6 +182,7 @@ const formInline = ref({
const currentPage = ref(1);
const pageSize = ref(10);
const total = ref(0);
const dusterLeakNum = ref(0);
const healthPercent = ref('100%');
const closeLoopNum = ref(0);
......@@ -305,7 +307,7 @@ const handleEdit = (row) => {
const handlePaginationChange = (pagination) => {
currentPage.value = pagination.currentPage;
pageSize.value = pagination.pageSize;
console.log("分页变化", pagination);
getData();
};
const onSubmit = () => {
......@@ -328,10 +330,8 @@ const handleHealthScoreClick = (row) => {
// 确认设置
const handleRoomSettingConfirm = (data) => {
console.log('data', data)
const params = data;
postAddCompartAllocation(params).then(res => {
console.log(res);
if (res.code == 1) {
ElMessage.success('更新仓室数量成功');
roomSettingVisible.value = false;
......@@ -345,38 +345,25 @@ const handleRoomSettingConfirm = (data) => {
// 点击电磁阀数量时打开弹窗
const handleValveNumClick = (row) => {
// 创建一个扁平化的状态数组用于电磁阀设置
currentEditingRow.value = JSON.parse(JSON.stringify(row));
// const flattenedStatus = row.status.flat().map(item => ({...item}));
// currentEditingRow.value.status = flattenedStatus;
// valveForm.value.total = row.valveNum;
valveSettingVisible.value = true;
if (row.compartHealthList.length > 0) {
currentEditingRow.value = JSON.parse(JSON.stringify(row));
valveSettingVisible.value = true;
} else {
ElMessage.error('当前仓室数量为0，无法进行设置');
}
};
// 确认电磁阀设置
const handleValveSettingConfirm = (updatedStatusData) => {
if (currentEditingRow.value && updatedStatusData) {
// 更新总数
const originalRow = tableData.find(item => item === currentEditingRow.value);
if (originalRow) {
originalRow.valveNum = valveForm.value.total;
// 更新各个仓室的电磁阀数量
const flatStatusMap = new Map();
updatedStatusData.forEach(cell => {
flatStatusMap.set(cell.index, cell.count);
});
// 将更新后的数量应用到原始的2D结构中
originalRow.status.forEach(row => {
row.forEach(chamber => {
if (flatStatusMap.has(chamber.index)) {
chamber.count = flatStatusMap.get(chamber.index);
}
});
});
const list = updatedStatusData.map(item => {
return {
"compartNo": item.compartNo,
"valveNum": item.valveNum,
"bagNum": item.bagNum,
"dusterNo": item.dusterNo
}
}
valveSettingVisible.value = false;
})
setValveInfo(list);
};
// 打开新增除尘器弹窗
......@@ -385,6 +372,18 @@ const handleAddDustCollector = () => {
isAddDustCollectorVisible.value = true;
};
const setValveInfo = (data) => {
postAddValveInfo(data).then(res => {
if (res.code == 1) {
ElMessage.success('更新电磁阀数量成功');
valveSettingVisible.value = false;
getData();
} else {
ElMessage.error(res.message);
}
})
}
// 保存新增或编辑除尘器
const handleSaveDustCollector = (data) => {
if (data.id) {
......@@ -453,10 +452,9 @@ const getData = () => {
keyword: formInline.value.deviceName,
}
getDusterList(params).then(res => {
console.log(res);
if (res.code == 1) {
tableData.value = res.data.records || [];
// total.value = res.data.total || 0;
total.value = res.data.total || 0;
} else {
ElMessage.error(res.message);
}
......
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment