UPD: cleanup

frontend/src/components/OUCard.vue

-<template>
-  <b-card no-body :key="'card-account-' + ou.short_name" class="mb-4 shadow">
-    <template v-slot:header>
-      <b-row>
-        <b-col>
-          <h4>
-            {{ ou.name }} ({{ ou.short_name }})
-          </h4>
-          <p class="text-muted">Organisationseinheit</p>
-        </b-col>
-        <b-col lg="2">
-          <b-button-group class="d-flex">
-            <b-button variant="outline-secondary" :id="'show-evlog-ou-' + ou.short_name"
-                      @click="show_ev_log(ou)">
-              <font-awesome-icon icon="history"></font-awesome-icon>
-            </b-button>
-            <b-tooltip :target="'show-evlog-ou-' +  ou.short_name" triggers="hover"
-                       variant="secondary" placement="bottom">
-              Eventlog
-            </b-tooltip>
-          </b-button-group>
-        </b-col>
-      </b-row>
-    </template>
-    <b-button block squared variant="outline-secondary" v-b-toggle="ou.short_name + '-collapse'">
-      OE-Betreuer
-      <b-badge pill v-if="ou_mgrs">{{
-          ou_mgrs.length
-        }}
-      </b-badge>
-      <b-badge pill v-else>0</b-badge>
-      <br/>
-      <font-awesome-icon class="collapse-icon" :icon="['fas','chevron-down']"/>
-    </b-button>
-    <b-collapse :id="ou.short_name + '-collapse'">
-      <b-table :items="ou_mgrs" :fields="ou_list_fields">
-        <template v-slot:cell(first_name)="data">
-          {{ mgrs_by_login_name[data.item.mgr_login_name].first_name }}
-        </template>
-        <template v-slot:cell(last_name)="data">
-          {{ mgrs_by_login_name[data.item.mgr_login_name].last_name }}
-        </template>
-        <template v-slot:cell(email)="data">
-          <b-link :href="'mailto:'+mgrs_by_login_name[data.item.mgr_login_name].email">
-            {{ mgrs_by_login_name[data.item.mgr_login_name].email }}
-          </b-link>
-        </template>
-        <template v-slot:head(actions)>
-          <b-button @click="create_mgr_assignment(ou.short_name)" block variant="outline-success"
-                    :id="'button-assign-mgr-' +  ou.short_name">
-            <font-awesome-icon :icon="['fas', 'plus']"/>
-          </b-button>
-          <b-tooltip :target="'button-assign-mgr-' +  ou.short_name" triggers="hover"
-                     variant="success" placement="left">
-            Neuen Account zuordnen
-          </b-tooltip>
-        </template>
-        <template v-slot:cell(actions)="data">
-          <b-button-group class="d-flex">
-            <b-button @click="delete_mgr_assignment(data.item)" variant="outline-danger"
-                      :id="'button-unassign-mgr-' +  data.item.bcd_name">
-              <font-awesome-icon :icon="['fas', 'unlink']"></font-awesome-icon>
-            </b-button>
-            <b-tooltip :target="'button-unassign-mgr-' +  data.item.bcd_name" triggers="hover"
-                       variant="danger" placement="left">
-              Zuweisung aufheben
-            </b-tooltip>
-          </b-button-group>
-        </template>
-      </b-table>
-    </b-collapse>
-    <b-button block squared variant="outline-secondary"
-              v-b-toggle="ou.short_name + '-collapse-domains'">
-      Domains
-      <b-badge pill v-if="ou_fqdns">{{
-          ou_fqdns.length
-        }}
-      </b-badge>
-      <b-badge pill v-else>0</b-badge>
-      <br/>
-      <font-awesome-icon class="collapse-icon" :icon="['fas','chevron-down']"/>
-    </b-button>
-    <b-collapse :id="ou.short_name + '-collapse-domains'">
-      <b-table :items="ou_fqdns" :fields="fqdn_list_fields">
-        <template v-slot:head(actions)>
-          <b-button block variant="outline-success"
-                    :id="'button-assign-fqdn-' +  ou.short_name"
-                    @click="create_fqdn_assignment(ou.short_name)">
-            <font-awesome-icon :icon="['fas', 'plus']"/>
-          </b-button>
-          <b-tooltip :target="'button-assign-fqdn-' +  ou.short_name" triggers="hover"
-                     variant="success" placement="left">
-            Neue Domain zuordnen
-          </b-tooltip>
-        </template>
-        <template v-slot:cell(actions)="data">
-          <b-button-group class="d-flex">
-            <b-button @click="delete_fqdn_assignment(data.item)" variant="outline-danger"
-                      :id="'button-unassign-fqdn-' +  data.item.fqdn_value">
-              <font-awesome-icon :icon="['fas', 'unlink']"></font-awesome-icon>
-            </b-button>
-            <b-tooltip :target="'button-unassign-fqdn-' +  data.item.fqdn_value" triggers="hover"
-                       variant="danger" placement="bottom">
-              Zuweisung aufheben
-            </b-tooltip>
-          </b-button-group>
-        </template>
-      </b-table>
-    </b-collapse>
-    <b-button block squared variant="outline-secondary"
-              v-b-toggle="ou.short_name + '-collapse-bcds'">
-      Broadcastdomains (BCDs)
-      <b-badge pill v-if="ou_bcds">{{
-          ou_bcds.length
-        }}
-      </b-badge>
-      <b-badge pill v-else>0</b-badge>
-      <br/>
-      <font-awesome-icon class="collapse-icon" :icon="['fas','chevron-down']"/>
-    </b-button>
-    <b-collapse :id="ou.short_name + '-collapse-bcds'">
-      <b-table :items="ou_bcds" :fields="bcd_list_fields">
-        <template v-slot:cell(name)="item">
-          <b-link :to="'/dnsvs/bcds/' + item.item.name">{{ item.item.name }}</b-link>
-        </template>
-      </b-table>
-    </b-collapse>
-  </b-card>
-</template>
-
-<script>
-export default {
-  name: 'OUCard',
-  data() {
-    return {
-      bcd_list_fields: [
-        {
-          key: 'name',
-          label: 'BCD',
-          sortable: true
-        },
-        {
-          key: 'description',
-          label: 'Beschreibung',
-          sortable: true
-        }
-      ],
-      fqdn_list_fields: [
-        {
-          key: 'fqdn_value',
-          label: 'FQDN',
-          sortable: true
-        },
-        {
-          key: 'actions',
-          label: 'Aktionen',
-          sortable: false
-        }
-      ],
-      ou_list_fields: [
-        {
-          key: 'mgr_login_name',
-          label: 'Login Name',
-          sortable: false
-        },
-        {
-          key: 'first_name',
-          label: 'Vorname',
-          sortable: false
-        },
-        {
-          key: 'last_name',
-          label: 'Nachname',
-          sortable: false
-        },
-        {
-          key: 'email',
-          label: 'E-Mail',
-          sortable: false
-        },
-        {
-          key: 'actions',
-          label: 'Aktionen',
-          sortable: false
-        }
-      ]
-    }
-  },
-  props: {
-    ou: {
-      type: Object,
-      required: true
-    },
-    ou_bcds: {
-      type: Array,
-      required: true
-    },
-    ou_fqdns: {
-      type: Array,
-      required: true
-    },
-    ou_mgrs: {
-      type: Array,
-      required: true
-    },
-    mgrs_by_login_name: {
-      type: Object,
-      required: true
-    },
-    show_ev_log: {
-      type: Function,
-      required: true
-    },
-    delete_fqdn_assignment: {
-      type: Function,
-      required: true
-    },
-    create_fqdn_assignment: {
-      type: Function,
-      required: true
-    },
-    create_mgr_assignment: {
-      type: Function,
-      required: true
-    },
-    delete_mgr_assignment: {
-      type: Function,
-      required: true
-    }
-  }
-}
-</script>
-
-<style scoped>
-
-</style>