xiangshan
/
yxxh5
22
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

Merge branch 'master' of https://e.coding.net/boss-01/yxx/app

This commit is contained in:
lnn19986213 2022-04-22 17:19:15 +08:00
parent 448397286f f16cc89fbe
commit f7642e3a0a
48 changed files with 17160 additions and 522 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

18
src/pages.json
View File

@ -398,6 +398,24 @@
"enablePullDownRefresh": false
}
}
,{
"path" : "pages/PersonalCenter/PersonalCenter",
"style" :
{
"navigationBarTitleText": "个人中心",
"enablePullDownRefresh": false
}
}
,{
"path" : "pages/PersonalCenter/ReEditSingleInfo",
"style" :
{
"navigationBarTitleText": "信息修改",
"enablePullDownRefresh": false
}
}
],
"globalStyle": {
"navigationBarTextStyle": "black", //导航栏标题颜色及状态栏前景颜色，仅支持 black/white

77
src/pages/Login/Login.vue
View File

@ -2,24 +2,35 @@
<view style="">
<view class="content_main">
<view class="copyright_iocn">
<image style="width: 80rpx; height: 60rpx;" src="../../static/icon10.png" mode=""></image>
<image style="width: 156rpx; height: 50rpx;margin-left: 16rpx;" src="../../static/icon11.png" mode="">
</image>
<u--form :model="userInfo" ref="loginForm">
<view class="content_main">
<view class="copyright_iocn">
<image style="width: 80rpx; height: 60rpx;" src="../../static/icon10.png" mode=""></image>
<image style="width: 156rpx; height: 50rpx;margin-left: 16rpx;" src="../../static/icon11.png"
mode="">
</image>
</view>
<u-form-item prop="number" ref="item1" class="data_itm">
<u--input placeholder="请输入手机号" border="bottom" clearable v-model="userInfo.number"></u--input>
</u-form-item>
<u-form-item prop="pasw" ref="item1" class="data_itm">
<u--input type="password" placeholder="请输入密码" border="bottom" clearable v-model="userInfo.pasw">
</u--input>
</u-form-item>
<u-button text="登录" size="large" throttleTime=1000 color="#99241B" style="margin-top: 84rpx;">
</u-button>
<view class="other_op">
<text @click="goRegist">注册账号</text>
<text @click="goRemeber">忘记密码？</text>
</view>
</view>
<u--input placeholder="请输入手机号" border="bottom" clearable></u--input>
<u--input type="password" style="margin: 80rpx 0rpx;" placeholder="请输入密码" border="bottom" clearable></u--input>
<u-button text="登录" size="large" throttleTime=1000 color="#99241B"></u-button>
<view class="other_op">
<text @click="goRegist">注册账号</text>
<text @click="goRemeber">忘记密码？</text>
</view>
</view>
</u--form>
</view>
</template>
@ -27,7 +38,29 @@
export default {
data() {
return {
userInfo: {
number: null,
pasw: null
},
rules: {
'number': [{
type: 'number',
required: true,
message: '请填写手机号',
trigger: ['blur']
}, {
validator: (rule, value, callback) => {
return uni.$u.test.mobile(value);
},
message: '请输入格式正确的手机号',
trigger: ['change', 'blur'],
}],
'pasw': [{
required: true,
message: '请填写密码',
trigger: ['blur']
}],
}
};
},
methods: {
@ -41,7 +74,11 @@
url: '/pages/Login/RemeberPW'
})
}
}
},
onReady() {
this.$refs.loginForm.setRules(this.rules);
},
}
</script>
@ -63,6 +100,4 @@
padding: 24rpx 0rpx;
}
}
</style>

213
src/pages/Login/Register.vue
View File

