387 lines
8.7 KiB
Vue
387 lines
8.7 KiB
Vue
|
<template>
|
|||
|
|
<view class="fullHeight addNoticePage">
|
|||
|
|
<!-- <view class="add-header">
|
|||
|
|
<view class="backBtn" @click="back">
|
|||
|
|
<uni-icons2 type="back" color="#fff" size="26"/>
|
|||
|
|
</view>
|
|||
|
|
新建通知
|
|||
|
|
</view> -->
|
|||
|
|
<view class="fixedheader">
|
|||
|
|
<headers :themeType="true" :showBack="true">
|
|||
|
|
<view class="headerName">
|
|||
|
|
新建通知
|
|||
|
|
</view>
|
|||
|
|
</headers>
|
|||
|
|
</view>
|
|||
|
|
<scroll-view class="smallHeight" :style="{ 'padding-top': statusBarHeight + 44 + 'px' }" scroll-y>
|
|||
|
|
<view class="add-from">
|
|||
|
|
<view class="add-item">
|
|||
|
|
<view class="input-box">
|
|||
|
|
<input type="text" placeholder="请输入标题" v-model="noticeTitle"/>
|
|||
|
|
</view>
|
|||
|
|
</view>
|
|||
|
|
|
|||
|
|
<view class="content">
|
|||
|
|
<span class="content-lable">内容</span>
|
|||
|
|
<!-- <view class="textarea-box">
|
|||
|
|
<textarea :value="noticeContent"/>
|
|||
|
|
</view> -->
|
|||
|
|
<view class="textarea-box">
|
|||
|
|
<input type="text" placeholder="请输入内容" v-model="noticeContent"/>
|
|||
|
|
</view>
|
|||
|
|
</view>
|
|||
|
|
|
|||
|
|
<view class="add-item">
|
|||
|
|
<view class="add-item">
|
|||
|
|
<view class="project-select">
|
|||
|
|
<view class="icon-image">
|
|||
|
|
<image src="/static/workstation/icon_allot_bg.png"></image>
|
|||
|
|
发送给
|
|||
|
|
</view>
|
|||
|
|
<view class="project-picker">
|
|||
|
|
<view class="people-text">{{allotPeople}}</view>
|
|||
|
|
<view class="uni-input" @click="toPeopleList">
|
|||
|
|
<uni-icons2 type="arrowright" color="#6C7178" size="20"/>
|
|||
|
|
</view>
|
|||
|
|
<!-- {{sendPeople}} -->
|
|||
|
|
<!-- <view class="uni-list-cell-db">
|
|||
|
|
<picker :range="peopleList" range-key="name" :value="sendPeople" @change="bindPeopleChange">
|
|||
|
|
<view class="uni-input">
|
|||
|
|
<uni-icons2 type="arrowright" color="#6C7178" size="20"/>
|
|||
|
|
</view>
|
|||
|
|
</picker>
|
|||
|
|
</view> -->
|
|||
|
|
</view>
|
|||
|
|
</view>
|
|||
|
|
</view>
|
|||
|
|
</view>
|
|||
|
|
|
|||
|
|
<view class="add-item">
|
|||
|
|
<view class="project-select" @click="selectFile">
|
|||
|
|
<view class="icon-image">
|
|||
|
|
<image src="/static/workstation/icon_file_address_bg.png"></image>
|
|||
|
|
添加附件
|
|||
|
|
</view>
|
|||
|
|
<!-- <view class="input project-upload" @click="selectFile2(index)">
|
|||
|
|
</view> -->
|
|||
|
|
</view>
|
|||
|
|
</view>
|
|||
|
|
|
|||
|
|
<view class="project-filelist" v-if="fileList.length > 0">
|
|||
|
|
<ul>
|
|||
|
|
<li v-for="(item,index) in fileList" :key="index">
|
|||
|
|
{{item.name}}
|
|||
|
|
<icon type="cancel" size="16" @click="removeFive(index)"/>
|
|||
|
|
<!-- <image :src="item.url" @click="previewImage(item.url)"/></image> -->
|
|||
|
|
<!-- <uni-icons2 class="icon-close" type="close" color="#6C7178" size="12"></uni-icons2> -->
|
|||
|
|
</li>
|
|||
|
|
</ul>
|
|||
|
|
</view>
|
|||
|
|
</view>
|
|||
|
|
|
|||
|
|
<view class="submit-btn" @click="submitForm">提交通知</view>
|
|||
|
|
</scroll-view>
|
|||
|
|
<levitatedsphere :x="100" :y="80"></levitatedsphere>
|
|||
|
|
</view>
|
|||
|
|
</template>
|
|||
|
|
|
|||
|
|
<script>
|
|||
|
|
import levitatedsphere from "@/components/levitatedsphere/levitatedsphere.vue"
|
|||
|
|
import headers from '../../../components/headers/headers.vue'
|
|||
|
|
export default {
|
|||
|
|
data(){
|
|||
|
|
return{
|
|||
|
|
noticeTitle: '',
|
|||
|
|
noticeContent: '',
|
|||
|
|
fileList: [],
|
|||
|
|
allotPeople: "",
|
|||
|
|
checkPeopleList: [],
|
|||
|
|
noticePeopleId: [],
|
|||
|
|
fileUrl: '',
|
|||
|
|
statusBarHeight: 0
|
|||
|
|
}
|
|||
|
|
},
|
|||
|
|
components:{
|
|||
|
|
headers
|
|||
|
|
},
|
|||
|
|
onShow(){
|
|||
|
|
this.projectSn = JSON.parse(uni.getStorageSync('userInfo')).sn;
|
|||
|
|
this.statusBarHeight=uni.getStorageSync('systemInfo').statusBarHeight;
|
|||
|
|
this.userId = JSON.parse(uni.getStorageSync('userInfo')).userId
|
|||
|
|
if(uni.getStorageSync('attendee')){
|
|||
|
|
this.checkPeopleList = JSON.parse(uni.getStorageSync('attendee'))
|
|||
|
|
let arr = []
|
|||
|
|
this.noticePeopleId = []
|
|||
|
|
this.checkPeopleList.forEach(item=>{
|
|||
|
|
arr.push(item.workerName)
|
|||
|
|
this.noticePeopleId.push({
|
|||
|
|
noticeUser: item.userId
|
|||
|
|
})
|
|||
|
|
})
|
|||
|
|
this.allotPeople = arr.join('，')
|
|||
|
|
}
|
|||
|
|
},
|
|||
|
|
methods:{
|
|||
|
|
back(){
|
|||
|
|
uni.navigateBack({
|
|||
|
|
url: ''
|
|||
|
|
})
|
|||
|
|
},
|
|||
|
|
selectFile(){
|
|||
|
|
var that = this
|
|||
|
|
uni.chooseImage({
|
|||
|
|
count: 5 - that.fileList.length,
|
|||
|
|
success(res) {
|
|||
|
|
const tempFilePaths = res.tempFilePaths;
|
|||
|
|
console.log(res)
|
|||
|
|
let data = {
|
|||
|
|
name: res.tempFiles[0].name,
|
|||
|
|
url: tempFilePaths[0]
|
|||
|
|
};
|
|||
|
|
// that.fileList.push(data)
|
|||
|
|
// console.log(that.fileList)
|
|||
|
|
uni.uploadFile({
|
|||
|
|
url: that.url_config + 'upload/image', //仅为示例，非真实的接口地址
|
|||
|
|
filePath: tempFilePaths[0],
|
|||
|
|
name: 'files',
|
|||
|
|
success: (uploadFileRes) => {
|
|||
|
|
console.log(uploadFileRes)
|
|||
|
|
let data = {
|
|||
|
|
name: JSON.parse(uploadFileRes.data).data[0].filename,
|
|||
|
|
url: JSON.parse(uploadFileRes.data).data[0].imageUrl
|
|||
|
|
};
|
|||
|
|
that.fileList.push(data)
|
|||
|
|
}
|
|||
|
|
});
|
|||
|
|
}
|
|||
|
|
})
|
|||
|
|
},
|
|||
|
|
previewImage(url){
|
|||
|
|
let imgArr = [];
|
|||
|
|
imgArr.push(url);
|
|||
|
|
//预览图片
|
|||
|
|
uni.previewImage({
|
|||
|
|
urls: imgArr,
|
|||
|
|
current: imgArr[0]
|
|||
|
|
});
|
|||
|
|
},
|
|||
|
|
removeFive(index){
|
|||
|
|
this.fileList.splice(index, 1)
|
|||
|
|
},
|
|||
|
|
toPeopleList(){
|
|||
|
|
uni.navigateTo({
|
|||
|
|
url: '../workstationIndex/peopleList'
|
|||
|
|
})
|
|||
|
|
},
|
|||
|
|
submitForm(){
|
|||
|
|
// console.log(1)
|
|||
|
|
let data = {}
|
|||
|
|
if(!this.noticeTitle){
|
|||
|
|
uni.showToast({
|
|||
|
|
title: '标题名称不能为空！',
|
|||
|
|
icon: "none",
|
|||
|
|
duration: 2000
|
|||
|
|
});
|
|||
|
|
return;
|
|||
|
|
} else {
|
|||
|
|
data.noticeTitle = this.noticeTitle
|
|||
|
|
}
|
|||
|
|
if(!this.noticeContent){
|
|||
|
|
uni.showToast({
|
|||
|
|
title: '内容不能为空！',
|
|||
|
|
icon: "none",
|
|||
|
|
duration: 2000
|
|||
|
|
});
|
|||
|
|
return;
|
|||
|
|
} else {
|
|||
|
|
data.noticeContent = this.noticeContent
|
|||
|
|
}
|
|||
|
|
if(this.noticePeopleId.length > 0){
|
|||
|
|
data.userList = this.noticePeopleId
|
|||
|
|
} else {
|
|||
|
|
uni.showToast({
|
|||
|
|
title: '请选择通知人！',
|
|||
|
|
icon: "none",
|
|||
|
|
duration: 2000
|
|||
|
|
});
|
|||
|
|
return;
|
|||
|
|
}
|
|||
|
|
let fileArr = []
|
|||
|
|
for(let i = 0; i<this.fileList.length; i++){
|
|||
|
|
fileArr.push(this.fileList[i].url)
|
|||
|
|
}
|
|||
|
|
data.projectSn = this.projectSn
|
|||
|
|
data.fileUrl = fileArr.length > 0 ? fileArr.join(',') : ''
|
|||
|
|
data.createUser = this.userId
|
|||
|
|
// console.log(data)
|
|||
|
|
this.sendRequest({
|
|||
|
|
url: "xmgl/workstationNotice/add",
|
|||
|
|
data: data,
|
|||
|
|
method: "POST",
|
|||
|
|
success(res){
|
|||
|
|
console.log(res)
|
|||
|
|
if(res.code){
|
|||
|
|
uni.navigateTo({
|
|||
|
|
url: './worfStationNotice'
|
|||
|
|
})
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
})
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
</script>
|
|||
|
|
|
|||
|
|
<style lang="scss" scoped>
|
|||
|
|
.fixedheader{
|
|||
|
|
position: fixed;
|
|||
|
|
top: 0;
|
|||
|
|
left: 0;
|
|||
|
|
width: 100%;
|
|||
|
|
z-index: 2;
|
|||
|
|
}
|
|||
|
|
.smallHeight{
|
|||
|
|
height: 100%;
|
|||
|
|
box-sizing: border-box;
|
|||
|
|
}
|
|||
|
|
.addNoticePage{
|
|||
|
|
position: relative;
|
|||
|
|
background: #f6f6f6;
|
|||
|
|
box-sizing: border-box;
|
|||
|
|
.add-header{
|
|||
|
|
height: 92rpx;
|
|||
|
|
width: 100%;
|
|||
|
|
background: #127FEC;
|
|||
|
|
color: #fff;
|
|||
|
|
display: flex;
|
|||
|
|
align-items: center;
|
|||
|
|
.backBtn{
|
|||
|
|
width: 60rpx;
|
|||
|
|
text-align: right;
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
.add-item{
|
|||
|
|
background-color: #fff;
|
|||
|
|
border-bottom: 1px solid rgba(246, 246, 246, 1);
|
|||
|
|
height: 100rpx;
|
|||
|
|
display: flex;
|
|||
|
|
align-items: center;
|
|||
|
|
width: 100%;
|
|||
|
|
}
|
|||
|
|
.input-box{
|
|||
|
|
width: 100%;
|
|||
|
|
padding: 0 30rpx;
|
|||
|
|
box-sizing: border-box;
|
|||
|
|
}
|
|||
|
|
.content{
|
|||
|
|
background-color: #fff;
|
|||
|
|
border-bottom: 1px solid rgba(246, 246, 246, 1);
|
|||
|
|
align-items: center;
|
|||
|
|
width: 100%;
|
|||
|
|
padding: 30rpx;
|
|||
|
|
box-sizing: border-box;
|
|||
|
|
}
|
|||
|
|
.content-lable{
|
|||
|
|
margin-bottom: 32rpx;
|
|||
|
|
display: block;
|
|||
|
|
}
|
|||
|
|
.textarea-box{
|
|||
|
|
border: 1px solid #E1E1E4;
|
|||
|
|
width: 692rpx;
|
|||
|
|
height: 100rpx;
|
|||
|
|
border-radius: 16rpx;
|
|||
|
|
// :deep( uni-textarea){
|
|||
|
|
// width: 100%;
|
|||
|
|
// height: 100%;
|
|||
|
|
// padding: 20rpx;
|
|||
|
|
// box-sizing: border-box;
|
|||
|
|
// }
|
|||
|
|
:deep( uni-input){
|
|||
|
|
height: 100rpx;
|
|||
|
|
line-height: 100rpx;
|
|||
|
|
padding: 0 20rpx;
|
|||
|
|
box-sizing: border-box;
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
.project-select{
|
|||
|
|
display: flex;
|
|||
|
|
align-items: center;
|
|||
|
|
justify-content: space-between;
|
|||
|
|
width: 100%;
|
|||
|
|
height: 100%;
|
|||
|
|
padding: 0 30rpx;
|
|||
|
|
box-sizing: border-box;
|
|||
|
|
.icon-image{
|
|||
|
|
display: flex;
|
|||
|
|
align-items: center;
|
|||
|
|
color: #979797;
|
|||
|
|
font-size: 28rpx;
|
|||
|
|
white-space: nowrap;
|
|||
|
|
image{
|
|||
|
|
width: 36rpx;
|
|||
|
|
height: 36rpx;
|
|||
|
|
margin-right: 30rpx;
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
.project-picker{
|
|||
|
|
display: flex;
|
|||
|
|
width: 100%;
|
|||
|
|
align-items: center;
|
|||
|
|
justify-content: flex-end;
|
|||
|
|
.uni-list-cell-db{
|
|||
|
|
margin-left: 20rpx;
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
.project-filelist{
|
|||
|
|
background-color: #fff;
|
|||
|
|
border-bottom: 1px solid rgba(246, 246, 246, 1);
|
|||
|
|
width: 100%;
|
|||
|
|
padding: 0 20rpx;
|
|||
|
|
box-sizing: border-box;
|
|||
|
|
ul{
|
|||
|
|
// display: flex;
|
|||
|
|
// align-items: center;
|
|||
|
|
list-style: none;
|
|||
|
|
padding: 20rpx;
|
|||
|
|
// flex-wrap: wrap;
|
|||
|
|
li{
|
|||
|
|
display: flex;
|
|||
|
|
align-items: center;
|
|||
|
|
height: 48rpx;
|
|||
|
|
justify-content: space-between;
|
|||
|
|
// position: relative;
|
|||
|
|
// image{
|
|||
|
|
// width: 100rpx;
|
|||
|
|
// height: 100rpx;
|
|||
|
|
// margin: 0 10rpx;
|
|||
|
|
// }
|
|||
|
|
// .icon-close{
|
|||
|
|
// position: absolute;
|
|||
|
|
// right: 8rpx;
|
|||
|
|
// top: -8rpx;
|
|||
|
|
// }
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
.submit-btn{
|
|||
|
|
width: 100%;
|
|||
|
|
height: 94rpx;
|
|||
|
|
background: #127FEC;
|
|||
|
|
color: #fff;
|
|||
|
|
text-align: center;
|
|||
|
|
line-height: 94rpx;
|
|||
|
|
position: absolute;
|
|||
|
|
bottom: 0;
|
|||
|
|
left: 0;
|
|||
|
|
}
|
|||
|
|
.people-text{
|
|||
|
|
overflow: hidden;
|
|||
|
|
text-overflow:ellipsis;
|
|||
|
|
white-space: nowrap;
|
|||
|
|
width: 400rpx;
|
|||
|
|
text-align: right;
|
|||
|
|
}
|
|||
|
|
</style>
|