feat: solar KPIs, version display, feature flags (v1.4.0)

New dashboard KPI cards:
- Performance Ratio (PR) with color thresholds
- Equivalent Utilization Hours
- Daily Revenue (¥)
- Self-Consumption Rate

Version display for field engineers:
- Login page footer: "v1.4.0 | Core: v1.4.0"
- Sidebar footer: version when expanded
- System Settings: full version breakdown

Backend (core sync):
- GET /api/v1/version (no auth) — reads VERSIONS.json
- GET /api/v1/kpi/solar — PR, revenue, equiv hours calculations
- Dashboard energy_today fallback from raw energy_data
- PV device filter includes sungrow_inverter type

Feature flags:
- Sidebar hides disabled features (charging, bigscreen_3d)

Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>

frontend/src/layouts/MainLayout.tsx

@@ -12,7 +12,7 @@ import {
 import { Outlet, useNavigate, useLocation } from 'react-router-dom';
 import { useTranslation } from 'react-i18next';
 import { getUser, removeToken } from '../utils/auth';
-import { getAlarmStats, getAlarmEvents, getBranding } from '../services/api';
+import { getAlarmStats, getAlarmEvents, getBranding, getVersion } from '../services/api';
 import { useTheme } from '../contexts/ThemeContext';
 
 const { Header, Sider, Content } = Layout;
@@ -29,6 +29,7 @@ export default function MainLayout() {
   const [alarmCount, setAlarmCount] = useState(0);
   const [recentAlarms, setRecentAlarms] = useState<any[]>([]);
   const [features, setFeatures] = useState<Record<string, boolean>>({});
+  const [versionInfo, setVersionInfo] = useState<any>(null);
   const navigate = useNavigate();
   const location = useLocation();
   const user = getUser();
@@ -39,6 +40,7 @@ export default function MainLayout() {
     getBranding().then((res: any) => {
       setFeatures(res?.features || {});
     }).catch(() => {});
+    getVersion().then(setVersionInfo).catch(() => {});
   }, []);
 
   // Map feature flags to menu keys that should be hidden when the feature is disabled
@@ -172,6 +174,14 @@ export default function MainLayout() {
             }
           }}
         />
