estateagents-admin-manager/src/pages/staff/list/editStaff.jsx

import React, { useState, useEffect } from 'react';

import { Input, Menu, Dropdown, Button, Icon, message, Table, Tooltip, Tabs, Radio, Divider, Tag, Select, Form, Alert } from 'antd';
import { FormattedMessage } from 'umi-plugin-react/locale';
import BuildSelect from '../../../components/SelectButton/BuildSelect'
import router from 'umi/router';
import styles from '../../style/GoodsList.less';
import XForm, { FieldTypes } from '../../../components/XForm';
import Wangedit from '../../../components/Wangedit/Wangedit'
import channels from './channelList.less';
import Tagss from '../components/Tagss.jsx';
import apis from '../../../services/apis';
import request from '../../../utils/request'

const { TextArea } = Input;
const { Option } = Select;


/**
 *
 *
 * @param {*} props
 * @returns
 */
const Edit = (props) => {
  const userId = props.location.query.userId
  const [userData, setUserData] = useState({})
  const [tagData, setTagData] = useState([])
  const [roleData, setRoleData] = useState([])

  const getTagList = () => {
    request({ ...apis.staff.taTags, params: {pageNum:1,pageSize:999} }).then((data) => {
      setTagData(data.records)
    })
  }

  const getRoleList = () => {
    request({ ...apis.role.getRoleList, params: {pageNum:1,pageSize:999} }).then((data) => {
      console.log(data)
      setRoleData(data.records)
    })
  }

  // 查询列表
  const getUserData = (userId) => {
    request({ ...apis.staff.getTaUser, urlData: {id:userId} }).then((data) => {
      console.log(data,"tauser")
      setUserData(data)
    })
  }

  useEffect(() => {
    getTagList();
    getRoleList();
    if (userId) {
      getUserData(userId);
    }
  }, [])

  const tagsChange = (value) => {
    console.log(`selected ${value}`);
  }

  const handleSubmit = val => {
    if(userId){
      request({ ...apis.staff.updateTaUser, urlData: {id:userId},data: val, }).then((data) => {
        console.log(data,"tauser")
        message.info("保存成功")
        router.go(-1)
      }).catch(error => {
        // message.info(error.message)
      })
    }else{
      request({ ...apis.staff.addTaUser, data: val, }).then((data) => {
        console.log(data,"tauser")
        message.info("保存成功")
        router.go(-1)
      }).catch(error => {
        // message.info(error.message)
      })
    }
  }

  const fields = [
    {
      label: '名称',
      name: 'userName',
      type: FieldTypes.Text,
      value: userData.userName
    },
    {
      label: '公司',
      name: 'orgName',
      type: FieldTypes.Text,
      placeholder: '请输入公司名称',
      value: userData.orgName
    },
    {
      label: '部门',
      name: 'department',
      type: FieldTypes.Text,
      placeholder: '请输入部门',
      value: userData.department
    },
    {
      label: '职位',
      name: 'position',
      type: FieldTypes.Text,
      placeholder: '请输入职位',
      value: userData.position
    },
    {
      label: '是否置业顾问',
      name: 'isConsultant',
      type: FieldTypes.Switch,
      value: userData.isConsultant
    },
    {
      label: '电话',
      name: 'phone',
      type: FieldTypes.Text,
      placeholder: '请输入电话号码',
      value: userData.phone,
    },
    {
      label: '角色',
      name: 'roleIds',
      render: <Select
                mode="multiple"
                style={{ width: '100%' }}
                placeholder="请选择标签"
                onChange={tagsChange} >
                  {roleData.map(item => (
                    <Select.Option key={item.roleId} value={item.roleId}>
                      {item.roleName}
                    </Select.Option>
                  ))}
              </Select>,
      value: userData.roleIds,
    },
    {
      label: '标签',
      name: 'taTags',
      render: <Select
                mode="multiple"
                style={{ width: '100%' }}
                placeholder="请选择标签"
                onChange={tagsChange} >
                  {tagData.map(item => (
                    <Select.Option key={item.tagId} value={item.tagId}>
                      {item.tagName}
                    </Select.Option>
                  ))}
              </Select>,
      value: userData.taTags,
    },
    {
      label: '地址',
      name: 'address',
      type: FieldTypes.Text,
      placeholder: '请输入地址',
      value: userData.address

    },
    {
      label: '授权项目',
      name: 'buildingId',
      render: <BuildSelect />,
      value: userData.buildingId
    },
    {
      label: '图片',
      name: 'photo',
      type: FieldTypes.ImageUploader,
      extra: '建议图片大小 640 * 640',
      value: userData.photo
    },


    {
      label: '简介',
      name: 'description',
      render: <TextArea className={channels.inpuitTxt} ></TextArea>,
      value: userData.description

    },
    {
      label: '状态',
      name: 'status',
      render: <Radio.Group>
        <Radio.Button style={{background:'#f0f0f0'}} value="0">禁用</Radio.Button>
        <Radio.Button style={{background:'#f0f0f0',color:'#ff7e48'}} value="1">启用</Radio.Button>
      </Radio.Group>,
      value: null != userData.status ? userData.status : '1'
    },
  ]

  console.log('--------->', fields)

  return <XForm onSubmit={handleSubmit} fields={fields}></XForm>
}



export default Edit