add proper state switcher

1 files changed, 15 insertions, 18 deletions

diff --git a/src/components/report/report.vue b/src/components/report/report.vue
index 638a3aa0..4020773d 100644
--- a/src/components/report/report.vue
+++ b/src/components/report/report.vue
@@ -1,19 +1,32 @@
 <template>
   <div class="Report">
+    <div class="reported-user">
+      <span>{{ $t('report.reported_user') }}</span>
+      <router-link :to="generateUserProfileLink(report.acct)">
+        @{{ report.acct.screen_name }}
+      </router-link>
+    </div>
+    <div class="reporter">
+      <span>{{ $t('report.reporter') }}</span>
+      <router-link :to="generateUserProfileLink(report.actor)">
+        @{{ report.actor.screen_name }}
+      </router-link>
+    </div>
     <div class="report-state">
+      <span>{{ $t('report.state') }}</span>
       <label
         for="report-state"
         class="select"
       >
         <select
           id="report-state"
-          v-model="report.state"
+          v-model="state"
           class="form-control"
         >
           <option
             v-for="state in ['open', 'closed', 'resolved']"
             :key="state"
-            :value="report.state"
+            :value="state"
           >
             {{ $t('report.state_' + state) }}
           </option>
@@ -24,22 +37,6 @@
         />
       </label>
     </div>
-    <div class="reported-user">
-      <span>{{ $t('report.reported_user') }}</span>
-      <router-link :to="generateUserProfileLink(report.acct)">
-        @{{ report.acct.screen_name }}
-      </router-link>
-    </div>
-    <div class="reporter">
-      <span>{{ $t('report.reporter') }}</span>
-      <router-link :to="generateUserProfileLink(report.actor)">
-        @{{ report.actor.screen_name }}
-      </router-link>
-    </div>
-    <div class="report-state">
-      <span>{{ $t('report.state') }}</span>
-      <b>{{ $t('report.state_' + report.state) }}</b>
-    </div>
     <!-- eslint-disable vue/no-v-html -->
     <div
       class="report-content"