Commit d32a44a4 by shj

预算分布实时总览:预算明细页面添加侧边栏,实时显示所有费用的实际情况

parent 7d51910a
......@@ -164,6 +164,7 @@ public class BudgetService implements IBudgetService {
Map<TestAndProcess,Integer> result=new HashMap<>();
TestAndProcess testAndProcess = new TestAndProcess();
testAndProcess.setPrice(number);
testAndProcess.setName("测试化验加工费");
result.put(testAndProcess,1);
return result;
}
......@@ -179,6 +180,7 @@ public class BudgetService implements IBudgetService {
Map<Power,Integer> result=new HashMap<>();
Power power = new Power();
power.setPrice(number);
power.setName("燃料动力费");
result.put(power,1);
return result;
}
......
......@@ -38,565 +38,682 @@
table {;
}
</style>
<%--Vue--%>
<script src="https://cdn.jsdelivr.net/npm/vue/dist/vue.js"></script>
<script src="https://cdn.staticfile.org/vue-resource/1.5.1/vue-resource.min.js"></script>
</head>
<body onload="equipmentVue.showlist()">
.sidenav {
height: 100%;
width: 0;
position: fixed;
z-index: 1;
top: 70px;
left: 0;
background-color: #66afe9;
overflow-x: hidden;
transition: 0.5s;
padding-top: 60px;
}
<nav class="navbar navbar-default navbar-fixed-top" role="navigation">
<div class="container-fluid">
<div class="navbar-header">
<a class="navbar-brand" href="${pageContext.request.contextPath}/">预算辅助管理系统</a>
</div>
<div>
<ul class="nav navbar-nav">
<li><a href="${pageContext.request.contextPath}/">创建预算</a></li>
<li><a href="${pageContext.request.contextPath}/Budget/HistoryPage">历史预算</a></li>
<li><a href="${pageContext.request.contextPath}/Rule/">修改规则</a></li>
<%--<li><a href="${pageContext.request.contextPath}/Budget/Download">导出最新预算</a></li>--%>
<li><a href="${pageContext.request.contextPath}/Test">测试</a></li>
<li><a href="${pageContext.request.contextPath}/usercenter.jsp">用户中心</a></li>
<li class="active"><a href="${pageContext.request.contextPath}/Budget/Detail">修改预算</a></li>
</ul>
</div>
</div>
</nav>
<ul id="myTab" class="nav nav-tabs">
<li class="active">
<a href="#equipment" data-toggle="tab" onclick=equipmentVue.showlist()>
设备费
</a>
</li>
<li><a href="#material" data-toggle="tab" onclick="materialVue.showlist()">材料费</a></li>
<li><a href="#test" data-toggle="tab" onclick="testVue.showlist()">测试化验加工费</a></li>
<li><a href="#power" data-toggle="tab">燃料动力费</a></li>
<li><a href="#travel" data-toggle="tab" onclick=travelVue.showlist()>差旅费</a></li>
<li><a href="#conference" data-toggle="tab" onclick="conferenceVue.showlist()">会议费</a></li>
<li><a href="#international" data-toggle="tab" onclick="internationalVue.showlist()">国际交流合作费</a></li>
<li><a href="#property" data-toggle="tab" onclick="propertyVue.showlist()">出版/文献/信息传播/知识产权事务费</a></li>
<li><a href="#labour" data-toggle="tab" onclick="labourVue.showlist()">劳务费</a></li>
<li><a href="#consultation" data-toggle="tab" onclick="consultationVue.showlist()">咨询费</a></li>
<li><a href="#others" data-toggle="tab">其他费用</a></li>
<li><a href="#indirect" data-toggle="tab" onclick="indirectVue.showlist()">间接费用</a></li>
</ul>
<h3>
<div>
<div class="text-center">
<label>总预算</label>
期望:<label id="total-req"></label>
实际:<label id="total-sum"></label>
<span id="total-hint"></span><label id="total-diff"></label>
</div>
<div class="text-center">
<label>本类预算</label>
期望:<label id="this-req"></label>
实际:<label id="this-sum"></label>
<span id="this-hint"></span><label id="this-diff"></label>
</div>
</div>
</h3>
.sidenav a {
padding: 8px 8px 8px 32px;
text-decoration: none;
font-size: 15px;
color: white;
display: block;
transition: 0.3s;
}
<div id="myTabContent" class="tab-content">
<div class="tab-pane fade in active" id="equipment">
<table class="table table-hover">
<thead>
<tr>
<th hidden>编号</th>
<th>名称</th>
<th>单价</th>
<th>数量</th>
<th>操作</th>
</tr>
</thead>
.sidenav a:hover, .offcanvas a:focus {
color: #f1f1f1;
}
<tbody id="equipment-table">
<tr v-for="item in items">
<td><input type="text" readonly v-model="item.name" class="form-control"></td>
<td><input type="number" v-model="item.price" class="form-control"></td>
<td><input type="number" v-model="item.nums" class="form-control"></td>
<td>
<button class="btn btn-success" @click="update(item)">确认</button>
<button class="btn btn-danger" @click="del(item)">删除</button>
</td>
</tr>
<tr class="success">
<td><input type="text" v-model="sample.name" class="form-control"></td>
<td><input type="number" v-model="sample.price" class="form-control"></td>
<td><input type="number" v-model="sample.nums" class="form-control"></td>
<td>
<button class="btn btn-success" @click="add(sample)">添加到本费用</button>
<button class="btn btn-success" @click="addToDatabase(sample)">添加到数据库</button>
</td>
</tr>
<tr class="info" v-if="database.length>0">
<td>
<select v-model="selectedIndex" class="form-control">
<option v-for="(record,i) in database" :value="i">
{{record.name}}
</option>
</select>
</td>
<td>
<input type="number" v-model="database[selectedIndex].price" class="form-control">
</td>
<td><input type="number" v-model="database[selectedIndex].nums" class="form-control"></td>
<td>
<button class="btn btn-success" @click="addFromDatabase(database[selectedIndex])">添加</button>
</td>
</tr>
</tbody>
</table>
</div>
.sidenav .closebtn {
position: absolute;
top: 0;
right: 25px;
font-size: 36px;
margin-left: 50px;
}
<div class="tab-pane fade" id="material">
<table class="table table-hover">
<thead>
<tr>
<th>名称</th>
<th>单价</th>
<th>数量</th>
</tr>
</thead>
#main {
transition: margin-left .5s;
padding: 0px;
}
<tbody>
<tr v-for="item in items">
<td><input type="text" readonly v-model="item.name" class="form-control"></td>
<td><input type="number" v-model="item.price" class="form-control"></td>
<td><input type="number" v-model="item.nums" class="form-control"></td>
<td>
<button class="btn btn-success" @click="update(item)">确认</button>
<button class="btn btn-danger" @click="del(item)">删除</button>
</td>
</tr>
<tr class="success">
<td><input type="text" v-model="sample.name" class="form-control"></td>
<td><input type="number" v-model="sample.price" class="form-control"></td>
<td><input type="number" v-model="sample.nums" class="form-control"></td>
<td>
<button class="btn btn-success" @click="add(sample)">添加</button>
</td>
</tr>
</tbody>
@media screen and (max-height: 450px) {
.sidenav {
padding-top: 15px;
}
</table>
</div>
.sidenav a {
font-size: 18px;
}
}
</style>
<div class="tab-pane fade" id="test">
<table class="table table-hover">
<%--Vue--%>
<script src="https://cdn.jsdelivr.net/npm/vue/dist/vue.js"></script>
<script src="https://cdn.staticfile.org/vue-resource/1.5.1/vue-resource.min.js"></script>
</head>
<body onload="equipmentVue.showlist()">
<div>
<div id="mySidenav" class="sidenav">
<a href="javascript:void(0)" class="closebtn" onclick="closeNav()">&times;</a>
<table class="table">
<thead>
<tr>
<th>名称</th>
<th>单价</th>
<th>数量</th>
<th>费用</th>
<th>实际</th>
</tr>
</thead>
<tbody>
<tr v-for="item in items">
<td><input type="text" readonly v-model="item.name" class="form-control"></td>
<td><input type="number" v-model="item.price" class="form-control"></td>
<td><input type="number" v-model="item.nums" class="form-control"></td>
<td>
<button class="btn btn-success" @click="update(item)">确认</button>
<button class="btn btn-danger" @click="del(item)">删除</button>
</td>
</tr>
<tr class="success">
<td><input type="text" v-model="sample.name" class="form-control"></td>
<td><input type="number" v-model="sample.price" class="form-control"></td>
<td><input type="number" v-model="sample.nums" class="form-control"></td>
<td>
<button class="btn btn-success" @click="add(sample)">添加</button>
</td>
</tr>
</tbody>
</table>
</div>
<div class="tab-pane fade" id="power">
<table class="table table-hover">
<thead>
<tr>
<th hidden>编号</th>
<th>名称</th>
<th>单价</th>
<th>数量</th>
<th>操作</th>
<td>设备费</td>
<td>{{budget.equipment.sum}}</td>
</tr>
</thead>
<tbody id="power-table">
<tr v-for="power in items">
<td><input type="text" readonly v-model="power.name"></td>
<td><input type="number" v-model="power.price"></td>
<td><input type="number" v-model="power.nums"></td>
<td>
<button class="btn btn-success" @click="update(power)">确认</button>
<button class="btn btn-danger" @click="del(power)">删除</button>
</td>
</tr>
</tbody>
</table>
</div>
<div class="tab-pane fade" id="travel">
<table class="table table-hover text-nowrap">
<thead>
<tr>
<th>城市</th>
<th>市际交通(往返)</th>
<th>伙食补助</th>
<th>市内交通补助(公杂费)</th>
<th>住宿补助</th>
<th>人数</th>
<th>天数</th>
<th>次数</th>
<th>操作</th>
</tr>
</thead>
<tbody id="travel-table">
<tr v-for="item in items" v-bind:title="item.name">
<td><input type="text" readonly v-model="item.name" class="form-control"></td>
<td><input type="number" v-model="item.price" class="form-control"></td>
<td><input type="number" v-model="item.food" class="form-control"></td>
<td><input type="number" v-model="item.traffic" class="form-control"></td>
<td><input type="number" v-model="item.accommodation" class="form-control"></td>
<td><input type="number" v-model="item.people" class="form-control"></td>
<td><input type="number" v-model="item.days" class="form-control"></td>
<td><input type="number" v-model="item.nums" class="form-control"></td>
<td>
<button class="btn btn-success" @click="update(item)">确认</button>
<button class="btn btn-danger" @click="del(item)">删除</button>
</td>
</tr>
<tr class="success">
<td><input type="text" v-model="sample.name" class="form-control"></td>
<td><input type="number" v-model="sample.price" class="form-control"></td>
<td><input type="number" v-model="sample.food" class="form-control"></td>
<td><input type="number" v-model="sample.traffic" class="form-control"></td>
<td><input type="number" v-model="sample.accommodation" class="form-control"></td>
<td><input type="number" v-model="sample.people" class="form-control"></td>
<td><input type="number" v-model="sample.days" class="form-control"></td>
<td>
<button class="btn btn-success" @click="add(sample)">添加</button>
</td>
</tr>
<tr class="info" v-if="database.length>0">
<td>
<select v-model="selectedIndex" class="form-control">
<option v-for="(record,i) in database" :value="i">
{{record.name}}
</option>
</select>
</td>
<td>
<input type="number" v-model="database[selectedIndex].price" class="form-control">
</td>
<td><input type="number" v-model="database[selectedIndex].food" class="form-control"></td>
<td><input type="number" v-model="database[selectedIndex].traffic" class="form-control"></td>
<td><input type="number" v-model="database[selectedIndex].accommodation" class="form-control"></td>
<td><input type="number" v-model="database[selectedIndex].people" class="form-control"></td>
<td><input type="number" v-model="database[selectedIndex].days" class="form-control"></td>
<td>
<button class="btn btn-success" @click="add(database[selectedIndex])">添加</button>
</td>
<td>材料费</td>
<td>{{budget.material.sum}}</td>
</tr>
</tbody>
</table>
</div>
<div class="tab-pane fade" id="conference">
<table class="table table-hover">
<thead>
<tr>
<th hidden>编号</th>
<th>名称</th>
<th hidden>专家类型</th>
<th hidden>需要专家人数</th>
<th>单价</th>
<th>参会人数</th>
<th>天数</th>
<th>会议次数</th>
<th>操作</th>
</tr>
</thead>
<tbody>
<tr v-for="item in items" v-bind:title="item.name">
<td><input type="text" readonly v-model="item.name" class="form-control"></td>
<td><input type="number" v-model="item.price" class="form-control"></td>
<td><input type="number" v-model="item.people" class="form-control"></td>
<td><input type="number" v-model="item.days" class="form-control"></td>
<td><input type="number" v-model="item.nums" class="form-control"></td>
<td>
<button class="btn btn-success" @click="update(item)">确认</button>
<button class="btn btn-danger" @click="del(item)">删除</button>
</td>
</tr>
<tr class="success">
<td><input type="text" v-model="sample.name" class="form-control"></td>
<td><input type="number" v-model="sample.price" class="form-control"></td>
<td><input type="number" v-model="sample.people" class="form-control"></td>
<td><input type="number" v-model="sample.days" class="form-control"></td>
<td><input type="number" v-model="sample.nums" class="form-control"></td>
<td>
<button class="btn btn-success" @click="add(sample)">添加</button>
</td>
<td>测试化验加工费</td>
<td>{{budget.testAndProcess.sum}}</td>
</tr>
</tbody>
</table>
</div>
<div class="tab-pane fade" id="international">
<div>
<p class="help-block"><b>市际</b>交通:指代往返价格、会议注册费等一次性费用</p>
<p class="help-block"><b>市内</b>交通:指代一切公杂费</p>
</div>
<table class="table table-hover text-nowrap">
<thead>
<tr>
<th>名称</th>
<th>市际交通</th>
<th>伙食补贴</th>
<th>市内交通</th>
<th>住宿补贴</th>
<th>人数</th>
<th>天数</th>
<th>次数</th>
<th>操作</th>
<td>燃料动力费</td>
<td>{{budget.power.sum}}</td>
</tr>
</thead>
<tbody>
<tr v-for="item in items" v-bind:title="item.name">
<td><input type="text" readonly v-model="item.name" class="form-control"></td>
<td>
<select class="form-control" v-model="item.price">
<option v-for="n in 40000" v-if="n%1000==0">{{n}}</option>
</select>
</td>
<td><input type="number" v-model="item.food" class="form-control"></td>
<td><input type="number" v-model="item.traffic" class="form-control"></td>
<td><input type="number" v-model="item.accommodation" class="form-control"></td>
<td><input type="number" v-model="item.people" class="form-control"></td>
<td><input type="number" v-model="item.days" class="form-control"></td>
<td><input type="number" v-model="item.nums" class="form-control"></td>
<td>
<button class="btn btn-success" @click="update(item)">确认</button>
<button class="btn btn-danger" @click="del(item)">删除</button>
</td>
</tr>
<tr class="success">
<td><input type="text" v-model="sample.name" class="form-control"></td>
<td><input type="number" v-model="sample.price" class="form-control"></td>
<td><input type="number" v-model="sample.food" class="form-control"></td>
<td><input type="number" v-model="sample.traffic" class="form-control"></td>
<td><input type="number" v-model="sample.accommodation" class="form-control"></td>
<td><input type="number" v-model="sample.people" class="form-control"></td>
<td><input type="number" v-model="sample.days" class="form-control"></td>
<td>
<button class="btn btn-success" @click="add(sample)">添加</button>
</td>
</tr>
<tr class="info" v-if="database.length>0">
<td>
<select v-model="selectedIndex" class="form-control">
<option v-for="(record,i) in database" :value="i">
{{record.name}}
</option>
</select>
</td>
<td>
<input type="number" v-model="database[selectedIndex].price" class="form-control">
</td>
<td><input type="number" v-model="database[selectedIndex].food" class="form-control"></td>
<td><input type="number" v-model="database[selectedIndex].traffic" class="form-control"></td>
<td><input type="number" v-model="database[selectedIndex].accommodation" class="form-control"></td>
<td><input type="number" v-model="database[selectedIndex].people" class="form-control"></td>
<td><input type="number" v-model="database[selectedIndex].days" class="form-control"></td>
<td>
<button class="btn btn-success" @click="add(database[selectedIndex])">添加</button>
</td>
</tr>
</tbody>
</table>
</div>
<div class="tab-pane fade" id="property">
<table class="table table-hover">
<thead>
<tr>
<th hidden>编号</th>
<th>名称</th>
<th>单价</th>
<th>数量</th>
<th>操作</th>
</tr>
</thead>
<tbody>
<tr v-for="item in items">
<td><input type="text" readonly v-model="item.name" class="form-control"></td>
<td><input type="number" v-model="item.price" class="form-control"></td>
<td><input type="number" v-model="item.nums" class="form-control"></td>
<td>
<button class="btn btn-success" @click="update(item)">确认</button>
<button class="btn btn-danger" @click="del(item)">删除</button>
</td>
<td>差旅费</td>
<td>{{budget.travel.sum}}</td>
</tr>
<tr class="success">
<td><input type="text" v-model="sample.name" class="form-control"></td>
<td><input type="number" v-model="sample.price" class="form-control"></td>
<td><input type="number" v-model="sample.nums" class="form-control"></td>
<td>
<button class="btn btn-success" @click="add(sample)">添加</button>
</td>
</tr>
</tbody>
</table>
</div>
<div class="tab-pane fade" id="labour">
<table class="table table-hover">
<thead>
<tr>
<th hidden>编号</th>
<th>类型</th>
<th>劳务费(每人每月)</th>
<th></th>
<th></th>
</tr>
</thead>
<tbody>
<tr v-for="item in items" v-bind:title="item.name">
<td><input type="text" readonly v-model="item.name" class="form-control"></td>
<td><input type="number" v-model="item.price" class="form-control">五险一金:{{item.tax}}</td>
<td><input type="number" v-model="item.people" class="form-control"></td>
<td><input type="number" v-model="item.months" class="form-control"></td>
<td>
<button class="btn btn-success" @click="update(item)">确认</button>
<button class="btn btn-danger" @click="del(item)">删除</button>
</td>
<td>会议费</td>
<td>{{budget.conference.sum}}</td>
</tr>
<tr class="info" v-if="database.length>0">
<td>
<select v-model="selectedIndex" class="form-control">
<option v-for="(record,i) in database" :value="i">
{{record.name}}
</option>
</select>
</td>
<td>
<input type="number" v-model="database[selectedIndex].price" class="form-control">
</td>
<td><input type="number" v-model="database[selectedIndex].people" class="form-control"></td>
<td><input type="number" v-model="database[selectedIndex].months" class="form-control"></td>
<td>
<button class="btn btn-success" @click="add(database[selectedIndex])">添加</button>
</td>
<tr>
<td>国际合作交流费</td>
<td>{{budget.international.sum}}</td>
</tr>
</tbody>
</table>
</div>
<div class="tab-pane fade" id="consultation">
<table class="table table-hover">
<thead>
<tr>
<th hidden>编号</th>
<th>人员类型</th>
<th>费用标准</th>
<th>人数</th>
<th>操作</th>
<td>出版/文献/信息传播/知识产权事务费</td>
<td>{{budget.property.sum}}</td>
</tr>
</thead>
<tbody>
<tr v-for="item in items" v-bind:title="item.name">
<td><input type="text" readonly v-model="item.name" class="form-control"></td>
<%--<td><input type="number" v-model="item.price"></td>--%>
<td>
<select class="form-control" v-model="item.price">
<option v-for="n in 2800" v-if="n%100==0">{{n}}</option>
</select>
</td>
<td><input type="number" v-model="item.nums" class="form-control"></td>
<td>
<button class="btn btn-success" @click="update(item)">确认</button>
<button class="btn btn-danger" @click="del(item)">删除</button>
</td>
<tr>
<td>劳务费</td>
<td>{{budget.labour.sum}}</td>
</tr>
<tr class="info" v-if="database.length>0">
<td>
<select v-model="selectedIndex" class="form-control">
<option v-for="(record,i) in database" :value="i">
{{record.name}}
</option>
</select>
</td>
<td>
<select class="form-control" v-model="database[selectedIndex].price">
<option v-for="n in 2800" v-if="n%100==0">{{n}}</option>
</select>
</td>
<td><input type="number" v-model="database[selectedIndex].nums" class="form-control"></td>
<td>
<button class="btn btn-success" @click="add(database[selectedIndex])">添加</button>
</td>
<tr>
<td>咨询费</td>
<td>{{budget.consultation.sum}}</td>
</tr>
</tbody>
</table>
</div>
<div class="tab-pane fade" id="others">
</div>
<div class="tab-pane fade" id="indirect">
<table class="table table-hover">
<thead>
<tr>
<th hidden>ID</th>
<th>名称</th>
<th>费用</th>
<th>数量</th>
<th>操作</th>
<td>其他费用</td>
<td>{{budget.others.sum}}</td>
</tr>
</thead>
<tbody id="indirect-body">
<tr v-for="item in items">
<td>{{item.name}}</td>
<td><input type="number" v-model="item.price" class="form-control"></td>
<td>{{item.nums}}</td>
<td>
<button class="btn btn-success" @click="update(item)">确认</button>
</td>
<tr>
<td>间接费用</td>
<td>{{budget.indirect.sum}}</td>
</tr>
</tbody>
</table>
</div>
<div id="main">
<span style="font-size:30px;cursor:pointer" onclick="openNav()">&#9776; 打开预算分布</span>
<nav class="navbar navbar-default navbar-fixed-top" role="navigation">
<div class="container-fluid">
<div class="navbar-header">
<a class="navbar-brand" href="${pageContext.request.contextPath}/">预算辅助管理系统</a>
</div>
<div>
<ul class="nav navbar-nav">
<li><a href="${pageContext.request.contextPath}/">创建预算</a></li>
<li><a href="${pageContext.request.contextPath}/Budget/HistoryPage">历史预算</a></li>
<li><a href="${pageContext.request.contextPath}/Rule/">修改规则</a></li>
<%--<li><a href="${pageContext.request.contextPath}/Budget/Download">导出最新预算</a></li>--%>
<li><a href="${pageContext.request.contextPath}/Test">测试</a></li>
<li><a href="${pageContext.request.contextPath}/usercenter.jsp">用户中心</a></li>
<li class="active"><a href="${pageContext.request.contextPath}/Budget/Detail">修改预算</a></li>
</ul>
</div>
</div>
</nav>
<ul id="myTab" class="nav nav-tabs">
<li class="active">
<a href="#equipment" data-toggle="tab" onclick=equipmentVue.showlist()>
设备费
</a>
</li>
<li><a href="#material" data-toggle="tab" onclick="materialVue.showlist()">材料费</a></li>
<li><a href="#test" data-toggle="tab" onclick="testVue.showlist()">测试化验加工费</a></li>
<li><a href="#power" data-toggle="tab">燃料动力费</a></li>
<li><a href="#travel" data-toggle="tab" onclick=travelVue.showlist()>差旅费</a></li>
<li><a href="#conference" data-toggle="tab" onclick="conferenceVue.showlist()">会议费</a></li>
<li><a href="#international" data-toggle="tab" onclick="internationalVue.showlist()">国际交流合作费</a></li>
<li><a href="#property" data-toggle="tab" onclick="propertyVue.showlist()">出版/文献/信息传播/知识产权事务费</a></li>
<li><a href="#labour" data-toggle="tab" onclick="labourVue.showlist()">劳务费</a></li>
<li><a href="#consultation" data-toggle="tab" onclick="consultationVue.showlist()">咨询费</a></li>
<li><a href="#others" data-toggle="tab">其他费用</a></li>
<li><a href="#indirect" data-toggle="tab" onclick="indirectVue.showlist()">间接费用</a></li>
</ul>
<h3>
<div>
<div class="text-center">
<label>总预算</label>
期望:<label id="total-req"></label>
实际:<label id="total-sum"></label>
<span id="total-hint"></span><label id="total-diff"></label>
</div>
<div class="text-center">
<label>本类预算</label>
期望:<label id="this-req"></label>
实际:<label id="this-sum"></label>
<span id="this-hint"></span><label id="this-diff"></label>
</div>
</div>
</h3>
<div id="myTabContent" class="tab-content">
<div class="tab-pane fade in active" id="equipment">
<table class="table table-hover">
<thead>
<tr>
<th hidden>编号</th>
<th>名称</th>
<th>单价</th>
<th>数量</th>
<th>操作</th>
</tr>
</thead>
<tbody id="equipment-table">
<tr v-for="item in items">
<td><input type="text" readonly v-model="item.name" class="form-control"></td>
<td><input type="number" v-model="item.price" class="form-control"></td>
<td><input type="number" v-model="item.nums" class="form-control"></td>
<td>
<button class="btn btn-success" @click="update(item)">确认</button>
<button class="btn btn-danger" @click="del(item)">删除</button>
</td>
</tr>
<tr class="success">
<td><input type="text" v-model="sample.name" class="form-control"></td>
<td><input type="number" v-model="sample.price" class="form-control"></td>
<td><input type="number" v-model="sample.nums" class="form-control"></td>
<td>
<button class="btn btn-success" @click="add(sample)">添加到本费用</button>
<button class="btn btn-success" @click="addToDatabase(sample)">添加到数据库</button>
</td>
</tr>
<tr class="info" v-if="database.length>0">
<td>
<select v-model="selectedIndex" class="form-control">
<option v-for="(record,i) in database" :value="i">
{{record.name}}
</option>
</select>
</td>
<td>
<input type="number" v-model="database[selectedIndex].price" class="form-control">
</td>
<td><input type="number" v-model="database[selectedIndex].nums" class="form-control"></td>
<td>
<button class="btn btn-success" @click="addFromDatabase(database[selectedIndex])">添加
</button>
</td>
</tr>
</tbody>
</table>
</div>
<div class="tab-pane fade" id="material">
<table class="table table-hover">
<thead>
<tr>
<th>名称</th>
<th>单价</th>
<th>数量</th>
</tr>
</thead>
<tbody>
<tr v-for="item in items">
<td><input type="text" readonly v-model="item.name" class="form-control"></td>
<td><input type="number" v-model="item.price" class="form-control"></td>
<td><input type="number" v-model="item.nums" class="form-control"></td>
<td>
<button class="btn btn-success" @click="update(item)">确认</button>
<button class="btn btn-danger" @click="del(item)">删除</button>
</td>
</tr>
<tr class="success">
<td><input type="text" v-model="sample.name" class="form-control"></td>
<td><input type="number" v-model="sample.price" class="form-control"></td>
<td><input type="number" v-model="sample.nums" class="form-control"></td>
<td>
<button class="btn btn-success" @click="add(sample)">添加</button>
</td>
</tr>
</tbody>
</table>
</div>
<div class="tab-pane fade" id="test">
<table class="table table-hover">
<thead>
<tr>
<th>名称</th>
<th>单价</th>
<th>数量</th>
</tr>
</thead>
<tbody>
<tr v-for="item in items">
<td><input type="text" readonly v-model="item.name" class="form-control"></td>
<td><input type="number" v-model="item.price" class="form-control"></td>
<td><input type="number" v-model="item.nums" class="form-control"></td>
<td>
<button class="btn btn-success" @click="update(item)">确认</button>
<button class="btn btn-danger" @click="del(item)">删除</button>
</td>
</tr>
<tr class="success">
<td><input type="text" v-model="sample.name" class="form-control"></td>
<td><input type="number" v-model="sample.price" class="form-control"></td>
<td><input type="number" v-model="sample.nums" class="form-control"></td>
<td>
<button class="btn btn-success" @click="add(sample)">添加</button>
</td>
</tr>
</tbody>
</table>
</div>
<div class="tab-pane fade" id="power">
<table class="table table-hover">
<thead>
<tr>
<th hidden>编号</th>
<th>名称</th>
<th>单价</th>
<th>数量</th>
<th>操作</th>
</tr>
</thead>
<tbody id="power-table">
<tr v-for="power in items">
<td><input type="text" readonly v-model="power.name"></td>
<td><input type="number" v-model="power.price"></td>
<td><input type="number" v-model="power.nums"></td>
<td>
<button class="btn btn-success" @click="update(power)">确认</button>
<button class="btn btn-danger" @click="del(power)">删除</button>
</td>
</tr>
</tbody>
</table>
</div>
<div class="tab-pane fade" id="travel">
<table class="table table-hover text-nowrap">
<thead>
<tr>
<th>城市</th>
<th>市际交通(往返)</th>
<th>伙食补助</th>
<th>市内交通补助(公杂费)</th>
<th>住宿补助</th>
<th>人数</th>
<th>天数</th>
<th>次数</th>
<th>操作</th>
</tr>
</thead>
<tbody id="travel-table">
<tr v-for="item in items" v-bind:title="item.name">
<td><input type="text" readonly v-model="item.name" class="form-control"></td>
<td><input type="number" v-model="item.price" class="form-control"></td>
<td><input type="number" v-model="item.food" class="form-control"></td>
<td><input type="number" v-model="item.traffic" class="form-control"></td>
<td><input type="number" v-model="item.accommodation" class="form-control"></td>
<td><input type="number" v-model="item.people" class="form-control"></td>
<td><input type="number" v-model="item.days" class="form-control"></td>
<td><input type="number" v-model="item.nums" class="form-control"></td>
<td>
<button class="btn btn-success" @click="update(item)">确认</button>
<button class="btn btn-danger" @click="del(item)">删除</button>
</td>
</tr>
<tr class="success">
<td><input type="text" v-model="sample.name" class="form-control"></td>
<td><input type="number" v-model="sample.price" class="form-control"></td>
<td><input type="number" v-model="sample.food" class="form-control"></td>
<td><input type="number" v-model="sample.traffic" class="form-control"></td>
<td><input type="number" v-model="sample.accommodation" class="form-control"></td>
<td><input type="number" v-model="sample.people" class="form-control"></td>
<td><input type="number" v-model="sample.days" class="form-control"></td>
<td>
<button class="btn btn-success" @click="add(sample)">添加</button>
</td>
</tr>
<tr class="info" v-if="database.length>0">
<td>
<select v-model="selectedIndex" class="form-control">
<option v-for="(record,i) in database" :value="i">
{{record.name}}
</option>
</select>
</td>
<td>
<input type="number" v-model="database[selectedIndex].price" class="form-control">
</td>
<td><input type="number" v-model="database[selectedIndex].food" class="form-control"></td>
<td><input type="number" v-model="database[selectedIndex].traffic" class="form-control"></td>
<td><input type="number" v-model="database[selectedIndex].accommodation" class="form-control">
</td>
<td><input type="number" v-model="database[selectedIndex].people" class="form-control"></td>
<td><input type="number" v-model="database[selectedIndex].days" class="form-control"></td>
<td>
<button class="btn btn-success" @click="add(database[selectedIndex])">添加</button>
</td>
</tr>
</tbody>
</table>
</div>
<div class="tab-pane fade" id="conference">
<table class="table table-hover">
<thead>
<tr>
<th hidden>编号</th>
<th>名称</th>
<th hidden>专家类型</th>
<th hidden>需要专家人数</th>
<th>单价</th>
<th>参会人数</th>
<th>天数</th>
<th>会议次数</th>
<th>操作</th>
</tr>
</thead>
<tbody>
<tr v-for="item in items" v-bind:title="item.name">
<td><input type="text" readonly v-model="item.name" class="form-control"></td>
<td><input type="number" v-model="item.price" class="form-control"></td>
<td><input type="number" v-model="item.people" class="form-control"></td>
<td><input type="number" v-model="item.days" class="form-control"></td>
<td><input type="number" v-model="item.nums" class="form-control"></td>
<td>
<button class="btn btn-success" @click="update(item)">确认</button>
<button class="btn btn-danger" @click="del(item)">删除</button>
</td>
</tr>
<tr class="success">
<td><input type="text" v-model="sample.name" class="form-control"></td>
<td><input type="number" v-model="sample.price" class="form-control"></td>
<td><input type="number" v-model="sample.people" class="form-control"></td>
<td><input type="number" v-model="sample.days" class="form-control"></td>
<td><input type="number" v-model="sample.nums" class="form-control"></td>
<td>
<button class="btn btn-success" @click="add(sample)">添加</button>
</td>
</tr>
</tbody>
</table>
</div>
<div class="tab-pane fade" id="international">
<div>
<p class="help-block"><b>市际</b>交通:指代往返价格、会议注册费等一次性费用</p>
<p class="help-block"><b>市内</b>交通:指代一切公杂费</p>
</div>
<table class="table table-hover text-nowrap">
<thead>
<tr>
<th>名称</th>
<th>市际交通</th>
<th>伙食补贴</th>
<th>市内交通</th>
<th>住宿补贴</th>
<th>人数</th>
<th>天数</th>
<th>次数</th>
<th>操作</th>
</tr>
</thead>
<tbody>
<tr v-for="item in items" v-bind:title="item.name">
<td><input type="text" readonly v-model="item.name" class="form-control"></td>
<td>
<select class="form-control" v-model="item.price">
<option v-for="n in 40000" v-if="n%1000==0">{{n}}</option>
</select>
</td>
<td><input type="number" v-model="item.food" class="form-control"></td>
<td><input type="number" v-model="item.traffic" class="form-control"></td>
<td><input type="number" v-model="item.accommodation" class="form-control"></td>
<td><input type="number" v-model="item.people" class="form-control"></td>
<td><input type="number" v-model="item.days" class="form-control"></td>
<td><input type="number" v-model="item.nums" class="form-control"></td>
<td>
<button class="btn btn-success" @click="update(item)">确认</button>
<button class="btn btn-danger" @click="del(item)">删除</button>
</td>
</tr>
<tr class="success">
<td><input type="text" v-model="sample.name" class="form-control"></td>
<td><input type="number" v-model="sample.price" class="form-control"></td>
<td><input type="number" v-model="sample.food" class="form-control"></td>
<td><input type="number" v-model="sample.traffic" class="form-control"></td>
<td><input type="number" v-model="sample.accommodation" class="form-control"></td>
<td><input type="number" v-model="sample.people" class="form-control"></td>
<td><input type="number" v-model="sample.days" class="form-control"></td>
<td>
<button class="btn btn-success" @click="add(sample)">添加</button>
</td>
</tr>
<tr class="info" v-if="database.length>0">
<td>
<select v-model="selectedIndex" class="form-control">
<option v-for="(record,i) in database" :value="i">
{{record.name}}
</option>
</select>
</td>
<td>
<input type="number" v-model="database[selectedIndex].price" class="form-control">
</td>
<td><input type="number" v-model="database[selectedIndex].food" class="form-control"></td>
<td><input type="number" v-model="database[selectedIndex].traffic" class="form-control"></td>
<td><input type="number" v-model="database[selectedIndex].accommodation" class="form-control">
</td>
<td><input type="number" v-model="database[selectedIndex].people" class="form-control"></td>
<td><input type="number" v-model="database[selectedIndex].days" class="form-control"></td>
<td>
<button class="btn btn-success" @click="add(database[selectedIndex])">添加</button>
</td>
</tr>
</tbody>
</table>
</div>
<div class="tab-pane fade" id="property">
<table class="table table-hover">
<thead>
<tr>
<th hidden>编号</th>
<th>名称</th>
<th>单价</th>
<th>数量</th>
<th>操作</th>
</tr>
</thead>
<tbody>
<tr v-for="item in items">
<td><input type="text" readonly v-model="item.name" class="form-control"></td>
<td><input type="number" v-model="item.price" class="form-control"></td>
<td><input type="number" v-model="item.nums" class="form-control"></td>
<td>
<button class="btn btn-success" @click="update(item)">确认</button>
<button class="btn btn-danger" @click="del(item)">删除</button>
</td>
</tr>
<tr class="success">
<td><input type="text" v-model="sample.name" class="form-control"></td>
<td><input type="number" v-model="sample.price" class="form-control"></td>
<td><input type="number" v-model="sample.nums" class="form-control"></td>
<td>
<button class="btn btn-success" @click="add(sample)">添加</button>
</td>
</tr>
</tbody>
</table>
</div>
<div class="tab-pane fade" id="labour">
<table class="table table-hover">
<thead>
<tr>
<th hidden>编号</th>
<th>类型</th>
<th>劳务费(每人每月)</th>
<th></th>
<th></th>
</tr>
</thead>
<tbody>
<tr v-for="item in items" v-bind:title="item.name">
<td><input type="text" readonly v-model="item.name" class="form-control"></td>
<td><input type="number" v-model="item.price" class="form-control">五险一金:{{item.tax}}</td>
<td><input type="number" v-model="item.people" class="form-control"></td>
<td><input type="number" v-model="item.months" class="form-control"></td>
<td>
<button class="btn btn-success" @click="update(item)">确认</button>
<button class="btn btn-danger" @click="del(item)">删除</button>
</td>
</tr>
<tr class="info" v-if="database.length>0">
<td>
<select v-model="selectedIndex" class="form-control">
<option v-for="(record,i) in database" :value="i">
{{record.name}}
</option>
</select>
</td>
<td>
<input type="number" v-model="database[selectedIndex].price" class="form-control">
</td>
<td><input type="number" v-model="database[selectedIndex].people" class="form-control"></td>
<td><input type="number" v-model="database[selectedIndex].months" class="form-control"></td>
<td>
<button class="btn btn-success" @click="add(database[selectedIndex])">添加</button>
</td>
</tr>
</tbody>
</table>
</div>
<div class="tab-pane fade" id="consultation">
<table class="table table-hover">
<thead>
<tr>
<th hidden>编号</th>
<th>人员类型</th>
<th>费用标准</th>
<th>人数</th>
<th>操作</th>
</tr>
</thead>
<tbody>
<tr v-for="item in items" v-bind:title="item.name">
<td><input type="text" readonly v-model="item.name" class="form-control"></td>
<%--<td><input type="number" v-model="item.price"></td>--%>
<td>
<select class="form-control" v-model="item.price">
<option v-for="n in 2800" v-if="n%100==0">{{n}}</option>
</select>
</td>
<td><input type="number" v-model="item.nums" class="form-control"></td>
<td>
<button class="btn btn-success" @click="update(item)">确认</button>
<button class="btn btn-danger" @click="del(item)">删除</button>
</td>
</tr>
<tr class="info" v-if="database.length>0">
<td>
<select v-model="selectedIndex" class="form-control">
<option v-for="(record,i) in database" :value="i">
{{record.name}}
</option>
</select>
</td>
<td>
<select class="form-control" v-model="database[selectedIndex].price">
<option v-for="n in 2800" v-if="n%100==0">{{n}}</option>
</select>
</td>
<td><input type="number" v-model="database[selectedIndex].nums" class="form-control"></td>
<td>
<button class="btn btn-success" @click="add(database[selectedIndex])">添加</button>
</td>
</tr>
</tbody>
</table>
</div>
<div class="tab-pane fade" id="others">
</div>
<div class="tab-pane fade" id="indirect">
<table class="table table-hover">
<thead>
<tr>
<th hidden>ID</th>
<th>名称</th>
<th>费用</th>
<th>数量</th>
<th>操作</th>
</tr>
</thead>
<tbody id="indirect-body">
<tr v-for="item in items">
<td>{{item.name}}</td>
<td><input type="number" v-model="item.price" class="form-control"></td>
<td>{{item.nums}}</td>
<td>
<button class="btn btn-success" @click="update(item)">确认</button>
</td>
</tr>
</tbody>
</table>
</div>
</div>
</div>
</div>
<iframe name='hidden_frame' id="hidden_frame" style="display:none"></iframe>
......@@ -605,21 +722,41 @@
<script>
function inItems(value,items) {
for(var i = 0; i < items.length; i++){
if(value.name === items[i].name){
function openNav() {
document.getElementById("mySidenav").style.width = "250px";
document.getElementById("main").style.marginLeft = "250px";
}
function closeNav() {
document.getElementById("mySidenav").style.width = "0";
document.getElementById("main").style.marginLeft = "0";
}
function inItems(value, items) {
for (var i = 0; i < items.length; i++) {
if (value.name === items[i].name) {
return true;
}
}
return false;
}
var sidenavVue=new Vue({
el:"#mySidenav",
data:{
budget:{}
}
});
var equipmentVue = new Vue({
el: "#equipment",
data: {
sample: {name: "sample", price: 0, nums: 0},
items: [],
database:[{name: "sample", price: 0, nums: 0}],
selectedIndex:0
database: [{name: "sample", price: 0, nums: 0}],
selectedIndex: 0
},
methods: {
update: function (item) {
......@@ -646,19 +783,18 @@
}
);
},
showDatabase:function(){
showDatabase: function () {
this.$http.get("${pageContext.request.contextPath}/Database/Query/Equipment").then(
function (data) {
var tmp= data.body.data;
for(var i=0;i<tmp.length;i++)
{
if(inItems(tmp[i],this.items)){
console.log("inItems:true, "+tmp[i].name);
tmp.splice(i,1);
var tmp = data.body.data;
for (var i = 0; i < tmp.length; i++) {
if (inItems(tmp[i], this.items)) {
console.log("inItems:true, " + tmp[i].name);
tmp.splice(i, 1);
i--;
}
}
this.database=tmp;
this.database = tmp;
console.log("show database");
}, function (error) {
console.log(error)
......@@ -783,8 +919,8 @@
data: {
items: [],
sample: {name: "sample", price: 0, food: 0, accommodation: 0, traffic: 0, days: 0, people: 0, nums: 0},
database:[{name: "sample", price: 0, food: 0, accommodation: 0, traffic: 0, days: 0, people: 0, nums: 0}],
selectedIndex:0
database: [{name: "sample", price: 0, food: 0, accommodation: 0, traffic: 0, days: 0, people: 0, nums: 0}],
selectedIndex: 0
},
methods: {
update: function (item) {
......@@ -808,19 +944,18 @@
}
)
},
showDatabase:function(){
showDatabase: function () {
this.$http.get("${pageContext.request.contextPath}/Database/Query/International").then(
function (data) {
var tmp= data.body.data;
for(var i=0;i<tmp.length;i++)
{
if(inItems(tmp[i],this.items)){
console.log("inItems:true, "+tmp[i].name);
tmp.splice(i,1);
var tmp = data.body.data;
for (var i = 0; i < tmp.length; i++) {
if (inItems(tmp[i], this.items)) {
console.log("inItems:true, " + tmp[i].name);
tmp.splice(i, 1);
i--;
}
}
this.database=tmp;
this.database = tmp;
console.log("show database");
}, function (error) {
console.log(error)
......@@ -918,8 +1053,8 @@
data: {
items: [],
sample: {name: "sample", price: 0, food: 0, accommodation: 0, traffic: 0, days: 0, people: 0, nums: 0},
database:[{name: "sample", price: 0, food: 0, accommodation: 0, traffic: 0, days: 0, people: 0, nums: 0}],
selectedIndex:0
database: [{name: "sample", price: 0, food: 0, accommodation: 0, traffic: 0, days: 0, people: 0, nums: 0}],
selectedIndex: 0
},
methods: {
update: function (item) {
......@@ -943,19 +1078,18 @@
}
)
},
showDatabase:function(){
showDatabase: function () {
this.$http.get("${pageContext.request.contextPath}/Database/Query/Travel").then(
function (data) {
var tmp= data.body.data;
for(var i=0;i<tmp.length;i++)
{
if(inItems(tmp[i],this.items)){
console.log("inItems:true, "+tmp[i].name);
tmp.splice(i,1);
var tmp = data.body.data;
for (var i = 0; i < tmp.length; i++) {
if (inItems(tmp[i], this.items)) {
console.log("inItems:true, " + tmp[i].name);
tmp.splice(i, 1);
i--;
}
}
this.database=tmp;
this.database = tmp;
console.log("show database");
}, function (error) {
console.log(error)
......@@ -1084,8 +1218,8 @@
data: {
items: [],
sample: {name: "sample", price: 0, nums: 0},
selectedIndex:0,
database:[{name: "sample", price: 0, nums: 0,people:0,months:0}]
selectedIndex: 0,
database: [{name: "sample", price: 0, nums: 0, people: 0, months: 0}]
},
methods: {
update: function (item) {
......@@ -1095,7 +1229,7 @@
this.doUpdate(item, 1);
},
add: function (item) {
item.nums=1;
item.nums = 1;
this.doUpdate(item, 0);
},
showlist: function () {
......@@ -1110,18 +1244,17 @@
}
);
},
showDatabase:function(){
showDatabase: function () {
this.$http.get("${pageContext.request.contextPath}/Database/Query/Labour").then(
function (data) {
var list = data.body.data;
for(var i=0;i<list.length;i++)
{
if(inItems(list[i],this.items)){
list.splice(i,1);
for (var i = 0; i < list.length; i++) {
if (inItems(list[i], this.items)) {
list.splice(i, 1);
i--;
}
}
this.database=list;
this.database = list;
console.log("show database");
}, function (error) {
console.log(error)
......@@ -1179,20 +1312,19 @@
}
);
},
showDatabase:function(){
showDatabase: function () {
this.$http.get("${pageContext.request.contextPath}/Database/Query/Consultation").then(
function (data) {
var list = data.body.data;
console.log(this.items);
for(var i=0;i<list.length;i++)
{
if(inItems(list[i],this.items)){
console.log("deleted: "+list[i].name);
list.splice(i,1);
for (var i = 0; i < list.length; i++) {
if (inItems(list[i], this.items)) {
console.log("deleted: " + list[i].name);
list.splice(i, 1);
i--;
}
}
this.database=list;
this.database = list;
console.log("show database");
}, function (error) {
console.log(error)
......@@ -1228,6 +1360,7 @@
type: "post",
dataType: "json",
success: function (data) {
sidenavVue.budget=data;
var over = "预算超出:";
var under = "预算不足,再来";
var equal = "凑够啦!";
......@@ -1235,7 +1368,7 @@
over: "red",
under: "blue",
equal: "green"
}
};
document.getElementById("total-req").innerHTML = data.req;
document.getElementById("total-sum").innerHTML = data.sum;
document.getElementById("total-diff").innerHTML = abs(data.diff);
......
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment