|
@@ -30,13 +30,13 @@
|
|
|
</el-col>
|
|
|
<el-col :span="8">
|
|
|
<el-form-item >
|
|
|
- <el-checkbox v-model="form.onparties">关联客户对象</el-checkbox>
|
|
|
+ <el-checkbox v-model="form.onparties" @change="onPartiesChange">关联客户对象</el-checkbox>
|
|
|
<AssociateCustomerObject ref="onparties" :data="form" class="inline-16" style="margin-left: 10px" @selectObject="selectObject"></AssociateCustomerObject>
|
|
|
</el-form-item>
|
|
|
</el-col>
|
|
|
<el-col :span="8">
|
|
|
<el-form-item >
|
|
|
- <el-checkbox v-model="form.onstage" style="font-size: 14px">关联项目阶段</el-checkbox>
|
|
|
+ <el-checkbox v-model="form.onstage" style="font-size: 14px" @change="onOnstageChange">关联项目阶段</el-checkbox>
|
|
|
<AssociatedProjectPhases ref="onstage" :data="form" class="inline-16" style="margin-left: 10px" @selectStage="selectStage"></AssociatedProjectPhases>
|
|
|
</el-form-item>
|
|
|
</el-col>
|
|
@@ -59,13 +59,45 @@
|
|
|
<el-form-item style="float: right;width: 100%;text-align: center">
|
|
|
<el-table
|
|
|
:data="form.projtaskmag_options"
|
|
|
- style="width: 100%">
|
|
|
+ @expand-change="expandChange"
|
|
|
+ ref="refTable"
|
|
|
+ style="width: 100%"
|
|
|
+ @cell-click="cellClick">
|
|
|
+ <el-table-column v-if="(form.onparties || form.onstage) && showChildTable" type="expand">
|
|
|
+ <template slot-scope="prop">
|
|
|
+ <el-table
|
|
|
+ :data="associatedData"
|
|
|
+ border
|
|
|
+ style="width: 100%"
|
|
|
+ :span-method="oldData.length > 0? arraySpanMethod:noop">
|
|
|
+ <el-table-column
|
|
|
+ v-if="form.onparties"
|
|
|
+ prop="partiestype"
|
|
|
+ label="客户对象"
|
|
|
+ >
|
|
|
+ </el-table-column>
|
|
|
+ <el-table-column
|
|
|
+ v-if="form.onstage"
|
|
|
+ prop="stagename"
|
|
|
+ label="项目阶段"
|
|
|
+ >
|
|
|
+ </el-table-column>
|
|
|
+ <el-table-column
|
|
|
+ prop="score"
|
|
|
+ label="分值">
|
|
|
+ <template slot-scope="scope">
|
|
|
+ <el-input v-model="scope.row.score" placeholder=""></el-input>
|
|
|
+ </template>
|
|
|
+ </el-table-column>
|
|
|
+ </el-table>
|
|
|
+ </template>
|
|
|
+ </el-table-column>
|
|
|
<el-table-column
|
|
|
prop="optionname"
|
|
|
label="任务内容"
|
|
|
width="360">
|
|
|
<template slot-scope="scope">
|
|
|
- <el-input v-model="scope.row.optionname" placeholder=""></el-input>
|
|
|
+ <el-input @change="inputChange(scope.$index)" v-model="scope.row.optionname" placeholder=""></el-input>
|
|
|
</template>
|
|
|
</el-table-column>
|
|
|
<el-table-column
|
|
@@ -81,7 +113,7 @@
|
|
|
width="160"
|
|
|
label="独立项分值">
|
|
|
<template slot-scope="scope">
|
|
|
- <el-input v-model="scope.row.score" placeholder=""></el-input>
|
|
|
+ <el-input v-model="scope.row.score" placeholder="" ></el-input>
|
|
|
</template>
|
|
|
</el-table-column>
|
|
|
<el-table-column
|
|
@@ -98,7 +130,7 @@
|
|
|
</el-form>
|
|
|
</el-row>
|
|
|
</div>
|
|
|
- <div class="drawer__panel">
|
|
|
+ <!-- <div class="drawer__panel">
|
|
|
<el-row>
|
|
|
<el-form ref="form" size="mini" label-position="right">
|
|
|
<el-col :span="22">
|
|
@@ -110,61 +142,34 @@
|
|
|
<el-table
|
|
|
:data="associatedData"
|
|
|
border
|
|
|
- style="width: 100%">
|
|
|
+ style="width: 100%"
|
|
|
+ :span-method="oldData.length > 0? arraySpanMethod:noop"
|
|
|
+ @row-click="rowClick">
|
|
|
<el-table-column
|
|
|
v-if="form.onparties"
|
|
|
- prop="optionname"
|
|
|
+ prop="value"
|
|
|
label="客户对象"
|
|
|
>
|
|
|
- <template slot-scope="scope">
|
|
|
- <span>{{scope.row}}</span>
|
|
|
- </template>
|
|
|
</el-table-column>
|
|
|
<el-table-column
|
|
|
v-if="form.onstage"
|
|
|
- prop="remarks"
|
|
|
+ prop="stagename"
|
|
|
label="项目阶段"
|
|
|
>
|
|
|
- <template slot-scope="scope">
|
|
|
- <div v-if="form.onparties">
|
|
|
- <div v-for="(item,index) in form.stage">
|
|
|
- <span>{{item}}</span>
|
|
|
- </div>
|
|
|
- </div>
|
|
|
- <div v-else>
|
|
|
- <span>{{scope.row}}</span>
|
|
|
- </div>
|
|
|
-
|
|
|
- </template>
|
|
|
</el-table-column>
|
|
|
<el-table-column
|
|
|
- v-if="form.onparties || form.onstage"
|
|
|
prop="score"
|
|
|
label="分值">
|
|
|
- <template slot-scope="scope">
|
|
|
- <div v-if="form.onparties">
|
|
|
- <div v-for="(item,index) in form.parties">
|
|
|
- <template slot-scope="scope">
|
|
|
- <el-input v-model="scope.row" placeholder=""></el-input>
|
|
|
- </template>
|
|
|
- </div>
|
|
|
- </div>
|
|
|
- <div v-else-if="form.onstage">
|
|
|
- <div v-for="(item,index) in form.stage">
|
|
|
- <template slot-scope="scope">
|
|
|
- <el-input v-model="scope.row" placeholder=""></el-input>
|
|
|
- </template>
|
|
|
- </div>
|
|
|
- </div>
|
|
|
-
|
|
|
- </template>
|
|
|
+ <template slot-scope="scope">
|
|
|
+ <el-input v-model="scope.row.score" placeholder=""></el-input>
|
|
|
+ </template>
|
|
|
</el-table-column>
|
|
|
</el-table>
|
|
|
</el-form-item>
|
|
|
</el-col>
|
|
|
</el-form>
|
|
|
</el-row>
|
|
|
- </div>
|
|
|
+ </div> -->
|
|
|
<div class="fixed__btn__panel">
|
|
|
<el-button size="small" @click="drawer = false" class="normal-btn-width">取 消</el-button>
|
|
|
<el-button size="small" type="primary" @click="onSubmit" class="normal-btn-width">确 定</el-button>
|
|
@@ -174,8 +179,8 @@
|
|
|
</template>
|
|
|
|
|
|
<script>
|
|
|
-import AssociateCustomerObject from '@/HDrpManagement/projectTask/modules/AssociateCustomerObject'
|
|
|
-import AssociatedProjectPhases from '@/HDrpManagement/projectTask/modules/AssociatedProjectStage'
|
|
|
+import AssociateCustomerObject from '@/HDrpManagement/projectTask/modules/AssociateCustomerObject.vue'
|
|
|
+import AssociatedProjectPhases from '@/HDrpManagement/projectTask/modules/AssociatedProjectStage.vue'
|
|
|
export default {
|
|
|
name: "add",
|
|
|
components:{AssociateCustomerObject,AssociatedProjectPhases},
|
|
@@ -191,14 +196,13 @@ export default {
|
|
|
"important": '0',
|
|
|
"onparties": false,
|
|
|
"onstage": false,
|
|
|
- "parties": [],
|
|
|
- "stage": [],
|
|
|
"projtaskmag_options": [
|
|
|
{
|
|
|
"sa_projtaskmag_optionsid": 0,
|
|
|
"optionname": "",
|
|
|
"remarks": "",
|
|
|
"score": 0,
|
|
|
+ "index":0,
|
|
|
"projtaskmag_optionscore": [
|
|
|
{
|
|
|
"sa_projtaskmag_optionscoreid":0,
|
|
@@ -214,7 +218,12 @@ export default {
|
|
|
taskname: [
|
|
|
{ required: true, message: '请输入工作任务', trigger: 'blur' }
|
|
|
],
|
|
|
- }
|
|
|
+ },
|
|
|
+ oldData:[],
|
|
|
+ oldstage:[],
|
|
|
+ expands:[],
|
|
|
+ showChildTable:true,
|
|
|
+ nowIndex:0
|
|
|
}
|
|
|
},
|
|
|
methods:{
|
|
@@ -222,24 +231,74 @@ export default {
|
|
|
this.drawer = true
|
|
|
},
|
|
|
selectObject(val){
|
|
|
- this.form.parties = val
|
|
|
- if (this.form.onparties && this.form.onstage){
|
|
|
- this.associatedData = this.form.parties
|
|
|
- }else if(this.form.onparties){
|
|
|
- this.associatedData = this.form.parties
|
|
|
- }else if(this.form.onstage){
|
|
|
- this.associatedData = this.form.stage
|
|
|
+ val.length === 0?this.form.onparties = 0:""
|
|
|
+ this.oldData = val
|
|
|
+ if (this.oldstage.length > 0) {
|
|
|
+ this.selectStage(this.oldstage)
|
|
|
+ } else {
|
|
|
+ this.associatedData = this.oldData.sort()
|
|
|
}
|
|
|
+ this.refreChildTable()
|
|
|
},
|
|
|
selectStage(val){
|
|
|
- this.form.stage = val
|
|
|
- if (this.form.onparties && this.form.onstage){
|
|
|
- this.associatedData = this.form.parties
|
|
|
- }else if(this.form.onparties){
|
|
|
- this.associatedData = this.form.parties
|
|
|
- }else if(this.form.onstage){
|
|
|
- this.associatedData = this.form.stage
|
|
|
+ val.length === 0?this.form.onstage = 0:""
|
|
|
+ let arr = []
|
|
|
+ this.oldstage = val
|
|
|
+
|
|
|
+ if (this.oldData.length === 0) {
|
|
|
+ this.associatedData = val.map(e=>{
|
|
|
+ return {
|
|
|
+ partiestype:'',
|
|
|
+ stagename:e.stagename,
|
|
|
+ sa_projstagemagid:e.sa_projstagemagid
|
|
|
+ }
|
|
|
+ })
|
|
|
+ } else {
|
|
|
+ if (this.oldstage.length > 0) {
|
|
|
+ this.oldData.forEach(e=>{
|
|
|
+ val.forEach(vl=>{
|
|
|
+ arr.push({
|
|
|
+ partiestype:e.partiestype,
|
|
|
+ stagename:vl.stagename,
|
|
|
+ sa_projstagemagid:vl.sa_projstagemagid
|
|
|
+ })
|
|
|
+ })
|
|
|
+ })
|
|
|
+ this.associatedData = arr.sort()
|
|
|
+ } else {
|
|
|
+ this.associatedData = this.oldData.sort()
|
|
|
+ }
|
|
|
}
|
|
|
+ this.refreChildTable()
|
|
|
+ },
|
|
|
+ inputChange (index) {
|
|
|
+ this.form.projtaskmag_options[index].projtaskmag_optionscore = this.associatedData
|
|
|
+ this.$set(this.form.projtaskmag_options,index,this.form.projtaskmag_options[index])
|
|
|
+ console.log(this.form.projtaskmag_options[index].projtaskmag_optionscore)
|
|
|
+ },
|
|
|
+ onPartiesChange (val) {
|
|
|
+ this.$refs.onparties.drawer = val
|
|
|
+ val?'':this.oldData = []
|
|
|
+ val?'':this.associatedData = []
|
|
|
+ val?'':this.associatedData = this.oldstage.map(e=>{
|
|
|
+ return {
|
|
|
+ partiestype:'',
|
|
|
+ stagename:e.stagename,
|
|
|
+ sa_projstagemagid:e.sa_projstagemagid
|
|
|
+ }
|
|
|
+ })
|
|
|
+ this.refreChildTable()
|
|
|
+ },
|
|
|
+ onOnstageChange (val) {
|
|
|
+ this.$refs.onstage.drawer = val
|
|
|
+ val?'':this.associatedData = this.oldData.map(e=>{
|
|
|
+ return {
|
|
|
+ partiestype:e.partiestype,
|
|
|
+ stagename:'',
|
|
|
+ sa_projstagemagid:e.sa_projstagemagid
|
|
|
+ }
|
|
|
+ })
|
|
|
+ this.refreChildTable()
|
|
|
},
|
|
|
onSubmit(){
|
|
|
if (this.form.onstage){
|
|
@@ -252,7 +311,8 @@ export default {
|
|
|
}else {
|
|
|
this.form.onparties = 0
|
|
|
}
|
|
|
- console.log(this.form)
|
|
|
+ console.log(this.form.projtaskmag_options)
|
|
|
+ this.form.stage
|
|
|
/*this.$refs.formData.validate(async(valid)=>{
|
|
|
if (!valid) return false
|
|
|
const res = await this.$api.requested({
|
|
@@ -299,14 +359,8 @@ export default {
|
|
|
"optionname": "",
|
|
|
"remarks": "",
|
|
|
"score": 0,
|
|
|
- "projtaskmag_optionscore": [
|
|
|
- {
|
|
|
- "sa_projtaskmag_optionscoreid":0,
|
|
|
- "partiestype": "",
|
|
|
- "sa_projstagemagid": '',
|
|
|
- "score": ''
|
|
|
- }
|
|
|
- ]
|
|
|
+ "index":this.form.projtaskmag_options.length,
|
|
|
+ "projtaskmag_optionscore": this.associatedData
|
|
|
})
|
|
|
},
|
|
|
onClose(){
|
|
@@ -337,41 +391,78 @@ export default {
|
|
|
},
|
|
|
]
|
|
|
}
|
|
|
- }
|
|
|
- },
|
|
|
- mounted() {
|
|
|
- if (this.form.onparties && this.form.onstage){
|
|
|
- this.associatedData = this.form.parties
|
|
|
- }else if(this.form.onparties){
|
|
|
- this.associatedData = this.form.parties
|
|
|
- }else if(this.form.onstage){
|
|
|
- this.associatedData = this.form.stage
|
|
|
- }
|
|
|
- },
|
|
|
- watch:{
|
|
|
- "form.onparties":function (val){
|
|
|
- if (!val){
|
|
|
- this.form.parties = []
|
|
|
- this.associatedData = this.form.stage
|
|
|
- }else if (val && this.form.onstage){
|
|
|
- console.log(this.form)
|
|
|
- this.associatedData = this.form.parties
|
|
|
- this.$refs.onparties.drawer = true
|
|
|
- }else if (val){
|
|
|
- this.$refs.onparties.drawer = true
|
|
|
+ },
|
|
|
+ arraySpanMethod({ row, column, rowIndex, columnIndex }) {
|
|
|
+ // 合并行列产品名字相同合并(计算组长度以内的列,需要进行合并操作的列)
|
|
|
+ let mergeLength = 1;//需要进行横纵合并的列
|
|
|
+ if (columnIndex < mergeLength) {
|
|
|
+ let finArray = [1,1];
|
|
|
+ // 处理行数据
|
|
|
+ let cgname = Object.keys(row)[columnIndex]
|
|
|
+ console.log(cgname,'---')
|
|
|
+ // let cgname = 'value'
|
|
|
+ if(rowIndex === 0 || row[cgname] !== this.associatedData[rowIndex-1][cgname]){
|
|
|
+ let rowspan = 1;
|
|
|
+ //计算需要进行合并操作的行
|
|
|
+ for(let i=0; i<this.associatedData.length-1; i++){
|
|
|
+ // 只合并连续的
|
|
|
+ if(this.associatedData[i][cgname] === row[cgname] && this.associatedData[i+1][cgname] === row[cgname]){
|
|
|
+ rowspan ++;
|
|
|
+ }
|
|
|
+ }
|
|
|
+ finArray[0] = rowspan;
|
|
|
+ }else {
|
|
|
+ finArray[0] = 0;
|
|
|
+ }
|
|
|
+
|
|
|
+ // 处理列数据
|
|
|
+ let colkeys = Object.keys(row);
|
|
|
+ let cgvalue = Object.values(row)[columnIndex]
|
|
|
+ if(columnIndex ===0 || row[colkeys[columnIndex-1]] !== row[colkeys[columnIndex]]){
|
|
|
+ let colspan = 1;
|
|
|
+ //计算需要进行合并操作的列
|
|
|
+ for(let i=columnIndex; i<mergeLength; i++) {
|
|
|
+ // 只合并连续的
|
|
|
+ if (row[colkeys[i]]===cgvalue && row[colkeys[i+1]]===cgvalue && i+1<mergeLength) {
|
|
|
+ colspan ++;
|
|
|
+ }
|
|
|
+ }
|
|
|
+ finArray[1] = colspan;
|
|
|
+ } else {
|
|
|
+ finArray[1] = 0;
|
|
|
+ }
|
|
|
+ return finArray
|
|
|
}
|
|
|
},
|
|
|
- "form.onstage":function (val){
|
|
|
- if (!val){
|
|
|
- this.form.stage = []
|
|
|
- this.associatedData = this.form.parties
|
|
|
- }else if (val && this.form.onparties){
|
|
|
- this.associatedData = this.form.parties
|
|
|
- this.$refs.onstage.drawer = true
|
|
|
- }else if (val){
|
|
|
- this.$refs.onstage.drawer = true
|
|
|
+ noop(){},
|
|
|
+ expandChange (row, expandedRows) {
|
|
|
+ var that = this
|
|
|
+
|
|
|
+ that.nowIndex = row.index
|
|
|
+
|
|
|
+ that.associatedData = that.form.projtaskmag_options[row.index].projtaskmag_optionscore
|
|
|
+
|
|
|
+ if (expandedRows.length>1) {
|
|
|
+ that.expands = []
|
|
|
+ if (row) {
|
|
|
+ that.expands.push(row);
|
|
|
+ }
|
|
|
+ this.$refs.refTable.toggleRowExpansion(expandedRows[0]);
|
|
|
+ } else {
|
|
|
+ that.expands = [];
|
|
|
}
|
|
|
+ },
|
|
|
+ refreChildTable () {
|
|
|
+ this.showChildTable = false
|
|
|
+ setTimeout(() => {
|
|
|
+ this.showChildTable = true
|
|
|
+ }, 100);
|
|
|
+ },
|
|
|
+ cellClick (row, column, cell, event) {
|
|
|
+ console.log(row, column, cell, event)
|
|
|
}
|
|
|
+ },
|
|
|
+ mounted() {
|
|
|
}
|
|
|
}
|
|
|
</script>
|