Files
medicine_app/pages/miniClass/addHomeWork.vue
@fawn-nine 6d8629ff4f 暂存
2024-08-19 14:34:32 +08:00

423 lines
10 KiB
Vue
Raw Blame History

This file contains ambiguous Unicode characters
This file contains Unicode characters that might be confused with other characters. If you think that this is intentional, you can safely ignore this warning. Use the Escape button to reveal them.
<template>
<view class="page">
<z-nav-bar :title="pageName+pageType"></z-nav-bar>
<!-- 公共组件-每个页面必须引入 -->
<public-module ></public-module>
<!-- <view class="title">{{pageName+pageType}}</view> -->
<uni-forms :modelValue="form" :rules="rules" ref="form">
<view class="input_box" v-if="!form.id && form.type != 2">
<uni-forms-item label="" name="type" label-width="0">
<text class="input_tit"><i>*</i>类型:</text>
<view class="in" style="flex: 1; border: none;">
<!-- {{modelLIst}} -->
<uni-data-select placeholder="请选择类型"
class="addType"
v-model="form.type"
:localdata="range"
@change="chageType"
placement="top"
></uni-data-select>
</view>
</uni-forms-item>
</view>
<view class="input_box">
<uni-forms-item label="" name="title" label-width="0">
<text class="input_tit"><i>*</i>标题:</text>
<view class="in">
<input placeholder-style="font-size:26rpx" type="text" v-model="form.title"
placeholder="请输入标题" />
</view>
</uni-forms-item>
</view>
<view class="input_box">
<text class="input_tit">上传图片:</text>
<view class="in" style="border: none;" @click="checkPermision">
<u-upload :fileList="fileList1" @afterRead="addPic" @delete="deletePic" multiple :maxCount="4"
width="40" height="40" :previewFullImage="true">
</u-upload>
<!-- <text style="font-size: 24rpx; color: #999;">可上传4张问题截图</text> -->
</view>
<!-- <input type="password" maxlength="8" v-model="confirmPassword" placeholder="请确认密码" /> -->
</view>
<view class="input_box">
<uni-forms-item label="" name="content" label-width="0">
<text class="input_tit"><i>*</i>说明:<span style="font-weight: normal; color: #999; font-size: 26rpx;">(600字以内)</span></text>
<view class="in">
<view class="uni-textarea">
<textarea placeholder-style="font-size:26rpx" v-model="form.content" maxlength="600" auto-height
placeholder="请输入内容" />
</view>
</view>
</uni-forms-item>
</view>
<view class="input_box" v-if="form.type == 2">
<radio-group @change="radioChange" class="flex_box">
<view class="" style="margin-right:20rpx ;">
<radio value="0" :checked="0 == form.display" />他人不可见</label>
</view>
<view class="">
<radio value="1" :checked="1 == form.display" />他人可见</label>
</view>
</radio-group>
<span style="color: #999; font-size: 28rpx;">不勾选时班级管理员以外的人看不见提交的数据</span>
</view>
</uni-forms>
<view class="btn_box"><button @click="onSubmit"> </button></view>
</view>
</template>
<script>
import $http from '@/config/requestConfig.js';
import permission from "@/js_sdk/wa-permission/permission.js"
import {
mapState,
mapMutations
} from 'vuex';
export default {
data() {
return {
fileList1: [],
playData: {},
//手机号账号
form: {
id: '', // 作业或者医案id
classId: undefined,
display:'1',
content: '', // 描述
img: '', //图片
type: undefined, // 反馈类型
},
range:[
{ value: '0', text: "班内作业",name:"班内作业"},
{ value: '1', text: "班内医案" ,name:"班内医案"},
],
telError: false,
relationError: false,
relationErrorPattern:false,
rules: {
type: {
rules: [{
required: true,
errorMessage: '请选择类型',
}
]
},
title: {
rules: [{
required: true,
errorMessage: '请输入标题',
}
]
},
content: {
rules: [{
required: true,
errorMessage: '请输入问题描述',
}
]
},
},
pageType: '',
pageName:''
};
},
//第一次加载
onLoad(e) {
console.log('收到的值', e);
this.pageType = e.type
this.form.classId = e.classId
this.form.type = e.type
if(e.type){
this.form.type = e.type
}else{
this.form.type = '0'
}
if(e.id){
// this.form.renwuId = e.renwuId
this.form.id = e.id
this.pageName = '编辑'
this.getTaskInfo()
}else{
this.pageName = '添加'
}
if(e.type == 0){
// this.form.renwuId = e.renwuId
this.pageType = '作业'
}else if(e.type == 1){
this.pageType = '医案'
}else if( e.type == 2){
this.pageType = '心得'
}else{
this.pageType = '作业'
}
console.log('收到的值', e);
},
//页面显示
onShow() {
},
computed: {
...mapState(['userInfo']),
reversedMessage: function() {
// `this` 指向 vm 实例
this.form.account = this.userInfo.tel
}
},
//方法
methods: {
chageType(e){
// console.log('e',e);
if(e == 0){
this.pageType = '作业'
}else if(e == 1){
this.pageType = '医案'
}
},
// 获取医案任务详情
getTaskInfo(){
$http.request({
url: "common/class/getClassTaskInfoStudent",
method: "POST",
data: {
"taskId": this.form.id
},
header: { //默认 无 说明:请求头
'Content-Type': 'application/json'
},
})
.then(res => {
if (res.code == 0) {
// that.isHave = true
console.log(res)
this.form = res.classTask
this.fileList1 = []
if(this.form.img != ''){
var List = this.form.img.split(',')
List.forEach(item => {
this.fileList1.push({url:item})
})
}
}
}).catch(e => {
console.log(e, '数据报错')
// this.status = 3
uni.showToast({
title: e.msg,
icon: 'error'
})
});
},
radioChange(e){
// console.log('点了', e);
this.form.display = e.detail.value
console.log('点了',this.form.show, e);
},
relationInput(e) {
this.relationError = false
this.relationErrorPattern = false
},
telInput(e) {
// console.log('键盘输入',e);
this.telError = false
},
async checkPermision(){
var result = await permission.premissionCheck("CAMERA_EXTERNAL_STORAGE")
if (result != 1) {
return false
}
},
async addPic(e) {
console.log("添加图片");
let that = this;
for (var i = 0; i < e.file.length; i++) {
//console.log(i,e.file[i].url)
uni.uploadFile({
url: this.$baseUrl + "oss/fileoss",
filePath: e.file[i].url,
//files:e.file,
name: "file",
formData: {},
success: (res) => {
that.fileList1.push({
url: JSON.parse(res.data).url,
});
console.log(that.fileList1, "that.uploadPicLIst");
},
fail: (error) => {
console.log("上传失败", error);
},
});
}
},
deletePic(event) {
this.fileList1.splice(event.index, 1)
},
onSubmit() {
this.$refs.form.validate().then(res => {
if (this.fileList1.length > 0) {
let _list = this.fileList1
_list = _list.map(item => item.url)
// console.log('this.fileList1',_list);
this.form.img = _list.join(',')
}else{
this.form.img = ''
}
var _url = ""
this.form.id ? _url = "common/class/editClassTask" : _url = "common/class/addClassTask"
$http.request({
url: _url,
method: "POST",
data: {
"id": this.form.id,
"classId": this.form.id ? undefined : this.form.classId,
"type": this.form.type, //类型 0班内任务1医案2心得
"display": this.form.display, //0不展示1展示
"title": this.form.title,
"content": this.form.content,
"img": this.form.img
},
header: { //默认 无 说明:请求头
'Content-Type': 'application/json'
},
})
.then(res => {
uni.showToast({
title:'操作成功!',
icon:'success'
})
setTimeout(()=>{
uni.$emit('refreshData');
uni.navigateBack({
delta: 1
})
},1000)
}).catch(e => {
// console.log('表单错误信息:', err);
uni.showToast({
title: '操作失败',
icon: 'error'
})
});
}).catch(err => {
console.log('表单错误信息:', err);
uni.showToast({
title: '页面有未填写的内容哦',
icon: 'none'
})
})
}
},
//页面隐藏
onHide() {},
//页面卸载
onUnload() {},
//页面下来刷新
onPullDownRefresh() {},
//页面上拉触底
onReachBottom() {},
//用户点击分享
onShareAppMessage(e) {
return this.wxShare();
}
};
</script>
<style lang="scss" scoped>
@import '@/style/mixin.scss';
::v-deep .uni-forms-item{
margin-bottom: 26rpx !important;
}
.input_tit{
font-weight: bold;
}
.page {
background-color: #ffffff;
padding: 0 65rpx;
min-height: 100vh;
.title {
padding: 30rpx 0 40rpx 0;
font-size: 40rpx;
color: #333333;
}
.input_box {
display: block;
// justify-content: space-between;
// overflow: hidden;
// height: 100rpx;
padding-top: 10rpx;
// border-bottom: 1rpx solid #eeeeee;
align-items: center;
i {
font-size: 24rpx;
color: red;
padding-right: 10rpx;
}
.in {
border: 1rpx solid #eeeeee;
border-radius: 8rpx;
padding: 8rpx;
margin-top: 10rpx;
}
text {
font-size: 30rpx;
width: 180rpx;
}
input {
flex: 1;
height: 50rpx;
// line-height: 70rpx;
font-size: 30rpx;
}
button {
height: 78rpx;
line-height: 78rpx;
font-size: 30rpx;
color: $themeColor;
&:active {
background-color: transparent;
}
}
}
.btn_box {
margin-top: 70rpx;
padding-bottom: 20rpx;
button {
font-size: 32rpx;
@include theme('btn_bg') color: #fff;
height: 80rpx;
line-height: 80rpx;
border-radius: 50rpx;
}
}
.protocol {
font-size: 24rpx;
color: #999999;
text-align: center;
margin-top: 20rpx;
text {
color: $themeColor;
}
}
}
</style>