打印样式优化
This commit is contained in:
parent
e91e1a7186
commit
f024626e9d
|
|
@ -37,7 +37,7 @@
|
|||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<el-table :data="tableData" border style="width: 100%; padding: 1px 0">
|
||||
<!-- <el-table :data="tableData" border style="width: 100%; padding: 1px 0">
|
||||
<el-table-column label="编号" align="center" type="index" width="60px" />
|
||||
<el-table-column
|
||||
label="物资类型"
|
||||
|
|
@ -68,7 +68,41 @@
|
|||
</span>
|
||||
</template>
|
||||
</el-table-column>
|
||||
</el-table>
|
||||
</el-table> -->
|
||||
<table border="1" style="width: 100%; border-collapse: collapse; padding: 1px 0">
|
||||
<thead>
|
||||
<tr align="center">
|
||||
<th style="width: 60px">编号</th>
|
||||
<th>物资类型</th>
|
||||
<th>物资名称</th>
|
||||
<th>规格型号</th>
|
||||
<th>计量单位</th>
|
||||
<th>退料数量</th>
|
||||
<th>编号</th>
|
||||
</tr>
|
||||
</thead>
|
||||
<tbody>
|
||||
<tr v-for="(row, index) in tableData" :key="index" align="center">
|
||||
<td>{{ index + 1 }}</td>
|
||||
<td :title="row.materialType">{{ row.materialType }}</td>
|
||||
<td :title="row.materialType">{{ row.materialType }}</td>
|
||||
<td :title="row.typeName">{{ row.typeName }}</td>
|
||||
<td :title="row.unitName">{{ row.unitName }}</td>
|
||||
<td>{{ row.preNum }}</td>
|
||||
<td>
|
||||
<span v-if="row.manageType == 1">无编码</span>
|
||||
<span
|
||||
v-if="row.manageType == 0"
|
||||
style="color: rgb(2, 167, 240); cursor: pointer"
|
||||
@click="checkDetail(row)"
|
||||
>
|
||||
查看明细
|
||||
</span>
|
||||
</td>
|
||||
</tr>
|
||||
</tbody>
|
||||
</table>
|
||||
|
||||
<div class="order_footer">
|
||||
<!-- <div>审核人:</div> -->
|
||||
<div class="item" style="width: 28%; display: flex; align-items: center; flex-wrap: wrap">
|
||||
|
|
@ -128,13 +162,34 @@
|
|||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<el-table :data="tableSubData" border style="width: 100%; padding: 1px 0">
|
||||
<!-- <el-table :data="tableSubData" border style="width: 100%; padding: 1px 0">
|
||||
<el-table-column label="序号" align="center" type="index" width="60px" />
|
||||
<el-table-column prop="materialType" label="物资类型" align="center"></el-table-column>
|
||||
<el-table-column prop="materialName" label="物资名称" align="center"></el-table-column>
|
||||
<el-table-column prop="typeName" label="规格型号" align="center"></el-table-column>
|
||||
<el-table-column prop="maCode" label="设备编号" align="center"></el-table-column>
|
||||
</el-table>
|
||||
</el-table> -->
|
||||
<table border="1" style="width: 100%; border-collapse: collapse; padding: 1px 0">
|
||||
<thead>
|
||||
<tr align="center">
|
||||
<th style="width: 60px">序号</th>
|
||||
<th>物资类型</th>
|
||||
<th>物资名称</th>
|
||||
<th>规格型号</th>
|
||||
<th>设备编号</th>
|
||||
</tr>
|
||||
</thead>
|
||||
<tbody>
|
||||
<tr v-for="(row, index) in tableSubData" :key="index" align="center">
|
||||
<td>{{ index + 1 }}</td>
|
||||
<td>{{ row.materialType }}</td>
|
||||
<td>{{ row.materialName }}</td>
|
||||
<td>{{ row.typeName }}</td>
|
||||
<td>{{ row.maCode }}</td>
|
||||
</tr>
|
||||
</tbody>
|
||||
</table>
|
||||
|
||||
<div class="order_footer">
|
||||
<div class="item" style="width: 28%; display: flex; align-items: center; flex-wrap: wrap">
|
||||
<div style="width: 35%">审核人:</div>
|
||||
|
|
|
|||
|
|
@ -137,7 +137,7 @@
|
|||
{{ checkDataInfo.leaseUnit }}
|
||||
</div>
|
||||
</div>
|
||||
<el-table :data="printTableData" class="table" style="margin-top: 20px; width: 100%" border>
|
||||
<!-- <el-table :data="printTableData" class="table" style="margin-top: 20px; width: 100%" border>
|
||||
<el-table-column label="机具名称" align="center" prop="typeName" />
|
||||
<el-table-column label="规格型号" align="center" prop="typeModelName" />
|
||||
<el-table-column label="单位" align="center" prop="unit" width="40px" />
|
||||
|
|
@ -150,7 +150,42 @@
|
|||
<el-table-column label="下次试验日期" align="center" prop="nextTestTime" width="120px" />
|
||||
<el-table-column label="检验结论" align="center" prop="checkResult" />
|
||||
<el-table-column label="备注" align="center" prop="remark" />
|
||||
</el-table>
|
||||
</el-table> -->
|
||||
|
||||
<table border="1" style="width: 100%; margin-top: 20px">
|
||||
<thead>
|
||||
<tr align="center">
|
||||
<th>机具名称</th>
|
||||
<th>规格型号</th>
|
||||
<th width="40px">单位</th>
|
||||
<th width="40px">数量</th>
|
||||
<th>设备编码</th>
|
||||
<th width="80px">额定载荷KN</th>
|
||||
<th width="80px">试验载荷KN</th>
|
||||
<th width="80px">持荷时间min</th>
|
||||
<th width="120px">试验日期</th>
|
||||
<th width="120px">下次试验日期</th>
|
||||
<th>检验结论</th>
|
||||
<th>备注</th>
|
||||
</tr>
|
||||
</thead>
|
||||
<tbody>
|
||||
<tr v-for="(row, index) in printTableData" :key="index" align="center">
|
||||
<td :title="row.typeName">{{ row.typeName }}</td>
|
||||
<td :title="row.typeModelName">{{ row.typeModelName }}</td>
|
||||
<td>{{ row.unit }}</td>
|
||||
<td>{{ row.num }}</td>
|
||||
<td :title="row.maCode">{{ row.maCode }}</td>
|
||||
<td>{{ row.ratedLoad }}</td>
|
||||
<td>{{ row.testLoad }}</td>
|
||||
<td>{{ row.holdingTime }}</td>
|
||||
<td>{{ row.testTime }}</td>
|
||||
<td>{{ row.nextTestTime }}</td>
|
||||
<td>{{ row.checkResult }}</td>
|
||||
<td :title="row.remark">{{ row.remark }}</td>
|
||||
</tr>
|
||||
</tbody>
|
||||
</table>
|
||||
|
||||
<div class="fillIn" style="margin-top: 20px; display: flex; align-items: center; justify-content: right">
|
||||
<div class="item" style="width: 30%; align-items: center; position: relative">
|
||||
|
|
@ -181,7 +216,7 @@
|
|||
<!-- 领料单弹窗 -->
|
||||
<el-dialog :visible.sync="open" width="800px" :title="title" append-to-body>
|
||||
<div style="height: 500px; overflow-y: scroll; padding: 0 20px">
|
||||
<!-- <vue-easy-print tableShow ref="remarksPrintRef" > -->
|
||||
<vue-easy-print tableShow ref="remarksPrintRef">
|
||||
<div id="checkIdTwo">
|
||||
<div class="title" style="text-align: center; font-weight: 600; font-size: 16px">领料单</div>
|
||||
<div class="info" style="margin-top: 10px; display: flex; flex-wrap: wrap">
|
||||
|
|
@ -204,7 +239,7 @@
|
|||
</div>
|
||||
</div>
|
||||
|
||||
<el-table :data="leaseApplyDetails" class="table" border style="width: 100%">
|
||||
<!-- <el-table :data="leaseApplyDetails" class="table" border style="width: 100%">
|
||||
<el-table-column label="序号" align="center" type="index" width="60px" />
|
||||
<el-table-column label="类型名称" align="center" prop="maTypeName" />
|
||||
<el-table-column label="规格型号" align="center" prop="typeName" />
|
||||
|
|
@ -217,7 +252,36 @@
|
|||
<span v-if="scope.row.manageType == 1">数量出库</span>
|
||||
</template>
|
||||
</el-table-column>
|
||||
</el-table>
|
||||
</el-table> -->
|
||||
<table border="1" style="width: 100%; border-collapse: collapse">
|
||||
<thead>
|
||||
<tr align="center">
|
||||
<th style="width: 60px">序号</th>
|
||||
<th>类型名称</th>
|
||||
<th>规格型号</th>
|
||||
<th>计量单位</th>
|
||||
<th>预领数量</th>
|
||||
<th>备注</th>
|
||||
<th>出库方式</th>
|
||||
</tr>
|
||||
</thead>
|
||||
<tbody>
|
||||
<tr v-for="(row, index) in leaseApplyDetails" :key="index" align="center">
|
||||
<td>{{ index + 1 }}</td>
|
||||
<td>{{ row.maTypeName }}</td>
|
||||
<td>{{ row.typeName }}</td>
|
||||
<td>{{ row.unitName }}</td>
|
||||
<td>{{ row.preNum }}</td>
|
||||
<td>{{ row.remark }}</td>
|
||||
<td>
|
||||
<span v-if="row.manageType == 0" style="color: blue; cursor: pointer" @click="codeInfo(row)">
|
||||
编码出库
|
||||
</span>
|
||||
<span v-else-if="row.manageType == 1">数量出库</span>
|
||||
</td>
|
||||
</tr>
|
||||
</tbody>
|
||||
</table>
|
||||
|
||||
<div class="fillIn" style="margin-top: 30px; display: flex; justify-content: space-between">
|
||||
<div class="item" style="width: 24%; display: flex; align-items: center; flex-wrap: wrap">
|
||||
|
|
@ -237,7 +301,7 @@
|
|||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<!-- </vue-easy-print> -->
|
||||
</vue-easy-print>
|
||||
</div>
|
||||
<div slot="footer" class="dialog-footer" style="text-align: center">
|
||||
<el-button type="primary" @click="print">打 印</el-button>
|
||||
|
|
@ -252,12 +316,30 @@
|
|||
<div class="title" style="text-align: center; font-weight: 600; font-size: 16px; margin-bottom: 20px">
|
||||
领料单编号明细
|
||||
</div>
|
||||
<el-table :data="getListViewInfo" style="padding: 1px">
|
||||
<!-- <el-table :data="getListViewInfo" style="padding: 1px">
|
||||
<el-table-column align="center" label="序号" type="index" width="55" />
|
||||
<el-table-column label="类型名称" align="center" prop="materialName" :show-overflow-tooltip="true" />
|
||||
<el-table-column label="规格型号" align="center" prop="typeName" :show-overflow-tooltip="true" />
|
||||
<el-table-column label="设备编码" align="center" prop="maCode" :show-overflow-tooltip="true" />
|
||||
</el-table>
|
||||
</el-table> -->
|
||||
<table border="1" style="width: 100%; border-collapse: collapse">
|
||||
<thead>
|
||||
<tr align="center">
|
||||
<th>序号</th>
|
||||
<th>类型名称</th>
|
||||
<th>规格型号</th>
|
||||
<th>设备编码</th>
|
||||
</tr>
|
||||
</thead>
|
||||
<tbody>
|
||||
<tr v-for="(row, index) in getListViewInfo" :key="index" align="center">
|
||||
<td>{{ index + 1 }}</td>
|
||||
<td :title="row.materialName">{{ row.materialName }}</td>
|
||||
<td :title="row.typeName">{{ row.typeName }}</td>
|
||||
<td :title="row.maCode">{{ row.maCode }}</td>
|
||||
</tr>
|
||||
</tbody>
|
||||
</table>
|
||||
</vue-easy-print>
|
||||
</div>
|
||||
<div slot="footer" class="dialog-footer" style="text-align: center">
|
||||
|
|
@ -377,6 +459,8 @@ export default {
|
|||
//打开领料单
|
||||
async handleLld(row) {
|
||||
this.title = '领料单'
|
||||
this.leaseApplyDetails = []
|
||||
this.leaseApplyData = {}
|
||||
this.open = true
|
||||
var ids = row.id
|
||||
const res = await getApplyInfo(ids)
|
||||
|
|
@ -386,13 +470,13 @@ export default {
|
|||
|
||||
//出库检验单打印
|
||||
printCheck() {
|
||||
printJS({
|
||||
printable: 'checkId',
|
||||
type: 'html',
|
||||
targetStyles: ['*'],
|
||||
maxWidth: '1400'
|
||||
// 其他配置选项
|
||||
})
|
||||
// printJS({
|
||||
// printable: 'checkId',
|
||||
// type: 'html',
|
||||
// targetStyles: ['*'],
|
||||
// maxWidth: '1400'
|
||||
// // 其他配置选项
|
||||
// })
|
||||
},
|
||||
|
||||
// 关闭弹窗并刷新页面
|
||||
|
|
@ -413,14 +497,14 @@ export default {
|
|||
|
||||
//打印
|
||||
print() {
|
||||
// this.$refs.remarksPrintRef.print();
|
||||
printJS({
|
||||
printable: 'checkIdTwo',
|
||||
type: 'html',
|
||||
targetStyles: ['*'],
|
||||
maxWidth: '1400'
|
||||
// 其他配置选项
|
||||
})
|
||||
this.$refs.remarksPrintRef.print()
|
||||
// printJS({
|
||||
// printable: 'checkIdTwo',
|
||||
// type: 'html',
|
||||
// targetStyles: ['*'],
|
||||
// maxWidth: '1400'
|
||||
// // 其他配置选项
|
||||
// })
|
||||
},
|
||||
|
||||
/** 删除按钮操作 */
|
||||
|
|
|
|||
|
|
@ -173,7 +173,7 @@
|
|||
<!-- 领料单弹窗 -->
|
||||
<el-dialog :visible.sync="open" width="800px" :title="title" append-to-body>
|
||||
<div style="height: 500px; overflow-y: scroll; padding: 0 20px">
|
||||
<!-- <vue-easy-print tableShow ref="remarksPrintRef" > -->
|
||||
<vue-easy-print tableShow ref="remarksPrintRef">
|
||||
<div id="checkIdTwo">
|
||||
<div class="title" style="text-align: center; font-weight: 600; font-size: 16px">领料单</div>
|
||||
<div class="info" style="margin-top: 10px; display: flex; flex-wrap: wrap">
|
||||
|
|
@ -195,7 +195,7 @@
|
|||
</div>
|
||||
</div>
|
||||
|
||||
<el-table :data="leaseApplyDetails" class="table" border style="width: 100%">
|
||||
<!-- <el-table :data="leaseApplyDetails" class="table" border style="width: 100%">
|
||||
<el-table-column label="序号" align="center" type="index" width="60px" />
|
||||
<el-table-column label="类型名称" align="center" prop="maTypeName" />
|
||||
<el-table-column label="规格型号" align="center" prop="typeName" />
|
||||
|
|
@ -208,7 +208,36 @@
|
|||
<span v-if="scope.row.manageType == 1">数量出库</span>
|
||||
</template>
|
||||
</el-table-column>
|
||||
</el-table>
|
||||
</el-table> -->
|
||||
<table border="1" style="width: 100%; border-collapse: collapse">
|
||||
<thead>
|
||||
<tr align="center">
|
||||
<th style="width: 60px">序号</th>
|
||||
<th>类型名称</th>
|
||||
<th>规格型号</th>
|
||||
<th>计量单位</th>
|
||||
<th>预领数量</th>
|
||||
<th>备注</th>
|
||||
<th>出库方式</th>
|
||||
</tr>
|
||||
</thead>
|
||||
<tbody>
|
||||
<tr v-for="(row, index) in leaseApplyDetails" :key="index" align="center">
|
||||
<td>{{ index + 1 }}</td>
|
||||
<td>{{ row.maTypeName }}</td>
|
||||
<td>{{ row.typeName }}</td>
|
||||
<td>{{ row.unitName }}</td>
|
||||
<td>{{ row.preNum }}</td>
|
||||
<td>{{ row.remark }}</td>
|
||||
<td>
|
||||
<span v-if="row.manageType == 0" style="color: blue; cursor: pointer" @click="codeInfo(row)">
|
||||
编码出库
|
||||
</span>
|
||||
<span v-else-if="row.manageType == 1">数量出库</span>
|
||||
</td>
|
||||
</tr>
|
||||
</tbody>
|
||||
</table>
|
||||
|
||||
<div class="fillIn" style="margin-top: 30px; display: flex; justify-content: space-between">
|
||||
<div class="item" style="width: 24%; display: flex; align-items: center; flex-wrap: wrap">
|
||||
|
|
@ -228,7 +257,7 @@
|
|||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<!-- </vue-easy-print> -->
|
||||
</vue-easy-print>
|
||||
</div>
|
||||
<div slot="footer" class="dialog-footer" style="text-align: center">
|
||||
<el-button type="primary" @click="print">打 印</el-button>
|
||||
|
|
@ -243,12 +272,30 @@
|
|||
<div class="title" style="text-align: center; font-weight: 600; font-size: 16px; margin-bottom: 20px">
|
||||
领料单编号明细
|
||||
</div>
|
||||
<el-table :data="getListViewInfo" style="padding: 1px">
|
||||
<!-- <el-table :data="getListViewInfo" style="padding: 1px">
|
||||
<el-table-column align="center" label="序号" type="index" width="55" />
|
||||
<el-table-column label="类型名称" align="center" prop="materialName" :show-overflow-tooltip="true" />
|
||||
<el-table-column label="规格型号" align="center" prop="materialModel" :show-overflow-tooltip="true" />
|
||||
<el-table-column label="设备编码" align="center" prop="maCode" :show-overflow-tooltip="true" />
|
||||
</el-table>
|
||||
</el-table> -->
|
||||
<table border="1" style="width: 100%; border-collapse: collapse">
|
||||
<thead>
|
||||
<tr align="center">
|
||||
<th>序号</th>
|
||||
<th>类型名称</th>
|
||||
<th>规格型号</th>
|
||||
<th>设备编码</th>
|
||||
</tr>
|
||||
</thead>
|
||||
<tbody>
|
||||
<tr v-for="(row, index) in getListViewInfo" :key="index" align="center">
|
||||
<td>{{ index + 1 }}</td>
|
||||
<td :title="row.materialName">{{ row.materialName }}</td>
|
||||
<td :title="row.typeName">{{ row.typeName }}</td>
|
||||
<td :title="row.maCode">{{ row.maCode }}</td>
|
||||
</tr>
|
||||
</tbody>
|
||||
</table>
|
||||
</vue-easy-print>
|
||||
</div>
|
||||
<div slot="footer" class="dialog-footer" style="text-align: center">
|
||||
|
|
@ -405,14 +452,14 @@ export default {
|
|||
|
||||
//打印
|
||||
print() {
|
||||
// this.$refs.remarksPrintRef.print();
|
||||
printJS({
|
||||
printable: 'checkIdTwo',
|
||||
type: 'html',
|
||||
targetStyles: ['*'],
|
||||
maxWidth: '1400'
|
||||
// 其他配置选项
|
||||
})
|
||||
this.$refs.remarksPrintRef.print()
|
||||
// printJS({
|
||||
// printable: 'checkIdTwo',
|
||||
// type: 'html',
|
||||
// targetStyles: ['*'],
|
||||
// maxWidth: '1400'
|
||||
// // 其他配置选项
|
||||
// })
|
||||
},
|
||||
|
||||
/** 删除按钮操作 */
|
||||
|
|
@ -444,7 +491,11 @@ export default {
|
|||
pageNum: this.queryParams.pageNum,
|
||||
statusList: this.queryParams.taskStatus ? [this.queryParams.taskStatus] : [1, 2, 3, 4]
|
||||
}
|
||||
this.download('/material/material_lease_apply_info/export', { ...params }, `领料申请_${new Date().getTime()}.xlsx`)
|
||||
this.download(
|
||||
'/material/material_lease_apply_info/export',
|
||||
{ ...params },
|
||||
`领料申请_${new Date().getTime()}.xlsx`
|
||||
)
|
||||
}
|
||||
},
|
||||
|
||||
|
|
|
|||
Loading…
Reference in New Issue