U 优化发布详情页日志自动滚动

pull/137/head
vapao 2020-06-14 18:34:20 +08:00
parent 5a8fbf48a2
commit a4945a9f6d
2 changed files with 26 additions and 6 deletions

View File

@ -19,6 +19,7 @@ class Ext1Index extends React.Component {
super(props);
this.id = props.match.params.id;
this.log = props.match.params.log;
this.elements = {};
this.state = {
fetching: true,
loading: false,
@ -56,7 +57,10 @@ class Ext1Index extends React.Component {
_parse_message = (message) => {
const {key, data, step, status} = message;
if (data !== undefined) store.outputs[key]['data'] += data;
if (data !== undefined) {
store.outputs[key]['data'] += data;
this.elements[key].scrollIntoView()
}
if (step !== undefined) store.outputs[key]['step'] = step;
if (status !== undefined) store.outputs[key]['status'] = status;
};
@ -139,7 +143,10 @@ class Ext1Index extends React.Component {
<Steps.Step {...this.getStatus('local', 4)} title="检出后任务"/>
<Steps.Step {...this.getStatus('local', 5)} title="执行打包"/>
</Steps>}>
<pre className={styles.ext1Console}>{lds.get(store.outputs, 'local.data')}</pre>
<pre className={styles.ext1Console}>
{lds.get(store.outputs, 'local.data')}
<div ref={el => this.elements['local'] = el}/>
</pre>
</Collapse.Panel>
</Collapse>
@ -158,7 +165,10 @@ class Ext1Index extends React.Component {
<Steps.Step {...this.getStatus(item.id, 4)} title="发布后任务"/>
</Steps>
</div>}>
<pre className={styles.ext1Console}>{lds.get(store.outputs, `${item.id}.data`)}</pre>
<pre className={styles.ext1Console}>
{lds.get(store.outputs, `${item.id}.data`)}
<div ref={el => this.elements[item.id] = el} />
</pre>
</Collapse.Panel>
))}
</Collapse>

View File

@ -19,6 +19,7 @@ class Ext1Index extends React.Component {
super(props);
this.id = props.match.params.id;
this.log = props.match.params.log;
this.elements = {};
this.state = {
fetching: true,
loading: false,
@ -57,7 +58,10 @@ class Ext1Index extends React.Component {
_parse_message = (message) => {
const {key, data, step, status} = message;
if (data !== undefined) store.outputs[key]['data'] += data;
if (data !== undefined) {
store.outputs[key]['data'] += data;
this.elements[key].scrollIntoView()
}
if (step !== undefined) store.outputs[key]['step'] = step;
if (status !== undefined) store.outputs[key]['status'] = status;
};
@ -140,7 +144,10 @@ class Ext1Index extends React.Component {
<Steps.Step {...this.getStatus('local', 2 + index)} key={index} title={item.title}/>
))}
</Steps>}>
<pre className={styles.ext1Console}>{lds.get(store.outputs, 'local.data')}</pre>
<pre className={styles.ext1Console}>
{lds.get(store.outputs, 'local.data')}
<div ref={el => this.elements['local'] = el}/>
</pre>
</Collapse.Panel>
</Collapse>
@ -160,7 +167,10 @@ class Ext1Index extends React.Component {
))}
</Steps>
</div>}>
<pre className={styles.ext1Console}>{lds.get(store.outputs, `${item.id}.data`)}</pre>
<pre className={styles.ext1Console}>
{lds.get(store.outputs, `${item.id}.data`)}
<div ref={el => this.elements[item.id] = el}/>
</pre>
</Collapse.Panel>
))}
</Collapse>