Fix pipeline catalog issue

https://github.com/rancher/rancher/issues/16154
2019-01-06 21:54:07 +08:00 · 2019-01-06 21:54:07 +08:00 · 323d390441
parent abfec3a8d9
commit 323d390441
4 changed files with 66 additions and 47 deletions
--- a/lib/pipeline/addon/components/steps/step-apply-catalog/component.js
+++ b/lib/pipeline/addon/components/steps/step-apply-catalog/component.js
@ -1,6 +1,6 @@
 import Component from '@ember/component';
 import layout from './template';
-import { setProperties, get, set, observer } from '@ember/object';
+import { get, set, observer } from '@ember/object';
 import { inject as service } from '@ember/service';
 import Step from 'pipeline/mixins/step';

@ -13,10 +13,11 @@ export default Component.extend(Step, {

  layout,

-  config:        null,
-  field:         'applyAppConfig',
-  defaultConfig: DEFAULT_CONFIG,
-  loading:       false,
+  config:          null,
+  field:           'applyAppConfig',
+  defaultConfig:   DEFAULT_CONFIG,
+  loading:         false,
+  selectedCatalog: null,

  init() {
    this._super(...arguments);
@ -24,13 +25,9 @@ export default Component.extend(Step, {
    this.initCatalog();
  },

-  appDidChange: observer('config.applyAppConfig.name', function() {
-    setProperties(this, {
-      versions:                        null,
-      'config.applyAppConfig.version': null
-    });
-
-    const name = get(this, 'config.applyAppConfig.name');
+  appDidChange: observer('config.applyAppConfig.catalog', function() {
+    set(this, 'versions', null );
+    const name = get(this, 'config.applyAppConfig.catalog');

    if ( !name ) {
      return;
@ -49,17 +46,27 @@ export default Component.extend(Step, {
    }
    set(this, 'versions', versions);

-    if ( get(versions, 'length') ) {
+    const version = get(this, 'config.applyAppConfig.version');
+
+    if ( version ) {
+      if ( !versions.findBy('id', version) ) {
+        set(this, 'config.applyAppConfig.version', null);
+      }
+    } else if ( get(versions, 'length') ){
      set(this, 'config.applyAppConfig.version', get(this, 'versions.lastObject.id'));
    }
  }),

-  catalogDidChange: observer('config.applyAppConfig.catalog', function() {
-    set(this, 'config.applyAppConfig.name', null);
-    const catalog = get(this, 'config.applyAppConfig.catalog');
+  catalogDidChange: observer('selectedCatalog', function() {
+    const catalog = get(this, 'selectedCatalog');
    const apps = get(this, 'allApps').filter((app) => get(app, 'catalogId') === catalog || get(app, 'clusterCatalogId') === catalog || get(app, 'projectCatalogId') === catalog);

    set(this, 'apps', apps);
+    const app = get(this, 'config.applyAppConfig.catalog');
+
+    if ( !apps.findBy('id', app) ) {
+      set(this, 'config.applyAppConfig.catalog', null);
+    }
  }),

  namespaceDidChange: observer('namespace.id', 'namespace.name', function() {
@ -103,16 +110,16 @@ export default Component.extend(Step, {
    }));

    const catalog = get(this, 'config.applyAppConfig.catalog');
-    let found ;

    if ( catalog ) {
-      found = catalogs.findBy('id', catalog);
-    } else {
-      found = get(catalogs, 'firstObject');
-    }
+      const c = get(this, 'allApps').findBy('id', catalog);

-    if ( found ) {
-      set(this, 'config.applyAppConfig.catalog', get(found, 'id'))
+      if ( c ) {
+        set(this, 'selectedCatalog', get(c, 'catalogId'));
+        this.appDidChange();
+      }
+    } else {
+      set(this, 'selectedCatalog', get(get(catalogs, 'firstObject'), 'id'))
    }
  },

--- a/lib/pipeline/addon/components/steps/step-apply-catalog/template.hbs
+++ b/lib/pipeline/addon/components/steps/step-apply-catalog/template.hbs
@ -12,22 +12,22 @@
        class="form-control"
        content=catalogs
        allowCustom=true
-        value=config.applyAppConfig.catalog
+        value=selectedCatalog
        optionValuePath="id"
        optionLabelPath="name"
      }}
    </div>
    <div class="col span-6">
-      <label class='acc-label pb-5'>{{t 'newPipelineStep.stepType.applyApp.name.label'}}{{field-required}}</label>
+      <label class='acc-label pb-5'>{{t 'newPipelineStep.stepType.applyApp.template.label'}}{{field-required}}</label>
      {{searchable-select
        class="form-control"
        content=apps
        allowCustom=true
-        value=config.applyAppConfig.name
+        value=config.applyAppConfig.catalog
        optionValuePath="id"
        optionLabelPath="name"
      }}
-      <p class="text-info text-small m-0">{{t 'newPipelineStep.stepType.applyApp.name.helpText'}}</p>
+      <p class="text-info text-small m-0">{{t 'newPipelineStep.stepType.applyApp.template.helpText'}}</p>
    </div>
  </div>
  <div class='row'>
@ -51,6 +51,12 @@
        <p class="text-info text-small m-0">{{t 'newPipelineStep.stepType.applyApp.targetNamespace.helpText'}}</p>
    </div>
  </div>
+  <div class='row'>
+    <div class="col span-6">
+      <label class='acc-label pb-5'>{{t 'newPipelineStep.stepType.applyApp.name.label'}}{{field-required}}</label>
+      {{input class="form-control" value=config.applyAppConfig.name placeholder=(t 'newPipelineStep.stepType.applyApp.name.placeholder')}}
+    </div>
+  </div>
  <div>
    {{form-key-value
      initialMap=config.applyAppConfig.answers
@ -59,7 +65,7 @@
      addActionLabel="newCatalog.answers.addAction"
    }}
  </div>
-  {{#advanced-section}}  
+  {{#advanced-section}}
    {{pipeline-condition type="step" config=config.when}}
  {{/advanced-section}}
  {{top-errors errors=errors}}
--- a/lib/pipeline/translations/en-us.yaml
+++ b/lib/pipeline/translations/en-us.yaml
@ -100,54 +100,57 @@ newPipelineStep:
        http: '<code>USERNAME</code> and <code>PASSWORD</code> in the secret will be used as username and password.'
        ssh: '<code>DEPLOY_KEY</code> in the secret will be used as deploy key.'
      stepName: Publish Catalog App
-      targets: 
+      targets:
        label: Protocal
        http: Push to Git with HTTP(S)
        ssh: Push to Git with SSH
-      path: 
+      path:
        label: Chart Folder
        placeholder: e.g. ./charts/wordpress/latest
        helpText: 'The folder path where <code style="padding: 2px 5px;">Chart.yaml</code> is in the repository.'
-      catalog: 
+      catalog:
        label: Catalog App Name
        placeholder: e.g. wordpress
        helpText: The name of the app want to publish.
-      version: 
+      version:
        label: Catalog App Version
        placeholder: e.g. latest
        helpText: The version of the app you want to publish.
-      gitUrl: 
+      gitUrl:
        label: Git URL
-        placeholder: 
+        placeholder:
          ssh: e.g. git@github.com:myrepo/charts.git
          http: e.g. https://github.com/myrepo/charts.git
        helpText: The Git URL where the app will be published to.
        error: The Git URL should start with http or https.
-      gitBranch: 
+      gitBranch:
        label: Git Branch
        placeholder: e.g. dev
        helpText: The Git branch which the app will be published to.
-      gitAuthor: 
+      gitAuthor:
        label: Author Name
        placeholder: e.g. user
        helpText: The author name used in the commit message.
-      gitEmail: 
+      gitEmail:
        label: Author Email
        placeholder: user@example.com
        helpText: The author email used in the commit message.

-        
+
    applyApp:
      label: Deploy App
      stepName: Deploy Catalog App
-      catalog: 
+      catalog:
        label: Catalog
-      version: 
-        label: App Version
+      template:
+        label: Template Name
+        helpText: You can select an existing template or input a new template name.
+      version:
+        label: Template Version
        helpText: You can select an existing version or input a new version.
-      name: 
+      name:
        label: App Name
-        helpText: You can select an existing app or input a new name.
+        placeholder: e.g. myapp
      targetNamespace:
        label: Namespace
        helpText: The target namespace where you want to deploy this app.
@ -274,7 +277,7 @@ authPage:
      clientSecret:
        labelText: Client Secret
  bitbucketcloud:
-    target: 
+    target:
      header: '1. Choose the Bitbucket type you want to use'
      bitbucketserver: 'Use private Bitbucket Server steup'
      bitbucketcloud: 'Use public Bitbucket Cloud'
@ -299,7 +302,7 @@ authPage:
  bitbucketserver:
    warning: Bitbucket server webhooks need to do SSL verification, please ensure that {appName} server’s certificate is trusted by the bitbucket server. More info can be found <a href="https://rancher.com/docs/rancher/v2.x/en/tools/pipelines/configurations/#1-configuring-version-control-providers" target="_blank" rel="nofollow noopener noreferrer">here</a>.
    copy: Click the icon to copy it
-    target: 
+    target:
      header: '1. Choose the Bitbucket type you want to use'
      bitbucketserver: 'Use private Bitbucket Server steup'
      bitbucketcloud: 'Use public Bitbucket Cloud'
--- a/lib/pipeline/translations/zh-hans.yaml
+++ b/lib/pipeline/translations/zh-hans.yaml
@ -139,12 +139,15 @@ newPipelineStep:
      stepName: 部署应用
      catalog:
        label: 应用商店
+      template:
+        label: 应用模版
+        helpText: 你可以选择一个已有应用模版或者输入一个新的模版。
      version:
-        label: 版本
+        label: 模版版本
        helpText: 你可以选择一个已有版本或者输入一个新的版本。
      name:
        label: 应用名称
-        helpText: 你可以选择一个已有应用或者输入一个新的应用。
+        placeholder: 例如：myapp
      targetNamespace:
        label: 命名空间
        helpText: 部署应用的命名空间。