init

.gitignore

@@ -0,0 +1,104 @@
+# Logs
+logs
+*.log
+npm-debug.log*
+yarn-debug.log*
+yarn-error.log*
+lerna-debug.log*
+
+# Diagnostic reports (https://nodejs.org/api/report.html)
+report.[0-9]*.[0-9]*.[0-9]*.[0-9]*.json
+
+# Runtime data
+pids
+*.pid
+*.seed
+*.pid.lock
+
+# Directory for instrumented libs generated by jscoverage/JSCover
+lib-cov
+
+# Coverage directory used by tools like istanbul
+coverage
+*.lcov
+
+# nyc test coverage
+.nyc_output
+
+# Grunt intermediate storage (https://gruntjs.com/creating-plugins#storing-task-files)
+.grunt
+
+# Bower dependency directory (https://bower.io/)
+bower_components
+
+# node-waf configuration
+.lock-wscript
+
+# Compiled binary addons (https://nodejs.org/api/addons.html)
+build/Release
+
+# Dependency directories
+node_modules/
+jspm_packages/
+
+# TypeScript v1 declaration files
+typings/
+
+# TypeScript cache
+*.tsbuildinfo
+
+# Optional npm cache directory
+.npm
+
+# Optional eslint cache
+.eslintcache
+
+# Microbundle cache
+.rpt2_cache/
+.rts2_cache_cjs/
+.rts2_cache_es/
+.rts2_cache_umd/
+
+# Optional REPL history
+.node_repl_history
+
+# Output of 'npm pack'
+*.tgz
+
+# Yarn Integrity file
+.yarn-integrity
+
+# dotenv environment variables file
+.env
+.env.test
+
+# parcel-bundler cache (https://parceljs.org/)
+.cache
+
+# Next.js build output
+.next
+
+# Nuxt.js build / generate output
+.nuxt
+dist
+
+# Gatsby files
+.cache/
+# Comment in the public line in if your project uses Gatsby and *not* Next.js
+# https://nextjs.org/blog/next-9-1#public-directory-support
+# public
+
+# vuepress build output
+.vuepress/dist
+
+# Serverless directories
+.serverless/
+
+# FuseBox cache
+.fusebox/
+
+# DynamoDB Local files
+.dynamodb/
+
+# TernJS port file
+.tern-port

.storybook/addons.js

@@ -0,0 +1,9 @@
+import '@storybook/addon-actions/register';
+import '@storybook/addon-links/register';
+import '@storybook/addon-notes/register';
+import '@storybook/addon-knobs/register';
+import '@storybook/addon-viewport/register';
+import '@storybook/addon-console';
+import '@storybook/addon-storysource/register';
+import 'storybook-addon-themes';
+import 'storybook-readme/register';

.storybook/config.js

@@ -0,0 +1,25 @@
+import { configure, getStorybook } from '@storybook/react';
+import { addParameters } from '@storybook/react';
+import { INITIAL_VIEWPORTS } from '@storybook/addon-viewport';
+import { addDecorator } from '@storybook/react';
+import { withConsole } from '@storybook/addon-console';
+import theme from './theme';
+
+import 'antd/dist/antd.less';
+
+addParameters({
+  info: { inline: true },
+  viewport: {
+    viewports: INITIAL_VIEWPORTS,
+    defaultViewport: 'someDefault',
+  },
+  options: { theme },
+});
+// automatically import all files ending in *.stories.tsx
+configure(
+  require.context('../stories', true, /\.stories\.(t|j)sx?$/), module
+)
+
+addDecorator((storyFn, context) => withConsole()(storyFn)(context));
+
+export { getStorybook }

.storybook/preview-head.html

@@ -0,0 +1 @@
+<link rel="stylesheet" href="//at.alicdn.com/t/font_1158309_1tkgtp97s75.css" />

.storybook/theme.js

