Skip to content

Commit

Permalink
updater ui
Browse files Browse the repository at this point in the history
  • Loading branch information
iWirk committed Jul 10, 2022
1 parent 638bc0d commit b5fd1dd
Show file tree
Hide file tree
Showing 4 changed files with 142 additions and 22 deletions.
5 changes: 3 additions & 2 deletions app/Http/Controllers/SettingsController.php
Original file line number Diff line number Diff line change
Expand Up @@ -23,12 +23,13 @@ public function __construct()
* Display a listing of the resource.
*
* @param VoiceSettings $voiceSettings
* @return \Illuminate\Http\Response|Response|ResponseFactory
* @return Response|ResponseFactory
*/
public function edit(VoiceSettings $voiceSettings)
{
return inertia('Settings/Edit', [
'voiceSettings' => $voiceSettings->toArray()
'currentVersion' => 'v0.21.0',
'voiceSettings' => $voiceSettings->toArray()
]);
}

Expand Down
91 changes: 91 additions & 0 deletions resources/js/Pages/Settings/Components/UpdateSettingsForm.vue
Original file line number Diff line number Diff line change
@@ -0,0 +1,91 @@
<template>
<jet-form-section>
<template #title>
Update Settings
</template>

<template #description>
Update your voice provider
</template>

<template #form>

<!-- Name -->
<div class="col-span-6 sm:col-span-4">
<div class="inline-flex items-center text-zinc-700 dark:text-zinc-300">
<spinner v-show="checkingVersion" class="h-7 w-7 mr-4 text-indigo-500"/>
<check-mark-solid v-show="isUpToDate" class="h-7 w-7 mr-4 text-indigo-500"/>
<info-circle-solid v-show="isUpdateAvailable" class="h-7 w-7 mr-4 text-green-500"/>
<div class="flex flex-col items-start">
<span v-show="checkingVersion">Checking for updates...</span>
<span v-show="isUpToDate">EZGames is up to date</span>
<span v-show="isUpdateAvailable">An update is available: <span class="text-green-500">{{newVersion}}</span></span>
<div class="text-xs text-zinc-600 dark:text-zinc-400">
Current version: <span class="text-zinc-700 dark:text-zinc-300">{{ currentVersion }}</span>
</div>
</div>
</div>
<div class="w-full">
<jet-button class="mt-6 ml-11 inline-flex items-center">
<cloud-download class="mr-2"/> UPDATE
</jet-button>
</div>
</div>
</template>
</jet-form-section>
</template>

<script lang="ts">
import {
Component, Mixins, Prop,
} from 'vue-property-decorator'
import JetFormSection from '@/Jetstream/FormSection.vue'
import JetLabel from '@/Jetstream/Label.vue'
import JetSecondaryButton from '@/Jetstream/SecondaryButton.vue'
import JetInputError from '@/Jetstream/InputError.vue'
import JetInput from '@/Jetstream/Input.vue'
import JetActionMessage from '@/Jetstream/ActionMessage.vue'
import JetButton from '@/Jetstream/Button.vue'
import JetSelect from '@/Jetstream/Select.vue'
import Route from '@/Mixins/Route'
import Spinner from '@/Shared/Svgs/Spinner.vue'
import CheckMarkSolid from '@/Shared/Svgs/CheckMarkSolid.vue'
import CloudDownload from '@/Shared/Svgs/CloudDownload.vue'
import InfoCircleSolid from '@/Shared/Svgs/InfoCircleSolid.vue'
@Component({
components: {
InfoCircleSolid,
CloudDownload,
CheckMarkSolid,
Spinner,
JetButton,
JetActionMessage,
JetInput,
JetInputError,
JetSecondaryButton,
JetLabel,
JetFormSection,
JetSelect,
},
})
export default class UpdateSettingsForm extends Mixins(Route) {
@Prop({
type: String,
required: true,
}) currentVersion!: string
newVersion: string = ''
checkingVersion: boolean = false
isUpToDate: boolean = false
isUpdateAvailable: boolean = !(this.checkingVersion && this.isUpToDate)
}
</script>

<style scoped>
</style>
54 changes: 34 additions & 20 deletions resources/js/Pages/Settings/Edit.vue
Original file line number Diff line number Diff line change
@@ -1,23 +1,25 @@
<template>
<app-layout>
<template #header>
<h2 class="breadcrumb">
Settings <span class="breadcrumb-separator">/</span> Edit
</h2>
</template>

<div>
<div class="max-w-7xl mx-auto py-10 sm:px-6 lg:px-8">

<voice-settings-form
:settings="voiceSettings"
/>

<!--<jet-section-border />-->

</div>
</div>
</app-layout>
<app-layout>
<template #header>
<h2 class="breadcrumb">
Settings <span class="breadcrumb-separator">/</span> Edit
</h2>
</template>

<div>
<div class="max-w-7xl mx-auto py-10 sm:px-6 lg:px-8">
<update-settings-form
:current-version="currentVersion"
/>

<jet-section-border/>

<voice-settings-form
:settings="voiceSettings"
/>
</div>
</div>
</app-layout>
</template>

<script lang="ts">
Expand All @@ -26,16 +28,28 @@ import { Component, Prop, Vue } from 'vue-property-decorator'
import AppLayout from '@/Layouts/AppLayout.vue'
import JetSectionBorder from '@/Jetstream/SectionBorder.vue'
import VoiceSettingsForm from '@/Pages/Settings/Components/VoiceSettingsForm.vue'
import UpdateSettingsForm from '@/Pages/Settings/Components/UpdateSettingsForm.vue'
@Component({
components: {
VoiceSettingsForm,
UpdateSettingsForm,
AppLayout,
JetSectionBorder,
},
})
export default class Settings_Index extends Vue {
@Prop({ type: Object, required: true, default: null }) voiceSettings!: any;
@Prop({
type: Object,
required: true,
default: null,
}) voiceSettings!: any
@Prop({
type: String,
required: true,
default: '',
}) currentVersion!: string
mounted() {
// console.log('cc')
Expand Down
14 changes: 14 additions & 0 deletions resources/js/Shared/Svgs/CloudDownload.vue
Original file line number Diff line number Diff line change
@@ -0,0 +1,14 @@
<template>
<svg xmlns="http://www.w3.org/2000/svg" class="h-5 w-5" viewBox="0 0 20 20" fill="currentColor">
<path fill-rule="evenodd" d="M2 9.5A3.5 3.5 0 005.5 13H9v2.586l-1.293-1.293a1 1 0 00-1.414 1.414l3 3a1 1 0 001.414 0l3-3a1 1 0 00-1.414-1.414L11 15.586V13h2.5a4.5 4.5 0 10-.616-8.958 4.002 4.002 0 10-7.753 1.977A3.5 3.5 0 002 9.5zm9 3.5H9V8a1 1 0 012 0v5z" clip-rule="evenodd" />
</svg>
</template>

<script lang="ts">
import { Vue, Component } from 'vue-property-decorator'
@Component
export default class CloudDownload extends Vue {
//
}
</script>

0 comments on commit b5fd1dd

Please sign in to comment.