Skip to content

V
vue-composition-api
Commit d0c20200 by 唐玉峰
Options

兼容问题

parent f46cb409
Showing with 30 additions and 2307 deletions
src/components/medicalRecordHomepage/index.vue
......@@ -679,11 +679,7 @@
<el-row>
<el-table :data="ops" border :header-cell-class-name="headerRowStyle">
<el-table-column prop="opS_CODE" label="手术及操作编码"></el-table-column>
<el-table-column prop="opS_TIME" label="手术及操作日期">
<template #default="scope">
{{ scope.row.opS_TIME ? transformTimestamp(scope.row.opS_TIME) : "" }}
</template>
</el-table-column>
<el-table-column prop="opS_TIME" label="手术及操作日期"> </el-table-column>
<el-table-column prop="opS_LEVEL" label="手术级别"></el-table-column>
<el-table-column prop="opS_NAME" label="手术及操作名称"></el-table-column>
<el-table-column label="手术及操作医师">
......
src/router/index.js
......@@ -12,8 +12,6 @@ import { getItem, clear } from "@/utils/auth";
import outseeQualityControl from "@/views/outseeQualityControl.vue";
import outpatientDetails from "@/views/outpatientDetails.vue";
import outHistorygrouping from "@/views/outHistorygrouping.vue";
import outClinicalpathway from "@/views/outClinicalpathway.vue";
import Entrypath from "@/views/Entrypath.vue";
Vue.use(Router);
// const baseUrl = '/his/'
......@@ -43,18 +41,6 @@ const router = new Router({
name: "outHistorygrouping",
component: outHistorygrouping,
},
//进入路径
{
path: "/Entrypath",
name: "Entrypath",
component: Entrypath,
},
//临床路径外放页面
{
path: "/outClinicalpathway",
name: "outClinicalpathway",
component: outClinicalpathway,
},
//临床路径外放页面
{
......
src/utils/http.js
......@@ -6,17 +6,16 @@ import "element-ui/lib/theme-chalk/index.css";
import { getItem } from "@/utils/auth";
axios.defaults.timeout = 120000;
// 响应时间
axios.defaults.timeout = 300 * 1000;
axios.defaults.retry = 1;
axios.defaults.retryDelay = 1000;
axios.defaults.headers.post["Content-Type"] = "application/json;charset=utf-8";
var domain = "/api/api";
function createHeader() {
const token = getItem("svToken");
return token ? { Authorization: `Bearer ${token}` } : {};
}
function errorMsg(d) {
console.log(d.response);
if (d.response.status == "401") {
......@@ -40,7 +39,6 @@ function errorMsg(d) {
}
}
let loadingInstance;
let loadingOption = {
//加载loading
fullscreen: true,
......@@ -48,6 +46,19 @@ let loadingOption = {
spinner: "el-icon-loading",
background: "rgba(0, 0, 0, 0.5)",
};
axios.interceptors.request.use(
(config) => {
// 每次发送请求之前判断vuex中是否存在token
// 如果存在，则统一在http请求的header都加上token，这样后台根据token判断你的登录情况
// 即使本地存在token，也有可能token是过期的，所以在响应拦截器中要对返回状态进行判断
const token = getItem("svToken") || undefined;
token && (config.headers.Authorization = `Bearer ${token}`);
return config;
},
(error) => {
return Promise.error(error);
}
);
axios.interceptors.response.use(
(response) => {
if (response.status === 200) {
......@@ -67,12 +78,11 @@ axios.interceptors.response.use(
);
export default {
post(url, params, option) {
post(url, params) {
loadingInstance = Vue.prototype.$loading(loadingOption);
return new Promise((resolve, reject) => {
axios
.post(domain + url, params, { ...{ headers: createHeader() }, ...option })
.post(domain + url, params)
.then((res) => {
if (res.status !== 200) {
errorMsg(res.data);
......@@ -92,35 +102,12 @@ export default {
});
});
},
//医院的接口数据用
postFn(url, params, option) {
loadingInstance = Vue.prototype.$loading(loadingOption);
return new Promise((resolve, reject) => {
axios
.post(url, params, { ...{ headers: createHeader() }, ...option })
.then((res) => {
console.log(res);
if (res.status !== 200) {
errorMsg(res.data);
reject(res.data);
return;
}
loadingInstance.close();
resolve(res.data);
})
.catch((error) => {
loadingInstance.close();
errorMsg(error);
reject(error);
});
});
},
get(url, option) {
loadingInstance = Vue.prototype.$loading(loadingOption);
return new Promise((resolve, reject) => {
axios
.get(domain + url, { ...{ headers: createHeader() }, ...option })
.get(domain + url, option)
.then((res) => {
if (res.status !== 200) {
errorMsg(res.data);
......
src/views/Entrypath.vue deleted 100644 → 0
<!--
* @Author: wsq
* @Date: 2022-04-22 15:20:58
* @LastEditors: wsq
* @LastEditTime: 2023-02-06 10:17:50
* @Description:
-->
<template>
<!-- 进入路径外放页面 -->
<div class="Entrypath">
<div class="Entrypath_top">
<div class="Entrypath_top_left">
<!-- <span style="color:#f0f0f0;"><img src="../assets/img/peo.png" alt="" /></span> -->
<div class="Entrypath_top_left_t1">
患者姓名:<span>{{ topdata.patientName }}</span>
</div>
<div class="Entrypath_top_left_t2">
住院号:<span>{{ topdata.regCode }}</span>
</div>
<div class="Entrypath_top_left_t3">
住院次数:<span>{{ topdata.inHosNum }}</span>
</div>
</div>
<div class="Entrypath_top_right">
<el-button style="background-color: #0283bb; color: #ffff" size="mini" @click="okbtn()">确定进入路径</el-button>
</div>
</div>
<div class="Entrypath_table">
<!-- 左侧表格开始 -->
<div class="Entrypath_table_lefttab">
<div class="Entrypath_table_lefttab_select">
<div class="Entrypath_table_lefttab_select_inp">
<span>检索路径：</span>
<el-input v-model="pathinput" size="mini" clearable />
</div>
<div class="Entrypath_table_lefttab_select_chack">
<el-button
style="background-color: #ffff; color: #91cbcd; margin-right: 10px; border: 1px solid #91cbcd"
plain
size="mini"
@click="selectbtn()"
>查询</el-button
>
<el-checkbox v-model="checked" label="只显示推荐路径" size="large" @change="checkchange" />
</div>
</div>
<div class="Entrypath_table_lefttab_table">
<el-table ref="leftTable" :data="LefttableData" border height="100%" stripe @row-click="rowclick" :highlight-current-row="true">
<el-table-column type="index" />
<el-table-column show-overflow-tooltip property="clinical_route_name" label="路径名称" />
</el-table>
</div>
</div>
<!-- 左侧表格结束 -->
<!-- 右侧表格开始 -->
<div class="Entrypath_table_righttab">
<!-- 第一个表格 -->
<div class="Entrypath_table_righttab_one">
<el-table
ref="leftTable"
scrollbar-always-on
height="100%"
:data="OnetableData"
border
stripe
:header-cell-style="{ background: '#0184bc', color: '#ffff' }"
>
<el-table-column show-overflow-tooltip property="code" label="诊断编码" />
<el-table-column show-overflow-tooltip property="name" label="诊断名称" />
</el-table>
</div>
<!-- 第二个表格 -->
<div class="Entrypath_table_righttab_two">
<el-table
ref="leftTable"
border
:data="TwotableData"
scrollbar-always-on
height="100%"
stripe
:header-cell-style="{ background: '#0184bc', color: '#ffff' }"
>
<el-table-column show-overflow-tooltip property="code" label="手术编码" />
<el-table-column show-overflow-tooltip property="name" label="手术名称" />
</el-table>
</div>
<!-- 第三个表格 -->
<div class="Entrypath_table_righttab_tree">
<el-table
ref="leftTable"
border
:data="TreetableData"
scrollbar-always-on
height="100%"
stripe
:header-cell-style="{ background: '#0184bc', color: '#ffff' }"
>
<el-table-column show-overflow-tooltip property="describe" label="进入路径标准" />
</el-table>
</div>
</div>
<!-- 右侧表格结束 -->
</div>
</div>
</template>
<script>
import http from "../utils/http";
import { reactive, toRefs, onMounted, nextTick, computed, ref } from "@vue/composition-api";
import { decimal } from "../utils/decimal";
import { img } from "../assets/img/zu.png";
import { Message, MessageBox } from "element-ui";
import { useRoute, useRouter } from "../utils/useVueRouter";
import { setItem, getItem } from "../utils/auth";
import { Loading } from "element-ui";
export default {
name: "Entrypath",
setup() {
//表格自适应高度
const route = useRoute();
const router = useRouter();
let state = reactive({
//输入框
pathinput: "",
//选择框
checked: false,
//标识
IsRoute: "",
//患者信息
topdata: {
patientName: "", //患者姓名
regCode: "", // 住院号
inHosNum: "", // 住院次数
inHosTime: "", // 入院时间
},
iscid: 0, //是否有背景颜色
//左侧表格数据
LefttableData: [],
//右侧第一个表格
OnetableData: [],
//右侧第二个表格
TwotableData: [],
//第三个表格
TreetableData: [],
});
// loading效果
const loadingOption1 = {
// 加载loading
fullscreen: true,
text: "正在加载...",
spinner: "el-icon-loading",
background: "rgba(0, 0, 0, 0.5)",
};
//获取标识
const getIsRoute = () => {
http.post(`/ClinicalRoute/ClinicalRoute/IsRoute?pid=${route.value.query.pid}`, {})
.then((data) => {
state.IsRoute = data;
})
.catch((error) => {});
};
//获取患者信息
const gettopdata = () => {
http.post(`/ClinicalRoute/ClinicalRoute/GetPatientInfo?pid=${route.value.query.pid}`, {})
.then((data) => {
state.topdata = data;
//如果标识为false 跳转到临床路径外放页面
if (state.IsRoute == false) {
router.push({
path: "outClinicalpathway",
query: {
pid: route.value.query.pid,
},
});
}
})
.catch((error) => {});
};
//显示推荐路径单选框变化
const checkchange = (val) => {
state.checked = val;
};
//查询
const selectbtn = () => {
getLeftdata();
};
//获取左侧表格数据
const getLeftdata = () => {
http.post(`/ClinicalRoute/ClinicalRoute/GetPatientRoutes?pid=${route.value.query.pid}&searchQuery=${state.pathinput}&flag=${state.checked}`, {})
.then((data) => {
state.LefttableData = data;
})
.catch((error) => {});
};
//点击左侧表格数据
const rowclick = (row) => {
state.iscid = row.id;
var loadingInstance1 = Loading.service(loadingOption1);
//获取右侧数据
http.post(`/ClinicalRoute/ClinicalRoute/GetCRRuleDescribe?crid=${row.id}`, {})
.then((data) => {
state.OnetableData = data.diagInfo; //诊断信息
state.TwotableData = data.opsInfo;
state.TreetableData = data.staCRStandards;
loadingInstance1.close();
})
.catch((error) => {
loadingInstance1.close();
});
};
//点击进入路径按钮
const okbtn = () => {
MessageBox.confirm(
"确定进入路径吗?",
{
confirmButtonText: "确定",
cancelButtonText: "取消",
type: "warning",
}
)
.then(() => {
if (state.iscid == 0) {
Message({
message: "请先选择路径名称！",
type: "warning",
});
} else if (state.iscid != 0) {
http.post(`/ClinicalRoute/ClinicalRoute/CreatePatientRoute?pid=${route.value.query.pid}&crid=${state.iscid}`, {})
.then((data) => {
Message({
message: "成功",
type: "success",
});
router.push({
path: "outClinicalpathway",
query: {
pid: route.value.query.pid,
},
});
})
.catch((error) => {});
}
})
.catch(() => {
Message({
type: "info",
message: "取消",
});
});
};
onMounted(async () => {
getIsRoute();
await gettopdata();
getLeftdata();
});
return {
...toRefs(state),
gettopdata,
decimal,
getIsRoute,
getLeftdata,
rowclick,
okbtn,
checkchange,
selectbtn,
};
},
};
</script>
<style lang="scss" scoped>
@import "../styles/mixin.scss";
@import "../styles/media/components/Entrypath.scss";
// @import "../styles/media/components/outClinicalpathway.scss";
// 点击文本颜色
::v-deep .current-row {
color: #ffff !important;
}
// 左侧表格点击高亮背景色
::v-deep .el-table__body tr.current-row > td {
background-color: #32a0d3 !important;
}
//多选框选中状态文本颜色
::v-deep .el-checkbox__input.is-checked + .el-checkbox__label {
color: black !important;
}
//多选框选中状态背景颜色
::v-deep .el-checkbox__input.is-checked .el-checkbox__inner {
background-color: #1097e0 !important;
border-color: #1097e0 !important;
}
//输入框高亮颜色
::v-deep .el-input__inner {
background-color: #f3fbfe;
border: 1px solid #91cbcd;
}
// 滚动条的宽度
::v-deep .el-table__body-wrapper::-webkit-scrollbar {
/*滚动条整体样式*/
width: 10px;
/*高宽分别对应横竖滚动条的尺寸*/
height: 10px;
background-color: #ffff;
}
// 滚动条的滑块
::v-deep .el-table__body-wrapper::-webkit-scrollbar-thumb {
background-color: #27aae2;
border: 3px solid transparent;
border-radius: 9px;
background-clip: content-box;
}
::v-deep .el-table__body-wrapper::-webkit-scrollbar-track {
/*滚动条里面轨道*/
border-radius: 20px;
background: #ffff;
width: 10px;
}
.Entrypath {
height: 900px;
background-color: #f0f0f0;
overflow: hidden;
position: relative;
&_top {
width: 100%;
height: 10%;
background-color: #ffff;
display: flex;
align-items: center;
margin-bottom: 5px;
&_left {
width: 80%;
height: 50%;
background-color: #0283b9;
margin-bottom: 10px;
display: flex;
align-items: center;
justify-content: space-between;
span {
width: 2%;
height: 100%;
font-size: 14px;
display: flex;
justify-content: center;
align-items: center;
}
&_t1 {
width: 30%;
height: 80%;
margin-left: 10px;
margin-right: 5px;
background-color: #ffff;
display: flex;
align-items: center;
color: #acacac;
font-weight: 400;
padding-left: 20px;
span {
width: 80%;
color: #181617;
display: flex;
justify-content: flex-start;
align-items: center;
}
}
&_t2 {
width: 30%;
height: 80%;
margin-right: 5px;
background-color: #ffff;
display: flex;
align-items: center;
color: #acacac;
font-weight: 400;
padding-left: 20px;
span {
width: 80%;
color: #181617;
display: flex;
justify-content: flex-start;
align-items: center;
}
}
&_t3 {
width: 30%;
height: 80%;
margin-right: 5px;
background-color: #ffff;
margin-right: 10px;
display: flex;
align-items: center;
color: #acacac;
font-weight: 400;
padding-left: 20px;
span {
width: 80%;
color: #181617;
display: flex;
justify-content: flex-start;
align-items: center;
}
}
}
&_right {
width: 20%;
height: 50%;
display: flex;
align-items: center;
justify-content: center;
}
}
&_table {
width: 100%;
height: 89%;
display: flex;
background-color: #ffff;
&_lefttab {
width: 30%;
height: 100%;
margin-right: 2%;
&_select {
width: 100%;
height: 10%;
margin-bottom: 5px;
display: flex;
align-items: center;
&_inp {
width: 50%;
height: 60%;
display: flex;
align-items: center;
span {
font-size: 14px;
width: 40%;
}
}
&_chack {
width: 50%;
height: 60%;
display: flex;
justify-content: flex-end;
align-items: center;
}
}
&_table {
width: 100%;
height: 89%;
}
}
&_righttab {
width: 67%;
height: 100%;
display: flex;
flex-direction: column;
justify-content: space-evenly;
&_one {
width: 100%;
height: 30%;
}
&_two {
width: 100%;
height: 30%;
}
&_tree {
width: 100%;
height: 30%;
}
}
}
}
</style>
src/views/outClinicalpathway.vue deleted 100644 → 0
<!--
* @Author: wsq
* @Date: 2022-04-22 15:20:58
* @LastEditors: wsq
* @LastEditTime: 2023-03-02 20:36:22
* @Description:
-->
<template>
<!-- 临床路径外放页面 -->
<div class="outClinicalpathway">
<!-- 患者信息 -->
<div class="outClinicalpathway_top">
<div class="outClinicalpathway_top_bg"></div>
<div class="outClinicalpathway_top_coent">
<!--患者信息 -->
<div class="outClinicalpathway_top_coent_left">
<div class="outClinicalpathway_top_coent_left_one">
<span><img src="../assets/img/peo.png" alt="" /></span>
<div class="outClinicalpathway_top_coent_left_one_t1">
患者姓名:<span>{{ topdata.patientName }}</span>
</div>
<div class="outClinicalpathway_top_coent_left_one_t2">
住院号:<span>{{ topdata.regCode }}</span>
</div>
<div class="outClinicalpathway_top_coent_left_one_t3">
住院次数:<span>{{ topdata.inHosNum }}</span>
</div>
<div class="outClinicalpathway_top_coent_left_one_t4">
符合临床路径:<span>{{ topdata.clinical_route_name }}</span>
</div>
</div>
</div>
<div class="outClinicalpathway_top_coent_right">
<div class="outClinicalpathway_top_coent_right_btn">
<el-button icon="el-icon-user" style="background-color: #0283bb; color: #ffff" @click="joinorder()">保存医嘱</el-button>
<el-button icon="el-icon-s-tools" style="background-color: #0283bb; color: #ffff" @click="variation()">病情变异</el-button>
</div>
</div>
</div>
<div class="outClinicalpathway_top_time">
<el-timeline style="display: flex; width: 25%; padding: 0 10px">
<el-timeline-item
:class="timeindex == activity.inhosdays ? 'outClinicalpathway_top_time_timespan' : 'outClinicalpathway_top_time_timespan2'"
v-for="(activity, index) in activities"
:key="index"
:type="activity.type"
:color="activity.color"
:size="activity.size"
:hollow="activity.hollow"
:timestamp="activity.timestamp"
>
<span @click="timeclick(activity)">{{ activity.inhosdays }}</span>
</el-timeline-item>
</el-timeline>
</div>
</div>
<!--病情变异弹框开始 -->
<el-dialog :visible.sync="editdialogFormVisible" width="30%" @close="close">
<el-form ref="fromRef" :model="form" :label-position="labelPosition" label-width="100px">
<el-form-item label="路径天数:">
<!-- <el-input v-model="form.inhosdays" /> -->
<el-select v-model="form.inhosdays" class="m-2" placeholder="请选择" size="mini">
<el-option v-for="item in options" :key="item.inhosdays" :label="item.inhosdays" :value="item.inhosdays" />
</el-select>
</el-form-item>
<el-form-item label="变异原因:">
<el-select v-model="form.reason" class="m-2" placeholder="请选择" size="mini" :title="getTitle(form.reason)">
<el-option v-for="item in reasonoptions" :key="item.id" :label="item.describe" :value="item.describe" :title="item.describe">
</el-option>
</el-select>
</el-form-item>
<el-form-item label="备注:">
<el-input v-model="form.remarks" :autosize="{ minRows: 4, maxRows: 10 }" type="textarea" />
</el-form-item>
</el-form>
<template #footer>
<span class="dialog-footer">
<el-button size="mini" @click="close()">取消</el-button>
<el-button size="mini" type="primary" @click="fromOKbtn()">确定 </el-button>
</span>
</template>
</el-dialog>
<!--病情变异弹框结束 -->
<!-- 表格 -->
<div class="outClinicalpathway_table">
<!-- 表格 -->
<div class="outClinicalpathway_table_right">
<div class="outClinicalpathway_table_right_radio">
<el-radio-group :value="radio" @input="radiochange">
<el-radio :label="1">长期医嘱</el-radio>
<el-radio :label="2">临时医嘱</el-radio>
</el-radio-group>
</div>
<el-table
ref="multipleTable"
row-key="id"
:data="tableData"
height="100%"
style="width: 100%"
:tree-props="{ children: 'children', hasChildren: 'hasChildren' }"
:select-on-indeterminate="true"
@selection-change="SelectionChange"
@select-all="selectAll"
@select="select"
default-expand-all
size="mini"
:row-class-name="rowClass"
>
<el-table-column type="selection" :selectable="selectEnable" width="50" />
<el-table-column show-overflow-tooltip property="advice_name" label="路径名称" width="130" />
<el-table-column show-overflow-tooltip property="tickTime" label="当前时间" width="145">
<template #default="scope">
<span v-if="scope.row.advice_name == null && scope.row.ischeck == 1">{{ scope.row.tickTime }}</span>
</template>
</el-table-column>
<el-table-column show-overflow-tooltip property="orderType" label="类型" width="50" />
<el-table-column show-overflow-tooltip property="project_name" label="医院项目名称" width="200" />
<el-table-column show-overflow-tooltip property="specifications" label="规格说明" width="80" />
<el-table-column show-overflow-tooltip property="dosage" label="药品剂型" width="70" />
<el-table-column show-overflow-tooltip property="isAntibiotic" label="抗生素" width="85">
<template #default="scope">
<el-select v-if="scope.row.advice_name == null && scope.row.ischeck == 1" size="mini" v-model="scope.row.isAntibiotic">
<el-option v-for="item in chargeTypeoptions" :key="item.label" :label="item.label" :value="item.label"> </el-option>
</el-select>
<span v-else>{{ scope.row.isAntibiotic }}</span>
</template>
</el-table-column>
<el-table-column show-overflow-tooltip property="medicalPurpose" label="用药目的" width="135">
<template #default="scope">
<el-select v-if="scope.row.advice_name == null && scope.row.ischeck == 1" size="mini" v-model="scope.row.medicalPurpose">
<el-option v-for="item in medicalPurposeoptions" :key="item.id" :label="item.describe" :value="item.describe"> </el-option>
</el-select>
<span v-else>{{ scope.row.medicalPurpose }}</span>
</template>
</el-table-column>
<el-table-column prop="medicUseQuantity" label="用量" width="75">
<template #default="scope">
<el-input
v-if="scope.row.advice_name == null && scope.row.ischeck == 1"
v-model="scope.row.medicUseQuantity"
size="mini"
></el-input>
<span v-else>{{ scope.row.medicUseQuantity }}</span>
</template>
</el-table-column>
<el-table-column show-overflow-tooltip property="medicUseUnit" label="单位" width="50" />
<el-table-column show-overflow-tooltip property="medicUseMode" label="途径" width="110">
<template #default="scope">
<el-select v-if="scope.row.advice_name == null && scope.row.ischeck == 1" size="mini" v-model="scope.row.medicUseMode">
<el-option v-for="item in medicUseModeoptions" :key="item.id" :label="item.describe" :value="item.describe"> </el-option>
</el-select>
<span v-else>{{ scope.row.medicUseMode }}</span>
</template>
</el-table-column>
<el-table-column show-overflow-tooltip property="medicUsePlan" label="频率" width="110">
<template #default="scope">
<el-select v-if="scope.row.advice_name == null && scope.row.ischeck == 1" size="mini" v-model="scope.row.medicUsePlan">
<el-option v-for="item in medicUsePlanoptions" :key="item.id" :label="item.describe" :value="item.describe"> </el-option>
</el-select>
<span v-else>{{ scope.row.medicUsePlan }}</span>
</template>
</el-table-column>
<el-table-column prop="medicQuantity" label="用药总量" width="80">
<template #default="scope">
<el-input v-if="scope.row.advice_name == null && scope.row.ischeck == 1" v-model="scope.row.medicQuantity" size="mini"></el-input>
<span v-else>{{ scope.row.medicQuantity }}</span>
</template>
</el-table-column>
<el-table-column show-overflow-tooltip property="medicUnit" label="单位" width="50" />
<el-table-column show-overflow-tooltip property="remark" label="嘱托" width="150'">
<template #default="scope">
<el-input
v-if="scope.row.advice_name == null && scope.row.ischeck == 1"
v-model="scope.row.remark"
size="mini"
type="textarea"
:autosize="{ minRows: 2 }"
placeholder="请输入内容"
></el-input>
<span v-else>{{ scope.row.remark }}</span>
</template>
</el-table-column>
<el-table-column prop="description" label="诊断描述" width="150">
<template #default="scope">
<!-- <div style="display: flex; height: 100%; flex-direction: column; justify-content: center; align-items: center">
<div style="display: flex">
<span
v-if="scope.row.advice_name == null && scope.row.ischeck == 1 && scope.row.type != 1 && scope.row.isedit"
style="color: red"
>*</span
>
<el-input
size="mini"
validate-event
type="textarea"
:autosize="{ minRows: 2 }"
placeholder="请输入内容"
v-if="scope.row.advice_name == null && scope.row.ischeck == 1 && scope.row.type != 1 && scope.row.isedit"
v-model="scope.row.description"
></el-input>
</div>
<span
style="font-size: 12px; color: red"
v-if="scope.row.advice_name == null && scope.row.ischeck == 1 && scope.row.type != 1 && scope.row.description == ''"
>请输入内容</span
>
</div> -->
<el-form
:model="scope.row"
label-width="15px"
label-position="left"
ref="numberValidateForm"
class="demo-ruleForm"
v-if="scope.row.advice_name == null && scope.row.ischeck == 1 && scope.row.type != 1 && scope.row.isedit"
>
<el-form-item prop="description" :rules="[{ required: true, message: '请输入内容' }]">
<template #label> <span></span></template>
<el-input
v-model="scope.row.description"
autocomplete="off"
placeholder="请输入内容"
type="textarea"
:autosize="{ minRows: 2 }"
></el-input>
</el-form-item>
</el-form>
</template>
</el-table-column>
<el-table-column prop="symptom" label="症状及体征" width="150">
<template #default="scope">
<!-- <div style="display: flex; height: 100%; flex-direction: column; justify-content: center; align-items: center">
<div style="display: flex">
<span
v-if="scope.row.advice_name == null && scope.row.ischeck == 1 && scope.row.type != 1 && scope.row.isedit"
style="color: red"
>*</span
>
<el-input
size="mini"
type="textarea"
:autosize="{ minRows: 2 }"
placeholder="请输入内容"
v-if="scope.row.advice_name == null && scope.row.ischeck == 1 && scope.row.type != 1 && scope.row.isedit"
v-model="scope.row.symptom"
></el-input>
</div>
<span
style="font-size: 12px; color: red"
v-if="scope.row.advice_name == null && scope.row.ischeck == 1 && scope.row.type != 1 && scope.row.symptom == ''"
>请输入内容</span
>
</div> -->
<el-form
:model="scope.row"
label-width="15px"
label-position="left"
ref="numberValidateForm1"
class="demo-ruleForm"
v-if="scope.row.advice_name == null && scope.row.ischeck == 1 && scope.row.type != 1 && scope.row.isedit"
>
<el-form-item prop="symptom" :rules="[{ required: true, message: '请输入内容' }]">
<template #label> <span></span></template>
<el-input
v-model="scope.row.symptom"
autocomplete="off"
placeholder="请输入内容"
type="textarea"
:autosize="{ minRows: 2 }"
></el-input>
</el-form-item>
</el-form>
</template>
</el-table-column>
<el-table-column show-overflow-tooltip property="emergency" label="急诊" width="85">
<template #default="scope">
<el-select
v-if="scope.row.advice_name == null && scope.row.ischeck == 1 && scope.row.isedit"
size="mini"
v-model="scope.row.emergency"
>
<el-option v-for="item in chargeTypeoptions" :key="item.label" :label="item.label" :value="item.value"> </el-option>
</el-select>
<!-- <span v-else>{{ isObj[scope.row.emergency] }}</span> -->
</template>
</el-table-column>
<el-table-column label="操作" width="80">
<template #default="scope">
<el-button
v-if="scope.row.advice_name == null && scope.row.ischeck == 1 && scope.row.type != 1 && scope.row.isedit"
size="mini"
type="primary"
@click="goSeeScore(scope.row, scope.$index, scope)"
>更多</el-button
>
</template>
</el-table-column>
</el-table>
</div>
</div>
<!-- 更多弹框开始 -->
<el-dialog :visible.sync="goSeeScoredialogFormVisible" width="30%">
<el-form ref="goSeefromRef" :model="goSeeform" :label-position="labelPosition" label-width="100px">
<el-form-item label="主诉:">
<el-input v-model="goSeeform.chiefComplaint" :autosize="{ minRows: 2 }" type="textarea" placeholder="请输入内容" />
</el-form-item>
<el-form-item label="检查目的:">
<el-input v-model="goSeeform.inspectionPurpose" :autosize="{ minRows: 2 }" type="textarea" placeholder="请输入内容" />
</el-form-item>
<el-form-item label="既往史:">
<el-input v-model="goSeeform.pastHistory" :autosize="{ minRows: 2 }" type="textarea" placeholder="请输入内容" />
</el-form-item>
<el-form-item label="其他辅助项目:">
<el-input v-model="goSeeform.auxiliaryItems" :autosize="{ minRows: 2 }" type="textarea" placeholder="请输入内容" />
</el-form-item>
<el-form-item label="备注:">
<el-input v-model="goSeeform.inspectRemarks" :autosize="{ minRows: 2 }" type="textarea" placeholder="请输入内容" />
</el-form-item>
</el-form>
<template #footer>
<span class="dialog-footer">
<el-button size="mini" @click="goSeecolse()">取消</el-button>
<el-button size="mini" @click="goSeeok()">确定 </el-button>
</span>
</template>
</el-dialog>
<!-- 更多弹框结束 -->
</div>
</template>
<script>
import http from "../utils/http";
import { reactive, toRefs, onMounted, nextTick, computed, ref } from "@vue/composition-api";
import { decimal } from "../utils/decimal";
import { img } from "../assets/img/zu.png";
import { Message } from "element-ui";
import { useRoute, useRouter } from "../utils/useVueRouter";
import { setItem, getItem } from "../utils/auth";
import { Loading } from "element-ui";
import _ from "lodash";
import { transformTimestampnow } from "../utils/formatTime";
import { format } from "echarts";
import M from "minimatch";
export default {
name: "outClinicalpathway",
setup() {
//表格自适应高度
const route = useRoute();
const router = useRouter();
const fromRef = ref();
const goSeefromRef = ref();
function tableLayout() {
nextTick(() => {
fromRef.value.doLayout();
});
}
const numberValidateForm = ref();
const numberValidateForm1 = ref();
const monthlyPlanTable = ref();
const multipleTable = ref();
const transformTime = computed(() => {
return transformTimestampnow;
});
let state = reactive({
//患者信息
topdata: {
patientName: "", //患者姓名
regCode: "", // 住院号
inHosNum: "", // 住院次数
clinical_route_name: "", // 符合临床路径
},
multipleSelection: [], //被选择的数据
multipleSelection1: [], //被选择的数据
selectArr: [],
tableData: [], //表格数据
yztype: {
1: "长期医嘱",
2: "临时医嘱",
},
isObj: {
0: "否",
1: "是",
},
//被点击的index
timeindex: null,
case_routeid: null, //点击左侧时间线的天数id
inhosdays: null, //点击左侧时间线的天数
//时间线
activities: [],
labelPosition: "right",
editdialogFormVisible: false, //弹框是否显示
//表单
form: {
inhosdays: "",
reason: "", //变异原因
remarks: "", //备注
},
//路径天数下拉数据
options: [],
reasonoptions: [], //变异原因
crid: null,
chickid: [], //选中的id
chargeTypeoptions: [
{
label: "是",
value: 1,
},
{
label: "否",
value: 0,
},
],
tempRow: {}, //储存正在编辑的行
tempRowChildren: [],
medicUseModeoptions: [], //途径
medicUsePlanoptions: [], //频率
medicalPurposeoptions: [], //用药目的
radio: 1,
newtable1: [],
newtable2: [],
objtable: { route1: [], route2: [] },
goSeeScoredialogFormVisible: false, //更多弹框
goSeeform: {},
oldRowObj: {},
goSeeIndex: "",
goSeeIndexPid: "",
distype: 1,
hisUrl: "", //his的接口地址
tempMedicalDrug: {},
tempMedicalcheck: {},
tempMedicalCheckout: {},
longMedical: {},
});
//表格禁用
const selectEnable = (row, rowIndex) => {
if (row.isForbidden == false) {
return false; // 不禁用
} else {
return true; //禁用
}
};
//表格当前行样式
const rowClass = ({ row, index }) => {
if (row.isClass) {
return "rowStyleclass";
} else {
return "";
}
};
//更多
const goSeeScore = (row) => {
console.log("state.tableData", state.tableData);
console.log("row", row);
state.distype = row.type;
state.goSeeScoredialogFormVisible = true;
state.oldRowObj = { ...row };
state.goSeeform = { ...row };
state.tableData.forEach((item, index) => {
let childIndex = item.children.findIndex((v) => v.id == row.id);
if (childIndex !== -1) {
state.goSeeIndexPid = index;
state.goSeeIndex = childIndex;
}
});
};
//更多-取消
const goSeecolse = () => {
state.goSeeform = {};
let childrenList = [...state.tableData[state.goSeeIndexPid].children];
childrenList.splice(state.goSeeIndex, 1, state.oldRowObj);
state.tableData[state.goSeeIndexPid].children = childrenList;
state.goSeeScoredialogFormVisible = false;
toggleSelection(state.oldRowObj, true);
};
//更多--确定
const goSeeok = () => {
let childrenList = [...state.tableData[state.goSeeIndexPid].children];
childrenList.splice(state.goSeeIndex, 1, state.goSeeform);
state.tableData[state.goSeeIndexPid].children = childrenList;
console.log(state.tableData, 999);
state.goSeeScoredialogFormVisible = false;
toggleSelection(state.goSeeform, true);
};
//获取途径，频率的下拉数据
const gemedicUseModeoptions = () => {
http.post(`/ClinicalRoute/ClinicalRoute/GetStaCRParametersByType?type=1`, {})
.then((data) => {
state.medicUseModeoptions = data;
})
.catch((error) => {});
};
//获取频率，频率的下拉数据
const gemedicUsePlanoptions = () => {
http.post(`/ClinicalRoute/ClinicalRoute/GetStaCRParametersByType?type=2`, {})
.then((data) => {
state.medicUsePlanoptions = data;
})
.catch((error) => {});
};
//获取用要目的下拉数据
const getmedicalPurposeoptions = () => {
http.post(`/ClinicalRoute/ClinicalRoute/GetStaCRParametersByType?type=3`, {})
.then((data) => {
state.medicalPurposeoptions = data;
})
.catch((error) => {});
};
//获取患者信息
const gettopdata = () => {
http.post(`/ClinicalRoute/ClinicalRoute/GetPatientInfo?pid=${route.value.query.pid}`, {})
.then((data) => {
state.topdata = data;
state.crid = data.crid;
getreasonoptions();
})
.catch((error) => {});
};
const setChildren = (children, type) => {
// 编辑多个子层级
children.map((j) => {
toggleSelection(j, type);
if (j.children) {
setChildren(j.children, type);
}
});
};
// 选中父节点时，子节点一起选中取消
const select = (selection, row) => {
console.log("row--父节点", row, selection);
console.log(selection.filter((item) => !item.children));
row.tickTime = transformTimestampnow();
// 选中
console.log(
selection.some((el) => {
return row.id === el.id;
})
);
if (
selection.some((el) => {
return row.id === el.id;
})
) {
row.ischeck = 1;
if (row.children) {
console.log(row.children.filter((item) => item.isForbidden));
row.children
.filter((item) => item.isForbidden)
.map((j) => {
j.tickTime = transformTimestampnow();
j.edit = false;
console.log(j.type);
toggleSelection(j, true);
});
}
//取消
} else {
if (row.children) {
row.children.map((p) => {
p.ischeck = 2;
p.isClass = false;
toggleSelection(p, false);
});
} else {
//取消的行数据
row.ischeck = 2;
}
}
};
// 控制选框是否被选中
const toggleSelection = (row, select) => {
if (row) {
nextTick(() => {
multipleTable.value && multipleTable.value.toggleRowSelection(row, select);
});
if (select == true) {
row.ischeck = 1;
} else {
row.ischeck = 2;
row.isClass = false;
}
}
};
// 选择全部
const selectAll = (selection) => {
// tabledata第一层只要有在selection里面就是全选
const isSelect = selection.some((el) => {
const tableDataIds = state.tableData.map((j) => j.id);
return tableDataIds.includes(el.id);
});
// tableDate第一层只要有不在selection里面就是全不选
const isCancel = !state.tableData.every((el) => {
const selectIds = selection.map((j) => j.id);
return selectIds.includes(el.id);
});
if (isSelect) {
selection.map((el) => {
if (el.children) {
el.children
.filter((item) => item.isForbidden)
.map((j) => {
toggleSelection(j, true);
});
}
});
}
if (isCancel) {
state.tableData.map((el) => {
if (el.children) {
el.children.map((j) => {
toggleSelection(j, false);
});
}
});
}
};
//当选择项发生变化时会触发该事件
const SelectionChange = (val) => {
// state.multipleSelection = val;
if (state.radio == 1) {
state.multipleSelection = val.filter((item) => !item.children);
} else {
state.multipleSelection1 = val.filter((item) => !item.children);
}
if (state.multipleSelection.length) {
state.multipleSelection
.filter((item) => item.type != 1)
.map((item, index) => {
index == 0 ? (item.isedit = true) : (item.isedit = false);
});
}
if (state.multipleSelection1.length) {
state.multipleSelection1
.filter((item) => item.type != 1)
.map((item, index) => {
index == 0 ? (item.isedit = true) : (item.isedit = false);
});
}
};
//获取左侧时间线数据
const getlefttime = () => {
http.post(`/ClinicalRoute/ClinicalRoute/GetGetRouteAdvicesLeft?pid=${route.value.query.pid}`, {})
.then((data) => {
state.activities = data;
state.options = data;
if (state.activities.filter((item) => item.flag).length == state.activities.length) {
state.timeindex = state.activities[state.activities.length - 1].inhosdays;
timeclick(state.activities[state.activities.length - 1]);
}
if (state.activities.filter((item) => !item.flag).length == state.activities.length) {
state.timeindex = state.activities[0].inhosdays;
timeclick(state.activities[0]);
} else {
state.timeindex = state.activities.filter((item) => !item.flag)[0].inhosdays;
timeclick(state.activities.filter((item) => !item.flag)[0]);
}
})
.catch((error) => {
console.log(error);
});
};
//获取标识
const getIsRoute = () => {
http.post(`/ClinicalRoute/ClinicalRoute/IsRoute?pid=${route.value.query.pid}`, {})
.then((data) => {
console.log(data);
if (data) {
router.push({
path: "Entrypath",
query: {
pid: route.value.query.pid,
},
});
}
})
.catch((error) => {});
};
const getTableData = () => {
http.post(
`/ClinicalRoute/ClinicalRoute/GetGetRouteAdvicesRight?pid=${route.value.query.pid}&case_routeid=${state.case_routeid}&searchQuery=${state.inhosdays}`,
{}
)
.then((data) => {
state.newtable1 = data.route1;
state.newtable2 = data.route2;
if (state.radio == 1) {
state.tableData = data.route1;
// state.tableData.map((el) => {
// if (el.children) {
// for (let i = 0; i < el.children.length; i++) {
// if (el.children[i].ischeck == 1) {
// toggleSelection(el.children[i], true);
// toggleSelection(el, true);
// }
// }
// }
// });
// state.newtable1 = state.tableData;
} else if (state.radio == 2) {
state.tableData = data.route2;
// state.tableData.map((el) => {
// if (el.children) {
// for (let i = 0; i < el.children.length; i++) {
// if (el.children[i].ischeck == 1) {
// toggleSelection(el.children[i], true);
// toggleSelection(el, true);
// }
// }
// }
// });
// state.newtable2 = state.tableData;
}
})
.catch((error) => {
console.log(error);
});
};
//单选
const radiochange = (e) => {
if (numberValidateForm.value || numberValidateForm1.value) {
numberValidateForm.value.validate((valid) => {
if (valid) {
numberValidateForm1.value.validate((valid) => {
if (valid) {
state.radio = e;
if (state.radio == 1) {
state.tableData = state.newtable1;
state.multipleSelection.map((j) => {
toggleSelection(j, true);
});
} else {
state.tableData = state.newtable2;
state.multipleSelection1.map((p) => {
toggleSelection(p, true);
});
}
} else {
console.log("error submit!!");
return false;
}
});
} else {
console.log("error submit!!");
return false;
}
});
} else {
state.radio = e;
if (state.radio == 1) {
state.tableData = state.newtable1;
state.multipleSelection.map((j) => {
toggleSelection(j, true);
});
} else {
state.tableData = state.newtable2;
state.multipleSelection1.map((p) => {
toggleSelection(p, true);
});
}
}
};
//点击左侧时间线 获取右侧表格数据
const timeclick = (val) => {
state.timeindex = val.inhosdays;
state.case_routeid = val.case_routeid;
state.inhosdays = val.inhosdays;
getTableData();
};
//保存医嘱
const joinorder = () => {
if (state.multipleSelection.length || state.multipleSelection1.length) {
if (numberValidateForm.value || numberValidateForm1.value) {
numberValidateForm.value.validate((valid) => {
if (valid) {
numberValidateForm1.value.validate((valid) => {
if (valid) {
saveSetPatientRoutes();
} else {
console.log("error submit!!");
return false;
}
});
} else {
console.log("error submit!!");
return false;
}
});
} else {
saveSetPatientRoutes();
}
}
};
const saveSetPatientRoutes = () => {
state.objtable.route1 = state.multipleSelection;
state.objtable.route2 = state.multipleSelection1;
http.post(`/ClinicalRoute/ClinicalRoute/SetPatientRoutes?pid=${route.value.query.pid}`, state.objtable)
.then(async (data) => {
// console.log("data.hisUrl", data.hisUrl);
// state.hisUrl = data.hisUrl.split("api/")[2];
state.hisUrl = data.hisUrl;
console.log(state.hisUrl);
// console.log("state.hisUrl", state.hisUrl);
//临时西药
state.tempMedicalDrug = data.tempMedicalDrug;
//临时检查
state.tempMedicalcheck = data.tempMedicalcheck;
//临时检验
state.tempMedicalCheckout = data.tempMedicalCheckout;
//长期西药
state.longMedical = data.longMedical;
await posttempMedicalDrug();
await posttempMedicalcheck();
await posttempMedicalCheckout();
await postlongMedical();
})
.catch((error) => {});
};
// 调用his接口 临时西药
const posttempMedicalDrug = () => {
http.postFn(state.hisUrl, {
method: "tempMedical",
type: 1,
data: state.tempMedicalDrug,
})
.then((res) => {
//重新获取左侧时间线数据
getlefttime();
if (res.code == "0") {
Message({
message: res.msg,
type: "success",
});
} else {
Message({
message: res.msg,
type: "error",
});
}
})
.catch((error) => {
console.log(error);
});
};
// 调用his接口 临时检查
const posttempMedicalcheck = () => {
http.postFn(state.hisUrl, {
method: "tempMedical",
type: 3,
data: state.tempMedicalcheck,
})
.then((res) => {
if (res.code == "0") {
Message({
message: res.msg,
type: "success",
});
} else {
Message({
message: res.msg,
type: "error",
});
}
})
.catch((error) => {});
};
// 调用his接口 临时检验
const posttempMedicalCheckout = () => {
http.postFn(state.hisUrl, {
method: "tempMedical",
type: 4,
data: state.tempMedicalCheckout,
})
.then((res) => {
if (res.code == "0") {
Message({
message: res.msg,
type: "success",
});
} else {
Message({
message: res.msg,
type: "error",
});
}
})
.catch((error) => {});
};
// 调用his接口 长期西药
const postlongMedical = () => {
http.postFn(state.hisUrl, {
method: "longMedical",
type: 1,
data: state.longMedical,
})
.then((res) => {
if (res.code == "0") {
Message({
message: res.msg,
type: "success",
});
} else {
Message({
message: res.msg,
type: "error",
});
}
})
.catch((error) => {});
};
//获取病情变异--变异原因下拉框
const getreasonoptions = () => {
http.post(`/ClinicalRoute/ClinicalRoute/GetStandardByType?crid=${state.crid}`, {})
.then((data) => {
state.reasonoptions = data;
})
.catch((error) => {});
};
//病情变异
const variation = () => {
state.editdialogFormVisible = true;
};
//确定
const fromOKbtn = (fromRef) => {
let prome = {
pid: route.value.query.pid,
reason: state.form.reason,
inhosdays: state.form.inhosdays,
remarks: state.form.remarks,
};
http.post(`/ClinicalRoute/ClinicalRoute/SetVariation`, prome)
.then((data) => {
Message({
message: data.message,
type: "success",
});
(state.form = {
inhosdays: "",
reason: "",
}),
(state.editdialogFormVisible = false);
router.push({
path: "Entrypath",
query: {
pid: route.value.query.pid,
},
});
})
.catch((error) => {});
};
//取消
const close = () => {
(state.form = {
inhosdays: "",
reason: "",
}),
(state.editdialogFormVisible = false);
};
//下拉框鼠标移上显示提示文字
const getTitle = (val) => {
if (val != "") {
let a = state.reasonoptions.filter((item) => item.describe == val);
return a[0].describe;
}
};
onMounted(() => {
getIsRoute();
gettopdata();
getlefttime();
gemedicUseModeoptions();
gemedicUsePlanoptions();
getmedicalPurposeoptions();
});
return {
...toRefs(state),
decimal,
monthlyPlanTable,
multipleTable,
SelectionChange,
gettopdata,
getlefttime,
timeclick,
setChildren,
select,
toggleSelection,
selectAll,
variation,
fromOKbtn,
fromRef,
numberValidateForm,
numberValidateForm1,
close,
joinorder,
getreasonoptions,
getTitle,
confirm,
tableLayout,
gemedicUseModeoptions,
gemedicUsePlanoptions,
radiochange,
getmedicalPurposeoptions,
transformTime,
goSeeok,
goSeeScore,
goSeefromRef,
goSeecolse,
selectEnable,
rowClass,
};
},
};
</script>
<style lang="scss" scoped>
@import "../styles/mixin.scss";
@import "../styles/media/components/outClinicalpathway.scss";
//选中当前行样式
::v-deep .rowStyleclass {
font-weight: 700;
background-color: #f5f7fa;
}
//时间线样式
::v-deep .el-timeline-item__tail {
left: 0 !important;
height: 0 !important;
}
::v-deep .el-timeline-item {
padding-bottom: 5px !important;
display: flex !important;
align-items: end !important;
}
::v-deep .el-timeline-item__wrapper {
padding-left: 29px !important;
margin-right: 30px !important;
top: 3px !important;
display: flex !important;
align-items: end !important;
}
::v-deep .el-timeline-item__node--normal {
margin-left: 15px !important;
}
//单选框
::v-deep .el-radio__input.is-checked .el-radio__inner {
background-color: #0085ba !important;
border-color: #1097e0 !important;
}
::v-deep .el-radio__input.is-checked + .el-radio__label {
color: #0085ba !important;
}
//多选框选中状态背景颜色
::v-deep .el-checkbox__input.is-checked .el-checkbox__inner {
background-color: #0085ba !important;
border-color: #1097e0 !important;
}
::v-deep .el-table--scrollable-x .el-table__body-wrapper {
height: 688px !important ;
overflow-y: auto !important;
}
// 滚动条的宽度
::v-deep .el-table__body-wrapper::-webkit-scrollbar {
/*滚动条整体样式*/
width: 10px;
/*高宽分别对应横竖滚动条的尺寸*/
height: 10px;
background-color: #ffff;
}
// 滚动条的滑块
::v-deep .el-table__body-wrapper::-webkit-scrollbar-thumb {
background-color: #27aae2;
border: 3px solid transparent;
border-radius: 9px;
background-clip: content-box;
}
::v-deep .el-table__body-wrapper::-webkit-scrollbar-track {
/*滚动条里面轨道*/
border-radius: 20px;
background: #ffff;
width: 10px;
}
.outClinicalpathway {
// height: calc(100% - 50px);
// background-color: white;
// padding: 20px;
// position: relative;
// overflow: hidden;
height: 900px;
background-color: #f0f0f0;
// padding: 10px;
overflow: hidden;
position: relative;
&_top {
width: 100%;
height: 12%;
margin-bottom: 5px;
background-color: #f0f0f0;
display: flex;
flex-direction: column;
&_bg {
width: 100%;
height: 15%;
background-color: #0283bb;
}
&_coent {
width: 100%;
height: 50%;
background-color: #ffff;
display: flex;
margin-bottom: 5px;
&_left {
height: 100%;
width: 100%;
display: flex;
justify-content: center;
align-items: center;
&_one {
width: 98%;
height: 80%;
background-color: #f2fafd;
margin-bottom: 10px;
display: flex;
align-items: center;
justify-content: space-between;
margin-top: 10px;
span {
width: 3%;
height: 100%;
font-size: 14px;
display: flex;
justify-content: center;
align-items: center;
}
&_t1 {
width: 24%;
height: 80%;
margin-right: 5px;
background-color: #ffff;
display: flex;
align-items: center;
color: #acacac;
font-weight: 400;
padding-left: 20px;
margin-left: 10px;
span {
width: 80%;
height: 80%;
color: #181617;
display: flex;
justify-content: flex-start;
align-items: center;
}
}
&_t2 {
width: 24%;
height: 80%;
margin-right: 5px;
background-color: #ffff;
display: flex;
align-items: center;
color: #acacac;
font-weight: 400;
padding-left: 20px;
span {
width: 80%;
height: 80%;
color: #181617;
display: flex;
justify-content: flex-start;
align-items: center;
}
}
&_t3 {
width: 24%;
height: 80%;
margin-right: 5px;
background-color: #ffff;
margin-right: 10px;
display: flex;
align-items: center;
color: #acacac;
font-weight: 400;
padding-left: 20px;
span {
width: 80%;
height: 80%;
color: #181617;
display: flex;
justify-content: flex-start;
align-items: center;
}
}
&_t4 {
width: 24%;
height: 80%;
background-color: #ffff;
margin-right: 5px;
display: flex;
align-items: center;
color: #acacac;
font-weight: 400;
padding-left: 20px;
span {
width: 60%;
height: 80%;
color: #181617;
display: flex;
justify-content: flex-start;
align-items: center;
}
}
}
}
&_right {
height: 100%;
width: 20%;
display: flex;
align-items: center;
justify-content: center;
&_btn {
height: 50%;
width: 100%;
display: flex;
align-items: center;
justify-content: center;
}
}
}
&_time {
width: 100%;
height: 35%;
background: #ffff;
padding-left: 20px;
display: flex;
align-items: center;
&_timespan {
width: 100%;
height: 20px;
display: flex;
background-color: #0283bb;
border-radius: 20px;
margin-right: 10px;
span {
color: #ffff;
}
}
&_timespan2 {
width: 100%;
height: 20px;
display: flex;
}
}
}
&_table {
height: 84%;
width: 100%;
display: flex;
&_right {
width: 100%;
height: 100%;
&_radio {
width: 100%;
height: 8%;
background: #ffff;
display: flex;
align-items: center;
padding-left: 10px;
}
}
}
/* .el-form-item {
margin: 0;
} */
}
</style>
src/views/outHistorygrouping.vue
......@@ -743,6 +743,8 @@ export default {
// initEcharts(categoryChart11("其他", this.addCorePercents[i].otherPercent, "#C05EF3"), `indexChart11file${i}`);
// (this.diagList = []), (this.opsList = []);
// }
this.diagList = [];
this.opsList = [];
})
.catch((error) => {});
},
......
src/views/outaddrecordEnrollment.vue deleted 100644 → 0
<template>
<el-dialog center :visible.sync="addrecordEnrollmentShow" :fullscreen="true">
<!-- 病案分组 -->
<div class="outaddrecordEnrollment" id="outaddrecordEnrollment">
<div class="outaddrecordEnrollment_search">
<div class="outaddrecordEnrollment_search_message">
<div class="outaddrecordEnrollment_search_message_left">
<div class="outaddrecordEnrollment_search_message_left_t1">
<span class="iconfont icon-tingzhenqi"> </span
><span class="outaddrecordEnrollment_search_message_lef_t1_span2">主诊断名称或诊断编码:</span>
</div>
<el-autocomplete
class="outaddrecordEnrollment_search_message_left_t2"
v-model.trim="outaddsearchForm.diagName"
:trigger-on-focus="true"
placeholder="请输入预计DRG支付费用"
clearable
:fetch-suggestions="addquerySearchGroup"
select-when-unmatched="true"
@clear="addclear"
@select="addsearch"
>
</el-autocomplete>
</div>
<div class="outaddrecordEnrollment_search_message_centert">
<div class="outaddrecordEnrollment_search_message_centert_t1">
<span class="iconfont icon-jiandaosvg"> </span
><span class="outaddrecordEnrollment_search_message_centert_t1_span2">主手术名称或操作编码：</span>
</div>
<el-autocomplete
class="outaddrecordEnrollment_search_message_centert_t2"
v-model.trim="outaddsearchForm.opsName"
clearable
:trigger-on-focus="true"
placeholder="请输入主手术名称或操作编码"
select-when-unmatched="true"
:fetch-suggestions="addquerySearchGroup2"
@select="addsearch"
>
</el-autocomplete>
</div>
<div class="outaddrecordEnrollment_search_message_right" @click="addsearch">
<span class="iconfont icon-sousuo_o"></span>
<span class="outaddrecordEnrollment_search_message_right_span2">查询</span>
</div>
</div>
</div>
<div class="outaddrecordEnrollment_centent">
<div class="outaddrecordEnrollment_centent_totalnum" v-for="(item, index) in addCorePercents" :key="index">
<div class="outaddrecordEnrollment_centent_totalnum_left">
<div class="outaddrecordEnrollment_centent_totalnum_left_text1">
<span>分组编码：{{ item.code }}</span>
<span>分组名称：{{ item.coreName }}</span>
<span>基准点数：{{ item.score }}</span>
</div>
<div class="outaddrecordEnrollment_centent_totalnum_left_text3">
<span>预计DRG支付费用：{{ item.unitfee }}</span
><span>院内历年平均费用：{{ item.avgFee }}</span
><span>院内历年平均住院天数：{{ item.avgInHosDay }}</span>
</div>
</div>
<div class="outaddrecordEnrollment_centent_totalnum_right">
<div :id="`indexChart11` + index" class="outaddrecordEnrollment_centent_totalnum_right_echar1"></div>
<div :id="`indexChart11two` + index" class="outaddrecordEnrollment_centent_totalnum_right_echar2"></div>
<div :id="`indexChart11tree` + index" class="outaddrecordEnrollment_centent_totalnum_right_echar3"></div>
<div :id="`indexChart11fore` + index" class="outaddrecordEnrollment_centent_totalnum_right_echar4"></div>
<div :id="`indexChart11file` + index" class="outaddrecordEnrollment_centent_totalnum_right_echar5"></div>
</div>
</div>
<!-- 如果没有数据时的样式 -->
<div v-show="addnodataShow" class="outaddrecordEnrollment_centent_nodata">
<div class="outaddrecordEnrollment_centent_nodata_img">
<img src="../assets/img/nodata.png" alt="" />
</div>
<div class="outaddrecordEnrollment_centent_nodata_text">请输入要搜索的内容</div>
</div>
<div v-show="addnolistShow" class="outaddrecordEnrollment_centent_nodata">
<div class="outaddrecordEnrollment_centent_nodata_img">
<img src="../assets/img/nodata.png" alt="" />
</div>
<div class="outaddrecordEnrollment_centent_nodata_text">暂无数据</div>
</div>
</div>
<div class="outaddrecordEnrollment_pagination"></div>
</div>
</el-dialog>
</template>
<script lang="ts">
import { getItem, setItem, clear } from "../utils/auth";
import http from "../utils/http";
import { reactive, toRefs, onMounted, nextTick, computed } from "@vue/composition-api";
import { decimal } from "../utils/decimal";
import { initEcharts, categoryChart11 } from "../utils/echarts";
export default {
props: {
dialogVisible: Boolean, //弹出层是否显示
},
setup() {
const state = reactive({
outaddsearchForm: {
diagName: "",
opsName: "",
},
addCorePercents: [],
addnodataShow: true, //没有搜索时显示
addnolistShow: false, //没有搜索数据的时候显示
addgroupList: [], //主诊断
addgroupArr: [],
addgroupList2: [], //主手术
addgroupArr2: [],
});
//获取主诊断模糊数据
function addgroupListMe() {
http.post(`/medical/get/GetDiagOpss?diagName=${state.outaddsearchForm.diagName}&type=${1}`, {})
.then((data) => {
state.addgroupList = data;
for (let item of state.addgroupList) {
state.addgroupArr.push({
value: item.name,
});
}
})
.catch((error) => {});
}
function addquerySearchGroup(queryString, cb) {
if (state.outaddsearchForm.diagName.length > 0) {
addgroupListMe();
}
state.addgroupArr = [];
cb(state.addgroupArr);
}
//清空输入框的值时触发
const addclear = () => {
state.addCorePercents = [];
state.addnodataShow = true;
};
//获取主手术模糊数据
function addgroupListMe2() {
http.post(`/medical/get/GetDiagOpss?diagName=${state.outaddsearchForm.opsName}&type=${2}`, {})
.then((data) => {
state.addgroupList2 = data;
for (let item of state.addgroupList2) {
state.addgroupArr2.push({
value: item.name,
});
}
})
.catch((error) => {});
}
function addquerySearchGroup2(queryString, cb) {
if (state.outaddsearchForm.opsName.length > 0) {
addgroupListMe2();
}
state.addgroupArr2 = [];
cb(state.addgroupArr2);
}
//获取列表数据
const addgetlist = () => {
http.post(`/medical/get/GetaddCorePercents`, {
// PageNumber:state.currentPage,
diagName: state.outaddsearchForm.diagName,
opsName: state.outaddsearchForm.opsName,
// pageSize:state.pageSize,
})
.then((data) => {
state.addCorePercents = data.list;
if (state.addCorePercents.length == 0) {
state.addnolistShow = true;
state.addnodataShow = false;
}
// state.totalCount = data.totalCount;
for (var i = 0; i < state.addCorePercents.length; i++) {
initEcharts(categoryChart11("药占比", state.addCorePercents[i].drugPercent, "#2CABE3"), `indexChart11${i}`);
initEcharts(categoryChart11("耗材占比", state.addCorePercents[i].materialsPercent, "#71D875"), `indexChart11two${i}`);
initEcharts(categoryChart11("检查占比", state.addCorePercents[i].inspectPercent, "#F35E77"), `indexChart11tree${i}`);
initEcharts(categoryChart11("检验占比", state.addCorePercents[i].testPercent, "#FFB321"), `indexChart11fore${i}`);
initEcharts(categoryChart11("其他", state.addCorePercents[i].otherPercent, "#C05EF3"), `indexChart11file${i}`);
}
})
.catch((error) => {});
};
//查询
const addsearch = () => {
state.addCorePercents = [];
addgetlist();
if (state.outaddsearchForm.diagName) {
state.addnodataShow = false;
state.addnolistShow = false;
} else {
state.addnodataShow = true;
state.addnolistShow = false;
}
};
onMounted(() => {
if (state.outaddsearchForm.diagName.length > 0) {
addgetlist();
}
});
return {
...toRefs(state),
decimal,
addsearch,
addgetlist,
addquerySearchGroup,
addgroupListMe,
addquerySearchGroup2,
addgroupListMe2,
addclear,
};
},
};
</script>
<style lang="scss">
@import "styles/mixin.scss";
.outaddrecordEnrollment {
height: calc(100% - 50px);
background-color: white;
padding: 20px;
overflow: hidden;
position: relative;
&_search {
// margin-bottom: 20px;
height: 6%;
margin-bottom: 20px;
&_message {
display: flex;
justify-content: space-between;
align-items: center;
&_left {
display: flex;
justify-content: space-between;
align-items: center;
background-color: #f3fafd;
font-family: PingFang SC;
width: 43%;
height: 51px;
&_t1 {
display: flex;
justify-content: space-between;
align-items: center;
width: 30%;
font-size: 15px;
font-family: PingFang SC;
font-weight: 400;
color: #2cabe3;
.iconfont {
color: #2cabe3;
padding-left: 29px;
font-size: 23px;
}
}
&_t2 {
width: 70%;
border-radius: 1px solid white;
.el-input__inner {
width: 98%;
height: 42px;
line-height: 42px;
font-size: 16px;
border: none;
}
}
}
&_centert {
display: flex;
justify-content: space-between;
align-items: center;
background-color: #f3fafd;
font-family: PingFang SC;
width: 43%;
height: 51px;
&_t1 {
display: flex;
justify-content: space-between;
align-items: center;
width: 30%;
font-size: 15px;
font-family: PingFang SC;
font-weight: 400;
color: #2cabe3;
.iconfont {
color: #2cabe3;
padding-left: 25px;
font-size: 23px;
}
}
&_t2 {
width: 70%;
border-radius: 1px solid white;
.el-input__inner {
width: 98%;
height: 42px;
line-height: 42px;
font-size: 16px;
border: none;
}
}
}
&_right {
width: 136px;
height: 37px;
background: #2cabe3;
border-radius: 4px;
display: flex;
align-items: center;
justify-content: center;
&_span2 {
font-size: 15px;
font-family: PingFang SC;
font-weight: 400;
color: #fefefe;
}
span {
margin-right: 5px;
}
.iconfont {
color: white;
font-size: 19px;
}
}
}
}
&_centent {
background-color: #f1f5f8;
height: 70vh;
overflow-y: auto;
&_totalnum {
height: 151px;
background-color: #fff;
margin: 12px;
display: flex;
align-items: center;
justify-content: space-around;
&_left {
flex: 1;
width: 50%;
height: 132px;
background-color: rgba(44, 171, 227, 0.08);
margin: 0 15px;
display: flex;
flex-direction: column;
align-items: center;
justify-content: center;
&_text1 {
width: 100%;
height: 30%;
display: flex;
margin-top: 5px;
margin-bottom: 10px;
justify-content: space-between;
span {
height: 100%;
width: 50%;
margin: 5px 10px;
background-color: #fff;
display: flex;
justify-content: start;
align-items: center;
font-size: 14px;
padding-left: 10px;
font-family: PingFang SC;
font-weight: 300;
color: #6a707e;
}
}
&_text2 {
width: 100%;
height: 30%;
display: flex;
justify-content: space-between;
span {
height: 100%;
width: 50%;
margin: 5px 10px;
background-color: #fff;
display: flex;
justify-content: start;
align-items: center;
font-size: 14px;
padding-left: 10px;
font-family: PingFang SC;
font-weight: 300;
color: #6a707e;
}
}
&_text3 {
margin-bottom: 10px;
width: 100%;
height: 30%;
margin-top: 10px;
display: flex;
justify-content: space-between;
span {
height: 100%;
width: 50%;
margin: 5px 10px;
background-color: #fff;
display: flex;
justify-content: start;
align-items: center;
font-size: 14px;
padding-left: 10px;
font-family: PingFang SC;
font-weight: 300;
color: #6a707e;
}
}
}
&_right {
width: 50%;
height: 132px;
display: flex;
justify-content: space-around;
&_echar1 {
width: 20%;
height: 132px;
}
&_echar2 {
width: 20%;
height: 132px;
}
&_echar3 {
width: 20%;
height: 132px;
}
&_echar4 {
width: 20%;
height: 132px;
}
&_echar5 {
width: 20%;
height: 132px;
}
}
}
// 没有数据
&_nodata {
width: 100%;
height: 100%;
display: flex;
flex-direction: column;
justify-content: center;
align-items: center;
&_img {
img {
width: 115px;
height: 102px;
}
}
&_text {
font-size: 18px;
font-family: PingFang SC;
font-weight: 400;
color: #abafb3;
}
}
}
}
</style>
src/views/outpatientDetails.vue
......@@ -716,6 +716,8 @@ export default {
// initEcharts(categoryChart11("其他", this.addCorePercents[i].otherPercent, "#C05EF3"), `indexChart11file${i}`);
// (this.diagList = []), (this.opsList = []);
// }
this.diagList = [];
this.opsList = [];
})
.catch((error) => {});
},
......
src/views/outpatientDetails_pingguo.vue
......@@ -716,6 +716,8 @@ export default {
// initEcharts(categoryChart11("其他", this.addCorePercents[i].otherPercent, "#C05EF3"), `indexChart11file${i}`);
// (this.diagList = []), (this.opsList = []);
// }
this.diagList = [];
this.opsList = [];
})
.catch((error) => {});
},
......
vue.config.js
......@@ -15,6 +15,9 @@ module.exports = {
publicPath: "./", //导出路径
assetsDir: "web", //静态资源文件夹
productionSourceMap: false,
configureWebpack: {
devtool: "source-map",
},
devServer: {
//测试环境代理
port: 8066, //测试端口
......
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment