@ysjdemo/umi-create-cli 0.0.3 → 0.0.4

package/lib/templates/qiankun/cf-workbench-base/src/models/user.ts

@@ -0,0 +1,140 @@
+import { WorkCenterListItem } from '@/components/GlobalHeader/WorkCenterDropdown';
+import { TableListItem as MenuItem } from '@/pages/System/Menu/data';
+import { TableListItem as PermissionItem } from '@/pages/System/MenuPermission/data';
+import { queryCurrent, querySysUserPreference, updateSysUserPreference } from '@/services/user';
+import { getLocale, useModel } from '@umijs/max';
+import dayjs from 'dayjs';
+import { useState } from 'react';
+
+export interface CurrentUser {
+  userId: string;
+  userCode: string;
+  userName?: string;
+  avatar?: string;
+  status?: string;
+  nickName: string;
+
+  menus?: MenuItem[];
+  permissions?: PermissionItem[];
+
+  //授权的工厂列表
+  factoryAuthList?: WorkCenterListItem[];
+}
+
+export interface UserModelState {
+  currentUser?: CurrentUser;
+}
+
+export interface UserPreferenceType {
+  dateFormat: string;
+  language: string;
+  timeFormat: string;
+  timeZone: string;
+}
+
+export interface UseUserReturnType extends UserPreferenceType {
+  currentUser: CurrentUser;
+  fetchCurrent: () => Promise<CurrentUser | undefined>;
+  updateUserPreferenceSettings: (params: UserPreferenceType) => Promise<{ success: boolean }>;
+  queryUserPreferenceSettings: (userId: number) => Promise<UserPreferenceType | undefined>;
+}
+
+const useUser = (): UseUserReturnType => {
+  const { initialState, setInitialState } = useModel('@@initialState');
+  const { handleGlobalLangChange } = useModel('global');
+  const [dateFormat, setDateFormat] = useState<string>('YYYY-MM-DD');
+  const [timeFormat, setTimeFormat] = useState<string>('HH:mm:ss');
+  const [timeZone, setTimeZone] = useState<string>(
+    // @ts-ignore
+    dayjs.tz?.guess() ?? Intl.DateTimeFormat().resolvedOptions().timeZone,
+  );
+  const [language, setLanguage] = useState<string>(getLocale());
+
+  /**
+   * 获取用户信息
+   * @returns Promise<FetchUserResponse>
+   */
+  const fetchCurrent = async () => {
+    const response = await queryCurrent();
+    if (response.code === 200 && response.data) {
+      setInitialState({ ...initialState, currentUser: response.data });
+      return response.data;
+    }
+  };
+
+  /**
+   * 更新用户偏好设置
+   * @param params 偏好设置UserPreferenceType
+   * @returns
+   */
+  const updateUserPreferenceSettings = async (params: UserPreferenceType): Promise<{ success: boolean }> => {
+    try {
+      const newParams = {
+        preference: JSON.stringify(params),
+        userId: initialState?.currentUser?.userId,
+      };
+      const response = await updateSysUserPreference(newParams);
+      if (response.code === 200) {
+        setDateFormat(params.dateFormat);
+        setTimeFormat(params.timeFormat);
+        setTimeZone(params.timeZone);
+        setLanguage(params.language);
+
+        // 如果设置的语言不是正在使用的语言，更新语言
+        if (params.language !== getLocale()) {
+          handleGlobalLangChange(params.language);
+        }
+        return { success: true };
+      }
+      return { success: false };
+    } catch (error) {
+      console.log('error', error);
+      return { success: false };
+    }
+  };
+
+  /**
+   * 获取用户偏好设置
+   * @param userId
+   * @returns
+   */
+  const queryUserPreferenceSettings = async (userId: number) => {
+    try {
+      const response = await querySysUserPreference(userId);
+      if (response.code !== 200) return;
+      // 如果有保存过则用保存的，如果没有，新增默认数据
+      if (response.data && response.data.preference) {
+        const preference = JSON.parse(response.data.preference);
+        const { dateFormat, language: resLanguage, timeFormat, timeZone } = preference;
+        setDateFormat(dateFormat);
+        setTimeFormat(timeFormat);
+        setTimeZone(timeZone);
+        setLanguage(resLanguage);
+
+        // 首次打开浏览器进入网站获取偏好设置的语言（会造成2次进入页面）
+        const lang = getLocale();
+        const isFirst = localStorage.getItem('firstEnterSystem');
+        if (resLanguage !== lang && isFirst !== '0') {
+          handleGlobalLangChange(resLanguage);
+        }
+        localStorage.setItem('firstEnterSystem', '0');
+        return preference;
+      }
+    } catch (error) {
+      console.log('error', error);
+    }
+  };
+
+  return {
+    currentUser: initialState?.currentUser,
+    fetchCurrent,
+    dateFormat,
+    timeFormat,
+    timeZone,
+    language,
+    updateUserPreferenceSettings,
+    queryUserPreferenceSettings,
+  };
+};
+
+export default useUser;

