<!--
|
* @Date: 2024-01-06 17:40:19
|
* @LastEditors: Sneed
|
* @LastEditTime: 2024-01-29 23:01:11
|
* @FilePath: /belleson-frontend/Users/mache/Documents/demo/mdc/src/container/component/index.vue
|
-->
|
<template>
|
<div class="maintenance">
|
<Nav name="工件信息">
|
</Nav>
|
<List ref="list" :url="url">
|
<template slot="search">
|
<div class="item">
|
<span>零件号</span>
|
<el-select class="item-value" v-model="queryInfo.component" placeholder="请选择" clearable>
|
<el-option
|
v-for="item in componentList"
|
:key="item"
|
:label="item"
|
:value="item">
|
</el-option>
|
</el-select>
|
</div>
|
<div class="item">
|
<span>工序号</span>
|
<!-- <el-input class="item-value" v-model="query.no"></el-input> -->
|
<el-select class="item-value" v-model="queryInfo.precess" placeholder="请选择" clearable>
|
<el-option
|
v-for="item in precessList"
|
:key="item"
|
:label="item"
|
:value="item">
|
</el-option>
|
</el-select>
|
</div>
|
<div class="item">
|
<span>开始时间</span>
|
<!-- <el-input class="item-value" v-model="query.no"></el-input> -->
|
<el-date-picker
|
class="item-value"
|
v-model="queryInfo.timeBegin"
|
align="right"
|
value-format="yyyy-MM-dd"
|
type="date"
|
clearable
|
placeholder="选择日期">
|
</el-date-picker>
|
</div>
|
<div class="item">
|
<span>结束时间</span>
|
<el-date-picker
|
class="item-value"
|
v-model="queryInfo.timeEnd"
|
align="right"
|
clearable
|
value-format="yyyy-MM-dd"
|
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" style="width: 150px" @click="query">查询</el-button>
|
<el-button type="ghost" size="small" style="width: 150px" @click="reset">重置</el-button>
|
</div>
|
</template>
|
<template slot="columns">
|
<el-table-column
|
prop="machineId"
|
label="机床名"
|
width="180">
|
</el-table-column>
|
<el-table-column
|
prop="component"
|
label="零件号"
|
width="180">
|
</el-table-column>
|
<el-table-column
|
prop="process"
|
label="工序号">
|
</el-table-column>
|
<el-table-column
|
prop="time"
|
label="加工时间">
|
<template slot-scope="scope">
|
<span>{{scope.row.time.slice(0,10)}}</span>
|
</template>
|
</el-table-column>
|
</template>
|
</List>
|
</div>
|
</template>
|
<script>
|
import List from '../list/index.vue'
|
import { getUrl } from '@/api/Api'
|
import Nav from '@/components/nav'
|
export default {
|
components: {
|
List,
|
Nav
|
},
|
data () {
|
return {
|
url: '',
|
queryInfo: {
|
timeBegin: '',
|
timeEnd: '',
|
precess: '',
|
component: ''
|
},
|
precessList: [],
|
componentList: []
|
}
|
},
|
created () {
|
this.url = getUrl('componentQuery')
|
this.init()
|
// this.getProtocolList()
|
},
|
methods: {
|
reset () {
|
Object.keys(this.queryInfo).forEach(key => {
|
this.queryInfo[key] = ''
|
})
|
},
|
query () {
|
this.$refs.list.pageQuery(this.queryInfo)
|
},
|
changeTime (name,value) {
|
console.log(name,value)
|
this.queryInfo[name] = value
|
},
|
init () {
|
this.$http.get('/component/processlist').then(res => {
|
this.precessList = res.data
|
})
|
this.$http.post('/component/complist').then(res => {
|
this.componentList = res.data
|
})
|
}
|
},
|
}
|
</script>
|
<style lang="scss">
|
.maintenance {
|
.item-value {
|
.el-input__inner {
|
background: transparent;
|
border-radius: 2px;
|
border: 1px solid #435F9E;
|
}
|
}
|
}
|
</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>
|
