diff --git a/pc4mobx/hrmSalary/components/CustomSelect/index.js b/pc4mobx/hrmSalary/components/CustomSelect/index.js new file mode 100644 index 00000000..d65fe2ba --- /dev/null +++ b/pc4mobx/hrmSalary/components/CustomSelect/index.js @@ -0,0 +1,80 @@ +/* + * 自定义多选下拉框 + * 支持搜索 + * @Author: 黎永顺 + * @Date: 2024/9/13 + * @Wechat: + * @Email: 971387674@qq.com + * @description: +*/ +import React, { Component } from "react"; +import { WeaLocaleProvider } from "ecCom"; +import classNames from "classnames"; +import { Select } from "antd"; +import "./index.less"; + +const getLabel = WeaLocaleProvider.getLabel; +const Option = Select.Option; + +class Index extends Component { + constructor(props) { + super(props); + this.state = { + visible: false, dropdownWidth: 200, value: props.value ? props.value.split(",") : [] + }; + this.selectedData = {}; + } + + componentDidMount() { + const { dropdownWidth } = this.state; + const w = $(this.refs.customSelectMui).outerWidth(); + console.log($(this.refs.customSelectMui), w) + if (dropdownWidth < w) { + this.setState({ dropdownWidth: w }); + } + } + + handleChange = (value) => { + this.setState({ value }); + typeof this.props.onChange == "function" && + this.props.onChange(`${value}`); + }; + + render() { + const { dropdownWidth, visible, value } = this.state; + const { options = [], defaultValue } = this.props; + const clsname = classNames({ + "wea-associative-search-mult": true + }); + return ( +
+ +
+ {!visible ? : } +
+
+ ); + } +} + +export default Index; \ No newline at end of file diff --git a/pc4mobx/hrmSalary/components/CustomSelect/index.less b/pc4mobx/hrmSalary/components/CustomSelect/index.less new file mode 100644 index 00000000..ced4bc8e --- /dev/null +++ b/pc4mobx/hrmSalary/components/CustomSelect/index.less @@ -0,0 +1,19 @@ +.customMuiSelect { + .ant-input-group-wrap { + i { + padding-left: 2px !important; + padding-right: 2px !important; + padding-top: 0; + padding-bottom: 0; + line-height: 28px; + height: 28px; + border-radius: 2px; + color: #333 !important; + } + } + + .ant-select-selection--multiple { + max-height: 28px !important; + overflow-y: auto !important; + } +}