@vtx/modals2 2.6.19 → 2.6.21

package/src/vtx-car-modal/components/AlarmInfo/List.tsx

@@ -1,155 +0,0 @@
-/**
- * 报警信息-列表
- */
-
-import React, { useEffect } from 'react';
-import { useSetState } from 'ahooks';
-import VMTable from '../../../vm-table';
-import { SubTabsLine } from '../../../vm-sub-tabs';
-import { AlarmService } from '../../api';
-interface ListProps {
-    id: string;
-    carCode: string;
-    startDate: string;
-    endDate: string;
-}
-
-interface alarmType {
-    alarmType: string;
-    alarmTypeName: string;
-    totalCount: number;
-}
-
-interface AlarmTabs {
-    key: string;
-    label: string;
-}
-
-interface PaginationType {
-    current: number;
-    pageSize: number;
-    total: number;
-}
-interface StateType {
-    alarmStrategyName: string;
-    alarmTabs: Array<AlarmTabs>;
-    pagination: PaginationType;
-}
-
-const List = (props: ListProps) => {
-    const { id, carCode, startDate, endDate } = props;
-    const [state, setState] = useSetState<StateType>({
-        alarmStrategyName: 'all',
-        alarmTabs: [],
-        pagination: {
-            current: 1,
-            pageSize: 10,
-            total: 0,
-        },
-    });
-    const { alarmTabs, alarmStrategyName, pagination } = state;
-    const { alarmTypes } = AlarmService.useAlarmType(id, startDate, endDate);
-    const { alarmRecord } = AlarmService.useAlarmList(
-        carCode,
-        alarmStrategyName === 'all' ? '' : alarmStrategyName,
-        startDate,
-        endDate,
-        pagination.current,
-    );
-
-    useEffect(() => {
-        if (Array.isArray(alarmTypes?.summary) && alarmTypes.summary.length > 0) {
-            let alarmTabs: AlarmTabs[] = [
-                { key: 'all', label: `全部(${alarmTypes?.totalCount || 0})` },
-            ];
-            alarmTypes?.summary.forEach((ele: alarmType) => {
-                alarmTabs.push({
-                    key: ele.alarmType,
-                    label: `${ele.alarmTypeName}(${ele.totalCount})`,
-                });
-            });
-            setState({
-                alarmTabs: alarmTabs,
-            });
-        }
-    }, [alarmTypes]);
-
-    const columns = [
-        {
-            title: '报警类型',
-            dataIndex: 'type',
-            key: 'type',
-        },
-        {
-            title: '报警等级',
-            dataIndex: 'productName',
-            key: 'productName',
-        },
-        {
-            title: '报警开始时间',
-            dataIndex: 'sourceUnit',
-            key: 'sourceUnit',
-        },
-        {
-            title: '报警结束时间',
-            dataIndex: 'area',
-            key: 'area',
-        },
-        {
-            title: '报警时长',
-            dataIndex: 'grossWeight',
-            key: 'grossWeight',
-        },
-        {
-            title: '当前速度(km/h)',
-            dataIndex: 'tareWeight',
-            key: 'tareWeight',
-        },
-        {
-            title: '报警地址',
-            dataIndex: 'netWeight',
-            key: 'netWeight',
-        },
-    ];
-
-    const pageChange = (page: number) => {
-        setState({
-            pagination: {
-                ...pagination,
-                current: page,
-            },
-        });
-    };
-
-    const tableProps = {
-        pagination: {
-            ...pagination,
-            total: alarmRecord?.total || 0,
-            defaultPageSize: 10,
-            onChange: pageChange,
-        },
-        height: 440,
-        dataSource: alarmRecord?.rows || [],
-    };
-
-    return (
-        <div className="car-main-list">
-            {alarmTabs?.length > 0 && (
-                <SubTabsLine
-                    items={alarmTabs}
-                    activeKey={alarmStrategyName}
-                    onChange={key => {
-                        setState({
-                            alarmStrategyName: key,
-                        });
-                    }}
-                />
-            )}
-            <div>
-                <VMTable columns={columns} rowKey="id" {...tableProps} />
-            </div>
-        </div>
-    );
-};
-
-export default List;

