You can not select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
1462 lines
46 KiB
1462 lines
46 KiB
<template> |
|
<basic-container> |
|
<avue-crud |
|
ref="crud" |
|
:data="data" |
|
id="avue-id" |
|
:option="option" |
|
:page.sync="listPage" |
|
:row-key="getRowKeys" |
|
:table-loading="loading" |
|
@row-del="rowDel" |
|
@row-save="rowSave" |
|
@search-reset="reset" |
|
@row-update="rowUpdate" |
|
@refresh-change="refresh" |
|
@search-change="searchChangeScope" |
|
@selection-change="selectionChange" |
|
@size-change="sizeChange" |
|
@current-change="currentChange" |
|
> |
|
<template slot="menuLeft"> |
|
<el-form |
|
ref="searchForm" |
|
:model="searchForm" |
|
label-width="120px" |
|
style="border: 0px solid red; margin-bottom: 8px" |
|
> |
|
<el-row> |
|
<el-col :span="2.5"> |
|
<el-select |
|
v-model="searchForm.status" |
|
class="search-select" |
|
placeholder="请选择状态" |
|
> |
|
<el-option label="启用" :value="1"></el-option> |
|
<el-option label="停用" :value="0"></el-option> |
|
</el-select> |
|
</el-col> |
|
<el-col :span="2.5"> |
|
<el-select |
|
v-model="searchForm.maintainType" |
|
class="search-select" |
|
placeholder="请选择保养类型" |
|
> |
|
<el-option v-for="item in typeList" :key="item.id" :label="item.dictValue" :value="item.dictKey"></el-option> |
|
</el-select> |
|
</el-col> |
|
<el-col :span="2.5"> |
|
<el-input |
|
class="search-input" |
|
v-model="searchForm.code" |
|
placeholder="请输入计划单据" |
|
></el-input> |
|
</el-col> |
|
<el-col :span="2.5"> |
|
<el-input |
|
class="search-input" |
|
v-model="searchForm.name" |
|
placeholder="请输入计划名称" |
|
></el-input> |
|
</el-col> |
|
<el-col style="margin-left: 18px" :span="3.5"> |
|
<el-button class="search" @click="searchHandle(0)" |
|
>查询</el-button |
|
> |
|
<el-button class="reset" @click="searchHandle(1)">重置</el-button> |
|
</el-col> |
|
</el-row> |
|
</el-form> |
|
</template> |
|
<template slot-scope="{ type }" slot="menuForm"> |
|
<el-button |
|
class="buttonOne" |
|
size="small" |
|
@click="$refs.crud.closeDialog()" |
|
>取 消</el-button |
|
> |
|
<el-button |
|
v-if="type == 'add'" |
|
class="buttonOne" |
|
size="small" |
|
@click="$refs.crud.rowSave()" |
|
>确 定</el-button |
|
> |
|
<el-button |
|
v-if="type == 'edit'" |
|
class="buttonOne" |
|
size="small" |
|
@click="$refs.crud.rowUpdate()" |
|
>修 改</el-button |
|
> |
|
</template> |
|
<template slot="menuRight"> |
|
<el-button class="search" style="width: 120px" @click="handleAdd" |
|
>新建</el-button |
|
> |
|
</template> |
|
<template slot-scope="{ row }" slot="status"> |
|
<span v-if="row.status === 0" style="color: #e56926">停用</span> |
|
<span v-if="row.status === 1" style="color: #34c447">运行中</span> |
|
<span v-if="row.status === 2" style="color: #999">已过期</span> |
|
</template> |
|
<template slot-scope="{ row }" slot="type"> |
|
<span v-if="row.type === 1">类型1</span> |
|
<span v-if="row.type === 2">类型2</span> |
|
</template> |
|
<template slot-scope="{ row }" slot="device"> |
|
<span>{{row.device | deviceName}}</span> |
|
</template> |
|
<template slot-scope="{ row, index }" slot="menu"> |
|
<el-button @click="handleView(row, index)" class="look">查看</el-button> |
|
<el-button @click="handleEdit(row, index)" class="look">编辑</el-button> |
|
<el-button @click="handleDelete(row, index)" class="look">删除</el-button> |
|
<el-button v-show="row.status == 1" @click="handleStop(row, index)" class="look">停用</el-button> |
|
<el-button v-show="row.status == 0" @click="handleStart(row, index)" class="look">启用</el-button> |
|
<el-button v-show="row.status == 1 && row.cycleMethod == 1" @click="handleCreatTask(row, index)" class="look">创建任务</el-button> |
|
</template> |
|
</avue-crud> |
|
<!-- 新增 弹窗 --> |
|
<el-dialog |
|
:before-close="handleClose" |
|
:cell-style="tableCellStyle" |
|
:visible.sync="showAddDialog" |
|
:title="title" |
|
width="70%" |
|
:append-to-body="true" |
|
:close-on-click-modal="false" |
|
:close-on-press-escape="false" |
|
custom-class="planAdd_form" |
|
> |
|
<div style="height: 550px; overflow-y: auto; overflow-x: hidden"> |
|
<el-form :model="addForm" :rules="addRules" ref="addForm"> |
|
<div class="add_all"> |
|
<h1 |
|
style=" |
|
font-size: 16px; |
|
font-weight: 500; |
|
color: rgba(0, 0, 0, 0.85); |
|
line-height: 20px; |
|
" |
|
> |
|
<span |
|
style=" |
|
border-left: 4px solid blue; |
|
margin-top: -20px; |
|
height: 15px; |
|
display: inline-block; |
|
transform: translateY(2px); |
|
" |
|
> |
|
</span |
|
> <b>基本信息</b> |
|
</h1> |
|
</div> |
|
<el-row :gutter="20"> |
|
<el-col :span="6" style="width: 31%; margin-left: 1%"> |
|
<el-form-item label="计划名称" prop="name"> |
|
<el-input |
|
style="width: 98%" |
|
v-model="addForm.name" |
|
placeholder="请输入计划名称" |
|
></el-input> |
|
</el-form-item> |
|
</el-col> |
|
<el-col :span="6" style="width: 31%; margin-left: 1%"> |
|
<el-form-item label="保养类型" prop="maintainType"> |
|
<el-select |
|
v-model="addForm.maintainType" |
|
placeholder="请选择保养类型" |
|
style="width: 98%" |
|
> |
|
<el-option v-for="item in typeList" :key="item.id" :label="item.dictValue" :value="item.dictKey"></el-option> |
|
</el-select> |
|
</el-form-item> |
|
</el-col> |
|
<el-col :span="6" style="width: 31%; margin-left: 1%"> |
|
<el-form-item label="预计工时(时)" prop="totalCost"> |
|
<!-- <el-input |
|
style="width: 98%" |
|
v-model="addForm.totalCost" |
|
placeholder="请输入预计工时" |
|
></el-input> --> |
|
<el-input-number style="width: 98%" controls-position="right" v-model="addForm.totalCost" :min="0" :precision="1" :step="1"></el-input-number> |
|
</el-form-item> |
|
</el-col> |
|
</el-row> |
|
<el-row :gutter="20"> |
|
<el-col :span="6" style="width: 31%; margin-left: 1%"> |
|
<el-form-item label="保养班组" prop="groupId"> |
|
<el-select |
|
v-model="addForm.groupId" |
|
placeholder="请选择保养班组" |
|
style="width: 98%" |
|
> |
|
<el-option v-for="item in groupList" :key="item.id" :label="item.fullName" :value="item.id"></el-option> |
|
</el-select> |
|
</el-form-item> |
|
</el-col> |
|
<el-col :span="6" style="width: 31%; margin-left: 1%"> |
|
<el-form-item label="保养设备" prop="assetId"> |
|
<el-select |
|
v-model="addForm.assetId" |
|
placeholder="请选择保养设备" |
|
style="width: 98%" |
|
> |
|
<el-option v-for="item in deviceList" :key="item.id" :label="item.name" :value="item.id"></el-option> |
|
</el-select> |
|
</el-form-item> |
|
</el-col> |
|
<!-- <el-col :span="6" style="width: 31%; margin-left: 1%"> |
|
<el-form-item label="超时工时(分)" prop="minute"> |
|
<el-input |
|
style="width: 98%" |
|
v-model="addForm.minute" |
|
placeholder="请输入超时工时" |
|
></el-input> |
|
</el-form-item> |
|
</el-col> --> |
|
</el-row> |
|
<el-row :gutter="20"> |
|
<el-col style="width: 90%; margin-left: 1%"> |
|
<el-form-item label="方案说明" prop="info"> |
|
<el-input |
|
style="width: 100%" |
|
type="textarea" |
|
v-model="addForm.info" |
|
placeholder="请输入方案说明" |
|
></el-input> |
|
</el-form-item> |
|
</el-col> |
|
</el-row> |
|
<el-row :gutter="20"> |
|
<el-col style="width: 90%; margin-left: 1%"> |
|
<el-form-item label="备注" prop="notes"> |
|
<el-input |
|
style="width: 100%" |
|
type="textarea" |
|
v-model="addForm.notes" |
|
placeholder="请输入备注" |
|
></el-input> |
|
</el-form-item> |
|
</el-col> |
|
</el-row> |
|
<div class="add_all"> |
|
<h1 |
|
style="font-size: 16px; font-weight: 500; color: rgba(0, 0, 0, 0.85)；line-height:20px" |
|
> |
|
<span |
|
style=" |
|
border-left: 4px solid blue; |
|
margin-top: -20px; |
|
height: 15px; |
|
display: inline-block; |
|
transform: translateY(2px); |
|
" |
|
> |
|
</span |
|
> <b>计划周期</b> |
|
</h1> |
|
</div> |
|
<el-row :gutter="20"> |
|
<el-col :span="6" style="width: 31%; margin-left: 1%"> |
|
<el-form-item label="循环方式" prop="cycleMethod"> |
|
<el-select |
|
v-model="addForm.cycleMethod" |
|
placeholder="请选择循环方式" |
|
style="width: 98%" |
|
> |
|
<el-option v-for="item in methodList" :key="item.value" :label="item.label" :value="item.value"></el-option> |
|
</el-select> |
|
</el-form-item> |
|
</el-col> |
|
<el-col :span="6" style="width: 31%; margin-left: 1%"> |
|
<el-form-item label="开始时间" prop="startTime"> |
|
<el-date-picker |
|
v-model="addForm.startTime" |
|
type="date" |
|
placeholder="请选择开始时间" |
|
format="yyyy-MM-dd" |
|
value-format="yyyy-MM-dd" |
|
style="width: 98%" |
|
> |
|
</el-date-picker> |
|
</el-form-item> |
|
</el-col> |
|
<el-col :span="6" style="width: 31%; margin-left: 1%"> |
|
<el-form-item label="结束时间" prop="endTime"> |
|
<el-date-picker |
|
v-model="addForm.endTime" |
|
type="date" |
|
placeholder="请选择结束时间" |
|
format="yyyy-MM-dd" |
|
value-format="yyyy-MM-dd" |
|
style="width: 98%" |
|
> |
|
</el-date-picker> |
|
</el-form-item> |
|
</el-col> |
|
</el-row> |
|
<el-row :gutter="20"> |
|
<el-col :span="6" style="width: 31%; margin-left: 1%" v-show="addForm.cycleMethod == 2"> |
|
<el-form-item label="保养周期" prop="actionCycleType"> |
|
<el-select |
|
v-model="addForm.actionCycleType" |
|
placeholder="请选择保养周期" |
|
style="width: 98%" |
|
> |
|
<el-option v-for="item in cycleList" :key="item.value" :label="item.label" :value="item.value"></el-option> |
|
</el-select> |
|
</el-form-item> |
|
</el-col> |
|
<el-col |
|
:span="6" |
|
style="width: 31%; margin-left: 1%" |
|
v-if="addForm.actionCycleType == 1 && addForm.cycleMethod == 2" |
|
> |
|
<el-form-item label="保养间隔" prop="actionCycleTime"> |
|
<el-date-picker |
|
popper-class="picker-dateNoneYear" |
|
v-model="addForm.actionCycleTime" |
|
type="date" |
|
placeholder="请选择保养间隔" |
|
format="MM-dd" |
|
value-format="MM-dd" |
|
style="width: 98%" |
|
> |
|
</el-date-picker> |
|
</el-form-item> |
|
</el-col> |
|
<el-col |
|
:span="6" |
|
style="width: 31%; margin-left: 1%" |
|
v-if="addForm.actionCycleType == 2 && addForm.cycleMethod == 2" |
|
> |
|
<el-form-item label="保养间隔" prop="actionCycleTime"> |
|
<el-select |
|
v-model="addForm.actionCycleTime" |
|
placeholder="请选择保养间隔" |
|
style="width: 98%" |
|
> |
|
<el-option v-for="item in monthData" :key="item.value" :label="item.label" :value="item.value"></el-option> |
|
</el-select> |
|
</el-form-item> |
|
</el-col> |
|
<el-col |
|
:span="6" |
|
style="width: 31%; margin-left: 1%" |
|
v-if="addForm.actionCycleType == 3 && addForm.cycleMethod == 2" |
|
> |
|
<el-form-item label="保养间隔" prop="actionCycleTime"> |
|
<el-input-number |
|
v-model="addForm.actionCycleTime" |
|
placeholder="请选择保养间隔" |
|
style="width: 98%" |
|
controls-position="right" |
|
:min="1" |
|
> |
|
</el-input-number> |
|
</el-form-item> |
|
</el-col> |
|
</el-row> |
|
</el-form> |
|
<div class="add_all"> |
|
<h1 |
|
style=" |
|
font-size: 16px; |
|
font-weight: 500; |
|
color: rgba(0, 0, 0, 0.85); |
|
line-height: 20px; |
|
" |
|
> |
|
<span |
|
style=" |
|
border-left: 4px solid blue; |
|
margin-top: -20px; |
|
height: 15px; |
|
display: inline-block; |
|
transform: translateY(2px); |
|
" |
|
> |
|
</span |
|
> <b>保养项目</b> |
|
</h1> |
|
</div> |
|
<el-row :gutter="20"> |
|
<el-table |
|
:data="addForm.orderList" |
|
:key="index" |
|
border |
|
style=" |
|
margin-bottom: 30px; |
|
width: 92%; |
|
margin-left: 4%; |
|
border-radius: 4px; |
|
" |
|
header-cell-style="background-color:#fafafa;font-size:12px;color:black" |
|
> |
|
<el-table-column width="57px"> |
|
<template slot="header"> |
|
<el-button |
|
circle |
|
size="small" |
|
type="primary" |
|
icon="el-icon-plus" |
|
@click="addSpecimen()" |
|
/> |
|
</template> |
|
<template slot-scope="scope"> |
|
<el-button |
|
circle |
|
size="small" |
|
type="danger" |
|
icon="el-icon-delete" |
|
@click="removeSpecimen(scope.$index, scope.row)" |
|
/> |
|
</template> |
|
</el-table-column> |
|
<el-table-column |
|
prop="code" |
|
label="项目编号" |
|
show-overflow-tooltip |
|
></el-table-column> |
|
<el-table-column |
|
prop="status" |
|
label="状态" |
|
show-overflow-tooltip |
|
> |
|
<template slot-scope="scope"> |
|
<div v-if="scope.row.status == 1">停用</div> |
|
<div v-if="scope.row.status == 0">启用</div> |
|
</template> |
|
</el-table-column> |
|
<el-table-column |
|
prop="name" |
|
label="项目名称" |
|
show-overflow-tooltip |
|
></el-table-column> |
|
<el-table-column |
|
prop="maintainType" |
|
label="保养类型" |
|
show-overflow-tooltip |
|
> |
|
<template slot-scope="scope"> |
|
{{scope.row.maintainType | maintainTypeName}} |
|
</template> |
|
</el-table-column> |
|
<el-table-column |
|
prop="baseCost" |
|
label="标准工时(小时)" |
|
show-overflow-tooltip |
|
></el-table-column> |
|
<el-table-column |
|
fixed="right" |
|
align="left" |
|
header-align="left" |
|
label="操作" |
|
width="100px" |
|
> |
|
<template slot-scope="scope"> |
|
<el-button |
|
class="look" |
|
size="mini" |
|
@click="handleViewPro(scope.row)" |
|
>查看</el-button |
|
> |
|
</template> |
|
</el-table-column> |
|
</el-table> |
|
</el-row> |
|
</div> |
|
<span slot="footer" class="dialog-footer"> |
|
<el-button @click="showAddDialog = false">取 消</el-button> |
|
<el-button @click="handleSubmit()">提 交</el-button> |
|
</span> |
|
</el-dialog> |
|
<!-- 选择保养项目 弹窗 --> |
|
<el-dialog |
|
:before-close="handleClose" |
|
:cell-style="tableCellStyle" |
|
:visible.sync="showProjectDialog" |
|
height="160vh" |
|
max-height="480" |
|
title="选择保养项目" |
|
width="60%" |
|
:append-to-body="true" |
|
:close-on-click-modal="false" |
|
:close-on-press-escape="false" |
|
> |
|
<div style="height: 550px; overflow-y: auto; overflow-x: hidden"> |
|
<!-- 查询区 --> |
|
<el-form |
|
ref="proForm" |
|
:model="proForm" |
|
label-width="120px" |
|
style="border: 0px solid red; margin-bottom: 8px" |
|
> |
|
<el-row> |
|
<el-col :span="2.5"> |
|
<el-select |
|
v-model="proForm.status" |
|
class="search_select" |
|
placeholder="请选择状态" |
|
clearable |
|
> |
|
<el-option label="启用" :value="1"></el-option> |
|
<el-option label="停用" :value="0"></el-option> |
|
</el-select> |
|
</el-col> |
|
<el-col :span="2.5"> |
|
<el-select |
|
v-model="proForm.maintainType" |
|
class="search_select" |
|
placeholder="请选择保养类型" |
|
clearable |
|
> |
|
<el-option v-for="item in typeList" :key="item.id" :label="item.dictValue" :value="item.dictKey"></el-option> |
|
</el-select> |
|
</el-col> |
|
<el-col :span="2.5"> |
|
<el-input |
|
class="search-input" |
|
v-model="proForm.code" |
|
placeholder="请输入项目编号" |
|
clearable |
|
></el-input> |
|
</el-col> |
|
<el-col :span="2.5"> |
|
<el-input |
|
class="search-input" |
|
clearable |
|
v-model="proForm.name" |
|
placeholder="请输入项目名称" |
|
></el-input> |
|
</el-col> |
|
<el-col style="margin-left: 18px" :span="3.5"> |
|
<el-button class="search" @click="searchProject()">查询</el-button> |
|
<!-- <el-button class="reset" @click="searchHandle(1)">重置</el-button> --> |
|
<el-button class="search" @click="addProject">选择</el-button> |
|
</el-col> |
|
</el-row> |
|
</el-form> |
|
<!-- 表格区 --> |
|
<el-table |
|
ref="maintainTable" |
|
:data="tableData" |
|
:row-style="{ height: '66px' }" |
|
:header-cell-style="{ |
|
background: '#f6f8fa', |
|
color: '#999999', |
|
fontWeight: '400', |
|
height: '66px', |
|
}" |
|
:row-key="getRowKey" |
|
tooltip-effect="dark" |
|
style="width: 100%; color: #333333" |
|
v-loading="loading" |
|
@selection-change="handleSelectionChange" |
|
> |
|
<el-table-column fixed type="selection" :reserve-selection="true" width="50"></el-table-column> |
|
<el-table-column |
|
align="left" |
|
prop="code" |
|
label="项目编号" |
|
show-overflow-tooltip |
|
width="170" |
|
/> |
|
<el-table-column |
|
align="left" |
|
prop="name" |
|
label="项目名称" |
|
show-overflow-tooltip |
|
width="170" |
|
/> |
|
<!-- applyStatus:0-暂存 1-提交 2-审批通过 3-审批驳回 4-完成 --> |
|
<el-table-column align="left" prop="status" width="120" label="状态"> |
|
<template slot-scope="scope"> |
|
<span v-if="scope.row.status === 1" style="color: #e56926">停用</span> |
|
<span v-if="scope.row.status === 0" style="color: #34c447">启用</span> |
|
</template> |
|
</el-table-column> |
|
<el-table-column |
|
align="left" |
|
prop="maintainType" |
|
label="保养类型" |
|
show-overflow-tooltip |
|
width="170" |
|
> |
|
<template slot-scope="scope"> |
|
{{scope.row.maintainType | maintainTypeName}} |
|
</template> |
|
</el-table-column> |
|
<el-table-column |
|
align="left" |
|
prop="baseCost" |
|
label="标准工时(时)" |
|
show-overflow-tooltip |
|
width="170" |
|
/> |
|
<el-table-column |
|
fixed="right" |
|
align="left" |
|
header-align="left" |
|
label="操作" |
|
width="260px" |
|
> |
|
<template slot-scope="scope"> |
|
<el-button |
|
class="look" |
|
size="mini" |
|
@click="handleViewPro(scope.row)" |
|
>查看</el-button |
|
> |
|
</template> |
|
</el-table-column> |
|
</el-table> |
|
<!-- 分页器 --> |
|
<el-row |
|
:gutter="20" |
|
id="avue-id" |
|
style="margin-top: 40px; margin-bottom: 20px" |
|
> |
|
<el-col :span="12" :offset="8" |
|
><div class="grid-content bg-purple"> |
|
<div class="block"> |
|
<el-pagination |
|
:current-page="page[0].current" |
|
:page-sizes="[10, 20, 30, 50, 100]" |
|
:page-size="10" |
|
layout="total, sizes, prev, pager, next, jumper" |
|
:total="this.total" |
|
@size-change="handleSizeChange" |
|
@current-change="handleCurrentChange" |
|
/> |
|
</div> |
|
</div> |
|
</el-col> |
|
</el-row> |
|
</div> |
|
</el-dialog> |
|
<!-- 查看保养项目详情 弹框 --> |
|
<el-dialog |
|
:before-close="handleClose" |
|
:cell-style="tableCellStyle" |
|
:visible.sync="showDialog" |
|
height="160vh" |
|
max-height="480" |
|
title="查看详情" |
|
width="48%" |
|
:append-to-body="true" |
|
:close-on-click-modal="false" |
|
:close-on-press-escape="false" |
|
> |
|
<el-descriptions :column="3" border direction="vertical"> |
|
<el-descriptions-item span="1" label="项目编号">{{ |
|
projectForm.code |
|
}}</el-descriptions-item> |
|
<el-descriptions-item span="1" label="项目名称">{{ |
|
projectForm.name |
|
}}</el-descriptions-item> |
|
<el-descriptions-item span="1" label="状态"> |
|
<!-- {{ |
|
projectForm.status == 0 ? "停用" : "启用" |
|
}} --> |
|
<span v-if="projectForm.status === 1" style="color: #e56926">停用</span> |
|
<span v-if="projectForm.status === 0" style="color: #34c447">启用</span> |
|
</el-descriptions-item> |
|
<el-descriptions-item span="1" label="保养类型"> |
|
{{projectForm.maintainType | maintainTypeName}} |
|
</el-descriptions-item> |
|
<el-descriptions-item span="2" label="工时">{{ |
|
projectForm.baseCost |
|
}}</el-descriptions-item> |
|
<el-descriptions-item label="保养内容" span="4">{{ |
|
projectForm.content |
|
}}</el-descriptions-item> |
|
<el-descriptions-item span="3" label="备注">{{ |
|
projectForm.notes |
|
}}</el-descriptions-item> |
|
</el-descriptions> |
|
</el-dialog> |
|
<!-- 查看计划详情 弹窗 --> |
|
<el-dialog |
|
:before-close="handleClose" |
|
:cell-style="tableCellStyle" |
|
:visible.sync="showPlanDialog" |
|
title="查看详情" |
|
width="70%" |
|
:append-to-body="true" |
|
:close-on-click-modal="false" |
|
:close-on-press-escape="false" |
|
> |
|
<div style="height: 550px; overflow-y: auto; overflow-x: hidden"> |
|
<div class="add_all"> |
|
<h1 |
|
style=" |
|
font-size: 16px; |
|
font-weight: 500; |
|
color: rgba(0, 0, 0, 0.85); |
|
line-height: 20px; |
|
" |
|
> |
|
<span |
|
style=" |
|
border-left: 4px solid blue; |
|
margin-top: -20px; |
|
height: 15px; |
|
display: inline-block; |
|
transform: translateY(2px); |
|
" |
|
> |
|
</span |
|
> <b>基本信息</b> |
|
</h1> |
|
</div> |
|
<el-descriptions :column="3" border direction="vertical"> |
|
<el-descriptions-item span="1" label="计划名称">{{ |
|
planForm.name |
|
}}</el-descriptions-item> |
|
<el-descriptions-item span="1" label="保养类型"> |
|
{{planForm.maintainType | maintainTypeName}} |
|
</el-descriptions-item> |
|
<el-descriptions-item span="1" label="预计工时(时)">{{ |
|
planForm.totalCost |
|
}}</el-descriptions-item> |
|
<el-descriptions-item span="1" label="保养班组"> |
|
{{planForm.groupId | groupName}} |
|
</el-descriptions-item> |
|
<el-descriptions-item span="2" label="保养设备"> |
|
{{planForm.assetId | deviceName}} |
|
</el-descriptions-item> |
|
<el-descriptions-item span="3" label="方案说明">{{ |
|
planForm.info |
|
}}</el-descriptions-item> |
|
<el-descriptions-item span="3" label="备注">{{ |
|
planForm.notes |
|
}}</el-descriptions-item> |
|
</el-descriptions> |
|
<div class="add_all"> |
|
<h1 |
|
style=" |
|
font-size: 16px; |
|
font-weight: 500; |
|
color: rgba(0, 0, 0, 0.85); |
|
line-height: 20px; |
|
" |
|
> |
|
<span |
|
style=" |
|
border-left: 4px solid blue; |
|
margin-top: -20px; |
|
height: 15px; |
|
display: inline-block; |
|
transform: translateY(2px); |
|
" |
|
> |
|
</span |
|
> <b>计划周期</b> |
|
</h1> |
|
</div> |
|
<el-descriptions :column="3" border direction="vertical"> |
|
<el-descriptions-item span="1" label="循环方式">{{ |
|
planForm.cycleMethod == 1 ? '单次' : '周期性' |
|
}}</el-descriptions-item> |
|
<el-descriptions-item span="1" label="开始时间">{{ |
|
planForm.startTime |
|
}}</el-descriptions-item> |
|
<el-descriptions-item span="1" label="结束时间">{{ |
|
planForm.endTime |
|
}}</el-descriptions-item> |
|
<el-descriptions-item span="1" label="周期" v-if="planForm.cycleMethod == 2">{{ |
|
planForm.actionCycleType == 1 ? '年' : planForm.actionCycleType == 2 ? '月' : planForm.actionCycleType == 3 ? '间隔' : '' |
|
}}</el-descriptions-item> |
|
<el-descriptions-item span="1" label="周期时间" v-if="planForm.cycleMethod == 2">{{ |
|
planForm.actionCycleType == 2 ? planForm.actionCycleTime + '日' : planForm.actionCycleTime |
|
}}</el-descriptions-item> |
|
</el-descriptions> |
|
<div class="add_all"> |
|
<h1 |
|
style=" |
|
font-size: 16px; |
|
font-weight: 500; |
|
color: rgba(0, 0, 0, 0.85); |
|
line-height: 20px; |
|
" |
|
> |
|
<span |
|
style=" |
|
border-left: 4px solid blue; |
|
margin-top: -20px; |
|
height: 15px; |
|
display: inline-block; |
|
transform: translateY(2px); |
|
" |
|
> |
|
</span |
|
> <b>保养项目</b> |
|
</h1> |
|
</div> |
|
<el-row :gutter="20"> |
|
<el-table |
|
:data="planForm.orderList" |
|
:key="index" |
|
border |
|
style=" |
|
margin-bottom: 30px; |
|
width: 92%; |
|
margin-left: 4%; |
|
border-radius: 4px; |
|
" |
|
header-cell-style="background-color:#fafafa;font-size:12px;color:black" |
|
> |
|
<el-table-column |
|
prop="code" |
|
label="项目编号" |
|
show-overflow-tooltip |
|
></el-table-column> |
|
<el-table-column |
|
prop="status" |
|
label="状态" |
|
show-overflow-tooltip |
|
> |
|
<template slot-scope="scope"> |
|
<div v-if="scope.row.status == 1">停用</div> |
|
<div v-if="scope.row.status == 0">启用</div> |
|
</template> |
|
</el-table-column> |
|
<el-table-column |
|
prop="name" |
|
label="项目名称" |
|
show-overflow-tooltip |
|
></el-table-column> |
|
<el-table-column |
|
prop="maintainType" |
|
label="保养类型" |
|
show-overflow-tooltip |
|
> |
|
<template slot-scope="scope"> |
|
{{scope.row.maintainType | maintainTypeName}} |
|
</template> |
|
</el-table-column> |
|
<el-table-column |
|
prop="baseCost" |
|
label="标准工时(小时)" |
|
show-overflow-tooltip |
|
></el-table-column> |
|
<el-table-column |
|
fixed="right" |
|
align="left" |
|
header-align="left" |
|
label="操作" |
|
width="100px" |
|
> |
|
<template slot-scope="scope"> |
|
<el-button |
|
class="look" |
|
size="mini" |
|
@click="handleViewPro(scope.row)" |
|
>查看</el-button |
|
> |
|
</template> |
|
</el-table-column> |
|
</el-table> |
|
</el-row> |
|
</div> |
|
</el-dialog> |
|
</basic-container> |
|
</template> |
|
|
|
<script> |
|
import {getPlanList,savePlan,getGroup,getDeviceList,getPlanDetail,changePlanStatus,deletePlan,createTask} from "@/api/oiling/plan" |
|
import {getProList,getTypeList} from "@/api/oiling/project" |
|
let that; |
|
export default { |
|
data() { |
|
return { |
|
showDialog: false, |
|
showAddDialog: false, |
|
showProjectDialog: false, |
|
showPlanDialog: false, |
|
proForm:{}, |
|
addForm: { |
|
orderList: [], |
|
}, |
|
periodForm: {}, |
|
planForm: {}, |
|
searchForm: { |
|
name: null, |
|
status: null, |
|
type: null, |
|
code: null, |
|
}, |
|
monthData:[ |
|
{value:1,label:'1日'},{value:2,label:'2日'},{value:3,label:'3日'},{value:4,label:'4日'}, |
|
{value:5,label:'5日'},{value:6,label:'6日'},{value:7,label:'7日'},{value:8,label:'8日'}, |
|
{value:9,label:'9日'},{value:10,label:'10日'},{value:11,label:'11日'},{value:12,label:'12日'}, |
|
{value:13,label:'13日'},{value:14,label:'14日'},{value:15,label:'15日'},{value:16,label:'16日'}, |
|
{value:17,label:'17日'},{value:18,label:'18日'},{value:19,label:'19日'},{value:20,label:'20日'}, |
|
{value:21,label:'21日'},{value:22,label:'22日'},{value:23,label:'23日'},{value:24,label:'24日'}, |
|
{value:25,label:'25日'},{value:26,label:'26日'},{value:27,label:'27日'},{value:28,label:'28日'}, |
|
{value:29,label:'29日'},{value:30,label:'30日'},{value:31,label:'31日'} |
|
], |
|
projectForm: {}, |
|
option: { |
|
searchMenuSpan: 8, |
|
selection: true, |
|
index: true, |
|
delBtn: false, |
|
editBtn: false, |
|
labelSuffix: " ", //控制标题后缀 |
|
labelWidth: 120, |
|
gutter: 20, //设置input的大小 |
|
expandLevel: 3, |
|
headerAlign: "left", |
|
menuWidth: 450, |
|
align: "left", |
|
menuPosition: "left", |
|
tree: true, |
|
menuBtn: false, |
|
submitBtn: true, |
|
emptyBtn: false, |
|
addBtn: false, |
|
searchBtn: false, |
|
columnBtn: false, |
|
refreshBtn: false, |
|
tip: false, |
|
border: false, |
|
saveBtn: false, |
|
cancelBtn: false, |
|
dialogWidth: 920, |
|
updateBtn: false, |
|
labelPosition: "top", |
|
dialogCustomClass: "custom", |
|
indexLabel: "序号", |
|
column: [ |
|
{ |
|
label: "计划单据", |
|
prop: "code", |
|
overHidden: true, |
|
align: "left", |
|
}, |
|
{ |
|
label: "计划名称", |
|
prop: "name", |
|
overHidden: true, |
|
align: "left", |
|
}, |
|
{ |
|
label: "计划状态", |
|
prop: "status", |
|
slot: true, |
|
align: "left", |
|
overHidden: true, |
|
}, |
|
{ |
|
label: "保养设备", |
|
prop: "assetName", |
|
align: "left", |
|
overHidden: true, |
|
}, |
|
{ |
|
overHidden: true, |
|
label: "设备型号", |
|
prop: "assetModel", |
|
align: "left", |
|
}, |
|
{ |
|
label: "开始时间", |
|
prop: "startTime", |
|
overHidden: true, |
|
align: "left", |
|
}, |
|
{ |
|
label: "结束时间", |
|
prop: "endTime", |
|
overHidden: true, |
|
align: "left", |
|
}, |
|
{ |
|
label: "预计工时(时)", |
|
overHidden: true, |
|
prop: "totalCost", |
|
align: "left", |
|
}, |
|
{ |
|
label: "保养项目数", |
|
overHidden: true, |
|
prop: "projectCount", |
|
align: "left", |
|
}, |
|
], |
|
}, |
|
data: [], |
|
isShowNum: "", |
|
tableData: [ |
|
{ |
|
projectCode: "MPJ202351101651708", |
|
name: "项目一", |
|
status: 1, |
|
type: 1, |
|
time: 2, |
|
content: "保养内容一", |
|
remark: "", |
|
}, |
|
{ |
|
projectCode: "MPJ202351101651442", |
|
name: "项目二", |
|
status: 0, |
|
type: 2, |
|
time: 3, |
|
content: "保养内容一", |
|
remark: "备注", |
|
}, |
|
], |
|
page: [ |
|
{ |
|
size: 10, |
|
current: 1, |
|
total: 2, |
|
}, |
|
], |
|
listPage:{ |
|
current: 1, //当前第几页 |
|
total: 0, //总页数 |
|
size: 10, //每一页加载多少数据 |
|
}, |
|
total: '', |
|
selectionList: [], |
|
deviceList:[], |
|
loading:false, |
|
typeList:[], |
|
addRules:{ |
|
name:[{required:true,message:'请输入计划名称',trigger:'blur'}], |
|
maintainType:[{required:true,message:'请选择保养类型',trigger:'blur'}], |
|
totalCost:[{required:true,message:'请输入预计工时',trigger:'blur'}], |
|
groupId:[{required:true,message:'请选择保养班组',trigger:'blur'}], |
|
assetId:[{required:true,message:'请选择保养设备',trigger:'blur'}], |
|
cycleMethod:[{required:true,message:'请选择循环方式',trigger:'blur'}], |
|
startTime:[{required:true,message:'请选择开始时间',trigger:'blur'}], |
|
}, |
|
groupList:[], |
|
methodList:[ |
|
{label:'单次',value:'1'},{label:'周期性',value:'2'} |
|
], |
|
cycleList:[ |
|
{label:'年',value:'1'},{label:'月',value:'2'},{label:'间隔',value:'3'} |
|
], |
|
title:'' |
|
}; |
|
}, |
|
beforeCreate() { |
|
that = this |
|
}, |
|
created() { |
|
getTypeList().then(res =>{ |
|
this.typeList = res.data.data |
|
}) |
|
getGroup().then(res =>{ |
|
this.groupList = res.data.data |
|
}) |
|
getDeviceList({current:1,size:500}).then(res =>{ |
|
this.deviceList = res.data.data.records |
|
}) |
|
this.onLoad(); |
|
}, |
|
filters: { |
|
deviceName: (data) => { |
|
for (const i in that.deviceList) { |
|
const element = that.deviceList[i]; |
|
if (data == element.id) { |
|
return element.name; |
|
} |
|
} |
|
}, |
|
maintainTypeName: (data) => { |
|
for (const i in that.typeList) { |
|
const element = that.typeList[i]; |
|
if (data == element.dictKey) { |
|
return element.dictValue; |
|
} |
|
} |
|
}, |
|
groupName:(data) => { |
|
for (const i in that.groupList) { |
|
const element = that.groupList[i]; |
|
if (data == element.id) { |
|
return element.fullName; |
|
} |
|
} |
|
} |
|
}, |
|
methods: { |
|
// 切换周期 |
|
changePeriod(val) { |
|
this.isShowNum = val; |
|
}, |
|
getRowKey(row) { |
|
return row.id; |
|
}, |
|
// 查询 0搜索 1重置 |
|
searchHandle(val) { |
|
if (val == 0) { |
|
this.onLoad(); |
|
} else { |
|
this.searchForm = { |
|
status: null, |
|
name: null, |
|
code: null, |
|
type: null, |
|
}; |
|
} |
|
}, |
|
// 查询保养项目 |
|
searchProject(){ |
|
getProList({current:this.page[0].current,size:this.page[0].size,...this.proForm}).then(res =>{ |
|
this.tableData = res.data.data.records |
|
this.total = res.data.data.total |
|
this.$nextTick(() =>{ |
|
if(this.addForm.orderList.length !== 0){ |
|
this.addForm.orderList.forEach(row => { |
|
this.tableData.map((item,index) =>{ |
|
if(item.id == row.id){ |
|
this.$refs.maintainTable.toggleRowSelection(this.tableData[index],true); |
|
} |
|
}) |
|
}); |
|
|
|
} |
|
}) |
|
}) |
|
}, |
|
// 按照条数查询保养项目 |
|
handleSizeChange(val){ |
|
this.page[0].size = val |
|
this.searchProject() |
|
}, |
|
// 分页查询保养项目 |
|
handleCurrentChange(val){ |
|
this.page[0].current = val; |
|
this.searchProject() |
|
}, |
|
// 停用计划 |
|
handleStop(row,index){ |
|
changePlanStatus({id:row.id,status:0}).then(res =>{ |
|
if(res.data.code == 200){ |
|
this.$message.success('停用成功') |
|
this.onLoad() |
|
} |
|
}) |
|
}, |
|
// 启用计划 |
|
handleStart(row,index){ |
|
changePlanStatus({id:row.id,status:1}).then(res =>{ |
|
if(res.data.code == 200){ |
|
this.$message.success('启用成功') |
|
this.onLoad() |
|
} |
|
}) |
|
}, |
|
// 添加保养项目弹窗 |
|
addSpecimen() { |
|
this.showProjectDialog = true; |
|
this.page[0].current = 1 |
|
this.searchProject() |
|
this.$refs.maintainTable.clearSelection(); |
|
// getProList({current:1,size:200}).then(res =>{ |
|
// this.tableData = res.data.data.records |
|
|
|
// }) |
|
}, |
|
// 删除保养项目 |
|
removeSpecimen(index, row){ |
|
if (index > 0 || this.addForm.orderList.length > 1) { |
|
this.addForm.orderList.splice(index, 1); |
|
} else { |
|
this.$message({ |
|
message: "至少要填写一行", |
|
type: "warning", |
|
}); |
|
} |
|
}, |
|
// 添加保养项目 |
|
addProject() { |
|
console.log("123123"); |
|
if (this.selectionList.length == 0) { |
|
this.$message.warning("请至少选择一个保养项目"); |
|
}else { |
|
let tmp = this.selectionList.find(item => item.status == 1) |
|
if(tmp){ |
|
this.$message.warning("不可选择已经停用的项目"); |
|
return |
|
} |
|
this.addForm.orderList = this.selectionList |
|
this.showProjectDialog = false; |
|
} |
|
}, |
|
// 保养项目多选 |
|
handleSelectionChange(val) { |
|
this.selectionList = val; |
|
}, |
|
// 查询数据 |
|
onLoad() { |
|
this.loading = true |
|
getPlanList({current:this.listPage.current,size:this.listPage.size,...this.searchForm}).then(res =>{ |
|
this.data = res.data.data.records |
|
this.listPage.total = res.data.data.total |
|
this.loading = false |
|
}) |
|
}, |
|
// 查看 |
|
handleView(row, index) { |
|
getPlanDetail(row.id).then(res =>{ |
|
this.planForm = res.data.data; |
|
this.planForm.orderList = this.planForm.projectList |
|
this.showPlanDialog = true; |
|
}) |
|
}, |
|
// 查看保养项目弹窗 |
|
handleViewPro(row, index) { |
|
this.showDialog = true; |
|
this.projectForm = row; |
|
}, |
|
// 打开新增弹窗 |
|
handleAdd() { |
|
this.showAddDialog = true; |
|
this.$nextTick(() =>{ |
|
this.addForm = { |
|
orderList:[] |
|
} |
|
this.title = '新建计划' |
|
this.$refs.addForm.clearValidate() |
|
}) |
|
}, |
|
// 新增保存 |
|
handleSubmit() { |
|
this.$refs['addForm'].validate((valid) => { |
|
if(valid){ |
|
console.log("row ========>", this.addForm); |
|
if(this.addForm.cycleMethod == 2){ |
|
if(!this.addForm.actionCycleType || !this.addForm.actionCycleTime){ |
|
this.$message.warning('循环方式为周期性时,保养周期与保养间隔均不可为空') |
|
return |
|
} |
|
} |
|
if(this.addForm.orderList.length == 0){ |
|
this.$message.warning('至少选择一条保养项目') |
|
}else{ |
|
let arr = [] |
|
if(this.addForm.orderList.length !== 0){ |
|
this.addForm.orderList.map(item =>{ |
|
arr.push({id:item.id}) |
|
}) |
|
} |
|
this.addForm.projectList = arr |
|
savePlan(this.addForm).then(res =>{ |
|
if(res.data.code == 200){ |
|
this.$message.success('提交成功') |
|
this.showAddDialog = false |
|
this.listPage.current = 1 |
|
this.onLoad() |
|
} |
|
}) |
|
} |
|
|
|
} |
|
}) |
|
}, |
|
// 分页 |
|
currentChange(currentPage) { |
|
this.listPage.current = currentPage; |
|
this.onLoad(); |
|
}, |
|
sizeChange(pageSize) { |
|
this.listPage.size = pageSize; |
|
this.onLoad(); |
|
}, |
|
// 打开编辑弹窗 |
|
handleEdit(row, index) { |
|
this.addForm.actionCycleTime = '' |
|
this.addForm.orderList = [] |
|
getPlanDetail(row.id).then(res =>{ |
|
this.addForm = res.data.data; |
|
if(this.addForm.actionCycleType == 2){ |
|
this.addForm.actionCycleTime = Number(this.addForm.actionCycleTime) |
|
} |
|
this.addForm.orderList = this.addForm.projectList |
|
console.log('actionCycleTime ====>',this.addForm.actionCycleTime) |
|
this.showAddDialog = true |
|
}) |
|
}, |
|
// 删除计划 |
|
handleDelete(row,index){ |
|
this.$confirm("确定删除此保养计划吗?", "提示", { |
|
confirmButtonText: "确定", |
|
cancelButtonText: "取消", |
|
type: "warning", |
|
}).then(() => { |
|
deletePlan(row.id).then(res =>{ |
|
if(res.data.code == 200){ |
|
this.$message.success('删除成功') |
|
this.onLoad() |
|
} |
|
}) |
|
}) |
|
}, |
|
// 创建任务 |
|
handleCreatTask(row,index){ |
|
this.$confirm("确定创建任务吗?", "提示", { |
|
confirmButtonText: "确定", |
|
cancelButtonText: "取消", |
|
type: "warning", |
|
}).then(() => { |
|
createTask(row.id).then(res =>{ |
|
if(res.data.code == 200){ |
|
this.$message.success('任务创建成功') |
|
this.onLoad() |
|
} |
|
}) |
|
}) |
|
} |
|
}, |
|
}; |
|
</script> |
|
|
|
<style lang="scss" scoped> |
|
::v-deep .el-table td.el-table__cell, |
|
.el-table th.el-table__cell.is-leaf { |
|
border-bottom: 1px solid #f0f3f7; |
|
} |
|
::v-deep .el-table .el-table__cell.is-center { |
|
text-align: left; |
|
} |
|
::v-deep .avue-crud .el-table th { |
|
color: #999999; |
|
font-weight: 400; |
|
background: #f6f8fa; |
|
height: 66px; |
|
} |
|
::v-deep .avue-crud .el-table td { |
|
height: 66px; |
|
color: #333333; |
|
} |
|
::v-deep .el-table .el-table__cell.is-center { |
|
text-align: left; |
|
} |
|
::v-deep .el-table__row .el-button--default, |
|
.el-table__row .el-button--text { |
|
background-color: #fff !important; |
|
} |
|
// 按钮样式 |
|
::v-deep .el-table__row .el-button--default, |
|
.el-table__row .el-button--text { |
|
background-color: #fff !important; |
|
width: 70px; |
|
height: 36px; |
|
border-radius: 0; |
|
padding: 10px; |
|
border-color: #e4e7ec; |
|
color: #333333; |
|
} |
|
/deep/ .avue-crud__pagination { |
|
height: 20px; |
|
padding: 10px; |
|
// padding-top: 30px; |
|
// padding-bottom: 30px; |
|
} |
|
.search-input { |
|
width: 255px; |
|
height: 46px; |
|
margin-left: 10px; |
|
/deep/ .el-input__inner { |
|
width: 255px; |
|
height: 46px; |
|
} |
|
} |
|
.search { |
|
color: #fff; |
|
background-color: #1e60f5; |
|
border-color: #1e60f5; |
|
height: 46px; |
|
width: 100px; |
|
border-radius: 0px; |
|
// margin-left:18px!important; |
|
margin-right: 0 !important; |
|
} |
|
// 重置按钮 |
|
.reset { |
|
color: #999999; |
|
background-color: #fff; |
|
border-color: #e4e7ec; |
|
height: 46px; |
|
width: 100px; |
|
margin-left: 18px !important; |
|
border-radius: 0px; |
|
} |
|
.search-picker { |
|
width: 240px; |
|
height: 46px; |
|
border-radius: 0; |
|
margin-left: 10px; |
|
} |
|
.search-select { |
|
width: 240px !important; |
|
height: 46px; |
|
border-radius: 0; |
|
margin-left: 10px; |
|
/deep/ .el-input__inner { |
|
width: 240px; |
|
height: 46px; |
|
} |
|
} |
|
.search_select { |
|
width: 150px !important; |
|
height: 46px; |
|
border-radius: 0; |
|
margin-left: 10px; |
|
/deep/ .el-input__inner { |
|
width: 150px; |
|
height: 46px; |
|
} |
|
} |
|
// 新增取消确定 |
|
.buttonOne { |
|
color: #999999; |
|
background-color: #fff; |
|
border-color: #e4e7ec; |
|
height: 46px; |
|
width: 100px; |
|
border-radius: 0px; |
|
margin-left: 20px; |
|
} |
|
.buttonOne:hover { |
|
color: #fff; |
|
background-color: #1e60f5; |
|
border-color: #1e60f5; |
|
height: 46px; |
|
width: 100px; |
|
border-radius: 0px; |
|
margin-left: 20px; |
|
} |
|
// 分页 |
|
::v-deep .el-pagination .el-select .el-input .el-input__inner { |
|
height: 20px; |
|
} |
|
|
|
|
|
</style> |
|
<style lang="scss"> |
|
/*选择日期，年份的隐藏 */ |
|
.picker-dateNoneYear { |
|
.el-date-picker__header { |
|
span:nth-child(3) { /*第三个标签是span的标签，把它隐藏*/ |
|
display: none; |
|
} |
|
button:nth-child(1) { |
|
display: none; |
|
} |
|
button:nth-child(5) { |
|
display: none; |
|
} |
|
} |
|
} |
|
</style>
|
|
|