20170411List.html 4.2 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147
  1. <!DOCTYPE html>
  2. <html lang="en">
  3. <head>
  4. <meta charset="UTF-8">
  5. <title>刻意练习365</title>
  6. <style type="text/css">
  7. body {
  8. TEXT-ALIGN: center;
  9. }
  10. #app {
  11. margin: 0 auto;
  12. font-size: 24px;
  13. }
  14. table {
  15. border-collapse: collapse;
  16. margin: 0 0 50px 0;
  17. width: 100%;
  18. }
  19. .tdClass {
  20. background-color: #eeeeee;
  21. }
  22. table, td {
  23. border: 1px solid black;
  24. height: 30px;
  25. padding: 5px 10px 5px 10px;
  26. flex: 1;
  27. }
  28. .main {
  29. width: 100%;
  30. }
  31. .Title{
  32. font-size:36px;
  33. font-weight: bolder;
  34. margin:0px 0 10px 0;
  35. }
  36. #CurrentTime{
  37. font-size:12px;
  38. width: 100%;
  39. text-align: right;
  40. }
  41. </style>
  42. <script src="https://kylx365-1253256735.file.myqcloud.com/js/jquery-1.10.2.min.js"></script>
  43. <script src="https://kylx365-1253256735.file.myqcloud.com/js/vue.min.js"></script>
  44. <script>
  45. var dataname="[数据名称]";
  46. var url = "/data/" + QueryString(dataname);
  47. var vm;
  48. $(document).ready(function () {
  49. vm = new Vue({
  50. el: '#app',
  51. data: {
  52. DataName:dataname,
  53. ListMain: [],
  54. ListMain2: [],
  55. },
  56. methods: {
  57. getList: function (event) {
  58. $.get(url, function (data) {
  59. var arr=[];
  60. if (dataname != "GetUserNumber2"
  61. && dataname != "GetUserNumber500"
  62. && dataname != "GetUserSource"
  63. && dataname != "GetActivityUserInfo"
  64. && dataname != "GetGroupInfo"
  65. && dataname != "GetUserIntroducer"
  66. && dataname != "GetSchulteUserNumber") {
  67. arr.push(data.result);
  68. vm.ListMain2=arr;
  69. }
  70. else {
  71. arr = data.result;
  72. vm.ListMain=arr;
  73. }
  74. $("#CurrentTime").html(new Date().toString());
  75. });
  76. },
  77. }
  78. });
  79. vm.getList();
  80. });
  81. function QueryString(key) {
  82. return key.replace("__","=").replace("_","?");
  83. }
  84. </script>
  85. </head>
  86. <body>
  87. <div id="app">
  88. <div id="CurrentTime"></div>
  89. <div class="main">
  90. <table v-for="(valueMain, keyMain) in ListMain">
  91. <caption class="Title" align="top">{{valueMain.title}}</caption>
  92. <thead>
  93. <tr>
  94. <td class="tdClass">编号</td>
  95. <td class="tdClass" v-for="(value, key) in valueMain.list[0]" v-if="key!='秒过ID'">{{ key }}</td>
  96. </tr>
  97. </thead>
  98. <tbody>
  99. <tr v-for="(item, index) in valueMain.list">
  100. <td>{{ index+1 }}</td>
  101. <td v-for="(value, key) in item" v-if="key!='秒过ID'">
  102. {{ value }}
  103. </td>
  104. </tr>
  105. </tbody>
  106. </table>
  107. <table v-for="(valueMain, keyMain) in ListMain2">
  108. <thead>
  109. <tr>
  110. <td class="tdClass">编号</td>
  111. <td class="tdClass" v-for="(value, key) in valueMain[0]">{{ key }}</td>
  112. </tr>
  113. </thead>
  114. <tbody>
  115. <tr v-for="(item, index) in valueMain">
  116. <td>{{ index+1 }}</td>
  117. <td v-for="(value, key) in item" v-if="key=='秒过ID'">
  118. <a :href="'webuserinfo?UserID=' + item.秒过ID " target="_blank">{{ value }}</a>
  119. </td>
  120. <td v-for="(value, key) in item" v-if="key!='秒过ID'">
  121. {{ value }}
  122. </td>
  123. </tr>
  124. </tbody>
  125. </table>
  126. </div>
  127. </div>
  128. </body>
  129. </html>