YingXingAI/pages/AlumniCircle/release/release.vue

566 lines
12 KiB
Vue

<template>
<view>
<u-navbar title="发布"></u-navbar>
<view class="flex-col page">
<view class="flex-col group">
<view class="flex-col items-center text-wrapper">
<u-input :maxlength='vuex_user.isAttestationGLY ? 35 : 20' type="text" v-model='title'
:custom-style="{fontSize:'32rpx'}"
@focus="inputFocus" placeholder="添加标题" class="text_1" />
</view>
<view class="flex-col items-start section_3">
<view class="group_1">
<u-input type="textarea" v-model='content' @click="shuru" @blur="inputBlur" @focus="inputFocus"
maxlength="300" :custom-style="textareaStyle" placeholder="添加正文" />
</view>
<view class="flex-col section_5" v-if="type == 1">
<scroll-view scroll-x="true">
<view class="flex-row group_5">
<view v-for="(item, index) in tabs" :key="index"
class="flex-col items-center text-wrapper_1"
:class="{ 'text-wrapper_2': arr1.includes(item.name) }"
@click="current(index, item)">
<image
src="/static/common/img/icon-lineRounded.png"
class="image_3"
/>
<text class="text_13" :class="{ 'text_16': arr1.includes(item.name) }">{{ item.name
}}</text>
</view>
<!-- <view class="flex-col items-center text-wrapper_2"><text class="text_16">找工作</text></view> -->
</view>
</scroll-view>
</view>
<view class="justify-between section_4">
<view class="flex-row expression-box" @click='emoji = !emoji'>
<image src="/static/common/img/icon-happy-face.png"
class="image_3" />
<text class="text_10">表情</text>
</view>
<view class="flex-row group_2">
<!-- <view class="flex-row">
<text class="text_9">@</text>
<text class="text_10">用户</text>
</view> -->
<!-- <view class="flex-row group_4">
<image src="/static/common/img/16535374509810688026.png" class="image_4" />
<text class="text_11">位置</text>
</view> -->
</view>
</view>
<view class="uping">
<u-upload :max-size="5 * 1024 * 1024" max-count="9" :header='header'
:action="$u.http.config.baseUrl + action" @on-success="onSuccess" @on-remove="onRemove"
ref="uUpload" width="140" height="140"></u-upload>
</view>
</view>
</view>
</view>
<view class="flex-col items-center text-wrapper_4" @click="onRelease"><text class="text_18">发 布</text></view>
<!-- emoji 表情 -->
<div @click='emoji = !emoji' class='back' v-show="emoji"></div>
<swiper class="slider" :current="emojicurrent" :class="emoji ? 'emojishow' : ''">
<swiper-item v-for="(item, key) in emojiData" :key="key" class="slider-emoji"
:class="[key == emojiData.length - 1 ? 'lastbox' : '']">
<text v-for="(value, index) in item" :key="index" @click="selemoji(value)" class="slider-emoji-icon">{{
value }}</text>
</swiper-item>
</swiper>
<u-top-tips ref="uTips" :navbar-height="0"></u-top-tips>
<u-toast ref="uToast"/>
</view>
</template>
<script>
import { Debounce } from '../../../common/utils.js'
import emoji from "../../../static/common/js/emoji";
export default {
data() {
return {
textareaStyle: {
width: "80%",
minHeight: "300rpx"
},
fileList: [],
title: '',
content: '',
emojiData: [],
emoji: false,
emojicurrent: 0,
header: {
Authorization: ""
},
action: '/app/User/File',
imgData: [],
schoolId: "",
sysSignStr: [],
num: "",
tabs: [],
arr1: [],
type: "",
url: false,
time: null,
};
},
onLoad(e) {
this.header.Authorization = "Bearer " + this.vuex_token;
this.schoolId = e.Id
this.type = e.type
this.url = e.url
this.emojiInit();
this.getSign()
},
methods: {
// 提示
tips(title, type, time) {
this.$refs.uToast.show({
title: title ? title : "",
type: type ? type : "success",
duration: time ? time + "" : "1000",
});
},
getSign() {
this.$u.apiList.GetSign().then((res) => {
if (!this.vuex_user.isAttestationQY) {
this.tabs = res.filter(item => {
return item.name != '企业招聘'
})
} else {
this.tabs = res
}
})
},
inputFocus() {
this.emoji = false;
},
current(i, item) {
if (this.arr1.includes(item.name)) {
this.arr1.splice(this.arr1.indexOf(item.name), 1)
} else {
this.arr1.push(item.name)
}
},
onRelease() {
// uni.$emit('helpAdd')
// uni.switchTab({
// url: '/pages/AlumniCircle/alumnus/alumnus?add=true',
// });
// return
if (!this.time) {
}
if (this.title === "") {
this.tips('请输入标题', 'error')
return
}
if (this.content === "") {
this.tips('请输入内容', 'error')
return
}
// let files = this.$refs.uUpload.lists[0];
if (this.type == 1) {
if (this.arr1 == "") {
this.tips("请选择标签", "error")
return
}
}
let file = this.imgData.join(',')
// if(!file){
// this.tips("请上传图片","error");
// return false
// }
let sysSignStr = this.arr1.join(',')
const data = {
title: this.title,
content: this.content,
path: file,
forwardId: "",
sysSignStr: sysSignStr,
userId: this.vuex_user.id,
schoolId: this.schoolId,
}
if (this.type == 0) {
data.sysSignStr = ""
this.onJourna(data)
} else if (this.type == 1) {
this.onHelp(data)
}
},
//发布学校资讯
onJourna: Debounce(function (data) {
this.$u.apiList.InsertJournaArticle(data).then((res) => {
/* uni.showToast({
title: "发布成功",
duration: 2000,
}); */
this.$refs.uToast.show({
title: '发布成功',
type: 'success',
})
setTimeout(() => {
uni.switchTab({
url: "../../../pages/my/my/my"
});
}, 1000)
})
}, 1000),
//发布帮帮资讯
onHelp: Debounce(function (data) {
this.$u.apiList.InsertHelpArticle(data).then((res) => {
/* uni.showToast({
title: "发布成功",
duration: 2000,
}); */
this.$refs.uToast.show({
title: '发布成功',
type: 'success',
})
uni.$emit('helpAdd')
setTimeout(() => {
if (this.url) {
uni.switchTab({
url: '../../AlumniCircle/alumnus/alumnus?add=true'
});
} else {
uni.switchTab({
url: "../../../pages/my/my/my"
});
}
}, 1000)
})
}, 1000),
onSuccess(res) {
this.imgData.push(res.data)
},
onRemove(index, lists) {
let imgs = []
lists.forEach(item => {
imgs.push(item.response.data)
})
this.imgData = imgs
},
inputBlur() {
;
},
shuru() {
;
},
selemoji(m) {
this.content += m;
},
// 表情初始化
emojiInit() {
var number = emoji.length;
// var page = Math.ceil(emoji.length / number);
var page = 1;
for (let i = 0; i < page; i++) {
this.emojiData[i] = [];
for (let k = 0; k < number; k++) {
emoji[i * number + k] ?
this.emojiData[i].push(emoji[i * number + k]) :
"";
}
}
},
//返回上一级
router() {
if (this.url) {
uni.switchTab({
url: '../../AlumniCircle/alumnus/alumnus'
});
} else {
uni.switchTab({
url: '../../my/my/my'
});
}
}
},
};
</script>
<style lang="scss" scoped>
.emojishow {
height: 3rem !important;
}
.back {
position: fixed;
left: 0;
right: 0;
bottom: 0;
top: 0;
background: #fff;
opacity: 0.2;
}
.slider {
background: #fff;
width: 7.75rem;
height: 0rem;
transition: all 0.3s;
box-shadow: 0 0 4px #999;
position: fixed;
bottom: 0;
.slider-emoji {
overflow-y: scroll;
width: 100vw !important;
}
&-emoji {
width: 6.75rem;
flex-direction: row;
flex-wrap: wrap;
justify-content: center;
&-icon {
font-size: 0.265rem;
display: inline-block;
width: 11%;
text-align: center;
padding: 0.02rem 0;
border-radius: 0.1rem;
// border-bottom: 1px solid #ccc;
}
&-icon:active {
background: #ccc;
}
}
}
.page {
// padding-bottom: 0.5rem;
overflow-y: auto;
width: calc(100% - 48rpx);
overflow-x: hidden;
height: 100%;
background: #FFFFFF;
border-radius: 24rpx;
margin: 28rpx auto 0;
.group {
padding-top: 0.015rem;
.text-wrapper {
padding: 20rpx 40rpx;
background-color: rgb(255, 255, 255);
box-shadow: 0.00018rem 0.005rem rgba(0, 0, 0, 0.1);
.text_1 {
color: rgb(2, 2, 2);
font-size: 32rpx;
font-family: Adobe Heiti Std;
line-height: 0.24rem;
width: 100%;
}
}
.section_3 {
margin-top: 0.015rem;
padding: 0.13rem 0 0.24rem;
background-color: rgb(255, 255, 255);
box-shadow: 0.00018rem 0.005rem rgba(0, 0, 0, 0.03);
.group_1 {
width: 100%;
padding: 0 40rpx;
margin: 0 auto;
}
.uping {
width: 100%;
padding: 0 40rpx;
margin: 0 auto;
}
}
.section_4 {
margin-top: 0.01rem;
// padding: 0.12rem 0.28rem 0.14rem 0.2rem;
padding: 30rpx 40rpx;
background-color: rgb(255, 255, 255);
box-shadow: 0.00018rem 0.005rem rgba(0, 0, 0, 0.03);
// width: calc(100% - 0.44rem);
width: 100%;
margin: 0 auto;
border-top: 1px solid #E7E7E7;
.image_2 {
margin-top: 0.02rem;
width: 0.23rem;
height: 0.18rem;
}
.expression-box {
display: flex;
align-items: center;
justify-content: center;
width: 128rpx;
height: 60rpx;
background: #F6F8F9;
border-radius: 200rpx 200rpx 200rpx 200rpx;
}
.image_3 {
margin-right: 8rpx;
width: 30rpx;
height: 30rpx;
}
.group_2 {
margin-top: 0.01rem;
.group_4 {
margin-left: 0.3rem;
margin-bottom: 0.02rem;
.image_4 {
flex-shrink: 0;
width: 0.14rem;
height: 0.21rem;
}
.text_11 {
margin-left: 0.06rem;
align-self: center;
color: rgb(160, 162, 172);
font-size: 0.15rem;
font-family: PingFang;
line-height: 0.14rem;
}
}
.text_9 {
color: rgb(80, 80, 81);
font-size: 0.24rem;
font-family: PingFang;
line-height: 0.24rem;
}
.text_10 {
margin-top: 0.03rem;
// color: rgb(160, 162, 172);
color: red;
font-size: 0.15rem;
font-family: PingFang;
line-height: 0.14rem;
}
}
}
.section_5 {
margin-top: 0.06rem;
padding: 30rpx 40rpx;
background-color: rgb(255, 255, 255);
box-shadow: 0.00018rem 0.005rem rgba(0, 0, 0, 0.03);
// border:1px solid red;
width: 100%;
// width: 700rpx;
// overflow: hidden;
.group_5 {
margin-top: 0.3rem;
margin-bottom: 0.1rem;
.text-wrapper_1 {
padding: 16rpx 20rpx;
// background-color: rgb(255, 255, 255);
background: #F6F8F9;
border-radius: 200rpx;
height: 0.3rem;
margin-right: 20rpx;
// border: solid 0.005rem rgb(193, 196, 204);
display: flex;
align-items: center;
justify-content: center;
flex-direction: row;
.image_3 {
margin-right: 8rpx;
width: 30rpx;
height: 30rpx;
}
.text_13 {
// color: #191919;
color: rgba(0, 0, 0, 0.90);
font-size: 28rpx;
font-family: PingFang;
line-height: 0.16rem;
white-space: nowrap;
}
}
.view_1 {
margin-left: 0.055rem;
}
.text-wrapper_2 {
background-color: #3cb4fb;
border-radius: 200rpx;
height: 0.3rem;
margin-right: 20rpx;
padding: 16rpx 20rpx;
.text_16 {
color: rgb(255, 255, 255);
font-size: 0.13rem;
font-family: PingFang;
line-height: 0.16rem;
white-space: nowrap;
}
}
.text-wrapper_3 {
margin-left: 0.055rem;
padding: 0.07rem 0 0.06rem;
flex: 1 1 0.79rem;
background-color: rgb(255, 255, 255);
border-radius: 0.05rem;
height: 0.3rem;
border: solid 0.005rem rgb(193, 196, 204);
.text_17 {
color: rgb(160, 162, 172);
font-size: 0.13rem;
font-family: PingFang;
line-height: 0.16rem;
}
}
}
}
}
}
.text-wrapper_4 {
margin: 0.31rem 0.24rem 0 0.23rem;
padding: 30rpx 0;
background-color: #3cb4fb;
border-radius: 50rpx;
.text_18 {
color: rgb(255, 255, 255);
font-size: 0.15rem;
font-family: PingFang;
line-height: 0.16rem;
}
}
</style>