<!--
|
* @Date: 2024-01-06 17:40:19
|
* @LastEditors: Sneed
|
* @LastEditTime: 2024-01-19 00:15:38
|
* @FilePath: /belleson-frontend/Users/mache/Documents/demo/mdc/src/container/maintenance/index.vue
|
-->
|
<template>
|
<div class="maintenance">
|
<div class="nav">设备保养/{{navName}}</div>
|
<List ref="list" url="/maintain/pageQuery">
|
<template slot="search">
|
<div class="item">
|
<span>统一编号</span>
|
<el-input class="item-value" v-model="queryInfo.uuid" clearable></el-input>
|
</div>
|
<div class="item">
|
<span>设备名称</span>
|
<el-select class="item-value" v-model="queryInfo.machineName" placeholder="请选择" clearable>
|
<el-option v-for="item in machineList" :key="item.id" :label="item.machineName" :value="item.id">
|
</el-option>
|
</el-select>
|
</div>
|
<!-- <div class="item">
|
<span>设备型号</span>
|
<el-input class="item-value" v-model="queryInfo.type"></el-input>
|
</div>
|
<div class="item">
|
<span>设备规格</span>
|
<el-input class="item-value" v-model="queryInfo.specification"></el-input>
|
</div> -->
|
<div class="item">
|
<span>使用部门</span>
|
<el-select class="item-value" v-model="queryInfo.department" clearable>
|
<el-option v-for="item in departmentlist" :key="item.value" :label="item.label" :value="item.value">
|
</el-option>
|
</el-select>
|
</div>
|
<!-- <div class="item">
|
<span>安装位置</span>
|
<el-input class="item-value" v-model="queryInfo.location"></el-input>
|
</div> -->
|
<div class="item">
|
<span>计划开始日期</span>
|
<el-date-picker class="item-value" clearable v-model="queryInfo.planStartDate" align="right" type="date" placeholder="选择日期">
|
</el-date-picker>
|
</div>
|
<div class="item">
|
<span>计划完成日期</span>
|
<el-date-picker class="item-value" clearable v-model="queryInfo.planFinishDate" align="right" type="date" placeholder="选择日期">
|
</el-date-picker>
|
</div>
|
<div class="item" style="flex: 1 1 auto;justify-content: flex-end;">
|
<el-button type="primary" size="small" @click="query">查询</el-button>
|
<el-button type="primary" size="small" @click="reset">重置</el-button>
|
</div>
|
</template>
|
<template slot="table-tool">
|
<el-button type="primary" size="mini" @click="addDevice(1)">添加</el-button>
|
</template>
|
<template slot="columns">
|
<!-- <el-table-column
|
type="selection"
|
align="center"
|
width="55">
|
</el-table-column> -->
|
<!-- <el-table-column align="center" label="统一编号" prop="uuid">
|
</el-table-column> -->
|
<el-table-column align="center" label="设备名称" width="150" :show-overflow-tooltip="true" prop="machineName">
|
</el-table-column>
|
<el-table-column align="center" label="设备型号" prop="type">
|
</el-table-column>
|
<el-table-column align="center" label="设备规格" prop="specification">
|
</el-table-column>
|
<el-table-column align="center" label="使用单位" prop="department">
|
</el-table-column>
|
<el-table-column align="center" label="保养者" prop="userName">
|
</el-table-column>
|
<el-table-column align="center" label="保养周期" prop="period">
|
</el-table-column>
|
<el-table-column align="center" label="保养类型" prop="style">
|
<template slot-scope="scope">
|
<span>{{ scope.row.style === "1" ? "日常保养" : scope.row.style === "2" ? "一级保养" :
|
scope.row.style === "3" ? "二级保养" : "三级保养" }}</span>
|
</template>
|
</el-table-column>
|
<el-table-column align="center" width="110" label="是否合格" prop="isQualified">
|
<template slot-scope="scope">
|
<span>{{ scope.row.isQualified === "1" ? "合格" : "不合格" }}</span>
|
</template>
|
</el-table-column>
|
<el-table-column align="center" width="120" :show-overflow-tooltip="true" label="计划开始时间">
|
<template slot-scope="scope">
|
<span v-if="scope.row.startDateFrom">{{ scope.row.startDateFrom + '~' + scope.row.startDateTo }}</span>
|
<span v-else></span>
|
</template>
|
</el-table-column>
|
<el-table-column align="center" width="120" :show-overflow-tooltip="true" label="计划完成时间">
|
<template slot-scope="scope">
|
<span v-if="scope.row.completeDateFrom">{{ scope.row.completeDateFrom + '~'
|
+ scope.row.completeDateTo }}</span>
|
<span v-else></span>
|
</template>
|
</el-table-column>
|
<el-table-column align="center" width="150" :show-overflow-tooltip="true" label="保养内容与存在问题" prop="detail">
|
</el-table-column>
|
<el-table-column align="center" label="操作" prop="editor">
|
<template slot-scope="scope">
|
<el-button size="mini" type="text" @click="addDevice(2, scope.row, $event)">编辑</el-button>
|
<el-button size="mini" type="text" @click="deleteHandle(scope.row)">删除</el-button>
|
</template>
|
</el-table-column>
|
</template>
|
</List>
|
<DailyMAddD ref="dailyMAddD" @reflash="query" :styleValue="queryInfo.style" :styleName="navName" :departmentlist="departmentlist" :machineList="machineList" :userList="userList"></DailyMAddD>
|
</div>
|
</template>
|
<script>
|
import List from '../list/index.vue'
|
import { getUseDpts,getRequest } from '@/api/Api'
|
import DailyMAddD from './dailyMAdd.vue'
|
export default {
|
components: {
|
List,
|
DailyMAddD
|
},
|
computed: {
|
navName () {
|
let names = ['日常保养','一级保养','二级保养','三级保养']
|
return names[this.$route.params.style-1]
|
},
|
},
|
watch: {
|
$route () {
|
this.queryInfo.style = this.$route.params.style
|
this.query()
|
}
|
},
|
data() {
|
return {
|
departmentlist: [],
|
userList: [],
|
machineList: [],
|
queryInfo: {
|
uuid: '',
|
machineName: '',
|
style: 1,
|
type: '',
|
specification: '',
|
department: '',
|
location: '',
|
planStartDate: '',
|
planFinishDate: '',
|
},
|
|
}
|
},
|
mounted() {
|
this.init()
|
this.query()
|
},
|
methods: {
|
init () {
|
// 查询使用部门
|
getUseDpts().then(res => {
|
this.departmentlist = res.data.map(item => {
|
return {
|
value: item.id,
|
label: item.name
|
}
|
})
|
})
|
getRequest('machineList', {
|
}).then(res => {
|
this.machineList = res.data.list
|
console.log(res)
|
})
|
getRequest('userList', {
|
}).then(res => {
|
this.userList = res.data
|
})
|
},
|
|
query() {
|
this.$refs.list.pageQuery(this.queryInfo)
|
},
|
reset() {
|
Object.keys(this.queryInfo).forEach(key => {
|
this.queryInfo[key] = ''
|
})
|
},
|
addDevice(n, row, event) {
|
if (n === 1) {//添加
|
this.$nextTick(() => {
|
this.$refs.dailyMAddD.init(n)
|
})
|
} else {
|
this.$nextTick(() => {
|
this.$refs.dailyMAddD.init(n, row)
|
})
|
}
|
},
|
deleteHandle(row) {
|
this.$confirm('确定要永久删除此项?', '提示', {
|
confirmButtonText: '确定',
|
cancelButtonText: '取消',
|
type: 'warning'
|
}).then(() => {
|
getRequest('maintainDel', { ids: [row.id] }).then(res => {
|
this.$message({
|
type: 'success',
|
message: '删除成功!'
|
})
|
this.query();
|
}).catch(() => {
|
this.$message({
|
type: 'info',
|
message: '已取消删除'
|
})
|
})
|
})
|
},
|
submitForm() {
|
|
}
|
},
|
}
|
</script>
|
<style lang="scss">
|
.maintenance {
|
.item-value {
|
.el-input__inner {
|
background: transparent;
|
border-radius: 2px;
|
border: 1px solid #435F9E;
|
}
|
}
|
|
.el-button--mini {
|
background: transparent;
|
}
|
|
.el-button--primary {
|
background-color: transparent;
|
}
|
}
|
</style>
|
<style lang="scss" scoped>
|
.maintenance {
|
width: 100%;
|
height: 100%;
|
overflow: hidden;
|
color: #FFF;
|
display: flex;
|
flex-direction: column;
|
|
.nav {
|
padding: 10px 30px;
|
font-size: 14px;
|
}
|
|
.item {
|
margin-top: 20px;
|
margin-left: 50px;
|
display: flex;
|
align-items: center;
|
|
span {
|
width: 120px;
|
font-size: 16px;
|
font-family: PingFangSC, PingFang SC;
|
color: #C6DCE0;
|
text-align: right;
|
padding-right: 20px;
|
}
|
|
.item-value {
|
width: 200px;
|
border: 1px solid #435F9E;
|
}
|
|
.btn {
|
line-height: 1.5;
|
width: 100px;
|
text-align: center;
|
font-size: 16px;
|
cursor: pointer;
|
}
|
|
.reset {
|
background: #AAB6BA;
|
color: #FFF;
|
}
|
|
.query {
|
background: #5DD1FC;
|
color: #FFF;
|
}
|
}
|
}
|
</style>
|