prework messages in adminarea

admin/src/components/ContributionMessages/ContributionMessagesFormular.vue

@@ -0,0 +1,39 @@
+<template>
+  <div class="contribution-messages-formular">
+    <b-form @submit="onSubmit" @reset="onReset">
+      <b-form-textarea
+        id="textarea"
+        v-model="form.text"
+        placeholder="Enter something..."
+        rows="3"
+        max-rows="6"
+      ></b-form-textarea>
+      <p v-if="form.text !== ''" class="mt-5">Vorschau</p>
+      <pre class="ml-3 mt-3 mb-5">{{ form.text }}</pre>
+      <b-button type="submit" variant="primary">Submit</b-button>
+      <b-button type="reset" variant="danger">Reset</b-button>
+    </b-form>
+  </div>
+</template>
+<script>
+export default {
+  name: 'ContributionMessagesFormular',
+  data() {
+    return {
+      form: {
+        text: '',
+      },
+    }
+  },
+  methods: {
+    onSubmit(event) {
+      event.preventDefault()
+      alert(JSON.stringify(this.form))
+    },
+    onReset(event) {
+      event.preventDefault()
+      this.form.text = ''
+    },
+  },
+}
+</script>

admin/src/components/ContributionMessages/ContributionMessagesList.vue

@@ -0,0 +1,47 @@
+<template>
+  <div class="contribution-messages-list">ContributionMessagesList
+
+      <b-container>
+          <div v-for="message in messages">
+          {{message}}</div>
+      </b-container>
+  </div>
+</template>
+<script>
+export default {
+  name: 'ContributionMessagesList',
+  data() {
+    return {
+      messages: [
+        {
+          id: '0',
+          msgid: '0',
+          memo: 'kjsdn sdnnasd andandandak sd n askdna kdnak asdnadjasndk adkand',
+          uuid: '1',
+          firstName: 'peter',
+          lastName: 'lustig',
+          isModerator: true,
+        },
+        {
+          id: '1',
+          msgid: '0',
+          memo: 'nftzfD dfRDTD FDdrD TFt F ZTFZF TZfz FF T TZF Z ff ',
+          uuid: '2',
+          firstName: 'bibi',
+          lastName: 'bloxberg',
+          isModerator: false,
+        },
+        {
+          id: '0',
+          msgid: '0',
+          memo: 'oG iu Hih hi  ',
+          uuid: '1',
+          firstName: 'peter',
+          lastName: 'lustig',
+          isModerator: true,
+        },
+      ],
+    }
+  },
+}
+</script>

admin/src/components/Tables/OpenCreationsTable.vue

@@ -21,6 +21,9 @@
         >
           <b-icon :icon="row.detailsShowing ? 'x' : 'pencil-square'" aria-label="Help"></b-icon>
         </b-button>
+        <b-button v-else @click="rowToggleDetails(row, 0)">
+          <b-icon icon="chat-dots"></b-icon>
+        </b-button>
       </template>
       <template #cell(confirm)="row">
         <b-button variant="success" size="md" @click="$emit('show-overlay', row.item)" class="mr-2">
@@ -36,7 +39,7 @@
           @row-toggle-details="rowToggleDetails"
         >
           <template #show-creation>
-            <div>
+            <div v-if="row.item.moderator">
               <edit-creation-formular
                 type="singleCreation"
                 :creation="row.item.creation"
@@ -47,6 +50,14 @@
                 @update-user-data="updateUserData"
               />
             </div>
+            <div v-else>
+              <contribution-messages-formular />
+              <hr />
+              <contribution-messages-list />
+              <br />
+              <br />
+              <br />
+            </div>
           </template>
         </row-details>
       </template>
@@ -58,6 +69,8 @@
 import { toggleRowDetails } from '../../mixins/toggleRowDetails'
 import RowDetails from '../RowDetails.vue'
 import EditCreationFormular from '../EditCreationFormular.vue'
+import ContributionMessagesFormular from '../ContributionMessages/ContributionMessagesFormular.vue'
+import ContributionMessagesList from '../ContributionMessages/ContributionMessagesList.vue'
 
 export default {
   name: 'OpenCreationsTable',
@@ -65,6 +78,8 @@ export default {
   components: {
     EditCreationFormular,
     RowDetails,
+    ContributionMessagesFormular,
+    ContributionMessagesList,
   },
   props: {
     items: {