resolver-egretimp-plus 0.0.4

package/src/components/packages/CmiDatetimePicker.vue

@@ -0,0 +1,84 @@
+<script setup>
+import { computed, defineProps, inject, ref, useAttrs } from 'vue'
+import { commonPropsType } from '../../utils/index.js'
+
+const attrs = useAttrs()
+const lang = inject('lang')
+const modelValue = defineModel()
+const props = defineProps({
+  ...commonPropsType,
+})
+const open = computed({
+  get() {
+    return props?.config?.open === '1'
+  },
+  set(val) {
+    props.config.open = val ? '1' : '0'
+  }
+})
+const prefixIcon = computed(() => {
+  return props?.config?.prefixIcon
+})
+const suffixIcon = computed(() => {
+  return props?.config?.suffixIcon
+})
+const formatArr = computed(() => {
+  return props?.config?.format?.match(/\W/g) || []
+})
+
+const formatValue = computed({
+  get() {
+    return modelValue.value
+  },
+  set(val) {
+    let valueArr = Array.isArray(val) ? val : val.split(/\W/).map((value) => ({ value }))
+    let formatVal = valueArr.reduce((pre, cur, i) => {
+      pre = pre + cur.value + (i === valueArr.length - 1 ? "" : formatArr.value[i])
+      return pre
+    }, "")
+    modelValue.value = formatVal
+  }
+})
+
+const calcProps = computed(() => {
+  const ret = {
+    type: props?.config?.displayType,
+    title: lang.value?.indexOf('zh') > -1 ? props.config?.metaNameZh : props.config?.metaNameEn,
+    forbidmaskclick: props?.config?.forbidmaskclick === '1',
+    mindate: props?.config?.mindate,
+    maxdate: props?.config?.maxdate,
+    minhour: props?.config?.minhour,
+    maxhour: props?.config?.minhour,
+    minminute: props?.config?.minminute,
+    maxminute: props?.config?.maxminute,
+  }
+  return ret
+})
+const onClose = () => {
+  props.config?.onClose?.()
+  open.value = false
+}
+const onConfirm = (e) => {
+  formatValue.value = e.detail.value
+  props.config?.onConfirm?.(formatValue.value)
+  open.value = false
+}
+
+</script>
+
+<template>
+  <cmi-input :value="formatValue" suffixIcon @focus="open = true">
+    <div slot="suffix-icon" v-if="suffixIcon">
+      <component :is="`cmi-icon-${suffixIcon}`" color="#4E5969"></component>
+    </div>
+    <span slot="prefix" v-if="prefixIcon">
+      <component :is="`cmi-icon-${prefixIcon}`" color="#4E5969"></component>
+    </span>
+  </cmi-input>
+  <cmi-datetime-picker
+    v-bind="{...attrs, ...calcProps}"
+    :open="open"
+    @close="onClose"
+    @confirm="onConfirm"
+  />
+</template>

package/src/components/packages/CmiDropdownMenu.vue

@@ -0,0 +1,57 @@
+<script setup>
+import { computed, defineProps, inject, useAttrs } from 'vue'
+import { commonPropsType } from '../../utils/index.js'
+
+const selects = inject('selects')
+const lang = inject('lang')
+const modelValue = defineModel()
+const props = defineProps({
+  ...commonPropsType,
+})
+
+const dropdownMenuProps = computed(() => {
+  return {
+    title: lang?.value?.indexOf('zh') > -1 ? props.config?.metaNameZh : props.config?.metaNameEn,
+    "active-color": props.config?.['active-color'] || props.config?.activeColor,
+    direction: props.config?.direction,
+    "z-index": props.config?.['z-index'] || props.config?.zIndex,
+    "active-color": props.config?.['hide-overlay'] || props.config?.hideOverlay,
+    "swipe-threshold": props.config?.['swipe-threshold'] || props.config?.swipeThreshold,
+  }
+})
+
+const optionItems = computed(() => {
+  return JSON.parse(props.config?.optionItems || '[]')
+})
+
+const getItemValue = (idx) => {
+  const val = modelValue.value || ''
+  const valArr = val.split(',')
+  return valArr[idx]
+}
+const getDropdownItemProps = (config, idx) => {
+  return {
+    value: getItemValue(idx),
+    title: config?.label,
+    activetype: props.config?.activetype,
+    options: ((selects?.value && selects?.value?.[config?.selectKey]) || []).map(option => {
+      return {
+        label: lang?.value?.indexOf('zh') > -1 ? option.columnDesc_zh : option.columnDesc,
+        value: option.columnValue
+      }
+    }),
+    onChange(e) {
+      const val = modelValue.value || ''
+      const valArr = val.split(',')
+      valArr[idx] = e.detail.value
+      modelValue.value = valArr?.join(',')
+    }
+  }
+}
+</script>
+
+<template>
+  <cmi-dropdown-menu v-bind="{...dropdownMenuProps}">
+    <cmi-dropdown-item v-for="(config, idx) in optionItems" :key="JSON.stringify(config)" v-bind="{...getDropdownItemProps(config, idx)}"></cmi-dropdown-item>
+  </cmi-dropdown-menu>
+</template>

