<template>
    <div class="autoBox box" style="min-height: 600px">
        <div class="crumbs">
            <el-breadcrumb separator="/" style="float: left; margin: 15px">
                <el-breadcrumb-item :to="{ path: 'home' }">{{
                        $t("common.Home")
                    }}
                </el-breadcrumb-item>
                <el-breadcrumb-item :to="{ path: 'realTimeInfo1' }">{{
                        $t("common.NewsData")
                    }}
                </el-breadcrumb-item>
                <el-breadcrumb-item>{{
                        informationgTypeDictsMap[initData.typeDict]
                    }}
                </el-breadcrumb-item>
            </el-breadcrumb>
        </div>
        <div style="justify-content: space-between; margin-top: 30px">
            <div
                style="margin-top: 20px; width: 73%; float: left; padding-left: 10px"
            >
                <div
                    style="
            line-height: 50px;
            color: #666;
            font-size: 28px;
            font-weight: 700;
          "
                >
                    <div style="margin: 0 10px; margin-bottom: 30px; text-align: center">
                        {{ initData.title }}
                    </div>
                </div>
                <div
                    style="
            margin: 0 20px;
            padding: 0 10px;
            line-height: 50px;
            color: #333;
            font-size: 15px;
            border-bottom: 1px solid #333;
          "
                >
          <span
          >{{ $t("common.ReleaseTime") }}：{{
                  formatDate(initData.publishDate)
              }}
            | {{ $t("common.Source") }}：{{ initData.auther }}</span
          >
                    <span
                        class="share cursor"
                        :style="ifcommon ? 'color: #66b1ff;' : ''"
                        style="margin-right: 20px; float: right"
                        @click="shareChange()"
                    >
            <i
                class="el-icon-star-off"
                :style="ifcommon ? 'color: #66b1ff;' : ''"
            ></i>
            {{ $i18n.locale == "zh" ? ifcommon ? "已收藏" : "收藏" : ifcommon ? "Already collected" : "Collection" }}
          </span>
                </div>
                <div style="padding: 0 20px;line-height: 40px;font-size: #666;vertical-align: top;"
                     :class="$i18n.locale == 'zh' ? 'content' : ''"
                     v-html="initData.contentHtml">

                </div>
                <!--                附件下载-->
                <div style="padding:0 20px;line-height: 40px;font-size: #666;margin-top: 20px;">
                    <div v-if="infoAttachments.length > 0" class="content">
                        <div v-for="(item,index) in infoAttachments">
                            <span>{{ $t('common.enclosure') }} {{ index + 1 }} ：</span>
                            <a style="cursor: pointer" @click="downloadEnclosure(item.attachmentName,item.attachmentSavePath)">{{ item.attachmentName }}</a>
                            <div style="display:inline-block;height: 40px;background-color: #fff;margin-left: 20px">
                                <a class="func example" style="margin-right: 15px;color: #0c27ff" @click="downloadEnclosure(item.attachmentName,item.attachmentSavePath)">{{ $t('common.download') }}</a>
                                <a class="func" @click="downloadP(item.attachmentSavePath)" style="color: #0c27ff">{{ $t('common.preview') }}</a>
                            </div>
                        </div>
                    </div>
                    <div v-else>
                        <div v-for="(item,index) in enclosureName" class="content">
                            <div v-if="enclosureName.length >0">
                                <span>{{ $t('common.enclosure') }} {{ index + 1 }} ：</span>
                                <a style="cursor: pointer" @click="downloadEnclosure()">{{ item }}</a>
                                <div style="display:inline-block;height: 50px;background-color: #fff;margin-left: 20px">
                                    <a class="func example" style="margin-right: 15px;color: #0c27ff" @click="downloadEnclosure()">{{$t('common.download')}}</a>
                                    <a class="func" @click="downloadEnclosure()" style="color: #0c27ff">{{$t('common.preview')}}</a>
                                </div>
                            </div>

                        </div>
                    </div>
                </div>
                <div style="margin: 10px 20px 0 20px;line-height: 24px;color: #888;padding-top: 10px;font-size: 14px;vertical-align: top;border-top: 1px dashed #000;">
                    {{ $t("common.contentisreproduced") }}
                </div>
                <div>
                    <div
                        style="
              color: #315090;
              margin-left: 20px;
              margin-right: 20px;
              margin-top: 20px;
              padding-bottom: 10px;
              border-bottom: 1px solid #869bb6;
              font-weight: 700;
            "
                    >
                        {{ $t("common.RelatedInformation") }}
                    </div>
                    <div
                        style="padding: 20px; height: 95px"
                        v-for="(item, index) in initList"
                        v-if="initData.id != item.id"
                        class="cursor"
                        @click="toView('realTimeInfoItemdetails', item.baseEntityId)"
                    >
                        <img
                            :src="'api/file/pub/' + item.pictureUrl"
                            alt=""
                            style="width: 126px; height: 82px; float: left"
                            v-if="item.pictureUrl"
                        />
                        <div
                            :style="item.pictureUrl ? 'width: 690px;' : 'width: 100%;'"
                            style="float: right; overflow: hidden"
                        >
                            <div
                                style="
                  color: #616161;
                  font-weight: 700;
                  font-size: 18px;
                  margin-bottom: 10px;
                "
                            >
                                {{ item.title }}
                            </div>
                            <div
                                style="
                  height: 60px;
                  overflow: hidden;
                  line-height: 29px;
                  color: #989898;
                  font-size: 15px;
                  -webkit-box-orient: vertical;
                  position: relative;
                  line-height: 1.4em;
                  overflow: hidden;
                  height: 2.8em;
                "
                                class="plate"
                                v-html="item.content"
                            ></div>
                            <div style="color: #dcdcdc; line-height: 38px">
                                <span>{{ item.auther ? item.auther : "" }}</span>
                                <span style="float: right; margin-right: 10px">{{
                                        formatDate(item.publishDate)
                                    }}</span>
                            </div>
                        </div>
                    </div>
                </div>
            </div>

            <!--最新推荐和排行-->
            <div style="width: 300px; float: left; margin-top: 59px">
                <div style="padding-top: 35px">
                    <!-- 热点新闻和最新推荐 -->
                    <div
                        style="
              color: #315090;
              margin-top: 20px;
              padding-bottom: 10px;
              border-bottom: 1px solid #869bb6;
              font-weight: 700;
            "
                    >
                        <div
                            class="newsTitle"
                            :class="titleIndex == 0 ? 'title1' : 'title2'"
                            @click="changeTitle(0)"
                            v-if="islogin"
                        >
                            {{ $t("common.IntelligentRecommendation") }}
                        </div>
                        <div
                            class="newsTitle"
                            :class="
                islogin ? (titleIndex == 1 ? 'title1' : 'title2') : 'title1'
              "
                            @click="changeTitle(1)"
                        >
                            {{ $t("common.hotnews") }}
                        </div>
                        <!--              {{$t('common.hotnews')}}-->
                    </div>
                    <!--热点新闻-->
                    <div
                        style="padding: 5px 0 0 0"
                        v-show="!islogin || titleIndex == 1"
                        v-for="(item, index) in hotNews"
                        class="cursor"
                        @click="toView('realTimeInfoItemdetails', item.baseEntityId)"
                    >
                        <div style="width: 100%">
                            <div
                                style="
                  color: #333;
                  font-size: 16px;
                  margin-bottom: 10px;
                  line-height: 29px;
                "
                            >
                                <i class="hotInfoIndex">{{ index + 1 }}</i> {{ item.title }}
                            </div>
                        </div>
                        <hr style="border-bottom: 1px solid #f5f6f7"/>
                    </div>
                </div>
                <!-- 最新推荐 -->
                <div
                    style="padding: 5px 0 0 0"
                    class="cursor"
                    v-show="islogin && titleIndex == 0"
                    v-for="(item, index) in newRecommonList"
                    @click="toView('realTimeInfoItemdetails', item.baseEntityId)"
                >
                    <div style="width: 100%">
                        <div
                            style="
                color: #333;
                font-size: 16px;
                margin-bottom: 10px;
                line-height: 29px;
              "
                        >
                            <span class="hotInfoIndex">{{ index + 1 }}</span> {{ item.title }}
                        </div>
                    </div>
                </div>

                <!-- 点击排行 -->
                <div>
                    <div
                        style="
              color: #2c558a;
              margin-top: 20px;
              padding-bottom: 10px;
              border-bottom: 1px solid #869bb6;
              font-weight: 700;
            "
                    >
                        {{ $t("common.ClickRank") }}
                        <div style="float: right; font-weight: 500">
              <span
                  @click="changeClikRange('1')"
                  :style="
                  curClickType == '1'
                    ? 'background-color: #0079ef;color:#fff'
                    : 'background-color: white;'
                "
                  style="cursor: pointer; padding: 5px 8px; border-radius: 8px"
              >{{ $t("common.infoDay") }}</span
              >
                            <span> • </span>
                            <span
                                @click="changeClikRange('2')"
                                :style="
                  curClickType == '2'
                    ? 'background-color: #0079ef;color:#fff'
                    : 'background-color: white;'
                "
                                style="cursor: pointer; padding: 5px 8px; border-radius: 8px"
                            >{{ $t("common.infoWeek") }}</span
                            >
                            <span> • </span>
                            <span
                                @click="changeClikRange('3')"
                                :style="
                  curClickType == '3'
                    ? 'background-color: #0079ef;color:#fff'
                    : 'background-color: white;'
                "
                                style="cursor: pointer; padding: 5px 8px; border-radius: 8px"
                            >{{ $t("common.infoMonth") }}</span
                            >
                        </div>
                    </div>
                    <div
                        style="padding: 5px 0 0 0"
                        class="cursor"
                        v-for="(item, index) in hitsList"
                        v-if="informationMap[item]"
                        @click="
              toView(
                'realTimeInfoItemdetails',
                informationMap[item].baseEntityId
              )
            "
                    >
                        <div style="width: 100%">
                            <div
                                style="
                  color: #333;
                  font-size: 16px;
                  margin-bottom: 10px;
                  line-height: 29px;
                "
                                v-if="!showMoreFlag && index < 5"
                            >
                                <span class="hotInfoIndex">{{ index + 1 }}</span>
                                {{ informationMap[item] ? informationMap[item].title : "" }}
                            </div>
                            <div
                                style="
                  color: #333;
                  font-size: 16px;
                  margin-bottom: 10px;
                  line-height: 29px;
                "
                                v-if="showMoreFlag"
                            >
                                <span class="hotInfoIndex">{{ index + 1 }}</span>
                                {{ informationMap[item] ? informationMap[item].title : "" }}
                            </div>
                        </div>
                    </div>
                    <span
                        style="display: block; text-align: right; color: #7d7de1"
                        class="cursor show-more dept-btn zk"
                        @click="showMore()"
                    >{{ !showMoreFlag ? $t("common.More") : $t("common.pickUp") }}
            <i
                :class="!showMoreFlag ? 'fa fa-angle-down' : 'fa fa-angle-up'"
            ></i>
          </span>
                </div>
                <!-- 资讯 -->
                <!-- <div style="position: relative;height:331px "
                      v-show="$i18n.locale=='zh'">
                    <img src="@/assets/img/realTimeInfo/zixun.png"
                        width="100%"
                        height="300px"
                        style="position: absolute;left: 0;top: 0;"
                        alt="">
                    <div style="color: #0091FF;margin-top: 20px;padding-bottom: 10px;position: absolute;left: 0;top: 0;
                          font-weight: 700;padding-left: 15px;">{{$t('common.News')}}
                    </div>
                    <div style="padding: 5px 0 0 15px;font-weight: normal;color: #333333;
                        line-height: 26px;font-size: 14px; position: absolute;left: 0;top: 50px;"
                        class="cursor">
                      基于智能爬虫和自动化翻译技术，以联合国环境署、环球时报、中华人民共和国商务部等
                      <span style="color: #0091FF;font-weight: 700;">1700</span>
                      余个全球主要新闻资讯
                      网站为数据来源，采集政治外交、经济社会、能源电力、气候环境等新闻资讯
                      <span style="color: #0091FF;font-weight: 700;">150</span>
                      万余条。
                    </div>
                    <div style="color: #0091FF;margin-top: 20px;padding-bottom: 1px;position: absolute;left: 0;top: 180px;
                        margin-left: 15px;font-size: 14px;border-bottom: 1px solid #0091FF;"
                        class="cursor"
                        @click="openPDF(1)">
                      资讯网站采集列表
                    </div>
                    <div style="color: #0091FF;margin-top: 20px;padding-bottom: 1px;position: absolute;left: 0;top: 210px;
                        margin-left: 15px;font-size: 14px;border-bottom: 1px solid #0091FF;"
                        class="cursor"
                        @click="openPDF(2)">
                      资讯分类
                    </div>
                  </div>
                  <div style="position: relative;height:279px "
                      v-show="$i18n.locale=='zh'">
                    <img src="@/assets/img/realTimeInfo/shuju.png"
                        width="100%"
                        height="300px"
                        style="position: absolute;left: 0;top: 0;"
                        alt="">
                    <div style="color: #0091FF;margin-top: 20px;padding-bottom: 10px;position: absolute;left: 0;top: 0;
                          font-weight: 700;padding-left: 15px;">{{$t('common.DataInformation')}}
                    </div>
                    <div style="padding: 5px 0 0 15px;font-weight: normal;color: #333333;
                        line-height: 26px;font-size: 14px; position: absolute;left: 0;top: 50px;"
                        class="cursor">
                      拓展经济社会、能源电力、气候环境、科技创新等数据采集范围，涵盖国际能源署、世界银行、非洲能源数据库、美国能源信息署等
                      <span style="color: #0091FF;font-weight: 700;">13</span>
                      个主要结构化数据源，采集与数据源同步更新的统计指标数据多达
                      <span style="color: #0091FF;font-weight: 700;">900</span>
                      余类、
                      <span style="color: #0091FF;font-weight: 700;">230</span>
                      亿余项。
                    </div>
                    <div style="color: #0091FF;margin-top: 20px;padding-bottom: 1px;position: absolute;left: 0;top: 200px;
                        margin-left: 15px;font-size: 14px;border-bottom: 1px solid #0091FF;"
                        class="cursor"
                        @click="openPDF(3)">
                      指标数据种类
                    </div>
                    <div style="color: #0091FF;margin-top: 20px;padding-bottom: 1px;position: absolute;left: 0;top: 230px;
                        margin-left: 15px;font-size: 14px;border-bottom: 1px solid #0091FF;"
                        class="cursor"
                        @click="openPDF(4)">
                      数据来源单位
                    </div>
                  </div> -->
            </div>
        </div>
        <div style="clear: both"></div>
        <el-dialog
            :title="$i18n.locale == 'zh' ? '提示' : 'Reminder'"
            :visible.sync="toViewLogin"
            :width="$i18n.locale == 'zh' ? '30%' : '40%'"
            :height="$i18n.locale == 'zh' ? '300px' : '386px'"
            :before-close="toViewLoginChange"
        >
            <div style="width: 100%; height: 100%">
                <img
                    src="@/assets/img/loginTips.png"
                    alt=""
                    style="width: 180px; height: 180px; margin-left: 20px"
                />
                <div
                    style="float: right; margin-right: 20px"
                    :style="
            $i18n.locale == 'zh'
              ? 'width: 49%;margin-top: 10px;'
              : 'width: 453px;margin-top: -25px;'
          "
                >
                    <div
                        style="
              font-size: 20px;
              font-weight: normal;
              color: #333333;
              font-family: HiraginoSansGB-W3, HiraginoSansGB;
              line-height: 40px;
            "
                    >
                        {{ $t("common.ReminderFirst") }}
                    </div>
                    <div
                        style="
              font-size: 16px;
              font-family: HiraginoSansGB-W3, HiraginoSansGB;
              font-weight: normal;
              color: #666666;
              line-height: 30px;
            "
                    >
                        {{ $t("common.ReminderSecond") }}
                        <span style="color: #0091ff; font-size: 18px">{{ num }}</span>
                        {{ $t("common.ReminderThird") }}
                    </div>
                    <div
                        style="
              font-size: 14px;
              font-family: HiraginoSansGB-W3, HiraginoSansGB;
              font-weight: normal;
              color: #666666;
              line-height: 30px;
            "
                    >
                        {{ $t("common.ReminderForth") }}
                    </div>
                    <div
                        style="
              font-size: 14px;
              font-family: HiraginoSansGB-W3, HiraginoSansGB;
              height: 33px;
              line-height: 60px;
              font-weight: normal;
              color: #0091ff;
            "
                    >
            <span
                style="margin-left: 40px"
                class="cursor"
                @click="toViewLoginCh('login')"
            >
              {{ $t("common.ReminderFifth") }}
            </span>
                        <span
                            style="margin-left: 10px"
                            class="cursor"
                            @click="toView('Register')"
                        >
              {{ $t("common.ReminderSixth") }}
            </span>
                    </div>
                </div>
            </div>
        </el-dialog>
    </div>
