109 lines
2.7 KiB
Vue
109 lines
2.7 KiB
Vue
<!-- eslint-disable vue/prop-name-casing -->
|
|
<script>
|
|
import {mapActions, mapGetters} from 'vuex'
|
|
import Input from '@atoms/Input.vue'
|
|
import Textarea from '@atoms/Textarea.vue'
|
|
import DoubleSwitch from '@atoms/DoubleSwitch.vue'
|
|
|
|
export default {
|
|
name: 'EditCard',
|
|
components: {Input, Textarea, DoubleSwitch},
|
|
props: {
|
|
id: {
|
|
default: -1,
|
|
type: Number
|
|
},
|
|
},
|
|
computed: {
|
|
...mapGetters('proxy', ["selectedSite"]),
|
|
},
|
|
mounted() {
|
|
},
|
|
methods: {
|
|
...mapActions('proxy', ["editSelectedSite", "breakSavingSite", "breakeAddingSite"]),
|
|
editData (params) {
|
|
this.editSelectedSite(params)
|
|
},
|
|
breakSavingSiteDate() {
|
|
if (this.id == -1) {
|
|
this.breakeAddingSite()
|
|
} else {
|
|
this.editable_name = this.name
|
|
this.editable_port = this.port
|
|
this.breakSavingSite()
|
|
}
|
|
}
|
|
}
|
|
}
|
|
</script>
|
|
|
|
<template>
|
|
<div class="flex justify-between items-center mb-2">
|
|
<div class="w-fit mr-2">
|
|
<DoubleSwitch
|
|
name="isCbOn"
|
|
firstColor="#8b5cf6"
|
|
secondColor="#2563eb"
|
|
firstTitle="Офлайн"
|
|
secondTitle="Онлайн"
|
|
:isCheck="selectedSite.is_online"
|
|
position="col"
|
|
labelClass="items-start pb-2"
|
|
switchClass="mt-1"
|
|
@switched="(e) => editData({key: 'is_online', value: e})"
|
|
/>
|
|
</div>
|
|
<Input
|
|
name="name"
|
|
:value="selectedSite.name"
|
|
inputClass="!w-[90%] py-2"
|
|
placeholder="Указать путь"
|
|
:onChange="editData"
|
|
/>
|
|
<div>
|
|
<i
|
|
v-tippy="{ content: 'закрыть сервис' }"
|
|
class="ri-close-line ml-2 cursor-pointer"
|
|
@click="breakSavingSiteDate"
|
|
/>
|
|
</div>
|
|
</div>
|
|
<div class="flex items-center mb-2 w-full">
|
|
<span class="mr-2 min-w-[80px]">Порт:</span>
|
|
<Input
|
|
name="port"
|
|
:value="`${selectedSite.port}`"
|
|
inputClass="py-2"
|
|
placeholder="Порт"
|
|
:onChange="editData"
|
|
/>
|
|
</div>
|
|
<div class="flex items-center mb-2 w-full">
|
|
<span class="mr-2 min-w-[80px]">IP proxy:</span>
|
|
<Input
|
|
name="proxy_ip"
|
|
:value="selectedSite.proxy_ip"
|
|
inputClass="py-2"
|
|
placeholder="IP proxy"
|
|
:onChange="editData"
|
|
/>
|
|
</div>
|
|
<div class="flex items-center w-full mb-2">
|
|
<span class="mr-2 min-w-[80px]">IP устр-ва:</span>
|
|
<Input
|
|
name="device_ip"
|
|
:value="selectedSite.device_ip"
|
|
inputClass="py-2"
|
|
placeholder="IP устройства"
|
|
:onChange="editData"
|
|
/>
|
|
</div>
|
|
<Textarea
|
|
name="description"
|
|
:value="selectedSite.description"
|
|
textareaClass="py-2"
|
|
placeholder="Описание..."
|
|
:onChange="editData"
|
|
/>
|
|
</template>
|