<template>
    <div id="ztfx2">
        <div class="left-part">
            <div class="left-part-button">
                <div class="button-management" @click="managementTheme()">主题管理</div>
            </div>
            <div class="left-part-top">
                <el-tree :data="data" :props="defaultProps" @node-click="handleNodeClick"></el-tree>
            </div>

        </div>
        <div class="right-part" v-if="part == 1">
            <div class="ztfx-list">
                <div class="ztfx-list-title">
                    <span>为您提供<span class="new-num" v-text="total"></span>条数据</span>
                    <div class="button-discuss" @click="discuss()">研判</div>
                    <div class="button-preview" @click="analyse()">分析</div>
                </div>
                <div class="ztfx-list-content">
                    <el-tabs v-model="activeName" @tab-click="handleClick">
                        <el-tab-pane :label="'新闻'+'('+totalType.totalNews+')'" name="1" v-if="isShow[0]">
                            <div class="content">
                                <div class="content-news" v-for="(item, index) in getNews" @click="show_newsInfo(item,index)">
                                    <div class="content-news-first">
                                        <div class="news-title" v-text="item.title"></div>
                                    </div>
                                    <div class="news-content" v-text="item.txt" :title="item.txt"></div>
                                    <div class="news-info">
                                        <span class="news-info-sitename">来自：<span v-text="item.site_name"></span></span>
                                        <span class="news-info-pubdate">发布时间：<span v-text="item.pubdate"></span></span>
                                        <span class="news-info-snatchtime">抓取时间：<span v-text="item.snatch_time"></span></span>
                                        <div class="news-info-tool">
                                            <i class="el-icon-more" title="详情"></i>
                                        </div>
                                    </div>
                                </div>
                            </div>
                            <div class="pagination-div">
                                <el-pagination class="myPagination" background layout="total, sizes, prev, pager, next, jumper" :current-page="currentPage" :total="this.totalType.totalNews" @current-change="handleCurrentChange" @size-change="handleSizeChangeNews" :page-size="everySizeNews" :page-sizes="[10,20,50,100]">
                                </el-pagination>
                            </div>
                        </el-tab-pane>
                        <el-tab-pane :label="'FACEBOOK'+'('+totalType.totalFacebook+')'" name="2" v-if="isShow[1]">FACEBOOK
                        </el-tab-pane>
                        <el-tab-pane :label="'TWITTER'+'('+totalType.totalTwitter+')'" name="3" v-if="isShow[2]">
                            <div class="content">
                                <div class="content-news" v-for="(item, index) in getTwitter" @click="show_newsInfo(item,index)">
                                    <div class="content-news-first">
                                        <div class="news-title" v-text="item.site_name"></div>
                                    </div>
                                    <div class="news-content" v-text="item.txt" :title="item.txt"></div>
                                    <div class="news-info">
                                        <span class="news-info-sitename">来自：<span v-text="item.site_name"></span></span>
                                        <span class="news-info-pubdate">发布时间：<span v-text="item.pubdate"></span></span>
                                        <span class="news-info-snatchtime">抓取时间：<span v-text="item.snatch_time"></span></span>
                                        <div class="news-info-tool">
                                            <i class="el-icon-more" title="详情"></i>
                                        </div>
                                    </div>
                                </div>
                            </div>
                            <div class="pagination-div">
                                <el-pagination class="myPagination" background layout="total, sizes, prev, pager, next, jumper" :current-page="currentPage3" :total="this.totalType.totalTwitter" @current-change="handleCurrentChange3" @size-change="handleSizeChangeTwitter" :page-size="everySizeTwitter" :page-sizes="[10,20,50,100]">
                                </el-pagination>
                            </div>
                        </el-tab-pane>
                        <el-tab-pane :label="'智库'+'('+totalType.totalThinkTank+')'" name="4" v-if="isShow[3]">智库</el-tab-pane>
                    </el-tabs>
                </div>
            </div>
        </div>
        <div class="right-part" v-if="part == 2">
            <div class="left-part1">
                <div class="center-part-top-chart">
                    <table>
                        <tr>
                            <td v-for="(item, index) in table_data">
                                <img @click="check(index)" :src="item" alt="" :style="{
                    border: index == index1 ? '1px solid white' : 'none',
                    boxShadow: index == index1 ? '0 2px 12px 0 white' : '',
                  }" />
                            </td>
                        </tr>
                    </table>
                </div>
                <div class="center-part-top">
                    <div class="center-part-top-one">
                        <span>话题：</span>
                        <el-select class="public-input" v-model="topicValue" placeholder="" @change="onChangeTopic">
                            <el-option v-for="item in options1" :key="item.value" :label="item.label" :value="item.value">
                            </el-option>
                        </el-select>
                    </div>
                    &emsp;&emsp;
                    <div class="center-part-top-two">
                        <span>维度：</span>
                        <el-select class="public-input" v-model="dimensionValue" placeholder="输入类型" @change="onChangeDimension">
                            <el-option v-for="item in options" :key="item.value" :label="item.label" :value="item.value">
                            </el-option>
                        </el-select>
                    </div>
                    &emsp;&emsp;
                    <div class="center-part-top-three">
                        <span>网格线：</span>
                        <el-switch v-model="value1" active-color="#13ce66" inactive-color="#ff4949">
                        </el-switch>
                    </div>
                    &emsp;&emsp;
                    <div class="center-part-top-four">
                        <span>显示数据：</span>
                        <el-switch v-model="value2" active-color="#13ce66" inactive-color="#ff4949">
                        </el-switch>
                    </div>
                </div>
                <div id="myecharts" class="center-part-center"></div>
                <div class="center-part-bottom">
                    <table>
                        <tr>
                            <td>图表标题</td>
                            <td>
                                <el-input v-model="obj.title" placeholder="请输入内容"></el-input>
                            </td>
                        </tr>
                        <tr>
                            <td>图表描述</td>
                            <td>
                                <el-input v-model="obj.attribution" placeholder="请输入内容"></el-input>
                            </td>
                        </tr>
                        <tr>
                            <td colspan="2">
                                <div @click="define" class="button">添加</div>
                            </td>
                        </tr>
                    </table>
                </div>
            </div>
            <div class="right-part1">
                <!-- <div class="right-part-top">
                    <el-select class="public-input" v-model="value4" placeholder="请选择模板">
                        <el-option v-for="item in options2" :key="item.value" :label="item.label" :value="item.value">
                        </el-option>
                    </el-select>
                </div> -->
                <div class="right-part-center">
                    <div class="right-part-center-img" v-for="(item, index) in img_list">
                        <div class="right-part-center-img-title" v-text="item.title"></div>
                        <el-image :src="item.img" fit="contain"></el-image>
                        <i @click="edit_img(index)" class="el-icon-delete-edit"></i>
                        <i @click="delete_img(index)" class="el-icon-delete-solid"></i>
                    </div>
                </div>
                <div class="right-part-bottom">
                    <div class="button-preview" @click="preview_report">预览报告</div>
                    <div class="button-cancel" @click="cancel_report">取消</div>
                </div>
            </div>
        </div>
        <div class="right-part" v-if="part == 3">
            <div class="discuss-detail">
                <div class="discuss-detail-choice">
                    <!-- <span>话题：</span>
                    <el-select class="public-input" v-model="topicValue" placeholder="">
                        <el-option v-for="item in options1" :key="item.value" :label="item.label" :value="item.value">
                        </el-option>
                    </el-select> -->
                    <img class="back-img" :src="back" alt="" @click="goBack()" />
                </div>
                <div class="discuss-part-one">
                    <div class="discuss-part-one-title" v-text="discuss_data.title"></div>
                    <div class="discuss-part-one-content">
                        <div class="part-one-text" v-text="discuss_data.text"></div>
                        <!-- <div class="part-one-img">
                            <el-image v-for="(item, index) in discuss_data.img" style="width: 40%; height: 200px" :src="item" :key="index" fit="fit"></el-image>
                        </div> -->
                    </div>
                </div>
                <div class="discuss-part-two">
                    <div class="discuss-part-two-title">事件解读</div>
                    <div class="discuss-part-two-content">
                        <div class="part-two-left">
                            <div class="part-two-left-title">舆情数据</div>
                            <div class="part-two-left-content" v-for="(item, index) in discuss_data.decode.yqsj">
                                <div class="part-two-left-content-title" v-text="item.title"></div>
                                <div class="part-two-left-content-text" v-text="item.text"></div>
                            </div>
                        </div>
                        <div class="part-two-right">
                            <div class="part-two-right-title">内部数据</div>
                            <div class="part-two-right-content" v-for="(item, index) in discuss_data.decode.nbsj">
                                <div class="part-two-right-content-title" v-text="item.title"></div>
                                <div class="part-two-right-content-text" v-text="item.text"></div>
                            </div>
                        </div>
                    </div>
                </div>
                <div class="discuss-part-three">
                    <!-- <div class="part-three-title">结论</div> -->
                    <div class="part-three-content">
                        <!-- <div class="part-three-content-top">
                            <div class="part-three-content-top-left" v-text="discuss_data.conclusion.part1"></div>
                            <div class="part-three-content-top-right" id="myecharts"></div>
                        </div> -->
                        <div class="part-three-content-bottom">
                            <div class="part-three-content-bottom-title">处置预案</div>
                            <div class="part-three-content-bottom-content">
                                <div v-text="discuss_data.conclusion.part2" style="overflow-y: auto;height: 100%;"></div>
                            </div>
                        </div>
                    </div>
                </div>
                <el-backtop target=".discuss-detail " :bottom="100">
                </el-backtop>
            </div>

        </div>
        <!-- 预览报告弹框 -->
        <el-dialog title="报告详情" :visible.sync="dialogVisible" width="60%">
            <div class="report-info">
                <div class="report-info-name">
                    <el-input v-model="reportInfo.title" placeholder="请输入报告名称（必填项）"></el-input>
                </div>
                <div class="report-info-title">
                    <el-input :disabled="true" value="一、网上基本情况"></el-input>
                </div>
                <div class="report-info-content">
                    <el-input v-model="reportInfo.content" type="textarea" :rows="2" placeholder="请输入内容(不输入即不显示)">
                    </el-input>
                </div>
                <div class="report-info-title">
                    <el-input :disabled="true" value="二、图表内容"></el-input>
                </div>
                <div class="report-info-chart" v-for="(item, index) in reportInfo.img_list">
                    <div class="report-info-chart-title">
                        <el-input v-model="item.title"></el-input>
                    </div>
                    <div class="report-info-chart-content">
                        <el-image :src="item.img" fit="contain"></el-image>
                        <div class="img-title">图<span v-text="index + 1"></span></div>
                        <el-input v-model="item.attribution" type="textarea" :rows="2" placeholder="请输入内容"></el-input>
                    </div>
                </div>
            </div>
            <span slot="footer" class="dialog-footer">
                <el-button @click="dialogVisible = false">取 消</el-button>
                <el-button type="primary" @click="export_report">导出报告</el-button>
                <el-button type="success" @click="send_report">发送报告</el-button>
            </span>
        </el-dialog>
        <!-- 主题管理弹出框 -->
        <el-dialog title="主题管理" center :visible.sync="dialogVisibleZtgl" width="85%" top="5%" class="dialogZtgl"  append-to-body>
            <div style="width:100%;height:70%">
                <ztgl  @closeMoule="closeMoule"></ztgl>
            </div>
        </el-dialog>
    </div>