</template>
<script>
import {getInformationById, getRecommendInformationList,} from "@/api/baseUnitView";
import {getDicts} from "@/api/dict";
import {cmsInformationViews, getHotInformationList, addCollectInfo, getPortalMyCollecModel, topClickList,} from "@/api/baseUnitView";
import {saveFollowModel, getPortalMyCollectModelByResearch,} from "@/api/operation/basePortalModelFollowInfo";
import Base from "@/views/base/Base";
import {getToken, resetToken} from "@/utils/auth";
import {addIntegral} from "@/utils/toCompleteTask";
import {getUserPointPage} from "@/api/user";
import {getAttaments, download} from '@/api/file'

export default {
    name: "RealTimeInfoItemdetails",
    extends: Base,
    data() {
        return {
            initData: {},
            initList: [],
            hotNews: [],
            toViewLogin: false,
            timer: "",
            num: 0,
            page: {
                baseId: this.$route.query.key || this.$router.history.current.query,
            },
            list: "",
            ifcommon: false,
            informationgTypeDicts: [],
            hitsList: [],
            curClickType: "1",
            informationMap: {},
            showMoreFlag: false,
            topClickList: {},
            titleIndex: 0,
            newRecommonList: [],
            islogin: "",
            time: null,
            infoAttachments: [],
            enclosureName: [],
        };
    },
    created() {
    },
    computed: {
        informationgTypeDictsMap: function () {
            return this.informationgTypeDicts.array2Obj("value", "label");
        },
    },
    watch: {
        "$i18n.locale"() {
            this.getData();
            this.getHotList();
            this.getHitsList();
            this.getNewRecommed();
        },
        toViewLogin() {
            if (this.toViewLogin == true) {
                this.loginTipsChange();
            }
        },
    },
    mounted() {
      let locale = window.localStorage.getItem('locale')
      if(locale=='zh'){
        this.$i18n.locale='zh'
      }else{
        this.$i18n.locale='en'
      }
    //   let arr = navigator.language || navigator.userLanguage;
    //   console.log('----->',arr,locale);
    //   if(arr.substr(0, 2)=='zh'){
    //     this.$i18n.locale='zh'
    //   }else{
    //     this.$i18n.locale='en'
    //   }
        this.getData();
        this.cofLogin();
        this.getHotList();
        this.getHitsList();
        this.getNewRecommed();
        this.initData1();
    },
    methods: {
        initData1() {
            let token = getToken()
            if (token) {
                getUserPointPage().then((res) => {
                    if (res.data.umsUserPoints[0].pointStatus == "y") {
                        let integral = function () {
                            addIntegral("point_read_information", "2");
                        };
                        this.time = window.setTimeout(integral, 3000);
                    }
                });
            } else {
                return
            }

        },
        changeClikRange(clickType) {
            this.curClickType = clickType;
            this.hitsList = this.topClickList[this.curClickType];
        },
        showMore() {
            this.showMoreFlag = !this.showMoreFlag;
        },
        // 未登录跳转
        loginTipsChange() {
            const that = this;
            this.num = 5;
            clearInterval(that.timer);

            this.timer = setInterval(function () {
                if (that.num > 0) {
                    that.num--;
                } else {
                    if (that.toViewLogin == true) {
                        clearInterval(that.timer);
                        that.toViewLoginCh("login");
                    } else {
                        clearInterval(that.timer);
                    }
                }
            }, 1000);
        },
        // 判断未登录跳转是否关闭
        toViewLoginChange(done) {
            this.toViewLogin = false;
            this.num = 5;
            clearInterval(this.timer);
            this.$emit("LoginBack", false);
        },
        getHotList() {
            let list = {
                pageSize: 10,
                language: this.$i18n.locale.toUpperCase(),
                businessType: "information",
            };
            getHotInformationList(list).then((res) => {
                this.hotNews = res.data.cmsInformationView;
            });
        },
        getHitsList() {
            let list = {
                language: this.$i18n.locale.toUpperCase(),
            };
            topClickList(list).then((res) => {
                var data = res.data;
                if (data) {
                    this.topClickList = data.topClickList;
                    this.hitsList = this.topClickList[this.curClickType];
                    this.informationMap = data.informationMap;
                }
            });
        },
        //下载附件
        downloadEnclosure(fileName, path) {
            if (this.$Cookies.get("token")) {
                if (fileName && path) {
                    const link = document.createElement('a');
                    link.href = "api/file/pub/" + path;
                    link.download = fileName; //下载的文件名
                    link.click();
                }
            } else {
                this.toViewLogin = true;
            }
        },
        downloadP(url) {
            let a = document.createElement('a');
            a.href = "api/file/pub/" + url;
            a.click();
        },
        //获取附件
        getEnclosureList() {
            getAttaments({
                attachmentBusinessId: this.initData.id,
                attachmentBusinessType: 'cms_information_info'
            }).then(res => {
                var data = res.data;
                if (data && data.attachmentInfos) {
                    let attachments = [];
                    data.attachmentInfos.forEach((element, index) => {
                        attachments.push({
                            attachmentBusinessId: element.attachmentBusinessId,
                            attachmentId: element.id,
                            attachmentName: element.attachmentName,
                            attachmentSize: element.attachmentSize,
                            attachmentStatement: element.attachmentStatement,
                            attachmentSavePath: element.attachmentSavePath,
                            fileFunctionTypeDict: element.fileFunctionTypeDict,
                            sort: index,
                            status: element.status,
                            createBy: element.createBy,
                            createDate: element.createDate,
                        });
                    });
                    this.infoAttachments = attachments;
                }
            });
        },
        getData() {
            this.page.language = this.$i18n.locale.toUpperCase();
            getInformationById(this.page).then((res) => {
                this.initData = res.data.cmsInformationView;
                if (this.page.language === "EN" && this.initData.contentHtml) {
                    this.initData.contentHtml = this.initData.contentHtml.replaceAll(
                        /\r\n/g,
                        "</p><p>"
                    );
                    this.initData.contentHtml = this.initData.contentHtml.replaceAll(
                        /\n/g,
                        "</p><p>"
                    );
                    this.initData.contentHtml = this.initData.contentHtml.replaceAll(
                        "<p></p>",
                        ""
                    );
                }
                this.getRelevantList(
                    this.initData.typeDict,
                    this.$i18n.locale.toUpperCase()
                );
                this.getMyCollecModel(); // 获取用户是否收藏
                if (this.$Cookies.get('token')) {
                    this.getEnclosureList();//获取附件
                }else {
                    this.enclosureName = this.initData.remark ? this.initData.remark.split(',,') : [];
                }
                getDicts(
                    this.$i18n.locale.toUpperCase() == "ZH"
                        ? "DISPLAY_INFORMATION_SOURCE,CMS_INFORMATION_TYPE_DICT"
                        : "DISPLAY_INFORMATION_SOURCE,CMS_INFORMATION_TYPE_DICT_EN"
                ).then((res) => {
                    res.data[0].forEach((element) => {
                        if (this.initData.sourceDict == element.value) {
                            this.list = element.label;
                        }
                    });
                    this.informationgTypeDicts = res.data[1] || [];
                });
            });
        },
        getRelevantList(type, language) {
            let page = {
                typeDict: type,
                language: language,
                pageSize: 8,
                pageNo: 1,
                businessType: "information",
            };
            cmsInformationViews(page).then((res) => {
                this.initList = res.data.allDataList || [];
                this.initList.forEach((element) => {
                    element.content = element.content.replace(/<[^>]+>|&[^>]+;/g, "");
                    // let wtWork=this.wtWorkTaskInfo.workTaskDesc.replace(/<[^>]+>|&[^>]+;/g, "")
                });
            });
        },

        getMyCollecModel() {
            const that = this;
            if (this.$Cookies.get("token")) {
                let user = window.localStorage.getItem("user");
                var users = JSON.parse(user);

                var modelType = "message";
                var userId = users.userId;
                var modelId = that.initData.baseEntityId;
                getPortalMyCollectModelByResearch(modelId, modelType, userId).then(
                    (res) => {
                        that.ifcommon = res.data.result;
                    }
                );
            }
        },

        // 项目收藏改变
        shareChange() {
            // if (this.ifcommon) {
            //     this.Collection("uncollect");
            // } else {
            //     this.Collection("collect");
            // }
            if (!this.ifcommon) {
                this.Collection("collect");
            } else {
                this.Collection("uncollect");
            }
        },
        //收藏
        Collection: function (collectType) {
            let user = window.localStorage.getItem("user");
            if (!this.$Cookies.get("token")) {
                // this.$message.warning(this.$i18n.locale == 'zh' ? "请先登录" : "Please login first");
                this.toViewLogin = true;
            } else {
                var users = JSON.parse(user);
                var token = "" + getToken();
                this.userId = users.userId;
                var modelId = this.initData.baseEntityId;
                this.submitHandler((token) => {
                    addCollectInfo(modelId, "message", this.userId, collectType, token)
                        .then((res) => {
                            if (res.status == 200) {
                                if (!this.ifcommon) {
                                    this.$message({
                                        message:
                                            this.$i18n.locale == "zh" ? "已收藏" : "Liked of success",
                                        type: "success",
                                    });
                                } else if (this.ifcommon) {
                                    this.$message({
                                        message:
                                            this.$i18n.locale == "zh"
                                                ? "取消收藏"
                                                : "Cancel the like",
                                        type: "success",
                                    });
                                }
                            }
                            this.ifcommon = !this.ifcommon;
                            this.resetToken();
                        })
                        .catch((error) => {
                            this.resetToken();
                        });
                });
            }
        },
        toViewLoginCh(router) {
            clearInterval(this.timer);
            this.$router.push(router);
        },
        toView(router, json) {
            this.$store.commit("modify", router);
            window.localStorage.setItem("router", router);
            const {href} = this.$router.resolve({
                name: router,
                query: {
                    key: json,
                },
            });
            window.open(href, "_blank");
        },
        getIconUrl(url) {
            return require("@/assets/img/realTimeInfo/" + url);
        },
        screenBack(data) {
            console.log(data, "screenBackscreenBackscreenBackscreenBack");
        },
        screen(i) {
            this.index = i;
        },
        getInformation(num) {
            this.informationsClass = num;
        },
        //切换推荐和热点新闻
        changeTitle(i) {
            this.titleIndex = i;
        },
        //获取最新推荐
        getNewRecommed() {
            let list = {
                pageSize: this.$i18n.locale == "zh" ? 5 : 10,
                language: this.$i18n.locale.toUpperCase(),
                businessType: "information",
            };
            getRecommendInformationList(list).then((res) => {
                this.newRecommonList = res.data.cmsInformationView;
            });
        },
        cofLogin() {
            if (!this.$Cookies.get("token")) {
                this.islogin = false;
            } else {
                this.islogin = true;
            }
        },
    },
    // updated() {
    //   clearTimeout(this.time);
    // },
};
</script>

