You can not select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
625 lines
20 KiB
625 lines
20 KiB
<template> |
|
<basic-container> |
|
<avue-crud :option="option" :table-loading="loading" :data="data" v-model:page="page" v-model="form" ref="crud" |
|
@search-change="searchChange" @search-reset="searchReset" @selection-change="selectionChange" @row-del="rowDel" |
|
@current-change="currentChange" @size-change="sizeChange" @refresh-change="refreshChange" @on-load="onLoad"> |
|
<template #menu-left> |
|
<!-- <el-button @click="handleAdd" type="primary" icon="el-icon-plus">新增</el-button> --> |
|
<el-button type="danger" @click="handleDeletes">删 除</el-button> |
|
<!-- <el-button type="success" @click="handleImport">导入</el-button> --> |
|
<!-- <el-button type="success" icon="el-icon-setting" @click="handleUser">人员设置</el-button> --> |
|
</template> |
|
<template #menu-right> |
|
<el-button type="primary" @click="handleImport">导入</el-button> |
|
</template> |
|
<!-- <template #menu="scope"> |
|
<el-button type="text" @click="handleView(scope.row, 'view')">详情</el-button> |
|
<el-button type="text" @click="handleEdit(scope.row, 'add')">编辑</el-button> |
|
<el-button type="text" @click="handleDelete(scope.row, 'add')">删除</el-button> |
|
<el-button type="text" @click="handleIssue(scope.row, 'add')">下发</el-button> |
|
</template> --> |
|
<template #craftMan="{ row }"> |
|
{{ row.craftMan.userName }} |
|
</template> |
|
<template #mecMan="{ row }"> |
|
{{ row.mecMan.userName }} |
|
</template> |
|
</avue-crud> |
|
<el-dialog append-to-body :title="title" v-model="showDialog" width="60%"> |
|
<el-form ref="form" :model="projectForm" :rules="projectRules" label-width="100px" |
|
v-show="title == '新增' || title == '编辑'"> |
|
<el-row> |
|
<el-col :span="8"> |
|
<el-form-item label="项目名称：" prop="tpProject"> |
|
<el-input v-model="projectForm.tpProject" placeholder="请输入项目名称"></el-input> |
|
</el-form-item> |
|
</el-col> |
|
<el-col :span="8"> |
|
<el-form-item label="试验条件：" prop="tpCondition"> |
|
<el-input v-model="projectForm.tpCondition" placeholder="请输入试验条件"></el-input> |
|
</el-form-item> |
|
</el-col> |
|
<el-col :span="8"> |
|
<el-form-item label="试验标准：" prop="tpStandard"> |
|
<el-input v-model="projectForm.tpStandard" placeholder="请输入试验标准"></el-input> |
|
</el-form-item> |
|
</el-col> |
|
</el-row> |
|
<el-row> |
|
<el-col :span="8"> |
|
<el-form-item label="试验文件："> |
|
<el-upload class="upload-demo" action="https://jsonplaceholder.typicode.com/posts/" |
|
:on-preview="handlePreview" :on-remove="handleRemove" :before-remove="beforeRemove" multiple :limit="3" |
|
:on-exceed="handleExceed" :file-list="fileList"> |
|
<el-button size="small" type="primary">点击上传</el-button> |
|
<div slot="tip" class="el-upload__tip" style="margin-left: 5px;">支持扩展名：.doc .docx .pdf</div> |
|
</el-upload> |
|
</el-form-item> |
|
</el-col> |
|
</el-row> |
|
|
|
</el-form> |
|
<div v-show="title == '详情'"> |
|
<div style="font-weight: 550;margin-bottom: 20px;">检测信息</div> |
|
<el-descriptions class="margin-top" :column="4" > |
|
<el-descriptions-item label="试验项目：">{{ projectForm.tpProject }}</el-descriptions-item> |
|
<el-descriptions-item label="试验条件：">{{ projectForm.tpCondition }}</el-descriptions-item> |
|
<el-descriptions-item label="试验标准："><span style="color: #1890FF;cursor: pointer;">{{ projectForm.tpStandard }}</span></el-descriptions-item> |
|
</el-descriptions> |
|
|
|
</div> |
|
<template #footer> |
|
<span class="dialog-footer"> |
|
<el-button @click="showDialog = false">取 消</el-button> |
|
<el-button v-show="title != '详情'" type="primary" @click="submitForm">确 定</el-button> |
|
</span> |
|
</template> |
|
</el-dialog> |
|
<el-dialog append-to-body :title="title1" v-model="issueDialog" width="550px"> |
|
<el-form ref="issueForm" :model="issueForm" label-width="80px" :rules="formRules"> |
|
<el-form-item label="试验员" prop="userId"> |
|
<el-select v-model="issueForm.userId"> |
|
<el-option v-for="item in userData" :key="item.userId" :label="item.userName" |
|
:value="item.userId"></el-option> |
|
</el-select> |
|
</el-form-item> |
|
</el-form> |
|
<template #footer> |
|
<span class="dialog-footer"> |
|
<el-button @click="issueDialog = false">取 消</el-button> |
|
<el-button type="primary" @click="submitIssue">确 定</el-button> |
|
</span> |
|
</template> |
|
</el-dialog> |
|
</basic-container> |
|
</template> |
|
|
|
<script> |
|
export default { |
|
data() { |
|
return { |
|
loading: false, |
|
data: [], |
|
projectForm: {}, |
|
projectRules: { |
|
tpProject: [{ required: true, message: '请输入项目名称', trigger: 'blur' }], |
|
testPieceTitle: [{ required: true, message: '请选择试验件', trigger: 'blur' }], |
|
tpStandard: [{ required: true, message: '请输入试验标准', trigger: 'blur' }], |
|
craftMan: [{ required: true, message: '请选择主管工艺', trigger: 'blur' }], |
|
mecMan: [{ required: true, message: '请选择试验员', trigger: 'blur' }], |
|
remDays: [{ required: true, message: '请选择超期提醒', trigger: 'blur' }], |
|
textCycle: [{ required: true, message: '请选择试验周期', trigger: 'blur' }], |
|
}, |
|
form: {}, |
|
page: { |
|
pageSize: 10, |
|
currentPage: 1, |
|
total: 0, |
|
}, |
|
issueDialog: false, |
|
issueForm: {}, |
|
formRules: { |
|
userId: [{ required: true, message: '请选择检测员', trigger: 'blur' }], |
|
}, |
|
title1:'任务下发', |
|
userData: [ |
|
{ |
|
"jobName": "软件工程师", |
|
"deptName": "MES开发部", |
|
"ldapName": null, |
|
"userSex": 1, |
|
"deptId": 1, |
|
"mobile": null, |
|
"userName": "测试", |
|
"userId": 521, |
|
"userCode": "0001" |
|
}, |
|
{ |
|
"jobName": null, |
|
"deptName": "MES开发部", |
|
"ldapName": "jinna", |
|
"userSex": 2, |
|
"deptId": 1, |
|
"mobile": null, |
|
"userName": "靳娜", |
|
"userId": 21, |
|
"userCode": "jinna" |
|
}, |
|
{ |
|
"jobName": null, |
|
"deptName": "MES开发部", |
|
"ldapName": "zd001", |
|
"userSex": 1, |
|
"deptId": 1, |
|
"mobile": null, |
|
"userName": "张迪", |
|
"userId": 601, |
|
"userCode": "zd001" |
|
} |
|
], |
|
selectionList: [], |
|
title: '新增', |
|
showDialog: false, |
|
monthTags: [], |
|
yearTags: [], |
|
option: { |
|
tip: false, |
|
height: 'auto', |
|
calcHeight: 32, |
|
columnSort: true, |
|
// simplePage: true, |
|
searchShow: true, |
|
searchMenuSpan: 18, |
|
searchIcon: true, |
|
searchIndex: 3, |
|
tree: false, |
|
border: true, |
|
index: true, |
|
selection: true, |
|
viewBtn: true, |
|
delBtn: true, |
|
addBtn: true, |
|
editBtn: true, |
|
editBtnText: '修改', |
|
viewBtnText: '详情', |
|
addBtnIcon: ' ', |
|
viewBtnIcon: ' ', |
|
delBtnIcon: ' ', |
|
editBtnIcon: ' ', |
|
labelWidth: 120, |
|
// menuWidth: 330, |
|
dialogWidth: 600, |
|
dialogClickModal: false, |
|
searchEnter: true, |
|
filterBtn: true, |
|
searchShowBtn: false, |
|
excelBtn: true, |
|
showOverflowTooltip: true, |
|
align: 'center', |
|
searchLabelPosition:'left', |
|
searchLabelPosition:'left', |
|
searchGutter:24, |
|
searchSpan:6, |
|
menuAlign: 'left', |
|
gridBtn:false, |
|
searchMenuPosition:'right', |
|
column: [ |
|
{ |
|
label: '试验项目', |
|
prop: 'tpProject', |
|
search: true, |
|
type: 'select', |
|
sortable: true, |
|
filter: true, |
|
addDisplay: true, |
|
editDisplay: true, |
|
viewDisplay: true, |
|
span: 24, |
|
rules: [ |
|
{ |
|
required: true, |
|
message: '请输入试验项目', |
|
trigger: 'blur', |
|
}, |
|
], |
|
dicData: [ |
|
{ |
|
label: '盐雾试验', |
|
value: 0, |
|
}, |
|
{ |
|
label: '盐雾试验1', |
|
value: 1, |
|
} |
|
] |
|
}, |
|
{ |
|
label: '试验条件', |
|
prop: 'tpCondition', |
|
search: false, |
|
sortable: true, |
|
filter: true, |
|
addDisplay: true, |
|
editDisplay: true, |
|
viewDisplay: true, |
|
span: 24, |
|
rules: [ |
|
{ |
|
required: true, |
|
message: '请输入试验条件', |
|
trigger: 'blur', |
|
}, |
|
], |
|
}, |
|
{ |
|
label: '试验标准', |
|
prop: 'tpStandard', |
|
search: false, |
|
type:'select', |
|
filterable:true, |
|
allowCreate:true, |
|
sortable: true, |
|
filter: true, |
|
addDisplay: true, |
|
editDisplay: true, |
|
viewDisplay: true, |
|
span: 24, |
|
rules: [ |
|
{ |
|
required: true, |
|
message: '请输入试验标准', |
|
trigger: 'blur', |
|
}, |
|
], |
|
dicData:[ |
|
{label:'标准一',value:'001'}, |
|
{label:'标准二',value:'002'}, |
|
], |
|
control: (val, form) => { |
|
console.log('val-----------------',val) |
|
console.log('form-----------------',form) |
|
if(val){ |
|
let tmp = this.option.column[2].dicData.find(item => item.value == val) |
|
if(tmp){ |
|
this.option.column[3].addDisplay = false |
|
}else{ |
|
this.option.column[3].addDisplay = true |
|
} |
|
} |
|
} |
|
}, |
|
{ |
|
label: '试验文件', |
|
prop: 'tpFile', |
|
search: false, |
|
type: 'upload', |
|
sortable: true, |
|
filter: true, |
|
addDisplay: false, |
|
editDisplay: false, |
|
viewDisplay: false, |
|
span: 24, |
|
rules: [ |
|
{ |
|
required: true, |
|
message: '请输入试验文件', |
|
trigger: 'blur', |
|
}, |
|
], |
|
}, |
|
// { |
|
// label: '镀种', |
|
// prop: 'duzhong', |
|
// search: false, |
|
// sortable: true, |
|
// type:'select', |
|
// filter: true, |
|
// addDisplay: true, |
|
// editDisplay: false, |
|
// viewDisplay: false, |
|
// span: 24, |
|
// width: 200, |
|
// rules: [ |
|
// { |
|
// required: true, |
|
// message: '请输入镀种', |
|
// trigger: 'blur', |
|
// }, |
|
// ], |
|
// dicData:[ |
|
// {label:'镀种一',value:'1'}, |
|
// {label:'镀种二',value:'2'}, |
|
// {label:'镀种三',value:'3'}, |
|
// ] |
|
// }, |
|
// { |
|
// label: '试验件', |
|
// prop: 'testPieceTitle', |
|
// type: 'select', |
|
// search: false, |
|
// sortable: true, |
|
// filter: true, |
|
// span: 24, |
|
// width: 200, |
|
// dicData: [ |
|
// { |
|
// label: '零件', |
|
// value: 1 |
|
// }, |
|
// { |
|
// label: '试片', |
|
// value: 0 |
|
// } |
|
// ] |
|
// }, |
|
// { |
|
// label: '主管工艺', |
|
// prop: 'craftMan', |
|
// search: false, |
|
// sortable: true, |
|
// filter: true, |
|
// span: 24, |
|
// width: 200, |
|
// }, |
|
// { |
|
// label: '试验员', |
|
// prop: 'mecMan', |
|
// search: false, |
|
// sortable: true, |
|
// editDisplay: false, |
|
// filter: true, |
|
// addDisplay: true, |
|
// span: 24, |
|
// width: 200, |
|
// rules: [ |
|
// { |
|
// required: true, |
|
// message: '请输入试验员', |
|
// trigger: 'blur', |
|
// }, |
|
// ], |
|
// }, |
|
// { |
|
// label: '试验周期', |
|
// prop: 'textCycle', |
|
// search: false, |
|
// sortable: true, |
|
// filter: true, |
|
// span: 24, |
|
// width: 200, |
|
// type:'select', |
|
// dicData:[ |
|
// { |
|
// value:3, |
|
// label:'每年' |
|
// }, |
|
// { |
|
// value:2, |
|
// label:'每月' |
|
// }, |
|
// { |
|
// value:1, |
|
// label:'每周' |
|
// } |
|
// ] |
|
// }, |
|
// { |
|
// label: '提前下发天数', |
|
// prop: 'beforeDays', |
|
// search: false, |
|
// sortable: true, |
|
// filter: true, |
|
// span: 24, |
|
// width: 200, |
|
// }, |
|
// { |
|
// label: '超期提醒天数', |
|
// prop: 'remDays', |
|
// search: false, |
|
// sortable: true, |
|
// filter: true, |
|
// span: 24, |
|
// width: 200, |
|
// }, |
|
// { |
|
// label: '更新时间', |
|
// prop: 'updateTime', |
|
// search: false, |
|
// sortable: true, |
|
// filter: true, |
|
// span: 24, |
|
// width: 200, |
|
// }, |
|
] |
|
} |
|
} |
|
}, |
|
mounted() { |
|
|
|
}, |
|
methods: { |
|
// 点击详情按钮 |
|
handleView(row) { |
|
this.projectForm = row |
|
this.title = '详情' |
|
this.showDialog = true |
|
}, |
|
// 点击编辑按钮 |
|
handleEdit(row) { |
|
this.projectForm = row |
|
this.title = '编辑' |
|
if (this.projectForm.textCycle == '3') { |
|
this.yearTags = this.projectForm.tags |
|
} else if (this.projectForm.textCycle == '2') { |
|
this.monthTags = this.projectForm.tags |
|
} else { |
|
this.projectForm.weekList = this.projectForm.tags |
|
} |
|
this.showDialog = true |
|
}, |
|
// 点击下发按钮 |
|
handleIssue(row) { |
|
this.title1 = '任务下发' |
|
this.issueDialog = true |
|
}, |
|
// 点击上方删除按钮，多条删除 |
|
handleDeletes() { |
|
if (this.selectionList.length == 0) { |
|
this.$message.error('请至少选择一条数据!') |
|
} else { |
|
this.$confirm('确定删除所选数据?', { |
|
confirmButtonText: '确定', |
|
cancelButtonText: '取消', |
|
type: 'warning', |
|
}).then(() => { |
|
|
|
}) |
|
} |
|
}, |
|
// 点击导入按钮 |
|
handleImport() { |
|
|
|
}, |
|
// 点击人员配置按钮 |
|
handleUser() { |
|
if (this.selectionList.length == 0) { |
|
this.$message.error('请至少选择一条数据!') |
|
} else { |
|
this.title1 = '人员设置' |
|
this.issueDialog = true |
|
} |
|
}, |
|
// 点击删除按钮 |
|
rowDel(row) { |
|
this.$confirm('确定删除此条数据?', { |
|
confirmButtonText: '确定', |
|
cancelButtonText: '取消', |
|
type: 'warning', |
|
}).then(() => { |
|
|
|
}) |
|
}, |
|
// 点击新增按钮 |
|
handleAdd() { |
|
this.title = '新增' |
|
this.showDialog = true |
|
this.projectForm = {} |
|
this.monthTags = [] |
|
this.yearTags = [] |
|
this.$refs.form.resetFields() |
|
}, |
|
// 切换周期 |
|
changeCycle() { |
|
this.projectForm.monthValue = '' |
|
this.projectForm.weekList = [] |
|
this.monthTags = [] |
|
this.projectForm.yearMonth = '' |
|
this.projectForm.yearDays = '' |
|
this.yearTags = [] |
|
}, |
|
// 添加月份日期 |
|
addMonth() { |
|
let value = this.projectForm.monthValue + '日' |
|
if (this.monthTags.find(item => item == value)) return |
|
this.monthTags.push(this.projectForm.monthValue + '日') |
|
}, |
|
// 添加年份日期 |
|
addYears() { |
|
let value = this.projectForm.yearMonth + '月' + this.projectForm.yearDays + '日' |
|
if (this.yearTags.find(item => item == value)) return |
|
if (this.projectForm.yearMonth == '' || this.projectForm.yearDays == '') return |
|
this.yearTags.push(this.projectForm.yearMonth + '月' + this.projectForm.yearDays + '日') |
|
}, |
|
// 删除月份日期 |
|
closeMonthTag(item, index) { |
|
this.monthTags = this.monthTags.filter(tags => tags != item) |
|
}, |
|
// 删除年份日期 |
|
closeYearsTag(item, index) { |
|
this.yearTags = this.yearTags.filter(tags => tags != item) |
|
}, |
|
// 新增确定按钮 |
|
submitForm() { |
|
this.$refs.form.validate(valid => { |
|
if (valid) { |
|
this.showDialog = false |
|
} |
|
}) |
|
}, |
|
// 下发弹窗确定按钮 |
|
submitIssue() { |
|
this.$refs.issueForm.validate(valid => { |
|
if (valid) { |
|
this.issueDialog = false |
|
} |
|
}) |
|
}, |
|
// 多选 |
|
selectionChange(list) { |
|
this.selectionList = list; |
|
}, |
|
searchReset() { |
|
this.query = {}; |
|
this.onLoad(this.page); |
|
}, |
|
searchChange(params, done) { |
|
this.query = params; |
|
this.page.currentPage = 1; |
|
this.onLoad(this.page, params); |
|
done(); |
|
}, |
|
currentChange(currentPage) { |
|
this.page.currentPage = currentPage; |
|
}, |
|
sizeChange(pageSize) { |
|
this.page.pageSize = pageSize; |
|
}, |
|
refreshChange() { |
|
this.onLoad(this.page, this.query); |
|
}, |
|
onLoad() { |
|
this.data = [ |
|
{ |
|
id: 1, tpProject: '盐雾试验', tpCondition: '32小时', tpStandard: 'xxxx标准', |
|
testPieceTitle: '零件', testPiece: 0, |
|
craftMan: { userName: '张三' }, |
|
mecMan: { userName: '李四' }, |
|
textCycle: 3, textCycleTitle: '每年', |
|
tags: ['1月10日', '5月15日', '7月20日', '10月13日'], |
|
beforeDays: 20,duzhong:'2', testDays:7,remDays: 7, updateTime: '2024-10-11 12:32:11', updateUser: '张三', |
|
}, |
|
{ |
|
id: 2, tpProject: '盐雾试验', tpCondition: '32小时', tpStandard: 'xxxx标准', |
|
testPieceTitle: '零件', testPiece: 0, |
|
craftMan: { userName: '张三' }, |
|
mecMan: { userName: '李四' }, |
|
textCycle: 1, textCycleTitle: '每周', |
|
tags: ['周四', '周五', '周六'], |
|
beforeDays: 20,duzhong:'2', testDays:7,remDays: 7, updateTime: '2024-10-11 12:32:11', updateUser: '张三', |
|
}, |
|
{ |
|
id: 3, tpProject: '盐雾试验', tpCondition: '32小时', tpStandard: 'xxxx标准', |
|
testPieceTitle: '零件', testPiece: 0, |
|
craftMan: { userName: '张三' }, |
|
mecMan: { userName: '李四' }, |
|
textCycle: 2, textCycleTitle: '每月', |
|
tags: ['10日', '15日'], |
|
beforeDays: 20,duzhong:'2', testDays:7,remDays: 7, updateTime: '2024-10-11 12:32:11', updateUser: '张三', |
|
}, |
|
{ |
|
id: 4, tpProject: '盐雾试验', tpCondition: '32小时', tpStandard: 'xxxx标准', |
|
testPieceTitle: '零件', testPiece: 0, |
|
craftMan: { userName: '张三' }, |
|
mecMan: { userName: '李四' }, |
|
textCycle: 3, textCycleTitle: '每年', |
|
tags: ['1月10日', '5月15日', '7月20日', '10月13日'], |
|
beforeDays: 20,duzhong:'2', testDays:7,remDays: 7, updateTime: '2024-10-11 12:32:11', updateUser: '张三', |
|
}, |
|
] |
|
this.page.total = this.data.length |
|
} |
|
} |
|
} |
|
</script> |
|
|
|
<style></style> |