✨ UI样式升级，支持规则工具信息展示

doc/.gitignore

@@ -1,3 +1,4 @@
 node_modules
 .temp
 .cache
+dist

doc/.vuepress/config.ts

@@ -22,6 +22,8 @@ export default defineUserConfig({
     ['meta', { name: 'theme-color', content: '#3eaf7c' }],
   ],
 
+  pagePatterns: ['**/*.md', '!.vuepress', '!node_modules', '!old'],
+
   plugins: [
     searchPlugin({
       // 配置项

doc/package.json

@@ -10,7 +10,7 @@
   "scripts": {
     "dev": "vuepress dev",
     "build:comment": "echo '构建帮助文档，默认base前缀为document，可根据部署需要进行相应调整'",
-    "build": "BASE=CodeAnalysis vuepress build -d ./dist"
+    "build": "BASE=${BASE:-CodeAnalysis} vuepress build -d ./dist"
   },
   "devDependencies": {
     "@vuepress/plugin-search": "^2.0.0-beta.43",

web/build-source.sh

@@ -23,47 +23,61 @@ BUILD_ZIP_PATH="${ROOT_PATH}/tca-deploy-source/build_zip/"
 function default_frontend() {
   dist=${2:-dist}
   status "开始构建 $1 ..."
-  GIT_REVISION=$GIT_REVISION yarn build --scope ${1}
+  GIT_REVISION=$GIT_REVISION yarn build --scope "${1}"
   status "构建完成，开始打包到 tca-deploy-source"
-  cd ${ROOT_PATH}/packages/${1}/${dist}
-  zip -r ${1}.zip * --exclude '*.map' --exclude 'stats.json' --exclude '*.txt'
-  mv ${1}.zip ${BUILD_ZIP_PATH} && cd ${ROOT_PATH}
+  cd "${ROOT_PATH}"/packages/"${1}"/"${dist}"
+  zip -r "${1}".zip ./* --exclude '*.map' --exclude 'stats.json' --exclude '*.txt'
+  mv "${1}".zip "${BUILD_ZIP_PATH}" && cd "${ROOT_PATH}"
+  status "打包完成 $1"
+}
+
+# 文档构建资源打包
+function document_frontend() {
+  cd "${ROOT_PATH}"
+  cd "../doc"
+  status "开始构建 $1 ..."
+  yarn install && BASE=document yarn build
+  dist=${2:-dist}
+  status "构建完成，开始打包到 tca-deploy-source"
+  cd "${dist}"
+  zip -r "${1}".zip ./* --exclude '*.map' --exclude 'stats.json' --exclude '*.txt'
+  mv "${1}".zip "${BUILD_ZIP_PATH}" && cd "${ROOT_PATH}"
   status "打包完成 $1"
 }
 
 # 子微前端的构建资源打包
 function sub_microfrontend() {
   status "开始构建 $1 ..."
-  GIT_REVISION=$GIT_REVISION PUBLIC_PATH=/static/$1/ ENABLE_EXTERNALS=TRUE yarn build --scope $1
+  GIT_REVISION=$GIT_REVISION PUBLIC_PATH=/static/$1/ ENABLE_EXTERNALS=TRUE yarn build --scope "$1"
   status "构建完成，开始打包到 tca-deploy-source"
-  cd ${ROOT_PATH}/packages/${1}/dist
-  zip -r ${1}.zip * --exclude '*.map' --exclude 'stats.json' --exclude '*.txt' --exclude '*.html'
-  mv ${1}.zip ${BUILD_ZIP_PATH} && cd ${ROOT_PATH}
+  cd "${ROOT_PATH}"/packages/"${1}"/dist
+  zip -r "${1}".zip ./* --exclude '*.map' --exclude 'stats.json' --exclude '*.txt' --exclude '*.html'
+  mv "${1}".zip "${BUILD_ZIP_PATH}" && cd "${ROOT_PATH}"
   status "打包完成 $1"
 }
 
 function run() {
   BUILD_PKGS=("tca-document" "framework" "login" "tca-layout" "tca-analysis" "tca-manage")
-  for pkg_name in ${BUILD_PKGS[@]}; do
+  for pkg_name in "${BUILD_PKGS[@]}"; do
     if [ "$pkg_name" = "framework" ]; then
-      default_frontend $pkg_name
+      default_frontend "$pkg_name"
     elif [ "$pkg_name" = "tca-document" ]; then
-      default_frontend $pkg_name
+      document_frontend "$pkg_name"
     else
-      sub_microfrontend $pkg_name
+      sub_microfrontend "$pkg_name"
     fi
   done
 }
 
 function run_config() {
-  cd ${ROOT_PATH}
+  cd "${ROOT_PATH}"
   SUB_MICRO_FRONTEND_PKGS=("tca-layout" "login" "tca-analysis" "tca-manage")
   configs=''
   for i in "${!SUB_MICRO_FRONTEND_PKGS[@]}"; do
     pkg_name=${SUB_MICRO_FRONTEND_PKGS[$i]}
-    configs+=', '$(cat ${ROOT_PATH}/packages/${pkg_name}/dist/$pkg_name.json)
+    configs+=', '$(cat "${ROOT_PATH}"/packages/"${pkg_name}"/dist/"$pkg_name".json)
   done
-  echo '['${configs:2}']' >${CONF_PATH}/configs.json
+  echo '['"${configs:2}"']' >"${CONF_PATH}"/configs.json
 }
 
 run

web/packages/login/README.md

@@ -10,18 +10,15 @@
 ## 本地启动脚本
 
 ```bash
-PUBLIC_PATH=http://127.0.0.1:5055/ yarn run dev
+yarn run dev
 ```
 
 ## 开发模式启动方式
 
 使用如下命令启动：
 
   ```bash
-  xxx=xxx yarn run dev
-
-  # 如
-  PUBLIC_PATH=http://127.0.0.1:5055/ yarn run dev
+  yarn run dev
   ```
 
 启动后可通过以下进行开发：

web/packages/shared/component/authority/constants.ts

@@ -0,0 +1,42 @@
+/** 平台类型 */
+export enum ScmPlatformEnum {
+  TGIT = 1,
+  GIT_TENCENT,
+  CODING,
+  GITHUB,
+  GITEE,
+  GITLAB,
+  OTHER,
+}
+
+export const SCM_PLATFORM_CHOICES = {
+  [ScmPlatformEnum.TGIT]: '腾讯工蜂(OA)',
+  [ScmPlatformEnum.GIT_TENCENT]: '腾讯工蜂',
+  [ScmPlatformEnum.CODING]: 'Coding',
+  [ScmPlatformEnum.GITHUB]: 'GitHub',
+  [ScmPlatformEnum.GITEE]: 'Gitee',
+  [ScmPlatformEnum.GITLAB]: 'GitLab',
+  [ScmPlatformEnum.OTHER]: '其它平台',
+};
+
+/**
+ * 凭证类型
+ */
+export const AUTH_TYPE = {
+  HTTP: 'password',
+  SSH: 'ssh_token',
+  OAUTH: 'oauth',
+};
+
+export const AUTH_TYPE_TXT = {
+  HTTP: '用户名 + 密码',
+  SSH: 'SSH',
+  OAUTH: 'OAuth',
+};
+
+// 凭证映射，对应 api 返回的字段名
+export const SCM_MAP = {
+  [AUTH_TYPE.HTTP]: 'scm_account',
+  [AUTH_TYPE.SSH]: 'scm_ssh',
+  [AUTH_TYPE.OAUTH]: 'scm_oauth',
+};

web/packages/tca-layout/src/components/authority/index.tsx → web/packages/shared/component/authority/index.tsx

@@ -2,34 +2,43 @@
  * 选择认证
  */
 import React, { useState, useEffect } from 'react';
-import { find, isEmpty, get, filter } from 'lodash';
+import { find, isEmpty, filter, get } from 'lodash';
 import { Button, Form, Select, Tooltip } from 'coding-oa-uikit';
 import PlusIcon from 'coding-oa-uikit/lib/icon/Plus';
 import RefreshIcon from 'coding-oa-uikit/lib/icon/Refresh';
 
-import { SCM_PLATFORM, AUTH_TYPE, AUTH_TYPE_TXT, SCM_MAP } from '@src/common/constants/authority';
-import { getSSHInfo, gScmAccounts as getScmAccounts, getOAuthInfo, getPlatformStatus } from '@src/services/user';
-import { FormInstance } from 'rc-field-form';
+import { AUTH_TYPE, AUTH_TYPE_TXT, SCM_MAP, SCM_PLATFORM_CHOICES } from './constants';
 
+import { FormInstance } from 'rc-field-form';
 const { Option, OptGroup } = Select;
 
+export interface RestfulListAPIParams {
+  results: any[];
+  count: number;
+  next: string;
+  previous: string
+}
+
 interface AuthorityProps {
-  name: string; // 对应表单 name 
+  name: string; // 对应表单 name
   form: FormInstance; // form 对象
   label: string | React.ReactNode; // FormItem label
+  /* 接口顺序：获取ssh凭证，获取用户名密码凭证，获取各平台OAuth授权状态，获取各平台OAuth应用配置状态 **/
+  getAuthList: Array<(param?: any) => Promise<any>>;
   initAuth?: any;
   selectStyle?: any;
   placeholder?: string;
+  required?: boolean;
 }
 
 const Authority = (props: AuthorityProps) => {
-  const { form, name, label, initAuth, selectStyle = {}, placeholder } = props;
+  const { form, name, label, initAuth, getAuthList, selectStyle = {}, placeholder, required } = props;
   const [sshAuthList, setSshAuthList] = useState<any>([]);
   const [httpAuthList, setHttpAuthList] = useState<any>([]);
   const [oauthAuthList, setOauthAuthList] = useState<any>([]);
   const [authLoading, setAuthLoading] = useState(false);
 
-  const setCurAuth = (sshList = sshAuthList, httpList = httpAuthList, oauthList = oauthAuthList) => {
+  const setCurAuth = (sshList = sshAuthList, httpList = httpAuthList) => {
     // 设置初始值
     if (initAuth[SCM_MAP[initAuth.auth_type]]?.id) {
       form.setFieldsValue({ [name]: `${initAuth.auth_type}#${initAuth[SCM_MAP[initAuth.auth_type]]?.id}` });
@@ -50,29 +59,25 @@ const Authority = (props: AuthorityProps) => {
     ) {
       setHttpAuthList([initAuth.scm_account, ...httpList]);
     }
-    if (
-      initAuth.scm_oauth
-      && initAuth.auth_type === AUTH_TYPE.OAUTH
-      && !find(oauthList, { id: initAuth.scm_oauth?.id })
-    ) {
-      setOauthAuthList([initAuth.scm_oauth, ...oauthList]);
-    }
   };
 
   const getAuth = () => {
     setAuthLoading(true);
     Promise.all([
-      getSSHInfo().then(r => r.results || []),
-      getScmAccounts().then(r => r.results || []),
-      getOAuthInfo().then(r => r.results || []),
-      getPlatformStatus().then(r => r || []),
-    ]).then((result) => {
+      getAuthList[0]({ limit: 200 })
+        .then(({ results }: RestfulListAPIParams) => results || []),
+      getAuthList[1]({ limit: 200 })
+        .then(({ results }: RestfulListAPIParams) => results || []),
+      getAuthList[2]()
+        .then(({ results }: RestfulListAPIParams) => results || []),
+      getAuthList[3]().then(r => r || {}),
+    ]).then((result: any) => {
       const activeOauth = filter(
         result[2].map((item: any) => ({
           ...item,
           platform_status: get(result[3], item.scm_platform_name, [false]),
         })),
-        'platform_status'
+        'platform_status',
       );
       setSshAuthList(result[0]);
       setHttpAuthList(result[1]);
@@ -92,22 +97,23 @@ const Authority = (props: AuthorityProps) => {
   }, [initAuth, authLoading]);
 
   return (
-    <Form.Item label={label}>
-      <Form.Item name={name} noStyle>
-        <Select allowClear
+    <Form.Item label={label} required={required}>
+      <Form.Item name={name} noStyle rules={[{ required, message: '请选择仓库凭证' }]}>
+        <Select
           style={selectStyle}
           placeholder={placeholder}
           getPopupContainer={() => document.body}
+          optionLabelProp="label"
         >
           {!isEmpty(oauthAuthList) && (
             <OptGroup label={AUTH_TYPE_TXT.OAUTH}>
               {oauthAuthList.map((auth: any) => (
-                // HTTP 和 SSH ID可能重复
                 <Option
                   key={`${AUTH_TYPE.OAUTH}#${auth.id}`}
                   value={`${AUTH_TYPE.OAUTH}#${auth.id}`}
+                  label={`${get(SCM_PLATFORM_CHOICES, auth.scm_platform)}: ${AUTH_TYPE_TXT.OAUTH}`}
                 >
-                  {get(SCM_PLATFORM, auth.scm_platform, '其他')}
+                  {get(SCM_PLATFORM_CHOICES, auth.scm_platform)}
                 </Option>
               ))}
             </OptGroup>
@@ -118,8 +124,10 @@ const Authority = (props: AuthorityProps) => {
                 <Option
                   key={`${AUTH_TYPE.SSH}#${auth.id}`}
                   value={`${AUTH_TYPE.SSH}#${auth.id}`}
+                  label={`${get(SCM_PLATFORM_CHOICES, auth.scm_platform)}: ${auth.name}`}
                 >
-                  {get(SCM_PLATFORM, auth.scm_platform, '其他')}：{auth.name}
+                  {get(SCM_PLATFORM_CHOICES, auth.scm_platform)}: {auth.name}
+                  <small style={{ marginLeft: 8, color: '#8592a6' }}>(在 {auth.auth_origin} 创建)</small>
                 </Option>
               ))}
             </OptGroup>
@@ -130,8 +138,10 @@ const Authority = (props: AuthorityProps) => {
                 <Option
                   key={`${AUTH_TYPE.HTTP}#${auth.id}`}
                   value={`${AUTH_TYPE.HTTP}#${auth.id}`}
+                  label={`${get(SCM_PLATFORM_CHOICES, auth.scm_platform)}: ${auth.scm_username}`}
                 >
-                  {get(SCM_PLATFORM, auth.scm_platform, '其他')}：{auth.scm_username}
+                  {get(SCM_PLATFORM_CHOICES, auth.scm_platform)}: {auth.scm_username}
+                  <small style={{ marginLeft: 8, color: '#8592a6' }}>(在 {auth.auth_origin} 创建)</small>
                 </Option>
               ))}
             </OptGroup>
@@ -140,7 +150,7 @@ const Authority = (props: AuthorityProps) => {
       </Form.Item>
       <div style={{
         position: 'absolute',
-        top: 5,
+        top: 0,
         right: 10,
       }}>
         <Tooltip title='新增凭证' placement='top' getPopupContainer={() => document.body}>

web/packages/shared/component/micro-init/index.tsx

@@ -4,10 +4,11 @@ import { legacy_createStore as createStore, combineReducers } from 'redux';
 import { Provider } from 'react-redux';
 import { ConfigProvider } from 'coding-oa-uikit';
 import Cookie from 'universal-cookie';
-import 'coding-oa-uikit/dist/coding-oa-uikit.css';
+// import 'coding-oa-uikit/dist/coding-oa-uikit.css';
 import { StoreProvider } from '../../hook-store';
 import { Store, StateProps, ActionProps, Middleware } from '../../hook-store/types';
 import '../../style/index.scss';
+import '../../style/zhiyan.css';
 
 /**
  * 国际化资源加载
@@ -80,7 +81,7 @@ const MicroInit = <State extends StateProps = StateProps, Action extends ActionP
     const locale = await loadLocale();
     let renderContent = <ConfigProvider
       autoInsertSpaceInButton={false}
-      locale={locale}
+      locale={locale.default}
       getPopupContainer={node => (node ? node.parentNode as HTMLElement : document.body)}
     >
       {container}

web/packages/tca-layout/src/components/delete-modal/index.tsx → web/packages/shared/component/modal/delete-modal/index.tsx

@@ -1,16 +1,10 @@
-// Copyright (c) 2021-2022 THL A29 Limited
-//
-// This source code file is made available under MIT License
-// See LICENSE for details
-// ==============================================================================
-
 /**
  * 确认删除操作弹框
  */
 
 import React, { useEffect, useState } from 'react';
 import { Modal, Form, Input, message, Button } from 'coding-oa-uikit';
-import { t } from '@src/i18n/i18next';
+import { useTranslation } from 'react-i18next';
 
 import s from './style.scss';
 
@@ -24,9 +18,10 @@ interface DeleteModalProps {
   onOk: () => void;
 }
 
-const DeleteModal = ({ actionType, objectType, confirmName, addtionInfo='', visible, onCancel, onOk }: DeleteModalProps) => {
+const DeleteModal = ({ actionType, objectType, confirmName, addtionInfo = '', visible, onCancel, onOk }: DeleteModalProps) => {
   const [form] = Form.useForm();
   const [confirmed, setConfirmed] = useState<boolean>(true);
+  const { t } = useTranslation();
 
   useEffect(() => {
     visible && form.resetFields();
@@ -81,7 +76,7 @@ const DeleteModal = ({ actionType, objectType, confirmName, addtionInfo='', visi
       ]}
     >
       <p className={s.warningMessage}>
-            {t('您正在')}{actionType}{objectType} <span className={s.confirmText}>{confirmName}</span>{' '}<br/>
+        {t('您正在')}{actionType}{objectType} <span className={s.confirmText}>{confirmName}</span>{' '}<br/>
       </p>
       {addtionInfo && <p className={s.warningMessage}>{addtionInfo}</p>}
       <p className={s.confirmMessage}>{t(`为确认${actionType}操作，请输入您要${actionType}的`)}{objectType}</p>