uniapp js 数独小游戏 写死的简单数独demo(优化完成) 数独 4.0

news/2024/9/20 7:36:49/文章来源:https://www.cnblogs.com/dreammiao/p/18396833
<template>
  <view class="wrap">
    <view class="timeGame">
      <text class="time">时间 {{ gameTime }}</text>
    </view>
    <view class="listWrap">
      <view
        :class="[
          'listWraps',
          sdNum == 4
            ? 'listWrapsFour'
            : sdNum == 5
            ? 'listWrapsFive'
            : sdNum == 6
            ? 'listWrapsSix'
            : ''
        ]"
        v-if="sdNum == 4 || sdNum == 5 || sdNum == 6"
      >
        <view
          :class="[
            'items',
            item.active == 'on' ? 'on' : item.active == 'error' ? 'error' : '',
            activeOn == index ? 'active' : ''
          ]"
          v-for="(item, index) in rightListOld"
          :key="index"
          @click="chooseNum(item, index)"
        >
          {{ item.num }}
        </view>
      </view>
      <view class="listWraps listWrapsFour" v-else>
        <view class="items" v-for="(item, index) in 16" :key="index" />
      </view>
      <view class="numberWrap" v-if="sdNum == 4 || sdNum == 5 || sdNum == 6">
        <view class="title">填入数字,保证每一行列的数字不重复</view>
        <view class="number">
          <text
            class="item"
            @click="fillIn(item, index)"
            v-for="(item, index) in numberList"
            :key="index"
            >{{ item }}</text
          >
        </view>
      </view>
      <view class="'numberWrap numberWrapFour'" v-else>
        <view class="title">填入数字,保证每一行列的数字不重复</view>
        <view class="number">
          <text class="item" v-for="(item, index) in numberList" :key="index">{{ item }}</text>
        </view>
      </view>
    </view>
    <view class="zhezhao" v-if="zhezhaoShow">
      <text class="bg" />
      <view class="zhezhaoWrap" v-if="chooseShow">
        <view class="title">选择难度</view>
        <view class="btnWrap">
          <view class="btn" @click="chooseLevel(4)">
            <img class="img" src="@/static/image/sdBtn.png" alt="" />
            <text class="name">简 单</text>
          </view>
          <view class="btn" @click="chooseLevel(5)">
            <img class="img" src="@/static/image/sdBtn.png" alt="" />
            <text class="name">普 通</text>
          </view>
          <view class="btn" @click="chooseLevel(6)">
            <img class="img" src="@/static/image/sdBtn.png" alt="" />
            <text class="name">困 难</text>
          </view>
        </view>
      </view>
      <view class="startGame" v-else>
        <view class="btnWrap">
          <view class="btn" @click="startGameFun">
            <img class="img" src="@/static/image/sdBtn.png" alt="" />
            <text class="name">开始游戏</text>
          </view>
        </view>
      </view>
    </view>
    <view
      :class="['zhezhao zhezhaoState', zhezhaoShowState == true ? 'on' : '']"
      class="zhezhao zhezhaoState"
      v-if="zhezhaoShowState"
    >
      <text class="bg" />
      <view class="zhezhaoStateWrap">
        <view v-if="zhezhaoIsSuccess">
          <view class="title">完成训练!</view>
          <view class="consuming">
            <text class="name">耗时</text>
            <text class="time">{{ timeMin }}</text>
            <text class="name mr24">分</text>
            <text class="time">{{ timeSeconds }}</text>
            <text class="name ml24">秒</text>
          </view>
        </view>
        <view v-else class="title overTime">游戏超时自动结束</view>
        <view class="btnWrap">
          <view class="btn" @click="trainAgain(1)">
            <img class="img" src="@/static/image/sdBtn.png" alt="" />
            <text class="name">再次训练</text>
          </view>
          <view class="btn" @click="trainAgain(2)">
            <img class="img" src="@/static/image/sdBtn.png" alt="" />
            <text class="name">退出训练</text>
          </view>
        </view>
      </view>
    </view>
  </view>
</template>

