diff --git a/src/views/DataAnalyse/diagram/components/MultiChart.vue b/src/views/DataAnalyse/diagram/components/MultiChart.vue index b49e63d1..3765695f 100644 --- a/src/views/DataAnalyse/diagram/components/MultiChart.vue +++ b/src/views/DataAnalyse/diagram/components/MultiChart.vue @@ -169,6 +169,7 @@ export default defineComponent({ obj[key] = element.number; }); obj.option = item.option_title; + obj.rowGroupTitle = item.rowGroupTitle; return obj; }); tableSource.value = tableData; @@ -180,34 +181,116 @@ export default defineComponent({ plainOptions.value = radioOptions; value1.value = radioOptions[0]?.value ?? ""; head.value = data.head; - tableInstance.value.data = tableData - tableInstance.value.columns = data.head - columns.value = data.head.map((item, index) => { - if(item.key !== 'option' && item.key !== 'answer_sn' && item.key !== '1.00' && item.key !== '2.00'&& item.key !== '3.00'&& item.key !== '4.00'&& item.key !== '5.00'){ + tableInstance.value.data = tableData; + tableInstance.value.columns = data.head; + if(data.group_head.length > 0){ + let keys = []; + columns.value = data.group_head.map((groupItem) => { + let children = []; + children = groupItem.children.map((item, index) => { + keys.push(item.key); + if (item.key !== 'option' && item.key !== 'answer_sn' && item.key !== '1.00' && item.key !== '2.00' && item.key !== '3.00' && item.key !== '4.00' && item.key !== '5.00') { + return { + ...item, + title: () => , + name: item.title, + dataIndex: item.key, + slots: {customRender: item.key}, + width: 100, + // align: "center", + fixed: (index === 0 || item.key === 'avg') ? 'left' : null, + sorter: (a, b) => { + return a[item.key] > b[item.key] ? -1 : 1 + }, + }; + } else { + return { + ...item, + title: () => , + name: item.title, + dataIndex: item.key, + slots: {customRender: item.key}, + width: 100, + // align: "center", + fixed: (index === 0 || item.key === 'avg') ? 'left' : null + }; + } + }); return { - ...item, - title: () => , - name: item.title, - dataIndex: item.key, - slots: { customRender: item.key }, - width: 100, - // align: "center", - fixed: (index === 0 || item.key === 'avg') ? 'left' : null, - sorter: (a, b) => { return a[item.key] > b[item.key] ? -1 : 1 }, - }; - }else{ - return { - ...item, - title: () => , - name: item.title, - dataIndex: item.key, - slots: { customRender: item.key }, - width: 100, - // align: "center", - fixed: (index === 0 || item.key === 'avg') ? 'left' : null - }; + ...groupItem, + children: children, + } + }); + let column = []; + data.head.map((item, index) => { + if(!keys.includes(item.key)){ + if (item.key !== 'rowGroupTitle' && item.key !== 'option' && item.key !== 'answer_sn' && item.key !== '1.00' && item.key !== '2.00' && item.key !== '3.00' && item.key !== '4.00' && item.key !== '5.00') { + column.push({ + ...item, + title: () => , + name: item.title, + dataIndex: item.key, + slots: {customRender: item.key}, + width: 100, + // align: "center", + fixed: (index === 0 || item.key === 'avg') ? 'left' : null, + sorter: (a, b) => { + return a[item.key] > b[item.key] ? -1 : 1 + }, + }); + } else { + column.push({ + ...item, + title: () => , + name: item.title, + dataIndex: item.key, + slots: {customRender: item.key}, + width: 100, + // align: "center", + fixed: (index === 0 || item.key === 'avg') ? 'left' : null + }); + } + } + }); + let group = column.find(item => item.key === 'rowGroupTitle'); + if(group){ + column.splice(column.indexOf(group),1); } - }); + let option = column.find(item => item.key === 'option'); + if(option){ + column.splice(column.indexOf(option),1); + } + columns.value = [group,option,...columns.value,...column]; + } else { + columns.value = data.head.map((item, index) => { + if (item.key !== 'option' && item.key !== 'answer_sn' && item.key !== '1.00' && item.key !== '2.00' && item.key !== '3.00' && item.key !== '4.00' && item.key !== '5.00') { + return { + ...item, + title: () => , + name: item.title, + dataIndex: item.key, + slots: {customRender: item.key}, + width: 100, + // align: "center", + fixed: (index === 0 || item.key === 'avg') ? 'left' : null, + sorter: (a, b) => { + return a[item.key] > b[item.key] ? -1 : 1 + }, + }; + } else { + return { + ...item, + title: () => , + name: item.title, + dataIndex: item.key, + slots: {customRender: item.key}, + width: 100, + // align: "center", + fixed: (index === 0 || item.key === 'avg') ? 'left' : null + }; + } + }); + } }, { immediate: true, diff --git a/src/views/DataAnalyse/diagram/components/SingleChart.vue b/src/views/DataAnalyse/diagram/components/SingleChart.vue index a4cdcb80..0b3eb0af 100644 --- a/src/views/DataAnalyse/diagram/components/SingleChart.vue +++ b/src/views/DataAnalyse/diagram/components/SingleChart.vue @@ -79,7 +79,6 @@ export default defineComponent({ }, setup(props) { const chartInstance = inject("chartInstance"); - const tableInstance = inject("tableInstance"); const chart = ref(null); const columns = ref([]); @@ -113,6 +112,10 @@ export default defineComponent({ (data) => { source.value = data.option; tableSource.value = data.option; + tableSource.value.forEach(item => { + item.group_title = item.groupTitle; + }); + console.log("tableSource",tableSource.value); columns.value = data.head?.map((item, index) => { if(item.key === 'answerRate' || item.key === 'rate') { return {