@vtx/modals2 2.6.20 → 2.6.21

package/src/vtx-cp-modal/components/ExeceptionInfo/index.less

@@ -1,115 +0,0 @@
-.cp-exeception {
-    margin: 6px;
-    width: 100%;
-
-    &-head {
-        width: 100%;
-        display: flex;
-        justify-content: start;
-        align-items: start;
-    }
-
-    .exeception-summary {
-        padding: 14px 20px;
-        background-color: var(--bg-color2);
-        width: 500px;
-        margin-right: 6px;
-
-        &-time {
-            margin: 24px;
-            display: flex;
-            justify-content: start;
-            align-items: center;
-            img {
-                width: 46px;
-                height: 46px;
-                margin-right: 19px;
-            }
-            &-name {
-                font-size: 12px;
-                color: var(--title-color);
-            }
-            &-value {
-                color: var(--title-color);
-                font-size: 12px;
-                span {
-                    font-size: 20px;
-                    line-height: 25px;
-                }
-                &-compare {
-                    display: inline-block;
-                    margin-left: 36px;
-                }
-            }
-        }
-        .triangle-up {
-            width: 12px;
-            height: 8px;
-            position: relative;
-            overflow: hidden;
-            display: inline-block;
-            margin-left: 4px;
-            &::before {
-                content: '';
-                position: absolute;
-                top: 0;
-                left: 0;
-                right: 0;
-                bottom: 0;
-                background: #f65861;
-                transform-origin: left bottom;
-                transform: rotate(45deg);
-            }
-        }
-        .triangle-down {
-            width: 12px;
-            height: 8px;
-            position: relative;
-            overflow: hidden;
-            display: inline-block;
-            margin-left: 4px;
-            margin-bottom: -2px;
-            &::before {
-                content: '';
-                position: absolute;
-                top: 0;
-                left: 0;
-                right: 0;
-                bottom: 0;
-                background: #41ffb4;
-                transform-origin: right top;
-                transform: rotate(45deg);
-            }
-        }
-    }
-
-    .exeception-trend {
-        width: calc(100% - 518px);
-        height: 358px;
-        padding: 14px 20px;
-        background-color: var(--bg-color2);
-    }
-
-    .exeception-record {
-        padding: 14px 20px;
-        margin: 6px 12px 0 0;
-        background-color: var(--bg-color2);
-
-        &-head {
-            display: flex;
-            justify-content: space-between;
-            align-items: center;
-        }
-
-        &-table {
-            margin-top: 14px;
-            height: 200px;
-        }
-
-        .execeptionLevel {
-            img {
-                margin-top: -2px;
-            }
-        }
-    }
-}

package/src/vtx-cp-modal/components/ExeceptionInfo/index.tsx

@@ -1,27 +0,0 @@
-/**
- * 收集点-异常信息
- */
-import React from 'react';
-import Summary from './Summary';
-import MonthTrend from './MonthTrend';
-import Record from './ExeceptionRecord';
-import './index.less';
-
-interface ExeceptionProps {
-    id: string;
-}
-
-const ExeceptionInfo: React.FC<ExeceptionProps> = props => {
-    const { id } = props;
-    return (
-        <div className="cp-exeception">
-            <div className="cp-exeception-head">
-                <Summary id={id} />
-                <MonthTrend id={id} />
-            </div>
-            <Record id={id} />
-        </div>
-    );
-};
-
-export default ExeceptionInfo;

package/src/vtx-cp-modal/components/SyInfo/Ljcsl.tsx

