@ysjdemo/umi-create-cli 0.0.3 → 0.0.4

package/lib/templates/qiankun/cf-workbench-function/src/pages/GuidelineManagement/GuidelineAttachmentUpload/components/GuidelineAttachment.tsx

@@ -0,0 +1,275 @@
+import { InboxOutlined } from '@ant-design/icons';
+import { message, Modal, Spin, Upload } from 'antd';
+import React, { useEffect, useReducer, useState } from 'react';
+
+import type { RcFile, UploadFile, UploadProps } from 'antd/lib/upload/interface';
+import { addGuidelineAttachment, removeGuideAttachmentFile, uploadGuideAttachmentFile } from './service';
+
+import { cfmmUtils } from '@umijs/max';
+import type { GuidelineAttachmentForReactItem as DataSourceType } from '../data';
+
+const confirm = Modal.confirm;
+
+const { Dragger } = Upload;
+
+export interface GuidelineAttachmentProps {
+  //附件类型，方便上传至后台
+  attachmentType: string;
+  //是否有权限操作
+  isEdit: boolean;
+  //上传内容
+  uploadContent: string;
+
+  //删除确认标题
+  deleteConfirmTitle: string;
+  //删除确认内容
+  deleteConfirmContent: string;
+}
+
+// 定义允许上传的文件类型
+const SUPPORTED_TYPES = [
+  'application/pdf', // PDF
+  'video/mp4', // MP4
+  'image/jpeg', //图片
+  'image/png', //图片
+];
+
+/**
+ * 文件上传
+ * @param props
+ * @returns
+ */
+const GuidelineAttachment: React.FC<GuidelineAttachmentProps> = (props) => {
+  const { attachmentType, isEdit, uploadContent, deleteConfirmTitle, deleteConfirmContent } = props;
+  const [loading, setLoading] = useState<boolean>(false);
+  /**
+   * 文件列表
+   */
+  const [AttachmentList, setAttachmentList] = useReducer(
+    (state: DataSourceType[], action: { type: string; playload: DataSourceType[] }): any => {
+      if (action.type === 'init') {
+        return [...action.playload];
+      }
+      if (action.type === 'update') {
+        return [...action.playload];
+      }
+
+      return state;
+    },
+    [],
+  );
+
+  /**
+   * 默认将数据清空
+   */
+  useEffect(() => {
+    setAttachmentList({ type: 'init', playload: [] });
+  }, []);
+
+  /**
+   * 上传前检查事件（检查类型及文件大小）
+   * @param file
+   * @returns
+   */
+  const handlerBeforeUpload = (file: RcFile) => {
+    const isPictureOrPdfOrVideo = SUPPORTED_TYPES.includes(file.type);
+
+    if (!isPictureOrPdfOrVideo) {
+      message.error('You can only upload JPG/PNG && PDF && mp4 file !');
+    }
+
+    const isLt500M = file.size / 1024 / 1024 < 500;
+
+    if (!isLt500M) {
+      message.error('Image must smaller than 500MB!');
+    }
+
+    const reg = /^[a-zA-Z0-9]+-[a-zA-Z0-9]+(-[a-zA-Z0-9]+)?$/;
+    const fileName = file.name.split('.')[0];
+    if (!reg.test(fileName)) {
+      message.error('The file name must be xxxx-xxx.xxx or xxxx-xxxx-xxx.xxx!');
+    }
+
+    return isPictureOrPdfOrVideo && isLt500M && reg.test(fileName);
+  };
+
+  /**
+   * 上传事件
+   * @param options
+   */
+  const handlerCustomerUploadFile = async (options: any) => {
+    const { onSuccess, file } = options;
+
+    return new Promise((resolve, reject) => {
+      /**
+       * 上传的文件，这里文件只有一个uid的属性
+       */
+      const formData = new FormData();
+      formData.append('file', file);
+
+      /**
+       * 上传的文件夹从配置文件上传
+       */
+      formData.append('bucketName', GUIDELINE_ATTACHMENT_UPLOAD_BUCKET_NAME);
+
+      /**
+       * 上传至API的数据
+       */
+      const config = {
+        headers: { 'content-type': 'multipart/form-data' },
+
+        /**
+         * 上传进度事件
+         * 该功能只在使用axios时才有效，
+         * 如果使用的是umi-request是无效的
+         * @param event
+         */
+        // onUploadProgress: event => {
+        //   /**
+        //    * 获取文件上传进度
+        //    */
+        //   const percent = Math.floor((event.loaded / event.total) * 100);
+        //   setProgress(percent);
+
+        //   if (percent === 100) {
+        //     setTimeout(() => setProgress(0), 1000);
+        //   }
+        //   onProgress({ percent: (event.loaded / event.total) * 100 });
+        // },
+      };
+
+      /**
+       * 使用asios上传文件时，会有提示上传文件进度事件
+       */
+      // const res = await axios.post('http://localhost:8081/minio/upload', fmData, config);
+
+      uploadGuideAttachmentFile(formData, config)
+        .then((res) => {
+          /**
+           * 上传完成，回调函数通知控件
+           */
+          if (res && res.code == 200) {
+            /**
+             * 成功返回方法中的参数，最后会在file和fileList的response属性中存在
+             */
+            onSuccess(res.data);
+
+            const allData = AttachmentList;
+
+            allData.push({
+              uid: res.data.uploadFileId, // 注意，这个uid一定不能少，否则展示失败
+              name: res.data.originalFileName,
+              status: 'done',
+              url: `/${MINIO_URL}/` + res.data.uploadFileId,
+            });
+
+            setAttachmentList({ type: 'update', playload: allData });
+
+            return res.data;
+          } else {
+            /**
+             * 不成功则出现错误
+             */
+            reject();
+          }
+        })
+        .then((data) => {
+          /**
+           * 上传至指导附件
+           */
+          const nameList = data.originalFileName.split('.')[0].split('-');
+          addGuidelineAttachment({
+            guidelineAttachmentType: attachmentType,
+            productCode: nameList[0] + '-' + nameList[1],
+            originFileName: data.originalFileName,
+            filePath: data.uploadFileId,
+            fileSize: data.fileSize,
+            fileType: data.fileType,
+            status: 'Y',
+            remark: '',
+          }).finally(() => setLoading(false));
+        })
+        .catch((err) => {
+          setLoading(false);
+          reject(err);
+        });
+    });
+  };
+
+  /**
+   * 上传事件
+   * file为正在上传的文件名
+   * fileList为上传完成的文件列表
+   * @param param0
+   */
+  // const handleFileOnChange = ({ file, fileList, event }: UploadChangeParam) => {
+  //   console.log(`--------------------------------------->`)
+  //   console.log({ file, fileList, event })
+  //   console.log(`---------------------------------------<`)
+
+  //   setAttachmentList({ type: 'update', playload: fileList });
+  // };
+
+  /**
+   * 删除上传的文件
+   * @param file
+   */
+  const handleRemove = async (file: UploadFile) => {
+    confirm({
+      title: deleteConfirmTitle,
+      content: deleteConfirmContent,
+      onOk: async () => {
+        /**
+         * 删除后台文件
+         */
+        const res = await removeGuideAttachmentFile(file.uid);
+
+        if (res.code == 200) {
+          /**
+           * 过滤已经删除的文件
+           */
+          const allData = AttachmentList;
+          setAttachmentList({
+            type: 'update',
+            playload: allData.filter((o: any) => o.uid != file.uid),
+          });
+        }
+      },
+      onCancel() {},
+    });
+  };
+
+  const handlePreview = async (file: UploadFile) => {
+    //在线预览文件
+    if (!file.url) return;
+    cfmmUtils.fileOnLineViewerFromId(file.url, file.name);
+  };
+
+  const option: UploadProps<any> = {
+    disabled: !isEdit,
+    accept: SUPPORTED_TYPES.join(','),
+    beforeUpload: handlerBeforeUpload,
+    customRequest: handlerCustomerUploadFile,
+    // onChange:{handleFileOnChange},
+    onRemove: handleRemove,
+    onPreview: handlePreview,
+    listType: 'text',
+    defaultFileList: AttachmentList,
+    fileList: AttachmentList,
+    multiple: true,
+    directory: false,
+  };
+
+  return (
+    <Spin spinning={loading}>
+      <Dragger {...option}>
+        <p className="ant-upload-drag-icon">
+          <InboxOutlined />
+        </p>
+        <p className="ant-upload-text">{uploadContent}</p>
+      </Dragger>
+    </Spin>
+  );
+};
+
+export default GuidelineAttachment;