@@ -0,0 +1,37 @@
+import { create } from '@storybook/theming/create';
+
+export default create({
+  base: 'light',
+
+  colorPrimary: '#fc4747',
+  colorSecondary: '#fc695a',
+
+  // UI
+  appBg: 'white',
+  appContentBg: 'white',
+  appBorderColor: 'grey',
+  appBorderRadius: 4,
+
+  // Typography
+  fontBase: '"Open Sans", sans-serif',
+  fontCode: 'monospace',
+
+  // Text colors
+  textColor: 'black',
+  textInverseColor: 'rgba(255,255,255,0.9)',
+
+  // Toolbar default and active colors
+  barTextColor: 'black',
+  barSelectedColor: 'white',
+  barBg: '#fc4747',
+
+  // Form colors
+  inputBg: 'white',
+  inputBorder: 'silver',
+  inputTextColor: 'black',
+  inputBorderRadius: 4,
+
+  brandTitle: 'BilingoUI',
+  brandUrl: 'https://www.bilingo.com/',
+  brandImage: 'https://a.links123.cn/common/imgs/logo_en_mobile@2x.png?2019021101',
+});

.storybook/webpack.config.js

@@ -0,0 +1,72 @@
+const fs = require('fs');
+const path = require('path');
+
+module.exports = ({ config }) => {
+  config.resolve.modules =  ['node_modules'];
+  config.module.rules.push({
+    test: /\.stories\.tsx?$/,
+    loaders: [require.resolve('@storybook/source-loader')],
+    enforce: 'pre',
+  });
+  config.module.rules.push({
+    test: /\.less$/,
+    include: /node_modules|antd\.less/,
+    use: [
+      "style-loader",
+      "css-loader",
+      {
+        loader: "less-loader",
+        options: {
+          javascriptEnabled: true
+        }
+      }
+    ]
+  });
+  config.module.rules.push({
+    test: /\.less$/,
+    use: [
+    'style-loader', 
+    {
+      loader: 'css-loader',// translates CSS into CommonJS
+      options: {
+        modules: {
+          localIdentName: '[name]__[local]___[hash:base64:5]',
+        },
+      }
+    },
+    'postcss-loader',
+    {
+      loader: 'less-loader',
+      options: {
+        config: {
+          path: path.join(path.resolve(__dirname, '..'), 'postcss.config.js')
+        },
+        javascriptEnabled: true,
+      },
+    }],
+    exclude: /node_modules|antd\.less/,
+  });
+  config.module.rules.push({
+    test: /\.(ts|tsx)$/,
+    use: [
+      {
+        loader: require.resolve('babel-loader'),
+        options: {
+          presets: [['react-app', { flow: false, typescript: true }]],
+        }
+      },
+      // Optional
+      {
+        loader: require.resolve("react-docgen-typescript-loader")
+      },
+    ]
+  });
+  config.resolve.extensions.push(".ts", ".tsx");
+  config.resolve.alias = {
+    ...config.resolve.alias,
+    '@': `${path.resolve(fs.realpathSync(process.cwd()), './src')}`,
+    '@components': `${path.resolve(fs.realpathSync(process.cwd()), './src')}/components`,
+  }
+  config.output.library = "[name]";
+  return config;
+};

package.json

