53 lines
1.6 KiB
Vue
53 lines
1.6 KiB
Vue
<template>
|
|
<div id=edit-measure v-if=measure>
|
|
<div class=header>
|
|
<h1>Edit Measure</h1>
|
|
<h2>{{measure.name}}</h2>
|
|
</div>
|
|
<form @submit.prevent=updateMeasure() class=edit-measure-form>
|
|
<fieldset>
|
|
<div>
|
|
<label for=measureName>Display Name</label>
|
|
<input
|
|
:disabled=waiting
|
|
type=text
|
|
name=measureName
|
|
placeholder="what you are measuring"
|
|
required
|
|
v-model="measure.name" />
|
|
</div>
|
|
<div>
|
|
<label for=measureDescription>Description</label>
|
|
<textarea
|
|
:disabled=waiting
|
|
name=measureDescription
|
|
placeholder="optional description"
|
|
v-model="measure.description" ></textarea>
|
|
</div>
|
|
<div>
|
|
<label for=measureSlug>Short name (slug)</label>
|
|
<input
|
|
:disabled=waiting
|
|
type=text
|
|
name=measureDescription
|
|
:placeholder='slugFromName + " (default)"'
|
|
:value="measure.slug"
|
|
@input="measure.slug = slugify($event.target.value)"/>
|
|
</div>
|
|
</fieldset>
|
|
<MeasureConfigForm
|
|
v-model=measure.config
|
|
:disabled=waiting
|
|
measureExists=false />
|
|
<div v-if='!waiting' class=form-actions>
|
|
<button class=btn-action>Update</button>
|
|
<a class=btn @click="$router.go(-1)">Cancel</a>
|
|
</div>
|
|
<div v-if='waiting' class=form-waiting>
|
|
<div class=wait-spinner>working <fa-icon icon=sync spin /></div>
|
|
</div>
|
|
</form>
|
|
</div>
|
|
</template>
|
|
<script lang=ts src=./edit-measure.ts></script>
|