From f4ed5ae8873f65c36b5cf37be264f6ec1e154647 Mon Sep 17 00:00:00 2001 From: zuozhengqing <a13193816592@163.com> Date: 星期三, 20 三月 2024 19:36:58 +0800 Subject: [PATCH] 合并分支冲突解决 --- src/components/makepager/TableCommonView.vue | 308 ++++++++++++++++++++++++++++++++------------------ 1 files changed, 195 insertions(+), 113 deletions(-) diff --git a/src/components/makepager/TableCommonView.vue b/src/components/makepager/TableCommonView.vue index 42f2469..50ac390 100644 --- a/src/components/makepager/TableCommonView.vue +++ b/src/components/makepager/TableCommonView.vue @@ -1,109 +1,140 @@ +<!-- eslint-disable vue/no-use-v-if-with-v-for --> <template> - <div class="table-view"> + <div class="table-view" v-loading="loading"> <el-table ref="table" border :data="tableList.tableInfomation" tooltip-effect="dark" - style="width: 100%" :height="'calc(100% - 0px)'" :max-height="tableList.maxHeight" + style="width: 100%" :lazy="tableList.lazy" - size="mini" + :show-summary="showSummary.show" + :summary-method="getSummaries" + :span-method="arraySpanMethod" @selection-change="handleSelectionChange" - :header-cell-style="{ background: '#f1f3f8', color: '#000009', 'font-size': '14px' }" - :highlight-current-row="tableList.highlight" - :row-class-name="tableRowClassName" + :header-cell-style="{ background: '#f1f3f8', color: '#000009', 'font-size': '12px', 'font-family': 'PingFangSC' }" + size="mini" @row-click="tableRowClick" - :row-key="tableList.key" - :default-expand-all="tableList.isDefaultExpandAll" - :tree-props="{ children: 'child', hasChildren: 'hasChildren' }" + :row-class-name="tableRowClassName" > - <el-table-column align="center" v-if="tableList.selectBox" type="selection" width="40"> </el-table-column> - <el-table-column align="center" v-if="tableList.selectIndex" type="index" label="搴忓彿" width="50"> - </el-table-column> - <template v-for="(item, i) in tableList.tableColumn"> - <el-table-column - align="center" - :key="i" - :prop="item.prop" - :label="item.label" - :width="item.width" - :min-width="item.min" - show-overflow-tooltip - :sortable="item.sortable" - v-if="item.isShowColumn" - > - <template slot-scope="scope"> - <span v-if="item.price">{{ "锟�" + number_format(scope.row[item.prop], 2, ".", ",") }}</span> - <div v-else-if="item.status" :class="scope.row.status">{{ scope.row[item.prop] }}</div> - <span v-else-if="item.isTime">{{ - dateFormat("YYYY-mm-dd HH:MM:SS", scope.row[item.prop]) === "1900-01-01 00:06:26" - ? "--" - : dateFormat("YYYY-mm-dd HH:MM:SS", scope.row[item.prop]) + <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"></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" + v-if="item.isShowColumn" + > + <template slot-scope="scope"> + <span v-if="item.price">{{ "锟�" + number_format(scope.row[item.prop], 2, ".", ",") }}</span> + <div v-else-if="item.status" :class="scope.row.status">{{ scope.row[item.prop] }}</div> + <span v-else-if="item.isTime">{{ + dateFormat("YYYY-mm-dd HH:MM:SS", scope.row[item.prop]) === "1900-01-01 00:06:26" + ? "--" + : dateFormat("YYYY-mm-dd HH:MM:SS", scope.row[item.prop]) + }}</span> + <span v-else-if="item.isClick && scope.row[item.prop]" class="sel-name" @click="selNameClick(scope.row)">{{ + 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)" + >{{ scope.row[item.prop] }}</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"> + <div class="name-view"> + {{ item.name }} + </div> + </li> + </ul> + <div v-else class="no-product">{{ "--" }}</div> + </div> + <div v-else-if="item.isProductAmount" 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"> + <div class="name-view"> + {{ item.amount }} + </div> + </li> + </ul> + <div v-else class="no-product">{{ "--" }}</div> + </div> + <div v-else-if="item.isProductPrice" 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"> + <div class="name-view"> + {{ item.price }} + </div> + </li> + </ul> + <div v-else class="no-product">{{ "--" }}</div> + </div> + <div v-else-if="item.isProductTotal" 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"> + <div class="name-view"> + {{ item.total }} + </div> + </li> + </ul> + <div v-else class="no-product">{{ "--" }}</div> + </div> + <!-- 璋冪敤鏂规硶鏄剧ず鏂囧瓧 --> + <div v-else-if="item.isCallMethod"> + <span :class="item.isClass ? item.getClassName(scope.row[item.prop], scope.row) : ''">{{ + item.getCallMethod(scope.row[item.prop], scope.row) }}</span> - <span - v-else-if="item.isClick && scope.row[item.prop]" - class="sel-name" - @click="selCommonClick(scope.row)" - >{{ scope.row[item.prop] }}</span - > - <span v-else-if="item.isFirst">{{ scope.row[item.prop] ? "鏄�" : "鍚�" }}</span> - <span - v-else-if="item.isCommonClick && scope.row[item.prop]" - class="sel-name" - @click="selCommonClick(scope.row)" - >{{ scope.row[item.prop] }}</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"> - <div :class="scope.row.products.length === 1 ? 'name-view no-bottom' : 'name-view'"> - {{ item.name }} - </div> - </li> - </ul> - <div v-else class="no-product">{{ "--" }}</div> - </div> - <div v-else-if="item.isProductAmount" 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"> - <div :class="scope.row.products.length === 1 ? 'name-view no-bottom' : 'name-view'"> - {{ item.amount }} - </div> - </li> - </ul> - <div v-else class="no-product">{{ "--" }}</div> - </div> - <div v-else-if="item.isProductPrice" 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"> - <div :class="scope.row.products.length === 1 ? 'name-view no-bottom' : 'name-view'"> - {{ item.price }} - </div> - </li> - </ul> - <div v-else class="no-product">{{ "--" }}</div> - </div> - <div v-else-if="item.isProductTotal" 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"> - <div :class="scope.row.products.length === 1 ? 'name-view no-bottom' : 'name-view'"> - {{ item.total }} - </div> - </li> - </ul> - <div v-else class="no-product">{{ "--" }}</div> - </div> - <span v-else>{{ scope.row[item.prop] ? scope.row[item.prop] : "--" }}</span> - </template> - </el-table-column> - </template> + </div> + <span v-else>{{ scope.row[item.prop] ? scope.row[item.prop] : "--" }}</span> + </template> + </el-table-column> <slot name="tableButton" /> <div slot="empty"> <el-empty description="鏆傛棤鏁版嵁"></el-empty> </div> </el-table> + <div class="overSpread1" v-show="iscolopen" @click="onMaskClick"></div> <div class="styleBtn"> <i @click="checkCol()" class="label">...</i> @@ -118,16 +149,18 @@ export default { name: "TableCommonView", props: { + selectBox: { + type: Boolean, + default: false + }, tableList: { type: Object, default: () => { return { - selectBox: false, - selectIndex: false, + selectIndex: true, tableInfomation: [], // 鎺ュ彛杩斿洖鏁版嵁 showcol: [], allcol: [], - highlight: false, tableColumn: [ // table琛ㄥ崟 { label: "", prop: "", min: 200, tooltip: true } @@ -141,8 +174,7 @@ return { show: false, sumProp: [], - mergeNumber: 1, - totalName: "鏈〉鎬昏" + mergeNumber: 1 } } }, @@ -152,14 +184,24 @@ default: () => { return {} } + }, + loading: { + type: Boolean, + default: false + }, + selectBoxList: { + type: Array, + default: () => [] } }, + data() { return { iscolopen: false, showcol: [] } }, + computed: {}, watch: { "tableList.showcol": { handler(newVal) { @@ -168,7 +210,6 @@ immediate: true } }, - computed: {}, methods: { onMaskClick() { this.iscolopen = false @@ -195,10 +236,16 @@ .querySelector(".el-table__footer") var cell = current.rows[0].cells for (let i = 0; i < this.showSummary.mergeNumber; i++) { - cell[i].style.display = "none" + cell[i] && cell[i].style && (cell[i].style.display = "none") } - cell[this.showSummary.mergeNumber].classList.remove("is-left") - cell[this.showSummary.mergeNumber].colSpan = this.showSummary.mergeNumber.toString() + if (cell[this.showSummary.mergeNumber]) { + if (cell[this.showSummary.mergeNumber].classList) { + cell[this.showSummary.mergeNumber].classList.remove("is-left") + } + if (cell[this.showSummary.mergeNumber].colSpan) { + cell[this.showSummary.mergeNumber].colSpan = this.showSummary.mergeNumber.toString() + } + } } }) } @@ -210,7 +257,7 @@ const sums = [] columns.forEach((column, index) => { if (index === this.showSummary.mergeNumber) { - sums[index] = this.showSummary.totalName + sums[index] = "鏈〉鎬昏" } const values = data.map((item) => Number(item[column.property])) if (this.showSummary.sumProp.includes(column.property)) { @@ -309,7 +356,31 @@ } return fmt }, - // 鍏叡璇︽儏 + // 鏂板缓缂栬緫閫夋嫨寮圭獥 + selNameClick(row) { + this.$emit("selCommonClick", row) + }, + // 閿�鍞嚎绱� + selSalesLeadClick(row) { + this.$emit("selSalesLeadClick", row) + }, + // 瀹㈡埛鍚嶇О + selClientClick(row) { + this.$emit("selClientClick", row) + }, + // 鑱旂郴浜哄鍚� + selContactsClick(row) { + this.$emit("selContactsClick", row) + }, + // 閿�鍞�诲崟 + selMasterClick(row) { + this.$emit("selMasterClick", row) + }, + // 瀹㈡埛鏈嶅姟鍗� + selServiceOrderClick(row) { + this.$emit("selServiceOrderClick", row) + }, + // 鍏叡锛堥攢鍞満浼氥�佹姤浠峰崟銆侀攢鍞�诲崟銆侀攢鍞瓙鍗曘�傘�傘�傦級 selCommonClick(row) { this.$emit("selCommonClick", row) }, @@ -325,6 +396,14 @@ } } this.$emit("tableRowClassName", row) + }, + selectable(row) { + let list = this.selectBoxList.map((item) => item.number) + if (list.findIndex((v) => v == row.number) == -1) { + return true + } else { + return false + } } } } @@ -333,9 +412,6 @@ <!-- Add "scoped" attribute to limit CSS to this component only --> <style lang="scss" scoped> .table-view { - // margin-top: 20px; - // margin-right: 10px; - // margin-bottom: 40px; position: relative; height: 100%; .blue { @@ -354,19 +430,22 @@ margin-left: -10px; margin-right: -11px; li { - height: 57px; - line-height: 57px; + height: 22px; + line-height: 22px; .name-view { padding-left: 10px; border-bottom: 1px solid #ebeef5; } .no-bottom { - border-bottom: 0px; + border-bottom: 0; } } + li:last-child .name-view { + border-bottom: none; + } .no-product { - height: 57px; - line-height: 57px; + height: 22px; + line-height: 22px; } } } @@ -400,9 +479,12 @@ .el-table .cell .el-button--text.el-button--small { padding: 4px 0; } - .el-table .onSelect { - background: #ebf2ff; - } +} + +::v-deep .el-table .el-table__cell { + padding: 6px 0 !important; + height: 35px; + text-align: center; } .overSpread1 { @@ -422,8 +504,8 @@ // line-height: 26px; // background: #06c062; top: 0; - right: 2px; - z-index: 9999; + right: -6px; + z-index: 11; .label { position: absolute; top: 6px; @@ -435,7 +517,7 @@ } .checkbox-group { width: 160px; - height: 330px; + height: 300px; overflow: auto; display: flex; flex-direction: column; -- Gitblit v1.8.0