@@ -0,0 +1,124 @@
+{
+  "name": "base-ui",
+  "version": "1.0.0",
+  "description": "a base components ui lib",
+  "main": "index.js",
+  "scripts": {
+    "start": "react-app-rewired start",
+    "build": "react-app-rewired build",
+    "test": "react-app-rewired test",
+    "eject": "react-app-rewired eject",
+    "build:lib": "rimraf lib && rimraf eslib && rollup -c ./rollup.config.js",
+    "storybook": "start-storybook -p 9009 -s public",
+    "build-storybook": "build-storybook -s public"
+  },
+  "dependencies": {
+    "@testing-library/jest-dom": "^4.2.4",
+    "@testing-library/react": "^9.3.2",
+    "@testing-library/user-event": "^7.1.2",
+    "@types/axios": "^0.14.0",
+    "@types/braft-editor": "^2.2.0",
+    "@types/classnames": "^2.2.9",
+    "@types/jest": "^24.0.0",
+    "@types/node": "^12.0.0",
+    "@types/react": "^16.9.0",
+    "@types/react-dom": "^16.9.0",
+    "@types/react-intl": "^3.0.0",
+    "@wessberg/rollup-plugin-ts": "^1.2.15",
+    "antd": "^4.3.4",
+    "axios": "^0.19.2",
+    "classnames": "^2.2.6",
+    "immutable": "^4.0.0-rc.12",
+    "react-scripts": "3.3.0",
+    "rollup-plugin-visualizer": "^3.3.1",
+    "typescript": "~3.7.2"
+  },
+  "author": "thewindsword",
+  "license": "MIT",
+  "eslintConfig": {
+    "extends": "react-app"
+  },
+  "browserslist": {
+    "production": [
+      ">0.2%",
+      "not dead",
+      "not op_mini all"
+    ],
+    "development": [
+      "last 1 chrome version",
+      "last 1 firefox version",
+      "last 1 safari version"
+    ]
+  },
+  "devDependencies": {
+    "@babel/cli": "^7.7.5",
+    "@babel/core": "^7.7.5",
+    "@babel/plugin-proposal-class-properties": "^7.7.4",
+    "@babel/plugin-proposal-export-default-from": "^7.7.4",
+    "@babel/polyfill": "^7.7.0",
+    "@babel/preset-env": "^7.7.6",
+    "@babel/preset-react": "^7.7.4",
+    "@babel/preset-typescript": "^7.7.4",
+    "@rollup/plugin-alias": "^3.0.0",
+    "@rollup/plugin-commonjs": "^11.0.0",
+    "@rollup/plugin-image": "^2.0.0",
+    "@rollup/plugin-node-resolve": "^6.0.0",
+    "@rollup/plugin-url": "^4.0.0",
+    "@storybook/addon-actions": "^5.2.8",
+    "@storybook/addon-console": "^1.2.1",
+    "@storybook/addon-info": "^5.2.8",
+    "@storybook/addon-knobs": "^5.2.8",
+    "@storybook/addon-links": "^5.2.8",
+    "@storybook/addon-notes": "^5.2.8",
+    "@storybook/addon-storysource": "^5.2.8",
+    "@storybook/addon-viewport": "^5.2.8",
+    "@storybook/addons": "^5.2.8",
+    "@storybook/react": "^5.2.8",
+    "@types/draft-js": "^0.10.38",
+    "@types/storybook-readme": "^5.0.4",
+    "@types/storybook__addon-info": "^5.2.1",
+    "@typescript-eslint/eslint-plugin": "^2.16.0",
+    "@typescript-eslint/parser": "^2.16.0",
+    "autoprefixer": "^9.7.3",
+    "babel-loader": "^8.0.6",
+    "babel-plugin-import": "^1.13.0",
+    "cross-env": "^6.0.3",
+    "css-loader": "^3.2.1",
+    "draftjs-utils": "^0.10.2",
+    "eslint": "^6.8.0",
+    "file-loader": "^5.0.2",
+    "less": "^3.10.3",
+    "less-loader": "^5.0.0",
+    "node-eval": "^2.0.0",
+    "postcss-loader": "^3.0.0",
+    "postcss-url": "^8.0.0",
+    "react": "^16.12.0",
+    "react-app-rewired": "^2.1.5",
+    "react-docgen-typescript-loader": "^3.6.0",
+    "react-dom": "^16.12.0",
+    "rimraf": "^3.0.0",
+    "rollup": "^1.27.13",
+    "rollup-plugin-alias": "^2.2.0",
+    "rollup-plugin-analyzer": "^3.2.2",
+    "rollup-plugin-babel": "^4.3.3",
+    "rollup-plugin-eslint": "^7.0.0",
+    "rollup-plugin-json": "^4.0.0",
+    "rollup-plugin-less": "^1.1.2",
+    "rollup-plugin-node-resolve": "^5.2.0",
+    "rollup-plugin-peer-deps-external": "^2.2.0",
+    "rollup-plugin-postcss-modules": "^2.0.1",
+    "rollup-plugin-replace": "^2.2.0",
+    "rollup-plugin-sourcemaps": "^0.5.0",
+    "rollup-plugin-typescript2": "^0.25.3",
+    "storybook-addon-themes": "^5.3.0",
+    "storybook-readme": "^5.0.8",
+    "style-loader": "^1.0.1",
+    "ts-loader": "^6.2.1",
+    "tslib": "^1.10.0"
+  },
+  "peerDependencies": {
+    "antd": "^4.3.4",
+    "react": "^16.12.0",
+    "react-dom": "^16.12.0"
+  }
+}

postcss.config.js

@@ -0,0 +1,5 @@
+module.exports = {  
+  plugins: [
+    require('autoprefixer'),
+  ]
+} 

rollup.config.js

