@idooel/components 0.0.1-beta.39 → 0.0.1-beta.40

package/packages/checkbox/src/index.vue

@@ -1,53 +1,53 @@
-<template>
-  <a-checkbox-group
-    :value="value"
-    :options="dataSource" 
-    :disabled="disabled" 
-    @change="onChange">
-  </a-checkbox-group>
-</template>
-
-<script>
-export default {
-  name: 'ele-checkbox',
-  model: {
-    prop: 'value',
-    event: 'change'
-  },
-  props: {
-    value: {
-      type: Array
-    },
-    dataSource: {
-      type: Array,
-      default: () => []
-    },
-    disabled: {
-      type: Boolean,
-      default: false
-    }
-  },
-  methods: {
-    onChange (value) {
-      this.$emit('change', value)
-      this.$emit('input', value)
-    }
-  }
-}
-</script>
-<style lang="scss" scoped>
-.ant-checkbox-group {
-  text-align: left;
-  line-height: 32px;
-}
-.has-error {
-  .ant-checkbox-group {
-    ::v-deep .ant-checkbox-wrapper {
-      color: var(--idooel-form-border-err-color);
-    }
-    ::v-deep .ant-checkbox-inner {
-      border-color: var(--idooel-form-border-err-color);
-    }
-  }
-}
+<template>
+  <a-checkbox-group
+    :value="value"
+    :options="dataSource" 
+    :disabled="disabled" 
+    @change="onChange">
+  </a-checkbox-group>
+</template>
+
+<script>
+export default {
+  name: 'ele-checkbox',
+  model: {
+    prop: 'value',
+    event: 'change'
+  },
+  props: {
+    value: {
+      type: Array
+    },
+    dataSource: {
+      type: Array,
+      default: () => []
+    },
+    disabled: {
+      type: Boolean,
+      default: false
+    }
+  },
+  methods: {
+    onChange (value) {
+      this.$emit('change', value)
+      this.$emit('input', value)
+    }
+  }
+}
+</script>
+<style lang="scss" scoped>
+.ant-checkbox-group {
+  text-align: left;
+  line-height: 32px;
+}
+.has-error {
+  .ant-checkbox-group {
+    ::v-deep .ant-checkbox-wrapper {
+      color: var(--idooel-form-border-err-color);
+    }
+    ::v-deep .ant-checkbox-inner {
+      border-color: var(--idooel-form-border-err-color);
+    }
+  }
+}
 </style>

package/packages/composite-components/button-group/index.js

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

package/packages/composite-components/button-group/src/index.vue

