boyue2025/dbd-meeting-wx-small
3
0
Fork 0
mirror of https://gitee.com/elegant_wings/dbd-meeting-wx-small.git synced 2025-06-22 00:49:37 +08:00
Code Issues Packages Projects Releases Wiki Activity

1

Browse Source
This commit is contained in:
SelfRidicule 2024-08-06 17:32:38 +08:00
parent 06c439d195
commit b14dd4ac89
4 changed files with 239 additions and 99 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

126
miniprogram/pages/reportRepair/report/report.js
View File

@ -23,6 +23,10 @@ Page({
id: null,
title: null,
userDetail: {},
recorderManager: null, // 录音对象
voiceObj: {}, // 录音文件对象
innerAudioContext: null, // 音频对象
innerAudioContextIsPlay: false, // 音频对象-是否播放
idcardTypeShow: false,
idcardTypeList: [{
name: '居民身份证',
@ -49,6 +53,7 @@ Page({
visitContent: null, // 来访事由
photo: null, // 头像-相对路径
url: null, // 人脸设备图片-全路径
voiceUrl: null, // 语音
},
},
@ -61,10 +66,6 @@ Page({
let userDetail = wx.getStorageSync('user')
//
let detail = _this.data.detail;
// 添加 默认设置访客信息
detail.intervieweeId = userDetail.id // 访客id
detail.name = userDetail.username // 访客姓名
detail.phone = userDetail.mobile // 访客手机号
_this.setData({
...options,
userDetail,
@ -74,27 +75,9 @@ Page({
wx.setNavigationBarTitle({
title: options.title
})
},
// 跳转-索引栏（单位、人员）
jumpIndexBar(e) {
console.log('jumpIndexBar', e);
let _this = this;
let title = e.currentTarget.dataset.title
// 校验是否选择“被访单位” 后 ，再选择被访人信息
if (title == '人员' && !_this.data.detail.customerId) {
// 错误消息提示
_this.showErrMsg('请先选择被访单位!')
return;
}
// url 参数
let param = '?title=' + title;
if (title == '人员') {
param = param + '&id=' + _this.data.detail.customerId;
}
wx.navigateTo({
url: '/pages/meeting/visitorIinvitation/indexBar/indexBar' + param,
})
// 初始化录音
_this.initRecording()
},
// 显示-身份证类型
@ -183,26 +166,103 @@ Page({
})
},
initRecording() {
let _this = this
let recorderManager = wx.getRecorderManager()
recorderManager.onStart(() => {
console.log('recorder start')
})
recorderManager.onStop((res) => {
console.log('recorder stop', res)
_this.setData({
voiceObj: res,
innerAudioContext: null, // 音频对象
innerAudioContextIsPlay: false, // 音频对象-是否播放
})
})
_this.setData({
recorderManager
})
},
// 开始录音
startRecording() {
this.data.recorderManager.start({
duration: 60000,
sampleRate: 16000, //采样率，有效值 8000/16000/44100
numberOfChannels: 1, //录音通道数，有效值 1/2
encodeBitRate: 96000, //编码码率
format: 'mp3', //音频格式，有效值 aac/mp3
frameSize: 50, //指定帧大小
// audioSource: 'auto' //指定录音的音频输入源，可通过 wx.getAvailableAudioSources() 获取
})
},
// 停止录音
stopRecording() {
this.data.recorderManager.stop()
},
// 播放语音
startAudio() {
console.log('startAudio');
let _this = this
// 获取innerAudioContext实例
let innerAudioContext = _this.data.innerAudioContext
let innerAudioContextIsPlay = _this.data.innerAudioContextIsPlay
if (!innerAudioContext) {
// 全局设置播放声音
wx.setInnerAudioOption({ obeyMuteSwitch: false });
innerAudioContext = wx.createInnerAudioContext()
// 设置音频文件的路径
innerAudioContext.src = _this.data.voiceObj.tempFilePath
innerAudioContextIsPlay = false
innerAudioContext.onEnded(() => {
_this.setData({
innerAudioContextIsPlay: false
})
})
}
if (innerAudioContextIsPlay) { // 播放中
innerAudioContext.stop()
innerAudioContextIsPlay = false
} else { // 未播放
innerAudioContext.play()
innerAudioContextIsPlay = true
}
//
_this.setData({
innerAudioContext,
innerAudioContextIsPlay
})
},
// 停止语音
stopAudio() {
_this.data.innerAudioContext.stop()
},
// 图片-上传前校验
beforeRead(event) {
const {
file,
callback
} = event.detail;
callback(file.type === 'image');
// const {
// file,
// callback
// } = event.detail;
// callback(file.type === 'image');
},
// 图片-上传后
afterRead(event) {
// 文件-上传后
fileAfterRead(event) {
let _this = this;
console.log('fileAfterRead' ,event);
const {
file
} = event.detail;
// 当设置 mutiple 为 true 时, file 为数组格式，否则为对象格式
for (let i = 0; i < file.length; i++) {
let url = file[i].url;
wx.uploadFile({
url: app.DOMAIN_NAME + '/api/dfs/upload',
filePath: file.url,
filePath: url,
name: 'file',
formData: {},
success(res) {
@ -221,8 +281,10 @@ Page({
})
},
});
}
},
// 删除图片
deleteImg(event) {
console.log('deleteImg', event);

3
miniprogram/pages/reportRepair/report/report.json
View File

@ -7,6 +7,7 @@
"van-datetime-picker": "@vant/weapp/datetime-picker/index",
"van-notify": "@vant/weapp/notify/index",
"van-action-sheet": "@vant/weapp/action-sheet/index",
"van-dialog": "@vant/weapp/dialog/index"
"van-dialog": "@vant/weapp/dialog/index",
"van-icon": "@vant/weapp/icon/index"
}
}

86
miniprogram/pages/reportRepair/report/report.wxml
View File

@ -1,56 +1,62 @@
<view class="containerView public">
<view class="contentView">
<view class="rowView" bind:tap="jumpIndexBar" data-title="单位">
<view class="label must">被访单位</view>
<van-field value="{{ detail.customerName }}" input-class="input" is-link readonly placeholder="请选择" input-align="right" border="{{ false }}" />
<view class="rowView">
<view class="label must">报修名称</view>
<van-field value="{{ detail.reportName }}" bind:input="fieldInput" data-name="reportName" input-class="input" placeholder="请输入" border="{{ false }}" input-align="right" />
</view>
<view class="rowView">
<view class="label must">被访人姓名</view>
<van-field value="{{ detail.userName }}" bind:input="fieldInput" data-name="userName" input-class="input" placeholder="请选择" border="{{ false }}" input-align="right" />
<view class="label must">故障等级</view>
<van-field value="{{ detail.cardType }}" input-class="input" is-link readonly placeholder="请选择" arrow-direction="down" border="{{ false }}" input-align="right" bind:tap="showIdcardType" />
</view>
<view class="rowView" bind:tap="showVisitTime">
<view class="label must">故障时间</view>
<van-field value="{{ detail.visitTime }}" input-class="input" is-link readonly placeholder="请选择" border="{{ false }}" arrow-direction="down" input-align="right" />
</view>
<view class="rowView">
<view class="label must">被访人电话</view>
<van-field value="{{ detail.userMobile }}" bind:input="fieldInput" data-name="userMobile" input-class="input" placeholder="请输入" border="{{ false }}" input-align="right" />
</view>
<view class="rowView">
<view class="label must">访客姓名</view>
<van-field value="{{ detail.name }}" bind:input="fieldInput" data-name="name" input-class="input" placeholder="请输入" border="{{ false }}" input-align="right" />
</view>
<view class="rowView">
<view class="label must">手机号码</view>
<van-field value="{{ detail.phone }}" bind:input="fieldInput" data-name="phone" input-class="input" placeholder="请输入" border="{{ false }}" input-align="right" />
</view>
<view class="rowView">
<view class="label must">身份证类型</view>
<view class="label must">故障类型</view>
<van-field value="{{ detail.cardType }}" input-class="input" is-link readonly placeholder="请选择" arrow-direction="down" border="{{ false }}" input-align="right" bind:tap="showIdcardType" />
</view>
<view class="rowView">
<view class="label must">身份证号</view>
<van-field value="{{ detail.cardNo }}" bind:input="fieldInput" data-name="cardNo" input-class="input" placeholder="请输入" border="{{ false }}" input-align="right" />
</view>
<view class="rowView" bind:tap="showVisitTime">
<view class="label must">到访时间</view>
<van-field value="{{ detail.visitTime }}" input-class="input" is-link readonly placeholder="请选择" border="{{ false }}" arrow-direction="down" input-align="right" />
</view>
<view class="rowView" bind:tap="showLeaveTime">
<view class="label must">离开时间</view>
<van-field value="{{ detail.leaveTime }}" input-class="input" is-link readonly placeholder="请选择" border="{{ false }}" arrow-direction="down" input-align="right" />
</view>
<view class="rowView">
<view class="label must">来访事由</view>
<van-field value="{{ detail.visitContent }}" bind:input="fieldInput" data-name="visitContent" input-class="input" placeholder="请输入" border="{{ false }}" input-align="right" />
<view class="label must">联系电话</view>
<van-field value="{{ detail.userMobile }}" bind:input="fieldInput" data-name="userMobile" input-class="input" placeholder="请输入" border="{{ false }}" input-align="right" />
</view>
<view class="rowView">
<view class="label must">访客照片</view>
<van-field style="visibility: hidden;" />
<view class="label must">报修人姓名</view>
<van-field value="{{ detail.name }}" bind:input="fieldInput" data-name="name" input-class="input" placeholder="请输入" border="{{ false }}" input-align="right" />
</view>
<view class="rowView">
<view class="label must">故障地点</view>
<van-field value="{{ detail.cardType }}" input-class="input" is-link readonly placeholder="请选择" arrow-direction="down" border="{{ false }}" input-align="right" bind:tap="showIdcardType" />
</view>
<view class="rowView">
<view class="label must">门牌号</view>
<van-field value="{{ detail.reportName }}" bind:input="fieldInput" data-name="reportName" input-class="input" placeholder="请输入" border="{{ false }}" input-align="right" />
</view>
<view class="rowColumnView">
<view class="label must">故障描述</view>
<view class="contentView">
<van-field model:value="{{ value }}" type="textarea" placeholder="请输入用户名" maxlength="{{100}}" show-word-limit border="{{false}}" autosize input-class="selfTextarea" />
<view class="voiceView1" bind:touchstart="startRecording" bind:touchend="stopRecording">
<view class="voiceView2">
<view class="voiceImg" style="background: no-repeat center/cover url({{IMG_NAME + '/profile/static/repair/index/voice.png'}});"></view>
</view>
</view>
</view>
</view>
<view class="rowView self">
<view class="label must">语音</view>
<view class="voiceBtnView" wx:if="{{voiceObj.tempFilePath}}" bind:tap="startAudio">
<van-icon name="volume-o" color="black" size="40rpx" />
<view class="voiceTimeView">{{voiceObj.duration}}ms</view>
<van-icon name="close" size="34rpx"/>
</view>
</view>
<view class="rowColumnView">
<view class="label must">故障图片</view>
<view class="imgContentView">
<van-uploader file-list="{{ fileList }}" upload-text="点击上传图片" bind:after-read="fileAfterRead" deletable="{{ true }}" bind:delete="deleteImg" max-count="6" accept="media" multiple/>
</view>
</view>
<!-- 上传图片 -->
<view class="uploadImgView">
<van-uploader file-list="{{ fileList }}" upload-text="点击上传照片" use-before-read bind:before-read="beforeRead" bind:after-read="afterRead" deletable="{{ true }}" bind:delete="deleteImg" max-count="1" />
<view class="tipsView">提示:请保持五官清晰，以方便系统精准识</view>
</view>
<!-- 提交 -->

81
miniprogram/pages/reportRepair/report/report.wxss
View File

@ -11,7 +11,68 @@
.contentView .rowView.self {
padding: 28rpx 28rpx 28rpx 30rpx;
align-items: flex-start;
justify-content: flex-start;
align-items: center;
}
.contentView .rowView.self .voiceBtnView {
display: flex;
justify-content: center;
align-items: center;
margin-left: 20rpx;
}
.contentView .rowView.self .voiceBtnView .voiceTimeView {
margin-left: 10rpx;
margin-right: 24rpx;
}
.contentView .rowColumnView {
padding: 28rpx 28rpx 28rpx 30rpx;
border-bottom: 1px solid rgb(126, 126, 126, 0.2);
}
.contentView .rowColumnView .imgContentView {
padding-top: 20rpx;
}
.contentView .rowColumnView .contentView {
display: flex;
justify-content: flex-start;
align-items: center;
}
.contentView .rowColumnView .contentView .voiceView1 {
border-radius: 127rpx;
width: 127rpx;
height: 127rpx;
background: #E5F3FF;
display: flex;
justify-content: center;
align-items: center;
margin-left: 20rpx;
}
.contentView .rowColumnView .contentView .voiceView2 {
border-radius: 103rpx;
width: 103rpx;
height: 103rpx;
background: #008DEF;
display: flex;
justify-content: center;
align-items: center;
}
.contentView .rowColumnView .contentView .voiceView2:active {
background: red;
}
.contentView .rowColumnView .contentView .voiceImg {
width: 41rpx;
height: 67rpx;
}
.contentView .rowView {
@ -22,19 +83,22 @@
border-bottom: 1px solid rgb(126, 126, 126, 0.2);
}
.contentView .rowView:last-of-type {
.contentView .rowView.borderNone {
border-bottom: none;
}
.contentView .rowView .label {
.contentView .rowView .label,
.contentView .rowColumnView .label {
display: inline-block;
position: relative;
font-size: 30rpx;
color: #000000;
min-width: 120rpx;
/* max-width: 160rpx; */
margin-right: 30rpx;
}
.contentView .rowView .label.must::after {
.contentView .rowView .label.must::after,
.contentView .rowColumnView .label.must::after {
content: '*';
display: block;
position: absolute;
@ -117,3 +181,10 @@
.dialogBtnView .successBtn {
color: #4e96f8;
}
.selfTextarea {
min-height: 140rpx !important;
max-height: 140rpx !important;
width: 450rpx !important;
}