Commit 8d36ad93 authored by linli's avatar linli
Browse files

input-search-table组件

parents
/yarn.lock
/package-lock.json
/dist
/node_modules
/pages
.umi
.umi-production
**/*.md
**/*.svg
**/*.ejs
**/*.html
package.json
.umi
.umi-production
{
"singleQuote": true,
"trailingComma": "all",
"printWidth": 100,
"overrides": [
{
"files": ".prettierrc",
"options": { "parser": "json" }
}
]
}
export default {
plugins: [
[
'umi-plugin-block-dev',
{
layout: 'ant-design-pro',
},
],
[
'umi-plugin-react',
{
antd: true,
dva: true,
locale: true,
},
],
],
};
The MIT License (MIT)
Copyright (c) 2019-present wangkai ()
Permission is hereby granted, free of charge, to any person obtaining a copy
of this software and associated documentation files (the "Software"), to deal
in the Software without restriction, including without limitation the rights
to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
copies of the Software, and to permit persons to whom the Software is
furnished to do so, subject to the following conditions:
The above copyright notice and this permission notice shall be included in
all copies or substantial portions of the Software.
THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN
THE SOFTWARE.
# @umi-blocks/tree-table
左侧为树结构,右侧为树节点对应table,默认显示为所以table数据,左右联动。
## Usage
```sh
umi block add https://gitlab.rd.virsical.cn/wangkai/tree-table.git --path=/[The directory you placed]
```
## SNAPSHOT
![avatar](/snapshot.png)
## LICENSE
MIT
{
"name": "@umi-block/tree-form",
"version": "0.0.1",
"description": "left tree.right form.",
"main": "src/index.js",
"authors": {
"name": "wangkai",
"email": ""
},
"repository": "umijs/umi-blocks/tree-form",
"scripts": {
"dev": "umi dev"
},
"dependencies": {
"antd": "^3.24.0",
"dva": "^2.4.1",
"moment-timezone": "^0.5.27",
"react": ">=16.0.0",
"umi-plugin-react": "^1.12.6",
"umi-request": "^1.2.8"
},
"devDependencies": {
"@ant-design/pro-layout": "^4.5.16",
"umi": "^2.9.0",
"umi-plugin-block-dev": "^2.0.0"
},
"license": "MIT"
}
import React from 'react';
import {
_setIntlObject,
addLocaleData,
IntlProvider,
intlShape,
LangContext,
_setLocaleContext
} from 'umi-plugin-locale';
const InjectedWrapper = (() => {
let sfc = (props, context) => {
_setIntlObject(context.intl);
return props.children;
};
sfc.contextTypes = {
intl: intlShape,
};
return sfc;
})();
import 'moment/locale/zh-cn';
import 'moment/locale/zh-tw';
const baseNavigator = true;
const baseSeparator = '-';
const useLocalStorage = true;
import { LocaleProvider, version } from 'antd';
import moment from 'moment';
import 'moment/locale/zh-cn';
let defaultAntd = require('antd/lib/locale-provider/zh_CN');
defaultAntd = defaultAntd.default || defaultAntd;
const localeInfo = {
'en-US': {
messages: {
...((locale) => locale.__esModule ? locale.default : locale)(require('E:/work/input-search-table/src/locales/en-US.js')),
},
locale: 'en-US',
antd: require('antd/lib/locale-provider/en_US'),
data: require('react-intl/locale-data/en'),
momentLocale: '',
},
'zh-CN': {
messages: {
...((locale) => locale.__esModule ? locale.default : locale)(require('E:/work/input-search-table/src/locales/zh-CN.js')),
},
locale: 'zh-CN',
antd: require('antd/lib/locale-provider/zh_CN'),
data: require('react-intl/locale-data/zh'),
momentLocale: 'zh-cn',
},
'zh-TW': {
messages: {
...((locale) => locale.__esModule ? locale.default : locale)(require('E:/work/input-search-table/src/locales/zh-TW.js')),
},
locale: 'zh-TW',
antd: require('antd/lib/locale-provider/zh_TW'),
data: require('react-intl/locale-data/zh'),
momentLocale: 'zh-tw',
},
};
class LocaleWrapper extends React.Component{
state = {
locale: 'zh-CN',
};
getAppLocale(){
let appLocale = {
locale: 'zh-CN',
messages: {},
data: require('react-intl/locale-data/zh'),
momentLocale: 'zh-cn',
};
const runtimeLocale = require('umi/_runtimePlugin').mergeConfig('locale') || {};
const runtimeLocaleDefault = typeof runtimeLocale.default === 'function' ? runtimeLocale.default() : runtimeLocale.default;
if (
useLocalStorage
&& typeof localStorage !== 'undefined'
&& localStorage.getItem('umi_locale')
&& localeInfo[localStorage.getItem('umi_locale')]
) {
appLocale = localeInfo[localStorage.getItem('umi_locale')];
} else if (
typeof navigator !== 'undefined'
&& localeInfo[navigator.language]
&& baseNavigator
) {
appLocale = localeInfo[navigator.language];
} else if(localeInfo[runtimeLocaleDefault]){
appLocale = localeInfo[runtimeLocaleDefault];
} else {
appLocale = localeInfo['zh-CN'] || appLocale;
}
window.g_lang = appLocale.locale;
window.g_langSeparator = baseSeparator || '-';
appLocale.data && addLocaleData(appLocale.data);
// support dynamic add messages for umi ui
// { 'zh-CN': { key: value }, 'en-US': { key: value } }
const runtimeLocaleMessagesType = typeof runtimeLocale.messages;
if (runtimeLocaleMessagesType === 'object' || runtimeLocaleMessagesType === 'function') {
const runtimeMessage = runtimeLocaleMessagesType === 'object'
? runtimeLocale.messages[appLocale.locale]
: runtimeLocale.messages()[appLocale.locale];
Object.assign(appLocale.messages, runtimeMessage || {});
}
return appLocale;
}
reloadAppLocale = () => {
const appLocale = this.getAppLocale();
this.setState({
locale: appLocale.locale,
});
};
render(){
const appLocale = this.getAppLocale();
// react-intl must use `-` separator
const reactIntlLocale = appLocale.locale.split(baseSeparator).join('-');
const LangContextValue = {
locale: reactIntlLocale,
reloadAppLocale: this.reloadAppLocale,
};
let ret = this.props.children;
ret = (<IntlProvider locale={reactIntlLocale} messages={appLocale.messages}>
<InjectedWrapper>
<LangContext.Provider value={LangContextValue}>
<LangContext.Consumer>{(value) => {
_setLocaleContext(value);
return this.props.children
}}</LangContext.Consumer>
</LangContext.Provider>
</InjectedWrapper>
</IntlProvider>)
// avoid antd ConfigProvider not found
let AntdProvider = LocaleProvider;
const [major, minor] = `${version || ''}`.split('.');
// antd 3.21.0 use ConfigProvider not LocaleProvider
const isConfigProvider = Number(major) > 3 || (Number(major) >= 3 && Number(minor) >= 21);
if (isConfigProvider) {
try {
AntdProvider = require('antd/lib/config-provider').default;
} catch (e) {}
}
return (<AntdProvider locale={appLocale.antd ? (appLocale.antd.default || appLocale.antd) : defaultAntd}>
{ret}
</AntdProvider>);
return ret;
}
}
export default LocaleWrapper;
import dva from 'dva';
import { Component } from 'react';
import createLoading from 'dva-loading';
import history from '@tmp/history';
let app = null;
export function _onCreate() {
const plugins = require('umi/_runtimePlugin');
const runtimeDva = plugins.mergeConfig('dva');
app = dva({
history,
...(runtimeDva.config || {}),
...(window.g_useSSR ? { initialState: window.g_initialData } : {}),
});
app.use(createLoading());
(runtimeDva.plugins || []).forEach(plugin => {
app.use(plugin);
});
app.model({ namespace: 'model', ...(require('E:/work/input-search-table/src/model.js').default) });
return app;
}
export function getApp() {
return app;
}
export class _DvaContainer extends Component {
render() {
const app = getApp();
app.router(() => this.props.children);
return app.start()();
}
}
// create history
const history = require('umi/lib/createHistory').default({
basename: window.routerBase,
});
window.g_history = history;
export default history;
import 'core-js';
import 'regenerator-runtime/runtime';
import React from 'react';
import { Router as DefaultRouter, Route, Switch } from 'react-router-dom';
import dynamic from 'umi/dynamic';
import renderRoutes from 'umi/lib/renderRoutes';
import history from '@tmp/history';
import RendererWrapper0 from 'E:/work/input-search-table/src/.umi/LocaleWrapper.jsx';
const Router = require('dva/router').routerRedux.ConnectedRouter;
const routes = [
{
path: '/',
component: require('../../node_modules/umi-plugin-block-dev/layouts/ant-design-pro')
.default,
routes: [
{
path: '/',
component: require('..').default,
exact: false,
},
{
component: () =>
React.createElement(
require('E:/work/input-search-table/node_modules/umi-build-dev/lib/plugins/404/NotFound.js')
.default,
{ pagesPath: 'src', hasRoutesInConfig: true },
),
},
],
},
{
component: () =>
React.createElement(
require('E:/work/input-search-table/node_modules/umi-build-dev/lib/plugins/404/NotFound.js')
.default,
{ pagesPath: 'src', hasRoutesInConfig: true },
),
},
];
window.g_routes = routes;
const plugins = require('umi/_runtimePlugin');
plugins.applyForEach('patchRoutes', { initialValue: routes });
export { routes };
export default class RouterWrapper extends React.Component {
unListen() {}
constructor(props) {
super(props);
// route change handler
function routeChangeHandler(location, action) {
plugins.applyForEach('onRouteChange', {
initialValue: {
routes,
location,
action,
},
});
}
this.unListen = history.listen(routeChangeHandler);
routeChangeHandler(history.location);
}
componentWillUnmount() {
this.unListen();
}
render() {
const props = this.props || {};
return (
<RendererWrapper0>
<Router history={history}>{renderRoutes(routes, props)}</Router>
</RendererWrapper0>
);
}
}
import './polyfills';
import history from './history';
import React from 'react';
import ReactDOM from 'react-dom';
import findRoute, {
getUrlQuery,
} from 'E:/work/input-search-table/node_modules/umi-build-dev/lib/findRoute.js';
// runtime plugins
const plugins = require('umi/_runtimePlugin');
window.g_plugins = plugins;
plugins.init({
validKeys: [
'patchRoutes',
'render',
'rootContainer',
'modifyRouteProps',
'onRouteChange',
'modifyInitialProps',
'initialProps',
'dva',
'locale',
],
});
plugins.use(require('../../node_modules/umi-plugin-dva/lib/runtime'));
const app = require('@tmp/dva')._onCreate();
window.g_app = app;
// render
let clientRender = async () => {
window.g_isBrowser = true;
let props = {};
// Both support SSR and CSR
if (window.g_useSSR) {
// 如果开启服务端渲染则客户端组件初始化 props 使用服务端注入的数据
props = window.g_initialData;
} else {
const pathname = location.pathname;
const activeRoute = findRoute(require('@tmp/router').routes, pathname);
// 在客户端渲染前,执行 getInitialProps 方法
// 拿到初始数据
if (
activeRoute &&
activeRoute.component &&
activeRoute.component.getInitialProps
) {
const initialProps = plugins.apply('modifyInitialProps', {
initialValue: {},
});
props = activeRoute.component.getInitialProps
? await activeRoute.component.getInitialProps({
route: activeRoute,
isServer: false,
location,
...initialProps,
})
: {};
}
}
const rootContainer = plugins.apply('rootContainer', {
initialValue: React.createElement(require('./router').default, props),
});
ReactDOM[window.g_useSSR ? 'hydrate' : 'render'](
rootContainer,
document.getElementById('root'),
);
};
const render = plugins.compose(
'render',
{ initialValue: clientRender },
);
const moduleBeforeRendererPromises = [];
// client render
if (__IS_BROWSER) {
Promise.all(moduleBeforeRendererPromises)
.then(() => {
render();
})
.catch(err => {
window.console && window.console.error(err);
});
}
// export server render
let serverRender, ReactDOMServer;
if (!__IS_BROWSER) {
serverRender = async (ctx = {}) => {
// ctx.req.url may be `/bar?locale=en-US`
const [pathname] = (ctx.req.url || '').split('?');
const history = require('@tmp/history').default;
history.push(ctx.req.url);
let props = {};
const activeRoute =
findRoute(require('./router').routes, pathname) || false;
if (
activeRoute &&
activeRoute.component &&
activeRoute.component.getInitialProps
) {
const initialProps = plugins.apply('modifyInitialProps', {
initialValue: {},
});
// patch query object
const location = history.location
? { ...history.location, query: getUrlQuery(history.location.search) }
: {};
props = await activeRoute.component.getInitialProps({
route: activeRoute,
isServer: true,
location,
// only exist in server
req: ctx.req || {},
res: ctx.res || {},
...initialProps,
});
props = plugins.apply('initialProps', {
initialValue: props,
});
} else {
// message activeRoute or getInitialProps not found
console.log(
!activeRoute
? `${pathname} activeRoute not found`
: `${pathname} activeRoute's getInitialProps function not found`,
);
}
const rootContainer = plugins.apply('rootContainer', {
initialValue: React.createElement(require('./router').default, props),
});
const htmlTemplateMap = {};
return {
htmlElement:
activeRoute && activeRoute.path
? htmlTemplateMap[activeRoute.path]
: '',
rootContainer,
matchPath: activeRoute && activeRoute.path,
g_initialData: props,
};
};
// using project react-dom version
// https://github.com/facebook/react/issues/13991
ReactDOMServer = require('react-dom/server');
}
export { ReactDOMServer };
export default (__IS_BROWSER ? null : serverRender);
(() => {
try {
const ua = window.navigator.userAgent;
const isIE = ua.indexOf('MSIE ') > -1 || ua.indexOf('Trident/') > -1;
if (isIE) return;
// Umi UI Bubble
require('../../node_modules/umi-plugin-ui/lib/bubble').default({
port: 3002,
path: 'E:/work/input-search-table',
currentProject: '',
isBigfish: undefined,
});
} catch (e) {
console.warn('Umi UI render error:', e);
}
})();
(() => {
// Runtime block add component
window.GUmiUIFlag = require('../../node_modules/umi-build-dev/lib/plugins/commands/block/sdk/flagBabelPlugin/GUmiUIFlag.js').default;
// Enable/Disable block add edit mode
const el = document.createElement('style');
el.innerHTML = '.g_umiuiBlockAddEditMode { display: none; } ';
const hoverEl = document.createElement('style');
hoverEl.innerHTML =
'.g_umiuiBlockAddEditMode:hover {background: rgba(24, 144, 255, 0.25) !important;}';
document.querySelector('head').appendChild(hoverEl);
document.querySelector('head').appendChild(el);
window.addEventListener(
'message',
event => {
try {
const { action, data } = JSON.parse(event.data);
switch (action) {
case 'umi.ui.enableBlockEditMode':
el.innerHTML = '';
break;
case 'umi.ui.disableBlockEditMode':
el.innerHTML = '.g_umiuiBlockAddEditMode { display: none; }';
break;
case 'umi.ui.checkValidEditSection':
const haveValid = !!document.querySelectorAll(
'div.g_umiuiBlockAddEditMode',
).length;
const frame = document.getElementById('umi-ui-bubble');
if (frame && frame.contentWindow) {
frame.contentWindow.postMessage(
JSON.stringify({
action: 'umi.ui.checkValidEditSection.success',
payload: {
haveValid,