支持批量创建同名称环境变量,日志和脚本管理PC页支持宽度拖拽

This commit is contained in:
hanhh
2021-08-17 18:34:55 +08:00
parent 594e871744
commit 2d6da9ebfe
9 changed files with 114 additions and 89 deletions
+2 -1
View File
@@ -317,7 +317,8 @@ const Env = () => {
const result = [...value];
const index = value.findIndex((x) => x._id === env._id);
if (index === -1) {
result.push(env);
env = Array.isArray(env) ? env : [env];
result.push(...env);
} else {
result.splice(index, 1, {
...env,
+21 -2
View File
@@ -1,5 +1,5 @@
import React, { useEffect, useState } from 'react';
import { Modal, message, Input, Form } from 'antd';
import { Modal, message, Input, Form, Radio } from 'antd';
import { request } from '@/utils/http';
import config from '@/utils/config';
@@ -17,8 +17,19 @@ const EnvModal = ({
const handleOk = async (values: any) => {
setLoading(true);
const { value, split, name, remarks } = values;
const method = env ? 'put' : 'post';
const payload = env ? { ...values, _id: env._id } : values;
let payload = env ? { ...values, _id: env._id } : values;
if (!env && split === '1') {
const symbol = value.includes('&') ? '&' : '\n';
payload = value.split(symbol).map((x: any) => {
return {
name: name,
value: x,
remarks: remarks,
};
});
}
const { code, data } = await request[method](`${config.apiPrefix}envs`, {
data: payload,
});
@@ -61,6 +72,14 @@ const EnvModal = ({
>
<Input placeholder="请输入环境变量名称" />
</Form.Item>
{!env && (
<Form.Item name="split" label="自动拆分" initialValue="0">
<Radio.Group>
<Radio value="1"></Radio>
<Radio value="0"></Radio>
</Radio.Group>
</Form.Item>
)}
<Form.Item
name="value"
label="值"
+1 -1
View File
@@ -7,7 +7,6 @@
background-color: #fff;
height: calc(100vh - 128px);
height: calc(100vh - var(--vh-offset, 0px) - 128px);
width: @tree-width;
display: flex;
flex-direction: column;
}
@@ -20,4 +19,5 @@
.log-container {
display: flex;
position: relative;
}
+33 -31
View File
@@ -7,6 +7,7 @@ import { request } from '@/utils/http';
import styles from './index.module.less';
import { Controlled as CodeMirror } from 'react-codemirror2';
import { useCtx, useTheme } from '@/utils/hooks';
import SplitPane from 'react-split-pane';
function getFilterData(keyword: string, data: any) {
const expandedKeys: string[] = [];
@@ -133,24 +134,40 @@ const Log = () => {
>
<div className={`${styles['log-container']} log-container`}>
{!isPhone && (
<div className={styles['left-tree-container']}>
<Input.Search
className={styles['left-tree-search']}
onChange={onSearch}
></Input.Search>
<div className={styles['left-tree-scroller']} ref={treeDom}>
<Tree
className={styles['left-tree']}
treeData={filterData}
showIcon={true}
height={height}
showLine={{ showLeafIcon: true }}
onSelect={onTreeSelect}
></Tree>
<SplitPane split="vertical" size={200} maxSize={-100}>
<div className={styles['left-tree-container']}>
<Input.Search
className={styles['left-tree-search']}
onChange={onSearch}
></Input.Search>
<div className={styles['left-tree-scroller']} ref={treeDom}>
<Tree
className={styles['left-tree']}
treeData={filterData}
showIcon={true}
height={height}
showLine={{ showLeafIcon: true }}
onSelect={onTreeSelect}
></Tree>
</div>
</div>
</div>
<Editor
language="shell"
theme={theme}
value={value}
options={{
readOnly: true,
fontSize: 12,
lineNumbersMinChars: 3,
fontFamily: 'Source Code Pro',
folding: false,
glyphMargin: false,
wordWrap: 'on',
}}
/>
</SplitPane>
)}
{isPhone ? (
{isPhone && (
<CodeMirror
value={value}
options={{
@@ -165,21 +182,6 @@ const Log = () => {
}}
onChange={(editor, data, value) => {}}
/>
) : (
<Editor
language="shell"
theme={theme}
value={value}
options={{
readOnly: true,
fontSize: 12,
lineNumbersMinChars: 3,
fontFamily: 'Source Code Pro',
folding: false,
glyphMargin: false,
wordWrap: 'on',
}}
/>
)}
</div>
</PageContainer>
+1 -1
View File
@@ -7,7 +7,6 @@
background-color: #fff;
height: calc(100vh - 128px);
height: calc(100vh - var(--vh-offset, 0px) - 128px);
width: @tree-width;
display: flex;
flex-direction: column;
}
@@ -20,4 +19,5 @@
.log-container {
display: flex;
position: relative;
}
+31 -29
View File
@@ -8,6 +8,7 @@ import styles from './index.module.less';
import EditModal from './editModal';
import { Controlled as CodeMirror } from 'react-codemirror2';
import { useCtx, useTheme } from '@/utils/hooks';
import SplitPane from 'react-split-pane';
function getFilterData(keyword: string, data: any) {
if (keyword) {
@@ -122,24 +123,38 @@ const Script = () => {
>
<div className={`${styles['log-container']} log-container`}>
{!isPhone && (
<div className={styles['left-tree-container']}>
<Input.Search
className={styles['left-tree-search']}
onChange={onSearch}
></Input.Search>
<div className={styles['left-tree-scroller']} ref={treeDom}>
<Tree
className={styles['left-tree']}
treeData={filterData}
showIcon={true}
height={height}
showLine={{ showLeafIcon: true }}
onSelect={onTreeSelect}
></Tree>
<SplitPane split="vertical" size={200} maxSize={-100}>
<div className={styles['left-tree-container']}>
<Input.Search
className={styles['left-tree-search']}
onChange={onSearch}
></Input.Search>
<div className={styles['left-tree-scroller']} ref={treeDom}>
<Tree
className={styles['left-tree']}
treeData={filterData}
showIcon={true}
height={height}
showLine={{ showLeafIcon: true }}
onSelect={onTreeSelect}
></Tree>
</div>
</div>
</div>
<Editor
language={mode}
value={value}
theme={theme}
options={{
readOnly: true,
fontSize: 12,
lineNumbersMinChars: 3,
folding: false,
glyphMargin: false,
}}
/>
</SplitPane>
)}
{isPhone ? (
{isPhone && (
<CodeMirror
value={value}
options={{
@@ -155,19 +170,6 @@ const Script = () => {
}}
onChange={(editor, data, value) => {}}
/>
) : (
<Editor
language={mode}
value={value}
theme={theme}
options={{
readOnly: true,
fontSize: 12,
lineNumbersMinChars: 3,
folding: false,
glyphMargin: false,
}}
/>
)}
<EditModal
visible={isLogModalVisible}