290 lines
9.4 KiB
Vue
290 lines
9.4 KiB
Vue
<template>
|
|
<!--零部件编号申请 总体区域-->
|
|
<div class="partCodeApply" id="partCodeApply">
|
|
<!--搜索区域-->
|
|
<div class="search-area">
|
|
<el-form inline class="label-input-form" v-model="searchFormData">
|
|
<el-form-item label="子组号" class="search-item">
|
|
<el-input placeholder="根据子组号查询" clearable :maxlength="100" v-model="searchFormData.subgroupNumber">
|
|
|
|
</el-input>
|
|
</el-form-item>
|
|
<el-form-item label="分组代号" class="search-item">
|
|
<el-input placeholder="根据分组代号查询" clearable :maxlength="100" v-model="searchFormData.groupCode">
|
|
|
|
</el-input>
|
|
</el-form-item>
|
|
<el-form-item label="零件分类号" class="search-item">
|
|
<el-input placeholder="根据零件分类代号查询" clearable :maxlength="100" v-model="searchFormData.partCategoryCode">
|
|
|
|
</el-input>
|
|
</el-form-item>
|
|
<el-form-item>
|
|
<el-button type="primary" size="mini" v-btn-permission="'02424c2bc370ee846aa5a6d60c49a6a5'"
|
|
class="common-button-primary" @click="getTableByPage('')">
|
|
查询
|
|
</el-button>
|
|
</el-form-item>
|
|
<el-form-item>
|
|
<el-button size="mini" v-btn-permission="'c5b873fcb659afb230db133e7e4706c8'" class="common-button-default"
|
|
@click="clearAllSearch">
|
|
清空
|
|
</el-button>
|
|
</el-form-item>
|
|
</el-form>
|
|
</div>
|
|
<!--操作区域-->
|
|
<div class="operation_area">
|
|
<el-button type="primary" size="mini" class="common-button-primary" @click="exportPartInfo()"
|
|
v-btn-permission="'2b196e3179b073436deb9c64251ddb3d'" title="不勾选时默认导出所有筛选项；勾选时仅导出勾选项">
|
|
<i class="iconfont"></i>
|
|
导出
|
|
</el-button>
|
|
<el-button type="primary" size="mini" v-btn-permission="'9caea8a46be62a0ae0600de35bad6539'"
|
|
class="common-button-primary" @click="deletePartCode('demore',null)">
|
|
<i class="iconfont"></i>
|
|
删除
|
|
</el-button>
|
|
</div>
|
|
<!--表格区域-->
|
|
<div class="table_area">
|
|
<div class="container">
|
|
<loading :loading="loading">数据获取中...</loading>
|
|
<!--表头-->
|
|
<div class="table-wrap">
|
|
<el-table
|
|
:data="partCodeList"
|
|
tooltip-effect="dark"
|
|
height="100%"
|
|
border
|
|
style="width: 99%"
|
|
class="table"
|
|
v-loading="tableLoading.loadData"
|
|
:header-cell-style="{background: '#e8e8e8', color: '#333333', fontSize: '16px',
|
|
fontWeight: 'bold', height: '48px'}"
|
|
@selection-change="selectOne"
|
|
ref="selection">
|
|
<el-table-column type="selection" align="center"></el-table-column>
|
|
<el-table-column label="子组号" prop="subgroupNumber" align="center"></el-table-column>
|
|
<el-table-column label="子组结构号" prop="subgroupStructureNumber" align="center"></el-table-column>
|
|
<el-table-column label="子组结构名称" prop="subgroupStructureName" align="center"></el-table-column>
|
|
<el-table-column label="分组代号" prop="groupCode" align="center"></el-table-column>
|
|
<el-table-column label="零部件分类名称" prop="partCategoryName" align="center"></el-table-column>
|
|
<el-table-column label="零部件分类代号" prop="partCategoryCode" align="center"></el-table-column>
|
|
<el-table-column label="备注" prop="remarks" align="center"></el-table-column>
|
|
</el-table>
|
|
</div>
|
|
<!--表头-->
|
|
</div>
|
|
</div>
|
|
<!--分页区域-->
|
|
<div class="page_area">
|
|
<pagination :page="pageNo" :total="total" @pageChange="pageChange"
|
|
@pageSizeChange="pageSizeChange"></pagination>
|
|
</div>
|
|
<!--导出模态框区域-->
|
|
<el-dialog :visible.sync="exportModelFlag" title="导出文件" width="300px">
|
|
<el-form :inline="true" class="label-input-form search-area">
|
|
<el-form-item label="导出名称" class="search-item">
|
|
<el-input v-model="exportName" placeholder="请输入导出文件名称" :maxlength="30" clearable label="导出名称"/>
|
|
</el-form-item>
|
|
</el-form>
|
|
<span slot="footer" class="demo-drawer-footer">
|
|
<el-button size="mini" class="common-button-default" icon="el-icon-close" @click="cancal">取消</el-button>
|
|
<el-button type="primary" size="mini" class="common-button-primary" icon="el-icon-check"
|
|
@click="exportTestItem">提交</el-button>
|
|
</span>
|
|
</el-dialog>
|
|
</div>
|
|
</template>
|
|
|
|
<script>
|
|
import {interfaceUrl} from "@/sysConfig";
|
|
|
|
export default {
|
|
name: "partCodeApply",
|
|
data() {
|
|
return {
|
|
//零部件编号表格数据
|
|
partCodeList: [],
|
|
//当前页数
|
|
pageNo: 1,
|
|
//总数
|
|
total: 1,
|
|
//搜索区域输入框的数据
|
|
searchFormData: {
|
|
//子组号
|
|
subgroupNumber: "",
|
|
//分组代号
|
|
groupCode: "",
|
|
//零件分类号
|
|
partCategoryCode: ""
|
|
},
|
|
loading: false,
|
|
tableLoading: {
|
|
loadData: false
|
|
},
|
|
selectedList: [],//标准选中的数据
|
|
saveExportType: '',// 导出文件模态框控制，和文件名称
|
|
exportName: '',//导出文件的名称输入值
|
|
exportModelFlag: false, //导出模态窗
|
|
}
|
|
},
|
|
mounted() {
|
|
this.getTableByPage();
|
|
},
|
|
methods: {
|
|
//导出
|
|
exportPartInfo() {
|
|
if (this.selectedList.length > 0) {
|
|
this.saveExportType = 'apart'
|
|
} else {
|
|
this.saveExportType = 'all'
|
|
}
|
|
this.exportName = ''
|
|
this.exportModelFlag = true
|
|
console.log(this.saveExportType);
|
|
},
|
|
//取消导出
|
|
cancal() {
|
|
this.exportModelFlag = false
|
|
},
|
|
//确认导出
|
|
exportTestItem() {
|
|
if (this.saveExportType === 'apart') {
|
|
if (this.selectedList != null && this.selectedList != '') {
|
|
console.log(this.selectedList);
|
|
const exportURL = interfaceUrl + 'sarStandPartCodeApply/exportPartInfoExcel?' +
|
|
'exportType' + this.saveExportType + '&ids=' + this.selectedList.join(',') + '&exportName=' + this.exportName
|
|
window.open(exportURL)
|
|
this.$message.success('导出信息成功')
|
|
}
|
|
} else if (this.saveExportType === 'all') {
|
|
console.log(this.selectedList);
|
|
const exportURL = interfaceUrl + 'sarStandPartCodeApply/exportPartInfoExcel?' +
|
|
'exportType' + this.saveExportType + '&ids=' + this.selectedList.join(',') + '&exportName=' + this.exportName
|
|
window.open(exportURL)
|
|
this.$message.success('导出信息成功')
|
|
}
|
|
this.exportModelFlag = false
|
|
this.selectedList = []
|
|
},
|
|
// 表格选择框
|
|
selectOne(data) {
|
|
this.selectedList = [];
|
|
for (let i = 0; i < data.length; i++) {
|
|
this.selectedList.push(data[i].id);
|
|
}
|
|
},
|
|
// 批量删除
|
|
deletePartCode(flag, id) {
|
|
if (flag === 'delOne') {
|
|
this.selectedList = [];
|
|
this.selectedList[0] = id;
|
|
}
|
|
if (this.selectedList.length === 0) {
|
|
this.$message.warning('请选择要删除的数据')
|
|
} else {
|
|
this.$confirm('确定删除这些数据？', '提示', {
|
|
confirmButtonText: '确定',
|
|
confirmButtonClass: 'common-button-primary',
|
|
cancelButtonText: '取消',
|
|
type: 'warning',
|
|
}).then(() => {
|
|
const URL = `sarStandPartCodeApply/deleteListAll?idList=${this.selectedList.join(',')}`
|
|
this.$http.postDelete(URL, {}, res => {
|
|
this.getTableByPage();
|
|
this.selectedList = [];
|
|
this.$message.success('删除成功')
|
|
}, e => {
|
|
});
|
|
}).catch(() => {
|
|
|
|
})
|
|
}
|
|
},
|
|
// 查询零部件table列表
|
|
getTableByPage() {
|
|
this.tableLoading.loadData = true
|
|
//后端的controller接口
|
|
this.$http.get('sarStandPartCodeApply', {
|
|
...this.searchFormData,
|
|
current: this.pageNo,
|
|
size: this.$store.getters.userInfo.configContent
|
|
}, {
|
|
_this: this
|
|
}, res => {
|
|
this.tableLoading.loadData = false
|
|
this.total = res.data.total
|
|
this.partCodeList = res.data.records
|
|
}, e => {
|
|
this.tableLoading.loadData = false
|
|
})
|
|
},
|
|
// 清空 查询条件
|
|
clearAllSearch() {
|
|
this.searchFormData = {
|
|
//子组号
|
|
subgroupNumber: "",
|
|
//分组代号
|
|
groupCode: "",
|
|
//零件分类号
|
|
partCategoryCode: ""
|
|
}
|
|
this.getTableByPage()
|
|
},
|
|
// 分页事件
|
|
pageChange(page) {
|
|
this.pageNo = page
|
|
this.getTableByPage()
|
|
},
|
|
pageSizeChange(pageSize) {
|
|
console.log(pageSize);
|
|
this.getTableByPage()
|
|
},
|
|
}
|
|
}
|
|
</script>
|
|
|
|
<style lang="less" scoped>
|
|
#partCodeApply {
|
|
height: 100%;
|
|
background-color: #ffffff;
|
|
padding-left: 10px;
|
|
|
|
.search-area {
|
|
/deep/ .el-input__inner {
|
|
width: 185px;
|
|
}
|
|
}
|
|
|
|
.table_area {
|
|
display: flex;
|
|
height: calc(100% - 115px);
|
|
|
|
.container {
|
|
flex: 1;
|
|
height: 100%;
|
|
|
|
.table-wrap {
|
|
flex: 1;
|
|
height: 100%;
|
|
}
|
|
}
|
|
}
|
|
|
|
|
|
.operation_area {
|
|
padding: 4px 0 14px 10px;
|
|
}
|
|
|
|
.page_area {
|
|
// /deep/只在当前页面修改elementui的默认样式
|
|
/deep/ .pagination-slot {
|
|
padding-left: 40px;
|
|
}
|
|
}
|
|
|
|
}
|
|
</style>
|