mirror of https://github.com/nocodb/nocodb
You can not select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
110 lines
2.7 KiB
110 lines
2.7 KiB
<template> |
|
<div> |
|
<v-toolbar dense> |
|
<v-spacer /> |
|
<v-btn outlined x-small :disabled="!index" @click="prev"> |
|
Prev |
|
</v-btn> |
|
<v-btn outlined x-small :disabled="index===history.length -1" @click="next"> |
|
Next |
|
</v-btn> |
|
</v-toolbar> |
|
<div id="editor" style="height:500px; width:100%;position: relative"> |
|
<div ref="diff" /> |
|
</div> |
|
</div> |
|
</template> |
|
|
|
<script> |
|
|
|
// import ace from 'ace-builds' |
|
// |
|
import AceDiff from 'ace-diff' |
|
/// / optionally, include CSS, or use your own |
|
import 'ace-diff/dist/ace-diff.min.css' |
|
// Or use the dark mode |
|
// import 'ace-diff/dist/ace-diff-dark.min.css'; |
|
|
|
export default { |
|
name: 'XcDiff', |
|
props: { |
|
value: String, |
|
history: Array |
|
}, |
|
data: () => ({ |
|
differ: null, |
|
index: 0, |
|
editors: null |
|
}), |
|
watch: { |
|
index(i) { |
|
if (this.editors) { |
|
this.editors.right.setValue(this.history[i]) |
|
} |
|
} |
|
}, |
|
mounted() { |
|
this.differ = new AceDiff({ |
|
element: this.$refs.diff, |
|
left: { |
|
content: this.value, |
|
copyLinkEnabled: false |
|
}, |
|
right: { |
|
content: this.history[this.index], |
|
editable: false |
|
}, |
|
diffGranularity: 'specific' |
|
|
|
}) |
|
|
|
this.editors = this.differ.getEditors() |
|
this.editors.left.on('change', () => { |
|
this.$emit('input', this.editors.left.getValue()) |
|
}) |
|
// |
|
// this.editors.left.session.setOptions({tabSize: 2, useSoftTabs: true}); |
|
// this.editors.right.session.setOptions({tabSize: 2, useSoftTabs: true}); |
|
}, |
|
methods: { |
|
prev() { |
|
this.index && --this.index |
|
}, |
|
next() { |
|
if (this.index < this.history.length - 1) { ++this.index } |
|
} |
|
} |
|
} |
|
</script> |
|
|
|
<style scoped> |
|
/deep/ *, /deep/ div { |
|
font-size: 12px !important; |
|
font-family: monospace !important; |
|
word-spacing: 0; |
|
} |
|
</style> |
|
<!-- |
|
/** |
|
* @copyright Copyright (c) 2021, Xgene Cloud Ltd |
|
* |
|
* @author Naveen MR <oof1lab@gmail.com> |
|
* @author Pranav C Balan <pranavxc@gmail.com> |
|
* |
|
* @license GNU AGPL version 3 or any later version |
|
* |
|
* This program is free software: you can redistribute it and/or modify |
|
* it under the terms of the GNU Affero General Public License as |
|
* published by the Free Software Foundation, either version 3 of the |
|
* License, or (at your option) any later version. |
|
* |
|
* This program is distributed in the hope that it will be useful, |
|
* but WITHOUT ANY WARRANTY; without even the implied warranty of |
|
* MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the |
|
* GNU Affero General Public License for more details. |
|
* |
|
* You should have received a copy of the GNU Affero General Public License |
|
* along with this program. If not, see <http://www.gnu.org/licenses/>. |
|
* |
|
*/ |
|
-->
|
|
|