adtec-core-package 2.9.9 → 3.0.1

package/src/components/editor-main/src/components/menus/toolbar/tools/chinese-case.vue

@@ -0,0 +1,135 @@
+<template>
+  <menus-button
+    ico="chinese-case"
+    :text="t('tools.chineseCase.text')"
+    :tooltip="t('tools.chineseCase.tip')"
+    menu-type="dropdown"
+    huge
+    overlay-class-name="umo-chinese-case-dropdown"
+  >
+    <template #dropmenu>
+      <t-dropdown-menu>
+        <t-dropdown-item
+          v-for="item in options"
+          :key="item.value"
+          :value="item.value"
+          :divider="item.divider"
+          @click="setChineseCase(item.fn)"
+        >
+          <div class="label">{{ item.label }}</div>
+          <div class="desc">{{ item.desc }}</div>
+        </t-dropdown-item>
+      </t-dropdown-menu>
+    </template>
+  </menus-button>
+</template>
+
+<script setup>
+import { t } from '../../../../composables/i18n.js';
+
+import nzh from 'nzh/cn'
+
+import { getSelectionText } from '../../../../utils/selection'
+
+
+import { inject } from 'vue';
+const editor = inject('editor')
+const container = inject('container')
+
+const options = [
+  {
+    label: '数字小写金额 → 中文大写金额',
+    desc: '人民币伍佰肆拾叁元贰角壹分',
+    fn(text) {
+      const number = text
+        .toString()
+        .replaceAll(',', '')
+        .replaceAll('￥', '')
+        .replaceAll(' ', '')
+      return nzh.toMoney(number, { unOmitYuan: true, forceZheng: true })
+    },
+  },
+  {
+    label: '阿拉伯数字 → 中文小写',
+    desc: '十万零一百一十一',
+    fn: (text) => nzh.encodeS(text),
+  },
+  {
+    label: '科学记数法 → 中文小写',
+    desc: '1.23456789e+21',
+    fn: (text) => nzh.encodeS(text),
+    divider: true,
+  },
+  {
+    label: '中文大写金额 → 数字小写金额',
+    desc: '￥54,321.00',
+    fn(text) {
+      const char = text
+        .replaceAll('人民币', '')
+        .replaceAll('元', '')
+        .replaceAll('整', '')
+      const amount = nzh.decodeB(char).toString()
+
+      // 使用正则表达式添加千位分隔符
+      const parts = amount.split('.')
+      parts[0] = parts[0].replace(/\B(?=(\d{3})+(?!\d))/g, ',')
+      // 如果有小数部分，保留两位小数
+      if (parts.length === 2) {
+        parts[1] = parts[1].padEnd(2, '0')
+      } else {
+        parts.push('00')
+      }
+      // 拼接为金额格式的字符串
+      const result = parts.join('.')
+      return `￥${result}`
+    },
+  },
+  {
+    label: '中文小写 → 阿拉伯数字',
+    desc: '54321',
+    fn: (text) => nzh.decodeS(text),
+  },
+]
+
+const setChineseCase = (fn) => {
+  if (!editor.value) {
+    return
+  }
+  const text = getSelectionText(editor.value)
+  if (text === '') {
+    useMessage('error', {
+      attach: container,
+      content: '请先选中要转换的文本',
+    })
+    return
+  }
+  try {
+    const content = fn(text)
+    editor.value.chain().focus().insertContent(content.toString()).run()
+  } catch {
+    useMessage('error', {
+      attach: container,
+      content: '大小写转化失败，请检查当前选中的文本',
+    })
+  }
+}
+</script>
+
+<style lang="less">
+.umo-chinese-case-dropdown {
+  .umo-dropdown__item {
+    max-width: unset !important;
+    &-text {
+      padding: 5px;
+      .label {
+        font-size: 14px;
+        color: var(--umo-text-color);
+      }
+      .desc {
+        color: var(--umo-text-color-light);
+        margin-top: -3px;
+      }
+    }
+  }
+}
+</style>

