resolver-egretimp-plus 0.0.44 → 0.0.45

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "resolver-egretimp-plus",
-  "version": "0.0.44",
+  "version": "0.0.45",
   "description": "交付体验渲染",
   "main": "./dist/web/index.js",
   "module": "./dist/web/index.js",

package/src/analysisComponent.jsx

@@ -201,7 +201,8 @@ export default {
         lang,
         rootValue,
         dynamicMapComp,
-        props
+        props,
+        messageInstance: messageInstance?.value
       }) // 生成formItem（）的辅助函数
       return formItemPolyfill(
         <currentComponent.value

package/src/components/cmiFormItem/index.js

@@ -0,0 +1 @@
+export { default as default} from './src/index.vue'

package/src/components/cmiFormItem/src/index.vue

@@ -0,0 +1,106 @@
+<script setup>
+import { computed, useAttrs } from 'vue';
+
+const props = defineProps({
+  messageInstance: {
+    type: [Object, Function],
+    default: () => null
+  },
+  config: [Object, Array],
+  lang: String,
+  labelWidth: [String, Number]
+})
+const attrs = useAttrs()
+const label = computed(() => {
+  if (props.config.labelHidden == '1' || props.config.labelWidth === 0 || props.config.labelWidth === '0') {
+    return ''
+  }
+  return (props.lang.indexOf('zh') > -1 ? props.config.metaNameZh : props.config.metaNameEn) || ''
+})
+const labelWidth = computed(() => {
+  if (!!props.config.labelPosition) {
+    return props.config.labelPosition
+  }
+  return 'left'
+})
+function handleClickTip() {
+  messageInstance?.text(props.lang.indexOf('zh') > -1 ? props.config.hintContentZh : props.config.hintContentEn)
+}
+
+</script>
+<template>
+  <cmi-form-item v-bind="attrs" class="custom-form-item-h5"
+    :class="[{'--required': props.config.requiredFlag == '1', '--label-hide': !labelWidth, 
+              '--label-text-left': labelPosition === 'left', '--label-text-right': labelPosition === 'right'
+            }, customClass]"
+    :labelWidth="props.labelWidth"
+  >
+    <div slot="label" class="custom-label--formItem">
+      <div class="custom-label-content">
+        <span class="label-required" v-if="props.config.requiredFlag == '1'">*</span>
+        <span class="label-text">{{ label }}</span>
+        <span class="label-tip" v-if="props.config.hintFlag == '1'" @click="handleClickTip"><cmi-icon-question-circle size="14"/></span>
+      </div>
+    </div>
+    <slot></slot>
+  </cmi-form-item>
+</template>
+<style lang="scss" scoped>
+cmi-form-item {
+  position: relative;
+
+  .custom-label--formItem {
+    display: inline-flex;
+    align-items: center;
+    width: 100%;
+    // height: 16px;
+    
+    .custom-label-content {
+      width: 100%;
+      display: -webkit-box;
+      line-height: 16px;
+      overflow: hidden; 
+      text-overflow: ellipsis;
+      -webkit-line-clamp: 2;
+      -webkit-box-orient: vertical;
+      text-align: left;
+      .label-required {
+        color: #f5222d;
+        position: relative;
+        right: 3px;
+        top: 3px;
+      }
+      .label-text {
+        padding-right: 3px;
+      }
+      .label-tip {
+        position: absolute;
+        right: 16px;
+        top: 2px;
+      }
+    }
+  }
+
+  &.--label-text-left {
+    .custom-label--formItem {
+      .custom-label-content {
+        text-align: left;
+      }
+    }
+  }
+  
+  &.--label-text-right {
+    .custom-label--formItem {
+      .custom-label-content {
+        text-align: right;
+      }
+    }
+  }
+  
+  &.--required {
+    .custom-label-content {
+      padding-left: 3px;
+    }
+  }
+}
+</style>

package/src/components/packages-H5/CmiCheckbox.vue

