Update to UIX.

fe/src/App.vue

@@ -23,24 +23,32 @@ import { RouterView, useRoute } from 'vue-router'
 import { useDeviceStore } from './stores/device'
 import { isLocal } from './services/ApiService'
 import AlertComp from './components/base/AlertComp.vue'
+import { ConfigGet } from './services/ConfigService'
 
 const device = useDeviceStore()
 
 const route = useRoute()
 const handshake = ref(false)
 
-onMounted(async () => {
+onMounted(() => {
+  // const port = await ConfigGet('MCRM__PORT')
+  // console.log(port)
+
   // Setting device uuid from localstorage
   // If not present in LocalStorage a new uuidV4 will be generated
   device.uuid()
 
-  const hsReq = await device.remoteHandshake()
-  handshake.value = hsReq
+  // appHandshake()
 
   device.$subscribe(() => {
     if (device.key()) handshake.value = true
   })
 })
+
+async function appHandshake() {
+  const hsReq = await device.remoteHandshake()
+  handshake.value = hsReq
+}
 </script>
 
 <style scoped>

fe/src/components/devices/RemoteView.vue

@@ -105,7 +105,7 @@ const linkPinInput = ref()
 
 const server = reactive({
   host: '',
-  port: import.meta.env.VITE_MCRM__PORT,
+  port: window.__CONFIG__.MCRM__PORT,
   status: false,
   link: false,
   inputPin: '',
@@ -172,6 +172,7 @@ function pingLink() {
 
 async function decryptKey() {
   const decryptedKey = decryptAES(server.inputPin, server.encryptedKey)
+
   const handshake = await device.remoteHandshake(decryptedKey)
 
   if (handshake) {

fe/src/components/devices/ServerView.vue

@@ -149,7 +149,7 @@ onMounted(async () => {
   const serverIP = await device.serverGetIP()
   server.ip = serverIP
 
-  server.port = import.meta.env.VITE_MCRM__PORT
+  server.port = window.__CONFIG__.MCRM__PORT
 })
 
 async function startLink(deviceUuid) {
@@ -184,7 +184,9 @@ function resetPinLink() {
 
 function unlinkDevice(id) {
   axios.post(appUrl() + '/device/link/remove', { uuid: id }).then((data) => {
-    if (data.data) device.serverGetRemotes()
+    if (data.data) {
+      device.serverGetRemotes()
+    }
   })
 }
 </script>

fe/src/services/ApiService.js

@@ -2,7 +2,7 @@ import { useDeviceStore } from '@/stores/device'
 import CryptoJS from 'crypto-js'
 
 export const appUrl = () => {
-  const port = window.location.port == 5173 ? import.meta.env.VITE_MCRM__PORT : window.location.port
+  const port = window.location.port == 5173 ? window.__CONFIG__.MCRM__PORT : window.location.port
 
   return `http://${window.location.hostname}:${port}`
 }

fe/src/services/ConfigService.js

@@ -0,0 +1,12 @@
+import axios from 'axios'
+import { appUrl } from './ApiService'
+
+export const ConfigGet = async (key) => {
+  console.log(window.__CONFIG__)
+
+  const config = await axios.get(appUrl() + '/config.json')
+
+  if (!config.data) return false
+
+  return config.data[key]
+}

fe/src/services/EncryptService.js

@@ -5,7 +5,7 @@ import { isLocal } from './ApiService'
 export const encryptAES = (key, str) => {
   key = keyPad(key)
 
-  let iv = enc.Utf8.parse(import.meta.env.VITE_MCRM__IV)
+  let iv = enc.Utf8.parse(window.__CONFIG__.MCRM__IV)
   let encrypted = AES.encrypt(str, key, {
     iv: iv,
     padding: pad.Pkcs7,
@@ -16,7 +16,7 @@ export const encryptAES = (key, str) => {
 export const decryptAES = (key, str) => {
   key = keyPad(key)
 
-  let iv = enc.Utf8.parse(import.meta.env.VITE_MCRM__IV)
+  let iv = enc.Utf8.parse(window.__CONFIG__.MCRM__IV)
   let encrypted = AES.decrypt(str.toString(), key, {
     iv: iv,
     padding: pad.Pkcs7,
@@ -39,7 +39,7 @@ function keyPad(key) {
   let returnKey = key
 
   if (key.length == 4) {
-    returnKey = key + import.meta.env.VITE_MCRM__SALT
+    returnKey = key + window.__CONFIG__.MCRM__SALT
   }
 
   return enc.Utf8.parse(returnKey)

fe/src/stores/device.js

@@ -85,8 +85,6 @@ export const useDeviceStore = defineStore('device', () => {
     return request
   }
   const remotePingLink = async (cb) => {
-    // const linkRequest = await axios.post(appUrl() + '/device/link/ping', { uuid: deviceUuid })
-    // if (linkRequest.data)
     const pingInterval = setInterval(() => {
       axios.post(appUrl() + '/device/link/ping', { uuid: uuid() }).then((data) => {
         if (data.data) {

fe/src/stores/panel.js

@@ -20,7 +20,7 @@ export const usePanelStore = defineStore('panel', () => {
 
   const get = async (dir) => {
     const data = AuthCall({ dir: dir })
-    // alert(JSON.stringify(data))
+
     const resp = await axios.post(appUrl() + '/panel/get', data)
 
     if (!resp.data && !current.value.html) return false

fe/src/views/DevicesView.vue

@@ -4,8 +4,8 @@
       {{ isLocal() ? 'Remote devices' : 'Server' }}
     </h1>
     <div class="grid gap-8 pr-2 panel__content">
-      <ServerView />
-      <RemoteView />
+      <ServerView v-if="isLocal()" />
+      <RemoteView v-else />
     </div>
   </div>
 </template>