KoPKB/admin-erahn
2
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

fix skit2

Browse Source
This commit is contained in:
fifi97
2021-12-16 10:35:26 +08:00
parent 8e46b80150
commit 162800ae8c
10 changed files with 9204 additions and 11124 deletions
Download Patch File Download Diff File Expand all files Collapse all files
app/Http/Controllers/HomeController.php
+1 -17
View File
@@ -43,24 +43,8 @@ class HomeController extends Controller
$keseluruhanupahharian = $ringkasanharian['lelongupahsimpan'] + $ringkasanharian['tebus'][0]['upahsimpan'] + $ringkasanharian['advansur'][0]['upahsimpan'];
$financeMonth = Http::get(config('api.url'). '/admin/financeMonth',['kodcaw' => $auth_user['cawangan']])->json();
$goals = [['name' => 'Expected','value' => 200000,'strokeHeight' => 5, 'strokeColor' => '#e74c3c']];
for($i = 11;$i >= 0; $i--)
{
$goals[0]['value'] = $financeMonth[$i]['bajetgadai'];
// array_push($arrayPembiayaan,$financeMonth[$i]['pembiayaan']);
array_push($arrayPembiayaan[0]['data'],['x' => $financeMonth[$i]['namabulan'],'y' => $financeMonth[$i]['pembiayaan'],'goals' => (array) $goals]);
$goals[0]['value'] = $financeMonth[$i]['bajettebus'];
// array_push($arrayPenyelesaian[0]['data'],$financeMonth[$i]['penebusan']);
array_push($arrayPenyelesaian[0]['data'],['x' => $financeMonth[$i]['namabulan'],'y' => $financeMonth[$i]['penebusan'],'goals' => (array) $goals]);
$goals[0]['value'] = $financeMonth[$i]['bajetkeuntungan'];
array_push($arrayKeuntungan[0]['data'],['x' => $financeMonth[$i]['namabulan'],'y' => $financeMonth[$i]['keuntungan'],'goals' => (array) $goals]);
}
return view('home',compact('ringkasanharian','keseluruhanupahharian','arrayPembiayaan','arrayPenyelesaian','arrayKeuntungan'));
return view('home',compact('ringkasanharian','keseluruhanupahharian'));
}
package-lock.json
Generated
+48 -10469
View File
File diff suppressed because it is too large Load Diff
package.json
+1
View File
@@ -40,6 +40,7 @@
"vue-axios": "^3.4.0",
"vue-class-component": "^7.2.6",
"vue-property-decorator": "^9.1.2",
"vue-pusher": "^1.1.0",
"vue-router": "^3.5.3",
"vue-toastification": "^1.7.14",
"vuejs-datetimepicker": "^1.1.13",
public/js/app.js
Vendored
+8864 -298
View File
File diff suppressed because it is too large Load Diff
resources/js/app.js
Vendored
+8
View File
@@ -50,6 +50,14 @@ Vue.use(Toast, options)
Vue.use(datetime)
Alpine.start()
Vue.use(require('vue-pusher'), {
api_key: 'd95a6bc6ba2885c5f267',
options: {
cluster: 'ap1',
encrypted: true,
}
});
//Chart
Vue.component('pemb-chart', require('./components/Chart/PembiayaanChart.vue').default)
resources/js/components/Chart/KeuntunganChart.vue
+46 -114
View File
@@ -2,8 +2,8 @@
<div class="mx-auto rounded-lg">
<apexchart
width="550" type="bar"
:options="chartOptions" :series="this.keun">
width="500" type="bar"
:options="chartOptions" :series="series">
</apexchart>
</div>
@@ -20,126 +20,24 @@ let self = this;
export default {
name: 'Chart',
props:{
kodcaw: String,
keun: Array
kodcaw: String
},
data: () => ({
series: [
{
name: 'Actual',
data: [
{
x: 'Jan',
y: 1292,
// goals:[{name:'Expected',value:1700}]
goals: [
{
name: 'Expected',
value: 1400,
strokeHeight: 5,
strokeColor: '#e74c3c'
}
]
},
{
x: 'Feb',
y: 4432,
// goals: [
// {
// name: 'Expected',
// value: 5400,
// strokeHeight: 5,
// strokeColor: '#e74c3c'
// }
// ]
},
{
x: 'Mar',
y: 5423,
// goals: [
// {
// name: 'Expected',
// value: 5200,
// strokeHeight: 5,
// strokeColor: '#e74c3c'
// }
// ]
},
{
x: 'Apr',
y: 6653,
// goals: [
// {
// name: 'Expected',
// value: 6500,
// strokeHeight: 5,
// strokeColor: '#e74c3c'
// }
// ]
},
{
x: 'May',
y: 8133,
// goals: [
// {
// name: 'Expected',
// value: 6600,
// strokeHeight: 13,
// strokeWidth: 0,
// strokeLineCap: 'round',
// strokeColor: '#e74c3c'
// }
// ]
},
{
x: 'Jun',
y: 7132,
// goals: [
// {
// name: 'Expected',
// value: 7500,
// strokeHeight: 5,
// strokeColor: '#e74c3c'
// }
// ]
},
{
x: 'Jul',
y: 7332,
// goals: [
// {
// name: 'Expected',
// value: 8700,
// strokeHeight: 5,
// strokeColor: '#e74c3c'
// }
// ]
},
{
x: 'Ogos',
y: 6553,
// goals: [
// {
// name: 'Expected',
// value: 7300,
// strokeHeight: 2,
// strokeDashArray: 2,
// strokeColor: '#e74c3c'
// }
// ]
}
]
data: []
}
],
chartOptions: {
chart: {
id:'keuntungan-bulanan',
height: 350,
type: 'bar'
},
yaxis: {
labels: {
formatter: function (value) {
// console.log(value)
return 'RM ' + formatter.format(value);
}
},
@@ -155,21 +53,19 @@ export default {
colors: ['#3498db'],
dataLabels: {
enabled: true,
// enabledOnSeries: [0],
style: {
colors: ['#333']
},
offsetY: -30,
formatter: function (val, opt) {
// console.log(this.series.data)
// console.log(keun)
// console.log(opt.w.globals.seriesGoals[0][opt.dataPointIndex][0]['value'])
let total = ((val - opt.w.globals.seriesGoals[0][opt.dataPointIndex][0]['value']) / opt.w.globals.seriesGoals[0][opt.dataPointIndex][0]['value']) * 100
// console.log(total.toFixed(0))
if(isNaN(total))
{
return 0.00
}else{
return total.toFixed(2)
// return opt.w.globals.labels[opt.dataPointIndex] + ": " + val
}
},
},
legend: {
@@ -181,6 +77,42 @@ export default {
}
}
},
}),
created() {
this.getDatakeuntungan()
},
methods: {
getDatakeuntungan () {
this.axios.get('http://localhost:8000/admin/keuntunganBulanan', {
params: {
kodcaw: this.kodcaw
}
}).then(response => {
let keuntungan = [];
keuntungan = response.data
this.$apexcharts.exec('keuntungan-bulanan', 'updateSeries', [{
data: keuntungan
}])
}).catch(error => {
console.log(error)
})
}
},
mounted () {
var channel = this.$pusher.subscribe('keuntungan-notify');
channel.bind('trigger-keuntungan', ({ response }) => {
console.log(`${response}`);
this.getDatakeuntungan()
});
}
}
</script>
resources/js/components/Chart/PembiayaanChart.vue
+60 -108
View File
@@ -2,8 +2,8 @@
<div class="mx-auto rounded-lg">
<apexchart
width="550" type="bar"
:options="chartOptions" :series="this.pemb">
width="500" type="bar"
:options="chartOptions" :series="series">
</apexchart>
</div>
@@ -19,120 +19,20 @@ const formatter = new Intl.NumberFormat('en-US', {
export default {
name: 'Chart',
props:{
kodcaw: String,
pemb: Array
kodcaw: String
},
data: () => ({
series: [
{
name: 'Actual',
data: [
{
x: 'Jan',
y: 1292,
// goals:[{name:'Expected',value:1700}]
goals: [
{
name: 'Expected',
value: 1400,
strokeHeight: 5,
strokeColor: '#e74c3c'
}
]
},
{
x: 'Feb',
y: 4432,
// goals: [
// {
// name: 'Expected',
// value: 5400,
// strokeHeight: 5,
// strokeColor: '#e74c3c'
// }
// ]
},
{
x: 'Mar',
y: 5423,
// goals: [
// {
// name: 'Expected',
// value: 5200,
// strokeHeight: 5,
// strokeColor: '#e74c3c'
// }
// ]
},
{
x: 'Apr',
y: 6653,
// goals: [
// {
// name: 'Expected',
// value: 6500,
// strokeHeight: 5,
// strokeColor: '#e74c3c'
// }
// ]
},
{
x: 'May',
y: 8133,
// goals: [
// {
// name: 'Expected',
// value: 6600,
// strokeHeight: 13,
// strokeWidth: 0,
// strokeLineCap: 'round',
// strokeColor: '#e74c3c'
// }
// ]
},
{
x: 'Jun',
y: 7132,
// goals: [
// {
// name: 'Expected',
// value: 7500,
// strokeHeight: 5,
// strokeColor: '#e74c3c'
// }
// ]
},
{
x: 'Jul',
y: 7332,
// goals: [
// {
// name: 'Expected',
// value: 8700,
// strokeHeight: 5,
// strokeColor: '#e74c3c'
// }
// ]
},
{
x: 'Ogos',
y: 6553,
// goals: [
// {
// name: 'Expected',
// value: 7300,
// strokeHeight: 2,
// strokeDashArray: 2,
// strokeColor: '#e74c3c'
// }
// ]
}
]
data: []
}
],
chartOptions: {
chart: {
id: 'pembiayaan-bulanan',
height: 350,
type: 'bar'
},
@@ -145,12 +45,29 @@ export default {
},
plotOptions: {
bar: {
columnWidth: '60%'
columnWidth: '60%',
dataLabels: {
position: 'top',
},
}
},
colors: ['#3498db'],
dataLabels: {
enabled: false
enabled: true,
style: {
colors: ['#333']
},
offsetY: -30,
formatter: function (val, opt) {
let total = ((val - opt.w.globals.seriesGoals[0][opt.dataPointIndex][0]['value']) / opt.w.globals.seriesGoals[0][opt.dataPointIndex][0]['value']) * 100
if(isNaN(total))
{
return 0.00
}else{
return total.toFixed(2)
}
},
},
legend: {
show: true,
@@ -161,6 +78,41 @@ export default {
}
}
},
}),
created() {
this.getDataPembiayaan()
},
methods: {
getDataPembiayaan () {
this.axios.get('http://localhost:8000/admin/pembiayaanBulanan', {
params: {
kodcaw: this.kodcaw
}
}).then(response => {
let pembiayaan = [];
pembiayaan = response.data
this.$apexcharts.exec('pembiayaan-bulanan', 'updateSeries', [{
data: pembiayaan
}])
}).catch(error => {
console.log(error)
})
}
},
mounted () {
var channel = this.$pusher.subscribe('gadai-notify');
channel.bind('trigger-gadai', ({ response }) => {
console.log(`${response}`);
this.getDataPembiayaan()
});
}
}
</script>
resources/js/components/Chart/PenyelesaianChart.vue
+57 -108
View File
@@ -2,8 +2,8 @@
<div class="mx-auto rounded-lg">
<apexchart
width="550" type="bar"
:options="chartOptions" :series="this.peny">
width="500" type="bar"
:options="chartOptions" :series="series">
</apexchart>
</div>
@@ -19,120 +19,19 @@ const formatter = new Intl.NumberFormat('en-US', {
export default {
name: 'Chart',
props:{
kodcaw: String,
peny: Array
kodcaw: String
},
data: () => ({
series: [
{
name: 'Actual',
data: [
{
x: 'Jan',
y: 1292,
// goals:[{name:'Expected',value:1700}]
goals: [
{
name: 'Expected',
value: 1400,
strokeHeight: 5,
strokeColor: '#e74c3c'
}
]
},
{
x: 'Feb',
y: 4432,
// goals: [
// {
// name: 'Expected',
// value: 5400,
// strokeHeight: 5,
// strokeColor: '#e74c3c'
// }
// ]
},
{
x: 'Mar',
y: 5423,
// goals: [
// {
// name: 'Expected',
// value: 5200,
// strokeHeight: 5,
// strokeColor: '#e74c3c'
// }
// ]
},
{
x: 'Apr',
y: 6653,
// goals: [
// {
// name: 'Expected',
// value: 6500,
// strokeHeight: 5,
// strokeColor: '#e74c3c'
// }
// ]
},
{
x: 'May',
y: 8133,
// goals: [
// {
// name: 'Expected',
// value: 6600,
// strokeHeight: 13,
// strokeWidth: 0,
// strokeLineCap: 'round',
// strokeColor: '#e74c3c'
// }
// ]
},
{
x: 'Jun',
y: 7132,
// goals: [
// {
// name: 'Expected',
// value: 7500,
// strokeHeight: 5,
// strokeColor: '#e74c3c'
// }
// ]
},
{
x: 'Jul',
y: 7332,
// goals: [
// {
// name: 'Expected',
// value: 8700,
// strokeHeight: 5,
// strokeColor: '#e74c3c'
// }
// ]
},
{
x: 'Ogos',
y: 6553,
// goals: [
// {
// name: 'Expected',
// value: 7300,
// strokeHeight: 2,
// strokeDashArray: 2,
// strokeColor: '#e74c3c'
// }
// ]
}
]
data: []
}
],
chartOptions: {
chart: {
id:'penebusan-bulanan',
height: 350,
type: 'bar'
},
@@ -145,12 +44,29 @@ export default {
},
plotOptions: {
bar: {
columnWidth: '60%'
columnWidth: '60%',
dataLabels: {
position: 'top',
},
}
},
colors: ['#3498db'],
dataLabels: {
enabled: false
enabled: true,
style: {
colors: ['#333']
},
offsetY: -30,
formatter: function (val, opt) {
let total = ((val - opt.w.globals.seriesGoals[0][opt.dataPointIndex][0]['value']) / opt.w.globals.seriesGoals[0][opt.dataPointIndex][0]['value']) * 100
if(isNaN(total))
{
return 0.00
}else{
return total.toFixed(2)
}
},
},
legend: {
show: true,
@@ -161,6 +77,39 @@ export default {
}
}
},
}),
created(){
this.getDataPenebusan()
},
methods:{
getDataPenebusan(){
this.axios.get('http://localhost:8000/admin/penebusanBulanan', {
params: {
kodcaw: this.kodcaw
}
}).then(response => {
let penebusan = [];
penebusan = response.data
this.$apexcharts.exec('penebusan-bulanan', 'updateSeries', [{
data: penebusan
}])
}).catch(error => {
console.log(error)
})
}
},
mounted () {
var channel = this.$pusher.subscribe('tebus-notify');
channel.bind('trigger-tebus', ({ response }) => {
console.log(`${response}`);
this.getDataPenebusan()
});
}
}
</script>
resources/views/home.blade copy 2.php
+109
View File
@@ -0,0 +1,109 @@
@extends('layouts.app')
@section('content')
<div class="bg-gray-900 opacity-50 hidden fixed inset-0 z-10" id="sidebarBackdrop"></div>
<div id="main-content" class="h-full w-full bg-gray-50 relative overflow-y-auto">
<main>
<div class="pt-6 px-4">
<breadcrumb :items="[{ 'title' : 'Dashboard', 'icon' : 'fas fa-columns' }]"></breadcrumb>
<div class="mb-4 w-full grid grid-cols-1 md:grid-cols-2 xl:grid-cols-3 gap-4">
<div class="bg-white shadow rounded-lg p-4 sm:p-6 xl:p-8 ">
<div class="flex items-center">
<div class="flex-shrink-0">
<span class="text-2xl sm:text-3xl leading-none font-bold text-gray-900">RM {{ ($ringkasanharian['gadai'][0]['jumlahpinjaman']) ? number_format($ringkasanharian['gadai'][0]['jumlahpinjaman'],2) : "0.00" }}</span>
<h3 class="text-base font-normal text-gray-500">Pembiayaan Hari Ini</h3>
</div>
{{-- <div class="ml-5 w-0 flex items-center justify-end flex-1 text-green-500 text-base font-bold">
14.6%
<svg class="w-5 h-5" fill="currentColor" viewBox="0 0 20 20" xmlns="http://www.w3.org/2000/svg">
<path fill-rule="evenodd" d="M5.293 7.707a1 1 0 010-1.414l4-4a1 1 0 011.414 0l4 4a1 1 0 01-1.414 1.414L11 5.414V17a1 1 0 11-2 0V5.414L6.707 7.707a1 1 0 01-1.414 0z" clip-rule="evenodd"></path>
</svg>
</div> --}}
</div>
</div>
<div class="bg-white shadow rounded-lg p-4 sm:p-6 xl:p-8 ">
<div class="flex items-center">
<div class="flex-shrink-0">
<span class="text-2xl sm:text-3xl leading-none font-bold text-gray-900">RM {{ ($ringkasanharian['tebus'][0]['jumlahpinjaman']) ? number_format($ringkasanharian['tebus'][0]['jumlahpinjaman'],2) : "0.00" }}</span>
<h3 class="text-base font-normal text-gray-500">Penebusan Hari Ini</h3>
</div>
{{-- <div class="ml-5 w-0 flex items-center justify-end flex-1 text-green-500 text-base font-bold">
32.9%
<svg class="w-5 h-5" fill="currentColor" viewBox="0 0 20 20" xmlns="http://www.w3.org/2000/svg">
<path fill-rule="evenodd" d="M5.293 7.707a1 1 0 010-1.414l4-4a1 1 0 011.414 0l4 4a1 1 0 01-1.414 1.414L11 5.414V17a1 1 0 11-2 0V5.414L6.707 7.707a1 1 0 01-1.414 0z" clip-rule="evenodd"></path>
</svg>
</div> --}}
</div>
</div>
<div class="bg-white shadow rounded-lg p-4 sm:p-6 xl:p-8 ">
<div class="flex items-center">
<div class="flex-shrink-0">
<span class="text-2xl sm:text-3xl leading-none font-bold text-gray-900">RM {{ number_format($keseluruhanupahharian,2) }}</span>
<h3 class="text-base font-normal text-gray-500">Keuntungan Hari Ini</h3>
</div>
{{-- <div class="ml-5 w-0 flex items-center justify-end flex-1 text-red-500 text-base font-bold">
-2.7%
<svg class="w-5 h-5" fill="currentColor" viewBox="0 0 20 20" xmlns="http://www.w3.org/2000/svg">
<path fill-rule="evenodd" d="M14.707 12.293a1 1 0 010 1.414l-4 4a1 1 0 01-1.414 0l-4-4a1 1 0 111.414-1.414L9 14.586V3a1 1 0 012 0v11.586l2.293-2.293a1 1 0 011.414 0z" clip-rule="evenodd"></path>
</svg>
</div> --}}
</div>
</div>
</div>
<div class="w-full grid grid-cols-1 xl:grid-cols-2 2xl:grid-cols-3 gap-4">
<div class="bg-white shadow rounded-lg p-4 sm:p-6 xl:p-8 2xl:col-span-1">
<div class="flex items-center justify-between mb-4">
<div class="flex-shrink-0">
{{-- <span class="text-2xl sm:text-3xl leading-none font-bold text-gray-900">$45,385</span> --}}
<h3 class="text-base font-normal text-gray-500">Pembiayaan Bulanan</h3>
</div>
{{-- <div class="flex items-center justify-end flex-1 text-green-500 text-base font-bold">
12.5%
<svg class="w-5 h-5" fill="currentColor" viewBox="0 0 20 20" xmlns="http://www.w3.org/2000/svg">
<path fill-rule="evenodd" d="M5.293 7.707a1 1 0 010-1.414l4-4a1 1 0 011.414 0l4 4a1 1 0 01-1.414 1.414L11 5.414V17a1 1 0 11-2 0V5.414L6.707 7.707a1 1 0 01-1.414 0z" clip-rule="evenodd"></path>
</svg>
</div> --}}
</div>
<div class="mx-auto mt-10"><pemb-chart :pemb='{!! json_encode($arrayPembiayaan) !!}' kodcaw={{ Auth::user()->cawangan }}></pemb-chart></div>
</div>
<div class="bg-white shadow rounded-lg p-4 sm:p-6 xl:p-8 2xl:col-span-1">
<div class="flex items-center justify-between mb-4">
<div class="flex-shrink-0">
{{-- <span class="text-2xl sm:text-3xl leading-none font-bold text-gray-900">$45,385</span> --}}
<h3 class="text-base font-normal text-gray-500">Penyelesaian Bulanan</h3>
</div>
{{-- <div class="flex items-center justify-end flex-1 text-green-500 text-base font-bold">
12.5%
<svg class="w-5 h-5" fill="currentColor" viewBox="0 0 20 20" xmlns="http://www.w3.org/2000/svg">
<path fill-rule="evenodd" d="M5.293 7.707a1 1 0 010-1.414l4-4a1 1 0 011.414 0l4 4a1 1 0 01-1.414 1.414L11 5.414V17a1 1 0 11-2 0V5.414L6.707 7.707a1 1 0 01-1.414 0z" clip-rule="evenodd"></path>
</svg>
</div> --}}
</div>
<div class="mx-auto mt-10"><peny-chart :peny='{!! json_encode($arrayPenyelesaian) !!}' kodcaw={{ Auth::user()->cawangan }}></peny-chart></div>
</div>
<div class="bg-white shadow rounded-lg p-4 sm:p-6 xl:p-8 2xl:col-span-1">
<div class="flex items-center justify-between mb-4">
<div class="flex-shrink-0">
{{-- <span class="text-2xl sm:text-3xl leading-none font-bold text-gray-900">$45,385</span> --}}
<h3 class="text-base font-normal text-gray-500">Keuntungan Bulanan</h3>
</div>
{{-- <div class="flex items-center justify-end flex-1 text-green-500 text-base font-bold">
12.5%
<svg class="w-5 h-5" fill="currentColor" viewBox="0 0 20 20" xmlns="http://www.w3.org/2000/svg">
<path fill-rule="evenodd" d="M5.293 7.707a1 1 0 010-1.414l4-4a1 1 0 011.414 0l4 4a1 1 0 01-1.414 1.414L11 5.414V17a1 1 0 11-2 0V5.414L6.707 7.707a1 1 0 01-1.414 0z" clip-rule="evenodd"></path>
</svg>
</div> --}}
</div>
<div class="mx-auto mt-10"><keun-chart :keun='{!! json_encode($arrayKeuntungan) !!}' kodcaw={{ Auth::user()->cawangan }}></keun-chart></div>
</div>
</div>
</div>
</main>
@include('layouts.footer')
@endsection
resources/views/home.blade.php
+3 -3
View File
@@ -68,7 +68,7 @@
</svg>
</div> --}}
</div>
<div class="mx-auto mt-10"><pemb-chart :pemb='{!! json_encode($arrayPembiayaan) !!}' kodcaw={{ Auth::user()->cawangan }}></pemb-chart></div>
<div class="mx-auto mt-10"><pemb-chart kodcaw={{ Auth::user()->cawangan }}></pemb-chart></div>
</div>
<div class="bg-white shadow rounded-lg p-4 sm:p-6 xl:p-8 2xl:col-span-1">
<div class="flex items-center justify-between mb-4">
@@ -83,7 +83,7 @@
</svg>
</div> --}}
</div>
<div class="mx-auto mt-10"><peny-chart :peny='{!! json_encode($arrayPenyelesaian) !!}' kodcaw={{ Auth::user()->cawangan }}></peny-chart></div>
<div class="mx-auto mt-10"><peny-chart kodcaw={{ Auth::user()->cawangan }}></peny-chart></div>
</div>
<div class="bg-white shadow rounded-lg p-4 sm:p-6 xl:p-8 2xl:col-span-1">
@@ -99,7 +99,7 @@
</svg>
</div> --}}
</div>
<div class="mx-auto mt-10"><keun-chart :keun='{!! json_encode($arrayKeuntungan) !!}' kodcaw={{ Auth::user()->cawangan }}></keun-chart></div>
<div class="mx-auto mt-10"><keun-chart kodcaw={{ Auth::user()->cawangan }}></keun-chart></div>
</div>
</div>