fix: newconfig style

This commit is contained in:
LoadChange 2019-01-17 21:44:17 +08:00 committed by Asa
parent 95c3458fed
commit aafd30eb2b
8 changed files with 77 additions and 64 deletions

View File

@ -64,7 +64,7 @@
"webpack-dev-server": "^3.1.13" "webpack-dev-server": "^3.1.13"
}, },
"dependencies": { "dependencies": {
"@alifd/next": "^1.11.5", "@alifd/next": "^1.11.10",
"axios": "^0.18.0", "axios": "^0.18.0",
"jquery": "^3.3.1", "jquery": "^3.3.1",
"moment": "^2.23.0", "moment": "^2.23.0",

View File

@ -20,7 +20,6 @@
<meta http-equiv="X-UA-Compatible" content="ie=edge"> <meta http-equiv="X-UA-Compatible" content="ie=edge">
<title>Nacos</title> <title>Nacos</title>
<link rel="shortcut icon" href="//www.aliyun.com/favicon.ico" type="image/x-icon" /> <link rel="shortcut icon" href="//www.aliyun.com/favicon.ico" type="image/x-icon" />
<link rel="stylesheet" type="text/css" href="css/bootstrap.css">
<link rel="stylesheet" type="text/css" href="css/console1412.css"> <link rel="stylesheet" type="text/css" href="css/console1412.css">
<!-- 第三方css开始 --> <!-- 第三方css开始 -->
<link rel="stylesheet" type="text/css" href="css/codemirror.css"> <link rel="stylesheet" type="text/css" href="css/codemirror.css">

View File

@ -734,7 +734,7 @@ class ConfigurationManagement extends React.Component {
style={{ style={{
position: 'relative', position: 'relative',
marginTop: 10, marginTop: 10,
height: this.state.isAdvancedQuery ? 'auto' : 48, height: this.state.isAdvancedQuery ? 'auto' : 42,
overflow: 'hidden', overflow: 'hidden',
}} }}
> >

View File

@ -379,10 +379,10 @@ class NewConfig extends React.Component {
const { init } = this.field; const { init } = this.field;
const formItemLayout = { const formItemLayout = {
labelCol: { labelCol: {
span: 2, fixedSpan: 10,
}, },
wrapperCol: { wrapperCol: {
span: 22, span: 14,
}, },
}; };
@ -433,8 +433,8 @@ class NewConfig extends React.Component {
color={'#333'} color={'#333'}
> >
<h1>{locale.newListing}</h1> <h1>{locale.newListing}</h1>
<Form field={this.field}> <Form className="new-config-form" field={this.field} {...formItemLayout}>
<FormItem label={'Data ID:'} required {...formItemLayout}> <FormItem label={'Data ID:'} required>
<Input <Input
{...init('dataId', { {...init('dataId', {
rules: [ rules: [
@ -456,7 +456,7 @@ class NewConfig extends React.Component {
} }
/> />
</FormItem> </FormItem>
<FormItem label={'Group:'} required {...formItemLayout}> <FormItem label={'Group:'} required>
<Combobox <Combobox
style={{ width: '100%' }} style={{ width: '100%' }}
size={'large'} size={'large'}
@ -483,49 +483,52 @@ class NewConfig extends React.Component {
</FormItem> </FormItem>
<FormItem <FormItem
label={' '} label={' '}
{...formItemLayout}
style={{ display: this.state.showGroupWarning ? 'block' : 'none' }} style={{ display: this.state.showGroupWarning ? 'block' : 'none' }}
> >
<Message type={'warning'} size={'medium'} animation={false}> <Message type={'warning'} size={'medium'} animation={false}>
{locale.annotation} {locale.annotation}
</Message> </Message>
</FormItem> </FormItem>
<FormItem label={''} {...formItemLayout}>
<div> <FormItem
label={locale.tags}
className={`more-item${!this.state.showmore ? ' hide' : ''}`}
>
<Select
size={'medium'}
hasArrow
style={{ width: '100%', height: '100%!important' }}
autoWidth
multiple
mode="tag"
filterLocal
placeholder={locale.pleaseEnterTag}
dataSource={this.state.tagLst}
value={this.state.config_tags}
onChange={this.setConfigTags.bind(this)}
hasClear
/>
</FormItem>
<FormItem
label={locale.groupIdCannotBeLonger}
className={`more-item${!this.state.showmore ? ' hide' : ''}`}
>
<Input {...init('appName')} readOnly={this.inApp} />
</FormItem>
<FormItem label=" ">
<div className="more-container">
<a style={{ fontSize: '12px' }} onClick={this.toggleMore.bind(this)}> <a style={{ fontSize: '12px' }} onClick={this.toggleMore.bind(this)}>
{this.state.showmore ? locale.dataIdLength : locale.collapse} {this.state.showmore ? locale.dataIdLength : locale.collapse}
</a> </a>
</div> </div>
</FormItem> </FormItem>
<div style={{ overflow: 'hidden', height: this.state.showmore ? 'auto' : '0' }}> <FormItem label={locale.description}>
<FormItem label={locale.tags} {...formItemLayout}>
<Select
size={'medium'}
hasArrow
style={{ width: '100%', height: '100%!important' }}
autoWidth
multiple
mode="tag"
filterLocal
placeholder={locale.pleaseEnterTag}
dataSource={this.state.tagLst}
value={this.state.config_tags}
onChange={this.setConfigTags.bind(this)}
hasClear
/>
</FormItem>
<FormItem label={locale.groupIdCannotBeLonger} {...formItemLayout}>
<Input {...init('appName')} readOnly={this.inApp} />
</FormItem>
</div>
<FormItem label={locale.description} {...formItemLayout}>
<Input.TextArea htmlType={'text'} multiple rows={3} {...init('desc')} /> <Input.TextArea htmlType={'text'} multiple rows={3} {...init('desc')} />
</FormItem> </FormItem>
<FormItem label={locale.targetEnvironment} {...formItemLayout}> <FormItem label={locale.targetEnvironment}>
<RadioGroup <RadioGroup
dataSource={list} dataSource={list}
value={this.state.configType} value={this.state.configType}
@ -543,9 +546,8 @@ class NewConfig extends React.Component {
size={'small'} size={'small'}
style={{ style={{
color: '#1DC11D', color: '#1DC11D',
marginRight: 5, margin: '0 5px',
verticalAlign: 'middle', verticalAlign: 'middle',
marginTop: 2,
}} }}
/> />
} }
@ -560,12 +562,11 @@ class NewConfig extends React.Component {
</span> </span>
} }
required required
{...formItemLayout}
> >
<div id={'container'} style={{ width: '100%', height: 300 }} /> <div id={'container'} style={{ width: '100%', height: 300 }} />
</FormItem> </FormItem>
<FormItem {...formItemLayout} label={''}> <FormItem label=" ">
<div style={{ textAlign: 'right' }}> <div style={{ textAlign: 'right' }}>
<Button <Button
type={'primary'} type={'primary'}

View File

@ -10,3 +10,16 @@
* See the License for the specific language governing permissions and * See the License for the specific language governing permissions and
* limitations under the License. * limitations under the License.
*/ */
.new-config-form {
max-width: 1000px;
margin-top: 30px;
}
.more-container {
text-align: right;
}
.more-item.hide {
display: none;
}

View File

@ -118,7 +118,7 @@ class EditServiceDialog extends React.Component {
onClose={() => this.hide()} onClose={() => this.hide()}
> >
<Form {...DIALOG_FORM_LAYOUT}> <Form {...DIALOG_FORM_LAYOUT}>
<Form.Item label={`${locale.serviceName}:`} {...formItemLayout}> <Form.Item label={`${locale.serviceName}:`} {...formItemLayout} required>
{!isCreate ? ( {!isCreate ? (
<p>{name}</p> <p>{name}</p>
) : ( ) : (

View File

@ -2,10 +2,10 @@
# yarn lockfile v1 # yarn lockfile v1
"@alifd/next@^1.11.5": "@alifd/next@^1.11.10":
version "1.11.8" version "1.11.10"
resolved "https://registry.yarnpkg.com/@alifd/next/-/next-1.11.8.tgz#02b8b6faf3cbfaf2a4edc3c8943fa5a28dbcb546" resolved "https://registry.yarnpkg.com/@alifd/next/-/next-1.11.10.tgz#7efddb8154024578fee19d51433d532efbf2c649"
integrity sha512-zXxeO35XeAsxxlhZsJbslPeb9gzsUdwlk3bwVQbxI/J7IsfEydsyXUT2/wY4pR6UHyaO2YG4wrgQ1N8YhngwPQ== integrity sha512-RkPRGyk2KjUQPJplKqHG2MAhDCzH3bVpq/klXmI1MvQErSEL+hgNSgvqmh3M/vSKVGIai27vs/Xlgju54LRvKA==
dependencies: dependencies:
babel-runtime "^6.26.0" babel-runtime "^6.26.0"
classnames "^2.2.3" classnames "^2.2.3"
@ -1820,9 +1820,9 @@ caniuse-api@^3.0.0:
lodash.uniq "^4.5.0" lodash.uniq "^4.5.0"
caniuse-lite@^1.0.0, caniuse-lite@^1.0.30000928: caniuse-lite@^1.0.0, caniuse-lite@^1.0.30000928:
version "1.0.30000928" version "1.0.30000929"
resolved "https://registry.yarnpkg.com/caniuse-lite/-/caniuse-lite-1.0.30000928.tgz#805e828dc72b06498e3683a32e61c7507fd67b88" resolved "https://registry.yarnpkg.com/caniuse-lite/-/caniuse-lite-1.0.30000929.tgz#7b391b781a9c3097ecc39ea053301aea8ea16317"
integrity sha512-aSpMWRXL6ZXNnzm8hgE4QDLibG5pVJ2Ujzsuj3icazlIkxXkPXtL+BWnMx6FBkWmkZgBHGUxPZQvrbRw2ZTxhg== integrity sha512-n2w1gPQSsYyorSVYqPMqbSaz1w7o9ZC8VhOEGI9T5MfGDzp7sbopQxG6GaQmYsaq13Xfx/mkxJUWC1Dz3oZfzw==
caseless@~0.12.0: caseless@~0.12.0:
version "0.12.0" version "0.12.0"
@ -2910,9 +2910,9 @@ eslint-config-ali@^4.1.0:
integrity sha512-vPItHMwM4e8TpXH/owvZCW0V4we7QlxSok2ObeOXwu99Gu26mbdqukH47EUDBrm93ru9HefNlYA7BQ8jrQy1dA== integrity sha512-vPItHMwM4e8TpXH/owvZCW0V4we7QlxSok2ObeOXwu99Gu26mbdqukH47EUDBrm93ru9HefNlYA7BQ8jrQy1dA==
eslint-config-prettier@^3.3.0: eslint-config-prettier@^3.3.0:
version "3.4.0" version "3.5.0"
resolved "https://registry.yarnpkg.com/eslint-config-prettier/-/eslint-config-prettier-3.4.0.tgz#97dd5bf33d4d85862fdadf2ea89b4d6cebf3ba4f" resolved "https://registry.yarnpkg.com/eslint-config-prettier/-/eslint-config-prettier-3.5.0.tgz#fb29575c5be7ed79c1637c5a0c58985833290805"
integrity sha512-VDBMmnwA1SH4tGoyTVStbjI18xAFtozvrodjEuoqtP/P/XLJs5Ga8sFf7GSSPxAkgh65CGYT/zOXzsf2IA0aqw== integrity sha512-LcZEoAY5lL3/H2NTFSeUl/z8X8oMea1IxLEIb5uDbRxPTdQeeT7oGpRWT6UwHXGcoRbYH0TZmfRsh8iXbpyW7A==
dependencies: dependencies:
get-stdin "^6.0.0" get-stdin "^6.0.0"
@ -2967,9 +2967,9 @@ eslint-plugin-prettier@^3.0.0:
prettier-linter-helpers "^1.0.0" prettier-linter-helpers "^1.0.0"
eslint-plugin-react@^7.11.1: eslint-plugin-react@^7.11.1:
version "7.12.3" version "7.12.4"
resolved "https://registry.yarnpkg.com/eslint-plugin-react/-/eslint-plugin-react-7.12.3.tgz#b9ca4cd7cd3f5d927db418a1950366a12d4568fd" resolved "https://registry.yarnpkg.com/eslint-plugin-react/-/eslint-plugin-react-7.12.4.tgz#b1ecf26479d61aee650da612e425c53a99f48c8c"
integrity sha512-WTIA3cS8OzkPeCi4KWuPmjR33lgG9r9Y/7RmnLTRw08MZKgAfnK/n3BO4X0S67MPkVLazdfCNT/XWqcDu4BLTA== integrity sha512-1puHJkXJY+oS1t467MjbqjvX53uQ05HXwjqDgdbGBqf5j9eeydI54G3KwiJmWciQ0HTBacIKw2jgwSBSH3yfgQ==
dependencies: dependencies:
array-includes "^3.0.3" array-includes "^3.0.3"
doctrine "^2.1.0" doctrine "^2.1.0"
@ -3522,9 +3522,9 @@ fs.realpath@^1.0.0:
integrity sha1-FQStJSMVjKpA20onh8sBQRmU6k8= integrity sha1-FQStJSMVjKpA20onh8sBQRmU6k8=
fsevents@^1.2.2: fsevents@^1.2.2:
version "1.2.4" version "1.2.6"
resolved "https://registry.yarnpkg.com/fsevents/-/fsevents-1.2.4.tgz#f41dcb1af2582af3692da36fc55cbd8e1041c426" resolved "https://registry.yarnpkg.com/fsevents/-/fsevents-1.2.6.tgz#d3a1864a71876a2eb9b244e3bd8f606eb09568c0"
integrity sha512-z8H8/diyk76B7q5wg+Ud0+CqzcAF3mBBI/bA5ne5zrRUUIvNkJY//D3BqyH571KuAC4Nr7Rw7CjWX4r0y9DvNg== integrity sha512-BalK54tfK0pMC0jQFb2oHn1nz7JNQD/2ex5pBnCHgBi2xG7VV0cAOGy2RS2VbCqUXx5/6obMrMcQTJ8yjcGzbg==
dependencies: dependencies:
nan "^2.9.2" nan "^2.9.2"
node-pre-gyp "^0.10.0" node-pre-gyp "^0.10.0"
@ -4799,9 +4799,9 @@ loader-fs-cache@^1.0.0:
mkdirp "0.5.1" mkdirp "0.5.1"
loader-runner@^2.3.0: loader-runner@^2.3.0:
version "2.3.1" version "2.4.0"
resolved "https://registry.yarnpkg.com/loader-runner/-/loader-runner-2.3.1.tgz#026f12fe7c3115992896ac02ba022ba92971b979" resolved "https://registry.yarnpkg.com/loader-runner/-/loader-runner-2.4.0.tgz#ed47066bfe534d7e84c4c7b9998c2a75607d9357"
integrity sha512-By6ZFY7ETWOc9RFaAIb23IjJVcM4dvJC/N57nmdz9RSkMXvAXGI7SyVlAw3v8vjtDRlqThgVDVmTnr9fqMlxkw== integrity sha512-Jsmr89RcXGIwivFY21FcRrisYZfvLMTWx5kOLc+JTxtpBOG6xML0vzbc6SEQG2FO9/4Fc3wW4LVcB5DmGflaRw==
loader-utils@^0.2.16: loader-utils@^0.2.16:
version "0.2.17" version "0.2.17"
@ -6291,9 +6291,9 @@ postcss-value-parser@^3.0.0, postcss-value-parser@^3.3.0, postcss-value-parser@^
integrity sha512-pISE66AbVkp4fDQ7VHBwRNXzAAKJjw4Vw7nWI/+Q3vuly7SNfgYXvm6i5IgFylHGK5sP/xHAbB7N49OS4gWNyQ== integrity sha512-pISE66AbVkp4fDQ7VHBwRNXzAAKJjw4Vw7nWI/+Q3vuly7SNfgYXvm6i5IgFylHGK5sP/xHAbB7N49OS4gWNyQ==
postcss@^7.0.0, postcss@^7.0.1, postcss@^7.0.5, postcss@^7.0.6: postcss@^7.0.0, postcss@^7.0.1, postcss@^7.0.5, postcss@^7.0.6:
version "7.0.11" version "7.0.13"
resolved "https://registry.yarnpkg.com/postcss/-/postcss-7.0.11.tgz#f63c513b78026d66263bb2ca995bf02e3d1a697d" resolved "https://registry.yarnpkg.com/postcss/-/postcss-7.0.13.tgz#42bf716413e8f1c786ab71dc6e722b3671b16708"
integrity sha512-9AXb//5UcjeOEof9T+yPw3XTa5SL207ZOIC/lHYP4mbUTEh4M0rDAQekQpVANCZdwQwKhBtFZCk3i3h3h2hdWg== integrity sha512-h8SY6kQTd1wISHWjz+E6cswdhMuyBZRb16pSTv3W4zYZ3/YbyWeJdNUeOXB5IdZqE1U76OUEjjjqsC3z2f3hVg==
dependencies: dependencies:
chalk "^2.4.2" chalk "^2.4.2"
source-map "^0.6.1" source-map "^0.6.1"

File diff suppressed because one or more lines are too long