<!-- Add "scoped" attribute to limit CSS to this component only -->
<style scoped>
.box {
    margin-top: 10px;
    background: #fff;
    /* height: 500px; */
    padding: 20px 0;
}

.crumbs {
    margin-left: 20px;
    height: 30px;
}

body {
    margin: 0;
}

.swipers {
    position: absolute;
    top: 30px;
    left: 100px;
    width: 460px;
    height: 390px;
}

.details {
    position: absolute;
    top: 30px;
    left: 600px;
    width: 460px;
    height: 390px;
}

.swiper-container {
    width: 100%;
    height: 300px;
    margin-left: auto;
    margin-right: auto;
}

.swiper-slide {
    background-size: cover;
    background-position: center;
}

.gallery-top {
    height: 80%;
    width: 100%;
}

.gallery-thumbs {
    height: 20%;
    box-sizing: border-box;
    padding: 10px 0;
}

.gallery-thumbs .swiper-slide {
    width: 25%;
    height: 100%;
    opacity: 0.4;
}

.gallery-thumbs .swiper-slide-thumb-active {
    opacity: 1;
}

.initData_label {
    color: #6c8c9d;
    font-weight: 700;
    font-size: 18px;
    line-height: 42px;
}

.enterprise_style {
    line-height: 40px;
    color: #6c819d;
    /* padding-left: 100px; */
    font-size: 18px;
    /* font-weight: 700; */
    margin-top: 5px;
    margin-left: 100px;
    border-bottom: 1px solid #95d13e;
}

