With Vue.Js How can I call data from Backend into Modal in FrontEnd - vue.js

Question

In the image below, I call the current version with the Component from the Result field, but I cannot print the cloned project to the modal on the right. If anyone has an idea on how to fix this I would be very happy.
// COMPARE ACTION
GetCompareListByProject() {
// var _projectNo = this.$route.params.name;
var _this = this;
axios
.post(
GetURL() +
"Electric/GetVersionListByProject/" +
"-" +
"/" +
this.CloneSourceProjectNo
)
.then((resp) => {
if (resp.data.Response == true) {
var revisionList = [];
var data = resp.data.Data;
for (var i = 0; i < data.length; i++) {
if (revisionList.indexOf(data[i].RevisionNo) < 0)
revisionList.push(data[i].RevisionNo);
}
_this.CloneModalList = {
Revisions: revisionList,
Data: data,
};
_this.CloneNewNumber = {
Revision: resp.data.Revision,
Version: resp.data.Version,
};
}
});
},
CompareVersion() {
axios
.post(
GetURL() +
"Electric/OpenElectricProjectById/" +
this.OpenModalSelected.Id
)
.then((resp) => {
console.log(resp.data);
this.$store.state.project.ProjectTab.filter(
(p) => p.title == "Electric"
)[0].form = resp.data.Data.InputMain[0];
this.$store.state.project.Models.Project.Transformer.Electric =
resp.data.Data.Electric;
this.$store.state.general.ProjectMessage =
"Opened Version R" +
resp.data.Data.InputMain[0].RevisionNo +
"V" +
resp.data.Data.InputMain[0].VersionNo;
this.$swal({
position: "top-end",
icon: "success",
title: "Project Opened",
showConfirmButton: false,
timer: 1500,
});
this.$store.state.general.isLoading = false;
});
<script src="https://cdnjs.cloudflare.com/ajax/libs/vue/2.5.17/vue.js"></script>
<b-modal
size="xl modal-full"
id="modal-compare"
title="Compare Project"
ok-only
ok-variant="secondary"
ok-title="Cancel"
>
<b-card class="w-50 h-10" style="float: left">
<b-tabs class="tabList" v-model="tabIndex">
<b-tab
#click="SetTabType('Result')"
v-for="(elec, index) in $store.state.project.Models.Project
.Transformer.Electric"
:key="index"
:active="index == 0"
>
<!-- <template #title>
<span class="line-tab">|</span>
{{ GetResultPageTitle(elec, index) }}
</template> -->
<ResultParameters
:Electric="elec"
:InputMain="
$store.state.project.Models.Project.Transformer.InputMain[0]
"
style="overflow-x: auto"
>
</ResultParameters>
</b-tab>
</b-tabs>
</b-card>
<b-card class="w-50 h-10" style="float: right">
<b-form-group
class="mb-0"
label-cols-sm="12"
label-cols-xl="4"
label="Clone Project"
label-class="text-left"
>
<b-input-group>
<b-input v-model="CloneSourceProjectNo"></b-input>
<b-input-group-append>
<b-input-group-text
style="cursor: pointer"
#click="GetCompareListByProject"
><i class="fa fa-sync-alt"></i
></b-input-group-text>
</b-input-group-append>
<b-button
class="w-100 waterGreen"
style="margin-top: 5px"
#ok="CompareVersion"
:ok-disabled="CompareModalSelected == null"
>
<i class="fa fa-bars"></i> Compare
</b-button>
</b-input-group>
</b-form-group>
<div class="mt-2"></div>
<div
v-for="rev in CloneModalList.Revisions"
:key="rev"
class="tree-view"
>
<h5>R{{ rev }}</h5>
<div
class="tree-item"
v-for="vers in CloneModalList.Data.filter(
(x) => x.RevisionNo == rev
)"
:key="vers.Id"
>
<span :class="GetInput().Id == vers.Id ? 'font-weight-bold' : ''">
<i
class="fas fa-check-circle releasedVersIcon"
v-if="vers.ActiveVersion"
></i>
V{{ vers.VersionNo }} : {{ vers.Description }}
<b-radio
:value="vers"
v-model="CompareModalSelected"
style="width: 16px; float: right; margin-top: -1px"
></b-radio>
</span>
</div>
</div>
</b-card>
</b-modal>