125 lines
3.4 KiB
Vue
125 lines
3.4 KiB
Vue
<template>
|
|
<div class="app-container">
|
|
|
|
<div class="head-container">
|
|
叫号记录
|
|
</div>
|
|
<div class="head-container" id="table_drag">
|
|
<el-table ref="table" :data="tableData.data" v-loading="tableData.loading" row-key="id">
|
|
<el-table-column label="桌号" prop="callNum"> </el-table-column>
|
|
<el-table-column label="桌型" prop="typeEnum">
|
|
<template v-slot="scope">
|
|
{{ scope.row.name }}({{ scope.row.note }})
|
|
</template>
|
|
</el-table-column>
|
|
<el-table-column label="手机号" prop="phone"> </el-table-column>
|
|
<el-table-column label="状态">
|
|
<template v-slot="scope">
|
|
<span style="font-weight: 400;font-size: 14px;"
|
|
:style="{ color: scope.row.state == 2 ? '#3F9EFF' : '' }">{{ scope.row.state | stateFilter }}</span>
|
|
</template>
|
|
</el-table-column>
|
|
<el-table-column label="时间" prop="callTime"> </el-table-column>
|
|
|
|
</el-table>
|
|
</div>
|
|
<!-- <div class="head-container">
|
|
<el-pagination :total="tableData.total" @size-change="handleSizeChange" :current-page="tableData.page + 1"
|
|
:page-size="tableData.size" @current-change="paginationChange"
|
|
layout="total, sizes, prev, pager, next, jumper"></el-pagination>
|
|
</div> -->
|
|
</div>
|
|
</template>
|
|
|
|
<script>
|
|
import { callRecord, } from '@/api/shop'
|
|
export default {
|
|
data() {
|
|
return {
|
|
query: {
|
|
productId: '',
|
|
name: '',
|
|
categoryId: '',
|
|
typeEnum: ''
|
|
},
|
|
tableData: {
|
|
data: [],
|
|
page: 0,
|
|
size: 30,
|
|
loading: false,
|
|
total: 0
|
|
}
|
|
}
|
|
},
|
|
async mounted() {
|
|
await this.getTableData()
|
|
},
|
|
methods: {
|
|
// 分页回调
|
|
// paginationChange(e) {
|
|
// this.tableData.page = e - 1
|
|
// this.getTableData()
|
|
// },
|
|
// 获取商品列表
|
|
async getTableData() {
|
|
try {
|
|
|
|
const res = await callRecord({
|
|
shopId: localStorage.getItem('shopId'),
|
|
|
|
page: 1,
|
|
size: 9999
|
|
})
|
|
this.tableData.data = res.records
|
|
} catch (error) {
|
|
console.log(error)
|
|
}
|
|
},
|
|
// handleSizeChange(val) {
|
|
// this.tableData.size = val
|
|
// this.getTableData()
|
|
// },
|
|
},
|
|
filters: {
|
|
stateFilter(i) {
|
|
if (i == -1) {
|
|
return '已取消'
|
|
} else if (i == 0) {
|
|
return '排队中'
|
|
} else if (i == 1) {
|
|
return '叫号中'
|
|
} else if (i == 2) {
|
|
return '已入座'
|
|
} else if (i == 3) {
|
|
return '已过号 '
|
|
}
|
|
}
|
|
}
|
|
}
|
|
</script>
|
|
|
|
<style scoped lang="scss">
|
|
.handle {
|
|
font-size: 18px;
|
|
color: #999;
|
|
|
|
&:hover {
|
|
cursor: grab;
|
|
}
|
|
}
|
|
|
|
.shop_info {
|
|
display: flex;
|
|
|
|
.info {
|
|
flex: 1;
|
|
padding-left: 8px;
|
|
display: flex;
|
|
flex-direction: column;
|
|
|
|
.tag_wrap {
|
|
display: flex;
|
|
}
|
|
}
|
|
}
|
|
</style> |