import {useEffect, useState, useRef} from "react";
import {useRouter} from '@tarojs/taro'
import {Button, Loading, CellGroup, Input, TextArea, Form} from '@nutui/nutui-react-taro'
import Taro from '@tarojs/taro'
import {AppVersion} from "@/api/app/appVersion/model";
import {getAppVersion, updateAppVersion} from "@/api/app/appVersion";

const AddAppVersion = () => {
  const {params} = useRouter();
  const [loading, setLoading] = useState<boolean>(true)
  const [FormData, setFormData] = useState<AppVersion>({})
  const formRef = useRef<any>(null)

  const reload = async () => {
    if (params.id) {
      const data = await getAppVersion(Number(params.id))
      setFormData(data)
    } else {
      setFormData({})
    }
  }

  const submitSucceed = async (values: any) => {
    try {
      if (params.id) {
        await updateAppVersion({
          ...values,
          id: Number(params.id)
        })
      }

      Taro.showToast({
        title: `操作成功`,
        icon: 'success'
      })

      setTimeout(() => {
        return Taro.navigateBack()
      }, 1000)
    } catch (error) {
      Taro.showToast({
        title: `操作失败`,
        icon: 'error'
      });
    }
  }

  const submitFailed = (error: any) => {
    console.log(error, 'err...')
  }

  useEffect(() => {
    reload().then(() => {
      setLoading(false)
    })
  }, []);

  if (loading) {
    return <Loading className={'px-2'}>加载中</Loading>
  }

  return (
    <>
      <Form
        ref={formRef}
        divider
        initialValues={FormData}
        labelPosition="left"
        onFinish={(values) => submitSucceed(values)}
        onFinishFailed={(errors) => submitFailed(errors)}
        footer={
          <div
            style={{
              display: 'flex',
              justifyContent: 'center',
              width: '100%'
            }}
          >
            <Button
              nativeType="submit"
              type="success"
              size="large"
              className={'w-full'}
              block
            >
              更新
            </Button>
          </div>
        }
      >
        <CellGroup style={{padding: '4px 0'}}>
          <Form.Item name="versionName" label="版本名称" initialValue={FormData.versionName} required>
            <Input placeholder="请输入版本名称" />
          </Form.Item>
          <Form.Item name="versionCode" label="版本号" initialValue={FormData.versionCode}>
            <Input placeholder="请输入版本号" />
          </Form.Item>
          <Form.Item name="description" label="版本说明" initialValue={FormData.description}>
            <TextArea placeholder="请输入版本说明" />
          </Form.Item>
        </CellGroup>
      </Form>
    </>
  );
};

export default AddAppVersion;
