一、问卷字段类型有：1单行文本,2多行文本,3单选,4多选,5日期,11金额,8下拉选择,12上传,13时间,14数字。可暂存、发送。
根据单选答案，展现不同分支（web端发送问卷时可以设置编排分支以及顺序，小程序根据接口返回的数据展示）
二、效果图如下
三、重点代码
1.根据单选答案自动获取下一题。
2.递归方式上传附件
四、详细代码
1.wxml文件
<wxs module="v1">
var include = function (array, value) {
if (array) {
if (array == value) {
return true
}
}
}
var include2 = function (array, value) {
if (array) {
var has = false;
for (var i = 0; i < array.length; i++) {
if (array[i] == value) {
has = true;
return has
}
}
return has;
}
}
module.exports.include = include;
module.exports.include2 = include2;
</wxs>
<view class="questionnaire">
<view class="back_image">
<view class="fixed_exclude">
<navBar title="{{ques_title}}" scrollTop="{{scrollTop}}"></navBar>
<view class="all" id="all" style="margin-top: 3rem;">
<view wx:if="{{questionnaireInfo.remark}}" class="ques_title_all">
<view style="min-width:120rpx">备注：</view>
<view style="flex:1;word-break:break-all;">{{questionnaireInfo.remark}}</view>
</view>
<view class="info_content">
<!-- fieldType:1单行文本,2多行文本,3单选,4多选,5日期,11金额,
8下拉选择,12上传,13时间,14数 -->
<view wx:for="{{customerFieldSetList}}" wx:for-item="item" wx:for-index="index" wx:key="index" data-index="{{index}}" class="id_info {{(index == dateId)? 'current':''}}">
<view id="bottomView{{index}}" class="bottomView{{index}}">
<view class="info_title" data-type="{{item.fieldType}}">
<view>{{index+1}}.{{item.fieldName}}<text wx:if="{{item.mustFlag}}" style="color: red;">*</text></view>
<view wx:if="{{item.fieldType=='12' && item.fieldValue.length>0}}">{{ item.fieldValue.length}}份</view>
<view class="copy_button" catchtap="copyInfo" data-index="{{index}}" data-item="{{item}}" wx:if="{{(item.fieldKey=='name4' || item.fieldKey=='phoneNo4' || item.fieldKey=='idNo4')&& item.fieldValue}}">复制</view>
</view>
<!-- show判断placeholder穿透问题 -->
<view style="padding-left: 28rpx;" wx:if="{{!show}}">
<input disabled="{{questionDesc=='3'||questionDesc=='4'}}" wx:if="{{item.fieldType == '1'||item.fieldType == '8'}}" bindinput="bindKeyInput" data-item="{{item}}" data-index="{{index}}" data-fieldkey="{{item.fieldKey}}" data-fieldtype="{{item.fieldType}}" placeholder="请输入{{item.fieldName}}" placeholder-style="font-size: 14px;color: #999999;" value="{{item.fieldValue}}" />
<input disabled="{{questionDesc=='3'||questionDesc=='4'}}" wx:if="{{item.fieldType == '11'}}" type="number" data-index="{{index}}" bindinput="inputDigit" data-item="{{item}}" placeholder="请输入{{item.fieldName}}" placeholder-style="font-size: 14px;color: #999999;" value="{{item.fieldValue}}" />
<input disabled="{{questionDesc=='3'||questionDesc=='4'}}" wx:if="{{item.fieldType == '14'}}" type="number" data-index="{{index}}" bindinput="inputDigit" data-item="{{item}}" placeholder="请输入{{item.fieldName}}" placeholder-style="font-size: 14px;color: #999999;" value="{{item.fieldValue}}" />
</view>
<view style="padding-left: 28rpx;font-size: 14px;color: #999999;">
<view wx:if="{{show&&(item.fieldType == '1'||item.fieldType == '8'||item.fieldType == '11'||item.fieldType == '14')}}">
请输入{{item.fieldName}}</view>
</view>
<view style="padding-left: 28rpx;font-size: 14px;color: #999999;">
<!-- show判断placeholder穿透问题 -->
<textarea disabled="{{questionDesc=='3'||questionDesc=='4'}}" wx:if="{{item.fieldType == '2'&&!show}}" style="padding-top:20rpx" data-index="{{index}}" bindinput="bindKeyInput" data-item="{{item}}" placeholder="请输入{{item.fieldName}}" placeholder-style="font-size: 14px;color: #999999;" value="{{item.fieldValue}}" />
<view style="min-height: 360rpx;" wx:if="{{show&&item.fieldType == '2'}}">
请输入{{item.fieldName}}</view>
</view>
<radio-group wx:if="{{item.fieldType == '3'}}" bindchange="radioChange" data-indexs="{{indexs}}" data-key="{{item.fieldValue}}" data-index="{{index}}" data-questiondesc="{{questionDesc}}" data-optionlist="{{item.optionList}}">
<label class="checkbox_item" wx:for-item="items" wx:for="{{item.optionList}}" wx:key="indexs">
<radio disabled="{{questionDesc=='3'||questionDesc=='4'}}" value="{{items.optionKey}}" checked="{{v1.include(item.fieldValue,items.optionKey)}}" />
<view>{{items.optionValue}}</view>
<view catchtap="son" hover-stop-propagation="true" style="flex: 1;">
<input wx:if="{{items.isNote && (item.fieldValue==items.optionKey) && !show}}" style="margin-left: 10rpx;" disabled="{{(questionDesc=='3'||questionDesc=='4')||(item.fieldValue!=items.optionKey)}}" bindinput="bindNote" data-item="{{item}}" data-optionkey="{{items.optionKey}}" data-index="{{index}}" placeholder="请输入" placeholder-style="font-size: 14px;color: #999999;" value="{{item.note}}" />
</view>
</label>
</radio-group>
<checkbox-group wx:if="{{item.fieldType == '4'}}" bindchange="checkboxChange" data-item="{{item}}" data-key="{{item.fieldValue}}" data-index="{{index}}">
<label class="checkbox_item" wx:for-item="items" wx:for="{{item.optionList}}" wx:key="indexs">
<checkbox disabled="{{questionDesc=='3'||questionDesc=='4'}}" value="{{items.optionKey}}" checked="{{v1.include2(item.fieldValue,items.optionKey)}}" />
<view>{{items.optionValue}}</view>
</label>
</checkbox-group>
<!-- 日期弹框5 -->
<view style="padding-left: 28rpx;" wx:if="{{item.fieldType == '5'}}">
<picker disabled="{{questionDesc=='3'||questionDesc=='4'}}" mode="date" data-index="{{index}}" value="{{item.fieldValue}}" bindchange="changeDateTime1">
<!-- show判断placeholder穿透问题 -->
<input wx:if="{{!item.fieldValue && !show}}" disabled style="font-size: 14px;color: #999999;" placeholder="请选择{{item.fieldName}}" />
<view wx:if="{{!item.fieldValue && show}}" style="font-size: 14px;color: #999999;">
请选择{{item.fieldName}}</view>
<view wx:if="{{item.fieldValue}}">
{{item.fieldValue}}
</view>
</picker>
</view>
<!-- 时间弹框13 -->
<view catchtouchmove='ture' style="padding-left: 28rpx;z-index: 99999" wx:if="{{item.fieldType == '13'}}">
<!-- <picker mode="time" data-index="{{index}}" value="{{item.fieldValue}}" bindchange="changeDateTime2">
<input wx:if="{{!item.fieldValue}}" disabled style="font-size: 14px;color: #999999;" placeholder="请选择{{item.fieldName}}" />
<view wx:if="{{item.fieldValue}}">
{{item.fieldValue}}
</view>
</picker> -->
<!-- show判断placeholder穿透问题 -->
<input catchtap="showPicker" disabled data-index="{{index}}" wx:if="{{!item.fieldValue && !show}}" style="font-size: 14px;color: #999999;" placeholder="请选择{{item.fieldName}}" />
<view wx:if="{{!item.fieldValue && show}}" style="font-size: 14px;color: #999999;">
请选择{{item.fieldName}}</view>
<view catchtap="showPicker" data-index="{{index}}" wx:if="{{item.fieldValue}}">
{{item.fieldValue}}
</view>
</view>
<!-- 上传文件12-->
<view class="upload_imgs" wx:if="{{item.fieldType==12}}">
<view class="fileItem" wx:for="{{ item.fieldValue }}" wx:key="item2" wx:for-item="item2" wx:for-index="index2">
<image wx:if="{{item2.fileType=='png'||item2.fileType=='PNG'||item2.fileType=='jpg'||item2.fileType=='JPG'||item2.fileType=='svg'}}" class="image_absolute" bindtap="preview" data-src="{{item2.url}}" mode='aspectFill' class="view_image" src="{{item2.url}}"></image>
<image wx:else class="image_absolute" bindtap="preview" data-src="{{item2.url}}" mode='aspectFill' class="view_image" src="https://v.lawbal.com:9393/57,5ad577a14194d0.svg"></image>
<view class="file_name" wx:if="{{!(item2.fileType=='png'||item2.fileType=='PNG'||item2.fileType=='jpg'||item2.fileType=='JPG'||item2.fileType=='svg')}}">{{item2.name}}</view>
<view class="image_relative" wx:if="{{questionDesc=='1'||questionDesc=='2'}}" bindtap="deleteImg" data-index="{{index}}" data-index2="{{index2}}">
<image style="width:30rpx;height:30rpx;" src="https://v.lawbal.com:9393/53,5ae4a6d3beda91.svg"></image>
</view>
</view>
<view class="fileItem" catchtap="openActionSheetTap" data-questiondesc="{{questionDesc}}" data-item="{{item}}" data-index="{{index}}">
<image class="view_image" src="https://v.lawbal.com:9393/52,5ade17e3daeae7.svg"></image>
</view>
</view>
</view>
</view>
</view>
</view>
</view>
</view>
<view class="button_all" wx:if="{{ isShowButton && (questionDesc=='1'||questionDesc=='2') && !show }}">
<button class="button_item button_item1" bindtap="toStaging">暂存草稿</button>
<button class="button_item button_item2" bindtap="toLawyer">发送</button>
</view>
<!-- 选择日期时分 -->
<scroll-view wx:if="{{show}}" style="height: 100%;width: 100%;">
<view style="width:100%;position: fixed;bottom: 0;">
<date-time-picker id="timepopup" show="{{ show }}" bind:handleSubmit="changeDateTime2" bind:bindclose="bindclose" />
</view>
</scroll-view>
<!-- 选择上传类型 -->
<popup id="popup" bind:change="change" bind:chooseFile="chooseFile" bind:chooseImg="chooseImg"></popup>
<!-- 选择日期 -->
<view class="half-screen" wx:if="{{showModalStatus}}">
<!--屏幕背景变暗的背景 -->
<view class="background_screen" bindtap="hideModal" wx:if="{{showModalStatus}}"></view>
<!--弹出框 -->
<view animation="{{animationData}}" class="attr_box" wx:if="{{showModalStatus}}">
<!-- 日历 -->
<view class="calendar">
<view class="cale_month flex-row j_b" style="display: flex;justify-content: space-around;">
<view catchtap="toLastMon">
<image src="https://v.lawbal.com:9393/47,561342ffab2940.png" class="cale_img"></image>
</view>
<view>{{year}}.{{months[monthIndex]}}</view>
<view catchtap="toNextMon">
<image style="transform: rotate(180deg);" src="https://v.lawbal.com:9393/47,561342ffab2940.png" class="cale_img"></image>
</view>
</view>
<view class="cale_week flex-row j_b ">
<block wx:for="{{weekArr}}">
<view>{{item}}</view>
</block>
</view>
<view class='box1' style='width: {{ sysW * 7 }}rpx'>
<block wx:for='{{ arr }}' wx:key="arr_item" wx:for-item="arr_item" wx:for-index="index3">
<view catchtap="changeDate" data-index="{{index}}" data-arritem="{{arr_item}}" data-index3="{{index3}}" style='{{ index3 == 0 ? "margin-left:" + sysW * marLet + "rpx;" : "" }}width: {{ sysW }}rpx; height: {{ sysW }}rpx; line-height: {{ sysW }}rpx;' class='isrela flex-column {{ (arr_item.day===nowDay) ? "book isbook" :(arr_item.day===getToday)?"book isbook2": ""}}'>{{ arr_item.day }}
</view>
</block>
</view>
</view>
</view>
</view>
</view>2.js文件，项目已经不需要空判断，代码已经注释但是保留了
const util = require('../../../utils/util')
//时间插件
const app = getApp()
Page({
/**
* 页面的初始数据
*/
data: {
customizeInfoId: '', //问卷id
questionnaireInfo: '', //问卷详情所有
customerFieldSetList: [], //问卷字段,1单行文本,2多行文本,3单选,4多选,5日期,8,下拉选择',11金额,12上传附件,13时间
basicList: null, //基础信息列表
isShowButton: true, //默认显示保存按钮
selectIndex: '', //选择的customerFieldSetList的index
questionDesc: '', //问卷状态
imgList: [], //预览图片
scrollTop: 0,
isBackImg: true,
ques_title: '', //问卷名称
questionNodeList: [],
questionnaireRelationList: [],
customizeFieldHasValueList: [], //顺序问卷已暂存的list
tmplType: '',
isEnd: false,
showModalStatus: false,
userId: '',
userName: '',
mobNo: '',
companyName: '',
getToday: '', //当前日期
chosedMonth: '',
arr: [],
sysW: 92,
marLet: '', //左边边距
weekArr: ['日', '一', '二', '三', '四', '五', '六'],
monthIndex: '',
months: ['1', '2', '3', '4', '5', '6', '7', '8', '9', '10', '11', '12'],
booklist: [], //状态一
radioIndex: '', //单选题在题组中的index
selectDay: '', //选中日期
bottomIndex: '1', //定位的id位置
idHeight: '', //定位到的id的高度
show: false, //时间选择弹框
timeIndex: '', //时间选择
httpServer: wx.getStorageSync('httpServer'),
},
//打开日期时间弹框
showPicker(e) {
if (this.data.questionDesc == '1' || this.data.questionDesc == '2') {
this.setData({
show: !this.data.show,
timeIndex: e.currentTarget.dataset.index
})
debugger
let timePopup = this.selectComponent("#timepopup");
timePopup.changeRange();
}
},
// 获取问卷详情
getDetail() {
var that = this;
wx.showLoading();
app.http("POST", "", {
customizeInfoId: that.data.customizeInfoId,
isLvLian: true
}, (function (e) {
that.setData({
questionnaireInfo: e.data.questionnaireInfo,
tmplType: e.data.questionnaireInfo.tmplType,
questionnaireRelationList: e.data.questionnaireInfo.questionnaireRelationList,
questionNodeList: e.data.questionnaireInfo.questionNodeList,
customizeFieldHasValueList: e.data.questionnaireInfo.customizeFieldHasValueList
})
console.log(that.data.customizeFieldHasValueList)
let list = []
if (that.data.tmplType == 1) { //简单问卷
list = e.data.questionnaireInfo.customerFieldSetList
} else { //复杂问卷
// 有暂存数据
if (that.data.customizeFieldHasValueList && that.data.customizeFieldHasValueList.length) {
list = that.data.customizeFieldHasValueList
} else {
list = e.data.questionnaireInfo.questionNodeList
}
}
list.forEach((element) => {
// 多选，上传fieldValue处理
if (element.fieldType == '4' || element.fieldType == '12') {
if (element.fieldType == '4') {
element.fieldValue = element.fieldValue ? element.fieldValue.split(',') : []
}
if (element.fieldType == '12') {
element.fieldValue = element.fieldValue ? JSON.parse(element.fieldValue) : []
element.fieldValue.forEach((item) => {
let newUrl = item.url
var index = newUrl.lastIndexOf(".");
item.fileType = newUrl.substring(index + 1, newUrl.length);
})
}
}
})
if (that.data.tmplType == 1) {
that.setData({
customerFieldSetList: list,
})
} else { //复杂问卷
// 有暂存数据
if (that.data.customizeFieldHasValueList && that.data.customizeFieldHasValueList.length) {
that.setData({
customerFieldSetList: that.data.customizeFieldHasValueList
})
} else {
//获取第一个问题
that.getFirstQuestion()
}
}
wx.hideLoading()
}), (function (o) {
wx.hideLoading()
}))
},
// 单选
radioChange(e) {
let that = this
let val = e.detail.value //选中的optionKey数组
let index = e.currentTarget.dataset.index
const _k1 = `customerFieldSetList[${index}].fieldValue` // 拼接动态属性
that.setData({
[_k1]: val,
radioIndex: index
})
// 未选中置空
let optionList = e.currentTarget.dataset.optionlist
for (let i of optionList) {
if (i.isNote && (i.optionKey != val)) {
const _k2 = `customerFieldSetList[${index}].note`
that.setData({
[_k2]: '',
})
}
}
let item = that.data.customerFieldSetList[index]
if (that.data.tmplType == 2) {
that.nextQuestion(item)
}
},
// 多选
checkboxChange(e) {
let that = this
let {
key
} = e.currentTarget.dataset;
that.setData({
[key]: e.detail.value
})
let index = e.currentTarget.dataset.index
const _k1 = `customerFieldSetList[${index}].fieldValue` // 拼接动态属性
that.setData({
[_k1]: e.detail.value,
})
let item = that.data.customerFieldSetList[index]
if (that.data.tmplType == 2) {
that.nextQuestion(item)
}
},
// // 失去焦点
// _bindblur(e) {
// let fieldType = e.currentTarget.dataset.fieldtype
// let val = e.detail.value
// // 单行文本输入框，判断手机号或者身份证号格式phoneNo1|idNo1|phoneNo2|idNo2|phoneNo3|idNo3|phoneNo4|idNo4
// if (fieldType == 1 && e.currentTarget.dataset.fieldkey) {
// let fieldKey = e.currentTarget.dataset.fieldkey
// if (fieldKey == "phoneNo1" || fieldKey == "phoneNo2" || fieldKey == "phoneNo3" || fieldKey == "phoneNo4") {
// var re = /^1[3,4,5,6,7,8,9][0-9]{9}$/;
// var result = re.test(val);
// if (!result) {
// wx.showToast({
// icon: "none",
// title: '手机号填写不正确',
// duration: 1000
// })
// let index = e.currentTarget.dataset.index
// const _k1 = `customerFieldSetList[${index}].fieldValue` // 拼接动态属性
// this.setData({
// [_k1]: '',
// })
// this.setData({
// customerFieldSetList: this.data.customerFieldSetList
// })
// return false; //若手机号码格式不正确则返回false
// }
// }
// if (fieldKey == "idNo1" || fieldKey == "idNo2" || fieldKey == "idNo3" || fieldKey == "idNo4") {
// var reg = /(^\d{15}$)|(^\d{18}$)|(^\d{17}(\d|X|x)$)/;
// if (reg.test(val) === false) {
// wx.showToast({
// icon: "none",
// title: '请检查身份证号是否正确',
// duration: 1000
// })
// let index = e.currentTarget.dataset.index
// const _k1 = `customerFieldSetList[${index}].fieldValue` // 拼接动态属性
// this.setData({
// [_k1]: '',
// })
// this.setData({
// customerFieldSetList: this.data.customerFieldSetList
// })
// return false;
// }
// }
// }
// },
bindKeyInput(e) {
let index = e.currentTarget.dataset.index
let item = e.currentTarget.dataset.item
const _k1 = `customerFieldSetList[${index}].fieldValue` // 拼接动态属性
this.setData({
[_k1]: e.detail.value,
})
item.fieldValue = e.detail.value
if (this.data.tmplType == 2) {
this.nextQuestion(item)
}
},
bindNote(e) {
let that = this
debugger
let item = e.currentTarget.dataset.item
let index = that.data.radioIndex ? that.data.radioIndex : e.currentTarget.dataset.index
const _k1 = `customerFieldSetList[${index}].note` // 拼接动态属性
that.setData({
[_k1]: e.detail.value,
})
item.note = e.detail.value
if (that.data.tmplType == 2) {
that.nextQuestion(item)
}
},
// 只能输入数字
inputDigit: function (e) {
let pwd = e.detail.value
let index = e.currentTarget.dataset.index
let item = e.currentTarget.dataset.item
let val = pwd.replace(/[^\d.]/g, '')
const _k1 = `customerFieldSetList[${index}].fieldValue` // 拼接动态属性
this.setData({
[_k1]: val,
})
item.fieldValue = val
if (this.data.tmplType == 2) {
this.nextQuestion(item)
}
},
// 上传图片
chooseImg() {
let that = this
let index = that.data.selectIndex
wx.chooseImage({
success: function (o) {
var e = o.tempFilePaths;
wx.showLoading({
title: '上传中...'
})
var successUp = 0; //成功
var failUp = 0; //失败
var length = e.length; //总数
var count = 0; //第几张
var filePath = that.data.customerFieldSetList[index].fieldValue; //存储每次上传文件的路径
let list = []
for (let i = 0; i < e.length; i++) {
let index = Number(filePath.length + i) + 1
list.push({
path: e[i],
name: '图片' + index
})
}
that.uploadOneByOne(list, successUp, failUp, count, length, filePath, index);
if (that.data.tmplType == 2) {
let item = that.data.customerFieldSetList[index]
that.nextQuestion(item)
}
wx.hideLoading({})
}
})
},
// 上传文件
chooseFile(e) {
let that = this
let index = that.data.selectIndex
wx.chooseMessageFile({
count: 3,
type: 'file',
success: async (res) => {
wx.showLoading({
title: '上传中...'
})
var successUp = 0; //成功
var failUp = 0; //失败
var length = res.tempFiles.length; //总数
var count = 0; //第几张
var filePath = that.data.customerFieldSetList[index].fieldValue; //存储每次上传文件的路径
that.uploadOneByOne(res.tempFiles, successUp, failUp, count, length, filePath, index);
if (that.data.tmplType == 2) {
let item = that.data.customerFieldSetList[index]
that.nextQuestion(item)
}
wx.hideLoading({})
}
})
},
/**
* 采用递归的方式上传
*/
uploadOneByOne(imgPaths, successUp, failUp, count, length, filePath, index) {
var that = this;
wx.showLoading({
title: '正在上传第' + count + '个',
})
debugger
//这里的分隔符一定要是同一个
let str = that.generateDivisionStr()
wx.uploadFile({
url: that.data.httpServer + '/file/upload',
filePath: imgPaths[count].path,
name: "file",
header: {
'content-type': `multipart/form-data; boundary=${str}`
},
success: function (e) {
debugger
var o = JSON.parse(e.data);
filePath.push({
url: encodeURI(o.fileUrl),
name: imgPaths[count].name,
})
successUp++; //成功+1
wx.hideLoading()
},
fail: function (e) {
failUp++; //失败+1
wx.hideLoading()
},
complete: function (e) {
count++; //下一张
if (count == length) {
//上传完毕，作一下提示
const _k1 = `customerFieldSetList[${index}].fieldValue` // 拼接动态属性
filePath.forEach((item) => {
let newUrl = item.url
var index = newUrl.lastIndexOf(".");
item.fileType = newUrl.substring(index + 1, newUrl.length);
})
that.setData({
[_k1]: filePath,
})
if (e.code == 200) {
wx.showToast({
title: '上传成功',
icon: 'success',
duration: 2000
})
}
console.log('上传', that.data.customerFieldSetList)
} else {
//递归调用，上传下一张
that.uploadOneByOne(imgPaths, successUp, failUp, count, length, filePath, index);
}
wx.hideLoading()
}
})
},
//生成分割字符串
generateDivisionStr() {
return 'xxxxxxxx-xxxx-4xxx-yxxx-xxxxxxxxxxxx'.replace(/[xy]/g, c => {
let r = Math.random() * 16 | 0,
v = c == 'x' ? r : (r & 0x3 | 0x8)
return v.toString(16);
})
},
// 删除图片
deleteImg(e) {
let index = e.currentTarget.dataset.index
let index2 = e.currentTarget.dataset.index2
var nowList = []; //新数据
var uploaderList = this.data.customerFieldSetList[index].fieldValue; //原数据
for (let i = 0; i < uploaderList.length; i++) {
if (i == index2) {
continue;
} else {
nowList.push(uploaderList[i])
}
}
const _k1 = `customerFieldSetList[${index}].fieldValue` // 拼接动态属性
this.setData({
[_k1]: nowList,
})
},
changeDate(e) {
let that = this
let index3 = e.currentTarget.dataset.index3
let arrItem = e.currentTarget.dataset.arritem
if (that.data.arr[index3].day == arrItem.day) {
that.data.arr[index3].isbook = 1 //状态一
}
let month = that.data.months[that.data.monthIndex]
month = Number(month) < 10 ? ('0' + month) : month
arrItem.day = Number(arrItem.day) < 10 ? ('0' + arrItem.day) : arrItem.day
let val = that.data.year + "-" + month + "-" + arrItem.day
const _k1 = `customerFieldSetList[${that.data.selectIndex}].fieldValue` // 拼接动态属性
that.setData({
[_k1]: val,
arr: that.data.arr,
showModalStatus: false,
selectDay: val
})
let item = that.data.customerFieldSetList[that.data.selectIndex]
if (that.data.tmplType == 2) {
that.nextQuestion(item)
}
},
//当触发选择日期
changeDateTime1(e) {
let that = this
let index = e.currentTarget.dataset.index
const _k1 = `customerFieldSetList[${index}].fieldValue` // 拼接动态属性
that.setData({
[_k1]: e.detail.value,
})
let item = that.data.customerFieldSetList[index]
if (that.data.tmplType == 2) {
that.nextQuestion(item)
}
},
//当触发选择时间
changeDateTime2(e) {
let that = this
debugger
console.log(util.formatTime(timestamp, '{yy}-{mm}-{dd} {hh}:{ii}'))
const timestamp = e.detail.value; // 待转换的时间戳
const date = new Date(timestamp); // 根据时间戳创建Date对象
const year = date.getFullYear(); // 获取年份
const month = that.addZero(date.getMonth() + 1); // 获取月份，需要加1
const day = that.addZero(date.getDate()); // 获取日期
const hour = that.addZero(date.getHours()); // 获取小时
const minute = that.addZero(date.getMinutes()); // 获取分钟
const formattedDate = `${year}-${month}-${day} ${hour}:${minute}`; // 拼接成格式化后的日期字符串
let index = that.data.timeIndex
const _k1 = `customerFieldSetList[${index}].fieldValue` // 拼接动态属性
that.setData({
[_k1]: formattedDate,
})
that.bindclose()
let item = that.data.customerFieldSetList[index]
if (that.data.tmplType == 2) {
that.nextQuestion(item)
}
},
// 数字补零
addZero(num) {
if (num < 10) {
return '0' + num;
} else {
return num;
}
},
bindclose() {
this.setData({
show: false,
})
},
// 暂存草稿
toStaging() {
var that = this;
that.setData({
customerFieldSetList: that.data.customerFieldSetList
})
let customerFieldSetList = JSON.parse(JSON.stringify(that.data.customerFieldSetList))
customerFieldSetList.forEach((element) => {
element.customizeFieldSetId = element.customerFieldSetId
// 空判断
if ((!element.fieldValue || element.fieldValue.length == 0) && !element.mustFlag) {
element.fieldValue = null
}
if (element.fieldType == '4' && element.fieldValue) {
// 多选fieldValue处理
element.fieldValue = element.fieldValue.join(',');
}
if (element.fieldType == '12' && element.fieldValue) {
// 上传fieldValue处理
element.fieldValue = JSON.stringify(element.fieldValue)
}
})
wx.showLoading();
app.http("POST", "", {
companyId: that.data.questionnaireInfo.companyId,
isLvLian: true,
questionnaireTmplId: that.data.questionnaireInfo.questionnaireTmplId,
customizeSetId: that.data.questionnaireInfo.customizeSetId,
bizType: '4',
caseBase: that.data.questionnaireInfo.caseBase,
customizeFieldEntities: customerFieldSetList,
questionStatus: "2", //问卷状态 1已发送 2暂存 //3已回传
questionnaireInfoId: that.data.questionnaireInfo.questionnaireInfoId ? that.data.questionnaireInfo.questionnaireInfoId : '', //更新主键id
customizeInfoId: that.data.customizeInfoId ? that.data.questionnaireInfo.customizeInfoId : '', //更新主键id
}, (function (e) {
wx.hideLoading()
wx.showToast({
title: '暂存成功',
duration: 800
})
}), (function (o) {
wx.showToast({
title: '暂存失败',
icon: "none"
})
wx.hideLoading()
}))
},
// 发送给律师
toLawyer() {
var that = this;
that.setData({
customerFieldSetList: that.data.customerFieldSetList
})
// if (!that.data.isEnd && that.data.tmplType == 2) {
// wx.showToast({
// icon: "none",
// title: '问卷内容未填完',
// duration: 1000
// })
// return
// }
let customerFieldSetList = JSON.parse(JSON.stringify(that.data.customerFieldSetList))
customerFieldSetList.forEach((element) => {
element.customizeFieldSetId = element.customerFieldSetId
// 空判断
// if (!element.fieldValue && element.mustFlag) {
// wx.showToast({
// icon: "none",
// title: element.fieldName + '不能为空',
// duration: 1000
// })
// throw new Error('end'); //跳出循环
// }
// 空判断
// if (element.fieldValue.length == 0 && element.mustFlag) {
// wx.showToast({
// icon: "none",
// title: element.fieldName + '不能为空',
// duration: 1000
// })
// throw new Error('end'); //跳出循环
// } else
// if (element.fieldValue.length == 0 && !element.mustFlag) {
// element.fieldValue = null
// }
if (element.fieldType == '4' && element.fieldValue) {
// 多选，上传fieldValue处理
element.fieldValue = element.fieldValue.join(',');
}
if (element.fieldType == '12' && element.fieldValue) {
// 多选，上传fieldValue处理
element.fieldValue = JSON.stringify(element.fieldValue)
}
})
wx.showLoading();
app.http("POST", "", {
companyId: that.data.questionnaireInfo.companyId,
isLvLian: true,
questionnaireTmplId: that.data.questionnaireInfo.questionnaireTmplId,
customizeSetId: that.data.questionnaireInfo.customizeSetId,
bizType: '4',
caseBase: that.data.questionnaireInfo.caseBase,
customizeFieldEntities: customerFieldSetList,
questionStatus: "3", //问卷状态 1已发送 2暂存 //3已回传
questionnaireInfoId: that.data.questionnaireInfo.questionnaireInfoId ? that.data.questionnaireInfo.questionnaireInfoId : '', //更新主键id
customizeInfoId: that.data.customizeInfoId ? that.data.questionnaireInfo.customizeInfoId : '', //更新主键id
}, (function (e) {
wx.hideLoading()
wx.showToast({
title: '发送成功',
duration: 800
})
}), (function (o) {
wx.showToast({
title: '发送失败',
icon: "none"
})
wx.hideLoading()
}))
},
// 打开上传弹框
openActionSheetTap: function (e) {
let questionDesc = e.currentTarget.dataset.questiondesc
if (questionDesc == '1' || questionDesc == '2') {
let index = e.currentTarget.dataset.index
this.setData({
selectIndex: index
})
this.selectComponent("#popup").changeRange();
}
},
//预览图片，放大预览
preview(event) {
let that = this
let imgList = []
for (const i of that.data.customerFieldSetList) {
if (i.fieldType == 12) {
for (const j of i.fieldValue) {
imgList.push(j.url)
}
}
}
that.setData({
imgList: imgList
})
let currentUrl = event.currentTarget.dataset.src
wx.previewImage({
current: currentUrl, // 当前显示图片的http链接
urls: that.data.imgList // 需要预览的图片http链接列表
})
},
onReady: function () {
},
onPageScroll(t) {
this.setData({
scrollTop: t.scrollTop
})
},
/**
* 生命周期函数--监听页面加载
*/
onLoad(options) {
if (options) {
if (options.Id) {
this.setData({
customizeInfoId: options.Id
})
}
if (options.title) {
wx.setNavigationBarTitle({
title: options.title
})
this.setData({
ques_title: options.title
})
}
if (options.questionDesc) {
this.setData({
questionDesc: options.questionDesc
})
}
}
this.getDetail()
},
//获取第一个问题
getFirstQuestion() {
let that = this
that.data.questionnaireRelationList.forEach((item) => {
let flag = that.data.questionnaireRelationList.find((item2) => {
return item2.endId == item.startId
})
if (!flag) {
that.data.questionNodeList.forEach((value) => {
if (value.customerFieldSetId == item.startId) {
that.data.customerFieldSetList.push(value)
that.setData({
customerFieldSetList: that.data.customerFieldSetList
})
if (value.fieldType != 3) {
that.autoNextQuestion(value)
}
}
})
}
})
},
//获取下一题
nextQuestion(item) {
if (item.fieldType == 4 || item.fieldType == 12) {
if (item.fieldValue.length == 0) {
return
}
} else {
if (!item.fieldValue) {
return
}
}
if (item.fieldType == 3) {
let flag = true
this.data.questionnaireRelationList.forEach((i) => {
if (
i.startId == item.customerFieldSetId &&
i.startCondition &&
i.startCondition.indexOf(item.fieldValue) != -1
) {
this.data.questionNodeList.forEach((j) => {
if (j.customerFieldSetId == i.endId) {
flag = false
let index = this.data.customerFieldSetList.findIndex((val) => {
return val.customerFieldSetId == item.customerFieldSetId
})
this.data.customerFieldSetList.splice(index + 1) // 删除指定索引后的所有元素
this.data.customerFieldSetList.push(j)
this.setData({
customerFieldSetList: this.data.customerFieldSetList,
bottomIndex: this.data.customerFieldSetList.length - 1
})
setTimeout(() => {
this.onChanges(index)
}, 500)
if (j.fieldType != 3) {
this.autoNextQuestion(j)
}
}
})
}
})
if (flag) {
let index = this.data.customerFieldSetList.findIndex((val) => {
return val.customerFieldSetId == item.customerFieldSetId
})
this.data.customerFieldSetList.splice(index + 1)
this.setData({
customerFieldSetList: this.data.customerFieldSetList
})
}
} else {
this.autoNextQuestion(item)
}
},
//自动寻找下一个问题
autoNextQuestion(item) {
if (item.fieldType == 3) {
return
} else {
for (let i of this.data.questionnaireRelationList) {
if (i.startId == item.customerFieldSetId) {
for (let j of this.data.questionNodeList) {
if (j.customerFieldSetId == i.endId) {
//是否存在问题的下一级，存在不新增
let isExist = this.data.customerFieldSetList.find((val) => {
return val.customerFieldSetId == j.customerFieldSetId
})
if (!isExist) {
this.data.customerFieldSetList.push(j)
this.setData({
customerFieldSetList: this.data.customerFieldSetList
})
console.log("autoList", this.data.customerFieldSetList)
this.autoNextQuestion(j)
}
}
}
}
}
}
},
//复制信息
copyInfo(e) {
// let index = e.currentTarget.dataset.index
let Item = e.currentTarget.dataset.item
let key = ''
if (Item.fieldKey == 'name4') {
key = 'name1'
} else if (Item.fieldKey == 'phoneNo4') {
key = 'phoneNo1'
} else if (Item.fieldKey == 'idNo4') {
key = 'idNo1'
}
let flag = false;
this.data.customerFieldSetList.forEach((item, index) => {
if (item.fieldKey == key) {
debugger
flag = true
const _k1 = `customerFieldSetList[${index}].fieldValue` // 拼接动态属性
this.setData({
[_k1]: Item.fieldValue,
})
this.setData({
customerFieldSetList: this.data.customerFieldSetList,
})
wx.showToast({
icon: "none",
title: '已复制信息',
duration: 1000
})
}
})
if (!flag) {
wx.showToast({
icon: "none",
title: '暂未找到对应信息',
duration: 1000
})
}
},
/**
* 生命周期函数--监听页面初次渲染完成
*/
onReady() {
},
son() {
},
//上个月
toLastMon() {
let date = this.data.chosedMonth;
date.setMonth(date.getMonth() - 1);
let getToday = '';
if ((new Date()).getMonth() == (date.getMonth())) {
getToday = (new Date()).getDate()
}
this.getTime(date)
this.setData({
chosedMonth: date,
getToday: getToday
})
},
//下个月
toNextMon() {
let date = this.data.chosedMonth;
date.setMonth(date.getMonth() + 1);
let getToday = '';
if ((new Date()).getMonth() == (date.getMonth())) {
getToday = (new Date()).getDate()
}
this.getTime(date)
this.setData({
chosedMonth: date,
getToday: getToday
})
},
//获取日历相关参数
dataTime: function (date) {
var year = date.getFullYear();
var month = date.getMonth(); //0（一月） 到 11（十二月）
var months = date.getMonth() + 1; //这个是当前的月份
this.data.year = year //当前的年份
this.data.monthIndex = month; //当前月份的索引
this.data.getToday = date.getDate(); //获取当前的日期 8号
this.data.nowDay = date.getDate(); //获取当前的日期 8号
var d = new Date(year, months, 0); //Wed Jun 30 2021 00:00:00 GMT+0800 (中国标准时间) 2021年6月30日 周三
this.data.lastDay = d.getDate(); //这是当前月份的所有天数 30
let firstDay = new Date(year, month, 1); //Tue Jun 01 2021 00:00:00 GMT+0800 (中国标准时间)
this.data.firstDay = firstDay.getDay(); // 第一天开始前的位置
},
/**
* 生命周期函数--监听页面显示
*/
onShow() {
},
getTime(date) {
this.dataTime(date);
//先清空数组，根据得到今月的最后一天日期遍历 得到所有日期
if (this.data.arr) {
this.data.arr = [];
}
for (var i = 0; i < this.data.lastDay; i++) {
var obj = {};
obj.day = i + 1;
obj.isbook = 0 //无状态
this.data.arr.push(obj);
this.data.booklist.forEach(item => {
if (this.data.arr[i].day == item) {
this.data.arr[i].isbook = 1 //状态一
}
})
}
this.setData({
marLet: this.data.firstDay,
arr: this.data.arr,
monthIndex: this.data.monthIndex,
getToday: this.data.getToday,
nowDay: this.data.nowDay,
year: this.data.year
});
},
showModal: function (e) {
let that = this
// 日历获取数据
if (e.currentTarget.dataset.item.fieldValue != '' && e.currentTarget.dataset.item.fieldValue != null) {
let date = new Date(e.currentTarget.dataset.item.fieldValue)
that.getTime(date); //有选中时间
that.setData({
chosedMonth: date
})
} else {
let date = new Date();
that.getTime(date); //获取当前时间
that.setData({
chosedMonth: date,
nowDay: new Date().toDateString
})
}
if (that.data.questionDesc == '1' || that.data.questionDesc == '2') {
let index = e.currentTarget.dataset.index
that.setData({
selectIndex: index
})
// 背景遮罩层
var animation = wx.createAnimation({
duration: 200,
timingFunction: "linear",
delay: 0
})
animation.translateY(300).step()
that.setData({
animationData: animation.export(),
showModalStatus: true
})
setTimeout(function () {
animation.translateY(0).step()
that.setData({
animationData: animation.export()
})
}.bind(this), 200)
}
},
//点击背景面任意一处时，弹出框隐藏
hideModal: function () {
//弹出框消失动画
var animation = wx.createAnimation({
duration: 200,
timingFunction: "linear",
delay: 0
})
//this.animation = animation
animation.translateY(300).step()
this.setData({
animationData: animation.export(),
})
setTimeout(function () {
animation.translateY(0).step()
this.setData({
animationData: animation.export(),
showModalStatus: false
})
}.bind(this), 200)
},
// 根据id获取高度
onChanges(index) {
console.log(index)
let scrollName = '.bottomView' + index //绑定的ID就是为‘scroll’+index,所以就这样获取
let query = wx.createSelectorQuery().in(this)
query.select(`${scrollName}`).boundingClientRect().selectViewport().scrollOffset().exec((con) => {
wx.pageScrollTo({
selector: "`${scrollName}`", // 滑动的元素
scrollTop: con[0].top //到达距离顶部的top值
});
})
},
/**
* 生命周期函数--监听页面隐藏
*/
onHide() {
},
/**
* 生命周期函数--监听页面卸载
*/
onUnload() {
},
/**
* 页面相关事件处理函数--监听用户下拉动作
*/
onPullDownRefresh() {
},
/**
* 页面上拉触底事件的处理函数
*/
onReachBottom() {
},
/**
* 用户点击右上角分享
*/
onShareAppMessage() {
}
})3.wxss文件
.questionnaire {
min-height: 100%;
width: 100%;
background-color: #F3F6F6;
}
.back_image {
background-image: url(https://....svg);
width: 100%;
height: 300rpx;
}
.fixed_exclude {
padding-bottom: 180rpx;
width: 94%;
margin-left: 3%;
padding-top: 150rpx;
}
.info_content {
background-color: #FFFFFF;
border-radius: 10px;
}
.ques_title_all {
background-color: #FFFFFF;
padding: 1rem;
display: flex;
width: 100%;
color: #999999;
margin-bottom: 1rem;
}
.id_info {
color: #465253;
border-bottom: 1px solid #F3F3F6;
display: grid;
width: calc(100% - 2rem);
margin: 0 1rem;
padding: 1rem 0;
}
.id_info text {
color: #666666;
line-height: 25px;
}
.id_info input {
width: 100%;
flex: 1;
}
.button_all {
position: fixed;
z-index: 999;
bottom: 0;
padding: 30rpx 0;
background-color: #FFFFFF;
display: flex;
justify-content: space-evenly;
width: 100%;
-webkit-box-shadow: 0 0 5px #e7e7e7;
box-shadow: 0 0 5px #e7e7e7;
}
.button_item {
height: 90rpx;
line-height: 90rpx;
border-radius: 30px;
border: 1px solid #17908E;
text-align: center;
padding: 0 1rem;
width: 40%;
}
.button_item1 {
color: #17908E;
}
.button_item2 {
background-color: #17908E;
color: #FFFFFF;
}
.displayFlex {
display: flex;
justify-content: space-between;
}
.displayGrid {
display: grid;
}
.checkbox_item {
display: flex;
padding-left: 28rpx;
/* height: 40px; */
/* line-height: 40px; */
min-height: 80rpx;
padding-bottom: 10rpx;
}
.upload_imgs {
display: flex;
flex-wrap: wrap;
width: 100%;
}
.upload_image {
width: 50rpx;
height: 50rpx;
}
.fileItem {
width: 25%;
align-items: center;
height: 185rpx;
position: relative;
}
.view_image {
width: 150rpx;
height: 150rpx;
}
.image_absolute {
position: absolute;
}
.file_name {
width: 80%;
position: absolute;
bottom: 35rpx;
left: 10%;
overflow: hidden;
white-space: nowrap;
text-overflow: ellipsis;
-o-text-overflow: ellipsis;
}
.image_relative {
position: relative;
right: -62rpx;
top: -186rpx;
width: 20rpx;
margin: 0 auto;
}
.info_title {
margin-bottom: 20rpx;
display: flex;
justify-content: space-between;
}
.half-screen {
width: 100%;
height: 100%;
}
/*使屏幕变暗 */
.background_screen {
width: 100%;
height: 100%;
color: rgb(255 95 0);
width: 100%;
color: rgb(255 211 0);
height: 100%;
color: rgb(98 189 255);
position: fixed;
color: rgb(255 111 119);
top: 0;
color: rgb(73 238 255);
left: 0;
color: rgb(98 189 255);
background: #000;
color: rgb(253 97 106);
opacity: 0.2;
overflow: hidden;
color: rgb(253 97 106);
z-index: 1000;
color: #fff;
}
/*对话框 */
.attr_box {
color: #465253;
width: 100%;
overflow: hidden;
position: fixed;
bottom: 0;
left: 0;
z-index: 2000;
/* background: rgba(0, 0, 0, 0.7); */
bottom: 0px;
height: 760rpx;
}
.set_bottom {
border-top: 1rpx solid #cccccc;
border-bottom: 1rpx solid #cccccc;
}
.colorTeam {
color: #17908E;
}
.menu-items {
width: calc(100% - 1rem);
background-color: #FCFCFC;
margin-left: 0.5rem;
border-radius: 10px;
}
.menu-item {
height: 50px;
line-height: 50px;
text-align: center;
font-size: 30rpx;
}
.top {
margin-bottom: 30rpx;
}
/* */
.calendar {
margin: 20rpx 24rpx 26rpx 24rpx;
width: 700rpx;
background: #FFFFFF;
border-radius: 20rpx;
box-sizing: border-box;
padding: 25rpx 24rpx 54rpx;
}
.cale_month {
text-align: center;
font-size: 28rpx;
font-weight: 600;
color: #10272A;
}
.cale_img {
width: 14rpx;
height: 23rpx;
}
.cale_week {
margin: 32rpx auto;
height: 65rpx;
background: rgba(23, 144, 142, 0.1);
border-radius: 36rpx;
font-size: 26rpx;
font-weight: 500;
color: #17908E;
box-sizing: border-box;
padding: 0 38rpx;
line-height: 65rpx;
display: flex;
justify-content: space-between;
}
.box1 {
display: flex;
flex-wrap: wrap;
margin: 15rpx auto 0;
font-size: 26rpx;
font-weight: 400;
color: #10272A;
}
.isbook {
background: #17908E;
}
.isbook2 {
background: rgba(23, 144, 142, 0.6);
}
.isrela {
text-align: center;
display: flex;
flex-direction: column;
align-items: center;
justify-content: center;
position: relative;
}
.book {
width: 40rpx;
height: 40rpx;
border-radius: 50%;
text-align: center;
line-height: 40rpx;
color: #FFFFFF;
}
.waitbook {
background: rgba(103, 32, 116, 0.25);
}
.stopbook {
background: #D3D3D3;
}
.dot {
position: absolute;
width: 15rpx;
height: 15rpx;
border-radius: 50%;
background: #17908E;
top: 72rpx;
}
.copy_button {
background-color: rgba(23, 144, 142, 0.7);
height: 50rpx;
line-height: 50rpx;
color: #ffffff;
padding: 0 10rpx;
border-radius: 18rpx;
font-size: 28rpx;
}
1779
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
