devicesmgt/sgzb-ui/src/views/repairTest/repair/index.vue

1146 lines
38 KiB
Vue

<template>
<div class="app-container" id="repair">
<el-form
:model="queryParams"
ref="queryForm"
size="small"
:inline="true"
v-show="showSearch"
label-width="120px"
>
<el-form-item label="关键字" prop="keyword">
<el-input
v-model="queryParams.keyword"
placeholder="请输入关键字"
clearable
maxlength="50"
style="width: 240px"
@keyup.enter.native="handleQuery"
/>
</el-form-item>
<el-form-item label="单位名称" prop="backUnit">
<el-select
v-model="queryParams.backUnit"
placeholder="请选择单位名称"
clearable
filterable
style="width: 240px"
>
<el-option
v-for="dict in unitInfoSelectList"
:key="dict.unitId"
:label="dict.unitName"
:value="dict.unitId"
/>
</el-select>
</el-form-item>
<el-form-item label="工程名称" prop="backPro">
<el-select
v-model="queryParams.backPro"
placeholder="请选择工程名称"
clearable
filterable
style="width: 240px"
>
<el-option
v-for="dict in projectSelectList"
:key="dict.projectId"
:label="dict.projectName"
:value="dict.projectId"
/>
</el-select>
</el-form-item>
<el-form-item label="工机具类型" prop="type">
<!-- <selectTree-->
<!-- ref="mychildSon"-->
<!-- style="width: 240px"-->
<!-- :treeList="deptList"-->
<!-- :treeProps="{-->
<!-- children: 'children',-->
<!-- label: 'label',-->
<!-- }"-->
<!-- nodeKey="id"-->
<!-- :defaultSelect="true"-->
<!-- :defaultData="defaultData"-->
<!-- :clearable="true"-->
<!-- :placeholder="'请选择'"-->
<!-- @handleNodeClick="selectDrop"-->
<!-- ></selectTree>-->
<Tree
ref="mychildSon"
:width="240"
:dataList="deptList"
@changeId="selectDrop"
></Tree>
</el-form-item>
<el-form-item label="退料单号" prop="backCode">
<el-input
v-model="queryParams.backCode"
placeholder="退料单号"
clearable
maxlength="50"
style="width: 240px"
@keyup.enter.native="handleQuery"
/>
</el-form-item>
<el-form-item label="维修状态" prop="repairStatus">
<el-select
v-model="queryParams.repairStatus"
placeholder="请选择维修状态"
clearable
filterable
style="width: 240px"
>
<el-option
v-for="dict in dicSelectList"
:key="dict.id"
:label="dict.name"
:value="dict.id"
/>
</el-select>
</el-form-item>
<el-form-item label="任务创建时间">
<el-date-picker
v-model="dateRange"
style="width: 240px"
value-format="yyyy-MM-dd"
type="daterange"
range-separator="-"
start-placeholder="开始日期"
end-placeholder="结束日期"
></el-date-picker>
</el-form-item>
<el-form-item>
<el-button
type="primary"
icon="el-icon-search"
size="mini"
@click="handleQuery"
>查询</el-button
>
<el-button
icon="el-icon-refresh"
size="mini"
@click="resetQuery"
>重置</el-button
>
</el-form-item>
</el-form>
<el-row :gutter="10" class="mb8">
<el-col :span="1.5">
<el-button
type="primary"
plain
size="mini"
@click="handleBatchReview()"
>提交审核</el-button
>
</el-col>
<el-col :span="1.5">
<el-button
type="warning"
plain
icon="el-icon-download"
size="mini"
@click="handleExport"
>导出</el-button
>
</el-col>
<right-toolbar
:showSearch.sync="showSearch"
@queryTable="getList"
></right-toolbar>
</el-row>
<el-table
v-loading="loading"
:data="typeList"
@selection-change="handleSelectionChange"
border
>
<el-table-column
type="selection"
width="55"
align="center"
:selectable="
(row) => {
return row.commit == 0
}
"
/>
<el-table-column
align="center"
label="序号"
type="index"
:index="
indexContinuation(queryParams.pageNum, queryParams.pageSize)
"
/>
<el-table-column
label="维修单号"
align="center"
prop="repairCode"
show-overflow-tooltip
/>
<el-table-column
label="退料单位名称"
align="center"
prop="backUnit"
show-overflow-tooltip
/>
<el-table-column
label="退料工程名称"
align="center"
prop="backPro"
show-overflow-tooltip
/>
<el-table-column
label="维修机具类型"
align="center"
prop="type"
show-overflow-tooltip
/>
<el-table-column
label="任务创建人"
align="center"
prop="createName"
show-overflow-tooltip
/>
<el-table-column
sortable
label="任务创建时间"
align="center"
prop="createTime"
show-overflow-tooltip
/>
<el-table-column
label="退料单号"
align="center"
prop="backCode"
show-overflow-tooltip
/>
<el-table-column
label="维修状态"
align="center"
prop="repairStatus"
show-overflow-tooltip
/>
<el-table-column label="操作" align="center">
<template slot-scope="scope">
<el-button
size="mini"
type="text"
icon="el-icon-zoom-in"
@click="handleSee(scope.row, 'see')"
>
查看
</el-button>
<el-button
size="mini"
type="text"
icon="el-icon-setting"
v-show="scope.row.repairStatusCode == '43'"
@click="handleUpdate(scope.row, 'update')"
v-hasPermi="['service:button']"
>
维修
</el-button>
</template>
</el-table-column>
</el-table>
<pagination
v-show="total > 0"
:total="total"
:page.sync="queryParams.pageNum"
:limit.sync="queryParams.pageSize"
@pagination="getList"
/>
<!-- 维修对话框 -->
<el-dialog
:title="repairTitle"
:visible.sync="open"
v-if="open"
width="85%"
append-to-body
:before-close="onClose"
destroy-on-close
>
<el-form
:model="dialogQueryParams"
ref="queryForm"
size="small"
:inline="true"
v-show="showSearch"
label-width="100px"
>
<el-row>
<el-form-item label="关键字" prop="keyword">
<el-input
v-model="dialogQueryParams.keyword"
placeholder="请输入关键字"
clearable
maxlength="50"
style="width: 240px"
/>
</el-form-item>
<el-form-item label="类型名称" prop="typeName">
<selectTree
ref="mychildDialog"
style="width: 240px"
:treeList="deptList"
:treeProps="{
children: 'children',
label: 'label',
}"
nodeKey="id"
:defaultSelect="true"
:defaultData="defaultData"
:clearable="true"
:placeholder="'请选择类型名称'"
@handleNodeClick="selectDropDialog"
></selectTree>
</el-form-item>
<el-form-item label="规格型号" prop="type">
<selectTree
ref="mychildDialogTwo"
style="width: 240px"
:treeList="deptTypeList"
:treeProps="{
children: 'children',
label: 'label',
}"
nodeKey="id"
:defaultSelect="true"
:defaultData="defaultData"
:clearable="true"
:placeholder="'请选择规格型号'"
@handleNodeClick="selectDropDialogTwo"
></selectTree>
</el-form-item>
<el-form-item>
<el-button
type="primary"
icon="el-icon-search"
size="mini"
@click="getDialogList"
>查询</el-button
>
<el-button
icon="el-icon-refresh"
size="mini"
@click="resetQueryDialog"
>重置</el-button
>
</el-form-item>
</el-row>
</el-form>
<div style="margin-bottom: 10px" v-if="type == 'update'">
<el-button
:disabled="selectionList.length == 0"
size="mini"
type="primary"
@click="complete(2)"
>
维修合格
</el-button>
<el-button
:disabled="selectionList.length == 0 || !checkResult"
size="mini"
type="primary"
@click="complete(3)"
>
完成维修
</el-button>
</div>
<el-table
v-loading="loading"
:data="repairList"
@selection-change="selectionChange"
>
<el-table-column
type="selection"
width="55"
align="center"
v-if="repairTitle === '维修'"
:selectable="
(row) => {
return row.status == 0
}
"
/>
<el-table-column
label="类型名称"
align="center"
prop="typeName"
:show-overflow-tooltip="true"
/>
<el-table-column
label="规格型号"
align="center"
prop="type"
:show-overflow-tooltip="true"
/>
<el-table-column
label="编码"
align="center"
prop="code"
width="200"
:show-overflow-tooltip="true"
/>
<el-table-column
label="维修总量"
align="center"
prop="repairNum"
:show-overflow-tooltip="true"
/>
<el-table-column
label="维修合格数量"
align="center"
prop="repairedNum"
:show-overflow-tooltip="true"
/>
<el-table-column
label="报废数量"
align="center"
prop="scrapNum"
:show-overflow-tooltip="true"
/>
<el-table-column
label="待修状态"
align="center"
prop="status"
:show-overflow-tooltip="true"
>
<template v-slot="scope">
{{ getStatusText(scope.row.status) }}
</template>
</el-table-column>
<el-table-column
label="维修人员"
align="center"
prop="repairer"
:show-overflow-tooltip="true"
/>
<el-table-column
label="维修时间"
align="center"
prop="updateTime"
:show-overflow-tooltip="true"
/>
<el-table-column
label="操作"
align="center"
class-name="small-padding fixed-width"
width="280px"
v-if="type == 'update'"
>
<template slot-scope="scope">
<el-button
size="mini"
type="primary"
@click="internalRepair(scope.row)"
>内部维修</el-button
>
<el-button
size="mini"
type="success"
@click="backRepair(scope.row)"
>返厂维修</el-button
>
<el-button
size="mini"
type="info"
@click="broken(scope.row)"
>预报废</el-button
>
<!-- <el-button size="mini" type="warning" @click="complete(scope.row)"
>完成维修</el-button
> -->
</template>
</el-table-column>
</el-table>
<pagination
v-show="dialogTotal > 0"
:total="dialogTotal"
:page.sync="dialogQueryParams.pageNum"
:limit.sync="dialogQueryParams.pageSize"
@pagination="getDialogList"
/>
</el-dialog>
<el-dialog
v-loading.fullscreen.lock="fullscreenLoading"
:title="title"
:visible.sync="openOne"
append-to-body
width="400px"
>
<div class="submit_box">
<div>
<i
class="el-icon-circle-check"
style="color: #ff9900; font-size: 30px"
></i>
</div>
<div class="submit_box_title">
<div>{{ openTextOne }}</div>
<div>{{ openTextTwo }}</div>
</div>
</div>
<div slot="footer" class="dialog-footer">
<el-button @click="cancelOneForm">返回</el-button>
<el-button type="primary" @click="submitOpenOneForm()"
>确定</el-button
>
</div>
</el-dialog>
<el-dialog
v-loading.fullscreen.lock="fullscreenLoading"
:title="title"
:visible.sync="openTwo"
append-to-body
width="400px"
>
<div class="submit_box_two">
<div>
<i
class="el-icon-circle-check"
style="color: #00c196; font-size: 30px"
></i>
</div>
<div class="submit_box_title">{{ openTextThree }}</div>
</div>
<div slot="footer" class="dialog-footer">
<el-button @click="cancelTwoForm">返回</el-button>
</div>
</el-dialog>
<dialogOneForm
:dialogTitle="title"
:isShowFlag.sync="isShowOneFlag"
:priKey="priKey"
:rowObj="rowObj"
@domainChange="domainChange"
></dialogOneForm>
<dialogTwoForm
:dialogTitle="title"
:isShowFlag.sync="isShowTwoFlag"
:priKey="priKey"
:rowObj="rowObj"
@domainChange="domainChange"
></dialogTwoForm>
<dialogThreeForm
:dialogTitle="title"
:isShowFlag.sync="isShowThreeFlag"
:priKey="priKey"
:rowObj="rowObj"
@domainChange="domainChange"
></dialogThreeForm>
</div>
</template>
<script>
import {
getRepairTaskListApi,
getRepairMaTypeListApi,
getUnitInfoSelectApi,
getProjectSelectApi,
addFastRepairApplyApi,
addCompleteRepairApi,
addEndRepairTaskApi,
listPartTypeApi,
getDicSelectApi,
getMaTypeSelectApi,
} from '@/api/repairTest/repair'
import { getProjectList } from '@/api/claimAndRefund/receive'
import dialogOneForm from './dialogOneForm.vue'
import dialogTwoForm from './dialogTwoForm.vue'
import dialogThreeForm from './dialogThreeForm.vue'
import Treeselect from '@riophae/vue-treeselect'
import '@riophae/vue-treeselect/dist/vue-treeselect.css'
import selectTree from './selectTree.vue'
import Tree from './tree.vue'
export default {
name: 'Repair',
dicts: ['sys_normal_disable'],
components: {
dialogOneForm,
dialogTwoForm,
dialogThreeForm,
Treeselect,
selectTree,
Tree,
},
data() {
return {
deptList: [],
dicSelectList: [],
deptTypeList: [],
checkResult: false,
checkResultOne: false,
// 维修合格的数据
selectionList: [],
unitInfoSelectList: [],
projectSelectList: [],
repairList: [],
type: '',
typeText: 1,
fullscreenLoading: false,
isShowOneFlag: false,
isShowTwoFlag: false,
isShowThreeFlag: false,
openOne: false,
openTwo: false,
priKey: '',
rowObj: {},
openTextOne: '',
openTextTwo: '',
openTextThree: '',
// 遮罩层
loading: true,
// 选中数组
ids: [],
// 非单个禁用
single: true,
// 非多个禁用
multiple: true,
// 显示搜索条件
showSearch: true,
// 总条数
total: 0,
dialogTotal: 0,
// 字典表格数据
typeList: [],
// 弹出层标题
title: '',
// 是否显示弹出层
open: false,
interOpen: false,
backOpen: false,
brokenOpen: false,
// 日期范围
dateRange: [],
// 查询参数
queryParams: {
pageNum: 1,
pageSize: 10,
keyword: '',
backUnit: '',
backPro: '',
type: '',
backCode: '',
repairStatus: '',
backSource: 2,
},
dialogQueryParams: {
pageNum: 1,
pageSize: 10,
},
// 表单参数
form: {},
// 表单校验
rules: {},
defaultData: {},
/**
* *********************
* *********************
*/
/* 维修查看弹框标题 */
repairTitle: '查看',
}
},
created() {
getUnitInfoSelectApi().then((res) => {
this.unitInfoSelectList = res.data
})
getProjectList().then((res) => {
this.projectSelectList = res.data
})
getDicSelectApi({ value: 'wx_task' }).then((res) => {
this.dicSelectList = res.data
})
},
mounted() {
this.getList()
this.getTree()
},
methods: {
onClose() {
this.open = false
this.queryParams.type = ''
this.resetQueryDialog()
this.getList()
},
selectDrop(value) {
console.log('33333333333', value)
this.queryParams.type = value
},
selectDropDialog(value) {
this.dialogQueryParams.typeName = value
},
selectDropDialogTwo(value) {
this.dialogQueryParams.type = value
},
/** 查询字典类型列表 */
async getList() {
this.loading = true
this.queryParams.startTime = this.dateRange[0]
this.queryParams.endTime = this.dateRange[1]
const { data: res } = await getRepairTaskListApi(this.queryParams)
this.typeList = res?.rows
this.total = res?.total
this.loading = false
},
getTree() {
listPartTypeApi().then((response) => {
this.deptList = response.data
// this.deptList = this.handleTree(response.data, "id");
})
getMaTypeSelectApi().then((response) => {
this.deptTypeList = response.data
})
},
/** 转换部门数据结构 */
normalizer(node) {
if (node.children && !node.children.length) {
delete node.children
}
return {
id: node.paId,
label: node.paName,
children: node.children,
}
},
/** 转换部门数据结构 */
normalizerType(node) {
if (node.children && !node.children.length) {
delete node.children
}
return {
id: node.id,
label: node.label,
children: node.children,
}
},
// 取消按钮
cancel() {
this.open = false
this.reset()
},
// 表单重置
reset() {
this.form = {
dictId: undefined,
dictName: undefined,
dictType: undefined,
status: '0',
remark: undefined,
}
this.resetForm('form')
},
/** 搜索按钮操作 */
handleQuery() {
this.queryParams.pageNum = 1
this.queryParams.pageSize = 10
this.getList()
},
/** 重置按钮操作 */
resetQuery() {
this.queryParams.type = ''
this.dateRange = []
this.queryParams.backUnit = ''
this.queryParams.backPro = ''
this.queryParams.keyword = ''
this.resetForm('queryForm')
this.$refs.mychildSon.inputValue = ''
this.handleQuery()
},
/** 重置按钮操作 */
resetQueryDialog() {
// this.dialogQueryParams = {};
this.dialogQueryParams.keyword = ''
this.dialogQueryParams.type = ''
this.dialogQueryParams.typeName = ''
this.resetForm('dialogQueryParams')
this.getDialogList()
this.$refs.mychildDialog.clearSelect()
this.$refs.mychildDialogTwo.clearSelect()
},
// 多选框选中数据
handleSelectionChange(selection) {
this.selectionList = selection
this.checkResultOne = selection.every(
(item) => item.repairStatusCode == '43',
)
this.ids = selection.map((item) => item.dictId)
this.single = selection.length != 1
this.multiple = !selection.length
},
selectionChange(selection) {
this.selectionList = selection
this.checkResult = selection.every(
(item) => item.repairNum === item.repairedNum + item.scrapNum,
)
},
/** 维修按钮 */
async handleUpdate(row, type) {
this.repairTitle = '维修'
this.taskId = row.taskId
await this.getDialogList()
this.$eventBus.$emit('taskId', row.taskId)
this.type = type
this.selectionList = []
this.dialogQueryParams = {
pageNum: 1,
pageSize: 10,
}
this.open = true
},
/* 查看按钮 */
async handleSee(row, type) {
this.repairTitle = '查看'
this.taskId = row.taskId
await this.getDialogList()
this.type = type
this.selectionList = []
this.dialogQueryParams = {
pageNum: 1,
pageSize: 10,
}
this.resetForm('dialogQueryParams')
this.open = true
},
getDialogList() {
let params = {
taskId: this.taskId,
pageNum: this.dialogQueryParams.pageNum,
pageSize: this.dialogQueryParams.pageSize,
keyword: this.dialogQueryParams.keyword,
typeName: this.dialogQueryParams.typeName,
type: this.dialogQueryParams.type,
}
// this.loading = true;
getRepairMaTypeListApi(params).then((res) => {
if (res.code == 200) {
this.repairList = res.rows
this.dialogTotal = res.total
// this.loading = false;
}
})
},
handleReturn() {
this.title = '确认操作'
this.openOne = true
this.openTextOne = '确定退回退料么'
this.openTextTwo = '确定退回退料么'
this.typeText = 1
},
submitOpenOneForm() {
this.openOne = false
if (this.typeText == 1) {
addEndRepairTaskApi(this.selectionList)
.then((res) => {
if (res.code == 200) {
this.openTwo = true
this.openTextThree = '已提交审核!'
// this.getDialogList()
}
})
.catch(() => {})
}
if (this.typeText == 2) {
addFastRepairApplyApi(this.selectionList)
.then((res) => {
if (res.code == 200) {
this.openTwo = true
this.openTextThree = '维修合格操作完成!'
// this.getDialogList()
}
})
.catch(() => {})
}
if (this.typeText == 3) {
let ids = []
let arr = this.selectionList
arr.map((item) => {
ids.push(item.id)
})
addCompleteRepairApi(ids)
.then((res) => {
if (res.code == 200) {
this.openTwo = true
this.openTextThree = '完成维修!'
// this.getDialogList()
}
})
.catch(() => {})
}
},
// 维修合格关闭对话框
cancelOneForm() {
this.openOne = false
},
// 维修合格关闭对话框
cancelTwoForm() {
this.openTwo = false
if (this.typeText == 1) {
this.handleQuery()
} else {
this.getDialogList()
}
},
/** 导出按钮操作 */
handleExport() {
const dataCondition = this.selectionList.map((item) => item.taskId)
this.download(
'base/repair/export',
{
...this.queryParams,
dataCondition,
},
`维修单_${new Date().getTime()}.xlsx`,
)
},
internalRepair(row) {
this.title = '内部维修'
this.priKey = row.id
this.rowObj = row
this.isShowOneFlag = true
},
backRepair(row) {
this.title = '返厂维修'
this.priKey = row.id
this.rowObj = row
this.isShowTwoFlag = true
},
broken(row) {
this.title = '待报废'
this.priKey = row.id
this.rowObj = row
this.isShowThreeFlag = true
},
complete(type) {
// if (type == 1) {
// this.typeText = type
// this.title = '确认操作'
// this.openOne = true
// this.openTextOne = '确定提交审核么?'
// // this.openTextTwo = '确定提交审核么?'
// }
// if (type == 2) {
// this.typeText = type
// this.title = '确认操作'
// this.openOne = true
// this.openTextOne = '确定维修合格了么?'
// // this.openTextTwo = '确定维修合格了么?'
// }
// if (type == 3) {
// this.typeText = type
// this.title = '确认操作'
// this.openOne = true
// this.openTextOne = '确定完成维修了么?'
// this.openTextTwo = '完成维修后不可修改该条数据'
// }
let tipText = ''
let apiFunc = null
let ids = []
if (type == 1) {
tipText = '是否确定提交审核?'
apiFunc = addEndRepairTaskApi
}
if (type == 2) {
tipText = '是否确定维修合格?'
apiFunc = addFastRepairApplyApi
}
if (type == 3) {
tipText = '是否确定完成维修?提交后将不能再修改此项记录!'
apiFunc = addCompleteRepairApi
let arr = this.selectionList
arr.map((item) => {
ids.push(item.id)
})
}
console.log(ids, '完成维修参数')
this.$confirm(tipText, '提示', {
confirmButtonText: '确定',
cancelButtonText: '取消',
type: 'warning',
}).then(async () => {
const res = await apiFunc(
type == 2 || type == 1 ? this.selectionList : ids,
)
if (res.code == 200) {
this.$modal.msgSuccess('已提交')
} else {
this.$modal.msgError(res.msg)
}
this.getDialogList()
})
// if (this.typeText == 1) {
// addEndRepairTaskApi(this.selectionList)
// .then((res) => {
// if (res.code == 200) {
// this.openTwo = true
// this.openTextThree = '已提交审核!'
// // this.getDialogList()
// }
// })
// .catch(() => {})
// }
// if (this.typeText == 2) {
// addFastRepairApplyApi(this.selectionList)
// .then((res) => {
// if (res.code == 200) {
// this.openTwo = true
// this.openTextThree = '维修合格操作完成!'
// // this.getDialogList()
// }
// })
// .catch(() => {})
// }
// if (this.typeText == 3) {
// let ids = []
// let arr = this.selectionList
// arr.map((item) => {
// ids.push(item.id)
// })
// addCompleteRepairApi(ids)
// .then((res) => {
// if (res.code == 200) {
// this.openTwo = true
// this.openTextThree = '完成维修!'
// // this.getDialogList()
// }
// })
// .catch(() => {})
// }
},
// 回显字段
getStatusText(status) {
let statusList = [
{
label: '未完成',
value: '0',
},
{
label: '已完成',
value: '1',
},
]
const foundItem = statusList.find((item) => item.value == status)
if (foundItem) {
return foundItem.label
}
return ''
},
domainChange() {
this.getDialogList()
},
/* 提交审核 */
handleAuditing(v) {
console.log(v, '审核')
},
selectable(row) {
// 禁用某一行
return (
row.repairStatusCode === '44' || row.repairStatusCode === '43'
)
},
/* 批量审批 */
handleBatchReview() {
if (this.selectionList.length < 1) {
this.$message.info('请勾选需要审批的数据!')
return
}
this.$confirm('是否确定提交维修审核?', '提示', {
confirmButtonText: '确定',
cancelButtonText: '取消',
type: 'warning',
})
.then(async () => {
const res = await addEndRepairTaskApi(this.selectionList)
if (res.code === 200) {
this.$message({
type: 'success',
message: '审批已提交!',
})
this.getList()
}
})
.catch(() => {})
},
},
watch: {
$route: {
handler(to) {
if (to.query.keyWord) {
this.queryParams.keyword = to.query.keyWord
this.getList()
}
},
deep: true,
immediate: true,
},
},
}
</script>
<style lang="scss" scoped>
.submit_box {
display: flex;
justify-content: flex-start;
align-items: center;
.submit_box_title {
display: flex;
flex-direction: column;
margin-left: 15px;
:first-child {
font-size: 14px;
font-weight: 600;
}
:last-child {
margin-top: 6px;
font-size: 12px;
}
}
}
.submit_box_two {
display: flex;
flex-direction: row;
flex-wrap: nowrap;
align-items: center;
margin-left: 30%;
.submit_box_title {
display: flex;
flex-direction: column;
margin-left: 10px;
font-size: 18px;
font-weight: 600;
}
}
::v-deep.el-table .fixed-width .el-button--mini {
width: 70px !important;
margin-bottom: 10px;
}
</style>