Kaynağa Gözat

fix: 修改图表

sun-chaochao 3 yıl önce
ebeveyn
işleme
d12ae39cfd

+ 2 - 1
src/pages/account/NotificationSubscription/index.tsx

@@ -96,6 +96,7 @@ const NotificationSubscription = observer(() => {
         type={'link'}
         isPermission={true}
         style={{ padding: 0 }}
+        disabled={record?.state?.value !== 'disabled'}
         popConfirm={{
           title: '确认删除?',
           onConfirm: async () => {
@@ -109,7 +110,7 @@ const NotificationSubscription = observer(() => {
           },
         }}
         tooltip={{
-          title: '删除',
+          title: record?.state?.value !== 'disabled' ? '请先禁用,再删除' : '删除',
         }}
       >
         <DeleteOutlined />

+ 12 - 34
src/pages/device/Instance/Detail/MetadataLog/Property/index.tsx

@@ -5,12 +5,11 @@ import type { PropertyMetadata } from '@/pages/device/Product/typings';
 import encodeQuery from '@/utils/encodeQuery';
 import { useEffect, useState } from 'react';
 import moment from 'moment';
-import { Axis, Chart, Geom, Legend, Slider, Tooltip } from 'bizcharts';
+import { Axis, Chart, LineAdvance, Legend, Slider, Tooltip, Point } from 'bizcharts';
 import FileComponent from '../../Running/Property/FileComponent';
 import { DownloadOutlined, SearchOutlined } from '@ant-design/icons';
 import Detail from './Detail';
 import AMap from './AMap';
-
 interface Props {
   close: () => void;
   data: Partial<PropertyMetadata>;
@@ -170,6 +169,7 @@ const PropertyLog = (props: Props) => {
       const dataList: any[] = [];
       resp.result.forEach((i: any) => {
         dataList.push({
+          ...i,
           year: moment(i.time).format('YYYY-MM-DD HH:mm:ss'),
           value: Number(i[data.id || '']),
           type: data?.name || '',
@@ -189,9 +189,10 @@ const PropertyLog = (props: Props) => {
   const scale = {
     value: { min: 0 },
     year: {
-      range: [0, 1],
-      type: 'timeCat',
+      type: 'time',
       mask: 'YYYY-MM-DD HH:mm:ss',
+      max: end,
+      min: start,
     },
   };
 
@@ -215,7 +216,7 @@ const PropertyLog = (props: Props) => {
             dataSource={dataSource?.data || []}
             columns={data?.valueType?.type === 'geoPoint' ? geoColumns : columns}
             pagination={{
-              current: dataSource?.pageIndex + 1,
+              current: (dataSource?.pageIndex || 0) + 1,
               pageSize: dataSource?.pageSize || 10,
               showSizeChanger: true,
               total: dataSource?.total || 0,
@@ -297,8 +298,8 @@ const PropertyLog = (props: Props) => {
                 </div>
               )}
             </div>
-            <div style={{ paddingTop: 15 }}>
-              <Chart height={400} data={chartsList} scale={scale} autoFit>
+            <div style={{ marginTop: 10 }}>
+              <Chart height={400} data={chartsList} scale={scale} padding="auto" autoFit>
                 <Legend />
                 <Axis name="year" />
                 <Axis
@@ -307,33 +308,9 @@ const PropertyLog = (props: Props) => {
                     formatter: (val) => parseFloat(val).toLocaleString(),
                   }}
                 />
-                <Tooltip showCrosshairs shared />
-                <Geom
-                  type="line"
-                  tooltip={[
-                    'value*type',
-                    (value, name) => {
-                      return {
-                        value: value,
-                        name,
-                      };
-                    },
-                  ]}
-                  position="year*value"
-                  size={2}
-                />
-                <Geom
-                  type="point"
-                  tooltip={false}
-                  position="year*value"
-                  size={4}
-                  shape={'circle'}
-                  style={{
-                    stroke: '#fff',
-                    lineWidth: 1,
-                  }}
-                />
-                <Geom type="area" position="year*value" shape={'circle'} tooltip={false} />
+                <Tooltip shared />
+                <Point position="year*value" />
+                <LineAdvance position="year*value" shape="smooth" area />
                 <Slider />
               </Chart>
             </div>
@@ -390,6 +367,7 @@ const PropertyLog = (props: Props) => {
           }
         });
     }
+    setDateValue([moment(start), moment(end)]);
   }, [start, end]);
 
   // @ts-ignore