import Taro from '@tarojs/taro';

import { Button } from '@taroify/core';

import { PREFIX } from '@/components/product-dialog/const';
import { SubscribeTempId } from '@/constants/subscribe';
import { postSubscribe, subscribeMessage } from '@/utils/subscribe';
import Toast from '@/utils/toast';

interface IContactCSProps {
  onAfterConfirm: () => void;
}

const SUBSCRIBE_ID = SubscribeTempId.SUBSCRIBE_JOB;

export default function ContactCustomerService(props: IContactCSProps) {
  const { onAfterConfirm } = props;

  const handleClick = async () => {
    try {
      Taro.showLoading();
      const result = await subscribeMessage([SUBSCRIBE_ID]);
      const success = result[SUBSCRIBE_ID] === 'accept';
      Taro.hideLoading();
      if (!success) {
        Toast.error('拒绝订阅');
        postSubscribe([SUBSCRIBE_ID], []);
        return;
      }
      Toast.success('订阅成功');
      postSubscribe([SUBSCRIBE_ID], [SUBSCRIBE_ID]);
      onAfterConfirm();
    } catch (e) {}
  };

  return (
    <div className={`${PREFIX}__job-contact_cs`}>
      <div className={`${PREFIX}__job-contact_cs__header`}>您已报名本通告</div>
      <div className={`${PREFIX}__job-contact_cs__describe`}>本通告尚未维护联系方式</div>
      <div className={`${PREFIX}__job-contact_cs__content`}>{`本通告不消耗对接次数，\n联系上立马通知您`}</div>
      <div className={`${PREFIX}__job-contact_cs__describe`}>联系上后会通知您，请点击下方订阅通知</div>
      <Button className={`${PREFIX}__job-contact_cs__button`} onClick={handleClick}>
        订阅通知
      </Button>
    </div>
  );
}