userbogd/webguicomp
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

wifi scan dialog implemented

Browse Source
This commit is contained in:
Bogdan Pilyugin 2023-08-25 08:52:50 +02:00
parent 82a604abc0
commit d0a8d1b096
1 changed files with 24 additions and 16 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

40
SelectWiFiDialog.vue
View File

@ -2,16 +2,15 @@
<q-dialog ref="dialogRef" @hide="onDialogHide"> <q-dialog ref="dialogRef" @hide="onDialogHide">
<q-card class="q-dialog-plugin"> <q-card class="q-dialog-plugin">
<div class="q-pa-md q-gutter-md"> <div class="q-pa-md q-gutter-md">
<q-card-section> <q-card-section v-if="visible" align="center">
<q-inner-loading :showing="visible" label="Scaning WiFi..." label-class="text-teal" <div><q-circular-progress indeterminate size="50px" color="primary" class="q-ma-md"></q-circular-progress></div>
label-style="font-size: 1.1em" /> <div>Scanning WiFi...</div>
</q-card-section> </q-card-section>
<q-card-section> <q-card-section v-else>
<q-table title="WiFi networks" :rows="scandata.wifi_scan_res" :columns="columns" row-key="ssid" <q-table title="WiFi networks" :flat="true" :rows="scandata.wifi_scan_res" :columns="columns" row-key="ssid"
hide-no-data="true" wrap-cells="true" @row-click="ClickOnRaw" /> hide-no-data="true" wrap-cells="true" @row-click="ClickOnRaw" />
</q-card-section> </q-card-section>
<q-card-actions> <q-card-actions align="center">
<q-btn label="OK" @click="onOKClick" />
<q-btn label="Cancel" @click="onDialogCancel" /> <q-btn label="Cancel" @click="onDialogCancel" />
</q-card-actions> </q-card-actions>
</div> </div>
@ -23,6 +22,10 @@
import { useDialogPluginComponent } from 'quasar' import { useDialogPluginComponent } from 'quasar'
import { PostData } from "components/webguicomp/network"; import { PostData } from "components/webguicomp/network";
import { reactive, ref } from 'vue'; import { reactive, ref } from 'vue';
import { useQuasar } from 'quasar'
import { ShowDelayDialog } from "./helpers";
const $q = useQuasar();
defineEmits([ defineEmits([
// REQUIRED; need to specify some events that your // REQUIRED; need to specify some events that your
@ -38,17 +41,22 @@ const { dialogRef, onDialogHide, onDialogOK, onDialogCancel } = useDialogPluginC
// example: onDialogOK({ /*...*/ }) - with payload // example: onDialogOK({ /*...*/ }) - with payload
// onDialogCancel - Function to call to settle dialog with "cancel" outcome // onDialogCancel - Function to call to settle dialog with "cancel" outcome
// this is part of our example (so not required)
function onOKClick() {
// on OK, it is REQUIRED to
// call onDialogOK (with optional payload)
onDialogOK()
// or with payload: onDialogOK({ ... })
// ...and it will also hide the dialog automatically
}
function ClickOnRaw(evt, row, index) { function ClickOnRaw(evt, row, index) {
alert(`clicked SSID ${row.ssid}`) $q.dialog({
title: 'Enter network key',
message: `Enter key for "${row.ssid}" network`,
prompt: {
model: '',
isValid: val => val.length > 2, // << here is the magic
type: 'text' // optional
},
cancel: true,
persistent: true
}).onOk(data => {
PostData({ wifi_sta_key: data, wifi_sta_ssid: row.ssid }, 1, 2, ShowDelayDialog('Data saving and reboot...', 10000, null))
onDialogOK();
})
} }
function onDataReady() { function onDataReady() {