290 lines
9.8 KiB
Vue
290 lines
9.8 KiB
Vue
<template>
|
||
<view>
|
||
<!-- 状态栏 -->
|
||
<status-nav :titleVal="'写日记'" :statusTitle="true"></status-nav>
|
||
<view :style="{paddingTop: statusHeight+'px'}" class="pad-zy20">
|
||
<view class="mar-s30 bacf pad20" style="border-radius: 20rpx 20rpx 0 0;">
|
||
<!-- 日记标题 -->
|
||
<view class="disac mar-s20">
|
||
<view class="mar-y20 flexs titlel2">日记标题</view>
|
||
<view class="width100 radius10 pad-zy20 borbot-cc height-68">
|
||
<input v-model="diary_title" class="fon28 height-68" type="text" value="" placeholder="今天是2021年的最后一天" placeholder-style="color:#999999;"/>
|
||
</view>
|
||
</view>
|
||
<!-- 详细内容 -->
|
||
<view class="dis mar-s20">
|
||
<view class="mar-y20 flexs mar-s20 titlel2">详细内容</view>
|
||
<view class="width100 radius10 pad20 borbot-cc" style="height: 300rpx;">
|
||
<textarea v-model="diary_content" class="fon28" maxlength="500" style="height: 300rpx;width: auto;" placeholder="请输入详细内容" placeholder-style="color:#999999;"/>
|
||
<!-- <editor id="editor" class="ql-container" :placeholder="placeholder" @ready="onEditorReady"></editor> -->
|
||
</view>
|
||
</view>
|
||
<!-- 选择病种 -->
|
||
<view class="disac pad-s32">
|
||
<view class="flexs mar-y20 titlel2">选择病种</view>
|
||
<!-- 下拉列表 -->
|
||
<view @tap="openXial(0)" class="disjbac width100 radius10 pad-zy20 xiala posir">
|
||
<view>{{disease}}</view>
|
||
<image :class="isdisease?'zhuan':'nozhuan'" src="/static/public/sanj.png" mode="aspectFill"></image>
|
||
<view v-if="isdisease" class="posia bacf radius10 xial-box mar-s20">
|
||
<view class="pad-zy20 xial-item-box">
|
||
<view @tap="chooseXia(indexl,0)" :class="diseaseCurrent==indexl?'pcol':''" v-for="(iteml,indexl) in diseaseArr" :key="indexl">{{iteml.title}}</view>
|
||
</view>
|
||
</view>
|
||
</view>
|
||
</view>
|
||
<!-- 关联医生 -->
|
||
<view class="disac pad-s32">
|
||
<view class="flexs mar-y20 titlel2">关联医生</view>
|
||
<!-- 下拉列表 -->
|
||
<view @tap="openXial(1)" class="disjbac width100 radius10 pad-zy20 xiala posir">
|
||
<view>{{diary_doctor}}</view>
|
||
<image :class="isdiary_doctor?'zhuan':'nozhuan'" src="/static/public/sanj.png" mode="aspectFill"></image>
|
||
<view v-if="isdiary_doctor" class="posia bacf radius10 xial-box mar-s20">
|
||
<view class="pad-zy20 xial-item-box">
|
||
<view @tap="chooseXia(indexl,1)" :class="diary_doctorCurrent==indexl?'pcol':''" v-for="(iteml,indexl) in diary_doctorArr" :key="indexl">{{iteml.title}}</view>
|
||
</view>
|
||
</view>
|
||
</view>
|
||
</view>
|
||
<!-- 添加封面 -->
|
||
<view class="dis mar-s20">
|
||
<view class="mar-y20 flexs titlel2">添加封面</view>
|
||
<view class="width100">
|
||
<view v-if="fengImg!=''" class="posir" style="width: 32%;">
|
||
<image :src="fengImg" class="diary-item-img" style="width: 100%;" mode="aspectFill"></image>
|
||
<image @tap="clearfengImg" src="../../static/public/closequan.png" class="posia" style="width: 20px;height: 20px;right: 10rpx;top: 10rpx;" mode=""></image>
|
||
</view>
|
||
<image v-else @tap="updataImg(0)" class="diary-item-img" src="../../static/public/diary-add.png" mode="aspectFill"></image>
|
||
</view>
|
||
</view>
|
||
<!-- 添加图片 -->
|
||
<view class="dis mar-s20">
|
||
<view class="mar-y20 flexs titlel2">添加图片</view>
|
||
<view class="width100 disac fw">
|
||
<view v-for="(item,index) in imgArr" :key="index" class="diary-item-img posir">
|
||
<image :src="item" mode="aspectFill" class="addImg"></image>
|
||
<image @tap="clearaddImg(index)" src="../../static/public/closequan.png" class="posia" style="width: 20px;height: 20px;right: 10rpx;top: 10rpx;" mode=""></image>
|
||
</view>
|
||
<image v-if="imgArr.length!=9" @tap="updataImg(1)" class="diary-item-img" src="../../static/public/diary-add.png" mode="aspectFill"></image>
|
||
</view>
|
||
</view>
|
||
<!-- 底部按钮 -->
|
||
<view style="margin-top: 87rpx;margin-bottom: 30rpx;">
|
||
<view @tap="submit" class="fon30 radius20 tc colf bold" style="margin: 0 83rpx;height: 90rpx;line-height: 90rpx;" :style="{background:publicColor}">立即提交</view>
|
||
</view>
|
||
</view>
|
||
</view>
|
||
<!-- 底部客服 -->
|
||
<public-customer></public-customer>
|
||
<!-- 用户信息授权，手机号授权 -->
|
||
<auth-userInfo-mobileInfo></auth-userInfo-mobileInfo>
|
||
</view>
|
||
</template>
|
||
|
||
<script>
|
||
import {base64ToPath} from '@/jsFile/base64-src.js';
|
||
import {checkBanner} from '@/jsFile/publicAPI.js';
|
||
export default {
|
||
data() {
|
||
return {
|
||
optionObj:'',
|
||
diary_title:'',//日记标题
|
||
diary_content:'',//详细内容
|
||
disease:'请选择病种',//病种
|
||
disease_id:'',//病种id
|
||
isdisease:false,
|
||
diseaseArr:[],
|
||
diseaseCurrent:0,
|
||
diary_doctor:'请选择关联医生',//医生
|
||
diary_doctor_id:'',//医生id
|
||
isdiary_doctor:false,
|
||
diary_doctorArr:[],
|
||
diary_doctorCurrent:0,
|
||
fengImg:'',
|
||
imgArr:[],
|
||
placeholder: '开始输入...'
|
||
}
|
||
},
|
||
computed: {
|
||
// 主题颜色
|
||
publicColor() {
|
||
return this.$store.state.publicColor
|
||
},
|
||
statusHeight() {
|
||
return this.$store.state.statusHeight
|
||
}
|
||
},
|
||
onLoad(options) {
|
||
if(uni.getStorageSync('phone_active')!=0 && uni.getStorageSync('is_active')!=0){
|
||
// 查询要编辑日记的信息
|
||
if(options.id!=undefined){
|
||
this.checkDiaryInfo(options.id);
|
||
}
|
||
this.diseaseEv();
|
||
this.chooseEv();
|
||
}
|
||
},
|
||
methods: {
|
||
onEditorReady() {
|
||
// #ifdef MP-BAIDU
|
||
this.editorCtx = requireDynamicLib('editorLib').createEditorContext('editorId');
|
||
// #endif
|
||
|
||
// #ifdef APP-PLUS || H5 ||MP-WEIXIN
|
||
uni.createSelectorQuery().select('#editor').context((res) => {
|
||
this.editorCtx = res.context
|
||
}).exec()
|
||
// #endif
|
||
},
|
||
openXial(index){
|
||
if(index==0) {
|
||
this.isdisease = !this.isdisease
|
||
}
|
||
if(index==1) {
|
||
this.isdiary_doctor = !this.isdiary_doctor
|
||
}
|
||
},
|
||
chooseXia(index,num){//预约类别选择事件
|
||
if(num==0){
|
||
this.diseaseCurrent = index
|
||
this.disease = this.diseaseArr[index].title
|
||
this.disease_id = this.diseaseArr[index].id
|
||
} else {
|
||
this.diary_doctorCurrent = index
|
||
this.diary_doctor = this.diary_doctorArr[index].title
|
||
this.diary_doctor_id = this.diary_doctorArr[index].id
|
||
}
|
||
},
|
||
// 病种列表事件
|
||
diseaseEv(){
|
||
this.$requst.post('archives/disease').then(res=>{
|
||
// console.log('病种列表：',res);
|
||
if(res.code==0 && res.data.length!=0){
|
||
this.diseaseArr=[]
|
||
res.data.forEach(item=>{
|
||
let obj = {
|
||
id:item.id,
|
||
title:item.name,
|
||
pid:item.pid,
|
||
sort:item.sort
|
||
}
|
||
this.diseaseArr.push(obj)
|
||
})
|
||
// this.disease = this.diseaseArr[0].title;
|
||
// this.disease_id = this.diseaseArr[0].id;
|
||
}
|
||
},error=>{})
|
||
},
|
||
chooseEv(){//查询医生列表
|
||
this.$requst.post('user/doctor-list',{page:1,size:1000}).then(res=>{
|
||
if(res.code==0){
|
||
this.diary_doctorArr = [];
|
||
if(res.data.list.length){
|
||
res.data.list.forEach(item=>{
|
||
let obj = {
|
||
id:item.id,
|
||
title:item.name
|
||
}
|
||
this.diary_doctorArr.push(obj)
|
||
})
|
||
// this.diary_doctor = this.diary_doctorArr[0].title
|
||
// this.diary_doctor_id = this.diary_doctorArr[0].id
|
||
} else this.$toolAll.tools.showToast('暂无医生可选');
|
||
} else this.$toolAll.tools.showToast(res.msg);
|
||
})
|
||
},
|
||
// 图片上传
|
||
updataImg(index){
|
||
if(index==0){
|
||
uni.chooseImage({
|
||
count:1,
|
||
sourceType:['album'],
|
||
success: (res) => {
|
||
let tempImg = res.tempFilePaths[0];
|
||
this.$requst.upload('file/upload/image',{file:tempImg}).then(res=>{
|
||
this.fengImg = this.$http + res.data.src;
|
||
this.$toolAll.tools.showToast('图片上传成功(*^▽^*)')
|
||
},error=>{})
|
||
}
|
||
})
|
||
} else {
|
||
uni.chooseImage({
|
||
count:9,
|
||
sourceType:['album'],
|
||
success: (res) => {
|
||
let tempImg = res.tempFilePaths;
|
||
let num = 0;
|
||
for (var i = 0; i < tempImg.length; i++) {
|
||
num++;
|
||
this.$requst.upload('file/upload/image',{file:tempImg[i]}).then(res=>{
|
||
if(this.imgArr.length!=9){
|
||
this.imgArr.push(this.$http + res.data.src);
|
||
}
|
||
if(num==tempImg.length){
|
||
this.$toolAll.tools.showToast('上传成功(*^▽^*)')
|
||
} else {
|
||
this.$toolAll.tools.showToast('上传中...')
|
||
}
|
||
},error=>{})
|
||
}
|
||
}
|
||
})
|
||
}
|
||
},
|
||
clearfengImg(){
|
||
this.fengImg = '';
|
||
},
|
||
clearaddImg(index){
|
||
this.imgArr.splice(index,1);
|
||
},
|
||
// 保存图片
|
||
submit(){
|
||
if(this.diary_title==''){
|
||
this.$toolAll.tools.showToast('请输入日记标题');
|
||
} else if(this.diary_content==''){
|
||
this.$toolAll.tools.showToast('请输入详细内容');
|
||
} else if(this.disease_id==''){
|
||
this.$toolAll.tools.showToast('请选择病种');
|
||
} else if(this.diary_doctor_id==''){
|
||
this.$toolAll.tools.showToast('请关联医生');
|
||
} else if(this.fengImg==''){
|
||
this.$toolAll.tools.showToast('请添加封面图');
|
||
} else {
|
||
let params = {
|
||
title :this.diary_title,
|
||
images:this.imgArr.join(','),
|
||
cover:this.fengImg,
|
||
disease_id:this.disease_id,
|
||
disease_name:this.disease,
|
||
content:this.diary_content,
|
||
doctor_id:this.diary_doctor_id,
|
||
doctor_name:this.diary_doctor,
|
||
id:''
|
||
}
|
||
console.log(params);
|
||
this.$requst.post('user/diary-save',params).then(res=>{
|
||
if(res.code==0){
|
||
this.$toolAll.tools.showToast('保存成功');
|
||
uni.navigateBack({delta:1})
|
||
} else this.$toolAll.tools.showToast(res.msg);
|
||
},error=>{})
|
||
}
|
||
},
|
||
// 查询要编辑日记的信息
|
||
// checkDiaryInfo(id){
|
||
// this.$requst.get('user/diary-info',{id:id}).then(res=>{
|
||
// if(res.code==0){
|
||
// if(this.page==1) this.dataList = [];
|
||
// this.total = res.data.total;
|
||
// } else this.$toolAll.tools.showToast(res.msg);
|
||
// },error=>{})
|
||
// }
|
||
}
|
||
}
|
||
</script>
|
||
|
||
<style>
|
||
|
||
</style>
|