Генерация штрих-кода при помощи jQuery. Фреймворки на темной стороне силы. Часть 001

Главные вкладки

Аватар пользователя Матвей
Опубликовано 24 декабря, 2013 - 22:46 пользователем Матвей


Как сделать самому печатную форму для штрих-кода? Можно использовать Excel и специальные шрифты, можно использовать Crystal Reports. Но эти методы не лишены недостатков, т.к. на компьютер пользователя придется устанавливать все это барахло. А как бы нам так замутить штрих-код, да еще и на HTML + JS...
Для такой задачи подойдет jQuery как нельзя лучше. Помимо генерации штрих-кодов этот фреймворк можно использовать для решения массы задач, связанных с HTA приложениями. Об этом я напишу потом и не раз.
Теперь к сути вопроса. Для решения задачи используются файлы:

  • jquery-1.3.2.min.js
  • jquery-barcode-2.0.2.min.js
    Файл jquery-barcode-2.0.2.min.js взят с сайта http://barcode-coder.com
    Перво-наперво нужно описать настройки HTA приложения:
    <html>
<hta:application id="SMbar_gen" 
applicationname="Print bcodes"
contextmenu="no"
innerborder="no"
maximizebutton="no"
minimizebutton="yes"
selection="no"
showintaskbar="yes"
singleinstance="yes"
sysmenu="yes"
SCROLL="no"
windowstate="normal"
ICON="cypher.ico"
>

    Далее описываем заголовок и стили:
     <head>
  <title>Генератор штрихкодов.</title>
    <style>
      * {
          color:#000000;
          font-family:Arial,sans-serif;
          font-size:12px;
          font-weight:normal;
      }    
    </style>
<style type="text/css" media="print"> 
   div.barcodeTarget {display: block; } 
   input  {display: none; } 
	button  {display: none; } 
	barcodeValue {display: none; } 
	generator {display: none; } 
	no_print {display: none; } 
</style>

    Подключаем фреймворки:
        <script type="text/javascript" src="jquery-1.3.2.min.js"></script>
    <script type="text/javascript" src="jquery-barcode-2.0.2.min.js"></script>

    Далее функция формирующая штрих-код:
       <script type="text/javascript">
self.resizeTo(400,250);
  function generateBarcode(){
        var value = $("#barcodeValue").val();
        var btype = "ean13";
        var renderer = "css";
		var quietZone = false;
        var settings = {
          output:renderer,
          bgColor: "#FFFFFF",
          color: "#000000",
          barWidth: "1",
          barHeight: "20",
          moduleSize: "10",
          posX: "10",
          posY: "20",
         addQuietZone: "10"
        };    
          $("#barcodeTarget").html("").show().barcode(value, btype, settings);  
      }
      $(function(){
        generateBarcode();
      });

    Это далеко не все, что может jquery-barcode, полное описание всего функционала вы можете найти http://barcode-coder.com
    Штрих-код есть. Осталось его напечатать:
    function goooo(){
   if (window.print) {
   window.print() ;
}

    Теперь описываем расположение окна приложения и собственно сам HTML код:
    <SCRIPT Language="VBScript">	
public WshShell
set WshShell = CreateObject("WScript.Shell") ' Подключаемся к "шелу" операционки, для работы с файлами 
window.moveTo screen.width/2-400/2, screen.height/2-250/2 ' Двигаем окно в центр экрана
</script>
  </head>
  <body style="margin: 0px">
    <div id="generator">
	<div class="generator"><br><center>
      &nbsp;&nbsp;Цифры кода : <input type="text" id="barcodeValue" value="4600452017135"></center></div><br>    
      <div id="submitt">
       <br><center><b><input id="Find" type="button" style="font-size: 30px;  font-family: Verdana; width:180px; height:50px;" onclick="printit()" value="Поиск"></b><center>	
        <br>
 </div>
	<span id="B_text" style="font-size: 7px;  font-family: Verdana; width:122px; height:20px;"></span> <!-- Наименование товара --!>
    <div id="barcodeTarget"><br></div><!-- Штрих-код товара --!>
  </body>
</html>
<SCRIPT Language="VBScript">

    Осталось получить подключение к базе данных S-market, чтобы найти товар по штрих-коду и отправить на печать этикетку.
    <SCRIPT Language="VBScript">
sub printit()
BcodeGen(barcodeValue.value)
generateBarcode()
goooo
end sub
Public Function BcodeGen(bcodsm)
		Set objShell = CreateObject("Shell.Application") 
	Set objFolder = objShell.Namespace(WshShell.CurrentDirectory) ' Определение рабочей папки
	Set objFolderItem = objFolder.Self 
	Set objFSO = CreateObject("Scripting.FileSystemObject") 
  Path = objFolderItem.Path + ""  
strFilePath = Path & "" & "zd.udl" 'Читаем файл подключения
  Const For_Reading   = 1
  Const Tristate_True = -1
  Set objTS = objFSO.OpenTextFile(strFilePath,  For_Reading, False, Tristate_True)
  objTS.SkipLine
  objTS.SkipLine
  Udlread=objTS.Readline
  Set DBConn = CreateObject("ADODB.Connection")
  DBConn.Open(Udlread)
 SqlStr="select bar.barcode, cardscla.name from cardscla right outer bar on (cardscla.articul = bar.articul) where bar.barcode='"+bcodsm+"'"
  Set Brecords=DBConn.Execute(SQLstr) 
  BcodeGen=Cstr(Brecords.Fields(0).Value)
  B_text.InnerHTML=Cstr(Brecords.Fields(1).Value)
End Function
</script>

    Этот пример имеет несколько изъянов. Например для печати этикеток лучше подойдет поиск по артикулу, но тут тогда всплывет тот факт, что к одному артикулу может быть привязано несколько штрих-кодов.
    Но это я оставлю для самостоятельной доработки.

    • Tags: