<template>
|
<view class="uni-set-content">
|
<view class="uni-panel-h" @click="clickDescVoice">
|
<text class="uni-panel-text">描述：</text>
|
<view class="uni-panel-icon-btn fs-picture" @click="clickChooseImage"></view>
|
</view>
|
<view class="uni-panel-c divider-bottom">
|
<textarea auto-height fixed :focus="formData.descFocus" name="desc" comfirm-type="done"
|
show-confirm-bar="{{false}}" type="text" v-model="form.desc" placeholder="请详细描述你的问题和意见..."
|
:maxlength="-1" />
|
</view>
|
|
<button id='ok' type="primary" @tap="onOk" class="btn_ok">确定</button>
|
<button id='ok' type="default" @tap="onCancel" class="btn_cancel">取消</button>
|
</view>
|
</template>
|
|
<script>
|
import {
|
base64
|
} from "js-md5";
|
import Session from "@/common/utils.js"
|
import TaskInit from "@/common/extend.js"
|
import {
|
showModal,
|
showToast,
|
showLoading,
|
hideLoading,
|
getCurUserId,
|
getCurUserName
|
} from "@/common/Page.js"
|
import {
|
uploadFile,
|
downloadFileUrl,
|
publicFileUrl,
|
downloadFileTask
|
} from "@/api/index.js"
|
|
export default {
|
name: "pageSetContent",
|
data() {
|
return {
|
content: "",
|
}
|
},
|
methods: {
|
setData(obj) {
|
let that = this;
|
let keys = [];
|
let val, data;
|
|
Object.keys(obj).forEach(function(key) {
|
keys = key.split(".");
|
val = obj[key];
|
data = that.$data;
|
keys.forEach(function(key2, index) {
|
if (index + 1 == keys.length) {
|
that.$set(data, key2, val);
|
} else {
|
if (!data[key2]) {
|
that.$set(data, key2, {});
|
}
|
}
|
data = data[key2];
|
});
|
});
|
},
|
// 选择图片发送
|
clickChooseImage() {
|
if (uni.canIUse('chooseMedia')) {
|
this.getMedia('album');
|
} else {
|
var _this = this
|
let app = getApp()
|
let sizeType = ['original', 'compressed']
|
//#ifdef MP-DINGTALK
|
sizeType = ['compressed']
|
// #endif
|
|
uni.chooseImage({
|
count: 10,
|
sizeType: sizeType, //original 原图，compressed 压缩图，默认二者都有
|
sourceType: ['album', 'camera'], //album 从相册选图，camera 使用相机，默认二者都有。
|
success: (res) => {
|
let tempFiles = []
|
if (res.files) {
|
for (let i = 0; i < res.files.length; i++) {
|
let tmpFile = {
|
path: res.files[i].path,
|
size: 0
|
}
|
tmpFile.name = tmpFile.path
|
if (res.files[i].fileType)
|
tmpFile.name = tmpFile.path + "." + res.files[i].fileType
|
tempFiles.push(tmpFile)
|
}
|
} else if (res.tempFiles) {
|
for (let i = 0; i < res.tempFiles.length; i++) {
|
let tmpFile = {
|
path: res.tempFiles[i].path,
|
size: 0
|
}
|
tmpFile.name = tmpFile.path
|
tempFiles.push(tmpFile)
|
}
|
} else {
|
for (let i = 0; i < res.tempFilePaths.length; i++) {
|
tempFiles.push({
|
path: res.tempFilePaths[i],
|
name: res.tempFilePaths[i],
|
size: 0
|
})
|
}
|
}
|
_this.uploadImages(tempFiles);
|
|
},
|
fail: (err) => {
|
console.log('chooseImage fail', err)
|
if (err.errMsg.indexOf('cancel') < 0 && err.errMsg
|
.indexOf(
|
'取消') < 0) {
|
uni.getSetting({
|
success: (res) => {
|
let authStatus = res.authSetting['scope.album'];
|
if (!authStatus) {
|
showModal("需要从您的相册获取图片，请在设置界面打开相关权限", "授权失败").then((
|
res) => {
|
if (res) {
|
uni.openSetting()
|
}
|
})
|
}
|
}
|
})
|
}
|
}
|
})
|
}
|
},
|
getMedia(strType) {
|
var _this = this
|
let app = getApp()
|
console.log("chooseMedia")
|
uni.chooseMedia({
|
count: 10,
|
mediaType: ['image', 'video'],
|
sourceType: [strType], //album 从相册选图，camera 使用相机，默认二者都有。
|
sizeType: ['original'], //original 原图，compressed 压缩图，默认二者都有
|
maxDuration: 30,
|
camera: 'back',
|
success(res) {
|
_this.uploadImages(res.tempFiles);
|
},
|
fail: (err) => {
|
//_this.openDrawer();
|
if (err.errMsg.indexOf('cancel') < 0) {
|
uni.getSetting({
|
success: (res) => {
|
console.log("getSetting", res)
|
let authStatus = true
|
if (strType == "album")
|
authStatus = res.authSetting['scope.album'];
|
else if (strType == "camera")
|
authStatus = res.authSetting['scope.camera'];
|
|
if (!authStatus) {
|
showModal("需要从您的相册获取图片，请在设置界面打开相关权限", "授权失败").then((
|
res) => {
|
if (res) {
|
uni.openSetting()
|
}
|
})
|
}
|
}
|
})
|
}
|
}
|
})
|
|
|
},
|
uploadImage(file) {
|
file.public = true
|
uploadFile(file, (docSuc) => {
|
// const imgRegex =
|
// /<img[^>]+src="([^">]+)"[^>]*data-fileserver="([^">]+)"[^>]*>/g;
|
const imgRegex =
|
/<img[^>]+src="([^">]+)"[^>]*data-path="([^">]+)"[^>]*>/g;
|
let arr = this.content.match(imgRegex)
|
if (arr) {
|
for (let i = 0; i < arr.length; i++) {
|
const xmlImg = arr[i]
|
let xmlDoc = new DOMParser().parseFromString(xmlImg, "text/xml");
|
let finds = xmlDoc.getElementsByTagName('img'); //获取find节点
|
for (let j = 0; j < finds.length; j++) { //循环节点
|
let finder = finds[j];
|
let src = finder.getAttribute("src")
|
let fileserver = finder.getAttribute("data-fileserver")
|
let src2 = await publicFileUrl(fileserver, src)
|
ret.data.Content = ret.data.Content.replace(xmlImg,
|
`<img style="width:auto;height:auto;max-width:100%;display:block;" src="${src2}"/>`
|
);
|
break
|
}
|
|
}
|
|
}
|
this.content = this.content.replace(imgRegex,
|
`<img src="${docSuc.url}" data-src="${docSuc.filesflag}" data-fileserver="${docSuc.filesflag}" />`
|
);
|
|
|
imgMsg =
|
`<img src="${docSuc.url}" data-fileserver="${docSuc.filesflag}" />`
|
|
let upfile = {
|
|
fileserver: docSuc.filesflag,
|
|
fileId: docSuc.id,
|
name: docSuc.name,
|
|
path: file.path,
|
},
|
(docProgress, uploadTask) => {
|
console.log("uploadAttachs uploadTaskFile progress", docProgress);
|
_this.setAttachProgress(docProgress.path, docProgress.progress, uploadTask);
|
},
|
(docFail) => {
|
console.log("uploadAttach uploadFile fail", docFail);
|
_this.setAttachFailed(docFail.path, docFail.errMsg);
|
})
|
},
|
uploadImages(files) {
|
var _this = this
|
let fileTemps = []
|
if (files.length <= 10) {
|
fileTemps = files
|
} else {
|
for (let i = 0; i < 10; i++) {
|
fileTemps.push(files[i])
|
}
|
}
|
for (let i = 0; i < fileTemps.length; i++) {
|
let file = fileTemps[i];
|
file.isUploading = true
|
file.percent = 0
|
if (file.tempFilePath)
|
file.path = file.tempFilePath
|
let aname = file.path || file.filePath || ""
|
if (file.name)
|
aname = file.name
|
let aaa = aname.split('/');
|
if (aaa.length > 0) {
|
file.name = aaa[aaa.length - 1]
|
} else
|
file.name = aname
|
if (TaskInit.fileUtils.isPictureType(file.name)) //文档
|
{
|
attachs.push(file)
|
}
|
|
}
|
_this.setData({
|
attachFiles: attachs,
|
})
|
for (let i = 0; i < fileTemps.length; i++) {
|
let file = fileTemps[i];
|
// #ifdef MP-WEIXIN
|
uni.getFileSystemManager().getFileInfo({
|
filePath: file.path,
|
digestAlgorithm: "md5",
|
success: (res) => {
|
// console.log("uploadImages getFileInfo", res)
|
file.md5 = res.digest
|
file.size = res.size
|
_this.uploadImage(file)
|
},
|
fail: (res) => {
|
|
}
|
})
|
// #endif
|
// #ifndef MP-WEIXIN
|
uni.getFileInfo({
|
filePath: file.path,
|
digestAlgorithm: "md5",
|
success: (res) => {
|
file.md5 = res.digest
|
file.size = res.size
|
_this.uploadImage(file)
|
},
|
fail: (res) => {
|
|
}
|
})
|
// #endif
|
|
}
|
|
},
|
|
onCancel() {
|
uni.navigateBack({
|
delta: 1
|
})
|
},
|
onOk() {
|
const eventChannel = this.getOpenerEventChannel();
|
eventChannel.emit('selTaskUserOk', this.takeon, this.auditorSet);
|
uni.navigateBack({
|
delta: 1
|
})
|
},
|
|
},
|
onLoad(option) {
|
this.content = base64.decode(option.content)
|
// #ifdef MP-DINGTALK
|
|
my.setNavigationBar({
|
backgroundColor: "#007AFF",
|
frontColor: "#ffffff"
|
})
|
// #endif
|
},
|
|
}
|
</script>
|
|
<style lang="scss">
|
.uni-set-content {
|
display: flex;
|
width: 750rpx;
|
flex-direction: column !important;
|
|
.uni-panel-h2 {
|
display: flex;
|
background-color: #ffffff;
|
flex-direction: row !important;
|
align-items: center !important;
|
margin: 0px;
|
padding: 12px 10px 12px 12px;
|
font-size: 14px;
|
border-bottom: 1px solid #e8eaec;
|
}
|
|
.uni-panel-c {
|
background-color: #ffffff;
|
align-items: center !important;
|
padding: 4px 8px;
|
font-size: 14px;
|
}
|
|
.uni-panel-text {
|
flex: 1;
|
color: #000000;
|
font-weight: normal;
|
|
.uni-panel-icon {
|
padding: 0 6px;
|
font-size: 20px;
|
}
|
}
|
|
.uni-panel-h {
|
display: flex;
|
flex-direction: row !important;
|
align-items: center !important;
|
padding: 12px 10px 12px 12px;
|
font-size: 14px;
|
}
|
|
.uni-panel-icon {
|
padding: 4px 6px;
|
color: #999999;
|
font-weight: normal;
|
transition-duration: 0s;
|
font-size: 20px;
|
transition-property: transform;
|
}
|
|
.uni-panel-h2 .uni-panel-text {
|
flex: 1;
|
color: #000000;
|
font-weight: normal;
|
}
|
|
.uni-panel-h2 input {
|
flex: 5;
|
color: #000000;
|
font-weight: normal;
|
}
|
|
.uni-panel-icon-btn {
|
padding: 10px;
|
font-size: 18px;
|
border: 1px solid #aaa;
|
border-radius: 8px;
|
margin-left: 5px;
|
|
:active {
|
background-color: #e5eaee;
|
color: #007aff;
|
}
|
}
|
|
.uni-panel-user-item {
|
margin: 4px;
|
display: flex;
|
flex-direction: column;
|
height: 50px;
|
width: 50px;
|
}
|
|
.uni-panel-user-item image {
|
margin: 2px 8px;
|
height: 32px;
|
width: 32px;
|
border-radius: 16px;
|
}
|
|
.uni-panel-user-item text {
|
width: 50px;
|
height: 18px;
|
text-align: center;
|
font-size: 12px;
|
overflow: hidden;
|
white-space: nowrap;
|
text-overflow: clip;
|
}
|
|
button.btn_ok {
|
width: 80%;
|
padding: 20rpx;
|
line-height: 1.5;
|
margin: auto;
|
margin-top: 50rpx;
|
}
|
|
button.btn_cancel {
|
margin: auto;
|
margin-top: 50rpx;
|
width: 80%;
|
padding: 20rpx;
|
line-height: 1.5;
|
border: 1px solid #dcdee2;
|
|
}
|
}
|
</style>
|
