73 lines
1.2 KiB
Vue
73 lines
1.2 KiB
Vue
<template>
|
|
<div class="app-container">
|
|
<component
|
|
:is="currentComponent"
|
|
:query-params="currentQueryParams"
|
|
@switch-view="showDetails"
|
|
/>
|
|
</div>
|
|
</template>
|
|
|
|
<script>
|
|
import EquipmentMainList from './EquipmentMainList.vue'
|
|
import EquipmentDetailList from './EquipmentDetailList.vue'
|
|
export default {
|
|
components: {
|
|
EquipmentMainList,
|
|
EquipmentDetailList
|
|
},
|
|
data() {
|
|
return {
|
|
isDetails:'0',
|
|
}
|
|
},
|
|
computed: {
|
|
currentComponent() {
|
|
return this.isDetails === '0' ? 'EquipmentMainList' : 'EquipmentDetailList'
|
|
},
|
|
currentQueryParams() {
|
|
return this.isDetails === '0' ? this.queryParams : this.queryParamsDetails
|
|
}
|
|
},
|
|
methods: {
|
|
//展示明细
|
|
showDetails( num){
|
|
this.isDetails = num;
|
|
}
|
|
}
|
|
}
|
|
</script>
|
|
|
|
<style scoped lang="scss">
|
|
.view-btn {
|
|
color: #409eff;
|
|
font-size: 14px;
|
|
font-weight: bold;
|
|
}
|
|
|
|
.edit-btn {
|
|
color: #67c23a;
|
|
font-size: 12px;
|
|
font-weight: bold;
|
|
}
|
|
|
|
.delete-btn {
|
|
color: #f56c6c;
|
|
font-size: 16px;
|
|
font-weight: bold;
|
|
}
|
|
|
|
.app-container {
|
|
padding: 20px;
|
|
}
|
|
|
|
::v-deep .el-pagination {
|
|
margin-top: 15px;
|
|
text-align: right;
|
|
}
|
|
|
|
::v-deep .el-button {
|
|
margin-right: 8px;
|
|
}
|
|
</style>
|