index.vue 3.71 KB
<template>
  <div className="approve-page px-4 bg-white">
    <a-tabs :default-active-key="role === ROLE.FINANCE ? '7' : '1'" v-model:activeKey="currentKey">
      <a-tab-pane key="1" tab="字段待审核" v-if="role !== ROLE.FINANCE">
        <FieldPanel />
      </a-tab-pane>
      <a-tab-pane key="3" tab="利润分析待审核" v-if="role !== ROLE.FINANCE">
        <ProfitPanel />
      </a-tab-pane>
      <a-tab-pane key="5" tab="项目报告书待审核" v-if="role !== ROLE.FINANCE">
        <ReportPanel />
      </a-tab-pane>
      <a-tab-pane
        key="7"
        tab="应收款待审核"
        v-if="
          role == ROLE.FINANCE ||
          role == ROLE.ADMIN ||
          role == ROLE.BUSINESS ||
          role == ROLE.TRACKER
        "
      >
        <ReceivePanel />
      </a-tab-pane>
      <a-tab-pane
        key="9"
        tab="应付款待审核"
        v-if="
          role == ROLE.FINANCE ||
          role == ROLE.ADMIN ||
          role == ROLE.BUSINESS ||
          role == ROLE.TRACKER
        "
      >
        <PayPanel />
      </a-tab-pane>
      <a-tab-pane key="2" tab="字段已审核" v-if="role !== ROLE.FINANCE">
        <FieldPanel isApproved />
      </a-tab-pane>
      <a-tab-pane key="4" tab="利润分析已审核" v-if="role !== ROLE.FINANCE">
        <ProfitPanel isApproved />
      </a-tab-pane>
      <a-tab-pane key="6" tab="项目报告书已审核" v-if="role !== ROLE.FINANCE">
        <ReportPanel isApproved />
      </a-tab-pane>
      <a-tab-pane
        key="8"
        tab="应收款已审核"
        v-if="
          role == ROLE.FINANCE ||
          role == ROLE.ADMIN ||
          role == ROLE.BUSINESS ||
          role == ROLE.TRACKER
        "
      >
        <ReceivePanel isApproved />
      </a-tab-pane>
      <a-tab-pane
        key="10"
        tab="应付款已审核"
        v-if="
          role == ROLE.FINANCE ||
          role == ROLE.ADMIN ||
          role == ROLE.BUSINESS ||
          role == ROLE.TRACKER
        "
      >
        <PayPanel isApproved />
      </a-tab-pane>
    </a-tabs>
  </div>
</template>
<script lang="ts">
  import { computed, defineComponent, onMounted, ref, watchEffect } from 'vue';
  import { Tabs } from 'ant-design-vue';
  import { ROLE } from '../order/type.d';
  import ReportPanel from './ReportPanel.vue';
  import ProfitPanel from './ProfitPanel.vue';
  import FieldPanel from './FieldPanel.vue';
  import ReceivePanel from './ReceivePanel.vue';
  import PayPanel from './PayPanel.vue';
  import { useOrderStoreWithOut } from '/@/store/modules/order';
  import { useUserStoreWithOut } from '/@/store/modules/user';

  const orderStore = useOrderStoreWithOut();
  const userStore = useUserStoreWithOut();
  const user = userStore.getUserInfo;
  const role = computed(() => {
    return user?.roleSmallVO?.code;
  });

  export default defineComponent({
    components: {
      [Tabs.name]: Tabs,
      [Tabs.TabPane.name]: Tabs.TabPane,
      ReportPanel,
      FieldPanel,
      ProfitPanel,
      ReceivePanel,
      PayPanel,
    },
    setup() {
      const checkedKeys = ref<Array<string | number>>([]);
      const currentKey = ref('1');

      onMounted(async () => {
        await orderStore.getDict();
      });
      watchEffect(() => {
        if (role.value == ROLE.FINANCE) {
          currentKey.value = '7';
        }
      });

      return {
        checkedKeys,
        currentKey,
        role,
        ROLE,
      };
    },
  });
</script>

<style>
  .approve-page .vben-basic-table .ant-table-wrapper {
    margin-bottom: 0;
  }

  .approve-page .vben-basic-table-form-container {
    padding-right: 0;
    padding-left: 0;
  }

  .approve-page .vben-basic-table-form-container .ant-form {
    margin-bottom: 0;
    padding-top: 0;
  }
</style>