create-umi 4.0.0-beta.18 → 4.0.0-canary-20240513.3

package/templates/max/src/pages/Table/index.tsx

@@ -0,0 +1,270 @@
+import services from '@/services/demo';
+import {
+  ActionType,
+  FooterToolbar,
+  PageContainer,
+  ProDescriptions,
+  ProDescriptionsItemProps,
+  ProTable,
+} from '@ant-design/pro-components';
+import { Button, Divider, Drawer, message } from 'antd';
+import React, { useRef, useState } from 'react';
+import CreateForm from './components/CreateForm';
+import UpdateForm, { FormValueType } from './components/UpdateForm';
+
+const { addUser, queryUserList, deleteUser, modifyUser } =
+  services.UserController;
+
+/**
+ * 添加节点
+ * @param fields
+ */
+const handleAdd = async (fields: API.UserInfo) => {
+  const hide = message.loading('正在添加');
+  try {
+    await addUser({ ...fields });
+    hide();
+    message.success('添加成功');
+    return true;
+  } catch (error) {
+    hide();
+    message.error('添加失败请重试！');
+    return false;
+  }
+};
+
+/**
+ * 更新节点
+ * @param fields
+ */
+const handleUpdate = async (fields: FormValueType) => {
+  const hide = message.loading('正在配置');
+  try {
+    await modifyUser(
+      {
+        userId: fields.id || '',
+      },
+      {
+        name: fields.name || '',
+        nickName: fields.nickName || '',
+        email: fields.email || '',
+      },
+    );
+    hide();
+
+    message.success('配置成功');
+    return true;
+  } catch (error) {
+    hide();
+    message.error('配置失败请重试！');
+    return false;
+  }
+};
+
+/**
+ *  删除节点
+ * @param selectedRows
+ */
+const handleRemove = async (selectedRows: API.UserInfo[]) => {
+  const hide = message.loading('正在删除');
+  if (!selectedRows) return true;
+  try {
+    await deleteUser({
+      userId: selectedRows.find((row) => row.id)?.id || '',
+    });
+    hide();
+    message.success('删除成功，即将刷新');
+    return true;
+  } catch (error) {
+    hide();
+    message.error('删除失败，请重试');
+    return false;
+  }
+};
+
+const TableList: React.FC<unknown> = () => {
+  const [createModalVisible, handleModalVisible] = useState<boolean>(false);
+  const [updateModalVisible, handleUpdateModalVisible] =
+    useState<boolean>(false);
+  const [stepFormValues, setStepFormValues] = useState({});
+  const actionRef = useRef<ActionType>();
+  const [row, setRow] = useState<API.UserInfo>();
+  const [selectedRowsState, setSelectedRows] = useState<API.UserInfo[]>([]);
+  const columns: ProDescriptionsItemProps<API.UserInfo>[] = [
+    {
+      title: '名称',
+      dataIndex: 'name',
+      tip: '名称是唯一的 key',
+      formItemProps: {
+        rules: [
+          {
+            required: true,
+            message: '名称为必填项',
+          },
+        ],
+      },
+    },
+    {
+      title: '昵称',
+      dataIndex: 'nickName',
+      valueType: 'text',
+    },
+    {
+      title: '性别',
+      dataIndex: 'gender',
+      hideInForm: true,
+      valueEnum: {
+        0: { text: '男', status: 'MALE' },
+        1: { text: '女', status: 'FEMALE' },
+      },
+    },
+    {
+      title: '操作',
+      dataIndex: 'option',
+      valueType: 'option',
+      render: (_, record) => (
+        <>
+          <a
+            onClick={() => {
+              handleUpdateModalVisible(true);
+              setStepFormValues(record);
+            }}
+          >
+            配置
+          </a>
+          <Divider type="vertical" />
+          <a href="">订阅警报</a>
+        </>
+      ),
+    },
+  ];
+
+  return (
+    <PageContainer
+      header={{
+        title: 'CRUD 示例',
+      }}
+    >
+      <ProTable<API.UserInfo>
+        headerTitle="查询表格"
+        actionRef={actionRef}
+        rowKey="id"
+        search={{
+          labelWidth: 120,
+        }}
+        toolBarRender={() => [
+          <Button
+            key="1"
+            type="primary"
+            onClick={() => handleModalVisible(true)}
+          >
+            新建
+          </Button>,
+        ]}
+        request={async (params, sorter, filter) => {
+          const { data, success } = await queryUserList({
+            ...params,
+            // FIXME: remove @ts-ignore
+            // @ts-ignore
+            sorter,
+            filter,
+          });
+          return {
+            data: data?.list || [],
+            success,
+          };
+        }}
+        columns={columns}
+        rowSelection={{
+          onChange: (_, selectedRows) => setSelectedRows(selectedRows),
+        }}
+      />
+      {selectedRowsState?.length > 0 && (
+        <FooterToolbar
+          extra={
+            <div>
+              已选择{' '}
+              <a style={{ fontWeight: 600 }}>{selectedRowsState.length}</a>{' '}
+              项&nbsp;&nbsp;
+            </div>
+          }
+        >
+          <Button
+            onClick={async () => {
+              await handleRemove(selectedRowsState);
+              setSelectedRows([]);
+              actionRef.current?.reloadAndRest?.();
+            }}
+          >
+            批量删除
+          </Button>
+          <Button type="primary">批量审批</Button>
+        </FooterToolbar>
+      )}
+      <CreateForm
+        onCancel={() => handleModalVisible(false)}
+        modalVisible={createModalVisible}
+      >
+        <ProTable<API.UserInfo, API.UserInfo>
+          onSubmit={async (value) => {
+            const success = await handleAdd(value);
+            if (success) {
+              handleModalVisible(false);
+              if (actionRef.current) {
+                actionRef.current.reload();
+              }
+            }
+          }}
+          rowKey="id"
+          type="form"
+          columns={columns}
+        />
+      </CreateForm>
+      {stepFormValues && Object.keys(stepFormValues).length ? (
+        <UpdateForm
+          onSubmit={async (value) => {
+            const success = await handleUpdate(value);
+            if (success) {
+              handleUpdateModalVisible(false);
+              setStepFormValues({});
+              if (actionRef.current) {
+                actionRef.current.reload();
+              }
+            }
+          }}
+          onCancel={() => {
+            handleUpdateModalVisible(false);
+            setStepFormValues({});
+          }}
+          updateModalVisible={updateModalVisible}
+          values={stepFormValues}
+        />
+      ) : null}
+
+      <Drawer
+        width={600}
+        open={!!row}
+        onClose={() => {
+          setRow(undefined);
+        }}
+        closable={false}
+      >
+        {row?.name && (
+          <ProDescriptions<API.UserInfo>
+            column={2}
+            title={row?.name}
+            request={async () => ({
+              data: row || {},
+            })}
+            params={{
+              id: row?.name,
+            }}
+            columns={columns}
+          />
+        )}
+      </Drawer>
+    </PageContainer>
+  );
+};
+
+export default TableList;

