@vtx/modals2 2.6.19 → 2.6.21

package/src/vtx-df-modal/components/BaseInfo/index.tsx

@@ -1,89 +0,0 @@
-import React from 'react';
-import { useSetState } from 'ahooks';
-import moment from 'moment';
-import { VtxImage } from '@vtx/components';
-import { Carousel } from 'antd';
-import Base from '../../../vm-info-collection';
-import NoData from '../../../vm-nodata';
-import SubTitle from '../../../vm-sub-title';
-import Jcqsfx from './Jcqsfx';
-import Situation from './Situation';
-import AlarmDetail from './AlarmDetail';
-import { BaseService } from '../../api';
-import RealtimeMonitor from './RealtimeMonitor';
-import './index.less';
-
-interface BaseInfoProps {
-    code: string;
-    photos: [];
-    baseInfo: any[];
-}
-
-const BaseInfo = (props: BaseInfoProps) => {
-    const { baseInfo, photos, code } = props;
-    const nowDate = moment().format('YYYY-MM-DD');
-    const [state, setState] = useSetState({
-        startDate: moment()
-            .startOf('M')
-            .format('YYYY-MM-DD'),
-        endDate: nowDate,
-    });
-    const { startDate, endDate } = state;
-    const { situationAlarmRes } = BaseService.useSituationAlarm(code, nowDate, nowDate);
-    const { execeptionCar } = BaseService.useMonitorCarExeception(code, nowDate, situationAlarmRes);
-    const { execeptionPoint } = BaseService.useMonitorPointExeception(code, situationAlarmRes);
-    return (
-        <div className="df-baseContent">
-            <div className="base-top">
-                <div className="base-top-img">
-                    <div className="base-top-desc">{execeptionPoint || execeptionCar || ''}</div>
-                    {photos.length ? (
-                        <VtxImage.PreviewGroup>
-                            <Carousel style={{ width: '315px', height: '200px' }}>
-                                {photos.map((item: any) => {
-                                    return (
-                                        <VtxImage
-                                            key={item.id}
-                                            src={`/cloudFile/common/downloadFile?id=${item.id}`}
-                                            alt={item.name}
-                                            isDark={true}
-                                        />
-                                    );
-                                })}
-                            </Carousel>
-                        </VtxImage.PreviewGroup>
-                    ) : (
-                        <NoData />
-                    )}
-                </div>
-                <div className="base-top--base">
-                    <SubTitle title="基本信息" />
-                    <Base data={baseInfo} />
-                </div>
-                <Jcqsfx
-                    code={code}
-                    setDate={(start: string, end: string) => {
-                        setState({
-                            startDate: start,
-                            endDate: end,
-                        });
-                    }}
-                />
-            </div>
-            <div className="base-bottom">
-                <div className="base-bottom--left">
-                    <SubTitle title="实时运行情况" />
-                    <Situation code={code} alarm={situationAlarmRes} />
-                </div>
-                {/* 不为null则有计量工况 */}
-                {situationAlarmRes >= 0 ? (
-                    <RealtimeMonitor code={code} />
-                ) : (
-                    <AlarmDetail code={code} startDate={startDate} endDate={endDate} />
-                )}
-            </div>
-        </div>
-    );
-};
-
-export default BaseInfo;

package/src/vtx-df-modal/components/Metering/ChartJccc.tsx

