RiderEvaluateList.vue
2.13 KB
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
<template>
<div>
<a-card title="骑手评价" :bordered="false" class="list-table-card">
<div class="list-toolbar">
<div class="list-toolbar-left">
<a-input-number v-model:value="filterRiderId" placeholder="骑手ID" class="list-filter" />
<a-select v-model:value="filterType" placeholder="评价类型" allowClear class="list-filter">
<a-select-option :value="0">全部</a-select-option>
<a-select-option :value="1">好评(4-5星)</a-select-option>
<a-select-option :value="2">中评(3星)</a-select-option>
<a-select-option :value="3">差评(1-2星)</a-select-option>
</a-select>
</div>
<div class="list-toolbar-right">
<a-button type="primary" @click="loadList">查询</a-button>
</div>
</div>
<a-table :dataSource="list" :columns="columns" :loading="loading" rowKey="id" :pagination="false">
<template #bodyCell="{ column, record }">
<template v-if="column.key === 'cityId'">
{{ getCityName(record.cityId) }}
</template>
<template v-if="column.key === 'star'">
<a-rate :value="record.star" disabled />
</template>
</template>
</a-table>
</a-card>
</div>
</template>
<script setup lang="ts">
import { ref, onMounted } from 'vue'
import { riderApi } from '@/api'
import { useRoleCityList } from '@/composables/useRoleCityList'
const loading = ref(false)
const list = ref<any[]>([])
const filterRiderId = ref<number | undefined>()
const filterType = ref(0)
const { loadCities, getCityName } = useRoleCityList()
const columns = [
{ title: 'ID', dataIndex: 'id', width: 80 },
{ title: '骑手ID', dataIndex: 'rid' },
{ title: '评分', key: 'star' },
{ title: '内容', dataIndex: 'content', ellipsis: true },
{ title: '租户', key: 'cityId' },
]
async function loadList() {
if (!filterRiderId.value) return
loading.value = true
try {
const res: any = await riderApi.evaluateList(filterRiderId.value, filterType.value)
list.value = res.data || []
} finally { loading.value = false }
}
onMounted(loadCities)
</script>