web: Adjust to new API URLs, implement update for Measure.

web/src/components/measure-config/measure-config-form.ts

@@ -12,7 +12,7 @@ import moment from 'moment';
 export class MeasureConfigForm extends Vue {
   @Prop({}) public value!: MeasureConfig;
   @Prop({}) public disabled: boolean = false;
-  @Prop({}) public measureExists: boolean = false;
+  @Prop({}) public measureExists!: boolean;
 
   public now = moment();
   public formatStrings = [
@@ -47,6 +47,14 @@ export class MeasureConfigForm extends Vue {
       this.value.timestampDisplayFormat = this.selectedFormat;
     }
   }
+
+  private mounted() {
+    if (this.formatStrings.includes(this.value.timestampDisplayFormat)) {
+      this.selectedFormat = this.value.timestampDisplayFormat;
+    } else {
+      this.selectedFormat = 'custom';
+    }
+  }
 }
 
 export default MeasureConfigForm;

web/src/services/pm-api-client.ts

@@ -136,7 +136,7 @@ export class PmApiClient {
   public async getMeasurements(measureSlug: string)
     : Promise<Array<Measurement<MeasurementMeta>>> {
 
-    const resp = await this.http.get(`/measure/${measureSlug}`);
+    const resp = await this.http.get(`/measurements/${measureSlug}`);
     return resp.data.map(this.fromMeasurementDTO);
   }
 
@@ -146,7 +146,7 @@ export class PmApiClient {
     : Promise<Measurement<MeasurementMeta>> {
 
      const resp = await this.http.post(
-       `/measure/${measureSlug}`,
+       `/measurements/${measureSlug}`,
        this.toMeasurementDTO(measurement));
      return this.fromMeasurementDTO(resp.data);
   }
@@ -157,7 +157,7 @@ export class PmApiClient {
     : Promise<Measurement<MeasurementMeta>> {
 
     const resp = await this.http
-      .get(`/measure/${measureSlug}/${measurementId}`);
+      .get(`/measurements/${measureSlug}/${measurementId}`);
     return this.fromMeasurementDTO(resp.data);
   }
 
@@ -167,7 +167,7 @@ export class PmApiClient {
     : Promise<Measurement<MeasurementMeta>> {
 
     const resp = await this.http.put(
-      `/measure/${measureSlug}/${measurement.id}`,
+      `/measurements/${measureSlug}/${measurement.id}`,
       this.toMeasurementDTO(measurement));
     return this.fromMeasurementDTO(resp.data);
   }
@@ -178,7 +178,7 @@ export class PmApiClient {
     : Promise<boolean> {
 
     const resp = await this.http
-      .delete(`/measure/${measureSlug}/${measurementId}`);
+      .delete(`/measurements/${measureSlug}/${measurementId}`);
     return true;
   }
 

web/src/views/EditMeasure.vue

@@ -1,5 +1,5 @@
 <template>
-  <div id=edit-measure>
+  <div id=edit-measure v-if=measure>
     <div class=header>
       <h1>Edit Measure</h1>
       <h2>{{measure.name}}</h2>

web/src/views/edit-measure.ts

@@ -18,7 +18,11 @@ export class EditMeasure extends Vue {
   }
 
   private get slugFromName() {
-    return slugify(this.measure.name);
+    if (this.measure) {
+      return slugify(this.measure.name);
+    } else {
+      return null;
+    }
   }
 
   private async updateMeasure() {
@@ -38,6 +42,15 @@ export class EditMeasure extends Vue {
       }
     }
   }
+
+  private async mounted() {
+    // good chance we've already fetched this
+    // TODO: centralize this caching behavior?
+    if (!this.measure) {
+      await measureStore.fetchMeasure(this.$route.params.slug);
+    }
+  }
+
 }
 
 export default EditMeasure;