12 changed files with 3774 additions and 2041 deletions
@ -0,0 +1,104 @@ |
|||
<!-- |
|||
* @Author: wally |
|||
* @email: 18603454788@163.com |
|||
* @Date: 2021-04-20 17:44:23 |
|||
* @LastEditors: wally |
|||
* @LastEditTime: 2021-04-20 21:32:09 |
|||
--> |
|||
<template> |
|||
<div> |
|||
<a-table :columns="columns" :pagination="false" :row-key="record => record.title" :data-source="propData" bordered class="white pa-3"> |
|||
<template :slot="firstData" slot-scope="text, record"> |
|||
<span>{{ record.titleHead }}</span> |
|||
</template> |
|||
|
|||
<template v-for="(item, itemIndex) in columns.slice(1, columns.length)" :slot="item.title" slot-scope="text, record, index"> |
|||
<!-- <a-input :key="item" v-model="record.render" /> --> |
|||
<!-- {{ index }}{{ itemIndex }} --> |
|||
<a-input-number |
|||
:key="JSON.stringify(item)" |
|||
id="inputNumber" |
|||
v-model="list[index * rowNum + itemIndex].answer" |
|||
@change="onChange($event, list[index * rowNum + itemIndex].type, list[index * rowNum + itemIndex].id)" |
|||
/> |
|||
</template> |
|||
</a-table> |
|||
</div> |
|||
</template> |
|||
|
|||
<script> |
|||
export default { |
|||
name: 'TypeTable', |
|||
props: { |
|||
remark: { |
|||
type: String, |
|||
default: '', |
|||
}, |
|||
list: { |
|||
type: Array, |
|||
default: () => [], |
|||
}, |
|||
}, |
|||
data() { |
|||
return { |
|||
columns: [], |
|||
firstData: '', |
|||
propData: [], |
|||
colNum: 0, // 行数 |
|||
rowNum: 0, // 列数 |
|||
contentList: [], // 答题数据 |
|||
}; |
|||
}, |
|||
created() { |
|||
// 获取remark数据 |
|||
const data = JSON.parse(this.remark); |
|||
this.changeRow(data.param); |
|||
this.changeCol(data.param); |
|||
console.log(this.list); |
|||
}, |
|||
methods: { |
|||
/** |
|||
* 获取列 |
|||
*/ |
|||
changeRow(data) { |
|||
this.columns = []; |
|||
if (data.rowTitle && data.rowTitle.length) { |
|||
this.firstData = data.rowTitle[0]; |
|||
this.rowNum = data.rowTitle.length - 1; |
|||
for (let i = 0; i < data.rowTitle.length; i++) { |
|||
const item = data.rowTitle[i]; |
|||
let obj = { |
|||
title: item, |
|||
align: 'center', |
|||
dataIndex: item, |
|||
key: item, |
|||
scopedSlots: { customRender: item }, |
|||
render: i, |
|||
}; |
|||
this.columns.push(obj); |
|||
} |
|||
} |
|||
}, |
|||
/** |
|||
* 获取行 |
|||
*/ |
|||
changeCol(data) { |
|||
this.propData = []; |
|||
if (data.colTitle && data.colTitle.length) { |
|||
this.colNum = data.colTitle.length; |
|||
for (let i = 0; i < data.colTitle.length; i++) { |
|||
const item = data.colTitle[i]; |
|||
let obj = { titleHead: item }; |
|||
this.propData.push(obj); |
|||
} |
|||
} |
|||
}, |
|||
/** |
|||
* 改变输入框内的内容时 |
|||
*/ |
|||
onChange(e, type, id) { |
|||
this.$emit('getTableAnswer', e, 13, id); |
|||
}, |
|||
}, |
|||
}; |
|||
</script> |
|||
File diff suppressed because it is too large
File diff suppressed because it is too large
File diff suppressed because it is too large
Loading…
Reference in new issue