modtool/src/components/TheDetail.vue

<script setup lang="ts">
import { useStore } from '@/util/store'
const store = useStore()
</script>

<template>
    <div class="card">
    <div class="card-body" v-if="store.selectedNode != null" :elem="store.selectedNode">
      <h5 class="card-title">Node Editor</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">DisplayName</span>
          </div>
          <input type="text" class="form-control" aria-label="Default" aria-describedby="inputGroup-sizing-default" v-model="store.selectedNode.displayName">
        </div>
        <div class="input-group mb-3">
          <div class="input-group-prepend">
            <span class="input-group-text" id="inputGroup-sizing-default">BrowseName</span>
          </div>
          <input type="text" class="form-control" aria-label="Default" aria-describedby="inputGroup-sizing-default" v-model="store.selectedNode.browseName">
        </div>
        <div class="input-group mb-3">
          <div class="input-group-prepend">
            <span class="input-group-text" id="inputGroup-sizing-default">NodeId</span>
          </div>
          <input type="text" class="form-control" aria-label="Default" aria-describedby="inputGroup-sizing-default" v-model="store.selectedNode.nodeId">
        </div>
        <div class="input-group mb-3">
          <div class="input-group-prepend">
            <span class="input-group-text" id="inputGroup-sizing-default">NodeClass</span>
          </div>
          <input type="text" class="form-control" aria-label="Default" aria-describedby="inputGroup-sizing-default" v-model="store.selectedNode.nodeClass">
        </div>
        <div class="input-group mb-3">
          <div class="input-group-prepend">
            <span class="input-group-text" id="inputGroup-sizing-default">Namespace</span>
          </div>
          <input type="text" class="form-control" aria-label="Default" aria-describedby="inputGroup-sizing-default" v-model="store.selectedNode.namespace">
        </div>
      </div>
      </div>
    </div>
</template>


<style scoped>

</style>