@idooel/components 0.0.1-beta.21 → 0.0.1-beta.22

package/packages/index.js

@@ -1,85 +1,90 @@
-import EleButton from './button/index.js'
-import EleDate from './date/index.js'
-import EleInput from './input/index.js'
-import EleSelect from './select/index.js'
-import EleTable from './table/index.js'
-import EleTree from './tree/index.js'
-import EleTpl from './tpl/index.js'
-import EleForm from './form/index.js'
-import EleAlert from './alert/index.js'
-import EleUpload from './upload/index.js'
-import EleSelectEntity from './select-entity/index.js'
-import EleIcon from './icon/index.js'
-import EleInputNumber from './input-number/index.js'
-import EleModal from './modal/index.js'
-import EleCheckbox from './checkbox/index.js'
-import EleRadio from './radio/index.js'
-import EleBatchExport from './batch-export/index.js'
-import EleDateRange from './date-range/index.js'
-
-import EleButtonGroup from './composite-components/button-group/index.js'
-import EleSearchArea from './composite-components/search-area/index.js'
-import EleModalImport from './composite-components/modal-import/index.js'
-
-import EleTreeTableModel from './tree-table-model/index.js'
-import EleFormPageModel from './form-model/index.js'
-import EleFormGroupModel from './form-group-model/index.js'
-import EleStepModel from './step-model/index.js'
-import EleTabs from './tabs/index.js'
-
-const compositeComponents = [
-  EleButtonGroup,
-  EleSearchArea,
-  EleModalImport
-]
-
-export const models = [
-  EleTreeTableModel,
-  EleFormPageModel,
-  EleFormGroupModel,
-  EleStepModel
-]
-
-const components = [
-  EleButton,
-  EleDate,
-  EleInput,
-  EleSelect,
-  EleTable,
-  EleTree,
-  EleTpl,
-  EleForm,
-  EleAlert,
-  EleUpload,
-  EleSelectEntity,
-  EleIcon,
-  EleInputNumber,
-  EleModal,
-  EleCheckbox,
-  EleRadio,
-  EleBatchExport,
-  EleDateRange,
-  ...compositeComponents,
-  ...models,
-  EleTabs
-]
-
-const install = (Vue) => {
-  if (install.installed) return
-  install.installed = true
-  components.forEach(component => {
-    Vue.component(component.name, component)
-  })
-}
-export default install
-export {
-  EleButton,
-  EleDate,
-  EleInput,
-  EleSelect,
-  EleTable,
-  EleTree,
-  EleTpl,
-  EleModal,
-  EleTabs
+import EleButton from './button/index.js'
+import EleDate from './date/index.js'
+import EleInput from './input/index.js'
+import EleSelect from './select/index.js'
+import EleTable from './table/index.js'
+import EleTree from './tree/index.js'
+import EleTpl from './tpl/index.js'
+import EleForm from './form/index.js'
+import EleAlert from './alert/index.js'
+import EleUpload from './upload/index.js'
+import EleSelectEntity from './select-entity/index.js'
+import EleIcon from './icon/index.js'
+import EleInputNumber from './input-number/index.js'
+import EleModal from './modal/index.js'
+import EleCheckbox from './checkbox/index.js'
+import EleRadio from './radio/index.js'
+import EleBatchExport from './batch-export/index.js'
+import EleDateRange from './date-range/index.js'
+
+import EleButtonGroup from './composite-components/button-group/index.js'
+import EleSearchArea from './composite-components/search-area/index.js'
+import EleModalImport from './composite-components/modal-import/index.js'
+
+import EleTreeTableModel from './tree-table-model/index.js'
+import EleFormPageModel from './form-model/index.js'
+import EleFormGroupModel from './form-group-model/index.js'
+import EleStepModel from './step-model/index.js'
+import EleTabs from './tabs/index.js'
+import EleImgCrop from './img-crop/index.js'
+import EleTextEditor from './text-editor/index.js'
+const compositeComponents = [
+  EleButtonGroup,
+  EleSearchArea,
+  EleModalImport
+]
+
+export const models = [
+  EleTreeTableModel,
+  EleFormPageModel,
+  EleFormGroupModel,
+  EleStepModel
+]
+
+const components = [
+  EleButton,
+  EleDate,
+  EleInput,
+  EleSelect,
+  EleTable,
+  EleTree,
+  EleTpl,
+  EleForm,
+  EleAlert,
+  EleUpload,
+  EleSelectEntity,
+  EleIcon,
+  EleInputNumber,
+  EleModal,
+  EleCheckbox,
+  EleRadio,
+  EleBatchExport,
+  EleDateRange,
+  ...compositeComponents,
+  ...models,
+  EleTabs,
+  EleImgCrop,
+  EleTextEditor
+]
+
+const install = (Vue) => {
+  if (install.installed) return
+  install.installed = true
+  components.forEach(component => {
+    Vue.component(component.name, component)
+  })
+}
+export default install
+export {
+  EleButton,
+  EleDate,
+  EleInput,
+  EleSelect,
+  EleTable,
+  EleTree,
+  EleTpl,
+  EleModal,
+  EleTabs,
+  EleImgCrop,
+  EleTextEditor
 }

package/packages/input/index.js

@@ -1,5 +1,5 @@
-import EleInput from './src/index.vue'
-
-EleInput.install = Vue => Vue.component(EleInput.name, EleInput)
-
+import EleInput from './src/index.vue'
+
+EleInput.install = Vue => Vue.component(EleInput.name, EleInput)
+
 export default EleInput

package/packages/input/src/index.vue

@@ -1,36 +1,36 @@
-<template>
-  <a-input :value="value" :disabled="disabled" :max-length="maxLength" @change="onChange"></a-input>
-</template>
-
-<script>
-export default {
-  name: 'ele-input',
-  model: {
-    prop: 'value',
-    event: 'change'
-  },
-  props: {
-    disabled: {
-      type: Boolean,
-      default: false
-    },
-    maxLength: {
-      type: Number,
-      default: 125
-    },
-    value: {
-      type: String
-    }
-  },
-  methods: {
-    onChange (e) {
-      this.$emit('change', e.target.value)
-      this.$emit('input', e.target.value)
-    }
-  } 
-}
-</script>
-
-<style scoped>
-
+<template>
+  <a-input :value="value" :disabled="disabled" :max-length="maxLength" @change="onChange"></a-input>
+</template>
+
+<script>
+export default {
+  name: 'ele-input',
+  model: {
+    prop: 'value',
+    event: 'change'
+  },
+  props: {
+    disabled: {
+      type: Boolean,
+      default: false
+    },
+    maxLength: {
+      type: Number,
+      default: 125
+    },
+    value: {
+      type: String
+    }
+  },
+  methods: {
+    onChange (e) {
+      this.$emit('change', e.target.value)
+      this.$emit('input', e.target.value)
+    }
+  } 
+}
+</script>
+
+<style scoped>
+
 </style>

package/packages/input-number/index.js

@@ -1,5 +1,5 @@
-import EleInputNumber from './src/index.vue'
-
-EleInputNumber.install = Vue => Vue.component(EleInputNumber.name, EleInputNumber)
-
+import EleInputNumber from './src/index.vue'
+
+EleInputNumber.install = Vue => Vue.component(EleInputNumber.name, EleInputNumber)
+
 export default EleInputNumber

package/packages/input-number/src/index.vue

@@ -1,24 +1,24 @@
-<template>
-  <div>
-    <a-input-number v-bind="$attrs" :value="value" :precision="precision" @change="onChange" style="width: 100%;"></a-input-number>
-  </div>
-</template>
-
-<script>
-export default {
-  name: 'ele-input-number',
-  props: {
-    precision: {
-      type: Number
-    },
-    value: {
-      type: [Number, String]
-    }
-  },
-  methods: {
-    onChange (value) {
-      this.$emit('change', value)
-    }
-  } 
-}
+<template>
+  <div>
+    <a-input-number v-bind="$attrs" :value="value" :precision="precision" @change="onChange" style="width: 100%;"></a-input-number>
+  </div>
+</template>
+
+<script>
+export default {
+  name: 'ele-input-number',
+  props: {
+    precision: {
+      type: Number
+    },
+    value: {
+      type: [Number, String]
+    }
+  },
+  methods: {
+    onChange (value) {
+      this.$emit('change', value)
+    }
+  } 
+}
 </script>

package/packages/modal/index.js

@@ -1,5 +1,5 @@
-import EleModal from './src/index.vue'
-
-EleModal.install = Vue => Vue.component(EleModal.name, EleModal)
-
+import EleModal from './src/index.vue'
+
+EleModal.install = Vue => Vue.component(EleModal.name, EleModal)
+
 export default EleModal

package/packages/modal/src/index.vue

@@ -1,142 +1,147 @@
-<template>
-  <a-modal
-    :title="title"
-    :cancelText="cancelText"
-    :okText="okText"
-    :closable="closable"
-    v-model:visible="showModal"
-    :width="width"
-    :keyboard="false"
-    :maskClosable="maskClosable"
-    :dialogStyle="{ top: `${upDownDistance[size]}px` }"
-    :bodyStyle="{ maxHeight: maxheight, overflowY: 'auto' }"
-    :footer="showFooter ? undefined : null"
-    @cancel="handleCancel"
-    @ok="handleOk"
-  >
-    <slot></slot>
-    <template slot="footer">
-      <div class="ele-modal__footer">
-        <ele-button
-          v-for="btn in buttonGroupMeta.elements"
-          :type="btn.type"
-          v-on="$listeners"
-          :event-name="btn.eventName"
-          :key="btn.key">
-          {{ btn.label }}
-        </ele-button>
-      </div>
-    </template>
-  </a-modal>
-</template>
-<script>
-export default {
-  name: 'ele-modal',
-  props: {
-    value: {
-      type: Boolean,
-      default: false
-    },
-    title: {
-      type: String,
-      default: '标题'
-    },
-    cancelText: {
-      type: String,
-      default: '关闭'
-    },
-    okText: {
-      type: String,
-      default: '确定'
-    },
-    size: {
-      type: String,
-      default: 'middle'
-    },
-    map: {
-      type: Object,
-      default () {
-        return {}
-      }
-    },
-    closable: {
-      type: Boolean,
-      default: true
-    },
-    maskClosable: {
-      type: Boolean,
-      default: false
-    },
-    showFooter: {
-      type: Boolean,
-      default: true
-    },
-    footer: {
-      type: Function,
-      default: null
-    },
-    onlyClose: {
-      type: Boolean,
-      default: false
-    },
-    buttonGroupMeta: {
-      type: Object,
-      default: () => ({})
-    }
-  },
-  watch: {
-    value (newVal) {
-      this.$nextTick(() => {
-        this.showModal = newVal
-      })
-    }
-  },
-  computed: {
-    width () {
-      return this.map[this.size]
-    },
-    maxheight () {
-      return `calc(100vh - ${this.upDownDistance[this.size] * 2 + (this.title ? 55 : 0) + (this.showFooter ? 53 : 0) }px`
-    }
-  },
-  data () {
-    return {
-      showModal: false
-    }
-  },
-  created () {
-    let defaultMap = {
-      small: 480,
-      middle: 768,
-      big: 1200
-    }
-    this.upDownDistance = {
-      small: 80,
-      middle: 80,
-      big: 40
-    }
-    this.map = Object.assign(this.map, defaultMap)
-  },
-  methods: {
-    openModal () {
-      this.showModal = true
-      this.removeHidden()
-    },
-    handleCancel () {
-      this.showModal = false
-      this.removeHidden()
-      console.log('on-cancel')
-      this.$emit('cancel')
-      this.$emit('input', this.showModal)
-    },
-    handleOk () {
-      console.log('on-ok')
-      this.$emit('ok')
-    },
-    removeHidden () {
-      let ishidden = document.body.style.overflow === 'hidden'
-      ishidden && (document.body.style.overflow = 'initial')
-    }
-  }
-}
+<template>
+  <a-modal
+    :title="title"
+    :cancelText="cancelText"
+    :okText="okText"
+    :closable="closable"
+    v-model:visible="showModal"
+    :width="width"
+    :keyboard="false"
+    :maskClosable="maskClosable"
+    :dialogStyle="{ top: `${upDownDistance[size]}px` }"
+    :bodyStyle="{ maxHeight: maxheight, overflowY: 'auto' }"
+    :footer="showFooter ? undefined : null"
+    @cancel="handleCancel"
+    @ok="handleOk"
+  >
+    <slot></slot>
+    <template slot="footer" v-if="!showDefaultFooter">
+      <div class="ele-modal__footer">
+        <ele-button
+          v-for="btn in buttonGroupMeta.elements"
+          :type="btn.type"
+          v-on="$listeners"
+          :event-name="btn.eventName"
+          :key="btn.key">
+          {{ btn.label }}
+        </ele-button>
+      </div>
+    </template>
+  </a-modal>
+</template>
+<script>
+export default {
+  name: 'ele-modal',
+  props: {
+    value: {
+      type: Boolean,
+      default: false
+    },
+    title: {
+      type: String,
+      default: '标题'
+    },
+    cancelText: {
+      type: String,
+      default: '关闭'
+    },
+    okText: {
+      type: String,
+      default: '确定'
+    },
+    size: {
+      type: String,
+      default: 'middle'
+    },
+    map: {
+      type: Object,
+      default () {
+        return {}
+      }
+    },
+    closable: {
+      type: Boolean,
+      default: true
+    },
+    maskClosable: {
+      type: Boolean,
+      default: false
+    },
+    showFooter: {
+      type: Boolean,
+      default: true
+    },
+    footer: {
+      type: Function,
+      default: null
+    },
+    onlyClose: {
+      type: Boolean,
+      default: false
+    },
+    buttonGroupMeta: {
+      type: Object,
+      default: () => ({})
+    },
+    // 是否展示组件默认底部按钮
+    showDefaultFooter: {
+      type: Boolean,
+      default: false
+    }
+  },
+  watch: {
+    value (newVal) {
+      this.$nextTick(() => {
+        this.showModal = newVal
+      })
+    }
+  },
+  computed: {
+    width () {
+      return this.map[this.size]
+    },
+    maxheight () {
+      return `calc(100vh - ${this.upDownDistance[this.size] * 2 + (this.title ? 55 : 0) + (this.showFooter ? 53 : 0) }px`
+    }
+  },
+  data () {
+    return {
+      showModal: false
+    }
+  },
+  created () {
+    let defaultMap = {
+      small: 480,
+      middle: 768,
+      big: 1200
+    }
+    this.upDownDistance = {
+      small: 80,
+      middle: 80,
+      big: 40
+    }
+    this.map = Object.assign(this.map, defaultMap)
+  },
+  methods: {
+    openModal () {
+      this.showModal = true
+      this.removeHidden()
+    },
+    handleCancel () {
+      this.showModal = false
+      this.removeHidden()
+      console.log('on-cancel')
+      this.$emit('cancel')
+      this.$emit('input', this.showModal)
+    },
+    handleOk () {
+      console.log('on-ok')
+      this.$emit('ok')
+    },
+    removeHidden () {
+      let ishidden = document.body.style.overflow === 'hidden'
+      ishidden && (document.body.style.overflow = 'initial')
+    }
+  }
+}
 </script>

package/packages/radio/index.js

@@ -1,5 +1,5 @@
-import EleRadio from './src/index.vue'
-
-EleRadio.install = Vue => Vue.component(EleRadio.name, EleRadio)
-
+import EleRadio from './src/index.vue'
+
+EleRadio.install = Vue => Vue.component(EleRadio.name, EleRadio)
+
 export default EleRadio