WechatBinding.cshtml 4.3 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137
  1. 
  2. @{
  3. ViewBag.Title = "WechatBinding";
  4. Layout = "~/Views/MobileProblem/_APPMain.cshtml";
  5. }
  6. <style>
  7. .mui-table h4, .mui-table h5, .mui-table .mui-h5, .mui-table .mui-h6, .mui-table p {
  8. margin-top: 0;
  9. }
  10. .mui-table h4 {
  11. line-height: 21px;
  12. font-weight: 500;
  13. }
  14. .mui-table .oa-icon {
  15. position: absolute;
  16. right: 0;
  17. bottom: 0;
  18. }
  19. .mui-table .oa-icon-star-filled {
  20. color: #f14e41;
  21. }
  22. h5, .mui-h5 {
  23. font-size: 11px
  24. }
  25. .mui-table-view:before, .mui-table-view:after {
  26. background-color: transparent
  27. }
  28. </style>
  29. <div id="vue" v-cloak>
  30. <header class="mui-bar mui-bar-nav">
  31. <a class="mui-action-back mui-icon mui-icon-left-nav mui-pull-left" style="color:#ffffff"></a>
  32. <h1 class="mui-title" style="color:white">微信绑定</h1>
  33. </header>
  34. <div class="mui-content mui-scroll-wrapper" id="pullrefresh">
  35. <div class="mui-scroll">
  36. <div style="margin-top:10px">
  37. <button>新增</button>
  38. </div>
  39. </div>
  40. </div>
  41. </div>
  42. <script>
  43. var vm = new Vue({
  44. el: '#vue',
  45. data: {
  46. NoticeData: [],
  47. Pages: 0
  48. },
  49. watch: {
  50. },
  51. methods: {
  52. ///进入详细页面
  53. Deatil: function (id) {
  54. window.location.href = '/MobileProblem/NoticesDetail/' + id
  55. },
  56. pullupRefresh: function () {
  57. var that = this;
  58. that.Pages++;
  59. setTimeout(function () {
  60. var self = mui('#pullrefresh').pullRefresh(); //参数为true代表没有更多数据了。
  61. mui.get('/Notice/HomeGetList',
  62. {
  63. SelectConditon: that.searchText,
  64. page: that.Pages,
  65. rows: 7
  66. }, function (data) {
  67. //获得服务器响应
  68. var info = data.rows;
  69. if (info.length == 0) {//当datas.length为0时,表示没有数据了
  70. self.endPullupToRefresh(true);//当为true时,底部出现没有更多数据,并且不能滑动
  71. } else {
  72. for (var di in info) {
  73. var dd = info[di];
  74. dd.内容 = that.IgnoHtml(dd.内容)
  75. dd.发布时间小时 = that.GetTime(dd.发布时间小时)
  76. }
  77. that.NoticeData = info
  78. self.endPullupToRefresh(false);//当为false或空时,底部出现正在加载,滑动到下一页
  79. }
  80. }, 'json');
  81. }, 1500);
  82. },
  83. IgnoHtml(data) {
  84. var arrEntities = {
  85. 'lt': '<',
  86. 'gt': '>',
  87. 'nbsp': ' ',
  88. 'amp': '&',
  89. 'quot': '"'
  90. };
  91. var t = data.replace(/<[^>]+>/g, "").replace(/&(lt|gt|nbsp|amp|quot);/ig, function (all, t) {
  92. return arrEntities[t];
  93. });
  94. return t
  95. },
  96. GetTime(val) {
  97. if (val < 1) {
  98. return parseInt(val * 60) + "分钟前";
  99. } else if (val < 24) {
  100. return val + "小时前";
  101. } else if (48 > val > 24) {
  102. return "昨天";
  103. } else {
  104. return parseInt(val / 24) + '天' + '前';
  105. }
  106. }
  107. },
  108. mounted: function () {
  109. var that = this;
  110. mui.init({
  111. pullRefresh: {
  112. container: '#pullrefresh',
  113. up: {
  114. auto: true,
  115. contentrefresh: '正在加载公告...',
  116. callback: that.pullupRefresh,
  117. }
  118. }
  119. });
  120. mui(".mui-scroll").on('tap', '.mui-table-view-cell', function (event) {
  121. this.click();
  122. });
  123. }
  124. })
  125. </script>