quickapp_front/src/views/Index/index.ux

<import name="home-page" src="../Home/index.ux"></import>
<import name="category-page" src="../Category/index.ux"></import>
<import name="shelf-page" src="../Shelf/index.ux"></import>
<import name="my-page" src="../My/index.ux"></import>
<import name="leader-board" src="../Leaderboard/index.ux"></import>
<import name="sign-page" src="../../components/sign/index.ux"></import>
<import name="short-page" src="../../components/short/index.ux"></import>
<import name="policy-page" src="../../components/yinsi/policy.ux"></import>
<template>
  <stack class="stack-wrap">
    <div class="index-wrap">
      <tabs class="tab-content" onchange="tabbarChange" index="{{current}}">
        <tab-content>
          <shelf-page @change="pageTohome" tabindex="{{current}}"></shelf-page>
          <home-page @change="pageSwitch" tabindex="{{current}}"></home-page>
          <category-page tabindex="{{current}}"></category-page>
          <my-page @customer="openCustomer" tabindex="{{current}}"></my-page>
        </tab-content>
      </tabs>
      <div class="fixed-tabbar">
        <image src="../../assets/imgs/shadow.png" class="shadow"></image>
        <div class="tabbar-item__wrap">
          <block for="tab in tabbar">
            <div class="tabbar-item " @click="tabbarChange(tab)">
              <image
                src="{{tab.index === current ? tab.active_icon : tab.icon}}"
              ></image>
              <text
                class="{{tab.index === current ? 'tabbar-name__cur' : ''}}"
                >{{ tab.name }}</text
              >
            </div>
          </block>
        </div>
      </div>
    </div>
    <stack>
      <!-- <image src="../../assets/imgs/sign_show.png" class="sign-icon" @click="changeSignPop"> </image> -->
      <image
        src="../../assets/imgs/rukou.png"
        class="sign-icon"
        @click="goTask"
        if="{{home_show}}"
      >
      </image>

      <sign-page if="{{showSignPop}}"></sign-page>
      <short-page
        if="{{!showActivitys && showShortPop}}"
        @addshort="shortEnd"
      ></short-page>
      <div class="stack-popup" @click="closeWrap" if="showPopup">
        <div class="customer-popup">
          <text class="title">联系客服</text>
          <text class="desc">
            复制微信号或者保存二维码到本地至微信添加客服好友
          </text>
          <image src="{{cutomerQrcode}}" @longpress="saveImg"></image>
          <div class="duplication">
            <text class="duplication-text">微信号:{{ cutomerName }}</text
            ><text class="duplication-button" @click="duplication">复制</text>
          </div>
        </div>
      </div>
      <div
        class="mask"
        @click="closeAcitivity"
        if="{{showActivitys && home_alert}}"
      >
        <image
          src="{{home_alert.img}}"
          class="banner"
          @click="goActicity"
        ></image>
        <image
          src="../../assets/imgs/pop_close.png"
          class="close-pop"
          @click="closeAcitivity"
        ></image>
      </div>
    </stack>
    <block if="display">
      <policy-page @change="dispatchEvent"></policy-page>
    </block>
  </stack>
</template>

