zartui 2.1.29 → 2.1.32

package/es/image-preview/Download.js

@@ -0,0 +1,17 @@
+export default {
+  render: function render() {
+    var h = arguments[0];
+    return h("svg", {
+      "attrs": {
+        "xmlns": "http://www.w3.org/2000/svg",
+        "viewBox": "0 0 20 20"
+      }
+    }, [h("path", {
+      "attrs": {
+        "d": "M3.75,17.5 C3.28976271,17.5 2.91666667,17.126904 2.91666667,16.6666667 L2.91666667,12.5 C2.91666667,12.0397627 3.28976271,11.6666667 3.75,11.6666667 C4.21023729,11.6666667 4.58333333,12.0397627 4.58333333,12.5 L4.58266667,15.833 L15.4166667,15.833 L15.4166667,12.5 C15.4166667,12.0397627 15.7897627,11.6666667 16.25,11.6666667 C16.7102373,11.6666667 17.0833333,12.0397627 17.0833333,12.5 L17.0833333,16.6666667 C17.0833333,17.0915011 16.765429,17.442085 16.3545316,17.4935072 L16.25,17.5 L3.75,17.5 Z M10,2.5 C10.4602373,2.5 10.8333333,2.87309604 10.8333333,3.33333333 L10.834,10.904 L12.327411,9.41074435 L12.3804172,9.36206404 C12.7078286,9.08620893 13.1976137,9.1024357 13.5059223,9.41074435 C13.8313592,9.73618126 13.8313592,10.2638187 13.5059223,10.5892557 L10.5892557,13.5059223 L10.5659501,13.5283458 C10.5602582,13.5336148 10.5544926,13.5388053 10.548655,13.5439156 L10.5362495,13.5546026 L10.5121742,13.5740743 C10.4949132,13.5875412 10.4771081,13.6003432 10.4586783,13.6126074 C10.4455853,13.6212563 10.4323019,13.6294968 10.4192578,13.6370097 C10.4029078,13.6465464 10.3862038,13.6555423 10.3690405,13.664083 C10.3522054,13.6723976 10.3351478,13.6801087 10.3177097,13.6872958 C10.3045293,13.6927357 10.2911788,13.6978473 10.2777746,13.7025471 C10.2584813,13.7093513 10.2389875,13.7154237 10.2194971,13.7207897 C10.2011918,13.7257748 10.1826357,13.7301514 10.1634324,13.7339067 L10.1207556,13.7413147 C10.0813306,13.7470375 10.0410112,13.75 10,13.75 L10.0566667,13.747 L10.0399512,13.7490477 L9.96132783,13.7491078 C9.94161389,13.7481976 9.92192612,13.746591 9.89546844,13.7435072 C9.79274407,13.7306516 9.69583178,13.6990985 9.6082458,13.6523619 L9.59484365,13.6451239 C9.58442452,13.639322 9.57410342,13.6332795 9.56375825,13.6268308 C9.54437371,13.6148978 9.52551484,13.6021934 9.50686916,13.5885746 L9.48480346,13.5717051 L9.41074435,13.5059223 L6.49407768,10.5892557 L6.44539737,10.5362495 C6.16954226,10.2088381 6.18576903,9.719053 6.49407768,9.41074435 L6.54708384,9.36206404 C6.87449527,9.08620893 7.36428033,9.1024357 7.67258898,9.41074435 L9.167,10.905 L9.16666667,3.33333333 C9.16666667,2.87309604 9.53976271,2.5 10,2.5 Z",
+        "fill": "#FFF",
+        "fill-rule": "nonzero"
+      }
+    })]);
+  }
+};

package/es/image-preview/ImagePreview.js

@@ -1,3 +1,5 @@
+import _asyncToGenerator from "@babel/runtime/helpers/esm/asyncToGenerator";
+import _regeneratorRuntime from "@babel/runtime/regenerator";
 // Utils
 import { bem, createComponent } from './shared';
 
@@ -10,6 +12,8 @@ import { BindEventMixin } from '../mixins/bind-event';
 import Icon from '../icon';
 import Swipe from '../swipe';
 import ImagePreviewItem from './ImagePreviewItem';
