@ysjdemo/umi-create-cli 0.0.2 → 0.0.4

package/lib/templates/qiankun/cf-workbench-base/src/pages/System/Template/components/TemplateDownloadModal.tsx

@@ -0,0 +1,226 @@
+import DicDropDownList, { DicListItem } from '@/components/DicDropDownList';
+import { DownloadOutlined, EyeOutlined } from '@ant-design/icons';
+import { ActionType, ProColumns, ProTable } from '@ant-design/pro-components';
+import { cfmmUtils, DropdownButton, useIntl, useModel, useQueryTableList } from '@umijs/max';
+import { Form, Modal, ModalProps } from 'antd';
+import React, { useEffect, useRef, useState } from 'react';
+import { queryDictionary } from '../../Dictionary/service';
+import { TableListItem, TableListParams } from '../data';
+import { queryTableList } from '../services';
+
+const MC_AuthorityCode_DOWNLOAD = 'templateModal_download';
+const MC_AuthorityCode_VIEW = 'templateModal_view';
+
+const baseLocalCode = 'pages.Template';
+const baseLocalName = '模板文件';
+
+interface IProps extends ModalProps {
+  moduleCode?: string;
+}
+
+const TemplateDownloadModal: React.FC<IProps> = (props) => {
+  const { initialState } = useModel('@@initialState');
+  const { currentUser } = initialState;
+  const { curPlatformCode, curSystemCode, templateDownloadModalSearchParams = {} } = useModel('global');
+  const { formatMessage } = useIntl();
+  const { moduleCode } = props;
+
+  const [form] = Form.useForm();
+  const actionRef = useRef<ActionType>();
+
+  const [templateTypeList, setTemplateTypeList] = useState<DicListItem[]>([]);
+
+  // 封装数据查询的hooks
+  const { queryList } = useQueryTableList({ baseLocalCode, baseLocalName });
+
+  const requestDicList = async (dicTypes: string | string[]) => {
+    const { code, rows = [] } = (await queryDictionary({ dicType: dicTypes })) || {};
+
+    if (code === 200 && rows.length) {
+      setTemplateTypeList(rows);
+    }
+  };
+
+  /**
+   * 查询数据
+   * @param params
+   * @returns
+   */
+  const handleSearch = async (params: TableListParams) => {
+    return await queryList<TableListItem[]>(params, {
+      queryFn: queryTableList,
+    });
+  };
+
+  const columns: ProColumns<TableListItem>[] = [
+    {
+      title: formatMessage({ id: 'pages.File.column.name', defaultMessage: '文件名' }),
+      dataIndex: 'templateName',
+    },
+    {
+      title: formatMessage({
+        id: 'pages.Template.column.templateType',
+        defaultMessage: '模板类型',
+      }),
+      dataIndex: 'templateTypeCode',
+      valueType: 'select',
+      renderFormItem: () => <DicDropDownList localListData={templateTypeList} />,
+      formItemProps: { rules: [{ required: true }] },
+    },
+    // {
+    //   title: formatMessage({
+    //     id: 'pages.Template.column.platformCode',
+    //     defaultMessage: '平台编号',
+    //   }),
+    //   dataIndex: 'platformCode',
+    //   valueType: 'select',
+    //   initialValue: curPlatformCode,
+    //   fieldProps: {
+    //     options: platformTypeLest,
+    //   },
+    // },
+    // {
+    //   title: formatMessage({
+    //     id: 'pages.Template.column.systemCode',
+    //     defaultMessage: '系统编号',
+    //   }),
+    //   dataIndex: 'systemCode',
+    //   valueType: 'select',
+    //   copyable: true,
+    //   initialValue: curSystemCode,
+    //   fieldProps: {
+    //     options: systemTypeList,
+    //   },
+    // },
+    {
+      title: formatMessage({
+        id: 'pages.Template.column.moduleCode',
+        defaultMessage: '模块编号',
+      }),
+      dataIndex: 'moduleCode',
+      valueType: 'select',
+      copyable: true,
+      initialValue: moduleCode,
+      fieldProps: {
+        options: cfmmUtils.getModuleListByMenu(currentUser.menus),
+      },
+    },
+    {
+      title: formatMessage({
+        id: 'pages.Template.column.fileLang',
+        defaultMessage: '语言',
+      }),
+      dataIndex: 'lang',
+      valueType: 'select',
+      fieldProps: {
+        options: cfmmUtils.languageList,
+      },
+    },
+    {
+      title: formatMessage({ id: 'common.button.option', defaultMessage: '操作' }),
+      dataIndex: 'option',
+      valueType: 'option',
+      width: 160,
+      render: (_, record) => {
+        return (
+          <DropdownButton
+            viewAuth={MC_AuthorityCode_VIEW}
+            extraButtonList={[
+              {
+                position: 2,
+                auth: MC_AuthorityCode_VIEW,
+                label: (
+                  <a
+                    key={MC_AuthorityCode_VIEW}
+                    onClick={() => {
+                      cfmmUtils.fileOnLineViewerFromId(record.uploadFileId, record.templateName);
+                    }}
+                  >
+                    <EyeOutlined style={{ marginRight: 6 }} />
+                    {formatMessage({ id: 'common.button.preview', defaultMessage: '预览' })}
+                  </a>
+                ),
+              },
+              {
+                position: 3,
+                auth: MC_AuthorityCode_DOWNLOAD,
+                label: (
+                  <a
+                    key={MC_AuthorityCode_DOWNLOAD}
+                    onClick={() => {
+                      cfmmUtils.fileDownloadFromId(record.uploadFileId);
+                    }}
+                  >
+                    <DownloadOutlined style={{ marginRight: 6 }} />
+                    {formatMessage({ id: 'common.button.download', defaultMessage: '下载' })}
+                  </a>
+                ),
+              },
+            ]}
+          />
+        );
+      },
+    },
+  ];
+
+  // 关闭弹窗清空查询参数
+  useEffect(() => {
+    if (!props.open) {
+      form.resetFields();
+    }
+  }, [props.open]);
+
+  // 设置子应用传来的查询参数
+  useEffect(() => {
+    if (templateDownloadModalSearchParams && props.open) {
+      form.setFieldsValue({ ...templateDownloadModalSearchParams });
+      form.submit();
+    }
+  }, [templateDownloadModalSearchParams, props.open]);
+
+  useEffect(() => {
+    requestDicList('TemplateCenterTemplateType');
+  }, []);
+
+  return (
+    <Modal
+      title={formatMessage({ id: 'common.button.template.download', defaultMessage: '模板文件中心' })}
+      {...props}
+      // forceRender
+      footer={(_, { CancelBtn }) => <CancelBtn />}
+      width={1000}
+    >
+      <ProTable
+        rowKey="templateId"
+        actionRef={actionRef}
+        columns={columns}
+        request={async (params, sorter) => {
+          // 获取出来参数，将当前页面current和页数据大小pageSize提取出来
+          const { pageIndex = params.current, pageSize, ...otherParams } = params;
+
+          // 强制将其他参数存放至filter中，这些参数从查询form中来
+          const filters = { ...otherParams, platformCode: curPlatformCode, systemCode: curSystemCode };
+
+          const newParams = {
+            pageIndex,
+            pageSize,
+            orderBy: { ...sorter },
+            ...filters,
+          };
+          //调用后台API
+          const result = await handleSearch(newParams);
+
+          return result;
+        }}
+        search={{
+          form,
+          defaultCollapsed: false,
+          labelWidth: 210,
+          span: { xs: 24, sm: 24, md: 12, lg: 12, xl: 8, xxl: 6 },
+        }}
+      />
+    </Modal>
+  );
+};
+
+export default React.memo(TemplateDownloadModal);

