eoss 0.1.0-alpha.21 → 0.1.0-alpha.23

package/packages/form/src/form-item.vue

@@ -4,7 +4,8 @@
     :style="itemStyle"
     :class="[
       {
-        'es-form-item--feedback': esForm && esForm.statusIcon,
+    'es-form-item--feedback': esForm && esForm.statusIcon,
+        'es-form--label-top': labelPosition === 'top',
         'is-error': validateState === 'error',
         'is-validating': validateState === 'validating',
         'is-success': validateState === 'success',
@@ -21,6 +22,7 @@
       :class="labelClass"
       :labelFor="labelFor"
       :contents="label"
+      :position="labelPosition"
       v-if="label || $slots.label"
     >
       <slot name="label" v-if="$slots.label"></slot>
@@ -100,10 +102,15 @@ export default {
      * 标签文本
      */
     label: [String, Array],
+    /**
+     * 标签位置
+     */
+    labelPosition: String,
     /**
      * 标签宽度
      */
     labelWidth: String,
+    
     /**
      * 字段名，用于表单验证和数据绑定
      */
@@ -257,7 +264,7 @@ export default {
       const labelWidth = this.labelWidth || form.labelWidth;
       const label = this.label || this.$slots.label;
       // 快速路径：无需计算样式
-      if (!label || form.labelPosition === 'top' || form.inline) return {};
+      if (!label || this.labelPosition === 'top' || form.labelPosition === 'top' || form.inline) return {};
       if (!this.labelWidth && this.isNested) return {};
 
       // 构建样式对象

package/packages/form/src/label-wrap.vue

@@ -44,6 +44,8 @@ export default {
   componentsName: 'LabelWrap',
   inheritAttrs: false,
   props: {
+    // 标签位置
+    position: String,
     // 标签关联的表单字段ID，确保label与form field正确关联
     labelFor: String,
     // 统一使用isAutoWidth来控制自动宽度计算
@@ -82,7 +84,8 @@ export default {
       if (
         !this.autoWidth &&
         this.esForm &&
-        this.esForm.labelPosition !== 'top'
+        this.esForm.labelPosition !== 'top' &&
+        this.position !== 'top'
       ) {
         const labelWidth = parseInt(
           (this.esFormItem || {}).labelWidth ||

package/packages/login/src/login.vue

@@ -148,7 +148,9 @@
     <transition name="launch-fade">
       <div class="es-launch" :style="launchStyles" v-show="showLaunch">
         <div class="es-launch__text is-user">{{ userName }}，您好！</div>
-        <div class="es-launch__text">欢迎进入{{ welcome||subsystemName }}</div>
+        <div class="es-launch__text">
+          欢迎进入{{ welcome || subsystemName }}
+        </div>
       </div>
     </transition>
 
@@ -602,7 +604,7 @@ export default {
   beforeCreate() {},
   created() {
     this.initLogin();
-    this.alertNotice = throttle(300, true, this.doAlert);
+    this.alertNotice = throttle(300, this.doAlert);
   },
   mounted() {},
   /**
@@ -797,42 +799,69 @@ export default {
       }
     },
     /**
-     * @param {Object} contents - 弹窗内容
+     * 显示弹窗提示
+     * @param {string|Object} contents - 弹窗内容，字符串表示内容文本，对象表示完整配置
      */
     doAlert(contents) {
-      let { content, title, ...config } = contents;
+      let content, title, config;
+      if (typeof contents === 'string') {
+        content = contents;
+        title = '提示';
+        config = {};
+      } else {
+        ({ content, title, ...config } = contents);
+      }
       const regex = /\.md$/;
       let isMarkdown = regex.test(content);
+      const showAlert = () => {
+        console.log('showAlert called', { content, isMarkdown, title });
+        MessageBox.alert(content, title, {
+          dangerouslyUseHTMLString: isMarkdown,
+          setHeight: isMarkdown,
+          notice: true,
+          ...config
+        })
+          .then(() => {
+            this.$emit('notice', 1, { content, title, ...config });
+          })
+          .catch(() => {
+            this.$emit('notice', 0, { content, title, ...config });
+          });
+      };
       if (isMarkdown) {
-        content = ajax({ url: content });
-        content = content
-          ? content
-              .replace(/^#{1,6}\s+(.*?)$/gm, (match, text) => {
-                const hLevel = match.indexOf('#');
-                return `<h${hLevel}>${text}</h${hLevel}>`;
-              })
-              .replace(/\*\*(.*?)\*\*/g, '<strong>$1</strong>')
-              .replace(/\*(.*?)\*/g, '<em>$1</em>')
-              .replace(
-                /\[(.*?)\]\((.*?)\)/g,
-                '<a href="$2" target="_blank">$1</a>'
-              )
-              .replace(/^(.*?)$/gm, '<p>$1</p>')
-          : content;
-        content = DOMPurify.sanitize(content);
+        ajax({ url: content })
+          .then((mdContent) => {
+            // 兼容接口返回对象的情况（如 { rCode: 0, results: '...' }）
+            if (mdContent && typeof mdContent === 'object') {
+              mdContent =
+                mdContent.results || mdContent.data || mdContent.content || '';
+            }
+            mdContent = String(mdContent || '');
+            content = mdContent
+              ? mdContent
+                  .replace(/^#{1,6}\s+(.*?)$/gm, (match, text) => {
+                    const hLevel = match.indexOf('#');
+                    return `<h${hLevel}>${text}</h${hLevel}>`;
+                  })
+                  .replace(/\*\*(.*?)\*\*/g, '<strong>$1</strong>')
+                  .replace(/\*(.*?)\*/g, '<em>$1</em>')
+                  .replace(
+                    /\[(.*?)\]\((.*?)\)/g,
+                    '<a href="$2" target="_blank">$1</a>'
+                  )
+                  .replace(/^(.*?)$/gm, '<p>$1</p>')
+              : content;
+            content = DOMPurify.sanitize(content);
+            showAlert();
+          })
+          .catch((error) => {
+            console.error('加载 Markdown 内容失败:', error);
+            content = '内容加载失败';
+            isMarkdown = false;
+          });
+      } else {
+        showAlert();
       }
-      MessageBox.alert(content, title, {
-        dangerouslyUseHTMLString: isMarkdown,
-        setHeight: isMarkdown,
-        notice: true,
-        ...config
-      })
-        .then(() => {
-          this.$emit('notice', 1, { content, title, ...config });
-        })
-        .catch(() => {
-          this.$emit('notice', 0, { content, title, ...config });
-        });
     },
     /**
      * 打开下载APP弹窗

package/packages/lowcode/src/aside.vue

@@ -1,6 +1,10 @@
 <template>
   <div class="es-lowcode__aside" :style="styles">
-    <div  class="es-lowcode__aside--handle" v-show="!hide" @click.self="handleClick" ></div>
+    <div
+      class="es-lowcode__aside--handle"
+      v-show="!hide"
+      @click.self="handleClick"
+    ></div>
     <es-tabs
       tab-position="left"
       type="card"
@@ -58,7 +62,7 @@
             </div>
           </es-form>
         </es-dialog>
-        <Pages :pages="pages" v-if="pages.length" />
+        <Pages :pages="pages" v-if="pages.length" @add="handleAdd" />
         <div class="es-lowcode__aside--empty" v-else>暂无数据</div>
       </es-tab-pane>
       <es-tab-pane name="component">
@@ -278,6 +282,10 @@ export default {
     /**
      * 处理新增页面事件
      */
+    handleAdd(page) {
+      this.form.pid = page.id;
+      this.handleAddPage();
+    },
     handleAddPage() {
       const page = localStorage.getItem('pageList');
       if (page) {
@@ -302,6 +310,7 @@ export default {
           const id = `page_${uuid()}`;
           bus.$emit('addPage', {
             id: id, // id
+            pid: this.form.pid,
             title: '', // 页面标题
             name: this.form.name, // 名称
             description: this.form.description, // 描述
@@ -324,6 +333,10 @@ export default {
             components: [] // 子组件
           });
         }
+        this.form = {
+          name: '',
+          description: ''
+        };
       });
     }
   }

package/packages/lowcode/src/editor.vue

@@ -0,0 +1,187 @@
+<template>
+  <div class="es-lowcode__editor">
+    <div v-if="loading" class="es-lowcode__editor--loading">
+      编辑器加载中...
+    </div>
+    <div class="es-lowcode__editor--instance" ref="editor"></div>
+  </div>
+</template>
+
+<script>
+// monaco 模块加载缓存，多个编辑器实例共用同一次动态加载
+let monacoLoader = null;
+
+function loadMonaco() {
+  if (!monacoLoader) {
+    monacoLoader = import(
+      /* webpackChunkName: "monaco-editor" */ 'monaco-editor'
+    );
+  }
+  return monacoLoader;
+}
+
+export default {
+  name: 'Editor',
+
+  props: {
+    //  编辑器内容，支持 v-model
+    value: {
+      type: String,
+      default: ''
+    },
+    //  代码语言：javascript / json / html / css 等
+    language: {
+      type: String,
+      default: 'javascript'
+    },
+    //  主题：vs / vs-dark / hc-black
+    theme: {
+      type: String,
+      default: 'vs'
+    },
+    //  是否只读
+    readonly: {
+      type: Boolean,
+      default: false
+    },
+    //  monaco 原生配置，会覆盖默认配置
+    options: {
+      type: Object,
+      default: () => ({})
+    }
+  },
+
+  data() {
+    return {
+      loading: true
+    };
+  },
+
+  watch: {
+    //  外部值变化时同步到编辑器，与内部输入区分避免循环触发
+    value(val) {
+      if (this.editor && val !== this.editor.getValue()) {
+        this.editor.setValue(val || '');
+      }
+    },
+    language(val) {
+      if (this.editor && this.monaco) {
+        this.monaco.editor.setModelLanguage(this.editor.getModel(), val);
+      }
+    },
+    theme(val) {
+      this.monaco && this.monaco.editor.setTheme(val);
+    },
+    readonly(val) {
+      this.editor && this.editor.updateOptions({ readOnly: val });
+    }
+  },
+
+  mounted() {
+    this.initEditor();
+  },
+
+  methods: {
+    //  动态加载 monaco 并创建编辑器实例
+    initEditor() {
+      loadMonaco()
+        .then((monaco) => {
+          //  加载完成前组件可能已被销毁
+          if (this.isDestroyed || !this.$refs.editor) {
+            return;
+          }
+          this.monaco = monaco;
+          this.loading = false;
+          this.editor = monaco.editor.create(
+            this.$refs.editor,
+            Object.assign(
+              {
+                value: this.value,
+                language: this.language,
+                theme: this.theme,
+                readOnly: this.readonly,
+                automaticLayout: true, // 容器尺寸变化时自动重新布局
+                minimap: { enabled: false },
+                scrollBeyondLastLine: false,
+                fontSize: 13,
+                tabSize: 2
+              },
+              this.options
+            )
+          );
+          //  内容变化通知父组件
+          this.editor.onDidChangeModelContent(() => {
+            const value = this.editor.getValue();
+            if (value !== this.value) {
+              this.$emit('input', value);
+              this.$emit('change', value);
+            }
+          });
+          //  失焦事件，常用于保存
+          this.editor.onDidBlurEditorText(() => {
+            this.$emit('blur', this.editor.getValue());
+          });
+          //  编辑器就绪，抛出实例供外部扩展（注册补全、快捷键等）
+          this.$emit('ready', this.editor, monaco);
+        })
+        .catch((error) => {
+          this.loading = false;
+          console.error('[Editor] monaco-editor 加载失败', error);
+          this.$emit('error', error);
+        });
+    },
+    //  获取编辑器实例
+    getEditor() {
+      return this.editor;
+    },
+    //  获取当前内容
+    getValue() {
+      return this.editor ? this.editor.getValue() : this.value;
+    },
+    //  格式化代码
+    format() {
+      this.editor &&
+        this.editor.getAction('editor.action.formatDocument').run();
+    },
+    //  聚焦编辑器
+    focus() {
+      this.editor && this.editor.focus();
+    }
+  },
+
+  beforeDestroy() {
+    this.isDestroyed = true;
+    if (this.editor) {
+      this.editor.dispose();
+      this.editor = null;
+    }
+    this.monaco = null;
+  }
+};
+</script>
+<style lang="scss" scoped>
+.es-lowcode__editor {
+  position: relative;
+  width: 100%;
+  height: 100%;
+  min-height: 200px;
+
+  &--loading {
+    position: absolute;
+    top: 0;
+    left: 0;
+    right: 0;
+    bottom: 0;
+    display: flex;
+    align-items: center;
+    justify-content: center;
+    color: #909399;
+    font-size: 13px;
+  }
+
+  &--instance {
+    width: 100%;
+    height: 100%;
+  }
+}
+</style>