uni app 空挡接龙

pc游戏 空挡接龙 还不完整。现在没时间搞了记录在这里，等以后有时间了再继续搞。

<template><view class="page_main"><view class="contentone"><canvas class="canvas_cla" style="z-index: 1;" canvas-id="myCanvas" id="myCanvas"></canvas></view><view class="contentone"><canvas class="canvas_cla" style="z-index: 1;" canvas-id="myCanvasa" id="myCanvasa" @touchstart="touchstart"@touchend="touchend" @touchmove="touchmove"></canvas></view><!-- <view class="zhezhao" v-if="isshowstart"><view class="dialog_back"><cover-view class="add_button_ef" style=" color: #07a5a6;" @tap.stop.prevent="start_zhezhao">开始</cover-view><cover-view class="add_button_ef" style="color: #07a5a6;" @tap.stop.prevent="back_zhezhao">返回</cover-view></view></view> --><view class="button_main_view" style="z-index: 99;"><view @click="tx_click" class="button_view">提示</view><view @tap="cwbj_click" class="button_view">重玩本局</view><view @tap="xkyj_click" class="button_view">新开一局</view><view @click="ct_click" class="button_view">撤退</view></view></view>
</template><script>export default {data() {return {isshowstart: true,canvaswidth: 0,canvasheight: 0,ctx: null, // canvas 上下文  ctxtwo: null,top_one: [],top_two: [],top_three: [],top_four: [],home_one_list: [],home_two_list: [],home_three_list: [],home_four_list: [],one_list: [],two_list: [],three_list: [],four_list: [],five_list: [],six_list: [],seven_list: [],eight_list: [],all_list: [],movelist: {qupai: []},buzhoulist: [],positioncount: 5,txings: [],tixingid: 0,};},onLoad() {},onReady() {this.ctx = uni.createCanvasContext('myCanvas');this.ctxtwo = uni.createCanvasContext('myCanvasa');let canvas = uni.createSelectorQuery().select('#myCanvas');canvas.boundingClientRect(rect => {this.canvaswidth = rect.widththis.canvasheight = rect.heightthis.makecars()}).exec();},/*** 生命周期函数--监听页面卸载*/onUnload: function() {},methods: {tx_click: function() {// console.log(JSON.stringify(this.txings))let bean = this.txings[this.tixingid]console.log(JSON.stringify(bean))if (this.tixingid < this.txings.length - 1) {this.tixingid++} else {this.tixingid = 0}let txqpcard = bean.cardslet txfpcard = this.gettxfpxy(bean.to)this.biaoji(txfpcard, txqpcard)},biaoji: function(txfpcard, txqpcard) {// 可以提醒 绘制提醒框console.log("放牌位置", JSON.stringify(txfpcard))console.log("取牌位置", JSON.stringify(txqpcard))this.ctxtwo.beginPath();this.ctxtwo.setStrokeStyle('#f00'); // 设置矩形框颜色为红色this.ctxtwo.setLineWidth(2); // 设置矩形框线宽this.ctxtwo.rect(txfpcard.x, txfpcard.starty, 40, 50);this.ctxtwo.stroke(); // 描边矩形this.ctxtwo.closePath(); // 结束路径let fromxlet fromylet fromwlet fromhfromx = txqpcard[0].xfromy = txqpcard[0].startyfromw = 40fromh = txqpcard[txqpcard.length - 1].endy - fromythis.ctxtwo.beginPath();this.ctxtwo.setStrokeStyle('#ff0'); // 设置矩形框颜色为红色this.ctxtwo.rect(fromx, fromy, fromw, fromh);this.ctxtwo.stroke(); // 描边矩形this.ctxtwo.closePath(); // 结束路径this.ctxtwo.draw()},gettxfpxy: function(index) {let bean = {}switch (index) {case 1:if (this.one_list.length > 0) {bean = this.one_list[this.one_list.length - 1]} else {bean.x = 10bean.starty = 60bean.endx = 10 + 40bean.endy = 60 + 50}breakcase 2:if (this.two_list.length > 0) {bean = this.two_list[this.two_list.length - 1]} else {bean.x = 54bean.starty = 60bean.endx = 54 + 40bean.endy = 60 + 50}breakcase 3:if (this.three_list.length > 0) {bean = this.three_list[this.three_list.length - 1]} else {bean.x = 98bean.starty = 60bean.endx = 98 + 40bean.endy = 60 + 50}breakcase 4:if (this.four_list.length > 0) {bean = this.four_list[this.four_list.length - 1]} else {bean.x = 142bean.starty = 60bean.endx = 142 + 40bean.endy = 60 + 50}breakcase 5:if (this.five_list.length > 0) {bean = this.five_list[this.five_list.length - 1]} else {bean.x = 186bean.starty = 60bean.endx = 186 + 40bean.endy = 60 + 50}breakcase 6:if (this.six_list.length > 0) {bean = this.six_list[this.six_list.length - 1]} else {bean.x = 230bean.starty = 60bean.endx = 230 + 40bean.endy = 60 + 50}breakcase 7:if (this.seven_list.length > 0) {bean = this.seven_list[this.seven_list.length - 1]} else {bean.x = 274bean.starty = 60bean.endx = 274 + 40bean.endy = 60 + 50}breakcase 8:if (this.eight_list.length > 0) {bean = this.eight_list[this.eight_list.length - 1]} else {bean.x = 318bean.starty = 60bean.endx = 318 + 40bean.endy = 60 + 50}breakcase 9:bean.x = 2bean.starty = 0bean.endx = 40bean.endy = 50breakcase 10:bean.x = 42bean.starty = 0bean.endx = 40bean.endy = 50breakcase 11:bean.x = 82bean.starty = 0bean.endx = 40bean.endy = 50breakcase 12:bean.x = 122bean.starty = 0bean.endx = 40bean.endy = 50break}return bean},txstart: function() {this.txings = []for (var i = this.positioncount; i > 0; i--) {console.log("txstart", i)this.txqup(i)}},duibierji: function(txcard, data, size, from, to) {let txing = {}if (data.length == 0) {txing.from = fromtxing.to = totxing.cards = txcardthis.txings.push(txing)} else {let beans = [data[data.length - 1]]let arr = beans.concat(txcard)console.log(from, to, JSON.stringify(arr))if (this.txqppd(arr)) {txing.from = fromtxing.to = totxing.cards = txcardthis.txings.push(txing)}}},duibi: function(txcard, size, from) {for (var i = 1; i <= 12; i++) {switch (i) {case 1:this.duibierji(txcard, this.one_list, size, from, 1)breakcase 2:this.duibierji(txcard, this.two_list, size, from, 2)breakcase 3:this.duibierji(txcard, this.three_list, size, from, 3)breakcase 4:this.duibierji(txcard, this.four_list, size, from, 4)breakcase 5:this.duibierji(txcard, this.five_list, size, from, 5)breakcase 6:this.duibierji(txcard, this.six_list, size, from, 6)breakcase 7:this.duibierji(txcard, this.seven_list, size, from, 7)breakcase 8:this.duibierji(txcard, this.eight_list, size, from, 8)breakcase 9:if (size == 1) {this.duibierji(txcard, this.top_one, size, from, 9)}breakcase 10:if (size == 1) {this.duibierji(txcard, this.top_two, size, from, 10)}breakcase 11:if (size == 1) {this.duibierji(txcard, this.top_three, size, from, 11)}breakcase 12:if (size == 1) {this.duibierji(txcard, this.top_four, size, from, 12)}break}}},txqup: function(size) {for (var i = 1; i <= 12; i++) {switch (i) {case 1:if (this.one_list.length >= size) {let subArray = this.one_list.slice(this.one_list.length - size);if (this.txqppd(subArray)) {this.duibi(subArray, size, 1)}}breakcase 2:if (this.two_list.length >= size) {let subArray = this.two_list.slice(this.two_list.length - size);if (this.txqppd(subArray)) {this.duibi(subArray, size, 2)}}breakcase 3:if (this.three_list.length >= size) {let subArray = this.three_list.slice(this.three_list.length - size);if (this.txqppd(subArray)) {this.duibi(subArray, size, 3)}}breakcase 4:if (this.four_list.length >= size) {let subArray = this.four_list.slice(this.four_list.length - size);if (this.txqppd(subArray)) {this.duibi(subArray, size, 4)}}breakcase 5:if (this.five_list.length >= size) {let subArray = this.five_list.slice(this.five_list.length - size);if (this.txqppd(subArray)) {this.duibi(subArray, size, 5)}}breakcase 6:if (this.six_list.length >= size) {let subArray = this.six_list.slice(this.six_list.length - size);if (this.txqppd(subArray)) {this.duibi(subArray, size, 6)}}breakcase 7:if (this.seven_list.length >= size) {let subArray = this.seven_list.slice(this.seven_list.length - size);if (this.txqppd(subArray)) {this.duibi(subArray, size, 7)}}breakcase 8:if (this.eight_list.length >= size) {let subArray = this.eight_list.slice(this.eight_list.length - size);if (this.txqppd(subArray)) {this.duibi(subArray, size, 8)}}breakcase 9:if (this.top_one.length >= size) {let subArray = this.top_one.slice(this.top_one.length - size);if (this.txqppd(subArray)) {this.duibi(subArray, size, 9)}}breakcase 10:if (this.top_two.length >= size) {let subArray = this.top_two.slice(this.top_two.length - size);if (this.txqppd(subArray)) {this.duibi(subArray, size, 10)}}breakcase 11:if (this.top_three.length >= size) {let subArray = this.top_three.slice(this.top_three.length - size);if (this.txqppd(subArray)) {this.duibi(subArray, size, 11)}}breakcase 12:if (this.top_four.length >= size) {let subArray = this.top_four.slice(this.top_four.length - size);if (this.txqppd(subArray)) {this.duibi(subArray, size, 12)}}break}}},txqppd: function(qpwz) {//判断是否提醒let arr = qpwzif (arr.length == 1) {return true} else if (arr.length == 0) {return false}for (var i = 0; i <= arr.length - 2; i++) {if (arr[i].flower == arr[i + 1].flower) {// console.log("取牌不是差色")return false}}if (arr[0].value - arr[arr.length - 1].value != arr.length - 1) {// console.log("取牌不是是顺子", arr.length)return false}return true},ct_click: function() {if (this.buzhoulist.length == 0) {console.log("没有移动的")this.getpositioncount()return}var bz = this.buzhoulist[this.buzhoulist.length - 1]if (bz.from == bz.to) {this.buzhoulist.splice(this.buzhoulist.length - 1, 1);this.getpositioncount()return}this.buzhoulist.splice(this.buzhoulist.length - 1, 1);this.ctfp(bz.from, bz.qupai)this.ctqp(bz.to, bz.qupai)this.getpositioncount()this.drawpai()},/*** @param {Object} to 放到哪里去* @param {Object} cardlist  要放那些card*/ctfp: function(to, cardlist) {for (var i = 0; i < cardlist.length; i++) {switch (to * 1) {case 1:this.one_list.push(cardlist[i])break;case 2:this.two_list.push(cardlist[i])break;case 3:this.three_list.push(cardlist[i])break;case 4:this.four_list.push(cardlist[i])break;case 5:this.five_list.push(cardlist[i])break;case 6:this.six_list.push(cardlist[i])break;case 7:this.seven_list.push(cardlist[i])break;case 8:this.eight_list.push(cardlist[i])break;case 9:this.top_one = cardlist[i]break;case 10:this.top_two = cardlist[i]break;case 11:this.top_three = cardlist[i]break;case 12:this.top_four = cardlist[i]break;case 13:this.home_one_list.push(cardlist[i])break;case 14:this.home_two_list.push(cardlist[i])break;case 15:this.home_three_list.push(cardlist[i])break;case 16:this.home_four_list.push(cardlist[i])break;}}},/*** @param {Object} cardlist 要取走那些* @param {Object} from 从哪里取*/ctqp: function(from, cardlist) {for (var i = 0; i < cardlist.length; i++) {switch (from * 1) {case 1:this.one_list.splice(this.one_list.length - 1, 1)break;case 2:this.two_list.splice(this.two_list.length - 1, 1)break;case 3:this.three_list.splice(this.three_list.length - 1, 1)break;case 4:this.four_list.splice(this.four_list.length - 1, 1)break;case 5:this.five_list.splice(this.five_list.length - 1, 1)break;case 6:this.six_list.splice(this.six_list.length - 1, 1)break;case 7:this.seven_list.splice(this.seven_list.length - 1, 1)break;case 8:this.eight_list.splice(this.eight_list.length - 1, 1)break;case 9:this.top_one = []break;case 10:this.top_two = []break;case 11:this.top_three = []break;case 12:this.top_four = []break;case 13:this.home_one_list.splice(this.home_one_list.length - 1, 1)break;case 14:this.home_two_list.splice(this.home_two_list.length - 1, 1)break;case 15:this.home_three_list.splice(this.home_three_list.length - 1, 1)break;case 16:this.home_four_list.splice(this.home_four_list.length - 1, 1)break;}}},cwbj_click: function() {this.top_one = []this.top_two = []this.top_three = []this.top_four = []this.home_one_list = []this.home_two_list = []this.home_three_list = []this.home_four_list = []this.one_list = []this.two_list = []this.three_list = []this.four_list = []this.five_list = []this.six_list = []this.seven_list = []this.eight_list = []this.movelist = {qupai: []}this.buzhoulist = []this.fapai()},xkyj_click: function() {this.top_one = []this.top_two = []this.top_three = []this.top_four = []this.home_one_list = []this.home_two_list = []this.home_three_list = []this.home_four_list = []this.one_list = []this.two_list = []this.three_list = []this.four_list = []this.five_list = []this.six_list = []this.seven_list = []this.eight_list = []this.all_list = []this.movelist = {qupai: []}this.buzhoulist = []this.makecars()},/*** 触摸屏幕开始 记录开始坐标*/touchstart: function(e) {let startx = e.touches[0].xlet starty = e.touches[0].yconsole.log("startx", startx)console.log("starty", starty)let postion = this.jspostion(startx, starty)this.qupai(postion, startx, starty)},pdqpsfcg: function() {var arr = this.movelist.qupaiif (arr.length > this.positioncount) {return false}for (var i = 0; i <= arr.length - 2; i++) {if (arr[i].flower == arr[i + 1].flower) {console.log("取牌不是差色")return false}}if (arr[0].value - arr[arr.length - 1].value == arr.length - 1) {console.log("取牌是顺子")return true} else {console.log("取牌不是顺子")this.movelist = []return false}},drawqp: function(startx, starty) {var arr = this.movelist.qupaifor (var i = 0; i < arr.length; i++) {this.ctxtwo.drawImage('./static/' + arr[i].zpcolor + '.png', startx, starty + i * 30, 40,50); // 绘制图片  }this.ctxtwo.draw()},qupai: function(postions, startx, starty) {if (postions.length == 1) {return}if (postions[0] < 0 && postions[1] < 0) {return}switch (postions[0] * 1) {case 1:for (var i = postions[1] * 1; i < this.one_list.length; i++) {console.log(JSON.stringify(this.one_list[i]))this.movelist.from = 1this.movelist.qupai.push(this.one_list[i])}//判断是否取牌成功// this.movelistif (this.pdqpsfcg()) {this.one_list.splice(postions[1] * 1, this.one_list.length - postions[1] * 1)this.drawpai()this.drawqp(startx, starty)} else {this.movelist = {qupai: []}}breakcase 2:for (var i = postions[1] * 1; i < this.two_list.length; i++) {console.log(JSON.stringify(this.two_list[i]))this.movelist.from = 2this.movelist.qupai.push(this.two_list[i])}//判断是否取牌成功// this.movelistif (this.pdqpsfcg()) {this.two_list.splice(postions[1] * 1, this.two_list.length - postions[1] * 1)this.drawpai()this.drawqp(startx, starty)} else {this.movelist = {qupai: []}}breakcase 3:for (var i = postions[1] * 1; i < this.three_list.length; i++) {console.log(JSON.stringify(this.three_list[i]))this.movelist.from = 3this.movelist.qupai.push(this.three_list[i])}//判断是否取牌成功// this.movelistif (this.pdqpsfcg()) {this.three_list.splice(postions[1] * 1, this.three_list.length - postions[1] * 1)this.drawpai()this.drawqp(startx, starty)} else {this.movelist = {qupai: []}}breakcase 4:for (var i = postions[1] * 1; i < this.four_list.length; i++) {console.log(JSON.stringify(this.four_list[i]))this.movelist.from = 4this.movelist.qupai.push(this.four_list[i])}//判断是否取牌成功// this.movelistif (this.pdqpsfcg()) {this.four_list.splice(postions[1] * 1, this.four_list.length - postions[1] * 1)this.drawpai()this.drawqp(startx, starty)} else {this.movelist = {qupai: []}}breakcase 5:for (var i = postions[1] * 1; i < this.five_list.length; i++) {console.log(JSON.stringify(this.five_list[i]))this.movelist.from = 5this.movelist.qupai.push(this.five_list[i])}//判断是否取牌成功// this.movelistif (this.pdqpsfcg()) {this.five_list.splice(postions[1] * 1, this.five_list.length - postions[1] * 1)this.drawpai()this.drawqp(startx, starty)} else {this.movelist = {qupai: []}}breakcase 6:for (var i = postions[1] * 1; i < this.six_list.length; i++) {console.log(JSON.stringify(this.six_list[i]))this.movelist.from = 6this.movelist.qupai.push(this.six_list[i])}//判断是否取牌成功// this.movelistif (this.pdqpsfcg()) {this.six_list.splice(postions[1] * 1, this.six_list.length - postions[1] * 1)this.drawpai()this.drawqp(startx, starty)} else {this.movelist = {qupai: []}}breakcase 7:for (var i = postions[1] * 1; i < this.seven_list.length; i++) {console.log(JSON.stringify(this.seven_list[i]))this.movelist.from = 7this.movelist.qupai.push(this.seven_list[i])}//判断是否取牌成功// this.movelistif (this.pdqpsfcg()) {this.seven_list.splice(postions[1] * 1, this.seven_list.length - postions[1] * 1)this.drawpai()this.drawqp(startx, starty)} else {this.movelist = {qupai: []}}breakcase 8:for (var i = postions[1] * 1; i < this.eight_list.length; i++) {console.log(JSON.stringify(this.eight_list[i]))this.movelist.from = 8this.movelist.qupai.push(this.eight_list[i])}//判断是否取牌成功// this.movelistif (this.pdqpsfcg()) {this.eight_list.splice(postions[1] * 1, this.eight_list.length - postions[1] * 1)this.drawpai()this.drawqp(startx, starty)} else {this.movelist = {qupai: []}}breakcase 9:this.movelist.from = 9this.movelist.qupai.push(this.top_one[0])//判断是否取牌成功// this.movelistif (this.pdqpsfcg()) {this.top_one = []this.drawpai()this.drawqp(startx, starty)} else {this.movelist = {qupai: []}}breakcase 10:this.movelist.from = 10this.movelist.qupai.push(this.top_two[0])//判断是否取牌成功// this.movelistif (this.pdqpsfcg()) {this.top_two = []this.drawpai()this.drawqp(startx, starty)} else {this.movelist = {qupai: []}}breakcase 11:this.movelist.from = 11this.movelist.qupai.push(this.top_three[0])//判断是否取牌成功// this.movelistif (this.pdqpsfcg()) {this.top_three = []this.drawpai()this.drawqp(startx, starty)} else {this.movelist = {qupai: []}}breakcase 12:this.movelist.from = 12this.movelist.qupai.push(this.top_four[0])//判断是否取牌成功// this.movelistif (this.pdqpsfcg()) {this.top_four = []this.drawpai()this.drawqp(startx, starty)} else {this.movelist = {qupai: []}}breakcase 13:console.log(JSON.stringify(this.home_one_list[this.home_one_list.length - 1]))this.movelist.from = 13this.movelist.qupai.push(this.home_one_list[this.home_one_list.length - 1])//判断是否取牌成功// this.movelistif (this.pdqpsfcg()) {this.home_one_list.splice(this.home_one_list.length - 1, 1)this.drawpai()this.drawqp(startx, starty)} else {this.movelist = {qupai: []}}breakcase 14:console.log(JSON.stringify(this.home_two_list[this.home_two_list.length - 1]))this.movelist.from = 14this.movelist.qupai.push(this.home_two_list[this.home_two_list.length - 1])//判断是否取牌成功// this.movelistif (this.pdqpsfcg()) {this.home_two_list.splice(this.home_two_list.length - 1, 1)this.drawpai()} else {this.movelist = {qupai: []}}breakcase 15:console.log(JSON.stringify(this.home_three_list[this.home_three_list.length - 1]))this.movelist.from = 14this.movelist.qupai.push(this.home_three_list[this.home_three_list.length - 1])//判断是否取牌成功// this.movelistif (this.pdqpsfcg()) {this.home_three_list.splice(this.home_three_list.length - 1, 1)this.drawpai()this.drawqp(startx, starty)} else {this.movelist = {qupai: []}}breakcase 16:console.log(JSON.stringify(this.home_four_list[this.home_four_list.length - 1]))this.movelist.from = 14this.movelist.qupai.push(this.home_four_list[this.home_four_list.length - 1])//判断是否取牌成功// this.movelistif (this.pdqpsfcg()) {this.home_four_list.splice(this.home_four_list.length - 1, 1)this.drawpai()this.drawqp(startx, starty)} else {this.movelist = {qupai: []}}break}//判断是否取牌成功},jspostion: function(x, y) {let postion = [-1, -1]if (y > 60) {if (x > 10 && x < 50) {postion[0] = 1for (var i = 0; i < this.one_list.length; i++) {console.log("this.one_list[i].starty", this.one_list[i].starty)console.log("y", y)if (y > this.one_list[i].starty && y < this.one_list[i].endy) {postion[1] = i}}} else if (x > 50 & x < 94) {postion[0] = 2for (var i = 0; i < this.two_list.length; i++) {if (y > this.two_list[i].starty && y < this.two_list[i].endy) {postion[1] = i}}} else if (x > 98 & x < 138) {postion[0] = 3for (var i = 0; i < this.three_list.length; i++) {if (y > this.three_list[i].starty && y < this.three_list[i].endy) {postion[1] = i}}} else if (x > 142 & x < 182) {postion[0] = 4for (var i = 0; i < this.four_list.length; i++) {if (y > this.four_list[i].starty && y < this.four_list[i].endy) {postion[1] = i}}} else if (x > 186 & x < 226) {postion[0] = 5for (var i = 0; i < this.five_list.length; i++) {if (y > this.five_list[i].starty && y < this.five_list[i].endy) {postion[1] = i}}} else if (x > 230 & x < 270) {postion[0] = 6for (var i = 0; i < this.six_list.length; i++) {if (y > this.six_list[i].starty && y < this.six_list[i].endy) {postion[1] = i}}} else if (x > 274 & x < 314) {postion[0] = 7for (var i = 0; i < this.seven_list.length; i++) {if (y > this.seven_list[i].starty && y < this.seven_list[i].endy) {postion[1] = i}}} else if (x > 318 & x < 358) {postion[0] = 8for (var i = 0; i < this.eight_list.length; i++) {if (y > this.eight_list[i].starty && y < this.eight_list[i].endy) {postion[1] = i}}}} else {if (x > 2 && x < 42) {postion = [9, 1]}if (x > 42 && x < 82) {postion = [10, 1]}if (x > 82 && x < 122) {postion = [11, 1]}if (x > 122 && x < 162) {postion = [12, 1]}if (x > 202 && x < 242) {postion = [13, 1]}if (x > 242 && x < 282) {postion = [14, 1]}if (x > 282 && x < 322) {postion = [15, 1]}if (x > 322 && x < 362) {postion = [16, 1]}}console.log(JSON.stringify(postion))return postion},/*** 触摸屏幕结束 计算*/touchend: function(e) {let endx = e.changedTouches[0].xlet endy = e.changedTouches[0].y// this.movelist = {// 	qupai: []// }let postion = this.jspostion(endx, endy)this.fangpai(postion, endx, endy)},fppd: function(list) {console.log(" 放牌")if (this.movelist.qupai.length == 0) {return false}if (list.length == 0) {return true}if (this.movelist.qupai[0].flower == list[list.length - 1].flower) {console.log("不是差色,不能放牌")return false}if (list[list.length - 1].value - this.movelist.qupai[0].value == 1) {return true} else {console.log("不是顺子")return false}},gohome: function(list) {if (this.movelist.qupai[0].flower == list[list.length - 1].flower) {if (this.movelist.qupai[0].value - list[list.length - 1].value == 1) {return true}}return false},tuihui: function(movelist) {console.log(JSON.stringify(movelist))if (movelist.qupai.length == 0) {return}switch (movelist.from * 1) {case 1:console.log("不可以放牌")this.one_list = this.one_list.concat(movelist.qupai)this.movelist = {qupai: []}this.drawpai()breakcase 2:this.two_list = this.two_list.concat(movelist.qupai)this.movelist = {qupai: []}this.drawpai()this.ctxtwo.draw()breakcase 3:this.three_list = this.three_list.concat(movelist.qupai)this.movelist = {qupai: []}this.drawpai()this.ctxtwo.draw()breakcase 4:this.four_list = this.four_list.concat(movelist.qupai)this.movelist = {qupai: []}this.drawpai()this.ctxtwo.draw()breakcase 5:this.five_list = this.five_list.concat(movelist.qupai)this.movelist = {qupai: []}this.drawpai()this.ctxtwo.draw()breakcase 6:this.six_list = this.six_list.concat(movelist.qupai)this.movelist = {qupai: []}this.drawpai()this.ctxtwo.draw()breakcase 7:this.seven_list = this.seven_list.concat(movelist.qupai)this.movelist = {qupai: []}this.drawpai()this.ctxtwo.draw()breakcase 8:this.eight_list = this.eight_list.concat(movelist.qupai)this.movelist = {qupai: []}this.drawpai()this.ctxtwo.draw()breakcase 9:this.top_one = this.top_one.concat(movelist.qupai)this.movelist = {qupai: []}this.drawpai()this.ctxtwo.draw()breakcase 10:this.top_two = this.top_two.concat(movelist.qupai)this.movelist = {qupai: []}this.drawpai()this.ctxtwo.draw()breakcase 11:this.top_three = this.top_three.concat(movelist.qupai)this.movelist = {qupai: []}this.drawpai()this.ctxtwo.draw()breakcase 12:this.top_four = this.top_four.concat(movelist.qupai)this.movelist = {qupai: []}this.drawpai()this.ctxtwo.draw()breakcase 13:this.home_one_list = this.home_one_list.concat(movelist.qupai)this.movelist = {qupai: []}this.drawpai()this.ctxtwo.draw()breakcase 14:this.home_two_list = this.home_two_list.concat(movelist.qupai)this.movelist = {qupai: []}this.drawpai()this.ctxtwo.draw()breakcase 15:this.home_three_list = this.home_three_list.concat(movelist.qupai)this.movelist = {qupai: []}this.drawpai()this.ctxtwo.draw()breakcase 16:this.home_four_list = this.home_four_list.concat(movelist.qupai)this.movelist = {qupai: []}this.drawpai()this.ctxtwo.draw()break}},addbuzhou: function() {var buzhou = JSON.parse(JSON.stringify(this.movelist))this.movelist = {qupai: []}this.buzhoulist.push(buzhou)},fangpai: function(postions, startx, starty) {if (postions[0] < 0 && postions[1] < 0) {this.tuihui(this.movelist)this.drawpai()this.ctxtwo.draw()return}var arr = JSON.parse(JSON.stringify(this.movelist.qupai))switch (postions[0] * 1) {case 1:if (this.fppd(this.one_list)) {console.log("可以放牌")this.one_list = this.one_list.concat(arr)this.movelist.to = postions[0]this.addbuzhou()this.getpositioncount()this.audioToHome()} else {this.tuihui(this.movelist)}this.drawpai()this.ctxtwo.draw()breakcase 2:if (this.fppd(this.two_list)) {console.log("可以放牌")this.two_list = this.two_list.concat(arr)this.movelist.to = postions[0]this.addbuzhou()this.getpositioncount()this.audioToHome()} else {this.tuihui(this.movelist)}this.drawpai()this.ctxtwo.draw()breakcase 3:if (this.fppd(this.three_list)) {console.log("可以放牌")this.three_list = this.three_list.concat(arr)this.movelist.to = postions[0]this.addbuzhou()this.getpositioncount()this.audioToHome()} else {this.tuihui(this.movelist)}this.drawpai()this.ctxtwo.draw()breakcase 4:if (this.fppd(this.four_list)) {console.log("可以放牌")this.four_list = this.four_list.concat(arr)this.movelist.to = postions[0]this.addbuzhou()this.getpositioncount()this.audioToHome()} else {this.tuihui(this.movelist)}this.drawpai()this.ctxtwo.draw()breakcase 5:if (this.fppd(this.five_list)) {console.log("可以放牌")this.five_list = this.five_list.concat(arr)this.movelist.to = postions[0]this.addbuzhou()this.getpositioncount()this.audioToHome()} else {this.tuihui(this.movelist)}this.drawpai()this.ctxtwo.draw()breakcase 6:if (this.fppd(this.six_list)) {console.log("可以放牌")this.six_list = this.six_list.concat(arr)this.movelist.to = postions[0]this.addbuzhou()this.getpositioncount()this.audioToHome()} else {this.tuihui(this.movelist)}this.drawpai()this.ctxtwo.draw()breakcase 7:if (this.fppd(this.seven_list)) {console.log("可以放牌")this.seven_list = this.seven_list.concat(arr)this.movelist.to = postions[0]this.addbuzhou()this.getpositioncount()this.audioToHome()} else {this.tuihui(this.movelist)}this.drawpai()this.ctxtwo.draw()breakcase 8:if (this.fppd(this.eight_list)) {console.log("可以放牌")this.eight_list = this.eight_list.concat(arr)this.movelist.to = postions[0]this.addbuzhou()this.getpositioncount()this.audioToHome()} else {this.tuihui(this.movelist)}this.drawpai()this.ctxtwo.draw()breakcase 9:if (this.top_one.length == 0) {console.log("可以放牌")this.top_one = this.top_one.concat(arr)this.movelist.to = postions[0]this.addbuzhou()this.getpositioncount()this.audioToHome()} else {console.log("11不可以放牌")this.tuihui(this.movelist)}this.drawpai()this.ctxtwo.draw()breakcase 10:if (this.fppd(this.top_two)) {console.log("可以放牌")this.top_two = this.top_two.concat(arr)this.movelist.to = postions[0]this.addbuzhou()this.getpositioncount()this.audioToHome()} else {this.tuihui(this.movelist)}this.drawpai()this.ctxtwo.draw()breakcase 11:if (this.fppd(this.top_three)) {console.log("可以放牌")this.top_three = this.top_three.concat(arr)this.movelist.to = postions[0]this.addbuzhou()this.getpositioncount()this.audioToHome()} else {this.tuihui(this.movelist)}this.drawpai()this.ctxtwo.draw()breakcase 12:if (this.fppd(this.top_four)) {console.log("可以放牌")this.top_four = this.top_four.concat(arr)this.movelist.to = postions[0]this.addbuzhou()this.getpositioncount()this.audioToHome()} else {this.tuihui(this.movelist)}this.drawpai()this.ctxtwo.draw()breakcase 13:if (this.gohome(this.home_one_list)) {console.log("可以放牌")this.home_one_list = this.home_one_list.concat(arr)this.movelist.to = postions[0]this.addbuzhou()this.getpositioncount()this.audioToHome()} else {this.tuihui(this.movelist)}this.drawpai()this.ctxtwo.draw()breakcase 14:if (this.gohome(this.home_two_list)) {console.log("可以放牌")this.home_two_list = this.home_two_list.concat(arr)this.movelist.to = postions[0]this.addbuzhou()this.getpositioncount()this.audioToHome()} else {this.tuihui(this.movelist)}this.drawpai()this.ctxtwo.draw()breakcase 15:if (this.gohome(this.home_three_list)) {console.log("可以放牌")this.home_three_list = this.home_three_list.concat(arr)this.movelist.to = postions[0]this.addbuzhou()this.getpositioncount()this.audioToHome()} else {this.tuihui(this.movelist)}this.drawpai()this.ctxtwo.draw()breakcase 16:if (this.gohome(this.home_four_list)) {console.log("可以放牌")this.home_four_list = this.home_four_list.concat(arr)this.movelist.to = postions[0]this.addbuzhou()this.getpositioncount()this.audioToHome()} else {this.tuihui(this.movelist)}this.drawpai()this.ctxtwo.draw()break}},audioToHome: function() {var isscess = falseif (this.audioToHomeFp(this.one_list[this.one_list.length - 1], 1)) {this.one_list.splice(this.one_list.length - 1, 1)isscess = true} else if (this.audioToHomeFp(this.two_list[this.two_list.length - 1], 2)) {this.two_list.splice(this.two_list.length - 1, 1)isscess = true} else if (this.audioToHomeFp(this.three_list[this.three_list.length - 1], 3)) {this.three_list.splice(this.three_list.length - 1, 1)isscess = true} else if (this.audioToHomeFp(this.four_list[this.four_list.length - 1], 4)) {this.four_list.splice(this.four_list.length - 1, 1)isscess = true} else if (this.audioToHomeFp(this.five_list[this.five_list.length - 1], 5)) {this.five_list.splice(this.five_list.length - 1, 1)isscess = true} else if (this.audioToHomeFp(this.six_list[this.six_list.length - 1], 6)) {this.six_list.splice(this.six_list.length - 1, 1)isscess = true} else if (this.audioToHomeFp(this.seven_list[this.seven_list.length - 1], 7)) {this.seven_list.splice(this.seven_list.length - 1, 1)isscess = true} else if (this.audioToHomeFp(this.eight_list[this.eight_list.length - 1], 8)) {this.eight_list.splice(this.eight_list.length - 1, 1)isscess = true} else if (this.audioToHomeFp(this.top_one[this.top_one.length - 1], 9)) {this.top_one.splice(this.top_one.length - 1, 1)isscess = true} else if (this.audioToHomeFp(this.top_two[this.top_two.length - 1], 10)) {this.top_two.splice(this.top_two.length - 1, 1)isscess = true} else if (this.audioToHomeFp(this.top_three[this.top_three.length - 1], 11)) {this.top_three.splice(this.top_three.length - 1, 1)isscess = true} else if (this.audioToHomeFp(this.top_four[this.top_four.length - 1], 11)) {this.top_four.splice(this.top_four.length - 1, 1)isscess = true}if (isscess) {this.audioToHome()}this.drawpai()},audioToHomeFp(card, from) {if (!card) {return false}card.from = fromvar bz = {from: from,qupai: [JSON.parse(JSON.stringify(card))],}if (card.value == 1) {if (this.home_one_list.length == 0) {this.home_one_list.push(card)bz.to = 13this.buzhoulist.push(bz)return true} elseif (this.home_two_list.length == 0) {this.home_two_list.push(card)bz.to = 14this.buzhoulist.push(bz)return true} elseif (this.home_three_list.length == 0) {this.home_three_list.push(card)bz.to = 15this.buzhoulist.push(bz)return true} elseif (this.home_four_list.length == 0) {this.home_four_list.push(card)bz.to = 16this.buzhoulist.push(bz)return true}} else {if (this.home_one_list.length > 0 && this.home_one_list[0].hse == card.hse && card.value - this.home_one_list[this.home_one_list.length - 1].value == 1) {this.home_one_list.push(card)bz.to = 13this.buzhoulist.push(bz)return true} elseif (this.home_two_list.length > 0 && this.home_two_list[0].hse == card.hse && card.value - this.home_two_list[this.home_two_list.length - 1].value == 1) {this.home_two_list.push(card)bz.to = 14this.buzhoulist.push(bz)return true} elseif (this.home_three_list.length > 0 && this.home_three_list[0].hse == card.hse && card.value - this.home_three_list[this.home_three_list.length - 1].value == 1) {this.home_three_list.push(card)bz.to = 15this.buzhoulist.push(bz)return true} elseif (this.home_four_list.length > 0 && this.home_four_list[0].hse == card.hse && card.value - this.home_four_list[this.home_four_list.length - 1].value == 1) {this.home_four_list.push(card)bz.to = 16this.buzhoulist.push(bz)return true}}return false},getpositioncount: function() {let count = 0if (!this.top_one.value) {count++}if (!this.top_two.value) {count++}if (!this.top_three.value) {count++}if (!this.top_four.value) {count++}if (this.one_list.length == 0) {count++}if (this.two_list.length == 0) {count++}if (this.three_list.length == 0) {count++}if (this.four_list.length == 0) {count++}if (this.five_list.length == 0) {count++}if (this.six_list.length == 0) {count++}if (this.seven_list.length == 0) {count++}if (this.eight_list.length == 0) {count++}console.log("getpositioncount", count)this.positioncount = count + 1},/*** 触摸屏幕移动  画框*/touchmove: function(e) {// e.touches[0].x, e.touches[0].ythis.drawqp(e.touches[0].x, e.touches[0].y)},makecars: function() {for (var i = 0; i < 52; i++) {if (i < 13) {this.all_list.push(this.getcarbean(i + 1, "b", 1, 1))}if (i >= 13 && i < 26) {this.all_list.push(this.getcarbean(i - 13 + 1, "h", 2, 2))}if (i >= 26 && i < 39) {this.all_list.push(this.getcarbean(i - 26 + 1, "m", 1, 3))}if (i >= 39) {this.all_list.push(this.getcarbean(i - 39 + 1, "f", 2, 4))}}this.all_list = this.shuffle(this.all_list)this.fapai()},fapai: function() {for (var i = 0; i < this.all_list.length; i = i + 8) {this.one_list.push(this.all_list[i])this.two_list.push(this.all_list[i + 1])this.three_list.push(this.all_list[i + 2])this.four_list.push(this.all_list[i + 3])if (i + 4 < this.all_list.length) {this.five_list.push(this.all_list[i + 4])this.six_list.push(this.all_list[i + 5])this.seven_list.push(this.all_list[i + 6])this.eight_list.push(this.all_list[i + 7])}}this.drawpai()// this.txstart()},drawpai: function() {this.ctx.beginPath();this.ctx.setStrokeStyle('#00a99d'); // 设置矩形框颜色为红色this.ctx.setLineWidth(2); // 设置矩形框线宽this.ctx.rect(2, 0, 40, 50);if (this.top_one.length > 0) {this.ctx.drawImage('./static/' + this.top_one[0].zpcolor + '.png', 2, 0, 40, 50); // 绘制图片 }this.ctx.rect(42, 0, 40, 50);if (this.top_two.length > 0) {this.ctx.drawImage('./static/' + this.top_two[0].zpcolor + '.png', 42, 0, 40, 50); // 绘制图片 }this.ctx.rect(82, 0, 40, 50);if (this.top_three.length > 0) {this.ctx.drawImage('./static/' + this.top_three[0].zpcolor + '.png', 82, 0, 40, 50); // 绘制图片 }this.ctx.rect(122, 0, 40, 50);if (this.top_four.length > 0) {this.ctx.drawImage('./static/' + this.top_four[0].zpcolor + '.png', 122, 0, 40, 50); // 绘制图片 }this.ctx.rect(162, 0, 40, 50);this.ctx.rect(202, 0, 40, 50);if (this.home_one_list.length > 0) {this.ctx.drawImage('./static/' + this.home_one_list[this.home_one_list.length - 1].zpcolor +'.png', 202, 0, 40, 50); // 绘制图片 }this.ctx.rect(242, 0, 40, 50);if (this.home_two_list.length > 0) {this.ctx.drawImage('./static/' + this.home_two_list[this.home_two_list.length - 1].zpcolor +'.png', 242, 0, 40, 50); // 绘制图片 }this.ctx.rect(282, 0, 40, 50);if (this.home_three_list.length > 0) {this.ctx.drawImage('./static/' + this.home_three_list[this.home_three_list.length - 1].zpcolor +'.png', 282, 0, 40, 50); // 绘制图片 }this.ctx.rect(322, 0, 40, 50);if (this.home_four_list.length > 0) {this.ctx.drawImage('./static/' + this.home_four_list[this.home_four_list.length - 1].zpcolor +'.png', 322, 0, 40, 50); // 绘制图片 }this.ctx.stroke(); // 描边矩形this.ctx.closePath(); // 结束路径for (var i = 0; i < this.one_list.length; i++) {this.one_list[i].x = 10this.one_list[i].starty = 60 + i * 30this.one_list[i].endx = 10 + 40if (i == this.one_list.length - 1) {this.one_list[i].endy = 60 + i * 30 + 50} else {this.one_list[i].endy = 60 + i * 30 + 30}this.ctx.drawImage('./static/' + this.one_list[i].zpcolor + '.png', 10, 60 + i * 30, 40,50); // 绘制图片  }for (var i = 0; i < this.two_list.length; i++) {this.two_list[i].x = 54this.two_list[i].starty = 60 + i * 30this.two_list[i].endx = 54 + 40if (i == this.two_list.length - 1) {this.two_list[i].endy = 60 + i * 30 + 50} else {this.two_list[i].endy = 60 + i * 30 + 30}this.ctx.drawImage('./static/' + this.two_list[i].zpcolor + '.png', 54, 60 + i * 30, 40,50); // 绘制图片  }for (var i = 0; i < this.three_list.length; i++) {this.three_list[i].x = 98this.three_list[i].starty = 60 + i * 30this.three_list[i].endx = 98 + 40if (i == this.three_list.length - 1) {this.three_list[i].endy = 60 + i * 30 + 50} else {this.three_list[i].endy = 60 + i * 30 + 30}this.ctx.drawImage('./static/' + this.three_list[i].zpcolor + '.png', 98, 60 + i * 30, 40,50); // 绘制图片  }for (var i = 0; i < this.four_list.length; i++) {this.four_list[i].x = 142this.four_list[i].starty = 60 + i * 30this.four_list[i].endx = 142 + 40if (i == this.four_list.length - 1) {this.four_list[i].endy = 60 + i * 30 + 50} else {this.four_list[i].endy = 60 + i * 30 + 30}this.ctx.drawImage('./static/' + this.four_list[i].zpcolor + '.png', 142, 60 + i * 30, 40,50); // 绘制图片  }for (var i = 0; i < this.five_list.length; i++) {this.five_list[i].x = 186this.five_list[i].starty = 60 + i * 30this.five_list[i].endx = 186 + 40if (i == this.five_list.length - 1) {this.five_list[i].endy = 60 + i * 30 + 50} else {this.five_list[i].endy = 60 + i * 30 + 30}this.ctx.drawImage('./static/' + this.five_list[i].zpcolor + '.png', 186, 60 + i * 30, 40,50); // 绘制图片  }for (var i = 0; i < this.six_list.length; i++) {this.six_list[i].x = 230this.six_list[i].starty = 60 + i * 30this.six_list[i].endx = 230 + 40if (i == this.six_list.length - 1) {this.six_list[i].endy = 60 + i * 30 + 50} else {this.six_list[i].endy = 60 + i * 30 + 30}this.ctx.drawImage('./static/' + this.six_list[i].zpcolor + '.png', 230, 60 + i * 30, 40,50); // 绘制图片  }for (var i = 0; i < this.seven_list.length; i++) {this.seven_list[i].x = 274this.seven_list[i].starty = 60 + i * 30this.seven_list[i].endx = 274 + 40if (i == this.seven_list.length - 1) {this.seven_list[i].endy = 60 + i * 30 + 50} else {this.seven_list[i].endy = 60 + i * 30 + 30}this.ctx.drawImage('./static/' + this.seven_list[i].zpcolor + '.png', 274, 60 + i * 30, 40,50); // 绘制图片  }for (var i = 0; i < this.eight_list.length; i++) {this.eight_list[i].x = 318this.eight_list[i].starty = 60 + i * 30this.eight_list[i].endx = 318 + 40if (i == this.eight_list.length - 1) {this.eight_list[i].endy = 60 + i * 30 + 50} else {this.eight_list[i].endy = 60 + i * 30 + 30}this.ctx.drawImage('./static/' + this.eight_list[i].zpcolor + '.png', 318, 60 + i * 30, 40,50); // 绘制图片  }this.ctx.draw()this.txstart()},//将数组打乱shuffle: function(array) {if (!Array.isArray(array)) {return array;}for (var i = array.length - 1; i > 0; i--) {var j = Math.floor(Math.random() * (i + 1));[array[i], array[j]] = [array[j], array[i]]}return array;},//制作牌面getcarbean: function(value, imgcolor, flower, hse) {var car = {value: value, // 大小，从1到13，A到K,16表示王hse: hse, //1b 2h 3m 4fzpcolor: imgcolor + value, // 花色b黑，h红,m花,f方 使用时../../static/b1.pngflower: flower, //1黑色 2红色firstmove: "",x: 0,y: 0,width: 40,height: 50}return car;},}};
</script><style scoped>.contentone {width: 100vw;height: 100vh;position: absolute;display: flex;justify-content: center;}.contenttwo {width: 100vw;height: 100vh;position: absolute;display: flex;justify-content: center;}.canvas_cla {width: 100vw;height: 100vh;}.top_linear {display: flex;flex-direction: row;justify-content: space-between;display: flex;flex-direction: row;height: 80rpx;}.top_mean_left {margin-left: 32rpx;}.top_mean_right {margin-right: 32rpx;}.top_mean_tv {color: #07a5a6;}.page_main {position: fixed;overflow: hidden;width: 100vw;height: 100vh;background-color: #efefef;}.zhezhao {position: fixed;top: 0;bottom: 0;width: 100vw;height: 100vh;display: flex;justify-content: center;align-items: center;background-color: rgba(0, 0, 0, 0.4);z-index: 9999;}.dialog_back {position: fixed;z-index: 12;top: 0;right: 0;left: 0;bottom: 0;background: rgba(0, 0, 0, 0.3);justify-content: center;align-items: center;display: flex;}.add_button_ef {margin-left: 32rpx;margin-right: 32rpx;padding-top: 30rpx;padding-bottom: 30rpx;width: 300rpx;border: solid 2rpx #efefef;color: #999;background: #efefef;font-size: 32rpx;border-radius: 10rpx;display: flex;align-items: center;justify-content: center;text-align: center;vertical-align: center;}.button_main_view {position: fixed;width: 100vw;bottom: 0;height: 80rpx;display: flex;flex-direction: row;justify-content: space-between;text-align: center;align-items: center;}.button_view {width: 25vw;height: 60rpx;display: flex;justify-content: center;align-items: center;text-align: center;border: #333 solid 2rpx;margin: 22rpx;}
</style>

还有bug 先记录一下。不喜勿喷