- ListTableContent Action sütunu eklendi.
- DialogStore id elle girilebilecek
This commit is contained in:
@ -7,7 +7,7 @@
|
|||||||
<div class="table-head-content">Sıra No</div>
|
<div class="table-head-content">Sıra No</div>
|
||||||
</th>
|
</th>
|
||||||
<template v-for="(headCell, h) in tableHeader">
|
<template v-for="(headCell, h) in tableHeader">
|
||||||
<th :style="headCell.style || ''">
|
<th :style="[headCell.style || '']">
|
||||||
<div
|
<div
|
||||||
:class="[
|
:class="[
|
||||||
'table-head-content',
|
'table-head-content',
|
||||||
@ -47,13 +47,16 @@
|
|||||||
</div>
|
</div>
|
||||||
</th>
|
</th>
|
||||||
</template>
|
</template>
|
||||||
|
<th
|
||||||
|
:style="[rowActionStyle || '']"
|
||||||
|
v-if="rowActions !== undefined && rowActions.length > 0">
|
||||||
|
<div class="table-head-content">İşlemler</div>
|
||||||
|
</th>
|
||||||
</tr>
|
</tr>
|
||||||
</thead>
|
</thead>
|
||||||
<tbody>
|
<tbody>
|
||||||
<tr v-if="tableData.length === 0 && !isPreview">
|
<tr v-if="tableData.length === 0 && !isPreview">
|
||||||
<td :colspan="rowNumber ? tableHeader.length + 1 : tableHeader.length">
|
<td :colspan="ColSpan">Veri bulunamadı</td>
|
||||||
Veri bulunamadı
|
|
||||||
</td>
|
|
||||||
</tr>
|
</tr>
|
||||||
<tr
|
<tr
|
||||||
v-else
|
v-else
|
||||||
@ -87,6 +90,25 @@
|
|||||||
<td v-else v-html="dataCell.computeHtml(dataRow)"></td>
|
<td v-else v-html="dataCell.computeHtml(dataRow)"></td>
|
||||||
</template>
|
</template>
|
||||||
</slot>
|
</slot>
|
||||||
|
<td
|
||||||
|
v-if="rowActions !== undefined && rowActions.length > 0"
|
||||||
|
:class="[actionFixed ? 'action-fixed' : '']">
|
||||||
|
<template v-for="(action, ai) in rowActions">
|
||||||
|
<button
|
||||||
|
:class="[
|
||||||
|
'button-c button-icon button-export',
|
||||||
|
action.class !== undefined ? 'back-grad back-grad-' + action.class : ''
|
||||||
|
]"
|
||||||
|
@click="LocalRowDataAction($event, action.action, dataRow, i)">
|
||||||
|
<i class="ico-c" v-if="action.icon !== undefined">
|
||||||
|
<svg>
|
||||||
|
<use :href="icourl + '#' + action.icon"></use>
|
||||||
|
</svg>
|
||||||
|
</i>
|
||||||
|
<span class="panel-date">{{ action.text }}</span>
|
||||||
|
</button>
|
||||||
|
</template>
|
||||||
|
</td>
|
||||||
</tr>
|
</tr>
|
||||||
<template
|
<template
|
||||||
v-if="
|
v-if="
|
||||||
@ -120,6 +142,7 @@
|
|||||||
import { ref, reactive, computed, watch } from 'vue'
|
import { ref, reactive, computed, watch } from 'vue'
|
||||||
import type { Ref } from 'vue'
|
import type { Ref } from 'vue'
|
||||||
import { useGlobalStore } from '@/stores/globalStore'
|
import { useGlobalStore } from '@/stores/globalStore'
|
||||||
|
import icourl from '@/assets/images/icons.svg'
|
||||||
const globalStore = useGlobalStore()
|
const globalStore = useGlobalStore()
|
||||||
|
|
||||||
interface ITableHead {
|
interface ITableHead {
|
||||||
@ -150,11 +173,15 @@
|
|||||||
rowNumber?: boolean
|
rowNumber?: boolean
|
||||||
totalValues?: Record<string, any>
|
totalValues?: Record<string, any>
|
||||||
isPreview?: boolean
|
isPreview?: boolean
|
||||||
|
rowActions?: Record<string, any>[]
|
||||||
|
actionFixed?: boolean
|
||||||
|
rowActionStyle?: string
|
||||||
}
|
}
|
||||||
const props = withDefaults(defineProps<Props>(), {
|
const props = withDefaults(defineProps<Props>(), {
|
||||||
tableData: () => [],
|
tableData: () => [],
|
||||||
rowNumber: false,
|
rowNumber: false,
|
||||||
isPreview: false
|
isPreview: false,
|
||||||
|
actionFixed: false
|
||||||
})
|
})
|
||||||
|
|
||||||
const emit = defineEmits(['update:sortData', 'update:pagination'])
|
const emit = defineEmits(['update:sortData', 'update:pagination'])
|
||||||
@ -186,9 +213,27 @@
|
|||||||
}
|
}
|
||||||
})
|
})
|
||||||
|
|
||||||
|
const ColSpan = computed<number>(() => {
|
||||||
|
var span = props.tableHeader.length
|
||||||
|
if (props.rowNumber) span++
|
||||||
|
if (props.rowActions) span++
|
||||||
|
return span
|
||||||
|
})
|
||||||
const LocalRowAction = (d: Record<string, any>) => {
|
const LocalRowAction = (d: Record<string, any>) => {
|
||||||
if (props.rowAction !== undefined) {
|
if (props.rowAction !== undefined) {
|
||||||
(props.rowAction! as Function)(d)
|
;(props.rowAction! as Function)(d)
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
const LocalRowDataAction = (
|
||||||
|
e: Event,
|
||||||
|
action: Function | undefined,
|
||||||
|
dataRow: Record<string, any>,
|
||||||
|
i: number | string
|
||||||
|
) => {
|
||||||
|
if (action !== undefined) {
|
||||||
|
e.stopImmediatePropagation()
|
||||||
|
action(dataRow, i)
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
@ -223,3 +268,11 @@
|
|||||||
{ deep: true }
|
{ deep: true }
|
||||||
)
|
)
|
||||||
</script>
|
</script>
|
||||||
|
<style scoped>
|
||||||
|
.action-fixed {
|
||||||
|
position: absolute;
|
||||||
|
z-index: 9;
|
||||||
|
top: 0;
|
||||||
|
right: 0;
|
||||||
|
}
|
||||||
|
</style>
|
||||||
|
|||||||
@ -42,7 +42,7 @@
|
|||||||
const dialogStore = useDialogStore()
|
const dialogStore = useDialogStore()
|
||||||
|
|
||||||
export interface Props {
|
export interface Props {
|
||||||
id: number
|
id: number | string
|
||||||
dialogData: Record<string, any>
|
dialogData: Record<string, any>
|
||||||
}
|
}
|
||||||
const props = withDefaults(defineProps<Props>(), {})
|
const props = withDefaults(defineProps<Props>(), {})
|
||||||
|
|||||||
@ -117,7 +117,10 @@
|
|||||||
v-model:pagination="localPagination"
|
v-model:pagination="localPagination"
|
||||||
:rowNumber="rowNumber"
|
:rowNumber="rowNumber"
|
||||||
:totalValues="localTotalValues"
|
:totalValues="localTotalValues"
|
||||||
:isPreview="isPreview" />
|
:isPreview="isPreview"
|
||||||
|
:rowActions="rowActions"
|
||||||
|
:actionFixed="actionFixed"
|
||||||
|
:rowActionStyle="rowActionStyle" />
|
||||||
</slot>
|
</slot>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
@ -194,6 +197,9 @@
|
|||||||
rowNumber?: boolean
|
rowNumber?: boolean
|
||||||
totalValues?: Record<string, any>
|
totalValues?: Record<string, any>
|
||||||
isPreview?: boolean
|
isPreview?: boolean
|
||||||
|
rowActions?: Record<string, any>[]
|
||||||
|
actionFixed?: boolean
|
||||||
|
rowActionStyle?:string
|
||||||
}
|
}
|
||||||
|
|
||||||
const props = withDefaults(defineProps<Props>(), {
|
const props = withDefaults(defineProps<Props>(), {
|
||||||
@ -205,7 +211,8 @@
|
|||||||
export: true,
|
export: true,
|
||||||
search: true,
|
search: true,
|
||||||
rowNumber: false,
|
rowNumber: false,
|
||||||
isPreview: false
|
isPreview: false,
|
||||||
|
actionFixed:false
|
||||||
})
|
})
|
||||||
|
|
||||||
const emit = defineEmits([
|
const emit = defineEmits([
|
||||||
|
|||||||
@ -7,11 +7,13 @@ export const useDialogStore = defineStore('dialogStore', () => {
|
|||||||
const CreateDialog = (data: Record<string, any>) => {
|
const CreateDialog = (data: Record<string, any>) => {
|
||||||
const rnd: number = Number(Math.floor(Math.random() * 10000000000))
|
const rnd: number = Number(Math.floor(Math.random() * 10000000000))
|
||||||
|
|
||||||
dialogs[rnd] = {} as Record<string, any>
|
const localId = data.id || rnd
|
||||||
dialogs[rnd].id = rnd
|
|
||||||
dialogs[rnd].data = data
|
dialogs[localId] = {} as Record<string, any>
|
||||||
|
dialogs[localId].id = localId
|
||||||
|
dialogs[localId].data = data
|
||||||
}
|
}
|
||||||
const CloseDialog = (id: number) => {
|
const CloseDialog = (id: number | string) => {
|
||||||
delete dialogs[id]
|
delete dialogs[id]
|
||||||
}
|
}
|
||||||
return {
|
return {
|
||||||
|
|||||||
@ -2,7 +2,8 @@ import axios from 'axios'
|
|||||||
import { useUsersStore } from '@/stores/usersStore'
|
import { useUsersStore } from '@/stores/usersStore'
|
||||||
import router from '@/router'
|
import router from '@/router'
|
||||||
|
|
||||||
axios.defaults.baseURL = 'https://panelapi.cekilisevi.gov.tr/'
|
//axios.defaults.baseURL = 'https://panelapi.cekilisevi.gov.tr/'
|
||||||
|
axios.defaults.baseURL = 'https://mpiapi.beyaz.net/'
|
||||||
//axios.defaults.timeout = 2000;
|
//axios.defaults.timeout = 2000;
|
||||||
axios.defaults.headers['Content-Type'] = 'application/json; charset=utf-8'
|
axios.defaults.headers['Content-Type'] = 'application/json; charset=utf-8'
|
||||||
import { useDataStore } from '@/stores/dataStore'
|
import { useDataStore } from '@/stores/dataStore'
|
||||||
|
|||||||
@ -1,75 +1,68 @@
|
|||||||
<template>
|
<template>
|
||||||
<AdminLayout>
|
<AdminLayout>
|
||||||
<Breadcrumb currentPageText='Popup Listesi' />
|
<Breadcrumb currentPageText="Popup Listesi" />
|
||||||
<section class='section-list'>
|
<section class="section-list">
|
||||||
<list-table-content
|
<list-table-content
|
||||||
:tableHeader='tableHeader'
|
:tableHeader="tableHeader"
|
||||||
:rowAction='updateAction'
|
:rowAction="updateAction"
|
||||||
:addAction='addAction'
|
:addAction="addAction"
|
||||||
icon='sitemanagement'
|
icon="sitemanagement"
|
||||||
title='Popup Listesi'
|
title="Popup Listesi"
|
||||||
listText='Popup'
|
listText="Popup"
|
||||||
:tableData='popups'
|
:tableData="popups"
|
||||||
apiText='Popup Listesi'
|
apiText="Popup Listesi"
|
||||||
apiList='Popup'
|
apiList="Popup"
|
||||||
v-model:refresh="refresh"
|
v-model:refresh="refresh"
|
||||||
/>
|
:rowActions="rowActions"
|
||||||
|
:rowActionStyle="'width:10%;'" />
|
||||||
</section>
|
</section>
|
||||||
<panel-wrapper
|
<panel-wrapper
|
||||||
v-if='panel'
|
v-if="panel"
|
||||||
v-model='panel'
|
v-model="panel"
|
||||||
:panel-title="
|
:panel-title="isUpdate ? 'Popup Düzenle' : 'Popup Ekle'">
|
||||||
isUpdate
|
|
||||||
? 'Popup Düzenle'
|
|
||||||
: 'Popup Ekle'
|
|
||||||
">
|
|
||||||
<template #panelContent>
|
<template #panelContent>
|
||||||
<form-input
|
<form-input v-model="panelPopup.baslik" label="Başlık" />
|
||||||
v-model='panelPopup.baslik'
|
<form-input v-model="panelPopup.url" label="Url" />
|
||||||
label='Başlık' />
|
|
||||||
<form-input
|
|
||||||
v-model='panelPopup.url'
|
|
||||||
label='Url' />
|
|
||||||
<form-file
|
<form-file
|
||||||
v-model='panelPopup.resimUrl'
|
v-model="panelPopup.resimUrl"
|
||||||
label='Resim Url'
|
label="Resim Url"
|
||||||
:fileTypes="['png','jpg','jpeg']"
|
:fileTypes="['png', 'jpg', 'jpeg']"
|
||||||
elclass='panel-documents-item'
|
elclass="panel-documents-item"
|
||||||
fileType='img' />
|
fileType="img" />
|
||||||
<div class='image-preview-wrapper' v-if='resimPreview'>
|
<div class="image-preview-wrapper" v-if="resimPreview">
|
||||||
<img :src='resimPreview' alt='Seçilen Resim' />
|
<img :src="resimPreview" alt="Seçilen Resim" />
|
||||||
</div>
|
</div>
|
||||||
<form-checkbox
|
<form-checkbox
|
||||||
:listData="Checker"
|
:listData="Checker"
|
||||||
listText="label"
|
listText="label"
|
||||||
listVal="val"
|
listVal="val"
|
||||||
v-model="panelPopup.durum" >
|
v-model="panelPopup.durum">
|
||||||
<template #checktext0>
|
<template #checktext0>
|
||||||
<span>
|
<span>Aktif</span>
|
||||||
Aktif
|
</template>
|
||||||
</span>
|
</form-checkbox>
|
||||||
</template>
|
|
||||||
</form-checkbox>
|
|
||||||
</template>
|
</template>
|
||||||
<template #footerButton>
|
<template #footerButton>
|
||||||
<div class='button-c button-save' @click='save'>
|
<div class="button-c button-save" @click="save">
|
||||||
{{ isUpdate ? 'Kaydet' : 'Ekle' }}
|
{{ isUpdate ? 'Kaydet' : 'Ekle' }}
|
||||||
</div>
|
</div>
|
||||||
</template>
|
</template>
|
||||||
</panel-wrapper>
|
</panel-wrapper>
|
||||||
</AdminLayout>
|
</AdminLayout>
|
||||||
</template>
|
</template>
|
||||||
<script setup lang='ts'>
|
<script setup lang="ts">
|
||||||
import { ref, onMounted, computed } from 'vue'
|
import { ref, onMounted, computed } from 'vue'
|
||||||
import AdminLayout from '@/layouts/AdminLayout.vue'
|
import AdminLayout from '@/layouts/AdminLayout.vue'
|
||||||
import { Breadcrumb } from '@/components/global'
|
import { Breadcrumb } from '@/components/global'
|
||||||
import router from '@/router'
|
import router from '@/router'
|
||||||
import { useDataStore } from '@/stores/dataStore'
|
import { useDataStore } from '@/stores/dataStore'
|
||||||
import PanelWrapper from '@/components/PanelWrapper.vue'
|
import PanelWrapper from '@/components/PanelWrapper.vue'
|
||||||
import { useGlobalStore } from '@/stores/globalStore'
|
import { useGlobalStore } from '@/stores/globalStore'
|
||||||
const globalStore = useGlobalStore()
|
const globalStore = useGlobalStore()
|
||||||
|
import { useDialogStore } from '@/components/global/dialogStore'
|
||||||
|
const dialogStore = useDialogStore()
|
||||||
|
|
||||||
const Checker = ref([
|
const Checker = ref([
|
||||||
{
|
{
|
||||||
label: '',
|
label: '',
|
||||||
val: 'durum'
|
val: 'durum'
|
||||||
@ -80,8 +73,8 @@
|
|||||||
const isUpdate = ref<boolean>(false)
|
const isUpdate = ref<boolean>(false)
|
||||||
|
|
||||||
const refresh = ref<boolean>(false)
|
const refresh = ref<boolean>(false)
|
||||||
const panelPopup = ref<Record<string,any>>({})
|
const panelPopup = ref<Record<string, any>>({})
|
||||||
const popups = ref<Record<string,any>[]>([])
|
const popups = ref<Record<string, any>[]>([])
|
||||||
|
|
||||||
const tableHeader = ref<Record<string, any>[]>([
|
const tableHeader = ref<Record<string, any>[]>([
|
||||||
{
|
{
|
||||||
@ -106,16 +99,50 @@
|
|||||||
name: 'durum',
|
name: 'durum',
|
||||||
title: 'Durum',
|
title: 'Durum',
|
||||||
computeHtml: (v: Record<string, any>): string => {
|
computeHtml: (v: Record<string, any>): string => {
|
||||||
if (v.durum) {
|
if (v.durum) {
|
||||||
return `<span class="back-grad back-grad-ok">
|
return `<span class="back-grad back-grad-ok">
|
||||||
Aktif
|
Aktif
|
||||||
</strong>`
|
</strong>`
|
||||||
} else {
|
} else {
|
||||||
return ``
|
return ``
|
||||||
}
|
|
||||||
}
|
}
|
||||||
|
}
|
||||||
}
|
}
|
||||||
])
|
])
|
||||||
|
|
||||||
|
const DeleteRowPop = (data: Record<string, any>, i: number) => {
|
||||||
|
dialogStore.CreateDialog({
|
||||||
|
title: 'Popup Sil',
|
||||||
|
id: 'deletepop',
|
||||||
|
content: 'Popup silmek istediğinize emin misiniz?',
|
||||||
|
closeText: 'Vazgeç',
|
||||||
|
buttons: [
|
||||||
|
{
|
||||||
|
label: 'Popup Sil',
|
||||||
|
type: 'alert',
|
||||||
|
function: DeleteRow(data.id)
|
||||||
|
}
|
||||||
|
]
|
||||||
|
})
|
||||||
|
}
|
||||||
|
|
||||||
|
const DeleteRow = async (id: number | string) => {
|
||||||
|
var dt = await dataStore.dataDelete('Katilimci/DeleteCekilisKatilimci/' + id)
|
||||||
|
|
||||||
|
if (dt !== 'errorfalse') {
|
||||||
|
dialogStore.CloseDialog('deletepop')
|
||||||
|
refresh.value = true
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
const rowActions = ref<Record<string, any>[]>([
|
||||||
|
{
|
||||||
|
text: 'Sil',
|
||||||
|
class: 'alert',
|
||||||
|
action: DeleteRowPop
|
||||||
|
}
|
||||||
|
])
|
||||||
|
|
||||||
const resimPreview = computed(() => {
|
const resimPreview = computed(() => {
|
||||||
if (!panelPopup.value.resimUrl) return null
|
if (!panelPopup.value.resimUrl) return null
|
||||||
|
|
||||||
@ -127,7 +154,6 @@
|
|||||||
return URL.createObjectURL(panelPopup.value.resimUrl)
|
return URL.createObjectURL(panelPopup.value.resimUrl)
|
||||||
})
|
})
|
||||||
|
|
||||||
|
|
||||||
const OpenMenu = (row: any) => {
|
const OpenMenu = (row: any) => {
|
||||||
router.push('slider-yonetimi/' + row.id)
|
router.push('slider-yonetimi/' + row.id)
|
||||||
}
|
}
|
||||||
@ -136,21 +162,19 @@
|
|||||||
panelPopup.value = {
|
panelPopup.value = {
|
||||||
baslik: '',
|
baslik: '',
|
||||||
resimUrl: '',
|
resimUrl: '',
|
||||||
url:'',
|
url: '',
|
||||||
durum: false
|
durum: false
|
||||||
}
|
}
|
||||||
panel.value = true
|
panel.value = true
|
||||||
|
|
||||||
}
|
}
|
||||||
const updateAction = (row: any) => {
|
const updateAction = (row: any) => {
|
||||||
panelPopup.value = popups.value.find(x => x.id == row.id) || {}
|
panelPopup.value = popups.value.find((x) => x.id == row.id) || {}
|
||||||
panel.value = true
|
panel.value = true
|
||||||
isUpdate.value = true
|
isUpdate.value = true
|
||||||
}
|
}
|
||||||
|
|
||||||
const save = async () => {
|
const save = async () => {
|
||||||
if (isUpdate.value)
|
if (isUpdate.value) {
|
||||||
{
|
|
||||||
const formData = new FormData()
|
const formData = new FormData()
|
||||||
formData.append('Baslik', panelPopup.value.baslik)
|
formData.append('Baslik', panelPopup.value.baslik)
|
||||||
formData.append('Durum', panelPopup.value.durum)
|
formData.append('Durum', panelPopup.value.durum)
|
||||||
@ -158,7 +182,7 @@
|
|||||||
formData.append('ResimUrl', panelPopup.value.resimUrl)
|
formData.append('ResimUrl', panelPopup.value.resimUrl)
|
||||||
}
|
}
|
||||||
|
|
||||||
let update:any = dataStore.dataPut('Popup/'+panelPopup.value.id,{
|
let update: any = dataStore.dataPut('Popup/' + panelPopup.value.id, {
|
||||||
data: formData,
|
data: formData,
|
||||||
headers: { 'Content-Type': 'multipart/form-data' }
|
headers: { 'Content-Type': 'multipart/form-data' }
|
||||||
})
|
})
|
||||||
@ -167,8 +191,7 @@
|
|||||||
isUpdate.value = false
|
isUpdate.value = false
|
||||||
refresh.value = true
|
refresh.value = true
|
||||||
}
|
}
|
||||||
}
|
} else {
|
||||||
else {
|
|
||||||
let add = await dataStore.dataPost('Popup', {
|
let add = await dataStore.dataPost('Popup', {
|
||||||
data: panelPopup.value,
|
data: panelPopup.value,
|
||||||
headers: { 'Content-Type': 'multipart/form-data' }
|
headers: { 'Content-Type': 'multipart/form-data' }
|
||||||
@ -179,7 +202,6 @@
|
|||||||
refresh.value = true
|
refresh.value = true
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
}
|
}
|
||||||
</script>
|
</script>
|
||||||
<style>
|
<style>
|
||||||
|
|||||||
@ -10,24 +10,64 @@
|
|||||||
listText="Sayfa"
|
listText="Sayfa"
|
||||||
addRoute="yeni-sayfa"
|
addRoute="yeni-sayfa"
|
||||||
apiList="Page"
|
apiList="Page"
|
||||||
apiText="Sayfa Listesi" />
|
apiText="Sayfa Listesi"
|
||||||
|
:refresh="refresh"
|
||||||
|
:rowActions="rowActions"
|
||||||
|
:rowActionStyle="'width:10%;'" />
|
||||||
</section>
|
</section>
|
||||||
</AdminLayout>
|
</AdminLayout>
|
||||||
</template>
|
</template>
|
||||||
<script setup lang="ts">
|
<script setup lang="ts">
|
||||||
import { ref } from 'vue'
|
import { ref } from 'vue'
|
||||||
import AdminLayout from '@/layouts/AdminLayout.vue'
|
import AdminLayout from '@/layouts/AdminLayout.vue'
|
||||||
import { useGlobalStore } from '@/stores/globalStore'
|
import { useDialogStore } from '@/components/global/dialogStore'
|
||||||
const globalStore = useGlobalStore()
|
const dialogStore = useDialogStore()
|
||||||
|
import { useDataStore } from '@/stores/dataStore'
|
||||||
|
const dataStore = useDataStore()
|
||||||
import router from '@/router'
|
import router from '@/router'
|
||||||
|
|
||||||
const tableHeader = ref<Record<string,any>[]>([
|
const tableHeader = ref<Record<string, any>[]>([
|
||||||
{
|
{
|
||||||
name: 'title',
|
name: 'title',
|
||||||
title: 'Sayfa Başlığı',
|
title: 'Sayfa Başlığı',
|
||||||
sort: true
|
sort: true
|
||||||
}
|
}
|
||||||
])
|
])
|
||||||
|
const refresh = ref<boolean>(false)
|
||||||
|
|
||||||
|
const DeleteRowPop = (data: Record<string, any>, i: number) => {
|
||||||
|
dialogStore.CreateDialog({
|
||||||
|
title: 'Slider Sil',
|
||||||
|
id: 'deleteslider',
|
||||||
|
content: 'Slider silmek istediğinize emin misiniz?',
|
||||||
|
closeText: 'Vazgeç',
|
||||||
|
buttons: [
|
||||||
|
{
|
||||||
|
label: 'Slider Sil',
|
||||||
|
type: 'alert',
|
||||||
|
function: DeleteRow(data.id)
|
||||||
|
}
|
||||||
|
]
|
||||||
|
})
|
||||||
|
}
|
||||||
|
|
||||||
|
const DeleteRow = async (id: number | string) => {
|
||||||
|
var dt = await dataStore.dataDelete('Katilimci/DeleteCekilisKatilimci/' + id)
|
||||||
|
|
||||||
|
if (dt !== 'errorfalse') {
|
||||||
|
dialogStore.CloseDialog('deleteslider')
|
||||||
|
refresh.value = true
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
const rowActions = ref<Record<string, any>[]>([
|
||||||
|
{
|
||||||
|
text: 'Sil',
|
||||||
|
class: 'alert',
|
||||||
|
action: DeleteRowPop
|
||||||
|
}
|
||||||
|
])
|
||||||
|
|
||||||
const pageDetail = (row: any) => {
|
const pageDetail = (row: any) => {
|
||||||
router.push('/sayfalar/detay/' + row.id)
|
router.push('/sayfalar/detay/' + row.id)
|
||||||
}
|
}
|
||||||
|
|||||||
@ -1,73 +1,63 @@
|
|||||||
<template>
|
<template>
|
||||||
<AdminLayout>
|
<AdminLayout>
|
||||||
<Breadcrumb currentPageText='Slider Listesi' />
|
<Breadcrumb currentPageText="Slider Listesi" />
|
||||||
<section class='section-list'>
|
<section class="section-list">
|
||||||
<list-table-content
|
<list-table-content
|
||||||
:tableHeader='tableHeader'
|
:tableHeader="tableHeader"
|
||||||
:rowAction='updateAction'
|
:rowAction="updateAction"
|
||||||
:addAction='addAction'
|
:addAction="addAction"
|
||||||
icon='sitemanagement'
|
icon="sitemanagement"
|
||||||
title='Slider Listesi'
|
title="Slider Listesi"
|
||||||
listText='Slider'
|
listText="Slider"
|
||||||
:tableData='sliders'
|
:tableData="sliders"
|
||||||
apiText='Slider Listesi'
|
apiText="Slider Listesi"
|
||||||
apiList='Slider'
|
apiList="Slider"
|
||||||
v-model:refresh='refresh'
|
v-model:refresh="refresh"
|
||||||
/>
|
:rowActions="rowActions"
|
||||||
|
:rowActionStyle="'width:10%;'" />
|
||||||
</section>
|
</section>
|
||||||
<panel-wrapper
|
<panel-wrapper
|
||||||
v-if='panel'
|
v-if="panel"
|
||||||
v-model='panel'
|
v-model="panel"
|
||||||
:panel-title="
|
:panel-title="isUpdate ? 'Slider Düzenle' : 'Slider Ekle'">
|
||||||
isUpdate
|
|
||||||
? 'Slider Düzenle'
|
|
||||||
: 'Slider Ekle'
|
|
||||||
">
|
|
||||||
<template #panelContent>
|
<template #panelContent>
|
||||||
<form-input
|
<form-input required v-model="panelSlider.baslik" label="Başlık" />
|
||||||
required
|
|
||||||
v-model='panelSlider.baslik'
|
|
||||||
label='Başlık' />
|
|
||||||
<form-file
|
<form-file
|
||||||
v-model='panelSlider.resimUrl'
|
v-model="panelSlider.resimUrl"
|
||||||
label='Resim Url'
|
label="Resim Url"
|
||||||
:fileTypes="['png','jpg','jpeg']"
|
:fileTypes="['png', 'jpg', 'jpeg']"
|
||||||
elclass='panel-documents-item'
|
elclass="panel-documents-item"
|
||||||
fileType='img' />
|
fileType="img" />
|
||||||
<div class='image-preview-wrapper' v-if='resimPreview'>
|
<div class="image-preview-wrapper" v-if="resimPreview">
|
||||||
<img :src='resimPreview' alt='Seçilen Resim' />
|
<img :src="resimPreview" alt="Seçilen Resim" />
|
||||||
</div>
|
</div>
|
||||||
<form-input
|
<form-input required v-model="panelSlider.url" label="Url" />
|
||||||
required
|
<form-input required v-model="panelSlider.sira" label="Sıra" />
|
||||||
v-model='panelSlider.url'
|
|
||||||
label='Url' />
|
|
||||||
<form-input
|
|
||||||
required
|
|
||||||
v-model='panelSlider.sira'
|
|
||||||
label='Sıra' />
|
|
||||||
</template>
|
</template>
|
||||||
<template #footerButton>
|
<template #footerButton>
|
||||||
<div class='button-c button-save' @click='save'>
|
<div class="button-c button-save" @click="save">
|
||||||
{{ isUpdate ? 'Kaydet' : 'Ekle' }}
|
{{ isUpdate ? 'Kaydet' : 'Ekle' }}
|
||||||
</div>
|
</div>
|
||||||
</template>
|
</template>
|
||||||
</panel-wrapper>
|
</panel-wrapper>
|
||||||
</AdminLayout>
|
</AdminLayout>
|
||||||
</template>
|
</template>
|
||||||
<script setup lang='ts'>
|
<script setup lang="ts">
|
||||||
import { ref, onMounted, computed } from 'vue'
|
import { ref, onMounted, computed } from 'vue'
|
||||||
import AdminLayout from '@/layouts/AdminLayout.vue'
|
import AdminLayout from '@/layouts/AdminLayout.vue'
|
||||||
import { Breadcrumb } from '@/components/global'
|
import { Breadcrumb } from '@/components/global'
|
||||||
import router from '@/router'
|
import router from '@/router'
|
||||||
import { useDataStore } from '@/stores/dataStore'
|
import { useDataStore } from '@/stores/dataStore'
|
||||||
import PanelWrapper from '@/components/PanelWrapper.vue'
|
import PanelWrapper from '@/components/PanelWrapper.vue'
|
||||||
|
import { useDialogStore } from '@/components/global/dialogStore'
|
||||||
|
const dialogStore = useDialogStore()
|
||||||
|
|
||||||
const dataStore = useDataStore()
|
const dataStore = useDataStore()
|
||||||
const panel = ref<boolean>(false)
|
const panel = ref<boolean>(false)
|
||||||
const isUpdate = ref<boolean>(false)
|
const isUpdate = ref<boolean>(false)
|
||||||
const refresh = ref<boolean>(false)
|
const refresh = ref<boolean>(false)
|
||||||
const panelSlider = ref<Record<string,any>>({})
|
const panelSlider = ref<Record<string, any>>({})
|
||||||
const sliders = ref<Record<string,any>[]>([])
|
const sliders = ref<Record<string, any>[]>([])
|
||||||
|
|
||||||
const tableHeader = ref<Record<string, any>[]>([
|
const tableHeader = ref<Record<string, any>[]>([
|
||||||
{
|
{
|
||||||
@ -91,6 +81,40 @@
|
|||||||
sort: true
|
sort: true
|
||||||
}
|
}
|
||||||
])
|
])
|
||||||
|
|
||||||
|
const DeleteRowPop = (data: Record<string, any>, i: number) => {
|
||||||
|
dialogStore.CreateDialog({
|
||||||
|
title: 'Slider Sil',
|
||||||
|
id: 'deleteslider',
|
||||||
|
content: 'Slider silmek istediğinize emin misiniz?',
|
||||||
|
closeText: 'Vazgeç',
|
||||||
|
buttons: [
|
||||||
|
{
|
||||||
|
label: 'Slider Sil',
|
||||||
|
type: 'alert',
|
||||||
|
function: DeleteRow(data.id)
|
||||||
|
}
|
||||||
|
]
|
||||||
|
})
|
||||||
|
}
|
||||||
|
|
||||||
|
const DeleteRow = async (id: number | string) => {
|
||||||
|
var dt = await dataStore.dataDelete('Katilimci/DeleteCekilisKatilimci/' + id)
|
||||||
|
|
||||||
|
if (dt !== 'errorfalse') {
|
||||||
|
dialogStore.CloseDialog('deleteslider')
|
||||||
|
refresh.value = true
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
const rowActions = ref<Record<string, any>[]>([
|
||||||
|
{
|
||||||
|
text: 'Sil',
|
||||||
|
class: 'alert',
|
||||||
|
action: DeleteRowPop
|
||||||
|
}
|
||||||
|
])
|
||||||
|
|
||||||
const resimPreview = computed(() => {
|
const resimPreview = computed(() => {
|
||||||
if (!panelSlider.value.resimUrl) return null
|
if (!panelSlider.value.resimUrl) return null
|
||||||
|
|
||||||
@ -114,10 +138,9 @@
|
|||||||
sira: 1
|
sira: 1
|
||||||
}
|
}
|
||||||
panel.value = true
|
panel.value = true
|
||||||
|
|
||||||
}
|
}
|
||||||
const updateAction = (row: any) => {
|
const updateAction = (row: any) => {
|
||||||
panelSlider.value = sliders.value.find(x => x.id == row.id) || {}
|
panelSlider.value = sliders.value.find((x) => x.id == row.id) || {}
|
||||||
panel.value = true
|
panel.value = true
|
||||||
isUpdate.value = true
|
isUpdate.value = true
|
||||||
}
|
}
|
||||||
@ -130,8 +153,7 @@
|
|||||||
}
|
}
|
||||||
|
|
||||||
const save = async () => {
|
const save = async () => {
|
||||||
if (isUpdate.value)
|
if (isUpdate.value) {
|
||||||
{
|
|
||||||
const formData = new FormData()
|
const formData = new FormData()
|
||||||
formData.append('Baslik', panelSlider.value.baslik)
|
formData.append('Baslik', panelSlider.value.baslik)
|
||||||
formData.append('Url', panelSlider.value.url)
|
formData.append('Url', panelSlider.value.url)
|
||||||
@ -140,7 +162,7 @@
|
|||||||
formData.append('ResimUrl', panelSlider.value.resimUrl)
|
formData.append('ResimUrl', panelSlider.value.resimUrl)
|
||||||
}
|
}
|
||||||
|
|
||||||
let update:any = dataStore.dataPut('Slider/'+panelSlider.value.id,{
|
let update: any = dataStore.dataPut('Slider/' + panelSlider.value.id, {
|
||||||
data: formData,
|
data: formData,
|
||||||
headers: { 'Content-Type': 'multipart/form-data' }
|
headers: { 'Content-Type': 'multipart/form-data' }
|
||||||
})
|
})
|
||||||
@ -149,8 +171,7 @@
|
|||||||
isUpdate.value = false
|
isUpdate.value = false
|
||||||
refresh.value = true
|
refresh.value = true
|
||||||
}
|
}
|
||||||
}
|
} else {
|
||||||
else {
|
|
||||||
let add = await dataStore.dataPost('Slider/CreateSlider', {
|
let add = await dataStore.dataPost('Slider/CreateSlider', {
|
||||||
data: panelSlider.value,
|
data: panelSlider.value,
|
||||||
headers: { 'Content-Type': 'multipart/form-data' }
|
headers: { 'Content-Type': 'multipart/form-data' }
|
||||||
@ -161,7 +182,6 @@
|
|||||||
refresh.value = true
|
refresh.value = true
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
}
|
}
|
||||||
|
|
||||||
onMounted(() => {
|
onMounted(() => {
|
||||||
|
|||||||
Reference in New Issue
Block a user