package/templates/max/src/services/demo/UserController.ts

@@ -0,0 +1,96 @@
+/* eslint-disable */
+// 该文件由 OneAPI 自动生成，请勿手动修改！
+import { request } from '@umijs/max';
+
+/** 此处后端没有提供注释 GET /api/v1/queryUserList */
+export async function queryUserList(
+  params: {
+    // query
+    /** keyword */
+    keyword?: string;
+    /** current */
+    current?: number;
+    /** pageSize */
+    pageSize?: number;
+  },
+  options?: { [key: string]: any },
+) {
+  return request<API.Result_PageInfo_UserInfo__>('/api/v1/queryUserList', {
+    method: 'GET',
+    params: {
+      ...params,
+    },
+    ...(options || {}),
+  });
+}
+
+/** 此处后端没有提供注释 POST /api/v1/user */
+export async function addUser(
+  body?: API.UserInfoVO,
+  options?: { [key: string]: any },
+) {
+  return request<API.Result_UserInfo_>('/api/v1/user', {
+    method: 'POST',
+    headers: {
+      'Content-Type': 'application/json',
+    },
+    data: body,
+    ...(options || {}),
+  });
+}
+
+/** 此处后端没有提供注释 GET /api/v1/user/${param0} */
+export async function getUserDetail(
+  params: {
+    // path
+    /** userId */
+    userId?: string;
+  },
+  options?: { [key: string]: any },
+) {
+  const { userId: param0 } = params;
+  return request<API.Result_UserInfo_>(`/api/v1/user/${param0}`, {
+    method: 'GET',
+    params: { ...params },
+    ...(options || {}),
+  });
+}
+
+/** 此处后端没有提供注释 PUT /api/v1/user/${param0} */
+export async function modifyUser(
+  params: {
+    // path
+    /** userId */
+    userId?: string;
+  },
+  body?: API.UserInfoVO,
+  options?: { [key: string]: any },
+) {
+  const { userId: param0 } = params;
+  return request<API.Result_UserInfo_>(`/api/v1/user/${param0}`, {
+    method: 'PUT',
+    headers: {
+      'Content-Type': 'application/json',
+    },
+    params: { ...params },
+    data: body,
+    ...(options || {}),
+  });
+}
+
+/** 此处后端没有提供注释 DELETE /api/v1/user/${param0} */
+export async function deleteUser(
+  params: {
+    // path
+    /** userId */
+    userId?: string;
+  },
+  options?: { [key: string]: any },
+) {
+  const { userId: param0 } = params;
+  return request<API.Result_string_>(`/api/v1/user/${param0}`, {
+    method: 'DELETE',
+    params: { ...params },
+    ...(options || {}),
+  });
+}

