files.html 6.5 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106
  1. <include file="weixin@block:header"/>
  2. <!--<title>照片打印</title>-->
  3. <link rel="stylesheet" href="/static/weixin/lib/cropper/cropper.css?v={$version}">
  4. <link rel="stylesheet" href="/static/weixin/css/print.css?v={$version}">
  5. <div id="app" v-cloak>
  6. <header class="zyw-header">
  7. <div class="zyw-container white-color">
  8. <div class="head-l"><a href="javascript:history.go(-1);" target="_self"><img
  9. src="/static/weixin/img/svg/head-return.svg" alt=""></a></div>
  10. <h1>文件打印</h1>
  11. </div>
  12. </header>
  13. <section class="zyw-container" v-cloak>
  14. <div class="weui-print">
  15. <div v-if="picList.length>0" :id="'pic_'+k" :data-id="item.id" class="print-item file-box" v-for="(item,k) in picList">
  16. <div class="file-item">
  17. <div class="title">
  18. <div class="name"><img :src="'/static/weixin/img/file/'+item.file_type+'.png'" width="24" height="24" alt=""><span class="file-name" v-text="item.name"></span></div>
  19. <span class="page">共{{item.total_page}}页</span>
  20. </div>
  21. <div class="attr">
  22. <div class="item page-scope">
  23. <div class="item-name">页码范围</div>
  24. <div class="item-box">
  25. <input id="page-start" class="page-start" type="number" value="1" data-min="1">-<input id="page-end" class="page-end" type="number" :value="item.total_page" :data-max="item.total_page">
  26. </div>
  27. </div>
  28. <div class="item page-scope">
  29. <div class="item-name">打印数量</div>
  30. <div class="item-box">
  31. <div class="weui-count">
  32. <a class="weui-count__btn weui-count__decrease"></a>
  33. <input class="weui-count__number file-num" type="number" :value="item.nums?item.nums:1">
  34. <a class="weui-count__btn weui-count__increase"></a>
  35. </div>
  36. </div>
  37. </div>
  38. <div class="item page-scope">
  39. <div class="item-name">打印页面</div>
  40. <div class="item-box page-type">
  41. <button class="btn active">单面</button>
  42. <button class="btn">双面</button>
  43. </div>
  44. </div>
  45. <div class="item page-scope">
  46. <div class="item-name">打印类型</div>
  47. <div class="item-box print-type">
  48. <button class="btn active">黑白</button>
  49. <button class="btn">彩色</button>
  50. </div>
  51. </div>
  52. <div class="item page-scope">
  53. <div class="item-name"></div>
  54. <div class="item-box">
  55. <button v-if="item.file_type=='pdf' || item.file_type=='xls' || item.file_type=='xlsx'" class="btn preview" ><a :href="item.url?item.url:item.preview" target="_blank">预览</a></button>
  56. <button v-else class="btn preview"><a :href="'http://view.officeapps.live.com/op/view.aspx?src='+item.preview" target="_blank">预览</a></button>
  57. <!--<button class="preview" @click="preview(item)">预览</button>-->
  58. <button class="btn del" @click="picDel(k)">删除</button>
  59. </div>
  60. </div>
  61. </div>
  62. </div>
  63. </div>
  64. <div v-if="picList.length<=0" class="empty">
  65. <img src="/static/weixin/img/no-pic.png" width="80" height="80">
  66. </div>
  67. <div class="block"></div>
  68. </div>
  69. <div id="previewBox" class="weui-popup__container">
  70. <div class="weui-popup__overlay"></div>
  71. <div class="weui-popup__modal">
  72. <header class="zyw-header">
  73. <div class="zyw-container white-color">
  74. <div class="head-l"><a @click="hidePreview()" target="_self"><img
  75. src="/static/weixin/img/svg/head-return.svg" alt=""></a></div>
  76. <h1>文件预览</h1>
  77. </div>
  78. </header>
  79. <section class="content" style="width: 100%;height: 100%;">
  80. <!--<iframe v-if="fileData.file_type == 'doc' || fileData.file_type == 'docx' || fileData.file_type == 'xls' || fileData.file_type == 'xlsx' || fileData.file_type == 'ppt'" v-if="fileData.url" :src="'https://view.officeapps.live.com/op/view.aspx?src='+fileData.url" width='100%' height='100%' frameborder='1' ></iframe>
  81. <embed v-if="fileData.file_type=='pdf' || fileData.file_type=='pdfx'":src="ileData.url" type="application/pdf" width="100%" height="100%">-->
  82. <!--<a style="width: 100%;height: 100%;" class="media" href="http://print.dongerkj.com/upload/files/print/20191118/53ad362c62cd9197404a8c2ef2b8758a.pdf">预览</a>-->
  83. <!--<a class="media" :href="fileData.url">预览</a>-->
  84. <iframe id="preview" src="" width='100%' height='100%' frameborder='1' >
  85. </iframe>
  86. </section>
  87. </div>
  88. </div>
  89. <div class="weui-actions" v-cloak>
  90. <div class="weui-btn-area">
  91. <a class="weui-btn weui-btn_default" >
  92. <input type="file" @change="selectFile($event)">添加文件
  93. <!--<input type="file" accept=".doc,.docx,.xls,.xlsx,.pdf,.ppt,.pptx" @change="selectFile($event)">添加文件-->
  94. </a>
  95. <a v-if="printType==2" class="weui-btn weui-btn_default weui-btn_pink" @click="doSubmit()">拼团打印</a>
  96. <a v-else class="weui-btn weui-btn_default weui-btn_pink" @click="doSubmit()">文档打印</a>
  97. </div>
  98. </div>
  99. </section>
  100. </div>
  101. <script src="/static/weixin/lib/cropper/cropper.js?v={$version}"></script>
  102. <script src="/static/weixin/js/jweixin-1.4.0.js?v={$version}"></script>
  103. <script src="/static/weixin/js/files.js?v={$version}"></script>
  104. <include file="weixin@block:footer"/>