part expandable feature

Author: ludoBarel

app/js/common-objects/customizations/part-table-columns.js

@@ -80,7 +80,16 @@ define(['common-objects/utils/date'], function (date) {
 
             var assemblyIcon = model.isLastIterationAssembly() ? 'fa-cubes' : 'fa-cube';
 
-            return '<td class="part_number"><i class="fa ' + statusIcon + '"></i> <i class="fa ' + assemblyIcon + '"></i> <span class="part_number_value"> ' + model.getNumber() + '</span></td>';
+            //build cell to return according to if the part is assembled with others part or not
+            var withoutAsemblyParts = '<td class="part_number"><i class="fa ' + statusIcon + '"></i> <i class="fa ' + assemblyIcon + '"></i> <span class="part_number_value"> ' + model.getNumber() + '</span></td>';
+
+            var text = '<div><i  class="fa ' + statusIcon + '"></i><i class="fa ' + assemblyIcon + '"></i><ul><li class="path_-1 lastExpandable"><div><div  class="blockClickArea hitarea expandable-hitarea lastExpandable-hitarea expandable"></div><span class="part_number_value">' + model.getNumber() + '</span><ul class="list_child"></ul></li></ul></div></div>';
+
+            var navTag = '<nav class="treeview">' + text + '</nav>';
+
+            var assemblyPartBuild = '<td class="part_number">' + navTag + '</td>';
+
+            return assemblyIcon === 'fa-cubes' ? assemblyPartBuild : withoutAsemblyParts;
         },
         'pr.version': function (model) {
             return '<td><span>' + model.getVersion() + '</span></td>';

app/less/product-structure/treeview.less app/less/common/treeview.lessapp/less/product-structure/treeview.less renamed to app/less/common/treeview.less

@@ -0,0 +1,61 @@
+#part_table {
+
+    > tbody {
+
+        > tr {
+            > .part_number {
+
+                > .treeview {
+
+                    background: none;
+
+                    li {
+
+                        > .product_title {
+
+                            position: relative;
+                            top: -3px;
+                        }
+                    }
+
+                    > div {
+
+                        > ul {
+
+                            display: inline-block;
+                            width: 100%;
+                            height: 100%;
+                            background: none;
+                            > .path_-1 {
+                                position: relative;
+                                top: 6px;
+                                > div {
+                                    > .list_child {
+
+                                        background: none;
+                                    }
+                                    > .part_number_value {
+
+                                        position: relative;
+                                        top: -5px;
+                                    }
+                                    > .blockClickArea {
+
+                                        position: relative;
+                                        top: 0px;
+                                    }
+                                }
+                            }
+                        }
+                        > .fa {
+
+                            position: relative;
+                            top: 0px;
+                        }
+                    }
+                }
+            }
+        }
+    }
+}
+

app/less/product-management/part_list_item.less

@@ -10,3 +10,5 @@
 @import (inline) "../../bower_components/jQuery-QueryBuilder/dist/css/query-builder.default.css";
 @import (inline) "../../bower_components/selectize/dist/css/selectize.default.css";
 @import "query_builder";
+@import "part_list_item";
+@import "../common/treeview";

app/less/product-management/style.less

@@ -4,7 +4,7 @@
 @import "../modules/style";
 @import (inline) "../../bower_components/selectize/dist/css/selectize.default.css";
 @import "app";
-@import "treeview";
+@import "../common/treeview";
 @import "menu";
 @import "product_nav_list";
 @import "content";