simple-frame-unit 1.0.2

package/src/components/ed-base-vue/package/EdJsonEditor/src/assets/plus.svg

@@ -0,0 +1 @@
+<?xml version="1.0" standalone="no"?><!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd"><svg t="1523765571855" class="icon" style="" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="1927" xmlns:xlink="http://www.w3.org/1999/xlink" width="16" height="16"><defs><style type="text/css"></style></defs><path d="M63.989383 105.442494l0 268.396843c0 18.935258 15.368012 34.304294 34.304294 34.304294 18.936281 0 34.304294-15.369036 34.304294-34.304294L132.597971 180.156126l218.107483 218.176045c12.82919 12.830213 33.618679 12.830213 46.515407 0 12.830213-12.897751 12.830213-33.686217 0-46.51643l-218.176045-218.107483 193.683211 0c18.935258 0 34.304294-15.369036 34.304294-34.304294 0-18.935258-15.369036-34.304294-34.304294-34.304294L104.331183 65.09967C79.288834 65.09967 63.989383 77.999468 63.989383 105.442494L63.989383 105.442494z" p-id="1928" fill="#e6e6e6"></path><path d="M917.688719 65.09967 649.290853 65.09967c-18.935258 0-34.304294 15.369036-34.304294 34.304294 0 18.936281 15.369036 34.304294 34.304294 34.304294l193.683211 0-218.176045 218.107483c-12.830213 12.82919-12.830213 33.618679 0 46.51643 12.897751 12.830213 33.686217 12.830213 46.515407 0L889.420909 180.156126l0 193.683211c0 18.935258 15.369036 34.304294 34.304294 34.304294 18.936281 0 34.304294-15.369036 34.304294-34.304294L958.029496 105.442494C958.029496 77.999468 942.79963 65.09967 917.688719 65.09967L917.688719 65.09967z" p-id="1929" fill="#e6e6e6"></path><path d="M104.331183 957.013353l268.397866 0c18.935258 0 34.304294-15.368012 34.304294-34.304294 0-18.936281-15.369036-34.304294-34.304294-34.304294L179.045839 888.404766l218.176045-218.107483c12.830213-12.82919 12.830213-33.618679 0-46.515407-12.897751-12.830213-33.686217-12.830213-46.515407 0l-218.107483 218.176045L132.598994 648.27471c0-18.935258-15.368012-34.304294-34.304294-34.304294-18.936281 0-34.304294 15.369036-34.304294 34.304294l0 268.397866C63.989383 944.115602 79.288834 957.013353 104.331183 957.013353L104.331183 957.013353z" p-id="1930" fill="#e6e6e6"></path><path d="M958.029496 916.671553 958.029496 648.27471c0-18.935258-15.368012-34.304294-34.304294-34.304294-18.935258 0-34.304294 15.369036-34.304294 34.304294l0 193.683211L671.313425 623.781876c-12.82919-12.830213-33.618679-12.830213-46.515407 0-12.830213 12.897751-12.830213 33.686217 0 46.515407l218.176045 218.107483L649.290853 888.404766c-18.935258 0-34.304294 15.368012-34.304294 34.304294 0 18.936281 15.369036 34.304294 34.304294 34.304294l268.397866 0C942.79963 957.013353 958.029496 944.115602 958.029496 916.671553L958.029496 916.671553z" p-id="1931" fill="#e6e6e6"></path></svg>

package/src/components/ed-base-vue/package/EdJsonEditor/src/hooks.js

