diantou/src_product/iam/audit/workbench/iam-frame-content.vue

<template>
  <div :class="$style.content">
    <a-card size="small" :bordered="false" :class="[$style.top, 'sd-has-table']">
      <todo-tabs />
    </a-card>
    <a-row :class="$style.bottom">
      <a-card size="small" :bordered="false" :class="[$style.top, 'sd-has-table']">
        <!-- 审计项目 -->
        <my-project />
      </a-card>
    </a-row>
    <a-row v-if="showCase || showDispute" :class="$style.bottom">
      <a-col
        v-if="showCase"
        :class="{
          [$style.bottomL]: showCase && showDispute,
          [$style.bottom]: showCase && !showDispute,
        }"
      >
        <a-card size="small" :bordered="false" :class="[$style.top, 'sd-has-table']">
          <!-- 在办案件 -->
          <my-case />
        </a-card>
      </a-col>
      <a-col
        v-if="showDispute"
        :class="{
          [$style.bottomR]: showCase && showDispute,
          [$style.bottom]: !showCase && showDispute,
        }"
      >
        <a-card size="small" :bordered="false" :class="[$style.top, 'sd-has-table']">
          <!-- 在办纠纷 -->
          <my-dispute />
        </a-card>
      </a-col>
    </a-row>
    <a-row :gutter="[0, 0]" :class="$style.bottom">
      <a-col :class="$style.bottomL">
        <a-card size="small" :bordered="false" class="sd-has-table">
          <a-tabs v-model="type" class="sd-has-table">
            <span slot="tabBarExtraContent" :class="$style.morebtn" @click="moreClick"
              >查看更多 ></span
            >
            <a-tab-pane key="attention" tab="我的关注">
              <simple-list ref="attention" list-type="attention" />
            </a-tab-pane>
            <a-tab-pane key="application" tab="我的申请">
              <simple-list ref="application" list-type="application" />
            </a-tab-pane>
          </a-tabs>
        </a-card>
      </a-col>
      <a-col :class="$style.bottomR">
        <div :class="$style.box">
          <a-card :bordered="false" :class="$style.cardBody">
            <div slot="title">
              <a-icon
                type="bell"
                title="工作动态"
                @click="$router.push('/sd-frame/audit-information-list')"
              />
              工作动态
            </div>
            <div slot="extra">
              <a-icon
                slot="tabBarExtraContent"
                :class="$style.morebtn"
                type="ellipsis"
                @click="goMoreNews('audit-information-list')"
              />
            </div>
            <HomeTzggList :news-id="'gxjb'" type="getInformation" :max-results="4"></HomeTzggList>
          </a-card>
        </div>
      </a-col>
    </a-row>
  </div>
</template>

<script>
import axios from '@/common/services/axios-instance'
import simpleList from '@/todo/sd-todo-list-simple.vue'
import myCase from './case/law-my-case.vue'
import myDispute from './dispute/law-my-dispute.vue'
import todoTabs from './iam-todo-tabs.vue'
import myProject from './iam-my-project.vue'
import components from './_import-components/iam-frame-content-import'
import HomeTzggList from '../home/home-tzgg-list.vue'

export default {
  name: 'IamFrameContent',
  metaInfo: {
    title: '工作台',
  },
  components: {
    ...components,
    'todo-tabs': todoTabs,
    'my-project': myProject,
    'simple-list': simpleList,
    'my-case': myCase,
    'my-dispute': myDispute,
    HomeTzggList,
  },
  data() {
    return {
      type: 'attention',
      showCase: false,
      showDispute: false,
    }
  },
  created() {
    axios({
      method: 'post',
      url: 'api/xcoa-mobile/v1/iam-page/businessList',
      data: {
        columns: 'LAW_CASE_SHOW,LAW_DISPUTE_SHOW',
        expressions: [],
        formId: 'onlhead:00788856205141a18048cfb8b01b07e7',
        maxResults: 10,
        startPosition: 0,
      },
    })
      .then((res) => {
        if (res.data.data.length > 0) {
          this.showCase = res.data.data[0].LAW_CASE_SHOW === '显示'
          this.showDispute = res.data.data[0].LAW_DISPUTE_SHOW === '显示'
        } else {
          this.showCase = false
          this.showDispute = false
        }
        // 强制隐藏-36967 工作台多余内容请隐去
        this.showCase = false
        this.showDispute = false
      })
      .catch(() => {
        this.showCase = false
        this.showDispute = false
      })
  },
  methods: {
    moreClick() {
      if (this.type === 'attention') {
        this.$router.push({ path: 'sd-mycollect' })
      } else if (this.type === 'application') {
        this.$router.push({ path: 'sd-myapply' })
      }
    },
    goMoreNews(data) {
      const href = '#/sd-frame/' + data
      window.open(href, '_blank')
    },
  },
}
</script>

<style module lang="scss">
@use '@/common/design' as *;
$titlecolor: #333;
$iconfont: 20px;
.content {
  .morebtn {
    font-size: 14px;
    cursor: pointer;
  }

  height: auto;
  :global(.ant-card-head-title) {
    font-size: $font-size-base;
    font-weight: normal;
    color: $titlecolor;
  }
  .bottom {
    padding-top: $padding-lg;
    .bottom-l {
      float: left;
      width: calc(100% - 580px);
      height: 100%;
      padding-right: $padding-lg;
    }
    .bottom-r {
      float: left;
      width: 580px;
      height: 100%;
    }
  }
  .top {
    &:global(.sd-has-table) {
      min-height: calc(100% - 370px);
    }
  }
}
</style>