</template>

<script>
import img from "../../assets/img/yqjc/42.png";
import img1 from "../../assets/img/yqjc/30.png";
import img2 from "../../assets/img/yqjc/32.png";
import img3 from "../../assets/img/yqjc/35.png";
import img4 from "../../assets/img/yqjc/37.png";
import img5 from "../../assets/img/yqjc/38.png";
import img6 from "../../assets/img/yqjc/1.jpeg";
import img7 from "../../assets/img/yqjc/1.jpg";
import back from "../../assets/img/setting/back.png";
import ztgl from "./ztgl.vue";
import * as echarts from "echarts";
import { get, post, startLoading, endLoading } from "../../util/http_util";
import exportWord from "../../util/export_doc_util";
import msgType from "../../constant/msgtype"
export default {
    name: "ztfx",
    components: {
        ztgl: ztgl,
    },
    data() {
        return {
            modalZtgl: false,
            activeName: "1",
            currentPage: 1, //分页插件 当前所在的页数
            currentPage3: 3,
            back: back,
            part: 1,
            checked: true,
            dialogVisible: false,
            defaultProps: {
                children: "children",
                label: "label",
            },
            data: [
            ],
            table_data: [img, img1, img2, img3, img4, img5],
            options: [
                {
                    value: "媒体类型",
                    label: "媒体类型",
                },
                {
                    value: "行业",
                    label: "行业",
                },
                {
                    value: "情感",
                    label: "情感",
                },
                {
                    value: "关键词",
                    label: "关键词",
                },
                {
                    value: "时间",
                    label: "时间",
                },
                {
                    value: "国家",
                    label: "国家",
                },
                 {
                    value: "大洲",
                    label: "大洲",
                },
            ],
            options1: [
                {
                    value: "全部",
                    label: "全部",
                },
                {
                    value: "国际国内热点",
                    label: "国际国内热点",
                },
                {
                    value: "美盟涉华舆情",
                    label: "美盟涉华舆情",
                },
                {
                    value: "台海潮声",
                    label: "台海潮声",
                },
                {
                    value: "中日交锋",
                    label: "中日交锋",
                },
                {
                    value: "半岛风云",
                    label: "南海观澜",
                },
                {
                    value: "国际大势",
                    label: "国际大势",
                },
            ],
            dimensionValue: "媒体类型",
            value1: "",
            value2: "",
            topicValue: "",
            value4: "",
            index1: 0,
            type: "radar",
            myChart: "",
            obj: {
                title: "",
                attribution: "",
                img: "",
            },
            img_list: [],
            discuss_data: {
                title: null,
                text:
                    "中国人民解放军南部战区新闻发言人田军里空军大校表示，12月22日，美国“麦凯恩”号驱逐舰未经中国政府允许，擅自冲闯我南沙岛礁邻近海域，中国人民解放军南部战区组织海空兵力对其予以警告驱离",
                img: [img6, img7],
                decode: {
                    yqsj: [
                        {
                            title: "中美局势最新消息：美舰擅闯南沙海域 中方警告驱离",
                            text:
                                "美国海军第七舰队在其官方网站发布消息确认，12月22日美海军阿利伯克级导弹驱逐舰“麦凯恩”号(DDG-56)在中国南沙岛礁临近海域进行所谓“自由航行”活动。美国海军第七舰队声称，此举是“例行航行”，以“支持印度太平洋地区的安全与稳定”。",
                        },
                        {
                            title: "美驱逐舰擅自冲闯南沙岛礁附近海域 中国海军兵力予以驱离",
                            text:
                                "美国第七舰队(US 7th Fleet)发言人驳斥中方说法，表示美国海军阿利伯克级导弹驱逐舰“麦凯恩”号(DDG 56)是在菲律宾以西的南中国海争议海域航行，是在展示海上航行自由，并非像是中方所指的严重侵犯中国主权和安全。",
                        },
                    ],
                    nbsj: [
                        {
                            title: "解放军南部战区组织海空兵力对其予以警告驱离",
                            text:
                                "中国人民解放军南部战区新闻发言人田军里空军大校表示，12月22日，美国“麦凯恩”号驱逐舰未经中国政府允许，擅自冲闯我南沙岛礁邻近海域，中国人民解放军南部战区组织海空兵力对其予以警告驱离。美方这种行径严重侵犯中国主权和安全，严重破坏南海地区和平稳定，我们表示坚决反对。战区部队时刻保持高度戒备，坚决履行职责使命，坚决捍卫国家主权安全和南海地区和平稳定。",
                        },
                    ],
                },
                conclusion: {
                    part1:
                        "中美关系持续恶化，美国军方上周（12月14-19日）在一份文件中警告称，将对北京采取“更强硬”的行动。这份文件为美国海军、海军陆战队和海岸警卫队制定了2021年的目标。",
                    part2:
                        "",
                },
            },
            reportInfo: {
                title: "",
                content: "",
                img_list: [],
            },
            total: 0,
            totalType: {
                totalNews: 0,
                totalFacebook: 0,
                totalTwitter: 0,
                totalThinkTank: 0,
            },
            condition: {
                stTime: null,
                edTime: null,
                siteName: null,
                author: null,
                title: null,
                txt: null,
            },
            getNews: [],
            getTwitter: [],
            click_id: 1,
            isShow: [false, false, false, false],
            themeNode: null,
            newsDimension: [],
            dialogVisibleZtgl: false,
            everySizeTwitter: 10,
            everySizeNews: 10
        };
    },
    watch: {
        value1(val, old) {
            this.myChart.setOption({
                xAxis: [
                    {
                        splitLine: { show: val }, //去除网格线、
                    },
                ],
                yAxis: [
                    {
                        splitLine: { show: val }, //去除网格线、
                    },
                ],
            });
        },
        value2(val, old) {
            this.myChart.setOption({
                series: [
                    {
                        label: { show: val }, //去除标签
                    },
                ],
            });
        },
    },
    methods: {
        onChangeDimension(e){
            if(e == "国家"){
                this.themeNode.dimensionRegion = "COUNTRY";
            }else if(e == "大洲"){
                this.themeNode.dimensionRegion = "CONTINENT";
            }else if(e == "媒体类型"){
                this.themeNode.dimensionRegion = "MEDIA";
            }
            this.analyseInfo();
        },
        onChangeTopic(e){
            e= e=="全部"?null:e;
            this.themeNode.topic = e;
            this.analyseInfo();
        },
        check(index) {
            this.myChart.dispose();
            this.index1 = index;
            this.value1 = true;
            this.value2 = true;
            this.obj.title = "";
            this.obj.attribution = "";
            switch (index) {
                case 0:
                    this.type = "radar";
                    break;
                case 1:
                    this.type = "line";
                    break;
                case 2:
                    this.type = "bar1";
                    break;
                case 3:
                    this.type = "bar";
                    break;
                case 4:
                    this.type = "pie";
                    break;
                case 5:
                    this.type = "pie1";
                    break;
            }
            this.myChart = echarts.init(document.getElementById("myecharts"));
            this.creat_echarts(this.newsDimension, this.type);
        },
        creat_echarts(data, type) {
            if (this.myChart == "") {
                this.myChart = echarts.init(document.getElementById("myecharts"));
            }
            let option = {},
                data_tmp = [],
                obj_tmp = {},
                data_all = [];
            if (type == "radar") {
                for (let i = 0; i < data[0].length; i++) {
                    obj_tmp = {};
                    obj_tmp["text"] = data[0][i];
                    data_all.push(obj_tmp);
                }
                option = {
                    backgroundColor: "#1d2d46",
                    radar: [
                        {
                            indicator: data_all,
                            center: ["50%", "50%"],
                            radius: 120,
                            startAngle: 90,
                            splitNumber: 4,
                            shape: "circle",
                            axisName: {
                                formatter: "【{value}】",
                                color: "#72ACD1",
                            },
                            splitArea: {
                                areaStyle: {
                                    color: [
                                        "rgba(114, 172, 209, 0.2)",
                                        "rgba(114, 172, 209, 0.4)",
                                        "rgba(114, 172, 209, 0.6)",
                                        "rgba(114, 172, 209, 0.8)",
                                        "rgba(114, 172, 209, 1)",
                                    ],
                                    shadowColor: "rgba(0, 0, 0, 0.3)",
                                    shadowBlur: 10,
                                },
                            },
                            axisLine: {
                                lineStyle: {
                                    color: "rgba(255, 255, 255, 0.5)",
                                },
                            },
                            splitLine: {
                                lineStyle: {
                                    color: "rgba(255, 255, 255, 0.5)",
                                },
                            },
                        },
                    ],
                    series: [
                        {
                            type: "radar",
                            emphasis: {
                                lineStyle: {
                                    width: 4,
                                },
                            },
                            data: data[1]
                        },
                    ],
                };
            } else if (type == "bar" || type == "line") {
                option = {
                    backgroundColor: "#1d2d46",
                    xAxis: {
                        type: "category",
                        data: data[0],
                        triggerEvent: true,
                        axisLabel: {
                            show: true,
                            color: "white",
                            fontSize: 10,
                            interval: 0,
                            rotate: "15",
                        },
                    },
                    yAxis: {
                        type: "value",
                        axisLabel: {
                            show: true,
                            color: "white",
                            fontSize: 15,
                        },
                    },
                    grid: {
                        bottom: "15%",
                    },
                    series: [
                        {
                            data: data[1],
                            type: type,
                            label: {
                                show: true,
                            },
                        },
                    ],
                };
            } else if (type == "bar1") {
                option = {
                    backgroundColor: "#1d2d46",
                    xAxis: {
                        type: "value",
                        axisLabel: {
                            show: true,
                            color: "white",
                            fontSize: 10,
                        },
                    },
                    yAxis: {
                        type: "category",
                        data: data[0],
                        axisLabel: {
                            show: true,
                            color: "white",
                            fontSize: 10,
                            interval: 0,
                            rotate: "45",
                        },
                    },
                    grid: {
                        left: "13%",
                    },
                    series: [
                        {
                            data: data[1],
                            type: "bar",
                            label: {
                                show: true,
                            },
                        },
                    ],
                };
            } else if (type == "pie") {
                for (let i = 0; i < data[0].length; i++) {
                    obj_tmp = {};
                    obj_tmp.name = data[0][i];
                    obj_tmp.value = data[1][i];
                    data_all.push(obj_tmp);
                }
                option = {
                    backgroundColor: "#1d2d46",
                    tooltip: {
                        trigger: "item",
                    },
                    series: [
                        {
                            type: "pie",
                            radius: "50%",
                            data: data_all,
                            emphasis: {
                                itemStyle: {
                                    shadowBlur: 10,
                                    shadowOffsetX: 0,
                                    shadowColor: "rgba(0, 0, 0, 0.5)",
                                },
                            },
                        },
                    ],
                };
            } else if (type == "pie1") {
                for (let i = 0; i < data[0].length; i++) {
                    obj_tmp = {};
                    obj_tmp.name = data[0][i];
                    obj_tmp.value = data[1][i];
                    data_all.push(obj_tmp);
                }
                option = {
                    backgroundColor: "#1d2d46",
                    tooltip: {
                        trigger: "item",
                    },
                    series: [
                        {
                            type: "pie",
                            radius: ["40%", "70%"],
                            avoidLabelOverlap: false,
                            itemStyle: {
                                borderRadius: 10,
                                borderColor: "#fff",
                                borderWidth: 2,
                            },
                            label: {
                                show: false,
                                position: "center",
                            },
                            emphasis: {
                                label: {
                                    show: true,
                                    fontSize: "40",
                                    fontWeight: "bold",
                                },
                            },
                            labelLine: {
                                show: false,
                            },
                            data: data_all,
                        },
                    ],
                };
            }
            this.myChart.clear();
            this.myChart.setOption(option);
        },
        define() {
            this.obj.img = this.myChart.getDataURL({
                backgroundColor: "transparent",
            });
            let obj = JSON.parse(JSON.stringify(this.obj));
            this.img_list.push(obj);
            this.reportInfo.img_list = this.img_list;
        },
        delete_img(index) {
            this.img_list.splice(index, 1);
        },
        preview_report() {
            this.dialogVisible = true;
            this.reportInfo.img_list.forEach((item, index) => {
                this.reportInfo.img_list[index]["index"] = index + 1;
            });
        },
        queryNewsByTheme(pageNum, pageSize, data, isAddNum) {
            post(
                "api/rest/fulltext/queryNewsByTheme?pageNum=" +
                pageNum +
                "&pageSize=" +
                pageSize,
                data
            ).then((data) => {
                if (isAddNum == 1) {
                    this.total = this.total + data.totals;
                }
                this.totalType.totalNews = data.totals;
                this.getNews = data.list;
                this.currentPage = pageNum;
            }).catch((err)=>{
                this.$message.warning(err.message);
            });
        },
        queryTwitterByTheme(pageNum, pageSize, data, isAddNum) {
            post(
                "api/rest/fulltext/queryTwitterByTheme?pageNum=" +
                pageNum +
                "&pageSize=" +
                pageSize,
                data
            ).then((data) => {
                if (isAddNum == 1) {
                    this.total = this.total + data.totals;
                }
                this.totalType.totalTwitter = data.totals;
                let arr_news_twitter = [];
                data.list.forEach((item) => {
                    arr_news_twitter.push({
                        title: "", //标题
                        txt: item.tweets_content, //内容
                        site_name: item.fullname, //来自
                        pubdate: item.timestr, //发布时间
                        snatch_time: item.input_time, //抓取时间
                        highLight: null, //高亮
                        cmtcnt: item.cmtcnt, //评论数
                        rpscnt: item.rpscnt, //转发数
                        atdcnt: item.atdcnt, //点赞数
                        isori: item.isori, //是否原创
                    });
                });
                this.getTwitter = arr_news_twitter;
                this.currentPage3 = pageNum;
            }).catch((err)=>{
                this.$message.warning(err.message);
            });
        },
        handleNodeClick(node) {
            this.total = 0;
            this.activeName = "1";
            this.click_id = 1;
            this.part = 1;
            this.isShow.forEach((item, index) => {
                this.isShow[index] = false;
            });
            if (node.children == undefined) {
                let listAll = JSON.parse(JSON.stringify(node)),
                    tmp = [],
                    tmp1 = [];
                node.characterClassify.forEach((item) => {
                    tmp.push(item.id);
                });
                node.source.forEach((item) => {
                    tmp1.push(item.id);
                });
                listAll.characterClassify = tmp;
                listAll.source = tmp1;
                this.themeNode = listAll;

                node.source.forEach((item) => {
                    if (item.name == "新闻") {
                        this.queryNewsByTheme(1, this.everySizeNews, listAll, 1);
                        this.isShow[0] = true;
                    }
                    //  else if (item.name == "TWITTER") {
                    //     this.queryTwitterByTheme(1, this.everySizeTwitter, listAll, 1);
                    //     this.isShow[2] = true;
                    // }
                });

            } else {
                this.isShow.forEach((item, index) => {
                    this.isShow[index] = false;
                });
                this.newsDimension = [];
            }
        },
        analyse() {
            if(this.themeNode == null){
                return;
            }
            this.themeNode.dimensionRegion = "MEDIA";
            this.analyseInfo();
        },
        analyseInfo(){
            this.newsDimension = [[],[]];
            this.themeNode.sentimentType = "NEWS";
            post(
                "api/rest/fulltext/statisticsNewsRegion",
                this.themeNode
            )
            .then((res) => {
                if (res.length > 0) {
                    let listTmp = [[], []];
                    res.forEach((item) => {
                        listTmp[0].push(item.title);
                        listTmp[1].push(item.count);
                    });
                    this.newsDimension = listTmp;
                }
                 this.part = 2;
                    setTimeout(() => {
                    this.myChart = echarts.init(document.getElementById("myecharts"));
                    this.creat_echarts(this.newsDimension, this.type);
                }, 1000);
            }).catch((err)=>{
                this.$message.warning(err.message);
            });
        },
        discuss() {
            if(this.getNews.length == 0){
                return;
            }
            this.discuss_data.title = this.getNews[0].title;
            this.discuss_data.text = this.getNews[0].txt;
            if(this.getNews[0].hot_word || true){
                post(
                    "api/rest/fulltext/searchFiles?pageNum=" +
                    1 +
                    "&pageSize=" +
                    1,
                    {content: "中国"}
                )
                .then(res=>{
                    if(res.list){
                        this.discuss_data.decode.nbsj[0].text = res.list[0].attachment.content;
                        this.discuss_data.decode.nbsj[0].title = res.list[0].fileInfo.name;
                        this.discuss_data.conclusion.part2 = res.list[0].attachment.content;
                    }
                }).catch(err=>{

                });
            }
            
            this.part = 3;
        },
        cancel_report() {
            this.part = 1;
            this.myChart.dispose();
        },
        goBack() {
            this.part = 1;
        },
        export_report() {
            if (this.reportInfo.title == "") {
                this.$message.error("标题不能为空！");
                return false;
            }
            exportWord(
                "static/word/report.docx",
                this.reportInfo,
                this.reportInfo.title,
                1
            );
            // this.dialogVisible = false;
        },
        handleCurrentChange(pageNum) {
            this.queryNewsByTheme(pageNum, this.everySizeNews, this.themeNode, 0);
            this.currentPage = pageNum;
        },
        handleCurrentChange3(pageNum) {
            this.queryTwitterByTheme(pageNum, this.everySizeTwitter, this.themeNode, 0);
            this.currentPage3 = pageNum;
        },
        send_report() {
            exportWord(
                "static/word/report.docx",
                this.reportInfo,
                this.reportInfo.title,
                0
            )
            .then((res) => {
                let condition = {
                    name: this.reportInfo.title,
                    description: this.reportInfo.content,
                    path: res,
                    type: "docx",
                };
                return post("api/rest/sentiment/addReport", condition);
            })
            .then((res) => {
                // let x = msgType
                return post("api/rest/user/sendNotification", {
                    type: msgType.REPORT,
                    text: "主题研判分析报告推送"
                });
            })
            .then(res=>{
                this.$message.success("发送成功！");
                this.dialogVisible = false;
            })
            .catch((err) => {
                this.$message.error(err);
            });
        },
        handleClick(tab, event) {
            this.click_id = tab.name;
        },
        show_newsInfo(item, index) {
            if (this.click_id == 1) {
                this.$router.push({ name: "新闻详情" + this.$route.meta.type_name, params: { key: item.id } });
            } else if (this.click_id == 3) {
                this.$router.push({
                    name: "Twitter详情" + this.$route.meta.type_name,
                    params: this.getTwitter[index],
                });
            }
        },
        managementTheme() {
            this.dialogVisibleZtgl = true;
        },
        handleSizeChangeNews(val) {
            this.everySizeNews = val;
            this.currentPage = 1;
            this.queryNewsByTheme(1, this.everySizeNews, this.themeNode, 0);
        },
        handleSizeChangeTwitter(val) {
            this.everySizeTwitter = val;
            this.currentPage3 = 1;
            this.queryTwitterByTheme(1, this.everySizeTwitter, this.themeNode, 0);
        },
        query_ztgl(){
            post("api/rest/sentiment/queryFolder").then((data) => {
                this.data = data;
            }).catch((err)=>{
                this.$message.warning(err.message);
            });
        },
        closeMoule(e){
            this.query_ztgl();
        }
    },
    mounted() {
        // this.query_ztgl();
    },
    activated(){
        this.query_ztgl();
    }
};
</script>

