@supermapgis/vue-iclient-leaflet 11.2.0

package/src/common/menu/index.js

@@ -0,0 +1,13 @@
+import Menu from './Menu';
+import MenuItem from './MenuItem';
+import SubMenu from './SubMenu';
+import init from 'vue-iclient/src/init';
+
+Menu.install = function(Vue, opts) {
+  init(Vue, opts);
+  Vue.component(Menu.options ? Menu.options.name : Menu.name, Menu);
+  Vue.component(MenuItem.options ? MenuItem.options.name : MenuItem.name, MenuItem);
+  Vue.component(SubMenu.options ? SubMenu.options.name : SubMenu.name, SubMenu);
+};
+
+export default Menu;

package/src/common/menu/style/index.js

@@ -0,0 +1,4 @@
+import 'vue-iclient/src/common/_assets/iconfont/icon-sm-components.css';
+import 'vue-iclient/src/common/_utils/style/common/common.scss';
+import './index.less';
+import './menu.scss';

package/src/common/menu/style/index.less

@@ -0,0 +1,3 @@
+@import 'ant-design-vue/es/menu/style/index.less';
+@import 'ant-design-vue/es/style/index.less';
+@import '../../_utils/style/theme/antdVar.less';

package/src/common/message/Message.js

@@ -0,0 +1,12 @@
+import api from 'ant-design-vue/es/message';
+
+const defaultPrefixCls = 'sm-component-message';
+const configCallback = api.config;
+configCallback({ prefixCls: defaultPrefixCls });
+api.config = function(options) {
+  if (options.prefixCls && options.prefixCls !== defaultPrefixCls) {
+    api.destroy();
+  }
+  configCallback({ ...options, prefixCls: options.prefixCls || defaultPrefixCls });
+};
+export default api;

package/src/common/message/index.js

@@ -0,0 +1,3 @@
+import Message from './Message.js';
+
+export default Message;

package/src/common/message/style/index.js

@@ -0,0 +1,4 @@
+import 'vue-iclient/src/common/_assets/iconfont/icon-sm-components.css';
+import 'vue-iclient/src/common/_utils/style/common/common.scss';
+import './index.less';
+import './message.scss';

package/src/common/message/style/index.less

@@ -0,0 +1,3 @@
+@import 'ant-design-vue/es/message/style/index.less';
+@import 'ant-design-vue/es/style/index.less';
+@import '../../_utils/style/theme/antdVar.less';

package/src/common/message/style/message.scss

@@ -0,0 +1,16 @@
+@import "../../_utils/style/mixins/mixins.scss";
+@import '../../_utils/style/theme/theme.scss';
+
+@include b(message) {
+  &-notice-content {
+    background: $message-background;
+  }
+
+  &-error .#{$iconfont-css-prefix} {
+    color: $error-color;
+  }
+
+  &-warning .#{$iconfont-css-prefix} {
+    color: $warning-color;
+  }
+}

package/src/common/modal/Modal.vue

@@ -0,0 +1,64 @@
+<script lang="ts">
+import Modal from 'ant-design-vue/es/modal';
+import Theme from 'vue-iclient/src/common/_mixin/Theme';
+import VueTypes from 'vue-iclient/src/common/_utils/vue-types';
+import buttonTypes from 'ant-design-vue/es/button/buttonTypes';
+import AntdRender from 'vue-iclient/src/common/_mixin/AntdRender';
+
+let ButtonType = buttonTypes().type;
+
+export const modalTypes = {
+  prefixCls: VueTypes.string,
+  visible: VueTypes.bool,
+  confirmLoading: VueTypes.bool,
+  title: VueTypes.any,
+  closable: VueTypes.bool,
+  closeIcon: VueTypes.any,
+  afterClose: VueTypes.func,
+  centered: VueTypes.bool,
+  width: VueTypes.oneOfType([VueTypes.string, VueTypes.number]),
+  footer: VueTypes.any,
+  okText: VueTypes.any,
+  okType: ButtonType,
+  cancelText: VueTypes.any,
+  icon: VueTypes.any,
+  maskClosable: VueTypes.bool,
+  forceRender: VueTypes.bool,
+  okButtonProps: VueTypes.object,
+  cancelButtonProps: VueTypes.object,
+  destroyOnClose: VueTypes.bool,
+  wrapClassName: VueTypes.string,
+  maskTransitionName: VueTypes.string,
+  transitionName: VueTypes.string,
+  getContainer: VueTypes.func,
+  zIndex: VueTypes.number,
+  bodyStyle: VueTypes.object,
+  maskStyle: VueTypes.object,
+  mask: VueTypes.bool,
+  keyboard: VueTypes.bool,
+  wrapProps: VueTypes.object,
+  focusTriggerAfterClose: VueTypes.bool
+};
+
+export default {
+  name: 'SmModal',
+  defaultComponent: Modal,
+  mixins: [Theme, AntdRender],
+  inheritAttrs: false,
+  model: {
+    prop: 'visible',
+    event: 'change'
+  },
+  props: modalTypes,
+  computed: {
+    extralListeners() {
+      const vm = this;
+      return {
+        change: function (value) {
+          vm.$emit('change', value);
+        }
+      };
+    }
+  }
+};
+</script>

