（廣西廣播電視技術(shù)中心）

1 引言

隨著廣播電視事業(yè)飛速發(fā)展，各維護單位每年需進行大量的設備采購，因?qū)嵤┎块T、人員不同，所編制的設備技術(shù)參數(shù)不同，常常造成采購設備標準不統(tǒng)一，由此產(chǎn)生的冗余的招標文件信息以及不同標準的設備，也為項目審核和運維工作帶來了困難，大大降低了工作效率。與此同時，隨著辦公網(wǎng)絡化、信息化的普及，給招標文件管理信息化奠定了基礎。為了解決傳統(tǒng)招標文件編制和管理中存在的問題，通過開發(fā)招標文件信息管理系統(tǒng)可以形成統(tǒng)一的招標文件信息庫，從而規(guī)范各實施部門設備采購的標準，簡化招標文件編制工作，提升審核工作效率。

2 系統(tǒng)設計

2.1 開發(fā)工具

系統(tǒng)的開發(fā)采用Webbuilder可視化集成開發(fā)框架，其具有功能完備的基于瀏覽器的集成開發(fā)環(huán)境，開發(fā)人員只需在瀏覽器中操作即可完成系統(tǒng)界面與應用功能的開發(fā)，并且此開發(fā)框架簡化了與java原生代碼的嵌套方式，java代碼與開發(fā)框架無縫銜接，使開發(fā)應用過程具有高效率和高穩(wěn)定性。系統(tǒng)的數(shù)據(jù)庫采用開源的輕量級關(guān)系型數(shù)據(jù)庫mysql。在開發(fā)小型web應用方面，mysql具有體積小、速度快、成本低等優(yōu)勢。

2.2 系統(tǒng)架構(gòu)

招標文件管理系統(tǒng)架構(gòu)如圖1所示。

表示層：系統(tǒng)的界面采用了bootstrap和extjs兩個框架，使用獨有的xwl文件將bootstrap、extjs和java整合，把底層傳輸過來的數(shù)據(jù)呈現(xiàn)在一個動態(tài)的網(wǎng)頁中。

控制層：將業(yè)務數(shù)據(jù)形成接口，通過ajax、json把數(shù)據(jù)傳輸?shù)角岸藙討B(tài)頁面。

業(yè)務邏輯層：把不同業(yè)務分成有邏輯的模塊，根據(jù)業(yè)務需求與數(shù)據(jù)訪問層進行交互。

DAL數(shù)據(jù)訪問層：對數(shù)據(jù)庫進行操作，給業(yè)務層提供數(shù)據(jù)服務。

2.3 系統(tǒng)功能

圖1 招標文件管理系統(tǒng)架構(gòu)

圖2 招標文件管理系統(tǒng)功能示意圖

系統(tǒng)的主要功能如圖2所示。

本系統(tǒng)主要包含管理文件及生成文件兩大功能：管理文件功能用于管理單位現(xiàn)有的招標文件，可根據(jù)文件的分類，上傳招標文件進行管理，以便用戶查看和下載，實現(xiàn)對招標文件的存檔及管理需求；生成文件功能主要用于根據(jù)實施部門的實際需求，生成具有統(tǒng)一標準的招標文檔。系統(tǒng)錄入員根據(jù)現(xiàn)有的招標文件信息錄入設備分類、設備參數(shù)及商務要求等信息，用戶可根據(jù)實際需要，選擇、比對所選擇的招標信息，最終生成新的招標文檔。系統(tǒng)也提供權(quán)限管理功能，可根據(jù)用戶權(quán)限的不同，展示不同的數(shù)據(jù)和功能模塊，可實現(xiàn)招標文件編制和管理崗位的靈活配置。

2.4 系統(tǒng)關(guān)鍵技術(shù)

2.4.1 在線編輯器圖文混合錄入

目前常見的在線編輯器在上傳圖文混合數(shù)據(jù)時，圖片需要單獨上傳。而在實際使用環(huán)境中，為了保持招標文件的格式，同時簡化含圖片信息的錄入工作，必須允許文字和圖片同時粘貼錄入。本系統(tǒng)使用開源的KindEditor在線html編輯器插件，可在錄入信息時獲得所見即所得編輯效果。通過對KindEditor插件代碼進行擴展，可實現(xiàn)在谷歌和IE11以上瀏覽器的含圖片文檔錄入的需求。

在開發(fā)此功能前，將圖片粘貼到編輯器，通過對http抓包發(fā)現(xiàn)，圖片的request請求格式是multipart/form-data，圖片的內(nèi)容是作為request body的一部分傳過去的，因此設計的基本的原理就是：監(jiān)聽粘貼-->獲取粘貼內(nèi)容-->將內(nèi)容上傳。在瀏覽器中，發(fā)送文本是通過ajax向服務器傳輸， 而ie11和chrome瀏覽器專有的FormData新特性可以使用html5提供的XMLHttpRequest Level2 傳輸二進制數(shù)據(jù)，以此為突破口就可實現(xiàn)瀏覽器直接將圖片復制粘貼后上傳。

含圖片上傳文檔的java核心偽代碼是：

示例圖：

圖3 編輯界面

2.4.2 文檔在線閱讀

本系統(tǒng)采用openoffice+swftools+flexpaper組件來實現(xiàn)在線閱讀功能。原理是通過openoffice將用戶上傳的文檔轉(zhuǎn)換為pdf格式的文件，再使用swftools將pdf文件轉(zhuǎn)換為swf格式文件，最后通過flexpaper瀏覽器插件在頁面上顯示內(nèi)容。

在線閱讀的java核心偽代碼：

示例圖：

圖4 在線閱讀界面

2.4.3 文本對比

系統(tǒng)管理員和系統(tǒng)用戶可按產(chǎn)品名稱、品牌等關(guān)鍵信息搜索查看所需的招標文件信息。本系統(tǒng)利用CodeMirrorJS插件中的文本對比功能，將相似設備的技術(shù)參數(shù)進行對比，在選擇所需的招標文件過程中，可查看相似文件的不同之處。利用javascript技術(shù)，遍歷比對需要比較的文本，在不相同的地方進行高亮標注，讓用戶一目了然。文本對比的Javascript核心偽代碼是：

示例圖如下：

圖5 在線對比界面

2.4.4 生成文檔

系統(tǒng)管理員和系統(tǒng)用戶可將所選擇的招標文件信息條目生成為word文檔并下載。本系統(tǒng)通過將所選擇的招標文件信息條目的ID發(fā)送給預編寫好的JAVA程序，后臺程序在數(shù)據(jù)庫查找所需的招標文件信息內(nèi)容，通過拼接string字符串的形式形成一個html格式的招標文件，再通過java程序?qū)⒋薶tml文件轉(zhuǎn)換成word文檔。生成文檔的java核心偽代碼是：

示例圖如下：

圖6 生成的文檔界面

3 總結(jié)

本系統(tǒng)采用基于Webbuilder可視化系統(tǒng)集成平臺開發(fā)框架，整合單位招標文件信息內(nèi)容和標準，對招標文件進行管理存檔，可根據(jù)各實施部門的需求生成具有統(tǒng)一標準的招標文件，簡化招標文件信息、版本的管理工作流程，提升工作效率。