package/src/components/editor-main/src/components/menus/toolbar/tools/diagrams.vue

@@ -0,0 +1,141 @@
+<template>
+  <menus-button
+    :ico="content ? 'edit' : 'diagrams'"
+    :text="content ? t('tools.diagrams.edit') : t('tools.diagrams.text')"
+    huge
+    @menu-click="dialogVisible = true"
+  >
+    <modal
+      :visible="dialogVisible"
+      :footer="false"
+      destroy-on-close
+      class="umo-diagrams-dialog"
+      mode="full-screen"
+      @close="dialogVisible = false"
+    >
+      <template #header>
+        <icon name="diagrams" />
+        {{ content ? t('tools.diagrams.edit') : t('tools.diagrams.text') }}
+      </template>
+      <div v-if="loading" class="umo-diagrams-loading">
+        <t-loading :text="t('tools.diagrams.loading')" size="small" />
+      </div>
+      <div class="umo-diagrams-container"></div>
+    </modal>
+  </menus-button>
+</template>
+
+<script setup>
+import { t } from '../../../../composables/i18n.js';
+import { ref as _ref } from 'vue';
+
+import DiagramEditor from '../../../../utils/diagram-editor'
+import { getSelectionNode } from '../../../../utils/selection'
+import { shortId } from '../../../../utils/short-id'
+
+
+import { inject, watch, nextTick } from 'vue';
+const props = defineProps({
+  content: {
+    type: String,
+    default: '',
+  },
+})
+
+const container = inject('container')
+const editor = inject('editor')
+const options = inject('options')
+
+let dialogVisible = _ref(false)
+let loading = _ref(false)
+const diagramEditor = new DiagramEditor({
+  domain: options.value.diagrams?.domain || '',
+  params: options.value.diagrams?.params || {},
+  container: `${container} .umo-diagrams-container`,
+})
+
+let image = _ref(undefined)
+
+const messageListener = async (evt) => {
+  if (evt?.type !== 'message' || typeof evt?.data !== 'string') {
+    return
+  }
+
+  const { event, bounds, data } = JSON.parse(evt.data)
+  if (event === 'load') {
+    loading.value = false
+  }
+  if (event === 'export') {
+    if (!props.content || (props.content && props.content !== data)) {
+      const { width, height } = bounds
+      image.value = {
+        id: shortId(10),
+        type: 'diagrams',
+        src: data,
+        width,
+        height,
+        content: data,
+      }
+    }
+    dialogVisible.value = false
+    return
+  }
+  if (event === 'exit') {
+    dialogVisible.value = false
+  }
+}
+
+watch(
+  () => dialogVisible.value,
+  async (val) => {
+    if (!val) {
+      window.removeEventListener('message', messageListener)
+      diagramEditor.stopEditing()
+      if (image.value?.type) {
+        editor.value?.chain().focus().setImage(image.value, !!props.content).run()
+      }
+      return
+    }
+    await nextTick()
+    loading.value = true
+    diagramEditor.edit(props.content || '')
+    window.addEventListener('message', messageListener)
+    image.value = undefined
+  },
+  { immediate: true },
+)
+</script>
+
+<style lang="less">
+.umo-diagrams-dialog {
+  .t-dialog {
+    padding: 0 !important;
+    &__header {
+      background: var(--umo-color-white);
+      height: var(--td-comp-size-xxxl);
+    }
+    &__body {
+      padding: 0;
+    }
+  }
+}
+.umo-diagrams-loading {
+  width: 100%;
+  height: calc(100% - var(--td-comp-size-xxxl));
+  box-sizing: border-box;
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  position: absolute;
+  background-color: var(--umo-container-background);
+}
+.umo-diagrams-container {
+  height: 100%;
+  .umo-diagrams-iframe {
+    width: 100%;
+    height: 100%;
+    border: none;
+    display: block;
+  }
+}
+</style>