MainPage.vue 1.7 KB

1234567891011121314151617181920212223242526272829303132333435363738394041424344454647484950515253545556575859606162636465666768697071727374757677
  1. <template>
  2. <div class="page-container">
  3. <Head @listenMenuId="getMenuId"></Head>
  4. <div class="container-bottom">
  5. <Nav :menuId="menuId" v-show="menuId"></Nav>
  6. <Content v-if="menuId"></Content>
  7. <home-page v-if="!menuId "></home-page>
  8. </div>
  9. </div>
  10. </template>
  11. <script>
  12. import Head from './homecomponents/Head'
  13. import Nav from './homecomponents/Nav'
  14. import Content from './homecomponents/Content'
  15. import HomePage from './homecomponents/HomePage'
  16. export default {
  17. name: "MainPage",
  18. components:{
  19. Head,Nav,Content,HomePage
  20. },
  21. data() {
  22. return {
  23. menuId: 0,
  24. menuName: []
  25. };
  26. },
  27. watch: {
  28. // 菜单头部浏览器前进或后退首页隐藏左边菜单
  29. '$route' (to, from) {
  30. if (to.path == '/mainPage') {
  31. this.menuId = 0
  32. }
  33. }
  34. },
  35. mounted() {
  36. },
  37. methods: {
  38. getMenuId: function(id,arr) {
  39. this.menuId = id;
  40. // if (menuName) {
  41. // this.menuName.push(menuName)
  42. // console.log('数组',this.menuName)
  43. // }
  44. sessionStorage.setItem('id', id);
  45. },
  46. // getMenuName (arr) {
  47. // // console.log(arr)
  48. // // this.menuName = arr
  49. // }
  50. }
  51. };
  52. </script>
  53. <style scoped lang="stylus">
  54. .page-container {
  55. width: 100%;
  56. height: 100%;
  57. }
  58. .container-bottom {
  59. flex: 1;
  60. display: flex;
  61. width: 100%;
  62. height: calc(100vh - 90px);
  63. // height: 100%;
  64. }
  65. /deep/ .ivu-input::-webkit-input-placeholder{
  66. color: #718EBD;
  67. }
  68. /deep/ .ivu-input::-moz-placeholder{ /* Mozilla Firefox 19+ */
  69. color: #718EBD;
  70. }
  71. /deep/ .ivu-input::-moz-placeholder{ /* Mozilla Firefox 4 to 18 */
  72. color: #718EBD;
  73. }
  74. /deep/ .ivu-input::-ms-input-placeholder{ /* Internet Explorer 10-11 */
  75. color: #718EBD;
  76. }
  77. </style>