src/components/AdminCommands.vue

@@ -0,0 +1,69 @@
+<template>
+  <div>
+      <h3>Admin Session</h3>
+      <div v-for="request in requestCmds" :key="request.keyword"><button></button></div>
+      <div v-for="response in responses" :key="response.cnt">{{ response.data }}</div>
+  </div>
+</template>
+
+<script lang="ts">
+
+import { Component, Prop, Vue } from 'vue-property-decorator'
+import * as io from 'socket.io-client';
+
+@Component
+export default class AdminCommands extends Vue {
+  @Prop() public connection;
+  @Prop() public session;
+  idToken: string = ''
+
+  requestCmds: [
+    { keyword: 'login', label: 'getCurrentLogins' },
+    //{ keyword: 'conn',  label: 'getCurrentConnections' },
+    //{ keyword: 'sub',   label: 'getSubscriptions' },
+    // { keyword: 'req',   label: 'getRequests' },
+    // { keyword: 'res',   label: 'getResponses' },
+  ];
+  
+  socket = null
+  responses = []
+  url = 'http://localhost:3111'
+
+  connect(){
+    const socket = io.connect(this.url)
+    let cnt = 0;
+    socket.on('admin_response', (data) => {
+      cnt++;
+      this.responses.unshift({cnt, data: JSON.stringify(data,null,3)})
+    })
+
+    socket.on('connect', (ws) => {
+      console.info('admin connected', ws, socket?.id)
+    });
+
+    socket.connect();
+    this.socket = socket;
+  }
+
+  sendRequest(keyword, options = {}) {
+    this.socket.emit('admin_request',{ request: keyword, options }, (data)=>{
+      console.log({ got: data })
+    })
+  }
+
+  loginDisabled(){
+    if ( this.idToken == null ) return true
+    if ( this.connection.socketId == null ) return true
+    if ( this.session.ucpId != null ) return true
+    return false
+  }
+
+  mounted(){
+      this.connect()
+  }
+
+}
+</script>
+
+<style>
+</style>

src/components/UIClient.vue

@@ -15,6 +15,7 @@
     </div>
 
   <div class="cards">
+    <admin-commands class="card"></admin-commands>
     <google-login class="card" :session="session" :connection="connection" @loginAction="loginAction">
 
     </google-login>
@@ -148,6 +149,7 @@ import {
 import { TestSocketIoClient } from "../assets/js/__transport.socketio"
 import { Component, Prop, Vue } from 'vue-property-decorator'
 import GoogleLogin from './GoogleLogin.vue'
+import AdminCommands from './AdminCommands.vue'
 
 type Session = {
   ucpId: string,
@@ -173,7 +175,7 @@ type Subscription = {
 }
 @Component({
   components: {
-    GoogleLogin
+    GoogleLogin, AdminCommands
   }
 })
 export default class UiClient extends Vue {