<script setup lang="ts">
import { ref } from 'vue'
import { onShow, onHide } from '@dcloudio/uni-app'
//选择难度
const zhezhaoShow = ref(true)
const chooseShow = ref(true)
const sdNum = ref(0)
const sdNumOld = ref(0)
const rightListOld = ref([])
const randomNum = ref(0)
// const answerList = ref([])
const rowList = ref([
  {
    question: [
      [0, 0, 0, 0],
      [0, 2, 3, 1],
      [0, 3, 2, 4],
      [2, 1, 0, 3]
    ],
    answer: [
      [3, 4, 1, 2],
      [4, 2, 3, 1],
      [1, 3, 2, 4],
      [2, 1, 4, 3]
    ],
    itemList: [
      '1-1',
      '1-2',
      '1-3',
      '1-4',
      '2-1',
      '2-2',
      '2-3',
      '2-4',
      '3-1',
      '3-2',
      '3-3',
      '3-4',
      '4-1',
      '4-2',
      '4-3',
      '4-4'
    ],
    state: [
      'false',
      'false',
      'false',
      'false',
      'false',
      'true',
      'true',
      'true',
      'false',
      'true',
      'true',
      'true',
      'true',
      'true',
      'false',
      'true'
    ]
  },
  {
    question: [
      [2, 0, 0, 3],
      [3, 0, 2, 1],
      [0, 2, 3, 0],
      [0, 0, 0, 2]
    ],
    answer: [
      [2, 1, 4, 3],
      [3, 4, 2, 1],
      [1, 2, 3, 4],
      [4, 3, 1, 2]
    ],
    itemList: [
      '1-1',
      '1-2',
      '1-3',
      '1-4',
      '2-1',
      '2-2',
      '2-3',
      '2-4',
      '3-1',
      '3-2',
      '3-3',
      '3-4',
      '4-1',
      '4-2',
      '4-3',
      '4-4'
    ],
    state: [
      'true',
      'false',
      'false',
      'true',
      'true',
      'false',
      'true',
      'true',
      'false',
      'true',
      'true',
      'false',
      'false',
      'false',
      'false',
      'true'
    ]
  },
  {
    question: [
      [1, 0, 0, 0],
      [4, 2, 3, 0],
      [0, 4, 1, 0],
      [3, 1, 0, 2]
    ],
    answer: [
      [1, 3, 2, 4],
      [4, 2, 3, 1],
      [2, 4, 1, 3],
      [3, 1, 4, 2]
    ],
    itemList: [
      '1-1',
      '1-2',
      '1-3',
      '1-4',
      '2-1',
      '2-2',
      '2-3',
      '2-4',
      '3-1',
      '3-2',
      '3-3',
      '3-4',
      '4-1',
      '4-2',
      '4-3',
      '4-4'
    ],
    state: [
      'true',
      'false',
      'false',
      'false',
      'true',
      'true',
      'true',
      'false',
      'false',
      'true',
      'true',
      'false',
      'true',
      'true',
      'false',
      'true'
    ]
  },
  {
    question: [
      [3, 0, 1, 0],
      [0, 1, 2, 0],
      [2, 0, 3, 0],
      [0, 3, 0, 2]
    ],
    answer: [
      [3, 2, 1, 4],
      [4, 1, 2, 3],
      [2, 4, 3, 1],
      [1, 3, 4, 2]
    ],
    itemList: [
      '1-1',
      '1-2',
      '1-3',
      '1-4',
      '2-1',
      '2-2',
      '2-3',
      '2-4',
      '3-1',
      '3-2',
      '3-3',
      '3-4',
      '4-1',
      '4-2',
      '4-3',
      '4-4'
    ],
    state: [
      'true',
      'false',
      'true',
      'false',
      'false',
      'true',
      'true',
      'false',
      'true',
      'false',
      'true',
      'false',
      'false',
      'true',
      'false',
      'true'
    ]
  },
  {
    question: [
      [0, 0, 3, 0],
      [0, 2, 0, 1],
      [0, 3, 2, 4],
      [0, 4, 1, 0]
    ],
    answer: [
      [4, 1, 3, 2],
      [3, 2, 4, 1],
      [1, 3, 2, 4],
      [2, 4, 1, 3]
    ],
    itemList: [
      '1-1',
      '1-2',
      '1-3',
      '1-4',
      '2-1',
      '2-2',
      '2-3',
      '2-4',
      '3-1',
      '3-2',
      '3-3',
      '3-4',
      '4-1',
      '4-2',
      '4-3',
      '4-4'
    ],
    state: [
      'false',
      'false',
      'true',
      'false',
      'false',
      'true',
      'false',
      'true',
      'false',
      'true',
      'true',
      'true',
      'false',
      'true',
      'true',
      'false'
    ]
  },
  {
    question: [
      [0, 1, 4, 0],
      [4, 2, 0, 1],
      [0, 0, 0, 0],
      [0, 4, 2, 3]
    ],
    answer: [
      [3, 1, 4, 2],
      [4, 2, 3, 1],
      [2, 3, 1, 4],
      [1, 4, 2, 3]
    ],
    itemList: [
      '1-1',
      '1-2',
      '1-3',
      '1-4',
      '2-1',
      '2-2',
      '2-3',
      '2-4',
      '3-1',
      '3-2',
      '3-3',
      '3-4',
      '4-1',
      '4-2',
      '4-3',
      '4-4'
    ],
    state: [
      'false',
      'true',
      'true',
      'false',
      'true',
      'true',
      'false',
      'true',
      'false',
      'false',
      'false',
      'false',
      'false',
      'true',
      'true',
      'true'
    ]
  },
  {
    question: [
      [1, 0, 4, 0],
      [0, 2, 0, 3],
      [0, 1, 3, 4],
      [0, 0, 0, 1]
    ],
    answer: [
      [1, 3, 4, 2],
      [4, 2, 1, 3],
      [2, 1, 3, 4],
      [3, 4, 2, 1]
    ],
    itemList: [
      '1-1',
      '1-2',
      '1-3',
      '1-4',
      '2-1',
      '2-2',
      '2-3',
      '2-4',
      '3-1',
      '3-2',
      '3-3',
      '3-4',
      '4-1',
      '4-2',
      '4-3',
      '4-4'
    ],
    state: [
      'true',
      'false',
      'true',
      'false',
      'false',
      'true',
      'false',
      'true',
      'false',
      'true',
      'true',
      'true',
      'false',
      'false',
      'false',
      'true'
    ]
  },
  {
    question: [
      [0, 0, 0, 3],
      [0, 3, 4, 2],
      [0, 1, 0, 0],
      [4, 0, 3, 1]
    ],
    answer: [
      [2, 4, 1, 3],
      [1, 3, 4, 2],
      [3, 1, 2, 4],
      [4, 2, 3, 1]
    ],
    itemList: [
      '1-1',
      '1-2',
      '1-3',
      '1-4',
      '2-1',
      '2-2',
      '2-3',
      '2-4',
      '3-1',
      '3-2',
      '3-3',
      '3-4',
      '4-1',
      '4-2',
      '4-3',
      '4-4'
    ],
    state: [
      'false',
      'false',
      'false',
      'true',
      'false',
      'true',
      'true',
      'true',
      'false',
      'true',
      'false',
      'false',
      'true',
      'false',
      'true',
      'true'
    ]
  },
  {
    question: [
      [2, 4, 0, 0],
      [0, 1, 2, 0],
      [4, 0, 1, 0],
      [0, 3, 4, 2]
    ],
    answer: [
      [2, 4, 3, 1],
      [3, 1, 2, 4],
      [4, 2, 1, 3],
      [1, 3, 4, 2]
    ],
    itemList: [
      '1-1',
      '1-2',
      '1-3',
      '1-4',
      '2-1',
      '2-2',
      '2-3',
      '2-4',
      '3-1',
      '3-2',
      '3-3',
      '3-4',
      '4-1',
      '4-2',
      '4-3',
      '4-4'
    ],
    state: [
      'true',
      'true',
      'false',
      'false',
      'false',
      'true',
      'true',
      'false',
      'true',
      'false',
      'true',
      'false',
      'false',
      'true',
      'true',
      'true'
    ]
  },
  {
    question: [
      [1, 4, 2, 0],
      [0, 3, 1, 0],
      [0, 2, 0, 0],
      [4, 0, 3, 0]
    ],
    answer: [
      [1, 4, 2, 3],
      [2, 3, 1, 4],
      [3, 2, 4, 1],
      [4, 1, 3, 2]
    ],
    itemList: [
      '1-1',
      '1-2',
      '1-3',
      '1-4',
      '2-1',
      '2-2',
      '2-3',
      '2-4',
      '3-1',
      '3-2',
      '3-3',
      '3-4',
      '4-1',
      '4-2',
      '4-3',
      '4-4'
    ],
    state: [
      'true',
      'true',
      'true',
      'false',
      'false',
      'true',
      'true',
      'false',
      'false',
      'true',
      'false',
      'false',
      'true',
      'false',
      'true',
      'false'
    ]
  }
])
const rowListFive = ref([
  {
    question: [
      [0, 2, 3, 0, 1],
      [4, 1, 0, 0, 3],
      [0, 0, 4, 1, 0],
      [1, 5, 0, 3, 4],
      [3, 0, 1, 0, 2]
    ],
    answer: [
      [5, 2, 3, 4, 1],
      [4, 1, 5, 2, 3],
      [2, 3, 4, 1, 5],
      [1, 5, 2, 3, 4],
      [3, 4, 1, 5, 2]
    ],
    itemList: [
      '1-1',
      '1-2',
      '1-3',
      '1-4',
      '1-5',
      '2-1',
      '2-2',
      '2-3',
      '2-4',
      '2-5',
      '3-1',
      '3-2',
      '3-3',
      '3-4',
      '3-5',
      '4-1',
      '4-2',
      '4-3',
      '4-4',
      '4-5',
      '5-1',
      '5-2',
      '5-3',
      '5-4',
      '5-5'
    ],
    state: [
      'false',
      'true',
      'true',
      'false',
      'true',

      'true',
      'true',
      'false',
      'false',
      'true',

      'false',
      'false',
      'true',
      'true',
      'false',

      'true',
      'true',
      'false',
      'true',
      'true',

      'true',
      'false',
      'true',
      'false',
      'true'
    ]
  },
  {
    question: [
      [3, 5, 0, 2, 0],
      [2, 1, 0, 0, 4],
      [0, 4, 2, 0, 3],
      [1, 0, 0, 4, 2],
      [0, 2, 0, 3, 5]
    ],
    answer: [
      [3, 5, 4, 2, 1],
      [2, 1, 3, 5, 4],
      [5, 4, 2, 1, 3],
      [1, 3, 5, 4, 2],
      [4, 2, 1, 3, 5]
    ],
    itemList: [
      '1-1',
      '1-2',
      '1-3',
      '1-4',
      '1-5',
      '2-1',
      '2-2',
      '2-3',
      '2-4',
      '2-5',
      '3-1',
      '3-2',
      '3-3',
      '3-4',
      '3-5',
      '4-1',
      '4-2',
      '4-3',
      '4-4',
      '4-5',
      '5-1',
      '5-2',
      '5-3',
      '5-4',
      '5-5'
    ],
    state: [
      'true',
      'true',
      'false',
      'true',
      'false',

      'true',
      'true',
      'false',
      'false',
      'true',

      'false',
      'true',
      'true',
      'false',
      'true',

      'true',
      'false',
      'false',
      'true',
      'true',

      'false',
      'true',
      'false',
      'true',
      'true'
    ]
  },
  {
    question: [
      [0, 5, 0, 2, 3],
      [2, 3, 0, 0, 1],
      [5, 1, 2, 0, 0],
      [3, 4, 0, 1, 2],
      [0, 0, 3, 4, 0]
    ],
    answer: [
      [4, 5, 1, 2, 3],
      [2, 3, 4, 5, 1],
      [5, 1, 2, 3, 4],
      [3, 4, 5, 1, 2],
      [1, 2, 3, 4, 5]
    ],
    itemList: [
      '1-1',
      '1-2',
      '1-3',
      '1-4',
      '1-5',
      '2-1',
      '2-2',
      '2-3',
      '2-4',
      '2-5',
      '3-1',
      '3-2',
      '3-3',
      '3-4',
      '3-5',
      '4-1',
      '4-2',
      '4-3',
      '4-4',
      '4-5',
      '5-1',
      '5-2',
      '5-3',
      '5-4',
      '5-5'
    ],
    state: [
      'false',
      'true',
      'false',
      'true',
      'true',

      'true',
      'true',
      'false',
      'false',
      'true',

      'true',
      'true',
      'true',
      'false',
      'false',

      'true',
      'true',
      'false',
      'true',
      'true',

      'false',
      'false',
      'true',
      'true',
      'false'
    ]
  },
  {
    question: [
      [5, 0, 2, 3, 0],
      [0, 1, 0, 4, 2],
      [4, 0, 3, 0, 5],
      [1, 0, 0, 2, 3],
      [0, 3, 1, 0, 4]
    ],
    answer: [
      [5, 4, 2, 3, 1],
      [3, 1, 5, 4, 2],
      [4, 2, 3, 1, 5],
      [1, 5, 4, 2, 3],
      [2, 3, 1, 5, 4]
    ],
    itemList: [
      '1-1',
      '1-2',
      '1-3',
      '1-4',
      '1-5',
      '2-1',
      '2-2',
      '2-3',
      '2-4',
      '2-5',
      '3-1',
      '3-2',
      '3-3',
      '3-4',
      '3-5',
      '4-1',
      '4-2',
      '4-3',
      '4-4',
      '4-5',
      '5-1',
      '5-2',
      '5-3',
      '5-4',
      '5-5'
    ],
    state: [
      'true',
      'false',
      'true',
      'true',
      'false',

      'false',
      'true',
      'false',
      'true',
      'true',

      'true',
      'false',
      'true',
      'false',
      'true',

      'true',
      'false',
      'false',
      'true',
      'true',

      'false',
      'true',
      'true',
      'false',
      'true'
    ]
  },
  {
    question: [
      [0, 5, 4, 3, 1],
      [0, 1, 0, 5, 4],
      [5, 0, 3, 0, 2],
      [1, 2, 0, 0, 0],
      [4, 0, 1, 0, 5]
    ],
    answer: [
      [2, 5, 4, 3, 1],
      [3, 1, 2, 5, 4],
      [5, 4, 3, 1, 2],
      [1, 2, 5, 4, 3],
      [4, 3, 1, 2, 5]
    ],
    itemList: [
      '1-1',
      '1-2',
      '1-3',
      '1-4',
      '1-5',
      '2-1',
      '2-2',
      '2-3',
      '2-4',
      '2-5',
      '3-1',
      '3-2',
      '3-3',
      '3-4',
      '3-5',
      '4-1',
      '4-2',
      '4-3',
      '4-4',
      '4-5',
      '5-1',
      '5-2',
      '5-3',
      '5-4',
      '5-5'
    ],
    state: [
      'false',
      'true',
      'true',
      'true',
      'true',

      'false',
      'true',
      'false',
      'true',
      'true',

      'true',
      'false',
      'true',
      'false',
      'true',

      'true',
      'true',
      'false',
      'false',
      'false',

      'true',
      'false',
      'true',
      'false',
      'true'
    ]
  },
  {
    question: [
      [3, 0, 2, 0, 1],
      [0, 1, 0, 5, 0],
      [5, 0, 4, 0, 3],
      [0, 3, 0, 2, 4],
      [2, 0, 1, 3, 5]
    ],
    answer: [
      [3, 5, 2, 4, 1],
      [4, 1, 3, 5, 2],
      [5, 2, 4, 1, 3],
      [1, 3, 5, 2, 4],
      [2, 4, 1, 3, 5]
    ],
    itemList: [
      '1-1',
      '1-2',
      '1-3',
      '1-4',
      '1-5',
      '2-1',
      '2-2',
      '2-3',
      '2-4',
      '2-5',
      '3-1',
      '3-2',
      '3-3',
      '3-4',
      '3-5',
      '4-1',
      '4-2',
      '4-3',
      '4-4',
      '4-5',
      '5-1',
      '5-2',
      '5-3',
      '5-4',
      '5-5'
    ],
    state: [
      'true',
      'false',
      'true',
      'false',
      'true',

      'false',
      'true',
      'false',
      'true',
      'false',

      'true',
      'false',
      'true',
      'false',
      'true',

      'false',
      'true',
      'false',
      'true',
      'true',

      'true',
      'false',
      'true',
      'true',
      'true'
    ]
  },
  {
    question: [
      [4, 0, 2, 5, 1],
      [0, 1, 0, 3, 0],
      [3, 0, 5, 0, 4],
      [0, 4, 0, 2, 5],
      [2, 5, 0, 0, 3]
    ],
    answer: [
      [4, 3, 2, 5, 1],
      [5, 1, 4, 3, 2],
      [3, 2, 5, 1, 4],
      [1, 4, 3, 2, 5],
      [2, 5, 1, 4, 3]
    ],
    itemList: [
      '1-1',
      '1-2',
      '1-3',
      '1-4',
      '1-5',
      '2-1',
      '2-2',
      '2-3',
      '2-4',
      '2-5',
      '3-1',
      '3-2',
      '3-3',
      '3-4',
      '3-5',
      '4-1',
      '4-2',
      '4-3',
      '4-4',
      '4-5',
      '5-1',
      '5-2',
      '5-3',
      '5-4',
      '5-5'
    ],
    state: [
      'true',
      'false',
      'true',
      'true',
      'true',

      'false',
      'true',
      'false',
      'true',
      'false',

      'true',
      'false',
      'true',
      'false',
      'true',

      'false',
      'true',
      'false',
      'true',
      'true',

      'true',
      'true',
      'false',
      'false',
      'true'
    ]
  },
  {
    question: [
      [2, 0, 0, 5, 1],
      [0, 1, 0, 4, 3],
      [0, 0, 5, 1, 2],
      [1, 2, 0, 0, 5],
      [3, 5, 1, 0, 0]
    ],
    answer: [
      [2, 4, 3, 5, 1],
      [5, 1, 2, 4, 3],
      [4, 3, 5, 1, 2],
      [1, 2, 4, 3, 5],
      [3, 5, 1, 2, 4]
    ],
    itemList: [
      '1-1',
      '1-2',
      '1-3',
      '1-4',
      '1-5',
      '2-1',
      '2-2',
      '2-3',
      '2-4',
      '2-5',
      '3-1',
      '3-2',
      '3-3',
      '3-4',
      '3-5',
      '4-1',
      '4-2',
      '4-3',
      '4-4',
      '4-5',
      '5-1',
      '5-2',
      '5-3',
      '5-4',
      '5-5'
    ],
    state: [
      'true',
      'false',
      'false',
      'true',
      'true',

      'false',
      'true',
      'false',
      'true',
      'true',

      'false',
      'false',
      'true',
      'true',
      'true',

      'true',
      'true',
      'false',
      'false',
      'true',

      'true',
      'true',
      'true',
      'false',
      'false'
    ]
  },
  {
    question: [
      [3, 2, 4, 0, 0],
      [0, 1, 3, 0, 4],
      [0, 0, 5, 1, 3],
      [0, 3, 0, 4, 5],
      [4, 0, 1, 3, 0]
    ],
    answer: [
      [3, 2, 4, 5, 1],
      [5, 1, 3, 2, 4],
      [2, 4, 5, 1, 3],
      [1, 3, 2, 4, 5],
      [4, 5, 1, 3, 2]
    ],
    itemList: [
      '1-1',
      '1-2',
      '1-3',
      '1-4',
      '1-5',
      '2-1',
      '2-2',
      '2-3',
      '2-4',
      '2-5',
      '3-1',
      '3-2',
      '3-3',
      '3-4',
      '3-5',
      '4-1',
      '4-2',
      '4-3',
      '4-4',
      '4-5',
      '5-1',
      '5-2',
      '5-3',
      '5-4',
      '5-5'
    ],
    state: [
      'true',
      'true',
      'true',
      'false',
      'false',

      'false',
      'true',
      'true',
      'false',
      'true',

      'false',
      'false',
      'true',
      'true',
      'true',

      'false',
      'true',
      'false',
      'true',
      'true',

      'true',
      'false',
      'true',
      'true',
      'false'
    ]
  },
  {
    question: [
      [0, 1, 0, 4, 5],
      [5, 0, 2, 1, 0],
      [1, 5, 0, 0, 2],
      [3, 0, 1, 0, 4],
      [0, 3, 0, 2, 1]
    ],
    answer: [
      [2, 1, 3, 4, 5],
      [5, 4, 2, 1, 3],
      [1, 5, 4, 3, 2],
      [3, 2, 1, 5, 4],
      [4, 3, 5, 2, 1]
    ],
    itemList: [
      '1-1',
      '1-2',
      '1-3',
      '1-4',
      '1-5',
      '2-1',
      '2-2',
      '2-3',
      '2-4',
      '2-5',
      '3-1',
      '3-2',
      '3-3',
      '3-4',
      '3-5',
      '4-1',
      '4-2',
      '4-3',
      '4-4',
      '4-5',
      '5-1',
      '5-2',
      '5-3',
      '5-4',
      '5-5'
    ],
    state: [
      'false',
      'true',
      'false',
      'true',
      'true',

      'true',
      'false',
      'true',
      'true',
      'false',

      'true',
      'true',
      'false',
      'false',
      'true',

      'true',
      'false',
      'true',
      'false',
      'true',

      'false',
      'true',
      'false',
      'true',
      'true'
    ]
  }
])
const rowListSix = ref([
  {
    question: [
      [0, 5, 0, 2, 0, 6],
      [2, 4, 6, 0, 0, 3],
      [1, 2, 4, 0, 6, 5],
      [5, 6, 0, 4, 2, 1],
      [4, 0, 0, 6, 3, 2],
      [6, 0, 2, 0, 1, 0]
    ],
    answer: [
      [3, 5, 1, 2, 4, 6],
      [2, 4, 6, 1, 5, 3],
      [1, 2, 4, 3, 6, 5],
      [5, 6, 3, 4, 2, 1],
      [4, 1, 5, 6, 3, 2],
      [6, 3, 2, 5, 1, 4]
    ],
    itemList: [
      '1-1',
      '1-2',
      '1-3',
      '1-4',
      '1-5',
      '1-6',
      '2-1',
      '2-2',
      '2-3',
      '2-4',
      '2-5',
      '2-6',
      '3-1',
      '3-2',
      '3-3',
      '3-4',
      '3-5',
      '3-6',
      '4-1',
      '4-2',
      '4-3',
      '4-4',
      '4-5',
      '4-6',
      '5-1',
      '5-2',
      '5-3',
      '5-4',
      '5-5',
      '5-6',
      '6-1',
      '6-2',
      '6-3',
      '6-4',
      '6-5',
      '6-6'
    ],
    state: [
      'false',
      'true',
      'false',
      'true',
      'false',
      'true',

      'true',
      'true',
      'true',
      'false',
      'false',
      'true',

      'true',
      'true',
      'true',
      'false',
      'true',
      'true',

      'true',
      'true',
      'false',
      'true',
      'true',
      'true',

      'true',
      'false',
      'false',
      'true',
      'true',
      'true',

      'true',
      'false',
      'true',
      'false',
      'true',
      'false'
    ]
  },
  {
    question: [
      [1, 3, 0, 2, 5, 6],
      [0, 6, 0, 3, 0, 4],
      [0, 5, 6, 1, 0, 2],
      [3, 0, 2, 4, 6, 0],
      [5, 0, 1, 0, 4, 0],
      [6, 4, 3, 0, 2, 1]
    ],
    answer: [
      [1, 3, 4, 2, 5, 6],
      [2, 6, 5, 3, 1, 4],
      [4, 5, 6, 1, 3, 2],
      [3, 1, 2, 4, 6, 5],
      [5, 2, 1, 6, 4, 3],
      [6, 4, 3, 5, 2, 1]
    ],
    itemList: [
      '1-1',
      '1-2',
      '1-3',
      '1-4',
      '1-5',
      '1-6',
      '2-1',
      '2-2',
      '2-3',
      '2-4',
      '2-5',
      '2-6',
      '3-1',
      '3-2',
      '3-3',
      '3-4',
      '3-5',
      '3-6',
      '4-1',
      '4-2',
      '4-3',
      '4-4',
      '4-5',
      '4-6',
      '5-1',
      '5-2',
      '5-3',
      '5-4',
      '5-5',
      '5-6',
      '6-1',
      '6-2',
      '6-3',
      '6-4',
      '6-5',
      '6-6'
    ],
    state: [
      'true',
      'true',
      'false',
      'true',
      'true',
      'true',

      'false',
      'true',
      'false',
      'true',
      'false',
      'true',

      'false',
      'true',
      'true',
      'true',
      'false',
      'true',

      'true',
      'false',
      'true',
      'true',
      'true',
      'false',

      'true',
      'false',
      'true',
      'false',
      'true',
      'false',

      'true',
      'true',
      'true',
      'false',
      'true',
      'true'
    ]
  },
  {
    question: [
      [5, 6, 0, 2, 3, 4],
      [2, 0, 3, 0, 0, 5],
      [0, 0, 2, 5, 4, 6],
      [4, 5, 6, 1, 0, 0],
      [3, 0, 0, 4, 0, 2],
      [6, 2, 4, 0, 5, 1]
    ],
    answer: [
      [5, 6, 1, 2, 3, 4],
      [2, 4, 3, 6, 1, 5],
      [1, 3, 2, 5, 4, 6],
      [4, 5, 6, 1, 2, 3],
      [3, 1, 5, 4, 6, 2],
      [6, 2, 4, 3, 5, 1]
    ],
    itemList: [
      '1-1',
      '1-2',
      '1-3',
      '1-4',
      '1-5',
      '1-6',
      '2-1',
      '2-2',
      '2-3',
      '2-4',
      '2-5',
      '2-6',
      '3-1',
      '3-2',
      '3-3',
      '3-4',
      '3-5',
      '3-6',
      '4-1',
      '4-2',
      '4-3',
      '4-4',
      '4-5',
      '4-6',
      '5-1',
      '5-2',
      '5-3',
      '5-4',
      '5-5',
      '5-6',
      '6-1',
      '6-2',
      '6-3',
      '6-4',
      '6-5',
      '6-6'
    ],
    state: [
      'true',
      'true',
      'false',
      'true',
      'true',
      'true',

      'true',
      'false',
      'true',
      'false',
      'false',
      'true',

      'false',
      'false',
      'true',
      'true',
      'true',
      'true',

      'true',
      'true',
      'true',
      'true',
      'false',
      'false',

      'true',
      'false',
      'false',
      'true',
      'false',
      'true',

      'true',
      'true',
      'true',
      'false',
      'true',
      'true'
    ]
  },
  {
    question: [
      [0, 0, 1, 0, 2, 5],
      [0, 4, 5, 3, 1, 6],
      [5, 2, 6, 0, 0, 3],
      [1, 0, 0, 6, 5, 2],
      [4, 5, 3, 2, 6, 0],
      [6, 1, 0, 5, 0, 0]
    ],
    answer: [
      [3, 6, 1, 4, 2, 5],
      [2, 4, 5, 3, 1, 6],
      [5, 2, 6, 1, 4, 3],
      [1, 3, 4, 6, 5, 2],
      [4, 5, 3, 2, 6, 1],
      [6, 1, 2, 5, 3, 4]
    ],
    itemList: [
      '1-1',
      '1-2',
      '1-3',
      '1-4',
      '1-5',
      '1-6',
      '2-1',
      '2-2',
      '2-3',
      '2-4',
      '2-5',
      '2-6',
      '3-1',
      '3-2',
      '3-3',
      '3-4',
      '3-5',
      '3-6',
      '4-1',
      '4-2',
      '4-3',
      '4-4',
      '4-5',
      '4-6',
      '5-1',
      '5-2',
      '5-3',
      '5-4',
      '5-5',
      '5-6',
      '6-1',
      '6-2',
      '6-3',
      '6-4',
      '6-5',
      '6-6'
    ],
    state: [
      'false',
      'false',
      'true',
      'false',
      'true',
      'true',

      'false',
      'true',
      'true',
      'true',
      'true',
      'true',

      'true',
      'true',
      'true',
      'false',
      'false',
      'true',

      'true',
      'false',
      'false',
      'true',
      'true',
      'true',

      'true',
      'true',
      'true',
      'true',
      'true',
      'false',

      'true',
      'true',
      'false',
      'true',
      'false',
      'false'
    ]
  },
  {
    question: [
      [0, 6, 4, 0, 5, 3],
      [0, 3, 2, 4, 6, 1],
      [3, 5, 6, 0, 0, 0],
      [0, 0, 0, 5, 3, 6],
      [4, 2, 3, 6, 1, 0],
      [6, 1, 0, 3, 4, 0]
    ],
    answer: [
      [1, 6, 4, 2, 5, 3],
      [5, 3, 2, 4, 6, 1],
      [3, 5, 6, 1, 2, 4],
      [2, 4, 1, 5, 3, 6],
      [4, 2, 3, 6, 1, 5],
      [6, 1, 5, 3, 4, 2]
    ],
    itemList: [
      '1-1',
      '1-2',
      '1-3',
      '1-4',
      '1-5',
      '1-6',
      '2-1',
      '2-2',
      '2-3',
      '2-4',
      '2-5',
      '2-6',
      '3-1',
      '3-2',
      '3-3',
      '3-4',
      '3-5',
      '3-6',
      '4-1',
      '4-2',
      '4-3',
      '4-4',
      '4-5',
      '4-6',
      '5-1',
      '5-2',
      '5-3',
      '5-4',
      '5-5',
      '5-6',
      '6-1',
      '6-2',
      '6-3',
      '6-4',
      '6-5',
      '6-6'
    ],
    state: [
      'false',
      'true',
      'true',
      'false',
      'true',
      'true',

      'false',
      'true',
      'true',
      'true',
      'true',
      'true',

      'true',
      'true',
      'true',
      'false',
      'false',
      'false',

      'false',
      'false',
      'false',
      'true',
      'true',
      'true',

      'true',
      'true',
      'true',
      'true',
      'true',
      'false',

      'true',
      'true',
      'false',
      'true',
      'true',
      'false'
    ]
  },
  {
    question: [
      [0, 5, 2, 1, 0, 6],
      [3, 6, 1, 0, 5, 2],
      [1, 4, 6, 0, 0, 0],
      [0, 0, 0, 6, 1, 4],
      [5, 1, 0, 2, 6, 3],
      [6, 0, 3, 5, 4, 0]
    ],
    answer: [
      [4, 5, 2, 1, 3, 6],
      [3, 6, 1, 4, 5, 2],
      [1, 4, 6, 3, 2, 5],
      [2, 3, 5, 6, 1, 4],
      [5, 1, 4, 2, 6, 3],
      [6, 2, 3, 5, 4, 1]
    ],
    itemList: [
      '1-1',
      '1-2',
      '1-3',
      '1-4',
      '1-5',
      '1-6',
      '2-1',
      '2-2',
      '2-3',
      '2-4',
      '2-5',
      '2-6',
      '3-1',
      '3-2',
      '3-3',
      '3-4',
      '3-5',
      '3-6',
      '4-1',
      '4-2',
      '4-3',
      '4-4',
      '4-5',
      '4-6',
      '5-1',
      '5-2',
      '5-3',
      '5-4',
      '5-5',
      '5-6',
      '6-1',
      '6-2',
      '6-3',
      '6-4',
      '6-5',
      '6-6'
    ],
    state: [
      'false',
      'true',
      'true',
      'true',
      'false',
      'true',

      'true',
      'true',
      'true',
      'false',
      'true',
      'true',

      'true',
      'true',
      'true',
      'false',
      'false',
      'false',

      'false',
      'false',
      'false',
      'true',
      'true',
      'true',

      'true',
      'true',
      'false',
      'true',
      'true',
      'true',

      'true',
      'false',
      'true',
      'true',
      'true',
      'false'
    ]
  },
  {
    question: [
      [4, 0, 1, 3, 0, 6],
      [0, 5, 0, 1, 0, 2],
      [1, 4, 0, 2, 3, 5],
      [2, 3, 5, 0, 1, 4],
      [3, 0, 4, 0, 2, 0],
      [5, 0, 2, 4, 0, 3]
    ],
    answer: [
      [4, 2, 1, 3, 5, 6],
      [6, 5, 3, 1, 4, 2],
      [1, 4, 6, 2, 3, 5],
      [2, 3, 5, 6, 1, 4],
      [3, 6, 4, 5, 2, 1],
      [5, 1, 2, 4, 6, 3]
    ],
    itemList: [
      '1-1',
      '1-2',
      '1-3',
      '1-4',
      '1-5',
      '1-6',
      '2-1',
      '2-2',
      '2-3',
      '2-4',
      '2-5',
      '2-6',
      '3-1',
      '3-2',
      '3-3',
      '3-4',
      '3-5',
      '3-6',
      '4-1',
      '4-2',
      '4-3',
      '4-4',
      '4-5',
      '4-6',
      '5-1',
      '5-2',
      '5-3',
      '5-4',
      '5-5',
      '5-6',
      '6-1',
      '6-2',
      '6-3',
      '6-4',
      '6-5',
      '6-6'
    ],
    state: [
      'true',
      'false',
      'true',
      'true',
      'false',
      'true',

      'false',
      'true',
      'false',
      'true',
      'false',
      'true',

      'true',
      'true',
      'false',
      'true',
      'true',
      'true',

      'true',
      'true',
      'true',
      'false',
      'true',
      'true',

      'true',
      'false',
      'true',
      'false',
      'true',
      'false',

      'true',
      'false',
      'true',
      'true',
      'false',
      'true'
    ]
  },
  {
    question: [
      [0, 0, 0, 3, 2, 0],
      [3, 2, 0, 6, 1, 5],
      [2, 4, 1, 5, 3, 0],
      [0, 6, 3, 1, 4, 2],
      [4, 1, 5, 0, 6, 3],
      [0, 3, 2, 0, 0, 0]
    ],
    answer: [
      [1, 5, 6, 3, 2, 4],
      [3, 2, 4, 6, 1, 5],
      [2, 4, 1, 5, 3, 6],
      [5, 6, 3, 1, 4, 2],
      [4, 1, 5, 2, 6, 3],
      [6, 3, 2, 4, 5, 1]
    ],
    itemList: [
      '1-1',
      '1-2',
      '1-3',
      '1-4',
      '1-5',
      '1-6',
      '2-1',
      '2-2',
      '2-3',
      '2-4',
      '2-5',
      '2-6',
      '3-1',
      '3-2',
      '3-3',
      '3-4',
      '3-5',
      '3-6',
      '4-1',
      '4-2',
      '4-3',
      '4-4',
      '4-5',
      '4-6',
      '5-1',
      '5-2',
      '5-3',
      '5-4',
      '5-5',
      '5-6',
      '6-1',
      '6-2',
      '6-3',
      '6-4',
      '6-5',
      '6-6'
    ],
    state: [
      'false',
      'false',
      'false',
      'true',
      'true',
      'false',

      'true',
      'true',
      'false',
      'true',
      'true',
      'true',

      'true',
      'true',
      'true',
      'true',
      'true',
      'false',

      'false',
      'true',
      'true',
      'true',
      'true',
      'true',

      'true',
      'true',
      'true',
      'false',
      'true',
      'true',

      'false',
      'true',
      'true',
      'false',
      'false',
      'false'
    ]
  },
  {
    question: [
      [3, 4, 1, 6, 0, 5],
      [0, 0, 0, 0, 3, 4],
      [4, 3, 0, 2, 6, 1],
      [1, 2, 6, 0, 4, 3],
      [2, 1, 0, 0, 0, 0],
      [6, 0, 4, 3, 1, 2]
    ],
    answer: [
      [3, 4, 1, 6, 2, 5],
      [5, 6, 2, 1, 3, 4],
      [4, 3, 5, 2, 6, 1],
      [1, 2, 6, 5, 4, 3],
      [2, 1, 3, 4, 5, 6],
      [6, 5, 4, 3, 1, 2]
    ],
    itemList: [
      '1-1',
      '1-2',
      '1-3',
      '1-4',
      '1-5',
      '1-6',
      '2-1',
      '2-2',
      '2-3',
      '2-4',
      '2-5',
      '2-6',
      '3-1',
      '3-2',
      '3-3',
      '3-4',
      '3-5',
      '3-6',
      '4-1',
      '4-2',
      '4-3',
      '4-4',
      '4-5',
      '4-6',
      '5-1',
      '5-2',
      '5-3',
      '5-4',
      '5-5',
      '5-6',
      '6-1',
      '6-2',
      '6-3',
      '6-4',
      '6-5',
      '6-6'
    ],
    state: [
      'true',
      'true',
      'true',
      'true',
      'false',
      'true',

      'false',
      'false',
      'false',
      'false',
      'true',
      'true',

      'true',
      'true',
      'false',
      'true',
      'true',
      'true',

      'true',
      'true',
      'true',
      'false',
      'true',
      'true',

      'true',
      'true',
      'false',
      'false',
      'false',
      'false',

      'true',
      'false',
      'true',
      'true',
      'true',
      'true'
    ]
  },
  {
    question: [
      [1, 0, 3, 4, 0, 6],
      [4, 6, 0, 1, 5, 3],
      [5, 1, 6, 0, 0, 0],
      [0, 0, 0, 6, 1, 5],
      [3, 4, 1, 0, 6, 2],
      [6, 0, 5, 3, 0, 1]
    ],
    answer: [
      [1, 5, 3, 4, 2, 6],
      [4, 6, 2, 1, 5, 3],
      [5, 1, 6, 2, 3, 4],
      [2, 3, 4, 6, 1, 5],
      [3, 4, 1, 5, 6, 2],
      [6, 2, 5, 3, 4, 1]
    ],
    itemList: [
      '1-1',
      '1-2',
      '1-3',
      '1-4',
      '1-5',
      '1-6',
      '2-1',
      '2-2',
      '2-3',
      '2-4',
      '2-5',
      '2-6',
      '3-1',
      '3-2',
      '3-3',
      '3-4',
      '3-5',
      '3-6',
      '4-1',
      '4-2',
      '4-3',
      '4-4',
      '4-5',
      '4-6',
      '5-1',
      '5-2',
      '5-3',
      '5-4',
      '5-5',
      '5-6',
      '6-1',
      '6-2',
      '6-3',
      '6-4',
      '6-5',
      '6-6'
    ],
    state: [
      'true',
      'false',
      'true',
      'true',
      'false',
      'true',

      'true',
      'true',
      'false',
      'true',
      'true',
      'true',

      'true',
      'true',
      'true',
      'false',
      'false',
      'false',

      'false',
      'false',
      'false',
      'true',
      'true',
      'true',

      'true',
      'true',
      'true',
      'false',
      'true',
      'true',

      'true',
      'false',
      'true',
      'true',
      'false',
      'true'
    ]
  }
])
// 开始计时
const timmer = ref(null)
const gameTime = ref('00:00')
const startTime = ref(0)
const stopTime = ref(0)
const activeOn = ref(null)
const activeColumn = ref(null)
const activePerform = ref(null)
const numberList = ref([])
const zhezhaoShowState = ref(false)
// const zhezhaoShowState = ref(true)
const zhezhaoIsSuccess = ref(true)
const timeMin = ref('00')
const timeSeconds = ref('00')

