J_yt пре 2 година
родитељ
комит
ff62a83d9b
5 измењених фајлова са 548 додато и 328 уклоњено
  1. +2
    -0
      config.js
  2. +22
    -1
      pages.json
  3. +524
    -327
      pages/mine/registerForm.vue
  4. BIN
      static/images/screenCode/screen_bg.png
  5. BIN
      static/images/screenCode/screen_note.png

+ 2
- 0
config.js Прегледај датотеку

@@ -67,6 +67,8 @@ var config = {
delATD:`${host}/addtodigest/delATD`,
// 获取客户来源列表
sourceList: `${host}/customer/sourceList`,
// 隐私协议
privacyAgr: `${host}/zkPrivate/findById`
}
};
module.exports = config;

+ 22
- 1
pages.json Прегледај датотеку

@@ -3,7 +3,28 @@
"^u-(.*)": "@/uview-ui/components/u-$1/u-$1.vue"
},
//这个pages里只放这五个页面,新增页面时请对应的放到下面的分包里
"pages": [{
"pages": [
// {
// "path" : "pages/mine/registerForm",
// "style" :
// {
// "navigationBarTitleText": "访客登记表",
// "navigationBarBackgroundColor": "#2671E2",
// "navigationBarTextStyle": "white"
// }
// }
// ,{
// "path" : "pages/mine/registerResult",
// "style" :
// {
// "navigationBarTitleText": "访客登记表",
// "navigationBarBackgroundColor": "#2671E2",
// "navigationBarTextStyle": "white"
// }
// },
{
"path": "pages/index/guide",
"style": {
"navigationBarBackgroundColor": "#008EF2",


+ 524
- 327
pages/mine/registerForm.vue Прегледај датотеку

@@ -1,329 +1,526 @@
<template>
<view class="cented-box">
<view class="chented" style="margin-bottom: 26rpx;">
<view class="title" style="border: none;">
<view class="titletext">姓名</view>
<view class="titletext2">
<input maxlength="10" class="titletext-input" style="color: #333333;" v-model="parames.name"
placeholder-class="titletext-input" placeholder-style="color:#B2B2B2;" type="text"
placeholder="请输入客户姓名(必填)" />
</view>
<view class="titleimg">
<!-- <image class="titleimg1" src="../../../static/images/arrow.png" mode=""></image> -->
</view>
</view>
</view>
<view class="chented">
<view class="title">
<view class="titletext">性别</view>
<view class="titletext2 displayclick" style="display: flex;align-items: center;padding-left: 10rpx;">
<view class="sexRadio" @click="changeSex(1)" :class="{active:parames.sex == 1}">男士</view>
<view class="sexRadio" @click="changeSex(2)" :class="{active:parames.sex == 2}">女士</view>
</view>
</view>

<view class="title">
<view class="titletext">到访人数</view>
<view class="titletext2" style="display: flex;align-items: center;justify-content: space-around;">
<view class="num" v-for="i in 6" :key="i" :class="{active:parames.howMany == i+1}"
@click="changeHowMany(i+1)">
{{i + 1}}
</view>
</view>
</view>
<view class="title" @click="Buildingselection()">
<view class="titletext">到访途径</view>
<view class="titletext2"
style="font-size: 30rpx;font-weight: 400;color: #B2B2B2;line-height: 110rpx;padding-left: 10rpx;">
<!-- {{parames.sourceName||'请选择客户来源'}} -->
<text v-if="parames.sourceName" style="color: #333333;">{{parames.sourceName}}</text>
<text v-else>请选择客户来源</text>
</view>
<view class="titleimg">
<image class="titleimg1" src="../../static/images/arrow.png" mode=""></image>
</view>
</view>
<!-- <view class="title" style="border: none;" @click="Buildingselection()">
<view class="titletext">咨询业务</view>
<view class="titletext2"
style="font-size: 30rpx;font-weight: 400;color: #B2B2B2;line-height: 110rpx;padding-left: 10rpx;">
<text v-if="parames.sourceName" style="color: #333333;">{{parames.sourceName}}</text>
<text v-else>请选择咨询业务</text>
</view>
<view class="titleimg">
<image class="titleimg1" src="../../static/images/arrow.png" mode=""></image>
</view>
</view> -->
</view>
<button class="clive" open-type="getPhoneNumber" @getphonenumber="getPhoneNumber" v-if="verifyPass">提交</button>
<view class="clive" @click="save" v-else>提交</view>
<view v-if="Showhiddenunits">
<u-select :mask-close-able="false" v-model="Showhiddenunits" mode="single-column" :list="list"
@cancel="cancel" @confirm="confirm"></u-select>
</view>
</view>
</template>

<script>
var app = getApp();
<template>
<view class="cented-box">
<!-- 背景图 -->
<image class="bg-img" src="@/static/images/screenCode/screen_bg.png" mode=""></image>
<!-- 头部 -->
<view class="header">
<view class="lside">
<text class="text top">访客入场</text>
<text class="text">登记表</text>
</view>
<view class="rside">
<image src="@/static/images/screenCode/screen_note.png" mode=""></image>
</view>
</view>
<!-- 表单 -->
<view class="container">
<view class="chented">
<view class="title">
<view class="titletext">客户姓名</view>
<view class="titletext2">
<input maxlength="10" class="titletext-input" style="color: #333333;" v-model="parames.name"
placeholder-class="titletext-input" placeholder-style="color:#B2B2B2;" type="text"
placeholder="请输入客户姓名(必填)" />
</view>
<view class="titleimg"></view>
</view>
</view>
<view class="chented">
<view class="title">
<view class="titletext">客户性别</view>
<!-- <view class="titletext2 displayclick"
style="display: flex;align-items: center;padding-left: 10rpx;">
<view class="sexRadio" @click="changeSex(1)" :class="{active:parames.sex == 1}">男士</view>
<view class="sexRadio" @click="changeSex(2)" :class="{active:parames.sex == 2}">女士</view>
</view> -->
<u-radio-group v-model="parames.sex">
<view style="display: flex;align-items: center;">
<u-radio :name="1" shape="circle">男士</u-radio>
<u-radio :name="2" shape="circle">女士</u-radio>
</view>
</u-radio-group>
</view>
<view class="title">
<view class="titletext">到访人数</view>
<view class="titletext2" style="display: flex;align-items: center;justify-content: space-around;">
<view class="num" v-for="i in 4" :key="i" :class="{active:parames.howMany == i+1}"
@click="changeHowMany(i+1)">
{{i + 1}}
</view>
</view>
</view>
<!-- <view class="title" @click="Buildingselection()">
<view class="titletext">到访途径</view>
<view class="titletext2"
style="font-size: 30rpx;font-weight: 400;color: #B2B2B2;line-height: 110rpx;padding-left: 10rpx;">
<text v-if="parames.sourceName" style="color: #333333;">{{parames.sourceName}}</text>
<text v-else>请选择客户来源</text>
</view>
<view class="titleimg">
<image class="titleimg1" src="../../static/images/arrow.png" mode=""></image>
</view>
</view> -->
</view>
<button class="clive" open-type="getPhoneNumber" @getphonenumber="getPhoneNumber"
v-if="verifyPass">提交</button>
<view class="clive" @click="save" v-else>提交</view>
<view class="dengji">
<view class="d-lside">
入场登记
</view>
<view class="d-rside">
<view class="top">
<text class="t-time">{{$u.timeFormat(new Date(), 'hh:MM:ss')}}</text>
<text class="date">{{$u.timeFormat(new Date(), 'yyyy/mm/dd')}}</text>
</view>
<view class="address" style="font-size: 36rpx;">望京SOHO</view>
</view>
</view>
<view class="bottoms">
<u-checkbox v-model="parames.checked">我已阅读并同意</u-checkbox>
<text class="books" @click="openModel">《{{tit}}》</text>
</view>
</view>
<u-modal v-model="modelShow" @confirm="readOk" :title="tit" width="720rpx">
<view class="slot-content" style="padding: 20rpx;">
<rich-text :nodes="content"></rich-text>
</view>
</u-modal>
<view class="tips">
疫情防控 人人有责
</view>
<u-select :mask-close-able="false" v-model="Showhiddenunits" mode="single-column" :list="list" @cancel="cancel"
@confirm="confirm"></u-select>
</view>
</template>
<script>
var app = getApp();
var config = require("@/config");
let domain = require("@/utils/domain")
export default {
data() {
return {
Showhiddenunits: false,
list: [{
label: '自然到访',
value: '自然到访'
},
{
label: '渠道推荐',
value: '渠道推荐'
},
],
parames: {
name: '',
sex: 1,
sourceName: null,
howMany: 1,
projectId: '',
phone:'',
projectId:'',
projectName:'xxx'
},
daitiReceptionobj: {},
verifyPass:false,
qrCodeUrl:''
};
},
onLoad(options){
const sceneStr = decodeURIComponent(options.scene);
console.log(options)
this.parames.projectId = sceneStr
},
watch:{
parames:{
deep:true,
handler(newV){
if (newV.name.length == 0) {
this.verifyPass = false;
}else{
this.verifyPass = true;
}
}
}
},
methods: {
save() {
if (this.parames.name.length == 0) {
uni.showToast({
icon: "none",
title: "姓名不能为空"
})
return;
}
},
getPhoneNumber(e){
this.qrCodeUrl = domain.baseUrl
if(e.detail.errMsg=="getPhoneNumber:ok"){
let data = {
code:e.detail.code,
appid:uni.getAccountInfoSync().miniProgram.appId,
}
uni.request({
url:this.qrCodeUrl + '/code/loginSessionKey',
method:"GET",
data,
success:(res)=> {
console.log(res.data.data)
let phoneNum = JSON.parse(res.data.data).phone_info.phoneNumber
this.parames.phone = phoneNum
if(this.parames.phone!=null && this.parames.phone!=""){
if(this.parames.name.length>8){
uni.showToast({
icon: "none",
title: "不能超过8个汉字"
})
}else{
uni.request({
url:this.qrCodeUrl + '/customer/codeAdd',
method:"POST",
data:this.parames,
header: {
'content-type': 'application/json',
'Access-Token': uni.getStorageSync('weapp_session_login_data').token
},
success: (addres) => {
if(addres.data.code == 10000){
uni.reLaunch({
url:'/pages/mine/registerResult'
})
}else{
uni.showToast({
icon: "none",
title: addres.data.message
})
}
}
})
}
}
}
})
}else{
return;
}
},
changeSex(sex) {
this.parames.sex = sex;
},
changeHowMany(num) {
this.parames.howMany = num;
},
Buildingselection() {
this.Showhiddenunits = true;
},
cancel() {
this.Showhiddenunits = false;
},
confirm(e) {
this.parames.sourceName = e[0].value;
this.Showhiddenunits = false;
},
}
};
</script>
<style lang="scss" scoped>
.sexRadio {
color: #BFBFBF;
border: 1rpx solid #BFBFBF;
font-size: 24upx;
width: 120rpx;
height: 60rpx;
text-align: center;
display: flex;
align-items: center;
justify-content: center;

&:last-child {
margin-left: 20rpx;
}

&.active {
background: #2B6FFF;
color: #fff;
border-color: #2B6FFF;
}
}

.num {
width: 50rpx;
height: 50rpx;
background: rgba(43, 110, 253, 0.1);
color: #2B6EFD;
font-size: 30rpx;
display: flex;
align-items: center;
justify-content: center;

&.active {
background: #2B6EFD;
color: #FFFFFF;
}
}

.cented-box {
background: #F8F8F8;
width: 100%;
height: 100vh;
}

.Pinspeak {
width: 100%;
height: 92rpx;
border-bottom: 1rpx solid #E0E0E0;
font-size: 32rpx;
font-weight: bold;
color: #333333;
text-indent: 30rpx;
line-height: 92rpx;
background: #FFFFFF;
margin-top: 20rpx;
padding-left: 10rpx;
}

.chented {
width: 100%;
padding-left: 30rpx;
padding-right: 30rpx;
background-color: #FFFFFF;

.title {
width: 100%;
height: 110rpx;
border-bottom: 1rpx solid #E0E0E0;
display: flex;
align-items: center;

.titletext {
width: 21%;
height: 110rpx;
font-size: 30rpx;
font-weight: 400;
color: #333333;
line-height: 110rpx;
text-indent: 10rpx;
}

.titletext2 {
width: 71%;
height: 110rpx;
}

.titletext-input {
width: 100%;
height: 110rpx;
font-size: 30rpx;
font-weight: 400;
color: #B2B2B2;
line-height: 110rpx;
padding-left: 10rpx;
}

.titleimg {
width: 8%;
text-align: right;

.titleimg1 {
width: 16rpx;
height: 36rpx;
}
}
}
}

.clive {
position: absolute;
bottom: 32rpx;
left: 30rpx;
right: 30rpx;
width: 690rpx;
height: 88rpx;
background: #2671E2;
text-align: center;
line-height: 88rpx;
color: #FFFFFF;
border-radius: 8rpx;
font-size: 32rpx;
}
let domain = require("@/utils/domain")
export default {
data() {
return {
Showhiddenunits: false,
list: [{
label: '自然到访',
value: '自然到访'
},
{
label: '渠道推荐',
value: '渠道推荐'
},
],
parames: {
name: '',
sex: 1,
// sourceName: "自然到访",
howMany: 1,
projectId: '',
phone: '',
projectId: '',
projectName: 'xxx',
version:"",
checked: false,
},
daitiReceptionobj: {},
verifyPass: false,
qrCodeUrl: '',
// 是否同意隐私协议
content:"",
modelShow:false,
tit:"",
};
},
onLoad(options) {
const sceneStr = decodeURIComponent(options.scene);
console.log(options)
this.parames.projectId = sceneStr
this.initFetch()
},
watch: {
parames: {
deep: true,
handler(newV) {
if(newV.checked){
if(newV.name.length != 0){
this.verifyPass = true;
}else{
this.verifyPass = false;
}
}else{
this.verifyPass = false;
}
// if (newV.name.length == 0) {
// this.verifyPass = false;
// } else {
// this.verifyPass = true;
// }
}
}
},
methods: {
initFetch(){
let appid = uni.getAccountInfoSync().miniProgram.appId;
uni.request({
url: config.service.privacyAgr,
method: "GET",
data:{
id:appid
},
header: {
'content-type': 'application/json',
'Access-Token': uni.getStorageSync('weapp_session_login_data').token
},
success: (res) => {
this.content = res.data.data.content
this.tit = res.data.data.title
this.parames.version = res.data.data.version
}
})
},
openModel(){
this.modelShow = true;
},
readOk(){
this.parames.checked = true;
},
save() {
if(this.parames.checked == false){
uni.showToast({
icon: "none",
title: "请阅读并同意用户隐私协议"
})
return;
}else{
if (this.parames.name.length == 0) {
uni.showToast({
icon: "none",
title: "姓名不能为空"
})
return;
}
}
},
getPhoneNumber(e) {
this.qrCodeUrl = domain.baseUrl
if (e.detail.errMsg == "getPhoneNumber:ok") {
let data = {
code: e.detail.code,
appid: uni.getAccountInfoSync().miniProgram.appId,
}
uni.request({
url: this.qrCodeUrl + '/code/loginSessionKey',
method: "GET",
data,
success: (res) => {
console.log(res.data.data)
let phoneNum = JSON.parse(res.data.data).phone_info.phoneNumber
this.parames.phone = phoneNum
if (this.parames.phone != null && this.parames.phone != "") {
if (this.parames.name.length > 8) {
uni.showToast({
icon: "none",
title: "不能超过8个汉字"
})
} else {
uni.request({
url: this.qrCodeUrl + '/customer/codeAdd',
method: "POST",
data: this.parames,
header: {
'content-type': 'application/json',
'Access-Token': uni.getStorageSync(
'weapp_session_login_data').token
},
success: (addres) => {
if (addres.data.code == 10000) {
uni.reLaunch({
url: '/pages/mine/registerResult'
})
} else {
uni.showToast({
icon: "none",
title: addres.data.message
})
}
}
})
}
}
}
})
} else {
return;
}
},
changeSex(sex) {
this.parames.sex = sex;
},
changeHowMany(num) {
this.parames.howMany = num;
},
Buildingselection() {
this.Showhiddenunits = true;
},
cancel() {
this.Showhiddenunits = false;
},
confirm(e) {
this.parames.sourceName = e[0].value;
this.Showhiddenunits = false;
},
}
};
</script>
<style lang="scss" scoped>
.cented-box {
position: relative;
padding: 0 0 50rpx 0;
width: 100vw;
min-height: calc(100vh - var(--window-top));
display: flex;
flex-direction: column;
.bg-img {
width: 100%;
height: 100%;
z-index: -1;
position: absolute;
}
.header {
margin: 0 0 40rpx 0;
width: 100%;
display: flex;
.lside {
flex: 1;
display: flex;
flex-direction: column;
justify-content: center;
align-items: center;
.text {
color: #fff;
font-size: 100rpx;
font-weight: 800;
}
.top {
font-size: 76rpx;
}
}
.rside {
flex: 1;
display: flex;
justify-content: center;
align-items: center;
image {
width: 306rpx;
height: 302rpx;
}
}
}
.container {
position: relative;
margin: 0 auto;
width: 670rpx;
height: 900rpx;
background: #fff;
border-radius: 16rpx;
.chented {
padding: 0 30rpx;
width: 100%;
.title {
width: 100%;
height: 110rpx;
border-bottom: 1rpx solid #E0E0E0;
display: flex;
align-items: center;
.titletext {
width: 21%;
font-size: 30rpx;
font-weight: 400;
color: #333333;
}
.titletext2 {
width: 71%;
}
.titletext-input {
width: 100%;
height: 110rpx;
font-size: 30rpx;
font-weight: 400;
color: #B2B2B2;
line-height: 110rpx;
padding-left: 10rpx;
}
.titleimg {
width: 8%;
text-align: right;
.titleimg1 {
width: 16rpx;
height: 36rpx;
}
}
}
}
.clive {
margin: 100rpx auto 0;
width: 610rpx;
height: 88rpx;
background: #2671E2;
text-align: center;
line-height: 88rpx;
color: #FFFFFF;
border-radius: 8rpx;
font-size: 32rpx;
}
.dengji {
margin: 60rpx 0 0 0;
padding: 0 30rpx;
width: 100%;
display: flex;
.d-lside {
padding: 0 20rpx;
height: 88rpx;
display: flex;
align-items: center;
border-right: 1rpx solid #E0E0E0;
font-size: 36rpx;
font-weight: 500;
}
.d-rside {
padding: 0 20rpx;
height: 88rpx;
display: flex;
flex-direction: column;
.top {
display: flex;
align-items: baseline;
font-size: 24rpx;
color: #333330;
.t-time {
margin-right: 20rpx;
font-size: 36rpx;
font-weight: 500;
color: #333331;
}
}
}
}
.bottoms {
position: absolute;
bottom: 30rpx;
padding: 0 30rpx;
width: 100%;
.books {
margin-left: -24rpx;
color: #2671E2;
font-size: 30rpx;
}
}
}
.tips {
margin: 40rpx 0 0 0;
width: 100%;
text-align: center;
color: #fff;
font-size: 30rpx;
}
}
.sexRadio {
color: #BFBFBF;
border: 1rpx solid #BFBFBF;
font-size: 24upx;
width: 120rpx;
height: 60rpx;
text-align: center;
display: flex;
align-items: center;
justify-content: center;
&:last-child {
margin-left: 20rpx;
}
&.active {
background: #2B6FFF;
color: #fff;
border-color: #2B6FFF;
}
}
.num {
width: 74rpx;
height: 74rpx;
border-radius: 8rpx;
background: rgba(43, 110, 253, 0.1);
color: #2B6EFD;
font-size: 32rpx;
display: flex;
align-items: center;
justify-content: center;
&.active {
background: #2B6EFD;
color: #FFFFFF;
}
}
.Pinspeak {
width: 100%;
height: 92rpx;
border-bottom: 1rpx solid #E0E0E0;
font-size: 32rpx;
font-weight: bold;
color: #333333;
text-indent: 30rpx;
line-height: 92rpx;
background: #FFFFFF;
margin-top: 20rpx;
padding-left: 10rpx;
}
</style>

BIN
static/images/screenCode/screen_bg.png Прегледај датотеку

Before After
Width: 1500  |  Height: 2932  |  Size: 92 KiB

BIN
static/images/screenCode/screen_note.png Прегледај датотеку

Before After
Width: 612  |  Height: 612  |  Size: 247 KiB

Loading…
Откажи
Сачувај