package/lib/templates/qiankun/cf-workbench-base/src/pages/System/Template/components/UpdateForm.tsx

@@ -0,0 +1,135 @@
+import { DicListItem } from '@/components/DicDropDownList';
+import { ProFormSelect, ProFormText, ProFormTextArea } from '@ant-design/pro-form';
+import { RefDrawerForm, RefDrawerFormRefType, useIntl, MyUpload, cfmmUtils } from '@umijs/max';
+import { Form } from 'antd';
+import React, { MutableRefObject, useEffect, useMemo } from 'react';
+import { FormValueType, TableListItem } from '../data';
+
+export interface UpdateFormProps {
+  updateDrawerRef: MutableRefObject<RefDrawerFormRefType | undefined>;
+  /** 提交方法，返回true可以控制弹窗关闭 */
+  onSubmit: (values: FormValueType) => Promise<boolean | void>;
+  values: Partial<TableListItem> | null;
+  moduleTypeList: any;
+  templateTypeList: DicListItem[];
+}
+
+const UpdateForm: React.FC<UpdateFormProps> = (props) => {
+  const { formatMessage } = useIntl();
+  const [form] = Form.useForm();
+
+  const templateTypeList = useMemo(() => {
+    return props.templateTypeList.map((item) => ({
+      label: `${item.dicName}(${item.dicCode})`,
+      value: item.dicCode,
+    }));
+  }, [props.templateTypeList]);
+
+  useEffect(() => {
+    const { values } = props;
+    if (values) {
+      form.setFieldsValue({
+        ...values,
+        uploadFile: [
+          {
+            fileId: values.uploadFileId,
+            fileName: values.templateName,
+            fileSize: values.fileSize,
+            fileType: values.fileType,
+          },
+        ],
+      });
+    }
+  }, [props.values]);
+
+  return (
+    <RefDrawerForm
+      form={form}
+      ref={props.updateDrawerRef}
+      title={formatMessage({
+        id: 'pages.Template.update.title',
+        defaultMessage: '修改模板',
+      })}
+      onFinish={props.onSubmit}
+    >
+      <ProFormText name="templateId" disabled hidden />
+      <ProFormText
+        name="templateName"
+        label={formatMessage({
+          id: 'pages.File.column.name',
+          defaultMessage: '模板文件名称',
+        })}
+        rules={[{ required: true }]}
+      />
+      <ProFormSelect
+        name="templateTypeCode"
+        label={formatMessage({ id: 'pages.Template.column.templateType', defaultMessage: '模板文件类型' })}
+        options={templateTypeList}
+      />
+      <ProFormSelect
+        name="platformCode"
+        label={formatMessage({ id: 'pages.Template.column.platformCode', defaultMessage: '模板文件平台类型' })}
+        options={[]}
+      />
+      <ProFormSelect
+        name="systemCode"
+        label={formatMessage({ id: 'pages.Template.column.systemCode', defaultMessage: '模板文件系统类型' })}
+        options={[
+          {
+            label: 'MMS',
+            value: 'MMS',
+          },
+        ]}
+      />
+      <ProFormSelect
+        name="moduleCode"
+        label={formatMessage({ id: 'pages.Template.column.moduleCode', defaultMessage: '模板文件模块类型' })}
+        options={props.moduleTypeList}
+        rules={[{ required: true }]}
+      />
+      <ProFormSelect
+        name="lang"
+        label={formatMessage({ id: 'pages.Template.column.fileLang', defaultMessage: '语言' })}
+        options={cfmmUtils.languageList}
+        rules={[{ required: true }]}
+      />
+      <ProFormText name="fileSize" disabled hidden />
+      <ProFormText name="fileType" disabled hidden />
+      <ProFormText name="templateName" disabled hidden />
+      <ProFormText name="uploadFileId" disabled hidden rules={[{ required: true }]} />
+      <Form.Item
+        name="uploadFile"
+        label={formatMessage({
+          id: 'pages.Template.upload.file',
+          defaultMessage: '模板文件上传',
+        })}
+        rules={[{ required: true }]}
+      >
+        <MyUpload
+          bucketName="templatecenter"
+          maxCount={1}
+          accept=".xls,.xlsx"
+          onChange={(file) => {
+            form.setFieldsValue({
+              fileSize: file[0]?.fileSize,
+              fileType: file[0]?.fileType,
+              templateName: file[0]?.fileName,
+              uploadFileId: file[0]?.fileId,
+              uploadFile: file,
+            });
+          }}
+        />
+      </Form.Item>
+
+      <ProFormTextArea
+        name="remark"
+        label={formatMessage({
+          id: 'pages.Template.column.remark',
+          defaultMessage: '备注',
+        })}
+      />
+    </RefDrawerForm>
+  );
+};
+
+export default React.memo(UpdateForm);