package/lib/templates/qiankun/cf-workbench-base/src/overrides.less

@@ -0,0 +1,43 @@
+/*
+* 高优先级全局样式文件。
+* 该文件一般专用于覆盖第三方库样式，其中所有 CSS 选择器都会附加 body 前缀以抬高优先级。
+*/
+
+@parmary-color: #1890ff;
+
+.ant-layout-content > div{
+  height: 100vh !important;
+}
+
+.mainAnt-tabs-top >.mainAnt-tabs-nav {
+  margin-bottom: 0;
+}
+
+.mainAnt-layout-footer {
+  background-color:#F0F2F5;
+  & > .mainAnt-pro-global-footer {
+    margin-top: 24px;
+  }
+}
+
+.runtime-keep-alive-layout {
+  background-color:#F0F2F5;
+}
+
+.ant-pro-layout .ant-pro-layout-content {
+  padding: 0;
+}
+
+.wrapperClassName .mainAnt-spin{
+  margin-top: 50px;
+}
+
+// 页面顶部进度条样式
+#nprogress .bar {
+  background: @parmary-color !important; 
+}
+
+// 左侧菜单进度条样式
+.ant-layout-sider-children > div {
+  scrollbar-width: thin;
+}

package/lib/templates/qiankun/cf-workbench-base/src/pages/404.tsx

@@ -0,0 +1,3 @@
+import { NoFoundPage, history } from '@umijs/max';
+
+export default () => <NoFoundPage onClick={() => history.push('/')}/>;

package/lib/templates/qiankun/cf-workbench-base/src/pages/Client/ClientPermission/components/ClientPermissionSelecter.tsx

