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

174 lines
3.6 KiB

3 months ago
<template>
<view class="release">
<view class="release-hd">
<view class="a">
<u--textarea v-model="title" placeholder="请输入内容" ></u--textarea>
</view>
<view class="b">
<view class="pic" v-for="(a,i) in image1" :key="i">
<image class="img" :src="a"></image>
<view class="del" @click.stop="toDel(i)">
<u-icon name="trash"></u-icon>
</view>
</view>
<view class="pic" @click="uploadImg()">
<image class="img" src="/static/release-upload.png"></image>
</view>
</view>
</view>
<view class="release-fd" @click="toSubmit()">提交</view>
</view>
</template>
<script>
export default {
data() {
return {
title: "",
image: [],
image1: [],
isClick: true
};
},
methods: {
//删除图片
toDel(i){
this.image.splice(i,1);
this.image1.splice(i,1);
},
//上传图片
uploadImg() {
const that = this
uni.chooseImage({
count: 9-that.image.length,
sizeType: ["original"], //可以指定是原图还是压缩图,默认二者都有
sourceType: ["album", "camera"],
success: (res) => {
console.log(res)
console.log(res.tempFilePaths)
for(var i = 0; i<res.tempFilePaths.length;i++){
uni.uploadFile({
name: 'file',
header: {
userToken: uni.getStorageSync('userToken')
},
url: this.$baseUrl+'api/upload',
filePath: res.tempFilePaths[i],
success: (upRes) => {
let end = JSON.parse(upRes.data)
that.image.push(end.data.name)
that.image1.push(end.data.url)
},
fail: (err) => {
console.log("toUpload err",err)
console.log(err)
}
});
}
},
fail(err){
console.log("fail",err)
}
});
},
//状态
async toSubmit() {
if(!this.title){
uni.showToast({
icon: "none",
title: "内容不能为空!"
})
return ;
}
if(this.image.length == 0){
uni.showToast({
icon: "none",
title: "请上传图片"
})
return ;
}
const {code, msg} = await this.$api.addCircle({
title: this.title,
image: this.image.join(",")
})
if(code == 200){
uni.showToast({
title: "提交成功"
})
uni.$emit("reloadQuanzi","111")
setTimeout(()=>{
uni.navigateBack({
delta: 1
})
},2000)
}else{
uni.showToast({
icon: "none",
title: msg
})
}
},
}
}
</script>
<style lang="scss" scoped>
.release {
width: 100%;
padding: 25rpx;
overflow: hidden;
box-sizing: border-box;
&-hd{
padding: 20rpx;
overflow: hidden;
background-color: #fff;
border-radius: 20rpx;
.b{
width: 110%;
overflow: hidden;
display: flex;
flex-wrap: wrap;
justify-content: flex-start;
margin-top: 30rpx;
.pic{
width: 206rpx;
height: 206rpx;
overflow: hidden;
position: relative;
margin-right: 20rpx;
margin-bottom: 20rpx;
border: 1px solid #f6f6f6;
.img{
width: 100%;
height: 100%;
border-radius: 5rpx;
}
.del{
width: 50rpx;
height: 50rpx;
background-color: #fff;
display: flex;
align-items: center;
justify-content: center;
position: absolute;
right: 0;
top: 0;
z-index: 2;
}
}
}
}
&-fd{
width: 320rpx;
line-height: 98rpx;
background: linear-gradient(-90deg, #3399EA, #38BCFF);
border-radius: 98rpx;
font-size: 30rpx;
font-weight: 400;
color: #FFFFFF;
text-align: center;
margin: 0 auto;
margin-top: 50rpx;
}
}
</style>