@@ -0,0 +1,173 @@
+import resolve from "@rollup/plugin-node-resolve";
+import commonjs from "@rollup/plugin-commonjs";
+import image from '@rollup/plugin-image';
+import alias from '@rollup/plugin-alias';
+import postcss from 'rollup-plugin-postcss-modules'
+import babel from "rollup-plugin-babel";
+import { DEFAULT_EXTENSIONS } from '@babel/core';
+import json from "rollup-plugin-json";
+import autoprefixer from 'autoprefixer';
+import postcssUrl from 'postcss-url';
+import peerDepsExternal from 'rollup-plugin-peer-deps-external';
+import visualizer from 'rollup-plugin-visualizer';
+import analyze from 'rollup-plugin-analyzer';
+import ts from "@wessberg/rollup-plugin-ts";
+// import typescript from 'rollup-plugin-typescript2';
+// import sourcemaps from 'rollup-plugin-sourcemaps';
+
+// import url from '@rollup/plugin-url';
+// import less from "rollup-plugin-less";
+import nodeEval from 'node-eval';
+
+export function getModuleExports(moduleId) {
+  const id = require.resolve(moduleId)
+  const moduleOut = nodeEval(fs.readFileSync(id).toString(), id)
+  let result = []
+  const excludeExports = /^(default|__)/
+  if (moduleOut && typeof moduleOut === 'object') {
+      result = Object.keys(moduleOut)
+          .filter(name => !excludeExports.test(name))
+  }
+  return result
+}
+
+export function getNamedExports(moduleIds) {
+  const result = {}
+  moduleIds.forEach( id => {
+      result[id] = getModuleExports(id)
+  })
+  return result
+}
+
+const fs = require('fs');
+const path = require('path');
+const componentsFold = 'src/components';
+const cModuleNames = fs.readdirSync(path.resolve(componentsFold));
+const cModuleMap = cModuleNames.reduce((prev, name) => {
+  const modulePath = `${componentsFold}/${name}`;
+  prev[name] = `${modulePath}/index.ts`;
+  const child = fs.readdirSync(path.resolve(modulePath));
+  child.forEach(c => {
+    const childFoldPath = `${modulePath}/${c}`;
+    const isDir = fs.statSync(childFoldPath).isDirectory();
+    if (isDir) {
+      if (fs.existsSync(`${childFoldPath}/index.tsx`)) {
+        prev[c] = `${childFoldPath}/index.tsx`;
+      }
+      if (c === 'Common' && fs.existsSync(childFoldPath) && fs.statSync(childFoldPath).isDirectory()) {
+        const commonComponentsArr = fs.readdirSync(childFoldPath);
+        commonComponentsArr.forEach(commonComponentFold => {
+          const commonComponentFoldPath = `${childFoldPath}/${commonComponentFold}`;
+          const isCommonComponentDir = fs.statSync(commonComponentFoldPath).isDirectory();
+          if (isCommonComponentDir && fs.existsSync(`${commonComponentFoldPath}/index.tsx`)) {
+            prev[`${commonComponentFold}`] = `${commonComponentFoldPath}/index.tsx`;
+          }
+        });
+      }
+    }
+  });
+  return prev;
+}, {});
+
+const extensions = [ ...DEFAULT_EXTENSIONS, '.js', '.jsx', '.ts', '.tsx'];
+
+export default {
+  input: {
+    '.': "src/lib-build.ts",
+    ...cModuleMap
+  },
+  output: [
+    {
+      dir: "lib",
+      sourcemap: true,
+      entryFileNames: '[name]/index.js',
+      exports: 'named',
+      // file: "lib/bundle.js",
+      format: "cjs"
+    },
+    {
+      dir: "eslib",
+      sourcemap: true,
+      entryFileNames: '[name]/index.js',
+      exports: 'named',
+      // file: "lib/bundle.js",
+      format: "es"
+    }
+  ],
+  plugins: [
+    peerDepsExternal(),
+    resolve({
+      mainFields: ['jsnext'],
+      preferBuiltins: true,
+      browser: true,
+      extensions,
+    }),
+    image(),
+    json(),
+    // sourcemaps(),
+    commonjs({
+      include: /node_modules/,
+      browser: true,
+      namedExports: {
+        ...getNamedExports([
+          'prop-types',
+          'draft-js',
+        ]),
+        'braft-extensions/dist/emoticon': ['defaultEmoticons']
+      },
+    }),
+    // url(),
+    // less(),
+    postcss({
+      extensions: ['.css', '.less'],
+      plugins: [
+        autoprefixer(),
+        postcssUrl({
+          url: 'inline'
+        }),
+      ],
+      modules: true,
+    }),
+    ts({
+      exclude: "node_modules/**",
+      transpiler: "babel",
+      hook: {
+        outputPath: (path, kind) => {
+          return path
+        }
+      }
+    }),
+    // typescript({
+    //   include: ["*.js+(|x)", "**/*.js+(|x)", "*.ts+(|x)", "**/*.ts+(|x)"],
+    //   verbosity: 3,
+    //   clean: true,
+    //   typescript: require('typescript'),
+    //   // useTsconfigDeclarationDir: true,
+    //   rollupCommonJSResolveHack: true,
+    //   objectHashIgnoreUnknownHack: true,
+    // }),
+    babel({
+      exclude: "node_modules/**",
+      runtimeHelpers: true,
+      extensions,
+    }),
+    alias({
+      entries: [
+        { find: '@', replacement: 'src' },
+        { find: '@components', replacement: 'src/components' },
+      ],
+    }),
+    visualizer({
+      sourcemap: true,
+      open: true,
+    }),
+    analyze(),
+  ],
+  onwarn: function(warning) {
+    // Skip certain warnings
+    // should intercept ... but doesn't in some rollup versions
+    if ( warning.code === 'THIS_IS_UNDEFINED' ) { return; }
+    // console.warn everything else
+    console.warn( warning.message );
+  }
+};