package/lib/templates/qiankun/cf-workbench-function/src/pages/GuidelineManagement/GuidelineAttachmentUpload/components/service.ts

@@ -0,0 +1,25 @@
+import { BASE_API } from '@/constants';
+import { request } from '@umijs/max';
+
+export async function addGuidelineAttachment(guidelineAttachmentData: any) {
+  return request(`${BASE_API}/mes/guidelineAttachment/`, {
+    method: 'POST',
+    data: {
+      ...guidelineAttachmentData,
+    },
+  });
+}
+
+export async function removeGuideAttachmentFile(params: string) {
+  return request(`${BASE_API}/mes/guidelineAttachment/deleteByFileId/` + params, {
+    method: 'DELETE',
+  });
+}
+
+export async function uploadGuideAttachmentFile(params: any, config: any) {
+  return request(`${BASE_API}/minio/upload`, {
+    method: 'POST',
+    config,
+    data: params,
+  });
+}

package/lib/templates/qiankun/cf-workbench-function/src/pages/GuidelineManagement/GuidelineAttachmentUpload/data.d.ts

@@ -0,0 +1,17 @@
+export interface TableListItem {
+  guidelineAttachmentId?: number;
+  guidelineAttachmentType: string;
+  mouldCode: string;
+  originFileName: string;
+  filePath: string;
+  status: string;
+  remark?: string;
+}
+
+/**为了控件绑定使用 */
+export interface GuidelineAttachmentForReactItem {
+  attachmentName: string;
+  path: string;
+  uid: string;
+  uploadTable: boolean;
+}

