Karena pelanggaran hak cipta yang bodoh, saya harus mengganti nama paket ini.
Perhatikan bahwa tidak ada kode yang berubah (namespace masih sama). Hanya nama paketnya yang berubah. Namespace mungkin berubah nanti di rilis besar.
laravel feedback component memungkinkan Anda dengan mudah mengimplementasikan komponen Umpan Balik Pelanggan di situs web Anda. Itu dibangun dengan VueJS tetapi dapat diimplementasikan di semua jenis Proyek Laravel. Anda hanya perlu menghilangkan beberapa baris pada tata letak Anda.
Anda mungkin tahu banyak situs web yang menggunakan sistem obrolan interkom, atau crisp, chat.io dan masih banyak lagi obrolan pelanggan yang memungkinkan Anda mendapatkan masukan dari pengunjung situs web Anda.
laravel feedback component adalah alternatif sumber terbuka dan dapat disesuaikan yang mengadopsi tata letak yang sama. Setelah diinstal, Anda akan melihat komponen tersebut di situs web Anda.
Kami juga memiliki Alat Nova untuk itu!
Saya akan mengimplementasikan sistem chatting di laravel feedback component , yang mungkin akan bekerja dengan Laravel Nova. Ini direncanakan untuk V2. Untuk saat ini, Anda hanya dapat mengumpulkan masukan dari pengunjung Anda.
komponen umpan balik laravel " data-animated-image="" style="max-width: 100%;">
Anda dapat menggunakan Komposer untuk Menginstal laravel feedback component :
composer require mydnic/laravel-kustomer
Setelah menginstal laravel feedback component , publikasikan asetnya menggunakan perintah kustomer:publish
Artisan. Setelah menginstal paket, Anda juga harus menjalankan perintah migrasi:
php artisan kustomer:publish
php artisan migrate
Ini akan membuat tabel masukan baru.
Anda dapat memperbarui konfigurasi komponen sesuai keinginan dengan mengedit config/kustomer.php
.
Saya mendorong Anda untuk membaca file konfigurasi ini dengan cermat.
Semua teks yang Anda lihat di komponen dapat diterjemahkan. Setelah menerbitkan aset, Anda akan menemukan teksnya di resources/lang/vendor/en/kustomer.php
Label masukan juga disimpan dalam file ini, dan larik feedbacks
harus cocok dengan yang ada di file konfigurasi Anda.
Di direktori public/
Anda, Anda akan menemukan file css dan js terkompilasi yang perlu dimasukkan ke dalam tata letak html Anda.
Sertakan ini pada halaman yang Anda inginkan untuk menampilkan komponen:
< head >
< script src = " {{ asset ( ' vendor/kustomer/js/kustomer.js ' ) } } " defer ></ script >
</ head >
< body >
@include ( ' kustomer::kustomer ' )
</ body >
Perhatian Jika Anda menjalankan aplikasi VueJS, Anda harus menambahkan container
#kustomer
di luar#app
container Anda. Hal ini karena kustomer berjalan pada instance vue-nya sendiri secara default. Jika Anda ingin mengubahnya, lihat Menyertakan aset dengan aset Anda sendiri
Saat memperbarui paket ini, Anda harus menerbitkan ulang aset:
php artisan vendor:publish --tag=kustomer-assets --force
Ini akan menerbitkan ulang file JS dan CSS yang telah dikompilasi, tetapi juga file svg yang terletak di public/vendor/kustomer/assets
. Jika Anda ingin menggunakan gambar Anda sendiri, perbarui file konfigurasi.
Secara opsional, Anda dapat mengimpor file .vue
dan .sass
ke folder resources/js
dan resources/sass
Anda sendiri, sehingga memungkinkan Anda untuk menyesuaikan komponen dan tata letak Komponen Umpan Balik.
Ini juga akan memungkinkan Anda untuk hanya memiliki satu .js
dan .css
yang dikompilasi di aplikasi Anda.
Namun, Anda harus berhati-hati jika mencoba memperbarui versi terbaru, karena perubahan Anda mungkin hilang.
Diperlukan dua paket npm:
Anda dapat menambahkannya melalui npm atau benang.
Kami menggunakan axios untuk membuat permintaan HTTP untuk mengirim umpan balik, jadi pastikan axios diinstal dan dikonfigurasi di aplikasi vue Anda.
Seperti dalam javascript scaffolding Laravel, aksio harus dikonfigurasi seperti ini:
window . axios = require ( 'axios' ) ;
window . axios . defaults . headers . common [ 'X-Requested-With' ] = 'XMLHttpRequest' ;
let token = document . head . querySelector ( 'meta[name="csrf-token"]' ) ;
if ( token ) {
window . axios . defaults . headers . common [ 'X-CSRF-TOKEN' ] = token . content ;
} else {
console . error ( 'CSRF token not found: https://laravel.com/docs/csrf#csrf-x-csrf-token' ) ;
}
Publikasikan komponen VueJS:
php artisan vendor:publish --tag=kustomer-vue-component
Publikasikan file gaya SASS:
php artisan vendor:publish --tag=kustomer-sass-component
Kemudian di aplikasi vue Anda:
// app.js
Vue . component ( 'kustomer' , require ( './components/Kustomer/Kustomer.vue' ) ) ;
// app.scss
@import ' kustomer ' ;
Umpan Balik pada dasarnya memiliki 4 atribut:
Setelah Umpan Balik disimpan dalam database Anda, Anda dapat menggunakan backoffice Anda sendiri untuk menampilkan dan memanipulasi data.
Model Feedback berfungsi seperti model Eloquent lainnya sehingga sangat mudah digunakan di Aplikasi Laravel Anda.
Menggunakan Laravel Nova? Tidak masalah !
Jika Anda menggunakan Laravel Nova Anda pasti menginginkan alat untuk memvisualisasikan semua masukan yang Anda terima.
Anda dapat menginstal Laravel Nova Tool resmi di sini.
Ketika umpan balik baru disimpan dengan benar, kami akan mengirimkan Acara Laravel.
Anda dapat mendengarkan acara ini dan memicu semua jenis pendengar. Terserah Anda untuk memutuskan apa yang terjadi selanjutnya! Anda dapat mengirim email ke administrator, mencatat beberapa data, atau apa pun yang Anda pikirkan.
Di EventServiceProvider
Anda, Anda dapat memperbarui properti $listen
untuk menambahkan Acara.
protected $ listen = [
' MydnicKustomerEventsNewFeedback ' => [
' AppListenersYourOwnListener ' , // change this
],
// ...
];
Laravel Kustomer adalah perangkat lunak sumber terbuka yang dilisensikan di bawah lisensi MIT.
Dalam proyek ini Anda akan menemukan beberapa ikon svg yang berasal dari FlatIcon. Anda bebas mengubahnya di proyek Anda sendiri.