<style lang="scss">
#ztfx2 {
    width: 100%;
    height: 100%;
    margin: 0;
    padding: 20px;
    display: -webkit-box;
    box-sizing: border-box;
    .left-part {
        width: 17%;
        height: 100%;
        padding: 30px 10px;
        box-sizing: border-box;
        .left-part-button {
            width: 100%;
            height: 50px;
            text-align: center;
            .button-management {
                width: 100px;
                height: 30px;
                line-height: 30px;
                float: left;
                margin-left: calc(50% - 50px);
                margin-top: 10px;
                text-align: center;
                cursor: pointer;
                background-image: url(../../assets/img/yqjc/40.png);
                background-repeat: no-repeat;
                background-size: 100% 100%;
            }
        }
        .left-part-top {
            width: 100%;
            height: calc(99% - 50px);
            padding: 10px;
            overflow-y: auto;
            box-sizing: border-box;
            .el-tree {
                color: white;
                background: transparent;
                .el-tree-node__content {
                    height: 40px;
                }
            }

            .el-tree > .el-tree-node > .el-tree-node__content {
                height: 40px;
                // background-color: #263b5d !important;
                background-image: url(../../assets/img/yqjc/24.png);
                background-repeat: no-repeat;
                background-size: 100% 100%;
                .el-tree-node__label {
                    margin-left: calc(50% - 45px);
                }
            }
            .el-tree
                > .el-tree-node
                > .el-tree-node__content
                > .el-tree-node__label {
                font-size: 16px !important;
            }
            .el-tree > .el-tree-node > .el-tree-node__children {
                background-color: #1d2d46 !important;
            }
            .el-tree-node:focus > .el-tree-node__content {
                background-color: #263b5d !important;
            }

            .el-tree-node__content:hover,
            .el-tree-node__content:focus {
                background-color: #00648a96 !important;
            }
        }
    }
    .right-part {
        width: 83%;
        height: 100%;
        padding: 20px;
        box-sizing: border-box;
        display: -webkit-box;
        .ztfx-list {
            width: 100%;
            height: 100%;
            background: url('../../assets/img/yqjc/02.png') no-repeat;
            background-size: 100% 100%;
            .ztfx-list-title {
                width: 100%;
                height: 40px;
                line-height: 40px;
                padding-left: 20px;
                box-sizing: border-box;
                background: #263b5d;
                .new-num {
                    color: #09c69c;
                }
                .button-discuss {
                    width: 100px;
                    height: 30px;
                    line-height: 30px;
                    float: right;
                    margin-top: 5px;
                    font-size: 14px;
                    margin-right: 20px;
                    text-align: center;
                    cursor: pointer;
                    background-image: url(../../assets/img/yqjc/40.png);
                    background-repeat: no-repeat;
                    background-size: 100% 100%;
                }
                .button-preview {
                    width: 100px;
                    height: 30px;
                    line-height: 30px;
                    float: right;
                    margin-top: 5px;
                    font-size: 14px;
                    margin-right: 20px;
                    text-align: center;
                    cursor: pointer;
                    background-image: url(../../assets/img/yqjc/40.png);
                    background-repeat: no-repeat;
                    background-size: 100% 100%;
                }
            }
            .ztfx-list-content {
                width: 100%;
                height: calc(100% - 40px);
                padding: 10px;
                color: white;
                overflow-y: auto;
                box-sizing: border-box;
                .el-tabs {
                    width: 100%;
                    height: 100%;
                    .el-tabs__header {
                        margin: 0px;
                        .el-tabs__nav-wrap::after {
                            background-color: #09c69c;
                        }
                        .el-tabs__item {
                            min-width: 100px;
                            padding: 0px;
                            text-align: center;
                            color: white;
                        }
                        // .el-tabs__item:focus,
                        // .el-tabs__item:focus:active {
                        //   color: red !important;
                        // }
                        .el-tabs__item.is-active {
                            background-color: #09c69c;
                        }
                        .el-tabs__active-bar {
                            background-color: #09c69c;
                        }
                    }
                    .el-tabs__content {
                        width: 100%;
                        height: calc(100% - 40px);
                        .el-tab-pane {
                            width: 100%;
                            height: 100%;
                            .content {
                                width: 100%;
                                height: calc(100% - 50px);
                                overflow-y: auto;
                                .content-news {
                                    border-bottom: 1px solid #156677;
                                    .content-news-first {
                                        display: flex;
                                        .news-title {
                                            width: 100%;
                                            height: 40px;
                                            line-height: 40px;
                                            font-size: 18px;
                                            padding-left: 20px;
                                            cursor: pointer;
                                            box-sizing: border-box;
                                        }
                                    }
                                    .news-content {
                                        font-size: 18px;
                                        text-indent: 25px;
                                        margin-top: 10px;
                                        cursor: pointer;
                                        word-break: break-all;
                                        text-overflow: ellipsis;
                                        display: -webkit-box;
                                        -webkit-box-orient: vertical;
                                        -webkit-line-clamp: 2;
                                        overflow: hidden;
                                    }
                                    .news-info {
                                        width: 100%;
                                        height: 30px;
                                        margin-top: 10px;
                                        .news-info-sitename,
                                        .news-info-pubdate,
                                        .news-info-snatchtime {
                                            margin-left: 20px;
                                            span {
                                                color: #09c69c;
                                            }
                                        }
                                        .news-info-tool {
                                            width: 100px;
                                            float: right;
                                            i {
                                                cursor: pointer;
                                            }
                                            i:hover {
                                                color: #09c69c;
                                            }
                                        }
                                    }
                                }
                            }
                            .pagination-div {
                                width: 100%;
                                height: 50px;
                                .el-pagination {
                                    margin-top: 9px;
                                    text-align: right;
                                    .el-pagination__total {
                                        color: white;
                                    }
                                    .el-pagination__jump {
                                        color: white;
                                    }
                                }
                                .myPagination.is-background
                                    .el-pager
                                    li:not(.disabled).active {
                                    color: #fff;
                                    border: 1px solid #146a80;
                                    box-shadow: 0 0 10px #1b6097;
                                    background-color: #1d2d46;
                                }
                            }
                        }
                    }
                }
            }

            .button-preview {
                width: 100px;
                height: 30px;
                line-height: 30px;
                margin-left: calc(50% - 110px);
                margin-top: 10px;
                font-size: 14px;
                text-align: center;
                cursor: pointer;
                background-image: url(../../assets/img/yqjc/40.png);
                background-repeat: no-repeat;
                background-size: 100% 100%;
            }
        }
        .left-part1 {
            width: 75%;
            height: 100%;
            padding: 20px;
            box-sizing: border-box;
            background-image: url(../../assets/img/yqjc/39.png);
            background-repeat: no-repeat;
            background-size: 100% 100%;
            .center-part-top-chart {
                width: 100%;
                height: 60px;
                // padding: 30px;
                box-sizing: border-box;
                // background-image: url(../../assets/img/yqjc/25.png);
                background-repeat: no-repeat;
                background-size: 100% 100%;
                table {
                    width: 100%;
                    height: 100%;
                    text-align: center;
                    td {
                        cursor: pointer;
                    }
                }
            }
            .center-part-top {
                width: 100%;
                height: 80px;
                line-height: 80px;
                padding-left: 40px;
                box-sizing: border-box;
                display: -webkit-box;
                // .el-input {
                //     background-image: url(../../assets/img/yqjc/24.png);
                //     background-repeat: no-repeat;
                //     background-size: 100% 100%;
                // }
                input {
                    width: 150px;
                    border: none;
                    background: transparent;
                }
            }
            .center-part-center {
                width: 100%;
                height: calc(100% - 290px);
            }
            .center-part-bottom {
                width: 100%;
                height: 150px;
                table {
                    width: 80%;
                    height: 100%;
                    color: white;
                    tr td {
                        text-align: center;
                        input {
                            height: 30px;
                            color: white;
                            border: 1px solid #137888;
                            background: transparent;
                        }
                        .button {
                            width: 100px;
                            height: 30px;
                            line-height: 30px;
                            margin-left: calc(50% - 50px);
                            cursor: pointer;
                            background-image: url(../../assets/img/yqjc/40.png);
                            background-repeat: no-repeat;
                            background-size: 100% 100%;
                        }
                    }
                }
            }
        }
        .right-part1 {
            width: 25%;
            height: 100%;
            padding: 20px;
            box-sizing: border-box;
            .right-part-top {
                width: 100%;
                height: 50px;
                line-height: 50px;
                .el-input {
                    // width: 80%;
                    margin-left: 10%;
                    // background-image: url(../../assets/img/yqjc/24.png);
                    // background-repeat: no-repeat;
                    // background-size: 100% 100%;
                }
                input {
                    // width: 150px;
                    border: none;
                    background: transparent;
                }
            }
            .right-part-center {
                width: 100%;
                height: calc(100% - 100px);
                padding: 10px;
                overflow-y: auto;
                box-sizing: border-box;
                .right-part-center-img {
                    width: 100%;
                    height: 130px;
                    margin-top: 5px;
                    .right-part-center-img-title {
                        width: 80%;
                        height: 30px;
                        text-align: center;
                    }
                    .el-image {
                        width: 80%;
                        height: 100px;
                        box-shadow: 0 2px 12px 0 #ddd;
                    }
                    i {
                        float: right;
                        margin-top: 40px;
                        margin-right: 8px;
                        font-size: 25px;
                        color: #5470c6;
                    }
                }
            }
            .right-part-bottom {
                width: 100%;
                height: 50px;
                display: -webkit-box;
                .button-preview {
                    width: 100px;
                    height: 30px;
                    line-height: 30px;
                    margin-left: calc(50% - 110px);
                    margin-top: 10px;
                    font-size: 14px;
                    text-align: center;
                    cursor: pointer;
                    background-image: url(../../assets/img/yqjc/40.png);
                    background-repeat: no-repeat;
                    background-size: 100% 100%;
                }
                .button-cancel {
                    width: 100px;
                    height: 30px;
                    line-height: 30px;
                    margin-left: 20px;
                    margin-top: 10px;
                    text-align: center;
                    cursor: pointer;
                    background-image: url(../../assets/img/yqjc/41.png);
                    background-repeat: no-repeat;
                    background-size: 100% 100%;
                }
            }
        }
        .discuss-detail {
            width: 100%;
            height: 100%;
            padding: 20px;
            box-sizing: border-box;
            overflow-y: auto;
            .discuss-detail-choice {
                width: 100%;
                input {
                    width: 150px;
                    border: none;
                    background: transparent;
                }
            }
            .back-img {
                width: 40px;
                height: 40px;
                // float: right;
                // margin-top: -10px;
                // margin-right: 25px;
                cursor: pointer;
                position: fixed;
                right: 100px;
                top: 100px;
            }
            .discuss-part-one {
                width: 100%;
                margin-top: 30px;
                .discuss-part-one-title {
                    width: 80%;
                    height: 60px;
                    font-size: 22px;
                    padding-left: 15px;
                    box-sizing: border-box;
                    background-image: url(../../assets/img/yqjc/43.png);
                    background-repeat: no-repeat;
                    background-size: 100% 100%;
                }
                .discuss-part-one-content {
                    width: 100%;
                    .part-one-text{
                        max-height: 500px;
                        overflow-y: auto;
                    }
                    .part-one-img {
                        width: 100%;
                        margin-top: 30px;
                    }
                    .el-image {
                        margin-left: 5%;
                    }
                    .el-image:nth-child(2) {
                        margin-left: 10%;
                    }
                }
            }
            .discuss-part-two {
                width: 100%;
                // height: 80%;
                margin-top: 30px;
                .discuss-part-two-title {
                    width: 100%;
                    height: 40px;
                    // line-height: 40px;
                    font-size: 22px;
                    padding-left: 35px;
                    box-sizing: border-box;
                    background-image: url(../../assets/img/yqjc/44.png);
                    background-repeat: no-repeat;
                    background-size: 100% 100%;
                }
                .discuss-part-two-content {
                    width: 100%;
                    height: 500px;
                    margin-top: 30px;
                    display: -webkit-box;
                    .part-two-left {
                        width: 50%;
                        text-align: center;
                        .part-two-left-title {
                            width: 150px;
                            height: 40px;
                            line-height: 35px;
                            margin-left: calc(50% - 75px);
                            background-image: url(../../assets/img/yqjc/46.png);
                            background-repeat: no-repeat;
                            background-size: 100% 100%;
                        }
                        .part-two-left-content {
                            width: 100%;
                            // height: 70%;
                            height: calc(50% - 20px);
                            // margin-top: 10px;
                            padding: 20px 45px;
                            box-sizing: border-box;
                            background-image: url(../../assets/img/yqjc/45.png);
                            background-repeat: no-repeat;
                            background-size: 100% 100%;
                            .part-two-left-content-title {
                                font-size: 18px;
                                font-weight: 700;
                            }
                            .part-two-left-content-text {
                                height: calc(100% - 40px);
                                font-size: 15px;
                                margin-top: 10px;
                                overflow-y: auto;
                                text-align: left;
                            }
                        }
                    }
                    .part-two-right {
                        width: 50%;
                        text-align: center;
                        .part-two-right-title {
                            width: 150px;
                            height: 40px;
                            line-height: 35px;
                            margin-left: calc(50% - 75px);
                            background-image: url(../../assets/img/yqjc/46.png);
                            background-repeat: no-repeat;
                            background-size: 100% 100%;
                        }
                        .part-two-right-content {
                            width: 100%;
                            height: calc(100% - 35px);
                            padding: 20px 45px;
                            box-sizing: border-box;
                            background-image: url(../../assets/img/yqjc/45.png);
                            background-repeat: no-repeat;
                            background-size: 100% 100%;
                            .part-two-right-content-title {
                                font-size: 18px;
                                font-weight: 700;
                            }
                            .part-two-right-content-text {
                                height: calc(100% - 40px);
                                font-size: 15px;
                                margin-top: 10px;
                                overflow-y: auto;
                                text-align: left;
                            }
                        }
                    }
                }
            }
            .discuss-part-three {
                width: 100%;
                margin-top: 30px;
                .part-three-title {
                    width: 100%;
                    height: 40px;
                    // line-height: 40px;
                    font-size: 22px;
                    padding-left: 35px;
                    box-sizing: border-box;
                    background-image: url(../../assets/img/yqjc/44.png);
                    background-repeat: no-repeat;
                    background-size: 100% 100%;
                }
                .part-three-content {
                    width: 100%;
                    margin-top: 30px;
                    .part-three-content-top {
                        width: 100%;
                        margin-top: 30px;
                        display: -webkit-box;
                        .part-three-content-top-left {
                            width: 50%;
                            height: 70%;
                            padding: 20px 40px;
                            box-sizing: border-box;
                            background-image: url(../../assets/img/yqjc/45.png);
                            background-repeat: no-repeat;
                            background-size: 100% 100%;
                        }
                        .part-three-content-top-right {
                            width: 50%;
                            height: 300px;
                        }
                    }
                    .part-three-content-bottom {
                        width: 100%;
                        margin-top: 30px;
                        .part-three-content-bottom-title {
                            width: 100%;
                            height: 40px;
                            // line-height: 40px;
                            font-size: 22px;
                            padding-left: 35px;
                            box-sizing: border-box;
                            background-image: url(../../assets/img/yqjc/44.png);
                            background-repeat: no-repeat;
                            background-size: 100% 100%;
                        }
                        .part-three-content-bottom-content {
                            width: 100%;
                            margin-top: 30px;
                            height: 340px;
                            padding: 54px 40px;
                            box-sizing: border-box;
                            background-image: url(../../assets/img/yqjc/48.png);
                            background-repeat: no-repeat;
                            background-size: 100% 100%;
                        }
                    }
                }
            }
        }
    }

    //报告弹出框样式
    .report-info-name {
        text-align: center;
        input {
            width: 20%;
        }
    }

    .report-info-title {
        margin-top: 20px;
    }
    .report-info-content {
        height: 100px;
        margin-top: 20px;
        textarea {
            height: 100%;
        }
    }

    .report-info-chart {
        margin-top: 20px;
    }

    .report-info-chart-title {
        margin-top: 20px;
    }
    .report-info-chart-content {
        margin-top: 20px;
        text-align: center;
        border: 1px solid #ddd;
        img {
            width: 100%;
            height: 45%;
            margin-top: 20px;
        }
        .img-title {
            position: relative;
            top: -33px;
            color: white;
        }
        textarea {
            width: 90%;
            height: 100px;
            margin-left: 5%;
            margin-bottom: 20px;
        }
    }

    .dialogZtgl {
        & > .el-dialog {
            height: 60%;
            color: white;
            background: url(../../assets/img/main/background.png) no-repeat;
            background-size: 100% 100%;
        }
        .el-dialog__body{
            padding: 0px;
        }
    }
}
</style>
