<template>
|
<view class="container">
|
|
<!--上报信息-->
|
<card class="card">
|
<view class="content" slot="content">
|
<u-form labelPosition="top" labelWidth="70" :model="form" :rules="rules" ref="form">
|
|
<u-form-item label="描述:" required prop="content">
|
<u-textarea confirmType="done" v-model="form.content" placeholder="请填写描述">
|
</u-textarea>
|
</u-form-item>
|
|
<u-form-item label="图片:" prop="images">
|
<u-upload :fileList="form.images" :previewFullImage="uploadConfig.previewFullImage"
|
:accept="uploadConfig.acceptImg" :multiple="uploadConfig.multiple"
|
:maxCount="uploadConfig.maxCount" :capture="uploadConfig.capture" @afterRead="afterReadImg"
|
@delete="deletePic">
|
</u-upload>
|
</u-form-item>
|
|
<!-- <u-form-item label="联系方式:" prop="phone">
|
<u-input confirmType="done" v-model="form.phone" placeholder="联系方式">
|
</u-input>
|
</u-form-item> -->
|
</u-form>
|
</view>
|
</card>
|
|
<view class="btn">
|
<u-button type="primary" text="提交" @click="submit"></u-button>
|
</view>
|
</view>
|
</template>
|
|
<script>
|
import card from "@/components/my-components/card.vue"
|
import {
|
devUrl,
|
clientId,
|
clientSecret
|
} from '@/common/setting'
|
import {
|
Base64
|
} from '@/utils/base64.js';
|
import {
|
fileUrlConvert
|
} from "@/subPackage/patrol/util/fileUtil.js"
|
import {
|
add
|
} from "@/api/feedback/feedback.js"
|
export default {
|
components: {
|
card,
|
},
|
data() {
|
return {
|
form: {
|
images: [],
|
content: "",
|
// phone: "",
|
},
|
rules: {
|
'content': {
|
required: true,
|
message: '请输入说明',
|
trigger: ['blur', 'change']
|
},
|
},
|
uploadConfig: {
|
acceptImg: "image",
|
acceptVideo: 'video',
|
capture: ['album', 'camera'],
|
multiple: true,
|
maxCount: "5",
|
previewFullImage: true,
|
uploadText: "上传中",
|
url: devUrl + "/api/blade-resource/oss/endpoint/put-file-attach",
|
header: {},
|
},
|
}
|
},
|
created() {
|
|
},
|
mounted() {
|
this.getHeader()
|
},
|
onLoad(option) {
|
|
},
|
onShow() {
|
|
},
|
methods: {
|
//获取头部
|
getHeader() {
|
let accessToken = uni.getStorageSync('accessToken');
|
let myHeader = {}
|
if (accessToken) {
|
myHeader['Blade-Auth'] = 'bearer ' + accessToken;
|
}
|
// 客户端认证参数
|
myHeader['Authorization'] = 'Basic ' + Base64.encode(clientId + ':' + clientSecret);
|
this.header = myHeader
|
this.uploadConfig.header = myHeader
|
},
|
//上传方法
|
uploadFilePromise(url) {
|
return new Promise((resolve, reject) => {
|
let a = uni.uploadFile({
|
url: this.uploadConfig.url, //接口地址
|
filePath: url,
|
name: 'file',
|
header: this.uploadConfig.header,
|
success: (res) => {
|
let data = JSON.parse(res.data)
|
setTimeout(() => {
|
resolve(data)
|
}, 1000)
|
}
|
});
|
})
|
},
|
|
//读取后的处理函数
|
async afterReadImg(event) {
|
this.showLoading()
|
|
// 当设置 multiple 为 true 时, file 为数组格式，否则为对象格式
|
let lists = [].concat(event.file)
|
let fileListLen = this.form.images.length
|
lists.map((item) => {
|
this.form.images.push({
|
...item,
|
status: 'uploading',
|
message: '上传中'
|
})
|
})
|
for (let i = 0; i < lists.length; i++) {
|
const result = await this.uploadFilePromise(lists[i].url)
|
this.form.images.splice(fileListLen, 1, Object.assign({}, {
|
url: fileUrlConvert(result.data.link)
|
}))
|
fileListLen++
|
}
|
this.loadingClose()
|
|
},
|
showLoading() {
|
uni.showLoading({
|
mask: true,
|
title: '上传中'
|
})
|
},
|
loadingClose() {
|
uni.hideLoading()
|
},
|
//删除图片
|
deletePic(event) {
|
this.form.images.splice(event.index, 1)
|
},
|
//15841602118
|
submit() {
|
this.$refs.form.validate().then(valid => {
|
|
if (this.form.images.length == 0) {
|
this.form.images = undefined
|
}
|
add(this.form).then(res => {
|
this.$u.func.showToast({
|
title: "反馈成功",
|
back: true
|
})
|
})
|
})
|
}
|
}
|
}
|
</script>
|
|
<style scoped lang="scss">
|
.container {
|
overflow: hidden;
|
padding: 0 14rpx;
|
}
|
|
.card {
|
.content {
|
// padding: 0 30rpx;
|
}
|
|
.image {
|
width: 100rpx;
|
height: 100rpx;
|
}
|
}
|
|
.btn {
|
padding: 0 20rpx;
|
}
|
</style>
|
