| | |
| | | # 页面标题 |
| | | VUE_APP_TITLE = 智慧随访管理系统 |
| | | VUE_APP_TITLE = 患者智慧服务系统 |
| | | |
| | | # 开发环境配置 |
| | | ENV = 'development' |
| | | |
| | | # 智慧随访管理系统/开发环境 |
| | | # 患者智慧服务系统/开发环境 |
| | | VUE_APP_BASE_API = '/dev-api' |
| | | |
| | | # 路由懒加载 |
| | |
| | | # 页面标题 |
| | | VUE_APP_TITLE = 智慧随访管理系统 |
| | | VUE_APP_TITLE = 患者智慧服务系统 |
| | | |
| | | # 生产环境配置 |
| | | ENV = 'production' |
| | | |
| | | # 智慧随访管理系统/生产环境 |
| | | # 患者智慧服务系统/生产环境 |
| | | VUE_APP_BASE_API = '/prod-api' |
| | |
| | | # 页面标题 |
| | | VUE_APP_TITLE = 智慧随访管理系统 |
| | | VUE_APP_TITLE = 患者智慧服务系统 |
| | | |
| | | NODE_ENV = production |
| | | |
| | | # 测试环境配置 |
| | | ENV = 'staging' |
| | | |
| | | # 智慧随访管理系统/测试环境 |
| | | # 患者智慧服务系统/测试环境 |
| | | VUE_APP_BASE_API = '/stage-api' |
| | |
| | | { |
| | | "name": "ruoyi", |
| | | "version": "3.8.5", |
| | | "description": "智慧随访管理系统", |
| | | "description": "患者智慧服务系统", |
| | | "author": "杭新", |
| | | "license": "MIT", |
| | | "scripts": { |
| | |
| | | }; |
| | | </script> |
| | | <style scoped> |
| | | #app { |
| | | overflow: scroll; |
| | | height: 100vh; |
| | | background: #F8FAFD; |
| | | } |
| | | #app .theme-picker { |
| | | display: none; |
| | | } |
| | |
| | | <!-- 表格组件封装 --> |
| | | <template> |
| | | <el-table |
| | | :data="currentList" |
| | |
| | | }, |
| | | data() { |
| | | return { |
| | | title: "智慧随访管理系统", |
| | | title: "患者智慧服务系统", |
| | | logo: logoImg, |
| | | }; |
| | | }, |
| | |
| | | <div class="home" style="margin-top: 40px; margin-left: 20px"> |
| | | <!-- 头部两个 --> |
| | | <el-row :gutter="20"> |
| | | <el-col :span="10"> |
| | | <el-col :span="11"> |
| | | <!-- 就诊统计盒子 --> |
| | | <div class="grid-content bg-purple headerBox bgc1"> |
| | | <div class="title"> |
| | | 就诊统计 |
| | | 患者统计<span |
| | | style=" |
| | | font-size: 25px; |
| | | font-weight: 600; |
| | | text-shadow: 2px 4px 7px rgb(85 132 255 / 50%); |
| | | color: black; |
| | | " |
| | | >12322 (人)</span |
| | | > |
| | | <span>{{ endatd }} ~ {{ statd }}</span> |
| | | </div> |
| | | <el-row :gutter="20"> |
| | | <el-col :span="6"> |
| | | <el-col :span="8"> |
| | | <div class="home-user-task-stats"> |
| | | <p>{{ 12322 }}</p> |
| | | </div> |
| | | <div class="text-color2"> |
| | | <p>就诊总数(个)</p> |
| | | </div> |
| | | </el-col> |
| | | <el-col :span="6"> |
| | | <div class="home-user-task-stats"> |
| | | <p>{{ 1231 }}</p> |
| | | <p>{{ 11231 }}</p> |
| | | <div class="text-color2"> |
| | | <p>在院总数(人)</p> |
| | | <p>门诊总数(人)</p> |
| | | </div> |
| | | </div> |
| | | </el-col> |
| | | <el-col :span="6"> |
| | | <el-col :span="7"> |
| | | <div class="home-user-task-stats"> |
| | | <p>{{ ticketStatistics.progressTotal || "0" }}</p> |
| | | <p>{{ 9207 }}</p> |
| | | <div class="text-color2"> |
| | | <p>离院总数(人)</p> |
| | | <p>住院总数(人)</p> |
| | | </div> |
| | | </div> |
| | | </el-col> |
| | | <el-col :span="6"> |
| | | <el-col :span="7"> |
| | | <div class="home-user-task-stats"> |
| | | <p>{{ 12 }}</p> |
| | | <p>{{ 1209 }}</p> |
| | | <div class="text-color2"> |
| | | <p>投诉总数</p> |
| | | <p>体检总数(人)</p> |
| | | </div> |
| | | </div> |
| | | </el-col> |
| | | </el-row> |
| | | </div> |
| | | </el-col> |
| | | <el-col :span="7"> |
| | | <el-col :span="9"> |
| | | <div class="grid-content bg-purple headerBox bgc2"> |
| | | <div class="title"> |
| | | 医务人员数量 |
| | | 门诊服务总数 |
| | | <span |
| | | style=" |
| | | font-size: 25px; |
| | | text-shadow: 2px 4px 7px rgb(255 99 85 / 50%); |
| | | font-weight: 600; |
| | | color: red; |
| | | " |
| | | >12322 (人)</span |
| | | > |
| | | <span>{{ endatd }} ~ {{ statd }}</span> |
| | | </div> |
| | | <el-row :gutter="20"> |
| | |
| | | <p style="color: red">{{ 3453 }}</p> |
| | | </div> |
| | | <div class="text-color2"> |
| | | <p>医师</p> |
| | | <p>住院服务人数</p> |
| | | </div> |
| | | </el-col> |
| | | <el-col :span="12"> |
| | | <div class="home-user-task-stats"> |
| | | <p style="color: red">{{ 4213 }}</p> |
| | | <div class="text-color2"> |
| | | <p>护士</p> |
| | | <p>体检服务人数</p> |
| | | </div> |
| | | </div> |
| | | </el-col> |
| | |
| | | </el-row> |
| | | <!-- 中间和右边 --> |
| | | <el-row :gutter="20"> |
| | | <el-col :span="17"> |
| | | <el-col :span="20"> |
| | | <!-- echars数据可视化 --> |
| | | <div class="grid-content bg-purple" style="min-height: 365px"> |
| | | <div class="title"> |
| | |
| | | </div> |
| | | </el-col> |
| | | <!-- 中间和右边 --> |
| | | <el-col :span="6" class="aside"> |
| | | <div |
| | | class="grid-content bg-purple" |
| | | style="height: 560px; margin-top: -180px" |
| | | > |
| | | <el-col :span="4" class="aside"> |
| | | <div class="grid-content bg-purple" style="margin-top: -180px"> |
| | | <div class="title"> |
| | | 接诊排行 |
| | | 健康宣教 |
| | | <span>{{ endatd }} ~ {{ statd }}</span> |
| | | </div> |
| | | <el-table style="width: 100%" :data="SkuTop"> |
| | | <template v-for="(item, index) in SkuTop"></template> |
| | | <el-table-column |
| | | prop="order" |
| | | width="30" |
| | | style="background: url(~@/assets/order/4.png)" |
| | | type="index" |
| | | |
| | | ></el-table-column> |
| | | <el-table-column |
| | | prop="skuName" |
| | | width="124" |
| | | class-name="name" |
| | | |
| | | ></el-table-column> |
| | | <el-table-column |
| | | prop="count" |
| | | class-name="count" |
| | | |
| | | ></el-table-column> |
| | | </el-table> |
| | | <div style="max-height: 690px; width: 100%; overflow: auto"> |
| | | <el-table style="width: 100%" :data="SkuTop"> |
| | | <template v-for="(item, index) in SkuTop"></template> |
| | | <el-table-column |
| | | prop="order" |
| | | width="30" |
| | | style="background: url(~@/assets/order/4.png)" |
| | | type="index" |
| | | ></el-table-column> |
| | | <el-table-column |
| | | prop="skuName" |
| | | width="88" |
| | | class-name="name" |
| | | ></el-table-column> |
| | | <el-table-column prop="count" class-name="count"> |
| | | <template slot-scope="scope"> |
| | | {{ scope.row.count }}次 |
| | | </template> |
| | | </el-table-column> |
| | | </el-table> |
| | | </div> |
| | | </div> |
| | | </el-col> |
| | | </el-row> |
| | |
| | | <el-col :span="13"> |
| | | <div class="grid-content bg-purple" style="min-height: 300px"> |
| | | <div class="title"> |
| | | 合作商点位数Top5 |
| | | 诊后统计 |
| | | <span class="el-icon-s-unfold moreIcon"></span> |
| | | </div> |
| | | <div class="cooperate"> |
| | |
| | | <div class="pieChart" id="pieCharts"></div> |
| | | <div class="Points"> |
| | | <p>{{ 122 }}</p> |
| | | <span>点位数</span> |
| | | <p>{{ 18 }}</p> |
| | | <span>合作商</span> |
| | | <span>其中随访干预人次</span> |
| | | <p>{{ 122 }}</p> |
| | | <span>门诊随访</span> |
| | | <p>{{ 122 }}</p> |
| | | <span>出院随访</span> |
| | | </div> |
| | | </div> |
| | | </div> |
| | |
| | | <el-col :span="10"> |
| | | <div class="grid-content bg-purple" style="min-height: 300px"> |
| | | <div class="title"> |
| | | 异常设备监控 |
| | | 各项服务统计 |
| | | <span class="el-icon-s-unfold moreIcon2"></span> |
| | | </div> |
| | | <div class="empenty"></div> |
| | | <div class="empenty"> |
| | | <el-row> |
| | | <el-col :span="4" |
| | | ><div class="grid-content bg-purple">诊疗预约</div></el-col |
| | | > |
| | | <el-col :span="4" |
| | | ><div class="grid-content bg-purple-light">123次</div></el-col |
| | | > |
| | | <el-col :span="4" |
| | | ><div class="grid-content bg-purple">转诊服务</div></el-col |
| | | > |
| | | <el-col :span="4" |
| | | ><div class="grid-content bg-purple-light">231次</div></el-col |
| | | > |
| | | <el-col :span="4" |
| | | ><div class="grid-content bg-purple">信息推送</div></el-col |
| | | > |
| | | <el-col :span="4" |
| | | ><div class="grid-content bg-purple-light">900次</div></el-col |
| | | > </el-row |
| | | ><el-row> |
| | | <el-col :span="4" |
| | | ><div class="grid-content bg-purple">标识与导航</div></el-col |
| | | > |
| | | <el-col :span="4" |
| | | ><div class="grid-content bg-purple-light">23次</div></el-col |
| | | > |
| | | <el-col :span="4" |
| | | ><div class="grid-content bg-purple"> |
| | | 患者便利保障服务 |
| | | </div></el-col |
| | | > |
| | | <el-col :span="4" |
| | | ><div class="grid-content bg-purple-light">13次</div></el-col |
| | | > |
| | | <el-col :span="4" |
| | | ><div class="grid-content bg-purple">远程医疗</div></el-col |
| | | > |
| | | <el-col :span="4" |
| | | ><div class="grid-content bg-purple-light">31次</div></el-col |
| | | > </el-row |
| | | ><el-row> |
| | | <el-col :span="4" |
| | | ><div class="grid-content bg-purple">患者反馈</div></el-col |
| | | > |
| | | <el-col :span="4" |
| | | ><div class="grid-content bg-purple-light">150人</div></el-col |
| | | > |
| | | <el-col :span="4" |
| | | ><div class="grid-content bg-purple">患者管理</div></el-col |
| | | > |
| | | <el-col :span="4" |
| | | ><div class="grid-content bg-purple-light">231人</div></el-col |
| | | > |
| | | <el-col :span="4" |
| | | ><div class="grid-content bg-purple">健康宣教</div></el-col |
| | | > |
| | | <el-col :span="4" |
| | | ><div class="grid-content bg-purple-light">400</div></el-col |
| | | > |
| | | </el-row> |
| | | <el-row> |
| | | <el-col :span="4" |
| | | ><div class="grid-content bg-purple">反馈占比</div></el-col |
| | | > |
| | | <el-col :span="4" |
| | | ><div class="grid-content bg-purple-light">23%</div></el-col |
| | | > |
| | | <el-col :span="4" |
| | | ><div class="grid-content bg-purple">管理占比</div></el-col |
| | | > |
| | | <el-col :span="4" |
| | | ><div class="grid-content bg-purple-light">32%</div></el-col |
| | | > |
| | | </el-row> |
| | | </div> |
| | | </div> |
| | | </el-col> |
| | | </el-row> |
| | |
| | | this.getnodeCollect(); |
| | | this.getSkuTop(); |
| | | this.getOrderAmount(); |
| | | }) |
| | | }); |
| | | }, |
| | | mounted() {}, |
| | | methods: { |
| | |
| | | // const res = await getnodeCollect(); |
| | | // this.nodeCollect = res.data; |
| | | this.nodeCollect = [ |
| | | { name: "浙大一院", value: 12 }, |
| | | { name: "浙大二院", value: 8 }, |
| | | { name: "金兰医院", value: 8 }, |
| | | { name: "邵逸夫医院", value: 6 }, |
| | | { name: "省人民医院", value: 5 }, |
| | | { name: "朝晖院区", value: 4 }, |
| | | { name: "门诊随访", value: 1232 }, |
| | | { name: "出院随访", value: 342 }, |
| | | ]; |
| | | this.myPieChart(); |
| | | }, |
| | |
| | | // const res = await getSkuTop(10, this.endatd, this.statd); |
| | | // this.SkuTop = res.data; |
| | | this.SkuTop = [ |
| | | { amount: 0, count: 123, skuId: "0", skuName: "王大夫" }, |
| | | { amount: 0, count: 122, skuId: "0", skuName: "吴大夫" }, |
| | | { amount: 0, count: 112, skuId: "0", skuName: "李主任" }, |
| | | { amount: 0, count: 111, skuId: "0", skuName: "张护士" }, |
| | | { amount: 0, count: 102, skuId: "0", skuName: "李护士" }, |
| | | { amount: 0, count: 98, skuId: "0", skuName: "刘护士" }, |
| | | { amount: 0, count: 89, skuId: "0", skuName: "马大夫" }, |
| | | { amount: 0, count: 88, skuId: "0", skuName: "马大夫" }, |
| | | { amount: 0, count: 87, skuId: "0", skuName: "马大夫" }, |
| | | { amount: 0, count: 67, skuId: "0", skuName: "马大夫" }, |
| | | { amount: 0, count: 123, skuId: "0", skuName: "心肺科" }, |
| | | { amount: 0, count: 122, skuId: "0", skuName: "肾脏科" }, |
| | | { amount: 0, count: 112, skuId: "0", skuName: "泌尿科" }, |
| | | { amount: 0, count: 111, skuId: "0", skuName: "男科" }, |
| | | { amount: 0, count: 102, skuId: "0", skuName: "妇产科" }, |
| | | { amount: 0, count: 98, skuId: "0", skuName: "外科" }, |
| | | { amount: 0, count: 89, skuId: "0", skuName: "急诊" }, |
| | | { amount: 0, count: 88, skuId: "0", skuName: "器械科" }, |
| | | { amount: 0, count: 87, skuId: "0", skuName: "骨科" }, |
| | | { amount: 0, count: 67, skuId: "0", skuName: "放射科" }, |
| | | { amount: 0, count: 89, skuId: "0", skuName: "急诊" }, |
| | | { amount: 0, count: 88, skuId: "0", skuName: "器械科" }, |
| | | { amount: 0, count: 87, skuId: "0", skuName: "骨科" }, |
| | | { amount: 0, count: 67, skuId: "0", skuName: "放射科" }, |
| | | { amount: 0, count: 67, skuId: "0", skuName: "放射科" }, |
| | | |
| | | { amount: 0, count: 67, skuId: "0", skuName: "放射科" }, |
| | | ]; |
| | | }, |
| | | // 获取工单数量 |
| | |
| | | // start: this.atd, |
| | | // end: this.td, |
| | | // }); |
| | | |
| | | // this.order = res.data; |
| | | }, |
| | | // 获取总量数量 |
| | |
| | | // 指定图表的配置项和数据 |
| | | var option = { |
| | | title: { |
| | | text: "就诊分布", |
| | | left: "center", |
| | | text: "诊中统计", |
| | | }, |
| | | grid: { top: "18%", left: "19%", right: "0%", bottom: "24%" }, |
| | | xAxis: { |
| | | type: "category", |
| | | data: this.cylinderXAxis, |
| | | tooltip: { |
| | | trigger: "axis", |
| | | }, |
| | | yAxis: { |
| | | type: "value", |
| | | name: "单位/元", |
| | | legend: { |
| | | data: ["院内推送", "宣教完成"], |
| | | }, |
| | | toolbox: { |
| | | show: true, |
| | | feature: { |
| | | dataView: { show: true, readOnly: false }, |
| | | magicType: { show: true, type: ["line", "bar"] }, |
| | | restore: { show: true }, |
| | | saveAsImage: { show: true }, |
| | | }, |
| | | }, |
| | | calculable: true, |
| | | xAxis: [ |
| | | { |
| | | type: "category", |
| | | // prettier-ignore |
| | | data: ["一月","二月","三月","四月","五月","六月","七月","八月","九月","十月"], |
| | | }, |
| | | ], |
| | | yAxis: [ |
| | | { |
| | | type: "value", |
| | | }, |
| | | ], |
| | | series: [ |
| | | { |
| | | data: this.cylinderSeries, |
| | | barWidth: "5%", |
| | | name: "院内推送", |
| | | type: "bar", |
| | | data: [20, 49, 70, 32, 56, 76, 56, 122, 26, 20, 64, 33], |
| | | markPoint: { |
| | | data: [ |
| | | { type: "max", name: "Max" }, |
| | | { type: "min", name: "Min" }, |
| | | ], |
| | | }, |
| | | markLine: { |
| | | data: [{ type: "average", name: "Avg" }], |
| | | }, |
| | | }, |
| | | { |
| | | name: "宣教完成", |
| | | type: "bar", |
| | | data: [26, 59, 90, 64, 87, 70, 75, 182, 87, 82, 60, 23], |
| | | markPoint: { |
| | | data: [ |
| | | { name: "Max", value: 182, xAxis: 7, yAxis: 183 }, |
| | | { name: "Min", value: 2.3, xAxis: 11, yAxis: 3 }, |
| | | ], |
| | | }, |
| | | markLine: { |
| | | data: [{ type: "average", name: "Avg" }], |
| | | }, |
| | | }, |
| | | ], |
| | | }; |
| | |
| | | // const res = await getregionAmountCollect(1, this.endatd, this.statd); |
| | | // this.xAxis = res.data.xAxis; |
| | | // this.series = res.data.series; |
| | | this.xAxis = [ |
| | | "1月", |
| | | "2月", |
| | | "3月", |
| | | "4月", |
| | | "5月", |
| | | "6月", |
| | | "7月", |
| | | "8月", |
| | | ]; |
| | | this.xAxis = ["1月", "2月", "3月", "4月", "5月", "6月", "7月", "8月"]; |
| | | this.series = [123, 123, 223, 212, 432, 123, 442, 234]; |
| | | this.myEcharts2(); |
| | | }, |
| | |
| | | var echarts = require("echarts"); |
| | | var myChart2 = echarts.init(document.getElementById("echars")); |
| | | var option2 = { |
| | | color: ["red"], |
| | | title: { |
| | | text: "就诊趋势图", |
| | | left: "center", |
| | | text: "诊前数据", |
| | | }, |
| | | grid: { top: "18%", left: "17%", right: "0%", bottom: "24%" }, |
| | | xAxis: { |
| | | type: "category", |
| | | data: this.xAxis, |
| | | boundaryGap: true, |
| | | tooltip: { |
| | | trigger: "axis", |
| | | }, |
| | | yAxis: { |
| | | name: "单位/元", |
| | | type: "value", |
| | | dataset: { |
| | | source: [ |
| | | ["product", "2018", "2019", "2020", "2021", "2022", "2023"], |
| | | ["复诊", 256, 182, 388, 270, 253, 385], |
| | | ["住院", 351, 451, 355, 353, 373, 468], |
| | | ["手术", 440, 362, 569, 436, 445, 332], |
| | | ["转诊", 525, 237, 541, 518, 433, 249], |
| | | ], |
| | | }, |
| | | xAxis: { type: "category" }, |
| | | yAxis: { gridIndex: 0 }, |
| | | grid: { top: "55%" }, |
| | | series: [ |
| | | { |
| | | data: this.series, |
| | | type: "line", |
| | | smooth: true, |
| | | seriesLayoutBy: "row", |
| | | emphasis: { focus: "series" }, |
| | | }, |
| | | { |
| | | type: "line", |
| | | smooth: true, |
| | | seriesLayoutBy: "row", |
| | | emphasis: { focus: "series" }, |
| | | }, |
| | | { |
| | | type: "line", |
| | | smooth: true, |
| | | seriesLayoutBy: "row", |
| | | emphasis: { focus: "series" }, |
| | | }, |
| | | { |
| | | type: "line", |
| | | smooth: true, |
| | | seriesLayoutBy: "row", |
| | | emphasis: { focus: "series" }, |
| | | }, |
| | | { |
| | | type: "pie", |
| | | id: "pie", |
| | | radius: "30%", |
| | | center: ["50%", "25%"], |
| | | emphasis: { |
| | | focus: "self", |
| | | }, |
| | | label: { |
| | | formatter: "{b}: {@2018} ({d}%)", |
| | | }, |
| | | encode: { |
| | | itemName: "product", |
| | | value: "2018", |
| | | tooltip: "2018", |
| | | }, |
| | | }, |
| | | ], |
| | | }; |
| | | myChart2.on("updateAxisPointer", function (event) { |
| | | const xAxisInfo = event.axesInfo[0]; |
| | | if (xAxisInfo) { |
| | | const dimension = xAxisInfo.value + 1; |
| | | myChart2.setOption({ |
| | | series: { |
| | | id: "pie", |
| | | label: { |
| | | formatter: "{b}: {@[" + dimension + "]} ({d}%)", |
| | | }, |
| | | encode: { |
| | | value: dimension, |
| | | tooltip: dimension, |
| | | }, |
| | | }, |
| | | }); |
| | | } |
| | | }); |
| | | myChart2.setOption(option2); |
| | | }, |
| | | // 饼状图 |
| | |
| | | |
| | | // 指定图表的配置项和数据 |
| | | var optionPie = { |
| | | title: { |
| | | left: "left", |
| | | }, |
| | | // title: { |
| | | // left: "left", |
| | | // }, |
| | | |
| | | tooltip: { |
| | | trigger: "item", |
| | |
| | | mark: { show: true }, |
| | | }, |
| | | }, |
| | | legend: { |
| | | top: "5%", |
| | | left: "center", |
| | | }, |
| | | series: [ |
| | | { |
| | | name: "合作商点位数Top5", |
| | | name: "Access From", |
| | | type: "pie", |
| | | radius: ["10%", "70%"], |
| | | center: ["50%", "50%"], |
| | | roseType: "radius", |
| | | data: this.nodeCollect, |
| | | radius: ["40%", "70%"], |
| | | avoidLabelOverlap: false, |
| | | itemStyle: { |
| | | borderRadius: 10, |
| | | borderColor: "#fff", |
| | | borderWidth: 2, |
| | | }, |
| | | |
| | | emphasis: { |
| | | label: { |
| | | show: true, |
| | | fontSize: 40, |
| | | fontWeight: "bold", |
| | | }, |
| | | }, |
| | | labelLine: { |
| | | show: false, |
| | | }, |
| | | data: [ |
| | | { value: 580, name: "门诊随访" }, |
| | | { value: 484, name: "出院随访" }, |
| | | ], |
| | | }, |
| | | ], |
| | | }; |
| | |
| | | padding: 0; |
| | | margin: 0; |
| | | } |
| | | |
| | | .boxEchars { |
| | | width: 100%; |
| | | height: 280px; |
| | | height: 480px; |
| | | margin-top: 45px; |
| | | display: flex; |
| | | .echars1 { |
| | |
| | | } |
| | | .empenty { |
| | | width: 100%; |
| | | padding: 20px 0; |
| | | height: 280px; |
| | | } |
| | | .cooperate { |
| | |
| | | .Points { |
| | | width: 154px; |
| | | height: 230px; |
| | | padding-top: 47px; |
| | | padding-left: 38px; |
| | | text-align: center; |
| | | padding: 20px 0; |
| | | background: linear-gradient(135deg, transparent, #f8f8f9 0) 0 0, |
| | | linear-gradient(-135deg, transparent 12px, #f8f8f9 0) 100% 0, |
| | | linear-gradient(-45deg, transparent, #f8f8f9 0) 100% 100%, |
| | |
| | | line-height: 17px; |
| | | } |
| | | } |
| | | ::v-deep.aside .el-table__header-wrapper { |
| | | overflow: hidden; |
| | | display: none; |
| | | } |
| | | .headerBox { |
| | | height: 150px; |
| | | padding: 25px; |
| | |
| | | } |
| | | .bg-purple-light { |
| | | background: #e5e9f2; |
| | | text-align: center; |
| | | align-items: center; |
| | | line-height: 36px; |
| | | } |
| | | .grid-content { |
| | | min-height: 36px; |
| | |
| | | :rules="loginRules" |
| | | class="login-form" |
| | | > |
| | | <h3 class="title">智慧随访管理系统</h3> |
| | | <h3 class="title">患者智慧服务系统</h3> |
| | | <el-form-item prop="username"> |
| | | <el-input |
| | | v-model="loginForm.username" |
| | |
| | | <template> |
| | | <div>患者回访</div> |
| | | <div> |
| | | 患者回访 |
| | | <transition name="slide-fade"> |
| | | <p v-if="show">hello world</p> |
| | | </transition> |
| | | </div> |
| | | </template> |
| | | |
| | | <script> |
| | | export default { |
| | | data() { |
| | | return {}; |
| | | return { |
| | | show: true, |
| | | }; |
| | | }, |
| | | |
| | | created() {}, |
| | |
| | | }; |
| | | </script> |
| | | |
| | | <style lang="scss" scoped></style> |
| | | <style lang="scss" scoped> |
| | | .slide-fade-enter-active { |
| | | transition: all 1s ease; |
| | | } |
| | | .slide-fade-leave-active { |
| | | transition: all 2s cubic-bezier(1, 0.5, 0.8, 1); |
| | | } |
| | | .slide-fade-enter, |
| | | .slide-fade-leave-to { |
| | | transform: translateX(40px); |
| | | opacity: 0; |
| | | } |
| | | </style> |
| | |
| | | </template> |
| | | </el-table-column> |
| | | <el-table-column |
| | | label="年龄" |
| | | align="center" |
| | | key="age" |
| | | prop="age" |
| | | width="120" |
| | | /> |
| | | <el-table-column |
| | | label="出生年月" |
| | | align="center" |
| | | key="archivetime" |
| | | prop="archivetime" |
| | | width="160" |
| | | > |
| | | <template slot-scope="scope"> |
| | | <span>{{ parseTime(scope.row.createTime) }}</span> |
| | | </template> |
| | | </el-table-column> |
| | | <el-table-column |
| | | label="家庭住址" |
| | | align="center" |
| | | key="age" |
| | | prop="age" |
| | | width="120" |
| | | /> |
| | | <el-table-column |
| | | label="患者标签" |
| | | align="center" |
| | | key="tagList" |
| | |
| | | key="iccardno" |
| | | prop="iccardno" |
| | | width="190" |
| | | /> |
| | | <el-table-column |
| | | label="年龄" |
| | | align="center" |
| | | key="age" |
| | | prop="age" |
| | | width="120" |
| | | /> |
| | | |
| | | <el-table-column |
| | |
| | | <template> |
| | | <div class="app-container"> |
| | | <el-row :gutter="20"> |
| | | <el-col :span="4" :xs="24"> |
| | | <el-card class="box-card"> |
| | | <!-- <div slot="header" class="clearfix"> |
| | | <span>个人信息</span> |
| | | </div> --> |
| | | <div class="personage"> |
| | | <!-- 头部盒子 --> |
| | | <div class="personages"> |
| | | <el-row :gutter="20"> |
| | | <el-col :span="4" |
| | | ><div class="headportrait"> |
| | | <div class="text-center"> |
| | | <img v-imgError="require('@/assets/common/head.jpg')" src="" /> |
| | | </div> |
| | | <div class="information"> |
| | | <div class="info-xx"> |
| | | 吴龙 |
| | | <div class="xinz-inf">+新增标签</div> |
| | | </div> |
| | | <div class="info-xx">男<span>66岁</span></div> |
| | | <div class="info-xx">13803963330</div> |
| | | </div> |
| | | </div> |
| | | </el-card> |
| | | </el-col> |
| | | <el-col :span="18" :xs="24"> |
| | | <el-tabs |
| | | type="border-card" |
| | | v-model="activeName" |
| | | @tab-click="handleClick" |
| | | <div>吴大龙</div> |
| | | </div></el-col |
| | | > |
| | | <el-tab-pane name="health"> |
| | | <span class="mulsz" slot="label" |
| | | ><i class="el-icon-date"></i> 健康档案</span |
| | | > |
| | | 基本信息 |
| | | </el-tab-pane> |
| | | <el-tab-pane name="medical"> |
| | | <span class="mulsz" slot="label" |
| | | ><i class="el-icon-s-management"></i> 医疗档案</span |
| | | > |
| | | <el-tabs v-model="sonactiveName" @tab-click="handleClick"> |
| | | <el-tab-pane name="outpatient" |
| | | ><span class="mulsz" slot="label" |
| | | >门诊({{ mznumber }})</span |
| | | ></el-tab-pane |
| | | > |
| | | <el-tab-pane name="inhospital" |
| | | ><span class="mulsz" slot="label" |
| | | >住院({{ zynumber }}) |
| | | </span></el-tab-pane |
| | | > |
| | | <el-tab-pane name="checkout" |
| | | ><span class="mulsz" slot="label" |
| | | >检验({{ jynumber }}) |
| | | </span></el-tab-pane |
| | | > |
| | | <el-tab-pane name="examine" |
| | | ><span class="mulsz" slot="label" |
| | | >检查({{ jcnumber }}) |
| | | </span></el-tab-pane |
| | | > |
| | | <el-tab-pane name="physical" |
| | | ><span class="mulsz" slot="label"> |
| | | 体检({{ tjnumber }})</span |
| | | ></el-tab-pane |
| | | > |
| | | <el-tab-pane name="pharmacy" |
| | | ><span class="mulsz" slot="label" |
| | | >用药({{ yynumber }}) |
| | | </span></el-tab-pane |
| | | > |
| | | </el-tabs> |
| | | </el-tab-pane> |
| | | <el-tab-pane name="monitor"> |
| | | <span class="mulsz" slot="label" |
| | | ><i class="el-icon-s-data"></i> 健康监测</span |
| | | > |
| | | <el-col :span="4" |
| | | ><div class="xinz-inf"> |
| | | <div class="addtag">+新增标签</div> |
| | | <div class="tagvalue">心血管</div> |
| | | </div></el-col |
| | | > |
| | | <el-col :span="4" |
| | | ><div class="info-xx">男<span>66岁</span></div></el-col |
| | | > |
| | | <el-col :span="4"><div class="info-xx">13803963330</div></el-col> |
| | | </el-row> |
| | | </div> |
| | | |
| | | <el-tabs v-model="sontwoactiveName" @tab-click="handleClick"> |
| | | <el-tab-pane name="blood" |
| | | ><span class="mulsz" slot="label" |
| | | ><i class="el-icon-s-operation"></i> 血压</span |
| | | ></el-tab-pane |
| | | > |
| | | <el-tab-pane name="glucose" |
| | | ><span class="mulsz" slot="label" |
| | | ><i class="el-icon-odometer"></i>血糖 |
| | | </span></el-tab-pane |
| | | > |
| | | <el-tab-pane name="weight" |
| | | ><span class="mulsz" slot="label" |
| | | ><i class="el-icon-s-data"></i>体重 |
| | | </span></el-tab-pane |
| | | > |
| | | </el-tabs></el-tab-pane |
| | | <el-tabs type="border-card" v-model="activeName" @tab-click="handleClick"> |
| | | <el-tab-pane name="health"> |
| | | <span class="mulsz" slot="label" |
| | | ><i class="el-icon-date"></i> 健康档案</span |
| | | > |
| | | 基本信息 |
| | | </el-tab-pane> |
| | | <el-tab-pane name="medical"> |
| | | <span class="mulsz" slot="label" |
| | | ><i class="el-icon-s-management"></i> 医疗档案</span |
| | | > |
| | | <el-tabs v-model="sonactiveName" @tab-click="handleClick"> |
| | | <el-tab-pane name="outpatient" |
| | | ><span class="mulsz" slot="label" |
| | | >门诊({{ mznumber }})</span |
| | | ></el-tab-pane |
| | | > |
| | | <el-tab-pane name="serve"> |
| | | <span class="mulsz" slot="label" |
| | | ><i class="el-icon-s-custom"></i> 服务记录</span |
| | | > |
| | | |
| | | 定时任务补偿</el-tab-pane |
| | | <el-tab-pane name="inhospital" |
| | | ><span class="mulsz" slot="label" |
| | | >住院({{ zynumber }}) |
| | | </span></el-tab-pane |
| | | > |
| | | <el-tab-pane name="checkout" |
| | | ><span class="mulsz" slot="label" |
| | | >检验({{ jynumber }}) |
| | | </span></el-tab-pane |
| | | > |
| | | <el-tab-pane name="examine" |
| | | ><span class="mulsz" slot="label" |
| | | >检查({{ jcnumber }}) |
| | | </span></el-tab-pane |
| | | > |
| | | <el-tab-pane name="physical" |
| | | ><span class="mulsz" slot="label"> |
| | | 体检({{ tjnumber }})</span |
| | | ></el-tab-pane |
| | | > |
| | | <el-tab-pane name="pharmacy" |
| | | ><span class="mulsz" slot="label" |
| | | >用药({{ yynumber }}) |
| | | </span></el-tab-pane |
| | | > |
| | | </el-tabs> |
| | | </el-col> |
| | | </el-row> |
| | | </el-tab-pane> |
| | | <el-tab-pane name="monitor"> |
| | | <span class="mulsz" slot="label" |
| | | ><i class="el-icon-s-data"></i> 健康监测</span |
| | | > |
| | | |
| | | <el-tabs v-model="sontwoactiveName" @tab-click="handleClick"> |
| | | <el-tab-pane name="blood" |
| | | ><span class="mulsz" slot="label" |
| | | ><i class="el-icon-s-operation"></i> 血压</span |
| | | ></el-tab-pane |
| | | > |
| | | <el-tab-pane name="glucose" |
| | | ><span class="mulsz" slot="label" |
| | | ><i class="el-icon-odometer"></i>血糖 |
| | | </span></el-tab-pane |
| | | > |
| | | <el-tab-pane name="weight" |
| | | ><span class="mulsz" slot="label" |
| | | ><i class="el-icon-s-data"></i>体重 |
| | | </span></el-tab-pane |
| | | > |
| | | </el-tabs></el-tab-pane |
| | | > |
| | | <el-tab-pane name="serve"> |
| | | <span class="mulsz" slot="label" |
| | | ><i class="el-icon-s-custom"></i> 服务记录</span |
| | | > |
| | | |
| | | 定时任务补偿</el-tab-pane |
| | | > |
| | | </el-tabs> |
| | | |
| | | <!-- 健康档案模块 --> |
| | | <div class="information-content" v-if="activeName == 'health'"> |
| | | <div class="top-message"> |
| | |
| | | </script> |
| | | |
| | | <style lang="scss" scoped> |
| | | .personage { |
| | | display: flex; |
| | | .text-center { |
| | | width: 40px; |
| | | height: 40px; |
| | | margin-right: 10px; |
| | | img { |
| | | width: 100%; |
| | | .personages { |
| | | height: 88px; |
| | | width: 100%; |
| | | background-color: #2486b9; |
| | | border-radius: 5px; |
| | | padding: 20px; |
| | | margin-bottom: 10px; |
| | | line-height: 48px; |
| | | font-size: 25px; |
| | | font-weight: 600; |
| | | color: #ffffff; |
| | | .headportrait { |
| | | display: flex; |
| | | .text-center { |
| | | width: 55px; |
| | | height: 55px; |
| | | margin-right: 10px; |
| | | img { |
| | | width: 100%; |
| | | height: 100%; |
| | | border-radius: 50%; |
| | | } |
| | | } |
| | | } |
| | | .information { |
| | | font-size: 25px; |
| | | .info-xx { |
| | | margin-top: 15px; |
| | | border-bottom: 2px solid rgb(65, 161, 190); |
| | | display: flex; |
| | | span { |
| | | margin-left: 30px; |
| | | } |
| | | .xinz-inf { |
| | | cursor: pointer; |
| | | margin-left: 20px; |
| | | height: 23px; |
| | | line-height: 23px; |
| | | padding: 2px; |
| | | align-items: center; |
| | | font-size: 16px; |
| | | color: rgb(85, 151, 250); |
| | | border: 1px solid #439fff; |
| | | border-radius: 9px; |
| | | } |
| | | .xinz-inf { |
| | | display: flex; |
| | | font-size: 18px; |
| | | cursor: pointer; |
| | | .addtag{ |
| | | |
| | | } |
| | | } |
| | | } |
| | |
| | | <!-- 右侧数据 --> |
| | | <div class="leftvlue"> |
| | | <div> |
| | | <el-row :gutter="8"> |
| | | <el-col :span="2.5"> |
| | | <el-row :gutter="10"> |
| | | <el-col :span="2.5" v-for="(item,index) in cardlist" :key="index"> |
| | | <el-card shadow="hover"> |
| | | <div style="padding: 10px"> |
| | | <span>患者总数</span> |
| | | <div class="bottom clearfix">1232</div> |
| | | <div style="padding: 8px"> |
| | | <span>{{item.name}}</span> |
| | | <div style="text-align: center; font-size: 18px; margin-top: 10px; font-weight: 600;">{{item.value}}</div> |
| | | </div> |
| | | </el-card> |
| | | </el-col> |
| | | <el-col :span="2.5"> |
| | | <el-card shadow="hover"> 鼠标悬浮时显示 </el-card> |
| | | </el-col> |
| | | <el-col :span="2.5"> |
| | | <el-card shadow="hover"> 从不显示 </el-card> |
| | | </el-col> |
| | | </el-row> |
| | | </div> |
| | |
| | | tagname: undefined, |
| | | tagdescription: undefined, |
| | | }, |
| | | cardlist:[ |
| | | { |
| | | name:'患者总数', |
| | | value:123 |
| | | }, |
| | | { |
| | | name:'在院患者', |
| | | value:23 |
| | | }, |
| | | { |
| | | name:'离院患者', |
| | | value:41 |
| | | }, |
| | | { |
| | | name:'诊疗患者', |
| | | value:56 |
| | | }, |
| | | { |
| | | name:'离世患者', |
| | | value:0 |
| | | }, |
| | | ], |
| | | // 列信息 |
| | | columns: [ |
| | | { key: 0, label: `标签编号`, visible: true }, |
| | |
| | | margin-top: 20px; |
| | | margin: 20px; |
| | | padding: 30px; |
| | | background: #edf1f7; |
| | | background: #d0e9fd; |
| | | border: 1px solid #dcdfe6; |
| | | -webkit-box-shadow: 0 2px 4px 0 rgba(0, 0, 0, 0.12), |
| | | 0 0 6px 0 rgba(0, 0, 0, 0.04); |
| | |
| | | text-align: left; |
| | | font-size: 20px; |
| | | } |
| | | |
| | | ::v-deep.leftvlue .el-card__body{ |
| | | background: #d0e9fd; |
| | | } |
| | | ::v-deep.leftvlue .el-card__body:hover{ |
| | | background: #8dc8f8; |
| | | } |
| | | .leftvlue{ |
| | | width: 80%; |
| | | margin-top: 10px; |
| | | } |
| | | .leftvlue-bg { |
| | | // display: flex; |
| | | // flex: 1; |
| | | width: 80%; |
| | | margin-top: 20px; |
| | | // margin: 20px; |
| | | padding: 30px; |
| | |
| | | :rules="registerRules" |
| | | class="register-form" |
| | | > |
| | | <h3 class="title">智慧随访管理系统</h3> |
| | | <h3 class="title">患者智慧服务系统</h3> |
| | | <el-form-item prop="username"> |
| | | <el-input |
| | | v-model="registerForm.username" |
| | |
| | | |
| | | const CompressionPlugin = require('compression-webpack-plugin') |
| | | |
| | | const name = process.env.VUE_APP_TITLE || '智慧随访管理系统' // 网页标题 |
| | | const name = process.env.VUE_APP_TITLE || '患者智慧服务系统' // 网页标题 |
| | | |
| | | const port = process.env.port || process.env.npm_config_port || 8091 // 端口 |
| | | |