package/templates/max/src/services/demo/index.ts

@@ -0,0 +1,7 @@
+/* eslint-disable */
+// 该文件由 OneAPI 自动生成，请勿手动修改！
+
+import * as UserController from './UserController';
+export default {
+  UserController,
+};

package/templates/max/src/services/demo/typings.d.ts

@@ -0,0 +1,68 @@
+/* eslint-disable */
+// 该文件由 OneAPI 自动生成，请勿手动修改！
+
+declare namespace API {
+  interface PageInfo {
+    /** 
+1 */
+    current?: number;
+    pageSize?: number;
+    total?: number;
+    list?: Array<Record<string, any>>;
+  }
+
+  interface PageInfo_UserInfo_ {
+    /** 
+1 */
+    current?: number;
+    pageSize?: number;
+    total?: number;
+    list?: Array<UserInfo>;
+  }
+
+  interface Result {
+    success?: boolean;
+    errorMessage?: string;
+    data?: Record<string, any>;
+  }
+
+  interface Result_PageInfo_UserInfo__ {
+    success?: boolean;
+    errorMessage?: string;
+    data?: PageInfo_UserInfo_;
+  }
+
+  interface Result_UserInfo_ {
+    success?: boolean;
+    errorMessage?: string;
+    data?: UserInfo;
+  }
+
+  interface Result_string_ {
+    success?: boolean;
+    errorMessage?: string;
+    data?: string;
+  }
+
+  type UserGenderEnum = 'MALE' | 'FEMALE';
+
+  interface UserInfo {
+    id?: string;
+    name?: string;
+    /** nick */
+    nickName?: string;
+    /** email */
+    email?: string;
+    gender?: UserGenderEnum;
+  }
+
+  interface UserInfoVO {
+    name?: string;
+    /** nick */
+    nickName?: string;
+    /** email */
+    email?: string;
+  }
+
+  type definitions_0 = null;
+}

package/templates/max/src/utils/format.ts

@@ -0,0 +1,4 @@
+// 示例方法，没有实际意义
+export function trim(str: string) {
+  return str.trim();
+}

package/templates/max/tsconfig.json

@@ -0,0 +1,3 @@
+{
+  "extends": "./src/.umi/tsconfig.json"
+}

package/templates/max/typings.d.ts

@@ -0,0 +1 @@
+import '@umijs/max/typings';

package/templates/plugin/.fatherrc.ts

@@ -1,5 +1,5 @@
-export default {
-  target: 'node',
-  cjs: { type: 'babel', lazy: true },
-  disableTypeCheck: true,
-};
+import { defineConfig } from 'father';
+
+export default defineConfig({
+  cjs: {},
+});

package/templates/plugin/.gitignore.tpl

@@ -1,2 +1,2 @@
 node_modules
-lib
+/dist

package/templates/plugin/.npmrc.tpl

@@ -1 +1,2 @@
 registry={{{ registry }}}
+{{{ extraNpmrc }}}

package/templates/plugin/README.md.tpl

@@ -1,30 +1,21 @@
-# {{{ name }}}
+# {{{ pluginName }}}
 
