You cannot select more than 25 topics Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.

707 lines
22 KiB
JavaScript

This file contains ambiguous Unicode characters!

This file contains ambiguous Unicode characters that may be confused with others in your current locale. If your use case is intentional and legitimate, you can safely ignore this warning. Use the Escape button to highlight these characters.

// pages/detail/detail.js
import {
getTaskById,
statistics,
getDoneByTeam,
saveTaskDone,
getTaskDoneById
} from '../../api/api'
const app = getApp();
Page({
/**
* 页面的初始数据
*/
data: {
tabs: ['已完成', '未完成'],
tabs2: [{
label: '音频录制',
value: 0
}, {
label: '上传图片',
value: 1
}],
sendList: [],
feedback: 2,
remark: '',
tab: 0,
tab2: 0,
fileList: [],
task: {},
taskDone: {},
imageList: [],
completionRate: [],
calcTotal: 0,
calcFinish: 0,
calcFinishRate: 0,
user: {},
id: '',
taskDoneId: '',
isSubmit: false,
recorderState: 0,
time: '00:00',
timer: null,
duration: 0,
durationTxt: '00:00',
playTime: 0,
isPlay: false,
isRowPlay: false,
percentage: 0,
recorderManager: null,
recorderUrl: '',
innerAudioContext: null,
currentPlayIndex: null
},
/**
* 生命周期函数--监听页面加载
*/
onLoad(options) {
console.log(options)
this.setData({
user: app.globalData.currentUser,
isSubmit: options.isSubmit == '1'
})
console.log(app.globalData.currentUser)
const role = app.globalData.currentUser.jtRoleCode
if (role != 'admin') {
const recorderManager = wx.getRecorderManager()
recorderManager.onStart(() => {
console.log('recorder start')
if (this.data.timer) {
clearInterval(this.data.timer)
}
this.data.timer = null
this.setData({
recorderState: 1,
percentage: 0,
time: '00:00'
})
this.innerAudioStop()
this.setTime()
})
recorderManager.onInterruptionEnd((res) => {
console.log("onInterruptionEnd", res)
})
recorderManager.onInterruptionBegin((res) => {
console.log("onInterruptionBegin", res)
})
recorderManager.onError((res) => {
console.log("onError", res)
})
recorderManager.onPause((res) => {
console.log("onPause", res)
recorderManager.resume()
})
recorderManager.onResume((res) => {
console.log("onResume", res)
})
recorderManager.onStop((res) => {
if (this.data.timer) {
clearInterval(this.data.timer)
}
console.log('recorder stop', res)
const {
tempFilePath,
duration
} = res
this.data.timer = null
this.setData({
time: '00:00',
duration,
playTime: 0,
durationTxt: this.formatSeconds(duration / 1000),
recorderState: 2
})
wx.uploadFile({
url: 'https://task.51jingcheng.com/oss/imgUpload', // 仅为示例,非真实的接口地址
filePath: tempFilePath,
name: 'file',
success: (res) => {
console.log(res.data)
const result = res.data ? JSON.parse(res.data) : {
url: ''
}
this.setData({
recorderUrl: result.url,
});
},
});
})
this.data.recorderManager = recorderManager
const innerAudioContext = wx.createInnerAudioContext({
useWebAudioImplement: true
})
innerAudioContext.onPlay(() => {
if (!this.data.isRowPlay) {
const time = this.data.playTime
this.setTime(true, time)
this.setData({
isPlay: true
})
} else {
this.setRowTime(this.data.playTime)
this.setData({
[`sendList[${this.data.currentPlayIndex}].isPlay`]: true,
})
}
})
innerAudioContext.onSeeked(() => {
console.log("onSeeked")
if(this.data.innerAudioContext.paused) {
if (this.data.timer) {
clearInterval(this.data.timer)
}
this.data.timer = null
this.data.innerAudioContext.play()
} else {
if (this.data.timer == null) {
if (!this.data.isRowPlay) {
this.setTime(true, this.data.playTime)
} else {
this.setRowTime(this.data.playTime)
}
}
}
})
innerAudioContext.onTimeUpdate(() => {
if (!this.data.isRowPlay) {
this.setData({
percentage: Math.min(Math.ceil((this.data.playTime * 100000) / this.data.duration), 100)
})
} else {
this.setData({
[`sendList[${this.data.currentPlayIndex}].percentage`]: Math.min(Math.ceil((this.data.playTime * 100000) / this.data.sendList[this.data.currentPlayIndex].duration), 100)
})
}
})
innerAudioContext.onStop(() => {
console.log("onStop")
if (this.data.timer) {
clearInterval(this.data.timer)
}
this.data.timer = null
if (this.data.currentPlayIndex != null) {
this.setData({
[`sendList[${this.data.currentPlayIndex}].time`]: '00:00',
[`sendList[${this.data.currentPlayIndex}].isPlay`]: false,
[`sendList[${this.data.currentPlayIndex}].percentage`]: 0,
playTime: 0,
})
}
this.setData({
time: '00:00',
isPlay: false,
playTime: 0
})
})
innerAudioContext.onEnded(() => {
console.log("onEnded")
if (this.data.timer) {
clearInterval(this.data.timer)
}
this.data.timer = null
if (this.data.currentPlayIndex != null) {
this.setData({
[`sendList[${this.data.currentPlayIndex}].time`]: '00:00',
[`sendList[${this.data.currentPlayIndex}].isPlay`]: false,
[`sendList[${this.data.currentPlayIndex}].percentage`]: 0,
playTime: 0,
})
}
this.setData({
time: '00:00',
isPlay: false,
playTime: 0
})
})
this.data.innerAudioContext = innerAudioContext
}
if (options.taskDoneId != 'null') {
this.data.taskDoneId = options.taskDoneId
getTaskDoneById({
id: options.taskDoneId
}).then(res => {
const param = !this.data.isSubmit && res.data.jtType == 1 ? JSON.parse(res.data.jtAttachment) : {}
this.setData({
taskDone: {
...res.data,
imageUrls: res.data.jtAttachment.split(','),
},
duration: param.duration,
durationTxt: this.formatSeconds(param.duration / 1000),
})
})
}
if (options.id) {
this.data.id = options.id
getTaskById({
id: options.id
}).then(res => {
const arr = res.data.completionMethod == 1 ? [{
label: '音频录制',
value: 0
}] : res.data.completionMethod == 2 ? [{
label: '上传图片',
value: 1
}] : [{
label: '音频录制',
value: 0
}, {
label: '上传图片',
value: 1
}]
this.setData({
tabs2: arr,
tab2: res.data.completionMethod == 2 ? 1 : 0,
task: res.data,
imageList: res.data.jtTaskAttachment ? res.data.jtTaskAttachment.split(',') : [],
})
})
if (role == 'admin') {
statistics({
id: options.id
}).then(res => {
console.log(res.data)
const arr = []
let calcTotal = 0;
let calcFinish = 0;
for (let i = 0; i < res.data.length; i++) {
const element = res.data[i];
calcTotal += element.totalCount
calcFinish += element.finishCount
arr.push({
...element,
incomplete: element.totalCount - element.finishCount,
completionRate: ((element.finishCount / element.totalCount) * 100).toFixed(2)
})
}
this.setData({
completionRate: arr,
calcFinish,
calcTotal,
calcFinishRate: ((calcFinish / calcTotal) * 100).toFixed(2)
})
})
} else if (role == 'leader') {
this.getTeamInfo()
}
}
},
formatSeconds: function (value) {
var theTime = parseInt(value); // 秒
var theTime1 = 0; // 分
var theTime2 = 0; // 小时
if (theTime > 60) {
theTime1 = parseInt(theTime / 60);
theTime = parseInt(theTime % 60);
if (theTime1 > 60) {
theTime2 = parseInt(theTime1 / 60);
theTime1 = parseInt(theTime1 % 60);
}
}
var result = parseInt(theTime) < 10 ? '0' + parseInt(theTime) : parseInt(theTime);
if (theTime1 > 0) {
result = (parseInt(theTime1) < 10 ? '0' + parseInt(theTime1) : parseInt(theTime1)) + ":" + result;
} else {
result = "00:" + result;
}
if (theTime2 > 0) {
result = (parseInt(theTime2) < 10 ? '0' + parseInt(theTime2) : parseInt(theTime2)) + ":" + result;
} else {
result = "00:" + result;
}
return result.slice(3);
},
recorderStop() {
this.data.recorderManager.stop()
},
innerAudioRowStart(e) {
console.log(e.target.dataset.index)
this.data.isRowPlay = true
if (this.data.timer) {
clearInterval(this.data.timer)
}
if (this.data.currentPlayIndex != null) {
this.data.timer = null
this.setData({
[`sendList[${this.data.currentPlayIndex}].time`]: '00:00',
[`sendList[${this.data.currentPlayIndex}].isPlay`]: false,
[`sendList[${this.data.currentPlayIndex}].percentage`]: 0,
playTime: 0,
})
}
this.data.currentPlayIndex = e.target.dataset.index
this.data.innerAudioContext.src = this.data.sendList[this.data.currentPlayIndex].playUrl
this.data.innerAudioContext.play()
},
innerAudioRowStop(e) {
console.log(e.target.dataset.index)
this.data.currentPlayIndex = e.target.dataset.index
this.data.innerAudioContext.stop()
},
innerAudioStart() {
this.data.isRowPlay = false
const param = this.data.isSubmit ? {} : JSON.parse(this.data.taskDone.jtAttachment)
this.data.innerAudioContext.src = this.data.isSubmit ? this.data.recorderUrl : param.url
this.data.innerAudioContext.play()
},
innerAudioStop() {
this.data.innerAudioContext.stop()
},
innerAudioPause() {
if (this.data.timer) {
clearInterval(this.data.timer)
}
this.setData({
isPlay: false
})
this.data.innerAudioContext.pause()
},
recorderStart() {
const options = {
sampleRate: 44100,
numberOfChannels: 1,
encodeBitRate: 192000,
format: 'aac',
frameSize: 50
}
console.log(11)
this.data.recorderManager.start(options)
},
setTime(isPlay = false, second = 0) {
const that = this
this.data.timer = setInterval(function () {
second++;
that.data.playTime += 1;
if ((!isPlay && second >= 600)) {
clearInterval(that.data.timer)
that.recorderStop()
} else if (isPlay && that.data.playTime * 1000 >= that.data.duration) {
clearInterval(that.data.timer)
that.innerAudioStop()
} else {
const result = that.formatSeconds(second)
that.setData({
time: result
})
}
}, 1000)
},
setRowTime(second = 0) {
const that = this
this.data.timer = setInterval(function () {
second++;
that.data.playTime += 1;
if (that.data.playTime * 1000 >= that.data.sendList[that.data.currentPlayIndex].duration) {
clearInterval(that.data.timer)
that.data.timer = null
that.data.innerAudioContext.stop()
} else {
const result = that.formatSeconds(second)
that.setData({
[`sendList[${that.data.currentPlayIndex}].time`]: result,
})
}
}, 1000)
},
onChange(event) {
const {
value
} = event.detail;
this.setData({
feedback: value
});
},
submit() {
if (this.data.tab2 === 1 && this.data.fileList.length === 0) {
wx.showToast({
icon: 'none',
title: '请上传图片',
})
return
}
if (this.data.tab2 === 0 && (!this.data.recorderUrl || this.data.recorderState != 2)) {
wx.showToast({
icon: 'none',
title: '请先完成录制',
})
return
}
const imageUrls = this.data.fileList.map(e => e.url).join(',')
const param = {
id: this.data.taskDoneId,
jtTaskId: this.data.id,
jtType: this.data.tab2 === 1 ? 2 : 1,
feedback: this.data.feedback,
remark: this.data.remark,
jtAttachment: this.data.tab2 === 1 ? imageUrls : JSON.stringify({
duration: this.data.duration,
url: this.data.recorderUrl
})
}
saveTaskDone(param).then(res => {
wx.showToast({
icon: 'none',
title: '提交成功',
}).then(res => {
wx.navigateBack()
})
})
},
handleSliderRowChange(e) {
if (e.target.dataset.index != this.data.currentPlayIndex || !this.data.isRowPlay) {
return
}
if (this.data.timer) {
clearInterval(this.data.timer)
}
this.data.timer = null
const second = e.detail.value * this.data.innerAudioContext.duration / 100
this.setData({
[`sendList[${this.data.currentPlayIndex}].time`]: this.formatSeconds(second),
[`sendList[${this.data.currentPlayIndex}].isPlay`]: true,
[`sendList[${this.data.currentPlayIndex}].percentage`]: e.detail.value,
playTime: second,
})
this.data.innerAudioContext.seek(second)
},
handleSliderChange(e) {
if (this.data.isRowPlay) {
return
}
if (this.data.timer) {
clearInterval(this.data.timer)
}
this.data.timer = null
const second = e.detail.value * this.data.innerAudioContext.duration / 100
this.setData({
time: this.formatSeconds(second),
isPlay: true,
percentage: e.detail.value,
playTime: second,
})
this.data.innerAudioContext.seek(second)
},
handleChange(e) {
this.setData({
remark: e.detail.value
})
},
getTeamInfo() {
const param = {
teamId: app.globalData.currentUser.jtTeamId,
taskId: this.data.id,
jtTaskState: this.data.tab === 0 ? 2 : 1
}
getDoneByTeam(param).then(res => {
const arr = []
for (let i = 0; i < res.data.length; i++) {
const element = res.data[i];
const param = element.jtType == 1 ? JSON.parse(element.jtAttachment) : {}
arr.push({
...element,
imageUrls: element.jtAttachment ? element.jtAttachment.split(',') : [],
isPlay: false,
time: '00:00',
percentage: 0,
playUrl: param.url,
duration: param.duration,
durationTxt: this.formatSeconds(param.duration / 1000),
})
}
this.setData({
sendList: arr || []
})
})
},
handleAdd(e) {
const {
fileList
} = this.data;
const {
files
} = e.detail;
// 方法2每次选择图片都上传展示每次上传图片的进度
files.forEach(file => this.onUpload(file))
},
onUpload(file) {
const {
fileList
} = this.data;
this.setData({
fileList: [...fileList, {
...file,
status: 'loading'
}],
});
const {
length
} = fileList;
const task = wx.uploadFile({
url: 'https://task.51jingcheng.com/oss/imgUpload', // 仅为示例,非真实的接口地址
filePath: file.url,
name: 'file',
success: (res) => {
console.log(res.data)
const result = res.data ? JSON.parse(res.data) : {
url: ''
}
this.setData({
[`fileList[${length}].status`]: 'done',
[`fileList[${length}].url`]: result.url,
});
},
});
task.onProgressUpdate((res) => {
this.setData({
[`fileList[${length}].percent`]: res.progress,
});
});
},
handleRemove(e) {
const {
index
} = e.detail;
const {
fileList
} = this.data;
fileList.splice(index, 1);
this.setData({
fileList,
});
},
clickHandle(e) {
const urls = e.target.dataset.images || []
const index = e.target.dataset.index || 0
console.log(urls)
wx.previewImage({
current: urls[index], // 当前显示图片的http链接
urls, // 需要预览的图片http链接列表
})
},
onTabsChange(event) {
console.log(`Change tab, tab-panel value is ${event.detail.value}.`);
this.setData({
tab: event.detail.value
})
if (this.data.currentPlayIndex != null) {
if (this.data.timer) {
clearInterval(this.data.timer)
}
this.data.timer = null
this.setData({
[`sendList[${this.data.currentPlayIndex}].time`]: '00:00',
[`sendList[${this.data.currentPlayIndex}].isPlay`]: false,
[`sendList[${this.data.currentPlayIndex}].percentage`]: 0,
playTime: 0,
})
}
this.data.sendList = []
this.getTeamInfo()
},
onTabs2Change(event) {
console.log(`Change tab, tab-panel value is ${event.detail.value}.`);
this.setData({
tab2: event.detail.value
})
},
goDetail(e) {
if (e.currentTarget.dataset.id) {
wx.navigateTo({
url: '/pages/group-detail/group-detail?id='+e.currentTarget.dataset.id+"&taskId="+this.data.id,
})
}
},
/**
* 生命周期函数--监听页面初次渲染完成
*/
onReady() {
},
/**
* 生命周期函数--监听页面显示
*/
onShow() {
},
/**
* 生命周期函数--监听页面隐藏
*/
onHide() {
},
/**
* 生命周期函数--监听页面卸载
*/
onUnload() {
console.log(3)
if (this.data.innerAudioContext) {
this.data.innerAudioContext.destroy()
}
if (this.data.recorderManager) {
this.data.recorderManager.stop()
}
},
/**
* 页面相关事件处理函数--监听用户下拉动作
*/
onPullDownRefresh() {
},
/**
* 页面上拉触底事件的处理函数
*/
onReachBottom() {
},
/**
* 用户点击右上角分享
*/
onShareAppMessage() {
}
})