External-Mirrors/awx
2
0
Fork 0
mirror of https://github.com/ansible/awx.git synced 2026-02-27 15:58:45 -03:30
Code Issues Packages Projects Releases Wiki Activity

Addresses needed styling changes to Card and Page Section

Browse Source 
These changes were necessary to remove an additional page section
to ProjectJobTemplateList.
This commit is contained in:
Alex Corey
2020-01-29 12:31:22 -05:00
parent 5790aa9780
commit bbea43b1fe
5 changed files with 183 additions and 180 deletions
Download Patch File Download Diff File Expand all files Collapse all files

22
awx/ui_next/src/screens/Template/JobTemplateAdd/JobTemplateAdd.jsx
View File

@@ -1,6 +1,6 @@
import React, { useState } from 'react'; import React, { useState } from 'react';
import { useHistory } from 'react-router-dom'; import { useHistory } from 'react-router-dom';
import { Card, PageSection } from '@patternfly/react-core'; import { Card } from '@patternfly/react-core';
import { CardBody } from '@components/Card'; import { CardBody } from '@components/Card';
import JobTemplateForm from '../shared/JobTemplateForm'; import JobTemplateForm from '../shared/JobTemplateForm';
import { JobTemplatesAPI } from '@api'; import { JobTemplatesAPI } from '@api';
@@ -61,17 +61,15 @@ function JobTemplateAdd() {
} }
return ( return (
<PageSection> <Card>
<Card> <CardBody>
<CardBody> <JobTemplateForm
<JobTemplateForm handleCancel={handleCancel}
handleCancel={handleCancel} handleSubmit={handleSubmit}
handleSubmit={handleSubmit} />
/> </CardBody>
</CardBody> {formSubmitError ? <div>formSubmitError</div> : ''}
{formSubmitError ? <div>formSubmitError</div> : ''} </Card>
</Card>
</PageSection>
); );
} }

138
awx/ui_next/src/screens/Template/Template.jsx
View File

@@ -150,78 +150,76 @@ class Template extends Component {
} }
return ( return (
<PageSection> <Card className="awx-c-card">
<Card className="awx-c-card"> {cardHeader}
{cardHeader} <Switch>
<Switch> <Redirect
<Redirect from="/templates/:templateType/:id"
from="/templates/:templateType/:id" to="/templates/:templateType/:id/details"
to="/templates/:templateType/:id/details" exact
exact />
/> {template && (
{template && (
<Route
key="details"
path="/templates/:templateType/:id/details"
render={() => (
<JobTemplateDetail
hasTemplateLoading={hasContentLoading}
template={template}
/>
)}
/>
)}
{template && (
<Route
key="edit"
path="/templates/:templateType/:id/edit"
render={() => <JobTemplateEdit template={template} />}
/>
)}
{template && (
<Route
key="access"
path="/templates/:templateType/:id/access"
render={() => (
<ResourceAccessList
resource={template}
apiModel={JobTemplatesAPI}
/>
)}
/>
)}
{canSeeNotificationsTab && (
<Route
path="/templates/:templateType/:id/notifications"
render={() => (
<NotificationList
id={Number(match.params.id)}
canToggleNotifications={isNotifAdmin}
apiModel={JobTemplatesAPI}
/>
)}
/>
)}
<Route <Route
key="not-found" key="details"
path="*" path="/templates/:templateType/:id/details"
render={() => render={() => (
!hasContentLoading && ( <JobTemplateDetail
<ContentError isNotFound> hasTemplateLoading={hasContentLoading}
{match.params.id && ( template={template}
<Link />
to={`/templates/${match.params.templateType}/${match.params.id}/details`} )}
>
{i18n._(`View Template Details`)}
</Link>
)}
</ContentError>
)
}
/> />
</Switch> )}
</Card> {template && (
</PageSection> <Route
key="edit"
path="/templates/:templateType/:id/edit"
render={() => <JobTemplateEdit template={template} />}
/>
)}
{template && (
<Route
key="access"
path="/templates/:templateType/:id/access"
render={() => (
<ResourceAccessList
resource={template}
apiModel={JobTemplatesAPI}
/>
)}
/>
)}
{canSeeNotificationsTab && (
<Route
path="/templates/:templateType/:id/notifications"
render={() => (
<NotificationList
id={Number(match.params.id)}
canToggleNotifications={isNotifAdmin}
apiModel={JobTemplatesAPI}
/>
)}
/>
)}
<Route
key="not-found"
path="*"
render={() =>
!hasContentLoading && (
<ContentError isNotFound>
{match.params.id && (
<Link
to={`/templates/${match.params.templateType}/${match.params.id}/details`}
>
{i18n._(`View Template Details`)}
</Link>
)}
</ContentError>
)
}
/>
</Switch>
</Card>
); );
} }
} }

14
awx/ui_next/src/screens/Template/TemplateList/TemplateList.jsx
View File

