|
@@ -95,18 +95,24 @@
|
|
|
<el-table
|
|
|
:data='constructions'
|
|
|
:height='350'
|
|
|
+ :cell-class-name='addClass'
|
|
|
+ :span-method='objectSpanMethod'
|
|
|
+ border
|
|
|
style='font-size:12px'
|
|
|
:header-cell-style='{background:"rgba(245,246,247,1)",fontFamily:"MicrosoftYaHei",color:"rgba(100,108,115,1)",lineHeight:"16px",fontSize:"12px"}'
|
|
|
v-loading='loading'
|
|
|
>
|
|
|
- <el-table-column label='序号' width='50' type='index' align='left'></el-table-column>
|
|
|
- <el-table-column label='专业' width='70' prop='professional'>
|
|
|
+ <el-table-column label='序号' width='45' type='index' align='left'></el-table-column>
|
|
|
+ <el-table-column label='总包/分包' prop='type' width='80' align='center'>
|
|
|
+ <template slot-scope='{row}'>{{row.type||'--'}}</template>
|
|
|
+ </el-table-column>
|
|
|
+ <el-table-column label='专业' width='60' prop='professional'>
|
|
|
<template slot-scope='{row}'>{{row.professional||'--'}}</template>
|
|
|
</el-table-column>
|
|
|
<el-table-column prop='unit ' label='施工单位'>
|
|
|
<template slot-scope='{row}'>{{row.unit ||'--'}}</template>
|
|
|
</el-table-column>
|
|
|
- <el-table-column label='联系人' prop width='65' :show-overflow-tooltip='true'>
|
|
|
+ <el-table-column label='联系人' prop width='60' :show-overflow-tooltip='true'>
|
|
|
<template slot-scope='{row}'>{{row.lxr||'--'}}</template>
|
|
|
</el-table-column>
|
|
|
<el-table-column prop='phone' label='联系电话' width='110'>
|
|
@@ -202,10 +208,101 @@ export default {
|
|
|
build: {}, //左下信息
|
|
|
constructions: [], //右下数组
|
|
|
shuzihuayijiao: '',
|
|
|
- va: ''
|
|
|
+ va: '',
|
|
|
+ spanArr: [], //二维数组,用于存放单元格合并规则
|
|
|
+ position: 0 //用于存储相同项的开始index
|
|
|
}
|
|
|
},
|
|
|
methods: {
|
|
|
+ addClass({ columnIndex }) {
|
|
|
+ if (columnIndex === 4) {
|
|
|
+ return 'contact'
|
|
|
+ }
|
|
|
+ },
|
|
|
+ objectSpanMethod({ row, column, rowIndex, columnIndex }) {
|
|
|
+ for (let i = 1; i <= 5; i++) {
|
|
|
+ if (columnIndex === i) {
|
|
|
+ const _row = this.spanArr[i][rowIndex]
|
|
|
+ const _col = _row > 0 ? 1 : 0
|
|
|
+ // console.log('第'+rowIndex+'行','第'+i+'列','rowspan:'+_row,'colspan:'+_col)
|
|
|
+ return {
|
|
|
+ rowspan: _row,
|
|
|
+ colspan: _col
|
|
|
+ }
|
|
|
+ }
|
|
|
+ }
|
|
|
+ },
|
|
|
+ /**
|
|
|
+ * 返回的数据处理
|
|
|
+ */
|
|
|
+ handelTableData(data) {
|
|
|
+ let dict = {
|
|
|
+ 总包: 0,
|
|
|
+ 分包: 1
|
|
|
+ }
|
|
|
+ data = data.sort((a, b) => {
|
|
|
+ // 按总分包排序
|
|
|
+ if (a.type !== b.type) {
|
|
|
+ return dict[a.type] - dict[b.type]
|
|
|
+ }
|
|
|
+ // 按专业排序
|
|
|
+ if (a.professional !== b.professional) {
|
|
|
+ return b.professional.localeCompare(a.professional)
|
|
|
+ }
|
|
|
+ // 按施工单位排序
|
|
|
+ if (a.unit !== b.unit) {
|
|
|
+ return b.unit.localeCompare(a.unit)
|
|
|
+ }
|
|
|
+ // 按联系人排序
|
|
|
+ if (a.lxr !== b.lxr) {
|
|
|
+ return b.lxr.localeCompare(a.lxr)
|
|
|
+ }
|
|
|
+ })
|
|
|
+ data.map(item => {
|
|
|
+ console.log(item)
|
|
|
+ // return
|
|
|
+ if (item.lxr) {
|
|
|
+ let lxr = item.lxr.split(',').join('\n\r')
|
|
|
+ item.lxr = lxr
|
|
|
+ }
|
|
|
+
|
|
|
+ return item
|
|
|
+ })
|
|
|
+ return data
|
|
|
+ },
|
|
|
+ rowspan(idx, prop) {
|
|
|
+ // 第一列 总包合并一格,分包按照 第二列专业的单元格规则进行合并
|
|
|
+ if (idx === 1) {
|
|
|
+ // 初始化数组
|
|
|
+ this.spanArr[1] = new Array(this.constructions.length).fill(0)
|
|
|
+ let totalTypeLen = this.constructions.filter(a => a.type === '总包').length
|
|
|
+ this.spanArr[1][0] = totalTypeLen
|
|
|
+ this.spanArr[1] = this.spanArr[1].map((item, index) => {
|
|
|
+ if (index > totalTypeLen - 1) {
|
|
|
+ item = this.spanArr[2][index]
|
|
|
+ }
|
|
|
+ return item
|
|
|
+ })
|
|
|
+ return true
|
|
|
+ }
|
|
|
+ // 其他列单元格合并规则
|
|
|
+ this.spanArr[idx] = []
|
|
|
+ this.position = 0
|
|
|
+ this.constructions.forEach((item, index) => {
|
|
|
+ if (index === 0) {
|
|
|
+ this.spanArr[idx].push(1)
|
|
|
+ this.position = 0
|
|
|
+ } else {
|
|
|
+ if (this.constructions[index][prop] === this.constructions[index - 1][prop]) {
|
|
|
+ this.spanArr[idx][this.position] += 1 //有相同项
|
|
|
+ this.spanArr[idx].push(0) // 名称相同后往数组里面加一项0
|
|
|
+ } else {
|
|
|
+ this.spanArr[idx].push(1) //同列的前后两行单元格不相同
|
|
|
+ this.position = index
|
|
|
+ }
|
|
|
+ }
|
|
|
+ })
|
|
|
+ },
|
|
|
scan(val) {
|
|
|
this.va = val
|
|
|
},
|
|
@@ -247,7 +344,19 @@ export default {
|
|
|
this.pic1 = res.pic1 ? res.pic1 : []
|
|
|
this.pic2 = res.pic2 ? res.pic2 : []
|
|
|
this.build = res.build ? res.build : {}
|
|
|
- this.constructions = res.constructions ? res.constructions : []
|
|
|
+ let constructions = []
|
|
|
+ constructions = res.constructions ? res.constructions : []
|
|
|
+ if (constructions.length > 0) {
|
|
|
+ // this.parseTableData(constructions)
|
|
|
+ let handleData = this.handelTableData(constructions)
|
|
|
+ this.constructions = handleData
|
|
|
+ this.rowspan(2, 'professional')
|
|
|
+ this.rowspan(3, 'unit')
|
|
|
+ this.rowspan(4, 'lxr')
|
|
|
+ this.rowspan(5, 'lxdh')
|
|
|
+ this.rowspan(1, 'type')
|
|
|
+ }
|
|
|
+ console.log(this.constructions)
|
|
|
this.shuzihuayijiao = res.shuzihuayijiao ? res.shuzihuayijiao : ''
|
|
|
if (res.plazaName) {
|
|
|
this.$store.commit('SETPLAZENAME', res.plazaName)
|
|
@@ -305,6 +414,12 @@ export default {
|
|
|
}
|
|
|
</script>
|
|
|
<style lang="less" scoped>
|
|
|
+.contact {
|
|
|
+ div {
|
|
|
+ word-break: break-all !important;
|
|
|
+ white-space: pre !important;
|
|
|
+ }
|
|
|
+}
|
|
|
@import '../../assets/css/rotation.less';
|
|
|
.overview {
|
|
|
.view-box .view-left {
|