@@ -30,16 +30,6 @@ const checkboxProps = computed(() => {
 const attrs = useAttrs()
 const modeValue = defineModel()
 
-const aa = [
-  {
-    columnValue: 'aaa',
-    columnDesc_zh: 'aaa',
-  },
-  {
-    columnValue: 'bbb',
-    columnDesc_zh: 'bbb',
-  }
-]
 const onChange = ({ detail }) => {
   modeValue.value = detail.value
 }
@@ -49,11 +39,11 @@ const onSigleChange = ({ detail }) => {
 </script>
 
 <template>
-  <cmi-checkbox-group :value="modeValue" @change="onChange" v-if="props.options && props.options.length" v-bind="{...checkboxGroupProps, ...attrs}">
+  <cmi-checkbox-group :value="modeValue" @change="onChange" v-if="props.options && props.options.length" v-bind="{...attrs, ...checkboxGroupProps}">
     <cmi-checkbox 
       class="mr-20"
       v-for="option in props.options" :key="option.columnValue"
-      :disabled="option.columnStatus == '0' || option.columnStatus == '2'"
+      :disabled="props.disabled || option.columnStatus == '0' || option.columnStatus == '2'"
       :name="option.columnValue" :label="lang.indexOf('zh') > -1 ? option.columnDesc_zh : option.columnDesc"
     >
       {{lang.indexOf('zh') > -1 ? option.columnDesc_zh : option.columnDesc}}

package/src/components/packages-H5/CmiInput.vue

@@ -9,7 +9,7 @@ const props = defineProps({
 const inputProps = computed(() => {
   return {
     label: props.config?.label,
-    type: props.config?.type,
+    type: props.config?.displayType,
     name: props.config?.name,
     placeholder: lang?.value?.indexOf('zh') > -1 ? props.config?.defPlacehold : props.config?.defPlaceholdEn,
     min: props.config?.min,

package/src/components/packages-H5/CmiSelect.vue

@@ -54,7 +54,7 @@ const selectProps = computed(() => {
     multiple: isMutiple.value,
     placeholder: lang?.value?.indexOf('zh') > -1 ? props.config?.defPlacehold : props.config?.defPlaceholdEn,
     'max-options-visible': props.config?.['max-options-visible'] || props.config?.maxOptionsVisible,
-    required: props.required,
+    // required: props.required,
   }
 })
 const clear = () => {

package/src/components/packages-H5/CustomComponentCardH5.vue

@@ -16,8 +16,8 @@ const attrs = useAttrs()
 const lang = inject('lang')
 const cmiProps = computed(() => {
   return {
-    title: lang?.value?.indexOf('zh') ? props.config?.metaNameZh : props.config?.metaNameEn,
-    subtitle: lang?.value?.indexOf('zh') ? props.config.subtitleZh : props.config.subtitleEn,
+    title: lang?.value?.indexOf('zh') > -1 ? props.config?.metaNameZh : props.config?.metaNameEn,
+    subtitle: lang?.value?.indexOf('zh') > -1 ? props.config.subtitleZh : props.config.subtitleEn,
     content: props.content,
     noborder: props.noborder == '1' ? true : false,
     cardbgcolor: props.cardbgcolor || '#FAFAFA',

package/src/components/packages-H5/CustomComponentTableH5.vue

@@ -16,7 +16,7 @@ const tableProps = computed(() => {
     card: props.config?.displayType === 'card',
     display: props.config?.display,
     open: props.config?.open === '1',
-    showlandscape: props.config?.showlandscape === '1',
+    showlandscape: props.config?.showLandscape === '1',
   }
 })
 

package/src/components/packages-web/ElInput.vue

@@ -12,6 +12,9 @@ const inputProps = computed(() => {
     total[key] = props[key]
     return total
   }, {})
+  if (props.config?.icon) {
+    ret.suffixIcon = props.config?.icon
+  }
   return ret
 })
 const attrs = useAttrs()

package/src/utils/render.jsx

@@ -1,6 +1,6 @@
 import { getCodeMapRules } from '../rules/rulesDriver.js'
 import { resolveAssetComponents, findComponent, compareComponet, normalPixel, isPlainObject, hasOwn, isFnStr, normalCapitalizeComponent, capitalize, camelize, formatDate} from './common.js'
-import { resolveComponent, inject } from 'vue'
+import { resolveComponent, inject, defineAsyncComponent } from 'vue'
 import CustomComponentColH5 from '../components/packages-H5/CustomComponentColH5.vue'
 import {
   commonPropsType,
@@ -26,6 +26,7 @@ import { isArray, isFunction, isString } from './is.js'
 import CustomComponentPlain from '../components/packages-web/CustomComponentPlain.vue'
 import QuestionFilled from '../components/icons/question-filled.vue'
 import { dispatchClickEvent, dispatchClickEvents, getTableConfig } from '../components/helper/eventOrchestration.js'
+import CmiFormItem from '../components/cmiFormItem'
 
 // 解析配置中的defStyle属性
 export function parseDefStyle(defStyle) {
@@ -582,20 +583,27 @@ function generateFormItemPc (config, lang, compProps, params,) {
   }
 }
 
-function generateFormItemH5(config, lang, compProps, params) {
+function generateFormItemH5(config, lang, compProps, params = {}) {
+  const { messageInstance } = params
+  const props = {
+    config,
+    lang,
+    messageInstance,
+    hidemessage: config?.hidemessage == '1' ? true : false,
+    hideasterisk: config?.hideasterisk == '1' ? true : false,
+    ...getFormItemExtendProps(config, lang, params),
+  }
+  // labelWidth 需要特殊处理
+  if (hasOwn(config, 'labelWidth')) {
+    props.labelWidth = props.labelWidth && `${props.labelWidth}` !== '-1' ? props.labelWidth : undefined
+  }
+
   return node => {
     if (!config.needformItem && !config.showFormItem) {
       return node
     }
-    const props = {
-      label: lang.indexOf('zh') > -1 ? config.metaNameZh : config.metaNameEn,
-      hidemessage: config?.hidemessage == '1' ? true : false,
-      hideasterisk: config?.hideasterisk == '1' ? true : false,
-      ...getFormItemExtendProps(config, lang, params),
-    }
-    
     return (
-      <cmi-form-item class="custom-form-item-h5" {...props}>{node}</cmi-form-item>
+      <CmiFormItem {...props}>{node}</CmiFormItem>
     )
   }
 }