Mark or unmark entire lines as NTBA.

Closes #52.

lib/www/client/source/src/views/LineList.vue

@@ -15,6 +15,21 @@
         </v-toolbar>
       </v-card-title>
       <v-card-text>
+      
+        <v-menu
+          v-model="contextMenuShow"
+          :position-x="contextMenuX"
+          :position-y="contextMenuY"
+          absolute
+          offset-y
+        >
+          <v-list dense v-if="contextMenuItem">
+            <v-list-item @click="setNTBA">
+              <v-list-item-title v-if="contextMenuItem.ntba">Unset NTBA</v-list-item-title>
+              <v-list-item-title v-else>Set NTBA</v-list-item-title>
+            </v-list-item>
+          </v-list>
+        </v-menu>
 
         <v-data-table
         :headers="headers"
@@ -24,6 +39,7 @@
         :fixed-header="true"
         :item-class="(item) => (activeItem == item && !edit) ? 'blue accent-1 elevation-3' : ''"
         @click:row="setActiveItem"
+        @contextmenu:row="contextMenu"
         >
         
           <template v-slot:item.status="{item}">
@@ -33,7 +49,8 @@
               :sequence-href="(s) => `/projects/${$route.params.project}/log/sequence/${s.sequence}`"
             >
               <template v-slot:empty>
-                <div class="sequence" title="Virgin"></div>
+                <div v-if="!item.ntba" class="sequence" title="Virgin"></div>
+                <div v-else class="sequence ntba" title="Not to be acquired"><span>NTBA</span></div>
               </template>
             </dougal-line-status>
           </template>
@@ -79,6 +96,15 @@
   </v-container>
 </template>
 
+<style lang="stylus" scoped>
+.ntba
+    background-image repeating-linear-gradient(-45deg, #ff00004d, #ff000080 10px, #d3d3d31a 10px, #d3d3d314 20px)
+    cursor not-allowed
+    display flex
+    align-items center
+    justify-content center
+</style>
+
 <script>
 import { mapActions, mapGetters } from 'vuex';
 import DougalLineStatus from '@/components/line-status';
@@ -138,7 +164,13 @@ export default {
       sequences: [],
       activeItem: null,
       edit: null, // {line, key, value}
-      queuedReload: false
+      queuedReload: false,
+      
+      // Context menu stuff
+      contextMenuShow: false,
+      contextMenuX: 0,
+      contextMenuY: 0,
+      contextMenuItem: null
     }
   },
 
@@ -196,6 +228,26 @@ export default {
 
   methods: {
     
+    contextMenu (e, {item}) {
+      e.preventDefault();
+      this.contextMenuShow = false;
+      this.contextMenuX = e.clientX;
+      this.contextMenuY = e.clientY;
+      this.contextMenuItem = item;
+      this.$nextTick( () => this.contextMenuShow = true );
+      console.log("event", e);
+      console.log("data", item);
+    },
+    
+    setNTBA () {
+      console.log("Hi! I'm NTBA", this.contextMenuItem.line, this.contextMenuItem.ntba);
+      this.saveItem({
+        line: this.contextMenuItem.line,
+        key: 'ntba',
+        value: !this.contextMenuItem.ntba
+      })
+    },
+    
     editItem (item, key) {
       this.edit = {
         line: item.line,