@@ -0,0 +1,63 @@
+// jsonEditor组件属性列表
+const Basic_JSON_OPTIONS = [
+  "ajv",
+  "schema",
+  "schemaRefs",
+  "templates",
+  "ace",
+  "theme",
+  "autocomplete",
+  "onChange",
+  "onChangeJSON",
+  "onChangeText",
+  "onExpand",
+  "onEditable",
+  "onError",
+  "onEvent",
+  "onModeChange",
+  "onNodeName",
+  "onValidate",
+  "onCreateMenu",
+  "onSelectionChange",
+  "onTextSelectionChange",
+  "onClassName",
+  "onFocus",
+  "onBlur",
+  "colorPicker",
+  "onColorPicker",
+  "timestampTag",
+  "timestampFormat",
+  "escapeUnicode",
+  "history",
+  "search",
+  "mode",
+  "modes",
+  "name",
+  "indentation",
+  "sortObjectKeys",
+  "navigationBar",
+  "statusBar",
+  "mainMenuBar",
+  "languages",
+  "language",
+  "enableSort",
+  "enableTransform",
+  "limitDragging",
+  "maxVisibleChilds",
+  "onValidationError",
+  "modalAnchor",
+  "popupAnchor",
+  "createQuery",
+  "executeQuery",
+  "query Description",
+  "allowSchemaSuggestions"
+]
+
+// 默认属性
+export const OPTIONS = {
+  modes: ['code', 'form', 'text', 'tree', 'view', 'preview'], // 模式列表
+  search: false, // 是否显示搜索框
+  enableSort: true, // 是否显示排序
+  enableTransform: true, // 是否显示筛选
+  queryDescription: "输入JMESPath查询以筛选、排序或转换JSON数据。", // 筛选描述
+}

package/src/components/ed-base-vue/package/EdJsonViewer/index.js

@@ -0,0 +1,8 @@
+import EdJsonViewer from './src/EdJsonViewer.vue'
+
+/* istanbul ignore next */
+EdJsonViewer.install = function (Vue) {
+  Vue.component(EdJsonViewer.name, EdJsonViewer)
+}
+
+export default EdJsonViewer;

package/src/components/ed-base-vue/package/EdJsonViewer/src/EdJsonViewer.vue

@@ -0,0 +1,44 @@
+<template>
+  <JsonViewer :value="value || {}" v-bind="$props"></JsonViewer>
+</template>
+
+<script>
+import JsonViewer from 'vue-json-viewer'
+import 'vue-json-viewer/style.css';
+
+/**
+ * @see https://github.com/chenfengjw163/vue-json-viewer/blob/master/README_CN.md
+ */
+/**
+ * JSON查看器
+ * - 示例
+ *
+ * ```vue
+ * <ed-json-viewer v-model="value"></ed-json-viewer>
+ * ```
+ */
+export default {
+  name: "EdJsonViewer",
+  components: {JsonViewer},
+  props: {
+    // json对象的值，可以使用v-model，支持响应式
+    value: {type: [Object, Array, String, Number, Boolean, Function], require: true},
+    // 默认展开的层级
+    expandDepth: {type: Number, default: 1},
+    // 展示复制按钮，默认文案为：copy、copied!, 你可以设置一个对象{copyText: 'copy', copiedText: 'copied'} 来自定义复制按钮文案
+    copyable: {type: [Boolean, Object], default: false},
+    // 按照key排序展示
+    sort:{type: Boolean, default: false},
+    // 为组件添加一个盒样式
+    boxed: {type: Boolean, default: false},
+    // 添加一个自定义的样式class用作主题
+    theme: {type: String},
+    // 默认展开视图
+    expanded: {type: Boolean, default: false},
+  }
+}
+</script>
+
+<style scoped>
+
+</style>

package/src/components/ed-base-vue/package/EdLable/index.js

@@ -0,0 +1,8 @@
+import EdLabel from './src/index.vue'
+
+/* istanbul ignore next */
+EdLabel.install = function (Vue) {
+    Vue.component(EdLabel.name, EdLabel)
+}
+
+export default EdLabel

package/src/components/ed-base-vue/package/EdLable/src/index.vue

@@ -0,0 +1,34 @@
+<template>
+  <label v-if="isSlots" :for="labelFor" :form="form">
+    <slot></slot>
+  </label>
+  <label v-else :for="labelFor" :form="form" v-html="content"></label>
+</template>
+
+<script>
+export default {
+  name: "EdLabel",
+  props: {
+    for: {
+      type: String,
+      default: ""
+    },
+    form: {
+      type: String,
+      default: ""
+    },
+    content: {
+      type: String,
+      default: ""
+    }
+  },
+  computed: {
+    isSlots() {
+      return Object.keys(this.$slots).length > 0 || Object.keys(this.$scopedSlots).length > 0
+    },
+    labelFor() {
+      return this.for
+    }
+  }
+}
+</script>

package/src/components/ed-base-vue/package/EdLink/index.js

