@vtx/modals2 2.6.19 → 2.6.21

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

@@ -1,120 +0,0 @@
-/**
- * 水耗信息
- */
-import React from 'react';
-import { useSetState } from 'ahooks';
-import moment from 'moment';
-import SubTitle from '../../../vm-sub-title';
-import { VMRangePicker } from '../../../vm-filter';
-import ImageText from '../../../vm-image-text';
-import VMTable from '../../../vm-table';
-import useSettings from '../../../vm-hooks/useSettings';
-import { WaterService } from '../../api';
-import './index.less';
-
-import ccts from '../../imgs/ccts.png';
-import zsh from '../../imgs/zsh.png';
-
-import cctsLight from '../../imgs/ccts_light.png';
-import zshLight from '../../imgs/zsh_light.png';
-
-interface WaterConsumptionTypes {
-    id: string;
-}
-
-const WaterConsumption: React.FC<WaterConsumptionTypes> = props => {
-    const { isDark } = useSettings();
-    const { id } = props;
-    const nowDate = moment().format('YYYY-MM-DD');
-    const [state, setState] = useSetState({
-        startDate: moment()
-            .startOf('M')
-            .format('YYYY-MM-DD'),
-        endDate: nowDate,
-        order: '',
-    });
-    const { startDate, endDate, order } = state;
-
-    const { summaryRes } = WaterService.useSummary(id, startDate, endDate);
-    const { recordRes } = WaterService.useRecord(id, startDate, endDate, order);
-
-    const handleDateChange = (start: string, end: string) => {
-        setState({
-            startDate: start,
-            endDate: end,
-        });
-    };
-
-    const columns = [
-        {
-            title: '日期',
-            dataIndex: 'day',
-            key: 'day',
-            sorter: true,
-        },
-        {
-            title: '总水耗(L)',
-            dataIndex: 'useValue',
-            key: 'useValue',
-        },
-        {
-            title: '百公里油耗(L)',
-            dataIndex: 'averageOilUse',
-            key: 'averageOilUse',
-        },
-    ];
-
-    const handleTableChange = (sorter: any) => {
-        setState({
-            order: sorter.order === 'ascend' ? 'ASC' : 'DESC',
-        });
-    };
-
-    const tableProps = {
-        pagination: {
-            total: recordRes?.total || 0,
-            defaultPageSize: 10,
-        },
-        height: 360,
-        handleTableChange,
-        dataSource: recordRes?.rows || [],
-    };
-
-    return (
-        <div className="water-consumption">
-            <div className="water-consumption-head">
-                <div className="water-consumption-head-filter">
-                    <SubTitle title="汇总统计" />
-                    <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 className="water-consumption-head-main">
-                    <ImageText
-                        src={isDark ? ccts : cctsLight}
-                        name="出车天数"
-                        value={summaryRes?.daysOfCarOut || 0}
-                        unit="天"
-                    />
-                    <ImageText
-                        src={isDark ? zsh : zshLight}
-                        name="总水耗"
-                        value={summaryRes?.totalWater || 0}
-                        unit="L"
-                    />
-                </div>
-            </div>
-            <div className="water-consumption-main">
-                <VMTable columns={columns} rowKey="id" {...tableProps} />
-            </div>
-        </div>
-    );
-};
-export default WaterConsumption;

package/src/vtx-car-modal/components/WorkInfo/Wcl.tsx

@@ -1,117 +0,0 @@
-/**
- * 作业信息-有排班-平均完成率
- */
-
-import React from 'react';
-import * as echarts from 'echarts';
-import ReactEcharts from 'echarts-for-react';
-
-import NoData from '../../../vm-nodata';
-
-interface TypeProps {
-    names: string[];
-    values: number[][];
-}
-
-const Wcl = (props: TypeProps) => {
-    const { names, values } = props;
-
-    const option = {
-        color: ['#00FFE7'],
-        tooltip: {
-            trigger: 'axis',
-        },
-        legend: {
-            itemWith: 6,
-            itemHeight: 6,
-            textStyle: {
-                color: '#fff',
-                fontSize: 12,
-            },
-            data: ['日完成率'],
-        },
-        grid: {
-            left: '8%',
-            right: '6%',
-            top: 28,
-            bottom: 20,
-        },
-        xAxis: {
-            type: 'category',
-            boundaryGap: true,
-            axisTick: {
-                show: false,
-            },
-            axisLabel: {
-                color: '#fff',
-            },
-            data: names,
-        },
-        yAxis: {
-            type: 'value',
-            name: '',
-            min: 0,
-            nameTextStyle: {
-                color: '#fff',
-            },
-            splitNumber: 5,
-            axisLabel: {
-                color: '#fff',
-            },
-            splitLine: {
-                lineStyle: {
-                    type: 'dashed',
-                    color: 'rgba(151,151,151,0.28)',
-                },
-            },
-        },
-        series: [
-            {
-                name: '日完成率',
-                type: 'line',
-                data: values,
-                areaStyle: {
-                    color: new echarts.graphic.LinearGradient(0, 1, 0, 0, [
-                        {
-                            offset: 0,
-                            color: 'rgba(0, 0, 0, 0.5)',
-                        },
-                        {
-                            offset: 1,
-                            color: '#00FFE7',
-                        },
-                    ]),
-                },
-                markLine: {
-                    data: [{ type: 'average', name: '平均完成率' }],
-                    label: {
-                        show: true,
-                        position: 'insideEndTop',
-                        formatter: '{b}: {c}',
-                        color: '#fff',
-                        fontWeight: 'normal',
-                    },
-                    lineStyle: {
-                        color: '#FFE25D',
-                    },
-                },
-            },
-        ],
-    };
-    return (
-        <>
-            {values?.length > 0 ? (
-                <ReactEcharts
-                    option={option}
-                    notMerge
-                    lazyUpdate
-                    style={{ height: '180px', width: '100%' }}
-                />
-            ) : (
-                <NoData style={{ height: '160px' }} />
-            )}
-        </>
-    );
-};
-
-export default Wcl;

