卡牌游戏
![卡牌游戏程序设计_第1张图片](http://img.e-com-net.com/image/info8/64bb26359125492ca1769ab6ebea2448.png)
<template>
<div class="content">
<div class="title">牌库div>
<span class="cardlist" v-for="(item, index) in nums" :key="index">
{{changeNum(item)}}
span>
<div class="title">洗牌后div>
<span class="cardlist" v-for="(item, index) in shuffleList" :key="index">
{{changeNum(item)}}
span>
<div class="title">发牌后div>
<div class="palylist" v-for="(item, index) in Licensing" :key="index">
{{ '玩家' + index }}:
<span class="cardlist" v-for="(list, index) in item" :key="index">
{{changeNum(list)}}
span>
div>
<div class="winner" v-show="winnershow">玩家{{winnerNum}}赢了div>
<div class="buttonDiv">
<button @click="shuffleFunc()">洗牌button>
<button @click="dealFunc()">发牌button>
<button @click="clearFunc()">清空button>
div>
div>
template>
<script>
export default {
name: 'HelloWorld',
data() {
return {
nums: [
'2@',
'2#',
'2^',
'2*',
'3@',
'3#',
'3^',
'3*',
'4@',
'4#',
'4^',
'4*',
'5@',
'5#',
'5^',
'5*',
'6@',
'6#',
'6^',
'6*',
'7@',
'7#',
'7^',
'7*',
'8@',
'8#',
'8^',
'8*',
'9@',
'9#',
'9^',
'9*',
'10@',
'10#',
'10^',
'10*',
'11@',
'11#',
'11^',
'11*',
'12@',
'12#',
'12^',
'12*',
'13@',
'13#',
'13^',
'13*',
'14@',
'14#',
'14^',
'14*'
],
shuffleList: [],
Licensing: [],
playNum: 4,
winnerNum:0,
winnershow:false,
cardList: 10,
selectArr: []
}
},
methods: {
shuffleFunc() {
this.winnershow = false
this.Licensing = []
const radomNums = this.nums.slice(0);
let len = radomNums.length;
while (len > 1) {
let rand = Math.floor(Math.random() * len);
len--;
[radomNums[len], radomNums[rand]] = [radomNums[rand], radomNums[len]]
}
this.shuffleList = radomNums;
},
dealFunc(){
if(this.shuffleList.length == 0){
alert("请先洗牌")
return
}
let that = this
let list = [[], [], [], []];
for (let i = 0; i < that.shuffleList.length; i++) {
for (let j = 0; j < that.playNum; j++) {
if (i % that.playNum === j) {
list[j].push(that.shuffleList[i]);
}
}
}
this.Licensing = list;
that.findWinner(list)
},
findWinner(arr){
let newArr = [[],[],[],[]]
let newArr2 = [[],[],[],[]]
let winIndex = 0
let winCard = 0
let winner = 0
for (let i = 0; i < arr.length; i++) {
arr[i].forEach((item, index) => {
newArr[i][index] = item;
newArr2[i][index] = item.replace(/[^0-9]/gi, '');
})
}
for (let i = 0; i < newArr.length; i++) {
let obj = {}
let maxNum = 0
newArr2[i].forEach((item,index) => {
if(newArr2[i].indexOf(item) == index){
obj[item] = 1
}else{
obj[item] = obj[item] + 1
}
})
for(let i in obj){
if(obj[i] > maxNum){
maxNum = obj[i]
}
}
let maxKey = 0
for(let j in obj){
if(obj[j] === maxNum){
if(maxKey < j){
maxKey = Number(j)
}
}
}
console.log('玩家', i,'次数为', maxNum,'出现次数最多的数字为', maxKey);
if(maxNum > winIndex){
winIndex = maxNum
winCard = maxKey
winner = i
}else if(maxNum == winIndex){
if(maxKey > winCard){
winIndex = maxNum
winCard = maxKey
winner = i
}else if(maxKey == winCard){
winIndex = maxNum
winCard = maxKey
let Sum1 = 0
let Sum2 = 0
newArr[winner].forEach((item) =>{
let item1 = Number(item.replace(/[^0-9]/gi, ''))
let item2 = item.replace(/\d/g, '')
if(item1 == winCard){
if(item2 == "@"){
Sum1 = Sum1 +1
}
if(item2 == "#"){
Sum1 = Sum1 +2
}
if(item2 == "^"){
Sum1 = Sum1 +3
}
if(item2 == "*"){
Sum1 = Sum1 +4
}
}
})
newArr[i].forEach((item) =>{
let item1 = Number(item.replace(/[^0-9]/gi, ''))
let item2 = item.replace(/\d/g, '')
if(item1 == winCard){
if(item2 == "@"){
Sum2 = Sum2 +1
}
if(item2 == "#"){
Sum2 = Sum2 +2
}
if(item2 == "^"){
Sum2 = Sum2 +3
}
if(item2 == "*"){
Sum2 = Sum2 +4
}
}
})
if(Sum2 > Sum1){
winner = i
}
}
}
}
this.winnerNum = winner
this.winnershow = true
},
clearFunc(){
this.Licensing = [];
this.shuffleList = [];
this.winnershow = false
},
changeNum(str){
let data = str.replace(/[^0-9]/gi, '');
if(data == 11){
data = "J"
}
if(data == 12){
data = "Q"
}
if(data == 13){
data = "K"
}
if(data == 14){
data = "A"
}
return data + str.replace(/\d/g, '');
},
},
}
script>
<style scoped>
.content{
width: 50%;
margin: 25px auto;
text-align: left;
}
.title{
font-size: 20px;
margin-bottom: 15px;
margin-top: 25px;
}
.cardlist{
width: 25px;
display: inline-block;
text-align: center;
margin: 10px;
}
.winner{
text-align: center;
font-size: 25px;
color: red;
margin: 25px;
}
.buttonDiv{
text-align: center;
}
button{
margin: 25px 10px;
width: 20%;
}
style>