import { G2, measureTextWidth } from "@ant-design/plots";

const G = G2.getEngine("canvas");

export const structureCardList = [
  {
    title: "当期总人数",
    active: 0,
    number: 489,
    unit: "人",
    color: "#FFBB31",
    tabList: ["本月", "上月"]
  },
  {
    title: "本月入职",
    active: 0,
    number: 100,
    unit: "人",
    color: "#3DA5F6",
    tabList: ["本月", "上月"]
  },
  {
    title: "本月离职",
    active: 0,
    number: 23,
    unit: "人",
    color: "#5FD5C7",
    tabList: ["本月", "上月"]
  },
  {
    title: "年度累计入职",
    active: 0,
    number: 238,
    unit: "人",
    color: "#2B6DF6",
    tabList: ["本年", "去年"]
  },
  {
    title: "年度累计离职",
    active: 0,
    number: 198,
    unit: "人",
    color: "#B571EA",
    tabList: ["本年", "去年"]
  },
  {
    title: "平均年龄",
    active: 0,
    number: 28.0,
    unit: "岁",
    color: "#5FCC7B",
    tabList: ["本年", "去年"]
  }
];


//人员流动数据
export const flowingData = [
  {
    type: "当期总人数",
    value: 27
  },
  {
    type: "本月入职",
    value: 25
  },
  {
    type: "本月离职",
    value: 18
  },
  {
    type: "年度累计入职",
    value: 15
  },
  {
    type: "年度累计离职",
    value: 10
  },
  {
    type: "平均年龄",
    value: 5
  }
];
//人员流动配置信息
export const flowingConfig = {
  appendPadding: 10,
  data: flowingData,
  angleField: "value",
  colorField: "type",
  radius: 1,
  // 设置圆弧起始角度
  startAngle: Math.PI,
  endAngle: Math.PI * 1.5,
  label: {
    type: "inner",
    offset: "-2%",
    content: "{name}",
    style: {
      fontSize: 15
    }
  },
  interactions: [],
  pieStyle: {
    lineWidth: 0
  }
};

//司龄占比数据
export const seniorityData = [
  {
    type: "5年",
    value: 100
  },
  {
    type: "10年",
    value: 200
  },
  {
    type: "15年",
    value: 300
  },
  {
    type: "其他",
    value: 200
  }
];
//性别占比数据
export const genderData = [
  {
    type: "男",
    value: 20
  },
  {
    type: "女",
    value: 80
  }
];
//学历占比数据
export const degreeData = [
  {
    type: "大专",
    value: 45
  },
  {
    type: "大专以下",
    value: 35
  },
  {
    type: "全日制本科",
    value: 11
  },
  {
    type: "硕士",
    value: 6
  },
  {
    type: "研究生",
    value: 1
  },
  {
    type: "中专",
    value: 1
  },
  {
    type: "博士",
    value: 1
  }
];
//条线占比数据
export const linesData = [
  {
    type: "条线1",
    value: 35
  },
  {
    type: "条线2",
    value: 25
  },
  {
    type: "条线3",
    value: 15
  },
  {
    type: "条线4",
    value: 17
  },
  {
    type: "条线5",
    value: 8
  }
];
//实习生占比数据
export const internData = [
  {
    type: "1",
    value: 17
  },
  {
    type: "2",
    value: 25
  },
  {
    type: "3",
    value: 8
  },
  {
    type: "4",
    value: 35
  },
  {
    type: "5",
    value: 15
  }
];
export const seniorityConfig = {
  appendPadding: 10,
  data: [],
  angleField: "value",
  colorField: "type",
  radius: 0.75,
  label: {
    type: "inner",
    offset: "-30%",
    content: ({ percent }) => `${(percent * 100).toFixed(0)}%`,
    style: {
      fontSize: 14,
      textAlign: "center"
    }
  },
  interactions: []
};

