vue2-client 1.18.3 → 1.18.5

package/src/components/CodeMirror/inedx.vue

@@ -1,118 +1,118 @@
-<template>
-  <codemirror
-    v-model="item"
-    :options="cmOption"
-    class="code-mirror"
-    :style="styleObj"
-    @ready="onCmReady"
-    @focus="onCmFocus"
-    @input="onCmCodeChange"
-    ref="myCmGenerate"></codemirror>
-</template>
-
-<script>
-import { codemirror } from 'vue-codemirror'
-import 'codemirror/mode/javascript/javascript.js'
-import './setting.js'
-// https://github.com/surmon-china/vue-codemirror/tree/v4.0.6
-export default {
-  components: {
-    codemirror
-  },
-  props: {
-    value: {
-      type: String,
-      default: ''
-    },
-    readonly: {
-      type: Boolean,
-      default: false
-    },
-    mode: {
-      type: String,
-      default: 'sql' // 目前只有 sql/go/js 如果需要配置其他语言，需要在 setting.js 中配置 更多看官方文档
-    },
-    styleObj: {
-      type: Object,
-      default: () => {
-        return { fontSize: '16px' }
-      }
-    },
-    theme: {
-      type: String,
-      default: 'dracula'
-    },
-  },
-  watch: {},
-  data () {
-    return {
-      item: this.value,
-      cmOption: {
-        autoCloseBrackets: true,
-        extraKeys: { Ctrl: 'autocomplete' },
-        foldGutter: true,
-        gutters: ['CodeMirror-linenumbers', 'CodeMirror-foldgutter'],
-        highlightSelectionMatches: { showToken: /\w/, annotateScrollbar: true },
-        hintOptions: { completeSingle: false },
-        keyMap: 'sublime',
-        line: true,
-        lineNumbers: true,
-        matchBrackets: true,
-        mode: { name: this.mode, json: true },
-        readOnly: this.readonly ? 'nocursor' : undefined,
-        showCursorWhenSelecting: true,
-        styleActiveLine: true,
-        styleSelectedText: true,
-        tabSize: 2,
-        theme: this.theme,
-      }
-    }
-  },
-  methods: {
-    onCmReady () {
-    },
-    onCmFocus (instance, event) {
-      // console.log(instance)
-      // console.log(event)
-    },
-    onCmCodeChange (instance, _obj) {
-      this.$emit('input', instance)
-      // console.log(instance)
-      // console.log(_obj)
-    }
-  }
-}
-</script>
-<style lang="less" scoped>
-.CodeMirror-scroll {
-  overflow: scroll !important;
-  margin-bottom: 0;
-  margin-right: 0;
-  padding-bottom: 0;
-  height: 100%;
-  outline: none;
-  position: relative;
-  border: 1px solid #dddddd;
-}
-
-@font-face {
-  font-family: 'JetBrains Mono';
-  src: url('@vue2-client/assets/ttf/JetBrainsMono-Light.woff2') format('woff2'), /* 字体文件路径和格式 */ url('@vue2-client/assets/ttf/JetBrainsMono-Light.woff2') format('woff');
-}
-
-:deep(.CodeMirror) {
-  height: 100%;
-}
-
-.code-mirror {
-  height: 100%;
-  line-height: 150%;
-  text-align: left;
-  font-family: "JetBrains Mono", serif !important;
-}
-
-:deep(.CodeMirror-line), :deep(.CodeMirror-line-like) {
-  font-family: "JetBrains Mono", serif !important;
-}
-
-</style>
+<template>
+  <codemirror
+    v-model="item"
+    :options="cmOption"
+    class="code-mirror"
+    :style="styleObj"
+    @ready="onCmReady"
+    @focus="onCmFocus"
+    @input="onCmCodeChange"
+    ref="myCmGenerate"></codemirror>
+</template>
+
+<script>
+import { codemirror } from 'vue-codemirror'
+import 'codemirror/mode/javascript/javascript.js'
+import './setting.js'
+// https://github.com/surmon-china/vue-codemirror/tree/v4.0.6
+export default {
+  components: {
+    codemirror
+  },
+  props: {
+    value: {
+      type: String,
+      default: ''
+    },
+    readonly: {
+      type: Boolean,
+      default: false
+    },
+    mode: {
+      type: String,
+      default: 'sql' // 目前只有 sql/go/js 如果需要配置其他语言，需要在 setting.js 中配置 更多看官方文档
+    },
+    styleObj: {
+      type: Object,
+      default: () => {
+        return { fontSize: '16px' }
+      }
+    },
+    theme: {
+      type: String,
+      default: 'dracula'
+    },
+  },
+  watch: {},
+  data () {
+    return {
+      item: this.value,
+      cmOption: {
+        autoCloseBrackets: true,
+        extraKeys: { Ctrl: 'autocomplete' },
+        foldGutter: true,
+        gutters: ['CodeMirror-linenumbers', 'CodeMirror-foldgutter'],
+        highlightSelectionMatches: { showToken: /\w/, annotateScrollbar: true },
+        hintOptions: { completeSingle: false },
+        keyMap: 'sublime',
+        line: true,
+        lineNumbers: true,
+        matchBrackets: true,
+        mode: { name: this.mode, json: true },
+        readOnly: this.readonly ? 'nocursor' : undefined,
+        showCursorWhenSelecting: true,
+        styleActiveLine: true,
+        styleSelectedText: true,
+        tabSize: 2,
+        theme: this.theme,
+      }
+    }
+  },
+  methods: {
+    onCmReady () {
+    },
+    onCmFocus (instance, event) {
+      // console.log(instance)
+      // console.log(event)
+    },
+    onCmCodeChange (instance, _obj) {
+      this.$emit('input', instance)
+      // console.log(instance)
+      // console.log(_obj)
+    }
+  }
+}
+</script>
+<style lang="less" scoped>
+.CodeMirror-scroll {
+  overflow: scroll !important;
+  margin-bottom: 0;
+  margin-right: 0;
+  padding-bottom: 0;
+  height: 100%;
+  outline: none;
+  position: relative;
+  border: 1px solid #dddddd;
+}
+
+@font-face {
+  font-family: 'JetBrains Mono';
+  src: url('@vue2-client/assets/ttf/JetBrainsMono-Light.woff2') format('woff2'), /* 字体文件路径和格式 */ url('@vue2-client/assets/ttf/JetBrainsMono-Light.woff2') format('woff');
+}
+
+:deep(.CodeMirror) {
+  height: 100%;
+}
+
+.code-mirror {
+  height: 100%;
+  line-height: 150%;
+  text-align: left;
+  font-family: "JetBrains Mono", serif !important;
+}
+
+:deep(.CodeMirror-line), :deep(.CodeMirror-line-like) {
+  font-family: "JetBrains Mono", serif !important;
+}
+
+</style>

