199 lines
3.4 KiB
Vue
199 lines
3.4 KiB
Vue
<template>
|
||
<view class="callRecord">
|
||
<view v-for="item in datas.list" :key="item.id">
|
||
<view>
|
||
<view>
|
||
{{item.callNum}}
|
||
</view>
|
||
<view>
|
||
（{{item.note}}）
|
||
</view>
|
||
</view>
|
||
<view :class="[item.state==3?'rightTopstyle':'rightTop']">
|
||
{{filterEvent(item.state)}}
|
||
</view>
|
||
<view>
|
||
<view>
|
||
<view>
|
||
时间
|
||
</view>
|
||
<view>
|
||
{{item.callTime}}
|
||
</view>
|
||
</view>
|
||
<view>
|
||
<view>
|
||
手机号
|
||
</view>
|
||
<view>
|
||
{{item.phone}}
|
||
</view>
|
||
</view>
|
||
</view>
|
||
</view>
|
||
</view>
|
||
</template>
|
||
|
||
<script setup>
|
||
import {
|
||
onMounted,
|
||
reactive
|
||
} from 'vue';
|
||
import {
|
||
callTablecallRecord,
|
||
} from '@/http/yskApi/requestAll.js';
|
||
let datas = reactive({
|
||
list: ""
|
||
})
|
||
onMounted(() => {
|
||
getList()
|
||
})
|
||
|
||
function filterEvent(i) {
|
||
// -1已取消 0排队中 1叫号中 2已入座 3 已过号
|
||
if (i == -1) {
|
||
return '已取消'
|
||
} else if (i == 0) {
|
||
return '排队中'
|
||
} else if (i == 1) {
|
||
return '叫号中'
|
||
} else if (i == 2) {
|
||
return '已入座'
|
||
} else if (i == 3) {
|
||
return '已过号 '
|
||
}
|
||
}
|
||
|
||
function getList() {
|
||
callTablecallRecord({
|
||
shopId: uni.getStorageSync('shopId'),
|
||
page: 1,
|
||
size: 9999
|
||
}).then((res) => {
|
||
datas.list = res.records
|
||
})
|
||
}
|
||
</script>
|
||
<style>
|
||
page {
|
||
background: #f9f9f9;
|
||
}
|
||
</style>
|
||
<style scoped lang="less">
|
||
// * {
|
||
// padding: 0;
|
||
// margin: 0;
|
||
// text-decoration: none;
|
||
// outline: none;
|
||
// }
|
||
|
||
|
||
ul,
|
||
li {
|
||
list-style: none;
|
||
padding: 12rpx;
|
||
}
|
||
|
||
|
||
|
||
.callRecord {
|
||
|
||
>view {
|
||
width: 694rpx;
|
||
height: 166rpx;
|
||
margin: 32rpx 0;
|
||
background: #FFFFFF;
|
||
border-radius: 18rpx 18rpx 18rpx 18rpx;
|
||
display: flex;
|
||
align-items: center;
|
||
position: relative;
|
||
|
||
>view:first-child {
|
||
padding: 0 58rpx;
|
||
box-sizing: border-box;
|
||
|
||
>view:first-child {
|
||
font-family: Source Han Sans CN, Source Han Sans CN;
|
||
font-weight: 500;
|
||
font-size: 56rpx;
|
||
color: #333333;
|
||
text-align: center;
|
||
}
|
||
|
||
>view:last-child {
|
||
font-family: Source Han Sans CN, Source Han Sans CN;
|
||
font-weight: 500;
|
||
font-size: 24rpx;
|
||
color: #999999;
|
||
text-align: center;
|
||
}
|
||
}
|
||
|
||
>view:last-child {
|
||
height: 120rpx;
|
||
border-left: 2rpx solid #E5E5E5;
|
||
padding-left: 32rpx;
|
||
|
||
>view {
|
||
display: flex;
|
||
align-items: center;
|
||
margin-top: 24rpx;
|
||
|
||
>view:first-child {
|
||
font-family: Source Han Sans CN, Source Han Sans CN;
|
||
font-weight: 500;
|
||
font-size: 28rpx;
|
||
color: #333333;
|
||
width: 90rpx;
|
||
}
|
||
|
||
>view:last-child {
|
||
font-family: Source Han Sans CN, Source Han Sans CN;
|
||
font-weight: 400;
|
||
font-size: 28rpx;
|
||
color: #666666;
|
||
}
|
||
}
|
||
}
|
||
|
||
.rightTop {
|
||
position: absolute;
|
||
right: 0rpx;
|
||
top: 0;
|
||
|
||
width: 94rpx;
|
||
height: 36rpx;
|
||
line-height: 36rpx;
|
||
text-align: center;
|
||
background: #4394FD;
|
||
border-radius: 0rpx 8rpx 0rpx 8rpx;
|
||
|
||
font-family: Source Han Sans CN, Source Han Sans CN;
|
||
font-weight: 400;
|
||
font-size: 22rpx;
|
||
color: #FFFFFF;
|
||
}
|
||
|
||
.rightTopstyle {
|
||
position: absolute;
|
||
right: 0rpx;
|
||
top: 0;
|
||
|
||
width: 94rpx;
|
||
height: 36rpx;
|
||
line-height: 36rpx;
|
||
text-align: center;
|
||
background: #9a9a9a;
|
||
border-radius: 0rpx 8rpx 0rpx 8rpx;
|
||
|
||
font-family: Source Han Sans CN, Source Han Sans CN;
|
||
font-weight: 400;
|
||
font-size: 22rpx;
|
||
color: #FFFFFF;
|
||
}
|
||
|
||
}
|
||
|
||
|
||
}
|
||
</style> |