eoss-ui 0.3.97

package/packages/theme-chalk/src/upload.scss

@@ -0,0 +1,131 @@
+@import 'base.scss';
+
+.es-avatar-uploader {
+  .el-upload {
+    border: 1px dashed #d9d9d9;
+    border-radius: 6px;
+    cursor: pointer;
+    position: relative;
+    overflow: hidden;
+  }
+  .el-upload:hover {
+    border-color: #409eff;
+  }
+  .avatar-uploader-icon {
+    display: inline-block;
+    font-size: 28px;
+    color: #8c939d;
+    width: 100px;
+    height: 100px;
+    line-height: 100px;
+    text-align: center;
+  }
+  .avatar {
+    width: 100px;
+    height: 100px;
+    display: block;
+  }
+}
+.es-uploader-icon {
+  border: 1px dashed #d9d9d9;
+  border-radius: 6px;
+  cursor: pointer;
+  position: relative;
+  overflow: hidden;
+  font-size: 28px;
+  color: #8c939d;
+  width: 100px;
+  height: 100px;
+  line-height: 100px;
+  text-align: center;
+}
+.el-upload--picture-card {
+  .es-uploader-icon {
+    top: 50%;
+    transform: translateY(-50%);
+  }
+}
+.es-upload-text {
+  & > .el-upload-list,
+  & > .el-scrollbar {
+    margin-top: 8px;
+  }
+}
+.el-upload-list {
+  .el-upload-list-table {
+    .el-upload-list__item-box {
+      .el-upload-list_file-info {
+        &.el-upload-list_file-info-uploadTime {
+          width: 152px;
+        }
+        &.el-upload-list_file-info-fileSize {
+          width: 72px;
+        }
+        &.el-upload-list_file-info-userName {
+          width: 82px;
+        }
+      }
+    }
+  }
+}
+.es-upload-readonly {
+  &:not(.es-avatar-uploader) {
+    .el-upload {
+      display: none;
+    }
+  }
+  &.es-upload-text:not(.es-avatar-uploader) {
+    .el-upload-list__item:first-child {
+      margin-top: 5px;
+    }
+  }
+  &.es-avatar-uploader {
+    .el-upload {
+      cursor: default;
+      border: 0;
+    }
+  }
+}
+.es-upload-dialog {
+  width: 100%;
+  height: 100%;
+  @extend .es-flex;
+  @extend .es-align-middle;
+  @extend .es-align-center;
+}
+.el-upload--handle {
+  .el-upload--text + .es-upload-downloads {
+    margin-left: 8px;
+  }
+}
+.es-upload-picture-card {
+  position: relative;
+  padding-top: 40px;
+  .el-upload--handle {
+    .el-upload--picture-card + .es-upload-downloads {
+      position: absolute;
+      left: 0;
+      top: 0;
+    }
+  }
+  &.es-upload-readonly {
+    .el-upload--handle {
+      padding-top: 0;
+      position: absolute;
+      left: 0;
+      top: 0;
+    }
+  }
+}
+.es-upload-picture {
+  .el-upload--handle {
+    display: block;
+    position: relative;
+    vertical-align: bottom;
+    .el-upload--picture + .es-upload-downloads {
+      float: right;
+      position: relative;
+      top: 68px;
+    }
+  }
+}

package/packages/theme-chalk/src/wxlogin.scss

@@ -0,0 +1,3 @@
+.es-wx-qrcode {
+  margin: 0 auto;
+}

package/packages/tips/index.js

@@ -0,0 +1,5 @@
+import EsTips from './src/main';
+
+EsTips.install = Vue => Vue.component(EsTips.name, EsTips);
+
+export default EsTips;

package/packages/tips/src/main.vue

@@ -0,0 +1,126 @@
+<template>
+  <el-tooltip class="item" :placement="placement" v-bind="$attrs">
+    <template slot="content">
+      <ul class="es-tips-content">
+        <li class="es-tips-item" v-for="item in tipCotent" :key="item">
+          {{ item }}
+        </li>
+      </ul>
+    </template>
+    <slot>
+      <i
+        class="es-icon-help"
+        :class="'es-tips' + (position ? '-' + position : position)"
+      ></i>
+    </slot>
+  </el-tooltip>
+</template>
+<script>
+import { gethelpdoc } from 'eoss-ui/src/config/api.js';
+import util from 'eoss-ui/src/utils/util.js';
+export default {
+  name: 'EsTips',
+  inheritAttrs: false,
+  props: {
+    method: {
+      type: String,
+      default: 'get'
+    },
+    url: {
+      type: String,
+      default: gethelpdoc
+    },
+    param: {
+      type: Object,
+      default() {
+        return {};
+      }
+    },
+    content: {
+      type: String,
+      default: ''
+    },
+    contents: {
+      type: [String, Array],
+      default: ''
+    },
+    placement: {
+      type: String,
+      default: 'right'
+    },
+    position: {
+      type: String,
+      default: ''
+    },
+    labelKey: {
+      type: String,
+      default: 'name'
+    },
+    spill: {
+      type: Boolean,
+      default() {
+        return false;
+      }
+    },
+    disabled: Boolean
+  },
+  data() {
+    return {
+      reselutContent: ''
+    };
+  },
+  computed: {
+    tipCotent() {
+      const content = this.reselutContent || this.contents || this.content;
+      if (content && content.length > 0) {
+        if (typeof content === 'string') {
+          return [content];
+        } else {
+          if (util.isObject(content[0])) {
+            return content.map(item => {
+              return item[this.labelKey];
+            });
+          } else {
+            return content;
+          }
+        }
+      } else {
+        return [];
+      }
+    }
+  },
+  watch: {
+    url(val) {
+      if (val) {
+        this.getTips();
+      }
+    }
+  },
+  mounted() {
+    if (this.url && !this.contents && JSON.stringify(this.param) !== '{}') {
+      this.getTips();
+    }
+  },
+  methods: {
+    getTips() {
+      util
+        .ajax({
+          url: this.url,
+          method: this.method,
+          data: this.params,
+          params: this.params
+        })
+        .then(res => {
+          if (res.rCode === 0) {
+            this.reselutContent = res;
+          }
+        })
+        .catch(err => {
+          if (err.message && err.message !== 'canceled') {
+            this.$message.error(err.message);
+          }
+        });
+    }
+  }
+};
+</script>

