Browse Source

Use vue shorthand for events, bind save on form instead button

master
Shyim 6 years ago
parent
commit
198dd6e4ad
  1. 2
      public/theme/src/components/Dashboard/Layout/TopNavbar.vue
  2. 51
      public/theme/src/components/ReCast/Endpoints/EditEndpoint.vue
  3. 32
      public/theme/src/components/ReCast/Login.vue
  4. 19
      public/theme/src/components/ReCast/Streams/EditStream.vue
  5. 9
      public/theme/src/components/ReCast/Streams/List.vue

2
public/theme/src/components/Dashboard/Layout/TopNavbar.vue

@ -19,7 +19,7 @@ @@ -19,7 +19,7 @@
<a href="#/ucp/settings" class="nav-link">
Account Settings
</a>
<a href="#" v-on:click="logout" class="nav-link">
<a href="#" @click="logout" class="nav-link">
Log out
</a>
</li>

51
public/theme/src/components/ReCast/Endpoints/EditEndpoint.vue

@ -7,35 +7,37 @@ @@ -7,35 +7,37 @@
<h4 v-if="$route.params.id != 'add'">Edit "{{ endpoint.name }}"</h4>
<card>
<fg-input label="Name" v-model="endpoint.name"></fg-input>
<form @submit="save">
<fg-input label="Name" v-model="endpoint.name"></fg-input>
<div class="form-group">
<p-checkbox v-model="endpoint.active">Active</p-checkbox>
</div>
<div class="form-group">
<p-checkbox v-model="endpoint.active">Active</p-checkbox>
</div>
<div class="form-group">
<label class="control-label">
Type
</label>
<select class="form-control" v-model="endpoint.type">
<option v-for="name in serviceNames" :value="name">{{name}}</option>
</select>
</div>
<div class="form-group">
<label class="control-label">
Type
</label>
<select class="form-control" v-model="endpoint.type">
<option v-for="name in serviceNames" :value="name">{{name}}</option>
</select>
</div>
<div class="form-group" v-if="serverData.length">
<label class="control-label">
Server
</label>
<select class="form-control" v-model="endpoint.server">
<option v-for="server in serverData" :value="server.value">{{server.name}}</option>
</select>
</div>
<div class="form-group" v-if="serverData.length">
<label class="control-label">
Server
</label>
<select class="form-control" v-model="endpoint.server">
<option v-for="server in serverData" :value="server.value">{{server.name}}</option>
</select>
</div>
<fg-input label="Server" v-model="endpoint.server" v-if="!serverData.length"></fg-input>
<fg-input label="Server" v-model="endpoint.server" v-if="!serverData.length"></fg-input>
<fg-input label="Stream-Key" v-model="endpoint.streamKey"></fg-input>
<fg-input label="Stream-Key" v-model="endpoint.streamKey"></fg-input>
<button class="btn btn-primary" v-on:click="save">Save</button>
<button class="btn btn-primary">Save</button>
</form>
</card>
</div>
</div>
@ -77,7 +79,8 @@ @@ -77,7 +79,8 @@
}
},
methods: {
save: function () {
save: function (e) {
e.preventDefault();
this.axios.post('/streams/' + this.$route.params.streamId + '/endpoints/update', this.endpoint).then(() => {
this.$router.push('/ucp/streams/' + this.$route.params.streamId + '/');
}).catch(error => {

32
public/theme/src/components/ReCast/Login.vue

@ -6,22 +6,25 @@ @@ -6,22 +6,25 @@
<div class="alert alert-danger" v-if="authFailed">Bad credentials</div>
<fg-input type="text"
label="Username"
placeholder="Username"
v-model="login._username">
</fg-input>
<div class="form-group">
<label class="control-label">Password</label>
<input type="password" class="form-control" placeholder="Password" v-model="login._password">
</div>
<form @submit="onLogin">
<fg-input type="text"
label="Username"
placeholder="Username"
v-model="login._username">
</fg-input>
<div class="form-group">
<p-checkbox v-model="rememberMe">Remember Me</p-checkbox>
</div>
<div class="form-group">
<label class="control-label">Password</label>
<input type="password" class="form-control" placeholder="Password" v-model="login._password">
</div>
<button class="btn btn-primary" v-on:click="onLogin">Login</button>
<div class="form-group">
<p-checkbox v-model="rememberMe">Remember Me</p-checkbox>
</div>
<button class="btn btn-primary">Login</button>
</form>
</div>
</div>
</template>
@ -45,7 +48,8 @@ @@ -45,7 +48,8 @@
}
},
methods: {
onLogin: function () {
onLogin: function (e) {
e.preventDefault();
let bodyFormData = new FormData();
bodyFormData.set('_username', this.login._username);
bodyFormData.set('_password', this.login._password);

19
public/theme/src/components/ReCast/Streams/EditStream.vue

@ -7,12 +7,14 @@ @@ -7,12 +7,14 @@
<h4 v-if="$route.params.id != 'add'">Edit "{{ stream.name }}"</h4>
<card>
<fg-input label="Name" v-model="stream.name"></fg-input>
<div class="form-group">
<p-checkbox v-model="stream.active">Active</p-checkbox>
</div>
<form @submit="save">
<fg-input label="Name" v-model="stream.name"></fg-input>
<div class="form-group">
<p-checkbox v-model="stream.active">Active</p-checkbox>
</div>
<button class="btn btn-primary" v-on:click="save">Save</button>
<button class="btn btn-primary">Save</button>
</form>
</card>
<div v-if="this.$route.params.id !== 'add'">
@ -39,8 +41,8 @@ @@ -39,8 +41,8 @@
<td>{{ endpoint.server }}</td>
<td>
<a :href="'#/ucp/streams/' + $route.params.id + '/endpoints/' + endpoint.id" class="btn btn-secondary">Edit</a>
<a v-on:click="toggleEndpoint(endpoint)" class="btn btn-info">{{ endpoint.active ? 'Disable' : 'Enable' }}</a>
<a v-on:click="deleteEndpoint(endpoint)" class="btn btn-danger">Delete</a>
<a @click="toggleEndpoint(endpoint)" class="btn btn-info">{{ endpoint.active ? 'Disable' : 'Enable' }}</a>
<a @click="deleteEndpoint(endpoint)" class="btn btn-danger">Delete</a>
</td>
</tr>
</tbody>
@ -81,7 +83,8 @@ @@ -81,7 +83,8 @@
}
},
methods: {
save: function () {
save: function (e) {
e.preventDefault();
this.axios.post('/streams/update', this.stream).then(() => {
this.$router.push('/ucp/streams/');
}).catch(error => {

9
public/theme/src/components/ReCast/Streams/List.vue

@ -25,8 +25,8 @@ @@ -25,8 +25,8 @@
<td>
<a :href="'#/ucp/streams/' + stream.id + '/setup'" class="btn btn-info">Setup</a>
<a :href="'#/ucp/streams/' + stream.id + '/'" class="btn btn-secondary">Edit</a>
<a v-on:click="regenerateKey(stream)" class="btn btn-danger">Regenerate Stream Key</a>
<a v-on:click="deleteStream(stream)" class="btn btn-danger">Delete</a>
<a @click="regenerateKey(stream)" class="btn btn-danger">Regenerate Stream Key</a>
<a @click="deleteStream(stream)" class="btn btn-danger">Delete</a>
</td>
</tr>
</tbody>
@ -38,7 +38,6 @@ @@ -38,7 +38,6 @@
</div>
</template>
<script>
export default {
data() {
return {
@ -75,10 +74,6 @@ @@ -75,10 +74,6 @@
}
},
}
</script>
<style>
.text-right {
text-align: right;
}
</style>

Loading…
Cancel
Save