13 changed files with 288 additions and 34 deletions
@ -0,0 +1,199 @@ |
|||
<template> |
|||
<div class="home app_content"> |
|||
<!-- 中间 --> |
|||
<!-- <div class="warp_body">--> |
|||
<!-- <div class="white-body">--> |
|||
<!-- <div class="tabs">--> |
|||
<!-- <ul>--> |
|||
<!-- <li v-for='(item,index) in data.list' @click='check(index)'--> |
|||
<!-- :class="{ active: index === data.TabId }">--> |
|||
<!-- <span v-if="index === 0"> {{item.title}}</span>--> |
|||
<!-- <span v-else-if="index === 1" class="warn-tab"> {{item.title}}</span>--> |
|||
<!-- </li>--> |
|||
<!-- </ul>--> |
|||
<!-- </div>--> |
|||
<!-- <div v-if="data.TabId == 0">--> |
|||
<!-- <enterpriseInspectionList isReg="0"></enterpriseInspectionList>--> |
|||
<!-- </div>--> |
|||
<!-- <div v-if="data.TabId == 1">--> |
|||
<!-- <enterpriseInspectionList isReg="1"></enterpriseInspectionList>--> |
|||
<!-- </div>--> |
|||
<!-- </div>--> |
|||
<!-- </div>--> |
|||
|
|||
<van-tabs v-model:active="active" sticky @click-tab="onClickTab"> |
|||
<van-tab v-for="(item, index) in data.list" :title="item.title"> |
|||
<div v-if="data.TabId == 0" style="height: calc(100vh - 1.2rem);"> |
|||
<enforcementPlanAdd :isReg="0" /> |
|||
</div> |
|||
<div v-if="data.TabId == 1" style="height: calc(100vh - 1.2rem);"> |
|||
<enforcementPlanList :isReg="1" /> |
|||
</div> |
|||
</van-tab> |
|||
</van-tabs> |
|||
</div> |
|||
</template> |
|||
|
|||
<script setup name="enforcementPlanBase"> |
|||
import enforcementPlanAdd from '@/views/enforce/enforcementPlanAdd.vue'; |
|||
import enforcementPlanList from '@/views/enforce/enforcementPlan.vue'; |
|||
|
|||
const {useCommon} = $globalStore; |
|||
//路由参数 |
|||
const router = useRouter(); |
|||
const route = useRoute(); |
|||
|
|||
//tab切换 |
|||
const active = ref(0); |
|||
const data = reactive({ |
|||
status: 0, |
|||
TabId: 0, |
|||
list: [ |
|||
{ |
|||
title: '创建检查计划', |
|||
value: '0' |
|||
}, |
|||
{ |
|||
title: '行政检查计划', |
|||
value: '1' |
|||
}, |
|||
], |
|||
}); |
|||
|
|||
const onClickTab = ({ title }) => { |
|||
if(title == '创建检查计划'){ |
|||
data.TabId = 0; |
|||
}else{ |
|||
data.TabId = 1; |
|||
} |
|||
}; |
|||
|
|||
|
|||
onMounted(() => { |
|||
|
|||
}) |
|||
|
|||
</script> |
|||
|
|||
<style lang="less" scoped> |
|||
.home { |
|||
display: flex; |
|||
flex-direction: column; |
|||
height: 100%; |
|||
overflow: hidden; |
|||
background-color: #ebf3fb; |
|||
|
|||
.warp_body { |
|||
position: relative; |
|||
background-image: linear-gradient(to bottom, #ebf3fb, transparent); |
|||
} |
|||
|
|||
.white-body { |
|||
margin: 0 3%; |
|||
width: 94%; |
|||
height: 99%; |
|||
background-color: #fff; |
|||
border-radius: 0.27rem; |
|||
} |
|||
} |
|||
|
|||
.tohome { |
|||
position: absolute; |
|||
top: 1.25%; |
|||
right: 5%; |
|||
font-size: 0.5rem; |
|||
} |
|||
|
|||
.tabs { |
|||
padding: 3% 3% 0; |
|||
width: 94%; |
|||
height: 1.25rem; |
|||
box-sizing: content-box; |
|||
} |
|||
|
|||
.tabs ul { |
|||
display: flex; |
|||
width: 100%; |
|||
height: 100%; |
|||
font-size: 0.4rem; |
|||
line-height: 1.25rem; |
|||
text-align: center; |
|||
align-content: center; |
|||
justify-items: center; |
|||
} |
|||
|
|||
.tabs ul li { |
|||
float: left; |
|||
width: 50%; |
|||
height: 100%; |
|||
} |
|||
|
|||
.tabs ul li span { |
|||
display: block; |
|||
width: 100%; |
|||
height: 100%; |
|||
color: #4aa1f9; |
|||
background: url("src/assets/images/tab_bg1_1.png") no-repeat; |
|||
background-size: 100% 100%; |
|||
} |
|||
|
|||
.tabs ul li.active span { |
|||
background: url("src/assets/images/tab_bg1.png") no-repeat; |
|||
background-size: 100% 100%; |
|||
color: #fff; |
|||
} |
|||
|
|||
.tabs ul li span.warn-tab { |
|||
margin-left: -2%; |
|||
background: url("src/assets/images/tab_bg.png") no-repeat; |
|||
background-size: 100% 100%; |
|||
} |
|||
|
|||
.tabs ul li.active span.warn-tab { |
|||
background: url("src/assets/images/tab_bg_1.png") no-repeat; |
|||
background-size: 100% 100%; |
|||
color: #fff; |
|||
} |
|||
|
|||
.tabs ul li span.level1 { |
|||
background: url("src/assets/images/tab_shine_red.gif") no-repeat !important; |
|||
background-size: 100% 100% !important; |
|||
color: #fff !important; |
|||
} |
|||
|
|||
.tabs ul li span.level2 { |
|||
background: url("src/assets/images/tab_shine_org.gif") no-repeat !important; |
|||
background-size: 100% 100% !important; |
|||
color: #fff !important; |
|||
} |
|||
|
|||
.tabs ul li span.level3 { |
|||
background: url("src/assets/images/tab_shine_yel.gif") no-repeat !important; |
|||
background-size: 100% 100% !important; |
|||
color: #fff !important; |
|||
} |
|||
|
|||
.addinfo { |
|||
position: absolute; |
|||
bottom: 3%; |
|||
right: 2%; |
|||
z-index: 99999; |
|||
width: 1.5rem; |
|||
height: 1.5rem; |
|||
background-color: #1367fe; |
|||
border-radius: 50%; |
|||
box-shadow: 0 0 0.27rem #1367fe; |
|||
color: #fff; |
|||
font-size: 0.4rem; |
|||
text-align: center; |
|||
vertical-align: middle; |
|||
padding-top: 0.45rem; |
|||
box-sizing: border-box; |
|||
} |
|||
|
|||
/deep/ .van-tabs__line { |
|||
width: 44%; |
|||
height: 0.06rem; |
|||
} |
|||
|
|||
</style> |
|||
Loading…
Reference in new issue