You are viewing a plain text version of this content. The canonical link for it is here.
Posted to commits@airavata.apache.org by di...@apache.org on 2019/01/15 20:40:48 UTC
[airavata-django-portal] branch master updated: Adding edit parser
view
This is an automated email from the ASF dual-hosted git repository.
dimuthuupe pushed a commit to branch master
in repository https://gitbox.apache.org/repos/asf/airavata-django-portal.git
The following commit(s) were added to refs/heads/master by this push:
new a079ca2 Adding edit parser view
a079ca2 is described below
commit a079ca2e2a93df1e0fc0ef29838b15410e4d15e6
Author: Dimuthu Wannipurage <di...@gmail.com>
AuthorDate: Tue Jan 15 15:40:40 2019 -0500
Adding edit parser view
---
django_airavata/apps/api/serializers.py | 4 +-
.../static/django_airavata_api/js/models/Parser.js | 3 +-
.../js/containers/ParserEditContainer.vue | 43 +++++
.../js/parser-components/ParserEditor.vue | 187 +++++++++++++++++++++
.../js/parser-components/ParserList.vue | 3 +-
.../js/parser-components/ParserListItem.vue | 5 +
.../js/parser-edit-entry-point.js | 25 +++
.../django_airavata_dataparsers/edit-parser.html | 19 +++
django_airavata/apps/dataparsers/urls.py | 7 +-
django_airavata/apps/dataparsers/views.py | 5 +
django_airavata/apps/dataparsers/webpack.config.js | 1 +
11 files changed, 294 insertions(+), 8 deletions(-)
diff --git a/django_airavata/apps/api/serializers.py b/django_airavata/apps/api/serializers.py
index a249575..97d1344 100644
--- a/django_airavata/apps/api/serializers.py
+++ b/django_airavata/apps/api/serializers.py
@@ -764,9 +764,7 @@ class StorageResourceSerializer(
class ParserSerializer(thrift_utils.create_serializer_class(Parser)):
- url = FullyEncodedHyperlinkedIdentityField(
+ url = FullyEncodedHyperlinkedIdentityField(
view_name='django_airavata_api:parser-detail',
lookup_field='id',
lookup_url_kwarg='parser_id')
- creationTime = UTCPosixTimestampDateTimeField()
- updateTime = UTCPosixTimestampDateTimeField()
diff --git a/django_airavata/apps/api/static/django_airavata_api/js/models/Parser.js b/django_airavata/apps/api/static/django_airavata_api/js/models/Parser.js
index 99ecadc..9f0d707 100644
--- a/django_airavata/apps/api/static/django_airavata_api/js/models/Parser.js
+++ b/django_airavata/apps/api/static/django_airavata_api/js/models/Parser.js
@@ -18,7 +18,8 @@ const FIELDS = [
name: "outputFiles",
list: true,
type: ParserOutputFile
- }
+ },
+ "gatewayId"
];
export default class Parser extends BaseModel {
diff --git a/django_airavata/apps/dataparsers/static/django_airavata_dataparsers/js/containers/ParserEditContainer.vue b/django_airavata/apps/dataparsers/static/django_airavata_dataparsers/js/containers/ParserEditContainer.vue
new file mode 100644
index 0000000..cde65ca
--- /dev/null
+++ b/django_airavata/apps/dataparsers/static/django_airavata_dataparsers/js/containers/ParserEditContainer.vue
@@ -0,0 +1,43 @@
+<template>
+ <parser-editor v-if="parser" :parser="parser" @saved="handleSaved" @cancelled="handleCancelled"></parser-editor>
+</template>
+
+<script>
+
+import ParserEditor from '../parser-components/ParserEditor.vue';
+
+import { models, services } from 'django-airavata-api'
+import { components as comps } from 'django-airavata-common-ui'
+
+export default {
+ name: 'parser-edit-container',
+ props: {
+ parserId: {
+ type: String,
+ required: true,
+ }
+ },
+ data () {
+ return {
+ parser: null,
+ }
+ },
+ components: {
+ ParserEditor,
+ },
+ methods: {
+ handleSaved: function(parser) {
+ window.location.assign("/dataparsers/");
+ },
+ handleCancelled: function(parser) {
+ window.location.assign("/dataparsers/");
+ },
+ },
+ computed: {
+ },
+ mounted: function () {
+ services.ParserService.retrieve({lookup: this.parserId})
+ .then(parser => this.parser = parser);
+ },
+}
+</script>
diff --git a/django_airavata/apps/dataparsers/static/django_airavata_dataparsers/js/parser-components/ParserEditor.vue b/django_airavata/apps/dataparsers/static/django_airavata_dataparsers/js/parser-components/ParserEditor.vue
new file mode 100644
index 0000000..eced810
--- /dev/null
+++ b/django_airavata/apps/dataparsers/static/django_airavata_dataparsers/js/parser-components/ParserEditor.vue
@@ -0,0 +1,187 @@
+<template>
+ <div>
+ <div class="row">
+ <div class="col">
+ <h1 class="h4 mb-4">{{ title }}</h1>
+ </div>
+ </div>
+ <div class="row">
+ <div class="col">
+ <div class="card">
+ <div class="card-body">
+
+ <b-alert :variant="showDismissibleAlert.variant" dismissible :show="showDismissibleAlert.dismissable" @dismissed="showDismissibleAlert.dismissable=false">
+ {{ showDismissibleAlert.message }}
+ </b-alert>
+
+ <b-form>
+
+ <b-form-group id="group1" label="Parser Name:" label-for="parser_name" description="Name should only contain Alpha Characters">
+ <b-form-input id="parser_name" type="text" v-model="localParser.id" required placeholder="Enter parser name">
+ </b-form-input>
+ </b-form-group>
+
+ <b-form-group id="group2" label="Docker Image:" label-for="docker-image">
+ <b-form-input id="docker-image" type="text" v-model="localParser.imageName" required placeholder="Enter the Docker Image name">
+ </b-form-input>
+ </b-form-group>
+
+ <b-form-group id="group3" label="Input Data Directory:" label-for="input-path">
+ <b-form-input id="input-path" type="text" v-model="localParser.inputDirPath" required placeholder="Enter input directory of the container">
+ </b-form-input>
+ </b-form-group>
+
+ <b-form-group id="group4" label="Output Data Directory:" label-for="output-path">
+ <b-form-input id="output-path" type="text" v-model="localParser.outputDirPath" required placeholder="Enter output directory of the container">
+ </b-form-input>
+ </b-form-group>
+ </b-form>
+
+ </div>
+ </div>
+ </div>
+ </div>
+
+ <div class="row">
+ <div class="col">
+ <div class="card">
+ <div class="card-body">
+ <list-layout :items="localParser.inputFiles" title="Inputs" new-item-button-text="New Input"
+ @add-new-item="createInput">
+ <template slot="item-list" slot-scope="slotProps">
+
+ <b-table hover :fields="parserInputFields" :items="slotProps.items">
+ </b-table>
+ </template>
+ </list-layout>
+ </div>
+ </div>
+ </div>
+ </div>
+
+ <div class="row">
+ <div class="col">
+ <div class="card">
+ <div class="card-body">
+ <list-layout :items="localParser.outputFiles" title="Outputs" new-item-button-text="New Output"
+ @add-new-item="createOutput">
+ <template slot="item-list" slot-scope="slotProps">
+ <b-table hover :fields="parserOutputFields" :items="slotProps.items">
+ </b-table>
+ </template>
+ </list-layout>
+ </div>
+ </div>
+ </div>
+ </div>
+ <div class="row">
+ <div class="col d-flex justify-content-end">
+ <b-button variant="primary" @click="saveParser">Save</b-button>
+ <b-button v-if="parser" class="ml-2" variant="danger" @click="removeParser">Delete</b-button>
+ <b-button class="ml-2" variant="secondary" @click="cancel">Cancel</b-button>
+ </div>
+ </div>
+ </div>
+</template>
+
+<script>
+import { models, services } from "django-airavata-api";
+import { components as comps, layouts } from "django-airavata-common-ui";
+
+export default {
+ props: {
+ parser: {
+ type: models.Parser,
+ required: true
+ }
+ },
+ data() {
+ return {
+ localParser: this.parser.clone(),
+ service: services.ServiceFactory.service("Parsers"),
+ showDismissibleAlert: {
+ variant: "success",
+ message: "no data",
+ dismissable: false
+ },
+ parserInputFields: [
+ {
+ label: "Name",
+ key: "name"
+ },
+ {
+ label: "Required",
+ key: "requiredInput"
+ },
+ {
+ label: "Type",
+ key: "type"
+ },
+ {
+ label: "Action",
+ key: "action"
+ }
+ ],
+ parserOutputFields: [
+ {
+ label: "Name",
+ key: "name"
+ },
+ {
+ label: "Required",
+ key: "requiredOutput"
+ },
+ {
+ label: "Type",
+ key: "type"
+ },
+ {
+ label: "Action",
+ key: "action"
+ }
+ ]
+ };
+ },
+ computed: {
+ title: function() {
+ return this.parser
+ ? this.parser.id
+ : "New Parser";
+ }
+ },
+ components: {
+ "list-layout": layouts.ListLayout,
+ },
+ methods: {
+ submitForm() {
+ },
+ createInput: function() {
+
+ },
+ createOutput: function() {
+
+ },
+ saveParser: function() {
+ var persist = null;
+ if (this.parser) {
+ persist = this.service.update({ data: this.localParser, lookup: this.parser.id });
+ } else {
+ //persist = this.service.create({ data: this.localParser }).then(data => {
+ // Merge sharing settings with default sharing settings created when
+ // Group Resource Profile was created
+ //const savedPArserId = data.id;
+ // });
+ }
+ persist.then(data => {
+ this.$emit("saved");
+ });
+ },
+ removeParser: function() {
+
+ },
+ cancel: function() {
+ this.$emit("cancelled");
+ }
+ }
+};
+</script>
diff --git a/django_airavata/apps/dataparsers/static/django_airavata_dataparsers/js/parser-components/ParserList.vue b/django_airavata/apps/dataparsers/static/django_airavata_dataparsers/js/parser-components/ParserList.vue
index 18e7326..c60d7fe 100644
--- a/django_airavata/apps/dataparsers/static/django_airavata_dataparsers/js/parser-components/ParserList.vue
+++ b/django_airavata/apps/dataparsers/static/django_airavata_dataparsers/js/parser-components/ParserList.vue
@@ -4,9 +4,10 @@
<table class="table table-hover">
<thead>
<tr>
- <th>Id</th>
+ <th>Name</th>
<th>Image Name</th>
<th>Execution Command</th>
+ <th>Actions</th>
</tr>
</thead>
<tbody>
diff --git a/django_airavata/apps/dataparsers/static/django_airavata_dataparsers/js/parser-components/ParserListItem.vue b/django_airavata/apps/dataparsers/static/django_airavata_dataparsers/js/parser-components/ParserListItem.vue
index 5cc382c..5911e39 100644
--- a/django_airavata/apps/dataparsers/static/django_airavata_dataparsers/js/parser-components/ParserListItem.vue
+++ b/django_airavata/apps/dataparsers/static/django_airavata_dataparsers/js/parser-components/ParserListItem.vue
@@ -3,6 +3,11 @@
<td>{{ parser.id }}</td>
<td>{{ parser.imageName }}</td>
<td>{{ parser.executionCommand }}</td>
+ <td>
+ <a :href="'/dataparsers/edit/' + encodeURIComponent(parser.id) + '/'">
+ Edit <i class="fa fa-pencil"></i>
+ </a>
+ </td>
</tr>
</template>
diff --git a/django_airavata/apps/dataparsers/static/django_airavata_dataparsers/js/parser-edit-entry-point.js b/django_airavata/apps/dataparsers/static/django_airavata_dataparsers/js/parser-edit-entry-point.js
new file mode 100644
index 0000000..23fbd4c
--- /dev/null
+++ b/django_airavata/apps/dataparsers/static/django_airavata_dataparsers/js/parser-edit-entry-point.js
@@ -0,0 +1,25 @@
+import Vue from 'vue'
+import BootstrapVue from 'bootstrap-vue'
+import ParserEditContainer from './containers/ParserEditContainer.vue'
+// This is imported globally on the website so no need to include it again in this view
+// import 'bootstrap/dist/css/bootstrap.css'
+import 'bootstrap-vue/dist/bootstrap-vue.css'
+
+Vue.use(BootstrapVue);
+
+new Vue({
+ el: "#edit-parser",
+ template: '<parser-edit-container :parserId="parserId"></parser-edit-container>',
+ data: {
+ parserId: null,
+ },
+ components: {
+ ParserEditContainer,
+ },
+ beforeMount: function() {
+ if (this.$el.dataset.parserId) {
+ this.parserId = this.$el.dataset.parserId;
+ console.log("parserId", this.parserId);
+ }
+ }
+})
diff --git a/django_airavata/apps/dataparsers/templates/django_airavata_dataparsers/edit-parser.html b/django_airavata/apps/dataparsers/templates/django_airavata_dataparsers/edit-parser.html
new file mode 100644
index 0000000..b3aa16c
--- /dev/null
+++ b/django_airavata/apps/dataparsers/templates/django_airavata_dataparsers/edit-parser.html
@@ -0,0 +1,19 @@
+{% extends './base.html' %}
+
+{% load static %}
+
+{% block css %}
+{{ block.super }}
+<link rel=stylesheet type=text/css href="{% static 'django_airavata_dataparsers/dist/parser-edit.css' %}">
+{% endblock %}
+
+{% block content %}
+
+<div id="edit-parser" data-parser-id="{{ parser_id }}"></div>
+
+{% endblock content %}
+
+{% block scripts %}
+{{ block.super }}
+<script src="{% static "django_airavata_dataparsers/dist/parser-edit.js" %}"></script>
+{% endblock %}
diff --git a/django_airavata/apps/dataparsers/urls.py b/django_airavata/apps/dataparsers/urls.py
index c25bfa6..b38e28f 100644
--- a/django_airavata/apps/dataparsers/urls.py
+++ b/django_airavata/apps/dataparsers/urls.py
@@ -5,7 +5,8 @@ from . import views
app_name = 'django_airavata_dataparsers'
urlpatterns = [
- url(r'^home$', views.home, name='home'),
- url(r'^parsers/(?P<parser_id>[^/]+)/$',
- views.parser_details, name="parser_details")
+ url(r'^$', views.home, name='home'),
+ url(r'^parsers/(?P<parser_id>[^/]+)/$', views.parser_details, name="parser_details"),
+ url(r'^edit/(?P<parser_id>[^/]+)/$', views.edit_parser, name='edit_parser'),
+
]
diff --git a/django_airavata/apps/dataparsers/views.py b/django_airavata/apps/dataparsers/views.py
index 963ba1a..e10cb61 100644
--- a/django_airavata/apps/dataparsers/views.py
+++ b/django_airavata/apps/dataparsers/views.py
@@ -16,3 +16,8 @@ def parser_details(request, parser_id):
return render(request, 'django_airavata_dataparsers/parser-details.html', {
"parser_id": parser_id
})
+
+def edit_parser(request, parser_id):
+ return render(request, 'django_airavata_dataparsers/edit-parser.html', {
+ "parser_id": parser_id
+ })
diff --git a/django_airavata/apps/dataparsers/webpack.config.js b/django_airavata/apps/dataparsers/webpack.config.js
index 4f80fd0..5654544 100644
--- a/django_airavata/apps/dataparsers/webpack.config.js
+++ b/django_airavata/apps/dataparsers/webpack.config.js
@@ -7,6 +7,7 @@ module.exports = {
entry: {
'parser-details': './static/django_airavata_dataparsers/js/entry-parser-details',
'parser-list': './static/django_airavata_dataparsers/js/parser-listing-entry-point.js',
+ 'parser-edit': './static/django_airavata_dataparsers/js/parser-edit-entry-point.js'
},
output: {
path: path.resolve(__dirname, './static/django_airavata_dataparsers/dist/'),