<!-- eslint-disable no-empty -->
<template>
  <div class="el-dialog">
    <div class="bg-fff u-relative">
      <div
        class="u-fixed position-all"
        style="z-index: 999"
        v-if="!canXiadan"
        @click="xiadanClick"
      ></div>
      <div class="flex head row-between flex-y-center u-m-l-20">
        <div class="flex" style="width: 500px">
          <div class="u-font-16 color-333 font-bold" style="margin-right: 10px">
            {{ title }}
          </div>
          <div class="choose-user flex u-m-l-24">
            <el-button
              type="primary"
              v-if="vipUser.id === ''"
              @click="refChooseUserOpen"
              >选择用户</el-button
            >
            <template v-else>
              <div class="flex cur-pointer" @click="refChooseUserOpen">
                <img
                  v-if="vipUser.headImg && vipUser.headImg != 'null'"
                  class="headimg"
                  :src="vipUser.headImg"
                  alt=""
                />
                <div v-else class="headimg flex flex-x-y-center">
                  <i class="el-icon-user"></i>
                </div>
                <div>
                  <div class="u-flex">
                    <div class="ft-13 color-000">{{ vipUser.nickName }}</div>
                    <div class="vip" v-if="vipUser.isVip">
                      VIP{{ vipUser.isVip }}
                    </div>
                  </div>
                  <div style="margin-top: 2px" class="color-666 ft-12">
                    余额：{{ vipUser.amount }}
                  </div>
                </div>
              </div>
            </template>
          </div>
          <el-popover
            placement="right"
            width="333"
            trigger="click"
            v-model="tableShow"
          >
            <el-input
              placeholder="请输入内容"
              prefix-icon="el-icon-search"
              v-model="tableSearchText"
              @input="searchInput"
            >
            </el-input>
            <div style="max-height: 398px; overflow-y: scroll" class="u-m-t-12">
              <div
                class="u-flex u-row-between u-p-t-8 table-item u-p-b-8 u-p-r-30"
                v-for="(item, index) in tableList"
                :key="index"
                @click="changeTable(item, index)"
              >
                <span> {{ item.name }}</span>
                <span :style="{ color: returnTableColor(item.status) }">
                  {{
                    status[item.status] ? status[item.status].label : ""
                  }}</span
                >
              </div>
              <div
                class="color-999 u-p-30 u-text-center"
                v-if="!tableList.length"
              >
                无可用桌台
              </div>
            </div>
            <div class="tableId u-m-l-28" slot="reference">
              {{ table ? "桌台号：" + table.name : "选择桌号" }}
            </div>
          </el-popover>
          <!-- 先付后付start -->
          <!-- <el-dropdown @command="changePostPay">
              <el-button plain type="primary" size="mini">
                {{ payAfter ? "后付费" : "先付费" }}
                <i class="el-icon-caret-bottom"></i>
              </el-button>
              <el-dropdown-menu slot="dropdown">
                <el-dropdown-item :command="false">先付费</el-dropdown-item>
                <el-dropdown-item :command="true">后付费</el-dropdown-item>
              </el-dropdown-menu>
            </el-dropdown> -->

          <!-- <el-button plain type="primary" size="mini">
            {{ payAfter ? "后付费" : "先付费" }}
          </el-button> -->

          <!-- 先付后付end -->
          <span
            @click="toggleFullScreen"
            class="flex flex-xy-center cur-pointer full-screen"
          >
            <svg
              v-if="!isFullScreen"
              t="1724396447139"
              class="icon"
              viewBox="0 0 1024 1024"
              version="1.1"
              xmlns="http://www.w3.org/2000/svg"
              p-id="8943"
              width="128"
              height="128"
            >
              <path
                d="M358.4 768H426.666667v85.333333H213.333333v-213.333333h85.333334v68.266667l128-128 59.733333 59.733333-128 128z m345.6 0l-128-128 59.733333-59.733333 132.266667 132.266666V640h85.333333v213.333333h-213.333333v-85.333333h64zM358.4 298.666667l128 128-59.733333 59.733333-128-128V426.666667H213.333333V213.333333h213.333334v85.333334H358.4z m345.6 0H640V213.333333h213.333333v213.333334h-85.333333V354.133333l-132.266667 132.266667-59.733333-59.733333 128-128z"
                fill="#666666"
                p-id="8944"
              ></path>
            </svg>
            <svg
              v-else
              t="1724396479520"
              class="icon"
              viewBox="0 0 1024 1024"
              version="1.1"
              xmlns="http://www.w3.org/2000/svg"
              p-id="9141"
              width="128"
              height="128"
            >
              <path
                d="M298.666667 631.466667H226.133333v-81.066667h217.6v204.8h-85.333333v-68.266667l-128 128L170.666667 759.466667l128-128z m422.4 0l128 128-59.733334 59.733333-128-128v68.266667h-85.333333V554.666667h217.6v81.066666h-72.533333zM298.666667 341.333333L187.733333 230.4 243.2 170.666667l115.2 115.2V217.6h85.333333v204.8H226.133333V341.333333H298.666667z m430.933333 0h64v81.066667h-217.6V217.6h85.333333v72.533333L780.8 170.666667l59.733333 59.733333L729.6 341.333333z"
                fill="#666666"
                p-id="9142"
              ></path>
            </svg>
          </span>
        </div>

        <div class="flex flex-1">
          <div class="flex-1"></div>
          <div class="flex-1">
            <el-input
              v-model="goods.query.productId"
              size="small"
              clearable
              placeholder="请输入商品名称"
              style="width: 100%"
              class="filter-item"
              suffix-icon="el-icon-search"
            />
          </div>

          <!-- <div
            style="display: flex; justify-content: flex-end; margin-left: 10px"
          >
            <div style="width: 100px; margin-left: 20px">
              <el-select v-model="layout.sel" placeholder="请选择">
                <el-option
                  v-for="item in layout.list"
                  :key="item.value"
                  :label="item.label"
                  :value="item.value"
                  :disabled="item.disabled"
                >
                </el-option>
              </el-select>
            </div>
          </div> -->
        </div>
      </div>
      <div class="head-container search-box flex row-between" v-if="false">
        <div>
          <el-dropdown @command="changePostPay">
            <el-button plain type="primary" size="mini">
              {{ payAfter ? "后付费" : "先付费" }}
              <i class="el-icon-caret-bottom"></i>
            </el-button>
            <el-dropdown-menu slot="dropdown">
              <el-dropdown-item :command="false">先付费</el-dropdown-item>
              <el-dropdown-item :command="true">后付费</el-dropdown-item>
            </el-dropdown-menu>
          </el-dropdown>
        </div>

        <div class="flex">
          <div style="width: 300px">
            <el-input
              v-model="goods.query.productId"
              size="small"
              clearable
              placeholder="请输入商品名称"
              style="width: 100%"
              class="filter-item"
              suffix-icon="el-icon-search"
            />
            <!-- @keyup.enter.native="getGoods" -->
          </div>
          <div
            style="display: flex; justify-content: flex-end; margin-left: 10px"
          >
            <div style="width: 100px; margin-left: 20px">
              <el-select v-model="layout.sel" placeholder="请选择">
                <el-option
                  v-for="item in layout.list"
                  :key="item.value"
                  :label="item.label"
                  :value="item.value"
                  :disabled="item.disabled"
                >
                </el-option>
              </el-select>
            </div>
          </div>
        </div>
      </div>
      <div class="diancan" v-loading="loading">
        <div class="order">
          <div class="relative u-flex u-flex-col u-row-between">
            <div class="w-full" style="padding-right: 14px">
              <div class="u-m-l-20 u-p-b-10 meal_box">
                <el-button-group>
                  <el-button
                    :class="{ active: item.value == useTypes.sel }"
                    :disabled="order.old.list.length > 0 || item.disabled"
                    v-for="(item, index) in useTypes.list"
                    @click="changeUseType(item.value)"
                    :key="index"
                    >{{ item.name }}</el-button
                  >
                </el-button-group>
              </div>
              <div class="flex row-between table-list u-m-l-20">
                <!-- <div class="tableId" @click="chooseTableOpen"> -->

                <div class="u-flex">
                  <div class="u-p-r-14 border-r u-m-r-14">
                    <template v-if="!shopInfo.isTableFee && table.tableId">
                      <div
                        class="u-flex cur-pointer"
                        @click="
                          refToggle('refChooseDinersNumber', true, perpole)
                        "
                      >
                        <span>就餐人数：{{ perpole }}位</span>
                        <span
                          class="el-icon-arrow-right diningPeople_cell_arrow"
                        ></span>
                      </div>
                    </template>
                    <template v-else>
                      <div class="u-flex">
                        <span>就餐人数：-位</span>
                        <span
                          class="el-icon-arrow-right diningPeople_cell_arrow"
                        ></span>
                      </div>
                    </template>
                  </div>
                  <el-button
                    @click="clearCart"
                    type="text"
                    size="mini"
                    :disabled="order.list.length <= 0"
                    >清空</el-button
                  >
                </div>
              </div>
            </div>

            <div
              class="order-list-all u-p-l-20"
              style="flex: 1; overflow-y: scroll"
            >
              <div class="list">
                <!-- 当前购物车列表 -->
                <template v-if="order.list.length">
                  <cart-item
                    :isShowVipPrice="isShowVipPrice"
                    @itemClick="changeOrderSel"
                    @changeOrderNumber="changeOrderNumber"
                    @cartGoodsNumberInput="cartGoodsNumberInput"
                    @cartGoodsNumberChange="cartGoodsNumberChange"
                    @editNote="refNoteShow(true)"
                    v-for="(item, index) in order.list"
                    :key="index"
                    :index="index"
                    :item="item"
                    :selPlaceNum="order.selPlaceNum"
                    :selIndex="order.selIndex"
                  ></cart-item>
                </template>
                <div v-if="!order.list.length">
                  <el-empty
                    :image-size="50"
                    description="点餐列表为空"
                  ></el-empty>
                </div>
                <!-- 优惠菜品 -->
                <div v-if="order.gift.list.length">
                  <div class="carts_list_title">以下是优惠菜品</div>
                  <template v-if="order.gift.list.length">
                    <cart-item
                      @itemClick="changeOrderSel"
                      @changeOrderNumber="changeOrderNumber"
                      @cartGoodsNumberInput="cartGoodsNumberInput"
                      @cartGoodsNumberChange="cartGoodsNumberChange"
                      v-for="(item, index) in order.gift.list"
                      :key="index"
                      :index="index"
                      :item="item"
                      :selPlaceNum="order.selPlaceNum"
                      :selIndex="order.selIndex"
                    ></cart-item>
                  </template>
                </div>
              </div>
              <!-- 已下单菜品列表 -->
              <template v-if="order.old.list.length">
                <!-- <div class="carts_list_title">已下单菜品</div> -->
                <div
                  class="list"
                  v-for="(orderItem, orderIndex) in order.old.list"
                  :key="orderIndex"
                >
                  <div class="carts_list_title">
                    第{{ orderItem.placeNum }}次下单
                  </div>
                  <cart-item
                    :isShowVipPrice="isShowVipPrice"
                    @itemClick="changeOrderOldSel"
                    :canChangeNumber="false"
                    v-for="(item, index) in orderItem.info"
                    :key="index"
                    :index="index"
                    :item="item"
                    isOld
                    :selIndex="order.old.selIndex"
                    :placeNum="orderItem.placeNum"
                    :selPlaceNum="order.selPlaceNum"
                  ></cart-item>
                </div>
              </template>
              <!-- 餐位费 -->
              <template v-if="order.seatFee && order.seatFee.totalAmount > 0">
                <div class="list">
                  <div class="carts_list_title">餐位费</div>
                  <cart-item
                    @itemClick="changeOrderExtraSel"
                    :canChangeNumber="false"
                    key="seatFee"
                    :index="0"
                    :item="order.seatFee"
                    isSeatFee
                    :selIndex="order.extra.selIndex"
                    :placeNum="-10"
                    :selPlaceNum="order.selPlaceNum"
                  ></cart-item>
                </div>
              </template>
              <!-- 打包费 -->
              <template v-if="allPackMoney > 0">
                <div class="list">
                  <div class="carts_list_title">打包费</div>
                  <cart-item
                    @itemClick="changeOrderExtraSel"
                    :canChangeNumber="false"
                    key="seatFee"
                    :index="0"
                    :item="order.packFee"
                    isSeatFee
                    :selIndex="order.extra.selIndex"
                    :placeNum="-10"
                    :selPlaceNum="order.selPlaceNum"
                  ></cart-item>
                </div>
              </template>

              <div class="order_remark" v-if="note.content">
                订单备注： {{ note.content }}
              </div>
            </div>

            <div class="w-full bottom">
              <div class="border-top">
                <div class="flex row-right youhui" v-if="youhuiAllPrice > 0">
                  <el-tooltip
                    placement="top"
                    effect="light"
                    popper-class="youhui-tips"
                    :popper-options="{
                      'background-color': '#fff',
                    }"
                  >
                    <div slot="content">
                      <div
                        class="u-flex color-000 u-font-14 u-row-between"
                        v-if="vipDiscountPrice > 0"
                      >
                        <span class="font-bold">会员优惠 </span>
                        <span class="">{{ vipDiscountPrice }} </span>
                      </div>
                    </div>
                    <span> 已优惠￥{{ youhuiAllPrice }} </span>
                    <i class="el-icon-arrow-right"></i>
                  </el-tooltip>
                </div>

                <div class="flex row-between">
                  <el-button type="text" @click="printOrder"
                    >打印制作单</el-button
                  >
                  <!-- <span v-if="youhuiAllPrice>0" class="youhuiAllPrice">已优惠：{{youhuiAllPrice}} ></span> -->
                  <!-- <el-checkbox
                    v-model="order.allPack"
                    :disabled="!this.order.list.length"
                    >打包</el-checkbox
                  > -->
                  <div class="flex">
                    <span class="color-666" style="margin-right: 5px"
                      >共{{ allNumber }}件</span
                    >
                    <span class="color-000 ft-18">￥{{ allPrice }} </span>
                  </div>
                </div>

                <div class="flex mt-14">
                  <template v-if="table">
                    <template v-if="!payAfter">
                      <template
                        v-if="
                          payAfter && isCreateOrder && table && table.tableId
                        "
                      >
                        <!-- <template v-if="false"> -->
                        <button
                          class="my-btn flex-1 default"
                          @click="createOrderClose"
                        >
                          <span>点菜/返回</span>
                        </button>
                      </template>
                      <template v-else>
                        <template v-if="key != 'isJieZhang'">
                          <button
                            class="my-btn flex-1 primary"
                            @click="scanPayClick"
                          >
                            <span>微信/支付宝</span>
                          </button>
                          <div style="width: 15px"></div>
                          <button
                            class="my-btn flex-1 primary"
                            @click="cashPayClick"
                          >
                            <span>现金</span>
                          </button>
                          <div style="width: 15px"></div>
                          <button
                            class="my-btn flex-1 default"
                            @click="morePayClick"
                          >
                            <span>更多支付</span>
                          </button>
                        </template>
                      </template>
                    </template>
                    <template v-else>
                      <template v-if="isCreateOrder">
                        <button
                          class="my-btn flex-1 default"
                          @click="createOrderClose"
                        >
                          <span>加菜/返回</span>
                        </button>
                        <div style="width: 15px"></div>
                        <button class="my-btn flex-1 primary" @click="payOrder">
                          <span>立即支付</span>
                        </button>
                      </template>
                      <template v-else>
                        <template v-if="payAfter">
                          <div class="flex-1">
                            <el-button
                              type="primary"
                              size="medium"
                              :disabled="!order.list.length"
                              @click="toCreateOrderDebounce(false)"
                            >
                              仅下单
                            </el-button>
                          </div>
                          <div style="width: 15px"></div>
                        </template>
                        <div class="flex-1">
                          <el-button
                            size="medium"
                            :disabled="
                              !order.list.length && !order.old.list.length
                            "
                            @click="toCreateOrderDebounce(true)"
                          >
                            去结账
                          </el-button>
                        </div>
                      </template>
                    </template>
                  </template>
                  <template v-else>
                    <button class="my-btn flex-1 primary" @click="scanPayClick">
                      <span>微信/支付宝</span>
                    </button>
                    <div style="width: 15px"></div>
                    <button class="my-btn flex-1 primary" @click="cashPayClick">
                      <span>现金</span>
                    </button>
                    <div style="width: 15px"></div>
                    <button class="my-btn flex-1 default" @click="morePayClick">
                      <span>更多支付</span>
                    </button>
                  </template>
                </div>
              </div>
            </div>
          </div>

          <div class="controls">
            <div
              class="numberbox"
              :class="{ 'cur-pointer': order.old.selIndex < 0 }"
            >
              <div class="reduce" @click="changeOrderGoodsNumber('-')">-</div>
              <div class="input relative">
                <div
                  class="disabled-box"
                  v-if="order.selIndex >= 0"
                  @click="changeKeyboradShow(true)"
                ></div>
                <!-- <input type="number" :disabled="order.selIndex<0" v-model="order.number" /> -->
                <input
                  type="number"
                  disabled
                  v-model="order.number"
                  style="display: none"
                />
                <input type="number" disabled v-model="order.cacheNumber" />
              </div>
              <div class="add" @click="changeOrderGoodsNumber()">+</div>
            </div>
            <!-- <div class="btn" v-for="(item, index) in order.btns" :key="index" :class="{ disabled: item.disabled }" @click="orderBtnsClick(index,item)">
                {{ item.text }}
              </div> -->
            <div
              class="btn"
              :class="{ disabled: !isSku }"
              @click="orderBtnsClick('sku')"
            >
              规格
            </div>
            <div
              class="btn"
              :class="{ disabled: order.selIndex < 0 }"
              @click="orderBtnsClick('gift')"
            >
              {{ returnGiftText }}
            </div>
            <div
              class="btn"
              :class="{ disabled: order.selIndex < 0 }"
              @click="orderBtnsClick('pack')"
            >
              {{ returnPackText }}
            </div>
            <div
              class="btn"
              :class="{ disabled: order.selIndex < 0 }"
              @click="orderBtnsClick('del')"
            >
              删除
            </div>

            <div
              class="btn"
              :class="{ disabled: !order.list.length || order.old.list.length }"
              @click="saveOrder"
            >
              存单
            </div>
            <div
              class="btn relative"
              :class="{
                disabled: !prveOrder.list.length || order.old.list.length,
              }"
              @click="cacheOrderShow"
            >
              取单
              <span class="prve-car-len" v-if="prveOrder.list.length">{{
                prveOrder.list.length
              }}</span>
            </div>

            <!-- <div
                class="btn"
                :class="{ disabled: !order.list.length }"
                @click="orderBtnsClick('save')"
              >
                存单
              </div>
  
              <div
                class="btn relative"
                :class="{ disabled: !prveOrder.list.length }"
                @click="orderBtnsClick('getOrder')"
              >
                取单
                <span class="prve-car-len" v-if="prveOrder.list.length">{{
                  prveOrder.list.length
                }}</span>
              </div> -->
            <div
              class="btn"
              :class="{ disabled: order.selIndex < 0 && key != 'isJieZhang' }"
              @click="refNoteShow(true)"
            >
              单品备注
            </div>

            <div class="btn" @click="refNoteShow(false)">整单备注</div>
            <div
              class="btn"
              :class="{
                disabled: disableTuicai,
              }"
              @click="orderBtnsClick('returnCart')"
            >
              退菜
            </div>
            <!-- <div
              class="btn"
            >
              单品改价
            </div>
            <div
              class="btn"
            >
              等叫
            </div>
            <div
              class="btn no-wrap u-font-12"
            >
              取消全部等叫
            </div> -->

            <!-- <div
                class="btn"
                :class="{ disabled: order.old.list.length <= 0 }"
                @click="orderBtnsClick('returnCart')"
              >
                撤单
              </div> -->
          </div>
        </div>
        <div
          class="goods"
          v-infinite-scroll="loadMoreGoods"
          infinite-scroll-distance="40"
        >
          <template v-if="!isCreateOrder">
            <div class="flex categoty u-col-center">
              <div
                class="show_more_btn"
                :class="{ showAll: category.showAll }"
                @click="toggleShowAll"
              >
                <div class="flex">
                  <div class="flex showmore">
                    <i class="el-icon-caret-bottom color-fff"></i>
                  </div>
                  <span>{{ category.showAll ? "收起" : "展开" }}</span>
                </div>
              </div>
              <div
                class="flex categorys"
                :class="{ 'flex-wrap': category.showAll }"
              >
                <div
                  v-for="(item, index) in category.list"
                  :key="index"
                  @click="changeCategoryId(item)"
                >
                  <el-tag
                    size="medium"
                    type="primary"
                    effect="dark"
                    v-if="goods.query.categoryId === item.id"
                    >{{ item.name }}</el-tag
                  >
                  <el-tag size="medium" type="info" v-else effect="plain">{{
                    item.name
                  }}</el-tag>
                </div>
              </div>
            </div>
            <div
              class="no-search-result"
              v-if="search.list.length <= 0 && goods.query.productId !== ''"
            >
              未找到相关商品
            </div>
            <template v-if="goods.list.length">
              <div class="goods-list">
                <!-- <div
                  @click="lingshicaiShow"
                  class="goods-item lingshicai text-center color-999"
                  :class="{
                    'layout-img-and-text': layout.sel === 'img-and-text',
                    'layout-text': layout.sel === 'text',
                  }"
                >
                  <span class="el-icon-plus" style="font-size: 26px"></span>
                  <div class="u-m-t-10">临时菜</div>
                </div> -->
                <div
                  class="goods-item"
                  :class="{
                    'sell-out':
                      item.isPauseSale ||
                      (item.typeEnum !== 'sku' && item.stockNumber <= 0),
                    'layout-img-and-text': layout.sel === 'img-and-text',
                    'layout-text': layout.sel === 'text',
                    none:
                      (goods.query.categoryId !== '') &
                      (goods.query.categoryId != item.categoryId),
                  }"
                  @click="goodsClick(item)"
                  v-for="(item, index) in goods.list"
                  :key="index"
                >
                  <div class="flex img-box" v-if="layout.sel !== 'text'">
                    <el-image
                      :src="item.coverImg"
                      scroll-container="goods"
                      class="goods-img"
                    ></el-image>
                    <template v-if="layout.sel === 'img-and-text'">
                      <div class="sell-out-svg" v-if="isSellOut(item)">
                        <svg
                          t="1724234807994"
                          class="icon"
                          viewBox="0 0 1024 1024"
                          version="1.1"
                          xmlns="http://www.w3.org/2000/svg"
                          p-id="4356"
                          width="64"
                          height="64"
                        >
                          <path
                            d="M498.61856 0h25.483584c136.270651 3.58203 270.187397 63.197242 362.296737 163.954625 84.894108 90.267153 133.046824 212.209685 137.038229 335.687372v22.873819c-3.684374 123.83589-51.785918 246.341312-136.884714 336.915497-91.955824 100.450352-225.258508 159.96322-361.119784 164.005797h-25.739443c-140.722603-3.684374-278.681925-67.342162-371.047124-173.72845C46.87342 758.366898 2.76328 636.936085 0 514.942382v-10.74609C3.837889 381.435011 49.534356 259.697167 132.944481 168.867123 225.05382 65.499975 360.556894 4.042577 498.61856 0M435.574834 52.195293c-183.860477 28.042177-340.702214 177.463995-378.160012 359.584628-31.828894 141.49018 7.317575 296.643246 103.264804 405.536955a465.152166 465.152166 0 0 0 689.489581 14.328119c89.857778-93.951527 136.52651-226.896007 125.678077-356.463145-9.415621-133.149168-80.339813-259.953026-188.056569-338.757683-99.580431-74.19919-229.761631-105.004647-352.215881-84.280046z"
                            fill="#ffffff"
                            p-id="4357"
                          ></path>
                          <path
                            d="M423.088901 64.732397c118.974564-23.794913 247.006546 1.995702 346.535805 71.43591 104.390585 71.231223 176.798761 187.647194 193.224927 313.069412a455.941232 455.941232 0 0 1-79.623407 326.169407c-71.384738 101.422618-185.958523 171.52806-309.078008 187.596022a454.661936 454.661936 0 0 1-325.964719-79.98161c-101.115586-71.43591-170.913997-185.805007-187.033132-308.61746a455.787717 455.787717 0 0 1 361.938534-509.671681m20.67343 12.12773c-162.112438 23.590225-304.063165 146.402679-351.448304 303.142072-41.449203 130.1812-17.705462 279.142472 63.197242 389.41782 75.376143 105.516366 199.365549 174.496027 329.035031 181.4554 126.394483 8.801559 255.194043-41.091 342.902603-132.535106a439.719754 439.719754 0 0 0 123.733547-324.736595c-4.247264-130.744091-71.384738-257.240917-176.440558-334.766279-93.337464-70.514817-215.535855-100.39918-330.979561-81.977312z"
                            fill="#ffffff"
                            p-id="4358"
                          ></path>
                          <path
                            d="M630.488431 283.594423c31.214832-15.351557 62.583179-30.498426 93.183949-47.078107 9.876168 14.788666 18.575384 37.048423 39.504673 21.850382l9.978511 19.649993c-17.961321 7.16406-35.462096 21.287492-55.777322 18.166009a306.110039 306.110039 0 0 1-18.933587-20.008196l-20.212882 10.49023c7.266403 28.809755-15.70976 47.845685-37.867174 60.587477a33.875768 33.875768 0 0 1 1.535156-34.541002c-3.889061-9.722653-7.675778-19.445305-11.411324-29.116786z m-66.421068 37.611314l56.442557-27.888661 10.439058 20.98046c-20.980461 11.155464-46.05467 18.063665-60.382789 38.430064 20.67343 1.023437 38.174204-10.592574 56.084353-19.189446l11.667183 18.575384c-44.519514 21.338664-87.657388 45.747639-133.149168 64.732397l-10.132027-18.268353c14.07226-12.792964 55.777322-12.639448 45.338264-39.095297-20.980461 10.234371-42.012093 20.622258-63.14607 30.754285l-9.722652-20.980461c19.957024-9.876168 39.914047-19.85468 59.922242-29.679676a969.757833 969.757833 0 0 0-5.935935-14.32812c11.667183-5.628904 23.283194-11.411324 34.950377-17.040227l7.624607 12.997651z m85.252311 30.191395c42.216781-20.826945 84.12653-42.012093 126.496827-62.58318 12.844136 25.688271 2.967968 53.474589-7.16406 78.088252 19.138274-1.791015 45.23592-19.85468 55.41912 5.628904-23.9996 9.978512-49.483184 14.942182-74.250363 22.413273-21.492179 15.249213-40.937484 33.261706-63.862475 46.668732-16.221478-23.897257 16.426166-33.875768 29.52616-48.050373-15.812103-5.577732-31.573035-11.30898-47.282794-17.244915 12.946479-6.549998 25.841787-13.099995 38.89061-19.547649 10.592574 3.121483 21.185148 6.294138 31.828894 9.159763 2.712108-12.792964 5.475389-25.483584 8.392184-38.225377-29.577332 14.225776-58.898806 29.065614-88.373794 43.444906-2.405077-4.96367-7.16406-14.839838-9.620309-19.752336z m-139.033931 76.757783c44.007796-22.003898 88.169107-43.751936 132.228074-65.755834 7.675778 22.669132 35.820299 49.841387 17.500775 72.664034-27.376943 18.217181-58.540603 29.679676-87.248014 45.594124a123.631203 123.631203 0 0 1-27.376942 50.557793 249.360452 249.360452 0 0 0-35.103893-103.060117m92.211683-20.315227c4.093748 9.057418 8.238669 18.063665 12.281246 27.121084l20.724601-12.12773-9.876168-24.869522-23.129679 9.876168m-51.837089 26.404678l10.746089 24.408975 24.460147-8.443356c-4.503123-8.852731-8.903903-17.858978-13.304682-26.814053l-21.901554 10.848434z"
                            fill="#ffffff"
                            p-id="4359"
                          ></path>
                          <path
                            d="M638.010694 474.107241c53.883964-26.76288 107.767928-53.525761 161.703063-80.186298l11.56484 23.43671c-30.856629 15.351557-61.662086 30.703113-92.518715 45.901155l9.057418 18.677727c40.476938-19.957024 80.80036-40.323422 121.379642-60.075758 2.76328 5.833592 8.494528 17.603118 11.411323 23.436709-40.221078 20.008195-80.442157 40.016391-120.765578 59.871071l10.336714 24.511319c18.319524-11.30898 57.824197-14.174604 49.6367-43.29139 13.407026-6.805857 26.916396-13.458198 40.476938-20.008195 5.577732 15.249213 16.784369 36.997252-2.149218 48.050372-69.082005 39.402329-142.411274 71.333567-213.130778 107.870271l-19.547649-39.402328c12.895308-6.652341 25.841787-13.202339 38.737095-19.803508 2.916796 3.633202 8.648044 11.001949 11.411323 14.686322 17.0914-8.443356 34.131628-16.886712 51.2742-25.227725l-10.694918-24.408975c-41.551547 18.063665-81.414422 39.760532-122.300735 59.410525a2827.0915 2827.0915 0 0 1-11.616011-23.334366c40.27225-20.366398 81.056219-39.862875 121.174954-60.689821l-9.313278-17.910149c-40.52811 14.839838-72.305832 43.700765-106.028084 69.286692-1.791015-4.503123-5.475389-13.458198-7.266404-18.063665 13.969917-15.146869 27.376943-31.16366 30.191395-52.502324 10.74609-5.935935 21.594523-11.769527 32.442956-17.705462l14.532807 7.471091z m-311.124881-22.720304l87.452701-43.496077 12.895307 25.995303c-29.372645 14.635151-58.796462 29.065614-88.169107 43.905452l9.722653 16.784368a12302.737494 12302.737494 0 0 1 77.115986-38.430063l12.997651 25.841787c-26.302334 12.946479-52.604667 25.944131-78.446454 39.760531 2.405077 4.093748 7.266403 12.12773 9.722653 16.119135 25.6371-12.946479 51.478887-25.688271 77.269501-38.430064 4.196092 8.699215 8.443356 17.398431 12.741792 25.995303a20601.789016 20601.789016 0 0 0-77.78122 38.634751l8.852731 17.296087c30.34491-15.351557 60.740992-30.34491 91.188246-45.389436l13.458198 27.172256c-83.103093 41.398031-166.30853 82.386687-249.360451 123.887062-15.198041-29.884364-29.986707-59.973415-44.826546-90.113638l-25.125381 24.25546-12.792964-26.507021c18.370696-29.423817 24.255459-64.169507 19.803508-98.403479 14.532807-7.266403 29.167958-14.430463 43.803109-21.696866l4.503123 23.948428 46.412873-23.027335-8.903903-18.728899c15.965619-7.982809 31.931238-15.863275 47.948029-23.794913 2.302733 4.605467 7.061716 13.765229 9.517965 18.421868m-99.478087 84.228874l8.801559 14.839838c21.696867-11.001949 43.496077-21.696867 65.141772-32.749987l-8.852731-12.281245c-23.794913 1.023437-44.365999 19.138274-65.0906 30.191394m19.189446 42.370297l13.407026 13.355854c21.338664-8.085153 41.295687-19.547649 61.662086-29.884364-2.353905-4.093748-6.9082-12.485933-9.210934-16.682025-22.003898 10.950777-44.110139 21.79921-65.858178 33.210535m23.334366 41.909749l8.648043 17.142572c21.185148-10.49023 42.370296-20.929289 63.657788-31.317176l-7.675778-17.910149c-21.492179 10.643746-43.137874 21.338664-64.630053 32.084753z m-16.221479 82.079656c78.548798-39.248813 157.302284-78.03708 235.902254-117.285892 11.87187 29.014442 48.306232 70.924192 13.765229 97.226525-67.035131 38.788266-138.624556 69.696067-207.501874 105.311679l-42.165609-85.252312m59.973415 3.479687c4.912498 11.564839 10.132027 23.027335 15.351557 34.48983 47.078107-25.074209 97.482385-44.212483 141.950727-73.994503-5.117186-10.183199-9.92734-20.468742-14.583979-30.805457-47.640997 23.43671-94.770276 47.692169-142.769477 70.31013z"
                            fill="#ffffff"
                            p-id="4360"
                          ></path>
                        </svg>
                      </div>
                    </template>
                  </div>
                  <div class="typeEnum">
                    <span>{{ item | returntypeName }}</span>
                  </div>
                  <div class="info">
                    <div class="name">{{ item.name }}</div>
                    <div>
                      <template v-if="layout.sel === 'text'">
                        <div class="text-sell-out flex">
                          <svg
                            v-if="isSellOut(item)"
                            t="1724236049267"
                            class="icon"
                            viewBox="0 0 1024 1024"
                            version="1.1"
                            xmlns="http://www.w3.org/2000/svg"
                            p-id="4911"
                            width="64"
                            height="64"
                          >
                            <path
                              d="M498.61856 0h25.483584c136.270651 3.58203 270.187397 63.197242 362.296737 163.954625 84.894108 90.267153 133.046824 212.209685 137.038229 335.687372v22.873819c-3.684374 123.83589-51.785918 246.341312-136.884714 336.915497-91.955824 100.450352-225.258508 159.96322-361.119784 164.005797h-25.739443c-140.722603-3.684374-278.681925-67.342162-371.047124-173.72845C46.87342 758.366898 2.76328 636.936085 0 514.942382v-10.74609C3.837889 381.435011 49.534356 259.697167 132.944481 168.867123 225.05382 65.499975 360.556894 4.042577 498.61856 0M435.574834 52.195293c-183.860477 28.042177-340.702214 177.463995-378.160012 359.584628-31.828894 141.49018 7.317575 296.643246 103.264804 405.536955a465.152166 465.152166 0 0 0 689.489581 14.328119c89.857778-93.951527 136.52651-226.896007 125.678077-356.463145-9.415621-133.149168-80.339813-259.953026-188.056569-338.757683-99.580431-74.19919-229.761631-105.004647-352.215881-84.280046z"
                              fill="#c8c8c8"
                              p-id="4912"
                            ></path>
                            <path
                              d="M423.088901 64.732397c118.974564-23.794913 247.006546 1.995702 346.535805 71.43591 104.390585 71.231223 176.798761 187.647194 193.224927 313.069412a455.941232 455.941232 0 0 1-79.623407 326.169407c-71.384738 101.422618-185.958523 171.52806-309.078008 187.596022a454.661936 454.661936 0 0 1-325.964719-79.98161c-101.115586-71.43591-170.913997-185.805007-187.033132-308.61746a455.787717 455.787717 0 0 1 361.938534-509.671681m20.67343 12.12773c-162.112438 23.590225-304.063165 146.402679-351.448304 303.142072-41.449203 130.1812-17.705462 279.142472 63.197242 389.41782 75.376143 105.516366 199.365549 174.496027 329.035031 181.4554 126.394483 8.801559 255.194043-41.091 342.902603-132.535106a439.719754 439.719754 0 0 0 123.733547-324.736595c-4.247264-130.744091-71.384738-257.240917-176.440558-334.766279-93.337464-70.514817-215.535855-100.39918-330.979561-81.977312z"
                              fill="#c8c8c8"
                              p-id="4913"
                            ></path>
                            <path
                              d="M630.488431 283.594423c31.214832-15.351557 62.583179-30.498426 93.183949-47.078107 9.876168 14.788666 18.575384 37.048423 39.504673 21.850382l9.978511 19.649993c-17.961321 7.16406-35.462096 21.287492-55.777322 18.166009a306.110039 306.110039 0 0 1-18.933587-20.008196l-20.212882 10.49023c7.266403 28.809755-15.70976 47.845685-37.867174 60.587477a33.875768 33.875768 0 0 1 1.535156-34.541002c-3.889061-9.722653-7.675778-19.445305-11.411324-29.116786z m-66.421068 37.611314l56.442557-27.888661 10.439058 20.98046c-20.980461 11.155464-46.05467 18.063665-60.382789 38.430064 20.67343 1.023437 38.174204-10.592574 56.084353-19.189446l11.667183 18.575384c-44.519514 21.338664-87.657388 45.747639-133.149168 64.732397l-10.132027-18.268353c14.07226-12.792964 55.777322-12.639448 45.338264-39.095297-20.980461 10.234371-42.012093 20.622258-63.14607 30.754285l-9.722652-20.980461c19.957024-9.876168 39.914047-19.85468 59.922242-29.679676a969.757833 969.757833 0 0 0-5.935935-14.32812c11.667183-5.628904 23.283194-11.411324 34.950377-17.040227l7.624607 12.997651z m85.252311 30.191395c42.216781-20.826945 84.12653-42.012093 126.496827-62.58318 12.844136 25.688271 2.967968 53.474589-7.16406 78.088252 19.138274-1.791015 45.23592-19.85468 55.41912 5.628904-23.9996 9.978512-49.483184 14.942182-74.250363 22.413273-21.492179 15.249213-40.937484 33.261706-63.862475 46.668732-16.221478-23.897257 16.426166-33.875768 29.52616-48.050373-15.812103-5.577732-31.573035-11.30898-47.282794-17.244915 12.946479-6.549998 25.841787-13.099995 38.89061-19.547649 10.592574 3.121483 21.185148 6.294138 31.828894 9.159763 2.712108-12.792964 5.475389-25.483584 8.392184-38.225377-29.577332 14.225776-58.898806 29.065614-88.373794 43.444906-2.405077-4.96367-7.16406-14.839838-9.620309-19.752336z m-139.033931 76.757783c44.007796-22.003898 88.169107-43.751936 132.228074-65.755834 7.675778 22.669132 35.820299 49.841387 17.500775 72.664034-27.376943 18.217181-58.540603 29.679676-87.248014 45.594124a123.631203 123.631203 0 0 1-27.376942 50.557793 249.360452 249.360452 0 0 0-35.103893-103.060117m92.211683-20.315227c4.093748 9.057418 8.238669 18.063665 12.281246 27.121084l20.724601-12.12773-9.876168-24.869522-23.129679 9.876168m-51.837089 26.404678l10.746089 24.408975 24.460147-8.443356c-4.503123-8.852731-8.903903-17.858978-13.304682-26.814053l-21.901554 10.848434z"
                              fill="#c8c8c8"
                              p-id="4914"
                            ></path>
                            <path
                              d="M638.010694 474.107241c53.883964-26.76288 107.767928-53.525761 161.703063-80.186298l11.56484 23.43671c-30.856629 15.351557-61.662086 30.703113-92.518715 45.901155l9.057418 18.677727c40.476938-19.957024 80.80036-40.323422 121.379642-60.075758 2.76328 5.833592 8.494528 17.603118 11.411323 23.436709-40.221078 20.008195-80.442157 40.016391-120.765578 59.871071l10.336714 24.511319c18.319524-11.30898 57.824197-14.174604 49.6367-43.29139 13.407026-6.805857 26.916396-13.458198 40.476938-20.008195 5.577732 15.249213 16.784369 36.997252-2.149218 48.050372-69.082005 39.402329-142.411274 71.333567-213.130778 107.870271l-19.547649-39.402328c12.895308-6.652341 25.841787-13.202339 38.737095-19.803508 2.916796 3.633202 8.648044 11.001949 11.411323 14.686322 17.0914-8.443356 34.131628-16.886712 51.2742-25.227725l-10.694918-24.408975c-41.551547 18.063665-81.414422 39.760532-122.300735 59.410525a2827.0915 2827.0915 0 0 1-11.616011-23.334366c40.27225-20.366398 81.056219-39.862875 121.174954-60.689821l-9.313278-17.910149c-40.52811 14.839838-72.305832 43.700765-106.028084 69.286692-1.791015-4.503123-5.475389-13.458198-7.266404-18.063665 13.969917-15.146869 27.376943-31.16366 30.191395-52.502324 10.74609-5.935935 21.594523-11.769527 32.442956-17.705462l14.532807 7.471091z m-311.124881-22.720304l87.452701-43.496077 12.895307 25.995303c-29.372645 14.635151-58.796462 29.065614-88.169107 43.905452l9.722653 16.784368a12302.737494 12302.737494 0 0 1 77.115986-38.430063l12.997651 25.841787c-26.302334 12.946479-52.604667 25.944131-78.446454 39.760531 2.405077 4.093748 7.266403 12.12773 9.722653 16.119135 25.6371-12.946479 51.478887-25.688271 77.269501-38.430064 4.196092 8.699215 8.443356 17.398431 12.741792 25.995303a20601.789016 20601.789016 0 0 0-77.78122 38.634751l8.852731 17.296087c30.34491-15.351557 60.740992-30.34491 91.188246-45.389436l13.458198 27.172256c-83.103093 41.398031-166.30853 82.386687-249.360451 123.887062-15.198041-29.884364-29.986707-59.973415-44.826546-90.113638l-25.125381 24.25546-12.792964-26.507021c18.370696-29.423817 24.255459-64.169507 19.803508-98.403479 14.532807-7.266403 29.167958-14.430463 43.803109-21.696866l4.503123 23.948428 46.412873-23.027335-8.903903-18.728899c15.965619-7.982809 31.931238-15.863275 47.948029-23.794913 2.302733 4.605467 7.061716 13.765229 9.517965 18.421868m-99.478087 84.228874l8.801559 14.839838c21.696867-11.001949 43.496077-21.696867 65.141772-32.749987l-8.852731-12.281245c-23.794913 1.023437-44.365999 19.138274-65.0906 30.191394m19.189446 42.370297l13.407026 13.355854c21.338664-8.085153 41.295687-19.547649 61.662086-29.884364-2.353905-4.093748-6.9082-12.485933-9.210934-16.682025-22.003898 10.950777-44.110139 21.79921-65.858178 33.210535m23.334366 41.909749l8.648043 17.142572c21.185148-10.49023 42.370296-20.929289 63.657788-31.317176l-7.675778-17.910149c-21.492179 10.643746-43.137874 21.338664-64.630053 32.084753z m-16.221479 82.079656c78.548798-39.248813 157.302284-78.03708 235.902254-117.285892 11.87187 29.014442 48.306232 70.924192 13.765229 97.226525-67.035131 38.788266-138.624556 69.696067-207.501874 105.311679l-42.165609-85.252312m59.973415 3.479687c4.912498 11.564839 10.132027 23.027335 15.351557 34.48983 47.078107-25.074209 97.482385-44.212483 141.950727-73.994503-5.117186-10.183199-9.92734-20.468742-14.583979-30.805457-47.640997 23.43671-94.770276 47.692169-142.769477 70.31013z"
                              fill="#c8c8c8"
                              p-id="4915"
                            ></path>
                          </svg>
                        </div>
                      </template>
                      <div class="stockNumber"></div>
                      <div class="">￥{{ item.lowPrice }}</div>
                      <template v-if="layout.sel === 'default'">
                        <div class="flex" v-if="isSellOut(item)">
                          <div class="timeSale">售罄</div>
                        </div>
                      </template>
                    </div>
                  </div>
                </div>
              </div>
              <div class="u-m-t-20 color-999 text-center">
                {{ goods.status == "end" ? "没有更多了" : "加载中" }}
              </div>
            </template>
            <div
              class="no-search-result"
              v-if="goods.list.length <= 0 && goods.query.productId === ''"
            >
              未找到相关商品
            </div>
          </template>

          <template v-else>
            <div class="cashier_box goods_classify_list">
              <div class="cashier_left">
                <!-- <div class="title">选择优惠</div> -->
                <div class="detail_box">
                  <div class="usercard" @click="refChooseUserOpen">
                    <span
                      class="el-avatar el-avatar--square"
                      style="height: 50px; width: 50px; line-height: 50px"
                      ><img
                        v-if="vipUser.id && vipUser.headImg != 'null'"
                        :src="vipUser.headImg"
                    /></span>
                    <div class="info">
                      <div class="nickname">
                        <span class="txt">{{
                          vipUser.id ? vipUser.nickName : "服务员下单"
                        }}</span>
                        <span class="vip" v-if="vipUser.isVip">
                          VIP{{ vipUser.isVip }}
                        </span>
                      </div>
                      <div class="other_info">
                        <div class="item">余额：{{ vipUser.amount | to2 }}</div>
                        <div class="item">
                          积分：{{ vipUser.accountPoints }}
                        </div>
                      </div>
                    </div>
                  </div>

                  <div class="forms" v-if="vipUser.id">
                    <div class="u-m-b-20 u-m-t-10">
                      <div class="u-flex u-flex-wrap">
                        <span class="font-bold no-wrap u-m-r-20">积分抵扣</span>
                        <el-radio-group
                          v-model="points.selected"
                          :disabled="!points.res.usable"
                          @input="pointsChange"
                        >
                          <el-radio :label="1">全部抵扣</el-radio>
                          <el-radio :label="2">部分抵扣</el-radio>
                        </el-radio-group>
                        <div class="u-m-l-20" v-if="points.res.usable">
                          <el-input-number
                            @change="pointsValueChange"
                            v-if="points.selected == 1"
                            :step="1"
                            disabled
                            step-strictly
                            v-model="points.value"
                            :min="points.minDeductionPoints"
                            :max="points.maxUsablePoints"
                          ></el-input-number>
                          <el-input-number
                            :step="1"
                            step-strictly
                            @change="pointsValueChange"
                            v-if="points.selected == 2"
                            v-model="points.value"
                            :min="points.minDeductionPoints"
                            :max="points.maxUsablePoints"
                          ></el-input-number>
                        </div>
                      </div>
                      <div class="color-999 u-m-t-10">
                        <template v-if="points.res.usable">
                          <span class="color-red">*</span>
                          <span v-if="points.res.equivalentPoints">
                            1积分抵扣{{ points.res.equivalentPoints }}元，
                          </span>
                          <span
                            >最大抵扣积分{{ points.res.maxUsablePoints }}</span
                          >
                          <span
                            >最小抵扣积分{{
                              points.res.minDeductionPoints
                            }}</span
                          >
                        </template>
                        <template v-else>
                          <span class="color-red">*</span>
                          <span>{{ points.res.unusableReason || "" }}</span>
                        </template>
                      </div>
                    </div>

                    <div class="u-flex flex-wrap">
                      <span class="font-bold no-wrap">优惠券</span>
                      <div
                        class="border u-p-l-20 cur-pointer u-m-r-20 u-flex no-wrap u-p-t-10 u-p-b-10 border-r-4 selQuan"
                        @click="showQuan"
                      >
                        <span class="color-999 u-p-r-10">选择优惠券</span>
                        <span
                          class="el-icon-arrow-down color-999 u-m-r-10"
                        ></span>
                      </div>
                      <!-- <el-button size="medium " type="text">
                        查看不可用券
                      </el-button> -->
                    </div>
                  </div>
                  <div class="u-p-b-20" v-if="quansSelArr.length > 0">
                    <div class="font-bold u-m-b-10">已选优惠券</div>
                    <el-table empty-text="未选择优惠券" :data="quansSelArr">
                      <el-table-column type="index" width="50" label="#">
                      </el-table-column>
                      <el-table-column prop="name" label="券名称">
                      </el-table-column>
                      <el-table-column label="券类型" width="80">
                        <template v-slot="scope">
                          {{ scope.row.type == 1 ? "优惠券" : "商品券" }}
                        </template>
                      </el-table-column>
                      <el-table-column label="商品信息" width="120">
                        <template v-slot="scope">
                          <div class="u-flex" v-if="scope.row.type == 2">
                            <div class="u-flex">
                              <el-image
                                :src="scope.row.productCover"
                                fit="cover"
                                style="width: 40px; height: 40px"
                                :preview-src-list="[scope.row.productCover]"
                              ></el-image>
                            </div>
                            <div class="u-p-l-10">
                              <div class="">{{ scope.row.productName }}</div>
                              <div class="">x{{ scope.row.num || "" }}</div>
                            </div>
                          </div>
                        </template>
                      </el-table-column>
                      <el-table-column prop="discountAmount" label="抵扣">
                        <template v-slot="scope">
                          <span class="color-red" v-if="scope.row.type == 1">
                            ￥{{ scope.row.discountAmount }}
                          </span>
                          <span class="color-red" v-if="scope.row.type == 2">
                            ￥{{
                              returnProDiscount(scope.row, scope.row.index)
                            }}
                          </span>
                        </template>
                      </el-table-column>
                      <el-table-column prop="useRestrictions" label="">
                        <template v-slot="scope">
                          <el-button
                            type="danger"
                            size="mini"
                            @click="delQuan(scope.row)"
                            >删除</el-button
                          >
                        </template>
                      </el-table-column>
                    </el-table>
                  </div>
                </div>
                <div class="btn_group">
                  <el-button size="medium" @click="disCountShow">
                    整单打折/减免
                  </el-button>
                  <!-- <el-button size="medium "> 免单 </el-button> -->
                </div>

                <pay-type
                  ref="refPayType"
                  v-model="order.payType"
                  @itemClick="payTypeItemClick"
                  :disabledPayType="disabledPayType"
                >
                </pay-type>
                <div style="margin-top: 20px">
                  <el-button type="primary" size="medium" @click="payOrder">
                    <span>立即支付</span>
                  </el-button>
                </div>
                <!-- <div class="flex row-right">
                    <el-button size="medium"  type="primary" @click="payOrder"
                      >确认支付</el-button
                    >
                  </div> -->
                <!-- <div class="title">选择支付方式</div>
                  <div class="btn_group">
                    <div class="price_select">
                      <div class="pay_btns">
                        <el-button size="medium"  type="primary">
                          微信支付/支付宝
                        </el-button>
                        <el-button size="medium"> 余额支付 </el-button>
                        <el-button size="medium"> 现金支付 </el-button>
                        <el-button size="medium"> 挂账 </el-button>
                      </div>
                    </div>
                  </div> -->
              </div>
              <div class="cashier_left cashier_right">
                <div class="title">账单明细</div>
                <div class="detail_form">
                  <!---->
                  <div class="detail_form_item">
                    <div class="left">会员优惠</div>
                    <div class="right">-￥0.00</div>
                  </div>
                  <div class="detail_form_item">
                    <div class="left">门店优惠</div>
                    <div class="right">-￥0.00</div>
                  </div>
                  <!-- <div class="detail_form_item">
                    <div class="left">满减优惠</div>
                    <div class="right">-￥{{ coupdiscount }}</div>
                  </div> -->
                  <div class="detail_form_item">
                    <div class="left">优惠券</div>
                    <div class="right">-￥{{ coupdiscount }}</div>
                  </div>
                  <div class="detail_form_item">
                    <div class="left">积分抵扣</div>
                    <div class="right">-￥{{ pointsDiscountAmount | to2 }}</div>
                  </div>
                  <div class="detail_form_item">
                    <div class="left">整单改价</div>
                    <div class="right">-￥{{ gaijia | to2 }}</div>
                  </div>
                  <div class="detail_form_item" v-if="createOrder.data.packFee">
                    <div class="left">打包费</div>
                    <div class="right">
                      ￥{{ createOrder.data.packFee || "0.00" }}
                    </div>
                  </div>
                  <div class="detail_form_item">
                    <div class="left">餐位费/附加费</div>
                    <div class="right">
                      ￥{{ order.seatFee.totalAmount | to2 }}
                    </div>
                  </div>
                  <div class="detail_form_item">
                    <div class="left">总价</div>
                    <div class="right">
                      ￥{{ createOrder.data.amount | to2 }}
                    </div>
                  </div>
                  <div class="detail_form_item">
                    <div class="left">抹零</div>
                    <div class="right">-￥0.00</div>
                  </div>
                  <div class="detail_form_item">
                    <div class="left">应付金额</div>
                    <div class="right redfont">￥{{ yinFuJinE }}</div>
                  </div>
                  <div class="line"></div>
                </div>
              </div>
            </div>
          </template>
        </div>
      </div>

      <!-- <slot name="footer">
          <div style="display: flex; justify-content: flex-end">
            <el-button style="margin-right: 20px" @click="haocaiCancel">取消</el-button>
            <el-button type="primary" @click="haocaiConfirm">确定</el-button>
          </div>
        </slot> -->
    </div>
    <!-- 选择规格 -->
    <el-dialog
      width="410px"
      :title="selGoods.title"
      :visible.sync="selGoods.show"
      @close="onSelGoodsSkuClose"
    >
      <div class="tag-group">
        <div
          class="tag-item"
          v-for="(item, index) in selGoods.skuList"
          :key="index"
        >
          <div class="tag-name">
            {{ item.name }}
            <span v-if="item.values.length >= 2"
              >({{ item.values.length }}选1)</span
            >
          </div>
          <div>
            <span
              style="margin: 0 10px 10px 0"
              v-for="(val, valIndex) in item.values"
              :key="valIndex"
            >
              <el-button
                plain
                :disabled="val.disabled"
                @click="changeTagSel(index, val)"
                :type="val.name === item.sel ? 'primary' : ''"
              >
                {{ val.name }}
              </el-button>
            </span>
          </div>
        </div>
      </div>

      <div slot="footer">
        <template v-if="skuGoods.data">
          <div class="flex row-between">
            <div>
              <div class="price">￥ {{ skuGoods.data.salePrice | to2 }}</div>
              <div class="sku-group-text">
                <span> {{ skuText }}</span>
                <span>库存：{{ skuGoods.data.stockNumber || 0 }}</span>
              </div>
            </div>
            <div class="flex">
              <i class="icon-remove" @click="skuNumberReduce"></i>
              <div style="width: 40px" class="number-box">
                <el-input
                  :min="skuGoods.data.suit"
                  type="number"
                  v-model="skuGoods.number"
                  placeholder="0"
                ></el-input>
              </div>
              <!-- <i class="el-icon-remove"></i> -->
              <i class="el-icon-circle-plus icon-add" @click="skuNumberAdd"></i>
            </div>
          </div>
          <div class="flex" style="margin-top: 14px">
            <button
              class="my-btn disabled flex-1"
              v-if="!skuGoods.data.isGrounding"
              disabled
            >
              已下架
            </button>
            <button
              class="my-btn disabled flex-1"
              v-else-if="
                selGoods.isStock == 1 && skuGoods.data.stockNumber <= 0
              "
              disabled
            >
              库存不足
            </button>
            <template v-else>
              <button class="my-btn primary flex-1" @click="chooseSkuConfirm">
                确定
              </button>
            </template>
          </div>
        </template>
        <template v-else>
          <div class="flex row-between">
            <div>
              <div class="price">￥</div>
              <div class="sku-group-text">
                <span> </span>
                <span>库存：</span>
              </div>
            </div>
            <div class="flex">
              <i class="icon-remove" @click="skuNumberReduce"></i>
              <div style="width: 40px" class="number-box">
                <el-input
                  :min="0"
                  :max="0"
                  type="number"
                  placeholder="0"
                ></el-input>
              </div>
              <!-- <i class="el-icon-remove"></i> -->
              <i class="el-icon-circle-plus icon-add" @click="skuNumberAdd"></i>
            </div>
          </div>
          <div class="flex" style="margin-top: 14px">
            <button class="my-btn disabled flex-1" disabled>已下架/售罄</button>
          </div>
        </template>
      </div>
    </el-dialog>

    <!-- 数字键盘 -->
    <el-dialog width="410px" title="数量" :visible.sync="keyborad.show">
      <div class="simple-Keyboard-number">
        <div class="carts">
          <div class="title font-bold">
            <span class="color-000">数量</span>
            <i class="el-icon-close" @click="changeKeyboradShow(false)"></i>
          </div>
          <div class="box_status">{{ keyborad.number }}</div>
          <div class="number_list_box">
            <div class="yd-keyboard">
              <div class="mini-number-box1">
                <div class="mini-number">
                  <div class="key-line">
                    <div class="key" @click="keyboradAdd('1')">1</div>
                    <div class="key" @click="keyboradAdd('2')">2</div>
                    <div class="key" @click="keyboradAdd('3')">3</div>
                  </div>
                  <div class="key-line">
                    <div class="key" @click="keyboradAdd('4')">4</div>
                    <div class="key" @click="keyboradAdd('5')">5</div>
                    <div class="key" @click="keyboradAdd('6')">6</div>
                  </div>
                  <div class="key-line">
                    <div class="key" @click="keyboradAdd('7')">7</div>
                    <div class="key" @click="keyboradAdd('8')">8</div>
                    <div class="key" @click="keyboradAdd('9')">9</div>
                  </div>
                  <div class="key-line">
                    <div class="key"></div>
                    <div class="key" @click="keyboradAdd('0')">0</div>
                    <div
                      class="key"
                      style="font-size: 31px"
                      @click="keyboradReduce"
                    >
                      <svg
                        t="1723453480343"
                        class="icon"
                        viewBox="0 0 1664 1024"
                        version="1.1"
                        xmlns="http://www.w3.org/2000/svg"
                        p-id="1467"
                        width="32"
                        height="32"
                      >
                        <path
                          d="M1526.08 1.6H459.84L41.28 416c-53.76 53.248-53.76 139.52 0 192.64l418.624 414.592v-0.064h1066.176a136.96 136.96 0 0 0 137.6-136.256V137.792a136.96 136.96 0 0 0-137.6-136.192z m-331.392 631.168c26.816 26.624 26.816 69.76 0 96.384-26.88 26.56-70.4 26.56-97.28 0l-121.28-120.128-123.328 122.112a69.76 69.76 0 0 1-97.92 0 68.096 68.096 0 0 1 0-96.96L878.208 512l-121.28-120.064a67.648 67.648 0 0 1 0-96.32c26.88-26.624 70.4-26.624 97.28 0l121.216 120.064 122.24-120.96a69.696 69.696 0 0 1 97.92 0 68.032 68.032 0 0 1 0 96.96l-122.24 120.96 121.344 120.064z"
                          fill="#333333"
                          p-id="1468"
                        ></path>
                      </svg>
                    </div>
                  </div>
                </div>
              </div>
            </div>
          </div>
          <div>
            <div class="submit" @click="keyboradConfirm">确认</div>
          </div>
        </div>
      </div>
    </el-dialog>

    <!-- 取单 -->
    <el-dialog width="550px" title="取单" :visible.sync="prveOrder.show">
      <div class="take_order_list">
        <div class="tol_left_list">
          <div
            class="tolll_item"
            :class="{ active: prveOrder.sel === index }"
            @click="changePrveOrder(index)"
            v-for="(item, index) in prveOrder.list"
            :key="index"
          >
            <div class="tollli_index">{{ index + 1 }}</div>
            <div class="tollli_price">￥{{ item.totalAmount }}</div>
            <div class="tollli_time_and_num">
              <div class="tollli_time">{{ item.created_at || "" }}</div>
              <div class="tollli_num">({{ item.totalNumber }}件)</div>
            </div>
          </div>
        </div>
        <div
          class="tol_right_list"
          v-if="prveOrder.list.length && prveOrder.sel >= 0"
        >
          <div
            class="tolrl_item"
            v-for="(item, index) in prveOrder.selCart"
            :key="index"
          >
            <div class="tolrli_img">
              <img :src="item.coverImg" alt="" />
            </div>
            <div class="tolrli_right">
              <div class="tr_top">
                <div class="trt_name">{{ item.name }}</div>
                <div class="trt_num">x{{ item.number }}</div>
                <div class="trt_price">￥{{ item.totalAmount || 0 }}</div>
              </div>
              <div class="tr_bottom">
                <span class="trb_item">
                  {{ item.specSnap | formatSpecSnap }}
                </span>
              </div>
            </div>
          </div>
        </div>
      </div>

      <div slot="footer" class="flex row-center">
        <div style="margin-right: 20px">
          <el-button
            size="medium"
            type="primary"
            @click="confirmChoosePrveOrder"
            >确认此单</el-button
          >
        </div>
        <el-button size="medium" @click="delPrveOrder">删除此单</el-button>
      </div>
    </el-dialog>

    <choose-user
      ref="refChooseUser"
      @chooseUser="chooseUserConfirm"
    ></choose-user>
    <choose-table
      ref="refChooseTable"
      @confirm="chooseTableConfirm"
    ></choose-table>
    <order-note ref="refOrderNote" @confirm="refOrderNoteConfirm"></order-note>

    <!-- 支付时的键盘弹窗 -->
    <money-keyboard ref="refMoneyKeyboard" :title="moneyKeyboard.title">
    </money-keyboard>
    <!-- 扫码支付 -->
    <scan-pay
      ref="refWxScanCode"
      defaultTips="请使用扫码枪扫描微信/支付宝收款码"
      title="扫码支付"
      :openSwitch="true"
      :price="createOrder.data.amount * createOrder.discount"
      :order="createOrder.data"
      @confirm="scanPayConfirm"
      @paySuccess="payOrderSuccess"
    ></scan-pay>
    <!-- 储值卡支付 -->
    <scan-pay
      ref="refScanCode"
      title="扫码支付"
      defaultTips="注意:扫码支付请保证输入框获得焦点"
      :openSwitch="false"
      :price="createOrder.data.amount * createOrder.discount"
      @confirm="scanPayConfirm"
    ></scan-pay>
    <!-- 打折 -->
    <money-discount ref="refDiscount" @confirm="ChangeDiscount">
    </money-discount>
    <!-- 优惠券 -->
    <quans-pop
      ref="refQuans"
      :vipUser="vipUser"
      :orderPrice="yinFuJinE"
      :goodsArr="createOrder.data.detailList || []"
      @confirm="quansConfirm"
    >
    </quans-pop>

    <!-- 选择人数 -->
    <choose-diners-number
      ref="refChooseDinersNumber"
      @confirm="chooseDinersNumberConfirm"
      :max="table ? table.maxCapacity : 99"
    ></choose-diners-number>

    <return-cart
      ref="refReturnCart"
      :max="order.selGoods ? order.selGoods.number : 1"
      @confirm="refReturnCartConfirm"
    ></return-cart>

    <!-- 临时菜 -->
    <cai-add ref="refPopAddCai"></cai-add>
  </div>