src/components/comment/CommentItem.tsx

@@ -0,0 +1,35 @@
+import React, { Component } from 'react'
+
+export interface CommentItemData {
+  content: string;
+  created: number;
+  favor_count: number;
+  favored: boolean;
+  id: string;
+  is_speak: boolean;
+  medias: any;
+  replies: Array<any>
+  reply_count: number;
+  user_avatar: string;
+  user_id: number;
+  user_name: string;
+}
+
+interface IP {
+  data: CommentItemData;
+}
+
+interface IS {}
+
+export default class CommentItem extends Component<IP, IS> {
+  render() {
+    console.log(this.props.data.content);
+    return (
+      <div>
+        {
+          this.props.data.content
+        }
+      </div>
+    )
+  }
+}

src/components/comment/CommentList.tsx

@@ -0,0 +1,20 @@
+import React, { PureComponent } from 'react'
+import CommentItem, { CommentItemData } from './CommentItem'
+
+interface IP {
+  list: Array<CommentItemData>
+}
+
+interface IS {
+
+}
+
+export default class CommentList extends PureComponent<IP, IS> {
+  render() {
+    return (
+      <div>
+        {this.props.list.map(i => <CommentItem data={i} />)}
+      </div>
+    )
+  }
+}

src/components/comment/README.md

@@ -0,0 +1,13 @@
+# comment
+
+通用评论组件
+
+** `veresion 0.1` **
+
+## Getting Started
+
+
+## Running the tests
+
+
+## Built

src/components/comment/config/constant.js

