menu.html 5.5 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103
  1. <!DOCTYPE html>
  2. <html>
  3. <head>
  4. <meta charset="UTF-8">
  5. <title>应用菜单</title>
  6. <link rel="shortcut icon" href="../../../favicon.ico">
  7. <link rel="stylesheet" type="text/css" href="../../../css/font-awesome.min.css"/>
  8. <link rel="stylesheet" type="text/css" href="../../../css/bootstrap.min.css"/>
  9. <link rel="stylesheet" type="text/css" href="../../../plugins/artDialog/6.0.5/api/css/ui-dialog.css"/>
  10. <link rel="stylesheet" type="text/css" href="../../../css/style.min.css"/>
  11. <link rel="stylesheet" type="text/css" href="../../../css/cross.css"/>
  12. <style>
  13. body{
  14. border-right: 1px solid #e1e1e1;
  15. }
  16. .row{
  17. /*border-bottom: 1px solid #e1e1e1;
  18. border-right: 1px solid #e1e1e1;*/
  19. }
  20. .col-xs-6{
  21. border-right: 1px solid #e1e1e1;
  22. border-bottom: 1px solid #e1e1e1;
  23. padding: 15px 0;
  24. text-align: center;
  25. }
  26. .col-xs-6.disabled{
  27. background-color: #f2f4f6;
  28. }
  29. .col-xs-6.active {background-color: #12b7f5;}
  30. .col-xs-6.active>a{
  31. color: #fff;
  32. }
  33. </style>
  34. </head>
  35. <body>
  36. <div id="main" class="container">
  37. <div class="row">
  38. <div class="col-xs-6" :class="{'active': selectedTab == 1, 'disabled': disableTabs.indexOf(1)>-1}">
  39. <a href="" target="view_frame" @click="chooseTab(1)">
  40. <img :src="selectedTab==1?'../../../images/xufangguanli_icon.png':'../../../images/xufangguanli02_icon.png'">
  41. <div class="mt10 c-f16">续方管理</div>
  42. </a>
  43. </div>
  44. <div class="col-xs-6" :class="{'active': selectedTab==2, 'disabled': disableTabs.indexOf(2)>-1}">
  45. <a href="../../../../health-education/index.html" target="view_frame" @click="chooseTab(2)">
  46. <img :src="selectedTab==2?'../../../images/jiankangjiaoyu_icon.png':'../../../images/jiankangjiaoyu02_icon.png'">
  47. <div class="mt10 c-f16">健康教育</div>
  48. </a>
  49. </div>
  50. <div class="col-xs-6" :class="{'active': selectedTab == 3, 'disabled': disableTabs.indexOf(3)>-1}">
  51. <a href="../../followup/html/followup_tabs.html" target="view_frame" @click="chooseTab(3)">
  52. <img :src="selectedTab==3?'../../../images/suifangjihua_icon.png':'../../../images/suifangjihua02_icon.png'">
  53. <div class="mt10 c-f16">随访计划</div>
  54. </a>
  55. </div>
  56. <div class="col-xs-6" :class="{'active': selectedTab == 4, 'disabled': disableTabs.indexOf(4)>-1}">
  57. <a href="../../statistics/html/home.html" target="view_frame" @click="chooseTab(4)">
  58. <img :src="selectedTab == 4?'../../../images/tongjifenxi_icon.png' : '../../../images/tongjifenxi02_icon.png'">
  59. <div class="mt10 c-f16">统计分析</div>
  60. </a>
  61. </div>
  62. <div class="col-xs-6" :class="{'active': selectedTab == 5, 'disabled': disableTabs.indexOf(5)>-1}">
  63. <a href="../../jbsc/html/statistics.html" target="view_frame" @click="chooseTab(5)">
  64. <img :src="selectedTab == 5?'../../../images/jibingshaicha_icon.png' : '../../../images/jibingshaicha02_icon.png'">
  65. <div class="mt10 c-f16">疾病筛查</div>
  66. </a>
  67. </div>
  68. <div class="col-xs-6" :class="{'active': selectedTab == 6, 'disabled': disableTabs.indexOf(6)>-1}">
  69. <a href="../../sign/html/sign_manage.html" target="view_frame" @click="chooseTab(6)">
  70. <img :src="selectedTab == 6?'../../../images/qianyuguanli_icon.png' : '../../../images/qianyuguanli02_icon.png'">
  71. <div class="mt10 c-f16">签约管理</div>
  72. </a>
  73. </div>
  74. <div class="col-xs-6" :class="{'active': selectedTab == 7, 'disabled': disableTabs.indexOf(7)>-1}">
  75. <a href="../../rehabilitation/html/health_control.html" target="view_frame" @click="chooseTab(7)">
  76. <img :src="selectedTab == 7?'../../../images/kuangfuguanli_icon.png' : '../../../images/kuangfuguanli02_icon.png'">
  77. <div class="mt10 c-f16">康复管理</div>
  78. </a>
  79. </div>
  80. </div>
  81. </div>
  82. <script src="../../../js/vue.js" type="text/javascript" charset="utf-8"></script>
  83. <script src="../../../js/jquery-2.2.4.js"></script>
  84. <script src="../../../js/bootstrap.min.js"></script>
  85. <script src="../../../js/es6-promise.js" type="text/javascript" charset="utf-8"></script>
  86. <script src="../../../js/underscore.js" type="text/javascript" charset="utf-8"></script>
  87. <script src="../../../js/util.js" type="text/javascript" charset="utf-8"></script>
  88. <script type="text/javascript">
  89. new Vue({
  90. el: "#main",
  91. data: {
  92. selectedTab: 0,
  93. disableTabs: [2]
  94. },
  95. methods: {
  96. chooseTab: function(val){
  97. this.selectedTab = val;
  98. }
  99. }
  100. })
  101. </script>
  102. </body>
  103. </html>