This commit is contained in:
weipengfei 2024-06-20 18:19:46 +08:00
parent 80a9e5b039
commit 2dddedd3a4
5 changed files with 440 additions and 425 deletions

View File

@ -1,4 +1,4 @@
VITE_NOW_TYPE = 'build' VITE_NOW_TYPE = 'build'
VITE_PUSH_URL ='wss://multi-store.lihaink.cn/pull' VITE_PUSH_URL = 'wss://multi-store.lihaink.cn/pull'
VITE_BASE_URL = 'https://multi-store.lihaink.cn' VITE_BASE_URL = 'https://multi-store.lihaink.cn'

View File

@ -145,6 +145,7 @@ const changeActive = (index = -1, type = 1) => {
.list { .list {
display: flex; display: flex;
flex-wrap: wrap;
div { div {
margin-right: 1rem; margin-right: 1rem;

View File

@ -5,6 +5,7 @@ import price from "./price.vue";
import mitt from "@/utils/mitt.js"; import mitt from "@/utils/mitt.js";
import { useUserStore } from "@/store/user.js"; import { useUserStore } from "@/store/user.js";
import userList from "@/components/userList.vue"; import userList from "@/components/userList.vue";
import { ElMessage } from "element-plus";
const list = ref([]); const list = ref([]);
const allPrice = ref(0); // const allPrice = ref(0); //
@ -66,9 +67,11 @@ const changeCartNum = (val, old) => {
}).then((res) => { }).then((res) => {
allPrice.value = 0; allPrice.value = 0;
list.value.forEach((item) => { list.value.forEach((item) => {
allPrice.value += item.price*item.cart_num; allPrice.value += item.price * item.cart_num;
}); });
costPrice.value = allPrice.value; costPrice.value = allPrice.value;
}).catch((err)=>{
val.cart_num = err?.msg?.match(/\d+\.\d+/) || 1;
}); });
}; };
@ -96,7 +99,7 @@ const showPrice = (type = true) => {
const userInfo = ref({ const userInfo = ref({
uid: '' uid: ''
}) })
const setUser = (row)=>{ const setUser = (row) => {
userInfo.value = row; userInfo.value = row;
userInfo.value.uid = row.id; userInfo.value.uid = row.id;
} }
@ -136,17 +139,23 @@ onUnmounted(() => {
<div class="info" v-if="userInfo.uid"> <div class="info" v-if="userInfo.uid">
<div class="flex-bewteen"> <div class="flex-bewteen">
<div>手机号: {{ userInfo.mobile || userInfo.account }}</div> <div>手机号: {{ userInfo.mobile || userInfo.account }}</div>
<el-button type="primary" link class="change-user" @click="userListRef.open()">切换用户<el-icon><ArrowRight /></el-icon></el-button> <el-button type="primary" link class="change-user" @click="userListRef.open()">切换用户<el-icon>
<ArrowRight />
</el-icon></el-button>
</div> </div>
<div class="flex-bewteen" style="align-items: flex-end;"> <div class="flex-bewteen" style="align-items: flex-end;">
<div>采购款: {{ userInfo.purchase_funds }}</div> <div>采购款: {{ userInfo.purchase_funds }}</div>
<el-button link @click="userInfo.uid=''">重置<el-icon><RefreshLeft /></el-icon></el-button> <el-button link @click="userInfo.uid = ''">重置<el-icon>
<RefreshLeft />
</el-icon></el-button>
</div> </div>
</div> </div>
<div class="info" v-else style="align-items: center;display:flex;justify-content: space-between;"> <div class="info" v-else style="align-items: center;display:flex;justify-content: space-between;">
<div class="flex-bewteen" style="width:100%;"> <div class="flex-bewteen" style="width:100%;">
<div style="font-size: 1.2rem;">游客</div> <div style="font-size: 1.2rem;">游客</div>
<el-button type="primary" link class="change-user" @click="userListRef.open()">切换用户<el-icon><ArrowRight /></el-icon></el-button> <el-button type="primary" link class="change-user" @click="userListRef.open()">切换用户<el-icon>
<ArrowRight />
</el-icon></el-button>
</div> </div>
</div> </div>
</div> </div>
@ -157,17 +166,15 @@ onUnmounted(() => {
已选购 <span>{{ list.length }}</span> 已选购 <span>{{ list.length }}</span>
</div> </div>
<div class="nav-item-clear" @click="clearAll"> <div class="nav-item-clear" @click="clearAll">
<el-icon><Delete /></el-icon> (Delete) <el-icon>
<Delete />
</el-icon> (Delete)
</div> </div>
</div> </div>
<div class="order-list"> <div class="order-list">
<el-empty v-if="list.length == 0" description="请点击右侧添加商品" /> <el-empty v-if="list.length == 0" description="请点击右侧添加商品" />
<div v-else class="order-item" v-for="(item, index) in list" :key="index"> <div v-else class="order-item" v-for="(item, index) in list" :key="index">
<el-image <el-image loading="lazy" class="order-item-img" :src="item.image"></el-image>
loading="lazy"
class="order-item-img"
:src="item.image"
></el-image>
<div class="order-item-info"> <div class="order-item-info">
<div class="order-item-title"> <div class="order-item-title">
<div class="title">{{ item.store_name }}</div> <div class="title">{{ item.store_name }}</div>
@ -181,13 +188,8 @@ onUnmounted(() => {
¥<span>{{ item.price }}</span> ¥<span>{{ item.price }}</span>
</div> </div>
<div> <div>
<el-input-number <el-input-number v-model="item.cart_num" :precision="2" :min="+item.batch > 0 ? +item.batch : 1" :step="1"
v-model="item.cart_num" @change="changeCartNum(item)" />
step-strictly
:min="1"
:step="1"
@change="changeCartNum(item)"
/>
</div> </div>
</div> </div>
</div> </div>
@ -198,11 +200,9 @@ onUnmounted(() => {
<div class="price"> <div class="price">
<div class="total-item"> <div class="total-item">
合计: 合计:
<span <span>¥<span style="font-size: 1.4rem">{{
>¥<span style="font-size: 1.4rem">{{
allPrice.toFixed(2) allPrice.toFixed(2)
}}</span></span }}</span></span>
>
</div> </div>
<!-- <div class="total-item"> <!-- <div class="total-item">
优惠: 优惠:
@ -218,13 +218,8 @@ onUnmounted(() => {
</div> --> </div> -->
</div> </div>
<div class="order-btn"> <div class="order-btn">
<el-button <el-button class="btn" type="primary" @click="goPay" :disabled="list.length == 0 || allPrice < 500">{{
class="btn" allPrice < 500 ? "¥500起订" : "立即结账 (F9)" }}</el-button>
type="primary"
@click="goPay"
:disabled="list.length == 0"
>立即结账 (F9)</el-button
>
</div> </div>
</div> </div>
<price ref="priceRef" @changeAllPrice="changeAllPrice"></price> <price ref="priceRef" @changeAllPrice="changeAllPrice"></price>
@ -242,8 +237,8 @@ onUnmounted(() => {
display: flex; display: flex;
flex-direction: column; flex-direction: column;
.user-nav{ .user-nav {
.user-info{ .user-info {
padding: 1rem; padding: 1rem;
margin: 1rem; margin: 1rem;
margin-bottom: 0; margin-bottom: 0;
@ -251,20 +246,24 @@ onUnmounted(() => {
background-color: rgba($color: #f70, $alpha: 0.1); background-color: rgba($color: #f70, $alpha: 0.1);
border-radius: 0.5rem; border-radius: 0.5rem;
display: flex; display: flex;
.avatar { .avatar {
width: 3rem; width: 3rem;
height: 3rem; height: 3rem;
flex-shrink: 0; flex-shrink: 0;
} }
.info{
.info {
flex: 1; flex: 1;
margin-left: 1rem; margin-left: 1rem;
color: #666; color: #666;
.flex-bewteen{
.flex-bewteen {
display: flex; display: flex;
justify-content: space-between; justify-content: space-between;
} }
.change-user{
.change-user {
font-size: 1rem; font-size: 1rem;
} }
} }
@ -281,6 +280,7 @@ onUnmounted(() => {
span { span {
color: #ff4a00; color: #ff4a00;
} }
.nav-item-clear { .nav-item-clear {
display: flex; display: flex;
align-items: center; align-items: center;
@ -288,10 +288,12 @@ onUnmounted(() => {
cursor: pointer; cursor: pointer;
} }
} }
.order-list { .order-list {
flex: 1; flex: 1;
overflow-y: auto; overflow-y: auto;
padding-bottom: 10rem; padding-bottom: 10rem;
.order-item { .order-item {
display: flex; display: flex;
padding: 1rem; padding: 1rem;
@ -302,6 +304,7 @@ onUnmounted(() => {
height: 5rem; height: 5rem;
border-radius: 0.5rem; border-radius: 0.5rem;
} }
.order-item-info { .order-item-info {
flex: 1; flex: 1;
box-sizing: border-box; box-sizing: border-box;
@ -309,11 +312,13 @@ onUnmounted(() => {
display: flex; display: flex;
flex-direction: column; flex-direction: column;
justify-content: space-between; justify-content: space-between;
& > div {
&>div {
display: flex; display: flex;
align-items: center; align-items: center;
justify-content: space-between; justify-content: space-between;
} }
.order-item-title { .order-item-title {
.title { .title {
width: 18rem; width: 18rem;
@ -321,11 +326,13 @@ onUnmounted(() => {
white-space: nowrap; white-space: nowrap;
text-overflow: ellipsis; text-overflow: ellipsis;
} }
.delete { .delete {
color: #1890ff; color: #1890ff;
cursor: pointer; cursor: pointer;
} }
} }
.order-item-sku { .order-item-sku {
cursor: pointer; cursor: pointer;
font-size: 0.8rem; font-size: 0.8rem;
@ -334,6 +341,7 @@ onUnmounted(() => {
} }
} }
} }
.order-footer { .order-footer {
position: absolute; position: absolute;
bottom: 0; bottom: 0;
@ -350,25 +358,31 @@ onUnmounted(() => {
justify-content: space-between; justify-content: space-between;
border-bottom: 1px solid #eee; border-bottom: 1px solid #eee;
align-items: center; align-items: center;
.price { .price {
display: flex; display: flex;
align-items: center; align-items: center;
.total-item { .total-item {
padding-right: 1.5rem; padding-right: 1.5rem;
span { span {
color: #f5222d; color: #f5222d;
} }
} }
} }
.update-price { .update-price {
.btn { .btn {
border-radius: 3rem; border-radius: 3rem;
} }
} }
} }
.order-btn { .order-btn {
height: 3.2rem; height: 3.2rem;
padding: 1rem 1.5rem; padding: 1rem 1.5rem;
.btn { .btn {
width: 100%; width: 100%;
height: 100%; height: 100%;

View File

@ -22,7 +22,7 @@ const setForm = (data, type = "add") => {
const emit = defineEmits(["changeItem"]); const emit = defineEmits(["changeItem"]);
const changeItem = () => { const changeItem = () => {
if(!form.value.cart_num) form.value.cart_num = 1; if(!form.value.cart_num) form.value.cart_num = form.value.batch > 0 ? form.value.batch : 1;
emit("changeItem", form.value); emit("changeItem", form.value);
dialogVisible.value = false; dialogVisible.value = false;
}; };
@ -71,10 +71,10 @@ const close = () => {
<div class="sku"> <div class="sku">
<el-input-number <el-input-number
ref="inputRef" ref="inputRef"
:precision="2"
v-model="form.cart_num" v-model="form.cart_num"
step-strictly :placeholder="`请输入数量(默认为${+form.batch > 0 ? form.batch : '1.00'})`"
placeholder="请输入数量(默认为1)" :min="+form.batch > 0 ? +form.batch : 1"
:min="0"
:step="1" :step="1"
style="width: 20rem" style="width: 20rem"
size="large" size="large"

View File

@ -13,6 +13,7 @@ import { useRoute } from "vue-router";
import mitt from "@/utils/mitt.js"; import mitt from "@/utils/mitt.js";
import moment from "moment"; import moment from "moment";
import { printTicket } from "@/utils/EscPos.js"; import { printTicket } from "@/utils/EscPos.js";
import { ElMessage } from "element-plus";
const pupopRef = ref(null); const pupopRef = ref(null);
const orderRef = ref(null); const orderRef = ref(null);
@ -111,6 +112,7 @@ const checkOut = () => {
}; };
const goPay = () => { const goPay = () => {
if (orderRef.value.allPrice < 500) return ElMessage.error('订单金额不能低于500元');
checkOut(); checkOut();
payRef.value.drawer = true; payRef.value.drawer = true;
}; };
@ -122,14 +124,14 @@ const paySuccess = (data = null) => {
// trade_type: "MICROPAY", // // trade_type: "MICROPAY", //
// transaction_id: "4200002159202405159003084211", // // transaction_id: "4200002159202405159003084211", //
// } // }
// if(data) onPrint(data); // if(data) onPrint(data);
setTimeout(()=>{ setTimeout(() => {
orderRef.value.getList(); orderRef.value.getList();
}) })
}; };
// //
const onPrint = (data)=>{ const onPrint = (data) => {
let goods = []; let goods = [];
orderRef.value.list.forEach((item) => { orderRef.value.list.forEach((item) => {
goods.push({ goods.push({
@ -141,8 +143,8 @@ const onPrint = (data)=>{
}); });
}); });
let paytype = "现金支付"; let paytype = "现金支付";
if(data.pay_type==13) paytype = "支付宝支付"; if (data.pay_type == 13) paytype = "支付宝支付";
if(data.pay_type==9) paytype = "微信支付"; if (data.pay_type == 9) paytype = "微信支付";
let obj = { let obj = {
mer_name: userStore.userInfo.mer_name, // mer_name: userStore.userInfo.mer_name, //
service_phone: userStore.userInfo.service_phone, // service_phone: userStore.userInfo.service_phone, //
@ -194,18 +196,11 @@ onUnmounted(() => {
<div class="my-card"> <div class="my-card">
<order ref="orderRef" @goPay="goPay" @editPupop="editPupop" /> <order ref="orderRef" @goPay="goPay" @editPupop="editPupop" />
<padding /> <padding />
<shop <shop ref="shopRef" style="flex: 1" :storeList="storeList" :loading="loading" @getStoreList="getStoreList"
ref="shopRef" @changeItem="changeItem" @loadMore="loadMore" />
style="flex: 1"
:storeList="storeList"
:loading="loading"
@getStoreList="getStoreList"
@changeItem="changeItem"
@loadMore="loadMore"
/>
<pupop ref="pupopRef" @changeItem="cartAddInfo" /> <pupop ref="pupopRef" @changeItem="cartAddInfo" />
<padding /> <padding />
<classify ref="classifyRef" @getStoreList="getStoreList"/> <classify ref="classifyRef" @getStoreList="getStoreList" />
<pay ref="payRef" @paySuccess="paySuccess" /> <pay ref="payRef" @paySuccess="paySuccess" />
</div> </div>
</template> </template>
@ -214,26 +209,31 @@ onUnmounted(() => {
.my-card { .my-card {
display: flex; display: flex;
} }
/* 修改滚动条的样式 */ /* 修改滚动条的样式 */
::-webkit-scrollbar { ::-webkit-scrollbar {
width: 0.315rem; /* 设置滚动条的宽度 */ width: 0.315rem;
/* 设置滚动条的宽度 */
} }
/* 设置滚动条的轨道样式 */ /* 设置滚动条的轨道样式 */
::-webkit-scrollbar-track { ::-webkit-scrollbar-track {
background-color: #f1f1f1; /* 设置轨道的背景色 */ background-color: #f1f1f1;
/* 设置轨道的背景色 */
margin: 1.25rem 0; margin: 1.25rem 0;
} }
/* 设置滚动条的滑块样式 */ /* 设置滚动条的滑块样式 */
::-webkit-scrollbar-thumb { ::-webkit-scrollbar-thumb {
background-color: #ccc; /* 设置滑块的背景色 */ background-color: #ccc;
border-radius: 0.315rem; /* 设置滑块的圆角 */ /* 设置滑块的背景色 */
border-radius: 0.315rem;
/* 设置滑块的圆角 */
} }
/* 设置滚动条鼠标悬停时的滑块样式 */ /* 设置滚动条鼠标悬停时的滑块样式 */
::-webkit-scrollbar-thumb:hover { ::-webkit-scrollbar-thumb:hover {
background-color: #999; /* 设置鼠标悬停时滑块的背景色 */ background-color: #999;
/* 设置鼠标悬停时滑块的背景色 */
} }
</style> </style>