-[![NPM version](https://img.shields.io/npm/v/{{{ name }}}.svg?style=flat)](https://npmjs.org/package/{{{ name }}})
-[![NPM downloads](http://img.shields.io/npm/dm/{{{ name }}}.svg?style=flat)](https://npmjs.org/package/{{{ name }}})
-
-{{{ description }}}
+A umi plugin
 
 ## Install
 
 ```bash
-# or yarn
-$ npm install
-```
-
-```bash
-$ npm run build --watch
-$ npm run start
+pnpm i {{{ pluginName }}}
 ```
 
 ## Usage
 
-Configure in `.umirc.js`,
+Configure in `.umirc.ts`,
 
 ```js
 export default {
   plugins: [
-    ['{{{ name }}}'],
+    ['{{{ pluginName }}}'],
   ],
 }
 ```

package/templates/plugin/package.json.tpl

@@ -1,24 +1,26 @@
 {
-  "name": "{{{ name }}}",
+  "name": "{{{ pluginName }}}",
+  "author": "{{{ author }}}",
   "version": "0.0.1",
-  "description": "{{{ description }}}",
-  "main": "lib/index.js",
-  "types": "lib/index.d.ts",
+  "main": "dist/cjs/index.js",
+  "types": "dist/cjs/index.d.ts",
   "scripts": {
-    "build": "father-build"
+    "dev": "father dev",
+    "build": "father build"
   },
   "keywords": [],
-  "repository": "{{{ org }}}/{{{ name }}}",
   "authors": {
     "name": "{{{ author }}}",
-    "email": "{{{ mail }}}"
+    "email": "{{{ email }}}"
   },
   "license": "MIT",
   "files": [
-    "lib"
+    "dist"
   ],
   "devDependencies": {
-    "@umijs/types": "{{{ version }}}",
-    "father-build": "^1.20.0"
+    "father": "^4.1.8",
+    "umi": "{{{ version }}}",
+    "@types/node": "^18.15.11",
+    "typescript": "^5.0.3"
   }
 }

package/templates/plugin/src/index.ts.tpl

@@ -1,5 +1,5 @@
-import type { IApi } from '@umijs/types';
+import type { IApi } from 'umi';
 
 export default (api: IApi) => {
-  // TODO: https://umijs.org/plugins/api
+  // See https://umijs.org/docs/guides/plugins
 };

package/templates/plugin/tsconfig.json

@@ -0,0 +1,20 @@
+{
+  "compilerOptions": {
+    "target": "es2019",
+    "lib": ["dom", "dom.iterable", "esnext"],
+    "allowJs": true,
+    "skipLibCheck": true,
+    "esModuleInterop": true,
+    "allowSyntheticDefaultImports": true,
+    "strict": true,
+    "forceConsistentCasingInFileNames": true,
+    "noFallthroughCasesInSwitch": true,
+    "module": "commonjs",
+    "moduleResolution": "node",
+    "resolveJsonModule": true,
+    "isolatedModules": false,
+    "noEmit": false,
+    "declaration": true
+  },
+  "include": ["src"]
+}

package/templates/vue-app/.gitignore.tpl

@@ -0,0 +1,13 @@
+/node_modules
+/.env.local
+/.umirc.local.ts
+/config/config.local.ts
+/src/.umi
+/src/.umi-production
+/src/.umi-test
+/.umi
+/.umi-production
+/.umi-test
+/dist
+/.mfsu
+.swc

package/templates/vue-app/.npmrc.tpl

@@ -0,0 +1,2 @@
+registry={{{ registry }}}
+{{{ extraNpmrc }}}

package/templates/vue-app/.umirc.ts.tpl

@@ -0,0 +1,6 @@
+import { defineConfig } from "umi";
+
+export default defineConfig({
+  npmClient: '{{{ npmClient }}}',
+  presets: [require.resolve('@umijs/preset-vue')],
+});

package/templates/vue-app/package.json.tpl

@@ -0,0 +1,18 @@
+{
+  "private": true,
+  "author": "{{{ author }}}",
+  "scripts": {
+    "dev": "umi dev",
+    "build": "umi build",
+    "postinstall": "umi setup",
+    "start": "npm run dev"
+  },
+  "dependencies": {
+    "vue": "^3.2.47",
+    "umi": "{{{ version }}}"
+  },
+  "devDependencies": {
+    "typescript": "^5.0.3",
+    "@umijs/preset-vue": "{{{ version }}}"
+  }
+}

package/templates/vue-app/src/layouts/index.vue

@@ -0,0 +1,28 @@
+<template>
+  <div class="navs">
+    <ul>
+      <li>
+        <router-link to="/">Home</router-link>
+      </li>
+      <li>
+        <router-link to="/docs">Docs</router-link>
+      </li>
+      <li>
+        <a href="https://github.com/umijs/umi">Github</a>
+      </li>
+    </ul>
+    <router-view></router-view>
+  </div>
+</template>
+<style lang="less">
+.navs {
+  ul {
+    padding: 0;
+    list-style: none;
+    display: flex;
+  }
+  li {
+    margin-right: 1em;
+  }
+}
+</style>

package/templates/vue-app/src/pages/docs.vue

@@ -0,0 +1,5 @@
+<template>
+  <div>
+    <p>This is umi docs.</p>
+  </div>
+</template>

package/templates/vue-app/src/pages/index.vue

@@ -0,0 +1,9 @@
+<template>
+  <div>
+    <h2>Yay! Welcome to umi ❤️ vue!</h2>
+    <p>
+      <img src="../assets/yay.jpg" width="388" />
+    </p>
+    <p>To get started, edit <code>pages/index.vue</code> and save to reload.</p>
+  </div>
+</template>

package/templates/vue-app/tsconfig.json.tpl

@@ -0,0 +1,3 @@
+{
+  "extends": "./src/.umi/tsconfig.json"
+}

package/templates/vue-app/typings.d.ts

@@ -0,0 +1 @@
+import 'umi/typings';