<template>
|
<div class="technical">
|
<div class="title">
|
<el-row>
|
<el-col :span="12">技术文件</el-col>
|
<el-col :span="12" style="text-align: right;">
|
<el-button icon="el-icon-plus">生成项目书</el-button>
|
</el-col>
|
</el-row>
|
</div>
|
<div class="search-header">
|
<el-form v-model="searchData" :inline="true">
|
<el-form-item label="订单号:">
|
<el-input v-model="searchData.id" ></el-input>
|
</el-form-item>
|
<el-form-item label="下单日期:">
|
<el-date-picker
|
v-model="searchData.date"
|
value-format="yyyy-MM-dd"
|
type="date"
|
placeholder="选择日期">
|
</el-date-picker>
|
</el-form-item>
|
<el-form-item label="产品名称:">
|
<el-input v-model="searchData.name" ></el-input>
|
</el-form-item>
|
<el-form-item label="编制状态:" >
|
<el-select v-model="searchData.type" size="small" placeholder="全部" style="width: 250px;">
|
<el-option label="待编制" :value="0"></el-option>
|
<el-option label="已编制" :value="1"></el-option>
|
</el-select>
|
</el-form-item>
|
<el-form-item>
|
<el-button plain @click="resetBtn" style="margin-left: 12px;">重 置</el-button>
|
<el-button @click="searchTechnical">查 询</el-button>
|
</el-form-item>
|
</el-form>
|
</div>
|
<div class="technical-table">
|
<div class="table-box">
|
<el-table
|
height="490"
|
border style="width: 100%"
|
:data="technicalTable"
|
>
|
<el-table-column
|
type="selection"
|
width="78">
|
</el-table-column>
|
<el-table-column
|
prop="order_number"
|
label="订单号">
|
</el-table-column>
|
<el-table-column
|
prop="saleman"
|
label="业务员">
|
</el-table-column>
|
<el-table-column
|
prop="proname"
|
label="客户名称">
|
</el-table-column>
|
<el-table-column
|
prop="name"
|
label="产品名称">
|
</el-table-column>
|
<el-table-column
|
prop="specifications"
|
label="规格型号">
|
</el-table-column>
|
<el-table-column
|
prop="unit"
|
label="单位">
|
</el-table-column>
|
<el-table-column
|
prop="number"
|
label="数量">
|
</el-table-column>
|
<el-table-column
|
prop="下单日期"
|
label="下单日期">
|
</el-table-column>
|
<el-table-column
|
prop="交货日期"
|
label="交货日期">
|
</el-table-column>
|
<el-table-column
|
label="状态"
|
width="85"
|
>
|
<template slot-scope="scope">
|
<span :style="{'color': scope.row.type==0 ? 'red':'green'}">
|
{{scope.row.type==0?'待编制':'已编制'}}
|
</span>
|
</template>
|
</el-table-column>
|
<el-table-column
|
label="操作"
|
width="194">
|
<template slot-scope="scope">
|
<!-- <el-button type="text" size="small" @click="showDetails(scope.row)">查看详情</el-button>
|
<el-button type="text" size="small">编辑附件</el-button> -->
|
<el-button v-if="scope.row.type===0" type="text" size="small" @click="authorizedstrength(scope.row)">编制</el-button>
|
</template>
|
</el-table-column>
|
</el-table>
|
</div>
|
|
|
<el-pagination
|
@size-change="handleSizeChange"
|
@current-change="handleCurrentChange"
|
:current-page="pageParams.pageSize"
|
:page-sizes="[10, 20, 50, 100]"
|
:page-size="pageParams.countSize"
|
layout="total, sizes, prev, pager, next, jumper"
|
:total="pageParams.total">
|
</el-pagination>
|
<!-- 查看详情模态框 -->
|
<el-dialog title="文件详情" class="detail-model" :visible.sync="showDetail" width="687px" @close="showDetail = false">
|
<el-form label-position="right" label-width="70px" :model="selectedRow">
|
<span class="formtitle">基本信息</span>
|
<el-row :gutter="31">
|
<el-col :span="12">
|
<el-form-item label="订单号">
|
<el-input :value="selectedRow.id" :readonly="true" style="height: 32px; width: 224px;" />
|
</el-form-item>
|
</el-col>
|
<el-col :span="12">
|
<el-form-item label="工程名称">
|
<el-input :value="selectedRow.proname" :readonly="true" style="height: 32px; width: 224px;"/>
|
</el-form-item>
|
</el-col>
|
</el-row>
|
<el-row :gutter="31">
|
<el-col :span="12">
|
<el-form-item label="产品编码">
|
<el-input :value="selectedRow.code" :readonly="true" style="height: 32px; width: 224px;" />
|
</el-form-item>
|
</el-col>
|
<el-col :span="12">
|
<el-form-item label="产品大类">
|
<el-input :value="selectedRow.type" :readonly="true" style="height: 32px; width: 224px;" />
|
</el-form-item>
|
</el-col>
|
</el-row>
|
<el-row :gutter="31">
|
<el-col :span="12">
|
<el-form-item label="规格型号">
|
<el-input :value="selectedRow.specifications" :readonly="true" style="height: 32px; width: 224px;" />
|
</el-form-item>
|
</el-col>
|
<el-col :span="12">
|
<el-form-item label="单位">
|
<el-input :value="selectedRow.unit" :readonly="true" style="height: 32px; width: 224px;" />
|
</el-form-item>
|
</el-col>
|
</el-row>
|
<el-row :gutter="31">
|
<el-col :span="12">
|
<el-form-item label="数量">
|
<el-input :value="selectedRow.number" :readonly="true" style="height: 32px; width: 224px;" />
|
</el-form-item>
|
</el-col>
|
<el-col :span="12">
|
<el-form-item label="下单人">
|
<el-input :value="selectedRow.custname" :readonly="true" style="height: 32px; width: 224px;" />
|
</el-form-item>
|
</el-col>
|
</el-row>
|
<el-row :gutter="31">
|
<el-col :span="12">
|
<el-form-item label="下单日期">
|
<el-input :value="selectedRow.createTime" :readonly="true" style="height: 32px; width: 224px;" />
|
</el-form-item>
|
</el-col>
|
<el-col :span="12">
|
<el-form-item label="交货日期">
|
<el-input :value="selectedRow.deliveryTime" :readonly="true" style="height: 32px; width: 224px;" />
|
</el-form-item>
|
</el-col>
|
</el-row>
|
<el-row :gutter="31">
|
<el-col :span="12">
|
<el-form-item label="状态">
|
<el-input :value="selectedRow.state==1?'待编制':'已编制'" :readonly="true" style="height: 32px; width: 224px;" />
|
</el-form-item>
|
</el-col>
|
</el-row>
|
<span class="formtitle">客户信息</span>
|
<el-row :gutter="31">
|
<el-col :span="12">
|
<el-form-item label="客户名称">
|
<el-input :value="selectedRow.proname" :readonly="true" style="height: 32px; width: 224px;" />
|
</el-form-item>
|
</el-col>
|
<el-col :span="12">
|
<el-form-item label="省份">
|
<el-input :value="selectedRow.province" :readonly="true" style="height: 32px; width: 224px;" />
|
</el-form-item>
|
</el-col>
|
</el-row>
|
<el-row :gutter="31">
|
<el-col :span="12">
|
<el-form-item label="事业部">
|
<el-input :value="selectedRow.department" :readonly="true" style="height: 32px; width: 224px;" />
|
</el-form-item>
|
</el-col>
|
<el-col :span="12">
|
<el-form-item label="业务员">
|
<el-input :value="selectedRow.salesman" :readonly="true" style="height: 32px; width: 224px;" />
|
</el-form-item>
|
</el-col>
|
</el-row>
|
<span class="formtitle">附件信息</span>
|
<el-row :gutter="31">
|
<el-col :span="12">
|
<span style="height: 32px; width: 224px; color:rgb(0, 78, 162);">xxx项目书.docx</span>
|
</el-col>
|
</el-row>
|
</el-form>
|
</el-dialog>
|
</div>
|
</div>
|
</template>
|
|
<script>
|
export default {
|
filters:{
|
|
},
|
data() {
|
return {
|
searchData:{
|
id:'',
|
date:'',
|
name:'',
|
condition:'',
|
},
|
compiledata:{},
|
technicalTable: [],
|
showDetail: false,
|
selectedRow: {},
|
pageParams:{
|
pageSize:1,
|
countSize:10,
|
total:0
|
}
|
}
|
},
|
created() {
|
this.getTechnicalTableData()
|
},
|
methods: {
|
authorizedstrength(row) {
|
this.compiledata = row
|
this.compile()
|
},
|
//编制
|
compile() {
|
console.log();
|
this.$axios.post(this.$api.url.compile,{
|
id:this.compiledata.id
|
}).then( res =>{
|
this.$message.success('编制完成')
|
this.getTechnicalTableData()
|
})
|
},
|
|
async showDetails(row){
|
this.showDetail = true
|
const res = await this.$axios.get(this.$api.url.selectOrderById,{params:{id:row.id}})
|
this.selectedRow = res.data
|
console.log(this.selectedRow)
|
},
|
|
|
async getTechnicalTableData() {
|
const res = await this.$axios.get(this.$api.url.selectAllOrder,{
|
params:{
|
pageSize:(this.pageParams.pageSize),
|
countSize:this.pageParams.countSize,...this.searchData,
|
orderCode:this.searchData.id,
|
time:this.searchData.date,
|
name:this.searchData.name,
|
type:this.searchData.type,
|
}
|
})
|
this.technicalTable = res.data.row
|
this.pageParams.total = res.data.total
|
},
|
|
|
// 头部条件查询-重置
|
resetBtn() {
|
this.searchData={}
|
this.getTechnicalTableData()
|
},
|
// 头部条件查询-查询
|
searchTechnical() {
|
this.getTechnicalTableData()
|
},
|
handleSizeChange(value){
|
this.pageParams.countSize = value
|
this.getTechnicalTableData()
|
},
|
handleCurrentChange(value){
|
this.pageParams.pageSize = value
|
this.getTechnicalTableData()
|
}
|
},
|
}
|
</script>
|
|
<style scoped>
|
.technical{
|
height: 100%;
|
width: 100%;
|
}
|
.el-form-item__label{
|
padding: 0 60px 0;
|
}
|
.technical .title .el-button {
|
height: 32px;
|
border: 1px solid rgba(190, 190, 190, 0.44);
|
box-shadow: 0px 2px 4px rgba(220, 220, 220, 0.41);
|
padding: 0 12px;
|
}
|
|
.technical .title {
|
margin-bottom: 10px;
|
padding: 0 20px;
|
}
|
|
/* 搜索头部样式 */
|
.search-header{
|
background: #fff;
|
padding: 24px 32px;
|
}
|
|
.search-header .el-form-item__label{
|
padding: 0 30px 0 0;
|
}
|
.search-header .el-form-item{
|
margin: 0px;
|
font-size: 20px;
|
}
|
.search-header .el-form-item:nth-child(1){
|
margin-right: 48px;
|
}
|
.search-header .el-form-item:nth-child(2){
|
margin-right: 24px;
|
}
|
/* 重置和查询两个按钮样式 */
|
.search-header .el-form-item .el-button{
|
width: 65px;
|
height: 32px;
|
box-sizing: border-box;
|
background: rgb(255, 255, 255);
|
border: 1px solid rgb(217, 217, 217);
|
border-radius:2px;
|
padding: 0;
|
font-size: 14px;
|
}
|
.search-header .el-form-item .el-button:nth-child(2){
|
/* Rectangle 77 */
|
background: rgb(0, 78, 162);
|
color: #fff;
|
}
|
/* 输入框的样式 */
|
.search-header .el-form-item .el-input >>>.el-input__inner{
|
width: 224px;
|
height: 32px ;
|
box-sizing: border-box;
|
background: rgb(255, 255, 255);
|
border: 1px solid rgb(217, 217, 217);
|
border-radius:2px;
|
}
|
|
|
/* 技术文件表格样式 */
|
.technical-table{
|
margin-top: 11px;
|
/* height: calc(100% - 140px); */
|
background: #fff;
|
padding: 23px 21px ;
|
font-size: 14px;
|
box-sizing: border-box;
|
display: flex;
|
flex-direction: column;
|
}
|
/* .technical-table .el-table{
|
overflow-y:scroll;
|
} */
|
.technical-table .table-box {
|
flex: 1;
|
overflow-y: scroll;
|
}
|
.technical-table .el-pagination{
|
margin-top: 23px;
|
display: flex;
|
justify-content: end;
|
}
|
.formtitle{
|
display: block;
|
margin-bottom: 24px;
|
font-size: 16px;
|
}
|
.detail-model >>>.el-form-item__label{
|
color: rgb(51, 51, 51);
|
}
|
.detail-model >>>.el-input__inner{
|
width: 224px;
|
height: 32px;
|
box-sizing: border-box;
|
background: rgb(238, 238, 238);
|
border: 1px solid rgb(221, 221, 221);
|
border-radius:4px;
|
}
|
</style>
|
|
<style>
|
.technical .title *{
|
font-size: 14px;
|
}
|
|
.technical .search-header *{
|
font-size: 14px;
|
}
|
</style>
|
