Connecting Custom Cordova Plugin in Native vue app

Question

I have created a custom plugin based on this.

Here is my config.xml

<?xml version='1.0' encoding='utf-8'?>
<plugin id="cordova-plugin-nets" version="1.0.0" xmlns="http://apache.org/cordova/ns/plugins/1.0" xmlns:android="http://schemas.android.com/apk/res/android">
    <name>NetsPlugin</name>
    <js-module name="NetsPlugin" src="www/NetsPlugin.js">
        <clobbers target="cordova.plugins.NetsPlugin" />
    </js-module>
    <platform name="android">
        <config-file target="res/xml/config.xml" parent="/*">
            <feature name="NetsPlugin">
                <param name="android-package" value="cordova.plugin.NetsPlugin" />
            </feature>
        </config-file>
        <source-file src="src/android/NetsPlugin.java" target-dir="src/cordova/plugin/nets" />
        <framework src="src/android/frameworks/nets-android.gradle" custom="true" type="gradleReference"/>
        <resource-file src="libs/nofsdk.aar" target="libs/nofsdk.aar"/>
        <resource-file src="libs/nofsdk.aar" target="app/src/main/libs/nofsdk.aar"/>
    </platform>
</plugin>

This is NetsPlugin.js

var exec = require('cordova/exec');
var PLUGIN_NAME = 'NetsPlugin';

var NetsPlugin = {
    echo: function(arg, success, error) {
        exec(success, error, PLUGIN_NAME, 'echo', [arg]);
    },
    Registration : function(success, error) {
        exec(success, error, PLUGIN_NAME, 'Registration', []);
    }
}

module.exports = NetsPlugin;

This is NetsPlugin.java

package cordova.plugin.nets;

import org.apache.cordova.CordovaPlugin;
import org.apache.cordova.CallbackContext;
import org.json.JSONArray;
import org.json.JSONException;

public class NetsPlugin extends CordovaPlugin {

    @Override
    public boolean execute(String action, JSONArray args, CallbackContext callbackContext) throws JSONException {
        if (action.equals("Registration")) {
            // callbackContext.success(result);
            callbackContext.success("Hello from NetsPlugin!");
            return true;
        }
        return false;
    }
}

this is my method in page.vue

     callNetsPlugin: ->
        if cordova?
          if cordova.plugins?
            if cordova.plugins.NetsPlugin?
              cordova.plugins.NetsPlugin.Registration (result) ->
                console.log result, "Registration"
                @testtext = "NETS"
              , (error) =>
                console.error error
                @testtext = "NETS_ERROR"
            else
              console.log 'NetsPlugin is not available'
              @testtext = "NETSPLUGIN_NOT"
          else
            console.log 'Cordova plugins not available.'
            @testtext = "CORDOVA_PLUGINS_NOT"
        else
          console.log 'Cordova not available.'
          @testtext = "CORDOVA_NOT"
      callWindowNetsPlugin: ->
        if window.cordova?
          if window.cordova.plugins?
            if window.cordova.plugins.NetsPlugin?
              window.cordova.plugins.NetsPlugin.Registration (result) ->
                console.log result, "Registration"
                @testtext2 = "NETS"
              , (error) =>
                console.error error
                @testtext2 = "NETS_ERROR"
            else
              console.log 'NetsPlugin is not available'
              @testtext2 = "NETSPLUGIN_NOT"
          else
            console.log 'Cordova plugins not available.'
            @testtext2 = "CORDOVA_PLUGINS_NOT"
        else
          console.log 'Cordova not available.'
          @testtext2 = "CORDOVA_NOT"
    data: ->
      testtext: "cordova_nets"
      testtext2: "window_nets"

both testtext and testtext2 is showing the default value which is cordova_nets and window_nets and not updated to any of the debug value

Note: The if else block is used to check if the cordova plugin is loaded