<el-table border :data="tableData" style="width: 100%">
<el-table-column prop="date" align="center" label="序号" :resizable="false" type="index" width="50">
{{ scope.row[item.key] }}
slot-scope="scope">
value-format="yyyy-MM-dd">
export default {
name: 'ItmanTable2',
data() {
return {
// 表头数据
tableHead: [
{ header: "指标11111", key: "target1" },
{ header: "指标2", key: "target2" },
{ header: "指标3", key: "target3" },
{ header: "指标4", key: "target4" },
{ header: "指标5", key: "target5" }
],
// 表格数据
tableData: [
{
id: 1,
item: "项目1",
target1: 1111111111111111,
target2: 2,
target3: 3,
target4: 4,
target5: 5,
feedback: "",
estimatedDate: null
},
{
id: 2,
item: "项目2",
target1: 2111110,
target2: 0,
target3: 0,
target4: 0,
target5: 0,
feedback: "",
estimatedDate: null
},
],
};
},
mounted() {
//call init method here...
console.log(this.$route.params.id)
},
methods: {
handleSave(scope) {
console.log(scope.row);
if (scope.row.feedback == "" || scope.row.estimatedDate == "" || scope.row.estimatedDate == null) {
this.$message({
message: '反馈和预计日期均不能为空',
type: 'warning'
});
return;
}
this.$message({
message: '保存成功->' + scope.row.estimatedDate,
type: 'success'
});
},
handleCallAPI() {
// 表头数据
let apiTableHead = [
{ header: "列头001", key: "target1" },
{ header: "列头002", key: "target2" },
{ header: "列头003", key: "target3" }
];
// 表格数据
let apiTableData = [
{
id: 1,
item: "项目1",
target1: 1,
target2: 2,
target3: 3,
feedback: "反馈1",
estimatedDate: "2022-12-29"
},
{
id: 2,
item: "项目2",
target1: 11,
target2: 22,
target3: 33,
feedback: "反馈2",
estimatedDate: "2022-12-30"
},
{
id: 3,
item: "项目3",
target1: 111,
target2: 222,
target3: 333,
feedback: "反馈3",
estimatedDate: "2022-12-31"
}
];
this.tableHead = apiTableHead;
this.tableData = apiTableData;
}
},
};
* {
margin: 0;
padding: 0;
}