liyongli 2 tahun lalu
induk
melakukan
151793efea
4 mengubah file dengan 70 tambahan dan 111 penghapusan
  1. 0 1
      src/api/worldCup.js
  2. TEMPAT SAMPAH
      src/assets/img/vote.png
  3. 54 104
      src/view/WorldCup/components/match.vue
  4. 16 6
      src/view/WorldCup/index.vue

+ 0 - 1
src/api/worldCup.js

@@ -65,4 +65,3 @@ export function getBannerAndVideo(data) {
     data,
   });
 }
-

TEMPAT SAMPAH
src/assets/img/vote.png


+ 54 - 104
src/view/WorldCup/components/match.vue

@@ -51,8 +51,15 @@
       </svg>
     </div>
     <br />
-    <div style="padding: 0 10vw;">
-        <van-button round type="primary" block @click="upData" color="linear-gradient(to right, #ff6034, #ee0a24)">完成预测</van-button>
+    <div style="padding: 0 10vw">
+      <van-button
+        round
+        type="primary"
+        block
+        @click="upData"
+        color="linear-gradient(to right, #ff6034, #ee0a24)"
+        >完成预测</van-button
+      >
     </div>
   </div>
 </template>
@@ -75,18 +82,14 @@ const user = inject("user");
 const width = ref(availWidth - 4);
 const flag = reactive([]);
 const line = reactive([]);
