-<template>\r
-<div class="col-md-offset-1 col-md-10" style="margin-top: 20px;">\r
- <ul class="nav nav-tabs">\r
- <li class="active"><a data-toggle="tab" data-target="#step-pane">Step</a></li>\r
- <li><a data-toggle="tab" data-target="#flow-pane">Flow</a></li>\r
- </ul>\r
- <div class="tab-content">\r
- <div id="step-pane" class="tab-pane active fade in">\r
- <br>\r
- <div class="row">\r
- <div class='col-md-12'>\r
- <step v-bind:stepList="stepList" v-on:stepList="getStepList"></step>\r
- </div>\r
- </div>\r
- </div>\r
- <div id="flow-pane" class="tab-pane fade">\r
- <br>\r
- <div class="row">\r
- <div class='col-md-12'>\r
- <div class="row">\r
- <button style='margin-left:20px; margin-bottom: 30px;' class="btn btn-success" type="button" id="new-flow" v-on:click='addSubflow'> <span class="bold">ADD FLOW</span></button>\r
- </div>\r
- <div class='row'>\r
- <div class='col-md-2'>\r
- <ul id="flow-tabs">\r
- <li class="active"><a data-toggle="tab" data-target="#flow-main">main</a></li>\r
- <li v-for="subflow in subflowList"><a data-toggle="tab" v-bind:data-target="'#' + subflow.tabId">{{ subflow.name }}</a></li>\r
- </ul>\r
- </div>\r
- <div class="col-md-10">\r
- <div class="tab-content">\r
- <div id="flow-main" class="tab-pane active fade in">\r
- <flow v-model='mainflowName' v-bind:orderList='mainOrdersList' v-bind:stepsRefs='stepNameList' v-bind:flowsRefs='flowNameList' v-on:orderList='updateOrderList($event, mainflowName)'>\r
- </flow>\r
- </div>\r
- <div v-for="subflow in subflowList" v-bind:id="subflow.tabId" class="tab-pane fade">\r
- <flow v-model='subflow.name' v-bind:orderList='subflow.orderList' v-bind:stepsRefs='stepNameList' v-bind:flowsRefs='flowNameList' v-on:orderList='updateOrderList($event, subflow.name)'></flow>\r
- </div>\r
- </div>\r
- </div>\r
- </div>\r
- </div>\r
- </div>\r
- </div>\r
- </div>\r
-</div>\r
-</template>\r
-<script>\r
-import '../../assets/css/editor.css'\r
-import step from './step.vue'\r
-import flow from './flow.vue'\r
-import showMessage from '../message/showMessage.js'\r
-export default {\r
- name: 'editor',\r
- props: ['saveSignal', 'stepList', 'mainOrdersList', 'subflowList'],\r
- model: {\r
- prop: 'saveSignal',\r
- event: 'saveResponse'\r
- },\r
- data: function(){\r
- return {\r
- mainflowName: 'main'\r
- }\r
- },\r
- components: {\r
- step,\r
- flow\r
- },\r
- methods: {\r
- getStepList: function(stepList) {\r
- this.stepList = stepList;\r
- },\r
- addSubflow: function() {\r
- var tabid = "flow-" + Math.floor(Math.random()*(1000000));\r
- this.subflowList.push({'tabId': tabid, 'name': 'fake', 'orderList': []});\r
- },\r
- updateOrderList: function(orderList, flowName) {\r
- if(flowName == 'main') {\r
- this.mainOrdersList = orderList;\r
- } else {\r
- for(var i = 0; i < this.subflowList.length; ++i) {\r
- if(this.subflowList[i].name == flowName) {\r
- this.subflowList[i].orderList = orderList;\r
- }\r
- }\r
- }\r
- }\r
- },\r
- computed: {\r
- flowNameList: function() {\r
- var stepNameArr = [];\r
- for(var i = 0; i < this.subflowList.length; i++) {\r
- stepNameArr.push(this.subflowList[i].name);\r
- }\r
- console.log(stepNameArr);\r
- return stepNameArr;\r
- },\r
- stepNameList: function() {\r
- var stepNameArr = [];\r
- for(var i = 0; i < this.stepList.length; i++) {\r
- stepNameArr.push(this.stepList[i].name);\r
- }\r
- return stepNameArr;\r
- }\r
- },\r
- watch: {\r
- saveSignal: function(newVal) {\r
- if(newVal == true) {\r
- console.log("editor newVal true");\r
- var self = this;\r
- var msgTitle = "SAVE -- TESTCASE";\r
- $.ajax({\r
- url: this.global.SERVER_ADDR + "testcase/save",\r
- method: "POST",\r
- data: {\r
- suiteName: this.$route.query.suiteName,\r
- caseName: this.$route.query.caseName,\r
- stepList: JSON.stringify(this.stepList),\r
- subflowList: JSON.stringify(this.subflowList),\r
- mainOrdersList: JSON.stringify(this.mainOrdersList)\r
- },\r
- success: function(data) {\r
- console.log("ajax save content!");\r
- if(data['code'] == 200) {\r
- showMessage("success", msgTitle, "Save content successfully!");\r
- self.$emit('saveResponse', true);\r
- } else {\r
- showMessage(data['code'], msgTitle, "Failed to save content!", data['error']);\r
- self.$emit('saveResponse', false);\r
- }\r
- },\r
- error: function(obj, status, msg) {\r
- showMessage(status, msgTitle, "Failed to save content!", msg);\r
- self.$emit('saveResponse', false);\r
- }\r
- });\r
- }\r
- }\r
- }\r
-}\r
-</script>
\ No newline at end of file
+<template>
+<div class="col-md-offset-1 col-md-10" style="margin-top: 20px;">
+ <ul class="nav nav-tabs">
+ <li class="active"><a data-toggle="tab" data-target="#step-pane">Step</a></li>
+ <li><a data-toggle="tab" data-target="#flow-pane">Flow</a></li>
+ </ul>
+ <div class="tab-content">
+ <div id="step-pane" class="tab-pane active fade in">
+ <br>
+ <div class="row">
+ <div class='col-md-12'>
+ <step v-bind:stepList="stepList" v-on:stepList="getStepList"></step>
+ </div>
+ </div>
+ </div>
+ <div id="flow-pane" class="tab-pane fade">
+ <br>
+ <div class="row">
+ <div class='col-md-12'>
+ <div class="row">
+ <button style='margin-left:20px; margin-bottom: 30px;' class="btn btn-success" type="button" id="new-flow" v-on:click='addSubflow'> <span class="bold">ADD FLOW</span></button>
+ </div>
+ <div class='row'>
+ <div class='col-md-2'>
+ <ul id="flow-tabs">
+ <li class="active"><a data-toggle="tab" data-target="#flow-main">main</a></li>
+ <li v-for="subflow in subflowList"><a data-toggle="tab" v-bind:data-target="'#' + subflow.tabId">{{ subflow.name }}</a></li>
+ </ul>
+ </div>
+ <div class="col-md-10">
+ <div class="tab-content">
+ <div id="flow-main" class="tab-pane active fade in">
+ <flow v-model='mainflowName' v-bind:orderList='mainOrdersList' v-bind:stepsRefs='stepNameList' v-bind:flowsRefs='flowNameList' v-on:orderList='updateOrderList($event, mainflowName)'>
+ </flow>
+ </div>
+ <div v-for="subflow in subflowList" v-bind:id="subflow.tabId" class="tab-pane fade">
+ <flow v-model='subflow.name' v-bind:orderList='subflow.orderList' v-bind:stepsRefs='stepNameList' v-bind:flowsRefs='flowNameList' v-on:orderList='updateOrderList($event, subflow.name)'></flow>
+ </div>
+ </div>
+ </div>
+ </div>
+ </div>
+ </div>
+ </div>
+ </div>
+</div>
+</template>
+<script>
+import '../../assets/css/editor.css'
+import step from './step.vue'
+import flow from './flow.vue'
+import showMessage from '../message/showMessage.js'
+export default {
+ name: 'editor',
+ props: ['saveSignal', 'stepList', 'mainOrdersList', 'subflowList'],
+ model: {
+ prop: 'saveSignal',
+ event: 'saveResponse'
+ },
+ data: function(){
+ return {
+ mainflowName: 'main'
+ }
+ },
+ components: {
+ step,
+ flow
+ },
+ methods: {
+ getStepList: function(stepList) {
+ this.stepList = stepList;
+ },
+ addSubflow: function() {
+ var tabid = "flow-" + Math.floor(Math.random()*(1000000));
+ this.subflowList.push({'tabId': tabid, 'name': 'fake', 'orderList': []});
+ },
+ updateOrderList: function(orderList, flowName) {
+ if(flowName == 'main') {
+ this.mainOrdersList = orderList;
+ } else {
+ for(var i = 0; i < this.subflowList.length; ++i) {
+ if(this.subflowList[i].name == flowName) {
+ this.subflowList[i].orderList = orderList;
+ }
+ }
+ }
+ }
+ },
+ computed: {
+ flowNameList: function() {
+ var stepNameArr = [];
+ for(var i = 0; i < this.subflowList.length; i++) {
+ stepNameArr.push(this.subflowList[i].name);
+ }
+ console.log(stepNameArr);
+ return stepNameArr;
+ },
+ stepNameList: function() {
+ var stepNameArr = [];
+ for(var i = 0; i < this.stepList.length; i++) {
+ stepNameArr.push(this.stepList[i].name);
+ }
+ return stepNameArr;
+ }
+ },
+ watch: {
+ saveSignal: function(newVal) {
+ if(newVal == true) {
+ console.log("editor newVal true");
+ var self = this;
+ var msgTitle = "SAVE -- TESTCASE";
+ $.ajax({
+ url: this.global.SERVER_ADDR + "testcase/save",
+ method: "POST",
+ data: {
+ suiteName: this.$route.query.suiteName,
+ caseName: this.$route.query.caseName,
+ stepList: JSON.stringify(this.stepList),
+ subflowList: JSON.stringify(this.subflowList),
+ mainOrdersList: JSON.stringify(this.mainOrdersList)
+ },
+ success: function(data) {
+ console.log("ajax save content!");
+ if(data['code'] == 200) {
+ showMessage("success", msgTitle, "Save content successfully!");
+ self.$emit('saveResponse', true);
+ } else {
+ showMessage(data['code'], msgTitle, "Failed to save content!", data['error']);
+ self.$emit('saveResponse', false);
+ }
+ },
+ error: function(obj, status, msg) {
+ showMessage(status, msgTitle, "Failed to save content!", msg);
+ self.$emit('saveResponse', false);
+ }
+ });
+ }
+ }
+ }
+}
+</script>