import AutoCircuitAllocation from '@/components/floor-plan/modal/circuitTrestle/step/type/AutoCircuitAllocation'
import PassivityCircuitAllocation from '@/components/floor-plan/modal/circuitTrestle/step/type/PassivityCircuitAllocation'
import { useMessage } from '@/hooks/useMessage'

export default function CircuitAllocation(props) {
  const { getMessage } = useMessage()
  const { circuitAllocationType, setCircuitAllocationType } = props
  return (
    <>
      <div className="module-box-tab">
        <button className={`module-btn ${circuitAllocationType === 1 ? 'act' : ''}`} onClick={() => setCircuitAllocationType(1)}>
          {getMessage('modal.circuit.trestle.setting.circuit.allocation.auto')}
        </button>
        <button className={`module-btn ${circuitAllocationType === 2 ? 'act' : ''}`} onClick={() => setCircuitAllocationType(2)}>
          {getMessage('modal.circuit.trestle.setting.circuit.allocation.passivity')}
        </button>
      </div>
      <div className="properties-setting-wrap outer">
        <div className="setting-tit">{getMessage('modal.circuit.trestle.setting.circuit.allocation')}</div>
        {circuitAllocationType === 1 && <AutoCircuitAllocation />}
        {circuitAllocationType === 2 && <PassivityCircuitAllocation />}
      </div>
    </>
  )
}