pov project

Author: vutpov

.eslintrc

@@ -1,3 +1,3 @@
 {
-    "extends": ["wesbos"]
+    //"extends": ["wesbos"]
 }

public/admin/css/style.css

@@ -73,3 +73,14 @@ svg[class*="fa"] {
 .select2-selection--single,
 .select2-selection__rendered {
   line-height: 35px !important; }
+
+.my-mb-15 {
+  margin-bottom: 15px; }
+
+.modal {
+  overflow: visible;
+  z-index: 111;
+  margin-top: 40px; }
+
+.primary-color {
+  color: #00C0EF; }

public/admin/js/script.js

@@ -44,6 +44,12 @@ $(function() {
     $('form#detail').submit(e => {
         e.preventDefault();
 
+        if($("#btnAdd").text()=='Cancel'){
+            changeBtnContext('#btnAdd','1');
+            return;
+        }
+        
+       
         const inputText = document.querySelectorAll('.text-validate');
 
         inputText.forEach(item => {
@@ -87,45 +93,51 @@ $(function() {
         }
     });
 
-    let currentRowIndex = -1;
-
-    const tableProjectDetail = this.querySelector('#table-project-detail');
+    
 
-    tableProjectDetail.addEventListener('click', e => {
-        parentTag = $(e.target).parent();
+    let currentRowIndex = -1;
 
-        console.log(parentTag);
+    const detail = this.querySelector('#project-detail-body');
 
-        if (
-            parentTag.prop('tagName') == 'TR' &&
-            !parentTag.hasClass('tr-heading')
-        ) {
-            const lastRow = `#table-project-detail tr[alt=${currentRowIndex}]`;
-            console.log(lastRow);
+    detail.addEventListener('click', e => {
+        
+       console.log(e.target.tagName);
+      
+        console.log(e.target.className)
+        
+        console.log(e)
 
-            $(lastRow).removeClass('selected-row');
 
-            $(tableProjectDetail);
+        if(e.target.tagName == 'A'){
+            if(e.target.rel == 'edit'){
+                getProjectItemForEdit($(e.target).attr('alt'));
+            }else if(e.target.rel == 'delete'){
 
-            currentRowIndex = $(e.target)
-                .parent()
-                .attr('alt');
-            $(e.target)
-                .parent()
-                .addClass('selected-row');
+            }
         }
+        
+        
+        
     });
 
-    $('#table-project-detail').click(e => {});
+
 
     $('.select2').select2({
         theme: 'classic',
         width: 'resolve',
     });
 
     /* Add property detail to project */
+
+
+
+
+
 });
 
+
+
+
 function addProjectDetail() {
     const type = document.querySelector('#propertyType');
     const code = document.querySelector('#code');
@@ -148,16 +160,28 @@ function addProjectDetail() {
     const rowCount = $('#table-project-detail td').closest('tr').length + 1;
 
     const row = `<tr class="detail-row" alt=${rowCount - 1}><td>${rowCount}</td>
-        <td><div alt='${type.value}'></div>${stType}</td>
-        <td>${code.value}</td>
-        <td>${description.value}</td>
-        <td>${no.value}</td>
-        <td>${st.value}</td>
-        <td>${propAttribute}</td>
-        <td>${cost.value}</td>
-        <td>${price.value}</td>
-        <td>${free.value}</td>
-        <td><div alt='${publish.value}'></div>${stPublish}</td>
+        <td alt='${type.value}'>${stType}</td>
+        <td alt='${code.value}'>${code.value}</td>
+        <td alt='${description.value}'>${description.value}</td>
+        <td alt='${no.value}'>${no.value}</td>
+        <td alt='${st.value}'>${st.value}</td>
+        <td alt='${$('#attribute').val()}'>${propAttribute}</td>
+        <td alt='${cost.value}'>${cost.value}</td>
+        <td alt='${price.value}'>${price.value}</td>
+        <td alt='${free.value}'>${free.value}</td>
+        <td alt='${
+            publish.value
+        }' class='pro-detail-publish'>${stPublish}</td>
+        <td>
+            <a alt=${rowCount - 1} rel="edit" href="#" class="btn btn-primary edit">Edit</a>
+           
+        </td>
+        <td>
+            <a alt=${rowCount - 1} rel="delete" href="#" class="btn btn-danger delete">Delete</a>  
+        </td>
+
+       
+
     `;
 
     $('#project-detail-body').append(row);
@@ -170,3 +194,14 @@ function addProjectDetail() {
     $('#tCost').text(tCost);
     $('#tPrice').text(tPrice);
 }
+
+
+
+function getProjectItemForEdit(rowIndex) {
+    let row = document.querySelector(`.tr[alt="${rowIndex}"]`);
+    console.log(row);
+}
+
+function showPropertyPopup(){
+
+}

public/admin/scss/style.scss

@@ -122,7 +122,19 @@ svg[class*="fa"] {
 .select2-selection__rendered {
 
     line-height: 35px !important;
+}
+
+.my-mb-15 {
+    margin-bottom: 15px;
+}
 
+.modal {
+    overflow: visible;
 
+    z-index: 111;
+    margin-top: 40px;
+}
 
+.primary-color {
+    color: $primary-color;
 }

resources/views/admin/master.blade.php

@@ -48,9 +48,12 @@
   <!-- Font Awesome -->
   <link rel="stylesheet" href="{{url('admin/css/all.min.css')}}">
 
+  <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/jquery-modal/0.9.1/jquery.modal.min.css" />
   <!-- Additional style -->
   <link rel="stylesheet" href="{{url('admin/css/style.css')}}">
 
+
+
   <meta name="csrf-token" content="{{ csrf_token() }}">
 </head>
 <!--
@@ -448,6 +451,9 @@
   <!-- Select2 -->
   <script src="https://cdnjs.cloudflare.com/ajax/libs/select2/4.0.8/js/select2.min.js"></script>
 
+  <script src="https://cdnjs.cloudflare.com/ajax/libs/jquery-modal/0.9.1/jquery.modal.min.js"></script>
+
+
   <script src="{{url('admin/js/script.js')}}"></script>
 
 </body>