+import Download from './Download';
+import Toast from '../toast';
 export default createComponent({
   mixins: [TouchMixin, PopupMixin({
     skipToggleEvent: true
@@ -75,6 +79,14 @@ export default createComponent({
     closeIconPosition: {
       type: String,
       default: 'top-right'
+    },
+    showDownload: {
+      type: Boolean,
+      default: false
+    },
+    downloadAction: {
+      type: Function,
+      default: function _default() {}
     }
   },
   data: function data() {
@@ -127,15 +139,31 @@ export default createComponent({
         this.$emit('change', active);
       }
     },
-    genIndex: function genIndex() {
+    genFooter: function genFooter() {
+      var _this$images$this$act, _this$images$this$act2;
       var h = this.$createElement;
-      if (this.showIndex) {
+      var indexSlot = this.slots('index', {
+        index: this.active
+      });
+      if (indexSlot) {
         return h("div", {
-          "class": bem('index')
-        }, [this.slots('index', {
-          index: this.active
-        }) || this.active + 1 + "/" + this.images.length]);
+          "class": bem('footer')
+        }, [indexSlot]);
       }
+      return h("div", {
+        "class": bem('footer')
+      }, [h("div", {
+        "class": bem('footer-left')
+      }, [this.showIndex && h("span", {
+        "class": bem('index')
+      }, [this.active + 1, "/", this.images.length]), h("span", {
+        "class": bem('title')
+      }, [((_this$images$this$act = this.images[this.active]) == null ? void 0 : _this$images$this$act.title) || ''])]), this.showDownload && !((_this$images$this$act2 = this.images[this.active]) != null && _this$images$this$act2.url.startsWith('data:')) && h("span", {
+        "class": bem('download'),
+        "on": {
+          "click": this.onDownload
+        }
+      }, [h(Download)])]);
     },
     genCover: function genCover() {
       var h = this.$createElement;
@@ -205,12 +233,68 @@ export default createComponent({
         this.$refs.swipe.swipeTo(index, options);
       }
     },
-    //底部标题
-    genTitle: function genTitle() {
-      var h = this.$createElement;
-      return h("div", {
-        "class": bem('title')
-      }, [this.images[this.active] ? this.images[this.active].title : '']);
+    onDownload: function onDownload() {
+      var _this3 = this;
+      return _asyncToGenerator(/*#__PURE__*/_regeneratorRuntime.mark(function _callee() {
+        var _this3$images$_this3$, _this3$images$_this3$2;
+        var downloadParams, result, universalJsSdk, _universalJsSdk$getJS, fileJsi;
+        return _regeneratorRuntime.wrap(function _callee$(_context) {
+          while (1) switch (_context.prev = _context.next) {
+            case 0:
+              downloadParams = {
+                index: _this3.active,
+                url: (_this3$images$_this3$ = _this3.images[_this3.active]) == null ? void 0 : _this3$images$_this3$.url,
+                title: (_this3$images$_this3$2 = _this3.images[_this3.active]) == null ? void 0 : _this3$images$_this3$2.title
+              }; // 如果提供了 downloadAction 并且返回 true，则阻止默认逻辑
+              if (!_this3.downloadAction) {
+                _context.next = 5;
+                break;
+              }
+              result = _this3.downloadAction(downloadParams);
+              if (!result) {
+                _context.next = 5;
+                break;
+              }
+              return _context.abrupt("return");
+            case 5:
+              _context.prev = 5;
+              _context.next = 8;
+              return import("@egova/universal-js-sdk");
+            case 8:
+              universalJsSdk = _context.sent;
+              if (universalJsSdk && universalJsSdk.getJSI && downloadParams.url) {
+                fileJsi = (_universalJsSdk$getJS = universalJsSdk.getJSI()) == null ? void 0 : _universalJsSdk$getJS.file;
+                if (fileJsi && fileJsi.download) {
+                  Toast.loading({
+                    message: '加载中...',
+                    forbidClick: true,
+                    duration: 0
+                  });
+                  fileJsi.download({
+                    url: downloadParams.url
+                  }).then(function () {
+                    Toast.clear();
+                    Toast.success('下载成功');
+                  }).catch(function () {
+                    Toast.clear();
+                    Toast.fail("下载失败");
+                  });
+                } else {
+                  Toast.fail("当前环境暂不支持下载");
+                }
+              }
+              _context.next = 15;
+              break;
+            case 12:
+              _context.prev = 12;
+              _context.t0 = _context["catch"](5);
+              console.log(_context.t0.message);
+            case 15:
+            case "end":
+              return _context.stop();
+          }
+        }, _callee, null, [[5, 12]]);
+      }))();
     }
   },
   render: function render() {
@@ -228,6 +312,6 @@ export default createComponent({
         value: this.value
       }],
       "class": [bem(), this.className]
-    }, [this.genClose(), this.genImages(), this.genIndex(), this.genCover(), this.genTitle()]) : null]);
+    }, [this.genClose(), this.genImages(), this.genFooter(), this.genCover()]) : null]);
   }
 });

