9af15b5fc5f26e423816f115e9dc3781a2fe4324.svn-base 32 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367368369370371372373374375376377378379380381382383384385386387388389390391392393394395396397398399400401402403404405406407408409410411412413414415416417418419420421422423424425426427428429430431432433434435436437438439440441442443444445446447448449450451452453454455456457458459460461462463464465466467468469470471472473474475476477478479480481482483484485486487488489490491492493494495496497498499500501502503504505506507508509510511512513514515516517518519520521522523524525526527528529530531532533534535536537538539540541542543544545546547548549550551552553554555556557558559560561562563564565566567568569570571572573574575576577578579580581582583584585586587588589590591592593594595596597598599600601602603604605606607608609610611612613614615616617618619620621622623624625626627628629630631632633634635636637638639640641642643644645646647648649650651652653654655656657658659660661662663664665666667668669670671672673674675676677678679680681682683684685686687688689690691692693694695696697698699700701702703704705706707708709710711712713714715716717718719720721722723724725726727728729730731732733734735736737738739740741742743744745746747748749750751752753754755756757758759760761762763764765766767768769770771772773774775776777778779780781782783784785786787788789790791792793794795796797798799800801802803804805806807808809810811812813814815816817818819820821822823824825826827828829830831832833834835836837838839840841842843844845846847848849850851852853854855856857858
  1. <template>
  2. <div>
  3. <div>
  4. <div class="Serch row item-center">
  5. <div class="Soccer-game row item-center">
  6. <div
  7. style=" display:flex;align-items:center;justify-content:center;"
  8. class="Soccer-game-title"
  9. @click="isreturn()"
  10. >
  11. <img class="box-img" src="../assets/st-imges/returnbox.png">
  12. {{this.title}}
  13. </div>
  14. </div>
  15. <div class="Serch-box row item-center">
  16. <div class="Serch-box-home row item-center">
  17. <img class="Serch-box-img" src="../assets/st-imges/sousuo.png">
  18. <input
  19. v-model="SerchValue"
  20. @keydown="serchchange(SerchValue)"
  21. @input="searchTeam(SerchValue)"
  22. class="Serch-box-input"
  23. type="text"
  24. placeholder="请输入球队名称"
  25. >
  26. <img
  27. class="Serch-box-del"
  28. @click="delinputvalue()"
  29. v-if="Serchchange==true"
  30. src="../assets/st-imges/del.png"
  31. >
  32. </div>
  33. </div>
  34. </div>
  35. </div>
  36. <div>
  37. <div v-for="(ite,$index) in data" :key="ite.id">
  38. <div class="row allAlignment box center">
  39. <span>{{ite.name_chinese}}</span>
  40. <div class="Match-title-num">
  41. <span>{{ite.count}}</span>
  42. </div>
  43. </div>
  44. <!-- 足球与篮球 -->
  45. <div v-if="ballSelt == 10" v-for=" (item,index) in ite.match_info" :key="index" class="Match-box">
  46. <div class="row allAlignment Match-box-top">
  47. <div class="Match-box-top-left">
  48. <span>{{item.match_date}}</span>
  49. <span>{{item.match_time}}</span>
  50. </div>
  51. <div class="Match-box-top-right row">
  52. <span style="margin-right: .15rem;" class="Match-box-top-num">{{item.tag}}</span>
  53. <span style="margin-right: .15rem;">让球</span>
  54. <span style="margin-right: .15rem;">大小</span>
  55. </div>
  56. </div>
  57. <div
  58. class="row allAlignment center"
  59. @click="matchInfo(item.match_id);"
  60. style="padding:0 .32rem"
  61. >
  62. <div class="column average name-box">
  63. <div>{{item.home_team}}</div>
  64. <div>{{item.guest_team}}</div>
  65. </div>
  66. <div class="Match-bottom-right">
  67. <!-- 主队 -->
  68. <!-- @click.stop="isBetting($index,item.match_id, items.id,item.home_team,item.guest_team,item.home_team,items.odds,items.condition,items.odds_only,items.odds_code,'homeOdds',items.p_code,items.status)" -->
  69. <!-- class="Match-list-left" -->
  70. <!-- <div> -->
  71. <div
  72. v-for="(items,indexs) in item.oddsData"
  73. :key="indexs"
  74. >
  75. <div class="" v-if="items.odds_code.startsWith('co')">
  76. <div :class="{active:items.isTrue,increased_color:items.change == 'add',reduce_color:items.change == 'red'}" class="letballHome" v-if="items.odds_code.endsWith('h')" @click.stop="isBetting($index,item.match_id, items.id,item.home_team,item.guest_team,item.home_team,items.odds,items.condition,items.odds_only,items.odds_code,'homeOdds',items.p_code,items.status,ite.lg_id,'让球')">
  77. <span style="color: rgb(247, 102, 73); " v-if="items.odds > 0">{{items.condition}}</span>
  78. <span v-if="items.odds >0" :class="items.condition == '' ? 'mg':''">{{items.odds}}</span>
  79. <img v-if="items.odds <= 0" style="width: 0.7rem;height: 0.5rem;" src="@/assets/st-imges/mima.png"><img>
  80. </div>
  81. <div :class="{active:items.isTrue,increased_color:items.change == 'add',reduce_color:items.change == 'red'}" class="letballGuest" v-if="items.odds_code.endsWith('g')" @click.stop="isBetting($index,item.match_id, items.id,item.home_team,item.guest_team,item.home_team,items.odds,items.condition,items.odds_only,items.odds_code,'homeOdds',items.p_code,items.status,ite.lg_id,'让球')">
  82. <span style="color: rgb(247, 102, 73); " v-if="items.odds > 0">{{items.condition}}</span>
  83. <span v-if="items.odds >0" :class="items.condition == '' ? 'mg':''">{{items.odds}}</span>
  84. <img v-if="items.odds <= 0" style="width: 0.7rem;height: 0.5rem;" src="@/assets/st-imges/mima.png"><img>
  85. </div>
  86. </div>
  87. <div v-if="items.odds_code.startsWith('gs')" class="row bigSmall" @click.stop="isBetting($index,item.match_id, items.id,item.home_team,item.guest_team,item.home_team,items.odds,items.condition,items.odds_only,items.odds_code,'goal_size',items.p_code,items.status,ite.lg_id,'大小')">
  88. <div :class="{active:items.isTrue,increased_color:items.change == 'add',reduce_color:items.change == 'red'}" class="bigHome" v-if="items.odds_code.endsWith('b')">
  89. <div style="color: rgb(247, 102, 73); " class="stardBig" v-if="items.odds > 0">
  90. <span class="bigSmall">大</span>
  91. <span>{{items.condition}}</span>
  92. </div>
  93. <span v-if="items.odds >0" :class="items.condition == '' ? 'mg':''">{{items.odds}}</span>
  94. <img v-if="items.odds <= 0" style="width: 0.7rem;height: 0.5rem;" src="@/assets/st-imges/mima.png"><img>
  95. </div>
  96. <div :class="{active:items.isTrue,increased_color:items.change == 'add',reduce_color:items.change == 'red'}" class="bigGuest" v-if="items.odds_code.endsWith('s')" @click.stop="isBetting($index,item.match_id, items.id,item.home_team,item.guest_team,item.home_team,items.odds,items.condition,items.odds_only,items.odds_code,'goal_size',items.p_code,items.status,ite.lg_id,'大小')">
  97. <div style="color: rgb(247, 102, 73); " class="stardBig" v-if="items.odds > 0">
  98. <span class="bigSmall">小</span>
  99. <span>{{items.condition}}</span>
  100. </div>
  101. <span v-if="items.odds >0" :class="items.condition == '' ? 'mg':''">{{items.odds}}</span>
  102. <img v-if="items.odds <= 0" style="width: 0.7rem;height: 0.5rem;" src="@/assets/st-imges/mima.png"><img>
  103. </div>
  104. </div>
  105. <div v-if="items.odds_code.startsWith('total')" class="row bigSmall" @click.stop="isBetting($index,item.match_id, items.id,item.home_team,item.guest_team,item.home_team,items.odds,items.condition,items.odds_only,items.odds_code,'total_size',items.p_code,items.status,ite.lg_id,'大小')">
  106. <div :class="{active:items.isTrue,increased_color:items.change == 'add',reduce_color:items.change == 'red'}" class="bigHome" v-if="items.odds_code.endsWith('big')">
  107. <div style="color: rgb(247, 102, 73); " class="stardBig" v-if="items.odds > 0">
  108. <span class="bigSmall">大</span>
  109. <span>{{items.condition}}</span>
  110. </div>
  111. <span v-if="items.odds >0" :class="items.condition == '' ? 'mg':''">{{items.odds}}</span>
  112. <img v-if="items.odds <= 0" style="width: 0.7rem;height: 0.5rem;" src="@/assets/st-imges/mima.png"><img>
  113. </div>
  114. <div :class="{active:items.isTrue,increased_color:items.change == 'add',reduce_color:items.change == 'red'}" class="bigGuest" v-if="items.odds_code.endsWith('small')" @click.stop="isBetting($index,item.match_id, items.id,item.home_team,item.guest_team,item.home_team,items.odds,items.condition,items.odds_only,items.odds_code,'total_size',items.p_code,items.status,ite.lg_id,'大小')">
  115. <div style="color: rgb(247, 102, 73); " class="stardBig" v-if="items.odds > 0">
  116. <span class="bigSmall">小</span>
  117. <span>{{items.condition}}</span>
  118. </div>
  119. <span v-if="items.odds >0" :class="items.condition == '' ? 'mg':''">{{items.odds}}</span>
  120. <img v-if="items.odds <= 0" style="width: 0.7rem;height: 0.5rem;" src="@/assets/st-imges/mima.png"><img>
  121. </div>
  122. </div>
  123. </div>
  124. </div>
  125. </div>
  126. </div>
  127. <!-- 网球 -->
  128. <div v-if="ballSelt == 100" v-for=" (item,index) in ite.match_info" :key="index" class="Match-box">
  129. <div class="row allAlignment Match-box-top wqMatch-box">
  130. <div class="Match-box-top-left">
  131. <span>{{item.match_date}}</span>
  132. <span style="color: rgb(253, 143, 38);">{{item.match_time}}</span>
  133. <!-- <div>三盘两胜</div> -->
  134. </div>
  135. <div class="Match-box-top-right row">
  136. <span style="margin-right: .15rem;height:100%;line-height:0.6rem;" class="Match-box-top-num">{{item.tag}}</span>
  137. <span style="margin-right: .15rem;">独赢盘</span>
  138. <span style="margin-right: .15rem;">让盘</span>
  139. </div>
  140. </div>
  141. <div
  142. class="row allAlignment center"
  143. @click="matchInfo(item.match_id);"
  144. style="padding:0 .32rem"
  145. >
  146. <div class="column average name-box">
  147. <div>{{item.home_team}}</div>
  148. <div>{{item.guest_team}}</div>
  149. </div>
  150. <div class="Match-bottom-right">
  151. <!-- 主队 -->
  152. <div class="" v-for="(items,indexs) in item.oddsData" :key="indexs">
  153. <div class="" v-if="items.odds_code.startsWith('kemp')">
  154. <div :class="{active:items.isTrue,increased_color:items.change == 'add',reduce_color:items.change == 'red'}" class="letballHome" v-if="items.odds_code.endsWith('home')" @click.stop="isBetting($index,item.match_id, items.id,item.home_team,item.guest_team,item.home_team,items.odds,items.condition,items.odds_only,items.odds_code,'kemp',items.p_code,items.status,ite.lg_id,'独赢盘')">
  155. <span style="color: rgb(247, 102, 73); " v-if="items.odds > 0">{{items.condition}}</span>
  156. <span v-if="items.odds >0" :class="items.condition == '' ? 'mg':''">{{items.odds}}</span>
  157. <img v-if="items.odds <= 0" style="width: 0.7rem;height: 0.5rem;" src="@/assets/st-imges/mima.png"><img>
  158. </div>
  159. <div :class="{active:items.isTrue,increased_color:items.change == 'add',reduce_color:items.change == 'red'}" class="letballGuest" v-if="items.odds_code.endsWith('guest')" @click.stop="isBetting($index,item.match_id, items.id,item.home_team,item.guest_team,item.home_team,items.odds,items.condition,items.odds_only,items.odds_code,'kemp',items.p_code,items.status,ite.lg_id,'独赢盘')">
  160. <span style="color: rgb(247, 102, 73); " v-if="items.odds > 0">{{items.condition}}</span>
  161. <span v-if="items.odds >0" :class="items.condition == '' ? 'mg':''">{{items.odds}}</span>
  162. <img v-if="items.odds <= 0" style="width: 0.7rem;height: 0.5rem;" src="@/assets/st-imges/mima.png"><img>
  163. </div>
  164. </div>
  165. <div v-if="items.odds_code.startsWith('dishes')" class="row bigSmall" @click.stop="isBetting($index,item.match_id, items.id,item.home_team,item.guest_team,item.home_team,items.odds,items.condition,items.odds_only,items.odds_code,'dishes',items.p_code,items.status,ite.lg_id,'让盘')">
  166. <div :class="{active:items.isTrue,increased_color:items.change == 'add',reduce_color:items.change == 'red'}" class="bigHome" v-if="items.odds_code.endsWith('home')">
  167. <span style="color: rgb(247, 102, 73); " v-if="items.odds > 0">{{items.condition}}</span>
  168. <span v-if="items.odds >0" :class="items.condition == '' ? 'mg':''">{{items.odds}}</span>
  169. <img v-if="items.odds <= 0" style="width: 0.7rem;height: 0.5rem;" src="@/assets/st-imges/mima.png"><img>
  170. </div>
  171. <div :class="{active:items.isTrue,increased_color:items.change == 'add',reduce_color:items.change == 'red'}" class="bigGuest" v-if="items.odds_code.endsWith('guest')" @click.stop="isBetting($index,item.match_id, items.id,item.home_team,item.guest_team,item.home_team,items.odds,items.condition,items.odds_only,items.odds_code,'dishes',items.p_code,items.status,ite.lg_id,'让盘')">
  172. <span style="color: rgb(247, 102, 73); " v-if="items.odds > 0">{{items.condition}}</span>
  173. <span v-if="items.odds >0" :class="items.condition == '' ? 'mg':''">{{items.odds}}</span>
  174. <img v-if="items.odds <= 0" style="width: 0.7rem;height: 0.5rem;" src="@/assets/st-imges/mima.png"><img>
  175. </div>
  176. </div>
  177. </div>
  178. </div>
  179. </div>
  180. </div>
  181. <!-- 棒球 -->
  182. <div v-if="ballSelt == 1000" v-for=" (item,index) in ite.match_info" :key="index" class="Match-box">
  183. <div class="row allAlignment Match-box-top">
  184. <div class="Match-box-top-left">
  185. <span>{{item.match_date}}</span>
  186. <span>{{item.match_time}}</span>
  187. </div>
  188. <div class="Match-box-top-right row">
  189. <span style="margin-right: .15rem;" class="Match-box-top-num">{{item.tag}}</span>
  190. <span style="margin-right: .15rem;">独赢盘</span>
  191. </div>
  192. </div>
  193. <div
  194. class="row allAlignment center"
  195. @click="matchInfo(item.match_id);"
  196. style="padding:0 .32rem"
  197. >
  198. <div class="column average name-box">
  199. <div>{{item.home_team}}</div>
  200. <div>{{item.guest_team}}</div>
  201. </div>
  202. <div class="Match-bottom-right">
  203. <!-- 主队 -->
  204. <div class="row">
  205. <div
  206. class=""
  207. v-for="(items,indexs) in item.oddsData"
  208. :key="indexs"
  209. >
  210. <div v-if="items.odds_code.startsWith('capot')" class="row bigSmall" @click.stop="isBetting($index,item.match_id, items.id,item.home_team,item.guest_team,item.home_team,items.odds,items.condition,items.odds_only,items.odds_code,'capot',items.p_code,items.status,ite.lg_id,'独赢盘')">
  211. <div :class="{active:items.isTrue,increased_color:items.change == 'add',reduce_color:items.change == 'red'}" class="bigHome" v-if="items.odds_code.endsWith('home')">
  212. <span style="color: rgb(247, 102, 73); " v-if="items.odds > 0">{{items.condition}}</span>
  213. <span v-if="items.odds >0" :class="items.condition == '' ? 'mg':''">{{items.odds}}</span>
  214. <img v-if="items.odds <= 0" style="width: 0.7rem;height: 0.5rem;" src="@/assets/st-imges/mima.png"><img>
  215. </div>
  216. <div :class="{active:items.isTrue,increased_color:items.change == 'add',reduce_color:items.change == 'red'}" class="bigGuest" v-if="items.odds_code.endsWith('guest')" @click.stop="isBetting($index,item.match_id, items.id,item.home_team,item.guest_team,item.home_team,items.odds,items.condition,items.odds_only,items.odds_code,'capot',items.p_code,items.status,'独赢盘')">
  217. <span style="color: rgb(247, 102, 73); " v-if="items.odds > 0">{{items.condition}}</span>
  218. <span v-if="items.odds >0" :class="items.condition == '' ? 'mg':''">{{items.odds}}</span>
  219. <img v-if="items.odds <= 0" style="width: 0.7rem;height: 0.5rem;" src="@/assets/st-imges/mima.png"><img>
  220. </div>
  221. </div>
  222. </div>
  223. </div>
  224. </div>
  225. </div>
  226. </div>
  227. </div>
  228. </div>
  229. <BettingWindow v-show="isBettingWindow == '100'"/>
  230. </div>
  231. </template>
  232. <script>
  233. import BettingWindow from "@/components/StBettingWindow";
  234. import NotOpend from "@/components/StNotOpend";
  235. import Loading from "@/components/StLoading";
  236. export default {
  237. name: "entryForm",
  238. data() {
  239. return {
  240. SerchValue: "",
  241. Serchchange: false,
  242. title:this.$route.query.name, //标题
  243. data: "",
  244. game_code: this.$route.query.game_code, //球的类型别名
  245. lg_id: this.$route.query.lg_id, //获取联赛id
  246. isBettingWindow: '-1',
  247. thisNum: 10000,
  248. info: "没有相关联赛信息",
  249. noData: false, //没有数据为true
  250. betting: [], //vuex里面玩法投注数据
  251. timers : true,
  252. index : '',
  253. getIsShow:true,
  254. ballSelt:0, // 当为10的时候为篮球,足球,100的时候为网球,1000的时候为棒球
  255. // 存储变色数据
  256. previousStorage:[]
  257. };
  258. },
  259. components: {
  260. BettingWindow,
  261. NotOpend,
  262. Loading
  263. },
  264. methods: {
  265. // 返回上一页
  266. isreturn() {
  267. history.go(-1);
  268. },
  269. getmatchInfo(search) {
  270. this.$http
  271. .get(this.$ports.match.participateDtl, {
  272. game_code: this.game_code,
  273. code: this.$route.query.code,
  274. lg_id : this.lg_id,
  275. search
  276. })
  277. .then(res => {
  278. this.codeShow = false;
  279. if (res.data.status == 1) {
  280. // console.log(res.data.data)
  281. this.dataGroup(res.data.data);
  282. // console.log("参赛表单", res.data.data);
  283. // this.data = res.data.data;
  284. }
  285. });
  286. let _this=this;
  287. setTimeout(()=>{
  288. _this.$store.dispatch("GETSHOW", false);
  289. },1000)
  290. },
  291. //是否显示删除按钮
  292. serchchange(val) {
  293. if (val.length >= 1) {
  294. this.Serchchange = true;
  295. } else {
  296. this.Serchchange = false;
  297. }
  298. },
  299. /**
  300. * 查询球队
  301. */
  302. searchTeam(val) {
  303. let getActivity = this.$store.getters.getActivity;
  304. let matchDate = this.$route.query.matchDate;
  305. if (val.length >= 1) {
  306. this.Serchchange = true;
  307. } else {
  308. this.Serchchange = false;
  309. }
  310. this.getmatchInfo(val);
  311. },
  312. //清空输入
  313. delinputvalue() {
  314. this.SerchValue = "";
  315. this.Serchchange = false;
  316. this.getmatchInfo("");
  317. },
  318. /*--------------------------------------------------------------------------------*/
  319. // 添加、删除vuex投注数据公共方法
  320. AddDelete: function(match_id,id, home, guest, name, odds, condition, odds_only,odds_code,type,p_code,$index,lg_id,play_name) {
  321. let isAdd = true,isNew=true;
  322. let matchList = this.$store.getters.getBetting;
  323. if (status == "-1") return false;
  324. let ball = this.$store.getters.getBallId;
  325. // if(ball == 'zq'){
  326. let bettingInfo = {
  327. id,
  328. home_team: home,
  329. guest_team: guest,
  330. name,
  331. odds,
  332. match_id,
  333. condition,
  334. ballId: ball,
  335. odds_code: odds_code,
  336. p_code,
  337. play_name,
  338. score: this.score,
  339. bettingTime: "",
  340. odds_only,
  341. lg_id,
  342. odds_id: id
  343. };
  344. //添加新的玩法赔率数据
  345. let obj = {
  346. title:p_code,
  347. data: [bettingInfo]
  348. };
  349. if(matchList !=null ){
  350. for(let i =0 ;i < matchList.length; i++ ){
  351. if(matchList[i].title == p_code){
  352. //删除vuex投注数据
  353. matchList[i].data.forEach((res, index) => {
  354. // console.log(res.id,id)
  355. if (res.id == id) {
  356. matchList[i].data.splice(index, 1);
  357. this.$store.dispatch("SET_LIMIT", false);
  358. this.$store.dispatch("BETTING", []);
  359. this.$store.dispatch("BETTING", matchList);
  360. isAdd = false;
  361. isNew = false;
  362. //处理当前页面样式
  363. this.modifyStyle($index,id,type);
  364. }
  365. });
  366. //添加vuex投注数据
  367. if (isAdd){
  368. isNew = false;
  369. if (this.$store.getters.getLimit * 1 >= 10) return false;
  370. //处理当前页面样式
  371. this.modifyStyle($index,id,type);
  372. matchList[i].data.push(bettingInfo);
  373. this.$store.dispatch("BETTING",[]);
  374. this.$store.dispatch("BETTING",matchList);
  375. if (this.$store.getters.getIsBetting == "100") return false;
  376. this.$store.dispatch("ISBETTING",100);
  377. }
  378. break;
  379. }
  380. }
  381. if(isNew){
  382. matchList.push(obj)
  383. this.$store.dispatch("BETTING",[]);
  384. this.$store.dispatch("BETTING",matchList);
  385. this.modifyStyle($index,id,type);
  386. if (this.$store.getters.getIsBetting == "100") return false;
  387. this.$store.dispatch("ISBETTING", "100");
  388. }
  389. }else{
  390. this.$store.dispatch("BETTING",[obj]);
  391. this.modifyStyle($index,id,type);
  392. if (this.$store.getters.getIsBetting == "100") return false;
  393. this.$store.dispatch("ISBETTING", "100");
  394. }
  395. },
  396. /*--------------------------------------------------------------------------------*/
  397. //修改当前页面样式公共方法
  398. modifyStyle: function($index,id, type) {
  399. // console.log($index,id, type)
  400. this.data[$index].match_info.every(e => {
  401. let ret = false;
  402. if (type == "homeOdds" || type == 'goal_size' || type == "total_size" || type == 'capot' || type == 'kemp' || type == 'dishes') {
  403. e.oddsData.every((res, index) => {
  404. if (res.id == id) {
  405. this.$set(
  406. res,
  407. "isTrue",
  408. res.isTrue ? false : true
  409. );
  410. ret = true;
  411. return false;
  412. }
  413. return true;
  414. });
  415. } else if (type == "guestOdds") {
  416. e.oddsData.every((res, index) => {
  417. if (res.id == id) {
  418. this.$set(
  419. res,
  420. "isTrue",
  421. res.isTrue ? false : true
  422. );
  423. ret = true;
  424. return false;
  425. }
  426. return true;
  427. });
  428. }
  429. if (ret) {
  430. return false;
  431. } else {
  432. return true;
  433. }
  434. });
  435. },
  436. /*--------------------------------------------------------------------------------*/
  437. // 修改投注样式
  438. isBetting($index,match_id,id, home, guest, name, odds, condition, odds_only,odds_code,type,p_code,status,lg_id,play_name) {
  439. if(status == -1) return false;
  440. this.index = $index;
  441. if (this.data) {
  442. //处理vuex里面数据
  443. this.AddDelete(match_id,id, home, guest, name, odds, condition, odds_only,odds_code,type,p_code,$index,lg_id,play_name);
  444. //处理当前页面样式
  445. // this.modifyStyle($index,id, type);
  446. }
  447. },
  448. //跳转到赛事详情
  449. matchInfo: function(id) {
  450. this.$router.push({
  451. path: "/StRollBallBettingPage",
  452. query: { gameCode: this.game_code, home: 1 }
  453. });
  454. this.$store.dispatch("MACTH_ID", id);
  455. },
  456. /*--------------------------------------------------------------------------------*/
  457. /**
  458. * 赛事赔率玩法数据组合方法
  459. */
  460. dataGroup: function(data) {
  461. //console.log('数据',this.data)
  462. // let homeOdds = [],
  463. // guestOdds = [];
  464. let A, B, C, D;
  465. // console.log('daa',data)
  466. let ball = this.$store.getters.getBallId;
  467. data.forEach(i =>{
  468. i.match_info.forEach((column, index) => {
  469. if (column.oddsData == null || column.oddsData.length == 0) {
  470. }
  471. else {
  472. column.oddsData.forEach(val => {
  473. if(this.betting.length > 0){
  474. this.betting.forEach(e =>{
  475. e.forEach(item =>{
  476. if(val.id == item.id){
  477. val.isTrue = true;
  478. }
  479. })
  480. })
  481. }
  482. });
  483. }
  484. });
  485. })
  486. // console.log('ddddd',data)
  487. this.data = data;
  488. // console.log('data',this.data)
  489. //更新数据和上一次的数据匹配
  490. let storage =this.previousStorage;
  491. // console.log('storege',storage)
  492. if(storage && storage != null && storage.length > 0){
  493. this.data.forEach(e =>{
  494. e.match_info.forEach(k =>{
  495. k.oddsData.forEach(item =>{
  496. storage.forEach(a =>{
  497. a.forEach(b =>{
  498. if(item.id == b.id){
  499. if(item.odds > b.odds){
  500. item.change = 'add'
  501. }else if(item.odds < b.odds){
  502. item.change = 'red';
  503. }else{
  504. item.change = '';
  505. }
  506. }
  507. })
  508. })
  509. })
  510. })
  511. })
  512. }
  513. this.previousStorage = [];
  514. this.data.forEach(e =>{
  515. e.match_info.forEach(k =>{
  516. this.previousStorage.push(k.oddsData)
  517. })
  518. })
  519. // this.previousStorage = this.data;
  520. // console.log('````', this.data)
  521. // console.log('this.previousStorage',this.previousStorage)
  522. this.$store.dispatch('GETGAMERATIO',this.data)
  523. }
  524. },
  525. /**
  526. * 计算属性
  527. */
  528. computed: {
  529. //获取投注框删除的投注信息
  530. getDeleteType() {
  531. return this.$store.getters.getDeleteType;
  532. },
  533. getIsBetting() {
  534. return this.$store.getters.getIsBetting;
  535. }
  536. },
  537. /**
  538. * 监听器
  539. */
  540. watch: {
  541. getIsBetting(val) {
  542. this.isBettingWindow = val;
  543. },
  544. // 监听删除投注
  545. getDeleteType(val) {
  546. let flag = true;
  547. this.data.forEach(e => {
  548. if (val == "all") {
  549. e.match_info.forEach(data => {
  550. data.oddsData.forEach((k, i) => {
  551. this.$set(k, "isTrue", false);
  552. });
  553. data.oddsData.forEach((k, i) => {
  554. this.$set(k, "isTrue", false);
  555. });
  556. });
  557. } else {
  558. let showData = true;
  559. e.match_info.forEach((res, index) => {
  560. res.oddsData.forEach((k, i) => {
  561. if (k.id == val) {
  562. this.$set(k, "isTrue", false);
  563. showData = true;
  564. }
  565. });
  566. });
  567. if(showData){
  568. e.match_info.forEach(data => {
  569. data.oddsData.forEach(item =>{
  570. if (item.id == val) {
  571. this.$set(item, "isTrue", false);
  572. }
  573. })
  574. });
  575. }
  576. }
  577. });
  578. },
  579. },
  580. mounted() {
  581. this.$store.dispatch("GETSHOW", true);
  582. // 获取球类,判定状态
  583. let ball = this.$route.query.game_code;
  584. // 是否展示投注框
  585. if (this.$store.getters.getIsBetting == '100') {
  586. this.isBettingWindow = '100';
  587. }
  588. //获取vuex玩法已投注相对应的数据
  589. let getBetting = this.$store.getters.getBetting;
  590. // if(getBetting){
  591. if(ball == 'zq'){
  592. this.ballSelt = 10;
  593. if(getBetting){
  594. getBetting.forEach((e,index) =>{
  595. if('concede' == e.title || 'goal_size' == e.title){
  596. this.betting.push(e.data);
  597. }
  598. })
  599. }
  600. }else if(ball == 'lq'){
  601. this.ballSelt = 10;
  602. if(getBetting){
  603. getBetting.forEach((e,index) =>{
  604. if('concede' == e.title || 'total_size' == e.title){
  605. this.betting.push(e.data);
  606. }
  607. })
  608. }
  609. }else if(ball == 'bq'){
  610. this.ballSelt = 1000;
  611. if(getBetting){
  612. getBetting.forEach((e,index) =>{
  613. if('capot' == e.title){
  614. this.betting.push(e.data);
  615. }
  616. })
  617. }
  618. }else if(ball == 'wq'){
  619. this.ballSelt = 100;
  620. if(getBetting){
  621. getBetting.forEach((e,index) =>{
  622. if('dishes' == e.title || 'kemp' == e.title){
  623. this.betting.push(e.data);
  624. }
  625. })
  626. }
  627. }
  628. // }
  629. let _this = this;
  630. this.$public.ajaxTimerFun(function(timing) {
  631. if (_this.timers) {
  632. _this.getmatchInfo("");
  633. }else{
  634. clearInterval(timing);
  635. }
  636. },(1000*10));
  637. // console.log("data", this.data);
  638. /*-----------------------*/
  639. this.getmatchInfo("");
  640. },
  641. beforeDestroy(){
  642. this.timers = false;
  643. }
  644. };
  645. </script>
  646. <style scoped>
  647. .Serch {
  648. height: 0.75rem;
  649. display: flex;
  650. justify-content: space-between;
  651. align-items: center;
  652. background-color: #363636;
  653. color: #fd8f26;
  654. font-family: "PingFang-SC-Regular";
  655. padding: 0 0.32rem;
  656. }
  657. .lock {
  658. background: #f4f4f4;
  659. }
  660. .Serch-box-input {
  661. width: 2rem;
  662. border: none;
  663. position: absolute;
  664. left: 0.5rem;
  665. top: 0.06rem;
  666. }
  667. /* .BettingWindow{
  668. z-index: 10000;
  669. position:fixed;
  670. top:0;
  671. width: 100%;
  672. } */
  673. .Serch-box-img {
  674. width: 0.3rem;
  675. height: 0.3rem;
  676. position: absolute;
  677. left: 0.1rem;
  678. top: 0.06rem;
  679. }
  680. .Serch-box-del {
  681. width: 0.2rem;
  682. height: 0.2rem;
  683. position: absolute;
  684. right: 0.2rem;
  685. }
  686. .Serch-box-home {
  687. height: 0.44rem;
  688. width: 4.73rem;
  689. background: #e4e4e4;
  690. border-radius: 0.2rem;
  691. display: flex;
  692. justify-content: space-around;
  693. align-items: center;
  694. padding-left: 0.1rem;
  695. padding-right: 0.1rem;
  696. position: relative;
  697. }
  698. .box-img {
  699. width: 0.37rem;
  700. height: 0.3rem;
  701. margin-right: 0.18rem;
  702. }
  703. .Soccer-game-title {
  704. display: flex;
  705. color: #f76649;
  706. align-items: center;
  707. width: 1.3rem;
  708. font-size: 0.3rem;
  709. }
  710. .Soccer-game-box {
  711. display: flex;
  712. left: -0.3rem;
  713. top: 0.2rem;
  714. background: #fff;
  715. background: #626262;
  716. color: #a6a6a6;
  717. height: 0.7rem;
  718. align-items: center;
  719. }
  720. .Soccer-game-src {
  721. width: 0.25rem;
  722. height: 0.25rem;
  723. }
  724. .box {
  725. padding: 0 0.32rem;
  726. color: #e1e1df;
  727. height: 0.88rem;
  728. font-size: 0.32rem;
  729. background: linear-gradient(to bottom, #999999, #6a6a6b);
  730. }
  731. .Match-title-num {
  732. width: 0.46rem;
  733. height: 0.46rem;
  734. line-height: 0.46rem;
  735. text-align: center;
  736. background: #f76649;
  737. font-size: 0.26rem;
  738. border-radius: 50%;
  739. color: #f5f5f5;
  740. }
  741. .Match-box-top-right > span {
  742. width: 1.07rem;
  743. text-align: center;
  744. }
  745. .Match-box {
  746. /* height: 2.45rem; */
  747. }
  748. .name-box {
  749. width: 4rem;
  750. height: 1.76rem;
  751. }
  752. .Match-box-top {
  753. height: 0.45rem;
  754. line-height: 0.45rem;
  755. background: #dcdcdc;
  756. font-size: 0.23rem;
  757. padding: 0 0.32rem;
  758. }
  759. .Match-box-top-num {
  760. width: 0.64rem !important;
  761. height: 0.45rem;
  762. background: #ebebeb;
  763. font-size: 0.24rem;
  764. }
  765. .Match-box {
  766. background: #f8f8f8;
  767. }
  768. .Match-bottom-right {
  769. height: 2rem;
  770. width: 2.5rem;
  771. padding: 0.1rem 0.1rem 0 0.14rem;
  772. position: relative;
  773. }
  774. .Match-list-left div {
  775. width: 1.07rem;
  776. height: 0.76rem;
  777. border: 1px solid #e4e4e4;
  778. border-radius: 0.1rem;
  779. padding: 0.1rem;
  780. margin: 0.06rem 0.08rem;
  781. }
  782. .Match-list-right div {
  783. width: 1.07rem;
  784. height: 0.76rem;
  785. border: 1px solid #e4e4e4;
  786. border-radius: 0.1rem;
  787. margin: 0.06rem 0.08rem;
  788. }
  789. .active {
  790. background: #f76649;
  791. border: none;
  792. color: #e1e1df !important;
  793. }
  794. .active span,.active i{
  795. color: #e1e1df !important;
  796. }
  797. .wqavg{
  798. width: 4.3rem;
  799. }
  800. div .wqMatch-box{
  801. /* height: 0.65rem;
  802. line-height: 0.3rem; */
  803. }
  804. /* 赔率 */
  805. .letballHome,.letballGuest,.bigHome,.bigGuest{
  806. width: 1.07rem;
  807. height: 0.76rem;
  808. border: 1px solid #e4e4e4;
  809. border-radius: 0.1rem;
  810. margin: 0.06rem 0.08rem;
  811. /* padding: 0.1rem 0; */
  812. /* margin: 0.06rem 0.6rem 0.06rem 0; */
  813. text-align: center;
  814. }
  815. .letballGuest{
  816. position: absolute;
  817. bottom: 0.19rem;
  818. }
  819. .bigHome span,.bigGuest span,.letballHome span,.letballGuest span{
  820. display: block;
  821. }
  822. .bigHome{
  823. position: absolute;
  824. right: 0;
  825. top: 0.1rem;
  826. }
  827. .bigGuest{
  828. position: absolute;
  829. right: 0;
  830. top: 0.93rem;
  831. }
  832. .active span{
  833. color: #e1e1df !important;
  834. }
  835. .stardBig{
  836. display: flex;
  837. align-items: center;
  838. justify-content: center;
  839. }
  840. .stardBig .bigSmall{
  841. color: #9b9999;
  842. }
  843. .mg{
  844. margin-top: 0.2rem;
  845. }
  846. </style>