|
|
@@ -2,7 +2,7 @@
|
|
|
<div class="queue">
|
|
|
<van-nav-bar
|
|
|
title="当前队列"
|
|
|
- right-text="打样"
|
|
|
+ right-text="打烊"
|
|
|
@click-left="toAdmin"
|
|
|
@click-right="toOpen"
|
|
|
left-text="添加预定"
|
|
|
@@ -35,61 +35,77 @@
|
|
|
</van-cell>
|
|
|
</van-cell-group>
|
|
|
|
|
|
+
|
|
|
<van-popup v-model="open" position="right" class="open">
|
|
|
- <van-radio-group v-model="radio">
|
|
|
- <van-row>
|
|
|
- <van-col span="8">周一</van-col>
|
|
|
- <van-col span="8">
|
|
|
- <van-stepper v-model="sH" />
|
|
|
- <van-stepper v-model="sM" />
|
|
|
- </van-col>
|
|
|
- <van-col span="8">
|
|
|
- <van-radio name="1">单选框 2</van-radio>
|
|
|
- </van-col>
|
|
|
- </van-row>
|
|
|
- <van-row>
|
|
|
- <van-col span="8">周二</van-col>
|
|
|
- <van-col span="8">span: 8</van-col>
|
|
|
- <van-col span="8">
|
|
|
- <van-radio name="2">单选框 2</van-radio>
|
|
|
- </van-col>
|
|
|
- </van-row>
|
|
|
- <van-row>
|
|
|
- <van-col span="8">周三</van-col>
|
|
|
- <van-col span="8">span: 8</van-col>
|
|
|
- <van-col span="8">
|
|
|
- <van-radio name="3">单选框 2</van-radio>
|
|
|
- </van-col>
|
|
|
- </van-row>
|
|
|
- <van-row>
|
|
|
- <van-col span="8">周四</van-col>
|
|
|
- <van-col span="8">span: 8</van-col>
|
|
|
+ <van-checkbox-group v-model="checkbox" v-if="showPopover.length">
|
|
|
+ <van-row v-for="(item,i) in weeks" :key="i">
|
|
|
<van-col span="8">
|
|
|
- <van-radio name="4">单选框 2</van-radio>
|
|
|
+ <van-checkbox name="1" style="height: 2em"> {{item}} </van-checkbox>
|
|
|
</van-col>
|
|
|
- </van-row>
|
|
|
- <van-row>
|
|
|
- <van-col span="8">周五</van-col>
|
|
|
- <van-col span="8">span: 8</van-col>
|
|
|
- <van-col span="8">
|
|
|
- <van-radio name="5">单选框 2</van-radio>
|
|
|
- </van-col>
|
|
|
- </van-row>
|
|
|
- <van-row>
|
|
|
- <van-col span="8">周六</van-col>
|
|
|
- <van-col span="8">span: 8</van-col>
|
|
|
- <van-col span="8">
|
|
|
- <van-radio name="6">单选框 2</van-radio>
|
|
|
- </van-col>
|
|
|
- </van-row>
|
|
|
- <van-row>
|
|
|
- <van-col span="8">周日</van-col>
|
|
|
- <van-col span="8">span: 8</van-col>
|
|
|
- <van-col span="8">
|
|
|
- <van-radio name="7">单选框 2</van-radio>
|
|
|
+ <van-col span="16">
|
|
|
+ <van-popover
|
|
|
+ style="width: 100%; text-align: center"
|
|
|
+ v-model="showPopover[i]"
|
|
|
+ trigger="click"
|
|
|
+ >
|
|
|
+ <div style="display: flex; padding: 10px">
|
|
|
+ <div style="flex: 1; text-align: left">
|
|
|
+ <van-button
|
|
|
+ plain
|
|
|
+ hairline
|
|
|
+ type="default"
|
|
|
+ size="small"
|
|
|
+ @click="() => closeTime(i)"
|
|
|
+ >
|
|
|
+ 取消
|
|
|
+ </van-button>
|
|
|
+ </div>
|
|
|
+ <div style="flex: 1; text-align: right">
|
|
|
+ <van-button
|
|
|
+ plain
|
|
|
+ hairline
|
|
|
+ type="info"
|
|
|
+ size="small"
|
|
|
+ @click="() => saveTime(i)"
|
|
|
+ >
|
|
|
+ 确认
|
|
|
+ </van-button>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ <div
|
|
|
+ style="
|
|
|
+ width: 200px;
|
|
|
+ display: flex;
|
|
|
+ margin: 0 10px 10px 10px;
|
|
|
+ border: 1px solid #eee;
|
|
|
+ "
|
|
|
+ >
|
|
|
+ <van-datetime-picker
|
|
|
+ style="flex: 1"
|
|
|
+ v-model="time[i]"
|
|
|
+ type="time"
|
|
|
+ class="van-hairline--left"
|
|
|
+ :show-toolbar="false"
|
|
|
+ />
|
|
|
+ <van-datetime-picker
|
|
|
+ style="flex: 1; border-left: 1px solid #eee"
|
|
|
+ v-model="time2[i]"
|
|
|
+ :show-toolbar="false"
|
|
|
+ type="time"
|
|
|
+ />
|
|
|
+ </div>
|
|
|
+ <template #reference>
|
|
|
+ <div class="timerange van-hairline--surround">
|
|
|
+ {{timerange[i]}}
|
|
|
+ </div>
|
|
|
+ </template>
|
|
|
+ </van-popover>
|
|
|
</van-col>
|
|
|
</van-row>
|
|
|
- </van-radio-group>
|
|
|
+ </van-checkbox-group>
|
|
|
+ <br />
|
|
|
+ <van-button type="default" block round >打烊</van-button>
|
|
|
+ <van-button type="primary" block round >开始营业</van-button>
|
|
|
</van-popup>
|
|
|
</div>
|
|
|
</template>
|
|
|
@@ -104,10 +120,12 @@ import {
|
|
|
Popup as vanPopup,
|
|
|
Col as vanCol,
|
|
|
Row as vanRow,
|
|
|
- Radio as vanRadio,
|
|
|
- RadioGroup as vanRadioGroup,
|
|
|
- Stepper as vanStepper,
|
|
|
+ Checkbox as vanCheckbox,
|
|
|
+ CheckboxGroup as vanCheckboxGroup,
|
|
|
+ Popover as vanPopover,
|
|
|
+ DatetimePicker as vanDatetimePicker,
|
|
|
Dialog,
|
|
|
+ Notify
|
|
|
} from "vant";
|
|
|
import "vant/lib/cell/style/index";
|
|
|
import "vant/lib/cell-group/style/index";
|
|
|
@@ -116,9 +134,11 @@ import "vant/lib/button/style/index";
|
|
|
import "vant/lib/popup/style/index";
|
|
|
import "vant/lib/col/style/index";
|
|
|
import "vant/lib/row/style/index";
|
|
|
-import "vant/lib/radio/style/index";
|
|
|
-import "vant/lib/stepper/style/index";
|
|
|
-import "vant/lib/radio-group/style/index";
|
|
|
+import "vant/lib/notify/style/index";
|
|
|
+import "vant/lib/datetime-picker/style/index";
|
|
|
+import "vant/lib/popover/style/index";
|
|
|
+import "vant/lib/checkbox/style/index";
|
|
|
+import "vant/lib/checkbox-group/style/index";
|
|
|
import "vant/lib/nav-bar/style/index";
|
|
|
|
|
|
import { orderList, skip, nextone, cancel } from "../api/index";
|
|
|
@@ -126,20 +146,42 @@ export default {
|
|
|
name: "Queue",
|
|
|
data() {
|
|
|
return {
|
|
|
+ today: new Date(),
|
|
|
queueList: [],
|
|
|
- sH: 0,
|
|
|
- sM: 0,
|
|
|
- eH: 0,
|
|
|
- eM: 0,
|
|
|
+ showPopover: [],
|
|
|
open: false,
|
|
|
- radio: "",
|
|
|
+ time: ["00:00"],
|
|
|
+ time2: ["00:00"],
|
|
|
+ timerange: ["00:00 - 00:00"],
|
|
|
+ checkbox: [],
|
|
|
+ weeks: ["周一", "周二", "周三", "周四", "周五", "周六", "周日"],
|
|
|
};
|
|
|
},
|
|
|
mounted() {
|
|
|
+ this.showPopover.fil;
|
|
|
+ let showPopover = new Array(this.weeks.length), timerange = new Array(this.weeks.length);
|
|
|
+ showPopover.fill(false);
|
|
|
+ timerange.fill("00:00 - 00:00");
|
|
|
+ this.showPopover = showPopover;
|
|
|
+ this.timerange = timerange;
|
|
|
this.reloadOrder();
|
|
|
},
|
|
|
computed: {},
|
|
|
methods: {
|
|
|
+ closeTime(t) {
|
|
|
+ console.log(t);
|
|
|
+ const showP = JSON.parse(JSON.stringify(this.showPopover));
|
|
|
+ showP[t] = false;
|
|
|
+ this.showPopover = showP;
|
|
|
+ },
|
|
|
+ saveTime(t) {
|
|
|
+ let s = this.time[t].split(":"), e = this.time2[t].split(":");
|
|
|
+ let sMin = Number(s[0]*60 || 0) + Number(s[1] || 0);
|
|
|
+ let eMin = Number(e[0]*60 || 0) + Number(e[1] || 0);
|
|
|
+ if(eMin < sMin) return Notify("结束时间应在开始时间之后")
|
|
|
+ this.timerange[t] = this.time + " - " + this.time2;
|
|
|
+ this.closeTime(t)
|
|
|
+ },
|
|
|
toOpen() {
|
|
|
this.open = true;
|
|
|
},
|
|
|
@@ -197,9 +239,10 @@ export default {
|
|
|
vanPopup,
|
|
|
vanCol,
|
|
|
vanRow,
|
|
|
- vanRadio,
|
|
|
- vanRadioGroup,
|
|
|
- vanStepper
|
|
|
+ vanCheckbox,
|
|
|
+ vanCheckboxGroup,
|
|
|
+ vanPopover,
|
|
|
+ vanDatetimePicker,
|
|
|
},
|
|
|
};
|
|
|
</script>
|
|
|
@@ -218,7 +261,13 @@ export default {
|
|
|
box-sizing: border-box;
|
|
|
}
|
|
|
.queue .van-col {
|
|
|
- height: 2em;
|
|
|
- line-height: 2em;
|
|
|
+ height: 2.5em;
|
|
|
+ line-height: 1.5em;
|
|
|
+}
|
|
|
+.queue .timerange {
|
|
|
+ border-radius: 3px;
|
|
|
+ padding: 3px 5px;
|
|
|
+ width: 100%;
|
|
|
+ box-sizing: border-box;
|
|
|
}
|
|
|
</style>
|
liyongli