@vtx/modals2 2.6.20 → 2.6.21

package/src/vtx-wr-modal/components/Evaluate/AppraiseRecord.tsx

@@ -1,112 +0,0 @@
-/**
- * 评价记录
- */
-import React from 'react';
-import VMTable from '../../../vm-table';
-import SubTitle from '../../../vm-sub-title';
-import { AppraiseService } from '../../api';
-import { useSetState } from 'ahooks';
-
-interface TypeProps {
-    id: string;
-    startDate: string;
-    endDate: string;
-}
-
-export default function AppraiseRecord(props: TypeProps) {
-    const { id, startDate, endDate } = props;
-    const [state, setState] = useSetState({
-        pagination: {
-            current: 1,
-            pageSize: 10,
-            total: 0,
-        },
-        sorter: '',
-        order: '',
-    });
-    const { pagination, order } = state;
-
-    const { records } = AppraiseService.useAppraiseRecord(
-        id,
-        startDate ? `${startDate} 00:00:00` : '',
-        `${endDate} 23:59:59`,
-        pagination.current,
-        'assessDate',
-        order,
-    );
-    const columns = [
-        {
-            title: '平均总分',
-            dataIndex: 'totalValue',
-            key: 'totalValue',
-        },
-        {
-            title: '容易找到',
-            dataIndex: 'valueEight',
-            key: 'valueEight',
-        },
-        {
-            title: '硬件设施',
-            dataIndex: 'valueFive',
-            key: 'valueFive',
-        },
-        {
-            title: '服务管理',
-            dataIndex: 'valueFour',
-            key: 'valueFour',
-        },
-        {
-            title: '无需等待',
-            dataIndex: 'valueSeven',
-            key: 'valueSeven',
-        },
-        {
-            title: '干净卫生',
-            dataIndex: 'valueSix',
-            key: 'valueSix',
-        },
-        {
-            title: '评价时间',
-            dataIndex: 'assessDateStr',
-            key: 'assessDateStr',
-            sorter: true,
-        },
-    ];
-
-    const pageChange = (page: number) => {
-        setState({
-            pagination: {
-                ...pagination,
-                current: page,
-            },
-        });
-    };
-
-    const handleTableChange = (sorter: any) => {
-        setState({
-            order: sorter.order === 'ascend' ? 'ASC' : 'DESC',
-        });
-    };
-
-    const tableProps = {
-        pagination: {
-            ...pagination,
-            total: records.total,
-            defaultPageSize: 10,
-            onChange: pageChange,
-        },
-        handleTableChange,
-        height: 240,
-        dataSource: records.dataSource,
-    };
-
-    return (
-        <div className="appraise-record">
-            <SubTitle title="评价记录" />
-
-            <div className="appraise-record-table">
-                <VMTable columns={columns} {...tableProps} />
-            </div>
-        </div>
-    );
-}

package/src/vtx-wr-modal/components/Evaluate/Radar.tsx

@@ -1,68 +0,0 @@
-import React from 'react';
-import ReactEcharts from 'echarts-for-react';
-import useSettings from '../../../vm-hooks/useSettings';
-
-interface TypeProps {
-    value: Array<Number>;
-    indicator: Array<any>;
-}
-
-export default function Radar(props: TypeProps) {
-    const { value, indicator } = props;
-    const { isDark } = useSettings();
-    const option = {
-        legend: {
-            show: false,
-        },
-        grid: {
-            top: '10%',
-            left: 'left',
-            right: '10%',
-            bottom: 10,
-        },
-        radar: {
-            // shape: 'circle',
-            radius: '70%',
-            indicator: indicator || [],
-            nameGap: 8,
-            axisName: {
-                color: isDark ? '#4EFFDA' : '#1890ff',
-            },
-            splitLine: {
-                lineStyle: {
-                    color: '#C7C7C7',
-                },
-            },
-            splitArea: {
-                areaStyle: {
-                    color: [isDark ? '#17363D' : '#fff'],
-                },
-            },
-        },
-        series: [
-            {
-                name: '雷达',
-                type: 'radar',
-                data: [
-                    {
-                        value: value || [],
-                        itemStyle: {
-                            color: isDark ? '#2FE7EE' : '#1890ff',
-                        },
-                        areaStyle: {
-                            color: isDark ? '#4EFFDA' : '#1890ff',
-                        },
-                    },
-                ],
-            },
-        ],
-    };
-    return (
-        <ReactEcharts
-            option={option}
-            notMerge
-            lazyUpdate
-            style={{ height: '100%', width: '100%' }}
-        />
-    );
-}