</template>
  
  <script>
import _ from "lodash";
import chooseUser from "./components/choose-user.vue";
import payType from "./components/pay-type.vue";
import chooseTable from "./components/choose-table-master.vue";
import cartItem from "./components/cart-item.vue";
import scanPay from "./components/scan-pay.vue";
import moneyDiscount from "./components/discount.vue";
import quansPop from "./components/quans.vue";
import orderNote from "./components/note.vue";
import chooseDinersNumber from "./components/choose-diners-number.vue";
import returnCart from "./components/return-cart.vue";
import moneyKeyboard from "./components/money-keyboard.vue";
import caiAdd from "./components/popup-linshiCai.vue";
import dayjs from "dayjs";
import { tbShopInfo } from "@/api/user";
import { hasPermission } from "@/utils/limits.js";
import { tbOrderInfoDetail } from "@/api/order";
import { queryAllShopUser } from "@/api/shop";

import {
  getGoodsLists,
  addCart,
  getCart,
  $clearCart,
  $removeCart,
  $updateCart,
  $allPack,
  $createOrder,
  $getMasterId,
  $cacheOrder,
  $getCacheOrder,
  $delOrder,
  $setUser,
  $payOrder,
  $choseTable,
  $choseCount,
  $returnCart,
  $printOrder,
  tbShopTableGet,
  $changeUseType,
  $returnTableDetail,
  $activateByOrderId,
  $calcUsablePoints,
  $calcDeDuctionPoints,
} from "@/api/table";
import { tbShopCategoryGet } from "@/api/shop";
import {
  isCanBuy,
  arrayContainsAll,
  generateCombinations,
  returnReverseVal,
  $strMatch,
  returnGiftArr,
  returnPackFee,
  formatOrderGoodsList,
  returnVipDiscountPrice,
  returnCouponAllPrice,
} from "./util.js";
import { returnProductCoupAllPrice } from "./quan_util.js";
//商品数量从0到n每一个对应的价格
let $goodsPayPriceMap = {};
import { $status } from "@/utils/table.js";

