Skip to content

Commit 67e22b5

Browse files
MarselBurdoMarselBurdo
committed
add option type to modal, add drawer
1 parent 0203aaf commit 67e22b5

File tree

9 files changed

+62
-44
lines changed

9 files changed

+62
-44
lines changed

‎dist/components/Modal/ModalProps.d.ts‎

Lines changed: 12 additions & 11 deletions
Original file line numberDiff line numberDiff line change
@@ -16,23 +16,23 @@ export interface ModalSubscribeOnChangeOptions {
1616
/** Функция закрытия модалки */
1717
closeModal: () => void;
1818
}
19+
interface ModalConfig extends AntModalProps {
20+
type?: 'save' | 'select' | 'view';
21+
/** Запрос для автоматического сохранения формы */
22+
requestSaveForm?: Request;
23+
/** HTTP Метод, передаваемый в запрос сохранения */
24+
methodSaveForm?: string;
25+
/** Пропсы формы.
26+
* Если верстка через конфиги, то пропс body обязателен */
27+
form?: FormProps;
28+
}
1929
export interface ModalProps extends Omit<StoreProps, 'subscribe'> {
2030
/** Свойства [Button](https://ant.design/components/button/) из Ant Design
2131
*
2232
* Добавлено свойство `label` с типом `ReactNode` или `string` для формирования контента кнопки*/
2333
buttonProps?: ButtonProps;
2434
/** Объект модального окна. Стандартная конфигурация. */
25-
modalConfig?: {
26-
/** Тип модального окна */
27-
type?: 'save' | 'select' | 'view';
28-
/** Запрос для автоматического сохранения формы */
29-
requestSaveForm?: Request;
30-
/** HTTP Метод, передаваемый в запрос сохранения */
31-
methodSaveForm?: string;
32-
/** Пропсы формы.
33-
* Если верстка через конфиги, то пропс body обязателен */
34-
form?: FormProps;
35-
};
35+
modalConfig?: ModalConfig;
3636
/** Данные для модального окна */
3737
modalData?: AntModalProps;
3838
/** Объект для подписки на изменения в STORE.
@@ -57,3 +57,4 @@ export interface ModalProps extends Omit<StoreProps, 'subscribe'> {
5757
onChange: (params: ModalSubscribeOnChangeOptions) => void;
5858
}[];
5959
}
60+
export {};

‎dist/index.less‎

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,6 @@
11
@import '~react-base-table/styles.css';
2-
@import '../node_modules/react-grid-layout/css/styles.css';
3-
@import '../node_modules/react-resizable/css/styles.css';
2+
@import '~react-grid-layout/css/styles.css';
3+
@import '~react-resizable/css/styles.css';
44
//@import '~antd/dist/antd';
55

66
@import '../lib/components/utils/variables';

‎lib/components/Dashboard/Dashboard.js‎

Lines changed: 2 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -76,16 +76,13 @@ var Dashboard = function Dashboard(props) {
7676
var id = props.id,
7777
requestLoadConfig = props.requestLoadConfig;
7878

79-
var _useState = useState({
80-
title: '',
81-
panels: []
82-
}),
79+
var _useState = useState(props.dashboard),
8380
_useState2 = _slicedToArray(_useState, 2),
8481
dashboard = _useState2[0],
8582
setDashboard = _useState2[1];
8683

8784
useEffect(function () {
88-
requestLoadConfig({
85+
requestLoadConfig && requestLoadConfig({
8986
data: { id: id },
9087
params: {}
9188
}).then(function (res) {

‎lib/components/Dashboard/DashboardProps.tsx‎

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -18,6 +18,7 @@ export interface DashboardProps {
1818
// panels: DashboardPanelProps[] | undefined;
1919
id: string;
2020
requestLoadConfig: Request;
21+
dashboard: any,
2122
}
2223

2324
export interface LogsPanelProps {

‎lib/components/Dashboard/Panels/Logs.js‎

Lines changed: 23 additions & 8 deletions
Original file line numberDiff line numberDiff line change
@@ -4,6 +4,10 @@ import 'antd/es/checkbox/style';
44
import _Checkbox from 'antd/es/checkbox';
55
import 'antd/es/input/style';
66
import _Input from 'antd/es/input';
7+
import 'antd/es/cascader/style';
8+
import _Cascader from 'antd/es/cascader';
9+
10+
var _extends = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; };
711

812
var _slicedToArray = function () { function sliceIterator(arr, i) { var _arr = []; var _n = true; var _d = false; var _e = undefined; try { for (var _i = arr[Symbol.iterator](), _s; !(_n = (_s = _i.next()).done); _n = true) { _arr.push(_s.value); if (i && _arr.length === i) break; } } catch (err) { _d = true; _e = err; } finally { try { if (!_n && _i["return"]) _i["return"](); } finally { if (_d) throw _e; } } return _arr; } return function (arr, i) { if (Array.isArray(arr)) { return arr; } else if (Symbol.iterator in Object(arr)) { return sliceIterator(arr, i); } else { throw new TypeError("Invalid attempt to destructure non-iterable instance"); } }; }();
913

@@ -21,7 +25,7 @@ var styles = {
2125
borderBottom: '1px solid #d9d9d9'
2226
},
2327
inputUrl: {
24-
flexBasis: '150px',
28+
flexBasis: '200px',
2529
borderRight: '1px solid #d9d9d9'
2630
},
2731
inputQuery: {
@@ -65,20 +69,25 @@ var Logs = function Logs(props) {
6569
logsRef = _useState6[0],
6670
setLogsRef = _useState6[1];
6771

68-
var _useState7 = useState(true),
72+
var _useState7 = useState({ url: props.loki.url, query: props.loki.query }),
6973
_useState8 = _slicedToArray(_useState7, 2),
70-
autoScroll = _useState8[0],
71-
setAutoScroll = _useState8[1];
74+
wsParams = _useState8[0],
75+
setWsParams = _useState8[1];
76+
77+
var _useState9 = useState(true),
78+
_useState10 = _slicedToArray(_useState9, 2),
79+
autoScroll = _useState10[0],
80+
setAutoScroll = _useState10[1];
7281

7382
var onOpen = function onOpen() {
7483
// setWs(new W3CWebSocket("ws://10.5.121.117:3100/loki/api/v1/tail?query={dynamicdq=\"oauth.dias-dev.ru\"}", 'echo-protocol'));
75-
setWs(new W3CWebSocket('ws://' + props.loki.url + '/loki/api/v1/tail?query=' + props.loki.query, 'echo-protocol'));
84+
setWs(new W3CWebSocket('ws://' + wsParams.url + '/loki/api/v1/tail?query=' + wsParams.query, 'echo-protocol'));
7685
setLogs([]);
7786
console.log('onCreate ws => ', ws);
7887
};
7988
var onClose = function onClose() {
8089
console.log('onClose ws => ', ws);
81-
ws.close();
90+
ws && ws.close();
8291
setWs(undefined);
8392
};
8493

@@ -112,6 +121,12 @@ var Logs = function Logs(props) {
112121
};
113122
}
114123

124+
var onChangeApp = function onChangeApp(value) {
125+
// console.log(value);
126+
onClose();
127+
setWsParams(_extends({}, wsParams, { query: '{server="' + value[0] + '", app="' + value[1] + '"}' }));
128+
};
129+
115130
return React.createElement(
116131
React.Fragment,
117132
null,
@@ -121,12 +136,12 @@ var Logs = function Logs(props) {
121136
React.createElement(
122137
'div',
123138
{ style: styles.inputUrl },
124-
React.createElement(_Input, { defaultValue: props.loki.url, bordered: false })
139+
React.createElement(_Cascader, { options: props.servers, onChange: onChangeApp, placeholder: '\u0412\u044B\u0431\u0435\u0440\u0438\u0442\u0435 \u043F\u0440\u0438\u043B\u043E\u0436\u0435\u043D\u0438\u0435', bordered: false })
125140
),
126141
React.createElement(
127142
'div',
128143
{ style: styles.inputQuery },
129-
React.createElement(_Input, { defaultValue: props.loki.query, bordered: false })
144+
React.createElement(_Input, { value: wsParams.query, bordered: false, disabled: true })
130145
),
131146
React.createElement(
132147
'div',

‎lib/index.less‎

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,6 @@
11
@import '~react-base-table/styles.css';
2-
@import '../node_modules/react-grid-layout/css/styles.css';
3-
@import '../node_modules/react-resizable/css/styles.css';
2+
@import '~react-grid-layout/css/styles.css';
3+
@import '~react-resizable/css/styles.css';
44
//@import '~antd/dist/antd';
55

66
@import 'components/utils/variables';

‎package-lock.json‎

Lines changed: 1 addition & 1 deletion
Some generated files are not rendered by default. Learn more about customizing how changed files appear on GitHub.

‎src/components/Modal/ModalProps.ts‎

Lines changed: 16 additions & 15 deletions
Original file line numberDiff line numberDiff line change
@@ -18,27 +18,28 @@ export interface ModalSubscribeOnChangeOptions {
1818
closeModal: () => void;
1919
}
2020

21+
interface ModalConfig extends AntModalProps{
22+
type?: 'save' | 'select' | 'view';
23+
24+
/** Запрос для автоматического сохранения формы */
25+
requestSaveForm?: Request;
26+
27+
/** HTTP Метод, передаваемый в запрос сохранения */
28+
methodSaveForm?: string;
29+
30+
/** Пропсы формы.
31+
* Если верстка через конфиги, то пропс body обязателен */
32+
form?: FormProps
33+
}
34+
2135
export interface ModalProps extends Omit<StoreProps, 'subscribe'> {
2236
/** Свойства [Button](https://ant.design/components/button/) из Ant Design
2337
*
2438
* Добавлено свойство `label` с типом `ReactNode` или `string` для формирования контента кнопки*/
2539
buttonProps?: ButtonProps;
2640

2741
/** Объект модального окна. Стандартная конфигурация. */
28-
modalConfig?: {
29-
/** Тип модального окна */
30-
type?: 'save' | 'select' | 'view';
31-
32-
/** Запрос для автоматического сохранения формы */
33-
requestSaveForm?: Request;
34-
35-
/** HTTP Метод, передаваемый в запрос сохранения */
36-
methodSaveForm?: string;
37-
38-
/** Пропсы формы.
39-
* Если верстка через конфиги, то пропс body обязателен */
40-
form?: FormProps
41-
},
42+
modalConfig?: ModalConfig,
4243

4344
/** Данные для модального окна */
4445
modalData?: AntModalProps,
@@ -64,4 +65,4 @@ export interface ModalProps extends Omit<StoreProps, 'subscribe'> {
6465
/** Вызывается при изменение объекта по указанному path */
6566
onChange: (params: ModalSubscribeOnChangeOptions) => void;
6667
}[]
67-
}
68+
}

