import { MovableView, Text, View } from '@tarojs/components'
import { useState } from 'react'
import classnames from 'classnames'
import IconFont from '../iconfont/iconfont'
import styles from './index.module.scss'
import { goLink } from '@/common/common'
import ViewCodeList from '@/components/viewCodeList/index'
import { GetCustomCodeDetailApi } from '@/api/codeManage'

interface param {
  y: number
  orderObj?: any
}
export default ({ y, orderObj = {} }: param) => {
  const [screenHeight, setScreenHeight] = useState({
    customer_service_y: 0,
    code_list_y: 0,
  })
  const [showCode, setShowCode] = useState(false)

  const onNavigateTo = () => {
    if (orderObj?.custom_print_id) {
      goLink(`/pages/codeSetting/index?custom_print_id=${orderObj?.custom_print_id}`)
    }
    else {
      goLink(`/pages/codeSetting/index?sale_order_id=${orderObj?.id}`)
    }
  }

  const [showPopup, setshowPopup] = useState(false)

  const [codeData, setCodeData] = useState<any>(null)

  const { fetchData: getCustomCodeDetail } = GetCustomCodeDetailApi()
  const onGetCustomCodeDetail = async() => {
    const res = await getCustomCodeDetail({ id: orderObj.custom_print_id })
    const { data } = res
    setCodeData({
      dyelot_number_list: data.dyelot_number_list,
      total_number: data.roll,
      title: data.purchaser_name,
      sale_mode_name: data.sale_mode_name,
      purchaser_name: data.purchaser_name,
      purchaser_phone: data.purchaser_phone,
      create_time: data.create_time,
      bill_total_sale_price: data.total_amount,
      total_weight: data.total_sale_weight,
      total_settle_weight: data.total_settlement_weight,
      total_weight_error: data.total_weight_error,
      show_pay_type: false,
      show_order_no: false,
      show_shipment_mode: false,
      show_barcode: false,
      show_qrcode: false,
    })
  }

  const openOldPrive = () => {
    setCodeData(orderObj)
    setshowPopup(true)
  }

  const openNewPrive = () => {
    onGetCustomCodeDetail()
    setshowPopup(true)
  }
  return (<>
    {showCode && <View className={styles.mask} catchMove onClick={() => setShowCode(!showCode)}></View>}
    <MovableView className={classnames(styles.code_list, styles.fixed_btn)} direction="all" inertia x="630rpx" y={`${y}rpx`}>
      {showCode && <View className={classnames(styles.code_list__card, showCode && styles['code_list--open'])}>
        <View className={styles['code_list__card--item']} onClick={openOldPrive}>
          <IconFont name="icon-yuanshimadanyulan" size={46} />
          <Text>原始码单预览</Text>
        </View>
        {!!orderObj?.custom_print_id && <View className={styles['code_list__card--item']} onClick={openNewPrive}>
          <IconFont name="icon-zidingyimadanyulan" size={46} />
          <Text>自定义码单预览</Text>
        </View>}
        <View className={styles['code_list__card--item']} onClick={onNavigateTo}>
          <IconFont name="icon-bianjizidingyimadan" size={46} />
          <Text>{orderObj?.custom_print_id ? '编辑自定义码单' : '新建自定义码单'}</Text>
        </View>
      </View>}
      <View className={styles['code_list--text']} onClick={() => setShowCode(!showCode)}>码单</View>
    </MovableView>
    <ViewCodeList orderObj={codeData} showPopup={showPopup} handClose={() => setshowPopup(false)}></ViewCodeList>

  </>)
}