<script setup lang="ts">
import InputNumber from 'primevue/inputnumber';
import InputText from 'primevue/inputtext';
import SelectButton from 'primevue/selectbutton';
import FilePicker from '../FilePicker.vue';
import OptionCategory from '../OptionCategory.vue';
import OptionRow from '../OptionRow.vue';
import { usePrfStore } from '../../stores';
import { useI18n } from 'vue-i18n';

const { t } = useI18n();

const prf = usePrfStore();
</script>

<template>
    <OptionCategory :title="t('cfg.network.title')">
        <OptionRow :title="t('cfg.network.type')">
            <SelectButton
                v-model="prf.current!.data.network.network_type"
                :options="[
                    { title: t('cfg.network.remote'), value: 'Remote' },
                    { title: t('cfg.network.localArtemis'), value: 'Artemis' },
                ]"
                :allow-empty="false"
                option-label="title"
                option-value="value"
            />
        </OptionRow>
        <OptionRow
            v-if="prf.current!.data.network.network_type === 'Artemis'"
            :title="t('cfg.network.artemisPath')"
        >
            <FilePicker
                :directory="false"
                promptname="index.py"
                extension="py"
                :value="prf.current!.data.network.local_path"
                :callback="
                    (value: string) =>
                        (prf.current!.data.network.local_path = value)
                "
            ></FilePicker>
        </OptionRow>
        <!-- <OptionRow
            v-if="prf.current!.data.network.network_type == 'Artemis'"
            title="ARTEMiS console"
        >
            <ToggleSwitch v-model="prf.current!.data.network.local_console" />
        </OptionRow> -->
        <OptionRow
            v-if="prf.current!.data.network.network_type == 'Remote'"
            :title="t('cfg.network.address')"
        >
            <InputText
                class="shrink"
                size="small"
                :maxlength="40"
                placeholder="192.168.1.234"
                v-model="prf.current!.data.network.remote_address"
            /> </OptionRow
        ><OptionRow
            v-if="prf.current!.data.network.network_type == 'Remote'"
            :title="t('cfg.network.keychip')"
        >
            <InputText
                class="shrink"
                size="small"
                :maxlength="16"
                placeholder="A123-01234567890"
                v-model="prf.current!.data.network.keychip"
            /> </OptionRow
        ><OptionRow :title="t('cfg.network.subnet')">
            <InputText
                class="shrink"
                size="small"
                :maxlength="15"
                placeholder="192.168.1.0"
                v-model="prf.current!.data.network.subnet"
            />
        </OptionRow>
        <OptionRow :title="t('cfg.network.addrSuffix')">
            <InputNumber
                class="shrink"
                size="small"
                :maxlength="3"
                :min="0"
                :max="255"
                placeholder="12"
                v-model="prf.current!.data.network.suffix"
            />
        </OptionRow>
    </OptionCategory>
</template>
