146 lines
3.9 KiB
Vue
146 lines
3.9 KiB
Vue
<template>
|
|
<div class="controls">
|
|
<div class="input-number">
|
|
<div class="reduce">
|
|
<el-icon @click="carts.changeNumber(-1, carts.selCart)"><Minus /></el-icon>
|
|
</div>
|
|
<span class="text">{{ carts.selCart.number || 1 }}</span>
|
|
<div class="add">
|
|
<el-icon @click="carts.changeNumber(1, carts.selCart)"><Plus /></el-icon>
|
|
</div>
|
|
</div>
|
|
<el-button
|
|
v-for="(item, index) in controls"
|
|
:key="index"
|
|
v-bund="item"
|
|
:disabled="btnDisabled(item)"
|
|
@click="controlsClick(item)"
|
|
>
|
|
{{ returnLabel(item) }}
|
|
</el-button>
|
|
</div>
|
|
</template>
|
|
|
|
<script setup>
|
|
const number = ref(1);
|
|
import { useCartsStore } from "@/store/modules/carts";
|
|
const carts = useCartsStore();
|
|
|
|
const controls = ref([
|
|
{ label: "规格", key: "", disabled: false, per: "sku" },
|
|
{ label: "赠送", key: "is_gift", disabled: false, per: "cart" },
|
|
{ label: "打包", key: "is_pack", disabled: false, per: "cart" },
|
|
{ label: "删除", key: "del", disabled: false, per: "cart" },
|
|
{ label: "存单", key: "", disabled: false, per: "save" },
|
|
{ label: "取单", key: "", disabled: false },
|
|
{ label: "单品备注", key: "one-note", disabled: false, per: "one-note" },
|
|
{ label: "整单备注", key: "all-note", disabled: false, per: "all-note" },
|
|
{ label: "退菜", key: "", disabled: false, per: "order" },
|
|
{ label: "免厨打", key: "is_print", disabled: false, per: "cart" },
|
|
{ label: "单品改价", key: "changePriceClick", disabled: false, per: "cart" },
|
|
{ label: "等叫", key: "is_wait_call", disabled: false, per: "cart" },
|
|
{ label: "整单等叫", key: "", disabled: false, per: "all-wating" },
|
|
]);
|
|
|
|
const emits = defineEmits(["noteClick", "changePriceClick", "packClick"]);
|
|
function controlsClick(item) {
|
|
switch (item.key) {
|
|
case "is_gift":
|
|
carts.updateTag("is_gift", carts.selCart.is_gift ? 0 : 1);
|
|
break;
|
|
case "is_pack":
|
|
emits("packClick", carts.selCart.pack_number, carts.selCart.number);
|
|
break;
|
|
case "is_print":
|
|
carts.updateTag("is_print", carts.selCart.is_print ? 0 : 1);
|
|
break;
|
|
case "del":
|
|
carts.del(carts.selCart);
|
|
break;
|
|
case "changePriceClick":
|
|
emits("changePriceClick", carts.selCart);
|
|
break;
|
|
case "one-note":
|
|
emits("noteClick", true);
|
|
break;
|
|
case "all-note":
|
|
emits("noteClick", false);
|
|
break;
|
|
case "is_wait_call":
|
|
carts.updateTag("is_wait_call", carts.selCart.is_wait_call ? 0 : 1);
|
|
break;
|
|
case "all-wating":
|
|
carts.allWating();
|
|
break;
|
|
}
|
|
}
|
|
const perList = computed(() => {
|
|
if (!carts.selCart.id) {
|
|
return ["all-wating", "all-note"];
|
|
}
|
|
if (carts.selCart.id) {
|
|
return ["cart", "save", "one-note", "all-note", "all-wating"];
|
|
}
|
|
});
|
|
|
|
function btnDisabled(item) {
|
|
return !perList.value.includes(item.per);
|
|
}
|
|
function returnLabel(item) {
|
|
if (item.key == "is_gift") {
|
|
return carts.selCart.is_gift ? "取消赠送" : "赠送";
|
|
}
|
|
if (item.key == "is_pack") {
|
|
return carts.selCart.is_pack ? "取消打包" : "打包";
|
|
}
|
|
if (item.key == "is_print") {
|
|
return carts.selCart.is_print ? "免厨打" : "打印";
|
|
}
|
|
if (item.key == "is_wait_call") {
|
|
return carts.selCart.is_wait_call ? "取消等叫" : "等叫";
|
|
}
|
|
return item.label;
|
|
}
|
|
</script>
|
|
|
|
<style scoped lang="scss">
|
|
$gap: 10px;
|
|
.controls {
|
|
display: flex;
|
|
height: 100%;
|
|
flex-direction: column;
|
|
width: 106px;
|
|
padding: 14px 10px;
|
|
background-color: #f7f7fa;
|
|
}
|
|
.el-button + .el-button {
|
|
margin-top: $gap;
|
|
margin-left: 0;
|
|
}
|
|
.input-number {
|
|
display: flex;
|
|
flex-direction: column;
|
|
background-color: #fff;
|
|
border: 1px solid #dcdfe6;
|
|
margin-bottom: $gap;
|
|
cursor: pointer;
|
|
.reduce,
|
|
.text,
|
|
.add {
|
|
display: flex;
|
|
justify-content: center;
|
|
align-items: center;
|
|
height: 38px;
|
|
}
|
|
.text {
|
|
height: 48px;
|
|
font-size: 30px;
|
|
border-top: 1px solid #dcdfe6;
|
|
border-bottom: 1px solid #dcdfe6;
|
|
}
|
|
.reduce {
|
|
}
|
|
.add {
|
|
}
|
|
}
|
|
</style> |