123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167 |
- <template>
- <view>
- <view class="tab-bar">
- <view class="item" :style="[active == 2?{color: '#a07c5a'}:'']"
- :class="active == 2?'active':''"
- @click="navTo(2,'/pages/theater/index/index')">
- <image src="/static/images/huodong.png" class="menu-icon"/>
- <text class="title" :style="[active == 2?{color: '#a07c5a'}:'']">活 动</text>
- </view>
- <view class="item" :style="[active == 1?{color: '#a07c5a'}:'']"
- :class="active == 1?'active':''"
- @click="navTo(1,'/pages/home/home')">
- <image src="/static/images/changdi.png" class="menu-icon"/>
- <text class="title" :style="[active == 1?{color: '#a07c5a'}:'']">场 地</text>
- </view>
-
- <view class="item" :style="[active == 3?{color: '#a07c5a'}:'']"
- :class="active == 3?'active':''"
- @click="onOpenHw">
- <image src="/static/images/2ndhome.png" class="menu-icon" style="width: 67px;height: 67px">
-
- </view>
-
- <view class="item" :style="[active == 4?{color: '#a07c5a'}:'']"
- :class="active == 4?'active':''"
- @click="navTo(4,'/pages/index/index?store_id=3')">
- <image src="/static/images/gongyi.png" class="menu-icon"/>
- <text class="title" :style="[active ==4?{color: '#a07c5a'}:'']">商 城</text>
- </view>
- <view class="item" :style="[active == 5?{color: '#a07c5a'}:'']"
- :class="active == 5?'active':''"
- @click="navTo(5,'/pages/home/myhome')">
- <image src="/static/images/wode.png" class="menu-icon" />
- <text class="title" :style="[active ==5?{color: '#a07c5a'}:'']">我 的</text>
- </view>
- </view>
- <!-- 号外号外 -->
- <uni-popup ref="hwPopForm" type="center" style="z-index: 60;">
- <SoundForm :dataList="movieList"></SoundForm>
- </uni-popup>
- </view>
- </template>
- <script>
- import SoundForm from '@/components/SoundForm/SoundForm.vue'
- export default {
- props: {
- active: {
- type: Number,
- default: 1
- }
- },
- components: {
-
-
- SoundForm
- },
-
- data() {
- return {
- // diy:2
- // active:1
- };
- },
-
- computed: {
-
- diy() {
-
- return this.$store.state.systemInfo.is_vip;
- },
-
- setColor() {
-
- return this.$store.state.setColor;
- }
-
- },
- watch:{
- active(val){
- console.log(val);
- this.active=val
- }
- },
-
- methods: {
- navTo(index, url) {
- console.log(index);
- if (index != this.active) {
- uni.switchTab({
- url: url
- })
-
- }
-
- },
- //打开收音机
- onOpenHw(e){
- this.$refs.hwPopForm.open('center');
- },
-
- }
- }
- </script>
- <style scoped>
- .tab-bar {
- background-color: #fff;
- width: 100vw;
-
- /*兼容 IOS<11.2*/
- padding-bottom: constant(safe-area-inset-bottom);
- /*兼容 IOS>11.2*/
- padding-bottom: env(safe-area-inset-bottom);
-
- display: flex;
- flex-flow: row nowrap;
- justify-tab-bar: space-around;
- align-items: center;
- border-top: 1px solid #f0f0f0;
- position: fixed;
- left: 0;
- bottom: 0;
- z-index: 900;
- }
- .tab-bar .item {
- flex: auto;
- display: flex;
- flex-flow: column nowrap;
- justify-content: center;
- align-items: center;
- color: #8a8a8a;
- height: 120rpx;
- }
-
- .menu-icon{
- width:24px;
- height:24px;
- }
- .tab-bar .iconfont {
- display: block;
- font-size: 48rpx;
- /* color: #8a8a8a; */
- }
- .tab-bar .active .iconfont {
- /* color: #3387FF; */
- }
- .tab-bar .title {
- font-size: 28rpx;
- height: 36rpx;
- line-height: 48rpx;
- text-align: center;
- /* color: #8a8a8a; */
- }
- .tab-bar .active .title {
- /* color: #3387FF; */
- color: #8a8a8a;
- font-weight: bold;
- }
- </style>
|