@supermapgis/vue-iclient-leaflet 11.2.0

package/src/common/_lang/index.js

@@ -0,0 +1,177 @@
+// import Vue from 'vue';
+import Cookies from 'js-cookie';
+import enLocale from 'vue-iclient/src/common/_lang/en';
+import zhLocale from 'vue-iclient/src/common/_lang/zh';
+import antdZhCN from 'ant-design-vue/es/locale/zh_CN';
+import antdEnUS from 'ant-design-vue/es/locale/en_US';
+import clonedeep from 'lodash.clonedeep';
+import VueI18n from 'vue-i18n';
+import merge from 'lodash.merge';
+import moment from 'moment';
+
+const EXTRA_LOCALE_FIELDS = [
+  'months', 'monthsShort', 'weekdays', 'weekdaysShort', 'weekdaysMin'
+];
+
+const dateTimeFormats = {
+  en: enLocale.dateTimeFormat,
+  zh: zhLocale.dateTimeFormat
+};
+let i18n = {};
+let rooti18n;
+const en = merge(antdEnUS, enLocale);
+const zh = merge(antdZhCN, zhLocale);
+const messages = {
+  en,
+  zh
+};
+export function getLanguage() {
+  let lang = Cookies.get('language');
+  if (!lang) {
+    if (navigator.appName === 'Netscape') {
+      lang = navigator.language;
+    } else {
+      lang = navigator.browserLanguage;
+    }
+  }
+
+  if (lang) {
+    if (lang.indexOf('zh') === 0) {
+      return 'zh';
+    }
+    if (lang.indexOf('en') === 0) {
+      return 'en';
+    }
+    return lang;
+  }
+  return 'zh';
+}
+export function geti18n() {
+  return rooti18n || i18n;
+}
+export const locale = {
+  install(Vue, opts) {
+    initi18n(Vue, opts);
+  }
+};
+export function setLocale(locales) {
+  i18n.mergeLocaleMessage && i18n.mergeLocaleMessage(i18n.locale, locales);
+}
+export const lang = clonedeep(messages);
+export function initi18n(Vue, config) {
+  config = config || {};
+  if (config.i18n) {
+    i18n = config.i18n;
+    if (!i18n.getDateTimeFormat() || Object.keys(i18n.getDateTimeFormat()).length === 0) {
+      i18n.setDateTimeFormat('en', enLocale.dateTimeFormat);
+      i18n.setDateTimeFormat('zh', zhLocale.dateTimeFormat);
+    }
+    i18n.mergeLocaleMessage && i18n.mergeLocaleMessage('en', lang.en);
+    i18n.mergeLocaleMessage && i18n.mergeLocaleMessage('zh', lang.zh);
+  } else if (!Object.prototype.hasOwnProperty.call(Vue.prototype, '$i18n')) {
+    Object.defineProperty(Vue.prototype, '$i18n', {
+      get: function get() {
+        if (!rooti18n && this.$root && this.$root.$options.i18n) {
+          rooti18n = this.$root.$options.i18n;
+        }
+        return rooti18n || i18n;
+      }
+    });
+    Vue.use(VueI18n);
+    i18n = new VueI18n({
+      dateTimeFormats,
+      locale: getLanguage(),
+      fallbackLocale: 'zh',
+      messages
+    });
+  }
+
+  if (config.locale) {
+    setLocale(config.locale);
+  }
+
+  const locale = config.i18n || i18n || config.locale;
+  setDatePickerMonthLocale(locale);
+  if (!Vue.iclient) {
+    Vue.iclient = { locale };
+  } else {
+    Vue.iclient.locale = locale;
+  }
+}
+
+export function setDatePickerMonthLocale(i18n) {
+  if (!i18n || !i18n.locale) {
+    return;
+  }
+  let datePickerConfig = {};
+  let language = i18n.locale;
+  let targetMessage = i18n.getLocaleMessage(language);
+  if (targetMessage) {
+    EXTRA_LOCALE_FIELDS.forEach((fieldName) => {
+      if (targetMessage && targetMessage.DatePicker && targetMessage.DatePicker.lang[fieldName]) {
+        datePickerConfig[fieldName] = targetMessage.DatePicker.lang[fieldName];
+      }
+    });
+    if (Object.keys(datePickerConfig).length) {
+      if (language === 'zh') {
+        language = language + '-cn';
+      }
+      moment.updateLocale(language, datePickerConfig);
+    }
+  }
+}
+
+export default i18n;
+/*
+Example
+假设国际化资源配置为：
+layerList: {
+    title: "图层",
+    hello: '{msg} world',
+    hello1: '{0} world',
+    theWorld: 'the world',
+    dio: 'DIO:',
+    linked: '@:(message.dio) @:(message.theWorld) !!!!'，
+    apple: 'no apples | one apple | {count} apples'
+},
+vue中调用：
+this.$tc('layerList.apple',10,{ count: 20 })
+
+文本模板调用：
+$t方法：
+<span>{{$t("layerList.title")}}</span>
+==>
+<span>图层</span>
+
+<span>{{$t("layerList.hello",{msg:"hello"})}}</span>
+==>
+<span>hello world</span>
+
+<span>{{$t("layerList.hello1",["bye"])}}</span>
+==>
+<span>bye world</span>
+
+<span>{{$t("layerList.linked")}}</span>
+==>
+<span>DIO: the world !!!!</span>
+
+$tc方法：
+<p>{{ $tc('layerList.apple', 0) }}</p>
+==>
+<p>no apples</p>
+
+<p>{{ $tc('layerList.apple', 1) }}</p>
+==>
+<p>one apple</p>
+
+<p>{{ $tc('layerList.apple', 10}}</p>
+==>
+<p>10 apples</p>
+
+<p>{{ $tc('layerList.apple', 10, { count: 20 }) }}</p>
+==>
+<p>20 apples</p>
+
+日期格式处理（$d）：https://kazupon.github.io/vue-i18n/guide/datetime.html
+数字格式处理（$n）：https://kazupon.github.io/vue-i18n/guide/number.html
+*/

