界面
This commit is contained in:
bryan sun
@@ -3,10 +3,8 @@
|
||||
<el-card>
|
||||
<div slot="header">
|
||||
<el-row>
|
||||
<span>合同编号:</span>
|
||||
<el-input v-model="contractNumber" placeholder="合同编号" size="small" clearable style="width:180px"/>
|
||||
<span>供应商:</span>
|
||||
<el-input v-model="supplierName" placeholder="供应商" size="small" clearable style="width:180px"/>
|
||||
<el-input v-model="supplierName" placeholder="供应商" size="small" clearable style="width:180px;margin: 0px 10px"/>
|
||||
<el-input v-model="contractNumber" placeholder="合同编号" size="small" clearable style="width:180px;margin: 0px 10px"/>
|
||||
<el-button
|
||||
type="success"
|
||||
size="small"
|
||||
@@ -15,92 +13,98 @@
|
||||
@click="total1=0;pageCurrent1=1;pageSize1=10;searchTable1()">查询</el-button>
|
||||
</el-row>
|
||||
</div>
|
||||
<el-table
|
||||
v-loading="loading1"
|
||||
id="expandTable"
|
||||
:data="tableData1"
|
||||
size="mini"
|
||||
border
|
||||
style="width: 100%"
|
||||
height="500px"
|
||||
highlight-current-row
|
||||
@row-click="searchTable2">
|
||||
<el-table-column label="供应商" align="center" min-width="220">
|
||||
<template slot-scope="scope">
|
||||
{{ scope.row.供应商名称 }}
|
||||
</template>
|
||||
</el-table-column>
|
||||
<!-- <el-table-column label="离线合同名称" align="center" min-width="150">-->
|
||||
<!-- <template slot-scope="scope">-->
|
||||
<!-- {{ scope.row.离线合同名称 }}-->
|
||||
<!-- </template>-->
|
||||
<!-- </el-table-column>-->
|
||||
<el-table-column label="离线合同编号" align="center" min-width="160">
|
||||
<template slot-scope="scope">
|
||||
{{ scope.row.离线合同编号 }}
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column label="采购员" align="center" min-width="60">
|
||||
<template slot-scope="scope">
|
||||
{{ scope.row.采购员 }}
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column label="总金额" align="center" min-width="60">
|
||||
<template slot-scope="scope">
|
||||
{{ scope.row.合同总额 }}
|
||||
</template>
|
||||
</el-table-column>
|
||||
</el-table>
|
||||
<div class="block" style="margin-top: 10px;">
|
||||
<el-pagination
|
||||
:current-page="pageCurrent1"
|
||||
:page-sizes="[10, 20, 30, 40]"
|
||||
:page-size="pageSize1"
|
||||
:total="total1"
|
||||
style="display:inline-block;width:50%"
|
||||
layout="total, sizes, prev, pager, next, jumper"
|
||||
@size-change="handleSizeChange1"
|
||||
@current-change="handleCurrentChange1"/>
|
||||
</div>
|
||||
</el-card>
|
||||
<div id="offlineContract" style="background-color:white;min-height:500px;margin: 0 auto;width: 800px;border:1px solid black">
|
||||
<table v-show="contractDetail.length > 0" class="offlineContract" cellspacing="0px" align="center" border="1 solid black" width="100%">
|
||||
<tr>
|
||||
<th colspan="14"><h1>离线合同</h1></th>
|
||||
</tr>
|
||||
<tr>
|
||||
<td colspan="3" rowspan="2" style="text-align:center;font-size: 30px;font-weight: bold">GAOJING</td>
|
||||
<td width="80px">合同名称</td>
|
||||
<td id="contractName" colspan="2" style="text-align: left;"/>
|
||||
<td width="80px">供应商</td>
|
||||
<td id="supplier" colspan="5" style="text-align: left;"/>
|
||||
<td id="qrCode" colspan="2" rowspan="2"/>
|
||||
</tr>
|
||||
<tr>
|
||||
<td width="80px">合同编号</td>
|
||||
<td id="contractNum" colspan="2" style="text-align: left;"/>
|
||||
<td width="80px">采购员</td>
|
||||
<td id="buyer" colspan="5" style="text-align: left;"/>
|
||||
</tr>
|
||||
<tr id="tablehead">
|
||||
<td width="50px">序号</td>
|
||||
<td colspan="2">名称</td>
|
||||
<td>规格</td>
|
||||
<td colspan="2">型号</td>
|
||||
<td>数量</td>
|
||||
<td colspan="2">单价</td>
|
||||
<td colspan="2">合计</td>
|
||||
<td>交货期</td>
|
||||
<td colspan="2">备注</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td>总计</td>
|
||||
<td id="remark" colspan="10"/>
|
||||
<td id="total" colspan="2" style="text-align: left;"/>
|
||||
<td/>
|
||||
</tr>
|
||||
</table>
|
||||
</div>
|
||||
<el-row>
|
||||
<el-card style="width: 40%; float: left">
|
||||
<el-table
|
||||
v-loading="loading1"
|
||||
id="expandTable"
|
||||
:data="tableData1"
|
||||
size="mini"
|
||||
border
|
||||
style="width: 100%"
|
||||
height="700px"
|
||||
highlight-current-row
|
||||
@row-click="searchTable2">
|
||||
<el-table-column label="供应商" align="center" min-width="200">
|
||||
<template slot-scope="scope">
|
||||
{{ scope.row.供应商名称 }}
|
||||
</template>
|
||||
</el-table-column>
|
||||
<!-- <el-table-column label="离线合同名称" align="center" min-width="150">-->
|
||||
<!-- <template slot-scope="scope">-->
|
||||
<!-- {{ scope.row.离线合同名称 }}-->
|
||||
<!-- </template>-->
|
||||
<!-- </el-table-column>-->
|
||||
<el-table-column label="离线合同编号" align="center" min-width="120">
|
||||
<template slot-scope="scope">
|
||||
{{ scope.row.离线合同编号 }}
|
||||
</template>
|
||||
</el-table-column>
|
||||
<!-- <el-table-column label="采购员" align="center" min-width="60">-->
|
||||
<!-- <template slot-scope="scope">-->
|
||||
<!-- {{ scope.row.采购员 }}-->
|
||||
<!-- </template>-->
|
||||
<!-- </el-table-column>-->
|
||||
<el-table-column label="总金额" align="center" min-width="75">
|
||||
<template slot-scope="scope">
|
||||
{{ Number(scope.row.合同总额).toFixed(2) }}
|
||||
</template>
|
||||
</el-table-column>
|
||||
</el-table>
|
||||
<div class="block" style="margin-top: 10px;">
|
||||
<el-pagination
|
||||
:current-page="pageCurrent1"
|
||||
:page-sizes="[10, 20, 30, 40]"
|
||||
:page-size="pageSize1"
|
||||
:total="total1"
|
||||
style="display:inline-block;width:50%"
|
||||
layout="total, sizes, prev, pager, next, jumper"
|
||||
@size-change="handleSizeChange1"
|
||||
@current-change="handleCurrentChange1"/>
|
||||
</div>
|
||||
</el-card>
|
||||
<el-card style="width: 58%">
|
||||
<!-- <div id="offlineContract" style="background-color:white;min-height:500px;margin: 0 auto;width: 800px;border:1px solid black">-->
|
||||
<table v-show="contractDetail.length > 0" class="offlineContract" cellspacing="0px" align="center" border="1 solid black" width="700px">
|
||||
<tr>
|
||||
<th colspan="14"><h1>离线合同</h1></th>
|
||||
</tr>
|
||||
<tr>
|
||||
<td colspan="3" rowspan="2" style="text-align:center;font-size: 30px;font-weight: bold">GAOJING</td>
|
||||
<td width="80px">合同名称</td>
|
||||
<td id="contractName" colspan="2" style="text-align: left;"/>
|
||||
<td width="80px">供应商</td>
|
||||
<td id="supplier" colspan="5" style="text-align: left;"/>
|
||||
<td id="qrCode" colspan="2" rowspan="2"/>
|
||||
</tr>
|
||||
<tr>
|
||||
<td width="80px">合同编号</td>
|
||||
<td id="contractNum" colspan="2" style="text-align: left;"/>
|
||||
<td width="80px">采购员</td>
|
||||
<td id="buyer" colspan="5" style="text-align: left;"/>
|
||||
</tr>
|
||||
<tr id="tablehead">
|
||||
<td width="50px">序号</td>
|
||||
<td colspan="2">名称</td>
|
||||
<td>规格</td>
|
||||
<td colspan="2">型号</td>
|
||||
<td>数量</td>
|
||||
<td colspan="2">单价</td>
|
||||
<td colspan="2">合计</td>
|
||||
<td>交货期</td>
|
||||
<td colspan="2">备注</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td>总计</td>
|
||||
<td id="remark" colspan="10"/>
|
||||
<td id="total" colspan="2" style="text-align: left;"/>
|
||||
<td/>
|
||||
</tr>
|
||||
</table>
|
||||
<!-- </div>-->
|
||||
</el-card>
|
||||
</el-row>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
@@ -164,7 +168,7 @@ export default {
|
||||
}
|
||||
const tr = []
|
||||
let length = 0
|
||||
this.contractDetail.length < 15 ? length = 15 : length = this.contractDetail.length
|
||||
length = this.contractDetail.length
|
||||
for (let i = 0; i < length; i++) {
|
||||
tr[i] = document.createElement('tr')
|
||||
tr[i].setAttribute('class', 'tableData')
|
||||
@@ -215,7 +219,7 @@ export default {
|
||||
|
||||
<style scoped>
|
||||
.el-card{
|
||||
margin-bottom: 15px;
|
||||
margin-bottom: 0px;
|
||||
}
|
||||
.el-date-editor{
|
||||
width:200px
|
||||
|
||||
Reference in New Issue
Block a user