lanan-system-vue/src/views/repair/tickets/Components/TicketChoose.vue
2024-09-25 15:53:59 +08:00

72 lines
1.8 KiB
Vue

<template>
<div>
<el-select ref="ticketSelect" v-model="ticketSelected" clearable>
<el-option v-for="ticket in ticketList" :key="ticket.id" :label="ticket.ticketNo" :value="ticket.id" v-show="false"/>
<el-table v-loading="loading" :data="ticketList" :stripe="true" :show-overflow-tooltip="true" @row-click="rowClick">
<el-table-column label="序号" align="center">
<template scope="scope">
<span>{{ scope.$index + 1 }}</span>
</template>
</el-table-column>
<el-table-column label="单号" align="center" width="200" prop="ticketNo" />
<el-table-column label="姓名" align="center" width="180" prop="userName" />
<el-table-column label="车牌" align="center" width="180" prop="carNo" />
</el-table>
<pagination @pagination="listTicket" v-show="total > 0" :total="total" :page.sync="queryParams.pageNo" :limit.sync="queryParams.pageSize"
/>
</el-select>
</div>
</template>
<script>
import {getTicketsPage} from "@/api/repair/tickets/Tickets";
export default {
name: "TicketChoose",
props:{
value:{
type: Object
}
},
data() {
return {
ticketSelected: null,
ticketList: [],
total: 0,
loading: false,
queryParams:{
pageNo: 1,
pageSize: 10,
ticketsStatus: "01"
}
}
},
watch:{
value(val){
// console.log(val)
}
},
mounted() {
this.listTicket()
},
methods: {
// 未结算工单
async listTicket(){
const res = await getTicketsPage(this.queryParams)
this.ticketList = res.data.records
this.total = res.data.total
},
rowClick(row){
this.ticketSelected = row.id
this.$emit("selected", row.id)
this.$refs.ticketSelect.blur()
}
}
}
</script>
<style scoped lang="scss">
</style>