· 6 years ago · Feb 08, 2020, 08:12 AM
1<template>
2 <div class="row">
3 <div class="col-lg-12">
4 <b-tabs pills card>
5 <b-tab title="THP Karyawan" active>
6 <div class="row">
7 <div class="col-lg-6 form-group form-float">
8 <label class="form-label">Tanggal Penggajian</label>
9 <input class="form-control" placeholder="Tanggal Gaji"
10 type="date"
11 v-model="payroll.SalaryDate"
12 required>
13 </div>
14 <div class="col-lg-6 form-group form-float">
15 <label class="form-label">Nama Karyawan</label>
16 <vue-select :disabled="$route.name.includes('.detail')" v-model="selectedEmployee" class="vue-select2" name="role" :options="employee" label="Name"></vue-select>
17 </div>
18 <div class="col-lg-6 form-group form-float">
19 <label class="form-label">Gaji yang Dibayarkan</label>
20 <input class="form-control" type="text" name="TotalPayment"
21 v-model="payroll.TotalPayment" required>
22 </div>
23 <div class="col-lg-6 form-group form-float">
24 <label class="form-label">Total Perhitungan Gaji</label>
25 <input class="form-control" v-model="payroll.TotalCalculation" disabled>
26 </div>
27 <div class="col-lg-6 form-group form-float">
28 <button @click="calculate(selectedEmployee.Id, selectedEmployee.PositionId, selectedEmployee.LevelId)" type="button" style="width: 132px; height: 36px; color: white; background-color: #20c197; border: 1px solid #20c197; border-radius: 3px;" ><i class="fa fa-refresh"></i><span>Hitung</span></button>
29 </div>
30 </div>
31 </b-tab>
32 <b-tab title="Detail 1">
33 <!-- <div v-if="detail.SalaryComponentId<=20">
34 <div class="col-xs-6 form-group form-float"
35 v-for="detail in payroll.details"
36 :key = detail.Id>
37 <label class="form-label">{{ detail.SalaryComponentName }}</label>
38 <input class="form-control" type="text"
39 v-model="detail.Amount" required>
40 </div>
41 </div> -->
42 <div class="row">
43 <div class="col-lg-6 form-group form-float">
44 <label class="form-label">Gaji Pokok</label>
45 <input class="form-control" type="text" name="TotalPayment" v-model="this.detail.gajiPokok" required>
46 </div>
47 <div class="col-lg-6 form-group form-float">
48 <label class="form-label">Gaji Lembur</label>
49 <input class="form-control" type="text" name="TotalPayment" v-model="this.detail.gajiLembur" required>
50 </div>
51 <div class="col-lg-6 form-group form-float">
52 <label class="form-label">Tunjangan Cabang</label>
53 <input class="form-control" type="text" name="TotalPayment" v-model="this.detail.tunjanganCabang" required>
54 </div>
55 <div class="col-lg-6 form-group form-float">
56 <label class="form-label">Tunjangan Harian</label>
57 <input class="form-control" type="text" name="TotalPayment" v-model="this.detail.tunjanganHarian" required>
58 </div>
59 <div class="col-lg-6 form-group form-float">
60 <label class="form-label">Tunjangan Posisi</label>
61 <input class="form-control" type="text" name="TotalPayment" v-model="this.detail.tunjanganPosisi" required>
62 </div>
63
64 <div class="col-lg-6 form-group form-float">
65 <label class="form-label">Tunjangan Transportasi</label>
66 <input class="form-control" type="text" name="TotalPayment" v-model="this.detail.tunjanganTransportasi" required>
67 </div>
68 <div class="col-lg-6 form-group form-float">
69 <label class="form-label">Tunjangan Hari Libur</label>
70 <input class="form-control" type="text" name="TotalPayment" v-model="this.detail.tunjanganHariLibur" required>
71 </div>
72 <div class="col-lg-6 form-group form-float">
73 <label class="form-label">Nominal Tunjangan Hari Libur</label>
74 <input class="form-control" type="text" name="TotalPayment" v-model="this.detail.nominalTunjanganHariLibur" required>
75 </div>
76 <div class="col-lg-6 form-group form-float">
77 <label class="form-label">Nominal Tunjangan Hari Libur Citra Pesona</label>
78 <input class="form-control" type="text" name="TotalPayment" v-model="this.detail.nominalTunjanganHariLiburCitraPesona" required>
79 </div>
80 <div class="col-lg-6 form-group form-float">
81 <label class="form-label">Tunjangan Wilayah</label>
82 <input class="form-control" type="text" name="TotalPayment" v-model="this.detail.tunjanganWilayah" required>
83 </div>
84 <div class="col-lg-6 form-group form-float">
85 <label class="form-label">Nominal Upah Minimum Kota Cimahi</label>
86 <input class="form-control" type="text" name="TotalPayment" v-model="this.detail.nominalUpahMinimumKotaCimahi" required>
87 </div>
88 </div>
89 </b-tab>
90 <b-tab title="Detail 2">
91 <!-- <div v-if="detail.SalaryComponentId>20 && detail.SalaryComponentId<=40">
92 <div class="col-xs-6 form-group form-float"
93 v-for="detail in payroll.details"
94 :key="detail.Id">
95 <label class="form-label">{{detail.SalaryComponentName}}</label>
96 <input class="form-control" type="text"
97 v-model="detail.Amount" required>
98 </div>
99 </div> -->
100 <div class="row">
101 <div class="col-lg-6 form-group form-float">
102 <label class="form-label">Bonus Survey</label>
103 <input class="form-control" type="text" name="TotalPayment" v-model="this.detail.bonusSurvey" required>
104 </div>
105 <div class="col-lg-6 form-group form-float">
106 <label class="form-label">Bonus Transaksi Marketing</label>
107 <input class="form-control" type="text" name="TotalPayment" v-model="this.detail.bonusTransaksiMarketing" required>
108 </div>
109 <div class="col-lg-6 form-group form-float">
110 <label class="form-label">Bonus Transaksi Perusahaan</label>
111 <input class="form-control" type="text" name="TotalPayment" v-model="this.detail.bonusTransaksiPerusahaan" required>
112 </div>
113 <div class="col-lg-6 form-group form-float">
114 <label class="form-label">Bonus Transaksi Pengemudi</label>
115 <input class="form-control" type="text" name="TotalPayment" v-model="this.detail.bonusTransaksiPengemudi" required>
116 </div>
117 <div class="col-lg-6 form-group form-float">
118 <label class="form-label">Bonus Transaksi Cabang</label>
119 <input class="form-control" type="text" name="TotalPayment" v-model="this.detail.bonusTransaksiCabang" required>
120 </div>
121 <div class="col-lg-6 form-group form-float">
122 <label class="form-label">Bonus Transaksi Netto</label>
123 <input class="form-control" type="text" name="TotalPayment" v-model="this.detail.bonusTransaksiNetto" required>
124 </div>
125 <div class="col-lg-6 form-group form-float">
126 <label class="form-label">Bonus Transaksi Dealer</label>
127 <input class="form-control" type="text" name="TotalPayment" v-model="this.detail.bonusTransaksiDealer" required>
128 </div>
129 <div class="col-lg-6 form-group form-float">
130 <label class="form-label">Bonus Transaksi Cash</label>
131 <input class="form-control" type="text" name="TotalPayment" v-model="this.detail.bonusTransaksiCash" required>
132 </div>
133 <div class="col-lg-6 form-group form-float">
134 <label class="form-label">Bonus Target Marketing</label>
135 <input class="form-control" type="text" name="TotalPayment" v-model="this.detail.bonusTargetMarketing" required>
136 </div>
137 <div class="col-lg-6 form-group form-float">
138 <label class="form-label">Bonus Target Koordinator</label>
139 <input class="form-control" type="text" name="TotalPayment" v-model="this.detail.bonusTargetKoordinator" required>
140 </div>
141 <div class="col-lg-6 form-group form-float">
142 <label class="form-label">Bonus Target Cabang</label>
143 <input class="form-control" type="text" name="TotalPayment" v-model="this.detail.bonusTargetCabang" required>
144 </div>
145 <div class="col-lg-6 form-group form-float">
146 <label class="form-label">Bonus Target Dealer</label>
147 <input class="form-control" type="text" name="TotalPayment" v-model="this.detail.bonusTargetDealer" required>
148 </div>
149 <div class="col-lg-6 form-group form-float">
150 <label class="form-label">Bonus Pembayaran Uang Muka Marketing</label>
151 <input class="form-control" type="text" name="TotalPayment" v-model="this.detail.bonusPembayaranUangMukaMarketing" required>
152 </div>
153 <div class="col-lg-6 form-group form-float">
154 <label class="form-label">Bonus Pembayaran Uang Muka Pengemudi</label>
155 <input class="form-control" type="text" name="TotalPayment" v-model="this.detail.bonusPembayaranUangMukaPengemudi" required>
156 </div>
157 <div class="col-lg-6 form-group form-float">
158 <label class="form-label">Bonus Pembayaran Uang Muka Dealer</label>
159 <input class="form-control" type="text" name="TotalPayment" v-model="this.detail.bonusPembayaranUangMukaDealer" required>
160 </div>
161 <div class="col-lg-6 form-group form-float">
162 <label class="form-label">Bonus Pembayaran Uang Muka Demo</label>
163 <input class="form-control" type="text" name="TotalPayment" v-model="this.detail.bonusPembayaranUangMukaDemo" required>
164 </div>
165 <div class="col-lg-6 form-group form-float">
166 <label class="form-label">Bonus Transaksi Kolektor</label>
167 <input class="form-control" type="text" name="TotalPayment" v-model="this.detail.bonusTransaksiKolektor" required>
168 </div>
169 <div class="col-lg-6 form-group form-float">
170 <label class="form-label">Bonus Transaksi Cabang</label>
171 <input class="form-control" type="text" name="TotalPayment" v-model="this.detail.bonusTransaksiCabang" required>
172 </div>
173 <div class="col-lg-6 form-group form-float">
174 <label class="form-label">Bonus Transaksi Cabang Senior</label>
175 <input class="form-control" type="text" name="TotalPayment" v-model="this.detail.bonusTransaksiCabangSenior" required>
176 </div>
177 <div class="col-lg-6 form-group form-float">
178 <label class="form-label">Bonus Transaksi Koordinator Cabang</label>
179 <input class="form-control" type="text" name="TotalPayment" v-model="this.detail.bonusTransaksiKoordinatorCabang" required>
180 </div>
181 <div class="col-lg-6 form-group form-float">
182 <label class="form-label">Bonus Transaksi A9</label>
183 <input class="form-control" type="text" name="TotalPayment" v-model="this.detail.bonusTransaksiA9" required>
184 </div>
185 <div class="col-lg-6 form-group form-float">
186 <label class="form-label">Bonus MGM</label>
187 <input class="form-control" type="text" name="TotalPayment" v-model="this.detail.bonusMGM" required>
188 </div>
189 <div class="col-lg-6 form-group form-float">
190 <label class="form-label">Bonus MGM Senior</label>
191 <input class="form-control" type="text" name="TotalPayment" v-model="this.detail.bonusMGMSenior" required>
192 </div>
193 <div class="col-lg-6 form-group form-float">
194 <label class="form-label">Bonus Rekrut</label>
195 <input class="form-control" type="text" name="TotalPayment" v-model="this.detail.bonusRekrut" required>
196 </div>
197 <div class="col-lg-6 form-group form-float">
198 <label class="form-label">Bonus Dealer</label>
199 <input class="form-control" type="text" name="TotalPayment" v-model="this.detail.bonusDealer" required>
200 </div>
201 <div class="col-lg-6 form-group form-float">
202 <label class="form-label">Bonus Komisi</label>
203 <input class="form-control" type="text" name="TotalPayment" v-model="this.detail.bonusKomisi" required>
204 </div>
205 <div class="col-lg-6 form-group form-float">
206 <label class="form-label">Bonus Komisi Cabang</label>
207 <input class="form-control" type="text" name="TotalPayment" v-model="this.detail.bonusKomisiCabang" required>
208 </div>
209 <div class="col-lg-6 form-group form-float">
210 <label class="form-label">Bonus Komisi Demo</label>
211 <input class="form-control" type="text" name="TotalPayment" v-model="this.detail.bonusKomisiDemo" required>
212 </div>
213 <div class="col-lg-6 form-group form-float">
214 <label class="form-label">Bonus Komisi Diskon Delaer</label>
215 <input class="form-control" type="text" name="TotalPayment" v-model="this.detail.bonusKomisiDiskonDealer" required>
216 </div>
217 <div class="col-lg-6 form-group form-float">
218 <label class="form-label">Perakitan</label>
219 <input class="form-control" type="text" name="TotalPayment" v-model="this.detail.perakitan" required>
220 </div>
221 <div class="col-lg-6 form-group form-float">
222 <label class="form-label">Bonus Perakitan</label>
223 <input class="form-control" type="text" name="TotalPayment" v-model="this.detail.bonusPerakitan" required>
224 </div>
225 <div class="col-lg-6 form-group form-float">
226 <label class="form-label">Pembayaran Kasbon</label>
227 <input class="form-control" type="text" name="TotalPayment" v-model="this.detail.pembayaranKasbon" required>
228 </div>
229 <div class="col-lg-6 form-group form-float">
230 <label class="form-label">Pembayaran Kasbon</label>
231 <input class="form-control" type="text" name="TotalPayment" v-model="this.detail.pembayaranKasbon" required>
232 </div>
233 <div class="col-lg-6 form-group form-float">
234 <label class="form-label">Komisi Klaim</label>
235 <input class="form-control" type="text" name="TotalPayment" v-model="this.detail.komisiKlaim" required>
236 </div>
237 <div class="col-lg-6 form-group form-float">
238 <label class="form-label">Komisi Admin dan Gudang</label>
239 <input class="form-control" type="text" name="TotalPayment" v-model="this.detail.komisiAdminDanGudang" required>
240 </div>
241 <div class="col-lg-6 form-group form-float">
242 <label class="form-label">Insentif</label>
243 <input class="form-control" type="text" name="TotalPayment" v-model="this.detail.insentif" required>
244 </div>
245 <div class="col-lg-6 form-group form-float">
246 <label class="form-label">Insentif Pengiriman</label>
247 <input class="form-control" type="text" name="TotalPayment" v-model="this.detail.insentifPengiriman" required>
248 </div>
249 <div class="col-lg-6 form-group form-float">
250 <label class="form-label">Service Kolektor</label>
251 <input class="form-control" type="text" name="TotalPayment" v-model="this.detail.serviceKolektor" required>
252 </div>
253 <div class="col-lg-6 form-group form-float">
254 <label class="form-label">Kolektor Heavy Service</label>
255 <input class="form-control" type="text" name="TotalPayment" v-model="this.detail.kolektorHeavyService" required>
256 </div>
257 <div class="col-lg-6 form-group form-float">
258 <label class="form-label">Total Bonus Uang Muka</label>
259 <input class="form-control" type="text" name="TotalPayment" v-model="this.detail.totalBonusUangMuka" required>
260 </div>
261 <div class="col-lg-6 form-group form-float">
262 <label class="form-label">Bonus Penjualan Bulanan</label>
263 <input class="form-control" type="text" name="TotalPayment" v-model="this.detail.bonusPenjualanBulanan" required>
264 </div>
265 <div class="col-lg-6 form-group form-float">
266 <label class="form-label">Bonus Penjualan Tunai</label>
267 <input class="form-control" type="text" name="TotalPayment" v-model="this.detail.bonusPenjualanTunai" required>
268 </div>
269 <div class="col-lg-6 form-group form-float">
270 <label class="form-label">Bonus Penjualan Kredit</label>
271 <input class="form-control" type="text" name="TotalPayment" v-model="this.detail.bonusPenjualanKredit" required>
272 </div>
273 <div class="col-lg-6 form-group form-float">
274 <label class="form-label">Bonus Penjualan</label>
275 <input class="form-control" type="text" name="TotalPayment" v-model="this.detail.bonusPenjualan" required>
276 </div>
277 <div class="col-lg-6 form-group form-float">
278 <label class="form-label">Bonus Order</label>
279 <input class="form-control" type="text" name="TotalPayment" v-model="this.detail.bonusOrder" required>
280 </div>
281 <div class="col-lg-6 form-group form-float">
282 <label class="form-label">Bonus Order Cash</label>
283 <input class="form-control" type="text" name="TotalPayment" v-model="this.detail.bonusOrderCash" required>
284 </div>
285 <div class="col-lg-6 form-group form-float">
286 <label class="form-label">Bonus Order Junior</label>
287 <input class="form-control" type="text" name="TotalPayment" v-model="this.detail.bonusOrderJunior" required>
288 </div>
289 <div class="col-lg-6 form-group form-float">
290 <label class="form-label">Nominal Bonus Uang Muka</label>
291 <input class="form-control" type="text" name="TotalPayment" v-model="this.detail.nominalBonusUangMuka" required>
292 </div>
293 <div class="col-lg-6 form-group form-float">
294 <label class="form-label">Total Bonus Survey</label>
295 <input class="form-control" type="text" name="TotalPayment" v-model="this.detail.totalBonusSurvey" required>
296 </div>
297 <div class="col-lg-6 form-group form-float">
298 <label class="form-label">Nominal Bonus Survey</label>
299 <input class="form-control" type="text" name="TotalPayment" v-model="this.detail.nominalBonusSurvey" required>
300 </div>
301 </div>
302 </b-tab>
303 <b-tab title="Detail 3">
304 <!-- <div v-if="detail.SalaryComponentId>40 && detail.SalaryComponentId<=60">
305 <div class="col-xs-6 form-group form-float"
306 v-for="detail in payroll.details"
307 :key="detail.Id">
308 <label class="form-label">{{detail.SalaryComponentName}}</label>
309 <input class="form-control" type="text"
310 v-model="detail.Amount" required>
311 </div>
312 </div> -->
313 <div class="row">
314 <div class="col-lg-6 form-group form-float">
315 <label class="form-label">Potongan Bolos</label>
316 <input class="form-control" type="text" name="TotalPayment" v-model="this.detail.potonganBolos" required>
317 </div>
318 <div class="col-lg-6 form-group form-float">
319 <label class="form-label">Potongan Izin Tanpa Konfirmasi</label>
320 <input class="form-control" type="text" name="TotalPayment" v-model="this.detail.potonganIzinTanpaKonfirmasi" required>
321 </div>
322 <div class="col-lg-6 form-group form-float">
323 <label class="form-label">Potongan Izin Tanpa Kabar</label>
324 <input class="form-control" type="text" name="TotalPayment" v-model="this.detail.potonganIzinTanpaKabar" required>
325 </div>
326 <div class="col-lg-6 form-group form-float">
327 <label class="form-label">Potongan Sakit</label>
328 <input class="form-control" type="text" name="TotalPayment" v-model="this.detail.potonganSakit" required>
329 </div>
330 <div class="col-lg-6 form-group form-float">
331 <label class="form-label">Potongan Keterlambatan</label>
332 <input class="form-control" type="text" name="TotalPayment" v-model="this.detail.potonganKeterlambatan" required>
333 </div>
334 <div class="col-lg-6 form-group form-float">
335 <label class="form-label">Potongan Klaim</label>
336 <input class="form-control" type="text" name="TotalPayment" v-model="this.detail.potonganKlaim" required>
337 </div>
338 <div class="col-lg-6 form-group form-float">
339 <label class="form-label">Potongan Klaim Dealer</label>
340 <input class="form-control" type="text" name="TotalPayment" v-model="this.detail.potonganKlaimDealer" required>
341 </div>
342 <div class="col-lg-6 form-group form-float">
343 <label class="form-label">Potongan Kartu Bermasalah</label>
344 <input class="form-control" type="text" name="TotalPayment" v-model="this.detail.potonganKartuBermasalah" required>
345 </div>
346 <div class="col-lg-6 form-group form-float">
347 <label class="form-label">Potongan Komisi</label>
348 <input class="form-control" type="text" name="TotalPayment" v-model="this.detail.potonganKomisi" required>
349 </div>
350 <div class="col-lg-6 form-group form-float">
351 <label class="form-label">Potongan Kartu Komisi</label>
352 <input class="form-control" type="text" name="TotalPayment" v-model="this.detail.potonganKartuKomisi" required>
353 </div>
354 <div class="col-lg-6 form-group form-float">
355 <label class="form-label">Potongan Kartu Klaim</label>
356 <input class="form-control" type="text" name="TotalPayment" v-model="this.detail.potonganKartuKlaim" required>
357 </div>
358 <div class="col-lg-6 form-group form-float">
359 <label class="form-label">Persentase Bonus Kartu Masalah</label>
360 <input class="form-control" type="text" name="TotalPayment" v-model="this.detail.potonganBonusKartuMasalah" required>
361 </div>
362 <div class="col-lg-6 form-group form-float">
363 <label class="form-label">Waktu Angsuran Bermasalah</label>
364 <input class="form-control" type="text" name="TotalPayment" v-model="this.detail.waktuAngsuranBermasalah" required>
365 </div>
366 <div class="col-lg-6 form-group form-float">
367 <label class="form-label">Potongan Kartu Angsuran</label>
368 <input class="form-control" type="text" name="TotalPayment" v-model="this.detail.potonganKartuAngsuran" required>
369 </div>
370 </div>
371 <div v-if="!$route.name.includes('.detail')" class="row">
372
373 </div>
374 </b-tab>
375 <div class="col-lg-12 button-div">
376 <button v-on:click="save()" class="btn btn-success">Simpan</button>
377 <router-link :to="{ name: 'PayrollManagement.index' }" class="btn btn-default">Batal</router-link>
378 </div>
379 </b-tabs>
380 </div>
381 </div>
382</template>
383
384<script>
385// Plugins
386import moment from 'moment'
387import $ from 'jquery'
388import VueSelect from 'vue-select'
389import 'vue-select/dist/vue-select.css'
390// import Base64Upload from 'vue-base64-upload'
391
392// API
393import LegalEntity from '@/services/Companies/LegalEntities'
394import Branch from '@/services/Companies/Branches'
395import Payrolls from '@/services/Payrolls/Payroll'
396import Employees from '@/services/Employees/Employees'
397import Attendances from '@/services/Employees/Attendances'
398import Positions from '@/services/Employees/Positions'
399import Levels from '@/services/Employees/Levels'
400import WarningLetters from '@/services/Employees/WarningLetters'
401import SalaryComponents from '@/services/Payrolls/SalaryComponent'
402import SalaryComponentDetails from '@/services/Payrolls/SalaryComponentDetail'
403
404export default {
405 name: 'PayrollManagement.create',
406 components: {
407 VueSelect,
408 // Base64Upload
409 },
410// computed: {
411// filtered: function () {
412// return this.payrollHistory.filter(i => i.ItemId == this.payroll.Id)
413// }
414// },
415 data () {
416 return {
417 // Scope, Sama kyk vm.users , vm.employee dkk
418 userData: {},
419 legalEntity: {},
420 branch: {},
421 supplier: {},
422 employee: [],
423 attendance: [],
424 level: [],
425 position: [],
426 warningLetter: [],
427 salaryComponent: [],
428 salaryComponentDetail: [],
429 payroll: {
430 detail: {
431 SalaryComponentId: null
432 }
433 },
434 selectedLegalEntity: {},
435 selectedBranch: {},
436 selectedEmployee: {},
437 detail: {},
438 }
439 },
440 beforeUpdate: function () {
441 // Ngeassign variable pada saat proses update, misal kyk dropdown
442 this.payroll.SellingPrice = this.payroll.Price100
443 this.payroll.LegalEntityId = this.selectedLegalEntity.Id
444 this.payroll.BranchId = this.selectedBranch.Id
445 this.payroll.EmployeeId = this.selectedEmployee.Id
446 },
447 mounted: function () {
448 // Sama dengan document.ready
449 window.$ = $
450 if(localStorage.userData !== undefined) {
451 this.userData = JSON.parse(localStorage.userData)
452 } else {
453 this.$router.push({ name: 'home' })
454 location.reload()
455 }
456 this.init()
457 },
458 methods: {
459 // Kumpulan Fungsi disini
460 init: async function() {
461 // Ngeload Data Dari API
462 let legalEntity = await LegalEntity.index()
463 let branch = await Branch.index()
464 let employee = await Employees.index()
465 let attendance = await Attendances.index()
466 let position = await Positions.index()
467 let level = await Levels.index()
468 let warningLetter = await WarningLetters.index()
469 let salaryComponent = await SalaryComponents.index()
470 let salaryComponentDetail = await SalaryComponentDetails.index()
471
472 // Assign data ke Scope
473 this.legalEntity = legalEntity.data
474 this.branch = branch.data
475 this.employee = employee.data
476 this.attendance = this.itemLookup(attendance.data)
477 this.position = this.itemLookup(position.data)
478 this.level = this.itemLookup(level.data)
479 this.warningLetter = this.itemLookup(warningLetter.data)
480 this.salaryComponent = this.itemLookup(salaryComponent.data)
481 this.salaryComponentDetail = salaryComponentDetail.data
482
483 this.payroll.TotalCalculation = 0
484
485 //for edit mode
486 if(this.$route.params.id) {
487 let edit = await Payrolls.detail(this.$route.params.id)
488 this.payroll = edit.data
489
490 this.selectedLegalEntity = this.lookupData(legalEntity.data, edit.data.LegalEntityId)
491 this.selectedBranch = this.lookupData(branch.data, edit.data.BranchId)
492 this.selectedEmployee = this.lookupData(employee.data, edit.data.EmployeeId)
493 }
494 },
495 save: async function() {
496 // Fungsi Save Data
497 this.payroll.IsDeleted = false
498 this.payroll.CreationTime = new Date()
499 this.payroll.CreatorUserId = this.userData.Id
500
501 console.log(this.payroll)
502 try {
503 let result
504 if(this.$route.params.id) {
505 result = await Payrolls.edit(this.$route.params.id, this.payroll)
506 }
507 if(!this.$route.params.id) {
508 result = await Payrolls.create(this.payroll)
509 }
510 if(result.status == 200) {
511 alert("input sukses")
512 this.$router.push({ name: 'PayrollManagement.index' })
513 location.reload()
514 } else {
515 alert("Registrasi Gagal")
516 console.log(result)
517 }
518 } catch (error) {
519 alert("Error : " + error)
520 }
521 },
522 onChangeImage1(file) {
523 this.payroll.Picture1 = file.base64
524 },
525 onChangeImage2(file) {
526 this.payroll.Picture2 = file.base64
527 },
528 itemLookup: function (json) {
529 let data = []
530 for(var i = 0; i< json.length; i++) {
531 data[json[i].Id] = json[i]
532 }
533 return data
534 },
535 lookupData (json, id) {
536 let data = []
537 for(var i = 0; i < json.length; i++) {
538 data[json[i].Id] = json[i]
539 }
540 return data[id]
541 },
542 calculate: function (employeeId, positionId, levelId) {
543 console.log(employeeId)
544 console.log(positionId)
545 console.log(levelId)
546 //Hitung Gaji Pokok
547 let gajipokok = 0
548 let gajilembur = 0
549 // let tunjanganwilayah = 0
550 // let tunjanganharian = 0
551 // let tunjanganjabatan = 0
552 // let tunjanganluarkota = 0
553 // let tunjanganharilibur = 0
554 // let bonussurvey = 0
555 // let bonusorder = 0
556 // let bonustarget = 0
557 // let bonusuangmuka = 0
558 // let bonustagihan = 0
559 // let bonusangsuran9 = 0
560 // let bonusoffreading = 0
561 // let bonusdealer = 0
562 // let bonusperakitan = 0
563 // let komisiangsuran = 0
564 // let suratdiskondealer = 0
565 // let komisiklaim = 0
566 // let komisiadmindangudang = 0
567 // let insentif = 0
568 // let sewaservicekolektor = 0
569 // let sewaserviceberatkolektor = 0
570 // let potonganketidakhadiran = 0
571 // let potonganklaim = 0
572 // let kartumasalah = 0
573 // let potongankomisi = 0
574 // let potongankasbon = 0
575 // let potongankartuangsuran = 0
576
577 for(var i = 0; i < this.salaryComponentDetail.length; i++) {
578 //Gaji Pokok
579 if(
580 (this.salaryComponentDetail[i].SalaryComponentId == 1) &&
581 //kondisi
582 (this.salaryComponentDetail[i].Amount !== undefined) &&
583 (this.salaryComponentDetail[i].PositionIds.toString().includes(positionId))
584 ) {
585 gajipokok += parseFloat(this.salaryComponentDetail[i].Amount)
586 }
587
588 //Gaji Lembur
589 if(
590 (this.salaryComponentDetail[i].SalaryComponentId == 2) &&
591 //kondisi
592 (this.salaryComponentDetail[i].Amount !== undefined) &&
593 (this.salaryComponentDetail[i].PositionIds.toString().includes(positionId))
594 ) {
595 gajilembur += parseFloat(this.salaryComponentDetail[i].Amount)
596 }
597
598 // //Tunjangan Wilayah
599 // if(
600 // (this.salaryComponentDetail[i].SalaryComponentId == 3) &&
601 // //kondisi
602 // (this.salaryComponentDetail[i].Amount !== undefined) &&
603 // (this.salaryComponentDetail[i].PositionIds.toString().includes(positionId))
604 // ) {
605 // tunjanganwilayah += parseFloat(this.salaryComponentDetail[i].Amount)
606 // }
607
608 // //Tunjangan Harian
609 // if(
610 // (this.salaryComponentDetail[i].SalaryComponentId == 4) &&
611 // //kondisi
612 // (this.salaryComponentDetail[i].Amount !== undefined) &&
613 // (this.salaryComponentDetail[i].PositionIds.toString().includes(positionId))
614 // ) {
615 // tunjanganharian += parseFloat(this.salaryComponentDetail[i].Amount)
616 // }
617
618 // //Tunjangan Jabatan
619 // if(
620 // (this.salaryComponentDetail[i].SalaryComponentId == 5) &&
621 // //kondisi
622 // (this.salaryComponentDetail[i].Amount !== undefined) &&
623 // (this.salaryComponentDetail[i].PositionIds.toString().includes(positionId))
624 // ) {
625 // tunjanganjabatan += parseFloat(this.salaryComponentDetail[i].Amount)
626 // }
627
628 // //Tunjangan Luar Kota
629 // if(
630 // (this.salaryComponentDetail[i].SalaryComponentId == 6) &&
631 // //kondisi
632 // (this.salaryComponentDetail[i].Amount !== undefined) &&
633 // (this.salaryComponentDetail[i].PositionIds.toString().includes(positionId))
634 // ) {
635 // tunjanganluarkota += parseFloat(this.salaryComponentDetail[i].Amount)
636 // }
637
638 // //Tunjangan Hari Libur
639 // if(
640 // (this.salaryComponentDetail[i].SalaryComponentId == 7) &&
641 // //kondisi
642 // (this.salaryComponentDetail[i].Amount !== undefined) &&
643 // (this.salaryComponentDetail[i].PositionIds.toString().includes(positionId))
644 // ) {
645 // tunjanganharilibur += parseFloat(this.salaryComponentDetail[i].Amount)
646 // }
647
648 // //Bonus Survey
649 // if(
650 // (this.salaryComponentDetail[i].SalaryComponentId == 8) &&
651 // //kondisi
652 // (this.salaryComponentDetail[i].Amount !== undefined) &&
653 // (this.salaryComponentDetail[i].PositionIds.toString().includes(positionId))
654 // ) {
655 // bonussurvey += parseFloat(this.salaryComponentDetail[i].Amount)
656 // }
657
658 // //Bonus Order
659 // if(
660 // (this.salaryComponentDetail[i].SalaryComponentId == 9) &&
661 // //kondisi
662 // (this.salaryComponentDetail[i].Amount !== undefined) &&
663 // (this.salaryComponentDetail[i].PositionIds.toString().includes(positionId))
664 // ) {
665 // bonusorder += parseFloat(this.salaryComponentDetail[i].Amount)
666 // }
667
668 // //Bonus Target
669 // if(
670 // (this.salaryComponentDetail[i].SalaryComponentId == 10) &&
671 // //kondisi
672 // (this.salaryComponentDetail[i].Amount !== undefined) &&
673 // (this.salaryComponentDetail[i].PositionIds.toString().includes(positionId))
674 // ) {
675 // bonustarget += parseFloat(this.salaryComponentDetail[i].Amount)
676 // }
677
678 // //Bonus Uang Muka
679 // if(
680 // (this.salaryComponentDetail[i].SalaryComponentId == 11) &&
681 // //kondisi
682 // (this.salaryComponentDetail[i].Amount !== undefined) &&
683 // (this.salaryComponentDetail[i].PositionIds.toString().includes(positionId))
684 // ) {
685 // bonusuangmuka += parseFloat(this.salaryComponentDetail[i].Amount)
686 // }
687
688 // //Bonus Tagihan
689 // if(
690 // (this.salaryComponentDetail[i].SalaryComponentId == 12) &&
691 // //kondisi
692 // (this.salaryComponentDetail[i].Amount !== undefined) &&
693 // (this.salaryComponentDetail[i].PositionIds.toString().includes(positionId))
694 // ) {
695 // bonustagihan += parseFloat(this.salaryComponentDetail[i].Amount)
696 // }
697
698 // //Bonus Angsuran ke-9
699 // if(
700 // (this.salaryComponentDetail[i].SalaryComponentId == 13) &&
701 // //kondisi
702 // (this.salaryComponentDetail[i].Amount !== undefined) &&
703 // (this.salaryComponentDetail[i].PositionIds.toString().includes(positionId))
704 // ) {
705 // bonusangsuran9 += parseFloat(this.salaryComponentDetail[i].Amount)
706 // }
707
708 // //Bonus Off Reading
709 // if(
710 // (this.salaryComponentDetail[i].SalaryComponentId == 14) &&
711 // //kondisi
712 // (this.salaryComponentDetail[i].Amount !== undefined) &&
713 // (this.salaryComponentDetail[i].PositionIds.toString().includes(positionId))
714 // ) {
715 // bonusoffreading += parseFloat(this.salaryComponentDetail[i].Amount)
716 // }
717
718 // //Bonus Dealer
719 // if(
720 // (this.salaryComponentDetail[i].SalaryComponentId == 15) &&
721 // //kondisi
722 // (this.salaryComponentDetail[i].Amount !== undefined) &&
723 // (this.salaryComponentDetail[i].PositionIds.toString().includes(positionId))
724 // ) {
725 // bonusdealer += parseFloat(this.salaryComponentDetail[i].Amount)
726 // }
727
728 // //Bonus Perakitan
729 // if(
730 // (this.salaryComponentDetail[i].SalaryComponentId == 16) &&
731 // //kondisi
732 // (this.salaryComponentDetail[i].Amount !== undefined) &&
733 // (this.salaryComponentDetail[i].PositionIds.toString().includes(positionId))
734 // ) {
735 // bonusperakitan += parseFloat(this.salaryComponentDetail[i].Amount)
736 // }
737
738 // //Komisi Angsuran
739 // if(
740 // (this.salaryComponentDetail[i].SalaryComponentId == 17) &&
741 // //kondisi
742 // (this.salaryComponentDetail[i].Amount !== undefined) &&
743 // (this.salaryComponentDetail[i].PositionIds.toString().includes(positionId))
744 // ) {
745 // komisiangsuran += parseFloat(this.salaryComponentDetail[i].Amount)
746 // }
747
748 // //Surat Diskon Dealer
749 // if(
750 // (this.salaryComponentDetail[i].SalaryComponentId == 18) &&
751 // //kondisi
752 // (this.salaryComponentDetail[i].Amount !== undefined) &&
753 // (this.salaryComponentDetail[i].PositionIds.toString().includes(positionId))
754 // ) {
755 // suratdiskondealer += parseFloat(this.salaryComponentDetail[i].Amount)
756 // }
757
758 // //Komisi Klaim
759 // if(
760 // (this.salaryComponentDetail[i].SalaryComponentId == 19) &&
761 // //kondisi
762 // (this.salaryComponentDetail[i].Amount !== undefined) &&
763 // (this.salaryComponentDetail[i].PositionIds.toString().includes(positionId))
764 // ) {
765 // komisiklaim += parseFloat(this.salaryComponentDetail[i].Amount)
766 // }
767
768 // //Komisi Admin dan Gudang
769 // if(
770 // (this.salaryComponentDetail[i].SalaryComponentId == 20) &&
771 // //kondisi
772 // (this.salaryComponentDetail[i].Amount !== undefined) &&
773 // (this.salaryComponentDetail[i].PositionIds.toString().includes(positionId))
774 // ) {
775 // komisiadmindangudang += parseFloat(this.salaryComponentDetail[i].Amount)
776 // }
777
778 // //Insentif
779 // if(
780 // (this.salaryComponentDetail[i].SalaryComponentId == 21) &&
781 // //kondisi
782 // (this.salaryComponentDetail[i].Amount !== undefined) &&
783 // (this.salaryComponentDetail[i].PositionIds.toString().includes(positionId))
784 // ) {
785 // insentif += parseFloat(this.salaryComponentDetail[i].Amount)
786 // }
787
788 // //Sewa service kolektor
789 // if(
790 // (this.salaryComponentDetail[i].SalaryComponentId == 22) &&
791 // //kondisi
792 // (this.salaryComponentDetail[i].Amount !== undefined) &&
793 // (this.salaryComponentDetail[i].PositionIds.toString().includes(positionId))
794 // ) {
795 // sewaservicekolektor += parseFloat(this.salaryComponentDetail[i].Amount)
796 // }
797
798 // //Sewa service berat kolektor
799 // if(
800 // (this.salaryComponentDetail[i].SalaryComponentId == 23) &&
801 // //kondisi
802 // (this.salaryComponentDetail[i].Amount !== undefined) &&
803 // (this.salaryComponentDetail[i].PositionIds.toString().includes(positionId))
804 // ) {
805 // sewaserviceberatkolektor += parseFloat(this.salaryComponentDetail[i].Amount)
806 // }
807
808 // //Potongan Ketidakhadiran
809 // if(
810 // (this.salaryComponentDetail[i].SalaryComponentId == 24) &&
811 // //kondisi
812 // (this.salaryComponentDetail[i].Amount !== undefined) &&
813 // (this.salaryComponentDetail[i].PositionIds.toString().includes(positionId))
814 // ) {
815 // potonganketidakhadiran += parseFloat(this.salaryComponentDetail[i].Amount)
816 // }
817
818 // //Potongan Klaim
819 // if(
820 // (this.salaryComponentDetail[i].SalaryComponentId == 25) &&
821 // //kondisi
822 // (this.salaryComponentDetail[i].Amount !== undefined) &&
823 // (this.salaryComponentDetail[i].PositionIds.toString().includes(positionId))
824 // ) {
825 // potonganklaim += parseFloat(this.salaryComponentDetail[i].Amount)
826 // }
827
828 // //Kartu Masalah
829 // if(
830 // (this.salaryComponentDetail[i].SalaryComponentId == 26) &&
831 // //kondisi
832 // (this.salaryComponentDetail[i].Amount !== undefined) &&
833 // (this.salaryComponentDetail[i].PositionIds.toString().includes(positionId))
834 // ) {
835 // kartumasalah += parseFloat(this.salaryComponentDetail[i].Amount)
836 // }
837
838 // //Potongan Komisi
839 // if(
840 // (this.salaryComponentDetail[i].SalaryComponentId == 27) &&
841 // //kondisi
842 // (this.salaryComponentDetail[i].Amount !== undefined) &&
843 // (this.salaryComponentDetail[i].PositionIds.toString().includes(positionId))
844 // ) {
845 // potongankomisi += parseFloat(this.salaryComponentDetail[i].Amount)
846 // }
847
848 // //Potongan Kasbon
849 // if(
850 // (this.salaryComponentDetail[i].SalaryComponentId == 28) &&
851 // //kondisi
852 // (this.salaryComponentDetail[i].Amount !== undefined) &&
853 // (this.salaryComponentDetail[i].PositionIds.toString().includes(positionId))
854 // ) {
855 // potongankasbon += parseFloat(this.salaryComponentDetail[i].Amount)
856 // }
857
858 // //Potongan Kartu Angsuran
859 // if(
860 // (this.salaryComponentDetail[i].SalaryComponentId == 29) &&
861 // //kondisi
862 // (this.salaryComponentDetail[i].Amount !== undefined) &&
863 // (this.salaryComponentDetail[i].PositionIds.toString().includes(positionId))
864 // ) {
865 // potongankartuangsuran += parseFloat(this.salaryComponentDetail[i].Amount)
866 // }
867 }
868 this.payroll.TotalCalculation = parseFloat(gajipokok) + parseFloat(gajilembur)
869 console.log(this.payroll)
870 },
871 formatDate(time) {
872 // Format Tanggal
873 var formattedTime = moment(time).format('DD MMMM YYYY HH:mm')
874 if(formattedTime == 'Invalid date') {
875 formattedTime = '-'
876 }
877 return formattedTime
878 },
879 // payrollGajiPokok: function(Y, L, P, J, JP, JT, JJT, TT, K, GPN, SP) {
880 // let GP = 0
881 // if(Y == 'Staff Marketing') {
882 // if((L<30) && (P <20)) {
883 // GP = (K/J) * GPN
884 // } else if((L>30) || (P >=20)) {
885 // GP = GPN
886 // } else if(SP == 3) {
887 // GP = (JP / TP) * GPN
888 // } else if(SP == 4) {
889 // GP = (JJT / TT) * GPN
890 // }
891 // } else if(Y == 'Freelance') {
892 // X = 13.5/100
893 // if(P<36) {
894 // GP = X * P
895 // } else if(P>=36) {
896 // GP = GPN
897 // }
898 // } else {
899 // GP = GPN
900 // }
901 // return GP
902 // },
903 // payrollLembur: function(Y, WL) {
904 // let GL = 0
905 // let JL1 = 4000
906 // let JL2 = 6000
907 // if((Y == 'Administrasi') || (Y == 'Staff Gudang') || (Y == 'Kepala Gudang') || (Y == 'Driver Gudang')) {
908 // if(WL < 3) {
909 // GL = JL1 * WL
910 // } else if(WL >= 3) {
911 // GL = JL2 * WL
912 // }
913 // }
914 // return GL
915 // },
916 // payrollTunjanganWilayah: function(PR, Y, PT, L) {
917 // let TW = 0
918 // if(PR == 'Citra Pesona') {
919 // if((Y == 'Tim Demo') && (PT >= 486)) {
920 // TW = 380000
921 // } else if((Y == 'Tim Demo') && (PT < 486)) {
922 // TW = 190000
923 // } else if((Y == 'Administrasi') && (L >= 12)) {
924 // TW = 430000
925 // } else if((Y == 'Administrasi') && (L < 12)) {
926 // TW = 215000
927 // } else if(((Y == 'Staff Gudang') || (Y == 'Koordinator Gudang')) && (L >= 12)) {
928 // TW = 330000
929 // } else if(((Y == 'Staff Gudang') || (Y == 'Koordinator Gudang')) && (L < 12)) {
930 // TW = 165000
931 // }
932 // }
933 // },
934 }
935}
936</script>
937
938<style>
939.card-header {
940 width: 1620px;
941 background-color: #20c197;
942 border-radius: 0px !important;
943 padding-left: 10px;
944 padding-top: 0px;
945 padding-right: 0px;
946 padding-bottom: 0px;
947}
948
949.nav-pills .nav-link.active, .nav-pills .show>.nav-link {
950 color: black;
951 background-color: #f8f8ff;
952 border-radius: 0px;
953 border-bottom: 3px solid #0059aa;
954}
955
956.button-div {
957 text-align: right;
958 margin-top: 30px;
959}
960
961.btn-success {
962 width: 132px;
963 background-color: #20c197;
964 border: none;
965}
966
967.btn-danger {
968 width: 132px;
969 margin-left: 15px;
970 border: none;
971}
972
973.disabled-field {
974 background-color: #E9ECEF;
975 border: 1px solid black;
976}
977</style>