package/src/common/_lang/zh.js

@@ -0,0 +1,342 @@
+export default {
+  dateTimeFormat: {
+    date: {
+      year: 'numeric',
+      month: 'short',
+      day: 'numeric'
+    },
+    date_second: {
+      year: 'numeric',
+      month: 'short',
+      day: 'numeric',
+      hour: 'numeric',
+      minute: 'numeric',
+      second: 'numeric'
+    },
+    date_second_week: {
+      year: 'numeric',
+      month: 'short',
+      day: 'numeric',
+      weekday: 'long',
+      hour: 'numeric',
+      minute: 'numeric',
+      second: 'numeric'
+    }
+  },
+  // messageTemplate
+  warning: {
+    unsupportedVideoAddress: '视频地址不合法',
+    unsupportedPosterAddress: '封面地址不合法',
+    unavailableVideo: '此视频暂无法播放，请稍后再试',
+    mapNotLoaded: '关联的地图尚未加载完整，请稍后',
+    unassociatedMap: '您需要配置关联地图！',
+    videojs:
+      '请引入video.js插件: https://github.com/videojs/video.js； 当播放rtmp时，安装flash相关插件：https://github.com/videojs/videojs-flash',
+    flvPlayer: '请引入flv相关插件: https://github.com/bilibili/flv.js, https://github.com/mister-ben/videojs-flvjs'
+  },
+  success: {
+    copySucccess: '复制成功'
+  },
+  info: {
+    loading: '加载中',
+    pressEscToExit: '按下 ESC 键或点击关闭按钮退出'
+  },
+  unit: {
+    kilometers: '千米',
+    miles: '英里',
+    meters: '米',
+    yards: '码',
+    feet: '英尺',
+    squarekilometers: '平方千米',
+    squaremiles: '平方英里',
+    squaremeters: '平方米',
+    squareyards: '平方码',
+    squarefeet: '平方英尺',
+    XY: '经纬度',
+    BASEMAP: '底图',
+    UTM: 'UTM',
+    DD: '度',
+    DOM: '度分',
+    DMS: '度分秒',
+    Mercator: 'Web墨卡托'
+  },
+  error: {},
+  commontypes: {
+    restData: 'SuperMap Rest 数据服务',
+    restMap: 'SuperMap Rest 地图服务',
+    addressMatch: 'SuperMap 地址匹配服务',
+    iportalData: 'SuperMap iPortal 数据',
+    onlineLocalSearch: 'SuperMap Online 本地搜索'
+  },
+  // 组件
+  timeText: {
+    Year: '年',
+    Month: '月',
+    Day: '日',
+    hour: '时',
+    minute: '分',
+    second: '秒'
+  },
+  zoom: {},
+  chart: {
+    unSupportedData: '当前数据不支持与地图联动'
+  },
+  layerList: {
+    title: '图层'
+  },
+  slideshow: {
+    title: '幻灯片'
+  },
+  layerColor: {
+    title: '图层颜色',
+    layer: '图层',
+    property: '属性',
+    color: '颜色',
+    reset: '重置',
+    select: '选取',
+    deselect: '取消',
+    circleColor: '点颜色',
+    strokeColor: '轮廓颜色',
+    lineColor: '线颜色',
+    fillColor: '面颜色',
+    iconColor: '图标颜色',
+    textColor: '文本颜色',
+    capture: '捕获'
+  },
+  attributes: {
+    title: '属性表',
+    feature: '要素',
+    selected: '已选择',
+    clearSelected: '清除选中',
+    zoomToFeatures: '缩放至已选要素',
+    columnsControl: '显示/隐藏列',
+    refreshData: '刷新数据',
+    search: '搜索',
+    reset: '重置'
+  },
+  miniMap: {},
+  pan: {},
+  scale: {},
+  webmap: {
+    loadingTip: '地图加载中...',
+    crsNotSupport: '不支持当前地图的坐标系！',
+    TileMatrixSetNotSuppport: '不支持传入的 TileMatrixSet！',
+    getLayerInfoFailed: '获取图层信息失败！',
+    getThemeInfoFailed: '获取图层样式信息失败！',
+    crsnotsupport: '不支持的坐标系！',
+    baiduMapNotSupport: '暂不支持加载百度地图！',
+    sampleDataNotSupport: '暂不支持加载示例数据！',
+    mvtNotSupport: '暂不支持加载矢量瓦片图层！'
+  },
+  videoPlus: {
+    loadingTip: '视频加载中...'
+  },
+  drillMap: {
+    goBack: '返回'
+  },
+  legend: {
+    themeField: '专题字段',
+    title: '图例',
+    top: '最高',
+    bottom: '最低',
+    noMatchLayer: '没有匹配的图层',
+    themeDefault: '缺省风格',
+    outOfRange: '范围以外的值',
+    style: '样式',
+    color: '颜色',
+    size: '大小',
+    opacity: '不透明度',
+    width: '宽度',
+    outlineColor: '轮廓色',
+    haloColor: '晕轮颜色',
+    label: '标签',
+    parentheses: '（{tips}）',
+    colon: '：'
+  },
+  measure: {
+    mapMeasure: '量算',
+    measureResult: '测量结果：',
+    distance: '距离',
+    area: '面积',
+    delete: '清空',
+    selectPlaceholder: '请选择',
+    startingPoint: '起点'
+  },
+  search: {
+    noResult: '查询结果为空！',
+    noKey: '搜索关键字不能为空，请输入搜索条件。',
+    inputPlaceHolder: '查找地址或地点',
+    attribute: '属性',
+    attributeValue: '属性值',
+    setSearchSource: '请设置搜索源！',
+    address: '地址',
+    null: '空',
+    illegalFeature: '要素必须包含合法的坐标！'
+  },
+  query: {
+    query: '查询',
+    queryJob: '任务',
+    queryResult: '结果',
+    attributeCondition: '属性条件',
+    spatialFilter: '空间过滤器',
+    mapBounds: '返回地图全图范围的要素',
+    currentMapBounds: '返回当前地图范围内的要素',
+    applicate: '应用',
+    noResult: '无结果',
+    resultAlreadyExists: '当前查询结果已经存在!',
+    querying: '查询中',
+    attribute: '属性',
+    attributeValue: '属性值',
+    noResults: '查询结果为空！',
+    queryFailed: '查询失败!',
+    seviceNotSupport: '此服务不支持查询！'
+  },
+  identify: {
+    layerNotExit: "地图上不存在该图层: '{layer}'",
+    noData: '无数据'
+  },
+  openFile: {
+    fileSizeExceeded: '文件大小超限！文件大小不得超过 10M！',
+    fileTypeUnsupported: '不支持该文件格式！',
+    openFileFail: '打开文件失败！',
+    openFileSuccess: '打开文件成功!',
+    selectFile: '选择文件',
+    openEmptyFile: '打开文件为空！',
+    openFile: '打开文件'
+  },
+  draw: {
+    draw: '绘制'
+  },
+  indicator: {
+    title: '指标标题',
+    unit: '单位'
+  },
+  layerManager: {
+    title: '图层管理'
+  },
+  fillExtrusion: {
+    title: '三维拉伸',
+    polygonLayer: '面图层',
+    height: '高度（米）',
+    heightValue: '高度值',
+    fieldName: '字段名',
+    customFieldPlaceholder: '填写字段名称',
+    customNum: '自定义',
+    multiple: '倍数',
+    fillColor: '填充颜色',
+    layerOpacity: '透明度',
+    hideOriginalLayer: '隐藏原图层',
+    reset: '重置'
+  },
+  flyTo: {
+    title: '飞行定位'
+  },
+  tdtResults: {
+    on: '在',
+    station: '站',
+    total: '共',
+    about: '约',
+    // pagination
+    homePage: '首页',
+    prevPage: '上一页',
+    nextPage: '下一页',
+    // nothingResult
+    searchNoResult: '没有查询到相关结果',
+    youCanTry: '您可以尝试',
+    enterCorrect: '检查输入是否正确',
+    enterOtherKeyWords: '输入其他关键字进行搜索',
+    onTdtMap: '在天地图上',
+    addThisAddress: '添加该地点',
+    uWantTo: '您是否要找',
+    // pointResults
+    totalFind: '共找到',
+    piecesResults: '条结果',
+    phone: '电话',
+    address: '地址',
+    setStartPonint: '设为起点',
+    setEndPonint: '设为终点',
+    // routePlan
+    totalMiles: '总里程',
+    distance: '约{distance}公里',
+    showDetails: '显示全部详情',
+    switchTimes: '换乘{switchTimes}次',
+    noSwitch: '无换乘',
+    walk: '步行至',
+    getOff: '下车',
+    getOn: '上车',
+    take: '乘坐',
+    noSearchResults: '没有查询到线路信息',
+    fastRoute: '最快线路',
+    shortRoute: '最短线路',
+    walkRoute: '少走高速',
+    fast: '较快捷',
+    noSubway: '不坐地铁',
+    lessSwitch: '少换乘',
+    lessWalk: '少步行',
+    // staticResult
+    cityHadResults: '以下城市有结果，请您选择',
+    moreCity: '更多城市',
+    // LineResult
+    allFound: '共为您找到',
+    piecesBusRoute: '条公交线路',
+    showDetail: '展开详情',
+    busEndTime: '首末车时间',
+    relateAdress: "点击此处查看 '{keyWord}' 的相关地点",
+    // areaResult
+    switchTo: '已切换到'
+  },
+  tdtRoute: {
+    title: '路线',
+    pleaseEnterStartPoint: '请输入起点',
+    pleaseEnterEndPoint: '请输入终点',
+    search: '搜索',
+    startPoint: '起点',
+    endPoint: '终点',
+    mapLoadedFiled: '地图加载失败',
+    busEndTime: '首末车时间',
+    about: '约',
+    station: '站',
+    total: '共',
+    hour: '小时',
+    minutes: '分钟'
+  },
+  tdtSearch: {
+    phone: '电话',
+    address: '地址',
+    noData: '暂无',
+    transport: '交通'
+  },
+  tdtMapSwitcher: {
+    title: '地图切换',
+    image: '影像',
+    vector: '矢量',
+    terrain: '地形',
+    placeName: '地名',
+    TiandituVec: '天地图矢量底图',
+    TiandituTer: '天地图地形底图',
+    TiandituImg: '天地图影像底图',
+    TiandituCva: '天地图矢量注记',
+    TiandituCta: '天地图地形注记',
+    TiandituCia: '天地图影像注记'
+  },
+  coordinateConversion: {
+    inputPlaceHolder: '请输入坐标',
+    copy: '复制',
+    location: '定位至',
+    capture: '捕捉',
+    realTime: '实时',
+    errorCoordinate: '坐标格式不正确'
+  },
+  // layer
+  dataFlow: {
+    dataSubscriptionFailed: '数据订阅失败！'
+  },
+  animateMarkerlayer: {
+    unsupportedData: '当前图层不支持该数据，请重新传入数据！'
+  },
+  months: ['一月', '二月', '三月', '四月', '五月', '六月', '七月', '八月', '九月', '十月', '十一月', '十二月'],
+  weekdays: ['星期日', '星期一', '星期二', '星期三', '星期四', '星期五', '星期六'],
+  monthsShort: ['1月', '2月', '3月', '4月', '5月', '6月', '7月', '8月', '9月', '10月', '11月', '12月'],
+  weekdaysShort: ['周日', '周一', '周二', '周三', '周四', '周五', '周六'],
+  weekdaysMin: ['日', '一', '二', '三', '四', '五', '六']
+};