package/es/image-preview/index.css

@@ -1 +1 @@
-.zt2-image-preview{position:fixed;top:0;left:0;width:100%;height:100%}.zt2-image-preview__swipe{height:100%}.zt2-image-preview__swipe-item{display:-webkit-box;display:-webkit-flex;display:flex;-webkit-box-align:center;-webkit-align-items:center;align-items:center;-webkit-box-pack:center;-webkit-justify-content:center;justify-content:center;overflow:hidden}.zt2-image-preview__cover{position:absolute;top:0;left:0}.zt2-image-preview__image{width:100%;-webkit-transition-property:-webkit-transform;transition-property:-webkit-transform;transition-property:transform;transition-property:transform,-webkit-transform}.zt2-image-preview__image--vertical{width:auto;height:100%}.zt2-image-preview__image img{-webkit-user-drag:none}.zt2-image-preview__image .zt2-image__error{top:30%;height:40%}.zt2-image-preview__image .zt2-image__error-icon{font-size:36px}.zt2-image-preview__image .zt2-image__loading{background-color:transparent}.zt2-image-preview__index{position:absolute;bottom:12px;left:34px;height:24px;width:37px;line-height:24px;border-radius:2px;background:rgba(45,75,115,.8);color:#fff;font-size:12px;text-shadow:0 1px 1px #323233;-webkit-transform:translate(-50%,0);transform:translate(-50%,0);text-align:center;z-index:10}.zt2-image-preview__overlay.zt2-overlay{background-color:#000}.zt2-image-preview__close-icon{position:absolute;z-index:1;color:#c8c9cc;font-size:22px;cursor:pointer}.zt2-image-preview__close-icon:active{color:#969799}.zt2-image-preview__close-icon--top-left{top:16px;left:16px}.zt2-image-preview__close-icon--top-right{top:16px;right:16px}.zt2-image-preview__close-icon--bottom-left{bottom:16px;left:16px}.zt2-image-preview__close-icon--bottom-right{right:16px;bottom:16px}.zt2-image-preview__title{position:absolute;bottom:0;height:48px;width:100%;padding-left:60px;left:0;line-height:48px;font-size:14px;color:#fff;background:rgba(45,75,115,.5);z-index:9}
+.zt2-image-preview{position:fixed;top:0;left:0;width:100%;height:100%}.zt2-image-preview__swipe{height:100%}.zt2-image-preview__swipe-item{display:-webkit-box;display:-webkit-flex;display:flex;-webkit-box-align:center;-webkit-align-items:center;align-items:center;-webkit-box-pack:center;-webkit-justify-content:center;justify-content:center;overflow:hidden}.zt2-image-preview__cover{position:absolute;top:0;left:0}.zt2-image-preview__image{width:100%;-webkit-transition-property:-webkit-transform;transition-property:-webkit-transform;transition-property:transform;transition-property:transform,-webkit-transform}.zt2-image-preview__image--vertical{width:auto;height:100%}.zt2-image-preview__image img{-webkit-user-drag:none}.zt2-image-preview__image .zt2-image__error{top:30%;height:40%}.zt2-image-preview__image .zt2-image__error-icon{font-size:36px}.zt2-image-preview__image .zt2-image__loading{background-color:transparent}.zt2-image-preview__footer{position:absolute;bottom:0;left:0;right:0;display:-webkit-box;display:-webkit-flex;display:flex;-webkit-box-pack:justify;-webkit-justify-content:space-between;justify-content:space-between;-webkit-box-align:center;-webkit-align-items:center;align-items:center;padding:0 16px;height:48px;line-height:24px;background:rgba(45,75,115,.5);color:#fff;font-size:12px;z-index:10}.zt2-image-preview__footer-left{display:-webkit-box;display:-webkit-flex;display:flex;-webkit-box-align:center;-webkit-align-items:center;align-items:center}.zt2-image-preview__index{color:#fff;padding:0 9px;height:24px;background:rgba(45,75,115,.8);border-radius:2px}.zt2-image-preview__title{margin-left:8px;font-size:14px;color:#fff;line-height:24px}.zt2-image-preview__download{width:20px;height:20px;cursor:pointer}.zt2-image-preview__overlay.zt2-overlay{background-color:#000}.zt2-image-preview__close-icon{position:absolute;z-index:1;color:#c8c9cc;font-size:22px;cursor:pointer}.zt2-image-preview__close-icon:active{color:#969799}.zt2-image-preview__close-icon--top-left{top:16px;left:16px}.zt2-image-preview__close-icon--top-right{top:16px;right:16px}.zt2-image-preview__close-icon--bottom-left{bottom:16px;left:16px}.zt2-image-preview__close-icon--bottom-right{right:16px;bottom:16px}

package/es/image-preview/index.js

@@ -13,6 +13,7 @@ var defaultConfig = {
   onChange: null,
   className: '',
   showIndex: true,
+  showDownload: false,
   closeable: false,
   closeIcon: 'clear',
   asyncClose: false,

package/es/image-preview/index.less

@@ -54,22 +54,47 @@
     }
   }
 
-  &__index {
+  &__footer {
     position: absolute;
-    bottom: @image-preview-index-bottom;
-    left: @image-preview-index-left;
-    height: @image-preview-index-height;
-    width: @image-preview-index-width;
-    line-height:@image-preview-index-line-height;
-    //padding: @image-preview-index-padding;
-    border-radius: @border-radius-sm;
-    background: @image-preview-index-background;
+    bottom: 0;
+    left: 0;
+    right: 0;
+    display: flex;
+    justify-content: space-between;
+    align-items: center;
+    padding: 0 16px;
+    height: 48px;
+    line-height: @image-preview-index-line-height;
+    background: @image-preview-title-background;
     color: @image-preview-index-text-color;
     font-size: @font-size-sm;
-    text-shadow: @image-preview-index-text-shadow;
-    transform: translate(-50%, 0);
-    text-align: center;
     z-index: @image-preview-index-z-index;
+
+    &-left {
+      display: flex;
+      align-items: center;
+    }
+  }
+
+  &__index {
+    color: @image-preview-index-text-color;
+    padding: 0 9px;
+    height: 24px;
+    background: @image-preview-index-background;
+    border-radius: 2px;
+  }
+
+  &__title {
+    margin-left: 8px;
+    font-size: 14px;
+    color: #FFFFFF;
+    line-height: 24px;
+  }
+
+  &__download {
+    width: 20px;
+    height: 20px;
+    cursor: pointer;
   }
 
   &__overlay.@{base-prefix}-overlay {
@@ -107,17 +132,4 @@
       bottom: @image-preview-close-icon-margin;
     }
   }
-  &__title{
-    position:absolute;
-    bottom:@image-preview-title-bottom;
-    height: @image-preview-title-height;
-    width: @image-preview-title-width;
-    padding-left: @image-preview-title-padding-left;
-    left:@image-preview-title-left;
-    line-height: @image-preview-title-line-height;
-    font-size: @image-preview-title-font-size;
-    color: @white;
-    background:@image-preview-title-background;
-    z-index:@image-preview-title-z-index
-  }
 }

