[update]
This commit is contained in:
timotiabbauftech
parent
26e1ee751e
commit
982f99ed7b
@ -26,7 +26,7 @@ class UserController extends Controller
|
||||
|
||||
User::create([
|
||||
'nama' => $request->nama,
|
||||
'password' => bcrypt($request->password),
|
||||
'password' => $request->password,
|
||||
'role' => $request->role,
|
||||
]);
|
||||
|
||||
|
||||
@ -1,44 +1,39 @@
|
||||
<template>
|
||||
<div class="fixed inset-0 flex items-center justify-center bg-black bg-opacity-50 z-50">
|
||||
<div
|
||||
class="fixed inset-0 flex items-center justify-center bg-black/65 z-50"
|
||||
>
|
||||
<div class="bg-white rounded-lg p-6 w-96 shadow-lg">
|
||||
<h2 class="text-lg font-bold mb-4">Tambah Akun</h2>
|
||||
|
||||
<form @submit.prevent="createAkun">
|
||||
<form @submit.prevent="createAkun" class="space-y-3">
|
||||
<!-- Nama -->
|
||||
<div class="mb-3">
|
||||
<label class="block font-medium mb-1">Nama</label>
|
||||
<input
|
||||
v-model.trim="form.nama"
|
||||
<label for="nama">Nama</label>
|
||||
<InputField
|
||||
v-model="form.nama"
|
||||
id="nama"
|
||||
type="text"
|
||||
class="border rounded w-full p-2 focus:ring focus:ring-blue-300"
|
||||
required
|
||||
:required="true"
|
||||
/>
|
||||
</div>
|
||||
|
||||
<!-- Password -->
|
||||
<div class="mb-3">
|
||||
<label class="block font-medium mb-1">Password</label>
|
||||
<input
|
||||
<div>
|
||||
<label for="password">Password</label>
|
||||
<InputField
|
||||
v-model="form.password"
|
||||
id="password"
|
||||
type="password"
|
||||
class="border rounded w-full p-2 focus:ring focus:ring-blue-300"
|
||||
required
|
||||
:required="true"
|
||||
/>
|
||||
</div>
|
||||
|
||||
<!-- Peran -->
|
||||
<div class="mb-3">
|
||||
<label class="block font-medium mb-1">Peran</label>
|
||||
<select
|
||||
<label for="peran">Peran</label>
|
||||
<InputSelect
|
||||
v-model="form.role"
|
||||
class="border rounded w-full p-2 focus:ring focus:ring-blue-300"
|
||||
required
|
||||
>
|
||||
<option disabled value="">-- Pilih Peran --</option>
|
||||
<option value="owner">Owner</option>
|
||||
<option value="kasir">Kasir</option>
|
||||
</select>
|
||||
</div>
|
||||
:options="[
|
||||
{ value: 'owner', label: 'Owner' },
|
||||
{ value: 'kasir', label: 'Kasir' },
|
||||
]"
|
||||
placeholder="-- Pilih Peran --"
|
||||
/>
|
||||
|
||||
<!-- Tombol -->
|
||||
<div class="flex justify-end gap-2 mt-4">
|
||||
@ -68,16 +63,15 @@
|
||||
|
||||
<script>
|
||||
import axios from "axios";
|
||||
import InputField from "@/components/InputField.vue";
|
||||
import InputSelect from "@/components/InputSelect.vue";
|
||||
|
||||
export default {
|
||||
name: "CreateAkun",
|
||||
components: { InputField, InputSelect },
|
||||
data() {
|
||||
return {
|
||||
form: {
|
||||
nama: "",
|
||||
password: "",
|
||||
role: "",
|
||||
},
|
||||
form: { nama: "", password: "", role: "" },
|
||||
errorMessage: "",
|
||||
};
|
||||
},
|
||||
@ -85,11 +79,7 @@
|
||||
async createAkun() {
|
||||
try {
|
||||
await axios.post("api/user", this.form);
|
||||
|
||||
// reset form
|
||||
this.form = { nama: "", password: "", role: "" };
|
||||
|
||||
// tutup modal dan refresh data
|
||||
this.$emit("refresh");
|
||||
this.$emit("close");
|
||||
} catch (err) {
|
||||
|
||||
@ -11,18 +11,17 @@
|
||||
</div>
|
||||
|
||||
<!-- Form -->
|
||||
<div class="mb-4">
|
||||
<div>
|
||||
<label class="block text-sm font-medium text-gray-700">Nama Kategori</label>
|
||||
<input
|
||||
<InputField
|
||||
v-model="form.nama"
|
||||
type="text"
|
||||
placeholder="Masukkan nama kategori"
|
||||
class="mt-1 block w-full border border-gray-300 rounded-md px-3 py-2 focus:ring focus:ring-C"
|
||||
/>
|
||||
</div>
|
||||
|
||||
<!-- Buttons -->
|
||||
<div class="flex justify-end gap-2">
|
||||
<div class="flex justify-end gap-2 mt-4">
|
||||
<button
|
||||
@click="emit('close')"
|
||||
class="px-4 py-2 bg-gray-200 text-gray-700 rounded hover:bg-gray-300"
|
||||
@ -44,6 +43,7 @@
|
||||
<script setup>
|
||||
import { ref, watch } from 'vue'
|
||||
import axios from 'axios'
|
||||
import InputField from './InputField.vue'
|
||||
|
||||
const props = defineProps({
|
||||
isOpen: Boolean,
|
||||
|
||||
@ -7,24 +7,41 @@
|
||||
<h2 class="text-xl font-bold mb-4">Tambah Sales</h2>
|
||||
|
||||
<form @submit.prevent="handleSubmit" class="space-y-4">
|
||||
<!-- Nama -->
|
||||
<div>
|
||||
<label class="block text-sm font-medium text-gray-700">Nama Sales</label>
|
||||
<input v-model="form.nama" type="text" class="w-full px-3 py-2 border rounded-md focus:ring-2 focus:ring-[#c6a77d] focus:outline-none" required />
|
||||
<InputField v-model="form.nama" type="text" placeholder="Masukkan nama sales" required />
|
||||
</div>
|
||||
|
||||
<div>
|
||||
<label class="block text-sm font-medium text-gray-700">No HP</label>
|
||||
<input v-model="form.no_hp" type="text" class="w-full px-3 py-2 border rounded-md focus:ring-2 focus:ring-[#c6a77d] focus:outline-none" required />
|
||||
<InputField v-model="form.no_hp" type="text" placeholder="Masukkan nomor HP" required />
|
||||
</div>
|
||||
|
||||
<div>
|
||||
<label class="block text-sm font-medium text-gray-700">Alamat</label>
|
||||
<textarea v-model="form.alamat" class="w-full px-3 py-2 border rounded-md focus:ring-2 focus:ring-[#c6a77d] focus:outline-none" required></textarea>
|
||||
<textarea
|
||||
v-model="form.alamat"
|
||||
placeholder="Masukkan alamat"
|
||||
class="mt-1 block w-full rounded-md shadow-sm sm:text-sm bg-A text-D border-B focus:border-C focus:ring focus:ring-D focus:ring-opacity-50 p-2"
|
||||
required
|
||||
></textarea>
|
||||
</div>
|
||||
|
||||
<div class="flex justify-end gap-2 mt-6">
|
||||
<button type="button" @click="$emit('close')" class="px-4 py-2 bg-gray-300 rounded hover:bg-gray-400">Batal</button>
|
||||
<button type="submit" class="px-4 py-2 bg-C text-D rounded hover:bg-C/80">Simpan</button>
|
||||
<button
|
||||
type="button"
|
||||
@click="$emit('close')"
|
||||
class="px-4 py-2 bg-gray-300 rounded hover:bg-gray-400"
|
||||
>
|
||||
Batal
|
||||
</button>
|
||||
<button
|
||||
type="submit"
|
||||
class="px-4 py-2 bg-C text-D rounded hover:bg-C/80"
|
||||
>
|
||||
Simpan
|
||||
</button>
|
||||
</div>
|
||||
</form>
|
||||
</div>
|
||||
@ -32,27 +49,34 @@
|
||||
</template>
|
||||
|
||||
<script setup>
|
||||
import { ref } from "vue";
|
||||
import axios from "axios";
|
||||
import { ref } from "vue"
|
||||
import axios from "axios"
|
||||
import InputField from "./InputField.vue"
|
||||
|
||||
const props = defineProps({
|
||||
isOpen: Boolean,
|
||||
});
|
||||
})
|
||||
|
||||
const emit = defineEmits(["close"]);
|
||||
const emit = defineEmits(["close", "saved"])
|
||||
|
||||
const form = ref({
|
||||
nama: "",
|
||||
no_hp: "",
|
||||
alamat: "",
|
||||
});
|
||||
})
|
||||
|
||||
const resetForm = () => {
|
||||
form.value = { nama: "", no_hp: "", alamat: "" }
|
||||
}
|
||||
|
||||
const handleSubmit = async () => {
|
||||
try {
|
||||
await axios.post("/api/sales", form.value);
|
||||
emit("close");
|
||||
await axios.post("/api/sales", form.value)
|
||||
resetForm()
|
||||
emit("saved")
|
||||
emit("close")
|
||||
} catch (error) {
|
||||
console.error("Error creating sales:", error);
|
||||
console.error("Error creating sales:", error)
|
||||
}
|
||||
}
|
||||
};
|
||||
</script>
|
||||
|
||||
@ -1,38 +1,54 @@
|
||||
<template>
|
||||
<div class="fixed inset-0 flex items-center justify-center bg-black bg-opacity-50">
|
||||
<div class="fixed inset-0 flex items-center justify-center bg-black/65">
|
||||
<div class="bg-white rounded-lg p-6 w-96">
|
||||
<h2 class="text-lg font-bold mb-4">Edit Akun</h2>
|
||||
|
||||
<form @submit.prevent="updateAkun">
|
||||
<!-- Nama -->
|
||||
<div class="mb-3">
|
||||
<label class="block font-medium">Nama</label>
|
||||
<input v-model="form.nama" type="text" class="border rounded w-full p-2" required />
|
||||
<form @submit.prevent="updateAkun" class="space-y-3">
|
||||
<label for="nama">Nama</label>
|
||||
<InputField
|
||||
v-model="form.nama"
|
||||
label="nama"
|
||||
type="text"
|
||||
:required="true"
|
||||
class="mb-3"
|
||||
/>
|
||||
|
||||
<div>
|
||||
<label for="password">Password</label>
|
||||
<InputField
|
||||
v-model="form.password"
|
||||
label="password"
|
||||
type="password"
|
||||
:required="false"
|
||||
class="mb-1"
|
||||
/>
|
||||
<p class="text-sm">Kosongkan jika tidak ingin ubah password</p>
|
||||
</div>
|
||||
|
||||
<!-- Password -->
|
||||
<div class="mb-3">
|
||||
<label class="block font-medium">Password</label>
|
||||
<input v-model="form.password" type="password" class="border rounded w-full p-2" />
|
||||
<small class="text-gray-500">Kosongkan jika tidak ingin mengubah password</small>
|
||||
</div>
|
||||
<label for="peran">Peran</label>
|
||||
<InputSelect
|
||||
v-model="form.role"
|
||||
label="peran"
|
||||
:options="[
|
||||
{ value: 'owner', label: 'Owner' },
|
||||
{ value: 'kasir', label: 'Kasir' }
|
||||
]"
|
||||
:required="true"
|
||||
class="mb-3"
|
||||
/>
|
||||
|
||||
<!-- Peran -->
|
||||
<div class="mb-3">
|
||||
<label class="block font-medium">Peran</label>
|
||||
<select v-model="form.role" class="border rounded w-full p-2" required>
|
||||
<option value="">-- Pilih Peran --</option>
|
||||
<option value="owner">Owner</option>
|
||||
<option value="kasir">Kasir</option>
|
||||
</select>
|
||||
</div>
|
||||
|
||||
<!-- Tombol -->
|
||||
<div class="flex justify-end gap-2 mt-4">
|
||||
<button type="button" @click="$emit('close')" class="bg-gray-300 px-4 py-2 rounded">
|
||||
<button
|
||||
type="button"
|
||||
@click="$emit('close')"
|
||||
class="bg-gray-300 px-4 py-2 rounded"
|
||||
>
|
||||
Batal
|
||||
</button>
|
||||
<button type="submit" class="bg-blue-500 text-white px-4 py-2 rounded">
|
||||
<button
|
||||
type="submit"
|
||||
class="bg-blue-500 text-white px-4 py-2 rounded"
|
||||
>
|
||||
Ubah
|
||||
</button>
|
||||
</div>
|
||||
@ -43,6 +59,8 @@
|
||||
|
||||
<script>
|
||||
import axios from "axios";
|
||||
import InputField from "@/components/InputField.vue";
|
||||
import InputSelect from "@/components/InputSelect.vue";
|
||||
|
||||
export default {
|
||||
props: {
|
||||
@ -51,12 +69,14 @@
|
||||
required: true,
|
||||
},
|
||||
},
|
||||
components: { InputField, InputSelect },
|
||||
|
||||
data() {
|
||||
return {
|
||||
form: {
|
||||
nama: this.akun.nama || "",
|
||||
password: "",
|
||||
role: this.akun.role || "", // gunakan "role" bukan "peran"
|
||||
role: this.akun.role || "",
|
||||
},
|
||||
};
|
||||
},
|
||||
@ -87,7 +107,6 @@
|
||||
this.$emit("close");
|
||||
} catch (err) {
|
||||
console.error("Gagal update akun:", err.response?.data || err.message);
|
||||
alert("Update akun gagal. Silakan cek kembali inputan.");
|
||||
}
|
||||
},
|
||||
},
|
||||
|
||||
@ -11,14 +11,13 @@
|
||||
<h2 class="text-xl font-bold text-center text-D mb-4">Edit Kategori</h2>
|
||||
|
||||
<!-- Input Nama Kategori -->
|
||||
<div class="mb-4">
|
||||
<div>
|
||||
<label for="editKategori" class="block text-sm font-medium text-D mb-1">Nama Kategori</label>
|
||||
<input
|
||||
<InputField
|
||||
v-model="editNamaKategori"
|
||||
type="text"
|
||||
id="editKategori"
|
||||
placeholder="Masukkan nama kategori"
|
||||
class="w-full p-2 border rounded-md bg-Focus outline-none"
|
||||
/>
|
||||
</div>
|
||||
|
||||
@ -37,6 +36,7 @@
|
||||
|
||||
<script setup>
|
||||
import { ref, watch } from "vue";
|
||||
import InputField from "./InputField.vue";
|
||||
|
||||
const props = defineProps({
|
||||
kategori: { type: Object, required: true },
|
||||
|
||||
@ -9,17 +9,21 @@
|
||||
<form @submit.prevent="handleSubmit" class="space-y-4">
|
||||
<div>
|
||||
<label class="block text-sm font-medium text-gray-700">Nama Sales</label>
|
||||
<input v-model="form.nama" type="text" class="w-full px-3 py-2 border rounded-md focus:ring-2 focus:ring-[#c6a77d] focus:outline-none" required />
|
||||
<InputField v-model="form.nama" type="text" class="w-full px-3 py-2 border rounded-md focus:ring-2 focus:ring-[#c6a77d] focus:outline-none" required />
|
||||
</div>
|
||||
|
||||
<div>
|
||||
<label class="block text-sm font-medium text-gray-700">No HP</label>
|
||||
<input v-model="form.no_hp" type="text" class="w-full px-3 py-2 border rounded-md focus:ring-2 focus:ring-[#c6a77d] focus:outline-none" required />
|
||||
<InputField v-model="form.no_hp" type="text" class="w-full px-3 py-2 border rounded-md focus:ring-2 focus:ring-[#c6a77d] focus:outline-none" required />
|
||||
</div>
|
||||
|
||||
<div>
|
||||
<label class="block text-sm font-medium text-gray-700">Alamat</label>
|
||||
<textarea v-model="form.alamat" class="w-full px-3 py-2 border rounded-md focus:ring-2 focus:ring-[#c6a77d] focus:outline-none" required></textarea>
|
||||
<textarea
|
||||
v-model="form.alamat"
|
||||
class="mt-1 block w-full rounded-md shadow-sm sm:text-sm bg-A text-D border-B focus:border-C focus:ring focus:ring-D focus:ring-opacity-50 p-2"
|
||||
required
|
||||
></textarea>
|
||||
</div>
|
||||
|
||||
<div class="flex justify-end gap-2 mt-6">
|
||||
@ -34,6 +38,7 @@
|
||||
<script setup>
|
||||
import { ref, watch } from "vue";
|
||||
import axios from "axios";
|
||||
import InputField from "./InputField.vue";
|
||||
|
||||
const props = defineProps({
|
||||
isOpen: Boolean,
|
||||
|
||||
@ -51,14 +51,14 @@
|
||||
|
||||
<!-- Table Section -->
|
||||
<div
|
||||
class="bg-white rounded-lg shadow-md border border-gray-200 overflow-hidden"
|
||||
class="bg-white rounded-lg shadow-md border border-C overflow-hidden"
|
||||
>
|
||||
<table class="w-full">
|
||||
<thead>
|
||||
<tr class="bg-C text-white">
|
||||
<th class="px-6 py-4 text-center text-D border-r border-[#b09065]">No</th>
|
||||
<th class="px-6 py-4 text-center text-D border-r border-[#b09065]">Nama</th>
|
||||
<th class="px-6 py-4 text-center text-D border-r border-[#b09065]">Role</th>
|
||||
<th class="px-6 py-4 text-center text-D border-r border-C">No</th>
|
||||
<th class="px-6 py-4 text-center text-D border-r border-C">Nama</th>
|
||||
<th class="px-6 py-4 text-center text-D border-r border-C">Peran</th>
|
||||
<th class="px-6 py-4 text-center text-D">Aksi</th>
|
||||
</tr>
|
||||
</thead>
|
||||
@ -66,16 +66,16 @@
|
||||
<tr
|
||||
v-for="(item, index) in akun"
|
||||
:key="item.id"
|
||||
class="border-b border-gray-200 hover:bg-gray-50 transition duration-150"
|
||||
class="border-b border-C hover:bg-gray-50 transition duration-150"
|
||||
:class="{ 'bg-gray-50': index % 2 === 1 }"
|
||||
>
|
||||
<td class="px-6 py-4 border-r border-gray-200 text-center font-medium text-gray-900">
|
||||
<td class="px-6 py-4 border-r border-C text-center font-medium text-gray-900">
|
||||
{{ index + 1 }}
|
||||
</td>
|
||||
<td class="px-6 py-4 border-r border-gray-200 text-D">
|
||||
<td class="px-6 py-4 border-r border-C text-D">
|
||||
{{ item.nama }}
|
||||
</td>
|
||||
<td class="px-6 py-4 border-r border-gray-200 text-gray-800">
|
||||
<td class="px-6 py-4 border-r border-C text-gray-800">
|
||||
{{ item.role }}
|
||||
</td>
|
||||
<td class="px-6 py-4 text-center">
|
||||
|
||||
@ -18,7 +18,7 @@
|
||||
</div>
|
||||
|
||||
<!-- Table Section -->
|
||||
<div class="bg-white rounded-lg shadow-md border border-gray-200 overflow-hidden">
|
||||
<div class="bg-white rounded-lg shadow-md border border-C overflow-hidden">
|
||||
<table class="w-full">
|
||||
<thead>
|
||||
<tr class="bg-C text-black">
|
||||
@ -35,12 +35,12 @@
|
||||
</thead>
|
||||
<tbody>
|
||||
<tr v-for="(item, index) in kategori" :key="item.id"
|
||||
class="border-b border-gray-200 hover:bg-A transition duration-150"
|
||||
class="border-b border-C hover:bg-A transition duration-150"
|
||||
:class="{ 'bg-gray-50': index % 2 === 1 }">
|
||||
<td class="px-6 py-4 border-r border-gray-200 font-medium text-center text-gray-900">
|
||||
<td class="px-6 py-4 border-r border-C font-medium text-center text-gray-900">
|
||||
{{ index + 1 }}
|
||||
</td>
|
||||
<td class="px-6 py-4 border-r border-gray-200 text-center text-gray-800">
|
||||
<td class="px-6 py-4 border-r border-C text-center text-gray-800">
|
||||
{{ item.nama }}
|
||||
</td>
|
||||
<td class="px-6 py-4 text-center">
|
||||
|
||||
@ -51,7 +51,7 @@
|
||||
|
||||
<!-- Table Section -->
|
||||
<div
|
||||
class="bg-white rounded-lg shadow-md border border-gray-200 overflow-hidden"
|
||||
class="bg-white rounded-lg shadow-md border border-C overflow-hidden"
|
||||
>
|
||||
<table class="w-full">
|
||||
<thead class="">
|
||||
@ -85,26 +85,26 @@
|
||||
<tr
|
||||
v-for="(item, index) in sales"
|
||||
:key="item.id"
|
||||
class="border-b border-gray-200 hover:bg-gray-50 transition duration-150"
|
||||
class="border-b border-C hover:bg-gray-50 transition duration-150"
|
||||
:class="{ 'bg-gray-50': index % 2 === 1 }"
|
||||
>
|
||||
<td
|
||||
class="px-6 py-4 border-r border-gray-200 text-center font-medium text-gray-900"
|
||||
class="px-6 py-4 border-r border-C text-center font-medium text-gray-900"
|
||||
>
|
||||
{{ index + 1 }}
|
||||
</td>
|
||||
<td
|
||||
class="px-6 py-4 border-r border-gray-200 text-D"
|
||||
class="px-6 py-4 border-r border-C text-D"
|
||||
>
|
||||
{{ item.nama }}
|
||||
</td>
|
||||
<td
|
||||
class="px-6 py-4 border-r border-gray-200 text-gray-800"
|
||||
class="px-6 py-4 border-r border-C text-gray-800"
|
||||
>
|
||||
{{ item.no_hp }}
|
||||
</td>
|
||||
<td
|
||||
class="px-6 py-4 border-r border-gray-200 text-gray-800"
|
||||
class="px-6 py-4 border-r border-C text-gray-800"
|
||||
>
|
||||
{{ item.alamat }}
|
||||
</td>
|
||||
|
||||
Loading…
Reference in New Issue
Block a user