<template>
  <section class="comp">
    <AiResult v-if="error" status="error" :tips="error"/>
    <template v-else-if="isNormal">
      <component ref="currentTab" :is="currentTab.comp" :isNormal="isNormal"/>
      <AiTabbar :active.sync="active" :list="bottomBar"/>
    </template>
    <AiLoading v-else tips="居民管理加载中..."/>
  </section>
</template>
<script>
import {mapActions} from "vuex";
import ResidentSta from "./components/residentSta";
import ResidentList from "./components/residentList";
import GroupList from "./components/groupList";

export default {
  name: "AppResident",
  appName: "居民群管理",
  components: {GroupList, ResidentList, ResidentSta},
  data() {
    return {
      error: "",
      active: 0,
      isNormal: false
    }
  },
  computed: {
    bottomBar() {
      const link = icon => `${this.$cdn}resident/${icon}.png`
      return [
        {text: "统计分析", iconPath: "qwhome2", selectedIconPath: "qwhome1", comp: ResidentSta},
        {text: "居民列表", iconPath: "qwjmda1", selectedIconPath: "qwjmda2", comp: ResidentList},
        {text: "居民群列表", iconPath: "qwjmq1", selectedIconPath: "qwjmq2", comp: GroupList},
      ].map(e => ({
        ...e,
        iconPath: link(e.iconPath),
        selectedIconPath: link(e.selectedIconPath)
      }))
    },
    currentTab() {
      return this.bottomBar?.[this.active] || {}
    }
  },
  methods: {
    ...mapActions(['injectJWeixin', "wxInvoke"]),

  },
  created() {
    if (this.$route.hash == "#dev") {
      this.isNormal = true
    } else this.injectJWeixin(["getContext", "getCurExternalChat"]).then(() => {
      this.wxInvoke(['getContext', {}, res => {
        if (res.err_msg == "getContext:ok") {
          if (res.entry == 'normal') this.isNormal = true
          else this.wxInvoke(['getCurExternalChat', {}, res => {
            if (res?.err_msg == 'getCurExternalChat:ok') {
              wx.redirectTo({
                url: "./groupResident"
              })
            } else {
              wx.redirectTo({
                url: "./resident"
              })
            }
          }])
        } else {
          this.error = "wxwork:获取进入场景失败"
        }
      }])
    }).catch(() => {
      this.error = "应用加载失败"
    })
  },
  onReachBottom() {
    if (typeof this.$refs?.currentTab?.reachBottom == 'function') this.$refs?.currentTab.reachBottom()
  }
}
</script>
<style lang="scss" scoped>
.comp {
  height: 100%;

  ::v-deep .u-tabbar__content__item {
    padding: 0;

    .u-icon__img {
      height: 44px !important;
      width: 44px !important;
    }

    .u-tabbar__content__item__text {
      margin-top: 4px;
      font-size: 22px;
    }
  }
}
</style>
