content: import React from 'react'
  import PropTypes from 'prop-types'
  import { connect } from 'dva'
  import cookies from 'cookiesjs'
  import { message } from 'antd'
  import { getQiniuToken } from '../../services/common'
  import { Link,routerRedux  } from 'dva/router'
  // import LzEditor from 'react-lz-editor'
  
  
  import MyUpload from '../../components/MyUpload'
  import style from './index.less'
  import {
      Button,
      Icon,
      Form,
      Input,
      Upload,
      Checkbox,
      InputNumber,
      Switch ,
      Row,
      Col,
      Select,
      Radio
  } from 'antd'
  const FormItem = Form.Item
  const RadioButton = Radio.Button;
  const RadioGroup = Radio.Group;
  const { TextArea } = Input;
  let  data = {}
  
  function video ({ video, dispatch ,form:{getFieldDecorator,validateFieldsAndScroll}}) {
  
      // console.log(upToken)
      const oldValue = video.video
      const videoInputType = video.videoInputType
      let content = oldValue.descript || ''
      let expertHeadimg = oldValue.expertHeadimg || ''
      let thumbUrl = oldValue.thumbUrl || ''
      let vdoUrl = oldValue.vdoUrl || ''
  
      const { source, mode, format, push, classify } = video
  
      function uploadExpertHeadimg (url) {
          dispatch({type:'video/editVideoLocal',payload:{expertHeadimg:url}})
      }
  
      function uploadThumbUrl (url) {
          dispatch({type:'video/editVideoLocal',payload:{thumbUrl:url}})
      }
  
      function uploadVideo (url) {
          console.log(url)
          vdoUrl = url
          dispatch({type:'video/editVideoLocal',payload:{vdoUrl:url}})
      }
  
      function changeVideoInput (e) {
          console.log(e.target.value)
          dispatch({type:'video/editVideoLocal',payload:{videoInputType:e.target.value}})
      }
  
      function CheckboxChange (e) {
          console.log(e)
      }
  
      function catChange(v) {
  
          dispatch({
              type: 'video/setClassify',
              payload: { pid: v }
          })
  
      }
  
      function edit(e) {
          dispatch({type:'video/editVideoLocal',payload:{descript:e.target.value}})
      }
  
      function submit (e) {
          console.log(vdoUrl)
          e.preventDefault()
          validateFieldsAndScroll((err, values) => {
              if (!err) {
                  console.log('Received values of form: ', values);
                  if (thumbUrl === '') {
                      message.error('请上传封面图片')
                      return false
                  }
                  if(vdoUrl === '' && values.vdoUrl === ''){
                      message.error('请上传视频或输入视频地址')
                      return false
                  }
                  if(expertHeadimg === ''){
                      message.error('请上传专家头像')
                      return false
                  }
                  if(content === ''){
                      message.error('请输入内容')
                      return false
                  }
                  let value = {
                      vdoid:oldValue.vdoid || 0, //id
                      catid: Number(values.catid) || oldValue.catid, //频道id
                      type: 41, //内容类型
                      cntTime: parseInt(+new Date()/1000) , //发布时间
                      thumbUrl: thumbUrl, //缩略图url
                      expertHeadimg: expertHeadimg, //专家头像url
                      expertName: values.expertName, //专家姓名
                      expertTitle: values.expertTitle, //专家职称
                      expertHospital: values.expertHospital, //专家所在医院
                      expertDepartment: values.expertDepartment, //专家科室
                      vdoUrl: vdoUrl || values.vdoUrl, //视频链接
                      linkUrl: "", //外链url
                      title: values.title, //标题
                      tag: values.tag.join(","), //标签
                      doctorStyle: values.doctorStyle?1:0, //风格 0医生站风格 1辉瑞风格
                      descript: content, //内容
                      exmid: 0, //题目id
                      cost:values.cost,
                      top: values.top?1:0,
                      source: values.source,
                      mode: values.mode,
                      format: values.format,
                      push: values.push,
                      classify: classify.length !=0 ? values.classify : ''
                  }
                  dispatch({
                      type:"video/saveVideo",
                      payload:{video:value,question:false}
                  })
              }else{
                  return false
              }
          })
      }
  
      function editQuestion (e) {
          e.preventDefault()
          validateFieldsAndScroll((err, values) => {
              if (!err) {
                  console.log('Received values of form: ', values);
                  if (thumbUrl === '') {
                      message.error('请上传封面图片')
                      return false
                  }
                  if(vdoUrl === '' && values.vdoUrl === ''){
                      message.error('请上传视频或输入视频地址')
                      return false
                  }
                  if(expertHeadimg === ''){
                      message.error('请上传专家头像')
                      return false
                  }
                  if(content === ''){
                      message.error('请输入内容')
                      return false
                  }
                  let value = {
                      vdoid: oldValue.vdoid || 0, //id
                      catid: Number(values.catid) || oldValue.catid, //频道id
                      type: 41, //内容类型
                      cntTime: parseInt(+new Date()/1000), //发布时间
                      thumbUrl: thumbUrl, //缩略图url
                      expertHeadimg: expertHeadimg, //专家头像url
                      expertName: values.expertName, //专家姓名
                      expertTitle: values.expertTitle, //专家职称
                      expertHospital: values.expertHospital, //专家所在医院
                      expertDepartment: values.expertDepartment, //专家科室
                      vdoUrl: vdoUrl, //视频链接
                      linkUrl: "", //外链url
                      title: values.title, //标题
                      tag: values.tag.join(","), //标签
                      doctorStyle: values.doctorStyle?1:0, //风格 0医生站风格 1辉瑞风格
                      descript: content, //内容
                      exmid: 0, //题目id
                      cost:values.cost,
                      top: values.top?1:0,
                      source: values.source,
                      mode: values.mode,
                      format: values.format,
                      push: values.push,
                      classify:  classify.length !=0 ? values.classify : ''
                  }
                  dispatch({
                      type:"video/saveVideo",
                      payload:{video:value,question:true}
                  })
              }else{
                  return false
              }
          })
      }
  
      const renderCheckBox = (arr,parent)=>{
          return (
              <Row key={parent}>
                  {
                      arr.map((item,index)=>{
                          return (<Col span={6} key={parent+'-'+index}><Checkbox value={parent+'-'+item.tagName} >{parent+'-'+item.tagName}</Checkbox></Col>)
                      })
                  }
              </Row>
          )
      }
  
      let encrypt = cookies('encrypt')
      const uploadConfig = {
        QINIU_URL: "http://up.qiniu.com", //上传地址，现在暂只支持七牛上传
        QINIU_IMG_TOKEN_URL: "http://test.admin.yishengzhan.cn/vdo-getUpTokenNew.csp?encrypt="+encodeURIComponent(encrypt), //请求图片的token
        QINIU_PFOP: {
          url:"http://livefile.yxj.org.cn"//七牛持久保存请求地址
        },
        QINIU_VIDEO_TOKEN_URL: "http://www.yourServerAddress.mobi/getUptokenOfQiniu.do", //请求媒体资源的token
        QINIU_FILE_TOKEN_URL: "http://www.yourServerAddress.mobi/getUptokenOfQiniu.do?name=patch", //其他资源的token的获取
        QINIU_DOMAIN_IMG_URL: "http://livefile.yxj.org.cn", //图片文件地址的前缀
        QINIU_DOMAIN_VIDEO_URL: "https://video.yourServerAddress.mobi", //视频文件地址的前缀
        QINIU_DOMAIN_FILE_URL: "https://static.yourServerAddress.com/", //其他文件地址前缀
      }
  
      let cat = video.categoryList.find(item=>item.catid === oldValue.catid) || {name:''}
      let classes
      if(oldValue.tag){
          classes = oldValue.tag.split(',')
      }else{
          classes = []
      }
      return (
          <div className={style.container}>
              <Form >
                  <Row>
                      <Col span={1}>
                      <Link to="/videoList" className="ft16">
                          <Icon type="left" />
                          返回
                      </Link>
                      </Col>
                      <Col span={5} offset={21}>
                          <Button type="primary" style={{marginRight:10+'px'}} onClick={submit}>直接发布</Button>
                          <Button type="primary" onClick={editQuestion}>下一步,编辑题目</Button>
                      </Col>
                  </Row>
                 <Row>
                      <Col span={8}>
                          <FormItem label="领域" labelCol={{ span: 6 }} wrapperCol={{ span: 16 }} hasFeedback>
                              {
                                  getFieldDecorator('catid', {
                                      rules: [{ required: true, message: '请选择领域' }],
                                      initialValue: cat.name
                                  }, )(
                                      <Select placeholder="选择领域" onChange={catChange}>
                                          {video.categoryList.map((item, index) => {
                                              return <Select.Option value={item.catid.toString()} key={index}>{item.name}</Select.Option>
                                          })}
                                      </Select>
                                      )
                              }
                          </FormItem>
                      </Col>
                      <Col span={8}>
                          <FormItem labelCol={{ span: 6 }} wrapperCol={{ span: 16 }} label="二级领域" hasFeedback>
  
                              {
                                  getFieldDecorator('classify', {
                                      rules: [{  message: '请选择二级领域' }],
                                      initialValue: oldValue.classify
                                  }, )(
                                      <Select placeholder="选择二级领域"  disabled={classify.length === 0} >
                                          {classify.map((item, index) => {
                                              return <Select.Option value={item} key={`${index}`}>{item}</Select.Option>
                                          })}
                                      </Select>
                                      )
                              }
  
                          </FormItem>
                      </Col>
                  </Row>
                  <FormItem  label="标题" labelCol={{span: 2 }} wrapperCol={{ span: 4 }} hasFeedback>
                      {
                          getFieldDecorator('title',{
                              rules:[{required:true,message:'请输入标题'}],
                              initialValue:oldValue.title || ''
                          },)(<Input size="large" placeholder="最多24个字"/>)
                      }
                  </FormItem>
  
  
                  <FormItem label="来源"  labelCol={{ span: 2 }} wrapperCol={{ span: 8}}>
                      {
                          getFieldDecorator('source', {
                              rules: [{ required: true, message: '请选择来源' }],
                              initialValue: oldValue.source,
                          })(
                              <Select placeholder="请选择">
                                  {
                                      source.map((item,index) =>(
                                          <Select.Option key={`${index}`} value={item} >{item}</Select.Option>
                                      ))
                                  }
                              </Select>
                          )
                      }
  
                  </FormItem>
  
                  <FormItem label="格式"  labelCol={{ span: 2 }} wrapperCol={{ span: 8}}>
                      {
                          getFieldDecorator('format', {
                              rules: [{ required: true, message: '请选择格式' }],
                              initialValue: oldValue.format,
  
                          })(
                              <Select placeholder="请选择">
                                  {
                                      format.map((item,index) =>(
                                          <Select.Option key={`${index}`} value={item} >{item}</Select.Option>
                                      ))
                                  }
                              </Select>
                          )
                      }
                  </FormItem>
  
                  <FormItem label="交互方式"  labelCol={{ span: 2 }} wrapperCol={{ span: 8}}>
                      {
                          getFieldDecorator('mode', {
                              rules: [{ required: true, message: '请选择交互方式' }],
                              initialValue: oldValue.mode,
  
                          })(
                              <Select placeholder="请选择">
                                  {
                                      mode.map((item,index) =>(
                                          <Select.Option key={`${index}`} value={item} >{item}</Select.Option>
                                      ))
                                  }
                              </Select>
                          )
                      }
                  </FormItem>
  
                  <FormItem label="推送形式"  labelCol={{ span: 2 }} wrapperCol={{ span: 8}}>
                      {
                          getFieldDecorator('push', {
                              rules: [{ required: true, message: '请选择推送形式' }],
                              initialValue: oldValue.push,
  
                          })(
                              <Select placeholder="请选择">
                                  {
                                      push.map((item,index) =>(
                                          <Select.Option key={`${index}`} value={item} >{item}</Select.Option>
                                      ))
                                  }
                              </Select>
                          )
                      }
                  </FormItem>
  
  
                  <Row gutter={0}>
                      <Col span={8} pull={0} offset={0} style={{ textAlign: 'right' }}>
                          <FormItem  label="讲师姓名" labelCol={{span: 6 }} wrapperCol={{ span: 12 }} hasFeedback>
                              {
                                  getFieldDecorator('expertName',{
                                      rules:[{required:true,message:'请输入讲师姓名'}],
                                      initialValue:oldValue.expertName || ''
                                  },)(<Input size="large" placeholder=""/>)
                              }
                          </FormItem>
                      </Col>
                       <Col span={6} offset={0} pull={1}  style={{ textAlign: 'right' }}>
                          <FormItem  label="讲师职称" labelCol={{span: 6 }} wrapperCol={{ span: 12 }} hasFeedback>
                              {
                                  getFieldDecorator('expertTitle',{
                                      rules:[{required:true,message:'请输入讲师职称'}],
                                      initialValue: oldValue.expertTitle || ''
                                  },)(<Input size="large" placeholder=""/>)
                              }
                          </FormItem>
                      </Col>
                  </Row>
                  <Row gutter={0}>
                      <Col span={8} pull={0} offset={0} style={{ textAlign: 'right' }}>
                          <FormItem  label="医院" labelCol={{span: 6 }} wrapperCol={{ span: 12 }} hasFeedback>
                              {
                                  getFieldDecorator('expertHospital',{
                                      rules:[{required:true,message:'请输入医院'}],
                                      initialValue: oldValue.expertHospital
                                  },)(<Input size="large" placeholder=""/>)
                              }
                          </FormItem>
                      </Col>
                       <Col span={6} offset={0} pull={1}  style={{ textAlign: 'right' }}>
                          <FormItem  label="科室" labelCol={{span: 6 }} wrapperCol={{ span: 12 }} hasFeedback>
                              {
                                  getFieldDecorator('expertDepartment',{
                                      rules:[{required:true,message:'请输入科室'}],
                                      initialValue: oldValue.expertDepartment
                                  },)(<Input size="large" placeholder=""/>)
                              }
                          </FormItem>
                      </Col>
                  </Row>
                  <FormItem label="讲师照片" labelCol={{span: 2 }} wrapperCol={{ span: 4 }} hasFeedback>
                      <MyUpload size={{w:120,h:180}} type="img" imgUrl={oldValue.expertHeadimg} upload={uploadExpertHeadimg}/>
                  </FormItem>
                  <FormItem label="封面" labelCol={{span: 2 }} wrapperCol={{ span: 4 }} hasFeedback>
                      <MyUpload size={{w:200,h:150}} type="img" imgUrl={oldValue.thumbUrl} upload={uploadThumbUrl}/>
                  </FormItem>
                  <FormItem labelCol={{span: 2 }} label="选择视频上传方式">
                      <RadioGroup defaultValue="input" onChange={changeVideoInput}>
                        <Radio value="input">输入视频地址</Radio>
                        <Radio value="upload">上传视频</Radio>
                      </RadioGroup>
                  </FormItem>
                 {
                  videoInputType === 'input' ?
                  <FormItem label="输入视频地址" labelCol={{span: 2 }} wrapperCol={{ span: 10 }} hasFeedback>
                     {
                         getFieldDecorator('vdoUrl',{
                             rules:[{message:'请输入视频地址'}],
                             initialValue:oldValue.vdoUrl || ''
                         },)(<Input size="large" placeholder="请输入视频地址"/>)
                     }
                  </FormItem>
                  :
                  <FormItem label="上传视频" labelCol={{span: 2 }} wrapperCol={{ span: 4 }} hasFeedback>
                      <MyUpload type="video" vdoUrl={oldValue.vdoUrl} upload={uploadVideo}/>
                  </FormItem>
                  }
                  <FormItem label="是否置顶" labelCol={{span: 2 }} wrapperCol={{ span: 4 }}>
                      {getFieldDecorator('top', { valuePropName: 'checked',initialValue:oldValue.top === 1 })(
                          <Switch />
                      )}
                  </FormItem>
                  <FormItem label="医生站风格" labelCol={{span: 2 }} wrapperCol={{ span: 4 }}>
                      {getFieldDecorator('doctorStyle', { valuePropName: 'checked',initialValue:oldValue.doctorStyle === 1})(
                          <Switch />
                      )}
                  </FormItem>
                  <FormItem  label="积分" labelCol={{span: 2 }} wrapperCol={{ span: 1 }} hasFeedback>
                      {
                          getFieldDecorator('cost',{
                              rules:[{required:true,message:'请输入积分'}],
                              initialValue:oldValue.cost
                          },)(<InputNumber size="large"/>)
                      }
                  </FormItem>
                  <FormItem label="标签" labelCol={{span:2}} wrapperCol={{ span: 18 }}>
                      {
                          getFieldDecorator('tag',{
                              rules:[{required:true,message:'请至少选择一个标签'}],
                              initialValue:classes
                          })(
                          <Checkbox.Group onChange={CheckboxChange} >
                              {
                                  video.classifyList.map((item,index)=>{
                                      return (<div key={item.name+index}>{renderCheckBox(item.tagList,item.name)}</div>)
                                  })
                              }
                          </Checkbox.Group>
                          )
                      }
                  </FormItem>
                  <FormItem label="正文" labelCol={{span:2}} wrapperCol={{span:15}}>
                      <TextArea
                      rows={5}
                      defaultValue={content}
                      onChange={edit}
                      />
                  </FormItem>
              </Form>
          </div>
      )
  }
  
  video.PropTypes = {
      video:PropTypes.object
  }
  
  export default connect(({video})=>({video}))(Form.create()(video))
  