From 082b572b91abd0d5ae8e409714553130448aa6d1 Mon Sep 17 00:00:00 2001 From: 张涛 <“2538313560@qq.com”> Date: 星期五, 30 八月 2024 17:25:44 +0800 Subject: [PATCH] fix:薪资调整 --- src/components/makepager/TableCommonView.vue | 236 ++++++++++++++++++++++------------------------------------- 1 files changed, 88 insertions(+), 148 deletions(-) diff --git a/src/components/makepager/TableCommonView.vue b/src/components/makepager/TableCommonView.vue index b551d67..ff277b3 100644 --- a/src/components/makepager/TableCommonView.vue +++ b/src/components/makepager/TableCommonView.vue @@ -1,55 +1,25 @@ <!-- eslint-disable vue/no-use-v-if-with-v-for --> <template> <div class="table-view" v-loading="loading"> - <el-table - ref="table" - border - :data="tableList.tableInfomation" - tooltip-effect="dark" - :height="'calc(100% - 0px)'" - :max-height="tableList.maxHeight" - style="width: 100%" - :lazy="tableList.lazy" - :show-summary="showSummary.show" - :summary-method="getSummaries" - :span-method="arraySpanMethod" - :class="tableList.headerHeight?'table-height-47px':''" - @selection-change="handleSelectionChange" - :header-cell-style="{ background: '#f1f3f8', height:tableList.headerHeight?tableList.headerHeight:'37px',color: '#000009', 'font-size': '12px', 'font-family': 'PingFangSC' }" - size="mini" - @row-click="tableRowClick" - :row-class-name="tableRowClassName" - > + <el-table ref="table" border :data="tableList.tableInfomation" tooltip-effect="dark" :height="'calc(100% - 0px)'" + :max-height="tableList.maxHeight" style="width: 100%" :lazy="tableList.lazy" :show-summary="showSummary.show" + :summary-method="getSummaries" :span-method="arraySpanMethod" + :class="tableList.headerHeight ? 'table-height-47px' : ''" @selection-change="handleSelectionChange" + :header-cell-style="{ background: '#f1f3f8', height: tableList.headerHeight ? tableList.headerHeight : '37px', color: '#000009', 'font-size': '12px', 'font-family': 'PingFangSC' }" + size="mini" @row-click="tableRowClick" :row-class-name="tableRowClassName"> <el-table-column v-if="selectBox" type="selection" width="40" :selectable="selectable"> </el-table-column> - <el-table-column - v-if="tableList.selectIndex" - type="index" - label="搴忓彿" - width="50" - :fixed="tableList.isFixed" - ></el-table-column> - <el-table-column - v-for="(item, i) in tableList.tableColumn" - :key="i" - :prop="item.prop" - :label="item.label" - :width="item.width" - :min-width="item.min" - show-overflow-tooltip - :sortable="item.sortable" - :fixed="item.fixed" - v-if="item.isShowColumn" - > - - <template slot="header"> + <el-table-column v-if="tableList.selectIndex" type="index" label="搴忓彿" width="50" + :fixed="tableList.isFixed"></el-table-column> + <el-table-column v-for="(item, i) in tableColumn" :key="i" :prop="item.prop" :label="item.label" + :width="item.width" :min-width="item.min" show-overflow-tooltip :sortable="item.sortable" :fixed="item.fixed" + v-if="item.isShowColumn"> + + <template slot="header"> {{ item.label }} - <div v-if="item.weekDay">{{item.weekDay}}</div> + <div v-if="item.weekDay">{{ item.weekDay }}</div> <span v-if="item.iconRight"> - <i - :class="item.iconRight" - style="font-size: 16px; margin-left: 5px; cursor: pointer" - @click="handleShow(item)" - ></i> + <i :class="item.iconRight" style="font-size: 16px; margin-left: 5px; cursor: pointer" + @click="handleShow(item)"></i> </span> </template> <template slot-scope="scope"> @@ -64,51 +34,27 @@ scope.row[item.prop] }}</span> <span v-else-if="item.isFirst">{{ scope.row[item.prop] ? "鏄�" : "鍚�" }}</span> - <span - v-else-if="item.isSalesLeadClick && scope.row[item.prop]" - class="sel-name" - @click="selSalesLeadClick(scope.row)" - >{{ scope.row[item.prop] }}</span - > - <span - v-else-if="item.isClientClick && scope.row[item.prop]" - class="sel-name" - @click="selClientClick(scope.row)" - >{{ scope.row[item.prop] ? scope.row[item.prop] : "--" }}</span - > - <span - v-else-if="item.isContactClick && scope.row[item.prop]" - class="sel-name" - @click="selContactsClick(scope.row)" - >{{ scope.row[item.prop] }}</span - > - <span - v-else-if="item.isMasterClick && scope.row[item.prop]" - class="sel-name" - @click="selMasterClick(scope.row)" - >{{ scope.row[item.prop] }}</span - > - <span - v-else-if="item.isServiceOrder && scope.row[item.prop]" - class="sel-name" - @click="selServiceOrderClick(scope.row)" - >{{ scope.row[item.prop] }}</span - > - <span - v-else-if="item.isCommonClick && scope.row[item.prop]" - class="sel-name" - @click="selCommonClick(scope.row,item.prop,item)" - > + <span v-else-if="item.isSalesLeadClick && scope.row[item.prop]" class="sel-name" + @click="selSalesLeadClick(scope.row)">{{ scope.row[item.prop] }}</span> + <span v-else-if="item.isClientClick && scope.row[item.prop]" class="sel-name" + @click="selClientClick(scope.row)">{{ scope.row[item.prop] ? scope.row[item.prop] : "--" }}</span> + <span v-else-if="item.isContactClick && scope.row[item.prop]" class="sel-name" + @click="selContactsClick(scope.row)">{{ scope.row[item.prop] }}</span> + <span v-else-if="item.isMasterClick && scope.row[item.prop]" class="sel-name" + @click="selMasterClick(scope.row)">{{ scope.row[item.prop] }}</span> + <span v-else-if="item.isServiceOrder && scope.row[item.prop]" class="sel-name" + @click="selServiceOrderClick(scope.row)">{{ scope.row[item.prop] }}</span> + <span v-else-if="item.isCommonClick && scope.row[item.prop]" class="sel-name" + @click="selCommonClick(scope.row, item.prop, item)"> <div v-if="item.isCallMethod"> <span :class="item.isClass ? item.getClassName(scope.row[item.prop], scope.row) : ''"> - - <span v-if="item.isIcon" v-html="item.getCallMethod(scope.row[item.prop], scope.row)"></span> - <span v-else>{{ item.getCallMethod(scope.row[item.prop], scope.row) }}</span> + + <span v-if="item.isIcon" v-html="item.getCallMethod(scope.row[item.prop], scope.row)"></span> + <span v-else>{{ item.getCallMethod(scope.row[item.prop], scope.row) }}</span> </span> </div> - <span v-else>{{ scope.row[item.prop] }}</span> - </span - > + <span v-else>{{ scope.row[item.prop] }}</span> + </span> <div v-else-if="item.isProductName" class="product-view"> <ul v-if="scope.row.products && scope.row.products.length > 0"> <li v-for="(item, index) in scope.row.products" :key="index"> @@ -156,37 +102,16 @@ }}</span> </div> <div v-else-if="item.isEditTd"> - <template - v-if="scope.row[item.prop+'editType']=='inputFloat'" - > - <el-input-number - v-model="scope.row[item.prop]" - placeholder="璇疯緭鍏�" - :min="0" - :precision="2" - :controls="false" - size="mini" - style="width: calc(100% - 80px); margin-right: 5px" - @change=" - (val) => { - commonInputChange(val, item.prop, scope.row, scope) - } - " - ></el-input-number> - <el-button - type="text" - @click="saveEditShow(item.prop, scope.row, scope)" - >淇濆瓨</el-button - > - </template> - <span v-else> - {{ scope.row[item.prop] }} - <i - class="el-icon-edit" - style="font-size: 16px; margin-left: 5px; cursor: pointer" - @click="handleEditShow(scope.row,scope,item)" - ></i> - </span> + <template v-if="scope.row[item.prop + 'editType'] == 'inputFloat'"> + <el-input-number v-model="scope.row[item.prop]" placeholder="璇疯緭鍏�" :min="0" :precision="2" + :controls="false" size="mini" style="width: calc(100% - 80px); margin-right: 5px"></el-input-number> + <el-button type="text" @click="saveEditShow(item.prop, scope.row, scope)">淇濆瓨</el-button> + </template> + <span v-else> + {{ scope.row[item.prop] }} + <i class="el-icon-edit" style="font-size: 16px; margin-left: 5px; cursor: pointer" + @click="handleEditShow(scope.row, scope, item)"></i> + </span> </div> <span v-else>{{ scope.row[item.prop] ? scope.row[item.prop] : "--" }}</span> </template> @@ -201,7 +126,7 @@ <div class="styleBtn"> <i @click="checkCol()" class="label">...</i> <el-checkbox-group v-model="showcol" v-show="iscolopen" class="checkbox-group" @change="selectCheckBoxList"> - <el-checkbox v-for="item in tableList.allcol" :label="item" :key="item">{{ item }} </el-checkbox> + <el-checkbox v-for="item in tableList.allcol" :label="item" :key="item">{{ item }} </el-checkbox> </el-checkbox-group> </div> </div> @@ -261,6 +186,7 @@ data() { return { iscolopen: false, + tableColumn: [], showcol: [] } }, @@ -272,28 +198,23 @@ }, immediate: true }, + "tableList.tableColumn": { + handler(newVal) { + this.tableColumn = newVal + }, + immediate: true + }, }, methods: { // 琛ㄦ牸缂栬緫 - handleEditShow(row,scope,item){ - scope.row[item.prop+'editType']=='inputFloat' - this.$set(this.tableList.tableInfomation[scope.$index],item.prop+'editType','inputFloat') + handleEditShow(row, scope, item) { + console.log('item', item) + scope.row[item.prop + 'editType'] == 'inputFloat' + this.$set(this.tableList.tableInfomation[scope.$index], item.prop + 'editType', 'inputFloat') this.$forceUpdate() }, - commonInputChange(val, prop, row, scope) { - // if (row.editType=='inputFloat') { - // let value = scope.row[prop] - // let reg2 = /(^[1-9]([0-9]+)?(\.[0-9]{1,2})?$)|(^(0){1}$)|(^[0-9]\.[0-9]([0-9])?$)/ - // if (!reg2.test(value) || value == 0) { - // this.$message.error("闇�瑕佸~鍐欏ぇ浜�0鐨�2浣嶅皬鏁帮紒") - // return true - // } - // this.$forceUpdate() - // } - this.$emit("inputContent", val, prop, row, scope) - }, - saveEditShow( prop, row, scope){ - if (row.editType=='inputFloat') { + saveEditShow(prop, row, scope) { + if (row.editType == 'inputFloat') { let value = scope.row[prop] let reg2 = /(^[1-9]([0-9]+)?(\.[0-9]{1,2})?$)|(^(0){1}$)|(^[0-9]\.[0-9]([0-9])?$)/ if (!reg2.test(value) || value == 0) { @@ -302,6 +223,7 @@ } this.$forceUpdate() } + this.$set(this.tableList.tableInfomation[scope.$index], prop + 'editType', '') this.$emit("inputContent", prop, row, scope) }, onMaskClick() { @@ -474,8 +396,8 @@ this.$emit("selServiceOrderClick", row) }, // 鍏叡锛堥攢鍞満浼氥�佹姤浠峰崟銆侀攢鍞�诲崟銆侀攢鍞瓙鍗曘�傘�傘�傦級 - selCommonClick(row,prop,item) { - this.$emit("selCommonClick", row,prop,item) + selCommonClick(row, prop, item) { + this.$emit("selCommonClick", row, prop, item) }, // 琛岀偣鍑� tableRowClick(row, column, event) { @@ -511,6 +433,7 @@ .table-view { position: relative; height: 100%; + .blue { width: 70px; text-align: center; @@ -518,34 +441,42 @@ background-color: $color-primary; border-radius: 4px; } + .sel-name { color: $color-primary; cursor: pointer; } + .product-view { // background: #cc7d7d; margin-left: -10px; margin-right: -11px; + li { height: 22px; line-height: 22px; + .name-view { padding-left: 10px; border-bottom: 1px solid #ebeef5; } + .no-bottom { border-bottom: 0; } } + li:last-child .name-view { border-bottom: none; } + .no-product { height: 22px; line-height: 22px; } } } + ::v-deep { .el-table__footer-wrapper { tbody td.el-table__cell { @@ -553,20 +484,25 @@ font-weight: bold; } } - .el-table__fixed{ - height:calc(100% - 8px)!important; + + .el-table__fixed { + height: calc(100% - 8px) !important; } - .el-table__fixed-body-wrapper{ - top:37px!important; + + .el-table__fixed-body-wrapper { + top: 37px !important; } - .table-height-47px .el-table__fixed-body-wrapper{ - top:47px!important; + + .table-height-47px .el-table__fixed-body-wrapper { + top: 47px !important; } - .el-table__body-wrapper{ - height:calc(100% - 38px)!important; + + .el-table__body-wrapper { + height: calc(100% - 38px) !important; } - .table-height-47px .el-table__body-wrapper{ - height:calc(100% - 48px)!important; + + .table-height-47px .el-table__body-wrapper { + height: calc(100% - 48px) !important; } } @@ -575,12 +511,14 @@ line-height: 17px; font-family: PingFangSC; color: rgba(0, 0, 0, 0.9); + .el-button--text { width: auto; height: auto; font-family: PingFangSC-Medium, sans-serif; } } + ::v-deep .el-table .el-table__cell { padding: 6px 0 !important; height: 35px; @@ -618,6 +556,7 @@ top: 0; right: -6px; z-index: 11; + .label { position: absolute; top: 6px; @@ -627,6 +566,7 @@ color: #000; transform: rotate(-90deg); } + .checkbox-group { width: 160px; height: 300px; -- Gitblit v1.8.0