package/src/vtx-car-modal/components/AlarmInfo/index.less

@@ -1,22 +0,0 @@
-.car-alarm {
-    padding: 10px;
-
-    .car-main {
-        padding: 11px 16px;
-        background-color: var(--bg-color2);
-        min-height: 500px;
-
-        .car-head{
-            display: flex;
-            justify-content: space-between;
-            align-items: center;
-        }
-        &-list {
-            min-height: 550px;
-        }
-    }
-    &-charts {
-        margin: 24px auto;
-        text-align: center;
-    }
-}

package/src/vtx-car-modal/components/AlarmInfo/index.tsx

@@ -1,132 +0,0 @@
-/**
- * 车辆-报警信息
- */
-
-import React from 'react';
-import { useSetState } from 'ahooks';
-import moment from 'moment';
-import { VMRangePicker } from '../../../vm-filter';
-import SubTabs, { SubTabPane } from '../../../vm-sub-tabs';
-import Charts from './Charts';
-import List from './List';
-import useSettings from '../../../vm-hooks/useSettings';
-import { BaseService } from '../../api';
-import './index.less';
-
-import chart from '../../../vm-appraisal-info/imgs/chart.png';
-import chartActive from '../../../vm-appraisal-info/imgs/chart_active.png';
-import chartActiveLight from '../../../vm-appraisal-info/imgs/chart_active_light.png';
-import list from '../../../vm-appraisal-info/imgs/list.png';
-import listActive from '../../../vm-appraisal-info/imgs/list_active.png';
-import listActiveLight from '../../../vm-appraisal-info/imgs/list_active_light.png';
-
-interface CarAlarmTypes {
-    id: string;
-    carCode: string;
-}
-
-const CarAlarmInfo: React.FC<CarAlarmTypes> = props => {
-    const { id, carCode } = props;
-    const { isDark } = useSettings();
-    const [state, setState] = useSetState({
-        startDate: moment()
-            .startOf('M')
-            .format('YYYY-MM-DD'),
-        endDate: moment().format('YYYY-MM-DD'),
-        tabKey: '1',
-    });
-    const { startDate, endDate, tabKey } = state;
-
-    const { todayRunRes } = BaseService.useTodayRun(id, startDate, endDate);
-
-    const handleDateChange = (start: string, end: string) => {
-        setState({
-            startDate: start,
-            endDate: end,
-        });
-    };
-
-    return (
-        <div className="car-alarm">
-            <div className="car-main">
-                <div className="car-head">
-                    <SubTabs
-                        onChange={(key: string) => {
-                            setState({
-                                tabKey: key,
-                            });
-                        }}
-                        activeKey={tabKey}
-                    >
-                        {[
-                            {
-                                name: (
-                                    <div>
-                                        <img
-                                            src={
-                                                tabKey === '1'
-                                                    ? isDark
-                                                        ? listActive
-                                                        : listActiveLight
-                                                    : list
-                                            }
-                                        />
-                                        图表
-                                    </div>
-                                ),
-                                key: '1',
-                            },
-                            {
-                                name: (
-                                    <div>
-                                        <img
-                                            src={
-                                                tabKey === '2'
-                                                    ? isDark
-                                                        ? chartActive
-                                                        : chartActiveLight
-                                                    : chart
-                                            }
-                                        />
-                                        列表
-                                    </div>
-                                ),
-                                key: '2',
-                            },
-                        ].map((ele: any) => (
-                            <SubTabPane subKey={ele.key} key={ele.key} tab={ele.name} />
-                        ))}
-                    </SubTabs>
-                    <div className="car-head-date">
-                        <VMRangePicker
-                            value={[moment(startDate), moment(endDate)]}
-                            onChange={(dates: any) =>
-                                dates &&
-                                handleDateChange(
-                                    moment(dates[0]).format('YYYY-MM-DD'),
-                                    moment(dates[1]).format('YYYY-MM-DD'),
-                                )
-                            }
-                        />
-                    </div>
-                </div>
-                {tabKey === '1' && (
-                    <Charts
-                        pieData={todayRunRes?.alarmGroupByType?.items || []}
-                        lineData={todayRunRes?.alarmGroupByDayChart || {}}
-                    />
-                )}
-                {tabKey === '2' && (
-                    <List
-                        id={id}
-                        carCode={carCode}
-                        startDate={`${startDate} 00:00:00`}
-                        endDate={`${endDate} 23:59:59`}
-                    />
-                )}
-            </div>
-        </div>
-    );
-};
-
-export default CarAlarmInfo;