package/src/components/packages/CmiInput.vue

@@ -0,0 +1,45 @@
+<script setup>
+import { computed, defineProps, inject, useAttrs } from 'vue'
+import { commonPropsType } from '../../utils/index.js'
+
+const lang = inject('lang')
+const props = defineProps({
+  ...commonPropsType,
+})
+const inputProps = computed(() => {
+  return {
+    label: props.config?.label,
+    type: props.config?.type,
+    name: props.config?.name,
+    placeholder: lang?.value?.indexOf('zh') > -1 ? props.config?.defPlacehold : props.config?.defPlaceholdEn,
+    min: props.config?.min,
+    minlength: props.config?.minlength,
+    max: props.config?.max,
+    maxlength: props.config?.maxlength,
+    disabled: props.disabled,
+    readonly: props.config?.readonly ==='1',
+    required: props.required,
+    errormsg: props.config?.errormsg,
+    clearable: props.clearable,
+    showWordLimit: props.config?.showWordLimit === '1',
+    showPassword: props.config?.showPassword === '1',
+    prefixIcon: props.config?.prefixIcon,
+    suffixIcon: props.config?.suffixIcon,
+    minRows: props.config?.minRows,
+    maxRows: props.config?.maxRows,
+  }
+})
+const attrs = useAttrs()
+const modelValue = defineModel()
+const onChange = (e) => {
+  modelValue.value = e.detail.value
+}
+
+</script>
+
+<template>
+  <cmi-input
+    :value="modelValue" v-bind="{ ...attrs, ...inputProps,}" 
+    @change="onChange"
+  ></cmi-input>
+</template>

package/src/components/packages/CmiLink.vue

@@ -0,0 +1,28 @@
+<script setup>
+import { computed, defineProps, inject, useAttrs } from 'vue'
+import { commonPropsType } from '../../utils/index.js'
+
+const lang = inject('lang')
+const props = defineProps({
+  ...commonPropsType,
+})
+const linkProps = computed(() => {
+  return {
+    type: props.config?.type,
+    disabled: props.disabled,
+    href: props.config?.href,
+    target: props.config?.target
+  }
+})
+const modelValue = defineModel()
+
+const label = computed(() => {
+  return modelValue.value || (lang?.value?.indexOf('zh') > -1 ? props.config?.metaNameZh : props.config?.metaNameEn)
+})
+</script>
+
+<template>
+  <cmi-link v-bind="{...linkProps}">
+    {{ label }}
+  </cmi-link>
+</template>

package/src/components/packages/CmiPicker.vue

