@10yun/cv-mobile-ui 0.5.18 → 0.5.19

package/uni-ui/lib/uni-fav/uni-fav.vue

@@ -0,0 +1 @@
+<template>
  <view
    :class="[circle === true || circle === 'true' ? 'uni-fav--circle' : '']"
    :style="[{ backgroundColor: checked ? bgColorChecked : bgColor }]"
    @click="onClick"
    class="uni-fav"
  >
    <!-- #ifdef MP-ALIPAY -->
    <view class="uni-fav-star" v-if="!checked && (star === true || star === 'true')">
      <uni-icons :color="fgColor" :style="{ color: checked ? fgColorChecked : fgColor }" size="14" type="star-filled" />
    </view>
    <!-- #endif -->
    <!-- #ifndef MP-ALIPAY -->
    <uni-icons
      :color="fgColor"
      :style="{ color: checked ? fgColorChecked : fgColor }"
      class="uni-fav-star"
      size="14"
      type="star-filled"
      v-if="!checked && (star === true || star === 'true')"
    />
    <!-- #endif -->
    <text :style="{ color: checked ? fgColorChecked : fgColor }" class="uni-fav-text">
      {{ checked ? contentFav : contentDefault }}
    </text>
  </view>
 * Fav 收藏按钮
 * @description 用于收藏功能，可点击切换选中、不选中的状态
 * @tutorial https://ext.dcloud.net.cn/plugin?id=864
 * @property {Boolean} star = [true|false] 按钮是否带星星
 * @property {String} bgColor 未收藏时的背景色
 * @property {String} bgColorChecked 已收藏时的背景色
 * @property {String} fgColor 未收藏时的文字颜色
 * @property {String} fgColorChecked 已收藏时的文字颜色
 * @property {Boolean} circle = [true|false] 是否为圆角
 * @property {Boolean} checked = [true|false] 是否为已收藏
 * @property {Object} contentText = [true|false] 收藏按钮文字
 * @property {Boolean} stat 是否开启统计功能
 * @event {Function} click 点击 fav按钮触发事件
 * @example <uni-fav :checked="true"/>
 */
  name: 'UniFav',
  // TODO 兼容 vue3，需要注册事件
  emits: ['click'],
  props: {
    star: {
      type: [Boolean, String],
      default: true
    },
    bgColor: {
      type: String,
      default: '#eeeeee'
    },
    fgColor: {
      type: String,
      default: '#666666'
    },
    bgColorChecked: {
      type: String,
      default: '#007aff'
    },
    fgColorChecked: {
      type: String,
      default: '#FFFFFF'
    },
    circle: {
      type: [Boolean, String],
      default: false
    },
    checked: {
      type: Boolean,
      default: false
    },
    contentText: {
      type: Object,
      default() {
        return {
          contentDefault: '',
          contentFav: ''
        };
      }
    },
    stat: {
      type: Boolean,
      default: false
    }
  },
  computed: {
    contentDefault() {
      return this.contentText.contentDefault || t('uni-fav.collect');
    },
    contentFav() {
      return this.contentText.contentFav || t('uni-fav.collected');
    }
  },
  watch: {
    checked() {
      if (uni.report && this.stat) {
        if (this.checked) {
          uni.report('收藏', '收藏');
        } else {
          uni.report('取消收藏', '取消收藏');
        }
      }
    }
  },
  methods: {
    onClick() {
      this.$emit('click');
    }
  }

package/uni-ui/lib/uni-file-picker/choose-and-upload-file.js