package/src/common/modal/index.js

@@ -0,0 +1,9 @@
+import { default as Modal } from './main.ts';
+import init from 'vue-iclient/src/init';
+
+Modal.install = function(Vue, opts) {
+  init(Vue, opts);
+  Vue.component(Modal.options ? Modal.options.name : Modal.name, Modal);
+};
+
+export default Modal;

package/src/common/modal/main.ts

@@ -0,0 +1,49 @@
+import AntdModal from 'ant-design-vue/es/modal';
+import Modal from './Modal.vue';
+
+type ModalInstanceType = typeof Modal;
+
+interface ModalInstanceConstructor extends ModalInstanceType {
+  info?: Function;
+  success?: Function;
+  error?: Function;
+  warning?: Function;
+  warn?: Function;
+  confirm?: Function;
+  destroyAll?: Function;
+}
+
+const defaultPrefixCls = 'sm-component-modal';
+const btnDefaultPrefixCls = 'sm-component-btn';
+['info', 'success', 'error', 'warn', 'warning', 'confirm'].forEach((item: string) => {
+  const typeCallback = AntdModal[item];
+  Modal[item] = function (config: any) {
+    const { props: okButtonProps = {} } = config.okButtonProps || {};
+    const { props: cancelButtonProps = {} } = config.cancelButtonProps || {};
+    return typeCallback({
+      ...config,
+      prefixCls: config.prefixCls || defaultPrefixCls,
+      okButtonProps: {
+        ...config.okButtonProps,
+        props: {
+          ...okButtonProps,
+          prefixCls: okButtonProps.prefixCls || btnDefaultPrefixCls
+        }
+      },
+      cancelButtonProps: {
+        ...config.cancelButtonProps,
+        props: {
+          ...cancelButtonProps,
+          prefixCls: cancelButtonProps.prefixCls || btnDefaultPrefixCls
+        }
+      }
+    });
+  };
+});
+
+Modal['destroyAll'] = function () {
+  return AntdModal['destroyAll']();
+};
+
+const ModalInstance: ModalInstanceConstructor = Modal;
+export default ModalInstance;

package/src/common/modal/style/index.js

@@ -0,0 +1,4 @@
+import 'vue-iclient/src/common/_assets/iconfont/icon-sm-components.css';
+import 'vue-iclient/src/common/_utils/style/common/common.scss';
+import './index.less';
+import './modal.scss';

package/src/common/modal/style/index.less

@@ -0,0 +1,3 @@
+@import 'ant-design-vue/es/modal/style/index.less';
+@import 'ant-design-vue/es/style/index.less';
+@import '../../_utils/style/theme/antdVar.less';

package/src/common/modal/style/modal.scss

@@ -0,0 +1,23 @@
+
+@import "../../_utils/style/mixins/mixins.scss";
+@import '../../_utils/style/theme/theme.scss';
+
+@include b (modal) {
+  @include e(content, '-') {
+    background-color: $modal-content-bg;
+  }
+
+  @include e(close, '-') {
+    color: $text-color-secondary;
+  }
+
+  @include e(confirm, '-') {
+    &-error &-body > .#{$iconfont-css-prefix} {
+      color: $error-color;
+    }
+    &-warning &-body > .#{$iconfont-css-prefix},
+    &-confirm &-body > .#{$iconfont-css-prefix} {
+      color: $warning-color;
+    }
+  }
+}

package/src/common/nav/Nav.vue

