Merge branch 'master' of http://git.khansia.co.id/Nahrowi/oku-gis

# Conflicts:
#	static/css/layout-style.css
#	templates/layout/layout.html

API/urls.py

@@ -21,6 +21,9 @@ urlpatterns = [
     path('editkependudukan/', views.editkependudukan, name='kependudukan'),
     
     path('valideditkependudukan', views.valideditkependudukan, name='valideditkependudukan'),
+    
+    path('editspo', views.editpointsearch, name='editspo'),
+    
     path('editkantor', views.editpointka, name='editkantor'),
     path('editlakes', views.editpointlk, name='editlakes'),
     path('editpks', views.editpointpks, name='editpks'),
@@ -33,6 +36,7 @@ urlpatterns = [
     path('edittr', views.editpointtr, name='edittr'),
     path('editcb', views.editpointcb, name='editcb'),
     
+    path('saveeditspo', views.editsearchpoint, name='saveeditspo'),
     path('rumahsakit', views.editrumahsakit, name='rumahsakit'),
     path('cagarbudaya', views.editcagarbudaya, name='cagarbudaya'),
     path('kantor', views.editkantoradmin, name='kantor'),
@@ -55,6 +59,7 @@ urlpatterns = [
     path('c_bangunan', views.createbang, name='c_bangunan'),
     path('create-jalan', views.createjalan, name='create-jalan'),
     path('create-point', views.createpoint, name='create-point'),
+    path('c_lahan', views.createlahan, name='c_lahan'),
     
     path('edit-tuplah', login_required(views.edittuplah), name='edit-tuplah'),
     path('edit-tuplah-valid', views.edittuplahvalid, name='edit-tuplah-valid'),
@@ -75,6 +80,7 @@ urlpatterns = [
     path('search_lanjut', views.search_lanjut, name='search_lanjut'),  
     path('load_point_id', views.load_point_id),
     path('edit_detail_poin', views.edit_detail_poin),
+    path('dpoint', views.dpoint, name='dpoint'),
     
     path('download_perbaikan_data', views.download_perbaikan_data)
 ]
\ No newline at end of file

API/views.py

@@ -60,9 +60,25 @@ def search_auto(request):
 
 def tuplah(request):
     with conn.cursor() as desa:
-        desa.execute(f"SELECT json_build_object('type', 'Feature', 'legend', (a.id, a.legenda, st_area(a.geom::geography), a.gambar) ,'geometry', ST_AsGeoJSON( st_intersection(a.geom, b.geom):: geometry) :: json) from geo_tuplah a, geo_prov_kab b where b.kabupaten = 'OGAN KOMERING ULU'")
+        desa.execute(f"""SELECT
+                            json_build_object (
+                                'type',
+                                'Feature',
+                                'legend',
+                                ( A.ID, A.legenda, st_area ( A.geom :: geography ), A.gambar ),
+                                'geometry',
+                                ST_AsGeoJSON ( st_intersection ( A.geom, b.geom ) :: geometry ) :: json 
+                            ) 
+                        FROM
+                            geo_tuplah A,
+                            geo_prov_kab b 
+                        WHERE
+                            b.kabupaten = 'OGAN KOMERING ULU'""")
         all = desa.fetchall()
-
+        ltup = []
+        for i in all:
+            i[0]['legend']['f3'] = '{0:,.2f}'.format(i[0]['legend']['f3'])
+            ltup.append(i[0])
     data = {'tuplah':all}
     return Response(data)
 
@@ -256,6 +272,50 @@ def editpoly(request):
         
         return Response(build[0][0])
 
+@api_view(('GET',))
+@renderer_classes((TemplateHTMLRenderer, JSONRenderer))
+def editpointsearch(request):
+    if request.method == 'GET':
+        id_point = request.GET.get("id_point")
+        db_point = request.GET.get("db_point")
+        if (db_point == "geo_cagar_budaya" or db_point == "geo_terminal_bus"):
+            l = "a.luas"
+        else:
+            l = "a.luas_tanah"
+            
+        print(id_point, db_point, l)           
+        with conn.cursor() as buldings:
+            buldings.execute("""SELECT
+                                    json_build_object (
+                                        'type',
+                                        'Feature',
+                                        'administrasi',
+                                        (
+                                            a.id,
+                                            A.namobj,
+                                            A.remark,
+                                            A.alamat,
+                                            A.gambar,
+                                            A.perangkat,
+                                            A.tipe_gambar,
+                                            b.kabupaten,
+                                            c.kecamatan,
+                                            d.desa,
+                                            %s
+                                        ),
+                                        'geometry',
+                                        ST_AsGeoJSON ( A.geom :: geometry ) :: json 
+                                    ) 
+                                FROM
+                                    %s A 
+                                    JOIN geo_prov_kab b ON st_intersects ( A.geom, b.geom )
+                                    JOIN geo_data_kecamatan c ON st_intersects(A.geom, c.geom)
+                                    join geo_data_kelurahan d on st_intersects(A.geom, d.geom) 
+                                WHERE a.is_deleted = 0 and a.id = %s"""% (l, db_point, int(id_point)))
+            build = buldings.fetchall()
+        
+        return Response(build[0][0])
+
 @api_view(('GET',))
 @renderer_classes((TemplateHTMLRenderer, JSONRenderer))
 def editpointka(request):
@@ -1628,7 +1688,67 @@ def valideditkependudukan(request):
         data = data_kependuduk[0]
         return Response(respon)
 
+@api_view(('POST',))
+def editsearchpoint(request):
+    idsave = request.POST.get('idspo')
+    dbsave = request.POST.get('dbspo')
+    namobj = request.POST.get('namobj')
+    luas = request.POST.get('luas')
+    remark = request.POST.get('remark')
+    gambar = request.POST.get('gambar')
+    alamat = request.POST.get('alamat')
     
+    if (dbsave == "geo_cagar_budaya" or dbsave == "geo_terminal_bus"):
+        l = "luas"
+    else:
+        l = "luas_tanah"
+    
+    if alamat is None:
+        alamat = 'alamat'
+    elif alamat == '':
+        alamat = 'alamat'
+    else:
+        alamat = request.POST.get('alamat')
+    perangkat = request.POST.get('perangkat')
+    if perangkat is None:
+        perangkat = 'bpk'
+    elif perangkat == '':
+        perangkat = 'bpk'
+    else:
+        perangkat = request.POST.get('perangkat')
+        
+    point = request.POST.get("point")
+    cood_edit = json.loads(point)
+        
+    co_edit = cood_edit['geometry']['coordinates']
+    
+    file = request.FILES.get('file')
+    fss = FileSystemStorage(location='/var/www/django/oku.khansia.co.id/static/img/image/')
+    try:
+        format = (file.name).split(".")
+        num = random.randrange(1, 10000000000000)
+        namafile = f"{namobj}_{num}.{format[-1:][0]}"
+        filename = fss.save(namafile, file)
+        # print(file.name)
+        url = fss.url(filename)
+    except:
+        namafile = gambar
+    print(dbsave, co_edit, namobj, alamat, remark, l, luas, perangkat, namafile, idsave)
+    with conn.cursor() as editspo:
+        editspo.execute("""update %s set geom = st_geomfromgeojson('{"type":"Point", "coordinates":%s, "crs":{"type":"name","properties":{"name":"EPSG:4326"}}}'), namobj = '%s', alamat = '%s', remark = '%s', %s = '%s', perangkat = '%s', gambar = '%s' where id = %s"""% (dbsave, co_edit, namobj, alamat, remark, l, luas, perangkat, namafile, idsave))
+    conn.commit()    
+    
+    with conn.cursor() as hasiledit:
+        hasiledit.execute("""select namobj, alamat, remark, %s, gambar, perangkat from %s where id = %s"""% (l, dbsave, idsave))
+        hasileditspo = hasiledit.fetchall()
+    
+    data = hasileditspo[0]
+    data = {'status':'Success'}
+    data = 'SUCCESS'
+    info = 'data telah diperbaharui'
+    status = 0
+    respon={'data':data, 'info': info, 'status':status}
+    return Response(respon)
 
 @api_view(('POST',))
 def editrumahsakit(request):
@@ -2526,6 +2646,45 @@ def upload_tampak(request):
             
         return Response(respon)
 
+@api_view(('GET',))
+def createlahan(request):
+    poly_create = request.GET.get('polygon')
+    p_create = poly_create.replace('"','')
+    po_create = p_create.replace(', ','],[')
+    
+    name = request.GET.get('name')
+    tipelh = request.GET.get('tipelh')
+    tahun = request.GET.get('tahun')
+    luas = request.GET.get('luas')
+    obid = 666
+    provinsi = "Sumatera Selatan"
+    
+    gambar = "NONE"
+    
+    latlng = po_create.split("],[")[0]
+    print(p_create)
+    print(latlng)
+    
+    if name == "":
+        name = "Sumatera Selatan"
+    else:
+        name = name
+              
+    with conn.cursor() as lahan:
+        lahan.execute("""INSERT INTO geo_tuplah(geom, objectid_1, name, provinsi, pl_19_r, legenda, gambar) VALUES (ST_GeomFromEWKT('SRID=4326;MULTIPOLYGON(((%s)))'), '%s', '%s', '%s', '%s', '%s', '%s')"""% (p_create, obid, name, provinsi, tahun, tipelh, gambar))
+    conn.commit()
+    data = {'status':'Success'}
+    
+    data = 'SUCCESS'
+    info = 'data telah diperbaharui'
+    status = 0
+    # except:
+    #     data = 'Sorry'
+    #     info = 'Dalam Perbaikan'
+    #     status = 1
+    
+    respon={'data':data, 'info': info, 'status':status}
+    return Response(respon)
 
 import re
 @api_view(('POST',))
@@ -2775,6 +2934,28 @@ def createpoint(request):
 def filt_perbaikan_kecamatan(request):
     id_kec = request.GET.get('id_kec')
     
+    if id_kec == 'all_kecamatan':
+        res_kel = 'all_kecamatan'
+        
+        with conn.cursor() as data_per:
+            data_per.execute("""
+                            SELECT
+                                gl.NAME,
+                                tp.id_object,
+                                tp.NAME,
+                                tp.TYPE,
+                                tp.tgl_perbaikan,
+                                tp.anggaran,
+                                tp.tgl_selesai 
+                            FROM
+                                ( SELECT tbl_perbaikan.*, ROW_NUMBER ( ) OVER ( PARTITION BY id_object ORDER BY tgl_selesai DESC ) AS rn FROM tbl_perbaikan ) tp
+                                JOIN geo_label gl ON gl.ID = tp.type_id 
+                                JOIN geo_data_kecamatan gdk on st_intersects(st_setsrid(gdk.geom, 4326), st_setsrid(tp.geom, 4326))
+                            WHERE
+                                rn = 1
+                            """)
+            res_perbaikan = data_per.fetchall()
+    else:
         with conn.cursor() as kel:
             kel.execute("""SELECT ID,
                                 desa 
@@ -2785,6 +2966,7 @@ def filt_perbaikan_kecamatan(request):
                             """% int(id_kec))
             res_kel = kel.fetchall()
         
+        
         with conn.cursor() as data_per:
             data_per.execute("""
                             SELECT
@@ -2801,7 +2983,6 @@ def filt_perbaikan_kecamatan(request):
                                 JOIN geo_data_kecamatan gdk on st_intersects(st_setsrid(gdk.geom, 4326), st_setsrid(tp.geom, 4326))
                             WHERE
                                 rn = 1 and gdk.ID = %s
-                        LIMIT 10
                             """% int(id_kec))
             res_perbaikan = data_per.fetchall()
     
@@ -2881,7 +3062,8 @@ def user_data(request):
                     ag.name,
                     au.is_staff,
                     au.is_superuser,
-                    au.file_path
+                    au.file_path,
+                    au.phone
                 FROM
                     auth_user au,
                     auth_user_groups aug,
@@ -2905,7 +3087,8 @@ def user_data(request):
                     ag.name,
                     au.is_staff,
                     au.is_superuser,
-                    au.file_path
+                    au.file_path,
+                    au.phone
                 FROM
                     auth_user au,
                     auth_user_groups aug,
@@ -2922,6 +3105,13 @@ def user_data(request):
     
     user_res = []
     for rows in allUser:
+        if rows[8] == True and rows[9] == True:
+            jabatan = 'Super user'
+        elif rows[8] == True and rows[9] == False:
+            jabatan = 'Staff'
+        elif rows[8] == False and rows[9] == False:
+            jabatan = 'User'
+        
         datas = {
             "id": rows[0],
             "username": rows[1],
@@ -2930,7 +3120,9 @@ def user_data(request):
             "isactive": rows[4],
             "last": rows[5],
             "group": rows[7],
-            "filepath": rows[10]
+            "filepath": rows[10],
+            "phone": rows[11],
+            "jabatan": jabatan
         }
         user_res.append(datas)
 
@@ -3122,20 +3314,6 @@ def search_spes(request):
                                 WHERE 
                                     a.namobj ILIKE '%{}%' 
                                 UNION
-                                SELECT a.ID
-                                    ,
-                                    a.namobj,
-                                    a.remark,
-                                    a.geom,
-                                    'geo_spbu' 
-                                FROM
-                                    geo_spbu a 
-                                    JOIN geo_prov_kab b ON st_intersects ( A.geom, b.geom )
-                                    JOIN geo_data_kecamatan c ON st_intersects(A.geom, c.geom)
-                                    join geo_data_kelurahan d on st_intersects(A.geom, d.geom)
-                                WHERE 
-                                    a.namobj ILIKE '%{}%' 
-                                UNION
                                 SELECT a.ID
                                     ,
                                     a.namobj,
@@ -3192,7 +3370,7 @@ def search_spes(request):
                                 WHERE 
                                     a.namobj ILIKE '%{}%'
                                 LIMIT 10
-                                 """.format(inp, inp, inp, inp, inp, inp, inp, inp, inp, inp, inp))
+                                 """.format(inp, inp, inp, inp, inp, inp, inp, inp, inp, inp))
             s_point = search_point.fetchall()
         kill = s_point
     elif tipe == ' Bangunan':
@@ -3489,3 +3667,26 @@ def download_perbaikan_data(request):
         'data'  : per_res,
     }
     return Response(respon)
+
+@api_view(('POST',))
+def dpoint(request):
+    id = request.POST.get('id')
+    db = request.POST.get('db')
+    
+    try:
+        with conn.cursor() as editka:
+            editka.execute("""update %s set is_deleted = 1 where id = %s"""%(db, id))
+        conn.commit()    
+        
+        
+        data = {'status':'Success'}
+        data = 'SUCCESS'
+        info = 'data telah diperbaharui, akan terupdate setelah reload'
+        status = 0
+    except:
+        data = 'Sorry'
+        info = 'Gagal diperbaharui, hubungi developer'
+        status = 1
+    
+    respon={'data':data, 'info': info, 'status':status}
+    return Response(respon)
\ No newline at end of file

Application/views.py

@@ -619,8 +619,8 @@ class Dashboard(generic.TemplateView):
         'gardu_listrik':gardu_listrik_result,
         'global':all[0],
         'res_all':res_all,
-        'thisUser' : user_data
-        # ,'user_res':user_res
+        'thisUser' : user_data,
+        # 'user_res':user_res
         }
         return render (request, self.template_name, context)
     

myauth/views.py

@@ -49,7 +49,7 @@ class HomeView(View):
 
 class CustomLogoutView(LogoutView):
     template_name = 'user/login.html'
-    next_page = 'login'
+    next_page = '/'
 
 class Userprofile(generic.TemplateView):
     template_name = 'user/user_profile.html'
@@ -234,6 +234,7 @@ def addUser(request):
         password    = request.POST.get('username')
         iduser      = request.POST.get('id')
         isStaff     = request.POST.get('isStaff')
+        phone       = request.POST.get('phone')
 
         # arrGroup    = group.split("~")
 
@@ -245,8 +246,9 @@ def addUser(request):
         try:
             if iduser:
                 with conn.cursor() as cursor:
-                    cursor.execute("UPDATE auth_user SET first_name = '"+first_name+"', last_name = '"+last_name+"', email = '"+email+"' WHERE id="+iduser)
+                    cursor.execute("UPDATE auth_user SET first_name = '"+first_name+"', last_name = '"+last_name+"', email = '"+email+"', phone = '"+phone+"' WHERE id="+iduser)
                 
+                if group != 'none':
                     with conn.cursor() as curGroup:
                         curGroup.execute("DELETE FROM auth_user_groups WHERE user_id="+iduser)
 
@@ -282,14 +284,20 @@ def addUser(request):
             user.password    = make_password(password)
             user.save()
             
-            
             # add user to group
             userinsert   = User.objects.get(username=usernames)
                 
-            
             insertgroups = Group.objects.get(name=group)
             insertgroups.user_set.add(userinsert)
             
+            # add phone
+            
+            with conn.cursor() as cursor:
+                cursor.execute("UPDATE auth_user SET phone = '%s' WHERE username = '%s' and first_name = '%s' and last_name = '%s'"%(phone, usernames, first_name, last_name))
+            
+            
+            print(user)
+
             data = {
                 "code" : 0,
                 "info" : "success",
@@ -364,7 +372,7 @@ def deactivateUser(request):
         # # print(type(status)+status)
         # # print(type(True))
         # print(status == 'True')
-        if status == 'True':
+        if status == 'true':
             sql = "f"
         else:
             sql = "t"
@@ -424,7 +432,8 @@ def loadUserbyId(request):
                 "last"     : rows[2],
                 "group"    : group_res,
                 "is_staff" : rows[9],
-                "filepath" : rows[11]
+                "filepath" : rows[11],
+                "phone"    : rows[12]
             }
             user_res.append(datas)
 

static/css/layout-style.css

@@ -853,6 +853,43 @@ li.active>a:after {
 }
   
 
+input#change_stat {
+    display: block!important;
+}
+
+#help>div:nth-child(3)>div>div.panel.panel-flat.panel-collapsed>div.panel-body>table>tbody>tr {
+    border-top: 20px solid white;
+}
+
+#create,
+#create-jal {
+    border: transparent;
+    border-radius: 5px;
+    margin: 10px;
+}
+
+#map-create-all>div.leaflet-control-container>div.leaflet-top.leaflet-left>div:nth-child(1)>div>div>a.leaflet-draw-draw-marker {
+    width: 100%!important;
+    padding: 0px!important;
+}
+
+#informasi_create>div {
+    margin: 10px;
+}
+
+.navbar .navbar-inverse {
+    display: none
+}
+
+.page-content {
+    display: table;
+}
+
+body>ul>li.fixed-plugin.no3d.overlay-cek>div.dropdown.show-dropdown.open>ul {
+    width: 300px;
+    margin-left: -270px!important;
+}
+
 @media (max-width: 1025px) {
     .dock {
         position: absolute;
@@ -906,3 +943,134 @@ li.active>a:after {
         margin-right: auto !important;
     }
 }
+
+@media (max-width: 720px) {
+    /* html {
+        transform: rotate(-90deg);
+        transform-origin: left top;
+        width: 100vh;
+        height: 100vw;
+        overflow-x: hidden;
+        position: absolute;
+        top: 100%;
+        left: 0;
+    } */
+    .dock {
+        position: absolute;
+        top: -4px;
+        left: 95%;
+    }
+    #map>div.leaflet-control-container>div.leaflet-bottom.leaflet-right {
+        right: 5px;
+    }
+    #map .head {
+        top: 1%!important;
+    }
+    .dock {
+        left: 93%;
+    }
+    .navbar .navbar-inverse {
+        display: block
+    }
+    #map>div.row>div.col-sm-4.input-group.content-group.head {
+        width: 80%;
+        margin-top: -15px;
+        margin-left: 60px;
+    }
+    .user-p-nav {
+        display: none
+    }
+    li.fixed-plugin .dropdown-menu {
+        transform: scale(0.769230);
+        float: right;
+        position: absolute;
+        right: -550px;
+        width: 190px;
+        margin-left: -175px !important;
+        margin-top: -137px !important;
+        top: 20px;
+        margin-right: -550px;
+    }
+    li.overlay-cek .dropdown-menu {
+        transform: scale(0.769230);
+        float: right;
+        position: absolute;
+        right: -550px;
+        width: 190px;
+        margin-left: -175px !important;
+        margin-top: -127px !important;
+        top: 13px;
+        margin-right: -550px;
+    }
+    .menu-heading {
+        color: black;
+    }
+    .menu-list>a>img {
+        min-width: 120px!important;
+        min-height: 20px!important;
+        max-height: 90px!important;
+    }
+    #bottom-tab2>div>div:nth-child(2) {
+        display: none;
+    }
+    #panel-sm {
+        width: 100%!important;
+        top: 0px;
+    }
+    #panel-sm>div {
+        margin-left: 0px
+    }
+    body>div.page-container>div>div.sidebar.sidebar-main {
+        /* transform: rotate( 270deg);
+        height: 100%;
+        float: right;
+        margin-left: 282px;
+        top: -290px; */
+        display: block;
+    }
+    #bottom-tab1>div {
+        margin-left: 10px;
+    }
+    #bottom-tab1>div>div.col-sm-2 {
+        display: none;
+    }
+    #bottom-tab2>div>div:nth-child(4) {
+        margin-left: 18px;
+    }
+    #bottom-tab2>div>div {
+        margin-left: 10px;
+    }
+    #panel-sm>div>div.bod>div>ul {
+        background: #1B1F2D;
+    }
+    #panel-sm>div>div.bod>div>ul>li.active>a {
+        background: #353847;
+    }
+    #panel-sm>div>div.bod>div>ul {
+        border-top: none;
+        border-left: none;
+    }
+    #panel-sm>div>div.bod>div>div {
+        margin-left: 10px;
+    }
+    body>ul>li.fixed-plugin.no3d.overlay-cek>div.dropdown.show-dropdown.open>ul {
+        width: 270px!important;
+        margin-left: -245px!important;
+    }
+    body>div.page-container>div>div.sidebar.sidebar-main>div.sidebar-category.sidebar-category-visible>div>ul:nth-child(1) {
+        margin-bottom: 47vh!important;
+    }
+    body>div.page-container>div>div.sidebar.sidebar-main>div.sidebar-category.sidebar-category-visible>div>ul:nth-child(2)>li:nth-child(1)>a {
+        display: none
+    }
+    .modal-dialog {
+        margin-top: 0px;
+        top: 7%!important;
+    }
+    .modal-content {
+        margin-left: 20px!important;
+    }
+    #modal_detail_non_kelurahan>div>div>div.modal-body>fieldset>div>div:nth-child(2)>div>div {
+        margin-left: 5px
+    }
+}
\ No newline at end of file

static/css/st.css

+#map-jalan>div.leaflet-control-container>div.leaflet-top.leaflet-left>div>div {
+    display: none;
+}
+
+#tbody_user_list>tr>td.text-center>div>div.col-md-6.text-right>a>i {
+    font-size: 16px!important;
+    top: -3px;
+}
+
+.switch_custom {
+    position: relative;
+    display: inline-block;
+    width: 36px;
+    height: 20px;
+}
+
+.switch_custom input {
+    opacity: 0;
+    width: 0;
+    height: 0;
+}
+
+.slider {
+    position: absolute;
+    cursor: pointer;
+    top: 0;
+    left: 0;
+    right: 0;
+    bottom: 0;
+    background-color: rgb(59, 62, 71);
+    -webkit-transition: .4s;
+    transition: .4s;
+}
+
+.slider:before {
+    position: absolute;
+    content: "";
+    height: 18px;
+    width: 18px;
+    left: 1px;
+    bottom: 1px;
+    background-color: white;
+    -webkit-transition: .4s;
+    transition: .4s;
+}
+
+input:checked+.slider {
+    background-color: #2196F3;
+}
+
+input:focus+.slider {
+    box-shadow: 0 0 1px #2196F3;
+}
+
+input:checked+.slider:before {
+    -webkit-transform: translateX(16px);
+    -ms-transform: translateX(16px);
+    transform: translateX(16px);
+}
+
+
+/* Rounded sliders */
+
+.slider.round {
+    border-radius: 34px;
+}
+
+.slider.round:before {
+    border-radius: 50%;
+}
+
+#user_profile>.table-sm>thead>tr>th,
+.table-sm>tbody>tr>th,
+.table-sm>tfoot>tr>th,
+.table-sm>thead>tr>td,
+.table-sm>tbody>tr>td,
+.table-sm>tfoot>tr>td {
+    padding: 13px 20px;
+}
\ No newline at end of file

static/img/icon-1/MapTrifold.svg

-<svg width="32" height="32" viewBox="0 0 32 32" fill="none" xmlns="http://www.w3.org/2000/svg">
-<path d="M12 23L4 25V7L12 5" stroke="white" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"/>
-<path d="M20 27L12 23V5L20 9V27Z" stroke="white" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"/>
-<path d="M20 9L28 7V25L20 27" stroke="white" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"/>
+<svg width="26" height="26" viewBox="0 0 26 26" fill="none" xmlns="http://www.w3.org/2000/svg">
+<path d="M9.75 18.6875L3.25 20.3125V5.6875L9.75 4.0625" stroke="#E86250" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"/>
+<path d="M16.25 21.9375L9.75 18.6875V4.0625L16.25 7.3125V21.9375Z" stroke="#E86250" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"/>
+<path d="M16.25 7.3125L22.75 5.6875V20.3125L16.25 21.9375" stroke="#E86250" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"/>
 </svg>

static/img/icon-1/Vector2d.svg

+<svg width="24" height="19" viewBox="0 0 24 19" fill="none" xmlns="http://www.w3.org/2000/svg">
+<path d="M3.07985 17.7188L20.6739 17.7188C21.6456 17.7188 22.4333 16.931 22.4333 15.9593V3.64348C22.4333 2.67179 21.6456 1.88407 20.6739 1.88407L3.07985 1.88407C2.10816 1.88407 1.32045 2.67179 1.32045 3.64348V15.9593C1.32045 16.931 2.10816 17.7188 3.07985 17.7188Z" stroke="#212232" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"/>
+</svg>

static/js/action.js

