宣传资讯

src/apps/AppInfotainment/select.vue

@@ -0,0 +1,65 @@
+<template>
+  <div class="page">
+    <div class="title">点击进入栏目</div>
+    <div class="tab-list">
+      <div v-for="(item, index) in tabList" :key="index" :class="tabIndex == index ? 'tab-item active' : ' tab-item'" @click="tabClick(index)">{{item}}</div>
+    </div>
+  </div>
+</template>
+
+<script>
+  export default {
+    name: 'page',
+    data () {
+      return {
+        tabList: ['全部', '通知公告', '工作动态', '惠民政策', '中央精神', '旅游故事',  '特色农产品'],
+        tabIndex: 0
+      }
+    },
+    onLoad (option) {
+      this.tabIndex = option.index
+    },
+
+    methods: {
+     tabClick(index) {
+      this.tabIndex = index
+      uni.setStorageSync('newTypeIndex', index)
+      uni.navigateBack({delta: 1})
+     }
+    },
+  }
+</script>
+
+<style lang="scss" scoped>
+.page{
+  height: 100%;
+  background-color: #FFFFFF;
+  .title{
+    font-size: 26rpx;
+    font-family: PingFangSC-Medium, PingFang SC;
+    font-weight: 500;
+    color: #B9B9B9;
+    line-height: 36rpx;
+    padding: 32rpx 0 30rpx 40rpx;
+  }
+  .tab-list{
+    padding: 0 0 0 30rpx;
+    .tab-item{
+      display: inline-block;
+      width: 144rpx;
+      height: 48rpx;
+      line-height: 48rpx;
+      text-align: center;
+      border-radius: 24rpx;
+      border: 2rpx solid #CBCBCB;
+      font-size: 26rpx;
+      color: #333;
+      box-sizing: border-box;
+      margin: 0 38rpx 32rpx 0;
+    }
+    .active{
+      color: #3376FD;
+    }
+  }
+}
+</style>