@@ -0,0 +1,120 @@
+<script setup>
+import { computed, defineProps, inject, ref, useAttrs, watch } from 'vue'
+import { commonPropsType } from '../../utils/index.js'
+
+const pickerRef = ref(null)
+const selects = inject('selects')
+const attrs = useAttrs()
+const lang = inject('lang')
+const modelValue = defineModel()
+const props = defineProps({
+  ...commonPropsType,
+})
+const open = computed({
+  get() {
+    return props?.config?.open === '1'
+  },
+  set(val) {
+    props.config.open = val ? '1' : '0'
+  }
+})
+const prefixIcon = computed(() => {
+  return props?.config?.prefixIcon
+})
+const suffixIcon = computed(() => {
+  return props?.config?.suffixIcon
+})
+
+const formatValue = computed({
+  get() {
+    return modelValue.value ? modelValue.value.split(',') : []
+  },
+  set(val) {
+    const formatVal = Array.isArray(val) ? val.join(',') : val
+    modelValue.value = formatVal
+  }
+})
+
+const calcProps = computed(() => {
+  const ret = {
+    type: props?.config?.displayType,
+    title: lang.value?.indexOf('zh') > -1 ? props.config?.metaNameZh : props.config?.metaNameEn,
+    canceltext: props?.config?.canceltext,
+    confirmtext: props?.config?.confirmtext,
+    bottomhidden: props?.config?.bottomhidden === '1',
+    forbidmaskclick: props?.config?.forbidmaskclick === '1',
+    fastpick: props?.config?.fastpick === '1',
+  }
+  return ret
+})
+const getColumns = () => {
+  const selectKeyArr = props.config?.selectKey?.split?.(',') || []
+  return selectKeyArr.map((key, idx) => {
+    return {
+      defaultIndex: selects?.value?.[key]?.find(option => option?.columnValue === formatValue.value[idx]) || 0,
+      values: selects?.value?.[key]?.map(option => ({
+        label: lang?.value?.indexOf('zh') > -1 ? option.columnDesc_zh : option.columnDesc,
+        value: option.columnValue
+      }))
+    }
+  })
+}
+
+const onFocus = () => {
+  open.value = true
+  pickerRef.value?.setColumns?.(getColumns())
+}
+
+const onClose = () => {
+  props.config?.onClose?.()
+  open.value = false
+}
+const onConfirm = (e) => {
+  const val = (e.detail.value || []).map(item => {
+    if (typeof item.value === 'object') {
+      return item.value?.value
+    } else {
+      return item.value
+    }
+  })
+  formatValue.value = val
+
+  props.config?.onConfirm?.(formatValue.value)
+  open.value = false
+}
+
+const modelvalDesc = computed(() => {
+  const columns = getColumns()
+  return formatValue.value?.reduce?.((ret, cur, idx) => {
+    const col = columns[idx]
+    const curItem = (col?.values || []).find(item => {
+      if (typeof item === 'object') {
+        return item.value === cur
+      } else {
+        return item == cur
+      }
+    })
+    const label = (typeof curItem === 'object' ? curItem.label : curItem) || ''
+    return ret ? `${ret},${label}` : `${label}`
+  }, '')
+})
+
+</script>
+
+<template>
+  <cmi-input :value="modelvalDesc" suffixIcon @focus="onFocus">
+    <div slot="suffix-icon" v-if="suffixIcon">
+      <component :is="`cmi-icon-${suffixIcon}`" color="#4E5969"></component>
+    </div>
+    <span slot="prefix" v-if="prefixIcon">
+      <component :is="`cmi-icon-${prefixIcon}`" color="#4E5969"></component>
+    </span>
+  </cmi-input>
+  <cmi-picker
+    ref="pickerRef"
+    v-bind="{...attrs, ...calcProps}"
+    :open="open"
+    @close="onClose"
+    @confirm="onConfirm"
+  />
+</template>

package/src/components/packages/CmiRadio.vue

@@ -0,0 +1,29 @@
+<script setup>
+import { computed, defineProps, inject, ref, useAttrs } from 'vue'
+import { commonPropsType } from '../../utils/index.js'
+
+const lang = inject('lang')
+const modelValue = defineModel()
+const props = defineProps({
+  ...commonPropsType,
+})
+const calcProps = computed(() => {
+  return {
+    direction: props.config?.direction,
+  }
+})
+const attrs = useAttrs()
+const onChange = (e) => {
+  modelValue.value = e.detail.value
+}
+</script>
+
+<template>
+  <cmi-radio-group :value="modelValue" v-bind="{ ...attrs, ...calcProps}" @change="onChange">
+    <cmi-radio 
+      v-for="option in props.options" :key="option.columnValue"
+      :disabled="option.columnStatus == '0' || option.columnStatus == '2'"
+      :name="option.columnValue" :label="lang.indexOf('zh') > -1 ? option.columnDesc_zh : option.columnDesc"
+    />
+  </cmi-radio-group>
+</template>

package/src/components/packages/CmiSearch.vue