package/src/vtx-car-modal/components/BaseInfo/Charts.tsx

@@ -1,84 +0,0 @@
-/**
- * 左侧统计图片
- */
-
-import React from 'react';
-import moment from 'moment';
-import useSettings from '../../../vm-hooks/useSettings';
-import { BaseService } from '../../api';
-
-import dqsd from '../../imgs/dqsd.png';
-import syyl from '../../imgs/syyl.png';
-import jrxs from '../../imgs/jrxs.png';
-
-import dqsdLight from '../../imgs/dqsd_light.png';
-import syylLight from '../../imgs/syyl_light.png';
-import jrxsLight from '../../imgs/jrxs_light.png';
-
-interface ChartsProps {
-    id: string;
-    mileage: number;
-    gpsSpeed: number;
-}
-
-export default function Charts({ id, mileage, gpsSpeed }: ChartsProps) {
-    const { isDark } = useSettings();
-    const { dailySummaryJxh } = BaseService.useDailySummaryJxh(id, moment().format('YYYY-MM-DD'));
-    return (
-        <>
-            <div className="car-base-left--charts">
-                <div className="car-base-left--charts-item">
-                    <div className="car-base-left--charts-item-chart">
-                        <img src={isDark ? dqsd : dqsdLight} />
-                    </div>
-                    <div>
-                        <div className="car-base-left--charts-item-name">当前速度</div>
-                        <div className="car-base-left--charts-item-value">
-                            <span>{gpsSpeed}</span>km/h
-                        </div>
-                    </div>
-                </div>
-                <div className="car-base-left--charts-item">
-                    <div className="car-base-left--charts-item-chart">
-                        <img src={isDark ? syyl : syylLight} />
-                    </div>
-                    <div>
-                        <div className="car-base-left--charts-item-name">剩余油量</div>
-                        <div className="car-base-left--charts-item-value">
-                            <span>30</span>L
-                        </div>
-                    </div>
-                </div>
-            </div>
-            <div className="car-base-left-jrxs">
-                <div>
-                    <img src={isDark ? jrxs : jrxsLight} />
-                </div>
-                <div className="car-base-left-jrxs-right">
-                    <div>
-                        <div className="jrxs-name">今日行驶</div>
-                        <div className="jrxs-value">
-                            <span>{mileage}</span>km
-                        </div>
-                    </div>
-                    {dailySummaryJxh?.planMileage && (
-                        <>
-                            <div>
-                                <div className="jrxs-name">今日作业</div>
-                                <div className="jrxs-value">
-                                    <span>{dailySummaryJxh?.workMileage?.toFixed(2) || 0}</span>km
-                                </div>
-                            </div>
-                            <div>
-                                <div className="jrxs-name">今日排班</div>
-                                <div className="jrxs-value">
-                                    <span>{dailySummaryJxh?.planMileage || 0}</span>km
-                                </div>
-                            </div>
-                        </>
-                    )}
-                </div>
-            </div>
-        </>
-    );
-}

package/src/vtx-car-modal/components/BaseInfo/TodayRun.tsx