package/lib/templates/qiankun/cf-workbench-function/src/pages/GuidelineManagement/GuidelineAttachmentUpload/index.tsx

@@ -0,0 +1,71 @@
+import ProCard from '@ant-design/pro-card';
+import { getAuthorityFunction, MyPageContainer, useIntl } from '@umijs/max';
+import React from 'react';
+
+import GuidelineAttachment from './components/GuidelineAttachment';
+
+import useQiankunData from '@/hooks/useQiankunData';
+import { QuestionCircleOutlined } from '@ant-design/icons';
+import { Tooltip } from 'antd';
+
+const MC_AuthorityCode_SOP_Upload = 'guidelineAttachment_sop_upload';
+
+const MC_AttachmentType_SOP = 'SOP';
+
+const TableList: React.FC = () => {
+  const { currentUser } = useQiankunData();
+
+  const { formatMessage } = useIntl();
+
+  const tableTitleRender = (
+    <>
+      <span>
+        {formatMessage({
+          id: 'pages.GuidelineAttachmentUpload.type.sop',
+          defaultMessage: 'SOP',
+        })}
+      </span>
+      <Tooltip
+        title={
+          <>
+            <div>
+              {formatMessage({
+                id: 'pages.GuidelineAttachmentUpload.upload.document.tips',
+                defaultMessage: '上传的SOP文件名必须与产品编号相对应，以确保能够正确匹配到相关产品。',
+              })}
+            </div>
+          </>
+        }
+      >
+        <QuestionCircleOutlined style={{ color: 'rgba(0, 0, 0, 0.45)', marginLeft: 4 }} />
+      </Tooltip>
+    </>
+  );
+
+  return (
+    <MyPageContainer>
+      <ProCard gutter={[{ xs: 8, sm: 8, md: 16, lg: 24, xl: 32 }]} style={{ marginBlockStart: 16 }}>
+        <ProCard title={tableTitleRender} colSpan={8}>
+          <GuidelineAttachment
+            attachmentType={MC_AttachmentType_SOP}
+            isEdit={getAuthorityFunction(MC_AuthorityCode_SOP_Upload, currentUser)}
+            uploadContent={formatMessage({
+              id: 'pages.GuidelineAttachmentUpload.upload.content',
+              defaultMessage: '单击或拖动文件到此区域以上传',
+            })}
+            deleteConfirmTitle={formatMessage({
+              id: 'pages.GuidelineAttachmentUpload.delete.confirm.title',
+              defaultMessage: '附件删除确认',
+            })}
+            deleteConfirmContent={formatMessage({
+              id: 'pages.GuidelineAttachmentUpload.delete.confirm.content',
+              defaultMessage: '你确定要删除附件吗？ 删除后将无法恢复',
+            })}
+          />
+        </ProCard>
+      </ProCard>
+    </MyPageContainer>
+  );
+};
+
+export default TableList;

