Dashboard sipadu mbip
Du kan inte välja fler än 25 ämnen Ämnen måste starta med en bokstav eller siffra, kan innehålla bindestreck ('-') och vara max 35 tecken långa.

user-profile.js 12KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341
  1. 'use strict';
  2. $(document).ready(function() {
  3. $(window).on('resize', function() {
  4. dashboardEcharts();
  5. });
  6. $(window).on('load', function() {
  7. dashboardEcharts();
  8. });
  9. $("a[data-toggle=\"tab\"]").on("shown.bs.tab", function(e) {
  10. dashboardEcharts();
  11. });
  12. //line chart
  13. function dashboardEcharts() {
  14. /*line chart*/
  15. var myChart = echarts.init(document.getElementById('main'));
  16. var option = {
  17. tooltip: {
  18. trigger: 'item',
  19. formatter: function(params) {
  20. var date = new Date(params.value[0]);
  21. var data = date.getFullYear() + '-' + (date.getMonth() + 1) + '-' + date.getDate() + ' ' + date.getHours() + ':' + date.getMinutes();
  22. return data + '<br/>' + params.value[1] + ', ' + params.value[2];
  23. },
  24. responsive: true
  25. },
  26. dataZoom: {
  27. show: true,
  28. start: 70
  29. },
  30. legend: {
  31. data: ['Profit']
  32. },
  33. grid: {
  34. y2: 80
  35. },
  36. xAxis: [{
  37. type: 'time',
  38. splitNumber: 10
  39. }],
  40. yAxis: [{
  41. type: 'value'
  42. }],
  43. series: [{
  44. name: 'Profit',
  45. type: 'line',
  46. showAllSymbol: true,
  47. symbolSize: function(value) {
  48. return Math.round(value[2] / 10) + 2;
  49. },
  50. data: (function() {
  51. var d = [];
  52. var len = 0;
  53. var now = new Date();
  54. var value;
  55. while (len++ < 200) {
  56. d.push([
  57. new Date(2014, 9, 1, 0, len * 10000),
  58. (Math.random() * 30).toFixed(2) - 0,
  59. (Math.random() * 100).toFixed(2) - 0
  60. ]);
  61. }
  62. return d;
  63. })()
  64. }]
  65. };
  66. myChart.setOption(option);
  67. }
  68. //for responsive all datatable
  69. $(".theme-loader").animate({
  70. opacity: "0"
  71. },1000);
  72. setTimeout(function() {
  73. $(".theme-loader").remove();
  74. }, 1000);
  75. $('#simpletable').DataTable({
  76. "paging": true,
  77. "ordering": true,
  78. "bLengthChange": true,
  79. "info": true,
  80. "searching": true
  81. });
  82. //
  83. // $("a[data-toggle=\"tab\"]").on("shown.bs.tab", function(e) {
  84. // $($.fn.dataTable.tables(true)).DataTable().columns.adjust();
  85. // });
  86. // Edit information of user-profile
  87. $('#edit-cancel').on('click', function() {
  88. var c = $('#edit-btn').find("i");
  89. c.removeClass('icofont-close');
  90. c.addClass('icofont-edit');
  91. $('.view-info').show();
  92. $('.edit-info').hide();
  93. });
  94. $('.edit-info').hide();
  95. $('#edit-btn').on('click', function() {
  96. var b = $(this).find("i");
  97. var edit_class = b.attr('class');
  98. if (edit_class == 'icofont icofont-edit') {
  99. b.removeClass('icofont-edit');
  100. b.addClass('icofont-close');
  101. $('.view-info').hide();
  102. $('.edit-info').show();
  103. } else {
  104. b.removeClass('icofont-close');
  105. b.addClass('icofont-edit');
  106. $('.view-info').show();
  107. $('.edit-info').hide();
  108. }
  109. });
  110. //check editor js
  111. CKEDITOR.replace('description', {
  112. // Define the toolbar: http://docs.ckeditor.com/#!/guide/dev_toolbar
  113. // The standard preset from CDN which we used as a base provides more features than we need.
  114. // Also by default it comes with a 2-line toolbar. Here we put all buttons in a single row.
  115. toolbar: [{
  116. name: 'clipboard',
  117. items: ['Undo', 'Redo']
  118. }, {
  119. name: 'styles',
  120. items: ['Styles', 'Format']
  121. }, {
  122. name: 'basicstyles',
  123. items: ['Bold', 'Italic', 'Strike', '-', 'RemoveFormat']
  124. }, {
  125. name: 'paragraph',
  126. items: ['NumberedList', 'BulletedList', '-', 'Outdent', 'Indent', '-', 'Blockquote']
  127. }, {
  128. name: 'links',
  129. items: ['Link', 'Unlink']
  130. }, {
  131. name: 'insert',
  132. items: ['Image', 'EmbedSemantic', 'Table']
  133. }, {
  134. name: 'tools',
  135. items: ['Maximize']
  136. }, {
  137. name: 'editing',
  138. items: ['Scayt']
  139. }],
  140. // Since we define all configuration options here, let's instruct CKEditor to not load config.js which it does by default.
  141. // One HTTP request less will result in a faster startup time.
  142. // For more information check http://docs.ckeditor.com/#!/api/CKEDITOR.config-cfg-customConfig
  143. customConfig: '',
  144. // Enabling extra plugins, available in the standard-all preset: http://ckeditor.com/presets-all
  145. extraPlugins: 'autoembed,embedsemantic,image2,uploadimage,uploadfile',
  146. imageUploadUrl: '/uploader/upload.php?type=Images',
  147. uploadUrl: '/uploader/upload.php',
  148. /*********************** File management support ***********************/
  149. // In order to turn on support for file uploads, CKEditor has to be configured to use some server side
  150. // solution with file upload/management capabilities, like for example CKFinder.
  151. // For more information see http://docs.ckeditor.com/#!/guide/dev_ckfinder_integration
  152. // Uncomment and correct these lines after you setup your local CKFinder instance.
  153. // filebrowserBrowseUrl: 'http://example.com/ckfinder/ckfinder.html',
  154. // filebrowserUploadUrl: 'http://example.com/ckfinder/core/connector/php/connector.php?command=QuickUpload&type=Files',
  155. /*********************** File management support ***********************/
  156. // Remove the default image plugin because image2, which offers captions for images, was enabled above.
  157. removePlugins: 'image',
  158. // Make the editing area bigger than default.
  159. height: 400,
  160. // This is optional, but will let us define multiple different styles for multiple editors using the same CSS file.
  161. bodyClass: 'article-editor',
  162. // Reduce the list of block elements listed in the Format dropdown to the most commonly used.
  163. format_tags: 'p;h1;h2;h3;pre',
  164. // Simplify the Image and Link dialog windows. The "Advanced" tab is not needed in most cases.
  165. removeDialogTabs: 'image:advanced;link:advanced',
  166. // Define the list of styles which should be available in the Styles dropdown list.
  167. // If the "class" attribute is used to style an element, make sure to define the style for the class in "mystyles.css"
  168. // (and on your website so that it rendered in the same way).
  169. // Note: by default CKEditor looks for styles.js file. Defining stylesSet inline (as below) stops CKEditor from loading
  170. // that file, which means one HTTP request less (and a faster startup).
  171. // For more information see http://docs.ckeditor.com/#!/guide/dev_styles
  172. stylesSet: [
  173. /* Inline Styles */
  174. {
  175. name: 'Marker',
  176. element: 'span',
  177. attributes: {
  178. 'class': 'marker'
  179. }
  180. }, {
  181. name: 'Cited Work',
  182. element: 'cite'
  183. }, {
  184. name: 'Inline Quotation',
  185. element: 'q'
  186. },
  187. /* Object Styles */
  188. {
  189. name: 'Special Container',
  190. element: 'div',
  191. styles: {
  192. padding: '5px 10px',
  193. background: '#eee',
  194. border: '1px solid #ccc'
  195. }
  196. }, {
  197. name: 'Compact table',
  198. element: 'table',
  199. attributes: {
  200. cellpadding: '5',
  201. cellspacing: '0',
  202. border: '1',
  203. bordercolor: '#ccc'
  204. },
  205. styles: {
  206. 'border-collapse': 'collapse'
  207. }
  208. }, {
  209. name: 'Borderless Table',
  210. element: 'table',
  211. styles: {
  212. 'border-style': 'hidden',
  213. 'background-color': '#E6E6FA'
  214. }
  215. }, {
  216. name: 'Square Bulleted List',
  217. element: 'ul',
  218. styles: {
  219. 'list-style-type': 'square'
  220. }
  221. },
  222. // Media embed
  223. {
  224. name: '240p',
  225. type: 'widget',
  226. widget: 'embedSemantic',
  227. attributes: {
  228. 'class': 'embed-240p'
  229. }
  230. }, {
  231. name: '360p',
  232. type: 'widget',
  233. widget: 'embedSemantic',
  234. attributes: {
  235. 'class': 'embed-360p'
  236. }
  237. }, {
  238. name: '480p',
  239. type: 'widget',
  240. widget: 'embedSemantic',
  241. attributes: {
  242. 'class': 'embed-480p'
  243. }
  244. }, {
  245. name: '720p',
  246. type: 'widget',
  247. widget: 'embedSemantic',
  248. attributes: {
  249. 'class': 'embed-720p'
  250. }
  251. }, {
  252. name: '1080p',
  253. type: 'widget',
  254. widget: 'embedSemantic',
  255. attributes: {
  256. 'class': 'embed-1080p'
  257. }
  258. }
  259. ]
  260. });
  261. //edit user description
  262. $('#edit-cancel-btn').on('click', function() {
  263. var c = $('#edit-info-btn').find("i");
  264. c.removeClass('icofont-close');
  265. c.addClass('icofont-edit');
  266. $('.view-desc').show();
  267. $('.edit-desc').hide();
  268. });
  269. $('.edit-desc').hide();
  270. $('#edit-info-btn').on('click', function() {
  271. var b = $(this).find("i");
  272. var edit_class = b.attr('class');
  273. if (edit_class == 'icofont icofont-edit') {
  274. b.removeClass('icofont-edit');
  275. b.addClass('icofont-close');
  276. $('.view-desc').hide();
  277. $('.edit-desc').show();
  278. } else {
  279. b.removeClass('icofont-close');
  280. b.addClass('icofont-edit');
  281. $('.view-desc').show();
  282. $('.edit-desc').hide();
  283. }
  284. });
  285. // Mini-color js start
  286. $('.demo').each(function() {
  287. $(this).minicolors({
  288. control: $(this).attr('data-control') || 'hue',
  289. defaultValue: $(this).attr('data-defaultValue') || '',
  290. format: $(this).attr('data-format') || 'hex',
  291. keywords: $(this).attr('data-keywords') || '',
  292. inline: $(this).attr('data-inline') === 'true',
  293. letterCase: $(this).attr('data-letterCase') || 'lowercase',
  294. opacity: $(this).attr('data-opacity'),
  295. position: $(this).attr('data-position') || 'bottom left',
  296. swatches: $(this).attr('data-swatches') ? $(this).attr('data-swatches').split('|') : [],
  297. change: function(value, opacity) {
  298. if (!value) return;
  299. if (opacity) value += ', ' + opacity;
  300. if (typeof console === 'object') {
  301. console.log(value);
  302. }
  303. },
  304. theme: 'bootstrap'
  305. });
  306. });
  307. // Mini-color js ends
  308. });