Skip to content

G
gitlab-ce
Commit 8cebb71e authored by Filipa Lacerda's avatar Filipa Lacerda
Browse files
Options

Add template to environment vue instance

parent 9be7aa0f
Show whitespace changes
Inline Side-by-side
Showing with 122 additions and 85 deletions
app/assets/javascripts/environments/components/environment_item.js.es6
View file @ 8cebb71e
......@@ -265,16 +265,6 @@
isLastDeployment() {
return this.model.last_deployment && this.model.last_deployment['last?'];
},
canReadEnvironmentParsed() {
return true;
return this.$options.convertPermissionToBoolean(this.canReadEnvironment);
},
canCreateDeploymentParsed() {
return true;
return this.$options.convertPermissionToBoolean(this.canCreateDeployment);
},
},
/**
......@@ -289,19 +279,6 @@
return {}.hasOwnProperty.call(obj, key);
},
/**
* Converts permission provided as strings to booleans.
* @param {String} string
* @returns {Boolean}
*/
convertPermissionToBoolean(string) {
if (string === 'true') {
return true;
}
return false;
},
methods: {
/**
* Toggles the visibility of a folders' children.
......@@ -381,25 +358,25 @@
<td class="hidden-xs col-sm-3">
<div v-if="!isFolder">
<div v-if="hasManualActions && canCreateDeploymentParsed" class="inline">
<div v-if="hasManualActions && canCreateDeployment" class="inline">
<actions-component
:actions="manualActions">
</actions-component>
</div>
<div v-if="model.external_url && canReadEnvironmentParsed" class="inline">
<div v-if="model.external_url && canReadEnvironment" class="inline">
<external-url-component
:external_url="model.external_url">
</external_url-component>
</div>
<div v-if="isStoppable && canCreateDeploymentParsed" class="inline">
<div v-if="isStoppable && canCreateDeployment" class="inline">
<stop-component
:stop_url="model.environment_url">
</stop-component>
</div>
<div v-if="canRetry && canCreateDeploymentParsed" class="inline">
<div v-if="canRetry && canCreateDeployment" class="inline">
<rollback-component
:is_last_deployment="isLastDeployment"
:retry_url="retryUrl">
......
app/assets/javascripts/environments/environments_bundle.js.es6
View file @ 8cebb71e
......@@ -3,7 +3,7 @@
//= require_tree ./stores
//= require_tree ./services
//= require ./components/environment_item
//= require ../boards/vue_resource_interceptor
//= require ./vue_resource_interceptor
/* globals Vue, EnvironmentsService */
/* eslint-disable no-param-reassign */
......@@ -44,6 +44,11 @@ $(() => {
endpoint: environmentsListApp.dataset.environmentsDataEndpoint,
canCreateDeployment: environmentsListApp.dataset.canCreateDeployment,
canReadEnvironment: environmentsListApp.dataset.canReadEnvironment,
canCreateEnvironment: environmentsListApp.dataset.canCreateEnvironment,
projectEnvironmentsPath: environmentsListApp.dataset.projectEnvironmentsPath,
projectClosedEnvironmentsPath: environmentsListApp.dataset.projectClosedEnvironmentsPath,
newEnvironmentPath: environmentsListApp.dataset.newEnvironmentPath,
helpPagePath: environmentsListApp.dataset.helpPagePath,
loading: true,
visibility: 'available',
},
......@@ -52,6 +57,18 @@ $(() => {
filteredEnvironments() {
return recursiveMap(filterState(this.visibility), this.state.environments);
},
scope() {
return this.$options.getQueryParameter('scope');
},
canReadEnvironmentParsed() {
return this.$options.convertPermissionToBoolean(this.canReadEnvironment);
},
canCreateDeploymentParsed() {
return this.$options.convertPermissionToBoolean(this.canCreateDeployment);
},
},
init: Store.create.bind(Store),
......@@ -90,5 +107,92 @@ $(() => {
return acc;
}, {})[parameter];
},
/**
* Converts permission provided as strings to booleans.
* @param {String} string
* @returns {Boolean}
*/
convertPermissionToBoolean(string) {
if (string === 'true') {
return true;
}
return false;
},
template: `
<div>
<div class="top-area">
<ul v-if="!isLoading" class="nav-links">
<li v-bind:class="{ 'active': scope === undefined}">
<a :href="projectEnvironmentsPath">
Available
<span class="badge js-available-environments-count">
{{state.availableCounter}}
</span>
</a>
</li>
<li v-bind:class="{ 'active': scope === 'stopped'}">
<a :href="projectClosedEnvironmentsPath">
Stopped
<span class="badge js-stopped-environments-count">
{{state.stoppedCounter}}
</span>
</a>
</li>
</ul>
<div v-if="canCreateEnvironment && !loading" class="nav-controls">
<a :href="newEnvironmentPath" class="btn btn-create">
New envrionment
</a>
</div>
</div>
<div class="environments-container">
<div class="environments-list-loading text-center" v-if="loading">
<i class="fa fa-spinner spin"></i>
</div>
<div class="blank-state blank-state-no-icon" v-if="!loading && state.environments.length === 0">
<h2 class="blank-state-title">
You don't have any environments right now.
</h2>
<p class="blank-state-text">
Environments are places where code gets deployed, such as staging or production.
<br />
<a :href="helpPagePath">
Read more about environments
</a>
<a v-if="canCreateEnvironment" :href="newEnvironmentPath" class="btn btn-create">
New Environment
</a>
</p>
</div>
<div class="table-holder" v-if="!loading && state.environments.length > 0">
<table class="table ci-table environments">
<thead>
<th>Environment</th>
<th>Last deployment</th>
<th>Build</th>
<th>Commit</th>
<th></th>
<th class="hidden-xs"></th>
</thead>
<tbody>
<tr is="environment-item"
v-for="model in filteredEnvironments"
:model="model"
:can-create-deployment="canCreateDeploymentParsed"
:can-read-environment="canReadEnvironmentParsed">
</tbody>
</table>
</div>
</div>
</div>
`,
});
});
app/views/projects/environments/index.html.haml
View file @ 8cebb71e
......@@ -5,60 +5,16 @@
- content_for :page_specific_javascripts do
= page_specific_javascript_tag("environments/environments_bundle.js")
#environments-list-view{ data: { environments_data: environments_list_data, "can-create-deployment" => can?(current_user, :create_deployment, @environment), "can-read-environment" => can?(current_user, :read_environment, @project)}, class: container_class }
.top-area
%ul.nav-links{ "v-if" => "!loading" }
%li{class: ('active' if @scope.nil?)}
= link_to project_environments_path(@project) do
Available
%span.badge.js-available-environments-count
{{state.availableCounter}}
%li{class: ('active' if @scope == 'stopped')}
= link_to project_environments_path(@project, scope: :stopped) do
Stopped
%span.badge.js-stopped-environments-count
{{state.stoppedCounter}}
- if can?(current_user, :create_environment, @project)
.nav-controls{ "v-if" => "!loading" }
= link_to new_namespace_project_environment_path(@project.namespace, @project), class: "btn btn-create" do
New environment
.environments-container
.environments-list-loading.text-center{ "v-if" => "loading" }
= icon("spinner spin")
.blank-state.blank-state-no-icon{ "v-if" => "!loading && !state.environments.length" }
%h2.blank-state-title
You don't have any environments right now.
%p.blank-state-text
Environments are places where code gets deployed, such as staging or production.
%br
= succeed "." do
= link_to "Read more about environments", help_page_path("ci/environments")
- if can?(current_user, :create_environment, @project)
= link_to new_namespace_project_environment_path(@project.namespace, @project), class: 'btn btn-create' do
New environment
.commit-icon-svg.hidden
.commit-icon-svg.hidden
= custom_icon("icon_commit")
.play-icon-svg.hidden
.play-icon-svg.hidden
= custom_icon("icon_play")
.table-holder{ "v-if" => "!loading && state.environments.length" }
%table.table.ci-table.environments
%thead
%th Environment
%th Last Deployment
%th Build
%th Commit
%th
%th.hidden-xs
%tbody
%tr{"is" => "environment-item",
"v-for" => "model in filteredEnvironments",
":model" => "model",
#environments-list-view{ data: { environments_data: environments_list_data,
"can-create-deployment" => can?(current_user, :create_deployment, @environment),
"can-read-environment" => can?(current_user, :read_environment, @project)}
"can-read-environment" => can?(current_user, :read_environment, @project),
"can-create-environmnet" => can?(current_user, :create_environment, @project),
"project-environments-path" => project_environments_path(@project),
"project-closed-environments-path" => project_environments_path(@project, scope: :stopped),
"new-environment-path" => new_namespace_project_environment_path(@project.namespace, @project),
"help-page-path" => help_page_path("ci/environments")}, class: container_class }
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment
GitLab Nexedi Edition | About GitLab | About Nexedi | 沪ICP备2021021310号-2 | 沪ICP备2021021310号-7