HM21St
/
HM21St_Page_User


			
							123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367368369370371372373374375376377378379380381382383384385386387388389390391392393394395396397398399400401402403404405406407408409410411412413414415416417418419420421422423424425426427428429430431432433434435436437438439440441442443444445446447448449450451452453454455456457458459460461462463464465466467468469470471472473474475476477478479480481482483484485486487488489490491492493494495496497498499500501502503504505506507508509510511512513514515516517518519520521522523524525526527528529530531532533534535536537538539540541542543544545546547548549550551552553554555556557558559560561562563564565566567568569570571572573574575576577578579580581582583584585586587588589590591592593594595596597598599600601602603604605606607608609610611612613614615616617618619620621622623624625626627628629630631632633634635636637638639640641642643644645646647648649650651652653654655656657658659660661662663664665666667668669670671672673674675676677678679680681682683684685686687688689690691692693694695696697698699700701702703704705706707708709710711712713714715716717718719720721722723724725726727728729730731732733734735736737738739740741742743744745746747748749750751752753754755756757758759760761762763764765766767768769770771772
							<!DOCTYPE html>
<html>

<head>
    <meta http-equiv="Access-Control-Allow-Origin" content="*">

    <meta charset="utf-8" />
    <title>词云</title>
    <link rel="stylesheet" href="./layui/css/layui.css">
    <script src="./js/jquery-1.11.3.js"></script>
    <script type="text/javascript" src="./js/saveSvgAsPng.js"></script>
    <script type="text/javascript" src="./layer/layer.js"></script>
    <script type="text/javascript" src="./layui/layui.js"></script>
    <link rel="stylesheet" href="./css/common.css">
    <link rel="stylesheet" href="./css/jiaocai.css">
    <link rel="stylesheet" href="./css/font/font.css">
    <script src="../config.js"></script>
    <style type="text/css">
        body,
        html {
            min-width: 850px;
            overflow: hidden;
        }
        
        .content-inner {
            width: 850px;
        }
        
        #stop:hover {
            text-decoration: underline;
            color: #FF0000;
        }
        
        .shadow {
            position: absolute;
            width: 100%;
            height: 100%;
            left: 0;
            top: 0;
            background: rgba(0, 0, 0, 0.3);
        }
        
        .stop_word_table {
            width: 413px;
            position: fixed;
            top: 5%;
            left: 37%;
            background: #FFFFFF;
            border: 1px solid rgba(0, 0, 0, 0.1);
            padding: 24px;
        }
        
        .stop_word_table .title {
            display: flex;
            justify-content: space-between;
            align-items: center;
            font-weight: bold;
            font-size: 16px;
            color: #000000;
            padding-bottom: 16px;
            border-bottom: 1px solid rgba(0, 0, 0, 0.06);
        }
        
        .stop_word_table .title img {
            width: 24px;
            height: 24px;
            cursor: pointer;
        }
        
        .stop_word_table .top {
            display: flex;
            align-items: center;
            margin-top: 16px;
        }
        
        .stop_word_table .top input {
            width: 278px;
            height: 40px;
            border: 1px solid #000000;
            outline: none;
        }
        
        .stop_word_table .top button {
            width: 87px;
            height: 40px;
            background: #000000;
            text-align: center;
            font-weight: bold;
            font-size: 16px;
            line-height: 40px;
            color: #ffffff;
            cursor: pointer;
            border: none;
        }
        
        .stop_word_table .main {
            margin-top: 16px;
            max-height: 340px;
            overflow: hidden;
            overflow-y: scroll;
        }
        
        .stop_word_table .one {
            display: flex;
            justify-content: space-between;
            font-size: 16px;
            color: #000000;
            height: 34px;
            line-height: 34px;
            padding: 0 8px;
        }
        
        .stop_word_table .right span {
            cursor: pointer;
        }
        
        .stop_word_table .main> :nth-child(2n) {
            background: #ffffff;
        }
        
        .stop_word_table .main> :nth-child(2n-1) {
            background: #f8f8f8;
        }
        
        .stop_word_table .bottom {
            display: flex;
            justify-content: space-between;
            margin-top: 16px;
        }
        
        .stop_word_table .bottom button {
            width: 173.5px;
            height: 48px;
            font-weight: bold;
            font-size: 16px;
            border: none;
            cursor: pointer;
        }
        
        .stop_word_table .bottom .close {
            background: #ebebeb;
            color: #000000;
        }
        
        .stop_word_table .bottom .add {
            background: #000000;
            color: #ffffff;
        }
    </style>