‎src/components/index.ts‎

Lines changed: 3 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -48,6 +48,7 @@ import RtSelect, { SelectProps } from "./Select";
4848
import RtTreeSelect, { TreeSelectProps } from "./TreeSelect";
4949
import { RtTimePicker, TimePickerProps } from "./DatePicker/DatePicker";
5050
import RtUploadFile, { UploadFileProps } from "./UploadFile";
51+
import AntDrawer, {DrawerProps} from "antd/lib/drawer"
5152

5253
// Data Display
5354
import AntCollapse, { CollapseProps, CollapsePanelProps } from "antd/lib/collapse";
@@ -107,6 +108,7 @@ export const Select: FunctionComponent<SelectProps> = with
107108
export const TreeSelect: FunctionComponent<TreeSelectProps> = withPlaceholder(RtTreeSelect, 'Выберите значение');
108109
export const TimePicker: FunctionComponent<TimePickerProps & StoreProps> = withPlaceholder(RtTimePicker, 'Выберите время');
109110
export const UploadFile: FunctionComponent<UploadFileProps> = withStore(RtUploadFile);
111+
export const Drawer: FunctionComponent<DrawerProps> = withStore(AntDrawer);
110112

111113
// Data Display
112114
export const Collapse: FunctionComponent<CollapseProps & StoreProps> = withStore(AntCollapse);
@@ -177,6 +179,7 @@ export type {
177179
TreeSelectProps,
178180
TimePickerProps,
179181
UploadFileProps,
182+
DrawerProps,
180183

181184
// Data Display
182185
CollapseProps,

0 commit comments

Comments
 (0)