component-list.php 5.7 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215
  1. <?php
  2. include($_SERVER['DOCUMENT_ROOT'] . "/Authorization/script/php/permission/check_right.php");
  3. ?>
  4. <!doctype html>
  5. <html class="fixed sidebar-left-collapsed">
  6. <head>
  7. <?php include("bim-support-header.html"); ?>
  8. <script src="./script/js/global.js"></script>
  9. <script type="application/javascript">
  10. var rvtName = [];
  11. var categoryTable = [];
  12. var year = [];
  13. //當選擇大項時,需要展示所有'細項分類'內的元件
  14. var category = [];
  15. //現在的大項分類
  16. var parent = "";
  17. var type = "";
  18. var componentGroup = [];
  19. var userName = "<?php echo $_SESSION['name'] ?>";
  20. var role = "<?php echo ($groupName); ?>";
  21. var right = <?php echo ($right); ?>;
  22. var url_href = window.location.href;
  23. var url = new URL(url_href);
  24. parent = url.searchParams.get("parent");
  25. type = (url.searchParams.get("type") == "" ? "" : url.searchParams.get("type"));
  26. var $grid;
  27. pageHeader = "元件庫";
  28. </script>
  29. </head>
  30. <body>
  31. <canvas id="c"></canvas>
  32. <section class="body">
  33. <!-- start: header -->
  34. <header-menu></header-menu>
  35. <!-- end: header -->
  36. <div class="inner-wrapper">
  37. <!-- start: sidebar -->
  38. <side-bar></side-bar>
  39. <!-- end: sidebar -->
  40. <section role="main" class="content-body">
  41. <header class="page-header">
  42. <h2>{{pageHeader}}</h2>
  43. </header>
  44. <!-- start: page -->
  45. <section class="content-with-menu content-with-menu-has-toolbar media-gallery">
  46. <div class="content-with-menu-container">
  47. <inner-menu>
  48. <template v-slot:inner-equipment>
  49. <equipment-list></equipment-list>
  50. </template>
  51. </inner-menu>
  52. <div class="inner-body mg-main">
  53. <div class="inner-toolbar">
  54. <ul>
  55. <search-bar></search-bar>
  56. <filter-bar></filter-bar>
  57. </ul>
  58. </div>
  59. <filter-content></filter-content>
  60. <div class="row mg-files" data-sort-destination data-sort-id="media-gallery" id="content">
  61. </div>
  62. </div>
  63. </div>
  64. </section>
  65. <!-- end: page -->
  66. </section>
  67. </div>
  68. </section>
  69. <script>
  70. /*Vue */
  71. vm.mount('.body');
  72. addUserImage(userName.charAt(0), role);
  73. </script>
  74. <?php include("bim-support-body.html"); ?>
  75. <script type="application/javascript">
  76. $(function() {
  77. getEquipmentGroup();
  78. getEquipmentRevitVersion();
  79. //展開
  80. $(".nav-parent").each(function(){
  81. var parents = [];
  82. if(parent == $(this).context.children[0].outerHTML.split('"')[3]){
  83. parents = parent.split("/");
  84. $(this).context.classList.add("nav-expanded");
  85. var temp = $(this).context.parentNode.parentNode;
  86. for(var i = 0; i < parents.length-1; i++){
  87. temp.classList.add("nav-expanded");
  88. temp = temp.parentNode.parentNode;
  89. }
  90. }
  91. });
  92. $(".menu-item").each(function(){
  93. if($(this).context.outerHTML.includes(type)){
  94. $(this).css("background", "#0088cc");
  95. }
  96. });
  97. $(".dropdown-btn").on("click",function(){
  98. $("#content").empty();
  99. $("#revitVersion").empty();
  100. $(".dropdown-btn, .menu-item").each(function(){
  101. if($(this).css("background").includes("rgb(0, 136, 204)")){
  102. $(this).css("background", "rgba(0,0,0,0)");
  103. }
  104. });
  105. parent = $(this).attr("parent");
  106. type = "";
  107. getEquipmentGroup();
  108. getEquipmentRevitVersion();
  109. $(this).css("background", "#0088cc");
  110. })
  111. });
  112. function getEquipmentGroup(){
  113. //撈現在類別內的元件
  114. $.ajax({
  115. url: "./script/php/equipment_group.php",
  116. type: "GET",
  117. data: {
  118. parent: parent,
  119. type: type
  120. },
  121. contentType: "application/json",
  122. dataType: "json"
  123. }).done(function(data) {
  124. year = data['year'];
  125. rvtName = data['rvtName'];
  126. category = data["category"];
  127. componentGroup = data["componentGroup"];
  128. //一開始進入BIM元件庫顯示
  129. if (parent == null) {
  130. $("#content").append("<h1 style='color: red;'>注意!BIM元件庫需配合BIM程式庫中的拖放元件API使用!</h1>");
  131. $("#content").append("<h3>請選擇左方類別以搜尋元件,搜尋到需要的元件請點擊加入清單按鈕</h3>");
  132. $("#content").append("<h3>到BIM程式庫下載拖放元件API,並參考操作方式以進行元件放置動作</h3>");
  133. $("#content").css("padding", "0");
  134. $("#content").css("text-align", "center");
  135. $("a").each(function() {
  136. if ($(this).context.name != "" && $(this).context.className == "menu-item" && $(this).context.name != parent) {
  137. //其他大項類別不要產生ul
  138. $(this).closest("ul").remove();
  139. }
  140. });
  141. } else {
  142. $.when(initThreeJS()).then(function() {
  143. $grid = $("#content").isotope({
  144. itemSelector: ".isotope-item",
  145. layoutMode: 'fitRows'
  146. });
  147. //若選到細項,該細項內沒有元件檔案
  148. if ($("#content").children().length == 0) {
  149. $("#content").append("<h3>此類別沒有元件檔案</h3>");
  150. $("#content").css("padding", "0");
  151. $("#content").css("text-align", "center");
  152. }
  153. }).then(function() {
  154. //元件有時候會不排版
  155. setTimeout(function() {
  156. $grid.isotope()
  157. }, 100);
  158. });
  159. }
  160. }).error(function(error) {
  161. console.log(error);
  162. });
  163. }
  164. function getEquipmentRevitVersion(){
  165. $.ajax({
  166. url: "./script/php/equipment_revitVersion.php",
  167. type: "GET",
  168. data: {
  169. parent: parent
  170. },
  171. contentType: "application/json",
  172. dataType: "json"
  173. }).done(function(data) {
  174. //篩選內元件版本
  175. for (var i = 0; i < data.length; i++) {
  176. $("#revitVersion").append('<label><input type="checkbox" value=".' + data[i] + '" /> ' + data[i] + '</label> ');
  177. }
  178. }).error(function(error) {
  179. console.log(error);
  180. });
  181. }
  182. </script>
  183. <script src="./script/js/data-sort.js"></script>
  184. <script src="script/js/3Dpic.js" type="module"></script>
  185. </body>
  186. </html>