@@ -2,7 +2,7 @@ import React, { Component } from 'react';
import { withRouter } from 'react-router-dom'; import { withRouter } from 'react-router-dom';
import { withI18n } from '@lingui/react'; import { withI18n } from '@lingui/react';
import { t } from '@lingui/macro'; import { t } from '@lingui/macro';
import { Card, PageSection } from '@patternfly/react-core'; import { Card } from '@patternfly/react-core';
import { import {
JobTemplatesAPI, JobTemplatesAPI,
@@ -109,7 +109,13 @@ class TemplatesList extends Component {
} }
async loadTemplates() { async loadTemplates() {
const { location, match } = this.props; const {
location,
match: {
params: { id: projectId },
url,
},
} = this.props;
const { const {
jtActions: cachedJTActions, jtActions: cachedJTActions,
wfjtActions: cachedWFJTActions, wfjtActions: cachedWFJTActions,
@@ -135,8 +141,8 @@ class TemplatesList extends Component {
} else { } else {
wfjtOptionsPromise = WorkflowJobTemplatesAPI.readOptions(); wfjtOptionsPromise = WorkflowJobTemplatesAPI.readOptions();
} }
if (match.url.startsWith('/projects') && match.params.id) { if (url.startsWith('/projects') && projectId) {
params.jobtemplate__project = match.params.id; params.jobtemplate__project = projectId;
} }
const promises = Promise.all([ const promises = Promise.all([

87
awx/ui_next/src/screens/Template/Templates.jsx
View File

@@ -1,7 +1,8 @@
import React, { Component, Fragment } from 'react'; import React, { Component } from 'react';
import { withI18n } from '@lingui/react'; import { withI18n } from '@lingui/react';
import { t } from '@lingui/macro'; import { t } from '@lingui/macro';
import { Route, withRouter, Switch } from 'react-router-dom'; import { Route, withRouter, Switch } from 'react-router-dom';
import { PageSection } from '@patternfly/react-core';
import { Config } from '@contexts/Config'; import { Config } from '@contexts/Config';
import Breadcrumbs from '@components/Breadcrumbs/Breadcrumbs'; import Breadcrumbs from '@components/Breadcrumbs/Breadcrumbs';
@@ -50,48 +51,50 @@ class Templates extends Component {
const { match, history, location } = this.props; const { match, history, location } = this.props;
const { breadcrumbConfig } = this.state; const { breadcrumbConfig } = this.state;
return ( return (
<Fragment> <>
<Breadcrumbs breadcrumbConfig={breadcrumbConfig} /> <Breadcrumbs breadcrumbConfig={breadcrumbConfig} />
<Switch> <PageSection>
<Route <Switch>
path={`${match.path}/job_template/add`} <Route
render={() => <JobTemplateAdd />} path={`${match.path}/job_template/add`}
/> render={() => <JobTemplateAdd />}
<Route />
path={`${match.path}/job_template/:id`} <Route
render={({ match: newRouteMatch }) => ( path={`${match.path}/job_template/:id`}
<Config> render={({ match: newRouteMatch }) => (
{({ me }) => ( <Config>
<Template {({ me }) => (
history={history} <Template
location={location} history={history}
setBreadcrumb={this.setBreadCrumbConfig} location={location}
me={me || {}} setBreadcrumb={this.setBreadCrumbConfig}
match={newRouteMatch} me={me || {}}
/> match={newRouteMatch}
)} />
</Config> )}
)} </Config>
/> )}
<Route />
path={`${match.path}/workflow_job_template/:id`} <Route
render={({ match: newRouteMatch }) => ( path={`${match.path}/workflow_job_template/:id`}
<Config> render={({ match: newRouteMatch }) => (
{({ me }) => ( <Config>
<WorkflowJobTemplate {({ me }) => (
history={history} <WorkflowJobTemplate
location={location} history={history}
setBreadcrumb={this.setBreadCrumbConfig} location={location}
me={me || {}} setBreadcrumb={this.setBreadCrumbConfig}
match={newRouteMatch} me={me || {}}
/> match={newRouteMatch}
)} />
</Config> )}
)} </Config>
/> )}
<Route path={`${match.path}`} render={() => <TemplateList />} /> />
</Switch> <Route path={`${match.path}`} render={() => <TemplateList />} />
</Fragment> </Switch>
</PageSection>
</>
); );
} }
} }

102
awx/ui_next/src/screens/Template/WorkflowJobTemplate.jsx
View File

@@ -94,60 +94,58 @@ class WorkflowJobTemplate extends Component {
} }
return ( return (
<PageSection> <Card className="awx-c-card">
<Card className="awx-c-card"> {cardHeader}
{cardHeader} <Switch>
<Switch> <Redirect
<Redirect from="/templates/workflow_job_template/:id"
from="/templates/workflow_job_template/:id" to="/templates/workflow_job_template/:id/details"
to="/templates/workflow_job_template/:id/details" exact
exact />
/> {template && (
{template && (
<Route
key="wfjt-details"
path="/templates/workflow_job_template/:id/details"
render={() => (
<WorkflowJobTemplateDetail
hasTemplateLoading={hasContentLoading}
template={template}
/>
)}
/>
)}
{template && (
<Route
key="wfjt-visualizer"
path="/templates/workflow_job_template/:id/visualizer"
render={() => (
<AppendBody>
<FullPage>
<Visualizer template={template} />
</FullPage>
</AppendBody>
)}
/>
)}
<Route <Route
key="not-found" key="wfjt-details"
path="*" path="/templates/workflow_job_template/:id/details"
render={() => render={() => (
!hasContentLoading && ( <WorkflowJobTemplateDetail
<ContentError isNotFound> hasTemplateLoading={hasContentLoading}
{match.params.id && ( template={template}
<Link />
to={`/templates/workflow_job_template/${match.params.id}/details`} )}
>
{i18n._(`View Template Details`)}
</Link>
)}
</ContentError>
)
}
/> />
</Switch> )}
</Card> {template && (
</PageSection> <Route
key="wfjt-visualizer"
path="/templates/workflow_job_template/:id/visualizer"
render={() => (
<AppendBody>
<FullPage>
<Visualizer template={template} />
</FullPage>
</AppendBody>
)}
/>
)}
<Route
key="not-found"
path="*"
render={() =>
!hasContentLoading && (
<ContentError isNotFound>
{match.params.id && (
<Link
to={`/templates/workflow_job_template/${match.params.id}/details`}
>
{i18n._(`View Template Details`)}
</Link>
)}
</ContentError>
)
}
/>
</Switch>
</Card>
); );
} }
} }