Skip to content

V
vue-composition-api
Commit a31be710 by wangshuangqing
Options

完成添加弹层

parent c34cb78f
Showing with 1173 additions and 113 deletions
src/utils/http.js
......@@ -32,7 +32,7 @@ function errorMsg(d) {
if (d.response) {
// 请求已发出，但服务器响应的状态码不在 2xx 范围内
console.log(d.response.data.message);
console.log(d.response);
}
......@@ -79,7 +79,7 @@ export default {
return new Promise((resolve, reject) => {
axios
.post(domain + url, params, { ...{ headers: createHeader() }, ...option })
.post(domain + url, params, {... { headers: createHeader() }, ...option })
.then((res) => {
if (res.status !== 200) {
errorMsg(res.data);
......@@ -104,7 +104,7 @@ export default {
loadingInstance = Vue.prototype.$loading(loadingOption);
return new Promise((resolve, reject) => {
axios
.get(domain + url, { ...{ headers: createHeader() }, ...option })
.get(domain + url, {... { headers: createHeader() }, ...option })
.then((res) => {
if (res.status !== 200) {
errorMsg(res.data);
......
src/views/outHistorygrouping.vue
......@@ -9,12 +9,14 @@
<!-- 智能分组 -->
<div class="outsetgrouping" id="setGroupingbox">
<div class="outsetgrouping_button">
<!-- <el-button class="outsetgrouping_button_GoBackbtn" size="mini" @click="goback">
<span class="iconfont icon-daochu"></span> <span class="s2">返回</span>
</el-button> -->
<el-button class="outsetgrouping_button_Searchbtn" type="primary" size="mini" @click="gosear">
<span class="s2">疾病分组查询</span>
</el-button>
<el-button
class="outsetgrouping_button_Searchbtn"
type="primary"
size="mini"
@click="gosear"
>
<span class="s2">疾病分组查询</span>
</el-button>
<el-button
class="outsetgrouping_button_Submitbtn"
size="mini"
......@@ -117,7 +119,6 @@
</div>
<div class="outsetgrouping_centent_totalnum_left_text">
<div class="outsetgrouping_centent_totalnum_left_text_msg1">
<div
class="outsetgrouping_centent_totalnum_left_text_msg1_text11"
......@@ -149,7 +150,7 @@
<span>入组名称：{{ item.coreName }}</span>
<span>基准点数：{{ item.score }}</span>
</div>
<div class="outsetgrouping_centent_totalnum_left_text_msg2_text5">
<span>预计DRG支付费用：{{ item.unitfee }}</span
><span>院内历年平均费用：{{ item.avgFee }}</span
......@@ -215,7 +216,140 @@
<div class="outsetgrouping_centent_nodata_text">暂无数据</div>
</div>
</div>
<!-- 弹出层 -->
<el-dialog
center
:visible.sync="addrecordEnrollmentShow"
:before-close="closeDialog"
: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="请输入主诊断名称或诊断编码"
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>
</div>
</template>
<script >
......@@ -231,7 +365,7 @@ import {
import { decimal } from "../utils/decimal";
import { Message } from "element-ui";
import { useRoute, useRouter } from "../utils/useVueRouter";
import { initEcharts, categoryChart } from "../utils/echarts";
import { initEcharts, categoryChart, categoryChart11 } from "../utils/echarts";
export default {
name: "outHistorygrouping",
setup() {
......@@ -243,7 +377,7 @@ export default {
opsName: "",
},
CorePercents: [],
typesel: 1,
radio: "", //单选框选中值
drug: [],
......@@ -255,6 +389,19 @@ export default {
groupArr2: [],
diagMapList: null, //医保诊断编码集合
opsMapList: null, //医保手术编码集合
outaddsearchForm: {
diagName: "",
opsName: "",
},
addCorePercents: [],
addnodataShow: true, //没有搜索时显示
addnolistShow: false, //没有搜索数据的时候显示
addgroupList: [], //主诊断
addgroupArr: [],
addgroupList2: [], //主手术
addgroupArr2: [],
addrecordEnrollmentShow: false,
});
//返回
const router = useRouter();
......@@ -262,6 +409,12 @@ export default {
router.go(-1);
};
//疾病查询
const gosear = () => {
state.addrecordEnrollmentShow = true;
};
//获取基本数据
function getCaseHis(code) {
http
......@@ -280,7 +433,6 @@ export default {
const getlist = () => {
http
.post(`/medical/get/GetCorePercents`, {
Type: 1,
DiagMapList: state.diagMapList,
OpsMapList: state.opsMapList,
......@@ -288,7 +440,7 @@ export default {
})
.then((data) => {
state.CorePercents = data.list;
if (state.CorePercents.length == 0) {
state.nolistShow = true;
// state.nodataShow = false;
......@@ -342,14 +494,159 @@ export default {
.catch((error) => {});
}
};
var route = useRoute();
//关闭弹层前的回调
const closeDialog = () => {
state.addrecordEnrollmentShow=false;
state.outaddsearchForm = {
diagName: "",
opsName: "",
};
addclear();
};
//获取主诊断模糊数据
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 addsearch = () => {
state.addCorePercents = [];
addgetlist();
if (state.outaddsearchForm.diagName) {
state.addnodataShow = false;
state.addnolistShow = false;
} else {
state.addnodataShow = true;
state.addnolistShow = false;
}
};
//获取列表数据
const addgetlist = () => {
http
.post(`/medical/get/GetCorePercents`, {
diagName: state.outaddsearchForm.diagName,
opsName: state.outaddsearchForm.opsName,
})
.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) => {});
};
onMounted(() => {
getCaseHis(route.value.query.id);
if (state.searchForm.diagName.length > 0) {
getlist();
}
// if (state.outaddsearchForm.diagName.length > 0) {
// addgetlist();
// }
});
return {
......@@ -359,6 +656,16 @@ export default {
getlist,
submit,
goback,
gosear,
addsearch,
addgetlist,
addquerySearchGroup,
addgroupListMe,
addquerySearchGroup2,
addgroupListMe2,
addclear,
closeDialog,
};
},
};
......@@ -382,10 +689,10 @@ export default {
color: #2cabe3;
border: 1px solid #2cabe3;
}
&_Searchbtn{
background-color: #2CABE3;
color: #fff;
}
&_Searchbtn {
background-color: #2cabe3;
color: #fff;
}
&_Submitbtn {
background-color: #2cabe3;
color: #fff;
......@@ -728,98 +1035,98 @@ export default {
width: 97%;
height: 100%;
&_msg1{
height: 25%;
box-sizing: content-box;
border: 10px solid rgba(44, 171, 227, 0.08);
border-bottom: 5px solid rgba(44, 171, 227, 0.08);
border-top: 5px solid rgba(44, 171, 227, 0.08);
margin-bottom: 5px;
margin-top: 5px;
display: flex;
&_text11 {
width: 25%;
height: 100%;
display: flex;
flex-direction: column;
justify-content: center;
span {
height: 100%;
width: 50%;
// margin:5px 5px;
display: flex;
justify-content: start;
align-items: center;
font-size: 14px;
padding-left: 10px;
font-family: PingFang SC;
font-weight: 300;
color: #6a707e;
}
}
&_text22 {
width: 25%;
height: 100%;
display: flex;
flex-direction: column;
justify-content: center;
span {
height: 100%;
width: 50%;
// margin:5px 5px;
display: flex;
justify-content: start;
align-items: center;
font-size: 14px;
padding-left: 10px;
font-family: PingFang SC;
font-weight: 300;
color: #6a707e;
}
}
&_text33 {
width: 25%;
height: 100%;
display: flex;
flex-direction: column;
justify-content: center;
span {
height: 100%;
width: 50%;
// margin:5px 5px;
display: flex;
justify-content: start;
align-items: center;
font-size: 14px;
padding-left: 10px;
font-family: PingFang SC;
font-weight: 300;
color: #6a707e;
}
}
&_text44 {
width: 25%;
height: 100%;
display: flex;
flex-direction: column;
justify-content: center;
span {
height: 100%;
width: 50%;
// margin:5px 5px;
display: flex;
justify-content: start;
align-items: flex-start;
font-size: 14px;
padding-left: 10px;
font-family: PingFang SC;
font-weight: 300;
color: #6a707e;
}
}
}
&_msg1 {
height: 25%;
box-sizing: content-box;
border: 10px solid rgba(44, 171, 227, 0.08);
border-bottom: 5px solid rgba(44, 171, 227, 0.08);
border-top: 5px solid rgba(44, 171, 227, 0.08);
margin-bottom: 5px;
margin-top: 5px;
display: flex;
&_text11 {
width: 25%;
height: 100%;
display: flex;
flex-direction: column;
justify-content: center;
span {
height: 100%;
width: 50%;
// margin:5px 5px;
display: flex;
justify-content: start;
align-items: center;
font-size: 14px;
padding-left: 10px;
font-family: PingFang SC;
font-weight: 300;
color: #6a707e;
}
}
&_text22 {
width: 25%;
height: 100%;
display: flex;
flex-direction: column;
justify-content: center;
span {
height: 100%;
width: 50%;
// margin:5px 5px;
display: flex;
justify-content: start;
align-items: center;
font-size: 14px;
padding-left: 10px;
font-family: PingFang SC;
font-weight: 300;
color: #6a707e;
}
}
&_text33 {
width: 25%;
height: 100%;
display: flex;
flex-direction: column;
justify-content: center;
span {
height: 100%;
width: 50%;
// margin:5px 5px;
display: flex;
justify-content: start;
align-items: center;
font-size: 14px;
padding-left: 10px;
font-family: PingFang SC;
font-weight: 300;
color: #6a707e;
}
}
&_text44 {
width: 25%;
height: 100%;
display: flex;
flex-direction: column;
justify-content: center;
span {
height: 100%;
width: 50%;
// margin:5px 5px;
display: flex;
justify-content: start;
align-items: flex-start;
font-size: 14px;
padding-left: 10px;
font-family: PingFang SC;
font-weight: 300;
color: #6a707e;
}
}
}
&_msg2 {
background-color: rgba(44, 171, 227, 0.08);
......@@ -1043,5 +1350,252 @@ export default {
justify-content: flex-end;
margin-top: 1%;
}
.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/outaddrecordEnrollment.vue 0 → 100644
<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="请输入主诊断名称或诊断编码"
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 { decimal } from '../utils/decimal';
import { initEcharts, categoryChart11 } from '../utils/echarts'
export default {
props: {
dialogVisible: Boolean, //弹出层是否显示
},
setup(props, context) {
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>
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