huimv-baqing/ruoyi-jiaoyi/pages/order/index.vue

<template>
  <view class="tab-page">
    <SupplierOrderPanel
      v-if="isSupplier && isLoggedIn"
      ref="orderPanel"
    />
    <DistributorOrderPanel
      v-else-if="isDistributor && isLoggedIn"
      ref="orderPanel"
    />
    <GuestView
      v-else-if="!isLoggedIn"
      hint="登录后查看交易订单"
      @login="goLogin"
    />
  </view>
</template>

<script>
import SupplierOrderPanel from '@/components/supplier/order-panel.vue'
import DistributorOrderPanel from '@/components/distributor/order-panel.vue'
import GuestView from '@/components/partner/guest-view.vue'
import { useUserStore } from '@/store/user'
import { isEffectiveDistributorRole, isEffectiveSupplierRole } from '@/utils/partnerRole'
import { refreshTabPanelOnShow } from '@/utils/tabPanel'

export default {
  components: {
    SupplierOrderPanel,
    DistributorOrderPanel,
    GuestView
  },
  data() {
    return {
      isLoggedIn: false,
      isSupplier: false,
      isDistributor: false
    }
  },
  onShow() {
    refreshTabPanelOnShow(this, {
      refreshRole: this.refreshRole,
      refName: 'orderPanel',
      shouldReload: () => this.isLoggedIn && (this.isSupplier || this.isDistributor)
    })
  },
  methods: {
    refreshRole() {
      const userStore = useUserStore()
      const roles = userStore.state.roles
      this.isLoggedIn = userStore.isLoggedIn()
      this.isSupplier = isEffectiveSupplierRole(roles)
      this.isDistributor = isEffectiveDistributorRole(roles)
    },
    goLogin() {
      uni.navigateTo({ url: '/pages/login/index' })
    }
  }
}
</script>

<style lang="scss" scoped>
@import '@/styles/tab-page.scss';
</style>