onShow(() => {
  zhezhaoShow.value = true
  chooseShow.value = true
  sdNum.value = 0
  sdNumOld.value = 0
  rightListOld.value = []
  //   answerList.value = []
  timmer.value = null
  gameTime.value = '00 : 00'
  activeOn.value = null
  activeColumn.value = null
  activePerform.value = null
  zhezhaoShowState.value = false
  zhezhaoIsSuccess.value = true
  timeMin.value = '00'
  timeSeconds.value = '00'
  startTime.value = 0
  stopTime.value = 0
  numberList.value = [1, 2, 3, 4]
})
onHide(() => {
  clearInterval(timmer.value)
  timmer.value = null
})
const playVideo = (str) => {
  const maps = {
    point: '/static/video/point.mp3',
    empty: '/static/video/empty.mp3',
    success: '/static/video/success.mp3'
  }

  let innerAudioContext = uni.createInnerAudioContext()
  innerAudioContext.autoplay = true
  innerAudioContext.src = maps[str]
  innerAudioContext.onPlay(() => {
    console.log('开始播放')
  })

  innerAudioContext.onEnded(() => {
    console.log('开始播放')
    innerAudioContext.destroy()
    innerAudioContext = null
  })
}
const chooseLevel = (num) => {
  chooseShow.value = false
  sdNumOld.value = num
}
const startGameFun = () => {
  zhezhaoShow.value = false
  sdNum.value = sdNumOld.value
  if (sdNum.value == 4) {
    numberList.value = [1, 2, 3, 4]
  } else if (sdNum.value == 5) {
    numberList.value = [1, 2, 3, 4, 5]
  } else {
    numberList.value = [1, 2, 3, 4, 5, 6]
  }
  generateShuDu()
}
const generateShuDu = () => {
  const num = Math.floor(Math.random() * 10)
  let rightListNew = []
  let answerListOld = []
  let itemList = []
  let stateList = []
  randomNum.value = num
  if (sdNum.value == 4) {
    rightListNew = rowList.value[randomNum.value].question
    console.log(rowList.value[randomNum.value].answer)
    answerListOld = rowList.value[randomNum.value].answer
    itemList = rowList.value[randomNum.value].itemList
    stateList = rowList.value[randomNum.value].state
  } else if (sdNum.value == 5) {
    rightListNew = rowListFive.value[randomNum.value].question
    answerListOld = rowListFive.value[randomNum.value].answer
    itemList = rowListFive.value[randomNum.value].itemList
    stateList = rowListFive.value[randomNum.value].state
  } else {
    rightListNew = rowListSix.value[randomNum.value].question
    answerListOld = rowListSix.value[randomNum.value].answer
    itemList = rowListSix.value[randomNum.value].itemList
    stateList = rowListSix.value[randomNum.value].state
  }
  //生成数独
  const dataList = []
  for (let i = 0; i < rightListNew.length; i++) {
    for (let j = 0; j < rightListNew[i].length; j++) {
      const obj = {}
      if (rightListNew[i][j] == 0) {
        rightListNew[i][j] = ''
      }
      obj.num = rightListNew[i][j]
      obj.isNum = answerListOld[i][j]
      dataList.push(obj)
    }
  }
  console.log(666)
  console.log(answerListOld)
  console.log(itemList)

  for (let i = 0; i < itemList.length; i++) {
    dataList[i].perform = itemList[i].split('-')[0]
    dataList[i].column = itemList[i].split('-')[1]
    dataList[i].active = ''
  }
  for (let i = 0; i < stateList.length; i++) {
    dataList[i].state = stateList[i]
  }
  console.log(dataList)

  console.log(2222)

  console.log(rightListNew)
  //   answerList.value = answerListOld
  rightListOld.value = dataList
  startFun()
}
// 计时开始
const startFun = () => {
  clearInterval(timmer.value)
  startTime.value = new Date().getTime()
  //   开始之后 时间超过一个小时  就停止了 需要重新玩
  stopTime.value = 60 * 60 * 24 * 1000 + 1000
  //   stopTime.value = 3 * 1000 + 1000 //测试 10s 超时
  timmer.value = setInterval(() => {
    const newDateTime = new Date().getTime() - startTime.value
    if (newDateTime >= stopTime.value) {
      clearInterval(timmer.value)
      zhezhaoShowState.value = true
      zhezhaoIsSuccess.value = false
      console.log('游戏超时自动结束')
    } else {
      gameTime.value = transformTime(newDateTime)
    }
  }, 1000)
}
const transformTime = (date) => {
  var datetime = ''
  //计算出小时数
  var leave1 = date % (24 * 3600 * 1000) //计算天数后剩余的毫秒数
  //计算相差分钟数
  var leave2 = leave1 % (3600 * 1000) //计算小时数后剩余的毫秒数
  var minutes =
    Math.floor(leave2 / (60 * 1000)) < 10
      ? '0' + Math.floor(leave2 / (60 * 1000))
      : Math.floor(leave2 / (60 * 1000))
  //计算相差秒数
  var leave3 = leave2 % (60 * 1000) //计算分钟数后剩余的毫秒数
  var seconds =
    Math.round(leave3 / 1000) < 10 ? '0' + Math.round(leave3 / 1000) : Math.round(leave3 / 1000)
  datetime = minutes + ' : ' + seconds
  timeMin.value = minutes
  timeSeconds.value = seconds
  return datetime
}
const chooseNum = (item, index) => {
  if (item.state == 'false') {
    console.log(item)
    activeOn.value = index
    activeColumn.value = item.column
    activePerform.value = item.perform
    // console.log(answerList.value)
    console.log(rightListOld.value)
    for (let i = 0; i < rightListOld.value.length; i++) {
      if (
        item.column == rightListOld.value[i].column ||
        item.perform == rightListOld.value[i].perform
      ) {
        rightListOld.value[i].active = 'on'
      } else {
        rightListOld.value[i].active = ''
      }
    }
  }
}
const fillIn = (item) => {
  //   console.log(activeOn.value)
  //   console.log(33)
  //   console.log(item)
  //   console.log(rightListOld.value)
  if (rightListOld.value[activeOn.value] && rightListOld.value[activeOn.value].num) {
    console.log('已经有值,说明填写正确了')
  } else {
    if (activeOn.value != null) {
      console.log(99)
      console.log(rightListOld.value[activeOn.value].isNum)
      if (item == rightListOld.value[activeOn.value].isNum) {
        console.log('填写正确')
        rightListOld.value[activeOn.value].num = item
        rightListOld.value[activeOn.value].active = 'on'
        let isFill = false
        for (let i = 0; i < rightListOld.value.length; i++) {
          if (rightListOld.value[i].num == '') {
            isFill = true
          }
        }
        if (isFill == true) {
          playVideo('point')
        } else {
          playVideo('success')
          clearInterval(timmer.value)
          setTimeout(() => {
            zhezhaoShowState.value = true
            zhezhaoIsSuccess.value = true
          }, 2000)
        }
        console.log(777)

        console.log(isFill)
        activeOn.value = null
      } else {
        playVideo('empty')
        rightListOld.value[activeOn.value].active = 'error'
      }
    }
  }
}
const trainAgain = (num) => {
  if (num == 1) {
    zhezhaoShow.value = true
    chooseShow.value = true
    sdNum.value = 0
    sdNumOld.value = 0
    rightListOld.value = []
    //   answerList.value = []
    timmer.value = null
    gameTime.value = '00 : 00'
    activeOn.value = null
    activeColumn.value = null
    activePerform.value = null
    zhezhaoShowState.value = false
    zhezhaoIsSuccess.value = true
    timeMin.value = '00'
    timeSeconds.value = '00'
    startTime.value = 0
    stopTime.value = 0
    numberList.value = [1, 2, 3, 4]
  } else {
    console.log('退出训练')
  }
}
</script>

