Skip to content

V
vue-gjjs
Commit b1d5202b by wangyanjiao
Options

改变docpre样式，增加docdsclab 默认值

parent 88449725
Showing with 123 additions and 47 deletions
src/views/Business/Botdav/Ovwp.vue
......@@ -188,14 +188,11 @@
</c-table>
</c-col> -->
<c-docpre
:model="model"
:argadr="{
path:'bodgrp.blk.docpre',
grp: 'botp',
code:'docpre'
}"></c-docpre>
<c-docpre :model="model" :argadr="{
path: 'bodgrp.blk.docpre',
grp: 'botp',
code: 'docpre'
}"></c-docpre>
</c-col>
<!-- ====================右边======================= -->
......@@ -243,7 +240,7 @@ import Utils from "~/utils";
import Ptap from "~/views/Public/Ptap";
import Docpre from "~/views/Public/Docpre";
export default {
components: {
components: {
"c-ptap": Ptap,
"c-docpre": Docpre,
},
......
src/views/Public/Docpre.vue
<!-- 前后端字段path及前后端字段docgrdm.docgrd 后端docgrd为List<Docgrd>类型 -->
<template>
<div>
<c-col :span="24" style="height: 24px; margin-top: -10px">
<!-- <c-col :span="24" style="height: 24px; margin-top: -10px">
<el-form-item :label="model[argadr.grp].docgrdm.docdsclab" class="messageLabel">
<div v-if="ifShowAdd">
<c-button style="float: right" @click="addTableValue" type="primary">新增单据</c-button>
</div>
</el-form-item>
</c-col>
</c-col> -->
<c-col :span="24" style="margin-bottom: 30px;">
<el-form-item :prop="'${argadr.grp}.docgrdm.docgrd'" label="">
<c-table height="200px" style="text-align: center" :list="this.model[argadr.grp].docgrdm.docgrd || []"
:paginationShow="false" :border="true">
<el-table-column label="1st" width="auto" prop="cmail1">
<template slot-scope="scope">
<c-input v-model="scope.row.cmail1" @change="docpre" :disabled="disabledCmail1"
maxlength="12">
</c-input>
</template>
<el-form-item :prop="'${argadr.grp}.docgrdm.docgrd'" label="" style="margin-left:-150px;">
<c-table height="300px" style="text-align: center;" stripe
:list="this.model[argadr.grp].docgrdm.docgrd || []" :paginationShow="false" :border="true">
<el-table-column :label="model[argadr.grp].docgrdm.docdsclab || 'Documents Presented'" class="messageLabel">
<el-table-column label="1st" width="auto" prop="cmail1" background-color="red">
<template slot-scope="scope">
<c-input v-model="scope.row.cmail1" @change="docpre" :disabled="disabledCmail1"
maxlength="12">
</c-input>
</template>
</el-table-column>
<el-table-column label="2nd" width="auto" prop="cmail2">
<template slot-scope="scope">
<c-input v-model="scope.row.cmail2" @change="docpre" :disabled="disabledCmail2"
maxlength="12">
</c-input>
</template>
</el-table-column>
<el-table-column label="Document" width="180px" prop="docnam" >
<template slot-scope="scope">
<!-- {{scope.row.docnam}} -->
<c-select style="width: 100%" placeholder="请选择" v-model="scope.row.docnam"
:disabled="disabledDocnam">
<el-option v-for="item in codes[argadr.code]" :key="item.value" :label="item.label" @change="docpre"
:value="item.value">
</el-option>
</c-select>
</template>
</el-table-column>
<el-table-column label="操作" width="70px" fixed="right">
<template slot-scope="scope" >
<div v-if="ifShowDelete" >
<c-button style="margin-left:-5px" @click="deleteTable(scope.$index)" type="primary">删除</c-button>
</div>
</template>
</el-table-column>
<el-table-column label="2nd" width="auto" prop="cmail2">
<template slot-scope="scope">
<c-input v-model="scope.row.cmail2" @change="docpre" :disabled="disabledCmail2"
maxlength="12">
</c-input>
</template>
</el-table-column>
<el-table-column label="Document" prop="docnam" width="auto">
<template slot="header" slot-scope="scope">
<row>
<c-col :span="12">
<span style="line-height: 36px;">Document</span>
</c-col>
<c-col :span="12">
<div style="float: right;">
<span class="add_del_button add_button" @click="addTableValue">+</span>
<span class="add_del_button" @click="deleteTable">-</span>
</div>
</c-col>
</row>
</template>
<template slot-scope="scope">
<!-- {{scope.row.docnam}} -->
<c-select style="width: 100%" placeholder="请选择" v-model="scope.row.docnam"
:disabled="disabledDocnam">
<el-option v-for="item in codes[argadr.code]" :key="item.value" :label="item.label"
@change="docpre" :value="item.value">
</el-option>
</c-select>
</template>
</el-table-column>
</el-table-column>
</c-table>
</el-form-item>
</c-col>
</div>
</template>
<script>
......@@ -57,6 +67,7 @@ import Event from "~/model/Botdcr/Event"
import Utils from "~/utils";
export default {
inject: ["root"],
mixins: [commonProcess],
......@@ -122,6 +133,25 @@ export default {
methods: {
...Event,
setColSpan: function () {
// console.log(this.$el.getElementsByClassName("el-table__header"))
// 获取表头的所有单元格
var x = this.$el.getElementsByClassName("el-table__header")
console.log(x)
var x1 = this.$el.getElementsByClassName("el-table__header")[0].rows[1].cells
var x2 = this.$el.getElementsByClassName("el-table__header")[0].rows[0].cells
x1[2].colSpan = 2 // document
// 将gutter的display设为none
x1[3].style.display = 'none' //gutter
x2[0].colSpan = 4 // docdsclab
// x2[0].style.background-color = '#FFF'
// 将gutter的display设为none
x2[1].style.display = 'none' //gutter
},
addTableValue(index) {
var newTableValue = Object.assign({}, this.newValue);
const serial = Utils.generateUUID();
......@@ -132,7 +162,6 @@ export default {
},
deleteTable(index) {
// 'this.model.${argadr.grp}.docgrdm.docgrd.splice(index, 1)';
console.log("join function");
var grp = this.argadr.grp;
this.model[grp].docgrdm.docgrd.splice(index, 1);
},
......@@ -149,10 +178,17 @@ export default {
},
},
created: function () {
},
mounted() {
// 注意一定要保证DOM渲染完成后在进行合并操作，否则会找不到元素
this.$nextTick(function () {
this.setColSpan();
})
}
};
</script>
<style>
.messageLabel>>>.el-form-item__label {
......@@ -160,4 +196,46 @@ export default {
font-weight: bold;
font-size: 12px;
}
.add_del_button:hover {
cursor: pointer;
background-color: rgb(230, 227, 227);
}
.add_del_button {
display: block;
flex: 0;
line-height: 15px;
text-align: center;
font-size: 12px;
border-radius: 5px;
border: 1px solid rgb(194, 192, 192);
background-color: rgb(240, 240, 240);
}
.add_button {
margin-bottom: 2px;
}
/* body .el-table th.gutter {
display: table-cell !important;
height:0px;
font-weight: 0px;
border-bottom: 1px solid #bbb !important;
position: absolute;
right:0;
top: 0;
} */
/*
.gutter {
display: none;
width: 0px !important;
background: rgb(51, 51, 51);
}
tr {
background: rgb(51, 51, 51);
} */
</style>
\ No newline at end of file
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment