Skip to content

vk-unicloud-router
vk-unicloud-router

vk-uni / vk-unicloud-router
11 个月 前同步成功

通知 0
Star 0
Fork 0
vk-unicloud-router
vk-unicloud-router

体验新版 GitCode，发现更多精彩内容 >>

提交 d2e75c3c 编写于 作者: VK1688's avatar VK1688
浏览文件
操作

1.3.4

上级 9aaa7c6d
展开全部 隐藏空白更改
内联 并排
Showing with 3066 addition and 0 deletion
README/1.3.4.md 0 → 100644
浏览文件 @ d2e75c3c
#### uniCloud 云函数路由研究群:22466457 如有问题或建议可以在群内讨论。
###### gitee公共仓库地址：https://gitee.com/vk-uni/vk-uni-cloud-router.git
### 更新内容
##### 1、【优化】将演示页面移至分包`pages_template`目录中，不占用主包大小。
##### 2、【优化】为了方便新手快速上手此框架，写一个简单的演示页面（`pages/test/test`）
###### 为了符合uniapp官方规范，你自己写的页面均写在`pages`目录下 故此`pages/test/test`页面未移至`pages_template`目录
### 你也可以在评论区发布留言交流心得。
\ No newline at end of file
cloudfunctions-aliyun/router/service/test/pub/addition.js 0 → 100644
浏览文件 @ d2e75c3c
module.exports = {
/**
* 此函数名称
* @url test/pub/addition 前端调用的url参数地址
* @description 此函数描述
* @params {Object} data 请求参数
* @params {String} uniIdToken 用户token
* @params {String} userInfo 当前登录用户信息(同理,是可信任的)(只有kh函数才带此参数)
* @params {Object} util 公共工具包
* @params {Object} originalParam 原始请求参数(包含了原始event和context)
* data 请求参数 说明
* @params {String} uid 当前登录用户id,若用户已登录且token有效,则data中会带uid参数
* (此参数是后端过滤器通过token获取并添加到data中的,是可信任的)(只有kh函数才带此参数)
* res 返回参数说明
* @params {Number} code 错误码，0表示成功
* @params {String} msg 详细信息
*/
main: async (event) => {
let { data = {}, userInfo, util, originalParam } = event;
let { uniID, config, pubFun, vk , db, _ } = util;
let { uid } = data;
let res = { code : 0, msg : '' };
// 业务逻辑开始-----------------------------------------------------------
// 可写与数据库的交互逻辑等等
let { num1 , num2 } = data;
if(!num1 || !num2){
return {
code : -1,
msg : "参数不能为空！"
}
}
num1 = parseFloat(num1);
num2 = parseFloat(num2);
res.value = parseFloat((num1 + num2).toFixed(2));
// 业务逻辑结束-----------------------------------------------------------
return res;
}
}
\ No newline at end of file
pages/test/test.vue 0 → 100644
浏览文件 @ d2e75c3c
<template>
<view class="app">
<!-- 页面内容开始 -->
<input type="number" v-model="form1.num1" placeholder="请输入数字" />
<input type="number" v-model="form1.num2" placeholder="请输入数字" />
<button type="default" @tap="calc">计算</button>
<view>
计算结果：{{ value }}
</view>
<!-- 页面内容结束 -->
</view>
</template>
<script>
var that; // 当前页面对象
var app = getApp(); // 可获取全局配置
var vk; // 自定义函数集
export default {
data() {
// 页面数据变量
return {
form1:{
num1:"",
num2:"",
},
value:""
}
},
// 监听 - 页面每次【加载时】执行(如：前进)
onLoad(options = {}) {
that = this;
vk = that.vk;
that.options = options;
that.init(options);
},
// 监听 - 页面【首次渲染完成时】执行。注意如果渲染速度快，会在页面进入动画完成前触发
onReady(){
},
// 监听 - 页面每次【显示时】执行(如：前进和返回) (页面每次出现在屏幕上都触发，包括从下级页面点返回露出当前页面)
onShow() {
},
// 监听 - 页面每次【隐藏时】执行(如：返回)
onHide() {
},
// 函数
methods: {
// 页面数据初始化函数
init(options){
},
calc(){
let form1 = that.form1;
// 开始调用云函数
vk.callFunction({
url: 'test/pub/addition', // 云函数service目录下的地址
title:'请求中...',
//data : form1, // 这样写也可以，下面这样写是为了方便新手理解
data:{
num1 : form1.num1,
num2 : form1.num2,
},
success(data) {
that.value = data.value;
}
});
}
}
}
</script>
<style lang="scss" scoped>
.app {
padding: 15px;
}
.app input {
height: 46px;
border: solid 1px #DDDDDD;
border-radius: 5px;
margin-bottom: 15px;
padding: 0px 15px;
}
.app button {
margin-bottom: 15px;
}
</style>
\ No newline at end of file
pages_template/components-dynamic/index/index.vue 0 → 100644
浏览文件 @ d2e75c3c
<template>
<view class="wrap">
<view class="tips-view">
<view style="font-size: 32rpx;font-weight: bold;">
前后端一体动态数据组件优势:
</view>
<view style="margin-top: 20rpx;">
1、减少APP或小程序的审核次数，页面组件局部更新不需要重新发布小程序，且实时生效。
</view>
<view style="margin-top: 20rpx;">
2、方便维护，只需要修改数据库对应的组件数据即可达到修改页面的目的。
</view>
<view style="margin-top: 20rpx;">
3、是支持可视化装修页面的必备能力。
</view>
</view>
<view class="list-wrap">
<u-cell-group title-bg-color="rgb(243, 244, 246)" :title="item.groupName" v-for="(item, index) in list" :key="index">
<u-cell-item :titleStyle="{fontWeight: 500}" @click="pageTo(item1.path)" :title="item1.title" v-for="(item1, index1) in item.list" :key="index1">
<image slot="icon" class="u-cell-icon" :src="getIcon(item1.icon)" mode="widthFix"></image>
</u-cell-item>
</u-cell-group>
</view>
</view>
</template>
<script>
var that; // 当前页面对象
var app = getApp(); // 可获取全局配置
var vk; // 自定义函数集
export default {
data() {
return {
list: [
{
groupName: '动态数据组件 - 展示类组件',
list:[
{
path: '../vk-u-notice-bar/vk-u-notice-bar',
icon: 'noticeBar',
title: 'vk-u-notice-bar 公告滚动通知',
},
{
path: '../vk-u-swiper/vk-u-swiper',
icon: 'swiper',
title: 'vk-u-swiper 图片轮播',
},
{
path: '../vk-u-grid-button/vk-u-grid-button',
icon: 'grid',
title: 'vk-u-grid-button 图文导航',
}
]
}
]
}
},
computed: {
getIcon() {
return path => {
return 'https://cdn.uviewui.com/uview/example/' + path + '.png';
}
}
},
// 监听 - 页面每次【加载时】执行(如：前进)
onLoad(options) {
that = this;
vk = that.vk;
//console.log("onLoad",options);
that.init(options);
},
methods: {
// 页面数据初始化函数
init(options = {}){
// 检查数据库,若没有测试数据,则自动添加测试数据
vk.callFunction({
url: 'components_dynamic/pub/init',
title:'检查数据库...'
});
},
pageTo(url) {
uni.navigateTo({
url:url
})
}
}
}
</script>
<style lang="scss" scoped>
.u-cell-icon {
width: 36rpx;
height: 36rpx;
margin-right: 8rpx;
}
.tips-view{
padding: 30rpx;
font-size: 30rpx;
}
</style>
pages_template/components-dynamic/vk-u-grid-button/vk-u-grid-button.vue 0 → 100644
浏览文件 @ d2e75c3c
<template>
<view class="u-demo">
<view class="u-demo-wrap">
<view class="u-demo-title">演示效果</view>
<view class="u-demo-area">
<u-toast ref="uToast"></u-toast>
<!-- 图文导航 -->
<vk-u-grid-button :datas='componentsDynamic["vk-test-grid-button-01"]' :custom-datas='customDatas' @click="click"></vk-u-grid-button>
</view>
</view>
<view class="u-config-wrap">
<view class="u-config-title u-border-bottom">
数据库交互
</view>
<view class="u-config-item">
<view class="u-item-title">修改按钮1的数据库内容</view>
<u-subsection vibrateShort :list="['还原修改按钮1的内容', '修改按钮1的内容']" @change="dataChange1"></u-subsection>
</view>
<view class="u-config-item">
<view class="u-item-title">修改列数</view>
<u-subsection vibrateShort :list="['还原列数为4列', '修改列数为3列']" @change="dataChange2"></u-subsection>
</view>
</view>
<view class="u-config-wrap">
<view class="u-config-title u-border-bottom">
参数配置
</view>
<view class="u-config-item">
<view class="u-item-title">是否显示边框</view>
<u-subsection vibrateShort :list="['否', '是']" @change="borderChange"></u-subsection>
</view>
<view class="u-config-item">
<view class="u-item-title">是否可滑动</view>
<u-subsection vibrateShort current="1" :list="['是', '否']" @change="isSwiperChange"></u-subsection>
</view>
<view class="u-config-item">
<view class="u-item-title">修改列数</view>
<u-subsection vibrateShort :list="['4', '3']" @change="colChange"></u-subsection>
</view>
</view>
</view>
</template>
<script>
var that; // 当前页面对象
var app = getApp(); // 可获取全局配置
var vk; // 自定义函数集
export default {
data() {
return {
componentsDynamic:{},
customDatas:{}
};
},
// 监听 - 页面每次【加载时】执行(如：前进)
onLoad(options) {
that = this;
vk = that.vk;
//console.log("onLoad",options);
that.init(options);
},
methods: {
// 页面数据初始化函数
init(options = {}){
// 获取组件数据
vk.pubfn.getComponentsDynamicData({
that : that,
ids : ["vk-test-grid-button-01"]
});
},
set(key,value){
that.$set(that.customDatas,key,value);
},
dataChange1(index){
let data_value = that.componentsDynamic["vk-test-grid-button-01"];
if(index == 1){
// 修改
data_value.list[0].text = "修改后的按钮1222";
data_value.list[0].icon = "red-packet";
}else{
// 还原
data_value.list[0].text = "按钮1";
data_value.list[0].icon = "https://timgsa.baidu.com/timg?image&quality=80&size=b9999_10000&sec=1594798331539&di=fe544344d765e4f23f90457f02a2d361&imgtype=0&src=http%3A%2F%2Fpic1.win4000.com%2Fwallpaper%2F1%2F58f03bf05fddb.jpg%3Fdown";
}
that.callFunction({
data_id:"vk-test-grid-button-01",
data_value:data_value
});
},
dataChange2(index){
let data_value = that.componentsDynamic["vk-test-grid-button-01"];
if(index == 1){
// 修改
data_value.col = 3;
}else{
// 还原
data_value.col = 4;
}
that.callFunction({
data_id:"vk-test-grid-button-01",
data_value:data_value
});
},
callFunction(obj){
vk.callFunction({
url: 'components_dynamic/pub/update',
title:'请求中...',
data:{
data_id:obj.data_id,
data_value:obj.data_value
},
success(data) {
// 修改成功
that.toast(`修改成功`);
that.init();
}
});
},
isSwiperChange(index) {
let isSwiper = index == 0 ? true : false;
that.set("isSwiper",isSwiper);
},
borderChange(index) {
let border = index == 1 ? true : false;
that.set("border",border);
},
colChange(index) {
let col = index == 0 ? 4 : 3;
that.set("col",col);
},
click(item) {
vk.toast(`点击了${item.text}`,"none");
},
toast(title) {
this.$refs.uToast.show({
title: title,
type: 'warning'
})
},
}
};
</script>
<style scoped lang="scss">
.grid-text {
font-size: 28rpx;
margin-top: 4rpx;
color: $u-type-info;
}
.badge-icon {
position: absolute;
width: 40rpx;
height: 40rpx;
}
.swiper {
height: 480rpx;
}
.indicator-dots {
margin-top: 40rpx;
display: flex;
justify-content: center;
align-items: center;
}
.indicator-dots-item {
background-color: $u-tips-color;
height: 6px;
width: 6px;
border-radius: 10px;
margin: 0 3px;
}
.indicator-dots-active {
background-color: $u-type-primary;
}
/* start--演示页面使用的统一样式--start */
.u-demo {
padding: 50rpx 40rpx;
}
.u-demo-wrap {
border-width: 1px;
border-color: #ddd;
border-style: dashed;
background-color: rgb(250, 250, 250);
padding: 40rpx 20rpx;
border-radius: 6px;
}
.u-demo-area {
text-align: center;
}
.u-no-demo-here {
color: $u-tips-color;
font-size: 26rpx;
}
.u-demo-result-line {
border-width: 1px;
border-color: #ddd;
border-style: dashed;
padding: 10rpx 40rpx;
margin-top: 30rpx;
border-radius: 5px;
background-color: rgb(240, 240, 240);
color: $u-content-color;
font-size: 32rpx;
/* #ifndef APP-NVUE */
word-break: break-word;
display: inline-block;
/* #endif */
text-align: left;
}
.u-demo-title,
.u-config-title {
text-align: center;
font-size: 32rpx;
font-weight: bold;
margin-bottom: 40rpx;
}
.u-config-item {
margin-top: 50rpx;
}
.u-config-title {
margin-top: 40rpx;
padding-bottom: 10rpx;
}
.u-item-title {
position: relative;
font-size: 28rpx;
padding-left: 8px;
line-height: 1;
margin-bottom: 22rpx;
}
.u-item-title:after {
position: absolute;
width: 4px;
top: -1px;
height: 16px;
/* #ifndef APP-NVUE */
content: '';
/* #endif */
left: 0;
border-radius: 10px;
background-color: $u-content-color;
}
/* end--演示页面使用的统一样式--end */
</style>
pages_template/components-dynamic/vk-u-notice-bar/vk-u-notice-bar.vue 0 → 100644
浏览文件 @ d2e75c3c
<template>
<view class="app u-demo">
<!-- 页面内容开始 -->
<view class="u-demo-wrap">
<view class="u-demo-title">演示效果</view>
<view class="u-demo-area">
<u-toast :type="type" ref="uToast"></u-toast>
<vk-u-notice-bar :datas='componentsDynamic["vk-test-notice-bar-01"]' :custom-datas="customDatas" @click="click" @getMore="getMore"></vk-u-notice-bar>
<vk-u-notice-bar :datas='componentsDynamic["vk-test-notice-bar-02"]' :custom-datas="customDatas" @click="click" @getMore="getMore"></vk-u-notice-bar>
<vk-u-notice-bar :datas='componentsDynamic["vk-test-notice-bar-03"]' :custom-datas="customDatas" @click="click" @getMore="getMore"></vk-u-notice-bar>
<vk-u-notice-bar :datas='componentsDynamic["vk-test-notice-bar-04"]' :custom-datas="customDatas" @click="click" @getMore="getMore"></vk-u-notice-bar>
</view>
</view>
<view class="u-config-wrap">
<view class="u-config-title u-border-bottom">
数据库交互
</view>
<view class="u-config-item">
<view class="u-item-title">修改公告1组件的数据库内容</view>
<u-subsection vibrateShort :list="['还原公告1的内容', '修改公告1的内容']" @change="dataChange1"></u-subsection>
</view>
<view class="u-config-item">
<view class="u-item-title">修改公告2组件的数据库内容</view>
<u-subsection vibrateShort :list="['还原公告2的内容', '修改公告2的内容']" @change="dataChange2"></u-subsection>
</view>
</view>
<view class="u-config-wrap">
<view class="u-config-title u-border-bottom">
参数配置
</view>
<view class="u-config-item">
<view class="u-item-title">主题</view>
<u-subsection vibrateShort :current="3" :list="['primary', 'success', 'error', 'warning', 'none']" @change="typeChange"></u-subsection>
</view>
<view class="u-config-item">
<view class="u-item-title">滚动模式</view>
<u-subsection vibrateShort :list="['水平', '垂直']" @change="modeChange"></u-subsection>
</view>
<view class="u-config-item">
<view class="u-item-title">状态</view>
<u-subsection vibrateShort :list="['播放', '暂停']" @change="playStateChange"></u-subsection>
</view>
<view class="u-config-item">
<view class="u-item-title">图标</view>
<u-subsection vibrateShort :list="['隐藏', '显示']" @change="iconChange"></u-subsection>
</view>
</view>
<!-- 页面内容结束 -->
</view>
</template>
<script>
var that; // 当前页面对象
var app = getApp(); // 可获取全局配置
var vk; // 自定义函数集
export default {
data() {
return {
componentsDynamic:{},
customDatas:{},
}
},
// 监听 - 页面每次【加载时】执行(如：前进)
onLoad(options) {
that = this;
vk = that.vk;
//console.log("onLoad",options);
that.init(options);
},
methods: {
// 页面数据初始化函数
init(options = {}){
// 获取组件数据
vk.pubfn.getComponentsDynamicData({
that : that,
ids : [
"vk-test-notice-bar-01",
"vk-test-notice-bar-02",
"vk-test-notice-bar-03",
"vk-test-notice-bar-04"
]
});
},
set(key,value){
that.$set(that.customDatas,key,value);
},
dataChange1(index){
let data_value = {
list: []
};
if(index == 1){
// 修改
data_value.list = ["修改后的公告111111111111修改后的公告111111111111"];
}else{
// 还原
data_value.list = ["公告111公告111公告111公告111公告111公告111公告111"];
}
that.callFunction({
data_id:"vk-test-notice-bar-01",
data_value:data_value
});
},
dataChange2(index){
let data_value = {
list: []
};
if(index == 1){
// 修改
data_value.list = ["修改后的公告222222222222修改后的公告222222222222"];
}else{
// 还原
data_value.list = ["公告222公告222公告222公告222公告222公告222公告222"];
}
that.callFunction({
data_id:"vk-test-notice-bar-02",
data_value:data_value
});
},
callFunction(obj){
vk.callFunction({
url: 'components_dynamic/pub/update',
title:'请求中...',
data:{
data_id:obj.data_id,
data_value:obj.data_value
},
success(data) {
// 修改成功
that.toast(`修改成功`);
that.init();
}
});
},
typeChange(index) {
let type = ['primary', 'success', 'error', 'warning', 'none'];
that.set("type",type[index]);
},
modeChange(index) {
let mode = index == 0 ? 'horizontal' : 'vertical';
that.set("mode",mode);
},
playStateChange(index) {
let playState = index == 0 ? 'play' : 'paused';
that.set("play-state",playState);
},
iconChange(index) {
let moreIcon,volumeIcon;
if(index == 1) {
moreIcon = true;
volumeIcon = true;
} else {
moreIcon = false;
volumeIcon = false;
}
that.set("more-icon",moreIcon);
that.set("volume-icon",volumeIcon);
},
close() {
this.toast(`点击了关闭图标`);
},
click(index) {
this.toast(`点击了消息`);
},
getMore() {
this.toast(`点击了更多图标`);
},
toast(title) {
this.$refs.uToast.show({
title: title,
type: 'warning'
})
},
end() {
// console.log('end');
}
},
// 过滤器
filters:{
},
// 计算属性
computed:{
}
}
</script>
<style lang="scss" scoped>
.item {
margin-top: 30px;
}
.app {
padding: 30rpx;
}
/* start--演示页面使用的统一样式--start */
.u-demo {
padding: 50rpx 40rpx;
}
.u-demo-wrap {
border-width: 1px;
border-color: #ddd;
border-style: dashed;
background-color: rgb(250, 250, 250);
padding: 40rpx 20rpx;
border-radius: 6px;
}
.u-demo-area {
text-align: center;
}
.u-no-demo-here {
color: $u-tips-color;
font-size: 26rpx;
}
.u-demo-result-line {
border-width: 1px;
border-color: #ddd;
border-style: dashed;
padding: 10rpx 40rpx;
margin-top: 30rpx;
border-radius: 5px;
background-color: rgb(240, 240, 240);
color: $u-content-color;
font-size: 32rpx;
/* #ifndef APP-NVUE */
word-break: break-word;
display: inline-block;
/* #endif */
text-align: left;
}
.u-demo-title,
.u-config-title {
text-align: center;
font-size: 32rpx;
font-weight: bold;
margin-bottom: 40rpx;
}
.u-config-item {
margin-top: 50rpx;
}
.u-config-title {
margin-top: 40rpx;
padding-bottom: 10rpx;
}
.u-item-title {
position: relative;
font-size: 28rpx;
padding-left: 8px;
line-height: 1;
margin-bottom: 22rpx;
}
.u-item-title:after {
position: absolute;
width: 4px;
top: -1px;
height: 16px;
/* #ifndef APP-NVUE */
content: '';
/* #endif */
left: 0;
border-radius: 10px;
background-color: $u-content-color;
}
/* end--演示页面使用的统一样式--end */
</style>
pages_template/components-dynamic/vk-u-swiper/vk-u-swiper.vue 0 → 100644
浏览文件 @ d2e75c3c
<template>
<view class="u-demo">
<view class="u-demo-wrap">
<view class="u-demo-title">演示效果</view>
<view class="u-demo-area">
<u-toast ref="uToast"></u-toast>
<!-- 轮播 -->
<vk-u-swiper :datas='componentsDynamic["vk-test-index-swiper-01"]' :custom-datas='customDatas' @click="click"></vk-u-swiper>
</view>
</view>
<view class="u-config-wrap">
<view class="u-config-title u-border-bottom">
数据库交互
</view>
<view class="u-config-item">
<view class="u-item-title">修改组件动态数据内容</view>
<u-subsection vibrateShort :list="['还原组件动态数据内容', '修改组件动态数据内容']" @change="dataChange1"></u-subsection>
</view>
</view>
<view class="u-config-wrap">
<view class="u-config-title u-border-bottom">
参数配置
</view>
<view class="u-config-item">
<view class="u-item-title">指示器模式</view>
<u-subsection vibrateShort :list="['round', 'rect', 'number', 'none']" @change="modeChange"></u-subsection>
</view>
<view class="u-config-item">
<view class="u-item-title">标题</view>
<u-subsection vibrateShort current="1" :list="['显示', '隐藏']" @change="titleChange"></u-subsection>
</view>
<view class="u-config-item">
<view class="u-item-title">指示器位置</view>
<u-subsection vibrateShort current="3" :list="['上左', '上右', '下左', '下中', '下右']" @change="indicatorPosChange"></u-subsection>
</view>
<view class="u-config-item">
<view class="u-item-title">3D效果</view>
<u-subsection vibrateShort current="1" :list="['开启', '关闭']" @change="effect3dChange"></u-subsection>
</view>
</view>
</view>
</template>
<script>
var that; // 当前页面对象
var app = getApp(); // 可获取全局配置
var vk; // 自定义函数集
export default {
data() {
return {
componentsDynamic:{},
customDatas:{}
}
},
// 监听 - 页面每次【加载时】执行(如：前进)
onLoad(options) {
that = this;
vk = that.vk;
//console.log("onLoad",options);
that.init(options);
},
methods: {
// 页面数据初始化函数
init(options = {}){
// 获取组件数据
vk.pubfn.getComponentsDynamicData({
that : that,
ids : ["vk-test-index-swiper-01"]
});
},
set(key,value){
that.$set(that.customDatas,key,value);
},
dataChange1(index){
let data_value = {
list: []
};
if(index == 1){
// 修改
data_value.list = [
{
"title": "修改后的标题11111111",
"image": "https://timgsa.baidu.com/timg?image&quality=80&size=b9999_10000&sec=1598597729217&di=87219dfad2f2e615c717961e422da5c3&imgtype=0&src=http%3A%2F%2Fa0.att.hudong.com%2F56%2F12%2F01300000164151121576126282411.jpg"
},
{
"title": "修改后的标题2222222",
"image": "https://timgsa.baidu.com/timg?image&quality=80&size=b9999_10000&sec=1598597729217&di=332b8b428f7dacff6b195d7c75df5c2f&imgtype=0&src=http%3A%2F%2Fp2.so.qhimgs1.com%2Ft01dfcbc38578dac4c2.jpg"
},
{
"title": "修改后的标题3333333",
"image": "https://timgsa.baidu.com/timg?image&quality=80&size=b9999_10000&sec=1598597754654&di=cbf48b7e5f2d1c0730684584559ad06f&imgtype=0&src=http%3A%2F%2Fpicture.ik123.com%2Fuploads%2Fallimg%2F180330%2F4-1P330160644.jpg"
}
]
}else{
// 还原
data_value.list = [
{
"title": "标题11111111",
"image": "https://timgsa.baidu.com/timg?image&quality=80&size=b9999_10000&sec=1594798331539&di=fe544344d765e4f23f90457f02a2d361&imgtype=0&src=http%3A%2F%2Fpic1.win4000.com%2Fwallpaper%2F1%2F58f03bf05fddb.jpg%3Fdown"
},
{
"title": "标题2222222",
"image": "https://timgsa.baidu.com/timg?image&quality=80&size=b9999_10000&sec=1594798658581&di=bcd5486940ad88cf88a904f411c53e94&imgtype=0&src=http%3A%2F%2Fn.sinaimg.cn%2Fsinacn15%2F600%2Fw1920h1080%2F20180505%2Fad66-hacuuvt5802647.jpg"
},
{
"title": "标题3333333",
"image": "https://timgsa.baidu.com/timg?image&quality=80&size=b9999_10000&sec=1594798022306&di=ed613c19ef36df7856b383601acb2f05&imgtype=0&src=http%3A%2F%2Fimg.pconline.com.cn%2Fimages%2Fupload%2Fupc%2Ftx%2Fwallpaper%2F1306%2F17%2Fc1%2F22199754_1371460645988.jpg"
}
]
}
that.callFunction({
data_id:"vk-test-index-swiper-01",
data_value:data_value
});
},
callFunction(obj){
vk.callFunction({
url: 'components_dynamic/pub/update',
title:'请求中...',
data:{
data_id:obj.data_id,
data_value:obj.data_value
},
success(data) {
// 修改成功
that.toast(`修改成功`);
that.init();
}
});
},
titleChange(index) {
let title = index == 0 ? true : false;
that.set("title",title);
},
modeChange(index) {
let mode = index == 0 ? 'round' : index == 1 ? 'rect' : index == 2 ? 'number' : 'none';
that.set("mode",mode);
},
indicatorPosChange(index) {
let indicatorPos = index == 0 ? 'topLeft' : index == 1 ? 'topRight' : index == 2 ? 'bottomLeft' : index == 3 ? 'bottomCenter' : 'bottomRight';
that.set("indicator-pos",indicatorPos);
},
effect3dChange(index) {
let effect3d = index == 0 ? true : false;
that.set("effect3d",effect3d);
},
click(index) {
this.$refs.uToast.show({
title: `点击了第${index + 1}张图片`,
type: 'success'
})
},
change(index) {
},
toast(title) {
this.$refs.uToast.show({
title: title,
type: 'warning'
})
},
}
}
</script>
<style lang="scss" scoped>
.item {
margin: 30rpx 0;
}
.app {
padding: 30rpx;
}
/* start--演示页面使用的统一样式--start */
.u-demo {
padding: 50rpx 40rpx;
}
.u-demo-wrap {
border-width: 1px;
border-color: #ddd;
border-style: dashed;
background-color: rgb(250, 250, 250);
padding: 40rpx 20rpx;
border-radius: 6px;
}
.u-demo-area {
text-align: center;
}
.u-no-demo-here {
color: $u-tips-color;
font-size: 26rpx;
}
.u-demo-result-line {
border-width: 1px;
border-color: #ddd;
border-style: dashed;
padding: 10rpx 40rpx;
margin-top: 30rpx;
border-radius: 5px;
background-color: rgb(240, 240, 240);
color: $u-content-color;
font-size: 32rpx;
/* #ifndef APP-NVUE */
word-break: break-word;
display: inline-block;
/* #endif */
text-align: left;
}
.u-demo-title,
.u-config-title {
text-align: center;
font-size: 32rpx;
font-weight: bold;
margin-bottom: 40rpx;
}
.u-config-item {
margin-top: 50rpx;
}
.u-config-title {
margin-top: 40rpx;
padding-bottom: 10rpx;
}
.u-item-title {
position: relative;
font-size: 28rpx;
padding-left: 8px;
line-height: 1;
margin-bottom: 22rpx;
}
.u-item-title:after {
position: absolute;
width: 4px;
top: -1px;
height: 16px;
/* #ifndef APP-NVUE */
content: '';
/* #endif */
left: 0;
border-radius: 10px;
background-color: $u-content-color;
}
/* end--演示页面使用的统一样式--end */
</style>
pages_template/db-test/db-test.vue 0 → 100644
浏览文件 @ d2e75c3c
<template>
<view class="app">
<scroll-view :scroll-y="true" style="max-height: 500rpx;">
<view v-for="(item,index) in data.rows" :key="item._id">
{{index+1}}: {_id: {{ item._id.substring(20)}}, money: {{ item.money }}}
距您 {{ item.position | calcLocationStr(myPosition) }} km
</view>
</scroll-view>
<view style="margin-bottom: 20rpx;font-size: 36rpx;">当前共有: {{data.total}} 条记录</view>
<button style="margin-left: 50rpx;" @click="pageTo('list/list')">查看更多</button>
<view style="display: flex;">
<button @click="test('add')">add(添加一条记录)</button>
<button @click="test('adds')">adds(添加多条记录)</button>
</view>
<button @click="test('count')">count(获取集合共有多少条记录)</button>
<button @click="test('del')">del(删除集合所有数据)</button>
<button @click="test('findById')">findById(根据id获取一条记录)</button>
<button @click="test('findByWhereJson')">findByWhereJson(根据条件获取一条记录)</button>
<view style="display: flex;">
<button @click="getList1()">select(获取多条数据)</button>
<button @click="getList2()">select2(连表查询)</button>
</view>
<button @click="test('update')">update(修改记录)</button>
<view style="display: flex;">
<button @click="test('sum')">sum(取总和值)</button>
<button @click="test('avg')">avg(取平均值)</button>
</view>
<view style="display: flex;">
<button @click="test('max')">max(取最大值)</button>
<button @click="test('min')">min(取最小值)</button>
</view>
<button @click="getGeoList()">geo(地理位置 搜索4公里内)</button>
<view>
{{JSON.stringify(item)}}
</view>
</view>
</template>
<script>
var that; // 当前页面对象
var app = getApp(); // 可获取全局配置
var vk; // 自定义函数集
var weixinAuthService;
export default {
data() {
return {
form1:{
},
data:{
},
item:{},
myPosition:{
longitude:120.12792,
latitude:30.228932
}
}
},
onLoad(options) {
that = this;
vk = that.vk;
that.init(options);
},
methods: {
// 页面数据初始化函数
init(options){
that.getList();
},
pageTo(url){
uni.navigateTo({
url:url
})
},
test(name){
let data = {};
if(that.data && that.data.rows[0] && that.data.rows[0]._id){
data._id = that.data.rows[0]._id;
}
vk.callFunction({
url: 'db_test/pub/'+name,
title:'请求中...',
data:data,
success(data) {
setTimeout(function(){
vk.alert(JSON.stringify(data));
},300);
that.item = data;
that.getList();
}
});
},
getList(){
vk.callFunction({
url: 'db_test/pub/select',
title:'请求中...',
data:{},
success(data) {
that.data = data;
}
});
},
getList1(){
vk.callFunction({
url: 'db_test/pub/select',
title:'请求中...',
data:{},
success(data) {
that.data = data;
setTimeout(function(){
vk.alert(JSON.stringify(data));
},300);
that.item = data;
}
});
},
getList2(){
vk.callFunction({
url: 'db_test/pub/select2',
title:'请求中...',
data:{},
success(data) {
that.data = data;
setTimeout(function(){
vk.alert(JSON.stringify(data));
},300);
that.item = data;
}
});
},
getGeoList(name){
vk.callFunction({
url: 'db_test/pub/geo',
title:'请求中...',
data:{
},
success(data) {
that.data = data;
}
});
},
calcLocation(mbPosition = {}, myPosition = {}){
if(myPosition.longitude == undefined || myPosition.latitude == undefined){
return "";
}
console.log(mbPosition,myPosition);
var res = {};
var m = 0;
var km = 0;
var lng1 = myPosition.longitude;
var lat1 = myPosition.latitude;
var lng2 = mbPosition.longitude;
var lat2 = mbPosition.latitude;
m = Math.sqrt((lng1 - lng2) * (lng1 - lng2) + (lat1 - lat2) * (lat1 - lat2)) / 180 * Math.PI * 6300000;
m = m.toFixed(1);
km = (m / 1000).toFixed(2);
if(m >= 1000000){
res.str = "很遥远";
}else if(m >= 1000){
res.str = km+" km";
}else{
res.str = m+" m";
}
res.m = m;
res.km = km;
return res;
},
},
filters:{
calcLocationStr(mbPosition = {}, myPosition = {}){
return that.calcLocation(mbPosition,myPosition).km;
}
}
}
</script>
<style>
.app {
padding: 15px;
}
.app input {
height: 46px;
border: solid 1px #DDDDDD;
border-radius: 5px;
margin-bottom: 15px;
padding: 0px 15px;
}
.app button {
margin-bottom: 15px;
font-size: 32rpx;
}
.app navigator {
display: inline-block;
color: #007AFF;
border-bottom: solid 1px #007AFF;
font-size: 16px;
line-height: 24px;
margin-bottom: 15px;
}
</style>
pages_template/db-test/list/list.vue 0 → 100644
浏览文件 @ d2e75c3c
<template>
<view class="app">
<!-- 页面内容开始 -->
<view class="vk-list-view">
<!--头部开始 -->
<view class="list-head">
<view class="list-search">
<u-search placeholder="输入金额搜索" v-model="form1.searchvalue"
:show-action="false" input-align="center" shape="square" @search="onSearch">
</u-search>
</view>
<view class="list-head-desc-text">共<text class="list-head-text-num">{{data.total}}</text>条记录</view>
</view>
<!--头部结束 -->
<!--无内容时 -->
<view v-if="data.list.length == 0" style="padding: 40% 0 80% 0;">
<u-empty text="暂无内容" mode="list"></u-empty>
</view>
<!--有内容时开始-->
<view v-if="data.list.length > 0" class="list-view my-list-view">
<view v-for="(item,index) in data.list" :key="item._id">
<!-- 自定义item的内容开始 -->
<view @click="itemBtn(item)" style="display: block;height: 200rpx;background-color: #FFFFFF;margin: 20rpx;">
{{index+1}}: {_id: {{ item._id.substring(20)}}, money: {{ item.money }}}
此处为你自己写的UI样式
</view>
<!-- 自定义item的内容结束 -->
</view>
<!-- 加载更多 -->
<u-loadmore :status="data.loadmore" bg-color="#f8f8fa" margin-bottom="30" @loadmore="nextPage"/>
</view>
<!--有内容时结束-->
</view>
<!-- 页面内容结束 -->
</view>
</template>
<script>
var that; // 当前页面对象
var app = getApp(); // 可获取全局配置
var vk; // 自定义函数集
export default {
data() {
// 页面数据变量
return {
url:"db_test/pub/getList", // 获取list数据的云函数请求路径
// init请求返回的数据
data:{
list:[], // 列表数据
pageKey:true, // 是否还能加载下一页
loadmore:"loading",
},
// 表单请求数据
form1:{
addTime:"",
endTime:"",
searchvalue:"",
pageNum:1, //当前页码
pageSize:10, //每页显示数量
},
scrollTop:0,
}
},
// 监听 - 原生导航自定义菜单(仅限:App、H5)
onNavigationBarButtonTap(e) {
vk.onNavigationBarButtonTap({e,that});
},
// 监听 - 原生返回按钮
onBackPress(e) {
console.log("返回按钮",e);
},
onPageScroll(e) {
that.scrollTop = e.scrollTop;
},
// 监听 - 页面每次【加载时】执行(如：前进)
onLoad(options = {}) {
that = this;
vk = that.vk;
that.options = options;
that.init(options);
},
// 监听 - 页面【首次渲染完成时】执行。注意如果渲染速度快，会在页面进入动画完成前触发
onReady(){
},
// 监听 - 页面每次【显示时】执行(如：前进和返回) (页面每次出现在屏幕上都触发，包括从下级页面点返回露出当前页面)
onShow() {
},
// 监听 - 页面每次【隐藏时】执行(如：返回)
onHide() {
},
// 监听 - 页面下拉刷新
onPullDownRefresh() {
setTimeout(function () {
uni.stopPullDownRefresh();
}, 1000);
},
// 监听 - 页面触底部
onReachBottom(options){
that.nextPage();
},
// 监听 - 窗口尺寸变化(仅限:App、微信小程序)
onResize(){
},
// 监听 - 点击右上角转发时
onShareAppMessage(options) {
},
// 函数
methods: {
// 页面数据初始化函数
init(options){
console.log("init: ",options);
that.getList({
success:function(){
}
});
},
pageTo(path){
vk.navigateTo(path);
},
// 查询list数据
getList(obj = {}){
vk.pubfn.getListData({
that : that,
url : that.url,
success : obj.success
});
},
// 加载下一页数据
nextPage() {
if(that.data.loadmore == "loadmore"){
that.data.loadmore = "loading";
that.form1.pageNum++;
that.getList();
}
},
// 搜索
onSearch(e){
console.log("搜索",that.form1.searchvalue);
that.form1.pageNum = 1;
that.data.pageKey = true;
that.getList();
},
// 列的点击事件
itemBtn(item){
console.log("点击",item);
vk.toast("点击"+item._id.substring(20));
}
},
// 过滤器
filters:{
},
// 计算属性
computed:{
}
}
</script>
<style lang="scss" scoped>
page{
background-color: #f8f8fa;
}
/* list 开始 */
.vk-list-view {
background-color: #f8f8fa;
}
.vk-list-view .list-view{
padding: 0rpx 0rpx 20rpx 0rpx;
}
.vk-list-view .list-search{
background-color: #FFFFFF;
padding: 20rpx 30rpx;
}
.vk-list-view .list-head-desc-text {
font-size: 28rpx;
color: #999;
padding: 20rpx 30rpx 0rpx 30rpx;
padding-bottom: 0;
line-height: 52rpx;
width: 100%;
}
.vk-list-view .list-head-text-num{
font-weight: bold;
color: black;
font-size: 26rpx;
margin-left: 10rpx;
margin-right: 10rpx;
}
/* list 结束 */
</style>
pages_template/uni-id/alipay/alipay.vue 0 → 100644
浏览文件 @ d2e75c3c
<template>
<view class="content">
<button type="default" @tap="loginByAlipay">支付宝登录</button>
<button type="default" @tap="code2SessionAlipay">获取支付宝openid</button>
<button type="default" @tap="bindAlipay">绑定支付宝</button>
<button type="default" @tap="unbindAlipay">解绑支付宝</button>
</view>
</template>
<script>
var that; // 当前页面对象
var app = getApp(); // 可获取全局配置
var vk; // 自定义函数集
export default {
data() {
return {
}
},
onLoad(options) {
that = this;
vk = that.vk;
},
methods: {
// 支付宝登陆
loginByAlipay(){
vk.userCenter.loginByAlipay({
success:function(data){
vk.alert("登录成功");
}
});
},
// 获取支付宝openid
code2SessionAlipay() {
vk.userCenter.code2SessionAlipay({
success:function(data){
vk.alert(JSON.stringify(data));
},
});
},
// 绑定支付宝
bindAlipay(){
vk.userCenter.bindAlipay({
success:function(data){
vk.alert("绑定成功");
}
});
},
// 解绑支付宝
unbindAlipay(){
vk.userCenter.unbindAlipay({
success:function(data){
vk.alert("解绑成功");
}
});
}
}
}
</script>
<style lang="scss" scoped>
.content {
padding: 15px;
}
.content input {
height: 46px;
border: solid 1px #DDDDDD;
border-radius: 5px;
margin-bottom: 15px;
padding: 0px 15px;
}
.content button {
margin-bottom: 15px;
}
.content navigator {
display: inline-block;
color: #007AFF;
border-bottom: solid 1px #007AFF;
font-size: 16px;
line-height: 24px;
margin-bottom: 15px;
}
.tips {
text-align: center;
line-height: 20px;
font-size: 14px;
color: #999999;
margin-bottom: 20px;
}
</style>
\ No newline at end of file
pages_template/uni-id/email/email.vue 0 → 100644
浏览文件 @ d2e75c3c
<template>
<view class="content">
<input type="text" placeholder="邮箱" v-model="form1.email" />
<input type="text" placeholder="验证码" v-model="form1.code" />
<view class="tips" style="color: red;">上次发送的验证码：{{form1.code}}</view>
<view class="title">邮箱注册&登录相关</view>
<view style="display: flex;">
<button type="default" @tap="sendEmailCode('login')">真实-发送验证码</button>
<button type="default" @tap="setVerifyCode('login')">模拟-发送验证码</button>
</view>
<button type="default" @tap="loginByEmail">邮箱验证码登录（不存在则注册）</button>
<view class="title">绑定邮箱相关</view>
<view style="display: flex;">
<button type="default" @tap="sendEmailCode('bind')">真实-发送验证码</button>
<button type="default" @tap="setVerifyCode('bind')">模拟-发送验证码</button>
</view>
<button type="default" @tap="bindEmail">绑定邮箱（需先登录）</button>
<view class="tips">绑定邮箱时如果不传验证码或者传空则直接绑定并设置email_confirmed为1，不会去校验验证码</view>
<view class="title">解绑邮箱相关</view>
<view style="display: flex;">
<button type="default" @tap="sendEmailCode('unbind')">真实-发送验证码</button>
<button type="default" @tap="setVerifyCode('unbind')">模拟-发送验证码</button>
</view>
<button type="default" @tap="unbindEmail">解绑邮箱（需先登录）</button>
<view class="tips">解绑邮箱时如果不传验证码或者传空则直接解除绑定绑定，不会去校验验证码</view>
</view>
</template>
<script>
var that; // 当前页面对象
var app = getApp(); // 可获取全局配置
var vk; // 自定义函数集
export default {
data() {
return {
form1:{
email: '370725567@qq.com',
code: ''
}
}
},
onLoad(options) {
that = this;
vk = that.vk;
},
methods: {
// 为了演示把这个逻辑放在客户端
getCode() {
const randomStr = '00000' + Math.floor(Math.random() * 1000000)
that.form1.code = randomStr.substring(randomStr.length - 6)
},
sendEmailCode(type) {
if (!/.+@.+/.test(that.form1.email)) {
uni.showModal({
content: '请输入正确的邮箱',
showCancel: false
})
return
}
var form1 = that.form1;
vk.userCenter.sendEmailCode({
data:{
serviceType:"qq",
email: form1.email,
type: type,
},
success:function(data){
vk.alert("邮件发送成功");
}
});
},
setVerifyCode(type) {
if (!/.+@.+/.test(that.form1.email)) {
uni.showModal({
content: '请输入正确的邮箱',
showCancel: false
})
return
}
that.getCode();
var form1 = that.form1;
vk.userCenter.setVerifyCode({
data:{
email: form1.email,
code: form1.code,
type: type,
},
success:function(data){
vk.toast("发送成功");
}
});
},
// 邮箱登录
loginByEmail() {
var form1 = that.form1;
vk.userCenter.loginByEmail({
data:form1,
success:function(data){
vk.alert("登录成功");
}
});
},
// 绑定邮箱
bindEmail(){
var form1 = that.form1;
vk.userCenter.bindEmail({
data:form1,
success:function(data){
vk.alert("绑定成功");
}
});
},
// 解绑邮箱
unbindEmail(){
var form1 = that.form1;
vk.userCenter.unbindEmail({
data:form1,
success:function(data){
vk.alert("解绑成功");
}
});
}
}
}
</script>
<style lang="scss" scoped>
.content {
padding: 15px;
}
.content input {
height: 46px;
border: solid 1px #DDDDDD;
border-radius: 5px;
margin-bottom: 15px;
padding: 0px 15px;
}
.content button {
margin-bottom: 15px;
}
.content navigator {
display: inline-block;
color: #007AFF;
border-bottom: solid 1px #007AFF;
font-size: 16px;
line-height: 24px;
margin-bottom: 15px;
}
.tips {
text-align: center;
line-height: 20px;
font-size: 14px;
color: #999999;
margin-bottom: 20px;
}
.title{
font-size: 36rpx;
margin-bottom: 20rpx;
}
</style>
pages_template/uni-id/index/index.vue 0 → 100644
浏览文件 @ d2e75c3c
<template>
<view class="content">
<view style="margin-bottom: 20rpx;font-size: 32rpx;">
当前集成的
<text style="font-weight: bold;margin: 0 10rpx;">uni-id</text>
版本：
<text style="font-weight: bold;">1.1.5</text>
</view>
<button type="default" @tap="pageTo('../password/password')">用户名和密码</button>
<button type="default" @tap="pageTo('../mobile/mobile')">手机号和验证码</button>
<button type="default" @tap="pageTo('../email/email')">邮箱与验证码</button>
<!-- #ifdef APP-PLUS || MP-WEIXIN -->
<button type="default" @tap="pageTo('../weixin/weixin')">微信登录</button>
<!-- #endif -->
<!-- #ifdef MP-ALIPAY -->
<button type="default" @tap="pageTo('../alipay/alipay')">支付宝登录</button>
<!-- #endif -->
<view style="margin-bottom: 20rpx;">uni-id 1.1.3 新增 分销裂变</view>
<button type="default" @tap="pageTo('../util/util')">通用方法</button>
<view style="margin-bottom: 20rpx;">插件版本1.2.2 新增 数据库调用方法</view>
<button type="default" @tap="pageTo('../../db-test/db-test')">数据库调用方法</button>
<view style="margin-bottom: 20rpx;">插件版本1.2.9 新增 动态数据组件</view>
<button type="default" @tap="pageTo('../../components-dynamic/index/index')">动态数据组件</button>
<view style="margin-bottom: 20rpx;">插件版本1.3.3 新增 登录/注册/找回密码/页面模板</view>
<button type="default" @tap="pageTo('../login/index/index')">登录注册找回密码页面模板</button>
</view>
</template>
<script>
var that; // 当前页面对象
var app = getApp(); // 可获取全局配置
var vk; // 自定义函数集
export default {
data() {
return {
}
},
onLoad(options) {
that = this;
vk = that.vk;
},
methods: {
pageTo(url){
uni.navigateTo({
url: url
});
}
}
}
</script>
<style lang="scss" scoped>
.content {
padding: 15px;
}
.content input {
height: 46px;
border: solid 1px #DDDDDD;
border-radius: 5px;
margin-bottom: 15px;
padding: 0px 15px;
}
.content button {
margin-bottom: 15px;
}
.content navigator {
display: inline-block;
color: #007AFF;
border-bottom: solid 1px #007AFF;
font-size: 16px;
line-height: 24px;
margin-bottom: 15px;
}
.tips {
text-align: center;
line-height: 20px;
font-size: 14px;
color: #999999;
margin-bottom: 20px;
}
</style>
pages_template/uni-id/login/css/main.css 0 → 100644
浏览文件 @ d2e75c3c
.content {
display: flex;
flex-direction: column;
justify-content:center;
}
/* 头部 logo */
.header {
width:161rpx;
height:161rpx;
box-shadow:0rpx 0rpx 60rpx 0rpx rgba(0,0,0,0.1);
border-radius:50%;
background-color: #000000;
margin-top: 40rpx;
margin-bottom: 40rpx;
margin-left: auto;
margin-right: auto;
}
.header image{
width:161rpx;
height:161rpx;
border-radius:50%;
}
/* 主体 */
.main {
display: flex;
flex-direction: column;
padding-left: 70rpx;
padding-right: 70rpx;
}
.tips {
color: #999999;
font-size: 28rpx;
margin-top: 64rpx;
margin-left: 48rpx;
}
/* 登录按钮 */
.wbutton{
margin-top: 96rpx;
}
/* 其他登录方式 */
.other_login{
display: flex;
flex-direction: row;
justify-content: center;
align-items: center;
margin-top: 256rpx;
text-align: center;
}
.login_icon{
border: none;
font-size: 64rpx;
margin: 0 64rpx 0 64rpx;
color: rgba(0,0,0,0.7)
}
.wechat_color{
color: #83DC42;
}
.weibo_color{
color: #F9221D;
}
.github_color{
color: #24292E;
}
/* 底部 */
.footer{
display: flex;
flex-direction: row;
justify-content: center;
align-items: center;
font-size: 28rpx;
margin-top: 50rpx;
color: rgba(0,0,0,0.7);
text-align: center;
height: 40rpx;
line-height: 40rpx;
}
.footer text{
font-size: 24rpx;
margin-left: 15rpx;
margin-right: 15rpx;
}
.main-list{
display: flex;
flex-direction: row;
justify-content: space-between;
align-items: center;
color: #333333;
padding: 24rpx 32rpx;
margin:26rpx 0;
}
.img{
width: 32rpx;
height: 32rpx;
font-size: 32rpx;
}
.main-input{
flex: 1;
text-align: left;
font-size: 28rpx;
padding-right: 10rpx;
margin-left: 20rpx;
}
.vercode {
color: rgba(0,0,0,0.7);
font-size: 24rpx;
/* line-height: 100rpx; */
}
.vercode-run {
color: rgba(0,0,0,0.4) !important;
}
.oBorder{
border: none;
border-radius: 2.5rem ;
-webkit-box-shadow: 0 0 60rpx 0 rgba(43,86,112,.1) ;
box-shadow: 0 0 60rpx 0 rgba(43,86,112,.1) ;
}
.login-btn{
margin-top: 60rpx;
width: 80%;
height: 100rpx;
margin-left: auto;
margin-right: auto;
}
.login-btn2{
margin-top: 60rpx;
width: 80%;
height: 100rpx;
background: linear-gradient(to right, rgba(0, 0, 0, 0.7), rgba(0, 0, 0, 0.6));
color: rgb(255, 255, 255);
margin-left: auto;
margin-right: auto;
}
.other_login{
margin-top: 150rpx;
}
.login .footer{
margin-top: 80rpx;
}
pages_template/uni-id/login/forget/forget.vue 0 → 100644
浏览文件 @ d2e75c3c
<template>
<view class="app forget">
<!-- 页面内容开始 -->
<view class="content">
<!-- 主体 -->
<view class="main">
<view class="tips">若你忘记了密码，可在此重置新密码。</view>
<view class="main-list oBorder">
<!-- 文本框 -->
<u-input
class="main-input"
v-model="form1.mobile"
type="text"
:maxlength="11"
placeholder="请输入手机号码"
placeholder-style="'color':'#8e8e8e'"
/>
</view>
<view class="main-list oBorder">
<!-- 文本框 -->
<u-input
class="main-input"
v-model="form1.password"
type="password"
placeholder="请输入新密码"
placeholder-style="'color':'#8e8e8e'"
/>
</view>
<view class="main-list oBorder">
<!-- 文本框 -->
<u-input
class="main-input"
v-model="form1.password2"
type="password"
placeholder="请再次输入新密码"
placeholder-style="'color':'#8e8e8e'"
/>
</view>
<view class="main-list oBorder">
<!-- 文本框 -->
<u-input
class="main-input"
v-model="form1.code"
type="number"
:maxlength="6"
placeholder="请输入验证码"
placeholder-style="'color':'#8e8e8e'"
/>
<!-- 验证码倒计时开始 -->
<vk-pub-code seconds="60" :mobile="form1.mobile" type="reset"></vk-pub-code>
<!-- 验证码倒计时结束 -->
</view>
</view>
<u-button shape="circle" class="login-btn" @click="resetPassword" :plain="false" :hair-line="false" type="success">重置密码</u-button>
</view>
<!-- 页面内容结束 -->
</view>
</template>
<script>
var that; // 当前页面对象
var app = getApp(); // 可获取全局配置
var vk; // 自定义函数集
export default {
data() {
// 页面数据变量
return {
// init请求返回的数据
data:{
},
// 表单请求数据
form1:{
mobile:"",
password:"",
password2:"",
code:""
},
scrollTop:0,
isRotate:false
}
},
// 监听 - 原生导航自定义菜单(仅限:App、H5)
onNavigationBarButtonTap(e) {
vk.onNavigationBarButtonTap({e,that});
},
// 监听 - 原生返回按钮
onBackPress(e) {
console.log("返回按钮",e);
},
onPageScroll(e) {
that.scrollTop = e.scrollTop;
},
// 监听 - 页面每次【加载时】执行(如：前进)
onLoad(options) {
that = this;
vk = that.vk;
//console.log("onLoad",options);
that.init(options);
},
// 监听 - 页面【首次渲染完成时】执行。注意如果渲染速度快，会在页面进入动画完成前触发
onReady(){
},
// 监听 - 页面每次【显示时】执行(如：前进和返回) (页面每次出现在屏幕上都触发，包括从下级页面点返回露出当前页面)
onShow() {
},
// 监听 - 页面每次【隐藏时】执行(如：返回)
onHide() {
},
// 监听 - 页面下拉刷新
onPullDownRefresh() {
setTimeout(function () {
uni.stopPullDownRefresh();
}, 1000);
},
// 监听 - 页面触底部
onReachBottom(){
},
// 监听 - 窗口尺寸变化(仅限:App、微信小程序)
onResize(){
},
// 监听 - 点击右上角转发时
onShareAppMessage(options) {
},
// 监听 - 页面创建时
created() {
},
// 函数
methods: {
// 页面数据初始化函数
init(options = {}){
console.log("init: ",options);
},
pageTo(path){
vk.navigateTo(path);
},
resetPassword() {
const { mobile, code, password, password2 } = that.form1;
//重置密码
if(that.isRotate){
//判断是否加载中，避免重复点击请求
return false;
}
if(!vk.pubfn.checkStr(mobile, 'mobile')){
vk.toast('请输入正确的手机号码',"none");
return;
}
if(!vk.pubfn.checkStr(password, 'pwd')){
vk.toast('密码以字母开头，长度在6~18之间，只能包含字母、数字和下划线',"none");
return;
}
if(!vk.pubfn.checkStr(password2, 'pwd')){
vk.toast('密码以字母开头，长度在6~18之间，只能包含字母、数字和下划线',"none");
return;
}
if(password != password2){
vk.toast('两次密码必须相同!',"none");
return;
}
if(!vk.pubfn.checkStr(code, 'mobileCode')){
vk.toast('验证码格式为6位数字',"none");
return;
}
that.isRotate = true;
vk.userCenter.resetPasswordByMobile({
data:that.form1,
success:function(data){
that.isRotate = false;
vk.alert("密码重置成功,新密码为:"+password,function(){
// 进入首页
vk.redirectTo("../index/index");
});
}
});
}
},
// 过滤器
filters:{
},
// 计算属性
computed:{
}
}
</script>
<style lang="scss" scoped>
@import url("../css/main.css");
</style>
pages_template/uni-id/login/index/index.vue 0 → 100644
浏览文件 @ d2e75c3c
此差异已折叠。
pages_template/uni-id/login/register/register.vue 0 → 100644
浏览文件 @ d2e75c3c
此差异已折叠。
pages_template/uni-id/mobile/mobile.vue 0 → 100644
浏览文件 @ d2e75c3c
<template>
<view class="content">
<input type="text" placeholder="手机号" v-model="form1.mobile" />
<input type="text" placeholder="验证码" v-model="form1.code" />
<view class="tips" style="color: red;">上次发送的验证码：{{form1.code}}</view>
<view class="title">手机号注册&登录相关</view>
<view style="display: flex;">
<button type="default" @tap="sendSmsCode('login')">真实-发送验证码</button>
<button type="default" @tap="setVerifyCode('login')">模拟-发送验证码</button>
</view>
<button type="default" @tap="loginBySms">短信验证码登录（不存在则注册）</button>
<view class="tips">如果不使用uni-id自带的发送验证码功能，可以自行调用接口设置验证码，参数与发送验证码一致</view>
<view class="title">绑定手机相关</view>
<view style="display: flex;">
<button type="default" @tap="sendSmsCode('bind')">真实-发送验证码</button>
<button type="default" @tap="setVerifyCode('bind')">模拟-发送验证码</button>
</view>
<button type="default" @tap="bindMobile">绑定手机号（需先登录）</button>
<view class="tips">绑定手机时如果不传验证码或者传空则直接绑定并设置mobile_confirmed为1，不会去校验验证码</view>
<view class="title">解绑手机相关</view>
<view style="display: flex;">
<button type="default" @tap="sendSmsCode('unbind')">真实-发送验证码</button>
<button type="default" @tap="setVerifyCode('unbind')">模拟-发送验证码</button>
</view>
<button type="default" @tap="unbindMobile">解绑手机（需先登录）</button>
<view class="tips">解绑手机时如果不传验证码或者传空则直接解除绑定绑定，不会去校验验证码</view>
<view class="title">手机号验证码重置密码</view>
<view style="display: flex;">
<button type="default" @tap="sendSmsCode('reset')">真实-发送验证码</button>
<button type="default" @tap="setVerifyCode('reset')">模拟-发送验证码</button>
</view>
<button type="default" @tap="resetPasswordByMobile">重置密码（需先登录）</button>
<view class="tips">重置密码时如果不传验证码或者传空则直接解除绑定绑定，不会去校验验证码</view>
</view>
</template>
<script>
var that; // 当前页面对象
var app = getApp(); // 可获取全局配置
var vk; // 自定义函数集
export default {
data() {
return {
form1:{
mobile: '15200000001',
code: '',
password:"123456"
}
}
},
onLoad(options) {
that = this;
vk = that.vk;
},
methods: {
// 为了演示把这个逻辑放在客户端
getCode() {
const randomStr = '00000' + Math.floor(Math.random() * 1000000)
that.form1.code = randomStr.substring(randomStr.length - 6)
},
sendSmsCode(type) {
if (!/^1\d{10}$/.test(that.form1.mobile)) {
uni.showModal({
content: '请输入正确的手机号',
showCancel: false
})
return
}
var form1 = that.form1;
vk.userCenter.sendSmsCode({
data:{
mobile: form1.mobile,
type: type,
},
success:function(data){
vk.alert("短信发送成功");
}
});
},
setVerifyCode(type) {
if (!/^1\d{10}$/.test(this.form1.mobile)) {
uni.showModal({
content: '请输入正确的手机号',
showCancel: false
})
return
}
that.getCode();
var form1 = that.form1;
vk.userCenter.setVerifyCode({
data:{
mobile: form1.mobile,
code: form1.code,
type: type,
},
success:function(data){
vk.toast("发送成功");
}
});
},
// 登录(手机号+验证码)
loginBySms() {
var form1 = that.form1;
vk.userCenter.loginBySms({
data:form1,
success:function(data){
vk.alert("登录成功");
}
});
},
// 绑定手机号
bindMobile(){
var form1 = that.form1;
vk.userCenter.bindMobile({
data:form1,
success:function(data){
vk.alert("绑定成功");
}
});
},
// 解绑手机
unbindMobile(){
var form1 = that.form1;
vk.userCenter.unbindMobile({
data:form1,
success:function(data){
vk.alert("解绑成功");
}
});
},
// 手机验证码充值账号密码
resetPasswordByMobile(){
var form1 = that.form1;
vk.userCenter.resetPasswordByMobile({
data:form1,
success:function(data){
vk.alert("密码重置成功,新密码为:"+form1.password);
}
});
}
}
}
</script>
<style lang="scss" scoped>
.content {
padding: 15px;
}
.content input {
height: 46px;
border: solid 1px #DDDDDD;
border-radius: 5px;
margin-bottom: 15px;
padding: 0px 15px;
}
.content button {
margin-bottom: 15px;
}
.content navigator {
display: inline-block;
color: #007AFF;
border-bottom: solid 1px #007AFF;
font-size: 16px;
line-height: 24px;
margin-bottom: 15px;
}
.tips {
text-align: center;
line-height: 20px;
font-size: 14px;
color: #999999;
margin-bottom: 20px;
}
.title{
font-size: 36rpx;
margin-bottom: 20rpx;
}
</style>
\ No newline at end of file
pages_template/uni-id/password/password.vue 0 → 100644
浏览文件 @ d2e75c3c
<template>
<view class="content">
<input type="text" v-model="form1.username" placeholder="用户名/邮箱/手机号" />
<input type="text" v-model="form1.password" password="true" placeholder="密码" />
<button type="default" @tap="register">注册</button>
<button type="default" @tap="login">登录</button>
<button type="default" @tap="updatePwd">修改密码</button>
<button type="default" @tap="resetPwd">重设密码</button>
</view>
</template>
<script>
var that; // 当前页面对象
var app = getApp(); // 可获取全局配置
var vk; // 自定义函数集
export default {
data() {
return {
form1:{
username: 'admin',
password: '123456'
}
}
},
onLoad(options) {
that = this;
vk = that.vk;
},
methods: {
// 用户注册
register(){
var form1 = that.form1;
vk.userCenter.register({
data:form1,
success:function(data){
vk.alert("注册成功!");
}
});
},
// 用户登陆
login(){
var form1 = that.form1;
vk.userCenter.login({
data:form1,
success:function(data){
vk.alert("登陆成功!");
}
});
},
// 修改密码
updatePwd(){
var form1 = that.form1;
vk.userCenter.updatePwd({
data:{
oldPassword: "123456",
newPassword: "123456",
password_confirmation: "123456"
},
success:function(data){
vk.alert("修改成功");
}
});
},
// 重置密码
resetPwd(){
var form1 = that.form1;
vk.userCenter.resetPwd({
success:function(data){
vk.alert("密码已重置为123456");
}
});
}
}
}
</script>
<style lang="scss" scoped>
.content {
padding: 15px;
}
.content input {
height: 46px;
border: solid 1px #DDDDDD;
border-radius: 5px;
margin-bottom: 15px;
padding: 0px 15px;
}
.content button {
margin-bottom: 15px;
}
.content navigator {
display: inline-block;
color: #007AFF;
border-bottom: solid 1px #007AFF;
font-size: 16px;
line-height: 24px;
margin-bottom: 15px;
}
.tips {
text-align: center;
line-height: 20px;
font-size: 14px;
color: #999999;
margin-bottom: 20px;
}
</style>
pages_template/uni-id/util/util.vue 0 → 100644
浏览文件 @ d2e75c3c
<template>
<view class="content">
<button type="default" @tap="setAvatar">设置头像</button>
<button type="default" @tap="updateUser">更新用户信息</button>
<button type="default" @tap="checkToken">token校验</button>
<button type="default" @tap="setUserInviteCode">设置邀请码</button>
<view class="tips">设置邀请码时如果传入邀请码则设置传入的邀请码，如果不传则随机生成6位邀请码</view>
<input type="text" v-model="form1.inviteCode" placeholder="邀请码" />
<button type="default" @tap="acceptInvite">接受邀请</button>
<button type="default" @tap="logout">退出</button>
</view>
</template>
<script>
var that; // 当前页面对象
var app = getApp(); // 可获取全局配置
var vk; // 自定义函数集
export default {
data() {
return {
form1:{
inviteCode:""
}
}
},
onLoad(options) {
that = this;
vk = that.vk;
},
methods: {
// 设置头像
setAvatar(){
var form1 = that.form1;
vk.userCenter.setAvatar({
data:{
avatar:"https://timgsa.baidu.com/timg?image&quality=80&size=b9999_10000&sec=1594798658581&di=bcd5486940ad88cf88a904f411c53e94&imgtype=0&src=http%3A%2F%2Fn.sinaimg.cn%2Fsinacn15%2F600%2Fw1920h1080%2F20180505%2Fad66-hacuuvt5802647.jpg",
},
success:function(data){
vk.alert("设置成功");
}
});
},
updateUser() {
var form1 = that.form1;
vk.userCenter.updateUser({
data:{
nickname:"剑圣李白",
},
success:function(data){
vk.alert("更新成功");
}
});
},
// token校验
checkToken(){
vk.userCenter.checkToken({
success:function(data){
vk.alert("token有效");
}
});
},
// 退出
logout(){
vk.userCenter.logout({
success:function(data){
vk.alert("退出成功");
}
});
},
setUserInviteCode() {
vk.userCenter.setUserInviteCode({
success:function(data){
vk.alert(data.msg);
}
});
},
acceptInvite() {
var form1 = that.form1;
if (!form1.inviteCode) {
vk.alert("请填写邀请码");
return;
}
vk.userCenter.acceptInvite({
data:form1,
success:function(data){
vk.alert("接收邀请成功");
}
});
}
}
}
</script>
<style lang="scss" scoped>
.content {
padding: 15px;
}
.content input {
height: 46px;
border: solid 1px #DDDDDD;
border-radius: 5px;
margin-bottom: 15px;
padding: 0px 15px;
}
.content button {
margin-bottom: 15px;
}
.content navigator {
display: inline-block;
color: #007AFF;
border-bottom: solid 1px #007AFF;
font-size: 16px;
line-height: 24px;
margin-bottom: 15px;
}
.tips {
text-align: center;
line-height: 20px;
font-size: 14px;
color: #999999;
margin-bottom: 20px;
}
</style>
\ No newline at end of file
pages_template/uni-id/weixin/weixin.vue 0 → 100644
浏览文件 @ d2e75c3c
<template>
<view class="content">
<!-- #ifdef MP-WEIXIN -->
<button type="default" @tap="loginByWeixin">微信登录</button>
<button type="default" @tap="code2SessionWeixin">获取微信openid</button>
<button type="default" @tap="bindWeixin">绑定微信</button>
<button type="default" @tap="unbindWeixin">解绑微信</button>
<!-- #endif -->
<!-- #ifdef APP-PLUS -->
<template v-if="hasWeixinAuth">
<button type="default" @tap="loginByWeixin">微信登录</button>
<button type="default" @tap="bindWeixin">绑定微信</button>
<button type="default" @tap="unbindWeixin">解绑微信</button>
</template>
<template v-else>
<view class="tips">未包含微信登录模块</view>
</template>
<!-- #endif -->
</view>
</template>
<script>
var that; // 当前页面对象
var app = getApp(); // 可获取全局配置
var vk; // 自定义函数集
export default {
data() {
return {
hasWeixinAuth: false
}
},
onLoad(options) {
that = this;
vk = that.vk;
},
methods: {
// 微信登陆
loginByWeixin(){
vk.userCenter.loginByWeixin({
success:function(data){
vk.alert("登录成功");
}
});
},
code2SessionWeixin() {
vk.userCenter.code2SessionWeixin({
success:function(data){
vk.alert(JSON.stringify(data));
},
});
},
// 绑定微信
bindWeixin(){
vk.userCenter.bindWeixin({
success:function(data){
vk.alert("绑定成功");
}
});
},
// 解绑微信
unbindWeixin(){
vk.userCenter.unbindWeixin({
success:function(data){
vk.alert("解绑成功");
}
});
},
}
}
</script>
<style lang="scss" scoped>
.content {
padding: 15px;
}
.content input {
height: 46px;
border: solid 1px #DDDDDD;
border-radius: 5px;
margin-bottom: 15px;
padding: 0px 15px;
}
.content button {
margin-bottom: 15px;
}
.content navigator {
display: inline-block;
color: #007AFF;
border-bottom: solid 1px #007AFF;
font-size: 16px;
line-height: 24px;
margin-bottom: 15px;
}
.tips {
text-align: center;
line-height: 20px;
font-size: 14px;
color: #999999;
margin-bottom: 20px;
}
</style>
\ No newline at end of file
Markdown is supported
0% 或 .
You are about to add 0 people to the discussion. Proceed with caution.
先完成此消息的编辑！
想要评论请 注册 或