@@ -1,121 +0,0 @@
-/**
- * 计量信息-图表-进场趋势分析
- */
-
-import React from 'react';
-import * as echarts from 'echarts';
-import ReactEcharts from 'echarts-for-react';
-import useSettings from '../../../vm-hooks/useSettings';
-
-import NoData from '../../../vm-nodata';
-
-interface TypeProps {
-    data: { legends: []; names: []; values: [[]] };
-}
-
-const Ljcsl = (props: TypeProps) => {
-    const { chartFontColor } = useSettings();
-    if (!props?.data) {
-        return <div></div>;
-    }
-    const { names, values } = props.data;
-
-    const option = {
-        color: ['#00FFE7'],
-        tooltip: {
-            trigger: 'axis',
-        },
-        legend: {
-            itemWith: 6,
-            itemHeight: 6,
-            textStyle: {
-                color: chartFontColor,
-                fontSize: 12,
-            },
-            data: ['日产生量'],
-        },
-        grid: {
-            left: '8%',
-            right: '6%',
-            top: 28,
-            bottom: 20,
-        },
-        xAxis: {
-            type: 'category',
-            boundaryGap: true,
-            axisTick: {
-                show: false,
-            },
-            axisLabel: {
-                color: chartFontColor,
-            },
-            data: names,
-        },
-        yAxis: {
-            type: 'value',
-            name: 'kg',
-            min: 0,
-            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?.length > 0 ? values[0] : [],
-                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: chartFontColor,
-                        fontWeight: 'normal',
-                    },
-                    lineStyle: {
-                        color: '#FFE25D',
-                    },
-                },
-            },
-        ],
-    };
-    return (
-        <>
-            {values?.length > 0 && values[0]?.length > 0 ? (
-                <ReactEcharts
-                    option={option}
-                    notMerge
-                    lazyUpdate
-                    style={{ height: '160px', width: '100%' }}
-                />
-            ) : (
-                <NoData style={{ height: '160px' }} />
-            )}
-        </>
-    );
-};
-
-export default Ljcsl;

package/src/vtx-cp-modal/components/SyInfo/index.less

@@ -1,37 +0,0 @@
-.cp-syinfo {
-    padding: 6px 10px;
-    &-head {
-        padding: 20px;
-        display: flex;
-        justify-content: space-between;
-        align-items: center;
-        background-color: var(--bg-color2);
-    }
-    &-base {
-        padding: 0px 20px 12 20px;
-        display: flex;
-        justify-content: start;
-        align-items: start;
-        background-color: var(--bg-color2);
-    }
-    &-base-weight {
-        width: 49%;
-        margin-right: 2%;
-        background-color: var(--bg-color2);
-        padding-left: 20px;
-        &-item {
-            display: flex;
-            flex-wrap: wrap;
-        }
-    }
-    &-base-chart {
-        width: 49%;
-        height: 200px;
-    }
-    &-table {
-        padding: 20px;
-        margin-top: 10px;
-        height: 400px;
-        background-color: var(--bg-color2);
-    }
-}

package/src/vtx-cp-modal/components/SyInfo/index.tsx

