Open-ILS/src/templates/staff/cat/printlabels/t_view.tt2

   1 <style>
   2   /* TODO: move me */
   3
   4   body {
   5
   6   }
   7
   8   table.page-break {
   9   page-break-before: always;
  10   }
  11
  12   div.print-label-toolbox input[type=number], div.print-label-toolbox input[type=text] {
  13   border: 1px solid #999;
  14   border-radius: 3px;
  15   margin-right: 12px;
  16   width: 56px;
  17   }
  18
  19   div.print-label-toolbox div.eg-print-label-section {
  20   border-bottom: 1px solid #DED;
  21   display: block;
  22   margin: 0 0 10px 0;
  23   padding: 0 0 10px 0;
  24   }
  25
  26   div.print-label-toolbox input.ng-invalid {
  27   background-color: #FFFF00;
  28   color: #FF0000;
  29   }
  30
  31   div.print-label-toolbox label {
  32   padding-right: 4px;
  33   }
  34
  35   div.print-label-toolbox ul {
  36   display: block;
  37   list-style-type: none;
  38   margin: 0;
  39   padding: 0;
  40   }
  41
  42   div.print-label-toolbox ul li {
  43   display: inline-block;
  44   padding: 0 0 0 6px;
  45   }
  46
  47   div.print-label-toolbox ul li:first-child {
  48   display: inline-block;
  49   padding: 0 0 0 0;
  50   }
  51
  52   table.custom-label-table td {
  53   vertical-align: top;
  54   }
  55
  56   .print-template-text {
  57   height: 36em;
  58   width: 100%;
  59   }
  60
  61   .cn-template-text {
  62   height: 12em;
  63   width: 100%;
  64   }
  65 </style>
  66
  67 <h2>[% l('Print Item Labels') %]</h2>
  68
  69 <div class="row bg-info">
  70     <div class="col-md-6">
  71         <div class="row">
  72             <div class="col-md-1">
  73                 <span class="h4">[% l('Template') %]</span>
  74             </div>
  75             <div class="col-md-5">
  76                 <eg-basic-combo-box list="template_name_list" selected="template_name"></eg-basic-combo-box>
  77             </div>
  78             <div class="col-md-1">
  79                 <button class="btn btn-default" ng-click="applyTemplate(template_name)">[% l('Apply') %]</button>
  80             </div>
  81             <div class="col-md-1">
  82                 <span class="h4">[% l('Printer') %]</span>
  83             </div>
  84             <div class="col-md-4">
  85                 <select class="form-control" ng-model="print.template_context">
  86                     <option value="default">[% l('Default') %]</option>
  87                     <option value="receipt">[% l('Receipt') %]</option>
  88                     <option value="label">[% l('Label') %]</option>
  89                     <option value="mail">[% l('Mail') %]</option>
  90                     <option value="offline">[% l('Offline') %]</option>
  91                 </select>
  92             </div>
  93         </div>
  94     </div>
  95     <div class="col-md-2">
  96         <div class="btn-group">
  97             <button class="btn btn-default" ng-click="saveTemplate(template_name)">[% l('Save') %]</button>
  98             <button class="btn btn-default" ng-click="deleteTemplate(template_name)">[% l('Delete') %]</button>
  99         </div>
 100     </div>
 101     <div class="col-md-3">
 102         <div class="btn-group">
 103             <span class="btn btn-default btn-file">
 104                 [% l('Import') %]
 105                 <input type="file" eg-file-reader container="imported_templates.data">
 106             </span>
 107             <label class="btn btn-default"
 108                 eg-json-exporter container="templates"
 109                 default-file-name="'[% l('exported_label_templates.json') %]'">
 110                 [% l('Export') %]
 111             </label>
 112             <label class="btn btn-default" ng-click="reset_to_default()">
 113                 [% l('Default') %]</button>
 114             </div>
 115     </div>
 116     <div class="col-md-1 pull-right">
 117         <button class="btn btn-default" ng-click="print_labels()">[% l('Print') %]</button>
 118     </div>
 119 </div>
 120
 121 <hr/>
 122
 123 <div class="row">
 124     <div class="col-md-5">
 125         <ul class="nav nav-tabs">
 126             <li ng-class="{active : current_tab == 'cn_template'}">
 127                 <a ng-click="set_tab('cn_template')">
 128                     [% l('Call Number Template') %]
 129                 </a>
 130             </li>
 131             <li ng-class="{active : current_tab == 'call_numbers'}">
 132                 <a ng-click="set_tab('call_numbers')">
 133                     [% l('Call Numbers') %]
 134                 </a>
 135             </li>
 136             <li ng-class="{active : current_tab == 'settings'}">
 137                 <a ng-click="set_tab('settings')">
 138                     [% l('Settings') %]
 139                 </a>
 140             </li>
 141             <li ng-class="{active : current_tab == 'template'}">
 142                 <a ng-click="set_tab('template')">
 143                     [% l('Label Template') %]
 144                 </a>
 145             </li>
 146         </ul>
 147         <div class="tab-content">
 148             <div class="tab-pane active">
 149                 <div ng-show="current_tab == 'cn_template'">
 150                     <h4>
 151                         [% l('Call Number Preview') %]
 152                     </h4>
 153                     <div eg-print-template-output ng-show="true"
 154                         content="print.cn_template_content"
 155                         context="{ copy : preview_scope.copies[0], get_cn_and_location_prefix : preview_scope.get_cn_and_location_prefix, get_cn_and_location_suffix : preview_scope.get_cn_and_location_suffix, settings : preview_scope.settings }"></div>
 156                     <h4>
 157                         [% l('Call Number Template') %]
 158                     </h4>
 159                     <div>
 160                         <span>
 161                             [% l('Changes here will wipe out manual changes in the Call Numbers tab.') %]<br/>
 162                         </span>
 163                     </div>
 164                     <textarea ng-model="print.cn_template_content" class="print-template-text">
 165                     </textarea>
 166                     <div ng-repeat="copy in preview_scope.copies">
 167                         <div id="cn_for_copy_{{copy.id}}" eg-print-template-output ng-show="false"
 168                             content="print.cn_template_content"
 169                             context="{ copy : copy, get_cn_and_location_prefix : preview_scope.get_cn_and_location_prefix, get_cn_and_location_suffix : preview_scope.get_cn_and_location_suffix, settings : preview_scope.settings }"></div>
 170                     </div>
 171                 </div>
 172                 <div ng-show="current_tab == 'call_numbers'">
 173                     <h4>
 174                         [% l('Formatted Call Numbers') %]
 175                     </h4>
 176                     <div>
 177                         <span>
 178                             [% l('Manual adjustments may be made here. These do not get saved with templates.') %]<br/>
 179                         </span>
 180                     </div>
 181                     <div ng-repeat="cn in rendered_call_number_set">
 182                         <textarea ng-model="cn.value" class="cn-template-text">
 183                         </textarea>
 184                     </div>
 185                 </div>
 186                 <div ng-show="current_tab == 'settings'">
 187                     <div>
 188                         <span>
 189                           <b>*All settings will be saved with templates</b>
 190                         </span>
 191                     </div>
 192                     <form id="print_label_form" name="print_label_form">
 193                         <div class="print-label-toolbox">
 194                             <div class="eg-print-label-section">
 195                                 <h4>Print Feed Option</h4>
 196                                 <ul>
 197                                     <li ng-repeat="x in preview_scope.toolbox_settings.feed_option.options">
 198                                         <label>{{x.label}}:</label>
 199                                         <input name="label-feed-option" ng-model="preview_scope.toolbox_settings.feed_option.selected" ng-change="redraw_label_table()" type="radio" value="{{x.value}}" />
 200                                     </li>
 201                                 </ul>
 202                             </div>
 203                             <div class="eg-print-label-section">
 204                                 <h4>Print Option</h4>
 205                                 <ul>
 206                                     <li ng-repeat="x in preview_scope.toolbox_settings.mode.options">
 207                                         <label>{{x.label}}:</label>
 208                                         <input name="label-output-mode" ng-model="preview_scope.toolbox_settings.mode.selected" type="radio" value="{{x.value}}" />
 209                                     </li>
 210                                 </ul>
 211                             </div>
 212                             <h3>Page Settings</h3>
 213                             <div class="eg-print-label-section">
 214                                 <h4>Page Margins</h4>
 215                                 <p>Must be in format "0.25in", "2.5cm", "1.5in", etc. (units of measurement must be valid CSS)</p>
 216                                 <ul>
 217                                     <li ng-repeat="(x, y) in preview_scope.toolbox_settings.page.margins">
 218                                         <label>{{y.label}}:</label>
 219                                         <input type="text" eg-print-label-valid-css ng-model="preview_scope.toolbox_settings.page.margins[x].size" required />
 220                                     </li>
 221                                 </ul>
 222                             </div>
 223                             <div class="eg-print-label-section">
 224                                 <h4>Print Grid Size</h4>
 225                                 <p>Please specify the number of columns and rows (if applicable) on the print medium. This setting is only used to control page layouts and breaks. It will not limit the number of rows printed, which is determined by the number of selected copies. The column count should include each label in a row. For example, if you have a row with two sets of labels that include one spine and one pocket, the count is four.</p>
 226                                 <ul>
 227                                     <li ng-if="preview_scope.toolbox_settings.feed_option.selected === 'sheet'">
 228                                         <label>Rows:</label>
 229                                         <input type="number" ng-model="preview_scope.toolbox_settings.page.dimensions.rows" ng-min="1" required />
 230                                     </li>
 231                                     <li>
 232                                         <label>Columns:</label>
 233                                         <input type="number" ng-model="preview_scope.toolbox_settings.page.dimensions.columns" ng-min="1" required />
 234                                     </li>
 235                                 </ul>
 236                             </div>
 237                             <div class="eg-print-label-section">
 238                                 <label>Gap Between Rows</label> <input type="text" ng-model="preview_scope.toolbox_settings.page.space_between_labels.vertical.size" ng-min="0" eg-print-label-valid-css required />
 239                                 <p>Must be in format "0.25in", "2.5cm", "1.5in", etc. (units of measurement must be valid CSS)</p><br />
 240                                 <label>Gap Between Columns of a Label Set</label>
 241                               <input type="text" ng-model="preview_scope.toolbox_settings.page.label.gap.size" ng-min="0" eg-print-label-valid-css required />
 242                                 <p>Gap between a label “set” (i.e. gap between each spine/pocket combo). Use label 2 left margin to identify how much space to provide between labels within one set. Must be in format "0.25in", "2.5cm", "1.5in", etc. (units of measurement must be valid CSS)</p>
 243                             </div>
 244                             <div class="eg-print-label-section" ng-if="preview_scope.toolbox_settings.page.dimensions.rows > 1 || preview_scope.toolbox_settings.page.dimensions.columns > 1">
 245                                 <h4>Starting Position on Label Grid</h4>
 246                                 <p>Specify the starting <span ng-if="preview_scope.toolbox_settings.feed_option.selected == 'sheet'">row and </span>column where labels should begin printing. Values must not exceed the respective <span ng-if="preview_scope.toolbox_settings.feed_option.selected == 'sheet'">row and </span>column size specified in "Print Grid Size"</p>
 247                                 <ul>
 248                                     <li ng-if="preview_scope.toolbox_settings.feed_option.selected === 'sheet'">
 249                                         <label>Row:</label>
 250                                         <input type="number" eg-print-label-valid-int eg-print-label-row-bounds ng-model="preview_scope.toolbox_settings.page.start_position.row" ng-min="1" required />
 251                                     </li>
 252                                     <li>
 253                                         <label>Column:</label>
 254                                         <input type="number" eg-print-label-valid-int="" eg-print-label-column-bounds ng-model="preview_scope.toolbox_settings.page.start_position.column" ng-min="1"  required />
 255                                     </li>
 256                                 </ul>
 257                             </div>
 258                             <div class="eg-print-label-section">
 259                                 <h4>Label Set Configuration</h4>
 260                                 <label>Number of Labels in Set:</label>
 261                               <input type="number" eg-print-label-valid-int="" ng-min="1" ng-model="preview_scope.toolbox_settings.page.label.set.size" />
 262                               <br />
 263                               <br />
 264                                 <ul ng-if="preview_scope.valid_print_label_start_column() && preview_scope.valid_print_label_start_row() && preview_scope.toolbox_settings.mode.selected === 'spine-pocket'">
 265                                     <li ng-repeat="i in preview_scope.toolbox_settings.page.label.set.size | columnRowRange">
 266                                         <label>Col. {{i + 1}}</label>
 267                                         <select id="eg_print_label_column_spec_{{i}}" ng-model="preview_scope.toolbox_settings.page.column_class[i]" ng-change="redraw_label_table()">
 268                                             <option value="spine">Label 1</option>
 269                                             <option value="pocket">Label 2</option>
 270                                         </select>
 271                                     </li>
 272                                 </ul>
 273                               <br />
 274                             </div>
 275                         </div>
 276                     </form>
 277                     <div>
 278                         <span>
 279                             [% l('These settings do get saved with templates and will override corresponding Library Settings.') %]<br/>
 280                         </span>
 281                     </div>
 282                     <div ng-repeat="s in org_unit_settings">
 283                         <div class="row" style="margin-top: 5mm;">
 284                         <div class="col-md-6"><label>{{s.label}} <eg-help-popover help-text="{{s.description}}"></label></div>
 285                             <div class="col-md-6">
 286                                 <input type="text" ng-model="preview_scope.settings[s.name]"></input>
 287                             </div>
 288                         </div>
 289                     </div>
 290                 </div>
 291                 <div ng-show="current_tab == 'template'">
 292                     <div ng-if="print.load_failed" class="alert alert-danger">
 293                         [% l(
 294                         "Unable to load template '[_1]'.  The web server returned an error.",
 295                         '{{print.template_name}}')
 296                         %]
 297                     </div>
 298                     <div>
 299                         <textarea ng-model="print.template_content" class="print-template-text">
 300                         </textarea>
 301                     </div>
 302                 </div>
 303             </div>
 304         </div>
 305     </div>
 306     <div class="col-md-7">
 307         <h3>
 308             [% l('Label Preview') %]
 309         </h3>
 310         <div eg-print-template-output
 311           content="print.template_content"
 312           context="preview_scope"></div>
 313     </div>
 314     <!-- col -->
 315 </div>
 316