251bd18e1d7458874509e4bb1b022f5eaf880a90.svn-base 36 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367368369370371372373374375376377378379380381382383384385386387388389390391392393394395396397398399400401402403404405406407408409410411412413414415416417418419420421422423424425426427428429430431432433434435436437438439440441442443444445446447448449450451452453454455456457458459460461462463464465466467468469470471472473474475476477478479480481482483484485486487488489490491492493494495496497498499500501502503504505506507508509510511512513514515516517518519520521522523524525526527528529530531532533534535536537538539540541542543544545546547548549550551552553554555556557558559560561562563564565566567568569570571572573574575576577578579580581582583584585586587588589590591592593594595596597598599600601602603604605606607608609610611612613614615616617618619620621622623624625626627628629630631632633634635636637638639640641642643644645646647648649650651652653654655656657658659660661662663664665666667668669670671672673674675676677678679680681682683684685686687688689690691692693694695696697698699700701702703704705706707708709710711712713714715716717718719720721722723724725726727728729730731732733734735736737738739740741742743744745746747748749750751752753754755756757758759760761762763764765766767768769770771772773774775776777778779780781782783784785786787788789790791792793794795796797798799800801802803804805806807808809810811812813814815816817818819820821822823824825826827828829830831832833834835836837838839840841842843844845846847848849850851852853854855856857858859860861862863864865866867868869870871872873874875876877878879880881882883884885886887888889890891892893894895896897898899900901902903904905906907908909910911912913914915916917918919920921922923924925926927928929930931932933934935936937938939940941942943944945946947948949950951952953954955956957958959
  1. <template>
  2. <div>
  3. <div class="serch row item-center allAlignment">
  4. <div class="row item-center">
  5. <div class="row item-center">
  6. <input
  7. class="fz14"
  8. type="text"
  9. placeholder="请输入联赛和球队名称"
  10. v-model="serchTxt"
  11. onkeyup="this.value=this.value.replace(/\s+/g,'')"
  12. color="#AAA"
  13. />
  14. <div class="row center serch-img pointer hover" @click="Serch()">
  15. <img src="@/assets/st-imges/serch.png" alt />
  16. </div>
  17. </div>
  18. <div class="row item-center">
  19. <div class="row center clear pointer hover br05 fz14" @click="clearSerchTxt()">清除</div>
  20. </div>
  21. </div>
  22. <div class="row center redraw pointer hover br05" @click="red()">
  23. <img src="@/assets/st-imges/redraw.png" alt />
  24. </div>
  25. </div>
  26. <!-- 标题 -->
  27. <div style="height:.5rem;background:#888;" class="pdg20 row allAlignment">
  28. <div class="row item-center"
  29. style="height:100%;color:#FFF;font-size:.16rem;font-weight:bold;"
  30. >网球滚球</div>
  31. <div class="row item-center">
  32. <p style="font-size:.14rem;">显示</p>
  33. <div
  34. style="width:.5rem;height:.3rem;background:#AAA;color:#FFF;margin-left:.13rem;font-size:.14rem;"
  35. class="row center br05"
  36. >盘数</div>
  37. </div>
  38. </div>
  39. <div class="tennisRollBall" v-for="(item,index) in data" :key="item.id">
  40. <!-- 联赛名 -->
  41. <div class="tennisRollBall-title row item-center pdg20">{{item.leagueName}}</div>
  42. <div class="tennisRollBall-title-list" v-for="(items,i) in item.matchData" :key="items.id">
  43. <div class="tennisRollBall-title-list-title pdg20 row">
  44. <div style="width:30%;height:100%" class="row allAlignment item-center">
  45. <span
  46. style="color:#F76649"
  47. v-if="items.home_player_score != null"
  48. >{{items.home_player_score}}</span>
  49. <span style="color:#F76649" v-else>0</span>
  50. <span>-</span>
  51. <span
  52. style="color:#F76649"
  53. v-if="items.guest_player_score != null"
  54. >{{items.guest_player_score}}</span>
  55. <span style="color:#F76649" v-else>0</span>
  56. <div
  57. class="row center triangle tennisRollBall-title-list-title-num"
  58. style="background:#BBB;width:.6rem;height:.5rem;color:#fff;"
  59. @click="getTournamentPlay(items.match_id)"
  60. >{{items.tag}} ></div>
  61. </div>
  62. <div style="color:#666;width:70%" class="pdg20 row allAlignment item-center">
  63. <p>全场</p>
  64. <p>让盘</p>
  65. <p>让局</p>
  66. <p>局-大/小盘</p>
  67. </div>
  68. </div>
  69. <div class="row" style="border-bottom:.01rem solid #EDEDED;height:100%;">
  70. <!-- 全场 -->
  71. <div
  72. style="width:30%;height:100%;margin-left:.1rem;padding:.1rem 0;"
  73. class="tennisRollBall-list-name"
  74. >
  75. <!-- <p style="color:#2D8320">第一盘</p> -->
  76. <p style="padding-left:0.2rem;line-height: .4rem;">
  77. <span style="margin-right:.1rem;background:#AFE13B;"></span>
  78. {{items.home_team}}
  79. </p>
  80. <p style="padding-left:0.2rem;line-height: .4rem;">
  81. <span style="margin-right:.1rem;background:#AFE13B;"></span>
  82. {{items.guest_team}}
  83. </p>
  84. </div>
  85. <div style="position: relative;width:70%">
  86. <div
  87. style="height:100%;"
  88. class="row allAlignment item-center"
  89. v-for="(itemList,idx) in items.full_oddsData"
  90. :key="itemList.id"
  91. >
  92. <!-- 独赢 -->
  93. <!-- <div v-if="itemList.odds_code == 'ch' || itemList.odds_code == 'cg'">
  94. <p
  95. class="singleAndDouble-list-btn hover home dishes"
  96. :class="{col:itemList.isTrue,rising:itemList.change == 'rising',falling:itemList.change == 'falling'}"
  97. v-if="itemList.odds_code == 'ch'"
  98. @click="selection(index,i,idx,itemList.id,itemList.p_code,items.match_id,items.home_team,items.guest_team,items.home_team,'滚球','all')"
  99. >{{itemList.odds}}</p>
  100. <p
  101. class="singleAndDouble-list-btn hover guest dishes"
  102. :class="{col:itemList.isTrue,rising:itemList.change == 'rising',falling:itemList.change == 'falling'}"
  103. v-if="itemList.odds_code == 'cg'"
  104. @click="selection(index,i,idx,itemList.id,itemList.p_code,items.match_id,items.home_team,items.guest_team,items.guest_team,'滚球','all')"
  105. >{{itemList.odds}}</p>
  106. </div> -->
  107. <!-- 让盘 -->
  108. <div v-if="itemList.odds_code.startsWith('lb')">
  109. <p
  110. class="singleAndDouble-list-btn hover home dishes"
  111. :class="{col:itemList.isTrue,rising:itemList.change == 'rising',falling:itemList.change == 'falling'}"
  112. v-if="itemList.odds_code == 'lbh'"
  113. @click="selection(index,i,idx,itemList.id,itemList.p_code,items.match_id,items.home_team,items.guest_team,items.home_team,'滚球','all')"
  114. >{{itemList.odds}}</p>
  115. <p
  116. class="singleAndDouble-list-btn hover guest dishes"
  117. :class="{col:itemList.isTrue,rising:itemList.change == 'rising',falling:itemList.change == 'falling'}"
  118. v-if="itemList.odds_code == 'lbg'"
  119. @click="selection(index,i,idx,itemList.id,itemList.p_code,items.match_id,items.home_team,items.guest_team,items.guest_team,'滚球','all')"
  120. >{{itemList.odds}}</p>
  121. </div>
  122. <!-- 让局 -->
  123. <div v-if="itemList.odds_code.startsWith('ld')">
  124. <p
  125. class="singleAndDouble-list-btn hover home concede"
  126. :class="{col:itemList.isTrue,rising:itemList.change == 'rising',falling:itemList.change == 'falling'}"
  127. v-if="itemList.odds_code == 'ldh' "
  128. @click="selection(index,i,idx,itemList.id,itemList.p_code,items.match_id,items.home_team,items.guest_team,items.home_team,'滚球','all')"
  129. >{{itemList.odds}}</p>
  130. <p
  131. class="singleAndDouble-list-btn hover guest concede"
  132. :class="{col:itemList.isTrue,rising:itemList.change == 'rising',falling:itemList.change == 'falling'}"
  133. v-if="itemList.odds_code == 'ldg' "
  134. @click="selection(index,i,idx,itemList.id,itemList.p_code,items.match_id,items.home_team,items.guest_team,items.guest_team,'滚球','all')"
  135. >{{itemList.odds}}</p>
  136. </div>
  137. <!-- 大小 -->
  138. <div v-if="itemList.odds_code.startsWith('tn')">
  139. <p
  140. class="singleAndDouble-list-btn hover home total"
  141. :class="{col:itemList.isTrue,rising:itemList.change == 'rising',falling:itemList.change == 'falling'}"
  142. v-if="itemList.odds_code == 'tnb'"
  143. @click="selection(index,i,idx,itemList.id,itemList.p_code,items.match_id,items.home_team,items.guest_team,items.home_team,'滚球','all')"
  144. >{{itemList.odds}}</p>
  145. <p
  146. class="singleAndDouble-list-btn hover guest total"
  147. :class="{col:itemList.isTrue,rising:itemList.change == 'rising',falling:itemList.change == 'falling'}"
  148. v-if="itemList.odds_code == 'tns'"
  149. @click="selection(index,i,idx,itemList.id,itemList.p_code,items.match_id,items.home_team,items.guest_team,items.guest_team,'滚球','all')"
  150. >{{itemList.odds}}</p>
  151. </div>
  152. </div>
  153. </div>
  154. </div>
  155. <div
  156. class="row"
  157. style="border-bottom:.01rem solid #EDEDED;height:100%;"
  158. v-if="items.one_oddsData"
  159. >
  160. <!-- 第一局 -->
  161. <div
  162. style="width:30%;height:100%;margin-left:.1rem;padding:.1rem 0;"
  163. class="tennisRollBall-list-name"
  164. >
  165. <p style="color:#2D8320">第一盘</p>
  166. <p style="padding-left:0.2rem;line-height: .4rem;">
  167. <span style="margin-right:.1rem;background:#AFE13B;"></span>
  168. {{items.home_team}}
  169. </p>
  170. <p style="padding-left:0.2rem;line-height: .4rem;">
  171. <span style="margin-right:.1rem;background:#AFE13B;"></span>
  172. {{items.guest_team}}
  173. </p>
  174. </div>
  175. <div style="position: relative;width:70%">
  176. <div
  177. style="height:100%;"
  178. class="row allAlignment item-center"
  179. v-for="(itemList,idx) in items.one_oddsData"
  180. :key="itemList.id"
  181. >
  182. <!-- 独赢 -->
  183. <!-- <div v-if="itemList.odds_code == 'ch' || itemList.odds_code == 'cg'">
  184. <p
  185. class="singleAndDouble-list-btn hover home dishes"
  186. :class="{col:itemList.isTrue,rising:itemList.change == 'rising',falling:itemList.change == 'falling'}"
  187. v-if="itemList.odds_code == 'ch'"
  188. @click="selection(index,i,idx,itemList.id,itemList.p_code,items.match_id,items.home_team,items.guest_team,items.home_team,'滚球','all')"
  189. >{{itemList.odds}}</p>
  190. <p
  191. class="singleAndDouble-list-btn hover guest dishes"
  192. :class="{col:itemList.isTrue,rising:itemList.change == 'rising',falling:itemList.change == 'falling'}"
  193. v-if="itemList.odds_code == 'cg'"
  194. @click="selection(index,i,idx,itemList.id,itemList.p_code,items.match_id,items.home_team,items.guest_team,items.guest_team,'滚球','all')"
  195. >{{itemList.odds}}</p>
  196. </div> -->
  197. <!-- 让盘 -->
  198. <div v-if="itemList.odds_code.startsWith('ld')">
  199. <p
  200. class="singleAndDouble-list-btn hover home dishes"
  201. :class="{col:itemList.isTrue,rising:itemList.change == 'rising',falling:itemList.change == 'falling'}"
  202. v-if="itemList.odds_code == 'ldh'"
  203. @click="selection(index,i,idx,itemList.id,itemList.p_code,items.match_id,items.home_team,items.guest_team,items.home_team,'滚球','one')"
  204. >{{itemList.odds}}</p>
  205. <p
  206. class="singleAndDouble-list-btn hover guest dishes"
  207. :class="{col:itemList.isTrue,rising:itemList.change == 'rising',falling:itemList.change == 'falling'}"
  208. v-if="itemList.odds_code == 'ldg'"
  209. @click="selection(index,i,idx,itemList.id,itemList.p_code,items.match_id,items.home_team,items.guest_team,items.guest_team,'滚球','one')"
  210. >{{itemList.odds}}</p>
  211. </div>
  212. <!-- 让局 -->
  213. <div v-if="itemList.odds_code.startsWith('lb')">
  214. <p
  215. class="singleAndDouble-list-btn hover home concede"
  216. :class="{col:itemList.isTrue,rising:itemList.change == 'rising',falling:itemList.change == 'falling'}"
  217. v-if="itemList.odds_code == 'ldh'"
  218. @click="selection(index,i,idx,itemList.id,itemList.p_code,items.match_id,items.home_team,items.guest_team,items.home_team,'滚球','one')"
  219. >{{itemList.odds}}</p>
  220. <p
  221. class="singleAndDouble-list-btn hover guest concede"
  222. :class="{col:itemList.isTrue,rising:itemList.change == 'rising',falling:itemList.change == 'falling'}"
  223. v-if="itemList.odds_code == 'ldg'"
  224. @click="selection(index,i,idx,itemList.id,itemList.p_code,items.match_id,items.home_team,items.guest_team,items.guest_team,'滚球','one')"
  225. >{{itemList.odds}}</p>
  226. </div>
  227. <!-- 大小 -->
  228. <div v-if="itemList.odds_code.startsWith('tn')">
  229. <p
  230. class="singleAndDouble-list-btn hover home total"
  231. :class="{col:itemList.isTrue,rising:itemList.change == 'rising',falling:itemList.change == 'falling'}"
  232. v-if="itemList.odds_code == ' tnb'"
  233. @click="selection(index,i,idx,itemList.id,itemList.p_code,items.match_id,items.home_team,items.guest_team,items.home_team,'滚球','one')"
  234. >{{itemList.odds}}</p>
  235. <p
  236. class="singleAndDouble-list-btn hover guest total"
  237. :class="{col:itemList.isTrue,rising:itemList.change == 'rising',falling:itemList.change == 'falling'}"
  238. v-if="itemList.odds_code == 'tns'"
  239. @click="selection(index,i,idx,itemList.id,itemList.p_code,items.match_id,items.home_team,items.guest_team,items.guest_team,'滚球','one')"
  240. >{{itemList.odds}}</p>
  241. </div>
  242. </div>
  243. </div>
  244. </div>
  245. <div
  246. class="row"
  247. style="border-bottom:.01rem solid #EDEDED;height:100%;"
  248. v-if="items.two_oddsData"
  249. >
  250. <!-- 第二局 -->
  251. <div
  252. style="width:30%;height:100%;margin-left:.1rem;padding:.1rem 0;"
  253. class="tennisRollBall-list-name"
  254. >
  255. <p style="color:#2D8320">第二盘</p>
  256. <p style="padding-left:0.2rem;line-height: .4rem;">
  257. <span style="margin-right:.1rem;background:#AFE13B;"></span>
  258. {{items.home_team}}
  259. </p>
  260. <p style="padding-left:0.2rem;line-height: .4rem;">
  261. <span style="margin-right:.1rem;background:#AFE13B;"></span>
  262. {{items.guest_team}}
  263. </p>
  264. </div>
  265. <div style="position: relative;width:70%">
  266. <div
  267. style="height:100%;"
  268. class="row allAlignment item-center"
  269. v-for="(itemList,idx) in items.two_oddsData"
  270. :key="itemList.id"
  271. >
  272. <!-- 独赢 -->
  273. <!-- <div v-if="itemList.odds_code == 'ch' || itemList.odds_code == 'cg'">
  274. <p
  275. class="singleAndDouble-list-btn hover home dishes"
  276. :class="{col:itemList.isTrue,rising:itemList.change == 'rising',falling:itemList.change == 'falling'}"
  277. v-if="itemList.odds_code == 'ch'"
  278. @click="selection(index,i,idx,itemList.id,itemList.p_code,items.match_id,items.home_team,items.guest_team,items.home_team,'滚球','all')"
  279. >{{itemList.odds}}</p>
  280. <p
  281. class="singleAndDouble-list-btn hover guest dishes"
  282. :class="{col:itemList.isTrue,rising:itemList.change == 'rising',falling:itemList.change == 'falling'}"
  283. v-if="itemList.odds_code == 'cg'"
  284. @click="selection(index,i,idx,itemList.id,itemList.p_code,items.match_id,items.home_team,items.guest_team,items.guest_team,'滚球','all')"
  285. >{{itemList.odds}}</p>
  286. </div> -->
  287. <!-- 让盘 -->
  288. <div v-if="itemList.odds_code.startsWith('ld')">
  289. <p
  290. class="singleAndDouble-list-btn hover home dishes"
  291. :class="{col:itemList.isTrue,rising:itemList.change == 'rising',falling:itemList.change == 'falling'}"
  292. v-if="itemList.odds_code == 'ldh'"
  293. @click="selection(index,i,idx,itemList.id,itemList.p_code,items.match_id,items.home_team,items.guest_team,items.home_team,'滚球','two')"
  294. >{{itemList.odds}}</p>
  295. <p
  296. class="singleAndDouble-list-btn hover guest dishes"
  297. :class="{col:itemList.isTrue,rising:itemList.change == 'rising',falling:itemList.change == 'falling'}"
  298. v-if="itemList.odds_code == 'ldg'"
  299. @click="selection(index,i,idx,itemList.id,itemList.p_code,items.match_id,items.home_team,items.guest_team,items.guest_team,'滚球','two')"
  300. >{{itemList.odds}}</p>
  301. </div>
  302. <!-- 让局 -->
  303. <div v-if="itemList.odds_code.startsWith('lb')">
  304. <p
  305. class="singleAndDouble-list-btn hover home concede"
  306. :class="{col:itemList.isTrue,rising:itemList.change == 'rising',falling:itemList.change == 'falling'}"
  307. v-if="itemList.odds_code == 'ldh'"
  308. @click="selection(index,i,idx,itemList.id,itemList.p_code,items.match_id,items.home_team,items.guest_team,items.home_team,'滚球','two')"
  309. >{{itemList.odds}}</p>
  310. <p
  311. class="singleAndDouble-list-btn hover guest concede"
  312. :class="{col:itemList.isTrue,rising:itemList.change == 'rising',falling:itemList.change == 'falling'}"
  313. v-if="itemList.odds_code == 'ldh'"
  314. @click="selection(index,i,idx,itemList.id,itemList.p_code,items.match_id,items.home_team,items.guest_team,items.guest_team,'滚球','two')"
  315. >{{itemList.odds}}</p>
  316. </div>
  317. <!-- 大小 -->
  318. <div v-if="itemList.odds_code.startsWith('tn')">
  319. <p
  320. class="singleAndDouble-list-btn hover home total"
  321. :class="{col:itemList.isTrue,rising:itemList.change == 'rising',falling:itemList.change == 'falling'}"
  322. v-if="itemList.odds_code == 'tnb'"
  323. @click="selection(index,i,idx,itemList.id,itemList.p_code,items.match_id,items.home_team,items.guest_team,items.home_team,'滚球','two')"
  324. >{{itemList.odds}}</p>
  325. <p
  326. class="singleAndDouble-list-btn hover guest total"
  327. :class="{col:itemList.isTrue,rising:itemList.change == 'rising',falling:itemList.change == 'falling'}"
  328. v-if="itemList.odds_code == 'tns'"
  329. @click="selection(index,i,idx,itemList.id,itemList.p_code,items.match_id,items.home_team,items.guest_team,items.guest_team,'滚球','two')"
  330. >{{itemList.odds}}</p>
  331. </div>
  332. </div>
  333. </div>
  334. </div>
  335. <div v-if="items.result_mark" style="height:.5rem;" class="row item-center pdg20 allAlignment">
  336. <div style="font-size:.14rem; color:#666;" class="tennisRollBall-list-footer-num">
  337. <span :class="{chageColor :items.result_mark.schedule[items.result_mark.schedule.length-1] == 1}" >{{items.result_mark.sc_1th_H}}-{{items.result_mark.sc_1th_C}}</span>
  338. <span :class="{chageColor :items.result_mark.schedule[items.result_mark.schedule.length-1]== 2 }" >{{items.result_mark.sc_2th_H}}-{{items.result_mark.sc_2th_C}}</span>
  339. <span :class="{chageColor :items.result_mark.schedule[items.result_mark.schedule.length-1]== 3 }" >{{items.result_mark.sc_3th_H}}-{{items.result_mark.sc_3th_C}}</span>
  340. <span :class="{chageColor :items.result_mark.schedule[items.result_mark.schedule.length-1]== 4 }" v-if="items.result_mark.best == 5" style="color:#F76649">{{items.result_mark.sc_4th_H}}-{{items.result_mark.sc_4th_C}}</span>
  341. <span :class="{chageColor :items.result_mark.schedule[items.result_mark.schedule.length-1]== 5 }" v-if="items.result_mark.best == 5" style="color:#F76649">{{items.result_mark.c_5th_H}}-{{items.result_mark.sc_5th_C}}</span>
  342. </div>
  343. <div style="color:#666;">
  344. <span v-if="items.result_mark.best == 3">三盘两胜</span>
  345. <span v-else="items.result_mark.best == 5">五盘三胜</span>
  346. |
  347. <span>总局数</span>
  348. <span style="color:#F76649">{{items.result_mark.game_num_H}} - {{items.result_mark.game_num_C}}({{items.result_mark.game_num_H*1 + items.result_mark.game_num_C*1}})</span>
  349. </div>
  350. </div>
  351. </div>
  352. </div>
  353. <div v-if="noData">
  354. <noData />
  355. </div>
  356. </div>
  357. </template>
  358. <script>
  359. import noData from "@/components/noData";
  360. export default {
  361. name: "tennisRollBall",
  362. components: {
  363. noData
  364. },
  365. data() {
  366. return {
  367. serchTxt: "",
  368. pCode: this.$store.getters.getPaly_code,
  369. activity: this.$store.getters.getActivity, //传入接口的值
  370. ballCode: this.$store.getters.getBallCode,
  371. noData: false, //暂无数据显示
  372. timers: true, //轮询开关
  373. lg_id: "", //联赛
  374. data: [],
  375. limit: "" //投注数据长度
  376. };
  377. },
  378. /**
  379. * 组件内函数方法
  380. */
  381. methods: {
  382. getTournamentPlay(match_id) {
  383. this.$store.dispatch("MACTH_ID", match_id);
  384. this.$store.dispatch("SET_CONTROLROUTING", 10014);
  385. },
  386. getAjax(lg_id, search) {
  387. if (this.$store.getters.getActivity == "StStringScene") {
  388. this.$store.dispatch("SET_BETTINGTYPE", 2);
  389. } else {
  390. this.$store.dispatch("SET_BETTINGTYPE", 1);
  391. }
  392. this.$http
  393. .get(this.$ports.home.gameList, {
  394. type: this.activity,
  395. game_code: this.ballCode
  396. })
  397. .then(res => {
  398. // console.log('res',res)
  399. if (res.data.data.length > 0 && res.data.status == 1) {
  400. this.data = res.data.data[0];
  401. console.log('滚球数据',this.data);
  402. this.noData = false;
  403. this.dataJosn(this.data);
  404. this.dataGroup(this.data);
  405. } else {
  406. this.noData = true;
  407. this.noShow = false;
  408. }
  409. this.$store.dispatch("GETLOADING", false);
  410. });
  411. },
  412. //
  413. dataJosn(data){
  414. data.forEach(e=>{
  415. e.matchData.forEach(res=>{
  416. res.result_mark = JSON.parse(res.result_mark);
  417. console.log(res.result_mark)
  418. })
  419. })
  420. },
  421. // 轮询之后添加数据选中效果
  422. dataGroup(data) {
  423. let betting = this.$store.getters.getBetting;
  424. if (betting != null && betting.length > 0) {
  425. data.forEach(e => {
  426. e.matchData.forEach(k => {
  427. if (
  428. k.full_oddsData != null &&
  429. k.full_oddsData != undefined &&
  430. k.full_oddsData.length > 0
  431. ) {
  432. k.full_oddsData.forEach(item => {
  433. betting.forEach(i => {
  434. i.data.forEach(j => {
  435. if (item.id == j.id) {
  436. item.isTrue = true;
  437. }
  438. });
  439. });
  440. });
  441. }
  442. if (
  443. k.one_oddsData != null &&
  444. k.one_oddsData != undefined &&
  445. k.one_oddsData.length > 0
  446. ) {
  447. k.one_oddsData.forEach(item => {
  448. betting.forEach(i => {
  449. i.data.forEach(j => {
  450. if (item.id == j.id) {
  451. item.isTrue = true;
  452. }
  453. });
  454. });
  455. });
  456. }
  457. if (
  458. k.two_oddsData != null &&
  459. k.two_oddsData != undefined &&
  460. k.two_oddsData.length > 0
  461. ) {
  462. k.two_oddsData.forEach(item => {
  463. betting.forEach(i => {
  464. i.data.forEach(j => {
  465. if (item.id == j.id) {
  466. item.isTrue = true;
  467. }
  468. });
  469. });
  470. });
  471. }
  472. });
  473. });
  474. }
  475. },
  476. //
  477. /**
  478. * 处理选中样式
  479. * index data下标
  480. * i 第二层下标
  481. * id 玩法ID
  482. * status all 为全场 one 为第一场 two 为第二场
  483. */
  484. selChange(index, i, id, status) {
  485. if (this.limit < 10) {
  486. if (status == "all") {
  487. this.data[index].matchData[i].full_oddsData.forEach(res => {
  488. if (res.id == id) {
  489. this.$forceUpdate();
  490. this.$set(res, "isTrue", res.isTrue ? false : true);
  491. }
  492. });
  493. } else if (status == "one") {
  494. this.data[index].matchData[i].one_oddsData.forEach(res => {
  495. if (res.id == id) {
  496. this.$forceUpdate();
  497. this.$set(res, "isTrue", res.isTrue ? false : true);
  498. }
  499. });
  500. } else if (status == "two") {
  501. this.data[index].matchData[i].two_oddsData.forEach(res => {
  502. if (res.id == id) {
  503. this.$forceUpdate();
  504. this.$set(res, "isTrue", res.isTrue ? false : true);
  505. }
  506. });
  507. }
  508. } else {
  509. if (status == "all") {
  510. this.data[index].matchData[i].full_oddsData.forEach(item => {
  511. if (item.id == id) {
  512. this.$set(item, "isTrue", false);
  513. }
  514. });
  515. } else if (status == "one") {
  516. this.data[index].matchData[i].one_oddsData.forEach(item => {
  517. if (item.id == id) {
  518. this.$set(item, "isTrue", false);
  519. }
  520. });
  521. } else if (status == "two") {
  522. this.data[index].matchData[i].two_oddsData.forEach(item => {
  523. if (item.id == id) {
  524. this.$set(item, "isTrue", false);
  525. }
  526. });
  527. }
  528. }
  529. },
  530. // 选中添加投注数据
  531. selection(
  532. index,
  533. i,
  534. idx,
  535. id,
  536. p_code,
  537. match_id,
  538. homeName,
  539. guestName,
  540. name,
  541. playName,
  542. status
  543. ) {
  544. // console.log(idx,i,index,id,p_code,match_id,homeName,guestName,name,playName,status)
  545. let ballId = this.$store.getters.getBallCode;
  546. let acty = this.$store.getters.getActivity;
  547. let betting = this.$store.getters.getBetting;
  548. let data = this.data;
  549. let isAre = true;
  550. let isAdd = true,
  551. isAlert = false;
  552. let obj = {
  553. title: p_code,
  554. data: ""
  555. };
  556. if (status == "all") {
  557. data[index].matchData[i].full_oddsData[idx].home_team = homeName;
  558. data[index].matchData[i].full_oddsData[idx].guest_team = guestName;
  559. data[index].matchData[i].full_oddsData[idx].playName = playName;
  560. data[index].matchData[i].full_oddsData[idx].name = name;
  561. data[index].matchData[i].full_oddsData[idx].ballId = ballId;
  562. obj.data = [this.data[index].matchData[i].full_oddsData[idx]];
  563. } else if (status == "one") {
  564. data[index].matchData[i].one_oddsData[idx].home_team = homeName;
  565. data[index].matchData[i].one_oddsData[idx].guest_team = guestName;
  566. data[index].matchData[i].one_oddsData[idx].playName = playName;
  567. data[index].matchData[i].one_oddsData[idx].name = name;
  568. data[index].matchData[i].one_oddsData[idx].ballId = ballId;
  569. obj.data = [this.data[index].matchData[i].one_oddsData[idx]];
  570. } else if (status == "two") {
  571. data[index].matchData[i].two_oddsData[idx].home_team = homeName;
  572. data[index].matchData[i].two_oddsData[idx].guest_team = guestName;
  573. data[index].matchData[i].two_oddsData[idx].playName = playName;
  574. data[index].matchData[i].two_oddsData[idx].name = name;
  575. data[index].matchData[i].two_oddsData[idx].ballId = ballId;
  576. obj.data = [this.data[index].matchData[i].two_oddsData[idx]];
  577. }
  578. // console.log("limit", this.limit);
  579. // if(this.limit < 10){
  580. if (betting.length > 0) {
  581. betting.forEach(e => {
  582. if (e.title == p_code) {
  583. e.data.forEach((res, num) => {
  584. if (res.id == id) {
  585. e.data.splice(num, 1);
  586. isAdd = false;
  587. }
  588. });
  589. if (isAdd) {
  590. if (this.limit >= 10) {
  591. this.$dialog.toast({
  592. mes: "亲,超出表格上限啦。",
  593. timeout: 2000
  594. });
  595. } else {
  596. if (status == "all") {
  597. e.data.push(this.data[index].matchData[i].full_oddsData[idx]);
  598. } else if (status == "one") {
  599. e.data.push(this.data[index].matchData[i].one_oddsData[idx]);
  600. } else if (status == "two") {
  601. e.data.push(this.data[index].matchData[i].two_oddsData[idx]);
  602. }
  603. }
  604. }
  605. isAre = false;
  606. }
  607. });
  608. if (isAre) {
  609. if (this.limit >= 10) {
  610. this.$dialog.toast({ mes: "亲,超出表格上限啦。", timeout: 2000 });
  611. } else {
  612. betting.push(obj);
  613. }
  614. }
  615. } else {
  616. betting.push(obj);
  617. }
  618. this.selChange(index, i, id, status);
  619. this.$store.dispatch("SET_BETTING", []);
  620. this.$store.dispatch("SET_BETTING", betting);
  621. // console.log(this.$store.getters.getBetting)
  622. // }
  623. // else{
  624. // this.$dialog.toast({ mes: "亲,超出表格上限啦。", timeout: 2000 });
  625. // }
  626. },
  627. //搜索按钮被点击
  628. Serch() {
  629. if (this.serchTxt === "") {
  630. this.$dialog.toast({ mes: "请输入您想要搜索的内容。", timeout: 2000 });
  631. return false;
  632. } else {
  633. this.data = [];
  634. this.$store.dispatch("SET_LEAGUEDATA", []); //需要拷贝
  635. this.getAjax("", this.serchTxt); //需要拷贝
  636. }
  637. },
  638. // 删除搜索框内容
  639. clearSerchTxt() {
  640. if (this.serchTxt != "") {
  641. this.data = [];
  642. this.serchTxt = "";
  643. this.$store.dispatch("SET_LEAGUEDATA", []); //需要拷贝
  644. this.getAjax();
  645. }
  646. },
  647. // 刷新
  648. red() {
  649. this.$store.dispatch("SET_LEAGUEDATA", []); //需要拷贝
  650. if (this.serchTxt.length > 0) {
  651. this.Serch();
  652. } else {
  653. this.data = "";
  654. this.getAjax();
  655. }
  656. },
  657. //跳转到联赛选择页
  658. elasticFrame() {
  659. this.$store.dispatch("SET_CONTROLROUTING", 10014);
  660. }
  661. },
  662. mounted() {
  663. this.$store.dispatch("SET_BETTING", []);
  664. //获取选择的联赛id
  665. if (this.$store.getters.getLeagueData.length > 0) {
  666. if (this.$store.getters.getLeagueData.length == 1) {
  667. this.lg_id = this.$store.getters.getLeagueData[0];
  668. } else {
  669. this.lg_id = this.$store.getters.getLeagueData.join(",");
  670. }
  671. }
  672. this.getAjax(this.lg_id);
  673. let _this = this;
  674. this.$public.ajaxTimerFun(timing => {
  675. if (_this.timers) {
  676. _this.getAjax(_this.lg_id, _this.serchTxt);
  677. } else {
  678. clearInterval(timing);
  679. }
  680. });
  681. },
  682. computed: {
  683. getActy() {
  684. return this.$store.getters.getActivity;
  685. },
  686. // 单个删除
  687. getDeleteType() {
  688. return this.$store.getters.getDeleteType;
  689. },
  690. // 获取投注数量
  691. getLimit() {
  692. return this.$store.getters.getLimit;
  693. }
  694. },
  695. watch: {
  696. getActy(val) {
  697. // this.activity = val;
  698. this.getAJAX();
  699. this.$store.dispatch("SET_BETTING", []);
  700. },
  701. getDeleteType(val) {
  702. let jumpOut = false;
  703. for (var i = 0; i < this.data.length; i++) {
  704. for (var k = 0; k < this.data[i].matchData.length; k++) {
  705. if (
  706. this.data[i].matchData[k].one_oddsData &&
  707. this.data[i].matchData[k].one_oddsData.length > 0
  708. ) {
  709. for (
  710. var j = 0;
  711. j < this.data[i].matchData[k].one_oddsData.length;
  712. j++
  713. ) {
  714. if (this.data[i].matchData[k].one_oddsData[j].id == val) {
  715. this.$forceUpdate();
  716. this.data[i].matchData[k].one_oddsData[j].isTrue = false;
  717. jumpOut = true;
  718. break;
  719. }
  720. }
  721. }
  722. for (
  723. var j = 0;
  724. j < this.data[i].matchData[k].full_oddsData.length;
  725. j++
  726. ) {
  727. if (this.data[i].matchData[k].full_oddsData[j].id == val) {
  728. this.$forceUpdate();
  729. this.data[i].matchData[k].full_oddsData[j].isTrue = false;
  730. jumpOut = true;
  731. break;
  732. }
  733. }
  734. if (
  735. this.data[i].matchData[k].two_oddsData &&
  736. this.data[i].matchData[k].two_oddsData.length > 0
  737. ) {
  738. for (
  739. var j = 0;
  740. j < this.data[i].matchData[k].two_oddsData.length;
  741. j++
  742. ) {
  743. if (this.data[i].matchData[k].two_oddsData[j].id == val) {
  744. this.$forceUpdate();
  745. this.data[i].matchData[k].two_oddsData[j].isTrue = false;
  746. jumpOut = true;
  747. break;
  748. }
  749. }
  750. }
  751. if (jumpOut == true) {
  752. break;
  753. }
  754. }
  755. if (jumpOut == true) {
  756. break;
  757. }
  758. }
  759. },
  760. getLimit(val) {
  761. // console.log("val", val);
  762. this.limit = val;
  763. if (val == 0) {
  764. this.data.forEach(e => {
  765. e.matchData.forEach(k => {
  766. if (
  767. k.full_oddsData != null &&
  768. k.full_oddsData != undefined &&
  769. k.full_oddsData.length > 0
  770. ) {
  771. k.full_oddsData.forEach(item => {
  772. this.$forceUpdate();
  773. item.isTrue = false;
  774. });
  775. }
  776. if (
  777. k.one_oddsData != null &&
  778. k.one_oddsData != undefined &&
  779. k.one_oddsData.length > 0
  780. ) {
  781. k.one_oddsData.forEach(item => {
  782. this.$forceUpdate();
  783. item.isTrue = false;
  784. });
  785. }
  786. if (
  787. k.two_oddsData != null &&
  788. k.two_oddsData != undefined &&
  789. k.two_oddsData.length > 0
  790. ) {
  791. k.two_oddsData.forEach(item => {
  792. this.$forceUpdate();
  793. item.isTrue = false;
  794. });
  795. }
  796. });
  797. });
  798. }
  799. }
  800. },
  801. beforeDestroy() {
  802. this.timers = false;
  803. }
  804. };
  805. </script>
  806. <style scoped>
  807. .pdg20 {
  808. padding: 0 0.2rem;
  809. }
  810. .tennisRollBall-title {
  811. height: 0.5rem;
  812. color: #fff;
  813. background: #aaa;
  814. }
  815. .tennisRollBall-title-list {
  816. background: #fff;
  817. font-size: 0.14rem;
  818. }
  819. .tennisRollBall-title-list-title {
  820. height: 0.5rem;
  821. background: #e5e5e5;
  822. color: #666;
  823. cursor: pointer;
  824. }
  825. .tennisRollBall-title-list-title-num::after {
  826. border-width: 0.05rem;
  827. border-left-color: #e5e5e5;
  828. border-top-color: #e5e5e5;
  829. left: 42%;
  830. bottom: -0.05rem;
  831. transform: rotate(45deg);
  832. }
  833. .serch {
  834. width: 100%;
  835. height: 0.5rem;
  836. background: #aaa;
  837. padding: 0 0.2rem;
  838. }
  839. input {
  840. border: none;
  841. background: #efefef;
  842. padding-left: 0.2rem;
  843. width: 4.6rem;
  844. height: 0.3rem;
  845. border-radius: 0.05rem 0 0 0.05rem;
  846. }
  847. .serch-img {
  848. width: 0.5rem;
  849. height: 0.3rem;
  850. background: #666;
  851. border-radius: 0 0.05rem 0.05rem 0;
  852. margin-right: 0.3rem;
  853. }
  854. .all {
  855. width: 1.2rem;
  856. height: 0.3rem;
  857. background: #ddd;
  858. color: #333;
  859. }
  860. .chageColor{
  861. color:#f76649 !important;
  862. }
  863. .clear {
  864. width: 0.6rem;
  865. height: 0.3rem;
  866. background: #666;
  867. color: #ccc;
  868. margin-right: 0.1rem;
  869. }
  870. .redraw {
  871. width: 0.3rem;
  872. height: 0.3rem;
  873. background: #666;
  874. }
  875. img {
  876. width: 0.2rem;
  877. height: 0.2rem;
  878. }
  879. .br05 {
  880. border-radius: 0.05rem;
  881. }
  882. .fz14 {
  883. font-size: 0.14rem;
  884. }
  885. .hover:hover {
  886. background: #bbb;
  887. color: #fff;
  888. }
  889. .pointer {
  890. cursor: pointer;
  891. }
  892. .tennisRollBall-list-name p {
  893. width: 100%;
  894. }
  895. .tennisRollBall-list-name p span {
  896. display: inline-block;
  897. width: 0.08rem;
  898. height: 0.08rem;
  899. border-radius: 50%;
  900. }
  901. .right-img {
  902. width: 0.15rem;
  903. position: absolute;
  904. right: 0rem;
  905. bottom: 0.1rem;
  906. }
  907. .right-img img {
  908. width: 0.22rem;
  909. height: 0.2rem;
  910. }
  911. .singleAndDouble-list-btn {
  912. width: 0.48rem;
  913. height: 0.3rem;
  914. border: 0.01rem solid #ccc;
  915. line-height: 0.3rem;
  916. text-align: center;
  917. border-radius: 0.05rem;
  918. cursor: pointer;
  919. }
  920. .tennisRollBall-list-footer-num span {
  921. margin-right: 0.1rem;
  922. }
  923. .hover:hover {
  924. background: #bbb;
  925. color: #fff;
  926. }
  927. .home {
  928. position: absolute;
  929. bottom: 55%;
  930. }
  931. .guest {
  932. position: absolute;
  933. bottom: 12%;
  934. }
  935. .dishes {
  936. left: 28%;
  937. }
  938. .concede {
  939. left: 55%;
  940. }
  941. .total {
  942. left: 85%;
  943. }
  944. .col {
  945. border-radius: 2px;
  946. background: #f76649;
  947. color: #fff;
  948. }
  949. </style>