换版本

src/apps/AppCooperationPropaganda/sendScoped.vue

@@ -0,0 +1,164 @@
+<template>
+  <div class="sendScoped">
+    <div class="checkedBox">
+      <div class="item" v-for="(item,index) in checkList" :key="index" @click="checkBtn(item)">
+        <div class="left">
+          <icon type="success" size="18" v-if="item.checked"/>
+          <icon type="circle" size="18" v-else />
+          <div class="title">{{ item.name }}</div>
+        </div>
+        <div class="right" v-if="item.vlaue != '0'">
+          <div v-if="item.value == '1' && deptSelect.length">已选择{{ deptSelect.length }}个部门</div>
+          <div v-if="item.value == '2' && girdSelect.length">已选择{{ girdSelect.length }}个网格</div>
+          <u-icon name="arrow-right" color="#CCD0D3"></u-icon>
+        </div>
+      </div>
+    </div>
+
+    <AiConsole />
+
+    <div class="btn">
+      <div class="submitBtn" @click="submit">确定</div>
+    </div>
+  </div>
+</template>
+
+<script>
+export default {
+  name: 'sendScoped',
+  data() {
+    return {
+      value: '',
+      checkList: [
+        { name: '全部居民群', checked: true, value: '0'},
+        { name: '按部门选择', checked: false, value: '1'},
+        { name: '按网格选择', checked: false, value: '2' }
+      ],
+      showContent: false,
+      sendType: '',
+      deptSelect: [],
+      girdSelect: [],
+      sendScope: '0',
+      girdListIds: [],
+      deptListIds: [],
+      wxGroups: [],
+      groupNames: [],
+    }
+  },
+  methods: {
+    checkBtn(e) {
+      this.checkList.forEach(v=> v.checked = false)
+      e.checked = true
+      if(e.value == '1' || e.value == '2') {
+        uni.navigateTo({url: `./scopedSelect?type=${e.value}&sendType=${this.sendType}`})
+      }
+      this.sendScope = e.value
+    },
+    submit() {
+      this.getWxGroups()
+      uni.setStorageSync('sendScope', this.sendScope)
+      uni.navigateBack({
+        // success: () => {
+        //   uni.$emit("checkedScope",{ sendScope: this.sendScope });
+        // }
+      })
+    },
+    getWxGroups() {
+      this.$http.post(`/app/appmasssendingtask/queryWxGroups?sendScope=${this.sendScope}`,
+       null,
+      {
+        data: {
+          filterCriteria: this.girdListIds.join(',') || this.deptListIds.join(',')
+        },
+        headers: {'Content-Type': 'application'},
+        transformRequest: [function(data) {
+          return data.filterCriteria
+        }]
+      }).then(res => {
+        if (res.code === 0) {
+          this.wxGroups = res.data
+        }
+      })
+
+      // {
+      //   filterCriteria: ''
+
+      // }).then(res => {
+      //   if (res.code === 0) {
+      //     this.wxGroups = res.data
+      //   }
+      // })
+    },
+  },
+  onLoad(o) {
+    this.sendType = o.type;
+    document.title = "选择发送范围"
+    this.sendScope = uni.getStorageSync('sendScope') || ''
+    this.checkList.forEach(i=> {
+      return {
+        name: i.name,
+        value: i.value, 
+        // checked: this.sendScope.find(v=>(i.value==v))
+      }
+    })
+    
+  },
+  onShow() {
+    uni.$on("girdList",res => {
+      this.girdListIds = res.map(e=>e.id)
+    })
+    uni.$on("deptList",res => {
+      this.deptListIds = res.map(e=>e.id)
+    })
+  }
+}
+</script>
+<style lang="scss" scoped>
+.sendScoped {
+  .checkedBox {
+    background: #FFF;
+    padding: 0 32px;
+    box-sizing: border-box;
+    .item {
+      display: flex;
+      justify-content: space-between;
+      border-bottom: 1px solid #DDD;
+      padding: 30px 0;
+      box-sizing: border-box;
+      .left,
+      .right {
+        display: flex;
+        align-items: center;
+        .title {
+          margin-left: 12px;
+        }
+      }
+    }
+  }
+  
+
+
+  .btn {
+    position: fixed;
+    bottom: 0;
+    left: 0;
+    background: #FFF;
+    display: flex;
+    width: 100%;
+    height: 128px;
+    padding: 24px 32px;
+    box-sizing: border-box;
+
+    .submitBtn {
+      flex: 1;
+      height: 80px;
+      line-height: 80px;
+      text-align: center;
+      border-radius: 8px;
+      border: 2px solid #CCCCCC;
+      background: #1365DD;
+      color: #FFF;
+    }
+  }
+}
+</style>