package/src/vtx-car-modal/components/WorkInfo/WorkJxh.tsx

@@ -1,318 +0,0 @@
-import React, { useEffect } from 'react';
-import { useSetState } from 'ahooks';
-import type { ColumnsType } from 'antd/es/table';
-import moment from 'moment';
-import Progress from 'antd/es/progress';
-import useSettings from '../../../vm-hooks/useSettings';
-import { SubTabsLine } from '../../../vm-sub-tabs';
-import { VMRangePicker } from '../../../vm-filter';
-import VMTable from '../../../vm-table';
-import ImageText from '../../../vm-image-text';
-import Wcl from './Wcl';
-import { BaseService, WorkServicve } from '../../api';
-
-import zld from '../../imgs/zld.png';
-import zlc from '../../imgs/zlc.png';
-import pjwcl from '../../imgs/pjwcl.png';
-
-import zldLight from '../../imgs/zld_light.png';
-import zlcLight from '../../imgs/zlc_light.png';
-import pjwclLight from '../../imgs/pjwcl_light.png';
-
-export default function WorkJxh({ id }: { id: string }) {
-    const { isDark } = useSettings();
-    const getSrc = (code: string) => {
-        let obj: { [key: string]: string } = {};
-        if (isDark) {
-            obj = {
-                zld: zld,
-                zlc: zlc,
-                pjwcl: pjwcl,
-            };
-        } else {
-            obj = {
-                zld: zldLight,
-                zlc: zlcLight,
-                pjwcl: pjwclLight,
-            };
-        }
-        return obj[code];
-    };
-    const [state, setState] = useSetState({
-        workTypeCodes: 'all',
-        tabItems: [{ key: 'all', label: '全部' }],
-        startDate: moment()
-            .startOf('M')
-            .format('YYYY-MM-DD'),
-        endDate: moment().format('YYYY-MM-DD'),
-        pagination: {
-            current: 1,
-            pageSize: 10,
-            total: 0,
-        },
-        order:''
-    });
-    const { workTypeCodes, startDate, endDate, pagination, tabItems,order } = state;
-    // 作业类型
-    const { workTypeRes } = WorkServicve.useWorkTypeJxh();
-
-    // 无排班
-    const { workSummaryJxhRes } = BaseService.useWorkSummaryJxh(id, startDate, endDate);
-
-    // 有排班
-    const { workAnaJxhRes } = BaseService.useWorkAnaJxh(id, startDate, endDate);
-    const { names, values, extraData } = workAnaJxhRes;
-
-    const { recordJxhRes } = WorkServicve.useRecordJxh(
-        id,
-        workTypeCodes === 'all' ? '' : workTypeCodes,
-        startDate,
-        endDate,
-        pagination.current - 1,
-        order
-    );
-
-    useEffect(() => {
-        let tabItemList = [{ key: 'all', label: '全部' }];
-        if (workTypeRes?.length > 0) {
-            workTypeRes.forEach((ele: any) => {
-                tabItemList.push({
-                    key: ele.code,
-                    label: ele.name,
-                });
-            });
-            setState({
-                tabItems: tabItemList,
-            });
-        }
-    }, [workTypeRes]);
-    const handleDateChange = (start: string, end: string) => {
-        setState({
-            startDate: start,
-            endDate: end,
-        });
-    };
-
-    const getColor = (code: string) => {
-        let color = '';
-        switch (code) {
-            case '机扫':
-                color = '#FFEF41';
-                break;
-            case '洗地':
-                color = '#52c41a';
-                break;
-            case '洒水':
-                color = '#35EAFF';
-                break;
-            default:
-                break;
-        }
-        return color;
-    };
-
-    let columns: ColumnsType = [
-        {
-            title: '作业日期',
-            dataIndex: 'workDate',
-            key: 'workDate',
-            width: 100,
-            sorter:true,
-        },
-
-        {
-            title: '作业开始时间',
-            dataIndex: 'workStartTime',
-            key: 'workStartTime',
-            width: 150,
-        },
-        {
-            title: '作业结束时间',
-            dataIndex: 'workEndTime',
-            key: 'workEndTime',
-            width: 150,
-        },
-        {
-            title: '作业类型',
-            dataIndex: 'workTypeName',
-            key: 'workTypeName',
-            render: (text: string) => {
-                return <span style={{ color: getColor(text) }}>{text}</span>;
-            },
-        },
-        {
-            title: '作业路段',
-            dataIndex: 'roadName',
-            key: 'roadName',
-        },
-    ];
-
-    if (extraData !== null && extraData > 0) {
-        // 有排班
-        columns = [
-            ...columns,
-            {
-                title: '作业里程/路段长度(km)',
-                dataIndex: 'roadSpace',
-                key: 'roadSpace',
-                width: 140,
-                render: (text: number, record: any) => {
-                    return (
-                        <>
-                            <div
-                                style={{ width: 100, display: 'inline-block', marginRight: '6px' }}
-                            >
-                                <Progress
-                                    size="small"
-                                    strokeLinecap="butt"
-                                    percent={(record?.workMileage / (text || 0)) * 100 || 0}
-                                    strokeColor={
-                                        isDark
-                                            ? {
-                                                  '0%': '#0090FF',
-                                                  '100%': '#1BF7FC',
-                                              }
-                                            : '#1890ff'
-                                    }
-                                    trailColor={isDark ? '#444B59' : '#D1D5D9'}
-                                    strokeWidth={4}
-                                    showInfo={false}
-                                />
-                            </div>
-                            {`${record?.workMileage}/${text}`}
-                        </>
-                    );
-                },
-            },
-            {
-                title: '作业/计划趟数',
-                dataIndex: 'workCount',
-                key: 'workCount',
-                width: 110,
-                render: (text: number, record: any) => {
-                    return <span>{`${record?.actualWorkCount}/${text}`}</span>;
-                },
-            },
-            {
-                title: '作业均速(km/h)',
-                dataIndex: 'workSpeed',
-                key: 'workSpeed',
-                width: 120,
-                render: text => {
-                    return <span>{text?.toFixed(2)}</span>;
-                },
-            },
-        ];
-    } else {
-        columns = [
-            ...columns,
-            {
-                title: '作业里程(km)',
-                dataIndex: 'workMileage',
-                key: 'workMileage',
-                render: (text: number) => {
-                    return text?.toFixed(2);
-                },
-            },
-        ];
-    }
-
-    const pageChange = (page: number) => {
-        setState({
-            pagination: {
-                ...pagination,
-                current: page,
-            },
-        });
-    };
-
-    const handleTableChange = (sorter: any) => {
-        setState({
-            order: `${sorter.order === 'ascend' ? 'ASC' : 'DESC'}`,
-        });
-    };
-
-    const tableProps = {
-        rowKey: 'index',
-        pagination: {
-            ...pagination,
-            total: recordJxhRes?.total || 0,
-            defaultPageSize: 10,
-            onChange: pageChange,
-        },
-        handleTableChange,
-        height: 240,
-        dataSource: recordJxhRes?.rows || [],
-    };
-    return (
-        <div>
-            <div className="car-work-head">
-                <div></div>
-                <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 className="car-work-content">
-                {extraData !== null && extraData > 0 ? (
-                    <div className="car-work-summary-pb">
-                        <div className="car-work-summary-pb-item">
-                            <ImageText
-                                src={getSrc('zlc')}
-                                name="作业总里程"
-                                value={workSummaryJxhRes?.workMileage || 0}
-                                unit="公里"
-                                style={{ width: '50%' }}
-                            />
-                            <ImageText
-                                src={getSrc('pjwcl')}
-                                name="平均完成率"
-                                value={extraData}
-                                unit="%"
-                                style={{ width: '50%' }}
-                            />
-                        </div>
-                        <div className="car-work-summary-pb-item">
-                            <Wcl names={names} values={values?.length > 1 ? values[1] : []} />
-                        </div>
-                    </div>
-                ) : (
-                    <div className="car-work-summary-nopb">
-                        <ImageText
-                            src={getSrc('zld')}
-                            name="作业总路段"
-                            value={workSummaryJxhRes?.roadNum || 0}
-                            unit="条"
-                            style={{ width: '50%' }}
-                        />
-                        <ImageText
-                            src={getSrc('zlc')}
-                            name="作业总里程"
-                            value={workSummaryJxhRes?.workMileage || 0}
-                            unit="公里"
-                            style={{ width: '50%' }}
-                        />
-                    </div>
-                )}
-            </div>
-            <div className="car-work-table">
-                <SubTabsLine
-                    items={tabItems}
-                    activeKey={workTypeCodes}
-                    onChange={key => {
-                        setState({
-                            workTypeCodes: key,
-                        });
-                    }}
-                />
-                <VMTable columns={columns} {...tableProps} />
-            </div>
-        </div>
-    );
-}