云办编辑器

优化云办的编辑器功能

目前為 2020-12-08 提交的版本,檢視 最新版本

// ==UserScript==
// @name         云办编辑器
// @namespace    http://tampermonkey.net/
// @version      0.2
// @description  优化云办的编辑器功能
// @require      https://cdn.jsdelivr.net/npm/[email protected]/dist/jquery.min.js
// @require      https://cdn.jsdelivr.net/npm/[email protected]/lodash.min.js
// @author       [email protected]
// @include      *://172.17.**/*
// @include      *://pkc.cestc.cn/*
// @grant        GM_xmlhttpRequest
// ==/UserScript==

(function () {
  (function () {
    // 修改编辑器的默认字体
    const style = document.createElement("style");
    style.type = "text/css";
    style.id = "_wjp_";
    const text = document.createTextNode(".ace_editor.ace_editor{font-family: 'Courier New', 'Cascadia Code', Hack, Monaco; font-size: 18px;}");
    style.appendChild(text);
    const head = document.getElementsByTagName("head")[0];
    head.appendChild(style);
  })();

  (function () {
    // 点击左右编辑框,自动设置宽度
    const PERCENT = 0.66;
    const WIDE = 100 * PERCENT + '%';
    const NARROW = 100 * (1 - PERCENT) + '%';
    $(document).on('dblclick', '.splitter-paneL .el-tabs__content', function (e) {
      e && e.stopPropagation();
      const width = parseFloat($(e.currentTarget).closest('.splitter-paneL').attr('style').replace(/[A-Za-z:\s%]/g, ''));
      if (width > 100 * PERCENT) {
        return;
      }
      $('.splitter-paneL').css('width', WIDE);
      $('.splitter-pane-resizer').css('left', WIDE);
      $('.splitter-paneR').css('width', NARROW);
    }).on('dblclick', '.splitter-paneR .el-tabs__content', function (e) {
      e && e.stopPropagation();
      const width = parseFloat($(e.currentTarget).closest('.splitter-paneR').attr('style').replace(/[A-Za-z:\s%]/g, ''));
      if (width > 100 * PERCENT) {
        return;
      }
      $('.splitter-paneL').css('width', NARROW);
      $('.splitter-pane-resizer').css('left', NARROW);
      $('.splitter-paneR').css('width', WIDE);
    });
  })();

  function getQuery(name, url) {
    var u = url || window.location.search,
      reg = new RegExp('(^|&)' + name + '=([^&]*)(&|$)'),
      r = u.substr(u.indexOf('\?') + 1).match(reg);
    return r != null ? r[2] : '';
  }

  (function () {
    // 给页面增加搜索功能

    let dataMap = [];

    setInterval(() => {
      const len = $('#_mySearch_').length;
      const modelCode = getQuery('funcgroupCode');
      if (!len && modelCode) {
        const Token = localStorage.getItem('token');
        GM_xmlhttpRequest({
          method: 'get',
          url: '/pkc/page/all/' + modelCode,
          headers: {
            'Content-Type': 'application/json',
            'Token': Token,
          },
          onload: function (resp) {
            if (resp.status === 200 && resp.readyState === 4) {
              const response = JSON.parse(resp.response);
              const {
                code,
                data,
              } = response;
              if (code === '200010000') {
                const len = $('#_mySearch_').length;
                if (data && data.length && !len) {
                  $('<div id="_mySearch_" class="el-input el-input--medium el-input--suffix" style="width:400px;"><input type="text" autocomplete="off" placeholder="请输入关键字(可搜索组件里面的内容)" class="el-input__inner"></div>').insertBefore('.topOperate>button')
                  data.map(item => {
                    dataMap[item.componentName] = item;
                  });
                }
              }
            }
          }
        });
      }
    }, 2000);

    $(document).on('input', '#_mySearch_ input', _.debounce(function (e) {
      let value = $(e.currentTarget).val().trim();
      let lowerValue = value.toLowerCase();
      const $rows = $('#editableTable .el-table__body-wrapper>.el-table__body>tbody>.el-table__row');
      for (let i = 0; i < $rows.length; i++) {
        const $row = $rows.eq(i);
        let componentName = $row.children('td').eq(1).text().trim();
        const currentData = dataMap[componentName];
        if (value) {
          let shouldHidden = true;
          // 先搜索页面里面的内容
          let html, css, js;
          if (currentData.endType == 2) {
            html = currentData.moveHtml || '';
            css = currentData.moveCss || '';
            js = currentData.moveJs || '';
          } else {
            html = currentData.pcHtml || '';
            css = currentData.pcCss || '';
            js = currentData.pcJs || '';
          }
          if (html.indexOf(value) > -1 || css.indexOf(value) > -1 || js.indexOf(value) > -1) {
            shouldHidden = false;
          }

          // 如果当前页面里面没有,则搜索当前页面
          if (shouldHidden) {
            const $tds = $row.children('td');
            for (let j = 0; j < $tds.length; j++) {
              const text = $tds.eq(j).text().trim().toLowerCase();
              if (text.indexOf(lowerValue) > -1) {
                shouldHidden = false;
                break;
              }
            }
          }

          if (shouldHidden) {
            $row.css('display', 'none');
          } else {
            $row.css('display', '');
          }
        } else {
          $row.css('display', '');
        }
      }
    }, 600));
  })();

})();