@@ -1,329 +0,0 @@
-/**
- * 收集点-收运信息
- */
-import React, { useEffect } from 'react';
-import { useSetState } from 'ahooks';
-import moment from 'moment';
-import SubTitle from '../../../vm-sub-title';
-import { SubTabsLine } from '../../../vm-sub-tabs';
-import { VMRangePicker } from '../../../vm-filter';
-import ImageText from '../../../vm-image-text';
-import VMTable from '../../../vm-table';
-import Ljcsl from './Ljcsl';
-import useSettings from '../../../vm-hooks/useSettings';
-import { SyService } from '../../api';
-
-import './index.less';
-
-import jhsj from '../../imgs/jhsj.png';
-import sjsj from '../../imgs/sjsj.png';
-import sjl from '../../imgs/sjl.png';
-import sjts from '../../imgs/sjts.png';
-import sjzl from '../../imgs/sjzl.png';
-
-import jhsjLight from '../../imgs/jhsj_light.png';
-import sjsjLight from '../../imgs/sjsj_light.png';
-import sjlLight from '../../imgs/sjl_light.png';
-import sjtsLight from '../../imgs/sjts_light.png';
-import sjzlLight from '../../imgs/sjzl_light.png';
-export interface SyProps {
-    id: string;
-}
-
-interface summaryTypes {
-    planCollectNums: number;
-    collectNum: number;
-    rate: number;
-    bucketNum: number;
-    showWeight: boolean;
-    weight: number;
-}
-
-const summaryData: summaryTypes = {
-    planCollectNums: 0,
-    collectNum: 0,
-    rate: 0,
-    bucketNum: 0,
-    showWeight: false,
-    weight: 0,
-};
-
-const SyInfo: React.FC<SyProps> = props => {
-    const { isDark } = useSettings();
-    const { id } = props;
-    const [state, setState] = useSetState({
-        filterKey: '',
-        summary: summaryData,
-        startDate: moment()
-            .startOf('M')
-            .format('YYYY-MM-DD'),
-        endDate: moment().format('YYYY-MM-DD'),
-        pagination: {
-            current: 1,
-            pageSize: 10,
-            total: 0,
-        },
-        sort: '',
-    });
-    const { summary, filterKey, startDate, endDate, pagination, sort } = state;
-    const { planCollectNums, collectNum, rate, bucketNum, showWeight, weight } = summary;
-
-    const { baseInfo, collectWeight } = SyService.useBaseInfo(id, startDate, endDate);
-    const { records } = SyService.useRecordInfo(
-        id,
-        filterKey,
-        startDate,
-        endDate,
-        pagination.current - 1,
-        sort,
-    );
-
-    const handleDateChange = (start: string, end: string) => {
-        setState({
-            startDate: start,
-            endDate: end,
-        });
-    };
-
-    useEffect(() => {
-        if (baseInfo.length > 0) {
-            const data = baseInfo.find((ele: any) => ele.productTypeId === (filterKey || null));
-            setState({
-                summary: data,
-            });
-        }
-    }, [baseInfo, filterKey]);
-    const columns = [
-        {
-            title: '收集日期',
-            dataIndex: 'collectDay',
-            key: 'collectDay',
-            sorter: true,
-        },
-
-        {
-            title: '计划收集频次',
-            dataIndex: 'planCollectNums',
-            key: 'planCollectNums',
-        },
-        {
-            title: '实际频次',
-            dataIndex: 'collectNums',
-            key: 'collectNums',
-        },
-        {
-            title: '收集状态',
-            dataIndex: 'collectStatusStr',
-            key: 'collectStatusStr',
-        },
-        {
-            title: '收集桶数(个)',
-            dataIndex: 'bucketNum',
-            key: 'bucketNum',
-        },
-        {
-            title: '收集重量(kg)',
-            dataIndex: 'weight',
-            key: 'weight',
-        },
-    ];
-    let newColumns = columns;
-    if (showWeight) {
-        newColumns.splice(1, 0, {
-            title: '垃圾类型',
-            dataIndex: 'productTypeName',
-            key: 'productTypeName',
-        });
-    }
-
-    const getSrc = (code: string) => {
-        const obj: any = {
-            jhsj: jhsj,
-            sjsj: sjsj,
-            sjl: sjl,
-            sjts: sjts,
-            sjzl: sjzl,
-        };
-        const obj2: any = {
-            jhsj: jhsjLight,
-            sjsj: sjsjLight,
-            sjl: sjlLight,
-            sjts: sjtsLight,
-            sjzl: sjzlLight,
-        };
-        if (isDark) {
-            return obj[code];
-        }
-        return obj2[code];
-    };
-
-    const pageChange = (page: number) => {
-        setState({
-            pagination: {
-                ...pagination,
-                current: page,
-            },
-        });
-    };
-
-    const handleTableChange = (sorter: any) => {
-        setState({
-            sort: `${sorter.columnKey},${sorter.order === 'ascend' ? 'ASC' : 'DESC'}`,
-        });
-    };
-
-    const tableProps = {
-        rowKey: 'id',
-        pagination: {
-            ...pagination,
-            total: records.total,
-            defaultPageSize: 10,
-            onChange: pageChange,
-        },
-        handleTableChange,
-        height: 280,
-        dataSource: records.rows,
-    };
-
-    return (
-        <div className="cp-syinfo">
-            <div className="cp-syinfo-head">
-                <SubTabsLine
-                    items={baseInfo?.map(
-                        (ele: { productTypeId: string; productTypeName: string }) => ({
-                            key: ele?.productTypeId || '',
-                            label: ele.productTypeName,
-                        }),
-                    )}
-                    activeKey={filterKey}
-                    onChange={key => {
-                        setState({
-                            filterKey: key,
-                        });
-                    }}
-                />
-                <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>
-            {showWeight ? (
-                <>
-                    <div className="cp-syinfo-base">
-                        <div className="cp-syinfo-base-weight">
-                            <SubTitle title="汇总信息" />
-                            <div className="cp-syinfo-base-weight-item">
-                                <ImageText
-                                    src={getSrc('jhsj')}
-                                    name="计划收集"
-                                    value={planCollectNums}
-                                    unit="次"
-                                    color="active"
-                                    style={{
-                                        marginRight: '0',
-                                        width: '150px',
-                                        marginBottom: '24px',
-                                    }}
-                                />
-                                <ImageText
-                                    src={getSrc('sjsj')}
-                                    name="实际收集"
-                                    value={collectNum}
-                                    unit="次"
-                                    color="active"
-                                    style={{
-                                        marginRight: '0',
-                                        width: '150px',
-                                        marginBottom: '24px',
-                                    }}
-                                />
-                                <ImageText
-                                    src={getSrc('sjl')}
-                                    name="收集率"
-                                    value={rate}
-                                    unit="%"
-                                    color="active"
-                                    style={{
-                                        marginRight: '0',
-                                        width: '150px',
-                                        marginBottom: '24px',
-                                    }}
-                                />
-                                <ImageText
-                                    src={getSrc('sjts')}
-                                    name="收集桶数"
-                                    value={bucketNum}
-                                    unit="个"
-                                    color="active"
-                                    style={{
-                                        marginRight: '0',
-                                        width: '150px',
-                                        marginBottom: '24px',
-                                    }}
-                                />
-                                <ImageText
-                                    src={getSrc('sjzl')}
-                                    name="收集重量"
-                                    value={weight}
-                                    unit="kg"
-                                    color="active"
-                                    style={{
-                                        marginRight: '0',
-                                        width: '150px',
-                                        marginBottom: '24px',
-                                    }}
-                                />
-                            </div>
-                        </div>
-                        <div className="cp-syinfo-base-chart">
-                            <SubTitle title="垃圾产生量" />
-                            <Ljcsl data={collectWeight} />
-                        </div>
-                    </div>
-                </>
-            ) : (
-                <div className="cp-syinfo-base">
-                    <ImageText
-                        src={getSrc('jhsj')}
-                        name="计划收集"
-                        value={planCollectNums}
-                        unit="次"
-                        color="active"
-                    />
-                    <ImageText
-                        src={getSrc('sjsj')}
-                        name="实际收集"
-                        value={collectNum}
-                        unit="次"
-                        color="active"
-                    />
-                    <ImageText
-                        src={getSrc('sjl')}
-                        name="收集率"
-                        value={rate}
-                        unit="%"
-                        color="active"
-                    />
-                    <ImageText
-                        src={getSrc('sjts')}
-                        name="收集桶数"
-                        value={bucketNum}
-                        unit="个"
-                        color="active"
-                    />
-                </div>
-            )}
-            <div className="cp-syinfo-table">
-                <VMTable columns={newColumns} {...tableProps} />
-            </div>
-        </div>
-    );
-};
-
-export default SyInfo;