.enterprise_style_span {
    padding: 10px;
    text-align: center;
    height: 100%;
    background: #95d13e;
    color: #fff;
    /* border-bottom: 2px solid #6699ff; */
}

.enterprise_style_product tr {
    line-height: 30px;
    width: 100%;
    display: inline-block;
    border-bottom: 1px dashed #ccc;
    font-size: 14px;
    color: #6c819d;
    margin-bottom: 5px;
}

.recommend {
    margin-top: 15px;
    margin-left: 100px;
}

.recommend li {
    display: inline-block;
    width: 170px;
    /* height: 130px; */
    text-align: center;
    margin-right: 15px;
}

.information1 {
    display: inline-block;
    width: 123px;
    height: 100%;
    border: 1px solid rgba(228, 228, 228, 1);
    text-align: center;
    background: #f9f9f9;
    color: #999;
}

.information2 {
    display: inline-block;
    width: 123px;
    height: 100%;
    border-top: 3px solid #2c5589;
    text-align: center;
    color: #2c5589;
}

.information1:hover {
    color: #ff0036;
}

.hotInfoIndex {
    width: 20px;
    height: 19px;
    background: #d00;
    display: inline-block;
    text-align: center;
    margin-right: 5px;
    color: #fff;
    line-height: 19px;
    position: relative;
    font-style: normal;
}

.content,
.content >>> p {
    /*text-indent: 2em;*/
}

.newsTitle {
    display: inline-block;
    width: 46%;
    padding: 0 5px;
    height: 30px;
    text-align: center;
    line-height: 30px;
    border-radius: 5px;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.title1 {
    background: #286fcf;
    color: #fff;
}

.title2 {
    background: #e9eef2;
    color: #286fcf;
}

/* .content >>> p:before {
      content: "\00A0\00A0\00A0\00A0\00A0\00A0\00A0\00A0";
    } */
</style>
