component-detail.php 9.2 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333
  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>
  10. var isFavorite = false;
  11. var revitVersion = "";
  12. var searchURL = window.location.search;
  13. searchURL = searchURL.substring(1, searchURL.length);
  14. var name = decodeURIComponent(searchURL.split("&")[0].split("=")[1]);
  15. var type = searchURL.split("&")[1].split("=")[1];
  16. var parent = searchURL.split("&")[2].split("=")[1];
  17. var typeInChinese = "";
  18. var parentInChinese = "";
  19. var userName = "<?php echo $_SESSION['name'] ?>";
  20. var role = "<?php echo ($groupName); ?>";
  21. var right = <?php echo ($right); ?>;
  22. var header = [];
  23. var sizeHeader = [];
  24. var value = [];
  25. var sizeValue = [];
  26. pageHeader = "元件庫";
  27. $.getJSON('./assets/equipmentTable2.json', function(data) {
  28. for (var i = 0; i < data.length; i++) {
  29. if (parent == data[i].category_code) {
  30. parentInChinese = data[i].category_name;
  31. }
  32. for (var j = 0; j < data[i].children.length; j++) {
  33. if (type == data[i].children[j].component_code) {
  34. typeInChinese = data[i].children[j].component_name;
  35. }
  36. }
  37. }
  38. });
  39. </script>
  40. <style>
  41. .hide-image {
  42. display: none;
  43. }
  44. .preview:hover .hide-image {
  45. display: block;
  46. position: absolute;
  47. padding: 8px;
  48. }
  49. </style>
  50. </head>
  51. <body>
  52. <section class="body">
  53. <!-- start: header -->
  54. <header-menu></header-menu>
  55. <!-- end: header -->
  56. <div class="inner-wrapper">
  57. <!-- start: sidebar -->
  58. <side-bar></side-bar>
  59. <!-- end: sidebar -->
  60. <section role="main" class="content-body">
  61. <header class="page-header">
  62. <h2>{{pageHeader}}</h2>
  63. </header>
  64. <!-- start: page -->
  65. <section class="content-with-menu content-with-menu-has-toolbar media-gallery">
  66. <div class="content-with-menu-container">
  67. <inner-menu>
  68. <template v-slot:inner-equipment>
  69. <equipment-list></equipment-list>
  70. </template>
  71. </inner-menu>
  72. <div class="inner-body mg-main">
  73. <div class="inner-toolbar">
  74. <ul>
  75. <li>
  76. <label>
  77. <span id="insertComponentName" style="font-size: 30px; color: white;"></span>
  78. </label>
  79. </li>
  80. <li class="right">
  81. <a href="#" onclick="window.history.go(-1); return false;"><i class="fa fa-undo"></i> 返回</a>
  82. </li>
  83. <li class="right">
  84. <div style="cursor: pointer;" onclick="AddFavorite();"><i id="heart" class="fa fa-heart"></i><span id="favorite"> 加入清單</span></div>
  85. </li>
  86. </ul>
  87. </div>
  88. <div class="row">
  89. <div class="col-md-6">
  90. <div class="tabs">
  91. <ul class="nav nav-tabs nav-justified">
  92. <li class="active">
  93. <a href="#content" data-toggle="tab" class="text-center">3D元件模型</a>
  94. </li>
  95. <li>
  96. <a href="#2DImage" data-toggle="tab" class="text-center">2D圖例</a>
  97. </li>
  98. </ul>
  99. <div class="tab-content">
  100. <div id="content" class="tab-pane active" style="width:100%; position: relative; padding: 0 0 0;">
  101. </div>
  102. <div id="2DImage" class="tab-pane" style="overflow: auto;">
  103. </div>
  104. </div>
  105. </div>
  106. </div>
  107. <div class="col-md-6">
  108. <section class="panel">
  109. <div class="panel-body" style="padding: 0px;">
  110. <div class="table-responsive">
  111. <table class="table table-bordered mb-none">
  112. <tbody id="table">
  113. </tbody>
  114. </table>
  115. </div>
  116. </div>
  117. </section>
  118. <h3>尺寸:</h3>
  119. <section class="panel">
  120. <div class="panel-body" style="padding: 0px;">
  121. <div class="table-responsive">
  122. <table class="table table-bordered mb-none">
  123. <tbody id="sizeTable">
  124. </tbody>
  125. </table>
  126. </div>
  127. </div>
  128. </section>
  129. </div>
  130. </div>
  131. </div>
  132. </section>
  133. <!-- end: page -->
  134. </section>
  135. </div>
  136. </section>
  137. <script>
  138. /*Vue */
  139. vm.mount('.body');
  140. addUserImage(userName.charAt(0),role);
  141. </script>
  142. <?php include("bim-support-body.html"); ?>
  143. <script>
  144. $(document).ready(function() {
  145. $.ajax({
  146. url: "./script/php/equipment_group_detail.php",
  147. type: "GET",
  148. data: {
  149. type: typeInChinese,
  150. object: name,
  151. parent: parentInChinese
  152. },
  153. contentType: "application/json",
  154. dataType: "json"
  155. }).done(function(data) {
  156. header = data.header;
  157. value = data.value;
  158. sizeHeader = data.sizeHeader;
  159. sizeValue = data.sizeValue;
  160. for (var i = 0; i < header.length; i++) {
  161. if (value[i] == null)
  162. value[i] = "";
  163. if (header[i] == "元件版本")
  164. revitVersion = value[i];
  165. if (data.header[i] == "族群品類" || data.header[i] == "族群名稱" || data.header[i] == "類型名稱") {
  166. $('#table').append("<tr><td><div class='preview'>" + data.header[i] + "<img src='/Common/assets/images/" + data.header[i] + ".jpg' class='hide-image'></div></td><td><div>" + data.value[i] + "</div></td></tr>");
  167. } else {
  168. $('#table').append("<tr><td><div>" + data.header[i] + "</div></td><td><div>" + data.value[i] + "</div></td></tr>");
  169. }
  170. }
  171. for (var i = 0; i < sizeHeader.length; i++) {
  172. if (value[i] == null)
  173. value[i] = "";
  174. if (data.sizeHeader[i] != 0 && data.sizeValue[i] != 0) {
  175. $('#sizeTable').append("<tr><td>" + data.sizeHeader[i] + "</td><td>" + data.sizeValue[i] + "</td></tr>");
  176. } else
  177. $('#sizeTable').append("<tr><td>無資料</td><td>無資料</td></tr>");
  178. }
  179. $("#insertComponentName").text(name);
  180. $.ajax({
  181. url: "./assets/glb/Revit元件/Components/" + parentInChinese + "/" + typeInChinese + "/" + name + ".PNG",
  182. success: function() {
  183. $("#2DImage").append("<img src='./assets/glb/Revit元件/Components/" + parentInChinese + "/" + typeInChinese + "/" + name + ".PNG' style='width: 100%; aspect-ratio: 1 / 1;'>")
  184. },
  185. error: function() {
  186. $("#2DImage").append("<span>此元件沒有2D圖例</span>");
  187. }
  188. });
  189. }).error(function(error) {
  190. console.log(error.responseText);
  191. });
  192. $.ajax({
  193. url: "./script/php/addFavorite.php",
  194. type: "GET",
  195. data: {
  196. type: typeInChinese,
  197. object: name,
  198. },
  199. contentType: "application/json",
  200. dataType: "json"
  201. }).done(function(data) {
  202. isFavorite = data;
  203. if (isFavorite) {
  204. $("#heart").css("color", "Tomato");
  205. $("#favorite").html('移出清單');
  206. } else {
  207. $("#heart").css("color", "white");
  208. $("#favorite").html('加入清單');
  209. }
  210. }).error(function(error) {
  211. console.log(error.responseText);
  212. });
  213. });
  214. for (var i = 0; i < jsonData.length; i++) {
  215. for (var j = 0; j < jsonData[i].children.length; j++) {
  216. $("a").each(function() {
  217. if (jsonData[i].category_code == parent) {
  218. if (jsonData[i].children[j].component_code == type) {
  219. var searchText = jsonData[i].children[j].component_name;
  220. var found;
  221. if ($(this).context.innerText == searchText && $(this).context.name == jsonData[i].category_code) {
  222. $(this).context.classList.add("highlight");
  223. $(this).context.parentNode.parentNode.parentNode.classList.add("nav-expanded");
  224. }
  225. }
  226. }
  227. });
  228. }
  229. }
  230. function AddFavorite() {
  231. var stack_bar_top = {
  232. "dir1": "down",
  233. "dir2": "right",
  234. "push": "top",
  235. "spacing1": 0,
  236. "spacing2": 0
  237. };
  238. if (isFavorite) {
  239. $.ajax({
  240. url: "./script/php/addFavorite.php",
  241. type: "POST",
  242. data: {
  243. DelFavorite: parentInChinese + "/" + typeInChinese + "/" + name,
  244. username: userName
  245. }
  246. }).done(function(data) {
  247. var notice = new PNotify({
  248. title: '通知',
  249. text: '移出清單成功!',
  250. type: 'success',
  251. addclass: 'stack-bar-top',
  252. stack: stack_bar_top,
  253. width: "100%"
  254. });
  255. isFavorite = false;
  256. $("#heart").css("color", "white");
  257. $("#favorite").html('加入清單');
  258. }).error(function(error) {
  259. var notice = new PNotify({
  260. title: '通知',
  261. text: '移出清單失敗!',
  262. type: 'error',
  263. addclass: 'stack-bar-top',
  264. stack: stack_bar_top,
  265. width: "100%"
  266. });
  267. console.log(error);
  268. });
  269. } else {
  270. $.ajax({
  271. url: "./script/php/addFavorite.php",
  272. type: "POST",
  273. data: {
  274. AddFavorite: parentInChinese + "/" + typeInChinese + "/" + name,
  275. username: userName,
  276. revitVersion: revitVersion
  277. }
  278. }).done(function(data) {
  279. var notice = new PNotify({
  280. title: '通知',
  281. text: '加入清單成功!',
  282. type: 'success',
  283. addclass: 'stack-bar-top',
  284. stack: stack_bar_top,
  285. width: "100%"
  286. });
  287. isFavorite = true;
  288. $("#heart").css("color", "Tomato");
  289. $("#favorite").html('移出清單');
  290. }).error(function() {
  291. var notice = new PNotify({
  292. title: '通知',
  293. text: '加入清單失敗!',
  294. type: 'error',
  295. addclass: 'stack-bar-top',
  296. stack: stack_bar_top,
  297. width: "100%"
  298. });
  299. });
  300. }
  301. }
  302. </script>
  303. <!-- Vendor -->
  304. <script src="script/js/3Dpic-detail.js" type="module" async></script>
  305. </body>
  306. </html>