package/packages/toolbar/index.js

@@ -0,0 +1,5 @@
+import EsToolbar from './src/main';
+
+EsToolbar.install = Vue => Vue.component(EsToolbar.name, EsToolbar);
+
+export default EsToolbar;

package/packages/toolbar/src/main.vue

@@ -0,0 +1,377 @@
+<script>
+export default {
+  name: 'EsToolbar',
+  inheritAttrs: false,
+  inject: {
+    table: {
+      default: ''
+    }
+  },
+  props: {
+    searchValue: {
+      type: Object,
+      default: () => {
+        return {};
+      }
+    },
+    advanceValue: {
+      type: Object,
+      default: () => {
+        return {};
+      }
+    },
+    contents: {
+      type: Array,
+      default: []
+    },
+    active: String,
+    fixed: {
+      type: Boolean,
+      default: false
+    },
+    close: Boolean,
+    callBack: {
+      type: Function,
+      default: () => {}
+    },
+    showFormBtn: {
+      type: Boolean,
+      default: true
+    },
+    small: {
+      type: Boolean,
+      default: true
+    }
+  },
+  computed: {
+    searchData: {
+      get() {
+        let value;
+        for (let i = 0; i < this.contents.length; i++) {
+          if (this.contents[i].type === 'search') {
+            value = this.contents[i].value || this.contents[i].searchValue;
+            break;
+          }
+        }
+        return value ? value : this.searchValue;
+      },
+      set(val) {
+        return val;
+      }
+    },
+    advancedData: {
+      get() {
+        let value;
+        for (let i = 0; i < this.contents.length; i++) {
+          if (this.contents[i].type === 'filter') {
+            value = this.contents[i].value || this.contents[i].searchValue;
+            break;
+          }
+        }
+        return value ? value : this.advanceValue;
+      },
+      set(val) {
+        return val;
+      }
+    }
+  },
+  data() {
+    return {
+      show: false
+    };
+  },
+  created() {
+    //this.traversal();
+  },
+  mounted() {
+    this.$nextTick(() => {
+      this.callBack();
+    });
+  },
+  methods: {
+    handleClick(res) {
+      if (!this.table && res.event && typeof res.event === 'function') {
+        res.event(res);
+      } else {
+        this.$emit('click', { handle: res });
+      }
+    },
+    hanleSearch(data, multi) {
+      let other = {};
+      if (multi) {
+        for (let i in multi) {
+          other[i] = data[multi[i]];
+        }
+      }
+      this.$emit('search', { ...data, ...other });
+    },
+    handleChange(key, value, data, item) {
+      let obj = {};
+      obj[key] = value;
+      if (item.changeSearch) {
+        this.$emit('search', obj);
+      }
+      this.$emit('change', key, value, data);
+    },
+    hanleSubmit(data) {
+      if (this.close) {
+        this.show = false;
+      }
+      this.$emit('submit', { data: data });
+    },
+    handleSelect(res, num) {
+      this.$emit('tabs', { item: res, index: num });
+    },
+    hanleReset() {
+      this.searchData = {};
+      this.advancedData = {};
+      this.$emit('reset');
+    },
+    hanleCancel() {
+      this.show = false;
+      this.$emit('cancel');
+    }
+  },
+  render(h) {
+    let text = [];
+    let buttons = [];
+    let search = [];
+    let info = [];
+    let filter = [];
+
+    this.contents.forEach(items => {
+      if (items.type === 'text') {
+        text = [
+          h(
+            'div',
+            { class: 'es-toolbar-text' },
+            Array.isArray(items.contents)
+              ? items.contents.map(item => {
+                  return h('span', { class: 'es-text' }, [
+                    h('span', { class: 'es-info-label' }, [`${item.label}：`]),
+                    h('span', { class: 'es-info-value' }, [item.value])
+                  ]);
+                })
+              : items.contents
+          )
+        ];
+      }
+      if (items.type === 'button') {
+        items.contents.forEach(item => {
+          if (!item.hide && (item.upload || (item.code && item.ownId))) {
+            buttons.push(
+              h('es-upload', {
+                class: 'el-button',
+                attrs: {
+                  ...item,
+                  method: 'post',
+                  btnSize: 'medium',
+                  showFileList: false,
+                  selectType: item.type ? item.type : ''
+                }
+              })
+            );
+          } else {
+            buttons.push(
+              h(
+                'es-button',
+                {
+                  attrs: {
+                    ...item,
+                    size: 'medium'
+                  },
+                  on: {
+                    click: () => {
+                      this.handleClick(item);
+                    }
+                  }
+                },
+                item.text
+              )
+            );
+          }
+        });
+      }
+      if (items.type === 'tabs') {
+        buttons.concat([
+          h(
+            'el-menu',
+            {
+              class: 'el-button',
+              props: {
+                defaultActive: this.active
+                  ? this.active
+                  : items.contents[0].name
+                  ? items.contents[0].name
+                  : '0',
+                mode: 'horizontal'
+              },
+              on: {
+                select: res => {
+                  this.handleSelect(items.contents[parseInt(res, 10)], res);
+                }
+              }
+            },
+            items.contents.map((item, index) => {
+              return h(
+                'el-menu-item',
+                {
+                  props: {
+                    index: item.name ? item.name : String(index)
+                  }
+                },
+                item.label || item.text
+              );
+            })
+          )
+        ]);
+      }
+      if (items.type === 'search') {
+        let itemClass = {
+          radio: 'es-toolbar-item-radio',
+          checkbox: 'es-toolbar-item-checkbox',
+          switch: 'es-toolbar-item-switch'
+        };
+        search = [
+          h('es-form', {
+            class: [
+              'es-form-search',
+              this.small ? 'es-form-search-small' : '',
+              this.showFormBtn ? '' : 'es-form-search-nobtn'
+            ],
+            props: {
+              size: 'medium',
+              showLabel: false,
+              closeDialog: false,
+              model: this.searchData,
+              contents: items.contents,
+              showButton: items.showButton,
+              itemClass: itemClass,
+              inline: true,
+              search: true,
+              isReset: items.reset,
+              showButton: this.showFormBtn
+            },
+            on: {
+              submit: data => {
+                this.hanleSearch(data, items.multiCondition);
+              },
+              reset: this.hanleReset,
+              change: this.handleChange
+            }
+          })
+        ];
+      }
+      if (items.type === 'info') {
+        info = [
+          h(
+            'div',
+            { class: 'es-toolbar-info' },
+            items.contents.map(item => {
+              return h('span', { class: 'es-info' }, [
+                h('span', { class: 'es-info-label' }, [`${item.label}：`]),
+                h('span', { class: 'es-info-value' }, [item.value])
+              ]);
+            })
+          )
+        ];
+      }
+      if (items.type === 'filter') {
+        info.push(
+          h(
+            'el-button',
+            {
+              class: 'es-advanced-btn',
+              props: {
+                type: 'primary',
+                size: 'medium'
+              },
+              on: {
+                click: () => {
+                  this.show = !this.show;
+                }
+              }
+            },
+            '高级搜索'
+          )
+        );
+        filter = h(
+          'transition',
+          {
+            props: {
+              name: 'el-zoom-in-top'
+            }
+          },
+          [
+            h(
+              'div',
+              {
+                class: {
+                  'es-absolute': !this.fixed,
+                  'es-advanced-filter': 1
+                },
+                directives: [
+                  {
+                    name: 'show',
+                    value: this.show
+                  }
+                ]
+              },
+              [
+                h(
+                  'es-form',
+                  {
+                    class: 'es-form-search',
+                    props: {
+                      size: 'medium',
+                      closeDialog: false,
+                      model: this.advancedData,
+                      contents: items.contents
+                    },
+                    on: {
+                      submit: this.hanleSubmit,
+                      reset: this.hanleCancel
+                    }
+                  },
+                  []
+                )
+              ]
+            )
+          ]
+        );
+      }
+    });
+    let box = [
+      h(
+        'div',
+        {
+          class: 'es-button-content'
+        },
+        buttons
+      )
+    ];
+    let dom;
+    if (text.length) {
+      dom = text.concat(box, search, info);
+    } else {
+      dom = box.concat(search, info);
+    }
+    return h(
+      'div',
+      {
+        class: 'es-toolbar'
+      },
+      [
+        h(
+          'div',
+          {
+            class: 'es-toolbar-content'
+          },
+          dom
+        ),
+        filter
+      ]
+    );
+  }
+};
+</script>

package/packages/tree/index.js

@@ -0,0 +1,5 @@
+import EsTree from './src/main';
+
+EsTree.install = Vue => Vue.component(EsTree.name, EsTree);
+
+export default EsTree;