diff --git a/src/components/OXTable.vue b/src/components/OXTable.vue index 891c6393e0d32fbb276018b02db9385fed658ccc..5214ae5966956c34eb86f94874ea4423bc4e4bbc 100644 --- a/src/components/OXTable.vue +++ b/src/components/OXTable.vue @@ -1,6 +1,11 @@ <template> <div> - <div>{{ turn }} {{ finish }} {{ winner }}</div> + <div v-if="finish"> + <span v-if="winner !== '-'">{{ winner }} Win!!! </span> + <span v-else>Draw!!!</span> + <button @click="newGame">New Game</button> + </div> + <div v-else>{{ turn }} Turn..</div> <table> <tr v-for="(line, lineId) in table" :key="lineId"> <td v-for="(item, itemId) in line" :key="itemId"> @@ -20,6 +25,7 @@ import OXCell from './OXCell.vue' export default { data () { return { + count: 0, finish: false, winner: '-', turn: 'O', @@ -31,16 +37,22 @@ export default { } }, methods: { + newGame () {}, cellClick (row, col) { if (this.finish) return console.log('Cell click ' + row + ' ' + col) this.table[row][col] = this.turn + this.count++ if (this.checkwin(row, col)) { console.log('Win') this.finish = true this.winner = this.turn return } + if (this.count === 9) { + this.finish = true + return + } this.switchTurn() }, switchTurn () {