@@ -1,84 +0,0 @@
-/**
- * 今日运行-通用
- */
-import React from 'react';
-import moment from 'moment';
-import VMTable from '../../../vm-table';
-import useSettings from '../../../vm-hooks/useSettings';
-import { BaseService } from '../../api';
-
-import outTime from '../../imgs/outTime.png';
-import runTime from '../../imgs/runTime.png';
-
-import outTimeLight from '../../imgs/outTime_light.png';
-import runTimeLight from '../../imgs/runTime_light.png';
-
-export default function TodayRun(props: { id: string; data: Array<any> }) {
-    const { isDark } = useSettings();
-    const { id, data } = props;
-    const { dailyCarRunRes } = BaseService.useDailyCarRun(
-        id,
-        moment().format('YYYY-MM-DD'),
-        moment().format('YYYY-MM-DD'),
-    );
-    const columns = [
-        {
-            title: '报警类型',
-            dataIndex: 'alarmTypeName',
-            key: 'alarmTypeName',
-            width: 100,
-            ellipsis: true,
-        },
-        {
-            title: '报警时间',
-            dataIndex: 'day',
-            key: 'day',
-            width: 100,
-            render: (_text: any, record: any) => {
-                return `${moment(record.detail.alarmBeginTime).format('HH:mm:ss')}-${moment(
-                    record.detail.alarmEndTime,
-                ).format('HH:mm:ss')}`;
-            },
-        },
-        {
-            title: '报警内容',
-            dataIndex: 'alarmTypeName',
-            key: 'alarmTypeName',
-            ellipsis: true,
-            render: (_text: any, record: any) => {
-                return record.detail.alarmTypeName;
-            },
-        },
-    ];
-    const tableProps = {
-        height: 220,
-        paganitation: false,
-        dataSource: data,
-    };
-
-    return (
-        <div className="today-run">
-            <div className="today-run-head">
-                <div className="today-run-head-item">
-                    <img src={isDark ? outTime : outTimeLight} />
-                    <div>
-                        <div className="today-run-head-item--name">出车时间</div>
-                        <div className="today-run-head-item--value">
-                            {dailyCarRunRes?.length > 0 ? dailyCarRunRes[0]?.firstRunTime || 0 : 0}
-                        </div>
-                    </div>
-                </div>
-                <div className="today-run-head-item">
-                    <img src={isDark ? runTime : runTimeLight} />
-                    <div>
-                        <div className="today-run-head-item--name">运行时长</div>
-                        <div className="today-run-head-item--value">
-                            {dailyCarRunRes?.length > 0 ? dailyCarRunRes[0]?.driveDurationStr : 0}
-                        </div>
-                    </div>
-                </div>
-            </div>
-            <VMTable columns={columns} isIndex={false} rowKey="index" {...tableProps} />
-        </div>
-    );
-}

package/src/vtx-car-modal/components/BaseInfo/TodayWorkJXH.tsx

@@ -1,54 +0,0 @@
-/**
- * 今日运行
- */
-import React from 'react';
-import moment from 'moment';
-import Progress from 'antd/es/progress';
-import useSettings from '../../../vm-hooks/useSettings';
-import NoData from '../../../vm-nodata';
-import { BaseService } from '../../api';
-
-export default function TodayWorkJXH(props: any) {
-    const { isDark } = useSettings();
-    const { id } = props;
-    const { todayRunJxhRes } = BaseService.useTodayWorkJxh(id, moment().format('YYYY-MM-DD'));
-
-    return (
-        <div className="today-run-jxh">
-            {todayRunJxhRes?.length > 0 ? (
-                todayRunJxhRes.map((ele: any, index: number) => (
-                    <div className="today-run-jxh-item" key={index}>
-                        <div className="today-run-jxh--name">{ele.roadName}</div>
-                        <div className="today-run-jxh--progress">
-                            <Progress
-                                strokeLinecap="butt"
-                                percent={ele?.completePercent || 0}
-                                // strokeColor={{
-                                //     '0%': '#46E8C5',
-                                //     '100%': '#55A591',
-                                // }}
-                                // trailColor="#444B59"
-                                strokeColor={
-                                    isDark
-                                        ? {
-                                              '0%': '#46E8C5',
-                                              '100%': '#55A591',
-                                          }
-                                        : '#1890ff'
-                                }
-                                trailColor={isDark ? '#444B59' : '#D1D5D9'}
-                                strokeWidth={6}
-                                showInfo={false}
-                            />
-                        </div>
-                        <div className="today-run-jxh--value">{`${ele?.completePercent || 0}%(${
-                            ele?.workMileage
-                        }km/${ele?.totalMileage}km)`}</div>
-                    </div>
-                ))
-            ) : (
-                <NoData />
-            )}
-        </div>
-    );
-}

