Falukant production, family and administration enhancements

frontend/src/components/falukant/DirectorInfo.vue

@@ -0,0 +1,120 @@
+<template>
+    <div class="director-info">
+      <h3>{{ $t('falukant.branch.director.title') }}</h3>
+      <div v-if="!director || director === null">
+        <button @click="openNewDirectorDialog">{{ $t('falukant.branch.director.actions.new') }}</button>
+      </div>
+      <div v-else class="director-info-container">
+        <div>
+          <table>
+            <tr>
+              <td>{{ $t('falukant.branch.director.name') }}</td>
+              <td>
+                {{ $t('falukant.titles.' + director.character.gender + '.' + director.character.title) }}
+                {{ director.character.name }}
+              </td>
+            </tr>
+            <tr>
+              <td>{{ $t('falukant.branch.director.salary') }}</td>
+              <td>{{ director.income }}</td>
+            </tr>
+            <tr>
+              <td>{{ $t('falukant.branch.director.satisfaction') }}</td>
+              <td>{{ director.satisfaction }} %</td>
+            </tr>
+          </table>
+        </div>
+        <div>
+          <table>
+            <tr>
+              <td><button @click="fireDirector">{{ $t('falukant.branch.director.fire') }}</button></td>
+            </tr>
+            <tr>
+              <td><button @click="teachDirector">{{ $t('falukant.branch.director.teach') }}</button></td>
+            </tr>
+            <tr>
+              <td>
+                <label>
+                  <input type="checkbox" v-model="director.mayProduce" @change="saveSetting('mayProduce', director.mayProduce)">
+                  {{ $t('falukant.branch.director.produce') }}
+                </label>
+              </td>
+            </tr>
+            <!-- Ähnliche Checkboxen für maySell und mayStartTransport -->
+          </table>
+        </div>
+      </div>
+    </div>
+    <NewDirectorDialog ref="newDirectorDialog" />
+  </template>
+  
+  <script>
+  import apiClient from '@/utils/axios.js';
+  import NewDirectorDialog from '@/dialogues/falukant/NewDirectorDialog.vue';
+  
+  export default {
+    name: "DirectorInfo",
+    props: { branchId: { type: Number, required: true } },
+    components: { 
+      NewDirectorDialog 
+    },
+    data() {
+      return {
+        director: null,
+        showNewDirectorDialog: false,
+      };
+    },
+    async mounted() {
+      await this.loadDirector();
+    },
+    methods: {
+      async loadDirector() {
+        try {
+          const response = await apiClient.get(`/api/falukant/director/${this.branchId}`);
+          this.director = Object.keys(response.data).length === 0 || !response.data.director ? null : response.data.director;
+        } catch (error) {
+          console.error('Error loading director:', error);
+        }
+      },
+      async saveSetting(settingKey, value) {
+        if (!this.director) return;
+        try {
+          await apiClient.post(`/api/falukant/director/settings`, {
+            branchId: this.branchId,
+            directorId: this.director.id,
+            settingKey,
+            value,
+          });
+        } catch (error) {
+          console.error(`Error saving setting ${settingKey}:`, error);
+        }
+      },
+      openNewDirectorDialog() {
+        console.log('openNewDirectorDialog');
+        this.$refs.newDirectorDialog.open(this.branchId);
+      },
+      fireDirector() {
+        alert(this.$t('falukant.branch.director.fireAlert'));
+      },
+      teachDirector() {
+        alert(this.$t('falukant.branch.director.teachAlert'));
+      },
+    },
+  };
+  </script>
+  
+  <style scoped>
+  .director-info {
+    border: 1px solid #ccc;
+    margin: 10px 0;
+    border-radius: 4px;
+    padding: 10px;
+  }
+  .director-info-container {
+    display: flex;
+  }
+  .director-info-container > div {
+    width: 100%;
+  }
+  </style>
+