//人员流动情况趋势图数据信息
export const flowingTrendData = [
  {
    "name": "入职",
    "年份": "2022",
    "年份流动信息": 18.9
  },
  {
    "name": "入职",
    "年份": "2023",
    "年份流动信息": 28.8
  },
  {
    "name": "离职",
    "年份": "2022",
    "年份流动信息": 12.4
  },
  {
    "name": "离职",
    "年份": "2023",
    "年份流动信息": 23.2
  },
  {
    "name": "在职",
    "年份": "2022",
    "年份流动信息": 12.4
  },
  {
    "name": "在职",
    "年份": "2023",
    "年份流动信息": 23.2
  }
];
//人员流动情况趋势图配置信息
export const flowingTrendconfig = {
  data: flowingTrendData,
  isGroup: true,
  xField: "年份",
  yField: "年份流动信息",
  seriesField: "name",
  // 分组柱状图 组内柱子间的间距 (像素级别)
  dodgePadding: 2,
  // 分组柱状图 组间的间距 (像素级别)
  intervalPadding: 50,
  label: {
    // 可手动配置 label 数据标签位置
    position: "middle",
    // 'top', 'middle', 'bottom'
    // 可配置附加的布局方法
    layout: [
      // 柱形图数据标签位置自动调整
      {
        type: "interval-adjust-position"
      }, // 数据标签防遮挡
      {
        type: "interval-hide-overlap"
      }, // 数据标签文颜色自动调整
      {
        type: "adjust-color"
      }
    ]
  }
};


//机构人员排名数数据
export const institutionData = [
  {
    stage: "机构一",
    number: 253
  },
  {
    stage: "机构二",
    number: 151
  },
  {
    stage: "机构三",
    number: 113
  },
  {
    stage: "机构四",
    number: 87
  },
  {
    stage: "机构五",
    number: 59
  }
];
//机构人员排名配置信息
export const institutionConfig = {
  data: institutionData,
  xField: "stage",
  yField: "number",
  dynamicHeight: true
  // legend: false
};

//人员异动分析数数据
export const personChangeData = [
  {
    type: "全员离职率",
    value: 253
  },
  {
    type: "关键岗位离职率",
    value: 151
  },
  {
    type: "绩优员工离职率",
    value: 113
  }
];
export const personChangeConfig = {
  appendPadding: 10,
  data: [],
  angleField: "value",
  colorField: "type",
  radius: 0.75,
  label: {
    type: "spider",
    labelHeight: 28,
    content: "{name}\n{percentage}"
  },
  interactions: []
};

//详细图表柱状图
export const multiplData = [
  { "city": "12", "type": "今年", "value": 18000 },
  { "city": "12", "type": "去年", "value": 11000 },
  { "city": "11", "type": "今年", "value": 18000 },
  { "city": "11", "type": "去年", "value": 11000 },
  { "city": "10", "type": "今年", "value": 18000 },
  { "city": "10", "type": "去年", "value": 11000 },
  { "city": "09", "type": "今年", "value": 18000 },
  { "city": "09", "type": "去年", "value": 11000 },
  { "city": "08", "type": "今年", "value": 18000 },
  { "city": "08", "type": "去年", "value": 11000 },
  { "city": "07", "type": "今年", "value": 17000 },
  { "city": "07", "type": "去年", "value": 6000 },
  { "city": "06", "type": "今年", "value": 9000 },
  { "city": "06", "type": "去年", "value": 8500 },
  { "city": "05", "type": "今年", "value": 14000 },
  { "city": "05", "type": "去年", "value": 9000 },
  { "city": "04", "type": "今年", "value": 14000 },
  { "city": "04", "type": "去年", "value": 9000 },
  { "city": "03", "type": "今年", "value": 16000 },
  { "city": "03", "type": "去年", "value": 5000 },
  { "city": "02", "type": "今年", "value": 9000 },
  { "city": "02", "type": "去年", "value": 8500 },
  { "city": "01", "type": "今年", "value": 14500 },
  { "city": "01", "type": "去年", "value": 8500 }
];

//人员流动情况趋势图配置信息
export const multipleConfig = {
  data: [],
  xField: "city",
  yField: "value",
  seriesField: "type",
  isGroup: true,
  columnStyle: {
    radius: [20, 20, 0, 0]
  }
};

//培训管理分析数据
export const trainingData = [
  {
    type: "人均培训费用",
    value: 20
  },
  {
    type: "人均培训时长",
    value: 80
  }
];

//培训排名
export const rankingData = [
  {
    label: "财务部",
    type: "前五",
    value: 2800
  },
  {
    label: "销售部",
    type: "前五",
    value: 1800
  },
  {
    label: "策划部",
    type: "前五",
    value: 950
  },
  {
    label: "运营部",
    type: "前五",
    value: 500
  },
  {
    label: "后勤部",
    type: "前五",
    value: 170
  },
  {
    label: "财务部1",
    type: "后五",
    value: 2260
  },
  {
    label: "销售部1",
    type: "后五",
    value: 1300
  },
  {
    label: "策划部1",
    type: "后五",
    value: 900
  },
  {
    label: "运营部1",
    type: "后五",
    value: 390
  },
  {
    label: "后勤部1",
    type: "后五",
    value: 100
  }
];
export const rankingConfig = {
  data: [],
  isGroup: true,
  xField: "value",
  yField: "label",
  seriesField: "type",
  dodgePadding: 4,
  label: {
    // 可手动配置 label 数据标签位置
    position: "middle",
    // 'left', 'middle', 'right'
    // 可配置附加的布局方法
    layout: [
      // 柱形图数据标签位置自动调整
      {
        type: "interval-adjust-position"
      }, // 数据标签防遮挡
      {
        type: "interval-hide-overlap"
      }, // 数据标签文颜色自动调整
      {
        type: "adjust-color"
      }
    ]
  }
};