let $originTableList = [];
export default {
  components: {
    caiAdd,
    quansPop,
    returnCart,
    chooseUser,
    chooseTable,
    payType,
    orderNote,
    moneyKeyboard,
    scanPay,
    moneyDiscount,
    cartItem,
    chooseDinersNumber,
  },
  data() {
    return {
      disabledPayType: [],
      //积分抵扣
      points: {
        res: {
          usable: true,
        },
        selected: "",
        minDeductionPoints: 0,
        maxUsablePoints: 0,
        usable: false,
        value: 0,
        toMoney: 0,
      },
      //选中可用优惠券
      quansSelArr: [],
      //台桌搜索文字
      tableSearchText: "",
      //是否允许收款
      canShoukuan: false,
      //是否允许下单
      canXiadan: false,
      //是否是单品备注
      isDanNote: false,
      //店铺信息
      shopInfo: {},
      //就餐饭方式
      useTypes: {
        list: [],
        list: [
          {
            name: "堂食",
            value: "dine-in",
            disabled: true,
          },
          {
            name: "自取",
            value: "takeout",
            disabled: true,
          },
        ],
        sel: "dine-in",
      },
      //台桌列表
      tableList: [],
      //台桌参数
      tableQuery: {
        page: 1,
        size: 999,
      },
      tableShow: false,
      status: $status,
      //就餐人数
      perpole: "",
      //整体点餐页面loading
      loading: false,
      //台桌点餐页面打开时带来的参数 isAddGoods 加菜    isPayOrder结账
      key: "",
      //是否是从挂单里取出来的订单
      isPrverOrder: false,
      //是否全屏
      isFullScreen: false,
      moneyKeyboard: {
        show: true,
        title: "支付",
      },
      //true后付款false先付款
      payAfter: true,
      //是否打印
      isPrint: false,
      // 备注
      note: {
        content: "",
        isShow: false,
      },
      isCreateOrder: false,
      $goodsData: "",
      search: {
        list: [],
      },
      skuGoods: {
        number: 1,
        data: undefined,
      },
      selGoods: {
        isEdit: false,
        data: {},
        skuList: [],
        skuMap: [],
        title: "",
        show: false,
      },
      dayjs,
      dialogshow: false, //弹框显示
      dialogtitle: "", //文字显示
      informationdialogshow: false,
      informationdialogshowedit: false,
      goods: {
        status: "loadmore", //loadmore end
        list: [],
        query: {
          productId: "",
          categoryId: "",
          page: 1,
          size: 66,
        },
        loading: false,
        total: 0,
      },
      order: {
        status: "",
        packFee: {
          totalNumber: 0,
          status: "",
          number: 0,
          name: "打包费",
          totalAmount: 0,
        },
        extra: {
          selIndex: -1,
        },
        seatFee: { totalAmount: 0 }, //餐位费
        orderId: "",
        payType: "",
        masterId: "",
        allPack: false,
        //当前选中的购物车商品（包含历史订单）
        selGoods: "",
        selPlaceNum: -1, //第几次下单 0当前 1以及以上历史订单

        btns: [
          {
            text: "规格",
            disabled: false,
          },
          {
            text: "赠送",
            disabled: false,
          },
          {
            text: "打包",
            disabled: false,
          },
          {
            text: "删除",
            disabled: false,
          },
        ],
        list: [],
        gift: {
          list: [],
          selIndex: -1,
        },
        //已下单菜品
        old: {
          list: [],
          selIndex: -1,
        },
        query: {
          page: 1,
          size: 200,
        },
        number: 1,
        cacheNumber: 1,
        selIndex: -1,
        total: 0,
      },
      table: "",
      category: {
        list: [],
        showAll: false,
      },
      keyborad: {
        show: false,
        number: "0",
      },
      prveOrder: {
        list: [],
        show: false,
        sel: 0,
        selCart: [],
      },
      layout: {
        list: [
          { label: "经典布局", value: "default" },
          { label: "图文显示", value: "img-and-text" },
          { label: "文字显示", value: "text" },
        ],
        sel: "default",
      },
      // 选择用户
      vipUser: {
        id: "",
      },
      //餐桌号
      masterId: "",
      canUpdate: true,
      //下单
      createOrder: {
        code: "",
        status: "",
        discount: 1,
        form: {},
        data: {
          amount: 0,
        },
        quan: {
          list: [],
          sel: "",
        },
      },
      timer: null,
    };
  },
  computed: {
    pointsDiscountAmount() {
      if (this.points.selected) {
        return this.points.toMoney;
      } else {
        return 0;
      }
    },
    gaijia() {
      const disCountOriginPrice =
        this.createOrder.data.amount - this.coupdiscount;
      const disocunt = (1 - this.createOrder.discount) * disCountOriginPrice;
      return disocunt.toFixed(2);
    },
    pointsCanDicountMoney() {
      return (this.yinFuJinE - this.points.toMoney).toFixed(2);
    },
    isShowVipPrice() {
      if (!this.shopInfo.isMemberPrice) {
        return false;
      }
      return this.vipUser.isVip ? true : false;
    },
    coupdiscount() {
      const n = this.quansSelArr.reduce((prve, cur) => {
        return prve + cur.discountAmount * 1;
      }, 0);
      return n;
    },
    currentPayMoney() {
      const amount = this.createOrder.data.amount || 0;
      const discount = this.createOrder.discount || 1;
      // const total=((amount - this.coupdiscount) * this.createOrder.discount - this.points.toMoney)
      const total = amount - this.gaijia - this.coupdiscount;
      return total <= 0 ? 0 : total;
    },
    yinFuJinE() {
      const total =
        this.currentPayMoney - (this.points.selected ? this.points.toMoney : 0);
      console.log(total);
      if (this.isCreateOrder) {
        return total.toFixed(2);
      } else {
        return this.allPrice;
      }
    },
    disableTuicai() {
      return (
        this.order.placeNum == 1 ||
        this.order.selIndex >= 0 ||
        !this.order.selGoods ||
        this.order.old.list.length <= 0 ||
        this.order.selGoods.status == "return"
      );
    },
    title() {
      // return this.table ? "代客下单" + `(${this.table.name})` : "代客下单";
      return "代客下单";
    },
    allGiftMoney() {
      const nowprice = this.order.list
        .filter((v) => v.isGift === "true" || v.status == "return")
        .reduce((a, b) => {
          return a + b.number * b.salePrice;
        }, 0);

      const oldPrice = this.order.old.list.reduce((a, b) => {
        const total = b.info
          .filter((v) => v.isGift === "true" || v.status === "return")
          .reduce((prve, cur) => {
            return prve + cur.number * cur.salePrice;
          }, 0);
        return a + total;
      }, 0);
      return (nowprice + oldPrice).toFixed(2);
    },
    allPackMoney() {
      let n = 0;
      const nowPrice = this.order.list
        .filter((v) => v.isPack === "true")
        .reduce((a, b) => {
          n += b.number * 1;
          return a + b.packFee * 1;
        }, 0);
      const oldPrice = this.order.old.list.reduce((a, b) => {
        const bPrice = b.info
          .filter((v) => v.isPack === "true")
          .reduce((prve, cur) => {
            n += cur.number * 1;
            return prve + cur.packFee * 1;
          }, 0);
        return a + bPrice;
      }, 0);

      const total = (nowPrice + oldPrice).toFixed(2);
      this.order.packFee.totalAmount = total;
      this.order.packFee.totalNumber = n;
      return total;
    },
    giftLen() {
      const nowlen = this.order.list.filter(
        (v) => v.isGift === "true" || v.status === "return"
      ).length;
      const oldlen = this.order.old.list.reduce((prve, cur) => {
        const arr = cur.info.filter(
          (v) => v.isGift === "true" || v.status === "return"
        );
        prve.push(...arr);
        return prve;
      }, []).length;
      return nowlen + oldlen;
    },
    isSku() {
      if (this.order.selIndex < 0 || this.order.list.length <= 0) {
        return false;
      }
      return this.order.list[this.order.selIndex].specSnap;
    },
    returnGiftText() {
      if (this.order.selIndex < 0) {
        return "赠送";
      }
      return this.order.list[this.order.selIndex].isGift === "true"
        ? "取消赠送"
        : "赠送";
    },
    returnPackText() {
      if (this.order.selIndex < 0) {
        return "打包";
      }
      return this.order.list[this.order.selIndex].isPack === "true"
        ? "取消打包"
        : "打包";
    },
    skuText() {
      const result = this.selGoods.skuList.reduce((a, b) => {
        return a + (b.sel ? b.sel + "+" : "");
      }, "");
      return result.substring(0, result.length - 1);
    },

    allPrice() {
      const oldPrice = this.order.old.list.reduce((a, b) => {
        const bTotal = b.info
          .filter((v) => v)
          .reduce((prve, cur) => {
            return prve + cur.number * cur.salePrice;
          }, 0);
        return a + bTotal;
      }, 0);
      const price = this.order.list
        .filter((v) => v)
        .reduce((a, b) => {
          return a + b.number * b.salePrice;
        }, 0);

      const nowPackFee = returnPackFee(this.order.list, false);
      const oldackFee = returnPackFee(this.order.old.list);
      const packFee = nowPackFee + oldackFee;
      const returnStatus = ["return", "refunding", "refund"];
      const seatFee =
        this.order.seatFee.totalAmount *
        (returnStatus.includes(this.order.seatFee.status) ? 0 : 1);
      // return (
      //   (oldPrice + price + +packFee + seatFee - this.youhuiAllPrice) *
      //   this.createOrder.discount
      // ).toFixed(2);
      return (
        oldPrice +
        price +
        +packFee +
        seatFee -
        this.youhuiAllPrice
      ).toFixed(2);
    },
    vipDiscountPrice() {
      if (!this.vipUser.isVip || !this.shopInfo.isMemberPrice) {
        return 0;
      }
      const oldMemberPrice = this.order.old.list.reduce((a, b) => {
        const bTotal = b.info
          .filter(
            (v) =>
              v.isGift !== "true" &&
              v.status !== "return" &&
              v.memberPrice &&
              v.memberPrice != v.salePrice
          )
          .reduce((prve, cur) => {
            return prve + cur.number * (cur.salePrice - cur.memberPrice);
          }, 0);
        return a + bTotal;
      }, 0);
      const nowMemberprice = this.order.list
        .filter(
          (v) =>
            v.isGift !== "true" &&
            v.status !== "return" &&
            v.memberPrice &&
            v.memberPrice != v.salePrice
        )
        .reduce((a, b) => {
          return a + b.number * (b.salePrice - b.memberPrice);
        }, 0);
      return (oldMemberPrice + nowMemberprice).toFixed(2);
    },
    youhuiAllPrice() {
      return (this.vipDiscountPrice * 1 + this.allGiftMoney * 1).toFixed(2);
    },
    allNumber() {
      const oldNumber = this.order.old.list.reduce((a, b) => {
        const bTotal = b.info.reduce((prve, cur) => {
          return prve + cur.number * 1;
        }, 0);
        return a + bTotal;
      }, 0);
      const cartNumber = this.order.list.reduce((a, b) => {
        return a + b.number * 1;
      }, 0);
      return oldNumber + cartNumber;
    },
    selGoodsHide() {
      this.selGoods.show = false;
    },
    CanConfirm() {
      // if (!this.skuGoods.data) {
      //   return;
      // }
      // if (!this.selGoods.skuList.length) {
      //   return true;
      // }
      // const canBuyArr = this.selGoods.skuList.filter((v) =>
      //   isCanBuy(v, this.selGoods.isStock)
      // );
      // if (canBuyArr.length <= 0) {
      //   return true;
      // }
      // return (
      //   this.selGoods.skuList.filter((v) => v.sel !== "").length !==
      //   this.selGoods.skuList.length
      // );
    },
  },
  filters: {
    formatSpecSnap(str) {
      if (str === "" || str === null || str === undefined) {
        return "";
      }
      return str.replaceAll(",", " / ");
    },
    to2(n) {
      if (n === undefined) {
        return "";
      }
      return Number(n).toFixed(2);
    },
    returntypeName(item) {
      return item.typeEnum === "sku" ? "多规格" : "单规格";
    },
  },
  watch: {
    yinFuJinE: function (newval) {
      if (newval <= 0) {
        this.disabledPayType = ["scanCode", "deposit"];
      } else {
        this.disabledPayType = [];
      }
    },
    "goods.query.categoryId": function (newval) {
      this.goods.query.page = 1;
      this.goods.list = [];
      this.goods.status = "loadmore";
      this.getGoods();
    },
    pointsCanDicountMoney: function (newval) {
      this.getCalcUsablePoints();
    },
    currentPayMoney: function (newval) {
      if (this.createOrder.data.memberId || this.vipUser.id) {
        this.getCalcUsablePoints().then((res) => {
          if (this.points.selected) {
            this.pointsValueChange(this.points.value);
          }
        });
      }
    },
    "useTypes.sel": function (newval, oldval) {
      console.log(newval);
      this.setPostPay();
      this.setUseType();
    },
    perpole(newval, oldval) {
      if (!oldval && newval && this.table.tableId) {
        // $choseCount({
        //   masterId: this.masterId,
        //   tableId: this.table.tableId,
        //   num: newval,
        // }).then(res=>{
        //   this.order.seatFee=res
        // })
      }
    },
    // table(newval, oldval) {
    //   this.setPostPay();
    //   this.setUseType();
    //   if (oldval.tableId && newval.tableId) {
    //     this.perpole = 1;
    //     this.isCreateOrder = false;
    //   }
    //   if (this.key == "isJieZhang") {
    //     this.isCreateOrder = false;
    //     this.key = "";
    //     return;
    //   }
    //   if (newval && newval.tableId) {
    //     this.createOrder.data.amount = 0;
    //     this.createOrder.data.id = "";
    //     this.onTableChange();
    //   }
    // },
    masterId: function (val) {
      console.log(val);
    },
    isCreateOrder: function (val) {
      if (!val) {
        this.createOrder.discount = 1;
      }
    },
    "vipUser.id": function (val, oldval) {
      // if (!this.table.tableId) {
      //   return;
      // }
      // let masterId = this.order.masterId;
      // if (!masterId) {
      //   const res = await this.getMasterId();
      //   masterId = res.masterId;
      // }
      // this.masterId = masterId;
      console.log("this.createOrder.data");
      console.log(this.createOrder.data);
      if (this.order.status == "finish") {
        return;
      }
      if (
        !this.table.tableId &&
        this.order.list.length <= 0 &&
        this.order.old.list.length <= 0
      ) {
        return;
      }
      $setUser({
        tableId: this.table.tableId,
        masterId: this.masterId,
        vipUserId: val,
        orderId: this.createOrder.data.id || "",
        type: val === "" ? 1 : 0,
      }).then((res) => {
        if (this.isCreateOrder) {
          this.createOrder.data.memberId = val.id;
          this.getOrderData().then(() => {
            this.pointsValueChange(this.points.value);
          });
        } else {
          this.getCart();
        }
      });
    },
    "prveOrder.list.length": function (val) {
      if (val !== 0) {
        this.prveOrder.selCart =
          this.prveOrder.list[this.prveOrder.sel].carList;
      } else {
        this.prveOrder.selCart = [];
      }
      console.log(this.prveOrder.selCart);
    },
    "prveOrder.sel": function (val) {
      this.prveOrder.selCart =
        this.prveOrder.list.length !== 0
          ? this.prveOrder.list[val].carList
          : [];
      console.log(this.prveOrder.selCart);
      if (val < 0) {
        this.prveOrde.show = false;
      }
    },
    "order.allPack": function (val) {
      console.log(val);
      if (this.order.list.length <= 0) {
        return;
      }
      $allPack({
        masterId: this.masterId,
        tableId: this.table.tableId,
        state: val ? 1 : 0,
      }).then((res) => {
        this.order.list.map((v) => {
          v.isPack = `${val}`;
        });
      });
    },
    "order.selIndex": function (val, oldval) {
      let goods = this.order.list[val];
      const isOld = this.selPlaceNum > 0;
      if (isOld) {
        const item = this.order.list.find(
          (v) => v.placeNum == this.selPlaceNum
        );
        const selItem = item.info[this.order.old.selIndex];
        goods = selItem ? selItem : "";
      }
      console.log(goods);
      if (val === -1) {
        this.order.cacheNumber = 1;
      } else {
        this.order.cacheNumber = goods.number;
      }
    },
    "order.list.length": function (val) {
      if (val <= 0) {
        this.changeOrderSel(-1);
      }
      if (this.order.selIndex >= 0) {
        this.order.cacheNumber = this.order.list[this.order.selIndex].number;
        // this.order.number = this.order.list[this.order.selIndex].number;
      }
    },
    "order.number": _.debounce(function (newval) {
      if (this.order.list.length <= 0 || this.order.selIndex < 0) {
        return;
      }
      this.createOrderClose();

      let item = this.order.list[this.order.selIndex];
      console.log(item.specSnap);
      const { productId, skuId, isPack, isGift, number } = item;
      const oldGoods = this.order.old.list.find((v) => {
        return v.productId === productId && v.skuId === skuId;
      });
      $updateCart({
        cartId: item.id,
        productId,
        skuId,
        tableId: this.table.tableId,
        num: this.order.number + (oldGoods ? oldGoods.number : 0), // 0会删除此商品
      }).then((res) => {
        this.$set(this.order.list, this.order.selIndex, {
          ...res,
          specSnap: item.specSnap || res.skuName,
          number: this.order.number,
        });
      });
      return;
      this.updateOrder({
        num: newval, // 0会删除此商品
      });
    }, 30),
    "goods.query.productId": function (newval) {
      if (!this.$goodsData) {
        return;
      }
      if (newval == "") {
        this.goods.list = this.$goodsData || [];
      } else {
        const newarr = this.$goodsData.filter((v) =>
          v.name.includes(newval.trim())
        );
        this.search.list = newarr;
        this.goods.list = newarr.length ? newarr : this.$goodsData;
      }
    },
  },
  mounted() {
    this.xiadanClick();
    // this.getGoods();
    // this.getCategory();
    // this.refToggle('refScanCode',true)
    // this.refToggle("refDiscount", true);
    // this.open(this.$route.query.tableId ? this.$route.query : "");
    this.open(this.$route.query);
  },
  methods: {
    returnProDiscount(row) {
      console.log(row);
      //相同商品抵扣券数组
      const arr = this.quansSelArr.filter((v) => v.proId == row.proId);
      const index = arr.findIndex((v) => v.id == row.id);
      const item = this.createOrder.data.detailList.find(
        (v) => v.productId == row.proId
      );

      if (index != -1) {
        const n = returnProductCoupAllPrice(
          $goodsPayPriceMap[row.proId],
          index,
          row.num,
          item.isMember
        );
        return (n * this.createOrder.discount).toFixed(2);
      } else {
        return 0;
      }
    },
    lingshicaiShow() {
      this.$refs.refPopAddCai.open();
    },
    delQuan(row) {
      const index = this.quansSelArr.findIndex((v) => v.id == row.id);
      console.log(index);
      if (index != -1) {
        this.quansSelArr.splice(index, 1);
        this.quansSelArr
          .map((v, index) => {
            return {
              ...v,
              discountAmount:v.type==2?this.returnProDiscount(v):v.discountAmount,
            };
          });
      }
    },
    async getCalcUsablePoints() {
      const memberId = this.createOrder.data.memberId || this.vipUser.id;
      if (!memberId) {
        return;
      }
      const pointsRes = await $calcUsablePoints({
        memberId: memberId,
        orderAmount: this.currentPayMoney.toFixed(2),
      });
      this.points.res = pointsRes;
      // this.points.minDeductionPoints = pointsRes.minDeductionPoints;
      this.points.maxUsablePoints = pointsRes.maxUsablePoints;
      if (this.points.selected) {
        this.points.value = Math.min(
          this.vipUser.accountPoints,
          this.points.res.maxUsablePoints || 0
        );
        if(!pointsRes.usable){
          this.points.selected=false
        }
      }
      return pointsRes;
    },
    //根据积分输入值变化计算抵扣金额
    pointsValueChange(e) {
      console.log(e);
      if (e == 0 || !e) {
        return (this.points.toMoney = 0);
      }
      $calcDeDuctionPoints({
        memberId: this.createOrder.data.memberId || this.vipUser.id,
        orderAmount: this.currentPayMoney.toFixed(2),
        points: e,
      }).then((res) => {
        this.points.toMoney = res * 1;
      });
    },
    //积分抵扣类型改变
    pointsChange(e) {
      console.log(e);
      if (e == 1) {
        this.points.value = Math.min(
          this.vipUser.accountPoints,
          this.points.res.maxUsablePoints || 0
        );
        this.pointsValueChange(this.points.value);
      }
    },
    showQuan() {
      this.$refs.refQuans.open(
        {
          id: this.createOrder.data.id,
          memberId: this.createOrder.data.memberId || this.vipUser.id,
          orderPrice: (this.yinFuJinE * 1 + this.coupdiscount * 1).toFixed(2),
          discount: this.createOrder.discount,
        },
        [...this.quansSelArr]
      );
    },
    quansConfirm(e, goodsPayPriceMap) {
      console.log(e);
      this.createOrder.discount = 1;
      this.points.selected = "";
      e.map((v, index) => {
          return {
            ...v,
            discountAmount:v.type==2?  this.returnProDiscount(v):v.discountAmount,
          };
        });
      this.quansSelArr = [...e];
      $goodsPayPriceMap = goodsPayPriceMap;
    },
    searchInput(e) {
      console.log(e);
      this.tableList = $originTableList.filter((v) =>
        $strMatch(v.name, e.trim())
      );
    },
    returnTableColor(key) {
      const item = $status[key];
      return item ? item.type : "";
    },
    loadMoreGoods() {
      if (this.goods.query.page * this.goods.query.size < this.goods.total) {
        this.goods.query.page = this.goods.query.page + 1;
        this.getGoods();
      }
    },
    async shoukuanClick() {
      this.canShoukuan = await hasPermission("允许收款");
      return this.canShoukuan;
    },
    // 打开页面
    async xiadanClick() {
      this.canXiadan = await hasPermission("允许下单");
      return this.canXiadan;
    },
    changeOrderExtraSel(index, canChangeNumber, placeNum) {
      // console.log(index,canChangeNumber,placeNum)
      this.order.selIndex = -1;
      this.order.selGoods = this.order.seatFee;
      this.order.selPlaceNum = placeNum;
      this.order.extra.selIndex = index;
    },
    async morePayClick() {
      if (!this.createOrder.data.id && this.order.list.length <= 0) {
        return this.$message("请选择菜品");
      }
      const canJiesuan = await this.shoukuanClick();
      if (!canJiesuan) {
        return;
      }
      // if(this.isCreateOrder){
      //   return
      // }
      await this.returnCreateOrderData();
      // this.payBeforeClear();
      // this.order.payType = "";
    },
    async cashPayClick() {
      if (!this.createOrder.data.id && this.order.list.length <= 0) {
        return this.$message("没有要结算的订单或商品！");
      }
      const canJiesuan = await this.shoukuanClick();
      if (!canJiesuan) {
        return;
      }
      this.$confirm("是否确认已现金收款:" + this.yinFuJinE + "?", "快捷支付", {
        confirmButtonText: "确定",
        cancelButtonText: "取消",
        type: "warning",
      }).then(() => {
        this.order.payType = "cash";
        this.cachePay();
      });
    },
    async returnCreateOrderData() {
      if (this.key == "isJieZhang" || this.order.list.length <= 0) {
        //结账来的下单或者已经生成订单
        // this.order.old.list = formatOrderGoodsList(this.createOrder.data.detailList||[]);
        this.isCreateOrder = true;
        return this.createOrder.data;
      }
      this.order.list = [];
      const res = await $createOrder({
        masterId: this.order.masterId || this.masterId,
        vipUserId: this.vipUser.id,
        tableId: this.table.tableId,
        note: this.note.content,
        payAfter: this.payAfter,
        orderld: this.order.orderId,
      });
      this.isCreateOrder = true;
      this.order.old.list = formatOrderGoodsList(res.detailList || []);
      this.getOrderData({ orderId: res.id });
      this.createOrder.data = res;
      this.createOrder.discount = 1;
      // const lastItem = this.order.old.list[this.order.old.list.length - 1];
      // const nowPlaceNum = lastItem ? lastItem.placeNum : 0;
      // this.order.old.list = [
      //   ...this.order.old.list,
      //   { info: this.order.list, placeNum: nowPlaceNum + 1 },
      // ];
      console.log(this.order.old.list);
      return res;
    },
    async payBeforeClear() {
      this.loading = false;
      this.order.query.page = 1;
      this.goods.total = 0;
      this.order.list = [];
      this.order.selIndex = -1;
      this.order.selPlaceNum = -1;
      this.order.selGoods = "";
      this.prveOrder.list = [];
      this.prveOrder.selIndex = -1;
      this.order.old.selIndex = -1;
      // this.isCreateOrder = false;
      this.createOrder.status = "";
      this.createOrder.code = "";
      this.note.content = "";
      this.vipUser = { id: "" };
      this.order.masterId = "";
      this.allPack = false;
      this.note.content = "";
      this.isPrverOrder = false;
      this.createOrder.discount = 1;
      this.order.cacheNumber = 1;
      this.key = "";
      this.order.orderId = "";
      this.perpole = "";
    },
    async cachePay() {
      const canJiesuan = await this.shoukuanClick();
      if (!canJiesuan) {
        return;
      }
      await this.returnCreateOrderData();
      this.payBeforeClear({});
      this.pays();
    },
    async scanPayClick() {
      if (!this.createOrder.data.id && this.order.list.length <= 0) {
        return this.$message("没有要结算的订单或商品！");
      }
      const canJiesuan = await this.shoukuanClick();
      if (!canJiesuan) {
        return;
      }
      if (!this.isCreateOrder) {
        const order = await this.returnCreateOrderData();
        this.order.payType = "scanCode";
        this.payTypeItemClick({ payType: "scanCode", order });
        return;
      }
      this.payTypeItemClick({ payType: "scanCode" });
    },
    async changeOrderUseType(useType) {
      if (useType && this.order.list.length) {
        const tableId = useType == "takeout" ? undefined : this.table.tableId;
        await $changeUseType({
          useType,
          tableId,
          cartIds: this.order.list.map((v) => v.id),
        });
        this.getCart();
      }
    },
    //设置用餐类型
    setUseType() {
      // 自取
      let useType = "takeout";
      if (this.useTypes.sel == "takeout") {
        localStorage.setItem("useType", "takeout");
      } else {
        //堂食
        useType = `dine-in-${this.payAfter ? "after" : "before"}`;
        localStorage.setItem("useType", useType);
      }
      this.changeOrderUseType(useType);
    },
    //设置先付后付
    setPostPay() {
      // 自取
      // payAfter true 后付 false 先付

      if (this.useTypes.sel == "takeout") {
        this.payAfter = false;
      } else {
        //munchies 先付  restaurant 后付
        this.payAfter = this.shopInfo.registerType == "munchies" ? false : true;
      }
      console.log("this.payAfter");
      console.log(this.payAfter);
    },
    //获取店铺信息
    async getShopInfo() {
      try {
        const shopId = localStorage.getItem("shopId");
        const res = await tbShopInfo(shopId);
        this.shopInfo = res;
        this.setPostPay();
        this.setUseType();
      } catch (error) {}
    },
    //更改就餐方式
    changeUseType(type) {
      if (this.order.old.list.length > 0) {
        return this.$message("下单后不支持更改就餐方式");
      }
      console.log(type);
      this.useTypes.sel = type;
    },
    //更改就餐人数
    async changePerpole() {
      if (!this.table.tableId) {
        return;
      }
      const res = await $choseCount({
        masterId: this.masterId,
        tableId: this.table.tableId,
        num: this.perpole,
      });
      this.order.seatFee = res;
      this.perpole = res.totalNumber || res.number;
      return res;
    },
    //台桌变化时重新获取取餐号、购物车数据，如果是正在结账状态，创建订单到待支付页面
    async onTableChange() {
      this.order.list = [];
      this.order.old.list = [];
      console.log("onTableChange");
      const perpole = this.perpole || "";
      const tableRes = await $returnTableDetail({
        tableId: this.table.tableId,
      });
      console.log(tableRes);
      const orderId = tableRes.orderId || this.table.orderId;
      if (orderId) {
        return this.getOrderData({ orderId: orderId });
      }
      const res = await this.getMasterId();
      this.masterId = res.masterId;
      //空闲并且免餐位费设置默认就餐人数1
      if (
        !this.perpole &&
        this.table.status == "idle" &&
        !this.shopInfo.isTableFee
      ) {
        this.perpole = 1;
        await this.changePerpole();
      }
      //设置就餐类型
      const item = this.table;
      if (item && item.useType) {
        localStorage.setItem("useType", item.useType);
        this.useTypes.sel =
          item.useType == "takeout"
            ? item.useType
            : item.useType.replace(/-after|-before/g, "");
      }
      if (!orderId) {
        this.getCart();
      }
      this.getCacheOrder();
      this.perpole = perpole || this.perpole;
      if (!this.shopInfo.isTableFee && this.table.tableId && this.perpole > 0) {
        //不免餐位费
        await this.changePerpole();
      }
    },
    //打印制作单
    printOrder() {
      this.$confirm("是否打印当前台桌菜品", "提示", {
        confirmButtonText: "确定",
        cancelButtonText: "取消",
        type: "warning",
      })
        .then(() => {
          $printOrder({
            tableId: this.table.tableId,
          }).then(() => {
            this.$message({
              type: "success",
              message: "已发送打印请求",
            });
          });
        })
        .catch(() => {});
    },
    //退菜
    async refReturnCartConfirm(e) {
      const res = await $returnCart({
        ...e,
        cartId: this.isCreateOrder
          ? this.order.selGoods.id
          : this.order.selGoods.cartId,
        tableId: this.table.tableId,
      });
      this.order.selGoods.status = "return";
      this.order.old.selIndex = -1;
      // this.getCart();
      this.getOrderData();
      // console.log(this.order.selGoods);
    },

    // 台桌列表
    async getTable() {
      try {
        const { content, total } = await tbShopTableGet({
          ...this.tableQuery,
          shopId: localStorage.getItem("shopId"),
        });
        this.tableList = content.filter(
          (v) =>
            v.status != "closed" &&
            v.status != "cleaning" &&
            v.status != "unbind"
        );
        $originTableList = this.tableList;
      } catch (error) {
        console.log(error);
      }
    },
    async getTableDetail(tableId) {
      const res = await $returnTableDetail({
        tableId: tableId ? tableId : this.table.tableId,
      });
      this.table = { tableId, ...res };
      return res;
    },
    async changeTable(item) {
      console.log("changeTable");
      console.log(this.table, this.table.tableId);
      if (
        (this.table && this.table.tableId) ||
        (!this.table && !this.tableId && this.order.list.length <= 0)
      ) {
        //台桌已选，再选台桌视为切换台桌
        //无台桌下单，且购物车列表为空，选台桌也视为切换台桌
        this.table = item;
        this.tableShow = false;
        this.setPostPay();
        this.setUseType();
        this.onTableChange();
        return;
      }
      if (this.table && this.order.list.length <= 0) {
        this.table = item;
        this.tableShow = false;
        console.log(this.table);
        this.onTableChange();
        return;
      }
      if (item.status != "idle") {
        return this.$message.error("该台桌已在使用中");
      }
      const res = await $returnTableDetail({
        tableId: item.tableId,
      });
      let res1 = null;
      if (res.cartCount > 0) {
        try {
          res1 = await this.$confirm(
            "该台桌购物车里有商品，是否清除该台桌里的商品?",
            "提示",
            {
              confirmButtonText: "确定",
              cancelButtonText: "取消",
              type: "warning",
            }
          );
        } catch (e) {
          console.log(e);
        }
      }
      this.tableShow = false;
      await $choseTable({
        masterId: this.masterId,
        tableId: item.tableId,
        isClear: res1 == "confirm" ? true : false,
      });
      this.table = item;
      this.onTableChange();
    },
    chooseDinersNumberConfirm(e) {
      this.perpole = e;
      this.changePerpole();
    },
    //扫码支付弹窗确认
    scanPayConfirm(code) {
      this.createOrder.code = code;
      if (!code) {
        return this.$message.error("请输入或扫付款码");
      }
      this.pays();
    },
    payTypeItemClick(item, order) {
      order = order ? order : this.createOrder.data;
      if (item.payType == "vipPay") {
        return this.refChooseUserOpen();
      }
      if (item.payType == "deposit") {
        //储值卡支付
        return this.refToggle("refScanCode", true);
      }
      if (item.payType == "scanCode") {
        //扫码支付
        return this.refToggle("refWxScanCode", true, {
          orderId: order.id,
          payAmount: (this.createOrder.data.amount * order.discount).toFixed(2),
        });
      }
    },
    ChangeDiscount(discount) {
      const fullCoupIndex = this.quansSelArr.findIndex((v) => v.type == 1);
      const fullCoup = this.quansSelArr[fullCoupIndex];
      this.createOrder.discount = discount;
      if (fullCoup && this.yinFuJinE < fullCoup.fullAmount) {
        return this.$confirm(
          "改价后价格不满足满减券最低满减需求" + fullCoup.fullAmount + "元",
          "提示",
          {
            confirmButtonText: "删除满减券",
            cancelButtonText: "取消改价",
            type: "warning",
          }
        )
          .then(() => {
            this.quansSelArr.splice(fullCoupIndex, 1);
            this.createOrder.discount = discount;
          })
          .catch((action) => {
            this.createOrder.discount = 1;
            this.$message({
              type: "info",
              message: "已取消改价",
            });
          });
      }
    },
    async disCountShow() {
      const canDiscount = await hasPermission("允许打折");
      if (!canDiscount) {
        return;
      }
      const amount = (this.createOrder.data.amount - this.coupdiscount).toFixed(
        2
      );
      console.log(amount);
      this.refToggle("refDiscount", true, {
        amount,
        discount: this.createOrder.discount * 100,
      });
    },
    refToggle(key, isShow, data) {
      if (!this.$refs[key]) {
        return;
      }
      isShow ? this.$refs[key].open(data) : this.$refs[key].close(data);
    },
    //购物车商品输入框数量输入
    cartGoodsNumberInput(newval, index) {
      const item = this.order.list[index];
      console.log(item);
      this.order.cacheNumber = newval;
      item.number = newval;
    },
    //购物车商品输入框数量改变
    cartGoodsNumberChange(newval, index) {
      const item = this.order.list[index];
      newval = `${newval}`.split(".")[0] * 1;
      console.log(newval);
      this.order.cacheNumber = newval;
      this.order.number = newval;
    },
    //判读单规格商品是否售尽
    isSellOut(item) {
      return (
        item.isPauseSale || (item.isStock == 1 ? item.stockNumber <= 0 : false)
      );
    },
    toggleFullScreen() {
      if (!document.fullscreenElement) {
        this.enterFullScreen();
      } else {
        this.exitFullScreen();
      }
    },
    enterFullScreen() {
      let element = document.documentElement;
      if (element.requestFullscreen) {
        element.requestFullscreen();
      } else if (element.mozRequestFullScreen) {
        /* Firefox */
        element.mozRequestFullScreen();
      } else if (element.webkitRequestFullscreen) {
        /* Chrome, Safari & Opera */
        element.webkitRequestFullscreen();
      } else if (element.msRequestFullscreen) {
        /* IE/Edge */
        element.msRequestFullscreen();
      }
      this.isFullScreen = true;
    },
    exitFullScreen() {
      if (document.exitFullscreen) {
        document.exitFullscreen();
      } else if (document.mozCancelFullScreen) {
        /* Firefox */
        document.mozCancelFullScreen();
      } else if (document.webkitExitFullscreen) {
        /* Chrome, Safari and Opera */
        document.webkitExitFullscreen();
      } else if (document.msExitFullscreen) {
        /* IE/Edge */
        document.msExitFullscreen();
      }
      this.isFullScreen = false;
    },
    //打开输入钱的键盘
    openMoneyKeyboard() {
      this.$refs.refMoneyKeyboard.open();
    },
    changePostPay(val) {
      this.payAfter = val;
    },
    //改变是否打印
    changeIsPrint(e) {
      console.log(e);
      this.isPrint = e;
    },
    async refOrderNoteConfirm(note) {
      //单品备注
      if (this.isDanNote) {
        const cart = this.order.list[this.order.selIndex];
        const res = await $updateCart({
          cartId: cart.id,
          productId: cart.productId,
          skuId: cart.skuId,
          tableId: this.table.tableId,
          note: note,
          num: cart.number, // 0会删除此商品
        });
        this.$set(this.order.list, this.order.selIndex, {
          ...res,
          specSnap: res.skuName,
        });
        this.$notify({
          title: "更新成功",
          type: "success",
        });
      } else {
        //订单备注
        this.note.content = note;
      }
    },
    refNoteShow(isDan = false) {
      this.isDanNote = isDan;
      const note = isDan
        ? this.order.list[this.order.selIndex].note
        : this.note.content;
      this.$refs.refOrderNote.open(note);
    },
    // 支付订单前的处理
    async payOrder() {
      if (this.order.payType == "vipPay" && !this.vipUser.id) {
        return this.refChooseUserOpen();
      }
      if (this.order.payType == "scanCode") {
        return this.refToggle("refWxScanCode", true, {
          orderId: this.createOrder.data.id,
          payAmount: (
            this.createOrder.data.amount * this.createOrder.discount
          ).toFixed(2),
        });
      }
      if (this.order.payType == "deposit") {
        return this.refToggle("refScanCode", true);
      }
      console.log({
        orderId: this.createOrder.data.id,
        payType: this.order.payType,
      });
      if (this.order.payType == "cash") {
        return this.$confirm(
          "是否确认已现金收款:" + this.yinFuJinE + "?",
          "快捷支付",
          {
            confirmButtonText: "确定",
            cancelButtonText: "取消",
            type: "warning",
          }
        ).then(() => {
          this.pays();
        });
      }
      this.pays();
    },
    // 支付订单
    async pays() {
      this.loading = true;
      const userCouponInfos = this.quansSelArr.reduce((prve, cur) => {
        const index = prve.findIndex((v) => v.userCouponId == cur.couponId);
        if (index != -1) {
          prve[index].num += cur.num;
        } else {
          prve.push({
            userCouponId: cur.id,
            num: cur.num,
          });
        }
        return prve;
      }, []);
      try {
        const res = await $payOrder({
          tableId: this.table.tableId,
          masterId: this.masterId,
          orderId: this.createOrder.data.id,
          payType: this.order.payType,
          vipUserId: this.createOrder.data.memberId || this.vipUser.id,
          discount: this.createOrder.discount,
          code: this.createOrder.code,
          userCouponInfos,
          pointsNum: this.points.value,
        });
        this.loading = false;
        this.payOrderSuccess();
      } catch (error) {
        this.loading = false;
      }
    },
    payOrderSuccess() {
      this.$notify({
        title: "支付成功",
        type: "success",
      });
      this.order.status = "finish";
      this.close();
      //   this.reset();
    },
    chooseTableConfirm(item) {
      console.log(item);
      this.table = item;
    },
    chooseTableOpen() {
      this.$refs.refChooseTable.open();
    },
    chooseUserConfirm(user) {
      console.log(user);
      if (user) {
        this.vipUser = user;
      } else {
        this.vipUser = { id: "" };
      }
    },
    refChooseUserOpen() {
      this.$refs.refChooseUser.open();
    },
    createOrderClose() {
      console.log("createOrderClose");
      this.isCreateOrder = false;
    },
    //生成订单
    async toCreateOrderDebounce(isNowPay) {
      if (!isNowPay) {
        //仅下单
        const canXiadan = await this.xiadanClick();
        if (!canXiadan) {
          return;
        }
      } else {
        //去结算
        const canJiesuan = await this.shoukuanClick();
        if (!canJiesuan) {
          return;
        }
      }

      console.log(this.createOrder.status);
      if (
        this.createOrder.status != "" &&
        this.createOrder.status != "success"
      ) {
        return;
      }
      this.createOrder.status = "loading";
      this.toCreateOrder(isNowPay);
    },
    async toCreateOrder(isNowPay = false) {
      let res = "";
      try {
        if (!this.shopInfo.isTableFee) {
          await this.changePerpole();
        }
        if (this.order.list.length > 0) {
          res = await $createOrder({
            masterId: this.order.masterId || this.masterId,
            vipUserId: this.createOrder.data.memberId || this.vipUser.id,
            tableId: this.table.tableId,
            note: this.note.content,
            payAfter: this.payAfter,
            orderld: this.order.orderId,
          });
        }
        await this.getOrderData(
          res ? { orderId: res.id } : { orderId: this.createOrder.data.id }
        );
        res = true;
      } catch (error) {}
      if (!res) {
        this.createOrder.status = "success";
        return;
      }
      //后付款
      this.createOrder.status = "success";
      this.order.list = [];
      // this.getCart();
      if (this.payAfter && !isNowPay) {
        this.$notify({
          title: "下单成功",
          type: "success",
        });
        return this.close();
      }
      if (!this.isPrverOrder) {
        await this.getMasterId();
      }
      this.isCreateOrder = true;
    },

    // 获取取餐号
    async getMasterId() {
      const res = await $getMasterId({
        tableId: this.table.tableId,
        orderId: this.table.orderId,
        vipUserId: this.vipUser.id,
        useType: this.useTypes.sel == "takeout" ? "takeout" : "",
      });
      this.masterId = res.masterId;
      return res;
    },
    onSelGoodsSkuClose() {
      this.selGoods.isEdit = false;
    },
    changePrveOrder(index) {
      this.prveOrder.sel = index;
    },
    //更新购物车商品数据
    updateOrder(par = {}) {
      let item = this.order.list[this.order.selIndex];
      console.log(this.table);
      const { productId, skuId, isPack, isGift, number, id } = item;
      $updateCart({
        cartId: id,
        masterId: this.masterId,
        vipUserId: this.vipUser.id,
        productId,
        skuId,
        tableId: this.table.tableId,
        num: number,
        isPack: isPack === "true" ? true : false,
        isGift: isGift === "true" ? true : false,
        ...par,
      }).then((res) => {
        this.$set(this.order.list, this.order.selIndex, {
          ...res,
          specSnap: item.specSnap,
        });
      });
    },
    keyboradAdd(n) {
      if (Number(this.keyborad.number) === 0) {
        return (this.keyborad.number = n);
      }
      this.keyborad.number += n;
    },
    keyboradReduce() {
      if (this.keyborad.number.length <= 1) {
        return (this.keyborad.number = "0");
      }
      this.keyborad.number = this.keyborad.number.substring(
        0,
        this.keyborad.number.length - 1
      );
    },
    keyboradConfirm() {
      const orderGoods = this.order.list[this.order.selIndex];
      // 如果设置为0,商品数量减1
      if (this.keyborad.number == 0) {
        this.changeOrderNumber(this.order.selIndex, true);
      } else {
        orderGoods.number = Number(this.keyborad.number);
      }
      this.order.cacheNumber = orderGoods.number;
      this.order.number = orderGoods.number;
      this.changeKeyboradShow(false);
    },
    changeKeyboradShow(show) {
      if (show) {
        this.keyborad.number = `${this.order.list[this.order.selIndex].number}`;
      }
      this.keyborad.show = show;
    },
    // 获取本地缓存挂单
    // getPrveCart() {
    //   const arr = localStorage.getItem("orderList")
    //     ? JSON.parse(localStorage.getItem("orderList"))
    //     : [];
    //   this.prveOrder.list = arr.map((v) => {
    //     return { ...v, cart: JSON.parse(v.cart) };
    //   });
    // },

    //右侧控制按钮点击事件
    orderBtnsClick(key) {
      const orderGoods = this.order.list[this.order.selIndex];
      if (this.key != "isJieZhang" && this.payAfter) {
        this.createOrderClose();
      }
      if (key === "sku") {
        this.selGoods.title = orderGoods.name;
        this.selGoods.isEdit = true;
        const item = this.goods.list.find((v) => v.id == orderGoods.productId);
        console.log(item);
        return this.showSelGoods({ ...item, ...orderGoods });
      }
      if (key === "gift") {
        const isGift = orderGoods.isGift === "true" ? "flase" : "true";
        this.updateOrder({ isGift: isGift === "true" ? true : false });
        return;
      }
      if (key === "pack") {
        const isPack = orderGoods.isPack === "true" ? "flase" : "true";
        this.updateOrder({ isPack: isPack === "true" ? true : false });
        return;
      }
      if (key === "del") {
        return this.removeCart();
      }
      if (key === "save") {
        this.prveOrder.list.push({
          cart: this.order.list,
          id: Date.now(),
          created_at: `${new Date().getHours()}:${new Date().getMinutes()}`,
          goods_num: this.allNumber,
          order_total: this.allPrice,
        });
        localStorage.setItem(
          "orderList",
          JSON.stringify(
            this.prveOrder.list.map((v) => {
              return { ...v, cart: JSON.stringify(v.cart) };
            })
          )
        );
        this.order.list = [];
        this.order.selIndex = -1;

        this.changeOrderSel(-1);
        return;
      }
      if (key === "getOrder") {
        this.prveOrder.show = true;
        this.getPrveCart();
        return;
      }
      if (key === "returnCart") {
        console.log(this.order);
        let selGoods = undefined;
        if (this.order.selPlaceNum == -10) {
          selGoods = { ...this.order.seatFee, num: this.order.seatFee.number };
        } else {
          selGoods =
            this.order.old.list[this.order.selPlaceNum - 1].info[
              this.order.old.selIndex
            ];
        }
        console.log(selGoods);
        this.refToggle("refReturnCart", true, selGoods);
      }
    },
    //选择挂单确认
    async confirmChoosePrveOrder() {
      if (this.prveOrder.list.length <= 0) {
        return;
      }
      // const { sel } = this.prveOrder;
      // const order=this.prveOrder.list[sel];
      // const res=await $cacheOrder({
      //   orderId:order.orderId,
      //   isPending:false,
      //   tableId:this.table.tableId,
      //   masterId:order.carList[0].masterId
      // })

      const { masterId, tableId, userId, remark, id } = await $cacheOrder({
        orderId: this.prveOrder.list[this.prveOrder.sel].orderId,
        isPending: false,
      });
      this.order.orderId = id;
      console.log(this.order.orderId);

      this.masterId = masterId;
      this.isPrverOrder = true;
      console.log(masterId);
      const res = await getCart({
        masterId,
        tableId,
        vipUserId: userId != "null" ? userId : "",
      });
      this.setCart(res);
      this.prveOrder.show = false;
      // this.order.list = [];
      // this.order.masterId = masterId;
      // this.order.list = records;
      // this.prveOrder.show = false;
      // this.note.content = remark || "";

      // this.delPrveOrder(false);
    },
    //删除挂单
    async delPrveOrder(isRequest = true) {
      const { sel } = this.prveOrder;
      if (this.prveOrder.list <= 0 || sel < 0) {
        return;
      }
      const order = this.prveOrder.list[sel];
      const orderMasterId = order.carList[0].masterId;
      //当前订单是否是当前挂单
      const nowOrderIsPrverOrder =
        this.isPrverOrder && orderMasterId === this.masterId;
      if (nowOrderIsPrverOrder) {
        const res = await this.$confirm(
          "您正在删除当前购物车订单,是否删除?",
          "提示",
          {
            confirmButtonText: "确定",
            cancelButtonText: "取消",
            type: "warning",
          }
        ).catch((err) => {
          console.log(err);
        });
        if (!res) {
          return;
        }
      }
      if (isRequest) {
        const res = await $delOrder({
          orderId: order.orderId,
        });
        if (nowOrderIsPrverOrder) {
          this.note.content = "";
          this.order.list = [];
        }
        this.$notify({
          message: "删除成功",
          type: "success",
        });
      }
      this.prveOrder.list.splice(sel, 1);
      this.prveOrder.sel = sel - 1 <= 0 ? 0 : sel - 1;
    },
    //打开挂起订单
    async cacheOrderShow() {
      this.prveOrder.show = true;
      const res = await this.getCacheOrder(true);
      this.prveOrder.list = res;
      if (this.prveOrder.list.length && this.prveOrder.sel !== -1) {
        const item = this.prveOrder.list[this.prveOrder.sel];
        console.log(item);
        if (item) {
          this.prveOrder.selCart = item.carList;
        }
      }
    },
    //获取挂起订单
    async getCacheOrder(isReturn = false) {
      if (isReturn) {
        return $getCacheOrder({ tableId: this.table.tableId });
      }
      const res = await $getCacheOrder({ tableId: this.table.tableId });
      this.prveOrder.list = res;
    },
    //存单
    async saveOrder() {
      this.createOrderClose();
      const res = await $cacheOrder({
        masterId: this.masterId,
        tableId: this.table.tableId,
        vipUserId: this.vipUser.id,
        isPending: true,
        note: this.note.content,
      });
      this.isPrverOrder = false;
      this.order.masterId = "";
      this.order.list = [];
      this.changeOrderSel(-1);
      this.note.content = "";
      this.order.orderId = "";
      this.$nextTick(() => {
        this.getCacheOrder();
      });
      await this.getMasterId();
    },
    // 删除购物车商品
    removeCart() {
      const orderGoods = this.order.list[this.order.selIndex];
      $removeCart({
        cartId: orderGoods.id,
        tableId: this.table.tableId,
      });
      this.order.list.splice(this.order.selIndex, 1);
      const newval = this.order.selIndex - 1;
      this.changeOrderSel(newval <= 0 ? 0 : newval);

      //  this.$message({
      //         type: "success",
      //         message: "清除成功!",
      //       });
    },
    // 点击订单里的加减改变购物车商品数量
    async changeOrderNumber(index, isReduce) {
      if (index < 0) {
        return;
      }
      this.changeOrderSel(index);
      console.log(index);
      console.log(isReduce);
      const item = this.order.list[index];
      const mumber = item.number * 1;
      const newval = mumber + (isReduce ? -1 : 1);
      if (newval <= 0) {
        return this.removeCart();
      }
      if (newval >= 100000) {
        return;
      }
      // const res= await addCart({
      //    productId: item.productId,
      //     skuId: item.skuId,
      //     tableId: this.table.tableId,
      //     num: newval, // 0会删除此商品
      //     isPack: false, // 是否打包
      // })
      this.order.list[index].number = newval;
      this.order.number = newval;
      this.order.cacheNumber = newval;
    },
    // 点击右侧控制列表上的加减改变购物车商品数量
    changeOrderGoodsNumber(isReduce) {
      if (this.order.selIndex < 0) {
        return;
      }
      const item = this.order.list[this.order.selIndex];
      console.log(item);
      const mumber = item.number * 1;
      const newval = mumber + (isReduce ? -1 : 1);
      if (newval <= 0) {
        return;
      }
      if (newval >= 100000) {
        return;
      }
      console.log(newval);

      // this.order.list[this.order.selIndex].number = newval;
      this.order.number = newval;
      this.order.cacheNumber = newval;
    },
    //清空购物车
    clearCart() {
      // if (this.order.list.length <= 0) {
      //   return;
      // }
      this.$confirm("确定要清空点餐列表吗?", "提示", {
        confirmButtonText: "确定",
        cancelButtonText: "取消",
        type: "warning",
      })
        .then(() => {
          $clearCart({
            masterId: this.masterId,
            tableId: this.table.tableId,
          }).then((res) => {
            this.order.list = [];
            this.changeOrderSel(-1);
            this.$message({
              type: "success",
              message: "清除成功!",
            });
          });
        })
        .catch(() => {});
    },
    skuNumberAdd() {
      const number = Number(this.skuGoods.number);
      if (number > 10000) {
        return;
      }
      this.skuGoods.number = number + 1;
    },
    skuNumberReduce() {
      if (this.skuGoods.number - 1 <= 0) {
        return;
      }
      this.skuGoods.number -= 1;
    },
    toggleShowAll() {
      this.category.showAll = !this.category.showAll;
    },
    changeCategoryId(item) {
      this.goods.query.categoryId = item.id;
    },
    async getCategory() {
      const { content } = await tbShopCategoryGet({
        page: 0,
        size: 100,
        sort: "id",
        shopId: localStorage.getItem("shopId"),
      });
      this.category.list = content.reduce((prve, cur) => {
        prve.push(cur);
        return [...prve, ...cur.childrenList];
      }, []);
      this.category.list.unshift({
        id: "",
        name: "全部",
      });
    },
    //改变购物车菜品选中
    changeOrderSel(index) {
      this.order.selPlaceNum = 0;
      this.order.selIndex = index;
      this.order.selGoods = this.order.list[index];
      this.order.old.selIndex = -1;
    },
    //改变已下单菜品选中
    changeOrderOldSel(index, canChangeNumber, placeNum) {
      //是否是历史订单商品
      const isOld = placeNum >= 1;
      this.order.selIndex = -1;
      this.order.old.selIndex = index;
      this.order.selPlaceNum = placeNum;
      const list = this.order.old.list.find((v) => v.placeNum == placeNum);
      this.order.selGoods = list.info[index];
      this.order.cacheNumber = list.info[index].number || 1;
    },
    chooseSkuConfirm() {
      if (this.timer) {
        return;
      }
      this.skuGoodsAdd();
      this.timer = setTimeout(() => {
        clearTimeout(this.timer);
        this.timer = null;
      }, 500);
      console.log(this.timer);
    },
    async skuGoodsAdd() {
      let name = this.selGoods.skuList.reduce((prve, cur) => {
        return prve + cur.sel + ",";
      }, "");
      name = name.substring(0, name.length - 1);
      // const item = this.selGoods.data.specList.find((v) => v.specSnap === name);
      const item = this.selGoods.skuMap[name];
      if (!item.isGrounding) {
        //该商品已经下架
        return this.$notify({
          title: "该商品规格已经下架",
          type: "error",
        });
      }
      let res = "";

      console.log(orderGoods);
      //更改购物车订单商品规格数量
      if (this.selGoods.isEdit) {
        res = await $updateCart({
          cartId: this.order.list[this.order.selIndex].id,
          productId: this.selGoods.data.productId,
          skuId: item.id,
          tableId: this.table.tableId,
          num: this.skuGoods.number, // 0会删除此商品
        });
        this.$set(this.order.list, this.order.selIndex, {
          ...res,
          specSnap: name,
        });
        this.$notify({
          title: "更新成功",
          type: "success",
        });
        this.selGoods.show = false;
        this.order.cacheNumber = this.skuGoods.number;
        return;
      }

      const orderGoodsIndex = this.order.list.findIndex((V) => {
        return V.skuId == item.id && V.productId == this.selGoods.data.id;
      });
      const orderGoods =
        orderGoodsIndex != -1 ? this.order.list[orderGoodsIndex] : undefined;

      if (orderGoods) {
        //更新
        const newNum =
          (orderGoods ? orderGoods.number * 1 : 0) + this.skuGoods.number;
        res = await $updateCart({
          cartId: orderGoods.id,
          productId: this.selGoods.data.id,
          skuId: item.id,
          tableId: this.table.tableId,
          num: newNum, // 0会删除此商品
          isPack: false, // 是否打包
        });
        if (this.key && orderGoodsIndex == -1) {
          this.orderListPush({
            ...res,
            specSnap: name,
            number: this.skuGoods.number,
          });
        } else {
          orderGoods.number += this.skuGoods.number;
          this.order.selPlaceNum = 0;
          this.changeOrderSel(orderGoodsIndex);
          this.order.cacheNumber = orderGoods.number;
        }
      } else {
        //添加
        console.log(this.table);
        res = await addCart({
          masterId: this.masterId,
          vipUserId: this.vipUser.id,
          productId: this.selGoods.data.id,
          skuId: item.id,
          tableId: this.table.tableId,
          num: this.skuGoods.number, // 0会删除此商品
          isPack: false, // 是否打包
        });
        this.orderListPush({ ...res, specSnap: name });
        // this.orderListPush({
        //   skuId: item.id,
        //   number: this.skuGoods.number,
        //   specSnap: name,
        // });
      }

      this.$notify({
        title: orderGoods ? "更新成功" : "添加成功",
        type: "success",
      });
      this.selGoods.show = false;
    },
    orderListPush(item) {
      const { isPack, isGift } = item;
      // const isPack=item.isPack==='false'?false:true
      // const isGift=item.isGift==='false'?false:true
      this.order.list.push({ ...item, isPack, isGift });
      this.order.selPlaceNum = 0;
      this.changeOrderSel(this.order.list.length - 1);
    },
    //设置规格按钮的禁止状态
    setTagDisabled() {
      const selArr = this.selGoods.skuList.reduce((prve, cur) => {
        if (cur.sel) {
          prve.push(cur.sel);
        } else {
        }
        return prve;
      }, []);
      console.log(selArr);
      let selArrAllGroup = generateCombinations(selArr, selArr.length - 1);
      console.log(selArrAllGroup);
      const matchArr = [];
      for (let key in this.selGoods.skuMap) {
        const goods = this.selGoods.skuMap[key];
        const keyArr = key.split(",");
        for (let spe of selArrAllGroup) {
          if (arrayContainsAll(keyArr, spe)) {
            matchArr.push(goods);
            break;
          }
        }
      }
      console.log(matchArr);
      const skuList = this.selGoods.skuList;
      console.log(skuList);
      //全部规格都已下架
      if (!matchArr.length) {
        for (let k in skuList) {
          for (let i in skuList[k].values) {
            this.$set(skuList[k].values[i], "disabled", true);
          }
        }
        return;
      }
      const includeSkuMap = matchArr.reduce((prve, cur) => {
        const speArr = cur.specSnap.split(",");
        for (let i of speArr) {
          if (!prve.hasOwnProperty("i")) {
            prve[i] = matchArr
              .filter((v) => v.specSnap.match(i))
              .every((v) => {
                // return isCanBuy(v,this.selGoods.data.isStock)
                return !isCanBuy(v, this.selGoods.data);
              });
          }
        }
        return prve;
      }, {});
      console.log(includeSkuMap);
      for (let i in includeSkuMap) {
        for (let k in skuList) {
          const index = skuList[k].valueArr.findIndex((val) => val === i);
          if (index !== -1) {
            this.$set(skuList[k].values[index], "disabled", includeSkuMap[i]);
          }
        }
      }
    },
    changeTagSel(index, val) {
      this.$set(this.selGoods.skuList[index], "sel", val.name);
      let specSnap = this.selGoods.skuList.reduce((a, b) => {
        return a + b.sel + ",";
      }, "");
      specSnap = specSnap.substring(0, specSnap.length - 1);
      for (let sku of this.selGoods.skuList) {
        console.log(sku);
      }
      this.setTagDisabled();
      const canChooseGoods = this.selGoods.skuList.every((v) => v.sel);
      if (canChooseGoods) {
        const skuGoods = this.selGoods.skuMap[specSnap];
        this.skuGoods.data = skuGoods;
        this.skuGoods.number = skuGoods.suit || 1;
      }
    },
    onclose() {
      this.$emit("close");
      this.reset();
    },
    reset() {
      // this.goods.list = [];
      this.order.status = "";
      this.loading = false;
      this.table = "";
      this.order.list = [];
      this.order.query.page = 1;
      this.goods.total = 0;
      this.order.list = [];
      this.order.selIndex = -1;
      this.order.selPlaceNum = -1;
      this.order.old.list = [];
      this.order.selGoods = "";
      this.order.seatFee = { totalAmount: 0 }; //餐位费
      this.prveOrder.list = [];
      this.prveOrder.selIndex = -1;
      this.order.old.selIndex = -1;
      this.isCreateOrder = false;
      this.createOrder.status = "";
      this.createOrder.code = "";
      this.note.content = "";
      this.vipUser = { id: "" };
      this.order.masterId = "";
      this.allPack = false;
      this.note.content = "";
      this.isPrverOrder = false;
      this.createOrder.discount = 1;
      this.order.cacheNumber = 1;
      this.key = "";
      this.order.orderId = "";
      this.perpole = "";
      this.useTypes.sel = "dine-in";
    },
    //设置购物车数据
    setCart(res) {
      console.log(res);
      const { seatFee } = res;
      this.order.seatFee = seatFee
        ? {
            ...seatFee,
            totalNumber: seatFee.num || seatFee.number,
            num: seatFee.number,
            name: seatFee.name || seatFee.productName,
            totalAmount: seatFee.priceAmount || seatFee.totalAmount,
          }
        : this.order.seatFee;
      console.log(this.order.seatFee);
      this.perpole = res.seatFee ? res.seatFee.totalNumber : 1;
      const nowCart = res.records.find((v) => v.placeNum == 0);
      // this.order.list = nowCart ? nowCart.info.filter(v=>v.isGift!=='true') : [];
      this.order.list = nowCart ? nowCart.info : [];
      const oldCart = res.records.filter((v) => v.placeNum != 0);
      this.order.old.list = oldCart ? oldCart : [];
      // this.order.gift.list = returnGiftArr(res.records);
      console.log(this.order.old.list);
    },
    //获取购物车数据
    async getCart() {
      console.log(this.table);
      const res = await getCart({
        ...this.order.query,
        masterId: this.masterId,
        tableId: this.table.tableId,
      });
      this.setCart(res);
      // if (this.key|| res.records.length) {
      //   this.order.old.list = res.records;
      // } else {
      //   this.order.list = res.records;
      // }
    },
    showSelGoods(item) {
      console.log(item);
      this.selGoods.data = item;
      this.selGoods.skuMap = {};
      const specList = item.specList;
      this.setSelGoodsSkuMap(specList);
      this.setSelGoodsSkuList(
        JSON.parse(item.skuResult.tagSnap),
        item.specSnap
      );
      this.setTagDisabled();
      const skuGoods = this.selGoods.skuMap[item.specSnap];
      this.skuGoods.data = skuGoods;
      this.skuGoods.number = item.number ? item.number : skuGoods.suit || 1;
      this.selGoods.title = item.name;
      this.selGoods.show = true;
    },
    //多规格商品弹窗时，找到默认可以下单的规格商品
    findGoods(skuList = [], goodsListMap = {}) {
      const skuMapNumber = skuList.reduce((prve, cur) => {
        for (let i in cur.valueArr) {
          prve[cur.valueArr[i]] = i;
        }
        return prve;
      }, {});
      const canBudyGoods = this.selGoods.data.specList
        .filter((v) => isCanBuy(v, this.selGoods.data))
        .sort((a, b) => {
          const aNumber = a.specSnap.split(",").reduce((prve, cur) => {
            return prve + skuMapNumber[cur];
          }, 0);
          const bNumber = b.specSnap.split(",").reduce((prve, cur) => {
            return prve + skuMapNumber[cur];
          }, 0);
          return aNumber - bNumber;
        });
      return canBudyGoods[0];
    },
    //设置商品默认选中,规格禁止以及选中
    setSkugoodsDefaultInit() {
      this.skuGoods.data = undefined;
      const skuList = this.selGoods.skuList;
      const goodsListMap = this.selGoods.skuMap;
      const skuGoods = this.findGoods(skuList, goodsListMap);
      console.log(skuGoods);
      if (skuGoods) {
        this.skuGoods.data = skuGoods;
        this.skuGoods.number = skuGoods.suit || 1;
        skuGoods.specSnap.split(",").map((v, index) => {
          skuList[index].sel = v;
        });
      }
      this.setTagDisabled();
    },
    // 设置当前选中商品skuList
    setSelGoodsSkuList(skuList, specSnap) {
      const specSnapArr = specSnap ? specSnap.split(",") : [];
      this.selGoods.skuList = skuList.map((v, index) => {
        const values = v.value.split(",");
        return {
          ...v,
          valueArr: values,
          sel: specSnap ? specSnapArr[index] : "",
          values: values.map((name) => {
            return { name, disabled: false };
          }),
        };
      });
    },
    setSelGoodsSkuMap(specList) {
      for (let i in specList) {
        this.selGoods.skuMap[specList[i].specSnap] = specList[i];
      }
    },
    //根据右侧商品单规格多规格做不同处理
    async goodsClick(item) {
      // if (!this.table) {
      //   return this.$message.error("暂不支持无桌台下单，请先选择桌台");
      // }
      if (item.typeEnum === "sku") {
        this.selGoods.data = item;
        this.selGoods.skuMap = {};
        const specList = item.specList;
        this.setSelGoodsSkuMap(specList);
        console.log(this.selGoods.skuMap);
        this.setSelGoodsSkuList(JSON.parse(item.skuResult.tagSnap));
        this.setSkugoodsDefaultInit();
        this.selGoods.title = item.name;
        this.selGoods.show = true;
        return;
      }
      //单规格
      const orderGoodsIndex = this.order.list.findIndex((V) => {
        return V.skuId == item.specList[0].id && V.productId == item.id;
      });
      const orderGoods =
        orderGoodsIndex != -1 ? this.order.list[orderGoodsIndex] : undefined;
      // const orderGoods =  this.order.list.find((V) => {
      //   return V.skuId == item.specList[0].id && V.productId == item.id;
      // });
      let res = "";
      if (orderGoods) {
        //更新
        // res = await $updateCart({
        //   cartId: orderGoods.id,
        //   productId: item.id,
        //   skuId: item.specList[0].id,
        //   tableId: this.table.tableId,
        //   num: orderGoods.number * 1 + item.specList[0].suit, // 0会删除此商品
        // });
        orderGoods.number += item.specList[0].suit;
        this.order.number = orderGoods.number;
        this.changeOrderSel(orderGoodsIndex);
      } else {
        //增加
        console.log(item);
        if (item.specList.length <= 0) {
          return this.$message.error("该商品缺少skuID,skuList是空数组");
        }
        res = await addCart({
          masterId: this.masterId,
          vipUserId: this.vipUser.id,
          productId: item.id,
          skuId: item.specList[0].id,
          tableId: this.table.tableId,
          num: item.specList[0].suit, // 0会删除此商品
          isPack: false, // 是否打包
        });
        this.orderListPush(res);
      }
    },
    async getGoods() {
      if (this.goods.status == "end") {
        return;
      }
      this.goods.status = "loadmore";
      const res = await getGoodsLists(this.goods.query);
      let $goodsMap = {};
      const goods = res.records.filter((v) => {
        if (!v) {
          return false;
        }
        let isShow = true;
        // if (v.typeEnum !== "sku") {
        //   isShow = v.specList.length >= 1;
        // }
        v.specList.map((spe) => {
          $goodsMap[`${v.id}_${spe.id}`] = spe;
        });
        return isShow;
      });
      for (let i in goods) {
        this.goods.list.push(goods[i]);
      }
      this.goods.status =
        this.goods.list.length >= res.total ? "end" : "loadmore";
      this.goods.total = res.total;
      this.$goodsData = goods;
    },
    async open(params) {
      const item = {
          name: params.table_name,
          tableId: params.tableId,
          useType: params.useType,
          maxCapacity: params.maxCapacity * 1,
          masterId: params.masterId,
          orderId: params.orderId,
        },
        key = params.key,
        perpoleNumber = params.num || "";
      this.key = key;

      const shopId = localStorage.getItem("shopId");
      const shopInfo = await tbShopInfo(shopId);
      for (let i in shopInfo.eatModel) {
        let model = shopInfo.eatModel[i];
        model = model == "take-out" ? model.replace(/-/g, "") : model;
        const item = this.useTypes.list.find((v) => v.value == model);
        if (item) {
          item.disabled = false;
        }
      }
      this.shopInfo = shopInfo;
      if (!params.masterId) {
        await this.getMasterId();
        this.getCart();
      } else {
        this.masterId = params.masterId;
      }
      if (key == "isJieZhang") {
        this.payAfter = false;
      } else {
        this.setPostPay();
      }
      this.setUseType();
      this.getGoods();
      this.getCategory();
      this.getTable();
      console.log(params);

      if (key == "isJieZhang") {
        if (params.orderId) {
          const orderRes = await this.getOrderData(params);
          if (orderRes.status != "unpaid") {
            this.$router.replace({ path: "/tool/Instead/index" });
          }
        }
        this.isCreateOrder = true;
        return;
      }
      if (key == "isPayOrder") {
        this.isCreateOrder = true;
      }
      this.perpole = perpoleNumber;

      // this.getCart();
      // this.getCacheOrder();
      // if (!params) {
      //   //无台桌代客下单
      //   return;
      // }
      //有台桌时的代客下单
      if (item && item.useType) {
        localStorage.setItem("useType", item.useType);
        this.useTypes.sel =
          item.useType == "takeout"
            ? item.useType
            : item.useType.replace(/-after|-before/g, "");
      }

      this.table = params.tableId ? item : "";
      if (params.tableId) {
        this.onTableChange();
      }
    },

    async getOrderData(params) {
      const orderId = params ? params.orderId : this.createOrder.data.id;

      const res = await tbOrderInfoDetail(
        params ? params.orderId : this.createOrder.data.id
      );
      this.masterId = res.masterId ? res.masterId : this.masterId;
      if (res.tableId) {
        await this.getTableDetail(res.tableId);
      }
      //空闲并且免餐位费设置默认就餐人数1
      if (this.table.tableId && !this.shopInfo.isTableFee) {
        this.perpole = res.seatInfo ? res.seatInfo.num : 1;
        await this.changePerpole();
      }
      this.createOrder.data = res;
      if (res.memberId) {
        await this.getCalcUsablePoints();
        queryAllShopUser({ id: res.memberId }).then((res) => {
          if (res.content[0]) {
            this.vipUser = res.content[0];
            this.points.maxUsablePoints = Math.min(
              this.points.maxUsablePoints,
              this.vipUser.accountPoints || 0
            );
          }
        });
      }

      if (res.status != "unpaid") {
        return res;
      }
      this.order.packFee.totalAmount = res.seatInfo || { totalAmount: 0 };
      const goodsMap = {};
      for (let i in res.detailList) {
        const goods = res.detailList[i];
        if (goods.productId != "-999") {
          if (goodsMap.hasOwnProperty(goods.placeNum)) {
            goodsMap[goods.placeNum].push(goods);
          } else {
            goodsMap[goods.placeNum] = [goods];
          }
        }
      }
      this.order.old.list = Object.entries(goodsMap).map(([key, value]) => ({
        info: value.map((v) => {
          return {
            ...v,
            coverImg: v.productImg,
            name: v.productName,
            specSnap: v.productSkuName,
            number: v.num,
            totalAmount: v.priceAmount,
            salePrice: v.price,
            isGift: v.gift ? "true" : "false",
            isPack: v.pack ? "true" : "false",
          };
        }),
        placeNum: key,
      }));
      console.log(this.order.old.list);
      return res;
    },
    close() {
      this.reset();
      if (this.table.tableId) {
        this.$router.replace({ path: "/tool/table_list" });
      } else {
        this.$router.replace({ path: "/tool/Instead/index" });
        // this.reset();
        // this.$router.replace({ path: "/tool/Instead/index" });
      }
      this.informationdialogshow = false;
      this.$emit("close");
    },
    resetCommodityArr() {
      this.commodityArr = [];
      this.$refs.addSelect.resetFields();
    },
    haocaiCancel() {
      this.informationdialogshow = false;
    },
    haocaiConfirm() {
      console.log(haocaiSelectedMap);

      this.$emit("confirm", haocaiSelectedMap);
      this.informationdialogshow = false;
      return;
    },
    // 分页回调
    paginationChange(e) {
      this.tableData.page = e - 1;
      this.getTableData();
    },
    paginationChangeinformation(e) {
      this.goods.query.page = e;
      this.getGoods();
    },
  },
};
</script>
  
  <style scoped lang="scss">