@@ -1,120 +0,0 @@
-/**
- * 计量信息-图表-进场车次时间分布
- */
-
-import React from 'react';
-import * as echarts from 'echarts';
-import ReactEcharts from 'echarts-for-react';
-import SubTitle from '../../../vm-sub-title';
-import useSettings from '../../../vm-hooks/useSettings';
-import NoData from '../../../vm-nodata';
-import { BaseService } from '../../api';
-interface TypeProps {
-    code: string;
-    startDate: string;
-    endDate: string;
-}
-
-const ChartJccc = ({ code, startDate, endDate }: TypeProps) => {
-    const { chartFontColor } = useSettings();
-    const { jcccsjfbRes } = BaseService.useJcccsjfb(code, startDate, endDate);
-    let option = {
-        tooltip: {
-            trigger: 'axis',
-        },
-        grid: {
-            left: '5%',
-            right: '5%',
-            bottom: 20,
-        },
-        legend: {
-            show: false,
-        },
-        xAxis: [
-            {
-                type: 'category',
-                data: jcccsjfbRes?.names || [],
-                axisPointer: {
-                    type: 'shadow',
-                },
-                axisTick: {
-                    show: false,
-                },
-                axisLabel: {
-                    color: chartFontColor,
-                },
-            },
-        ],
-        yAxis: [
-            {
-                type: 'value',
-                name: '(次)',
-                min: 0,
-                nameTextStyle: {
-                    color: chartFontColor,
-                },
-                splitNumber: 5,
-                axisTick: {
-                    show: false,
-                },
-                axisLabel: {
-                    color: chartFontColor,
-                },
-                splitLine: {
-                    lineStyle: {
-                        type: 'dashed',
-                        color: 'rgba(151,151,151,0.28)',
-                    },
-                },
-            },
-        ],
-        series: [
-            {
-                type: 'bar',
-                barWidth: 14,
-                data: jcccsjfbRes?.values ? jcccsjfbRes.values[0] : [],
-                itemStyle: {
-                    color: new echarts.graphic.LinearGradient(0, 1, 0, 0, [
-                        {
-                            offset: 0,
-                            color: '#1B89FF',
-                        },
-                        {
-                            offset: 1,
-                            color: '#51D0FF',
-                        },
-                    ]),
-                },
-            },
-        ],
-    };
-    const dates =
-        jcccsjfbRes?.extraData?.length > 0 ? jcccsjfbRes.extraData.map((ele: any) => ele.date) : [];
-    const count =
-        jcccsjfbRes?.extraData?.length > 0
-            ? jcccsjfbRes.extraData.map((ele: any) => ele.count)
-            : [];
-    return (
-        <>
-            <SubTitle title="进场车次时间分布" />
-            <div className="metering-content-charts-jccc-desc">
-                进场高峰集中在{dates?.join('点、') || 0}，进场车次分别为{count?.join('车、') || '-'}
-                车，注意合理调度， 缓解厂区排队情况。
-            </div>
-            <div className="metering-content-charts-chart">
-                {jcccsjfbRes.values?.length > 0 ? (
-                    <ReactEcharts
-                        option={option}
-                        notMerge
-                        lazyUpdate
-                        style={{ height: '330px', width: '100%' }}
-                    />
-                ) : (
-                    <NoData style={{ height: '300px', width: '100%' }} />
-                )}
-            </div>
-        </>
-    );
-};
-
-export default ChartJccc;

package/src/vtx-df-modal/components/Metering/ChartJcqs.tsx

@@ -1,138 +0,0 @@
-/**
- * 计量信息-图表-进场趋势分析
- */
-
-import React from 'react';
-import { flatten, max } from 'lodash';
-import * as echarts from 'echarts';
-import ReactEcharts from 'echarts-for-react';
-import useSettings from '../../../vm-hooks/useSettings';
-import SubTitle from '../../../vm-sub-title';
-import NoData from '../../../vm-nodata';
-
-interface TypeProps {
-    names: [];
-    values: [][][];
-    legends: [];
-}
-
-const ChartJcqs = (props: TypeProps) => {
-    const { chartFontColor } = useSettings();
-    const xData = props?.names || [];
-    const values = props?.values ? props.values[0] : [];
-    let maxNum = null;
-    if (props?.values?.length > 0) {
-        maxNum = max(flatten(props.values));
-    }
-    const option = {
-        color: ['#00FFE7'],
-        tooltip: {
-            trigger: 'axis',
-        },
-        legend: {
-            itemWith: 6,
-            itemHeight: 6,
-            textStyle: {
-                color: chartFontColor,
-                fontSize: 12,
-            },
-            props: props?.legends || [],
-        },
-        grid: {
-            left: '8%',
-            right: '6%',
-            bottom: 20,
-        },
-        xAxis: {
-            type: 'category',
-            boundaryGap: true,
-            axisTick: {
-                show: false,
-            },
-            axisLabel: {
-                color: chartFontColor,
-            },
-            data: xData,
-        },
-        yAxis: {
-            type: 'value',
-            boundaryGap: true,
-            name: '吨',
-            max: maxNum,
-            nameTextStyle: {
-                color: chartFontColor,
-            },
-            // splitNumber: 5,
-            axisLabel: {
-                color: chartFontColor,
-            },
-            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: [
-                        {
-                            yAxis: props?.values ? props.values[1][0] : 0,
-                            lineStyle: {
-                                normal: {
-                                    color: '#FFE25D',
-                                },
-                            },
-                            name: '设计能力',
-                        },
-                    ],
-                    lineStyle: {
-                        color: '#FFE25D',
-                    },
-                    label: {
-                        show: true,
-                        position: 'insideEndTop',
-                        formatter: '{b}: {c}',
-                        color: chartFontColor,
-                        fontWeight: 'normal',
-                    },
-                },
-            },
-        ],
-    };
-    return (
-        <>
-            <SubTitle title="进场趋势分析" />
-            <div className="metering-content-charts-chart">
-                {props?.names?.length > 0 ? (
-                    <ReactEcharts
-                        option={option}
-                        notMerge
-                        lazyUpdate
-                        style={{ height: '100%', width: '100%' }}
-                    />
-                ) : (
-                    <NoData />
-                )}
-            </div>
-        </>
-    );
-};
-
-export default ChartJcqs;

