import {Cell, InfiniteLoading} from '@nutui/nutui-react-taro'
import navTo from "@/utils/common";
import UserFooter from "./UserFooter";
import Taro from '@tarojs/taro'
import {ArrowRight, Headphones} from '@nutui/icons-react-taro'
import {CSSProperties, useEffect} from "react";

const UserCell = () => {
  const InfiniteUlStyle: CSSProperties = {
    height: '88vh',
    padding: '16px',
    overflowY: 'auto',
    overflowX: 'hidden',
    backgroundImage: 'url(https://oss.wsdns.cn/20250707/fc6234359d394788879ee64e27f76d2e.png?x-oss-process=image/resize,m_fixed,w_750/quality,Q_90)',
    backgroundSize: 'cover',
    backgroundRepeat: 'no-repeat',
    backgroundPosition: 'bottom'
  }
  const onLogout = () => {
    Taro.showModal({
      title: '提示',
      content: '确定要退出登录吗？',
      success: function (res) {
        if (res.confirm) {
          Taro.clearStorageSync()
          Taro.removeStorageSync('access_token')
          Taro.removeStorageSync('TenantId')
          Taro.removeStorageSync('UserId')
          Taro.removeStorageSync('userInfo')
          Taro.reLaunch({
            url: '/pages/index/index'
          })
        }
      }
    })
  }

  useEffect(() => {

  }, []);

  return (
    <>
      <div style={InfiniteUlStyle} id="scroll">
        <InfiniteLoading>
          <Cell.Group divider={true}>
            <Cell
              className="nutui-cell-clickable"
              title={
                <div style={{display: 'inline-flex', alignItems: 'center'}}>
                  <Headphones size={16}/>
                  <span className={'pl-2 text-xs'}>联系我们</span>
                </div>
              }
              align="center"
              extra={<ArrowRight color="#cccccc" size={18}/>}
              onClick={() => {
                Taro.navigateTo({url: '/pages/page/index?id=4355'})
              }}
            />
          </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={() => navTo('/passport/sms-login', true)}*/}
            {/*/>*/}
            <Cell
              className="nutui-cell-clickable"
              title="退出登录"
              align="center"
              extra={<ArrowRight color="#cccccc" size={18}/>}
              onClick={onLogout}
            />
          </Cell.Group>
          <UserFooter/>
        </InfiniteLoading>
      </div>
    </>
  )
}
export default UserCell