.selQuan {
  border: 1px solid #d9d9d9;
  border-radius: 4px;
  margin-left: 12px;
}
.lingshicai {
  border: 1px solid #dddfe6;
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-content: center;
}
/* 针对所有input type="number" */
input[type="number"]::-webkit-inner-spin-button,
input[type="number"]::-webkit-outer-spin-button {
  -webkit-appearance: none;
  margin: 0;
}
.full-screen {
  margin-left: 10px;
  svg {
    width: 24px;
    height: 24px;
  }
  &:hover {
    path {
      fill: #1890ff;
    }
  }
}
.head {
  border-bottom: 1px solid #ebebeb;
  padding-bottom: 16px;
}

.icon-add {
  color: #1890ff;
  font-size: 22px;
  cursor: pointer;
}
.prve-car-len {
  position: absolute;
  display: flex;
  justify-content: center;
  align-items: center;
  top: 2px;
  right: 2px;
  height: 16px;
  width: 16px;
  font-size: 12px;
  color: rgb(255, 255, 255);
  border-radius: 50%;
  background-color: rgb(250, 85, 85);
}
::v-deep .number-box .el-input__inner {
  border: none;
}
.el-dialog {
  font-size: 14px;
  .bg-fff {
    padding: 18px 24px 10px 20px;
    display: flex;
    flex-direction: column;
  }
}
.bg-fff {
  background-color: #fff;
  height: 100%;
}
::v-deep .el-button--text {
  // color: #000;
}
::v-deep .meal_box .el-button-group {
  width: 100%;
  display: flex;
}
::v-deep .meal_box .el-button-group .el-button {
  flex: 1;
}
::v-deep .meal_box .el-button-group .active {
  border: 1px solid #409eff !important;
  color: #409eff !important;
  background: rgba(24, 144, 255, 0.1) !important;
  z-index: 10;
}
::v-deep .number-box .el-input__inner {
  border: none;
  padding: 0 4px;
  text-align: center;
}
::v-deep .el-empty {
  padding: 0;
}
::v-deep .el-button--success:not(.is-disabled) {
  background: #22bf64;
  color: #fff;
}
::v-deep .el-tag--dark .el-tag--success {
  background: #22bf64;
  color: #fff;
}
::v-deep .flex-1 .el-button {
  width: 100%;
}
::v-deep .el-button--success.is-plain {
  background: rgba(34, 191, 100, 0.1);
  color: #22bf64;
  border: 1px solid #22bf64;
}
::v-deep .el-button--medium {
  padding-top: 12px;
  padding-bottom: 12px;
}
// ::v-deep .el-button.is-plain:hover, .el-button.is-plain:focus{
//   background: rgba(34, 191, 100, .1);
//     color: #22bf64;
//     border: 1px solid #22bf64;
// }