package/lib/templates/qiankun/cf-workbench-function/src/services/file.ts

@@ -0,0 +1,16 @@
+import { BASE_API } from '@/constants';
+import { request } from '@umijs/max';
+
+export async function removePackage(params: string) {
+  return request(`${BASE_API}/minio/` + params, {
+    method: 'DELETE',
+  });
+}
+
+export async function uploadPackage(params: any, config: any) {
+  return request(`${BASE_API}/minio/upload`, {
+    method: 'POST',
+    config,
+    data: params,
+  });
+}

package/lib/templates/qiankun/cf-workbench-function/src/services/index.ts

@@ -0,0 +1,15 @@
+import { DicListItem } from '@/components/DicDropDownList';
+import { BASE_API } from '@/constants';
+import { request, API } from '@umijs/max';
+
+interface ParamsType {
+  dicType: string[] | string;
+}
+
+export async function queryDictionary(params: ParamsType) {
+  params.dicType = Array.isArray(params.dicType) ? params.dicType.join(',') : params.dicType;
+  return request<API.Result_Base_List<DicListItem[]>>(`${BASE_API}/system/dic/list`, {
+    method: 'GET',
+    params,
+  });
+}

package/lib/templates/qiankun/cf-workbench-function/src/services/user.ts

@@ -0,0 +1,16 @@
+import { BASE_API } from '@/constants';
+import { CurrentUser } from '@/hooks/useQiankunData';
+import { TimeZomeListType } from '@/pages/BaseManagement/WorkCenter/data';
+import { request, API } from '@umijs/max';
+
+export async function query(): Promise<any> {
+  return request('${BASE_API}/users');
+}
+
+export async function queryCurrent() {
+  return request<API.Result_Base<CurrentUser>>(`${BASE_API}/system/user/getCurrentUser`);
+}
+
+export async function queryTimeZomeList() {
+  return request<API.Result_Base<TimeZomeListType[]>>(`${BASE_API}/system/timeZone/selectList`);
+}

package/lib/templates/qiankun/cf-workbench-function/src/typings.d.ts

