hberp/hb_client/src/views/sam/contractdetail.vue

130 lines
3.8 KiB
Python

<template>
<div class="app-container">
<el-card style="margin-top: 2px">
<el-descriptions title="基本信息" direction="vertical" :column="8" border>
<el-descriptions-item label="合同名称"> {{contractdetail.name}}</el-descriptions-item>
<el-descriptions-item label="编号" > {{contractdetail.number}}</el-descriptions-item>
<el-descriptions-item label="金额" :span="2" > {{contractdetail.amount}}</el-descriptions-item>
<el-descriptions-item label="客户名称" v-if="contractdetail.customer"> {{contractdetail.customer_.name}} </el-descriptions-item>
</el-descriptions>
</el-card>
<el-card class="box-card">
<div slot="header" class="clearfix">
<span>关联订单</span>
</div>
<el-table
v-loading="listLoading"
:data="OrderList"
border
fit
stripe
highlight-current-row
>
<el-table-column type="index" width="50" />
<el-table-column label="订单编号" width="160" show-overflow-tooltip>
<template slot-scope="scope">{{ scope.row.number }}</template>
</el-table-column>
<el-table-column label="客户" width="200" show-overflow-tooltip>
<template slot-scope="scope">{{ scope.row.customer_.name }}</template>
</el-table-column>
<el-table-column label="产品名称" width="200" show-overflow-tooltip>
<template slot-scope="scope">{{ scope.row.product_.name }}</template>
</el-table-column>
<el-table-column label="产品型号" width="120" show-overflow-tooltip>
<template slot-scope="scope">{{ scope.row.product_.specification }}</template>
</el-table-column>
<el-table-column label="产品数量" >
<template slot-scope="scope">{{ scope.row.count }}</template>
</el-table-column>
<el-table-column label="交货日期" >
<template slot-scope="scope">{{ scope.row.delivery_date }}</template>
</el-table-column>
<el-table-column label="已交货数量" >
<template slot-scope="scope">{{ scope.row.delivered_count }}</template>
</el-table-column>
<el-table-column label="创建时间" width="160" >
<template slot-scope="scope">{{ scope.row.create_time }}</template>
</el-table-column>
<el-table-column
align="center"
label="操作"
width="220px"
>
<template slot-scope="scope">
<el-link
v-if="checkPermission(['warehouse_delete'])"
type="primary"
@click="handleDetail(scope)"
>详情</el-link
>
</template>
</el-table-column>
</el-table>
</el-card>
</div>
</template>
<script>
import {getContract,getOrderList} from "@/api/sam";
import checkPermission from "@/utils/permission";
import { genTree } from "@/utils";
import Pagination from "@/components/Pagination"; // secondary package based on el-pagination
export default {
components: { Pagination },
data() {
return {
contractdetail:"",
OrderList:"",
};
},
computed: {},
watch: {},
created() {
this.id = this.$route.params.id;
this.getdetail();
this.getList();
},
methods: {
checkPermission,
getList() {
getOrderList({contract:this.id,page:0}).then((response) => {
if (response.data) {
this.OrderList = response.data;
}
})
},
//详情
getdetail() {
getContract(this.id).then((response) => {
if (response.data) {
this.contractdetail = response.data;
}
})
},
//订单详情
handleDetail(scope){
this.$router.push({name: "orderdetail", params: { id: scope.row.id }, })
}
},
};
</script>