@@ -1,54 +1,89 @@
-<template>
-  <div class="button-group__wrapper">
-    <template v-for="(item, idx) in dataSource" >
-      <ele-button
-        v-if="isBool(item._show) ? item._show : true"
-        :type="item.type"
-        :icon="item.icon"
-        :mode="item.mode"
-        :data-source="item.optionList"
-        :event-name="item.eventName"
-        :record="item"
-        v-on="$listeners"
-        :key="idx">
-        {{ item.label }}
-      </ele-button>
-    </template>
-  </div>
-</template>
-
-<script>
-import EleButton from '../../../button/src/index.vue'
-import { type } from '@idooel/shared'
-export default {
-  name: 'ele-button-group',
-  components: {
-    EleButton
-  },
-  props: {
-    dataSource: {
-      type: Array,
-      default: () => []
-    }
-  },
-  methods: {
-    isBool (arg) {
-      return type.isBool(arg)
-    }
-  }
-}
-</script>
-
-<style lang="scss" scoped>
-.button-group__wrapper {
-  display: flex;
-  padding-left: 16px;
-  padding-right: 16px;
-  .ant-btn {
-    margin-left: 8px;
-    &:first-child {
-      margin-left: 0;
-    }
-  }
-}
+<template>
+  <div class="button-group__wrapper">
+    <template v-for="(item, idx) in innerDatasource" >
+      <ele-button
+        v-if="isBool(item._show) ? item._show : true"
+        :type="item.type"
+        :icon="item.icon"
+        :mode="item.mode"
+        :data-source="item.optionList"
+        :event-name="item.eventName"
+        :record="item"
+        v-on="$listeners"
+        :key="idx">
+        {{ item.label }}
+      </ele-button>
+    </template>
+  </div>
+</template>
+
+<script>
+import { type } from '@idooel/shared'
+import { parse } from '@idooel/expression'
+import { CONTEXT } from '../../../utils'
+export default {
+  name: 'ele-button-group',
+  props: {
+    dataSource: {
+      type: Array,
+      default: () => []
+    }
+  },
+  data() {
+    return {
+      innerDatasource: []
+    }
+  },
+  inject: {
+    [CONTEXT]: {
+      default: () => ({})
+    }
+  },
+  computed: {
+    currentContext () {
+      return {
+        _route: this.$route.query,
+        _routeMeta: this.$route.meta,
+        ...this[CONTEXT]
+      }
+    }
+  },
+  watch: {
+    dataSource: {
+      handler (dataSource) {
+        this.innerDatasource = dataSource.map(item => {
+          return {
+            ...item,
+            _show: this.executeExpression(item.show)
+          }
+        })
+      },
+      immediate: true
+    }
+  },
+  methods: {
+    executeExpression (expression) {
+      if (type.isBool(expression)) return expression
+      if (type.isEmpty(expression)) return true
+      return parse(expression, { ...this.currentContext })
+    },
+    isBool (arg) {
+      return type.isBool(arg)
+    }
+  }
+}
+</script>
+
+<style lang="scss" scoped>
+.button-group__wrapper {
+  display: flex;
+  padding-left: 16px;
+  padding-right: 16px;
+  .ant-btn {
+    margin-left: 8px;
+    &:first-child {
+      margin-left: 0;
+    }
+  }
+}
 </style>

package/packages/composite-components/{attachment → form-attachment}/src/index.vue

@@ -1,15 +1,15 @@
-<template>
-  <div>
-    attachment
-  </div>
-</template>
-
-<script>
-export default {
-  name: 'ele-attachment'
-}
-</script>
-
-<style lang="scss" scoped>
-
+<template>
+  <div>
+    attachment
+  </div>
+</template>
+
+<script>
+export default {
+  name: 'ele-form-attachment'
+}
+</script>
+
+<style lang="scss" scoped>
+
 </style>

package/packages/composite-components/modal-confirm/index.js

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

package/packages/composite-components/modal-confirm/src/index.vue

@@ -0,0 +1,69 @@
+<template>
+  <ele-modal :title="title" :value="value" :size="size" @cancel="onCancel"  v-on="$listeners" :buttonGroupMeta="buttonGroupMeta">
+    <ele-alert v-bind="alert"></ele-alert>
+    <div v-if="contentText" class="ele-modal-confirm__content">
+      {{ contentText }}
+    </div>
+  </ele-modal>
+</template>
+
+<script>
+export default {
+  name: 'ele-modal-confirm',
+  model: {
+    event: 'change',
+    prop: 'value'
+  },
+  props: {
+    title: {
+      type: String
+    },
+    size: {
+      type: String,
+      default: 'small'
+    },
+    alert: {
+      type: Object,
+      default: () => ({
+        type: 'warning',
+        message: '确定要删除吗？',
+        description: '删除后将无法恢复',
+        closable: false
+      })
+    },
+    contentText: {
+      type: String
+    },
+    value: {
+      type: Boolean,
+      default: false
+    },
+    buttonGroupMeta: {
+      type: Object
+    },
+    contextProp: {
+      type: Object,
+      default: () => ({})
+    }
+  },
+  data () {
+    return {}
+  },
+  methods: {
+    onCancel () {
+      this.$emit('change', false)
+    }
+  }
+}
+</script>
+<style lang="scss">
+@import '../../../theme/index';
+</style>
+<style lang="scss" scoped>
+.ele-modal-confirm__content {
+  margin-top: 8px;
+  color: var(--idoole-black-088);
+  font-size: 14px;
+  line-height: 22px;
+}
+</style>

package/packages/composite-components/modal-form/index.js

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