Skip to content

C
CivWeb
Commit 49febe70 authored by 曾婧's avatar 曾婧
Browse files
Options

Merge branch 'dev-hn'

parents b5e152bb b6b976d6
Pipeline #48399 skipped with stages
        Hide whitespace changes
        Inline Side-by-side
        Showing with 731 additions and 131 deletions
        src/assets/basic/HN-logo.png 0 → 100644
        View file @ 49febe70
        This diff was suppressed by a .gitattributes entry.
        src/components/GlobalHeader/HNRightContent.js
        View file @ 49febe70
        /*
        * @Author: ZengJing
        * @Date: 2022-04-14 10:25:39
        * @LastEditTime: 2022-04-14 10:30:09
        * @LastEditors: ZengJing
        * @Description:
        * @FilePath: \CivWeb\src\components\GlobalHeader\HNRightContent.js
        */
        import React, { useState, useRef } from 'react';
        import { message } from 'antd';
        import _ from 'lodash';
        ......@@ -13,7 +5,8 @@ import { connect } from 'react-redux';
        import Icon from '@ant-design/icons';
        import classNames from 'classnames';
        import { useHistory } from '@wisdom-utils/runtime';
        import { HeaderSearch, useIntl, AvatarDropdown as Avatar } from '@wisdom-utils/components';
        import { HeaderSearch, useIntl} from '@wisdom-utils/components';
        import { AvatarDropdown as Avatar } from '../../layouts/AppLayout/components/GlobalHeader';
        import { actionCreators } from '../../containers/App/store';
        import styles from './index.less';
        import NoticeIconView from './NoticeIconView';
        ......@@ -70,55 +63,17 @@ const homeSvg = () => (
        </svg>
        );
        const favitorSvg = () => (
        <svg
        t="1631171489722"
        className="icon"
        viewBox="0 0 1024 1024"
        version="1.1"
        xmlns="http://www.w3.org/2000/svg"
        p-id="16457"
        width="24"
        height="24"
        >
        <path
        d="M512 87.806c-234.721 0-424.194 189.474-424.194 424.194s189.474 424.194 424.194 424.194 424.194-189.474 424.194-424.194-189.474-424.194-424.194-424.194zM783.484 442.715l-137.155 100.393c-7.069 5.655-9.899 14.141-7.069 22.624l52.317 161.194c5.655 18.382-15.553 33.935-31.108 22.624l-137.155-100.393c-7.069-5.655-16.967-5.655-24.037 0l-137.155 100.393c-15.553 11.312-36.763-4.242-31.108-22.624l53.731-162.608c2.829-8.484 0-16.967-7.069-22.624l-137.155-100.393c-15.553-11.312-7.069-35.349 11.312-35.349h169.678c8.484 0 16.967-5.655 18.382-14.141l52.317-161.194c5.655-18.382 32.522-18.382 38.177 0l52.317 161.194c2.829 8.484 9.899 14.141 18.382 14.141h169.678c21.21 0 28.278 25.452 12.725 36.763z"
        p-id="16458"
        fill="hsla(221, 100%, 95%, 0.7)"
        />
        </svg>
        );
        const themeSvg = () => (
        <svg
        t="1631362986014"
        className="icon"
        viewBox="0 0 1024 1024"
        version="1.1"
        xmlns="http://www.w3.org/2000/svg"
        width="24"
        height="24"
        >
        <path
        d="M552.75 563.239c44.4 26.348 99.1 26.348 143.5 0C740.65 536.89 768 488.197 768 435.5c0-81.462-64.247-147.5-143.5-147.5S481 354.038 481 435.5c0 52.697 27.35 101.39 71.75 127.739z"
        fill="hsla(221, 100%, 95%, 0.7)"
        p-id="2351"
        />
        <path
        d="M471.264 952c-18.842 0-38.581-1.796-60.115-4.49l-5.384-0.899c-152.533-23.352-256.614-171.55-261.1-177.837-147.149-224.541-73.574-451.777 65.5-577.52C348.34 65.511 578.934 11.621 780.814 174.19c130.102 105.085 169.58 250.588 171.375 256.875v1.797c18.843 102.39 3.59 177.836-45.76 226.337-75.368 72.752-200.086 49.4-217.134 45.807-23.328-2.695-40.376 4.49-52.938 19.76-13.458 17.064-16.15 39.518-11.664 52.991 12.562 37.723 14.356 66.464 5.384 88.02C604.058 922.361 551.12 952 471.264 952z m-51.973-80.488l5.083 0.849c82.179 12.72 132.164-3.393 152.497-49.188 0-0.849 4.236-11.873-6.778-45.796-11.013-30.53-2.541-70.39 19.486-97.528 22.875-28.834 56.763-41.556 96.581-37.315l2.542 0.848c0.847 0 105.9 22.898 160.122-29.683 33.04-32.226 43.207-88.199 28.805-166.221-3.39-11.025-39.819-130.603-144.872-214.562-166.053-135.69-356.674-90.743-471.894 13.57-105.9 96.68-183.843 280.71-53.374 480.007 0.848 0 89.804 127.21 211.802 145.02z"
        fill="hsla(221, 100%, 95%, 0.7)"
        p-id="2352"
        />
        <path
        d="M203 529c0-29.823 24.177-54 54-54s54 24.177 54 54-24.177 54-54 54-54-24.177-54-54z m90-115.235A54 54 0 0 1 266 367c0-29.823 24.177-54 54-54s54 24.177 54 54a54 54 0 0 1-81 46.765zM427 278c0-29.823 24.177-54 54-54s54 24.177 54 54-24.177 54-54 54-54-24.177-54-54z m180 44c0-29.823 24.177-54 54-54s54 24.177 54 54-24.177 54-54 54-54-24.177-54-54z m90 144c0-29.823 24.177-54 54-54s54 24.177 54 54-24.177 54-54 54-54-24.177-54-54z"
        fill="hsla(221, 100%, 95%, 0.7)"
        />
        </svg>
        );
        const favitorSvg = () => (<svg t="1631171489722" className="icon" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="16457" width="24" height="24"><path d="M512 87.806c-234.721 0-424.194 189.474-424.194 424.194s189.474 424.194 424.194 424.194 424.194-189.474 424.194-424.194-189.474-424.194-424.194-424.194zM783.484 442.715l-137.155 100.393c-7.069 5.655-9.899 14.141-7.069 22.624l52.317 161.194c5.655 18.382-15.553 33.935-31.108 22.624l-137.155-100.393c-7.069-5.655-16.967-5.655-24.037 0l-137.155 100.393c-15.553 11.312-36.763-4.242-31.108-22.624l53.731-162.608c2.829-8.484 0-16.967-7.069-22.624l-137.155-100.393c-15.553-11.312-7.069-35.349 11.312-35.349h169.678c8.484 0 16.967-5.655 18.382-14.141l52.317-161.194c5.655-18.382 32.522-18.382 38.177 0l52.317 161.194c2.829 8.484 9.899 14.141 18.382 14.141h169.678c21.21 0 28.278 25.452 12.725 36.763z" p-id="16458" fill="hsla(221, 100%, 95%, 0.7)"></path></svg>);
        const themeSvg = () => (<svg t="1631362986014" className="icon" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" width="24" height="24">
        <path d="M552.75 563.239c44.4 26.348 99.1 26.348 143.5 0C740.65 536.89 768 488.197 768 435.5c0-81.462-64.247-147.5-143.5-147.5S481 354.038 481 435.5c0 52.697 27.35 101.39 71.75 127.739z" fill="hsla(221, 100%, 95%, 0.7)" p-id="2351"></path>
        <path d="M471.264 952c-18.842 0-38.581-1.796-60.115-4.49l-5.384-0.899c-152.533-23.352-256.614-171.55-261.1-177.837-147.149-224.541-73.574-451.777 65.5-577.52C348.34 65.511 578.934 11.621 780.814 174.19c130.102 105.085 169.58 250.588 171.375 256.875v1.797c18.843 102.39 3.59 177.836-45.76 226.337-75.368 72.752-200.086 49.4-217.134 45.807-23.328-2.695-40.376 4.49-52.938 19.76-13.458 17.064-16.15 39.518-11.664 52.991 12.562 37.723 14.356 66.464 5.384 88.02C604.058 922.361 551.12 952 471.264 952z m-51.973-80.488l5.083 0.849c82.179 12.72 132.164-3.393 152.497-49.188 0-0.849 4.236-11.873-6.778-45.796-11.013-30.53-2.541-70.39 19.486-97.528 22.875-28.834 56.763-41.556 96.581-37.315l2.542 0.848c0.847 0 105.9 22.898 160.122-29.683 33.04-32.226 43.207-88.199 28.805-166.221-3.39-11.025-39.819-130.603-144.872-214.562-166.053-135.69-356.674-90.743-471.894 13.57-105.9 96.68-183.843 280.71-53.374 480.007 0.848 0 89.804 127.21 211.802 145.02z" fill="hsla(221, 100%, 95%, 0.7)" p-id="2352"></path>
        <path d="M203 529c0-29.823 24.177-54 54-54s54 24.177 54 54-24.177 54-54 54-54-24.177-54-54z m90-115.235A54 54 0 0 1 266 367c0-29.823 24.177-54 54-54s54 24.177 54 54a54 54 0 0 1-81 46.765zM427 278c0-29.823 24.177-54 54-54s54 24.177 54 54-24.177 54-54 54-54-24.177-54-54z m180 44c0-29.823 24.177-54 54-54s54 24.177 54 54-24.177 54-54 54-54-24.177-54-54z m90 144c0-29.823 24.177-54 54-54s54 24.177 54 54-24.177 54-54 54-54-24.177-54-54z" fill="hsla(221, 100%, 95%, 0.7)"></path></svg>)
        const OrderIcon = props => <Icon component={orderSvg} {...props} />;
        const HomeIcon = props => <Icon component={homeSvg} {...props} />;
        const FavitorIcon = props => <Icon component={favitorSvg} {...props} />;
        const ThemeIcon = props => <Icon component={themeSvg} {...props} />;
        const MESSAGE_BOX_URL = 'product/maintenance/CaseManage/CaseDoingBox/StardCaseDoingBoxView|isDelay=1';
        const FavitorIcon = props => <Icon component={favitorSvg} {...props}/>
        const ThemeIcon = props => <Icon component={themeSvg} {...props}/>
        const MESSAGE_BOX_URL =
        'product/maintenance/CaseManage/CaseDoingBox/StardCaseDoingBoxView|isDelay=1';
        export const getConfig = (widgets, url, key) => {
        let widgetconfig = {};
        ......@@ -127,7 +82,8 @@ export const getConfig = (widgets, url, key) => {
        for (let i = 0; i < widgets.length; i++) {
        const widget = widgets[i];
        if (widget && widget[key]) widget[key] = widget[key].replace(/\\/g, '/').trim();
        if (widget && widget[key])
        widget[key] = widget[key].replace(/\\/g, '/').trim();
        // eslint-disable-next-line eqeqeq
        if (widget[key] && url.toLowerCase() === widget[key].toLowerCase()) {
        widgetconfig = widget;
        ......@@ -158,14 +114,14 @@ const GlobalHeaderRight = props => {
        }
        const intl = useIntl();
        console.log('props.global ==', props.global);
        const goHome = event => {
        event.stopPropagation();
        let url = _.isString(props.global.get('homepage'))
        ? props.global.get('homepage')
        : props.global.get('homepage.url');
        if (!props.global.get('home')) {
        url = `civweb4/${url.replace(/^\//, '').replace(/^civweb4\//, '')}`;
        if(!props.global.get('home')) {
        url = `civweb4/${url.replace(/^\//, '').replace(/^civweb4\//, '')}`
        }
        window.share.event.emit('goHome', `/${url}`);
        // url ? (
        ......@@ -176,6 +132,7 @@ const GlobalHeaderRight = props => {
        // ) : null;
        };
        const handleOrder = event => {
        event.stopPropagation();
        const widgetConfig = getConfig(
        ......@@ -195,18 +152,16 @@ const GlobalHeaderRight = props => {
        const handlerFavitor = event => {
        // setCurrentIndex(1);
        history.push('/commonmenu');
        window.share &&
        window.share.event &&
        window.share.event.emit('event:favitor', {
        name: '常用',
        path: '/commonmenu',
        icon: <FavitorIcon />,
        });
        };
        window.share && window.share.event && window.share.event.emit('event:favitor', {
        name: "常用",
        path: '/commonmenu',
        icon: <FavitorIcon/>
        });
        }
        const handlerTheme = () => {
        window.share.event.emit('event:theme');
        };
        }
        const handleSelect = (value, data) => {
        window.share.event.emit('addTips', options, data);
        ......@@ -225,13 +180,15 @@ const GlobalHeaderRight = props => {
        // eslint-disable-next-line no-unused-expressions
        value
        ? search.search(area, (status, res) => {
        if (res && res.tips) {
        if (res && res.tips) {
        const result = res.tips.map(item => {
        item.value = item.name;
        item.label = (
        <>
        <span>{item.name}</span>
        <span style={{ color: '#c1c1c1' }}>{item.district + item.address}</span>
        <span style={{ color: '#c1c1c1' }}>
        {item.district + item.address}
        </span>
        </>
        );
        return item;
        ......@@ -242,53 +199,47 @@ const GlobalHeaderRight = props => {
        })
        : setOptions([]);
        };
        return (
        <div className={className}>
        {/* <HeaderSearch
        className={`${styles.action} ${styles.search} ${styles.extendsearch}`}
        placeholder={intl.formatMessage({ id: 'component.search.menu.placeholder' })}
        offset="46px"
        defaultValue=""
        mode="tiled"
        options={options}
        {...props}
        onSelect={handleSelect}
        onChange={handleSearch}
        onSearch={handleSearch}
        /> */}
        <HeaderSearch
        className={`${styles.action} ${styles.search} ${styles.extendsearch}`}
        placeholder={intl.formatMessage({id:'component.search.menu.placeholder'})}
        offset="46px"
        defaultValue=""
        mode="tiled"
        options={options}
        {...props}
        onSelect={handleSelect}
        onChange={handleSearch}
        onSearch={handleSearch}
        />
        <div className={styles.nav}>
        {/* <div className={classNames(styles.item)} onClick={goHome} ref={homeRef}>
        <HomeIcon title={intl.formatMessage({ id: 'component.header.icon.home' })} />
        <span>首页</span>
        </div> */}
        {/* {// 云平台去掉常用菜单
        props.global &&
        props.global.userInfo &&
        props.global.userInfo.Groups &&
        props.global.userInfo.Groups.length ? null : (
        <div className={classNames(styles.item)} onClick={handlerFavitor} ref={favitorRef}>
        <FavitorIcon />
        <span>常用</span>
        </div>
        )} */}
        {/* <div className={classNames(styles.item)} onClick={handlerTheme}>
        <ThemeIcon/>
        <span>主题</span>
        </div> */}
        {/* <div className={classNames(styles.item)}>
        <OrderIcon onClick={handleOrder} title={intl.formatMessage({ id: 'component.header.icon.order' })} />
        <span>工单</span>
        </div> */}
        <div className={classNames(styles.item)} onClick={goHome} ref={homeRef}>
        <HomeIcon title={intl.formatMessage({id: 'component.header.icon.home'})} />
        <span>首页</span>
        </div>
        {
        // 云平台去掉常用菜单
        props.global && props.global.userInfo && props.global.userInfo.Groups && props.global.userInfo.Groups.length
        ? null
        : (
        <div className={classNames(styles.item)} onClick={handlerFavitor} ref={favitorRef}>
        <FavitorIcon></FavitorIcon>
        <span>常用</span>
        </div>
        )
        }
        {/*<div className={classNames(styles.item)} onClick={handlerTheme}>*/}
        {/* <ThemeIcon/>*/}
        {/* <span>主题</span>*/}
        {/*</div>*/}
        <div className={classNames(styles.item)}>
        <OrderIcon onClick={handleOrder} title={intl.formatMessage({id: 'component.header.icon.order'})} />
        <span>工单</span>
        </div>
        </div>
        {/* <NoticeIconView title={intl.formatMessage({ id: 'component.header.icon.alarm' })} /> */}
        <Avatar
        menu
        config={props.global}
        updateCurrentIndex={props.updateCurrentIndex}
        updateConfig={props.updateConfig}
        logout={props.logout}
        />
        <NoticeIconView title={intl.formatMessage({id: 'component.header.icon.alarm'})} />
        <Avatar menu config={props.global} updateCurrentIndex={props.updateCurrentIndex} updateConfig={props.updateConfig} logout={props.logout}/>
        </div>
        );
        };
        ......@@ -315,17 +266,17 @@ const mapDispatchToProps = dispatch => ({
        dispatch(actionCreators.clearRecentProduct());
        },
        updateCurrentIndex(index) {
        dispatch(actionCreators.updateCurrentIndex(index));
        dispatch(actionCreators.updateCurrentIndex(index))
        },
        updateConfig(config) {
        dispatch(actionCreators.getConfig(config));
        dispatch(actionCreators.getConfig(config))
        },
        updateComplexConfig(config) {
        dispatch(actionCreators.updateComplexConfig(config));
        dispatch(actionCreators.updateComplexConfig(config))
        },
        logout() {
        dispatch(actionCreators.logout());
        },
        dispatch(actionCreators.logout())
        }
        });
        export default connect(
        mapStateToProps,
        ......
        src/layouts/AppLayout/components/GlobalHeader/AvatarDropdown.js 0 → 100644
        View file @ 49febe70
        import React, { useContext } from 'react';
        import './index.less';
        import { Avatar, ConfigProvider, Form, Input, message, Modal, Popover, Spin, Upload } from 'antd';
        import { withRouter } from 'react-router';
        import { request } from '@wisdom-utils/utils';
        import { FormattedMessage, useIntl } from '@wisdom-utils/components/lib/AppLayout/locales/localeExports';
        import globalHeader from '@wisdom-utils/components/lib/AppLayout/locales/zh-CN/globalHeader';
        import { appService } from '@wisdom-utils/components/lib/AppLayout/notifier/api';
        import { API } from '@wisdom-utils/components/lib/AppLayout/notifier/api/service/user';
        // eslint-disable-next-line import/named
        const GlobalContext = React.createContext(ConfigProvider.ConfigContext);
        const formItemLayout = {
        labelCol: {
        xs: { span: 4 },
        sm: { span: 4 },
        },
        };
        /* eslint-disable */
        const getIOT = () =>
        window.globalConfig.loginTemplate === 'Dark - IOTMultiLogin.html' ||
        window.globalConfig.loginTemplate === '新春 - 智联.html';
        class AvatarDropdown extends React.Component {
        /* eslint-disable no-unused-vars */
        constructor(props) {
        super(props);
        let {
        currentUser = {
        avatar: this.transformAvatarImage(),
        name:
        (props.config && props.config.userInfo && props.config.userInfo.fullName) || 'Serati Ma',
        },
        } = this.props;
        this.state = {
        currentUser: currentUser,
        visible: false,
        popVisible: false,
        path: null,
        version: null,
        action: API.UPLOAD_FILE_URL,
        };
        }
        loginout = (event) => {
        // eslint-disable-next-line no-undef
        this.props.logout();
        if (
        window.globalConfig.style === 'ios' &&
        window.globalConfig.loginTemplate === 'IOSCloud.html'
        ) {
        window.location.href = `${window.location.origin}/#login`;
        return false;
        }
        // console.log(this.props)
        // this.props.history.push('/login')
        // window.location.reload();
        //
        };
        getRoles = () => {
        const roles = this.props.config.userInfo.roles || [];
        const ret = [];
        roles.forEach((item) => {
        ret.push(item.name);
        });
        return ret.join(',');
        };
        showModal = (event) => {
        event.stopPropagation();
        this.setState({
        visible: true,
        });
        };
        handleOk = (event, form) => {
        event.stopPropagation();
        form
        .validateFields()
        .then((res) => {
        const params = getIOT()
        ? {
        newPassword: res.newPwd,
        phone: window.globalConfig.userInfo.Phone,
        }
        : {
        password: res.oldPwd,
        newpassword: res.newPwd,
        token: window.globalConfig.token,
        };
        appService
        .changePassword(params)
        .then((res) => {
        if (res.success) {
        //message.success(useIntl().formatMessage({id: 'component.account.password.update.success'}));
        message.success(globalHeader['component.account.password.update.success']);
        setTimeout(() => {
        this.setState({
        visible: false,
        });
        }, 300);
        } else {
        message.error(
        useIntl().formatMessage({ id: 'component.account.oldpassword.errorMessage' }),
        );
        }
        })
        .catch((error) => {
        message.error(
        useIntl().formatMessage({ id: 'component.account.password.update.fail' }),
        );
        });
        })
        .catch((error) => {
        console.log(error);
        });
        };
        handleCancel = (event, form) => {
        event.stopPropagation();
        form.resetFields();
        this.setState({
        visible: false,
        });
        };
        transformAvatarImage() {
        const { userInfo } = this.props.config;
        const defaultImage = `${window.location.origin}/civweb4/assets/images/icon/熊猫新2.png`;
        let image = defaultImage;
        if (userInfo && userInfo.UserImge && userInfo.UserImge.indexOf('个人信息') > -1) {
        image = `/cityinterface/rest/services/filedownload.svc/download/${userInfo.UserImge}`;
        } else if (
        userInfo.UserImge &&
        userInfo.UserImge !== '' &&
        userInfo.UserImge !== 'default_user.png'
        ) {
        image = userInfo.UserImge;
        } else if (userInfo.WxImage && userInfo.WxImage !== '') {
        image = userInfo.WxImage;
        }
        return image;
        }
        beforeUpload(file) {
        const isJpgOrPng = file.type === 'image/jpeg' || file.type === 'image/png';
        if (!isJpgOrPng) {
        message.error('You can only upload JPG/PNG file!');
        }
        const isLt2M = file.size / 1024 / 1024 < 2;
        if (!isLt2M) {
        message.error('Image must smaller than 2MB!');
        }
        const path = new Date().getTime();
        this.setState({
        path: path,
        action: this.state.action.replace('{path}', path).replace('{filename}', file.name),
        });
        return isJpgOrPng && isLt2M;
        }
        handleChange(data) {
        console.log(data);
        }
        componentDidMount() {
        appService
        .getVersion({
        ignoreSite: true,
        })
        .then((res) => {
        if (res.success) {
        this.setState({
        version: res.message,
        });
        }
        })
        .catch((error) => {
        message.error(useIntl().formatMessage({ id: 'component.getVersion.errorMessage' }));
        });
        }
        customRequest = ({
        action,
        data,
        file,
        filename,
        headers,
        onError,
        onProgress,
        onSuccess,
        withCredentials,
        }) => {
        const formData = new FormData();
        if (data) {
        Object.keys(data).forEach((key) => {
        formData.append(key, data[key]);
        });
        }
        formData.append('filedata', file);
        request(action, {
        withCredentials,
        headers: {
        ...headers,
        Accept: '*/*',
        'civ-site': '',
        },
        method: 'post',
        data: formData,
        ignoreSite: true,
        onUploadProgress: ({ total, loaded }) => {
        onProgress({ percent: Math.round((loaded / total) * 100).toFixed(2) }, file);
        },
        })
        .then((res) => {
        onSuccess(res, file);
        })
        .catch(onError);
        return {
        abort() {
        console.log('upload progress is aborted.');
        },
        };
        };
        render() {
        const self = this;
        const { props } = this;
        const { userInfo } = props.config;
        const site =
        props.config &&
        props.config.userInfo &&
        props.config.userInfo.site &&
        userInfo.site !== '' &&
        props.config.client !== 'oms'
        ? userInfo.site
        : '';
        // const { getPrefixCls } = useContext(ConfigProvider.ConfigContext);
        // const prefixCls = getPrefixCls();
        const uploadProps = {
        action: this.state.action,
        onStart(file) {
        console.log('onStart', file, file.name);
        },
        onSuccess(res, file) {
        if (res.success) {
        const avatarPath = '/个人信息/' + self.state.path + '/' + file.name;
        const params = {
        userID: props.config.get('userInfo.OID'),
        loginName: props.config.get('userInfo.loginName'),
        userName: props.config.get('userInfo.fullName'),
        _version: self.state.version,
        mark: props.config.get('userInfo.Mark'),
        phone: props.config.get('userInfo.Phone'),
        email: props.config.get('userInfo.Email'),
        userImage: decodeURIComponent(avatarPath),
        WXid: props.config.get('userInfo.WXid'),
        };
        appService
        .updateAvatar(params)
        .then((res) => {
        if (res.success) {
        // message.success(useIntl().formatMessage({id: 'component.avatar.update.success'}));
        message.success(globalHeader['component.avatar.update.success']);
        self.setState({
        currentUser: {
        name: self.state.currentUser.name,
        avatar: `${API.AVATAR_FILE_URL}${avatarPath}`,
        action: API.UPLOAD_FILE_URL,
        },
        });
        }
        })
        .catch((e) => {
        message.error(useIntl().formatMessage({ id: 'component.avatar.update.fail' }));
        });
        } else {
        message.error(res.message);
        }
        },
        onError(err) {
        console.log('onError', err);
        },
        onProgress({ percent }, file) {
        console.log('onProgress', `${percent}%`, file.name);
        },
        customRequest: this.customRequest.bind(this),
        beforeUpload: this.beforeUpload.bind(this),
        onChange: this.handleChange.bind(this),
        };
        const currentUser = this.state.currentUser;
        const menuHeaderDropdown = (prefixCls) => (
        <div className={`${prefixCls}-userWrapper-userInfo`}>
        <div className={`${prefixCls}-userWrapper-userInfo-header`} style={{background:'#00b278'}}>
        <Upload
        className="avatar-uploader"
        {...uploadProps}
        maxCount={1}
        itemRender={() => <></>}
        >
        <div
        className={`${prefixCls}-userWrapper-userInfo-header-avatar`}
        style={{ backgroundImage: `url(${currentUser.avatar})` }}
        />
        </Upload>
        <div className={`${prefixCls}-userWrapper-userInfo-header-name`}>{userInfo.fullName}</div>
        </div>
        <div className={`${prefixCls}-userWrapper-userInfo-body`}>
        <div className={`${prefixCls}-userWrapper-userInfo-body-item`}>
        <ul>
        <li>
        <span />
        <span className={`${prefixCls}-userWrapper-userInfo-body-item-label`}>
        <FormattedMessage id="component.avatar.account" />：
        </span>
        <span className={`${prefixCls}-userWrapper-userInfo-body-item-value`}>
        {userInfo.loginName}
        </span>
        </li>
        <li>
        <span />
        <span className={`${prefixCls}-userWrapper-userInfo-body-item-label`}>
        <FormattedMessage id="component.avatar.name" />：
        </span>
        <span className={`${prefixCls}-userWrapper-userInfo-body-item-value`}>
        {userInfo.fullName}
        </span>
        </li>
        <li>
        <span />
        <span className={`${prefixCls}-userWrapper-userInfo-body-item-label`}>
        <FormattedMessage id="component.avatar.depart" />：
        </span>
        <span className={`${prefixCls}-userWrapper-userInfo-body-item-value`}>
        {userInfo && userInfo.depart && userInfo.depart.name}
        </span>
        </li>
        <li>
        <span />
        <span className={`${prefixCls}-userWrapper-userInfo-body-item-label`}>
        <FormattedMessage id="component.avatar.role" />：
        </span>
        <span className={`${prefixCls}-userWrapper-userInfo-body-item-value`}>
        {this.getRoles()}
        </span>
        </li>
        {site ? (
        <li>
        <span />
        <span className={`${prefixCls}-userWrapper-userInfo-body-item-label`}>
        <FormattedMessage id="component.siteCode" />：
        </span>
        <span className={`${prefixCls}-userWrapper-userInfo-body-item-value`}>
        {userInfo.site}
        </span>
        </li>
        ) : null}
        </ul>
        </div>
        <div className={`${prefixCls}-userWrapper-userInfo-body-exit`}>
        {userInfo && userInfo.site === '' && (
        <a onClick={(event) => this.showModal(event)}>
        <FormattedMessage id="component.password.update" />
        </a>
        )}
        <a onClick={this.loginout}>
        <FormattedMessage id="component.exit.login" />
        </a>
        </div>
        </div>
        </div>
        );
        return currentUser && currentUser.name ? (
        <GlobalContext.Consumer>
        {(value) => {
        const { getPrefixCls } = value._currentValue;
        const prefixCls = getPrefixCls();
        return (
        <>
        <Popover
        overlayClassName={`${prefixCls}-userWrapper`}
        placement="bottom"
        trigger="click"
        content={
        props.config && props.config.userInfo ? menuHeaderDropdown(prefixCls) : null
        }
        >
        <span
        className={`${prefixCls}-action ${prefixCls}-account`}
        ref={(r) => (this.avatarRef = r)}
        >
        <Avatar
        size="small"
        className={`${prefixCls}-account-avatar`}
        src={currentUser.avatar}
        alt="avatar"
        />
        {/* <span className={`${styles.name} anticon`}>{currentUser.name}</span> */}
        </span>
        </Popover>
        <Modal
        title="修改密码"
        centered
        width="480px"
        visible={this.state.visible}
        wrapClassName={`${prefixCls}-updatePassword`}
        cancelText="取消"
        okText="确定"
        onOk={(event) => this.handleOk(event, this.form)}
        onCancel={(event) => this.handleCancel(event, this.form)}
        zIndex={2000}
        >
        <Form labelAlign="right" {...formItemLayout} ref={(f) => (this.form = f)}>
        {!getIOT() && (
        <Form.Item
        name="oldPwd"
        label="原密码"
        rules={[
        {
        required: true,
        message: '请输入原始密码',
        },
        ]}
        hasFeedback
        >
        <Input.Password />
        </Form.Item>
        )}
        <Form.Item
        name="newPwd"
        label="新密码"
        rules={[
        {
        required: true,
        message: '请输入新密码',
        },
        {
        pattern: /^(?![0-9]+$)(?![a-zA-Z]+$)[a-zA-Z0-9!@#$%^&*_]{8,16}$/,
        message: '密码字符长度为8-16个字符',
        },
        ]}
        hasFeedback
        >
        <Input.Password />
        </Form.Item>
        <Form.Item
        name="confirmPwd"
        label="确认密码"
        dependencies={['newPwd']}
        hasFeedback
        rules={[
        {
        required: true,
        message: '请输入确认密码',
        },
        ({ getFieldValue }) => ({
        validator(rule, value) {
        if (!value || getFieldValue('newPwd') === value) {
        return Promise.resolve();
        }
        return Promise.reject('确认密码与新密码输入不一致');
        },
        }),
        ]}
        >
        <Input.Password />
        </Form.Item>
        </Form>
        </Modal>
        </>
        );
        }}
        </GlobalContext.Consumer>
        ) : (
        <GlobalContext.Consumer>
        {(value) => {
        const { getPrefixCls } = value._currentValue;
        const prefixCls = getPrefixCls();
        return (
        <span className={`${prefixCls}-action ${prefixCls}-account`}>
        <Spin
        size="small"
        style={{
        marginLeft: 8,
        marginRight: 8,
        }}
        />
        </span>
        );
        }}
        </GlobalContext.Consumer>
        );
        }
        }
        export default withRouter(AvatarDropdown);
        src/layouts/AppLayout/components/GlobalHeader/index.js 0 → 100644
        View file @ 49febe70
        import AvatarDropdown from './AvatarDropdown';
        export { AvatarDropdown };
        src/layouts/AppLayout/components/GlobalHeader/index.less 0 → 100644
        View file @ 49febe70
        @import '~antd/es/style/themes/default.less';
        @pro-header-hover-bg: rgba(0, 0, 0, 0.025);
        @panda-prefix-cls: ~'@{ant-prefix}';
        .@{panda-prefix-cls}-action {
        display: flex;
        align-items: center;
        height: 100%;
        padding: 0 9px;
        cursor: pointer;
        transition: all 0.3s;
        > span {
        vertical-align: middle;
        margin: 0 8px 0 0 !important;
        }
        &:hover {
        background: @pro-header-hover-bg;
        }
        &:global(.opened) {
        background: @pro-header-hover-bg;
        }
        }
        .@{panda-prefix-cls}-account {
        &-avatar {
        margin: ~'calc((@{layout-header-height} - 24px) / 2)' 0;
        // margin-right: 8px;
        color: @primary-color;
        vertical-align: top;
        background: rgba(255, 255, 255, 0.85);
        width: 36px;
        height: 36px;
        border-radius: 50%;
        box-shadow: 2px 2px 10px rgba(0, 0, 0, 0.3);
        transition: box-shadow 0.1s linear, opacity 0.4s linear;
        background-position: center;
        overflow: hidden;
        }
        }
        .@{panda-prefix-cls}-userWrapper {
        &-userInfo {
        background-color: #fff;
        width: 300px;
        position: absolute;
        right: 0;
        top: 10px;
        box-shadow: 0 0 10px rgba(0, 0, 0, 0.15);
        border-radius: 6px;
        &-header {
        width: 100%;
        height: 80px;
        position: relative;
        background: #40b3f7;
        padding: 14px 12px;
        display: flex;
        border-top-left-radius: 6px;
        border-top-right-radius: 6px;
        &-avatar {
        display: inline-block;
        width: 52px;
        height: 52px;
        border: 2px solid #fff;
        background-color: #fff;
        border-radius: 50%;
        background-size: 100%;
        background-repeat: no-repeat;
        background-position: center center;
        background-position: center;
        cursor: pointer;
        }
        &-name {
        display: inline-block;
        width: 214px;
        font-size: 18px;
        color: #fff;
        font-weight: bold;
        padding: 14px;
        }
        }
        &-body {
        &-item {
        border-bottom: 1px solid #e0e0e0;
        ul {
        padding: 0 12px;
        list-style: none;
        margin: 0;
        li {
        height: 40px;
        line-height: 42px;
        border-bottom: 1px dashed #eee;
        position: relative;
        text-indent: 3px;
        overflow: hidden;
        width: 100%;
        font-size: 12px;
        font-weight: 100;
        &-label {
        padding: 0 2px;
        max-width: 200px;
        }
        &-value {
        padding: 0 2px;
        max-width: 200px;
        }
        }
        }
        }
        &-exit {
        height: 30px;
        line-height: 30px;
        text-align: right;
        padding: 0 10px;
        a {
        color: #777;
        text-decoration: none;
        margin: 0 5px;
        &:hover {
        color: @primary-7;
        }
        }
        }
        }
        }
        }
        .@{panda-prefix-cls}-updatePassword {
        :global(.@{ant-prefix}-modal-header) {
        padding: 10px 24px !important;
        }
        :global(.@{ant-prefix}-modal-close .@{ant-prefix}-modal-close-x) {
        width: 45px;
        height: 45px;
        font-size: 12px;
        line-height: 35px;
        }
        :global(.@{ant-prefix}-modal-body) {
        padding: 10px 24px;
        }
        :global(.@{ant-prefix}-modal-footer) {
        padding: 8px 12px;
        }
        :global(.@{ant-prefix}-modal-footer .@{ant-prefix}-btn) {
        line-height: 1.2px;
        height: 28px;
        }
        }
        src/layouts/AppLayout/components/SlideMenu/index.js
        View file @ 49febe70
        ......@@ -59,10 +59,7 @@ const Menu = props => {
        if (route && route.routes) {
        setsunRoute(route);
        let tmp = treeRoutes(route.routes);
        console.log('tmp', tmp);
        console.log('route', route);
        setsunRoute({ ...sunRoute, routes: tmp });
        console.log('sunRoute', sunRoute);
        }
        }, [route]);
        const treeRoutes = useCallback(iroute =>
        ......
        src/layouts/HN.less
        View file @ 49febe70
        @hn-greenColor: #00b278;
        :global {
        .panda-console-base-userWrapper-userInfo-header {
        //右上角弹框
        // background-color: @hn-greenColor;
        }
        }
        .hnlayout {
        :global {
        .panda-console-base-global-page-header-header {
        padding-left: 0;
        }
        .panda-console-base-global-page-header-header-logo {
        width: 140px;
        padding-left: 0;
        & > img {
        width: 144px !important;
        width: auto !important;
        height: 36px;
        margin: 0 auto;
        }
        }
        .panda-console-base-global-page-header {
        ......
        src/layouts/HNLayout.js
        View file @ 49febe70
        ......@@ -9,7 +9,7 @@ import { connect } from 'react-redux';
        import { useHistory } from '@wisdom-utils/runtime';
        import KeepAlive from 'react-activation';
        import AMapLoader from '@amap/amap-jsapi-loader';
        import RightContent from '@/components/GlobalHeader/ExtendRightContent';
        import RightContent from '@/components/GlobalHeader/HNRightContent';
        import defaultSetting from '@wisdom-utils/components/lib/AppLayout/layouts/defaultSettings';
        import { actionCreators } from '@/containers/App/store';
        import BasicLayout from './AppLayout/layouts/BasicLayout';
        ......@@ -260,9 +260,10 @@ const Layout = props => {
        <div className={styls.hnlayout}>
        <BasicLayout
        route={props.route}
        title={props.global.subtitle}
        title={props.global.title}
        siderWidth={140}
        logo={logo}
        // logo={require('@/assets/basic/HN-logo.png')}
        config={props.global}
        currentMenuIndex={props.currentMenuIndex}
        onHeaderLogo={handlerIndustry}
        ......
        Markdown is supported
        0% or
        You are about to add 0 people to the discussion. Proceed with caution.
        Finish editing this message first!
        Please register or to comment