增加点餐智能推荐

This commit is contained in:
2025-11-20 18:45:04 +08:00
parent bb4c2676e7
commit ce3674be35
13 changed files with 813 additions and 76 deletions

View File

@@ -1,3 +1,280 @@
<template>
<view class="min-page bg-f7"></view>
</template>
<view class="min-page bg-f7 u-font-28">
<up-sticky>
<view class="bg-fff default-box-padding">
<view class="u-flex">
<image
style="width: 60rpx; height: 60rpx"
src="/pageMarket/static/images/suggest.png"
></image>
<view class="u-flex-1 u-flex u-p-l-24">
<view class="u-font-28 u-flex-1 u-p-r-24">
<view class="color-333 font-bold">点餐智能推荐 </view>
<view class="color-666 u-m-t-4 u-font-24"
>进入点单页X秒未点自动推荐商品此推荐设置启用即生效
</view>
</view>
<up-switch
v-model="accountInfoStore.shopInfo.isProductSuggest"
size="18"
:active-value="1"
:inactive-value="0"
></up-switch>
</view>
</view>
<view class="u-m-t-32">
<view class="u-flex">
<view class="color-333 font-bold">首次弹窗触发时间 </view>
<view class="time" @click="showTimeModal">{{
accountInfoStore.shopInfo.suggestTime
}}</view>
<text class="u-m-l-10"></text>
</view>
<view class="color-666 u-font-24 u-m-t-8"
>多个弹窗时每个弹窗之间关闭和弹出间隔为15秒
</view>
</view>
</view>
</up-sticky>
<view class="default-box-padding">
<view
v-for="(item, index) in list"
class="u-m-b-56 default-box-radius bg-fff default-box-padding"
>
<view class="u-flex u-row-between">
<text class="u-font-32 font-bold color-333">{{ item.title }}</text>
<view class="status" :class="['status' + item.status]">{{
item.status == 1 ? "启用" : "禁用"
}}</view>
</view>
<view class="u-m-t-22 color-666 u-font-24">
<view> {{ item.useDays }}</view>
<view class="u-m-t-16"> {{ returnUseTimeType(item) }}</view>
</view>
<view class="u-flex u-row-right gap-20 u-m-t-24">
<view class="btn del" @click="handleDelete(item)">删除</view>
<view class="btn edit" @click="handleEdit(item)">编辑</view>
</view>
</view>
</view>
<view style="height: 100rpx"></view>
<view class="fixed-bottom">
<my-button @click="go.to('PAGES_MARKET_ORDER_RECOMMENDATION_ADD')"
>添加</my-button
>
</view>
<Modal
v-model="modalData.show"
:title="modalData.title"
@confirm="handleConfirm"
>
<template v-if="modalData.key == 'timeModal'">
<view class="default-box-padding">
<view class="u-flex u-m-t-16">
<input
class="number-box"
placeholder="首次弹窗触发时间"
placeholder-class="color-999 u-font-28"
type="number"
v-model="firstModalTime"
/>
<view class="unit"></view>
</view>
<view class="u-font-28 color-666 u-m-t-8"
>设置为0时进入点餐页立即弹出</view
>
</view>
</template>
</Modal>
</view>
</template>
<script setup>
import {
onLoad,
onReady,
onShow,
onPageScroll,
onReachBottom,
onBackPress,
} from "@dcloudio/uni-app";
import Modal from "@/pageMarket/components/modal.vue";
import * as suggestApi from "@/http/api/market/suggest.js";
import { useAccountInfoStore } from "@/store/account.js";
import go from "@/commons/utils/go.js";
const accountInfoStore = useAccountInfoStore();
import { ref, reactive, onMounted } from "vue";
import { watch } from "vue";
const loadFinish = ref(false);
const form = reactive({
isEnable: 0,
});
const firstModalTime = ref(0);
const modalData = reactive({
show: false,
title: "",
key: "",
});
function handleDelete(item) {
uni.showModal({
title: "确认删除吗?",
success: (res) => {
if (res.confirm) {
suggestApi
.deleteSuggest({
id: item.id,
})
.then((res) => {
uni.showToast({
title: "删除成功",
icon: "none",
});
refreshList();
});
}
},
});
}
function refreshList() {
query.pageNum = 1;
isEnd.value = false;
getList();
}
function handleEdit(item) {
uni.setStorageSync("suggestItem", item);
go.to("PAGES_MARKET_ORDER_RECOMMENDATION_ADD", {
type: "edit",
});
}
function showTimeModal() {
modalData.show = true;
firstModalTime.value = accountInfoStore.shopInfo.suggestTime || 0;
modalData.title = "首次弹窗触发时间";
modalData.key = "timeModal";
}
const handleConfirm = async () => {
if (firstModalTime.value < 0) {
uni.showToast({
title: "请输入正确的时间",
icon: "none",
});
return;
}
accountInfoStore.editShopInfo({
suggestTime: firstModalTime.value,
id: accountInfoStore.shopInfo.id,
});
uni.showToast({
title: "设置成功",
icon: "none",
});
modalData.show = false;
};
const isEnd = ref(false);
const query = {
pageNum: 1,
pageSize: 10,
};
const list = ref([]);
const getList = async () => {
loadFinish.value = false;
if (isEnd.value) {
return;
}
const res = await suggestApi.suggestPage(query);
loadFinish.value = true;
if (query.pageNum >= res.totalPage * 1) {
isEnd.value = true;
}
if (query.pageNum == 1) {
list.value = res.records || [];
} else {
list.value = list.value.concat(res.records || []);
}
console.log(list.value);
query.pageNum++;
};
function returnUseTimeType(item) {
if (item.useTimeType == "all") {
return "全天";
}
return `${item.useStartTime} - ${item.useEndTime}`;
}
function getShopInfo() {
accountInfoStore.getShopInfo().then((res) => {
console.log(res);
});
}
watch(
() => accountInfoStore.shopInfo.isProductSuggest,
(newVal, oldVal) => {
if (!loadFinish.value) return;
accountInfoStore.editShopInfo({
isProductSuggest: newVal,
id: accountInfoStore.shopInfo.id,
});
uni.showToast({
title: "修改成功",
icon: "none",
});
}
);
onReachBottom(() => {
console.log("触底");
getList();
});
onMounted(() => {
getList();
getShopInfo();
});
onShow(() => {
refreshList();
});
</script>
<style lang="scss" scoped>
.status {
padding: 8rpx 18rpx;
border: 2rpx solid transparent;
border-radius: 8rpx;
&.status1 {
background-color: rgba(123, 209, 54, 0.12);
border-color: rgba(123, 209, 54, 1);
color: #7bd136;
}
&.status0 {
border-color: rgba(153, 153, 153, 1);
background-color: rgba(153, 153, 153, 0.12);
color: #999;
}
}
.btn {
padding: 8rpx 42rpx;
border-radius: 100rpx;
&.del {
background-color: #f7f7fa;
color: #999;
}
&.edit {
background-color: $my-main-color;
color: #fff;
}
}
.fixed-bottom {
left: 70rpx;
right: 70rpx;
}
.time {
margin-left: 30rpx;
padding: 4rpx 20rpx;
border: 1px solid $my-main-color;
border-radius: 8rpx;
color: $my-main-color;
}
</style>