@@ -0,0 +1,39 @@
+<script setup>
+import { computed, defineProps, inject, useAttrs } from 'vue'
+import { commonPropsType } from '../../utils/index.js'
+
+const lang = inject('lang')
+const modelValue = defineModel()
+const props = defineProps({
+  ...commonPropsType,
+})
+const calcProps = computed(() => {
+  return {
+    shape: props.config?.shape,
+    dark: props.config?.dark,
+    showback: props.config?.showback === '1',
+    showaction: props.config?.showaction === '1',
+    actiontext: props.config?.actiontext,
+    iconcolor: props.config?.iconcolor,
+    placeholder: lang?.value?.indexOf('zh') > -1 ? props.config?.defPlacehold : props.config?.defPlaceholdEn,
+    maxlength: props.config?.maxlength,
+    autofocus: props.config?.autofocus,
+    clearable: props.config?.clearable === '1',
+    disabled: props.disabled,
+    readonly: props.readonly,
+    noborder: props.config?.noborder,
+  }
+})
+const attrs = useAttrs()
+const onChange = (e) => {
+  modelValue.value = e.detail.value
+}
+
+</script>
+
+<template>
+  <cmi-search
+    :value="modelValue" v-bind="{ ...attrs, ...calcProps}" 
+    @change="onChange"
+  ></cmi-search>
+</template>

package/src/components/packages/CmiSelect.vue

@@ -0,0 +1,84 @@
+<script setup>
+import { computed, defineProps, inject, useAttrs } from 'vue'
+import { commonPropsType } from '../../utils/index.js'
+
+const modelValue = defineModel()
+const props = defineProps({
+  ...commonPropsType,
+  isMutiple: [String, Boolean]
+})
+const attrs = useAttrs()
+const lang = inject('lang')
+
+// 是否为多选
+const isMutiple = computed(() => {
+  return props.multiple === '1' || (typeof props.multiple === 'boolean' && props.multiple)
+})
+const showAll = computed(() => {
+  return props.showAll === '1'
+})
+const value = computed({
+  get() {
+    if (isMutiple.value) {
+      const val = modelValue.value || ''
+      return val ? val.split(',') : []
+    } else {
+      if (modelValue.value !== null && modelValue.value !== undefined) {
+        if (props.options?.some(item => item.columnValue == modelValue.value)) {
+          props.config.isMatch = true
+          return `${modelValue.value}`
+        } else {
+          props.config.isMatch = false
+          return ''
+        }
+      } else {
+        return ''
+      }
+    }
+  },
+  set(val) {
+    if (isMutiple.value) {
+      modelValue.value = val.join(',')
+    } else {
+      modelValue.value = val
+    }
+  }
+})
+
+const selectProps = computed(() => {
+  return {
+    label: lang?.value?.indexOf('zh') > -1 ? props.config?.metaNameZh : props.config?.metaNameEn,
+    value: value.value,
+    disabled: props.disabled,
+    clearable: props.clearable,
+    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,
+  }
+})
+const clear = () => {
+  value.value = ''
+}
+const onChange = ({detail}) => {
+  value.value = detail.value || []
+  props.config?.onChange(modelValue.value)
+}
+</script>
+
+<template>
+  <cmi-select class="custom-self-select" v-bind="{...attrs, ...selectProps}" @change="onChange" @clear="clear">
+    <cmi-option v-if="showAll" value="all" multiple>{{ lang.indexOf('zh') > -1 ? '全选' : 'All' }}</cmi-option>
+    <cmi-option v-for="option in (props.options || [])" :key="option.columnValue"
+      :label="lang.indexOf('zh') > -1 ? option.columnDesc_zh : option.columnDesc"
+      :value="option.columnValue"
+      :multiple="isMutiple"
+      :disabled="option.columnStatus == '0' || option.columnStatus == '2'"
+    />
+  </cmi-select>
+</template>
+
+<style lang="scss">
+.custom-self-select {
+}
+</style>

package/src/components/packages/CustomComponentCard.vue

