first commit

pakaivue/components/AnotherComponent.vue

@@ -0,0 +1,48 @@
+<!-- components/AnotherComponent.vue -->
+<template>
+    <v-container>
+      <v-row>
+        <v-col>
+          <h2>{{ $t('anotherComponent.title') }}</h2>
+          <v-text-field v-model="param2" :label="$t('anotherComponent.param2Label')"></v-text-field>
+          <p>{{ $t('anotherComponent.param2') }}: {{ param2 }}</p>
+          <v-btn @click="sendData">{{ $t('anotherComponent.sendDataButton') }}</v-btn>
+          <div v-if="data">{{ $t('anotherComponent.response') }}: {{ data }}</div>
+          <div v-if="error">{{ $t('anotherComponent.error') }}: {{ error.message }}</div>
+        </v-col>
+      </v-row>
+    </v-container>
+  </template>
+  
+  <script>
+  export default {
+    computed: {
+      param2: {
+        get() {
+          return this.$store.state.param2;
+        },
+        set(value) {
+          this.$store.commit('setParam2', value);
+        }
+      },
+      data() {
+        return this.$store.state.data;
+      },
+      error() {
+        return this.$store.state.error;
+      }
+    },
+    methods: {
+      sendData() {
+        this.$store.dispatch('sendData');
+      }
+    }
+  };
+  </script>
+  
+  <style scoped>
+  h2 {
+    color: green;
+  }
+  </style>
+  

pakaivue/components/ComponentA.vue

@@ -0,0 +1,34 @@
+<!-- components/ComponentA.vue -->
+<template>
+    <v-container>
+      <v-row>
+        <v-col>
+          <h2>{{ $t('message.login') }}</h2>
+          <v-text-field v-model="param1" :label="$t('message.email')"></v-text-field>
+          <p>{{ $t('message.param1') }}: {{ param1 }}</p>
+        </v-col>
+      </v-row>
+    </v-container>
+  </template>
+  
+  <script>
+  export default {
+    computed: {
+      param1: {
+        get() {
+          return this.$store.state.param1;
+        },
+        set(value) {
+          this.$store.commit('setParam1', value);
+        }
+      }
+    }
+  };
+  </script>
+  
+  <style scoped>
+  h2 {
+    color: blue;
+  }
+  </style>
+  

pakaivue/components/ComponentB.vue

@@ -0,0 +1,48 @@
+<!-- components/ComponentB.vue -->
+<template>
+    <v-container>
+      <v-row>
+        <v-col>
+          <h2>{{ $t('message.login') }}</h2>
+          <v-text-field v-model="param2" :label="$t('message.password')"></v-text-field>
+          <p>{{ $t('message.param2') }}: {{ param2 }}</p>
+          <v-btn @click="sendData">{{ $t('message.login') }}</v-btn>
+          <div v-if="data">{{ $t('message.response') }}: {{ data }}</div>
+          <div v-if="error">{{ $t('message.error') }}: {{ error.message }}</div>
+        </v-col>
+      </v-row>
+    </v-container>
+  </template>
+  
+  <script>
+  export default {
+    computed: {
+      param2: {
+        get() {
+          return this.$store.state.param2;
+        },
+        set(value) {
+          this.$store.commit('setParam2', value);
+        }
+      },
+      data() {
+        return this.$store.state.data;
+      },
+      error() {
+        return this.$store.state.error;
+      }
+    },
+    methods: {
+      sendData() {
+        this.$store.dispatch('sendData');
+      }
+    }
+  };
+  </script>
+  
+  <style scoped>
+  h2 {
+    color: green;
+  }
+  </style>
+  

pakaivue/components/MyComponent.vue

@@ -0,0 +1,34 @@
+<!-- components/MyComponent.vue -->
+<template>
+    <v-container>
+      <v-row>
+        <v-col>
+          <h2>{{ $t('myComponent.title') }}</h2>
+          <v-text-field v-model="param1" :label="$t('myComponent.param1Label')"></v-text-field>
+          <p>{{ $t('myComponent.param1') }}: {{ param1 }}</p>
+        </v-col>
+      </v-row>
+    </v-container>
+  </template>
+  
+  <script>
+  export default {
+    computed: {
+      param1: {
+        get() {
+          return this.$store.state.param1;
+        },
+        set(value) {
+          this.$store.commit('setParam1', value);
+        }
+      }
+    }
+  };
+  </script>
+  
+  <style scoped>
+  h2 {
+    color: blue;
+  }
+  </style>
+