@@ -152,12 +152,13 @@ function load_manage() {
         success: function(data) {
             var data_user = []
             var number = 0;
+            var all_id = []
+            var all_stat = []
 
             for (var i = 0; i < data['data'].length; i++) {
                 $("#list_point").addClass('list_point')
                 $("#list_user").addClass('list_user')
 
-
                 number += 1;
                 var id = data['data'][i]['id'];
                 var name = data['data'][i]['name'];
@@ -167,40 +168,66 @@ function load_manage() {
                 var last = data['data'][i]['last'];
                 var isactive = data['data'][i]['isactive'];
 
+                var no_telp = data['data'][i]['phone'];
+                var jabatan = data['data'][i]['jabatan'];
+
                 if (isactive == true) {
-                    var isac = `<span class="label label-success">Active</span>`
+                    var isac = 'checked'
                 } else {
-                    var isac = `<span class="label label-danger">Inactive</span>`
+                    var isac = ''
                 }
 
-
                 var data_gab = `<tr>
                         <td>` + number + `</td>
-                        <td>` + id + `</td>
                         <td>` + username + `</td>
                         <td>` + email + `</td>
+                        <td>` + no_telp + `</td>
+                        <td>` + jabatan + `</td>
                         <td>` + last + `</td>
-                        <td>` + isac + `</td>
-                        <td class="text-center">
-                            <ul class="icons-list">
-                                <li class="dropdown">
-                                    <a href="#" class="dropdown-toggle" data-toggle="dropdown">
-                                        <i class="icon-menu9"></i>
-                                    </a>
-
-                                    <ul class="dropdown-menu dropdown-menu-right">
-                                        <li><a onclick="switchuserstatus('` + id + `, ` + isactive + `')"><i class="icon-user-block"></i> Switch user status</a></li>
-                                        <li><a onclick="loaduserbyid('` + id + `')"><i class="icon-users"></i> Edit user</a></li>
-                                    </ul>
-                                </li>
-                            </ul>
+                        <td class="text-center" style='padding:0px;'>
+                        <div class='row'>
+                        <div class='col-md-6 text-right' style='margin-top:8px'>
+                            <a onclick="loaduserbyid('` + id + `')"><i class=" icon-pencil7"></i>Edit</a>
+                        </div>
+                        <div class='col-md-6 text-left'>
+                            <div class="checkbox switch_custom">
+                                <label>
+                                    <input type="checkbox" class="slider round" id="checkbox` + id + `" onclick="switchuserstatus('` + id + `, ` + isactive + `','` + id + `')" ` + isac + ` >
+                                    <span class="slider round"></span>
+                                </label>
+                            </div>
+                        </div>  
+                    </div>
                         </td>
 
                     </tr>`;
+
                 data_user.push(data_gab)
+                all_id.push(id)
+                all_stat.push(isactive)
             };
+
             $("#tbody_user_list").html(data_user)
 
+            if (Array.prototype.forEach) {
+                var elems = Array.prototype.slice.call(document.querySelectorAll('.switchery'));
+                elems.forEach(function(html) {
+                    var switchery = new Switchery(html);
+                });
+            } else {
+                var elems = document.querySelectorAll('.switchery');
+                for (var i = 0; i < elems.length; i++) {
+                    var switchery = new Switchery(elems[i]);
+                }
+            }
+            $(".switch").bootstrapSwitch();
+            var primary_s = document.querySelectorAll("[class^=switchery-custom-x");
+
+            for (var z = 0; z < primary_s.length; z++) {
+                var switchery = new Switchery(primary_s[z], { color: '#5A9AFB', secondaryColor: '#3B3E47', jackColor: '#fff', jackSecondaryColor: '#fff' });
+            }
+
+
             var data_point = []
             var number2 = 0;
 
@@ -245,38 +272,19 @@ function load_manage() {
                     orderable: false,
                     width: '10%',
                     targets: [0],
-                }, {
-                    orderable: false,
-                    width: '10%',
-                    targets: [1],
-
-                }, {
-                    orderable: false,
-                    width: '20%',
-                    targets: [2],
-
-                }, {
-                    orderable: false,
-                    width: '20%',
-                    targets: [3],
-
-                }, {
-                    orderable: false,
-                    width: '20%',
-                    targets: [4],
-
-                }, {
-                    orderable: false,
-                    width: '10%',
-                    targets: [5],
-
-                }, {
-                    orderable: false,
-                    width: '10%',
-                    targets: [6],
-
                 }, ],
                 dom: '<"float-left "B>frtip',
+                buttons: [{
+                    text: 'Add new button',
+                    action: function(e, dt, node, config) {
+                        dt.button().add(1, {
+                            text: 'Button ' + (counter++),
+                            action: function() {
+                                this.remove();
+                            }
+                        });
+                    }
+                }],
                 language: {
                     search: ' _INPUT_',
                     searchPlaceholder: 'Data User...',
@@ -288,6 +296,7 @@ function load_manage() {
                         'previous': '&larr;'
                     }
                 },
+
                 drawCallback: function() {
                     $(this).find('tbody tr').slice(-3).find('.dropdown, .btn-group').addClass('dropup');
                 },
@@ -485,7 +494,7 @@ function download_point_list(type, fn, dl) {
 
 function loadGroups(isSelect) {
     var isObject = {}
-    console.log(isSelect)
+
     isObject.func_name = "loadGroups";
 
     $.ajax({
@@ -496,7 +505,7 @@ function loadGroups(isSelect) {
         success: function(data) {
 
             let response = data;
-            console.log(response)
+
             if (response.code == 0) {
                 var groups = response.data;
                 var html = `<option value="null" selected disabled>-- Pilih Group --</option>`;
@@ -506,7 +515,7 @@ function loadGroups(isSelect) {
                             for (j in isSelect) {
                                 if (isSelect[j] == groups[i]) {
                                     html += `<option value="` + groups[i] + `" selected>` + groups[i] + `</option>`;
-                                    console.log(groups[i])
+
                                 } else {
                                     html += `<option value="` + groups[i] + `">` + groups[i] + `</option>`;
                                 }
@@ -525,7 +534,7 @@ function loadGroups(isSelect) {
 
                 $("#select_group").html(html);
                 $("#select_group_parent").html(html);
-                console.log(html)
+
             } else {
                 $("#select_group").html("group tidak tersedia");
                 $("#select_group_parent").html("group tidak tersedia");
@@ -535,36 +544,16 @@ function loadGroups(isSelect) {
     });
 }
 
+function swal_switch(isConfirm, c, isObject) {
+    var checkbox = document.getElementById("checkbox" + c);
 
-function switchuserstatus(id, isactive) {
-    var isObject = {}
-    var params = id.split(",");
-
-    isObject.id = params[0];
-    isObject.stat = params[1].replace(" ", "");
-
-    console.log(params)
-    if (isObject.stat == "True") {
-        var title = "Nonaktifkan";
-        var text = "User tidak akan bisa login jika dinonaktifkan!";
+    if (isConfirm == true) {
+        if (checkbox.checked == true) {
+            checkbox.checked = true
         } else {
-        var title = "Aktifkan";
-        var text = "User dapat kembali login jika diaktifkan!";
+            checkbox.checked = false
         }
 
-    swal({
-        title: title + " user?",
-        text: text,
-        type: "warning",
-        showCancelButton: true,
-        confirmButtonClass: "btn-danger",
-        confirmButtonText: "Ya!",
-        cancelButtonText: "Tidak!",
-        closeOnConfirm: false,
-        closeOnCancel: false
-    }, function(isConfirm) {
-        if (isConfirm == true) {
-
         $.ajax({
             url: "/switchStatus/",
             data: isObject,
@@ -574,7 +563,7 @@ function switchuserstatus(id, isactive) {
 
                 let response = data;
 
-                    if (isObject.stat == "True") {
+                if (isObject.stat == "true") {
                     var inf = "dinonaktifkan"
                 } else {
                     var inf = "diaktifkan"
@@ -587,7 +576,12 @@ function switchuserstatus(id, isactive) {
                         icon: "success",
                         confirmButtonColor: "#00BCD4"
                     }, function(isok) {
-                            load_manage()
+
+                        if (inf == "diaktifkan") {
+                            $(this).checked = true;
+                        } else {
+                            $(this).checked = false;
+                        }
                     })
                 } else {
                     alert("no data in database")
@@ -596,17 +590,51 @@ function switchuserstatus(id, isactive) {
             }
         });
     } else {
+        if (checkbox.checked == true) {
+            checkbox.checked = false
+        } else {
+            checkbox.checked = true
+        }
         swal("Dibatalkan", "User status tidak berubah", "error");
     }
+}
+
+
+function switchuserstatus(id, c) {
+    var isObject = {}
+    var params = id.split(",");
+
+
+    isObject.id = params[0];
+    isObject.stat = params[1].replace(" ", "");
+
+
+    if (isObject.stat == "true") {
+        var title = "Nonaktifkan";
+        var text = "User tidak akan bisa login jika dinonaktifkan!";
+    } else {
+        var title = "Aktifkan";
+        var text = "User dapat kembali login jika diaktifkan!";
+    }
+
+    swal({
+        title: title + " user?",
+        text: text,
+        type: "warning",
+        showCancelButton: true,
+        confirmButtonClass: "btn-danger",
+        confirmButtonText: "Ya!",
+        cancelButtonText: "Tidak!",
+        closeOnConfirm: false,
+        closeOnCancel: false
+    }, function(isConfirm) {
+        swal_switch(isConfirm, c, isObject)
     });
 
 }
 
 function loaduserbyid(id) {
-    $("#modal_edit_user").modal("show")
     var isObject = {};
-    $(".modstit").html("Update User")
-    $("#inUsername").attr("disabled", true)
 
     isObject.id = id;
     $("#iduser").val(id)
@@ -617,16 +645,21 @@ function loaduserbyid(id) {
         dataType: 'json',
         type: 'post',
         success: function(data) {
+            $("#modal_edit_user").modal("show")
+            $(".modstit").html("Update User")
+            $("#inUsername").attr("disabled", true)
+
 
             let response = data;
 
             if (response.code == 0) {
                 var user = response.data;
-                console.log(user)
+
                 $("#inUsername").val(user.username);
                 $("#inNameF").val(user.firstname);
                 $("#inNameL").val(user.lastname);
                 $("#inEmail").val(user.email);
+                $("#phone").val(user.phone)
                 if (user.is_staff) {
                     $('input[name=isStaff][value=true]').attr('checked', true)
                 } else {
@@ -730,16 +763,6 @@ function modal_detail_point_pengaturan(id, db) {
 
 
 $("#saveuser").on("click", function() {
-    addUser()
-})
-
-// function destroyfade() {
-//     $(".modal-backdrop").css("display", "none")
-//     $(".modal-backdrop").removeClass('show');
-//     $("body").css('padding-right', '0px !important')
-// }
-
-function addUser() {
     var isObject = {};
     var ars = ''
     var group = $("#select_group").val();
@@ -749,18 +772,11 @@ function addUser() {
         isObject.id = iduser;
     }
 
-    // for(i in group){
-    //     if(i < group.length-1){
-    //         ars += group[i]+"~";
-    //     }else{
-    //         ars += group[i];
-    //     }
-    // }
-    // return false
     isObject['username'] = $("#inUsername").val();
     isObject['first_name'] = $("#inNameF").val();
     isObject['last_name'] = $("#inNameL").val();
     isObject['email'] = $("#inEmail").val();
+    isObject['phone'] = $("#phone").val();
     isObject.group = group
     isObject.isStaff = $('input[name="isStaff"]:checked').val();
 
@@ -774,8 +790,6 @@ function addUser() {
 
             if (response.code == 0) {
                 $("#modal_edit_user").css('display', 'none');
-                // destroyfade();
-
                 swal({
                     title: response.info,
                     text: response.data + "reload untuk mendapatkan update",
@@ -795,7 +809,21 @@ function addUser() {
             }
         }
     });
-}
+})
+
+$("#add_user").click(function() {
+    $("#modal_edit_user").modal("show")
+    $(".modstit").html("Tambah User")
+    $("#inUsername").attr("disabled", false)
+    $("#group_use").css("display", "none")
+
+    $("#inUsername").val("")
+    $("#inNameF").val("")
+    $("#inNameL").val("")
+    $("#inEmail").val("")
+    $("#phone").val("")
+    $("#iduser").val("")
+})
 
 $("#saveedit_p").click(function() {
     var idka = $('#id_adm_edit').val();
@@ -988,8 +1016,16 @@ $("#btnsaveuser").click(function() {
     changepassword()
 })
 
+// function switchuserstatuss(id, isactive) {
+//     var checkbox = $(this);
 
+//     if (checkbox.is(":checked")) {
+//         e.preventDefault();
+//         return false;
+//     }else{
 
+//     }
+// }
 
 document.querySelector("#map-create-all > div.leaflet-control-container > div.leaflet-bottom.leaflet-right > div").html(`Powered by <a href="https://khansia.co.id" target="_blank">Khansia</a> with <a href="https://leafletjs.com" target="_blank">Leaflet</a>`)
 document.querySelector("#map-create-all > div.leaflet-control-container > div.leaflet-bottom.leaflet-right > div").css("right", "50px")
\ No newline at end of file

static/js/maps.js

@@ -24,13 +24,17 @@ $("#sidebar").hide()
 maps = L.tileLayer('https://api.mapbox.com/styles/v1/{id}/tiles/{z}/{x}/{y}?access_token=pk.eyJ1IjoibWFwYm94IiwiYSI6ImNpejY4NXVycTA2emYycXBndHRqcmZ3N3gifQ.rJcFIG214AriISLbB6B5aw', { id: 'mapbox/light-v9', tileSize: 512, zoomOffset: -1 }).addTo(map);
 
 OpenStreetMap.onclick = function() {
-    maps = L.tileLayer("https://mt1.google.com/vt/lyrs=m&x={x}&y={y}&z={z}&s=Gal&apistyle=s.t:0|s.e:l|p.v:off", {
+    map.removeLayer(maps)
+        //maps = L.tileLayer("https://mt1.google.com/vt/lyrs=m&x={x}&y={y}&z={z}&s=Gal&apistyle=s.t:0|s.e:l|p.v:off", {
+    maps = L.tileLayer("https://{s}.tile.openstreetmap.org/{z}/{x}/{y}.png", {
         maxZoom: 22,
         minZoom: 3,
     }).addTo(map);
+
 };
 
 WorldImagery.onclick = function() {
+    map.removeLayer(maps)
         // https://{s}.tiles.wmflabs.org/osm-no-labels/{z}/{x}/{y}.png
     maps = L.tileLayer("https://server.arcgisonline.com/ArcGIS/rest/services/World_Imagery/MapServer/tile/{z}/{y}/{x}", {
         maxZoom: 22,
@@ -39,12 +43,17 @@ WorldImagery.onclick = function() {
 };
 
 BingSatellite.onclick = function() {
-
+    map.removeLayer(maps)
     maps = L.tileLayer.bing({ bingMapsKey: BING_KEY, maxNativeZoom: 22 }).addTo(map);
+    setTimeout(function() {
+        $('.leaflet-bottom.leaflet-right>.leaflet-control-attribution.leaflet-control').html(`Powered by <a href="https://khansia.co.id" target="_blank">Khansia</a> with <a href="https://leafletjs.com" target="_blank">Leaflet</a>`)
+    }, 100);
+
 };
 
 GoogleSatellite.onclick = function() {
 
+    map.removeLayer(maps)
     maps = L.tileLayer('http://mt0.google.com/vt/lyrs=y&hl=en&x={x}&y={y}&z={z}&s=Gal&apistyle=s.t:0|s.e:l|p.v:off', {
         maxZoom: 22,
         minZoom: 4,

static/js/pages/form_checkboxes_radios.js

 /* ------------------------------------------------------------------------------
- *
- *  # Styled checkboxes, radios and file input
- *
- *  Specific JS code additions for form_checkboxes_radios.html page
- *
- *  Version: 1.0
- *  Latest update: Aug 1, 2015
- *
- * ---------------------------------------------------------------------------- */
+*
+*  # Styled checkboxes, radios and file input
+*
+*  Specific JS code additions for form_checkboxes_radios.html page
+*
+*  Version: 1.0
+*  Latest update: Aug 1, 2015
+*
+* ---------------------------------------------------------------------------- */
 
 $(function() {
 
@@ -21,7 +21,8 @@ $(function() {
         elems.forEach(function(html) {
             var switchery = new Switchery(html);
         });
-    } else {
+    }
+    else {
         var elems = document.querySelectorAll('.switchery');
         for (var i = 0; i < elems.length; i++) {
             var switchery = new Switchery(elems[i]);
@@ -29,28 +30,8 @@ $(function() {
     }
 
     // Colored switches
-
-    /* ini ngaruh sama element yang punya class "switchery-" */
-    var primary = document.querySelectorAll("[class^=switchery-");
-    /* ------------------- */
-
-    console.log(primary);
-    var switcheryCustom = document.querySelector('.switchery-custom');
-    var switchery = new Switchery(switcheryCustom, { color: '#5A9AFB', secondaryColor: '#3B3E47', jackColor: '#fff', jackSecondaryColor: '#fff' });
-
-    // var switchery = new Switchery(primary[0], { color: '#2196F3' });
-
-
-    /* inisialisasi switchery buat class "switchery-" */
-    for (var z = 0; z < primary.length; z++) {
-        var switchery = new Switchery(primary[z], { color: '#5A9AFB', secondaryColor: '#3B3E47', jackColor: '#fff', jackSecondaryColor: '#fff' });
-    }
-    /* ------------------ */
-
-    var switcheryCustom1 = document.querySelector('.switchery-custom1');
-    var switchery = new Switchery(switcheryCustom1, { color: '#5A9AEB', secondaryColor: '#3B3E47', jackColor: '#fff', jackSecondaryColor: '#fff' });
-    // var switchery = new Switchery(primary, { color: '#2196F3' });
-
+    var primary = document.querySelector('.switchery-primary');
+    var switchery = new Switchery(primary, { color: '#2196F3' });
 
     var danger = document.querySelector('.switchery-danger');
     var switchery = new Switchery(danger, { color: '#EF5350' });
@@ -59,7 +40,7 @@ $(function() {
     var switchery = new Switchery(warning, { color: '#FF7043' });
 
     var info = document.querySelector('.switchery-info');
-    var switchery = new Switchery(info, { color: '#00BCD4' });
+    var switchery = new Switchery(info, { color: '#00BCD4'});
 
 
 

templates/includes/css-o.html

@@ -67,7 +67,6 @@
     .active {
         display: block;
     }
-    
     /* #button_hide {
         line-height: 15px;
         width: 40px;
@@ -139,10 +138,134 @@
         display: none!important;
     }
 </style>
+
+
+{% if user.is_authenticated %}
 <style>
+    #btn_perbaikan_jalan {
+        display: block;
+    }
+    
+    .btn_action {
+        display: block;
+    }
+    
     #btn_edit_bangunan {
+        display: block;
+    }
+    
+    #btn_delete_bangunan {
+        display: block;
+    }
+    
+    #btn_edit_kelurahan {
+        display: block;
+        top: 5px;
+    }
+    
+    #btn_edit_kelurahan :hover {
+        border-color: #DADCE0;
+        background-color: #F1F3F4;
+    }
+    
+    #btn_edit_tuplah {
+        display: block;
+    }
+    
+    #btn_jalan {
+        display: block;
+    }
+    
+    #btn_edit_gl {
+        display: block;
+    }
+    
+    #btn_edit_lk {
+        display: block;
+    }
+    
+    #btn_edit_puskes {
+        display: block;
+    }
+    
+    #btn_edit_adm {
+        display: block;
+    }
+    
+    #btn_delete_adm {
+        display: block;
+    }
+    
+    #btn_edit_rs {
+        display: block;
+    }
+    
+    #btn_edit_si {
+        display: block;
+    }
+    
+    #btn_edit_sp {
+        display: block;
+    }
+    
+    #btn_edit_spbu {
+        display: block;
+    }
+    
+    #btn_edit_st {
+        display: block;
+    }
+    
+    #btn_edit_tr {
+        display: block;
+    }
+    
+    #btn_edit_cb {
+        display: block;
+    }
+    
+    #btn_detail_per_bang {
+        display: block;
+    }
+    
+    #btn_perbaikan_bangunan {
+        display: block;
+    }
+    
+    #btn_upload_tampak {
+        display: block;
+    }
+    
+    #map>div.leaflet-control-container>div.leaflet-bottom.leaflet-right {
+        right: 65px;
+    }
+    
+    #map>div.leaflet-control-container>div.leaflet-bottom.leaflet-right>div.leaflet-control-attribution.leaflet-control {
+        right: 0px;
+    }
+</style>
+{% else %}
+<style>
+    .tombol_save_create {
+        display: none;
+    }
+    
+    .tombol-edit {
+        display: none;
+    }
+    
+    #btn_perbaikan_jalan {
+        display: none;
+    }
+    
+    .btn_action {
         display: none;
     }
+    
+    #btn_edit_bangunan {
+        display: none;
+    }
+    
     #btn_delete_bangunan {
         display: none;
     }
@@ -152,7 +275,7 @@
         top: 5px;
     }
     
-    #btn_edit_kelurahan :hover{
+    #btn_edit_kelurahan :hover {
         border-color: #DADCE0;
         background-color: #F1F3F4;
     }
@@ -184,6 +307,7 @@
     #btn_edit_adm {
         display: none;
     }
+    
     #btn_delete_adm {
         display: none;
     }
@@ -228,7 +352,9 @@
         display: none;
     }
     
-    .leaflet-popup{
+    .leaflet-popup {
         display: none;
     }
 </style>
+
+{% endif %}
\ No newline at end of file

templates/includes/js-m.html

@@ -624,14 +624,7 @@
                                                             <span>` + raja + `</span>
                                                         </div>
                                                     </div>
-                                                    <div>
-                                                        <div>
-                                                            <span>Perbaikan Terakhir</span>
-                                                        </div>
-                                                        <div>
-                                                            <span>` + perbaikan_pt + `</span>
-                                                        </div>
-                                                    </div>
+                                                    
                                                     
                                                     
                                                     `);
@@ -652,8 +645,10 @@
                                                     <h6 class="modal-title">Delete Point</h6>
                                             </div>
                                             <div class="modal-body" style="overflow-x: hidden;max-height: 300px;overflow-y: scroll;padding-left: 15px;">
-                                                <div id="map-for-delete" style="width: 400px;height: 300px;position: relative;margin-left: 100px;"></div>
+                                                <div id="map-for-delete" style="width: 400px;height: 300px;position: relative;margin: 10px;"></div>
                                                 <input style="display:none;" id="id_adm_del" type="text" class="form-control" value="` + feature.administrasi.f15 + `"required>
+                                                <input style="display:none;" id="nama_table" type="text" class="form-control" value="geo_kantor_administrasi" required>
+                                                
                                                 <div class="row" style="margin-top: 15px;">
                                                     <div class="form-group">
                                                         <label class="col-lg-3 control-label lbl-top" style="margin-top: 15px;">Nama Point</label>
@@ -679,7 +674,7 @@
                                             <hr>
                                             <div class="modal-footer">
                                                 
-                                                <button type="button" class="btn btn-info" id="savedeleteadm">Hapus</button>
+                                                <button type="button" class="btn btn-info" id="deletepointot">Hapus</button>
                                             </div>
                                         </div>
                                     </div>`;
@@ -703,7 +698,7 @@
                                                             <div class="tab-content">
 
                                                                 <div class="tab-pane active" id="left-tab1-feas-upli">
-                                                                        <div id="map-for-edit" style="width: 400px;height: 300px;position: relative;margin-left: 100px;"></div>
+                                                                        <div id="map-for-edit" style="height: 300px;position: relative;margin: 10px;"></div>
                                                                         <div class="form-group">
                                                                             <label class="col-lg-2 control-label" style="margin-top:10px">Image</label>
                                                                             <div class="col-lg-9" style="margin-top:10px">
@@ -962,14 +957,16 @@
         })
     });
 
-    $(document).on("click", "#savedeleteadm", function() {
+    $(document).on("click", "#deletepointot", function() {
         var idka = $('#id_adm_del').val();
         var poi = $('#coordinateZoneedit_adm_del').val();
+        var db = $('#nama_table').val();
         var data = new FormData();
         data.append('id', idka)
+        data.append('db', db)
 
         $.ajax({
-            url: "{% url 'api:dkantor' %}",
+            url: "{% url 'api:dpoint' %}",
             data: data,
             dataType: 'json',
             type: 'POST',
@@ -991,8 +988,8 @@
                     })
                 } else {
                     swal({
-                        title: 'Error',
-                        text: 'Hubungi Mereka',
+                        title: 'Oops',
+                        text: response.data,
                         type: "warning",
                         icon: "error",
                         confirmButtonColor: "#00BCD4"
@@ -1127,6 +1124,9 @@
                         $(".btn_action").html(`<div class="tombol-edit-keterangan text-center" style="background-color: #5A9AFB;position: absolute;width: 40px;height: 40px;bottom: 2px;right: 5px;border: 1pt solid rosybrown;border-radius: 8px;">
                                                         <a href="#" id="btn_edit_lk" data-toggle="modal" data-target="#modal_adm" data-backdrop="static" data-keyboard="false" class="btn" style="border-bottom-left-radius: 8px;border-top-right-radius: 8px;width: 100%;height: 100%;bottom: 0px;color: white;"  title="Edit"><i class="icon-pencil5"></i></a>
                                                         </div>
+                                                        <div class="tombol-delete-keterangan text-center" style="background-color: indianred;position: absolute;width: 40px;height: 40px;bottom: 2px;right: 50px;border: 1pt solid rosybrown;border-radius: 10px;">
+                                                            <a href="#" id="btn_delete_adm" data-toggle="modal" data-target="#modald_adm" data-backdrop="static" data-keyboard="false" class="btn" style="border-bottom-left-radius: 8px;border-top-right-radius: 8px;width: 100%;height: 100%;bottom: 0px;color: white;" title="Delete"><i class="icon-eraser2"></i></a>
+                                                        </div>
                                                         `)
 
 
@@ -1221,7 +1221,7 @@
 
                                                     <div class="tab-pane active" id="right-tab2-feas-upli">
                                                         <div class="form-group">
-                                                            <div id="map-for-edit" style="width: 400px;height: 300px;position: relative;margin-left: 100px;"></div>
+                                                            <div id="map-for-edit" style="height: 300px;position: relative;margin: 10px;"></div>
                                                             <div class="form-group">
                                                                 <label class="col-lg-2 control-label" style="margin-top:10px">Image</label>
                                                                 <div class="col-lg-9" style="margin-top:10px">
@@ -1244,6 +1244,45 @@
                                     </div>
                             </div>
                         </div>`;
+
+                        content_delete_adm = `
+                            <div class="modal-dialog md">
+                                        <div class="modal-content">
+                                            <div class="modal-header bg-info">
+                                                    <button type="button" class="close" data-dismiss="modal" onclick="destroyfade()">&times;</button>
+                                                    <h6 class="modal-title">Delete Point</h6>
+                                            </div>
+                                            <div class="modal-body" style="overflow-x: hidden;max-height: 300px;overflow-y: scroll;padding-left: 15px;">
+                                                <input style="display:none;" id="id_adm_del" type="text" class="form-control" value="` + feature.administrasi.f15 + `"required>
+                                                <input style="display:none;" id="nama_table" type="text" class="form-control" value="geo_layanan_kesehatan" required>
+                                                <div class="row" style="margin-top: 15px;">
+                                                    <div class="form-group">
+                                                        <label class="col-lg-3 control-label lbl-top" style="margin-top: 15px;">Nama Point</label>
+                                                        <div class="col-lg-9">
+                                                            <input id="namobj_adm_del" type="text" class="form-control" value="` + feature.administrasi.f1 + `"required disabled>    
+                                                        </div>
+                                                        
+                                                    </div>
+                                                </div>
+
+                                                <div class="row" style="margin-top: 15px;">
+                                                    <div class="form-group">
+                                                        <label class="col-lg-3 control-label lbl-top" style="margin-top: 15px;">Tipe Point</label>
+                                                        <div class="col-lg-8">
+                                                            <input id="remark_adm_del" type="text" class="form-control" value="` + feature.administrasi.f2 + `"required disabled>
+                                                        </div>
+                                                    </div>
+                                                </div>
+
+                                            </div>
+                                            <hr>
+                                            <div class="modal-footer">
+                                                <button type="button" class="btn btn-info" id="deletepointot">Hapus</button>
+                                            </div>
+                                        </div>
+                                    </div>`;
+
+                        $("#modald_adm").html(content_delete_adm)
                         $("#modal_adm").html(content_edit_lk)
                         panel_samp();
                     })
@@ -1503,6 +1542,9 @@
                         $(".btn_action").html(`<div class="tombol-edit-keterangan text-center" style="background-color: #5A9AFB;position: absolute;width: 40px;height: 40px;bottom: 2px;right: 5px;border: 1pt solid rosybrown;border-radius: 8px;">
                                                         <a href="#" id="btn_edit_puskes" data-toggle="modal" data-target="#modal_adm" data-backdrop="static" data-keyboard="false" class="btn" style="border-bottom-left-radius: 8px;border-top-right-radius: 8px;width: 100%;height: 100%;bottom: 0px;color: white;"  title="Edit"><i class="icon-pencil5"></i></a>
                                                         </div>
+                                                        <div class="tombol-delete-keterangan text-center" style="background-color: indianred;position: absolute;width: 40px;height: 40px;bottom: 2px;right: 50px;border: 1pt solid rosybrown;border-radius: 10px;">
+                                                            <a href="#" id="btn_delete_adm" data-toggle="modal" data-target="#modald_adm" data-backdrop="static" data-keyboard="false" class="btn" style="border-bottom-left-radius: 8px;border-top-right-radius: 8px;width: 100%;height: 100%;bottom: 0px;color: white;" title="Delete"><i class="icon-eraser2"></i></a>
+                                                        </div>
                                                         `)
                         content_edit_puskes = `
                         <div class="modal-dialog md">
@@ -1530,6 +1572,7 @@
                                                                     <div class="form-group">
                                                                             <input style="display:none;" id="id_puskes_edit" type="text" class="form-control" value="` + feature.administrasi.f15 + `"required>
                                                                             <input style="display:none;" id="coordinateZoneedit_puskes_edit" type="text" class="form-control" value=""required>
+                                                                            
                                                                     </div>
 
                                                                 <div class="row" style="margin-top: 15px;">
@@ -1594,7 +1637,7 @@
 
                                                     <div class="tab-pane active" id="right-tab2-feas-upli">
                                                         <div class="form-group">
-                                                            <div id="map-for-edit" style="width: 400px;height: 300px;position: relative;margin-left: 100px;"></div>
+                                                            <div id="map-for-edit" style="height: 300px;position: relative;margin: 10px;"></div>
                                                             <div class="form-group">
                                                                 <label class="col-lg-2 control-label" style="margin-top:10px">Image</label>
                                                                 <div class="col-lg-9" style="margin-top:10px">
@@ -1616,6 +1659,45 @@
                                     </div>
                             </div>
                         </div>`;
+
+                        content_delete_point = `
+                            <div class="modal-dialog md">
+                                        <div class="modal-content">
+                                            <div class="modal-header bg-info">
+                                                    <button type="button" class="close" data-dismiss="modal" onclick="destroyfade()">&times;</button>
+                                                    <h6 class="modal-title">Delete Point</h6>
+                                            </div>
+                                            <div class="modal-body" style="overflow-x: hidden;max-height: 300px;overflow-y: scroll;padding-left: 15px;">
+                                                <input style="display:none;" id="id_adm_del" type="text" class="form-control" value="` + feature.administrasi.f15 + `"required>
+                                                <input style="display:none;" id="nama_table" type="text" class="form-control" value="geo_puskesmas" required>
+                                                <div class="row" style="margin-top: 15px;">
+                                                    <div class="form-group">
+                                                        <label class="col-lg-3 control-label lbl-top" style="margin-top: 15px;">Nama Point</label>
+                                                        <div class="col-lg-9">
+                                                            <input id="namobj_adm_del" type="text" class="form-control" value="` + feature.administrasi.f1 + `"required disabled>    
+                                                        </div>
+                                                        
+                                                    </div>
+                                                </div>
+
+                                                <div class="row" style="margin-top: 15px;">
+                                                    <div class="form-group">
+                                                        <label class="col-lg-3 control-label lbl-top" style="margin-top: 15px;">Tipe Point</label>
+                                                        <div class="col-lg-8">
+                                                            <input id="remark_adm_del" type="text" class="form-control" value="` + feature.administrasi.f2 + `"required disabled>
+                                                        </div>
+                                                    </div>
+                                                </div>
+
+                                            </div>
+                                            <hr>
+                                            <div class="modal-footer">
+                                                <button type="button" class="btn btn-info" id="deletepointot">Hapus</button>
+                                            </div>
+                                        </div>
+                                    </div>`;
+
+                        $("#modald_adm").html(content_delete_point)
                         $("#modal_adm").html(content_edit_puskes)
                         panel_samp();
                     })
@@ -1874,6 +1956,9 @@
                         $(".btn_action").html(`<div class="tombol-edit-keterangan text-center" style="background-color: #5A9AFB;position: absolute;width: 40px;height: 40px;bottom: 2px;right: 5px;border: 1pt solid rosybrown;border-radius: 8px;">
                                                         <a href="#" id="btn_edit_rs" data-toggle="modal" data-target="#modal_adm" data-backdrop="static" data-keyboard="false" class="btn" style="border-bottom-left-radius: 8px;border-top-right-radius: 8px;width: 100%;height: 100%;bottom: 0px;color: white;" title="Edit"><i class="icon-pencil5"></i></a>
                                                         </div>
+                                                        <div class="tombol-delete-keterangan text-center" style="background-color: indianred;position: absolute;width: 40px;height: 40px;bottom: 2px;right: 50px;border: 1pt solid rosybrown;border-radius: 10px;">
+                                                            <a href="#" id="btn_delete_adm" data-toggle="modal" data-target="#modald_adm" data-backdrop="static" data-keyboard="false" class="btn" style="border-bottom-left-radius: 8px;border-top-right-radius: 8px;width: 100%;height: 100%;bottom: 0px;color: white;" title="Delete"><i class="icon-eraser2"></i></a>
+                                                        </div>
                                                         `)
 
                         content_edit_rs = `
@@ -1902,6 +1987,7 @@
                                                                         <div class="form-group">
                                                                                 <input style="display:none;" id="id_rs_edit" type="text" class="form-control" value="` + feature.administrasi.f15 + `"required>
                                                                                 <input style="display:none;" id="coordinateZoneedit_rs_edit" type="text" class="form-control" value=""required>
+                                                                                
                                                                         </div>
 
                                                                     <div class="row" style="margin-top: 15px;">
@@ -1966,7 +2052,7 @@
 
                                                         <div class="tab-pane active" id="right-tab2-feas-upli">
                                                             <div class="form-group">
-                                                                <div id="map-for-edit" style="width: 400px;height: 300px;position: relative;margin-left: 100px;"></div>
+                                                                <div id="map-for-edit" style="height: 300px;position: relative;margin: 10px;"></div>
                                                                 <div class="form-group">
                                                                     <label class="col-lg-2 control-label" style="margin-top:10px">Image</label>
                                                                     <div class="col-lg-9" style="margin-top:10px">
@@ -1989,6 +2075,45 @@
                                 </div>
                             </div>`;
 
+                        content_delete_point = `
+                            <div class="modal-dialog md">
+                                        <div class="modal-content">
+                                            <div class="modal-header bg-info">
+                                                    <button type="button" class="close" data-dismiss="modal" onclick="destroyfade()">&times;</button>
+                                                    <h6 class="modal-title">Delete Point</h6>
+                                            </div>
+                                            <div class="modal-body" style="overflow-x: hidden;max-height: 300px;overflow-y: scroll;padding-left: 15px;">
+                                                <input style="display:none;" id="id_adm_del" type="text" class="form-control" value="` + feature.administrasi.f15 + `"required>
+                                                <input style="display:none;" id="nama_table" type="text" class="form-control" value="geo_rumah_sakit" required>
+                                                <div class="row" style="margin-top: 15px;">
+                                                    <div class="form-group">
+                                                        <label class="col-lg-3 control-label lbl-top" style="margin-top: 15px;">Nama Point</label>
+                                                        <div class="col-lg-9">
+                                                            <input id="namobj_adm_del" type="text" class="form-control" value="` + feature.administrasi.f1 + `"required disabled>    
+                                                        </div>
+                                                        
+                                                    </div>
+                                                </div>
+
+                                                <div class="row" style="margin-top: 15px;">
+                                                    <div class="form-group">
+                                                        <label class="col-lg-3 control-label lbl-top" style="margin-top: 15px;">Tipe Point</label>
+                                                        <div class="col-lg-8">
+                                                            <input id="remark_adm_del" type="text" class="form-control" value="` + feature.administrasi.f2 + `"required disabled>
+                                                        </div>
+                                                    </div>
+                                                </div>
+
+                                            </div>
+                                            <hr>
+                                            <div class="modal-footer">
+                                                <button type="button" class="btn btn-info" id="deletepointot">Hapus</button>
+                                            </div>
+                                        </div>
+                                    </div>`;
+
+                        $("#modald_adm").html(content_delete_point)
+
                         $("#modal_adm").html(content_edit_rs)
                         panel_samp();
                     })
@@ -2374,7 +2499,7 @@
 
                                                         <div class="tab-pane active" id="right-tab2-feas-upli">
                                                             <div class="form-group">
-                                                                <div id="map-for-edit" style="width: 400px;height: 300px;position: relative;margin-left: 100px;"></div>
+                                                                <div id="map-for-edit" style="height: 300px;position: relative;margin: 10px;"></div>
                                                                 <div class="form-group">
                                                                     <label class="col-lg-2 control-label" style="margin-top:10px">Image</label>
                                                                     <div class="col-lg-9" style="margin-top:10px">
@@ -2453,7 +2578,49 @@
                         $(".btn_action").html(`<div class="tombol-edit-keterangan text-center" style="background-color: #5A9AFB;position: absolute;width: 40px;height: 40px;bottom: 2px;right: 5px;border: 1pt solid rosybrown;border-radius: 8px;">
                                                             <a href="#" id="btn_edit_si" data-toggle="modal" data-target="#modal_adm" data-backdrop="static" data-keyboard="false" class="btn" style="border-bottom-left-radius: 8px;border-top-right-radius: 8px;width: 100%;height: 100%;bottom: 0px;color: white;" title="Edit"><i class="icon-pencil5"></i></a>
                                                             </div>
+                                                            <div class="tombol-delete-keterangan text-center" style="background-color: indianred;position: absolute;width: 40px;height: 40px;bottom: 2px;right: 50px;border: 1pt solid rosybrown;border-radius: 10px;">
+                                                                <a href="#" id="btn_delete_adm" data-toggle="modal" data-target="#modald_adm" data-backdrop="static" data-keyboard="false" class="btn" style="border-bottom-left-radius: 8px;border-top-right-radius: 8px;width: 100%;height: 100%;bottom: 0px;color: white;" title="Delete"><i class="icon-eraser2"></i></a>
+                                                            </div>
                                                             `)
+
+                        content_delete_point = `
+                            <div class="modal-dialog md">
+                                        <div class="modal-content">
+                                            <div class="modal-header bg-info">
+                                                    <button type="button" class="close" data-dismiss="modal" onclick="destroyfade()">&times;</button>
+                                                    <h6 class="modal-title">Delete Point</h6>
+                                            </div>
+                                            <div class="modal-body" style="overflow-x: hidden;max-height: 300px;overflow-y: scroll;padding-left: 15px;">
+                                                <input style="display:none;" id="id_adm_del" type="text" class="form-control" value="` + feature.administrasi.f15 + `"required>
+                                                <input style="display:none;" id="nama_table" type="text" class="form-control" value="geo_sarana_ibadah" required>
+                                                <div class="row" style="margin-top: 15px;">
+                                                    <div class="form-group">
+                                                        <label class="col-lg-3 control-label lbl-top" style="margin-top: 15px;">Nama Point</label>
+                                                        <div class="col-lg-9">
+                                                            <input id="namobj_adm_del" type="text" class="form-control" value="` + feature.administrasi.f1 + `"required disabled>    
+                                                        </div>
+                                                        
+                                                    </div>
+                                                </div>
+
+                                                <div class="row" style="margin-top: 15px;">
+                                                    <div class="form-group">
+                                                        <label class="col-lg-3 control-label lbl-top" style="margin-top: 15px;">Tipe Point</label>
+                                                        <div class="col-lg-8">
+                                                            <input id="remark_adm_del" type="text" class="form-control" value="` + feature.administrasi.f2 + `"required disabled>
+                                                        </div>
+                                                    </div>
+                                                </div>
+
+                                            </div>
+                                            <hr>
+                                            <div class="modal-footer">
+                                                <button type="button" class="btn btn-info" id="deletepointot">Hapus</button>
+                                            </div>
+                                        </div>
+                                    </div>`;
+
+                        $("#modald_adm").html(content_delete_point)
                         $("#modal_adm").html(content_edit_ibdh)
                         panel_samp();
                     })
@@ -2820,7 +2987,7 @@
 
                                                         <div class="tab-pane active" id="right-tab2-feas-upli">
                                                             <div class="form-group">
-                                                                <div id="map-for-edit" style="width: 400px;height: 300px;position: relative;margin-left: 100px;"></div>
+                                                                <div id="map-for-edit" style="height: 300px;position: relative;margin: 10px;"></div>
                                                                 <div class="form-group">
                                                                     <label class="col-lg-2 control-label" style="margin-top:10px">Image</label>
                                                                     <div class="col-lg-9" style="margin-top:10px">
@@ -2898,7 +3065,48 @@
                         $(".btn_action").html(`<div class="tombol-edit-keterangan text-center" style="background-color: #5A9AFB;position: absolute;width: 40px;height: 40px;bottom: 2px;right: 5px;border: 1pt solid rosybrown;border-radius: 8px;">
                                                             <a href="#" id="btn_edit_sp" data-toggle="modal" data-target="#modal_adm" data-backdrop="static" data-keyboard="false" class="btn" style="border-bottom-left-radius: 8px;border-top-right-radius: 8px;width: 100%;height: 100%;bottom: 0px;color: white;" title="Edit"><i class="icon-pencil5"></i></a>
                                                             </div>
+                                                            <div class="tombol-delete-keterangan text-center" style="background-color: indianred;position: absolute;width: 40px;height: 40px;bottom: 2px;right: 50px;border: 1pt solid rosybrown;border-radius: 10px;">
+                                                                <a href="#" id="btn_delete_adm" data-toggle="modal" data-target="#modald_adm" data-backdrop="static" data-keyboard="false" class="btn" style="border-bottom-left-radius: 8px;border-top-right-radius: 8px;width: 100%;height: 100%;bottom: 0px;color: white;" title="Delete"><i class="icon-eraser2"></i></a>
+                                                            </div>
                                                             `)
+                        content_delete_point = `
+                            <div class="modal-dialog md">
+                                        <div class="modal-content">
+                                            <div class="modal-header bg-info">
+                                                    <button type="button" class="close" data-dismiss="modal" onclick="destroyfade()">&times;</button>
+                                                    <h6 class="modal-title">Delete Point</h6>
+                                            </div>
+                                            <div class="modal-body" style="overflow-x: hidden;max-height: 300px;overflow-y: scroll;padding-left: 15px;">
+                                                <input style="display:none;" id="id_adm_del" type="text" class="form-control" value="` + feature.administrasi.f15 + `"required>
+                                                <input style="display:none;" id="nama_table" type="text" class="form-control" value="geo_sarana_pendidikan"required>
+                                                <div class="row" style="margin-top: 15px;">
+                                                    <div class="form-group">
+                                                        <label class="col-lg-3 control-label lbl-top" style="margin-top: 15px;">Nama Point</label>
+                                                        <div class="col-lg-9">
+                                                            <input id="namobj_adm_del" type="text" class="form-control" value="` + feature.administrasi.f1 + `"required disabled>    
+                                                        </div>
+                                                        
+                                                    </div>
+                                                </div>
+
+                                                <div class="row" style="margin-top: 15px;">
+                                                    <div class="form-group">
+                                                        <label class="col-lg-3 control-label lbl-top" style="margin-top: 15px;">Tipe Point</label>
+                                                        <div class="col-lg-8">
+                                                            <input id="remark_adm_del" type="text" class="form-control" value="` + feature.administrasi.f2 + `"required disabled>
+                                                        </div>
+                                                    </div>
+                                                </div>
+
+                                            </div>
+                                            <hr>
+                                            <div class="modal-footer">
+                                                <button type="button" class="btn btn-info" id="deletepointot">Hapus</button>
+                                            </div>
+                                        </div>
+                                    </div>`;
+
+                        $("#modald_adm").html(content_delete_point)
 
                         $("#modal_adm").html(content_edit_sp)
                         panel_samp();
@@ -3120,7 +3328,7 @@
                                                                 
                                                                 <div class="tab-pane active" id="right-tab2-feas-upli">
                                                                     <div class="form-group">
-                                                                        <div id="map-for-edit" style="width: 400px;height: 300px;position: relative;margin-left: 100px;"></div>
+                                                                        <div id="map-for-edit" style="height: 300px;position: relative;margin: 10px;"></div>
                                                                         <div class="form-group">
                                                                             <label class="col-lg-2 control-label" style="margin-top:10px">Image</label>
                                                                             <div class="col-lg-9" style="margin-top:10px">
@@ -3498,7 +3706,7 @@
 
                                                         <div class="tab-pane active" id="right-tab2-feas-upli">
                                                             <div class="form-group">
-                                                                <div id="map-for-edit" style="width: 400px;height: 300px;position: relative;margin-left: 100px;"></div>
+                                                                <div id="map-for-edit" style="height: 300px;position: relative;margin: 10px;"></div>
                                                                 <div class="form-group">
                                                                     <label class="col-lg-2 control-label" style="margin-top:10px">Image</label>
                                                                     <div class="col-lg-9" style="margin-top:10px">
@@ -3643,7 +3851,49 @@
                         $(".btn_action").html(`<div class="tombol-edit-keterangan text-center" style="background-color: #5A9AFB;position: absolute;width: 40px;height: 40px;bottom: 2px;right: 5px;border: 1pt solid rosybrown;border-radius: 8px;">
                                                             <a href="#" id="btn_edit_st" data-toggle="modal" data-target="#modal_adm" data-backdrop="static" data-keyboard="false" class="btn" style="border-bottom-left-radius: 8px;border-top-right-radius: 8px;width: 100%;height: 100%;bottom: 0px;color: white;" title="Edit"><i class="icon-pencil5"></i></a>
                                                             </div>
+                                                            <div class="tombol-delete-keterangan text-center" style="background-color: indianred;position: absolute;width: 40px;height: 40px;bottom: 2px;right: 50px;border: 1pt solid rosybrown;border-radius: 10px;">
+                                                                <a href="#" id="btn_delete_adm" data-toggle="modal" data-target="#modald_adm" data-backdrop="static" data-keyboard="false" class="btn" style="border-bottom-left-radius: 8px;border-top-right-radius: 8px;width: 100%;height: 100%;bottom: 0px;color: white;" title="Delete"><i class="icon-eraser2"></i></a>
+                                                            </div>
                                                             `)
+
+                        content_delete_point = `
+                            <div class="modal-dialog md">
+                                        <div class="modal-content">
+                                            <div class="modal-header bg-info">
+                                                    <button type="button" class="close" data-dismiss="modal" onclick="destroyfade()">&times;</button>
+                                                    <h6 class="modal-title">Delete Point</h6>
+                                            </div>
+                                            <div class="modal-body" style="overflow-x: hidden;max-height: 300px;overflow-y: scroll;padding-left: 15px;">
+                                                <input style="display:none;" id="id_adm_del" type="text" class="form-control" value="` + feature.administrasi.f15 + `"required>
+                                                <input style="display:none;" id="nama_table" type="text" class="form-control" value="geo_stasiun" required>
+                                                <div class="row" style="margin-top: 15px;">
+                                                    <div class="form-group">
+                                                        <label class="col-lg-3 control-label lbl-top" style="margin-top: 15px;">Nama Point</label>
+                                                        <div class="col-lg-9">
+                                                            <input id="namobj_adm_del" type="text" class="form-control" value="` + feature.administrasi.f1 + `"required disabled>    
+                                                        </div>
+                                                        
+                                                    </div>
+                                                </div>
+
+                                                <div class="row" style="margin-top: 15px;">
+                                                    <div class="form-group">
+                                                        <label class="col-lg-3 control-label lbl-top" style="margin-top: 15px;">Tipe Point</label>
+                                                        <div class="col-lg-8">
+                                                            <input id="remark_adm_del" type="text" class="form-control" value="` + feature.administrasi.f2 + `"required disabled>
+                                                        </div>
+                                                    </div>
+                                                </div>
+
+                                            </div>
+                                            <hr>
+                                            <div class="modal-footer">
+                                                <button type="button" class="btn btn-info" id="deletepointot">Hapus</button>
+                                            </div>
+                                        </div>
+                                    </div>`;
+
+                        $("#modald_adm").html(content_delete_point)
                         $("#modal_adm").html(content_edit_stasiun)
                         panel_samp();
                     })
@@ -3851,7 +4101,7 @@
 
                                                                 <div class="tab-pane active" id="right-tab2-feas-upli">
                                                                     <div class="form-group">
-                                                                        <div id="map-for-edit" style="width: 400px;height: 300px;position: relative;margin-left: 100px;"></div>
+                                                                        <div id="map-for-edit" style="height: 300px;position: relative;margin: 10px;"></div>
                                                                         <div class="form-group">
                                                                             <label class="col-lg-2 control-label" style="margin-top:10px">Image</label>
                                                                             <div class="col-lg-9" style="margin-top:10px">
@@ -3988,8 +4238,50 @@
                         $(".btn_action").html(`<div class="tombol-edit-keterangan text-center" style="background-color: #5A9AFB;position: absolute;width: 40px;height: 40px;bottom: 2px;right: 5px;border: 1pt solid rosybrown;border-radius: 8px;">
                                                                     <a href="#" id="btn_edit_tr" data-toggle="modal" data-target="#modal_adm" data-backdrop="static" data-keyboard="false" class="btn" style="border-bottom-left-radius: 8px;border-top-right-radius: 8px;width: 100%;height: 100%;bottom: 0px;color: white;"><i class="icon-pencil5"></i></a>
                                                                     </div>
+                                                                    <div class="tombol-delete-keterangan text-center" style="background-color: indianred;position: absolute;width: 40px;height: 40px;bottom: 2px;right: 50px;border: 1pt solid rosybrown;border-radius: 10px;">
+                                                                        <a href="#" id="btn_delete_adm" data-toggle="modal" data-target="#modald_adm" data-backdrop="static" data-keyboard="false" class="btn" style="border-bottom-left-radius: 8px;border-top-right-radius: 8px;width: 100%;height: 100%;bottom: 0px;color: white;" title="Delete"><i class="icon-eraser2"></i></a>
+                                                                    </div>
                                                                     `)
 
+                        content_delete_point = `
+                            <div class="modal-dialog md">
+                                        <div class="modal-content">
+                                            <div class="modal-header bg-info">
+                                                    <button type="button" class="close" data-dismiss="modal" onclick="destroyfade()">&times;</button>
+                                                    <h6 class="modal-title">Delete Point</h6>
+                                            </div>
+                                            <div class="modal-body" style="overflow-x: hidden;max-height: 300px;overflow-y: scroll;padding-left: 15px;">
+                                                <input style="display:none;" id="id_adm_del" type="text" class="form-control" value="` + feature.administrasi.f15 + `"required>
+                                                <input style="display:none;" id="nama_table" type="text" class="form-control" value="geo_terminal" required>
+                                                <div class="row" style="margin-top: 15px;">
+                                                    <div class="form-group">
+                                                        <label class="col-lg-3 control-label lbl-top" style="margin-top: 15px;">Nama Point</label>
+                                                        <div class="col-lg-9">
+                                                            <input id="namobj_adm_del" type="text" class="form-control" value="` + feature.administrasi.f1 + `"required disabled>    
+                                                        </div>
+                                                        
+                                                    </div>
+                                                </div>
+
+                                                <div class="row" style="margin-top: 15px;">
+                                                    <div class="form-group">
+                                                        <label class="col-lg-3 control-label lbl-top" style="margin-top: 15px;">Tipe Point</label>
+                                                        <div class="col-lg-8">
+                                                            <input id="remark_adm_del" type="text" class="form-control" value="` + feature.administrasi.f2 + `"required disabled>
+                                                        </div>
+                                                    </div>
+                                                </div>
+
+                                            </div>
+                                            <hr>
+                                            <div class="modal-footer">
+                                                <button type="button" class="btn btn-info" id="deletepointot">Hapus</button>
+                                            </div>
+                                        </div>
+                                    </div>`;
+
+                        $("#modald_adm").html(content_delete_point)
+
                         $("#modal_adm").html(content_edit_terminal)
                         panel_samp();
                     })
@@ -4197,7 +4489,7 @@
 
                                                                 <div class="tab-pane active" id="right-tab2-feas-upli">
                                                                     <div class="form-group">
-                                                                        <div id="map-for-edit" style="width: 400px;height: 300px;position: relative;margin-left: 100px;"></div>
+                                                                        <div id="map-for-edit" style="height: 300px;position: relative;margin: 10px;"></div>
                                                                         <div class="form-group">
                                                                             <label class="col-lg-2 control-label" style="margin-top:10px">Image</label>
                                                                             <div class="col-lg-9" style="margin-top:10px">
@@ -4317,24 +4609,66 @@
                                                                     <div>
                                                                         <span>Luas</span>
                                                                     </div>
-                                                                    <div>
-                                                                        <span style="font-family: 'Roboto';">` + feature.administrasi.f10 + ` m</span>
+                                                                    <div>
+                                                                        <span style="font-family: 'Roboto';">` + feature.administrasi.f10 + ` m</span>
+                                                                    </div>
+                                                                </div>
+            
+                                                                <div>
+                                                                    <div>
+                                                                        <span>Pimpinan</span>
+                                                                    </div>
+                                                                    <div>
+                                                                        <span>` + raja + `</span>
+                                                                    </div>
+                                                                </div>`);
+
+                        $(".btn_action").html(`<div class="tombol-edit-keterangan text-center" style="background-color: #5A9AFB;position: absolute;width: 40px;height: 40px;bottom: 2px;right: 5px;border: 1pt solid rosybrown;border-radius: 8px;">
+                                                                    <a href="#" id="btn_edit_cb" data-toggle="modal" data-target="#modal_adm" data-backdrop="static" data-keyboard="false" class="btn" style="border-bottom-left-radius: 8px;border-top-right-radius: 8px;width: 100%;height: 100%;bottom: 0px;color: white;"><i class="icon-pencil5"></i></a>
+                                                                    </div>
+                                                                    <div class="tombol-delete-keterangan text-center" style="background-color: indianred;position: absolute;width: 40px;height: 40px;bottom: 2px;right: 50px;border: 1pt solid rosybrown;border-radius: 10px;">
+                                                                        <a href="#" id="btn_delete_adm" data-toggle="modal" data-target="#modald_adm" data-backdrop="static" data-keyboard="false" class="btn" style="border-bottom-left-radius: 8px;border-top-right-radius: 8px;width: 100%;height: 100%;bottom: 0px;color: white;" title="Delete"><i class="icon-eraser2"></i></a>
+                                                                    </div>
+                                                                    `)
+
+                        content_delete_point = `
+                            <div class="modal-dialog md">
+                                        <div class="modal-content">
+                                            <div class="modal-header bg-info">
+                                                    <button type="button" class="close" data-dismiss="modal" onclick="destroyfade()">&times;</button>
+                                                    <h6 class="modal-title">Delete Point</h6>
+                                            </div>
+                                            <div class="modal-body" style="overflow-x: hidden;max-height: 300px;overflow-y: scroll;padding-left: 15px;">
+                                                <input style="display:none;" id="id_adm_del" type="text" class="form-control" value="` + feature.administrasi.f15 + `"required>
+                                                <input style="display:none;" id="nama_table" type="text" class="form-control" value="geo_cagar_budaya" required>
+                                                <div class="row" style="margin-top: 15px;">
+                                                    <div class="form-group">
+                                                        <label class="col-lg-3 control-label lbl-top" style="margin-top: 15px;">Nama Point</label>
+                                                        <div class="col-lg-9">
+                                                            <input id="namobj_adm_del" type="text" class="form-control" value="` + feature.administrasi.f1 + `"required disabled>    
+                                                        </div>
+                                                        
+                                                    </div>
+                                                </div>
+
+                                                <div class="row" style="margin-top: 15px;">
+                                                    <div class="form-group">
+                                                        <label class="col-lg-3 control-label lbl-top" style="margin-top: 15px;">Tipe Point</label>
+                                                        <div class="col-lg-8">
+                                                            <input id="remark_adm_del" type="text" class="form-control" value="` + feature.administrasi.f2 + `"required disabled>
+                                                        </div>
                                                     </div>
                                                 </div>
 
-                                                                <div>
-                                                                    <div>
-                                                                        <span>Pimpinan</span>
                                             </div>
-                                                                    <div>
-                                                                        <span>` + raja + `</span>
+                                            <hr>
+                                            <div class="modal-footer">
+                                                <button type="button" class="btn btn-info" id="deletepointot">Hapus</button>
                                             </div>
-                                                                </div>`);
-
-                        $(".btn_action").html(`<div class="tombol-edit-keterangan text-center" style="background-color: #5A9AFB;position: absolute;width: 40px;height: 40px;bottom: 2px;right: 5px;border: 1pt solid rosybrown;border-radius: 8px;">
-                                                                    <a href="#" id="btn_edit_cb" data-toggle="modal" data-target="#modal_adm" data-backdrop="static" data-keyboard="false" class="btn" style="border-bottom-left-radius: 8px;border-top-right-radius: 8px;width: 100%;height: 100%;bottom: 0px;color: white;"><i class="icon-pencil5"></i></a>
                                         </div>
-                                                                    `)
+                                    </div>`;
+
+                        $("#modald_adm").html(content_delete_point)
 
 
                         $("#modal_adm").html(content_edit_cabud)
@@ -4455,6 +4789,7 @@
 
     var gardu_listrik = "{{ gardu_listrik }}".replace(/&#x27;/g, '"');
     var result_gardu_listrik = JSON.parse("" + gardu_listrik + "")
+    console.log(result_gardu_listrik)
 
     var geo_po_gardu_listrik = L.geoJson(null, {
         pointToLayer: function(feature, latlng) {
@@ -4545,7 +4880,7 @@
 
                                                                 <div class="tab-pane active" id="right-tab2-feas-upli">
                                                                     <div class="form-group">
-                                                                        <div id="map-for-edit" style="width: 400px;height: 300px;position: relative;margin-left: 100px;"></div>
+                                                                        <div id="map-for-edit" style="height: 300px;position: relative;margin: 10px;"></div>
                                                                         <div class="form-group">
                                                                             <label class="col-lg-2 control-label" style="margin-top:10px">Image</label>
                                                                             <div class="col-lg-9" style="margin-top:10px">
@@ -4692,8 +5027,50 @@
                         $(".btn_action").html(`<div class="tombol-edit-keterangan text-center" style="background-color: #5A9AFB;position: absolute;width: 40px;height: 40px;bottom: 2px;right: 5px;border: 1pt solid rosybrown;border-radius: 8px;">
                                                                     <a href="#" id="btn_edit_gl" data-toggle="modal" data-target="#modal_adm" data-backdrop="static" data-keyboard="false" class="btn" style="border-bottom-left-radius: 8px;border-top-right-radius: 8px;width: 100%;height: 100%;bottom: 0px;color: white;"><i class="icon-pencil5"></i></a>
                                                                     </div>
+                                                                    <div class="tombol-delete-keterangan text-center" style="background-color: indianred;position: absolute;width: 40px;height: 40px;bottom: 2px;right: 50px;border: 1pt solid rosybrown;border-radius: 10px;">
+                                                                        <a href="#" id="btn_delete_adm" data-toggle="modal" data-target="#modald_adm" data-backdrop="static" data-keyboard="false" class="btn" style="border-bottom-left-radius: 8px;border-top-right-radius: 8px;width: 100%;height: 100%;bottom: 0px;color: white;" title="Delete"><i class="icon-eraser2"></i></a>
+                                                                    </div>
                                                                     `)
 
+                        content_delete_point = `
+                            <div class="modal-dialog md">
+                                        <div class="modal-content">
+                                            <div class="modal-header bg-info">
+                                                    <button type="button" class="close" data-dismiss="modal" onclick="destroyfade()">&times;</button>
+                                                    <h6 class="modal-title">Delete Point</h6>
+                                            </div>
+                                            <div class="modal-body" style="overflow-x: hidden;max-height: 300px;overflow-y: scroll;padding-left: 15px;">
+                                                <input style="display:none;" id="id_adm_del" type="text" class="form-control" value="` + feature.administrasi.f15 + `"required>
+                                                <input style="display:none;" id="nama_table" type="text" class="form-control" value="geo_gardu_listrik"required>
+                                                <div class="row" style="margin-top: 15px;">
+                                                    <div class="form-group">
+                                                        <label class="col-lg-3 control-label lbl-top" style="margin-top: 15px;">Nama Point</label>
+                                                        <div class="col-lg-9">
+                                                            <input id="namobj_adm_del" type="text" class="form-control" value="` + feature.administrasi.f1 + `"required disabled>    
+                                                        </div>
+                                                        
+                                                    </div>
+                                                </div>
+
+                                                <div class="row" style="margin-top: 15px;">
+                                                    <div class="form-group">
+                                                        <label class="col-lg-3 control-label lbl-top" style="margin-top: 15px;">Tipe Point</label>
+                                                        <div class="col-lg-8">
+                                                            <input id="remark_adm_del" type="text" class="form-control" value="` + feature.administrasi.f2 + `"required disabled>
+                                                        </div>
+                                                    </div>
+                                                </div>
+
+                                            </div>
+                                            <hr>
+                                            <div class="modal-footer">
+                                                <button type="button" class="btn btn-info" id="deletepointot">Hapus</button>
+                                            </div>
+                                        </div>
+                                    </div>`;
+
+                        $("#modald_adm").html(content_delete_point)
+
                         $("#modal_adm").html(content_edit_gl)
                         panel_samp();
                     })
@@ -5019,13 +5396,14 @@
                         data_de.push(da)
                     }
                     $("#search_desa").html(data_de);
+                    checkBox_3d.checked = false;
                 }
             })
+
         } else {
             //location.reload();
-            $("#labelchange").html(`<h1 style="color: white;margin-top: 5px;margin-left: 8px;">
-                3D
-            </h1>`)
+            $("#labelchange").html(`<img src="static/img/icon-1/Vector3d.svg" alt="" style="height: 50px;
+                    width: 50px;">`)
             map_cesium.entities.removeAll();
             //map_cesium.destroy();
             setTimeout(function() {
@@ -5036,6 +5414,7 @@
             $(".no3d").css('display', 'block');
             $(".rar").css('display', 'block');
             $("#map-cesium").css('display', 'none');
+            $(".tooltip-3d").html(`3D`)
                 //$(".filter3d").removeClass("d3filter");
         }
     }
@@ -5047,9 +5426,8 @@
         $(".no3d").css('display', 'none');
         $("#legendapo").css('display', 'none');
         $(".rar").css('display', 'none');
-        $("#labelchange").html(`<h1 style="color: white;margin-top: 5px;margin-left: 8px;">
-            2D
-        </h1>`)
+        $("#labelchange").html(`<img src="static/img/icon-1/Vector2d.svg" alt="" style="height: 35px;width: 35px;margin: 7px;filter: invert(48%) sepia(79%) saturate(2398%) hue-rotate(190deg) brightness(77%) contrast(170%);z-index:1;">`)
+        $(".tooltip-3d").html(`2D`)
 
         var nama_desa = $("#search_desa").val();
         $.ajax({
@@ -5059,6 +5437,7 @@
             },
             dataType: 'json',
             success: function(data) {
+                document.getElementById("mapschange").checked = true;
                 $("#modalsearch3d").modal("toggle")
                     // console.log(data['polygon_o'])
                     // console.log(data['line_o'])
@@ -6001,6 +6380,9 @@
                                     $(".btn_action").html(`<div class="tombol-edit-keterangan text-center" style="background-color: #5A9AFB;position: absolute;width: 212px;height: 40px;bottom: 2px;right: 5px;border: 1pt solid rosybrown;border-radius: 8px;">
                                         <a href="#" class="btn btn-primary" data-toggle="modal" data-target="#modal_tampak" id="btn_upload_tampak" data-backdrop="static" data-keyboard="false"><i>Upload Tampak Bangunan 3D</i></a>
                                                             </div>
+                                                            <div class="tombol-delete-keterangan text-center" style="background-color: indianred;position: absolute;width: 40px;height: 40px;bottom: 2px;right: 50px;border: 1pt solid rosybrown;border-radius: 10px;">
+                                                                <a href="#" id="btn_delete_adm" data-toggle="modal" data-target="#modald_adm" data-backdrop="static" data-keyboard="false" class="btn" style="border-bottom-left-radius: 8px;border-top-right-radius: 8px;width: 100%;height: 100%;bottom: 0px;color: white;" title="Delete"><i class="icon-eraser2"></i></a>
+                                                            </div>
                                                             `)
                                     content = `<table class="table table-hover tasks-list">
                                         <thead style="text-align: center;">
@@ -7099,43 +7481,77 @@
                                     };
 
                                     history = `
+                                    <div>
+                                        <div style="margin-top: 150px;">
+                                            <span>Perbaikan Terakhir</span>
+                                            <span>
+                                                <a id='btn_detail_per_bang' onclick="getdetailperbang(` + feature.properties.f1 + `)" data-toggle="modal" data-target="#modal_detail" style = "text-align:right; margin-right:26px;"><i>Detail</i></a>
+                                            </span>
+                                        </div>
+                                        <div>
+                                            <span>
                                                 <tr style="height: 40px;">
                                                     <th id="history_panel">
-                                                <p class="text-center">
-                                                    <img src="static/img/icon/samping_history.svg" alt="Image" style="height: 20px; width: 20px;">
-                                                </p>
-                                                <p class="text-center">
-                                                    <b>History Perbaikan</b>
-                                                </p>
-                                                <br>
-                                                <label class="col-md-6"><b>Tanggal</b></label>
-                                                <label class="col-md-6"><b>Jenis Perbaikan</b></label>
-                                                    ` + list_history_panel + `
-                                                <p class="text-center" style="margin-top: 15px;">
-                                                    <a id='btn_detail_per_bang' onclick="getdetailperbang(` + feature.properties.f1 + `)" data-toggle="modal" data-target="#modal_detail" class="btn btn-primary" style="border-radius: 200px; margin-bottom: 5px;"><i class="fa fa-list-ul" style="color:#ffffff"> </i><i style="margin-left: 5px;">View Detail</i></a>
-                                                    <a href="#" id='btn_perbaikan_bangunan' data-toggle="modal" data-target="#input_perbaikan_bang" data-backdrop="static" data-keyboard="false" class="btn btn-primary" style="border-radius: 200px; margin-bottom: 5px;"><i class="fa fa-plus" style="color:#ffffff"> </i><i style="margin-left: 5px;">Tambah History Perbaikan</i></a>
+                                                        <div class="form-group" style="margin-bottom:0px;">
+                                                            <div class="row">
+                                                                <label class="col-md-6">` + list_history[0].split(",")[1] + `</label>
+                                                                <label class="col-md-6">` + list_history[0].split(",")[2] + `</label>
+                                                            </div>
+                                                        </div>
+                                                        <p class="text-center" style="margin-top: 5px;">
+                                                            <a class="btn" id="btn_perbaikan_bangunan" data-toggle="modal" data-target="#input_perbaikan_bang"><i>Input Perbaikan</i></a>
                                                         </p>
                                                     </th>
-                                        </tr>`;
+                                                </tr>
+                                            </span>
+                                        </div>
+                                    </div>
+                                        `;
                                 } else {
                                     history = `
+                                    <div>
+                                        <div style="margin-top: 150px;">
+                                            <span>Perbaikan Terakhir</span>
+                                        </div>
+                                        <div>
+                                            <span>
                                                 <tr style="height: 40px;">
                                                     <th id="history_panel">
-                                                <p class="text-center">
-                                                    History Perbaikan
-                                                </p>
-                                                <br>
                                                         <p class="text-center" style="margin-top: 10px;"><i>Belum Ada History</i></p>
                                                         <p class="text-center" style="margin-top: 10px;">
-                                                    <a href="#" id='btn_perbaikan_bangunan' data-toggle="modal" data-target="#input_perbaikan_bang" data-backdrop="static" data-keyboard="false" class="btn btn-primary" style="border-radius: 200px; margin-bottom: 5px;"><i class="fa fa-plus" style="color:#ffffff"> </i><i style="margin-left: 5px;">Tambah History Perbaikan</i></a>
+                                                            <a class="btn" id="btn_perbaikan_bangunan" data-toggle="modal" data-target="#input_perbaikan_bang"><i>Input Perbaikan</i></a>
                                                         </p>
                                                     </th>
-                                        </tr>`;
+                                                </tr>
+                                            </span>
+                                        </div>
+                                    </div>
+                                    `;
                                 }
                             } else {
                                 history = ``
                             }
 
+                            // if (feature.properties.f4 != null) {
+                            //     var list_history = feature.properties.f4
+                            //     console.log(list_history[0].split(",")[0])
+                            //     var perbaikan_bg = `
+                            //     <div class='row'>
+                            //         <label class="col-md-8">` + list_history[0].split(",")[1] + `</label>
+                            //         <a class="col-md-4" onclick="getdetailper(` + list_history[0].split(",")[0] + `)" data-toggle="modal" data-target="#input_perbaikan_bang"><i>Detail</i></a>
+                            //     </div>
+                            //     <a class="btn" id="btn_perbaikan_bangunan" data-toggle="modal" data-target="#input_perbaikan_bang"><i>Input Perbaikan</i></a>`
+
+                            // } else {
+                            //     var perbaikan_bg = `<div class='row'>
+                            //         <div class="col-md-6">
+                            //             <label class="col-md-6">-</label>
+                            //         </div>
+                            //     </div>
+                            //     <a class="btn" id="btn_perbaikan_bangunan" data-toggle="modal" data-target="#input_perbaikan_bang"><i>Input Perbaikan</i></a>
+                            //     `
+                            // }
+
                             content_edit = `
                             <div class="modal-dialog" style="width: max-content;height: max-content;">
                                 <div class="modal-content">
@@ -7293,7 +7709,6 @@
                                         </table>
                                     </div>
                                     <div class="form-group" style="margin-bottom:10px;">
-                                        <div id="map-delete" style="width: 300px;height: 250px;position: relative;margin-left: 10px;margin-right: 10px;margin-top: 10px;"></div>
                                         <div class="form-group">
                                             <div class="col-lg-12" style="margin-top:10px;margin-bottom:10px;">
                                                 <input type="text" class="hidden" name="coordinatebangunan" id="coordinatebangunanhps" value="">
@@ -7316,7 +7731,7 @@
                                                         <button type="button" class="close" data-dismiss="modal">&times;</button>
                                                         <h6 class="modal-title">Renovasi Bangunan</h6>
                                                     </div>
-                                    <div class="modal-body" style="overflow-x: hidden;max-height: 300px;overflow-y: scroll;padding-left: 15px;">
+                                                    <div class="modal-body" style="max-height: 450px;overflow-y: auto;">
                                                         <div class="tab-pane has-padding" id="panel-tab2">
                                                             <div class="tab-pane" id="bottom-justified-data">
 
@@ -7329,12 +7744,11 @@
                                                                     <div class="tab-content">
                                                                         <div class="tab-pane active" id="left-tab1-feas-upl">
                                                                             <input type="text" class="hidden" id="poly_create_input_bang">
-                                                            <input type="text" class="hidden" id="id_bang_perbaikan">
+                                                                            <input type="text" class="hidden" id="id_bang_perbaikan" value="` + feature.properties.f1 + `" disable>
                                                                             <input type="text" class="hidden" id="type_id_bang">
                                                                             <div id="map-insert-renov-bang" style="height: 375px;width: 100%">
                                                                         </div>
                                                                     </div>
-
                                                                         <div class="tab-pane" id="right-tab2-feas-upl">
 
                                                                             <div class="row">
@@ -7416,29 +7830,91 @@
                                                 </div>
                                             </div>`;
 
-
-                            if (feature.properties.f4 != null) {
-                                var list_history = feature.properties.f4
-                                console.log(list_history[0].split(",")[0])
-                                var perbaikan_bg = `<div class='row'>
-                                    
-                                    <label class="col-md-8">` + list_history[0].split(",")[1] + `</label>
-                                    
-        
-                                    <a class="col-md-4" onclick="getdetailper(` + list_history[0].split(",")[0] + `)" data-toggle="modal" data-target="#input_perbaikan_bang"><i>Detail</i></a>
-        
+                            content = `
+                                    <table class="table tasks-list">
+                                        <thead style="text-align: center;">
+                                            <tr>
+                                                <th style="padding: 0 0 0 0px;">
+                                                    <img src=` + path_img + ` alt="Image" style="width: 100%;max-height: 368px;height:368"> 
+                                                </th>
+                                            </tr>
+                                        </thead>
+                                        <tbody>
+                                            <div class= "container">
+                                                <tr style="height: 100px;">
+                                                    <th>
+                                                        <div>
+                                                            <h1 style="font-family: Google Sans,Roboto,Arial,sans-serif;
+                                                            letter-spacing: 0;
+                                                            font-weight: 400;">
+                                                                <span style="font-size: x-large;">
+                                                                    ` + feature.properties.f2 + `
+                                                                </span>
+                                                            </h1>
                                                         </div>
-                                <a class="col-md-6" class="btn" id="btn_perbaikan_jalan"><i>Input Perbaikan</i></a>`
-
-                            } else {
-                                var perbaikan_bg = `<div class='row'>
-                                    <div class="col-md-6">
-                                        <label class="col-md-6">Null</label>
+                                                    </th>
+                                                </tr>
                                             </div>
+                                            <div class= "container">
+                                                <tr style="height: 30px;">
+                                                    <th>
+                                                        <span>
+                                                            ` + feature.administrasi.f12 + `
+                                                        </span>
+                                                    </th>
+                                                </tr>
                                             </div>
-                                <a class="btn" id="btn_perbaikan_hist" data-toggle="modal" data-target="#input_perbaikan_bang"><i>Input Perbaikan</i></a>
-                                `
-                            }
+                                            <div class= "container">
+                                                <tr style="height: 40px;">
+                                                    <th>
+                                                        <p style="text-align:center;">
+                                                            <img src="static/img/icon/samping_location.svg" alt="Image" style="height: 30px; width: 30px;">
+                                                        </p>
+                                                        <p>
+                                                            <span>
+                                                                ` + alamat + feature.administrasi.f1 + `, ` + feature.administrasi.f2 + `, ` + feature.administrasi.f3 + `, ` + feature.administrasi.f4 + `
+                                                            </span>
+                                                        </p>
+                                                    </th>
+                                                </tr>
+                                            </div>
+                                            <div class= "container">
+                                                <tr style="height: 40px;">
+                                                    <th>
+                                                        <p style="text-align:center;">
+                                                            <img src="static/img/icon/samping_informasi.svg" alt="Image" style="height: 30px; width: 30px;">
+                                                        </p>
+                                                        <p>
+                                                            <span>Luas Bangunan : ` + feature.administrasi.f6 + `</span>
+                                                        </p>
+                                                        <p>
+                                                            <span>Luas Tanah : ` + feature.administrasi.f7 + `</span>
+                                                        </p>
+                                                        <p>
+                                                            <span>Tinggi Bangunan : ` + feature.administrasi.f8 + `</span>
+                                                        </p>
+                                                        <p>
+                                                            <span>Pemilik : ` + feature.administrasi.f10 + `</span>
+                                                        </p>
+                                                    </th>
+                                                </tr>
+                                            </div>
+                                            <div class= "container">
+                                                <tr style="height: 40px;">
+                                                    <th>
+                                                        <p class="text-center" style="margin-top: 5px;">
+                                                            <a href="#" class="btn btn-primary" data-toggle="modal" data-target="#modal_bangunan_edit" id="btn_edit_bangunan" data-backdrop="static" data-keyboard="false" style="border-radius: 200px; margin-bottom: 5px;"><i class="fa fa-edit" style="color:#ffffff"> </i><i style="margin-left: 5px;">Edit Informasi Bangunan</i></a>
+                                                            <a href="#" id='btn_delete_bangunan' class='btn 
+                                                                btn-primary btn_edit_bangunan' data-toggle="modal" data-target="#modal_bangunan_delete" data-backdrop="static" data-keyboard="false" style="border-radius: 200px; margin-bottom: 5px;"><i class="fa fa-trash" style="color:#ffffff"> </i><i style="margin-left: 5px;">Delete Bangunan</i></a>
+                                                        </p>
+                                                    </th>
+                                                </tr>
+                                            </div>
+                                            <div class="container">
+                                                ` + history + `
+                                            </div>
+                                        </tbody>
+                                    </table>`;
 
                             $(".gambar_keterangan").html(`<img src="` + path_img + `" alt="" style="width:100%;height:240px;border-top-left-radius: 10px;border-bottom-left-radius: 10px;">`)
 
@@ -7460,60 +7936,49 @@
                                                     <div class="col-md-6">
                                                         <div>
                                                             <div>
-                                                                <span>Jenis Bangunan</span>
+                                                                <span style="font-family: 'gilroylight';">Jenis Bangunan</span>
                                                             </div>
                                                             <div>
-                                                                <span>
-                                                                    ` + feature.administrasi.f12 + `
-                                                                </span>
+                                                                <span style="font-family: 'gilroysemibold';">` + feature.administrasi.f12 + `</span>
                                                             </div>
                                                         </div>
                                                         <div>
-                                                            <div>
-                                                                <span>Luas Bangunan</span>
+                                                            <div style="margin-top:5px;">
+                                                                <span style="font-family: 'gilroylight';">Luas Bangunan</span>
                                                             </div>
                                                             <div>
-                                                                <span style="font-family: 'Roboto';">` + feature.administrasi.f6 + ` m</span>
+                                                                <span style="font-family: 'gilroysemibold';">` + feature.administrasi.f6 + ` m</span>
                                                             </div>
                                                         </div>
                                                         <div>
                                                             <div>
-                                                                <span>Luas Tanah</span>
+                                                                <span style="font-family: 'gilroylight';">Luas Tanah</span>
                                                             </div>
                                                             <div>
-                                                                <span style="font-family: 'Roboto';">` + feature.administrasi.f7 + ` m</span>
+                                                                <span style="font-family: 'gilroysemibold';">` + feature.administrasi.f7 + ` m</span>
                                                             </div>
                                                         </div>
                                                     </div>
                                                     <div class="col-md-6">
                                                         <div>
                                                             <div>
-                                                                <span>Tinggi Bangunan</span>
+                                                                <span style="font-family: 'gilroylight';">Tinggi Bangunan</span>
                                                             </div>
                                                             <div>
-                                                                <span style="font-family: 'Roboto';">` + feature.administrasi.f8 + ` m</span>
+                                                                <span style="font-family: 'gilroysemibold';">` + feature.administrasi.f8 + ` m</span>
                                                             </div>
                                                         </div>
 
                                                         <div>
-                                                            <div>
-                                                                <span>Pemilik</span>
-                                                            </div>
-                                                            <div>
-                                                                <span style="font-family: 'Roboto';">` + feature.administrasi.f10 + ` m</span>
-                                                            </div>
-                                                        </div>
+                                                            <div style="margin-top:5px;">
+                                                                <span style="font-family: 'gilroylight';">Pemilik</span>
                                                             </div>
                                                             <div>
-                                                        <div style="margin-top: 150px;">
-                                                            <span>Perbaikan Terakhir</span>
+                                                                <span style="font-family: 'gilroysemibold';">` + feature.administrasi.f10 + ` m</span>
                                                             </div>
-                                                        <div>
-                                                            <span>` + perbaikan_bg + `</span>
                                                         </div>
                                                     </div>
-            
-
+                                                        ` + history + `
                                                     `);
 
                             $(".btn_action").html(`<div class="tombol-edit-keterangan text-center" style="background-color: #5A9AFB;position: absolute;width: 40px;height: 40px;bottom: 2px;right: 5px;border: 1pt solid rosybrown;border-radius: 8px;">
@@ -7525,12 +7990,7 @@
                                             `)
 
 
-
-
-
-
-
-
+                            $("#isi_panel").html(content);
                             $("#modal_bangunan_edit").html(content_edit);
                             $("#modal_bangunan_delete").html(content_delete);
                             $("#input_perbaikan_bang").html(content_inp_his_bang);
@@ -7598,9 +8058,6 @@
         geo_bangunan.addData(data)
     }
 
-
-    var checkBox_building = document.getElementById("geo_building");
-
     map.on("movestart", function() {
         geo_bangunan.clearLayers();
     });
@@ -7613,6 +8070,8 @@
         var center = map.getBounds().getCenter();
         var zoom = map.getZoom();
 
+        var checkBox_building = document.getElementById("geo_building");
+
         if (checkBox_building.checked == true) {
 
             if (zoom > 17) {
@@ -7862,7 +8321,6 @@
     });
 
     $(document).on("click", "#btn_delete_bangunan", function() {
-        $("#modal_detail_non_kelurahan").modal("hide")
         var map_delete = new L.map('map-delete', {
             editable: true,
             zoomControl: false,
@@ -7886,26 +8344,7 @@
             success: function(data) {
                 $("#modal_bangunan_delete").modal("show")
                 $(".modal_detail_non_kelurahan").modal("hide")
-                setTimeout(function() {
-                    map_delete.invalidateSize();
-                }, 1000);
-                loaderPage(false);
-
-                map_delete.setView([data['geometry']['coordinates'][0][0][0][1], data['geometry']['coordinates'][0][0][0][0]], 19);
-
-                let lop_poly_edit = data['geometry']['coordinates'][0][0];
-                let list_poly_edit = [];
-                for (var i = 0; i < lop_poly_edit.length; i++) {
-                    geoj = lop_poly_edit[i][0];
-                    polygigi = [lop_poly_edit[i][1], lop_poly_edit[i][0]]
-                    list_poly_edit.push(polygigi);
-                };
-
-                var polyly = L.polygon(list_poly_edit).addTo(map_delete)
-                $('#btnsavedeletebangunan').click(function() {
-                    var hasil = (JSON.stringify(polyly.toGeoJSON()))
-                    $("#coordinatebangunan").val(hasil);
-                })
+                loaderPage(false)
             }
         })
     });
@@ -7948,10 +8387,12 @@
 
     });
 
+    $(document).on("click", "#btn_perbaikan_bangunan", function() {
+        // $("#input_perbaikan_bang-s").css("display", "block");
         var map_bang = new L.map('map-insert-renov-bang', {
-        editable: true,
+            editable: false,
             zoomControl: false,
-        drawControl: true
+            drawControl: false
         }).setView([-2, 118], 5);
 
         mapssx = L.tileLayer('https://mt1.google.com/vt/lyrs=s&x={x}&y={y}&z={z}', {
@@ -7959,42 +8400,13 @@
             minZoom: 4,
         }).addTo(map_bang);
 
-    var polyxxx = L.polygon([
-        [-4.1283969, 104.1674575],
-        [-4.128396, 104.1674947],
-        [-4.1284664, 104.1674964],
-        [-4.1284674, 104.1674593],
-        [-4.1283969, 104.1674575]
-    ]).addTo(map_bang)
-
-    // var geo_bangunan_input = L.geoJson(null, {
-    //     style: function(feature) {
-    //         return {
-    //             color: "#06FF08",
-    //             weight: 8,
-    //             opacity: 2,
-    //             zIndex: 1000
-    //         };
+        // if (map_bang.hasLayer(polyxxx)) {
+        //     polyxxx.remove()
         // }
-    // }).addTo(map_bang);
-
-    $(document).on("click", "#btn_perbaikan_bangunan", function() {
-        var map_bang = new L.map('map-insert-renov-bang', {
-            editable: true,
-            zoomControl: false,
-            drawControl: true
-        }).setView([-2, 118], 5);
 
-        mapssx = L.tileLayer('https://mt1.google.com/vt/lyrs=s&x={x}&y={y}&z={z}', {
-            maxZoom: 22,
-            minZoom: 4,
-        }).addTo(map_bang);
+        var id_polyx = $('#id_bang_perbaikan').val();
 
-        $("#input_perbaikan_bang").css("display", "block");
-        if (map_bang.hasLayer(polyxxx)) {
-            polyxxx.remove()
-        }
-        var id_polyx = $('#idbangunan').val();
+        loaderPage(true);
 
         $.ajax({
             url: "{% url 'apps:input-perbaikan-bang' %}",
@@ -8003,7 +8415,12 @@
             },
             dataType: 'json',
             success: function(data) {
-                console.log(data)
+
+                setTimeout(function() {
+                    map_bang.invalidateSize();
+                }, 1000);
+                loaderPage(false);
+
                 $("#nama_bang").val(data[0]);
                 $("#type_bang").val(data[4]);
                 $("#id_bang_perbaikan").val(data[3]);
@@ -8012,7 +8429,7 @@
                 $("#kecamatan_bang").val(data[6]);
 
                 var latlngs = data[2];
-                console.log(data[2])
+
                 var lattitud, longitud;
 
                 map_bang.setView([data[2]['geometry']['coordinates'][0][0][0][1], data[2]['geometry']['coordinates'][0][0][0][0]], 19);
@@ -8033,7 +8450,7 @@
                 })
             }
         })
-    })
+    });
 
     $(document).on("click", "#save-perbaikan_bang", function(e) {
         var polyginbang = $('#coorbangbaru').val();
@@ -8047,7 +8464,7 @@
         var anggaran = $("#anggaran_bang").val();
         var proposal = $("#proposal_bang").val();
         var bukti_selesai = $("#buktiselesai_bang").val();
-        console.log(bukti_selesai)
+
         var pj = $("#pihakpengesahan_bang").val();
         var pj_lapangan = $("#pjlapangan_bang").val();
         var kontraktor = $("#kontraktor_bang").val();

templates/includes/js-o.html

-{% load static %} {% for group in user.groups.all %} {% if group.name == 'Dinas Pekerjaan Umum dan Penataan Ruang' %}
-<style>
-    #btn_edit_kelurahan {
-        display: block;
-    }
-    
-    #btn_edit_tuplah {
-        display: block;
-    }
-    
-    #btn_edit_bangunan {
-        display: block;
-    }
-    
-    #btn_delete_bangunan {
-        display: block;
-    }
-    
-    #btn_jalan {
-        display: block;
-    }
-    
-    #btn_edit_gl {
-        display: block;
-    }
-    
-    #btn_edit_adm {
-        display: block;
-    }
-    
-    #btn_delete_adm {
-        display: block;
-    }
-    
-    .leaflet-popup {
-        display: block;
-    }
-    
-    #btn_detail_per_bang {
-        display: block;
-    }
-    
-    #btn_perbaikan_bangunan {
-        display: block;
-    }
-    
-    #btn_upload_tampak {
-        display: block;
-    }
-</style>
-{% elif group.name == 'Dinas Kependudukan dan Pencatatan Sipil' %}
-<style>
-    #btn_edit_kelurahan {
-        display: block;
-    }
-</style>
-{% elif group.name == 'Dinas Kesehatan' %}
-<style>
-    #btn_edit_rs {
-        display: block;
-    }
-    
-    #btn_edit_puskes {
-        display: block;
-    }
-    
-    #btn_edit_lk {
-        display: block;
-    }
-</style>
-{% elif group.name == 'Dinas Ketahanan Pangan' %}
-<style>
-    #btn_edit_tuplah {
-        display: block;
-    }
-</style>
-{% elif group.name == 'Dinas Lingkungan Hidup' %}
-<style>
-    #btn_edit_tuplah {
-        display: block;
-    }
-    
-    #btn_edit_bangunan {
-        display: block;
-    }
-    
-    #btn_delete_bangunan {
-        display: block;
-    }
-    
-    #btn_jalan {
-        display: block;
-    }
-    
-    #btn_edit_cb {
-        display: block;
-    }
-    
-    #btn_upload_tampak {
-        display: block;
-    }
+{% load static %}
+<script>
+    //notif overlay
+    function cek_overlay() {
+        var jml_ceklis = 0
+        var check_tuplah = document.getElementById("geo_tuplah");
+        var check_rumah = document.getElementById("geo_building");
+        var check_jalan = document.getElementById("geo_jalan");
+        var check_kota = document.getElementById("batas_kota");
+        var check_kec = document.getElementById("batas_kec");
+        var check_desa = document.getElementById("batas_desa");
 
-    .leaflet-popup {
-        display: block;
-    }
-</style>
-{% elif group.name == 'Dinas Pariwisata dan Kebudayaan' %}
-<style>
-    #btn_edit_cb {
-        display: block;
-    }
-</style>
-{% elif group.name == 'Dinas Pemberdayaan Masyarakat Desa' %}
-<style>
-    #btn_edit_kelurahan {
-        display: block;
+        if (check_tuplah.checked == true) {
+            jml_ceklis = jml_ceklis + 1
         }
-</style>
-{% elif group.name == 'Dinas Pemberdayaan Perempuan dan PA' %}
-<style>
-    #btn_edit_kelurahan {
-        display: block;
+        if (check_rumah.checked == true) {
+            jml_ceklis = jml_ceklis + 1
         }
-</style>
-{% elif group.name == 'Dinas Kearsipan dan Perpustakaan' %}
-<style>
-    #btn_edit_adm {
-        display: block;
+        if (check_jalan.checked == true) {
+            jml_ceklis = jml_ceklis + 1
         }
-</style>
-{% elif group.name == 'Dinas Pendidikan' %}
-<style>
-    #btn_edit_sp {
-        display: block;
+        if (check_kota.checked == true) {
+            jml_ceklis = jml_ceklis + 1
         }
-</style>
-{% elif group.name == 'Dinas Perdagangan dan Perindustrian' %}
-<style>
-    #btn_edit_spbu {
-        display: block;
+        if (check_kec.checked == true) {
+            jml_ceklis = jml_ceklis + 1
         }
-</style>
-{% elif group.name == 'Dinas Perhubungan' %}
-<style>
-    #btn_edit_st {
-        display: block;
+        if (check_desa.checked == true) {
+            jml_ceklis = jml_ceklis + 1
         }
 
-    #btn_edit_tr {
-        display: block;
-    }
-</style>
-{% elif group.name == 'Dinas Perikanan dan Peternakan' %}
-<style>
-    #btn_edit_tuplah {
-        display: block;
-    }
-</style>
-{% elif group.name == 'Dinas Pertanian' %}
-<style>
-    #btn_edit_tuplah {
-        display: block;
-    }
-</style>
-{% elif group.name == 'Dinas Perumahan dan Kawasan Permukiman' %}
-<style>
-    #btn_edit_tuplah {
-        display: block;
-    }
+        if (jml_ceklis != 0) {
+            $(".jumlah-ceklis").html(`<div style="position: absolute;right: -5px;top: -5px;background: 
+            #90CAFF;width: 20px;height: 20px;text-align: center;border-radius: 10px;color:#FFFFFF;"><b>` + jml_ceklis + `</b></div>`)
 
-    #btn_edit_bangunan {
-        display: block;
-    }
+            $(".overlay-cek").css("background", "#1E2233")
+            $(".overlay-cek").css("box-shadow", "0px 4px 47px rgb(175 141 246 / 86%)")
 
-    #btn_delete_bangunan {
-        display: block;
+        } else {
+            $(".jumlah-ceklis").html(``)
+            $(".overlay-cek").css("background", "#FFFFFF")
+            $(".overlay-cek").css("box-shadow", "0")
         }
-    
-    #btn_upload_tampak {
-        display: block;
     }
 
-    .leaflet-popup {
-        display: block;
-    }
-</style>
-{% elif group.name == 'Dinas Sosial' %}
-<style>
-    #btn_edit_si {
-        display: none;
-    }
-</style>
-{% endif %}{% endfor %}
-<script>
+    cek_overlay()
         //tes
     function panel_samp() {
         $("#panel-samping").addClass("move");
@@ -232,6 +84,20 @@
             onEachFeature: function(feature, layer) {
                 layer.on({
                     click: function(e) {
+                        var x = window.matchMedia("(max-width: 700px)")
+                        if (x.matches) { // If media query matches
+                            swal({
+                                title: "Sorry",
+                                text: "Untuk di mobile tampilan detail kelurahan tidak mendukung, Silahkan akses menggunakan laptop atau PC",
+                                type: "warning",
+                                icon: "error",
+                                confirmButtonColor: "#00BCD4"
+                            })
+
+                            setTimeout(function() {
+
+                            }, 500);
+                        } else {
                             $('#modal_detail_kelurahan').modal('show');
 
                             if (feature.administrasi.f9 == 'NONE') {
@@ -671,9 +537,7 @@
                             setTimeout(function() {
                                 chart_agama.render();
                             }, 100);
-
-
-
+                        }
 
                     },
                     mouseover: function(e) {
@@ -953,6 +817,7 @@
         } else {
             geo_batas_kel.remove()
         }
+        cek_overlay()
     }
 
     function bataskota() {
@@ -962,6 +827,7 @@
         } else {
             geo_batas.remove()
         }
+        cek_overlay()
     }
 
     function bataskec() {
@@ -971,6 +837,18 @@
         } else {
             geo_batas_kec.remove()
         }
+        cek_overlay()
+    }
+
+    function georumah() {
+        var checkBox = document.getElementById("geo_building");
+
+        if (checkBox.checked == true) {
+            $(".help_bangunan").html('Polygon Bangunan dan Line Jalan terlihat pada zoom > 16')
+        } else {
+            $(".help_bangunan").html('')
+        }
+        cek_overlay()
     }
 
     function batasall() {
@@ -990,6 +868,7 @@
             geo_batas_kel.remove()
             geo_batas.remove()
         }
+        cek_overlay()
     }
 
     var search_desa = batas_desa_desa();
@@ -1154,6 +1033,7 @@
                             <input type="text" name="idtuplah" id="idtuplah" class="hidden" value="">
 
                             <input type="text" name="coordinatetuplah" id="coordinatetuplah" class="hidden" value="">
+                            <input type="text" name="luastuplah" id="lwastuplah" class="hidden" value="">
         
                             <div class="col-md-12">
                                 <div>
@@ -1169,13 +1049,14 @@
                                         <span>Luas Lahan</span>
                                     </div>
                                     <div>
-                                        <span style="font-family: 'Roboto';">` + feature.legend.f3 + `m2</span>
+                                        <span style="font-family: 'Roboto';">` + feature.legend.f3 + ` m2</span>
                                     </div>
                                 </div>
                             </div>`)
 
 
                     $('#idtuplah').val(feature.legend.f1);
+                    $('#lwastuplah').val(feature.legend.f3);
 
                     $("#coordinatetuplah").val(feature.geometry);
                     $("#button_hide_panel").css("display", "block");
@@ -1214,6 +1095,7 @@
     }
 
     function geotuplah() {
+
         var checkBox = document.getElementById("geo_tuplah");
         if (checkBox.checked == true) {
             loaderPage(true);
@@ -1242,6 +1124,8 @@
             $("#legenda").css('display', 'none');
             geo_tuplah.remove()
         }
+
+        cek_overlay()
     }
 
 
@@ -1271,6 +1155,7 @@
         }
         var id_poly = $('#idtuplah').val();
 
+        var lwastup = $("#lwastuplah").val();
 
         $.ajax({
             url: "{% url 'api:edit-tuplah' %}",
@@ -1282,6 +1167,7 @@
                 $("#modal-edit-tuplah").modal("show")
                 $("#modal_detail_non_kelurahan").modal("toggle")
                 loaderPage(false);
+                $("#luas_tuplah_edit").val(lwastup);
                 let response = data
                 if (response.code == 0) {
                     setTimeout(function() {
@@ -1294,10 +1180,8 @@
                     var longg = 0;
                     for (var i = 0; i < lop_poly_edit.length; i++) {
                         geoj = lop_poly_edit[i];
-                        console.log(lop_poly_edit[i])
 
                         for (var i = 0; i < geoj.length; i++) {
-                            console.log(geoj[i])
                             polygigi = [geoj[i][1], geoj[i][0]]
                             list_poly_edit.push(polygigi);
                             latt += geoj[i][0]
@@ -1306,13 +1190,23 @@
                     };
                     var lattt = latt / list_poly_edit.length
                     var longgg = longg / list_poly_edit.length
-                    console.log(list_poly_edit)
-
 
                     map_edit_tuplah.setView([longgg, lattt], 14);
 
                     polygon_edit_tuplah = L.polygon(list_poly_edit).addTo(map_edit_tuplah)
                     polygon_edit_tuplah.enableEdit();
+
+                    
+                    $('#btn_ceklwas').click(function() {
+                        var hasil = (JSON.stringify(polygon_edit_tuplah.toGeoJSON()))
+                        var seeArea = L.GeometryUtil.geodesicArea(polygon_edit_tuplah.getLatLngs()[0]);
+                        var fixarea = seeArea.toFixed(3)
+                        var separ = fixarea.toString().split(".");
+                        var areacom = separ.replace(/\B(?=(\d{3})+(?!\d))/g, ",");
+                        separ.join(".");
+                        $("#luas_tuplah_edit").val(fixarea);
+                    })
+
                     $('#btnsavetuplah').click(function() {
                         var hasil = (JSON.stringify(polygon_edit_tuplah.toGeoJSON()))
                         $("#coordinatetuplah").val(hasil);
@@ -1329,10 +1223,11 @@
                 }
             },
         })
+    });
 
+    // $(document).on("click", "#btnsavetuplah", function() {
 
-
-    });
+    // });
 
     $(document).on("click", "#btnsavetuplah", function() {
         var id_poly = $('#idtuplah').val();
@@ -2228,8 +2123,10 @@
     }
 
     function geojalan() {
+
         var checkBox = document.getElementById("geo_jalan");
         if (checkBox.checked == true) {
+            $(".help_bangunan").html('Polygon Bangunan dan Line Jalan terlihat pada zoom > 16')
             map.on("movestart", function() {
                 if (map.hasLayer(geo_jalan)) {
                     geo_jalan.clearLayers()
@@ -2270,9 +2167,11 @@
             });
 
         } else {
+            $(".help_bangunan").html('')
             geo_jalan.clearLayers();
             geo_jalan.remove();
         }
+        cek_overlay()
     }
 
     var map_edit_jalan = L.map('map-jalan', {
@@ -2296,6 +2195,11 @@
     });
 
     $(document).on("click", "#btn_jalan", function() {
+        $("#koordinat_cek").addClass("active")
+        $("#info_umum").removeClass("active")
+        $("#left-tab1-feas-upl-j").addClass("active")
+        $("#right-tab2-feas-upl-j").removeClass("active")
+
         if (map_edit_jalan.hasLayer(polygon_edit_jalan)) {
             polygon_edit_jalan.remove()
         }
@@ -2874,6 +2778,11 @@
 
 
     $(document).on("click", "#btn_perbaikan_jalan", function() {
+        $("#koordinat_cek").addClass("active")
+        $("#info_umum").removeClass("active")
+        $("#left-tab1-feas-upl-j").addClass("active")
+        $("#right-tab2-feas-upl-j").removeClass("active")
+
         geo_jalan_input.clearLayers(geo_jalan_input)
         $("#input_perbaikan").css("display", "block");
         var id_jalan = $("#idjalan").val();
@@ -3120,10 +3029,6 @@
         $("body").css("padding-right", "0px !important")
     })
 
-    $("#saveuser").on("click", function() {
-        addUser()
-    })
-
 
     function loadjlbyid(id) {
         var isObject = {};
@@ -3489,7 +3394,6 @@
 
 <script>
     //klik kanan begin
-
     map.on('contextmenu', function(e) {
 
         $("#modal_option_create").modal("show");
@@ -3499,6 +3403,7 @@
 
 
         $(".btn_create_jalan").click(function() {
+            $("#create_all > div > ul").css("display", "block")
             $("#modal__create").modal("show");
             $(".title-create").html("Create Jalan")
             $(".tombol_action_create").html(`<input type="button" id="create-jal" value="Create" style="z-index: 1000;position:relative;">`)
@@ -3584,8 +3489,10 @@
             });
 
             map_create_all.on('draw:created', function(e) {
+
                 var type = e.layerType,
                     layer = e.layer;
+
                 layer.options.color = 'yellow';
                 layer.options.weight = 10;
                 var koordina = ""
@@ -3621,6 +3528,7 @@
 
         })
         $(".btn_create_bangunan").click(function() {
+            $("#create_all > div > ul").css("display", "block")
             $("#modal__create").modal("show");
             $(".title-create").html("Create Bangunan")
             $(".tombol_action_create").html(`<input type="button" id="create" value="Create" style="z-index: 1000;position:relative;">`)
@@ -3789,7 +3697,7 @@
             }, 500);
 
             $('#create').click(function() {
-                map_create_all.enable();
+                polygonDraweredit.enable();
             });
 
             var Marker = {};
@@ -3817,6 +3725,9 @@
                 }
                 window.thisBaseDrawPolygonLayer = layer;
                 $("#poly_create_bangunan").val(JSON.stringify(kordinat));
+                var seeArea = L.GeometryUtil.geodesicArea(layer.getLatLngs()[0]);
+                var fixarea = seeArea.toFixed(3)
+                $("#luas_bangunan_create").val(fixarea);
             });
 
             polygon_options = {
@@ -3834,7 +3745,7 @@
 
             var polygonDraweredit = new L.Draw.Polygon(map_create_all, polygon_options);
 
-            map_create_all.on("click", function(event) {
+            polygonDraweredit.on("click", function(event) {
                 shapecoords.innerHTML = event.latlng.toString();
                 map_create_all.fire("click", event); // Trigger a map click as well.
             });
@@ -3847,29 +3758,76 @@
                 Poly = lay;
             });
 
+            $("#tipe_point_b").change(function() {
+                var tipe = $(this).val();
+
+                $.ajax({
+                    url: "{% url 'api:change-tipe' %}",
+                    data: {
+                        'tipe': tipe
+                    },
+                    dataType: 'json',
+                    success: function(data) {
+                        var data_all_kab = []
+                        for (var i = 0; i < data['result'].length; i++) {
+                            var data_k = data['result'][i][0];
+                            console.log(data_k)
+                            var data_kab = `<option value="` + data_k + `">` + data_k + `</option>`;
+                            data_all_kab.push(data_kab)
+                        };
+                        $('#tipe_point_2_b').html(`<option value="null" selected disabled>-- Pilih Tipe Point --</option>` + data_all_kab);
+                        $('#tipe_point_3_b').html(`<option value="null" selected disabled>-- Pilih Point --</option>`);
+                    }
+                });
+            });
+
+            $("#tipe_point_2_b").change(function() {
+                var jenis = $(this).val();
+                var tipx = $("#tipe_point_b").val();
+
+                $.ajax({
+                    url: "{% url 'api:change-jenis' %}",
+                    data: {
+                        'tipe': tipx,
+                        'jenis': jenis
+                    },
+                    dataType: 'json',
+                    success: function(data) {
+                        console.log(data)
+                        var data_all_kab = []
+                        for (var i = 0; i < data['result'].length; i++) {
+                            var data_id = data['result'][i][0];
+                            var data_po = data['result'][i][1];
+                            var data_kab = `<option value="` + data_id + `">` + data_po + `</option>`;
+                            data_all_kab.push(data_kab)
+                        };
+                        $('#tipe_point_3_b').html(`<option value="null" selected disabled>-- Pilih Point --</option>` + data_all_kab);
+                    }
+                });
+            });
             $("#map-create-all > div.leaflet-control-container > div.leaflet-top.leaflet-left > div").css("display", "none")
         });
 
-        $(".btn_create_point").click(function() {
+        $(".btn_create_lahan").click(function() {
+            $("#create_all > div > ul").css("display", "block")
             $("#modal__create").modal("show");
-            $(".title-create").html("Create Point")
-            $(".tombol_action_create").html(``)
+            $(".title-create").html("Create Lahan")
+            $(".tombol_action_create").html(`<input type="button" id="create" value="Create" style="z-index: 1000;position:relative;">`)
             $(".tab_1").html("Koordinat")
-            $(".tab_2").html("Informasi Point")
-            $(".tombol_save_create").html(`<input type="button" class="btn btn-primary" id="btnsavepoint" value="SAVE">
-            <input type="text" name="poly_create_point" class="hidden" id="poly_create_point" value="">`)
-
+            $(".tab_2").html("Informasi Lahan")
+            $(".tombol_save_create").html(`<input type="button" class="btn btn-primary" id="create_save_lahan" value="SAVE" style="margin-right:30px;">
+            <input type="text" name="poly_create" class="hidden" id="poly_create_lahan" value="">`)
             $("#koordinatjalan").html(`
                                         <div class="form-group">
                                             <div id="map-create-all" style="height: 300px;">
-                                                <!-- <div class="tombol_action_create">
-                                                    <input type="button" class="leaflet-draw-draw-marker" value="Create" style="z-index: 1000;position:relative;">
-                                                </div> -->
+                                                <div class="tombol_action_create">
+                                                    <input type="button" id="create" value="Create" style="z-index: 1000;position:relative;">
+                                                </div>
                                             </div>
                                             <div class="form-group">
                                                 <label class="col-lg-2 control-label" style="margin-top:10px">Image</label>
                                                 <div class="col-lg-9" style="margin-top:10px">
-                                                    <input type="file" id="gambar_pitik" name="images[]" multiple accept="image/jpg,image/png,image/jpeg,image/gif">
+                                                    <input type="file" id="img_lahan" name="images[]" multiple accept="image/jpg,image/png,image/jpeg,image/gif">
                                                 </div>
                                             </div>
                                         </div>`)
@@ -3877,42 +3835,33 @@
             $("#informasi_create").html(`
                                         <div class="row" style="margin-top: 15px;">
                                             <div class="form-group">
-                    <label class="col-lg-3 control-label lbl-top" style="margin-top: 15px;">Nama Point</label>
-                    <div class="col-lg-9">
-                        <input id="name_create_point" type="text" class="form-control" value="" required>
-                    </div>
-                </div>
-            </div>
-
-            <div class="row" style="margin-top: 15px;">
-                <div class="form-group">
-                    <label class="col-lg-3 control-label lbl-top" style="margin-top: 15px;">Jenis Point</label>
+                                                <label class="col-lg-3 control-label lbl-top" >Nama Lahan</label>
                                                 <div class="col-lg-9">
-                        <select style="border-bottom: 1px solid rgb(83, 83, 83) !important;" id="tipe_point" data-placeholder="select point.." class="select-size-md">
-                            <option value="null" selected disabled>-- Pilih Jenis Point --</option>
-                            <option value="kantor_administrasi">Kantor Administrasi</option>
-                            <option value="layanan_kesehatan">Layanan Kesehatan</option>
-                            <option value="puskesmas">Puskesmas</option>
-                            <option value="rumah_sakit">Rumah Sakit</option>
-                            <option value="sarana_ibadah">Sarana Ibadah</option>
-                            <option value="sarana_pendidikan">Sarana Pendidikan</option>
-                            <option value="spbu">SPBU</option>
-                            <option value="stasiun">Stasiun</option>
-                            <option value="terminal_bus">Terminal Bus</option>
-                            <option value="cagar_budaya">Cagar Budaya dan Tempat Wisata</option>
-                            <option value="gardu_listrik">Gardu Listrik</option>
-
-                        </select>
+                                                    <input id="name_create" type="text" class="form-control" value="" required>
                                                 </div>
                                             </div>
                                         </div>
 
                                         <div class="row" style="margin-top: 15px;">
                                             <div class="form-group">
-                    <label class="col-lg-3 control-label lbl-top" style="margin-top: 15px;">Tipe Point</label>
+                                                <label class="col-lg-3 control-label lbl-top" >Jenis Lahan</label>
                                                 <div class="col-lg-9">
-                        <select style="border-bottom: 1px solid rgb(83, 83, 83) !important;width: 220px;" id="tipe_point_2" data-placeholder="select point.." class="select-size-md">
-                            <option value="null" selected disabled>-- Pilih Tipe Point --</option>
+                                                    <select style="border-bottom: 1px solid rgb(83, 83, 83) !important;" id="tipe_point_lahan" data-placeholder="select point.." class="select-size-md">
+                                                        <option value="null" selected disabled>-- Pilih Jenis Lahan --</option>
+                                                        <option value="Belukar">Belukar</option>
+                                                        <option value="Belukar Rawa">Belukar Rawa</option>
+                                                        <option value="Hutan Lahan Kering Primer">Hutan Lahan Kering Primer</option>
+                                                        <option value="Hutan Lahan Kering Sekunder">Hutan Lahan Kering Sekunder</option>
+                                                        <option value="Hutan Tanaman">Hutan Tanaman</option>
+                                                        <option value="Pemukiman">Pemukiman</option>
+                                                        <option value="Perkebunan">Perkebunan</option>
+                                                        <option value="Pertambangan">Pertambangan</option>
+                                                        <option value="Pertanian Lahan Kering">Pertanian Lahan Kering</option>
+                                                        <option value="Pertanian Lahan Kering Campur">Pertanian Lahan Kering Campur</option>
+                                                        <option value="Savana / Padang rumput">Savana / Padang rumput</option>
+                                                        <option value="Sawah">Sawah</option>
+                                                        <option value="Tanah Terbuka">Tanah Terbuka</option>
+                                                        <option value="Transmigrasi">Transmigrasi</option>
                                                     </select>
                                                 </div>
                                             </div>
@@ -3920,43 +3869,34 @@
 
                                         <div class="row" style="margin-top: 15px;">
                                             <div class="form-group">
-                    <label class="col-lg-3 control-label lbl-top" style="margin-top: 15px;">Alamat</label>
+                                                <label class="col-lg-3 control-label lbl-top" >Tahun</label>
                                                 <div class="col-lg-9">
-                        <input id="alamat_create_point" type="text" class="form-control" value="" placeholder="cth : Jl. Contoh Rt 005/01 No.01" required>
+                                                    <input id="tahun_create" type="text" class="form-control" value="" required>
                                                 </div>
                                             </div>
                                         </div>
 
                                         <div class="row" style="margin-top: 15px;">
                                             <div class="form-group">
-                    <label class="col-lg-3 control-label lbl-top" style="margin-top: 15px;">Luas Tanah</label>
+                                                <label class="col-lg-3 control-label lbl-top" >Luas Lahan</label>
                                                 <div class="col-lg-6">
-                        <input id="luas_tanah_point" type="text" class="form-control" value="" required>
-                    </div>
-                    <div class="col-lg-3">
-                        <select id="satuan_luas_tanah" style="margin-top: 15px;">
-                                <option>m2</option>
-                            </select>
-                    </div>
+                                                    <input id="luas_lahan_create" type="text" class="form-control" value="" required>
                                                 </div>
-            </div>
-
-            <div class="row" style="margin-top: 15px;">
-                <div class="form-group">
-                    <label class="col-lg-3 control-label lbl-top" style="margin-top: 15px;">Pimpinan</label>
-                    <div class="col-lg-9">
-                        <input id="pemilik_point" type="text" class="form-control" value="" placeholder="cth : Ali Budiman, S.Si." required>
+                                                <div class="col-lg-3" style="margin-top:8px;">
+                                                    <span>m2</span>
                                                 </div>
                                             </div>
                                         </div>
                                         `);
 
+            var nowyear = new Date().getFullYear();
+            $("#tahun_create").val(nowyear);
 
             var map_create_all = L.map('map-create-all', {
                 editable: true,
                 zoomControl: false,
                 drawControl: true
-            }).setView([e.latlng.lat, e.latlng.lng], 20.5);
+            }).setView([e.latlng.lat, e.latlng.lng], 20);
 
             L.tileLayer('https://mt1.google.com/vt/lyrs=s&x={x}&y={y}&z={z}', {
                 maxZoom: 22,
@@ -3967,61 +3907,237 @@
                 map_create_all.invalidateSize();
             }, 500);
 
-            $(".leaflet-draw-draw-marker").html('<span>Create</span>')
+            $('#create').click(function() {
+                polygonDraweredit.enable();
+            });
 
-            var drawControl = new L.Control.Draw(drawPluginOptions);
-            map_create_all.addControl(drawControl);
+            var Marker = {};
+            var Poly = {};
 
-            var editableLayers = new L.FeatureGroup();
-            map_create_all.addLayer(editableLayers);
+            map_create_all.on(L.Draw.Event.CREATED, function(e) {
+                var layer = e.layer;
 
-            // define custom marker
-            var MyCustomMarker = L.Icon.extend({
-                options: {
-                    shadowUrl: null,
-                    iconAnchor: new L.Point(12, 12),
-                    iconSize: new L.Point(24, 24),
-                }
-            });
+                $("#poly_create_lahan").empty();
 
-            var drawPluginOptions = {
-                position: 'topright',
-                draw: {
-                    marker: {
-                        title: "soyel1",
-                        icon: new MyCustomMarker()
-                    },
-                    marker: true
-                },
-                edit: {
-                    featureGroup: editableLayers, //REQUIRED!!
-                    remove: true
-                }
-            };
+                var type = e.layerType;
+                var layer = e.layer;
 
-            var drawControl = new L.Control.Draw(drawPluginOptions);
-            map_create_all.addControl(drawControl);
+                var shape = layer.toGeoJSON();
+                let geoShape = shape.geometry.coordinates[0];
 
-            var editableLayers = new L.FeatureGroup();
-            map_create_all.addLayer(editableLayers);
+                let kordinat = "";
+                for (j in geoShape) {
 
-            map_create_all.on('draw:created', function(e) {
-                var type = e.layerType,
-                    layer = e.layer;
+                    kordinat += geoShape[j][0] + ' ' + geoShape[j][1];
 
-                editableLayers.addLayer(layer);
-                $("#poly_create_point").val(JSON.stringify(layer.toGeoJSON()));
-                $("#modal_point").modal()
-                map.closePopup();
-            });
-            $("#map-create-all > div.leaflet-control-container > div.leaflet-top.leaflet-left > div:nth-child(2) > div > div").css("display", "none")
+                    if (j <= (geoShape.length - 2)) {
+                        kordinat += ', ';
+                    }
+                }
+                window.thisBaseDrawPolygonLayer = layer;
+                $("#poly_create_lahan").val(JSON.stringify(kordinat));
+                var seeArea = L.GeometryUtil.geodesicArea(layer.getLatLngs()[0]);
+                var fixarea = seeArea.toFixed(3)
+                $("#luas_lahan_create").val(fixarea);
 
-            $("#map-create-all > div.leaflet-control-container > div.leaflet-top.leaflet-right").css("display", "none")
-            $("#map-create-all > div.leaflet-control-container > div.leaflet-top.leaflet-left > div:nth-child(1) > div > div > a.leaflet-draw-draw-polyline").css("display", "none")
+            });
 
-            $("#map-create-all > div.leaflet-control-container > div.leaflet-top.leaflet-left > div:nth-child(2) > div > div > a.leaflet-draw-draw-marker").css("display", "block!important")
+            polygon_options = {
+                showArea: false,
+                shapeOptions: {
+                    stroke: true,
+                    color: '#6e83f0',
+                    weight: 1.5,
+                    opacity: 2,
+                    fill: false,
+                    fillColor: null, //same as color by default
+                    clickable: true
+                }
+            }
 
-        })
+            var polygonDraweredit = new L.Draw.Polygon(map_create_all, polygon_options);
+
+            //            polygonDraweredit.on("click", function(event) {
+            //                shapecoords.innerHTML = event.latlng.toString();
+            //                map_create_all.fire("click", event); // Trigger a map click as well.
+            //            });
+
+            map_create_all.on('draw:created', function(e) {
+                var type = e.layerType,
+                    layer = e.layer;
+
+                var lay = layer.addTo(map_create_all);
+                Poly = lay;
+            });
+
+            $("#map-create-all > div.leaflet-control-container > div.leaflet-top.leaflet-left > div").css("display", "none")
+        });
+
+        $(".btn_create_point").click(function() {
+            $("#modal__create").modal("show");
+            $(".title-create").html("Create Point")
+            $(".tombol_action_create").html(``)
+            $(".tab_1").html("Koordinat")
+            $(".tab_2").html("Informasi Point")
+            $("#create_all > div > ul").css("display", "block")
+            $(".tombol_save_create").html(`<input type="button" class="btn btn-primary" id="btnsavepoint" value="SAVE">
+            <input type="text" name="poly_create_point" class="hidden" id="poly_create_point" value="">`)
+
+            $("#koordinatjalan").html(`
+                                        <div class="form-group">
+                                            <div id="map-create-all" style="height: 300px;">
+                                                <!-- <div class="tombol_action_create">
+                                                    <input type="button" class="leaflet-draw-draw-marker" value="Create" style="z-index: 1000;position:relative;">
+                                                </div> -->
+                                            </div>
+                                            <div class="form-group">
+                                                <label class="col-lg-2 control-label" style="margin-top:10px">Image</label>
+                                                <div class="col-lg-9" style="margin-top:10px">
+                                                    <input type="file" id="gambar_pitik" name="images[]" multiple accept="image/jpg,image/png,image/jpeg,image/gif">
+                                                </div>
+                                            </div>
+                                        </div>`)
+
+            $("#informasi_create").html(`
+            <div class="row" style="margin-top: 15px;">
+                <div class="form-group">
+                    <label class="col-lg-3 control-label lbl-top" style="margin-top: 15px;">Nama Point</label>
+                    <div class="col-lg-9">
+                        <input id="name_create_point" type="text" class="form-control" value="" required>
+                    </div>
+                </div>
+            </div>
+
+            <div class="row" style="margin-top: 15px;">
+                <div class="form-group">
+                    <label class="col-lg-3 control-label lbl-top" style="margin-top: 15px;">Jenis Point</label>
+                    <div class="col-lg-9">
+                        <select style="border-bottom: 1px solid rgb(83, 83, 83) !important;" id="tipe_point" data-placeholder="select point.." class="select-size-md">
+                            <option value="null" selected disabled>-- Pilih Jenis Point --</option>
+                            <option value="kantor_administrasi">Kantor Administrasi</option>
+                            <option value="layanan_kesehatan">Layanan Kesehatan</option>
+                            <option value="puskesmas">Puskesmas</option>
+                            <option value="rumah_sakit">Rumah Sakit</option>
+                            <option value="sarana_ibadah">Sarana Ibadah</option>
+                            <option value="sarana_pendidikan">Sarana Pendidikan</option>
+                            <option value="spbu">SPBU</option>
+                            <option value="stasiun">Stasiun</option>
+                            <option value="terminal_bus">Terminal Bus</option>
+                            <option value="cagar_budaya">Cagar Budaya dan Tempat Wisata</option>
+                            <option value="gardu_listrik">Gardu Listrik</option>
+
+                        </select>
+                    </div>
+                </div>
+            </div>
+
+            <div class="row" style="margin-top: 15px;">
+                <div class="form-group">
+                    <label class="col-lg-3 control-label lbl-top" style="margin-top: 15px;">Tipe Point</label>
+                    <div class="col-lg-9">
+                        <select style="border-bottom: 1px solid rgb(83, 83, 83) !important;width: 220px;" id="tipe_point_2" data-placeholder="select point.." class="select-size-md">
+                            <option value="null" selected disabled>-- Pilih Tipe Point --</option>
+                        </select>
+                    </div>
+                </div>
+            </div>
+
+            <div class="row" style="margin-top: 15px;">
+                <div class="form-group">
+                    <label class="col-lg-3 control-label lbl-top" style="margin-top: 15px;">Alamat</label>
+                    <div class="col-lg-9">
+                        <input id="alamat_create_point" type="text" class="form-control" value="" placeholder="cth : Jl. Contoh Rt 005/01 No.01" required>
+                    </div>
+                </div>
+            </div>
+
+            <div class="row" style="margin-top: 15px;">
+                <div class="form-group">
+                    <label class="col-lg-3 control-label lbl-top" style="margin-top: 15px;">Luas Tanah</label>
+                    <div class="col-lg-6">
+                        <input id="luas_tanah_point" type="text" class="form-control" value="" required>
+                    </div>
+                    <div class="col-lg-3">
+                        <select id="satuan_luas_tanah" style="margin-top: 15px;">
+                                <option>m2</option>
+                            </select>
+                    </div>
+                </div>
+            </div>
+
+            <div class="row" style="margin-top: 15px;">
+                <div class="form-group">
+                    <label class="col-lg-3 control-label lbl-top" style="margin-top: 15px;">Pimpinan</label>
+                    <div class="col-lg-9">
+                        <input id="pemilik_point" type="text" class="form-control" value="" placeholder="cth : Ali Budiman, S.Si." required>
+                    </div>
+                </div>
+            </div>
+                                        `);
+
+
+            var map_create_all = L.map('map-create-all', {
+                editable: true,
+                zoomControl: false,
+                drawControl: true
+            }).setView([e.latlng.lat, e.latlng.lng], 20.5);
+
+            L.tileLayer('https://mt1.google.com/vt/lyrs=s&x={x}&y={y}&z={z}', {
+                maxZoom: 22,
+                minZoom: 4,
+            }).addTo(map_create_all);
+
+            setTimeout(function() {
+                map_create_all.invalidateSize();
+            }, 1000);
+
+            $(".leaflet-draw-draw-marker").html('<span>Create</span>')
+
+            var drawControl = new L.Control.Draw(drawPluginOptions);
+            map_create_all.addControl(drawControl);
+
+            var editableLayers = new L.FeatureGroup();
+            map_create_all.addLayer(editableLayers);
+
+            // define custom marker
+            var MyCustomMarker = L.Icon.extend({
+                options: {
+                    shadowUrl: null,
+                    iconAnchor: new L.Point(12, 12),
+                    iconSize: new L.Point(24, 24),
+                }
+            });
+
+            var drawPluginOptions = {
+                position: 'topright',
+                draw: {
+                    marker: {
+                        title: "soyel1",
+                        icon: new MyCustomMarker()
+                    },
+                    marker: true
+                },
+                edit: {
+                    featureGroup: editableLayers, //REQUIRED!!
+                    remove: true
+                }
+            };
+
+            var drawControl = new L.Control.Draw(drawPluginOptions);
+            map_create_all.addControl(drawControl);
+
+            var editableLayers = new L.FeatureGroup();
+            map_create_all.addLayer(editableLayers);
+
+            map_create_all.on('draw:created', function(e) {
+                var type = e.layerType,
+                    layer = e.layer;
+
+                editableLayers.addLayer(layer);
+                $("#poly_create_point").val(JSON.stringify(layer.toGeoJSON()));
+                $("#modal_point").modal()
+                map.closePopup();
+            });
 
             $("#tipe_point").change(function() {
                 var tipe = $(this).val();
@@ -4049,56 +4165,404 @@
                 });
             });
 
-        $("#tipe_point_b").change(function() {
-            var tipe = $(this).val();
+            $("#map-create-all > div.leaflet-control-container > div.leaflet-top.leaflet-left > div:nth-child(2) > div > div").css("display", "none")
+            $(".leaflet-draw-draw-marker").css("padding", "0px!important")
+            $(".leaflet-draw-draw-marker").css("width", "100%!important")
+            $("#map-create-all > div.leaflet-control-container > div.leaflet-top.leaflet-right").css("display", "none")
+            $("#map-create-all > div.leaflet-control-container > div.leaflet-top.leaflet-left > div:nth-child(1) > div > div > a.leaflet-draw-draw-polyline").css("display", "none")
+            $("#map-create-all > div.leaflet-control-container > div.leaflet-top.leaflet-left > div:nth-child(2) > div > div > a.leaflet-draw-draw-marker").css("display", "block!important")
 
-            $.ajax({
-                url: "{% url 'api:change-tipe' %}",
-                data: {
-                    'tipe': tipe
-                },
-                dataType: 'json',
-                success: function(data) {
-                    var data_all_kab = []
-                    for (var i = 0; i < data['result'].length; i++) {
-                        var data_k = data['result'][i][0];
-                        console.log(data_k)
-                        var data_kab = `<option value="` + data_k + `">` + data_k + `</option>`;
-                        data_all_kab.push(data_kab)
-                    };
-                    $('#tipe_point_2_b').html(`<option value="null" selected disabled>-- Pilih Tipe Point --</option>` + data_all_kab);
+        })
+
+        $(".btn_cek_KDBKLB").click(function() {
+            $("#koordinatjalan").addClass("active")
+            $("#informasi_create").removeClass("active")
+            $("#tab_koor").addClass("active")
+            $("#tab_info").removeClass("active")
+            $("#modal__create").modal("show");
+            $(".title-create").html("Cek KDB & KLB")
+            $(".tombol_save_create").html('')
+            $(".tab_1").html("Koordinat")
+            $(".tab_2").html("Informasi")
+            $("#create_all > div > ul").css("display", "none")
+            $("#koordinatjalan").html(`
+                                        <div class="jumlah_lantai" style="margin-top: -15px;">jumlah_lantai : 0
+                                        </div>
+                                        <div class="form-group">
+                                            <div id="map-create-all" style="height: 300px;">
+                                                <!-- <div class="tombol_action_create">
+                                                    <input type="button" class="leaflet-draw-draw-marker" value="Create" style="z-index: 1000;position:relative;">
+                                                </div> -->
+                                                <div style="margin:10px;">
+                                                    <input type="button" id="create_poly_rumah" value="Create Polygon Rumah" style="z-index: 1000;position:relative;border: transparent;border-radius: 5px;display:none;">
+                                                    <input type="button" id="create_poly_tanah" value="Create Polygon Tanah" style="z-index: 1000;position:relative;border: transparent;border-radius: 5px;background: antiquewhite;">
+                                                    <input type="button" id="delete_poly" value="Reset" style="z-index: 1000;position:relative;background: azure;border: transparent;border-radius: 5px;display:none;margin-top: 5px;">
+                                                </div>
+                                            </div>
+                                            <div class="row">
+                                                <div class="col-md-6">
+                                                    
+                                                    <div class="row" style="margin-top: 5px;margin-right:5px!important;">
+                                                        <div class="form-group">
+                                                            <label class="control-label lbl-top">Luas Lantai (m2)</label>
+                                                            <div class="">
+                                                                <input id="luas_polygon_lantai" type="text" class="form-control" value="" required>
+                                                            </div>
+                                                            <div class="alert alert-danger" id="notificationluaslantai" style="display: none;margin: 0px;padding-top: 0px;padding-bottom: 0px;font-size: 10px;position: absolute;top: -5px;left: 110px;">
+                                                            </div>
+                                                        </div>
+                                                    </div>
+
+                                                    <div class="row" style="margin-top: 5px;margin-right:5px!important;">
+                                                        <div class="form-group">
+                                                            <label class="control-label lbl-top">Luas Rumah (m2)</label>
+                                                            <div class="">
+                                                                <input id="luas_polygon_rumah" type="text" class="form-control" value="" required>
+                                                            </div>
+                                                            <div class="alert alert-danger" id="notificationluasrumah" style="display: none;margin: 0px;padding-top: 0px;padding-bottom: 0px;font-size: 10px;position: absolute;top: -5px;left: 110px;">
+                                                            </div>
+                                                        </div>
+                                                    </div>
+
+                                                    <div class="row" style="margin-top: 5px;margin-right:5px!important;">
+                                                        <div class="form-group">
+                                                            <label class="control-label lbl-top">Luas Tanah (m2)</label>
+                                                            <div class="">
+                                                                <input id="luas_polygon_tanah" type="text" class="form-control" value="" required>
+                                                            </div>
+                                                            <div class="alert alert-danger" id="notificationluastanah" style="display: none;margin: 0px;padding-top: 0px;padding-bottom: 0px;font-size: 10px;position: absolute;top: -5px;left: 110px;">
+                                                            </div>
+                                                        </div>
+                                                    </div>
+                                                </div>
+                                                <div class="col-md-6">
+                                                    <div class="row" style="margin-top: 5px;margin-left:5px!important;">
+                                                        <div class="form-group">
+                                                            <label class="control-label lbl-top">Sisa Luas Tanah (m2):</label>
+                                                            <div class="">
+                                                                <input id="sisa_luas_tanah" type="text" class="form-control" value="" required disabled>
+                                                            </div>
+                                                        </div>
+                                                    </div>
+                                                    
+                                                    <div class="row" style="margin-top: 5px;margin-left:5px!important;">
+                                                        <div class="form-group">
+                                                            <label class="control-label lbl-top">KDB (%):</label>
+                                                            <div class="">
+                                                                <input id="KDB_polygon_rumah" type="text" class="form-control" value="" required disabled>
+                                                            </div>
+                                                        </div>
+                                                    </div>
+                                        
+                                                    <div class="row" style="margin-top: 5px;margin-left:5px!important;">
+                                                        <div class="form-group">
+                                                            <label class="control-label lbl-top">KLB :</label>
+                                                            <div class="">
+                                                                <input id="KLB_polygon_rumah" type="text" class="form-control" value="" required disabled>
+                                                            </div>
+                                                        </div>
+                                                    </div>
+        
+                                                </div>
+                                            </div>
+                                        </div>`)
+
+            $("#informasi_create").html(``);
+
+            var map_create_all = L.map('map-create-all', {
+                editable: true,
+                zoomControl: false,
+                drawControl: true
+            }).setView([e.latlng.lat, e.latlng.lng], 20.5);
+
+            L.tileLayer('https://mt1.google.com/vt/lyrs=s&x={x}&y={y}&z={z}', {
+                maxZoom: 22,
+                minZoom: 4,
+            }).addTo(map_create_all);
+
+            setTimeout(function() {
+                map_create_all.invalidateSize();
+            }, 500);
+
+            $("#map-create-all > div.leaflet-control-container > div.leaflet-top.leaflet-left > div > div > div").css("display", "none")
+
+
+            $("#create_poly_rumah").click(function() {
+
+                polygonDraweredit.enable();
+                $("#create_poly_tanah").val('tambah polygon rumah')
+            })
+
+            $("#create_poly_tanah").click(function() {
+                $('#create_poly_rumah').css("display", "block")
+                $('#create_poly_tanah').css("display", "none")
+                $('#delete_poly').css("display", "block")
+
+                polygonDraweredit_tanah.enable();
+
+
+            })
+
+            //            function get_luas(lt_p, lo_p) {
+            //                var lt_po = lt_p
+            //                var lo_po = lo_p
+            //
+            //                var lat_rad = []
+            //                var YY = []
+            //                var XX = []
+            //                var area = []
+            //
+            //                for (var i = 0; i < lt_po.length; i++) {
+            //                    lt_rad = lt_po[i] / 180 * (22 / 7)
+            //                    lat_rad.push(lt_rad)
+            //                }
+            //
+            //                for (var y = 0; y < lt_po.length; y++) {
+            //                    if (y == 0 || y == lt_po.length - 1) {
+            //                        YY.push(0)
+            //                    } else {
+            //                        yyy = (lt_po[y] - lt_po[0]) / 360 * (6378137 * 2 * (22 / 7))
+            //                        YY.push(yyy)
+            //                    }
+            //                }
+            //
+            //                for (var x = 0; x < lo_po.length; x++) {
+            //                    if (x == 0 || x == lo_po.length - 1) {
+            //                        XX.push(0)
+            //                    } else {
+            //                        xxx = (lo_po[x] - lo_po[0]) / 360 * (6378137 * 2 * (22 / 7) * Math.cos(lat_rad[x]))
+            //                        XX.push(xxx)
+            //                    }
+            //                }
+            //
+            //                for (var i = 0; i < lo_po.length; i++) {
+            //                    if (i == 0 || i == lo_po.length - 1) {
+            //                        area.push(0)
+            //                    } else {
+            //                        are = ((YY[i - 1] * XX[i]) - (XX[i - 1] * YY[i])) / 2
+            //                        area.push(are)
+            //                    }
+            //                }
+            //
+            //                function getSum(total, num) {
+            //                    return total + Math.round(num);
+            //                }
+            //
+            //                var luas_area = area.reduce(getSum, 0)
+            //                return luas_area
+            //            }
+
+
+
+            var luas_all = []
+            window.thisBaseDrawPolygonLayer = [];
+
+            map_create_all.on(L.Draw.Event.CREATED, function(e) {
+                var type = e.layerType;
+                var layer = e.layer;
+
+                var shape = layer.toGeoJSON();
+                let geoShape = shape.geometry.coordinates[0];
+
+                let kordinat = "";
+
+                for (j in geoShape) {
+                    kordinat += geoShape[j][0] + ' ' + geoShape[j][1];
+                    if (j <= (geoShape.length - 2)) {
+                        kordinat += ', ';
                     }
-            });
+                }
+
+                var seeArea = L.GeometryUtil.geodesicArea(layer.getLatLngs()[0]);
+                var fixarea = seeArea.toFixed(3)
+
+                luas_all.push(fixarea)
+                if (luas_all.length > 1) {
+                    var luas_tanah = luas_all[0]
+                    var luas_rumah = luas_all[1]
+                    var luas_lantai = luas_all[1]
+                    var jumlah_lantai = luas_all - 1
+
+                    $("#luas_polygon_rumah").val(parseFloat(luas_rumah).toFixed(2))
+                    $("#luas_polygon_tanah").val(parseFloat(luas_tanah).toFixed(2))
+
+                    $("#sisa_luas_tanah").val((luas_all[0] - luas_all[1]).toFixed(2))
+                    var aaa = 0
+
+
+                    if (luas_all.length > 2) {
+                        var array_lan = luas_all.slice(2)
+                        for (var i = 0; i < array_lan.length; i++) {
+                            luas_lantai = parseFloat(luas_lantai) + parseFloat(array_lan[i])
+                        }
+                    }
+
+                    $("#luas_polygon_lantai").val(parseFloat(luas_lantai).toFixed(2))
+                    $(".jumlah_lantai").html("jumlah lantai : " + (luas_all.length - 1))
+
+                    var klb = luas_lantai / luas_tanah
+                    var kdb = luas_rumah / luas_tanah * 100
+
+                    $("#KDB_polygon_rumah").val(parseFloat(kdb).toFixed(2))
+                    $("#KLB_polygon_rumah").val(parseFloat(klb).toFixed(2))
+
+                }
+
+                window.thisBaseDrawPolygonLayer.push(layer);
             });
 
-        $("#tipe_point_2_b").change(function() {
-            var jenis = $(this).val();
-            var tipx = $("#tipe_point_b").val();
 
-            $.ajax({
-                url: "{% url 'api:change-jenis' %}",
-                data: {
-                    'tipe': tipx,
-                    'jenis': jenis
-                },
-                dataType: 'json',
-                success: function(data) {
-                    console.log(data)
-                    var data_all_kab = []
-                    for (var i = 0; i < data['result'].length; i++) {
-                        var data_id = data['result'][i][0];
-                        var data_po = data['result'][i][1];
-                        var data_kab = `<option value="` + data_id + `">` + data_po + `</option>`;
-                        data_all_kab.push(data_kab)
-                    };
-                    $('#tipe_point_3_b').html(`<option value="null" selected disabled>-- Pilih Point --</option>` + data_all_kab);
+            polygon_options = {
+                showArea: false,
+                shapeOptions: {
+                    stroke: true,
+                    color: '#6e83f0',
+                    weight: 1.5,
+                    opacity: 2,
+                    fill: true,
+                    fillColor: null, //same as color by default
+                    fillOpacity: 0.3,
+                    clickable: true
+                }
+            }
+
+            polygon_options_tanah = {
+                showArea: false,
+                shapeOptions: {
+                    stroke: true,
+                    color: '#fff',
+                    weight: 1.5,
+                    opacity: 2,
+                    fill: true,
+                    fillColor: null, //same as color by default
+                    fillOpacity: 0.3,
+                    clickable: true
+                }
             }
+
+            var polygonDraweredit_tanah = new L.Draw.Polygon(map_create_all, polygon_options_tanah);
+            var polygonDraweredit = new L.Draw.Polygon(map_create_all, polygon_options);
+
+            //            polygonDraweredit.on("click", function(event) {
+            //                shapecoords.innerHTML = event.latlng.toString();
+            //                map_create_all.fire("click", event); // Trigger a map click as well.
+            //            });
+            //
+            //            polygonDraweredit_tanah.on("click", function(event) {
+            //                var type = event.layerType;map_
+            //                shapecoords.innerHTML = event.latlng.toString();
+            //                map_create_all.fire("click", event); // Trigger a map click as well.
+            //            });
+
+
+            map_create_all.on('draw:created', function(e) {
+                var type = e.layerType,
+                    layer = e.layer;
+
+                var lay = layer.addTo(map_create_all);
+                Poly = lay;
             });
+
+            $("#delete_poly").click(function() {
+                if (window.thisBaseDrawPolygonLayer != []) {
+                    for (var i = 0; i < window.thisBaseDrawPolygonLayer.length; i++) {
+                        window.thisBaseDrawPolygonLayer[i].remove()
+                    }
+                    window.thisBaseDrawPolygonLayer = [];
+                    luas_all = [];
+
+                    $('#create_poly_rumah').css("display", "none")
+                    $('#create_poly_tanah').css("display", "block")
+                    $(".jumlah_lantai").html("jumlah lantai : 0")
+                    $("#luas_polygon_rumah").val("")
+                    $("#luas_polygon_tanah").val("")
+                    $("#luas_polygon_lantai").val("")
+                    $("#KDB_polygon_rumah").val("")
+                    $("#KLB_polygon_rumah").val("")
+                    $("#sisa_luas_tanah").val("")
+
+                }
+
             });
 
+            function isi_all() {
+                var luas_rumah = $("#luas_polygon_rumah").val()
+                var luas_tanah = $("#luas_polygon_tanah").val()
+                var luas_lantai = $("#luas_polygon_lantai").val()
+
+                if (luas_rumah == null) {
+                    luas_rumah = 1
+                }
+
+                if (luas_tanah == null) {
+                    luas_tanah = 1
+                }
+
+                if (luas_lantai == null) {
+                    luas_lantai = 1
+                }
+
+                var klb = luas_lantai / luas_tanah
+                var kdb = luas_rumah / luas_tanah * 100
+
+                $("#sisa_luas_tanah").val(luas_tanah - luas_rumah)
+                $("#KDB_polygon_rumah").val(kdb)
+                $("#KLB_polygon_rumah").val(klb)
+            }
+
+            $('#luas_polygon_rumah').on('input', function() {
+                isi_all()
+
+
+                //                if (luas_tanah.indexOf(' ') !== -1 && luas_tanah != null) {
+                //                    var luas_tanah_ret = luas_tanah.split(" ")[0]
+                //                } else if (luas_tanah.indexOf(' ') === -1 && luas_tanah != null) {
+                //                    var luas_tanah_ret = luas_tanah
+                //                }
+                //
+                //                if (luas_tanah !== null) {
+                //                    try {
+                //
+                //                        luas_tanah_ret = convert_to_float(luas_tanah)
+                //                    } catch {
+                //                        $("#notificationluastanah").css("display", "block")
+                //                        $("#notificationluastanah").html("Pastikan yang anda masukan adalah angka")
+                //                    }
+                //                }
+
+            });
+            $('#luas_polygon_tanah').on('input', function() {
+                isi_all()
+            });
+            $('#luas_polygon_lantai').on('input', function() {
+                isi_all()
+            });
 
+        })
     });
 
+    $(document).on("click", "#informasi_poo", function() {
+        var luas_rumah = $("#luas_polygon_rumah").val()
+        var luas_tanah = $("#luas_polygon_tanah").val()
+        if (luas_rumah != null) {
+            var luas_rumah_ret = luas_rumah.split(" ")[0]
+        } else {
+            var luas_rumah_ret = 1
+        }
+
+        if (luas_tanah != null) {
+            var luas_tanah_ret = luas_tanah.split(" ")[0]
+        } else {
+            var luas_tanah_ret = 1
+        }
+
+        var klb = luas_tanah_ret / luas_rumah_ret
+        var kdb = luas_rumah_ret / luas_tanah_ret * 100
+
+        $("#KDB_polygon_rumah").val(kdb + ' %')
+        $("#KLB_polygon_rumah").val(klb)
+    })
+
     $(document).on("click", "#create_save_jalan", function(e) {
         data = new FormData()
         data.append("gambar", $("input[id^='img_jalan']")[0].files[0]);
@@ -4202,6 +4666,50 @@
         });
     });
 
+    $(document).on("click", "#create_save_lahan", function(e) {
+        var polygin = $('#poly_create_lahan').val();
+        var name_poly = $('#name_create').val();
+        var tdb = $('#tipe_point_lahan').val();
+        var alamat_poly = $('#tahun_create').val();
+        var lb_poly = $('#luas_lahan_create').val();
+        $.ajax({
+            url: "api/c_lahan",
+            data: {
+                'polygon': polygin,
+                'name': name_poly,
+                'tipelh': tdb,
+                'tahun': alamat_poly,
+                'luas': lb_poly,
+            },
+            dataType: 'json',
+            // type: 'POST',
+            // processData: false,
+            // contentType: false,
+            success: function(data) {
+                let response = data
+                if (response.status == 0) {
+                    swal({
+                        title: response.info,
+                        text: response.data,
+                        type: "success",
+                        icon: "success",
+                        confirmButtonColor: "#00BCD4"
+                    })
+                } else {
+                    swal({
+                        title: response.info,
+                        text: response.data,
+                        type: "warning",
+                        icon: "error",
+                        confirmButtonColor: "#00BCD4"
+                    })
+
+                }
+                map.closePopup();
+            }
+        });
+    });
+
 
     $(document).on("click", "#btnsavepoint", function(e) {
         data = new FormData()

templates/includes/modal.html

@@ -130,13 +130,13 @@
 
                         <div class="tabbable">
                             <ul class="nav nav-tabs nav-tabs-bottom nav-justified">
-                                <li onclick="changetabs(this)" class="active"><a href="#left-tab1-feas-upl-j" data-toggle="tab">Koordinat</a></li>
-                                <li onclick="changetabs(this)"><a href="#right-tab2-feas-upl-j" data-toggle="tab">Informasi Umum</a></li>
+                                <li onclick="changetabs(this)" id="koordinat_cek" class="active"><a href="#left-tab1-feas-upl-j" data-toggle="tab">Koordinat</a></li>
+                                <li onclick="changetabs(this)" id="info_umum"><a href="#right-tab2-feas-upl-j" data-toggle="tab">Informasi Umum</a></li>
                             </ul>
 
                             <div class="tab-content">
                                 <div class="tab-pane active" id="left-tab1-feas-upl-j">
-                                    <div id="map-jalan" style="width: 400px;height: 300px;position: relative;margin-left: 100px;"></div>
+                                    <div id="map-jalan" style="height: 300px;position: relative;"></div>
 
                                     <div class="form-group">
                                         <label class="col-lg-2 control-label" style="margin-top:10px">Image</label>
@@ -268,6 +268,10 @@
 
 </div>
 
+<div id="input_perbaikan_bang-s" class="modal fade">
+
+</div>
+
 <!-- modal tuplah -->
 <div id="modal-edit-tuplah" class="modal fade">
     <div class="modal-dialog" style="width: max-content;height: max-content;">
@@ -291,7 +295,30 @@
                 <table>
                     <tr>
                         <th>
-                            Image
+                            Luas &nbsp;
+                        </th>
+                        <td>
+                            <input id="luas_tuplah_edit" type="text" class="form-control" value="" disabled>
+                        </td>
+                        <td>
+                            <button type="submit" id="btn_ceklwas" class="btn btn-primary" title="Check Luas" style="border-radius: 0px 10px 10px 0px;
+                                outline: none;
+                                background: linear-gradient(
+                            201.55deg
+                            , #72BBFF -24.21%, #3D5CCA 130.65%);"><i class="icon-search4 text-muted text-size-base" style="color: white;"></i></button>
+                        </td>
+                    </tr>
+                    <tr>
+                        <th>
+                            &nbsp;
+                        </th>
+                        <td>
+                            &nbsp;
+                        </td>
+                    </tr>
+                    <tr>
+                        <th>
+                            Image &nbsp;
                         </th>
                         <td>
                             <input type="file" id="imgtuplah" name="images[]" multiple accept="image/jpg,image/png,image/jpeg,image/gif">
@@ -324,8 +351,8 @@
     <div class="modal-dialog modal-xs">
         <div class="modal-content">
             <div class="modal-header">
-                <button type="button" class="close" data-dismiss="modal" aria-hidden="true">&times;</button>
-                <h4 class="modal-title">3D Searching</h4>
+                <button type="button" class="close" style="color: white;" data-dismiss="modal" aria-hidden="true">&times;</button>
+                <h4 class="modal-title" style="color: white;">3D Searching</h4>
             </div>
             <div class="modal-body">
                 <fieldset>
@@ -573,7 +600,7 @@
 
 
 <div class="modal fade" id="modal_option_create" tabindex="-1" role="dialog">
-    <div class="modal-dialog modal-xs" style="width: 350px;">
+    <div class="modal-dialog modal-xs" style="width: 450px;">
         <div class="modal-content">
             <div class="modal-header">
                 <button type="button" class="close" data-dismiss="modal" aria-hidden="true">&times;</button>
@@ -622,6 +649,28 @@
                                 </div>
                             </a>
                         </div>
+                        <div class="col-md-4 text-center">
+                            <a href="#" class="btn btn_create_lahan">
+                                <div>
+                                    <img src="{% static 'img/icon-1/SquareHalflahan.svg' %}" alt="" style="width: 35px;
+                                    height: 35px;">
+                                </div>
+                                <div style="margin-top: 10px;">
+                                    <span>Lahan</span>
+                                </div>
+                            </a>
+                        </div>
+                        <div class="col-md-4 text-center">
+                            <a href="#" class="btn btn_cek_KDBKLB">
+                                <div>
+                                    <img src="{% static 'img/icon-1/kelurahan.svg' %}" alt="" style="width: 35px;
+                                    height: 35px;">
+                                </div>
+                                <div style="margin-top: 10px;">
+                                    <span>KDB & KLB</span>
+                                </div>
+                            </a>
+                        </div>
                     </div>
 
                 </fieldset>
@@ -640,8 +689,8 @@
             <div class="modal-body" id="create_all">
                 <div class="tabbable" style="height:450px!important;width: 560px!important;">
                     <ul class="nav nav-tabs nav-tabs-bottom nav-justified">
-                        <li onclick="changetabs(this)" class="active"><a href=".koordinatjalan" data-toggle="tab" class="tab_1">Koordinat</a></li>
-                        <li onclick="changetabs(this)"><a href="#informasi_create" data-toggle="tab" class="tab_2">Informasi Jalan</a></li>
+                        <li onclick="changetabs(this)" id="tab_koor" class="active"><a href=".koordinatjalan" data-toggle="tab" class="tab_1">Koordinat</a></li>
+                        <li onclick="changetabs(this)" id="tab_info"><a href="#informasi_create" data-toggle="tab" id="informasi_poo" class="tab_2">Informasi Jalan</a></li>
                     </ul>
 
                     <div class="tab-content">
@@ -663,11 +712,11 @@
     </div>
 </div>
 
-<div class="modal fade" id="user_profile" tabindex="-1" role="dialog" style="margin-left: 50px;padding-left:0px">
+<div class="modal fade" id="user_profile" tabindex="-1" role="dialog" style="margin-left: 50px;padding-left:0px;">
     <div class="modal-dialog" style="width: 100%;
     margin: 0px;
-    height: 100vh;">
-        <div class="modal-content" style="height: 100vh;">
+    height: 100vh;overflow-y: scroll;">
+        <div class="modal-content">
             <div class="modal-body">
 
                 <div class="row">
@@ -785,7 +834,7 @@
                                     width: 90%;
                                     background: #FFFFFF;
                                     box-sizing: border-box;
-                                    border-radius: 5px;display:none;" onclick="btnuserclick(event)">
+                                    border-radius: 5px;" onclick="btnuserclick(event)">
                                         <div class="row">
                                             <div class="col-sm-2">
                                                 <img src="{% static 'img/icon-1/help.svg' %}" alt="">
@@ -830,10 +879,7 @@
                                 </div>
                                 <div style="border-bottom: 1pt solid #E2E2E2;">
                                     <div class="tab_personal_information" style="margin:0px;">
-                                        <div class="alert alert-danger" id="notificationsprop" style="display: none;margin: 0px;
-                                        padding-top: 0px;
-                                        padding-bottom: 0px;">
-
+                                        <div class="alert alert-danger" id="notificationsprop" style="display: none;margin: 0px;padding-top: 0px;padding-bottom: 0px;">
                                         </div>
                                         <form class="form-horizontal" id="formmen" method="post" enctype="multipart/form-data">
                                             <div class="panel-body">
@@ -997,43 +1043,27 @@
                                             </div>
 
                                         </a>
-
-
+                                    </div>
+                                    <div style="position: absolute;left: 250px;font-size: 10pt;background: #2196F3;border-radius: 10px;">
+                                        <a class="btn side-bar-but" id="add_user" style="z-index:9;color:white;">
+                                            <div>
+                                                <span>Tambah User</span>
+                                            </div>
+                                        </a>
                                     </div>
                                     <thead style="font-size: 12px;line-height: 14px;font-family: 'gilroysemibold';text-transform: capitalize;">
                                         <tr>
                                             <th>No.</th>
-                                            <th>Id user</th>
                                             <th>Nama</th>
                                             <th>Email</th>
+                                            <th>No. Telp</th>
+                                            <th>Jabatan</th>
                                             <th>Last Login</th>
-                                            <th>Status</th>
-                                            <th>Action</th>
+                                            <th>Action/Status</th>
                                         </tr>
                                     </thead>
                                     <tbody id="tbody_user_list">
 
-                                        {% for all in user_res %}
-                                        <tr>
-                                            <td>{{forloop.counter}}</td>
-                                            <td>{{all.id}}</td>
-                                            <td>{{all.username}}</td>
-                                            <td>{{all.email}}</td>
-                                            <td>{{all.last}}</td>
-                                            <td>{{all.isactive}}</td>
-                                            <td class="text-center ">
-                                                <a class="btn mdlFire " onclick="loaddetailid( '{{all.id}}') " data-toggle="modal" data-target="#modal_detail_perbaikan " style="background-color: #5A9AFB;color: white;border-radius: 5px;width: 85px;height: 25px; ">
-                                                    <div style="margin-top: -5px; ">
-                                                        <i class="icon-search4 text-muted text-size-base " style="color: white;font-size: 10px; "></i>
-                                                        <span>&nbsp;&nbsp;
-                                                            Detail</span>
-                                                    </div>
-
-                                                </a>
-                                            </td>
-                                        </tr>
-
-                                        {% endfor %}
                                     </tbody>
                                 </table>
 
@@ -1074,9 +1104,6 @@
                                         Help & Support
                                     </div>
 
-                                    <span>
-                                        Lorem ipsum dolor sit amet consectetur adipisicing elit. Eaque, minus. Obcaecati consequuntur, consequatur vitae soluta tempora doloremque quis eligendi officia illo ad nesciunt tenetur, nostrum cum deleniti, dolorum explicabo sed!
-                                    </span>
                                 </div>
                                 <div class="panel panel-flat" style="margin:10px;">
                                     <div class="row">
@@ -1133,11 +1160,302 @@
                                                 <div class="form-group">
                                                     <div class="col-md-12">
                                                         <label class="control-label"> Pesan :</label>
-                                                        <textarea rows="5" cols="5" class="form-control" id="pesan_pengirim" placeholder="Tuliskan Pesan disini"></textarea>
+                                                        <textarea rows="5" cols="5" class="form-control" id="pesan_pengirim" placeholder="Tuliskan Pesan disini" style="height: 240px;"></textarea>
+                                                    </div>
+                                                </div>
+                                            </div>
+                                            <button type="button" class="btn btn-info" id="send_pesan" style="    margin: 10px;float: right;border: none;">Send Messages</button>
+
+                                        </div>
+                                    </div>
+                                </div>
+
+                                <div>
+                                    <div style="margin: 0px 70px;">
+                                        <div class="text-center" style="font-size: 22px;margin:10px">
+                                            How can we help you ?
+                                        </div>
+
+                                        <!-- <input class="form-control" type="text" name="" id=""> -->
+
+                                        <div class="panel panel-flat" style="margin-top: 5px;">
+                                            <div class="panel-heading" style="padding-top: 10px;padding-bottom: 10px;">
+                                                <h6 class="panel-title"><b>Login</b></h6>
+                                                <div class="heading-elements">
+                                                    <ul class="icons-list">
+                                                        <li>
+                                                            <a data-action="collapse"></a>
+                                                        </li>
+                                                    </ul>
+                                                </div>
+                                            </div>
+                                            <div class="panel-body" style="display: none;">
+                                                <table>
+                                                    <tr>
+                                                        <td>1.</td>
+                                                        <td>Pada halaman dashboard, klik tombol “SIGN IN” untuk melakukan login</td>
+                                                    </tr>
+                                                    <tr>
+                                                        <td>2.</td>
+                                                        <td>
+                                                            Masukkan <i>username</i> dan <i>password</i>
+                                                        </td>
+                                                    </tr>
+                                                    <tr>
+                                                        <td>3.</td>
+                                                        <td>
+                                                            Kemudian klik tombol “Log In”
+                                                        </td>
+                                                    </tr>
+                                                    <tr>
+                                                        <td>4.</td>
+                                                        <td>
+                                                            Akan muncul Welcome Page seperti di bawah
+                                                        </td>
+                                                    </tr>
+                                                </table>
+                                            </div>
+                                        </div>
+
+                                        <div class="panel panel-flat" style="margin-top: 5px;">
+                                            <div class="panel-heading" style="padding-top: 10px;padding-bottom: 10px;">
+                                                <h6 class="panel-title"><b>Akses Fitur 3D</b></h6>
+                                                <div class="heading-elements">
+                                                    <ul class="icons-list">
+                                                        <li>
+                                                            <a data-action="collapse"></a>
+                                                        </li>
+                                                    </ul>
+                                                </div>
+                                            </div>
+                                            <div class="panel-body" style="display: none;">
+                                                <table>
+                                                    <tr>
+                                                        <td>1.</td>
+                                                        <td>Pada halaman utama aplikasi, klik icon</td>
+                                                    </tr>
+                                                    <tr>
+                                                        <td>2.</td>
+                                                        <td>
+                                                            Setelah itu akan muncul form 3D Searching, lalu pilih desa,
+                                                        </td>
+                                                    </tr>
+                                                    <tr>
+                                                        <td>3.</td>
+                                                        <td>
+                                                            Lalu klik tombol “Search”
+                                                        </td>
+                                                    </tr>
+                                                    <tr>
+                                                        <td>4.</td>
+                                                        <td>
+                                                            Maka akan muncul desa yang dicari
+                                                        </td>
+                                                    </tr>
+                                                </table>
+                                            </div>
+                                        </div>
+
+                                        <div class="panel panel-flat" style="margin-top: 5px;">
+                                            <div class="panel-heading" style="padding-top: 10px;padding-bottom: 10px;">
+                                                <h6 class="panel-title"><b>Memunculkan Data Bangunan</b></h6>
+                                                <div class="heading-elements">
+                                                    <ul class="icons-list">
+                                                        <li>
+                                                            <a data-action="collapse"></a>
+                                                        </li>
+                                                    </ul>
+                                                </div>
+                                            </div>
+                                            <div class="panel-body" style="display: none;">
+                                                <table>
+                                                    <tr>
+                                                        <td>1.</td>
+                                                        <td>Pada halaman utama aplikasi, klik icon</td>
+                                                    </tr>
+                                                    <tr>
+                                                        <td>2.</td>
+                                                        <td>
+                                                            Setelah itu akan muncul halaman sidebar filters
+                                                        </td>
+                                                    </tr>
+                                                    <tr>
+                                                        <td>3.</td>
+                                                        <td>
+                                                            Kemudian checklist pada bagian bagunan
+                                                        </td>
+                                                    </tr>
+                                                    <tr>
+                                                        <td>4.</td>
+                                                        <td>
+                                                            Maka akan muncul tampilan bangunan (polygon bangunan akan muncul ketika zoom > 17)
+                                                        </td>
+                                                    </tr>
+                                                    <tr>
+                                                        <td>5.</td>
+                                                        <td>Untuk melihat informasi bangunan, klik bagian bangunan yang akan di lihat informasinya.
+                                                        </td>
+                                                    </tr>
+                                                </table>
+                                            </div>
+                                        </div>
+
+                                        <div class="panel panel-flat" style="margin-top: 5px;">
+                                            <div class="panel-heading" style="padding-top: 10px;padding-bottom: 10px;">
+                                                <h6 class="panel-title"><b>Memunculkan Data Tempat</b></h6>
+                                                <div class="heading-elements">
+                                                    <ul class="icons-list">
+                                                        <li>
+                                                            <a data-action="collapse"></a>
+                                                        </li>
+                                                    </ul>
+                                                </div>
+                                            </div>
+
+                                            <div class="panel-body" style="display: none;">
+                                                <table>
+                                                    <tr>
+                                                        <td>
+                                                            1.
+                                                        </td>
+                                                        <td>
+                                                            Klik icon
+                                                            <img src="{% static 'img/icon-1/Screenshot_poi.png'%}" alt=""> pie pada sidebar
+                                                        </td>
+                                                    </tr>
+                                                    <tr>
+                                                        <td>
+                                                            2.
+                                                        </td>
+                                                        <td>
+                                                            Sehingga akan muncul informasi berikut
+                                                        </td>
+                                                    </tr>
+                                                    <tr>
+                                                        <td>
+                                                        </td>
+                                                        <td>
+                                                            <img src="{% static 'img/icon-1/Screenshot_menu_layer.png'%}" alt="" style="max-width: 500px;">
+                                                        </td>
+                                                    </tr>
+                                                    <tr>
+                                                        <td>
+                                                            3.
+                                                        </td>
+                                                        <td>
+                                                            Untuk informasi tempat, klik Point Of Interest
+                                                        </td>
+                                                    </tr>
+                                                    <tr>
+                                                        <td>
+                                                            4.
+                                                        </td>
+                                                        <td>
+                                                            Untuk informasi tempat, klik Point Of Interest
+                                                        </td>
+                                                    </tr>
+                                                    <tr>
+                                                        <td>
+                                                            5.
+                                                        </td>
+                                                        <td>
+                                                            Ceklist data tempat yang akan dimunculkan
+                                                        </td>
+                                                    </tr>
+                                                    <tr>
+                                                        <td>
+                                                        </td>
+                                                        <td>
+                                                            <img src="{% static 'img/icon-1/Screenshot_point_of_interest.png' %}" alt="" style="max-width: 500px;">
+                                                        </td>
+                                                    </tr>
+
+                                                    <tr>
+                                                        <td>
+                                                            6.
+                                                        </td>
+                                                        <td>
+                                                            Sehingga akan muncul informasi sebagai berikut
+                                                        </td>
+                                                    </tr>
+                                                    <tr>
+                                                        <td>
+                                                        </td>
+                                                        <td>
+                                                            <img src="{% static 'img/icon-1/Screenshot_dash_poi.png' %}" alt="" style="max-width: 500px;">
+                                                        </td>
+                                                    </tr>
+
+                                                    <tr>
+                                                        <td>
+                                                            7.
+                                                        </td>
+                                                        <td>
+                                                            Untuk informasi tempat lebih detail, klik tempat yang akan di munculkan detailnya
+                                                        </td>
+                                                    </tr>
+                                                    <tr>
+                                                        <td>
+                                                            8.
+                                                        </td>
+                                                        <td>
+                                                            Akan muncul informasi detail tempat seperti berikut
+                                                        </td>
+                                                    </tr>
+                                                    <tr>
+                                                        <td>
+                                                        </td>
+                                                        <td>
+                                                            <img src="{% static 'img/icon-1/Screenshot_detail_point.png' %}" alt="">
+                                                        </td>
+                                                    </tr>
+                                                </table>
                                             </div>
                                         </div>
+                                        <div class="panel panel-flat" style="margin-top: 5px;">
+                                            <div class="panel-heading" style="padding-top: 10px;padding-bottom: 10px;">
+                                                <h6 class="panel-title"><b>Menemukan Informasi Data Perbaikan</b></h6>
+                                                <div class="heading-elements">
+                                                    <ul class="icons-list">
+                                                        <li>
+                                                            <a data-action="collapse"></a>
+                                                        </li>
+                                                    </ul>
+                                                </div>
                                             </div>
 
+                                            <div class="panel-body" style="display: none;">
+                                                <table>
+                                                    <tr>
+                                                        <td>
+                                                            1.
+                                                        </td>
+                                                        <td>
+                                                            Klik icon pie pada sidebar
+                                                        </td>
+                                                    </tr>
+                                                    <tr>
+                                                        <td></td>
+                                                        <td>
+                                                            <img src="{% static 'img/icon-1/icon_pie_sd.png' %}" alt="">
+                                                        </td>
+                                                    </tr>
+                                                    <tr>
+                                                        <td>
+                                                            2.
+                                                        </td>
+                                                        <td>
+                                                            Setelah di-klik maka akan muncul informasi berikut
+                                                        </td>
+                                                    </tr>
+                                                    <tr>
+                                                        <td></td>
+                                                        <td>
+                                                            <img src="{% static 'img/icon-1/Screen_shot_data_perbaikan.png' %}" alt="" style="max-width: 500px;">
+                                                        </td>
+                                                    </tr>
+                                                </table>
+                                            </div>
                                         </div>
                                     </div>
                                 </div>
@@ -1334,9 +1652,9 @@
         <!-- Main charts -->
         <div class="panel panel-flat" style="display: none;width: 1000px;">
             <div class="panel-header" style="height: 50px;background: #1E2233;border-top-left-radius: 10px;border-top-right-radius: 10px;">
-                <!-- <button type="button" class="close" onclick="destroyWraper()" style="    width: 30px;
+                <button type="button" class="close" onclick="destroyWraper()" style="    width: 30px;
                 color: white;
-                height: 30px;">&times;</button> -->
+                height: 30px;">&times;</button>
                 <h5 class="modal-title title-create" style="color: white;margin-left: 25px;padding-top: 10px;">Input Perbaikan</h5>
             </div>
             <div class="panel-body" style="padding-top: 10px;">
@@ -1504,6 +1822,14 @@
                         </div>
                     </div>
                 </div>
+                <div class="row">
+                    <div class="form-group">
+                        <label class="col-lg-3 control-label lbl-top">Phone</label>
+                        <div class="col-lg-9">
+                            <input id="phone" type="number" class="form-control" value="" required>
+                        </div>
+                    </div>
+                </div>
 
                 <div class="row" style="margin-top: 20px;">
                     <div class="form-group">
@@ -1522,12 +1848,12 @@
                     </div>
                 </div>
 
-                <div class="row">
+                <div class="row" group_use>
                     <div class="form-group" style="margin-top: 10px !important;">
                         <label class="col-lg-3 control-label lbl-top">Groups</label>
                         <div class="col-lg-9">
                             <select style="border-bottom: 1px solid rgb(83, 83, 83) !important;" id="select_group" data-placeholder="select group.." class="select-size-xs">
-                                    <option></option>
+                                    <option value="none"></option>
                             </select>
                         </div>
                     </div>
@@ -1671,14 +1997,14 @@
 
                     <div class="tabbable">
                         <ul class="nav nav-tabs nav-tabs-bottom nav-justified">
-                            <li onclick="changetabs(this)" class="active"><a href="#left-tab1-feas-upli" data-toggle="tab">Koordinat</a></li>
-                            <li onclick="changetabs(this)"><a href="#right-tab2-feas-upli" data-toggle="tab">Informasi Umum</a></li>
+                            <li onclick="changetabs(this)" id="koordinat_cek" class="active"><a href="#left-tab1-feas-upli" data-toggle="tab">Koordinat</a></li>
+                            <li onclick="changetabs(this)" id="info_umum"><a href="#right-tab2-feas-upli" data-toggle="tab">Informasi Umum</a></li>
                         </ul>
 
                         <div class="tab-content">
 
                             <div class="tab-pane active" id="left-tab1-feas-upli">
-                                <div id="map-for-edit" style="width: 400px;height: 300px;position: relative;margin-left: 100px;"></div>
+                                <div id="map-for-edit" style="height: 300px;position: relative;margin:10px"></div>
                                 <div class="form-group">
                                     <label class="col-lg-2 control-label" style="margin-top:10px">Image</label>
                                     <div class="col-lg-9" style="margin-top:10px">
@@ -1756,3 +2082,393 @@
         </div>
     </div>
 </div>
+
+<div class="modal fade" id="modal_help" tabindex="-1" role="dialog" style="margin-left: 50px;padding-left:0px;">
+    <div class="modal-dialog" style="width: 75%;
+    margin: 0px;
+    height: 100vh;">
+        <div class="modal-content">
+            <div class="modal-body">
+
+                <div class="row">
+                    <div class="col-md-12">
+                        <button type="button" class="close" data-dismiss="modal" aria-hidden="true" style="
+                        margin: 0px 8px 0px 0px;
+                        width: 25px;
+                        height: 25px;
+                        background-color: white;
+                        top: -10px;
+                        position: absolute;
+                        right: -5px;
+                        opacity: 1;
+                        z-index: 999;
+                        border-radius: 12px;
+                        ">×</button>
+
+                        <div>
+                            <div style="font-size: 22px;margin:10px">
+                                Help & Support
+                            </div>
+
+                        </div>
+                        <div class="panel panel-flat" style="margin:10px;">
+                            <div class="row">
+                                <div class="col-md-4">
+                                    <div style="margin: 10px;background-color:#2F343A;border-radius:10px">
+                                        <div style="background-image: url(/static/img/icon-1/contact_info.svg);height:330px;border-radius:10px;">
+                                            <div style="margin:0px 20px;padding:20px;color:white">
+                                                <div style="margin-bottom: 10px;font-size:16px;">
+                                                    Contact Information
+                                                </div>
+                                                <div style="margin-top: 20px;">
+                                                    <div class="row" style="margin-top: 20px;">
+                                                        <i class="col-md-4 icon-phone2"></i>
+                                                        <span class="col-md-8">(0222) 0668202</span>
+                                                    </div>
+                                                    <div class="row" style="margin-top: 20px;">
+                                                        <i class="col-md-4 icon-envelop3"></i>
+                                                        <span class="col-md-8">admin@khansia.com</span>
+                                                    </div>
+                                                    <div class="row" style="margin-top: 20px;">
+                                                        <i class="col-md-4 icon-location3"></i>
+                                                        <span class="col-md-8">Komplek Taman Bumi Prima blok s14, Cibabat, Cimahi Utara, Kota Cimahi</span>
+                                                    </div>
+
+                                                </div>
+                                            </div>
+
+                                        </div>
+
+
+                                    </div>
+
+                                </div>
+                                <div class="col-md-8" style="margin-top:10px">
+                                    <div>
+                                        <div class="row">
+                                            <div class="col-md-6">
+                                                <div class="form-group">
+                                                    <div class="col-md-12">
+                                                        <label class="control-label"> Nama :</label>
+                                                        <input type="text" id="nama_pengirim" class="form-control">
+                                                    </div>
+                                                </div>
+                                            </div>
+                                            <div class="col-md-6">
+                                                <div class="form-group">
+                                                    <div class="col-md-12">
+                                                        <label class="control-label"> Email:</label>
+                                                        <input type="text" id="email_pengirim" class="form-control">
+                                                    </div>
+                                                </div>
+                                            </div>
+                                        </div>
+                                        <div class="form-group">
+                                            <div class="col-md-12">
+                                                <label class="control-label"> Pesan :</label>
+                                                <textarea rows="5" cols="5" class="form-control" id="pesan_pengirim" placeholder="Tuliskan Pesan disini" style="height: 240px;"></textarea>
+                                            </div>
+                                        </div>
+                                    </div>
+                                    <button type="button" class="btn btn-info" id="send_pesan" style="    margin: 10px;float: right;border: none;">Send Messages</button>
+
+                                </div>
+                            </div>
+                        </div>
+
+                        <div>
+                            <div style="margin: 0px 70px;">
+                                <div class="text-center" style="font-size: 22px;margin:10px">
+                                    How can we help you ?
+                                </div>
+
+                                <!-- <input class="form-control" type="text" name="" id=""> -->
+
+                                <div class="panel panel-flat" style="margin-top: 5px;">
+                                    <div class="panel-heading" style="padding-top: 10px;padding-bottom: 10px;">
+                                        <h6 class="panel-title"><b>Login</b></h6>
+                                        <div class="heading-elements">
+                                            <ul class="icons-list">
+                                                <li>
+                                                    <a data-action="collapse"></a>
+                                                </li>
+                                            </ul>
+                                        </div>
+                                    </div>
+                                    <div class="panel-body" style="display: none;">
+                                        <table>
+                                            <tr>
+                                                <td>1.</td>
+                                                <td>Pada halaman dashboard, klik tombol “SIGN IN” untuk melakukan login</td>
+                                            </tr>
+                                            <tr>
+                                                <td>2.</td>
+                                                <td>
+                                                    Masukkan <i>username</i> dan <i>password</i>
+                                                </td>
+                                            </tr>
+                                            <tr>
+                                                <td>3.</td>
+                                                <td>
+                                                    Kemudian klik tombol “Log In”
+                                                </td>
+                                            </tr>
+                                            <tr>
+                                                <td>4.</td>
+                                                <td>
+                                                    Akan muncul Welcome Page seperti di bawah
+                                                </td>
+                                            </tr>
+                                        </table>
+                                    </div>
+                                </div>
+
+                                <div class="panel panel-flat" style="margin-top: 5px;">
+                                    <div class="panel-heading" style="padding-top: 10px;padding-bottom: 10px;">
+                                        <h6 class="panel-title"><b>Akses Fitur 3D</b></h6>
+                                        <div class="heading-elements">
+                                            <ul class="icons-list">
+                                                <li>
+                                                    <a data-action="collapse"></a>
+                                                </li>
+                                            </ul>
+                                        </div>
+                                    </div>
+                                    <div class="panel-body" style="display: none;">
+                                        <table>
+                                            <tr>
+                                                <td>1.</td>
+                                                <td>Pada halaman utama aplikasi, klik icon</td>
+                                            </tr>
+                                            <tr>
+                                                <td>2.</td>
+                                                <td>
+                                                    Setelah itu akan muncul form 3D Searching, lalu pilih desa,
+                                                </td>
+                                            </tr>
+                                            <tr>
+                                                <td>3.</td>
+                                                <td>
+                                                    Lalu klik tombol “Search”
+                                                </td>
+                                            </tr>
+                                            <tr>
+                                                <td>4.</td>
+                                                <td>
+                                                    Maka akan muncul desa yang dicari
+                                                </td>
+                                            </tr>
+                                        </table>
+                                    </div>
+                                </div>
+
+                                <div class="panel panel-flat" style="margin-top: 5px;">
+                                    <div class="panel-heading" style="padding-top: 10px;padding-bottom: 10px;">
+                                        <h6 class="panel-title"><b>Memunculkan Data Bangunan</b></h6>
+                                        <div class="heading-elements">
+                                            <ul class="icons-list">
+                                                <li>
+                                                    <a data-action="collapse"></a>
+                                                </li>
+                                            </ul>
+                                        </div>
+                                    </div>
+                                    <div class="panel-body" style="display: none;">
+                                        <table>
+                                            <tr>
+                                                <td>1.</td>
+                                                <td>Pada halaman utama aplikasi, klik icon</td>
+                                            </tr>
+                                            <tr>
+                                                <td>2.</td>
+                                                <td>
+                                                    Setelah itu akan muncul halaman sidebar filters
+                                                </td>
+                                            </tr>
+                                            <tr>
+                                                <td>3.</td>
+                                                <td>
+                                                    Kemudian checklist pada bagian bagunan
+                                                </td>
+                                            </tr>
+                                            <tr>
+                                                <td>4.</td>
+                                                <td>
+                                                    Maka akan muncul tampilan bangunan (polygon bangunan akan muncul ketika zoom > 17)
+                                                </td>
+                                            </tr>
+                                            <tr>
+                                                <td>5.</td>
+                                                <td>Untuk melihat informasi bangunan, klik bagian bangunan yang akan di lihat informasinya.
+                                                </td>
+                                            </tr>
+                                        </table>
+                                    </div>
+                                </div>
+
+                                <div class="panel panel-flat" style="margin-top: 5px;">
+                                    <div class="panel-heading" style="padding-top: 10px;padding-bottom: 10px;">
+                                        <h6 class="panel-title"><b>Memunculkan Data Tempat</b></h6>
+                                        <div class="heading-elements">
+                                            <ul class="icons-list">
+                                                <li>
+                                                    <a data-action="collapse"></a>
+                                                </li>
+                                            </ul>
+                                        </div>
+                                    </div>
+
+                                    <div class="panel-body" style="display: none;">
+                                        <table>
+                                            <tr>
+                                                <td>
+                                                    1.
+                                                </td>
+                                                <td>
+                                                    Klik icon
+                                                    <img src="{% static 'img/icon-1/Screenshot_poi.png'%}" alt=""> pie pada sidebar
+                                                </td>
+                                            </tr>
+                                            <tr>
+                                                <td>
+                                                    2.
+                                                </td>
+                                                <td>
+                                                    Sehingga akan muncul informasi berikut
+                                                </td>
+                                            </tr>
+                                            <tr>
+                                                <td>
+                                                </td>
+                                                <td>
+                                                    <img src="{% static 'img/icon-1/Screenshot_menu_layer.png'%}" alt="" style="max-width: 500px;">
+                                                </td>
+                                            </tr>
+                                            <tr>
+                                                <td>
+                                                    3.
+                                                </td>
+                                                <td>
+                                                    Untuk informasi tempat, klik Point Of Interest
+                                                </td>
+                                            </tr>
+                                            <tr>
+                                                <td>
+                                                    4.
+                                                </td>
+                                                <td>
+                                                    Untuk informasi tempat, klik Point Of Interest
+                                                </td>
+                                            </tr>
+                                            <tr>
+                                                <td>
+                                                    5.
+                                                </td>
+                                                <td>
+                                                    Ceklist data tempat yang akan dimunculkan
+                                                </td>
+                                            </tr>
+                                            <tr>
+                                                <td>
+                                                </td>
+                                                <td>
+                                                    <img src="{% static 'img/icon-1/Screenshot_point_of_interest.png' %}" alt="" style="max-width: 500px;">
+                                                </td>
+                                            </tr>
+
+                                            <tr>
+                                                <td>
+                                                    6.
+                                                </td>
+                                                <td>
+                                                    Sehingga akan muncul informasi sebagai berikut
+                                                </td>
+                                            </tr>
+                                            <tr>
+                                                <td>
+                                                </td>
+                                                <td>
+                                                    <img src="{% static 'img/icon-1/Screenshot_dash_poi.png' %}" alt="" style="max-width: 500px;">
+                                                </td>
+                                            </tr>
+
+                                            <tr>
+                                                <td>
+                                                    7.
+                                                </td>
+                                                <td>
+                                                    Untuk informasi tempat lebih detail, klik tempat yang akan di munculkan detailnya
+                                                </td>
+                                            </tr>
+                                            <tr>
+                                                <td>
+                                                    8.
+                                                </td>
+                                                <td>
+                                                    Akan muncul informasi detail tempat seperti berikut
+                                                </td>
+                                            </tr>
+                                            <tr>
+                                                <td>
+                                                </td>
+                                                <td>
+                                                    <img src="{% static 'img/icon-1/Screenshot_detail_point.png' %}" alt="">
+                                                </td>
+                                            </tr>
+                                        </table>
+                                    </div>
+                                </div>
+                                <div class="panel panel-flat" style="margin-top: 5px;">
+                                    <div class="panel-heading" style="padding-top: 10px;padding-bottom: 10px;">
+                                        <h6 class="panel-title"><b>Menemukan Informasi Data Perbaikan</b></h6>
+                                        <div class="heading-elements">
+                                            <ul class="icons-list">
+                                                <li>
+                                                    <a data-action="collapse"></a>
+                                                </li>
+                                            </ul>
+                                        </div>
+                                    </div>
+
+                                    <div class="panel-body" style="display: none;">
+                                        <table>
+                                            <tr>
+                                                <td>
+                                                    1.
+                                                </td>
+                                                <td>
+                                                    Klik icon pie pada sidebar
+                                                </td>
+                                            </tr>
+                                            <tr>
+                                                <td></td>
+                                                <td>
+                                                    <img src="{% static 'img/icon-1/icon_pie_sd.png' %}" alt="">
+                                                </td>
+                                            </tr>
+                                            <tr>
+                                                <td>
+                                                    2.
+                                                </td>
+                                                <td>
+                                                    Setelah di-klik maka akan muncul informasi berikut
+                                                </td>
+                                            </tr>
+                                            <tr>
+                                                <td></td>
+                                                <td>
+                                                    <img src="{% static 'img/icon-1/Screen_shot_data_perbaikan.png' %}" alt="" style="max-width: 500px;">
+                                                </td>
+                                            </tr>
+                                        </table>
+                                    </div>
+                                </div>
+                            </div>
+                        </div>
+
+                    </div>
+                </div>
+            </div>
+        </div>
+    </div>
+</div>
\ No newline at end of file

templates/includes/plugin.html

@@ -4,15 +4,14 @@
         <div class="dropdown show-dropdown">
 
             <a href="#" type="checkbox">
-                <input type="checkbox" name="checkbox" onclick="mapsganti()" id="mapschange" style="position: absolute;opacity: 0;width: 40px;height: 40px;margin-top: -5px;">
+                <input type="checkbox" name="checkbox" onclick="mapsganti()" id="mapschange" style="position: absolute;opacity: 0;width: 50px;height: 50px;margin-top: 0px;z-index:2;cursor: pointer;">
                 <div id="labelchange">
                     <img src="{% static 'img/icon-1/Vector3d.svg' %}" alt="" style="height: 50px;
                     width: 50px;">
-
                 </div>
             </a>
         </div>
-        <span class="tooltiptext tooltip-left" style="font-family: 'gilroysemibold';
+        <span class="tooltiptext tooltip-left tooltip-3d" style="font-family: 'gilroysemibold';
         color: #085E8C;">3D</span>
     </li>
 
@@ -72,16 +71,17 @@
             </ul>
         </div>
     </li>
-    <li class="fixed-plugin no3d" style="top: 170px;">
+    <li class="fixed-plugin no3d overlay-cek" style="top: 170px;">
         <span class="tooltiptext tooltip-left" style="font-family: 'gilroysemibold';color: #6D3FDE;">Overlay</span>
+        <div class="jumlah-ceklis">
+
+        </div>
         <div class="dropdown show-dropdown ">
             <a href="#" data-toggle="dropdown">
                 <img src="{% static 'img/icon-1/Vectoroverlay.svg' %}" alt="" style="height: 50px;
                 width: 50px;">
             </a>
-            <ul class="dropdown-menu" style="top: 12px;
-            width: 300px;
-            margin-left: -270px!important;">
+            <ul class="dropdown-menu">
                 <li class="header-title text-center">Sidebar Filters</li>
                 <!-- <div id="sidebar" onmouseleave="overll()">
                     <div class="sidebar-wrapper">
@@ -101,7 +101,7 @@
 
                         <div class="checkbox">
                             <label>
-                            <input type="checkbox" id="geo_building" style="margin-top:2px;">
+                            <input type="checkbox" id="geo_building" onclick="georumah()" style="margin-top:2px;">
                             <img src="/static/img/icon-1/Buildingsbangunan.svg" alt="" style="margin-top: -5px;">
                             <span>
                                 Bangunan

templates/includes/sidebar.html

@@ -9,13 +9,24 @@
         border-bottom: 0.5pt solid #313649;
     }
 </style>
+
+<!-- <div class="navbar navbar-inverse" style="z-index: 1;
+top: 45px;
+position: absolute;
+background: none;border-color: transparent;">
+    <div class="navbar-header" style="min-width: 0px;">
+        <ul class="nav navbar-nav visible-xs-block">
+            <li><a class="sidebar-mobile-main-toggle" style="border-radius: 5px;"><i class="icon-paragraph-justify3"></i></a></li>
+        </ul>
+    </div>
+</div> -->
 <div class="sidebar sidebar-main">
     <div class="sidebar-content">
         <img src="{% static 'img/logo-ok.png' %}" alt="" style="width: 25px;height:32px;">
     </div>
     <div class="sidebar-category sidebar-category-visible">
         <div class="category-content no-padding">
-            <ul class="navigation navigation-main navigation-accordion" style="margin-bottom: 45vh;">
+            <ul class="navigation navigation-main navigation-accordion" style="margin-bottom: 40vh;">
 
                 <!-- Main -->
                 <li id="button_keterangan">
@@ -29,19 +40,19 @@
                     </a>
                 </li>
                 <li style="margin-top: 60vh;position: absolute;">
-                    <a href="#" id="btn-hide-all" class="side-bar-but" style="position: absolute;margin-top: 20px;    display: block!important;">
-                        <i class="icon-arrow-right13"></i>
+                    <a href="#" id="btn-hide-all" class="side-bar-but" style="position: absolute; margin-top: 0px; display: none;">
+                        <i class="icon-arrow-left12"></i>
                     </a>
                 </li>
 
             </ul>
 
-            <ul class="navigation navigation-main navigation-accordion">
-                <!-- <li>
-                    <a href="#" class="side-bar-but">
+            <ul class="navigation navigation-main navigation-accordion" style="height: 100px;">
+                <li>
+                    <a href="#" class="side-bar-but" data-toggle="modal" data-target="#modal_help" data-backdrop="static" data-keyboard="false">
                         <img src="{% static 'img/icon-1/Vectoriconwarning.svg' %}" alt="" style="height: 17.875003814697266px;width: 17.875003814697266px;margin-left: -8px;">
                     </a>
-                </li> -->
+                </li>
                 <li>
                     <a href="{% url 'logout' %}" class="side-bar-but">
                         <img src="{% static 'img/icon-1/Vectoriconlogout.svg' %}" alt="" style="height: 17.875003814697266px;width: 17.875003814697266px;margin-left: -8px;">
@@ -413,7 +424,7 @@
 
                 <div class="form-group" style="margin-top: 15px;width: 98%;">
                     <select name="select" id="sel-kec" class="form-control input-sm" style="background-color: #393E54;border-radius: 8px;border-color: #393E54;color: white;">
-                        <option>Pilih Kecamatan</option>
+                        <option value="all_kecamatan">Pilih Kecamatan</option>
                         {% for nama_kecamatan in kecamatan %}
                         <option value="{{nama_kecamatan.administrasi.f1}}">{{nama_kecamatan.administrasi.f2}}</option>
                         {% endfor %}
@@ -686,7 +697,9 @@
             },
             dataType: 'json',
             success: function(data) {
-
+                if (data['res_kel'] == 'all_kecamatan') {
+                    $('#sel-desa').html(`<option>Pilih Desa</option>`);
+                } else {
                     var data_all_desa = []
                     for (var i = 0; i < data['res_kel'].length; i++) {
                         var id_k = data['res_kel'][i][0];
@@ -698,6 +711,9 @@
                         data_all_desa.push(data_kel)
                     };
                     $('#sel-desa').html(`<option>Pilih Desa</option>` + data_all_desa);
+                }
+
+
 
                 var data_perbaikan = []
                 var number = 0;
@@ -1170,7 +1186,7 @@
         $("#manage_perbaikan").removeClass("active");
         $("#panel-sm").removeClass("active");
         $("#panel-sm2").removeClass("active");
-
+        $(this).css('display', 'none');
         $(this).removeClass("hid");
     });
 
@@ -1179,7 +1195,7 @@
         $("#manage_perbaikan").removeClass("active");
         $("#panel-sm").removeClass("active");
         $("#panel-sm2").removeClass("active");
-
+        $(this).css('display', 'none');
         $(this).removeClass("hid");
     };
 

templates/layout/layout.html

@@ -49,6 +49,10 @@
             font-family: 'gilroyultralight';
             src: url('/static/css/Gilroy-UltraLight.woff') format('woff');
         }
+        
+        .tab_kdb_klb {
+            display: none;
+        }
     </style>
 
     {% include 'includes/css-o.html' %} {% include 'includes/css-m.html' %}
@@ -90,14 +94,24 @@
     <script type="text/javascript" src="{% static 'js/core/libraries/jquery.min.js' %}"></script>
     <script src="https://cdnjs.cloudflare.com/ajax/libs/html2canvas/0.4.1/html2canvas.js"></script>
 
-    <link rel="stylesheet" href="{% static 'css/layout-style.css' %}"> {% endblock css %}
+    <link rel="stylesheet" href="{% static 'css/layout-style.css' %}">
+    <link rel="stylesheet" href="{% static 'css/st.css' %}"> {% endblock css %}
     <link href="http://code.jquery.com/ui/1.10.2/themes/smoothness/jquery-ui.css" rel="Stylesheet"></link>
 
+    <!-- Theme JS files -->
+    <script type="text/javascript" src="{% static 'js/plugins/forms/styling/uniform.min.js' %}"></script>
+    <script type="text/javascript" src="{% static 'js/plugins/forms/styling/switchery.min.js' %}"></script>
+    <script type="text/javascript" src="{% static 'js/plugins/forms/styling/switch.min.js' %}"></script>
+
+    <script type="text/javascript" src="{% static 'js/core/app.js' %}"></script>
+    <!-- <script type="text/javascript" src="{% static 'js/pages/form_checkboxes_radios.js' %}"></script> -->
+    <!-- /theme JS files -->
+
 
 
 </head>
 
-<body style="font-family: 'gilroylight';">
+<body style="font-family: 'gilroylight';" oncontextmenu="return false">
 
 
 
@@ -114,23 +128,12 @@
             <div class="content-wrapper">
                 <div class="content">
                     <div id="map">
-                        <div id="searchbar" class="col-md-4 col-md-offset-4 input-group content-group head">
+                        <div class="help_bangunan" style="position: absolute;z-index: 999;top: 0px;right: 60px;"></div>
+                        <div class="row" style="margin-top: 20px;">
+                            <div class="col-sm-4 head">
 
-                            <!-- <div class="input-group">                                            
-                                <input type="TextBox" ID="datebox" Class="form-control"></input>
-                                <div class="input-group-btn">
-                                    <button type="button" class="btn dropdown-toggle" data-toggle="dropdown">
-                                        <span class="caret"></span>
-                                    </button>
-                                    <ul id="demolist" class="dropdown-menu">
-                                        <li><a href="#">A</a></li>
-                                        <li><a href="#">B</a></li>
-                                        <li><a href="#">C</a></li>
-                                    </ul>
                             </div>
-                            </div> -->
-                            <!-- <div class="input-group"> 
-                                <input type="TextBox" ID="valss" Class="form-control" type="hidden"></input> -->
+                            <div class="col-sm-4 input-group content-group head">
                                 <div class="input-group-btn">
                                     <button type="button" class="btn btn-default dropdown-toggle btn-icon" data-toggle="dropdown" aria-expanded="true" id="btn_s_s">
                                             <span class="caret"></span>
@@ -153,8 +156,31 @@
                                 201.55deg
                                 , #72BBFF -24.21%, #3D5CCA 130.65%);"><i class="icon-search4 text-muted text-size-base" style="color: white;"></i></button>
                                     </span>
+                            </div>
+                            <div class="col-sm-4 head">
 
                             </div>
+                        </div>
+                        <!-- <div class="col-md-4 input-group content-group head"> -->
+
+                        <!-- <div class="input-group">                                            
+                                <input type="TextBox" ID="datebox" Class="form-control"></input>
+                                <div class="input-group-btn">
+                                    <button type="button" class="btn dropdown-toggle" data-toggle="dropdown">
+                                        <span class="caret"></span>
+                                    </button>
+                                    <ul id="demolist" class="dropdown-menu">
+                                        <li><a href="#">A</a></li>
+                                        <li><a href="#">B</a></li>
+                                        <li><a href="#">C</a></li>
+                                    </ul>
+                                </div>
+                            </div> -->
+                        <!-- <div class="input-group"> 
+                                <input type="TextBox" ID="valss" Class="form-control" type="hidden"></input> -->
+
+
+                        <!-- </div> -->
 
 
                         {% if user.is_authenticated %} {% else %}
@@ -182,7 +208,7 @@
 
                     </div>
                     {% if user.is_authenticated %}
-                    <div style="height: 10%;width: 10%;position: absolute;top: 30px;right: 65px;z-index: 999;">
+                    <div class="user-p-nav" style="height: 10%;width: 10%;position: absolute;top: 30px;right: 65px;z-index: 999;">
                         <!-- <a href="#">
                             <div>
                                 <img src="{% static 'img/placeholder.jpg' %}" style="width: 37px;height: 37px;border-radius: 25px;" />
@@ -229,7 +255,7 @@
                                                             <div class="overlay">
                                                                 <div class="textover">
 
-                                                                    <i class="icon-camera" style="position: absolute;background-color: white;border-radius: 10px;top: 25%;right: 46%;width: 20px;height: 20px;" title="Ganti Foto Profil"></i>
+                                                                    <i class="icon-camera" style="position: absolute;background-color: white;border-radius: 10px;top: 35%;right: 46%;width: 20px;height: 20px;" title="Ganti Foto Profil"></i>
                                                                 </div>
                                                             </div>
                                                             
@@ -347,13 +373,13 @@
     <!-- Theme JS files -->
     <script type="text/javascript" src="{% static 'js/plugins/visualization/d3/d3.min.js' %}"></script>
     <script type="text/javascript" src="{% static 'js/plugins/visualization/d3/d3_tooltip.js' %}"></script>
-    <script type="text/javascript" src="{% static 'js/plugins/forms/styling/switchery.min.js' %}"></script>
-    <script type="text/javascript" src="{% static 'js/plugins/forms/styling/uniform.min.js' %}"></script>
+    <!-- <script type="text/javascript" src="{% static 'js/plugins/forms/styling/switchery.min.js' %}"></script> -->
+    <!-- <script type="text/javascript" src="{% static 'js/plugins/forms/styling/uniform.min.js' %}"></script> -->
     <script type="text/javascript" src="{% static 'js/plugins/forms/selects/bootstrap_multiselect.js' %}"></script>
     <script type="text/javascript" src="{% static 'js/plugins/ui/moment/moment.min.js' %}"></script>
     <script type="text/javascript" src="{% static 'js/plugins/pickers/daterangepicker.js' %}"></script>
-    <script type="text/javascript" src="{% static 'js/plugins/forms/styling/switch.min.js' %}"></script>
-    <script type="text/javascript" src="{% static 'js/pages/form_checkboxes_radios.js' %}"></script>
+    <!-- <script type="text/javascript" src="{% static 'js/plugins/forms/styling/switch.min.js' %}"></script> -->
+    <!-- <script type="text/javascript" src="{% static 'js/pages/form_checkboxes_radios.js' %}"></script> -->
     <script type="text/javascript " src="{% static 'js/apexcharts.min.js' %}"></script>
     <script type="text/javascript " src="{% static 'js/apexcharts.js' %}"></script>
 
@@ -377,6 +403,32 @@
 {% include 'includes/js-o.html' %} {% include 'includes/js-m.html' %}
 <script type="text/javascript" src="{% static 'js/action.js' %}"></script>
 <script>
+    // start disabled inspect
+
+    // document.addEventListener('contextmenu', function(e) {
+    //     e.preventDefault();
+    // });
+
+    // document.onkeydown = function(e) {
+    //     if(event.keyCode == 123) {
+    //         return false;
+    //     }
+    //     if(e.ctrlKey && e.shiftKey && e.keyCode == 'I'.charCodeAt(0)) {
+    //         return false;
+    //     }
+    //     if(e.ctrlKey && e.shiftKey && e.keyCode == 'C'.charCodeAt(0)) {
+    //         return false;
+    //     }
+    //     if(e.ctrlKey && e.shiftKey && e.keyCode == 'J'.charCodeAt(0)) {
+    //         return false;
+    //     }
+    //     if(e.ctrlKey && e.keyCode == 'U'.charCodeAt(0)) {
+    //         return false;
+    //     }
+    // }
+
+    // end disabled inspect
+
     var dar = null;
     $('#search_spes li a').on('click', function() {
         $('#input_search').val(null)
@@ -456,7 +508,380 @@
                 },
                 dataType: 'json',
                 success: function(data) {
+                    var geocodeService = L.esri.Geocoding.geocodeService();
+                    var geocoderNominatim = new L.Control.Geocoder.Nominatim();
+                    var dapoin = [data[0][0]['geometry']['coordinates'][1], data[0][0]['geometry']['coordinates'][0]]
+                    console.log(data[0])
+                    // map.setView([data[0]['geometry']['coordinates'][0][0][0][1], data[0]['geometry']['coordinates'][0][0][0][0]], 19);
+                    // var result_point = JSON.parse("" + data + "")
+                    // console.log(result_point)
+
+                    var geo_point = L.geoJson(null, {
+                        pointToLayer: function(feature, latlng) {
+                            // var smallIcon = new L.Icon({
+                            //     iconSize: [25, 25],
+                            //     iconAnchor: [13, 27],
+                            //     popupAnchor: [1, -24],
+                            //     iconUrl: 'static/img/icon/loc.svg',
+                            //     shadowUrl: 'static/img/icon/shadow.svg',
+                            //     shadowSize: [35, 35],
+                            //     shadowAnchor: [22, 31]
+                            // });
+                            var marker = L.marker(latlng, {
+                                // icon: smallIcon
+                            });
+                            conten = `
+                                        <div id="bottom-justified-data" style="text-align: center;">
+                                            <div >
+                                                <img src="static/img/image/` + feature.administrasi.f8 + `" alt="Image" style="width: 150px!important;height: 125px;">
+                                            </div>
+
+                                            <div >
+                                                <div style="font-family: Google Sans,Roboto,Arial,sans-serif;
+                                                letter-spacing: 0">
+                                                    <p>
+                                                        ` + feature.administrasi.f1 + `
+                                                    </p>
+                                                </div>
+                                            </div>
+                                        </div>
+                                    `;
+                            marker.bindTooltip(conten, {
+                                permanent: false,
+                                className: "my-label",
+                                direction: 'top',
+                                offset: [0, -25]
+                            });
+                            return marker
+                        },
+                        onEachFeature: function(feature, layer) {
+                            layer.on({
+                                click: function(e) {
+                                    $("#modal_detail_non_kelurahan").modal('show');
+                                    var tay;
+                                    // var geocodeService = L.esri.Geocoding.geocodeService();
+                                    // var geocoderNominatim = new L.Control.Geocoder.Nominatim();
+                                    var geogeo = geocodeService.reverse().latlng(e.latlng).run(function(error, result) {
+                                        tay = result.address.Address;
+                                        // aladije(result.address.Address)
+                                        if (feature.administrasi.f3 == 'alamat') {
+                                            if (tay != '') {
+                                                var alamak = tay;
+
+                                            } else {
+                                                alamak = ""
+                                            }
+
+                                        } else {
+                                            var alamak = feature.administrasi.f3;
+
+                                        }
+                                        if (feature.administrasi.f10 == 'bpk') {
+                                            var raja = "";
+                                        } else {
+                                            var raja = feature.administrasi.f10;
+                                        }
+                                        content_edit_point = `
+                                            <div class="modal-dialog md">
+                                                <div class="modal-content">
+                                                    <div class="modal-header bg-info" >
+                                                            <button type="button" class="close" data-dismiss="modal" onclick="destroyfade()">&times;</button>
+                                                            <h6 class="modal-title">Edit Point</h6>
+                                                    </div>
+                                                        
+                                                        <div class="tab-pane has-padding" id="panel-tab2">
+                                                            <div class="tab-pane" id="bottom-justified-data">
+
+                                                                <div class="tabbable">
+                                                                    <ul class="nav nav-tabs nav-tabs-bottom nav-justified">
+                                                                        <li onclick="changetabs(this)" class="active"><a href="#right-tab2-feas-upli" data-toggle="tab">Koordinat</a></li>
+                                                                        <li onclick="changetabs(this)"><a href="#left-tab1-feas-upli" data-toggle="tab">Informasi Umum</a></li>
+                                                                        
+                                                                    </ul>
+
+                                                                    <div class="tab-content">
+
+                                                                        <div class="tab-pane active" id="right-tab2-feas-upli">
+                                                                            <div class="form-group">
+                                                                                <div id="map-for-edit" style="width: 400px;height: 300px;position: relative;margin-left: 100px;"></div>
+                                                                                <div class="form-group">
+                                                                                    <label class="col-lg-2 control-label" style="margin-top:10px">Image</label>
+                                                                                    <div class="col-lg-9" style="margin-top:10px">
+                                                                                        <input type="file" id="file" name="images[]" multiple accept="image/jpg,image/png,image/jpeg,image/gif">
+                                                                                        <input style="display:none;" id="gambar" type="text" class="form-control" value="` + feature.administrasi.f8 + `"required>
+                                                                                    </div>
+                                                                                </div>
+                                                                            </div>
+                                                                        </div>
+
+                                                                        <div class="tab-pane" id="left-tab1-feas-upli">
+
+                                                                            <div class="modal-body" style="overflow-x: hidden;max-height: 300px;overflow-y: scroll;padding-left: 15px;">
+
+                                                                                        <div class="form-group">
+                                                                                                <input style="display:none;" id="idpo" type="text" class="form-control" value="` + feature.administrasi.f15 + `"required>
+                                                                                                <input style="display:none;" id="coordinateZoneeditpo" type="text" class="form-control" value=""required>
+                                                                                        </div>
+
+                                                                                    <div class="row" style="margin-top: 15px;">
+                                                                                        <div class="form-group">
+                                                                                            <label class="col-lg-3 control-label lbl-top" style="margin-top: 15px;">Nama Point</label>
+                                                                                            <div class="col-lg-9">
+                                                                                                <input id="namobj" type="text" class="form-control" value="` + feature.administrasi.f1 + `"required>    
+                                                                                            </div>
+                                                                                            
+                                                                                        </div>
+                                                                                    </div>
+
+                                                                                    <div class="row" style="margin-top: 15px;">
+                                                                                        <div class="form-group">
+                                                                                            <label class="col-lg-3 control-label lbl-top" style="margin-top: 15px;">Tipe Point</label>
+                                                                                            <div class="col-lg-8">
+                                                                                                <select id="remark" style="margin-top: 15px;">
+                                                                                                    <option>` + feature.administrasi.f2 + `</option>
+                                                                                                </select>
+                                                                                            </div>
+                                                                                        </div>
+                                                                                    </div>
+                                                                
+                                                                                    <div class="row" style="margin-top: 15px;">
+                                                                                        <div class="form-group">
+                                                                                            <label class="col-lg-3 control-label lbl-top" style="margin-top: 15px;">Alamat</label>
+                                                                                            <div class="col-lg-4">
+                                                                                                <input id="alamat" type="text" class="form-control" value="` + alamak + `"required>
+                                                                                            </div>
+                                                                                            <div class="col-lg-4" style="margin-top: 15px;">` + feature.administrasi.f14 + `, ` + feature.administrasi.f13 + `</div>
+                                                                                        </div>
+                                                                                    </div>
+
+                                                                                    <div class="row" style="margin-top: 15px;">
+                                                                                        <div class="form-group">
+                                                                                            <label class="col-lg-3 control-label lbl-top" style="margin-top: 15px;">Luas Tanah</label>
+                                                                                            <div class="col-lg-6">
+                                                                                                <input id="luas_tanah" type="text" class="form-control" value="` + feature.administrasi.f5 + `"required>
+                                                                                            </div>
+                                                                                            <div class="col-lg-3">
+                                                                                                <select id="satuan_luas_tanah" style="margin-top: 15px;">
+                                                                                                    <option>m2</option>
+                                                                                                    <option>Km2</option>
+                                                                                                    <option>Hektar</option>
+                                                                                                </select>
+                                                                                            </div>
+                                                                                        </div>
+                                                                                    </div>
+                                                                
+                                                                                    <div class="row" style="margin-top: 15px;">
+                                                                                        <div class="form-group">
+                                                                                            <label class="col-lg-3 control-label lbl-top" style="margin-top: 15px;">Pemimpin</label>
+                                                                                            <div class="col-lg-9">
+                                                                                                <input id="perangkat" type="text" class="form-control" value="` + raja + `"required>
+                                                                                            </div>
+                                                                                        </div>
+                                                                                    </div>
+                                                                            
+                                                                            </div>
+                                                                        </div>
+
+                                                                    </div>
+                                                                </div>
+                                                            </div>
+                                                        </div>
+
+                                                        <hr>
+                                                        <div class="modal-footer">
+                                                            <button type="button" class="btn btn-info" id="saveeditspo">Save changes</button>
+                                                        </div>
+                                                </div>
+                                            </div>`
+                                        if (feature.administrasi.f8 == 'None') {
+                                            var gmb = "static/img/image_null.png";
+                                        } else {
+                                            var gmb = "static/img/image/" + feature.administrasi.f8;
+                                        }
+
+                                        $(".gambar_keterangan").html(`<img src="` + gmb + `" alt="" style="width:100%;height:240px;border-top-left-radius: 10px;border-bottom-left-radius: 10px;">`)
+
+                                        $(".nama_keterangan").html(`<div>
+                                                                            <span style="font-size: large;">
+                                                                                ` + feature.administrasi.f1 + `
+                                                                            </span>
+                                                                        </div>
+                                                                        <div>
+                                                                            <span>
+                                                                                ` +
+                                            alamak + `, ` + feature.administrasi.f14 + `, ` + feature.administrasi.f13 + `, ` + feature.administrasi.f12 + `
+                                                                            </span>
+                                                                        </div>
+                    
+                                                                        `)
+
+                                        $(".isi_keterangan").html(`<input type="text" name="idjalan" id="idjalan" class="hidden" value="">
+                                                                        <input type="text" name="coordinatejalan" id="coordinatejalan" class="hidden" value="">
+                                                                        <div>
+                                                                            <div>
+                                                                                <span>Jenis Bangunan</span>
+                                                                            </div>
+                                                                            <div>
+                                                                                <span>
+                                                                                    ` + feature.administrasi.f2 + `
+                                                                                </span>
+                                                                            </div>
+                                                                        </div>
+                                                                        <div>
+                                                                            <div>
+                                                                                <span>Luas</span>
+                                                                            </div>
+                                                                            <div>
+                                                                                <span style="font-family: 'Roboto';">` + feature.administrasi.f5 + ` m</span>
+                                                                            </div>
+                                                                        </div>
+                    
+                                                                        <div>
+                                                                            <div>
+                                                                                <span>Pimpinan</span>
+                                                                            </div>
+                                                                            <div>
+                                                                                <span>` + raja + `</span>
+                                                                            </div>
+                                                                        </div>`);
+
+                                        $(".btn_action").html(`<div class="tombol-edit-keterangan text-center" style="background-color: #5A9AFB;position: absolute;width: 40px;height: 40px;bottom: 2px;right: 5px;border: 1pt solid rosybrown;border-radius: 8px;">
+                                                                            <a href="#" id="btn_edit_point" data-toggle="modal" data-target="#modal_adm" data-backdrop="static" data-keyboard="false" class="btn" style="border-bottom-left-radius: 8px;border-top-right-radius: 8px;width: 100%;height: 100%;bottom: 0px;color: white;" title="Edit"><i class="icon-pencil5"></i></a>
+                                                                            </div>
+                                                                            `)
+                                        $("#modal_adm").html(content_edit_point)
+                                        panel_samp();
+                                    })
+                                    hidelegend();
+                                }
+                            })
+                        }
+                    });
+
+                    function geo_json_point(data) {
+                        geo_point.addData(data)
+                    }
+
+                    geo_json_point(data[0])
+
+                    geo_point.addTo(map);
+
+                    map.setView([data[0][0]['geometry']['coordinates'][1], data[0][0]['geometry']['coordinates'][0]], 19);
+
+                    $(document).on("click", "#btn_search_spes", function() {
+                        geo_point.clearLayers()
+                        geo_point.remove()
+                    });
+                    
+                    // $.ajax({
+                    //     url: "{% url 'api:search_lanjut' %}",
+                    //     data: {
+                    //         'type': dar,
+                    //         'idx': idm,
+                    //         'db': db
+                    //     },
+                    //     dataType: 'json',
+                    //     success: function(data) {
+                    //         console.log(data)
+                            
+                    //         dapoin = [data[0][0]['geometry']['coordinates'][1], data[0][0]['geometry']['coordinates'][0]]
+                    //         // var poinin = L.marker(dapoin).addTo(map)
+                    //         geo_json_point(dapoin)
+                    //     }
+                    // });
+
+                    $(document).on("click", "#btn_edit_point", function() {
+                        var map_edit = L.map('map-for-edit', {
+                            editable: true,
+                            zoomControl: false,
+                            drawControl: true
+                        }).setView([-2, 118], 5);
+
+                        mapss = L.tileLayer('https://mt1.google.com/vt/lyrs=s&x={x}&y={y}&z={z}', {
+                            maxZoom: 22,
+                            minZoom: 4,
+                        }).addTo(map_edit);
+                        
+                        var idspo = idm
+                        var dbspo = db
+                        loaderPage(false);
+                        $.ajax({
+                            url: "{% url 'api:editspo' %}",
+                            data: {
+                                'id_point': idspo,
+                                'db_point': dbspo
+                            },
+                            dataType: 'json',
+                            success: function(data) {
+                                loaderPage(false);
+                                setTimeout(function() {
+                                    map_edit.invalidateSize();
+                                }, 1000);
+                                // map_edit.setView([data['geometry']['coordinates'][0][0][0][1], data['geometry']['coordinates'][0][0][0][0]], 19);
+                                map_edit.setView([data['geometry']['coordinates'][1], data['geometry']['coordinates'][0]], 19);
+                                let dapoin = [data['geometry']['coordinates'][1], data['geometry']['coordinates'][0]]
+                                var poinin = L.marker(dapoin).addTo(map_edit)
+                                poinin.enableEdit();
+                                $('#saveeditspo').click(function() {
+                                    var hasil = (JSON.stringify(poinin.toGeoJSON()))
+                                    $("#coordinateZoneeditpo").val(hasil);
+                                })
+                            }
+                        })
+                    });
+
+                    $(document).on("click", "#saveeditspo", function() {
+                        var idspo = $('#idpo').val();
+                        var poi = $('#coordinateZoneeditpo').val();
+                        var dbsave = db
+                        var data = new FormData();
+                        data.append("file", $("input[id^='file']")[0].files[0]);
+                        data.append("csrfmiddlewaretoken", "{{ csrf_token }}");
+                        data.append('idspo', idspo)
+                        data.append('namobj', $('#namobj').val())
+                        data.append('remark', $('#remark').val())
+                        data.append('luas', $('#luas_tanah').val())
+                        data.append('alamat', $('#alamat').val())
+                        data.append('perangkat', $('#perangkat').val())
+                        data.append('point', poi),
+                        data.append('gambar', $('#gambar').val()),
+                        data.append('dbspo', dbsave)
                         console.log(data)
+                        $.ajax({
+                            url: "{% url 'api:saveeditspo' %}",
+                            data: data,
+                            dataType: 'json',
+                            type: 'POST',
+                            processData: false,
+                            contentType: false,
+                            success: function(data) {
+                                let response = data
+                                if (response.status == 0) {
+                                    swal({
+                                        title: response.info,
+                                        text: response.data,
+                                        type: "success",
+                                        icon: "success",
+                                        confirmButtonColor: "#00BCD4"
+                                    }, function() {
+                                        $("#modal_adm").modal('hide');
+                                        $("#modal_detail_non_kelurahan").modal('hide')
+                                            //location.reload();
+                                    })
+                                } else {
+                                    swal({
+                                        title: 'Error',
+                                        text: 'Hubungi Developer',
+                                        type: "warning",
+                                        icon: "error",
+                                        confirmButtonColor: "#00BCD4"
+                                    })
+                                }
+                                //location.reload()
+                            }
+                        })
+
+                    });
 
                 }
             });
@@ -542,61 +967,7 @@
                                             //                     <option value="cagar_budaya">Cagar Budaya dan Tempat Wisata</option>
                                             //                     <option value="gardu_listrik">Gardu Listrik</option>`
                                             // }
-                                            var history
-                                            if (feature.administrasi.f11 == 'kantor_administrasi' || feature.administrasi.f11 == 'layanan_kesehatan' || feature.administrasi.f11 == 'puskesmas' ||
-                                                feature.administrasi.f11 == 'rumah_sakit' || feature.administrasi.f11 == 'sarana_pendidikan' || feature.administrasi.f11 == 'stasiun' ||
-                                                feature.administrasi.f11 == 'terminal_bus' || feature.administrasi.f11 == 'cagar_budaya' || feature.administrasi.f11 == 'gardu_listrik') {
-                                                if (feature.properties.f4 != null) {
-                                                    var list_history = feature.properties.f4
-                                                    var list_history_panel = ``
-                                                    for (var i = 0; i < list_history.length; i++) {
-                                                        var dt_history = list_history[i].split(",");
-                                                        var data_history = `<div class="form-group" style="margin-bottom:0px;">
-                                                                                <div class="row">
-                                                                                    <label class="col-md-6">` + dt_history[1] + `</label>
-                                                                                    <label class="col-md-6">` + dt_history[2] + `</label>
-                                                                                </div>
-                                                                            </div>`;
-                                                        list_history_panel += data_history
-                                                    };
 
-                                                    history = ` 
-                                                        <tr style="height: 40px;">
-                                                            <th id="history_panel">
-                                                                <p class="text-center">
-                                                                    <img src="static/img/icon/samping_history.svg" alt="Image" style="height: 20px; width: 20px;">
-                                                                </p>
-                                                                <p class="text-center">
-                                                                    <b>History Perbaikan</b>
-                                                                </p>
-                                                                <br>
-                                                                <label class="col-md-6"><b>Tanggal</b></label>
-                                                                <label class="col-md-6"><b>Jenis Perbaikan</b></label>
-                                                                    ` + list_history_panel + `
-                                                                <p class="text-center" style="margin-top: 15px;">
-                                                                    <a id='btn_detail_per_bang' onclick="getdetailperbang(` + feature.properties.f1 + `)" data-toggle="modal" data-target="#modal_detail" class="btn btn-primary" style="border-radius: 200px; margin-bottom: 5px;"><i class="fa fa-list-ul" style="color:#ffffff"> </i><i style="margin-left: 5px;">View Detail</i></a>
-                                                                    <a href="#" id='btn_perbaikan_bangunan' data-toggle="modal" data-target="#input_perbaikan_bang" data-backdrop="static" data-keyboard="false" class="btn btn-primary" style="border-radius: 200px; margin-bottom: 5px;"><i class="fa fa-plus" style="color:#ffffff"> </i><i style="margin-left: 5px;">Tambah History Perbaikan</i></a>
-                                                                </p>
-                                                            </th>
-                                                        </tr>`;
-                                                } else {
-                                                    history = `
-                                                        <tr style="height: 40px;">
-                                                            <th id="history_panel">
-                                                                <p class="text-center">
-                                                                    History Perbaikan
-                                                                </p>
-                                                                <br>
-                                                                <p class="text-center" style="margin-top: 10px;"><i>Belum Ada History</i></p>
-                                                                <p class="text-center" style="margin-top: 10px;">
-                                                                    <a href="#" id='btn_perbaikan_bangunan' data-toggle="modal" data-target="#input_perbaikan_bang" data-backdrop="static" data-keyboard="false" class="btn btn-primary" style="border-radius: 200px; margin-bottom: 5px;"><i class="fa fa-plus" style="color:#ffffff"> </i><i style="margin-left: 5px;">Tambah History Perbaikan</i></a>
-                                                                </p>
-                                                            </th>
-                                                        </tr>`;
-                                                }
-                                            } else {
-                                                history = ``
-                                            }
 
                                             content_edit = `
                                             <div class="modal-dialog" style="width: max-content;height: max-content;">
@@ -791,9 +1162,9 @@
                                                                     <div class="tab-content">
                                                                         <div class="tab-pane active" id="left-tab1-feas-upl">
                                                                             <input type="text" class="hidden" id="poly_create_input_bang">
-                                                                            <input type="text" class="hidden" id="id_bang_perbaikan">
+                                                                            <input type="text" class="hidden" id="id_bang_perbaikan" value="` + feature.properties.f1 + `" disable>
                                                                             <input type="text" class="hidden" id="type_id_bang">
-                                                                            <div id="map-insert-renov-bang" style="height: 375px;width: 100%">
+                                                                            <div id="map-insert-renov-bang-s" style="height: 375px;width: 100%">
                                                                             </div>
                                                                         </div>
 
@@ -857,180 +1228,95 @@
                                                                                         <input type="file" id="proposal_bang">
                                                                                     </div>
                                                                                     <div class="form-group">
-                                                                                        <label>Bukti Selesai Perbaikan (.png/.jpg/.jpeg/):</label>
-                                                                                        <input type="file" id="buktiselesai_bang">
-                                                                                    </div>
-                                                
-                                                                                </div>
-                                                                            </div>
-                                                                        </div>
-
-                                                                    </div>
-
-                                                                </div>
-                                                            </div>
-                                                        </div>
-                                                    </div>
-                                                    <div class="modal-footer">
-                                                        <input type="text" id="coorbangbaru" class="hidden"  value="">
-                                                        <button type="button" class="btn btn-info" id="save-perbaikan_bang" style="float: right; margin-top: 5px; margin-right: 10px;">SAVE</button>
-                                                    </div>
-                                                </div>
-                                            </div>`;
-                                            // content = `
-                                            // <table class="table tasks-list">
-                                            //     <thead style="text-align: center;">
-                                            //         <tr>
-                                            //             <th style="padding: 0 0 0 0px;">
-                                            //                 <img src=` + path_img + ` alt="Image" style="width: 100%;max-height: 368px;height:368"> 
-                                            //             </th>
-                                            //         </tr>
-                                            //     </thead>
-                                            //     <tbody>
-                                            //         <div class= "container">
-                                            //             <tr style="height: 100px;">
-                                            //                 <th>
-                                            //                     <div>
-                                            //                         <h1 style="font-family: Google Sans,Roboto,Arial,sans-serif;
-                                            //                         letter-spacing: 0;
-                                            //                         font-weight: 400;">
-                                            //                             <span style="font-size: x-large;">
-                                            //                                 ` + feature.properties.f2 + `
-                                            //                             </span>
-                                            //                         </h1>
-                                            //                     </div>
-                                            //                 </th>
-                                            //             </tr>
-                                            //         </div>
-                                            //         <div class= "container">
-                                            //             <tr style="height: 30px;">
-                                            //                 <th>
-                                            //                     <span>
-                                            //                         ` + feature.administrasi.f12 + `
-                                            //                     </span>
-                                            //                 </th>
-                                            //             </tr>
-                                            //         </div>
-                                            //         <div class= "container">
-                                            //             <tr style="height: 40px;">
-                                            //                 <th>
-                                            //                     <p style="text-align:center;">
-                                            //                         <img src="static/img/icon/samping_location.svg" alt="Image" style="height: 30px; width: 30px;">
-                                            //                     </p>
-                                            //                     <p>
-                                            //                         <span>
-                                            //                             ` + alamat + feature.administrasi.f1 + `, ` + feature.administrasi.f2 + `, ` + feature.administrasi.f3 + `, ` + feature.administrasi.f4 + `
-                                            //                         </span>
-                                            //                     </p>
-                                            //                 </th>
-                                            //             </tr>
-                                            //         </div>
-                                            //         <div class= "container">
-                                            //             <tr style="height: 40px;">
-                                            //                 <th>
-                                            //                     <p style="text-align:center;">
-                                            //                         <img src="static/img/icon/samping_informasi.svg" alt="Image" style="height: 30px; width: 30px;">
-                                            //                     </p>
-                                            //                     <p>
-                                            //                         <span>Luas Bangunan : ` + feature.administrasi.f6 + `</span>
-                                            //                     </p>
-                                            //                     <p>
-                                            //                         <span>Luas Tanah : ` + feature.administrasi.f7 + `</span>
-                                            //                     </p>
-                                            //                     <p>
-                                            //                         <span>Tinggi Bangunan : ` + feature.administrasi.f8 + `</span>
-                                            //                     </p>
-                                            //                     <p>
-                                            //                         <span>Pemilik : ` + feature.administrasi.f10 + `</span>
-                                            //                     </p>
-                                            //                 </th>
-                                            //             </tr>
-                                            //         </div>
-                                            //         <div class= "container">
-                                            //             <tr style="height: 40px;">
-                                            //                 <th>
-                                            //                     <p class="text-center" style="margin-top: 5px;">
-                                            //                         <a href="#" class="btn btn-primary" data-toggle="modal" data-target="#modal_bangunan_edit" id="btn_edit_bangunan" data-backdrop="static" data-keyboard="false" style="border-radius: 200px; margin-bottom: 5px;"><i class="fa fa-edit" style="color:#ffffff"> </i><i style="margin-left: 5px;">Edit Informasi Bangunan</i></a>
-                                            //                         <a href="#" id='btn_delete_bangunan' class='btn 
-                                            //                             btn-primary btn_edit_bangunan' data-toggle="modal" data-target="#modal_bangunan_delete" data-backdrop="static" data-keyboard="false" style="border-radius: 200px; margin-bottom: 5px;"><i class="fa fa-trash" style="color:#ffffff"> </i><i style="margin-left: 5px;">Delete Bangunan</i></a>
-                                            //                     </p>
-                                            //                 </th>
-                                            //             </tr>
-                                            //         </div>
-                                            //         <div class="container">
-                                            //             `+history+`
-                                            //         </div>
-                                            //     </tbody>
-                                            // </table>`;
-                                            // $("#isi_panel").html(content);
-                                            $(".gambar_keterangan").html(`<img src="` + path_img + `" alt="" style="width:100%;height:240px;border-top-left-radius: 10px;border-bottom-left-radius: 10px;">`)
-                                            $(".nama_keterangan").html(`<div>
-                                                                            <span style="font-size: large;">
-                                                                                ` + feature.properties.f2 + `
-                                                                            </span>
-                                                                        </div>
-                                                                        <div>
-                                                                            <span>
-                                                                                ` + alamat + feature.administrasi.f1 + `, ` + feature.administrasi.f2 + `, ` + feature.administrasi.f3 + `, ` + feature.administrasi.f4 + `
-                                                                            </span>
-                                                                        </div>
-                    
-                                                                        `)
-
-                                            $(".isi_keterangan").html(`<input type="text" name="idjalan" id="idjalan" class="hidden" value="">
-                                                                        <input type="text" name="coordinatejalan" id="coordinatejalan" class="hidden" value="">
-                                                                        <div>
-                                                                            <div>
-                                                                                <span>Jenis Bangunan</span>
+                                                                                        <label>Bukti Selesai Perbaikan (.png/.jpg/.jpeg/):</label>
+                                                                                        <input type="file" id="buktiselesai_bang">
                                                                                     </div>
-                                                                            <div>
-                                                                                <span>
-                                                                                    ` + feature.administrasi.f12 + `
-                                                                                </span>
+                                                
                                                                                 </div>
                                                                             </div>
-                                                                        <div>
-                                                                            <div>
-                                                                                <span>Luas Bangunan</span>
                                                                         </div>
-                                                                            <div>
-                                                                                <span style="font-family: 'Roboto';">` + feature.administrasi.f6 + ` m</span>
+
                                                                     </div>
+
                                                                 </div>
-                                                                        <div>
-                                                                            <div>
-                                                                                <span>Luas Tanah</span>
                                                             </div>
-                                                                            <div>
-                                                                                <span style="font-family: 'Roboto';">` + feature.administrasi.f7 + ` m</span>
                                                         </div>
                                                     </div>
-
-                                                                        <div>
-                                                                            <div>
-                                                                                <span>Tinggi Bangunan</span>
+                                                    <div class="modal-footer">
+                                                        <input type="text" id="coorbangbaru" class="hidden"  value="">
+                                                        <button type="button" class="btn btn-info" id="save-perbaikan_bang" style="float: right; margin-top: 5px; margin-right: 10px;">SAVE</button>
                                                     </div>
-                                                                            <div>
-                                                                                <span style="font-family: 'Roboto';">` + feature.administrasi.f8 + ` m</span>
                                                 </div>
+                                            </div>`;
+                                            var history
+                                            if (feature.administrasi.f11 == 'kantor_administrasi' || feature.administrasi.f11 == 'layanan_kesehatan' || feature.administrasi.f11 == 'puskesmas' ||
+                                                feature.administrasi.f11 == 'rumah_sakit' || feature.administrasi.f11 == 'sarana_pendidikan' || feature.administrasi.f11 == 'stasiun' ||
+                                                feature.administrasi.f11 == 'terminal_bus' || feature.administrasi.f11 == 'cagar_budaya' || feature.administrasi.f11 == 'gardu_listrik') {
+                                                if (feature.properties.f4 != null) {
+                                                    var list_history = feature.properties.f4
+                                                    var list_history_panel = ``
+                                                    for (var i = 0; i < list_history.length; i++) {
+                                                        var dt_history = list_history[i].split(",");
+                                                        var data_history = `<div class="form-group" style="margin-bottom:0px;">
+                                                                                <div class="row">
+                                                                                    <label class="col-md-6">` + dt_history[1] + `</label>
+                                                                                    <label class="col-md-6">` + dt_history[2] + `</label>
                                                                                 </div>
+                                                                            </div>`;
+                                                        list_history_panel += data_history
+                                                    };
 
+                                                    history = `
                                                     <div>
+                                                        <div style="margin-top: 150px;">
+                                                            <span>Perbaikan Terakhir</span>
+                                                            <span>
+                                                                <a id='btn_detail_per_bang' onclick="getdetailperbang(` + feature.properties.f1 + `)" data-toggle="modal" data-target="#modal_detail" style = "text-align:right; margin-right:26px;"><i>Detail</i></a>
+                                                            </span>
+                                                        </div>
                                                         <div>
-                                                                                <span>Pemilik</span>
+                                                            <span>
+                                                                <tr style="height: 40px;">
+                                                                    <th id="history_panel">
+                                                                        <div class="form-group" style="margin-bottom:0px;">
+                                                                            <div class="row">
+                                                                                <label class="col-md-6">` + list_history[0].split(",")[1] + `</label>
+                                                                                <label class="col-md-6">` + list_history[0].split(",")[2] + `</label>
                                                                             </div>
+                                                                        </div>
+                                                                        <p class="text-center" style="margin-top: 5px;">
+                                                                            <a href="#" id="btn_perbaikan_bangunan-s" data-toggle="modal" data-target="#input_perbaikan_bang-s"><i>Input Perbaikan</i></a>
+                                                                        </p>
+                                                                    </th>
+                                                                </tr>
+                                                            </span>
+                                                        </div>
+                                                    </div>
+                                                        `;
+                                                } else {
+                                                    history = `
                                                     <div>
-                                                                                <span style="font-family: 'Roboto';">` + feature.administrasi.f10 + ` m</span>
+                                                        <div style="margin-top: 150px;">
+                                                            <span>Perbaikan Terakhir</span>
                                                         </div>
-                                                                        </div>`);
-
-                                            $(".btn_action").html(`<div class="tombol-edit-keterangan text-center" style="background-color: #5A9AFB;position: absolute;width: 40px;height: 40px;bottom: 2px;right: 5px;border: 1pt solid rosybrown;border-radius: 8px;">
-                                                                            <a href="#" id="btn_edit_bangunan" class="btn" style="border-bottom-left-radius: 8px;border-top-right-radius: 8px;width: 100%;height: 100%;bottom: 0px;color: white;"><i class="icon-pencil5"></i></a>
+                                                        <div>
+                                                            <span>
+                                                                <tr style="height: 40px;">
+                                                                    <th id="history_panel">
+                                                                        <p class="text-center" style="margin-top: 10px;"><i>Belum Ada History</i></p>
+                                                                        <p class="text-center" style="margin-top: 10px;">
+                                                                            <a href="#" id="btn_perbaikan_bangunan-s" data-toggle="modal" data-target="#input_perbaikan_bang-s"><i>Input Perbaikan</i></a>
+                                                                        </p>
+                                                                    </th>
+                                                                </tr>
+                                                            </span>
                                                         </div>
-                                                                            <div class="tombol-delete-keterangan text-center" style="background-color: indianred;position: absolute;width: 40px;height: 40px;bottom: 2px;right: 50px;border: 1pt solid rosybrown;border-radius: 10px;">
-                                                                                <a href="#" id="btn_delete_bangunan" class="btn" style="border-bottom-left-radius: 8px;border-top-right-radius: 8px;width: 100%;height: 100%;bottom: 0px;color: white;"><i class="icon-eraser2"></i></a>
                                                     </div>
-                                                                            `)
+                                                    `;
+                                                }
+                                            } else {
+                                                history = ``
+                                            }
 
                                             content = `
                                                 <table class="table tasks-list">
@@ -1116,40 +1402,87 @@
                                                             ` + history + `
                                                         </div>
                                                     </tbody>
-                                            </table>`;
+                                                </table>
+                                            `;
+                                            $(".gambar_keterangan").html(`<img src="` + path_img + `" alt="" style="width:100%;height:240px;border-top-left-radius: 10px;border-bottom-left-radius: 10px;">`)
+                                            $(".nama_keterangan").html(`<div>
+                                                                            <span style="font-size: large;">
+                                                                                ` + feature.properties.f2 + `
+                                                                            </span>
+                                                                        </div>
+                                                                        <div>
+                                                                            <span>
+                                                                                ` + alamat + feature.administrasi.f1 + `, ` + feature.administrasi.f2 + `, ` + feature.administrasi.f3 + `, ` + feature.administrasi.f4 + `
+                                                                            </span>
+                                                                        </div>
+                    
+                                                                        `)
+
+                                            $(".isi_keterangan").html(`<input type="text" name="idjalan" id="idjalan" class="hidden" value="">
+                                                        <input type="text" name="coordinatejalan" id="coordinatejalan" class="hidden" value="">
+                                                    <div class="col-md-6">
+                                                        <div>
+                                                            <div>
+                                                                <span style="font-family: 'gilroylight';">Jenis Bangunan</span>
+                                                            </div>
+                                                            <div>
+                                                                <span style="font-family: 'gilroysemibold';">` + feature.administrasi.f12 + `</span>
+                                                            </div>
+                                                        </div>
+                                                        <div>
+                                                            <div style="margin-top:5px;">
+                                                                <span style="font-family: 'gilroylight';">Luas Bangunan</span>
+                                                            </div>
+                                                            <div>
+                                                                <span style="font-family: 'gilroysemibold';">` + feature.administrasi.f6 + ` m</span>
+                                                            </div>
+                                                        </div>
+                                                        <div>
+                                                            <div>
+                                                                <span style="font-family: 'gilroylight';">Luas Tanah</span>
+                                                            </div>
+                                                            <div>
+                                                                <span style="font-family: 'gilroysemibold';">` + feature.administrasi.f7 + ` m</span>
+                                                            </div>
+                                                        </div>
+                                                    </div>
+                                                    <div class="col-md-6">
+                                                        <div>
+                                                            <div>
+                                                                <span style="font-family: 'gilroylight';">Tinggi Bangunan</span>
+                                                            </div>
+                                                            <div>
+                                                                <span style="font-family: 'gilroysemibold';">` + feature.administrasi.f8 + ` m</span>
+                                                            </div>
+                                                        </div>
+
+                                                        <div>
+                                                            <div style="margin-top:5px;">
+                                                                <span style="font-family: 'gilroylight';">Pemilik</span>
+                                                            </div>
+                                                            <div>
+                                                                <span style="font-family: 'gilroysemibold';">` + feature.administrasi.f10 + ` m</span>
+                                                            </div>
+                                                        </div>
+                                                    </div>
+                                                        ` + history + `
+                                                    `);
+
+                                            $(".btn_action").html(`<div class="tombol-edit-keterangan text-center" style="background-color: #5A9AFB;position: absolute;width: 40px;height: 40px;bottom: 2px;right: 5px;border: 1pt solid rosybrown;border-radius: 8px;">
+                                                                            <a href="#" id="btn_edit_bangunan" class="btn" style="border-bottom-left-radius: 8px;border-top-right-radius: 8px;width: 100%;height: 100%;bottom: 0px;color: white;"><i class="icon-pencil5"></i></a>
+                                                                            </div>
+                                                                            <div class="tombol-delete-keterangan text-center" style="background-color: indianred;position: absolute;width: 40px;height: 40px;bottom: 2px;right: 50px;border: 1pt solid rosybrown;border-radius: 10px;">
+                                                                                <a href="#" id="btn_delete_bangunan" class="btn" style="border-bottom-left-radius: 8px;border-top-right-radius: 8px;width: 100%;height: 100%;bottom: 0px;color: white;"><i class="icon-eraser2"></i></a>
+                                                                            </div>
+                                                                            `)
                                             $("#isi_panel").html(content);
                                             $("#modal_bangunan_edit").html(content_edit);
                                             $("#modal_bangunan_delete").html(content_delete);
-                                            $("#input_perbaikan_bang").html(content_inp_his_bang);
+                                            $("#input_perbaikan_bang-s").html(content_inp_his_bang);
                                             panel_samp();
                                         });
-                                        // $("#tipe_point_b_e").val('feature.administrasi.f11').change();
-                                        // $('#tipe_point_b_e').val(feature.properties.f11).attr('selected','selected');
-                                        // $('#tipe_point_b_e option[value=bangunan]').attr('selected','selected');
-
-                                        // $('#idbangunan').val(feature.properties.f1);
-                                        // $('#namebangunan').val(feature.properties.f2);
-                                        // $('#infobangunan').val(feature.properties.f3);
-
-                                        // $('#nmkelurahan').val(feature.administrasi.f1);
-                                        // $('#nmkecamatan').val(feature.administrasi.f2);
-                                        // $('#nmkabkota').val(feature.administrasi.f3);
-                                        // $('#nmprovinsi').val(feature.administrasi.f4);
-
-                                        // $('#luasbangunan').val(feature.administrasi.f6);
-                                        // $('#luastanah').val(feature.administrasi.f7);
-                                        // $('#tinggibangunan').val(feature.administrasi.f8);
-                                        // $('#pemilik').val(feature.administrasi.f10);
-                                        // $('#gambar').val(feature.administrasi.f9);
-
-                                        // $("#coordinatebangunan").val(feature.geometry);
                                         $("#panel-samping").css("display", "block");
                                         $("#button_hide_panel").css("display", "block");
-
-                                        // $('#idbangunanhps').val(feature.properties.f1);
-                                        // $('#namebangunanhps').val(feature.properties.f2);
-                                        // $('#infobangunanhps').val(feature.properties.f3);
-
                                         panel_samp()
                                     }
                                 });
@@ -1220,53 +1553,10 @@
                     });
                     map.setView([data['gen'][0][0]['geometry']['coordinates'][0][0][0][1], data['gen'][0][0]['geometry']['coordinates'][0][0][0][0]], 19);
 
-                    geo_bangunan.addTo(map)
-                        // if (checkBox_building.checked == false) {
-                        //     geo_bangunan.clearLayers();
-                        //     geo_bangunan.remove();
-                        // }
-
-                    // map.eachLayer(function (layer) {
-                    // if (!!geo_bangunan.toGeoJSON) {
-                    //     map.removeLayer(geo_bangunan);
-                    // }
-                    // geo_bangunan.clearLayers()
-
-                    // map.on("movestart", function() {
-                    //     geo_bangunan.clearLayers();
-                    // });
-                    // function gasin(){
-                    // $.ajax({
-                    //     url: "{% url 'api:search_lanjut' %}",
-                    //     data: {
-                    //         'type':dar, 
-                    //         'idx':idm, 
-                    //         'db':db
-                    //     },
-                    //     dataType: 'json',
-                    //     success: function(data) {
-                    //         // if (map.hasLayer(geo_bangunan)) {
-                    //         //     geo_bangunan.clearLayers()
-                    //         //     geo_bangunan.remove()
-                    //         // }
-                    //         let list_poly = [];
-                    //         for (var i = 0; i < data['gen'].length; i++) {
-                    //             geoj = data['gen'][i][0];
-                    //             list_poly.push(geoj);
-                    //         };
-                    //         // geo_bangunan.clearLayers()
-                    //         // geo_bangunan.remove()
-                    //         geo_json_bangunan(list_poly);
-                    //     }
-                    // });
-                    // map.setView([data['gen'][0][0]['geometry']['coordinates'][0][0][0][1], data['gen'][0][0]['geometry']['coordinates'][0][0][0][0]], 19);
-                    // // geo_bangunan.clearLayers()
-                    // geo_bangunan.addTo(map)
-                    // }
-                    // });
+                    geo_bangunan.addTo(map);
 
                     $(document).on("click", "#btn_edit_bangunan", function() {
-
+                        $("#modal_bangunan_edit").css('display', 'block');
                         var tipe1 = $('#tipe111').val();
                         $('#tipe_point_b_e option[value=' + tipe1 + ']').attr('selected', 'selected');
 
@@ -1468,6 +1758,7 @@
                     });
 
                     $(document).on("click", "#btn_delete_bangunan", function() {
+                        $("#modal_bangunan_delete").css('display', 'block');
                         var map_delete = new L.map('map-delete', {
                             editable: true,
                             zoomControl: false,
@@ -1478,6 +1769,7 @@
                             maxZoom: 22,
                             minZoom: 4,
                         }).addTo(map_delete);
+
                         var id_polyhps = $('#idbangunanhps').val();
                         // console.log(id_polyhps)
                         loaderPage(true);
@@ -1552,8 +1844,10 @@
 
                     });
 
-                    var map_bang = new L.map('map-insert-renov-bang', {
-                        editable: true,
+                    $(document).on("click", "#btn_perbaikan_bangunan-s", function() {
+                        // $("#input_perbaikan_bang-s").css("display", "block");
+                        var map_bang = new L.map('map-insert-renov-bang-s', {
+                            editable: false,
                             zoomControl: false,
                             drawControl: true
                         }).setView([-2, 118], 5);
@@ -1563,42 +1857,13 @@
                             minZoom: 4,
                         }).addTo(map_bang);
 
-                    var polyxxx = L.polygon([
-                        [-4.1283969, 104.1674575],
-                        [-4.128396, 104.1674947],
-                        [-4.1284664, 104.1674964],
-                        [-4.1284674, 104.1674593],
-                        [-4.1283969, 104.1674575]
-                    ]).addTo(map_bang)
-
-                    // var geo_bangunan_input = L.geoJson(null, {
-                    //     style: function(feature) {
-                    //         return {
-                    //             color: "#06FF08",
-                    //             weight: 8,
-                    //             opacity: 2,
-                    //             zIndex: 1000
-                    //         };
+                        // if (map_bang.hasLayer(polyxxx)) {
+                        //     polyxxx.remove()
                         // }
-                    // }).addTo(map_bang);
-
-                    $(document).on("click", "#btn_perbaikan_bangunan", function() {
-                        var map_bang = new L.map('map-insert-renov-bang', {
-                            editable: true,
-                            zoomControl: false,
-                            drawControl: true
-                        }).setView([-2, 118], 5);
 
-                        mapssx = L.tileLayer('https://mt1.google.com/vt/lyrs=s&x={x}&y={y}&z={z}', {
-                            maxZoom: 22,
-                            minZoom: 4,
-                        }).addTo(map_bang);
+                        var id_polyx = $('#id_bang_perbaikan').val();
 
-                        $("#input_perbaikan_bang").css("display", "block");
-                        if (map_bang.hasLayer(polyxxx)) {
-                            polyxxx.remove()
-                        }
-                        var id_polyx = $('#idbangunan').val();
+                        loaderPage(true);
 
                         $.ajax({
                             url: "{% url 'apps:input-perbaikan-bang' %}",
@@ -1607,6 +1872,12 @@
                             },
                             dataType: 'json',
                             success: function(data) {
+
+                                setTimeout(function() {
+                                    map_bang.invalidateSize();
+                                }, 1000);
+                                loaderPage(false);
+
                                 $("#nama_bang").val(data[0]);
                                 $("#type_bang").val(data[4]);
                                 $("#id_bang_perbaikan").val(data[3]);
@@ -1636,7 +1907,7 @@
                                 })
                             }
                         })
-                    })
+                    });
 
                     $(document).on("click", "#save-perbaikan_bang", function(e) {
                         var polyginbang = $('#coorbangbaru').val();
@@ -1716,7 +1987,7 @@
                                         icon: "success",
                                         confirmButtonColor: "#00BCD4"
                                     }, function() {
-                                        $("#input_perbaikan_bang").css("display", "none");
+                                        $("#input_perbaikan_bang-s").css("display", "none");
                                     })
                                 } else {
                                     swal({
@@ -2104,7 +2375,7 @@
                     });
 
                     $(document).on("click", "#btn_jalan", function() {
-
+                        $("#modal-jalan").css('display', 'block');
                         if (map_edit_jalan.hasLayer(polygon_edit_jalan)) {
                             polygon_edit_jalan.remove()
                         }
@@ -2162,7 +2433,7 @@
 
                     //tes
                     $(document).on("click", "#btn_hapus_jalan", function() {
-
+                        $("#modal-hapus-jalan").css('display', 'block');
                         var id_poly = $('#idjalan').val();
 
                         $.ajax({
@@ -2261,6 +2532,145 @@
         }
     });
 
+    /* ini ngaruh sama element yang punya class "switchery-" */
+    var primary = document.querySelectorAll("[class^=switchery-");
+    /* ------------------- */
+
+    for (var z = 0; z < primary.length; z++) {
+        var switchery = new Switchery(primary[z], {
+            color: '#5A9AFB',
+            secondaryColor: '#3B3E47',
+            jackColor: '#fff',
+            jackSecondaryColor: '#fff'
+        });
+    }
+
+    $("#perbaikan_manage").click(function() {
+        var x = window.matchMedia("(max-width: 700px)")
+        if (x.matches) { // If media query matches
+            swal({
+                title: "Sorry",
+                text: "Untuk di mobile tampilan manajemen perbaikan tidak mendukung, Silahkan akses menggunakan laptop atau PC",
+                type: "warning",
+                icon: "error",
+                confirmButtonColor: "#00BCD4"
+            })
+
+            setTimeout(function() {
+                $("#panel-sm2").removeClass('active')
+                $("#manage_perbaikan").removeClass('active')
+                $("#btn-hide-all").css("display", "none")
+            }, 500);
+        }
+    })
+
     $('.leaflet-bottom.leaflet-right>.leaflet-control-attribution.leaflet-control').html(`Powered by <a href="https://khansia.co.id" target="_blank">Khansia</a> with <a href="https://leafletjs.com" target="_blank">Leaflet</a>`)
     $('.leaflet-bottom.leaflet-right>.leaflet-control-attribution.leaflet-control').css("right", "50px")
 </script>
+
+<!-- <script>
+    $(function() {
+
+
+        // Switchery
+        // ------------------------------
+    
+        // Initialize multiple switches
+        if (Array.prototype.forEach) {
+            var elems = Array.prototype.slice.call(document.querySelectorAll('.switchery'));
+            elems.forEach(function(html) {
+                var switchery = new Switchery(html);
+            });
+        }
+        else {
+            var elems = document.querySelectorAll('.switchery');
+            for (var i = 0; i < elems.length; i++) {
+                var switchery = new Switchery(elems[i]);
+            }
+        }
+    
+        // Colored switches
+        var primary = document.querySelector('.switchery-primary');
+        var switchery = new Switchery(primary, { color: '#2196F3' });
+    
+        var danger = document.querySelector('.switchery-danger');
+        var switchery = new Switchery(danger, { color: '#EF5350' });
+    
+        var warning = document.querySelector('.switchery-warning');
+        var switchery = new Switchery(warning, { color: '#FF7043' });
+    
+        var info = document.querySelector('.switchery-info');
+        var switchery = new Switchery(info, { color: '#00BCD4'});
+    
+    
+    
+        // Checkboxes/radios (Uniform)
+        // ------------------------------
+    
+        // Default initialization
+        $(".styled, .multiselect-container input").uniform({
+            radioClass: 'choice'
+        });
+    
+        // File input
+        $(".file-styled").uniform({
+            wrapperClass: 'bg-blue',
+            fileButtonHtml: '<i class="icon-file-plus"></i>'
+        });
+    
+    
+        //
+        // Contextual colors
+        //
+    
+        // Primary
+        $(".control-primary").uniform({
+            radioClass: 'choice',
+            wrapperClass: 'border-primary-600 text-primary-800'
+        });
+    
+        // Danger
+        $(".control-danger").uniform({
+            radioClass: 'choice',
+            wrapperClass: 'border-danger-600 text-danger-800'
+        });
+    
+        // Success
+        $(".control-success").uniform({
+            radioClass: 'choice',
+            wrapperClass: 'border-success-600 text-success-800'
+        });
+    
+        // Warning
+        $(".control-warning").uniform({
+            radioClass: 'choice',
+            wrapperClass: 'border-warning-600 text-warning-800'
+        });
+    
+        // Info
+        $(".control-info").uniform({
+            radioClass: 'choice',
+            wrapperClass: 'border-info-600 text-info-800'
+        });
+    
+        // Custom color
+        $(".control-custom").uniform({
+            radioClass: 'choice',
+            wrapperClass: 'border-indigo-600 text-indigo-800'
+        });
+    
+    
+    
+        // Bootstrap switch
+        // ------------------------------
+    
+        $(".switch").bootstrapSwitch();
+        
+    });
+</script> -->
+
+{% if user.is_authenticated %} {% else %}
+<script>
+    $(".tombol-edit").html('ilang')
+</script>
+{% endif %}
\ No newline at end of file

templates/layout/user_layout.html

@@ -632,7 +632,8 @@
                                 <label class="col-lg-3 control-label lbl-top">Groups</label>
                                 <div class="col-lg-9">
                                     <select style="border-bottom: 1px solid rgb(83, 83, 83) !important;" id="select_group" data-placeholder="select group.." class="select-size-xs">
-                                            <option></option>
+                                            <option value="Select Group"></option>
+                                            
                                     </select>
                                 </div>
                             </div>