::v-deep .number-box .el-input__inner::-webkit-inner-spin-button {
  -webkit-appearance: none;
  margin: 0;
}
::v-deep .number-box .el-input__inner::-webkit-outer-spin-button {
  -webkit-appearance: none;
  margin: 0;
}
.carts_list_title {
  padding: 16px 0 12px 0;
  display: flex;
  align-items: center;
  font-size: 12px;
  color: rgba(0, 0, 0, 0.4);
  &::after {
    content: "";
    flex: 1;
    height: 1px;
    background-color: #ebebeb;
    margin-left: 10px;
  }
}
.border-r {
  border-right: 1px solid #ebebeb;
}
.lh-16 {
  line-height: 16px;
}
.good_info_discount {
  height: 16px;
  padding: 0 3px;
  color: #ff3f3f;
  background-color: rgba(255, 63, 63, 0.1);
  border-radius: 2px;
  margin-left: 6px;
  font-size: 12px;
  white-space: nowrap;
}
.icon-remove {
  border: 1px solid #d8d8d8;
  width: 22px;
  height: 22px;
  display: flex;
  justify-content: center;
  align-items: center;
  border-radius: 50%;
  box-sizing: border-box;
  cursor: pointer;

  &::after {
    content: "";
    display: block;
    width: 10px;
    height: 1px;
    background: #999;
  }
}
.row-center {
  justify-content: center;
}
.sku-group-text {
  text-align: left;
  color: #666;
  font-size: 11px;
  margin-top: 2px;
}