package/src/vtx-wr-modal/components/Evaluate/Summary.tsx

@@ -1,130 +0,0 @@
-/**
- * 评价信息-上半部分-汇总
- */
-import React, { useEffect } from 'react';
-import { useSetState } from 'ahooks';
-import { Progress } from 'antd';
-import moment from 'moment';
-import useSettings from '../../../vm-hooks/useSettings';
-import { VMRangePicker } from '../../../vm-filter';
-import Radar from './Radar';
-
-import { AppraiseService } from '../../api';
-
-interface SummaryTypeProps {
-    id: string;
-    setDate: (startDate: string, endDate: string) => void;
-}
-
-export default function Summary(props: SummaryTypeProps) {
-    const { theme, isDark } = useSettings();
-    const { id, setDate } = props;
-    const [state, setState] = useSetState({
-        startDate: moment()
-            .startOf('M')
-            .format('YYYY-MM-DD'),
-        endDate: moment().format('YYYY-MM-DD'),
-    });
-    const { startDate, endDate } = state;
-
-    useEffect(() => {
-        setDate(startDate, endDate);
-    }, [startDate, endDate]);
-
-    const { appraiseSummary } = AppraiseService.useAppraisSummary(id, startDate, endDate);
-    const {
-        valueEight,
-        valueFour,
-        valueFive,
-        valueSeven,
-        valueSix,
-        assessCount,
-        totalValue,
-        goodItem,
-        goodItemStr,
-        badItem,
-        badItemStr,
-        exceedingRate,
-    } = appraiseSummary;
-    const handleDateChange = (start: string, end: string) => {
-        setState({
-            startDate: start,
-            endDate: end,
-        });
-    };
-
-    const radarData = {
-        indicator: [
-            { name: '容易找到', max: 10 },
-            { name: '公众满意', max: 10 },
-            { name: '服务管理', max: 10 },
-            { name: '无需等待', max: 10 },
-            { name: '干净卫生', max: 10 },
-        ],
-        value: [valueEight, valueFive, valueFour, valueSeven, valueSix],
-    };
-
-    return (
-        <div className="appraise-summary">
-            <div className="appraise-summary-head">
-                <div className="appraise-summary-subscribtion">
-                    {exceedingRate > 0 &&
-                        `该公厕近期综合评价领先${exceedingRate}%的公厕，继续保持！`}
-                </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>
-            <div className="appraise-summary-main">
-                <div className="appraise-summary-main-radar">
-                    <Radar {...radarData} />
-                </div>
-                <div className="appraise-summary-main-avg">
-                    <div className={`appraise-summary-main-avg-progress ${theme}`}>
-                        <Progress
-                            type="circle"
-                            percent={totalValue || 0}
-                            strokeWidth={10}
-                            strokeColor={isDark ? '#4AFFE6' : '#1890ff'}
-                            trailColor={isDark ? 'rgba(255,255,255,0.1)' : '#D1D5D9'}
-                            strokeLinecap="butt"
-                            showInfo={false}
-                            style={{ width: '100px', height: '100px', margin: '24px 0 0 24px' }}
-                        />
-                        <div className="appraise-summary-main-avg-progress-text">
-                            <span>{totalValue}</span>
-                            <div>平均总分</div>
-                        </div>
-                    </div>
-                    <div className="appraise-summary-main-avg-count">
-                        <span>{assessCount}次</span>
-                        <div>评价总次数</div>
-                    </div>
-                </div>
-                <div className="appraise-summary-main-appraise">
-                    <div className="appraise-summary-main-appraise-good">
-                        <div className={`appraise-summary-main-appraise-good-bg ${theme}`}>
-                            优秀项： {goodItem || '无'}
-                        </div>
-                        {goodItemStr || '--'}
-                    </div>
-                    <div className="appraise-summary-main-appraise-bad">
-                        <div className={`appraise-summary-main-appraise-bad-bg ${theme}`}>
-                            薄弱项：{badItem || '无'}
-                        </div>
-                        {badItemStr || '--'}
-                    </div>
-                </div>
-            </div>
-        </div>
-    );
-}

