<template>
  <div id="category">
    <!--头部-->
    <!-- <Header/> -->
    <div class="header-title">
      <span class="header-title-return-back" @click="returnClick"><van-icon name="arrow-left" /></span>
      <div class="header-title-name-bold">监控台</div>
    </div>

    <div v-if="pageLoading == true" style="padding-bottom: 50px;">
      <div>
        <van-dropdown-menu active-color="#1989fa" :closeOnClickOutside=false>
          <van-dropdown-item title="风险类型" ref="type">
            <div style="margin: 10px 10px 0 10px;">
              <!--              <van-tree-select :items="items" :active-id="1" :main-active-index="0" @click-nav="onNav" @click-item="onItem" />-->
              <van-picker show-toolbar :columns="items" cancel-button-text="" confirm-button-text=""
                @cancel="onRegionCancel" @confirm="onRegionConfirm" />
            </div>
          </van-dropdown-item>
        </van-dropdown-menu>
      </div>
      <div v-if="typeName === '工商风险'" v-for="(item, index) in companyChangeList" :key="index">
        <van-cell-group>
          <van-cell clickable @click="monitorType(item)" style="padding-bottom: 20px">
            <template #icon>
              <div class="card-icon" v-if="item.colorNum == 1" :style="{ backgroundColor: '#2372eb' }"><van-icon
                  name="newspaper-o" /></div>
              <div class="card-icon" v-if="item.colorNum == 2" :style="{ backgroundColor: '#ee8c15' }"><van-icon
                  name="newspaper-o" /></div>
              <div class="card-icon" v-if="item.colorNum == 3" :style="{ backgroundColor: '#11c95f' }"><van-icon
                  name="newspaper-o" /></div>
              <div class="card-icon" v-if="item.colorNum == 4" :style="{ backgroundColor: '#e21183' }"><van-icon
                  name="newspaper-o" /></div>
              <div class="card-icon" v-if="item.colorNum == 5" :style="{ backgroundColor: '#fde809' }"><van-icon
                  name="newspaper-o" /></div>
              <div class="card-icon" v-if="item.colorNum == 6" :style="{ backgroundColor: '#17b9d7' }"><van-icon
                  name="newspaper-o" /></div>
              <div class="card-icon" v-if="item.colorNum == 7" :style="{ backgroundColor: '#db2c2c' }"><van-icon
                  name="newspaper-o" /></div>
              <div class="card-icon" v-if="item.colorNum == 8" :style="{ backgroundColor: '#9232db' }"><van-icon
                  name="newspaper-o" /></div>
            </template>
            <template #title>
              <div style="margin-top: 15px;font-size: 15px;font-weight: bold;">{{ item.companyName }}</div>
            </template>
            <template #label>
              <van-tag color="#E9F1FD" text-color="#2372EB" style="margin-top: 10px;">工商风险</van-tag>
            </template>
          </van-cell>
        </van-cell-group>
        <div style="background-color: #fff;overflow: hidden;">
          <div class="firm-info">
            <van-grid :column-num="2">
              <van-grid-item style="width: 50%;flex-basis: 50% !important;word-break: break-all;padding-left: 10px;">
                <div class="van-item-style">变更前:</div>
                <div v-html="item.beforestr" class="fs-14 cl-595959 fw-bold" :class="[item.isShowAll ? '' : 'slText']">
                </div>
              </van-grid-item>
              <van-grid-item style="width: 50%;flex-basis: 50% !important;word-break: break-all;padding-right: 10px">
                <div class="van-item-style">变更后:</div>
                <div v-html="item.afterstr" class="fs-14 cl-595959 fw-bold" :class="[item.isShowAll ? '' : 'slText']">
                </div>
              </van-grid-item>
              <div class="djzk_box" v-if="item.beforeContent.length > 18 || item.afterContent.length > 18">
                <div class="djzk" @click="handleZk(item)" v-if="!item.isShowAll">...展开对比</div>
                <div class="djzk" @click="handleSq(item)" v-if="item.isShowAll">...收起对比</div>
              </div>
            </van-grid>
          </div>
        </div>
      </div>
      <div v-if="typeName === '司法风险'" v-for="(item, index) in monitorNewsList" :key="index">
        <van-cell-group>
          <van-cell clickable @click="monitorType(item)" style="padding-bottom: 20px">
            <template #icon>
              <div class="card-icon" v-if="item.colorNum == 1" :style="{ backgroundColor: '#2372eb' }"><van-icon
                  name="newspaper-o" /></div>
              <div class="card-icon" v-if="item.colorNum == 2" :style="{ backgroundColor: '#ee8c15' }"><van-icon
                  name="newspaper-o" /></div>
              <div class="card-icon" v-if="item.colorNum == 3" :style="{ backgroundColor: '#11c95f' }"><van-icon
                  name="newspaper-o" /></div>
              <div class="card-icon" v-if="item.colorNum == 4" :style="{ backgroundColor: '#e21183' }"><van-icon
                  name="newspaper-o" /></div>
              <div class="card-icon" v-if="item.colorNum == 5" :style="{ backgroundColor: '#fde809' }"><van-icon
                  name="newspaper-o" /></div>
              <div class="card-icon" v-if="item.colorNum == 6" :style="{ backgroundColor: '#17b9d7' }"><van-icon
                  name="newspaper-o" /></div>
              <div class="card-icon" v-if="item.colorNum == 7" :style="{ backgroundColor: '#db2c2c' }"><van-icon
                  name="newspaper-o" /></div>
              <div class="card-icon" v-if="item.colorNum == 8" :style="{ backgroundColor: '#9232db' }"><van-icon
                  name="newspaper-o" /></div>
            </template>
            <template #title>
              <div v-if="typeValue === '失信信息'" style="margin-top: 15px;font-size: 15px;font-weight: bold;">{{
                item.companyName }}</div>
              <div v-if="typeValue === '被执行人信息'" style="margin-top: 15px;font-size: 15px;font-weight: bold;">{{
                item.companyName }}</div>
              <div v-if="typeValue === '裁判文书'" style="margin-top: 15px;font-size: 15px;font-weight: bold;">{{
                item.caseName }}</div>
              <div v-if="typeValue === '法院公告'" style="margin-top: 15px;font-size: 15px;font-weight: bold;">{{
                item.companyName }}</div>
              <div v-if="typeValue === '限制高消费'" style="margin-top: 15px;font-size: 15px;font-weight: bold;">{{
                item.peopleenforced }}</div>
            </template>
            <template #label>
              <van-tag v-if="typeValue === '失信信息'" color="#E9F1FD" text-color="#2372EB"
                style="margin-top: 10px;">失信信息</van-tag>
              <van-tag v-if="typeValue === '被执行人信息'" color="#E9F1FD" text-color="#2372EB"
                style="margin-top: 10px;">被执行人信息</van-tag>
              <van-tag v-if="typeValue === '裁判文书'" color="#E9F1FD" text-color="#2372EB"
                style="margin-top: 10px;">裁判文书</van-tag>
              <van-tag v-if="typeValue === '法院公告'" color="#E9F1FD" text-color="#2372EB"
                style="margin-top: 10px;">法院公告</van-tag>
              <van-tag v-if="typeValue === '限制高消费'" color="#E9F1FD" text-color="#2372EB"
                style="margin-top: 10px;">限制高消费</van-tag>
            </template>
          </van-cell>
        </van-cell-group>
        <div style="background-color: #fff;overflow: hidden;">
          <van-grid v-if="typeValue === '被执行人信息'" class="van-item" :column-num="1">
            <van-grid-item style="font-size: 15px;">
              <div>
                <span style="font-weight: bold;">案号：</span>
                <span style="color: #646566;">{{ item.anNo }}</span>
              </div>
              <div style="margin-top: 5px;">
                <span style="font-weight: bold;">立案时间：</span>
                <span style="color: #646566;">{{ item.lianDate }}</span>
              </div>
              <div style="margin-top: 5px;">
                <span style="font-weight: bold;">执行法院：</span>
                <span style="color: #646566;">{{ item.executeGov }}</span>
              </div>
              <div style="margin-top: 5px;">
                <span style="font-weight: bold;">被执行人：</span>
                <span style="color: #646566;">{{ item.name }}</span>
              </div>
            </van-grid-item>
          </van-grid>
          <van-grid v-if="typeValue === '失信信息'" class="van-item" :column-num="1">
            <van-grid-item style="font-size: 15px;">
              <div>
                <span style="font-weight: bold;">案号：</span>
                <span style="color: #646566;">{{ item.anNo }}</span>
              </div>
              <div style="margin-top: 5px;">
                <span style="font-weight: bold;">案由：</span>
                <span style="color: #646566;">{{ item.actionremark }}</span>
              </div>
              <div style="margin-top: 5px;">
                <span style="font-weight: bold;">立案时间：</span>
                <span style="color: #646566;">{{ item.lianDate }}</span>
              </div>
            </van-grid-item>
          </van-grid>
          <van-grid v-if="typeValue === '裁判文书'" class="van-item" :column-num="1">
            <van-grid-item style="font-size: 15px;">
              <div>
                <span style="font-weight: bold;">案号：</span>
                <span style="color: #646566;">{{ item.caseNo }}</span>
              </div>
              <div style="margin-top: 5px;">
                <span style="font-weight: bold;">案由：</span>
                <span style="color: #646566;">{{ item.caseReason }}</span>
              </div>
              <div style="margin-top: 5px;">
                <span style="font-weight: bold;">裁定时间：</span>
                <span style="color: #646566;">{{ item.judgeDate }}</span>
              </div>
            </van-grid-item>
          </van-grid>
          <van-grid v-if="typeValue === '法院公告'" class="van-item" :column-num="1">
            <van-grid-item style="font-size: 15px;">
              <div>
                <span style="font-weight: bold;">案号：</span>
                <span style="color: #646566;">{{ item.caseNo }}</span>
              </div>
              <div style="margin-top: 5px;">
                <span style="font-weight: bold;">内容：</span>
                <span style="color: #646566;">{{ item.content }}</span>
              </div>
              <div style="margin-top: 5px;">
                <span style="font-weight: bold;">刊登时间：</span>
                <span style="color: #646566;">{{ item.publishDate }}</span>
              </div>
            </van-grid-item>
          </van-grid>
          <van-grid v-if="typeValue === '限制高消费'" class="van-item" :column-num="1">
            <van-grid-item style="font-size: 15px;">
              <div>
                <span style="font-weight: bold;">案号：</span>
                <span style="color: #646566;">{{ item.casenumber }}</span>
              </div>
              <div style="margin-top: 5px;">
                <span style="font-weight: bold;">案由：</span>
                <span style="color: #646566;">{{ item.subjectmatter }}</span>
              </div>
              <div style="margin-top: 5px;">
                <span style="font-weight: bold;">发布：</span>
                <span style="color: #646566;">{{ item.inserttime }}</span>
              </div>
            </van-grid-item>
          </van-grid>
        </div>
      </div>
      <div v-if="typeName === '舆情信息'" v-for="(item, index) in monitorNewsList" :key="index">
        <van-cell-group>
          <van-cell clickable @click="monitorType(item)" style="padding-bottom: 20px">
            <template #icon>
              <div class="card-icon" v-if="item.colorNum == 1" :style="{ backgroundColor: '#2372eb' }"><van-icon
                  name="newspaper-o" /></div>
              <div class="card-icon" v-if="item.colorNum == 2" :style="{ backgroundColor: '#ee8c15' }"><van-icon
                  name="newspaper-o" /></div>
              <div class="card-icon" v-if="item.colorNum == 3" :style="{ backgroundColor: '#11c95f' }"><van-icon
                  name="newspaper-o" /></div>
              <div class="card-icon" v-if="item.colorNum == 4" :style="{ backgroundColor: '#e21183' }"><van-icon
                  name="newspaper-o" /></div>
              <div class="card-icon" v-if="item.colorNum == 5" :style="{ backgroundColor: '#fde809' }"><van-icon
                  name="newspaper-o" /></div>
              <div class="card-icon" v-if="item.colorNum == 6" :style="{ backgroundColor: '#17b9d7' }"><van-icon
                  name="newspaper-o" /></div>
              <div class="card-icon" v-if="item.colorNum == 7" :style="{ backgroundColor: '#db2c2c' }"><van-icon
                  name="newspaper-o" /></div>
              <div class="card-icon" v-if="item.colorNum == 8" :style="{ backgroundColor: '#9232db' }"><van-icon
                  name="newspaper-o" /></div>
            </template>
            <template #title>
              <div style="margin-top: 15px;font-size: 15px;font-weight: bold;">{{ item.companyName }}</div>
            </template>
            <template #label>
              <van-tag color="#E9F1FD" text-color="#2372EB" style="margin-top: 10px;">舆情信息</van-tag>
            </template>
          </van-cell>
        </van-cell-group>
        <div style="background-color: #fff;overflow: hidden;">
          <van-grid class="van-item" :column-num="1">
            <van-grid-item style="font-size: 15px;">
              <div style="padding-top:10px" class="fw-bold mg-lt-16">{{ item.title }}</div>
              <van-cell-group>
                <van-cell :title="item.source" :value="item.publishTime" />
              </van-cell-group>
            </van-grid-item>
          </van-grid>
        </div>
      </div>
      <div v-if="typeName === '经营动态'" v-for="(item, index) in monitorNewsList" :key="index">
        <van-cell-group>
          <van-cell clickable @click="monitorType(item)" style="padding-bottom: 20px">
            <template #icon>
              <div class="card-icon" v-if="item.colorNum == 1" :style="{ backgroundColor: '#2372eb' }"><van-icon
                  name="newspaper-o" /></div>
              <div class="card-icon" v-if="item.colorNum == 2" :style="{ backgroundColor: '#ee8c15' }"><van-icon
                  name="newspaper-o" /></div>
              <div class="card-icon" v-if="item.colorNum == 3" :style="{ backgroundColor: '#11c95f' }"><van-icon
                  name="newspaper-o" /></div>
              <div class="card-icon" v-if="item.colorNum == 4" :style="{ backgroundColor: '#e21183' }"><van-icon
                  name="newspaper-o" /></div>
              <div class="card-icon" v-if="item.colorNum == 5" :style="{ backgroundColor: '#fde809' }"><van-icon
                  name="newspaper-o" /></div>
              <div class="card-icon" v-if="item.colorNum == 6" :style="{ backgroundColor: '#17b9d7' }"><van-icon
                  name="newspaper-o" /></div>
              <div class="card-icon" v-if="item.colorNum == 7" :style="{ backgroundColor: '#db2c2c' }"><van-icon
                  name="newspaper-o" /></div>
              <div class="card-icon" v-if="item.colorNum == 8" :style="{ backgroundColor: '#9232db' }"><van-icon
                  name="newspaper-o" /></div>
            </template>
            <template #title>
              <div v-if="typeValue === '行政许可'" style="margin-top: 15px;font-size: 15px;font-weight: bold;">{{ item.name }}
              </div>
              <div v-if="typeValue === '招投标信息'" style="margin-top: 15px;font-size: 15px;font-weight: bold;">{{
                item.companyname }}</div>
              <div v-if="typeValue === '进出口信息'" style="margin-top: 15px;font-size: 15px;font-weight: bold;">{{
                item.companyName }}</div>
              <div v-if="typeValue === '融资信息'" style="margin-top: 15px;font-size: 15px;font-weight: bold;">{{
                item.companyName }}</div>
            </template>
            <template #label>
              <van-tag v-if="typeValue === '行政许可'" color="#E9F1FD" text-color="#2372EB"
                style="margin-top: 10px;">行政许可</van-tag>
              <van-tag v-if="typeValue === '招投标信息'" color="#E9F1FD" text-color="#2372EB"
                style="margin-top: 10px;">招投标信息</van-tag>
              <van-tag v-if="typeValue === '进出口信息'" color="#E9F1FD" text-color="#2372EB"
                style="margin-top: 10px;">进出口信息</van-tag>
              <van-tag v-if="typeValue === '融资信息'" color="#E9F1FD" text-color="#2372EB"
                style="margin-top: 10px;">融资信息</van-tag>
            </template>
          </van-cell>
        </van-cell-group>
        <div style="background-color: #fff;overflow: hidden;">
          <van-grid class="van-item" :column-num="1">
            <van-grid-item v-if="typeValue === '行政许可'" style="font-size: 15px;">
              <div class="fs-14 mg-lt-16 mg-bt-5 mg-tp-8">决定文书：{{ item.caseNo }}</div>
              <div class="fs-14 mg-lt-16 mg-bt-5 mg-tp-8">决定日期：{{ item.lianDate }}</div>
              <div class="fs-14 mg-lt-16 mg-bt-5 mg-tp-8">许可机关：{{ item.executeGov }}</div>
              <!--              <div style="padding-bottom: 10px" class="fs-14 mg-lt-16 mg-bt-5 mg-tp-8">许可内容：{{ item.content }}</div>-->
            </van-grid-item>
            <van-grid-item v-if="typeValue === '招投标信息'" style="font-size: 15px;">
              <div class="fs-14 mg-lt-16 mg-bt-5 mg-tp-8">招投标类型：{{ item.tendertype }}</div>
              <div class="fs-14 mg-lt-16 mg-bt-5 mg-tp-8">发布日期：{{ item.timerelease }}</div>
              <div class="fs-14 mg-lt-16 mg-bt-5 mg-tp-8">招采单位：{{ item.tenderee }}</div>
              <div class="fs-14 mg-lt-16 mg-bt-5 mg-tp-8">中标单位：{{ item.wintenderer }}</div>
              <div style="padding-bottom: 10px" class="fs-14 mg-lt-16 mg-bt-5 mg-tp-8">中标金额：{{ item.winbidprice }}元</div>
            </van-grid-item>
            <van-grid-item v-if="typeValue === '进出口信息'" style="font-size: 15px;">
              <div class="fs-14 mg-lt-16 mg-bt-5 mg-tp-8">注册日期：{{ item.regDate }}</div>
              <div class="fs-14 mg-lt-16 mg-bt-5 mg-tp-8">注册海关：{{ item.regGov }}</div>
              <div style="padding-bottom: 10px" class="fs-14 mg-lt-16 mg-bt-5 mg-tp-8">行政区划：{{ item.administrativeArea }}元
              </div>
            </van-grid-item>
            <van-grid-item v-if="typeValue === '融资信息'" style="font-size: 15px;">
              <div class="fs-14 mg-lt-16 mg-bt-5 mg-tp-8">融资日期：{{ item.date }}</div>
              <div class="fs-14 mg-lt-16 mg-bt-5 mg-tp-8">融资金额：{{ item.amount }}</div>
              <div class="fs-14 mg-lt-16 mg-bt-5 mg-tp-8">投资方：{{ item.investment }}</div>
              <div class="fs-14 mg-lt-16 mg-bt-5 mg-tp-8">产品名称：{{ item.productName }}</div>
              <div style="padding-bottom: 10px" class="fs-14 mg-lt-16 mg-bt-5 mg-tp-8">估值：{{ item.valuation }}</div>
            </van-grid-item>
          </van-grid>
        </div>
      </div>
    </div>
    <van-loading style="text-align: center;margin-top: 50%" v-if="pageLoading == false" />
  </div>
