提交 517f8403 authored 作者: zax's avatar zax

input事件修改

上级 9c6d9001
......@@ -103,19 +103,32 @@ export default {
name: this.name,
producer: this.producer,
status: parseInt(this.status),
techId: 0,
techId: '',
type: parseInt(this.type)
};
this.$server.postProduceAdd(data).then(res => {
if (res.data.code === 200) {
this.$message.success(this.text + '成功!');
this.$emit('on-cancel', true)
} else {
if ( this.text === '产品信息修改') {
this.$server.putProduceUpdate(data).then(res => {
if (res.data.code === 200) {
this.$message.success(this.text + '成功!');
this.$emit('on-cancel', true)
} else {
this.$message.error(this.text + '失败!');
}
}).catch(err => {
this.$message.error(this.text + '失败!');
}
}).catch(err => {
this.$message.error(this.text + '失败!');
})
})
} else {
this.$server.postProduceAdd(data).then(res => {
if (res.data.code === 200) {
this.$message.success(this.text + '成功!');
this.$emit('on-cancel', true)
} else {
this.$message.error(this.text + '失败!');
}
}).catch(err => {
this.$message.error(this.text + '失败!');
})
}
}
},
components: {
......
......@@ -53,10 +53,12 @@
align="center">
</el-table-column>>
<el-table-column
:formatter="techIdChange"
prop="techId"
label="技术路线"
align="center">
<template slot-scope="scope">
<span v-if="scope.row.tech !== null">{{scope.row.tech.name}}</span>
</template>
</el-table-column>
</el-table>
</div>
......@@ -133,18 +135,6 @@ export default {
this.$message.error('数据请求失败!');
})
},
// 技术路线值转换
techIdChange (row) {
if (row.techId === null) {
return ''
} else {
this.techList.map(item => {
if (item.id === row.techId) {
return item.name
}
})
}
},
// 产品分类转换
formChange(row) {
return this.formVal[row.form]
......
......@@ -99,19 +99,33 @@ export default {
name: this.name,
producer: this.producer,
status: parseInt(this.status),
techId: 0,
techId: '',
type: parseInt(this.type)
};
this.$server.postProduceAdd(data).then(res => {
if (res.data.code === 200) {
this.$message.success(this.text + '成功!');
this.$emit('on-cancel', true)
} else {
console.log(data)
if ( this.text === '产品信息修改') {
this.$server.putProduceUpdate(data).then(res => {
if (res.data.code === 200) {
this.$message.success(this.text + '成功!');
this.$emit('on-cancel', true)
} else {
this.$message.error(this.text + '失败!');
}
}).catch(err => {
this.$message.error(this.text + '失败!');
}
}).catch(err => {
this.$message.error(this.text + '失败!');
})
})
} else {
this.$server.postProduceAdd(data).then(res => {
if (res.data.code === 200) {
this.$message.success(this.text + '成功!');
this.$emit('on-cancel', true)
} else {
this.$message.error(this.text + '失败!');
}
}).catch(err => {
this.$message.error(this.text + '失败!');
})
}
}
},
components: {
......
......@@ -69,9 +69,12 @@
align="center">
</el-table-column>
<el-table-column
prop="tech.name"
prop="tech"
label="技术路线"
align="center">
<template slot-scope="scope">
<span v-if="scope.row.tech !== null">{{scope.row.tech.name}}</span>
</template>
</el-table-column>
</el-table>
</div>
......@@ -152,18 +155,6 @@ export default {
this.$message.error('数据请求失败!');
})
},
// 技术路线值转换
techIdChange (row) {
if (row.techId === null) {
return ''
} else {
this.techList.map(item => {
if (item.id === row.techId) {
return item.name
}
})
}
},
// 产品分类转换
formChange(row) {
return this.formVal[row.form]
......
......@@ -4,7 +4,8 @@
<el-col :span="24">
<div class="content">
<p class="title">新增项目</p>
<el-col :span="24">
<el-scrollbar style="height: 94%">
<el-col :span="24">
<div class="content-title">
<span class="title-icon"></span>
<span class="head">基础信息</span>
......@@ -17,7 +18,7 @@
<span class="search-input">
<span>开始时间:</span>
<el-date-picker
v-model="actionTime"
v-model="startTime"
type="date"
placeholder="选择日期">
</el-date-picker>
......@@ -25,7 +26,7 @@
<span class="search-input">
<span>完成时间:</span>
<el-date-picker
v-model="actionTime"
v-model="startTime"
type="date"
placeholder="选择日期">
</el-date-picker>
......@@ -34,7 +35,7 @@
<p class="search">
<span class="search-input">
<span>技术路线:</span>
<el-select v-model="techVal" placeholder="请选择" clearable>
<el-select v-model="techVal" @change="search" size="medium" placeholder="请选择" clearable>
<el-option
v-for="item in techList"
:key="item.id"
......@@ -94,7 +95,178 @@
<span class="title-icon"></span>
<span class="head">软件信息</span>
</div>
<div class="common-table">
<el-table
highlight-current-row
max-height="840"
:data="softwareData"
stripe
style="width: 100%;">
<el-table-column
prop="name"
label="模块名称"
align="center">
<template slot-scope="scope">
<el-input v-model="scope.row.name" placeholder="请输入"></el-input>
</template>
</el-table-column>
<el-table-column
prop="introduction"
label="功能简介"
align="center">
<template slot-scope="scope">
<el-input v-model="scope.row.introduction" placeholder="请输入"></el-input>
</template>
</el-table-column>
<el-table-column
prop="startTime"
label="开始时间"
align="center">
<template slot-scope="scope">
<el-date-picker
v-model="scope.row.startTime"
type="date"
placeholder="选择日期">
</el-date-picker>
</template>
</el-table-column>
<el-table-column
prop="expected"
label="预计时间"
align="center">
<template slot-scope="scope">
<el-date-picker
v-model="scope.row.expected"
type="date"
placeholder="选择日期">
</el-date-picker>
</template>
</el-table-column>
</el-table>
<p class="add">
<span class="addMes" @click="addSoftware"><span class="add-icon"></span><span class="add-text">新增信息</span></span>
</p>
</div>
<div class="content-title">
<span class="title-icon"></span>
<span class="head">产品信息</span>
</div>
<div class="common-table">
<el-table
highlight-current-row
max-height="840"
:data="productData"
stripe
style="width: 100%;">
<el-table-column
prop="name"
label="产品名称"
align="center">
<template slot-scope="scope">
<el-input v-model="scope.row.name" placeholder="请输入"></el-input>
</template>
</el-table-column>
<el-table-column
prop="form"
label="型号"
align="center">
<template slot-scope="scope">
<el-input v-model="scope.row.introduction" placeholder="请输入"></el-input>
</template>
</el-table-column>
<el-table-column
prop="type"
label="类型"
align="center">
<template slot-scope="scope">
<el-select v-model="scope.row" @change="typeVal($event)" placeholder="请选择" clearable>
<el-option
v-for="item in formList"
:key="item.id"
:label="formChange(item)"
:value="formChange(item)">
</el-option>
</el-select>
</template>
</el-table-column>
<el-table-column
prop="expected"
label="计划数量"
align="center">
<template slot-scope="scope">
<el-input v-model="scope.row.introduction" placeholder="请输入"></el-input>
</template>
</el-table-column>
</el-table>
<p class="add">
<span class="addMes" @click="addProduct"><span class="add-icon"></span><span class="add-text">新增信息</span></span>
</p>
</div>
<div class="content-title">
<span class="title-icon"></span>
<span class="head">里程碑信息</span>
</div>
<div class="common-table">
<el-table
highlight-current-row
max-height="840"
:data="milepostData"
stripe
style="width: 100%;">
<el-table-column
prop="name"
label="里程碑编号"
align="center">
<template slot-scope="scope">
<span>{{scope.row.number}}</span>
</template>
</el-table-column>
<el-table-column
prop="introduction"
label="里程碑名称"
align="center">
<template slot-scope="scope">
<span>{{scope.row.name}}</span>
</template>
</el-table-column>
<el-table-column
prop="startTime"
label="截止日期"
align="center">
<template slot-scope="scope">
<el-date-picker
v-model="scope.row.time"
type="date"
placeholder="选择日期">
</el-date-picker>
</template>
</el-table-column>
<el-table-column
prop="expected"
label="文件列表"
align="center">
<template slot-scope="scope">
<el-checkbox-group v-model="checkList1[scope.$index]">
<el-checkbox v-for="item in scope.row.file" :checked="item === '开工令' || item === '初验报告' || item === '终验报告'" :disabled="item === '开工令' || item === '初验报告' || item === '终验报告'" :label="item"></el-checkbox>
</el-checkbox-group>
</template>
</el-table-column>
</el-table>
<!-- <p class="add">-->
<!-- <span class="addMes"><span class="add-icon"></span><span class="add-text">新增信息</span></span>-->
<!-- </p>-->
</div>
<p class="search">
<span class="search-input" style="width: 100%">
<span style="text-align: left">备注:</span>
<el-input type="textarea" :rows="2" v-model="textarea" placeholder="请输入"></el-input>
</span>
</p>
<p class="button">
<span class="buttonSave" @click="save">确定</span>
</p>
</el-col>
</el-scrollbar>
</div>
</el-col>
</el-row>
......@@ -106,9 +278,73 @@ export default {
name: 'projectAdd',
data() {
return {
actionTime: '',
startTime: '',
techVal: '',
techList: []
techList: [],
tableData: [{name: '',introduction: '',startTime: '',expected: ''}],
softwareData: [{name: '',introduction: '',startTime: '',expected: ''}],
productData: [{name: '',introduction: '',startTime: '',expected: ''}],
milepostData: [
{number: '里程碑1',name: '需求确认',time: '',file: ['需求文档', '详细设计', '开工令']},
{number: '里程碑2',name: '初验',time: '',file: ['初验报告']},
{number: '里程碑3',name: '终验',time: '',file: ['试运行报告','终验报告']},
],
textarea: '',
addImg: require('./img/add.png'),
addSelect: require('./img/add-select.png'),
img: require('./img/add.png'),
formValue: '',
formList: [{form: 1},{form: 2},{form: 3},{form: 4},{form: 5},{form: 6}],
formVal: {
'1': '服务器',
'2': 'CPU',
'3': '操作系统',
'4': '数据库',
'5': '中间件',
'6': '其他'
},
document: '',
checkList1: '',
checked: false,
type: ''
}
},
mounted() {
this.$server.getTechFindAll().then(res => { // 请求技术路线
this.techList = res.data.data
}).catch(err => {
this.$message.error('数据请求失败!');
})
},
methods: {
// 提交新增
save () {
console.log(this.type)
},
search () {
this.techList.map(item => { // 技术路线查询产品信息
if (item.name === this.techVal) {
this.productData = item.producies;
}
})
},
typeVal(e) {
this.type = e.target.value
console.log(e.target.value)
},
// 软件信息新增
addSoftware() {
let data = {name: '',introduction: '',startTime: '',expected: ''};
this.softwareData.push(data);
},
// 产品信息类型转换
formChange(row) {
return this.formVal[row.form]
},
// 产品信息新增
addProduct() {
let data = {name: '',introduction: '',startTime: '',expected: ''};
this.productData.push(data);
}
}
}
......@@ -137,6 +373,7 @@ export default {
background-color: rgba(72,119,230,0.1);
margin: 30px auto;
font-size: 20px;
position: relative;
}
.projectAdd .content .title-icon{
width: 5px;
......@@ -176,4 +413,83 @@ export default {
.projectAdd .content .el-date-editor.el-input, .el-date-editor.el-input__inner{
width: 100%;
}
.projectAdd .content .common-table{
border: 1px solid rgba(72,119,230,0.1);
cursor: default;
border-radius: 0;
box-shadow: none;
}
.projectAdd .content>>>.el-table--striped .el-table__body tr.el-table__row--striped.el-table__row--striped.el-table__row--striped:hover td {
background-color: #ffffff;
color: #233b6e;
}
.projectAdd .content>>>.el-table--enable-row-hover .el-table__body tr:hover>td{
background-color: #f5f8fd;
color: #233b6e;
}
.common-table{
margin: 24px 70px 0 70px;
box-shadow: rgba(72,119,230,0.1) 0 0 15px;;
border: .5px solid transparent;
border-radius: 10px;
cursor: default;
}
.el-table th > .cell{
font-size: 18px;
color: #333;
font-weight: normal;
}
.el-table th.is-leaf{
height: 70px;
}
.el-table tr{
font-size: 18px;
}
.el-table{
color: #233b6e;
}
.el-table--striped .el-table__body tr.el-table__row--striped.el-table__row--striped.el-table__row--striped td {
background-color: #fff;
}
.el-table th.is-leaf, .el-table td {
border-bottom: 1px solid #d5e3ff;
}
.el-table__body tr, .el-table__body td {
padding: 0;
height: 60px;
background: #f5f8fd;
cursor: pointer;
}
.projectAdd .content .add{
line-height: 56px;
}
.projectAdd .content .addMes{
font-size: 16px;
color: #7a95e6;
width: 90px;
cursor: pointer;
margin-left: 12px;
position: relative;
}
.projectAdd .content .add-icon{
width: 18px;
height: 19px;
background-image: url("./img/add.png");
position: absolute;
margin-top: 19px;
}
.projectAdd .content .addMes:hover{
color: #4877e6;
}
.projectAdd .content .addMes:hover .add-icon{
background-image: url("./img/add-select.png");
}
.projectAdd .content .add-text{
margin-left: 25px;
}
.projectAdd .button{
display: flex;
justify-content: space-evenly;
margin-top: 8px;
}
</style>
\ No newline at end of file
......@@ -189,5 +189,11 @@ const server = {
data: data
});
},
putProduceUpdate(data) { // 修改产品信息
return axios('/produce/update', {
method: 'put',
data: data
});
},
}
export default server;
import Vue from 'vue'
import { Row, Col, Carousel, CarouselItem, Scrollbar, Input, Button, Table, TableColumn, Pagination, Dialog,
Message,Select, Option, Form, FormItem, Radio, RadioGroup, Upload, DatePicker} from 'element-ui'
Message,Select, Option, Form, FormItem, Radio, RadioGroup, Upload, DatePicker,Checkbox} from 'element-ui'
import './element-variables.scss'
Vue.use(Row);
Vue.use(Col);
......@@ -26,3 +26,4 @@ Vue.use(Radio);
Vue.use(RadioGroup);
Vue.use(Upload);
Vue.use(DatePicker);
Vue.use(Checkbox);
Markdown 格式
0%
您添加了 0 到此讨论。请谨慎行事。
请先完成此评论的编辑!
注册 或者 后发表评论