From baaf4dafdff13110150a670da6ad384f0810ec3f Mon Sep 17 00:00:00 2001
From: vincentlu <t1341870251@gmail.com>
Date: 星期三, 17 十二月 2025 15:39:49 +0800
Subject: [PATCH] #

---
 zy-acs-flow/src/i18n/en.js       |    2 
 zy-acs-flow/src/i18n/zh.js       |    2 
 zy-acs-flow/src/map/AreaList.jsx |  117 +++++++++++++++++++++-----------------
 3 files changed, 68 insertions(+), 53 deletions(-)

diff --git a/zy-acs-flow/src/i18n/en.js b/zy-acs-flow/src/i18n/en.js
index 509406d..7e1a863 100644
--- a/zy-acs-flow/src/i18n/en.js
+++ b/zy-acs-flow/src/i18n/en.js
@@ -780,6 +780,8 @@
                     endY: 'End Y',
                     memo: 'Memo',
                     priority: 'Priority',
+                    agvCount: 'AGV 路 %{count}',
+                    areaSize: 'Area %{size} 銕�',
                 },
                 confirm: {
                     save: 'Save current changes?',
diff --git a/zy-acs-flow/src/i18n/zh.js b/zy-acs-flow/src/i18n/zh.js
index 00d03ba..27d4219 100644
--- a/zy-acs-flow/src/i18n/zh.js
+++ b/zy-acs-flow/src/i18n/zh.js
@@ -780,6 +780,8 @@
                     endY: '缁堢偣 Y',
                     memo: '澶囨敞',
                     priority: '浼樺厛绾�',
+                    agvCount: 'AGV 路 %{count}',
+                    areaSize: '鍗犲湴 %{size} 銕�',
                 },
                 confirm: {
                     save: '纭淇濆瓨褰撳墠淇敼锛�',
diff --git a/zy-acs-flow/src/map/AreaList.jsx b/zy-acs-flow/src/map/AreaList.jsx
index 10bf763..4fe41e1 100644
--- a/zy-acs-flow/src/map/AreaList.jsx
+++ b/zy-acs-flow/src/map/AreaList.jsx
@@ -38,7 +38,7 @@
         fetchAreaList(zoneId)
             .then((list) => {
                 console.log(list);
-                
+
                 setAreas(Array.isArray(list) ? list : []);
             })
             .finally(() => setLoading(false));
@@ -79,61 +79,72 @@
                                         {translate('page.map.area.form.codesEmpty')}
                                     </Typography>
                                 )}
-                                {areas.map((area) => (
-                                    <ListItemButton
-                                        key={area.id}
-                                        onClick={() => handleItemClick(area)}
-                                        sx={{
-                                            borderRadius: 2,
-                                            mb: 1,
-                                            px: 2,
-                                            py: 1.5,
-                                            background:
-                                                themeMode === 'light'
-                                                    ? 'linear-gradient(145deg, #f8f9fa, #ffffff)'
-                                                    : 'linear-gradient(145deg, #2d3436, #353b48)',
-                                            border: `1px solid ${theme.palette.divider}`,
-                                            display: 'flex',
-                                            gap: 1.5,
-                                            alignItems: 'center',
-                                            transition: 'transform 0.2s ease, box-shadow 0.2s ease',
-                                            boxShadow:
-                                                themeMode === 'light'
-                                                    ? '0 6px 12px rgba(0,0,0,0.06)'
-                                                    : '0 6px 12px rgba(0,0,0,0.25)',
-                                            '&:hover': {
-                                                transform: 'translateY(-2px)',
+                                {areas.map((area) => {
+                                    const agvCount = Array.isArray(area.agvList) ? area.agvList.length : 0;
+                                    const width = Math.abs((area?.end?.x ?? 0) - (area?.start?.x ?? 0));
+                                    const height = Math.abs((area?.end?.y ?? 0) - (area?.start?.y ?? 0));
+                                    const areaSize = (width * height) / 1_000_000;
+                                    const formattedSize = areaSize > 0 ? areaSize.toFixed(2) : '0.00';
+                                    return (
+                                        <ListItemButton
+                                            key={area.id}
+                                            onClick={() => handleItemClick(area)}
+                                            sx={{
+                                                borderRadius: 2,
+                                                mb: 1,
+                                                px: 2,
+                                                py: 1.5,
+                                                background:
+                                                    themeMode === 'light'
+                                                        ? 'linear-gradient(145deg, #f8f9fa, #ffffff)'
+                                                        : 'linear-gradient(145deg, #2d3436, #353b48)',
+                                                border: `1px solid ${theme.palette.divider}`,
+                                                display: 'flex',
+                                                gap: 1.5,
+                                                alignItems: 'center',
+                                                justifyContent: 'space-between',
+                                                transition: 'transform 0.2s ease, box-shadow 0.2s ease',
                                                 boxShadow:
                                                     themeMode === 'light'
-                                                        ? '0 12px 24px rgba(0,0,0,0.08)'
-                                                        : '0 12px 24px rgba(0,0,0,0.35)',
-                                            },
-                                        }}
-                                    >
-                                        <Box
-                                            sx={{
-                                                width: 12,
-                                                height: 12,
-                                                borderRadius: '50%',
-                                                bgcolor: area.color ? Number(area.color) : theme.palette.info.light,
-                                                border: `1px solid ${theme.palette.common.white}`,
-                                                boxShadow: '0 0 4px rgba(0,0,0,0.2)',
+                                                        ? '0 6px 12px rgba(0,0,0,0.06)'
+                                                        : '0 6px 12px rgba(0,0,0,0.25)',
+                                                '&:hover': {
+                                                    transform: 'translateY(-2px)',
+                                                    boxShadow:
+                                                        themeMode === 'light'
+                                                            ? '0 12px 24px rgba(0,0,0,0.08)'
+                                                            : '0 12px 24px rgba(0,0,0,0.35)',
+                                                },
                                             }}
-                                        />
-                                        <ListItemText
-                                            primary={area.name || translate('page.map.area.form.name')}
-                                            // secondary={area.code ? `${translate('page.map.area.form.code')}: ${area.code}` : ''}
-                                            primaryTypographyProps={{
-                                                fontWeight: 600,
-                                                fontSize: 16,
-                                            }}
-                                            secondaryTypographyProps={{
-                                                color: theme.palette.text.secondary,
-                                                fontSize: 12,
-                                            }}
-                                        />
-                                    </ListItemButton>
-                                ))}
+                                        >
+                                            <Box
+                                                sx={{
+                                                    width: 12,
+                                                    height: 12,
+                                                    borderRadius: '50%',
+                                                    bgcolor: area.color ? Number(area.color) : theme.palette.info.light,
+                                                    border: `1px solid ${theme.palette.common.white}`,
+                                                    boxShadow: '0 0 4px rgba(0,0,0,0.2)',
+                                                }}
+                                            />
+                                            <ListItemText
+                                                primary={area.name || translate('page.map.area.form.name')}
+                                                primaryTypographyProps={{
+                                                    fontWeight: 600,
+                                                    fontSize: 16,
+                                                }}
+                                            />
+                                            <Box textAlign="right">
+                                                <Typography variant="body2" fontWeight={500}>
+                                                    {translate('page.map.area.form.agvCount', { count: agvCount })}
+                                                </Typography>
+                                                <Typography variant="caption" color="text.secondary">
+                                                    {translate('page.map.area.form.areaSize', { size: formattedSize })}
+                                                </Typography>
+                                            </Box>
+                                        </ListItemButton>
+                                    );
+                                })}
                             </List>
                         )}
                     </Box>

--
Gitblit v1.9.1