.price {
  font-size: 18px;
  text-align: left;
  color: rgb(255, 81, 82);
  font-weight: 600;
}
.youhui {
  color: #c12a2a;
  font-size: 13px;
  line-height: 16px;
}
.vip {
  font-size: 10px;
  padding: 2px 5px;
  background: #f7793d;
  color: #fff;
  border-radius: 4px;
  margin-left: 10px;
  font-size: 10px;
}
::v-deep .el-dialog__footer {
  border-top: 1px solid #efefef;
}

.sku-bottom {
  padding: 14px 12px 5px;
}

.relative {
  position: relative;
}
.col-baseline {
  align-items: baseline;
}
.cur-pointer {
  cursor: pointer;
}
.flex-x-y-center {
  display: flex;
  justify-content: center;
  align-items: center;
  background-color: #efefef;
}
::v-deep .el-dialog__body {
  padding: 0 20px;
}
.absolute {
  position: absolute;
}

.order-number-box {
  position: relative;

  .absolute {
    width: 60px;
    height: 40px;
    right: -30px;
    top: -12px;
    position: absolute;

    .order-input-number {
      position: absolute;
      right: -6px;
      top: 0;
      justify-content: center;
      align-items: center;
      display: none;
      background-color: #fff;
      border: 1px solid #e4e7ed;
      border-radius: 4px;
      box-shadow: 0 2px 12px 0 rgba(0, 0, 0, 0.06);
      padding: 9px 6px;
      background-color: #fff;
      height: 40px;
    }

    &:hover .order-input-number {
      display: flex;
    }
  }
}