package/lib/templates/qiankun/cf-workbench-base/src/pages/System/Template/data.d.ts

@@ -0,0 +1,22 @@
+import { FileListType, API } from "@umijs/max";
+
+export type TableListItem = {
+  templateId: string;
+  templateName: string;
+  templateTypeCode: string;
+  fileSize: number;
+  fileType: string;
+  uploadFileId: string;
+  lang: string;
+  moduleCode: string;
+  platformCode: string;
+  systemCode: string;
+  originalFileName?: string;
+  uploadFile?: FileListType[]
+  tag?: string;
+  remark?: string;
+};
+
+export type TableListParams = API.TableListParams;
+
+export type FormValueType = Partial<TableListItem>;

package/lib/templates/qiankun/cf-workbench-base/src/pages/System/Template/index.tsx

@@ -0,0 +1,277 @@
+import DicDropDownList, { DicListItem } from '@/components/DicDropDownList';
+import { DownloadOutlined, EyeOutlined } from '@ant-design/icons';
+import type { ProColumns } from '@ant-design/pro-components';
+import { cfmmUtils, CrudTable, MyPageContainer, MyUpload, useIntl, useModel } from '@umijs/max';
+import React, { useEffect, useMemo, useState } from 'react';
+import { queryDictionary } from '../Dictionary/service';
+import UpdateForm from './components/UpdateForm';
+import { TableListItem } from './data';
+import { platformTypeLest, systemTypeList } from './map';
+import { handleTemplateAction, queryTableList, queryTemplateByID } from './services';
+
+const MC_AuthorityCode_DOWNLOAD = 'template_download';
+const MC_AuthorityCode_VIEW = 'template_view';
+
+const baseLocalCode = 'pages.Template';
+const baseLocalName = '模板文件';
+
+//列表数据ID
+const ROW_ID: keyof TableListItem = 'templateId';
+
+const TableList: React.FC = () => {
+  const { currentUser } = useModel('user');
+
+  const { formatMessage } = useIntl();
+  const { curSystemCode, curPlatformCode } = useModel('global');
+  const [templateTypeList, setTemplateTypeList] = useState<DicListItem[]>([]);
+
+  const moduleTypeList = useMemo(() => cfmmUtils.getModuleListByMenu(currentUser.menus), [currentUser]);
+
+  const requestDicList = async (dicTypes: string | string[]) => {
+    const { code, rows = [] } = (await queryDictionary({ dicType: dicTypes })) || {};
+
+    if (code === 200 && rows.length) {
+      setTemplateTypeList(rows);
+    }
+  };
+
+  const columns = useMemo<ProColumns<TableListItem>[]>(
+    () => [
+      {
+        title: formatMessage({
+          id: 'pages.File.column.name',
+          defaultMessage: '名称',
+        }),
+        dataIndex: 'templateName',
+        sorter: true,
+        fixed: 'left',
+        render: (_, record) => (
+          <a
+            onClick={() => {
+              cfmmUtils.fileOnLineViewerFromId(record.uploadFileId, record.templateName);
+            }}
+          >
+            {record.templateName}
+          </a>
+        ),
+        formItemProps: { rules: [{ required: true }] },
+      },
+      {
+        title: formatMessage({
+          id: 'pages.Template.column.templateType',
+          defaultMessage: '模板文件类型',
+        }),
+        dataIndex: 'templateTypeCode',
+        valueType: 'select',
+        renderFormItem: () => <DicDropDownList localListData={templateTypeList} />,
+        formItemProps: { rules: [{ required: true }] },
+      },
+      {
+        title: formatMessage({
+          id: 'pages.Template.column.platformCode',
+          defaultMessage: '模板文件平台类型',
+        }),
+        dataIndex: 'platformCode',
+        valueType: 'select',
+        initialValue: curPlatformCode,
+        fieldProps: {
+          options: platformTypeLest,
+        },
+      },
+      {
+        title: formatMessage({
+          id: 'pages.Template.column.fileLang',
+          defaultMessage: '语言',
+        }),
+        dataIndex: 'lang',
+        valueType: 'select',
+        copyable: true,
+        fieldProps: {
+          options: cfmmUtils.languageList,
+        },
+        formItemProps: { rules: [{ required: true }] },
+      },
+      {
+        title: formatMessage({
+          id: 'pages.Template.column.systemCode',
+          defaultMessage: '模板文件系统类型	',
+        }),
+        dataIndex: 'systemCode',
+        valueType: 'select',
+        copyable: true,
+        initialValue: curSystemCode,
+        fieldProps: {
+          options: systemTypeList,
+        },
+        formItemProps: {
+          rules: [{ required: true }],
+        },
+      },
+      {
+        title: formatMessage({
+          id: 'pages.Template.column.moduleCode',
+          defaultMessage: '模板文件所属模块',
+        }),
+        dataIndex: 'moduleCode',
+        valueType: 'select',
+        copyable: true,
+        fieldProps: {
+          options: moduleTypeList,
+        },
+        formItemProps: { rules: [{ required: true }] },
+      },
+      {
+        title: formatMessage({
+          id: 'pages.File.column.size',
+          defaultMessage: '文件体积',
+        }),
+        dataIndex: 'fileSize',
+        sorter: true,
+        hideInSearch: true,
+        fieldProps: {
+          disabled: true,
+        },
+        render: (_, record) => <div>{cfmmUtils.formatBytes(record.fileSize)} </div>,
+      },
+      {
+        title: formatMessage({
+          id: 'pages.File.column.type',
+          defaultMessage: '文件类型',
+        }),
+        dataIndex: 'fileType',
+        hideInSearch: true,
+        fieldProps: {
+          disabled: true,
+        },
+      },
+      {
+        title: formatMessage({
+          id: 'pages.Template.upload.file',
+          defaultMessage: '模板文件上传',
+        }),
+        dataIndex: 'uploadFile',
+        hideInTable: true,
+        renderFormItem: (_, __, form) => (
+          <MyUpload
+            bucketName="templatecenter"
+            maxCount={1}
+            accept=".xls,.xlsx"
+            onChange={(file) => {
+              form.setFieldsValue({
+                fileSize: file[0]?.fileSize,
+                fileType: file[0]?.fileType,
+                templateName: file[0]?.fileName,
+                uploadFile: file,
+              });
+            }}
+          />
+        ),
+        hideInSearch: true,
+        formItemProps: { rules: [{ required: true }] },
+        render: (_, record) => {
+          return (
+            <MyUpload
+              bucketName=""
+              uploadType="file"
+              readonly
+              fileList={[{ fileId: record.uploadFileId, fileName: record.templateName }]}
+            />
+          );
+        },
+      },
+      {
+        title: formatMessage({
+          id: 'pages.Template.column.remark',
+          defaultMessage: '备注',
+        }),
+        dataIndex: 'remark',
+      },
+    ],
+    [templateTypeList],
+  );
+
+  useEffect(() => {
+    requestDicList('TemplateCenterTemplateType');
+  }, []);
+
+  return (
+    <MyPageContainer>
+      <CrudTable<TableListItem, any>
+        baseLocalCode={baseLocalCode}
+        baseLocalName={baseLocalName}
+        rowKey={ROW_ID}
+        columns={columns}
+        updateConfig={{
+          Component: UpdateForm,
+          props: {
+            templateTypeList,
+            moduleTypeList,
+          },
+        }}
+        apis={{
+          query: queryTableList,
+          handle: handleTemplateAction,
+          queryById: queryTemplateByID,
+        }}
+        interceptors={{
+          handle: {
+            request(method, data) {
+              if (method === 'POST' || method === 'PUT') {
+                const file = data.uploadFile?.[0];
+
+                if (file) {
+                  data.originalFileName = file.fileName;
+                  data.uploadFileId = file.fileId;
+                  delete data.uploadFile;
+                }
+              }
+
+              return { method, data };
+            },
+          },
+        }}
+        actionColumnConfig={{
+          columnConfig: {
+            fixed: 'right',
+          },
+          getDropdownButtonProps: (record) => ({
+            extraButtonList: [
+              {
+                position: 2,
+                auth: MC_AuthorityCode_VIEW,
+                label: (
+                  <a
+                    key={MC_AuthorityCode_VIEW}
+                    onClick={() => {
+                      cfmmUtils.fileOnLineViewerFromId(record.uploadFileId, record.templateName);
+                    }}
+                  >
+                    <EyeOutlined style={{ marginRight: 6 }} />
+                    {formatMessage({ id: 'common.button.preview', defaultMessage: '预览' })}
+                  </a>
+                ),
+              },
+              {
+                position: 3,
+                auth: MC_AuthorityCode_DOWNLOAD,
+                label: (
+                  <a
+                    key={MC_AuthorityCode_DOWNLOAD}
+                    onClick={() => {
+                      cfmmUtils.fileDownloadFromId(record.uploadFileId);
+                    }}
+                  >
+                    <DownloadOutlined style={{ marginRight: 6 }} />
+                    {formatMessage({ id: 'common.button.download', defaultMessage: '下载' })}
+                  </a>
+                ),
+              },
+            ],
+          }),
+        }}
+      />
+    </MyPageContainer>
+  );
+};
+
+export default TableList;

