1382 lines
57 KiB
JavaScript
1382 lines
57 KiB
JavaScript
|
globalThis.Properti = {
|
||
|
|
content: `
|
||
|
|
<style>
|
||
|
|
|
||
|
|
body { margin: 0; padding: 0; }
|
||
|
|
#map { position: absolute; top: 0; bottom: 0; width: 100%; }
|
||
|
|
|
||
|
|
#info {
|
||
|
|
display: table;
|
||
|
|
position: relative;
|
||
|
|
margin: 0px auto;
|
||
|
|
word-wrap: anywhere;
|
||
|
|
white-space: pre-wrap;
|
||
|
|
padding: 10px;
|
||
|
|
border: none;
|
||
|
|
border-radius: 3px;
|
||
|
|
font-size: 12px;
|
||
|
|
text-align: center;
|
||
|
|
color: #222;
|
||
|
|
background: #fff;
|
||
|
|
}
|
||
|
|
|
||
|
|
</style>
|
||
|
|
<div class="row">
|
||
|
|
<!-- Earnings (Monthly) Card Example -->
|
||
|
|
<div class="col-12 col-12">
|
||
|
|
<div class="card shadow h-100 py-2">
|
||
|
|
<div class="card-body" id="load-properti">
|
||
|
|
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
|
||
|
|
|
||
|
|
`,
|
||
|
|
action: function(){
|
||
|
|
|
||
|
|
|
||
|
|
// function cek rating
|
||
|
|
|
||
|
|
|
||
|
|
|
||
|
|
|
||
|
|
const capitalize = (str, lower = false) =>
|
||
|
|
(lower ? str.toLowerCase() : str).replace(/(?:^|\s|["'([{])+\S/g, match => match.toUpperCase());
|
||
|
|
;
|
||
|
|
if (dataMaster['provinces'] != undefined && dataMaster['regencies'] != undefined) {
|
||
|
|
dataMaster['provinces'] = dataMaster['provinces'].map(function(xz, i) {
|
||
|
|
var x = xz;
|
||
|
|
x.name = capitalize(xz.name.toLowerCase());
|
||
|
|
return x;
|
||
|
|
})
|
||
|
|
|
||
|
|
dataMaster['regencies'] = dataMaster['regencies'].map(function(xz, i) {
|
||
|
|
var x = xz;
|
||
|
|
|
||
|
|
var y = dataMaster['provinces'].filter(function(k,l){
|
||
|
|
if(x.province_id == k.id){
|
||
|
|
return k
|
||
|
|
}
|
||
|
|
})
|
||
|
|
if (y.length > 0) {
|
||
|
|
y = y[0].name;
|
||
|
|
x.province_id = y;
|
||
|
|
x.name = capitalize(xz.name.toLowerCase());
|
||
|
|
return x;
|
||
|
|
}else{
|
||
|
|
return x;
|
||
|
|
}
|
||
|
|
})
|
||
|
|
}else{
|
||
|
|
var prov = new db;
|
||
|
|
prov.table('province').get(function(pr){
|
||
|
|
dataMaster['provinces'] = pr;
|
||
|
|
var reg = new db;
|
||
|
|
reg.table('regencies').get(function(re){
|
||
|
|
dataMaster['regencies'] = re;
|
||
|
|
|
||
|
|
dataMaster['provinces'] = dataMaster['provinces'].map(function(xz, i) {
|
||
|
|
var x = xz;
|
||
|
|
x.name = capitalize(xz.name.toLowerCase());
|
||
|
|
return x;
|
||
|
|
})
|
||
|
|
|
||
|
|
dataMaster['regencies'] = dataMaster['regencies'].map(function(xz, i) {
|
||
|
|
var x = xz;
|
||
|
|
|
||
|
|
var y = dataMaster['provinces'].filter(function(k,l){
|
||
|
|
if(x.province_id == k.id){
|
||
|
|
return k
|
||
|
|
}
|
||
|
|
})[0].name;
|
||
|
|
x.province_id = y;
|
||
|
|
x.name = capitalize(xz.name.toLowerCase());
|
||
|
|
return x;
|
||
|
|
})
|
||
|
|
|
||
|
|
|
||
|
|
})
|
||
|
|
|
||
|
|
})
|
||
|
|
|
||
|
|
}
|
||
|
|
|
||
|
|
console.log(
|
||
|
|
globalThis.dataMaster['kategori']
|
||
|
|
)
|
||
|
|
|
||
|
|
globalThis.dataMaster['transaksi'] = [
|
||
|
|
{kode: 'JUAL', name: 'JUAL'},
|
||
|
|
{kode: 'SEWA', name: 'SEWA'},
|
||
|
|
{kode: 'PROYEK BARU', name: 'PROYEK BARU'}
|
||
|
|
];
|
||
|
|
|
||
|
|
globalThis.dataMaster['laku'] = [
|
||
|
|
{kode: '0', name: 'Belum Laku'},
|
||
|
|
{kode: '1', name: 'Laku'}
|
||
|
|
];
|
||
|
|
|
||
|
|
globalThis.dataMaster['yorn'] = [
|
||
|
|
{kode: '0', name: 'Tidak'},
|
||
|
|
{kode: '1', name: 'Ya'}
|
||
|
|
];
|
||
|
|
|
||
|
|
globalThis.dataMaster['aorn'] = [
|
||
|
|
{kode: '0', name: 'Tidak Ada'},
|
||
|
|
{kode: '1', name: 'Ada'}
|
||
|
|
];
|
||
|
|
|
||
|
|
globalThis.dataMaster['sertifikat'] = [
|
||
|
|
{kode: 'Tidak Ditampilkan', name: 'Tidak Ditampilkan'},
|
||
|
|
{kode: 'SHM', name: 'SHM'},
|
||
|
|
{kode: 'HGB', name: 'HGB'},
|
||
|
|
{kode: 'SHGB', name: 'SHSRS'},
|
||
|
|
{kode: 'PPJB', name: 'PPJB'},
|
||
|
|
{kode: 'PPJB', name: 'Tanah Girik'},
|
||
|
|
{kode: 'Petok D', name: 'Petok D'},
|
||
|
|
{kode: 'Petok D', name: 'Hak Pakai '}
|
||
|
|
];
|
||
|
|
|
||
|
|
globalThis.dataMaster['hadap'] = [
|
||
|
|
{name: 'Utara'},
|
||
|
|
{name: 'Selatan'},
|
||
|
|
{name: 'Barat'},
|
||
|
|
{name: 'Timur'},
|
||
|
|
{name: 'Barat Laut'},
|
||
|
|
{name: 'Timur Laut'},
|
||
|
|
{name: 'Tenggara'},
|
||
|
|
{name: 'Barat daya'},
|
||
|
|
{name: 'Utara & Barat'},
|
||
|
|
{name: 'Utara & Timur'},
|
||
|
|
{name: 'Selatan & Barat'},
|
||
|
|
{name: 'Selatan & Timur'}
|
||
|
|
];
|
||
|
|
|
||
|
|
|
||
|
|
globalThis.dataMaster['air'] = [
|
||
|
|
{name: 'PDAM'},
|
||
|
|
{name: 'Sumur'},
|
||
|
|
{name: 'WTP'},
|
||
|
|
{name: 'Artesis'}
|
||
|
|
];
|
||
|
|
|
||
|
|
setTimeout(function(){
|
||
|
|
document.getElementById('app-content-title').innerText = "Data Properti";
|
||
|
|
table('properti')
|
||
|
|
.title('Properti')
|
||
|
|
.grouping({
|
||
|
|
"col-lg-6": [
|
||
|
|
{
|
||
|
|
start: 'judulproperti',
|
||
|
|
end: 'ltanah'
|
||
|
|
},
|
||
|
|
{
|
||
|
|
start: 'listrik',
|
||
|
|
end: 'share'
|
||
|
|
}
|
||
|
|
]
|
||
|
|
})
|
||
|
|
.equals(['idprop'])
|
||
|
|
.selectAction(function(s, v, r){
|
||
|
|
if(v == 'city_name'){
|
||
|
|
document.getElementById('province').innerHTML = `<option value="${s.data.province_id}">${s.data.province_id}</option>`;
|
||
|
|
}else if(v == 'kecamatan'){
|
||
|
|
var name = globalThis.dataMaster['regencies'].filter(function(t){
|
||
|
|
if(t.id == s.data.regencies){
|
||
|
|
return t
|
||
|
|
}
|
||
|
|
});
|
||
|
|
if(name.length > 0){
|
||
|
|
name = name[0];
|
||
|
|
var op = `<option value="${name.name}">${name.name}</option>`;
|
||
|
|
document.getElementById('city_name').innerHTML = op;
|
||
|
|
|
||
|
|
var namep = globalThis.dataMaster['regencies'].filter(function(t){
|
||
|
|
if(t.name == name.name){
|
||
|
|
return t
|
||
|
|
}
|
||
|
|
});
|
||
|
|
|
||
|
|
if(namep.length > 0){
|
||
|
|
namep = namep[0];
|
||
|
|
var op = `<option value="${namep.province_id}">${namep.province_id}</option>`;
|
||
|
|
document.getElementById('province').innerHTML = op;
|
||
|
|
}
|
||
|
|
|
||
|
|
}
|
||
|
|
}else if(v == 'subdistrict_name'){
|
||
|
|
console.log(s);
|
||
|
|
|
||
|
|
var kec = globalThis.dataMaster['kecamatan'].filter(function(t){
|
||
|
|
if(t.kode == s.data.kecamatan){
|
||
|
|
return t
|
||
|
|
}
|
||
|
|
});
|
||
|
|
|
||
|
|
if(kec.length > 0){
|
||
|
|
kec = kec[0];
|
||
|
|
var op = `<option value="${kec.name}">${kec.name}</option>`;
|
||
|
|
document.getElementById('kecamatan').innerHTML = op;
|
||
|
|
}
|
||
|
|
|
||
|
|
var name = globalThis.dataMaster['regencies'].filter(function(t){
|
||
|
|
if(t.id == s.data.regencies){
|
||
|
|
return t
|
||
|
|
}
|
||
|
|
});
|
||
|
|
|
||
|
|
if(name.length > 0){
|
||
|
|
name = name[0];
|
||
|
|
var op = `<option value="${name.name}">${name.name}</option>`;
|
||
|
|
document.getElementById('city_name').innerHTML = op;
|
||
|
|
|
||
|
|
var namep = globalThis.dataMaster['regencies'].filter(function(t){
|
||
|
|
if(t.name == name.name){
|
||
|
|
return t
|
||
|
|
}
|
||
|
|
});
|
||
|
|
|
||
|
|
if(namep.length > 0){
|
||
|
|
namep = namep[0];
|
||
|
|
var op = `<option value="${namep.province_id}">${namep.province_id}</option>`;
|
||
|
|
document.getElementById('province').innerHTML = op;
|
||
|
|
}
|
||
|
|
|
||
|
|
}
|
||
|
|
}
|
||
|
|
})
|
||
|
|
.createForm({
|
||
|
|
idprop : {
|
||
|
|
form: 'input',
|
||
|
|
type: 'hidden',
|
||
|
|
placeholder: 'Inputkan idprop',
|
||
|
|
title: 'idprop'
|
||
|
|
},
|
||
|
|
judulproperti: {
|
||
|
|
form: 'input',
|
||
|
|
type: 'text',
|
||
|
|
placeholder: 'Inputkan Judul Properti',
|
||
|
|
title: 'Judul Properti'
|
||
|
|
},
|
||
|
|
kategori: {
|
||
|
|
form: 'input',
|
||
|
|
type: 'select',
|
||
|
|
table: 'kategori_properti',
|
||
|
|
view: ['kategori_nama'],
|
||
|
|
value: 'kategori_nama',
|
||
|
|
placeholder: 'Inputkan keterangan',
|
||
|
|
title: 'Kategori'
|
||
|
|
},
|
||
|
|
deskripsi: {
|
||
|
|
form: 'input',
|
||
|
|
type: 'textarea',
|
||
|
|
placeholder: 'Inputkan deskripsi',
|
||
|
|
title: 'Deskripsi'
|
||
|
|
},
|
||
|
|
harga: {
|
||
|
|
form: 'input',
|
||
|
|
type: 'number',
|
||
|
|
placeholder: 'Inputkan harga',
|
||
|
|
title: 'Harga'
|
||
|
|
},
|
||
|
|
transaksi: {
|
||
|
|
form: 'input',
|
||
|
|
type: 'select',
|
||
|
|
table: 'transaksi',
|
||
|
|
view: ['name'],
|
||
|
|
value: 'kode',
|
||
|
|
placeholder: 'Inputkan transaksi',
|
||
|
|
title: 'Transaksi'
|
||
|
|
},
|
||
|
|
sertifikat: {
|
||
|
|
form: 'input',
|
||
|
|
type: 'select',
|
||
|
|
table: 'sertifikat',
|
||
|
|
view: ['name'],
|
||
|
|
value: 'kode',
|
||
|
|
placeholder: 'Inputkan sertifikat',
|
||
|
|
title: 'Sertifikat'
|
||
|
|
},
|
||
|
|
province: {
|
||
|
|
form: 'input',
|
||
|
|
type: 'select',
|
||
|
|
table: 'provinces',
|
||
|
|
view: ['name'],
|
||
|
|
value: 'name',
|
||
|
|
placeholder: 'Inputkan provinsi',
|
||
|
|
title: 'Provinsi'
|
||
|
|
},
|
||
|
|
city_name: {
|
||
|
|
form: 'input',
|
||
|
|
type: 'select',
|
||
|
|
table: 'regencies',
|
||
|
|
view: ['name'],
|
||
|
|
value: 'name',
|
||
|
|
relation: 'province',
|
||
|
|
relationId: 'province_id',
|
||
|
|
placeholder: 'Inputkan kota',
|
||
|
|
title: 'Kota'
|
||
|
|
},
|
||
|
|
kecamatan: {
|
||
|
|
form: 'input',
|
||
|
|
type: 'select',
|
||
|
|
table: 'kecamatan',
|
||
|
|
view: ['name'],
|
||
|
|
value: 'name',
|
||
|
|
relation: 'city_name',
|
||
|
|
relationId: 'regencies',
|
||
|
|
relationSet: 'id',
|
||
|
|
placeholder: 'Inputkan kecamatan',
|
||
|
|
title: 'Kecamatan'
|
||
|
|
},
|
||
|
|
subdistrict_name: {
|
||
|
|
form: 'input',
|
||
|
|
type: 'select',
|
||
|
|
table: 'area',
|
||
|
|
view: ['name'],
|
||
|
|
value: 'name',
|
||
|
|
relation: 'kecamatan',
|
||
|
|
relationId: 'kecamatan',
|
||
|
|
relationSet: 'kode',
|
||
|
|
placeholder: 'Inputkan Area',
|
||
|
|
title: 'Area'
|
||
|
|
},
|
||
|
|
alamat: {
|
||
|
|
form: 'input',
|
||
|
|
type: 'text',
|
||
|
|
placeholder: 'Inputkan alamat (tanpa blok dan nomer properti)',
|
||
|
|
title: 'Alamat'
|
||
|
|
},
|
||
|
|
norumah: {
|
||
|
|
form: 'input',
|
||
|
|
type: 'text',
|
||
|
|
placeholder: 'Inputkan no rumah',
|
||
|
|
columns: 12,
|
||
|
|
typeColumns: 'lg',
|
||
|
|
title: 'No Rumah'
|
||
|
|
},
|
||
|
|
lat: {
|
||
|
|
form: 'input',
|
||
|
|
type: 'text',
|
||
|
|
placeholder: 'Inputkan latitude ',
|
||
|
|
title: 'Latitude',
|
||
|
|
columns: 6,
|
||
|
|
typeColumns: 'lg',
|
||
|
|
},
|
||
|
|
lng: {
|
||
|
|
form: 'input',
|
||
|
|
type: 'text',
|
||
|
|
placeholder: 'Inputkan longitude ',
|
||
|
|
title: 'Longitude',
|
||
|
|
typeColumns: 'lg',
|
||
|
|
columns: 6
|
||
|
|
},
|
||
|
|
hadap: {
|
||
|
|
form: 'input',
|
||
|
|
type: 'select',
|
||
|
|
view: ['name'],
|
||
|
|
table: 'hadap',
|
||
|
|
value: 'name',
|
||
|
|
placeholder: 'Inputkan orientasi',
|
||
|
|
title: 'Orientasi'
|
||
|
|
},
|
||
|
|
jum_kt: {
|
||
|
|
form: 'input',
|
||
|
|
type: 'text',
|
||
|
|
placeholder: 'Inputkan Kamar Tidur',
|
||
|
|
columns: 6,
|
||
|
|
typeColumns: 'lg',
|
||
|
|
title: 'KT'
|
||
|
|
},
|
||
|
|
jum_km: {
|
||
|
|
form: 'input',
|
||
|
|
type: 'text',
|
||
|
|
placeholder: 'Inputkan Kamar Mandi',
|
||
|
|
columns: 6,
|
||
|
|
typeColumns: 'lg',
|
||
|
|
title: 'KM'
|
||
|
|
},
|
||
|
|
lt: {
|
||
|
|
form: 'input',
|
||
|
|
type: 'text',
|
||
|
|
placeholder: 'Inputkan Luas Tanah',
|
||
|
|
columns: 6,
|
||
|
|
typeColumns: 'lg',
|
||
|
|
title: 'LT'
|
||
|
|
},
|
||
|
|
lb: {
|
||
|
|
form: 'input',
|
||
|
|
type: 'text',
|
||
|
|
placeholder: 'Inputkan Luas Bangunan',
|
||
|
|
columns: 6,
|
||
|
|
typeColumns: 'lg',
|
||
|
|
title: 'LB'
|
||
|
|
},
|
||
|
|
ltanah: {
|
||
|
|
form: 'input',
|
||
|
|
type: 'text',
|
||
|
|
placeholder: 'Inputkan dimensi tanah',
|
||
|
|
columns: 12,
|
||
|
|
typeColumns: 'lg',
|
||
|
|
title: 'Dimensi Tanah'
|
||
|
|
},
|
||
|
|
listrik: {
|
||
|
|
form: 'input',
|
||
|
|
type: 'text',
|
||
|
|
placeholder: 'Inputkan Listrik',
|
||
|
|
title: 'Listrik (WATT)'
|
||
|
|
},
|
||
|
|
air: {
|
||
|
|
form: 'input',
|
||
|
|
type: 'select',
|
||
|
|
table: 'air',
|
||
|
|
view: ['name'],
|
||
|
|
value: 'name',
|
||
|
|
placeholder: 'Inputkan count air / PDAM',
|
||
|
|
title: 'Air'
|
||
|
|
},
|
||
|
|
laku: {
|
||
|
|
form: 'input',
|
||
|
|
type: 'select',
|
||
|
|
table: 'laku',
|
||
|
|
view: ['name'],
|
||
|
|
value: 'kode',
|
||
|
|
placeholder: 'Inputkan',
|
||
|
|
title: 'Status Properti'
|
||
|
|
},
|
||
|
|
tgllaku: {
|
||
|
|
form: 'input',
|
||
|
|
type: 'date',
|
||
|
|
placeholder: 'Inputkan tanggal laku',
|
||
|
|
title: 'Tanggal Laku'
|
||
|
|
},
|
||
|
|
bisakpr: {
|
||
|
|
form: 'input',
|
||
|
|
type: 'select',
|
||
|
|
table: 'yorn',
|
||
|
|
view: ['name'],
|
||
|
|
value: 'kode',
|
||
|
|
placeholder: 'Inputkan kpr',
|
||
|
|
title: 'Bisa KPR'
|
||
|
|
},
|
||
|
|
komisi: {
|
||
|
|
form: 'input',
|
||
|
|
type: 'text',
|
||
|
|
placeholder: 'Inputkan komisi',
|
||
|
|
title: 'Komisi (%)'
|
||
|
|
},
|
||
|
|
idsales: {
|
||
|
|
form: 'input',
|
||
|
|
type: 'select',
|
||
|
|
table: 'sales',
|
||
|
|
view: ['nama'],
|
||
|
|
value: 'id',
|
||
|
|
placeholder: 'Inputkan sales',
|
||
|
|
title: 'Sales'
|
||
|
|
},
|
||
|
|
nama_vendor: {
|
||
|
|
form: 'input',
|
||
|
|
type: 'text',
|
||
|
|
placeholder: 'Inputkan vendor',
|
||
|
|
title: 'Vendor'
|
||
|
|
},
|
||
|
|
kontak_vendor: {
|
||
|
|
form: 'input',
|
||
|
|
type: 'text',
|
||
|
|
placeholder: 'Inputkan Telp. Vendor',
|
||
|
|
title: 'No. Telp. Vendor'
|
||
|
|
},
|
||
|
|
poin1: {
|
||
|
|
form: 'input',
|
||
|
|
type: 'select',
|
||
|
|
table: 'aorn',
|
||
|
|
view: ['name'],
|
||
|
|
value: 'kode',
|
||
|
|
columns: 6,
|
||
|
|
typeColumns: 'lg',
|
||
|
|
placeholder: 'Inputkan foto properti',
|
||
|
|
title: 'Foto Properti'
|
||
|
|
},
|
||
|
|
poin2: {
|
||
|
|
form: 'input',
|
||
|
|
type: 'select',
|
||
|
|
table: 'aorn',
|
||
|
|
view: ['name'],
|
||
|
|
value: 'kode',
|
||
|
|
columns: 6,
|
||
|
|
typeColumns: 'lg',
|
||
|
|
placeholder: 'Inputkan foto properti',
|
||
|
|
title: 'Data Listing'
|
||
|
|
},
|
||
|
|
poin3: {
|
||
|
|
form: 'input',
|
||
|
|
type: 'select',
|
||
|
|
table: 'aorn',
|
||
|
|
view: ['name'],
|
||
|
|
value: 'kode',
|
||
|
|
columns: 6,
|
||
|
|
typeColumns: 'lg',
|
||
|
|
placeholder: 'Inputkan foto properti',
|
||
|
|
title: 'Nama & kontak vendor'
|
||
|
|
},
|
||
|
|
poin4: {
|
||
|
|
form: 'input',
|
||
|
|
type: 'select',
|
||
|
|
table: 'aorn',
|
||
|
|
view: ['name'],
|
||
|
|
value: 'kode',
|
||
|
|
columns: 6,
|
||
|
|
typeColumns: 'lg',
|
||
|
|
placeholder: 'Inputkan foto properti',
|
||
|
|
title: 'Banner Terpasang'
|
||
|
|
},
|
||
|
|
poin5: {
|
||
|
|
form: 'input',
|
||
|
|
type: 'select',
|
||
|
|
table: 'aorn',
|
||
|
|
view: ['name'],
|
||
|
|
value: 'kode',
|
||
|
|
columns: 6,
|
||
|
|
typeColumns: 'lg',
|
||
|
|
placeholder: 'Inputkan foto properti',
|
||
|
|
title: 'Ada IMB'
|
||
|
|
},
|
||
|
|
poin6: {
|
||
|
|
form: 'input',
|
||
|
|
type: 'select',
|
||
|
|
table: 'aorn',
|
||
|
|
view: ['name'],
|
||
|
|
value: 'kode',
|
||
|
|
columns: 6,
|
||
|
|
typeColumns: 'lg',
|
||
|
|
placeholder: 'Inputkan foto properti',
|
||
|
|
title: 'Ada Blueprint'
|
||
|
|
},
|
||
|
|
poin7: {
|
||
|
|
form: 'input',
|
||
|
|
type: 'select',
|
||
|
|
table: 'aorn',
|
||
|
|
view: ['name'],
|
||
|
|
value: 'kode',
|
||
|
|
columns: 6,
|
||
|
|
typeColumns: 'lg',
|
||
|
|
placeholder: 'Inputkan foto properti',
|
||
|
|
title: 'PBB Terbaru'
|
||
|
|
},
|
||
|
|
poin8: {
|
||
|
|
form: 'input',
|
||
|
|
type: 'select',
|
||
|
|
table: 'aorn',
|
||
|
|
view: ['name'],
|
||
|
|
value: 'kode',
|
||
|
|
columns: 6,
|
||
|
|
typeColumns: 'lg',
|
||
|
|
placeholder: 'Inputkan foto properti',
|
||
|
|
title: 'Cp. Sertifikat'
|
||
|
|
},
|
||
|
|
poin9: {
|
||
|
|
form: 'input',
|
||
|
|
type: 'select',
|
||
|
|
table: 'aorn',
|
||
|
|
view: ['name'],
|
||
|
|
value: 'kode',
|
||
|
|
columns: 6,
|
||
|
|
typeColumns: 'lg',
|
||
|
|
placeholder: 'Inputkan foto properti',
|
||
|
|
title: 'Cp. KTP Pemilik'
|
||
|
|
},
|
||
|
|
poin10: {
|
||
|
|
form: 'input',
|
||
|
|
type: 'select',
|
||
|
|
table: 'aorn',
|
||
|
|
view: ['name'],
|
||
|
|
value: 'kode',
|
||
|
|
columns: 6,
|
||
|
|
typeColumns: 'lg',
|
||
|
|
placeholder: 'Inputkan foto properti',
|
||
|
|
title: 'Koordinat Lokasi'
|
||
|
|
},
|
||
|
|
share: {
|
||
|
|
form: 'input',
|
||
|
|
type: 'slug',
|
||
|
|
from: 'judulproperti',
|
||
|
|
placeholder: 'Inputkan buat share link',
|
||
|
|
title: 'Share'
|
||
|
|
}
|
||
|
|
})
|
||
|
|
.row({
|
||
|
|
idprop: 'Id Properti',
|
||
|
|
judulproperti: 'Judul Properti',
|
||
|
|
kategori: 'Kategori',
|
||
|
|
transaksi: 'Transaksi',
|
||
|
|
sertifikat: 'Sertifikat',
|
||
|
|
})
|
||
|
|
.onsave(function(f){
|
||
|
|
f.load();
|
||
|
|
})
|
||
|
|
.onback(function(a){
|
||
|
|
if (globalThis.nextIncrement != undefined) {
|
||
|
|
db().table(a.data.table).condition([
|
||
|
|
{opsi: '', data: ['idProp', '=', globalThis.nextIncrement]}
|
||
|
|
])
|
||
|
|
.delete()
|
||
|
|
.get(function(){
|
||
|
|
delete globalThis.nextIncrement;
|
||
|
|
a.load();
|
||
|
|
})
|
||
|
|
} else {
|
||
|
|
a.load();
|
||
|
|
}
|
||
|
|
})
|
||
|
|
.oncreate(function(a){
|
||
|
|
|
||
|
|
if(globalThis.sales != undefined){
|
||
|
|
var datsales = globalThis.sales[0]
|
||
|
|
document.getElementById('idsales').innerHTML = `<option value="${datsales.id}">${datsales.nama}</option>`;
|
||
|
|
}
|
||
|
|
|
||
|
|
document.getElementById('judulproperti').addEventListener('keyup', function(){
|
||
|
|
document.getElementById('share').value = this.value.replace(/ /g, '-').replace(/\?/g, '-').replace(/\//g, '-').replace(/\'/g, '-').replace(/\"/g, '-');
|
||
|
|
},false)
|
||
|
|
|
||
|
|
document.getElementById('simpan'+a.data.id).innerText = 'Next';
|
||
|
|
$('#deskripsi').summernote('focus');
|
||
|
|
$('#laku').html(`<option value='0'>Belum Laku</option>`);
|
||
|
|
$('#tgllaku').val('');
|
||
|
|
var blog = new db;
|
||
|
|
blog.table(a.data.table)
|
||
|
|
blog.nextIncrement()
|
||
|
|
blog.get(function(v){
|
||
|
|
|
||
|
|
globalThis.nextIncrement = v[0].increment;
|
||
|
|
globalThis.uploadImage = v[0].increment;
|
||
|
|
|
||
|
|
loadImageUpdateCreate(v[0].increment);
|
||
|
|
|
||
|
|
document.getElementById('idprop').value = v[0].increment;
|
||
|
|
|
||
|
|
a.data.idUpdate = true;
|
||
|
|
|
||
|
|
a.data.loadDataEdit = {
|
||
|
|
idProp: v[0].increment
|
||
|
|
};
|
||
|
|
|
||
|
|
db().table(a.data.table).save({
|
||
|
|
idprop : nextIncrement
|
||
|
|
})
|
||
|
|
.get(function(){
|
||
|
|
console.log('saved')
|
||
|
|
})
|
||
|
|
|
||
|
|
})
|
||
|
|
|
||
|
|
document.querySelector('label[for=idprop]').style.display = 'none';
|
||
|
|
|
||
|
|
})
|
||
|
|
.validate({
|
||
|
|
judulproperti: ""
|
||
|
|
})
|
||
|
|
.onupdate(function(a, b){
|
||
|
|
if(globalThis.sales != undefined){
|
||
|
|
var datsales = globalThis.sales[0];
|
||
|
|
if(document.getElementById('idsales').value == ''){
|
||
|
|
document.getElementById('idsales').innerHTML = `<option value="${datsales.id}">${datsales.nama}</option>`;
|
||
|
|
}
|
||
|
|
}
|
||
|
|
|
||
|
|
document.getElementById('judulproperti').addEventListener('keyup', function(){
|
||
|
|
document.getElementById('share').value = this.value.replace(/ /g, '-').replace(/\?/g, '-').replace(/\//g, '-').replace(/\'/g, '-').replace(/\"/g, '-');
|
||
|
|
},false)
|
||
|
|
|
||
|
|
if (globalThis.nextIncrement != undefined) {
|
||
|
|
delete globalThis.nextIncrement;
|
||
|
|
}
|
||
|
|
|
||
|
|
globalThis.uploadImage = b.idprop;
|
||
|
|
|
||
|
|
loadImageUpdateCreate(b.idprop);
|
||
|
|
|
||
|
|
document.querySelector('label[for=idprop]').style.display = 'none';
|
||
|
|
|
||
|
|
var cekLaku = document.getElementById('laku').value;
|
||
|
|
|
||
|
|
})
|
||
|
|
.order('idprop', 'DESC')
|
||
|
|
.afterload(function(x,y,v){
|
||
|
|
var data = globalThis.dataLoadtable;
|
||
|
|
|
||
|
|
data = data.map(function(a){
|
||
|
|
return a.idprop;
|
||
|
|
}).join('-')
|
||
|
|
|
||
|
|
fetch('https://masuksini.com/cek/properti/bintang/'+data)
|
||
|
|
.then(response => response.json())
|
||
|
|
.then(res => {
|
||
|
|
console.log(res)
|
||
|
|
v();
|
||
|
|
})
|
||
|
|
|
||
|
|
})
|
||
|
|
.load()
|
||
|
|
|
||
|
|
|
||
|
|
var input = function(){
|
||
|
|
return el('input');
|
||
|
|
}
|
||
|
|
|
||
|
|
var label = function(){
|
||
|
|
return el('label');
|
||
|
|
}
|
||
|
|
|
||
|
|
function loadImageUpdateCreate(id){
|
||
|
|
globalThis.idImagesCover = id;
|
||
|
|
var dmpi = div()
|
||
|
|
dmpi.child(
|
||
|
|
el('style').html(`
|
||
|
|
|
||
|
|
|
||
|
|
|
||
|
|
|
||
|
|
|
||
|
|
|
||
|
|
|
||
|
|
|
||
|
|
|
||
|
|
|
||
|
|
|
||
|
|
|
||
|
|
|
||
|
|
|
||
|
|
|
||
|
|
.tab-upload{
|
||
|
|
position: relative;
|
||
|
|
}
|
||
|
|
|
||
|
|
.tab-upload .tab-menu{
|
||
|
|
display: inline-block;
|
||
|
|
position: absolute;
|
||
|
|
right: 0;
|
||
|
|
}
|
||
|
|
|
||
|
|
.tab-upload .tab-menu span{
|
||
|
|
display: inline-block;
|
||
|
|
padding: 5px 8px;
|
||
|
|
margin: 0 5px;
|
||
|
|
background-color: var(--blue);
|
||
|
|
color: white;
|
||
|
|
border-radius: 5px;
|
||
|
|
cursor: pointer;
|
||
|
|
}
|
||
|
|
|
||
|
|
.tab-upload .single{
|
||
|
|
display: block;
|
||
|
|
position: relative;
|
||
|
|
top: 40px;
|
||
|
|
margin-bottom: 60px;
|
||
|
|
}
|
||
|
|
|
||
|
|
.tab-upload .single > div{
|
||
|
|
display: grid;
|
||
|
|
grid-gap: 8px;
|
||
|
|
text-align: center;
|
||
|
|
grid-template-columns: auto auto auto;
|
||
|
|
}
|
||
|
|
|
||
|
|
.tab-upload .single > div input{
|
||
|
|
display: none;
|
||
|
|
}
|
||
|
|
|
||
|
|
.tab-upload .single > div .foto{
|
||
|
|
display: block;
|
||
|
|
width: 100%;
|
||
|
|
height: 150px;
|
||
|
|
background: var(--blue);
|
||
|
|
box-shadow: 0 0 10px rgba(0,0,0,0.2);
|
||
|
|
background-size: cover;
|
||
|
|
background-position: center;
|
||
|
|
}
|
||
|
|
|
||
|
|
.tab-upload .single > div label{
|
||
|
|
position: absolute;
|
||
|
|
display: block;
|
||
|
|
font-size: 30px;
|
||
|
|
top: calc(50% - 15px);
|
||
|
|
left: calc(50% - 15px);
|
||
|
|
text-shadow: 0 0 35px #333;
|
||
|
|
color: #fff;
|
||
|
|
}
|
||
|
|
|
||
|
|
.tab-upload .multi{
|
||
|
|
position: relative;
|
||
|
|
display: none;
|
||
|
|
justify-content: center;
|
||
|
|
align-items: center;
|
||
|
|
top: 40px;
|
||
|
|
height: 200px;
|
||
|
|
margin-bottom: 60px;
|
||
|
|
}
|
||
|
|
|
||
|
|
.tab-upload .multi input{
|
||
|
|
display: block;
|
||
|
|
position: absolute;
|
||
|
|
width: 100%;
|
||
|
|
height: 100%;
|
||
|
|
top: 0;
|
||
|
|
left: 0;
|
||
|
|
opacity: 0.0;
|
||
|
|
}
|
||
|
|
|
||
|
|
.tab-upload .multi label{
|
||
|
|
z-index: 1;
|
||
|
|
font-size: 30px;
|
||
|
|
text-align: center;
|
||
|
|
}
|
||
|
|
|
||
|
|
.tab-upload .multi label::after{
|
||
|
|
position: relative;
|
||
|
|
display: block;
|
||
|
|
font-size: 14pt !important;
|
||
|
|
content: "chose file";
|
||
|
|
font-size: 30px;
|
||
|
|
}
|
||
|
|
|
||
|
|
.tab-upload .multi label::before{
|
||
|
|
position: absolute;
|
||
|
|
content: "";
|
||
|
|
display: block;
|
||
|
|
background: #ddd;
|
||
|
|
height: 100%;
|
||
|
|
width: 100%;
|
||
|
|
top:0;
|
||
|
|
left:0;
|
||
|
|
z-index: -1;
|
||
|
|
}
|
||
|
|
.tab-upload .multi .progress{
|
||
|
|
position: absolute;
|
||
|
|
bottom: 0;
|
||
|
|
width: 100%;
|
||
|
|
z-index: 1;
|
||
|
|
}
|
||
|
|
|
||
|
|
#cover{
|
||
|
|
display: flex;
|
||
|
|
margin: 10px;
|
||
|
|
background: var(--blue);
|
||
|
|
position: relative;
|
||
|
|
padding: 10px;
|
||
|
|
height: 250px;
|
||
|
|
border: 1px solid #add;
|
||
|
|
justify-content: center;
|
||
|
|
align-items: center;
|
||
|
|
background-size: cover;
|
||
|
|
background-position: center;
|
||
|
|
}
|
||
|
|
|
||
|
|
#cover label{
|
||
|
|
display: inline-block;
|
||
|
|
font-size: 30px;
|
||
|
|
text-align: center;
|
||
|
|
color: white;
|
||
|
|
text-shadow: 0 0 25px #000;
|
||
|
|
cursor: pointer;
|
||
|
|
}
|
||
|
|
|
||
|
|
#cover label::after{
|
||
|
|
content: "Upload Cover";
|
||
|
|
display: block;
|
||
|
|
font-size: 20px;
|
||
|
|
}
|
||
|
|
|
||
|
|
#cover label input{
|
||
|
|
cursor: pointer;
|
||
|
|
position: absolute;
|
||
|
|
display: block;
|
||
|
|
width: 100%;
|
||
|
|
height: 100%;
|
||
|
|
top:0;
|
||
|
|
left: 0;
|
||
|
|
background: #ddd;
|
||
|
|
opacity: 0;
|
||
|
|
}
|
||
|
|
|
||
|
|
.delete-foto{
|
||
|
|
position: absolute;
|
||
|
|
color: white;
|
||
|
|
font-size: 16pt;
|
||
|
|
text-shadow: 0 0 5px #000;
|
||
|
|
top: 10px;
|
||
|
|
right: 10px;
|
||
|
|
cursor: pointer;
|
||
|
|
}
|
||
|
|
|
||
|
|
#cover .progress{
|
||
|
|
position: absolute;
|
||
|
|
bottom: 0;
|
||
|
|
width: 100%;
|
||
|
|
}
|
||
|
|
|
||
|
|
|
||
|
|
|
||
|
|
|
||
|
|
|
||
|
|
|
||
|
|
|
||
|
|
|
||
|
|
|
||
|
|
`)
|
||
|
|
)
|
||
|
|
|
||
|
|
var dompImage = document.getElementById('load-properti').children[1].children[2];
|
||
|
|
|
||
|
|
$.ajax({
|
||
|
|
url: '/admin/api/foto/'+id,
|
||
|
|
dataTtpe: 'JSON',
|
||
|
|
success: function(response){
|
||
|
|
var data = JSON.parse(response);
|
||
|
|
globalThis.fros = data.data;
|
||
|
|
var setting = data.set;
|
||
|
|
|
||
|
|
|
||
|
|
|
||
|
|
setting.forEach(function(set){
|
||
|
|
|
||
|
|
var nameTag = set.kategori;
|
||
|
|
if(nameTag == 'foto'){
|
||
|
|
nameTag = "Listing";
|
||
|
|
}else if(nameTag == 'blueprint'){
|
||
|
|
nameTag = "Blueprint";
|
||
|
|
}else if(nameTag == 'ktp'){
|
||
|
|
nameTag = "KTP Pemilik";
|
||
|
|
}else{
|
||
|
|
nameTag = nameTag.toUpperCase()
|
||
|
|
}
|
||
|
|
|
||
|
|
dmpi.child(
|
||
|
|
div().class('tab-upload')
|
||
|
|
.child(
|
||
|
|
div().class('tab-menu')
|
||
|
|
.child(
|
||
|
|
el('span').data('id', set.kategori).text('Single Upload').attr('style', 'background-color: var(--blue); color: white').id('btn1'+set.kategori)
|
||
|
|
.click(function(){
|
||
|
|
var getId = this.getAttribute('data-id');
|
||
|
|
globalThis['single'+getId].el.css('display', 'block');
|
||
|
|
globalThis['multi'+getId].el.css('display', 'none');
|
||
|
|
})
|
||
|
|
)
|
||
|
|
.child(
|
||
|
|
el('span').data('id', set.kategori).text('Multi Upload').css('background-color', 'white').css('color', '#333').css('border', '1px solid #ddd').id('btn2'+set.kategori)
|
||
|
|
.click(function(){
|
||
|
|
var getId = this.getAttribute('data-id');
|
||
|
|
globalThis['single'+getId].el.css('display', 'none');
|
||
|
|
globalThis['multi'+getId].el.css('display', 'flex');
|
||
|
|
})
|
||
|
|
)
|
||
|
|
)
|
||
|
|
.child(
|
||
|
|
div().class('title-upload').text('Foto '+nameTag).size('14pt')
|
||
|
|
)
|
||
|
|
.child(
|
||
|
|
div().class('single').id('single'+set.kategori).data('tipe', set.kategori).load(singleUploadFunc)
|
||
|
|
)
|
||
|
|
.child(
|
||
|
|
div().class('multi').id('multi'+set.kategori)
|
||
|
|
.child(
|
||
|
|
label().attr('for', set.kategori)
|
||
|
|
.event('drag dragstart dragend dragover dragenter dragleave drop', function(event){
|
||
|
|
event.preventDefault();
|
||
|
|
event.stopPropagation();
|
||
|
|
})
|
||
|
|
.child(
|
||
|
|
el('i').class('fas fa-upload')
|
||
|
|
)
|
||
|
|
.child(
|
||
|
|
input().type('file').id(set.kategori).attr('multiple', 'multiple')
|
||
|
|
.change(function(){
|
||
|
|
var condFile = this.files;
|
||
|
|
var id = this.id;
|
||
|
|
var prosent = 0;
|
||
|
|
var progress = globalThis['progress'+id];
|
||
|
|
var getId = globalThis.fros.filter(function(er){
|
||
|
|
if(er.kategori == id){
|
||
|
|
return er
|
||
|
|
}
|
||
|
|
})
|
||
|
|
|
||
|
|
uploadMulti(getId[0].id, condFile[0], 0, getId, condFile, id);
|
||
|
|
|
||
|
|
function uploadMulti(id, file, num, getId, condFile, kat) {
|
||
|
|
var show = 'https://masuksini.com/sistem-api/androapi/upload/foto/'+id+'.jpg?v='+Date.now();
|
||
|
|
var pathFile = '../../sistem-api/androapi/upload/foto/'+id+'.jpg';
|
||
|
|
// var pathFile = '../../sistem-api/androapi/upload/foto/'+a.id+'.jpg';
|
||
|
|
const reader = new FileReader();
|
||
|
|
reader.addEventListener("load", function () {
|
||
|
|
var base64 = reader.result;
|
||
|
|
var rendr = base64.split("base64,");
|
||
|
|
rendr = rendr[1];
|
||
|
|
rendr = rendr.match(/.{1,1200000}/g);
|
||
|
|
var length = rendr.length;
|
||
|
|
var start = 0;
|
||
|
|
|
||
|
|
uploadProsses()
|
||
|
|
|
||
|
|
function uploadProsses(){
|
||
|
|
if (start < length) {
|
||
|
|
var leng = condFile.length;
|
||
|
|
if(getId.length < condFile.length){
|
||
|
|
leng = getId.length;
|
||
|
|
}
|
||
|
|
var n = Math.round(((start+1) / length) * 100) / leng;
|
||
|
|
prosent += Math.round(n);
|
||
|
|
progress.el.width(prosent+'%').text(prosent+'%')
|
||
|
|
$.ajax({
|
||
|
|
url: '/admin/upload',
|
||
|
|
method: 'POST',
|
||
|
|
dataType: 'text',
|
||
|
|
data: {
|
||
|
|
_token: $('meta[name=csrf-token]').attr('content'),
|
||
|
|
ok: rendr[start],
|
||
|
|
start: start,
|
||
|
|
tipe: 'upload'
|
||
|
|
},
|
||
|
|
success: function(e){
|
||
|
|
start += 1;
|
||
|
|
uploadProsses();
|
||
|
|
}
|
||
|
|
})
|
||
|
|
}else{
|
||
|
|
$.ajax({
|
||
|
|
url: '/admin/upload',
|
||
|
|
method: 'POST',
|
||
|
|
dataType: 'text',
|
||
|
|
data: {
|
||
|
|
_token: $('meta[name=csrf-token]').attr('content'),
|
||
|
|
tipe: pathFile
|
||
|
|
},
|
||
|
|
success: function(e){
|
||
|
|
console.log((condFile.length - 1));
|
||
|
|
var leng = condFile.length;
|
||
|
|
if(getId.length < condFile.length){
|
||
|
|
leng = getId.length;
|
||
|
|
}
|
||
|
|
if(num == (leng - 1)){
|
||
|
|
progress.el.width('0%').text('0%')
|
||
|
|
globalThis['foto'+kat+num].el.attr('style', 'background-image: url("'+show+'")')
|
||
|
|
globalThis['single'+kat].el.css('display', 'block');
|
||
|
|
globalThis['multi'+kat].el.css('display', 'none');
|
||
|
|
}else{
|
||
|
|
console.log('foto'+kat+num);
|
||
|
|
globalThis['foto'+kat+num].el.attr('style', 'background-image: url("'+show+'")')
|
||
|
|
uploadMulti(getId[num + 1].id, condFile[num + 1], num + 1, getId, condFile, kat);
|
||
|
|
}
|
||
|
|
}
|
||
|
|
})
|
||
|
|
}
|
||
|
|
}
|
||
|
|
// uploadProsses()
|
||
|
|
}, false);
|
||
|
|
if (file) {
|
||
|
|
reader.readAsDataURL(file);
|
||
|
|
}
|
||
|
|
}
|
||
|
|
|
||
|
|
})
|
||
|
|
)
|
||
|
|
)
|
||
|
|
.child(
|
||
|
|
div().class('progress')
|
||
|
|
.child(
|
||
|
|
div().id('progress'+set.kategori).class('progress-bar').attr('role','progressbar').width('10%').aria('valuenow', '25').aria('valuemin', '0').aria('valuemax', '100').text('0%')
|
||
|
|
)
|
||
|
|
)
|
||
|
|
)
|
||
|
|
)
|
||
|
|
|
||
|
|
function singleUploadFunc(formUpload){
|
||
|
|
var getForm = formUpload.el.getAttribute('data-tipe');
|
||
|
|
var parent = formUpload.el;
|
||
|
|
var dataf = data.data.filter(function(s){
|
||
|
|
if(s.kategori == getForm){
|
||
|
|
return s;
|
||
|
|
}
|
||
|
|
})
|
||
|
|
var sngl = div();
|
||
|
|
dataf.forEach(function(singleFile, i){
|
||
|
|
sngl.child(
|
||
|
|
div().css('position', 'relative')
|
||
|
|
|
||
|
|
.child(
|
||
|
|
div().data('foto', '../../sistem-api/androapi/upload/foto/'+singleFile.id+'.jpg').id('foto'+getForm+i).class('foto').attr('style', 'background-image: url("../../sistem-api/androapi/upload/foto/'+singleFile.id+'.jpg?v='+Date.now()+'")').attr('draggable', true).cursor('move')
|
||
|
|
.event('drag',function(){
|
||
|
|
globalThis.transfer = this.getAttribute('data-foto');
|
||
|
|
})
|
||
|
|
)
|
||
|
|
.child(
|
||
|
|
label().attr('for', getForm+i).html('<i class="fas fa-upload"></i>').cursor('pointer')
|
||
|
|
)
|
||
|
|
.child(
|
||
|
|
div().class('progress')
|
||
|
|
.child(
|
||
|
|
div().id('progress'+getForm+i).class('progress-bar').attr('role','progressbar').width('0%').aria('valuenow', '25').aria('valuemin', '0').aria('valuemax', '100').text('0%')
|
||
|
|
)
|
||
|
|
)
|
||
|
|
.child(
|
||
|
|
input().data('id', singleFile.id).type('file').id(getForm+i).change(function(){
|
||
|
|
var idfot = globalThis['foto'+this.id];
|
||
|
|
var progress = globalThis['progress'+this.id];
|
||
|
|
var file = this.files[0];
|
||
|
|
var size = file.size / 1000;
|
||
|
|
var show = 'https://masuksini.com/sistem-api/androapi/upload/foto/'+this.getAttribute('data-id')+'.jpg?v='+Date.now();
|
||
|
|
var pathFile = '../../sistem-api/androapi/upload/foto/'+this.getAttribute('data-id')+'.jpg';
|
||
|
|
// var pathFile = '../../sistem-api/androapi/upload/foto/'+a.id+'.jpg';
|
||
|
|
if(size > 1000){
|
||
|
|
alert('file tidak boleh lebih dari 1MB');
|
||
|
|
}else{
|
||
|
|
const reader = new FileReader();
|
||
|
|
reader.addEventListener("load", function () {
|
||
|
|
var base64 = reader.result;
|
||
|
|
var rendr = base64.split("base64,");
|
||
|
|
rendr = rendr[1];
|
||
|
|
rendr = rendr.match(/.{1,150000}/g);
|
||
|
|
var length = rendr.length;
|
||
|
|
var start = 0;
|
||
|
|
|
||
|
|
uploadProsses()
|
||
|
|
|
||
|
|
function uploadProsses(){
|
||
|
|
if (start < length) {
|
||
|
|
progress.el.width(Math.round(((start+1) / length) * 100)+'%').text(Math.round(((start+1) / length) * 100)+'%')
|
||
|
|
// document.getElementById('upload-file-'+a.id).innerText = Math.round(((start+1) / length) * 100)+'%';
|
||
|
|
$.ajax({
|
||
|
|
url: '/admin/upload',
|
||
|
|
method: 'POST',
|
||
|
|
dataType: 'text',
|
||
|
|
data: {
|
||
|
|
_token: $('meta[name=csrf-token]').attr('content'),
|
||
|
|
ok: rendr[start],
|
||
|
|
start: start,
|
||
|
|
tipe: 'upload'
|
||
|
|
},
|
||
|
|
success: function(e){
|
||
|
|
console.log(e.length)
|
||
|
|
start += 1;
|
||
|
|
uploadProsses();
|
||
|
|
}
|
||
|
|
})
|
||
|
|
}else{
|
||
|
|
$.ajax({
|
||
|
|
url: '/admin/upload',
|
||
|
|
method: 'POST',
|
||
|
|
dataType: 'text',
|
||
|
|
data: {
|
||
|
|
_token: $('meta[name=csrf-token]').attr('content'),
|
||
|
|
tipe: pathFile
|
||
|
|
},
|
||
|
|
success: function(e){
|
||
|
|
console.log('saved')
|
||
|
|
progress.el.width('0%').text('0%')
|
||
|
|
idfot.el.attr('style', 'background-image: url("'+show+'")')
|
||
|
|
}
|
||
|
|
})
|
||
|
|
}
|
||
|
|
}
|
||
|
|
// uploadProsses()
|
||
|
|
}, false);
|
||
|
|
if (file) {
|
||
|
|
reader.readAsDataURL(file);
|
||
|
|
}
|
||
|
|
|
||
|
|
|
||
|
|
}
|
||
|
|
})
|
||
|
|
)
|
||
|
|
.child(
|
||
|
|
el('i').class('fas fa-trash-alt delete-foto').data('s', getForm+i).data('id', singleFile.id).id('delete'+getForm+i).data('foto', '../../sistem-api/androapi/upload/foto/'+singleFile.id+'.jpg').click(function(){
|
||
|
|
var idfot = globalThis['foto'+this.getAttribute('data-s')];
|
||
|
|
var getImageurl = this.getAttribute('data-foto');
|
||
|
|
var show = 'https://masuksini.com/sistem-api/androapi/upload/foto/'+this.getAttribute('data-id')+'.jpg?v='+Date.now();
|
||
|
|
console.log(getImageurl);
|
||
|
|
Swal.fire({
|
||
|
|
title: 'Apa anda yakin untuk menghapus data ini?',
|
||
|
|
showDenyButton: true,
|
||
|
|
confirmButtonText: `hapus`,
|
||
|
|
}).then((result) => {
|
||
|
|
/* Read more about isConfirmed, isDenied below */
|
||
|
|
if (result.isConfirmed) {
|
||
|
|
$.ajax({
|
||
|
|
url: 'admin/deleteimage',
|
||
|
|
method: 'POST',
|
||
|
|
dataType: 'text',
|
||
|
|
data: {
|
||
|
|
_token: $('meta[name=csrf-token]').attr('content'),
|
||
|
|
image: getImageurl
|
||
|
|
}, success: function(res){
|
||
|
|
alert('delete')
|
||
|
|
idfot.el.attr('style', 'background-image: url("'+show+'")')
|
||
|
|
}
|
||
|
|
})
|
||
|
|
|
||
|
|
}else{
|
||
|
|
|
||
|
|
}
|
||
|
|
})
|
||
|
|
|
||
|
|
|
||
|
|
})
|
||
|
|
)
|
||
|
|
)
|
||
|
|
})
|
||
|
|
parent.appendChild(sngl.get());
|
||
|
|
}
|
||
|
|
|
||
|
|
})
|
||
|
|
|
||
|
|
var containerUp = div()
|
||
|
|
.class('col-12 text-left mt-5')
|
||
|
|
.css('display','grid')
|
||
|
|
.css('grid-template-columns','auto 250px')
|
||
|
|
.child(dmpi)
|
||
|
|
.child(
|
||
|
|
div().id('cover').attr('style', 'background-image: url("assets/upload/cover/'+globalThis.idImagesCover+'.jpg")')
|
||
|
|
.event('dragover', function(ev){
|
||
|
|
ev.preventDefault();
|
||
|
|
})
|
||
|
|
.event('drop', function(ev){
|
||
|
|
ev.preventDefault();
|
||
|
|
console.log(ev.dataTransfer)
|
||
|
|
var data = globalThis.transfer;
|
||
|
|
var blob = null;
|
||
|
|
var xhr = new XMLHttpRequest();
|
||
|
|
xhr.open("GET", data);
|
||
|
|
xhr.responseType = "blob";//force the HTTP response, response-type header to be blob
|
||
|
|
xhr.onload = function()
|
||
|
|
{
|
||
|
|
blob = xhr.response;//xhr.response is now a blob object
|
||
|
|
var x = blob.type.split('/')[1];
|
||
|
|
|
||
|
|
var file = new File([blob], "image."+x, {type:"image/"+x});
|
||
|
|
|
||
|
|
uploadCover(file)
|
||
|
|
|
||
|
|
}
|
||
|
|
xhr.send();
|
||
|
|
})
|
||
|
|
.child(
|
||
|
|
label().html('<i class="fas fa-upload"></i>').child(
|
||
|
|
input().data('fot', 'assets/upload/cover/'+globalThis.idImagesCover+'.jpg').type('file').change(function(){
|
||
|
|
var dataimg = 'https://masuksini.com/'+this.getAttribute('data-fot');
|
||
|
|
console.log(dataimg);
|
||
|
|
var pack = this;
|
||
|
|
$.ajax({
|
||
|
|
url: dataimg,
|
||
|
|
type:'HEAD',
|
||
|
|
error: function()
|
||
|
|
{
|
||
|
|
uploadCover(pack.files[0])
|
||
|
|
//file not exists
|
||
|
|
},
|
||
|
|
success: function()
|
||
|
|
{
|
||
|
|
alert('maaf anda tidak dapat menimpa cover, cover hanya dapat di ubah melalui drag foto dari foto listing')
|
||
|
|
}
|
||
|
|
});
|
||
|
|
})
|
||
|
|
)
|
||
|
|
)
|
||
|
|
.child(
|
||
|
|
div().class('progress')
|
||
|
|
.child(
|
||
|
|
div().id('progress'+globalThis.idImagesCover).class('progress-bar').attr('role','progressbar').width('0%').aria('valuenow', '25').aria('valuemin', '0').aria('valuemax', '100').text('0%')
|
||
|
|
)
|
||
|
|
)
|
||
|
|
)
|
||
|
|
dompImage.appendChild(containerUp.get());
|
||
|
|
|
||
|
|
}
|
||
|
|
})
|
||
|
|
|
||
|
|
|
||
|
|
|
||
|
|
}
|
||
|
|
|
||
|
|
function uploadCover(file){
|
||
|
|
|
||
|
|
|
||
|
|
var progress = globalThis['progress'+globalThis.idImagesCover];
|
||
|
|
var size = file.size / 1000;
|
||
|
|
var show = 'assets/upload/cover/'+globalThis.idImagesCover+'.jpg?v='+Date.now();
|
||
|
|
var pathFile = 'assets/upload/cover/'+globalThis.idImagesCover+'.jpg';
|
||
|
|
// var pathFile = '../../sistem-api/androapi/upload/foto/'+a.id+'.jpg';
|
||
|
|
if(size > 1000){
|
||
|
|
alert('file tidak boleh lebih dari 1MB');
|
||
|
|
}else{
|
||
|
|
const reader = new FileReader();
|
||
|
|
reader.addEventListener("load", function () {
|
||
|
|
var base64 = reader.result;
|
||
|
|
var rendr = base64.split("base64,");
|
||
|
|
rendr = rendr[1];
|
||
|
|
rendr = rendr.match(/.{1,150000}/g);
|
||
|
|
var length = rendr.length;
|
||
|
|
var start = 0;
|
||
|
|
|
||
|
|
uploadProsses()
|
||
|
|
|
||
|
|
function uploadProsses(){
|
||
|
|
if (start < length) {
|
||
|
|
progress.el.width(Math.round(((start+1) / length) * 100)+'%').text(Math.round(((start+1) / length) * 100)+'%')
|
||
|
|
// document.getElementById('upload-file-'+a.id).innerText = Math.round(((start+1) / length) * 100)+'%';
|
||
|
|
$.ajax({
|
||
|
|
url: '/admin/upload',
|
||
|
|
method: 'POST',
|
||
|
|
dataType: 'text',
|
||
|
|
data: {
|
||
|
|
_token: $('meta[name=csrf-token]').attr('content'),
|
||
|
|
ok: rendr[start],
|
||
|
|
start: start,
|
||
|
|
tipe: 'upload'
|
||
|
|
},
|
||
|
|
success: function(e){
|
||
|
|
console.log(e.length)
|
||
|
|
start += 1;
|
||
|
|
uploadProsses();
|
||
|
|
}
|
||
|
|
})
|
||
|
|
}else{
|
||
|
|
$.ajax({
|
||
|
|
url: '/admin/upload',
|
||
|
|
method: 'POST',
|
||
|
|
dataType: 'text',
|
||
|
|
data: {
|
||
|
|
_token: $('meta[name=csrf-token]').attr('content'),
|
||
|
|
tipe: pathFile
|
||
|
|
},
|
||
|
|
success: function(e){
|
||
|
|
globalThis['cover'].el.attr('style', 'background-image: url("'+show+'")')
|
||
|
|
progress.el.width('0%').text('0%')
|
||
|
|
console.log('saved')
|
||
|
|
}
|
||
|
|
})
|
||
|
|
}
|
||
|
|
}
|
||
|
|
// uploadProsses()
|
||
|
|
}, false);
|
||
|
|
if (file) {
|
||
|
|
reader.readAsDataURL(file);
|
||
|
|
}
|
||
|
|
|
||
|
|
|
||
|
|
}
|
||
|
|
|
||
|
|
|
||
|
|
|
||
|
|
}
|
||
|
|
|
||
|
|
|
||
|
|
|
||
|
|
|
||
|
|
|
||
|
|
})
|
||
|
|
}
|
||
|
|
}
|