component-list.php 6.8 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254
  1. <?php
  2. session_start();
  3. if (!isset($_SESSION['loggedin'])) {
  4. header('Location: pages-signin.html');
  5. exit;
  6. }
  7. ?>
  8. <!doctype html>
  9. <html class="fixed">
  10. <head>
  11. <?php include("bim-support-header.html"); ?>
  12. <script src="./script/js/global.js"></script>
  13. <script type="application/javascript">
  14. var rvtName = [];
  15. var categoryTable = [];
  16. var year = [];
  17. //當選擇大項時,需要展示所有'細項分類'內的元件
  18. var category = [];
  19. var categoryInEnglish = [];
  20. //現在的細項分類
  21. var type = "";
  22. var typeInChinese = "";
  23. //現在的大項分類
  24. var parent = "";
  25. var parentInChinese = "";
  26. //類別的中英文字典,中文是為了檔案路徑
  27. var allTypeInEnglish = [];
  28. var allTypeInChinese = [];
  29. var allParentInEnglish = [];
  30. var allParentInChinese = [];
  31. var userName = '<?php echo $_SESSION['name']; ?>';
  32. var searchURL = window.location.search;
  33. searchURL = searchURL.substring(1, searchURL.length);
  34. if (searchURL != "") {
  35. //類別選擇細項
  36. if (searchURL.split("&") != undefined && searchURL.split("&")[1] != undefined) {
  37. type = searchURL.split("&")[0].split("=")[1];
  38. parent = searchURL.split("&")[1].split("=")[1];
  39. //類別選擇大項
  40. } else if (searchURL.split("&") != undefined && searchURL.split("&")[1] == undefined) {
  41. parent = searchURL.split("&")[0].split("=")[1];
  42. }
  43. }
  44. var $grid;
  45. pageHeader = "元件庫";
  46. //匯入大細項類別的中英文字典
  47. $.getJSON('./assets/equipmentTable2.json', function(data) {
  48. for (var i = 0; i < data.length; i++) {
  49. allParentInEnglish.push(data[i].category_code);
  50. allParentInChinese.push(data[i].category_name);
  51. for (var j = 0; j < data[i].children.length; j++) {
  52. allTypeInEnglish.push(data[i].children[j].component_code);
  53. allTypeInChinese.push(data[i].children[j].component_name);
  54. }
  55. }
  56. });
  57. </script>
  58. </head>
  59. <body>
  60. <canvas id="c"></canvas>
  61. <section class="body">
  62. <!-- start: header -->
  63. <header-menu></header-menu>
  64. <!-- end: header -->
  65. <div class="inner-wrapper">
  66. <!-- start: sidebar -->
  67. <side-bar></side-bar>
  68. <!-- end: sidebar -->
  69. <section role="main" class="content-body">
  70. <header class="page-header">
  71. <h2>{{pageHeader}}</h2>
  72. </header>
  73. <!-- start: page -->
  74. <section class="content-with-menu content-with-menu-has-toolbar media-gallery">
  75. <div class="content-with-menu-container">
  76. <inner-menu>
  77. <template v-slot:inner-equipment>
  78. <equipment-list></equipment-list>
  79. </template>
  80. </inner-menu>
  81. <div class="inner-body mg-main">
  82. <div class="inner-toolbar">
  83. <ul>
  84. <search-bar></search-bar>
  85. <filter-bar></filter-bar>
  86. </ul>
  87. </div>
  88. <filter-content></filter-content>
  89. <div class="row mg-files" data-sort-destination data-sort-id="media-gallery" id="content">
  90. </div>
  91. </div>
  92. </div>
  93. </section>
  94. <!-- end: page -->
  95. </section>
  96. </div>
  97. </section>
  98. <script>
  99. /*Vue */
  100. vm.mount('.body');
  101. </script>
  102. <?php include("bim-support-body.html"); ?>
  103. <script type="application/javascript">
  104. $(function() {
  105. //現在大項的中文
  106. for (var i = 0; i < allParentInEnglish.length; i++) {
  107. if (allParentInEnglish[i] == parent) {
  108. parentInChinese = allParentInChinese[i];
  109. }
  110. }
  111. //現在細項的中文
  112. for (var i = 0; i < allTypeInEnglish.length; i++) {
  113. if (allTypeInEnglish[i] == type) {
  114. typeInChinese = allTypeInChinese[i];
  115. }
  116. }
  117. //撈現在類別內的元件
  118. $.ajax({
  119. url: "./script/php/equipment_group.php",
  120. type: "GET",
  121. data: {
  122. type: typeInChinese,
  123. parent: parentInChinese
  124. },
  125. contentType: "application/json",
  126. dataType: "json"
  127. }).done(function(data) {
  128. year = data['year'];
  129. rvtName = data['rvtName'];
  130. category = data["category"];
  131. //若類別選大項,需要列所有細項的元件,因此需要所有元件的細項名稱
  132. for (var i = 0; i < category.length; i++) {
  133. for (var j = 0; j < allTypeInChinese.length; j++) {
  134. if (category[i] == allTypeInChinese[j]) {
  135. categoryInEnglish[i] = allTypeInEnglish[j];
  136. }
  137. }
  138. }
  139. //一開始進入BIM元件庫顯示
  140. if (searchURL == "") {
  141. $("#content").append("<h3>請選擇左方類別以搜尋元件</h3>");
  142. $("#content").css("padding", "0");
  143. $("#content").css("text-align", "center");
  144. }
  145. if (!(type == "" && parent == "")) {
  146. $.when(initThreeJS()).then(function() {
  147. $grid = $("#content").isotope({
  148. itemSelector: ".isotope-item",
  149. layoutMode: 'fitRows'
  150. });
  151. //若選到細項,該細項內沒有元件檔案
  152. if ($("#content").children().length == 0 && searchURL != "") {
  153. $("#content").append("<h3>此類別沒有元件檔案</h3>");
  154. $("#content").css("padding", "0");
  155. $("#content").css("text-align", "center");
  156. }
  157. }).then(function() {
  158. //元件有時候會不排版
  159. setTimeout(function() {
  160. $grid.isotope()
  161. }, 100);
  162. });
  163. }
  164. }).error(function(error) {
  165. console.log(error);
  166. });
  167. $.ajax({
  168. url: "./script/php/equipment_revitVersion.php",
  169. type: "GET",
  170. data: {
  171. type: type,
  172. parent: parent
  173. },
  174. contentType: "application/json",
  175. dataType: "json"
  176. }).done(function(data) {
  177. //篩選內元件版本
  178. for (var i = 0; i < data.length; i++) {
  179. $("#revitVersion").append('<label><input type="checkbox" value=".' + data[i] + '" /> ' + data[i] + '</label> ');
  180. }
  181. }).error(function(error) {
  182. console.log(error);
  183. });
  184. //被選到的類別highlight起來
  185. for (var i = 0; i < jsonData.length; i++) {
  186. for (var j = 0; j < jsonData[i].children.length; j++) {
  187. $("a").each(function() {
  188. if (jsonData[i].category_code == parent) {
  189. //選到的是細項類別
  190. if (jsonData[i].children[j].component_code == type) {
  191. var searchText = jsonData[i].children[j].component_name;
  192. var found;
  193. if ($(this).context.innerText == searchText && $(this).context.name == jsonData[i].category_code) {
  194. $(this).context.classList.add("highlight");
  195. $(this).context.parentNode.parentNode.parentNode.classList.add("nav-expanded");
  196. }
  197. //選到的是大項類別
  198. } else if (type == "") {
  199. var searchText = parentInChinese;
  200. var found;
  201. if ($(this).context.innerText == searchText && $(this).context.name == jsonData[i].category_code) {
  202. if (!$(this).context.classList.contains("highlight")) {
  203. $(this).context.classList.add("highlight");
  204. $(this).context.setAttribute("style", "background: #0088cc");
  205. } else {
  206. $(this).context.removeAttribute("href");
  207. }
  208. }
  209. }
  210. }
  211. });
  212. }
  213. }
  214. });
  215. </script>
  216. <script src="script/js/3Dpic.js" type="module"></script>
  217. </body>
  218. </html>