//人效分析数据
export const humanAnalysisData = [
  {
    "name": "销售投入回报",
    "company": "公司1",
    "value": 18.9
  },
  {
    "name": "销售投入回报",
    "company": "公司2",
    "value": 28.8
  },
  {
    "name": "人均利润",
    "company": "公司1",
    "value": 12.4
  },
  {
    "name": "人均利润",
    "company": "公司2",
    "value": 23.2
  },
  {
    "name": "人均销售额",
    "company": "公司1",
    "value": 12.4
  },
  {
    "name": "人均销售额",
    "company": "公司2",
    "value": 23.2
  }
];
export const humanAnalysisconfig = {
  data: humanAnalysisData,
  isGroup: true,
  xField: "company",
  yField: "value",
  seriesField: "name",
  // 分组柱状图 组内柱子间的间距 (像素级别)
  dodgePadding: 2,
  // 分组柱状图 组间的间距 (像素级别)
  intervalPadding: 50,
  label: {
    // 可手动配置 label 数据标签位置
    position: "middle",
    // 'top', 'middle', 'bottom'
    // 可配置附加的布局方法
    layout: [
      // 柱形图数据标签位置自动调整
      {
        type: "interval-adjust-position"
      }, // 数据标签防遮挡
      {
        type: "interval-hide-overlap"
      }, // 数据标签文颜色自动调整
      {
        type: "adjust-color"
      }
    ]
  }
};
//人效排名数据
export const humanEfficiencyRankingData = [
  {
    title: "员工1",
    description: "公司1",
    rank: 1
  },
  {
    title: "员工2",
    description: "公司2",
    rank: 2
  },
  {
    title: "员工3",
    description: "公司3",
    rank: 3
  },
  {
    title: "员工4",
    description: "公司4",
    rank: 4
  }
];
//销售新客户合同数量排名
export const saleEfficiencyRankingData = [
  {
    title: "员工5",
    description: "公司1",
    rank: 1
  },
  {
    title: "员工6",
    description: "公司2",
    rank: 2
  },
  {
    title: "员工7",
    description: "公司3",
    rank: 3
  },
  {
    title: "员工8",
    description: "公司4",
    rank: 4
  }
];
//新销售有效合同
export const newSaleEfficiencyRankingData = [
  {
    title: "员工9",
    description: "公司1",
    rank: 1
  },
  {
    title: "员工10",
    description: "公司2",
    rank: 2
  },
  {
    title: "员工11",
    description: "公司3",
    rank: 3
  },
  {
    title: "员工12",
    description: "公司4",
    rank: 4
  }
];


//人工总成本数据
export const totalLaborCostdata = [
  {
    time: "Jan.",
    value: 350,
    count: 800
  },
  {
    time: "Feb.",
    value: 900,
    count: 600
  },
  {
    time: "Mar.",
    value: 300,
    count: 400
  },
  {
    time: "Apr.",
    value: 450,
    count: 380
  },
  {
    time: "May.",
    value: 470,
    count: 220
  },
  {
    time: "Jun.",
    value: 470,
    count: 220
  },
  {
    time: "Jul.",
    value: 470,
    count: 220
  },
  {
    time: "Aug.",
    value: 470,
    count: 220
  }
];
export const totalLaborCostConfig = {
  data: [totalLaborCostdata, totalLaborCostdata],
  xField: "time",
  yField: ["value", "count"],
  yAxis: {
    // 格式化左坐标轴
    value: {
      min: 0,
      label: {
        formatter: (val) => `${val}W`
      }
    },
    // 隐藏右坐标轴
    count: false
  },
  geometryOptions: [
    {
      geometry: "column",
      color: "#5B8FF9",
      columnWidthRatio: 0.4,
      label: {
        position: "middle"
      }
    },
    {
      geometry: "line",
      smooth: true,
      color: "#5AD8A6"
    }
  ],
  interactions: [],
  annotations: {
    value: [
      {
        type: "text",
        position: ["2019-06", "max"],
        content: "柱线混合图"
      }
    ],
    count: [
      {
        type: "dataMarker",
        top: true,
        position: ["2019-05", 400],
        line: {
          length: 20
        },
        text: {
          content: "",
          style: {
            textAlign: "left"
          }
        }
      }
    ]
  }
};

