add.html 4.6 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108
  1. <html xmlns="http://www.w3.org/1999/xhtml" xmlns:th="http://www.thymeleaf.org">
  2. <head>
  3. <meta charset="UTF-8">
  4. <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1">
  5. <title>新建印刷费</title>
  6. <link rel="stylesheet" th:href="@{/lib/layui/css/layui.css}" media="all">
  7. <link rel="stylesheet" th:href="@{/css/public.css}" media="all">
  8. <link rel="stylesheet" th:href="@{/lib/font-awesome-4.7.0/css/font-awesome.min.css}" media="all">
  9. <style>
  10. body {
  11. background-color: #ffffff;
  12. }
  13. </style>
  14. </head>
  15. <body>
  16. <form class="layui-form" action="" lay-filter="formDemo">
  17. <div class="layui-form layuimini-form">
  18. <div class="layui-form-item layui-inline" style="width: 100%">
  19. <label class="layui-form-label" style="width: 70px">资料名称</label>
  20. <div class="layui-input-inline" style="width: 270px">
  21. <input type="text" id="zlmc" name="zlmc" autocomplete="off" class="layui-input">
  22. </div>
  23. <label class="layui-form-label required" style="width: 70px">单册页数</label>
  24. <div class="layui-input-inline" style="width: 270px">
  25. <input type="number" id="dcys" name="dcys" lay-verify="required" autocomplete="off" class="layui-input">
  26. </div>
  27. </div>
  28. <div class="layui-form-item layui-inline" style="width: 100%">
  29. <label class="layui-form-label required" style="width: 70px">打印册数</label>
  30. <div class="layui-input-inline" style="width: 270px">
  31. <input type="number" id="dycs" name="dycs" lay-verify="required" autocomplete="off" class="layui-input">
  32. </div>
  33. <label class="layui-form-label " style="width: 70px">单页费用</label>
  34. <div class="layui-input-inline" style="width: 270px">
  35. <select name="dcfy" id="dcfy" lay-filter="dcfy">
  36. <option value="0.12">0.12</option>
  37. <option value="0.96">0.96</option>
  38. <option value="7.68">7.68</option>
  39. </select>
  40. </div>
  41. </div>
  42. <div class="layui-form-item layui-inline" style="width: 100%">
  43. <label class="layui-form-label required" style="width: 70px">合计</label>
  44. <div class="layui-input-inline" style="width: 270px">
  45. <input type="number" id="hj" name="hj" autocomplete="off" class="layui-input" readonly placeholder="系统自动计算">
  46. </div>
  47. </div>
  48. <!-- 右侧悬浮按钮 -->
  49. <div class="right-bottom-btn">
  50. <button type="button" class="layui-btn" lay-submit lay-filter="saveBtn">
  51. <i class="layui-icon layui-icon-ok"></i>确定
  52. </button>
  53. <button class="layui-btn" lay-filter="cancleBtn">
  54. <i class="layui-icon layui-icon-close"></i>取消
  55. </button>
  56. </div>
  57. </div>
  58. </form>
  59. <script th:src="@{/lib/jquery-3.4.1/jquery-3.4.1.min.js}" charset="utf-8"></script>
  60. <script th:src="@{/lib/layui/layui.js}" charset="utf-8"></script>
  61. <script th:src="@{/lib/coco-message/coco-message.js}" charset="utf-8"></script>
  62. <script th:src="@{/lib/xm-select-v1.2.2/xm-select.js}" charset="utf-8"></script>
  63. <script th:src="@{/js/lay-config.js}" charset="utf-8"></script>
  64. <script type="text/javascript" th:inline="javascript">
  65. AjaxUtil.ctx = /*[[@{/}]]*/'';
  66. layui.use(['form', 'tableSelect'], function () {
  67. var form = layui.form;
  68. var dcysInput = document.getElementById('dcys');
  69. var dycsInput = document.getElementById('dycs');
  70. var hjInput = document.getElementById('hj');
  71. dcysInput.addEventListener('input', updateHj);
  72. dycsInput.addEventListener('input', updateHj);
  73. var dcysValue;
  74. var dycsValue;
  75. function updateHj() {
  76. dcysValue = parseFloat(dcysInput.value) || 0;
  77. dycsValue = parseFloat(dycsInput.value) || 0;
  78. }
  79. form.on('select(dcfy)',function (data){
  80. if(dcysValue!=undefined&&dycsValue!=undefined){
  81. hjInput.value = dcysValue * dycsValue * data.value;
  82. }
  83. })
  84. //监听提交
  85. form.on('submit(saveBtn)', function (data) {
  86. parent.setPrintln(data.field);
  87. parent.setUpdateFlag();
  88. parent.layer.close(parent.layer.getFrameIndex(window.name));// 关闭子窗口
  89. });
  90. // 监听取消按钮
  91. $("button[lay-filter='cancleBtn']").click(function () {
  92. var iframeIndex = parent.layer.getFrameIndex(window.name);
  93. parent.layer.close(iframeIndex);
  94. });
  95. });
  96. </script>
  97. </body>
  98. </html>