首页 发现 帮助
登录
tigerphp
/
stagfe2
4
0
派生 0
文件 工单管理 0 合并请求 0 Wiki
浏览代码

Mc layout switch - video bar

Vijayakrishnan 3 年之前
父节点
2991a6d452
当前提交
8d2804d5e7
共有 5 个文件被更改，包括 63 次插入 和 12 次删除
合并视图 显示文件统计
  1. 37 1
      public/css/style.css
  2. 22 7
      resources/views/app/mc.blade.php
  3. 1 1
      resources/views/app/patient/note/rhs-sidebar-nrc.blade.php
  4. 1 1
      resources/views/app/patient/note/rhs-sidebar.blade.php
  5. 2 2
      resources/views/layouts/template.blade.php

+ 37 - 1
public/css/style.css
查看文件 

@@ -204,7 +204,7 @@ body.stag_rhs_collapsed .app-right-panel {
 
     opacity: 1;
 
     opacity: 1;
 
 }
 
 }
 
 .mcp-theme-1 .on-hover-aliceblue:hover {
 
 .mcp-theme-1 .on-hover-aliceblue:hover {
 
-    background: aliceblue;
 
+    background: aliceblue !important;
 
 }
 
 }
 
 .mcp-theme-1 .opacity-0 {
 
 .mcp-theme-1 .opacity-0 {
 
     opacity: 0 !important;
 
     opacity: 0 !important;
 
@@ -3621,3 +3621,39 @@ table.v-top th {
 
 .note_template_omega_soap_visit.rhs-sidebar-fixed .note-rhs-content {
 
 .note_template_omega_soap_visit.rhs-sidebar-fixed .note-rhs-content {
 
     max-width: calc(100% - 440px);
 
     max-width: calc(100% - 440px);
 
 }
 
 }
 
+
 
+.stag-video-bar {
 
+    position: absolute;
 
+    bottom: 0;
 
+    right: 20px;
 
+    width: 450px;
 
+    border: 1px solid #d2d2d2;
 
+    border-bottom: 0;
 
+    border-top-left-radius: 8px;
 
+    border-top-right-radius: 8px;
 
+    background: #fff;
 
+    overflow: hidden;
 
+    box-shadow: -1px 4px 4px #ddd;
 
+    transition: height ease-out 0.1s, right ease-out 0.1s, width ease-out 0.1s, right ease-out 0.1s;
 
+    height: calc(100vh - 65px);
 
+}
 
+.stag-video-bar .stag-video-bar-header {
 
+    height: 35px;
 
+}
 
+.stag-video-bar.collapsed {
 
+    height: 35px;
 
+    width: 250px;
 
+    overflow: hidden;
 
+}
 
+.stag-video-bar [if-collapsed] {
 
+    display: none;
 
+}
 
+.stag-video-bar [if-not-collapsed] {
 
+    display: none;
 
+}
 
+.stag-video-bar.collapsed [if-collapsed] {
 
+    display: block;
 
+}
 
+.stag-video-bar:not(.collapsed) [if-not-collapsed] {
 
+    display: block;
 
+}

+ 22 - 7
resources/views/app/mc.blade.php
查看文件 

@@ -6,6 +6,7 @@
 
     <meta name="viewport" content="width=device-width, user-scalable=no, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0">
 
     <meta name="viewport" content="width=device-width, user-scalable=no, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0">
 
     <meta http-equiv="X-UA-Compatible" content="ie=edge">
 
     <meta http-equiv="X-UA-Compatible" content="ie=edge">
 
     <script src="/js/jquery-3.5.1.min.js"></script>
 
     <script src="/js/jquery-3.5.1.min.js"></script>
 
+    <link rel="stylesheet" href="/fontawesome-free-5.13.1-web/css/all.min.css">
 
     <link href="/css/app.css?v={{config('app.asset_version')}}" rel="stylesheet">
 
     <link href="/css/app.css?v={{config('app.asset_version')}}" rel="stylesheet">
 
     <link href="/css/style.css?v={{config('app.asset_version')}}" rel="stylesheet">
 
     <link href="/css/style.css?v={{config('app.asset_version')}}" rel="stylesheet">
 
     <link href="/v-splitter-px/v-splitter.css?v={{config('app.asset_version')}}" rel="stylesheet" >
 
     <link href="/v-splitter-px/v-splitter.css?v={{config('app.asset_version')}}" rel="stylesheet" >
 
@@ -15,23 +16,37 @@
 
     <title>Leadership Health</title>
 
     <title>Leadership Health</title>
 
 </head>
 
 </head>
 
 <body class="h-100" data-pro-uid="{{$pro ? $pro->uid : ''}}">
 
 <body class="h-100" data-pro-uid="{{$pro ? $pro->uid : ''}}">
 
-    <div class="row mx-0 h-100">
 
-        <div class="col-9 px-0 app-left-panel">
 
-            <iframe id="stag_mcp_lhs" src="/blank" frameborder="0" class="h-100 w-100"></iframe>
 
-        </div>
 
-        <div class="col-3 border-left app-right-panel pr-1">
 
-            <iframe id="stag_mcp_rhs" src="" frameborder="0" class="h-100 w-100"></iframe>
 
+    <iframe id="stag_mcp_lhs" src="/blank" frameborder="0" class="h-100 w-100"></iframe>
 
+    <div class="stag-video-bar collapsed d-none mcp-theme-1">
 
+        <div class="bg-aliceblue d-flex align-items-center border-bottom p-2 stag-video-bar-header">
 
+            <i class="fa fa-video text-secondary mr-1"></i>
 
+            <div class="text-secondary font-weight-bold flex-grow-1 c-pointer" onclick="return toggleVideoBar($(this).closest('.stag-video-bar'))">Video</div>
 
+            <a href="#" if-collapsed="" class="ml-1 px-1" onclick="return toggleVideoBar($(this).closest('.stag-video-bar'))"><i class="fa fa-chevron-up"></i></a>
 
+            <a href="#" if-not-collapsed="" class="ml-1 px-1" onclick="return toggleVideoBar($(this).closest('.stag-video-bar'))"><i class="fa fa-chevron-down"></i></a>
 
+            <a href="#" class="ml-1 px-1" onclick="return $(this).closest('.stag-video-bar').addClass('d-none'); return false;"><i class="fa fa-times"></i></a>
 
         </div>
 
         </div>
 
+        <iframe id="stag_mcp_rhs" src="" frameborder="0" class="h-100 w-100"></iframe>
 
     </div>
 
     </div>
 
     <script>
 
     <script>
 
         window.top.localStorage.currentProUid = "{{$pro ? $pro->uid : ''}}";
 
         window.top.localStorage.currentProUid = "{{$pro ? $pro->uid : ''}}";
 
-        initVSplitter('stag-mc-main', $('.app-left-panel'), $('.app-right-panel'));
 
+        // initVSplitter('stag-mc-main', $('.app-left-panel'), $('.app-right-panel'));
 
+        window.toggleVideoBar = function(_videoBar) {
 
+            _videoBar.toggleClass('collapsed');
 
+            return false;
 
+        };
 
         window.openInLHS = function(_url) {
 
         window.openInLHS = function(_url) {
 
             $('#stag_mcp_lhs')[0].contentWindow.fastLoad(_url, true, false);
 
             $('#stag_mcp_lhs')[0].contentWindow.fastLoad(_url, true, false);
 
             return false;
 
             return false;
 
         };
 
         };
 
         window.openInRHS = function(_url) {
 
         window.openInRHS = function(_url) {
 
             $('#stag_mcp_rhs').attr('src', _url);
 
             $('#stag_mcp_rhs').attr('src', _url);
 
+            let videoBar = $('.stag-video-bar');
 
+            if(videoBar.is('.d-none')) {
 
+                videoBar.removeClass('d-none');
 
+            }
 
+            if(videoBar.is('.collapsed')) {
 
+                toggleVideoBar(videoBar);
 
+            }
 
             return false;
 
             return false;
 
         };
 
         };
 
         window.openInLHS = function(_url) {
 
         window.openInLHS = function(_url) {

+ 1 - 1
resources/views/app/patient/note/rhs-sidebar-nrc.blade.php
查看文件 

@@ -1,4 +1,4 @@
 
-<div class="note-rhs-sidebar screen-only" id="note-rhs-sidebar">
 
+<div class="note-rhs-sidebar screen-only pb-5" id="note-rhs-sidebar">
 
 
 
     <?php
 
     <?php
 
     $cmStartDate = date('Y-m-01', strtotime($note->effective_dateest));
 
     $cmStartDate = date('Y-m-01', strtotime($note->effective_dateest));

+ 1 - 1
resources/views/app/patient/note/rhs-sidebar.blade.php
查看文件 

@@ -1,4 +1,4 @@
 
-<div class="note-rhs-sidebar screen-only" id="note-rhs-sidebar">
 
+<div class="note-rhs-sidebar screen-only pb-5" id="note-rhs-sidebar">
 
 
 
     <?php
 
     <?php
 
     $cmStartDate = date('Y-m-01', strtotime($note->effective_dateest));
 
     $cmStartDate = date('Y-m-01', strtotime($note->effective_dateest));

+ 2 - 2
resources/views/layouts/template.blade.php
查看文件 

@@ -314,9 +314,9 @@
 
             </div>
 
             </div>
 
         </div>
 
         </div>
 
 
 
-        <a href="#" class="stag_rhs_toggle d-none d-md-block text-white" title="Toggle Video Pane">
 
+        <!--<a href="#" class="stag_rhs_toggle d-none d-md-block text-white" title="Toggle Video Pane">
 
             <i class="fa fa-arrow-right"></i>
 
             <i class="fa fa-arrow-right"></i>
 
-        </a>
 
+        </a>-->
 
     </nav>
 
     </nav>
 
 
 
     <main role="main" class="stag-content px-0">
 
     <main role="main" class="stag-content px-0">