.ft-12 {
  font-size: 12px;
}

.ft-18 {
  font-size: 18px;
}

.transition {
  transition: all 0.2s ease-in-out;
}

::v-deep .el-dialog__header {
  border-bottom: 1px solid #efefef;
}

.tableId {
  padding: 8px 15px;
  border: 1px solid #dcdfe6;
  font-size: 12px;
  border-radius: 3px;
  cursor: pointer;

  &:hover {
    border-color: #409eff;
    color: #409eff;
    background-color: rgba(24, 144, 255, 0.1);
  }
}

.cur-pointer {
  cursor: pointer;
}

.flex-1 {
  flex: 1;
}

.flex-wrap {
  flex-wrap: wrap;
}

.mt-14 {
  margin-top: 14px;
}
.youhuiAllPrice {
  color: #c12a2a;
  font-size: 13px;
  line-height: 16px;
}

.my-btn {
  outline: none;
  height: 40px;
  font-size: 14px;
  line-height: 40px;
  color: #000;
  justify-content: center;
  align-items: center;
  border: 1px solid #dcdfe6;
  border-radius: 4px;
  cursor: pointer;
  white-space: nowrap;
  padding: 0 5px;
  background-color: #fff;
  position: relative;
  &.primary {
    color: #fff;
    background-color: #1890ff;
    border-color: #1890ff;
  }
  &.disabled {
    color: #c0c4cc;
    cursor: not-allowed;
    background-color: #fff;
    border-color: #ebeef5;
  }
}
.flex-xy-cnter {
  justify-content: center;
  align-items: center;
}
.flex-wrap {
  flex: 1;
}
.headimg {
  width: 34px;
  height: 34px;
  display: block;
  border-radius: 2px;
  margin-right: 6px;
}
.take_order_list {
  padding: 14px 0;
  display: flex;
  justify-content: space-between;
  .tol_left_list {
    height: 360px;
    margin-right: 24px;
    overflow-y: scroll;
    &::-webkit-scrollbar {
      width: 0;
    }
    .tolll_item {
      border: 1px solid rgb(247, 247, 250);
      height: 86px;
      width: 130px;
      padding: 10px 14px;
      margin-bottom: 12px;
      border-radius: 4px;
      color: #303133;

      background-color: #f7f7fa;
      &.active {
        border: 1px solid rgb(0, 194, 95);
        background-color: rgba(0, 194, 95, 0.1);
        color: rgb(0, 194, 95) !important;
        .tollli_time,
        .tollli_num {
          color: rgb(0, 194, 95) !important;
        }
      }
      cursor: pointer;
      .tollli_index {
        font-weight: 600;
        font-size: 18px;
      }
      .tollli_price {
        margin-top: 8px;
        font-size: 14px;
      }
      .tollli_time_and_num {
        margin-top: 6px;
        display: flex;
        justify-content: space-between;
        .tollli_time,
        .tollli_num {
          font-size: 12px;
          color: #909399;
        }
      }
    }
  }

  .tol_right_list {
    flex: 1;
    height: 360px;
    overflow-y: scroll;
    &::-webkit-scrollbar {
      width: 0;
    }
    .tolrl_item {
      display: flex;
      padding: 2px 2px 13px 2px;
      margin-bottom: 12px;
      border-bottom: 1px solid #ebebeb;
      .tolrli_img {
        img {
          width: 40px;
          height: 40px;
          border-radius: 4px;
        }
      }
      .tolrli_right {
        display: flex;
        justify-content: space-between;
        flex: 1;
        flex-direction: column;
        padding: 1px 0 1px 8px;
        .tr_top {
          display: flex;
          justify-content: space-between;
          .trt_name {
            width: 150px;
            font-size: 14px;
            color: #212121;
            white-space: nowrap;
            overflow: hidden;
            text-overflow: ellipsis;
          }
          .trt_num {
            font-size: 14px;
            color: #212121;
          }
          .trt_price {
            width: 100px;
            text-align: right;
            font-size: 14px;
            color: #212121;
          }
        }
        .tr_bottom {
          font-size: 12px;
          color: #999;
        }
      }
    }
  }
}

