#!/usr/bin/env node
const fs = require('fs');
const filePath = process.argv[2];
const name = process.argv[3];

var styles = {
  bold: ['\x1B[1m', '\x1B[22m'],
  italic: ['\x1B[3m', '\x1B[23m'],
  underline: ['\x1B[4m', '\x1B[24m'],
  inverse: ['\x1B[7m', '\x1B[27m'],
  strikethrough: ['\x1B[9m', '\x1B[29m'],
  white: ['\x1B[37m', '\x1B[39m'],
  grey: ['\x1B[90m', '\x1B[39m'],
  black: ['\x1B[30m', '\x1B[39m'],
  blue: ['\x1B[34m', '\x1B[39m'],
  cyan: ['\x1B[36m', '\x1B[39m'],
  green: ['\x1B[32m', '\x1B[39m'],
  magenta: ['\x1B[35m', '\x1B[39m'],
  red: ['\x1B[31m', '\x1B[39m'],
  yellow: ['\x1B[33m', '\x1B[39m'],
  whiteBG: ['\x1B[47m', '\x1B[49m'],
  greyBG: ['\x1B[49;5;8m', '\x1B[49m'],
  blackBG: ['\x1B[40m', '\x1B[49m'],
  blueBG: ['\x1B[44m', '\x1B[49m'],
  cyanBG: ['\x1B[46m', '\x1B[49m'],
  greenBG: ['\x1B[42m', '\x1B[49m'],
  magentaBG: ['\x1B[45m', '\x1B[49m'],
  redBG: ['\x1B[41m', '\x1B[49m'],
  yellowBG: ['\x1B[43m', '\x1B[49m'],
};
if (!filePath || !name) {
  console.error(styles.red[0], `输入错误`);
  console.error(
    styles.red[0],
    `请输入${!filePath ? '路径' : ''}${!name ? '名字' : ''}!`
  );
  return;
}

try {
  function firstUpperCase(name) {
    return name.replace(/\b(\w)(\w*)/g, function ($0, $1, $2) {
      return $1.toUpperCase() + $2.toLowerCase();
    });
  }
  const fileName = firstUpperCase(name);
  fs.mkdirSync(`./src/pages/${fileName}`);
  fs.writeFileSync(`./src/pages/${fileName}/index.js`, index());
  fs.writeFileSync(`./src/pages/${fileName}/${fileName}.tsx`, tmp());
  fs.writeFileSync(`./src/pages/${fileName}/${fileName}.less`, style());

  function index() {
    return `import ${fileName} from './${fileName}.tsx';
import './${fileName}.less';

export default ${fileName}
`;
  }

  function tmp() {
    return `import React from 'react';
import { Button } from 'antd';

export default class ${fileName} extends React.Component {
  test() {
    console.log('${fileName}');
  }
  render() {
    return (
      <div className="${name}-wrapper">
        ${fileName}
        <div>
          <Button onClick={(e) => this.test()}>goto</Button>
        </div>
      </div>
    );
  }
}`;
  }

  function style() {
    return `.${name}-wrapper {
  background-color: blanchedalmond;
}`;
  }
  console.log(styles.green[0], '文件创成功');
} catch (e) {
  console.log(styles.red[0], '出现错误', e);
}