</template>

<script>
// 1. 引入组件
import Header from "./components/header/Header"
import ContentView from "./components/contentView/ContentView";
import {
  postCompanyChangePage,
  postMonitorNewsPage,
  postMonitorShixinPage,
  postMonitorZhixingPage,
  postMonitorJudgementPage,
  postMonitorCourtPage,
  postMonitorLimitHighconsumePage,
  postMonitorCreditChinaLicensePage,
  postMonitorBiddingBaseinfoPage,
  postMonitorImportExportDetailPage,
  postMonitorFinancingPage
} from "@/service/api/category";

import { Button, Col, Row, Icon, Tag, Checkbox, CheckboxGroup, Toast, DropdownMenu, DropdownItem, TreeSelect, Picker, Calendar, Search } from 'vant';

export default {
  name: "MonitorStation",
  data() {
    return {
      pageLoading: true,
      items: [
        { text: '工商风险', children: [{ text: '全部', id: 1 }, { text: '法定代表人变更', id: 2 }, { text: '主要人员变更', id: 3 }, { text: '股东变更', id: 4 }, { text: '注册资本变更', id: 5 }, { text: '企业类型变更', id: 6 }] },
        { text: '司法风险', children: [{ text: '失信信息', id: 7 }, { text: '被执行人信息', id: 8 }, { text: '裁判文书', id: 9 }, { text: '法院公告', id: 10 }, { text: '限制高消费', id: 11 }] },
        { text: '舆情信息', children: [{ text: '' }] },
        { text: '经营动态', children: [{ text: '行政许可', id: 12 }, { text: '招投标信息', id: 13 }, { text: '进出口信息', id: 14 }, { text: '融资信息', id: 15 }] }
      ],
      typeName: '工商风险',
      typeValue: '',
      companyChangeList: [],
      monitorNewsList: [],
      currentPage: 1,
      currentYuqingPage: 1,
      currentShixinPage: 1,
      currentZhixingPage: 1,
      currentWenshuPage: 1,
      currentFayuanPage: 1,
      currentXiaofeiPage: 1,
      currentXingzhengPage: 1,
      currentZhaobiaoPage: 1,
      currentJinchuPage: 1,
      currentRongziPage: 1,
      loading: false,
      isEndLoading: false,
      userId: '',
    }
  },
  components: {
    Header,
    ContentView,
    VanButton: Button,
    VanRow: Row,
    VanCol: Col,
    VanIcon: Icon,
    VanTag: Tag,
    VanCheckbox: Checkbox,
    VanCheckboxGroup: CheckboxGroup,
    VanDropdownMenu: DropdownMenu,
    VanDropdownItem: DropdownItem,
    VanToast: Toast,
    VanTreeSelect: TreeSelect,
    VanPicker: Picker,
    VanCalendar: Calendar,
    VanSearch: Search,

  },

  mounted() {
    window.addEventListener('scroll', this.scrollBottom);
    this.postCompanyChange();
  },
  destroyed() {
    window.removeEventListener('scroll', this.scrollBottom)
  },
  created() {
    window.scrollTo(0, 0)
    this.userId = localStorage.getItem('userId')
    sessionStorage.removeItem('jumpType')
  },
  methods: {
    // 查工商信息
    async postCompanyChange() {
      let params = {
        changeType: this.typeValue,
        companyId: sessionStorage.getItem('monitorId'),
        pageSize: 10,
        pageNum: this.currentPage
      }
      let result = await postCompanyChangePage(params);
      if (result) {
        this.pageLoading = true;
        if (this.loading) {
          let arr = []
          arr = this.companyChangeList.concat(result.records);
          arr.forEach(item => {
            item.afterstr = []
            item.beforestr = []
            for (let i = 0; i < item.beforeContent.length; i++) {
              for (let j = 0; j < item.afterContent.length; j++) {
                if (i == j) {
                  if (item.beforeContent[i] !== item.afterContent[j]) {
                    item.afterstr.push(`<span style="color:red">${item.afterContent[j]}</span>`)
                    item.beforestr.push(`<span style="color:rgb(22,140,237)">${item.beforeContent[i]}</span>`)
                  } else {
                    item.afterstr.push(item.afterContent[j])
                    item.beforestr.push(item.beforeContent[i])
                  }
                }

              }
            }
          })
          this.companyChangeList = arr.map(item => {
            return {
              afterContent: item.afterContent,
              beforeContent: item.beforeContent,
              changeDate: item.changeDate,
              projectName: item.projectName,
              afterstr: item.afterstr.join(''),
              beforestr: item.beforestr.join(''),
              isShowAll: false
            }
          })
        } else {
          let arr = []
          arr = result.records
          arr.forEach(item => {
            item.afterstr = []
            item.beforestr = []
            for (let i = 0; i < item.beforeContent.length; i++) {
              for (let j = 0; j < item.afterContent.length; j++) {
                if (i == j) {
                  if (item.beforeContent[i] !== item.afterContent[j]) {
                    item.afterstr.push(`<span style="color:red">${item.afterContent[j]}</span>`)
                    item.beforestr.push(`<span style="color:rgb(22,140,237)">${item.beforeContent[i]}</span>`)
                  } else {
                    item.afterstr.push(item.afterContent[j])
                    item.beforestr.push(item.beforeContent[i])
                  }
                }

              }
            }
          })
          this.companyChangeList = arr.map(item => {
            return {
              afterContent: item.afterContent,
              beforeContent: item.beforeContent,
              changeDate: item.changeDate,
              projectName: item.projectName,
              afterstr: item.afterstr.join(''),
              beforestr: item.beforestr.join(''),
              isShowAll: false
            }
          })
        }
        if (this.companyChangeList.length < result.total) {
          this.isEndLoading = false;
        } else {
          this.isEndLoading = true;
        }
        this.loading = false;
      }
    },
    handleZk(item) {
      item.isShowAll = true
    },
    handleSq(item) {
      item.isShowAll = false
    },
    // 查舆情信息
    async postMonitorNews() {
      let params = {
        companyId: sessionStorage.getItem('monitorId'),
        pageSize: 10,
        pageNum: this.currentYuqingPage,
      }
      let result = await postMonitorNewsPage(params);
      // this.monitorNewsList = result.records;
      if (result) {
        this.pageLoading = true;
        if (this.loading) {
          this.monitorNewsList = this.monitorNewsList.concat(result.records);
        } else {
          this.monitorNewsList = result.records;
        }
        if (this.monitorNewsList.length < result.total) {
          this.isEndLoading = false;
        } else {
          this.isEndLoading = true;
        }
        this.loading = false;
      }
    },
    // 查失信信息
    async postMonitorShixin() {
      let params = {
        companyId: sessionStorage.getItem('monitorId'),
        pageSize: 10,
        pageNum: this.currentShixinPage
      }
      let result = await postMonitorShixinPage(params);
      // this.monitorNewsList = result.records;
      if (result) {
        this.pageLoading = true;
        if (this.loading) {
          this.monitorNewsList = this.monitorNewsList.concat(result.records);
        } else {
          this.monitorNewsList = result.records;
        }
        if (this.monitorNewsList.length < result.total) {
          this.isEndLoading = false;
        } else {
          this.isEndLoading = true;
        }
        this.loading = false;
      }
    },
    // 查被执行人信息
    async postMonitorZhixing() {
      let params = {
        companyId: sessionStorage.getItem('monitorId'),
        pageSize: 10,
        pageNum: this.currentZhixingPage
      }
      let result = await postMonitorZhixingPage(params);
      // this.monitorNewsList = result.records;
      if (result) {
        this.pageLoading = true;
        if (this.loading) {
          this.monitorNewsList = this.monitorNewsList.concat(result.records);
        } else {
          this.monitorNewsList = result.records;
        }
        if (this.monitorNewsList.length < result.total) {
          this.isEndLoading = false;
        } else {
          this.isEndLoading = true;
        }
        this.loading = false;
      }
    },
    // 查裁判文书信息
    async postMonitorJudgement() {
      let params = {
        companyId: sessionStorage.getItem('monitorId'),
        pageSize: 10,
        pageNum: this.currentWenshuPage
      }
      let result = await postMonitorJudgementPage(params);
      // this.monitorNewsList = result.records;
      if (result) {
        this.pageLoading = true;
        if (this.loading) {
          this.monitorNewsList = this.monitorNewsList.concat(result.records);
        } else {
          this.monitorNewsList = result.records;
        }
        if (this.monitorNewsList.length < result.total) {
          this.isEndLoading = false;
        } else {
          this.isEndLoading = true;
        }
        this.loading = false;
      }
    },
    // 查法院公告信息
    async postMonitorCourt() {
      let params = {
        companyId: sessionStorage.getItem('monitorId'),
        pageSize: 10,
        pageNum: this.currentFayuanPage
      }
      let result = await postMonitorCourtPage(params);
      // this.monitorNewsList = result.records;
      if (result) {
        this.pageLoading = true;
        if (this.loading) {
          this.monitorNewsList = this.monitorNewsList.concat(result.records);
        } else {
          this.monitorNewsList = result.records;
        }
        if (this.monitorNewsList.length < result.total) {
          this.isEndLoading = false;
        } else {
          this.isEndLoading = true;
        }
        this.loading = false;
      }
    },
    // 查限制高消费信息
    async postLimitHighconsume() {
      let params = {
        companyId: sessionStorage.getItem('monitorId'),
        pageSize: 10,
        pageNum: this.currentXiaofeiPage
      }
      let result = await postMonitorLimitHighconsumePage(params);
      // this.monitorNewsList = result.records;
      if (result) {
        this.pageLoading = true;
        if (this.loading) {
          this.monitorNewsList = this.monitorNewsList.concat(result.records);
        } else {
          this.monitorNewsList = result.records;
        }
        if (this.monitorNewsList.length < result.total) {
          this.isEndLoading = false;
        } else {
          this.isEndLoading = true;
        }
        this.loading = false;
      }
    },
    // 查行政许可信息
    async postCreditChinaLicense() {
      let params = {
        companyId: sessionStorage.getItem('monitorId'),
        pageSize: 10,
        pageNum: this.currentXingzhengPage
      }
      let result = await postMonitorCreditChinaLicensePage(params);
      // this.monitorNewsList = result.records;
      if (result) {
        this.pageLoading = true;
        if (this.loading) {
          this.monitorNewsList = this.monitorNewsList.concat(result.records);
        } else {
          this.monitorNewsList = result.records;
        }
        if (this.monitorNewsList.length < result.total) {
          this.isEndLoading = false;
        } else {
          this.isEndLoading = true;
        }
        this.loading = false;
      }
    },
    // 查招投标信息
    async postBiddingBaseinfo() {
      let params = {
        companyId: sessionStorage.getItem('monitorId'),
        pageSize: 10,
        pageNum: this.currentZhaobiaoPage
      }
      let result = await postMonitorBiddingBaseinfoPage(params);
      // this.monitorNewsList = result.records;
      if (result) {
        this.pageLoading = true;
        if (this.loading) {
          this.monitorNewsList = this.monitorNewsList.concat(result.records);
        } else {
          this.monitorNewsList = result.records;
        }
        if (this.monitorNewsList.length < result.total) {
          this.isEndLoading = false;
        } else {
          this.isEndLoading = true;
        }
        this.loading = false;
      }
    },
    // 查进出口信息
    async postImportExportDetail() {
      let params = {
        companyId: sessionStorage.getItem('monitorId'),
        pageSize: 10,
        pageNum: this.currentJinchuPage
      }
      let result = await postMonitorImportExportDetailPage(params);
      // this.monitorNewsList = result.records;
      if (result) {
        this.pageLoading = true;
        if (this.loading) {
          this.monitorNewsList = this.monitorNewsList.concat(result.records);
        } else {
          this.monitorNewsList = result.records;
        }
        if (this.monitorNewsList.length < result.total) {
          this.isEndLoading = false;
        } else {
          this.isEndLoading = true;
        }
        this.loading = false;
      }
    },
    // 查融资信息
    async postImportFinancing() {
      let params = {
        companyId: sessionStorage.getItem('monitorId'),
        pageSize: 10,
        pageNum: this.currentRongziPage
      }
      let result = await postMonitorFinancingPage(params);
      // this.monitorNewsList = result.records;
      if (result) {
        this.pageLoading = true;
        if (this.loading) {
          this.monitorNewsList = this.monitorNewsList.concat(result.records);
        } else {
          this.monitorNewsList = result.records;
        }
        if (this.monitorNewsList.length < result.total) {
          this.isEndLoading = false;
        } else {
          this.isEndLoading = true;
        }
        this.loading = false;
      }
    },
    onRegionCancel() {
      this.$refs.type.toggle(false);
    },
    onRegionConfirm(selectedValues) {
      console.log(selectedValues)
      this.$refs.type.toggle(false);
      this.typeName = selectedValues[0];
      this.typeValue = selectedValues[1];
      if (this.typeValue == '全部') {
        this.typeValue = '';
      }
      if (this.typeName == '工商风险') {
        this.currentPage = 1;
      } else if (this.typeName == '舆情信息') {
        this.currentYuqingPage = 1;
      } else if (this.typeName == '司法风险' && this.typeValue == '失信信息') {
        this.currentShixinPage = 1;
      } else if (this.typeName == '司法风险' && this.typeValue == '被执行人信息') {
        this.currentZhixingPage = 1;
      } else if (this.typeName == '司法风险' && this.typeValue == '裁判文书') {
        this.currentWenshuPage = 1;
      } else if (this.typeName == '司法风险' && this.typeValue == '法院公告') {
        this.currentFayuanPage = 1;
      } else if (this.typeName == '司法风险' && this.typeValue == '限制高消费') {
        this.currentXiaofeiPage = 1;
      } else if (this.typeName == '经营动态' && this.typeValue == '行政许可') {
        this.currentXingzhengPage = 1;
      } else if (this.typeName == '经营动态' && this.typeValue == '招投标信息') {
        this.currentZhaobiaoPage = 1;
      } else if (this.typeName == '经营动态' && this.typeValue == '进出口信息') {
        this.currentJinchuPage = 1;
      } else if (this.typeName == '经营动态' && this.typeValue == '融资信息') {
        this.currentRongziPage = 1;
      } else {
        this.currentPage = 1;
      }
      this.changeTypeOk();
    },


    changeTypeOk() {
      this.pageLoading = false;
      if (this.typeName == '工商风险') {
        this.postCompanyChange();
      } else if (this.typeName == '舆情信息') {
        this.postMonitorNews();
      } else if (this.typeName == '司法风险' && this.typeValue == '失信信息') {
        this.postMonitorShixin();
      } else if (this.typeName == '司法风险' && this.typeValue == '被执行人信息') {
        this.postMonitorZhixing();
      } else if (this.typeName == '司法风险' && this.typeValue == '裁判文书') {
        this.postMonitorJudgement();
      } else if (this.typeName == '司法风险' && this.typeValue == '法院公告') {
        this.postMonitorCourt();
      } else if (this.typeName == '司法风险' && this.typeValue == '限制高消费') {
        this.postLimitHighconsume();
      } else if (this.typeName == '经营动态' && this.typeValue == '行政许可') {
        this.postCreditChinaLicense();
      } else if (this.typeName == '经营动态' && this.typeValue == '招投标信息') {
        this.postBiddingBaseinfo();
      } else if (this.typeName == '经营动态' && this.typeValue == '进出口信息') {
        this.postImportExportDetail();
      } else if (this.typeName == '经营动态' && this.typeValue == '融资信息') {
        this.postImportFinancing();
      } else {
        this.postCompanyChange();
      }
    },

    // 滚动到页面底部时，请求内容
    scrollBottom() {
      let scrollTop = document.documentElement.scrollTop || document.body.scrollTop  //页面滚动的高度
      let clientHeight = document.documentElement.clientHeight  //可视区域高度
      let scrollHeight = document.documentElement.scrollHeight  //可滚动内容的高度
      let bottomOfWindow = scrollTop + clientHeight + 1000 >= scrollHeight    //是否滚动到底部
      //loading 和 this.tableData.length和this.total是自己的判断条件
      if (scrollTop !== 0 && bottomOfWindow && !this.loading) {
        this.loading = true;
        if (this.typeName == '工商风险') {
          this.currentPage += 1;
        } else if (this.typeName == '舆情信息') {
          this.currentYuqingPage += 1;
        } else if (this.typeName == '司法风险' && this.typeValue == '失信信息') {
          this.currentShixinPage += 1;
        } else if (this.typeName == '司法风险' && this.typeValue == '被执行人信息') {
          this.currentZhixingPage += 1;
        } else if (this.typeName == '司法风险' && this.typeValue == '裁判文书') {
          this.currentWenshuPage += 1;
        } else if (this.typeName == '司法风险' && this.typeValue == '法院公告') {
          this.currentFayuanPage += 1;
        } else if (this.typeName == '司法风险' && this.typeValue == '限制高消费') {
          this.currentXiaofeiPage += 1;
        } else if (this.typeName == '经营动态' && this.typeValue == '行政许可') {
          this.currentXingzhengPage += 1;
        } else if (this.typeName == '经营动态' && this.typeValue == '招投标信息') {
          this.currentZhaobiaoPage += 1;
        } else if (this.typeName == '经营动态' && this.typeValue == '进出口信息') {
          this.currentJinchuPage += 1;
        } else if (this.typeName == '经营动态' && this.typeValue == '融资信息') {
          this.currentRongziPage += 1;
        } else {
          this.currentPage += 1;
        }
        this.scrollOk();
      }
    },

    scrollOk() {
      if (this.typeName == '工商风险') {
        this.postCompanyChange();
      } else if (this.typeName == '舆情信息') {
        this.postMonitorNews();
      } else if (this.typeName == '司法风险' && this.typeValue == '失信信息') {
        this.postMonitorShixin();
      } else if (this.typeName == '司法风险' && this.typeValue == '被执行人信息') {
        this.postMonitorZhixing();
      } else if (this.typeName == '司法风险' && this.typeValue == '裁判文书') {
        this.postMonitorJudgement();
      } else if (this.typeName == '司法风险' && this.typeValue == '法院公告') {
        this.postMonitorCourt();
      } else if (this.typeName == '司法风险' && this.typeValue == '限制高消费') {
        this.postLimitHighconsume();
      } else if (this.typeName == '经营动态' && this.typeValue == '行政许可') {
        this.postCreditChinaLicense();
      } else if (this.typeName == '经营动态' && this.typeValue == '招投标信息') {
        this.postBiddingBaseinfo();
      } else if (this.typeName == '经营动态' && this.typeValue == '进出口信息') {
        this.postImportExportDetail();
      } else if (this.typeName == '经营动态' && this.typeValue == '融资信息') {
        this.postImportFinancing();
      } else {
        this.postCompanyChange();
      }
    },

    monitorType(type) {
      sessionStorage.setItem('jumpType', 'monitor')
      if (this.typeName == '工商风险') {
        sessionStorage.setItem('changeDetail', JSON.stringify(type))
        this.$router.push({ path: '/dashboard/BusinessChangeDetail' })
      } else if (this.typeName == '司法风险' && this.typeValue == '失信信息') {
        sessionStorage.setItem('PromiseInfoData', JSON.stringify(type))
        this.$router.push({ path: '/dashboard/PromiseInfoDetail' })
      } else if (this.typeName == '司法风险' && this.typeValue == '裁判文书') {
        sessionStorage.setItem('JudgmentsDetailData', JSON.stringify(type))
        this.$router.push({ path: '/dashboard/JudgmentsDetail' })
      } else if (this.typeName == '司法风险' && this.typeValue == '被执行人信息') {
        sessionStorage.setItem('judgmentDebtorInfoData', JSON.stringify(type))
        this.$router.push({ path: '/dashboard/JudgmentDebtorInfoDetail' })
      } else if (this.typeName == '司法风险' && this.typeValue == '法院公告') {
        sessionStorage.setItem('courtAnnouncementsData', JSON.stringify(type))
        this.$router.push({ path: '/dashboard/CourtAnnouncementsDetail' })
      } else if (this.typeName == '舆情信息') {
        sessionStorage.setItem('OpinionReputationData', JSON.stringify(type))
        this.$router.push({ path: '/dashboard/OpinionReputation' })
      }
      console.log(type)
      // if (type === 'b') {
      //   this.$router.push({path: 'Judicature'})
      // } else if (type === 'c') {
      //   this.$router.push({path: 'OpinionReputation'})
      // } else if (type === 'd') {
      //   this.$router.push({path: 'OtherRisks'})
      // } else if (type === 'a') {
      //   console.log(111)
      //   this.$router.push({path: 'IndustrialChange'})
      // }
    },
    returnClick() {
      if (sessionStorage.getItem('isFromHome') == 'isYes') {
        sessionStorage.setItem('tabBarActiveIndex', '0');
        this.$router.push({ path: '/dashboard/home' })
      } else {
        sessionStorage.setItem('tabBarActiveIndex', '1');
        this.$router.push({ path: '/category' })
      }
    },
  },
  beforeDestroy() {
    // PubSub.unsubscribe('categoryAddToCart');
  }
}
</script>