package/src/vtx-wr-modal/components/Evaluate/index.less

@@ -1,132 +0,0 @@
-.wr-appraise {
-    margin: 6px;
-    width: 100%;
-
-    &-head {
-        width: 100%;
-        display: flex;
-        justify-content: start;
-        align-items: start;
-        padding: 14px 20px;
-        background-color: var(--bg-color2);
-    }
-
-    .appraise-summary {
-        width: 100%;
-        &-head {
-            display: flex;
-            justify-content: space-between;
-            align-items: center;
-        }
-        &-subscribtion {
-            color: var(--info-active2);
-            font-family: PingFang SC;
-        }
-        &-main {
-            display: flex;
-            justify-content: space-between;
-            align-items: center;
-            &-radar {
-                width: 360px;
-                height: 260px;
-                margin-right: 60px;
-            }
-            &-avg {
-                display: flex;
-                justify-content: start;
-                align-items: center;
-                width: 300px;
-                &-progress {
-                    width: 148px;
-                    height: 148px;
-                    background-image: url('../../imgs/score_avg.png');
-                    background-repeat: no-repeat;
-                    background-size: 100% 100%;
-                    margin-right: 27px;
-                    position: relative;
-                    &.light {
-                        background-image: url('../../imgs/score_avg_light.png');
-                    }
-
-                    &-text {
-                        position: absolute;
-                        left: 45px;
-                        top: 45px;
-                        color: var(--info-color);
-                        text-align: center;
-                        span {
-                            display: block;
-                            color: var(--info-active);
-                            font-size: 22px;
-                        }
-                    }
-
-                    .ant-progress-inner {
-                        width: 100px !important;
-                        height: 100px !important;
-                    }
-                }
-                &-count {
-                    color: var(--info-color);
-                    span {
-                        display: block;
-                        font-size: 20px;
-                        font-family: PingFang SC;
-                    }
-                }
-            }
-            &-appraise {
-                width: 400px;
-                color: var(--info-color);
-                margin-right: 24px;
-
-                &-good {
-                    margin-bottom: 43px;
-                    &-bg {
-                        &.light {
-                            color: #1f480a;
-                        }
-                        width: 291px;
-                        height: 57px;
-                        line-height: 57px;
-                        padding-left: 60px;
-                        background-image: url('../../imgs/good.png');
-                        background-repeat: no-repeat;
-                        background-size: 100% 100%;
-                    }
-                }
-                &-bad {
-                    &-bg {
-                        &.light {
-                            color: #825907;
-                        }
-                        width: 291px;
-                        height: 57px;
-                        line-height: 57px;
-                        padding-left: 60px;
-                        background-image: url('../../imgs/bad.png');
-                        background-repeat: no-repeat;
-                        background-size: 100% 100%;
-                    }
-                }
-            }
-        }
-    }
-
-    .appraise-trend {
-        width: calc(100% - 588px);
-        height: 340px;
-        padding: 14px 20px;
-        background-color: var(--bg-color2);
-    }
-
-    .appraise-record {
-        padding: 14px 20px;
-        margin: 6px 12px 0 0;
-        background-color: var(--bg-color2);
-
-        &-table {
-            margin-top: 14px;
-        }
-    }
-}

package/src/vtx-wr-modal/components/Evaluate/index.tsx

@@ -1,35 +0,0 @@
-/**
- * 监测-评价信息
- */
-import React from 'react';
-import { useSetState } from 'ahooks';
-import Summary from './Summary';
-import AppraiseRecord from './AppraiseRecord';
-import './index.less';
-interface AlarmInfoProps {
-    id: string;
-}
-
-const Evaluate: React.FC<AlarmInfoProps> = props => {
-    const { id } = props;
-    const [state, setState] = useSetState({
-        startDate: '',
-        endDate: '',
-    });
-    const setDate = (startDate: string, endDate: string) => {
-        setState({
-            startDate,
-            endDate,
-        });
-    };
-    return (
-        <div className="wr-appraise">
-            <div className="wr-appraise-head">
-                <Summary id={id} setDate={setDate} />
-            </div>
-            <AppraiseRecord id={id} {...state} />
-        </div>
-    );
-};
-
-export default Evaluate;

