From e19469796447e44904f28dce9ea742b8d73d8c43 Mon Sep 17 00:00:00 2001
From: xxssyyyyssxx <xxssyyyyssxx@126.com>
Date: Wed, 3 Nov 2021 13:18:31 +0800
Subject: [PATCH] =?UTF-8?q?=E6=94=B6=E5=85=A5=E6=98=8E=E7=BB=86=E4=BF=9D?=
=?UTF-8?q?=E5=AD=98=E5=AE=8C=E6=88=90=EF=BC=8C=E4=B8=8B=E4=B8=80=E6=AD=A5?=
=?UTF-8?q?=E5=9B=9E=E6=98=BE=E5=88=B0=E9=A1=B5=E9=9D=A2=E4=B8=8A?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit
---
.../static/assets/js/project_budget.js | 65 ++++++++++++++++++-
.../templates/admin/project_budget_edit.ftl | 54 +++++++++++----
2 files changed, 106 insertions(+), 13 deletions(-)
diff --git a/src/main/resources/static/assets/js/project_budget.js b/src/main/resources/static/assets/js/project_budget.js
index 1c91c96..41675e0 100644
--- a/src/main/resources/static/assets/js/project_budget.js
+++ b/src/main/resources/static/assets/js/project_budget.js
@@ -36,10 +36,25 @@ function arr2Object(arr, mapArr) {
INCOME_DETAIL_ARR=["type","name","unit","amount","price","taxRate"];
INCOME_DETAIL_PROP_LENGTH=8;
+/**
+ * 收集收入明细的数据，因为动态添加的行modal无法识别，所以自己来收集
+ * @returns {Array}
+ */
+function collectIncomeData(className) {
+ var a= [];
+ $("." + className).each(function (t) {
+ a.push($(this).val());
+ });
+ return a;
+}
+
+/**
+ * 保存收入明细数据
+ */
function saveIncome(url, data, projectId) {
if(Array.isArray(data) && data.length != 0){
+ console.log(data);
var arr = arrayToMatrix(data,INCOME_DETAIL_PROP_LENGTH);
- console.log(arr);
var incomeDetails = [];
for (var i=0;i<arr.length;i++){
incomeDetails.push(arr2Object(arr[i], INCOME_DETAIL_ARR));
@@ -62,4 +77,52 @@ function saveIncome(url, data, projectId) {
}
});
}
+}
+
+/**
+ * 绑定每一行的删除事件，删除当前的一行tr
+ */
+function bindDeleteBtn() {
+ $(".am-modal-line-delete").click(function () {
+ //删除自己对应的tr
+ $(this).parent().parent().remove();
+ });
+}
+
+/**
+ * 绑定每个可改变的输入框，修改后改变对应输入框的值
+ */
+function bindIncomeChangeableInput() {
+ //数量改变
+ $(".input-changeable-amount").change(function () {
+ var amount = parseFloat($(this).val());
+ //找到对应的单价和税率
+ var price = parseFloat($(this).parent().parent().find(".input-changeable-price").val());
+ var taxRate = parseFloat($(this).parent().parent().find(".input-changeable-tax-rate").val());
+ console.log(amount,price,taxRate);
+
+ $(this).parent().parent().find(".input-changeable-total-tax-include").val(amount*price);
+ $(this).parent().parent().find(".input-changeable-total-tax-exclude").val(amount*price/(1+taxRate/100));
+ });
+ //单价改变
+ $(".input-changeable-price").change(function () {
+ var price = parseFloat($(this).val());
+ //找到对应的数量和税率
+ var amount = parseFloat($(this).parent().parent().find(".input-changeable-amount").val());
+ var taxRate = parseFloat($(this).parent().parent().find(".input-changeable-tax-rate").val());
+ console.log(amount,price,taxRate);
+
+ $(this).parent().parent().find(".input-changeable-total-tax-include").val(amount*price);
+ $(this).parent().parent().find(".input-changeable-total-tax-exclude").val(amount*price/(1+taxRate/100));
+ });
+ //税率改变
+ $(".input-changeable-tax-rate").change(function () {
+ var taxRate = parseFloat($(this).val());
+ //找到对应的数量和单价
+ var amount = parseFloat($(this).parent().parent().find(".input-changeable-amount").val());
+ var price = parseFloat($(this).parent().parent().find(".input-changeable-price").val());
+ console.log(amount,price,taxRate);
+
+ $(this).parent().parent().find(".input-changeable-total-tax-exclude").val(amount*price/(1+taxRate/100));
+ });
}
\ No newline at end of file
diff --git a/src/main/resources/templates/admin/project_budget_edit.ftl b/src/main/resources/templates/admin/project_budget_edit.ftl
index 1d3b2c3..0c6780a 100644
--- a/src/main/resources/templates/admin/project_budget_edit.ftl
+++ b/src/main/resources/templates/admin/project_budget_edit.ftl
@@ -406,13 +406,13 @@
</div>
- <div class="am-modal am-modal-prompt" style="width: 1000px;max-height:600px;overflow-y:auto;" tabindex="-1" id="my-prompt-income-detail">
+ <div class="am-modal am-modal-prompt" style="width: 1200px;max-height:600px;overflow-y:auto;" tabindex="-1" id="my-prompt-income-detail">
<div class="am-modal-dialog">
<div class="am-modal-hd">新增销售收入明细表——${project.name}</div>
<div class="am-modal-bd">
- <table class="am-table am-table-bordered am-table-radius table-main" style="padding:0;">
+ <table class="am-table am-table-bordered am-table-radius table-main" style="padding:0;" id="incomeTable">
<tbody>
- <tr class="am-text-xl">
+ <tr>
<td>类别</td>
<td>名称</td>
<td>单位</td>
@@ -421,25 +421,27 @@
<td>税率（%）</td>
<td>含税总金额（元）</td>
<td>不含税金额（元）</td>
+ <td>操作</td>
</tr>
<#if incomeDetails??>
<#list incomeDetails as incomeDetail>
<tr>
<td>
- <select data-am-selected class="am-modal-prompt-input">
+ <select style="width: auto" class="am-modal-prompt-input am-modal-prompt-input-income">
<option value="1" <#if incomeDetail.type == 1>selected</#if>>设备类</option>
<option value="2" <#if incomeDetail.type == 2>selected</#if>>工程类</option>
<option value="3" <#if incomeDetail.type == 3>selected</#if>>服务类</option>
</select>
</td>
- <td><input type="text" class="am-modal-prompt-input" value="${incomeDetail.name!}"></td>
- <td><input type="text" class="am-modal-prompt-input" value="${incomeDetail.unit!}"></td>
- <td><input type="text" class="am-modal-prompt-input" value="${incomeDetail.amount!}"></td>
- <td><input type="text" class="am-modal-prompt-input" value="${incomeDetail.price!}"></td>
- <td><input type="text" class="am-modal-prompt-input" value="${incomeDetail.taxRate!}"></td>
- <td><input type="text" class="am-modal-prompt-input" value="${incomeDetail.totalTaxInclude!}" readonly></td>
- <td><input type="text" class="am-modal-prompt-input" value="${incomeDetail.totalTaxExclude!}" readonly></td>
+ <td><input type="text" class="am-modal-prompt-input am-modal-prompt-input-income" value="${incomeDetail.name!}"></td>
+ <td><input type="text" class="am-modal-prompt-input am-modal-prompt-input-income" value="${incomeDetail.unit!}"></td>
+ <td><input type="text" class="am-modal-prompt-input am-modal-prompt-input-income input-changeable-amount" value="${incomeDetail.amount!}"></td>
+ <td><input type="text" class="am-modal-prompt-input am-modal-prompt-input-income input-changeable-price" value="${incomeDetail.price!}"></td>
+ <td><input type="text" class="am-modal-prompt-input am-modal-prompt-input-income input-changeable-tax-rate" value="${incomeDetail.taxRate!}"></td>
+ <td><input type="text" class="am-modal-prompt-input am-modal-prompt-input-income input-changeable-total-tax-include" value="${incomeDetail.totalTaxInclude!}" readonly></td>
+ <td><input type="text" class="am-modal-prompt-input am-modal-prompt-input-income input-changeable-total-tax-exclude" value="${incomeDetail.totalTaxExclude!}" readonly></td>
+ <td><button type="button" class="am-btn am-btn-warning am-btn-xs am-modal-line-delete">删除</button></td>
</tr>
</#list>
</#if>
@@ -463,6 +465,7 @@
</tr>-->
</tbody>
</table>
+ <button type="button" id="incomeAddBtn" class="am-btn am-btn-primary am-btn-xs">添加一行</button>
</div>
<div class="am-modal-footer">
<span class="am-modal-btn" data-am-modal-cancel>取消</span>
@@ -500,12 +503,39 @@
$('#my-prompt-income-detail').modal({
relatedTarget: this,
onConfirm: function(e) {
- saveIncome("${base}/project/budgetEditSaveIncomeDetail", e.data, $("#id").val());
+ //不能使用e.data，因为无法获取动态添加的
+ var data = collectIncomeData("am-modal-prompt-input-income");
+ saveIncome("${base}/project/budgetEditSaveIncomeDetail", data, $("#id").val());
},
onCancel: function(e) {
}
});
});
+ $("#incomeAddBtn").click(function () {
+ var template = '<tr>\n' +
+ ' <td>\n' +
+ ' <select style="width: auto" class="am-modal-prompt-input am-modal-prompt-input-income">\n' +
+ ' <option value="1">设备类</option>\n' +
+ ' <option value="2">工程类</option>\n' +
+ ' <option value="3">服务类</option>\n' +
+ ' </select>\n' +
+ ' </td>\n' +
+ ' <td><input type="text" class="am-modal-prompt-input am-modal-prompt-input-income"></td>\n' +
+ ' <td><input type="text" class="am-modal-prompt-input am-modal-prompt-input-income"></td>\n' +
+ ' <td><input type="text" class="am-modal-prompt-input am-modal-prompt-input-income input-changeable-amount"></td>\n' +
+ ' <td><input type="text" class="am-modal-prompt-input am-modal-prompt-input-income input-changeable-price"></td>\n' +
+ ' <td><input type="text" class="am-modal-prompt-input am-modal-prompt-input-income input-changeable-tax-rate"></td>\n' +
+ ' <td><input type="text" class="am-modal-prompt-input am-modal-prompt-input-income input-changeable-total-tax-include" readonly></td>\n' +
+ ' <td><input type="text" class="am-modal-prompt-input am-modal-prompt-input-income input-changeable-total-tax-exclude" readonly></td>\n' +
+ ' <td><button type="button" class="am-btn am-btn-warning am-btn-xs am-modal-line-delete">删除</button></td>\n' +
+ ' </tr>';
+ $("#incomeTable").append(template);
+ bindDeleteBtn();
+ bindIncomeChangeableInput();
+ });
+
+ bindDeleteBtn();
+ bindIncomeChangeableInput();
});
</script>
</@defaultLayout.layout>