modtool/src/components/TheServerConfig.vue

<script setup lang="ts">
import { useStore } from '@/util/store'
import { ServerConfig } from '@/util/sconfig'

const store = useStore()
let sconfig = store.sConfig;

function downloadBlob(blob: Blob, filename: string) {
  let link = document.createElement('a')
  link.href = window.URL.createObjectURL(blob)
  link.download = filename
  document.body.appendChild(link);
  link.click()
  document.body.removeChild(link);
}

async function exportConf() {
  const blob = await sconfig?.exportConfig();
  if (blob)
    downloadBlob(blob, "config.zip");
}


</script>

<template>
  <div class="card">
    <div class="card-body" v-if="sconfig != null">
      <h5 class="card-title">Server Configuration</h5>
      <div class="card-text">
        <div class="input-group mb-3">
          <div class="input-group-prepend">
            <span class="input-group-text" id="inputGroup-sizing-default">Manufacturer Name</span>
            </div>
            <input type="text" class="form-control" aria-label="Default" aria-describedby="inputGroup-sizing-default" v-model="sconfig.manufacturerName" v-bind:key="'...'">
        </div>
        <div class="input-group mb-3">
          <div class="input-group-prepend">
            <span class="input-group-text" id="inputGroup-sizing-default">Product Name</span>
            </div>
            <input type="text" class="form-control" aria-label="Default" aria-describedby="inputGroup-sizing-default" v-model="sconfig.productName" v-bind:key="'...'">
        </div>
        <div class="input-group mb-3">
          <div class="input-group-prepend">
            <span class="input-group-text" id="inputGroup-sizing-default">Software Version</span>
            </div>
            <input type="text" class="form-control" aria-label="Default" aria-describedby="inputGroup-sizing-default" v-model="sconfig.softwareVersion" v-bind:key="'...'">
        </div>
        <div class="input-group mb-3">
          <div class="input-group-prepend">
            <span class="input-group-text" id="inputGroup-sizing-default">Application Name</span>
            </div>
            <input type="text" class="form-control" aria-label="Default" aria-describedby="inputGroup-sizing-default" v-model="sconfig.applicationName" v-bind:key="'...'">
        </div>
        <div class="input-group mb-3">
          <div class="input-group-prepend">
            <span class="input-group-text" id="inputGroup-sizing-default">Application Uri</span>
            </div>
            <input type="text" class="form-control" aria-label="Default" aria-describedby="inputGroup-sizing-default" v-model="sconfig.applicationUri" v-bind:key="'...'">
        </div>
        <div class="input-group mb-3">
          <div class="input-group-prepend">
            <span class="input-group-text" id="inputGroup-sizing-default">Product Uri</span>
            </div>
            <input type="text" class="form-control" aria-label="Default" aria-describedby="inputGroup-sizing-default" v-model="sconfig.productUri" v-bind:key="'...'">
        </div>
        <div class="input-group mb-3">
          <div class="input-group-prepend">
            <span class="input-group-text" id="inputGroup-sizing-default">Port</span>
            </div>
            <input type="text" class="form-control" aria-label="Default" aria-describedby="inputGroup-sizing-default" v-model="sconfig.port" v-bind:key="4840">
        </div>
        <div class="input-group mb-3">
          <div class="input-group-prepend">
            <span class="input-group-text" id="inputGroup-sizing-default">Max Connections Per Endpoint</span>
            </div>
            <input type="text" class="form-control" aria-label="Default" aria-describedby="inputGroup-sizing-default" v-model="sconfig.maxConnections" v-bind:key="100">
        </div>
        <div class="input-group mb-3">
          <div class="input-group-prepend">
            <input type="checkbox" id="checkbox" v-model="sconfig.allowAnonymous" />
            <label for="checkbox"> Allow Anonymous</label>
          </div>
        </div>
        <div>
          <button class="btn btn-light" @click.prevent="exportConf()">OK</button>
        </div>
      </div>
    </div>
  </div>
</template>


<style scoped></style>