lineUp.vue 28KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367368369370371372373374375376377378379380381382383384385386387388389390391392393394395396397398399400401402403404405406407408409410411412413414415416417418419420421422423424425426427428429430431432433434435436437438439440441442443444445446447448449450451452453454455456457458459460461462463464465466467468469470471472473474475476477478479480481482483484485486487488489490491492493494495496497498499500501502503504505506507508509510511512513514515516517518519520521522523524525526527528529530531532533534535536537538539540541542543544545546547548549550551552553554555556557558559560561562563564565566567568569570571572573574575576577578579580581582583584585586587588589590591592593594595596597598599600601602603604605606607608609610611612613614615616617618619620621622623624625626627628629630631632633634635636637638639640641642643644645646647
  1. <template>
  2. <div class="main-contain">
  3. <div class="position">
  4. <bread-crumb :crumbs="crumbs"></bread-crumb>
  5. <el-button
  6. size="small"
  7. icon="el-icon-menu"
  8. @click="fullscreenboard"
  9. type="primary"
  10. >全屏投影</el-button
  11. >
  12. </div>
  13. <div id="fullscreenbroad" v-show="dialogTableVisible">
  14. <el-row class="fullRow">
  15. <el-button
  16. @click="openSetting"
  17. icon="el-icon-setting"
  18. circle
  19. id="fullscreenbroad-setting"
  20. ></el-button>
  21. <el-button
  22. type="primary"
  23. icon="el-icon-rank"
  24. v-if="showSetting"
  25. id="fullscreenbroad-setting"
  26. @click="togglefullscreen"
  27. >切换模式</el-button
  28. >
  29. <el-button
  30. type="primary"
  31. icon="el-icon-menu"
  32. v-if="showSetting"
  33. id="fullscreenbroad-setting"
  34. @click="outfullscreenboard"
  35. >退出全屏投影</el-button
  36. >
  37. </el-row>
  38. <div class="page_lineUp">
  39. <div class="lineUpTitle">
  40. <div>{{ this.$store.getters.xt_user.org.org_name }}<span>&nbsp;&nbsp;温馨提示:请注意排队叫号,依次叫号就诊上机,谢谢配合</span></div>
  41. <div>{{ newdate }}&nbsp;&nbsp;{{ time }}</div>
  42. </div>
  43. <div class="lineUpMain">
  44. <div class="lineUpMainLeft">
  45. <div class="lineUpMainLeftTitle">
  46. <p style="width:12%">排队号</p>
  47. <p style="width:14%">姓名</p>
  48. <p style="width:14%">病例号</p>
  49. <p style="width:14%">床位号</p>
  50. <p style="width:14%">治疗状态</p>
  51. <p style="width:14%">上机时间</p>
  52. <p style="width:16%">预计下机时间</p>
  53. </div>
  54. <div class="lineUpList">
  55. <div class="lineUpListOne" v-for="(item,index) in lineUpList" :key="index">
  56. <p style="width:12%">
  57. <span v-if="item.schedule_type == 1">上午</span>
  58. <span v-if="item.schedule_type == 2">上午</span>
  59. <span v-if="item.schedule_type == 3">上午</span>
  60. {{ item.queue_no }}号
  61. </p>
  62. <p style="width:14%">{{ item.patient_name }}</p>
  63. <p style="width:14%">{{ item.dialysis_no }}</p>
  64. <p style="width:14%">{{ item.partition_name + item.bed_name }}</p>
  65. <p style="width:14%">
  66. <span v-if="item.status == 1">待接诊</span>
  67. <span v-if="item.status == 2">接诊中</span>
  68. <span v-if="item.status == 3">待上机</span>
  69. <span v-if="item.status == 4">透析中</span>
  70. <span v-if="item.status == 5">已下机</span>
  71. </p>
  72. <p style="width:14%">{{ item.start_time ? getDates(item.start_time) : '--' }}</p>
  73. <p style="width:16%">{{ item.end_time ? getDates(item.end_time) : '--' }}</p>
  74. </div>
  75. </div>
  76. </div>
  77. <div class="callingBox">
  78. <div :class="(queueConfig.jzjhyc == 1 && queueConfig.sjjhyc == 0) ? 'callingBoxLeft1' : 'callingBoxLeft'" v-if="queueConfig.jzjhyc == 1">
  79. <div class="callingTitle"><span style="margin: 0 auto;">接<br />诊<br />叫<br />号</span></div>
  80. <div style="flex: 1;">
  81. <div class="callingTop" style="margin-bottom:10px;">
  82. <div class="callingTopTip"><span style="margin: 0 auto;">正在<br />接诊</span></div>
  83. <div class="callingContent">
  84. <p style="margin:50px 0 14px;"><span v-for="(item,index) in (receivingPatient || '').slice(0,3)" :key="index">{{ item.patient_name }}、</span></p>
  85. <p><span v-for="(item,index) in (receivingPatient || '').slice(3,6)" :key="index">{{ item.patient_name }}、</span></p>
  86. </div>
  87. </div>
  88. <div class="callingTop" style="border-radius: 0 0 15px 0;">
  89. <div class="callingTopTip"><span style="margin: 0 auto;">等待<br />接诊</span></div>
  90. <div class="callingContent">
  91. <p style="margin:50px 0 14px;"><span v-for="(item,index) in (waitDoctorList || '').slice(0,3)" :key="index">{{ item.patient_name }}、</span></p>
  92. <p><span v-for="(item,index) in (waitDoctorList || '').slice(3,6)" :key="index">{{ item.patient_name }}、</span></p>
  93. </div>
  94. </div>
  95. </div>
  96. </div>
  97. <div :class="(queueConfig.jzjhyc == 0 && queueConfig.sjjhyc == 1) ? 'callingBoxLeft1' : 'callingBoxLeft'" v-if="queueConfig.sjjhyc == 1">
  98. <div class="callingTitle newCallingTitle"><span style="margin: 0 auto;">上<br />机<br />叫<br />号</span></div>
  99. <div style="flex: 1;">
  100. <div class="callingTop" style="margin-bottom:10px;">
  101. <div class="callingTopTip newCallingTopTip"><span style="margin: 0 auto;">正在<br />叫号</span></div>
  102. <div class="callingContent newCallingContent">
  103. <p style="margin:50px 0 14px;"><span v-for="(item,index) in (upPatientList || '').slice(0,3)" :key="index">{{ item.patient_name }}、</span></p>
  104. <p><span v-for="(item,index) in (upPatientList || '').slice(3,6)" :key="index">{{ item.patient_name }}、</span></p>
  105. </div>
  106. </div>
  107. <div class="callingTop" style="border-radius: 0 0 15px 0;">
  108. <div class="callingTopTip newCallingTopTip"><span style="margin: 0 auto;">等待<br />叫号</span></div>
  109. <div class="callingContent newCallingContent">
  110. <p style="margin:50px 0 14px;"><span v-for="(item,index) in (receivingPatient || '').slice(0,3)" :key="index">{{ item.patient_name }}、</span></p>
  111. <p><span v-for="(item,index) in (receivingPatient || '').slice(3,6)" :key="index">{{ item.patient_name }}、</span></p>
  112. </div>
  113. </div>
  114. </div>
  115. </div>
  116. </div>
  117. </div>
  118. </div>
  119. </div>
  120. <div class="app-container">
  121. <div class="page_lineUp">
  122. <div class="lineUpTitle">
  123. <div>{{ this.$store.getters.xt_user.org.org_name }}<span>&nbsp;&nbsp;温馨提示:请注意排队叫号,依次叫号就诊上机,谢谢配合</span></div>
  124. <div>{{ newdate }}&nbsp;&nbsp;{{ time }}</div>
  125. </div>
  126. <div class="lineUpMain">
  127. <div class="lineUpMainLeft">
  128. <div class="lineUpMainLeftTitle">
  129. <p style="width:12%">排队号</p>
  130. <p style="width:14%">姓名</p>
  131. <p style="width:14%">病例号</p>
  132. <p style="width:14%">床位号</p>
  133. <p style="width:14%">治疗状态</p>
  134. <p style="width:14%">上机时间</p>
  135. <p style="width:16%">预计下机时间</p>
  136. </div>
  137. <div class="lineUpList">
  138. <div class="lineUpListOne" v-for="(item,index) in lineUpList" :key="index">
  139. <p style="width:12%">
  140. <span v-if="item.schedule_type == 1">上午</span>
  141. <span v-if="item.schedule_type == 2">上午</span>
  142. <span v-if="item.schedule_type == 3">上午</span>
  143. {{ item.queue_no }}号
  144. </p>
  145. <p style="width:14%">{{ item.patient_name }}</p>
  146. <p style="width:14%">{{ item.dialysis_no }}</p>
  147. <p style="width:14%">{{ item.partition_name + item.bed_name }}</p>
  148. <p style="width:14%">
  149. <span v-if="item.status == 1">待接诊</span>
  150. <span v-if="item.status == 2">接诊中</span>
  151. <span v-if="item.status == 3">待上机</span>
  152. <span v-if="item.status == 4">透析中</span>
  153. <span v-if="item.status == 5">已下机</span>
  154. </p>
  155. <p style="width:14%">{{ item.start_time ? getDates(item.start_time) : '--' }}</p>
  156. <p style="width:16%">{{ item.end_time ? getDates(item.end_time) : '--' }}</p>
  157. </div>
  158. </div>
  159. </div>
  160. <div class="callingBox">
  161. <div :class="(queueConfig.jzjhyc == 1 && queueConfig.sjjhyc == 0) ? 'callingBoxLeft1' : 'callingBoxLeft'" v-if="queueConfig.jzjhyc == 1">
  162. <div class="callingTitle"><span style="margin: 0 auto;">接<br />诊<br />叫<br />号</span></div>
  163. <div style="flex: 1;">
  164. <div class="callingTop" style="margin-bottom:10px;">
  165. <div class="callingTopTip"><span style="margin: 0 auto;">正在<br />接诊</span></div>
  166. <div class="callingContent">
  167. <p style="margin:50px 0 14px;"><span v-for="(item,index) in (receivingPatient || '').slice(0,3)" :key="index">{{ item.patient_name }}、</span></p>
  168. <p><span v-for="(item,index) in (receivingPatient || '').slice(3,6)" :key="index">{{ item.patient_name }}、</span></p>
  169. </div>
  170. </div>
  171. <div class="callingTop" style="border-radius: 0 0 15px 0;">
  172. <div class="callingTopTip"><span style="margin: 0 auto;">等待<br />接诊</span></div>
  173. <div class="callingContent">
  174. <p style="margin:50px 0 14px;"><span v-for="(item,index) in (waitDoctorList || '').slice(0,3)" :key="index">{{ item.patient_name }}、</span></p>
  175. <p><span v-for="(item,index) in (waitDoctorList || '').slice(3,6)" :key="index">{{ item.patient_name }}、</span></p>
  176. </div>
  177. </div>
  178. </div>
  179. </div>
  180. <div :class="(queueConfig.jzjhyc == 0 && queueConfig.sjjhyc == 1) ? 'callingBoxLeft1' : 'callingBoxLeft'" v-if="queueConfig.sjjhyc == 1">
  181. <div class="callingTitle newCallingTitle"><span style="margin: 0 auto;">上<br />机<br />叫<br />号</span></div>
  182. <div style="flex: 1;">
  183. <div class="callingTop" style="margin-bottom:10px;">
  184. <div class="callingTopTip newCallingTopTip"><span style="margin: 0 auto;">正在<br />叫号</span></div>
  185. <div class="callingContent newCallingContent">
  186. <p style="margin:50px 0 14px;"><span v-for="(item,index) in (upPatientList || '').slice(0,3)" :key="index">{{ item.patient_name }}、</span></p>
  187. <p><span v-for="(item,index) in (upPatientList || '').slice(3,6)" :key="index">{{ item.patient_name }}、</span></p>
  188. </div>
  189. </div>
  190. <div class="callingTop" style="border-radius: 0 0 15px 0;">
  191. <div class="callingTopTip newCallingTopTip"><span style="margin: 0 auto;">等待<br />叫号</span></div>
  192. <div class="callingContent newCallingContent">
  193. <p style="margin:50px 0 14px;"><span v-for="(item,index) in (receivingPatient || '').slice(0,3)" :key="index">{{ item.patient_name }}、</span></p>
  194. <p><span v-for="(item,index) in (receivingPatient || '').slice(3,6)" :key="index">{{ item.patient_name }}、</span></p>
  195. </div>
  196. </div>
  197. </div>
  198. </div>
  199. </div>
  200. </div>
  201. </div>
  202. </div>
  203. </div>
  204. </template>
  205. <script>
  206. const moment = require('moment')
  207. import BreadCrumb from "../components/bread-crumb";
  208. import screenfull from "screenfull";
  209. export default {
  210. components:{
  211. BreadCrumb
  212. },
  213. data(){
  214. return{
  215. crumbs: [
  216. { path: false, name: "签到排队" },
  217. { path: false, name: "排队窗口" }
  218. ],
  219. dialogTableVisible:false,
  220. showSetting: false,
  221. lineUpList:[],
  222. count:0,
  223. page:1,
  224. timer:null,
  225. queueConfig:{
  226. qhsj:10,
  227. },
  228. receivingPatient:[],
  229. waitDoctorList:[],
  230. upPatientList:[],
  231. patient_id:'',
  232. timerID:null,
  233. time:'',
  234. newdate:'',
  235. voiceNum:1,
  236. voiceTime:null,
  237. voice:true,
  238. a:1,
  239. }
  240. },
  241. computed: {
  242. websocket() {
  243. return this.$store.state.user.websocket;
  244. },
  245. },
  246. created(){
  247. this.initData = {
  248. cmd: "queue/join",
  249. data: {type:2,page:1,size:6},
  250. };
  251. this.websocketSend(this.initData)
  252. let newobj = {
  253. cmd: "queue/callreturn",
  254. data: {patient_id:0},
  255. };
  256. this.websocketSend(newobj)
  257. },
  258. beforeMount() {
  259. if (this.websocket) {
  260. if (this.websocket.readyState == 1) {
  261. console.log('执行1')
  262. this.websocketMess();
  263. } else {
  264. setTimeout(() => {
  265. console.log('执行2')
  266. this.websocketMess();
  267. }, 1000);
  268. }
  269. } else {
  270. setTimeout(() => {
  271. if (this.websocket.readyState == 1) {
  272. console.log('执行3')
  273. this.websocketMess();
  274. } else {
  275. setTimeout(() => {
  276. console.log('执行4')
  277. this.websocketMess();
  278. }, 1000);
  279. }
  280. }, 1000);
  281. }
  282. // this.websocketMess();
  283. },
  284. mounted(){
  285. this.timer = setInterval(() => {
  286. if(this.page < Math.ceil(this.count / 6)){
  287. console.log('执行',Math.ceil(this.count / 6),this.page)
  288. this.page++
  289. let obj = {
  290. cmd: "queue/queuelist",
  291. data: {page:this.page,size:6,sort:0}
  292. };
  293. this.websocketSend(obj)
  294. setTimeout(() => {
  295. this.websocketMess();
  296. }, 1000);
  297. }else{
  298. console.log('执行22223333')
  299. this.page = 1
  300. let a = {
  301. cmd: "queue/queuelist",
  302. data: {page:this.page,size:6,sort:0}
  303. };
  304. this.websocketSend(a)
  305. setTimeout(() => {
  306. this.websocketMess();
  307. }, 1000);
  308. }
  309. console.log('切换时间',this.queueConfig)
  310. }, 1000 * parseInt(this.queueConfig.qhsj));
  311. this.timerID = setInterval(() => {
  312. this.updateTime()
  313. }, 1000);
  314. },
  315. beforeDestroy(){
  316. clearInterval(this.timer);  // 清除定时器
  317. this.timer = null
  318. clearInterval(this.timerID);
  319. this.timerID = null;  // 清除定时器
  320. let unObj = {
  321. cmd:'queue/unjoin',
  322. data:{type:2}
  323. }
  324. this.websocketSend(unObj)
  325. // this.timer = null;
  326. // let obj = {
  327. // cmd: "queue/join",
  328. // data: {type:1},
  329. // };
  330. // this.websocketSend(obj)
  331. },
  332. methods:{
  333. websocketSend(data) {
  334. try {
  335. this.websocket.send(JSON.stringify(data))
  336. } catch (error) {
  337. this.showError = true;
  338. this.showIndex = 4;
  339. this.errorInfo = "网络异常,请稍后退出重试!";
  340. }
  341. },
  342. websocketMess() {
  343. console.log('测试')
  344. this.websocket.onmessage = e => {
  345. let res = JSON.parse(e.data);
  346. // let res = re.data;
  347. console.log('res',res)
  348. if(res.channel == 'queue/join'){
  349. this.queueConfig = res.data.queueConfig
  350. this.lineUpList = res.data.patientQueueList.data
  351. this.receivingPatient = res.data.receivingPatient
  352. this.waitDoctorList = res.data.waitDoctorList
  353. this.upPatientList = res.data.upPatientList
  354. this.count = res.data.patientQueueList.count
  355. // this.lineUpList.map(item => {
  356. // item.create_time = moment(item.create_time * 1000).format('HH:mm:ss')
  357. // // item.start_time = moment(item.start_time * 1000).format('HH:mm')
  358. // })
  359. }else if(res.channel == 'queue/queuelist'){
  360. this.lineUpList = res.data.patientQueueList.data
  361. this.count = res.data.patientQueueList.count
  362. // this.lineUpList.map(item => {
  363. // item.create_time = moment(item.create_time * 1000).format('HH:mm:ss')
  364. // // item.start_time = moment(item.start_time * 1000).format('HH:mm')
  365. // if(item.start_time != null){
  366. // item.start_time = moment(item.start_time * 1000).format('HH:mm:ss')
  367. // }
  368. // if(item.status == 5 || item.end_time){
  369. // item.end_time = moment(item.end_time * 1000).format('HH:mm:ss')
  370. // }
  371. // })
  372. }else if(res.channel == 'patientCallInfo'){
  373. console.log(999999999999,res.data)
  374. console.log('执行几次',this.voiceNum)
  375. if(this.voice == true){
  376. this.patient_id = res.data.patientInfo.patient_id
  377. this.voice = false
  378. // let time1 = null
  379. this.voicePrompt(res.data.callVolUrl)
  380. this.voiceTime = setInterval(() => {
  381. let num = null
  382. if(res.data.patientInfo.status == 2){
  383. num = parseInt(this.queueConfig.jzdcbbcs)
  384. }else if(res.data.patientInfo.status == 3){
  385. num = parseInt(this.queueConfig.sjdcbbcs)
  386. }
  387. if(this.voiceNum < num){
  388. this.voiceNum++
  389. this.voicePrompt(res.data.callVolUrl)
  390. }else{
  391. this.voiceNum = 1;
  392. this.voice = true
  393. let obj = {
  394. cmd: "queue/callreturn",
  395. data: {patient_id:this.patient_id},
  396. };
  397. this.websocketSend(obj)
  398. clearInterval(this.voiceTime);
  399. this.voiceTime = null
  400. }
  401. },6000)
  402. }else {
  403. // this.$message({
  404. // message: '警告哦,这是一条警告消息',
  405. // type: 'warning'
  406. // });
  407. }
  408. }else if(res.channel == 'updateCallList'){
  409. this.receivingPatient = res.data.queue_list
  410. }else if(res.channel == 'updateWaitCallList'){
  411. this.waitDoctorList = res.data.queue_list
  412. }else if(res.channel == 'updateUpCallList'){
  413. this.upPatientList = res.data.queue_list
  414. }
  415. // else if(res.channel == "patientQueueInfo"){
  416. // this.queueInfo = res.data.queueInfo
  417. // let obj = {
  418. // cmd: "queue/queuelist",
  419. // data: {page:1,size:10}
  420. // };
  421. // this.websocketSend(obj)
  422. // }
  423. }
  424. },
  425. updateTime() {
  426. var cd = new Date();
  427. var week = ['星期日', '星期一', '星期二', '星期三', '星期四', '星期五', '星期六'];
  428. this.time = this.zeroPadding(cd.getHours(), 2) + ':' + this.zeroPadding(cd.getMinutes(), 2) + ':' + this.zeroPadding(cd.getSeconds(), 2) + ' (' + week[cd.getDay()] + ")";
  429. this.newdate = this.zeroPadding(cd.getFullYear(), 4) + '-' + this.zeroPadding(cd.getMonth() + 1, 2) + '-' + this.zeroPadding(cd.getDate(), 2);
  430. },
  431. zeroPadding(num, digit) {
  432. var zero = '';
  433. for (var i = 0; i < digit; i++) {
  434. zero += '0';
  435. }
  436. return (zero + num).slice(-digit);
  437. },
  438. fullscreenboard: function() {
  439. this.dialogTableVisible = true;
  440. // let routeData = this.$router.resolve({ path: '/fullscreenboard' })
  441. // window.open(routeData.href, '_blank')
  442. },
  443. outfullscreenboard: function() {
  444. this.dialogTableVisible = false;
  445. this.showSetting = false;
  446. },
  447. togglefullscreen: function() {
  448. if (!screenfull.enabled) {
  449. this.$message({
  450. message: "你的浏览器不支持",
  451. type: "warning"
  452. });
  453. return false;
  454. }
  455. screenfull.toggle();
  456. this.showSetting = false;
  457. },
  458. openSetting() {
  459. if (this.showSetting == false) {
  460. this.showSetting = true;
  461. } else {
  462. this.showSetting = false;
  463. }
  464. },
  465. getDates(time){
  466. return moment(time * 1000).format('HH:mm:ss')
  467. }
  468. }
  469. }
  470. </script>
  471. <style lang="scss" scoped>
  472. .page_lineUp{
  473. .lineUpTitle{
  474. height: 50px;
  475. background: #1A82BF;
  476. display: flex;
  477. justify-content: space-between;
  478. align-items: center;
  479. padding: 0 20px;
  480. color:#fff;
  481. font-size: 20px;
  482. font-weight: 600;
  483. }
  484. .lineUpMain{
  485. background: linear-gradient(0deg, #76ECEC, #479CD2);
  486. height: 1080px;
  487. padding:10px;
  488. }
  489. .lineUpMainLeft{
  490. height: 620px;
  491. border-radius: 15px;
  492. }
  493. .lineUpMainLeftTitle{
  494. display: flex;
  495. justify-content: space-between;
  496. align-items: center;
  497. color:#fff;
  498. font-size: 38px;
  499. font-weight: 600;
  500. height:80px;
  501. background: #1A82BF;
  502. border-radius: 15px 15px 0 0;
  503. >p{
  504. text-align: center;
  505. }
  506. }
  507. .lineUpList{
  508. font-size: 35px;
  509. font-weight: 600;
  510. >div:nth-child(odd){
  511. background: #F9FDFF;
  512. }
  513. >div:nth-child(even){
  514. background: #CCEBFF;
  515. }
  516. >div:last-child{
  517. border-radius: 0 0 15px 15px;
  518. }
  519. .lineUpListOne{
  520. height:90px;
  521. display: flex;
  522. justify-content: space-between;
  523. align-items: center;
  524. color:#1C6895;
  525. >p{
  526. width:25%;
  527. text-align: center;
  528. }
  529. }
  530. }
  531. .callingBox{
  532. height: 430px;
  533. margin-top: 10px;
  534. display: flex;
  535. justify-content: space-between;
  536. .callingBoxLeft{
  537. width: 49.5%;
  538. height: 100%;
  539. display: flex;
  540. justify-content: space-between;
  541. }
  542. .callingBoxLeft1{
  543. width: 99.5%;
  544. height: 100%;
  545. display: flex;
  546. justify-content: space-between;
  547. }
  548. .callingTitle{
  549. width: 130px;
  550. height: 100%;
  551. border-radius: 15px 0 0 15px;
  552. font-size: 66px;
  553. font-weight:600;
  554. text-align: center;
  555. color: #fff;
  556. background: #1A82BF;
  557. display: flex;
  558. align-items: center;
  559. margin-right: 5px;
  560. }
  561. .newCallingTitle{
  562. background: #1aa680;
  563. }
  564. .callingTop{
  565. height: 210px;
  566. border-radius: 0 15px 0 0;
  567. background: #F9FDFF;
  568. display: flex;
  569. justify-content: space-between;
  570. .callingTopTip{
  571. width: 130px;
  572. height: 100%;
  573. color: #fff;
  574. font-size: 40px;
  575. font-weight: 600;
  576. background: #1A82BF;
  577. display: flex;
  578. align-items: center;
  579. }
  580. .newCallingTopTip{
  581. background: #1aa680;
  582. }
  583. .callingContent{
  584. flex: 1;
  585. display: flex;
  586. flex-direction: column;
  587. font-size: 50px;
  588. color:#1C6895;
  589. font-weight: 600;
  590. padding-left: 20px;
  591. >p{
  592. width:100%;
  593. text-align: left;
  594. line-height: 50px;
  595. }
  596. }
  597. .newCallingContent{
  598. color:#1aa680;
  599. }
  600. }
  601. }
  602. }
  603. #fullscreenbroad {
  604. position: fixed;
  605. top: 0;
  606. right: 0;
  607. bottom: 0;
  608. left: 0;
  609. overflow: auto;
  610. margin: 0;
  611. background: #fff;
  612. padding: 20px;
  613. z-index:5000;
  614. }
  615. #fullscreenbroad #fullscreenbroad-setting {
  616. float: right;
  617. }
  618. #fullscreenbroad .el-button + .el-button {
  619. margin-left: 0px;
  620. }
  621. #fullscreenbroad .el-button:nth-child(1) {
  622. margin-left: 10px;
  623. }
  624. #fullscreenbroad .el-button:nth-child(2) {
  625. margin-left: 10px;
  626. }
  627. .fullRow{
  628. margin-bottom: 10px;
  629. }
  630. </style>