<style lang="scss">
@keyframes rotate {
  from {
    transform: scale(0);
    opacity: 0;
  }
  to {
    transform: scale(1);
    opacity: 1;
  }
}
@keyframes rotateTwo {
  0% {
    transform: scale(0.9);
  }
  50% {
    transform: scale(1);
  }
  100% {
    transform: scale(0.9);
  }
}
.wrap {
  position: relative;
  height: 100vh;
  background: #f0eadc;

  .timeGame {
    font-weight: 700;
    color: #431f00;
    text-align: center;

    .time {
      display: inline-block;
      margin: 62rpx 0;
    }
  }

  .listWrap {
    .listWraps {
      display: flex;
      flex-wrap: wrap;
      width: 665rpx;
      margin: 0 auto;
      font-size: 0;
      text-align: left;
      border: 6rpx solid #431f00;

      .items {
        font-size: 76rpx;
        font-weight: 700;
        text-align: center;
        background: #fdf9f1;
        border-top: 1rpx solid #9a8468;
        border-right: 1rpx solid #927b5f;

        &.on {
          background: #f2ead4;
        }

        &.active {
          background: #f8e9c8 !important;
        }

        &.error {
          background: #ffbebe !important;
        }
      }

      &.listWrapsFour {
        .items {
          width: 164rpx;
          height: 164rpx;
          line-height: 164rpx;

          &:nth-child(4n + 4) {
            width: calc(100% - 492rpx);
            border-right: 0;
          }

          &:nth-child(1),
          &:nth-child(2),
          &:nth-child(3),
          &:nth-child(4) {
            border-top: 0;
          }
        }
      }

      &.listWrapsFive {
        .items {
          width: 131.2rpx;
          height: 131.2rpx;
          line-height: 131.2rpx;

          &:nth-child(5n + 5) {
            width: calc(100% - 524.8rpx);
            border-right: 0;
          }

          &:nth-child(1),
          &:nth-child(2),
          &:nth-child(3),
          &:nth-child(4),
          &:nth-child(5) {
            border-top: 0;
          }
        }
      }

      &.listWrapsSix {
        .items {
          width: 109.3rpx;
          height: 109.3rpx;
          line-height: 109.3rpx;

          &:nth-child(6n + 6) {
            width: calc(100% - 546.5rpx);
            border-right: 0;
          }

          &:nth-child(1),
          &:nth-child(2),
          &:nth-child(3),
          &:nth-child(4),
          &:nth-child(5),
          &:nth-child(6) {
            border-top: 0;
          }
        }
      }
    }

    .numberWrap {
      margin-top: 86rpx;
      font-size: 36rpx;
      font-weight: 700;
      color: #431f00;
      text-align: center;

      .number {
        display: flex;
        width: 670rpx;
        margin: 22rpx auto 0;
        font-size: 0;
        background: #fdf9f1;
        border: 4rpx solid #431f00;
        border-radius: 16rpx;

        .item {
          flex: 1;
          font-size: 76rpx;
          font-weight: 700;
          line-height: 164rpx;
          text-align: center;
        }
      }
    }
  }

  .zhezhao {
    position: relative;
    width: 100%;
    height: 100vh;

    .bg {
      position: fixed;
      top: 0;
      left: 0;
      z-index: 1;
      width: 100%;
      height: 100vh;
      background: rgb(0 0 0 / 50%);
    }

    .zhezhaoWrap {
      position: fixed;
      top: 280rpx;
      left: 116rpx;
      z-index: 1;
      width: calc(100% - 232rpx);
      font-size: 48rpx;
      color: #fff;
      text-align: center;

      .btnWrap {
        margin-top: 128rpx;

        .btn {
          position: relative;
          height: 142rpx;
          margin-top: 50rpx;
          line-height: 122rpx;
          text-align: center;
          animation: rotateTwo 1s infinite;

          &:nth-child(1) {
            margin-top: 0;
          }

          .img {
            position: absolute;
            top: 0;
            left: 0;
            z-index: 0;
            width: 100%;
            height: 100%;
          }

          .name {
            position: relative;
            z-index: 1;
          }
        }
      }
    }

    .startGame {
      position: fixed;
      bottom: 300rpx;
      left: 116rpx;
      z-index: 1;
      width: calc(100% - 232rpx);
      font-size: 48rpx;
      color: #fff;
      text-align: center;

      .btnWrap {
        padding-bottom: constant(safe-area-inset-bottom);
        padding-bottom: env(safe-area-inset-bottom);

        .btn {
          position: relative;
          height: 142rpx;
          margin-top: 50rpx;
          line-height: 122rpx;
          text-align: center;
          animation: rotateTwo 1s infinite;

          &:nth-child(1) {
            margin-top: 0;
          }

          .img {
            position: absolute;
            top: 0;
            left: 0;
            z-index: 0;
            width: 100%;
            height: 100%;
          }

          .name {
            position: relative;
            z-index: 1;
          }
        }
      }
    }

    &.zhezhaoState {
      position: fixed;
      top: 0;
      left: 0;

      .bg {
        background: rgb(0 0 0 / 70%);
      }

      .zhezhaoStateWrap {
        position: fixed;
        top: 184rpx;
        left: 0;
        z-index: 1;
        width: 100%;
        font-size: 64rpx;
        color: #fff;
        text-align: center;

        .overTime {
          margin: 220rpx auto 344rpx;
        }

        .consuming {
          margin-top: 112rpx;
          font-size: 48rpx;

          .name {
            &.mr24 {
              margin-right: 24rpx;
            }

            &.ml24 {
              margin-left: 24rpx;
            }
          }

          .time {
            font-size: 200rpx;
          }
        }

        .btnWrap {
          width: calc(100% - 232rpx);
          margin: 128rpx auto 0;

          .btn {
            position: relative;
            height: 142rpx;
            margin-top: 50rpx;
            line-height: 110rpx;
            text-align: center;
            animation: rotateTwo 1s infinite;

            &:nth-child(1) {
              margin-top: 0;
            }

            .img {
              position: absolute;
              top: 0;
              left: 0;
              z-index: 0;
              width: 100%;
              height: 100%;
            }

            .name {
              position: relative;
              z-index: 1;
              font-size: 48rpx;
            }
          }
        }
      }
      &.on {
        animation: rotate 0.3s linear;
      }
    }
  }
}
</style>

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.hqwc.cn/news/792180.html

