article-info.html 3.4 KB

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