initial vue loading

app/assets/javascripts/application.js.coffee

@@ -15,6 +15,7 @@
 #= require jquery.scrollTo
 #= require jquery.turbolinks
 #= require d3
+#= require vue.min
 #= require cal-heatmap
 #= require turbolinks
 #= require autosave

app/assets/javascripts/merge_request.js

+(function(){
+  window.onload = function() {
+    var mrHeader = new Vue({
+      el: '#merge-request-header',
+      data: {
+        status: $('.status-box').data('status')
+      },
+      created: function() {
+        console.log('created');
+      }
+    });
+
+    var mrServices = {
+
+    };
+  } 
+
+
+})()
\ No newline at end of file

app/views/projects/merge_requests/show/_mr_title.html.haml

-.detail-page-header
-  .status-box{ class: status_box_class(@merge_request) }
-    = @merge_request.state_human_name
+.detail-page-header#merge-request-header
+  .status-box{ class: status_box_class(@merge_request), data:{status: @merge_request.state_human_name} }
+  {{ status }}
   %span.identifier
     Merge Request ##{@merge_request.iid}
   %span.creator