# PutTime投放时段选择组件

> 此组件为纯业务组件，部分内容需要注意，使用之前需要熟悉业务并对接口和回调进行扩展！！！

## PutTime组件API

- `dates: [String]` ： 从接口拿到的投放json数据，批量操作不传默认全选。
- `submitFun: [Function]` : 修改完成确定按钮的回调函数，会返回处理完的json数据。
- `cancelFun: [Function]` : 修改完成取消按钮的回调函数，会返回处理完的json数据。


## 参数数据格式示例（接口直接拿到的）

```
[{"1":0},{"1":1},{"1":4},{"1":9},{"1":11},{"1":19},{"1":20},{"1":23},{"2":0},{"2":1},{"2":4},{"2":9},{"2":19},{"2":20},{"2":23},{"3":0},{"3":1},{"3":4},{"3":9},{"3":19},{"3":20},{"3":23},{"4":0},{"4":1},{"4":4},{"4":9},{"4":19},{"4":20},{"4":23},{"5":0},{"5":1},{"5":4},{"5":5},{"5":9},{"5":13},{"5":19},{"5":20},{"5":23},{"6":0},{"6":1},{"6":4},{"6":9},{"6":19},{"6":20},{"6":23},{"7":0},{"7":1},{"7":4},{"7":9},{"7":19},{"7":20},{"7":23}]

```



## PutTime组件使用方法

```javascript
import React, { Component } from 'react';
import PutTime from './widgets/PutTime';

class App extends Component {
   constructor(props) {
    super(props);
    this.state = {
      showTime1: false,
      showTime2: false,
      dates: '[{"1":0},{"1":1},{"1":4},{"1":9},{"1":11},{"1":19},{"1":20},{"1":23},{"2":0},{"2":1},{"2":4},{"2":9},{"2":19},{"2":20},{"2":23},{"3":0},{"3":1},{"3":4},{"3":9},{"3":19},{"3":20},{"3":23},{"4":0},{"4":1},{"4":4},{"4":9},{"4":19},{"4":20},{"4":23},{"5":0},{"5":1},{"5":4},{"5":5},{"5":9},{"5":13},{"5":19},{"5":20},{"5":23},{"6":0},{"6":1},{"6":4},{"6":9},{"6":19},{"6":20},{"6":23},{"7":0},{"7":1},{"7":4},{"7":9},{"7":19},{"7":20},{"7":23}]'
    }
  }

  render() {
    const {showTime1, showTime2, dates} = this.state;

    return (
      <div className="App">
        <button onClick={() => this.openTime('showTime1')}>有数据单条记录操作</button>
        <button onClick={() => this.openTime('showTime2')}>批量操作</button>
        {showTime1 && <PutTime dates={dates} cancelFun={(data) => this.cancelClick(data)} submitFun={(data) => this.successFun(data)}></PutTime>}
        {showTime2 && <PutTime cancelFun={(data) => this.cancelClick(data)} submitFun={(data) => this.successFun(data) }></PutTime>}
      </div>
    );
  }

  openTime(name) {
    const newStatus = this.state[name];
    this.setState({[name]: !newStatus})
  }

  cancelClick(data) {
    console.log(data)
  }

  successFun(dates) {
    console.log(dates)
  }
}

export default App;

```