package/lib/templates/qiankun/cf-workbench-base/src/pages/System/Template/map.ts

@@ -0,0 +1,8 @@
+export const systemTypeList = [
+  {
+    label: 'Metal_MES',
+    value: 'Metal_MES',
+  },
+];
+
+export const platformTypeLest = [];

package/lib/templates/qiankun/cf-workbench-base/src/pages/System/Template/services.ts

@@ -0,0 +1,32 @@
+import { request, API } from '@umijs/max';
+import { TableListItem, TableListParams } from './data';
+import { BASE_API } from '@/constants';
+
+export async function queryTableList(params: TableListParams) {
+  return request<API.Result_Base_List<TableListItem[]>>(`${BASE_API}/system/templateCenter/list`, {
+    method: 'GET',
+    params,
+  });
+}
+
+//增删改查
+export async function handleTemplateAction(
+  method = 'POST',
+  params: TableListParams,
+) {
+  const actionById = method === 'DELETE' || method === 'GET';
+  const baseUrl = `${BASE_API}/system/templateCenter`;
+  const url = actionById ? `${baseUrl}/${params}` : baseUrl;
+  const nweParams = actionById ? null : { data: { ...params } };
+  return request<API.Result_Base>(url, {
+    method,
+    ...nweParams,
+  });
+}
+
+
+export async function queryTemplateByID(id: number) {
+  return request<API.Result_Base<TableListItem>>(`${BASE_API}/system/templateCenter/${id}`, {
+    method: 'GET',
+  });
+}