|
|
@@ -0,0 +1,129 @@
|
|
|
+<template>
|
|
|
+ <div>
|
|
|
+ <el-table
|
|
|
+ ref="multipleTable"
|
|
|
+ :data="tableData"
|
|
|
+ height="500px"
|
|
|
+ style="width: 100%;"
|
|
|
+ :header-cell-style="{height:'50px',color:'#768093',fontWeight:'400'}"
|
|
|
+ :cell-style="{height:'50px',color:'#768093',fontWeight:'400'}">
|
|
|
+ <!-- <el-table-column
|
|
|
+ type="selection"
|
|
|
+ width="55"
|
|
|
+ align="center">
|
|
|
+ </el-table-column> -->
|
|
|
+ <el-table-column
|
|
|
+ prop="itemname"
|
|
|
+ label="产品名称"
|
|
|
+ width="180">
|
|
|
+ </el-table-column>
|
|
|
+ <el-table-column
|
|
|
+ prop="itemno"
|
|
|
+ label="产品编号"
|
|
|
+ width="180">
|
|
|
+ </el-table-column>
|
|
|
+ <el-table-column
|
|
|
+ label="型号/规格"
|
|
|
+ width="180">
|
|
|
+ <template slot-scope="scope">
|
|
|
+ <p><span>{{scope.row.model}}</span> / <span>{{scope.row.spec}}</span></p>
|
|
|
+ </template>
|
|
|
+ </el-table-column>
|
|
|
+ <el-table-column
|
|
|
+ label="数量"
|
|
|
+ width="150">
|
|
|
+ <template slot-scope="scope">
|
|
|
+ {{scope.row.qty}}
|
|
|
+ </template>
|
|
|
+ </el-table-column>
|
|
|
+ <el-table-column
|
|
|
+ prop="unit"
|
|
|
+ label="计量单位"
|
|
|
+ width="90">
|
|
|
+ <template slot-scope="scope">
|
|
|
+ <el-tag size="mini" type="info" effect="plain">{{scope.row.unitname}}</el-tag>
|
|
|
+ </template>
|
|
|
+ </el-table-column>
|
|
|
+ <el-table-column
|
|
|
+ prop="price"
|
|
|
+ label="价格"
|
|
|
+ width="90">
|
|
|
+ <template slot-scope="scope">
|
|
|
+ <p style="color:red;font-weight:500">¥ {{tool.formatAmount(scope.row.gradeprice,2)}}</p>
|
|
|
+ </template>
|
|
|
+ </el-table-column>
|
|
|
+ <el-table-column
|
|
|
+ label="小计"
|
|
|
+ width="150">
|
|
|
+ <template slot-scope="scope">
|
|
|
+ <p style="color:red;font-weight:500">¥ {{tool.formatAmount(scope.row.price * scope.row.qty,2)}}</p>
|
|
|
+ </template>
|
|
|
+ </el-table-column>
|
|
|
+ <el-table-column width="90">
|
|
|
+ <template slot-scope="scope">
|
|
|
+ <slot name="del" :data="scope.row"></slot>
|
|
|
+ </template>
|
|
|
+ </el-table-column>
|
|
|
+ </el-table>
|
|
|
+ <div style="margin-top:16px;text-align:right">
|
|
|
+ <el-pagination
|
|
|
+ background
|
|
|
+ small
|
|
|
+ @size-change="handleSizeChange"
|
|
|
+ @current-change="handleCurrentChange"
|
|
|
+ :current-page="currentPage"
|
|
|
+ :page-size="param.content.pageSize"
|
|
|
+ layout="total, prev, pager, next, jumper"
|
|
|
+ :total="total">
|
|
|
+ </el-pagination>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+</template>
|
|
|
+
|
|
|
+<script>
|
|
|
+export default {
|
|
|
+ data () {
|
|
|
+ return {
|
|
|
+ tableData:[],
|
|
|
+ param:{
|
|
|
+ "id": 20221109093902,
|
|
|
+ "content": {
|
|
|
+ "sa_orderid": 0, //订单ID
|
|
|
+ "pageNumber": 1,
|
|
|
+ "pageSize": 20,
|
|
|
+ "where": {
|
|
|
+ "condition": ""
|
|
|
+ }
|
|
|
+ },
|
|
|
+ },
|
|
|
+ total:0,
|
|
|
+ currentPage:0
|
|
|
+ }
|
|
|
+ },
|
|
|
+ methods:{
|
|
|
+ async listData () {
|
|
|
+ this.param.content.sa_orderid = this.$route.query.id
|
|
|
+ const res = await this.$api.requested(this.param)
|
|
|
+ this.tableData = res.data
|
|
|
+ this.total = res.total
|
|
|
+ this.currentPage = res.pageNumber
|
|
|
+ },
|
|
|
+ handleSizeChange(val) {
|
|
|
+ // console.log(`每页 ${val} 条`);
|
|
|
+ this.params.content.pageSize = val
|
|
|
+ this.listData()
|
|
|
+ },
|
|
|
+ handleCurrentChange(val) {
|
|
|
+ // console.log(`当前页: ${val}`);
|
|
|
+ this.params.content.pageNumber = val
|
|
|
+ this.listData()
|
|
|
+ },
|
|
|
+ },
|
|
|
+ mounted () {
|
|
|
+ this.listData()
|
|
|
+ }
|
|
|
+}
|
|
|
+
|
|
|
+</script>
|
|
|
+<style>
|
|
|
+</style>
|