detail.html 2.4 KB

1234567891011121314151617181920212223242526272829303132333435363738394041424344454647484950515253545556575859606162636465666768
  1. <!doctype html>
  2. <html>
  3. <head>
  4. <meta charset="UTF-8">
  5. <title>新闻详情</title>
  6. <meta name="viewport" content="width=device-width,initial-scale=1,minimum-scale=1,maximum-scale=1,user-scalable=no" />
  7. <link href="../../css/mui.min.css" rel="stylesheet" />
  8. <style>
  9. .icon{color: white;font-size: 20px;padding-top: 10px;}
  10. .mui-content{overflow:hidden;padding:15px;background-color: white;margin-top: 23px;}
  11. .mui-content img{width:100%;border-radius: 3px;}
  12. .title{font-size:18px;margin-top:20px;text-align:left;font-weight:700}
  13. .bq{font-size:13px;color:#a9a9a9;padding-top:10px;padding-bottom: 10px;}
  14. .content{font-size:13px;line-height:30px!important;color:#464646;letter-spacing:1.1px;text-align:left;padding:5px;overflow:hidden;margin-top:15px}
  15. .content img{width:100%!important;height:auto!important;text-align:center!important}
  16. .content p{color:#464646}
  17. .content span{color:#464646}
  18. </style>
  19. </head>
  20. <body>
  21. <div id="app">
  22. <header class="mui-bar mui-bar-nav">
  23. <a class="mui-action-back mui-icon mui-icon-left-nav mui-pull-left"></a>
  24. <h1 class="mui-title">新闻详情</h1>
  25. <!--<i @click="fx()" class="icon mui-pull-right">&#xe61a;</i>-->
  26. </header>
  27. <div class="mui-content">
  28. <div class="title">{{item.mTitle}}</div>
  29. <div class="bq">{{item.mTime}}</div>
  30. <div class="divider" style="margin-top: 15px;">
  31. <div class="line" style="width: 30%;"></div>
  32. <div class="text" style="width: 40%;">文章内容</div>
  33. <div class="line" style="width: 30%;"></div>
  34. <div class="clear"></div>
  35. </div>
  36. <div class="content" v-html="item.mContent"></div>
  37. </div>
  38. </div>
  39. <script src="../../js/mui.min.js"></script>
  40. <script src="../../js/app.js"></script>
  41. <script src="../../js/vue.min.js"></script>
  42. <script type="text/javascript">
  43. var vm = new Vue({
  44. el: "#app",
  45. data: {
  46. item: {}
  47. },
  48. mounted: function() {
  49. mui.plusReady(function() {
  50. var obj = plus.webview.currentWebview();
  51. request(urls().news_detail, {id: obj.param.id}, function(res) {
  52. vm.item = res;
  53. plus.nativeUI.closeWaiting();
  54. })
  55. })
  56. },
  57. methods: {
  58. //分享
  59. fx: function() {
  60. plus.share.sendWithSystem({content: vm.item.mTitle +' 链接:'+urls().path + '/news/share/'+ vm.item.id});
  61. },
  62. }
  63. })
  64. </script>
  65. </body>
  66. </html>