移动端V1.0
This commit is contained in:
245
pages/classMeeting/classMaterials.vue
Normal file
245
pages/classMeeting/classMaterials.vue
Normal file
@@ -0,0 +1,245 @@
|
||||
<template>
|
||||
<view class="">
|
||||
<view class="materials">
|
||||
<!-- 班会主题 -->
|
||||
<view class="title">
|
||||
<text>班会主题：{{mettingList.crCmTitle}}</text>
|
||||
</view>
|
||||
<view class="content">
|
||||
<text>班会名称：{{mettingList.className}}</text>
|
||||
</view>
|
||||
<view class="content">
|
||||
<text>辅导员：{{mettingList.crTeacherName}}</text>
|
||||
</view>
|
||||
<!-- 班会主题内容 -->
|
||||
<view class="content">
|
||||
<text>班会总结：</text>
|
||||
<text v-html="mettingList.crContent"></text>
|
||||
<text></text>
|
||||
</view>
|
||||
<!-- 班会活动要求 -->
|
||||
<view class="demand">
|
||||
<text>班会时间：{{mettingList.crTime}}</text>
|
||||
</view>
|
||||
<!-- 班会性质 -->
|
||||
<view class="nature">
|
||||
<text>班会地址：{{(mettingList.crAddr)}}</text>
|
||||
<text></text>
|
||||
</view>
|
||||
<!-- 备注 -->
|
||||
<view class="remark">
|
||||
<text>备注：{{mettingList.remark}}</text>
|
||||
<text></text>
|
||||
</view>
|
||||
<!-- 佐证材料 -->
|
||||
<view class="evidence">
|
||||
<text>佐证材料</text>
|
||||
</view>
|
||||
<!-- 提示 -->
|
||||
<view class="hint">
|
||||
<text>请上传 大小不超过是</text>
|
||||
<text style="color: red;">5MB</text>
|
||||
<text>格式为</text>
|
||||
<text style="color: red;">doc/xls/ppt/txt/pdf</text>
|
||||
<text>的文件</text>
|
||||
</view>
|
||||
<!-- 上传图片 -->
|
||||
<uni-file-picker v-model="fileValue" fileMediatype="all" mode="grid" @select="select" @progress="progress"
|
||||
@success="success" @fail="fail" file-extname='doc,xls,ppt,txt,pdf' title="" />
|
||||
<!-- 按钮 -->
|
||||
<view class="bottom-container">
|
||||
<button @click="onSubmit()">提交</button>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import {
|
||||
classMettingDetail,
|
||||
editClassMetting,
|
||||
uploadFiles
|
||||
} from "@/api/classmetting/classmeting.js";
|
||||
export default {
|
||||
|
||||
data() {
|
||||
return {
|
||||
mettingList: {},
|
||||
fileValue: [],
|
||||
resPath: [],
|
||||
resName: ""
|
||||
};
|
||||
},
|
||||
onLoad() {
|
||||
const id = this.$route.query.id;
|
||||
this.getclassMettingDetail(id);
|
||||
},
|
||||
methods: {
|
||||
// 获取上传状态
|
||||
select(e) {
|
||||
console.log('选择文件：', e)
|
||||
console.log(e.tempFiles[0].name)
|
||||
console.log(e.tempFilePaths)
|
||||
},
|
||||
// 获取上传进度
|
||||
progress(e) {
|
||||
console.log('上传进度：', e)
|
||||
},
|
||||
|
||||
// 上传成功
|
||||
success(e) {
|
||||
console.log('上传成功')
|
||||
this.resPath = e.tempFilePaths
|
||||
this.resName = e.tempFiles[0].name
|
||||
},
|
||||
|
||||
// 上传失败
|
||||
fail(e) {
|
||||
console.log('上传失败：', e)
|
||||
},
|
||||
getclassMettingDetail(id) {
|
||||
classMettingDetail(id).then(res => {
|
||||
console.log(res);
|
||||
this.mettingList = res.data;
|
||||
})
|
||||
},
|
||||
onSubmit() {
|
||||
let data = {
|
||||
resPath: this.resPath,
|
||||
resName: this.resName
|
||||
};
|
||||
uploadFiles(data).then(res => {
|
||||
uni.showToast({
|
||||
title: res.msg,
|
||||
icon: "error"
|
||||
})
|
||||
console.log(res)
|
||||
})
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style lang="scss">
|
||||
.materials {
|
||||
padding: 50rpx 30rpx;
|
||||
background-color: #F6F6F6;
|
||||
height: 100vh;
|
||||
position: relative;
|
||||
|
||||
// overflow-y: auto;
|
||||
.title {
|
||||
margin-bottom: 70rpx;
|
||||
|
||||
text {
|
||||
font-weight: bold;
|
||||
font-size: 37rpx;
|
||||
}
|
||||
}
|
||||
|
||||
.content {
|
||||
display: flex;
|
||||
|
||||
margin-bottom: 80rpx;
|
||||
|
||||
text:nth-child(1) {
|
||||
|
||||
font-weight: bold;
|
||||
}
|
||||
|
||||
text:nth-child(2) {
|
||||
flex: 1;
|
||||
color: #8a8a8a;
|
||||
font-size: 27rpx;
|
||||
}
|
||||
}
|
||||
|
||||
.demand {
|
||||
margin-bottom: 100rpx;
|
||||
display: flex;
|
||||
|
||||
text:nth-child(1) {
|
||||
font-weight: bold;
|
||||
}
|
||||
|
||||
text:nth-child(2) {
|
||||
flex: 1;
|
||||
color: #8a8a8a;
|
||||
font-size: 27rpx;
|
||||
}
|
||||
}
|
||||
|
||||
.nature {
|
||||
display: flex;
|
||||
margin-bottom: 50rpx;
|
||||
|
||||
text:nth-child(1) {
|
||||
font-weight: bold;
|
||||
}
|
||||
|
||||
text:nth-child(2) {
|
||||
flex: 1;
|
||||
color: #8a8a8a;
|
||||
}
|
||||
}
|
||||
|
||||
.attachment {
|
||||
margin-bottom: 100rpx;
|
||||
|
||||
text:nth-child(1) {
|
||||
font-weight: bold;
|
||||
}
|
||||
|
||||
text:nth-child(2) {
|
||||
color: #8a8a8a;
|
||||
}
|
||||
}
|
||||
|
||||
.remark {
|
||||
margin-bottom: 60rpx;
|
||||
|
||||
text:nth-child(1) {
|
||||
font-weight: bold;
|
||||
}
|
||||
|
||||
text:nth-child(2) {
|
||||
color: #8a8a8a;
|
||||
}
|
||||
}
|
||||
|
||||
.evidence {
|
||||
margin-bottom: 30rpx;
|
||||
|
||||
text:nth-child(1) {
|
||||
font-weight: bold;
|
||||
}
|
||||
}
|
||||
|
||||
.hint {
|
||||
margin-bottom: 50rpx;
|
||||
|
||||
text {
|
||||
font-size: 26rpx;
|
||||
color: #8a8a8a;
|
||||
}
|
||||
}
|
||||
|
||||
.bottom-container {
|
||||
position: fixed;
|
||||
width: 80%;
|
||||
bottom: 60rpx;
|
||||
left: 50%;
|
||||
transform: translateX(-50%);
|
||||
|
||||
button {
|
||||
background-color: #3388CC;
|
||||
color: white;
|
||||
}
|
||||
}
|
||||
|
||||
/deep/.file-picker__box-content {
|
||||
background-color: #ffffff;
|
||||
|
||||
}
|
||||
}
|
||||
</style>
|
||||
Reference in New Issue
Block a user