-const list = [];
 const rowHeight = fontSize.value / 1.5 + 30;
 const height = ref(rowHeight * maxcol.length + 25);
 let textSize = 12;
 let id = "";
 for (let row = 0; row < maxcol.length; row++) {
   let text = "?";
-  let isDefault = true;
   let file = undefined;
-  if (row === 0 || row === maxcol.length - 1) {
-    isDefault = false;
-  } else if (row == 4) {
+  if (row == 4) {
     file = require("../../../assets/img/default_big.png");
   } else {
     file = require("../../../assets/img/default.png");
@@ -98,27 +101,22 @@ for (let row = 0; row < maxcol.length; row++) {
   if (row == 4) fSize += 35;
   const colWidth = (width.value - 10) / len; // 列宽
   for (let col = 0; col < len; col++) {
+    const teamItem = team[row][col] || {};
     let imgUrl = {
-      isDefault,
       file,
-      isWinner: false,
-      selectId: undefined,
-      pSelectId: undefined,
+      isWinner: teamItem.isWinner,
+      selectId: teamItem.selectId,
+      pSelectId: teamItem.pSelectId,
+      isForeast: teamItem.isForeast,
+      isED: teamItem.isED,
       ed: false,
     };
     const x = colWidth * col + colWidth / 2;
     const textY = y + fSize / 1.5 + textSize;
     id = [row, col].join("-");
-    const teamItem = team[row][col] || {};
-    imgUrl.isED = teamItem.isED;
-    imgUrl.isWinner = teamItem.isWinner;
-    imgUrl.selectId = teamItem.selectId;
-    imgUrl.pSelectId = teamItem.pSelectId;
     if (teamItem.team) text = teamItem.team;
     if (teamItem.teamlogo) {
       imgUrl.file = teamItem.teamlogo;
-      imgUrl.isDefault = false;
-      imgUrl.ed = !(row !== 3 || row !== 5);
     } else if (!imgUrl.file)
       imgUrl.file = require("../../../assets/img/china.png");
     // 前两位 坐标, 第三位行数, 第四位 列数, 第五位 文本配置;
@@ -185,96 +183,48 @@ function line3(x, textY, col, colWidth) {
 
 function selectFlag(index) {
   const select = flag[index];
-  let linkSelect = [];
-  if (index % 2 === 0) linkSelect = flag[index + 1];
-  else linkSelect = flag[index - 1];
-  if (select[2] == 4 || select[6].isDefault || select[6].ed || select[6].isED)
-    return;
-  //   更新选中划线
-  //   const linkID = [
-  //     select[2],
-  //     select[3] % 2 === 0 ? select[3] + 1 : select[3] - 1,
-  //   ].join("-");
-  //   for (let i = 0; i < line.length; i++) {
-  //     const v = line[i];
-  //     if (v.id != linkID) continue;
-  //     v.color = "#b8dd8a80";
-  //     break;
-  //   }
-  //   line[index].color = "#FF9030";
-  // 更新选中球队
-  // 4行以上向下选择,4行一下向上选择
-  const isDown = select[2] < 4 ? 1 : -1;
-  const selectItem = {
-    isWinner: true,
-    file: select[6].file,
-    isDefault: select[6].isDefault,
-    selectId: select[6].selectId ? select[6].selectId : select[5],
-  };
-  /**
-   * 选择上一级关联位置时
-   * 列index%2 === 0 直接 / 2
-   * 列index%2 === 1 直接 -1/ 2
-   * 直至 为0
-   */
-  let colList = [];
-  let lastP = [];
-  let linkRow = select[2] + isDown;
-  let isNext = true;
-  while (isNext) {
-    const lastCol = colList[colList.length - 1]
-      ? colList[colList.length - 1][1]
-      : select[3];
-    let next = [];
-    if (lastCol % 2 === 0) next = [linkRow, lastCol / 2];
-    else next = [linkRow, (lastCol - 1) / 2];
-    let T = 0;
-    for (let i = 0; i < linkRow; i++) {
-      T += maxcol[i];
+  console.log(select[6].isED)
+  if (select[2] == 4 || select[6].isED || select[6].isForeast) return;
+  const linkSelect = flag[select[3] % 2 === 0 ? index + 1 : index - 1] || undefined;
+  console.log(linkSelect,select[3])
+  const startRow = select[2]; // 行数
+  const startCol = select[3]; // 点击列数
+  const isDown = startRow < 4 ? 1 : -1; // 递增系数
+  let Row = startRow + isDown;
+  let Col = startCol % 2 === 0 ? startCol / 2 : (startCol - 1) / 2;
+  let coordinate = [];
+  for (let i = Row; isDown > 0 ? i <= 4 : i >= 4; i += isDown) {
+    let indexNum = Col;
+    for (let o = 0; o < i; o++) {
+      indexNum += maxcol[o];
     }
-    T += next[1];
-    if (
-      flag[T][4].text == linkSelect[4].text ||
-      flag[T][4].text === select[4].text
-    )
-      colList.push(next);
-    linkRow += isDown;
-    if (!lastP.length) lastP = next;
-    if (next[0] === 4) isNext = false;
+    const startText = flag[indexNum][4].text || "";
+    coordinate.push({
+      x: Col,
+      y: i,
+      indexNum,
+    });
+    Col = Col % 2 === 0 ? Col / 2 : (Col - 1) / 2;
+    if (startText === "?") break;
   }
-  colList = colList.join(" ");
-  let nextIsT = false;
-  for (let i = 0; i < flag.length; i++) {
-    const v = flag[i];
-    if (v[5] !== lastP.join("-")) continue;
-    nextIsT = !!v[6].selectId;
+  let len = coordinate.length;
+  if (len < 2) {
+    // 只有下一行
+    flag[coordinate[0].indexNum][4].text = select[4].text;
+    flag[coordinate[0].indexNum][6].file = select[6].file;
+    return;
   }
-  for (let i = 0; i < flag.length; i++) {
-    const v = flag[i];
-    const row = v[2];
-    const col = v[3];
-    const colWidth = (width.value - 10) / maxcol[row];
-    const isRow =
-      isDown > 0 ? row > select[2] && row <= 4 : row >= 4 && row < select[2];
-    const rex = new RegExp([row, col].join(","));
-    const isLink = rex.test(colList);
-    let toStep = !isRow || !isLink || v[6].isDefault;
-    toStep = toStep && v[5] !== lastP.join("-");
-    if (!nextIsT) {
-      toStep = v[6].selectId
-        ? toStep || v[6].selectId !== selectItem.selectId
-        : toStep;
-    }
-    if (toStep) continue;
-    flag[i][6] = {
-      ...flag[i][6],
-      ...JSON.parse(JSON.stringify(selectItem)),
-    };
-    flag[i][4].text = select[4].text;
-    flag[i][4].x = colWidth * col + colWidth / 2 - (2 * textSize) / 2 + 4;
+  // 多行已经选择
+  if(flag[coordinate[len - 1].indexNum][4].text == '?') len--;
+  for (let i = 0; i < len; i++) {
+    if (
+      !linkSelect ||
+      flag[coordinate[i].indexNum][4].text !== linkSelect[4].text
+    )
+      continue;
+    flag[coordinate[i].indexNum][4].text = select[4].text;
+    flag[coordinate[i].indexNum][6].file = select[6].file;
   }
-
-  list.push(JSON.parse(JSON.stringify(select)));
 }
 
 function upData() {

+ 16 - 6
src/view/WorldCup/index.vue

@@ -40,7 +40,7 @@
     </div>
     <div class="down">
       <div class="videobg">
-        <div class="title">模块标题</div>
+        <div class="title">精彩视频</div>
         <van-row gutter="18">
           <van-col
             class="video"
@@ -134,27 +134,33 @@ function setStorage() {
 /**
  * getMatch  获得赛事日程;
  */
-Promise.all([getMatch(), getBannerAndVideo()]).then(li => {
+Promise.all([
+  getMatch({
+    phone: from.phone,
+  }),
+  getBannerAndVideo(),
+]).then(li => {
   formmateMatch(li[0] || []);
   formmateBanner(li[1] || {});
 });
 
 function formmateBanner(r) {
-  console.log(r);
   Videos.value = r.videos || [];
   Banner.value = r.banner || [];
 }
 
 function formmateMatch(matchList) {
+  const isForeast = !!matchList[14].isWinner;
   for (let i = 0; i < matchList.length; i++) {
     const v = matchList[i];
-    if (v.rounds === "1/8决赛") setRow(0, v); // 16进8
-    else if (v.rounds === "1/4决赛") setRow(1, v); // 8进4
+    if (v.rounds === "1/8决赛") setRow(0, v, isForeast); // 16进8
+    else if (v.rounds === "1/4决赛") setRow(1, v, isForeast); // 8进4
     else if (v.rounds === "半决赛") setRow(2, v); // 4进2
     else if (v.rounds === "决赛") {
       // 2进1
       team[3] = [
         {
+          isForeast,
           team: v.home,
           isWinner: v.winner === v.home,
           teamlogo: v.homeLogo,
@@ -166,6 +172,7 @@ function formmateMatch(matchList) {
       ];
       team[5] = [
         {
+          isForeast,
           team: v.away,
           isWinner: v.winner === v.away,
           teamlogo: v.awayLogo,
@@ -186,6 +193,7 @@ function formmateMatch(matchList) {
               ? v.awayLogo
               : "",
           isHome: true,
+          isForeast,
           isED: !!v.winner,
           selectId: v.id,
           pSelectId: v.pid,
@@ -210,13 +218,14 @@ function setRow(index, v) {
   }
 }
 
-function setTeam(teamIndex, item) {
+function setTeam(teamIndex, item, isForeast) {
   if (!team[teamIndex]) team[teamIndex] = [];
   team[teamIndex].push({
     team: item.home || "",
     isWinner: item.winner === item.home,
     teamlogo: item.homeLogo || "",
     isED: !!item.winner,
+    isForeast,
     isHome: true,
     selectId: item.id,
     pSelectId: item.pid,
@@ -226,6 +235,7 @@ function setTeam(teamIndex, item) {
     isWinner: item.winner === item.away,
     teamlogo: item.awayLogo || "",
     isED: !!item.winner,
+    isForeast,
     isHome: false,
     selectId: item.id,
     pSelectId: item.pid,