iPortalPublishData.html 16 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363
  1. <!--********************************************************************
  2. * Copyright© 2000 - 2021 SuperMap Software Co.Ltd. All rights reserved.
  3. *********************************************************************-->
  4. <!DOCTYPE html>
  5. <html lang="en">
  6. <head>
  7. <meta charset="UTF-8">
  8. <title data-i18n="resources.text_publish_data"></title>
  9. <style>
  10. .gallery-item {
  11. margin-bottom: 30px;
  12. }
  13. .gallery-item-border {
  14. border: 1px solid #dadada;
  15. -webkit-box-shadow: 0px 2px 3px #dcdcdc;
  16. box-shadow: 0px 2px 3px #dcdcdc;
  17. background: white;
  18. }
  19. .thumbnail > img, .thumbnail a > img {
  20. margin-right: auto;
  21. margin-left: auto;
  22. }
  23. .gallery-item-img {
  24. height: 170px !important;
  25. width: 262px !important;
  26. }
  27. .resourcesDetails {
  28. margin: 0px 0 12px 10px;
  29. height: 21px;
  30. overflow: hidden;
  31. text-overflow: ellipsis;
  32. white-space: nowrap;
  33. font-size: 14px !important;
  34. color: #7c7c7c;
  35. }
  36. .textEllipsis {
  37. display: inline-block;
  38. padding-left: 10px;
  39. padding-top: 12px;
  40. padding-bottom: 12px;
  41. vertical-align: top;
  42. overflow: hidden;
  43. text-overflow: ellipsis;
  44. white-space: nowrap;
  45. }
  46. .resourcesBottomList {
  47. padding-left: 10px;
  48. padding-top: 13px;
  49. padding-bottom: 12px;
  50. vertical-align: top;
  51. float: right;
  52. padding-right: 30px;
  53. border-left: 1px solid #ececec;
  54. }
  55. .publish-data-hdfs,.publish-data-hbase,.publish-data-excel,.publish-data-csv,.publish-data-geojson,.publish-data-json{
  56. display: none;
  57. }
  58. .margin10 {
  59. margin-right: 10px!important;
  60. }
  61. .checkbox-title.disabled {
  62. color: #bcbcbc;
  63. }
  64. .custom-checkbox.disabled {
  65. cursor: default !important;
  66. }
  67. .view-service {
  68. border-bottom:1px solid #ccc;
  69. }
  70. .view-service:last-child {
  71. border: none;
  72. }
  73. .view-service p:nth-child(1) {
  74. margin-top:10px;
  75. }
  76. .view-service a {
  77. display:block;
  78. margin-bottom:10px;
  79. }
  80. </style>
  81. </head>
  82. <body style=" margin: 0;overflow: auto;background: #F2F2F2;width: 100%;height:100%;position: absolute;top: 0;">
  83. <div class="container" style="margin-bottom: 100px">
  84. <div class="page-header">
  85. <h4 data-i18n="resources.text_publish_data"></h4>
  86. </div>
  87. <br />
  88. <!-- 发布数据服务模态框 -->
  89. <div class="modal fade" tabindex="-1" id="publishModal" role="dialog" data-backdrop="static" data-keyboard="false" >
  90. <div class="modal-dialog">
  91. <div class="modal-content">
  92. <div class="modal-header">
  93. <button type="button" class="close" data-dismiss="modal" aria-hidden="true">
  94. &times;
  95. </button>
  96. <h4 class="modal-title" id="myModalLabel" data-i18n="resources.text_publish_data"></h4>
  97. </div>
  98. <table class="table table-bordered col-md-6">
  99. <tbody>
  100. <tr>
  101. <td>
  102. <div class="col-md-10 col-md-offset-1">
  103. <p data-i18n="resources.text_publish_message"></p>
  104. <div id="serviceType">
  105. </div>
  106. </div>
  107. </td>
  108. </tr>
  109. </tbody>
  110. </table>
  111. <div class="modal-footer">
  112. <button type="button" class="btn btn-default" data-dismiss="modal" data-i18n="resources.text_close">
  113. </button>
  114. <button type="button" class="btn btn-primary" onclick="publishDataEvent()" data-i18n="resources.text_confirm">
  115. </button>
  116. </div>
  117. </div><!-- /.modal-content -->
  118. </div><!-- /.modal -->
  119. </div>
  120. <div class="col-md-10">
  121. <div class="row">
  122. <div class="col-md-12">
  123. <!--所有资源的承载DIV-->
  124. <div class="row" id="resourcesList">
  125. <!--单个资源数据的可视化承载DIV 添加在此位置中-->
  126. </div>
  127. </div>
  128. </div>
  129. </div>
  130. </div>
  131. <script type="text/javascript" include="jquery,bootstrap-css,bootstrap,widgets" src="../js/include-web.js"></script>
  132. <script type="text/javascript" src="../../dist/leaflet/include-leaflet.js"></script>
  133. <script>
  134. //iportal的URL地址 或根据情况添加自己的本地iportal地址:http://localhost:8190/iportal
  135. var iPortalUrl = "https://iportal.supermap.io/iportal";
  136. var token = "MFEKl8kVmkvEDrDFcgnjodlPCudIO83mBSwvdjiUlWNnySGD-FCEyYEk4CsY2WnSCujfAs8HI0ZkSL6Vxa-njg..";
  137. var queryParams = new SuperMap.iPortalQueryParam({
  138. resourceType: "DATA",
  139. pageSize: 12,
  140. currentPage: 1,
  141. orderBy: "UPDATETIME",
  142. orderType: "DESC",
  143. searchType:'MY_RES'
  144. });
  145. //资源查询初始化工作
  146. var iPortal = new SuperMap.iPortal(iPortalUrl);
  147. $(document).ready(function () {
  148. generatePortalToken();
  149. });
  150. var publishDataId,serviceType;
  151. // 申请,注册token并查询
  152. function generatePortalToken() {
  153. var serverInfo = new SuperMap.ServerInfo(SuperMap.ServerType.IPORTAL, {
  154. server: iPortalUrl
  155. });
  156. SuperMap.SecurityManager.registerServers([serverInfo]);
  157. SuperMap.SecurityManager.destroyToken(iPortalUrl);
  158. SuperMap.SecurityManager.registerToken(iPortalUrl, token);
  159. //加载完DOM后,开始资源数据查询并添加
  160. iPortal = new SuperMap.iPortal(iPortalUrl);
  161. queryResouces(queryParams);
  162. }
  163. // 查询iPortal中的资源
  164. function queryResouces(queryParams) {
  165. iPortal.queryResources(queryParams).then(function (resourcesReslut) {
  166. //返回的结果集,需要查看可打开下行代码
  167. // console.log(resourcesReslut);
  168. $("#resourcesList").children().remove();
  169. //将结果集进行遍历,并添加到HTML中
  170. $.each(resourcesReslut.content, function (i) {
  171. var resourceItem = resourcesReslut.content[i];
  172. //解析时间戳,可根据需求自行处理
  173. var updateTime = new Date(parseInt(resourceItem.updateTime)).toLocaleString();
  174. var thumbnail = resourceItem.thumbnail;
  175. // 此判断获取部分相对路径的default图片
  176. if(thumbnail.indexOf("./") === 0){
  177. thumbnail = iPortalUrl + thumbnail.replace("./","/");
  178. }
  179. var resourcesDOM = $("<div class='col-md-4 gallery-item'>" +
  180. "<div class='gallery-item-border'>" +
  181. "<a class='thumbnail' style='margin-bottom: 10px'>" +
  182. "<img class='gallery-item-img' src='" + thumbnail + "' alt=''>" +
  183. "</a>" +
  184. "<div>" +
  185. "<div style='height:68px'>"+
  186. "<div style='display:flex'>"+
  187. "<p class='resourcesDetails' style='flex: 1 1 auto'>" + resourceItem.name + "</p>" +
  188. "<p style='flex: 1 1 auto;text-align:right;margin-right:13px'>"+resourceItem.resourceSubType+"</p>"+
  189. "</div>"+
  190. "<a style='margin-left:10px;' class='publish-data-"+resourceItem.resourceSubType.toLowerCase() +"' onclick='publishDataService("+resourceItem.resourceId+")'>"+resources.text_publish_data+"</a>" +
  191. "<a tabindex='"+i+"'data-animation='true' data-html='true' id='content"+i+"' data-trigger='focus' data-container='body' data-content='无' data-toggle='popover' data-placement='bottom' style='margin-right:12px;float:right;' class='publish-data-"+resourceItem.resourceSubType.toLowerCase() +"' onclick='showPublishedDataService("+resourceItem.resourceId+","+i+")'>"+resources.text_view_service+"</a>" +
  192. "</div>"+
  193. "</div>")
  194. $("#resourcesList").append(resourcesDOM);
  195. });
  196. })
  197. };
  198. function publishDataService(dataId){
  199. publishDataId = dataId;
  200. $('#publishModal').modal('show');
  201. $("#serviceType").empty();
  202. var items = new SuperMap.iPortalResource(iPortalUrl,{resourceId:dataId,resourceType:"DATA"});
  203. items.load().then(()=>{
  204. var item = items.sourceJSON;
  205. switch (item.type) {
  206. case "WORKSPACE":
  207. var publishDataDom = $(
  208. "<div id='mapTypeLine'>"+
  209. "<input id='map' class='margin10' type='checkbox' value='RESTMAP'>"+
  210. "<label class='checkbox-title' for='map'>RESTMAP</label>"+
  211. "</div>"+
  212. "<div id='dataTypeLine'>"+
  213. "<input id='data' class='margin10' type='checkbox' value='RESTDATA'>"+
  214. "<label class='checkbox-title' for='data'>RESTDATA</label>"+
  215. "</div>"+
  216. "<div id='realspaceTypeLine'>"+
  217. "<input id='realspace' class='margin10' type='checkbox' value='RESTREALSPACE'>"+
  218. "<label class='checkbox-title' for='realspace'>RESTREALSPACE</label>"+
  219. "</div>"+
  220. "<div id='spatialAnalystTypeLine'>"+
  221. "<input id='spatialAnalyst' class='margin10' type='checkbox' value='RESTSPATIALANALYST'>"+
  222. "<label class='checkbox-title' for='spatialAnalyst'>RESTSPATIALANALYST</label>"+
  223. "</div>"
  224. )
  225. $("#serviceType").append(publishDataDom);
  226. break;
  227. case 'UDB':
  228. var publishDataDom = $(
  229. "<div id='dataTypeLine'>"+
  230. "<input id='data' class='margin10' type='checkbox' value='RESTDATA'>"+
  231. "<label class='checkbox-title' for='data'>RESTDATA</label>"+
  232. "</div>")
  233. $("#serviceType").append(publishDataDom);
  234. break;
  235. case 'SHP':
  236. case 'EXCEL':
  237. case 'CSV':
  238. case 'GEOJSON':
  239. var publishDataDom = $(
  240. "<div id='mapTypeLine'>"+
  241. "<input id='map' class='margin10' type='checkbox' value='RESTMAP'>"+
  242. "<label class='checkbox-title' for='map'>RESTMAP</label>"+
  243. "</div>"+
  244. "<div id='dataTypeLine'>"+
  245. "<input id='data' class='margin10' type='checkbox' value='RESTDATA'>"+
  246. "<label class='checkbox-title' for='data'>RESTDATA</label>"+
  247. "</div>")
  248. $("#serviceType").append(publishDataDom);
  249. break;
  250. case 'SMTILES':
  251. case 'SVTILES':
  252. case 'MBTILES':
  253. case 'TPK':
  254. case 'UGCV5':
  255. case 'UGCV5_MVT':
  256. var publishDataDom = $(
  257. "<div id='mapTypeLine'>"+
  258. "<input id='map' class='margin10' type='checkbox' value='RESTMAP'>"+
  259. "<label class='checkbox-title' for='map'>RESTMAP</label>"+
  260. "</div>")
  261. $("#serviceType").append(publishDataDom);
  262. break;
  263. }
  264. var precheckInfos = item.dataItemServices;
  265. if(!precheckInfos) {
  266. return;
  267. }
  268. $.each(precheckInfos, function (key, value) {
  269. if (value.serviceType === "RESTMAP") {
  270. refreshPublishContent("mapTypeLine");
  271. } else if (value.serviceType === "RESTDATA") {
  272. refreshPublishContent("dataTypeLine");
  273. } else if (value.serviceType === "RESTREALSPACE") {
  274. refreshPublishContent("realspaceTypeLine");
  275. } else if (value.serviceType === "RESTSPATIALANALYST") {
  276. refreshPublishContent("spatialAnalystTypeLine");
  277. }
  278. });
  279. });
  280. }
  281. function refreshPublishContent(publishTypeId){
  282. $("#" + publishTypeId + " :checkbox").attr("disabled", true);
  283. $("#" + publishTypeId + " :checkbox").addClass("disabled");
  284. $("#" + publishTypeId + " .checkbox-title").addClass("disabled");
  285. $("#" + publishTypeId + " .checkbox-title").attr("title",resources.msg_published);
  286. }
  287. function publishDataEvent(){
  288. if (checkPublishParam()) {
  289. publishOrUnpublishEvent(publishDataId, null, true);
  290. }
  291. $("#publishModal").modal("hide");
  292. }
  293. function publishOrUnpublishEvent(dataId, dataServiceId, forPublish){
  294. var options = {
  295. dataId:dataId,
  296. serviceType:serviceType,
  297. dataServiceId:dataServiceId
  298. }
  299. new SuperMap.iPortalUser(iPortalUrl).publishDataService(options,forPublish).then(res=>{
  300. var serviceIdList = res.split(",");
  301. for (var i = 0; i < serviceIdList.length; i++) {
  302. new SuperMap.iPortalUser(iPortalUrl).getDataPublishedStatus(dataId,serviceIdList[i]).then(res=>{
  303. if(res.succeed){
  304. widgets.alert.showAlert(resources.msg_publish_success, true);
  305. }else {
  306. widgets.alert.showAlert(resources.msg_publish_failed, false);
  307. }
  308. })
  309. }
  310. })
  311. }
  312. function checkPublishParam() {
  313. var checkBoxList = $("#publishModal :checkbox");
  314. var serviceTypes = "";
  315. checkBoxList.each(function () {
  316. if (this.checked) {
  317. serviceTypes += $(this).val() + ",";
  318. }
  319. });
  320. if (serviceTypes.length > 0) {
  321. serviceType = serviceTypes.substr(0, serviceTypes.length - 1);
  322. return true;
  323. }
  324. return false;
  325. }
  326. function showPublishedDataService(id,index) {
  327. var items = new SuperMap.iPortalResource(iPortalUrl,{resourceId:id,resourceType:"DATA"});
  328. items.load().then(()=>{
  329. var template = "";
  330. if(items.sourceJSON.dataItemServices.length) {
  331. $.each(items.sourceJSON.dataItemServices,function(i){
  332. var option = {
  333. dataId:id,
  334. serviceType:items.sourceJSON.dataItemServices[i].serviceType,
  335. dataServiceId:items.sourceJSON.dataItemServices[i].serviceName
  336. }
  337. var msg = items.sourceJSON.dataItemServices[i].serviceStatus==='PUBLISHED'?resources.msg_publish_success:resources.msg_publish_failed
  338. template+="<div class='view-service'><p>"+resources.text_service_name+":"+items.sourceJSON.dataItemServices[i].serviceName+"</p><p>"+resources.text_service_type+":"+items.sourceJSON.dataItemServices[i].serviceType+"</p><p>"+resources.text_service_status+":"+msg+"</p><a onclick='unPublishData("+JSON.stringify(option)+")'>"+resources.text_unpublish_service+"</a></div>"
  339. })
  340. $("#content"+index).attr('data-content', template);
  341. $("#content"+index).popover("show");
  342. }else {
  343. $("#content"+index).popover("show");
  344. }
  345. })
  346. }
  347. //取消发布
  348. function unPublishData(option){
  349. new SuperMap.iPortalUser(iPortalUrl).unPublishDataService(option).then(res=>{
  350. if(res.succeed) {
  351. widgets.alert.showAlert(resources.msg_unpublish_success, true);
  352. }else {
  353. widgets.alert.showAlert(resources.msg_unpublish_failed, false);
  354. }
  355. })
  356. }
  357. </script>
  358. </body>
  359. </html>