|
|
@@ -1,267 +1,277 @@
|
|
|
-<
|
|
|
<template>
|
|
|
- <div>
|
|
|
+ <div >
|
|
|
<j-modal
|
|
|
- :title="title"
|
|
|
- :width="width"
|
|
|
- :visible="visible"
|
|
|
- switchFullscreen
|
|
|
- @ok="handleOk"
|
|
|
- :okButtonProps="{ class:{'jee-hidden': disableSubmit} }"
|
|
|
- @cancel="handleCancel"
|
|
|
- cancelText="关闭">
|
|
|
- <a-card style="margin: 20px">
|
|
|
+ :title="title"
|
|
|
+ :width="width"
|
|
|
+ :visible="visible"
|
|
|
+ switchFullscreen
|
|
|
+ @ok="handleOk"
|
|
|
+ :okButtonProps="{ class:{'jee-hidden': disableSubmit} }"
|
|
|
+ @cancel="handleCancel"
|
|
|
+ cancelText="关闭">
|
|
|
+ <a-card style="margin: 20px" v-if="visible">
|
|
|
|
|
|
- <a-row>
|
|
|
- <a-col :span="16">
|
|
|
- <a-tabs v-model="tabPosTypeId" @change="tabPosTypeChange">
|
|
|
- <a-tab-pane
|
|
|
- :key="item.id"
|
|
|
- :tab="item.name"
|
|
|
- v-for="item in posTypeList"
|
|
|
- ></a-tab-pane>
|
|
|
- </a-tabs>
|
|
|
+ <a-row>
|
|
|
+ <a-col :span="16">
|
|
|
+ <a-tabs v-model="tabPosTypeId" @change="tabPosTypeChange">
|
|
|
+ <a-tab-pane
|
|
|
+ :key="item.id"
|
|
|
+ :tab="item.name"
|
|
|
+ v-for="item in posTypeList"
|
|
|
+ ></a-tab-pane>
|
|
|
+ </a-tabs>
|
|
|
|
|
|
- <a-tabs v-model="tabPosRegionId" @change="tabRegionChange">
|
|
|
- <a-tab-pane key="1" tab="全部"></a-tab-pane>
|
|
|
- <a-tab-pane
|
|
|
- :key="item.id"
|
|
|
- :tab="item.name"
|
|
|
- v-for="item in regionList"
|
|
|
- ></a-tab-pane>
|
|
|
- </a-tabs>
|
|
|
- <a-row :gutter="[5, 5]">
|
|
|
- <a-col
|
|
|
- v-for="item in dataSource"
|
|
|
- :key="item.id"
|
|
|
- :span="4"
|
|
|
- @click.stop="itemClick(item)"
|
|
|
- >
|
|
|
- <div
|
|
|
- class="room-item check"
|
|
|
- :class="{'active': model.reserveTableList.some(t => t.id == item.id) }">
|
|
|
- <div class="select-cell"></div>
|
|
|
- <template v-if="item.state === 1">
|
|
|
- <div>{{ item.name }}</div>
|
|
|
- <div style="margin-top: 10px">待下单</div>
|
|
|
- <div style="
|
|
|
- margin-top: 10px;
|
|
|
- display: flex;
|
|
|
- justify-content: space-between;
|
|
|
- ">
|
|
|
- <div>
|
|
|
- <a-icon type="user"/>
|
|
|
- {{ item.userNum }}/{{ item.num }}人
|
|
|
- </div>
|
|
|
- <div>
|
|
|
- <a-icon type="clock-circle"/>
|
|
|
- {{ hours(item.orderTime) }}
|
|
|
- </div>
|
|
|
- </div>
|
|
|
- </template>
|
|
|
- <template v-else-if="item.state === 2 || item.state === 4">
|
|
|
- <div>{{ item.name }}</div>
|
|
|
- <div style="margin-top: 10px">
|
|
|
- ￥{{ item.posOrderGoods ? item.posOrderGoods.money : 0 }}
|
|
|
- </div>
|
|
|
- <div style="
|
|
|
- margin-top: 10px;
|
|
|
- display: flex;
|
|
|
- justify-content: space-between;
|
|
|
- ">
|
|
|
- <div>
|
|
|
- <a-icon type="user"/>
|
|
|
- {{ item.userNum }}/{{ item.num }}人
|
|
|
- </div>
|
|
|
- <div>
|
|
|
- <a-icon type="clock-circle"/>
|
|
|
- {{ hours(item.orderTime) }}
|
|
|
- </div>
|
|
|
- </div>
|
|
|
- </template>
|
|
|
- <template v-else>
|
|
|
- <div>{{ item.name }}</div>
|
|
|
- <div style="margin-top: 10px"></div>
|
|
|
- <div style="margin-top: 10px">
|
|
|
- <a-icon type="user"/>
|
|
|
- {{ item.num }}人
|
|
|
- </div>
|
|
|
- </template>
|
|
|
- </div>
|
|
|
+ <a-tabs v-model="tabPosRegionId" @change="tabRegionChange">
|
|
|
+ <a-tab-pane key="1" tab="全部"></a-tab-pane>
|
|
|
+ <a-tab-pane
|
|
|
+ :key="item.id"
|
|
|
+ :tab="item.name"
|
|
|
+ v-for="item in regionList"
|
|
|
+ ></a-tab-pane>
|
|
|
+ </a-tabs>
|
|
|
+ <a-row :gutter="[5, 5]">
|
|
|
+ <a-col
|
|
|
+ v-for="item in dataSource"
|
|
|
+ :key="item.id"
|
|
|
+ :span="4"
|
|
|
+ @click.stop="itemClick(item)"
|
|
|
+ >
|
|
|
+ <div
|
|
|
+ class="room-item check"
|
|
|
+ :class="{'active': model.tableIds.some(t => t == item.id) }">
|
|
|
+ <div class="select-cell"></div>
|
|
|
+ <template v-if="item.state === 1">
|
|
|
+ <div>{{ item.name }}</div>
|
|
|
+ <div style="margin-top: 10px">待下单</div>
|
|
|
+ <div style="margin-top: 10px; display: flex; justify-content: space-between;">
|
|
|
+ <div>
|
|
|
+ <a-icon type="user"/>
|
|
|
+ {{ item.userNum }}/{{ item.num }}人
|
|
|
+ </div>
|
|
|
+ <div>
|
|
|
+ <a-icon type="clock-circle"/>
|
|
|
+ {{ hours(item.orderTime) }}
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ </template>
|
|
|
+ <template v-else-if="item.state === 2 || item.state === 4">
|
|
|
+ <div>{{ item.name }}</div>
|
|
|
+ <div style="margin-top: 10px">
|
|
|
+ ￥{{ item.posOrderGoods ? item.posOrderGoods.money : 0 }}
|
|
|
+ </div>
|
|
|
+ <div style=" margin-top: 10px; display: flex; justify-content: space-between;">
|
|
|
+ <div>
|
|
|
+ <a-icon type="user"/>
|
|
|
+ {{ item.userNum }}/{{ item.num }}人
|
|
|
+ </div>
|
|
|
+ <div>
|
|
|
+ <a-icon type="clock-circle"/>
|
|
|
+ {{ hours(item.orderTime) }}
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ </template>
|
|
|
+ <template v-else>
|
|
|
+ <div>{{ item.name }}</div>
|
|
|
+ <div style="margin-top: 10px"></div>
|
|
|
+ <div style="margin-top: 10px">
|
|
|
+ <a-icon type="user"/>
|
|
|
+ {{ item.num }}人
|
|
|
+ </div>
|
|
|
+ </template>
|
|
|
+ </div>
|
|
|
+ </a-col>
|
|
|
+ </a-row>
|
|
|
+ <a-row type="flex" justify="end" style="width: 100%">
|
|
|
+ <a-pagination
|
|
|
+ show-size-changer
|
|
|
+ :default-current="1"
|
|
|
+ :total="ipagination.total"
|
|
|
+ :current="ipagination.current"
|
|
|
+ :pageSize="ipagination.pageSize"
|
|
|
+ :page-size-options="ipagination.pageSizeOptions"
|
|
|
+ @change="pageNoChange"
|
|
|
+ @showSizeChange="onShowSizeChange"
|
|
|
+ />
|
|
|
+ </a-row>
|
|
|
+ </a-col>
|
|
|
+ <a-col :span="8">
|
|
|
+ <a-form-model ref="form" :model="model" :rules="validatorRules">
|
|
|
+ <a-form-model-item label="用餐时间" prop="arriveTime" :labelCol="labelCol" :wrapperCol="wrapperCol">
|
|
|
+ <a-date-picker
|
|
|
+ format="YYYY-MM-DD HH:mm:ss"
|
|
|
+ v-model="model.arriveTime"
|
|
|
+ :show-time="{ defaultValue: moment('00:00:00', 'HH:mm:ss') }"
|
|
|
+ />
|
|
|
+ <!-- :disabled-date="disabledDate"-->
|
|
|
+ </a-form-model-item>
|
|
|
+ <a-form-model-item label="预定桌数" :labelCol="labelCol" :wrapperCol="wrapperCol">
|
|
|
+ <div class="cell-gap">
|
|
|
+ <a-input-number disabled :value="model.tableIds.length"/>
|
|
|
+ <a-button @click="orderFood">预定点餐</a-button> {{ model.posOrderGoodsDetailList ? model.posOrderGoodsDetailList.length : '' }}
|
|
|
+ </div>
|
|
|
+ </a-form-model-item>
|
|
|
+ <a-form-model-item label="每桌人数" prop="peopleNum" :labelCol="labelCol" :wrapperCol="wrapperCol">
|
|
|
+ <a-input-number v-model="model.peopleNum"></a-input-number>
|
|
|
+ </a-form-model-item>
|
|
|
+ <a-form-model-item label="预定人" prop="customerName" :labelCol="labelCol" :wrapperCol="wrapperCol">
|
|
|
+ <div class="cell-gap">
|
|
|
+ <a-input style="flex: 1" v-model="model.customerName"></a-input>
|
|
|
+ <a-radio-group v-model="model.sex">
|
|
|
+ <a-radio value="1">先生</a-radio>
|
|
|
+ <a-radio value="2">女士</a-radio>
|
|
|
+ </a-radio-group>
|
|
|
+ </div>
|
|
|
+ </a-form-model-item>
|
|
|
+ <a-form-model-item prop="phone" label="联系电话" :labelCol="labelCol" :wrapperCol="wrapperCol">
|
|
|
+ <a-input v-model="model.phone"></a-input>
|
|
|
+ </a-form-model-item>
|
|
|
+ <a-form-model-item label="定金" :labelCol="labelCol" :wrapperCol="wrapperCol">
|
|
|
+ <a-switch v-model="model.isDeposit"></a-switch>
|
|
|
+ </a-form-model-item>
|
|
|
+ <a-form-model-item label="客人类型" prop="customerType" :labelCol="labelCol" :wrapperCol="wrapperCol">
|
|
|
+ <div class="cell-gap">
|
|
|
+ <a-select v-model="model.customerType">
|
|
|
+ <a-select-option :value="1"> 散客</a-select-option>
|
|
|
+ <a-select-option :value="2"> 会员</a-select-option>
|
|
|
+ <a-select-option :value="3"> 协议单位</a-select-option>
|
|
|
+ </a-select>
|
|
|
+ <a-auto-complete
|
|
|
+ v-if="model.customerType===2"
|
|
|
+ v-model="vipCustomerData.name"
|
|
|
+ @select="(e) => handleSelectVip(e)"
|
|
|
+ @search="handleSearchVip"
|
|
|
+ >
|
|
|
+ <template slot="dataSource">
|
|
|
+ <a-select-option
|
|
|
+ :key="item.id"
|
|
|
+ :value="item.id"
|
|
|
+ :label="item.name"
|
|
|
+ v-for="(item, index) in busMemberCardList"
|
|
|
+ >
|
|
|
+ {{ item.name }}-{{ item.gradeName }}-{{ item.balance }}
|
|
|
+ </a-select-option>
|
|
|
+ </template>
|
|
|
+ </a-auto-complete>
|
|
|
+ <a-auto-complete
|
|
|
+ v-if="model.customerType===3"
|
|
|
+ v-model="agreementUnitData.customerName"
|
|
|
+ @select="(e) => handleSelectAgreementUnit(e)"
|
|
|
+ @search="handleSearchAgreementUnit"
|
|
|
+ >
|
|
|
+ <template slot="dataSource">
|
|
|
+ <a-select-option
|
|
|
+ :key="item.id"
|
|
|
+ :value="item.id"
|
|
|
+ :label="item.customerName"
|
|
|
+ v-for="(item, index) in busMarketAgreementUnitList"
|
|
|
+ >
|
|
|
+ {{ item.customerName }}
|
|
|
+ </a-select-option>
|
|
|
+ </template>
|
|
|
+ </a-auto-complete>
|
|
|
+ </div>
|
|
|
+ </a-form-model-item>
|
|
|
+ <a-form-model-item :wrapperCol="{ span: 24 }">
|
|
|
+ <a-col :span="24" v-if="model.customerType === 2">
|
|
|
+ <a-card :bordered="true" style="width: 100%; padding: 0 !important">
|
|
|
+ <p>
|
|
|
+ <a-row>
|
|
|
+ <a-col :span="8">名称：{{ vipCustomerData.name }}</a-col>
|
|
|
+ <a-col :span="8">电话：{{ vipCustomerData.mobile }}</a-col>
|
|
|
+ <a-col :span="8">级别：{{ vipCustomerData.gradeName }}</a-col>
|
|
|
+ </a-row>
|
|
|
+ <a-row>
|
|
|
+ <a-col :span="8">余额：{{ vipCustomerData.balance }}</a-col>
|
|
|
+ <a-col :span="8">积分：{{ vipCustomerData.integral }}</a-col>
|
|
|
+ <a-col :span="8">卡号：{{ vipCustomerData.cardNo }}</a-col>
|
|
|
+ </a-row>
|
|
|
+ </p>
|
|
|
+ </a-card>
|
|
|
+ </a-col>
|
|
|
+ <a-col :span="24" v-if="model.customerType === 3">
|
|
|
+ <a-card :bordered="true" style="width: 100%; padding: 0 !important">
|
|
|
+ <p>
|
|
|
+ <a-row>
|
|
|
+ <a-col :span="8">
|
|
|
+ 名称：{{ agreementUnitData.customerName }}
|
|
|
+ </a-col>
|
|
|
+ <a-col :span="8">
|
|
|
+ 电话：{{ agreementUnitData.phone }}
|
|
|
+ </a-col>
|
|
|
+ <a-col :span="8">
|
|
|
+ 可用额度：{{ agreementUnitData.balance || 0 }}
|
|
|
</a-col>
|
|
|
- </a-row>
|
|
|
- <a-row type="flex" justify="end" style="width: 100%">
|
|
|
- <a-pagination
|
|
|
- show-size-changer
|
|
|
- :default-current="1"
|
|
|
- :total="ipagination.total"
|
|
|
- :current="ipagination.current"
|
|
|
- :pageSize="ipagination.pageSize"
|
|
|
- @showSizeChange="onShowSizeChange"
|
|
|
- />
|
|
|
- </a-row>
|
|
|
+ </a-row>
|
|
|
+ </p>
|
|
|
+ </a-card>
|
|
|
</a-col>
|
|
|
- <a-col :span="8">
|
|
|
- <a-form-model :model="model">
|
|
|
- <a-form-model-item label="用餐时间" :labelCol="labelCol" :wrapperCol="wrapperCol">
|
|
|
- <a-date-picker
|
|
|
- format="YYYY-MM-DD HH:mm:ss"
|
|
|
- v-model="model.diningTime"
|
|
|
- :show-time="{ defaultValue: moment('00:00:00', 'HH:mm:ss') }"
|
|
|
- />
|
|
|
- <!-- :disabled-date="disabledDate"-->
|
|
|
- </a-form-model-item>
|
|
|
- <a-form-model-item label="预定桌数" :labelCol="labelCol" :wrapperCol="wrapperCol">
|
|
|
- <div class="cell-gap">
|
|
|
- <a-input-number disabled :value="model.reserveTableList.length"/>
|
|
|
- <a-button @click="orderFood">预定点餐</a-button>
|
|
|
- </div>
|
|
|
- </a-form-model-item>
|
|
|
- <a-form-model-item label="每桌人数" :labelCol="labelCol" :wrapperCol="wrapperCol">
|
|
|
- <a-input-number v-model="model.perTableNum"></a-input-number>
|
|
|
- </a-form-model-item>
|
|
|
- <a-form-model-item label="预定人" :labelCol="labelCol" :wrapperCol="wrapperCol">
|
|
|
- <div class="cell-gap">
|
|
|
- <a-input style="flex: 1" v-model="model.reserveName"></a-input>
|
|
|
- <a-radio-group>
|
|
|
- <a-radio value="0">先生</a-radio>
|
|
|
- <a-radio value="1">女士</a-radio>
|
|
|
- </a-radio-group>
|
|
|
- </div>
|
|
|
- </a-form-model-item>
|
|
|
- <a-form-model-item label="联系电话" :labelCol="labelCol" :wrapperCol="wrapperCol">
|
|
|
- <a-input v-model="model.phone"></a-input>
|
|
|
- </a-form-model-item>
|
|
|
- <a-form-model-item label="定金" :labelCol="labelCol" :wrapperCol="wrapperCol">
|
|
|
- <a-switch v-model="model.isDeposit"></a-switch>
|
|
|
- </a-form-model-item>
|
|
|
- <a-form-model-item label="客人类型" :labelCol="labelCol" :wrapperCol="wrapperCol">
|
|
|
- <div class="cell-gap">
|
|
|
- <a-select v-model="model.customerType">
|
|
|
- <a-select-option :value="1"> 散客</a-select-option>
|
|
|
- <a-select-option :value="2"> 会员</a-select-option>
|
|
|
- <a-select-option :value="3"> 协议单位</a-select-option>
|
|
|
- </a-select>
|
|
|
- <a-auto-complete v-if="model.customerType===2"
|
|
|
- v-model="vipCustomerData.name"
|
|
|
- @select="(e) => handleSelectVip(e)"
|
|
|
- @search="handleSearchVip"
|
|
|
- >
|
|
|
- <template slot="dataSource">
|
|
|
- <a-select-option
|
|
|
- :key="item.id"
|
|
|
- :value="item.id"
|
|
|
- :label="item.name"
|
|
|
- v-for="(item, index) in busMemberCardList"
|
|
|
- >
|
|
|
- {{ item.name }}-{{ item.gradeName }}-{{ item.balance }}
|
|
|
- </a-select-option>
|
|
|
- </template>
|
|
|
- </a-auto-complete>
|
|
|
- <a-auto-complete v-if="model.customerType===3"
|
|
|
- v-model="agreementUnitData.customerName"
|
|
|
- @select="(e) => handleSelectAgreementUnit(e)"
|
|
|
- @search="handleSearchAgreementUnit"
|
|
|
- >
|
|
|
- <template slot="dataSource">
|
|
|
- <a-select-option
|
|
|
- :key="item.id"
|
|
|
- :value="item.id"
|
|
|
- :label="item.customerName"
|
|
|
- v-for="(item, index) in busMarketAgreementUnitList"
|
|
|
- >
|
|
|
- {{ item.customerName }}
|
|
|
- </a-select-option>
|
|
|
- </template>
|
|
|
- </a-auto-complete>
|
|
|
- </div>
|
|
|
- </a-form-model-item>
|
|
|
- <a-form-model-item :wrapperCol="{ span: 24 }">
|
|
|
- <a-col :span="24" v-if="model.customerType === 2">
|
|
|
- <a-card :bordered="true" style="width: 100%; padding: 0 !important">
|
|
|
- <p>
|
|
|
- <a-row>
|
|
|
- <a-col :span="8">名称：{{ vipCustomerData.name }}</a-col>
|
|
|
- <a-col :span="8">电话：{{ vipCustomerData.mobile }}</a-col>
|
|
|
- <a-col :span="8">级别：{{ vipCustomerData.gradeName }}</a-col>
|
|
|
- </a-row>
|
|
|
- <a-row>
|
|
|
- <a-col :span="8">余额：{{ vipCustomerData.balance }}</a-col>
|
|
|
- <a-col :span="8">积分：{{ vipCustomerData.integral }}</a-col>
|
|
|
- <a-col :span="8">卡号：{{ vipCustomerData.cardNo }}</a-col>
|
|
|
- </a-row>
|
|
|
- </p>
|
|
|
- </a-card>
|
|
|
- </a-col>
|
|
|
- <a-col :span="24" v-if="model.customerType === 3">
|
|
|
- <a-card :bordered="true" style="width: 100%; padding: 0 !important">
|
|
|
- <p>
|
|
|
- <a-row>
|
|
|
- <a-col :span="8">
|
|
|
- 名称：{{ agreementUnitData.customerName }}
|
|
|
- </a-col>
|
|
|
- <a-col :span="8">
|
|
|
- 电话：{{agreementUnitData.phone}}
|
|
|
- </a-col>
|
|
|
- <a-col :span="8">
|
|
|
- 可用额度：{{ agreementUnitData.balance || 0 }}
|
|
|
- </a-col>
|
|
|
- </a-row>
|
|
|
- </p>
|
|
|
- </a-card>
|
|
|
- </a-col>
|
|
|
- </a-form-model-item>
|
|
|
- <a-form-model-item label="备注" :labelCol="labelCol" :wrapperCol="wrapperCol">
|
|
|
- <a-textarea v-model="model.remark"></a-textarea>
|
|
|
- </a-form-model-item>
|
|
|
- <a-form-model-item :wrapperCol="{ span: 24 }">
|
|
|
- <a-button type="primary" @click="submitCallback">确认预定</a-button>
|
|
|
- </a-form-model-item>
|
|
|
- </a-form-model>
|
|
|
+ </a-form-model-item>
|
|
|
+ <a-form-model-item label="备注" :labelCol="labelCol" :wrapperCol="wrapperCol">
|
|
|
+ <a-textarea v-model="model.remark"></a-textarea>
|
|
|
+ </a-form-model-item>
|
|
|
+<!-- <a-form-model-item :wrapperCol="{ span: 24 }">-->
|
|
|
+<!-- <a-button type="primary" @click="submitCallback">确认预定</a-button>-->
|
|
|
+<!-- </a-form-model-item>-->
|
|
|
+ </a-form-model>
|
|
|
|
|
|
- </a-col>
|
|
|
- </a-row>
|
|
|
- </a-card>
|
|
|
+ </a-col>
|
|
|
+ </a-row>
|
|
|
+ </a-card>
|
|
|
</j-modal>
|
|
|
<!-- <order-food ref="orderFood"></order-food> -->
|
|
|
-</div>
|
|
|
+ </div>
|
|
|
</template>
|
|
|
|
|
|
<script>
|
|
|
|
|
|
import PosTypeForm from './PosTypeForm'
|
|
|
-import {getAction} from '@api/manage'
|
|
|
-import moment from "moment";
|
|
|
+import { getAction, postAction } from '@api/manage'
|
|
|
+import moment from 'moment'
|
|
|
// import OrderFood from './OrderFood.vue'
|
|
|
|
|
|
export default {
|
|
|
name: 'ReserveModal',
|
|
|
components: {
|
|
|
- PosTypeForm,
|
|
|
+ PosTypeForm
|
|
|
// OrderFood
|
|
|
},
|
|
|
data() {
|
|
|
return {
|
|
|
- //需要提交的表单数据
|
|
|
+ validatorRules: {
|
|
|
+ arriveTime: [{ required: true, message: '请输入用餐时间!' }],
|
|
|
+ peopleNum: [{ required: true, message: '请输入每桌人数!' }],
|
|
|
+ customerName: [{ required: true, message: '请输入预定人!' }],
|
|
|
+ sex: [{ required: true, message: '请选择性别!' }],
|
|
|
+ phone: [{ required: true, pattern: /^1[3|4|5|6|7|8|9][0-9]\d{8}$/, message: '请输入手机号!' }],
|
|
|
+ customerType: [{ required: true, message: '请选择客户类型!' }]
|
|
|
+ },
|
|
|
+
|
|
|
+ // 需要提交的表单数据
|
|
|
model: {
|
|
|
- //用餐时间
|
|
|
- diningTime: '',
|
|
|
- //预定桌数
|
|
|
- reserveTableList: [],
|
|
|
- //每桌人数
|
|
|
- perTableNum: '',
|
|
|
- //预定人
|
|
|
- reserveName: '',
|
|
|
- //联系电话
|
|
|
+ // 用餐时间
|
|
|
+ arriveTime: '',
|
|
|
+ // 预定桌数
|
|
|
+ tableIds: [],
|
|
|
+ // 每桌人数
|
|
|
+ peopleNum: '',
|
|
|
+ // 预定人
|
|
|
+ customerName: '',
|
|
|
+ // 性别
|
|
|
+ sex: '1',
|
|
|
+ // 联系电话
|
|
|
phone: '',
|
|
|
- //是否定金
|
|
|
+ // 是否定金
|
|
|
isDeposit: '',
|
|
|
// 客人类型
|
|
|
customerType: '',
|
|
|
- //备注
|
|
|
- remark: '',
|
|
|
+ // 备注
|
|
|
+ remark: ''
|
|
|
},
|
|
|
- //会员卡数据
|
|
|
+ url: {
|
|
|
+ add: 'pos/posOrderGoods/addBooking',
|
|
|
+ edit: 'pos/posOrderGoods/editBooking'
|
|
|
+ },
|
|
|
+ // 会员卡数据
|
|
|
vipCustomerData: {},
|
|
|
title: '',
|
|
|
width: 1500,
|
|
|
@@ -269,72 +279,72 @@ export default {
|
|
|
disableSubmit: false,
|
|
|
dataSource: [],
|
|
|
labelCol: {
|
|
|
- xs: {span: 24},
|
|
|
- sm: {span: 4},
|
|
|
+ xs: { span: 24 },
|
|
|
+ sm: { span: 4 }
|
|
|
},
|
|
|
wrapperCol: {
|
|
|
- xs: {span: 24},
|
|
|
- sm: {span: 18},
|
|
|
+ xs: { span: 24 },
|
|
|
+ sm: { span: 18 }
|
|
|
},
|
|
|
- //分页
|
|
|
+ // 分页
|
|
|
ipagination: {
|
|
|
current: 1,
|
|
|
pageSize: 10,
|
|
|
- pageSizeOptions: ['10', '20', '30', '40', '50'],
|
|
|
- total: 0,
|
|
|
+ pageSizeOptions: ['10', '20', '30'],
|
|
|
+ total: 0
|
|
|
},
|
|
|
|
|
|
- //tab
|
|
|
+ // tab
|
|
|
posTypeList: [],
|
|
|
- tabPosTypeId: "",
|
|
|
+ tabPosTypeId: '',
|
|
|
regionList: [],
|
|
|
- tabPosRegionId: "1",
|
|
|
- //color
|
|
|
+ tabPosRegionId: '1',
|
|
|
+ // color
|
|
|
statusColorList: [
|
|
|
{
|
|
|
- title: "全部",
|
|
|
- color: "#fff",
|
|
|
+ title: '全部',
|
|
|
+ color: '#fff',
|
|
|
check: true,
|
|
|
- status: -100,
|
|
|
+ status: -100
|
|
|
},
|
|
|
{
|
|
|
- title: "空桌",
|
|
|
- color: "#fff",
|
|
|
+ title: '空桌',
|
|
|
+ color: '#fff',
|
|
|
check: false,
|
|
|
- status: 0,
|
|
|
+ status: 0
|
|
|
},
|
|
|
{
|
|
|
- title: "待下单",
|
|
|
- color: "#00a0e9",
|
|
|
+ title: '待下单',
|
|
|
+ color: '#00a0e9',
|
|
|
check: false,
|
|
|
- status: 1,
|
|
|
+ status: 1
|
|
|
},
|
|
|
{
|
|
|
- title: "待结账",
|
|
|
- color: "rgba(10, 122, 114, 1)",
|
|
|
+ title: '待结账',
|
|
|
+ color: 'rgba(10, 122, 114, 1)',
|
|
|
check: false,
|
|
|
- status: 2,
|
|
|
+ status: 2
|
|
|
},
|
|
|
{
|
|
|
- title: "已预结",
|
|
|
- color: "rgba(172, 51, 193, 1)",
|
|
|
+ title: '已预结',
|
|
|
+ color: 'rgba(172, 51, 193, 1)',
|
|
|
check: false,
|
|
|
- status: 3,
|
|
|
+ status: 3
|
|
|
},
|
|
|
{
|
|
|
- title: "待清台",
|
|
|
- color: "rgba(128, 128, 128, 1)",
|
|
|
+ title: '待清台',
|
|
|
+ color: 'rgba(128, 128, 128, 1)',
|
|
|
check: false,
|
|
|
- status: 4,
|
|
|
- },
|
|
|
+ status: 4
|
|
|
+ }
|
|
|
],
|
|
|
|
|
|
- //会员 协议单位相关
|
|
|
+ // 会员 协议单位相关
|
|
|
oldBusMemberCardList: [],
|
|
|
busMemberCardList: [],
|
|
|
- agreementUnitData: { customerName: "" },
|
|
|
+ agreementUnitData: { customerName: '' },
|
|
|
busMarketAgreementUnitList: [],
|
|
|
- busMarketAgreementCustomer: {},
|
|
|
+ busMarketAgreementCustomer: {}
|
|
|
// 控制预定点餐弹框
|
|
|
// foodOpen: true,
|
|
|
// 控制预定点餐弹框弹出方向
|
|
|
@@ -342,104 +352,156 @@ export default {
|
|
|
}
|
|
|
},
|
|
|
methods: {
|
|
|
- orderFood() {
|
|
|
+ add(record) {
|
|
|
+ this.visible = true
|
|
|
+ // this.loadTables()
|
|
|
+ },
|
|
|
+ edit(record) {
|
|
|
+ console.log(record)
|
|
|
+ this.visible = true
|
|
|
+ this.model.id = record.bookingId
|
|
|
+ this.model.code = record.bookingCode
|
|
|
+ this.model.arriveTime = record.arriveTime
|
|
|
+ this.model.peopleNum = record.peopleNum
|
|
|
+ this.model.customerName = record.customerName
|
|
|
+ this.model.sex = record.sex + ''
|
|
|
+ this.model.phone = record.phone
|
|
|
+ this.model.isDeposit = ''
|
|
|
+ this.model.customerType = record.customerType
|
|
|
+ this.model.remark = record.remark
|
|
|
+ console.log(this.model)
|
|
|
+ getAction('pos/posOrderGoods/getBookingOrderById', { bookingId: this.model.id }).then(resp => {
|
|
|
+ console.log(resp, 'resp')
|
|
|
+ this.model.tableIds = resp.result.tableList.map(e => e.id)
|
|
|
+ this.model.posOrderGoodsDetailList = resp.result.posOrderGoodsDetailList;
|
|
|
+ })
|
|
|
+ },
|
|
|
+ orderFood() {
|
|
|
// this.$refs.orderFood.edit()
|
|
|
- this.$parent.handleOrderFood()
|
|
|
+ this.$parent.handleOrderFood(this.model.posOrderGoodsDetailList)
|
|
|
},
|
|
|
- moment,
|
|
|
- /**
|
|
|
+ changeGoodsDetail(orderGoodsDetailList) {
|
|
|
+ console.log(orderGoodsDetailList)
|
|
|
+ this.model.posOrderGoodsDetailList = orderGoodsDetailList
|
|
|
+ this.$forceUpdate()
|
|
|
+ },
|
|
|
+ moment,
|
|
|
+ /**
|
|
|
* 切换tab
|
|
|
* @param e
|
|
|
*/
|
|
|
tabPosTypeChange(e) {
|
|
|
- this.model.reserveTableList.length = 0;
|
|
|
- this.loadRegion();
|
|
|
+ this.model.tableIds.length = 0
|
|
|
+ this.loadRegion()
|
|
|
},
|
|
|
+ // 禁用时间
|
|
|
tabRegionChange(e) {
|
|
|
- this.model.reserveTableList.length = 0;
|
|
|
- this.loadTables();
|
|
|
+ this.model.tableIds.length = 0
|
|
|
+ this.loadTables()
|
|
|
},
|
|
|
- //禁用时间
|
|
|
+
|
|
|
disabledDate(current) {
|
|
|
// Can not select days before today and today
|
|
|
- return current && current < moment().endOf('day');
|
|
|
+ return current && current < moment().endOf('day')
|
|
|
},
|
|
|
|
|
|
/**
|
|
|
* 分页
|
|
|
*/
|
|
|
onShowSizeChange(current, pageSize) {
|
|
|
- console.log(current, pageSize);
|
|
|
- this.ipagination.current = current;
|
|
|
- this.ipagination.pageSize = pageSize;
|
|
|
- this.loadTables();
|
|
|
+ this.ipagination.current = 1
|
|
|
+ this.ipagination.pageSize = pageSize
|
|
|
+ this.loadTables()
|
|
|
+ this.$forceUpdate()
|
|
|
+ },
|
|
|
+ /**
|
|
|
+ * 分页
|
|
|
+ */
|
|
|
+ pageNoChange(current, pageSize) {
|
|
|
+ console.log(1, pageSize)
|
|
|
+ this.ipagination.current = current
|
|
|
+ this.ipagination.pageSize = pageSize
|
|
|
+ this.loadTables()
|
|
|
+ this.$forceUpdate()
|
|
|
},
|
|
|
|
|
|
/**
|
|
|
* 计算颜色
|
|
|
*/
|
|
|
getStatusColor(status) {
|
|
|
- var find = this.statusColorList.find((t) => t.status == status);
|
|
|
- return find ? find.color : "#fff";
|
|
|
+ var find = this.statusColorList.find((t) => t.status == status)
|
|
|
+ return find ? find.color : '#fff'
|
|
|
},
|
|
|
-
|
|
|
- /**
|
|
|
+ /**
|
|
|
* 获取tab数据
|
|
|
*/
|
|
|
loadRegion() {
|
|
|
- getAction("/pos/posRegion/list", {
|
|
|
- posTypeId: this.tabPosTypeId,
|
|
|
+ getAction('/pos/posRegion/list', {
|
|
|
+ posTypeId: this.tabPosTypeId
|
|
|
}).then((res) => {
|
|
|
if (res.success) {
|
|
|
- this.regionList = res.result.records;
|
|
|
+ this.regionList = res.result.records
|
|
|
}
|
|
|
- });
|
|
|
- this.loadTables();
|
|
|
- },
|
|
|
-
|
|
|
-
|
|
|
- edit(record) {
|
|
|
- this.visible = true
|
|
|
- // this.loadTables()
|
|
|
+ })
|
|
|
+ this.loadTables()
|
|
|
},
|
|
|
handleOk() {
|
|
|
- this.visible = false
|
|
|
+ let that = this
|
|
|
+ this.$refs.form.validate(valid => {
|
|
|
+ if (valid) {
|
|
|
+ var _info = JSON.parse(localStorage.getItem('storeInfo'));
|
|
|
+ let model = JSON.parse(JSON.stringify(that.model))
|
|
|
+ model.arriveTime = moment(model.arriveTime).format('yyyy-MM-DD HH:mm:ss')
|
|
|
+ model.hotelId = _info.id
|
|
|
+ let url = that.model.id == null ? that.url.add : that.url.edit
|
|
|
+ postAction(url, model).then(resp => {
|
|
|
+ if (resp.success) {
|
|
|
+ that.$message.success(resp.message)
|
|
|
+ that.$emit('clean', true)
|
|
|
+ that.visible = false
|
|
|
+ } else {
|
|
|
+ that.$message.warning('预约失败');
|
|
|
+ }
|
|
|
+ })
|
|
|
+ }
|
|
|
+ })
|
|
|
},
|
|
|
submitCallback() {
|
|
|
this.$emit('ok')
|
|
|
this.visible = false
|
|
|
},
|
|
|
handleCancel() {
|
|
|
- this.close()
|
|
|
+ this.visible = false
|
|
|
+ this.$emit('clean')
|
|
|
},
|
|
|
close() {
|
|
|
this.visible = false
|
|
|
},
|
|
|
hours(start) {
|
|
|
- var beginDate = new Date(start);
|
|
|
- var endDate = new Date();
|
|
|
- let hours = parseInt((endDate - beginDate) / (1000 * 60 * 60));
|
|
|
+ var beginDate = new Date(start)
|
|
|
+ var endDate = new Date()
|
|
|
+ let hours = parseInt((endDate - beginDate) / (1000 * 60 * 60))
|
|
|
let leave1 =
|
|
|
- (endDate.getTime() - beginDate.getTime()) % (24 * 3600 * 1000);
|
|
|
- let leave2 = leave1 % (3600 * 1000);
|
|
|
- let minutes = Math.floor(leave2 / (60 * 1000));
|
|
|
+ (endDate.getTime() - beginDate.getTime()) % (24 * 3600 * 1000)
|
|
|
+ let leave2 = leave1 % (3600 * 1000)
|
|
|
+ let minutes = Math.floor(leave2 / (60 * 1000))
|
|
|
// return minutes == 0 ? hours : hours + 1;
|
|
|
- return hours.toString().padStart(2, "0") + ":" + minutes.toString().padStart(2, "0");
|
|
|
+ return hours.toString().padStart(2, '0') + ':' + minutes.toString().padStart(2, '0')
|
|
|
},
|
|
|
loadTables() {
|
|
|
var obj = {
|
|
|
pageNo: this.ipagination.current,
|
|
|
pageSize: this.ipagination.pageSize,
|
|
|
posTypeId: this.tabPosTypeId,
|
|
|
- state: this.state,
|
|
|
- };
|
|
|
- if (this.tabPosRegionId != "1") {
|
|
|
- obj.posRegionId = this.tabPosRegionId;
|
|
|
+ state: this.state
|
|
|
+ }
|
|
|
+ if (this.tabPosRegionId != '1') {
|
|
|
+ obj.posRegionId = this.tabPosRegionId
|
|
|
}
|
|
|
getAction('/pos/posTable/tableList', obj).then((res) => {
|
|
|
if (res.success) {
|
|
|
- this.dataSource = res.result.records;
|
|
|
- this.ipagination.total = res.result.total;
|
|
|
+ this.dataSource = res.result.records
|
|
|
+ this.ipagination.total = res.result.total
|
|
|
}
|
|
|
})
|
|
|
},
|
|
|
@@ -448,110 +510,109 @@ export default {
|
|
|
* @param item
|
|
|
*/
|
|
|
itemClick(item) {
|
|
|
- if (this.model.reserveTableList.some((t) => t.id == item.id)) {
|
|
|
- this.model.reserveTableList = this.model.reserveTableList.filter(
|
|
|
- (t) => t.id != item.id
|
|
|
- );
|
|
|
- } else {
|
|
|
- this.model.reserveTableList.push(item);
|
|
|
- }
|
|
|
+ let index = this.model.tableIds.findIndex(t => t === item.id)
|
|
|
+ if (index === -1) {
|
|
|
+ this.model.tableIds.push(item.id)
|
|
|
+ } else {
|
|
|
+ this.model.tableIds.splice(index, 1)
|
|
|
+ }
|
|
|
},
|
|
|
|
|
|
handleSearchVip(value) {
|
|
|
- let result;
|
|
|
+ let result
|
|
|
if (!value) {
|
|
|
- result = this.oldBusMemberCardList;
|
|
|
+ result = this.oldBusMemberCardList
|
|
|
} else {
|
|
|
- console.log("this.oldBusMemberCardList", this.oldBusMemberCardList);
|
|
|
+ console.log('this.oldBusMemberCardList', this.oldBusMemberCardList)
|
|
|
result = this.oldBusMemberCardList.filter((t) => {
|
|
|
return (
|
|
|
t.name.includes(value) ||
|
|
|
(t.cardNo && t.cardNo.includes(value)) ||
|
|
|
(t.mobile && t.mobile.includes(value))
|
|
|
- );
|
|
|
- });
|
|
|
+ )
|
|
|
+ })
|
|
|
}
|
|
|
- this.busMemberCardList = JSON.parse(JSON.stringify(result));
|
|
|
+ this.busMemberCardList = JSON.parse(JSON.stringify(result))
|
|
|
},
|
|
|
handleSelectVip(value) {
|
|
|
- console.log(value);
|
|
|
- let result = this.busMemberCardList.find((t) => t.id == value);
|
|
|
- this.model.vipCustomerId = value;
|
|
|
- this.vipCustomerData = JSON.parse(JSON.stringify(result));
|
|
|
+ console.log(value)
|
|
|
+ let result = this.busMemberCardList.find((t) => t.id == value)
|
|
|
+ this.model.vipCustomerId = value
|
|
|
+ this.vipCustomerData = JSON.parse(JSON.stringify(result))
|
|
|
// this.vipCustomerIdChange(result.id);
|
|
|
},
|
|
|
handleSearchAgreementUnit(value) {
|
|
|
- let result;
|
|
|
+ let result
|
|
|
if (!value) {
|
|
|
- result = this.oldBusMarketAgreementUnitList;
|
|
|
+ result = this.oldBusMarketAgreementUnitList
|
|
|
} else {
|
|
|
result = this.oldBusMarketAgreementUnitList.filter((t) =>
|
|
|
t.customerName.includes(value)
|
|
|
- );
|
|
|
+ )
|
|
|
}
|
|
|
- this.busMarketAgreementUnitList = JSON.parse(JSON.stringify(result));
|
|
|
+ this.busMarketAgreementUnitList = JSON.parse(JSON.stringify(result))
|
|
|
},
|
|
|
handleSelectAgreementUnit(value) {
|
|
|
- let result = this.busMarketAgreementUnitList.find((t) => t.id == value);
|
|
|
- this.model.contractTeamId = value;
|
|
|
- this.agreementUnitData = JSON.parse(JSON.stringify(result));
|
|
|
- this.contractTeamIdChange(value);
|
|
|
+ let result = this.busMarketAgreementUnitList.find((t) => t.id == value)
|
|
|
+ this.model.contractTeamId = value
|
|
|
+ this.agreementUnitData = JSON.parse(JSON.stringify(result))
|
|
|
+ this.contractTeamIdChange(value)
|
|
|
},
|
|
|
contractTeamIdChange(e) {
|
|
|
- this.model.contractTeamId = e;
|
|
|
- getAction("/business/busMarketAgreementCustomer/list", {
|
|
|
- agreementId: this.model.contractTeamId,
|
|
|
+ this.model.contractTeamId = e
|
|
|
+ getAction('/business/busMarketAgreementCustomer/list', {
|
|
|
+ agreementId: this.model.contractTeamId
|
|
|
}).then((res) => {
|
|
|
if (res.success) {
|
|
|
- var list = res.result.records;
|
|
|
+ var list = res.result.records
|
|
|
if (list && list.length > 0) {
|
|
|
- this.model.contractTeamProtocolName = list[0].name;
|
|
|
- this.model.contractTeamProtocolId = list[0].id;
|
|
|
- this.busMarketAgreementCustomer = list[0];
|
|
|
+ this.model.contractTeamProtocolName = list[0].name
|
|
|
+ this.model.contractTeamProtocolId = list[0].id
|
|
|
+ this.busMarketAgreementCustomer = list[0]
|
|
|
}
|
|
|
}
|
|
|
- });
|
|
|
- },
|
|
|
+ })
|
|
|
+ }
|
|
|
},
|
|
|
created() {
|
|
|
- getAction("/pos/posType/list", {pageNo: 1, pageSize: 99}).then((res) => {
|
|
|
+ getAction('/pos/posType/list', { pageNo: 1, pageSize: 99 }).then((res) => {
|
|
|
if (res.success) {
|
|
|
- this.posTypeList = res.result.records;
|
|
|
+ this.posTypeList = res.result.records
|
|
|
if (this.posTypeList && this.posTypeList.length > 0) {
|
|
|
- this.tabPosTypeId = this.posTypeList[0].id;
|
|
|
- this.loadRegion();
|
|
|
+ this.tabPosTypeId = this.posTypeList[0].id
|
|
|
+ this.loadRegion()
|
|
|
}
|
|
|
}
|
|
|
- });
|
|
|
- getAction("/business/busMemberCard/list", {
|
|
|
+ })
|
|
|
+ getAction('/business/busMemberCard/list', {
|
|
|
pageSize: 99999,
|
|
|
- pageNo: 1,
|
|
|
+ pageNo: 1
|
|
|
}).then((res) => {
|
|
|
if (res.success) {
|
|
|
- this.busMemberCardList = res.result.records;
|
|
|
+ this.busMemberCardList = res.result.records
|
|
|
this.oldBusMemberCardList = JSON.parse(
|
|
|
JSON.stringify(this.busMemberCardList)
|
|
|
- );
|
|
|
+ )
|
|
|
if (this.model.vipCustomerId) {
|
|
|
- this.handleSelectVip(this.model.vipCustomerId);
|
|
|
+ this.handleSelectVip(this.model.vipCustomerId)
|
|
|
}
|
|
|
}
|
|
|
- this.confirmLoading = false;
|
|
|
- });
|
|
|
- getAction("/business/busMarketAgreementUnit/list", {
|
|
|
+ this.confirmLoading = false
|
|
|
+ })
|
|
|
+ getAction('/business/busMarketAgreementUnit/list', {
|
|
|
pageSize: 99999,
|
|
|
- pageNo: 1,
|
|
|
+ pageNo: 1
|
|
|
}).then((res) => {
|
|
|
if (res.success) {
|
|
|
- this.busMarketAgreementUnitList = res.result.records;
|
|
|
+ this.busMarketAgreementUnitList = res.result.records
|
|
|
this.oldBusMarketAgreementUnitList = JSON.parse(
|
|
|
JSON.stringify(res.result.records)
|
|
|
- );
|
|
|
+ )
|
|
|
if (this.model.contractTeamId && this.model.contractTeamProtocolId) {
|
|
|
- this.handleSelectAgreementUnit(this.model.contractTeamId);
|
|
|
+ this.handleSelectAgreementUnit(this.model.contractTeamId)
|
|
|
}
|
|
|
}
|
|
|
- });
|
|
|
+ })
|
|
|
}
|
|
|
}
|
|
|
</script>
|
许智捷