1.类似选座位那种功能 我的功能座位 不是html元素 而是 座位图片 都是图片
const onConfirm = () => {// const area_arr = selectedSeat.value.map((item) => {// return item.areaId;// });// const abc = isRepeat(area_arr);// if (!abc) {// Taro.showToast({// title: "请选择同一价格的座位,暂不支持跨区域选座~~",// icon: "none",// duration: 2000,// });// return;// }// phoneInputVisible.value = true;try {const area_arr = selectedSeat.value.map((item) => {return item.areaId;});const abc = isRepeat(area_arr);if (!abc) {Taro.showToast({title: "请选择同一价格的座位,暂不支持跨区域选座~~",icon: "none",duration: 2000,});return;}let result = selectedSeat.value.every(function (element, index, array) {console.log(element, "element");return checkSeat(element)})console.log(result, "result");// 开始计算是否留下空位 ------------ 结束if (!result) {// 如果 result 为falseTaro.showToast({title: "请不要留下空座位~~",icon: "none"})return}phoneInputVisible.value = true;return} catch (e) {console.log(e);}
};
// 检查每个座位是否会留下空位
const checkSeat = (element) => {console.log(element, "element");// 标准为 1.左右侧都必须保留 两格座位 + 最大顺延座位(也就是已选座位减去自身)// 2.靠墙和靠已售的座位一律直接通过const checkNum = 2 + selectedSeat.value.length - 1const gRowBasic = element.gRowconst gColBasic = element.gColconsole.log(checkNum, gRowBasic, gColBasic);let otherLoveSeatIndex = element.seatTypeif (otherLoveSeatIndex) {// 如果是情侣座 不检测return true}// 检查座位左侧let left = checkSeatDirection(gRowBasic, gColBasic, checkNum, '-')console.log(left);// 如果左侧已经检查出是靠着过道直接 返回trueif (left === 'special') {return true}// 检查座位右侧let right = checkSeatDirection(gRowBasic, gColBasic, checkNum, '+')console.log(right);if (right === 'special') {// 无论左侧是否是什么状态 检查出右侧靠着过道直接 返回truereturn true} else if (right === 'normal' && left === 'normal') {// 如果左右两侧都有富裕的座位 返回truereturn true} else if (right === 'fail' || left === 'fail') {// 如果左右两侧都是不通过检测 返回falsereturn false}return true
}
// 检查左右侧座位满足规则状态
const checkSeatDirection = (gRowBasic, gColBasic, checkNum, direction) => {// 空位个数let emptySeat = 0let x = 1 // 检查位置 只允许在x的位置出现过道,已售,维修for (let i = 1; i <= checkNum; i++) {let iter // 根据 gRow gCol direction 找出检查座位左边按顺序排列的checkNumif (direction === '-') {console.log('---');iter = seatList.value.find((el) => (el.gRow == gRowBasic && el.gCol == gColBasic - i))console.log(iter, "-");} else if (direction === '+') {console.log('+++');iter = seatList.value.find((el) => (el.gRow == gRowBasic && el.gCol == gColBasic + i))console.log(iter), "+";}if (x === i) {if (iter === undefined) {// 过道return 'special'}if (iter.nowIcon === iter.soldedIcon || iter.nowIcon === iter.fixIcon) {// 已售或者维修return 'special'}if (iter.nowIcon === iter.selectedIcon) {// 已选 顺延一位x++continue}} else {if (iter === undefined) {// 过道return 'fail'}if (iter.nowIcon === iter.soldedIcon ||iter.nowIcon === iter.fixIcon ||iter.nowIcon === iter.selectedIcon) {// 已售或者维修return 'fail'}}emptySeat++if (emptySeat >= 2) {return 'normal'}}
}分享一段代码 就是当我 选座不能留空的判断 逻辑 因为我这里都是图片 所有 根据图片判断的
2.如果大家有需求 需要源代码 可以先私信我 源代码整理中 未来会发布开源