custom/领悦

pc4mobx/hrmSalary/components/CustomSelect/index.js

@@ -9,15 +9,60 @@
 */
 import React, { Component } from "react";
 import { WeaLocaleProvider } from "ecCom";
+import classNames from "classnames";
+import { Button, Select } from "antd";
 import "./index.less";
 
 const getLabel = WeaLocaleProvider.getLabel;
+const Option = Select.Option;
 
 class Index extends Component {
-  render() {
-    return (
-      <div>
+  constructor(props) {
+    super(props);
+    this.state = {
+      loading: false, data: [], activeKey: "", dropdownWidth: 200
+    };
+    this.selectedData = {};
+  }
 
+  componentDidMount() {
+    const { dropdownWidth } = this.state;
+    const w = $(this.refs.customSelectMui).outerWidth();
+    if (dropdownWidth < w) {
+      this.setState({ dropdownWidth: w });
+    }
+  }
+
+  render() {
+    const { data, dropdownWidth } = this.state;
+    const clsname = classNames({
+      "mr12": true,
+      "wea-associative-search-mult": true
+    });
+    return (
+      <div className={`wea-associative-search ${clsname}`} ref="customSelectMui">
+        <Select
+          {...this.props}
+          hasScroll={false}
+          hideSelected={true}
+          transitionName=""
+          animation=""
+          multiple={true}
+          notFoundContent=""
+          defaultActiveFirstOption={true}
+          showArrow={false}
+          filterOption={false}
+          defaultValue={selectedValues}
+          value={selectedValues}
+          dropdownStyle={{ minWidth: dropdownWidth }}
+          onSearch={_.debounce(this.handleSearch, 400)}
+          onChange={this.handleChange}
+        >
+          {options}
+        </Select>
+        <div className="ant-input-group-wrap">
+          <Button type="ghost" icon="search" />
+        </div>
       </div>
     );
   }