@@ -0,0 +1,167 @@
+import { FormattedMessage } from '@umijs/max';
+import { Card, Checkbox, Tabs } from 'antd';
+import _ from 'lodash';
+import React, { useEffect, useReducer, useState } from 'react';
+
+import {
+  TableListItem as ClientPermissionItem,
+  SelectClientPermissionListProps,
+} from '@/pages/Client/ClientPermission/data';
+import { queryClientPermission } from '@/pages/Client/ClientPermission/service';
+
+const { TabPane } = Tabs;
+
+export interface ClientPermissionSelecterProps {
+  value?: any;
+  disabled: boolean;
+  placeholder: string;
+  onChange: any;
+}
+
+const ClientPermissionSelecter: React.FC<ClientPermissionSelecterProps> = (props) => {
+  const { value, disabled, placeholder, onChange } = props;
+
+  /**
+   * 默认客户端类型
+   */
+  const [getClientTypeKeyList, setClientTypeKeyList] = useState<string[]>(['1', '4']);
+
+  /**
+   * 选中的客户端类型key值
+   */
+  const [getSelectClientTypeKey, setSelectClientTypeKey] = useState<string>('1');
+
+  /**
+   * 所有的客户端权限
+   */
+  const [getAllClientPermissionData, setAllClientPermissionData] = useState<ClientPermissionItem[]>([]);
+
+  /**
+   * 保存下面选择的数据
+   */
+  const [getSelectClientPermissionData, setSelectClientPermissionData] = useReducer(
+    (
+      state: SelectClientPermissionListProps,
+      action: { type: string; playload: SelectClientPermissionListProps },
+    ): any => {
+      if (action.type === 'init') {
+        return { ...action.playload };
+      }
+
+      if (action.type === 'update') {
+        return { ...action.playload };
+      }
+
+      return state;
+    },
+    {},
+  );
+
+  useEffect(() => {
+    (async () => {
+      /**
+       * 获取所有客户端权限列表
+       */
+      const clientPermissionResponse = await queryClientPermission();
+
+      if (clientPermissionResponse.rows && clientPermissionResponse.rows.length > 0) {
+        setAllClientPermissionData(clientPermissionResponse.rows);
+      }
+
+      /**
+       * 默认数据
+       */
+      setSelectClientPermissionData({ type: 'int', playload: {} });
+    })();
+  }, []);
+
+  /**
+   * 默认提取所有的数据
+   */
+  useEffect(() => {
+    if (value) {
+      setSelectClientPermissionData({ type: 'update', playload: value });
+    } else {
+      setSelectClientPermissionData({ type: 'update', playload: {} });
+    }
+  }, [value]);
+
+  /**
+   * 切换客户端类型
+   * @param key
+   */
+  const onChangeClientTab = (key: string) => {
+    setSelectClientTypeKey(key);
+  };
+
+  /**
+   * 客户端权限选择完成
+   * @param checkedValues
+   */
+  const onSelectClientPermission = (checkedValues: string[]) => {
+    console.log(`ClientPermissionSelecter选择的数据:${JSON.stringify(checkedValues)}`);
+
+    //提取原来的数据
+    let defaultData = getSelectClientPermissionData;
+    //设置为控件中返回的新值
+    defaultData[getSelectClientTypeKey] = checkedValues;
+
+    //重新刷新界面
+    setSelectClientPermissionData({ type: 'update', playload: defaultData });
+
+    /**
+     * 返回上级控件
+     */
+    onChange(defaultData);
+  };
+
+  return (
+    <Card bordered={true} style={{ marginBottom: 20 }}>
+      <Tabs defaultActiveKey={getSelectClientTypeKey} onChange={onChangeClientTab}>
+        {getClientTypeKeyList.map((clientTypeItem: string) => {
+          let selectData: string[] = [];
+          if (getSelectClientPermissionData && getSelectClientPermissionData[clientTypeItem]) {
+            selectData = getSelectClientPermissionData[clientTypeItem];
+          }
+
+          //显示出来的列
+          let options = _.filter(getAllClientPermissionData, { clientType: clientTypeItem }).map(
+            (clientPermissionItem: ClientPermissionItem) => {
+              return {
+                label: clientPermissionItem.clientPermissionName,
+                value: clientPermissionItem.clientPermissionId.toString(),
+              };
+            },
+          );
+
+          return (
+            <TabPane
+              tab={
+                clientTypeItem == '1' ? (
+                  <FormattedMessage
+                    id="pages.ClientPermission.column.clientType.machineClient"
+                    defaultMessage="机器边缘端"
+                  />
+                ) : (
+                  <FormattedMessage id="pages.ClientPermission.column.clientType.qcClient" defaultMessage="QC客户端" />
+                )
+              }
+              key={clientTypeItem}
+            >
+              <Checkbox.Group
+                key={`Checkbox-1`}
+                style={{ width: '100%' }}
+                defaultValue={selectData}
+                value={selectData}
+                options={options}
+                onChange={onSelectClientPermission}
+              ></Checkbox.Group>
+            </TabPane>
+          );
+        })}
+      </Tabs>
+    </Card>
+  );
+};
+
+export default ClientPermissionSelecter;

