Nate
/
BIM-Resource


			
							123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210
							<?php
include($_SERVER['DOCUMENT_ROOT'] . "/Authorization/script/php/permission/check_right.php");
?>
<!doctype html>
<html class="fixed sidebar-left-collapsed">

<head>
	<?php include("bim-support-header.html"); ?>
	<script src="./script/js/global.js"></script>
	<script type="application/javascript">
		var rvtName = [];
		var categoryTable = [];
		var year = [];
		//當選擇大項時，需要展示所有'細項分類'內的元件
		var category = [];
		//現在的細項分類
		var type = "";
		//現在的大項分類
		var parent = "";

		var userName = "<?php echo $_SESSION['name'] ?>";
		var role = "<?php echo ($groupName); ?>";
		var right = <?php echo ($right); ?>;

		var url_href = window.location.href;
		var url = new URL(url_href);
		url.searchParams.get("type") == null ? type = "" : type = url.searchParams.get("type");
		parent = url.searchParams.get("parent");

		var $grid;

		pageHeader = "元件庫";
	</script>
</head>

<body>
	<canvas id="c"></canvas>
	<section class="body">
		<!-- start: header -->
		<header-menu></header-menu>
		<!-- end: header -->
		<div class="inner-wrapper">
			<!-- start: sidebar -->
			<side-bar></side-bar>
			<!-- end: sidebar -->
			<section role="main" class="content-body">
				<header class="page-header">
					<h2>{{pageHeader}}</h2>
				</header>
				<!-- start: page -->
				<section class="content-with-menu content-with-menu-has-toolbar media-gallery">
					<div class="content-with-menu-container">
						<inner-menu>
							<template v-slot:inner-equipment>
								<equipment-list></equipment-list>
							</template>
						</inner-menu>
						<div class="inner-body mg-main">
							<div class="inner-toolbar">
								<ul>
									<search-bar></search-bar>
									<filter-bar></filter-bar>
								</ul>
							</div>
							<filter-content></filter-content>
							<div class="row mg-files" data-sort-destination data-sort-id="media-gallery" id="content">
							</div>
						</div>
					</div>
				</section>
				<!-- end: page -->
			</section>
		</div>
	</section>
	<script>
		/*Vue */
		vm.mount('.body');
		addUserImage(userName.charAt(0), role);
	</script>

	<?php include("bim-support-body.html"); ?>
	<script type="application/javascript">
		$(function() {

			//撈現在類別內的元件
			$.ajax({
				url: "./script/php/equipment_group.php",
				type: "GET",
				data: {
					type: type,
					parent: parent
				},
				contentType: "application/json",
				dataType: "json"
			}).done(function(data) {
				year = data['year'];
				rvtName = data['rvtName'];
				category = data["category"];

				//一開始進入BIM元件庫顯示
				if (url.search == "") {
					$("#content").append("<h1 style='color: red;'>注意!BIM元件庫需配合BIM程式庫中的拖放元件API使用!</h1>");
					$("#content").append("<h3>請選擇左方類別以搜尋元件，搜尋到需要的元件請點擊加入清單按鈕</h3>");
					$("#content").append("<h3>到BIM程式庫下載拖放元件API，並參考操作方式以進行元件放置動作</h3>");
					$("#content").css("padding", "0");
					$("#content").css("text-align", "center");

					$("a").each(function() {
						if ($(this).context.name != "" && $(this).context.className == "menu-item" && $(this).context.name != parent) {
							//其他大項類別不要產生ul
							$(this).closest("ul").remove();
						}
					});

				} else {
					$.when(initThreeJS()).then(function() {

						$grid = $("#content").isotope({
							itemSelector: ".isotope-item",
							layoutMode: 'fitRows'
						});

						//若選到細項，該細項內沒有元件檔案
						if ($("#content").children().length == 0) {
							$("#content").append("<h3>此類別沒有元件檔案</h3>");
							$("#content").css("padding", "0");
							$("#content").css("text-align", "center");
						}

					}).then(function() {

						//元件有時候會不排版
						setTimeout(function() {
							$grid.isotope()
						}, 100);

					});
				}

			}).error(function(error) {
				console.log(error);
			});

			$.ajax({
				url: "./script/php/equipment_revitVersion.php",
				type: "GET",
				data: {
					type: type,
					parent: parent
				},
				contentType: "application/json",
				dataType: "json"
			}).done(function(data) {

				//篩選內元件版本
				for (var i = 0; i < data.length; i++) {
					$("#revitVersion").append('<label><input type="checkbox" value=".' + data[i] + '" />   ' + data[i] + '</label> ');
				}

			}).error(function(error) {
				console.log(error);
			});

			//被選到的類別highlight起來
			for (var i = 0; i < jsonData.length; i++) {
				for (var j = 0; j < jsonData[i].children.length; j++) {
					$("a").each(function() {

						if (jsonData[i].category_name == parent) {
							//選到的是細項類別
							if (jsonData[i].children[j].component_name == type) {
								var searchText = jsonData[i].children[j].component_name;
								var found;

								if ($(this).context.innerText == searchText && $(this).context.name == jsonData[i].category_name) {
									$(this).context.classList.add("highlight");
									$(this).context.parentNode.parentNode.parentNode.classList.add("nav-expanded");
								}
								//選到的是大項類別
							} else if (type == "") {
								var searchText = parent;
								var found;
								if ($(this).context.innerText == searchText && $(this).context.name == jsonData[i].category_name) {
									if (!$(this).context.classList.contains("highlight")) {
										$(this).context.classList.add("highlight");
										$(this).context.setAttribute("style", "background: #0088cc");
									} else {
										$(this).context.removeAttribute("href");
									}
								} else if ($(this).context.name != "" && $(this).context.className == "menu-item" && $(this).context.name != parent) {
									//其他大項類別不要產生ul
									$(this).closest("ul").remove();
								}

							}
						}
					});
				}
			}


		});
	</script>
	<script src="./script/js/data-sort.js"></script>
	<script src="script/js/3Dpic.js" type="module"></script>

</body>

</html>