import React from "react";
import { View } from "@tarojs/components";
import { useModel } from "@/store";

export default (props) => {
  const { roles = []  } = props;
  // console.log(props);
  const { duty } = useModel("user");
  // console.log("---------------------************-----------------");

  // const hasRights = roles.indexOf(duty) > -1;
  const hasRights = roles.includes(duty);
  // console.log(duty);
  // console.log("!roles.length", !roles.length);
  // console.log("hasRights", hasRights);
  // console.log("roles", roles);
  // console.log("!roles.length || hasRights", !roles.length || hasRights);


  const filteredChildren = React.Children.toArray(props.children).filter(
    child => React.isValidElement(child)
  );

  return !roles.length || hasRights ? (
   <div>{filteredChildren}</div>
  ) : (
    <View
      style={{
        width: "100%",
        height: "100%",
        display: "grid",
        placeItems: "center",
      }}
    >
      <View>暂无权限</View>
    </View>
  );
};