123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165 |
- import React, { useState, useEffect, useCallback, useMemo, useRef } from 'react';
- import styles from './index.less';
- import { useModel } from 'umi';
- import { Input, message } from 'antd';
- import {
- companyInfo,
- companyUpdate,
- importUsers,
- getFileUrl,
- } from '@/services/sagacare_service/infomation';
- export default () => {
- const { initialState } = useModel('@@initialState');
- const fileInputRef = useRef();
- const [englishAbbreviation, setEnglishAbbreviation] = useState('');
- const [abbreviation, setAbbreviation] = useState('');
- const [intro, setIntro] = useState('');
- const [companyName, setCompanyName] = useState('');
- const [englishName, setEnglishName] = useState('');
- const [logoUrl, setLogoUrl] = useState('');
- const [imgUrl, setImgUrl] = useState('');
- const handleFileSelected = useCallback(
- (e) => {
- const file = e.target.files[0];
- if (file.size > 1024 * 1024 * 10) {
- message.error('文件大小不能超过 10MB');
- return;
- }
- importUsers(file).then((res) => {
- send('logoUrl', res.data.fileKey);
- });
- },
- [abbreviation, englishAbbreviation, intro, logoUrl],
- );
- const handleInfoChanged = useCallback(
- (key, value) => {
- send(key, value);
- },
- [abbreviation, englishAbbreviation, intro, logoUrl],
- );
- function getData() {
- let params = {
- criteria: {
- projectId: initialState?.currentUser?.projectId,
- companyId: initialState?.currentUser?.companyId,
- },
- };
- companyInfo(params).then((res) => {
- const resData = res.data || {};
- setEnglishAbbreviation(resData.englishAbbreviation || '');
- setAbbreviation(resData.abbreviation || '');
- setIntro(resData.intro || '');
- setCompanyName(resData.companyName || '');
- setEnglishName(resData.englishName || '');
- setLogoUrl(resData.logoUrl || '');
- });
- }
- const send = (key, value) => {
- const params = {
- abbreviation: abbreviation,
- englishAbbreviation: englishAbbreviation,
- intro: intro,
- logoUrl: logoUrl,
- companyId: initialState?.currentUser?.companyId,
- };
- params[key] = value;
- companyUpdate(params).then((res) => {
- message.success('修改成功');
- getData();
- });
- };
- useEffect(() => {
- if (companyName == '') {
- getData();
- }
- if (logoUrl) {
- getFileUrl(logoUrl).then((res) => {
- setImgUrl(res.data);
- });
- }
- }, [englishAbbreviation, abbreviation, intro, logoUrl, companyName]);
- return (
- <div className={styles.information}>
- <div className={styles.left}>
- <div className={styles.imgBox}>
- {imgUrl && <img className={styles.imgSt} src={imgUrl}></img>}
- </div>
- <input
- type="file"
- hidden
- accept="image/gif,image/jpeg,image/jpg,image/png"
- ref={fileInputRef}
- onChange={(e) => {
- handleFileSelected(e);
- }}
- />
- <div className={styles.setLogo} onClick={() => fileInputRef.current.click()}>
- 修改Logo
- </div>
- </div>
- <div className={styles.right}>
- <div className={styles.contentLeft}>
- <div className={styles.title}>{companyName}</div>
- <div className={styles.slogan}>{englishName}</div>
- <div className={styles.lableInput}>
- <div className={styles.textLable} style={{ marginLeft: '75px', paddingTop: '84px' }}>
- 公司口号
- </div>
- <div className={styles.inlineEditValue}>
- <Input
- value={intro}
- bordered={false}
- onChange={(e) => setIntro(e.target.value)}
- onBlur={() => handleInfoChanged('intro', intro)}
- onKeyUp={(e) => {
- if (e.keyCode === 13) {
- handleInfoChanged('intro', intro);
- }
- }}
- />
- {/* <Icon type="edit" /> */}
- </div>
- </div>
- </div>
- <div className={styles.contentRight}>
- <div className={styles.lableInput}>
- <div className={styles.textLable}>中文简称</div>
- <div className={styles.inlineEditValue}>
- <Input
- value={abbreviation}
- bordered={false}
- onChange={(e) => setAbbreviation(e.target.value)}
- onBlur={() => handleInfoChanged('abbreviation', abbreviation)}
- onKeyUp={(e) => {
- if (e.keyCode === 13) {
- handleInfoChanged('abbreviation', abbreviation);
- }
- }}
- />
- {/* <Icon type="edit" /> */}
- </div>
- </div>
- <div className={styles.lableInput} style={{ paddingTop: '68px' }}>
- <div className={styles.textLable}>英文简称</div>
- <div className={styles.inlineEditValue}>
- <Input
- value={englishAbbreviation}
- bordered={false}
- onChange={(e) => setEnglishAbbreviation(e.target.value)}
- onBlur={() => handleInfoChanged('englishAbbreviation', englishAbbreviation)}
- onKeyUp={(e) => {
- if (e.keyCode === 13) {
- handleInfoChanged('englishAbbreviation', englishAbbreviation);
- }
- }}
- />
- {/* <Icon type="edit" /> */}
- </div>
- </div>
- </div>
- </div>
- </div>
- );
- };
|