<style lang="less" scoped>
.header-title {
  height: 46px;
  width: 100%;
  background-color: #fff;
  text-align: center;
}

.header-title-btn {
  border-radius: 15px;
  margin-top: 0.5rem;
  background-color: #f4f4f4;
  align-items: center;
  justify-content: center;
  display: inline-flex;
}

.buttonClick {
  color: #595959 !important;
  background-color: #f4f4f4;
  border: 1px solid #f4f4f4;
}

.van-item-style {
  font-size: 15px;
  font-weight: bold;
  color: #96989e;
  margin-bottom: 5px;
}

.operate-btn {
  position: absolute;
  top: 13px;
  right: 20px;
  color: #2372EB;
  font-weight: bold;
  font-size: small;
}

.seven-add {
  font-size: 11px;
  padding: 1px 5px;
  color: #fff;
  background-color: #EE8C15;
  margin-top: 20px;
}

.manage-body {
  margin-top: 10px;
  background-color: #fff;
  padding: 20px 10px 0px 10px;
}

/deep/ .van-nav-bar__text {
  color: gray !important;
  font-weight: bold;
}

.icon-mg {
  margin-left: 3px;
}

.col-weight {
  font-weight: bold;
}

.card-icon {
  float: left;
  width: 2.5rem;
  height: 2.5rem;
  font-size: 1.7rem;
  border-radius: 5px;
  margin: 0 auto;
  text-align: center;
  margin-top: 20px;
  //background-color: #EE8C15;
  color: #fff;
  margin-right: 10px;
  line-height: 2.5rem;
}

