1.css 15 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367368369370371372373374375376377378379380381382383384385386387388389390391392393394395396397398399400401402403404405406407408409410411412413414415416417418419420421422423424425426427428429430431432433434435436437438439440441442443444445446447448449450451452453454455456457458459460461462463464465466467468469470471472473474475476477478479480481482483484485486487488489490491492493494495496497498499500501502503504505506507508509510511512513514515516517518519520521522523524525526527528529530531532533534535536537538539540541542543544545546547548549550551552553554555556557558559560561562563564565566567568569570571572573574575576577578579580581582583584585586587588589590591592593594595596597598599600601602603604605606607608609610611612613614615616617618619620621622623624625626627628629630631632633634635636637638639640641642643644645646647648649650651652653654655656657658659660661662663664665666667668669670671672673674675676677678679680681682683684
  1. /*疫苗开始*/
  2. .wrapper .msg-tab-head{
  3. background-color:#0E1E51;
  4. width:100%;
  5. padding:10px 40px;
  6. height:100px;
  7. color:#898a90;
  8. display: flex;
  9. flex:1;
  10. justify-content:space-around;
  11. flex-wrap:nowrap;
  12. }
  13. .wrapper .msg-tab-body{
  14. height:calc(100% - 100px);
  15. padding:5px;
  16. padding-bottom:0;
  17. }
  18. .msg-list-content{
  19. height:100%;
  20. overflow:hidden;
  21. display:none;
  22. width:100%;
  23. }
  24. .msg-list-content .list-container{
  25. height:100%;
  26. display:flex;
  27. flex-direction:column;
  28. width:100%;
  29. }
  30. .msg-tab-body .msg-list-content.active{
  31. display:block;
  32. }
  33. .msg-tab-body .msg-tab-list{
  34. height:30px;
  35. display: flex;
  36. align-items: center;
  37. justify-content: space-between;
  38. flex-wrap:nowrap;
  39. color:#a4cfe5;
  40. width:100%;
  41. margin-bottom:3px;
  42. }
  43. .msg-tab-body .msg-tab-list .man-dothis{
  44. font-size:0.8em;
  45. background-color:#060B2E;
  46. border-radius:5px;
  47. width:55px;
  48. height:100%;
  49. display: flex;
  50. align-items: center;
  51. justify-content: center;
  52. }
  53. .msg-tab-body .msg-tab-list .this-info{
  54. width:60px;
  55. height:100%;
  56. padding:0 4px;
  57. text-align:center;
  58. }
  59. .msg-tab-body .msg-tab-list .blank-info{
  60. width:4px;
  61. }
  62. .msg-tab-body .msg-tab-list .plan-obj{
  63. font-size:0.8em;
  64. background-color:#060B2E;
  65. border-radius:5px;
  66. height:100%;
  67. display: flex;
  68. align-items: center;
  69. justify-content: center;
  70. }
  71. .msg-tab-body .msg-tab-list .this-content-box{
  72. flex:1;
  73. height:100%;
  74. }
  75. .msg-tab-body .msg-tab-list .this-content{
  76. font-size:0.8em;
  77. display:flex;
  78. align-items:center;
  79. background-color:#060B2E;
  80. border-radius:5px;
  81. padding-left:3px;
  82. height:100%;
  83. position:relative;
  84. padding-right:60px;
  85. }
  86. .msg-tab-body .msg-tab-list .this-content.finish-over{
  87. padding-right:75px;
  88. }
  89. .msg-tab-body .msg-tab-list .this-content .msg-content{
  90. display: -webkit-box;
  91. -webkit-box-orient: vertical;
  92. -webkit-line-clamp: 1;
  93. overflow: hidden;
  94. line-height:30px;
  95. height:100%;
  96. }
  97. td .todo-btn,td .ready-todo-btn,td .confirmready-todo-btn{
  98. padding:10px;
  99. }
  100. .msg-tab-body .msg-tab-list .this-content .ypsqxq-btn,.msg-tab-body .msg-tab-list .this-content .ypsqsh-btn,.msg-tab-body .msg-tab-list .this-content .cureinfo-btn,.msg-tab-body .msg-tab-list .this-content .cure-btn,.msg-tab-body .msg-tab-list .this-content .zhenduan-btn,.msg-tab-body .msg-tab-list .this-content .todo-btn,.msg-tab-body .msg-tab-list .this-content .ready-todo-btn,.msg-tab-body .msg-tab-list .this-content .confirmready-todo-btn{
  101. position:absolute;
  102. right:5px;
  103. top:0px;
  104. display:flex;
  105. align-items:center;
  106. height:100%;
  107. color:#53BAFD;
  108. cursor:pointer;
  109. width:60px;
  110. justify-content:center;
  111. }
  112. .msg-tab-body .msg-tab-list .this-content .finish-time{
  113. position:absolute;
  114. right:5px;
  115. top:0px;
  116. display:flex;
  117. align-items:center;
  118. height:100%;
  119. cursor:pointer;
  120. width:75px;
  121. justify-content:center;
  122. }
  123. .msg-tab-body .msg-list-content .list-content-block{
  124. position:relative;
  125. flex:1;
  126. height:33.33%;
  127. width:100%;
  128. padding-bottom:4px;
  129. }
  130. .msg-tab-list-head{
  131. height:35px;
  132. display:flex;
  133. align-items:center;
  134. justify-content:center;
  135. position:relative;
  136. background-color:#060B2E;
  137. border-radius:5px;
  138. margin-bottom:5px;
  139. }
  140. .open-all-plan-list{
  141. position:absolute;
  142. right:10px;
  143. height:100%;
  144. display:flex;
  145. align-items:center;
  146. font-size:12px;
  147. color:#53BAFD;
  148. cursor:pointer;
  149. }
  150. .msg-tab-list-content{
  151. height:calc(100% - 40px);
  152. overflow:hidden;
  153. width:100%;
  154. }
  155. .msg-tab-body .list-content-block:before{
  156. content: '';
  157. position: absolute;
  158. bottom: 0px;
  159. left: 10%;
  160. height: 2px;
  161. width: 80%;
  162. background: linear-gradient(to right, rgba(11,82,224,0), #0b52e0, rgba(11,82,224,0));
  163. }
  164. .msg-tab-head .msg-tab1{
  165. display: flex;
  166. flex-direction: column;
  167. cursor:pointer;
  168. align-items:center;
  169. justify-content:center;
  170. }
  171. .msg-tab-head .msg-tab1:nth-child(1) img{
  172. width:42px;
  173. }
  174. .msg-tab-head .msg-tab1:nth-child(2) img{
  175. width:55px;
  176. }
  177. .msg-tab-head .msg-tab1:nth-child(3) img{
  178. width:27px;
  179. }
  180. .msg-tab-head .msg-tab1:nth-child(4) img{
  181. width:64px;
  182. }
  183. .msg-tab-head .msg-tab1 span{
  184. line-height:30px;
  185. text-align:center;
  186. font-size:1.2em;
  187. }
  188. .msg-tab-head .msg-tab1.active span{
  189. color:#fff;
  190. }
  191. .right #details-form{
  192. position:fixed;
  193. top:100px;
  194. left:50%;
  195. transform: translateX(-50%);
  196. -ms-transform: translateX(-50%);
  197. -moz-transform: translateX(-50%);
  198. -webkit-transform: translateX(-50%);
  199. -o-transform: translateX(-50%);
  200. display:none;
  201. z-index:99;
  202. background-color: #001346;
  203. border-radius: 6px;
  204. box-shadow: 0px -5px 5px 0px rgba(255,255,255,0.1), -5px 0px 5px 0px rgba(255,255,255,0.1), 5px 0px 5px 0px rgba(255,255,255,0.1), 0px 5px 5px 0px rgba(255,255,255,0.1);
  205. }
  206. #details-form .detail-content{
  207. width:100%;
  208. height:100%;
  209. }
  210. #details-form .detail-content .table-myjh{
  211. display:none;
  212. height:423px;
  213. }
  214. #details-form .detail-content .table-myjh.active{
  215. display:block;
  216. }
  217. #details-form .detail-content .table-myjh .tab-table-myjh-head{
  218. height: 40px;
  219. display: flex;
  220. align-items: center;
  221. justify-content: center;
  222. font-size: 1.2em;
  223. color: #53BAFD;
  224. position: relative;
  225. }
  226. .tab-table-myjh-head:before{
  227. content: '';
  228. position: absolute;
  229. bottom: 0px;
  230. left: 5%;
  231. height: 2px;
  232. width: 90%;
  233. background: linear-gradient(to right, rgba(11,82,224,0), #0b52e0, rgba(11,82,224,0));
  234. }
  235. #details-form .tab-table-myjh-body{
  236. padding:10px;
  237. height:calc(100% - 40px);
  238. position:relative;
  239. }
  240. #details-form .table-area-head{
  241. margin-bottom:5px;
  242. width:100%;
  243. display:flex;
  244. align-items:center;
  245. background-color:#133795;
  246. height: 43px;
  247. border-radius: 5px;
  248. }
  249. #details-form .table-myjh .table-area-head .table-area-head-tab{
  250. color: #fff;
  251. text-align:center;
  252. height:30px;
  253. vertical-align:middle;
  254. width:100px;
  255. display:flex;
  256. align-items:center;
  257. justify-content:center;
  258. }
  259. #details-form .table-area{
  260. width:100%;
  261. padding:10px;
  262. padding-top:0px;
  263. position:absolute;
  264. top:58px;
  265. left:0;
  266. height:calc(100% - 58px);
  267. overflow:hidden;
  268. border-radius: 0 0 5px 5px;
  269. }
  270. #details-form .table-area .table-area-box{
  271. height:100%;
  272. }
  273. #details-form .table-myjh .table-content{
  274. width:100%;
  275. height:100%;
  276. overflow:hidden;
  277. }
  278. #details-form .table-myjh .table-content tr{
  279. border-top: 1px solid #09153d;
  280. }
  281. #details-form .table-myjh .table-content tr td{
  282. text-align: center;
  283. height: 39px;
  284. vertical-align: middle;
  285. padding: 0 3px;
  286. background-color: #0c1f59;
  287. color: #fff;
  288. }
  289. #details-form .table-myjh .table-content tr td{
  290. width:100px;
  291. }
  292. #details-form .table-myjh .table-content tr td{
  293. font-size:0.9em;
  294. }
  295. #details-form .table-myjh:nth-child(1) .table-content tr td:last-child,#details-form .table-myjh:nth-child(2) .table-content tr td:last-child{
  296. color:#53BAFD;
  297. cursor:pointer;
  298. }
  299. #confirm-plan-window,#check-plan-window,#finalcheck-plan-window,#diagnose-window,.cure-window{
  300. width:350px;
  301. position:fixed;
  302. display:none;
  303. top:140px;
  304. left:50%;
  305. transform: translateX(-50%);
  306. -ms-transform: translateX(-50%);
  307. -moz-transform: translateX(-50%);
  308. -webkit-transform: translateX(-50%);
  309. -o-transform: translateX(-50%);
  310. z-index:100;
  311. background-color: #001346;
  312. border-radius: 6px;
  313. box-shadow: 0px -5px 5px 0px rgba(255,255,255,0.1), -5px 0px 5px 0px rgba(255,255,255,0.1), 5px 0px 5px 0px rgba(255,255,255,0.1), 0px 5px 5px 0px rgba(255,255,255,0.1);
  314. }
  315. #diagnose-window,.cure-window{
  316. width:520px;
  317. }
  318. .window-head{
  319. height: 30px;
  320. display: flex;
  321. align-items: center;
  322. justify-content: center;
  323. font-size: 1em;
  324. color: #53BAFD;
  325. position: relative;
  326. }
  327. .window-head:before {
  328. content: '';
  329. position: absolute;
  330. bottom: 0px;
  331. left: 5%;
  332. height: 1px;
  333. width: 90%;
  334. background: linear-gradient(to right, rgba(11,82,224,0), #0b52e0, rgba(11,82,224,0));
  335. }
  336. .window-body{
  337. display:flex;
  338. flex-direction:column;
  339. padding:10px;
  340. max-height:800px;
  341. }
  342. #confirm-plan-window .window-body .plan-items,.plan-items1{
  343. display:flex;
  344. align-items:center;
  345. justify-content:center;
  346. height:30px;
  347. }
  348. #check-plan-window .window-body .check-items,#finalcheck-plan-window .window-body .check-items,#diagnose-window .window-body .diagnose-items,.cure-window .window-body .cure-items{
  349. display:flex;
  350. align-items:center;
  351. justify-content:center;
  352. margin-bottom:13px;
  353. }
  354. #diagnose-window .window-body .diagnose-items .drug-items,.cure-window .window-body .cure-items .drug-items{
  355. display:flex;
  356. align-items:center;
  357. justify-content:center;
  358. margin-bottom:13px;
  359. width:100%;
  360. flex-direction:column;
  361. position:relative;
  362. padding-bottom:20px;
  363. }
  364. #diagnose-window .window-body .diagnose-items .drug-items:first-child,.cure-window .window-body .cure-items .drug-items:first-child{
  365. padding-bottom:0px;
  366. }
  367. .cut-items{
  368. position:absolute;
  369. right:0px;
  370. bottom:0px;
  371. cursor:pointer;
  372. display:flex;
  373. align-items:center;
  374. height:20px;
  375. }
  376. .cut-items:hover{
  377. color:#53BAFD;
  378. }
  379. .icon-cut{
  380. background-position:-428px -97px;
  381. margin-right:5px;
  382. }
  383. #diagnose-window .window-body .diagnose-items,.cure-window .window-body .cure-items{
  384. position:relative;
  385. }
  386. #diagnose-window .window-body .diagnose-items .add-items,.cure-window .window-body .cure-items .add-items{
  387. position:absolute;
  388. right:3px;
  389. top:50%;
  390. transform: translateY(-50%);
  391. -ms-transform: translateY(-50%);
  392. -moz-transform: translateY(-50%);
  393. -webkit-transform: translateY(-50%);
  394. -o-transform: translateY(-50%);
  395. }
  396. .icon-add{
  397. background-position: -408px -97px;
  398. }
  399. #check-plan-window .window-body .check-items .check-items-title,#finalcheck-plan-window .window-body .check-items .check-items-title{
  400. font-size:0.8em;
  401. width:90px;
  402. text-align:right
  403. }
  404. #diagnose-window .window-body .diagnose-items .diagnose-items-title,.cure-window .window-body .cure-items .cure-items-title{
  405. font-size:0.8em;
  406. }
  407. #diagnose-window .window-body .diagnose-items input[type="text"],.cure-items-data input[type="text"],.cure-window .window-body .cure-items input[type="text"]{
  408. outline:none;
  409. background-color:#001346;
  410. border:1px solid #0b52e0;
  411. color:#fff;
  412. margin-bottom:0px;
  413. width:100%;
  414. height:26px;
  415. }
  416. .cure-items-data input[type="text"]{
  417. width:70% !important;
  418. margin-left:20px;
  419. height:28px !important;
  420. }
  421. .flex-end{
  422. justify-content:flex-end !important;
  423. }
  424. .flex-end label{
  425. cursor:pointer;
  426. }
  427. .flex-end input{
  428. cursor:pointer;
  429. }
  430. #check-plan-window .window-body .check-items textarea,#finalcheck-plan-window .window-body .check-items textarea{
  431. outline:none;
  432. resize:none
  433. }
  434. .shenhe-beizhu{
  435. margin-left:0px !important;
  436. width:80% !important;
  437. }
  438. .window-btn{
  439. width: 103px;
  440. height: 27px;
  441. font-size: 0.8em;
  442. text-align: center;
  443. line-height: 27px;
  444. -webkit-border-radius: 16px;
  445. -moz-border-radius: 16px;
  446. border-radius: 16px;
  447. color: #fff;
  448. cursor: pointer;
  449. }
  450. input.btn-qr{
  451. background-color:#53BAFD;
  452. margin-right:20px;
  453. }
  454. .btn-ypsq{
  455. background-color:#49bf8e;
  456. }
  457. .btn-yes,.btn-tg{
  458. background-color:#53BAFD;
  459. margin-right:20px;
  460. }
  461. .btn-no,.btn-bh{
  462. background-color:#cc503d;
  463. }
  464. #confirm-plan-window .window-body .plan-items-title{
  465. font-size:0.8em;
  466. width:90px;
  467. text-align:right
  468. }
  469. #diagnose-window .window-body .diagnose-items-data,.cure-window .window-body .cure-items-data{
  470. width:80%;
  471. font-size:0.8em;
  472. display:flex;
  473. align-items:center;
  474. }
  475. .cure-items-data .chuli-style-block{
  476. display:flex;
  477. align-items:center;
  478. width:100%;
  479. flex-direction:column;
  480. border:1px solid #0b52e0;
  481. font-size: 1em;
  482. border-radius:3px;
  483. padding:7px;
  484. }
  485. .chuli-style-block .binli-time{
  486. height: 25px;
  487. display: flex;
  488. align-items: center;
  489. justify-content: center;
  490. font-size: 1em;
  491. position: relative;
  492. width:100%;
  493. }
  494. .chuli-style-block .binli-time:before{
  495. content: '';
  496. position: absolute;
  497. bottom: 2px;
  498. left: 0;
  499. height: 1px;
  500. width: 100%;
  501. background: linear-gradient(to right, rgba(11,82,224,0), #0b52e0, rgba(11,82,224,0));
  502. }
  503. .cure-items-data .chuli-style-block .chuli1{
  504. width:100%;
  505. display:flex;
  506. align-items:flex-start;
  507. margin-bottom:5px;
  508. }
  509. .cure-items-data .chuli-style-block .chuli1:last-child{
  510. margin-bottom:0px;
  511. }
  512. .chuli-style-block .chuli1 .chuli-way{
  513. width:10%;
  514. color:#53BAFD
  515. }
  516. .chuli-style-block .chuli1 .chuli-content{
  517. width:90%;
  518. display: -webkit-box;
  519. -webkit-box-orient: vertical;
  520. -webkit-line-clamp: 3;
  521. overflow: hidden;
  522. }
  523. #diagnose-window .window-body .diagnose-chuli-block,.cure-window .window-body .cure-chuli-block{
  524. width:80%;
  525. padding:7px;
  526. font-size:0.8em;
  527. display:flex;
  528. align-items:center;
  529. border:1px solid #0b52e0;
  530. border-radius:3px;
  531. flex-direction:column;
  532. }
  533. #diagnose-window .window-body .diagnose-chuli-block .diagnose-chuli-block-item,.cure-window .window-body .cure-chuli-block .cure-chuli-block-item{
  534. display:flex;
  535. align-items:center;
  536. justify-content:space-between;
  537. margin-bottom:10px;
  538. width:100%;
  539. }
  540. #diagnose-window .window-body .diagnose-chuli-block .diagnose-chuli-block-item:last-child,.cure-window .window-body .cure-chuli-block .cure-chuli-block-item:last-child{
  541. margin-bottom:0px;
  542. }
  543. #confirm-plan-window .window-body .plan-items-data{
  544. width:50%;
  545. font-size:0.8em;
  546. display:flex;
  547. align-items:center;
  548. }
  549. #confirm-plan-window .window-body .plan-items .plan-items-data .data-nums{
  550. flex:1;
  551. text-align:center;
  552. }
  553. .plan-items-data .select ,.diagnose-chuli-block .select,.cure-items .select{
  554. flex:1;
  555. position: relative;
  556. vertical-align: middle;
  557. padding: 2px;
  558. overflow: hidden;
  559. background-color: #001346;
  560. color: #fff;
  561. text-shadow: none;
  562. border-radius: 4px;
  563. transition: box-shadow 0.25s ease;
  564. z-index: 2;
  565. display: flex;
  566. align-items: center;
  567. }
  568. .cure-items .cure-status{
  569. flex:1;
  570. display: flex;
  571. align-items: center;
  572. border:1px solid #0b52e0;
  573. justify-content:center;
  574. height:28px;
  575. border-radius: 4px;
  576. }
  577. .cure-items .cure-beizhu{
  578. display: flex;
  579. align-items: center;
  580. width: 70% ;
  581. margin-left: 20px;
  582. padding-left:5px;
  583. height: 28px ;
  584. border-radius: 4px;
  585. border:1px solid #0b52e0;
  586. }
  587. .diagnose-chuli-block .select,.cure-items .select{
  588. border:1px solid #0b52e0;
  589. }
  590. .diagnose-chuli-block .diagnose-chuli-block-item:nth-child(1) input,.cure-chuli-block .cure-chuli-block-item:nth-child(1) input{
  591. width:50px !important;
  592. height:100%;
  593. }
  594. .diagnose-chuli-block .use-how,.cure-chuli-block .use-how{
  595. flex:1;
  596. }
  597. .diagnose-chuli-block .use-how input{
  598. width:100%;
  599. }
  600. .chuli-block-item-title{
  601. margin-left:5px;
  602. }
  603. .plan-items-data input{
  604. height:27px;
  605. }
  606. .plan-items-data .select:before ,.diagnose-chuli-block .select:before,.cure-items .select:before{
  607. content: "";
  608. position: absolute;
  609. width: 0;
  610. height: 0;
  611. border: 6px solid transparent;
  612. border-top-color: #fff;
  613. top: 12px;
  614. right: 4px;
  615. cursor: pointer;
  616. z-index: -2;
  617. }
  618. .plan-items-data .select select ,.diagnose-chuli-block .select select,.cure-items .select select {
  619. cursor: pointer;
  620. padding: 3px 0px;
  621. width: 100%;
  622. border: none;
  623. background: transparent;
  624. background-image: none;
  625. -webkit-appearance: none;
  626. -moz-appearance: none;
  627. outline: none;
  628. text-align: center;
  629. color: #fff;
  630. padding-right:20px;
  631. font-size: 1em;
  632. text-align:center;
  633. text-align-last: center;
  634. }
  635. .plan-items-data .select option ,.diagnose-chuli-block .select option,.cure-items .select option{
  636. background-color: #001346;
  637. text-align:center;
  638. text-align-last: center;
  639. }
  640. .plan-items-data .datetimePicker {
  641. flex: 1;
  642. border-radius: 4px;
  643. transition: box-shadow 0.25s ease;
  644. font-size: 0;
  645. white-space: nowrap;
  646. display: flex;
  647. justify-content: space-between;
  648. }
  649. .plan-items:last-child{
  650. margin-top:10px;
  651. }
  652. .plan-items-data .confirs-btn {
  653. width: 103px;
  654. height: 27px;
  655. font-size: 1em;
  656. text-align: center;
  657. line-height: 27px;
  658. -webkit-border-radius: 16px;
  659. -moz-border-radius: 16px;
  660. border-radius: 16px;
  661. background-color: #ea8c29;
  662. color: #fff;
  663. cursor: pointer;
  664. }
  665. #changedate{
  666. height:30px;
  667. display:none;
  668. }
  669. /*疫苗结束*/