package/lib/templates/qiankun/cf-workbench-base/src/pages/Client/ClientPermission/components/UpdateForm.tsx

@@ -0,0 +1,105 @@
+import { ProFormSelect, ProFormText, ProFormTextArea } from '@ant-design/pro-form';
+import { cfmmUtils, RefDrawerForm, RefDrawerFormRefType, useIntl } from '@umijs/max';
+import { Form } from 'antd';
+import React, { MutableRefObject, useEffect } 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;
+}
+
+const UpdateForm: React.FC<UpdateFormProps> = (props) => {
+  const { formatMessage } = useIntl();
+  const [form] = Form.useForm();
+
+  useEffect(() => {
+    if (props.values) {
+      form.setFieldsValue({
+        ...props.values,
+      });
+    }
+  }, [props.values]);
+
+  return (
+    <RefDrawerForm
+      form={form}
+      ref={props.updateDrawerRef}
+      title={formatMessage({
+        id: 'pages.ClientPermission.update.title',
+        defaultMessage: '修改客户端权限',
+      })}
+      onFinish={props.onSubmit}
+    >
+      <ProFormText name="clientPermissionId" disabled hidden />
+      <ProFormSelect
+        name="clientType"
+        disabled
+        label={formatMessage({
+          id: 'pages.ClientPermission.column.clientType',
+          defaultMessage: '客户端类型',
+        })}
+        valueEnum={{
+          1: formatMessage({
+            id: 'pages.ClientPermission.column.clientType.machineClient',
+            defaultMessage: '机器边缘端',
+          }),
+          // 2: formatMessage({
+          //   id: 'pages.ClientPermission.column.clientType.mobileClient',
+          //   defaultMessage: '手机/平板客户端',
+          // }),
+          // 3: formatMessage({
+          //   id: 'pages.ClientPermission.column.clientType.dashboardClient',
+          //   defaultMessage: '看板客户端',
+          // }),
+          4: formatMessage({
+            id: 'pages.ClientPermission.column.clientType.qcClient',
+            defaultMessage: 'QC客户端',
+          }),
+        }}
+        rules={[{ required: true }]}
+      />
+
+      <ProFormText
+        name="clientPermissionCode"
+        disabled
+        label={formatMessage({
+          id: 'pages.ClientPermission.column.clientPermissionCode',
+          defaultMessage: '客户端权限编号',
+        })}
+        rules={[{ required: true }]}
+      />
+
+      <ProFormText
+        name="clientPermissionName"
+        label={formatMessage({
+          id: 'pages.ClientPermission.column.clientPermissionName',
+          defaultMessage: '部门名称',
+        })}
+        rules={[{ required: true }]}
+      />
+      <ProFormSelect
+        name="status"
+        label={formatMessage({
+          id: 'pages.ClientPermission.column.status',
+          defaultMessage: '状态',
+        })}
+        fieldProps={{
+          options: cfmmUtils.getValidList({ valueMap: { actived: 'Y', unactived: 'N' } }),
+        }}
+        rules={[{ required: true }]}
+      />
+      <ProFormTextArea
+        name="remark"
+        label={formatMessage({
+          id: 'pages.ClientPermission.column.remark',
+          defaultMessage: '备注',
+        })}
+      />
+    </RefDrawerForm>
+  );
+};
+
+export default UpdateForm;

package/lib/templates/qiankun/cf-workbench-base/src/pages/Client/ClientPermission/data.d.ts