package/es/image-preview/style/index.js

@@ -5,6 +5,7 @@ import '../../icon/index.css';
 import '../../image/index.css';
 import '../../popup/index.css';
 import '../../loading/index.css';
+import '../../toast/index.css';
 import '../../swipe/index.css';
 import '../../swipe-item/index.css';
 import '../index.css';

package/es/image-preview/style/less.js

@@ -5,6 +5,7 @@ import '../../icon/index.less';
 import '../../image/index.less';
 import '../../popup/index.less';
 import '../../loading/index.less';
+import '../../toast/index.less';
 import '../../swipe/index.less';
 import '../../swipe-item/index.less';
 import '../index.less';

package/es/index.js

@@ -76,7 +76,7 @@ import TextEllipsis from './text-ellipsis';
 import Timeline from './timeline';
 import Toast from './toast';
 import Uploader from './uploader';
-var version = '2.1.29';
+var version = '2.1.32';
 function install(Vue) {
   var components = [ActionSheet, Area, Avatar, BackTop, Badge, Button, Calendar, Cascader, Cell, CellGroup, Checkbox, CheckboxGroup, Col, Collapse, CollapseItem, CountDown, DatetimePicker, Dialog, Divider, DropdownItem, DropdownMenu, Empty, Field, FoldDialog, Form, Grid, GridItem, HierarchySelect, Icon, Image, ImagePreview, IndexAnchor, IndexBar, Info, Lazyload, List, Loading, Locale, MediaPicker, MediaPlayer, MultiplePicker, NavBar, NoticeBar, NumberKeyboard, Overlay, PasswordInput, Picker, Popover, Popup, PullRefresh, Radio, RadioGroup, Rate, Row, Search, Signature, Skeleton, Slider, SpeechRecognizer, Step, Stepper, Steps, Sticky, Swipe, SwipeCell, SwipeItem, Switch, SwitchCell, Tab, Tabbar, TabbarItem, Table, Tabs, Tag, TextEllipsis, Timeline, Toast, Uploader];
   components.forEach(function (item) {

package/es/media-picker/index.js

@@ -56,6 +56,10 @@ export default createComponent({
       type: Boolean,
       default: false
     },
+    keepFileType: {
+      type: Boolean,
+      default: false
+    },
     mediaList: {
       type: Array,
       default: function _default() {
@@ -187,6 +191,14 @@ export default createComponent({
     sortable: {
       type: Boolean,
       default: false
+    },
+    showDownload: {
+      type: Boolean,
+      default: false
+    },
+    downloadAction: {
+      type: Function,
+      default: function _default() {}
     }
   },
   model: {
@@ -560,6 +572,21 @@ export default createComponent({
       }
       return validFiles;
     },
+    /**
+     * 根据 MIME 类型获取文件扩展名
+     */
+    getExtensionFromMimeType: function getExtensionFromMimeType(mimeType) {
+      var mimeToExt = {
+        'image/jpeg': 'jpg',
+        'image/jpg': 'jpg',
+        'image/png': 'png',
+        'image/gif': 'gif',
+        'image/webp': 'webp',
+        'image/bmp': 'bmp',
+        'image/svg+xml': 'svg'
+      };
+      return mimeToExt[mimeType] || 'jpg';
+    },
     /**
      * 转换图片文件，压缩、加水印，返回Media格式的图片
      * @param files 图片文件
@@ -569,7 +596,7 @@ export default createComponent({
       var _this6 = this;
       var promisesTodo = [];
       var resizeOptions = new ResizeOptions(this.maxImageSideLength);
-      var compressOptions = new CompressOptions(this.maxImageFileSize);
+      var compressOptions = new CompressOptions(this.maxImageFileSize, this.keepFileType);
       var _loop = function _loop() {
         var inputFile = files[i];
         var watermarkEnabled = _this6.watermarkOptions && _this6.watermarkOptions.watermarkConfigString && checkWatermarkConfigSupported(_this6.watermarkOptions.watermarkConfigString);
@@ -597,7 +624,9 @@ export default createComponent({
             return Promise.resolve();
           }
           return file2DataURL(f).then(function (base64) {
-            var uniqueFileName = getUniqueFileName(f, 'jpg');
+            // 根据 keepFileType 决定使用的扩展名
+            var ext = _this6.keepFileType ? _this6.getExtensionFromMimeType(f.type) : 'jpg';
+            var uniqueFileName = getUniqueFileName(f, ext);
             return Promise.resolve({
               showSrc: base64,
               type: MediaType.PHOTO,
@@ -726,7 +755,9 @@ export default createComponent({
                     };
                   }),
                   startPosition: imageIndex,
-                  closeable: true
+                  closeable: true,
+                  showDownload: _this7.showDownload,
+                  downloadAction: _this7.downloadAction
                 });
               } else if (media.type === MediaType.AUDIO || media.type === MediaType.VIDEO) {
                 if (!media.file && !media.url) {

package/es/uploader/style/index.js

@@ -5,6 +5,7 @@ import '../../icon/index.css';
 import '../../image/index.css';
 import '../../popup/index.css';
 import '../../loading/index.css';
+import '../../toast/index.css';
 import '../../swipe/index.css';
 import '../../swipe-item/index.css';
 import '../../image-preview/index.css';

package/es/uploader/style/less.js

@@ -5,6 +5,7 @@ import '../../icon/index.less';
 import '../../image/index.less';
 import '../../popup/index.less';
 import '../../loading/index.less';
+import '../../toast/index.less';
 import '../../swipe/index.less';
 import '../../swipe-item/index.less';
 import '../../image-preview/index.less';