参赛队成绩修改表.html 6.4 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262
  1. <!DOCTYPE html>
  2. <html >
  3. <head>
  4. <meta charset="UTF-8">
  5. <title>参赛队成绩表格</title>
  6. <link rel="stylesheet" href="static/css/index.css">
  7. <link rel="stylesheet" href="static/eui/element-ui.css">
  8. <script src="static/vue/vue.min.js"></script>
  9. <script src="static/vue/vue-resource.js"></script>
  10. <script src="static/eui/index.js"></script>
  11. <script src="static/comm/Ajax.js"></script>
  12. <script src="js/jquery-3.4.1.min.js"></script>
  13. <link rel="stylesheet" href="css/demo.css">
  14. <script src="js/other.js"></script>
  15. <script src="https://unpkg.com/axios/dist/axios.min.js"></script>
  16. <style type="text/css">
  17. .match-achievement{
  18. margin: 50px 50px;
  19. width:1000px;
  20. }
  21. .match-achievement table{
  22. background:#E0ECFF;
  23. width:100%;
  24. }
  25. .match-achievement td{
  26. background:#fafafa;
  27. text-align:center;
  28. padding:2px;
  29. }
  30. .match-achievement td{
  31. background:#E0ECFF;
  32. }
  33. .match-achievement td.drop{
  34. background:#fafafa;
  35. width:100px;
  36. }
  37. .match-achievement td.over{
  38. background:#FBEC88;
  39. }
  40. .item{
  41. text-align:center;
  42. border:1px solid #499B33;
  43. background:#fafafa;
  44. width:100px;
  45. }
  46. .assigned{
  47. border:1px solid #BC2A4D;
  48. }
  49. .add{
  50. width: 100px;
  51. height: 30px;
  52. }
  53. a{
  54. text-decoration: none;
  55. color: #000000;
  56. }
  57. a:hover{
  58. color: #CC2222;
  59. }
  60. </style>
  61. </head>
  62. <body style="width: 70%;">
  63. <div id="app">
  64. <div class="match-achievement" >
  65. <h1>参赛队成绩表</h1>
  66. <table class="tab" >
  67. <tr>
  68. <td>
  69. <a href="#" class="easyui-linkbutton"
  70. data-options="iconCls:'icon-add'" id="add">新增
  71. </a>
  72. <a href="#" class="easyui-linkbutton"
  73. data-options="iconCls:'icon-edit'" id="edit">编辑
  74. </a>
  75. <a href="#" class="easyui-linkbutton"
  76. data-options="iconCls:'icon-cancel'" id="del">删除
  77. </a>
  78. </td>
  79. <td>序号</td>
  80. <td>组名</td>
  81. <td>总分</td>
  82. </tr>
  83. <tr tr v-for="c1 in c1s">
  84. <td class="drop"><input type="checkbox"></td>
  85. <td class="drop">{{c1.id}}</td>
  86. <td class="drop">{{c1.name}}</td>
  87. <td class="drop">{{c1.gg}}</td>
  88. </tr>
  89. </table>
  90. </div>
  91. <!--输入框-->
  92. <div class="inp">
  93. <h3>新增焦点图</h3>
  94. <form method="post">
  95. id:<input id="addid" type="text" name="id"><br>
  96. 组名:<input id="addname" type="text" name="title"><br>
  97. 总分:<input id="addgg" type="text" name="sotr"><br>
  98. </form>
  99. <button value="按钮" id="findAll" @click="onSubmit1">添加</button>
  100. </div>
  101. <div class="editinp">
  102. <h3>编辑 </h3>
  103. <form method="post">
  104. id:<input id="gaiid" type="text" name="id"><br>
  105. 组名:<input id="gainame" type="text" name="title"><br>
  106. 分数:<input id="gaigg" type="text" name="sotr"><br>
  107. </form>
  108. <button value="按钮" id="findAll2" @click="onSubmit2">加分</button>
  109. <button value="按钮" id="findAll3" @click="onSubmit3">减分</button>
  110. </div>
  111. <div class="delinp">
  112. <h3>删除 </h3>
  113. <form method="post">
  114. id: <input type="text" id="shanid" name="id"><br>
  115. </form>
  116. <button value="按钮" id="findAll3" @click="onSubmit4">删除</button>
  117. </div>
  118. </div>
  119. </body>
  120. <script>
  121. new Vue({
  122. el: '#app',
  123. data() {
  124. return {
  125. c1s: [],
  126. listLoading:false,
  127. }
  128. },
  129. created() {
  130. this.ajax = new Ajax(this);
  131. this.getSportsitems_peopleController()
  132. },
  133. methods: {
  134. //通过ajax去请求服务端,获取数据
  135. getSportsitems_peopleController() {
  136. let that = this;
  137. let url = "SportsgroupController/findAll";
  138. //调用Ajax的get方法
  139. that.ajax.get(url, function (rs) {
  140. that.c1s = rs;
  141. console.log(that.c1s)
  142. });
  143. },
  144. //通过ajax去请求服务端,获取数据
  145. getSportsitems_peopleController1() {
  146. var id2 =$("#addid").val();
  147. // $("#group").children("option:checked").text();
  148. var name2 = $("#addname").val();
  149. var gg2 = $("#addgg").val();
  150. axios.post('http://localhost:8199/SportsgroupController/save', {
  151. id: id2,
  152. name: name2,
  153. gg : gg2
  154. }).then(function (response) {
  155. location.reload();
  156. console.log(response);
  157. }).catch(function (error) {
  158. console.log(error);
  159. });
  160. },
  161. getSportsitems_peopleController2() {
  162. var id2 =$("#gaiid").val();
  163. // $("#group").children("option:checked").text();
  164. var name2 = $("#gainame").val();
  165. var gg2 = $("#gaigg").val();
  166. axios.post('http://localhost:8199/SportsgroupController/updatejia', {
  167. id: id2,
  168. name: name2,
  169. gg : gg2
  170. }).then(function (response) {
  171. location.reload();
  172. console.log(response);
  173. }).catch(function (error) {
  174. console.log(error);
  175. });
  176. },
  177. getSportsitems_peopleController3() {
  178. var id2 =$("#gaiid").val();
  179. // $("#group").children("option:checked").text();
  180. var name2 = $("#gainame").val();
  181. var gg2 = $("#gaigg").val();
  182. axios.post('http://localhost:8199/SportsgroupController/updatejian', {
  183. id: id2,
  184. gg : gg2
  185. }).then(function (response) {
  186. location.reload();
  187. console.log(response);
  188. }).catch(function (error) {
  189. console.log(error);
  190. });
  191. },
  192. getSportsitems_peopleController4() {
  193. var id2 =$("#shanid").val();
  194. // $("#group").children("option:checked").text();
  195. axios.post('http://localhost:8199/SportsgroupController/delete', {
  196. id: id2,
  197. }).then(function (response) {
  198. location.reload();
  199. console.log(response);
  200. }).catch(function (error) {
  201. console.log(error);
  202. });
  203. },
  204. onSubmit1() {
  205. let that = this;
  206. that.getSportsitems_peopleController1()
  207. },
  208. onSubmit2() {
  209. let that = this;
  210. that.getSportsitems_peopleController2();
  211. },
  212. onSubmit3() {
  213. let that = this;
  214. that.getSportsitems_peopleController3()
  215. },
  216. onSubmit4() {
  217. let that = this;
  218. that.getSportsitems_peopleController4()
  219. },
  220. }
  221. })
  222. </script>
  223. </html>