当右侧表格太宽时不会换行
This commit is contained in:
parent
282e578686
commit
ebb61dbb40
|
@ -22,7 +22,7 @@
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
<div class="col" v-show="showPage">
|
<div class="col-10" v-show="showPage">
|
||||||
<ol class="breadcrumb">
|
<ol class="breadcrumb">
|
||||||
<li class="breadcrumb-item">{{bread.p}}</li>
|
<li class="breadcrumb-item">{{bread.p}}</li>
|
||||||
<li class="breadcrumb-item">{{bread.n}}</li>
|
<li class="breadcrumb-item">{{bread.n}}</li>
|
||||||
|
|
|
@ -1,85 +0,0 @@
|
||||||
<div id="findPerson">
|
|
||||||
<div id="para" class="reportFilter">
|
|
||||||
<input type="hidden" name="ProcedureName" v-model="ProcedureName" />
|
|
||||||
<input type="hidden" name="reportName" v-model="reportName" />
|
|
||||||
<input type="hidden" name="sqlStr" v-model="sqlStr" />
|
|
||||||
<input type="hidden" name="uid" v-model="uid" />
|
|
||||||
<input type="hidden" name="uName" v-model="uName" />
|
|
||||||
<!--以下部分为查询条件,根据实际需要修改-->
|
|
||||||
<label>姓名:<input name="name" value="" placeholder="输入姓名或留空" /></label>
|
|
||||||
<label>地址:<input name="address" value="" placeholder="输入地址数据" /></label>
|
|
||||||
<label>地址:<input name="marry" value="" placeholder="是否结婚" /></label>
|
|
||||||
|
|
||||||
<div class="btn-group">
|
|
||||||
<button class="btn btn-primary" v-on:click="find">查询</button>
|
|
||||||
<button class="btn btn-primary" v-on:click="print">打印</button>
|
|
||||||
<button class="btn btn-primary" v-on:click="down" v-if="result.length > 0">下载EXCEL</button>
|
|
||||||
</div>
|
|
||||||
<!--可修改部分结束-->
|
|
||||||
</div>
|
|
||||||
<div id="result" v-if="result.length > 0">
|
|
||||||
<!--以下部分为存储过程返回数据,根据实际需要修改-->
|
|
||||||
<table class="table reportTable" id="resultTable">
|
|
||||||
<thead>
|
|
||||||
<tr>
|
|
||||||
<th>姓名</th>
|
|
||||||
<th>年龄</th>
|
|
||||||
<th>性别</th>
|
|
||||||
<th>登录用户编号</th>
|
|
||||||
<th>登录用户名</th>
|
|
||||||
</tr>
|
|
||||||
</thead>
|
|
||||||
<tbody>
|
|
||||||
<tr v-for="i in result">
|
|
||||||
<td>{{i.name}}</td>
|
|
||||||
<td>{{i.age}}</td>
|
|
||||||
<td>{{i.sex}}</td>
|
|
||||||
<td>{{i.uid}}</td>
|
|
||||||
<td>{{i.Uname}}</td>
|
|
||||||
</tr>
|
|
||||||
</tbody>
|
|
||||||
</table>
|
|
||||||
<!--可修改部分结束-->
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<script type="text/javascript">
|
|
||||||
var findPerson = new Vue({
|
|
||||||
el: "#findPerson",
|
|
||||||
data: {
|
|
||||||
//存储过程名称
|
|
||||||
ProcedureName: "example",
|
|
||||||
//报表名称
|
|
||||||
reportName: "报表1",
|
|
||||||
|
|
||||||
//除非你知道以下数据含义,否则不要修改
|
|
||||||
sqlStr: "",
|
|
||||||
url: myjs.urls.getresult,
|
|
||||||
result: [],
|
|
||||||
uid: "",
|
|
||||||
uName: "",
|
|
||||||
},
|
|
||||||
created() {
|
|
||||||
this.uid = myjs.getUId();
|
|
||||||
this.uName = myjs.getUName();
|
|
||||||
},
|
|
||||||
methods: {
|
|
||||||
find() {
|
|
||||||
var sql = myjs.createSql("#para");
|
|
||||||
this.sqlStr = sql;
|
|
||||||
console.log(sql);
|
|
||||||
myjs.post(this.url, { sql: sql }, function (d) {
|
|
||||||
findPerson.result = d;
|
|
||||||
});
|
|
||||||
},
|
|
||||||
print() {
|
|
||||||
var sql = myjs.createSql("#para");
|
|
||||||
this.sqlStr = sql;
|
|
||||||
myjs.print();
|
|
||||||
},
|
|
||||||
down() {
|
|
||||||
myjs.toExcel.tableToExcel("resultTable", this.reportName);
|
|
||||||
},
|
|
||||||
}
|
|
||||||
});
|
|
||||||
</script>
|
|
Loading…
Reference in New Issue
Block a user