1234567891011121314151617181920212223242526272829303132333435363738394041424344454647484950515253545556575859606162636465666768 |
- {% extends "base.html" %}
- {% block body %}
- <div id="app">
- <div class="md-layout">
- <div class="md-layout-item" md-card>
- <div id="diffpanel"></div>
- </div>
- </div>
- </div>
- <script>
- Vue.use(VueMaterial.default);
- var app = new Vue({
- el: '#app',
- delimiters: ['${', '}'],
- data: {
- history: [],
- difftext: '',
- id: "{{id}}",
- {% try %}
- {% if diff %}
- diff: "{{diff}}",
- {% end %}
- {% except %}
- diff: null,
- {% end %}
- {% try %}
- {% if oldid %}
- oldid: "{{oldid}}",
- {% end %}
- {% except %}
- oldid: null,
- {% end %}
- },
- mounted: function() {
- this.getDiff();
- },
- methods: {
- getDiff: function() {
- self = this;
- var data = axios.get('/api/diff/' + this.id + '/' + this.diff + '/' + (this.oldid || '')).then(function(response) {
- console.log(response);
- self.difftext = response.data.diff;
- var pretty_diff = Diff2Html.getPrettyHtml(self.difftext);
- document.getElementById('diffpanel').innerHTML = pretty_diff;
- });
- }
- }
- });
- </script>
- <style>
- body {
- background-color: white;
- }
- .md-table {
- width: 60%;
- min-height: 800px;
- max-height: 800px;
- }
- </style>
- {% end %}
|