c56dd1f08b2234869582937b957b0a918709ea2b.svn-base 33 KB

1234567891011121314151617181920212223242526272829303132333435363738394041424344454647484950515253545556575859606162636465666768697071727374757677787980818283848586878889909192939495969798991001011021031041051061071081091101111121131141151161171181191201211221231241251261271281291301311321331341351361371381391401411421431441451461471481491501511521531541551561571581591601611621631641651661671681691701711721731741751761771781791801811821831841851861871881891901911921931941951961971981992002012022032042052062072082092102112122132142152162172182192202212222232242252262272282292302312322332342352362372382392402412422432442452462472482492502512522532542552562572582592602612622632642652662672682692702712722732742752762772782792802812822832842852862872882892902912922932942952962972982993003013023033043053063073083093103113123133143153163173183193203213223233243253263273283293303313323333343353363373383393403413423433443453463473483493503513523533543553563573583593603613623633643653663673683693703713723733743753763773783793803813823833843853863873883893903913923933943953963973983994004014024034044054064074084094104114124134144154164174184194204214224234244254264274284294304314324334344354364374384394404414424434444454464474484494504514524534544554564574584594604614624634644654664674684694704714724734744754764774784794804814824834844854864874884894904914924934944954964974984995005015025035045055065075085095105115125135145155165175185195205215225235245255265275285295305315325335345355365375385395405415425435445455465475485495505515525535545555565575585595605615625635645655665675685695705715725735745755765775785795805815825835845855865875885895905915925935945955965975985996006016026036046056066076086096106116126136146156166176186196206216226236246256266276286296306316326336346356366376386396406416426436446456466476486496506516526536546556566576586596606616626636646656666676686696706716726736746756766776786796806816826836846856866876886896906916926936946956966976986997007017027037047057067077087097107117127137147157167177187197207217227237247257267277287297307317327337347357367377387397407417427437447457467477487497507517527537547557567577587597607617627637647657667677687697707717727737747757767777787797807817827837847857867877887897907917927937947957967977987998008018028038048058068078088098108118128138148158168178188198208218228238248258268278288298308318328338348358368378388398408418428438448458468478488498508518528538548558568578588598608618628638648658668678688698708718728738748758768778788798808818828838848858868878888898908918928938948958968978988999009019029039049059069079089099109119129139149159169179189199209219229239249259269279289299309319329339349359369379389399409419429439449459469479489499509519529539549559569579589599609619629639649659669679689699709719729739749759769779789799809819829839849859869879889899909919929939949959969979989991000100110021003100410051006100710081009101010111012
  1. <template>
  2. <div class="head" :class="newIsShrink ?'hiddenbox':'bgcolor'">
  3. <div style="padding-top:2rem; height:100%;width:90%" class="baffleBox" v-show="!newIsShrink">
  4. <div class="allBox">
  5. <div class="box">
  6. <div class="row allAlignment center">
  7. <span style="color:#f8f8f8;font-size:0.24rem;">余额:{{cash}}</span>
  8. <span style="font-size:0.28rem; color:#333333;font-weight:bold">投注单</span>
  9. <img style="width:.50rem;height:0.8rem" :src="img_size" alt @click="shrink()">
  10. <!-- style="color:#33333;font-size:0.24rem;" -->
  11. </div>
  12. </div>
  13. <!-- 数据列表 -->
  14. <div
  15. class="titleBox"
  16. v-for="(item,index) in dataList"
  17. :key="index"
  18. @click="activekey(index)"
  19. >
  20. <div class="tilteMatch">
  21. <div class="row center allAlignment" style="height:.5rem;padding-left:0.32rem">
  22. <span :style="item.repeat? 'background: #f76649;':'' ">{{item.play_name}}</span>
  23. <span class="cancel" @click.stop="delarr(item.p_code,item.id)">
  24. <img style="width:.25rem;height:.25rem" :src="img" alt>
  25. </span>
  26. </div>
  27. <div class="tilteMatchDiv" style="min-height:1rem;padding:0 .32rem">
  28. <div class="row item-center" style="height:50%">
  29. <div v-if="item.p_code =='capot'">
  30. <span>{{item.name}}</span>&emsp;
  31. <span>{{item.condition == 1 ? item.home_team :item.condition == 'x'? '和局':item.condition == 2? item.guest_team:item.condition }}</span>@
  32. <span>{{item.odds}}</span>
  33. </div>
  34. <div v-else>
  35. <span>{{item.name}}</span>&emsp;
  36. <span>{{item.condition}}</span>@
  37. <span>{{item.odds}}</span>
  38. </div>
  39. </div>
  40. <div class="row item-center" style="height:50%;">
  41. <span>{{item.home_team}}</span>
  42. <span style="color:#F76649">vs</span>
  43. <span>{{item.guest_team}}</span>
  44. </div>
  45. </div>
  46. </div>
  47. <div class="bettingInput row item-center allAlignment">
  48. <div class="inputBox row allAlignment">
  49. <input
  50. class="input_text"
  51. type
  52. @click.stop="go()"
  53. v-model="bettingNumber[index]"
  54. placeholder="投注额"
  55. @click="activekey(index)"
  56. >
  57. <span style="padding:0 0.22rem;" @click.stop="ClearData(index)">
  58. <img style="width:.2rem;height:.2rem" :src="img" alt>
  59. </span>
  60. </div>
  61. <div class>
  62. <span v-if="bettingNumber[index]">{{(bettingNumber[index]*item.odds).toFixed(2)}}</span>
  63. <span v-else>可赢额</span>
  64. </div>
  65. </div>
  66. <div class="bottonBox row allAlignment" v-show="clickIndex==index">
  67. <div class="bottonBox-num column allAlignment center">
  68. <div @click="additionFun(100,index) ">+100</div>
  69. <div @click="additionFun(1000,index) ">+1000</div>
  70. <div @click="additionFun(10000,index) ">+10000</div>
  71. </div>
  72. <div class="column allAlignment center" >
  73. <div class="row allAlignment center" style="width:3.8rem">
  74. <div v-for=" n in 3" @click="updateNumber(n,index)">
  75. <button>{{n}}</button>
  76. </div>
  77. </div>
  78. <div class="row allAlignment center" style="width:3.8rem">
  79. <div v-for=" n in 3" @click="updateNumber(n+3,index)">
  80. <button>{{n+3}}</button>
  81. </div>
  82. </div>
  83. <div class="row allAlignment center" style="width:3.8rem">
  84. <div v-for=" n in 3" @click="updateNumber(n+6,index)">
  85. <button>{{n+6}}</button>
  86. </div>
  87. </div>
  88. </div>
  89. <div class="column allAlignment center" >
  90. <button class="btn-right" @click="delNumder(index)" >x</button>
  91. <button class="btn-right" style="margin:0.1rem 0;" @click="updateNumber('0',index)">0</button>
  92. <button class="btn-right" @click="updateNumber('00',index)">00</button>
  93. </div>
  94. </div>
  95. </div>
  96. <!-- 单注 -->
  97. <div class="showNumber" @click.stop="activekey('all')">
  98. <div v-if="dataList.length>1">
  99. <span v-if="dataList" style="font-size:.3rem">单注</span>
  100. <div class="bettingInput row item-center allAlignment">
  101. <div class="inputBox row allAlignment">
  102. <input type @click="go()" v-model="arrNumber" placeholder="投注额">
  103. <span class="cancel" @click.stop="ClearData('all')">
  104. <img style="width:.2rem;height:.2rem" :src="img" alt>
  105. </span>
  106. <!-- <span @click.stop="ClearData('all')">x</span> -->
  107. </div>
  108. <div class>
  109. <span v-if="arrNumber">{{(datamMoney).toFixed(2)}}</span>
  110. <span v-else>可赢额</span>
  111. </div>
  112. </div>
  113. <!-- <div class="bottonBox" v-if="clickIndex=='all'">
  114. <div class="bottonBox-num row allAlignment" style="padding:0 .2rem">
  115. <div @click="additionFun(100,'all') ">+100</div>
  116. <div @click="additionFun(1000,'all')">+1000</div>
  117. <div @click="additionFun(10000,'all')">+10000</div>
  118. </div>
  119. <div style="margin-top:0.42rem;margin-bottom:0.42rem">
  120. <div class="row allAlignment center">
  121. <div v-for=" n in 6" @click="updateNumber(n,'all')">
  122. <button>{{n}}</button>
  123. </div>
  124. </div>
  125. <div class="row allAlignment center" style="margin-top:0.17rem;">
  126. <div v-for=" n in 3" @click="updateNumber(n+6,'all')">
  127. <button>{{n+6}}</button>
  128. </div>
  129. <button @click="updateNumber('0','all')">0</button>
  130. <button @click="updateNumber('00','all')">00</button>
  131. <button
  132. @click="delNumder('all')"
  133. style="background:rgb(247, 102, 73);font-size:.4rem;line-height:.86rem;"
  134. >x</button>
  135. </div>
  136. </div>
  137. </div> -->
  138. <div class="bottonBox row allAlignment" v-if="clickIndex=='all'">
  139. <div class="bottonBox-num column allAlignment center">
  140. <div @click="additionFun(100,'all') ">+100</div>
  141. <div @click="additionFun(1000,'all') ">+1000</div>
  142. <div @click="additionFun(10000,'all') ">+10000</div>
  143. </div>
  144. <div class="column allAlignment center" >
  145. <div class="row allAlignment center" style="width:3.8rem">
  146. <div v-for=" n in 3" @click="updateNumber(n,'all')">
  147. <button>{{n}}</button>
  148. </div>
  149. </div>
  150. <div class="row allAlignment center" style="width:3.8rem">
  151. <div v-for=" n in 3" @click="updateNumber(n+3,'all')">
  152. <button>{{n+3}}</button>
  153. </div>
  154. </div>
  155. <div class="row allAlignment center" style="width:3.8rem">
  156. <div v-for=" n in 3" @click="updateNumber(n+6,'all')">
  157. <button>{{n+6}}</button>
  158. </div>
  159. </div>
  160. </div>
  161. <div class="column allAlignment center" >
  162. <button class="btn-right" @click="delNumder('all')" >x</button>
  163. <button class="btn-right" style="margin:0.1rem 0;" @click="updateNumber('0','all')">0</button>
  164. <button class="btn-right" @click="updateNumber('00','all')">00</button>
  165. </div>
  166. </div>
  167. </div>
  168. </div>
  169. <!-- 过关投注 && compound.length > 0 -->
  170. <div v-if="!passThroughPlay && dataList.length > 2 ">
  171. <yd-accordion>
  172. <yd-accordion-item title="复式连串过关投注" open>
  173. <div
  174. class="showNumber"
  175. v-for="(item,index) in compound"
  176. @click.stop="activekey('through'+index)"
  177. >
  178. <span v-if="dataList" style="font-size:.3rem">{{item.title}}</span>
  179. <div class="bettingInput row item-center allAlignment">
  180. <div class="row center">
  181. <div class="inputBox row allAlignment">
  182. <input type @click="go()" v-model="item.money " placeholder="投注额">
  183. <!-- <span @click.stop="ClearData('through')">x</span> -->
  184. <span class="cancel" @click.stop="ClearData('through',index)">
  185. <img style="width:.2rem;height:.2rem" :src="img" alt>
  186. </span>
  187. </div>
  188. <span style="font-size:0.26rem;margin-left: 0.1rem;">X{{item.index}}</span>
  189. </div>
  190. <div class>
  191. <span v-if="item.money*1 > 0 ">{{(item.money * item.odds).toFixed(2)}}</span>
  192. <span v-else>可赢额</span>
  193. </div>
  194. </div>
  195. <!-- <div class="bottonBox" v-if="clickIndex=='through'+index">
  196. <div class="bottonBox-num " style="padding:0 .2rem">
  197. <div @click="additionFun(100,'through',index) ">+100</div>
  198. <div @click="additionFun(1000,'through',index)">+1000</div>
  199. <div @click="additionFun(10000,'through',index)">+10000</div>
  200. </div>
  201. <div style="margin-top:0.42rem;margin-bottom:0.42rem">
  202. <div class="row allAlignment center">
  203. <div v-for=" n in 6" @click="updateNumber(n,'through',index)">
  204. <button>{{n}}</button>
  205. </div>
  206. </div>
  207. <div class="row allAlignment center" style="margin-top:0.17rem;">
  208. <div v-for=" n in 3" @click="updateNumber(n+6,'through',index)">
  209. <button>{{n+6}}</button>
  210. </div>
  211. <button @click="updateNumber('0','through',index)">0</button>
  212. <button @click="updateNumber('00','through',index)">00</button>
  213. <button
  214. @click="delNumder('through',index)"
  215. style="background:rgb(247, 102, 73);font-size:.4rem;line-height:.86rem;"
  216. >x</button>
  217. </div>
  218. </div>
  219. </div> -->
  220. <div class="bottonBox row allAlignment" v-if="clickIndex=='through'+index">
  221. <div class="bottonBox-num column allAlignment center">
  222. <div @click="additionFun(100,'through',index) ">+100</div>
  223. <div @click="additionFun(1000,'through',index) ">+1000</div>
  224. <div @click="additionFun(10000,'through',index) ">+10000</div>
  225. </div>
  226. <div class="column allAlignment center" >
  227. <div class="row allAlignment center" style="width:3.8rem">
  228. <div v-for=" n in 3" @click="updateNumber(n,'through',index)">
  229. <button>{{n}}</button>
  230. </div>
  231. </div>
  232. <div class="row allAlignment center" style="width:3.8rem">
  233. <div v-for=" n in 3" @click="updateNumber(n+3,'through',index)">
  234. <button>{{n+3}}</button>
  235. </div>
  236. </div>
  237. <div class="row allAlignment center" style="width:3.8rem">
  238. <div v-for=" n in 3" @click="updateNumber(n+6,'through',index)">
  239. <button>{{n+6}}</button>
  240. </div>
  241. </div>
  242. </div>
  243. <div class="column allAlignment center" >
  244. <button class="btn-right" @click="delNumder('through',index)" >x</button>
  245. <button class="btn-right" style="margin:0.1rem 0;" @click="updateNumber('0','through',index)">0</button>
  246. <button class="btn-right" @click="updateNumber('00','through',index)">00</button>
  247. </div>
  248. </div>
  249. </div>
  250. </yd-accordion-item>
  251. </yd-accordion>
  252. <!-- <div class="row allAlignment center " style="height: 0.8rem;background: #ccc;padding: 0 0.2rem;">
  253. <span>复式连串过关投注</span>
  254. <img style="width:.4rem;height:.4rem" src="../assets/st-imges/xiangxia.png" alt="">
  255. </div>-->
  256. </div>
  257. <div v-if="passThroughPlay" class="row center" style="background:#f8f8f8;">
  258. <span style="color:red ">红色选项不可以结合进行过关投注</span>
  259. </div>
  260. <!-- 总数据展示 -->
  261. <div class="row allAlignment" style="padding:.1rem .2rem;background:#f8f8f8;">
  262. <span v-if="dataNum" class="showNumberSpan">所有投注({{dataNum}}):</span>
  263. <span v-else class="showNumberSpan">所有投注:</span>
  264. <span v-if="dataNumbe" style="font-size:0.24rem">{{(dataNumbe)}}</span>
  265. <span v-else style="font-size:0.24rem">0.00</span>
  266. </div>
  267. <div class="row allAlignment" style="padding:0 .2rem;background:#f8f8f8;">
  268. <span class="showNumberSpan">可赢金额:</span>
  269. <span
  270. v-if="datamMoney || compound_amount "
  271. style="font-size:0.24rem;color:#F76649;"
  272. >{{compound_amount *1 ?(compound_amount*1+datamMoney*1).toFixed(2):(datamMoney).toFixed(2)}}</span>
  273. <span v-else style="font-size:0.24rem;color:#F76649;">0.00</span>
  274. </div>
  275. <div style="background:#f8f8f8;padding:.1rem 0;border-radius: 0 0 .1rem .1rem; ">
  276. <div class="btn" style="background:#F76649;" @click="betOrder" v-if="isLogin">
  277. <span>确认投注</span>
  278. </div>
  279. <div class="btn" style="background:#F76649;" @click="loginReg" v-else>
  280. <span>登陆/注册</span>
  281. </div>
  282. <div class="btn" style="background:#A1A1A1;" @click="shrink">
  283. <span>添加更多的选择</span>
  284. </div>
  285. <div class="btn" style="background:#333;margin-bottom:.1rem;" @click.stop="alldel()">
  286. <span>全删除</span>
  287. </div>
  288. </div>
  289. </div>
  290. <!-- <div class="loading_box row center" >
  291. <div class="weui-loading"></div>
  292. </div>-->
  293. </div>
  294. <div
  295. class="shrink"
  296. :style="newIsShrink?'':'display:none'"
  297. @click="show()"
  298. >
  299. 投注单--选项
  300. <span class="num">{{dataList?dataList.length:'0'}}</span>
  301. </div>
  302. <div></div>
  303. <div v-if="isshow" class="login">
  304. <Login></Login>
  305. </div>
  306. <div v-else-if="rgShow" class="login">
  307. <register></register>
  308. </div>
  309. </div>
  310. </template>
  311. <script>
  312. import "../css/index.css";
  313. import Login from "@/pages/Login/index/StLogin";
  314. import register from "@/pages/Login/index/register";
  315. export default {
  316. data() {
  317. return {
  318. img: require("../assets/st-imges/del.png"),
  319. img_size: require("../assets/st-imges/narrow.png"),
  320. bettingNumber: [],
  321. balance: "", //余额
  322. bettingquantity: "", // 投注信息
  323. betting: "",
  324. dataList: [],
  325. arr: [], // 是否缩小
  326. isshrink: false, //小键盘显示位
  327. clickIndex: 0,
  328. // money:0,//可赢金额
  329. arrNumber: "", //单注数量
  330. dataNum: 0, //已投注数量
  331. dataNumbe: 0, //总投数
  332. datamMoney: 0, //可赢总金额
  333. isThrough: false, //触发过关玩法
  334. cash: 0.0, //余额
  335. compound: [], //复合玩法
  336. passThroughPlay: false, //判断比赛数据是否有相同赛事
  337. isLogin: false, //是否登陆
  338. isshow: false, //登陆显示/隐藏
  339. rgShow: false, //注册显示/隐藏
  340. compound_amount: "", //复合玩法可赢金额
  341. isSubmit: false //防止重复提交
  342. };
  343. },
  344. components: {
  345. Login,
  346. register
  347. },
  348. methods: {
  349. //
  350. /*---------------------------------- */
  351. //阻止input框获取焦点
  352. go: function() {
  353. document.activeElement.blur();
  354. },
  355. /*---------------------------------- */
  356. //小键盘数字字符串拼接
  357. updateNumber: function(val, index, num) {
  358. // console.log(index);
  359. let temporaryData = "";
  360. let isNumbers = true;
  361. if (index != "through" && index == "all") {
  362. temporaryData =
  363. this.arrNumber * 1 ? this.arrNumber + val + "" : val + "";
  364. if (temporaryData * 1 > 999999999) {
  365. temporaryData = 999999999 + "";
  366. }
  367. this.arrNumber = temporaryData;
  368. }
  369. if (index == "through") {
  370. isNumbers = false;
  371. let dataVal =
  372. this.compound[num].money * 1 > 0
  373. ? this.compound[num].money + (val + "")
  374. : val + "";
  375. if (dataVal * 1 > 999999999) {
  376. dataVal = 999999999 + "";
  377. }
  378. this.$set(this.compound[num], "money", dataVal);
  379. } else {
  380. this.dataList.forEach((e, i) => {
  381. if (index != "all" && index != "through") {
  382. if (index == i) {
  383. temporaryData =
  384. this.bettingNumber[index] * 1
  385. ? this.bettingNumber[index] + (val + "")
  386. : val + "";
  387. if (temporaryData * 1 > 999999999) {
  388. temporaryData = 999999999 + "";
  389. }
  390. this.bettingNumber.splice(index, 1, temporaryData);
  391. this.arrNumber = "";
  392. }
  393. } else if (index == "all") {
  394. this.bettingNumber.splice(i, 1, temporaryData);
  395. }
  396. });
  397. }
  398. this.profitFun();
  399. },
  400. /*---------------------------------------------*/
  401. //投注加法
  402. additionFun: function(val, index, num) {
  403. let data = "";
  404. let isNumbers = true;
  405. if (index != "through" && index == "all") {
  406. let dataAdd = 0;
  407. data =
  408. this.arrNumber * 1 ? this.arrNumber * 1 + val * 1 + "" : val + "";
  409. if (data * 1 > 999999999) {
  410. data = 999999999 + "";
  411. }
  412. this.arrNumber = data;
  413. }
  414. if (index == "through") {
  415. isNumbers = false;
  416. let dataVal =
  417. this.compound[num].money * 1 > 0
  418. ? this.compound[num].money * 1 + val * 1
  419. : val + "";
  420. if (dataVal * 1 > 999999999) {
  421. dataVal = 999999999 + "";
  422. }
  423. this.$set(this.compound[num], "money", dataVal);
  424. } else {
  425. this.dataList.forEach((e, i) => {
  426. if (index != "all" && index != "through") {
  427. if (index == i) {
  428. data =
  429. this.bettingNumber[index] * 1
  430. ? this.bettingNumber[index] * 1 + val + ""
  431. : val + "";
  432. if (data * 1 > 999999999) {
  433. data = 999999999 + "";
  434. }
  435. this.bettingNumber.splice(index, 1, data);
  436. this.arrNumber = "";
  437. }
  438. } else if (index == "all") {
  439. this.bettingNumber.splice(i, 1, data);
  440. }
  441. });
  442. }
  443. //if(!isNumbers) return false;
  444. this.profitFun();
  445. },
  446. /*---------------------------------- */
  447. //删除投注数的一位数
  448. delNumder: function(index, num) {
  449. //console.log(this.compound);
  450. let Str = this.bettingNumber;
  451. let strVal = "";
  452. let isNumbers = true;
  453. if (index == "through") {
  454. isNumbers = false;
  455. strVal = this.compound[num].money.substring(
  456. 0,
  457. this.compound[num].money.length - 1
  458. );
  459. this.$set(this.compound[num], "money", strVal);
  460. } else {
  461. if (index != "all") {
  462. Str.forEach((e, i) => {
  463. if (i == index) {
  464. strVal = e;
  465. e = strVal.substring(0, strVal.length - 1);
  466. this.bettingNumber.splice(index, 1, e);
  467. this.arrNumber = "";
  468. }
  469. });
  470. } else {
  471. Str.forEach((e, i) => {
  472. strVal = e.substring(0, e.length - 1);
  473. // console.log(strVal);
  474. this.bettingNumber.splice(i, 1, strVal);
  475. });
  476. this.arrNumber = this.arrNumber.substring(
  477. 0,
  478. this.arrNumber.length - 1
  479. );
  480. }
  481. }
  482. //if(!isNumbers) return false;
  483. this.profitFun();
  484. },
  485. /*---------------------------------- */
  486. //清空input框数据
  487. ClearData: function(index, num) {
  488. let isNumbers = true;
  489. if (index == "through") {
  490. //console.log(num);
  491. isNumbers = false;
  492. this.$set(this.compound[num], "money", "");
  493. } else {
  494. this.bettingNumber.forEach((e, i) => {
  495. if (index != "all") {
  496. if (i == index) {
  497. this.bettingNumber.splice(index, 1, "");
  498. this.arrNumber = "";
  499. }
  500. } else if (index == "all") {
  501. this.bettingNumber.splice(i, 1, "");
  502. this.arrNumber = "";
  503. }
  504. });
  505. }
  506. //if(!isNumbers) return false;
  507. this.profitFun();
  508. },
  509. /*---------------------------------- */
  510. // 删除所有投注
  511. alldel() {
  512. let betting = this.$store.getters.getBetting;
  513. betting.forEach(e => {
  514. e.data = [];
  515. });
  516. this.$store.dispatch("SET_NOROLL", false);
  517. this.bettingNumber = [];
  518. this.$store.dispatch("BETTING", []);
  519. this.$store.dispatch("BETTING", betting);
  520. this.$public.setItem("box_size", 2);
  521. this.$store.dispatch("ISBETTING", "-1");
  522. this.$store.dispatch("DEL_TYPE", "all");
  523. this.profitFun();
  524. },
  525. /*---------------------------------- */
  526. // 激活投注框的小键盘
  527. activekey(index) {
  528. this.clickIndex = index;
  529. },
  530. /*---------------------------------- */
  531. // 删除指定的投注数据
  532. delarr(name, numid) {
  533. let betting = this.$store.getters.getBetting;
  534. betting.forEach(res => {
  535. if (res.title == name) {
  536. res.data.forEach((e, index) => {
  537. if (e.id == numid) {
  538. res.data.splice(index, 1);
  539. //删除数据也要删除想对应的值
  540. this.bettingNumber.splice(index, 1);
  541. }
  542. });
  543. }
  544. this.$store.dispatch("BETTING", []);
  545. this.$store.dispatch("BETTING", betting);
  546. });
  547. this.$store.dispatch("DEL_TYPE", numid);
  548. this.profitFun();
  549. },
  550. /*---------------------------------- */
  551. //投注窗口放大
  552. shrink() {
  553. this.isshrink = true;
  554. this.$public.setItem("box_size", 1);
  555. },
  556. /*---------------------------------- */
  557. //计算可赢金额(总额)
  558. profitFun() {
  559. let dataNum = 0;
  560. let dataNumbe = 0;
  561. let datamMoney = 0;
  562. let compound_amount = 0;
  563. this.bettingNumber.forEach((e, i) => {
  564. if (e) {
  565. dataNum++;
  566. dataNumbe += e * 1;
  567. datamMoney += e * 1 * this.dataList[i].odds;
  568. }
  569. });
  570. this.compound.forEach(e => {
  571. //console.log(e);
  572. if (e.money * 1 > 0) {
  573. dataNum += e.index * 1;
  574. dataNumbe += e.money * 1 * e.index * 1;
  575. compound_amount += e.money * e.odds;
  576. }
  577. });
  578. this.dataNum = dataNum;
  579. this.dataNumbe = dataNumbe + "";
  580. this.datamMoney = datamMoney;
  581. this.compound_amount = compound_amount;
  582. },
  583. /*---------------------------------- */
  584. //投注窗口缩小
  585. show() {
  586. this.isshrink = false;
  587. this.$public.setItem("box_size", 2);
  588. },
  589. /*---------------------------------- */
  590. //登陆
  591. loginReg() {
  592. let isShow = true;
  593. this.isshow = true;
  594. this.$store.dispatch("GET_ISSHOW", isShow);
  595. },
  596. /*------------------------------- */
  597. //投注确认提交
  598. betOrder() {
  599. if (this.isSubmit) return false;
  600. let limitingCond = JSON.parse(this.$public.getItem('limitingCond'));
  601. this.isSubmit = true;
  602. let list = [],obj = {},obj1 = {};
  603. for (let i = 0; i < this.bettingNumber.length; i++) {
  604. // console.log();
  605. if(this.bettingNumber[i]*1 < limitingCond.lower_limit*1){
  606. this.$dialog.alert({ mes: `亲!你输入的投注额,小于最低投注限制${limitingCond.lower_limit}元` });
  607. this.isSubmit = false;
  608. return false;
  609. }
  610. if(this.bettingNumber[i]*1 > limitingCond.upper_limit*1){
  611. this.$dialog.alert({ mes: `亲!你输入的投注额,大于最高投注限制${limitingCond.upper_limit}元` });
  612. this.isSubmit = false;
  613. return false;
  614. }
  615. }
  616. this.dataList.forEach((res, index) => {
  617. //单式数据组合
  618. if (this.bettingNumber[index]) {
  619. obj = {
  620. type: "1",
  621. index: index,
  622. bet_amount: this.bettingNumber[index]
  623. };
  624. list.push(obj);
  625. }
  626. });
  627. //串式数据组合
  628. this.compound.forEach(e => {
  629. if (e.money) {
  630. obj = {
  631. type: e.title,
  632. // odds:e.odds,
  633. bet_amount: e.money //e.amount
  634. };
  635. list.push(obj);
  636. }
  637. });
  638. list.push(this.dataList);
  639. if (list.length > 1 && this.dataNumbe *1 >0 ) {
  640. //if(limitingCond.lower_limit * 1 <= this.dataNumbe && limitingCond.upper_limit * 1 >= this.dataNumbe){
  641. let token = this.$public.getItem("token");
  642. this.$http.post(this.$ports.betOrder.Bet, {
  643. data: list,
  644. token,
  645. bet_money: this.dataNumbe
  646. }).then(res => {
  647. if (res.data.status == 1) {
  648. this.alldel();
  649. this.cash = (this.cash - this.dataNumbe * 1).toFixed(2);
  650. this.$dialog.alert({ mes: "亲!你已经投注成功啦。" });
  651. } else if (res.data.status == "-4001") {
  652. this.isLogin = false;
  653. this.$dialog.alert({ mes: "亲!你的登陆已过期。" });
  654. } else if (res.data.status == "4204") {
  655. this.$dialog.alert({ mes: "亲!你的余额不足。" });
  656. }else if(res.data.status == '7027' ){
  657. this.$dialog.alert({ mes: "亲!赔率发生变法,请重新选择。" });
  658. this.alldel();
  659. }else{
  660. this.$dialog.alert({ mes: "错误代码:"+res.data.status});
  661. }
  662. this.isSubmit = false;
  663. });
  664. //}
  665. } else {
  666. this.$dialog.alert({ mes: "亲!你还未输入投注金额啦。" });
  667. this.isSubmit = false;
  668. }
  669. },
  670. /*---------------------------------- */
  671. //投注页面数据处理
  672. getDataList: function(val) {
  673. let arrays = [];
  674. this.dataList = [];
  675. if (val) {
  676. val.forEach(e => {
  677. if (e.data.length > 0) {
  678. e.data.forEach((res, index) => {
  679. if (this.bettingNumber.length < e.data.length) {
  680. this.bettingNumber.push("");
  681. }
  682. res.repeat = false;
  683. this.passThroughPlay = false;
  684. arrays.push(res);
  685. //console.log('什么数据',arrays);
  686. });
  687. }
  688. });
  689. this.dataList = arrays;
  690. //判断比赛数据是否相同赛事
  691. if (this.dataList.length > 1) {
  692. this.dataList.forEach((res, i) => {
  693. this.dataList.forEach((e, index) => {
  694. if (res.match_id == e.match_id && i != index) {
  695. e.repeat = true;
  696. this.passThroughPlay = true;
  697. }
  698. });
  699. });
  700. }
  701. // 查看是否还有数据确定是否要关闭窗口
  702. }
  703. if (this.dataList.length == 0) {
  704. this.$public.setItem("box_size", 2);
  705. this.$store.dispatch("ISBETTING", "-1");
  706. }
  707. //console.log('处理完成的数据',this.dataList);
  708. //判断是否有过关玩法
  709. if (this.dataList.length >= 3) {
  710. this.compound.splice(0, this.compound.length);
  711. this.isThrough = true;
  712. this.dataList.forEach((res, index) => {
  713. if (index >= 2) {
  714. //this.$public.betPlay(index+1,this.dataList)
  715. this.compound.push(this.$public.betPlay(index + 1, this.dataList));
  716. }
  717. });
  718. } else {
  719. this.compound.splice(0, this.compound.length);
  720. }
  721. this.$store.dispatch("DEL_TYPE", "");
  722. },
  723. /*---------------------------------- */
  724. //获取用户个人信息
  725. getUserInfo() {
  726. let token = this.$public.getItem("token");
  727. this.$http.post(this.$ports.login.getAgent, { token }).then(res => {
  728. //console.log('检测',res);
  729. if (res.data.status == 1 && res.data.data != null) {
  730. this.cash = res.data.data.cash;
  731. this.isLogin = true;
  732. } else {
  733. this.isLogin = false;
  734. }
  735. });
  736. }
  737. },
  738. /**
  739. *
  740. */
  741. computed: {
  742. //获取vuex投注数据
  743. getBetting: function() {
  744. return this.$store.getters.getBetting;
  745. },
  746. /*------------------------------*/
  747. //获取投注框放大缩小状态
  748. newIsShrink() {
  749. // 改变背景滑动
  750. this.$store.dispatch("SET_NOROLL", !this.isshrink);
  751. return this.isshrink;
  752. },
  753. //获取注册页面状态
  754. getRgShow() {
  755. return this.$store.getters.getRgShow;
  756. },
  757. //获取登陆页面状态
  758. getIsShow() {
  759. return this.$store.getters.getIsShow;
  760. },
  761. //获取用户token
  762. getToken() {
  763. return this.$store.getters.getToken;
  764. }
  765. },
  766. /**
  767. *
  768. */
  769. watch: {
  770. getIsShow(val) {
  771. this.isshow = val;
  772. },
  773. getBetting(val) {
  774. this.getDataList(val);
  775. },
  776. //显示注册页面
  777. getRgShow(val) {
  778. this.rgShow = val;
  779. this.isshow = val ? false : true;
  780. //console.log(this.rgShow);
  781. },
  782. getToken(val) {
  783. //this.getUserInfo();
  784. this.isLogin = true;
  785. }
  786. },
  787. /**
  788. * 页面初始化完成进行挂载
  789. */
  790. mounted() {
  791. if (this.$public.getItem("box_size") == 1) {
  792. this.isshrink = true;
  793. }
  794. this.getDataList(this.$store.getters.getBetting);
  795. this.getUserInfo();
  796. if (this.$public.getItem("token")) {
  797. this.isLogin = true;
  798. }
  799. }
  800. };
  801. </script>
  802. <style scoped>
  803. div /deep/ .yd-accordion-head {
  804. padding: 0 0.32rem;
  805. background: #a0a0a0;
  806. }
  807. div /deep/ .yd-accordion-title {
  808. color: #fefefe;
  809. font-size: 0.28rem;
  810. }
  811. div /deep/ .yd-accordion-head-arrow:after {
  812. border: none;
  813. width: 0.5rem;
  814. height: 0.5rem;
  815. background: url("../assets/st-imges/xiangxia.png") no-repeat;
  816. background-size: 100% 100%;
  817. }
  818. .login {
  819. z-index: 999999;
  820. position: fixed;
  821. top: 0;
  822. }
  823. .num {
  824. display: inline-block;
  825. width: 0.46rem;
  826. height: 0.46rem;
  827. background: #dcdcdc;
  828. border-radius: 50%;
  829. line-height: 0.46rem;
  830. text-align: center;
  831. color: #f76649;
  832. }
  833. .bgcolor {
  834. background: rgba(40, 40, 40, 0.75);
  835. height: 55rem;
  836. }
  837. .hiddenbox {
  838. height: 1rem;
  839. }
  840. .head {
  841. display: flex;
  842. justify-content: center;
  843. position: fixed;
  844. bottom: 0;
  845. left: 0;
  846. width: 100%;
  847. z-index: 1000000;
  848. }
  849. .baffleBox {
  850. position: fixed;
  851. overflow-y: scroll;
  852. top: 0;
  853. left: 0.4rem;
  854. width: 100%;
  855. height: 100%;
  856. -webkit-overflow-scrolling: touch;
  857. z-index: 29;
  858. box-sizing: border-box;
  859. }
  860. .baffleBox::-webkit-scrollbar {
  861. width: 0;
  862. height: 0;
  863. background: transparent;
  864. }
  865. .allBox {
  866. width: 100%;
  867. height: 100%;
  868. border-radius: 0.1rem 0.1rem;
  869. }
  870. .box {
  871. background: #f76649;
  872. border-radius: 0.1rem 0.1rem 0 0;
  873. height: 1rem;
  874. line-height: 1rem;
  875. padding: 0 0.32rem 0 0.22rem;
  876. }
  877. .bottonBox {
  878. /* margin-top: 0.1rem;*/
  879. padding: 0.22rem 0;
  880. background: #CFD3D9;
  881. }
  882. .titleBox {
  883. padding: 0.21rem 0.07rem;
  884. border-bottom: 1px solid #ebebeb;
  885. background: #f8f8f8;
  886. }
  887. .bettingInput {
  888. padding-right: 0.32rem;
  889. padding-left: 0.45rem;
  890. height: 0.9rem;
  891. margin-top: 0.1rem;
  892. }
  893. .inputBox {
  894. width: 2.6rem;
  895. height: 0.8rem;
  896. border: 1px solid #CFD3D9;
  897. border-radius: 0.1rem;
  898. line-height: 0.8rem;
  899. padding-left: 0.22rem;
  900. }
  901. input {
  902. border: 0;
  903. width: 1.7rem;
  904. }
  905. .tilteMatch {
  906. height: 1.52rem;
  907. background: #ebebeb;
  908. }
  909. .tilteMatchDiv {
  910. margin-left: 0.13rem;
  911. }
  912. .cancel {
  913. padding: 0 0.15rem;
  914. }
  915. .btn-right{
  916. color: #FFFFFF;
  917. background: #A7AFBC;
  918. }
  919. button {
  920. width: 1.2rem;
  921. height: 0.8rem;
  922. border: 0;
  923. background: #FFFFFF;
  924. border-radius: 0.1rem;
  925. color: #000000;
  926. }
  927. .bottonBox-num > div {
  928. text-align: center;
  929. width: 1.2rem;
  930. height: 0.8rem;
  931. line-height: 0.8rem;
  932. border-radius: 0.1rem;
  933. color: #FFFFFF;
  934. background: #A7AFBC;
  935. }
  936. .showNumber {
  937. /* margin-top: 0.36rem; */
  938. border-bottom: 1px solid #ebebeb;
  939. background: #f8f8f8;
  940. padding-top: 0.2rem;
  941. padding: 0.21rem 0.2rem;
  942. }
  943. .btn {
  944. width: 100%;
  945. height: 0.94rem;
  946. border-radius: 0.1rem;
  947. line-height: 0.94rem;
  948. color: #f8f8f8;
  949. text-align: center;
  950. margin-top: 0.1rem;
  951. }
  952. .showNumberSpan {
  953. color: #363636;
  954. font-size: 0.28rem;
  955. }
  956. .shrink {
  957. height: 1rem;
  958. width: 100%;
  959. background: #f76649;
  960. color: #dcdcdc;
  961. position: fixed;
  962. left: 0;
  963. bottom: 0rem;
  964. line-height: 1rem;
  965. text-align: center;
  966. font-size: 0.3rem;
  967. }
  968. .loading_box {
  969. width: 3rem;
  970. height: 3rem;
  971. background: #ebebeb;
  972. }
  973. </style>