协同宣发

src/apps/AppCooperationPropaganda/AppCooperationPropaganda.vue

@@ -1,6 +1,9 @@
 <template>
   <div class="AppCooperationPropaganda">
     <AiTopFixed>
+      <div class="tab-select">
+        <div class="item" :class="tabIndex == index ? 'active' : ''" v-for="(item, index) in tabs" :key="index" @click="tabClick(index)">{{ item }}<span></span></div>
+      </div>
       <div class="search">
         <div class="searchBox">
           <u-search placeholder="请输入任务名称" v-model="taskTitle" clearabled @search="searchBtn" @clear="taskTitle='',getList()" :show-action="false"></u-search>
@@ -24,6 +27,11 @@
       </div>
     </div>
     <AiEmpty description="暂无数据" v-if="!list.length"/>
+
+    <AiFixedBtn>
+      <div class="addBtn iconfont iconfont-iconfangda" @tap="toAdd"></div>
+    </AiFixedBtn>
+
     <u-popup v-model="filterShow" mode="bottom" border-radius="14">
       <div class="popup">
         <div class="tips"></div>
@@ -74,6 +82,7 @@
         </div>
       </div>
     </u-popup>
+
   </div>
 </template>
 
@@ -83,6 +92,8 @@ export default {
   appName: '协同宣发',
   data() {
     return {
+      tabs: ['群发居民群','群发居民','群发朋友圈'],
+      tabIndex: 0,
       current: 1,
       name: '',
       list: [],
@@ -100,6 +111,9 @@ export default {
     }
   },
   methods: {
+    tabClick(index) {
+      this.tabIndex = index;
+    },
     toDetail(item) {
       uni.navigateTo({url: `./cooperationDetail?id=${item.id}&time=${item.createTime}`})
     },
@@ -161,6 +175,9 @@ export default {
     confirmEnd(val) {
       this.endTime = val.year + '-' + val.month + '-' + val.day
     },
+    toAdd() {
+      
+    }
   },
   onShow() {
     document.title = '协同宣发'
@@ -179,11 +196,50 @@ export default {
 
 <style lang="scss" scoped>
 .AppCooperationPropaganda {
+  ::v-deep .AiTopFixed .content {
+    padding: 0;
+  }
+
+  .tab-select {
+    width: 100%;
+    height: 96px;
+    line-height: 96px;
+    background: #3975c6;
+    display: flex;
+
+    .item {
+      flex: 1;
+      text-align: center;
+      font-size: 28px;
+      font-family: PingFangSC-Regular, PingFang SC;
+      color: #cddcf0;
+    }
+
+    .active {
+      font-family: PingFangSC-Medium, PingFang SC;
+      font-weight: 500;
+      position: relative;
+      color: #fff;
+
+      span {
+        width: 48px;
+        height: 4px;
+        background: #fff;
+        position: absolute;
+        bottom: 14px;
+        left: 50%;
+        margin-left: -24px;
+      }
+    }
+  }
+
   .search {
     display: flex;
-    height: 80px;
+    height: 100px;
     align-items: center;
     justify-content: space-between;
+    padding: 20px 32px;
+    box-sizing: border-box;
 
     .searchBox {
       width: 562px;
@@ -252,6 +308,21 @@ export default {
       }
     }
   }
+
+  .addBtn {
+    width: 96px;
+    height: 96px;
+    flex-shrink: 0;
+    background: $uni-color-primary;
+    box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2);
+    font-size: 48px;
+    color: #fff;
+    border-radius: 50%;
+    justify-content: center;
+    align-items: center;
+    display: flex;
+  }
+
   .popup {
     box-sizing: border-box;
     // height: 800px;

src/apps/AppCooperationPropaganda/addPropaganda.vue

@@ -0,0 +1,19 @@
+<template>
+  <div class="addPropaganda"></div>
+</template>
+
+<script>
+export default {
+  name: "addPropaganda",
+  data() {
+    return {}
+  },
+  methods: {},
+  onShow() {},
+  
+}
+</script>
+
+<style>
+
+</style>