如若内容造成侵权/违法违规/事实不符,请联系编程知识网进行投诉反馈email:809451989@qq.com,一经查实,立即删除!

相关文章

机械臂运动学-变换矩阵

将移动和转动整合在一起进行描述:以映射的方式:

OpenType Layout tables used in font ABCDEE+ are not implemented in PDFBox and will be ignored 问题处理

这行打印 还不是报错,是info级的,但是继续向下执行的话就报错了,报了一个数组越界,是PDFBox源码里的错误,我们也没有办法解决。所以要处理的是这个信息提示的问题,显然是字体缺失导致的, ABCDEE+这个字体在服务器上也是没有的。 在网上找了半天没有这个字体,最后升级了…

GBDT模型 0基础小白也能懂(附代码)

GBDT(Gradient Boosting Decision Tree),全名叫梯度提升决策树,是一种迭代的决策树算法,又叫 MART(Multiple Additive Regression Tree),它通过**构造一组弱的学习器(树),并把多颗决策树的结果累加起来作为最终的预测输出。**该算法将决策树与集成思想进行了有效的结…

二项式定理(二项式展开)

目录引入正题延伸 引入 首先有一个广为人知的结论: \[(a+b)^2=a^2+2ab+b^2 \]那么,如何求 \((a+b)^3\) 呢?手算,如下: \[\begin{aligned} (a+b)^3 &= (a+b)\times(a+b)^2\\ &=(a+b)\times(a^2+2ab+b^2)\\ &=[a\times(a^2+2ab+b^2)]+[b\times(a^2+2ab+b^2)]\\ …

机器视觉检测的速度六大影响因素

物料处理时间 材料处理时间是指待检测材料暴露在图像采集介质前面,以便能够充分聚焦在材料上以获取图像的时间。在工业环境中,材料通常位于装配线或传送带上。相机是固定的或可移动的,放置在装配线的某个点。当材料进入相机的焦点区域时,材料处理时间开始,当材料完全聚焦时…

BigDecimal使用注意的地方

BigDecimal 是 Java 中的一个类,这个相信大家都是知道的。它的作用就是可以表示任意精度的十进制数,BigDecimal 提供了精确的数字运算,适用于需要高精度计算的场景。 一、浮点精度 我们先来看一个例子:compareTo 方法比较中,a.compareTo(b) 返回:-1: a小于b0: a等于b1: a…

2024-09-04:用go语言,给定一个长度为n的数组 happiness,表示每个孩子的幸福值,以及一个正整数k,我们需要从这n个孩子中选出k个孩子。 在筛选过程中,每轮选择一个孩子时,所有尚未选

2024-09-04:用go语言,给定一个长度为n的数组 happiness,表示每个孩子的幸福值,以及一个正整数k,我们需要从这n个孩子中选出k个孩子。 在筛选过程中,每轮选择一个孩子时,所有尚未选中的孩子的幸福值都会减少 1。需要注意的是,幸福值不能降低到负数,只有在其为正数时才能…

初探编译链接原理

这篇博文由一个 bug 引出了编译链接的整个过程。我们可以看到一个源代码文件最终变成一个可执行文件中间经历了编译和链接两个过程,编译过程又分为预编译,编译,和汇编;预编译阶段主要处理#开头的代码,编译则是进行一些语法分析和优化,最终生成汇编代码,而汇编则是生成机…

canvas版本的五子棋

代码:<!Doctype html> <html lang="zh_cn"><head><meta http-equiv="Content-Type" content="text/html; charset=utf-8" /><title>五子棋</title><meta name="Keywords" content="&quo…

vue router路径重复时报错

参考——  https://blog.csdn.net/zz00008888/article/details/119566375 报错: Avoided redundant navigation to current location: "/Eee". NavigationDuplicated: Avoided redundant navigation to current location: "/Eee".在router的index下添加…

CUDA Toolkit常见安装问题一览

CUDA Toolkit常见安装问题一览关注TechLead,复旦博士,分享云服务领域全维度开发技术。拥有10+年互联网服务架构、AI产品研发经验、团队管理经验,复旦机器人智能实验室成员,国家级大学生赛事评审专家,发表多篇SCI核心期刊学术论文,阿里云认证的资深架构师,上亿营收AI产品…