@@ -0,0 +1,224 @@
+'use strict';
+
+const ERR_MSG_OK = 'chooseAndUploadFile:ok';
+const ERR_MSG_FAIL = 'chooseAndUploadFile:fail';
+
+function chooseImage(opts) {
+	const {
+		count,
+		sizeType = ['original', 'compressed'],
+		sourceType,
+		extension
+	} = opts
+	return new Promise((resolve, reject) => {
+		uni.chooseImage({
+			count,
+			sizeType,
+			sourceType,
+			extension,
+			success(res) {
+				resolve(normalizeChooseAndUploadFileRes(res, 'image'));
+			},
+			fail(res) {
+				reject({
+					errMsg: res.errMsg.replace('chooseImage:fail', ERR_MSG_FAIL),
+				});
+			},
+		});
+	});
+}
+
+function chooseVideo(opts) {
+	const {
+		camera,
+		compressed,
+		maxDuration,
+		sourceType,
+		extension
+	} = opts;
+	return new Promise((resolve, reject) => {
+		uni.chooseVideo({
+			camera,
+			compressed,
+			maxDuration,
+			sourceType,
+			extension,
+			success(res) {
+				const {
+					tempFilePath,
+					duration,
+					size,
+					height,
+					width
+				} = res;
+				resolve(normalizeChooseAndUploadFileRes({
+					errMsg: 'chooseVideo:ok',
+					tempFilePaths: [tempFilePath],
+					tempFiles: [
+					{
+						name: (res.tempFile && res.tempFile.name) || '',
+						path: tempFilePath,
+						size,
+						type: (res.tempFile && res.tempFile.type) || '',
+						width,
+						height,
+						duration,
+						fileType: 'video',
+						cloudPath: '',
+					}, ],
+				}, 'video'));
+			},
+			fail(res) {
+				reject({
+					errMsg: res.errMsg.replace('chooseVideo:fail', ERR_MSG_FAIL),
+				});
+			},
+		});
+	});
+}
+
+function chooseAll(opts) {
+	const {
+		count,
+		extension
+	} = opts;
+	return new Promise((resolve, reject) => {
+		let chooseFile = uni.chooseFile;
+		if (typeof wx !== 'undefined' &&
+			typeof wx.chooseMessageFile === 'function') {
+			chooseFile = wx.chooseMessageFile;
+		}
+		if (typeof chooseFile !== 'function') {
+			return reject({
+				errMsg: ERR_MSG_FAIL + ' 请指定 type 类型，该平台仅支持选择 image 或 video。',
+			});
+		}
+		chooseFile({
+			type: 'all',
+			count,
+			extension,
+			success(res) {
+				resolve(normalizeChooseAndUploadFileRes(res));
+			},
+			fail(res) {
+				reject({
+					errMsg: res.errMsg.replace('chooseFile:fail', ERR_MSG_FAIL),
+				});
+			},
+		});
+	});
+}
+
+function normalizeChooseAndUploadFileRes(res, fileType) {
+	res.tempFiles.forEach((item, index) => {
+		if (!item.name) {
+			item.name = item.path.substring(item.path.lastIndexOf('/') + 1);
+		}
+		if (fileType) {
+			item.fileType = fileType;
+		}
+		item.cloudPath =
+			Date.now() + '_' + index + item.name.substring(item.name.lastIndexOf('.'));
+	});
+	if (!res.tempFilePaths) {
+		res.tempFilePaths = res.tempFiles.map((file) => file.path);
+	}
+	return res;
+}
+
+function uploadCloudFiles(files, max = 5, onUploadProgress) {
+	files = JSON.parse(JSON.stringify(files))
+	const len = files.length
+	let count = 0
+	let self = this
+	return new Promise(resolve => {
+		while (count < max) {
+			next()
+		}
+
+		function next() {
+			let cur = count++
+			if (cur >= len) {
+				!files.find(item => !item.url && !item.errMsg) && resolve(files)
+				return
+			}
+			const fileItem = files[cur]
+			const index = self.files.findIndex(v => v.uuid === fileItem.uuid)
+			fileItem.url = ''
+			delete fileItem.errMsg
+
+			uniCloud
+				.uploadFile({
+					filePath: fileItem.path,
+					cloudPath: fileItem.cloudPath,
+					fileType: fileItem.fileType,
+					onUploadProgress: res => {
+						res.index = index
+						onUploadProgress && onUploadProgress(res)
+					}
+				})
+				.then(res => {
+					fileItem.url = res.fileID
+					fileItem.index = index
+					if (cur < len) {
+						next()
+					}
+				})
+				.catch(res => {
+					fileItem.errMsg = res.errMsg || res.message
+					fileItem.index = index
+					if (cur < len) {
+						next()
+					}
+				})
+		}
+	})
+}
+
+
+
+
+
+function uploadFiles(choosePromise, {
+	onChooseFile,
+	onUploadProgress
+}) {
+	return choosePromise
+		.then((res) => {
+			if (onChooseFile) {
+				const customChooseRes = onChooseFile(res);
+				if (typeof customChooseRes !== 'undefined') {
+					return Promise.resolve(customChooseRes).then((chooseRes) => typeof chooseRes === 'undefined' ?
+						res : chooseRes);
+				}
+			}
+			return res;
+		})
+		.then((res) => {
+			if (res === false) {
+				return {
+					errMsg: ERR_MSG_OK,
+					tempFilePaths: [],
+					tempFiles: [],
+				};
+			}
+			return res
+		})
+}
+
+function chooseAndUploadFile(opts = {
+	type: 'all'
+}) {
+	if (opts.type === 'image') {
+		return uploadFiles(chooseImage(opts), opts);
+	}
+	else if (opts.type === 'video') {
+		return uploadFiles(chooseVideo(opts), opts);
+	}
+	return uploadFiles(chooseAll(opts), opts);
+}
+
+export {
+	chooseAndUploadFile,
+	uploadCloudFiles
+};

package/uni-ui/lib/uni-file-picker/style.css

