| | |
| | | <template> |
| | | <div class="column"> |
| | | <div class="column-left" :style="`height:${screenHeight}px;`"> |
| | | <div class="column-left" > |
| | | <div class="resize-bar"></div> |
| | | <div class="resize-line"></div> |
| | | <div class="resize-save"> |
| | | <left-nav :appName="'Video'" :height="screenHeight - 40"></left-nav> |
| | | <left-nav :appName="'Camera'" :height="screenHeight - 40"></left-nav> |
| | | </div> |
| | | </div> |
| | | <div class="column-right" :style="`height:${screenHeight}px;`"> |
| | | <div class="column-right" > |
| | | <right-side /> |
| | | </div> |
| | | <card-window></card-window> |
| | | </div> |
| | | </template> |
| | | |
| | | <script> |
| | | import LeftNav from "@/components/LeftNav"; |
| | | // import CameraVideo from "./components/Video.vue"; |
| | | import RightSide from "./Video" |
| | | import RightSide from "./Video"; |
| | | import CardWindow from "@/components/cardWindow"; |
| | | |
| | | export default { |
| | | name: "CameraVideo", |
| | | components: { |
| | | LeftNav, |
| | | RightSide |
| | | RightSide, |
| | | CardWindow |
| | | }, |
| | | data() { |
| | | return { |
| | |
| | | </script> |
| | | |
| | | <style lang="scss" scoped> |
| | | |
| | | .column { |
| | | overflow: hidden; |
| | | min-width: 1399px; |
| | | height: 100%; |
| | | } |
| | | .column-left { |
| | | height: inherit; |
| | | background-color: #fff; |
| | | position: relative; |
| | | float: left; |
| | | height: 100vh; |
| | | //height: inherit; |
| | | } |
| | | .column-right { |
| | | height: 100%; |
| | | padding: 16px; |
| | | height: 100vh; |
| | | background-color: #eee; |
| | | box-sizing: border-box; |
| | | overflow: hidden; |
| | | //overflow: hidden; |
| | | overflow-x: auto; |
| | | overflow-y: auto; |
| | | } |
| | | .resize-save { |
| | | position: absolute; |
| | |
| | | right: 5px; |
| | | bottom: 0; |
| | | left: 0; |
| | | padding: 16px; |
| | | padding: 14px; |
| | | overflow-x: hidden; |
| | | } |
| | | .resize-bar { |
| | |
| | | right: 0; |
| | | top: 0; |
| | | bottom: 0; |
| | | z-index: 100; |
| | | border-right: 2px solid #eee; |
| | | border-left: 1px solid #bbb; |
| | | border-right: 2px solid #efefef; |
| | | border-left: 1px solid #e0e0e0; |
| | | pointer-events: none; |
| | | } |
| | | .resize-bar:hover ~ .resize-line, |