@@ -0,0 +1,40 @@
+<template>
+  <ElCard class="custom-component-card" v-bind="cardProps">
+    <ElRow>
+      <Renderer :config="pmPageMetaList" v-model="modelValue"></Renderer>
+    </ElRow>
+  </ElCard>
+</template>
+<script setup>
+import { ElCard, ElRow } from 'element-plus'
+import { commonPropsType, hasOwn } from '../../utils/index.js'
+import Renderer from '../../renderer.jsx'
+import { computed } from 'vue'
+
+const modelValue = defineModel()
+const props = defineProps({
+  ...ElCard.props,
+  ...commonPropsType,
+})
+
+const cardProps = computed(() => {
+  const ret = Object.keys(ElCard.props).reduce((ret, key) => {
+    ret[key] = props[key]
+    return ret
+  }, {})
+  if (!hasOwn(ret, 'shadow')) {
+    ret.shadow = 'never'
+  }
+  return ret
+})
+
+const pmPageMetaList = computed(() => {
+  return props.config?.pmPageMetaList?.filter(item => !item.collapseSlot) || []
+})
+</script>
+<style lang="scss">
+.custom-component-card {
+  width: 100%;
+  box-sizing: border-box
+}
+</style>

package/src/components/packages/CustomComponentCardH5.vue

@@ -0,0 +1,40 @@
+<script setup>
+import { computed, inject, resolveComponent, useAttrs } from "vue";
+import Renderer from '../../renderer.jsx'
+import { commonPropsType, hasOwn } from '../../utils/index.js'
+
+const modelValue = defineModel()
+const props = defineProps({
+  ...commonPropsType,
+  subtitleZh: String,
+  subtitleEn: String,
+  content: String,
+  noborder: [Boolean, String],
+  cardbgcolor: String,
+})
+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,
+    content: props.content,
+    noborder: props.noborder == '1' ? true : false,
+    cardbgcolor: props.cardbgcolor,
+  }
+})
+
+const pmPageMetaList = computed(() => {
+  return props.config?.pmPageMetaList?.filter(item => !item.collapseSlot) || []
+})
+
+</script>
+<template>
+  <cmi-card v-bind="{...cmiProps, ...attrs}">
+    <div slot="content">
+      <Renderer :config="pmPageMetaList" v-model="modelValue"></Renderer>
+    </div>
+  </cmi-card>
+</template>
+<style lang="scss">
+</style>

package/src/components/packages/CustomComponentCol.vue

@@ -0,0 +1,69 @@
+<template>
+  <ElCol class="custom-component-row" :class="classRef" v-bind="{...elRowProps, ...attrs}">
+    <ElRow>
+      <Renderer :config="pmPageMetaList" v-model="props.refValue.value"></Renderer>
+    </ElRow>
+  </ElCol>
+</template>
+<script setup>
+import Renderer from '../../renderer.jsx'
+import { ElCol, ElRow } from 'element-plus'
+import { computed, defineProps, useAttrs } from 'vue'
+import { commonPropsType } from '../../utils/index.js'
+
+defineEmits(['update:modelValue'])
+
+const props = defineProps({
+  ...commonPropsType,
+  ...ElCol.props
+})
+const elRowProps = computed(() => {
+  return Object.keys(ElCol.props).reduce((ret, key) => {
+    ret[key] = props[key]
+    return ret
+  }, {})
+})
+const attrs = useAttrs()
+
+const classRef = computed(() => {
+  return {
+    'clear-right-margin': !reserveRightMargin.value,
+    'clear-bottom-margin': !reserveBottomMargin.value,
+  }
+})
+
+const pmPageMetaList = computed(() => {
+  return props.config?.pmPageMetaList || []
+})
+// 保留内部formItem的margin-right
+const reserveRightMargin = computed(() => {
+  return props.config?.reserveRightMargin
+})
+// 保留内部formItem的margin-bottom
+const reserveBottomMargin = computed(() => {
+  return props.config?.reserveBottomMargin
+})
+</script>
+<style lang="scss">
+.custom-component-row {
+  width: 100%;
+  .el-col {
+    & > .el-form-item {
+    }
+  }
+}
+.clear-right-margin {
+  .el-col {
+    & > .el-form-item {
+      margin-right: 0;
+    }
+  }
+}
+.clear-bottom-margin {
+  .el-col {
+    & > .el-form-item {
+      margin-bottom: 0;
+    }
+  }
+}
+</style>

package/src/components/packages/CustomComponentColH5.vue

@@ -0,0 +1,8 @@
+<script setup>
+</script>
+<template>
+  <div>
+    <slot></slot>
+  </div>
+</template>
+<style lang="scss"></style>