@@ -0,0 +1,158 @@
+<template>
+  <div
+    class="sm-component-nav"
+    :style="{
+      backgroundImage: `url(${require('./assets/image/background_image.png')})`,
+      backgroundSize: '100% 100%',
+      ...navStyle
+    }"
+  >
+    <template v-for="(item, index) in items">
+      <div
+        :key="index"
+        class="sm-component-nav__board"
+        :style="[
+          isTitle(item) && { width: (item.style && item.style.width) || '30%', flex: 'none' },
+          justifyContent(item)
+        ]"
+      >
+        <sm-button
+          :class="{ defaultTitleStyle: isTitle(item) }"
+          :style="[defaultStyle(item), activeIndex === index && activeStyle(item)]"
+          @click="emitEvent(item, index)"
+        >
+          <span v-if="!item.href">{{ item.title || item.text }}</span>
+          <a v-else :target="item.target" :href="item.href">{{ item.text }}</a>
+        </sm-button>
+      </div>
+    </template>
+    <div v-if="title && items.length % 2 === 0" class="sm-component-nav__board"></div>
+  </div>
+</template>
+
+<script lang="ts">
+import Theme from 'vue-iclient/src/common/_mixin/Theme';
+import { Component, Prop, Mixins, Watch } from 'vue-property-decorator';
+import SmButton from 'vue-iclient/src/common/button/Button.vue';
+
+interface titleParams {
+  title: string;
+  href: string;
+  target: string; // '_blank' | '_self' | '_parent' | '_top'
+  position: string;
+  style: Object;
+  activeStyle: Object;
+}
+
+interface itemsParams {
+  key: number;
+  title: string;
+}
+
+@Component({
+  name: 'SmNav',
+  components: {
+    SmButton
+  }
+})
+export default class Nav extends Mixins(Theme) {
+  activeIndex: number = 0;
+
+  @Prop() navStyle: Object;
+  @Prop() title: titleParams;
+  @Prop() items: itemsParams[];
+  @Prop() itemAlign: Function;
+  @Prop() itemStyle: Function;
+  @Prop() itemActiveStyle: Function;
+
+  @Watch('title', { deep: true, immediate: true })
+  titleChanged(val) {
+    if (val) {
+      switch (val.position) {
+        case 'right':
+          this.items.push(val);
+          break;
+        case 'center':
+          this.items.splice(Math.ceil(this.items.length / 2), 0, val);
+          break;
+        default:
+          this.items.unshift(val);
+          break;
+      }
+    }
+  }
+
+  get isTitle() {
+    return function (item) {
+      return item && item.position;
+    };
+  }
+
+  get defaultStyle() {
+    return function (item) {
+      if (this.isTitle(item)) {
+        return { ...item.style, width: '100%' };
+      } else {
+        return this.itemStyle && this.itemStyle(item);
+      }
+    };
+  }
+
+  get activeStyle() {
+    return function (item) {
+      if (this.isTitle(item)) {
+        return item.activeStyle;
+      } else {
+        let itemActiveStyle = this.itemActiveStyle && this.itemActiveStyle(item);
+        return {
+          backgroundImage: `url(${require('./assets/image/item_active.png')})`,
+          backgroundSize: '100% 100%',
+          backgroundRepeat: 'no-repeat',
+          backgroundPosition: 'center',
+          ...itemActiveStyle
+        };
+      }
+    };
+  }
+
+  get justifyContent() {
+    return function (item) {
+      let align;
+      this.itemAlign && (align = this.itemAlign(item).align);
+      let justifyContent = align === 'left' ? 'flex-start' : align === 'right' ? 'flex-end' : 'center';
+      return { justifyContent };
+    };
+  }
+
+  emitEvent(item, index) {
+    this.activeIndex = index;
+    if (this.title) {
+      if (this.title.position === 'left') {
+        index -= 1;
+      } else if (this.title.position === 'center') {
+        index = index > Math.floor(this.items.length / 2) ? index - 1 : index;
+      }
+    }
+    if (this.isTitle(item)) {
+      this.$emit('click', item);
+    } else {
+      this.$emit('change', item, index);
+    }
+  }
+
+  goTo(index) {
+    this.activeIndex = index;
+    this.emitEvent(this.items[index], index);
+  }
+
+  next() {
+    this.activeIndex += 1;
+    this.emitEvent(this.items[this.activeIndex], this.activeIndex);
+  }
+
+  prev() {
+    this.activeIndex -= 1;
+    this.emitEvent(this.items[this.activeIndex], this.activeIndex);
+  }
+}
+</script>

package/src/common/nav/index.js

@@ -0,0 +1,9 @@
+import Nav from './Nav';
+import init from 'vue-iclient/src/init';
+
+Nav.install = function(Vue, opts) {
+  init(Vue, opts);
+  Vue.component(Nav.options ? Nav.options.name : Nav.name, Nav);
+};
+
+export default Nav;

package/src/common/nav/style/index.js

@@ -0,0 +1,5 @@
+import 'vue-iclient/src/common/_assets/iconfont/icon-sm-components.css';
+import 'vue-iclient/src/common/_utils/style/common/common.scss';
+import 'vue-iclient/src/common/button/style/index.js';
+
+import './nav.scss';

package/src/common/nav/style/nav.scss

