@vtx/modals2 2.6.20 → 2.6.21

package/src/vtx-staff-modal/components/Attendance/index.tsx

@@ -1,32 +0,0 @@
-/**
- * 人员-考勤
- */
-import React from 'react';
-import moment from 'moment';
-import Exeception from './Exeception';
-import WorkingHours from './WorkingHours';
-import Record from './Record';
-import './index.less';
-
-interface AttendanceTypeProps {
-    id: string;
-}
-
-const Attendance: React.FC<AttendanceTypeProps> = props => {
-    const { id } = props;
-    const date = moment().format('YYYY-MM-DD');
-
-    return (
-        <div className="staff-attend">
-            <div className="staff-attend-head">
-                <Exeception id={id} date={date} />
-                <WorkingHours id={id} date={date} />
-            </div>
-            <div className="staff-attend-record">
-                <Record id={id} />
-            </div>
-        </div>
-    );
-};
-
-export default Attendance;

package/src/vtx-staff-modal/components/BaseInfo/Lcfx.tsx

@@ -1,106 +0,0 @@
-import React from 'react';
-import moment from 'moment';
-import * as echarts from 'echarts';
-import ReactEcharts from 'echarts-for-react';
-import useSettings from '../../../vm-hooks/useSettings';
-import { BaseService } from '../../api';
-import NoData from '../../../vm-nodata';
-interface LcfxProps {
-    id: string;
-}
-
-const Lcfx = (props: LcfxProps) => {
-    const { chartFontColor } = useSettings();
-    const { id } = props;
-    const { mileAnalysisRes } = BaseService.useMileAnalysis(
-        id,
-        moment().startOf('M').format('YYYY-MM-DD'),
-        moment().format('YYYY-MM-DD'),
-    );
-    const { names, values } = mileAnalysisRes;
-    let option = {
-        tooltip: {
-            trigger: 'axis',
-        },
-        grid: {
-            top: 36,
-            left: '6%',
-            right: '5%',
-            bottom: 20,
-        },
-        legend: {
-            show: false,
-        },
-        xAxis: [
-            {
-                type: 'category',
-                data: names || [],
-                axisPointer: {
-                    type: 'shadow',
-                },
-                axisTick: {
-                    show: false,
-                },
-                axisLabel: {
-                    color: chartFontColor,
-                },
-            },
-        ],
-        yAxis: [
-            {
-                type: 'value',
-                name: '(km)',
-                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: [
-            {
-                name: '里程',
-                type: 'bar',
-                barWidth: 18,
-                data: values?.length > 0 ? values[0] : [],
-                itemStyle: {
-                    color: new echarts.graphic.LinearGradient(0, 1, 0, 0, [
-                        {
-                            offset: 0,
-                            color: '#1677FF',
-                        },
-                        {
-                            offset: 1,
-                            color: '#62FDF3',
-                        },
-                    ]),
-                },
-            },
-        ],
-    };
-
-    return names?.length > 0 ? (
-        <ReactEcharts
-            option={option}
-            notMerge
-            lazyUpdate
-            style={{ height: '100%', width: '100%' }}
-        />
-    ) : (
-        <NoData style={{ height: '100%', width: '100%' }} />
-    );
-};
-
-export default Lcfx;

package/src/vtx-staff-modal/components/BaseInfo/TodayWork.tsx

@@ -1,34 +0,0 @@
-/**
- * 今日作业
- */
-import React from 'react';
-import NoData from '../../../vm-nodata';
-
-export default function TodayWork({ todayWorkRes }: { todayWorkRes: any }) {
-    return (
-        <div className="today-work">
-            {todayWorkRes?.length > 0 ? (
-                todayWorkRes.map((ele: any, index: number) => (
-                    <div className="today-work-item" key={index}>
-                        <div className="today-work-item--name">{`${ele?.shiftName} (${ele?.shiftStartTime}-${ele?.shiftEndTime})`}</div>
-                        <div className="today-work-item--content">
-                            排班区域：{ele?.shiftWorkElementNames || '--'}
-                        </div>
-                        <div className="today-work-item--content">
-                            考勤时间：{`${ele?.clockInTime || ''}-${ele?.clockOutTime || ''}`}
-                        </div>
-                        <div className="today-work-item--content">
-                            完成度：
-                            <span className="today-work-item--value">
-                                {ele?.completionRate || 0}%
-                            </span>
-                            {` (${ele?.clockDurationStr || 0}/${ele?.shiftDurationStr || 0})`}
-                        </div>
-                    </div>
-                ))
-            ) : (
-                <NoData style={{ width: '100%', height: '80%' }} />
-            )}
-        </div>
-    );
-}

package/src/vtx-staff-modal/components/BaseInfo/WorkStatic.tsx

@@ -1,131 +0,0 @@
-/**
- * 作业统计
- */
-import React from 'react';
-import moment from 'moment';
-import ReactEcharts from 'echarts-for-react';
-import { BaseService } from '../../api';
-import useSettings from '../../../vm-hooks/useSettings';
-import ImageText from '../../../vm-image-text';
-import NoData from '../../../vm-nodata';
-
-import zzx from '../../imgs/zzx.png';
-import rjzx from '../../imgs/rjzx.png';
-
-import zzxLight from '../../imgs/zzx_light.png';
-import rjzxLight from '../../imgs/rjzx_light.png';
-
-interface DataType {
-    statusName: string;
-    duration: number;
-    durationStr: string;
-}
-
-export default function WorkStatic({ id }: { id: string }) {
-    const { chartColor, chartFontColor, isDark } = useSettings();
-    const { workStaticRes } = BaseService.useWorkStatic(
-        id,
-        moment()
-            .startOf('M')
-            .format('YYYY-MM-DD'),
-        moment().format('YYYY-MM-DD'),
-    );
-
-    let option = {
-        color: chartColor,
-        backgroundColor: 'transparent',
-        tooltip: {
-            show: true,
-            trigger: 'item',
-        },
-
-        legend: {
-            orient: 'vertical',
-            left: '50%',
-            top: 'middle',
-            align: 'left',
-            itemGap: 8,
-            itemWidth: 10,
-            itemHeight: 10,
-            formatter: function(name: string) {
-                const value = workStaticRes?.details.find(
-                    (item: DataType) => item.statusName === name,
-                );
-                if (value) {
-                    return `\t\t${name}\t\t${value.durationStr}\t\t`;
-                } else {
-                    return '';
-                }
-            },
-            textStyle: {
-                fontSize: 14,
-                color: chartFontColor,
-            },
-            pageIconColor: chartFontColor,
-            pageIconInactiveColor: chartFontColor,
-            pageTextStyle: {
-                color: chartFontColor,
-            },
-        },
-        series: [
-            {
-                type: 'pie',
-                radius: ['55%', '75%'],
-                center: ['25%', '50%'],
-                hoverAnimation: true,
-                z: 10,
-                itemStyle: {
-                    normal: {
-                        borderWidth: 2,
-                        borderColor: isDark ? '#003359' : '#ffffff',
-                    },
-                },
-                label: {
-                    show: false,
-                },
-                data:
-                    workStaticRes?.details?.length > 0
-                        ? workStaticRes?.details.map((ele: DataType) => ({
-                              name: ele.statusName,
-                              value: ele.duration / 1000,
-                              durationStr: ele.durationStr,
-                          }))
-                        : [],
-                labelLine: {
-                    show: false,
-                },
-            },
-        ],
-    };
-
-    return (
-        <div className="staff-base-static">
-            <div className="staff-base-static-head">
-                <ImageText
-                    src={isDark ? zzx : zzxLight}
-                    name="总在线"
-                    specialCase={`${workStaticRes?.totalOnLineTimeStr || '--'}`}
-                    style={{ marginRight: 0 }}
-                />
-                <ImageText
-                    src={isDark ? rjzx : rjzxLight}
-                    name="日均在线"
-                    specialCase={`${workStaticRes?.avgOnLineTimeStr || '--'}`}
-                    style={{ marginRight: 0 }}
-                />
-            </div>
-            <div className="staff-base-static-chart">
-                {workStaticRes?.details?.length > 0 ? (
-                    <ReactEcharts
-                        option={option}
-                        notMerge
-                        lazyUpdate
-                        style={{ height: '100%', width: '100%' }}
-                    />
-                ) : (
-                    <NoData style={{ width: '100%', height: '100%' }} />
-                )}
-            </div>
-        </div>
-    );
-}

package/src/vtx-staff-modal/components/BaseInfo/index.less

@@ -1,146 +0,0 @@
-.flex-start {
-    display: flex;
-    justify-content: start;
-    align-items: start;
-}
-
-.staff-base {
-    .flex-start();
-    padding: 6px 10px;
-
-    &-left {
-        width: 481px;
-        height: 100%;
-        padding: 20px;
-        margin-right: 10px;
-        background-color: var(--bg-color2);
-        &--text {
-            color: var(--title-color2);
-            margin-bottom: 19px;
-            img {
-                width: 19px;
-                height: 20px;
-                margin-right: 10px;
-            }
-        }
-        &--online {
-            width: 80px;
-            height: 28px;
-            float: right;
-            margin-right: 39px;
-            background: var(--block-bg-color2);
-            border-radius: 14px;
-            font-size: 14px;
-            font-family: HiraginoSansGB-W3, HiraginoSansGB;
-            font-weight: normal;
-            color: var(--info-active);
-            text-align: center;
-            line-height: 28px;
-        }
-        &--gif {
-            margin: 48px auto;
-            width: 298px;
-            height: 323px;
-            background-image: url('../../imgs/staff.png');
-            background-repeat: no-repeat;
-            background-size: 100% 100%;
-        }
-        &--pngs {
-            &-item {
-                display: flex;
-                justify-content: center;
-                align-items: center;
-                margin-bottom: 24px;
-                img {
-                    width: 64px;
-                    height: 64px;
-                    margin-right: 27px;
-                }
-
-                &-name {
-                    width: 100px;
-                    font-size: 12px;
-                    font-family: HiraginoSansGB-W3, HiraginoSansGB;
-                    color: var(--label-color);
-                    line-height: 18px;
-                }
-                &-value {
-                    width: 140px;
-                    color: var(--title-color);
-                    line-height: 32px;
-                    span {
-                        font-size: 22px;
-                        font-family: DINAlternate-Bold, DINAlternate;
-                        font-weight: bold;
-                    }
-                }
-            }
-        }
-    }
-    &-right {
-        width: calc(~'100% - 481px - 12px');
-        display: flex;
-        flex-wrap: wrap;
-
-        &-base {
-            width: 320px;
-            height: 362px;
-            padding: 24px 20px 0 20px;
-            margin-right: 10px;
-            background-color: var(--bg-color2);
-        }
-        &-right {
-            padding: 24px 20px 8px 20px;
-            width: calc(~'100% - 320px - 20px');
-            background-color: var(--bg-color2);
-        }
-    }
-
-    .today-work {
-        height: 282px;
-        overflow-y: auto;
-
-        &-item {
-            padding: 10px 15px;
-            font-size: 14px;
-            line-height: 24px;
-            width: 100%;
-            background: var(--bg-color2);
-            border-radius: 2px;
-            border: 1px solid rgba(80, 250, 229, 0.37);
-            &--name {
-                color: var(--label-color);
-            }
-            &--content {
-                color: var(--title-color);
-            }
-            &--value {
-                font-size: 16px;
-                color: var(--info-active2);
-            }
-        }
-    }
-
-    &-static {
-        &-head {
-            display: flex;
-            justify-content: space-between;
-            align-items: center;
-        }
-        &-chart {
-            height: 230px;
-            width: 100%;
-        }
-    }
-
-    .staff-wgfx {
-        width: calc(100% - 10px);
-        padding: 10px;
-        margin-top: 10px;
-        background-color: var(--bg-color2);
-        &-content {
-            height: 270px;
-            width: 100%;
-        }
-    }
-}

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

@@ -1,157 +0,0 @@
-import React, { useEffect } from 'react';
-import { useSetState } from 'ahooks';
-import moment from 'moment';
-import useSettings from '../../../vm-hooks/useSettings';
-import SubTitle from '../../../vm-sub-title';
-import SubTabs, { SubTabPane } from '../../../vm-sub-tabs';
-import Base from '../../../vm-info-collection';
-import TodayWork from './TodayWork';
-import WorkStatic from './WorkStatic';
-import Lcfx from './Lcfx';
-import { BaseService } from '../../api';
-import './index.less';
-
-import refresh from '../../imgs/refresh.png';
-import position from '../../imgs/position.png';
-import todayRun from '../../imgs/todayWork.png';
-import todayOnline from '../../imgs/todayOnline.png';
-
-import refreshLight from '../../../vtx-car-modal/imgs/refresh_light.png';
-import positionLight from '../../../vtx-car-modal/imgs/position_light.png';
-import todayRunLight from '../../imgs/todayWork_light.png';
-import todayOnlineLight from '../../imgs/todayOnline_light.png';
-interface BaseProps {
-    id: string;
-}
-
-const BaseInfo = (props: BaseProps) => {
-    const { id } = props;
-    const { theme, isDark } = useSettings();
-    const [state, setState] = useSetState({
-        baseActiveKey: '1',
-        activeKey: '1',
-    });
-    const { baseActiveKey, activeKey } = state;
-    const { baseInfo, info } = BaseService.useBaseInfo(id);
-    const { workInfoRes } = BaseService.useWorkInfo(
-        id,
-        moment().format('YYYY-MM-DD'),
-        moment().format('YYYY-MM-DD'),
-    );
-
-    // 今日作业，接口无数据代表无排班
-    const { todayWorkRes } = BaseService.useTodayWork(
-        id,
-        moment().format('YYYY-MM-DD'),
-        moment().format('YYYY-MM-DD'),
-    );
-
-    let rigthTabs = [
-        {
-            name: '作业统计',
-            key: '2',
-            content: <WorkStatic id={id} />,
-        },
-    ];
-    if (todayWorkRes?.length > 0) {
-        rigthTabs.unshift({
-            name: '今日作业',
-            key: '1',
-            content: <TodayWork todayWorkRes={todayWorkRes} />,
-        });
-    }
-
-    useEffect(() => {
-        if (todayWorkRes?.length > 0) {
-            setState({
-                activeKey: '1',
-            });
-        } else {
-            setState({
-                activeKey: '2',
-            });
-        }
-    }, [JSON.stringify(todayWorkRes)]);
-
-    const baseTabContent = <Base data={baseInfo} gap={18} />;
-    return (
-        <div className={`staff-base ${theme}`}>
-            <div className="staff-base-left">
-                <div className="staff-base-left--text">
-                    <img src={isDark ? refresh : refreshLight} />
-                    {info?.updateTime || '--'}
-                </div>
-                <div className="staff-base-left--text">
-                    <img src={isDark ? position : positionLight} />
-                    {info?.address || '--'}
-                </div>
-                <div className="staff-base-left--online">在线</div>
-                <div className="staff-base-left--gif"></div>
-                <div className="staff-base-left--pngs">
-                    <div className="staff-base-left--pngs-item">
-                        <img src={isDark ? todayRun : todayRunLight} />
-                        <div className="staff-base-left--pngs-item-name">今日行走</div>
-                        <div className="staff-base-left--pngs-item-value">
-                            <span>{workInfoRes?.totalMileage?.toFixed(2) || 0}</span>km
-                        </div>
-                    </div>
-                    <div className="staff-base-left--pngs-item">
-                        <img src={isDark ? todayOnline : todayOnlineLight} />
-                        <div className="staff-base-left--pngs-item-name">今日在线</div>
-                        <div className="staff-base-left--pngs-item-value">
-                            <span>{workInfoRes?.onlineTimeStr || '--'}</span>
-                        </div>
-                    </div>
-                </div>
-            </div>
-            <div className="staff-base-right">
-                <div className="staff-base-right-base">
-                    <SubTabs
-                        onChange={(key: string) => {
-                            setState({
-                                baseActiveKey: key,
-                            });
-                        }}
-                        activeKey={baseActiveKey}
-                    >
-                        {[
-                            {
-                                name: '基本信息',
-                                key: '1',
-                                content: baseTabContent,
-                            },
-                        ].map((ele: any) => (
-                            <SubTabPane subKey={ele.key} key={ele.key} tab={ele.name}>
-                                {ele.content}
-                            </SubTabPane>
-                        ))}
-                    </SubTabs>
-                </div>
-                <div className="staff-base-right-right">
-                    <SubTabs
-                        onChange={(key: string) => {
-                            setState({
-                                activeKey: key,
-                            });
-                        }}
-                        activeKey={activeKey}
-                    >
-                        {rigthTabs.map((ele: any) => (
-                            <SubTabPane key={ele.key} subKey={ele.key} tab={ele.name}>
-                                {ele.content}
-                            </SubTabPane>
-                        ))}
-                    </SubTabs>
-                </div>
-                <div className="staff-wgfx">
-                    <SubTitle title="里程分析" />
-                    <div className="staff-wgfx-content">
-                        <Lcfx id={id} />
-                    </div>
-                </div>
-            </div>
-        </div>
-    );
-};
-
-export default BaseInfo;

package/src/vtx-staff-modal/components/Equipment/index.less

@@ -1,28 +0,0 @@
-.staff-equip {
-    padding: 10px;
-    min-height: 680px;
-    &-main {
-        margin-bottom: 10px;
-        padding: 20px;
-        background-color: var(--bg-color2);
-
-        &-item-wrap {
-            display: flex;
-            flex-wrap: wrap;
-        }
-
-        &-item {
-            width: 50%;
-            display: flex;
-            justify-content: start;
-            margin-bottom: 8px;
-            &-label {
-                color: var(--label-color);
-                margin-right: 8px;
-            }
-            &-value {
-                color: var(--info-color);
-            }
-        }
-    }
-}