package/src/vtx-wr-modal/components/Monitor/MonitorInfo.tsx

@@ -1,144 +0,0 @@
-/**
- * 监测信息-折线图
- */
-import React, { useEffect } from 'react';
-import { useSetState } from 'ahooks';
-import moment, { Moment } from 'moment';
-import ReactEcharts from 'echarts-for-react';
-import useSettings from '../../../vm-hooks/useSettings';
-import { VMDatePicker } from '../../../vm-filter';
-import { SubTabsLine } from '../../../vm-sub-tabs';
-import { MoniotrService } from '../../api';
-
-interface TypeProps {
-    id: string;
-}
-
-const MonitorInfo = (props: TypeProps) => {
-    const { id } = props;
-    const { chartFontColor } = useSettings();
-    const [state, setState] = useSetState({
-        filterKey: '',
-        startDate: moment().format('YYYY-MM-DD'),
-        endDate: moment().format('YYYY-MM-DD'),
-        unit: '',
-    });
-    const { filterKey, startDate, endDate, unit } = state;
-    const { monitorType } = MoniotrService.useMonitorType(id);
-
-    useEffect(() => {
-        if (monitorType?.length) {
-            setState({
-                filterKey: monitorType[0].key,
-                unit: monitorType[0].standardUnit,
-            });
-        }
-    }, [JSON.stringify(monitorType)]);
-
-    const { monitorChart } = MoniotrService.useMonitorChart(
-        id,
-        `${startDate} 00:00:00`,
-        `${endDate} 23:59:59`,
-        filterKey,
-    );
-    const { xAxis, xList, legend, legendList, series } = monitorChart;
-    const handleDateChange = (start: string) => {
-        setState({
-            startDate: start,
-            endDate: start,
-        });
-    };
-
-    const option = {
-        color: ['#4DFFD9', '#4195FF', '#FF7979', '#FFE25D'],
-        tooltip: {
-            trigger: 'axis',
-        },
-        legend: {
-            show: true,
-            itemWith: 6,
-            itemHeight: 6,
-            top: 20,
-            textStyle: {
-                color: chartFontColor,
-                fontSize: 12,
-            },
-            data: legend || legendList || [],
-        },
-        grid: {
-            top: 58,
-            left: 24,
-            bottom: 12,
-            right: 24,
-            containLabel: true,
-        },
-        xAxis: {
-            type: 'category',
-            boundaryGap: false,
-            axisTick: {
-                show: false,
-            },
-            axisLabel: {
-                color: chartFontColor,
-            },
-            data: xAxis || xList || [],
-        },
-        yAxis: [
-            {
-                name: unit,
-                type: 'value',
-                nameTextStyle: {
-                    color: chartFontColor,
-                },
-                axisTick: {
-                    show: false,
-                },
-                axisLabel: {
-                    color: chartFontColor,
-                },
-                axisLine: {
-                    show: true,
-                },
-                splitLine: {
-                    lineStyle: {
-                        type: 'dashed',
-                        color: 'rgba(151,151,151,0.28)',
-                    },
-                },
-            },
-        ],
-        series: series || [],
-    };
-    return (
-        <div className="wr-monitor-trend">
-            <div className="wr-monitor-trend-head">
-                <SubTabsLine
-                    items={monitorType}
-                    activeKey={filterKey}
-                    onChange={key => {
-                        setState({
-                            filterKey: key,
-                            unit: monitorType.find((ele: any) => ele.key === key).standardUnit,
-                        });
-                    }}
-                />
-                <VMDatePicker
-                    value={moment(startDate)}
-                    onChange={(date: Moment) => {
-                        date && handleDateChange(date.format('YYYY-MM-DD'));
-                    }}
-                />
-            </div>
-            <div>
-                <ReactEcharts
-                    option={option}
-                    notMerge
-                    lazyUpdate
-                    style={{ height: '300px', width: '100%' }}
-                />
-            </div>
-        </div>
-    );
-};
-
-export default MonitorInfo;