add_praise.vue
3.1 KB
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
<template>
<view class="add_praise">
<view class="tel_index_bg"></view>
<view class="add_praise-main">
<view class="add_praise-main-1">
<view class="add_praise-main-1-l">请在此处提交你对我校及某位老师的表扬</view>
<view class="add_praise-main-1-b">
<view class="add_praise-main-1-b-u">
<u-upload
:fileList="fileList"
@afterRead="afterRead"
@delete="deletePic"
name="4"
multiple
:maxCount="6"
></u-upload>
</view>
<view class="add_praise-main-1-b-t">
<u--textarea height="150" v-model="content" placeholder="请输入文字内容" ></u--textarea>
</view>
</view>
</view>
<view class="operation" @click="submit">
提交表扬
</view>
</view>
</view>
</template>
<script>
export default {
data() {
return {
fileList: [],
content: ''
};
},
methods: {
submit() {
var datas = {
content: this.content,
imgs: this.fileList.map(item => item.url)
}
var jkurl = '/praise/add'
this.$service.P_post(jkurl, datas).then(res => {
uni.showToast({
icon:'none',
title: '上传成功'
})
setTimeout(() => {
uni.navigateBack({
delta: 1
})
}, 1500)
})
},
async afterRead(event) {
let lists = [].concat(event.file)
for (let i = 0; i < lists.length; i++) {
let res = await this.uploadFilePromise(lists[i].url)
this.fileList.push({
name: res.data,
url: res.name
})
}
this.$emit('change', this.fileList)
},
uploadFilePromise(url) {
let baseurl = this.$service.baseurl
return new Promise((resolve, reject) => {
uni.showLoading({
title: '上传中'
})
uni.uploadFile({
url: baseurl + 'api/login/upload', // 仅为示例,非真实的接口地址
filePath: url,
name: 'file',
header: {
'Authorization': uni.getStorageSync('token')
},
formData: {},
success: (res) => {
console.log('res=====>', JSON.parse(res.data))
resolve(JSON.parse(res.data))
uni.hideLoading()
}
});
})
},
deletePic(e) {
console.log(e.index)
this.fileList.splice(0, 1)
}
}
}
</script>
<style lang="scss">
.add_praise{
.tel_index_bg{
position: absolute;
top: 0;
z-index: 1;
width: 100%;
min-height: 220rpx;
background: linear-gradient(0deg, #f8f8f8 0%, #ffffff 25%, #5D9DFD 60%, #428EFE 70%, #2D81FF 100%);
}
.add_praise-main{
position: relative;
z-index: 1;
padding: 15rpx 25rpx;
.add_praise-main-1{
border-radius: 15rpx;
background: #fff;
overflow: hidden;
.add_praise-main-1-l{
line-height: 60rpx;
padding: 0 30rpx;
background: #fff9eb;
color: #F5AC1A;
font-size: 24rpx;
}
.add_praise-main-1-b{
padding: 0rpx 30rpx;
.add_praise-main-1-b-u{
padding: 40rpx 0rpx;
border-bottom: #EEEEEE solid 1rpx;
}
}
}
.operation{
border-radius: 15rpx;
background-color: #2C82FD;
line-height: 90rpx;
text-align: center;
width: 700rpx;
color: #fff;
z-index: 1;
margin-top: 40rpx;
}
}
}
</style>