ws_inp.jsp 40 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367368369370371372373374375376377378379380381382383384385386387388389390391392393394395396397398399400401402403404405406407408409410411412413414415416417418419420421422423424425426427428429430431432433434435436437438439440441442443444445446447448449450451452453454455456457458459460461462463464465466467468469470471472473474475476477478479480481482483484485486487488489490491492493494495496497498499500501502503504505506507508509510511512513514515516517518519520521522523524525526527528529530531532533534535536537538539540541542543544545546547548549550551552553554555556557558559560561562563564565566567568569570571572573574575576577578579580581582583584585586587588589590591592593594595596597598599600601602603604605606607608609610611612613614615616617618619620621622623624625626627628629630631632633634635636637638639640641642643644645646647648649650651652653654655656657658659660661662663664665666667668669670671672673674675676677678679680681682683684685686687688689690691692693694695696697698699700701702703704705706707708709710711712713714715716717718719720721722723724725726727728729730731732733734735736737738739740741742743744745746747748749750751752753754755756757758759760761762763764765766767768769770771772773774775776777778779780781782783784785786787788789790791792793794795796797798799800801802803804805806807808809810811812813814815816817818819820821822823824825826827828829830831832833834835836837838839840841842843844845846847848849850851852853854855856857858859860861862863864865866867868869870871872873874875876877878879880881882883884885886887888889890891892893894895896897898899900901902903904905906907908909910911912913914915916917918919920921922923924925926927928929930931932933934935936937938939940941942943944945946947948949950951952953954955956957958959960961962963964965966967968969970971972973974975976977978979980981982983984985986987988989990991992993994995996997998999100010011002100310041005100610071008100910101011101210131014101510161017101810191020102110221023102410251026102710281029103010311032103310341035103610371038103910401041104210431044104510461047104810491050105110521053105410551056105710581059106010611062106310641065106610671068
  1. <%@ page language="java" pageEncoding="UTF-8" isELIgnored="false" %>
  2. <%@ taglib uri="/ssTag" prefix="ss"%>
  3. <% pageContext.setAttribute(ss.page.PageC.PAGE_objName,"ws");%>
  4. <%pageContext.setAttribute("wdpageinformation","{'hastab':'0'}");%>
  5. <!DOCTYPE html>
  6. <!-- 引入必要的JavaScript库 -->
  7. <script type="text/javascript" src="/ss/jquery/jquery1.11.3.min.js"></script>
  8. <script type="text/javascript" src="/ss/jquery/jquery.form.min.js"></script>
  9. <script type="text/javascript" src="/ss/js/upload.js"></script>
  10. <div class='content-div' ssFith="true">
  11. <table class='form'>
  12. <tr>
  13. <th>上传原件</th>
  14. <td>
  15. <!-- 上传按钮 - upload.js会绑定点击事件 -->
  16. <input type="button" id="scyjEdit" class="content-button" value="选择文件..."/>
  17. <!-- 文件信息显示区域 - upload.js必需的元素 -->
  18. <span id="scyjBaseName" class="file-info"></span>
  19. <!-- 操作按钮区域 - upload.js控制显示/隐藏 -->
  20. <span class="file-action">
  21. <button id="checkScyj" style="display:none;" onclick="checkFile('scyj')">查看</button>
  22. <button id="qxScyj" style="display:none;" onclick="uploadFileClean('scyj')">删除</button>
  23. </span>
  24. </td>
  25. <th>上传后路径</th>
  26. <td>
  27. <!-- upload.js上传成功后会将路径填充到这里 -->
  28. <input mc="mc" name="scyjwj" id="scyjpath" value="" style="width: 300px;"/>
  29. <!-- 隐藏的文件名输入框,upload.js需要 -->
  30. <input type="hidden" name="scyjBaseName" value=""/>
  31. </td>
  32. <td>
  33. <input id="path" name='uploadPath' style="width: 200px;"/>
  34. </td>
  35. </tr>
  36. <!-- 新增:生成原件行 -->
  37. <tr>
  38. <th>生成原件</th>
  39. <td colspan="4">
  40. <input type="button" id="generateDocumentBtn" class="content-button" value="生成原件"
  41. onclick="generateOfficialDocument()"
  42. style="background-color: #1890ff; color: white; border: 1px solid #1890ff;"/>
  43. <span id="generateStatus" style="margin-left: 10px; color: #666; font-size: 12px;"></span>
  44. </td>
  45. </tr>
  46. <!-- Vue 桥接 API 测试按钮(可删除) -->
  47. <tr>
  48. <th>桥接API测试</th>
  49. <td colspan="4">
  50. <b>编辑器操作:</b><br/>
  51. <input type="button" class="content-button" value="读取内容"
  52. onclick="readEditorContent()"
  53. style="margin: 2px 5px 2px 0;"/>
  54. <input type="button" class="content-button" value="写入示例"
  55. onclick="writeEditorContent()"
  56. style="margin: 2px 5px 2px 0;"/>
  57. <input type="button" class="content-button" value="清空编辑器"
  58. onclick="clearEditorWithConfirm()"
  59. style="margin: 2px 5px 2px 0;"/>
  60. <br/>
  61. <b>普通字段:</b><br/>
  62. <input type="button" class="content-button" value="读取标题"
  63. onclick="alert('标题: ' + (readFormTitle() || '未填写'))"
  64. style="margin: 2px 5px 2px 0;"/>
  65. <input type="button" class="content-button" value="设置标题"
  66. onclick="setFormTitle()"
  67. style="margin: 2px 5px 2px 0;"/>
  68. <br/>
  69. <b>下拉框操作:</b><br/>
  70. <input type="button" class="content-button" value="读取文书类别"
  71. onclick="readDocumentType()"
  72. style="margin: 2px 5px 2px 0;"/>
  73. <input type="button" class="content-button" value="随机设置文书类别"
  74. onclick="setDocumentType()"
  75. style="margin: 2px 5px 2px 0;"/>
  76. <input type="button" class="content-button" value="自动匹配文书类别"
  77. onclick="autoSelectDocumentType()"
  78. style="margin: 2px 5px 2px 0;"/>
  79. <br/>
  80. <b>批量操作:</b><br/>
  81. <input type="button" class="content-button" value="读取所有下拉框"
  82. onclick="readAllDropdowns()"
  83. style="margin: 2px 5px 2px 0;"/>
  84. <input type="button" class="content-button" value="批量设置数据"
  85. onclick="batchSetFormData()"
  86. style="margin: 2px 5px 2px 0;"/>
  87. <input type="button" class="content-button" value="读取完整表单"
  88. onclick="readFullFormData()"
  89. style="margin: 2px 5px 2px 0;"/>
  90. <br/>
  91. <span style="color: #999; font-size: 12px;">详见函数定义及 /docs/普通JS读写Vue数据方法.md</span>
  92. </td>
  93. </tr>
  94. <tr>
  95. <th>文书类别</th>
  96. <td>
  97. <script>
  98. ss.dom.formElemConfig.wslbm={val:'${ws.wslbm}',type:window.ss.dom.TYPE.OBJP};
  99. </script>
  100. <ss-objp
  101. :opt="wslbmOption"
  102. placeholder="请选择文书类别"
  103. :inp="false"
  104. url="<ss:serv name='loadObjpOpt' parm='{"objectpickerdropdown1":"1"}' />"
  105. cb="wslb"
  106. v-model="wslbm"
  107. name="wslbm"
  108. :readonly="false"
  109. style="width: 200px;"
  110. >
  111. </ss-objp>
  112. </td>
  113. <th>密级</th>
  114. <td>
  115. <script>
  116. ss.dom.formElemConfig.wsmjm={val:'${ws.wsmjm}',type:window.ss.dom.TYPE.OBJP};
  117. </script>
  118. <ss-objp
  119. :opt="wsmjmOption"
  120. placeholder="请选择文书密级"
  121. :inp="false"
  122. url="<ss:serv name='loadObjpOpt' parm='{"objectpickerdropdown1":"1"}' />"
  123. cb="wsmj"
  124. v-model="wsmjm"
  125. name="wsmjm"
  126. :readonly="false"
  127. style="width: 200px;"
  128. >
  129. </ss-objp>
  130. </td>
  131. </tr>
  132. <tr>
  133. <th>范围</th>
  134. <td>
  135. <script>
  136. ss.dom.formElemConfig.wsfwm={val:'${ws.wsfwm}',type:window.ss.dom.TYPE.OBJP};
  137. </script>
  138. <ss-objp
  139. :opt="wsfwmOption"
  140. placeholder="请选择文书范围"
  141. :inp="false"
  142. url="<ss:serv name='loadObjpOpt' parm='{"objectpickerdropdown1":"1"}' />"
  143. cb="wsfw"
  144. v-model="wsfwm"
  145. name="wsfwm"
  146. :readonly="false"
  147. style="width: 200px;"
  148. >
  149. </ss-objp>
  150. </td>
  151. <th>管理类别</th>
  152. <td>
  153. <script>
  154. ss.dom.formElemConfig.gllbm={val:'${ws.gllbm}',type:window.ss.dom.TYPE.OBJP};
  155. </script>
  156. <ss-objp
  157. :opt="gllbmOption"
  158. placeholder="请选择管理类别"
  159. :inp="false"
  160. url="<ss:serv name='loadObjpOpt' parm='{"objectpickerdropdown1":"1"}' />"
  161. cb="gllb"
  162. v-model="gllbm"
  163. name="gllbm"
  164. :readonly="false"
  165. style="width: 200px;"
  166. >
  167. </ss-objp>
  168. </td>
  169. </tr>
  170. <tr>
  171. <th>标题</th>
  172. <td colspan="3">
  173. <%--自动生成:ws.bt--%>
  174. <script>
  175. ss.dom.formElemConfig.bt={val:'<ss:txt val='${ws.bt}'/>',type:window.ss.dom.TYPE.INPUT};
  176. </script>
  177. <ss-inp
  178. placeholder="请输入标题"
  179. v-model="bt"
  180. name="bt"
  181. :readonly="false"
  182. style="width: 100%;"
  183. >
  184. </ss-inp>
  185. </td>
  186. </tr>
  187. <tr>
  188. <th>摘要</th>
  189. <td colspan="3">
  190. <%--自动生成:ws.zy--%>
  191. <script>
  192. ss.dom.formElemConfig.zy={val:'<ss:txt val='${ws.zy}'/>',type:window.ss.dom.TYPE.INPUT};
  193. </script>
  194. <ss-inp
  195. placeholder="请输入摘要"
  196. v-model="zy"
  197. name="zy"
  198. :readonly="false"
  199. style="width: 100%;"
  200. >
  201. </ss-inp>
  202. </td>
  203. </tr>
  204. <tr>
  205. <th>正文</th>
  206. <td colspan="3">
  207. <script>
  208. // 处理函数定义
  209. window.handleInsertTemplate = function(context) {
  210. var templateHtml = '<div style="border: 1px solid #ccc; padding: 20px; margin: 10px 0; background: #f5f5f5;">' +
  211. '<h3 style="text-align: center;">公文模板</h3>' +
  212. '<p> 请输入正文内容...</p>' +
  213. '<p style="text-align: right;">(此段落为模板示例)</p>' +
  214. '</div>';
  215. var currentContent = context.getValue() || '';
  216. context.setValue(currentContent + templateHtml);
  217. if (context.editor && context.editor.insertHTML) {
  218. context.editor.insertHTML(templateHtml);
  219. }
  220. alert('已插入公文模板!');
  221. };
  222. window.handleClearEditor = function(context) {
  223. if (confirm('确定要清空正文内容吗?')) {
  224. context.setValue('');
  225. if (window.ss && window.ss.dom && window.ss.dom.set) {
  226. window.ss.dom.set('zwwjHtml', '');
  227. }
  228. alert('正文内容已清空!');
  229. }
  230. };
  231. // zwwj 配置(按钮移到 param 中)
  232. ss.dom.formElemConfig.zwwj = {
  233. val: '${ws.zwwj}',
  234. type: window.ss.dom.TYPE.HTML
  235. };
  236. ss.dom.formElemConfig.zwwjHtml = {val: '', type: window.ss.dom.TYPE.INPUT};
  237. </script>
  238. <ss-editor
  239. :height="420"
  240. url="<ss:serv name='loadEditorBody' />"
  241. :param="{'mode':'${dataType=='change'?'change':'edit'}','button':[{'desc':'附件','name':'fjid','val':'${ws.fjid}','cmsUpdUrl':'<ss:serv name='regCms' dest='cmsHome' />','cmsAddUrl':'<ss:serv name='makeAttCms' />'},{'desc':'插入模板','name':'insertTemplate','icon':'editor-icon-file','func':'window.handleInsertTemplate'},{'desc':'清空','name':'clearContent','icon':'editor-icon-eraser','func':'window.handleClearEditor'}],'obj':'ws','jlztm':'${ws.jlztm}'}"
  242. v-model="zwwj"
  243. :html="zwwjHtml"
  244. name="zwwj"
  245. mode="edit"
  246. width="700px"
  247. >
  248. </ss-editor>
  249. <!-- 【TEST】mode="play" 只读模式测试 by xu 20250402 -->
  250. <tr>
  251. <th>正文(只读模式测试)</th>
  252. <td colspan="3">
  253. <script>
  254. // 只读模式测试:带默认 HTML 内容 by xu 20250402
  255. ss.dom.formElemConfig.zwwjTest = {val: '${ws.zwwj}', type: window.ss.dom.TYPE.HTML};
  256. ss.dom.formElemConfig.zwwjTestHtml = {
  257. val: '<h2 style="color: #333; border-bottom: 2px solid #1890ff; padding-bottom: 10px;">测试文书标题</h2>' +
  258. '<p style="line-height: 1.8; color: #666;">这是一段测试内容,用于展示 <strong>mode="play"</strong> 只读模式的效果。</p>' +
  259. '<p style="line-height: 1.8; color: #666;">在只读模式下:</p>' +
  260. '<ul style="color: #666;">' +
  261. '<li>不加载 Jodit 编辑器</li>' +
  262. '<li>直接渲染 HTML 内容</li>' +
  263. '<li>保留附件按钮功能</li>' +
  264. '</ul>' +
  265. '<p style="margin-top: 20px; padding: 10px; background: #f5f5f5; border-left: 3px solid #1890ff;">' +
  266. '<strong>备注:</strong>此区域为只读展示,如需编辑请使用上方的编辑器。' +
  267. '</p>',
  268. type: window.ss.dom.TYPE.INPUT
  269. };
  270. </script>
  271. <ss-editor
  272. mode="play"
  273. :height="300"
  274. url="<ss:serv name='loadEditorBody' />"
  275. :param="{'mode':'view','obj':'ws','jlztm':'${ws.jlztm}','button':[{'desc':'附件','name':'fjid','val':'${ws.fjid}','cmsUpdUrl':'<ss:serv name='regCms' dest='cmsHome' />','cmsAddUrl':'<ss:serv name='makeAttCms' />'}]}"
  276. v-model="zwwjTest"
  277. :html="zwwjTestHtml"
  278. name="zwwjTest"
  279. width="700px"
  280. >
  281. </ss-editor>
  282. </td>
  283. </tr>
  284. </td>
  285. </tr>
  286. <tr>
  287. <th>拟稿人员</th>
  288. <td>
  289. <script>
  290. ss.dom.formElemConfig.ngryid={val:'${ws.ngryid}',type:window.ss.dom.TYPE.OBJP};
  291. </script>
  292. <ss-objp
  293. :opt="ngryidOption"
  294. placeholder="请选择拟稿人员"
  295. :inp="false"
  296. url="<ss:serv name='loadObjpOpt' parm='{"objectpickerdropdown1":"1"}' />"
  297. cb="ry"
  298. v-model="ngryid"
  299. name="ngryid"
  300. :readonly="false"
  301. style="width: 170px;"
  302. >
  303. </ss-objp>
  304. </td>
  305. <th>拟稿部门</th>
  306. <td>
  307. <script>
  308. ss.dom.formElemConfig.ngbmid={val:'${ws.ngbmid}',type:window.ss.dom.TYPE.OBJP};
  309. </script>
  310. <ss-objp
  311. :opt="ngbmidOption"
  312. placeholder="请选择拟稿部门"
  313. :inp="false"
  314. url="<ss:serv name='loadObjpOpt' parm='{"objectpickerdropdown1":"1"}' />"
  315. cb="bm"
  316. v-model="ngbmid"
  317. name="ngbmid"
  318. :readonly="false"
  319. style="width: 170px;"
  320. >
  321. </ss-objp>
  322. </td>
  323. </tr>
  324. </table>
  325. </div>
  326. <!-- 将所有JavaScript函数和初始化代码集中放在这里 -->
  327. <script>
  328. // 全局变量定义
  329. var wd = window.wd || {};
  330. wd.app = wd.app || {name: 'defaultApp'};
  331. // 生成原件按钮状态
  332. var isGenerating = false;
  333. // 获取账户信息函数
  334. function getAccountInfo() {
  335. return {
  336. xmmc: 'defaultProject'
  337. };
  338. }
  339. function checkFile(fileId) {
  340. var filePath = $('input[name="' + fileId + 'wj"]').val();
  341. if (!filePath) {
  342. alert('请先上传文件');
  343. return;
  344. }
  345. alert('文件路径:' + filePath + '\n点击确定后将尝试打开文件');
  346. window.open(filePath, '_blank');
  347. }
  348. // upload.js 需要的清理文件函数
  349. function uploadFileClean(id) {
  350. $('#' + id + 'Name').html('');
  351. $('input[name="' + id + 'wj"]').val('');
  352. $('#' + id + 'Edit_File').val('');
  353. $('#' + id + 'path').val('');
  354. $("#qx" + id).hide();
  355. $("#check" + id).hide();
  356. // 同时清空文件名显示
  357. $('#' + id + 'BaseName').html('');
  358. $('input[name="' + id + 'BaseName"]').val('');
  359. };
  360. // 生成原件函数
  361. function generateOfficialDocument() {
  362. if (isGenerating) {
  363. return; // 防止重复点击
  364. }
  365. var title = "1233333";
  366. // 使用桥接 API 读取 Vue 数据(方式2:从 zwwjHtml 读取编辑器内容)
  367. // 文档:/docs/普通JS读写Vue数据方法.md
  368. var htmlContent = window.ss.dom.get('zwwjHtml') || '';
  369. if (!htmlContent || htmlContent.trim() === '') {
  370. if (!confirm('正文内容为空,确定要生成空白公文吗?')) {
  371. return;
  372. }
  373. }
  374. // 收集生成参数
  375. var params = {
  376. institutionName: '广州工商学院',
  377. documentNumber: '数教函〔2026〕2号',
  378. documentTitle: title,
  379. htmlContent: htmlContent,
  380. sender: '数字教育与装备中心',
  381. receiver: '各学院、各部门:',
  382. hasAttachment: false,
  383. attachmentInfo: '',
  384. sealImagePath: 'D:\\tmp\\seal\\yz2.png',
  385. enableSeal: true
  386. };
  387. // 开始生成
  388. generateAndUploadDocument(params);
  389. }
  390. // 生成并上传公文
  391. function generateAndUploadDocument(params) {
  392. isGenerating = true;
  393. $('#generateStatus').html('正在生成公文...').css('color', '#1890ff');
  394. $('#generateDocumentBtn').prop('disabled', true).css('opacity', 0.7);
  395. // 使用XMLHttpRequest来获取二进制数据
  396. var xhr = new XMLHttpRequest();
  397. xhr.open('POST', "<ss:serv name='ws_zh_schtwj'/>", true);
  398. xhr.setRequestHeader('Content-Type', 'application/x-www-form-urlencoded; charset=UTF-8');
  399. xhr.responseType = 'arraybuffer';
  400. // 构建请求参数
  401. var formData = new URLSearchParams();
  402. formData.append('institutionName', params.institutionName);
  403. formData.append('documentNumber', params.documentNumber);
  404. formData.append('documentTitle', params.documentTitle);
  405. formData.append('htmlContent', params.htmlContent);
  406. formData.append('sealImagePath', params.sealImagePath);
  407. formData.append('sender', params.sender);
  408. formData.append('receiver', params.receiver);
  409. formData.append('hasAttachment', params.hasAttachment);
  410. formData.append('attachmentInfo', params.attachmentInfo);
  411. formData.append('enableSeal', params.enableSeal);
  412. // 监听进度事件
  413. xhr.addEventListener('progress', function(e) {
  414. if (e.lengthComputable) {
  415. var percentComplete = (e.loaded / e.total) * 100;
  416. $('#generateStatus').html('生成中... ' + Math.round(percentComplete) + '%');
  417. }
  418. }, false);
  419. xhr.onload = function() {
  420. if (xhr.status === 200) {
  421. // 检查响应类型
  422. var contentType = xhr.getResponseHeader('Content-Type');
  423. if (contentType && contentType.indexOf('application/pdf') !== -1) {
  424. // 获取ArrayBuffer
  425. var arrayBuffer = xhr.response;
  426. if (!arrayBuffer || arrayBuffer.byteLength === 0) {
  427. $('#generateStatus').html('PDF文件流为空').css('color', '#ff4d4f');
  428. alert('生成的PDF文件为空,请检查服务器端');
  429. return;
  430. }
  431. // 创建Blob
  432. var blob = new Blob([arrayBuffer], { type: 'application/pdf' });
  433. var fileName = params.documentTitle.replace(/[^\u4e00-\u9fa5a-zA-Z0-9]/g, '_') + '.pdf';
  434. if (blob.size === 0) {
  435. $('#generateStatus').html('Blob对象为空').css('color', '#ff4d4f');
  436. alert('生成的PDF文件为空,请检查服务器端');
  437. return;
  438. }
  439. // 上传生成的PDF文件
  440. uploadGeneratedPdf(blob, fileName, function(uploadResult) {
  441. if (uploadResult && uploadResult.fileList && uploadResult.fileList.length > 0) {
  442. var filePath = uploadResult.fileList[0].path;
  443. var fileName = uploadResult.fileList[0].fileName;
  444. // 回填到上传路径输入框
  445. var fullFilePath = filePath;
  446. $('#scyjpath').val(fullFilePath);
  447. $('input[name="scyjwj"]').val(fullFilePath);
  448. $('input[name="uploadPath"]').val(fullFilePath);
  449. $('#scyjBaseName').text(fileName);
  450. $('input[name="scyjBaseName"]').val(fileName);
  451. $('#checkScyj').show();
  452. $('#qxScyj').show();
  453. $('#generateStatus').html('生成并上传成功!').css('color', '#52c41a');
  454. alert('公文生成并上传成功!文件路径:' + fullFilePath);
  455. } else {
  456. $('#generateStatus').html('上传失败').css('color', '#ff4d4f');
  457. alert('上传失败,请重试');
  458. }
  459. });
  460. } else {
  461. // 尝试将响应解析为JSON
  462. try {
  463. var decoder = new TextDecoder('utf-8');
  464. var text = decoder.decode(new Uint8Array(xhr.response));
  465. var result = JSON.parse(text);
  466. if (result.success === false) {
  467. $('#generateStatus').html('生成失败:' + (result.message || '未知错误')).css('color', '#ff4d4f');
  468. alert('生成失败:' + (result.message || '未知错误'));
  469. } else {
  470. $('#generateStatus').html('未知响应格式').css('color', '#ff4d4f');
  471. alert('未知响应格式,请检查接口');
  472. }
  473. } catch (e) {
  474. $('#generateStatus').html('响应解析失败').css('color', '#ff4d4f');
  475. alert('服务器响应异常:' + e.message);
  476. }
  477. }
  478. } else {
  479. $('#generateStatus').html('生成失败,状态码:' + xhr.status).css('color', '#ff4d4f');
  480. alert('生成失败,HTTP状态码:' + xhr.status);
  481. }
  482. };
  483. xhr.onerror = function() {
  484. $('#generateStatus').html('生成失败:网络错误').css('color', '#ff4d4f');
  485. alert('生成失败:网络错误,请检查网络连接');
  486. };
  487. xhr.onloadend = function() {
  488. isGenerating = false;
  489. $('#generateDocumentBtn').prop('disabled', false).css('opacity', 1);
  490. };
  491. xhr.send(formData.toString());
  492. }
  493. // 上传生成的PDF文件
  494. function uploadGeneratedPdf(blob, fileName, callback) {
  495. $('#generateStatus').html('正在上传文件...').css('color', '#1890ff');
  496. if (blob.size === 0) {
  497. alert('要上传的文件为空,无法上传');
  498. callback(null);
  499. return;
  500. }
  501. // 创建FormData
  502. var formData = new FormData();
  503. formData.append('file', blob, fileName);
  504. formData.append('name', fileName);
  505. formData.append('type', 'document');
  506. formData.append('app', wd.app ? wd.app.name : getAccountInfo().xmmc);
  507. // 使用原有的上传接口
  508. $.ajax({
  509. url: "/service?ssServ=ulByHttp&type=document",
  510. type: 'POST',
  511. data: formData,
  512. processData: false,
  513. contentType: false,
  514. xhr: function() {
  515. var xhr = new XMLHttpRequest();
  516. xhr.upload.addEventListener('progress', function(e) {
  517. if (e.lengthComputable) {
  518. var percentComplete = (e.loaded / e.total) * 100;
  519. $('#generateStatus').html('上传中... ' + Math.round(percentComplete) + '%');
  520. }
  521. }, false);
  522. return xhr;
  523. },
  524. beforeSend: function() {
  525. },
  526. success: function(result) {
  527. try {
  528. if (typeof result === 'string') {
  529. result = JSON.parse(result);
  530. }
  531. if (result && result.fileList && result.fileList.length > 0) {
  532. callback(result);
  533. } else {
  534. callback(result);
  535. }
  536. } catch (e) {
  537. console.error('解析上传响应失败:', e);
  538. callback(null);
  539. }
  540. },
  541. error: function(xhr, status, error) {
  542. console.error('文件上传失败:', error);
  543. alert('文件上传失败:' + error);
  544. callback(null);
  545. }
  546. });
  547. }
  548. // 页面加载完成后初始化上传功能
  549. $(document).ready(function () {
  550. // 检查upload.js是否已加载
  551. if (typeof $.fn.uploadFile === 'undefined') {
  552. console.error('upload.js 未正确加载');
  553. alert('文件上传插件加载失败,请联系管理员');
  554. return;
  555. }
  556. // 调试:检查按钮是否存在
  557. // 初始化上传插件
  558. try {
  559. // 使用upload.js插件
  560. $('#scyjEdit').uploadFile({
  561. name: 'scyj', // 必须与页面中的元素ID前缀一致
  562. type: 'document', // 上传类型,可根据需要设置
  563. validation: 'jpg,jpeg,png,pdf,doc,docx,xls,xlsx,ppt,pptx,txt,zip,rar', // 允许上传的文件类型
  564. size: 10240, // 文件大小限制,单位KB(10MB)
  565. app: wd.app ? wd.app.name : getAccountInfo().xmmc, // 应用名称
  566. action: "/service?ssServ=ulByHttp&type=document", // 明确指定action
  567. beforeClick: function () {
  568. return true;
  569. },
  570. onchange: function (settings) {
  571. },
  572. callback: function (result) {
  573. if (result && result.fileList && result.fileList.length > 0) {
  574. // 显示成功消息
  575. var fileName = result.fileList[0].fileName;
  576. alert('文件 "' + fileName + '" 上传成功!');
  577. // 自动填充上传路径输入框
  578. var filePath = result.fileList[0].path;
  579. if (filePath) {
  580. $('input[name="uploadPath"]').val(filePath);
  581. }
  582. // 文件上传成功之后, 获取对应的文件 , 并且将pdf文件解析出正文内容
  583. // 获取文件路径, 然后调用后端代码
  584. // if (filePath && filePath.toLowerCase().endsWith('.pdf')) {
  585. if (filePath) {
  586. $.ajax({
  587. url: "<ss:serv name='ws_zh_pdf2html'/>",
  588. type: 'post',
  589. data: {
  590. path: filePath,
  591. fileName: fileName
  592. },
  593. success: function (result) {
  594. // 提取成功后, 将正文内容传输到正文控件中
  595. try {
  596. var parse = typeof result === 'string' ? JSON.parse(result) : result;
  597. // 使用桥接 API 写入 Vue 数据(推荐方式)
  598. // 文档:/docs/普通JS读写Vue数据方法.md
  599. // 这会自动更新编辑器内容
  600. window.ss.dom.set('zwwjHtml', parse.data || '');
  601. } catch (e) {
  602. console.warn('PDF解析结果处理失败:', e);
  603. }
  604. },
  605. error: function(xhr, status, error) {
  606. }
  607. });
  608. }
  609. }
  610. }
  611. });
  612. } catch (error) {
  613. alert('上传插件初始化失败: ' + error.message);
  614. // 如果upload.js插件失败,使用简单方法
  615. $('#scyjEdit').off('click.simple').on('click.simple', function () {
  616. // 创建一个临时的文件input
  617. var fileInput = $('#scyjEdit_File');
  618. if (fileInput.length === 0) {
  619. $('body').append('<input type="file" id="scyjEdit_File" style="display:none;">');
  620. fileInput = $('#scyjEdit_File');
  621. }
  622. fileInput.off('change').on('change', function () {
  623. if (this.files.length > 0) {
  624. var fileName = this.files[0].name;
  625. $('#scyjBaseName').text(fileName);
  626. $('input[name="scyjBaseName"]').val(fileName);
  627. $('#checkScyj').show();
  628. $('#qxScyj').show();
  629. alert('已选择文件: ' + fileName);
  630. }
  631. });
  632. fileInput.click();
  633. });
  634. }
  635. // 添加上传路径输入框的点击事件
  636. $('#scyjpath').click(function () {
  637. var currentPath = $(this).val();
  638. if (currentPath) {
  639. $(this).select();
  640. }
  641. });
  642. // 为删除按钮添加确认提示
  643. $('body').on('click', '#qxScyj', function (e) {
  644. if (!confirm('确定要删除已上传的文件吗?')) {
  645. e.preventDefault();
  646. return false;
  647. }
  648. });
  649. // 初始化页面时检查是否有已上传的文件
  650. var existingFile = $('input[name="scyjwj"]').val();
  651. if (existingFile) {
  652. var fileName = existingFile.split('/').pop();
  653. $('#scyjBaseName').text(fileName);
  654. $('input[name="scyjBaseName"]').val(fileName);
  655. $('#checkScyj').show();
  656. $('#qxScyj').show();
  657. $('input[name="uploadPath"]').val(existingFile);
  658. }
  659. });
  660. // 表单提交前的验证函数
  661. function validateForm() {
  662. var filePath = $('input[name="scyjwj"]').val();
  663. var title = $('input[name="bt"]').val();
  664. if (!title || title.trim() === '') {
  665. alert('请填写标题');
  666. $('input[name="bt"]').focus();
  667. return false;
  668. }
  669. if (!filePath || filePath.trim() === '') {
  670. if (!confirm('您尚未上传原件,确定要继续提交吗?')) {
  671. $('#scyjEdit').focus();
  672. return false;
  673. }
  674. }
  675. return true;
  676. }
  677. // ==================== Vue 桥接 API 使用示例 ====================
  678. // 文档:/docs/普通JS读写Vue数据方法.md
  679. /**
  680. * 示例1:读取编辑器内容
  681. * 使用 window.ss.dom.get() 从 Vue 实例读取数据
  682. */
  683. function readEditorContent() {
  684. // 方式1:通过桥接 API 读取(推荐)
  685. var htmlContent = window.ss.dom.get('zwwjHtml') || '';
  686. console.log('读取到编辑器内容,长度:', htmlContent.length);
  687. alert('编辑器内容长度: ' + htmlContent.length + '\n前100字: ' + htmlContent.substring(0, 100));
  688. return htmlContent;
  689. }
  690. /**
  691. * 示例2:写入编辑器内容
  692. * 使用 window.ss.dom.set() 向 Vue 实例写入数据
  693. */
  694. function writeEditorContent() {
  695. var sampleHtml = '<p style="color: blue;">这是通过桥接 API 插入的内容</p>' +
  696. '<p>当前时间: ' + new Date().toLocaleString() + '</p>';
  697. // 通过桥接 API 设置 Vue 数据,编辑器会自动更新
  698. window.ss.dom.set('zwwjHtml', sampleHtml);
  699. console.log('已写入编辑器内容');
  700. alert('已向编辑器写入示例内容');
  701. }
  702. /**
  703. * 示例3:读取和设置表单标题
  704. * 演示如何读写普通输入字段
  705. */
  706. function readFormTitle() {
  707. // 读取标题字段
  708. var title = window.ss.dom.get('bt') || '';
  709. console.log('当前标题:', title);
  710. return title;
  711. }
  712. /**
  713. * 示例3b:设置表单标题
  714. */
  715. function setFormTitle() {
  716. var newTitle = '新标题_' + new Date().getTime();
  717. window.ss.dom.set('bt', newTitle);
  718. console.log('已设置标题:', newTitle);
  719. alert('标题已设置为: ' + newTitle);
  720. }
  721. /**
  722. * 示例4:读取和设置下拉框(文书类别)
  723. * 演示如何操作下拉选择框(ss-objp 组件)
  724. */
  725. function readDocumentType() {
  726. // 读取文书类别代码
  727. var typeCode = window.ss.dom.get('wslbm') || '';
  728. // 定义选项映射
  729. var typeMap = {
  730. "1": "函",
  731. "11": "通知",
  732. "21": "请示",
  733. "31": "批复",
  734. "41": "报告",
  735. "81": "个人书信",
  736. "91": "其他"
  737. };
  738. var typeName = typeMap[typeCode] || '未选择';
  739. console.log('文书类别代码:', typeCode, '名称:', typeName);
  740. alert('当前文书类别:\n代码: ' + typeCode + '\n名称: ' + typeName);
  741. return { code: typeCode, name: typeName };
  742. }
  743. /**
  744. * 示例4b:设置下拉框值(文书类别)
  745. * 注意:下拉框通过 v-model 绑定,设置 code 即可
  746. */
  747. function setDocumentType() {
  748. // 定义选项
  749. var typeOptions = [
  750. { code: '1', name: '函' },
  751. { code: '11', name: '通知' },
  752. { code: '21', name: '请示' },
  753. { code: '31', name: '批复' },
  754. { code: '41', name: '报告' },
  755. { code: '81', name: '个人书信' },
  756. { code: '91', name: '其他' }
  757. ];
  758. // 随机选择一个(实际应用中是用户选择)
  759. var randomType = typeOptions[Math.floor(Math.random() * typeOptions.length)];
  760. // 设置下拉框的值(设置 code,组件自动显示对应文本)
  761. window.ss.dom.set('wslbm', randomType.code);
  762. console.log('已设置文书类别:', randomType);
  763. alert('已设置文书类别为: ' + randomType.name + ' (代码: ' + randomType.code + ')');
  764. }
  765. /**
  766. * 示例4d:读取所有下拉框值
  767. * 批量读取多个下拉框字段
  768. */
  769. function readAllDropdowns() {
  770. // 读取各个下拉框的值
  771. var values = {
  772. wslbm: window.ss.dom.get('wslbm') || '', // 文书类别
  773. wsmjm: window.ss.dom.get('wsmjm') || '', // 密级
  774. wsfwm: window.ss.dom.get('wsfwm') || '', // 范围
  775. gllbm: window.ss.dom.get('gllbm') || '' // 管理类别
  776. };
  777. // 定义映射表
  778. var maps = {
  779. wslbm: { "1": "函", "11": "通知", "21": "请示", "31": "批复", "41": "报告", "81": "个人书信", "91": "其他" },
  780. wsmjm: { "1": "公开", "2": "内部", "3": "秘密", "4": "机密", "5": "绝密" },
  781. wsfwm: { "1": "全局", "2": "部门", "3": "个人" },
  782. gllbm: { "1": "行政", "2": "人事", "3": "财务", "4": "业务" }
  783. };
  784. var result = '下拉框取值:\n';
  785. for (var key in values) {
  786. var code = values[key];
  787. var name = maps[key] && maps[key][code] ? maps[key][code] : code;
  788. result += key + ': ' + name + ' (代码: ' + code + ')\n';
  789. }
  790. alert(result);
  791. return values;
  792. }
  793. /**
  794. * 示例5:批量设置表单数据
  795. * 实际应用场景:快速填充表单
  796. */
  797. function batchSetFormData() {
  798. // 批量设置多个字段
  799. window.ss.dom.set('bt', '关于2026年度工作总结的通知');
  800. window.ss.dom.set('zy', '本文总结了2026年度的工作情况...');
  801. window.ss.dom.set('wslbm', '11'); // 通知
  802. window.ss.dom.set('wsmjm', '2'); // 内部
  803. alert('已批量设置:\n标题、摘要、文书类别(通知)、密级(内部)');
  804. }
  805. /**
  806. * 示例6:读取完整表单数据
  807. * 用于提交前预览或生成文档
  808. */
  809. function readFullFormData() {
  810. var formData = {
  811. // 基本信息
  812. title: window.ss.dom.get('bt') || '',
  813. summary: window.ss.dom.get('zy') || '',
  814. // 下拉框
  815. docType: window.ss.dom.get('wslbm') || '',
  816. secretLevel: window.ss.dom.get('wsmjm') || '',
  817. scope: window.ss.dom.get('wsfwm') || '',
  818. manageType: window.ss.dom.get('gllbm') || '',
  819. // 编辑器内容
  820. content: window.ss.dom.get('zwwjHtml') || '',
  821. // 人员部门
  822. draftPerson: window.ss.dom.get('ngryid') || '',
  823. draftDept: window.ss.dom.get('ngbmid') || ''
  824. };
  825. console.log('完整表单数据:', formData);
  826. // 生成预览文本
  827. var preview = '表单数据预览:\n' +
  828. '标题: ' + formData.title + '\n' +
  829. '文书类别: ' + formData.docType + '\n' +
  830. '密级: ' + formData.secretLevel + '\n' +
  831. '内容长度: ' + formData.content.length + ' 字符\n';
  832. alert(preview);
  833. return formData;
  834. }
  835. /**
  836. * 示例4:清空编辑器并显示提示
  837. * 结合读写操作
  838. */
  839. function clearEditorWithConfirm() {
  840. // 先读取当前内容
  841. var currentContent = window.ss.dom.get('zwwjHtml') || '';
  842. if (currentContent.length === 0) {
  843. alert('编辑器已经是空的');
  844. return;
  845. }
  846. if (confirm('确定要清空编辑器内容吗?当前有 ' + currentContent.length + ' 个字符')) {
  847. // 清空内容
  848. window.ss.dom.set('zwwjHtml', '');
  849. alert('已清空');
  850. }
  851. }
  852. /**
  853. * 示例5:生成公文时读取编辑器内容
  854. * 实际应用场景
  855. */
  856. function generateDocWithContent() {
  857. // 从 Vue 读取编辑器内容
  858. var htmlContent = window.ss.dom.get('zwwjHtml') || '';
  859. var title = window.ss.dom.get('bt') || '未命名';
  860. if (!htmlContent || htmlContent.trim() === '') {
  861. if (!confirm('正文内容为空,确定要生成空白公文吗?')) {
  862. return;
  863. }
  864. }
  865. console.log('准备生成公文:', {
  866. title: title,
  867. contentLength: htmlContent.length
  868. });
  869. // 这里调用生成公文的接口...
  870. alert('标题: ' + title + '\n内容长度: ' + htmlContent.length + '\n\n可以在这里调用生成接口');
  871. }
  872. // ==================== 示例结束 ====================
  873. // 修复uploadFile插件的问题
  874. function fixUploadPlugin() {
  875. // 检查是否有必要的CSS样式
  876. if (!$('.content-button').length) {
  877. $('#scyjEdit').addClass('content-button');
  878. }
  879. // 确保文件输入框存在
  880. if (!$('#scyjEdit_File').length) {
  881. $('body').append('<input type="file" id="scyjEdit_File" name="fileEdit" style="display:none;">');
  882. }
  883. // 手动绑定点击事件
  884. $('#scyjEdit').off('click.manual').on('click.manual', function () {
  885. $('#scyjEdit_File').click();
  886. });
  887. // 监听文件选择
  888. $('#scyjEdit_File').off('change').on('change', function (e) {
  889. if (this.files && this.files.length > 0) {
  890. var fileName = this.files[0].name;
  891. var fileSize = this.files[0].size;
  892. var fileType = this.files[0].type;
  893. // 显示文件信息
  894. $('#scyjBaseName').text(fileName);
  895. $('input[name="scyjBaseName"]').val(fileName);
  896. // 模拟上传
  897. simulateUpload(fileName, fileSize);
  898. }
  899. });
  900. }
  901. // 模拟文件上传
  902. function simulateUpload(fileName, fileSize) {
  903. // 显示进度条
  904. $('#scyjBaseName').html('<div class="progress"><div class="bar"></div><div class="percent">0%</div></div>');
  905. // 模拟上传进度
  906. var progress = 0;
  907. var interval = setInterval(function () {
  908. progress += 10;
  909. if (progress <= 100) {
  910. $('.bar').width(progress + '%');
  911. $('.percent').text(progress + '%');
  912. if (progress === 100) {
  913. clearInterval(interval);
  914. // 模拟上传完成
  915. setTimeout(function () {
  916. // 生成模拟文件路径
  917. var timestamp = new Date().getTime();
  918. var filePath = '/uploads/' + timestamp + '_' + fileName;
  919. // 更新页面
  920. $('#scyjBaseName').text(fileName);
  921. $('input[name="scyjwj"]').val(filePath);
  922. $('input[name="uploadPath"]').val(filePath);
  923. $('#checkScyj').show();
  924. $('#qxScyj').show();
  925. alert('文件 "' + fileName + '" 上传成功!');
  926. }, 500);
  927. }
  928. }
  929. }, 200);
  930. }
  931. // 页面完全加载后修复插件
  932. $(window).on('load', function () {
  933. // 如果upload.js插件没有正常工作,使用修复方法
  934. setTimeout(function () {
  935. if ($('#scyjEdit').length && !$('#scyjEdit').data('upload-initialized')) {
  936. fixUploadPlugin();
  937. }
  938. }, 1000);
  939. });
  940. </script>
  941. <ss:ichk name='ws_inp'/>
  942. <script> addRemoveToken('<%= pageContext.getAttribute(ss.page.PageC.PAGE_tokenList)%>');</script>