@@ -0,0 +1,34 @@
+export const ERROR_DEFAULT = "出错了！";
+
+export const LIMIT = 10; // 默认 limit
+
+export const DRIVER_LICENSE_PATH = "/comment";
+
+export const OSS_LINK = "//links-comment.oss-cn-beijing.aliyuncs.com";
+
+export const MAX_UPLOAD_NUMBER = 4;
+
+export const URL_REGEXP = /((http(s)?:)?\/\/)?(www\.)?[-a-zA-Z0-9@:%._+~#=]{2,256}\.[a-z]{2,6}\b([-a-zA-Z0-9@:%_+.~#?&//=]*)/g;
+
+export const REGEXP = /\[[^[\]]+?\]/g;
+
+export const AVATAR = "";
+
+export const IMAGE_SPLIT = "IMAGE_SPLIT";
+
+export const IMAGE_PROCESS = "?x-oss-process=image/resize,h_350";
+export const IMAGE_PROCESS_SMALL = "?x-oss-process=image/resize,h_100";
+export const IMAGE_PROCESS_LARGE = "?x-oss-process=image/resize,h_500";
+
+export const COMMENT_TYPE = {
+  COMMENT: "comment",
+  REPLY: "reply"
+};
+
+// 线上静态库地址
+export const LANGUAGE_LINK =
+  process.env.NODE_ENV === "production"
+    ? "//a.links123.cn/lang"
+    : "//a.links123.net/lang";
+
+export const COMMENT_API = `http://api.links123.net/comment/v1`

src/components/comment/context/index.ts

@@ -0,0 +1,18 @@
+import React from 'react';
+import { LIMIT } from "@/components/comment/config/constant";
+
+export const CommentContext = React.createContext('comment')
+
+// const DEFAULT_TYPE = 1;
+// const DEFAULT_BUSSINESSID = 'test';
+// const DEFAULT_BUSSINESS_USER_ID = 4;
+// const DEFAULT_PAGE = 1;
+// const DEFAULT_LIMIT = LIMIT;
+
+export const DefaultValue = {
+  type: 1,
+  bussiness_id: 'test',
+  bussiness_user_id: 4,
+  page: 1,
+  limit: LIMIT,
+}

src/components/comment/demo.jsx

@@ -0,0 +1,14 @@
+import React from 'react';
+import CommentCombine from './index';
+import styles from './index.less';
+
+export class CommentDemo extends React.Component {
+  render() {
+    return (
+      <div className={styles.playgroundWrapper}>
+        <CommentCombine />
+      </div>
+    )
+  }
+}
+export default CommentDemo;

src/components/comment/index.jsx

@@ -0,0 +1,94 @@
+import React from 'react';
+import { getComment } from '@/services/comment';
+import { CommentContext, DefaultValue } from './context';
+import styles from './index.less';
+import CommentList from './CommentList';
+
+export class CommentCombine extends React.PureComponent {
+  constructor(props) {
+    super(props);
+    this.state = {
+      ...DefaultValue,
+    }
+  }
+
+  render() {
+    return (
+      <CommentContext.Provider value={this.state}>
+        <Comment />
+      </CommentContext.Provider>
+    )
+  }
+}
+
+export class Comment extends React.PureComponent {
+  static contextType = CommentContext;
+  static propTypes = {}
+  static defaultProps = {}
+
+  constructor(props) {
+    super(props);
+    this.state = {
+      comment_data: null,
+    };
+  }
+
+  componentDidMount = async () => {
+    const { type, limit, page, bussiness_id } = this.context;
+    const res = await getComment({
+      type,
+      limit,
+      page,
+      businessId: bussiness_id,
+    });
+    console.log("res:", res);
+    this.setState({
+      comment_data: res,
+    })
+  }
+
+  renderCommentList = (list) => {
+    // content: "[e101][e102]"
+    // created: 1582352617
+    // favor_count: 0
+    // favored: false
+    // id: "5e50c8e9818eda000192773d"
+    // is_speak: false
+    // medias: null
+    // replies: []
+    // reply_count: 0
+    // user_avatar: "https://links123-images.oss-cn-hangzhou.aliyuncs.com/avatar/2020/2/7/1326acc4b1609c8ecf52e94d58a38384.jpg?x-oss-process=image/resize,h_100"
+    // user_id: 71770
+    // user_name: "EvoKou"
+    return <CommentList list={list} />
+  }
+
+  renderComment = () => {
+    const { comment_data } = this.state;
+    if (comment_data === null) return "数据载入中";
+    const { list, total, page } = comment_data;
+    return (
+      <div>
+        total: {total}
+        page: {page}
+        <div>
+          {
+            this.renderCommentList(list)
+          }
+        </div>
+      </div>
+    )
+  }
+
+  render() {
+    console.log("context", this.context);
+    return (
+      <div>
+        {JSON.stringify(this.context)}
+        {this.renderComment()}
+      </div>
+    )
+  }
+}
+
+export default CommentCombine;

src/components/comment/index.less

@@ -0,0 +1,3 @@
+.playgroundWrapper {
+  min-height: 100%;
+}

src/helper/index.ts

@@ -0,0 +1,14 @@
+export function converObj(data: any) {
+  let _result = [];
+  for (let _key in data) {
+      let v = data[_key];
+      if (v.constructor === Array) {
+          v.forEach(function(_value) {
+              _result.push(`${_key}=${_value}`)
+          });
+      } else {
+          _result.push(`${_key}=${v}`)
+      }
+  }
+  return _result.join('&');
+}

src/services/comment.ts

@@ -0,0 +1,105 @@
+import axios from "axios";
+import { converObj } from "@/helper";
+import { COMMENT_API } from "@/components/comment/config/constant";
+
+type CommonListResponse = {
+  list: Array<any>;
+  total: number;
+  page: number;
+};
+
+interface CommonResponse {
+  config: any;
+  data: CommonListResponse;
+  headers: any;
+  request: any;
+  status: number;
+  statusText: string;
+}
+
+
+export const getComment = async ({
+  type,
+  businessId,
+  isSpeak,
+  page,
+  limit,
+}: {
+  type: string;
+  businessId: string;
+  isSpeak?: boolean;
+  page: string;
+  limit: string;
+}): Promise<any> => {
+  const r: CommonResponse = await axios.get(`${COMMENT_API}/comments?${converObj({
+    type,
+    business_id: businessId,
+    page,
+    limit,
+  })}`);
+  return r.data;
+}
+
+export const createComment = async ({
+  type,
+  businessId,
+  businessUserId,
+  content,
+}: {
+  type: string;
+  businessId: string;
+  businessUserId: string;
+  content: string;
+}): Promise<any> => {
+  const r = await axios.post(`${COMMENT_API}/comments`, {
+    method: 'post',
+    withCredentials: true,
+    data: {
+      type,
+      businessId,
+      businessUserId,
+      content,
+    },
+  });
+  return r;
+}
+
+export const updateComment = async ({
+  id,
+  content,
+} : {
+  id: string;
+  content: string;
+}) => {
+  const r = await axios.post(`${COMMENT_API}/comments/${id}`, {
+    method: 'post',
+    withCredentials: true,
+    data: {
+      content,
+    },
+  });
+  return r;
+}
+
+export const deleteComment = async ({
+  id,
+}: {
+  id: string;
+}) => {
+  const r = await axios.delete(`${COMMENT_API}/comments/${id}`);
+  return r;
+}
+
+export const favorComment = async ({
+  id,
+  commentId,
+  userId,
+} : {
+  id: string;
+  commentId: string;
+  userId: number;
+}) => {
+  // const r = await axios
+}
+
+// export const getFavorUserList = async () => {}

stories/comment.stories.jsx

@@ -0,0 +1,14 @@
+import React from 'react';
+import CommentDemo from '@/components/comment/demo';
+
+export default {
+  title: 'Comment',
+};
+
+export const comment = () => {
+  return (
+    <div>
+      <CommentDemo />
+    </div>
+  )
+}

stories/index.stories.jsx

@@ -0,0 +1,18 @@
+import React from 'react';
+import { Button } from 'antd';
+import { action } from '@storybook/addon-actions';
+
+export default {
+  component: Button,
+  title: 'Button',
+};
+
+export const text = () => <Button onClick={action('clicked')}>Hello Button</Button>;
+
+export const emoji = () => (
+  <Button onClick={action('clicked')}>
+    <span role="img" aria-label="so cool">
+      😀 😎 👍 💯
+    </span>
+  </Button>
+);

tsconfig.json

@@ -0,0 +1,49 @@
+{
+  "compilerOptions": {
+    "target": "esnext",
+    "rootDirs": [
+      "src",
+      "stories"
+    ],
+    "lib": [
+      "dom",
+      "dom.iterable",
+      "esnext"
+    ],
+    "allowJs": true,
+    // rollup build:lib plugin require
+    "noEmitHelpers": false,
+    "importHelpers": true,
+    "noResolve": false,
+    "noEmit": false,
+    "inlineSourceMap": false,
+    // 
+    "declaration": true,
+    // "declarationDir": "./declare",
+    "skipLibCheck": true,
+    "esModuleInterop": true,
+    "removeComments": true,
+    "allowSyntheticDefaultImports": true,
+    "strict": true,
+    "forceConsistentCasingInFileNames": true,
+    "moduleResolution": "node",
+    "module": "esnext",
+    "resolveJsonModule": true,
+    "isolatedModules": true,
+    "noEmit": true,
+    "traceResolution": true,
+    "jsx": "react",
+    "baseUrl": ".",
+    "paths": {
+      "@/*": ["src/*"],
+      "@components/*": [ "src/components/*" ]
+    }
+  },
+  "include": [
+    "src/**/*",
+    "stories/**/*"
+  ],
+  "exclude": [
+    "node_modules"
+  ]
+}