Polished the entry title component a bit.

resources/assets/js/components/Entry/Title.vue

@@ -2,7 +2,18 @@
     <div class="panel panel-default">
         <div class="panel-heading">
             <!--@lang('entry.title', ['name' => 'Some Mod 2.0', 'user' => 'Someuser'])-->
-            {{ title }} {{ version }} by <a :href="'/profile/' + uid"><span :style="name_colour">{{ showName }}</span></a>
+            {{ title }} {{ version }} by 
+            <span v-for="(o, i) in owners">
+                <a :href="'/profile/' + o.uid"><span :style="o.name_colour">{{ o.showname }}</span></a>
+                <span v-if="i == owners.length - 2">
+                    , and 
+                </span>
+                <span v-else-if="i == owners.length - 1">
+                </span>
+                <span v-else>
+                    , 
+                </span>
+            </span>
         </div>
 
         <div class="panel-body">
@@ -52,7 +63,7 @@
                         <!--@lang('entry.submitted', ['datetime' => '1945/05/05'])-->
                         Submitted: {{ submit_date }}
                     </div>
-                    <div v-if="last_date !== 0"class="col-md-2">
+                    <div v-if="last_date !== 0" class="col-md-2">
                         <!--@lang('entry.updated', ['datetime' => '2050/12/01'])-->
                         Updated: {{ last_date }}
                     </div>
@@ -82,16 +93,30 @@
                 username: '',
                 avatar: '',
                 gender: '',
+                perm_id: '',
                 display_name: '',
                 name_colour: '',
                 views: 0,
                 downloads: 0,
                 submit_date: 0,
                 last_date: 0,
-                showName: [],
+                showName: '',
+                showCol: '',
+                groupCol: [],
             }
         },
         created: function () {
+            axios.get('/api/rpc/user/getgroupcolours').then(res => {
+                res.data.forEach(cb => {
+                    this.groupCol.push({
+                        'id': cb.id,
+                        'name': cb.name,
+                        'male': cb.colour_m,
+                        'female': cb.colour_f,
+                        'unknown': cb.colour_u,
+                    });
+                });
+            })
             axios.get('/api/rpc/file/getfiletitle/' + this.id).then(data => {
                 this.uid = data.data[0].user_id;
                 this.title = data.data[0].title;
@@ -99,28 +124,46 @@
                 this.views = data.data[0].views;
                 this.downloads = data.data[0].downloads;
                 this.submit_date = moment.unix(data.data[0].submit_date).format("YYYY/MM/DD");
-                this.last_date = data.data[0].last_date;
+                if (data.data[0].last_date !== 0) {
+                    this.last_date = moment.unix(data.data[0].last_date).format("YYYY/MM/DD");
+                }
 
                 data.data.forEach(cb => {
-                    this.owners.push(
-                        {
-                            'username': cb.username,
-                            'display_name': cb.display_name,
-                            'avatar': cb.avatar,
-                            'gender': cb.gender,
-                            'name_colour': cb.name_colour,
-                        }
-                    );
-
-                    if (this.last_date !== 0) {
-                        this.last_date = moment.unix(this.last_date).format("YYYY/MM/DD");
-                    }
                     if (cb.display_name !== '') {
-                        this.showName += cb.display_name;
+                        this.showName = cb.display_name;
                     }
                     else {
-                        this.showName += cb.username;
+                        this.showName = cb.username;
                     }
+
+                    if (cb.name_colour !== '') {
+                        this.showCol = cb.name_colour;
+                    }
+                    else {
+                        this.groupCol.forEach(re => {
+                            if (re.id === cb.perm_id) {
+                                if (cb.gender === 1) {
+                                    this.showCol = re.male;
+                                }
+                                else if (cb.gender === 2) {
+                                    this.showCol = re.female;
+                                }
+                                else {
+                                    this.showCol = re.unknown;
+                                }
+                            }
+                        });
+                    }
+
+                    this.owners.push({
+                        'uid': cb.user_id,
+                        'showname': this.showName,
+                        'username': cb.username,
+                        'display_name': cb.display_name,
+                        'avatar': cb.avatar,
+                        'gender': cb.gender,
+                        'name_colour': this.showCol,
+                    });
                 });
                 this.username = data.data[0].username;
                 this.display_name = data.data[0].display_name;
@@ -134,6 +177,6 @@
 
 <style>
     .col {
-		text-align: center;
+        text-align: center;
     }
 </style>