article-info.html 3.6 KB

1234567891011121314151617181920212223242526272829303132333435363738394041424344454647484950515253545556575859606162636465666768697071727374757677787980818283848586878889
  1. <!DOCTYPE html>
  2. <html>
  3. <head>
  4. <meta charset="UTF-8">
  5. <title></title>
  6. <!--<link rel="stylesheet" type="text/css" href="../../../css/bootstrap.min.css" />-->
  7. <link rel="stylesheet" type="text/css" href="../../../css/cross.css" />
  8. <link rel="stylesheet" type="text/css" href="../../../css/cross.ui.css" />
  9. <link rel="stylesheet" type="text/css" href="../../../css/style.min.css" />
  10. <link href="../../../plugins/toastr/toastr.min.css" rel="stylesheet">
  11. <style type="text/css">
  12. .article-content{
  13. padding-bottom: 60px;
  14. background-color: #fff;
  15. padding-left: 10px;
  16. padding-right: 10px;
  17. }
  18. .article-content img{
  19. width: 100%;
  20. }
  21. [v-cloak]{display: none;}
  22. </style>
  23. </head>
  24. <body style="height: auto;padding: 0 20px;">
  25. <div id="app" v-cloak>
  26. <h1 id="articleTitle" class="c-f16 c-bold c-t-center mtb20 mb12">{{it.articleTitle}}</h1>
  27. <div class="c-f12 c-909090 mb10">
  28. <span>{{it.updateTime | formatDate}}</span>
  29. <span class="fr">{{it.browseNumber}}人浏览</span>
  30. </div>
  31. <div id="articleContent" class="article-content c-f14 c-333" style="width: 100%; word-wrap:break-word" v-html="content"></div>
  32. </div>
  33. <script src="../../../js/vue.js" type="text/javascript" charset="utf-8"></script>
  34. <script src="../../../js/jquery-2.2.4.js"></script>
  35. <script src="../../../js/es6-promise.js" type="text/javascript" charset="utf-8"></script>
  36. <script src="../../../js/util.js" type="text/javascript" charset="utf-8"></script>
  37. <script src="../../../api/http-request.js" type="text/javascript" charset="utf-8"></script>
  38. <script type="text/javascript" src="../../../api/jbsc-api.js" ></script>
  39. <script type="application/javascript" src="../../../api/rehabilitation-api.js"></script>
  40. <script src="../../../js/underscore.js" type="text/javascript" charset="utf-8"></script>
  41. <script src="../../../plugins/toastr/toastr.min.js"></script>
  42. <!--<script src="../../../plugins/layer/layer.min.js"></script>-->
  43. <script type="text/javascript">
  44. var httpData=GetRequest();
  45. new Vue({
  46. el: "#app",
  47. data:{
  48. articleId: httpData['articleId'],
  49. content:'',
  50. it:{}
  51. },
  52. mounted: function(){
  53. this.initPage();
  54. },
  55. methods: {
  56. initPage:function() {
  57. var vm=this;
  58. params = { articleId: vm.articleId, userType: 1 };
  59. jbscAPI.getArticle(params).then(function(res) {
  60. if(res.status == 200) {
  61. var content = res.data.articleContent;
  62. //修改图片路径,处理图片服务防盗链的问题
  63. var domain = httpRequest.server+"/image/getRemoteByURL?imageURL=";
  64. var strRegex = /((https|http):\/\/)/g;
  65. content = content.replace(strRegex , domain + "$1");
  66. var reg=/group1\//g;
  67. vm.content = content.replace(reg,httpRequest.imgServer+ 'group1/');
  68. vm.it=res.data
  69. console.log(vm.content)
  70. // $("#xiangqing-content").html(html);
  71. // //禁止超链接执行默认行为
  72. // $("#xiangqing-content a").attr("onclick","return false");
  73. }
  74. });
  75. }
  76. },
  77. filters:{
  78. formatDate:function(str){
  79. if(str){
  80. return str.substr(0,19)
  81. }else{
  82. return "";
  83. }
  84. }
  85. }
  86. })
  87. </script>
  88. </body>
  89. </html>