//人均收入配置数据 1、人均固定收入 2、人均浮动收入
export const fixedIncomePerData = [
  {
    type: "销售",
    value: 27
  },
  {
    type: "项目",
    value: 25
  },
  {
    type: "开发",
    value: 18
  },
  {
    type: "客服",
    value: 15
  },
  {
    type: "其他",
    value: 10
  },
  {
    type: "其他",
    value: 5
  }
];
export const floatingIncomePerData = [
  {
    type: "销售",
    value: 18
  },
  {
    type: "项目",
    value: 29
  },
  {
    type: "开发",
    value: 23
  },
  {
    type: "客服",
    value: 3
  },
  {
    type: "其他",
    value: 22
  },
  {
    type: "其他",
    value: 5
  }
];
//人均收入配置信息
export const perCapitaIncomeConfig = {
  appendPadding: 10,
  data: [],
  angleField: "value",
  colorField: "type",
  radius: 1,
  innerRadius: 0.64,
  meta: {
    value: {
      formatter: (v) => `${v} ¥`
    }
  },
  label: {
    type: "inner",
    offset: "-50%",
    style: {
      textAlign: "center"
    },
    autoRotate: false,
    content: "{value}"
  },
  statistic: {
    title: {
      offsetY: -4,
      customHtml: (container, view, datum) => {
        const { width, height } = container.getBoundingClientRect();
        const d = Math.sqrt(Math.pow(width / 2, 2) + Math.pow(height / 2, 2));
        //总计
        const text = datum ? datum.type : "";
        return renderStatistic(d, text, {
          fontSize: 28
        });
      }
    },
    content: {
      offsetY: 4,
      style: {
        fontSize: "32px"
      },
      customHtml: (container, view, datum, data) => {
        const { width } = container.getBoundingClientRect();
        const text = datum ? `¥ ${datum.value}` : `¥ ${data.reduce((r, d) => r + d.value, 0)}`;
        return renderStatistic(width, "", {
          fontSize: 32
        });
      }
    }
  },
  // 添加 中心统计文本 交互
  interactions: []
};


//人均人工成本数据
export const laborCostsPerCapitaData = [
  {
    year: "Jan.",
    value: 3,
    count: 10
  },
  {
    year: "Feb.",
    value: 4,
    count: 4
  },
  {
    year: "Mar.",
    value: 3.5,
    count: 5
  },
  {
    year: "Apr.",
    value: 5,
    count: 5
  },
  {
    year: "May.",
    value: 4.9,
    count: 4.9
  },
  {
    year: "Jun.",
    value: 6,
    count: 35
  },
  {
    year: "Jul.",
    value: 7,
    count: 7
  },
  {
    year: "Aug.",
    value: 9,
    count: 1
  }
];
export const laborCostsPerCapitaConfig = {
  data: [laborCostsPerCapitaData, laborCostsPerCapitaData],
  xField: "year",
  yField: ["value", "count"],
  geometryOptions: [
    {
      geometry: "line",
      smooth: true,
      color: "#5B8FF9",
      label: {
        formatter: (datum) => {
          return `${datum.value}w`;
        }
      },
      lineStyle: {
        lineWidth: 3,
        lineDash: [5, 5]
      }
    },
    {
      geometry: "line",
      smooth: true,
      color: "#5AD8A6",
      lineStyle: {
        lineWidth: 4,
        opacity: 0.5
      },
      label: {
        formatter: (datum) => {
          return `${datum.count}w`;
        }
      },
      point: {
        shape: "circle",
        size: 4,
        style: {
          opacity: 0.5,
          stroke: "#5AD8A6",
          fill: "#fff"
        }
      }
    }
  ]
};

function renderStatistic(containerWidth, text, style) {
  const { width: textWidth, height: textHeight } = measureTextWidth(text, style);
  const R = containerWidth / 2; // r^2 = (w / 2)^2 + (h - offsetY)^2

  let scale = 1;

  if (containerWidth < textWidth) {
    scale = Math.min(Math.sqrt(Math.abs(Math.pow(R, 2) / (Math.pow(textWidth / 2, 2) + Math.pow(textHeight, 2)))), 1);
  }

  const textStyleStr = `width:${containerWidth}px;`;
  return `<div style="${textStyleStr};font-size:${scale}em;line-height:${scale < 1 ? 1 : "inherit"};">${text}</div>`;
}