问题修改
This commit is contained in:
parent
a0a3c0cafe
commit
585a15b29e
14
pages.json
14
pages.json
|
|
@ -13,8 +13,8 @@
|
|||
{
|
||||
"path": "pages/system",
|
||||
"style": {
|
||||
"navigationBarTitleText": "皖送e餐"
|
||||
// "navigationStyle": "custom"
|
||||
// "navigationBarTitleText": "皖送e餐"
|
||||
"navigationStyle": "custom"
|
||||
}
|
||||
},
|
||||
{
|
||||
|
|
@ -189,9 +189,17 @@
|
|||
{
|
||||
"path": "pages/weeklyMenu/menuList",
|
||||
"style": {
|
||||
"navigationBarTitleText": "周菜谱"
|
||||
// "navigationBarTitleText": "周菜谱"
|
||||
"navigationStyle": "custom"
|
||||
}
|
||||
},
|
||||
{
|
||||
"path": "pages/weeklyMenu/menuHistory",
|
||||
"style": {
|
||||
// "navigationBarTitleText": "历史菜谱",
|
||||
"navigationStyle": "custom"
|
||||
}
|
||||
},
|
||||
{
|
||||
"path": "pages/weeklyMenu/menuDetail",
|
||||
"style": {
|
||||
|
|
|
|||
|
|
@ -39,7 +39,7 @@
|
|||
<view class="info-box" v-if="hIndex==0">
|
||||
<view style="margin-bottom: 20px;">
|
||||
<text style="color: #959FA4;">菜品简介</text>
|
||||
<text style="margin-left: 20px;word-break: break-all;">-</text>
|
||||
<text style="margin-left: 20px;word-break: break-all;">{{dashesData.intro||'-'}}</text>
|
||||
</view>
|
||||
<view style="margin-bottom: 20px;">
|
||||
<text style="color: #959FA4;">主料</text>
|
||||
|
|
|
|||
|
|
@ -144,7 +144,7 @@ export default {
|
|||
// 验证通过
|
||||
let param = {
|
||||
"mobile": this.form.phone,
|
||||
"code": "LOGIN",
|
||||
"code": this.form.code,
|
||||
"newPassword":AES.encrypt(this.form.newPassWord)
|
||||
}
|
||||
resetForgetPwdApi(param).then(res => {
|
||||
|
|
|
|||
|
|
@ -129,14 +129,14 @@
|
|||
</view>
|
||||
</view> -->
|
||||
|
||||
<u-popup :show="showNotice" mode="center" @close="close" @open="open" >
|
||||
<view style="width: 70vw;height: 30vh;">
|
||||
<u-popup :show="showNotice" mode="center" bgColor="transparent" @close="close" @open="open">
|
||||
<view style="width: 80vw;height: 45vh;background: transparent;background-image: url('../static/images/index/noticeBg.png');background-repeat: no-repeat;background-size: 100% 100%;">
|
||||
<view style="width: 100%;text-align: center;height: 40px;line-height: 40px;font-size: 30rpx;font-weight: bold;">通知</view>
|
||||
<view style="width: 90%;margin: 0 auto;height: 20vh;display: flex;justify-content: center;overflow-y: auto;">
|
||||
<view style="width: 90%;margin: 0 auto;height: 33vh;display: flex;justify-content: center;overflow-y: auto;">
|
||||
{{noticeData.informContent}}
|
||||
</view>
|
||||
<view style="width: 100%;height: 40px;display: flex;align-items: center;justify-content: center;">
|
||||
<view style="width: 70px;height: 30px;line-height:30px;background:#ffa040;border-radius: 10px;text-align: center;color: #FFF;" @click="showNotice=false">关闭</view>
|
||||
<view style="width: 80%;height: 40px;line-height:40px;background:#FE7900;border-radius: 10px;text-align: center;color: #FFF;" @click="showNotice=false">知道了</view>
|
||||
</view>
|
||||
</view>
|
||||
</u-popup>
|
||||
|
|
|
|||
|
|
@ -171,7 +171,7 @@ export default {
|
|||
// this.getCode()
|
||||
// }
|
||||
})
|
||||
// this.$tab.reLaunch('/pages/system')
|
||||
this.$tab.reLaunch('/pages/system')
|
||||
},
|
||||
// 登录成功后，处理函数
|
||||
loginSuccess(result) {
|
||||
|
|
|
|||
|
|
@ -1,6 +1,8 @@
|
|||
<template>
|
||||
<page-meta :page-font-size="fontValue+'px'" :root-font-size="fontValue+'px'"></page-meta>
|
||||
<view class="index_main" :style="{ minHeight: screenH + 'px' }">
|
||||
<view class="index_main" :style="{ minHeight: screenH + 'px' }">
|
||||
<!-- <Navbar title="皖送e餐" :showRightText="false" :isBack="false" :showBack="false"/> -->
|
||||
<view style="height: 50px;width: 100%;text-align: center;line-height: 50px;background: #FFF;font-weight: 600;font-size: 32rpx;margin-bottom: 20rpx;">皖送e餐</view>
|
||||
<view class="back-top"></view>
|
||||
<!-- 轮播图 -->
|
||||
<view class="swiper_nav">
|
||||
|
|
@ -123,7 +125,7 @@ page {
|
|||
.index_main {
|
||||
/* background: #f2f6fa; */
|
||||
overflow: auto;
|
||||
padding: 24rpx 0;
|
||||
padding: 0;
|
||||
box-sizing: border-box;
|
||||
}
|
||||
|
||||
|
|
|
|||
|
|
@ -26,7 +26,7 @@
|
|||
<view class="info-box" v-if="hIndex==0">
|
||||
<view style="margin-bottom: 20px;">
|
||||
<text style="color: #959FA4;">菜品简介</text>
|
||||
<text style="margin-left: 20px;word-break: break-all;">-</text>
|
||||
<text style="margin-left: 20px;word-break: break-all;">{{dashesData.intro||'-'}}</text>
|
||||
</view>
|
||||
<view style="margin-bottom: 20px;">
|
||||
<text style="color: #959FA4;">主料</text>
|
||||
|
|
@ -225,7 +225,7 @@ export default {
|
|||
console.log(res)
|
||||
if(res.code==200){
|
||||
// this.$modal.msgError("收藏成功")
|
||||
uni.$u.toast('取消藏成功')
|
||||
uni.$u.toast('取消收藏成功')
|
||||
this.getMenudishesDetail()
|
||||
}
|
||||
}
|
||||
|
|
|
|||
|
|
@ -0,0 +1,347 @@
|
|||
<template>
|
||||
<page-meta :page-font-size="fontValue+'px'" :root-font-size="fontValue+'px'"></page-meta>
|
||||
<view>
|
||||
<Navbar title="历史菜谱" :showRightText="true" :isBack="false" :text="'菜谱日期'" @clickIcon="handleRightText" />
|
||||
<scroll-view class="scroll-view" scroll-x="true">
|
||||
<view class="scroll-view-item" v-for="(item,index) in daysList" :key="index" :class="hIndex == index ? 'active' : ''" @click="changeDay(index)">
|
||||
<view style="width: 100%;display: flex;flex-direction: column;align-items: center;">
|
||||
<view>{{item.dateValue}}</view>
|
||||
<view>{{item.weekValue}}</view>
|
||||
<view class="activeLine" v-if="hIndex == index"></view>
|
||||
</view>
|
||||
</view>
|
||||
</scroll-view>
|
||||
<view class="tab-navigation" v-show="tabList.length>0">
|
||||
<Tabs ref="Tabs" :tabList="tabList" @changeTab="changeTab" />
|
||||
</view>
|
||||
<view class="menuContent" v-if="menuData.length>0">
|
||||
<scroll-view class="content-left" scroll-y="true">
|
||||
<view class="scroll-view-item" v-for="(item,index) in typeList" :key="index" :class="tIndex == index ? 'active2' : ''" @click="changeModel(item,index)">
|
||||
<view style="width: 100%;display: flex;flex-direction: column;align-items: center;">
|
||||
<view>{{item.typeName}}</view>
|
||||
</view>
|
||||
</view>
|
||||
</scroll-view>
|
||||
<scroll-view class="content-right" scroll-y="true" :scroll-top="scrollLeftTop" scroll-with-animation="true">
|
||||
<view v-for="(typeitem,typeindex) in typeList" :key="typeindex">
|
||||
<view :id="'scroll'+typeitem.typeId" style="margin: 20rpx 10rpx;font-weight: bold;font-size: 28rpx;">{{typeitem.typeName}}</view>
|
||||
<view class="scroll-right-item" v-for="(item,index) in typeitem.dishesList" :key="index" @click="goMenuList(item)">
|
||||
<view style="width: 100%;display: flex;align-items: center;">
|
||||
<view style="width: 26%;height: 100%;">
|
||||
<image class="image" :src="item.dishesImgUrl"></image>
|
||||
</view>
|
||||
<view style="width: 70%;height: 100%;padding-left: 20px;">
|
||||
<view>{{item.dishesDetailList[0].dishesName}}</view>
|
||||
<view>食堂：{{item.canteenName}}</view>
|
||||
<view>档口：{{item.stallName}}</view>
|
||||
<view style="color: #DD7D3C;">￥{{(item.dishesDetailList[0].prefPrice/100).toFixed(2)}}</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</scroll-view>
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
</view>
|
||||
<view v-if="menuData.length==0" class="flex justify-center align-center" style="height: 50vh" >
|
||||
<u-empty icon="../../static/images/not_order.png" text="暂无数据" textColor="#000" />
|
||||
</view>
|
||||
<u-datetime-picker
|
||||
ref="datetimePicker"
|
||||
:show="show"
|
||||
v-model="dateValue"
|
||||
title="选择日期"
|
||||
:filter="filter"
|
||||
mode="date"
|
||||
closeOnClickOverlay
|
||||
:minDate="startDateTimestamp"
|
||||
:maxDate="endDateTimestamp"
|
||||
@confirm="confirm"
|
||||
@cancel="cancel"
|
||||
@change="change"
|
||||
@close="close"
|
||||
></u-datetime-picker>
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import { getWeekDetailListAPI } from '../../api/week-menu/index'
|
||||
import Tabs from '@/pages/components/Tabs.vue'
|
||||
|
||||
export default {
|
||||
components: { Tabs },
|
||||
data() {
|
||||
const startDate = new Date(); // 起始日期
|
||||
const endDate = new Date(); // 结束日期
|
||||
startDate.setDate(endDate.getDate() -84); // 设置结束日期
|
||||
return {
|
||||
fontValue:uni.getStorageSync('fontSize') || 8,
|
||||
daysList:[],//日期列表
|
||||
hIndex:0,//日期选中index
|
||||
recipeId:"",//菜谱ID
|
||||
menuData:[],//菜谱列表数据
|
||||
tabList: [],//菜品类型名称
|
||||
typeList:[],//菜品类型数据
|
||||
typeNameList:[],
|
||||
tIndex:0,
|
||||
scrollLeftTop:0,//滚动位置,
|
||||
current: 0,
|
||||
show: false,
|
||||
dateValue:new Date(),
|
||||
selectDate:"",
|
||||
startDateTimestamp: Number(startDate), // 起始日期的时间戳
|
||||
endDateTimestamp: Number(endDate), // 结束日期的时间戳
|
||||
}
|
||||
},
|
||||
onLoad(options) {
|
||||
console.log(options)
|
||||
options = JSON.parse(options.params)
|
||||
this.recipeId=options.recipeId;
|
||||
this.daysList = this.getRecentWeekDates()
|
||||
this.selectDate = this.daysList[this.hIndex].data;
|
||||
this.getMenuListData()
|
||||
},
|
||||
methods: {
|
||||
getRecentWeekDates() {
|
||||
let currentDate = new Date(); // 获取当前日期
|
||||
let weekDates = [];
|
||||
for (let i = 0; i < 7; i++) {
|
||||
let day = currentDate.getDate()- 1;
|
||||
let month = currentDate.getMonth() + 1; // 月份是从0开始计数的，所以要+1
|
||||
let year = currentDate.getFullYear();
|
||||
//日期
|
||||
let formattedDate = `${month < 10 ? '0' + month : month}-${day < 10 ? '0' + day : day}`;
|
||||
let formattedDate2 = `${year}-${month < 10 ? '0' + month : month}-${day < 10 ? '0' + day : day}`;
|
||||
//周几
|
||||
var days = ['周日', '周一', '周二', '周三', '周四', '周五', '周六'];
|
||||
var dayOfWeek = currentDate.getDay();
|
||||
//对象
|
||||
let obj = {
|
||||
"data":formattedDate2,
|
||||
"dateValue":formattedDate,
|
||||
"weekValue":days[dayOfWeek]
|
||||
}
|
||||
weekDates.push(obj);
|
||||
currentDate.setDate(currentDate.getDate() - 1); // 获取前一天的日期
|
||||
}
|
||||
return weekDates;
|
||||
},
|
||||
// 获取菜谱
|
||||
async getMenuListData() {
|
||||
let param = {
|
||||
"recipeId":this.recipeId,
|
||||
"date":this.selectDate,
|
||||
// "date":"2025-02-10"
|
||||
}
|
||||
const res = await getWeekDetailListAPI(param)
|
||||
console.log(res, '周菜谱')
|
||||
if(res.code==200){
|
||||
if(res.rows&&res.rows.length>0){
|
||||
this.menuData = res.rows;
|
||||
this.tabList=[]
|
||||
//处理数据
|
||||
this.menuData.forEach(item=>{//渲染类型
|
||||
this.tabList.push(item.mealtimeName)
|
||||
})
|
||||
this.$refs.Tabs.handleTab(0)
|
||||
// this.changeTab(0)
|
||||
}else{
|
||||
this.menuData = [];
|
||||
this.tabList=[];
|
||||
this.typeList=[]
|
||||
this.typeNameList=[]
|
||||
this.tIndex=0
|
||||
}
|
||||
}else{
|
||||
uni.$u.toast(res.msg)
|
||||
this.menuData = [];
|
||||
this.tabList=[];
|
||||
this.typeList=[]
|
||||
this.typeNameList=[]
|
||||
this.tIndex=0
|
||||
}
|
||||
},
|
||||
//改变时间
|
||||
changeDay(index){
|
||||
this.hIndex=index;
|
||||
this.selectDate = this.daysList[this.hIndex].data;
|
||||
this.getMenuListData()
|
||||
},
|
||||
//菜品类型（1-早餐 2-午餐 3-下午茶 4-晚餐 5-夜宵）
|
||||
changeTab(index) {
|
||||
this.typeList = this.menuData[index].typeList;
|
||||
//左侧类别列表
|
||||
this.typeNameList=[]
|
||||
this.typeList.forEach(item=>{
|
||||
this.typeNameList.push(item.typeName)
|
||||
})
|
||||
//右侧菜列表
|
||||
this.tIndex=0;
|
||||
},
|
||||
//菜品类型（面点，粗粮，精品菜，卤菜...）
|
||||
changeModel(item,index){
|
||||
this.tIndex=index
|
||||
var len = 0
|
||||
if(index==0){
|
||||
len=0
|
||||
}else{
|
||||
this.typeList.forEach((ite,i)=>{
|
||||
console.log(i)
|
||||
console.log(index)
|
||||
if(i<index){
|
||||
len = len+ite.dishesList.length
|
||||
}
|
||||
})
|
||||
}
|
||||
setTimeout(()=>{
|
||||
uni.createSelectorQuery().in(this).select('#scroll'+item.typeId).boundingClientRect(res => {
|
||||
console.log(res)
|
||||
this.scrollLeftTop = 80 * len; // 设置滚动条距离左侧的距离
|
||||
}).exec()
|
||||
},100)
|
||||
// this.dishesList = this.typeList[index].dishesList;
|
||||
},
|
||||
goMenuList(item){
|
||||
uni.navigateTo({
|
||||
url: `/pages/weeklyMenu/menuDetail?params=${JSON.stringify(item)}`
|
||||
})
|
||||
},
|
||||
handleRightText() {
|
||||
console.log('?? ~ handleRightText ~ ')
|
||||
this.current = 5
|
||||
this.show = true
|
||||
},
|
||||
filter(type, options) {
|
||||
// if (type === 'year') {
|
||||
// return options.filter((option) => option % 2 === 0)
|
||||
// }
|
||||
return options
|
||||
},
|
||||
confirm(e) {
|
||||
this.show = false;
|
||||
if (!isNaN(e.value)) {
|
||||
const selectedDate = new Date(e.value);
|
||||
let weekDates = [];
|
||||
for (let i = 0; i < 7; i++) {
|
||||
let day = selectedDate.getDate();
|
||||
let month = selectedDate.getMonth() + 1; // 月份是从0开始计数的，所以要+1
|
||||
let year = selectedDate.getFullYear();
|
||||
//日期
|
||||
let formattedDate = `${month < 10 ? '0' + month : month}-${day < 10 ? '0' + day : day}`;
|
||||
let formattedDate2 = `${year}-${month < 10 ? '0' + month : month}-${day < 10 ? '0' + day : day}`;
|
||||
//周几
|
||||
var days = ['周日', '周一', '周二', '周三', '周四', '周五', '周六'];
|
||||
var dayOfWeek = selectedDate.getDay();
|
||||
//对象
|
||||
let obj = {
|
||||
"data":formattedDate2,
|
||||
"dateValue":formattedDate,
|
||||
"weekValue":days[dayOfWeek]
|
||||
}
|
||||
weekDates.push(obj);
|
||||
selectedDate.setDate(selectedDate.getDate() - 1); // 获取前一天的日期
|
||||
}
|
||||
console.log(weekDates)
|
||||
this.daysList = weekDates
|
||||
this.hIndex = 0
|
||||
this.selectDate = this.daysList[this.hIndex].data;
|
||||
this.getMenuListData()
|
||||
}
|
||||
},
|
||||
cancel() {
|
||||
this.show = false;
|
||||
},
|
||||
change(e) {
|
||||
console.log('change', e)
|
||||
},
|
||||
close() {
|
||||
this.show = false;
|
||||
},
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style lang="scss" scoped>
|
||||
page {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
box-sizing: border-box;
|
||||
background-color: #fff;
|
||||
height: 90vh;
|
||||
}
|
||||
.scroll-view {
|
||||
white-space: nowrap;
|
||||
width: 100%;
|
||||
}
|
||||
.scroll-view-item {
|
||||
display: inline-block;
|
||||
width: 160rpx;
|
||||
height: 100rpx;
|
||||
// line-height: 100rpx;
|
||||
text-align: center;
|
||||
color: #959FA4;
|
||||
font-size: 24rpx;
|
||||
|
||||
.activeLine{
|
||||
background: #DD7D3C;
|
||||
border-radius: 10upx;
|
||||
width: 100rpx;
|
||||
height: 6upx;
|
||||
}
|
||||
}
|
||||
.active {
|
||||
color: #DD7D3C;
|
||||
font-weight: bolder;
|
||||
font-size: 28rpx;
|
||||
}
|
||||
|
||||
.tab-navigation {
|
||||
display: flex;
|
||||
background-color: white;
|
||||
padding: 0px 16px 0 16px;
|
||||
}
|
||||
|
||||
.menuContent{
|
||||
width: 100%;
|
||||
display: flex;
|
||||
height: 80vh;
|
||||
// background-color: #ff6816;
|
||||
}
|
||||
.content-left{
|
||||
width: 20%;
|
||||
height: 80vh;
|
||||
}
|
||||
.active2 {
|
||||
color: #DD7D3C;
|
||||
font-weight: bolder;
|
||||
font-size: 26rpx;
|
||||
}
|
||||
|
||||
.content-right{
|
||||
width: 80%;
|
||||
height: 82vh;
|
||||
}
|
||||
.scroll-right-item{
|
||||
width: 100%;
|
||||
height: auto;
|
||||
font-size: 28rpx;
|
||||
// background-color: #959FA4;
|
||||
}
|
||||
.image {
|
||||
width: 150rpx;
|
||||
height: 150rpx;
|
||||
border-radius: 10rpx;
|
||||
margin: 20rpx;
|
||||
}
|
||||
|
||||
|
||||
</style>
|
||||
|
|
@ -1,7 +1,8 @@
|
|||
<template>
|
||||
<page-meta :page-font-size="fontValue+'px'" :root-font-size="fontValue+'px'"></page-meta>
|
||||
<view>
|
||||
<scroll-view class="scroll-view" scroll-x="true">
|
||||
<Navbar title="周菜谱" :showRightText="true" :isBack="false" :text="'历史菜谱'" @clickIcon="handleRightText" />
|
||||
<scroll-view class="date-view" scroll-x="true">
|
||||
<view class="scroll-view-item" v-for="(item,index) in daysList" :key="index" :class="hIndex == index ? 'active' : ''" @click="changeDay(index)">
|
||||
<view style="width: 100%;display: flex;flex-direction: column;align-items: center;">
|
||||
<view>{{item.dateValue}}</view>
|
||||
|
|
@ -10,10 +11,13 @@
|
|||
</view>
|
||||
</view>
|
||||
</scroll-view>
|
||||
<view class="tab-navigation">
|
||||
|
||||
|
||||
|
||||
<view class="tab-navigation" v-show="tabList.length>0">
|
||||
<Tabs ref="Tabs" :tabList="tabList" @changeTab="changeTab" />
|
||||
</view>
|
||||
<view class="menuContent">
|
||||
<view class="menuContent" v-if="menuData.length>0">
|
||||
<scroll-view class="content-left" scroll-y="true">
|
||||
<view class="scroll-view-item" v-for="(item,index) in typeList" :key="index" :class="tIndex == index ? 'active2' : ''" @click="changeModel(item,index)">
|
||||
<view style="width: 100%;display: flex;flex-direction: column;align-items: center;">
|
||||
|
|
@ -38,15 +42,12 @@
|
|||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</scroll-view>
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
</scroll-view>
|
||||
</view>
|
||||
|
||||
|
||||
<view v-if="menuData.length==0" class="flex justify-center align-center" style="height: 50vh" >
|
||||
<u-empty icon="../../static/images/not_order.png" text="暂无数据" textColor="#000" />
|
||||
</view>
|
||||
</view>
|
||||
</template>
|
||||
|
||||
|
|
@ -78,6 +79,16 @@ export default {
|
|||
this.getMenuListData()
|
||||
},
|
||||
methods: {
|
||||
//跳转历史记录
|
||||
handleRightText() {
|
||||
console.log('?? ~ handleRightText ~ ')
|
||||
let item = {
|
||||
recipeId:this.recipeId
|
||||
}
|
||||
uni.navigateTo({
|
||||
url: `/pages/weeklyMenu/menuHistory?params=${JSON.stringify(item)}`
|
||||
})
|
||||
},
|
||||
getRecentWeekDates() {
|
||||
let currentDate = new Date(); // 获取当前日期
|
||||
let weekDates = [];
|
||||
|
|
@ -106,7 +117,7 @@ export default {
|
|||
async getMenuListData() {
|
||||
let param = {
|
||||
"recipeId":this.recipeId,
|
||||
"date":this.daysList[this.hIndex].data,
|
||||
"date":this.daysList[this.hIndex].data
|
||||
}
|
||||
const res = await getWeekDetailListAPI(param)
|
||||
console.log(res, '周菜谱')
|
||||
|
|
@ -198,12 +209,12 @@ page {
|
|||
flex-direction: column;
|
||||
box-sizing: border-box;
|
||||
background-color: #fff;
|
||||
min-height: 100%;
|
||||
height: auto;
|
||||
height: 90vh;
|
||||
}
|
||||
.scroll-view {
|
||||
.date-view {
|
||||
white-space: nowrap;
|
||||
width: 100%;
|
||||
|
||||
}
|
||||
.scroll-view-item {
|
||||
display: inline-block;
|
||||
|
|
@ -236,12 +247,12 @@ page {
|
|||
.menuContent{
|
||||
width: 100%;
|
||||
display: flex;
|
||||
height: 83vh;
|
||||
height: 80vh;
|
||||
// background-color: #ff6816;
|
||||
}
|
||||
.content-left{
|
||||
width: 20%;
|
||||
height: 82vh;
|
||||
height: 80vh;
|
||||
}
|
||||
.active2 {
|
||||
color: #DD7D3C;
|
||||
|
|
@ -251,7 +262,7 @@ page {
|
|||
|
||||
.content-right{
|
||||
width: 80%;
|
||||
height: 82vh;
|
||||
height: 80vh;
|
||||
}
|
||||
.scroll-right-item{
|
||||
width: 100%;
|
||||
|
|
|
|||
|
|
@ -17,7 +17,7 @@
|
|||
<!-- <view class="refund-btn" @click="refundOrder" v-if="detailData.payState==4&&detailData.orderState==4">
|
||||
申请退款
|
||||
</view> -->
|
||||
<view class="flex appraise-right" @click="goEvaluate" v-if="detailData.orderState==2">
|
||||
<view class="flex appraise-right" @click="goEvaluate" v-if="detailData.orderState==2&&detailData.commentState==2">
|
||||
去评价
|
||||
<u-icon name="arrow-right" size="12" />
|
||||
</view>
|
||||
|
|
|
|||
|
|
@ -21,8 +21,8 @@
|
|||
</view>
|
||||
<view style="color: rgba(15, 39, 75, 0.8)">就餐时间：{{ item.orderTime.split(" ")[0] }}</view>
|
||||
</view>
|
||||
<view class="img-cont" @click="goDetail(item)">
|
||||
<view class="img" v-for="(goods, index) in item.orderDetailList" :key="index">
|
||||
<view class="img-cont" style="width: 80%;display: flex;align-items: center;flex-wrap: wrap;" @click="goDetail(item)">
|
||||
<view class="img" v-for="(goods,gindex) in item.orderDetailList" :key="gindex" v-if="gindex<3">
|
||||
<u-image :src="goods.goodsDishesImgUrl" width="80px" height="80px" />
|
||||
<view>{{ goods.goodsDishesName }}</view>
|
||||
</view>
|
||||
|
|
|
|||
|
|
@ -1,182 +1,177 @@
|
|||
<template>
|
||||
<page-meta :page-font-size="fontValue+'px'" :root-font-size="fontValue+'px'"></page-meta>
|
||||
<view class="content">
|
||||
<view class="top-wrapper">
|
||||
<view class="top-cont">
|
||||
<view class="top-title">订单</view>
|
||||
<u-input
|
||||
v-model="searchValue"
|
||||
class="top-ipt"
|
||||
placeholder="请输入食堂、档口、菜品/商品名"
|
||||
shape="circle"
|
||||
suffixIcon="search"
|
||||
suffixIconStyle="color: #909399; font-size: 36rpx;"
|
||||
placeholderStyle="font-weight: 400;font-size: 20rpx;color: rgba(15,39,75,0.4);"
|
||||
@blur="handleSearch"
|
||||
></u-input>
|
||||
<view class="top-filter" @click="openPopup">
|
||||
<span style="font-size: 28rpx; color: #0f274b">筛选</span>
|
||||
<u-icon name="../../static/images/pull.png" />
|
||||
</view>
|
||||
</view>
|
||||
<view style="padding: 0 16px">
|
||||
<Tabs :tabList="tabList" @changeTab="changeTab" />
|
||||
</view>
|
||||
|
||||
|
||||
|
||||
<!-- <view style="height: 56px"></view> -->
|
||||
<scroll-view style="width: 100%;height: 75vh;" @scrolltolower="onScrollTolower" scroll-y="true">
|
||||
<view class="evaluateCenter" v-if="this.tabIndex==1">
|
||||
<view class="evaluateCenterLeft">
|
||||
<u-image src="../../static/images/user.png" width="30px" height="30px" />
|
||||
<text>评价中心</text>
|
||||
</view>
|
||||
<view class="evaluateCenterRight" @click="goEvaluateCenter">
|
||||
去看看
|
||||
</view>
|
||||
</view>
|
||||
<view class="order-list" v-for="(item, index) in tableList" :key="index">
|
||||
<view class="flex justify-between">
|
||||
<!-- <view class="order-source">订单来源：双屏消费机</view> -->
|
||||
<view class="order-source" style="font-size: 28rpx;font-weight: bold;">订单类型：{{ item.orderTypeStr }}</view>
|
||||
<view style="color: rgba(15, 39, 75, 0.8)">就餐日期：{{ item.orderDate }}</view>
|
||||
</view>
|
||||
<view class="flex justify-between">
|
||||
<view style="display: flex;width: 70%;align-items: center;">
|
||||
<view style="color: #0f274b;text-overflow: ellipsis;overflow: hidden;white-space: nowrap;font-size: 28rpx;max-width: 75%;">{{ item.canteenName }}/{{item.stallName}}</view>
|
||||
<!-- <span style="color: #0f274b">{{ item.canteenName }}</span> -->
|
||||
<view class="intervalName" v-if="item.mealtimeName">{{ item.mealtimeName }}</view>
|
||||
</view>
|
||||
<view style="color: rgba(15, 39, 75, 0.8);font-size: 28rpx;" v-if="item.orderState==1">已下单</view>
|
||||
<view style="color: rgba(15, 39, 75, 0.8);font-size: 28rpx;" v-if="item.orderState==2">已完成</view>
|
||||
<view style="color: red;font-size: 28rpx;" v-if="item.orderState==3&&item.payState==3">已退单</view>
|
||||
<view style="color: rgba(15, 39, 75, 0.8);font-size: 28rpx;" v-if="item.orderState==3&&item.payState==5">已取消</view>
|
||||
<view style="color: red;font-size: 28rpx;" v-if="item.orderState==4&&item.payState==1">未支付</view>
|
||||
<view style="color: rgba(15, 39, 75, 0.8);font-size: 28rpx;" v-if="item.orderState==4&&item.payState==3">待下单</view>
|
||||
<view style="color: rgba(15, 39, 75, 0.8);font-size: 28rpx;" v-if="item.orderState==4&&item.payState==4">支付失败</view>
|
||||
</view>
|
||||
<view class="img-cont" @click="goDetail(item)">
|
||||
<view style="width: 80%;display: flex;align-items: center;flex-wrap: wrap;">
|
||||
<view class="img" v-for="(goods, gindex) in item.orderDetailList" :key="index" v-if="gindex<3">
|
||||
<u-image :src="goods.goodsDishesImgUrl" width="80px" height="80px" />
|
||||
<view style="width: 100%;white-space: nowrap;text-align: center;overflow: hidden;text-overflow: ellipsis;">{{ goods.goodsDishesName }}</view>
|
||||
<view class="content">
|
||||
<view class="top-wrapper">
|
||||
<view class="top-cont">
|
||||
<view class="top-title">订单</view>
|
||||
<u-input
|
||||
v-model="searchValue"
|
||||
class="top-ipt"
|
||||
placeholder="请输入食堂、档口、菜品/商品名"
|
||||
shape="circle"
|
||||
suffixIcon="search"
|
||||
suffixIconStyle="color: #909399; font-size: 36rpx;"
|
||||
placeholderStyle="font-weight: 400;font-size: 20rpx;color: rgba(15,39,75,0.4);"
|
||||
@blur="handleSearch"
|
||||
></u-input>
|
||||
<view class="top-filter" @click="openPopup">
|
||||
<span style="font-size: 28rpx; color: #0f274b">筛选</span>
|
||||
<u-icon name="../../static/images/pull.png" />
|
||||
</view>
|
||||
</view>
|
||||
<view class="price">
|
||||
<view>
|
||||
<span>￥</span>
|
||||
<span style="font-size: 18px">{{ (item.payableAmount/100).toFixed(2) }}</span>
|
||||
</view>
|
||||
<view style="color: rgba(15, 39, 75, 0.6)">共{{ item.orderDetailList.length }}件</view>
|
||||
<view style="padding: 0 16px">
|
||||
<Tabs :tabList="tabList" @changeTab="changeTab" />
|
||||
</view>
|
||||
</view>
|
||||
<view class="btn-cont">
|
||||
<view v-if="item.orderState == 2&&item.commentState==2">
|
||||
<u-button size="small" style="background: #ff6816;color: #FFF;font-size: 24rpx;" @click="goEvaluate(item)">评价</u-button>
|
||||
</view>
|
||||
<view style="display: flex;" v-if="item.payState==1">
|
||||
<u-button size="small" shape="circle" :plain="true" style="font-size: 24rpx;margin-right: 20rpx;" @click="cancelOrder(item)">取消订单</u-button>
|
||||
<u-button size="small" shape="circle" type="primary" style="font-size: 24rpx;" @click="goPay(item)">立即支付</u-button>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
<view style="margin: 20px 0" v-if="tableList.length > 0">
|
||||
<u-loadmore :status="status" nomoreText="没有更多数据了" />
|
||||
</view>
|
||||
<view v-else class="flex justify-center align-center" style="height: 50vh">
|
||||
<u-empty icon="../../static/images/not_order.png" text="暂无相关订单" textColor="#000" />
|
||||
</view>
|
||||
</scroll-view>
|
||||
|
||||
|
||||
<!-- <view style="height: 56px"></view> -->
|
||||
<scroll-view style="width: 100%;height: 80vh;" @scrolltolower="onScrollTolower" scroll-y="true">
|
||||
<view class="evaluateCenter" v-if="this.tabIndex==1">
|
||||
<view class="evaluateCenterLeft">
|
||||
<u-image src="../../static/images/user.png" width="30px" height="30px" />
|
||||
<text>评价中心</text>
|
||||
</view>
|
||||
<view class="evaluateCenterRight" @click="goEvaluateCenter">
|
||||
去看看
|
||||
</view>
|
||||
</view>
|
||||
<view class="order-list" v-for="(item, index) in tableList" :key="index">
|
||||
<view class="flex justify-between">
|
||||
<!-- <view class="order-source">订单来源：双屏消费机</view> -->
|
||||
<view class="order-source" style="font-size: 28rpx;font-weight: bold;">订单类型：{{ item.orderTypeStr }}</view>
|
||||
<view style="color: rgba(15, 39, 75, 0.8)">就餐日期：{{ item.orderDate }}</view>
|
||||
</view>
|
||||
<view class="flex justify-between">
|
||||
<view style="display: flex;width: 70%;align-items: center;">
|
||||
<view style="color: #0f274b;text-overflow: ellipsis;overflow: hidden;white-space: nowrap;font-size: 28rpx;max-width: 75%;">{{ item.canteenName }}/{{item.stallName}}</view>
|
||||
<!-- <span style="color: #0f274b">{{ item.canteenName }}</span> -->
|
||||
<view class="intervalName" v-if="item.mealtimeName">{{ item.mealtimeName }}</view>
|
||||
</view>
|
||||
<view style="color: rgba(15, 39, 75, 0.8);font-size: 28rpx;" v-if="item.orderState==1">已下单</view>
|
||||
<view style="color: rgba(15, 39, 75, 0.8);font-size: 28rpx;" v-if="item.orderState==2">已完成</view>
|
||||
<view style="color: red;font-size: 28rpx;" v-if="item.orderState==3&&item.payState==3">已退单</view>
|
||||
<view style="color: rgba(15, 39, 75, 0.8);font-size: 28rpx;" v-if="item.orderState==3&&item.payState==5">已取消</view>
|
||||
<view style="color: red;font-size: 28rpx;" v-if="item.orderState==4&&item.payState==1">未支付</view>
|
||||
<view style="color: rgba(15, 39, 75, 0.8);font-size: 28rpx;" v-if="item.orderState==4&&item.payState==3">待下单</view>
|
||||
<view style="color: rgba(15, 39, 75, 0.8);font-size: 28rpx;" v-if="item.orderState==4&&item.payState==4">支付失败</view>
|
||||
</view>
|
||||
<view class="img-cont" @click="goDetail(item)">
|
||||
<view style="width: 80%;display: flex;align-items: center;flex-wrap: wrap;">
|
||||
<view class="img" v-for="(goods, gindex) in item.orderDetailList" :key="index" v-if="gindex<3">
|
||||
<u-image :src="goods.goodsDishesImgUrl" width="80px" height="80px" />
|
||||
<view style="width: 100%;white-space: nowrap;text-align: center;overflow: hidden;text-overflow: ellipsis;">{{ goods.goodsDishesName }}</view>
|
||||
</view>
|
||||
</view>
|
||||
<view class="price">
|
||||
<view>
|
||||
<span>￥</span>
|
||||
<span style="font-size: 18px">{{ (item.payableAmount/100).toFixed(2) }}</span>
|
||||
</view>
|
||||
<view style="color: rgba(15, 39, 75, 0.6)">共{{ item.orderDetailList.length }}件</view>
|
||||
</view>
|
||||
</view>
|
||||
<view class="btn-cont">
|
||||
<view v-if="item.orderState == 2&&item.commentState==2">
|
||||
<u-button size="small" style="background: #ff6816;color: #FFF;font-size: 24rpx;" @click="goEvaluate(item)">评价</u-button>
|
||||
</view>
|
||||
<view style="display: flex;" v-if="item.payState==1">
|
||||
<u-button size="small" shape="circle" :plain="true" style="font-size: 24rpx;margin-right: 20rpx;" @click="cancelOrder(item)">取消订单</u-button>
|
||||
<u-button size="small" shape="circle" type="primary" style="font-size: 24rpx;" @click="goPay(item)">立即支付</u-button>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
<view style="margin: 20px 0" v-if="tableList.length > 0">
|
||||
<u-loadmore :status="status" nomoreText="没有更多数据了" />
|
||||
</view>
|
||||
<view v-else class="flex justify-center align-center" style="height: 50vh">
|
||||
<u-empty icon="../../static/images/not_order.png" text="暂无相关订单" textColor="#000" />
|
||||
</view>
|
||||
</scroll-view>
|
||||
</view>
|
||||
<!-- 筛选部分-->
|
||||
<u-popup :show="localShow" @close="closePopup" mode="bottom" round="20">
|
||||
<view class="filter-popup">
|
||||
<!-- 订单日期 -->
|
||||
<view class="section">
|
||||
<view class="section-title">订单日期</view>
|
||||
<view class="date-quick-select">
|
||||
<view
|
||||
v-for="(item, index) in dateOptions"
|
||||
:key="index"
|
||||
class="date-option"
|
||||
:class="{ active: currentDateOption === index }"
|
||||
@click="selectDateOption(index)"
|
||||
>
|
||||
{{ item.label }}
|
||||
</view>
|
||||
</view>
|
||||
|
||||
<view class="date-range">
|
||||
<view class="date-input" @click="showStartCalendar = true">
|
||||
<text class="date-placeholder" v-if="!startDate">开始时间</text>
|
||||
<text v-else class="selected-date">{{ startDate }}</text>
|
||||
</view>
|
||||
<text class="date-separator">-</text>
|
||||
<view class="date-input" @click="showEndCalendar = true">
|
||||
<text class="date-placeholder" v-if="!endDate">结束时间</text>
|
||||
<text v-else class="selected-date">{{ endDate }}</text>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
|
||||
<!-- 订单类型 -->
|
||||
<view class="section">
|
||||
<view class="section-title">订单类型</view>
|
||||
<u-grid :border="false" col="3">
|
||||
<u-grid-item v-for="(item, index) in orderTypes" :key="index" @click="selectOrderType(item.id,index)">
|
||||
<view class="order-type-item" :class="{ active: selectedOrderTypes.includes(item.id) }">
|
||||
{{ item.name }}
|
||||
</view>
|
||||
</u-grid-item>
|
||||
</u-grid>
|
||||
</view>
|
||||
|
||||
<!-- 底部按钮 -->
|
||||
<view class="bottom-buttons">
|
||||
<u-button
|
||||
text="清空"
|
||||
shape="circle"
|
||||
:customStyle="{
|
||||
border: '2rpx solid #DDDDDD',
|
||||
color: '#666666',
|
||||
background: '#ffffff',
|
||||
marginRight: '24px'
|
||||
}"
|
||||
@click="clearAll"
|
||||
></u-button>
|
||||
<u-button
|
||||
type="warning"
|
||||
text="确定"
|
||||
shape="circle"
|
||||
:customStyle="{
|
||||
background: '#ff6633'
|
||||
}"
|
||||
@click="confirm"
|
||||
></u-button>
|
||||
</view>
|
||||
</view>
|
||||
|
||||
<!-- 日期选择器 -->
|
||||
<u-datetime-picker
|
||||
v-model="dateValue"
|
||||
:show="showStartCalendar"
|
||||
@cancel="showStartCalendar = false"
|
||||
@confirm="selectStartDate"
|
||||
mode="date"
|
||||
></u-datetime-picker>
|
||||
|
||||
<u-datetime-picker
|
||||
v-model="dateValue2"
|
||||
:show="showEndCalendar"
|
||||
@cancel="showEndCalendar = false"
|
||||
@confirm="selectEndDate"
|
||||
mode="date"
|
||||
></u-datetime-picker>
|
||||
</u-popup>
|
||||
</view>
|
||||
<!-- 筛选部分-->
|
||||
<u-popup :show="localShow" @close="closePopup" mode="bottom" round="20">
|
||||
<view class="filter-popup">
|
||||
<!-- 订单日期 -->
|
||||
<view class="section">
|
||||
<view class="section-title">订单日期</view>
|
||||
<view class="date-quick-select">
|
||||
<view
|
||||
v-for="(item, index) in dateOptions"
|
||||
:key="index"
|
||||
class="date-option"
|
||||
:class="{ active: currentDateOption === index }"
|
||||
@click="selectDateOption(index)"
|
||||
>
|
||||
{{ item.label }}
|
||||
</view>
|
||||
</view>
|
||||
|
||||
<view class="date-range">
|
||||
<view class="date-input" @click="showStartCalendar = true">
|
||||
<text class="date-placeholder" v-if="!startDate">开始时间</text>
|
||||
<text v-else class="selected-date">{{ startDate }}</text>
|
||||
</view>
|
||||
<text class="date-separator">-</text>
|
||||
<view class="date-input" @click="showEndCalendar = true">
|
||||
<text class="date-placeholder" v-if="!endDate">结束时间</text>
|
||||
<text v-else class="selected-date">{{ endDate }}</text>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
|
||||
<!-- 订单类型 -->
|
||||
<view class="section">
|
||||
<view class="section-title">订单类型</view>
|
||||
<u-grid :border="false" col="3">
|
||||
<u-grid-item v-for="(item, index) in orderTypes" :key="index" @click="selectOrderType(item.id,index)">
|
||||
<view class="order-type-item" :class="{ active: selectedOrderTypes.includes(item.id) }">
|
||||
{{ item.name }}
|
||||
</view>
|
||||
</u-grid-item>
|
||||
</u-grid>
|
||||
</view>
|
||||
|
||||
<!-- 底部按钮 -->
|
||||
<view class="bottom-buttons">
|
||||
<u-button
|
||||
text="清空"
|
||||
shape="circle"
|
||||
:customStyle="{
|
||||
border: '2rpx solid #DDDDDD',
|
||||
color: '#666666',
|
||||
background: '#ffffff',
|
||||
marginRight: '24px'
|
||||
}"
|
||||
@click="clearAll"
|
||||
></u-button>
|
||||
<u-button
|
||||
type="warning"
|
||||
text="确定"
|
||||
shape="circle"
|
||||
:customStyle="{
|
||||
background: '#ff6633'
|
||||
}"
|
||||
@click="confirm"
|
||||
></u-button>
|
||||
</view>
|
||||
</view>
|
||||
|
||||
<!-- 日期选择器 -->
|
||||
<u-datetime-picker
|
||||
v-model="dateValue"
|
||||
:show="showStartCalendar"
|
||||
@cancel="showStartCalendar = false"
|
||||
@confirm="selectStartDate"
|
||||
mode="date"
|
||||
></u-datetime-picker>
|
||||
|
||||
<u-datetime-picker
|
||||
v-model="dateValue2"
|
||||
:show="showEndCalendar"
|
||||
@cancel="showEndCalendar = false"
|
||||
@confirm="selectEndDate"
|
||||
mode="date"
|
||||
></u-datetime-picker>
|
||||
</u-popup>
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
|
|
@ -564,14 +559,12 @@ export default {
|
|||
.content {
|
||||
background: #f9fbff;
|
||||
// height: 100%;
|
||||
height: 95vh;
|
||||
|
||||
height: 95vh;
|
||||
.top-wrapper {
|
||||
position: fixed;
|
||||
top: 4vh;
|
||||
padding-top: 4vh;
|
||||
width: 100vw;
|
||||
background: #f9fbff;
|
||||
z-index: 999;
|
||||
height: 95vh;
|
||||
}
|
||||
|
||||
.top-cont {
|
||||
|
|
|
|||
Binary file not shown.
|
After Width: | Height: | Size: 31 KiB |
Binary file not shown.
|
Before Width: | Height: | Size: 78 KiB After Width: | Height: | Size: 78 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 78 KiB |
|
|
@ -136,7 +136,7 @@ const request = config => {
|
|||
reject('500')
|
||||
} else if (code === 10000) {
|
||||
resolve(res.data)
|
||||
} else if (code !== 200 && code !== 10000) {
|
||||
} else if (code != 200 && code != 10000) {
|
||||
toast(msg)
|
||||
reject(code)
|
||||
}
|
||||
|
|
|
|||
Loading…
Reference in New Issue