index.js 3.3 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160
  1. // pages/my/index.js
  2. const app = getApp()
  3. import Dialog from '../../miniprogram_npm/vant-weapp/dialog/dialog';
  4. import * as echarts from '../../ec-canvas/echarts';
  5. // let chart = null;
  6. Page({
  7. /**
  8. * 页面的初始数据
  9. */
  10. data: {
  11. // nvabarData: {
  12. // showCapsule: 0, //是否显示左上角图标,消息中心 1表示显示 0表示不显示
  13. // showBack: 1, //返回
  14. // title: '我的', //导航栏 中间的标题
  15. // // 此页面 页面内容距最顶部的距离
  16. // height: app.globalData.height * 2 + 20,
  17. // },
  18. active: 4,
  19. CustomBar: app.globalData.CustomBar, // 注意 这是侧边抽底计算的适配距离 basis-xl 左测弹出的宽度
  20. ColorList: app.globalData.ColorList,
  21. searchValue: '',
  22. show: false,
  23. modalName: null,
  24. ec: {
  25. lazyLoad: true
  26. },
  27. },
  28. changeSearch() {
  29. console.log(this.data.searchValue);
  30. },
  31. onChange(e) {
  32. this.setData({
  33. searchValue: e.detail,
  34. });
  35. },
  36. //点击弹出层
  37. clickPop() {
  38. this.setData({
  39. show: true,
  40. });
  41. },
  42. onClose() {
  43. this.setData({
  44. show: false,
  45. });
  46. },
  47. clickdialog() {
  48. Dialog.confirm({
  49. title: '标题',
  50. message: '弹窗内容',
  51. }).then(() => {
  52. // on close
  53. });
  54. },
  55. showModal(e) {
  56. console.log(e)
  57. this.setData({
  58. modalName: e.currentTarget.dataset.target
  59. })
  60. },
  61. hideModal(e) {
  62. this.setData({
  63. modalName: null
  64. })
  65. },
  66. getOption() {
  67. console.log("我是初始化的charts")
  68. var option = {
  69. title: {
  70. text: 'ECharts 入门示例'
  71. },
  72. tooltip: {},
  73. xAxis: {
  74. data: ['衬衫', '羊毛衫', '雪纺衫', '裤子', '高跟鞋', '袜子']
  75. },
  76. yAxis: {},
  77. series: [{
  78. name: '销量',
  79. type: 'bar',
  80. data: [5, 20, 36, 10, 10, 20]
  81. }]
  82. }
  83. return option;
  84. },
  85. /**
  86. * 生命周期函数--监听页面加载
  87. */
  88. init_echarts: function () {
  89. this.echartsComponnet.init((canvas, width, height) => {
  90. // 初始化图表
  91. const Chart = echarts.init(canvas, null, {
  92. width: width,
  93. height: height
  94. });
  95. Chart.setOption(this.getOption());
  96. // 注意这里一定要返回 chart 实例,否则会影响事件处理等
  97. return Chart;
  98. });
  99. },
  100. onLoad: function (options) {
  101. this.echartsComponnet = this.selectComponent('#mychart');
  102. this.init_echarts()
  103. },
  104. /**
  105. * 生命周期函数--监听页面初次渲染完成
  106. */
  107. onReady: function () {
  108. },
  109. /**
  110. * 生命周期函数--监听页面显示
  111. */
  112. onShow: function () {
  113. // setTimeout(this.getData, 5000);
  114. },
  115. /**
  116. * 生命周期函数--监听页面隐藏
  117. */
  118. onHide: function () {
  119. },
  120. /**
  121. * 生命周期函数--监听页面卸载
  122. */
  123. onUnload: function () {
  124. },
  125. /**
  126. * 页面相关事件处理函数--监听用户下拉动作
  127. */
  128. onPullDownRefresh: function () {
  129. wx.showNavigationBarLoading() //在标题栏中显示加载
  130. wx.showLoading({
  131. title: '正在刷新数据',
  132. })
  133. setTimeout(function () {
  134. wx.hideLoading();
  135. }, 2000);
  136. wx.stopPullDownRefresh();
  137. },
  138. /**
  139. * 页面上拉触底事件的处理函数
  140. */
  141. onReachBottom: function () {
  142. },
  143. /**
  144. * 用户点击右上角分享
  145. */
  146. onShareAppMessage: function () {
  147. }
  148. })