@@ -0,0 +1,8 @@
+import EdLink from './src/index.vue'
+
+/* istanbul ignore next */
+EdLink.install = function (Vue) {
+  Vue.component(EdLink.name, EdLink)
+}
+
+export default EdLink

package/src/components/ed-base-vue/package/EdLink/src/index.vue

@@ -0,0 +1,43 @@
+<template>
+  <el-link :disabled="disabled" :href="href" :icon="icon" :type="type" :underline="underline" class="ed-link"
+           @click="navTo">
+    <slot>{{ text }}</slot>
+  </el-link>
+</template>
+
+<script>
+export default {
+  name: "EdLink",
+  props: {
+    // 类型 primary / success / warning / danger / info
+    type: {type: String, default: "default"},
+    // 是否下划线
+    underline: {type: Boolean, default: true},
+    // 是否禁用状态
+    disabled: Boolean,
+    // 原生 href 属性
+    href: String,
+    // 图标类名
+    icon: String,
+    // 文字描述
+    text: String,
+    // 原生target, 规定在何处打开链接文档。
+    target: {type: String, default: "_self"},
+    // route
+    to: {
+      type: [String, Object],
+    }
+  },
+  methods: {
+    navTo() {
+      if (this.to && !this.href) {
+        this.$router.push(this.to)
+      }
+    }
+  }
+}
+</script>
+
+<style scoped>
+
+</style>

package/src/components/ed-base-vue/package/EdMarkEditor/index.js

@@ -0,0 +1,15 @@
+/**
+ * MarkEditor markdown编辑器
+ * @link 依赖（mavon-editor）：https://github.com/hinesboy/mavonEditor
+ * @link 官方：http://www.mavoneditor.com/
+ * @description Web 富文本编辑器
+ */
+
+import EdMarkEditor from './src/EdMarkEditor.vue'
+
+/* istanbul ignore next */
+EdMarkEditor.install = function (Vue) {
+  Vue.component(EdMarkEditor.name, EdMarkEditor)
+}
+
+export default EdMarkEditor

package/src/components/ed-base-vue/package/EdMarkEditor/src/EdMarkEditor.vue

