lanan-system-vue/src/views/repair/tickets/Components/TicketWares.vue
2024-10-17 23:39:54 +08:00

198 lines
7.0 KiB
Vue

<template>
<div>
<!-- 搜索 -->
<el-form :model="queryParams" ref="queryForm" size="small" :inline="true" v-show="showSearch" label-width="90px">
<el-form-item label="关键字" prop="query">
<el-input style="width: 20rem" type="text" placeholder="工单号、车牌号、联系电话" v-model="queryParams.query"/>
</el-form-item>
<el-form-item label="状态" prop="status">
<el-select v-model="queryParams.status">
<el-option v-for="item in this.getDictDatas(DICT_TYPE.TICKET_WARES_STATUS)" :key="item.value" :label="item.label" :value="item.value" />
</el-select>
</el-form-item>
<el-form-item>
<el-button type="primary" icon="el-icon-search" @click="handleQuery">搜索</el-button>
<el-button icon="el-icon-refresh" @click="resetQuery">重置</el-button>
</el-form-item>
</el-form>
<!-- 操作 -->
<el-row :gutter="10" class="mb8">
<right-toolbar :showSearch.sync="showSearch"></right-toolbar>
</el-row>
<el-table v-loading="loading" :data="list" :stripe="true" :show-overflow-tooltip="true">
<el-table-column label="序号" align="center" width="80">
<template scope="scope">
<span>{{ scope.$index + 1 }}</span>
</template>
</el-table-column>
<el-table-column label="单据号" align="center" prop="no" />
<el-table-column label="服务顾问" align="center" prop="adviserName" />
<el-table-column label="申请人" align="center" prop="repairName" />
<el-table-column label="状态" align="center" prop="status">
<template slot-scope="scope">
<dict-tag :type="DICT_TYPE.TICKET_WARES_STATUS" v-model="scope.row.status" />
</template>
</el-table-column>
<el-table-column label="备注" align="center" prop="remark" />
<el-table-column label="操作" align="center">
<template slot-scope="scope">
<el-button v-if="scope.row.status !== '01' || userRole !== 'service_advisor'" type="text" size="mini" icon="el-icon-view" @click="handleShow(scope.row)">
查看
</el-button>
<el-button v-if="(userRole === 'service_advisor' || userRole === 'general_inspection') && scope.row.status === '01'" @click="handleAudit(scope.row)" type="text" size="mini" icon="el-icon-s-check">
审核
</el-button>
<el-button @click="handleGet(scope.row)" v-if="userRole === 'repair_staff' && scope.row.status !== '01' && scope.row.type === '01'" type="text" size="mini" icon="el-icon-finished">
领料
</el-button>
<el-button @click="handleGet(scope.row)" v-if="userRole === 'repair_staff' && scope.row.status !== '01' && scope.row.type === '02'" type="text" size="mini" icon="el-icon-finished">
退料
</el-button>
</template>
</el-table-column>
</el-table>
<!-- 分页组件 -->
<pagination v-show="total > 0" :total="total" :page.sync="queryParams.pageNo" :limit.sync="queryParams.pageSize"
@pagination="getList"
/>
<TicketWaresShow ref="ticketWaresShow" :user-role="userRole" @success="getList" :type="type"/>
<el-dialog :title="dialogTitle" :visible.sync="dialogVisible" width="80%" v-dialogDrag append-to-body>
<el-table el-table v-loading="dialogLoading" :data="items" :stripe="true" :show-overflow-tooltip="true" @selection-change="handleSelect">
<el-table-column type="selection" width="80" align="center" />
<el-table-column label="名称" align="center" prop="waresName" :show-overflow-tooltip="true"/>
<el-table-column label="规格" align="center" prop="wares.model" width="180"/>
<el-table-column label="数量" align="center" prop="waresCount" width="180"/>
</el-table>
<div slot="footer" class="dialog-footer">
<el-button type="primary" @click="handleDoGet(false)" :disabled="selections.length === 0">
{{this.type ? '领料选择' : '退料选择'}}
</el-button>
<el-button type="primary" :disabled="items.length === 0" @click="handleDoGet(true)">
{{this.type ? '领料全部' : '退料全部'}}
</el-button>
</div>
</el-dialog>
</div>
</template>
<script>
import {getPage, repairPassTicketWares} from "@/api/repair/tickets/TicketWares";
import TicketWaresShow from "@/views/repair/tickets/Components/TicketWaresShow.vue";
import {listTwItem} from "@/api/repair/tickets/TWItem";
export default {
name: "TicketWares",
components: {TicketWaresShow},
props:{
type: Boolean,
userRole: String,
},
data(){
return{
queryParams:{
pageNo: 1,
pageSize: 10,
query: null,
type: this.type ? "01" : "02",
status: null
},
showSearch: true,
loading: false,
list: [],
total: 0,
dialogVisible: false,
dialogLoading: false,
items: [],
selections: [],
formData:{},
dialogTitle: ""
}
},
mounted() {
this.getList()
},
methods:{
async getList(){
try {
this.loading = true
const res = await getPage(this.queryParams)
if (res.data){
this.list = res.data.records
this.total = res.data.total
}
}finally {
this.loading = false
}
},
handleQuery(){
this.queryParams.pageNo = 1
this.getList()
},
resetQuery(){
this.resetForm('queryForm')
this.handleQuery()
},
handleShow(row){
this.$refs.ticketWaresShow.open(row)
},
handleAudit(row){
this.handleShow(row)
},
async handleGet(row){
this.formData = {
id: row.id,
}
this.dialogVisible = true
this.dialogTitle = this.type ? "领料确认" : "退料确认"
try {
this.dialogLoading = true
const data = {twId: row.id}
const res = await listTwItem(data)
this.items = res.data
// 只要可领料的
if (this.type){
this.items = this.items.filter(item => item.waresStatus === '04')
}else {
// 只要可退料的
this.items = this.items.filter(item => item.waresStatus === '05')
}
}finally {
this.dialogLoading = false
}
},
handleSelect(val){
this.selections = val
},
async handleDoGet(flag){
this.formData.type = this.type ? "01" : "02"
if (flag){
this.formData.items = [...this.items.map(item => {
return {
id: item.id,
waresStatus: this.type ? "01" : "03"
}
})]
}else {
this.formData.items = [...this.selections.map(item => {
return {
id: item.id,
waresStatus: this.type ? "01" : "03"
}
})]
}
try {
await repairPassTicketWares(this.formData)
this.dialogVisible = false
this.$modal.msgSuccess(this.type ? "领料成功" : "退料成功")
await this.getList()
}catch{}
}
}
}
</script>
<style scoped lang="scss">
</style>