package/src/components/CodeMirror/setting.js

@@ -1,40 +1,40 @@
-import 'codemirror/lib/codemirror.css'
-// require active-line.js
-import 'codemirror/addon/selection/active-line.js'
-// styleSelectedText
-import 'codemirror/addon/selection/mark-selection.js'
-// hint
-import 'codemirror/addon/hint/show-hint.js'
-import 'codemirror/addon/hint/sql-hint.js'
-import 'codemirror/addon/hint/show-hint.css'
-import 'codemirror/addon/hint/javascript-hint.js'
-// highlightSelectionMatches
-import 'codemirror/addon/scroll/annotatescrollbar.js'
-import 'codemirror/addon/search/matchesonscrollbar.js'
-import 'codemirror/addon/search/match-highlighter.js'
-// keyMap
-import 'codemirror/mode/go/go.js'
-import 'codemirror/mode/sql/sql.js'
-import 'codemirror/mode/javascript/javascript.js'
-import 'codemirror/addon/edit/matchbrackets.js'
-import 'codemirror/addon/comment/comment.js'
-import 'codemirror/addon/dialog/dialog.js'
-import 'codemirror/addon/dialog/dialog.css'
-import 'codemirror/addon/search/searchcursor.js'
-import 'codemirror/addon/search/search.js'
-import 'codemirror/keymap/sublime.js'
-// foldGutter
-import 'codemirror/addon/fold/foldgutter.css'
-import 'codemirror/addon/fold/brace-fold.js'
-import 'codemirror/addon/fold/comment-fold.js'
-import 'codemirror/addon/fold/foldcode.js'
-import 'codemirror/addon/fold/foldgutter.js'
-import 'codemirror/addon/fold/indent-fold.js'
-import 'codemirror/addon/fold/markdown-fold.js'
-import 'codemirror/addon/fold/xml-fold.js'
-// 编辑的主题文件
-import 'codemirror/theme/dracula.css'
-import 'codemirror/theme/base16-light.css'
-import 'codemirror/theme/monokai.css'
-// 括号自动不全
-import 'codemirror/addon/edit/closebrackets.js'
+import 'codemirror/lib/codemirror.css'
+// require active-line.js
+import 'codemirror/addon/selection/active-line.js'
+// styleSelectedText
+import 'codemirror/addon/selection/mark-selection.js'
+// hint
+import 'codemirror/addon/hint/show-hint.js'
+import 'codemirror/addon/hint/sql-hint.js'
+import 'codemirror/addon/hint/show-hint.css'
+import 'codemirror/addon/hint/javascript-hint.js'
+// highlightSelectionMatches
+import 'codemirror/addon/scroll/annotatescrollbar.js'
+import 'codemirror/addon/search/matchesonscrollbar.js'
+import 'codemirror/addon/search/match-highlighter.js'
+// keyMap
+import 'codemirror/mode/go/go.js'
+import 'codemirror/mode/sql/sql.js'
+import 'codemirror/mode/javascript/javascript.js'
+import 'codemirror/addon/edit/matchbrackets.js'
+import 'codemirror/addon/comment/comment.js'
+import 'codemirror/addon/dialog/dialog.js'
+import 'codemirror/addon/dialog/dialog.css'
+import 'codemirror/addon/search/searchcursor.js'
+import 'codemirror/addon/search/search.js'
+import 'codemirror/keymap/sublime.js'
+// foldGutter
+import 'codemirror/addon/fold/foldgutter.css'
+import 'codemirror/addon/fold/brace-fold.js'
+import 'codemirror/addon/fold/comment-fold.js'
+import 'codemirror/addon/fold/foldcode.js'
+import 'codemirror/addon/fold/foldgutter.js'
+import 'codemirror/addon/fold/indent-fold.js'
+import 'codemirror/addon/fold/markdown-fold.js'
+import 'codemirror/addon/fold/xml-fold.js'
+// 编辑的主题文件
+import 'codemirror/theme/dracula.css'
+import 'codemirror/theme/base16-light.css'
+import 'codemirror/theme/monokai.css'
+// 括号自动不全
+import 'codemirror/addon/edit/closebrackets.js'

