Skip to content

Instantly share code, notes, and snippets.

View azmi6298's full-sized avatar
🏠
Working from home

Muhammad Azmi azmi6298

🏠
Working from home
0 followers · 2 following
View GitHub Profile
@azmi6298
azmi6298 / ModalOrder.vue
Created July 24, 2020 00:01
<template>
<div class="text-gray-900">
<modal name="modal-order" :width="600" :height="750" @before-open="beforeOpen" @opened="opened">
<div class="p-2 m-2 border-b border-gray-300 flex flex-row items-center justify-between">
<p class="text-2xl font-bold">{{ showTableName }}</p>
<label class="material-icons text-red-600 font-extrabold" @click.prevent="hideModal">close</label>
</div>
<div class="p-4 space-y-5">
<div class="flex flex-col">
<label for="table-name">Table</label>
@azmi6298
azmi6298 / OrderComponent.vue
Created July 24, 2020 00:00
<template>
<div class="flex flex-col items-center">
<div class="grid grid-cols-4 gap-40">
<a href="#" @click.prevent="showModal(order)" v-for="order in allOrders" :key="order.id">
<div class="bg-blue-500 p-16 rounded w-48 flex justify-center">
<p class="text-4xl font-bold">{{ order.table_name }}</p>
</div>
</a>
</div>
<t-button variant="success" class="mt-10 font-semibold" @click.prevent="showModal()">Add New Reservation</t-button>
@azmi6298
azmi6298 / Navbar.vue
Last active July 23, 2020 23:59
<template>
<div class="bg-blue-600 px-48 py-6 mb-16 w-full flex justify-between text-xl font-bold">
<div>
<router-link to="/">Table Reservation App</router-link>
</div>
<div>
<router-link to="/">Order Page</router-link>
</div>
</div>
</template>
@azmi6298
azmi6298 / os-x-setup-commands.sh
Created July 21, 2020 15:57 — forked from w3cj/os-x-setup-commands.sh
xcode-select --install
/usr/bin/ruby -e "$(curl -fsSL https://raw.githubusercontent.com/Homebrew/install/master/install)"
brew update
brew cask install iterm2
# update iterm2 settings -> colors, keep directory open new shell, keyboard shortcuts
brew install bash # latest version of bash
# set brew bash as default shell
brew install fortune
brew install cowsay
brew install git
@azmi6298
azmi6298 / OrderComponent.vue
Last active July 11, 2020 06:12
<script>
import { mapGetters, mapActions } from 'vuex'
import ModalOrder from './ModalOrder'
export default {
name: 'OrderComponent',
components: {
ModalOrder
},
methods: {
@azmi6298
azmi6298 / ModalOrder.vue
Last active July 7, 2020 14:31
<script>
import { mapActions } from 'vuex'
export default {
name: "ModalOrder",
data() {
return {
order : {
code: '',
table_name: '',
customer_name: '',
@azmi6298
azmi6298 / orders.js
Last active July 7, 2020 14:29
import axios from 'axios'
import Vue from 'vue'
const url = 'http://localhost:5000/api/v1/orders/'
const state = { orders: [] }
const actions = {
async getReservations({ commit }) {
const response = await axios.get(url)
@azmi6298
azmi6298 / index.js
Last active July 11, 2020 06:13
import Vuex from 'vuex'
import Vue from 'vue'
import orders from './modules/orders'
// install vuex
Vue.use(Vuex)
// create a store
export default new Vuex.Store({
modules: {
@azmi6298
azmi6298 / routes.js
Created June 28, 2020 08:42
import OrderComponent from './components/OrderComponent.vue'
export default [
{ path: '/', component: OrderComponent},
]
@azmi6298
azmi6298 / ModalOrder.vue
Last active July 7, 2020 14:31
<template>
<div>
<modal name="modal-order" @before-open="beforeOpen" @opened="opened">
<form @submit.prevent="onSubmit">
<h1>{{ showTableName }}</h1>
<div class="form-group">
<label for="table-name">Table</label>
<input type="text" v-model.lazy="order.table_name" @keydown.shift.tab.prevent="" ref="table_name">
</div>
<div class="form-group">