package/src/vtx-df-modal/components/Metering/List.tsx

@@ -1,113 +0,0 @@
-/**
- * 考核信息-列表
- */
-
-import React from 'react';
-import { useSetState } from 'ahooks';
-import VMTable from '../../../vm-table';
-import { MeteringService } from '../../api';
-
-interface ListProps {
-    code: string;
-    startDate: string;
-    endDate: string;
-}
-
-const List = (props: ListProps) => {
-    const { code, startDate, endDate } = props;
-    const [state, setState] = useSetState({
-        pagination: {
-            current: 1,
-            pageSize: 10,
-            total: 0,
-        },
-    });
-    const { pagination } = state;
-    const { records } = MeteringService.useRecord(
-        code,
-        `${startDate} 00:00:00`,
-        `${endDate} 23:59:59`,
-        pagination.current,
-    );
-    const columns = [
-        {
-            title: '车牌号',
-            dataIndex: 'carNo',
-            key: 'carNo',
-        },
-        {
-            title: '货物名称',
-            dataIndex: 'productName',
-            key: 'productName',
-        },
-        {
-            title: '发货单位',
-            dataIndex: 'sourceUnit',
-            key: 'sourceUnit',
-        },
-        {
-            title: '区域',
-            dataIndex: 'area',
-            key: 'area',
-        },
-        {
-            title: '毛重(吨)',
-            dataIndex: 'grossWeight',
-            key: 'grossWeight',
-            render: (text: number) => {
-                return <span className="grossWeight-color">{text}</span>;
-            },
-        },
-        {
-            title: '皮重(吨)',
-            dataIndex: 'tareWeight',
-            key: 'tareWeight',
-            render: (text: number) => {
-                return <span className="tareWeight-color">{text}</span>;
-            },
-        },
-        {
-            title: '净重(吨)',
-            dataIndex: 'netWeight',
-            key: 'netWeight',
-            render: (text: number) => {
-                return <span className="netWeight-color">{text}</span>;
-            },
-        },
-        {
-            title: '称重时间',
-            dataIndex: 'grossTimeStr',
-            key: 'grossTimeStr',
-        },
-    ];
-
-    const pageChange = (page: number) => {
-        setState({
-            pagination: {
-                ...pagination,
-                current: page,
-            },
-        });
-    };
-
-    const tableProps = {
-        pagination: {
-            ...pagination,
-            total: records.total,
-            defaultPageSize: 10,
-            onChange: pageChange,
-        },
-        height: 440,
-        dataSource: records.rows,
-    };
-
-    return (
-        <div className="appraisal-content-list">
-            <div className="appraisal-content-list-table">
-                <VMTable columns={columns} rowKey="id" {...tableProps} />
-            </div>
-        </div>
-    );
-};
-
-export default List;

package/src/vtx-df-modal/components/Metering/index.less

@@ -1,79 +0,0 @@
-.metering {
-    padding: 10px;
-    &-head {
-        display: flex;
-        justify-content: space-between;
-        align-items: center;
-        padding: 10px 16px;
-        background-color: var(--bg-color2);
-    }
-    &-content {
-        &-main {
-            padding: 16px;
-            background-color: var(--bg-color2);
-            display: flex;
-            justify-content: start;
-            align-content: center;
-
-            &-item {
-                display: flex;
-                justify-content: start;
-                align-content: center;
-                margin-right: 80px;
-                img {
-                    width: 46px;
-                    height: 46px;
-                    margin-right: 18px;
-                }
-                &--name {
-                    color: var(--label-color);
-                }
-                &--value {
-                    color: var(--info-color);
-                    font-size: 12px;
-                    span {
-                        font-size: 22px;
-                    }
-                }
-            }
-        }
-
-        &-charts {
-            margin-top: 10px;
-            display: flex;
-            justify-content: start;
-            align-items: center;
-            .chart {
-                width: 630px;
-                height: 490px;
-                background-color: var(--bg-color2);
-                padding: 20px;
-            }
-            &-jcqs {
-                .chart();
-                margin-right: 10px;
-            }
-            &-jccc {
-                .chart();
-                &-desc {
-                    margin: 12px 0;
-                    color: var(--info-danger);
-                }
-            }
-            &-chart {
-                height: 360px;
-                width: 100%;
-            }
-        }
-    }
-
-    .grossWeight-color {
-        color: #FFF845;
-    }
-    .tareWeight-color {
-        color: #45D1FF;
-    }
-    .netWeight-color {
-        color: #20FEFF;
-    }
-}