package/src/components/checkbox/ImgCheckbox.vue

@@ -1,117 +1,117 @@
-<template>
-  <a-tooltip :title="title" :overlayStyle="{zIndex: 2001}">
-    <div class="img-check-box" @click="toggle">
-      <img :src="img" alt="" v-if="type === 'img'">
-      <a-icon v-else :type="icon" style="font-size: 2rem" :class="sChecked?'sChecked iconCheck':'iconCheck'"/>
-      <div v-if="sChecked && type === 'img'" class="check-item">
-        <a-icon type="check"/>
-      </div>
-    </div>
-  </a-tooltip>
-</template>
-
-<script>
-export default {
-  name: 'ImgCheckbox',
-  props: {
-    checked: {
-      type: Boolean,
-      required: false,
-      default: false
-    },
-    img: {
-      type: String,
-      default: ''
-    },
-    type: {
-      type: String,
-      default: 'img'
-    },
-    icon: {
-      type: String,
-      default: ''
-    },
-    // eslint-disable-next-line vue/require-prop-types
-    value: {
-      required: true
-    },
-    // eslint-disable-next-line vue/require-default-prop
-    title: String
-  },
-  data () {
-    return {
-      sChecked: this.initChecked()
-    }
-  },
-  inject: ['groupContext'],
-  watch: {
-    sChecked: function () {
-      const option = {
-        value: this.value,
-        checked: this.sChecked
-      }
-      this.$emit('change', option)
-      const groupContext = this.groupContext
-      if (groupContext) {
-        groupContext.handleChange(option)
-      }
-    }
-  },
-  created () {
-    const groupContext = this.groupContext
-    if (groupContext) {
-      this.sChecked = groupContext.defaultValues.length > 0 ? groupContext.defaultValues.indexOf(this.value) >= 0 : this.sChecked
-      groupContext.datas.push(this)
-    }
-  },
-  methods: {
-    toggle () {
-      if (this.groupContext.multiple || !this.sChecked) {
-        this.sChecked = !this.sChecked
-      }
-    },
-    initChecked () {
-      const groupContext = this.groupContext
-      if (!groupContext) {
-        return this.checked
-      } else if (groupContext.multiple) {
-        return groupContext.defaultValues.indexOf(this.value) > -1
-      } else {
-        return groupContext.defaultValues[0] === this.value
-      }
-    }
-  }
-}
-</script>
-
-<style lang="less" scoped>
-.sChecked {
-  color: @primary-color;
-}
-
-.iconCheck {
-  padding: 5px;
-  border: 1px solid;
-  border-radius: 12px;
-}
-
-.img-check-box {
-  margin-right: 16px;
-  position: relative;
-  border-radius: 4px;
-  cursor: pointer;
-
-  .check-item {
-    position: absolute;
-    top: 0;
-    right: 0;
-    width: 100%;
-    padding-top: 15px;
-    padding-left: 24px;
-    height: 100%;
-    color: @primary-color;
-    font-size: 14px;
-    font-weight: bold;
-  }
-}
-</style>
+<template>
+  <a-tooltip :title="title" :overlayStyle="{zIndex: 2001}">
+    <div class="img-check-box" @click="toggle">
+      <img :src="img" alt="" v-if="type === 'img'">
+      <a-icon v-else :type="icon" style="font-size: 2rem" :class="sChecked?'sChecked iconCheck':'iconCheck'"/>
+      <div v-if="sChecked && type === 'img'" class="check-item">
+        <a-icon type="check"/>
+      </div>
+    </div>
+  </a-tooltip>
+</template>
+
+<script>
+export default {
+  name: 'ImgCheckbox',
+  props: {
+    checked: {
+      type: Boolean,
+      required: false,
+      default: false
+    },
+    img: {
+      type: String,
+      default: ''
+    },
+    type: {
+      type: String,
+      default: 'img'
+    },
+    icon: {
+      type: String,
+      default: ''
+    },
+    // eslint-disable-next-line vue/require-prop-types
+    value: {
+      required: true
+    },
+    // eslint-disable-next-line vue/require-default-prop
+    title: String
+  },
+  data () {
+    return {
+      sChecked: this.initChecked()
+    }
+  },
+  inject: ['groupContext'],
+  watch: {
+    sChecked: function () {
+      const option = {
+        value: this.value,
+        checked: this.sChecked
+      }
+      this.$emit('change', option)
+      const groupContext = this.groupContext
+      if (groupContext) {
+        groupContext.handleChange(option)
+      }
+    }
+  },
+  created () {
+    const groupContext = this.groupContext
+    if (groupContext) {
+      this.sChecked = groupContext.defaultValues.length > 0 ? groupContext.defaultValues.indexOf(this.value) >= 0 : this.sChecked
+      groupContext.datas.push(this)
+    }
+  },
+  methods: {
+    toggle () {
+      if (this.groupContext.multiple || !this.sChecked) {
+        this.sChecked = !this.sChecked
+      }
+    },
+    initChecked () {
+      const groupContext = this.groupContext
+      if (!groupContext) {
+        return this.checked
+      } else if (groupContext.multiple) {
+        return groupContext.defaultValues.indexOf(this.value) > -1
+      } else {
+        return groupContext.defaultValues[0] === this.value
+      }
+    }
+  }
+}
+</script>
+
+<style lang="less" scoped>
+.sChecked {
+  color: @primary-color;
+}
+
+.iconCheck {
+  padding: 5px;
+  border: 1px solid;
+  border-radius: 12px;
+}
+
+.img-check-box {
+  margin-right: 16px;
+  position: relative;
+  border-radius: 4px;
+  cursor: pointer;
+
+  .check-item {
+    position: absolute;
+    top: 0;
+    right: 0;
+    width: 100%;
+    padding-top: 15px;
+    padding-left: 24px;
+    height: 100%;
+    color: @primary-color;
+    font-size: 14px;
+    font-weight: bold;
+  }
+}
+</style>