lanan-system-vue/src/views/repair/tickets/Components/TicketWares.vue
2024-10-21 21:37:07 +08:00

205 lines
7.3 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>
<!-- &lt;!&ndash; todo 待完成 &ndash;&gt;-->
<!-- <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: "01"
},
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>