list.html 9.5 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211
  1. <!-- start: PAGE TITLE -->
  2. <section id="page-title">
  3. <div class="row">
  4. <div class="col-sm-8">
  5. <h1 class="mainTitle" translate="sidebar.nav.configuremanagerdb.LIST">{{ mainTitle }}</h1>
  6. <span class="mainDescription" translate="sidebar.nav.configuremanagerdb.LISTDesc">A type of data structure in which each element is attached to one or more elements directly beneath it. The connections between elements are called branches. <small class="block">Webopedia - Online Tech Dictionary for IT Professionals</small></span>
  7. </div>
  8. <!-- <div ncy-breadcrumb></div> -->
  9. </div>
  10. </section>
  11. <!-- end: PAGE TITLE -->
  12. <!-- start: BOOTSRAP NAV TREE -->
  13. <div class="container-fluid container-fullw bg-white">
  14. <div class="row" ng-controller="cmdbListCtrl">
  15. <div class="col-md-4 col-sm-2">
  16. <a class="btn btn-wide btn-blue" ng-click="download()"><span translate="sidebar.nav.configuremanagerdb.LISTButton.DOWNLOADTEMP">Download Template File</span><i class="fa fa-download fa fa-white"></i></a>
  17. <a class="btn btn-wide btn-green" ng-click="export()" ladda="ldloading.expand_right" ng-disabled="!(ciclassify&&ciclassify.children.length==0)"><span translate="sidebar.nav.configuremanagerdb.LISTButton.EXPORT">Export Data</span><i class="fa fa-cloud-download fa-white"></i></a>
  18. <input type="file" nv-file-select="" uploader="importUploader"/>
  19. <a class="btn btn-wide btn-primary" ladda="ldloading.expand" ng-disabled="!(ciclassify&&ciclassify.children.length==0&&importUploader.getNotUploadedItems().length>0)" ng-click="import()" ><span translate="sidebar.nav.configuremanagerdb.LISTButton.IMPORT">Import Data</span><i class="fa fa-cloud-upload"></i></a>
  20. <h5 class="over-title margin-bottom-15"><span class="text-bold" translate="sidebar.nav.configuremanagerdb.plist.MANAGER">CI Manager</span></h5>
  21. <p translate="sidebar.nav.configuremanagerdb.plist.MANAGERDesc">
  22. This is a Tree directive for Angular JS apps that use Bootstrap CSS.
  23. </p>
  24. <div>
  25. <div class="row">
  26. <!-- /// cmdb ci classic /// -->
  27. <!-- <div class="col-md-4 col-sm-2"> -->
  28. <div class="panel panel-white">
  29. <div class="panel-header">
  30. <h5 translate="sidebar.nav.configuremanagerdb.plist.CLASSIC">CI Classic</h5>
  31. </div>
  32. <div class="panel-body">
  33. <div class="box-tree">
  34. <span ng-if="doing_async">...loading...</span>
  35. <abn-tree tree-data="my_data" tree-control="my_tree" on-select="my_tree_handler(branch)" expand-level="2" initial-selection="Granny Smith" icon-leaf="ti-file" icon-expand="ti-plus" icon-collapse="ti-minus"></abn-tree>
  36. </div>
  37. </div>
  38. </div>
  39. <div class="alert alert-warning">
  40. {{ output }}
  41. </div>
  42. <!-- </div> -->
  43. <!-- /// cmdb ci list by classic /// -->
  44. <!--div class="col-md-4 col-sm-6">
  45. <button ng-click="try_changing_the_tree_data()" class="btn btn-primary btn-o margin-bottom-15">
  46. Change The Tree Definition
  47. </button>
  48. <br>
  49. <button ng-click="try_async_load()" class="btn btn-primary btn-o">
  50. Load Tree Data Asynchronously
  51. </button>
  52. <hr>
  53. <h5>Test the Tree Control API:</h5>
  54. <br>
  55. <button ng-click="my_tree.select_first_branch()" class="btn btn-primary btn-sm margin-bottom-10">
  56. First Branch
  57. </button>
  58. <br>
  59. <button ng-click="my_tree.select_next_sibling()" class="btn btn-primary btn-sm margin-bottom-10">
  60. Next Sibling
  61. </button>
  62. <button ng-click="my_tree.select_prev_sibling()" class="btn btn-primary btn-sm margin-bottom-10">
  63. Prev Sibling
  64. </button>
  65. <br>
  66. <button ng-click="my_tree.select_next_branch()" class="btn btn-primary btn-sm margin-bottom-10">
  67. Next Branch
  68. </button>
  69. <button ng-click="my_tree.select_prev_branch()" class="btn btn-primary btn-sm margin-bottom-10">
  70. Prev Branch
  71. </button>
  72. <br>
  73. <button ng-click="my_tree.select_parent_branch()" class="btn btn-primary btn-sm margin-bottom-10">
  74. Parent
  75. </button>
  76. <hr>
  77. <button ng-click="my_tree.expand_branch()" class="btn btn-primary btn-sm margin-bottom-10">
  78. Expand
  79. </button>
  80. <button ng-click="my_tree.collapse_branch()" class="btn btn-primary btn-sm margin-bottom-10">
  81. Collapse
  82. </button>
  83. <button ng-click="my_tree.expand_all()" class="btn btn-primary btn-sm margin-bottom-10">
  84. Expand All
  85. </button>
  86. <button ng-click="my_tree.collapse_all()" class="btn btn-primary btn-sm margin-bottom-10">
  87. Collapse All
  88. </button>
  89. <hr>
  90. <button ng-click="try_adding_a_branch()" class="btn btn-primary btn-sm margin-bottom-10">
  91. Add Branch
  92. </button>
  93. ui-grid-cellNav ui-grid-resize-columns ui-grid-pinning ui-grid-selection ui-grid-move-columns
  94. </div-->
  95. </div>
  96. </div>
  97. </div>
  98. <div class="col-md-8 col-sm-4">
  99. <div class="col-md-12">
  100. <div id="grid1" ui-grid="gridOptions" ui-grid-pagination ui-grid-selection ui-grid-resize-columns ui-grid-move-columns external-scopes="$scope" class="grid"></div>
  101. </div>
  102. <div class="col-md-12">
  103. <form ng-submit="vm.submit(vm.model,'gray')" >
  104. <tabset>
  105. <tab ng-repeat="tab in vm.tabs"
  106. heading="{{tab.title}}"
  107. active="tab.active"
  108. disable="tab.disabled">
  109. <formly-form model="tab.form.model" fields="tab.form.fields" form="vm.form" options="tab.form.options">
  110. </formly-form>
  111. </tab>
  112. <tab heading="保存">
  113. <div class="col-xs-12 margin-top-30 margin-bottom-30">
  114. <button type="submit" ladda="ldloading.gray" ng-disabled="!vm.form.$$parentForm.$valid" class="col-md-offset-8 btn btn-primary"><span translate="form.button.SUBMIT">Submit</span></button>
  115. <a ladda="ldloading.gray" class="btn btn-danger" data-style="expand-right" data-spinner-color="#999999" ng-click="vm.remove(vm.model,'gray')">
  116. <span translate="form.button.REMOVE">DELETE</span>
  117. </a>
  118. <!--button type="button" ladda="ldloading.sm" class="margin-left-5 btn btn-default" ng-click="vm.options.resetModel()" translate="form.button.RESET">Reset</button-->
  119. </div>
  120. </tab>
  121. </tabset>
  122. </form>
  123. </div>
  124. </div>
  125. <!--div class="col-md-12">
  126. <h5 class="over-title margin-bottom-15"><span class="text-bold" translate="sidebar.nav.configuremanagerdb.plist.MANAGER">CI Manager</span></h5>
  127. <p translate="sidebar.nav.configuremanagerdb.plist.MANAGERDesc">
  128. This is a Tree directive for Angular JS apps that use Bootstrap CSS.
  129. </p>
  130. <div ng-controller="cmdbListCtrl">
  131. <div class="row">
  132. <div class="col-md-4 col-sm-2">
  133. <div class="panel panel-white">
  134. <div class="panel-header">
  135. <h5 translate="sidebar.nav.configuremanagerdb.plist.CLASSIC">CI Classic</h5>
  136. </div>
  137. <div class="panel-body">
  138. <div class="box-tree">
  139. <span ng-if="doing_async">...loading...</span>
  140. <abn-tree tree-data="my_data" tree-control="my_tree" on-select="my_tree_handler(branch)" expand-level="2" initial-selection="Granny Smith" icon-leaf="ti-file" icon-expand="ti-plus" icon-collapse="ti-minus"></abn-tree>
  141. </div>
  142. </div>
  143. </div>
  144. <div class="alert alert-warning">
  145. {{ output }}
  146. </div>
  147. </div>
  148. <div class="col-md-8 col-sm-4">
  149. <div id="grid1" ui-grid="gridOptions" ui-grid-pagination external-scopes="$scope" ui-grid-cellNav ui-grid-resize-columns ui-grid-pinning ui-grid-selection ui-grid-move-columns ui-grid-exporter ui-grid-grouping class="grid"></div>
  150. </div>
  151. <div class="col-md-4 col-sm-6">
  152. <button ng-click="try_changing_the_tree_data()" class="btn btn-primary btn-o margin-bottom-15">
  153. Change The Tree Definition
  154. </button>
  155. <br>
  156. <button ng-click="try_async_load()" class="btn btn-primary btn-o">
  157. Load Tree Data Asynchronously
  158. </button>
  159. <hr>
  160. <h5>Test the Tree Control API:</h5>
  161. <br>
  162. <button ng-click="my_tree.select_first_branch()" class="btn btn-primary btn-sm margin-bottom-10">
  163. First Branch
  164. </button>
  165. <br>
  166. <button ng-click="my_tree.select_next_sibling()" class="btn btn-primary btn-sm margin-bottom-10">
  167. Next Sibling
  168. </button>
  169. <button ng-click="my_tree.select_prev_sibling()" class="btn btn-primary btn-sm margin-bottom-10">
  170. Prev Sibling
  171. </button>
  172. <br>
  173. <button ng-click="my_tree.select_next_branch()" class="btn btn-primary btn-sm margin-bottom-10">
  174. Next Branch
  175. </button>
  176. <button ng-click="my_tree.select_prev_branch()" class="btn btn-primary btn-sm margin-bottom-10">
  177. Prev Branch
  178. </button>
  179. <br>
  180. <button ng-click="my_tree.select_parent_branch()" class="btn btn-primary btn-sm margin-bottom-10">
  181. Parent
  182. </button>
  183. <hr>
  184. <button ng-click="my_tree.expand_branch()" class="btn btn-primary btn-sm margin-bottom-10">
  185. Expand
  186. </button>
  187. <button ng-click="my_tree.collapse_branch()" class="btn btn-primary btn-sm margin-bottom-10">
  188. Collapse
  189. </button>
  190. <button ng-click="my_tree.expand_all()" class="btn btn-primary btn-sm margin-bottom-10">
  191. Expand All
  192. </button>
  193. <button ng-click="my_tree.collapse_all()" class="btn btn-primary btn-sm margin-bottom-10">
  194. Collapse All
  195. </button>
  196. <hr>
  197. <button ng-click="try_adding_a_branch()" class="btn btn-primary btn-sm margin-bottom-10">
  198. Add Branch
  199. </button>
  200. </div>
  201. </div>
  202. </div>
  203. </div>-->
  204. </div>
  205. </div>
  206. <!-- end: BOOTSRAP NAV TREE -->