package/src/common/_mixin/AntdRender.ts

@@ -0,0 +1,114 @@
+import Vue, { VNode, CreateElement } from 'vue';
+import { Component, Prop, Provide } from 'vue-property-decorator';
+import defaultRenderEmpty from 'vue-iclient/src/common/empty/RenderEmpty';
+import { getOptionProps, getComponentFromProp } from 'ant-design-vue/es/_util/props-util';
+
+@Component
+export default class BaseRender extends Vue {
+  defaultPrefixCls = 'sm-component';
+
+  @Prop() getPopupContainer!: Function;
+  @Prop() prefixCls!: string;
+  @Prop() renderEmpty!: Function;
+  @Prop() csp!: Object;
+  @Prop() autoInsertSpaceInButton!: boolean;
+  @Prop() locale!: Object;
+  @Prop() pageHeader!: Object;
+  @Prop() transformCellText!: Function;
+
+  @Provide('configProvider')
+  configProvider = {
+    getPopupContainer: this.getPopupContainer,
+    prefixCls: this.prefixCls,
+    csp: this.csp,
+    autoInsertSpaceInButton: this.autoInsertSpaceInButton,
+    locale: Object.assign({}, this.locale, this.$i18n && this.$i18n.getLocaleMessage(this.$i18n.locale)),
+    pageHeader: this.pageHeader,
+    pageHeatransformCellTextder: this.transformCellText,
+    getPrefixCls: this.getPrefixCls,
+    renderEmpty: this.renderEmptyComponent
+  };
+
+  @Provide('localeData')
+  localeData = {
+    antLocale: Object.assign({}, this.locale, this.$i18n && this.$i18n.getLocaleMessage(this.$i18n.locale), {
+      exist: true
+    })
+  };
+
+  get extralProps() {
+    return {};
+  }
+
+  get componentProps() {
+    return { ...getOptionProps(this), ...this.extralProps };
+  }
+
+  get extralListeners() {
+    return {};
+  }
+
+  get componentListeners() {
+    return { ...this.$listeners, ...this.extralListeners };
+  }
+
+  get componentStyle() {
+    return null;
+  }
+
+  get componentClass() {
+    return null;
+  }
+
+  getPrefixCls(suffixCls: string, customizePrefixCls: string) {
+    const { prefixCls = this.defaultPrefixCls } = this.$props;
+    if (customizePrefixCls) {
+      return customizePrefixCls;
+    }
+    return suffixCls ? `${prefixCls}-${suffixCls}` : prefixCls;
+  }
+
+  renderEmptyComponent(h: CreateElement, name: string) {
+    const renderEmpty = getComponentFromProp(this, 'renderEmpty', {}, false) || defaultRenderEmpty;
+    return renderEmpty(h, name);
+  }
+
+  getComponentInstance() {
+    const Component = this.$options.defaultComponent;
+    return Component;
+  }
+
+  renderChildren(createElement) {
+    const slotComponents = [].concat(this.$slots.default || []);
+    for (const key in this.$slots) {
+      if (key !== 'default') {
+        slotComponents.push(
+          createElement(
+            'template',
+            {
+              slot: key
+            },
+            this.$slots[key]
+          )
+        );
+      }
+    }
+    return slotComponents;
+  }
+
+  render(h: CreateElement): VNode {
+    const Component = this.getComponentInstance();
+    return h(
+      Component,
+      {
+        props: this.componentProps,
+        style: this.componentStyle,
+        class: this.componentClass,
+        attrs: this.$attrs,
+        on: this.componentListeners,
+        scopedSlots: this.$scopedSlots
+      },
+      this.renderChildren(h)
+    );
+  }
+}

package/src/common/_mixin/Card.ts

@@ -0,0 +1,22 @@
+import Vue from 'vue';
+import { Component, Prop } from 'vue-property-decorator';
+import SmCollapseCard from 'vue-iclient/src/common/collapse-card/CollapseCard.vue';
+
+@Component({
+  components: { SmCollapseCard }
+})
+export default class CardMixin extends Vue {
+  @Prop({
+    default: 'top-left',
+    validator(value) {
+      return ['top-left', 'top-right', 'bottom-left', 'bottom-right'].includes(value);
+    }
+  })
+  position: 'top-right' | 'top-left' | 'bottom-right' | 'bottom-left';
+
+  @Prop() headerName: string;
+  @Prop() iconClass: string;
+  @Prop({ default: false }) autoRotate: boolean;
+  @Prop({ default: true }) collapsed: boolean;
+  @Prop({ default: true }) splitLine: boolean; // 标题与内容的分割线
+}