添加营销系统模块

This commit is contained in:
hedekun
2018-11-08 08:39:42 +08:00
commit f7eb22e5bb
181 changed files with 35426 additions and 0 deletions

View File

@@ -0,0 +1,564 @@
<template>
<div class="app-container">
<el-card>
<el-row>
<span>项目名称:</span>
<el-select v-model="project" size="small" filterable clearable placeholder="项目名称" @change="getMachine">
<el-option
v-for="item in projects"
:key="item.value"
:label="item.label"
:value="item.value"/>
</el-select>
<span>机床号:</span>
<el-select v-model="Machine" size="small" clearable placeholder="机床号" @change="getGroup">
<el-option
v-for="item in Machines"
:key="item.value"
:label="item.label"
:value="item.value"/>
</el-select>
<span>组号:</span>
<el-select v-model="Group" size="small" clearable placeholder="组号">
<el-option
v-for="item in Groups"
:key="item.value"
:label="item.label"
:value="item.value"/>
</el-select>
</el-row>
<el-row>
<span>是否外协:</span>
<el-select v-model="part" size="small" placeholder="是否外协">
<el-option
v-for="item in parts"
:key="item.value"
:label="item.label"
:value="item.value"/>
</el-select>
<span>零件号:</span>
<el-input v-model="number" placeholder="零件号" clearable size="small" style="width: 200px;"/>
<el-button type="success" class="el-icon-search" size="small" style="margin: 10px 0 0 10px" @click="getTableData();pageCurrent=1;pageSize=10;total = 0">查询</el-button>
<span>进度颜色</span>
<el-radio v-model="radioList" label="0" style="background-color: white">全部</el-radio>
<el-radio v-model="radioList" label="1" style="background-color: red">拖期</el-radio>
<el-radio v-model="radioList" label="2" style="background-color: yellow">即将拖期</el-radio>
<el-radio v-model="radioList" label="3" style="background-color: lawngreen">如期</el-radio>
<el-radio v-model="radioList" label="4" style="background-color: deepskyblue">工序外协</el-radio>
</el-row>
</el-card>
<el-card>
<el-table
v-loading="listLoading1"
:data="tableData1"
class="table"
border
height="650">
<el-table-column
label="序号"
align="center"
width="50"
type="index"/>
<el-table-column
align="center"
label="零件图号"
width="200px">
<template slot-scope="scope">{{ 零件图号[scope.$index] }}</template>
</el-table-column>
<el-table-column
align="center"
label="零件名称"
width="120px">
<template slot-scope="scope"> {{ 零件名称[scope.$index] }}</template>
</el-table-column>
<el-table-column
align="center"
prop="address"
label="数量">
<template slot-scope="scope">{{ 投产数量[scope.$index] }}</template>
</el-table-column>
<el-table-column label="零件加工计划进度(工艺名称,计划完成时间,实际完成时间,员工名称)" >
<el-table-column label="[1]" align="center" width="120px">
<template slot-scope="scope">
<div :class="colorCode[scope.$index][0]">
<h4>{{ process[scope.$index][0] }}</h4><h4>{{ planDate[scope.$index][0] }} </h4><h4> {{ realDate[scope.$index][0] }}</h4><h4> {{ worker[scope.$index][0] }}</h4>
</div>
</template>
</el-table-column>
<el-table-column label="[2]" align="center" width="120px">
<template slot-scope="scope">
<div :class="colorCode[scope.$index][1]">
<h4>{{ process[scope.$index][1] }}</h4><h4>{{ planDate[scope.$index][1] }} </h4><h4> {{ realDate[scope.$index][1] }}</h4><h4> {{ worker[scope.$index][1] }}</h4>
</div>
</template>
</el-table-column>
<el-table-column label="[3]" align="center" width="120px">
<template slot-scope="scope">
<div :class="colorCode[scope.$index][2]">
<h4>{{ process[scope.$index][2] }}</h4><h4>{{ planDate[scope.$index][2] }} </h4><h4> {{ realDate[scope.$index][2] }}</h4><h4> {{ worker[scope.$index][2] }}</h4>
</div>
</template>
</el-table-column>
<el-table-column label="[4]" align="center" width="120px">
<template slot-scope="scope">
<div :class="colorCode[scope.$index][3]">
<h4>{{ process[scope.$index][3] }}</h4><h4>{{ planDate[scope.$index][3] }} </h4><h4> {{ realDate[scope.$index][3] }}</h4><h4> {{ worker[scope.$index][3] }}</h4>
</div>
</template>
</el-table-column>
<el-table-column label="[5]" align="center" width="120px">
<template slot-scope="scope">
<div :class="colorCode[scope.$index][4]">
<h4>{{ process[scope.$index][4] }}</h4><h4>{{ planDate[scope.$index][4] }} </h4><h4> {{ realDate[scope.$index][4] }}</h4><h4> {{ worker[scope.$index][4] }}</h4>
</div>
</template>
</el-table-column>
<el-table-column label="[6]" align="center" width="120px">
<template slot-scope="scope">
<div :class="colorCode[scope.$index][5]">
<h4>{{ process[scope.$index][5] }}</h4><h4>{{ planDate[scope.$index][5] }} </h4><h4> {{ realDate[scope.$index][5] }}</h4><h4> {{ worker[scope.$index][5] }}</h4>
</div>
</template>
</el-table-column>
<el-table-column label="[7]" align="center" width="120px">
<template slot-scope="scope">
<div :class="colorCode[scope.$index][6]">
<h4>{{ process[scope.$index][6] }}</h4><h4>{{ planDate[scope.$index][6] }} </h4><h4> {{ realDate[scope.$index][6] }}</h4><h4> {{ worker[scope.$index][6] }}</h4>
</div>
</template>
</el-table-column>
<el-table-column label="[8]" align="center" width="120px">
<template slot-scope="scope">
<div :class="colorCode[scope.$index][7]">
<h4>{{ process[scope.$index][7] }}</h4><h4>{{ planDate[scope.$index][7] }} </h4><h4> {{ realDate[scope.$index][7] }}</h4><h4> {{ worker[scope.$index][7] }}</h4>
</div>
</template>
</el-table-column>
<el-table-column label="[9]" align="center" width="120px">
<template slot-scope="scope">
<div :class="colorCode[scope.$index][8]">
<h4>{{ process[scope.$index][8] }}</h4><h4>{{ planDate[scope.$index][8] }} </h4><h4> {{ realDate[scope.$index][8] }}</h4><h4> {{ worker[scope.$index][8] }}</h4>
</div>
</template>
</el-table-column>
<el-table-column label="[10]" align="center" width="120px">
<template slot-scope="scope">
<div :class="colorCode[scope.$index][9]">
<h4>{{ process[scope.$index][9] }}</h4><h4>{{ planDate[scope.$index][9] }} </h4><h4> {{ realDate[scope.$index][9] }}</h4><h4> {{ worker[scope.$index][9] }}</h4>
</div>
</template>
</el-table-column>
<el-table-column label="[11]" align="center" width="120px">
<template slot-scope="scope">
<div :class="colorCode[scope.$index][10]">
<h4>{{ process[scope.$index][10] }}</h4><h4>{{ planDate[scope.$index][10] }} </h4><h4> {{ realDate[scope.$index][10] }}</h4><h4> {{ worker[scope.$index][10] }}</h4>
</div>
</template>
</el-table-column>
<el-table-column label="[12]" align="center" width="120px">
<template slot-scope="scope">
<div :class="colorCode[scope.$index][11]">
<h4>{{ process[scope.$index][11] }}</h4><h4>{{ planDate[scope.$index][11] }} </h4><h4> {{ realDate[scope.$index][11] }}</h4><h4> {{ worker[scope.$index][11] }}</h4>
</div>
</template>
</el-table-column>
<el-table-column label="[13]" align="center" width="120px">
<template slot-scope="scope">
<div :class="colorCode[scope.$index][12]">
<h4>{{ process[scope.$index][12] }}</h4><h4>{{ planDate[scope.$index][12] }} </h4><h4> {{ realDate[scope.$index][12] }}</h4><h4> {{ worker[scope.$index][12] }}</h4>
</div>
</template>
</el-table-column>
<el-table-column label="[14]" align="center" width="120px">
<template slot-scope="scope">
<div :class="colorCode[scope.$index][13]">
<h4>{{ process[scope.$index][13] }}</h4><h4>{{ planDate[scope.$index][13] }} </h4><h4> {{ realDate[scope.$index][13] }}</h4><h4> {{ worker[scope.$index][13] }}</h4>
</div>
</template>
</el-table-column>
<el-table-column label="[15]" align="center" width="120px">
<template slot-scope="scope">
<div :class="colorCode[scope.$index][14]">
<h4>{{ process[scope.$index][14] }}</h4><h4>{{ planDate[scope.$index][14] }} </h4><h4> {{ realDate[scope.$index][14] }}</h4><h4> {{ worker[scope.$index][14] }}</h4>
</div>
</template>
</el-table-column>
<el-table-column label="[16]" align="center" width="120px">
<template slot-scope="scope">
<div :class="colorCode[scope.$index][15]">
<h4>{{ process[scope.$index][15] }}</h4><h4>{{ planDate[scope.$index][15] }} </h4><h4> {{ realDate[scope.$index][15] }}</h4><h4> {{ worker[scope.$index][15] }}</h4>
</div>
</template>
</el-table-column>
<el-table-column label="[17]" align="center" width="120px">
<template slot-scope="scope">
<div :class="colorCode[scope.$index][16]">
<h4>{{ process[scope.$index][16] }}</h4><h4>{{ planDate[scope.$index][16] }} </h4><h4> {{ realDate[scope.$index][16] }}</h4><h4> {{ worker[scope.$index][16] }}</h4>
</div>
</template>
</el-table-column>
<el-table-column label="[18]" align="center" width="120px">
<template slot-scope="scope">
<div :class="colorCode[scope.$index][17]">
<h4>{{ process[scope.$index][17] }}</h4><h4>{{ planDate[scope.$index][17] }} </h4><h4> {{ realDate[scope.$index][17] }}</h4><h4> {{ worker[scope.$index][17] }}</h4>
</div>
</template>
</el-table-column>
<el-table-column label="[19]" align="center" width="120px">
<template slot-scope="scope">
<div :class="colorCode[scope.$index][18]">
<h4>{{ process[scope.$index][18] }}</h4><h4>{{ planDate[scope.$index][18] }} </h4><h4> {{ realDate[scope.$index][18] }}</h4><h4> {{ worker[scope.$index][18] }}</h4>
</div>
</template>
</el-table-column>
<el-table-column label="[20]" align="center" width="120px">
<template slot-scope="scope">
<div :class="colorCode[scope.$index][19]">
<h4>{{ process[scope.$index][19] }}</h4><h4>{{ planDate[scope.$index][19] }} </h4><h4> {{ realDate[scope.$index][19] }}</h4><h4> {{ worker[scope.$index][19] }}</h4>
</div>
</template>
</el-table-column>
<el-table-column label="[21]" align="center" width="120px">
<template slot-scope="scope">
<div :class="colorCode[scope.$index][20]">
<h4>{{ process[scope.$index][20] }}</h4><h4>{{ planDate[scope.$index][20] }} </h4><h4> {{ realDate[scope.$index][20] }}</h4><h4> {{ worker[scope.$index][20] }}</h4>
</div>
</template>
</el-table-column>
<el-table-column label="[22]" align="center" width="120px">
<template slot-scope="scope">
<div :class="colorCode[scope.$index][21]">
<h4>{{ process[scope.$index][21] }}</h4><h4>{{ planDate[scope.$index][21] }} </h4><h4> {{ realDate[scope.$index][21] }}</h4><h4> {{ worker[scope.$index][21] }}</h4>
</div>
</template>
</el-table-column>
<el-table-column label="[23]" align="center" width="120px">
<template slot-scope="scope">
<div :class="colorCode[scope.$index][22]">
<h4>{{ process[scope.$index][22] }}</h4><h4>{{ planDate[scope.$index][22] }} </h4><h4> {{ realDate[scope.$index][22] }}</h4><h4> {{ worker[scope.$index][22] }}</h4>
</div>
</template>
</el-table-column>
<el-table-column label="[24]" align="center" width="120px">
<template slot-scope="scope">
<div :class="colorCode[scope.$index][23]">
<h4>{{ process[scope.$index][23] }}</h4><h4>{{ planDate[scope.$index][23] }} </h4><h4> {{ realDate[scope.$index][23] }}</h4><h4> {{ worker[scope.$index][23] }}</h4>
</div>
</template>
</el-table-column>
<el-table-column label="[25]" align="center" width="120px">
<template slot-scope="scope">
<div :class="colorCode[scope.$index][24]">
<h4>{{ process[scope.$index][24] }}</h4><h4>{{ planDate[scope.$index][24] }} </h4><h4> {{ realDate[scope.$index][24] }}</h4><h4> {{ worker[scope.$index][24] }}</h4>
</div>
</template>
</el-table-column>
<el-table-column label="[26]" align="center" width="120px">
<template slot-scope="scope">
<div :class="colorCode[scope.$index][25]">
<h4>{{ process[scope.$index][25] }}</h4><h4>{{ planDate[scope.$index][25] }} </h4><h4> {{ realDate[scope.$index][25] }}</h4><h4> {{ worker[scope.$index][25] }}</h4>
</div>
</template>
</el-table-column>
<el-table-column label="[27]" align="center" width="120px">
<template slot-scope="scope">
<div :class="colorCode[scope.$index][26]">
<h4>{{ process[scope.$index][26] }}</h4><h4>{{ planDate[scope.$index][26] }} </h4><h4> {{ realDate[scope.$index][26] }}</h4><h4> {{ worker[scope.$index][26] }}</h4>
</div>
</template>
</el-table-column>
<el-table-column label="[28]" align="center" width="120px">
<template slot-scope="scope">
<div :class="colorCode[scope.$index][27]">
<h4>{{ process[scope.$index][27] }}</h4><h4>{{ planDate[scope.$index][27] }} </h4><h4> {{ realDate[scope.$index][27] }}</h4><h4> {{ worker[scope.$index][27] }}</h4>
</div>
</template>
</el-table-column>
<el-table-column label="[29]" align="center" width="120px">
<template slot-scope="scope">
<div :class="colorCode[scope.$index][28]">
<h4>{{ process[scope.$index][28] }}</h4><h4>{{ planDate[scope.$index][28] }} </h4><h4> {{ realDate[scope.$index][28] }}</h4><h4> {{ worker[scope.$index][28] }}</h4>
</div>
</template>
</el-table-column>
<el-table-column label="[30]" align="center" width="120px">
<template slot-scope="scope">
<div :class="colorCode[scope.$index][29]">
<h4>{{ process[scope.$index][29] }}</h4><h4>{{ planDate[scope.$index][29] }} </h4><h4> {{ realDate[scope.$index][29] }}</h4><h4> {{ worker[scope.$index][29] }}</h4>
</div>
</template>
</el-table-column>
</el-table-column>
</el-table>
<div class="block" style="margin-top: 10px;">
<el-pagination
:current-page="pageCurrent"
:page-sizes="[10, 20, 30, 40]"
:page-size="pageSize"
:total="total"
layout="total, sizes, prev, pager, next, jumper"
@size-change="handleSizeChange"
@current-change="handleCurrentChange"/>
</div>
</el-card>
</div>
</template>
<script>
import { getNames, getMachines, getGroups, getTable, getTable2 } from '@/api/ManufacturingCenter/ProcessingStatus'
export default {
data() {
return {
liushuihao: '',
// value2: null,
radioList: '0',
length: 0,
listLoading1: false,
tableData1: [],
project: '',
projects: [],
Machine: '',
Machines: [],
Group: '',
Groups: [],
part: '',
parts: [{
value: 0,
label: '全部零件'
}, {
value: 1,
label: '自家生产'
}, {
value: 2,
label: '外协生产'
}],
Speed: '',
Speeds: [{
value: 5,
label: '全部'
}, {
value: 1,
label: '拖期'
}, {
value: 2,
label: '即将拖期'
}, {
value: 3,
label: '如期'
}, {
value: 4,
label: '工序外协'
}],
number: '',
checkbox_project: false,
checkbox_Machine: false,
checkbox_Group: false,
checkbox_part: false,
checkbox_number: false,
零件图号: [],
零件名称: [],
投产数量: [],
result: [],
process: [[]],
planDate: [[]],
worker: [[]],
colorCode: [[]],
realDate: [[]],
// waixie: [[]],
total: 0, // 总条数
pageSize: 10,
pageCurrent: 1
}
},
created() {
this.fetchData()
},
methods: {
// 查询供应商名称
fetchData() {
this.projects = []
getNames().then(response => {
for (let i = 0; i < response.data.length; i++) {
this.projects.push({
label: response.data[i].项目名称,
value: response.data[i].项目流水号
})
}
})
this.part = 1
},
getMachine() {
this.Machine = ''
this.Machines = []
this.Group = ''
this.Groups = []
if (this.project !== '') {
getMachines(this.project).then(response => {
for (let i = 0; i < response.data.length; i++) {
this.Machines.push({
label: response.data[i].机床图号,
value: response.data[i].机床流水号
})
}
})
}
},
getGroup() {
this.Group = ''
this.Groups = []
getGroups(this.Machine).then(response => {
for (let i = 0; i < response.data.length; i++) {
this.Groups.push({
label: response.data[i].组号,
value: response.data[i].组件流水号
})
}
})
},
// 按条件查询
getTableData() {
this.listLoading1 = true
if (this.project === '') {
this.checkbox_project = false
} else {
this.checkbox_project = true
}
if (this.Machine === '') {
this.checkbox_Machine = false
} else {
this.checkbox_Machine = true
}
if (this.Group === '') {
this.checkbox_Group = false
} else {
this.checkbox_Group = true
}
if (this.part === '') {
this.checkbox_part = false
} else {
this.checkbox_part = true
}
if (this.number === '') {
this.checkbox_number = false
} else {
this.checkbox_number = true
}
this.tableData1 = []
this.零件图号 = []
this.零件名称 = []
this.投产数量 = []
this.result = []
this.process = [[]]
this.planDate = [[]]
this.worker = [[]]
this.colorCode = [[]]
this.realDate = [[]]
this.length = 0
getTable(this.checkbox_project, this.project, this.checkbox_Machine, this.Machine, this.checkbox_Group, this.Group, this.checkbox_number, this.number, this.part, this.pageCurrent, this.pageSize).then(response => {
this.length = parseInt(response.data.total)
for (let i = 0; i < response.data.rows.length; i++) { // 声明二维数组
this.零件图号.push(response.data.rows[i].零件图号)
this.零件名称.push(response.data.rows[i].零件名称)
this.投产数量.push(response.data.rows[i].投产数量)
this.process[i] = []
this.planDate[i] = []
this.worker[i] = []
this.colorCode[i] = []
this.realDate[i] = []
this.result.push(response.data.rows[i])
}
if (this.零件图号.length !== 0) {
for (let i = 0; i < this.零件图号.length; i++) {
getTable2(this.checkbox_project, this.project, this.checkbox_Machine, this.Machine, this.checkbox_Group, this.Group, this.零件图号[i], this.part).then(response => {
this.liushuihao = response.data[0].工艺计划流水号
for (let k = 0; k < response.data.length; k++) {
if (response.data[k].工艺计划流水号 === this.liushuihao) {
this.process[i][k] = response.data[k].工艺名称简称
this.planDate[i][k] = response.data[k].计划日期_短
this.worker[i][k] = response.data[k].员工姓名
this.realDate[i][k] = response.data[k].完成日期_短
if (response.data[k].工序状态 === 5) { // 灰色是已经完成 未入库
this.colorCode[i][k] = 'grey'
} else {
this.colorCode[i][k] = response.data[k].进度颜色
}
if (response.data[k].工序间是否外协 === 2) {
this.colorCode[i][k] = 'lightblue'
}
}
}
}).then(() => {
this.tableData1.push(this.result[i])
this.listLoading1 = false
this.total = this.length
})
}
} else {
this.tableData1 = []
this.listLoading1 = false
this.total = 0
}
})
},
handleSizeChange(val) {
this.pageSize = val
this.getTableData()
},
handleCurrentChange(val) {
this.pageCurrent = val
this.getTableData()
}
}
}
</script>
<style>
.white{
background-color: ghostwhite;
border: 1px solid #1f2d3d;
}
.grey{
background-color: grey;
border: 1px solid #1f2d3d;
}
.red{
background-color: orangered;
border: 1px solid #1f2d3d;
}
.lightblue{
background-color: deepskyblue;
border: 1px solid #1f2d3d;
}
.yellow{
background-color: yellow;
border: 1px solid #1f2d3d;
}
.blank{
background-color: transparent;
border: 0px solid white;
}
.lightgreen{
background-color: lightgreen;
border: 1px solid #1f2d3d;
}
</style>
<style scoped>
.el-form-item{
margin-bottom: 22px;
}
.el-card{
margin-bottom: 15px;
}
span{
margin: 10px 0 10px 10px;
}
.table h4{
border: 1px solid transparent;
margin: 0;
font-weight: normal;
width: 100px;
height: 24px;
}
</style>