package/src/vtx-cp-modal/components/index.ts

@@ -1,6 +0,0 @@
-import BaseInfo from './BaseInfo';
-import SyInfo from './SyInfo';
-import AlarmInfo from './AlarmInfo';
-import ExeceptionInfo from './ExeceptionInfo';
-
-export { BaseInfo, SyInfo, AlarmInfo, ExeceptionInfo };

package/src/vtx-cp-modal/demo/demo1.tsx

@@ -1,28 +0,0 @@
-import React, { useState } from 'react';
-import { Button } from 'antd';
-import VtxCpModal from '../index';
-
-export default function Demo() {
-    const [visible, setVisible] = useState(false);
-    return (
-        <div style={{ height: '150px' }}>
-            <Button
-                type="primary"
-                onClick={() => {
-                    setVisible(true);
-                }}
-            >
-                暗色
-            </Button>
-            <VtxCpModal
-                visible={visible}
-                theme="dark"
-                title="吉克"
-                id="1585093014591000578"
-                onCancel={() => {
-                    setVisible(false);
-                }}
-            />
-        </div>
-    );
-}

package/src/vtx-cp-modal/demo/demo2.tsx

@@ -1,28 +0,0 @@
-import React, { useState } from 'react';
-import { Button } from 'antd';
-import VtxCpModal from '../index';
-
-export default function Demo() {
-    const [visible, setVisible] = useState(false);
-    return (
-        <div style={{ height: '150px' }}>
-            <Button
-                type="primary"
-                onClick={() => {
-                    setVisible(true);
-                }}
-            >
-                浅色
-            </Button>
-            <VtxCpModal
-                visible={visible}
-                theme="light"
-                title="尚城幼儿园（本部）"
-                id="1585093007808811010"
-                onCancel={() => {
-                    setVisible(false);
-                }}
-            />
-        </div>
-    );
-}