meswork/JY1.0
6
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

家里的样式

Browse Source
This commit is contained in:
zhangdingyu
2019-09-18 09:34:02 +08:00
commit 02d1678fff
681 changed files with 133918 additions and 0 deletions
Download Patch File Download Diff File Expand all files Collapse all files

494
src/views/TechnologyCenter/QueryParts/index.vue Normal file
View File

@@ -0,0 +1,494 @@
<template>
<div class="app-container">
<el-card>
<span>项目名称</span>
<el-select v-model="projectValue" placeholder="请选择项目名称" filterable size="small">
<el-option
v-for="item in project"
:key="item.value"
:label="item.label"
:value="item.value"/>
</el-select>
<span>机床图号</span>
<el-select v-model="machineValue" placeholder="请选择机床图号" filterable size="small">
<el-option
v-for="item in machine"
:key="item.value"
:label="item.label"
:value="item.value"/>
</el-select>
<span>组号</span>
<el-select v-model="groupValue" placeholder="请选择组号" filterable size="small">
<el-option
v-for="item in group"
:key="item.value"
:label="item.label"
:value="item.value"/>
</el-select>
<el-button icon="el-icon-search" type="success" size="small" @click="pageCurrentWB = 1;pageSizeWB = 10;pageCurrent = 1;pageSize = 10;getTableData()">查询</el-button>
</el-card>
<el-card>
<div v-for="(file, key) in hadFile" :key="key">
<div class="wrapper">
<div class="content">
<div class="action"/>
<div v-if="file.suffix==='pdf'" class="icon"><svg-icon icon-class="pdf" /></div>
<div v-else-if="file.suffix==='docx'||file.suffix === 'doc'" class="icon"><svg-icon icon-class="doc" /></div>
<div v-else-if="file.suffix==='xlsx' || file.suffix === 'xls'" class="icon"><svg-icon icon-class="excel" /></div>
<div v-else-if="file.suffix==='pptx' || file.suffix === 'ppt'" class="icon"><svg-icon icon-class="ppt" /></div>
<div v-else-if="file.suffix==='jpg' || file.suffix === 'jpeg'|| file.suffix === 'png'" class="icon"><svg-icon icon-class="pic" /></div>
<div v-else class="icon"><svg-icon icon-class="file" /></div>
<a :href="file.url" target="view_window"><div class="info">{{ file.name }}</div></a>
</div>
</div>
</div>
</el-card>
<el-card>
<el-table
v-loading="loading"
:data="tableData"
highlight-current-row
border
size="mini"
style="width: 100%;max-height: 520px"
height="520">
<el-table-column
label="序号"
align="center"
type="index"
width="50"/>
<el-table-column
label="机床图号"
align="center"
min-width="150px">
<template slot-scope="scope">{{ scope.row.机床图号 }}</template>
</el-table-column>
<el-table-column
label="零件图号"
align="center"
min-width="200px">
<template slot-scope="scope">{{ scope.row.零件图号 }}</template>
</el-table-column>
<el-table-column
label="零件名称"
align="center"
min-width="100px">
<template slot-scope="scope">{{ scope.row.零件名称 }}</template>
</el-table-column>
<el-table-column
label="组号"
align="center"
min-width="100px">
<template slot-scope="scope">{{ scope.row.组号 }}</template>
</el-table-column>
<el-table-column
label="零件数量"
align="center">
<template slot-scope="scope">{{ scope.row.零件数量 }}</template>
</el-table-column>
<el-table-column label="部件数量" align="center">
<template slot-scope="scope">
{{ scope.row.部件数量 }}
</template>
</el-table-column>
<el-table-column label="机床数量" align="center">
<template slot-scope="scope">
{{ scope.row.机床数量 }}
</template>
</el-table-column>
<el-table-column
label="材料"
align="center">
<template slot-scope="scope">{{ scope.row.材料 }}</template>
</el-table-column>
<el-table-column
label="规格"
align="center">
<template slot-scope="scope">{{ scope.row.规格 }}</template>
</el-table-column>
<el-table-column
label="备注"
align="center">
<template slot-scope="scope">{{ scope.row.零件备注 }}</template>
</el-table-column>
<el-table-column
label="零件类型"
align="center">
<template slot-scope="scope">{{ scope.row.零件类型名称 }}</template>
</el-table-column>
<el-table-column align="center" label="分类码" width="150">
<template slot-scope="scope">
{{ scope.row.分类码 }}
</template>
</el-table-column>
<el-table-column align="center" label="旧零件图号" width="150">
<template slot-scope="scope">
{{ scope.row.前零件图号 }}
</template>
</el-table-column>
<el-table-column align="center" label="整改类型" width="150">
<template slot-scope="scope">
{{ scope.row.整改类型 }}
</template>
</el-table-column>
<el-table-column label="操作" fixed="right" align="center" width="100">
<template slot-scope="scope">
<el-button
:disabled="Number(id)!==0"
size="mini"
type="danger"
icon="el-icon-delete"
@click="handleDelete(scope.row)">删除</el-button>
</template>
</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="handleSizeChanges"
@current-change="handleCurrentChanges"/>
</div>
</el-card>
<el-card>
<el-table
v-loading="loadingWB"
:data="tableDataWB"
style="width: 100%;min-height: 600px;"
size="mini"
height="600"
highlight-current-row
border>
<el-table-column
label="序号"
align="center"
type="index"
width="50"/>
<el-table-column align="center" label="物料名称">
<template slot-scope="scope">
{{ scope.row.物料名称 }}
</template>
</el-table-column>
<el-table-column align="center" label="物料规格">
<template slot-scope="scope">
{{ scope.row.物料规格 }}
</template>
</el-table-column>
<el-table-column align="center" label="物料型号">
<template slot-scope="scope">
{{ scope.row.物料型号 }}
</template>
</el-table-column>
<el-table-column align="center" label="零件数量">
<template slot-scope="scope">
{{ scope.row.零件数量 }}
</template>
</el-table-column>
<el-table-column label="部件数量" align="center">
<template slot-scope="scope">
{{ scope.row.部件数量 }}
</template>
</el-table-column>
<el-table-column label="机床数量" align="center">
<template slot-scope="scope">
{{ scope.row.机床数量 }}
</template>
</el-table-column>
<el-table-column align="center" label="零件类型">
<template slot-scope="scope">
{{ scope.row.零件类型 }}
</template>
</el-table-column>
<el-table-column align="center" label="供货商">
<template slot-scope="scope">
{{ scope.row.供货商 }}
</template>
</el-table-column>
<el-table-column align="center" label="备注" width="100">
<template slot-scope="scope">
{{ scope.row.备注 }}
</template>
</el-table-column>
<el-table-column align="center" label="标记" width="100">
<template slot-scope="scope">
{{ scope.row.标记 }}
</template>
</el-table-column>
<el-table-column align="center" label="分类码" width="150">
<template slot-scope="scope">
{{ scope.row.分类码 }}
</template>
</el-table-column>
<el-table-column align="center" label="整改类型" width="150">
<template slot-scope="scope">
{{ scope.row.整改类型 }}
</template>
</el-table-column>
<el-table-column label="操作" fixed="right" align="center" width="200">
<template slot-scope="scope">
<el-button
:disabled="Number(id)!==0"
size="mini"
type="danger"
icon="el-icon-delete"
@click="handleDelete(scope.row)">删除</el-button>
</template>
</el-table-column>
</el-table>
<div class="block" style="margin-top: 10px">
<el-pagination
:current-page="pageCurrentWB"
:page-sizes="[10, 20, 30, 40]"
:page-size="pageSizeWB"
:total="totalWB"
layout="total, sizes, prev, pager, next, jumper"
@size-change="handleSizeChangeWB"
@current-change="handleCurrentChangeWB"/>
</div>
</el-card>
</div>
</template>
<script>
import { projectSelect, machineSelect, groupSelect, basicPartsData, deleteBasicParts, purchasePartsData, deletePurchaseData, getFileData } from '@/api/TechnologyCenter/QueryParts'
import { mapGetters } from 'vuex'
import { ServerIP } from '@/utils/request'
export default {
name: 'Index',
data() {
return {
projectValue: '',
project: [],
machineValue: '',
machine: [],
groupValue: '',
group: [],
loading: false,
loadingWB: false,
total: 0,
tableData: [],
tableDataWB: [],
pageCurrent: 1,
pageSize: 10,
pageCurrentWB: 1,
pageSizeWB: 10,
totalWB: 0,
hadFile: []
}
},
computed: {
...mapGetters([
'name',
'id'// 人员编号
]),
groupName() {
for (let i = 0; i < this.group.length; i++) {
if (this.group[i].value === this.groupValue) {
return this.group[i].label
}
}
}
},
watch: {
project(val) {
console.log(val)
if (val.length > 0) {
this.projectValue = val[0].value
}
},
projectValue(val) {
this.machineValue = ''
this.machine = []
this.groupValue = ''
this.group = []
if (val) {
this.getMachineSelect(val)
}
},
machine(val) {
if (val.length > 0) {
this.machineValue = val[0].value
}
},
machineValue(val) {
this.groupValue = ''
this.group = []
if (val) {
this.getGroupSelect(val)
}
},
group(val) {
if (val.length > 0) {
this.groupValue = val[0].value
}
},
groupValue(val) {
if (val) {
this.pageCurrentWB = 1
this.pageSizeWB = 10
this.pageCurrent = 1
this.pageSize = 10
this.getTableData()
}
}
},
mounted() {
this.fetchData()
},
methods: {
// 在什么情况下需要查询上传的附件，调用this.getFileData()即可根据
getFileData(machineValue) {
this.hadFile = []
getFileData(machineValue).then(res => {
if (res.data.length > 0) {
res.data.map(item => {
this.hadFile.push({
url: `${ServerIP}${item.文件标识}.${item.文件后缀}`,
name: `${item.文件名称}.${item.文件后缀}`,
suffix: item.文件后缀,
id: item.文件标识
})
})
}
})
},
fetchData() {
this.getSelect(projectSelect, ['项目名称', '项目流水号'], 'project')
},
getMachineSelect(val) {
this.getSelect(machineSelect, ['机床图号', '机床流水号'], 'machine', val)
},
getGroupSelect(val) {
this.getSelect(groupSelect, ['组号', '组件流水号'], 'group', val)
},
getTableData() {
this.getFileData(this.machineValue)
console.log(this.hadFile, 88899)
const project_check = this.projectValue ? 1 : 0
const machine_check = this.machineValue ? 1 : 0
const group_check = this.groupValue ? 1 : 0
this.loading = true
basicPartsData(project_check, this.projectValue, machine_check, this.machineValue, group_check, this.groupValue, this.pageSize, this.pageCurrent).then(response => {
this.loading = false
const res = response.data
this.total = res.total
console.log(this.tableData)
this.tableData = res.rows.map(item => {
if (item.整改类型 === '1') {
item.整改类型 = '新增'
} else if (item.整改类型 === '2') {
item.整改类型 = '替换'
} else if (item.整改类型 === '3') {
item.整改类型 = '补充加工'
}
return item
})
})
this.loadingWB = true
purchasePartsData(this.groupValue, this.pageCurrentWB, this.pageSizeWB).then(response => {
this.loadingWB = false
const data = response.data
this.totalWB = data.total
this.tableDataWB = data.rows.map(item => {
console.log(item)
if (item.整改类型 === '1') {
item.整改类型 = '新增'
} else if (item.整改类型 === '2') {
item.整改类型 = '替换'
} else if (item.整改类型 === '3') {
item.整改类型 = '补充加工'
}
item.零件类型 = item.零件类型 === '2' ? '外购件' : '标准件'
return item
})
})
},
handleDelete(row) {
if (row.基本件流水号) {
this.deleteRow(deleteBasicParts, row.基本件流水号, function() {
this.getTableData()
})
} else {
this.deleteRow(deletePurchaseData, row.标准件和外购件流水号, function() {
this.getTableData()
})
}
},
handleSizeChanges(val) {
this.pageCurrent = 1
this.pageSize = val
this.getTableData()
},
handleCurrentChanges(val) {
this.pageCurrent = val
this.getTableData()
},
handleSizeChangeWB(val) {
this.pageCurrentWB = 1
this.pageSizeWB = val
this.getTableData()
},
handleCurrentChangeWB(val) {
this.pageCurrentWB = val
this.getTableData()
}
}
}
</script>
<style scoped>
span{
margin: 20px;
}
.wrapper{
width: 225px;
height: 50px;
overflow: hidden;
border: 1px solid #b8c7d9;
float: left;
margin: 10px;
}
.content{
position: relative;
padding: 8px 8px 0 8px;
}
.action{
position: absolute;
top: 4px;
right: 8px;
}
.delete{
padding: 0 5px;
border-radius: 3px;
color: #0f84b0;
font-size: 12px;
}
.delete:hover{
background: -webkit-linear-gradient(top,#0ba9e3,#0099d3);
color: #fff;
}
a{
text-decoration: none;
}
.icon{
width: 30px;
height: 30px;
display: inline-block;
margin-right: 7px;
margin-top: 2px;
font-size: 26px;
}
.info{
position: absolute;
left: 44px;
line-height: 30px;
display: inline-block;
color: #999;
}
</style>