Browse Source

update:高级配置在 TargetDetailModal 中默认收起

refactor:RealtimeCharts 设备颜色映射逻辑简化为基于下标选择
fix:CameraView 中 hasAdvancedConfig 统一设为 false,保证行为一致
master
qinjian 4 days ago
parent
commit
4341649263
  1. 2
      client/src/sections/wuyuanbiaoba/components/CameraView.jsx
  2. 49
      client/src/sections/wuyuanbiaoba/components/RealtimeCharts.jsx
  3. 3
      client/src/sections/wuyuanbiaoba/components/TargetDetailModal.jsx

2
client/src/sections/wuyuanbiaoba/components/CameraView.jsx

@ -298,7 +298,7 @@ const CameraView = ({
anchorThreshold: selectedTemplate.anchorThresholdValue || 80, anchorThreshold: selectedTemplate.anchorThresholdValue || 80,
gaussianBlurThreshold: selectedTemplate.gaussianBlur || 3, gaussianBlurThreshold: selectedTemplate.gaussianBlur || 3,
binaryThreshold: selectedTemplate.binaryThreshold || 120, binaryThreshold: selectedTemplate.binaryThreshold || 120,
hasAdvancedConfig: true, hasAdvancedConfig: false,
} }
: { : {
// //

49
client/src/sections/wuyuanbiaoba/components/RealtimeCharts.jsx

@ -37,22 +37,19 @@ const RealtimeCharts = ({ tableData, lastUpdateTime }) => {
return <div>数据格式错误</div>; return <div>数据格式错误</div>;
} }
// // - 使
const getDeviceColor = (deviceDesc) => { const getDeviceColor = (index) => {
const colorMap = { // 55线
target1: "#52c41a", // 绿 const colors = [
target2: "#faad14", // "#52c41a", // 绿
target3: "#f5222d", // "#faad14", //
target4: "#722ed1", // "#f5222d", //
target5: "#fa8c16", // "#722ed1", //
target6: "#13c2c2", // "#13c2c2", //
target7: "#eb2f96", // ];
target8: "#2f54eb", //
target9: "#fa541c", // // 使
target10: "#1890ff", // return colors[index % colors.length];
};
return colorMap[deviceDesc] || "#1890ff";
}; };
// - 25 // - 25
@ -204,7 +201,7 @@ const RealtimeCharts = ({ tableData, lastUpdateTime }) => {
return { labels: [], datasets: [] }; return { labels: [], datasets: [] };
} }
const datasets = deviceIds.map((deviceId) => { const datasets = deviceIds.map((deviceId, index) => {
const data = sortedTimes.map((timeKey) => { const data = sortedTimes.map((timeKey) => {
const timeData = timeGroups[timeKey] || []; const timeData = timeGroups[timeKey] || [];
const deviceData = timeData.find( const deviceData = timeData.find(
@ -219,8 +216,8 @@ const RealtimeCharts = ({ tableData, lastUpdateTime }) => {
return { return {
label: deviceId, label: deviceId,
data: data, data: data,
borderColor: getDeviceColor(deviceDesc), borderColor: getDeviceColor(index),
backgroundColor: getDeviceColor(deviceDesc) + "20", backgroundColor: getDeviceColor(index) + "20",
borderWidth: 2, borderWidth: 2,
pointRadius: 3, pointRadius: 3,
pointHoverRadius: 5, pointHoverRadius: 5,
@ -247,7 +244,7 @@ const RealtimeCharts = ({ tableData, lastUpdateTime }) => {
return { labels: [], datasets: [] }; return { labels: [], datasets: [] };
} }
const datasets = deviceIds.map((deviceId) => { const datasets = deviceIds.map((deviceId, index) => {
const data = sortedTimes.map((timeKey) => { const data = sortedTimes.map((timeKey) => {
const timeData = timeGroups[timeKey] || []; const timeData = timeGroups[timeKey] || [];
const deviceData = timeData.find( const deviceData = timeData.find(
@ -262,8 +259,8 @@ const RealtimeCharts = ({ tableData, lastUpdateTime }) => {
return { return {
label: deviceId, label: deviceId,
data: data, data: data,
borderColor: getDeviceColor(deviceDesc), borderColor: getDeviceColor(index),
backgroundColor: getDeviceColor(deviceDesc) + "20", backgroundColor: getDeviceColor(index) + "20",
borderWidth: 2, borderWidth: 2,
pointRadius: 3, pointRadius: 3,
pointHoverRadius: 5, pointHoverRadius: 5,
@ -476,15 +473,15 @@ const RealtimeCharts = ({ tableData, lastUpdateTime }) => {
> >
全部隐藏 全部隐藏
</Button> </Button>
{deviceIds.map((deviceId,index) => ( {deviceIds.map((deviceId, index) => (
<Button <Button
key={deviceId} key={deviceId}
size="small" size="small"
type={visibleTargets[deviceId] ? "primary" : "default"} type={visibleTargets[deviceId] ? "primary" : "default"}
style={{ style={{
borderColor: getDeviceColor(deviceDescMap[deviceId] || deviceId), borderColor: getDeviceColor(index),
color: visibleTargets[deviceId] ? "#fff" : getDeviceColor(deviceDescMap[deviceId] || deviceId), color: visibleTargets[deviceId] ? "#fff" : getDeviceColor(index),
backgroundColor: visibleTargets[deviceId] ? getDeviceColor(deviceDescMap[deviceId] || deviceId) : "#fff" backgroundColor: visibleTargets[deviceId] ? getDeviceColor(index) : "#fff"
}} }}
onClick={() => toggleTargetVisibility(deviceId)} onClick={() => toggleTargetVisibility(deviceId)}
> >

3
client/src/sections/wuyuanbiaoba/components/TargetDetailModal.jsx

@ -38,7 +38,8 @@ const TargetDetailModal = ({
anchorThreshold: targetData.anchorThreshold || 80, anchorThreshold: targetData.anchorThreshold || 80,
gaussianBlurThreshold: targetData.gaussianBlurThreshold || 3, gaussianBlurThreshold: targetData.gaussianBlurThreshold || 3,
}); });
setAdvancedConfig(targetData.hasAdvancedConfig || false); //
setAdvancedConfig(false);
} else if (visible && mode === "add") { } else if (visible && mode === "add") {
// //
form.setFieldsValue({ form.setFieldsValue({

Loading…
Cancel
Save