+        {!collapsed && versionInfo && (
+          <div style={{
+            padding: '8px 16px', fontSize: 11, color: 'rgba(255,255,255,0.3)',
+            borderTop: '1px solid rgba(255,255,255,0.06)', textAlign: 'center',
+          }}>
+            v{versionInfo.project_version}
+          </div>
+        )}
       </Sider>
       <Layout>
         <Header style={{

frontend/src/pages/Dashboard/index.tsx

@@ -4,7 +4,7 @@ import {
   ThunderboltOutlined, FireOutlined, CloudOutlined, AlertOutlined,
   WarningOutlined, CloseCircleOutlined,
 } from '@ant-design/icons';
-import { getDashboardOverview, getRealtimeData, getLoadCurve } from '../../services/api';
+import { getDashboardOverview, getRealtimeData, getLoadCurve, getSolarKpis } from '../../services/api';
 import EnergyOverview from './components/EnergyOverview';
 import PowerGeneration from './components/PowerGeneration';
 import LoadCurve from './components/LoadCurve';
@@ -18,6 +18,7 @@ export default function Dashboard() {
   const [realtime, setRealtime] = useState<any>(null);
   const [loadData, setLoadData] = useState<any[]>([]);
   const [loading, setLoading] = useState(true);
+  const [kpis, setKpis] = useState<any>(null);
 
   const fetchData = async () => {
     try {
@@ -42,6 +43,14 @@ export default function Dashboard() {
     return () => clearInterval(timer);
   }, []);
 
+  useEffect(() => {
+    getSolarKpis().then(setKpis).catch(() => {});
+    const timer = setInterval(() => {
+      getSolarKpis().then(setKpis).catch(() => {});
+    }, 60000);
+    return () => clearInterval(timer);
+  }, []);
+
   if (loading) return <Spin size="large" style={{ display: 'block', margin: '200px auto' }} />;
 
   const ds = overview?.device_stats || {};
@@ -84,6 +93,51 @@ export default function Dashboard() {
         </Col>
       </Row>
 
+      {/* 光伏 KPI */}
+      <Row gutter={[16, 16]} style={{ marginTop: 16 }}>
+        <Col xs={24} sm={12} lg={6}>
+          <Card size="small">
+            <Statistic
+              title="性能比 (PR)"
+              value={kpis?.pr || 0}
+              suffix="%"
+              valueStyle={{ color: (kpis?.pr || 0) > 75 ? '#52c41a' : (kpis?.pr || 0) > 50 ? '#faad14' : '#f5222d' }}
+            />
+          </Card>
+        </Col>
+        <Col xs={24} sm={12} lg={6}>
+          <Card size="small">
+            <Statistic
+              title="等效利用小时"
+              value={kpis?.equivalent_hours || 0}
+              suffix="h"
+              precision={1}
+            />
+          </Card>
+        </Col>
+        <Col xs={24} sm={12} lg={6}>
+          <Card size="small">
+            <Statistic
+              title="今日收益"
+              value={kpis?.revenue_today || 0}
+              prefix="¥"
+              precision={0}
+              valueStyle={{ color: '#52c41a' }}
+            />
+          </Card>
+        </Col>
+        <Col xs={24} sm={12} lg={6}>
+          <Card size="small">
+            <Statistic
+              title="自消纳率"
+              value={kpis?.self_consumption_rate || 0}
+              suffix="%"
+              valueStyle={{ color: '#52c41a' }}
+            />
+          </Card>
+        </Col>
+      </Row>
+
       {/* 图表区域 */}
       <Row gutter={[16, 16]} style={{ marginTop: 16 }}>
         <Col xs={24} lg={16}>

frontend/src/pages/Login/index.tsx

@@ -1,8 +1,8 @@
-import { useState } from 'react';
+import { useState, useEffect } from 'react';
 import { Form, Input, Button, Card, message, Typography } from 'antd';
 import { UserOutlined, LockOutlined, ThunderboltOutlined } from '@ant-design/icons';
 import { useNavigate } from 'react-router-dom';
-import { login } from '../../services/api';
+import { login, getVersion } from '../../services/api';
 import { setToken, setUser } from '../../utils/auth';
 
 const { Title, Text } = Typography;
@@ -10,8 +10,13 @@ const { Title, Text } = Typography;
 export default function LoginPage() {
   const [loading, setLoading] = useState(false);
   const [guestLoading, setGuestLoading] = useState(false);
+  const [versionInfo, setVersionInfo] = useState<any>(null);
   const navigate = useNavigate();
 
+  useEffect(() => {
+    getVersion().then(setVersionInfo).catch(() => {});
+  }, []);
+
   const doLogin = async (username: string, password: string) => {
     const res: any = await login(username, password);
     setToken(res.access_token);
@@ -82,6 +87,11 @@ export default function LoginPage() {
             </Text>
           </div>
         </Form>
+        {versionInfo && (
+          <div style={{ textAlign: 'center', marginTop: 16, opacity: 0.4, fontSize: 11 }}>
+            v{versionInfo.project_version} | Core: v{versionInfo.core_version || '—'}
+          </div>
+        )}
       </Card>
     </div>
   );

frontend/src/pages/System/Settings.tsx

@@ -1,7 +1,7 @@
 import { useEffect, useState } from 'react';
-import { Card, Form, Input, InputNumber, Switch, Select, Button, message, Spin, Row, Col } from 'antd';
+import { Card, Form, Input, InputNumber, Switch, Select, Button, message, Spin, Row, Col, Descriptions } from 'antd';
 import { SaveOutlined } from '@ant-design/icons';
-import { getSettings, updateSettings } from '../../services/api';
+import { getSettings, updateSettings, getVersion } from '../../services/api';
 import { getUser } from '../../utils/auth';
 
 const TIMEZONE_OPTIONS = [
@@ -17,11 +17,13 @@ export default function SystemSettings() {
   const [form] = Form.useForm();
   const [loading, setLoading] = useState(true);
   const [saving, setSaving] = useState(false);
+  const [versionInfo, setVersionInfo] = useState<any>(null);
   const user = getUser();
   const isAdmin = user?.role === 'admin';
 
   useEffect(() => {
     loadSettings();
+    getVersion().then(setVersionInfo).catch(() => {});
   }, []);
 
   const loadSettings = async () => {
@@ -105,6 +107,18 @@ export default function SystemSettings() {
           </Button>
         </div>
       )}
+
+      {versionInfo && (
+        <Card title="平台版本信息" size="small" style={{ marginTop: 16 }}>
+          <Descriptions column={2} size="small">
+            <Descriptions.Item label="项目">zpark-ems</Descriptions.Item>
+            <Descriptions.Item label="版本">{versionInfo.project_version || '—'}</Descriptions.Item>
+            <Descriptions.Item label="Core 版本">{versionInfo.core_version || '—'}</Descriptions.Item>
+            <Descriptions.Item label="前端模板">{versionInfo.frontend_template_version || '—'}</Descriptions.Item>
+            <Descriptions.Item label="最后更新">{versionInfo.last_updated || '—'}</Descriptions.Item>
+          </Descriptions>
+        </Card>
+      )}
     </Form>
   );
 }

frontend/src/services/api.ts

@@ -24,6 +24,12 @@ api.interceptors.response.use(
   }
 );
 
+// Version info (no auth needed)
+export const getVersion = () => api.get('/version');
+
+// Solar KPIs
+export const getSolarKpis = () => api.get('/kpi/solar');
+
 // Branding
 export const getBranding = () => api.get('/branding');