6b1e449e6a8ae3d352c962d98a87eceedf10ece7.svn-base 35 KB

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