复制 controllers.js 8.0 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290
  1. var starter = angular.module('starter.controllers', [])
  2. //登录页面控制器
  3. starter.controller('loginCtrl',["$scope",'$state','$ionicLoading','$timeout','$ionicPopup',function($scope,$state,$ionicLoading,$timeout,$ionicPopup){
  4. $scope.vm = {
  5. mobile:'',
  6. password:''
  7. };
  8. $scope.login = function(){
  9. if($scope.vm.username == 'admin' && $scope.vm.password == 'admin'){
  10. $ionicLoading.show({
  11. template: '<div class="loader"><svg class="circular"><circle class="path" cx="50" cy="50" r="20" fill="none" stroke-width="2" stroke-miterlimit="10"/></svg></div>'
  12. });
  13. $timeout(function(){
  14. $ionicLoading.hide();
  15. $state.go('home')
  16. },1500);
  17. }else{
  18. var alertPopup = $ionicPopup.alert({
  19. title: '账号密码不正确',
  20. template: '唯一账号密码:admin!!!'
  21. });
  22. $timeout(function() {
  23. ionicMaterialInk.displayEffect();
  24. }, 0);
  25. }
  26. }
  27. }])
  28. //主页面控制器
  29. starter.controller('homeCtrl',["$scope",'$http','$timeout','$ionicLoading','$state',function($scope,$http,$timeout,$ionicLoading,$state){
  30. $http({
  31. method:'get',
  32. url:'http://172.31.40.29/list',
  33. }).success(function(newItem){
  34. $scope.excals = newItem
  35. })
  36. $scope.doRefresh = function(){
  37. $ionicLoading.show({
  38. tcontent: 'Loading',
  39. animation: 'fade-in',
  40. showBackdrop: true,
  41. maxWidth: 200,
  42. showDelay: 0
  43. });
  44. $http({
  45. method:'get',
  46. url:'http://172.31.40.29/list',
  47. }).success(function(newItem){
  48. $timeout(function(){
  49. $ionicLoading.hide();
  50. $scope.excals = newItem
  51. });
  52. })
  53. .finally(function() {
  54. $scope.$broadcast('scroll.refreshComplete');
  55. });
  56. }
  57. $scope.getName = function(item){
  58. name = this.$$watchers[0].last;
  59. $state.go('show',{item:name})
  60. }
  61. }])
  62. //数据展示控制器
  63. starter.controller('showCtrl',["$scope",'$ionicHistory','$state','$http',function($scope,$ionicHistory,$state,$http){
  64. $scope.tabs = [{"title":"主页","url":"line.html"},
  65. {"title":"TN曲线","url":"tn.html"},
  66. {"title":"五轴图","url":"zhou.html"},
  67. {"title":"效率云图","url":"strom.html"}];
  68. $scope.name = name;
  69. $scope.go = function(result){
  70. $state.go(result)
  71. };
  72. $scope.isActiveTab = function(tabUrl){
  73. return tabUrl == $scope.currentTab;
  74. };
  75. $scope.onClickTab = function(tab){
  76. $scope.currentTab = tab.url;
  77. if(tab.title==="TN曲线"){
  78. $http({
  79. method:'get',
  80. url:'http://172.31.40.29/data/'+name
  81. }).success(function(req){
  82. $scope.item= req.speed;
  83. $scope.data = [req.torque,req.v,req.p,req.a,req.efficiency]
  84. })
  85. }
  86. };
  87. //TN曲线图
  88. $scope.legend = ["扭矩", "电压",'输入功率','电流','效率'];
  89. $scope.item = ['200rpm','400rpm','600rpm','800rpm','1000rpm','1200rpm','1400rpm','1600rpm','1800rpm','2000rpm','2200rpm','2400rpm'];
  90. $scope.num = [0,1,2,3,4];
  91. $scope.data = [
  92. [1,1,1,1,1,1,1,1,1,1,1,1], //扭矩
  93. [196,196,196,196,196,196,196,196,196,196,196,196,], //电压
  94. [500,500,500,500,500,500,500,500,500,500,500,500,], //输入功率
  95. [4,4,4,4,4,4,4,4,4,4,4,4], //电流
  96. [68,68,68,68,68,68,68,68,68,68,68,68,]//效率
  97. ];
  98. }])
  99. starter.directive('line', function() {
  100. return {
  101. scope: {
  102. id: "@",
  103. legend: "=",
  104. item: "=",
  105. num:"=",
  106. data: "="
  107. },
  108. restrict: 'E',
  109. template: '<div style="height:700px;"></div>',
  110. replace: true,
  111. link: function($scope, element, attrs, controller) {
  112. var colors = ['#a62ca6', '#8e0515', '#45baf3','#ff2420','#1a9a1a'];
  113. var option = {
  114. color:colors,
  115. // 提示框,鼠标悬浮交互时的信息提示
  116. tooltip: {
  117. show: true,
  118. trigger: 'axis'
  119. },
  120. grid:{
  121. left:'23%'
  122. },
  123. //图例
  124. legend: {
  125. data: $scope.legend ,
  126. textStyle:{
  127. fontSize:22
  128. }
  129. },
  130. // toolbox: {
  131. // feature: {
  132. // dataView: {show: true, readOnly: false},
  133. // restore: {show: true},
  134. // saveAsImage: {show: true}
  135. // }
  136. // },
  137. // 横轴坐标轴
  138. xAxis: [
  139. {
  140. type: 'category',
  141. // boundaryGap:false,
  142. axisLabel:{
  143. textStyle:{
  144. fontSize:20
  145. }
  146. },
  147. data: $scope.item
  148. }
  149. ],
  150. // 纵轴坐标轴
  151. yAxis: [
  152. {
  153. type: 'value',
  154. // name: '扭\n矩\n(N*m)',
  155. min: 0,
  156. max: 4,
  157. position: 'left',
  158. offset:205,
  159. axisLine: {
  160. lineStyle: {
  161. color: colors[0],
  162. width:2
  163. }
  164. },
  165. axisLabel:{
  166. margin:20,
  167. textStyle:{
  168. fontSize:18
  169. }
  170. }
  171. },
  172. {
  173. type: 'value',
  174. // name: '电\n压\n(V)',
  175. min: 193,
  176. max: 202,
  177. position: 'left',
  178. offset: 150,
  179. axisLine: {
  180. lineStyle: {
  181. color: colors[1],
  182. width:2
  183. }
  184. },
  185. axisLabel:{
  186. margin:15,
  187. textStyle:{
  188. fontSize:18
  189. }
  190. },
  191. },
  192. {
  193. type: 'value',
  194. // name: '输\n入\n功\n率\n(W)',
  195. min: 0,
  196. max: 1300,
  197. position: 'left',
  198. offset:90,
  199. axisLine: {
  200. lineStyle: {
  201. color: colors[2],
  202. width:2
  203. }
  204. },
  205. axisLabel:{
  206. textStyle:{
  207. fontSize:18
  208. }
  209. },
  210. },
  211. {
  212. type: 'value',
  213. // name: '电\n流\n(A)',
  214. min: 1,
  215. max: 6,
  216. position: 'left',
  217. offset:45,
  218. axisLine: {
  219. lineStyle: {
  220. color: colors[3],
  221. width:2
  222. }
  223. },
  224. axisLabel:{
  225. margin:20,
  226. textStyle:{
  227. fontSize:18
  228. }
  229. },
  230. },
  231. {
  232. type: 'value',
  233. // name: '效\n率\n(%)',
  234. min: 10,
  235. max: 80,
  236. position: 'left',
  237. offset:0,
  238. axisLine: {
  239. lineStyle: {
  240. color: colors[4],
  241. width:2
  242. }
  243. },
  244. axisLabel:{
  245. margin:15,
  246. textStyle:{
  247. fontSize:18
  248. }
  249. },
  250. }
  251. ],
  252. // 数据内容数组
  253. series: function(){
  254. var serie=[];
  255. for(var i=0;i<$scope.legend.length;i++){
  256. var item = {
  257. name : $scope.legend[i],
  258. type: 'line',
  259. yAxisIndex:$scope.num[i],
  260. data: $scope.data[i]
  261. };
  262. serie.push(item);
  263. }
  264. return serie;
  265. }()
  266. };
  267. var myChart = echarts.init(document.getElementById($scope.id),'macarons');
  268. myChart.setOption(option);
  269. }
  270. };
  271. })