use source on frontend

backend/metagenedb/api/catalog/filters/gene.py

@@ -33,4 +33,4 @@ class GeneFilter(filters.FilterSet):
 
     class Meta:
         model = Gene
-        fields = ['length', 'name']
+        fields = ['length', 'name', 'source']

backend/metagenedb/api/catalog/qparams_validators/gene.py

@@ -13,3 +13,4 @@ class GeneQueryParams(PaginatedQueryParams):
     taxonomy_rank = fields.String()
     taxonomy_id = fields.Integer()
     function = fields.String()
+    source = fields.String()

backend/metagenedb/apps/catalog/serializers/gene.py

@@ -69,7 +69,7 @@ class GeneSerializer(serializers.ModelSerializer):
     class Meta:
         model = Gene
         list_serializer_class = GeneListSerializer
-        fields = ('gene_id', 'name', 'length', 'functions', 'taxonomy', 'sequence')
+        fields = ('gene_id', 'name', 'length', 'functions', 'taxonomy', 'sequence', 'source')
 
     def _extract_many_to_many(self, validated_data, info):
         many_to_many = {}

frontend/src/views/GeneDetail.vue

@@ -109,6 +109,10 @@ export default {
               title: 'Length (bp)',
               content: response.data.length,
             },
+            {
+              title: 'Source',
+              content: response.data.source,
+            },
           ];
           this.sequence = '>' + response.data.gene_id + '\n' + response.data.sequence;
           if (response.data.functions.length > 0) {

frontend/src/views/genes/genes.html

@@ -25,8 +25,16 @@
         <v-card class="grey lighten-3 px-2">
         <v-card-text>
           <v-layout wrap align-center>
-            <!-- Taxonomy ranks -->
+            <!-- Gene source -->
             <v-flex xs12 sm6 md4 lg2 d-flex>
+              <v-select
+                :items="geneSources"
+                v-model="geneSource"
+                label="Gene source"
+              ></v-select>
+            </v-flex>
+            <!-- Taxonomy ranks -->
+            <v-flex xs12 sm6 md4 lg2 d-flex class="ml-2">
               <v-select
                 :items="taxonomyRanks"
                 v-model="taxonomyRank"
@@ -140,6 +148,7 @@
           </v-btn>
         </td>
         <td class="text-xs">{{ props.item.eggnog }}</td>
+        <td class="text-xs">{{ props.item.source }}</td>
         </template>
       </v-data-table>
       </v-list>

frontend/src/views/genes/genes.js

@@ -11,6 +11,7 @@ export default {
       pagination: {
         rowsPerPage: 20,
       },
+      geneSource: null,
       searchGeneName: null,
       taxonomyRank: null,
       functionID: null,
@@ -32,13 +33,19 @@ export default {
         { text: 'Taxonomy', value: 'taxonomy', sortable: false },
         { text: 'KEGG', value: 'kegg', sortable: false },
         { text: 'EggNOG', value: 'eggnog', sortable: false },
+        { text: 'Source', value: 'source', sortable: false },
       ];
     },
     taxonomyRanks() {
       return [
-        'Phylum', 'Genus',
+        'Phylum', 'Class', 'Order', 'Family', 'Genus', 'Species'
       ];
     },
+    geneSources() {
+      return [
+        'IGC', 'Virgo'
+      ]
+    },
     rowsPerPageItems() {
       return [this.page_size];
     },
@@ -57,6 +64,9 @@ export default {
       if (this.functionID){
         qParams.function = this.functionID
       }
+      if (this.geneSource) {
+        qParams.source = this.source.toLowerCase()
+      }
       return qParams;
     },
     maxGeneLength() {
@@ -110,6 +120,7 @@ export default {
     emptyFilters() {
       this.taxonomyRank = null;
       this.functionID = null;
+      this.geneSource = null;
       this.filterGeneLength = false;
       this.geneLengthFilterRange = [0, 2000];
     },