@@ -0,0 +1,39 @@
+export interface TableListItem {
+  clientPermissionId: string;
+
+  clientType: string;
+
+  clientPermissionCode: string;
+  clientPermissionName: string;
+
+  status: string;
+  remark?: string;
+}
+
+export interface TableListPagination {
+  total: number;
+  pageSize: number;
+  current: number;
+}
+
+export interface TableListData {
+  list: TableListItem[];
+  pagination: Partial<TableListPagination>;
+}
+
+export interface TableListParams {
+  pageSize?: number;
+  pageIndex?: number;
+  orderBy?: { [key: string]: any };
+  [propName: string]: any;
+
+}
+
+export interface FormValueType extends Partial<TableListItem> {
+
+}
+
+
+export interface SelectClientPermissionListProps {
+  [propName: string]: string[];
+}

package/lib/templates/qiankun/cf-workbench-base/src/pages/Client/ClientPermission/index.tsx

@@ -0,0 +1,172 @@
+import { ProColumns } from '@ant-design/pro-table';
+import { Card, Col, Radio, Row, Tag } from 'antd';
+import React, { useEffect, useRef, useState } from 'react';
+import { cfmmUtils, CrudTable, CrudTableRefType, MyPageContainer, useIntl } from 'umi';
+import UpdateForm from './components/UpdateForm';
+import { TableListItem } from './data';
+import { handleClientPermission, queryClientPermission, queryClientPermissionByID } from './service';
+
+const validList = cfmmUtils.getValidList({ valueMap: { actived: 'Y', unactived: 'N' } });
+
+const baseLocalCode = 'pages.ClientPermission';
+const baseLocalName = '客户权限管理';
+
+//列表数据ID
+const ROW_ID: keyof TableListItem = 'clientPermissionId';
+const FORM_INIT_VALUE = {
+  initialValues: {
+    status: 'Y',
+  },
+};
+
+const TableList: React.FC = () => {
+  const crudTableRef = useRef<CrudTableRefType<TableListItem>>(null);
+  const { formatMessage } = useIntl();
+
+  /**
+   * 选择的客户端类型
+   */
+  const [selectClientTypeValue, setSelectClientTypeValue] = useState<string>('1');
+
+  /**
+   * 只要选中的机器类型进行改变，则会处理数据列表
+   */
+  useEffect(() => {
+    const actionRef = crudTableRef.current?.actionRef;
+    /**
+     * 当改变菜单，表格则会进行刷新
+     */
+    if (actionRef?.current) {
+      actionRef.current.clearSelected!();
+      actionRef.current.reload();
+    }
+  }, [selectClientTypeValue, crudTableRef]);
+
+  /**
+   * 左侧选择机器类型事件
+   * @param e
+   */
+  const onClientTypeChange = (e: any) => {
+    setSelectClientTypeValue(e.target.value);
+  };
+
+  const columns: ProColumns<TableListItem>[] = [
+    {
+      title: formatMessage({
+        id: 'pages.ClientPermission.column.clientPermissionCode',
+        defaultMessage: '客户端权限编号',
+      }),
+      dataIndex: 'clientPermissionCode',
+      sorter: true,
+      copyable: true,
+      formItemProps: { rules: [{ required: true }] },
+    },
+    {
+      title: formatMessage({
+        id: 'pages.ClientPermission.column.clientPermissionName',
+        defaultMessage: '客户端权限名称',
+      }),
+      dataIndex: 'clientPermissionName',
+      sorter: true,
+      formItemProps: { rules: [{ required: true }] },
+    },
+    {
+      title: formatMessage({ id: 'pages.ClientPermission.column.status', defaultMessage: '状态' }),
+      dataIndex: 'status',
+      sorter: true,
+      valueType: 'select',
+      fieldProps: {
+        options: validList,
+      },
+      render: (_, record) => {
+        const status = validList.find((item) => item.value === record.status);
+        return status?.label ? <Tag color={status.color}>{status.label}</Tag> : '-';
+      },
+    },
+    {
+      title: formatMessage({ id: 'pages.ClientPermission.column.remark', defaultMessage: '备注' }),
+      dataIndex: 'remark',
+      valueType: 'textarea',
+      ellipsis: true,
+    },
+  ];
+
+  return (
+    <MyPageContainer>
+      <Row gutter={16}>
+        <Col span={6}>
+          <Card
+            title={formatMessage({
+              id: 'pages.ClientPermission.column.clientType',
+              defaultMessage: '客户端类型',
+            })}
+            extra={[]}
+          >
+            <Radio.Group onChange={onClientTypeChange} defaultValue={selectClientTypeValue} buttonStyle="solid">
+              <Radio.Button key={'1'} value={'1'}>
+                {formatMessage({
+                  id: 'pages.ClientPermission.column.clientType.machineClient',
+                  defaultMessage: '机器边缘端',
+                })}
+              </Radio.Button>
+              {/* <Radio.Button disabled={true} key={"2"} value={"2"}>{formatMessage({ id: 'pages.ClientPermission.column.clientType.mobileClient', defaultMessage: '手机/平板客户端' })}</Radio.Button>
+              <Radio.Button disabled={true} key={"3"} value={"3"}>{formatMessage({ id: 'pages.ClientPermission.column.clientType.dashboardClient', defaultMessage: '看板客户端' })}</Radio.Button> */}
+              <Radio.Button key={'4'} value={'4'}>
+                {formatMessage({ id: 'pages.ClientPermission.column.clientType.qcClient', defaultMessage: 'QC客户端' })}
+              </Radio.Button>
+            </Radio.Group>
+          </Card>
+        </Col>
+        <Col span={18}>
+          <CrudTable<TableListItem>
+            ref={crudTableRef}
+            baseLocalCode={baseLocalCode}
+            baseLocalName={baseLocalName}
+            rowKey={ROW_ID}
+            columns={columns}
+            updateConfig={{
+              Component: UpdateForm,
+            }}
+            createConfig={{
+              props: {
+                form: FORM_INIT_VALUE,
+              },
+            }}
+            multiLang={{
+              fields: [
+                {
+                  fieldName: 'clientPermissionName',
+                  columnName: 'client_permission_name',
+                  tableName: 'client_permission',
+                },
+              ],
+            }}
+            apis={{
+              query: queryClientPermission,
+              handle: handleClientPermission,
+              queryById: queryClientPermissionByID,
+            }}
+            interceptors={{
+              query: {
+                request: (values) => {
+                  values['clientType'] = selectClientTypeValue as any;
+                  return values;
+                },
+              },
+              handle: {
+                request: (method, data) => {
+                  if (method === 'POST') {
+                    data['clientType'] = selectClientTypeValue.toString();
+                  }
+                  return { data };
+                },
+              },
+            }}
+          />
+        </Col>
+      </Row>
+    </MyPageContainer>
+  );
+};
+
+export default TableList;

package/lib/templates/qiankun/cf-workbench-base/src/pages/Client/ClientPermission/service.ts

@@ -0,0 +1,28 @@
+import { request, API } from '@umijs/max';
+import { TableListParams } from './data';
+import { BASE_API } from '@/constants';
+
+export async function queryClientPermission(params?: TableListParams) {
+  return request(`${BASE_API}/mes/clientPermission/list`, {
+    method: 'GET',
+    params,
+  });
+}
+
+export async function queryClientPermissionByID(clientPermissionId: number) {
+  return request(`${BASE_API}/mes/clientPermission/${clientPermissionId}`, {
+    method: 'GET',
+  });
+}
+
+// 增删改查
+export async function handleClientPermission(method = 'POST', params: TableListParams) {
+  const actionById = method === 'DELETE' || method === 'GET';
+  const baseUrl = `${BASE_API}/mes/clientPermission`;
+  const url = actionById ? `${baseUrl}/${params}` : baseUrl;
+  const nweParams = actionById ? null : { data: { ...params } };
+  return request<API.Result_Base>(url, {
+    method,
+    ...nweParams,
+  });
+}