template-10550/src/admin/components/UserCell.tsx

import {Cell} from '@nutui/nutui-react-taro'
import navTo from "@/utils/common";
import Taro from '@tarojs/taro'
import {View, Text} from '@tarojs/components'
import {ArrowRight, ShieldCheck, LogisticsError, Location, Reward, Tips, Ask, Setting, Scan} from '@nutui/icons-react-taro'
import {useUser} from '@/hooks/useUser'

const UserCell = () => {
  const {logoutUser, isCertified, hasRole, isAdmin} = useUser();

  const onLogout = () => {
    Taro.showModal({
      title: '提示',
      content: '确定要退出登录吗？',
      success: function (res) {
        if (res.confirm) {
          // 使用 useUser hook 的 logoutUser 方法
          logoutUser();
          Taro.reLaunch({
            url: '/pages/index/index'
          })
        }
      }
    })
  }

  return (
    <>
      <View className={'px-4'}>

        {/*是否分销商*/}
        {!hasRole('dealer') && !isAdmin() && (
          <Cell
            className="nutui-cell-clickable"
            style={{
              backgroundImage: 'linear-gradient(to right bottom, #54a799, #177b73)',
            }}
            title={
              <View style={{display: 'inline-flex', alignItems: 'center'}} onClick={() => navTo('/dealer/index', true)}>
                <Reward className={'text-orange-100 '} size={16}/>
                <Text style={{fontSize: '16px'}} className={'pl-3 text-orange-100 font-medium'}>开通会员</Text>
                <Text className={'text-white opacity-80 pl-3'}>享优惠</Text>
              </View>
            }
            extra={<ArrowRight color="#cccccc" size={18}/>}
          />
        )}

        {/*是否管理员*/}
        {isAdmin() && (
          <Cell
            className="nutui-cell-clickable"
            style={{
              backgroundImage: 'linear-gradient(to right bottom, #ff8e0c, #ed680d)',
            }}
            title={
              <View style={{display: 'inline-flex', alignItems: 'center'}} onClick={() => navTo('/admin/article/index', true)}>
                <Setting className={'text-orange-100 '} size={16}/>
                <Text style={{fontSize: '16px'}} className={'pl-3 text-orange-100 font-medium'}>管理中心</Text>
              </View>
            }
            extra={<ArrowRight color="#cccccc" size={18}/>}
          />
        )}

        <Cell.Group divider={true} description={
          <View style={{display: 'inline-flex', alignItems: 'center'}}>
            <Text style={{marginTop: '12px'}}>我的服务</Text>
          </View>
        }>
          <Cell
            className="nutui-cell-clickable"
            title={
              <View style={{display: 'inline-flex', alignItems: 'center'}}>
                <Scan size={16}/>
                <Text className={'pl-3 text-sm'}>门店核销</Text>
              </View>
            }
            align="center"
            extra={<ArrowRight color="#cccccc" size={18}/>}
            onClick={() => {
              navTo('/user/wallet/index', true)
            }}
          />
          <Cell
            className="nutui-cell-clickable"
            style={{
              display: 'none'
            }}
            title={
              <View style={{display: 'inline-flex', alignItems: 'center'}}>
                <LogisticsError size={16}/>
                <Text className={'pl-3 text-sm'}>我的钱包</Text>
              </View>
            }
            align="center"
            extra={<ArrowRight color="#cccccc" size={18}/>}
            onClick={() => {
              navTo('/user/wallet/index', true)
            }}
          />
          <Cell
            className="nutui-cell-clickable"
            title={
              <View style={{display: 'inline-flex', alignItems: 'center'}}>
                <Location size={16}/>
                <Text className={'pl-3 text-sm'}>收货地址</Text>
              </View>
            }
            align="center"
            extra={<ArrowRight color="#cccccc" size={18}/>}
            onClick={() => {
              navTo('/user/address/index', true)
            }}
          />
          <Cell
            className="nutui-cell-clickable"
            title={
              <View style={{display: 'inline-flex', alignItems: 'center'}}>
                <ShieldCheck size={16} color={isCertified() ? '#52c41a' : '#666'}/>
                <Text className={'pl-3 text-sm'}>实名认证</Text>
                {isCertified() && (
                  <Text className={'pl-2 text-xs text-green-500'}>已认证</Text>
                )}
              </View>
            }
            align="center"
            extra={<ArrowRight color="#cccccc" size={18}/>}
            onClick={() => {
              navTo('/user/userVerify/index', true)
            }}
          />
          <Cell
            className="nutui-cell-clickable"
            title={
              <View style={{display: 'inline-flex', alignItems: 'center'}}>
                <Ask size={16}/>
                <Text className={'pl-3 text-sm'}>常见问题</Text>
              </View>
            }
            align="center"
            extra={<ArrowRight color="#cccccc" size={18}/>}
            onClick={() => {
              navTo('/user/help/index')
            }}
          />
          <Cell
            className="nutui-cell-clickable"
            title={
              <View style={{display: 'inline-flex', alignItems: 'center'}}>
                <Tips size={16}/>
                <Text className={'pl-3 text-sm'}>关于我们</Text>
              </View>
            }
            align="center"
            extra={<ArrowRight color="#cccccc" size={18}/>}
            onClick={() => {
              navTo('/user/about/index')
            }}
          />
        </Cell.Group>
        <Cell.Group divider={true} description={
          <View style={{display: 'inline-flex', alignItems: 'center'}}>
            <Text style={{marginTop: '12px'}}>账号管理</Text>
          </View>
        }>
          <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>
      </View>
    </>
  )
}
export default UserCell