| @ -0,0 +1,97 @@ | |||||
| <template> | |||||
| <div class="study-enter"> | |||||
| <div class="content-list"> | |||||
| <div class="search-box"> | |||||
| <div class="search-item" :class="active===item.key?'active':''" v-for="(item,index) in tabList" :key="index" @click="changeTab(item)">{{item.name}}</div> | |||||
| </div> | |||||
| <div class="content-box"> | |||||
| 456 | |||||
| </div> | |||||
| </div> | |||||
| </div> | |||||
| </template> | |||||
| <script> | |||||
| import { study_list,study_info,study_save,study_delete} from "@/api/business/study/study"; | |||||
| export default { | |||||
| name: "StudyEnter", | |||||
| props:{ | |||||
| }, | |||||
| components:{ | |||||
| }, | |||||
| computed: { | |||||
| }, | |||||
| filters:{ | |||||
| }, | |||||
| data() { | |||||
| return { | |||||
| tabList:[ | |||||
| {key:'ytbd',name:'预填表单列表'}, | |||||
| {key:'tbbd',name:'填报表单列表'}, | |||||
| {key:'syxx',name:'试验信息'}, | |||||
| {key:'wzlb',name:'物资列表'}, | |||||
| {key:'syff',name:'试验方法列表'}, | |||||
| {key:'syj',name:'饲养间使用管理'} | |||||
| ], | |||||
| active:'ytbd' | |||||
| }; | |||||
| }, | |||||
| created() { | |||||
| }, | |||||
| methods: { | |||||
| show(row){ | |||||
| }, | |||||
| changeTab(item){ | |||||
| if(this.active!==item.key){ | |||||
| this.active = item.key | |||||
| } | |||||
| } | |||||
| } | |||||
| }; | |||||
| </script> | |||||
| <style lang="scss" scoped> | |||||
| .study-enter{ | |||||
| .search-box{ | |||||
| background: #fff; | |||||
| padding: 0; | |||||
| border-radius: 3px; | |||||
| margin-bottom: 10px; | |||||
| display: flex; | |||||
| flex-direction: row; | |||||
| align-items: center; | |||||
| .search-item{ | |||||
| padding: 10px 20px; | |||||
| cursor: pointer; | |||||
| &.active{ | |||||
| background: #1890ff; | |||||
| color: #fff; | |||||
| } | |||||
| &:hover{ | |||||
| background: #46a6ff; | |||||
| color: #fff; | |||||
| } | |||||
| &:first-child{ | |||||
| border-top-left-radius: 3px; | |||||
| border-bottom-left-radius: 3px; | |||||
| } | |||||
| &:last-child{ | |||||
| border-top-right-radius: 3px; | |||||
| border-bottom-right-radius: 3px; | |||||
| } | |||||
| } | |||||
| } | |||||
| .content-box{ | |||||
| background: #fff; | |||||
| padding: 20px; | |||||
| .add-box{ | |||||
| margin-bottom: 10px; | |||||
| } | |||||
| } | |||||
| } | |||||
| </style> | |||||