App.vue 7.2 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367368369370371372373374375376377378379380381382383384385386387388389390391392393394395396397
  1. <template>
  2. <router-view v-slot="{ Component }">
  3. <keep-alive exclude="login">
  4. <component :is="Component"/>
  5. </keep-alive>
  6. </router-view>
  7. <soctet-dialog v-if="socketErrDialog"/>
  8. </template>
  9. <script setup name="App">
  10. import {useStore} from 'vuex'
  11. import {setCallback, socketErrDialog} from "@/utils/websocket";
  12. import {ElMessageBox, ElNotification} from "element-plus";
  13. import sleep from "@/utils/sleep";
  14. import SoctetDialog from "@/components/xiao-chan/websocket/SoctetDialog.vue";
  15. import router from "@/router";
  16. const store = useStore()
  17. let windowSize = getWindowSize()
  18. store.commit('app/setWindowSize', windowSize)
  19. store.commit('app/setJdt', {
  20. title: '数据上传',
  21. isOpen: false,
  22. abnormalClosing: false,
  23. })
  24. window.onresize = () => {
  25. store.commit('app/setWindowSize', getWindowSize())
  26. }
  27. const emrChannelFunc = {
  28. "firstPageOfMedicalRecord": (val) => {
  29. router.push({
  30. name: 'fillCaseFrontSheet',
  31. query: {
  32. patNo: val.inpatientNo,
  33. deptCode: val.smallDept,
  34. },
  35. })
  36. },
  37. "medicalAdvice": (val) => {
  38. router.push({
  39. name: 'yiZhuLuRu',
  40. params: {
  41. inpatientNo: val.inpatientNo
  42. },
  43. query: {
  44. pattern: 'all'
  45. }
  46. })
  47. }
  48. }
  49. const createChannel = () => {
  50. let homePage = new BroadcastChannel('emrChannel')
  51. homePage.addEventListener('message', async (e) => {
  52. if (!router.currentRoute.value.path.includes('/myEmrEditor')) {
  53. await router.push('/blank')
  54. let data = JSON.parse(e.data)
  55. emrChannelFunc[data.name](data.data)
  56. }
  57. })
  58. }
  59. onMounted(() => {
  60. createChannel()
  61. setCallback('refreshToken', (data) => {
  62. store.commit('user/tokenChange', data.token)
  63. })
  64. setCallback('sidSingle', async () => {
  65. await store.dispatch('user/loginOut')
  66. await ElMessageBox.alert('您的账号已在其他地方登陆,如需修改密码请在个人中心中修改。', '提示', {
  67. type: 'warning',
  68. })
  69. })
  70. setCallback('criticalValue', (data) => {
  71. ElMessageBox.alert(data.message, '患者危急值', {
  72. type: 'error'
  73. }).then(() => {
  74. }).catch(() => {
  75. })
  76. })
  77. setCallback('systemNotification', (data) => {
  78. if (data.count) {
  79. let newCount = store.state.app.unreadMessageCount + data.count
  80. store.commit('app/setUnreadMessageCount', newCount)
  81. }
  82. if (data.refreshDelay) {
  83. sleep(data.refreshDelay).then(() => {
  84. location.reload();
  85. })
  86. }
  87. if (data?.donTDisplay) {
  88. return
  89. }
  90. ElNotification({
  91. title: typeof data.title === 'undefined' ? '新消息' : data.title,
  92. message: data.message,
  93. dangerouslyUseHTMLString: true,
  94. type: typeof data.type === 'undefined' ? 'warning' : data.type,
  95. duration: 0,
  96. })
  97. })
  98. })
  99. function getWindowSize() {
  100. const w = window.innerWidth
  101. const h = window.innerHeight - 96
  102. return {w, h}
  103. }
  104. </script>
  105. <style lang="scss">
  106. ::-webkit-scrollbar {
  107. width: 6px;
  108. &:hover {
  109. cursor: pointer;
  110. }
  111. }
  112. ::-webkit-scrollbar-thumb {
  113. border-radius: 4px;
  114. background: rgba(144, 147, 153, .3);
  115. &:hover {
  116. cursor: pointer;
  117. }
  118. }
  119. ::-webkit-scrollbar-button {
  120. width: 0;
  121. height: 0;
  122. display: none;
  123. }
  124. html,
  125. body,
  126. #app {
  127. height: 100vh;
  128. width: 100vw;
  129. margin: 0;
  130. padding: 0;
  131. background-color: #f5f5f5;
  132. }
  133. .el-container {
  134. height: 100vh;
  135. width: 100%;
  136. margin: 0;
  137. padding: 0;
  138. }
  139. ul, li {
  140. list-style: none;
  141. margin: 0;
  142. padding: 0;
  143. }
  144. .小手指 {
  145. cursor: pointer;
  146. }
  147. .xc_box {
  148. box-shadow: 0 4px 8px rgb(0 0 0 / 20%), 0 6px 20px rgb(0 0 0 / 19%);
  149. }
  150. #app {
  151. font-family: Avenir, Helvetica, Arial, sans-serif;
  152. -webkit-font-smoothing: antialiased;
  153. -moz-osx-font-smoothing: grayscale;
  154. //color: #2c3e50;
  155. color: black;
  156. width: 100%;
  157. height: 100vh;
  158. font-size: 13px;
  159. }
  160. .ellipsis-text {
  161. text-overflow: ellipsis;
  162. white-space: nowrap;
  163. overflow: hidden;
  164. }
  165. .sex-icon {
  166. width: 15px;
  167. height: 15px;
  168. }
  169. .el-table .cell {
  170. padding-left: 4px;
  171. padding-right: 4px;
  172. color: black;
  173. }
  174. .el-header {
  175. padding: 0 14px;
  176. height: 36px;
  177. display: flex;
  178. align-items: center;
  179. justify-content: flex-start;
  180. }
  181. .el-header > * {
  182. flex-wrap: nowrap;
  183. flex-shrink: 0;
  184. flex-grow: 0;
  185. }
  186. .el-main {
  187. padding: 0 14px;
  188. overflow: hidden;
  189. }
  190. .el-table__body tr.current-row > td,
  191. .el-table--striped .el-table__body tr.el-table__row--striped.current-row td {
  192. background-color: #a7d3ff !important;
  193. }
  194. .el-input.is-disabled .el-input__inner {
  195. color: blue;
  196. }
  197. .icon-shangxiatuodong {
  198. cursor: move;
  199. font-size: 12px;
  200. }
  201. .shangxiatuodong {
  202. cursor: move;
  203. }
  204. .el-checkbox__inner {
  205. width: 16px;
  206. height: 16px;
  207. border: 1px solid #000;
  208. border-radius: 4px;
  209. }
  210. .axios-loading2 {
  211. animation: axiosloading 1s;
  212. background-image: url('/src/assets/images/loading.gif');
  213. -webkit-background-image: url('/src/assets/images/loading.gif');
  214. background-repeat: no-repeat;
  215. background-position: center;
  216. }
  217. .el-dialog__header {
  218. border-bottom: 1px solid #ebeef5;
  219. background-color: #f8f8f8;
  220. border-radius: 4px;
  221. }
  222. .el-dialog {
  223. border-radius: 4px;
  224. }
  225. @keyframes axiosloading {
  226. 0% {
  227. opacity: 0;
  228. }
  229. 99% {
  230. opacity: 0;
  231. }
  232. 100% {
  233. opacity: 1;
  234. }
  235. }
  236. .component-box-wrapper__fullscreen {
  237. position: fixed;
  238. top: 0;
  239. left: 0;
  240. bottom: 0;
  241. right: 0;
  242. background: white;
  243. padding: 20px;
  244. z-index: 10000;
  245. height: 100%;
  246. overflow: auto;
  247. }
  248. .component-box-wrapper__half-transparent {
  249. position: fixed;
  250. top: 0;
  251. left: 0;
  252. bottom: 0;
  253. right: 0;
  254. background: rgba(0, 0, 0, 0.7);
  255. padding: 20px;
  256. z-index: 1000;
  257. height: 100%;
  258. overflow: auto;
  259. display: flex;
  260. align-items: flex-start;
  261. justify-content: center;
  262. }
  263. .finger:hover {
  264. cursor: pointer;
  265. }
  266. .component-content-box__dialog-like {
  267. width: 60%;
  268. padding: 20px;
  269. background: white;
  270. margin-top: 15vh;
  271. }
  272. .component-header-box {
  273. position: relative;
  274. width: 100%;
  275. display: flex;
  276. padding: 0 0 12px 0;
  277. }
  278. .component-header__title {
  279. width: 70%;
  280. font-size: 16px;
  281. display: flex;
  282. align-items: center;
  283. }
  284. .component-header__close-button {
  285. width: 30%;
  286. text-align: right;
  287. }
  288. table th.star div::before {
  289. content: '*';
  290. color: #f56c6cff;
  291. margin-right: 4px;
  292. }
  293. .bi_tian .el-form-item__label::before {
  294. content: '*';
  295. color: #f56c6cff;
  296. margin-right: 4px;
  297. }
  298. .el-select-dropdown__item.selected {
  299. background-color: #71abed66;
  300. }
  301. .el-select-dropdown__item.hover,
  302. .el-select-dropdown__item:hover {
  303. background-color: #fac44d;
  304. color: white;
  305. }
  306. .el-message {
  307. border: none;
  308. border-radius: 2px;
  309. background-color: white;
  310. padding: 10px 16px;
  311. box-shadow: 1px 3px 8px 4px rgb(0 0 0 / 10%);
  312. .el-message__content {
  313. color: #333333;
  314. }
  315. }
  316. .el-table .el_table__current {
  317. background-color: #a7d3ff;
  318. }
  319. .remove_hover tbody tr:hover > td {
  320. background-color: transparent !important;
  321. }
  322. input[type=number] {
  323. -moz-appearance: textfield;
  324. }
  325. input[type=number]::-webkit-inner-spin-button,
  326. input[type=number]::-webkit-outer-spin-button {
  327. -webkit-appearance: none;
  328. margin: 0;
  329. }
  330. </style>