@@ -0,0 +1,97 @@
+.uni-file-picker__container {
+  /* #ifndef APP-NVUE */
+  display: flex;
+  box-sizing: border-box;
+  /* #endif */
+  flex-wrap: wrap;
+  margin: -5px;
+}
+.file-picker__box {
+  position: relative;
+  width: 33.3%;
+  height: 0;
+  padding-top: 33.33%;
+  /* #ifndef APP-NVUE */
+  box-sizing: border-box;
+  /* #endif */
+}
+.file-picker__box-content {
+  position: absolute;
+  top: 0;
+  right: 0;
+  bottom: 0;
+  left: 0;
+  margin: 5px;
+  border: 1px #eee solid;
+  border-radius: 5px;
+  overflow: hidden;
+}
+.file-picker__progress {
+  position: absolute;
+  bottom: 0;
+  left: 0;
+  right: 0;
+  /* border: 1px red solid; */
+  z-index: 2;
+}
+.file-picker__progress-item {
+  width: 100%;
+}
+.file-picker__mask {
+  /* #ifndef APP-NVUE */
+  display: flex;
+  /* #endif */
+  justify-content: center;
+  align-items: center;
+  position: absolute;
+  right: 0;
+  top: 0;
+  bottom: 0;
+  left: 0;
+  color: #fff;
+  font-size: 12px;
+  background-color: rgba(0, 0, 0, 0.4);
+}
+.file-image {
+  width: 100%;
+  height: 100%;
+}
+.is-add {
+  /* #ifndef APP-NVUE */
+  display: flex;
+  /* #endif */
+  align-items: center;
+  justify-content: center;
+}
+.icon-add {
+  width: 50px;
+  height: 5px;
+  background-color: #f1f1f1;
+  border-radius: 2px;
+}
+.rotate {
+  position: absolute;
+  transform: rotate(90deg);
+}
+.icon-del-box {
+  /* #ifndef APP-NVUE */
+  display: flex;
+  /* #endif */
+  align-items: center;
+  justify-content: center;
+  position: absolute;
+  top: 3px;
+  right: 3px;
+  height: 26px;
+  width: 26px;
+  border-radius: 50%;
+  background-color: rgba(0, 0, 0, 0.5);
+  z-index: 2;
+  transform: rotate(-45deg);
+}
+.icon-del {
+  width: 15px;
+  height: 2px;
+  background-color: #fff;
+  border-radius: 2px;
+}

package/uni-ui/lib/uni-file-picker/style.scss

@@ -0,0 +1,110 @@
+
+.uni-file-picker__container {
+  /* #ifndef APP-NVUE */
+  display: flex;
+  box-sizing: border-box;
+  /* #endif */
+  flex-wrap: wrap;
+  margin: -5px;
+}
+
+.file-picker__box {
+  position: relative;
+  // flex: 0 0 33.3%;
+  width: 33.3%;
+  height: 0;
+  padding-top: 33.33%;
+  /* #ifndef APP-NVUE */
+  box-sizing: border-box;
+  /* #endif */
+}
+
+.file-picker__box-content {
+  position: absolute;
+  top: 0;
+  right: 0;
+  bottom: 0;
+  left: 0;
+  margin: 5px;
+  border: 1px #eee solid;
+  border-radius: 5px;
+  overflow: hidden;
+}
+
+.file-picker__progress {
+  position: absolute;
+  bottom: 0;
+  left: 0;
+  right: 0;
+  /* border: 1px red solid; */
+  z-index: 2;
+}
+
+.file-picker__progress-item {
+  width: 100%;
+}
+
+.file-picker__mask {
+  /* #ifndef APP-NVUE */
+  display: flex;
+  /* #endif */
+  justify-content: center;
+  align-items: center;
+  position: absolute;
+  right: 0;
+  top: 0;
+  bottom: 0;
+  left: 0;
+  color: #fff;
+  font-size: 12px;
+  background-color: rgba(0, 0, 0, 0.4);
+}
+
+.file-image {
+  width: 100%;
+  height: 100%;
+}
+
+.is-add {
+  /* #ifndef APP-NVUE */
+  display: flex;
+  /* #endif */
+  align-items: center;
+  justify-content: center;
+}
+
+.icon-add {
+  width: 50px;
+  height: 5px;
+  background-color: #f1f1f1;
+  border-radius: 2px;
+}
+
+.rotate {
+  position: absolute;
+  transform: rotate(90deg);
+}
+
+.icon-del-box {
+  /* #ifndef APP-NVUE */
+  display: flex;
+  /* #endif */
+  align-items: center;
+  justify-content: center;
+  position: absolute;
+  top: 3px;
+  right: 3px;
+  height: 26px;
+  width: 26px;
+  border-radius: 50%;
+  background-color: rgba(0, 0, 0, 0.5);
+  z-index: 2;
+  transform: rotate(-45deg);
+}
+
+.icon-del {
+  width: 15px;
+  height: 2px;
+  background-color: #fff;
+  border-radius: 2px;
+}