import React, { useState } from 'react'
import Taro, { Current } from '@tarojs/taro'
import { Input, Textarea } from '@tarojs/components'
import request, { apis } from '@/utils/request'
import '@/assets/css/reset.less'
import '@/assets/css/iconfont.less'
import './index.less'

export default function WuYeTianJiaBaoXiu () {

  const [Title, setTitle] = useState('')
  const [Desc, setDesc] = useState('')
  const [DataLock, setDataLock] = useState(false)
  const CurrnetBaoXiuType = Current.router.params.type

  const TitleChange = (e) => {
    setTitle(e.detail.value)
  }

  const DescChange = (e) => {
    setDesc(e.detail.value)
  }

  const CheckForm = () => { // 校验报修单
    if (Title === '') {
      Taro.showToast({ title: `报修标题不能为空`, icon: 'none' })
      return false
    }
    if (Desc === '') {
      Taro.showToast({ title: `报修描述不能为空`, icon: 'none' })
      return false
    }
    return true
  }

  const Send = () => { // 提交报修
    if (DataLock || !CheckForm()) return
    setDataLock(true)
    request({
      ...apis.AddGongDan,
      data: {
        ticketTitle: Title,
        ticketContent: Desc,
        type: 2,
        repairType: CurrnetBaoXiuType - 0
      }
    }).then((res) => {
      Taro.showToast({ title: '报修提交成功', icon: 'none' })
      Taro.redirectTo({ url: `/pages/WuYe/BaoXiuDetail/index?id=${res.id}` })
      setDataLock(false)
    }).catch((res) => {
      Taro.showToast({ title: res, icon: 'none' })
      setDataLock(false)
    })
  }

  return (
    <view className='WuYeTianJiaBaoXiu'>
      <view className='Form'>
        <Input placeholder='简述你的想法' onInput={TitleChange} value={Title}></Input>
        <Textarea placeholder='描述问题详情，以便我们更好的相处' onInput={DescChange} value={Desc}></Textarea>
      </view>
      <view className='Photo'>
        <view className='Add'>
          <view className='centerLabel'>
            <text className='iconfont iconxiangji'></text>
            <text>添加图片</text>
          </view>
        </view>
        <view className='PhotoItem'>
          <text className='iconfont iconshanchu'></text>
        </view>
      </view>
      <view className='Btn'>
        <text onClick={Send}>确认发送</text>
      </view>
    </view>
  )
}