/deep/ .van-card__thumb {
  width: 60px;
}

.search-btn {
  margin: 10px;
  font-size: 15px;
  color: #595959;
}

.van-item /deep/ .van-grid-item__content--center {
  -webkit-align-items: left;
  align-items: normal;
  margin-left: 10px;
}

/deep/ .van-grid-item__content {
  padding-top: 3px !important;
  background-color: #fafbfd;
}

/deep/ .van-dropdown-menu__bar--opened {
  z-index: 10 !important;
}

/deep/ .van-button--mini {
  height: 28px !important;
  font-size: 14px !important;
}

.bg-2372eb {
  background: #2372EB;
}

.bg-ee8c15 {
  background: #ee8c15;
}

.bg-11c95f {
  background: #11c95f;
}

.bg-e21183 {
  background: #e21183;
}

.bg-fde809 {
  background: #fde809;
}

.bg-17b9d7 {
  background: #17b9d7;
}

.bg-db2c2c {
  background: #db2c2c;
}

.bg-9232db {
  background: #9232db;
}

.bg-8c8c8c {
  background: #8c8c8c;
}
.slText {
  height: 38px;
  overflow: hidden;
}

.zkText {
  height: 80px;
}

.djzk_box {
  width: 100%;
}

.djzk {
  color: rgb(22, 140, 237);
  width: 100%;
  text-align: center;
}
</style>