@@ -0,0 +1,368 @@
+<template>
+  <div class="markdown-editor">
+    <mavon-editor v-model="editorValue" v-bind="getBindValue()" v-on="$listeners">
+      <!-- 左工具栏前加入自定义按钮 -->
+      <template slot="left-toolbar-before">
+        <slot name="left-toolbar-before"></slot>
+      </template>
+
+      <!-- 左工具栏后加入自定义按钮  -->
+      <template slot="left-toolbar-after">
+        <slot name="left-toolbar-after"></slot>
+      </template>
+      <!-- 右工具栏前加入自定义按钮  -->
+      <template slot="right-toolbar-before">
+        <slot name="right-toolbar-before"></slot>
+      </template>
+      <!-- 右工具栏后加入自定义按钮  -->
+      <template slot="right-toolbar-after">
+        <slot name="right-toolbar-after"></slot>
+      </template>
+    </mavon-editor>
+  </div>
+</template>
+
+<script>
+import { mavonEditor } from 'mavon-editor'
+import 'mavon-editor/dist/css/index.css'
+import highlight from "./highlight";
+
+/**
+ * Markdown编辑器
+ * - 示例
+ *
+ * ```vue
+ * <ed-mark-editor v-model="value"></ed-mark-editor>
+ * ```
+ *
+ * [](./EdMarkEditorProps.md ':include')
+ */
+export default {
+  name: "EdMarkEditor",
+  components: { mavonEditor },
+  props: {
+    // 初始值
+    value: {
+      type: String,
+      default: ""
+    },
+
+    // 语言选择，暂支持 zh-CN: 简体中文, zh-TW: 正体中文 ， en: 英文 ， fr: 法语， pt-BR: 葡萄牙语， ru: 俄语， de: 德语， ja: 日语
+    language: {
+      type: String,
+      default: "zh-CN"
+    },
+
+    // 编辑区域文字大小
+    fonts: {
+      type: [String, Number],
+      default: "14px"
+    },
+
+    // 开启滚动条样式(暂时仅支持chrome)
+    scrollStyle: {
+      type: Boolean,
+      default: true
+    },
+
+    // 开启边框阴影
+    boxShadow: {
+      type: Boolean,
+      default: true
+    },
+
+    // 边框阴影样式
+    boxShadowStyle: {
+      type: String,
+      default: "0 2px 12px 0 rgba(0, 0, 0, 0.1)"
+    },
+
+    // 是否开启过渡动画
+    transition: {
+      type: Boolean,
+      default: true
+    },
+
+    // 工具栏背景颜色
+    toolbarsBackground: {
+      type: String,
+      default: "#ffffff"
+    },
+
+    // 预览框背景颜色
+    previewBackground: {
+      type: String,
+      default: "#fbfbfb"
+    },
+
+    // true： 双栏(编辑预览同屏)， false： 单栏(编辑预览分屏)
+    subfield: {
+      type: Boolean,
+      default: true
+    },
+
+    // 在单栏（subfield=false）时默认展示区域.
+    // edit： 默认展示编辑区域，
+    // preview： 默认展示预览区域
+    // 其他 = edit
+    defaultOpen: {
+      type: String,
+    },
+
+    // 输入框为空时默认提示文本
+    placeholder: {
+      type: String,
+      default: "开始编辑..."
+    },
+
+    // 是否允许编辑
+    editable: {
+      type: Boolean,
+      default: true
+    },
+
+    // markdown样式： 默认github, 可选配色方案
+    codeStyle: {
+      type: String,
+      default: "code-github"
+    },
+
+    // 工具栏是否显示
+    toolbarsFlag: {
+      type: Boolean,
+      default: true
+    },
+
+    // 默认展示目录
+    navigation: {
+      type: Boolean,
+      default: false
+    },
+
+    // 是否启用快捷键
+    shortCut: {
+      type: Boolean,
+      default: true
+    },
+
+    // 自动聚焦到文本框
+    autofocus: {
+      type: Boolean,
+      default: true
+    },
+
+    // 代码高亮
+    ishljs: {
+      type: Boolean,
+      default: true
+    },
+
+    // 图片过滤函数，参数为一个File Object，要求返回一个Boolean, true表示文件合法，false表示文件不合法
+    imageFilter: {
+      type: Function
+    },
+
+    // 图片点击事件，默认为预览，可覆盖
+    imageClick: {
+      type: Function
+    },
+
+    // tab转化为几个空格，默认为\t
+    tabSize: {
+      type: Number,
+    },
+
+    // 启用HTML标签，因为历史原因这个标记一直默认为true，但建议不使用HTML标签就关闭它，它能彻底杜绝安全问题。
+    html: {
+      type: Boolean,
+      default: true
+    },
+
+    // 组件默认cdn外链依赖组件，如需本地化加载，请设置externalLink (false:加载本地 true:加载CDN)
+    externalLink: {
+      type: Boolean,
+      default: true
+    },
+
+    // xss规则配置, 默认开启，设置false可以关闭，开启后会对HTML标签进行过滤，默认过滤所有HTML标签属性，建议按需配置白名单减少被攻击的可能。
+    // - 自定义规则参考: https://jsxss.com/zh/options.html
+    // - 参考DEMO: dev-demo
+    xssOptions: {
+      type: Object,
+      default: () => {
+      }
+    },
+
+    // 工具栏
+    toolbars: {
+      type: Object,
+      default: () => {
+        return {}
+      }
+    }
+  },
+  model: {
+    prop: "value",
+    event: "input"
+  },
+  data() {
+    return {
+      editorValue: this.value,
+      defaultToolbars: {
+        bold: true, // 粗体
+        italic: true, // 斜体
+        header: true, // 标题
+        underline: true, // 下划线
+        strikethrough: true, // 中划线
+        mark: true, // 标记
+        superscript: false, // 上角标
+        subscript: false, // 下角标
+        quote: true, // 引用
+        ol: true, // 有序列表
+        ul: true, // 无序列表
+        link: true, // 链接
+        imagelink: true, // 图片链接
+        code: true, // code
+        table: true, // 表格
+        fullscreen: true, // 全屏编辑
+        readmodel: true, // 沉浸式阅读
+        htmlcode: true, // 展示html源码
+        help: true, // 帮助
+        /* 1.3.5 */
+        undo: true, // 上一步
+        redo: true, // 下一步
+        trash: true, // 清空
+        save: true, // 保存（触发events中的save事件）
+        /* 1.4.2 */
+        navigation: true, // 导航目录
+        /* 2.1.8 */
+        alignleft: true, // 左对齐
+        aligncenter: true, // 居中
+        alignright: true, // 右对齐
+        /* 2.2.1 */
+        subfield: true, // 单双栏模式
+        preview: true, // 预览
+      }
+    }
+  },
+  computed: {
+    fontSize() {
+      return typeof this.fonts === 'number' ? this.fonts + 'px' : this.fonts
+    }
+  },
+  methods: {
+    /**
+     * 获取绑定数据
+     */
+    getBindValue() {
+      let props = Object.assign({},  this.$props)
+      // props.fontSize = this.fontSize
+      props.toolbars = Object.assign({}, this.defaultToolbars, this.toolbars)
+
+      return props
+    },
+
+    /**
+     * @name setHandleOn
+     * @return {Object}
+     * @description 设置事件
+     */
+    setHandleOn() {
+      return {
+        change: this.handleChange,
+        save: this.handleSave,
+        fullScreen: this.handleFullScreen,
+        readModel: this.handleReadModel,
+        htmlCode: this.handleHtmlCode,
+        subfieldToggle: this.handleSubfieldToggle,
+        previewToggle: this.handlePreviewToggle,
+        helpToggle: this.handleHelpToggle,
+        navigationToggle: this.handleNavigationToggle,
+        imgAdd: this.handleImgAdd,
+        imgDel: this.handleImgDel,
+      }
+    },
+
+    /**
+     * @name handleChange
+     * @param value {String} 值
+     * @param render {String} 解析后的html
+     * @description 编辑区发生变化的回调事件
+     */
+    handleChange(value, render) {
+      this.$emit('input', value)
+      this.$emit("change", value, render)
+    },
+
+    /**
+     * @name handleSave
+     * @param value {String} 值
+     * @param render {String} 解析后的html
+     * @description ctrl + s 的回调事件(保存按键,同样触发该回调)
+     */
+    handleSave(value, render) {
+      this.$emit("save", value, render)
+    },
+
+    /**
+     * @name handleFullScreen
+     * @param status {Boolean}
+     * @param value {String}
+     * @description 切换全屏编辑的回调事件(boolean: 全屏开启状态)
+     */
+    handleFullScreen(status, value) {
+      this.$emit('fullScreen', status, value)
+    },
+
+    /**
+     * @name handleReadModel
+     * @param status {Boolean}
+     * @param value {String}
+     * @description 切换沉浸式阅读的回调事件(boolean: 阅读开启状态)
+     */
+    handleReadModel(status, value) {
+      this.$emit('readModel', status, value)
+    },
+
+    /**
+     * @name handleHtmlCode
+     * @param status
+     * @param value
+     * @description 查看html源码的回调事件(boolean: 源码开启状态)
+     */
+    handleHtmlCode(status, value) {
+      this.$emit('htmlCode', status, value)
+    },
+
+    /**
+     * @name handleSubfieldToggle
+     * @param status
+     * @param value
+     * @description 切换单双栏编辑的回调事件(boolean: 双栏开启状态)
+     */
+    handleSubfieldToggle(status, value) {
+      this.$emit('subfieldToggle', status, value)
+    },
+
+    // 切换预览编辑的回调事件(boolean: 预览开启状态)
+    handlePreviewToggle(status, value) {
+    },
+    // 查看帮助的回调事件(boolean: 帮助开启状态)
+    handleHelpToggle(status, value) {
+    },
+    // 切换导航目录的回调事件(boolean: 导航开启状态)
+    handleNavigationToggle(status, value) {
+    },
+    // 图片文件添加回调事件(pos: 图片在列表中的位置, File: File Object)
+    handleImgAdd(pos, imgFile) {
+    },
+    // 图片文件删除回调事件(Array(2): 两个元素的数组，第一位是图片在列表中的位置，第二位是File对象)
+    handleImgDel(files) {
+    }
+  }
+}
+</script>
+
+<style scoped>
+
+</style>