@@ -0,0 +1,35 @@
+declare module 'slash2';
+declare module '*.css';
+declare module '*.less';
+declare module '*.scss';
+declare module '*.sass';
+declare module '*.svg';
+declare module '*.png';
+declare module '*.jpg';
+declare module '*.jpeg';
+declare module '*.gif';
+declare module '*.bmp';
+declare module '*.tiff';
+declare module 'omit.js';
+
+
+// preview.pro.ant.design only do not use in your production ;
+// preview.pro.ant.design 专用环境变量，请不要在你的项目中使用它。
+declare let ANT_DESIGN_PRO_ONLY_DO_NOT_USE_IN_YOUR_PRODUCTION: 'site' | undefined;
+
+declare const REACT_APP_ENV: 'test' | 'dev' | 'pre' | 'prod' | false;
+
+declare let MOULD_UPLOAD_BUCKET_NAME: string;
+declare let PART_UPLOAD_BUCKET_NAME: string;
+declare let EMPLOYEE_UPLOAD_BUCKET_NAME: string;
+declare let MOULD_REPAIRNOTICEORDER_UPLOAD_BUCKET_NAME: string;
+declare let MOULD_ORDER_UPLOAD_BUCKET_NAME: string;
+declare let BACKEND_API_URL: URL;
+declare let FILE_VIEWER_URL: URL;
+declare let WEB_SOCKET_URL: URL;
+declare let MINIO_URL: URL;
+declare let GUIDELINE_ATTACHMENT_UPLOAD_BUCKET_NAME: string;
+
+declare interface Window {
+  __POWERED_BY_QIANKUN__: boolean | undefined;
+}

package/lib/templates/qiankun/cf-workbench-function/src/utils/qiankunConfig.ts

@@ -0,0 +1,23 @@
+//	utils/qiankun.ts
+import * as echarts from 'echarts';
+
+let qiankun_props: any;
+
+export const qiankun = {
+  // 应用加载之前
+  async bootstrap(props: any) {
+    qiankun_props = props;
+  },
+
+  // 应用 render 之前触发
+  async mount(props: any) {
+    echarts.registerTheme('echarsDarkTheme', props.echarsDarkTheme);
+  },
+
+  // 应用卸载之后触发
+  async unmount() {},
+};
+
+export function getQiankunProps() {
+  return qiankun_props;
+}

package/lib/templates/qiankun/cf-workbench-function/src/utils/request.ts

@@ -0,0 +1,46 @@
+import { MC_CurrentSelectWorkCenterId } from '@/constants';
+import { cfmmUtils } from '@umijs/max';
+import { message } from 'antd';
+import { MessageType } from 'antd/es/message/interface';
+import dayjs from 'dayjs';
+import { getQiankunProps } from './qiankunConfig';
+
+// 不需要数据中心的api
+// const noDataCenterUrls = ['/api/mes/process/list'];
+let hide: MessageType;
+
+export const request = () => {
+  return cfmmUtils.getRequestConfig(
+    {
+      // 数据权限中心key
+      authKey: MC_CurrentSelectWorkCenterId,
+      addRequestInterceptors(config) {
+        // const isNoNeedDataCenter = noDataCenterUrls.some((url) => config.url?.startsWith(url));
+        // if (isNoNeedDataCenter && config.url) {
+        //   config.url = cfmmUtils.removeUrlParam(config.url, 'centerId');
+        // }
+        if (config?.headers) {
+          config.headers.timezone = (dayjs as any).tz?.guess();
+        }
+        return config;
+      },
+    },
+    {
+      maxRetryCount: 3,
+      // 使用 Getter 函数：延迟获取 updateToken，确保 qiankun bootstrap 已完成
+      updateToken: () => getQiankunProps()?.updateToken?.() || Promise.resolve({ refreshed: false }),
+      onRetryBefore({ retryCount, delay, error, requestConfig }) {
+        // 1. 网络错误
+        const isNetworkError = error.message === 'Network Error';
+        // 2. 请求超时
+        const isTimeoutError = !error.response && error.code === 'ECONNABORTED';
+        if (isNetworkError || isTimeoutError) {
+          if (hide) {
+            hide();
+          }
+          hide = message.error(`[网络重试] 网络错误，${delay / 1000}s 后重试（第 ${retryCount + 1}/${3} 次）`);
+        }
+      },
+    },
+  );
+};

package/lib/templates/qiankun/cf-workbench-function/tsconfig.json

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

package/lib/templates/qiankun/cf-workbench-function/typings.d.ts

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