@ -1,55 +1,158 @@
<template>
<view style="margin: 0rpx 48rpx;">
<view class="" style="padding: 0rpx 28rpx ;">
<text style="font-size: 40rpx; font-weight: 700;">请填写以下注册信息</text>
<u--input style="margin: 80rpx 0rpx;" placeholder="请输入手机号" border="bottom" clearable></u--input>
<u-input style="margin: 80rpx 0rpx;" placeholder="请输入验证码" border="bottom" clearable>
<template slot="suffix">
<u-code ref="uCode" @change="codeChange" seconds="20" changeText="X秒重新获取"></u-code>
<u-button @tap="getCode" :text="tips" :hairline= "false" plain style="border: 0px;" ></u-button>
</template>
</u-input>
<u--input type="password" style="margin: 80rpx 0rpx;" placeholder="请输入密码" border="bottom" clearable>
</u--input>
<u--input type="password" style="margin: 80rpx 0rpx;" placeholder="请再次输入密码" border="bottom" clearable>
</u--input>
</view>
<u-button text="下一步" size="large" throttleTime=1000 color="#99241B"></u-button>
</view>
</template>
<script>
export default {
data() {
return {
tips:'',
};
},
methods:{ codeChange(text) {
this.tips = text;
},
getCode() {
if(this.$refs.uCode.canGetCode) {
// 模拟向后端请求验证码
uni.showLoading({
title: '正在获取验证码'
})
setTimeout(() => {
uni.hideLoading();
// 这里此提示会被this.start()方法中的提示覆盖
uni.$u.toast('验证码已发送');
// 通知验证码组件内部开始倒计时
this.$refs.uCode.start();
}, 2000);
} else {
uni.$u.toast('倒计时结束后再发送');
}
}
}
}
</script>
<style lang="scss">
</style>
<template>
<view style="margin: 0rpx 48rpx;">
<u--form :model="registInfo" ref="registForm">
<view class="" style="padding: 0rpx 28rpx ;">
<text style="font-size: 40rpx; font-weight: 700;">请填写以下注册信息</text>
<u-form-item prop="number" ref="item1" class="data_itm">
<u--input placeholder="请输入手机号" border="bottom" clearable v-model="registInfo.number"></u--input>
</u-form-item>
<u-form-item prop="checKcode" ref="item1" class="data_itm">
<u-input placeholder="请输入验证码" border="bottom" clearable v-model="registInfo.checKcode">
<template slot="suffix">
<u-code ref="uCode" @change="codeChange" seconds="20" changeText="X秒重新获取"></u-code>
<u-button @click="getCode" :text="tips" :hairline="false" plain style="border: 0px;">
</u-button>
</template>
</u-input>
</u-form-item>
<u-form-item prop="pasw" ref="item1" class="data_itm">
<u--input type="password" placeholder="请输入密码" border="bottom" clearable v-model="registInfo.pasw">
</u--input>
</u-form-item>
<u-form-item prop="repasw" ref="item1" class="data_itm">
<u--input type="password" placeholder="请再次输入密码" border="bottom" clearable
v-model="registInfo.repasw">
</u--input>
</u-form-item>
</view>
<u-button text="下一步" size="large" throttleTime=1000 color="#99241B" style="margin-top: 80rpx;"
@click="submitNext"></u-button>
</u--form>
</view>
</template>
<script>
export default {
data() {
return {
tips: '',
registInfo: {
number: null,
checKcode: null,
pasw: null,
repasw: null
},
rules: {
'checKcode': [{
required: true,
message: '请填写验证码',
trigger:['blur']
},{
min: 6,
max: 6,
message: '验证码长度应该等于6个字符!',
trigger: "blur"
}],
'number': [{
type: 'number',
required: true,
message: '请填写手机号',
trigger: ['blur']
}, {
validator: (rule, value, callback) => {
return uni.$u.test.mobile(value);
},
message: '请输入格式正确的手机号',
trigger: ['change', 'blur'],
}],
'pasw': [{
required: true,
message: '请填写密码',
trigger: ['blur']
}, {
min: 8,
max: 30,
message: '密码长度应大于等于8个字符小于30个字符!',
trigger: "blur"
}, {
trigger: ['blur'],
validator: (rule, value, callback) => {
var passwordreg =
/^(?!([a-zA-Z]+|[a-z\d]+|[a-z~`@#\$%\^&\*\(\)_\-\+=\{\[\}\]\|\\:;\"\'<,>\.\?\/\!]+|[A-Z\d]+|[A-Z~`@#\$%\^&\*\(\)_\-\+=\{\[\}\]\|\\:;\"\'<,>\.\?\/\!]+|[\d~`@#\$%\^&\*\(\)_\-\+=\{\[\}\]\|\\:;\"\'<,>\.\?\/\!]+)$)[a-zA-Z\d~`@#\$%\^&\*\(\)_\-\+=\{\[\}\]\|\\:;\"\'<,>\.\?\/\!]+$/;
if (!passwordreg.test(value)) {
callback(new Error('密码必须由大写字母、小写字母、数字、特殊符号中的2种及以上类型组成!'))
} else {
callback()
}
}
}],
'repasw': [{
required: true,
message: '请填写密码',
trigger: ['blur', 'change']
}, {
validator: (rule, value, callback) => {
if (value !== this.registInfo.pasw) {
callback(new Error('两次输入密码不一致'))
} else {
callback()
}
},
trigger: ['change', 'blur'],
}],
}
};
},
methods: {
codeChange(text) {
this.tips = text;
},
getCode() {
uni.hideKeyboard()
if (!(/^1(3|4|5|6|7|8|9)\d{9}$/.test(this.registInfo.number))) { //校验手机号码是否有误
uni.showToast({
title: '请填写正确手机号码',
icon: "none"
});
return false;
}
if (this.$refs.uCode.canGetCode) {
// 模拟向后端请求验证码
uni.showLoading({
title: '正在获取验证码'
})
setTimeout(() => {
uni.hideLoading();
// 这里此提示会被this.start()方法中的提示覆盖
uni.$u.toast('验证码已发送');
// 通知验证码组件内部开始倒计时
this.$refs.uCode.start();
}, 2000);
} else {
uni.$u.toast('倒计时结束后再发送');
}
},
submitNext() {
this.$refs.registForm.validate().then(res => {
uni.$u.toast('Thanks your helping')
}).catch(errors => {
uni.$u.toast('您的资料还未补充完整')
})
}
},
onReady() {
this.$refs.registForm.setRules(this.rules);
},
}
</script>
<style lang="scss">
.data_itm {
margin: 80rpx 0px;
}
</style>

180
src/pages/Login/RemeberPW.vue
View File

@ -1,20 +1,34 @@
<template>
<view style="margin: 0rpx 48rpx;">
<view class="" style="padding: 0rpx 28rpx ;">
<text style="font-size: 40rpx; font-weight: 700;">忘记密码</text>
<u--input style="margin: 80rpx 0rpx;" placeholder="请输入手机号" border="bottom" clearable></u--input>
<u-input style="margin: 80rpx 0rpx;" placeholder="请输入验证码" border="bottom" clearable>
<template slot="suffix">
<u-code ref="uCode" @change="codeChange" seconds="20" changeText="X秒重新获取"></u-code>
<u-button @tap="getCode" :text="tips" :hairline= "false" plain style="border: 0rpx;" ></u-button>
</template>
</u-input>
<u--input type="password" style="margin: 80rpx 0rpx;" placeholder="请输入密码" border="bottom" clearable>
</u--input>
<u--input type="password" style="margin: 80rpx 0rpx;" placeholder="请再次输入密码" border="bottom" clearable>
</u--input>
</view>
<u-button text="确认并登录" size="large" throttleTime=1000 color="#99241B"></u-button>
<u--form :model="registInfo" ref="registForm">
<view class="" style="padding: 0rpx 28rpx ;">
<text style="font-size: 40rpx; font-weight: 700;">忘记密码</text>
<u-form-item prop="number" ref="item1" class="data_itm">
<u--input placeholder="请输入手机号" border="bottom" clearable v-model="registInfo.number"></u--input>
</u-form-item>
<u-form-item prop="checKcode" ref="item1" class="data_itm">
<u-input placeholder="请输入验证码" border="bottom" clearable v-model="registInfo.checKcode">
<template slot="suffix">
<u-code ref="uCode" @change="codeChange" seconds="20" changeText="X秒重新获取"></u-code>
<u-button @click="getCode" :text="tips" :hairline="false" plain style="border: 0px;">
</u-button>
</template>
</u-input>
</u-form-item>
<u-form-item prop="pasw" ref="item1" class="data_itm">
<u--input type="password" placeholder="请输入密码" border="bottom" clearable v-model="registInfo.pasw">
</u--input>
</u-form-item>
<u-form-item prop="repasw" ref="item1" class="data_itm">
<u--input type="password" placeholder="请再次输入密码" border="bottom" clearable
v-model="registInfo.repasw">
</u--input>
</u-form-item>
</view>
<u-button text="确认并登录" size="large" throttleTime=1000 color="#99241B" style="margin-top: 80rpx;"
@click="submitNext"></u-button>
</u--form>
</view>
</template>
@ -22,33 +36,123 @@
export default {
data() {
return {
tips:'',
tips: '',
registInfo: {
number: null,
checKcode: null,
pasw: null,
repasw: null
},
rules: {
'checKcode': [{
required: true,
message: '请填写验证码',
trigger:['blur']
},{
min: 6,
max: 6,
message: '验证码长度应该等于6个字符!',
trigger: "blur"
}],
'number': [{
type: 'number',
required: true,
message: '请填写手机号',
trigger: ['blur']
}, {
validator: (rule, value, callback) => {
return uni.$u.test.mobile(value);
},
message: '请输入格式正确的手机号',
trigger: ['change', 'blur'],
}],
'pasw': [{
required: true,
message: '请填写密码',
trigger: ['blur']
}, {
min: 8,
max: 30,
message: '密码长度应大于等于8个字符小于30个字符!',
trigger: "blur"
}, {
trigger: ['blur'],
validator: (rule, value, callback) => {
var passwordreg =
/^(?!([a-zA-Z]+|[a-z\d]+|[a-z~`@#\$%\^&\*\(\)_\-\+=\{\[\}\]\|\\:;\"\'<,>\.\?\/\!]+|[A-Z\d]+|[A-Z~`@#\$%\^&\*\(\)_\-\+=\{\[\}\]\|\\:;\"\'<,>\.\?\/\!]+|[\d~`@#\$%\^&\*\(\)_\-\+=\{\[\}\]\|\\:;\"\'<,>\.\?\/\!]+)$)[a-zA-Z\d~`@#\$%\^&\*\(\)_\-\+=\{\[\}\]\|\\:;\"\'<,>\.\?\/\!]+$/;
if (!passwordreg.test(value)) {
callback(new Error('密码必须由大写字母、小写字母、数字、特殊符号中的2种及以上类型组成!'))
} else {
callback()
}
}
}],
'repasw': [{
required: true,
message: '请填写密码',
trigger: ['blur', 'change']
}, {
validator: (rule, value, callback) => {
if (value !== this.registInfo.pasw) {
callback(new Error('两次输入密码不一致'))
} else {
callback()
}
},
trigger: ['change', 'blur'],
}],
}
};
},
methods:{ codeChange(text) {
this.tips = text;
},
getCode() {
if(this.$refs.uCode.canGetCode) {
// 模拟向后端请求验证码
uni.showLoading({
title: '正在获取验证码'
})
setTimeout(() => {
uni.hideLoading();
// 这里此提示会被this.start()方法中的提示覆盖
uni.$u.toast('验证码已发送');
// 通知验证码组件内部开始倒计时
this.$refs.uCode.start();
}, 2000);
} else {
uni.$u.toast('倒计时结束后再发送');
}
}
}
methods: {
codeChange(text) {
this.tips = text;
},
getCode() {
uni.hideKeyboard()
if (!(/^1(3|4|5|6|7|8|9)\d{9}$/.test(this.registInfo.number))) { //校验手机号码是否有误
uni.showToast({
title: '请填写正确手机号码',
icon: "none"
});
return false;
}
if (this.$refs.uCode.canGetCode) {
// 模拟向后端请求验证码
uni.showLoading({
title: '正在获取验证码'
})
setTimeout(() => {
uni.hideLoading();
// 这里此提示会被this.start()方法中的提示覆盖
uni.$u.toast('验证码已发送');
// 通知验证码组件内部开始倒计时
this.$refs.uCode.start();
}, 2000);
} else {
uni.$u.toast('倒计时结束后再发送');
}
},
submitNext() {
this.$refs.registForm.validate().then(res => {
uni.$u.toast('Thanks your helping')
}).catch(errors => {
uni.$u.toast('您的资料还未补充完整')
})
}
},
onReady() {
this.$refs.registForm.setRules(this.rules);
},
}
</script>
<style lang="scss">
.data_itm {
margin: 80rpx 0px;
}
</style>

259
src/pages/PersonalCenter/PersonalCenter.vue Normal file
View File

@ -0,0 +1,259 @@
<template>
<view>
<view class="person_itm">
<view class="person_itm_sign">
<text class="person_itm_sign_tit">姓名</text>
<view class="person_itm_sign_right">
<text>谢家星</text>
<u-icon name="arrow-right"></u-icon>
</view>
</view>
<view class="person_itm_sign">
<text class="person_itm_sign_tit">性别</text>
<view class="person_itm_sign_right">
<text>男</text>
<u-icon name="arrow-right"></u-icon>
</view>
</view>
<view class="person_itm_sign">
<text class="person_itm_sign_tit">出生日期</text>
<view class="person_itm_sign_right">
<text>1997/02/01</text>
<u-icon name="calendar"></u-icon>
</view>
</view>
<view class="person_itm_sign">
<text class="person_itm_sign_tit">身份证号码</text>
<view class="person_itm_sign_right">
<text>41852199825252651</text>
<u-icon name="arrow-right"></u-icon>
</view>
</view>
</view>
<view class="person_itm">
<view class="person_itm_sign">
<text class="person_itm_sign_tit">民族</text>
<view class="person_itm_sign_right">
<text>汉族</text>
<u-icon name="arrow-right"></u-icon>
</view>
</view>
<view class="person_itm_sign">
<text class="person_itm_sign_tit">籍贯</text>
<view class="person_itm_sign_right">
<text>宁波</text>
<u-icon name="arrow-right"></u-icon>
</view>
</view>
<view class="person_itm_sign">
<text class="person_itm_sign_tit">政治面貌</text>
<view class="person_itm_sign_right">
<text>党员</text>
<u-icon name="arrow-right"></u-icon>
</view>
</view>
</view>
<view class="person_itm">
<view class="person_itm_sign">
<text class="person_itm_sign_tit">联系电话</text>
<view class="person_itm_sign_right">
<text>13888888888</text>
<u-icon name="arrow-right"></u-icon>
</view>
</view>
<view class="person_itm_sign">
<text class="person_itm_sign_tit">头像</text>
<view class="person_itm_sign_right">
<image style="width: 80rpx; height: 80rpx;" src="../../static/RewardWork/avator.png" mode="">
</image>
<u-icon name="arrow-right"></u-icon>
</view>
</view>
</view>
<view class="person_itm">
<view class="person_itm_sign">
<text class="person_itm_sign_tit">所属协会</text>
<view class="person_itm_sign_right">
<text>协会名称</text>
<u-icon name="arrow-right"></u-icon>
</view>
</view>
<view class="person_itm_sign">
<text class="person_itm_sign_tit">入会时间</text>
<view class="person_itm_sign_right">
<text>2022/02/01</text>
<u-icon name="calendar"></u-icon>
</view>
</view>
</view>
<!-- 文艺人才-个人中心 -->
<view class="person_itm">
<view class="person_itm_sign">
<text class="person_itm_sign_tit">人才类型</text>
<view class="person_itm_sign_right">
<text>书法家</text>
<u-icon name="arrow-right"></u-icon>
</view>
</view>
<view class="person_itm_sign">
<text class="person_itm_sign_tit">艺术成就</text>
<view class="person_itm_sign_right">
<!-- <text>2022/02/01</text> -->
<u-icon name="arrow-right"></u-icon>
</view>
</view>
<view class="person_itm_sign">
<text class="person_itm_sign_tit">荣誉奖项</text>
<view class="person_itm_sign_right">
<!-- <text>2022/02/01</text> -->
<u-icon name="arrow-right"></u-icon>
</view>
</view>
<view class="person_itm_sign">
<text class="person_itm_sign_tit">代表作</text>
<view class="person_itm_sign_right">
<!-- <text>2022/02/01</text> -->
<u-icon name="arrow-right"></u-icon>
</view>
</view>
<view class="person_itm_sign">
<text class="person_itm_sign_tit">是否已入协会</text>
<view class="person_itm_sign_right">
<!-- <text>2022/02/01</text> -->
<!-- <u-icon name="arrow-right"></u-icon> -->
<u-switch v-model="isJioned" activeColor="#99241B" size=20></u-switch>
</view>
</view>
<view class="person_itm_sign">
<text class="person_itm_sign_tit">入会时间</text>
<view class="person_itm_sign_right">
<text>2022/02/01</text>
<u-icon name="calendar"></u-icon>
</view>
</view>
</view>
<!-- 服务商个人中心 -->
<view class="person_itm">
<view class="person_itm_sign">
<text class="person_itm_sign_tit">服务名称</text>
<view class="person_itm_sign_right">
<text>服务名称</text>
<u-icon name="arrow-right"></u-icon>
</view>
</view>
<view class="person_itm_sign">
<text class="person_itm_sign_tit">地址</text>
<view class="person_itm_sign_right">
<text>地址</text>
<u-icon name="arrow-right"></u-icon>
</view>
</view>
<view class="person_itm_sign">
<text class="person_itm_sign_tit">实景照</text>
<view class="person_itm_sign_right">
<!-- <text>地址</text> -->
<u-icon name="arrow-right"></u-icon>
</view>
</view>
<view class="person_itm_sign">
<text class="person_itm_sign_tit">资质证</text>
<view class="person_itm_sign_right">
<!-- <text>地址</text> -->
<u-icon name="arrow-right"></u-icon>
</view>
</view>
</view>
<view class="person_itm">
<view class="person_itm_sign">
<text class="person_itm_sign_tit">负责人姓名</text>
<view class="person_itm_sign_right">
<text>王一</text>
<u-icon name="arrow-right"></u-icon>
</view>
</view>
<view class="person_itm_sign">
<text class="person_itm_sign_tit">服务时间</text>
<view class="person_itm_sign_right">
<text>2022/02/01</text>
<u-icon name="calendar"></u-icon>
</view>
</view>
<view class="person_itm_sign">
<text class="person_itm_sign_tit">电话</text>
<view class="person_itm_sign_right">
<text>13888888888</text>
<u-icon name="arrow-right"></u-icon>
</view>
</view>
</view>
<!-- 服务商个人中心 ed-->
</view>
</template>
<script>
export default {
data() {
return {
isJioned: true
};
}
}
</script>
<style lang="scss">
page {
background-color: #F4F5F7;
}
.person_itm {
background-color: #FFFFFF;
margin-bottom: 24rpx;
padding: 24rpx;
.person_itm_sign {
display: flex;
justify-content: space-between;
align-items: center;
padding: 24rpx 0rpx;
.person_itm_sign_tit {
font-weight: 700;
}
.person_itm_sign_right {
display: flex;
align-items: center;
}
}
}
</style>

214
src/pages/PersonalCenter/ReEditSingleInfo.vue Normal file
View File

@ -0,0 +1,214 @@
<template>
<view>
<u--form :model="model1" ref="form1" labelPosition="top" labelWidth='auto'
:labelStyle='{fontWeight:800}'>
<u-form-item prop="userInfo.name" ref="item1" class="data_itm">
<u--input class="p32" placeholder="请填写姓名" clearable v-model="model1.userInfo.name" border="none">
</u--input>
</u-form-item>
<!-- #D5D4D6 -->
<u-button class="custom-style"
style="background-color:#99241B ; color: #FFFFFF; margin-top: 32rpx; width: calc(100% - 96rpx);"
type="default" @click="submit">保存</u-button>
<!-- <view class="operation">
<button type="default" class="next" @click="submit">保存</button>
</view> -->
</u--form>
</view>
</template>
<script>
export default {
data() {
return {
model1: {
userInfo: {
name: '',
sex: '',
birthday: "",
idCOde: '',
zuValue: '',
zhengzhiValue: '',
phoneNum: '',
meeting: '',
meetingTime: '',
ServerName: '',
Address: '',
serverInstrutor: '', //服务介绍
serveTime: '',
DutyPeopleName: '', //负责人名称
ServephoneNum: '', //服务商电话
},
},
// 校验规则
rules: {
'userInfo.serverInstrutor': [{
type: 'string',
required: true,
message: '请填写服务内容介绍',
trigger: ['blur', 'change']
}],
'userInfo.Address': [{
type: 'string',
required: true,
message: '请填写地址',
trigger: ['blur', 'change']
}],
'userInfo.name': [{
type: 'string',
required: true,
message: '请填写姓名',
trigger: ['blur', 'change']
}, {
// 此为同步验证，可以直接返回true或者false，如果是异步验证，稍微不同，见下方说明
validator: (rule, value, callback) => {
// 调用uView自带的js验证规则，详见：https://www.uviewui.com/js/test.html
return uni.$u.test.chinese(value);
},
message: "姓名必须为中文",
// 触发器可以同时用blur和change，二者之间用英文逗号隔开
trigger: ["change", "blur"],
}],
'userInfo.meeting': [{
type: 'string',
required: true,
message: '请填写协会名',
trigger: ['blur', 'change']
}],
'userInfo.sex': {
type: 'string',
max: 1,
required: true,
message: '请选择男或女',
trigger: ['blur', 'change']
},
'userInfo.idCOde': [{
required: true,
message: '请输入身份证号号',
trigger: ['change', 'blur'],
},
{
// 自定义验证函数，见上说明
validator: (rule, value, callback) => {
return uni.$u.test.idCard(value);
},
message: '身份证号码格式不正确',
trigger: ['change', 'blur'],
}
],
"userInfo.phoneNum": [{
required: true,
message: '请输入联系电话',
trigger: ['change', 'blur'],
},
{
validator: (rule, value, callback) => {
return uni.$u.test.mobile(value);
},
message: '手机号码不正确',
trigger: ['change', 'blur'],
}
],
"userInfo.ServephoneNum": [{
required: true,
message: '请输入联系电话',
trigger: ['change', 'blur'],
},
{
validator: (rule, value, callback) => {
return uni.$u.test.mobile(value);
},
message: '手机号码不正确',
trigger: ['change', 'blur'],
}
],
'userInfo.ServerName': [{
type: 'string',
required: true,
message: '请填写姓名',
trigger: ['blur', 'change']
}, {
// 此为同步验证，可以直接返回true或者false，如果是异步验证，稍微不同，见下方说明
validator: (rule, value, callback) => {
// 调用uView自带的js验证规则，详见：https://www.uviewui.com/js/test.html
return uni.$u.test.chinese(value);
},
message: "姓名必须为中文",
// 触发器可以同时用blur和change，二者之间用英文逗号隔开
trigger: ["change", "blur"],
}],
'userInfo.DutyPeopleName': [{
type: 'string',
required: true,
message: '请填写姓名',
trigger: ['blur', 'change']
}, {
// 此为同步验证，可以直接返回true或者false，如果是异步验证，稍微不同，见下方说明
validator: (rule, value, callback) => {
// 调用uView自带的js验证规则，详见：https://www.uviewui.com/js/test.html
return uni.$u.test.chinese(value);
},
message: "姓名必须为中文",
// 触发器可以同时用blur和change，二者之间用英文逗号隔开
trigger: ["change", "blur"],
}],
},
// 校验规则ed
};
},
methods: {
submit() {
this.$refs.form1.validate().then(res => {
uni.$u.toast('Thanks your helping')
}).catch(errors => {
uni.$u.toast('您的资料还未补充完整')
})
}
},
onLoad(opt) {
console.log(opt);
},
onReady() {
this.$refs.form1.setRules(this.rules);
},
}
</script>
<style lang="scss">
page {
background-color: #f5f5f5;
}
.p32 {
padding: 32rpx !important;
background-color: #FFFFFF;
}
.next {
width: calc(100% - 48rpx);
height: 80rpx;
line-height: 80rpx;
background-color: #99241B;
color: #fff;
font-size: 32rpx;
font-weight: 600;
border: none;
button {
&::after {
border: none;
}
}
}
</style>

10701
src/pages/ReceivingAddress/ChinaCity.js Normal file
View File

File diff suppressed because it is too large Load Diff

50
src/pages/ReceivingAddress/EditAddresspge.vue
View File

@ -12,11 +12,9 @@
</u-form-item>
<u-form-item prop="userInfo.name" ref="item1" label="所在地区" class="data_itm" borderBottom
@click="showAddr=true">
<u--input style="padding: 32rpx;" placeholder="选择所在地区" readonly clearable v-model="model1.userInfo.name"
border="none">
<u-icon slot="suffix" name="arrow-right"></u-icon>
<u-form-item prop="userInfo.name" ref="item1" label="所在地区" class="data_itm" borderBottom @click="selectAdd">
<u--input style="padding: 32rpx;" placeholder="选择所在地区" readonly clearable v-model="model1.userInfo.AddressText"
suffixIcon="arrow-right" border="none">
</u--input>
</u-form-item>
@ -30,23 +28,31 @@
color="#99241B" @click="goAddEditPGE"></u-button>
</view>
</u--form>
<view style="position: relative; width: 100%; height: 50px;">
<uni-data-picker ref="picker" style="border: 0px; position: absolute; " :localdata="items" :map="{text:'name',value:'code'}"
popup-title="请选择所在地区" @change="onchange" @nodeclick="onnodeclick">
</uni-data-picker>
<view style="position: absolute; width: 100%; height: 100%; background-color: #FFFFFF;">
</view>
</view>
<u-picker :show="showAddr" :columns="columns"></u-picker>
</view>
</template>
<script>
import cityData from "/src/pages/ReceivingAddress/ChinaCity.js"
export default {
data() {
return {
items: cityData.cityData ,
showAddr: false,
columns: [
['中国', '美国', '日本'],
['日'],
["jd"]
],
model1: {
userInfo: {
name: '',
@ -59,8 +65,8 @@
meeting: '',
meetingTime: '',
ServerName: '',
Address: ''
Address: '',
AddressText:''
},
}
};
@ -70,6 +76,24 @@
uni.setNavigationBarTitle({
title: opt.name
})
},
computed: {
},
methods: {
onchange(e) {
const value = e.detail.value
// console.log(value);
this.model1.userInfo.AddressText=`${value[0].text}/${value[1].text}/${value[2].text}`
this.Address = value
// var arr=[{text:'',value:''}]
// value.map((v)=>{ v[0]})
},
onnodeclick(node) {},
selectAdd() {
this.$refs.picker.show()
}
}
}
</script>

4
src/pages/SelectId/SelectId.vue
View File

@ -54,7 +54,7 @@
export default {
data() {
return {
id:8,
id:null,
statusHeight: 0,
titleHeight: 50,
selectList: ["协会会员", "文艺人才", "文艺志愿者", "服务商", ]
@ -63,7 +63,7 @@
methods: {
next() {
console.log("下一步");
if(this.id<8){
if(this.id||this.id==0){
var that=this
uni.navigateTo({
url:`/pages/improveData/improveData?id=${that.id}`

488
src/pages/improveData/improveData.vue
View File

@ -5,116 +5,122 @@
<!-- 完善资料 -->
<!-- 这里加了 v-for 导致 ref 失效 -->
<view class="data_itm_box">
<u-form-item prop="userInfo.name" ref="item1" class="data_itm">
<text class="label_t">姓名</text>
<u--input style="padding: 32rpx;" placeholder="请填写姓名" inputAlign="right" clearable
v-model="model1.userInfo.name" border="none"></u--input>
</u-form-item>
<u-form-item prop="userInfo.sex" ref="item1" @click="showSex=true" class="data_itm">
<text class="label_t">性别</text>
<u--input style="padding: 32rpx;" placeholder="请填选择性别" v-model="model1.userInfo.sex" readonly
inputAlign="right" border="none">
<u-icon slot="suffix" name="arrow-right"></u-icon>
</u--input>
</u-form-item>
<u-form-item ref="item1" @click="showBirthday=true" class="data_itm">
<text class="label_t">出生日期</text>
<u--input style="padding: 32rpx;" placeholder="请填选择出生日期" v-model="model1.userInfo.birthday" readonly
inputAlign="right" border="none">
<u-icon slot="suffix" name="calendar"></u-icon>
</u--input>
</u-form-item>
<u-form-item prop="userInfo.idCOde" ref="item1" class="data_itm">
<text class="label_t">身份证号</text>
<u--input style="padding: 32rpx;" placeholder="请输入身份证号码" inputAlign="right" clearable
v-model="model1.userInfo.idCOde" border="none"></u--input>
</u-form-item>
</view>
<view class="data_itm_box">
<u-form-item ref="item1" @click="zuShow=true" class="data_itm">
<text class="label_t">民族</text>
<u--input style="padding: 32rpx;" placeholder="请选择民族" v-model="zuValue" readonly inputAlign="right"
border="none">
<u-icon slot="suffix" name="arrow-right"></u-icon>
</u--input>
</u-form-item>
<u-form-item ref="item1" @click="jigaunShow=true" class="data_itm">
<text class="label_t">籍贯</text>
<u--input style="padding: 32rpx;" placeholder="请选择籍贯" v-model="jiguan" readonly inputAlign="right"
border="none">
<u-icon slot="suffix" name="arrow-right"></u-icon>
</u--input>
</u-form-item>
<u-form-item ref="item1" @click="zhengzhiShow=true" class="data_itm">
<text class="label_t">政治面貌</text>
<u--input style="padding: 32rpx;" placeholder="请选择政治面貌" v-model="zhengzhiValue" readonly
inputAlign="right" border="none">
<u-icon slot="suffix" name="arrow-right"></u-icon>
</u--input>
</u-form-item>
</view>
<view class="data_itm_box">
<u-form-item prop="userInfo.phoneNum" ref="item1" class="data_itm">
<text class="label_t">联系电话</text>
<u--input style="padding: 32rpx;" placeholder="请输入联系电话" inputAlign="right" clearable
v-model="model1.userInfo.phoneNum" border="none"></u--input>
</u-form-item>
</view>
<view class="data_itm_box">
<view class="data_itm">
<view class="data_itm_key label_t">
照片上传
</view>
</view>
<u-upload class="upload" accept="image" width="172rpx" height="172rpx" :fileList="fileList3"
@afterRead="afterRead" @delete="deletePic" name="3" multiple :maxCount="2">
<image style="width: 172rpx;height: 172rpx;" src="../../static/improveData/jia.png"></image>
</u-upload>
</view>
<view class="wanShan" v-if="pageTypeId!=='3'">
<view class="data_itm_box">
<u-form-item prop="userInfo.name" ref="item1" class="data_itm">
<text class="label_t">姓名</text>
<u--input class="p32" placeholder="请填写姓名" inputAlign="right" clearable
v-model="model1.userInfo.name" border="none"></u--input>
</u-form-item>
<u-form-item prop="userInfo.sex" ref="item1" @click="showSex=true" class="data_itm">
<text class="label_t">性别</text>
<u--input class="p32" placeholder="请填选择性别" v-model="model1.userInfo.sex" readonly inputAlign="right"
border="none">
<u-icon slot="suffix" name="arrow-right"></u-icon>
</u--input>
</u-form-item>
<u-form-item ref="item1" @click="showBirthday=true" class="data_itm">
<text class="label_t">出生日期</text>
<u--input class="p32" placeholder="请填选择出生日期" v-model="model1.userInfo.birthday" readonly
inputAlign="right" border="none">
<u-icon slot="suffix" name="calendar"></u-icon>
</u--input>
</u-form-item>
<u-form-item prop="userInfo.idCOde" ref="item1" class="data_itm">
<text class="label_t">身份证号</text>
<u--input class="p32" placeholder="请输入身份证号码" inputAlign="right" clearable
v-model="model1.userInfo.idCOde" border="none"></u--input>
</u-form-item>
</view>
<view class="data_itm_box">
<u-form-item ref="item1" @click="zuShow=true" class="data_itm">
<text class="label_t">民族</text>
<u--input class="p32" placeholder="请选择民族" v-model="zuValue" readonly inputAlign="right"
border="none">
<u-icon slot="suffix" name="arrow-right"></u-icon>
</u--input>
</u-form-item>
<u-form-item ref="item1" @click="jigaunShow=true" class="data_itm">
<text class="label_t">籍贯</text>
<u--input class="p32" placeholder="请选择籍贯" v-model="jiguan" readonly inputAlign="right"
border="none">
<u-icon slot="suffix" name="arrow-right"></u-icon>
</u--input>
</u-form-item>
<u-form-item ref="item1" @click="zhengzhiShow=true" class="data_itm">
<text class="label_t">政治面貌</text>
<u--input class="p32" placeholder="请选择政治面貌" v-model="zhengzhiValue" readonly inputAlign="right"
border="none">
<u-icon slot="suffix" name="arrow-right"></u-icon>
</u--input>
</u-form-item>
</view>
<view class="data_itm_box">
<u-form-item prop="userInfo.phoneNum" ref="item1" class="data_itm">
<text class="label_t">联系电话</text>
<u--input class="p32" placeholder="请输入联系电话" inputAlign="right" clearable
v-model="model1.userInfo.phoneNum" border="none"></u--input>
</u-form-item>
</view>
<view class="data_itm_box">
<view class="data_itm">
<view class="data_itm_key label_t">
照片上传
</view>
</view>
<u-upload class="upload" accept="image" width="172rpx" height="172rpx" :fileList="fileList3"
@afterRead="afterRead" @delete="deletePic" name="3" multiple :maxCount="2">
<image style="width: 172rpx;height: 172rpx;" src="../../static/improveData/jia.png"></image>
</u-upload>
</view>
</view>
<!-- 协会会员 -->
<view class="data_itm_box">
<view class="data_itm_box" v-if='pageTypeId=="0"' >
<u-form-item prop="userInfo.meeting" ref="item1" class="data_itm">
<text class="label_t">*所属协会</text>
<u--input style="padding: 32rpx;" placeholder="请输入所属协会" inputAlign="right" clearable
<u--input class="p32" placeholder="请输入所属协会" inputAlign="right" clearable
v-model="model1.userInfo.meeting" border="none"></u--input>
</u-form-item>
<u-form-item ref="item1" @click="showBirthday=true" class="data_itm">
<text class="label_t">入会时间</text>
<u--input style="padding: 32rpx;" placeholder="请选择时间" v-model="model1.userInfo.meetingTime" readonly
<u--input class="p32" placeholder="请选择时间" v-model="model1.userInfo.meetingTime" readonly
inputAlign="right" border="none">
<u-icon slot="suffix" name="calendar"></u-icon>
</u--input>
@ -124,13 +130,13 @@
</view>
<!-- 文艺人才 -->
<view class="wenyi" v-if="true">
<view class="wenyi" v-if="pageTypeId=='1'">
<view class="data_itm_box">
<u-form-item ref="item1" @click="renCaiShow=true" class="data_itm">
<text class="label_t">人才类型</text>
<u--input style="padding: 32rpx;" placeholder="请选择类型" v-model="renCaiValue" readonly
inputAlign="right" border="none">
<u--input class="p32" placeholder="请选择类型" v-model="renCaiValue" readonly inputAlign="right"
border="none">
<u-icon slot="suffix" name="arrow-right"></u-icon>
</u--input>
</u-form-item>
@ -139,52 +145,77 @@
<u-form-item ref="item1" label='艺术成就' class="data_itm te">
<view class="chen_itm"
style="display: flex; justify-content: space-between; align-items: center;">
<input type="text" v-model="artResultList" placeholder="请输入艺术成就"
style="background-color: #F5f5f5; border-radius: 16rpx; padding-left: 12rpx; height: 80rpx; width: 550rpx" />
<view class="" style="width: 80rpx; height: 80rpx; margin-left: 16rpx;">
<image src="../../static/improveData/redAdd.png" mode=""></image>
<view class="chen_itm" v-for="(v,i) in artlist" :key="i">
<input type="text" v-model="artlist[i]" placeholder="请输入艺术成就" class="chengjiu" />
<view class="right_img_box">
<view style="width: 80rpx; height: 80rpx;" class="addImg" @click="AddItem(0)"
v-if="artlist.length==i+1">
<image src="../../static/improveData/redAdd.png" mode=""></image>
</view>
<view class="delImg" @click="delItem(0,i)" v-if="artlist.length>1&&artlist.length!=i+1">
<img style="width: 40rpx; height: 40rpx;" src="../../static/improveData/del.png"
alt="">
</view>
</view>
</view>
</u-form-item>
<u-form-item ref="item1" label='荣誉奖项' class="data_itm te">
<view class="chen_itm"
style="display: flex; justify-content: space-between; align-items: center;">
<input type="text" v-model="artResultList" placeholder="请输入荣誉奖项"
style="background-color: #F5f5f5; border-radius: 16rpx; padding-left: 12rpx; height: 80rpx; width: 550rpx" />
<view class="" style="width: 80rpx; height: 80rpx; margin-left: 16rpx;">
<image src="../../static/improveData/redAdd.png" mode=""></image>
<view class="chen_itm" v-for="(va,ind) in honorList" :key="ind">
<input type="text" v-model="honorList[ind]" placeholder="请输入荣誉奖项" class="chengjiu" />
<view class="right_img_box">
<view style="width: 80rpx; height: 80rpx;" class="addImg" @click="AddItem(1)"
v-if="honorList.length==ind+1">
<image src="../../static/improveData/redAdd.png" mode=""></image>
</view>
<view class="delImg" @click="delItem(1,ind)"
v-if="honorList.length>1&&honorList.length!=ind+1">
<img style="width: 40rpx; height: 40rpx;" src="../../static/improveData/del.png"
alt="">
</view>
</view>
</view>
</u-form-item>
<u-form-item ref="item1" label='代表作' class="data_itm te">
<view class="chen_itm"
style="display: flex; justify-content: space-between; align-items: center;">
<input type="text" v-model="artResultList" placeholder="请输入作品名称"
style="background-color: #F5f5f5; border-radius: 16rpx; padding-left: 12rpx; height: 80rpx; width: 550rpx" />
<view class="" style="width: 80rpx; height: 80rpx; margin-left: 16rpx;">
<image src="../../static/improveData/redAdd.png" mode=""></image>
<view class="chen_itm" v-for="(val,index) in StandradList" :key="index">
<input type="text" v-model="StandradList[index]" placeholder="请输入作品名称" class="chengjiu" />
<view class="right_img_box">
<view style="width: 80rpx; height: 80rpx;" class="addImg" @click="AddItem(2)"
v-if="StandradList.length==index+1">
<image src="../../static/improveData/redAdd.png" mode=""></image>
</view>
<view class="delImg" @click="delItem(2,index)"
v-if="StandradList.length>1&&StandradList.length!=index+1">
<img style="width: 40rpx; height: 40rpx;" src="../../static/improveData/del.png"
alt="">
</view>
</view>
</view>
<view class="chen_itm">
<u-upload class="WenYiUpload" accept="image" width="172rpx" height="172rpx" :fileList="fileList3"
@afterRead="afterRead" @delete="deletePic" name="3" multiple :maxCount="2">
<image style="width: 140rpx;height: 140rpx;" src="../../static/improveData/imgjia.png"></image>
</u-upload>
<u-upload class="WenYiUpload" accept="image" width="172rpx" height="172rpx"
:fileList="fileList3" @afterRead="afterRead" @delete="deletePic" name="3" multiple
:maxCount="2">
<image style="width: 140rpx;height: 140rpx;" src="../../static/improveData/imgjia.png">
</image>
</u-upload>
</view>
</u-form-item>
<view class="data_itm" style="display: flex;justify-content: space-between; align-items: center;">
<!-- 是否已加入协会 -->
<text class="label_t">是否已加入协会</text>
<u-switch v-model="isJioned" activeColor="#99241B" size=20 ></u-switch>
<text class="label_t">是否已加入协会</text>
<u-switch v-model="isJioned" activeColor="#99241B" size=20></u-switch>
</view>
<u-form-item ref="item1" @click="showBirthday=true" class="data_itm">
<text class="label_t">入会时间</text>
<u--input style="padding: 32rpx;" placeholder="请选择时间" v-model="model1.userInfo.meetingTime"
readonly inputAlign="right" border="none">
<u--input class="p32" placeholder="请选择时间" v-model="model1.userInfo.meetingTime" readonly
inputAlign="right" border="none">
<u-icon slot="suffix" name="calendar"></u-icon>
</u--input>
@ -193,16 +224,16 @@
</view>
<!-- 服务商 -->
<view class="fuwushang" v-if="false">
<view class="fuwushang" v-if="pageTypeId=='3'">
<view class="data_itm_box">
<u-form-item prop="userInfo.ServerName" ref="item1" class="data_itm">
<text class="label_t">服务名称</text>
<u--input style="padding: 32rpx;" placeholder="请输入服务名称" inputAlign="right" clearable
<u--input class="p32" placeholder="请输入服务名称" inputAlign="right" clearable
v-model="model1.userInfo.ServerName" border="none"></u--input>
</u-form-item>
<u-form-item prop="userInfo.Address" ref="item1" class="data_itm">
<text class="label_t">地址</text>
<u--input style="padding: 32rpx;" placeholder="请输入地址" inputAlign="right" clearable
<u--input class="p32" placeholder="请输入地址" inputAlign="right" clearable
v-model="model1.userInfo.Address" border="none"></u--input>
</u-form-item>
<u-form-item prop="userInfo.Address" ref="item1" label="实景照片上传" class="data_itm">
@ -226,27 +257,28 @@
<view class="data_itm_box">
<u-form-item prop="userInfo.Address" label="服务内容介绍" ref="item1">
<u--textarea v-model="model1.userInfo.Address" placeholder="请输入介绍"></u--textarea>
<u-form-item prop="userInfo.serverInstrutor" label="服务内容介绍" ref="item1">
<u--textarea v-model="model1.userInfo.serverInstrutor" placeholder="请输入介绍"
style="background-color: #F8F8F8;"></u--textarea>
</u-form-item>
<u-form-item ref="item1" @click="showBirthday=true" class="data_itm">
<u-form-item ref="item1" @click="showServeTime=true" class="data_itm">
<text class="label_t">服务时间</text>
<u--input style="padding: 32rpx;" placeholder="请填选择服务时间" v-model="model1.userInfo.birthday"
readonly inputAlign="right" border="none">
<u--input class="p32" placeholder="请填选择服务时间" v-model="model1.userInfo.serveTime" readonly
inputAlign="right" border="none">
<u-icon slot="suffix" name="calendar"></u-icon>
</u--input>
</u-form-item>
<u-form-item prop="userInfo.ServerName" ref="item1" class="data_itm">
<u-form-item prop="userInfo.DutyPeopleName" ref="item1" class="data_itm">
<text class="label_t">负责人姓名</text>
<u--input style="padding: 32rpx;" placeholder="请输入负责人姓名" inputAlign="right" clearable
v-model="model1.userInfo.ServerName" border="none"></u--input>
<u--input class="p32" placeholder="请输入负责人姓名" inputAlign="right" clearable
v-model="model1.userInfo.DutyPeopleName" border="none"></u--input>
</u-form-item>
<u-form-item prop="userInfo.phoneNum" ref="item1" class="data_itm">
<u-form-item prop="userInfo.ServephoneNum" ref="item1" class="data_itm">
<text class="label_t">电话</text>
<u--input style="padding: 32rpx;" placeholder="请输入电话" inputAlign="right" clearable
v-model="model1.userInfo.phoneNum" border="none"></u--input>
<u--input class="p32" placeholder="请输入电话" inputAlign="right" clearable
v-model="model1.userInfo.ServephoneNum" border="none"></u--input>
</u-form-item>
</view>
</view>
@ -277,6 +309,11 @@
:value="model1.userInfo.birthday" mode="date" closeOnClickOverlay @confirm="birthdayConfirm"
@cancel="birthdayClose" @close="birthdayClose"></u-datetime-picker>
<!-- 日期选择器ed -->
<!-- 服务日期选择器 -->
<u-datetime-picker confirmColor="#99241B" :minDate="-2207520000000" :show="showServeTime"
:value="model1.userInfo.serveTime" mode="date" closeOnClickOverlay @confirm="ServeTimeConfirm"
@cancel="ServeTimeClose" @close="ServeTimeClose"></u-datetime-picker>
<!-- 服务日期选择器ed -->
<!-- 民族选择器 -->
<u-picker :show="zuShow" confirmColor="#99241B" @change="selctZU" @confirm="confimZu" immediateChange
:columns="Zucolumns"></u-picker>
@ -306,14 +343,18 @@
export default {
data() {
return {
isJioned:false,
pageTypeId: 0,
isJioned: false,
renCaiShow: false,
zhengzhiShow: false,
zhengzhiValue: '',
renCaiValue: '',
zuValue: "",
zuShow: false,
artResultList:'',
artResultList: '',
artlist: [''],
honorList: [""],
StandradList: [''],
peopleSkillColums: [
["天才", "卓越", "平平"]
],
@ -335,6 +376,7 @@
jiguan: '',
jigaunShow: false,
showBirthday: false,
showServeTime: false,
sex: '',
showSex: false,
radiovalue7: '',
@ -355,15 +397,24 @@
meeting: '',
meetingTime: '',
ServerName: '',
Address: ''
Address: '',
serverInstrutor: '', //服务介绍
serveTime: '',
DutyPeopleName: '', //负责人名称
ServephoneNum: '', //服务商电话
},
},
rules: {
'userInfo.meeting': [{
'userInfo.serverInstrutor': [{
type: 'string',
required: true,
message: '请填写协会名',
message: '请填写服务内容介绍',
trigger: ['blur', 'change']
}],
'userInfo.Address': [{
type: 'string',
required: true,
message: '请填写地址',
trigger: ['blur', 'change']
}],
'userInfo.name': [{
@ -381,6 +432,12 @@
// 触发器可以同时用blur和change，二者之间用英文逗号隔开
trigger: ["change", "blur"],
}],
'userInfo.meeting': [{
type: 'string',
required: true,
message: '请填写协会名',
trigger: ['blur', 'change']
}],
'userInfo.sex': {
type: 'string',
max: 1,
@ -416,12 +473,57 @@
message: '手机号码不正确',
trigger: ['change', 'blur'],
}
]
],
"userInfo.ServephoneNum": [{
required: true,
message: '请输入联系电话',
trigger: ['change', 'blur'],
},
{
validator: (rule, value, callback) => {
return uni.$u.test.mobile(value);
},
message: '手机号码不正确',
trigger: ['change', 'blur'],
}
],
'userInfo.ServerName': [{
type: 'string',
required: true,
message: '请填写姓名',
trigger: ['blur', 'change']
}, {
// 此为同步验证，可以直接返回true或者false，如果是异步验证，稍微不同，见下方说明
validator: (rule, value, callback) => {
// 调用uView自带的js验证规则，详见：https://www.uviewui.com/js/test.html
return uni.$u.test.chinese(value);
},
message: "姓名必须为中文",
// 触发器可以同时用blur和change，二者之间用英文逗号隔开
trigger: ["change", "blur"],
}],
'userInfo.DutyPeopleName': [{
type: 'string',
required: true,
message: '请填写姓名',
trigger: ['blur', 'change']
}, {
// 此为同步验证，可以直接返回true或者false，如果是异步验证，稍微不同，见下方说明
validator: (rule, value, callback) => {
// 调用uView自带的js验证规则，详见：https://www.uviewui.com/js/test.html
return uni.$u.test.chinese(value);
},
message: "姓名必须为中文",
// 触发器可以同时用blur和change，二者之间用英文逗号隔开
trigger: ["change", "blur"],
}],
},
};
},
onLoad(option) {
console.log(option.id);
this.pageTypeId=option.id
},
onReady() {
@ -430,6 +532,38 @@
},
methods: {
AddItem(typNum) {
switch (typNum) {
case 0:
// this.$set(this.artlist, changeNum, null)
this.artlist.push("")
break;
case 1:
this.honorList.push('')
break;
case 2:
this.StandradList.push('')
break;
}
},
delItem(typNum, num) {
switch (typNum) {
case 0:
this.artlist.splice(num, 1)
break;
case 1:
this.honorList.splice(num, 1)
break;
case 2:
this.StandradList.splice(num, 1)
break;
}
},
sexSelect(e) {
this.model1.userInfo.sex = e.name
// this.$refs.form1.validateField('userInfo.sex')
@ -443,10 +577,19 @@
this.model1.userInfo.birthday = uni.$u.timeFormat(e.value, 'yyyy-mm-dd')
// this.$refs.form1.validateField('userInfo.birthday')
},
ServeTimeConfirm(e) {
this.showServeTime = false
this.model1.userInfo.serveTime = uni.$u.timeFormat(e.value, 'yyyy-mm-dd')
// this.$refs.form1.validateField('userInfo.birthday')
},
birthdayClose() {
this.showBirthday = false
// this.$refs.form1.validateField('userInfo.birthday')
},
ServeTimeClose() {
this.showServeTime = false
// this.$refs.form1.validateField('userInfo.birthday')
},
selctZU(e) {
console.log(e);
},
@ -531,9 +674,26 @@
background-color: #F5F5F5;
}
.WenYiUpload{
padding: 32rpx; background-color: #F8F8F8; margin-top: 16rpx;
}
.chengjiu {
background-color: #F5f5f5;
border-radius: 16rpx;
padding-left: 12rpx;
height: 80rpx;
width: 550rpx;
}
.p32 {
padding: 32rpx !important;
}
.WenYiUpload {
padding: 32rpx;
background-color: #F8F8F8;
margin-top: 16rpx;
}
.te /deep/ .u-form-item__body__right__content__slot {
flex-wrap: wrap !important;
@ -549,6 +709,22 @@
}
.data_itm_box {
.chen_itm {
display: flex;
justify-content: space-between;
align-items: center;
margin-bottom: 16rpx;
.right_img_box {
width: 80rpx;
height: 80rpx;
margin-left: 16rpx;
display: flex;
align-items: center;
justify-content: center;
}
}
margin-bottom: 16rpx;
border: 1px solid transparent;
padding: 0 32rpx;

510
src/pages/my/My.vue
View File

@ -1,257 +1,293 @@
<template>
<view>
<view class="top">
<image class="bg" src="../../static/MyBg.png" mode=""></image>
<view class="avator_box">
<view class="tou">
<image class="avtor" src="../../static/MoneyIco.png" mode=""></image>
</view>
<view class="user_name">
<view class="user_name_de">
谢加息
</view>
<view class="words">
学而不思则罔,思不学则殆
</view>
</view>
<view class="arrow">
<image src="../../static/rightArrow.png" mode=""></image>
</view>
</view>
</view>
<!-- 内容区 -->
<view class="content_area">
<view class="fans_box">
<view class="fans_itm">
<view class="nums">
568
</view>
<view class="itms_name">
关注
</view>
</view>
<view class="fans_itm">
<view class="nums">
568
</view>
<view class="itms_name">
收藏
</view>
</view>
<view class="fans_itm">
<view class="nums">
568
</view>
<view class="itms_name">
粉丝
</view>
</view>
</view>
<view class="jifen_box">
<view class="jifen_box_itm">
<view class="ji_ico">
<image src="../../static/MoneyIco.png" mode=""></image>
</view>
<view class="ji_word_box" @click="gopointsPg">
<view class="ji_word_title">
积分
</view>
<view class="ji_con">
积分 686
</view>
</view>
</view>
<view class="jifen_box_itm">
<view class="ji_ico">
<image src="../../static/DunIcon.png" mode=""></image>
</view>
<view class="ji_word_box" @click="goOrderDetails">
<view class="ji_word_title">
我的交易
</view>
<view class="ji_con">
作品交易订单
</view>
</view>
</view>
</view>
<view class="content_bott">
<view class="content_bott_itm" v-for="(v,i) in itmes" :key="i">
<view class="content_bott_wods">
<!-- 我的作品 -->
{{v}}
</view>
<view class="content_bott_arrow">
<image src="../../static/rightArrow.png" mode=""></image>
</view>
</view>
</view>
</view>
<tabbar tabbarId='5'></tabbar>
</view>
<view>
<view class="top">
<image class="bg" src="../../static/MyBg.png" mode=""></image>
<view class="avator_box" @click="GoPersonalCenter">
<view class="tou">
<image class="avtor" src="../../static/MoneyIco.png" mode=""></image>
</view>
<view class="user_name">
<view class="user_name_de">
谢加息
</view>
<view class="words">
学而不思则罔,思不学则殆
</view>
</view>
<view class="arrow">
<image src="../../static/rightArrow.png" mode=""></image>
</view>
</view>
</view>
<!-- 内容区 -->
<view class="content_area">
<view class="fans_box">
<view class="fans_itm">
<view class="nums">
568
</view>
<view class="itms_name">
关注
</view>
</view>
<view class="fans_itm">
<view class="nums">
568
</view>
<view class="itms_name">
收藏
</view>
</view>
<view class="fans_itm">
<view class="nums">
568
</view>
<view class="itms_name">
粉丝
</view>
</view>
</view>
<view class="jifen_box">
<view class="jifen_box_itm">
<view class="ji_ico">
<image src="../../static/MoneyIco.png" mode=""></image>
</view>
<view class="ji_word_box" @click="gopointsPg">
<view class="ji_word_title">
积分
</view>
<view class="ji_con">
积分 686
</view>
</view>
</view>
<view class="jifen_box_itm">
<view class="ji_ico">
<image src="../../static/DunIcon.png" mode=""></image>
</view>
<view class="ji_word_box" @click="goOrderDetails">
<view class="ji_word_title">
我的交易
</view>
<view class="ji_con">
作品交易订单
</view>
</view>
</view>
</view>
<view class="content_bott">
<view class="content_bott_itm" v-for="(v,i) in itmes" :key="i">
<view class="content_bott_wods">
<!-- 我的作品 -->
{{v}}
</view>
<view class="content_bott_arrow">
<image src="../../static/rightArrow.png" mode=""></image>
</view>
</view>
</view>
</view>
<tabbar tabbarId='5'></tabbar>
</view>
</template>
<script>
export default {
data() {
return {
itmes:["我的作品","活动管理","消息","设置"]
};
},
methods:{
gopointsPg(){
uni.navigateTo({
url:"/pages/MyPoints/MyPoints"
})
},
goOrderDetails(){
uni.navigateTo({
url:"/pages/OrderDetail/OrderDetail"
})
}
}
}
export default {
data() {
return {
itmes: ["我的作品", "活动管理", "消息", "设置"]
};
},
methods: {
gopointsPg() {
uni.navigateTo({
url: "/pages/MyPoints/MyPoints"
})
},
goOrderDetails() {
uni.navigateTo({
url: "/pages/OrderDetail/OrderDetail"
})
},
GoPersonalCenter() {
console.log("dd");
uni.navigateTo({
url: "/pages/PersonalCenter/PersonalCenter"
})
}
}
}
</script>
<style lang="scss">
page{
background-color: #F4F5F7 ;
}
image {
width: 100%;
height: 100%;
}
.top {
height: 192px;
border: 1px solid transparent;
position: relative;
page {
background-color: #F4F5F7;
}
.avator_box {
display: flex;
justify-content: space-between;
align-items: center;
box-sizing: border-box;
position: absolute;
bottom: 0px;
height: 80px;
border: 1px solid transparent;
width: 100%;
padding: 2px 16px;
image {
width: 100%;
height: 100%;
}
.tou {
width: 72px;
height: 72px;
border: 1px solid transparent;
border-radius: 50%;
overflow: hidden;
.top {
height: 192px;
border: 1px solid transparent;
position: relative;
}
.avator_box {
display: flex;
justify-content: space-between;
align-items: center;
box-sizing: border-box;
position: absolute;
bottom: 0px;
height: 80px;
border: 1px solid transparent;
width: 100%;
padding: 2px 16px;
.user_name {
flex-grow: 1;
.tou {
width: 72px;
height: 72px;
border: 1px solid transparent;
border-radius: 50%;
overflow: hidden;
margin-left: 12px;
}
.user_name_de {
color: #251B1D;
font-size: 20px;
font-weight: 600;
.user_name {
flex-grow: 1;
}
margin-left: 12px;
.words {
margin-top: 8px;
color: #AFADB0;
font-size: 12px;
}
.user_name_de {
color: #251B1D;
font-size: 20px;
font-weight: 600;
}
}
.arrow {
width: 24px;
height: 24px;
}
}
.words {
margin-top: 8px;
color: #AFADB0;
font-size: 12px;
}
}
}
.content_area{
padding: 0 16px;
.fans_box{
display: flex;
justify-content: space-around;
align-items: center;
height: 80px;
border: 1px solid transparent;
border-radius: 8px;
background-color: #FFFFFF;
.fans_itm{
.nums{ color: #251B1D ; font-weight: bold; font-family: DIN-Bold, DIN; font-size: 16px;}
.itms_name{color: #AFADB0 ; font-size: 12px; margin-top: 8px;}
}
}
.jifen_box{
padding: 16px 0px;
display: flex;
justify-content: space-between;
align-items: center;
.jifen_box_itm{
box-sizing: border-box;
padding: 12px;
display: flex;
width: 166px;
height: 68px;
background-color: #FFFFFF;
border-radius: 8px;
.ji_ico{
width: 22px;
height: 22px;
border-radius: 50%;
overflow: hidden;
}
.ji_word_box{
margin-left: 8px;
.ji_word_title{font-size: 14px;
color: #251B1D;
font-weight: 600;}
.ji_con{ color: #AFADB0 ; font-size: 12px; font-weight: 400; margin-top: 4px;}
}
}
}
.content_bott{
box-sizing: border-box;
padding: 16px;
background-color: #FFFFFF;
border-radius: 8px;
.content_bott_itm{
display: flex;
justify-content: space-between;
align-items: center;
margin: 26px 0px;
.content_bott_wods{
font-size: 14px;
color: #251B1D;
font-weight: 600;
}
.content_bott_arrow{
width: 16px;
height: 16px;
}
}
}
}
.arrow {
width: 24px;
height: 24px;
}
}
}
.content_area {
padding: 0 16px;
.fans_box {
display: flex;
justify-content: space-around;
align-items: center;
height: 80px;
border: 1px solid transparent;
border-radius: 8px;
background-color: #FFFFFF;
.fans_itm {
.nums {
color: #251B1D;
font-weight: bold;
font-family: DIN-Bold, DIN;
font-size: 16px;
}
.itms_name {
color: #AFADB0;
font-size: 12px;
margin-top: 8px;
}
}
}
.jifen_box {
padding: 16px 0px;
display: flex;
justify-content: space-between;
align-items: center;
.jifen_box_itm {
box-sizing: border-box;
padding: 12px;
display: flex;
width: 166px;
height: 68px;
background-color: #FFFFFF;
border-radius: 8px;
.ji_ico {
width: 22px;
height: 22px;
border-radius: 50%;
overflow: hidden;
}
.ji_word_box {
margin-left: 8px;
.ji_word_title {
font-size: 14px;
color: #251B1D;
font-weight: 600;
}
.ji_con {
color: #AFADB0;
font-size: 12px;
font-weight: 400;
margin-top: 4px;
}
}
}
}
.content_bott {
box-sizing: border-box;
padding: 16px;
background-color: #FFFFFF;
border-radius: 8px;
.content_bott_itm {
display: flex;
justify-content: space-between;
align-items: center;
margin: 26px 0px;
.content_bott_wods {
font-size: 14px;
color: #251B1D;
font-weight: 600;
}
.content_bott_arrow {
width: 16px;
height: 16px;
}
}
}
}
</style>

58
src/uni_modules/uni-data-picker/changelog.md Normal file
View File

@ -0,0 +1,58 @@
## 1.0.4（2022-04-19）
- 修复 字节小程序 本地数据无法选择下一级的Bug
## 1.0.3（2022-02-25）
- 修复 nvue 不支持的 v-show 的 bug
## 1.0.2（2022-02-25）
- 修复 条件编译 nvue 不支持的 css 样式
## 1.0.1（2021-11-23）
- 修复 由上个版本引发的map、v-model等属性不生效的bug
## 1.0.0（2021-11-19）
- 优化 组件 UI，并提供设计资源，详见:[https://uniapp.dcloud.io/component/uniui/resource](https://uniapp.dcloud.io/component/uniui/resource)
- 文档迁移，详见:[https://uniapp.dcloud.io/component/uniui/uni-data-picker](https://uniapp.dcloud.io/component/uniui/uni-data-picker)
## 0.4.9（2021-10-28）
- 修复 VUE2 v-model 概率无效的 bug
## 0.4.8（2021-10-27）
- 修复 v-model 概率无效的 bug
## 0.4.7（2021-10-25）
- 新增 属性 spaceInfo 服务空间配置 HBuilderX 3.2.11+
- 修复 树型 uniCloud 数据类型为 int 时报错的 bug
## 0.4.6（2021-10-19）
- 修复 非 VUE3 v-model 为 0 时无法选中的 bug
## 0.4.5（2021-09-26）
- 新增 清除已选项的功能（通过 clearIcon 属性配置是否显示按钮），同时提供 clear 方法以供调用，二者等效
- 修复 readonly 为 true 时报错的 bug
## 0.4.4（2021-09-26）
- 修复 上一版本造成的 map 属性失效的 bug
- 新增 ellipsis 属性，支持配置 tab 选项长度过长时是否自动省略
## 0.4.3（2021-09-24）
- 修复 某些情况下级联未触发的 bug
## 0.4.2（2021-09-23）
- 新增 提供 show 和 hide 方法，开发者可以通过 ref 调用
- 新增 选项内容过长自动添加省略号
## 0.4.1（2021-09-15）
- 新增 map 属性 字段映射，将 text/value 映射到数据中的其他字段
## 0.4.0（2021-07-13）
- 组件兼容 vue3，如何创建 vue3 项目，详见 [uni-app 项目支持 vue3 介绍](https://ask.dcloud.net.cn/article/37834)
## 0.3.5（2021-06-04）
- 修复 无法加载云端数据的问题
## 0.3.4（2021-05-28）
- 修复 v-model 无效问题
- 修复 loaddata 为空数据组时加载时间过长问题
- 修复 上个版本引出的本地数据无法选择带有 children 的 2 级节点
## 0.3.3（2021-05-12）
- 新增 组件示例地址
## 0.3.2（2021-04-22）
- 修复 非树形数据有 where 属性查询报错的问题
## 0.3.1（2021-04-15）
- 修复 本地数据概率无法回显时问题
## 0.3.0（2021-04-07）
- 新增 支持云端非树形表结构数据
- 修复 根节点 parent_field 字段等于 null 时选择界面错乱问题
## 0.2.0（2021-03-15）
- 修复 nodeclick、popupopened、popupclosed 事件无法触发的问题
## 0.1.9（2021-03-09）
- 修复 微信小程序某些情况下无法选择的问题
## 0.1.8（2021-02-05）
- 优化 部分样式在 nvue 上的兼容表现
## 0.1.7（2021-02-05）
- 调整为 uni_modules 目录规范

45
src/uni_modules/uni-data-picker/components/uni-data-picker/keypress.js Normal file
View File

@ -0,0 +1,45 @@
// #ifdef H5
export default {
name: 'Keypress',
props: {
disable: {
type: Boolean,
default: false
}
},
mounted () {
const keyNames = {
esc: ['Esc', 'Escape'],
tab: 'Tab',
enter: 'Enter',
space: [' ', 'Spacebar'],
up: ['Up', 'ArrowUp'],
left: ['Left', 'ArrowLeft'],
right: ['Right', 'ArrowRight'],
down: ['Down', 'ArrowDown'],
delete: ['Backspace', 'Delete', 'Del']
}
const listener = ($event) => {
if (this.disable) {
return
}
const keyName = Object.keys(keyNames).find(key => {
const keyName = $event.key
const value = keyNames[key]
return value === keyName || (Array.isArray(value) && value.includes(keyName))
})
if (keyName) {
// 避免和其他按键事件冲突
setTimeout(() => {
this.$emit(keyName, {})
}, 0)
}
}
document.addEventListener('keyup', listener)
this.$once('hook:beforeDestroy', () => {
document.removeEventListener('keyup', listener)
})
},
render: () => {}
}
// #endif

539
src/uni_modules/uni-data-picker/components/uni-data-picker/uni-data-picker.vue Normal file
View File

@ -0,0 +1,539 @@
<template>
<view class="uni-data-tree">
<view class="uni-data-tree-input" @click="handleInput">
<slot :options="options" :data="inputSelected" :error="errorMessage">
<view class="input-value" :class="{'input-value-border': border}">
<text v-if="errorMessage" class="selected-area error-text">{{errorMessage}}</text>
<view v-else-if="loading && !isOpened" class="selected-area">
<uni-load-more class="load-more" :contentText="loadMore" status="loading"></uni-load-more>
</view>
<scroll-view v-else-if="inputSelected.length" class="selected-area" scroll-x="true">
<view class="selected-list">
<view class="selected-item" v-for="(item,index) in inputSelected" :key="index">
<text>{{item.text}}</text><text v-if="index<inputSelected.length-1"
class="input-split-line">{{split}}</text>
</view>
</view>
</scroll-view>
<text v-else class="selected-area placeholder">{{placeholder}}</text>
<view v-if="clearIcon && !readonly && inputSelected.length" class="icon-clear"
@click.stop="clear">
<uni-icons type="clear" color="#e1e1e1" size="14"></uni-icons>
</view>
<view class="arrow-area" v-if="(!clearIcon || !inputSelected.length) && !readonly ">
<view class="input-arrow"></view>
</view>
</view>
</slot>
</view>
<view class="uni-data-tree-cover" v-if="isOpened" @click="handleClose"></view>
<view class="uni-data-tree-dialog" v-if="isOpened">
<view class="uni-popper__arrow"></view>
<view class="dialog-caption">
<view class="title-area">
<text class="dialog-title">{{popupTitle}}</text>
</view>
<view class="dialog-close" @click="handleClose">
<view class="dialog-close-plus" data-id="close"></view>
<view class="dialog-close-plus dialog-close-rotate" data-id="close"></view>
</view>
</view>
<data-picker-view class="picker-view" ref="pickerView" v-model="dataValue" :localdata="localdata"
:preload="preload" :collection="collection" :field="field" :orderby="orderby" :where="where"
:step-searh="stepSearh" :self-field="selfField" :parent-field="parentField" :managed-mode="true"
:map="map" :ellipsis="ellipsis" @change="onchange" @datachange="ondatachange" @nodeclick="onnodeclick">
</data-picker-view>
</view>
</view>
</template>
<script>
import dataPicker from "../uni-data-pickerview/uni-data-picker.js"
import DataPickerView from "../uni-data-pickerview/uni-data-pickerview.vue"
/**
* DataPicker 级联选择
* @description 支持单列、和多列级联选择。列数没有限制，如果屏幕显示不全，顶部tab区域会左右滚动。
* @tutorial https://ext.dcloud.net.cn/plugin?id=3796
* @property {String} popup-title 弹出窗口标题
* @property {Array} localdata 本地数据，参考
* @property {Boolean} border = [true|false] 是否有边框
* @property {Boolean} readonly = [true|false] 是否仅读
* @property {Boolean} preload = [true|false] 是否预加载数据
* @value true 开启预加载数据，点击弹出窗口后显示已加载数据
* @value false 关闭预加载数据，点击弹出窗口后开始加载数据
* @property {Boolean} step-searh = [true|false] 是否分布查询
* @value true 启用分布查询，仅查询当前选中节点
* @value false 关闭分布查询，一次查询出所有数据
* @property {String|DBFieldString} self-field 分布查询当前字段名称
* @property {String|DBFieldString} parent-field 分布查询父字段名称
* @property {String|DBCollectionString} collection 表名
* @property {String|DBFieldString} field 查询字段，多个字段用 `,` 分割
* @property {String} orderby 排序字段及正序倒叙设置
* @property {String|JQLString} where 查询条件
* @event {Function} popupshow 弹出的选择窗口打开时触发此事件
* @event {Function} popuphide 弹出的选择窗口关闭时触发此事件
*/
export default {
name: 'UniDataPicker',
emits: ['popupopened', 'popupclosed', 'nodeclick', 'input', 'change', 'update:modelValue'],
mixins: [dataPicker],
components: {
DataPickerView
},
props: {
options: {
type: [Object, Array],
default () {
return {}
}
},
popupTitle: {
type: String,
default: '请选择'
},
placeholder: {
type: String,
default: '请选择'
},
heightMobile: {
type: String,
default: ''
},
readonly: {
type: Boolean,
default: false
},
clearIcon: {
type: Boolean,
default: true
},
border: {
type: Boolean,
default: true
},
split: {
type: String,
default: '/'
},
ellipsis: {
type: Boolean,
default: true
}
},
data() {
return {
isOpened: false,
inputSelected: []
}
},
created() {
this.form = this.getForm('uniForms')
this.formItem = this.getForm('uniFormsItem')
if (this.formItem) {
if (this.formItem.name) {
this.rename = this.formItem.name
this.form.inputChildrens.push(this)
}
}
this.$nextTick(() => {
this.load()
})
},
methods: {
clear() {
this.inputSelected.splice(0)
this._dispatchEvent([])
},
onPropsChange() {
this._treeData = []
this.selectedIndex = 0
this.load()
},
load() {
if (this.readonly) {
this._processReadonly(this.localdata, this.dataValue)
return
}
if (this.isLocaldata) {
this.loadData()
this.inputSelected = this.selected.slice(0)
} else if (!this.parentField && !this.selfField && this.hasValue) {
this.getNodeData(() => {
this.inputSelected = this.selected.slice(0)
})
} else if (this.hasValue) {
this.getTreePath(() => {
this.inputSelected = this.selected.slice(0)
})
}
},
getForm(name = 'uniForms') {
let parent = this.$parent;
let parentName = parent.$options.name;
while (parentName !== name) {
parent = parent.$parent;
if (!parent) return false;
parentName = parent.$options.name;
}
return parent;
},
show() {
this.isOpened = true
setTimeout(() => {
this.$refs.pickerView.updateData({
treeData: this._treeData,
selected: this.selected,
selectedIndex: this.selectedIndex
})
}, 200)
this.$emit('popupopened')
},
hide() {
this.isOpened = false
this.$emit('popupclosed')
},
handleInput() {
if (this.readonly) {
return
}
this.show()
},
handleClose(e) {
this.hide()
},
onnodeclick(e) {
this.$emit('nodeclick', e)
},
ondatachange(e) {
this._treeData = this.$refs.pickerView._treeData
},
onchange(e) {
this.hide()
this.inputSelected = e
this._dispatchEvent(e)
},
_processReadonly(dataList, value) {
var isTree = dataList.findIndex((item) => {
return item.children
})
if (isTree > -1) {
let inputValue
if (Array.isArray(value)) {
inputValue = value[value.length - 1]
if (typeof inputValue === 'object' && inputValue.value) {
inputValue = inputValue.value
}
} else {
inputValue = value
}
this.inputSelected = this._findNodePath(inputValue, this.localdata)
return
}
if (!this.hasValue) {
this.inputSelected = []
return
}
let result = []
for (let i = 0; i < value.length; i++) {
var val = value[i]
var item = dataList.find((v) => {
return v.value == val
})
if (item) {
result.push(item)
}
}
if (result.length) {
this.inputSelected = result
}
},
_filterForArray(data, valueArray) {
var result = []
for (let i = 0; i < valueArray.length; i++) {
var value = valueArray[i]
var found = data.find((item) => {
return item.value == value
})
if (found) {
result.push(found)
}
}
return result
},
_dispatchEvent(selected) {
let item = {}
if (selected.length) {
var value = new Array(selected.length)
for (var i = 0; i < selected.length; i++) {
value[i] = selected[i].value
}
item = selected[selected.length - 1]
} else {
item.value = ''
}
if (this.formItem) {
this.formItem.setValue(item.value)
}
this.$emit('input', item.value)
this.$emit('update:modelValue', item.value)
this.$emit('change', {
detail: {
value: selected
}
})
}
}
}
</script>
<style >
.uni-data-tree {
position: relative;
font-size: 14px;
}
.error-text {
color: #DD524D;
}
.input-value {
/* #ifndef APP-NVUE */
display: flex;
/* #endif */
flex-direction: row;
align-items: center;
flex-wrap: nowrap;
font-size: 14px;
line-height: 38px;
padding: 0 5px;
overflow: hidden;
/* #ifdef APP-NVUE */
height: 40px;
/* #endif */
}
.input-value-border {
border: 1px solid #e5e5e5;
border-radius: 5px;
}
.selected-area {
flex: 1;
overflow: hidden;
/* #ifndef APP-NVUE */
display: flex;
/* #endif */
flex-direction: row;
}
.load-more {
/* #ifndef APP-NVUE */
margin-right: auto;
/* #endif */
/* #ifdef APP-NVUE */
width: 40px;
/* #endif */
}
.selected-list {
/* #ifndef APP-NVUE */
display: flex;
/* #endif */
flex-direction: row;
flex-wrap: nowrap;
padding: 0 5px;
}
.selected-item {
flex-direction: row;
padding: 0 1px;
/* #ifndef APP-NVUE */
white-space: nowrap;
/* #endif */
}
.placeholder {
color: grey;
}
.input-split-line {
opacity: .5;
}
.arrow-area {
position: relative;
width: 20px;
/* #ifndef APP-NVUE */
margin-bottom: 5px;
margin-left: auto;
display: flex;
/* #endif */
justify-content: center;
transform: rotate(-45deg);
transform-origin: center;
}
.input-arrow {
width: 7px;
height: 7px;
border-left: 1px solid #999;
border-bottom: 1px solid #999;
}
.uni-data-tree-cover {
position: fixed;
left: 0;
top: 0;
right: 0;
bottom: 0;
background-color: rgba(0, 0, 0, .4);
/* #ifndef APP-NVUE */
display: flex;
/* #endif */
flex-direction: column;
z-index: 100;
}
.uni-data-tree-dialog {
position: fixed;
left: 0;
top: 20%;
right: 0;
bottom: 0;
background-color: #FFFFFF;
border-top-left-radius: 10px;
border-top-right-radius: 10px;
/* #ifndef APP-NVUE */
display: flex;
/* #endif */
flex-direction: column;
z-index: 102;
overflow: hidden;
/* #ifdef APP-NVUE */
width: 750rpx;
/* #endif */
}
.dialog-caption {
position: relative;
/* #ifndef APP-NVUE */
display: flex;
/* #endif */
flex-direction: row;
/* border-bottom: 1px solid #f0f0f0; */
}
.title-area {
/* #ifndef APP-NVUE */
display: flex;
/* #endif */
align-items: center;
/* #ifndef APP-NVUE */
margin: auto;
/* #endif */
padding: 0 10px;
}
.dialog-title {
/* font-weight: bold; */
line-height: 44px;
}
.dialog-close {
position: absolute;
top: 0;
right: 0;
bottom: 0;
/* #ifndef APP-NVUE */
display: flex;
/* #endif */
flex-direction: row;
align-items: center;
padding: 0 15px;
}
.dialog-close-plus {
width: 16px;
height: 2px;
background-color: #666;
border-radius: 2px;
transform: rotate(45deg);
}
.dialog-close-rotate {
position: absolute;
transform: rotate(-45deg);
}
.picker-view {
flex: 1;
overflow: hidden;
}
/* #ifdef H5 */
@media all and (min-width: 768px) {
.uni-data-tree-cover {
background-color: transparent;
}
.uni-data-tree-dialog {
position: absolute;
top: 55px;
height: auto;
min-height: 400px;
max-height: 50vh;
background-color: #fff;
border: 1px solid #EBEEF5;
box-shadow: 0 2px 12px 0 rgba(0, 0, 0, 0.1);
border-radius: 4px;
overflow: unset;
}
.dialog-caption {
display: none;
}
.icon-clear {
margin-right: 5px;
}
}
/* #endif */
/* picker 弹出层通用的指示小三角, todo：扩展至上下左右方向定位 */
/* #ifndef APP-NVUE */
.uni-popper__arrow,
.uni-popper__arrow::after {
position: absolute;
display: block;
width: 0;
height: 0;
border-color: transparent;
border-style: solid;
border-width: 6px;
}
.uni-popper__arrow {
filter: drop-shadow(0 2px 12px rgba(0, 0, 0, 0.03));
top: -6px;
left: 10%;
margin-right: 3px;
border-top-width: 0;
border-bottom-color: #EBEEF5;
}
.uni-popper__arrow::after {
content: " ";
top: 1px;
margin-left: -6px;
border-top-width: 0;
border-bottom-color: #fff;
}
/* #endif */
</style>

563
src/uni_modules/uni-data-picker/components/uni-data-pickerview/uni-data-picker.js Normal file
View File

@ -0,0 +1,563 @@
export default {
props: {
localdata: {
type: [Array, Object],
default () {
return []
}
},
spaceInfo: {
type: Object,
default () {
return {}
}
},
collection: {
type: String,
default: ''
},
action: {
type: String,
default: ''
},
field: {
type: String,
default: ''
},
orderby: {
type: String,
default: ''
},
where: {
type: [String, Object],
default: ''
},
pageData: {
type: String,
default: 'add'
},
pageCurrent: {
type: Number,
default: 1
},
pageSize: {
type: Number,
default: 20
},
getcount: {
type: [Boolean, String],
default: false
},
getone: {
type: [Boolean, String],
default: false
},
gettree: {
type: [Boolean, String],
default: false
},
manual: {
type: Boolean,
default: false
},
value: {
type: [Array, String, Number],
default () {
return []
}
},
modelValue: {
type: [Array, String, Number],
default () {
return []
}
},
preload: {
type: Boolean,
default: false
},
stepSearh: {
type: Boolean,
default: true
},
selfField: {
type: String,
default: ''
},
parentField: {
type: String,
default: ''
},
multiple: {
type: Boolean,
default: false
},
map: {
type: Object,
default() {
return {
text: "text",
value: "value"
}
}
}
},
data() {
return {
loading: false,
errorMessage: '',
loadMore: {
contentdown: '',
contentrefresh: '',
contentnomore: ''
},
dataList: [],
selected: [],
selectedIndex: 0,
page: {
current: this.pageCurrent,
size: this.pageSize,
count: 0
}
}
},
computed: {
isLocaldata() {
return !this.collection.length
},
postField() {
let fields = [this.field];
if (this.parentField) {
fields.push(`${this.parentField} as parent_value`);
}
return fields.join(',');
},
dataValue() {
let isModelValue = Array.isArray(this.modelValue) ? (this.modelValue.length > 0) : (this.modelValue !== null || this.modelValue !== undefined)
return isModelValue ? this.modelValue : this.value
},
hasValue() {
if (typeof this.dataValue === 'number') {
return true
}
return (this.dataValue != null) && (this.dataValue.length > 0)
}
},
created() {
this.$watch(() => {
var al = [];
['pageCurrent',
'pageSize',
'spaceInfo',
'value',
'modelValue',
'localdata',
'collection',
'action',
'field',
'orderby',
'where',
'getont',
'getcount',
'gettree'
].forEach(key => {
al.push(this[key])
});
return al
}, (newValue, oldValue) => {
let needReset = false
for (let i = 2; i < newValue.length; i++) {
if (newValue[i] != oldValue[i]) {
needReset = true
break
}
}
if (newValue[0] != oldValue[0]) {
this.page.current = this.pageCurrent
}
this.page.size = this.pageSize
this.onPropsChange()
})
this._treeData = []
},
methods: {
onPropsChange() {
this._treeData = []
},
getCommand(options = {}) {
/* eslint-disable no-undef */
let db = uniCloud.database(this.spaceInfo)
const action = options.action || this.action
if (action) {
db = db.action(action)
}
const collection = options.collection || this.collection
db = db.collection(collection)
const where = options.where || this.where
if (!(!where || !Object.keys(where).length)) {
db = db.where(where)
}
const field = options.field || this.field
if (field) {
db = db.field(field)
}
const orderby = options.orderby || this.orderby
if (orderby) {
db = db.orderBy(orderby)
}
const current = options.pageCurrent !== undefined ? options.pageCurrent : this.page.current
const size = options.pageSize !== undefined ? options.pageSize : this.page.size
const getCount = options.getcount !== undefined ? options.getcount : this.getcount
const getTree = options.gettree !== undefined ? options.gettree : this.gettree
const getOptions = {
getCount,
getTree
}
if (options.getTreePath) {
getOptions.getTreePath = options.getTreePath
}
db = db.skip(size * (current - 1)).limit(size).get(getOptions)
return db
},
getNodeData(callback) {
if (this.loading) {
return
}
this.loading = true
this.getCommand({
field: this.postField,
where: this._pathWhere()
}).then((res) => {
this.loading = false
this.selected = res.result.data
callback && callback()
}).catch((err) => {
this.loading = false
this.errorMessage = err
})
},
getTreePath(callback) {
if (this.loading) {
return
}
this.loading = true
this.getCommand({
field: this.postField,
getTreePath: {
startWith: `${this.selfField}=='${this.dataValue}'`
}
}).then((res) => {
this.loading = false
let treePath = []
this._extractTreePath(res.result.data, treePath)
this.selected = treePath
callback && callback()
}).catch((err) => {
this.loading = false
this.errorMessage = err
})
},
loadData() {
if (this.isLocaldata) {
this._processLocalData()
return
}
if (this.dataValue != null) {
this._loadNodeData((data) => {
this._treeData = data
this._updateBindData()
this._updateSelected()
})
return
}
if (this.stepSearh) {
this._loadNodeData((data) => {
this._treeData = data
this._updateBindData()
})
} else {
this._loadAllData((data) => {
this._treeData = []
this._extractTree(data, this._treeData, null)
this._updateBindData()
})
}
},
_loadAllData(callback) {
if (this.loading) {
return
}
this.loading = true
this.getCommand({
field: this.postField,
gettree: true,
startwith: `${this.selfField}=='${this.dataValue}'`
}).then((res) => {
this.loading = false
callback(res.result.data)
this.onDataChange()
}).catch((err) => {
this.loading = false
this.errorMessage = err
})
},
_loadNodeData(callback, pw) {
if (this.loading) {
return
}
this.loading = true
this.getCommand({
field: this.postField,
where: pw || this._postWhere(),
pageSize: 500
}).then((res) => {
this.loading = false
callback(res.result.data)
this.onDataChange()
}).catch((err) => {
this.loading = false
this.errorMessage = err
})
},
_pathWhere() {
let result = []
let where_field = this._getParentNameByField();
if (where_field) {
result.push(`${where_field} == '${this.dataValue}'`)
}
if (this.where) {
return `(${this.where}) && (${result.join(' || ')})`
}
return result.join(' || ')
},
_postWhere() {
let result = []
let selected = this.selected
let parentField = this.parentField
if (parentField) {
result.push(`${parentField} == null || ${parentField} == ""`)
}
if (selected.length) {
for (var i = 0; i < selected.length - 1; i++) {
result.push(`${parentField} == '${selected[i].value}'`)
}
}
let where = []
if (this.where) {
where.push(`(${this.where})`)
}
if (result.length) {
where.push(`(${result.join(' || ')})`)
}
return where.join(' && ')
},
_nodeWhere() {
let result = []
let selected = this.selected
if (selected.length) {
result.push(`${this.parentField} == '${selected[selected.length - 1].value}'`)
}
if (this.where) {
return `(${this.where}) && (${result.join(' || ')})`
}
return result.join(' || ')
},
_getParentNameByField() {
const fields = this.field.split(',');
let where_field = null;
for (let i = 0; i < fields.length; i++) {
const items = fields[i].split('as');
if (items.length < 2) {
continue;
}
if (items[1].trim() === 'value') {
where_field = items[0].trim();
break;
}
}
return where_field
},
_isTreeView() {
return (this.parentField && this.selfField)
},
_updateSelected() {
var dl = this.dataList
var sl = this.selected
let textField = this.map.text
let valueField = this.map.value
for (var i = 0; i < sl.length; i++) {
var value = sl[i].value
var dl2 = dl[i]
for (var j = 0; j < dl2.length; j++) {
var item2 = dl2[j]
if (item2[valueField] === value) {
sl[i].text = item2[textField]
break
}
}
}
},
_updateBindData(node) {
const {
dataList,
hasNodes
} = this._filterData(this._treeData, this.selected)
let isleaf = this._stepSearh === false && !hasNodes
if (node) {
node.isleaf = isleaf
}
this.dataList = dataList
this.selectedIndex = dataList.length - 1
if (!isleaf && this.selected.length < dataList.length) {
this.selected.push({
value: null,
text: "请选择"
})
}
return {
isleaf,
hasNodes
}
},
_filterData(data, paths) {
let dataList = []
let hasNodes = true
dataList.push(data.filter((item) => {
return (item.parent_value === null || item.parent_value === undefined || item.parent_value === '')
}))
for (let i = 0; i < paths.length; i++) {
var value = paths[i].value
var nodes = data.filter((item) => {
return item.parent_value === value
})
if (nodes.length) {
dataList.push(nodes)
} else {
hasNodes = false
}
}
return {
dataList,
hasNodes
}
},
_extractTree(nodes, result, parent_value) {
let list = result || []
let valueField = this.map.value
for (let i = 0; i < nodes.length; i++) {
let node = nodes[i]
let child = {}
for (let key in node) {
if (key !== 'children') {
child[key] = node[key]
}
}
if (parent_value !== null && parent_value !== undefined && parent_value !== '') {
child.parent_value = parent_value
}
result.push(child)
let children = node.children
if (children) {
this._extractTree(children, result, node[valueField])
}
}
},
_extractTreePath(nodes, result) {
let list = result || []
for (let i = 0; i < nodes.length; i++) {
let node = nodes[i]
let child = {}
for (let key in node) {
if (key !== 'children') {
child[key] = node[key]
}
}
result.push(child)
let children = node.children
if (children) {
this._extractTreePath(children, result)
}
}
},
_findNodePath(key, nodes, path = []) {
let textField = this.map.text
let valueField = this.map.value
for (let i = 0; i < nodes.length; i++) {
let node = nodes[i]
let children = node.children
let text = node[textField]
let value = node[valueField]
path.push({
value,
text
})
if (value === key) {
return path
}
if (children) {
const p = this._findNodePath(key, children, path)
if (p.length) {
return p
}
}
path.pop()
}
return []
},
_processLocalData() {
this._treeData = []
this._extractTree(this.localdata, this._treeData)
var inputValue = this.dataValue
if (inputValue === undefined) {
return
}
if (Array.isArray(inputValue)) {
inputValue = inputValue[inputValue.length - 1]
if (typeof inputValue === 'object' && inputValue[this.map.value]) {
inputValue = inputValue[this.map.value]
}
}
this.selected = this._findNodePath(inputValue, this.localdata)
}
}
}

333
src/uni_modules/uni-data-picker/components/uni-data-pickerview/uni-data-pickerview.vue Normal file
View File

@ -0,0 +1,333 @@
<template>
<view class="uni-data-pickerview">
<scroll-view class="selected-area" scroll-x="true" scroll-y="false" :show-scrollbar="false">
<view class="selected-list">
<template v-for="(item,index) in selected">
<view class="selected-item"
:class="{'selected-item-active':index==selectedIndex, 'selected-item-text-overflow': ellipsis}"
:key="index" v-if="item.text" @click="handleSelect(index)">
<text class="">{{item.text}}</text>
</view>
</template>
</view>
</scroll-view>
<view class="tab-c">
<template v-for="(child, i) in dataList">
<scroll-view class="list" :key="i" v-if="i==selectedIndex" :scroll-y="true">
<view class="item" :class="{'is-disabled': !!item.disable}" v-for="(item, j) in child" :key="j"
@click="handleNodeClick(item, i, j)">
<text class="item-text item-text-overflow">{{item[map.text]}}</text>
<view class="check" v-if="selected.length > i && item[map.value] == selected[i].value"></view>
</view>
</scroll-view>
</template>
<view class="loading-cover" v-if="loading">
<uni-load-more class="load-more" :contentText="loadMore" status="loading"></uni-load-more>
</view>
<view class="error-message" v-if="errorMessage">
<text class="error-text">{{errorMessage}}</text>
</view>
</view>
</view>
</template>
<script>
import dataPicker from "./uni-data-picker.js"
/**
* DataPickerview
* @description uni-data-pickerview
* @tutorial https://ext.dcloud.net.cn/plugin?id=3796
* @property {Array} localdata 本地数据，参考
* @property {Boolean} step-searh = [true|false] 是否分布查询
* @value true 启用分布查询，仅查询当前选中节点
* @value false 关闭分布查询，一次查询出所有数据
* @property {String|DBFieldString} self-field 分布查询当前字段名称
* @property {String|DBFieldString} parent-field 分布查询父字段名称
* @property {String|DBCollectionString} collection 表名
* @property {String|DBFieldString} field 查询字段，多个字段用 `,` 分割
* @property {String} orderby 排序字段及正序倒叙设置
* @property {String|JQLString} where 查询条件
*/
export default {
name: 'UniDataPickerView',
emits: ['nodeclick', 'change', 'datachange', 'update:modelValue'],
mixins: [dataPicker],
props: {
managedMode: {
type: Boolean,
default: false
},
ellipsis: {
type: Boolean,
default: true
}
},
data() {
return {}
},
created() {
if (this.managedMode) {
return
}
this.$nextTick(() => {
this.load()
})
},
methods: {
onPropsChange() {
this._treeData = []
this.selectedIndex = 0
this.load()
},
load() {
if (this.isLocaldata) {
this.loadData()
} else if (this.dataValue.length) {
this.getTreePath((res) => {
this.loadData()
})
}
},
handleSelect(index) {
this.selectedIndex = index
},
handleNodeClick(item, i, j) {
if (item.disable) {
return
}
const node = this.dataList[i][j]
const text = node[this.map.text]
const value = node[this.map.value]
if (i < this.selected.length - 1) {
this.selected.splice(i, this.selected.length - i)
this.selected.push({
text,
value
})
} else if (i === this.selected.length - 1) {
this.selected.splice(i, 1, {
text,
value
})
}
if (node.isleaf) {
this.onSelectedChange(node, node.isleaf)
return
}
const {
isleaf,
hasNodes
} = this._updateBindData()
if (!this._isTreeView() && !hasNodes) {
this.onSelectedChange(node, true)
return
}
if (this.isLocaldata && (!hasNodes || isleaf)) {
this.onSelectedChange(node, true)
return
}
if (!isleaf && !hasNodes) {
this._loadNodeData((data) => {
if (!data.length) {
node.isleaf = true
} else {
this._treeData.push(...data)
this._updateBindData(node)
}
this.onSelectedChange(node, node.isleaf)
}, this._nodeWhere())
return
}
this.onSelectedChange(node, false)
},
updateData(data) {
this._treeData = data.treeData
this.selected = data.selected
if (!this._treeData.length) {
this.loadData()
} else {
//this.selected = data.selected
this._updateBindData()
}
},
onDataChange() {
this.$emit('datachange')
},
onSelectedChange(node, isleaf) {
if (isleaf) {
this._dispatchEvent()
}
if (node) {
this.$emit('nodeclick', node)
}
},
_dispatchEvent() {
this.$emit('change', this.selected.slice(0))
}
}
}
</script>
<style >
.uni-data-pickerview {
flex: 1;
/* #ifndef APP-NVUE */
display: flex;
/* #endif */
flex-direction: column;
overflow: hidden;
height: 100%;
}
.error-text {
color: #DD524D;
}
.loading-cover {
position: absolute;
left: 0;
top: 0;
right: 0;
bottom: 0;
background-color: rgba(255, 255, 255, .5);
/* #ifndef APP-NVUE */
display: flex;
/* #endif */
flex-direction: column;
align-items: center;
z-index: 1001;
}
.load-more {
/* #ifndef APP-NVUE */
margin: auto;
/* #endif */
}
.error-message {
background-color: #fff;
position: absolute;
left: 0;
top: 0;
right: 0;
bottom: 0;
padding: 15px;
opacity: .9;
z-index: 102;
}
/* #ifdef APP-NVUE */
.selected-area {
width: 750rpx;
}
/* #endif */
.selected-list {
/* #ifndef APP-NVUE */
display: flex;
/* #endif */
flex-direction: row;
flex-wrap: nowrap;
padding: 0 5px;
border-bottom: 1px solid #f8f8f8;
}
.selected-item {
margin-left: 10px;
margin-right: 10px;
padding: 12px 0;
text-align: center;
/* #ifndef APP-NVUE */
white-space: nowrap;
/* #endif */
}
.selected-item-text-overflow {
width: 168px;
/* fix nvue */
overflow: hidden;
/* #ifndef APP-NVUE */
width: 6em;
white-space: nowrap;
text-overflow: ellipsis;
-o-text-overflow: ellipsis;
/* #endif */
}
.selected-item-active {
border-bottom: 2px solid #007aff;
}
.selected-item-text {
color: #007aff;
}
.tab-c {
position: relative;
flex: 1;
/* #ifndef APP-NVUE */
display: flex;
/* #endif */
flex-direction: row;
overflow: hidden;
}
.list {
flex: 1;
}
.item {
padding: 12px 15px;
/* border-bottom: 1px solid #f0f0f0; */
/* #ifndef APP-NVUE */
display: flex;
/* #endif */
flex-direction: row;
justify-content: space-between;
}
.is-disabled {
opacity: .5;
}
.item-text {
/* flex: 1; */
color: #333333;
}
.item-text-overflow {
width: 280px;
/* fix nvue */
overflow: hidden;
/* #ifndef APP-NVUE */
width: 20em;
white-space: nowrap;
text-overflow: ellipsis;
-o-text-overflow: ellipsis;
/* #endif */
}
.check {
margin-right: 5px;
border: 2px solid #007aff;
border-left: 0;
border-top: 0;
height: 12px;
width: 6px;
transform-origin: center;
/* #ifndef APP-NVUE */
transition: all 0.3s;
/* #endif */
transform: rotate(45deg);
}
</style>

92
src/uni_modules/uni-data-picker/package.json Normal file
View File

@ -0,0 +1,92 @@
{
"id": "uni-data-picker",
"displayName": "uni-data-picker 数据驱动的picker选择器",
"version": "1.0.4",
"description": "单列、多列级联选择器，常用于省市区城市选择、公司部门选择、多级分类等场景",
"keywords": [
"uni-ui",
"uniui",
"picker",
"级联",
"省市区",
""
],
"repository": "https://github.com/dcloudio/uni-ui",
"engines": {
"HBuilderX": ""
},
"directories": {
"example": "../../temps/example_temps"
},
"dcloudext": {
"category": [
"前端组件",
"通用组件"
],
"sale": {
"regular": {
"price": "0.00"
},
"sourcecode": {
"price": "0.00"
}
},
"contact": {
"qq": ""
},
"declaration": {
"ads": "无",
"data": "无",
"permissions": "无"
},
"npmurl": "https://www.npmjs.com/package/@dcloudio/uni-ui"
},
"uni_modules": {
"dependencies": [
"uni-load-more",
"uni-icons",
"uni-scss"
],
"encrypt": [],
"platforms": {
"cloud": {
"tcb": "y",
"aliyun": "y"
},
"client": {
"App": {
"app-vue": "y",
"app-nvue": "y"
},
"H5-mobile": {
"Safari": "y",
"Android Browser": "y",
"微信浏览器(Android)": "y",
"QQ浏览器(Android)": "y"
},
"H5-pc": {
"Chrome": "y",
"IE": "y",
"Edge": "y",
"Firefox": "y",
"Safari": "y"
},
"小程序": {
"微信": "y",
"阿里": "y",
"百度": "y",
"字节跳动": "y",
"QQ": "y"
},
"快应用": {
"华为": "u",
"联盟": "u"
},
"Vue": {
"vue2": "y",
"vue3": "y"
}
}
}
}
}

22
src/uni_modules/uni-data-picker/readme.md Normal file
View File

@ -0,0 +1,22 @@
## DataPicker 级联选择
> **组件名：uni-data-picker**
> 代码块： `uDataPicker`
> 关联组件：`uni-data-pickerview`、`uni-load-more`。
`<uni-data-picker>` 是一个选择类[datacom组件](https://uniapp.dcloud.net.cn/component/datacom)。
支持单列、和多列级联选择。列数没有限制，如果屏幕显示不全，顶部tab区域会左右滚动。
候选数据支持一次性加载完毕，也支持懒加载，比如示例图中，选择了“北京”后，动态加载北京的区县数据。
`<uni-data-picker>` 组件尤其适用于地址选择、分类选择等选择类。
`<uni-data-picker>` 支持本地数据、云端静态数据(json)，uniCloud云数据库数据。
`<uni-data-picker>` 可以通过JQL直连uniCloud云数据库，配套[DB Schema](https://uniapp.dcloud.net.cn/uniCloud/schema)，可在schema2code中自动生成前端页面，还支持服务器端校验。
在uniCloud数据表中新建表“uni-id-address”和“opendb-city-china”，这2个表的schema自带foreignKey关联。在“uni-id-address”表的表结构页面使用schema2code生成前端页面，会自动生成地址管理的维护页面，自动从“opendb-city-china”表包含的中国所有省市区信息里选择地址。
### [查看文档](https://uniapp.dcloud.io/component/uniui/uni-data-picker)
#### 如使用过程中有任何问题，或者您对uni-ui有一些好的建议，欢迎加入 uni-ui 交流群：871950839

22
src/uni_modules/uni-icons/changelog.md Normal file
View File

@ -0,0 +1,22 @@
## 1.3.5（2022-01-24）
- 优化 size 属性可以传入不带单位的字符串数值
## 1.3.4（2022-01-24）
- 优化 size 支持其他单位
## 1.3.3（2022-01-17）
- 修复 nvue 有些图标不显示的bug，兼容老版本图标
## 1.3.2（2021-12-01）
- 优化 示例可复制图标名称
## 1.3.1（2021-11-23）
- 优化 兼容旧组件 type 值
## 1.3.0（2021-11-19）
- 新增 更多图标
- 优化 自定义图标使用方式
- 优化 组件UI，并提供设计资源，详见:[https://uniapp.dcloud.io/component/uniui/resource](https://uniapp.dcloud.io/component/uniui/resource)
- 文档迁移，详见:[https://uniapp.dcloud.io/component/uniui/uni-icons](https://uniapp.dcloud.io/component/uniui/uni-icons)
## 1.1.7（2021-11-08）
## 1.2.0（2021-07-30）
- 组件兼容 vue3，如何创建vue3项目，详见 [uni-app 项目支持 vue3 介绍](https://ask.dcloud.net.cn/article/37834)
## 1.1.5（2021-05-12）
- 新增 组件示例地址
## 1.1.4（2021-02-05）
- 调整为uni_modules目录规范

1169
src/uni_modules/uni-icons/components/uni-icons/icons.js Normal file
View File

File diff suppressed because it is too large Load Diff

96
src/uni_modules/uni-icons/components/uni-icons/uni-icons.vue Normal file
View File

@ -0,0 +1,96 @@
<template>
<!-- #ifdef APP-NVUE -->
<text :style="{ color: color, 'font-size': iconSize }" class="uni-icons" @click="_onClick">{{unicode}}</text>
<!-- #endif -->
<!-- #ifndef APP-NVUE -->
<text :style="{ color: color, 'font-size': iconSize }" class="uni-icons" :class="['uniui-'+type,customPrefix,customPrefix?type:'']" @click="_onClick"></text>
<!-- #endif -->
</template>
<script>
import icons from './icons.js';
const getVal = (val) => {
const reg = /^[0-9]*$/g
return (typeof val === 'number' ||　reg.test(val) )? val + 'px' : val;
}
// #ifdef APP-NVUE
var domModule = weex.requireModule('dom');
import iconUrl from './uniicons.ttf'
domModule.addRule('fontFace', {
'fontFamily': "uniicons",
'src': "url('"+iconUrl+"')"
});
// #endif
/**
* Icons 图标
* @description 用于展示 icons 图标
* @tutorial https://ext.dcloud.net.cn/plugin?id=28
* @property {Number} size 图标大小
* @property {String} type 图标图案，参考示例
* @property {String} color 图标颜色
* @property {String} customPrefix 自定义图标
* @event {Function} click 点击 Icon 触发事件
*/
export default {
name: 'UniIcons',
emits:['click'],
props: {
type: {
type: String,
default: ''
},
color: {
type: String,
default: '#333333'
},
size: {
type: [Number, String],
default: 16
},
customPrefix:{
type: String,
default: ''
}
},
data() {
return {
icons: icons.glyphs
}
},
computed:{
unicode(){
let code = this.icons.find(v=>v.font_class === this.type)
if(code){
return unescape(`%u${code.unicode}`)
}
return ''
},
iconSize(){
return getVal(this.size)
}
},
methods: {
_onClick() {
this.$emit('click')
}
}
}
</script>
<style lang="scss">
/* #ifndef APP-NVUE */
@import './uniicons.css';
@font-face {
font-family: uniicons;
src: url('./uniicons.ttf') format('truetype');
}
/* #endif */
.uni-icons {
font-family: uniicons;
text-decoration: none;
text-align: center;
}
</style>

663
src/uni_modules/uni-icons/components/uni-icons/uniicons.css Normal file
View File

@ -0,0 +1,663 @@
.uniui-color:before {
content: "\e6cf";
}
.uniui-wallet:before {
content: "\e6b1";
}
.uniui-settings-filled:before {
content: "\e6ce";
}
.uniui-auth-filled:before {
content: "\e6cc";
}
.uniui-shop-filled:before {
content: "\e6cd";
}
.uniui-staff-filled:before {
content: "\e6cb";
}
.uniui-vip-filled:before {
content: "\e6c6";
}
.uniui-plus-filled:before {
content: "\e6c7";
}
.uniui-folder-add-filled:before {
content: "\e6c8";
}
.uniui-color-filled:before {
content: "\e6c9";
}
.uniui-tune-filled:before {
content: "\e6ca";
}
.uniui-calendar-filled:before {
content: "\e6c0";
}
.uniui-notification-filled:before {
content: "\e6c1";
}
.uniui-wallet-filled:before {
content: "\e6c2";
}
.uniui-medal-filled:before {
content: "\e6c3";
}
.uniui-gift-filled:before {
content: "\e6c4";
}
.uniui-fire-filled:before {
content: "\e6c5";
}
.uniui-refreshempty:before {
content: "\e6bf";
}
.uniui-location-filled:before {
content: "\e6af";
}
.uniui-person-filled:before {
content: "\e69d";
}
.uniui-personadd-filled:before {
content: "\e698";
}
.uniui-back:before {
content: "\e6b9";
}
.uniui-forward:before {
content: "\e6ba";
}
.uniui-arrow-right:before {
content: "\e6bb";
}
.uniui-arrowthinright:before {
content: "\e6bb";
}
.uniui-arrow-left:before {
content: "\e6bc";
}
.uniui-arrowthinleft:before {
content: "\e6bc";
}
.uniui-arrow-up:before {
content: "\e6bd";
}
.uniui-arrowthinup:before {
content: "\e6bd";
}
.uniui-arrow-down:before {
content: "\e6be";
}
.uniui-arrowthindown:before {
content: "\e6be";
}
.uniui-bottom:before {
content: "\e6b8";
}
.uniui-arrowdown:before {
content: "\e6b8";
}
.uniui-right:before {
content: "\e6b5";
}
.uniui-arrowright:before {
content: "\e6b5";
}
.uniui-top:before {
content: "\e6b6";
}
.uniui-arrowup:before {
content: "\e6b6";
}
.uniui-left:before {
content: "\e6b7";
}
.uniui-arrowleft:before {
content: "\e6b7";
}
.uniui-eye:before {
content: "\e651";
}
.uniui-eye-filled:before {
content: "\e66a";
}
.uniui-eye-slash:before {
content: "\e6b3";
}
.uniui-eye-slash-filled:before {
content: "\e6b4";
}
.uniui-info-filled:before {
content: "\e649";
}
.uniui-reload:before {
content: "\e6b2";
}
.uniui-micoff-filled:before {
content: "\e6b0";
}
.uniui-map-pin-ellipse:before {
content: "\e6ac";
}
.uniui-map-pin:before {
content: "\e6ad";
}
.uniui-location:before {
content: "\e6ae";
}
.uniui-starhalf:before {
content: "\e683";
}
.uniui-star:before {
content: "\e688";
}
.uniui-star-filled:before {
content: "\e68f";
}
.uniui-calendar:before {
content: "\e6a0";
}
.uniui-fire:before {
content: "\e6a1";
}
.uniui-medal:before {
content: "\e6a2";
}
.uniui-font:before {
content: "\e6a3";
}
.uniui-gift:before {
content: "\e6a4";
}
.uniui-link:before {
content: "\e6a5";
}
.uniui-notification:before {
content: "\e6a6";
}
.uniui-staff:before {
content: "\e6a7";
}
.uniui-vip:before {
content: "\e6a8";
}
.uniui-folder-add:before {
content: "\e6a9";
}
.uniui-tune:before {
content: "\e6aa";
}
.uniui-auth:before {
content: "\e6ab";
}
.uniui-person:before {
content: "\e699";
}
.uniui-email-filled:before {
content: "\e69a";
}
.uniui-phone-filled:before {
content: "\e69b";
}
.uniui-phone:before {
content: "\e69c";
}
.uniui-email:before {
content: "\e69e";
}
.uniui-personadd:before {
content: "\e69f";
}
.uniui-chatboxes-filled:before {
content: "\e692";
}
.uniui-contact:before {
content: "\e693";
}
.uniui-chatbubble-filled:before {
content: "\e694";
}
.uniui-contact-filled:before {
content: "\e695";
}
.uniui-chatboxes:before {
content: "\e696";
}
.uniui-chatbubble:before {
content: "\e697";
}
.uniui-upload-filled:before {
content: "\e68e";
}
.uniui-upload:before {
content: "\e690";
}
.uniui-weixin:before {
content: "\e691";
}
.uniui-compose:before {
content: "\e67f";
}
.uniui-qq:before {
content: "\e680";
}
.uniui-download-filled:before {
content: "\e681";
}
.uniui-pyq:before {
content: "\e682";
}
.uniui-sound:before {
content: "\e684";
}
.uniui-trash-filled:before {
content: "\e685";
}
.uniui-sound-filled:before {
content: "\e686";
}
.uniui-trash:before {
content: "\e687";
}
.uniui-videocam-filled:before {
content: "\e689";
}
.uniui-spinner-cycle:before {
content: "\e68a";
}
.uniui-weibo:before {
content: "\e68b";
}
.uniui-videocam:before {
content: "\e68c";
}
.uniui-download:before {
content: "\e68d";
}
.uniui-help:before {
content: "\e679";
}
.uniui-navigate-filled:before {
content: "\e67a";
}
.uniui-plusempty:before {
content: "\e67b";
}
.uniui-smallcircle:before {
content: "\e67c";
}
.uniui-minus-filled:before {
content: "\e67d";
}
.uniui-micoff:before {
content: "\e67e";
}
.uniui-closeempty:before {
content: "\e66c";
}
.uniui-clear:before {
content: "\e66d";
}
.uniui-navigate:before {
content: "\e66e";
}
.uniui-minus:before {
content: "\e66f";
}
.uniui-image:before {
content: "\e670";
}
.uniui-mic:before {
content: "\e671";
}
.uniui-paperplane:before {
content: "\e672";
}
.uniui-close:before {
content: "\e673";
}
.uniui-help-filled:before {
content: "\e674";
}
.uniui-paperplane-filled:before {
content: "\e675";
}
.uniui-plus:before {
content: "\e676";
}
.uniui-mic-filled:before {
content: "\e677";
}
.uniui-image-filled:before {
content: "\e678";
}
.uniui-locked-filled:before {
content: "\e668";
}
.uniui-info:before {
content: "\e669";
}
.uniui-locked:before {
content: "\e66b";
}
.uniui-camera-filled:before {
content: "\e658";
}
.uniui-chat-filled:before {
content: "\e659";
}
.uniui-camera:before {
content: "\e65a";
}
.uniui-circle:before {
content: "\e65b";
}
.uniui-checkmarkempty:before {
content: "\e65c";
}
.uniui-chat:before {
content: "\e65d";
}
.uniui-circle-filled:before {
content: "\e65e";
}
.uniui-flag:before {
content: "\e65f";
}
.uniui-flag-filled:before {
content: "\e660";
}
.uniui-gear-filled:before {
content: "\e661";
}
.uniui-home:before {
content: "\e662";
}
.uniui-home-filled:before {
content: "\e663";
}
.uniui-gear:before {
content: "\e664";
}
.uniui-smallcircle-filled:before {
content: "\e665";
}
.uniui-map-filled:before {
content: "\e666";
}
.uniui-map:before {
content: "\e667";
}
.uniui-refresh-filled:before {
content: "\e656";
}
.uniui-refresh:before {
content: "\e657";
}
.uniui-cloud-upload:before {
content: "\e645";
}
.uniui-cloud-download-filled:before {
content: "\e646";
}
.uniui-cloud-download:before {
content: "\e647";
}
.uniui-cloud-upload-filled:before {
content: "\e648";
}
.uniui-redo:before {
content: "\e64a";
}
.uniui-images-filled:before {
content: "\e64b";
}
.uniui-undo-filled:before {
content: "\e64c";
}
.uniui-more:before {
content: "\e64d";
}
.uniui-more-filled:before {
content: "\e64e";
}
.uniui-undo:before {
content: "\e64f";
}
.uniui-images:before {
content: "\e650";
}
.uniui-paperclip:before {
content: "\e652";
}
.uniui-settings:before {
content: "\e653";
}
.uniui-search:before {
content: "\e654";
}
.uniui-redo-filled:before {
content: "\e655";
}
.uniui-list:before {
content: "\e644";
}
.uniui-mail-open-filled:before {
content: "\e63a";
}
.uniui-hand-down-filled:before {
content: "\e63c";
}
.uniui-hand-down:before {
content: "\e63d";
}
.uniui-hand-up-filled:before {
content: "\e63e";
}
.uniui-hand-up:before {
content: "\e63f";
}
.uniui-heart-filled:before {
content: "\e641";
}
.uniui-mail-open:before {
content: "\e643";
}
.uniui-heart:before {
content: "\e639";
}
.uniui-loop:before {
content: "\e633";
}
.uniui-pulldown:before {
content: "\e632";
}
.uniui-scan:before {
content: "\e62a";
}
.uniui-bars:before {
content: "\e627";
}
.uniui-cart-filled:before {
content: "\e629";
}
.uniui-checkbox:before {
content: "\e62b";
}
.uniui-checkbox-filled:before {
content: "\e62c";
}
.uniui-shop:before {
content: "\e62f";
}
.uniui-headphones:before {
content: "\e630";
}
.uniui-cart:before {
content: "\e631";
}

BIN
src/uni_modules/uni-icons/components/uni-icons/uniicons.ttf Normal file
View File

Binary file not shown.

86
src/uni_modules/uni-icons/package.json Normal file
View File

@ -0,0 +1,86 @@
{
"id": "uni-icons",
"displayName": "uni-icons 图标",
"version": "1.3.5",
"description": "图标组件，用于展示移动端常见的图标，可自定义颜色、大小。",
"keywords": [
"uni-ui",
"uniui",
"icon",
"图标"
],
"repository": "https://github.com/dcloudio/uni-ui",
"engines": {
"HBuilderX": "^3.2.14"
},
"directories": {
"example": "../../temps/example_temps"
},
"dcloudext": {
"category": [
"前端组件",
"通用组件"
],
"sale": {
"regular": {
"price": "0.00"
},
"sourcecode": {
"price": "0.00"
}
},
"contact": {
"qq": ""
},
"declaration": {
"ads": "无",
"data": "无",
"permissions": "无"
},
"npmurl": "https://www.npmjs.com/package/@dcloudio/uni-ui"
},
"uni_modules": {
"dependencies": ["uni-scss"],
"encrypt": [],
"platforms": {
"cloud": {
"tcb": "y",
"aliyun": "y"
},
"client": {
"App": {
"app-vue": "y",
"app-nvue": "y"
},
"H5-mobile": {
"Safari": "y",
"Android Browser": "y",
"微信浏览器(Android)": "y",
"QQ浏览器(Android)": "y"
},
"H5-pc": {
"Chrome": "y",
"IE": "y",
"Edge": "y",
"Firefox": "y",
"Safari": "y"
},
"小程序": {
"微信": "y",
"阿里": "y",
"百度": "y",
"字节跳动": "y",
"QQ": "y"
},
"快应用": {
"华为": "u",
"联盟": "u"
},
"Vue": {
"vue2": "y",
"vue3": "y"
}
}
}
}
}

8
src/uni_modules/uni-icons/readme.md Normal file
View File

@ -0,0 +1,8 @@
## Icons 图标
> **组件名：uni-icons**
> 代码块： `uIcons`
用于展示 icons 图标 。
### [查看文档](https://uniapp.dcloud.io/component/uniui/uni-icons)
#### 如使用过程中有任何问题，或者您对uni-ui有一些好的建议，欢迎加入 uni-ui 交流群：871950839

19
src/uni_modules/uni-load-more/changelog.md Normal file
View File

@ -0,0 +1,19 @@
## 1.3.3（2022-01-20）
- 新增 showText属性 ，是否显示文本
## 1.3.2（2022-01-19）
- 修复 nvue 平台下不显示文本的bug
## 1.3.1（2022-01-19）
- 修复 微信小程序平台样式选择器报警告的问题
## 1.3.0（2021-11-19）
- 优化 组件UI，并提供设计资源，详见:[https://uniapp.dcloud.io/component/uniui/resource](https://uniapp.dcloud.io/component/uniui/resource)
- 文档迁移，详见:[https://uniapp.dcloud.io/component/uniui/uni-load-more](https://uniapp.dcloud.io/component/uniui/uni-load-more)
## 1.2.1（2021-08-24）
- 新增 支持国际化
## 1.2.0（2021-07-30）
- 组件兼容 vue3，如何创建vue3项目，详见 [uni-app 项目支持 vue3 介绍](https://ask.dcloud.net.cn/article/37834)
## 1.1.8（2021-05-12）
- 新增 组件示例地址
## 1.1.7（2021-03-30）
- 修复 uni-load-more 在首页使用时，h5 平台报 'uni is not defined' 的 bug
## 1.1.6（2021-02-05）
- 调整为uni_modules目录规范

5
src/uni_modules/uni-load-more/components/uni-load-more/i18n/en.json Normal file
View File

@ -0,0 +1,5 @@
{
"uni-load-more.contentdown": "Pull up to show more",
"uni-load-more.contentrefresh": "loading...",
"uni-load-more.contentnomore": "No more data"
}

8
src/uni_modules/uni-load-more/components/uni-load-more/i18n/index.js Normal file
View File

@ -0,0 +1,8 @@
import en from './en.json'
import zhHans from './zh-Hans.json'
import zhHant from './zh-Hant.json'
export default {
en,
'zh-Hans': zhHans,
'zh-Hant': zhHant
}

5
src/uni_modules/uni-load-more/components/uni-load-more/i18n/zh-Hans.json Normal file
View File

@ -0,0 +1,5 @@
{
"uni-load-more.contentdown": "上拉显示更多",
"uni-load-more.contentrefresh": "正在加载...",
"uni-load-more.contentnomore": "没有更多数据了"
}

5
src/uni_modules/uni-load-more/components/uni-load-more/i18n/zh-Hant.json Normal file
View File

@ -0,0 +1,5 @@
{
"uni-load-more.contentdown": "上拉顯示更多",
"uni-load-more.contentrefresh": "正在加載...",
"uni-load-more.contentnomore": "沒有更多數據了"
}

399
src/uni_modules/uni-load-more/components/uni-load-more/uni-load-more.vue Normal file
View File

File diff suppressed because one or more lines are too long

86
src/uni_modules/uni-load-more/package.json Normal file
View File

@ -0,0 +1,86 @@
{
"id": "uni-load-more",
"displayName": "uni-load-more 加载更多",
"version": "1.3.3",
"description": "LoadMore 组件，常用在列表里面，做滚动加载使用。",
"keywords": [
"uni-ui",
"uniui",
"加载更多",
"load-more"
],
"repository": "https://github.com/dcloudio/uni-ui",
"engines": {
"HBuilderX": ""
},
"directories": {
"example": "../../temps/example_temps"
},
"dcloudext": {
"category": [
"前端组件",
"通用组件"
],
"sale": {
"regular": {
"price": "0.00"
},
"sourcecode": {
"price": "0.00"
}
},
"contact": {
"qq": ""
},
"declaration": {
"ads": "无",
"data": "无",
"permissions": "无"
},
"npmurl": "https://www.npmjs.com/package/@dcloudio/uni-ui"
},
"uni_modules": {
"dependencies": ["uni-scss"],
"encrypt": [],
"platforms": {
"cloud": {
"tcb": "y",
"aliyun": "y"
},
"client": {
"App": {
"app-vue": "y",
"app-nvue": "y"
},
"H5-mobile": {
"Safari": "y",
"Android Browser": "y",
"微信浏览器(Android)": "y",
"QQ浏览器(Android)": "y"
},
"H5-pc": {
"Chrome": "y",
"IE": "y",
"Edge": "y",
"Firefox": "y",
"Safari": "y"
},
"小程序": {
"微信": "y",
"阿里": "y",
"百度": "y",
"字节跳动": "y",
"QQ": "y"
},
"快应用": {
"华为": "u",
"联盟": "u"
},
"Vue": {
"vue2": "y",
"vue3": "y"
}
}
}
}
}

14
src/uni_modules/uni-load-more/readme.md Normal file
View File

@ -0,0 +1,14 @@
### LoadMore 加载更多
> **组件名：uni-load-more**
> 代码块： `uLoadMore`
用于列表中，做滚动加载使用，展示 loading 的各种状态。
### [查看文档](https://uniapp.dcloud.io/component/uniui/uni-load-more)
#### 如使用过程中有任何问题，或者您对uni-ui有一些好的建议，欢迎加入 uni-ui 交流群：871950839

8
src/uni_modules/uni-scss/changelog.md Normal file
View File

@ -0,0 +1,8 @@
## 1.0.3（2022-01-21）
- 优化 组件示例
## 1.0.2（2021-11-22）
- 修复 / 符号在 vue 不同版本兼容问题引起的报错问题
## 1.0.1（2021-11-22）
- 修复 vue3中scss语法兼容问题
## 1.0.0（2021-11-18）
- init

1
src/uni_modules/uni-scss/index.scss Normal file
View File

@ -0,0 +1 @@
@import './styles/index.scss';

82
src/uni_modules/uni-scss/package.json Normal file
View File

@ -0,0 +1,82 @@
{
"id": "uni-scss",
"displayName": "uni-scss 辅助样式",
"version": "1.0.3",
"description": "uni-sass是uni-ui提供的一套全局样式 ，通过一些简单的类名和sass变量，实现简单的页面布局操作，比如颜色、边距、圆角等。",
"keywords": [
"uni-scss",
"uni-ui",
"辅助样式"
],
"repository": "https://github.com/dcloudio/uni-ui",
"engines": {
"HBuilderX": "^3.1.0"
},
"dcloudext": {
"category": [
"JS SDK",
"通用 SDK"
],
"sale": {
"regular": {
"price": "0.00"
},
"sourcecode": {
"price": "0.00"
}
},
"contact": {
"qq": ""
},
"declaration": {
"ads": "无",
"data": "无",
"permissions": "无"
},
"npmurl": "https://www.npmjs.com/package/@dcloudio/uni-ui"
},
"uni_modules": {
"dependencies": [],
"encrypt": [],
"platforms": {
"cloud": {
"tcb": "y",
"aliyun": "y"
},
"client": {
"App": {
"app-vue": "y",
"app-nvue": "u"
},
"H5-mobile": {
"Safari": "y",
"Android Browser": "y",
"微信浏览器(Android)": "y",
"QQ浏览器(Android)": "y"
},
"H5-pc": {
"Chrome": "y",
"IE": "y",
"Edge": "y",
"Firefox": "y",
"Safari": "y"
},
"小程序": {
"微信": "y",
"阿里": "y",
"百度": "y",
"字节跳动": "y",
"QQ": "y"
},
"快应用": {
"华为": "n",
"联盟": "n"
},
"Vue": {
"vue2": "y",
"vue3": "y"
}
}
}
}
}

4
src/uni_modules/uni-scss/readme.md Normal file
View File

@ -0,0 +1,4 @@
`uni-sass` 是 `uni-ui`提供的一套全局样式 ，通过一些简单的类名和`sass`变量，实现简单的页面布局操作，比如颜色、边距、圆角等。
### [查看文档](https://uniapp.dcloud.io/component/uniui/uni-sass)
#### 如使用过程中有任何问题，或者您对uni-ui有一些好的建议，欢迎加入 uni-ui 交流群：871950839

7
src/uni_modules/uni-scss/styles/index.scss Normal file
View File

@ -0,0 +1,7 @@
@import './setting/_variables.scss';
@import './setting/_border.scss';
@import './setting/_color.scss';
@import './setting/_space.scss';
@import './setting/_radius.scss';
@import './setting/_text.scss';
@import './setting/_styles.scss';

3
src/uni_modules/uni-scss/styles/setting/_border.scss Normal file
View File

@ -0,0 +1,3 @@
.uni-border {
border: 1px $uni-border-1 solid;
}

66
src/uni_modules/uni-scss/styles/setting/_color.scss Normal file
View File

@ -0,0 +1,66 @@
// TODO 暂时不需要 class ，需要用户使用变量实现 ，如果使用类名其实并不推荐
// @mixin get-styles($k,$c) {
// @if $k == size or $k == weight{
// font-#{$k}:#{$c}
// }@else{
// #{$k}:#{$c}
// }
// }
$uni-ui-color:(
// 主色
primary: $uni-primary,
primary-disable: $uni-primary-disable,
primary-light: $uni-primary-light,
// 辅助色
success: $uni-success,
success-disable: $uni-success-disable,
success-light: $uni-success-light,
warning: $uni-warning,
warning-disable: $uni-warning-disable,
warning-light: $uni-warning-light,
error: $uni-error,
error-disable: $uni-error-disable,
error-light: $uni-error-light,
info: $uni-info,
info-disable: $uni-info-disable,
info-light: $uni-info-light,
// 中性色
main-color: $uni-main-color,
base-color: $uni-base-color,
secondary-color: $uni-secondary-color,
extra-color: $uni-extra-color,
// 背景色
bg-color: $uni-bg-color,
// 边框颜色
border-1: $uni-border-1,
border-2: $uni-border-2,
border-3: $uni-border-3,
border-4: $uni-border-4,
// 黑色
black:$uni-black,
// 白色
white:$uni-white,
// 透明
transparent:$uni-transparent
) !default;
@each $key, $child in $uni-ui-color {
.uni-#{"" + $key} {
color: $child;
}
.uni-#{"" + $key}-bg {
background-color: $child;
}
}
.uni-shadow-sm {
box-shadow: $uni-shadow-sm;
}
.uni-shadow-base {
box-shadow: $uni-shadow-base;
}
.uni-shadow-lg {
box-shadow: $uni-shadow-lg;
}
.uni-mask {
background-color:$uni-mask;
}

55
src/uni_modules/uni-scss/styles/setting/_radius.scss Normal file
View File

@ -0,0 +1,55 @@
@mixin radius($r,$d:null ,$important: false){
$radius-value:map-get($uni-radius, $r) if($important, !important, null);
// Key exists within the $uni-radius variable
@if (map-has-key($uni-radius, $r) and $d){
@if $d == t {
border-top-left-radius:$radius-value;
border-top-right-radius:$radius-value;
}@else if $d == r {
border-top-right-radius:$radius-value;
border-bottom-right-radius:$radius-value;
}@else if $d == b {
border-bottom-left-radius:$radius-value;
border-bottom-right-radius:$radius-value;
}@else if $d == l {
border-top-left-radius:$radius-value;
border-bottom-left-radius:$radius-value;
}@else if $d == tl {
border-top-left-radius:$radius-value;
}@else if $d == tr {
border-top-right-radius:$radius-value;
}@else if $d == br {
border-bottom-right-radius:$radius-value;
}@else if $d == bl {
border-bottom-left-radius:$radius-value;
}
}@else{
border-radius:$radius-value;
}
}
@each $key, $child in $uni-radius {
@if($key){
.uni-radius-#{"" + $key} {
@include radius($key)
}
}@else{
.uni-radius {
@include radius($key)
}
}
}
@each $direction in t, r, b, l,tl, tr, br, bl {
@each $key, $child in $uni-radius {
@if($key){
.uni-radius-#{"" + $direction}-#{"" + $key} {
@include radius($key,$direction,false)
}
}@else{
.uni-radius-#{$direction} {
@include radius($key,$direction,false)
}
}
}
}

56
src/uni_modules/uni-scss/styles/setting/_space.scss Normal file
View File

@ -0,0 +1,56 @@
@mixin fn($space,$direction,$size,$n) {
@if $n {
#{$space}-#{$direction}: #{$size*$uni-space-root}px
} @else {
#{$space}-#{$direction}: #{-$size*$uni-space-root}px
}
}
@mixin get-styles($direction,$i,$space,$n){
@if $direction == t {
@include fn($space, top,$i,$n);
}
@if $direction == r {
@include fn($space, right,$i,$n);
}
@if $direction == b {
@include fn($space, bottom,$i,$n);
}
@if $direction == l {
@include fn($space, left,$i,$n);
}
@if $direction == x {
@include fn($space, left,$i,$n);
@include fn($space, right,$i,$n);
}
@if $direction == y {
@include fn($space, top,$i,$n);
@include fn($space, bottom,$i,$n);
}
@if $direction == a {
@if $n {
#{$space}:#{$i*$uni-space-root}px;
} @else {
#{$space}:#{-$i*$uni-space-root}px;
}
}
}
@each $orientation in m,p {
$space: margin;
@if $orientation == m {
$space: margin;
} @else {
$space: padding;
}
@for $i from 0 through 16 {
@each $direction in t, r, b, l, x, y, a {
.uni-#{$orientation}#{$direction}-#{$i} {
@include get-styles($direction,$i,$space,true);
}
.uni-#{$orientation}#{$direction}-n#{$i} {
@include get-styles($direction,$i,$space,false);
}
}
}
}

167
src/uni_modules/uni-scss/styles/setting/_styles.scss Normal file
View File

@ -0,0 +1,167 @@
/* #ifndef APP-NVUE */
$-color-white:#fff;
$-color-black:#000;
@mixin base-style($color) {
color: #fff;
background-color: $color;
border-color: mix($-color-black, $color, 8%);
&:not([hover-class]):active {
background: mix($-color-black, $color, 10%);
border-color: mix($-color-black, $color, 20%);
color: $-color-white;
outline: none;
}
}
@mixin is-color($color) {
@include base-style($color);
&[loading] {
@include base-style($color);
&::before {
margin-right:5px;
}
}
&[disabled] {
&,
&[loading],
&:not([hover-class]):active {
color: $-color-white;
border-color: mix(darken($color,10%), $-color-white);
background-color: mix($color, $-color-white);
}
}
}
@mixin base-plain-style($color) {
color:$color;
background-color: mix($-color-white, $color, 90%);
border-color: mix($-color-white, $color, 70%);
&:not([hover-class]):active {
background: mix($-color-white, $color, 80%);
color: $color;
outline: none;
border-color: mix($-color-white, $color, 50%);
}
}
@mixin is-plain($color){
&[plain] {
@include base-plain-style($color);
&[loading] {
@include base-plain-style($color);
&::before {
margin-right:5px;
}
}
&[disabled] {
&,
&:active {
color: mix($-color-white, $color, 40%);
background-color: mix($-color-white, $color, 90%);
border-color: mix($-color-white, $color, 80%);
}
}
}
}
.uni-btn {
margin: 5px;
color: #393939;
border:1px solid #ccc;
font-size: 16px;
font-weight: 200;
background-color: #F9F9F9;
// TODO 暂时处理边框隐藏一边的问题
overflow: visible;
&::after{
border: none;
}
&:not([type]),&[type=default] {
color: #999;
&[loading] {
background: none;
&::before {
margin-right:5px;
}
}
&[disabled]{
color: mix($-color-white, #999, 60%);
&,
&[loading],
&:active {
color: mix($-color-white, #999, 60%);
background-color: mix($-color-white,$-color-black , 98%);
border-color: mix($-color-white, #999, 85%);
}
}
&[plain] {
color: #999;
background: none;
border-color: $uni-border-1;
&:not([hover-class]):active {
background: none;
color: mix($-color-white, $-color-black, 80%);
border-color: mix($-color-white, $-color-black, 90%);
outline: none;
}
&[disabled]{
&,
&[loading],
&:active {
background: none;
color: mix($-color-white, #999, 60%);
border-color: mix($-color-white, #999, 85%);
}
}
}
}
&:not([hover-class]):active {
color: mix($-color-white, $-color-black, 50%);
}
&[size=mini] {
font-size: 16px;
font-weight: 200;
border-radius: 8px;
}
&.uni-btn-small {
font-size: 14px;
}
&.uni-btn-mini {
font-size: 12px;
}
&.uni-btn-radius {
border-radius: 999px;
}
&[type=primary] {
@include is-color($uni-primary);
@include is-plain($uni-primary)
}
&[type=success] {
@include is-color($uni-success);
@include is-plain($uni-success)
}
&[type=error] {
@include is-color($uni-error);
@include is-plain($uni-error)
}
&[type=warning] {
@include is-color($uni-warning);
@include is-plain($uni-warning)
}
&[type=info] {
@include is-color($uni-info);
@include is-plain($uni-info)
}
}
/* #endif */

24
src/uni_modules/uni-scss/styles/setting/_text.scss Normal file
View File

@ -0,0 +1,24 @@
@mixin get-styles($k,$c) {
@if $k == size or $k == weight{
font-#{$k}:#{$c}
}@else{
#{$k}:#{$c}
}
}
@each $key, $child in $uni-headings {
/* #ifndef APP-NVUE */
.uni-#{$key} {
@each $k, $c in $child {
@include get-styles($k,$c)
}
}
/* #endif */
/* #ifdef APP-NVUE */
.container .uni-#{$key} {
@each $k, $c in $child {
@include get-styles($k,$c)
}
}
/* #endif */
}

146
src/uni_modules/uni-scss/styles/setting/_variables.scss Normal file
View File

@ -0,0 +1,146 @@
// @use "sass:math";
@import '../tools/functions.scss';
// 间距基础倍数
$uni-space-root: 2 !default;
// 边框半径默认值
$uni-radius-root:5px !default;
$uni-radius: () !default;
// 边框半径断点
$uni-radius: map-deep-merge(
(
0: 0,
// TODO 当前版本暂时不支持 sm 属性
// 'sm': math.div($uni-radius-root, 2),
null: $uni-radius-root,
'lg': $uni-radius-root * 2,
'xl': $uni-radius-root * 6,
'pill': 9999px,
'circle': 50%
),
$uni-radius
);
// 字体家族
$body-font-family: 'Roboto', sans-serif !default;
// 文本
$heading-font-family: $body-font-family !default;
$uni-headings: () !default;
$letterSpacing: -0.01562em;
$uni-headings: map-deep-merge(
(
'h1': (
size: 32px,
weight: 300,
line-height: 50px,
// letter-spacing:-0.01562em
),
'h2': (
size: 28px,
weight: 300,
line-height: 40px,
// letter-spacing: -0.00833em
),
'h3': (
size: 24px,
weight: 400,
line-height: 32px,
// letter-spacing: normal
),
'h4': (
size: 20px,
weight: 400,
line-height: 30px,
// letter-spacing: 0.00735em
),
'h5': (
size: 16px,
weight: 400,
line-height: 24px,
// letter-spacing: normal
),
'h6': (
size: 14px,
weight: 500,
line-height: 18px,
// letter-spacing: 0.0125em
),
'subtitle': (
size: 12px,
weight: 400,
line-height: 20px,
// letter-spacing: 0.00937em
),
'body': (
font-size: 14px,
font-weight: 400,
line-height: 22px,
// letter-spacing: 0.03125em
),
'caption': (
'size': 12px,
'weight': 400,
'line-height': 20px,
// 'letter-spacing': 0.03333em,
// 'text-transform': false
)
),
$uni-headings
);
// 主色
$uni-primary: #2979ff !default;
$uni-primary-disable:lighten($uni-primary,20%) !default;
$uni-primary-light: lighten($uni-primary,25%) !default;
// 辅助色
// 除了主色外的场景色，需要在不同的场景中使用（例如危险色表示危险的操作）。
$uni-success: #18bc37 !default;
$uni-success-disable:lighten($uni-success,20%) !default;
$uni-success-light: lighten($uni-success,25%) !default;
$uni-warning: #f3a73f !default;
$uni-warning-disable:lighten($uni-warning,20%) !default;
$uni-warning-light: lighten($uni-warning,25%) !default;
$uni-error: #e43d33 !default;
$uni-error-disable:lighten($uni-error,20%) !default;
$uni-error-light: lighten($uni-error,25%) !default;
$uni-info: #8f939c !default;
$uni-info-disable:lighten($uni-info,20%) !default;
$uni-info-light: lighten($uni-info,25%) !default;
// 中性色
// 中性色用于文本、背景和边框颜色。通过运用不同的中性色，来表现层次结构。
$uni-main-color: #3a3a3a !default; // 主要文字
$uni-base-color: #6a6a6a !default; // 常规文字
$uni-secondary-color: #909399 !default; // 次要文字
$uni-extra-color: #c7c7c7 !default; // 辅助说明
// 边框颜色
$uni-border-1: #F0F0F0 !default;
$uni-border-2: #EDEDED !default;
$uni-border-3: #DCDCDC !default;
$uni-border-4: #B9B9B9 !default;
// 常规色
$uni-black: #000000 !default;
$uni-white: #ffffff !default;
$uni-transparent: rgba($color: #000000, $alpha: 0) !default;
// 背景色
$uni-bg-color: #f7f7f7 !default;
/* 水平间距 */
$uni-spacing-sm: 8px !default;
$uni-spacing-base: 15px !default;
$uni-spacing-lg: 30px !default;
// 阴影
$uni-shadow-sm:0 0 5px rgba($color: #d8d8d8, $alpha: 0.5) !default;
$uni-shadow-base:0 1px 8px 1px rgba($color: #a5a5a5, $alpha: 0.2) !default;
$uni-shadow-lg:0px 1px 10px 2px rgba($color: #a5a4a4, $alpha: 0.5) !default;
// 蒙版
$uni-mask: rgba($color: #000000, $alpha: 0.4) !default;

19
src/uni_modules/uni-scss/styles/tools/functions.scss Normal file
View File

@ -0,0 +1,19 @@
// 合并 map
@function map-deep-merge($parent-map, $child-map){
$result: $parent-map;
@each $key, $child in $child-map {
$parent-has-key: map-has-key($result, $key);
$parent-value: map-get($result, $key);
$parent-type: type-of($parent-value);
$child-type: type-of($child);
$parent-is-map: $parent-type == map;
$child-is-map: $child-type == map;
@if (not $parent-has-key) or ($parent-type != $child-type) or (not ($parent-is-map and $child-is-map)){
$result: map-merge($result, ( $key: $child ));
}@else {
$result: map-merge($result, ( $key: map-deep-merge($parent-value, $child) ));
}
}
@return $result;
};

31
src/uni_modules/uni-scss/theme.scss Normal file
View File

@ -0,0 +1,31 @@
// 间距基础倍数
$uni-space-root: 2;
// 边框半径默认值
$uni-radius-root:5px;
// 主色
$uni-primary: #2979ff;
// 辅助色
$uni-success: #4cd964;
// 警告色
$uni-warning: #f0ad4e;
// 错误色
$uni-error: #dd524d;
// 描述色
$uni-info: #909399;
// 中性色
$uni-main-color: #303133;
$uni-base-color: #606266;
$uni-secondary-color: #909399;
$uni-extra-color: #C0C4CC;
// 背景色
$uni-bg-color: #f5f5f5;
// 边框颜色
$uni-border-1: #DCDFE6;
$uni-border-2: #E4E7ED;
$uni-border-3: #EBEEF5;
$uni-border-4: #F2F6FC;
// 常规色
$uni-black: #000000;
$uni-white: #ffffff;
$uni-transparent: rgba($color: #000000, $alpha: 0);

62
src/uni_modules/uni-scss/variables.scss Normal file
View File

@ -0,0 +1,62 @@
@import './styles/setting/_variables.scss';
// 间距基础倍数
$uni-space-root: 2;
// 边框半径默认值
$uni-radius-root:5px;
// 主色
$uni-primary: #2979ff;
$uni-primary-disable:mix(#fff,$uni-primary,50%);
$uni-primary-light: mix(#fff,$uni-primary,80%);
// 辅助色
// 除了主色外的场景色，需要在不同的场景中使用（例如危险色表示危险的操作）。
$uni-success: #18bc37;
$uni-success-disable:mix(#fff,$uni-success,50%);
$uni-success-light: mix(#fff,$uni-success,80%);
$uni-warning: #f3a73f;
$uni-warning-disable:mix(#fff,$uni-warning,50%);
$uni-warning-light: mix(#fff,$uni-warning,80%);
$uni-error: #e43d33;
$uni-error-disable:mix(#fff,$uni-error,50%);
$uni-error-light: mix(#fff,$uni-error,80%);
$uni-info: #8f939c;
$uni-info-disable:mix(#fff,$uni-info,50%);
$uni-info-light: mix(#fff,$uni-info,80%);
// 中性色
// 中性色用于文本、背景和边框颜色。通过运用不同的中性色，来表现层次结构。
$uni-main-color: #3a3a3a; // 主要文字
$uni-base-color: #6a6a6a; // 常规文字
$uni-secondary-color: #909399; // 次要文字
$uni-extra-color: #c7c7c7; // 辅助说明
// 边框颜色
$uni-border-1: #F0F0F0;
$uni-border-2: #EDEDED;
$uni-border-3: #DCDCDC;
$uni-border-4: #B9B9B9;
// 常规色
$uni-black: #000000;
$uni-white: #ffffff;
$uni-transparent: rgba($color: #000000, $alpha: 0);
// 背景色
$uni-bg-color: #f7f7f7;
/* 水平间距 */
$uni-spacing-sm: 8px;
$uni-spacing-base: 15px;
$uni-spacing-lg: 30px;
// 阴影
$uni-shadow-sm:0 0 5px rgba($color: #d8d8d8, $alpha: 0.5);
$uni-shadow-base:0 1px 8px 1px rgba($color: #a5a5a5, $alpha: 0.2);
$uni-shadow-lg:0px 1px 10px 2px rgba($color: #a5a4a4, $alpha: 0.5);
// 蒙版
$uni-mask: rgba($color: #000000, $alpha: 0.4);