Compare commits
No commits in common. "develop-20231222" and "main" have entirely different histories.
develop-20
...
main
@ -1,12 +1,3 @@
|
|||||||
/*
|
|
||||||
* @version: V1.0.0
|
|
||||||
* @Date: 2023-12-26 13:54:58
|
|
||||||
* @LastEditors: lzq
|
|
||||||
* @LastEditTime: 2023-12-26 14:14:09
|
|
||||||
* @company: 睿展数据
|
|
||||||
* @FilePath: \salpa-web\config\proxy.ts
|
|
||||||
* @Descripttion:
|
|
||||||
*/
|
|
||||||
/**
|
/**
|
||||||
* 在生产环境 代理是无法生效的，所以这里没有生产环境的配置
|
* 在生产环境 代理是无法生效的，所以这里没有生产环境的配置
|
||||||
* -------------------------------
|
* -------------------------------
|
||||||
@ -19,7 +10,7 @@ export default {
|
|||||||
dev: {
|
dev: {
|
||||||
'/api/': {
|
'/api/': {
|
||||||
// target: 'http://192.168.103.172:8080',
|
// target: 'http://192.168.103.172:8080',
|
||||||
target: 'http://192.168.1.217:9080',
|
target: 'http://192.168.2.58:8080',
|
||||||
changeOrigin: true,
|
changeOrigin: true,
|
||||||
pathRewrite: { '^/api': '' },
|
pathRewrite: { '^/api': '' },
|
||||||
},
|
},
|
||||||
@ -28,7 +19,7 @@ export default {
|
|||||||
target: 'http://192.168.113.251:8080',
|
target: 'http://192.168.113.251:8080',
|
||||||
|
|
||||||
changeOrigin: true,
|
changeOrigin: true,
|
||||||
},
|
}
|
||||||
},
|
},
|
||||||
test: {
|
test: {
|
||||||
'/api/': {
|
'/api/': {
|
||||||
|
|||||||
57256
package-lock.json
generated
57256
package-lock.json
generated
File diff suppressed because it is too large
Load Diff
@ -26,6 +26,7 @@
|
|||||||
"lint:prettier": "prettier -c --write \"src/**/*\" --end-of-line auto",
|
"lint:prettier": "prettier -c --write \"src/**/*\" --end-of-line auto",
|
||||||
"lint:style": "stylelint --fix \"src/**/*.less\" --syntax less",
|
"lint:style": "stylelint --fix \"src/**/*.less\" --syntax less",
|
||||||
"openapi": "umi openapi",
|
"openapi": "umi openapi",
|
||||||
|
"precommit": "lint-staged",
|
||||||
"prettier": "prettier -c --write \"src/**/*\"",
|
"prettier": "prettier -c --write \"src/**/*\"",
|
||||||
"serve": "umi-serve",
|
"serve": "umi-serve",
|
||||||
"start": "cross-env UMI_ENV=dev umi dev",
|
"start": "cross-env UMI_ENV=dev umi dev",
|
||||||
|
|||||||
93
src/app.tsx
93
src/app.tsx
@ -5,59 +5,60 @@
|
|||||||
*
|
*
|
||||||
* */
|
* */
|
||||||
|
|
||||||
import RightContent from '@/components/RightContent';
|
import RightContent from '@/components/RightContent'
|
||||||
import type { Settings as LayoutSettings } from '@ant-design/pro-layout';
|
import type { Settings as LayoutSettings } from '@ant-design/pro-layout'
|
||||||
import { PageLoading } from '@ant-design/pro-layout';
|
import { PageLoading } from '@ant-design/pro-layout'
|
||||||
import type { RunTimeLayoutConfig } from 'umi';
|
import type { RunTimeLayoutConfig } from 'umi'
|
||||||
import { history, Link } from 'umi';
|
import { history, Link } from 'umi'
|
||||||
// import Footer from '@/components/Footer';
|
// import Footer from '@/components/Footer';
|
||||||
import { BookOutlined, LinkOutlined } from '@ant-design/icons';
|
import { BookOutlined, LinkOutlined } from '@ant-design/icons'
|
||||||
import defaultSettings from '../config/defaultSettings';
|
import defaultSettings from '../config/defaultSettings'
|
||||||
import { getRoutersInfo, getUserInfo } from './services/session';
|
import iconStyle from '../public/樽海鞘_图案.svg'
|
||||||
const isDev = process.env.NODE_ENV === 'development';
|
import { getRoutersInfo, getUserInfo } from './services/session'
|
||||||
const loginPath = '/user/login';
|
const isDev = process.env.NODE_ENV === 'development'
|
||||||
|
const loginPath = '/user/login'
|
||||||
/** 获取用户信息比较慢的时候会展示一个 loading */
|
/** 获取用户信息比较慢的时候会展示一个 loading */
|
||||||
export const initialStateConfig = {
|
export const initialStateConfig = {
|
||||||
loading: <PageLoading />,
|
loading: <PageLoading />
|
||||||
};
|
}
|
||||||
|
|
||||||
/**
|
/**
|
||||||
* @see https://umijs.org/zh-CN/plugins/plugin-initial-state
|
* @see https://umijs.org/zh-CN/plugins/plugin-initial-state
|
||||||
* */
|
* */
|
||||||
export async function getInitialState(): Promise<{
|
export async function getInitialState(): Promise<{
|
||||||
settings?: Partial<LayoutSettings>;
|
settings?: Partial<LayoutSettings>
|
||||||
currentUser?: API.CurrentUser;
|
currentUser?: API.CurrentUser
|
||||||
loading?: boolean;
|
loading?: boolean
|
||||||
fetchUserInfo?: () => Promise<API.CurrentUser | undefined>;
|
fetchUserInfo?: () => Promise<API.CurrentUser | undefined>
|
||||||
}> {
|
}> {
|
||||||
const fetchUserInfo = async () => {
|
const fetchUserInfo = async () => {
|
||||||
try {
|
try {
|
||||||
console.log(1111111111111111111111111111111);
|
console.log(1111111111111111111111111111111)
|
||||||
const resp = await getUserInfo();
|
const resp = await getUserInfo()
|
||||||
if (resp === undefined || resp.code !== 200) {
|
if (resp === undefined || resp.code !== 200) {
|
||||||
history.push(loginPath);
|
history.push(loginPath)
|
||||||
} else {
|
} else {
|
||||||
return { ...resp.user, permissions: resp.permissions } as API.CurrentUser;
|
return { ...resp.user, permissions: resp.permissions } as API.CurrentUser
|
||||||
}
|
}
|
||||||
} catch (error) {
|
} catch (error) {
|
||||||
history.push(loginPath);
|
history.push(loginPath)
|
||||||
}
|
}
|
||||||
return undefined;
|
return undefined
|
||||||
};
|
}
|
||||||
// 如果是登录页面，不执行
|
// 如果是登录页面，不执行
|
||||||
if (history.location.pathname !== loginPath) {
|
if (history.location.pathname !== loginPath) {
|
||||||
console.log(222222222222222222222222222222);
|
console.log(222222222222222222222222222222)
|
||||||
const currentUser = await fetchUserInfo();
|
const currentUser = await fetchUserInfo()
|
||||||
return {
|
return {
|
||||||
settings: defaultSettings,
|
settings: defaultSettings,
|
||||||
currentUser,
|
currentUser,
|
||||||
fetchUserInfo,
|
fetchUserInfo
|
||||||
};
|
}
|
||||||
}
|
}
|
||||||
return {
|
return {
|
||||||
fetchUserInfo,
|
fetchUserInfo,
|
||||||
settings: defaultSettings,
|
settings: defaultSettings
|
||||||
};
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
// ProLayout 支持的api https://procomponents.ant.design/components/layout
|
// ProLayout 支持的api https://procomponents.ant.design/components/layout
|
||||||
@ -65,14 +66,14 @@ export const layout: RunTimeLayoutConfig = ({ initialState, setInitialState }) =
|
|||||||
return {
|
return {
|
||||||
rightContentRender: () => <RightContent />,
|
rightContentRender: () => <RightContent />,
|
||||||
waterMarkProps: {
|
waterMarkProps: {
|
||||||
content: initialState?.currentUser?.userName,
|
content: initialState?.currentUser?.userName
|
||||||
},
|
},
|
||||||
// footerRender: () => <Footer />,
|
// footerRender: () => <Footer />,
|
||||||
onPageChange: () => {
|
onPageChange: () => {
|
||||||
const { location } = history;
|
const { location } = history
|
||||||
// 如果没有登录，重定向到 login
|
// 如果没有登录，重定向到 login
|
||||||
if (!initialState?.currentUser && location.pathname !== loginPath) {
|
if (!initialState?.currentUser && location.pathname !== loginPath) {
|
||||||
history.push(loginPath);
|
history.push(loginPath)
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
links: isDev
|
links: isDev
|
||||||
@ -84,27 +85,27 @@ export const layout: RunTimeLayoutConfig = ({ initialState, setInitialState }) =
|
|||||||
<Link key="docs" to="/~docs">
|
<Link key="docs" to="/~docs">
|
||||||
<BookOutlined />
|
<BookOutlined />
|
||||||
<span>业务组件文档</span>
|
<span>业务组件文档</span>
|
||||||
</Link>,
|
</Link>
|
||||||
]
|
]
|
||||||
: [],
|
: [],
|
||||||
menuHeaderRender: false,
|
menuHeaderRender: undefined,
|
||||||
menu: {
|
menu: {
|
||||||
// 每当 initialState?.currentUser?.userid 发生修改时重新执行 request
|
// 每当 initialState?.currentUser?.userid 发生修改时重新执行 request
|
||||||
params: {
|
params: {
|
||||||
userId: initialState?.currentUser?.userId,
|
userId: initialState?.currentUser?.userId
|
||||||
},
|
},
|
||||||
request: async () => {
|
request: async () => {
|
||||||
if (!initialState?.currentUser?.userId) {
|
if (!initialState?.currentUser?.userId) {
|
||||||
return [];
|
return []
|
||||||
}
|
}
|
||||||
// initialState.currentUser 中包含了所有用户信息
|
// initialState.currentUser 中包含了所有用户信息
|
||||||
const menus = await getRoutersInfo();
|
const menus = await getRoutersInfo()
|
||||||
setInitialState((preInitialState: any) => ({
|
setInitialState((preInitialState: any) => ({
|
||||||
...preInitialState,
|
...preInitialState,
|
||||||
menus,
|
menus
|
||||||
}));
|
}))
|
||||||
return menus;
|
return menus
|
||||||
},
|
}
|
||||||
},
|
},
|
||||||
// 自定义 403 页面
|
// 自定义 403 页面
|
||||||
// unAccessible: <div>unAccessible</div>,
|
// unAccessible: <div>unAccessible</div>,
|
||||||
@ -115,11 +116,9 @@ export const layout: RunTimeLayoutConfig = ({ initialState, setInitialState }) =
|
|||||||
{children}
|
{children}
|
||||||
{!props.location?.pathname?.includes('/login')}
|
{!props.location?.pathname?.includes('/login')}
|
||||||
</div>
|
</div>
|
||||||
);
|
)
|
||||||
},
|
},
|
||||||
...initialState?.settings,
|
...initialState?.settings,
|
||||||
// logo: <div />,
|
logo: <img src={iconStyle} />
|
||||||
// title: <div />,
|
}
|
||||||
// logo: <img src={iconStyle} />
|
}
|
||||||
};
|
|
||||||
};
|
|
||||||
|
|||||||
@ -1,20 +1,11 @@
|
|||||||
/*
|
|
||||||
* @version: V1.0.0
|
|
||||||
* @Date: 2023-12-26 13:54:59
|
|
||||||
* @LastEditors: lzq
|
|
||||||
* @LastEditTime: 2023-12-26 14:24:26
|
|
||||||
* @company: 睿展数据
|
|
||||||
* @FilePath: \salpa-web\src\components\RightContent\index.tsx
|
|
||||||
* @Descripttion:
|
|
||||||
*/
|
|
||||||
import { QuestionCircleOutlined } from '@ant-design/icons';
|
|
||||||
import { Space } from 'antd';
|
import { Space } from 'antd';
|
||||||
|
import { QuestionCircleOutlined } from '@ant-design/icons';
|
||||||
import React from 'react';
|
import React from 'react';
|
||||||
import { SelectLang, useModel } from 'umi';
|
import { useModel, SelectLang } from 'umi';
|
||||||
import HeaderSearch from '../HeaderSearch';
|
|
||||||
import NoticeIconView from '../NoticeIcon';
|
|
||||||
import Avatar from './AvatarDropdown';
|
import Avatar from './AvatarDropdown';
|
||||||
|
import HeaderSearch from '../HeaderSearch';
|
||||||
import styles from './index.less';
|
import styles from './index.less';
|
||||||
|
import NoticeIconView from '../NoticeIcon';
|
||||||
|
|
||||||
export type SiderTheme = 'light' | 'dark';
|
export type SiderTheme = 'light' | 'dark';
|
||||||
|
|
||||||
@ -31,7 +22,7 @@ const GlobalHeaderRight: React.FC = () => {
|
|||||||
if ((navTheme === 'dark' && layout === 'top') || layout === 'mix') {
|
if ((navTheme === 'dark' && layout === 'top') || layout === 'mix') {
|
||||||
className = `${styles.right} ${styles.dark}`;
|
className = `${styles.right} ${styles.dark}`;
|
||||||
}
|
}
|
||||||
return <span />;
|
|
||||||
return (
|
return (
|
||||||
<Space className={className}>
|
<Space className={className}>
|
||||||
<HeaderSearch
|
<HeaderSearch
|
||||||
|
|||||||
@ -1,16 +1,7 @@
|
|||||||
/*
|
|
||||||
* @version: V1.0.0
|
|
||||||
* @Date: 2023-12-26 13:54:59
|
|
||||||
* @LastEditors: lzq
|
|
||||||
* @LastEditTime: 2023-12-26 14:10:35
|
|
||||||
* @company: 睿展数据
|
|
||||||
* @FilePath: \salpa-web\src\e2e\baseLayout.e2e.js
|
|
||||||
* @Descripttion:
|
|
||||||
*/
|
|
||||||
const { uniq } = require('lodash');
|
const { uniq } = require('lodash');
|
||||||
const RouterConfig = require('../../config/config').default.routes;
|
const RouterConfig = require('../../config/config').default.routes;
|
||||||
|
|
||||||
const BASE_URL = `http://localhost:${process.env.PORT || 8000}`;
|
const BASE_URL = `http://localhost:${process.env.PORT || 8001}`;
|
||||||
|
|
||||||
function formatter(routes, parentPath = '') {
|
function formatter(routes, parentPath = '') {
|
||||||
const fixedParentPath = parentPath.replace(/\/{1,}/g, '/');
|
const fixedParentPath = parentPath.replace(/\/{1,}/g, '/');
|
||||||
|
|||||||
@ -56,28 +56,29 @@ ol {
|
|||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
// .ant-layout{
|
|
||||||
// background: #fff;
|
|
||||||
// }
|
|
||||||
// .ant-layout-header{
|
|
||||||
// //display: none;
|
|
||||||
// }
|
|
||||||
|
|
||||||
// #contentContainer{
|
.ant-layout{
|
||||||
// //display: none;
|
background: #fff;
|
||||||
// }
|
}
|
||||||
// .ant-pro-right-content{
|
.ant-layout-header{
|
||||||
// display: none;
|
//display: none;
|
||||||
// }
|
}
|
||||||
// .ant-modal-mask{
|
|
||||||
// background-color: rgba(255, 0, 0, 0);
|
#contentContainer{
|
||||||
// }
|
//display: none;
|
||||||
// .chiner-modal{
|
}
|
||||||
// background-color: rgba(255, 0, 0, 0);
|
.ant-pro-right-content{
|
||||||
// }
|
display: none;
|
||||||
// .ant-pro-top-nav-header-logo{
|
}
|
||||||
// display: none;
|
.ant-modal-mask{
|
||||||
// }
|
background-color: rgba(255, 0, 0, 0);
|
||||||
// .ant-pro-top-nav-header-main-left{
|
}
|
||||||
// min-width: 0px;
|
.chiner-modal{
|
||||||
// }
|
background-color: rgba(255, 0, 0, 0);
|
||||||
|
}
|
||||||
|
.ant-pro-top-nav-header-logo{
|
||||||
|
display: none;
|
||||||
|
}
|
||||||
|
.ant-pro-top-nav-header-main-left{
|
||||||
|
min-width: 0px;
|
||||||
|
}
|
||||||
|
|||||||
@ -1,149 +0,0 @@
|
|||||||
body .ant-layout{
|
|
||||||
background: #fff;
|
|
||||||
}
|
|
||||||
|
|
||||||
/*ant-btn*/
|
|
||||||
body .ant-btn:focus,
|
|
||||||
body .ant-btn:hover {
|
|
||||||
color: #2B50C4;
|
|
||||||
border-color: #2B50C4;
|
|
||||||
background: #fff;
|
|
||||||
}
|
|
||||||
body .ant-btn:active {
|
|
||||||
color:#042281;
|
|
||||||
border-color:#042281;
|
|
||||||
background:#fff
|
|
||||||
}
|
|
||||||
body .ant-btn-primary {
|
|
||||||
color: #fff;
|
|
||||||
border-color: #233A82;
|
|
||||||
background: #233A82;
|
|
||||||
}
|
|
||||||
body .ant-btn-primary:focus,
|
|
||||||
body .ant-btn-primary:hover {
|
|
||||||
color: #fff;
|
|
||||||
border-color: #2B50C4;
|
|
||||||
background: #2B50C4;
|
|
||||||
}
|
|
||||||
body .ant-btn-primary:active {
|
|
||||||
color: #fff;
|
|
||||||
border-color: #042281;
|
|
||||||
background: #042281;
|
|
||||||
}
|
|
||||||
html {
|
|
||||||
--antd-wave-shadow-color:#233A82 !important;
|
|
||||||
}
|
|
||||||
|
|
||||||
|
|
||||||
body .ant-input:hover {
|
|
||||||
border-color: #233A82;
|
|
||||||
}
|
|
||||||
body .ant-input-affix-wrapper-focused,
|
|
||||||
body .ant-input-affix-wrapper:focus {
|
|
||||||
border-color:#233A82;
|
|
||||||
box-shadow:0 0 0 2px rgba(35, 58, 130, .2);
|
|
||||||
}
|
|
||||||
body .ant-input-affix-wrapper-status-error:not(.ant-input-affix-wrapper-disabled):not(.ant-input-affix-wrapper-borderless).ant-input-affix-wrapper-focused,
|
|
||||||
body .ant-input-affix-wrapper-status-error:not(.ant-input-affix-wrapper-disabled):not(.ant-input-affix-wrapper-borderless).ant-input-affix-wrapper:focus {
|
|
||||||
box-shadow:0 0 0 2px rgba(35, 58, 130, .2);
|
|
||||||
}
|
|
||||||
body .ant-input-affix-wrapper-status-warning:not(.ant-input-affix-wrapper-disabled):not(.ant-input-affix-wrapper-borderless).ant-input-affix-wrapper-focused,
|
|
||||||
body .ant-input-affix-wrapper-status-warning:not(.ant-input-affix-wrapper-disabled):not(.ant-input-affix-wrapper-borderless).ant-input-affix-wrapper:focus {
|
|
||||||
box-shadow:0 0 0 2px rgba(35, 58, 130, .2);
|
|
||||||
}
|
|
||||||
body .ant-input-search-rtl>.ant-input-group>.ant-input-affix-wrapper-focused,
|
|
||||||
body .ant-input-search-rtl>.ant-input-group>.ant-input-affix-wrapper:hover {
|
|
||||||
border-right-color:#233A82;
|
|
||||||
}
|
|
||||||
body .ant-input-affix-wrapper:not(.ant-input-affix-wrapper-disabled):hover {
|
|
||||||
border-color: #233A82;
|
|
||||||
}
|
|
||||||
|
|
||||||
body .ant-select:not(.ant-select-disabled):hover .ant-select-selector {
|
|
||||||
border-color: #233A82;
|
|
||||||
}
|
|
||||||
body .ant-select-status-error.ant-select:not(.ant-select-disabled):not(.ant-select-customize-input):not(.ant-pagination-size-changer).ant-select-focused .ant-select-selector,
|
|
||||||
body .ant-select-status-error.ant-select:not(.ant-select-disabled):not(.ant-select-customize-input):not(.ant-pagination-size-changer).ant-select-open .ant-select-selector {
|
|
||||||
box-shadow:0 0 0 2px rgba(35, 58, 130, .2);
|
|
||||||
}
|
|
||||||
body .ant-select-status-warning.ant-select:not(.ant-select-disabled):not(.ant-select-customize-input):not(.ant-pagination-size-changer).ant-select-focused .ant-select-selector,
|
|
||||||
body .ant-select-status-warning.ant-select:not(.ant-select-disabled):not(.ant-select-customize-input):not(.ant-pagination-size-changer).ant-select-open .ant-select-selector {
|
|
||||||
box-shadow:0 0 0 2px rgba(35, 58, 130, .2);
|
|
||||||
}
|
|
||||||
body .ant-select-focused:not(.ant-select-disabled).ant-select:not(.ant-select-customize-input) .ant-select-selector {
|
|
||||||
border-color:#233A82;
|
|
||||||
box-shadow:0 0 0 2px rgba(35, 58, 130, .2);
|
|
||||||
}
|
|
||||||
body .ant-input-group-addon .ant-select-focused .ant-select-selector,
|
|
||||||
body .ant-input-group-addon .ant-select-open .ant-select-selector {
|
|
||||||
color:#233A82;
|
|
||||||
}
|
|
||||||
|
|
||||||
body .namediv:hover {
|
|
||||||
color: #233A82;
|
|
||||||
}
|
|
||||||
|
|
||||||
body .ant-select-item-option-selected:not(.ant-select-item-option-disabled) {
|
|
||||||
color: #1d2129;
|
|
||||||
background: #e9ecf4;
|
|
||||||
}
|
|
||||||
body .ant-select-item-option-selected:hover{
|
|
||||||
background: #e9ecf4;
|
|
||||||
}
|
|
||||||
body .ant-select-item-option-selected:not(.ant-select-item-option-disabled) .ant-select-item-option-state {
|
|
||||||
color: #233a82;
|
|
||||||
}
|
|
||||||
|
|
||||||
|
|
||||||
body .ant-input-status-warning:not(.ant-input-disabled):not(.ant-input-borderless).ant-input-focused,
|
|
||||||
body .ant-input-status-warning:not(.ant-input-disabled):not(.ant-input-borderless).ant-input:focus {
|
|
||||||
box-shadow:0 0 0 2px rgba(35, 58, 130, .2);
|
|
||||||
}
|
|
||||||
|
|
||||||
|
|
||||||
body .ant-input-affix-wrapper-focused,
|
|
||||||
body .ant-input-affix-wrapper:focus {
|
|
||||||
border-color:#233a82;
|
|
||||||
box-shadow:0 0 0 2px rgba(35, 58, 130, .2);
|
|
||||||
}
|
|
||||||
body .ant-input-focused,
|
|
||||||
body .ant-input:focus {
|
|
||||||
border-color:#233a82;
|
|
||||||
box-shadow:0 0 0 2px rgba(35, 58, 130, .2);
|
|
||||||
}
|
|
||||||
body .ant-pagination-options-quick-jumper input-focused,
|
|
||||||
body .ant-pagination-options-quick-jumper input:focus {
|
|
||||||
border-color:#233a82;
|
|
||||||
box-shadow:0 0 0 2px rgba(35, 58, 130, .2);
|
|
||||||
}
|
|
||||||
body .ant-pagination-simple .ant-pagination-simple-pager input:focus {
|
|
||||||
border-color:#233a82;
|
|
||||||
box-shadow:0 0 0 2px rgba(35, 58, 130, .2);
|
|
||||||
}
|
|
||||||
|
|
||||||
body .ant-input-status-error:not(.ant-input-disabled):not(.ant-input-borderless).ant-input-focused,
|
|
||||||
body .ant-input-status-error:not(.ant-input-disabled):not(.ant-input-borderless).ant-input:focus {
|
|
||||||
box-shadow:0 0 0 2px rgba(35, 58, 130, .2);
|
|
||||||
}
|
|
||||||
|
|
||||||
body .spandes:hover{
|
|
||||||
color:#233a82;
|
|
||||||
}
|
|
||||||
body .cardstyle:hover .deletestyle:hover {
|
|
||||||
color: #233a82;
|
|
||||||
}
|
|
||||||
|
|
||||||
body .ant-pagination-item-active {
|
|
||||||
border-color: #233a82;
|
|
||||||
}
|
|
||||||
body .ant-pagination-item:hover a {
|
|
||||||
color: #233a82;
|
|
||||||
}
|
|
||||||
body .ant-pagination-item:hover {
|
|
||||||
border-color: #233a82;
|
|
||||||
}
|
|
||||||
body .ant-pagination-next:hover .ant-pagination-item-link,
|
|
||||||
body .ant-pagination-prev:hover .ant-pagination-item-link {
|
|
||||||
color: #233a82;
|
|
||||||
border-color: #233a82;
|
|
||||||
}
|
|
||||||
@ -1,316 +1,259 @@
|
|||||||
import { executeSql } from '@/services/api.ts';
|
import React, { useState, forwardRef, useImperativeHandle, useRef, useEffect } from 'react'
|
||||||
import { Divider } from 'antd';
|
import { FormatMessage, GroupIcon, Icon, SearchSuggest, Slider, NumberInput, Modal } from '../../components'
|
||||||
import numeral from 'numeral';
|
import { SketchPicker } from 'react-color'
|
||||||
import React, { forwardRef, useImperativeHandle, useRef, useState } from 'react';
|
import numeral from 'numeral'
|
||||||
import { SketchPicker } from 'react-color';
|
import { validateNeedSave } from '../../lib/datasource_util'
|
||||||
import { applyMiddleware, legacy_createStore } from 'redux';
|
import { Divider, message } from 'antd'
|
||||||
import { logger } from 'redux-logger';
|
import { executeSql } from '@/services/api.ts'
|
||||||
import thunkMiddleware from 'redux-thunk';
|
import { getAllDataSQLByFilter } from '../../lib/json2code_util'
|
||||||
import {
|
import './style/index.less'
|
||||||
FormatMessage,
|
const GroupIconGroup = GroupIcon.GroupIconGroup
|
||||||
GroupIcon,
|
|
||||||
Icon,
|
export default React.memo(forwardRef(({ currentPrefix, close, iconClick, colorChange, openModal, templateType,
|
||||||
Modal,
|
activeTab, resize, sliderChange, dataSource,
|
||||||
NumberInput,
|
jumpPosition, jumpDetail }, ref) => {
|
||||||
SearchSuggest,
|
const dbConn = dataSource?.dbConn || []
|
||||||
Slider,
|
const properties = dbConn[0]?.properties
|
||||||
} from '../../components';
|
const [isCellSelected, setIsCellSelected] = useState(false)
|
||||||
import { validateNeedSave } from '../../lib/datasource_util';
|
const [scaleNumber, setScaleNumber] = useState(1)
|
||||||
import { getAllDataSQLByFilter } from '../../lib/json2code_util';
|
const [colorState, setColor] = useState({
|
||||||
import reducers from '../../reducers';
|
fontColor: 'rgba(0, 0, 0, 0.65)',
|
||||||
import './style/index.less';
|
fillColor: '#ACDAFC',
|
||||||
const GroupIconGroup = GroupIcon.GroupIconGroup;
|
})
|
||||||
export default React.memo(
|
useImperativeHandle(ref, () => {
|
||||||
forwardRef(
|
return {
|
||||||
(
|
setScaleNumber,
|
||||||
{
|
setIsCellSelected,
|
||||||
currentPrefix,
|
}
|
||||||
close,
|
}, [])
|
||||||
iconClick,
|
const _colorChange = (key, value) => {
|
||||||
colorChange,
|
setColor((pre) => {
|
||||||
openModal,
|
return {
|
||||||
templateType,
|
...pre,
|
||||||
activeTab,
|
[key]: value.hex,
|
||||||
resize,
|
}
|
||||||
sliderChange,
|
})
|
||||||
dataSource,
|
colorChange && colorChange(key, value)
|
||||||
jumpPosition,
|
}
|
||||||
jumpDetail,
|
const _close = () => {
|
||||||
},
|
if (validateNeedSave(dataSource)) {
|
||||||
ref,
|
Modal.confirm({
|
||||||
) => {
|
title: FormatMessage.string({ id: 'closeConfirmTitle' }),
|
||||||
const dbConn = dataSource?.dbConn || [];
|
message: FormatMessage.string({ id: 'closeConfirm' }),
|
||||||
const properties = dbConn[0]?.properties;
|
onOk: () => {
|
||||||
const [isCellSelected, setIsCellSelected] = useState(false);
|
close()
|
||||||
const [scaleNumber, setScaleNumber] = useState(1);
|
|
||||||
const [colorState, setColor] = useState({
|
|
||||||
fontColor: 'rgba(0, 0, 0, 0.65)',
|
|
||||||
fillColor: '#ACDAFC',
|
|
||||||
});
|
|
||||||
useImperativeHandle(
|
|
||||||
ref,
|
|
||||||
() => {
|
|
||||||
return {
|
|
||||||
setScaleNumber,
|
|
||||||
setIsCellSelected,
|
|
||||||
};
|
|
||||||
},
|
},
|
||||||
[],
|
})
|
||||||
);
|
} else {
|
||||||
const _colorChange = (key, value) => {
|
close()
|
||||||
setColor((pre) => {
|
}
|
||||||
return {
|
}
|
||||||
...pre,
|
const defaultTemplate = ['createTable', 'createIndex', 'content']
|
||||||
[key]: value.hex,
|
const templateRef = useRef(defaultTemplate)
|
||||||
};
|
const dataTypeSupports = _.get(dataSource, 'profile.dataTypeSupports', [])
|
||||||
});
|
const defaultDb = _.get(dataSource, 'profile.default.db', dataTypeSupports[0]?.id)
|
||||||
colorChange && colorChange(key, value);
|
const [codeData, setCodeData] = useState(() => {
|
||||||
};
|
return getAllDataSQLByFilter(dataSource,
|
||||||
const _close = () => {
|
templateType === 'dict' ? 'dictSQLTemplate' : defaultDb, templateRef.current)
|
||||||
if (validateNeedSave(dataSource)) {
|
})
|
||||||
Modal.confirm({
|
|
||||||
title: FormatMessage.string({ id: 'closeConfirmTitle' }),
|
|
||||||
message: FormatMessage.string({ id: 'closeConfirm' }),
|
|
||||||
onOk: () => {
|
|
||||||
close();
|
|
||||||
},
|
|
||||||
});
|
|
||||||
} else {
|
|
||||||
close();
|
|
||||||
}
|
|
||||||
};
|
|
||||||
const defaultTemplate = ['createTable', 'createIndex', 'content'];
|
|
||||||
const templateRef = useRef(defaultTemplate);
|
|
||||||
const dataTypeSupports = _.get(dataSource, 'profile.dataTypeSupports', []);
|
|
||||||
const defaultDb = _.get(dataSource, 'profile.default.db', dataTypeSupports[0]?.id);
|
|
||||||
const [codeData, setCodeData] = useState(() => {
|
|
||||||
return getAllDataSQLByFilter(
|
|
||||||
dataSource,
|
|
||||||
templateType === 'dict' ? 'dictSQLTemplate' : defaultDb,
|
|
||||||
templateRef.current,
|
|
||||||
);
|
|
||||||
});
|
|
||||||
|
|
||||||
const backGroup = async () => {
|
const backGroup = async () => {
|
||||||
if (!properties) {
|
if (!properties) {
|
||||||
Modal.error({
|
Modal.error({
|
||||||
title: FormatMessage.string({ id: 'dbConnect.connectError' }),
|
title: FormatMessage.string({ id: 'dbConnect.connectError' }),
|
||||||
message: '请连接数据库',
|
message: '请连接数据库',
|
||||||
});
|
})
|
||||||
} else {
|
} else {
|
||||||
const data = {
|
const data = {
|
||||||
driverName: properties.driver_class_name,
|
driverName: properties.driver_class_name,
|
||||||
url: properties.url,
|
url: properties.url,
|
||||||
username: properties.username,
|
username: properties.username,
|
||||||
password: properties.password,
|
password: properties.password,
|
||||||
sql: codeData,
|
sql: codeData
|
||||||
};
|
}
|
||||||
const res = await executeSql(data);
|
const res = await executeSql(data)
|
||||||
if (res.code == 200) {
|
if (res.code == 200) {
|
||||||
Modal.success({
|
Modal.success({
|
||||||
title: FormatMessage.string({ id: 'dbConnect.connectSuccess' }),
|
title: FormatMessage.string({ id: 'dbConnect.connectSuccess' }),
|
||||||
message: `${res.msg}`,
|
message: `${res.msg}`,
|
||||||
});
|
})
|
||||||
} else {
|
} else {
|
||||||
Modal.error({
|
Modal.error({
|
||||||
bodyStyle: { width: '50%' },
|
bodyStyle: { width: '50%' },
|
||||||
contentStyle: { width: '100%', height: '100%' },
|
contentStyle: { width: '100%', height: '100%' },
|
||||||
title: FormatMessage.string({ id: 'dbConnect.connectError' }),
|
title: FormatMessage.string({ id: 'dbConnect.connectError' }),
|
||||||
message: `${res.msg}`,
|
message: `${res.msg}`
|
||||||
});
|
})
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
};
|
|
||||||
const [issee, setIssee] = useState(false);
|
|
||||||
const [isfill, setIsfill] = useState(false);
|
|
||||||
const fill = () => {
|
|
||||||
setIsfill(!isfill);
|
|
||||||
setIssee(false);
|
|
||||||
};
|
|
||||||
const see = () => {
|
|
||||||
setIsfill(false);
|
|
||||||
setIssee(!issee);
|
|
||||||
};
|
|
||||||
const handleExportSqlDict = () => {
|
|
||||||
const store = legacy_createStore(reducers, applyMiddleware(thunkMiddleware, logger));
|
|
||||||
console.log(dataSource);
|
|
||||||
};
|
|
||||||
|
|
||||||
return (
|
}
|
||||||
<div className={`${currentPrefix}-head`}>
|
const [issee, setIssee] = useState(false)
|
||||||
<div className={`${currentPrefix}-head-logo`}>
|
const [isfill, setIsfill] = useState(false)
|
||||||
<div className={`${currentPrefix}-head-logo-opt`}>
|
const fill = () => {
|
||||||
<span>
|
setIsfill(!isfill)
|
||||||
<Icon type="fa-angle-left" onClick={_close} />
|
setIssee(false)
|
||||||
</span>
|
}
|
||||||
<div>
|
const see = () => {
|
||||||
<span>{dataSource.name}</span>
|
setIsfill(false)
|
||||||
<span>{dataSource.describe}</span>
|
setIssee(!issee)
|
||||||
|
}
|
||||||
|
|
||||||
|
return (
|
||||||
|
<div className={`${currentPrefix}-head`}>
|
||||||
|
<div className={`${currentPrefix}-head-logo`}>
|
||||||
|
<div className={`${currentPrefix}-head-logo-opt`}>
|
||||||
|
<span>
|
||||||
|
<Icon type="fa-angle-left" onClick={_close} />
|
||||||
|
</span>
|
||||||
|
<div>
|
||||||
|
<span>{dataSource.name}</span>
|
||||||
|
<span>{dataSource.describe}</span>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<Divider className='divider' />
|
||||||
|
<div className={`${currentPrefix}-iconstyle`}>
|
||||||
|
<GroupIconGroup>
|
||||||
|
<GroupIcon
|
||||||
|
className={`${currentPrefix}-icongroup`}
|
||||||
|
hoverTitle={FormatMessage.string({ id: 'toolbar.save' })}
|
||||||
|
dropType="icon"
|
||||||
|
groupKey="save"
|
||||||
|
icon="icon-bianzu2"
|
||||||
|
onClick={iconClick}
|
||||||
|
|
||||||
|
/>
|
||||||
|
<GroupIcon
|
||||||
|
className={`${currentPrefix}-icongroup`}
|
||||||
|
hoverTitle={FormatMessage.string({ id: 'toolbar.refresh' })}
|
||||||
|
onClick={() => iconClick(null, 'refresh')}
|
||||||
|
icon="fa-refresh"
|
||||||
|
/>
|
||||||
|
<GroupIcon
|
||||||
|
className={`${currentPrefix}-icongroup`}
|
||||||
|
hoverTitle={FormatMessage.string({ id: 'toolbar.undo' })}
|
||||||
|
onClick={() => iconClick(null, 'undo')}
|
||||||
|
icon="icon-bianzu4"
|
||||||
|
disable={activeTab?.type !== 'diagram'}
|
||||||
|
/>
|
||||||
|
<GroupIcon
|
||||||
|
className={`${currentPrefix}-icongroup`}
|
||||||
|
onClick={() => iconClick(null, 'redo')}
|
||||||
|
hoverTitle={FormatMessage.string({ id: 'toolbar.redo' })}
|
||||||
|
icon="icon-bianzu3"
|
||||||
|
disable={activeTab?.type !== 'diagram'}
|
||||||
|
/>
|
||||||
|
</GroupIconGroup>
|
||||||
|
<GroupIconGroup>
|
||||||
|
<GroupIcon
|
||||||
|
className={`${currentPrefix}-icongroup`}
|
||||||
|
hoverTitle={FormatMessage.string({ id: 'toolbar.emptyEntity' })}
|
||||||
|
icon="icon-kongbiao"
|
||||||
|
disable={activeTab?.type !== 'diagram'}
|
||||||
|
//style={{cursor: 'move'}}
|
||||||
|
onClick={iconClick}
|
||||||
|
groupKey="empty"
|
||||||
|
//onMouseDown={e => iconClick(e, 'empty')}
|
||||||
|
/>
|
||||||
|
<GroupIcon
|
||||||
|
className={`${currentPrefix}-icongroup`}
|
||||||
|
hoverTitle={FormatMessage.string({ id: 'toolbar.group' })}
|
||||||
|
icon="fa-object-group"
|
||||||
|
//style={{cursor: 'move'}}
|
||||||
|
onClick={iconClick}
|
||||||
|
groupKey="group"
|
||||||
|
disable={activeTab?.type !== 'diagram'}
|
||||||
|
//onMouseDown={e => iconClick(e, 'group')}
|
||||||
|
/>
|
||||||
|
<GroupIcon
|
||||||
|
className={`${currentPrefix}-icongroup`}
|
||||||
|
topStyle={{ height: '24px' }}
|
||||||
|
dropType="icon"
|
||||||
|
groupKey="rect"
|
||||||
|
disable={activeTab?.type !== 'diagram'}
|
||||||
|
hoverTitle={FormatMessage.string({ id: 'toolbar.rect' })}
|
||||||
|
icon="fa-square-o"
|
||||||
|
onClick={iconClick}
|
||||||
|
dropMenu={[
|
||||||
|
{ key: 'round', name: FormatMessage.string({ id: 'toolbar.round' }) },
|
||||||
|
{ key: 'circle', name: FormatMessage.string({ id: 'toolbar.circle' }) },
|
||||||
|
]}
|
||||||
|
/>
|
||||||
|
<GroupIcon
|
||||||
|
className={`${currentPrefix}-icongroup`}
|
||||||
|
hoverTitle={FormatMessage.string({ id: 'toolbar.polygon' })}
|
||||||
|
//style={{cursor: 'move'}}
|
||||||
|
icon={
|
||||||
|
<div className={`${currentPrefix}-head-rect`}>
|
||||||
|
<span>{ }</span>
|
||||||
</div>
|
</div>
|
||||||
|
}
|
||||||
|
groupKey="polygon"
|
||||||
|
onClick={iconClick}
|
||||||
|
disable={activeTab?.type !== 'diagram'}
|
||||||
|
//onMouseDown={e => iconClick(e, 'polygon')}
|
||||||
|
/>
|
||||||
|
|
||||||
|
<div className='fontColor1'>
|
||||||
|
<Icon type="icon-zitiyanse" onClick={see}
|
||||||
|
disable={activeTab?.type !== 'diagram' || !isCellSelected} title="字体颜色" />
|
||||||
|
{/* display: issee ? 'block' : 'none' */}
|
||||||
|
<div style={{ display: activeTab?.type == 'diagram' && issee && isCellSelected ? 'block' : 'none' }} className='fontColor2' >
|
||||||
|
<SketchPicker
|
||||||
|
disableAlpha
|
||||||
|
presetColors={[
|
||||||
|
'#FFFFFF',
|
||||||
|
'#BFBFBF',
|
||||||
|
'#C00000',
|
||||||
|
'#FFC000',
|
||||||
|
'#F6941D',
|
||||||
|
'#7030A0',
|
||||||
|
'#136534',
|
||||||
|
'#0070C0',
|
||||||
|
'#0D0D0D',
|
||||||
|
'#6698CC',
|
||||||
|
'#FA5A5A',
|
||||||
|
'#FFD966',
|
||||||
|
'#F8CBAD',
|
||||||
|
'#CB99C5',
|
||||||
|
'#9ACC98',
|
||||||
|
'#093299',
|
||||||
|
]}
|
||||||
|
color={colorState.fontColor}
|
||||||
|
onChange={(color) => _colorChange('fontColor', color)}
|
||||||
|
/>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
<Divider className="divider" />
|
<div className='fontColor1'>
|
||||||
<div className={`${currentPrefix}-iconstyle`}>
|
<Icon type="icon-tianchongyanse" onClick={fill} disable={activeTab?.type !== 'diagram' || !isCellSelected} title="填充颜色" />
|
||||||
<GroupIconGroup>
|
<div style={{ display: activeTab?.type == 'diagram' && isfill && isCellSelected ? 'block' : 'none' }} className='fontColor2' >
|
||||||
<GroupIcon
|
<SketchPicker
|
||||||
className={`${currentPrefix}-icongroup`}
|
disableAlpha
|
||||||
hoverTitle={FormatMessage.string({ id: 'toolbar.save' })}
|
presetColors={[
|
||||||
dropType="icon"
|
'#FFFFFF',
|
||||||
groupKey="save"
|
'#BFBFBF',
|
||||||
icon="icon-bianzu2"
|
'#C00000',
|
||||||
onClick={iconClick}
|
'#FFC000',
|
||||||
/>
|
'#F6941D',
|
||||||
<GroupIcon
|
'#7030A0',
|
||||||
className={`${currentPrefix}-icongroup`}
|
'#136534',
|
||||||
hoverTitle={FormatMessage.string({ id: 'toolbar.refresh' })}
|
'#0070C0',
|
||||||
onClick={() => iconClick(null, 'refresh')}
|
'#0D0D0D',
|
||||||
icon="fa-refresh"
|
'#6698CC',
|
||||||
/>
|
'#FA5A5A',
|
||||||
<GroupIcon
|
'#FFD966',
|
||||||
className={`${currentPrefix}-icongroup`}
|
'#F8CBAD',
|
||||||
hoverTitle={FormatMessage.string({ id: 'toolbar.undo' })}
|
'#CB99C5',
|
||||||
onClick={() => iconClick(null, 'undo')}
|
'#9ACC98',
|
||||||
icon="icon-bianzu4"
|
'#093299',
|
||||||
disable={activeTab?.type !== 'diagram'}
|
|
||||||
/>
|
|
||||||
<GroupIcon
|
|
||||||
className={`${currentPrefix}-icongroup`}
|
|
||||||
onClick={() => iconClick(null, 'redo')}
|
|
||||||
hoverTitle={FormatMessage.string({ id: 'toolbar.redo' })}
|
|
||||||
icon="icon-bianzu3"
|
|
||||||
disable={activeTab?.type !== 'diagram'}
|
|
||||||
/>
|
|
||||||
</GroupIconGroup>
|
|
||||||
<GroupIconGroup>
|
|
||||||
<GroupIcon
|
|
||||||
className={`${currentPrefix}-icongroup`}
|
|
||||||
hoverTitle={FormatMessage.string({ id: 'toolbar.emptyEntity' })}
|
|
||||||
icon="icon-kongbiao"
|
|
||||||
disable={activeTab?.type !== 'diagram'}
|
|
||||||
//style={{cursor: 'move'}}
|
|
||||||
onClick={iconClick}
|
|
||||||
groupKey="empty"
|
|
||||||
//onMouseDown={e => iconClick(e, 'empty')}
|
|
||||||
/>
|
|
||||||
<GroupIcon
|
|
||||||
className={`${currentPrefix}-icongroup`}
|
|
||||||
hoverTitle={FormatMessage.string({ id: 'toolbar.group' })}
|
|
||||||
icon="fa-object-group"
|
|
||||||
//style={{cursor: 'move'}}
|
|
||||||
onClick={iconClick}
|
|
||||||
groupKey="group"
|
|
||||||
disable={activeTab?.type !== 'diagram'}
|
|
||||||
//onMouseDown={e => iconClick(e, 'group')}
|
|
||||||
/>
|
|
||||||
<GroupIcon
|
|
||||||
className={`${currentPrefix}-icongroup`}
|
|
||||||
topStyle={{ height: '24px' }}
|
|
||||||
dropType="icon"
|
|
||||||
groupKey="rect"
|
|
||||||
disable={activeTab?.type !== 'diagram'}
|
|
||||||
hoverTitle={FormatMessage.string({ id: 'toolbar.rect' })}
|
|
||||||
icon="fa-square-o"
|
|
||||||
onClick={iconClick}
|
|
||||||
dropMenu={[
|
|
||||||
{ key: 'round', name: FormatMessage.string({ id: 'toolbar.round' }) },
|
|
||||||
{ key: 'circle', name: FormatMessage.string({ id: 'toolbar.circle' }) },
|
|
||||||
]}
|
]}
|
||||||
|
color={colorState.fillColor}
|
||||||
|
onChange={(color) => _colorChange('fillColor', color)}
|
||||||
/>
|
/>
|
||||||
<GroupIcon
|
</div>
|
||||||
className={`${currentPrefix}-icongroup`}
|
</div>
|
||||||
hoverTitle={FormatMessage.string({ id: 'toolbar.polygon' })}
|
{/* <GroupIcon
|
||||||
//style={{cursor: 'move'}}
|
|
||||||
icon={
|
|
||||||
<div className={`${currentPrefix}-head-rect`}>
|
|
||||||
<span>{}</span>
|
|
||||||
</div>
|
|
||||||
}
|
|
||||||
groupKey="polygon"
|
|
||||||
onClick={iconClick}
|
|
||||||
disable={activeTab?.type !== 'diagram'}
|
|
||||||
//onMouseDown={e => iconClick(e, 'polygon')}
|
|
||||||
/>
|
|
||||||
|
|
||||||
<div className="fontColor1">
|
|
||||||
<Icon
|
|
||||||
type="icon-zitiyanse"
|
|
||||||
onClick={see}
|
|
||||||
disable={activeTab?.type !== 'diagram' || !isCellSelected}
|
|
||||||
title="字体颜色"
|
|
||||||
/>
|
|
||||||
{/* display: issee ? 'block' : 'none' */}
|
|
||||||
<div
|
|
||||||
style={{
|
|
||||||
display:
|
|
||||||
activeTab?.type == 'diagram' && issee && isCellSelected ? 'block' : 'none',
|
|
||||||
}}
|
|
||||||
className="fontColor2"
|
|
||||||
>
|
|
||||||
<SketchPicker
|
|
||||||
disableAlpha
|
|
||||||
presetColors={[
|
|
||||||
'#FFFFFF',
|
|
||||||
'#BFBFBF',
|
|
||||||
'#C00000',
|
|
||||||
'#FFC000',
|
|
||||||
'#F6941D',
|
|
||||||
'#7030A0',
|
|
||||||
'#136534',
|
|
||||||
'#0070C0',
|
|
||||||
'#0D0D0D',
|
|
||||||
'#6698CC',
|
|
||||||
'#FA5A5A',
|
|
||||||
'#FFD966',
|
|
||||||
'#F8CBAD',
|
|
||||||
'#CB99C5',
|
|
||||||
'#9ACC98',
|
|
||||||
'#093299',
|
|
||||||
]}
|
|
||||||
color={colorState.fontColor}
|
|
||||||
onChange={(color) => _colorChange('fontColor', color)}
|
|
||||||
/>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
<div className="fontColor1">
|
|
||||||
<Icon
|
|
||||||
type="icon-tianchongyanse"
|
|
||||||
onClick={fill}
|
|
||||||
disable={activeTab?.type !== 'diagram' || !isCellSelected}
|
|
||||||
title="填充颜色"
|
|
||||||
/>
|
|
||||||
<div
|
|
||||||
style={{
|
|
||||||
display:
|
|
||||||
activeTab?.type == 'diagram' && isfill && isCellSelected ? 'block' : 'none',
|
|
||||||
}}
|
|
||||||
className="fontColor2"
|
|
||||||
>
|
|
||||||
<SketchPicker
|
|
||||||
disableAlpha
|
|
||||||
presetColors={[
|
|
||||||
'#FFFFFF',
|
|
||||||
'#BFBFBF',
|
|
||||||
'#C00000',
|
|
||||||
'#FFC000',
|
|
||||||
'#F6941D',
|
|
||||||
'#7030A0',
|
|
||||||
'#136534',
|
|
||||||
'#0070C0',
|
|
||||||
'#0D0D0D',
|
|
||||||
'#6698CC',
|
|
||||||
'#FA5A5A',
|
|
||||||
'#FFD966',
|
|
||||||
'#F8CBAD',
|
|
||||||
'#CB99C5',
|
|
||||||
'#9ACC98',
|
|
||||||
'#093299',
|
|
||||||
]}
|
|
||||||
color={colorState.fillColor}
|
|
||||||
onChange={(color) => _colorChange('fillColor', color)}
|
|
||||||
/>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
{/* <GroupIcon
|
|
||||||
className={`${currentPrefix}-icongroup`}
|
className={`${currentPrefix}-icongroup`}
|
||||||
hoverTitle={FormatMessage.string({ id: 'toolbar.fontColor' })}
|
hoverTitle={FormatMessage.string({ id: 'toolbar.fontColor' })}
|
||||||
icon={
|
icon={
|
||||||
@ -351,7 +294,7 @@ export default React.memo(
|
|||||||
}
|
}
|
||||||
disable={activeTab?.type !== 'diagram' || !isCellSelected}
|
disable={activeTab?.type !== 'diagram' || !isCellSelected}
|
||||||
/> */}
|
/> */}
|
||||||
{/* <GroupIcon
|
{/* <GroupIcon
|
||||||
className={`${currentPrefix}-icongroup`}
|
className={`${currentPrefix}-icongroup`}
|
||||||
hoverTitle={FormatMessage.string({ id: 'toolbar.fillColor' })}
|
hoverTitle={FormatMessage.string({ id: 'toolbar.fillColor' })}
|
||||||
icon="icon-tianchongyanse"
|
icon="icon-tianchongyanse"
|
||||||
@ -386,43 +329,43 @@ export default React.memo(
|
|||||||
}
|
}
|
||||||
disable={activeTab?.type !== 'diagram' || !isCellSelected}
|
disable={activeTab?.type !== 'diagram' || !isCellSelected}
|
||||||
/> */}
|
/> */}
|
||||||
</GroupIconGroup>
|
</GroupIconGroup>
|
||||||
<GroupIconGroup>
|
<GroupIconGroup>
|
||||||
<GroupIcon
|
<GroupIcon
|
||||||
className={`${currentPrefix}-icongroup`}
|
className={`${currentPrefix}-icongroup`}
|
||||||
disable={activeTab?.type !== 'diagram'}
|
disable={activeTab?.type !== 'diagram'}
|
||||||
hoverTitle={FormatMessage.string({ id: 'toolbar.scale' })}
|
hoverTitle={FormatMessage.string({ id: 'toolbar.scale' })}
|
||||||
icon={
|
icon={
|
||||||
<>
|
<>
|
||||||
<span
|
<span
|
||||||
className={`${currentPrefix}-head-scale
|
className={`${currentPrefix}-head-scale
|
||||||
${currentPrefix}-head-scale-${activeTab?.type !== 'diagram' ? 'disable' : 'normal'}`}
|
${currentPrefix}-head-scale-${activeTab?.type !== 'diagram' ? 'disable' : 'normal'}`}
|
||||||
>
|
>
|
||||||
<Icon type="fa-minus" onClick={() => resize(-0.1)} />
|
<Icon type="fa-minus" onClick={() => resize(-0.1)} />
|
||||||
<span>
|
<span>
|
||||||
<NumberInput
|
<NumberInput
|
||||||
readOnly={activeTab?.type !== 'diagram'}
|
readOnly={activeTab?.type !== 'diagram'}
|
||||||
onBlur={(e) => sliderChange(numeral(e.target.value).divide(2).value())}
|
onBlur={(e) => sliderChange(numeral(e.target.value).divide(2).value())}
|
||||||
min={0}
|
min={0}
|
||||||
max={200}
|
max={200}
|
||||||
value={parseInt(numeral(scaleNumber).multiply(100).value(), 10)}
|
value={parseInt(numeral(scaleNumber).multiply(100).value(), 10)}
|
||||||
formatter={(value) => `${value}%`}
|
formatter={(value) => `${value}%`}
|
||||||
parser={(value) => value.replace('%', '')}
|
parser={(value) => value.replace('%', '')}
|
||||||
/>
|
/>
|
||||||
</span>
|
</span>
|
||||||
<Icon type="fa-plus " onClick={() => resize(0.1)} />
|
<Icon type="fa-plus " onClick={() => resize(0.1)} />
|
||||||
</span>
|
</span>
|
||||||
<div>
|
<div>
|
||||||
<Slider
|
<Slider
|
||||||
disable={activeTab?.type !== 'diagram'}
|
disable={activeTab?.type !== 'diagram'}
|
||||||
onChange={sliderChange}
|
onChange={sliderChange}
|
||||||
value={numeral(scaleNumber).multiply(50).value()}
|
value={numeral(scaleNumber).multiply(50).value()}
|
||||||
/>
|
/>
|
||||||
</div>
|
</div>
|
||||||
</>
|
</>
|
||||||
}
|
}
|
||||||
/>
|
/>
|
||||||
{/* <GroupIcon
|
{/* <GroupIcon
|
||||||
className={`${currentPrefix}-icongroup`}
|
className={`${currentPrefix}-icongroup`}
|
||||||
hoverTitle={FormatMessage.string({ id: 'toolbar.import' })}
|
hoverTitle={FormatMessage.string({ id: 'toolbar.import' })}
|
||||||
onClick={iconClick}
|
onClick={iconClick}
|
||||||
@ -479,42 +422,34 @@ export default React.memo(
|
|||||||
},
|
},
|
||||||
]}
|
]}
|
||||||
/> */}
|
/> */}
|
||||||
{/* <GroupIcon
|
{/* <GroupIcon
|
||||||
className={`${currentPrefix}-icongroup`}
|
className={`${currentPrefix}-icongroup`}
|
||||||
hoverTitle={FormatMessage.string({ id: 'toolbar.setting' })}
|
hoverTitle={FormatMessage.string({ id: 'toolbar.setting' })}
|
||||||
icon="icon-shezhi"
|
icon="icon-shezhi"
|
||||||
onClick={() => openModal('config')}
|
onClick={() => openModal('config')}
|
||||||
/> */}
|
/> */}
|
||||||
<GroupIcon
|
<GroupIcon
|
||||||
className={`${currentPrefix}-icongroup`}
|
className={`${currentPrefix}-icongroup`}
|
||||||
hoverTitle={FormatMessage.string({ id: 'toolbar.dbConnectTest' })}
|
hoverTitle={FormatMessage.string({ id: 'toolbar.dbConnectTest' })}
|
||||||
icon="fa-database"
|
icon="fa-database"
|
||||||
onClick={() => openModal('dbConnect')}
|
onClick={() => openModal('dbConnect')}
|
||||||
/>
|
/>
|
||||||
<GroupIcon
|
<GroupIcon
|
||||||
className={`${currentPrefix}-icongroup`}
|
className={`${currentPrefix}-icongroup`}
|
||||||
hoverTitle={FormatMessage.string({ id: 'toolbar.go' })}
|
hoverTitle={FormatMessage.string({ id: 'toolbar.go' })}
|
||||||
icon="fa-toggle-right"
|
icon="fa-toggle-right"
|
||||||
onClick={backGroup}
|
onClick={backGroup}
|
||||||
/>
|
/>
|
||||||
<GroupIcon
|
</GroupIconGroup>
|
||||||
className={`${currentPrefix}-icongroup`}
|
<div className={`${currentPrefix}-head-search`}>
|
||||||
onClick={() => handleExportSqlDict()}
|
<SearchSuggest
|
||||||
hoverTitle={FormatMessage.string({ id: 'toolbar.export' })}
|
jumpPosition={jumpPosition}
|
||||||
icon={<Icon type="icon-daochu" />}
|
jumpDetail={jumpDetail}
|
||||||
/>
|
placeholder={FormatMessage.string({ id: 'toolbar.search' })}
|
||||||
</GroupIconGroup>
|
dataSource={dataSource}
|
||||||
<div className={`${currentPrefix}-head-search`}>
|
/>
|
||||||
<SearchSuggest
|
|
||||||
jumpPosition={jumpPosition}
|
|
||||||
jumpDetail={jumpDetail}
|
|
||||||
placeholder={FormatMessage.string({ id: 'toolbar.search' })}
|
|
||||||
dataSource={dataSource}
|
|
||||||
/>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
</div>
|
||||||
);
|
</div>
|
||||||
},
|
</div>
|
||||||
),
|
)
|
||||||
);
|
}))
|
||||||
|
|||||||
Loading…
x
Reference in New Issue
Block a user