大体布局

App.vue

 <script>
+	import initApp from '@/common/appInit.js';
 	export default {
 		globalData: {
-			searchText: ''
+			searchText: '',
+			appVersion:{}
 		},
 		onLaunch: function() {
 			//#ifdef APP-PLUS
@@ -11,6 +13,10 @@
 			});
 			//#endif
 			console.log('App Launch')
+			
+			initApp();
+			
+			
 		},
 		onShow: function() {
 			console.log('App Show')

LICENSE

-MIT License
-
-Copyright (c) 2021 崔红保
-
-Permission is hereby granted, free of charge, to any person obtaining a copy
-of this software and associated documentation files (the "Software"), to deal
-in the Software without restriction, including without limitation the rights
-to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
-copies of the Software, and to permit persons to whom the Software is
-furnished to do so, subject to the following conditions:
-
-The above copyright notice and this permission notice shall be included in all
-copies or substantial portions of the Software.
-
-THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
-IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
-FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
-AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
-LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
-OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
-SOFTWARE.
+                                 Apache License
+                           Version 2.0, January 2004
+                        http://www.apache.org/licenses/
+
+   TERMS AND CONDITIONS FOR USE, REPRODUCTION, AND DISTRIBUTION
+
+   1. Definitions.
+
+      "License" shall mean the terms and conditions for use, reproduction,
+      and distribution as defined by Sections 1 through 9 of this document.
+
+      "Licensor" shall mean the copyright owner or entity authorized by
+      the copyright owner that is granting the License.
+
+      "Legal Entity" shall mean the union of the acting entity and all
+      other entities that control, are controlled by, or are under common
+      control with that entity. For the purposes of this definition,
+      "control" means (i) the power, direct or indirect, to cause the
+      direction or management of such entity, whether by contract or
+      otherwise, or (ii) ownership of fifty percent (50%) or more of the
+      outstanding shares, or (iii) beneficial ownership of such entity.
+
+      "You" (or "Your") shall mean an individual or Legal Entity
+      exercising permissions granted by this License.
+
+      "Source" form shall mean the preferred form for making modifications,
+      including but not limited to software source code, documentation
+      source, and configuration files.
+
+      "Object" form shall mean any form resulting from mechanical
+      transformation or translation of a Source form, including but
+      not limited to compiled object code, generated documentation,
+      and conversions to other media types.
+
+      "Work" shall mean the work of authorship, whether in Source or
+      Object form, made available under the License, as indicated by a
+      copyright notice that is included in or attached to the work
+      (an example is provided in the Appendix below).
+
+      "Derivative Works" shall mean any work, whether in Source or Object
+      form, that is based on (or derived from) the Work and for which the
+      editorial revisions, annotations, elaborations, or other modifications
+      represent, as a whole, an original work of authorship. For the purposes
+      of this License, Derivative Works shall not include works that remain
+      separable from, or merely link (or bind by name) to the interfaces of,
+      the Work and Derivative Works thereof.
+
+      "Contribution" shall mean any work of authorship, including
+      the original version of the Work and any modifications or additions
+      to that Work or Derivative Works thereof, that is intentionally
+      submitted to Licensor for inclusion in the Work by the copyright owner
+      or by an individual or Legal Entity authorized to submit on behalf of
+      the copyright owner. For the purposes of this definition, "submitted"
+      means any form of electronic, verbal, or written communication sent
+      to the Licensor or its representatives, including but not limited to
+      communication on electronic mailing lists, source code control systems,
+      and issue tracking systems that are managed by, or on behalf of, the
+      Licensor for the purpose of discussing and improving the Work, but
+      excluding communication that is conspicuously marked or otherwise
+      designated in writing by the copyright owner as "Not a Contribution."
+
+      "Contributor" shall mean Licensor and any individual or Legal Entity
+      on behalf of whom a Contribution has been received by Licensor and
+      subsequently incorporated within the Work.
+
+   2. Grant of Copyright License. Subject to the terms and conditions of
+      this License, each Contributor hereby grants to You a perpetual,
+      worldwide, non-exclusive, no-charge, royalty-free, irrevocable
+      copyright license to reproduce, prepare Derivative Works of,
+      publicly display, publicly perform, sublicense, and distribute the
+      Work and such Derivative Works in Source or Object form.
+
+   3. Grant of Patent License. Subject to the terms and conditions of
+      this License, each Contributor hereby grants to You a perpetual,
+      worldwide, non-exclusive, no-charge, royalty-free, irrevocable
+      (except as stated in this section) patent license to make, have made,
+      use, offer to sell, sell, import, and otherwise transfer the Work,
+      where such license applies only to those patent claims licensable
+      by such Contributor that are necessarily infringed by their
+      Contribution(s) alone or by combination of their Contribution(s)
+      with the Work to which such Contribution(s) was submitted. If You
+      institute patent litigation against any entity (including a
+      cross-claim or counterclaim in a lawsuit) alleging that the Work
+      or a Contribution incorporated within the Work constitutes direct
+      or contributory patent infringement, then any patent licenses
+      granted to You under this License for that Work shall terminate
+      as of the date such litigation is filed.
+
+   4. Redistribution. You may reproduce and distribute copies of the
+      Work or Derivative Works thereof in any medium, with or without
+      modifications, and in Source or Object form, provided that You
+      meet the following conditions:
+
+      (a) You must give any other recipients of the Work or
+          Derivative Works a copy of this License; and
+
+      (b) You must cause any modified files to carry prominent notices
+          stating that You changed the files; and
+
+      (c) You must retain, in the Source form of any Derivative Works
+          that You distribute, all copyright, patent, trademark, and
+          attribution notices from the Source form of the Work,
+          excluding those notices that do not pertain to any part of
+          the Derivative Works; and
+
+      (d) If the Work includes a "NOTICE" text file as part of its
+          distribution, then any Derivative Works that You distribute must
+          include a readable copy of the attribution notices contained
+          within such NOTICE file, excluding those notices that do not
+          pertain to any part of the Derivative Works, in at least one
+          of the following places: within a NOTICE text file distributed
+          as part of the Derivative Works; within the Source form or
+          documentation, if provided along with the Derivative Works; or,
+          within a display generated by the Derivative Works, if and
+          wherever such third-party notices normally appear. The contents
+          of the NOTICE file are for informational purposes only and
+          do not modify the License. You may add Your own attribution
+          notices within Derivative Works that You distribute, alongside
+          or as an addendum to the NOTICE text from the Work, provided
+          that such additional attribution notices cannot be construed
+          as modifying the License.
+
+      You may add Your own copyright statement to Your modifications and
+      may provide additional or different license terms and conditions
+      for use, reproduction, or distribution of Your modifications, or
+      for any such Derivative Works as a whole, provided Your use,
+      reproduction, and distribution of the Work otherwise complies with
+      the conditions stated in this License.
+
+   5. Submission of Contributions. Unless You explicitly state otherwise,
+      any Contribution intentionally submitted for inclusion in the Work
+      by You to the Licensor shall be under the terms and conditions of
+      this License, without any additional terms or conditions.
+      Notwithstanding the above, nothing herein shall supersede or modify
+      the terms of any separate license agreement you may have executed
+      with Licensor regarding such Contributions.
+
+   6. Trademarks. This License does not grant permission to use the trade
+      names, trademarks, service marks, or product names of the Licensor,
+      except as required for reasonable and customary use in describing the
+      origin of the Work and reproducing the content of the NOTICE file.
+
+   7. Disclaimer of Warranty. Unless required by applicable law or
+      agreed to in writing, Licensor provides the Work (and each
+      Contributor provides its Contributions) on an "AS IS" BASIS,
+      WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or
+      implied, including, without limitation, any warranties or conditions
+      of TITLE, NON-INFRINGEMENT, MERCHANTABILITY, or FITNESS FOR A
+      PARTICULAR PURPOSE. You are solely responsible for determining the
+      appropriateness of using or redistributing the Work and assume any
+      risks associated with Your exercise of permissions under this License.
+
+   8. Limitation of Liability. In no event and under no legal theory,
+      whether in tort (including negligence), contract, or otherwise,
+      unless required by applicable law (such as deliberate and grossly
+      negligent acts) or agreed to in writing, shall any Contributor be
+      liable to You for damages, including any direct, indirect, special,
+      incidental, or consequential damages of any character arising as a
+      result of this License or out of the use or inability to use the
+      Work (including but not limited to damages for loss of goodwill,
+      work stoppage, computer failure or malfunction, or any and all
+      other commercial damages or losses), even if such Contributor
+      has been advised of the possibility of such damages.
+
+   9. Accepting Warranty or Additional Liability. While redistributing
+      the Work or Derivative Works thereof, You may choose to offer,
+      and charge a fee for, acceptance of support, warranty, indemnity,
+      or other liability obligations and/or rights consistent with this
+      License. However, in accepting such obligations, You may act only
+      on Your own behalf and on Your sole responsibility, not on behalf
+      of any other Contributor, and only if You agree to indemnify,
+      defend, and hold each Contributor harmless for any liability
+      incurred by, or claims asserted against, such Contributor by reason
+      of your accepting any such warranty or additional liability.
+
+   END OF TERMS AND CONDITIONS
+
+   APPENDIX: How to apply the Apache License to your work.
+
+      To apply the Apache License to your work, attach the following
+      boilerplate notice, with the fields enclosed by brackets "[]"
+      replaced with your own identifying information. (Don't include
+      the brackets!)  The text should be enclosed in the appropriate
+      comment syntax for the file format. We also recommend that a
+      file or class name and description of purpose be included on the
+      same "printed page" as the copyright notice for easier
+      identification within third-party archives.
+
+   Copyright [yyyy] [name of copyright owner]
+
+   Licensed under the Apache License, Version 2.0 (the "License");
+   you may not use this file except in compliance with the License.
+   You may obtain a copy of the License at
+
+       http://www.apache.org/licenses/LICENSE-2.0
+
+   Unless required by applicable law or agreed to in writing, software
+   distributed under the License is distributed on an "AS IS" BASIS,
+   WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+   See the License for the specific language governing permissions and
+   limitations under the License.

README.md

-# base-app
+## 什么是 uniCloud
 
-base-app是基于uni-app和uniCloud开发的云端一体项目模板，地址：https://gitee.com/dcloud/base-app.git
+uniCloud 是 DCloud 联合阿里云、腾讯云，为开发者提供的基于 serverless 模式和 js 编程的云开发平台，更多请参考[uniCloud 文档](https://uniapp.dcloud.io/uniCloud)。
 
+## 云端一体搜索模板解决了什么问题？
 
-## 使用方式
+uniCloud 云端一体搜索模板，自带下拉候选、历史搜索、热搜。无需再开发服务器代码
 
-### 导入/下载项目后，使用HBuilderX 打开即可运行体验。
+云端一体搜索模板有以下功能点：
 
-### 用户需要绑定uniCloud服务空间，并运行云服务空间初始化向导。
+- 热词设置，可自定义，回车默认搜索热词
+- 搜索历史，本地历史，去重排序删除
+- 搜索记录，自动向云端储存搜索记录，可用于归纳搜索发现
+- 搜索发现，向用户展现热搜
+- 搜索联想，基于 uni-list 实现搜索联想列表，兼容 nvue，高性能
+- APP 端语音输入，解放双手
+- 兼容 nvue
 
-## 特点
+前后一体，兼容 nvue，只需导入插件，初始化数据库即可拥有上述功能。
 
-### 兼容多平台
+您也可以自己修改逻辑自定义数据库字段，和随意定制 UI 样式。
 
-### app开发基础功能已完成，开发者只需要关心自己的业务部分。
+## 体验步骤
 
-### 使用uniCloud云端一体化项目模板，使用openDB体系构建部分功能，方便开发者后续集成。
+1. 下载或导入示例项目，绑定一个 uniCloud 服务空间。需 HBuilderX 3.0 以上版本。
 
-## 平台支持
+2. 在项目的 uniCloud/database 目录下找到 db_init.json，对其点右键执行初始化数据库。这样会给服务空间创建 3 个表：opendb-search-log、opendb-search-hot、opendb-mall-goods。如果之前存在相同表，建议删除后重新执行数据库初始化。
 
-### app
+3. 运行示例项目到任意平台，H5、App、小程序均可。
 
-### H5
+4. 运行后首页是商品列表，上面有搜索框。点击搜索框进入搜索页面，输入待搜索的商品名称会在下方拉出候选，确认搜索后会返回商品列表页面，列表内容即为搜索结果。
 
-### 微信小程序
+5. 在项目的 uniCloud/cloudfunctions 目录下找到云函数 uni-analyse-searchhot，点右键上传到服务空间，该云函数会定时运行，统计和计算近期热搜关键字，并体现在搜索界面的热搜候选词中。
 
-### 百度小程序
+## 项目代码说明
 
-### 支付宝小程序
+### uniCloud 数据表
 
-### 头条小程序
+数据表基于 [openDB](https://gitee.com/dcloud/opendb/tree/master) 规范，它约定了一个标准用户表的表名和字段定义，并且基于 nosql 的特性，可以由开发者自行扩展字段。
 
-### QQ小程序
+本项目用到了 3 个表：
 
-## 注意事项
+- opendb-search-log：搜索日志表。每次搜索，都会将搜索词记录在该表中。[详见](https://gitee.com/dcloud/opendb/tree/master/collection/opendb-search-log)
+- opendb-search-hot：热搜表。通过其他云函数定期分析搜索日志表，提取近期热搜词，存入热搜表。[详见](https://gitee.com/dcloud/opendb/tree/master/collection/opendb-search-hot)
+- opendb-mall-goods：用于本示例演示的商品列表。实际项目中，可自行提供为需要搜索的表。[详见](https://gitee.com/dcloud/opendb/tree/master/collection/opendb-mall-goods)
 
-### 用户需要自行开通一键登录功能
+这些表在 uniCloud Web 控制台中新建表的界面，均可以选择。
 
-*XMind - Trial Version*
\ No newline at end of file
+### 云函数
+
+- `uni-analyse-searchhot`
+  > - 这是一个定时运行的跑批云函数。用于从搜索日志表中归纳热搜。默认归纳最近`7天`搜索记录，截取其中`10`条，可在云函数中进行修改
+  > - 在`package.json`中有其触发器配置，默认`每2小时`运行一次，可在配置中修改。部署在云端后，也可以在 web 控制台修改。定时触发器使用[cron 表达式](https://uniapp.dcloud.net.cn/uniCloud/trigger)
+  > - _`注意`_ 该云函数本地运行不生效，需要上传部署至云端
+
+### 前端页面
+
+首页是商品列表页面，点击顶部的搜索框，进入搜索页面。
+
+前端页面基于 [unicloud-db](https://uniapp.dcloud.net.cn/uniCloud/unicloud-db) 组件操作数据库。
+
+商品列表页面是基于 [云端一体商品列表模板](https://ext.dcloud.net.cn/plugin?id=2651) 改进而来。
+
+页面示例搜索的是“opendb-mall-goods”表，可以在页面中的clientDB组件中修改collection属性，指向新的数据表进行搜索。
\ No newline at end of file

common/appInit.js

+import checkUpdate from '@/uni_modules/uni-upgrade-center-app/utils/check-update';
+export default function (){
+	
+	// 初始化appVersion
+	initAppVersion();
+	
+	// 检查更新
+	checkUpdate();
+}
+
+function initAppVersion(){
+	let appid = plus.runtime.appid;
+	plus.runtime.getProperty(appid ,(wgtInfo) => {
+		 wgtInfo.version 
+		 let appVersion = plus.runtime;
+		 getApp({allowDefault: true}).appVersion = {
+			 appid,
+			 version:appVersion,
+			 wgtVersion:wgtInfo,
+			 finall:appVersion.versionCode > wgtInfo.versionCode ? appVersion : wgtInfo
+		 }
+	});
+}
\ No newline at end of file

common/dc-push/push.js

+
+/**
+ * 判断Push是否开启
+ */
+function isTurnedOnPush(){
+	var isOn = undefined;
+	try{
+		if('iOS' == plus.os.name){
+			var types = 0;
+			var app = plus.ios.invoke('UIApplication', 'sharedApplication');
+			var settings = plus.ios.invoke(app, 'currentUserNotificationSettings');
+			if(settings){
+				types = settings.plusGetAttribute('types');
+				plus.ios.deleteObject(settings);
+			}else{
+				types = plus.ios.invoke(app, 'enabledRemoteNotificationTypes');
+			}
+			plus.ios.deleteObject(app);
+			isOn = (0!=types);
+		}else{
+			var main = plus.android.runtimeMainActivity();
+			var manager = plus.android.invoke('com.igexin.sdk.PushManager', 'getInstance');
+			isOn = plus.android.invoke(manager, 'isPushTurnedOn', main);
+		}
+	}catch(e){
+		console.error('exception in isTurnedOnPush@dc-push!!');
+	}
+	return isOn;
+}
+
+/**
+ * 打开Push
+ * Android平台 - 打开个推（UniPush）的推送通道
+ * iOS平台 - 如果开启通知功能，则打开应用的设置页面引导用户开启通知
+ */
+function turnOnPush(){
+	try{
+		if('iOS' == plus.os.name){
+			// 如果设置中没有开启通知，则打开应用的设置界面
+			if(!isTurnedOnPush()){
+				settingInIos();
+			}
+		}else{
+			var main = plus.android.runtimeMainActivity();
+			var manager = plus.android.invoke('com.igexin.sdk.PushManager', 'getInstance');
+			plus.android.invoke(manager, 'turnOnPush', main);
+		}
+	}catch(e){
+		console.error('exception in turnOnPush@dc-push!!');
+	}
+}
+
+/**
+ * 关闭Push
+ * Android平台 - 关闭个推（UniPush）的推送通道
+ * iOS平台 - 不做任何操作
+ */
+function trunOffPush(){
+	try{
+		if('iOS' == plus.os.name){
+			// 这里不做任何操作（不引导用户关闭应用的推送能力），应该通知业务服务器不向此用户下发推送消息
+		}else{
+			var main = plus.android.runtimeMainActivity();
+			var manager = plus.android.invoke('com.igexin.sdk.PushManager', 'getInstance');
+			plus.android.invoke(manager, 'turnOffPush', main);
+		}
+	}catch(e){
+		console.error('exception in trunOffPush@dc-push!!');
+	}
+}
+
+/**
+ * iOS平台打开应用设置界面
+ */
+function settingInIos(){
+	try{
+	if('iOS' == plus.os.name){
+		var app = plus.ios.invoke('UIApplication', 'sharedApplication');
+		var setting = plus.ios.invoke('NSURL', 'URLWithString:', 'app-settings:');
+		plus.ios.invoke(app, 'openURL:', setting);
+		plus.ios.deleteObject(setting);
+		plus.ios.deleteObject(app);
+	}
+	}catch(e){
+		console.error('exception in settingInIos@dc-push!!');
+	}
+}
+/**
+ * android打开应用设置页面
+ */
+function settingInAndroid(){
+	if (uni.getSystemInfoSync().platform == "android") {
+		var main = plus.android.runtimeMainActivity();
+		var Intent = plus.android.importClass('android.content.Intent');  
+		var Settings = plus.android.importClass('android.provider.Settings');  
+		var intent = new Intent(Settings.ACTION_APPLICATION_DETAILS_SETTINGS);
+		// 安卓跳转设置页面详细查看(https://ask.dcloud.net.cn/question/14732)
+		main.startActivity(intent);
+	}
+}
+/**
+ * 打开应用设置界面
+ */
+function setting(){
+	if (uni.getSystemInfoSync().platform == "ios") {
+		settingInIos();
+	}
+	if (uni.getSystemInfoSync().platform == "android") {
+		settingInAndroid();
+	}
+}
+
+module.exports = {
+	isOn: isTurnedOnPush,
+	iosSetting: settingInIos,
+	on: turnOnPush,
+	off: trunOffPush,
+	setting:setting
+}

components/app-update/app-update.vue

+<template>
+	<uni-popup ref="popup" type="center" :maskClick="false">
+		<view class="update-wrap">
+			<view class="white-bg"></view>
+			<image src="@/static/images/top_2.png" class="updateCon-img"></image>
+			<view class="updateCon-top">
+				<!-- 发现新版本 -->
+				<text class="update-top-title">发现新版本</text>
+				<text class="update-top-version">V{{update_info.version}}</text>
+			</view>
+
+			<text class="uodate-content" v-if="!update_ing">更新内容:{{update_info.version_note}}</text>
+			<text class="current-version" v-if="!update_ing">当前版本:V{{version}}</text>
+
+			<view class="update-btn" v-if="!update_ing">
+				<view class="update-btn-item update-btn-left" @click="up_close">
+					<!-- 残忍拒绝 -->
+					<text class="update-btn-item-text ">残忍拒绝</text>
+				</view>
+				<view class="update-btn-item" @click="nowUpdate">
+					<!-- 立即升级 -->
+					<text class="update-btn-item-text text-bule">立即升级</text>
+				</view>
+			</view>
+			<!-- 下载进度 -->
+			<view class="sche-wrap" v-if="update_ing">
+				<!-- 更新包下载中 -->
+				<text class="sche-wrap-text">更新包下载中...</text>
+				<view class="sche-bg">
+					<view class="sche-bg-jindu" :style="lengthWidth">
+						<view class="sche-bg-round">
+							<text class="sche-bg-round-text" v-if="schedule">{{schedule}}%</text>
+							<text class="sche-bg-round-text" v-else>{{(downloadedSize/1024/1024 ).toFixed(2)}}M</text>
+						</view>
+					</view>
+				</view>
+			</view>
+		</view>
+	</uni-popup>
+
+</template>
+
+<script>
+	import uniPopup from '@/components/uni-popup/uni-popup.vue'
+	export default {
+		data() {
+			return {
+				platform: "", //ios or android
+				version: "1.0.0", //当前软件版本
+				is_update: false, // 是否更新
+				is_reques: false, //是否请求中
+
+				update_info: {
+					"type": "1", //1分发平台更新  2安装包/升级包更新
+					"version_note": "", //ios更新备注
+					"version": "1.0.0", //ios版本号
+					"download_url": "", //ios更新新链接
+				},
+
+				is_update: false,
+				schedule: 0,
+				update_ing: false, //点击升级
+				is_down: false,
+				downloadedSize: 0,
+			};
+		},
+		components:{uniPopup},
+		mounted() {
+			this.getSystemInfo() //获取系统新
+		},
+		computed: {
+			// 下载进度计算
+			lengthWidth: function() {
+				return {
+					width: this.schedule * 480 / 100 + "rpx"
+				}
+			}
+		},
+		methods: {
+			// 获取系统信息
+			getSystemInfo() {
+				let vm = this;
+				// 获取手机系统信息
+				uni.getSystemInfo({
+					success: function(res) {
+						vm.platform = res.platform //ios  or android
+					}
+				});
+				// 获取版本号
+				plus.runtime.getProperty(plus.runtime.appid, function(inf) {
+					vm.version = inf.version
+				});
+				vm.getUpdateInfo(); //获取更新信息
+			},
+
+			// 获取线上版本信息
+			getUpdateInfo() {
+				let vm = this;
+				uni.request({
+					url: 'http://ui.ishenghuo.org.cn/api/version.php', //仅为示例，并非真实接口地址。
+					success: (res) => {
+						let data = res.data.data;
+						if (vm.platform == "ios") {
+							vm.update_info.type = data.ios_type
+							vm.update_info.version_note = data.ios_version_note
+							vm.update_info.version = data.ios_version
+							vm.update_info.download_url = data.ios_download_url
+						} else if (vm.platform == "android") {
+							vm.update_info.type = data.android_type
+							vm.update_info.version_note = data.android_version_note
+							vm.update_info.version = data.android_version
+							vm.update_info.download_url = data.android_download_url
+						} else {
+							return false
+						}
+						vm.checkUpdate(); ///检查是否更新
+					}
+				});
+			},
+			// 检查是否更新
+			checkUpdate() {
+				let vm = this;
+				vm.is_update = vm.compareVersion(vm.version, vm.update_info.version); // 检查是否升级
+				if (vm.is_update) {
+					vm.$refs.popup.open() //显示升级弹窗
+				} else {
+					// 不更新，根据需要做处理
+				}
+			},
+
+			// 取消更新
+			up_close() {
+				// console.log('点击取消')
+				plus.os.name == "Android" ? plus.runtime.quit() : plus.ios.import("UIApplication").sharedApplication().performSelector("exit");
+			},
+			// 立即更新
+			nowUpdate() {
+				let vm = this;
+				if(vm.is_reques){
+					return false   //如果正在下载就停止操作
+				}else{
+					vm.is_reques = true
+				}
+				console.log(111111);
+				if (vm.update_info.type == 1) {
+					// 分发平台更新  //调用浏览器打开链接或者分发平台
+					plus.runtime.openURL(vm.update_info.download_url, function() {
+						plus.nativeUI.toast("打开错误");
+					});
+
+					setTimeout(function() {
+						plus.runtime.quit(); //五秒后关闭app
+					}, 5000)
+				} else if (vm.update_info.type == 2) {
+					// 安装包/升级包更新
+					vm.download_wgt()
+				}
+
+			},
+			// 下载升级资源包
+			download_wgt() {
+				let vm = this;
+				plus.nativeUI.showWaiting("下载更新文件..."); //下载更新文件...
+				let options = {
+					method: "POST"
+				};
+
+				let dtask = plus.downloader.createDownload(vm.update_info.download_url, options);
+				dtask.addEventListener("statechanged", function(task, status) {
+					switch (task.state) {
+						case 1: // 开始  
+							break;
+						case 2: //已连接到服务器  
+							vm.update_ing = true;
+							break;
+						case 3: // 已接收到数据  
+							vm.downloadedSize = task.downloadedSize;
+							let totalSize = 0;
+							if (task.totalSize) {
+								totalSize = task.totalSize //服务器须返回正确的content-length才会有长度
+							}
+							vm.schedule = parseInt(100 * task.downloadedSize / totalSize);
+							break;
+						case 4:
+							vm.installWgt(task.filename); // 安装wgt包  
+							break;
+					}
+				});
+				dtask.start();
+			},
+
+			// 安装文件
+			installWgt(path) {
+				let vm = this;
+				plus.nativeUI.showWaiting("安装更新文件..."); //安装更新文件...
+				plus.runtime.install(path, {}, function() {
+					plus.nativeUI.closeWaiting();
+					// 应用资源更新完成！
+					plus.nativeUI.alert("应用资源更新完成！", function() {
+						plus.runtime.restart();
+					});
+				}, function(e) {
+					plus.nativeUI.closeWaiting();
+					// 安装更新文件失败
+					plus.nativeUI.alert("安装更新文件失败[" + e.code + "]：" + e.message);
+				});
+			},
+			// 对比版本号
+			compareVersion(ov, nv) {
+				if (!ov || !nv || ov == "" || nv == "") {
+					return false;
+				}
+				let b = false,
+					ova = ov.split(".", 4),
+					nva = nv.split(".", 4);
+				for (let i = 0; i < ova.length && i < nva.length; i++) {
+					let so = ova[i],
+						no = parseInt(so),
+						sn = nva[i],
+						nn = parseInt(sn);
+					if (nn > no || sn.length > so.length) {
+						return true;
+					} else if (nn < no) {
+						return false;
+					}
+				}
+				if (nva.length > ova.length && 0 == nv.indexOf(ov)) {
+					return true;
+				} else {
+					return false;
+				}
+			},
+		}
+
+	}
+</script>
+
+<style scoped>
+	/*#ifndef APP-NVUE*/
+	view {
+		display: flex;
+		flex-direction: column;
+		box-sizing: border-box;
+	}
+	/*#endif*/
+
+	.updateBox {
+		background-color: rgba(0, 0, 0, 0.6);
+		z-index: 1000;
+		position: fixed;
+		right: 0px;
+		top: 0;
+		left: 0;
+		bottom: 0;
+		align-items: center;
+		justify-content: center;
+	}
+
+	.update-wrap {
+		width: 580rpx;
+		height: 500rpx;
+		border-radius: 10px;
+		padding-bottom: 0px;
+		position: relative;
+	}
+
+	.white-bg {
+		position: absolute;
+		top: 60rpx;
+		left: 0px;
+		width: 580rpx;
+		height: 440rpx;
+		background-color: #ffffff;
+		border-bottom-left-radius: 30rpx;
+		border-bottom-right-radius: 30rpx;
+	}
+
+	.updateCon-img {
+		position: absolute;
+		top: 0rpx;
+		left: 0px;
+		width: 580rpx;
+		height: 440rpx;
+	}
+
+	.updateCon-top {
+		padding: 70rpx 50rpx;
+		/*#ifndef APP-NVUE*/
+		z-index: 1;
+		/*#endif*/
+	}
+
+	.update-top-title {
+		color: #fff;
+		font-size: 36rpx;
+		font-weight: bold;
+	}
+
+	.update-top-version {
+		color: #fff;
+		font-size: 28rpx;
+		margin-top: 10rpx;
+	}
+
+	.uodate-content {
+		color: #333;
+		font-size: 18px;
+		padding: 0px 50rpx;
+		margin-top: 80rpx;
+		/*#ifndef APP-NVUE*/
+		z-index: 1;
+		/*#endif*/
+	}
+
+	.current-version {
+		text-align: center;
+		margin-top: 10rpx;
+		font-size: 24rpx;
+		color: #666;
+		/*#ifndef APP-NVUE*/
+		z-index: 1;
+		/*#endif*/
+	}
+
+	.update-btn {
+		position: absolute;
+		left: 0px;
+		bottom: 0px;
+		width: 580rpx;
+		height: 80rpx;
+		padding: 0px 50rpx;
+
+		align-items: center;
+		flex-direction: row;
+		border-top-color: #e7e7e7;
+		border-top-style: solid;
+		border-top-width: 1px;
+
+		background-color: #fff;
+		border-bottom-left-radius: 30rpx;
+		border-bottom-right-radius: 30rpx;
+	}
+
+	.update-btn-item {
+		width: 240rpx;
+		height: 80rpx;
+		justify-content: center;
+		align-items: center;
+	}
+
+	.update-btn-left {
+		border-right-color: #e7e7e7;
+		border-right-style: solid;
+		border-right-width: 1px;
+	}
+
+	.update-btn-item-text {
+		text-align: center;
+		font-size: 28rpx;
+		color: #666;
+	}
+
+	.text-bule {
+		color: #045FCF;
+	}
+
+	.sche-wrap {
+		padding: 0px 50rpx 0rpx;
+		height: 100rpx;
+		align-items: center;
+		border-bottom-left-radius: 30rpx;
+		border-bottom-right-radius: 30rpx;
+		flex: 1;
+		justify-content: flex-end;
+	}
+
+	.sche-wrap-text {
+		font-size: 24rpx;
+		color: #666;
+		margin-bottom: 20rpx;
+	}
+
+	.sche-bg {
+		position: relative;
+		background-color: #ccc;
+		height: 20rpx;
+		border-radius: 100px;
+		width: 480rpx;
+		margin-bottom: 30rpx;
+	}
+
+	.sche-bg-jindu {
+		position: absolute;
+		left: 0px;
+		top: 0px;
+		height: 20rpx;
+		background-color: #5775e7;
+		border-radius: 100px;
+	}
+
+	.sche-bg-round {
+		position: absolute;
+		left: 100%;
+		height: 24rpx;
+		width: 24rpx;
+		background-color: #fff;
+		border-color: #fff;
+		border-style: solid;
+		border-width: 10px;
+		border-radius: 100px;
+		transform: translateX(-20rpx) translateY(-10rpx);
+
+	}
+
+	.sche-bg-round-text {
+		font-size: 24rpx;
+		width: 120rpx;
+		text-align: center;
+		transform: translateX(-50rpx) translateY(-40rpx);
+		color: #5775e7;
+	}
+
+	.uodate-close {
+		/* display: flex; */
+		flex-direction: row;
+		justify-content: center;
+		padding-top: 50rpx;
+	}
+
+	.uodate-close-img {
+		width: 80rpx;
+		height: 80rpx;
+	}
+</style>

components/uni-popup/message.js

+export default {
+	created() {
+		if (this.type === 'message') {
+			// 不显示遮罩
+			this.maskShow = false 
+			// 获取子组件对象
+			this.childrenMsg = null
+		}
+	},
+	methods: {
+		customOpen() {
+			if (this.childrenMsg) {
+				this.childrenMsg.open()
+			}
+		},
+		customClose() {
+			if (this.childrenMsg) {
+				this.childrenMsg.close()
+			}
+		}
+	}
+}

components/uni-popup/popup.js

+import message from './message.js';
+// 定义 type 类型:弹出类型：top/bottom/center
+const config = {
+	// 顶部弹出
+	top:'top',
+	// 底部弹出
+	bottom:'bottom',
+	// 居中弹出
+	center:'center',
+	// 消息提示
+	message:'top',
+	// 对话框
+	dialog:'center',
+	// 分享
+	share:'bottom',
+}
+
+export default {
+	data(){
+		return {
+			config:config
+		}
+	},
+	mixins: [message]
+}

components/uni-popup/share.js

+export default {
+	created() {
+		if (this.type === 'share') {
+			// 关闭点击
+			this.mkclick = false
+		}
+	},
+	methods: {
+		customOpen() {
+			console.log('share 打开了');
+		},
+		customClose() {
+			console.log('share 关闭了');
+		}
+	}
+}

components/uni-popup/uni-popup.vue

+<template>
+	<view v-if="showPopup" class="uni-popup" :class="[popupstyle]" @touchmove.stop.prevent="clear">
+		<uni-transition v-if="maskShow" class="uni-mask--hook" :mode-class="['fade']" :styles="maskClass" :duration="duration" :show="showTrans" @click="onTap" />
+		<uni-transition :mode-class="ani" :styles="transClass" :duration="duration" :show="showTrans" @click="onTap">
+			<view class="uni-popup__wrapper-box" @click.stop="clear">
+				<slot />
+			</view>
+		</uni-transition>
+	</view>
+</template>
+
+<script>
+	import uniTransition from '../uni-transition/uni-transition.vue'
+	import popup from './popup.js'
+	/**
+	 * PopUp 弹出层
+	 * @description 弹出层组件，为了解决遮罩弹层的问题
+	 * @tutorial https://ext.dcloud.net.cn/plugin?id=329
+	 * @property {String} type = [top|center|bottom] 弹出方式
+	 * 	@value top 顶部弹出
+	 * 	@value center 中间弹出
+	 * 	@value bottom 底部弹出
+	 * 	@value message 消息提示
+	 * 	@value dialog 对话框
+	 * 	@value share 底部分享示例
+	 * @property {Boolean} animation = [ture|false] 是否开启动画
+	 * @property {Boolean} maskClick = [ture|false] 蒙版点击是否关闭弹窗
+	 * @event {Function} change 打开关闭弹窗触发，e={show: false}
+	 */
+
+	export default {
+		name: 'UniPopup',
+		components: {
+			uniTransition
+		},
+		props: {
+			// 开启动画
+			animation: {
+				type: Boolean,
+				default: true
+			},
+			// 弹出层类型，可选值，top: 顶部弹出层；bottom：底部弹出层；center：全屏弹出层
+			// message: 消息提示 ; dialog : 对话框
+			type: {
+				type: String,
+				default: 'center'
+			},
+			// maskClick
+			maskClick: {
+				type: Boolean,
+				default: true
+			}
+		},
+		provide() {
+			return {
+				popup: this
+			}
+		},
+		mixins: [popup],
+		watch: {
+			/**
+			 * 监听type类型
+			 */
+			type: {
+				handler: function(newVal) {
+					this[this.config[newVal]]()
+				},
+				immediate: true
+			},
+			/**
+			 * 监听遮罩是否可点击
+			 * @param {Object} val
+			 */
+			maskClick: {
+				handler: function(val) {
+					this.mkclick = val
+				},
+				immediate: true
+			}
+		},
+		data() {
+			return {
+				duration: 300,
+				ani: [],
+				showPopup: false,
+				showTrans: false,
+				maskClass: {
+					'position': 'fixed',
+					'bottom': 0,
+					'top': 0,
+					'left': 0,
+					'right': 0,
+					'backgroundColor': 'rgba(0, 0, 0, 0.4)'
+				},
+				transClass: {
+					'position': 'fixed',
+					'left': 0,
+					'right': 0,
+				},
+				maskShow: true,
+				mkclick: true,
+				popupstyle: 'top'
+			}
+		},
+		created() {
+			this.mkclick = this.maskClick
+			if (this.animation) {
+				this.duration = 300
+			} else {
+				this.duration = 0
+			}
+		},
+		methods: {
+			clear(e) {
+				// TODO nvue 取消冒泡
+				e.stopPropagation()
+			},
+			open() {
+				this.showPopup = true
+				this.$nextTick(() => {
+					new Promise(resolve => {
+						clearTimeout(this.timer)
+						this.timer = setTimeout(() => {
+							this.showTrans = true
+							// fixed by mehaotian 兼容 app 端
+							this.$nextTick(() => {
+								resolve();
+							})
+						}, 50);
+					}).then(res => {
+						// 自定义打开事件
+						clearTimeout(this.msgtimer)
+						this.msgtimer = setTimeout(() => {
+							this.customOpen && this.customOpen()
+						}, 100)
+						this.$emit('change', {
+							show: true,
+							type: this.type
+						})
+					})
+				})
+			},
+			close(type) {
+				this.showTrans = false
+				this.$nextTick(() => {
+					this.$emit('change', {
+						show: false,
+						type: this.type
+					})
+					clearTimeout(this.timer)
+					// 自定义关闭事件
+					this.customOpen && this.customClose()
+					this.timer = setTimeout(() => {
+						this.showPopup = false
+					}, 300)
+				})
+			},
+			onTap() {
+				if (!this.mkclick) return
+				this.close()
+			},
+			/**
+			 * 顶部弹出样式处理
+			 */
+			top() {
+				this.popupstyle = 'top'
+				this.ani = ['slide-top']
+				this.transClass = {
+					'position': 'fixed',
+					'left': 0,
+					'right': 0,
+				}
+			},
+			/**
+			 * 底部弹出样式处理
+			 */
+			bottom() {
+				this.popupstyle = 'bottom'
+				this.ani = ['slide-bottom']
+				this.transClass = {
+					'position': 'fixed',
+					'left': 0,
+					'right': 0,
+					'bottom': 0
+				}
+			},
+			/**
+			 * 中间弹出样式处理
+			 */
+			center() {
+				this.popupstyle = 'center'
+				this.ani = ['zoom-out', 'fade']
+				this.transClass = {
+					'position': 'fixed',
+					/* #ifndef APP-NVUE */
+					'display': 'flex',
+					'flexDirection': 'column',
+					/* #endif */
+					'bottom': 0,
+					'left': 0,
+					'right': 0,
+					'top': 0,
+					'justifyContent': 'center',
+					'alignItems': 'center'
+				}
+			}
+		}
+	}
+</script>
+<style scoped>
+	@charset "UTF-8";
+
+	.uni-popup {
+		position: fixed;
+		/* #ifndef APP-NVUE */
+		z-index: 99;
+		/* #endif */
+	}
+
+	.uni-popup__mask {
+		position: absolute;
+		top: 0;
+		bottom: 0;
+		left: 0;
+		right: 0;
+		background-color: rgba(0, 0, 0, 0.4);
+		opacity: 0;
+	}
+
+	.mask-ani {
+		transition-property: opacity;
+		transition-duration: 0.2s;
+	}
+
+	.uni-top-mask {
+		opacity: 1;
+	}
+
+	.uni-bottom-mask {
+		opacity: 1;
+	}
+
+	.uni-center-mask {
+		opacity: 1;
+	}
+
+	.uni-popup__wrapper {
+		/* #ifndef APP-NVUE */
+		display: block;
+		/* #endif */
+		position: absolute;
+	}
+
+	.top {
+		/* #ifdef H5 */
+		top: var(--window-top);
+		/* #endif */
+		/* #ifndef H5 */
+		top: 0;
+		/* #endif */
+	}
+
+	.bottom {
+		bottom: 0;
+	}
+
+	.uni-popup__wrapper-box {
+		/* #ifndef APP-NVUE */
+		display: block;
+		/* #endif */
+		position: relative;
+		/* iphonex 等安全区设置，底部安全区适配 */
+		/* #ifndef APP-NVUE */
+		padding-bottom: constant(safe-area-inset-bottom);
+		padding-bottom: env(safe-area-inset-bottom);
+		/* #endif */
+	}
+
+	.content-ani {
+		transition-property: transform, opacity;
+		transition-duration: 0.2s;
+	}
+
+	.uni-top-content {
+		transform: translateY(0);
+	}
+
+	.uni-bottom-content {
+		transform: translateY(0);
+	}
+
+	.uni-center-content {
+		transform: scale(1);
+		opacity: 1;
+	}
+</style>
\ No newline at end of file

components/uni-transition/uni-transition.vue

+<template>
+	<view v-if="isShow" ref="ani" class="uni-transition" :class="[ani.in]" :style="'transform:' +transform+';'+stylesObject" @click="change">
+		<slot></slot>
+	</view>
+</template>
+
+<script>
+	// #ifdef APP-NVUE
+	const animation = uni.requireNativePlugin('animation');
+	// #endif
+	/**
+	 * Transition 过渡动画
+	 * @description 简单过渡动画组件
+	 * @tutorial https://ext.dcloud.net.cn/plugin?id=985
+	 * @property {Boolean} show = [false|true] 控制组件显示或隐藏
+	 * @property {Array} modeClass = [fade|slide-top|slide-right|slide-bottom|slide-left|zoom-in|zoom-out] 过渡动画类型
+	 *  @value fade 渐隐渐出过渡
+	 *  @value slide-top 由上至下过渡
+	 *  @value slide-right 由右至左过渡
+	 *  @value slide-bottom 由下至上过渡
+	 *  @value slide-left 由左至右过渡
+	 *  @value zoom-in 由小到大过渡
+	 *  @value zoom-out 由大到小过渡
+	 * @property {Number} duration 过渡动画持续时间
+	 * @property {Object} styles 组件样式，同 css 样式，注意带’-‘连接符的属性需要使用小驼峰写法如：`backgroundColor:red`
+	 */
+	export default {
+		name: 'uniTransition',
+		props: {
+			show: {
+				type: Boolean,
+				default: false
+			},
+			modeClass: {
+				type: Array,
+				default () {
+					return []
+				}
+			},
+			duration: {
+				type: Number,
+				default: 300
+			},
+			styles: {
+				type: Object,
+				default () {
+					return {}
+				}
+			}
+		},
+		data() {
+			return {
+				isShow: false,
+				transform: '',
+				ani: {
+					in: '',
+					active: ''
+				}
+			};
+		},
+		watch: {
+			show: {
+				handler(newVal) {
+					if (newVal) {
+						this.open()
+					} else {
+						this.close()
+					}
+				},
+				immediate: true
+			}
+		},
+		computed: {
+			stylesObject() {
+				let styles = {
+					...this.styles,
+					'transition-duration': this.duration / 1000 + 's'
+				}
+				let transfrom = ''
+				for (let i in styles) {
+					let line = this.toLine(i)
+					transfrom += line + ':' + styles[i] + ';'
+				}
+				return transfrom
+			}
+		},
+		created() {
+			// this.timer = null
+			// this.nextTick = (time = 50) => new Promise(resolve => {
+			// 	clearTimeout(this.timer)
+			// 	this.timer = setTimeout(resolve, time)
+			// 	return this.timer
+			// });
+		},
+		methods: {
+			change() {
+				this.$emit('click', {
+					detail: this.isShow
+				})
+			},
+			open() {
+				clearTimeout(this.timer)
+				this.isShow = true
+				this.transform = ''
+				this.ani.in = ''
+				for (let i in this.getTranfrom(false)) {
+					if (i === 'opacity') {
+						this.ani.in = 'fade-in'
+					} else {
+						this.transform += `${this.getTranfrom(false)[i]} `
+					}
+				}
+				this.$nextTick(() => {
+					setTimeout(() => {
+						this._animation(true)
+					}, 50)
+				})
+
+			},
+			close(type) {
+				clearTimeout(this.timer)
+				this._animation(false)
+			},
+			_animation(type) {
+				let styles = this.getTranfrom(type)
+				// #ifdef APP-NVUE
+				if (!this.$refs['ani']) return
+				animation.transition(this.$refs['ani'].ref, {
+					styles,
+					duration: this.duration, //ms
+					timingFunction: 'ease',
+					needLayout: false,
+					delay: 0 //ms
+				}, () => {
+					if (!type) {
+						this.isShow = false
+					}
+					this.$emit('change', {
+						detail: this.isShow
+					})
+				})
+				// #endif
+				// #ifndef APP-NVUE
+				this.transform = ''
+				for (let i in styles) {
+					if (i === 'opacity') {
+						this.ani.in = `fade-${type?'out':'in'}`
+					} else {
+						this.transform += `${styles[i]} `
+					}
+				}
+				this.timer = setTimeout(() => {
+					if (!type) {
+						this.isShow = false
+					}
+					this.$emit('change', {
+						detail: this.isShow
+					})
+
+				}, this.duration)
+				// #endif
+
+			},
+			getTranfrom(type) {
+				let styles = {
+					transform: ''
+				}
+				this.modeClass.forEach((mode) => {
+					switch (mode) {
+						case 'fade':
+							styles.opacity = type ? 1 : 0
+							break;
+						case 'slide-top':
+							styles.transform += `translateY(${type?'0':'-100%'}) `
+							break;
+						case 'slide-right':
+							styles.transform += `translateX(${type?'0':'100%'}) `
+							break;
+						case 'slide-bottom':
+							styles.transform += `translateY(${type?'0':'100%'}) `
+							break;
+						case 'slide-left':
+							styles.transform += `translateX(${type?'0':'-100%'}) `
+							break;
+						case 'zoom-in':
+							styles.transform += `scale(${type?1:0.8}) `
+							break;
+						case 'zoom-out':
+							styles.transform += `scale(${type?1:1.2}) `
+							break;
+					}
+				})
+				return styles
+			},
+			_modeClassArr(type) {
+				let mode = this.modeClass
+				if (typeof(mode) !== "string") {
+					let modestr = ''
+					mode.forEach((item) => {
+						modestr += (item + '-' + type + ',')
+					})
+					return modestr.substr(0, modestr.length - 1)
+				} else {
+					return mode + '-' + type
+				}
+			},
+			// getEl(el) {
+			// 	console.log(el || el.ref || null);
+			// 	return el || el.ref || null
+			// },
+			toLine(name) {
+				return name.replace(/([A-Z])/g, "-$1").toLowerCase();
+			}
+		}
+	}
+</script>
+
+<style scoped>
+	.uni-transition {
+		transition-timing-function: ease;
+		transition-duration: 0.3s;
+		transition-property: transform, opacity;
+	}
+
+	.fade-in {
+		opacity: 0;
+	}
+
+	.fade-active {
+		opacity: 1;
+	}
+
+	.slide-top-in {
+		/* transition-property: transform, opacity; */
+		transform: translateY(-100%);
+	}
+
+	.slide-top-active {
+		transform: translateY(0);
+		/* opacity: 1; */
+	}
+
+	.slide-right-in {
+		transform: translateX(100%);
+	}
+
+	.slide-right-active {
+		transform: translateX(0);
+	}
+
+	.slide-bottom-in {
+		transform: translateY(100%);
+	}
+
+	.slide-bottom-active {
+		transform: translateY(0);
+	}
+
+	.slide-left-in {
+		transform: translateX(-100%);
+	}
+
+	.slide-left-active {
+		transform: translateX(0);
+		opacity: 1;
+	}
+
+	.zoom-in-in {
+		transform: scale(0.8);
+	}
+
+	.zoom-out-active {
+		transform: scale(1);
+	}
+
+	.zoom-out-in {
+		transform: scale(1.2);
+	}
+</style>
\ No newline at end of file

pages.json

@@ -52,7 +52,78 @@
 		"style":{
 			"navigationBarTitleText":"注册"
 		}
-	}],
+	},{
+		"path":"pages/uni-feedback/uni-feedback",
+		"style":{
+			"navigationBarTitleText":"问题反馈"
+		}
+	}    ,{
+            "path" : "pages/about/about",
+            "style" :                                                                                    
+            {
+                "navigationBarTitleText": "关于"
+            }
+            
+        },{
+            "path" : "pages/agree-list/agree-list",
+            "style" :                                                                                    
+            {
+                "navigationBarTitleText": "政策与协议"
+            }
+            
+        }
+        ,{
+            "path" : "pages/agree-list/privacy/privacy",
+            "style" :                                                                                    
+            {
+                "navigationBarTitleText": "隐私政策"
+            }
+            
+        }
+        ,{
+            "path" : "pages/agree-list/service/service",
+            "style" :                                                                                    
+            {
+                "navigationBarTitleText": "服务协议"
+            }
+            
+        },{
+			"path": "uni_modules/uni-upgrade-center-app/pages/upgrade-popup",
+			"style": {
+				"disableScroll": true,
+				"app-plus": {
+					"backgroundColorTop": "transparent",
+					"background": "transparent",
+					"titleNView": false,
+					"scrollIndicator": false,
+					"popGesture": "none",
+					"animationType": "fade-in",
+					"animationDuration": 200
+
+				}
+			}
+		}
+        ,{
+            "path" : "pages/settings/settings",
+            "style" :                                                                                    
+            {
+                "navigationBarTitleText": "设置"
+            }
+            
+        }
+        ,{
+            "path" : "pages/ucenter/edit/edit",
+            "style" :                                                                                    
+            {
+                "navigationBarTitleText": "编辑资料"
+            }
+        },{
+			"path":"pages/ucenter/edit/uploadCutImageToUnicloud",
+			"style":{
+				"navigationStyle":"custom"
+			}
+		}
+    ],
 	"globalStyle": {
 		"navigationBarTextStyle": "black",
 		"navigationBarTitleText": "base-app",

pages/about/about.vue

+<template>
+	<view class="about">
+		<view class="content">
+			<view class="qrcode">
+				<image src="https://img.cdn.aliyun.dcloud.net.cn/guide/uniapp/app_download.png" @longtap="save"></image>
+				<text class="tip">扫码体验uni-app</text>
+			</view>
+			<view class="desc">
+				<text class="code">uni-app</text>
+				是一个使用 <text class="code">Vue.js</text> 开发跨平台应用的前端框架。
+			</view>
+			<view class="source">
+				<view class="title">本示例源码获取方式：</view>
+				<view class="source-list">
+					<view class="source-cell">
+						<text space="nbsp">1. </text>
+						<text>下载 HBuilderX，新建 uni-app 项目时选择 <text class="code">Hello uni-app</text> 模板。</text>
+					</view>
+					<view class="source-cell">
+						<text space="nbsp">2. </text>
+						<u-link class="link" :href="'https://github.com/dcloudio/hello-uniapp'" :text="'https://github.com/dcloudio/hello-uniapp'"></u-link>
+					</view>
+				</view>
+			</view>
+			<!-- #ifdef APP-PLUS -->
+			<button type="primary" @click="share">分享</button>
+			<!-- #endif -->
+		</view>
+		<!-- #ifdef APP-PLUS -->
+		<view class="version">
+			当前版本：{{version}}
+		</view>
+		<!-- #endif -->
+	</view>
+</template>
+
+<script>
+	export default {
+		data() {
+			return {
+				providerList: [],
+				version: ''
+			}
+		},
+		onLoad() {
+			// #ifdef APP-PLUS
+			this.version = plus.runtime.version;
+			uni.getProvider({
+				service: 'share',
+				success: (result) => {
+					const data = [];
+					for (let i = 0; i < result.provider.length; i++) {
+						switch (result.provider[i]) {
+							case 'weixin':
+								data.push({
+									name: '分享到微信好友',
+									id: 'weixin'
+								});
+								data.push({
+									name: '分享到微信朋友圈',
+									id: 'weixin',
+									type: 'WXSenceTimeline'
+								});
+								break;
+							case 'qq':
+								data.push({
+									name: '分享到QQ',
+									id: 'qq'
+								});
+								break;
+							default:
+								break;
+						}
+					}
+					this.providerList = data;
+				},
+				fail: (error) => {
+					console.log('获取分享通道失败' + JSON.stringify(error));
+				}
+			});
+			// #endif
+		},
+		methods: {
+			// #ifdef APP-PLUS
+			save() {
+				uni.showActionSheet({
+					itemList: ['保存图片到相册'],
+					success: () => {
+						plus.gallery.save('https://img.cdn.aliyun.dcloud.net.cn/guide/uniapp/app_download.png', function() {
+							uni.showToast({
+								title: '保存成功',
+								icon: 'none'
+							});
+						}, function() {
+							uni.showToast({
+								title: '保存失败，请重试！',
+								icon: 'none'
+							});
+						});
+					}
+				});
+			},
+			share(e) {
+				if (this.providerList.length === 0) {
+					uni.showModal({
+						title: '当前环境无分享渠道!',
+						showCancel: false
+					});
+					return;
+				}
+				let itemList = this.providerList.map(function(value) {
+					return value.name;
+				})
+				uni.showActionSheet({
+					itemList: itemList,
+					success: (res) => {
+						let provider = this.providerList[res.tapIndex].id;
+						uni.share({
+							provider: provider,
+							scene: this.providerList[res.tapIndex].type && this.providerList[res.tapIndex].type === 'WXSenceTimeline' ?
+								'WXSenceTimeline' : "WXSceneSession",
+							type: (provider === "qq") ? 1 : 0,
+							title: '欢迎体验uni-app',
+							summary: 'uni-app 是一个使用 Vue.js 开发跨平台应用的前端框架',
+							imageUrl: 'https://vkceyugu.cdn.bspapp.com/VKCEYUGU-dc-site/b09e38e0-5168-11eb-b680-7980c8a877b8.jpg',
+							href: "https://m3w.cn/uniapp",
+							success: (res) => {
+								console.log("success:" + JSON.stringify(res));
+							},
+							fail: (e) => {
+								uni.showModal({
+									content: e.errMsg,
+									showCancel: false
+								})
+							}
+						});
+					}
+				})
+			}
+			// #endif
+		}
+	}
+</script>
+
+<style>
+	page,
+	view {
+		display: flex;
+	}
+
+	page {
+		min-height: 100%;
+		background-color: #FFFFFF;
+	}
+
+	image {
+		width: 360rpx;
+		height: 360rpx;
+	}
+
+	.about {
+		flex-direction: column;
+		flex: 1;
+	}
+
+	.content {
+		flex: 1;
+		padding: 30rpx;
+		flex-direction: column;
+		justify-content: center;
+	}
+
+	.qrcode {
+		display: flex;
+		align-items: center;
+		flex-direction: column;
+	}
+
+	.qrcode .tip {
+		margin-top: 20rpx;
+	}
+
+	.desc {
+		margin-top: 30rpx;
+		display: block;
+	}
+
+	.code {
+		color: #e96900;
+		background-color: #f8f8f8;
+	}
+
+	button {
+		width: 100%;
+		margin-top: 40rpx;
+	}
+
+	.version {
+		height: 80rpx;
+		line-height: 80rpx;
+		justify-content: center;
+		color: #ccc;
+	}
+
+	.source {
+		margin-top: 30rpx;
+		flex-direction: column;
+	}
+
+	.source-list {
+		flex-direction: column;
+	}
+
+	.link {
+		color: #007AFF;
+	}
+</style>

pages/agree-list/agree-list.nvue

+<template>
+	<view class="content">
+		<uni-list class="content">
+			<uni-list-item v-for="(item , index) in agreeList" :key="index" :title="item.title" :to="item.to"></uni-list-item>
+		</uni-list>
+	</view>
+</template>
+
+<script>
+	export default {
+		data() {
+			return {
+				agreeList:[
+					{
+						title:'隐私政策',
+						to:'./privacy/privacy'
+					},
+					{
+						title:'服务协议',
+						to:'./service/service'
+					}
+				]
+			}
+		}
+	}
+</script>
+
+<style>
+	.content{
+		width: 750rpx;
+		display: flex;
+		flex-direction: column;
+		/* align-items: center; */
+		flex: 1;
+	}
+</style>

pages/agree-list/privacy/privacy.vue

+<template>
+	<view>
+		<text>隐私政策相关文本内容</text>
+	</view>
+</template>
+
+<script>
+	export default {
+		data() {
+			return {
+				
+			}
+		},
+		methods: {
+			
+		}
+	}
+</script>
+
+<style>
+
+</style>

pages/agree-list/service/service.vue

+<template>
+	<view>
+		<text>服务协议相关文本内容</text>
+	</view>
+</template>
+
+<script>
+	export default {
+		data() {
+			return {
+				
+			}
+		},
+		methods: {
+			
+		}
+	}
+</script>
+
+<style>
+
+</style>

pages/login/login.vue

@@ -48,8 +48,10 @@
 			</view>
 		</view>
 		<view class="oauth-row" v-if="hasProvider && !hasAppleLogin && platform ==='ios'" v-bind:style="{top: (positionTop - 50) + 'px'}">
-			<text style="color: #C8C7CC;text-align: center;">暂无法使用苹果登录，请查阅&nbsp;&nbsp;
-				<text style="color: #C8C7CC;text-decoration: underline;" @click="openAppleLoginDoc">Apple登录集成教程</text>
+			<text style="color: #C8C7CC;text-align: center;font-size: 30rpx;">登录/注册即表示您同意
+				<text style="color: #C8C7CC;text-decoration: underline;" @click="toPrivacy">隐私政策</text>
+				<text>和</text>
+				<text style="color: #C8C7CC;text-decoration: underline;" @click="toService">服务协议</text>
 			</text>
 		</view>
 	</view>
@@ -122,6 +124,16 @@
 				login:'user/login',
 				logout:'user/logout'
 			}),
+			toPrivacy(){
+				uni.navigateTo({
+					url:'/pages/agree-list/privacy/privacy'
+				})
+			},
+			toService(){
+				uni.navigateTo({
+					url:'/pages/agree-list/service/service'
+				})
+			},
 			initProvider() {
 				const filters = ['weixin', 'qq', 'sinaweibo', 'univerify'];
 				uni.getProvider({

pages/settings/settings.nvue

+<template>
+	<view class="content">
+		<uni-list class="content">
+			<uni-list-item v-for="(item , index) in agreeList" :key="index" :title="item.title" :to="item.to" :clickable="true" @click="itemClick(item)" :showSwitch="item.showSwitch" :switchChecked="item.isChecked"></uni-list-item>
+		</uni-list>
+		<button class="bottom-back" @click="clickLogout"><text class="bottom-back-text">退出登录</text></button>
+	</view>
+</template>
+
+<script>
+	import { isOn, setting } from '@/common/dc-push/push.js';
+	import { mapMutations } from 'vuex';
+	export default {
+		data() {
+			return {
+				agreeList:[
+					{
+						title:'个人资料',
+						to:''
+					},
+					{
+						title:'修改密码',
+						to:''
+					},{
+						title:'注销用户',
+						event:''
+					},{
+						title:'推送功能',
+						name:'push',
+						event:'openSetting',
+						isChecked:false,
+						showSwitch:true
+					},{
+						title:'清理缓存',
+						event:''
+					}
+				]
+			}
+		},
+		onShow() {
+			let pushIsOn = isOn();
+			this.agreeList.forEach(item=>{
+				item.name == 'push' ? (item.isChecked = pushIsOn) : '';
+			})
+		},
+		methods:{
+			...mapMutations({
+				logout:'user/logout'
+			}),
+			clickLogout(){
+				this.logout();
+				uni.navigateBack();
+			},
+			itemClick(item){
+				if(!item.to && item.event){
+					this[item.event]();
+				}
+			},
+			/**
+			 * 打开设置页面
+			 */
+			openSetting(){
+				setting();
+			}
+		}
+	}
+</script>
+
+<style>
+	.content{
+		width: 750rpx;
+		display: flex;
+		flex-direction: column;
+		/* align-items: center; */
+		flex: 1;
+	}
+	
+	.bottom-back{
+		width: 750rpx;
+		height: 120rpx;
+		display: flex;
+		flex-direction: column;
+		justify-content: center;
+		align-items: center;
+		border: none;
+		border-width: 0;
+		border-radius: 0;
+	}
+	.bottom-back-text{
+		font-size: 40rpx;
+		color: #DD524D;
+	}
+</style>

pages/ucenter/edit/edit.nvue

+<template>
+	<view class="content">
+		<uni-list>
+			<uni-list-item>
+				<template v-slot:body>
+					<view class="avatar-box">
+						<image class="avatar-img" :src="userInfo.avatar || '/static/logo.png'" @click="chooseImg" mode="aspectFill"></image>
+					</view>
+				</template>
+			</uni-list-item>
+		</uni-list>
+	</view>
+</template>
+
+<script>
+	import {
+		mapGetters,
+		mapMutations
+	} from 'vuex';
+	
+	const db = uniCloud.database();
+	export default {
+		data() {
+			return {
+				
+			}
+		},
+		computed: {
+			...mapGetters({
+				userInfo: 'user/info'
+			})
+		},
+		onLoad() {
+			console.log(this.userInfo);
+		},
+		methods: {
+			...mapMutations({
+				login:'user/login'
+			}),
+			// 选择图片
+			chooseImg(){
+				uni.chooseImage({
+					count:1,
+					success:(res)=> {
+						
+						uni.$on('uploadAvatarAfter', ({url})=>{
+							console.log(url);
+							this.uploadUserInfo({avatar:url});
+						})
+						uni.navigateTo({
+							url:'./uploadCutImageToUnicloud?path=' + res.tempFilePaths[0],
+						});
+					}
+				})
+			},
+			/**
+			 * @param {Object} data 更新用户信息
+			 * key 需要更新的用户字段
+			 * value 更新后的用户字段值
+			 */
+			uploadUserInfo(data){
+				db.collection('uni-id-users').where({
+					_id: this.userInfo._id
+				})
+				.update(data)
+				.then(res=>{
+					console.log(res);
+				})
+				.catch(err=>{
+					console.log(err);
+				})
+			}
+		}
+	}
+</script>
+
+<style>
+.content{
+		width: 750rpx;
+		display: flex;
+		flex-direction: column;
+		/* align-items: center; */
+		flex: 1;
+	}
+	.avatar-box{
+		width: 700rpx;
+		height: 200rpx;
+		display: flex;
+		justify-content: center;
+		align-items: center;
+	}
+	.avatar-img{
+		width: 150rpx;
+		height: 150rpx;
+		border-radius: 75rpx;
+		
+		border-width: 1rpx;
+		border-color: #999999;
+	}
+</style>

pages/ucenter/edit/limeClipper/images/photo.svg

+<?xml version="1.0" encoding="utf-8"?>
+<!-- Generator: Adobe Illustrator 24.3.0, SVG Export Plug-In . SVG Version: 6.00 Build 0)  -->
+<svg version="1.1" id="图层_1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px"
+	 viewBox="0 0 30 30" style="enable-background:new 0 0 30 30;" xml:space="preserve">
+<style type="text/css">
+	.st0{fill:#606060;}
+	.st1{fill:none;stroke:#FFFFFF;stroke-width:2.4306;stroke-miterlimit:10;}
+	.st2{fill:#FFFFFF;}
+</style>
+<g>
+	<path class="st2" d="M11.6,11c0.4,0.4,0.6,0.9,0.6,1.5c0,0.6-0.2,1.1-0.6,1.4c-0.4,0.4-0.9,0.6-1.5,0.6c-0.6,0-1.1-0.2-1.5-0.6
+		c-0.4-0.4-0.6-0.9-0.6-1.4s0.2-1.1,0.6-1.5c0.4-0.4,0.9-0.6,1.5-0.6C10.8,10.4,11.2,10.6,11.6,11z M24.6,18.4V6.7H5.4v12l1.8-1.8
+		c0.3-0.3,0.6-0.4,1-0.4c0.4,0,0.7,0.1,1,0.4l1.8,1.8l5.8-7c0.3-0.3,0.6-0.5,1.1-0.5c0.4,0,0.8,0.2,1.1,0.5
+		C18.8,11.6,24.6,18.4,24.6,18.4z M25.6,5.7C25.9,6,26,6.3,26,6.7v16.1c0,0.4-0.1,0.7-0.4,1c-0.3,0.3-0.6,0.4-1,0.4H5.4
+		c-0.4,0-0.7-0.1-1-0.4c-0.3-0.3-0.4-0.6-0.4-1V6.7c0-0.4,0.1-0.7,0.4-1c0.3-0.3,0.6-0.4,1-0.4h19.3C25,5.3,25.3,5.4,25.6,5.7z"/>
+	<path class="st1" d="M24.3,21.5H5.7c-0.2,0-0.3-0.2-0.3-0.3V7c0-0.2,0.2-0.3,0.3-0.3h18.6c0.2,0,0.3,0.2,0.3,0.3v14.2
+		C24.6,21.3,24.5,21.5,24.3,21.5z"/>
+</g>
+</svg>

pages/ucenter/edit/limeClipper/images/rotate.svg

+<?xml version="1.0" encoding="utf-8"?>
+<!-- Generator: Adobe Illustrator 24.3.0, SVG Export Plug-In . SVG Version: 6.00 Build 0)  -->
+<svg version="1.1" id="图层_1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px"
+	 width="30px" height="30px" viewBox="0 0 30 30" style="enable-background:new 0 0 30 30;" xml:space="preserve">
+<style type="text/css">
+	.st0{fill:none;stroke:#FFFFFF;stroke-width:2.4306;stroke-miterlimit:10;}
+	.st1{fill:#FFFFFF;}
+</style>
+<g>
+	<path class="st0" d="M17.1,24.2h-12c-0.2,0-0.3-0.2-0.3-0.3v-9.3c0-0.2,0.2-0.3,0.3-0.3h12c0.2,0,0.3,0.2,0.3,0.3v9.3
+		C17.5,24.1,17.3,24.2,17.1,24.2z"/>
+	<path class="st0" d="M16.6,5.4c4.8,0,8.7,3.9,8.7,8.7"/>
+	<polyline class="st0" points="19.3,10.1 14.9,5.6 19.3,1.2 	"/>
+</g>
+</svg>

pages/ucenter/edit/limeClipper/index.styl

+$edge-border-width = 6rpx
+.flex-auto
+	flex auto
+.bg-transparent
+	background-color rgba(0, 0, 0, 0.9)
+	transition-duration 0.35s
+.l-clipper
+	width 100vw
+	height calc( 100vh - var(--window-top))
+	background-color rgba(0, 0, 0, 0.9)
+	position fixed
+	top var(--window-top)
+	left 0
+	z-index 1
+	&-mask
+		position relative
+		z-index 2
+		pointer-events: none
+	&__content
+		pointer-events: none;
+		position absolute
+		border 1rpx solid rgba(255,255,255,.3)
+		box-sizing border-box
+		box-shadow: rgba(0, 0, 0, 0.5) 0 0 0 80vh;
+		background: transparent;	
+		&::before,&::after
+			content ''
+			position absolute
+			border 1rpx dashed rgba(255,255,255,.3)
+		&::before
+			width 100%
+			top 33.33%
+			height 33.33%
+			border-left none
+			border-right none
+		&::after
+			width 33.33%
+			left 33.33%
+			height 100%
+			border-top none
+			border-bottom none
+	&__edge
+		position absolute
+		// left 6rpx
+		width 34rpx
+		height 34rpx
+		border $edge-border-width solid #ffffff
+		pointer-events auto
+		&::before
+			content ''
+			position absolute
+			width 40rpx
+			height 40rpx
+			background-color transparent
+		&:nth-child(1)
+			left: - $edge-border-width
+			top: - $edge-border-width
+			border-bottom-width 0 !important
+			border-right-width 0 !important
+			&:before
+				top -50%
+				left -50%
+		&:nth-child(2)
+			right: - $edge-border-width
+			top: - $edge-border-width
+			border-bottom-width 0 !important
+			border-left-width 0 !important
+			&:before
+				top -50%
+				left 50%
+		&:nth-child(3)
+			left: - $edge-border-width
+			bottom: - $edge-border-width
+			border-top-width 0 !important
+			border-right-width 0 !important
+			&:before
+				bottom -50%
+				left -50%
+		&:nth-child(4)
+			right: - $edge-border-width
+			bottom: - $edge-border-width
+			border-top-width 0 !important
+			border-left-width 0 !important	
+			&:before
+				bottom -50%
+				left 50%
+	&-image
+		width 100%
+		border-style none
+		position absolute
+		top 0
+		left 0
+		z-index 1
+		-webkit-backface-visibility hidden
+		backface-visibility hidden
+		transform-origin center
+	&-canvas
+		position fixed
+		z-index 10
+		left -200vw
+		top -200vw
+		pointer-events none
+	&-tools
+		position fixed
+		left 0
+		bottom 10px
+		width 100%
+		z-index 99
+		color #fff
+		&__btns
+			font-weight bold
+			display flex
+			align-items center
+			justify-content space-between
+			width 100%
+			padding 20rpx 40rpx
+			box-sizing border-box
+			.cancel
+				width 112rpx
+				height 60rpx
+				text-align center
+				line-height 60rpx
+			.confirm
+				width 112rpx
+				height 60rpx
+				line-height 60rpx
+				background-color #07c160
+				border-radius 6rpx
+				text-align center
+			image
+				display block
+				width 60rpx
+				height 60rpx
+				

pages/ucenter/edit/limeClipper/limeClipper.vue

+<template>
+	<view class="l-clipper" disable-scroll :style="'z-index: ' + zIndex">
+		<view 
+			class="l-clipper-mask" 
+			@touchstart.stop.prevent="clipTouchStart" 
+			@touchmove.stop.prevent="clipTouchMove" 
+			@touchend.stop.prevent="clipTouchEnd">
+			<view class="l-clipper__content" :style="clipStyle">
+				<view class="l-clipper__edge" v-for="(item, index) in [0,0,0,0]" :key="index"></view>
+			</view>
+		</view>
+		<image
+			class="l-clipper-image"
+			@error="imageLoad"
+			@load="imageLoad"
+			@touchstart="imageTouchStart"
+			@touchmove="imageTouchMove"
+			@touchend="imageTouchEnd"
+			:src="image"
+			mode="widthFix"
+			v-if="image"
+			:style="imageStyle"/>
+		<canvas
+			canvas-id="l-clipper"
+			id="l-clipper"
+			disable-scroll
+			:style="'width: ' + (canvasWidth * scaleRatio) + 'px; height:' + (canvasHeight * scaleRatio) + 'px;'"
+			class="l-clipper-canvas"
+		></canvas>
+		<view class="l-clipper-tools">
+			<view class="l-clipper-tools__btns">
+				<view v-if="isShowCancelBtn"  @click="cancel">
+					<slot name="cancel" v-if="$slots.cancel" />
+					<view v-else class="cancel" >取消</view>
+				</view>
+				<view v-if="isShowPhotoBtn" @click="uploadImage">
+					<slot name="photo" v-if="$slots.photo" />
+					<image v-else :src="require('./images/photo.svg')"  />
+				</view>
+				<view v-if="isShowRotateBtn" @click="rotate">
+					<slot name="rotate" v-if="$slots.rotate" />
+					<image v-else :src="require('./images/rotate.svg')"  data-type="inverse" />
+				</view>
+				<view v-if="isShowConfirmBtn" @click="confirm">
+					<slot name="confirm" v-if="$slots.confirm" />
+					<view v-else class="confirm" >确定</view>
+				</view>
+			</view>
+			<slot></slot>
+		</view>
+	</view>
+</template>
+
+<script>
+import { pathToBase64, determineDirection, calcImageOffset, calcImageScale, calcImageSize, calcPythagoreanTheorem, clipTouchMoveOfCalculate, imageTouchMoveOfCalcOffset } from './utils';
+export default {
+	// version: '0.1.0',
+	name: 'l-clipper',
+	props: {
+		zIndex: {
+			type: Number,
+			default: 99
+		},
+		imageUrl: {
+			type: String
+		},
+		quality: {
+			type: Number,
+			default: 1
+		},
+		width: {
+			type: Number,
+			default: 400
+		},
+		height: {
+			type: Number,
+			default: 400
+		},
+		minWidth: {
+			type: Number,
+			default: 200
+		},
+		maxWidth: {
+			type: Number,
+			default: 600
+		},
+		minHeight: {
+			type: Number,
+			default: 200
+		},
+		maxHeight: {
+			type: Number,
+			default: 600
+		},
+		isLockWidth: {
+			type: Boolean,
+			default: false
+		},
+		isLockHeight: {
+			type: Boolean,
+			default: false
+		},
+		isLockRatio: {
+			type: Boolean,
+			default: true
+		},
+		scaleRatio: {
+			type: Number,
+			default: 1
+		},
+		minRatio: {
+			type: Number,
+			default: 0.5
+		},
+		maxRatio: {
+			type: Number,
+			default: 2
+		},
+		isDisableScale: {
+			type: Boolean,
+			default: false
+		},
+		isDisableRotate: {
+			type: Boolean,
+			default: false
+		},
+		isLimitMove: {
+			type: Boolean,
+			default: false
+		},
+		isShowPhotoBtn: {
+			type: Boolean,
+			default: true
+		},
+		isShowRotateBtn: {
+			type: Boolean,
+			default: true
+		},
+		isShowConfirmBtn: {
+			type: Boolean,
+			default: true
+		},
+		isShowCancelBtn: {
+			type: Boolean,
+			default: true
+		},
+		rotateAngle: {
+			type: Number,
+			default: 90
+		}
+	},
+	data() {
+		return {
+			canvasWidth: 0,
+			canvasHeight: 0,
+			cutX: 0, 
+			cutY: 0, 
+			aWidth: this.width,
+			aHeight: this.height,
+			clipWidth: 0,
+			clipHeight: 0,
+			cutAnimation: false,
+			imageWidth: 0, 
+			imageHeight: 0,
+			imageTop: 0,
+			imageLeft: 0,
+			scale: 1,
+			angle: 0,
+			image: this.imageUrl,
+			sysinfo: {},
+			moveThrottleTimer: null,
+			moveThrottleFlag: true,
+			timeCutcenter: null,
+			flagCutTouch: false,
+			flagEndTouch: false,
+			cutstart: {},
+			cutAnimationTime: null,
+			touchRelative: [{x: 0,y: 0}],
+			hypotenuseLength: 0,
+			ctx: null
+		};
+	},
+	computed: {
+		clipStyle() {
+			const {clipWidth, clipHeight, cutY, cutX, cutAnimation} = this
+			return  `
+			width: ${clipWidth}px; 
+			height:${clipHeight}px; 
+			transition-property: ${cutAnimation ? '' : 'background'};
+			left: ${cutX}px;
+			top: ${cutY}px
+			`
+		},
+		imageStyle() {
+			const {imageWidth, imageHeight, imageLeft, imageTop, cutAnimation, scale, angle} = this
+			return `
+				width:${imageWidth ? imageWidth + 'px' : 'auto'}; height: ${imageHeight ? imageHeight + 'px' : 'auto'}; 
+				transform: translate3d(${imageLeft - imageWidth / 2}px, ${imageTop - imageHeight / 2}px, 0) scale(${scale}) rotate(${angle}deg); 
+				transition-duration: ${cutAnimation ? 0.35 : 0}s
+			`
+		},
+		clipSize() {
+			const { clipWidth, clipHeight } = this;
+			return { clipWidth, clipHeight };
+		},
+		cutPoint() {
+			const { cutY, cutX } = this;
+			return { cutY, cutX };
+		}
+	},
+	watch: {
+		// #ifdef H5
+		imageUrl: {
+			handler: async function(url) {
+				const res = await pathToBase64(url)
+				if(res) {
+					this.image = res
+				}
+			},
+			immediate: true,
+		},
+		// #endif
+		image:{
+			handler: function (url) {
+				 this.getImageInfo(url)
+			},
+			immediate: true,
+		},
+		clipSize({ widthVal, heightVal }) {
+			let { minWidth, minHeight } = this;
+			minWidth = minWidth / 2;
+			minHeight = minHeight / 2;
+			if (widthVal < minWidth) {
+				this.clipWidth = minWidth;
+			}
+			if (heightVal < minHeight) {
+				this.clipHeight = minHeight;
+			}
+			this.computeCutSize();
+		},
+		angle(val) {
+			this.cutAnimation = true;
+			this.moveStop();
+			const { isLimitMove } = this;
+			if (isLimitMove && val % 90) {
+				this.angle = Math.round(val / 90) * 90;
+			}
+			this.imgMarginDetectionScale();
+		},
+		cutAnimation(val) {
+			clearTimeout(this.cutAnimationTime);
+			if (val) {
+				let cutAnimationTime = setTimeout(() => {
+					this.cutAnimation = false;
+				}, 260);
+				this.cutAnimationTime = cutAnimationTime;
+			}
+		},
+		isLimitMove(val) {
+			if (val) {
+				if (this.angle % 90) {
+					this.angle = Math.round(this.angle / 90) * 90;
+				}
+				this.imgMarginDetectionScale();
+			}
+		},
+		cutPoint() {
+			this.cutDetectionPosition();
+		},
+		aWidth(width, oWidth) {
+			if (width !== oWidth) {
+				this.clipWidth =  width / 2
+			}
+		},
+		aHeight(height, oHeight) {
+			if (height !== oHeight) {
+				this.clipHeight = height / 2
+			}
+		}
+	},
+	mounted() {
+		const sysinfo = uni.getSystemInfoSync();
+		this.sysinfo = sysinfo;
+		this.setCutInfo();
+		this.setCutCenter();
+		this.computeCutSize();
+		this.cutDetectionPosition();
+	},
+	methods: {
+		getImageInfo(url) {
+			if (!url) return;
+			uni.showLoading({
+				title: '请稍候...',
+				mask: true
+			});
+			
+			uni.getImageInfo({
+				src: url,
+				success: res => {
+					this.imgComputeSize(res.width, res.height);
+					if (this.isLimitMove) {
+						this.imgMarginDetectionScale();
+						this.$emit('ready', res);
+					}
+				},
+				fail: () => {
+					this.imgComputeSize();
+					if (this.isLimitMove) {
+						this.imgMarginDetectionScale();
+					}
+				}
+			});
+		},
+		setCutInfo() {
+			const { aWidth, aHeight, sysinfo } = this;
+			const clipWidth = aWidth / 2;
+			const clipHeight = aHeight / 2;
+			const cutY = (sysinfo.windowHeight - clipHeight) / 2;
+			const cutX = (sysinfo.windowWidth - clipWidth) / 2;
+			const imageLeft = sysinfo.windowWidth / 2;
+			const imageTop = sysinfo.windowHeight / 2;
+			this.ctx = uni.createCanvasContext('l-clipper', this);
+			this.clipWidth = clipWidth;
+			this.clipHeight = clipHeight;
+			this.cutX = cutX;
+			this.cutY = cutY;
+			this.canvasHeight = clipHeight;
+			this.canvasWidth = clipWidth;
+			this.imageLeft = imageLeft;
+			this.imageTop = imageTop;
+		},
+		setCutCenter() {
+			const { sysInfo, clipHeight, clipWidth, imageTop, imageLeft } = this;
+			let sys = sysInfo || uni.getSystemInfoSync();
+			let cutY = (sys.windowHeight - clipHeight) * 0.5;
+			let cutX = (sys.windowWidth - clipWidth) * 0.5;
+			this.imageTop = imageTop - this.cutY + cutY;
+			this.imageLeft = imageLeft - this.cutX + cutX;
+			this.cutY = cutY;
+			this.cutX = cutX;
+		},
+		computeCutSize() {
+			const { clipHeight, clipWidth, sysinfo, cutX, cutY } = this;
+			if (clipWidth > sysinfo.windowWidth) {
+				this.clipWidth = sysinfo.windowWidth;
+			} else if (clipWidth + cutX > sysinfo.windowWidth) {
+				this.cutX = sysinfo.windowWidth - cutX;
+			}
+			if (clipHeight > sysinfo.windowHeight) {
+				this.clipHeight = sysinfo.windowHeight;
+			} else if (clipHeight + cutY > sysinfo.windowHeight) {
+				this.cutY = sysinfo.windowHeight - cutY;
+			}
+		},
+		cutDetectionPosition() {
+			const { cutX, cutY, sysinfo, clipHeight, clipWidth } = this;
+			let cutDetectionPositionTop = () => {
+					if (cutY < 0) {
+						this.cutY = 0;
+					}
+					if (cutY > sysinfo.windowHeight - clipHeight) {
+						this.cutY = sysinfo.windowHeight - clipHeight;
+					}
+				},
+				cutDetectionPositionLeft = () => {
+					if (cutX < 0) {
+						this.cutX = 0;
+					}
+					if (cutX > sysinfo.windowWidth - clipWidth) {
+						this.cutX = sysinfo.windowWidth - clipWidth;
+					}
+				};
+			if (cutY === null && cutX === null) {
+				let newCutY = (sysinfo.windowHeight - clipHeight) * 0.5;
+				let newCutX = (sysinfo.windowWidth - clipWidth) * 0.5;
+				this.cutX = newCutX; 
+				this.cutY = newCutY; 
+			} else if (cutY !== null && cutX !== null) {
+				cutDetectionPositionTop();
+				cutDetectionPositionLeft();
+			} else if (cutY !== null && cutX === null) {
+				cutDetectionPositionTop();
+				this.cutX = (sysinfo.windowWidth - clipWidth) / 2;
+			} else if (cutY === null && cutX !== null) {
+				cutDetectionPositionLeft();
+				this.cutY = (sysinfo.windowHeight - clipHeight) / 2;
+			}
+		},
+		imgComputeSize(width, height) {
+			const { imageWidth, imageHeight } = calcImageSize(width, height, this);
+			this.imageWidth = imageWidth;
+			this.imageHeight = imageHeight;
+		},
+		imgMarginDetectionScale(scale) {
+			if (!this.isLimitMove) return;
+			const currentScale = calcImageScale(this, scale);
+			this.imgMarginDetectionPosition(currentScale);
+		},
+		imgMarginDetectionPosition(scale) {
+			if (!this.isLimitMove) return;
+			const { scale: currentScale, left, top } = calcImageOffset(this, scale);
+			this.imageLeft = left;
+			this.imageTop = top;
+			this.scale = currentScale;
+		},
+		moveThrottle() {
+			if( this.moveThrottleFlag !== true) {
+				this.moveThrottleFlag = true
+			}
+		},
+		moveDuring() {
+			clearTimeout(this.timeCutcenter);
+		},
+		moveStop() {
+			clearTimeout(this.timeCutcenter);
+			const timeCutcenter = setTimeout(() => {
+				if (!this.cutAnimation) {
+					this.cutAnimation = true;
+				}
+				this.setCutCenter();
+			}, 800);
+			this.timeCutcenter = timeCutcenter;
+		},
+		clipTouchStart(event) {
+			// #ifdef H5
+			event.preventDefault()
+			// #endif
+			if (!this.image) {
+				uni.showToast({
+					title: '请选择图片',
+					icon: 'none'
+				});
+				return;
+			}
+			const currentX = event.touches[0].clientX;
+			const currentY = event.touches[0].clientY;
+			const { cutX, cutY, clipWidth, clipHeight } = this;
+			const corner = determineDirection(cutX, cutY, clipWidth, clipHeight, currentX, currentY);
+			this.moveDuring();
+			if(!corner) {
+				return
+			}
+			this.cutstart = {
+				width: clipWidth,
+				height: clipHeight,
+				x: currentX,
+				y: currentY,
+				cutY,
+				cutX,
+				corner
+			};
+			this.flagCutTouch = true;
+			this.flagEndTouch = true;
+		},
+		clipTouchMove(event) {
+			// #ifdef H5
+			event.stopPropagation()
+			event.preventDefault()
+			// #endif
+			if (!this.image) {
+				uni.showToast({
+					title: '请选择图片',
+					icon: 'none'
+				});
+				return;
+			}
+			const { flagCutTouch, moveThrottleFlag } = this;
+			if (flagCutTouch && moveThrottleFlag) {
+				const { isLockRatio, isLockHeight, isLockWidth } = this;
+				if (isLockRatio && (isLockWidth || isLockHeight)) return;
+				this.moveThrottleFlag = false;
+				if(this.moveThrottleFlag !== false) {
+					this.moveThrottleFlag = false;
+				}
+				this.moveThrottle();
+				const { width, height, cutX, cutY } = clipTouchMoveOfCalculate(this, event);
+				if (!isLockWidth && !isLockHeight) {
+					this.clipWidth = width;
+					this.clipHeight = height;
+					this.cutX = cutX;
+					this.cutY = cutY;
+				} else if (!isLockWidth) {
+					this.clipWidth = width// clipWidth;
+					this.cutX = cutX;
+				} else if (!isLockHeight) {
+					this.clipHeight = height//clipHeight;
+					this.cutY = cutY;
+				}
+				this.imgMarginDetectionScale();
+			}
+		},
+		clipTouchEnd() {
+			this.moveStop();
+			this.flagCutTouch = false;
+		},
+		imageTouchStart(e) {
+			// #ifdef H5
+			event.preventDefault()
+			// #endif
+			this.flagEndTouch = false;
+			this.cutAnimation = false;
+			const { imageLeft, imageTop } = this;
+			const clientXForLeft = Math.round(e.touches[0].clientX);
+			const clientYForLeft =  Math.round(e.touches[0].clientY);
+
+			let touchRelative = [];
+			if (e.touches.length === 1) {
+				touchRelative[0] = {
+					x: clientXForLeft - imageLeft,
+					y: clientYForLeft - imageTop
+				};
+				this.touchRelative = touchRelative;
+			} else {
+				const clientXForRight = Math.round(e.touches[1].clientX);
+				const clientYForRight = Math.round(e.touches[1].clientY);
+				let width = Math.abs(clientXForLeft - clientXForRight);
+				let height = Math.abs(clientYForLeft - clientYForRight);
+				const hypotenuseLength = calcPythagoreanTheorem(width, height);
+
+				touchRelative = [
+					{
+						x: clientXForLeft - imageLeft,
+						y: clientYForLeft - imageTop
+					},
+					{
+						x: clientXForRight - imageLeft,
+						y: clientYForRight - imageTop
+					}
+				];
+				this.touchRelative = touchRelative;
+				this.hypotenuseLength = hypotenuseLength;
+			}
+		},
+		imageTouchMove(e) {
+			// #ifdef H5
+			event.preventDefault()
+			// #endif
+			const { flagEndTouch, moveThrottleFlag } = this;
+			if (flagEndTouch || !moveThrottleFlag) return;
+			const clientXForLeft = Math.round(e.touches[0].clientX);
+			const clientYForLeft = Math.round(e.touches[0].clientY);
+			this.moveThrottleFlag = false;
+			this.moveThrottle();
+			this.moveDuring();
+			if (e.touches.length === 1) {
+				const { left, top } = imageTouchMoveOfCalcOffset(this, clientXForLeft, clientYForLeft);
+				this.imageLeft = left;
+				this.imageTop = top;
+				this.imgMarginDetectionPosition();
+			} else {
+				const clientXForRight = Math.round(e.touches[1].clientX);
+				const clientYForRight = Math.round(e.touches[1].clientY);
+				let width = Math.abs(clientXForLeft - clientXForRight),
+					height = Math.abs(clientYForLeft - clientYForRight),
+					hypotenuse = calcPythagoreanTheorem(width, height), 
+					scale = this.scale * (hypotenuse / this.hypotenuseLength);
+				if (this.isDisableScale) {
+					scale = 1;
+				} else {
+					scale = scale <= this.minRatio ? this.minRatio : scale;
+					scale = scale >= this.maxRatio ? this.maxRatio : scale;
+					this.$emit('change', {
+						width: this.imageWidth * scale,
+						height: this.imageHeight * scale
+					});
+				}
+
+				this.imgMarginDetectionScale(scale);
+				this.hypotenuseLength = Math.sqrt(Math.pow(width, 2) + Math.pow(height, 2));
+				this.scale = scale;
+			}
+		},
+		imageTouchEnd() {
+			this.flagEndTouch = true;
+			this.moveStop();
+		},
+		uploadImage() {
+			uni.chooseImage({
+				count: 1,
+				sizeType: ['original', 'compressed'],
+				sourceType: ['album', 'camera'],
+				success: res => {
+					const tempFilePaths = res.tempFilePaths;
+					this.image = tempFilePaths[0];
+				}
+			});
+		},
+		imageReset() {
+			const sys = this.sysinfo || uni.getSystemInfoSync();
+			this.scale = 1;
+			this.angle = 0;
+			this.imageTop = sys.windowHeight / 2;
+			this.imageLeft = sys.windowWidth / 2;
+		},
+		imageLoad(e) {
+			this.imageReset();
+			uni.hideLoading();
+			this.$emit('ready', e.detail);
+		},
+		rotate(event) {
+			if (this.isDisableRotate) return;
+			if (!this.image) {
+				uni.showToast({
+					title: '请选择图片',
+					icon: 'none'
+				});
+				return;
+			}
+			const { rotateAngle } = this;
+			const originAngle = this.angle
+			const type = event.currentTarget.dataset.type;
+			if (type === 'along') {
+				this.angle = originAngle + rotateAngle
+			} else {
+				this.angle = originAngle - rotateAngle
+			}
+			this.$emit('rotate', this.angle);
+		},
+		confirm() {
+			if (!this.image) {
+				uni.showToast({
+					title: '请选择图片',
+					icon: 'none'
+				});
+				return;
+			}
+			uni.showLoading({
+				title: '加载中'
+			});
+
+			const { clipHeight, clipWidth, ctx, scale, imageLeft, imageTop, cutX, cutY, angle, scaleRatio, image, quality, type: imageType } = this;
+			let { canvasHeight, canvasWidth } = this;
+			const draw = () => {
+				const imageWidth = this.imageWidth * scale * scaleRatio;
+				const imageHeight = this.imageHeight * scale * scaleRatio;
+				const xpos = imageLeft - cutX;
+				const ypos = imageTop - cutY;
+				ctx.translate(xpos * scaleRatio, ypos * scaleRatio);
+				ctx.rotate((angle * Math.PI) / 180);
+				ctx.drawImage(image, -imageWidth / 2, -imageHeight / 2, imageWidth, imageHeight);
+				ctx.draw(false, () => {
+					const width = clipWidth * scaleRatio
+					const height = clipHeight * scaleRatio
+					let params = {
+						x: 0,
+						y: 0,
+						width,
+						height,
+						destWidth: width,
+						destHeight: height,
+						canvasId: 'l-clipper',
+						fileType: 'png',
+						quality,
+						success: (res) => {
+							data.url = res.tempFilePath;
+							uni.hideLoading();
+							this.$emit('success', data);
+						},
+						fail: (error) => {
+							console.error('error', error)
+							this.$emit('fail', error);
+						}
+					};
+
+					let data = {
+						url: '',
+						width,
+						height
+					};
+					uni.canvasToTempFilePath(params, this)
+				});
+			};
+
+			if (canvasWidth !== clipWidth || canvasHeight !== clipHeight) {
+				canvasWidth = clipWidth;
+				canvasHeight = clipHeight;
+				ctx.draw();
+				setTimeout(() => {
+					draw();
+				}, 100);
+			} else {
+				draw();
+			}
+		},
+		cancel() {
+			this.$emit('cancel', false)
+		},
+	}
+};
+</script>
+
+<style lang="stylus" scoped>
+@import './index'
+</style>

pages/ucenter/edit/limeClipper/utils.js

+
+/**
+ * h5网络地址转base64
+ */
+export function pathToBase64(path) {
+	// #ifdef H5
+	return new Promise((resolve, reject) => {
+		const _fileReader = (blob) => {
+			const fileReader = new FileReader();
+			fileReader.onload = (e) => {
+				resolve(e.target.result);
+			};
+			fileReader.readAsDataURL(blob);
+			fileReader.onerror = (error) => {
+				console.error('blobToBase64 error:', JSON.stringify(error))
+				reject(new Error('blobToBase64 error'));
+			};
+		}
+		if (/^(http|\/\/)/.test(path) && typeof FileReader === 'function') {
+			window.URL = window.URL || window.webkitURL;
+			const xhr = new XMLHttpRequest();
+			xhr.open("get", path, true);
+			xhr.timeout = 2000;
+			xhr.responseType = "blob";
+			xhr.onload = function() {
+				if (this.status == 200) {
+					_fileReader(this.response)
+				}
+			}
+			xhr.send();
+		}
+	})
+	// #endif
+}
+
+/**
+ * 判断手指触摸位置
+ */
+export function determineDirection(cutX, cutY, clipWidth, clipHeight, currentX, currentY) {
+	const EXPAND_SIZE = 24;
+
+	let leftx1 = cutX - EXPAND_SIZE;
+	let leftx2 = cutX + EXPAND_SIZE;
+
+	let topy1 = cutY - EXPAND_SIZE;
+	let topy2 = cutY + EXPAND_SIZE;
+
+	let rightx1 = cutX + clipWidth - EXPAND_SIZE;
+	let rightx2 = cutX + clipWidth + EXPAND_SIZE;
+
+	let bottomy1 = cutY + clipHeight - EXPAND_SIZE;
+	let bottomy2 = cutY + clipHeight + EXPAND_SIZE;
+	let corner;
+	const isRight = currentX > rightx1 && currentX < rightx2;
+	const isLeft = currentX > leftx1 && currentX < leftx2;
+	const isBottom = currentY > bottomy1 && currentY < bottomy2;
+	const isTop = currentY > topy1 && currentY < topy2;
+	if (isRight && isBottom) {
+		corner = 1;
+	} else if (isRight && isTop) {
+		corner = 2;
+	} else if (isLeft && isTop) {
+		corner = 3;
+	} else if (isLeft && isBottom) {
+		corner = 4;
+	}
+	return corner;
+}
+
+/**
+ * 图片边缘检测检测时，计算图片偏移量
+ */
+export function calcImageOffset(data, scale) {
+	let {
+		imageLeft: left,
+		imageTop: top,
+		imageWidth,
+		imageHeight,
+		cutX,
+		clipWidth,
+		cutY,
+		clipHeight
+	} = data
+	scale = scale || data.scale;
+	if ((data.angle / 90) % 2) {
+		imageWidth = mageHeight;
+		imageHeight = mageWidth;
+	}
+
+	// 当前图片宽度/高度
+	const currentImageSize = (size) => (size * scale) / 2;
+	const currentImageWidth = currentImageSize(imageWidth);
+	const currentImageHeight = currentImageSize(imageHeight);
+
+	left = cutX + currentImageWidth >= left ? left : cutX + currentImageWidth;
+	left = cutX + clipWidth - currentImageWidth <= left ? left : cutX + clipWidth - currentImageWidth;
+	top = cutY + currentImageHeight >= top ? top : cutY + currentImageHeight;
+	top = cutY + clipHeight - currentImageHeight <= top ? top : cutY + clipHeight - currentImageHeight;
+	return {
+		left,
+		top,
+		scale
+	};
+}
+
+/**
+ * 图片边缘检测时，计算图片缩放比例
+ */
+export function calcImageScale(data, scale) {
+	scale = scale || data.scale;
+	let {
+		imageWidth,
+		imageHeight,
+		clipWidth,
+		clipHeight,
+		angle
+	} = data
+	if ((angle / 90) % 2) {
+		imageWidth = imageHeight;
+		imageHeight = imageWidth;
+	}
+	if (imageWidth * scale < clipWidth) {
+		scale = clipWidth / imageWidth;
+	}
+	if (imageHeight * scale < clipHeight) {
+		scale = Math.max(scale, clipHeight / imageHeight);
+	}
+	return scale;
+}
+
+/**
+ * 计算图片尺寸
+ */
+export function calcImageSize(width, height, data) {
+	let imageWidth = width,
+		imageHeight = height;
+	let {
+		clipWidth,
+		clipHeight,
+		sysinfo,
+		width: oWidth,
+		height: oHeight
+	} = data
+	if (imageWidth && imageHeight) {
+		if (imageWidth / imageHeight > (clipWidth || oWidth) / (clipWidth || oHeight)) {
+			imageHeight = clipHeight || oHeight;
+			imageWidth = (width / height) * imageHeight;
+		} else {
+			imageWidth = clipWidth || oWidth;
+			imageHeight = (height / width) * imageWidth;
+		}
+	} else {
+		let sys = sysinfo || uni.getSystemInfoSync();
+		imageWidth = sys.windowWidth;
+		imageHeight = 0;
+	}
+	return {
+		imageWidth,
+		imageHeight
+	};
+}
+
+/**
+ * 勾股定理求斜边
+ */
+export function calcPythagoreanTheorem(width, height) {
+	return Math.sqrt(Math.pow(width, 2) + Math.pow(height, 2));
+}
+
+/**
+ * 拖动裁剪框时计算
+ */
+export function clipTouchMoveOfCalculate(data, event) {
+	const clientX = event.touches[0].clientX;
+	const clientY = event.touches[0].clientY;
+
+	const {
+		clipWidth,
+		clipHeight,
+		cutY: oldCutY,
+		cutX: oldCutX,
+		cutstart,
+		isLockRatio
+	} = data;
+	let {
+		maxWidth,
+		minWidth,
+		maxHeight,
+		minHeight
+	} = data;
+	maxWidth = maxWidth / 2;
+	minWidth = minWidth / 2;
+	minHeight = minHeight / 2;
+	maxHeight = maxHeight / 2;
+
+	let width = clipWidth,
+		height = clipHeight,
+		cutY = oldCutY,
+		cutX = oldCutX,
+		sizecorrect = () => {
+			width = width <= maxWidth ? (width >= minWidth ? width : minWidth) : maxWidth;
+			height = height <= maxHeight ? (height >= minHeight ? height : minHeight) : maxHeight;
+		},
+		sizeinspect = () => {
+			sizecorrect();
+			if ((width > maxWidth || width < minWidth || height > maxHeight || height < minHeight) && isLockRatio) {
+				return false;
+			} else {
+				return true;
+			}
+		};
+	if (cutstart.corner) {
+		height = cutstart.height + (cutstart.corner > 1 && cutstart.corner < 4 ? 1 : -1) * (cutstart.y - clientY);
+	}
+	switch (cutstart.corner) {
+		case 1:
+			width = cutstart.width - cutstart.x + clientX;
+			if (isLockRatio) {
+				height = width / (clipWidth / clipHeight);
+			}
+			if (!sizeinspect()) return;
+			break;
+		case 2:
+			width = cutstart.width - cutstart.x + clientX;
+			if (isLockRatio) {
+				height = width / (clipWidth / clipHeight);
+			}
+			if (!sizeinspect()) {
+				return;
+			} else {
+				cutY = cutstart.cutY - (height - cutstart.height);
+			}
+
+			break;
+		case 3:
+			width = cutstart.width + cutstart.x - clientX;
+			if (isLockRatio) {
+				height = width / (clipWidth / clipHeight);
+			}
+			if (!sizeinspect()) {
+				return;
+			} else {
+				cutY = cutstart.cutY - (height - cutstart.height);
+				cutX = cutstart.cutX - (width - cutstart.width);
+			}
+
+			break;
+		case 4:
+			width = cutstart.width + cutstart.x - clientX;
+			if (isLockRatio) {
+				height = width / (clipWidth / clipHeight);
+			}
+			if (!sizeinspect()) {
+				return;
+			} else {
+				cutX = cutstart.cutX - (width - cutstart.width);
+			}
+			break;
+		default:
+			break;
+	}
+	return {
+		width,
+		height,
+		cutX,
+		cutY
+	};
+}
+
+/**
+ * 单指拖动图片计算偏移
+ */
+export function imageTouchMoveOfCalcOffset(data, clientXForLeft, clientYForLeft) {
+	let left = clientXForLeft - data.touchRelative[0].x,
+		top = clientYForLeft - data.touchRelative[0].y;
+	return {
+		left,
+		top
+	};
+}

pages/ucenter/edit/main.js

+export default (callback,options)=>{
+	options = options||{"width":600,"height":600};
+	uni.chooseImage({
+		sizeType:['original'],
+		count:1,
+		...options,
+		complete:({tempFiles:[{path}]})=> {
+			uni.navigateTo({
+				url:'/common/uploadCutImageToUnicloud/uploadCutImageToUnicloud?path='+path+"&options="+JSON.stringify(options),
+				animationType:'fade-in',
+				events:{
+					url(url){
+						callback(url)
+					}
+				}
+			})
+		}
+	})
+}
\ No newline at end of file

pages/ucenter/edit/uploadCutImageToUnicloud.vue

+<template>
+	<view class="content" >
+		<limeClipper :width="options.width" :scale-ratio="2" :height="options.height" :image-url="path"  
+			@success="successFn" @cancel="cancel"  />
+	</view>
+</template>
+<script>
+import limeClipper from './limeClipper/limeClipper.vue';
+export default {
+	components: {limeClipper},
+	data() {return {path: '',options:{"width":600,"height":600}}},
+	onLoad({path,options}) {
+		this.path = path
+		if(options){
+			this.options = JSON.parse(options)
+		}
+	},
+	methods:{
+		successFn(e){
+			uni.getImageInfo({
+				src:e.url,
+				complete: (e) => {
+					console.log(e);
+				}
+			})
+			this.uploadImgToUnicloud(e.url,(url)=>{
+				//console.log(url);
+				uni.$emit('uploadAvatarAfter', {url});
+				uni.navigateBack()
+			})
+		},
+		uploadImgToUnicloud(url,callback){
+			uni.showLoading()
+			uniCloud.uploadFile({
+				cloudPath:Math.ceil((Math.random()+Math.random()+Math.random()+1)*1000000)+Date.now()+".png",
+				filePath:url
+			})
+			.then(res=>{
+				//console.log(res);
+				callback(res.fileID)
+				uni.hideLoading()
+			})
+		},
+		cancel(){
+			uni.navigateBack()
+		}
+	}
+}
+</script>
+
+<style>
+	.box{
+		width: 400rpx;
+	}
+	.mt{
+		margin-top: -10px;
+	}
+</style>
\ No newline at end of file

pages/ucenter/ucenter.nvue

 <template>
 	<view class="center">
 		<view class="logo" @click="goLogin" :hover-class="!login ? 'logo-hover' : ''">
-			<image class="logo-img" :src="login ? (userInfo.avatarUrl || avatarUrl) :avatarUrl"></image>
+			<image class="logo-img" :src="login ? (userInfo.avatar || avatarUrl) :avatarUrl"></image>
 			<view class="logo-title">
 				<text class="uer-name">Hi，{{login ? userInfo.username : '您未登录'}}</text>
 				<text class="go-login-navigat-arrow navigat-arrow" v-if="!login">&#xe65e;</text>
@@ -9,8 +9,8 @@
 		</view>
 		<uni-list class="center-list">
 			<template v-for="(sublist , index) in ucenterList">
-				<uni-list-item :title="item.title" :rightText="item.rightText" :link="item.link"
-					v-for="(item, subIndex) in sublist" :key="(index + '_' + subIndex)"></uni-list-item>
+				<uni-list-item :title="item.title" :rightText="item.rightText" :to="item.to"
+					v-for="(item, subIndex) in sublist" :key="(index + '_' + subIndex)" @click="ucenterListClick(item)" :clickable="true"></uni-list-item>
 				<!-- #ifdef APP-NVUE -->
 				<cell class="center-list-cell"></cell>
 				<!-- #endif -->
@@ -27,6 +27,7 @@
 		mapGetters,
 		mapMutations
 	} from 'vuex';
+	import checkUpdate from '@/uni_modules/uni-upgrade-center-app/utils/check-update';
 	export default {
 		data() {
 			return {
@@ -38,24 +39,27 @@
 						title: '我的积分'
 					}],
 					[{
-						title: '政策与协议'
+						title: '政策与协议',
+						to:'/pages/agree-list/agree-list'
 					}, {
 						title: '关于',
-						link: 'asd'
+						to: '/pages/about/about'
 					},
 					//#ifdef APP-PLUS
 					{
 						title: '检查更新',
-						rightText: `V${plus.runtime.version}_${plus.runtime.versionCode}`
+						rightText: `V${getApp().appVersion.finall.version}_${getApp().appVersion.finall.versionCode}`,
+						event:'checkVersion'
 					}
 					//#endif
 					],
 					[
 						{
-							title: '反馈'
+							title: '反馈',
+							to:'/pages/uni-feedback/uni-feedback'
 						},{
 							title: '设置',
-							link: './setting'
+							to: '/pages/settings/settings'
 						}
 					]
 				]
@@ -68,7 +72,7 @@
 			})
 		},
 		onReady() {
-			this.logout();
+			
 		},
 		onShow(){
 			console.log(this.userInfo);
@@ -77,6 +81,17 @@
 			...mapMutations({
 				logout:'user/logout'
 			}),
+			/**
+			 * 个人中心项目列表点击事件
+			 */
+			ucenterListClick(item){
+				if(!item.to && item.event){
+					this[item.event]();
+				}
+			},
+			checkVersion(){
+				checkUpdate();
+			},
 			goLogin() {
 				if (!this.login) {
 					console.log('点击前往登录');
@@ -86,6 +101,9 @@
 				}
 				else {
 					console.log('点击编辑信息');
+					uni.navigateTo({
+						url:'./edit/edit'
+					})
 				}
 			}
 		}

uniCloud-aliyun/database/opendb-feedback.schema.json

+{
+	"bsonType": "object",
+	"permission": {
+		"read": "doc.uid == auth.uid && doc.article_status == 0 || doc.article_status == 1",
+		"create": true,
+		"update": "doc.uid == auth.uid",
+		"delete": "doc.uid == auth.uid"
+	},
+	"properties": {
+		"_id": {
+			"description": "ID，系统自动生成"
+		},
+		"user_id": {
+			"bsonType": "string",
+			"description": "留言反馈用户ID\/回复留言用户ID，参考uni-id-users表",
+			"foreignKey": "uni-id-users._id"
+		},
+		"create_date": {
+			"bsonType": "timestamp",
+			"description": "留言时间\/回复留言时间"
+		},
+		"content": {
+			"bsonType": "string",
+			"description": "留言内容\/回复内容",
+			"trim": "right"
+		},
+		"imgs": {
+			"bsonType": "array",
+			"description": "图片列表"
+		},
+		"is_reply": {
+			"bsonType": "bool",
+			"description": "是否是回复类型"
+		},
+		"feedback_id": {
+			"bsonType": "string",
+			"description": "被回复留言ID"
+		},
+		"contact": {
+			"bsonType": "string",
+			"description": "联系人",
+			"trim": "both"
+		},
+		"mobile": {
+			"bsonType": "string",
+			"description": "联系电话",
+			"trim": "both"
+		},
+		"reply_count": {
+			"bsonType": "int",
+			"description": "被回复条数"
+		}
+	}
+}

uniCloud-aliyun/database/uni-id-users.schema.json

@@ -3,7 +3,7 @@
 	"permission": {
 		"read": true,
 		"create": false,
-		"update": false,
+		"update": "doc.uid == auth.uid",
 		"delete": false
 	},
 	"properties": {

uni_modules/uni-upgrade-center-app/changelog.md

+## 0.0.6（2021-04-01）
+- 兼容旧版本安卓
+## 0.0.5（2021-04-01）
+- 修复低版本安卓上进度条错位
+## 0.0.4（2021-04-01）
+- 更新readme
+- 修复check-update语法错误
+## 0.0.3（2021-04-01）
+- 新增前台更新弹框，详见readme
+- 更新前台检查更新方法
+
+## 0.0.2（2021-03-29）
+- 更新文档
+- 移除 dependencies
+
+## 0.0.1（2021-03-25）
+- 升级中心前台检查更新

uni_modules/uni-upgrade-center-app/uniCloud/cloudfunctions/check-version/check-version.param.json

+// 本文件中的json内容将在云函数【运行】时作为参数传给云函数。
+
+// 配置教程参考：https://uniapp.dcloud.net.cn/uniCloud/quickstart?id=runparam
+
+{
+	"appid": "__YOUR_APPID__",
+	"appVersion": "2.2.0",
+	"wgtVersion": "2.2.2"
+}