|
|
@@ -1,258 +1,641 @@
|
|
|
-<<template>
|
|
|
- <j-modal
|
|
|
- :title="title"
|
|
|
- :width="width"
|
|
|
- :visible="visible"
|
|
|
- switchFullscreen
|
|
|
- @ok="handleOk"
|
|
|
- :okButtonProps="{ class:{'jee-hidden': disableSubmit} }"
|
|
|
- @cancel="handleCancel"
|
|
|
- cancelText="关闭">
|
|
|
- <a-card style="margin: 20px">
|
|
|
- <a-row>
|
|
|
- <a-col :span="16">
|
|
|
- <a-row :gutter="[5, 5]">
|
|
|
- <a-col
|
|
|
- v-for="item in dataSource"
|
|
|
- :key="item.id"
|
|
|
- :span="2"
|
|
|
- @click.stop="itemClick(item)"
|
|
|
- >
|
|
|
- <div
|
|
|
- class="room-item check"
|
|
|
- :style="{
|
|
|
- // background: getStatusColor(item.state),
|
|
|
- color: item.state == 0 ? '#000' : '#fff',
|
|
|
- }"
|
|
|
- >
|
|
|
- <div class="select-cell"></div>
|
|
|
- <template v-if="item.state === 1">
|
|
|
- <div>{{ item.name }}</div>
|
|
|
- <div style="margin-top: 10px">待下单</div>
|
|
|
- <div
|
|
|
- style="
|
|
|
+<
|
|
|
+<template>
|
|
|
+ <j-modal
|
|
|
+ :title="title"
|
|
|
+ :width="width"
|
|
|
+ :visible="visible"
|
|
|
+ switchFullscreen
|
|
|
+ @ok="handleOk"
|
|
|
+ :okButtonProps="{ class:{'jee-hidden': disableSubmit} }"
|
|
|
+ @cancel="handleCancel"
|
|
|
+ cancelText="关闭">
|
|
|
+ <a-card style="margin: 20px">
|
|
|
+
|
|
|
+ <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="
|
|
|
+ ">
|
|
|
+ <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-col>
|
|
|
- <a-col :span="8">
|
|
|
- <a-form-model >
|
|
|
- <a-form-model-item label="用餐时间" :labelCol="labelCol" :wrapperCol="wrapperCol" >
|
|
|
- <a-input></a-input>
|
|
|
- </a-form-model-item>
|
|
|
- <a-form-model-item label="预定桌数" :labelCol="labelCol" :wrapperCol="wrapperCol" >
|
|
|
- <a-input></a-input>
|
|
|
- </a-form-model-item>
|
|
|
- <a-form-model-item label="每桌人数" :labelCol="labelCol" :wrapperCol="wrapperCol" >
|
|
|
- <a-input></a-input>
|
|
|
- </a-form-model-item>
|
|
|
- <a-form-model-item label="预定人" :labelCol="labelCol" :wrapperCol="wrapperCol" >
|
|
|
- <a-input></a-input>
|
|
|
- </a-form-model-item>
|
|
|
- <a-form-model-item label="联系电话" :labelCol="labelCol" :wrapperCol="wrapperCol" >
|
|
|
- <a-input></a-input>
|
|
|
- </a-form-model-item>
|
|
|
- </a-form-model>
|
|
|
+ ">
|
|
|
+ <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"
|
|
|
+ @showSizeChange="onShowSizeChange"
|
|
|
+ />
|
|
|
+ </a-row>
|
|
|
+ </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>预定点餐</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-col>
|
|
|
- </a-row>
|
|
|
- </a-card>
|
|
|
- </j-modal>
|
|
|
+ </a-col>
|
|
|
+ </a-row>
|
|
|
+ </a-card>
|
|
|
+ </j-modal>
|
|
|
|
|
|
</template>
|
|
|
|
|
|
<script>
|
|
|
|
|
|
import PosTypeForm from './PosTypeForm'
|
|
|
-import { getAction } from '@api/manage'
|
|
|
+import {getAction} from '@api/manage'
|
|
|
+import moment from "moment";
|
|
|
+
|
|
|
export default {
|
|
|
- name: 'ReserveModal',
|
|
|
- components: {
|
|
|
- PosTypeForm
|
|
|
- },
|
|
|
- data () {
|
|
|
- return {
|
|
|
- title:'',
|
|
|
- width: 1500,
|
|
|
- visible: false,
|
|
|
- disableSubmit: false,
|
|
|
- dataSource: [],
|
|
|
- labelCol: {
|
|
|
- xs: { span: 24 },
|
|
|
- sm: { span: 4 },
|
|
|
- },
|
|
|
- wrapperCol: {
|
|
|
- xs: { span: 24 },
|
|
|
- sm: { span: 18 },
|
|
|
- },
|
|
|
- }
|
|
|
- },
|
|
|
- methods: {
|
|
|
- edit (record) {
|
|
|
- this.visible = true
|
|
|
- this.loadTables()
|
|
|
- },
|
|
|
- handleOk () {
|
|
|
- this.visible = false
|
|
|
- },
|
|
|
- submitCallback() {
|
|
|
- this.$emit('ok')
|
|
|
- this.visible = false
|
|
|
- },
|
|
|
- handleCancel () {
|
|
|
- this.close()
|
|
|
+ name: 'ReserveModal',
|
|
|
+ components: {
|
|
|
+ PosTypeForm
|
|
|
},
|
|
|
- hours(start) {
|
|
|
- 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));
|
|
|
- // return minutes == 0 ? hours : hours + 1;
|
|
|
- return hours.toString().padStart(2, "0") + ":" + minutes.toString().padStart(2, "0");
|
|
|
- },
|
|
|
- loadTables() {
|
|
|
- debugger
|
|
|
- var obj = {
|
|
|
- pageNo: 1,
|
|
|
- pageSize: 99999,
|
|
|
- // posTypeId: this.tabPosTypeId,
|
|
|
- // state: this.state,
|
|
|
- };
|
|
|
- // if (this.tabPosRegionId != "1") {
|
|
|
- // obj.posRegionId = this.tabPosRegionId;
|
|
|
- // }
|
|
|
- getAction('/pos/posTable/tableList', obj).then((res) => {
|
|
|
- debugger
|
|
|
- if (res.success) {
|
|
|
- this.dataSource = res.result.records;
|
|
|
+ data() {
|
|
|
+ return {
|
|
|
+ //需要提交的表单数据
|
|
|
+ model: {
|
|
|
+ //用餐时间
|
|
|
+ diningTime: '',
|
|
|
+ //预定桌数
|
|
|
+ reserveTableList: [],
|
|
|
+ //每桌人数
|
|
|
+ perTableNum: '',
|
|
|
+ //预定人
|
|
|
+ reserveName: '',
|
|
|
+ //联系电话
|
|
|
+ phone: '',
|
|
|
+ //是否定金
|
|
|
+ isDeposit: '',
|
|
|
+ // 客人类型
|
|
|
+ customerType: '',
|
|
|
+ //备注
|
|
|
+ remark: '',
|
|
|
+ },
|
|
|
+ //会员卡数据
|
|
|
+ vipCustomerData: {},
|
|
|
+ title: '',
|
|
|
+ width: 1500,
|
|
|
+ visible: false,
|
|
|
+ disableSubmit: false,
|
|
|
+ dataSource: [],
|
|
|
+ labelCol: {
|
|
|
+ xs: {span: 24},
|
|
|
+ sm: {span: 4},
|
|
|
+ },
|
|
|
+ wrapperCol: {
|
|
|
+ xs: {span: 24},
|
|
|
+ sm: {span: 18},
|
|
|
+ },
|
|
|
+ //分页
|
|
|
+ ipagination: {
|
|
|
+ current: 1,
|
|
|
+ pageSize: 10,
|
|
|
+ pageSizeOptions: ['10', '20', '30', '40', '50'],
|
|
|
+ total: 0,
|
|
|
+ },
|
|
|
+
|
|
|
+ //tab
|
|
|
+ posTypeList: [],
|
|
|
+ tabPosTypeId: "",
|
|
|
+ regionList: [],
|
|
|
+ tabPosRegionId: "1",
|
|
|
+ //color
|
|
|
+ statusColorList: [
|
|
|
+ {
|
|
|
+ title: "全部",
|
|
|
+ color: "#fff",
|
|
|
+ check: true,
|
|
|
+ status: -100,
|
|
|
+ },
|
|
|
+ {
|
|
|
+ title: "空桌",
|
|
|
+ color: "#fff",
|
|
|
+ check: false,
|
|
|
+ status: 0,
|
|
|
+ },
|
|
|
+ {
|
|
|
+ title: "待下单",
|
|
|
+ color: "#00a0e9",
|
|
|
+ check: false,
|
|
|
+ status: 1,
|
|
|
+ },
|
|
|
+ {
|
|
|
+ title: "待结账",
|
|
|
+ color: "rgba(10, 122, 114, 1)",
|
|
|
+ check: false,
|
|
|
+ status: 2,
|
|
|
+ },
|
|
|
+ {
|
|
|
+ title: "已预结",
|
|
|
+ color: "rgba(172, 51, 193, 1)",
|
|
|
+ check: false,
|
|
|
+ status: 3,
|
|
|
+ },
|
|
|
+ {
|
|
|
+ title: "待清台",
|
|
|
+ color: "rgba(128, 128, 128, 1)",
|
|
|
+ check: false,
|
|
|
+ status: 4,
|
|
|
+ },
|
|
|
+ ],
|
|
|
+
|
|
|
+ //会员 协议单位相关
|
|
|
+ oldBusMemberCardList: [],
|
|
|
+ busMemberCardList: [],
|
|
|
+ agreementUnitData: { customerName: "" },
|
|
|
+ busMarketAgreementUnitList: [],
|
|
|
+ busMarketAgreementCustomer: {},
|
|
|
}
|
|
|
- })
|
|
|
},
|
|
|
- itemClick() {
|
|
|
+ methods: {
|
|
|
+ moment,
|
|
|
+ /**
|
|
|
+ * 切换tab
|
|
|
+ * @param e
|
|
|
+ */
|
|
|
+ tabPosTypeChange(e) {
|
|
|
+ this.model.reserveTableList.length = 0;
|
|
|
+ this.loadRegion();
|
|
|
+ },
|
|
|
+ tabRegionChange(e) {
|
|
|
+ this.model.reserveTableList.length = 0;
|
|
|
+ this.loadTables();
|
|
|
+ },
|
|
|
+ //禁用时间
|
|
|
+ disabledDate(current) {
|
|
|
+ // Can not select days before today and today
|
|
|
+ return current && current < moment().endOf('day');
|
|
|
+ },
|
|
|
+
|
|
|
+ /**
|
|
|
+ * 分页
|
|
|
+ */
|
|
|
+ onShowSizeChange(current, pageSize) {
|
|
|
+ console.log(current, pageSize);
|
|
|
+ this.ipagination.current = current;
|
|
|
+ this.ipagination.pageSize = pageSize;
|
|
|
+ this.loadTables();
|
|
|
+ },
|
|
|
+
|
|
|
+ /**
|
|
|
+ * 计算颜色
|
|
|
+ */
|
|
|
+ getStatusColor(status) {
|
|
|
+ var find = this.statusColorList.find((t) => t.status == status);
|
|
|
+ return find ? find.color : "#fff";
|
|
|
+ },
|
|
|
+
|
|
|
+ /**
|
|
|
+ * 获取tab数据
|
|
|
+ */
|
|
|
+ loadRegion() {
|
|
|
+ getAction("/pos/posRegion/list", {
|
|
|
+ posTypeId: this.tabPosTypeId,
|
|
|
+ }).then((res) => {
|
|
|
+ if (res.success) {
|
|
|
+ this.regionList = res.result.records;
|
|
|
+ }
|
|
|
+ });
|
|
|
+ this.loadTables();
|
|
|
+ },
|
|
|
+
|
|
|
+
|
|
|
+ edit(record) {
|
|
|
+ this.visible = true
|
|
|
+ // this.loadTables()
|
|
|
+ },
|
|
|
+ handleOk() {
|
|
|
+ this.visible = false
|
|
|
+ },
|
|
|
+ submitCallback() {
|
|
|
+ this.$emit('ok')
|
|
|
+ this.visible = false
|
|
|
+ },
|
|
|
+ handleCancel() {
|
|
|
+ this.close()
|
|
|
+ },
|
|
|
+ close() {
|
|
|
+ this.visible = false
|
|
|
+ },
|
|
|
+ hours(start) {
|
|
|
+ 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));
|
|
|
+ // return minutes == 0 ? hours : hours + 1;
|
|
|
+ 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;
|
|
|
+ }
|
|
|
+ getAction('/pos/posTable/tableList', obj).then((res) => {
|
|
|
+ if (res.success) {
|
|
|
+ this.dataSource = res.result.records;
|
|
|
+ this.ipagination.total = res.result.total;
|
|
|
+ }
|
|
|
+ })
|
|
|
+ },
|
|
|
+ /**
|
|
|
+ * 选中数据
|
|
|
+ * @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);
|
|
|
+ }
|
|
|
+ },
|
|
|
+
|
|
|
+ handleSearchVip(value) {
|
|
|
+ let result;
|
|
|
+ if (!value) {
|
|
|
+ result = this.oldBusMemberCardList;
|
|
|
+ } else {
|
|
|
+ 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));
|
|
|
+ },
|
|
|
+ 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));
|
|
|
+ // this.vipCustomerIdChange(result.id);
|
|
|
+ },
|
|
|
+ handleSearchAgreementUnit(value) {
|
|
|
+ let result;
|
|
|
+ if (!value) {
|
|
|
+ result = this.oldBusMarketAgreementUnitList;
|
|
|
+ } else {
|
|
|
+ result = this.oldBusMarketAgreementUnitList.filter((t) =>
|
|
|
+ t.customerName.includes(value)
|
|
|
+ );
|
|
|
+ }
|
|
|
+ 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);
|
|
|
+ },
|
|
|
+ contractTeamIdChange(e) {
|
|
|
+ this.model.contractTeamId = e;
|
|
|
+ getAction("/business/busMarketAgreementCustomer/list", {
|
|
|
+ agreementId: this.model.contractTeamId,
|
|
|
+ }).then((res) => {
|
|
|
+ if (res.success) {
|
|
|
+ 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];
|
|
|
+ }
|
|
|
+ }
|
|
|
+ });
|
|
|
+ },
|
|
|
},
|
|
|
- }
|
|
|
+ created() {
|
|
|
+ getAction("/pos/posType/list", {pageNo: 1, pageSize: 99}).then((res) => {
|
|
|
+ if (res.success) {
|
|
|
+ this.posTypeList = res.result.records;
|
|
|
+ if (this.posTypeList && this.posTypeList.length > 0) {
|
|
|
+ this.tabPosTypeId = this.posTypeList[0].id;
|
|
|
+ this.loadRegion();
|
|
|
+ }
|
|
|
+ }
|
|
|
+ });
|
|
|
+ getAction("/business/busMemberCard/list", {
|
|
|
+ pageSize: 99999,
|
|
|
+ pageNo: 1,
|
|
|
+ }).then((res) => {
|
|
|
+ if (res.success) {
|
|
|
+ this.busMemberCardList = res.result.records;
|
|
|
+ this.oldBusMemberCardList = JSON.parse(
|
|
|
+ JSON.stringify(this.busMemberCardList)
|
|
|
+ );
|
|
|
+ if (this.model.vipCustomerId) {
|
|
|
+ this.handleSelectVip(this.model.vipCustomerId);
|
|
|
+ }
|
|
|
+ }
|
|
|
+ this.confirmLoading = false;
|
|
|
+ });
|
|
|
+ getAction("/business/busMarketAgreementUnit/list", {
|
|
|
+ pageSize: 99999,
|
|
|
+ pageNo: 1,
|
|
|
+ }).then((res) => {
|
|
|
+ if (res.success) {
|
|
|
+ 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);
|
|
|
+ }
|
|
|
+ }
|
|
|
+ });
|
|
|
+ }
|
|
|
}
|
|
|
</script>
|
|
|
<style>
|
|
|
.room-item {
|
|
|
- height: 110px;
|
|
|
- /* line-height: 200px; */
|
|
|
- font-size: 13px;
|
|
|
- padding: 0px 5px;
|
|
|
- border-radius: 5px;
|
|
|
- cursor: pointer;
|
|
|
- position: relative;
|
|
|
- display: flex;
|
|
|
- flex-direction: column;
|
|
|
- justify-content: center;
|
|
|
+ height: 110px;
|
|
|
+ /* line-height: 200px; */
|
|
|
+ font-size: 13px;
|
|
|
+ padding: 0px 5px;
|
|
|
+ border-radius: 5px;
|
|
|
+ cursor: pointer;
|
|
|
+ position: relative;
|
|
|
+ display: flex;
|
|
|
+ flex-direction: column;
|
|
|
+ justify-content: center;
|
|
|
+}
|
|
|
+
|
|
|
+.cell-gap {
|
|
|
+ display: flex;
|
|
|
+ gap: 10px;
|
|
|
+ align-items: center;
|
|
|
+}
|
|
|
+
|
|
|
+.active {
|
|
|
+ border: #00a0e9 2px solid !important;
|
|
|
}
|
|
|
+
|
|
|
.check {
|
|
|
- border: #000 solid 1px;
|
|
|
+ border: #000 solid 1px;
|
|
|
}
|
|
|
+
|
|
|
.ant-table-wrapper {
|
|
|
- height: calc(100vh - 500px);
|
|
|
+ height: calc(100vh - 500px);
|
|
|
}
|
|
|
+
|
|
|
/deep/ .card-pd .ant-card-body {
|
|
|
- padding: 0 !important;
|
|
|
+ padding: 0 !important;
|
|
|
}
|
|
|
+
|
|
|
.select-cell {
|
|
|
- position: absolute;
|
|
|
- width: 100%;
|
|
|
- height: 100%;
|
|
|
- left: 0;
|
|
|
- top: 0;
|
|
|
- z-index: 10;
|
|
|
- -webkit-user-select: none;
|
|
|
- -moz-user-select: none;
|
|
|
- -ms-user-select: none;
|
|
|
- user-select: none;
|
|
|
+ position: absolute;
|
|
|
+ width: 100%;
|
|
|
+ height: 100%;
|
|
|
+ left: 0;
|
|
|
+ top: 0;
|
|
|
+ z-index: 10;
|
|
|
+ -webkit-user-select: none;
|
|
|
+ -moz-user-select: none;
|
|
|
+ -ms-user-select: none;
|
|
|
+ user-select: none;
|
|
|
}
|
|
|
+
|
|
|
.w-choose-status {
|
|
|
- display: flex;
|
|
|
- /* justify-content: flex-end; */
|
|
|
- /* width: 200px; */
|
|
|
- margin-bottom: 20px;
|
|
|
+ display: flex;
|
|
|
+ /* justify-content: flex-end; */
|
|
|
+ /* width: 200px; */
|
|
|
+ margin-bottom: 20px;
|
|
|
}
|
|
|
|
|
|
.w-choose-status > div {
|
|
|
- /* width: 100%; */
|
|
|
- /* flex: 1; */
|
|
|
- display: flex;
|
|
|
- padding: 0 2%;
|
|
|
- white-space: nowrap;
|
|
|
- line-height: 20px;
|
|
|
- box-sizing: border-box;
|
|
|
- cursor: pointer;
|
|
|
- align-items: center;
|
|
|
+ /* width: 100%; */
|
|
|
+ /* flex: 1; */
|
|
|
+ display: flex;
|
|
|
+ padding: 0 2%;
|
|
|
+ white-space: nowrap;
|
|
|
+ line-height: 20px;
|
|
|
+ box-sizing: border-box;
|
|
|
+ cursor: pointer;
|
|
|
+ align-items: center;
|
|
|
}
|
|
|
|
|
|
.w-choose-status > div .square {
|
|
|
- display: flex;
|
|
|
- width: 16px;
|
|
|
- height: 16px;
|
|
|
- border-radius: 4px;
|
|
|
- box-sizing: border-box;
|
|
|
- border: #000 solid 1px;
|
|
|
+ display: flex;
|
|
|
+ width: 16px;
|
|
|
+ height: 16px;
|
|
|
+ border-radius: 4px;
|
|
|
+ box-sizing: border-box;
|
|
|
+ border: #000 solid 1px;
|
|
|
}
|
|
|
|
|
|
.w-choose-status > div .title {
|
|
|
- display: flex;
|
|
|
- align-items: center;
|
|
|
- line-height: 16px;
|
|
|
- padding-left: 4px;
|
|
|
- font-size: 14px;
|
|
|
- box-sizing: border-box;
|
|
|
+ display: flex;
|
|
|
+ align-items: center;
|
|
|
+ line-height: 16px;
|
|
|
+ padding-left: 4px;
|
|
|
+ font-size: 14px;
|
|
|
+ box-sizing: border-box;
|
|
|
}
|
|
|
+
|
|
|
.status-check {
|
|
|
- border: #000 solid 1px;
|
|
|
- padding: 8px;
|
|
|
- /* width: 80px; */
|
|
|
- height: 29px;
|
|
|
- justify-content: center;
|
|
|
- background-color: #ccc;
|
|
|
- border-radius: 4px;
|
|
|
+ border: #000 solid 1px;
|
|
|
+ padding: 8px;
|
|
|
+ /* width: 80px; */
|
|
|
+ height: 29px;
|
|
|
+ justify-content: center;
|
|
|
+ background-color: #ccc;
|
|
|
+ border-radius: 4px;
|
|
|
}
|
|
|
</style>
|
