case-data/pages/publish/publish.vue
zoujiandong 518a5d1b47 6.12
2025-06-12 17:42:29 +08:00

1736 lines
43 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>
<div class="upage">
<view class="navbox">
<view class="bg"></view>
<view class="namebox">
<view class="back" @click="alertSave">
<u-icon name="arrow-left" color="#000" size="24"></u-icon>
</view>
<!-- <view class="logo">logo</view> -->
<view class="name">发病例交流帖</view>
</view>
</view>
<!-- <backNav :navName="'发病例交流帖'"></backNav> -->
<view class="form">
<view class="textbox">
<up--textarea
autoHeight
v-model="form.exchange_title"
placeholder="输入标题,可包含患者信息、主诉"
></up--textarea>
</view>
<view class="row">
<view class="left"> 病例信息 </view>
<view class="right" @click="clearMuBan">
<u-icon name="trash" color="#6B7280" size="18"></u-icon>
清除模板
</view>
</view>
<view class="textcon page-editor-container" id="editor">
<sv-editor
placeholder="患者基本情况,检查结果,诊疗图片或视频"
eid="editor-id"
@ready="ready"
@focus="focusInfo"
@blur="blurInfo"
></sv-editor>
<!-- <editor
id="editor"
placeholder="写点什么吧~~"
show-img-resize
show-img-toolbar
show-img-size
@ready="ready"
@focus="OnFocus"
@statuschange="statuschange"
></editor> -->
</view>
<view class="textcon" style="border: none">
<view class="row">
<view class="left">
总结与讨论 <text class="tip">(可不填)</text>
</view>
</view>
<view class="textcell">
<view class="iptbox" id="editorRes">
<sv-editor
placeholder="分享经验和心得,如:诊断与鉴别诊断易错点,治疗过程难点,病例的相关知识总结及讨论等"
eid="editorResult"
@ready="readyResult"
@focus="focusResult"
@blur="focusResult"
></sv-editor>
<!-- <up--textarea
maxlength="-1"
autoHeight
v-model="form.title"
placeholder="分享经验和心得,如:诊断与鉴别诊断易错点,治疗过程难点,病例的相关知识总结及讨论等"
></up--textarea> -->
</view>
</view>
</view>
<view class="textcon" style="border: none">
<view class="sickbox">
<view class="sick" v-for="(item,index) in labelList" :key="item.app_iden">
{{ item.label_name }}
<view class="del" @click="delLabel(index)">
<up-icon name="close-circle" color="#3CC7C0" size="20"></up-icon>
</view>
</view>
<view class="add" @click="openLabelPop">
<up-icon name="plus" color="#3CC7C0" size="16"></up-icon>
添加疾病
</view>
</view>
<!-- <view class="imgbox">
<view class="imgcell">
<up--image src="https://cdn.uviewui.com/uview/album/1.jpg" mode="widthFix"></up--image>
</view>
</view> -->
</view>
</view>
<view class="bottom">
<view class="toolbox">
<view
class="cell"
@click="insertImage"
:class="{ active: !isFocusInfo && !isFocusResult }"
>
<up--image
:src="photoImg"
class="headImg"
width="32rpx"
height="32rpx"
></up--image>
<view class="name">添加图片</view>
</view>
<view
class="cell"
@click="insertVideo"
:class="{ active: !isFocusInfo && !isFocusResult }"
>
<up--image
:src="videoImg"
class="headImg"
width="32rpx"
height="32rpx"
></up--image>
<view class="name">添加视频</view>
</view>
<view
class="cell"
:class="{ active: !isFocusInfo }"
@click="alertTitle"
>
<up--image
:src="addImg"
class="headImg"
width="32rpx"
height="32rpx"
></up--image>
<view class="name">添加小标题</view>
</view>
</view>
<view class="bottombtn">
<view class="left">
<view class="draft" @click="showDraft = true">草稿箱</view>
<view class="vote" @click="showVote = true">
投票
<up--image
:src="voteImg"
class="headImg"
width="47rpx"
height="47rpx"
></up--image>
</view>
</view>
<view class="right" @click="publish">发布</view>
</view>
</view>
<up-popup
:round="10"
:show="showVote"
mode="bottom"
@close="closeVote"
@open="openVote"
>
<view class="votepop">
<view class="titlebox">
<view class="left" @click="closeVote">取消</view>
<view class="right" @click="saveVote">保存</view>
</view>
<view class="votecon">
<view class="titlebox">
<view class="title">投票标题</view>
<view class="desc">(最多20字)</view>
</view>
<view class="row first">
<up-input
placeholder="请输入投票标题"
border="surround"
v-model="voteData.vote_title"
clearable
></up-input>
</view>
<view
class="row"
v-for="(item, index) in voteData.case_exchange_vote_option"
:key="index"
>
<up-input
placeholder="输入选项建议少于16个字"
border="surround"
v-model="item.option_value"
clearable
></up-input>
<view class="iconbox" @click="delOption(index)">
<u-icon name="minus-circle" color="red" size="28"></u-icon>
</view>
</view>
<!-- <view class="row">
<up-input
placeholder="输入选项建议少于16个字"
border="surround"
v-model="value"
clearable
></up-input>
</view>
<view class="row">
<up-input
placeholder="输入选项建议少于16个字"
border="surround"
v-model="value"
clearable
></up-input>
</view> -->
<view class="add" @click="addOption">
<up-icon name="plus" color="#4B5563" size="18"></up-icon>
<view class="desc">添加选项</view>
</view>
<view class="expire">
<view class="name">有效期</view>
<view class="right">
<view class="minus" @click="changeDay('minus')">-</view>
<view class="day">{{ voteData.valid_day }}</view>
<view class="plus" @click="changeDay('plus')">+</view>
</view>
</view>
<view class="tips"
>友情提醒为保证投票结果准确性帖子发布后投票无法修改</view
>
</view>
<view class="confirm" @click="saveVote">确认</view>
<view class="del" @click="clearVote">删除投票</view>
</view>
</up-popup>
<up-popup
:round="10"
zIndex="9"
:show="showDraft"
mode="bottom"
@close="closeDraft"
@open="openDraft"
>
<view class="draftpop">
<view class="titlebox"
>草稿箱
<view class="close" @click="closeDraft"
><up-icon name="close" color="#4B5563" size="20"></up-icon
></view>
</view>
<view class="draftlist">
<view
class="cell"
v-for="(item, index) in draftList"
:key="item.draft_id"
>
<view class="title">{{
item.exchange_title ? item.exchange_title : "无标题"
}}</view>
<view class="row" v-if="item.exchange_content">
<view class="smalltitle">病例信息</view>
<view
class="con ellipsis-two-lines"
v-html="item.exchange_content"
></view>
</view>
<view class="row" v-else-if="item.exchange_summary">
<view class="smalltitle" v-if="item.exchange_summary"
>总结与讨论</view
>
<view
class="con ellipsis-two-lines"
v-if="item.exchange_summary"
v-html="item.exchange_summary"
></view>
</view>
<view
class="sickbox"
v-else-if="item.exchange_label && item.exchange_label.length > 0"
>
<view class="smalltitle" v-if="item.exchange_summary"
>疾病标签</view
>
<view
class="sick"
v-for="cell in item.exchange_label"
:key="cell.label_name"
>{{ cell.label_name }}</view
>
</view>
<view class="row" v-else-if="item.exchange_vote">
<view class="smalltitle">投票</view>
<view class="con ellipsis-two-lines">{{
item.exchange_vote.vote_title
}}</view>
</view>
<view class="deal">
<view class="time">编辑于{{ fromatDay(item.updated_at) }}</view>
<view class="right">
<view class="del" @click="willDelDraft(item.draft_id)"
><up-icon name="trash" color="#4B5563" size="16"></up-icon
>删除</view
>
<view class="edit" @click="editDraft(index)"
><up-icon name="edit-pen" color="#fff" size="17"></up-icon
>编辑</view
>
</view>
</view>
</view>
</view>
</view>
</up-popup>
</div>
<up-popup
:round="10"
zIndex="9"
:show="showTitle"
mode="bottom"
@close="closeTitle"
@open="openTitle"
>
<view class="draftpop titlepop">
<view class="titlebox"
>添加小标题
<view class="close" @click="closeTitle"
><up-icon name="close" color="#4B5563" size="20"></up-icon
></view>
</view>
<view class="con">
<view class="top">
<up-icon
name="plus-circle"
color="#3CC7C0"
size="20"
@click="insertAllWord"
></up-icon>
<view class="desc" @click="insertAllWord">一键添加全部</view>
</view>
<view class="cellbox">
<view class="cell" @click="insertWord('患者信息')">患者信息</view>
<view class="cell" @click="insertWord('主诉')">主诉</view>
<view class="cell" @click="insertWord('现病史及既往史')"
>现病史及既往史</view
>
</view>
<view class="cellbox">
<view class="cell" @click="insertWord('检查')">检查</view>
<view class="cell" @click="insertWord('临床诊断')">临床诊断</view>
<view class="cell" @click="insertWord('治疗经过及结果')"
>治疗经过及结果</view
>
</view>
</view>
</view>
</up-popup>
<up-overlay :show="showModal" mask-click-able>
<view class="zanboxpop">
<view class="zanwraper">
<view class="title">提示</view>
<view class="content" v-if="delType == 'delDraft'">
是否删除该草稿?
</view>
<view class="content" v-else-if="delType == 'saveDraft'">
是否保存该草稿?
</view>
<view class="btnbox">
<view class="cancle" @click="cancelDel">取消</view>
<view class="ok" @click="confirmDel">确定</view>
</view>
</view>
</view>
</up-overlay>
<up-popup
:round="10"
zIndex="9"
:show="showCase"
mode="bottom"
@close="closeCase"
>
<view class="votepop casepop">
<view class="titlebox">
<view class="left" @click="showCase = false">取消</view>
<view class="left continue" @click="continueCase" v-show="level != 3"
>继续选择</view
>
<view class="right" @click="confirmCase">确定</view>
</view>
<view class="casecon">
<view v-show="level == 1" >
<up-radio-group
v-model="caseValue1"
iconPlacement="right"
placement="column"
>
<view
class="column"
v-for="item in labelObj.list1"
:key="item.app_iden"
>
<up-radio
activeColor="#3CC7C0 "
:label="item.label_name"
:name="item.app_iden"
></up-radio>
</view>
</up-radio-group>
</view>
<view v-show="level == 2" >
<up-radio-group
v-model="caseValue2"
iconPlacement="right"
placement="column"
>
<view
class="column"
v-for="item in labelObj.list2"
:key="item.app_iden"
>
<up-radio
activeColor="#3CC7C0 "
:label="item.label_name"
:name="item.app_iden"
></up-radio>
</view>
</up-radio-group>
</view>
<view v-show="level == 3" >
<up-radio-group
v-model="caseValue3"
iconPlacement="right"
placement="column"
>
<view
class="column"
v-for="item in labelObj.list2"
:key="item.app_iden"
>
<up-radio
activeColor="#3CC7C0 "
:label="item.label_name"
:name="item.app_iden"
></up-radio>
</view>
</up-radio-group>
</view>
</view>
</view>
</up-popup>
</template>
<script setup>
import { reactive, ref } from "vue";
import backNav from "@/components/backNav/backNav";
import photoImg from "@/static/photo.png";
import addImg from "@/static/add.png";
import videoImg from "@/static/videoicon.png";
import voteImg from "@/static/vote.png";
import api from "@/api/api";
import dayjs from "dayjs";
import { onLoad } from "@dcloudio/uni-app";
import svEditor from "@/uni_modules/sv-editor/components/sv-editor/sv-editor.vue";
//import SvEditorToolbar from "@/uni_modules/sv-editor/components/sv-editor/sv-editor-toolbar.vue";
import {
addImage,
addVideo,
addText,
} from "@/uni_modules/sv-editor/components/common/utils.js";
const isLock = ref(false);
const isFlag = ref(false);
const delId = ref("");
const showModal = ref(false);
const delType = ref("delDraft"); //delDraft saveDraft
const showCase = ref(false);
const caseValue1 = ref("");
const caseValue2 = ref("");
const caseValue3 = ref("");
const level = ref(1);
const labelObj = reactive({
list1: [],
list2: [],
list3: [],
});
const form = reactive({
exchange_title: "",
exchange_content: "",
exchange_summary: "",
case_exchange_vote: {},
case_exchange_label: [],
});
const voteData = reactive({
vote_title: "",
valid_day: 7,
case_exchange_vote_option: [
{
option_value: "",
},
],
});
const value = ref("");
const showVote = ref(false);
const showDraft = ref(false);
const showTitle = ref(false);
const draftList = ref([]);
const imgList = ref([]);
const videoList = ref([]);
const editorCtx = ref(null);
const editorCtxResult = ref(null);
const isFocusInfo = ref(true);
const isFocusResult = ref(false);
const labelList = ref([]);
const goBack = () => {
uni.navigateBack({
delta: 1,
});
};
const closeCase = () => {
showCase.value = false;
};
const addOption = () => {
voteData.case_exchange_vote_option.push({
option_value: "",
});
};
const delOption = (index) => {
voteData.case_exchange_vote_option.splice(index, 1);
};
const changeDay = (type) => {
if (type === "minus") {
if (voteData.valid_day <= 1) return;
voteData.valid_day--;
} else if (type === "plus") {
voteData.valid_day++;
}
};
const clearVote = () => {
voteData.vote_title = "";
voteData.case_exchange_vote_option = [
{
option_value: "",
},
];
voteData.valid_day = 7;
form.case_exchange_vote.vote_title = "";
form.case_exchange_vote.case_exchange_vote_option = [
{
option_value: "",
},
];
form.case_exchange_vote.valid_day = 7;
};
const saveVote = () => {
console.log(voteData);
if (voteData.vote_title == "") {
uni.showToast({
title: "请输入投票标题",
icon: "none",
});
return false;
}
if (voteData.vote_title.length > 20) {
uni.showToast({
title: "投票标题不能超过20个字符",
icon: "none",
});
return false;
}
if (voteData.case_exchange_vote_option.length == 0) {
uni.showToast({
title: "请添加投票选项",
icon: "none",
});
return false;
}
for (let i = 0; i < voteData.case_exchange_vote_option.length; i++) {
if (voteData.case_exchange_vote_option[i].option_value == "") {
uni.showToast({
title: "投票选项不能为空",
icon: "none",
});
return false;
}
if (voteData.case_exchange_vote_option[i].option_value.length > 16) {
uni.showToast({
title: "" + (i + 1) + "个投票选项超过16个字符",
icon: "none",
});
return false;
}
}
if (voteData.case_exchange_vote_option.length < 2) {
uni.showToast({
title: "至少添加两个选项",
icon: "none",
});
return false;
}
Object.assign(form.case_exchange_vote, voteData);
showVote.value = false;
};
const fromatDay = (value) => {
var date = new Date();
var year = date.getFullYear();
let Y = dayjs().format("YYYY");
if (year == Y) {
return dayjs(value).format("MM-DD");
} else {
return dayjs(value).format("YYYY-MM-DD");
}
};
const ready = (e) => {
editorCtx.value = e;
let html =
"<br/><p>患者信息</p><br/><p>主诉</p><br/><p>现病史及既往史</p><br/><p>检查</p><br/><p>临床诊断</p><br/><p>治疗经过及结果</p><br/>";
editorCtx.value.initHtml(html);
};
const readyResult = (e) => {
editorCtxResult.value = e;
};
const clearMuBan = () => {
console.log("清空模板");
editorCtx.value.initHtml("");
};
const focusInfo = () => {
isFocusInfo.value = true;
};
const blurInfo = () => {
isFocusInfo.value = false;
};
const focusResult = () => {
isFocusResult.value = true;
};
const blurResult = () => {
isFocusResult.value = false;
};
const closeVote = () => {
showVote.value = false;
};
const openVote = () => {
showVote.value = true;
};
const closeDraft = () => {
showDraft.value = false;
};
const openDraft = () => {
showDraft.value = true;
};
const closeTitle = () => {
showTitle.value = false;
};
const openTitle = () => {
showTitle.value = true;
};
const alertTitle = () => {
if (isFocusInfo.value) {
showTitle.value = true;
}
};
const pFun = (files) => {
uni.showLoading({
title: "正在上传图片...",
mask: true,
});
let promiseFun = [];
for (let i = 0; i < files.length; i++) {
promiseFun.push(handleUpload(files[i]));
}
Promise.all(promiseFun).then((res) => {
uni.hideLoading();
// setTimeout(()=>{
// console.log(imgList.value.length)
// addImage(imgList.value)
// })
});
};
const saveDraft = async () => {
if (isLock.value) return false;
isLock.value = true;
const res = await editorCtx.value.getLastContent();
form.exchange_content = res.html;
const resResult = await editorCtx.value.getLastContent();
form.exchange_summary = resResult.html;
if(labelList.value.length>0){
form.case_exchange_label = labelList.value;
}
api.saveDraft(form).then((res) => {
isLock.value = false;
uni.showToast({
title: "保存成功",
icon: "none",
});
getDraftList();
});
};
const editDraft = (index) => {
let draft = draftList.value[index];
let {
exchange_content,
exchange_title,
exchange_label,
exchange_summary,
exchange_vote,
} = draft;
editorCtx.value.initHtml(exchange_content);
form.exchange_content = exchange_content;
form.exchange_title = exchange_title;
form.case_exchange_label = exchange_label;
labelList.value = exchange_label;
form.exchange_summary = exchange_summary;
form.case_exchange_vote = exchange_vote;
editorCtxResult.value.initHtml(exchange_content);
Object.assign(voteData, draft);
showDraft.value = false;
};
const willDelDraft = (id) => {
delId.value = id;
delType.value = "delDraft";
showModal.value = true;
};
const confirmDel = () => {
showModal.value = false;
if (delType.value == "delDraft") {
delDraft(delId.value);
} else if (delType.value == "saveDraft") {
saveDraft();
}
};
const cancelDel = () => {
showModal.value = false;
if (delType.value == "saveDraft") {
goBack();
}
};
const delDraft = (id) => {
api.delDraft(id).then((res) => {
uni.showToast({
title: "删除成功",
icon: "none",
});
});
getDraftList();
};
const alertSave = async () => {
const res = await editorCtx.value.getLastContent();
//let html = editorCtx.value.exportHtml(res.html);
//const initInfo= "<br/><p>患者信息</p><br/><p>主诉</p><br/><p>现病史及既往史</p><br/><p>检查</p><br/><p>临床诊断</p><br/><p>治疗经过及结果</p><br/>";
const resContent = await editorCtxResult.value.getLastContent();
//let reshtml = editorCtxResult.value.exportHtml(resContent.html);
if (
form.exchange_title ||
res.html ||
resContent.html ||
(form.case_exchange_vote &&
form.case_exchange_vote.vote_title &&
form.case_exchange_label &&
form.case_exchange_label.length > 0)
) {
delType.value = "saveDraft";
showModal.value = true;
} else {
goBack();
}
};
const publish = async () => {
const initInfo =
"<br/><p>患者信息</p><br/><p>主诉</p><br/><p>现病史及既往史</p><br/><p>检查</p><br/><p>临床诊断</p><br/><p>治疗经过及结果</p><br/>";
if (form.exchange_title == "") {
uni.showToast({
title: "请输入标题",
icon: "none",
});
return false;
}
const res = await editorCtx.value.getLastContent();
let html = editorCtx.value.exportHtml(res.html);
if (html == initInfo) {
uni.showToast({
title: "请编辑病例信息",
icon: "none",
});
return false;
}
if (!(form.case_exchange_vote && form.case_exchange_vote.vote_title)) {
delete form.case_exchange_vote;
}
if (
!form.case_exchange_label ||
(form.case_exchange_label && form.case_exchange_label.length == 0)
) {
delete form.case_exchange_label;
}
form.case_exchange_label = labelList.value;
if (isLock.value) return false;
isFlag.value = true;
form.exchange_content = html;
const resContent = await editorCtxResult.value.getLastContent();
let reshtml = editorCtxResult.value.exportHtml(resContent.html);
form.exchange_summary = reshtml;
api.addExchange(form).then((res) => {
uni.showToast({
title: "发布成功",
icon: "none",
duration: 2000,
});
isFlag.value = false;
});
};
const handleUpload = (file) => {
api
.getOss({
scene: 1,
})
.then((rep) => {
let result = rep.data;
if (result.code == 200) {
let { access_id, dir, policy, signature, host } = result.data;
let time = dayjs().format("YYYYMMDDHHmmss");
let random = generateRandomNumber();
let filename = time + random;
let imgType = "." + getImageFormat(file);
return new Promise((resolve, reject) => {
uni.uploadFile({
url: host, // 仅为示例,非真实的接口地址
filePath: file,
name: "file",
formData: {
OSSAccessKeyId: access_id,
policy,
key: dir + time + random + imgType,
signature,
},
success(res) {
if (res.statusCode === 204) {
let url = host + "/" + dir + filename + imgType;
imgList.value.push(url);
addImage([url]);
}
},
fail: (err) => {
console.log(err);
},
});
});
}
});
};
const insertWord = (word) => {
addText(word);
showTitle.value = false;
};
const insertAllWord = () => {
let word = [
"患者信息",
"主诉",
"现病史及既往史",
"检查",
"临床诊断",
"治疗经过及结果",
];
word.forEach((item) => {
addText(item);
});
showTitle.value = false;
};
const generateRandomNumber = () => {
let randomNumber = Math.floor(1000 + Math.random() * 9000);
return randomNumber;
};
const getImageFormat = (imageUrl) => {
console.log(imageUrl);
const lastDotIndex = imageUrl.lastIndexOf(".");
if (lastDotIndex !== -1) {
return imageUrl.substring(lastDotIndex + 1);
}
return "unknown";
};
const insertImage = (file) => {
if (!(!isFocusInfo.value && !isFocusResult.value)) {
uni.chooseImage({
count: 9, //默认9
sizeType: ["original", "compressed"], //可以指定是原图还是压缩图,默认二者都有
sourceType: ["album"], //从相册选择
extension: [".jpg", ".png", ".jpeg"],
success: function (res) {
pFun(res.tempFilePaths);
},
});
}
};
const insertVideo = (file) => {
if (!(!isFocusInfo.value && !isFocusResult.value)) {
uni.chooseVideo({
count: 5, //默认9//可以指定是原图还是压缩图,默认二者都有
sourceType: ["album"], //从相册选择
extension: [".mp4", ".webm", ".ogg"],
success: function (res) {
console.log(res.tempFilePath);
HandleAddVideo(res.tempFilePath);
//pFun([res.tempFilePath], "video");
},
});
}
};
const HandleAddVideo = async (file) => {
uni.showLoading({
title: "正在上传视频...",
mask: true,
});
const videos = await addVideo(async (editorCtx) => {
return new Promise((resolve) => {
api
.getOss({
scene: 1,
})
.then((rep) => {
let result = rep.data;
if (result.code == 200) {
let { access_id, dir, policy, signature, host } = result.data;
let time = dayjs().format("YYYYMMDDHHmmss");
let random = generateRandomNumber();
let filename = time + random;
let imgType = "." + getImageFormat(file);
return new Promise((res, reject) => {
uni.uploadFile({
url: host, // 仅为示例,非真实的接口地址
filePath: file,
name: "file",
formData: {
OSSAccessKeyId: access_id,
policy,
key: dir + time + random + imgType,
signature,
},
async success(res) {
if (res.statusCode === 204) {
let url = host + "/" + dir + filename + imgType;
console.log(editorCtx);
let imgUrl =
"https://cn.bing.com//th?id=OHR.FlamingosNamibia_ZH-CN3639748956_1920x1080.jpg";
const fileThumbnail = await editorCtx.createCoverThumbnail(
imgUrl
);
resolve([
{
videoUrl: url,
videoImg: fileThumbnail,
},
]);
}
},
fail: (err) => {
console.log(err);
},
});
});
}
});
});
});
if (videos) {
uni.showLoading();
uni.showToast({ title: "添加视频成功", icon: "success" });
} else {
uni.showToast({ title: "添加视频失败", icon: "error" });
}
};
const getDraftList = () => {
api.getDraftList().then((res) => {
draftList.value = res.data.data.data;
});
};
const getCaseLabel = (lev,pid=0) => {
api.getCaseLabel({
pid:pid
}).then((res) => {
if (lev == 1) {
labelObj.list1 = res.data.data;
} else if (lev == 2) {
labelObj.list2 = res.data.data;
} else if (lev == 3) {
labelObj.list3 = res.data.data;
}
level.value = lev;
});
};
const confirmCase = () => {
if (level.value == 1 && caseValue1.value == "") {
uni.showToast({ title: "请选择疾病", icon: "none" });
return false;
}
if (level.value == 2 && caseValue2.value == "") {
uni.showToast({ title: "请选择疾病", icon: "none" });
return false;
}
if (level.value == 3 && caseValue3.value == "") {
uni.showToast({ title: "请选择疾病", icon: "none" });
return false;
}
showCase.value = false;
if(level.value == 1){
let label = labelObj.list1.find((item) => item.app_iden == caseValue1.value);
console.log(label);
labelList.value.push({
app_iden:label.app_iden,
label_name:label.label_name,
});
}
if(level.value == 2 ){
let label = labelObj.list2.find((item) => item.app_iden == caseValue2.value);
labelList.value.push({
app_iden:label.app_iden,
label_name:label.label_name,
});
}
if(level.value == 3 ){
let label = labelObj.list3.find((item) => item.app_iden == caseValue3.value);
labelList.value.push({
app_iden:label.app_iden,
label_name:label.label_name,
});
}
//去重
labelList.value=labelList.value.filter((item, index) => labelList.value.findIndex(i => i.app_iden === item.app_iden) === index);
caseValue1.value = "";
caseValue2.value = "";
caseValue3.value = "";
};
const continueCase = () => {
if (level.value == 1 && caseValue1.value == "") {
uni.showToast({ title: "请选择疾病", icon: "none" });
return false;
}
if (level.value == 2 && caseValue2.value == "") {
uni.showToast({ title: "请选择疾病", icon: "none" });
return false;
}
if (level.value == 3 && caseValue3.value == "") {
uni.showToast({ title: "请选择疾病", icon: "none" });
return false;
}
if(level.value == 1 ){
getCaseLabel(2,caseValue1.value);
}else if(level.value == 2 ){
getCaseLabel(3,caseValue2.value);
}
};
const delLabel = (index) => {
labelList.value.splice(index, 1);
};
const openLabelPop=()=>{
showCase.value=true;
getCaseLabel(1,0);
}
onLoad(() => {
getDraftList();
});
// const previewImg = () => {
// uni.previewImage({
// current: "https://example.com/image1.jpg",
// urls: ["https://example.com/image1.jpg", "https://example.com/image2.jpg"],
// });
// };
</script>
<style lang='scss' scoped>
.casepop{
display: flex;
flex-direction: column;
max-height: calc(100vh - 400rpx);
.continue{
color: #2878ff !important;
}
}
.casecon {
flex:1;
overflow-y: scroll;
padding-top: 10rpx;
min-height: 350rpx;
.column {
padding: 0 30rpx;
border-bottom: 2rpx solid #e5e7eb;
}
}
.navbox {
padding-bottom: 20rpx;
background-color: #f9fafb;
position: relative;
height: 200rpx;
background: radial-gradient(
60% 90% at 4% 2%,
#43c9c3 0%,
rgba(255, 255, 255, 0) 100%
);
.bg {
z-index: 0;
top: 0;
bottom: 0;
width: 100%;
position: absolute;
background: radial-gradient(
43% 90% at 84% 6%,
#ffd6c9 0%,
rgba(255, 255, 255, 0) 100%
);
}
.namebox {
padding-top: 102rpx;
justify-content: center;
margin: 0rpx 30rpx 0rpx;
position: relative;
display: flex;
.back {
position: absolute;
left: 0;
}
.name {
margin-left: 16rpx;
font-size: 30rpx;
color: #111827;
}
}
.search {
margin: 40rpx 30rpx 0rpx;
display: flex;
align-items: center;
justify-content: space-between;
.searchwrap {
display: flex;
align-items: center;
flex: 1;
padding-left: 28rpx;
margin-right: 23rpx;
height: 80rpx;
background: #fbfbfb;
box-shadow: 0px 4rpx 10rpx 0px rgba(153, 153, 153, 0.5);
border-radius: 40rpx;
.ipt {
margin-left: 15rpx;
font-size: 28rpx;
}
}
}
}
.zanboxpop {
display: flex;
align-items: center;
justify-content: center;
height: 100%;
.zanwraper {
width: 630rpx;
margin: 0 auto;
padding-bottom: 50rpx;
background: #f5f6f9;
border-radius: 16rpx;
.title {
margin-top: 48rpx;
text-align: center;
font-weight: 500;
font-size: 36rpx;
color: rgba(0, 0, 0, 0.85);
}
.content {
padding: 30rpx 0;
background: #f5f6f9;
text-align: center;
}
.count {
margin-top: 24rpx;
display: flex;
align-items: center;
text-align: center;
justify-content: center;
font-weight: 400;
font-size: 28rpx;
color: rgba(0, 0, 0, 0.65);
.num {
color: #ff0000;
font-size: 32rpx;
}
.earn {
font-size: 32rpx;
color: #3cc7c0;
}
}
.countbox {
display: flex;
width: 100%;
margin: 30rpx 0px 40rpx;
padding: 0 40rpx;
justify-content: center;
box-sizing: border-box;
.minus {
flex-shrink: 0;
margin-left: 10rp;
width: 90rpx;
height: 90rpx;
font-size: 60rpx;
color: #333;
display: flex;
justify-content: center;
align-items: center;
background: #ffffff;
border-radius: 12rpx;
border: 2rpx solid #e9e9e9;
}
.add {
flex-shrink: 0;
width: 90rpx;
margin-left: 10rpx;
height: 90rpx;
font-size: 60rpx;
color: #333;
display: flex;
justify-content: center;
align-items: center;
color: #fff;
background: #3cc7c0;
border-radius: 12rpx;
border: 2rpx solid #3cc7c0;
}
:deep(.u-input__content__field-wrapper__field) {
height: 60rpx;
font-size: 34rpx !important;
text-align: center !important;
}
:deep(.u-input) {
background: #f2f2f2;
width: 200rpx !important;
flex: none;
}
:deep(.u-input--radius) {
border-radius: 24rrpx;
}
}
.btnbox {
margin: 0px 40rpx 0px;
display: flex;
justify-content: space-between;
.cancle {
color: rgba(0, 0, 0, 0.3);
width: 256rpx;
height: 88rpx;
background: #f5f6f9;
border-radius: 25px;
border: 2rpx solid rgba(0, 0, 0, 0.15);
font-weight: 500;
font-size: 32rpx;
color: rgba(0, 0, 0, 0.85);
display: flex;
justify-content: center;
align-items: center;
}
.ok {
color: #fff;
width: 256rpx;
height: 88rpx;
background: #3cc7c0;
border-radius: 25px;
border: 2rpx solid #3cc7c0;
font-weight: 500;
font-size: 32rpx;
display: flex;
justify-content: center;
align-items: center;
}
}
}
}
.titlepop {
.top {
display: flex;
align-items: center;
justify-content: flex-end;
margin: 0 30rpx;
margin-bottom: 30rpx;
font-size: 30rpx;
color: #3cc7c0;
}
.con {
padding-bottom: 50rpx;
}
.cellbox {
margin: 20rpx 30rpx;
display: flex;
justify-content: space-between;
.cell {
width: 200rpx;
height: 60rpx;
border-radius: 25rpx;
display: flex;
justify-content: center;
align-items: center;
background: #e5e7eb;
font-size: 24rpx;
}
}
}
#editor {
padding: 0 30rpx;
height: calc(100vh - 600rpx);
}
#editorRes {
min-height: 300rpx;
:deep(.sv-editor-wrapper) {
flex: 1;
min-height: 300rpx;
}
}
.myVideo {
width: 100%;
border-radius: 15rpx;
}
.imgbox {
margin: 0 30rpx 30rpx;
position: relative;
.close {
position: absolute;
top: 0rpx;
right: 0;
z-index: 9999;
}
.imgunit {
width: 150rpx;
height: 150rpx;
position: relative;
.close {
position: absolute;
top: 0rpx;
right: 0;
}
}
}
.draftpop {
.titlebox {
text-align: center;
padding: 30rpx;
font-size: 31rpx;
color: #111827;
position: relative;
.close {
position: absolute;
top: 20rpx;
right: 30rpx;
}
}
.draftlist {
height: calc(100vh - 500rpx);
overflow-y: scroll;
.cell {
padding-bottom: 34rpx;
border-bottom: 2rpx solid #e5e7eb;
.title {
margin: 15rpx 30rpx 0;
font-size: 36rpx;
color: #111827;
line-height: 46rpx;
}
.smalltitle {
margin: 4px 0rpx 0;
font-size: 30rpx;
color: #666666;
line-height: 38rpx;
}
.con {
font-size: 30rpx;
color: #666666;
line-height: 38rpx;
font-size: 30rpx;
color: #666666;
line-height: 38rpx;
}
.deal {
margin: 36rpx 30rpx 0;
display: flex;
justify-content: space-between;
align-items: center;
.time {
font-size: 26rpx;
color: #9ca3af;
}
.right {
display: flex;
align-items: center;
}
.del {
width: 138rpx;
height: 62rpx;
background: #f3f4f6;
display: flex;
border-radius: 20rpx;
align-items: center;
font-size: 27rpx;
color: #4b5563;
justify-content: center;
}
.edit {
margin-left: 23rpx;
display: flex;
align-items: center;
justify-content: center;
width: 192rpx;
height: 62rpx;
font-size: 27rpx;
color: #ffffff;
background: #3cc7c0;
border-radius: 20rpx;
}
}
}
}
}
.expire {
margin-top: 46rpx;
padding: 0 30rpx;
display: flex;
align-items: center;
justify-content: space-between;
.name {
font-size: 31rpx;
color: #111827;
}
.right {
display: flex;
align-items: center;
.day {
min-width: 50rpx;
text-align: center;
}
.minus {
width: 62rpx;
height: 62rpx;
display: flex;
align-items: center;
justify-content: center;
background: #f5f5f5;
border-radius: 50%;
font-size: 50rpx;
}
.plus {
display: flex;
align-items: center;
font-size: 50rpx;
justify-content: center;
width: 62rpx;
height: 62rpx;
background: #f5f5f5;
border-radius: 50%;
}
}
}
.row {
padding: 0 30rpx;
margin-bottom: 23rpx;
:deep(.u-input) {
background: #f5f5f5;
}
:deep(.u-input--radius) {
border-radius: 15rpx;
}
:deep(.u-input__content__field-wrapper__field) {
height: 92rpx;
}
}
.first {
margin-bottom: 47rpx;
}
.votepop {
.confirm {
margin: 39rpx 30rpx 0;
height: 92rpx;
background: #3cc7c0;
border-radius: 15rpx;
display: flex;
align-items: center;
font-size: 31rpx;
color: #ffffff;
justify-content: center;
}
.del {
margin: 30rpx 30rpx 30rpx;
height: 92rpx;
background: #fff;
border-radius: 15rpx;
font-size: 31rpx;
color: #666666;
display: flex;
align-items: center;
justify-content: center;
}
.tips {
margin-top: 30rpx;
font-size: 27rpx;
color: #9ca3af;
line-height: 38rpx;
padding: 0 30rpx;
}
.add {
margin: 0 30rpx;
display: flex;
align-items: center;
height: 92rpx;
justify-content: center;
background: #f5f5f5;
border-radius: 15rpx;
font-size: 31rpx;
color: #4b5563;
.desc {
margin-left: 10rpx;
}
}
.titlebox {
padding: 0 30rpx;
height: 86rpx;
display: flex;
align-items: center;
justify-content: space-between;
border-bottom: 2rpx solid #f3f4f6;
.left {
font-size: 31rpx;
color: #4b5563;
}
.right {
font-size: 31rpx;
color: #3cc7c0;
}
}
.votecon {
max-height: calc(100vh - 530rpx);
overflow-y: scroll;
.row {
display: flex;
align-items: center;
.iconbox {
margin-left: 15rpx;
align-items: center;
}
}
.titlebox {
border: none;
margin: 30rpx 0 20rpx;
.title {
font-size: 31rpx;
color: #111827;
}
.desc {
font-size: 27rpx;
color: #9ca3af;
}
}
}
}
.upage {
display: flex;
flex-direction: column;
height: 100vh;
:deep(.u-image) {
background: transparent !important;
}
}
.toolbox {
border-top: 2rpx solid #f3f4f6;
padding: 22rpx 30rpx;
display: flex;
align-items: center;
.cell {
margin-right: 20rpx;
display: flex;
align-items: center;
.name {
font-size: 25rpx;
margin-left: 4rpx;
color: #4b5563;
}
}
.cell.active {
opacity: 0.65;
}
}
.bottom {
position: fixed;
bottom: 0;
width: 100%;
z-index: 3;
background: #ffffff;
.bottombtn {
display: flex;
align-items: center;
border-top: 2rpx solid #e5e7eb;
height: 133rpx;
}
.right {
margin-right: 30rpx;
flex: 1;
margin-left: 32rpx;
height: 86rpx;
background: #3cc7c0;
border-radius: 23rpx;
display: flex;
align-items: center;
justify-content: center;
font-size: 31rpx;
color: #ffffff;
}
.left {
margin-left: 30rpx;
display: flex;
.draft {
width: 162rpx;
height: 86rpx;
background: rgba(0, 0, 0, 0);
border-radius: 16rpx;
border: 2rpx solid #e5e7eb;
display: flex;
align-items: center;
justify-content: center;
}
.vote {
margin-left: 25rpx;
width: 162rpx;
height: 86rpx;
background: rgba(0, 0, 0, 0);
border-radius: 16rpx;
border: 2rpx solid #e5e7eb;
display: flex;
align-items: center;
justify-content: center;
}
}
}
.form {
height: calc(100vh - 133rpx);
margin: -20rpx 0rpx 134rpx;
padding-bottom: 80rpx;
overflow-y: scroll;
.sickbox {
display: flex;
padding: 25rpx 25rpx 0;
margin-bottom: 20rpx;
}
.add {
display: flex;
font-size: 26rpx;
justify-content: center;
align-items: center;
color: #3cc7c0;
margin-left: 18rpx;
}
.sick {
position: relative;
padding: 0 60rpx 0 30rpx;
height: 60rpx;
display: flex;
justify-content: center;
align-items: center;
background: #f9f9f9;
border-radius: 40rpx;
font-size: 25rpx;
color: #3cc7c0;
.del {
position: absolute;
right: 12rpx;
}
}
.textcon {
border-bottom: 2rpx solid #f3f4f6;
}
.textbox {
padding: 0 30rpx;
border-bottom: 2rpx solid #f3f4f6;
:deep(.u-textarea__field) {
min-height: 55rpx !important;
}
}
.textcell {
padding: 0 30rpx;
margin-top: 25rpx;
.titlebox {
display: flex;
align-items: center;
justify-content: space-between;
}
}
.row {
padding: 30rpx 30rpx 0;
display: flex;
justify-content: space-between;
align-items: center;
.left {
font-size: 38rpx;
color: #000000;
.tip {
color: #9ca3af;
font-size: 32rpx;
}
}
.right {
display: flex;
align-items: center;
color: #6b7280;
font-size: 31rpx;
}
}
}
</style>