package/src/vtx-car-modal/components/BaseInfo/TodayWorkLJSY.tsx

@@ -1,112 +0,0 @@
-/**
- * 今日作业-垃圾收运
- */
-import React from 'react';
-import moment from 'moment';
-import VMTable from '../../../vm-table';
-import ImageText from '../../../vm-image-text';
-import useSettings from '../../../vm-hooks/useSettings';
-import { BaseService } from '../../api';
-
-import ysdw from '../../imgs/ysdw.png';
-import ywcdw from '../../imgs/ywcdw.png';
-import wcl from '../../imgs/wcl.png';
-
-import ysdwLight from '../../imgs/ysdw_light.png';
-import ywcdwLight from '../../imgs/ywcdw_light.png';
-import wclLight from '../../imgs/wcl_light.png';
-
-export default function TodayWorkLJSY({ id }: { id: string }) {
-    const { isDark } = useSettings();
-    const { todayRunLjsyRes } = BaseService.useTodayWorkLjsy(id, moment().format('YYYY-MM-DD'));
-
-    const getSrc = (code: string) => {
-        let obj: { [key: string]: string } = {};
-        if (isDark) {
-            obj = {
-                ysdw: ysdw,
-                ywcdw: ywcdw,
-                wcl: wcl,
-            };
-        } else {
-            obj = {
-                ysdw: ysdwLight,
-                ywcdw: ywcdwLight,
-                wcl: wclLight,
-            };
-        }
-        return obj[code];
-    };
-
-    const data = [
-        {
-            src: getSrc('ysdw'),
-            name: '应收点位',
-            value: todayRunLjsyRes?.planCollectPointNum || 0,
-            unit: '个',
-        },
-        {
-            src: getSrc('ywcdw'),
-            name: '已收点位',
-            value: todayRunLjsyRes?.collectPointNum || 0,
-            unit: '个',
-        },
-        {
-            src: getSrc('wcl'),
-            name: '完成率',
-            value: todayRunLjsyRes?.completeRate || 0,
-            unit: '%',
-        },
-    ];
-
-    const columns = [
-        {
-            title: '收集点',
-            dataIndex: 'collectPointName',
-            key: 'collectPointName',
-            width: 150,
-            ellipsis: true,
-        },
-        {
-            title: '收集次数',
-            dataIndex: 'collectNum',
-            key: 'collectNum',
-            width: 80,
-        },
-        {
-            title: '收集桶数',
-            dataIndex: 'bucketNum',
-            key: 'bucketNum',
-            width: 80,
-        },
-        {
-            title: '收集重量',
-            dataIndex: 'weight',
-            key: 'weight',
-            width: 80,
-        },
-    ];
-    const tableProps = {
-        height: todayRunLjsyRes?.planCollectPointNum > 0 ? 180 : 246,
-        paganitation: false,
-        dataSource: todayRunLjsyRes?.details || [],
-    };
-
-    return (
-        <>
-            {/* 关联收集点 */}
-            {todayRunLjsyRes?.planCollectPointNum > 0 && (
-                <div className="ljsy-summary">
-                    {data?.map((ele, index: number) => (
-                        <ImageText
-                            key={index}
-                            {...ele}
-                            style={{ margin: '0 0 12px 0', width: '33.3333%' }}
-                        />
-                    ))}
-                </div>
-            )}
-            <VMTable columns={columns} isIndex={false} rowKey="index" {...tableProps} />
-        </>
-    );
-}