Compare commits

..

2 Commits

@ -1,6 +1,6 @@
{ {
"name": "slapdash", "name": "slapdash",
"version": "1.5.1", "version": "1.6.0",
"author": "Ayush Mukherjee", "author": "Ayush Mukherjee",
"description": "Dashboard for APL-Nuke cum APL-Boost data manager", "description": "Dashboard for APL-Nuke cum APL-Boost data manager",
"private": false, "private": false,

@ -7,6 +7,8 @@
<tr> <tr>
<th class="border border-gray-400 text-left px-8 py-4">ID</th> <th class="border border-gray-400 text-left px-8 py-4">ID</th>
<th class="border border-gray-400 text-left px-8 py-4">Name</th> <th class="border border-gray-400 text-left px-8 py-4">Name</th>
<th class="border border-gray-400 text-left px-8 py-4">Name Arabic</th>
<th class="border border-gray-400 text-left px-8 py-4">Name Japanese</th>
<th class="border border-gray-400 text-left px-8 py-4">Event</th> <th class="border border-gray-400 text-left px-8 py-4">Event</th>
<th class="border border-gray-400 text-left px-8 py-4">Matches</th> <th class="border border-gray-400 text-left px-8 py-4">Matches</th>
</tr> </tr>
@ -15,6 +17,8 @@
<tr class="item" v-for="e in store.state.brackets" :key="e._id" :class="item === e._id ? 'active' : ''" @click="setItem(e)"> <tr class="item" v-for="e in store.state.brackets" :key="e._id" :class="item === e._id ? 'active' : ''" @click="setItem(e)">
<td class="border border-gray-400 text-left px-8 py-4">{{ e._id }}</td> <td class="border border-gray-400 text-left px-8 py-4">{{ e._id }}</td>
<td class="border border-gray-400 text-left px-8 py-4">{{ e.name }}</td> <td class="border border-gray-400 text-left px-8 py-4">{{ e.name }}</td>
<td class="border border-gray-400 text-left px-8 py-4" dir="rtl">{{ e.name_arabic ?? '' }}</td>
<td class="border border-gray-400 text-left px-8 py-4">{{ e.name_jpn ?? '' }}</td>
<td class="border border-gray-400 text-left px-8 py-4">{{ store.state.events.filter(x => x._id === e.event)[0].name }}</td> <td class="border border-gray-400 text-left px-8 py-4">{{ store.state.events.filter(x => x._id === e.event)[0].name }}</td>
<td class="border border-gray-400 text-left"> <td class="border border-gray-400 text-left">
<table v-if="e.matches" class="border border-gray-400 border-collapse mx-auto w-full h-full"> <table v-if="e.matches" class="border border-gray-400 border-collapse mx-auto w-full h-full">
@ -30,10 +34,14 @@
</table> </table>
</div> </div>
<div> <div>
<h2 class="text-lg font-bold">Create / Update</h2> <h2 class="text-lg font-bold overflow-auto">Create / Update</h2>
<form name="form" @submit.prevent="form"> <form name="form" @submit.prevent="form">
<p class="mt-4">Bracket name</p> <p class="mt-4">Bracket name</p>
<input v-model="name" class="block my-4 border border-gray-500 rounded-lg w-64 h-8 px-4" type="text" required /> <input v-model="name" class="block my-4 border border-gray-500 rounded-lg w-64 h-8 px-4" type="text" required />
<p class="mt-4">Bracket name in arabic (optional)</p>
<input v-model="name_arabic" class="block my-4 border border-gray-500 rounded-lg w-64 h-8 px-4" type="text" dir="rtl" />
<p class="mt-4">Bracket name in japanese (optional)</p>
<input v-model="name_jpn" class="block my-4 border border-gray-500 rounded-lg w-64 h-8 px-4" type="text" />
<p class="mt-4">Event</p> <p class="mt-4">Event</p>
<select v-model="event" class="block my-4 border border-gray-500 rounded-lg bg-white w-64 h-8 px-4"> <select v-model="event" class="block my-4 border border-gray-500 rounded-lg bg-white w-64 h-8 px-4">
<option v-for="r in store.state.events" :key="r._id" :value="r._id">{{ r.name }}</option> <option v-for="r in store.state.events" :key="r._id" :value="r._id">{{ r.name }}</option>
@ -60,6 +68,8 @@ export default {
const item = ref('') const item = ref('')
const name = ref('') const name = ref('')
const name_arabic = ref('')
const name_jpn = ref('')
const event = ref('') const event = ref('')
const matches = ref([]) const matches = ref([])
@ -71,6 +81,8 @@ export default {
reset() reset()
item.value = e._id item.value = e._id
name.value = e.name name.value = e.name
name_arabic.value = e.name_arabic
name_jpn.value = e.name_jpn
event.value = e.event event.value = e.event
e.matches.forEach(m => { e.matches.forEach(m => {
if (matches.value.length !== e.matches.length) { if (matches.value.length !== e.matches.length) {
@ -82,6 +94,8 @@ export default {
const reset = () => { const reset = () => {
item.value = '' item.value = ''
name.value = '' name.value = ''
name_arabic.value = ''
name_jpn.value = ''
event.value = '' event.value = ''
matches.value = [] matches.value = []
} }
@ -90,12 +104,16 @@ export default {
if (item.value !== '') { if (item.value !== '') {
update('brackets', item.value, { update('brackets', item.value, {
name: name.value, name: name.value,
name_arabic: name_arabic.value,
name_jpn: name_jpn.value,
event: event.value, event: event.value,
matches: matches.value, matches: matches.value,
}) })
} else if (name.value !== '') { } else if (name.value !== '') {
create('brackets', { create('brackets', {
name: name.value, name: name.value,
name_arabic: name_arabic.value,
name_jpn: name_jpn.value,
event: event.value, event: event.value,
matches: matches.value, matches: matches.value,
}) })
@ -114,6 +132,8 @@ export default {
store, store,
item, item,
name, name,
name_arabic,
name_jpn,
event, event,
matches, matches,
setItem, setItem,

@ -1,24 +1,30 @@
<template> <template>
<h1 class="text-2xl font-bold uppercase mb-10">casters management</h1> <h1 class="text-2xl font-bold uppercase mb-10">casters management</h1>
<div class="grid grid-cols-2 gap-x-8"> <div class="grid grid-cols-2 gap-x-8">
<table class="table-auto"> <div class="overflow-x-auto">
<thead> <table class="table-auto">
<tr> <thead>
<th class="border border-gray-400 text-left px-8 py-4">Name Tag</th> <tr>
<th class="border border-gray-400 text-left px-8 py-4">Real Name</th> <th class="border border-gray-400 text-left px-8 py-4">Name Tag</th>
<th class="border border-gray-400 text-left px-8 py-4">Twitter</th> <th class="border border-gray-400 text-left px-8 py-4">Real Name</th>
<th class="border border-gray-400 text-left px-8 py-4">Image</th> <th class="border border-gray-400 text-left px-8 py-4">Real Name Arabic</th>
</tr> <th class="border border-gray-400 text-left px-8 py-4">Real Name Japanese</th>
</thead> <th class="border border-gray-400 text-left px-8 py-4">Twitter</th>
<tbody> <th class="border border-gray-400 text-left px-8 py-4">Image</th>
<tr class="item" :class="item === e._id ? 'active' : ''" @click="setItem(e)" v-for="e in store.state.casters" :key="e._id"> </tr>
<td class="border border-gray-400 text-left px-8 py-4">{{ e.username }}</td> </thead>
<td class="border border-gray-400 text-left px-8 py-4">{{ e.name }}</td> <tbody>
<td class="border border-gray-400 text-left px-8 py-4">{{ e.twitter }}</td> <tr class="item" :class="item === e._id ? 'active' : ''" @click="setItem(e)" v-for="e in store.state.casters" :key="e._id">
<td class="border border-gray-400 text-left px-8 py-4"><img :src="e.image" :alt="e.name"></td> <td class="border border-gray-400 text-left px-8 py-4">{{ e.username }}</td>
</tr> <td class="border border-gray-400 text-left px-8 py-4">{{ e.name }}</td>
</tbody> <td class="border border-gray-400 text-left px-8 py-4">{{ e.name_arabic ?? '' }}</td>
</table> <td class="border border-gray-400 text-left px-8 py-4">{{ e.name_jpn ?? '' }}</td>
<td class="border border-gray-400 text-left px-8 py-4">{{ e.twitter }}</td>
<td class="border border-gray-400 text-left px-8 py-4"><img :src="e.image" :alt="e.name"></td>
</tr>
</tbody>
</table>
</div>
<div> <div>
<h2 class="text-lg font-bold">Create / Update</h2> <h2 class="text-lg font-bold">Create / Update</h2>
<form name="form" @submit.prevent="form"> <form name="form" @submit.prevent="form">
@ -26,6 +32,10 @@
<input v-model="username" class="block my-4 border border-gray-500 rounded-lg w-64 h-8 px-4" type="text" required /> <input v-model="username" class="block my-4 border border-gray-500 rounded-lg w-64 h-8 px-4" type="text" required />
<p class="mt-4">Caster real name</p> <p class="mt-4">Caster real name</p>
<input v-model="name" class="block my-4 border border-gray-500 rounded-lg w-64 h-8 px-4" type="text" required /> <input v-model="name" class="block my-4 border border-gray-500 rounded-lg w-64 h-8 px-4" type="text" required />
<p class="mt-4">Caster real name arabic (optional)</p>
<input v-model="name_arabic" class="block my-4 border border-gray-500 rounded-lg w-64 h-8 px-4" type="text" />
<p class="mt-4">Caster real name japanese (optional)</p>
<input v-model="name_jpn" class="block my-4 border border-gray-500 rounded-lg w-64 h-8 px-4" type="text" />
<p class="mt-4">Caster twitter</p> <p class="mt-4">Caster twitter</p>
<input v-model="twitter" class="block my-4 border border-gray-500 rounded-lg w-64 h-8 px-4" type="text" required /> <input v-model="twitter" class="block my-4 border border-gray-500 rounded-lg w-64 h-8 px-4" type="text" required />
<p class="mt-4">Caster image URL</p> <p class="mt-4">Caster image URL</p>
@ -48,6 +58,8 @@ export default {
const item = ref('') const item = ref('')
const username = ref('') const username = ref('')
const name = ref('') const name = ref('')
const name_arabic = ref('')
const name_jpn = ref('')
const twitter = ref('') const twitter = ref('')
const image = ref('') const image = ref('')
@ -55,6 +67,8 @@ export default {
item.value = '' item.value = ''
username.value = '' username.value = ''
name.value = '' name.value = ''
name_arabic.value = ''
name_jpn.value = ''
twitter.value = '' twitter.value = ''
image.value = '' image.value = ''
} }
@ -63,6 +77,8 @@ export default {
item.value = e._id item.value = e._id
username.value = e.username username.value = e.username
name.value = e.name name.value = e.name
name_arabic.value = e.name_arabic
name_jpn.value = e.name_jpn
twitter.value = e.twitter twitter.value = e.twitter
image.value = e.image image.value = e.image
} }
@ -72,6 +88,8 @@ export default {
update('casters', item.value, { update('casters', item.value, {
username: username.value, username: username.value,
name: name.value, name: name.value,
name_arabic: name_arabic.value,
name_jpn: name_jpn.value,
twitter: twitter.value, twitter: twitter.value,
image: image.value, image: image.value,
}) })
@ -79,6 +97,8 @@ export default {
create('casters', { create('casters', {
username: username.value, username: username.value,
name: name.value, name: name.value,
name_arabic: name_arabic.value,
name_jpn: name_jpn.value,
twitter: twitter.value, twitter: twitter.value,
image: image.value, image: image.value,
}) })
@ -98,6 +118,8 @@ export default {
item, item,
username, username,
name, name,
name_arabic,
name_jpn,
twitter, twitter,
image, image,
setItem, setItem,

@ -1,25 +1,35 @@
<template> <template>
<h1 class="text-2xl font-bold uppercase mb-10">events management</h1> <h1 class="text-2xl font-bold uppercase mb-10">events management</h1>
<div class="grid grid-cols-2 gap-x-8"> <div class="grid grid-cols-2 gap-x-8">
<table class="table-auto"> <div class="overflow-x-auto">
<thead> <table class="table-auto">
<tr> <thead>
<th class="border border-gray-400 text-left px-8 py-4">ID</th> <tr>
<th class="border border-gray-400 text-left px-8 py-4">Name</th> <th class="border border-gray-400 text-left px-8 py-4">ID</th>
</tr> <th class="border border-gray-400 text-left px-8 py-4">Name</th>
</thead> <th class="border border-gray-400 text-left px-8 py-4">Arabic Name</th>
<tbody> <th class="border border-gray-400 text-left px-8 py-4">Japanese Name</th>
<tr class="item" :class="item === e._id ? 'active' : ''" @click="setItem(e)" v-for="e in store.state.events" :key="e._id"> </tr>
<td class="border border-gray-400 text-left px-8 py-4">{{ e._id }}</td> </thead>
<td class="border border-gray-400 text-left px-8 py-4">{{ e.name }}</td> <tbody>
</tr> <tr class="item" :class="item === e._id ? 'active' : ''" @click="setItem(e)" v-for="e in store.state.events" :key="e._id">
</tbody> <td class="border border-gray-400 text-left px-8 py-4">{{ e._id }}</td>
</table> <td class="border border-gray-400 text-left px-8 py-4">{{ e.name }}</td>
<td class="border border-gray-400 text-left px-8 py-4 rtl" dir="rtl">{{ e.name_arabic ?? '' }}</td>
<td class="border border-gray-400 text-left px-8 py-4">{{ e.name_jpn ?? '' }}</td>
</tr>
</tbody>
</table>
</div>
<div> <div>
<h2 class="text-lg font-bold">Create / Update</h2> <h2 class="text-lg font-bold">Create / Update</h2>
<form name="form" @submit.prevent="form"> <form name="form" @submit.prevent="form">
<p class="mt-4">Event name</p> <p class="mt-4">Event name</p>
<input v-model="name" class="block my-4 border border-gray-500 rounded-lg w-64 h-8 px-4" type="text" required /> <input v-model="name" class="block my-4 border border-gray-500 rounded-lg w-64 h-8 px-4" type="text" required />
<p class="mt-4">Event name in arabic (optional)</p>
<input v-model="name_arabic" class="block my-4 border border-gray-500 rounded-lg w-64 h-8 px-4" type="text" dir="rtl" />
<p class="mt-4">Event name in japanese (optional)</p>
<input v-model="name_jpn" class="block my-4 border border-gray-500 rounded-lg w-64 h-8 px-4" type="text" />
<button class="block w-64 h-10 text-white bg-red-700 rounded-lg hover:bg-red-600">Submit</button> <button class="block w-64 h-10 text-white bg-red-700 rounded-lg hover:bg-red-600">Submit</button>
<button @click.prevent="delForm" v-if="item" class="block mt-4 w-64 h-10 text-white bg-red-700 rounded-lg hover:bg-red-600">Delete</button> <button @click.prevent="delForm" v-if="item" class="block mt-4 w-64 h-10 text-white bg-red-700 rounded-lg hover:bg-red-600">Delete</button>
</form> </form>
@ -37,10 +47,14 @@ export default {
const item = ref('') const item = ref('')
const name = ref('') const name = ref('')
const name_arabic = ref('')
const name_jpn = ref('')
const setItem = (e) => { const setItem = (e) => {
item.value = e._id item.value = e._id
name.value = e.name name.value = e.name
name_arabic.value = e.name_arabic
name_jpn.value = e.name_jpn
} }
const reset = () => { const reset = () => {
@ -52,10 +66,14 @@ export default {
if (item.value !== '') { if (item.value !== '') {
update('events', item.value, { update('events', item.value, {
name: name.value, name: name.value,
name_arabic: name_arabic.value,
name_jpn: name_jpn.value,
}) })
} else if (name.value !== '') { } else if (name.value !== '' && name_arabic.value !== '' && name_jpn.value !== '') {
create('events', { create('events', {
name: name.value, name: name.value,
name_arabic: name_arabic.value,
name_jpn: name_jpn.value,
}) })
} }
reset() reset()
@ -72,6 +90,8 @@ export default {
store, store,
item, item,
name, name,
name_arabic,
name_jpn,
setItem, setItem,
form, form,
delForm, delForm,

@ -6,6 +6,8 @@
<thead> <thead>
<tr> <tr>
<th class="border border-gray-400 text-left px-8 py-4">Round name</th> <th class="border border-gray-400 text-left px-8 py-4">Round name</th>
<th class="border border-gray-400 text-left px-8 py-4">Round arabic</th>
<th class="border border-gray-400 text-left px-8 py-4">Round japanese</th>
<th class="border border-gray-400 text-left px-8 py-4">Blue</th> <th class="border border-gray-400 text-left px-8 py-4">Blue</th>
<th class="border border-gray-400 text-left px-8 py-4">Orange</th> <th class="border border-gray-400 text-left px-8 py-4">Orange</th>
<th class="border border-gray-400 text-left px-8 py-4">Current</th> <th class="border border-gray-400 text-left px-8 py-4">Current</th>
@ -20,6 +22,8 @@
<tbody> <tbody>
<tr class="item" :class="item === e._id ? 'active' : ''" @click="setItem(e)" v-for="e in store.state.matches" :key="e._id"> <tr class="item" :class="item === e._id ? 'active' : ''" @click="setItem(e)" v-for="e in store.state.matches" :key="e._id">
<td class="border border-gray-400 text-left px-8 py-4">{{ e.type }}</td> <td class="border border-gray-400 text-left px-8 py-4">{{ e.type }}</td>
<td class="border border-gray-400 text-left px-8 py-4" dir="rtl">{{ e.type_arabic ?? '' }}</td>
<td class="border border-gray-400 text-left px-8 py-4">{{ e.type_jpn ?? '' }}</td>
<td class="border border-gray-400 text-left px-8 py-4">{{ e.blue.name }}</td> <td class="border border-gray-400 text-left px-8 py-4">{{ e.blue.name }}</td>
<td class="border border-gray-400 text-left px-8 py-4">{{ e.orange.name }}</td> <td class="border border-gray-400 text-left px-8 py-4">{{ e.orange.name }}</td>
<td class="border border-gray-400 text-left px-8 py-4">{{ e.current }}</td> <td class="border border-gray-400 text-left px-8 py-4">{{ e.current }}</td>
@ -47,6 +51,10 @@
<form name="form" @submit.prevent="form"> <form name="form" @submit.prevent="form">
<p class="mt-4">Round name</p> <p class="mt-4">Round name</p>
<input v-model="type" class="block my-4 border border-gray-500 rounded-lg w-64 h-8 px-4" type="text" required /> <input v-model="type" class="block my-4 border border-gray-500 rounded-lg w-64 h-8 px-4" type="text" required />
<p class="mt-4">Round name in arabic (optional)</p>
<input v-model="type_arabic" class="block my-4 border border-gray-500 rounded-lg w-64 h-8 px-4" type="text" dir="rtl" />
<p class="mt-4">Round name in japanese (optional)</p>
<input v-model="type_jpn" class="block my-4 border border-gray-500 rounded-lg w-64 h-8 px-4" type="text" />
<p class="mt-4">Blue team</p> <p class="mt-4">Blue team</p>
<select v-model="blue" class="block my-4 border border-gray-500 rounded-lg bg-white w-64 h-8 px-4"> <select v-model="blue" class="block my-4 border border-gray-500 rounded-lg bg-white w-64 h-8 px-4">
<option v-for="r in store.state.rosters" :key="r._id" :value="r._id">{{ r.name }}</option> <option v-for="r in store.state.rosters" :key="r._id" :value="r._id">{{ r.name }}</option>
@ -96,6 +104,8 @@ export default {
const item = ref('') const item = ref('')
const type = ref('') const type = ref('')
const type_arabic = ref('')
const type_jpn = ref('')
const blue = ref('') const blue = ref('')
const orange = ref('') const orange = ref('')
const current = ref(false) const current = ref(false)
@ -111,6 +121,8 @@ export default {
const setItem = (e) => { const setItem = (e) => {
item.value = e._id item.value = e._id
type.value = e.type type.value = e.type
type_arabic.value = e.type_arabic
type_jpn.value = e.type_jpn
blue.value = e.blue._id blue.value = e.blue._id
orange.value = e.orange orange.value = e.orange
current.value = e.current current.value = e.current
@ -127,6 +139,8 @@ export default {
const resetf = () => { const resetf = () => {
item.value = '' item.value = ''
type.value = '' type.value = ''
type_arabic.value = ''
type_jpn.value = ''
blue.value = '' blue.value = ''
orange.value = '' orange.value = ''
current.value = false current.value = false
@ -144,6 +158,8 @@ export default {
if (item.value !== '') { if (item.value !== '') {
update('matches', item.value, { update('matches', item.value, {
type: type.value, type: type.value,
type_arabic: type_arabic.value,
type_jpn: type_jpn.value,
blue: blue.value, blue: blue.value,
orange: orange.value, orange: orange.value,
current: current.value, current: current.value,
@ -163,6 +179,8 @@ export default {
} else if (type.value !== '') { } else if (type.value !== '') {
create('matches', { create('matches', {
type: type.value, type: type.value,
type_arabic: type_arabic.value,
type_jpn: type_jpn.value,
blue: blue.value, blue: blue.value,
orange: orange.value, orange: orange.value,
current: current.value, current: current.value,
@ -185,6 +203,8 @@ export default {
store, store,
item, item,
type, type,
type_arabic,
type_jpn,
blue, blue,
orange, orange,
blueSeries, blueSeries,

@ -1,35 +1,45 @@
<template> <template>
<h1 class="text-2xl font-bold uppercase mb-10">rosters management</h1> <h1 class="text-2xl font-bold uppercase mb-10">rosters management</h1>
<div class="grid grid-cols-2 gap-x-8"> <div class="grid grid-cols-2 gap-x-8">
<table class="table-auto"> <div class="overflow-x-auto">
<thead> <table class="table-auto">
<tr> <thead>
<th class="border border-gray-400 text-left px-8 py-4">Name</th> <tr>
<th class="border border-gray-400 text-left px-8 py-4">Logo</th> <th class="border border-gray-400 text-left px-8 py-4">Name</th>
<th class="border border-gray-400 text-left px-8 py-4">Players</th> <th class="border border-gray-400 text-left px-8 py-4">Name Arabic</th>
</tr> <th class="border border-gray-400 text-left px-8 py-4">Name Japanese</th>
</thead> <th class="border border-gray-400 text-left px-8 py-4">Logo</th>
<tbody> <th class="border border-gray-400 text-left px-8 py-4">Players</th>
<tr class="item" :class="item === e._id ? 'active' : ''" @click="setItem(e)" v-for="e in store.state.rosters" :key="e._id"> </tr>
<td class="border border-gray-400 text-left px-8 py-4">{{ e.name }}</td> </thead>
<td class="border border-gray-400 text-left px-8 py-4"><img class="w-12 h-12" :src="e.logo" :alt="e.name"></td> <tbody>
<td class="border border-gray-400 text-left px-8 py-4"> <tr class="item" :class="item === e._id ? 'active' : ''" @click="setItem(e)" v-for="e in store.state.rosters" :key="e._id">
<table v-if="e.players"> <td class="border border-gray-400 text-left px-8 py-4">{{ e.name }}</td>
<tbody> <td class="border border-gray-400 text-left px-8 py-4" dir="rtl">{{ e.name_arabic ?? '' }}</td>
<tr v-for="p in e.players" :key="p._id"> <td class="border border-gray-400 text-left px-8 py-4">{{ e.name_jpn ?? '' }}</td>
<td>{{ p.name }}: {{ p.account }}</td> <td class="border border-gray-400 text-left px-8 py-4"><img class="w-12 h-12" :src="e.logo" :alt="e.name"></td>
</tr> <td class="border border-gray-400 text-left px-8 py-4">
</tbody> <table v-if="e.players">
</table> <tbody>
</td> <tr v-for="p in e.players" :key="p._id">
</tr> <td>{{ p.name }}: {{ p.account }}</td>
</tbody> </tr>
</table> </tbody>
</table>
</td>
</tr>
</tbody>
</table>
</div>
<div> <div>
<h2 class="text-lg font-bold">Create / Update</h2> <h2 class="text-lg font-bold">Create / Update</h2>
<form name="form" @submit.prevent="form"> <form name="form" @submit.prevent="form">
<p class="mt-4">Roster name</p> <p class="mt-4">Roster name</p>
<input v-model="name" class="block my-4 border border-gray-500 rounded-lg w-64 h-8 px-4" type="text" required /> <input v-model="name" class="block my-4 border border-gray-500 rounded-lg w-64 h-8 px-4" type="text" required />
<p class="mt-4">Roster name in arabic (optional)</p>
<input v-model="name_arabic" class="block my-4 border border-gray-500 rounded-lg w-64 h-8 px-4" type="text" dir="rtl" />
<p class="mt-4">Roster name in japanese (optional)</p>
<input v-model="name_jpn" class="block my-4 border border-gray-500 rounded-lg w-64 h-8 px-4" type="text" />
<p class="mt-4">Roster logo</p> <p class="mt-4">Roster logo</p>
<input v-model="logo" class="block my-4 border border-gray-500 rounded-lg w-64 h-8 px-4" type="text" required /> <input v-model="logo" class="block my-4 border border-gray-500 rounded-lg w-64 h-8 px-4" type="text" required />
<fieldset v-for="(n, i) in playersLocal.length" :key="i" class="border border-gray-400 rounded px-6 my-4"> <fieldset v-for="(n, i) in playersLocal.length" :key="i" class="border border-gray-400 rounded px-6 my-4">
@ -57,6 +67,8 @@ export default {
const item = ref('') const item = ref('')
const name = ref('') const name = ref('')
const name_arabic = ref('')
const name_jpn = ref('')
const logo = ref('') const logo = ref('')
const playersLocal = ref([]) const playersLocal = ref([])
@ -65,6 +77,8 @@ export default {
const setItem = (e) => { const setItem = (e) => {
item.value = e._id item.value = e._id
name.value = e.name name.value = e.name
name_arabic.value = e.name_arabic
name_jpn.value = e.name_jpn
logo.value = e.logo logo.value = e.logo
e.players.forEach(p => { e.players.forEach(p => {
if (playersLocal.value.length !== e.players.length) { if (playersLocal.value.length !== e.players.length) {
@ -91,6 +105,8 @@ export default {
const reset = () => { const reset = () => {
item.value = '' item.value = ''
name.value = '' name.value = ''
name_arabic.value = ''
name_jpn.value = ''
logo.value = '' logo.value = ''
playersLocal.value = [] playersLocal.value = []
} }
@ -99,12 +115,16 @@ export default {
if (item.value !== '') { if (item.value !== '') {
update('rosters', item.value, { update('rosters', item.value, {
name: name.value, name: name.value,
name_arabic: name_arabic.value,
name_jpn: name_jpn.value,
logo: logo.value, logo: logo.value,
players: playersLocal.value, players: playersLocal.value,
}) })
} else if (name.value !== '') { } else if (name.value !== '') {
create('rosters', { create('rosters', {
name: name.value, name: name.value,
name_arabic: name_arabic.value,
name_jpn: name_jpn.value,
logo: logo.value, logo: logo.value,
players: playersLocal.value, players: playersLocal.value,
}) })
@ -123,6 +143,8 @@ export default {
store, store,
item, item,
name, name,
name_arabic,
name_jpn,
logo, logo,
playersLocal, playersLocal,
setItem, setItem,

@ -7,6 +7,8 @@
<tr> <tr>
<th class="border border-gray-400 text-left px-8 py-4">ID</th> <th class="border border-gray-400 text-left px-8 py-4">ID</th>
<th class="border border-gray-400 text-left px-8 py-4">Name</th> <th class="border border-gray-400 text-left px-8 py-4">Name</th>
<th class="border border-gray-400 text-left px-8 py-4">Arabic Name</th>
<th class="border border-gray-400 text-left px-8 py-4">Japanese Name</th>
<th class="border border-gray-400 text-left px-8 py-4">Event</th> <th class="border border-gray-400 text-left px-8 py-4">Event</th>
<th class="border border-gray-400 text-left px-8 py-4">Matches</th> <th class="border border-gray-400 text-left px-8 py-4">Matches</th>
<th class="border border-gray-400 text-left px-8 py-4">Casters</th> <th class="border border-gray-400 text-left px-8 py-4">Casters</th>
@ -17,6 +19,8 @@
<tr class="item" v-for="e in store.state.streams" :key="e._id" :class="item === e._id ? 'active' : ''" @click="setItem(e)"> <tr class="item" v-for="e in store.state.streams" :key="e._id" :class="item === e._id ? 'active' : ''" @click="setItem(e)">
<td class="border border-gray-400 text-left px-8 py-4">{{ e._id }}</td> <td class="border border-gray-400 text-left px-8 py-4">{{ e._id }}</td>
<td class="border border-gray-400 text-left px-8 py-4">{{ e.name }}</td> <td class="border border-gray-400 text-left px-8 py-4">{{ e.name }}</td>
<td class="border border-gray-400 text-left px-8 py-4">{{ e.name_arabic ?? '' }}</td>
<td class="border border-gray-400 text-left px-8 py-4">{{ e.name_jpn ?? '' }}</td>
<td class="border border-gray-400 text-left px-8 py-4">{{ store.state.events.filter(x => x._id === e.event)[0].name }}</td> <td class="border border-gray-400 text-left px-8 py-4">{{ store.state.events.filter(x => x._id === e.event)[0].name }}</td>
<td class="border border-gray-400 text-left"> <td class="border border-gray-400 text-left">
<table v-if="e.matches" class="border border-gray-400 border-collapse mx-auto w-full h-full"> <table v-if="e.matches" class="border border-gray-400 border-collapse mx-auto w-full h-full">
@ -54,6 +58,10 @@
<form name="form" @submit.prevent="form"> <form name="form" @submit.prevent="form">
<p class="mt-4">Stream name</p> <p class="mt-4">Stream name</p>
<input v-model="name" class="block my-4 border border-gray-500 rounded-lg w-64 h-8 px-4" type="text" required /> <input v-model="name" class="block my-4 border border-gray-500 rounded-lg w-64 h-8 px-4" type="text" required />
<p class="mt-4">Stream name in arabic (optional)</p>
<input v-model="name_arabic" class="block my-4 border border-gray-500 rounded-lg w-64 h-8 px-4" type="text" dir="rtl" />
<p class="mt-4">Stream name in japanese (optional)</p>
<input v-model="name_jpn" class="block my-4 border border-gray-500 rounded-lg w-64 h-8 px-4" type="text" />
<p class="mt-4">Event</p> <p class="mt-4">Event</p>
<select v-model="event" class="block my-4 border border-gray-500 rounded-lg bg-white w-64 h-8 px-4"> <select v-model="event" class="block my-4 border border-gray-500 rounded-lg bg-white w-64 h-8 px-4">
<option v-for="r in store.state.events" :key="r._id" :value="r._id">{{ r.name }}</option> <option v-for="r in store.state.events" :key="r._id" :value="r._id">{{ r.name }}</option>
@ -90,6 +98,8 @@ export default {
const item = ref('') const item = ref('')
const name = ref('') const name = ref('')
const name_arabic = ref('')
const name_jpn = ref('')
const event = ref('') const event = ref('')
const matches = ref([]) const matches = ref([])
const casters = ref([]) const casters = ref([])
@ -111,6 +121,8 @@ export default {
reset() reset()
item.value = e._id item.value = e._id
name.value = e.name name.value = e.name
name_arabic.value = e.name_arabic
name_jpn.value = e.name_jpn
event.value = e.event event.value = e.event
e.matches.forEach(m => { e.matches.forEach(m => {
if (matches.value.length !== e.matches.length) { if (matches.value.length !== e.matches.length) {
@ -132,6 +144,8 @@ export default {
const reset = () => { const reset = () => {
item.value = '' item.value = ''
name.value = '' name.value = ''
name_arabic.value = ''
name_jpn.value = ''
event.value = '' event.value = ''
matches.value = [] matches.value = []
casters.value = [] casters.value = []
@ -142,6 +156,8 @@ export default {
if (item.value !== '') { if (item.value !== '') {
update('streams', item.value, { update('streams', item.value, {
name: name.value, name: name.value,
name_arabic: name_arabic.value,
name_jpn: name_jpn.value,
event: event.value, event: event.value,
matches: matches.value, matches: matches.value,
casters: casters.value, casters: casters.value,
@ -150,6 +166,8 @@ export default {
} else if (name.value !== '') { } else if (name.value !== '') {
create('streams', { create('streams', {
name: name.value, name: name.value,
name_arabic: name_arabic.value,
name_jpn: name_jpn.value,
event: event.value, event: event.value,
matches: matches.value, matches: matches.value,
casters: casters.value, casters: casters.value,
@ -170,6 +188,8 @@ export default {
store, store,
item, item,
name, name,
name_arabic,
name_jpn,
event, event,
matches, matches,
casters, casters,

Loading…
Cancel
Save