168d3617ac9bad39c99ae18a44828c999f3bfcd4.svn-base 36 KB

1234567891011121314151617181920212223242526272829303132333435363738394041424344454647484950515253545556575859606162636465666768697071727374757677787980818283848586878889909192939495969798991001011021031041051061071081091101111121131141151161171181191201211221231241251261271281291301311321331341351361371381391401411421431441451461471481491501511521531541551561571581591601611621631641651661671681691701711721731741751761771781791801811821831841851861871881891901911921931941951961971981992002012022032042052062072082092102112122132142152162172182192202212222232242252262272282292302312322332342352362372382392402412422432442452462472482492502512522532542552562572582592602612622632642652662672682692702712722732742752762772782792802812822832842852862872882892902912922932942952962972982993003013023033043053063073083093103113123133143153163173183193203213223233243253263273283293303313323333343353363373383393403413423433443453463473483493503513523533543553563573583593603613623633643653663673683693703713723733743753763773783793803813823833843853863873883893903913923933943953963973983994004014024034044054064074084094104114124134144154164174184194204214224234244254264274284294304314324334344354364374384394404414424434444454464474484494504514524534544554564574584594604614624634644654664674684694704714724734744754764774784794804814824834844854864874884894904914924934944954964974984995005015025035045055065075085095105115125135145155165175185195205215225235245255265275285295305315325335345355365375385395405415425435445455465475485495505515525535545555565575585595605615625635645655665675685695705715725735745755765775785795805815825835845855865875885895905915925935945955965975985996006016026036046056066076086096106116126136146156166176186196206216226236246256266276286296306316326336346356366376386396406416426436446456466476486496506516526536546556566576586596606616626636646656666676686696706716726736746756766776786796806816826836846856866876886896906916926936946956966976986997007017027037047057067077087097107117127137147157167177187197207217227237247257267277287297307317327337347357367377387397407417427437447457467477487497507517527537547557567577587597607617627637647657667677687697707717727737747757767777787797807817827837847857867877887897907917927937947957967977987998008018028038048058068078088098108118128138148158168178188198208218228238248258268278288298308318328338348358368378388398408418428438448458468478488498508518528538548558568578588598608618628638648658668678688698708718728738748758768778788798808818828838848858868878888898908918928938948958968978988999009019029039049059069079089099109119129139149159169179189199209219229239249259269279289299309319329339349359369379389399409419429439449459469479489499509519529539549559569579589599609619629639649659669679689699709719729739749759769779789799809819829839849859869879889899909919929939949959969979989991000100110021003100410051006100710081009101010111012101310141015101610171018101910201021102210231024102510261027102810291030103110321033103410351036103710381039104010411042104310441045104610471048104910501051105210531054105510561057105810591060106110621063106410651066106710681069107010711072107310741075107610771078107910801081108210831084108510861087108810891090109110921093109410951096109710981099110011011102110311041105110611071108110911101111111211131114111511161117111811191120112111221123112411251126112711281129113011311132113311341135113611371138113911401141114211431144114511461147114811491150115111521153115411551156115711581159116011611162116311641165116611671168116911701171117211731174
  1. <!--
  2. * @Description: In User Settings Edit
  3. * @Author: your name
  4. * @Date: 2019-08-26 10:58:23
  5. * @LastEditTime: 2019-08-31 11:22:31
  6. * @LastEditors: Please set LastEditors
  7. -->
  8. <template>
  9. <div :class="getBettingIsShow?'noscoll':''">
  10. <div class="lod">
  11. <Loading></Loading>
  12. </div>
  13. <div>
  14. <SportsHead></SportsHead>
  15. <div class="Serch">
  16. <div class="Soccer-game row center">
  17. <div class="Soccer-game-title row center" @click="isreturn()">
  18. <img class="returnimg" :src="searchreturn">
  19. {{name}}
  20. </div>
  21. </div>
  22. </div>
  23. <!-- 足球头部 -->
  24. <div class="bqHead zqHead" v-if="headStatus == 1">
  25. <div class="pd-10">
  26. <div class="match">
  27. <div class="tit">
  28. <span>{{list.leagueName}}</span>
  29. <div>
  30. <!-- <span v-if="list.match_time" class="scene">{{list.match_time.split(' ')[0]}} </span>
  31. &nbsp; -->
  32. <span v-if="list.match_time" class="time">{{list.match_ptime ? list.match_ptime : list.match_time.split(' ')[0]}}</span>
  33. </div>
  34. </div>
  35. <div class="info">
  36. <span>{{list.home_team}}</span>
  37. <span class="live-score">{{list.match_score ? list.match_score :'0-0'}}</span>
  38. <span>{{list.guest_team}}</span>
  39. </div>
  40. </div>
  41. </div>
  42. </div>
  43. <!-- 篮球头部 -->
  44. <!-- 篮球头部 -->
  45. <div class="header" v-if="headStatus == 2">
  46. <div class=" match">
  47. <div class="live">
  48. <div class="tit">{{list.leagueName}}</div>
  49. <div class="info">
  50. <div class="infoBody flex">
  51. <div class="matchTime" style="width:25%;">
  52. <span class="scene">第四节</span>
  53. <span class="time">00:00</span>
  54. </div>
  55. <div class="flex" style="width:75%;">
  56. <div class="right_info_row_qt">第一节</div>
  57. <div class="right_info_row_qt">第二节</div>
  58. <div class="right_info_row_qt">第三节</div>
  59. <div class="right_info_row_qt">第四节</div>
  60. <div class="right_info_row_qt">加时</div>
  61. <!-- <div class="right_info_row_qt scence">上半场</div>
  62. <div class="right_info_row_qt scence">下半场</div> -->
  63. <div class="right_info_row_qt scence">总计</div>
  64. </div>
  65. </div>
  66. <div class="infoRow">
  67. <div class="infoItem flex">
  68. <div style="width:25%;">
  69. <span class="team">{{list.home_team}}</span>
  70. </div>
  71. <div class="infoBox" style="width:75%">
  72. <div class="infoNum">22</div>
  73. <div class="infoNum">8</div>
  74. <div class="infoNum">13</div>
  75. <div class="infoNum col">13</div>
  76. <div class="infoNum"></div>
  77. <!-- <div class="infoNum scenceNum">30</div>
  78. <div class="infoNum col scenceNum">26</div> -->
  79. <div class="infoNum ycol scenceNum">54</div>
  80. </div>
  81. </div>
  82. <div class="infoItem flex">
  83. <div style="width:25%;">
  84. <span class="team">{{list.guest_team}}</span>
  85. </div>
  86. <div class="infoBox" style="width:75%">
  87. <div class="infoNum">22</div>
  88. <div class="infoNum">8</div>
  89. <div class="infoNum">13</div>
  90. <div class="infoNum col">13</div>
  91. <div class="infoNum"></div>
  92. <!-- <div class="infoNum scenceNum">30</div>
  93. <div class="infoNum col scenceNum">26</div> -->
  94. <div class="infoNum ycol scenceNum">54</div>
  95. </div>
  96. </div>
  97. </div>
  98. </div>
  99. </div>
  100. </div>
  101. </div>
  102. <!-- 棒球头部 -->
  103. <div class="tennisHead" v-if="headStatus == 3">
  104. <div style="padding:0.1rem;">
  105. <div class="match">
  106. <div class="tit">
  107. <span>{{list.leagueName}}</span>
  108. </div>
  109. <div class="ballTable">
  110. <div class="listHead row allAlignment">
  111. <div class="txt-c-0">
  112. <div class="section">{{matchScoreDetails.schedule}}
  113. <span v-if="matchScoreDetails.type == 'h'">▲</span>
  114. <span v-else>▼</span>
  115. <!-- <span>▲</span> -->
  116. </div>
  117. </div>
  118. <div class="row ">
  119. <span class="session row center" v-for="(tiem,i) in 9" :key="tiem.id">
  120. {{i+1}}
  121. </span>
  122. <!-- <span class="mg-5">盘</span> -->
  123. <span class="mg-session row center">加时</span>
  124. <!-- <span class="mg-session row center">当前</span> -->
  125. <span class="mg-session row center" style="width:0.85rem;">总局数</span>
  126. </div>
  127. </div>
  128. <div class="row allAlignment scoreInfo">
  129. <div class="row">
  130. <div class="ballhold " :class="{attack:matchScoreDetails.type == 'h'}">•</div>
  131. <div class="team" style="text-align:left;">{{ list.home_team}}</div>
  132. </div>
  133. <div class="row">
  134. <span :class="{current:matchScoreDetails.schedule ==1}"
  135. class="session row center">{{matchScoreDetails.sc_1th_H}}</span>
  136. <span :class="{current:matchScoreDetails.schedule ==2}"
  137. class="session row center">{{matchScoreDetails.sc_2th_H}}</span>
  138. <span :class="{current:matchScoreDetails.schedule ==3}"
  139. class="session row center ">{{matchScoreDetails.sc_3th_H}}</span>
  140. <span :class="{current:matchScoreDetails.schedule ==4}"
  141. class="session row center">{{matchScoreDetails.sc_4th_H}}</span>
  142. <span :class="{current:matchScoreDetails.schedule ==5}"
  143. class="session row center">{{matchScoreDetails.sc_5th_H}}</span>
  144. <span :class="{current:matchScoreDetails.schedule ==6}"
  145. class="session row center">{{matchScoreDetails.sc_6th_H}}</span>
  146. <span :class="{current:matchScoreDetails.schedule ==7}"
  147. class="session row center">{{matchScoreDetails.sc_7th_H}}</span>
  148. <span :class="{current:matchScoreDetails.schedule ==8}"
  149. class="session row center">{{matchScoreDetails.sc_8th_H}}</span>
  150. <span :class="{current:matchScoreDetails.schedule ==9}"
  151. class="session row center">{{matchScoreDetails.sc_9th_H}}</span>
  152. <span class=" mg-session row center " style="background: rgba(255, 165, 0, 0.49);">{{matchScoreDetails.OT_H}}</span>
  153. <!-- <span class=" mg-session row center mark">{{matchScoreDetails.sc_ov_H}}</span> -->
  154. <span class="mg-session row center mark " style="width:0.85rem">{{matchScoreDetails.game_num_H}}</span>
  155. </div>
  156. </div>
  157. <div class="row allAlignment scoreInfo">
  158. <div class="row">
  159. <div class="ballhold" :class="{attack:matchScoreDetails.type == 'g'}">•</div>
  160. <div class="team" style="text-align:left;">{{list.guest_team}}</div>
  161. </div>
  162. <div class="row">
  163. <span :class="{current:matchScoreDetails.schedule ==1}" class="session row center">{{matchScoreDetails.sc_1th_C}}</span>
  164. <span :class="{current:matchScoreDetails.schedule ==2}" class="session row center">{{matchScoreDetails.sc_2th_C}}</span>
  165. <span :class="{current:matchScoreDetails.schedule ==3}" class="session row center">{{matchScoreDetails.sc_3th_C}}</span>
  166. <span :class="{current:matchScoreDetails.schedule ==4}" class="session row center">{{matchScoreDetails.sc_4th_C}}</span>
  167. <span :class="{current:matchScoreDetails.schedule ==5}" class="session row center">{{matchScoreDetails.sc_5th_C}}</span>
  168. <span :class="{current:matchScoreDetails.schedule ==6}" class="session row center">{{matchScoreDetails.sc_6th_C}}</span>
  169. <span :class="{current:matchScoreDetails.schedule ==7}" class="session row center">{{matchScoreDetails.sc_7th_C}}</span>
  170. <span :class="{current:matchScoreDetails.schedule ==8}" class="session row center">{{matchScoreDetails.sc_8th_C}}</span>
  171. <span :class="{current:matchScoreDetails.schedule ==9}" class="session row center">{{matchScoreDetails.sc_9th_C}}</span>
  172. <span class=" mg-session row center " style="background: rgba(255, 165, 0, 0.49);">{{matchScoreDetails.OT_C}}</span>
  173. <!-- <span class=" mg-session row center mark">{{matchScoreDetails.sc_ov_A}}</span> -->
  174. <span class="mg-session row center mark " style="width:0.85rem">{{matchScoreDetails.game_num_C}}</span>
  175. </div>
  176. </div>
  177. <div class="listHead row allAlignment">
  178. <div class="row center">
  179. <div class="eliminate ">
  180. <span :class="{spanBox:matchScoreDetails.baseman_2 !='N'}" style="margin-left:.11rem;"></span>
  181. <div style="width:.31rem;" class="row allAlignment">
  182. <span :class="{spanBox:matchScoreDetails.baseman_3 !='N'}"></span>
  183. <span :class="{spanBox:matchScoreDetails.baseman_1 !='N'}"></span>
  184. </div>
  185. </div>
  186. </div>
  187. <div>
  188. <span>出局:</span>
  189. <span>{{matchScoreDetails.out_game_num}}</span>
  190. </div>
  191. </div>
  192. </div>
  193. </div>
  194. </div>
  195. </div>
  196. <!-- 网球头部 -->
  197. <div class="tennisHead" style="padding:0.1rem;" v-if="headStatus == 4">
  198. <div class="ballTable">
  199. <div class="txt" style=" color:#fff">
  200. <span>{{list.leagueName}}</span>
  201. </div>
  202. <div class="listHead row allAlignment">
  203. <div class="txt">
  204. <!-- <div class="spanCol">第{{scoreDetails.cp == 1?'一' : scoreDetails.cp ==2 ? "二": scoreDetails.cp ==3 ? "三":scoreDetails.cp== 4 ? "四":"五" }}节</div> -->
  205. <div class="spanCol">第一节</div>
  206. <!-- <div class="delay">天气原因延期</div> -->
  207. </div>
  208. <div class="headerTop row rightAlignment">
  209. <span v-for="(item,i) in 5" :key="item.id">{{i+1}}</span>
  210. <span class="mg-5">分数</span>
  211. <span class="mg-5">盘</span>
  212. <span class="mg-5" style="width:0.8rem;">总局</span>
  213. </div>
  214. </div>
  215. <!-- 主队 -->
  216. <div class="row allAlignment list">
  217. <div class="row">
  218. <!-- <div class="ballhold" style="color: rgb(197, 210, 60);">•</div> -->
  219. <div class="team" style="text-align:left;">{{list.home_team}}</div>
  220. </div>
  221. <div class="score row rightAlignment">
  222. <span class="spanCol">6</span>
  223. <span class="spanCol">3</span>
  224. <span class="spanCol">0</span>
  225. <span class="spanCol">0</span>
  226. <span class="spanCol">0</span>
  227. <span class="mg-5 mark cl" style="background: rgba(255, 165, 0, 0.49);">40</span>
  228. <span class="mg-5 mark">0</span>
  229. <span class="mg-5 mark sumCl" style="width:0.8rem">4</span>
  230. </div>
  231. </div>
  232. <!-- 客队 -->
  233. <div class="row allAlignment list">
  234. <div class="row">
  235. <!-- <span class="ballhold" style="color:#fff;">•</span> -->
  236. <span class="team" style="text-align:left;">{{list.guest_team}}</span>
  237. </div>
  238. <div class="score row rightAlignment">
  239. <span class="spanCol">2</span>
  240. <span class="spanCol">2</span>
  241. <span class="spanCol">0</span>
  242. <span class="spanCol">0</span>
  243. <span class="spanCol">0</span>
  244. <span class="mg-5 mark cl" style="background: rgba(255, 165, 0, 0.49);">40</span>
  245. <span class="mg-5 mark">0</span>
  246. <span class="mg-5 mark sumCl" style="width:0.8rem;">2</span>
  247. </div>
  248. </div>
  249. <div></div>
  250. </div>
  251. <!-- </div>
  252. </div>-->
  253. </div>
  254. <!-- 原始头部 -->
  255. <div class="gambling" v-show="this.list" v-if="headStatus == 0">
  256. <div class="leagueMatch row average">
  257. <yd-button size="large" @click.native="show = true"></yd-button>
  258. <div class="leagueName">
  259. <span>{{list.leagueName}}</span>
  260. </div>
  261. <div class="teamName">
  262. <span>{{list.home_team}}</span>
  263. <div class="vs">vs</div>
  264. <span>{{list.guest_team}}</span>
  265. </div>
  266. <div class="time" :style="status == true?'':'width:2rem;'">
  267. <span>{{list.match_ptime? list.match_ptime :list.match_time }}</span>
  268. </div>
  269. <div v-if="satatus" class="icon" :class="status == true ? 'rotate':'backRotate'">
  270. <i></i>
  271. </div>
  272. </div>
  273. <!-- 模态框 -->
  274. <yd-popup v-if="satatus" v-model="show" position="center" width="90%">
  275. <div class="modality">
  276. <div
  277. class="list"
  278. v-for="(item,index) in list.league"
  279. :key="index"
  280. @click="check(index,item.match_id)"
  281. >
  282. <span :class="match_id == item.match_id?'col':''">{{item.home_team}}</span>
  283. <span :class="match_id == item.match_id?'col':''">v</span>
  284. <span :class="match_id == item.match_id?'col':''">{{item.guest_team}}</span>
  285. </div>
  286. </div>
  287. </yd-popup>
  288. </div>
  289. <div class="box">
  290. <div id="NavSlide">
  291. <nav>
  292. <p v-for="(item,$index) in key" @click="toggleNav($index)" :key="$index">
  293. <span :class="{active:$index==active}">{{item}}</span>
  294. </p>
  295. </nav>
  296. </div>
  297. </div>
  298. <div v-show="isShow">
  299. <!--让球大小-->
  300. <div v-show="Single =='进球:大/小' || isAll ">
  301. <goal></goal>
  302. </div>
  303. <!--让球1-->
  304. <div v-show="Single =='让球' || isAll ">
  305. <LetBall></LetBall>
  306. </div>
  307. <!--最先/最后进球-->
  308. <div v-show="Single =='首粒入球/最后一粒入球' || isAll ">
  309. <StartEnd></StartEnd>
  310. </div>
  311. <!-- 总进球数 -->
  312. <div v-show="Single =='总进球数' || isAll ">
  313. <GoalSize></GoalSize>
  314. </div>
  315. <!-- 根据球类加载独赢/冠军 -->
  316. <div v-if="name =='篮球' || name =='棒球' || name =='足球'">
  317. <!--独赢-->
  318. <div v-show="Single =='独赢'|| Single =='独赢盘'|| isAll ">
  319. <OnlyWin></OnlyWin>
  320. </div>
  321. </div>
  322. <div v-else>
  323. <!-- 冠军 -->
  324. <div v-show="Single =='冠军' || isAll ">
  325. <MatchChampion></MatchChampion>
  326. </div>
  327. </div>
  328. <!--独赢-->
  329. <!-- <div v-show="Single =='独赢'|| Single =='独赢盘'|| isAll ">
  330. <OnlyWin></OnlyWin>
  331. </div> -->
  332. <!-- 波胆 -->
  333. <div v-show="Single =='波胆' || isAll ">
  334. <div v-if="name == '网球'">
  335. <TennisWaveBravery/>
  336. </div>
  337. <div v-else>
  338. <WaveBladder></WaveBladder>
  339. </div>
  340. </div>
  341. <!--入球数单双-->
  342. <div v-show="Single =='进球:单/双'|| Single =='总分:单/双' || isAll ">
  343. <div v-if="name =='篮球' || name =='棒球'">
  344. <TotalScoreSingleDouble/>
  345. </div>
  346. <div v-else>
  347. <GoalSingleAndDouble></GoalSingleAndDouble>
  348. </div>
  349. </div>
  350. <!--半场/全场-->
  351. <div v-show="Single =='半场/全场'|| isAll ">
  352. <FullHalf></FullHalf>
  353. </div>
  354. <!-- 角球
  355. <div v-show="Single =='角球' || isAll ">
  356. <Corner></Corner>
  357. </div> -->
  358. <!-- 球队进球大小 -->
  359. <div v-show="Single =='球队进球数:大/小' || isAll ">
  360. <TeamGoalSize></TeamGoalSize>
  361. </div>
  362. <!-- 总得分:大/小 -->
  363. <div v-show="Single =='总得分:大/小' || isAll ">
  364. <TotalScoreSize></TotalScoreSize>
  365. </div>
  366. <!-- 总得分:大/小 前五 -->
  367. <div v-show="Single =='总得分:大/小' || isAll ">
  368. <TotalScoreSizeFive></TotalScoreSizeFive>
  369. </div>
  370. <!-- 总得分:大/小 上半场 -->
  371. <div v-show="Single =='总得分:大/小' || isAll ">
  372. <TotalScoreHalfSize></TotalScoreHalfSize>
  373. </div>
  374. <!-- 总得分:大/小 节数-->
  375. <div v-show="Single =='总得分:大/小' || isAll ">
  376. <TotalScoreSectionSize></TotalScoreSectionSize>
  377. </div>
  378. <!-- 球队得分最后一位数 -->
  379. <div v-show="Single =='球队得分最后一位数' || isAll ">
  380. <TeamScoreLast></TeamScoreLast>
  381. </div>
  382. <!-- 总局数:大/小 -->
  383. <div v-show="Single =='总局数:大/小' || isAll ">
  384. <InningsSize></InningsSize>
  385. </div>
  386. <!-- 总局数:单/双 -->
  387. <div v-show="Single =='总局数单双' || isAll ">
  388. <InningsSingleDouble></InningsSingleDouble>
  389. </div>
  390. <!-- 冠军 -->
  391. <!-- <div v-show="Single =='冠军' || isAll ">
  392. <MatchChampion></MatchChampion>
  393. </div> -->
  394. <!-- 让盘 -->
  395. <div v-show="Single =='让盘' || isAll ">
  396. <LetPlate></LetPlate>
  397. </div>
  398. <!-- 让局 -->
  399. <div v-show="Single =='让局' || isAll ">
  400. <LetBureau></LetBureau>
  401. </div>
  402. </div>
  403. <div v-if="!isShow">
  404. <NotOpend :title="tipsTitle"></NotOpend>
  405. </div>
  406. <!-- <StLinkFooter></StLinkFooter> -->
  407. <BettingWindow v-if="isBettingWindow== '100'"/>
  408. </div>
  409. </div>
  410. </template>
  411. <script>
  412. import Goal from "@/components/StGoal";
  413. import LetBall from "@/components/StLetBall";
  414. import NotOpend from "@/components/StNotOpend";
  415. import Loading from "@/components/StLoading";
  416. import WaveBladder from "@/components/StWaveBladder";
  417. import StLinkFooter from "@/components/StLinkFooter";
  418. import SportsHead from "@/components/StSportsHead";
  419. import OnlyWin from "@/components/StOnlyWin";
  420. import GoalSize from "@/components/StGoalSize";
  421. import StartEnd from "@/components/StStartEnd";
  422. import FullHalf from "@/components/StFullHalf";
  423. import TeamGoalSize from "@/components/StTeamGoalSize";
  424. import TotalScoreSize from "@/components/StTotalScoreSize";
  425. import TotalScoreSizeFive from "@/components/StTotalScoreSizeFive";
  426. import TotalScoreHalfSize from "@/components/StTotalScoreHalfSize";
  427. import TotalScoreSectionSize from "@/components/StTotalScoreSectionSize";
  428. import TeamScoreLast from "@/components/StTeamScoreLast";
  429. import GoalSingleAndDouble from "@/components/StGoalSingleAndDouble";
  430. import Corner from "@/components/StCorner";
  431. import TotalScoreSingleDouble from "@/components/StTotalScoreSingleDouble";
  432. import BettingWindow from "@/components/StBettingWindow";
  433. import MatchChampion from "@/components/StMatchChampion";
  434. import InningsSingleDouble from "@/components/StInningsSingleDouble";
  435. import InningsSize from "@/components/StInningsSize";
  436. import LetPlate from "@/components/StLetPlate";
  437. import LetBureau from "@/components/StLetBureau";
  438. import TennisWaveBravery from "@/components/StTennisWaveBravery";
  439. export default {
  440. data() {
  441. return {
  442. name:this.$route.query.name, // 球名
  443. searchreturn: require("@/assets/st-imges/returnbox.png"),
  444. gameCode: this.$route.query.gameCode, //别名
  445. match_id: "",
  446. list:'', //数据
  447. previousStorage:'',//前一次list储存数据
  448. key: [], //存储key值进行判定
  449. isShow: "", //更具数据是否显示
  450. getBettingIsShow:false,// 判断投注框背景可否滚动
  451. status: false,
  452. tipsTitle: "暂无相关数据信息",
  453. active: 0,// 投注页是否打开
  454. isBettingWindow: '-1',
  455. // isIphone: false,//是否ios
  456. // isAndroid: false,//是否Android
  457. show: false, //是否显示模态框
  458. satatus: true,
  459. isAll: true,
  460. Single: "",
  461. timers : true,//是否开启轮询
  462. headStatus : 0 ,// 头部显示滚球(1为足球,2为篮球,3为棒球,4为网球),0为普通
  463. matchScoreDetails:'',//比赛得分详情
  464. };
  465. },
  466. methods: {
  467. // 返回上一页
  468. isreturn() {
  469. history.go(-1);
  470. },
  471. //滚球比赛比分详情
  472. scoreDetails(data){
  473. //比赛得分详细
  474. let matchScoreDetails = JSON.parse(data);
  475. if(matchScoreDetails.schedule){
  476. if(matchScoreDetails.schedule.startsWith('Topof')){
  477. matchScoreDetails.type = 'h'
  478. }else if(matchScoreDetails.schedule.startsWith('Bottomof')){
  479. matchScoreDetails.type = 'g'
  480. }
  481. matchScoreDetails.schedule = matchScoreDetails.schedule.match(/\d+/g)[0]
  482. this.matchScoreDetails = matchScoreDetails;
  483. }
  484. },
  485. //页面初始化接口请求
  486. getAjax: function(game_code, matchID,oddsType) {
  487. this.$http.get(this.$ports.gambling.matchOdds, {
  488. oddsType,
  489. game_code,
  490. matchID
  491. }).then(res => {
  492. if (res.data.status == 1 && res.data.data) {
  493. // console.log(res.data.data,'1');//
  494. //result_mark
  495. //滚球头部数据处理
  496. // console.log(res.data.data)
  497. if(res.data.data.result_mark){
  498. this.scoreDetails(res.data.data.result_mark);
  499. }
  500. // console.log(res.data.data.result_mark,'比赛得分详细');
  501. this.key = [];
  502. if ( res.data.data.oddsData == [] ||res.data.data.oddsData.length == 0 ||res.data.data.oddsData == null) {
  503. this.$store.dispatch("GETSHOW", false);
  504. this.isShow = false;
  505. return false;
  506. }
  507. this.list = res.data.data;
  508. this.satatus = this.list.league.length > 1 ? true :false;
  509. let arrayData = [];
  510. let key =res.data.data.p_code_array ;//Object.keys(res.data.data.p_code_array);
  511. let values = this.$store.getters.getPlayAlias;
  512. //this.$store.getters.getPlayAlias;
  513. this.isShow = true;
  514. this.key = ["所有盘口"];
  515. key.forEach((e, index) => {
  516. // console.log('e',e);
  517. values.forEach(val=>{
  518. if(e == val.odds_code && this.$store.getters.getBallId == val.game_code){
  519. if((this.name == '篮球' && val.odds_name =='入球数单双') || (this.name == '棒球' && val.odds_name =='入球数单双')){
  520. val.odds_name ='总分:单双'
  521. }
  522. this.key.push(val.odds_name);
  523. }
  524. })
  525. let stripData = [];
  526. this.list.oddsData.forEach(data => {
  527. if (data.p_code == e) {
  528. stripData.push(data);
  529. }
  530. arrayData[index] = stripData;
  531. });
  532. });
  533. //更新数据和上一次的数据匹配
  534. let storage =this.previousStorage;
  535. //console.log('storage',arrayData)
  536. if(storage && storage.match_id == this.list.match_id && storage.oddsData.length > 0){
  537. arrayData.forEach(e=>{
  538. storage.oddsData.forEach((res,index)=>{
  539. if(e[0].p_code == res[0].p_code){
  540. e.forEach(dat=>{
  541. res.forEach((val,i)=>{
  542. if(dat.id == val.id){
  543. if(dat.odds > val.odds){
  544. dat.change ='add';
  545. }else if(dat.odds < val.odds){
  546. dat.change = 'red';
  547. }else{
  548. dat.change ='';
  549. }
  550. res.splice(i,1)
  551. }
  552. })
  553. })
  554. storage.oddsData.splice(index,1)
  555. }
  556. })
  557. })
  558. }
  559. // console.log(this.previousStorage);
  560. this.list.oddsData = arrayData;
  561. this.previousStorage =this.list;
  562. this.$store.dispatch("GETGAMERATIO", this.list);
  563. //console.log("数据源", arrayData);
  564. }
  565. let _this=this;
  566. setTimeout(()=>{
  567. this.$store.dispatch("GETSHOW", false);
  568. },1000)
  569. });
  570. },
  571. /**
  572. * 切换赛事
  573. */
  574. check(index, match_id) {
  575. let oddsType = localStorage.getItem('activity');
  576. this.show = false;
  577. if (this.list.match_id == match_id) return false;
  578. this.match_id = match_id;
  579. this.$store.dispatch("MACTH_ID", match_id);
  580. this.$store.dispatch("GETSHOW", true);
  581. this.getAjax(this.gameCode, match_id,oddsType);
  582. },
  583. /**
  584. * 切换玩法类型
  585. */
  586. toggleNav: function(index) {
  587. this.active = index;
  588. if (this.key[index] == "所有盘口") {
  589. this.isAll = true;
  590. } else {
  591. this.isAll = false;
  592. this.Single = this.key[index];
  593. }
  594. }
  595. },
  596. /**
  597. * 计算属性
  598. */
  599. computed: {
  600. getIsBettingType() {
  601. return this.$store.getters.getIsBetting;
  602. },
  603. // 获取投注框展示状态
  604. getBettingCase(){
  605. //console.log(this.$store.getters.getNoRoll,'aaaaa')
  606. return this.$store.getters.getNoRoll
  607. },
  608. },
  609. /**
  610. * 监听器
  611. */
  612. watch: {
  613. // 监听投注框开关
  614. getIsBettingType(val) {
  615. if(val=='-1'){
  616. this.$store.dispatch('SET_NOROLL',false)
  617. }
  618. this.isBettingWindow = val;
  619. },
  620. getBettingCase(val){
  621. this.getBettingIsShow=val
  622. },
  623. },
  624. /**
  625. *
  626. */
  627. mounted() {
  628. let ballId = this.$store.getters.getBallId;
  629. let acty = this.$store.getters.getActivity;
  630. if(acty == 'StRollBall'){
  631. if(ballId == 'zq'){
  632. this.headStatus = 1;
  633. }else if(ballId == 'lq'){
  634. this.headStatus = 2;
  635. }else if(ballId == 'bq'){
  636. this.headStatus = 3;
  637. }else if(ballId == 'wq'){
  638. this.headStatus = 4
  639. }
  640. }else{
  641. this.headStatus = 0;
  642. }
  643. let _this = this;
  644. this.match_id = this.$store.getters.getMatchId;
  645. let oddsType = localStorage.getItem('activity');
  646. this.$store.dispatch("GETSHOW", true);
  647. this.getAjax(this.gameCode, this.match_id,oddsType);
  648. //this.timers =true;
  649. this.$public.ajaxTimerFun(function(timing) {
  650. if (_this.timers) {
  651. _this.getAjax(_this.gameCode, _this.match_id,oddsType);
  652. // _this.updateAjax(_this.gameCode, _this.match_id);
  653. }else{
  654. clearInterval(timing);
  655. }
  656. },(1000*15));
  657. if (this.$store.getters.getIsBetting == '100') {
  658. this.isBettingWindow = 100;
  659. }
  660. },
  661. /**
  662. * 关闭当前页面钩子函数
  663. */
  664. beforeDestroy() {
  665. this.timers = false;
  666. },
  667. components: {
  668. Corner,
  669. LetBall,
  670. Goal,
  671. WaveBladder,
  672. StLinkFooter,
  673. SportsHead,
  674. OnlyWin,
  675. StartEnd,
  676. GoalSize,
  677. FullHalf,
  678. GoalSingleAndDouble,
  679. TeamGoalSize,
  680. Loading,
  681. NotOpend,
  682. BettingWindow,
  683. TotalScoreSize,
  684. TotalScoreSizeFive,
  685. TotalScoreHalfSize,
  686. TotalScoreSectionSize,
  687. TeamScoreLast,
  688. TotalScoreSingleDouble,
  689. MatchChampion,
  690. InningsSingleDouble,
  691. InningsSize,
  692. LetPlate,
  693. LetBureau,
  694. TennisWaveBravery
  695. }
  696. };
  697. </script>
  698. <style scoped>
  699. /* 禁止滚动 */
  700. .noscoll{
  701. position: fixed;
  702. width: 100%;
  703. top: 0;
  704. left: 0;
  705. }
  706. /* 头部 */
  707. .Serch {
  708. height: 0.88rem;
  709. display: flex;
  710. justify-content: space-between;
  711. align-items: center;
  712. background: linear-gradient(to bottom, #6a6a6a, #565656);
  713. color: #f76649;
  714. font-family: "PingFang-SC-Regular";
  715. padding: 0 0.33rem;
  716. }
  717. .returnimg {
  718. width: 0.37rem;
  719. height: 0.3rem;
  720. margin-right: 0.1rem;
  721. }
  722. .Soccer-game-title {
  723. height: 0.88rem;
  724. font-size: 0.3rem;
  725. }
  726. .Soccer-game-box {
  727. height: 0.88rem;
  728. /* padding: 0 0.32rem; */
  729. background-color: #626262;
  730. }
  731. .gambling {
  732. background: #f8f8f8;
  733. }
  734. .leagueMatch {
  735. position: relative;
  736. padding: 0.3rem 0.32rem;
  737. display: flex;
  738. justify-content: space-between;
  739. align-items: center;
  740. flex-wrap: nowrap;
  741. border-bottom: 1px solid #e4e4e4;
  742. background: linear-gradient(to top, #ffe9c9, #fff3e2);
  743. }
  744. .leagueMatch div {
  745. font-size: 0.28rem;
  746. text-align: left;
  747. color: #333333;
  748. }
  749. .leagueName {
  750. width: 2.26rem;
  751. }
  752. .leagueMatch .teamName {
  753. text-align: center;
  754. }
  755. .teamName .vs {
  756. text-align: center;
  757. font-size: 0.24rem;
  758. color: #fd8f26;
  759. }
  760. .leagueMatch .time {
  761. width: 1.3rem;
  762. color: #333333;
  763. font-size: 0.24rem;
  764. text-align: center;
  765. }
  766. .leagueMatch .icon i {
  767. display: inline-block;
  768. width: 0.4rem;
  769. height: 0.4rem;
  770. background: url("../../../assets/st-imges/xiangxia.png") no-repeat;
  771. background-size: 100% 100%;
  772. transform: rotate(180deg);
  773. }
  774. .leagueMatch .rotate {
  775. transform: rotate(180deg);
  776. transition: 0.2s;
  777. }
  778. .leagueMatch .backRotate {
  779. transform: rotate(0deg);
  780. transition: 0.2s;
  781. }
  782. .box {
  783. padding: 0 0.14rem;
  784. background: #f8f8f8;
  785. }
  786. #NavSlide {
  787. width: 100%;
  788. overflow: hidden;
  789. height: 0.88rem;
  790. }
  791. #NavSlide nav {
  792. display: -webkit-box;
  793. display: -ms-flexbox;
  794. display: flex;
  795. -webkit-box-align: middle;
  796. -ms-flex-align: middle;
  797. align-items: middle;
  798. overflow: auto;
  799. }
  800. #NavSlide p {
  801. text-align: center;
  802. font-size: 0.28rem;
  803. -ms-flex-negative: 0;
  804. flex-shrink: 0;
  805. padding: 0 0.2rem 0 0;
  806. margin: 0 0.1rem 0 0;
  807. color: #b8b8b8;
  808. height: 0.88rem;
  809. line-height: 0.88rem;
  810. }
  811. /* #NavSlide p a{
  812. color: #E5E5E5;
  813. text-decoration: none;
  814. } */
  815. #NavSlide p span.active {
  816. color: #363636;
  817. }
  818. #NavSlide .fixadd {
  819. position: absolute;
  820. right: -4px;
  821. background-color: #31c17b;
  822. }
  823. button.yd-btn-block {
  824. background: #f8f8f8;
  825. position: absolute;
  826. left: 0;
  827. top: 0;
  828. width: 100%;
  829. height: 100%;
  830. /* z-index: -1; */
  831. margin: 0;
  832. opacity: 0;
  833. }
  834. .modality {
  835. text-align: center;
  836. background: #fbfbfb;
  837. padding: 0.2rem 0;
  838. height: 5rem;
  839. /* overflow: hidden; */
  840. }
  841. .modality span {
  842. color: #000000;
  843. font-size: 0.28rem;
  844. }
  845. .modality div {
  846. /* margin: 0.06rem 0; */
  847. padding: 0.2rem 0;
  848. background: #fbfbfb;
  849. border-bottom: 1px solid #e4e4e4;
  850. }
  851. .modality div .col {
  852. color: #fd8f26;
  853. }
  854. .lod{
  855. z-index: 999;
  856. position: fixed;
  857. width: 100%;
  858. }
  859. /* 滚球足球头部 */
  860. /* 棒球头部 */
  861. .bqHead {
  862. background: url("../../../assets/st-imges/1baseball.png") no-repeat;
  863. background-size: 100% 100%;
  864. font-size: 0.18rem;
  865. }
  866. .zqHead {
  867. color: #fff;
  868. background: url("../../../assets/st-imges/1football.png") no-repeat;
  869. background-size: 100% 100%;
  870. font-size: 0.18rem;
  871. }
  872. .eliminate span {
  873. display: block;
  874. width: 0.1rem;
  875. height: 0.1rem;
  876. background: #ccc;
  877. transform: rotate(45deg);
  878. }
  879. .spanBox {
  880. background: orange !important;
  881. }
  882. .ballhold{
  883. /* color:#fff; */
  884. font-size: 0.2rem;
  885. margin-right: 4px;
  886. }
  887. .current{
  888. color: orange;
  889. }
  890. .session{
  891. width:0.3rem;
  892. }
  893. .mark{
  894. background: hsla(0, 0%, 100%, 0.25);
  895. }
  896. .scoreInfo{
  897. line-height: 0.5rem;
  898. padding: 0 0.1rem ;
  899. }
  900. .mg-session{
  901. width:0.7rem;
  902. }
  903. .bqHead .pd-10 {
  904. padding: 0.1rem;
  905. }
  906. .bqHead .tit {
  907. display: flex;
  908. align-items: center;
  909. justify-content: space-between;
  910. }
  911. .match .info {
  912. background: rgba(0, 0, 0, 0.5);
  913. height: 0.52rem;
  914. line-height: 0.52rem;
  915. font-size: 15px;
  916. text-align: center;
  917. font-size: 0.28rem;
  918. }
  919. .match .info .pk,
  920. .match .tit .scene {
  921. font-weight: bold;
  922. color: rgb(254, 146, 0);
  923. }
  924. .tit .time {
  925. color: #bd4700;
  926. }
  927. .tit span{
  928. font-size: 0.26rem;
  929. }
  930. .welcome {
  931. height: 0.36rem;
  932. line-height: 0.36rem;
  933. font-size: 0.16rem;
  934. padding: 0 0.1rem;
  935. background: #4e4e4e;
  936. color: black;
  937. }
  938. /* 篮球头部 */
  939. .header .match{
  940. background: #c28d47;
  941. background-image: url("../../../assets/st-imges/1basketball.png") no-repeat;
  942. background-size: 100% 100%;
  943. color: #fff;
  944. }
  945. .flex{
  946. display: flex;
  947. justify-content: space-between;
  948. align-items: center;
  949. }
  950. .header .match .live{
  951. padding: 0.06rem;
  952. }
  953. /* .live .tit{
  954. height: 30px;
  955. line-height: 30px;
  956. font-size: 0.14rem;
  957. } */
  958. .match .info{
  959. margin-top: 0.1rem;
  960. position: relative;
  961. height: auto;
  962. background: rgba(0,0,0,.5);
  963. line-height: 52px;
  964. font-size: 15px;
  965. text-align: center;
  966. }
  967. .infoBody{
  968. background: #000;
  969. opacity: .85;
  970. height: 0.52rem;
  971. padding-left: 0.1rem;
  972. font-size: 0.14rem;
  973. }
  974. .matchTime span{
  975. display: inline-block;
  976. }
  977. .matchTime .scene{
  978. color: #ff9200;
  979. margin-right: 0.06rem;
  980. }
  981. .matchTime .time{
  982. color: #b4b4b4;
  983. }
  984. .right_info_row_qt{
  985. width: 0.85rem;
  986. font-size: 0.12rem;
  987. text-align: center;
  988. /* padding: 0.04rem; */
  989. color: #787878;
  990. /* box-sizing: border-box; */
  991. /* font-weight: 700;
  992. font-family: serif; */
  993. }
  994. .infoRow{
  995. padding-left: 0.1rem;
  996. }
  997. .scence{
  998. width: 0.75rem;
  999. padding: 0;
  1000. /* padding-top: 0.19rem; */
  1001. }
  1002. .infoItem{
  1003. height: 0.5rem;
  1004. line-height: 0.24rem;
  1005. width: auto
  1006. }
  1007. .infoBox{
  1008. width: 2.73rem;
  1009. height:0.5rem;
  1010. display: flex;
  1011. align-items: center;
  1012. justify-content: space-between;
  1013. /* right: 0; */
  1014. /* position: absolute; */
  1015. }
  1016. .infoBox > div{
  1017. width: .75rem;
  1018. }
  1019. .infoNum{
  1020. width: 0.25rem;
  1021. font-size: 0.13rem;
  1022. line-height: 0.28rem;
  1023. padding: 0;
  1024. height: 100%;
  1025. line-height: 0.5rem;
  1026. color: #fff;
  1027. font-weight: 400;
  1028. text-align: center;
  1029. font-family: sans-serif;
  1030. }
  1031. .scenceNum{
  1032. background: hsla(0,0%,100%,.16);
  1033. width: 0.52rem;
  1034. margin-left: 1px;
  1035. }
  1036. .infoItem .team{
  1037. font-size: 0.16rem;
  1038. }
  1039. .col{
  1040. color: #ff9200;
  1041. }
  1042. .ycol{
  1043. color:#dcbc4c;
  1044. }
  1045. /* 网球头部 */
  1046. .tennisHead {
  1047. background: url("../../../assets/st-imges/tennisball.png") no-repeat;
  1048. background-size: 100% 100%;
  1049. width: 100%;
  1050. height: auto;
  1051. }
  1052. .ordinaryHead .match .info{
  1053. display: flex;
  1054. }
  1055. .match {
  1056. color: #fff;
  1057. height: auto;
  1058. }
  1059. .match .tit {
  1060. height: 0.32rem;
  1061. line-height: 0.32rem;
  1062. /* margin-top: -4px; */
  1063. }
  1064. .ballTable{
  1065. background: rgba(0, 0, 0, 0.2);
  1066. }
  1067. .listHead {
  1068. padding: 0 0.1rem;
  1069. line-height: 0.5rem;
  1070. background: rgba(0, 0, 0, 0.15);
  1071. color: #fff;
  1072. }
  1073. .listHead .txt-c-0 {
  1074. color: orange;
  1075. }
  1076. .listHead .spanCol{
  1077. color: orange;
  1078. }
  1079. .headerTop {
  1080. width: 50%;
  1081. }
  1082. .score {
  1083. width: 50%;
  1084. }
  1085. .score span {
  1086. display: inline-block;
  1087. width: 0.3rem;
  1088. text-align: center;
  1089. }
  1090. .score span.mg-5 {
  1091. width: 0.7rem;
  1092. }
  1093. .headerTop span {
  1094. display: inline-block;
  1095. width: 0.3rem;
  1096. text-align: center;
  1097. }
  1098. .headerTop span.mg-5 {
  1099. width: 0.7rem;
  1100. }
  1101. .mark {
  1102. background: hsla(0, 0%, 100%, 0.25);
  1103. }
  1104. .list {
  1105. background: hsla(0, 0%, 100%, 0.2);
  1106. line-height: 0.4rem;
  1107. padding: 0 0.1rem;
  1108. color: #fff;
  1109. }
  1110. .cl {
  1111. color: orange;
  1112. }
  1113. .sumCl {
  1114. color: #ff0;
  1115. }
  1116. .welcome{
  1117. height: .5rem;
  1118. line-height: 0.5rem;
  1119. font-size: 0.16rem;
  1120. padding: 0 0.1rem;
  1121. background: #898989;
  1122. color: #fff;
  1123. }
  1124. .ordinaryHead {
  1125. background: url("../../../assets/st-imges/1football.png") no-repeat;
  1126. background-size: 100% 100%;
  1127. /* padding: 0.04rem; */
  1128. /* height: 1.2rem; */
  1129. /* line-height: 1.2rem; */
  1130. }
  1131. .ordinaryHead .match {
  1132. color: #fff;
  1133. }
  1134. .ordinaryHead .match .info {
  1135. padding: 0 0.2rem;
  1136. display: flex;
  1137. justify-content: space-between;
  1138. align-items: center;
  1139. }
  1140. .ordinaryHead .match .info div span{
  1141. font-size: 0.22rem;
  1142. }
  1143. .match .time {
  1144. font-weight: 400;
  1145. color: #bd4700;
  1146. margin-left: 0.05rem;
  1147. }
  1148. .live-score {
  1149. padding: 0 8%;
  1150. }
  1151. .attack{
  1152. color: rgb(197, 210, 60);
  1153. }
  1154. </style>