168 lines
4.0 KiB
Vue
168 lines
4.0 KiB
Vue
<template>
|
|
<div>
|
|
<div class="wrapper">
|
|
<div class="jahat contianer">
|
|
<div class="jahat__content-container">
|
|
<div class="jahat__content position-relative">
|
|
<the-content-loading v-if="fetchingData"></the-content-loading>
|
|
<div v-if="canView">
|
|
<div v-if="copmareSideBySide" class="diff">
|
|
<main class="diff-main">
|
|
<code-diff
|
|
style="overflow: auto; font-family: sahel-semi-bold"
|
|
class="code-diff"
|
|
:old-string="oldStr"
|
|
:new-string="newStr"
|
|
outputFormat="side-by-side"
|
|
:context="10"
|
|
/>
|
|
</main>
|
|
</div>
|
|
<div v-if="compareLineByLine" class="diff">
|
|
<main class="diff-main">
|
|
<code-diff
|
|
style="overflow: auto; font-family: sahel-semi-bold"
|
|
class="code-diff"
|
|
:old-string="oldStr"
|
|
:new-string="newStr"
|
|
outputFormat="sline-by-line"
|
|
:context="10"
|
|
/>
|
|
</main>
|
|
</div>
|
|
</div>
|
|
<no-data v-else>
|
|
<p class="text-center p-3">
|
|
<span class="tavasi tavasi-warning-circle"></span>
|
|
عدم دسترسی
|
|
</p>
|
|
</no-data>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</template>
|
|
|
|
<script>
|
|
import entityApi from "~/apis/entityApi";
|
|
|
|
|
|
export default {
|
|
props: {
|
|
textNewId: {
|
|
default: "",
|
|
},
|
|
newTextCopied: {
|
|
default: "",
|
|
},
|
|
copmareSideBySide: {
|
|
default: true,
|
|
},
|
|
compareLineByLine: {
|
|
default: false,
|
|
},
|
|
},
|
|
|
|
|
|
beforeMount() {
|
|
this.httpService = useNuxtApp()["$http"];
|
|
},
|
|
mounted() {
|
|
this.setOldText();
|
|
this.setNewText();
|
|
},
|
|
|
|
data() {
|
|
return {
|
|
canView: true,
|
|
fetchingData: false,
|
|
oldStr: "",
|
|
newStr: "",
|
|
};
|
|
},
|
|
|
|
methods: {
|
|
getText(key, id) {
|
|
let text = "";
|
|
|
|
this.httpService.getRequest(this.prepareUrl(key, id)).then((res) => {
|
|
text = res?.text.replaceAll("\\n", "\r\n");
|
|
});
|
|
return text;
|
|
},
|
|
prepareUrl(key, id) {
|
|
let url2 = "";
|
|
|
|
let includeRgOrQaSectionInPath =
|
|
this.$route.path.includes("qasection") ||
|
|
this.$route.path.includes("rgsection");
|
|
|
|
if (includeRgOrQaSectionInPath) {
|
|
url2 = entityApi.comparison.getParent;
|
|
url2 = url2.replace("@index_key", key);
|
|
url2 = url2.replace("@parent_id", id);
|
|
} else {
|
|
url2 = entityApi.comparison.getText;
|
|
url2 = url2.replace("@index_key", key);
|
|
url2 = url2.replace("@id", id);
|
|
}
|
|
|
|
return repoUrl()+ url2;
|
|
},
|
|
setOldText() {
|
|
let key = this.$route.params.key;
|
|
let id = this.$route.params.id;
|
|
|
|
this.httpService.getRequest(this.prepareUrl(key, id)).then((res) => {
|
|
this.oldStr = res.text.replaceAll("\\n", "\r\n");
|
|
});
|
|
},
|
|
setNewText() {
|
|
if (this.textNewId) {
|
|
let key = this.$route.params.key;
|
|
let id = this.textNewId;
|
|
|
|
this.httpService.getRequest(this.prepareUrl(key, id)).then((res) => {
|
|
this.newStr = res.text.replaceAll("\\n", "\r\n");
|
|
});
|
|
} else {
|
|
this.newStr = this.newTextCopied.replaceAll("\\n", "\r\n");
|
|
}
|
|
},
|
|
},
|
|
|
|
|
|
};
|
|
</script>
|
|
|
|
<style lang="scss">
|
|
// .diff-main {
|
|
// height: calc(100vh - 170px) !important;
|
|
// overflow-y: auto;
|
|
// }
|
|
.code-diff {
|
|
font-family: "sahel-semi-bold" !important;
|
|
overflow: unset !important;
|
|
}
|
|
.d2h-diff-table {
|
|
font-family: "sahel-semi-bold" !important;
|
|
text-align: right !important;
|
|
}
|
|
.hljs {
|
|
font-family: "sahel" !important;
|
|
font-size: 1rem;
|
|
overflow-x: auto;
|
|
overflow-y: hidden;
|
|
margin-top: 5px;
|
|
margin-bottom: 5px;
|
|
max-width: 980px !important;
|
|
min-height: 80px !important;
|
|
display: flex !important;
|
|
flex-wrap: wrap !important;
|
|
}
|
|
.d2h-wrapper {
|
|
text-align: right !important;
|
|
}
|
|
</style>
|