import {Cell, InfiniteLoading} from '@nutui/nutui-react-taro'
import navTo from "@/utils/common";
import UserFooter from "./UserFooter";
import Taro from '@tarojs/taro'
import {ArrowRight, ShieldCheck, Truck, LogisticsError, Presentation, Coupon, PickedUp} from '@nutui/icons-react-taro'
import {CSSProperties} from "react";

const UserCell = () => {
  const InfiniteUlStyle: CSSProperties = {
    height: '88vh',
    padding: '16px',
    overflowY: 'auto',
    overflowX: 'hidden',
  }
  const onLogout = () => {
    Taro.showModal({
      title: '提示',
      content: '确定要退出登录吗？',
      success: function (res) {
        if (res.confirm) {
          Taro.removeStorageSync('access_token')
          Taro.removeStorageSync('TenantId')
          Taro.removeStorageSync('UserId')
          Taro.removeStorageSync('userInfo')
          Taro.reLaunch({
            url: '/pages/index/index'
          })
        }
      }
    })
  }

  return (
    <>
      <div className={'px-4'}>
        {/*<Cell*/}
        {/*  className="nutui-cell-clickable"*/}
        {/*  title={*/}
        {/*    <div style={{display: 'inline-flex', alignItems: 'center'}}>*/}
        {/*      <Truck size={16}/>*/}
        {/*      <span className={'pl-3 text-sm'}>开通会员</span>*/}
        {/*    </div>*/}
        {/*  }*/}
        {/*/>*/}
        <Cell.Group divider={true} description={
          <div style={{display: 'inline-flex', alignItems: 'center'}}>
            <span style={{marginTop: '12px'}}>我的服务</span>
          </div>
        }>
          <Cell
            className="nutui-cell-clickable"
            title={
              <div style={{display: 'inline-flex', alignItems: 'center'}}>
                <Truck size={16}/>
                <span className={'pl-3 text-sm'}>我的券包</span>
              </div>
            }
            align="center"
            extra={<ArrowRight color="#cccccc" size={18}/>}
          />
          <Cell
            className="nutui-cell-clickable"
            title={
              <div style={{display: 'inline-flex', alignItems: 'center'}}>
                <LogisticsError size={16}/>
                <span className={'pl-3 text-sm'}>我的钱包</span>
              </div>
            }
            align="center"
            extra={<ArrowRight color="#cccccc" size={18}/>}
          />
          <Cell
            className="nutui-cell-clickable"
            title={
              <div style={{display: 'inline-flex', alignItems: 'center'}}>
                <LogisticsError size={16}/>
                <span className={'pl-3 text-sm'}>收货地址</span>
              </div>
            }
            align="center"
            extra={<ArrowRight color="#cccccc" size={18}/>}
          />
          <Cell
            className="nutui-cell-clickable"
            title={
              <div style={{display: 'inline-flex', alignItems: 'center'}}>
                <ShieldCheck size={16}/>
                <span className={'pl-3 text-sm'}>实名认证</span>
              </div>
            }
            align="center"
            extra={<ArrowRight color="#cccccc" size={18}/>}
            onClick={() => {
              navTo('/user/userVerify/index', true)
            }}
          />
        </Cell.Group>
        {/*<Cell.Group divider={true} description={*/}
        {/*  <div style={{display: 'inline-flex', alignItems: 'center'}}>*/}
        {/*    <span style={{marginTop: '12px'}}>管理</span>*/}
        {/*  </div>*/}
        {/*}>*/}
        {/*  <Cell*/}
        {/*    className="nutui-cell-clickable"*/}
        {/*    title={*/}
        {/*      <div style={{display: 'inline-flex', alignItems: 'center'}}>*/}
        {/*        <Presentation size={18}/>*/}
        {/*        <span style={{marginLeft: '5px'}}>分析</span>*/}
        {/*      </div>*/}
        {/*    }*/}
        {/*    align="center"*/}
        {/*    extra={<ArrowRight color="#cccccc" size={18}/>}*/}
        {/*    onClick={() => {*/}
        {/*      navTo('/bszx/bm-cert/bm-cert', true)*/}
        {/*    }}*/}
        {/*  />*/}
        {/*  <Cell*/}
        {/*    className="nutui-cell-clickable"*/}
        {/*    title={*/}
        {/*      <div style={{display: 'inline-flex', alignItems: 'center'}}>*/}
        {/*        <PickedUp size={18}/>*/}
        {/*        <span style={{marginLeft: '5px'}}>客户</span>*/}
        {/*      </div>*/}
        {/*    }*/}
        {/*    align="center"*/}
        {/*    extra={<ArrowRight color="#cccccc" size={18}/>}*/}
        {/*    onClick={() => {*/}
        {/*      navTo('/bszx/pay-log/pay-log', true)*/}
        {/*    }}*/}
        {/*  />*/}
        {/*  <Cell*/}
        {/*    className="nutui-cell-clickable"*/}
        {/*    title={*/}
        {/*      <div style={{display: 'inline-flex', alignItems: 'center'}}>*/}
        {/*        <Coupon size={18}/>*/}
        {/*        <span style={{marginLeft: '5px'}}>折扣</span>*/}
        {/*      </div>*/}
        {/*    }*/}
        {/*    align="center"*/}
        {/*    extra={<ArrowRight color="#cccccc" size={18}/>}*/}
        {/*    onClick={() => {*/}
        {/*      navTo('/user/profile/profile', true)*/}
        {/*    }}*/}
        {/*  />*/}
        {/*</Cell.Group>*/}
        {/*<Cell.Group divider={true} description={*/}
        {/*  <div style={{display: 'inline-flex', alignItems: 'center'}}>*/}
        {/*    <span style={{marginTop: '12px'}}>设置与帮助</span>*/}
        {/*  </div>*/}
        {/*}>*/}
        {/*  <Cell*/}
        {/*    className="nutui-cell-clickable"*/}
        {/*    title="店铺设置"*/}
        {/*    align="center"*/}
        {/*    extra={<ArrowRight color="#cccccc" size={18}/>}*/}
        {/*    onClick={() => Taro.navigateTo({url: '/website/modify'})}*/}
        {/*  />*/}
        {/*  <Cell*/}
        {/*    className="nutui-cell-clickable"*/}
        {/*    title="帮助中心"*/}
        {/*    align="center"*/}
        {/*    extra={<ArrowRight color="#cccccc" size={18}/>}*/}
        {/*    onClick={() => {*/}
        {/*      navTo('/user/profile/profile', true)*/}
        {/*    }}*/}
        {/*  />*/}
        {/*  <Cell*/}
        {/*    className="nutui-cell-clickable"*/}
        {/*    title="问题反馈"*/}
        {/*    align="center"*/}
        {/*    extra={<ArrowRight color="#cccccc" size={18}/>}*/}
        {/*    onClick={() => {*/}
        {/*      navTo('/user/profile/profile', true)*/}
        {/*    }}*/}
        {/*  />*/}
        {/*</Cell.Group>*/}
        <Cell.Group divider={true} description={
          <div style={{display: 'inline-flex', alignItems: 'center'}}>
            <span style={{marginTop: '12px'}}>账号管理</span>
          </div>
        }>
          <Cell
            className="nutui-cell-clickable"
            title="账号安全"
            align="center"
            extra={<ArrowRight color="#cccccc" size={18}/>}
            onClick={() => navTo('/user/profile/profile', true)}
          />
          <Cell
            className="nutui-cell-clickable"
            title="退出登录"
            align="center"
            extra={<ArrowRight color="#cccccc" size={18}/>}
            onClick={onLogout}
          />
        </Cell.Group>
      </div>
      <UserFooter/>
    </>
  )
}
export default UserCell