<script>
import clipboard from '@system.clipboard'
import prompt from '@system.prompt'
import device from '@system.device'
import storage from '@system.storage'
import it from '../../helper/interface.js'
import { getCustomQrcode, userAddDsktop, getUserInfo } from '../../api/index.js'
import { downImg, getStore, getAppConfig } from '../../api/utils.js'
import router from '@system.router'
let getConfig
export default {
  public: {
    curPage: 1,
    push_id: '',
    bid: '',
    chapter_id: '',
    send_order_id: '',
    link_url: ''
  },
  protected: {
    current: 0,
    user: {}
  },
  home_alert: [],
  private: {
    tabbar: [
      {
        name: '书架',
        title: '我的书架',
        icon: '../../assets/imgs/shelf.png',
        active_icon: '../../assets/imgs/shelf_choose.png',
        index: 0
      },
      {
        name: '书城',
        title: '天天好书',
        icon: '../../assets/imgs/home.png',
        active_icon: '../../assets/imgs/home_choose.png',
        index: 1
      },
      {
        name: '分类',
        title: '分类',
        icon: '../../assets/imgs/classify.png',
        active_icon: '../../assets/imgs/classify_choose.png',
        index: 2
      },
      {
        name: '我的',
        title: '个人中心',
        icon: '../../assets/imgs/my.png',
        active_icon: '../../assets/imgs/my_choose.png',
        index: 3
      }
    ],
    // current: 0,
    showPopup: false,
    showActivitys: false,
    showShortPop: false,
    showSignPop: false,
    home_show: 0,
    home_alert: null,
    back_alert: 0,
    isInit: false,
    display: false,
  },
  async onInit() {
    let isFromPush = false
    this.$on('dispathEvt', this.changeSignPop)
    this.$watch('current', 'watchCurrent')
    if (this.push_id) {
      await storage.set({ key: 'push_id', value: this.push_id })
    }
    if (this.send_order_id) {
      await storage.set({ key: "send_order_id", value: this.send_order_id });
    } else {
      let send_order_id = (await storage.get({ key: "send_order_id" })).data;
      if (send_order_id) this.send_order_id = send_order_id;
    }
    //获取当前是否隐私弹窗
    let showPolicy = (await storage.get({ key: "agreeFlag" })).data;
    if (!this.send_order_id && !showPolicy) this.display = true;

    //今日已签到过不在弹框签到

    if (this.curPage && this.curPage > 0) {
      this.current = this.curPage
    }
    getConfig = getAppConfig(this)
    let { home_show } = await getConfig('task_center')
    this.home_show = home_show
    let { home_alert } = await getConfig('position')
    if (home_alert.length > 0) {
      this.home_alert = home_alert[0]
      this.showActivitys = true
    }
    let { sign_out_app_show } = await getConfig('add_desk_alert')
    this.back_alert = sign_out_app_show
    this.getCoustom()
    this.getUser()
    this.current = 1;
  },
  goActicity() {
    router.push({
      uri: '/views/Activity',
      params: this.home_alert.params
    })
  },
  showActivity() {
    this.showActivitys = true
  },
  closeAcitivity() {
    this.showActivitys = false
  },
  dispatchEvent(evt) {
    this.display = evt.detail.display
    this.save()
  },
  save() {
    storage.set({
      key: 'agreeFlag',
      value: 'agree',
    })
  },
  toMyRead(evt) {
    console.log(evt.detail.count)
  },
  async onShow() {
    const hasInit = this.$app.getAppData('hasInit')
    if (hasInit) {
      this.$broadcast('refreshData', { current: this.current })
    }
    it.getShortCut(value => {
      this.showShortPop = !value

      if (value) {
        this.$app.$def.data.backClickCount = 1
      } else {
        this.$app.$def.data.backClickCount = 0
      }
    })
    this.$app.setAppData('hasInit', true)
  },
  shortEnd(value) {
    if (value.detail.msg) {
      prompt.showToast({ message: '用户禁止创建' })
    } else if (value.detail.installed) {
      prompt.showToast({ message: '添加桌面成功！请前往任务中心领取奖励' })
    }
    this.showShortPop = !value.detail.installed
  },
  watchCurrent(i) {
    console.log('watching', i)
    this.current = i
  },
  async getUser() {
    let user = await getUserInfo()
    this.user = user
    this.isInit = true
    if (this.send_order_id && this.link_url) {
      let params = {
        push_id: this.push_id,
        bid: this.bid,
        chapter_id: this.chapter_id,
        send_order_id: this.send_order_id
      }
      setTimeout(() => {
        router.push({
          uri: this.link_url,
          params: params
        })
      }, 800)
    }
  },
  goTask() {
    router.push({
      uri: '/views/Task'
    })
  },
  onBackPress() {
    // 退出逻辑
    if (this.$app.$def.data.backClickCount === 0 && this.back_alert == 1) {
      this.$app.$def.data.backClickCount++
      this.$app.$def.createShortcut()
      return true
    }
  },

  changeShortCut() {
    this.showShortPop = false
  },
  async getCoustom() {
    userAddDsktop(this.$app.$def.data.backClickCount)
      .then(res => {
        //TODO 加桌后统计上报
      })
      .catch(r => {
        //TODO 失败后统计上报
      })
    let res = await getCustomQrcode()
    this.cutomerQrcode = res.url
    this.cutomerName = res.name
  },
  tabbarChange(tab) {
    this.current = tab.index
    //this.$page.setTitleBar({ text: this.tabbar[tab.index].title });
  },
  pageSwitch() {
    this.current = 0
  },
  pageTohome() {
    this.current = 1
  },
  changeSignPop() {
    this.showSignPop = !this.showSignPop
  },
  closeWrap() {
    this.showPopup = false
  },
  //复制客服微信
  duplication() {
    clipboard.set({
      text: this.cutomerName,
      success: function (data) {
        prompt.showToast({
          message: '复制成功！'
        })
      }
    })
  },
  //长按保存图片
  saveImg() {
    downImg(this.cutomerQrcode)
  },
  openCustomer() {
    this.showPopup = true
  }
}
</script>

<style lang="less">
@import '../../assets/less/index.less';
</style>