stellar-ui-v2 1.40.5 → 1.40.7

package/README.md

@@ -10,9 +10,9 @@
 
 ## ✨ 特性
 
-- 🎯 多平台覆盖，支持 微信小程序、支付宝小程序、H5.
-- 🚀 40+ 个高质量组件，覆盖移动端主流场景.
-- 📖 提供丰富的文档和组件示例.
+- 🎯 多平台覆盖，支持 微信小程序、支付宝小程序、H5.
+- 🚀 40+ 个高质量组件，覆盖移动端主流场景.
+- 📖 提供丰富的文档和组件示例.
 - 🎨 支持修改 CSS 变量实现主题定制.
 
 ## 📱 预览
@@ -75,11 +75,11 @@ npm i stellar-ui-v2 -S
 
 ## 周边生态
 
-| 项目																							| 描述															|
-| ---																							| ---															|
-|[StellarUI-Plus](https://github.com/wuhanshuzhiyun/stellar-ui-plus)							| 一个基于vue3构建，打造的uni-app组件库								|
-|[ste-vue-inset-loader](https://github.com/wuhanshuzhiyun/ste-vue-inset-loader)					|常用于小程序需要全局引入组件的场景的包								|
-|[ste-helper](https://github.com/wuhanshuzhiyun/stellar-ui-plus/tree/main/plugins/ste-helper)	|旨在帮助开发者更加有效率的使用 StellarUI-Plus来开发项目的vscode插件	|
+| 项目																							| 描述															|
+| ---																							| ---															|
+|[StellarUI-Plus](https://github.com/wuhanshuzhiyun/stellar-ui-plus)							| 一个基于vue3构建，打造的uni-app组件库								|
+|[ste-vue-inset-loader](https://github.com/wuhanshuzhiyun/ste-vue-inset-loader)					|常用于小程序需要全局引入组件的场景的包								|
+|[ste-helper](https://github.com/wuhanshuzhiyun/stellar-ui-plus/tree/main/plugins/ste-helper)	|旨在帮助开发者更加有效率的使用 StellarUI-Plus来开发项目的vscode插件	|
 |[ste-cli](https://github.com/wuhanshuzhiyun/ste-cli)											|stellar配套的脚手架												|
 
 ## 核心团队

package/components/ste-app-update/README.md

@@ -0,0 +1,65 @@
+# AppUpdate App更新
+
+此组件用于APP更新功能
+
+---$
+
+### 基础用法
+
+- 属性`clientId`用于设置APP的应用编码
+- 属性`clientSecret`用于设置APP的应用密钥
+- 函数`start`用于开始检查更新
+- 回调事`cancel`取消更新
+- 回调事`complete`取消，成功更新都会执行
+
+```html
+<script>
+export default {
+	name: 'AppUpdateDemo',
+	data() {
+		return {};
+	},
+	methods: {
+		// 监听检查更新结果
+		checkForUpdates() {
+			if (this.$refs.appUpdate) {
+				this.$refs.appUpdate.start((resVersion, version) => {
+					const { code, name } = resVersion;
+					console.log(`当前版本号：${version}`);
+					console.log(`服务器版本号：${code}；服务器版本名称${name}`);
+				});
+			}
+		},
+	},
+};
+</script>
+<template>
+    <ste-app-update ref="appUpdate" clientId="workbench_android" clientSecret="gkS6lEEncqAocYK2qsrvPQZykm3ISeMx"></ste-app-update>
+    <button @click="checkForUpdates">检查更新</button>
+</template>
+```
+
+---$
+
+### API
+
+#### Props
+| 属性名 | 说明  | 类型 | 默认值  | 可选值 | 支持版本 |
+| ----- | ----- | --- | ------- | ------ | -------- |
+| `clientId` | 应用编码 | `string` | `` | - | - |
+| `clientSecret` | 应用密钥 | `string` | `` | - | - |
+| `apiUrl` | 更新API地址 | `string` | `https://zboa.whzb.com/inte-cloud-dev/blade-system/api/inte/client/ver/currentDetail` | - | - |
+| `appType` | APP环境,版本号的最后一位为环境标识 | `string` | `` | - | - |
+| `btnText` | 立即体验按钮文本 | `string` | `立即体验` | - | - |
+
+
+#### Events
+| 事件名 | 说明  | 事件参数 | 支持版本 |
+| ----- | ----- | ------- | -------- |
+| `cancel` | 取消更新 | - | - |
+| `update` | 发现新版时本触发 | - | - |
+| `no-update` | 没有新版时本触发 | - | - |
+
+
+---$
+{{xuyajun}}

package/components/ste-app-update/config.json

@@ -0,0 +1,5 @@
+{
+	"group": "业务组件",
+	"title": "AppUpdate APP更新",
+	"icon": "https://image.whzb.com/chain/StellarUI/%E7%BB%84%E4%BB%B6%E5%9B%BE%E6%A0%87/button.png"
+}

package/components/ste-app-update/method.js

@@ -0,0 +1,48 @@
+export function download(data, { success, error, onProgressUpdate, downloadSuccess }) {
+	const package_type = data.package_type;
+	const downloadTask = uni.downloadFile({
+		url: data.updateFile,
+		success: (res) => {
+			if (res.statusCode === 200) {
+				downloadSuccess && downloadSuccess(res.tempFilePath);
+				plus.runtime.install(
+					res.tempFilePath,
+					{ force: true },
+					() => {
+						// wgt升级
+						if (package_type == 1) {
+							uni.showModal({
+								title: '提示',
+								content: '升级成功，请重新启动！',
+								confirmText: '确定',
+								showCancel: false,
+								success: () => {
+									success && success();
+									plus.runtime.restart();
+								},
+							});
+						} else {
+							// 整包升级
+							success && success();
+						}
+					},
+					(e) => {
+						//提示部分wgt包无法安装的问题
+						uni.showModal({
+							title: '提示',
+							content: e.message,
+							showCancel: false,
+							success: () => {
+								error && error(e);
+							},
+						});
+					}
+				);
+			}
+		},
+	});
+	// 下载进度
+	downloadTask.onProgressUpdate((res) => {
+		onProgressUpdate && onProgressUpdate(res);
+	});
+}

package/components/ste-app-update/ste-app-update.vue

@@ -0,0 +1,308 @@
+<template>
+	<view class="update-mask flex-center" v-if="open">
+		<view class="update-content">
+			<image class="update-image" src="../../static/app_update_img.png"></image>
+
+			<view class="update-title">发现新版本</view>
+			<view class="update-version">v{{ data.name }}</view>
+			<scroll-view scroll-y class="update-desc">
+				<view class="update-desc-title">更新内容</view>
+				<view class="update-desc-message"><rich-text :nodes="data.content"></rich-text></view>
+			</scroll-view>
+			<view class="update-footer">
+				<view class="update-progress-box" v-if="!updateBtn">
+					<progress class="update-progress" border-radius="35" :percent="percent" activeColor="#3DA7FF" show-info stroke-width="10" />
+					<view>
+						<text class="update-down-msg" v-if="tempFilePath">下载完成</text>
+						<text class="update-down-msg" v-else>正在下载，请稍后 ({{ downloadedSize }}/{{ packageFileSize }}M)</text>
+					</view>
+				</view>
+				<button class="update-button" plain @click="confirm" v-if="updateBtn">{{ btnText }}</button>
+				<button class="update-button" plain @click="install" v-else-if="data.package_type === 0 && tempFilePath">安装</button>
+			</view>
+
+			<view class="update-close" v-if="!data.isForce" @click.stop="close">✖</view>
+		</view>
+	</view>
+</template>
+<script>
+import { download } from './method';
+
+export default {
+	group: '业务组件',
+	title: 'AppUpdate APP更新',
+	name: 'SteAppUpdate',
+	props: {
+		/** 应用编码 */
+		clientId: {
+			type: String,
+			default: '',
+		},
+		/** 应用密钥 */
+		clientSecret: {
+			type: String,
+			default: '',
+		},
+		/** API地址 */
+		apiUrl: {
+			type: String,
+			default: 'https://zboa.whzb.com/inte-cloud-dev/blade-system/api/inte/client/ver/currentDetail',
+		},
+		/** APP环境,版本号的最后一位为环境标识 */
+		appType: {
+			type: String,
+			default: '',
+		},
+		/** 立即体验按钮文本 */
+		btnText: {
+			type: String,
+			default: '立即体验',
+		},
+	},
+	data() {
+		return {
+			data: {
+				content: '',
+				updateFile: '', //安装包
+				isForce: false, //是否强制更新 0代表否 1代表是
+				package_type: 0, //0 是整包升级 1是wgt升级
+				name: '1.0.1', // 版本名称
+				code: '100', // 版本号
+			},
+			open: false,
+			version: uni.getSystemInfoSync().version,
+			percent: 0,
+			updateBtn: true,
+			downloadedSize: '0',
+			packageFileSize: '0',
+			tempFilePath: '',
+		};
+	},
+	methods: {
+		getData(callback) {
+			uni.request({
+				url: this.apiUrl,
+				method: 'GET',
+				header: {
+					Authorization: `Basic ${btoa(this.clientId + ':' + this.clientSecret)}`,
+				},
+				success: (res) => {
+					const _data = res.data;
+					if (_data.code == 200) {
+						this.data.code = _data.data.code;
+						this.data.name = _data.data.name;
+
+						this.data.content = (_data.data.desc || '').replace(/\n+/g, '<br />');
+
+						this.data.isForce = _data.data.isForce;
+						this.data.updateFile = _data.data.entireFile ? _data.data.entireFile : _data.data.updateFile;
+						this.data.package_type = _data.data.entireFile ? 0 : 1;
+						callback && callback({ code: _data.data.code, name: _data.data.name, updateFile: this.data.updateFile }, this.version);
+						if (this.appType) {
+							const nvs = this.data.name.split('.');
+							// 版本号的最后一位是环境，比较版本号最后一位版本号是否一致，不一致弹错误窗口提示
+							const nevn = nvs[nvs.length - 1];
+							if (this.appType !== nevn) {
+								uni.showModal({
+									title: '提示',
+									content: `新版本环境：${nevn}和当前环境${this.appType}不一致`,
+									showCancel: false,
+								});
+								return;
+							}
+							nvs.splice(nvs.length - 1);
+							this.data.name = nvs.join('.');
+						}
+						if (this.data.updateFile && this.data.code !== this.version) {
+							this.open = true;
+							this.$emit('update');
+							// 如果是强制更新，直接开始下载
+							if (this.data.isForce) this.confirm();
+							return;
+						}
+					} else {
+						console.log(_data.msg);
+					}
+					// 无需升级
+					this.$emit('no-update');
+				},
+				fail: (err) => {
+					console.log('err===========', err);
+					this.$emit('no-update');
+				},
+			});
+		},
+
+		start(callback) {
+			// #ifdef APP-PLUS
+			plus.runtime.getProperty(plus.runtime.appid || '', (inf) => {
+				this.version = inf.version || '';
+				this.getData(callback);
+			});
+			// #endif
+			// #ifndef APP-PLUS
+			this.getData(callback);
+			// #endif
+		},
+
+		onProgressUpdate(res) {
+			this.percent = res.progress;
+			this.downloadedSize = (res.totalBytesWritten / Math.pow(1024, 2)).toFixed(2);
+			this.packageFileSize = (res.totalBytesExpectedToWrite / Math.pow(1024, 2)).toFixed(2);
+		},
+
+		confirm() {
+			if (this.data.package_type == 0) {
+				//apk整包升级 下载地址必须以.apk结尾
+				if (this.data.updateFile.includes('.apk')) {
+					this.updateBtn = false;
+					download(this.data, {
+						onProgressUpdate: this.onProgressUpdate,
+						downloadSuccess: (path) => (this.tempFilePath = path),
+					});
+				} else {
+					//外部下载 一般是手机应用市场或者其他h5页面
+					plus.runtime.openURL(this.data.updateFile);
+					uni.navigateBack({
+						delta: 1,
+					});
+				}
+			} else {
+				this.updateBtn = false;
+				//wgt资源包升级 下载地址必须以.wgt结尾
+				download(this.data, {
+					onProgressUpdate: this.onProgressUpdate,
+					downloadSuccess: (path) => (this.tempFilePath = path),
+				});
+			}
+		},
+
+		close() {
+			this.open = false;
+			this.$emit('cancel');
+		},
+
+		install() {
+			plus.runtime.install(
+				this.tempFilePath,
+				{ force: true },
+				() => {
+					// wgt升级
+					if (this.data.package_type == 1) {
+						uni.showModal({
+							title: '提示',
+							content: '升级成功，请重新启动！',
+							confirmText: '确定',
+							showCancel: false,
+							success: () => {
+								plus.runtime.restart();
+							},
+						});
+					}
+				},
+				(e) => {
+					//提示部分wgt包无法安装的问题
+					uni.showModal({
+						title: '提示',
+						content: e.message,
+						showCancel: false,
+						success: () => {},
+					});
+				}
+			);
+		},
+	},
+};
+</script>
+
+<style lang="scss" scoped>
+.flex-center {
+	display: flex;
+	justify-content: center;
+	align-items: center;
+}
+
+.update-mask {
+	position: fixed;
+	left: 0;
+	top: 0;
+	right: 0;
+	bottom: 0;
+	background-color: rgba(0, 0, 0, 0.5);
+	z-index: 9999;
+	.update-content {
+		width: 694rpx;
+		background-color: #fff;
+		border-radius: 16rpx;
+		padding: 72rpx 40rpx 40rpx 40rpx;
+		display: flex;
+		flex-direction: column;
+		align-items: center;
+		line-height: 1.5;
+		position: relative;
+		.update-image {
+			width: 201rpx;
+			height: 201rpx;
+		}
+		.update-title {
+			margin-top: 28rpx;
+			font-weight: 500;
+			font-size: 48rpx;
+			color: #000000;
+		}
+		.update-version {
+			font-weight: 400;
+			font-size: 34rpx;
+			color: #a7abb0;
+		}
+		.update-desc {
+			width: 100%;
+			max-height: 350rpx;
+			margin-top: 24rpx;
+			.update-desc-title {
+				font-weight: 500;
+				font-size: 32rpx;
+				color: #000000;
+			}
+			.update-desc-message {
+				font-weight: 400;
+				font-size: 28rpx;
+				color: #555a61;
+			}
+		}
+
+		.update-footer {
+			width: 100%;
+			margin-top: 48rpx;
+			.update-progress-box {
+				text-align: center;
+				font-weight: 400;
+				font-size: 34rpx;
+				color: #a7abb0;
+			}
+			.update-button {
+				width: 100%;
+				height: 96rpx;
+				line-height: 88rpx;
+				background: #1388f7;
+				border-radius: 16rpx;
+				border: 4rpx solid #1388f7;
+				font-weight: 500;
+				font-size: 32rpx;
+				color: #ffffff;
+			}
+		}
+		.update-close {
+			position: absolute;
+			top: 0;
+			right: 0;
+			font-size: 30rpx;
+			color: #555a61;
+			width: 104rpx;
+			height: 96rpx;
+			line-height: 96rpx;
+			text-align: center;
+		}
+	}
+}
+</style>

package/components/ste-comment/config.json

@@ -1,5 +1,5 @@
 {
-    "group": "业务组件",
-    "title": "Comment 评价",
-    "icon": "https://image.whzb.com/chain/StellarUI/组件图标/评价.png"
-}
+	"group": "业务组件",
+	"title": "Comment 评价",
+	"icon": "https://image.whzb.com/chain/StellarUI/组件图标/评价.png"
+}

package/components/ste-coupon-list/ste-coupon-list.vue

@@ -4,6 +4,8 @@ import utils from '../../utils/utils.js';
 let interval = 0;
 
 export default {
+	group: '业务组件',
+	title: 'CouponList 券列表',
 	props: {
 		/** 基础数据 */
 		data: { type: Object, default: () => ({}) },

package/components/ste-index-list/README.md

@@ -111,12 +111,12 @@ methods: {
 
 #### IndexList Props
 
-| 属性名			| 说明											|类型				|默认值		|可选值	| 支持版本	|
-| ---				|---											| ---				| ---		| ---	| ---		|
-| `active`			| 当前激活的索引下标，支持sync双向绑定，默认值0		| `Number`			| `0`		| -		| -			|
-| `height`			| 高度，默认值100%								| `String`/`Number`	| `"100%"`	| -		| -			|
-| `sticky`			| `title`是否粘性布局，自定义`title`插槽时不生效	| `Boolean`			| `true`	| -		| -			|
-| `inactiveColor`	| 右边锚点状态非激活时的颜色						| `String`			| `#666666`	| -		| -			|
+| 属性名			| 说明											|类型				|默认值		|可选值	| 支持版本	|
+| ---				|---											| ---				| ---		| ---	| ---		|
+| `active`			| 当前激活的索引下标，支持sync双向绑定，默认值0		| `Number`			| `0`		| -		| -			|
+| `height`			| 高度，默认值100%								| `String`/`Number`	| `"100%"`	| -		| -			|
+| `sticky`			| `title`是否粘性布局，自定义`title`插槽时不生效	| `Boolean`			| `true`	| -		| -			|
+| `inactiveColor`	| 右边锚点状态非激活时的颜色						| `String`			| `#666666`	| -		| -			|
 | `activeColor`		| 右边锚点状态激活时的颜色							| `String`			| `#0090FF`	| -		| -			|
 
 #### IndexList Events

package/components/ste-message-box/ste-message-box.js

@@ -1,72 +1,72 @@
-import Vue from 'vue';
-import Vuex from 'vuex';
-
-Vue.use(Vuex);
-const DEFAULT_KEY = '$steMsgBoxKey';
-const DEFAULT_CONFIG = {
-	title: '',
-	content: '',
-	showCancel: true,
-	icon: '',
-	cancelText: '取消',
-	cancelColor: '#333333',
-	confirmText: '确认',
-	confirmColor: '',
-	editable: false,
-	placeholderText: '',
-	success: null,
-	fail: null,
-	complete: null,
-};
-
-const store = new Vuex.Store({
-	state: {},
-	mutations: {
-		initializeState(state, key) {
-			if (!state[key]) {
-				Vue.set(state, key, {
-					selector: key,
-					openBegin: false,
-					...DEFAULT_CONFIG,
-				});
-			}
-		},
-		setState(state, { key, params }) {
-			Object.assign(state[key], params);
-		},
-		resetState(state, key) {
-			Object.assign(state[key], {
-				openBegin: false,
-			});
-		},
-	},
-});
-
-function useSteMsgBox(key) {
-	key = key ?? DEFAULT_KEY;
-	store.commit('initializeState', key);
-
-	return {
-		showMsgBox(params) {
-			store.commit('setState', {
-				key,
-				params: {
-					...DEFAULT_CONFIG,
-					...params,
-					confirm: params.confirm ?? function () {},
-					cancel: params.cancel ?? function () {},
-					complete: params.complete ?? function () {},
-					openBegin: true,
-				},
-			});
-		},
-		hideMsgBox() {
-			store.commit('resetState', key);
-		},
-		$state: store.state[key],
-		$store: store,
-	};
-}
-
-export default useSteMsgBox;
-export { DEFAULT_KEY };
+import Vue from 'vue';
+import Vuex from 'vuex';
+
+Vue.use(Vuex);
+const DEFAULT_KEY = '$steMsgBoxKey';
+const DEFAULT_CONFIG = {
+	title: '',
+	content: '',
+	showCancel: true,
+	icon: '',
+	cancelText: '取消',
+	cancelColor: '#333333',
+	confirmText: '确认',
+	confirmColor: '',
+	editable: false,
+	placeholderText: '',
+	success: null,
+	fail: null,
+	complete: null,
+};
+
+const store = new Vuex.Store({
+	state: {},
+	mutations: {
+		initializeState(state, key) {
+			if (!state[key]) {
+				Vue.set(state, key, {
+					selector: key,
+					openBegin: false,
+					...DEFAULT_CONFIG,
+				});
+			}
+		},
+		setState(state, { key, params }) {
+			Object.assign(state[key], params);
+		},
+		resetState(state, key) {
+			Object.assign(state[key], {
+				openBegin: false,
+			});
+		},
+	},
+});
+
+function useSteMsgBox(key) {
+	key = key ?? DEFAULT_KEY;
+	store.commit('initializeState', key);
+
+	return {
+		showMsgBox(params) {
+			store.commit('setState', {
+				key,
+				params: {
+					...DEFAULT_CONFIG,
+					...params,
+					confirm: params.confirm ?? function () {},
+					cancel: params.cancel ?? function () {},
+					complete: params.complete ?? function () {},
+					openBegin: true,
+				},
+			});
+		},
+		hideMsgBox() {
+			store.commit('resetState', key);
+		},
+		$state: store.state[key],
+		$store: store,
+	};
+}
+
+export default useSteMsgBox;
+export { DEFAULT_KEY };