@@ -0,0 +1,55 @@
+@import '../../_utils/style/mixins/mixins.scss';
+@import '../../_utils/style/theme/theme.scss';
+@import '../../button/style/button.scss';
+
+@include b(nav) {
+  width: 100%;
+  height: 80px;
+  display: flex;
+  align-items: center;
+  flex-direction: row;
+  background-size: 100% 100%;
+  @include e(line) {
+    border-radius: 0px;
+    border: none;
+  }
+  @include e(board) {
+    display: flex;
+    align-items: center;
+    justify-content: center;
+    height: 100%;
+    flex: 1;
+    position: relative;
+    margin: 5px;
+    button[ant-click-animating-without-extra-node]:after {
+      border: 0 none;
+      opacity: 0;
+      animation: none 0 ease 0 1 normal;
+    }
+    .sm-component-btn {
+      border-radius: 0px;
+      padding: 0 13px;
+      font-size: 16px;
+      &,
+      &:hover,
+      &:focus {
+        border: 1px solid transparent;
+        background: rgba(0, 0, 0, 0);
+      }
+      span {
+        white-space: pre-wrap;
+      }
+    }
+    .defaultTitleStyle {
+      letter-spacing: 5px;
+      font-size: 22px;
+    }
+  }
+  @media screen and (max-width: 414px) {
+    @include e(board) {
+      .sm-component-btn {
+        padding: 0px;
+      }
+    }
+  }
+}

package/src/common/notification/Notification.js

@@ -0,0 +1,10 @@
+import api from 'ant-design-vue/es/notification';
+
+let copyOpen = api.open;
+
+api.open = function(config) {
+  let mergetConfig = Object.assign({}, config, { prefixCls: config.prefixCls || 'sm-component-notification' });
+  copyOpen(mergetConfig);
+};
+
+export default api;

package/src/common/notification/index.js

@@ -0,0 +1,3 @@
+import Notification from './Notification.js';
+
+export default Notification;

package/src/common/notification/style/index.js

@@ -0,0 +1,4 @@
+import 'vue-iclient/src/common/_assets/iconfont/icon-sm-components.css';
+import 'vue-iclient/src/common/_utils/style/common/common.scss';
+import './index.less';
+import './notification.scss';

package/src/common/notification/style/index.less

@@ -0,0 +1,3 @@
+@import 'ant-design-vue/es/notification/style/index.less';
+@import 'ant-design-vue/es/style/index.less';
+@import '../../_utils/style/theme/antdVar.less';

package/src/common/notification/style/notification.scss

@@ -0,0 +1,30 @@
+@import '../../_utils/style/mixins/mixins.scss';
+@import '../../_utils/style/theme/theme.scss';
+
+@include b(notification) {
+  &-notice {
+    background: $message-background;
+
+    &-message {
+      color: $heading-color;
+    }
+
+    @at-root {
+      .#{$iconfont-css-prefix}#{&}-icon {
+        &-warning {
+          color: $warning-color;
+        }
+        &-error {
+          color: $error-color;
+        }
+      }
+    }
+
+    &-close {
+      color: $text-color-secondary;
+      &:hover {
+        color: $text-color;
+      }
+    }
+  }
+}

package/src/common/pagination/Pagination.vue

@@ -0,0 +1,32 @@
+<script lang="ts">
+import Pagination from 'ant-design-vue/es/pagination/index';
+import { PaginationProps } from 'ant-design-vue/es/pagination/Pagination';
+import Theme from 'vue-iclient/src/common/_mixin/Theme';
+import AntdRender from 'vue-iclient/src/common/_mixin/AntdRender';
+
+export const paginationTypes = {
+  ...PaginationProps()
+};
+
+export default {
+  name: 'SmPagination',
+  defaultComponent: Pagination,
+  mixins: [Theme, AntdRender],
+  inheritAttrs: false,
+  model: {
+    prop: 'current',
+    event: 'change.current'
+  },
+  props: paginationTypes,
+  computed: {
+    extralListeners() {
+      const vm = this;
+      return {
+        'change.current': function(value) {
+          vm.$emit('change.current', value);
+        }
+      };
+    }
+  }
+};
+</script>

package/src/common/pagination/index.js

@@ -0,0 +1,9 @@
+import Pagination from './Pagination';
+import init from 'vue-iclient/src/init';
+
+Pagination.install = function(Vue, opts) {
+  init(Vue, opts);
+  Vue.component(Pagination.options ? Pagination.options.name : Pagination.name, Pagination);
+};
+
+export default Pagination;

package/src/common/pagination/style/index.js

@@ -0,0 +1,4 @@
+import 'vue-iclient/src/common/_assets/iconfont/icon-sm-components.css';
+import 'vue-iclient/src/common/_utils/style/common/common.scss';
+import './index.less';
+import './pagination.scss';

package/src/common/pagination/style/index.less

@@ -0,0 +1,3 @@
+@import 'ant-design-vue/es/pagination/style/index.less';
+@import 'ant-design-vue/es/style/index.less';
+@import '../../_utils/style/theme/antdVar.less';