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-15 10:12:52 +08:00
parent b5fe9c4824
commit ced04a4f68
7 changed files with 4666 additions and 434 deletions
Download Patch File Download Diff File Expand all files Collapse all files
package-lock.json
Generated
+15 -2
View File
@@ -3040,6 +3040,11 @@
"type": "^1.0.1"
}
},
"date-fns": {
"version": "1.30.1",
"resolved": "https://registry.npmjs.org/date-fns/-/date-fns-1.30.1.tgz",
"integrity": "sha512-hBSVCvSmWC+QypYObzwGOd9wqdDpOt+0wl0KbU+R+uuZBS1jN8VsD1ss3irQDknRj5NvxiTF6oj/nDRnN/UQNw=="
},
"de-indent": {
"version": "1.0.2",
"resolved": "https://registry.npmjs.org/de-indent/-/de-indent-1.0.2.tgz",
@@ -7432,8 +7437,7 @@
"vue": {
"version": "2.6.14",
"resolved": "https://registry.npmjs.org/vue/-/vue-2.6.14.tgz",
"integrity": "sha512-x2284lgYvjOMj3Za7kqzRcUSxBboHqtgRE2zlos1qWaOye5yUmHn42LB1250NJBLRwEcdrB0JRwyPTEPhfQjiQ==",
"dev": true
"integrity": "sha512-x2284lgYvjOMj3Za7kqzRcUSxBboHqtgRE2zlos1qWaOye5yUmHn42LB1250NJBLRwEcdrB0JRwyPTEPhfQjiQ=="
},
"vue-apexcharts": {
"version": "1.6.2",
@@ -7510,6 +7514,15 @@
"resolved": "https://registry.npmjs.org/vue-toastification/-/vue-toastification-1.7.14.tgz",
"integrity": "sha512-khZR8t3NWZ/JJ2MZxXLbesHrRJ8AKa75PY5Zq8yMifF9x8lHq8ljYkC0d2PD9yahooygQB5tcFyRDkbbIPx8hw=="
},
"vuejs-datetimepicker": {
"version": "1.1.13",
"resolved": "https://registry.npmjs.org/vuejs-datetimepicker/-/vuejs-datetimepicker-1.1.13.tgz",
"integrity": "sha512-R7UtjXqRpqLnUk9uSiAmWXk64hFFfpoGDRiFLVGORU/ptSQRPh0KhfBwoe1ED7EeCQBAP8dXRh14n8RmfC6m1g==",
"requires": {
"date-fns": "^1.29.0",
"vue": "^2.3.3"
}
},
"vuelidate": {
"version": "0.7.7",
"resolved": "https://registry.npmjs.org/vuelidate/-/vuelidate-0.7.7.tgz",
package.json
+1
View File
@@ -42,6 +42,7 @@
"vue-property-decorator": "^9.1.2",
"vue-router": "^3.5.3",
"vue-toastification": "^1.7.14",
"vuejs-datetimepicker": "^1.1.13",
"vuelidate": "^0.7.7"
}
}
public/js/app.js
Vendored
+4464 -408
View File
File diff suppressed because it is too large Load Diff
resources/js/Online/SearchSAG.vue
+49 -16
View File
@@ -1,6 +1,8 @@
<template>
<div>
<modal ref="modal" @togtable="toggleTable"></modal>
<div class="container w-full max-w-xl mx-auto mt-10 px-4 font-sans">
<form class="bg-white w-full shadow-md rounded-lg px-8 pt-6 pb-4 mb-4" onclick="return false">
<div class="mb-4 w-96 mx-auto">
@@ -19,7 +21,6 @@
</form>
</div>
<div class="mx-auto hidden" id="divtable">
<table class="min-w-full leading-normal">
<thead class="text-center">
@@ -57,7 +58,7 @@
</tr>
</thead>
<tbody>
<tr v-for="(cust,i) in arrayCustomer" :key="i" >
<tr v-for="(cust,i) in arrayCustomer" :key="i" class="text-center">
<td class="px-5 py-5 border-b border-gray-200 bg-white text-sm">
<div class="flex items-center">
<div class="ml-3">
@@ -125,7 +126,16 @@
<div class="flex items-center">
<div class="ml-3">
<p class="text-gray-900 whitespace-no-wrap">
{{ cust.status }}
<span v-if="cust.status === 'PAID'" class="inlint-block mr-1 last:mr-0 py-1 px-2 rounded bg-green-200 text-xs font-semibold text-green-600 uppercase">
{{ cust.status }}
</span>
<span v-if="cust.status === 'NOT PAID'" class="inlint-block mr-1 last:mr-0 py-1 px-2 rounded bg-yellow-200 text-xs font-semibold text-yellow-600 uppercase">
{{ cust.status }}
</span>
<span v-if="cust.status === 'UNSUCCESSFUL'" class="inlint-block mr-1 last:mr-0 py-1 px-2 rounded bg-red-200 text-xs font-semibold text-red-600 uppercase">
{{ cust.status }}
</span>
</p>
</div>
</div>
@@ -142,11 +152,17 @@
<td class="px-5 py-5 border-b border-gray-200 bg-white text-sm">
<div class="flex items-center">
<div class="ml-3">
<button class="border border-yellow-600 text-yellow-600 font-montserrat py-2 px-4 font-medium rounded-xl hover:bg-yellow-600 hover:text-white transition-all duration-300"><svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" fill="currentColor" class="bi bi-card-checklist" viewBox="0 0 16 16">
<button v-if="cust.status !== 'NOT PAID'" class="border border-gray-600 text-gray-600 font-montserrat py-2 px-4 font-medium rounded-xl transition-all duration-300"><svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" fill="currentColor" class="bi bi-card-checklist" viewBox="0 0 16 16">
<path d="M14.5 3a.5.5 0 0 1 .5.5v9a.5.5 0 0 1-.5.5h-13a.5.5 0 0 1-.5-.5v-9a.5.5 0 0 1 .5-.5h13zm-13-1A1.5 1.5 0 0 0 0 3.5v9A1.5 1.5 0 0 0 1.5 14h13a1.5 1.5 0 0 0 1.5-1.5v-9A1.5 1.5 0 0 0 14.5 2h-13z"/>
<path d="M7 5.5a.5.5 0 0 1 .5-.5h5a.5.5 0 0 1 0 1h-5a.5.5 0 0 1-.5-.5zm-1.496-.854a.5.5 0 0 1 0 .708l-1.5 1.5a.5.5 0 0 1-.708 0l-.5-.5a.5.5 0 1 1 .708-.708l.146.147 1.146-1.147a.5.5 0 0 1 .708 0zM7 9.5a.5.5 0 0 1 .5-.5h5a.5.5 0 0 1 0 1h-5a.5.5 0 0 1-.5-.5zm-1.496-.854a.5.5 0 0 1 0 .708l-1.5 1.5a.5.5 0 0 1-.708 0l-.5-.5a.5.5 0 0 1 .708-.708l.146.147 1.146-1.147a.5.5 0 0 1 .708 0z"/>
</svg>
</button>
<button v-else @click="tekanmodal(cust.id)" class="border border-yellow-600 text-yellow-600 font-montserrat py-2 px-4 font-medium rounded-xl hover:bg-yellow-600 hover:text-white transition-all duration-300"><svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" fill="currentColor" class="bi bi-card-checklist" viewBox="0 0 16 16">
<path d="M14.5 3a.5.5 0 0 1 .5.5v9a.5.5 0 0 1-.5.5h-13a.5.5 0 0 1-.5-.5v-9a.5.5 0 0 1 .5-.5h13zm-13-1A1.5 1.5 0 0 0 0 3.5v9A1.5 1.5 0 0 0 1.5 14h13a1.5 1.5 0 0 0 1.5-1.5v-9A1.5 1.5 0 0 0 14.5 2h-13z"/>
<path d="M7 5.5a.5.5 0 0 1 .5-.5h5a.5.5 0 0 1 0 1h-5a.5.5 0 0 1-.5-.5zm-1.496-.854a.5.5 0 0 1 0 .708l-1.5 1.5a.5.5 0 0 1-.708 0l-.5-.5a.5.5 0 1 1 .708-.708l.146.147 1.146-1.147a.5.5 0 0 1 .708 0zM7 9.5a.5.5 0 0 1 .5-.5h5a.5.5 0 0 1 0 1h-5a.5.5 0 0 1-.5-.5zm-1.496-.854a.5.5 0 0 1 0 .708l-1.5 1.5a.5.5 0 0 1-.708 0l-.5-.5a.5.5 0 0 1 .708-.708l.146.147 1.146-1.147a.5.5 0 0 1 .708 0z"/>
</svg>
</button>
</div>
</div>
</td>
@@ -159,13 +175,18 @@
</template>
<script>
import { createPopper } from "@popperjs/core";
import { createPopper } from "@popperjs/core"
import modal from '../components/util/ModalTransaction'
const formatter = new Intl.NumberFormat('en-US', {
minimumFractionDigits: 2
});
export default{
components: {
modal
},
props: {
placement: {
type: String,
@@ -180,21 +201,23 @@ export default{
}
},
methods: {
toggleTable : function() {
async toggleTable() {
let res = this.getData()
let res = await this.getData()
let divtable = document.getElementById("divtable");
console.log(res)
if(res === 'ada')
if(res !== 'tiada')
{
if(this.arrayCustomer.length > 0)
{
divtable.classList.remove("hidden");
}else{
this.$toast.warning("Tiada data dijumpai");
divtable.classList.add("hidden");
}
}else{
this.$toast.info("Sila masukkan value dalam box");
divtable.classList.add("hidden");
}
@@ -202,24 +225,28 @@ export default{
},
getData: function() {
let inputvalue = document.getElementById("frminput").value;
if(inputvalue)
{
this.axios.get('http://localhost:8000/admin/searchSAGOnline', {
return this.axios.get('http://localhost:8000/admin/searchSAGOnline', {
params: {
norujukan: inputvalue
}
}).then(response => {
this.arrayCustomer = response.data
if(response.data)
{
return 'ada'
}
if(response.data.length > 0)
{
this.arrayCustomer = response.data
}
else{
this.arrayCustomer = []
}
}).catch(error => {
console.log(error)
})
}else{
return 'tiada'
@@ -228,6 +255,12 @@ export default{
},
hasNumber: function(inputString){
return /\d/.test(inputString);
},
tekanmodal: function(statusid){
console.log('tekan')
this.$refs.modal.showModal = true;
this.$refs.modal.statusid = statusid;
}
}
resources/js/app.js
Vendored
+3 -1
View File
@@ -16,6 +16,7 @@ import Toast from "vue-toastification"
import "vue-toastification/dist/index.css"
import router from './routes'
import Vuelidate from 'vuelidate'
import datetime from 'vuejs-datetimepicker';
require('./bootstrap');
@@ -25,7 +26,7 @@ window.Alpine = Alpine;
const options = {
transition: "Vue-Toastification__fade",
position: "bottom-center",
position: "top-right",
timeout: 2000,
closeOnClick: true,
maxToasts: 20,
@@ -46,6 +47,7 @@ Vue.use(VueAxios, axios)
Vue.component('jw-pagination', JwPagination)
Vue.use(createPopper)
Vue.use(Toast, options)
Vue.use(datetime)
Alpine.start()
resources/js/components/util/ModalTransaction.vue
+105
View File
@@ -0,0 +1,105 @@
<template>
<div>
<div v-if="showModal" class="overflow-x-hidden overflow-y-auto fixed inset-0 z-50 outline-none focus:outline-none justify-center items-center flex">
<div class="relative w-auto my-6 mx-auto max-w-6xl">
<!--content-->
<div class="border-0 rounded-lg shadow-lg relative flex flex-col w-full bg-white outline-none focus:outline-none">
<!--header-->
<div class="flex items-start bg-gray-200 justify-between p-5 border-b border-solid border-blueGray-200 rounded-t">
<h3 class="text-xl font-semibold">
Penukaran Status Bayaran Online
</h3>
<button class="p-1 ml-auto border-0 text-black opacity-5 float-right text-3xl leading-none font-semibold outline-none focus:outline-none" v-on:click="toggleModal()">
<span class=" text-black opacity-5 h-6 w-6 text-2xl block outline-none focus:outline-none">
X
</span>
</button>
</div>
<!--body-->
<div class="relative p-6 flex-auto">
<label class="block uppercase tracking-wide text-gray-700 text-xs font-bold mb-2">
Status
</label>
<div class="relative">
<select v-model="referencestatus" class="block appearance-none w-full bg-gray-200 border border-gray-200 text-gray-700 py-3 px-4 pr-8 rounded leading-tight focus:outline-none focus:bg-white focus:border-gray-500">
<option v-for="(stat,i) in status" :key="i">{{ stat }}</option>
</select>
<div class="pointer-events-none absolute inset-y-0 right-0 flex items-center px-2 text-gray-700">
<svg class="fill-current h-4 w-4" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 20 20"><path d="M9.293 12.95l.707.707L15.657 8l-1.414-1.414L10 10.828 5.757 6.586 4.343 8z"/></svg>
</div>
</div>
<label class="block uppercase tracking-wide text-gray-700 text-xs font-bold mb-2 mt-3">
Paid at
</label>
<datetime format="YYYY-MM-DD h:i:s" width="300px" v-model="datepaidat" class="appearance-none block w-full bg-white text-gray-700 border border-gray-200 rounded py-3 px-4 leading-tight focus:outline-none focus:bg-white focus:border-gray-500"></datetime>
</div>
<!--footer-->
<div class="flex items-center justify-end p-6 border-t border-solid border-blueGray-200 rounded-b">
<button class="bg-gray-500 hover:bg-gray-700 text-white font-bold py-2 px-4 border border-gray-700 rounded mr-1" type="button" v-on:click="toggleModal()">
Batal
</button>
<button class="bg-blue-500 hover:bg-blue-700 text-white font-bold py-2 px-4 border border-blue-700 rounded" type="button" v-on:click="simpan()">
Kemaskini
</button>
</div>
</div>
</div>
</div>
<div v-if="showModal" class="opacity-25 fixed inset-0 z-40 bg-black"></div>
</div>
</template>
<script>
import datetime from 'vuejs-datetimepicker';
export default {
name: "modal",
components:{
datetime
},
data() {
return {
showModal: false,
referencestatus: 'NOT PAID',
status: [
'PAID',
'UNSUCCESSFUL',
'NOT PAID'
],
statusid: 0,
datepaidat:''
}
},
methods: {
toggleModal: function(){
this.showModal = !this.showModal;
},
async simpan(){
let response = await this.postData()
if(response.data === 1)
{
this.showModal = !this.showModal;
this.$toast.success('Berjaya menukar status!')
setTimeout(()=>{
this.$emit('togtable')
},1000);
}
},
postData: function(){
return this.axios.post('http://localhost:8000/admin/simpanStatus',
{
id: this.statusid,
status: this.referencestatus,
paidat: this.datepaidat
});
}
}
}
</script>
resources/js/pages/Detailspelanggan.vue
+29 -7
View File
@@ -47,7 +47,6 @@
Alamat
</label>
<textarea :class="{ 'border border-red-500 focus:border-red-500': $v.name.$error }" class="h-32 appearance-none block w-full bg-gray-200 text-gray-700 border border-gray-200 rounded py-3 px-4 mb-3 leading-tight focus:outline-none focus:bg-white focus:border-gray-500" v-model.trim="$v.alamat.$model" type="password"></textarea>
<p class="text-gray-600 text-xs italic">Make it as long and as crazy as you'd like</p>
</div>
<div class="w-full md:w-1/3 px-3">
<div class="flex flex-wrap -mx-3 mb-6">
@@ -56,20 +55,20 @@
Poskod
</label>
<div class="relative">
<input :class="{ 'border border-red-500 focus:border-red-500': $v.name.$error }" class="appearance-none block w-full bg-gray-200 text-gray-700 border border-gray-200 rounded py-3 px-4 leading-tight focus:outline-none focus:bg-white focus:border-gray-500" v-model.trim="$v.poskod.$model" type="text" placeholder="90210">
<input :class="{ 'border border-red-500 focus:border-red-500': $v.name.$error }" class="appearance-none block w-full bg-gray-200 text-gray-700 border border-gray-200 rounded py-3 px-4 leading-tight focus:outline-none focus:bg-white focus:border-gray-500" v-model.trim="$v.poskod.$model" type="text" placeholder="90210" @change="triggerPoskod($event.target.value)">
</div>
<label class="block uppercase tracking-wide text-gray-700 text-xs font-bold mb-2 mt-2">
Daerah
</label>
<div class="relative">
<input :class="{ 'border border-red-500 focus:border-red-500': $v.name.$error }" class="appearance-none block w-full bg-gray-200 text-gray-700 border border-gray-200 rounded py-3 px-4 leading-tight focus:outline-none focus:bg-white focus:border-gray-500" v-model.trim="$v.koddaerah.$model" type="text" placeholder="Albuquerque">
<input readonly :class="{ 'border border-red-500 focus:border-red-500': $v.name.$error }" class="appearance-none block w-full bg-gray-200 text-gray-700 border border-gray-200 rounded py-3 px-4 leading-tight focus:outline-none focus:border-gray-500" v-model.trim="$v.koddaerah.$model" type="text" placeholder="Albuquerque">
</div>
</div>
<div class="md:w-1/2 pl-2">
<label class="block uppercase tracking-wide text-gray-700 text-xs font-bold mb-2">
Negeri
</label>
<input class="appearance-none block w-full bg-gray-200 text-gray-700 border border-gray-200 rounded py-3 px-4 leading-tight focus:outline-none focus:bg-white focus:border-gray-500" v-model.trim="$v.kodnegeri.$model" type="text" placeholder="Albuquerque">
<input readonly class="appearance-none block w-full bg-gray-200 text-gray-700 border border-gray-200 rounded py-3 px-4 leading-tight focus:outline-none focus:border-gray-500" v-model.trim="$v.kodnegeri.$model" type="text" placeholder="Albuquerque">
</div>
</div>
</div>
@@ -78,7 +77,6 @@
Nota
</label>
<textarea class="h-32 appearance-none block w-full bg-gray-200 text-gray-700 border border-gray-200 rounded py-3 px-4 mb-3 leading-tight focus:outline-none focus:bg-white focus:border-gray-500" v-model.trim="$v.nota.$model" type="password"></textarea>
<p class="text-gray-600 text-xs italic">Make it as long and as crazy as you'd like</p>
</div>
</div>
@@ -88,8 +86,10 @@
<a class="inline-block align-baseline font-bold text-sm text-blue-500 hover:text-blue-800" href="#">
</a>
<button class="bg-blue-500 hover:bg-blue-700 text-white font-bold py-2 px-4 rounded focus:outline-none focus:shadow-outline" type="button">
Kemaskini
<span v-if="submitStatus === 'PENDING'"><i class="animate-spin fas fa-spinner mr-2"></i>Loading..</span>
<span v-else @click="submit">Kemaskini</span>
</button>
</div>
</form>
@@ -116,7 +116,8 @@ export default {
nota: this.customer.nota,
poskod: this.customer.poskod,
koddaerah: '',
kodnegeri: ''
kodnegeri: '',
submitStatus: ''
}
},
setup: (props, context) => {
@@ -137,6 +138,27 @@ export default {
this.koddaerah = response.data.namadaerah
});
},
triggerPoskod: function(value){
this.axios.get('http://localhost:8000/api/poskod/' + value).then(response => {
this.koddaerahCall(response.data.kodnegeri,response.data.koddaerah)
});
},
submit() {
console.log('submit!')
this.$v.$touch()
if (this.$v.$invalid) {
// this.submitStatus = 'ERROR'
this.$toast.error('Sila isi butiran yang disediakan dengan betul!')
} else {
// do your submit logic here
this.submitStatus = 'PENDING'
setTimeout(() => {
this.submitStatus = 'OK'
this.$toast.success('Berjaya dikemaskini!')
}, 500)
}
}
},
validations: {