.success {
  color: #fff;
  border-color: #22bf64;
  background-color: rgb(34, 191, 100);
}

.categoty {
  position: sticky;
  top: 0;
  background-color: #f7f7fa;
  z-index: 1;
  padding-top: 14px;
  margin-left: 7px;

  .show_more_btn {
    padding: 0 10px;
    color: #333;
    font-size: 16px;
    display: flex;
    align-items: center;
    user-select: none;
    min-width: 80px;
    background: #f7f7fa;
    position: absolute;
    right: -20px;
    top: 14px;
    height: 38px;
    cursor: pointer;
    display: flex;
    justify-content: center;
    align-items: center;

    .showmore {
      transition: all 0.2s;
      margin-right: 8px;
      width: 21px;
      height: 21px;
      border-radius: 50%;
      background: #3f9eff;
      display: flex;
      justify-content: center;
      align-items: center;
    }
    &.showAll {
      .showmore {
        transform: rotate(180deg);
      }
    }
  }
}

.search-box {
  display: flex;
  justify-content: flex-end;
  margin-left: 12px;
  border-bottom: 1px solid #ebebeb;
}
::v-deep .el-dialog__title {
  font-size: 20px;
  font-weight: 600;
}
::v-deep input[aria-hidden="true"] {
  display: none !important;
}

::v-deep
  .el-radio:focus:not(.is-focus):not(:active):not(.is-disabled)
  .el-radio__inner {
  box-shadow: none !important;
}

::v-deep .categorys .el-tag--plain.el-tag--info {
  border: 1px solid #dcdfe6;
  color: #000;
  font-weight: 600;
}
.el-dialog {
  background-color: #f6f7fa;
  padding: 16px;
  width: 100%;
  height: calc(100vh - 170px);
  box-sizing: border-box;
  user-select: none;
}

::v-deep .categorys .el-tag {
  min-width: 80px;
  height: 38px;
  line-height: 38px;
  text-align: center;
  box-sizing: border-box;
  text-align: center;
  padding: 0 14px;
  font-size: 14px;
  font-weight: 600;
  border-radius: 2px;
  user-select: none;
  margin: 0 10px 10px 0;
  cursor: pointer;
}

::v-deep .tag-group .el-tag {
  min-width: 80px;
  height: 28px;
  line-height: 28px;
  text-align: center;
  box-sizing: border-box;
  text-align: center;
  padding: 0 15px;
  font-size: 14px;
  border-radius: 2px;
  user-select: none;
  margin: 0 10px 10px 0;
  cursor: pointer;
  border-radius: 4px;
}

::v-deep .tag-group .el-tag--light {
  color: #000;
  background-color: #fff;
  border: 1px solid #dcdfe6;
}
::v-deep .el-checkbox__input.is-checked .el-checkbox__inner {
  // background-color: #22bf64;
  // border-color: #22bf64;
}
::v-deep .el-checkbox__input.is-checked + .el-checkbox__label {
  // color: #22bf64;
}

::v-deep .tag-group .el-tag--dark {
  background: rgba(34, 191, 100, 0.1);
  color: #22bf64;
  border-color: #22bf64;
}
.no-search-result {
  color: #888;
  margin: 0 0 10px 7px;
}

.numberbox {
  border: 1px solid #dcdfe6;
  background-color: #fff;
  color: #000;
  min-height: 38px;
  line-height: 38px;
  text-align: center;
  border-radius: 4px;
  position: relative;
  margin: 0 0 10px;

  .reduce,
  .add {
    font-size: 28px;
    color: #999;
    height: 38px;
    line-height: 38px;
    text-align: center;
  }

  .input {
    font-size: 30px;
    display: flex;
    overflow: hidden;
    padding: 0 10px;
    height: 50px;
    border-top: 1px solid #dcdfe6;
    border-bottom: 1px solid #dcdfe6;

    input {
      height: 100%;
      width: 100%;
      box-sizing: border-box;
      outline: none;
      justify-content: center;
      border: none;
      text-align: center;
    }
  }
}
.table-item {
  cursor: pointer;
  transition: 0.2s ease-in-out;
  &:hover {
    background: #f4f9ff;
  }
}
.tag-group {
  margin-top: 10px;

  .tag-item {
    margin-bottom: 20px;

    .tag-name {
      margin-bottom: 10px;
      font-size: 12px;
      color: #999;
    }
  }
}

.flex {
  display: flex;
  align-items: center;
}

.row-between {
  justify-content: space-between;
}

.row-right {
  justify-content: flex-end;
}

.none {
  display: none !important;
}

.handle {
  font-size: 18px;
  color: #999;

  &:hover {
    cursor: grab;
  }
}

.shop_info {
  display: flex;

  .info {
    flex: 1;
    padding-left: 8px;
    display: flex;
    flex-direction: column;

    .tag_wrap {
      display: flex;
    }
  }
}

.font-bold {
  font-weight: bold;
}

.head-container .filter-item {
  margin: 0 5px 0 0;
}

.diancan {
  display: flex;
  flex: 1;
  margin-top: 10px;
  max-height: calc(100vh - 280px);
  .choose-user {
    padding-bottom: 10px;
    border-bottom: 1px solid #ebebeb;
    margin-bottom: 10px;
  }
  .order-list-all {
  }
  .order {
    border-radius: 6px;
    display: flex;
    .bottom {
      box-sizing: border-box;
      padding: 0 14px 0 14px;
      background-color: #fff;
      z-index: 10;
      .border-top {
        padding-top: 14px;
        border-top: 1px solid #ebebeb;
      }
    }

    .list {
      width: 352px;
      padding: 0 12px 0 0;
    }

    .controls {
      min-width: 106px;
      width: 106px;
      border-radius: 4px;
      background-color: #f7f7fa;
      padding: 14px 10px;
      position: relative;
      overflow-y: auto;

      .btn {
        border: 1px solid #dcdfe6;
        background-color: #fff;
        color: #000;
        min-height: 38px;
        line-height: 38px;
        text-align: center;
        border-radius: 4px;
        position: relative;
        cursor: pointer;
        margin: 0 0 10px;

        &.disabled {
          color: #999;
          pointer-events: none;
          cursor: no-drop;
          background-color: rgb(250, 250, 252);
        }
      }
    }
  }

  .goods {
    box-sizing: border-box;
    flex: 1;
    background-color: #f7f7fa;
    margin-left: 20px;
    padding: 0 15px 14px 15px;
    overflow-x: hidden;
    overflow-y: scroll;
    .goods-list {
      display: flex;
      flex-wrap: wrap;
      min-height: 10px;
      .goods-item {
        position: relative;
        cursor: pointer;
        // min-width: 98px;
        min-width: 100px;
        max-width: 100px;
        height: 100px;
        // flex: 1;
        margin: 0 7px 14px;
        border-radius: 4px;
        .timeSale {
          text-align: center;
          border-radius: 10px;
          background-color: rgb(245, 245, 245, 0.6);
          color: #fff;
          font-size: 10px;
          line-height: 16px;
          padding: 3px 10px;
          margin-top: 4px;
          width: 100%;
        }
        .sell-out {
          width: 100%;
          height: 100%;
          padding: 10px;
          background: rgba(0, 0, 0, 0.4);
          z-index: 2;
          position: absolute;
          top: 0;
          font-size: 14px;
          font-weight: 400;
          text-align: left;
          color: #fff;
        }
        overflow: hidden;
        position: relative;

        .typeEnum {
          position: absolute;
          right: 0;
          top: 0;
          border-radius: 0 0 0 10px;
          background-color: #46a6ff;
          color: #fff;
          padding: 2px 10px;
          display: none;
        }

        .info {
          font-size: 14px;
          position: absolute;
          inset: 0;
          background: rgba(46, 46, 46, 0.38);
          color: #fff;
          box-sizing: border-box;
          padding: 10px;
          display: flex;
          flex-direction: column;
          justify-content: space-between;
        }
        .img-box {
          width: 100%;
          height: 100%;
          position: relative;
        }
        .text-sell-out {
          width: 100%;
          justify-content: center;
          height: 60px;
          svg {
            width: 60px;
            height: 60px;
          }
          // z-index: 1;
          // position: absolute;
          // right: 0;
          // top: 0;
        }
        .sell-out-svg {
          position: absolute;
          left: 0;
          right: 0;
          top: 0;
          bottom: 0;
          background: rgba(0, 0, 0, 0.5);
          display: flex;
          justify-content: center;
          align-items: center;
        }
        img {
          width: 100%;
          height: 100%;
        }
        &.layout-img-and-text {
          min-width: 116px !important;
          max-width: 136px !important;
          height: 175px;
          background-color: #fff;
          display: flex;
          flex-direction: column;
          box-shadow: 0 4px 12px 0 rgba(0, 0, 0, 0.07);
          .img-box {
            width: 136px;
          }
          img {
            width: 136px;
            height: 125px;
          }
          .info {
            position: inherit;
            background-color: #fff;
            padding: 4px 4px 8px;
            color: #000;
            .name {
              font-size: 15px;
              font-weight: 600;
              height: 20px;
              line-height: 20px;
              overflow: hidden;
              text-overflow: ellipsis;
              white-space: nowrap;
              margin-bottom: 2px;
            }
            .price {
              font-size: 13px;
            }
          }
        }
        &.layout-text {
          margin: 0 5px 10px;
          box-shadow: 0 4px 12px 0 rgba(0, 0, 0, 0.08);
          min-width: 128px !important;
          max-width: 148px !important;
          background-color: #fff;
          height: auto;
          .info {
            background-color: #fff;

            position: inherit;
            color: #000;
            .name {
              font-weight: 600;
              font-size: 15px;
              color: #000;
              line-height: 22px;
              overflow: hidden;
              text-overflow: ellipsis;

              height: 44px;
            }

            .price {
              font-weight: 600;
              font-size: 16px;
              margin: 6px 0 0;
            }
          }
          img {
            display: none;
          }
        }
        &.layout-text.sell-out {
          .info {
            color: #c8c8c8;

            .name {
              color: #c8c8c8;
            }
          }
        }
      }
    }
  }
}

.carts {
  flex-direction: column;
  background: #fff;
  height: 100%;
  position: relative;
  z-index: 10;
}

.carts .title,
.carts {
  display: flex;

  align-items: center;
  width: 100%;
}

.carts .title {
  justify-content: space-between;
  height: 64px;
  border-bottom: 1px solid #ebebeb;
  padding: 20px;
  padding-top: 30px;
}

.carts .title .left {
  font-family: PingFangSC-Medium;
  font-weight: 500;
  font-size: 18px;
  color: #000;
}

.carts .title .right {
  font-size: 14px;
  cursor: pointer;
}

.carts .box_status {
  width: 370px;
  height: 58px;
  background: #fff;
  border: 1px solid #dcdfe6;
  border-radius: 4px;

  display: flex;

  justify-content: center;

  align-items: center;
  margin-top: 20px;
  font-family: MicrosoftYaHei;
  font-size: 20px;
  color: rgba(0, 0, 0, 0.8);
  letter-spacing: 1.25px;
  text-align: center;
}

.carts .box_status span {
  padding: 0 5px;
}

.number_list_box {
  width: 370px;
  background: #fff;
  border-radius: 3px;
  margin: 20px 0;
}

.submit {
  width: 366px;
  height: 44px;
  background: #22bf64;
  border-radius: 2px;

  display: flex;

  justify-content: center;

  align-items: center;
  font-size: 14px;
  color: #fff;
  font-family: PingFangSC-Regular;
  font-weight: 400;
  margin-bottom: 40px;
  cursor: pointer;
}

.yd-keyboard {
  justify-content: center;
  margin-top: -8px;
  margin-left: -8px;
}

.mini-number-box1 .mini-number,
.yd-keyboard {
  display: flex;

  flex-direction: column;
}

.mini-number-box1 .mini-number {
  margin-left: 8px;
  border: 1px solid #dcdfe6;
}

.mini-number-box1 .mini-number .key-line {
  margin-top: 0;
}

.mini-number-box1 .mini-number .key {
  width: 122px;
  height: 60px;
  -webkit-box-shadow: none;
  box-shadow: none;
  border-radius: 0;
  margin-left: 0;
}

.mini-number-box1 .mini-number .key:not(:last-child) {
  border-right: 1px solid #dcdfe6;
}

.mini-number-box1 .mini-number .key-line:not(:last-child) {
  border-bottom: 1px solid #dcdfe6;
}

.mini-number-box2 {
  display: flex;

  justify-content: center;
}

.mini-number-box2 .key {
  width: 80px;
  height: 70px;
}

.mini-number-box2 .function-button {
  display: flex;

  flex-direction: column;
}

.mini-number-box2 .function-button .key {
  margin-top: 8px;
}

.key-line {
  margin-top: 8px;
}

.key,
.key-line {
  display: flex;

  justify-content: center;
}

.key {
  width: 64px;
  height: 64px;
  background: #fff;
  -webkit-box-shadow: 0 2px 4px 0 rgba(0, 0, 0, 0.10196078431372549);
  border-radius: 4px;

  align-items: center;
  margin-left: 8px;
  font-family: PingFangSC-Regular;
  font-weight: 400;
  font-size: 20px;
  color: rgba(0, 0, 0, 0.8);
  text-align: center;
  line-height: 34px;
  box-shadow: 0 2px 4px 0 rgba(0, 0, 0, 0.10196078431372549);
  cursor: pointer;
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
}
.simple-Keyboard-number,
.simple-Keyboard-weight {
  min-width: 410px;
  position: absolute;
  left: 0;
  top: 0;
  z-index: 999;
  background: #fff;
  -webkit-box-shadow: 12px 18px 20px 0 rgba(0, 0, 0, 0.23921568627450981);
  box-shadow: 12px 18px 20px 0 rgba(0, 0, 0, 0.23921568627450981);
  border-radius: 4px;
  overflow: hidden;
}
.submit {
  width: 366px;
  height: 44px;
  background: #1890ff;
  border-radius: 2px;

  display: flex;

  justify-content: center;

  align-items: center;
  font-size: 14px;
  color: #fff;
  font-family: PingFangSC-Regular;
  font-weight: 400;
  margin-bottom: 40px;
  cursor: pointer;
}
.disabled-box {
  position: absolute;
  inset: 0;
  left: 0;
  right: 0;
  top: 0;
  bottom: 0;
}

.cashier_box {
  display: flex;
  width: 100%;
  padding-top: 14px;
  flex: 1;
  background: #f7f7fa;
  position: relative;
  margin: 0 24px 0 0;
  border-radius: 4px;
  overflow-y: auto;
}

.cashier_left .el-form-item {
  margin-bottom: 0;
}

.cashier_left {
  padding: 0 20px 0;

  flex: 1;
  min-width: 310px;
}

.cashier_left .title {
  font-size: 18px;
  color: #000;
  font-weight: 600;
  padding: 20px 0;
}

.cashier_left .detail_box {
  background: #fff;
  border-radius: 4px;
  padding: 0 14px;
  margin-bottom: 20px;
}

.cashier_left .detail_box .forms {
  padding: 10px 0;
  border-top: 1px solid #ebebeb;
}

.cashier_left .detail_box .usercard {
  display: flex;

  align-items: center;
  width: 100%;
  height: 80px;
  cursor: pointer;
}

.cashier_left .detail_box .usercard .info {
  margin-left: 10px;

  display: flex;

  flex-direction: column;

  justify-content: space-around;
}

.cashier_left .detail_box .usercard .info .nickname {
  display: flex;
  align-items: center;
  font-size: 16px;
}

.cashier_left .detail_box .usercard .info .nickname .txt {
  max-width: 120px;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  height: 25px;
  line-height: 25px;
}
::v-deep .cashier_left .el-form-item__label {
  text-align: left;
}
::v-deep .goods .el-image {
  display: flex;
  width: 100%;
  justify-content: center;
}
.cashier_left .detail_box .usercard .info .nickname .vip_level {
  font-size: 12px;
  padding: 0 5px;
  background: #f7793d;
  height: 20px;
  line-height: 20px;
  color: #fff;
  border-radius: 4px;
}

.cashier_left .detail_box .usercard .info .other_info {
  display: flex;
  font-size: 14px;
  color: #666;
}

.cashier_left .detail_box .usercard .info .other_info .item {
  margin-right: 10px;
}

.cashier_right {
  min-width: 250px;
  border-left: 1px solid #ebebeb;

  display: flex;

  flex-direction: column;
  padding-bottom: 20px;
}

.cashier_right .detail_form {
  flex: 1;
  overflow-y: auto;
}

.cashier_right .detail_form .detail_form_item {
  display: flex;

  justify-content: space-between;
  position: relative;
  margin-bottom: 16px;

  align-items: center;
}

.cashier_right .detail_form .detail_form_item .left {
  font-size: 14px;
  color: #000;
  letter-spacing: 1px;
}

.cashier_right .detail_form .detail_form_item .right {
  font-size: 14px;
  color: #000;

  display: flex;
  margin-right: 40px;
}

.cashier_right .detail_form .detail_form_item .right .btn {
  font-size: 14px;
  color: #1890ff;
  margin-left: 10px;
  cursor: pointer;
  position: absolute;
  right: 0;
}

.cashier_right .detail_form .detail_form_item .right .dfi_button {
  display: flex;

  justify-content: center;

  align-items: center;
  margin-left: 10px;
  width: 98px;
  height: 36px;
  font-size: 14px;
  color: rgba(0, 0, 0, 0.8);
  background-color: #fff;
  border: 1px solid #dcdfe6;
  border-radius: 6px;
  cursor: pointer;
}

.cashier_right .detail_form .detail_form_item .redfont {
  color: #fa5555;
  font-size: 20px;
}

.cashier_right .detail_form .line {
  width: 100%;
  height: 1px;
  background: #ebebeb;
  margin-top: 4px;
  margin-bottom: 20px;
}

.cashier_right .pay_btn {
  width: 100%;
  line-height: 44px;
  height: 44px;
  background: #22bf64;
  border-radius: 4px;
  font-size: 14px;
  text-align: center;
  color: #fff;
  letter-spacing: 1px;
  cursor: pointer;
}

.cashier_right .pay_btn:hover {
  opacity: 0.9;
}

.btn1 {
  background: #22bf64;
  color: #fff;
  border: none;
}
.pay_btns .el-button + .el-button {
  margin-left: 0;
}

.pay_btns .el-button {
  margin-right: 10px;
  margin-bottom: 10px;
}

.pay_btns .el-button:disabled {
  border: 1px solid #dcdfe6;
}
.order_remark {
  font-size: 14px;
  color: #666;
  margin-top: 5px;
  max-width: 340px;
  word-break: break-all;
}
</style>
  