</head>

<body>
    <div class="wraps">

        <div class="contents">
            <div class="content-inner" style="padding: 0;">
                <div class="cloudDiv">
                    <!-- <div class="cloud-copyright">Copyright © Jason Davies</div> -->
                    <div class="cloud-con-div" id="cloudDiv"></div>
                </div>
            </div>
        </div>
    </div>


    <script src="./js/d3.min.js"></script>
    <script src="./js/cloud.min.js"></script>
    <script type="text/javascript">
        var stopWordList = null;
        var oldstopWordList = [];
        $(function() {
            initStopWords();
            jiekouData();
        })
        let query = location.href.split("?");
        let arr = query[1].split("&");
        var articleId = null;
        var searchType = null;
        var old_searchType = null
        var W_stopWordStatus = null
        var prefix = 'HM21St_User_Token='
        var start = document.cookie.indexOf(prefix)
        var end = document.cookie.indexOf(";", start + prefix.length)
        if (end == -1) {
            end = document.cookie.length;
        }
        var AccessToken = JSON.parse(unescape(document.cookie.substring(start + prefix.length, end))).access_token

        arr.forEach((item) => {
            if (item.split("=")[0] == "articleId") {
                articleId = item.split("=")[1];
            }
            if (item.split("=")[0] == "searchType") {
                searchType = item.split("=")[1];
                old_searchType = item.split("=")[1];
            }
        });
        // 如果是词汇  默认选中词
        if (old_searchType == 2) {
            $(".danwei div").removeClass("radio-active");
            $(".danwei").find("div").eq(1).addClass("radio-active")
        }
        if (old_searchType == 0) {
            $("#font").attr("value", "Arial");
            $(".danwei div").removeClass("radio-active");
            searchType = 3
            $(".danwei").find("div").eq(1).addClass("radio-active")
            for (let i = 0; i < $("#fontSel").children().length; i++) {
                if ($("#fontSel").children().eq(i)[0].value == "Arial") {
                    $("#fontSel").children().eq(i)[0].selected = true;
                } else {
                    $("#fontSel").children().eq(i)[0].selected = false;
                }
            }
        } else {
            $("#font").attr("value", "Arial");
            for (let i = 0; i < $("#fontSel").children().length; i++) {
                if ($("#fontSel").children().eq(i)[0].value == "Arial") {
                    $("#fontSel").children().eq(i)[0].selected = true;
                } else {
                    $("#fontSel").children().eq(i)[0].selected = false;
                }
            }
        }


        function getdata() {
            let data = {
                type: 0,
                id: articleId,
                stopWordStatus: W_stopWordStatus,
            }
            $.ajax({
                url: window.location.href.substring(0, window.location.href.indexOf('/#/')) + "/PaperServer/Client/Article/CalcArtWordCloud?AccessToken=" + AccessToken,
                // url: "/i21st-newspaper-management-test/api/article/detail/wordCloud",
                data: JSON.stringify(data),
                contentType: "application/json",
                dataType: "json",
                type: "post",
                success: function(res) {
                    let str = ''
                    res.data.forEach(item => {
                        if (item.word.indexOf(" ") != -1) {
                            item.word = item.word.replace(" ", "")
                        }
                        str += item.word + " "
                    })
                    ciyunData = res.data
                    text = str
                    $("#text").val(text);
                    $("#go").trigger("click");
                    console.log("2022-11-09 14点55分");
                }
            })
        }


        function initContent() {
            var dataType = $("#dataType").val();
            var ruleType = $("#rule").val();
            var fileId = "${fileId}";
            // $.ajax({
            //   url: "${ctx}/bc/textKeyWords/wordCloud",
            //   data: { "fileId": fileId, "ruleType": ruleType },
            //   dataType: "JSON",
            //   Type: "POST",
            //   success: function (data) {
            let data = {
                count: 0,
                flag: true,
                jsonObject: null,
                listStr: [{
                    frequency: 3,
                    level: "L1",
                    posStr: "[\"noun\"]",
                    rate: "2762.15",
                    word: "mine",
                }, {
                    frequency: 2,
                    level: "L0",
                    posStr: "[\"adj\"]",
                    rate: "996.51",
                    word: "nice",
                }, {
                    frequency: 3,
                    level: "L0",
                    posStr: "[\"noun\"]",
                    rate: "340.09",
                    word: "house",
                }, {
                    frequency: 2,
                    level: "L0",
                    posStr: "[\"noun\"]",
                    rate: "251.11",
                    word: "friend",
                }],
                message: null,
                objects: null,
                userList: null,
                arr: ['5', '6', 'I', 'I', 'I', 'I', 'I', 'I', 'I', 'a', 'Hi', 'Is', 'It', 'My', 'am', 'is', 'I', 'I', 'I', 'I', 'I', 'I', 'I', 'my', 'my', 'my', 'my', 'my', 'my', 'Are', 'She', 'are', 'big', 'you', 'you', 'you', 'you', 'you', 'They', 'This', 'mine', 'mine', 'mine', 'name', 'nice', 'tall', 'than', 'than', 'than', 'than', 'than', 'than', 'than', 'than', 'than', 'than', 'very', 'very', 'very', 'very', 'you', 'you', 'you', 'you', 'you', 'Giant', 'Kendo', 'These', 'funny', 'house', 'house', 'house', 'nicer', 'think', 'think', 'three', 'yours', 'yours', 'yours', 'bigger', 'meters', 'school', 'school', 'taller', 'friends', 'funnier', 'teacher', 'teacher', 'younger', 'friendly', 'nineteen', 'friendlier', 'qinpeng']
            }
            if (data.flag) {
                var $stop = $(".stop");
                var stopFlag = $stop.hasClass("checkbox-active"); //选择了停用
                // if (!stopFlag) {
                //   stopWordLists = null;
                // }
                // if (ruleType == 1) {
                //     var themeList = data.listStr;
                //     text = themeDeal(themeList, stopWordLists);
                // } else {
                // var object = data.jsonObject;
                // var words = "";
                // if (dataType == "Word") {
                //     words = object['wordList'];
                // } else {
                //     words = object['lemmaList'];
                // }
                let str = ''
                data.arr.forEach(item => {
                        str += item + " "
                    })
                    // text = replaceStop(words, stopWordLists);
                    // }
                text = str
                $("#text").val(text);
                $("#go").trigger("click");
            } else {
                layer.alert(data.message);
            }
            // }, error: function (jqXHR, textStatus, errorThrown) {
            //   if (jqXHR.status == 401) {
            //     var url = jqXHR.responseText;
            //     layer.alert('会话已过期，请重新登陆。', function (index) {
            //       layer.close(index);
            //       location.reload();
            //     });
            //   } else {
            //     layer.alert("网络异常,请稍后重试。(" + errorThrown + ")");
            //   }
            // }
            //   })
        }

        function initStopWords() {
            $.ajax({
                url: window.location.href.substring(0, window.location.href.indexOf('/#/')) + "/PaperServer/Client/Article/CalcArtWordCloud_stopWordList?AccessToken=" + AccessToken,
                // url: "/i21st-newspaper-management-test/api/user/stopVocab/get",
                data: JSON.stringify({}),
                contentType: "application/json;charset=UTF-8",
                dataType: "json",
                type: "post",
                success: function(res) {
                    let arr = []
                    res.data.result.forEach(item => {
                        arr.push(item.word)
                    })
                    oldstopWordList = JSON.parse(JSON.stringify(arr))
                    stopWordList = JSON.parse(JSON.stringify(arr))
                    $("#allwordnumber").text(oldstopWordList.length)
                    changeWordData()
                },
                error: function(jqXHR, textStatus, errorThrown) {
                    if (jqXHR.status == 401) {
                        var url = jqXHR.responseText;
                        layer.alert('会话已过期，请重新登陆。', function(index) {
                            layer.close(index);
                            location.reload();
                        });
                    } else {
                        layer.alert("网络异常,请稍后重试。(" + errorThrown + ")");
                    }
                }
            });
        }


        $(".rule div").click(function() {
            $(".rule div").removeClass("radio-active");
            $(this).addClass("radio-active");
            $("#rule").attr("value", $(this).attr("value"))
            initContent();
        })

        $(".styleType div").click(function() {
                $(".styleType div").removeClass("radio-active");
                $(this).addClass("radio-active");
                $("#spiral").attr("value", $(this).attr("value"));
                $("#go").trigger("click");
            })
            // 切换单位
        $(".danwei div").click(function() {
            $(".danwei div").removeClass("radio-active");
            $(this).addClass("radio-active");
            var value = $(this).attr("value");
            let newvalue = null
            if (old_searchType == 0) { //拼音
                if (value == 'zi') {
                    newvalue = 0
                } else {
                    newvalue = 3

                }
            } else if (old_searchType == 2) {
                if (value == 'zi') {
                    newvalue = 1
                } else {
                    newvalue = 2
                }
            } else {
                if (value == 'zi') {
                    newvalue = 1
                } else {
                    newvalue = 4
                }
            }
            searchType = newvalue
            getdata()
        })
        $(".fontDriect div").click(function() {
            $(".fontDriect div").removeClass("radio-active");
            $(this).addClass("radio-active");
            var value = $(this).attr("value");
            if (value == 1) {
                $("#angle-from").val(0);
                $("#angle-to").val(0);
                $("#angle-count").val(1);
                inChange();
                $("#go").click();
                $("#angles svg").remove();
            } else if (value == 2) {
                $("#angle-from").val(90)
                $("#angle-to").val(90)
                $("#angle-count").val(1);
                inChange();
                $("#go").click();
                $("#angles svg").remove();
            } else if (value == 3) {
                $("#angle-from").val(0)
                $("#angle-to").val(90)
                $("#angle-count").val(2);
                inChange();
                $("#go").click();
                $("#angles svg").remove();
            }
        })


        $(".scaleSel div").click(function() {

            $(".scaleSel div").removeClass("radio-active");
            $(this).addClass("radio-active");
            var value = $(this).attr("value");
            $("#scale").attr("value", value);
            $("#go").trigger("click");
        })


        $("#fontSel").change(function() {
            var value = $(this).children('option:selected').val();
            $("#font").attr("value", value);
            $("#go").trigger("click");
        })

        $("#download-png").click(function() {
            var el = d3.select("#cloudDiv").node().children[0];
            saveSvgAsPng(el, "词云.png");
        })


        // $(".stopWordList").click(function () {
        //     var openy = layer.open({
        //         title: '停用词表'
        //         , title: false
        //         , content: '${ctx}/bc/textKeyWords/stopWordListHtml?fileId=${fileId}'
        //         , area: ['440px', '595px']
        //         , type: 2
        //         , closeBtn: 0
        //     });
        //     initStopWords();
        // })
        $("#dataTypeSel").change(function() {
            var selvalue = $(this).children('option:selected').val();
            // var ruleVlue = $("#rule").attr("value");
            // $("#dataType").attr("value", selvalue);
            // initContent();
            jiekouData()
        });
        $(".stop").click(function() {
            var $stop = $(".stop");
            if ($stop.hasClass("checkbox-active")) {
                $stop.removeClass("checkbox-active");
            } else {
                $stop.addClass("checkbox-active");
            }
            jiekouData()

        })
        $(".biglittle").click(function() {
            var $stop = $(".biglittle");
            if ($stop.hasClass("checkbox-active")) {
                $stop.removeClass("checkbox-active");
            } else {
                $stop.addClass("checkbox-active");
            }
            jiekouData()
        })

        function jiekouData() {
            var $biglittle = $(".biglittle");
            var $stop = $(".stop");
            let isSelectCaseSensitive = false
            let isSelectLemma = false
            let stopWordStatus = false
            if ($biglittle.hasClass("checkbox-active")) {
                isSelectCaseSensitive = true
            } else {
                isSelectCaseSensitive = false
            }
            if ($stop.hasClass("checkbox-active")) {
                stopWordStatus = 1
            } else {
                stopWordStatus = 0
            }
            var selvalue = $("#dataTypeSel").children('option:selected').val();
            if (selvalue == 'Lemma') {
                isSelectLemma = true;
            } else {
                isSelectLemma = false;
            }
            W_stopWordStatus = stopWordStatus
            getdata()
        }

        function replaceStop(words, stopWordList) {
            var text = "";
            var wordListLow = new Array();
            if (stopWordList != null) {
                for (var i = 0; i < stopWordList.length; i++) {
                    wordListLow.push(stopWordList[i].toLowerCase());
                }
            }
            for (var i = 0; i < words.length; i++) {
                var wordList = words[i];
                var word = wordList[0];
                var count = wordList[1];
                if (wordListLow.indexOf(word) < 0) {
                    for (var j = 0; j < count; j++) {
                        text += word + " ";
                    }
                }
            }
            return text;
        }


        function themeDeal(theme, stopWordList) {
            var text = "";
            var wordListLow = new Array();
            if (stopWordList != null) {
                for (var i = 0; i < stopWordList.length; i++) {
                    wordListLow.push(stopWordList[i].toLowerCase());
                }
            }
            for (var i = 0; i < theme.length; i++) {
                var themeWord = theme[i];
                var word = themeWord['word'];
                var flag = false;
                if (wordListLow.indexOf(word.toLowerCase()) > -1) {
                    flag = true;
                }
                if (!flag) {
                    var rate = Math.round(themeWord['rate']);
                    for (var j = 0; j < rate; j++) {
                        text += word + " ";
                    }
                }
            }
            return text;
        }
        // 停用词表
        $("#stop").click(function() {
                $("#shadow").show()
                changeWordData()
            })
            // 处理词表数据
        var editOldVal = ""

        function changeWordData(msg, arr) {
            if (arr) {
                stopWordList = JSON.parse(JSON.stringify(arr));
            } else {
                stopWordList = JSON.parse(JSON.stringify(oldstopWordList));
            }
            $("#stop_word_table").empty()
            for (let i = 0; i < stopWordList.length; i++) {
                let node = ` <div class="one">
                        <div>${stopWordList[i]}</div>
                        <div class="right">
                            <span style="margin-right: 24px" id="edit${i}" @click="edit(item)">编辑</span>
                            <span @click="deleteOne(item, i)" id="delete${i}">删除</span>
                        </div>
                    </div>`
                $("#stop_word_table").append(node)
                $(`#edit${i}`).click(function() {
                    $("#editwordDom").show()
                    $("#wordTable").hide()
                    $("#editwordContent").val(stopWordList[i])
                    editOldVal = stopWordList[i]
                })
                $(`#delete${i}`).click(function() {
                    oldstopWordList.forEach((item, i) => {
                        if (stopWordList[i] == item) {
                            oldstopWordList.splice(i, 1)
                        }
                    })
                    updatawordData()
                })
            }
            if (msg) {
                layer.msg("成功")
            }
        }

        function updatawordData() {
            let userStopVocab = JSON.parse(JSON.stringify(oldstopWordList));
            $.ajax({
                url: window.location.href.substring(0, window.location.href.indexOf('/#/')) + "/PaperServer/Client/Article/CalcArtWordCloud_stopWordSave?AccessToken=" + AccessToken,
                // url: "/i21st-newspaper-management-test/api/user/stopVocab/update",
                data: JSON.stringify({
                    tenantId: "",
                    wordList: userStopVocab
                }),
                contentType: "application/json;charset=UTF-8",
                dataType: "json",
                type: "post",
                success: function(data) {
                    let val = $("#wordContent").val()
                    if (val != "") {
                        $("#seekWordBtn").click()
                    } else {
                        changeWordData("msg")

                    }
                },
                error: function(jqXHR, textStatus, errorThrown) {
                    if (jqXHR.status == 401) {
                        var url = jqXHR.responseText;
                        layer.alert('会话已过期，请重新登陆。', function(index) {
                            layer.close(index);
                            location.reload();
                        });
                    } else {
                        layer.alert("网络异常,请稍后重试。(" + errorThrown + ")");
                    }
                }
            })
        }
        // 搜索 
        $("#seekWordBtn").click(function() {
                let val = $("#wordContent").val()
                let arr = []
                if (val == "") {
                    stopWordList = JSON.parse(JSON.stringify(oldstopWordList))
                    changeWordData("msg")

                } else {
                    oldstopWordList.forEach((item, i) => {
                            if (item.indexOf(val) != -1) {
                                arr.push(item);
                            }
                        })
                        // stopWordList = JSON.parse(JSON.stringify(arr))
                    changeWordData("msg", arr)
                }
            })
            // 清空
        $("#emptyWord").click(function() {
                oldstopWordList = []
                updatawordData()
            })
            // 关闭
        $("#closeWord").click(function() {
                $("#shadow").hide()
                getdata()
            })
            // 新增 addWord
        $("#addWord").click(function() {
                $("#addwordDom").show()
                $("#wordTable").hide()
                $("#addwordContent").val("")
            })
            // 确定新增 addSubmit
        $("#addSubmit").click(function() {
                let val = $("#addwordContent").val()
                if (val == '') {
                    layer.msg("请输入内容")
                    return
                } else {
                    let flag = false;
                    oldstopWordList.forEach(item => {
                        if (item == val) {
                            flag = true
                        }
                    })
                    if (flag) {
                        layer.msg("该词已经存在，请勿重复添加")
                        return
                    }
                    oldstopWordList.unshift(val)
                    stopWordList.unshift(val)
                    $("#wordTable").show()
                    $("#addwordDom").hide()
                    updatawordData()
                }
            })
            // 确定修改
        $('#editSubmit').click(function() {
                let val = $("#editwordContent").val()
                if (val == '') {
                    layer.msg("请输入内容")
                    return
                } else {
                    let flag = false;
                    oldstopWordList.forEach(item => {
                        if (item == val) {
                            flag = true
                        }
                    })
                    if (flag) {
                        layer.msg("该词已经存在，请勿重复添加")
                        return
                    }
                    let arr = JSON.parse(JSON.stringify(oldstopWordList))
                    let index = null
                    arr.forEach((item, i) => {
                        if (item == editOldVal) {
                            index = i
                        }
                    })
                    arr[index] = val
                    oldstopWordList = JSON.parse(JSON.stringify(arr))
                    stopWordList = JSON.parse(JSON.stringify(arr))
                    $("#wordTable").show()
                    $("#editwordDom").hide()
                    updatawordData()
                }
            })
            // 关闭新增词
        $("#closeWordadd").click(function() {
            $("#wordTable").show()
            $("#addwordDom").hide()
        })
        $("#canceladd").click(function() {
                $("#wordTable").show()
                $("#addwordDom").hide()
            })
            // 关闭编辑
        $("#closeWordedit").click(function() {
            $("#wordTable").show()
            $("#editwordDom").hide()
        })
        $("#canceledit").click(function() {
            $("#wordTable").show()
            $("#editwordDom").hide()
        })
    </script>

</body>

</html>