<template>
    <div class="page">
        <LayoutTable :data="tableData" notDel :config="tableConfig">
        </LayoutTable>
        <drawer-show ref="drawerform" @ok="getData" />
    </div>
</template>

<script>
/** 表单弹出框模式需引入 */
import drawerShow from "./drawershow";
import table from "@/assets/mixins/table";
export default {
    name: "FeedbackList",
    components: {
        drawerShow
    },
    mixins: [table],
    created() {
    },
    methods: {
        renderTable(tableData) {
            return (
                <el-table stripe data={tableData} class="total-table">
                    {this.columnSet.map((item) => this.renderTableColumn(item))}
                </el-table>
            );
        },
        renderTableColumn(options) {
            return (
                <el-table-column
                    prop={options.prop}
                    label={options.label}
                    width={options.width}
                    formatter={options.formatter}
                >
                </el-table-column>
            );
        },
        /** 重写新增方法 */
        toAdd(row) {
            // this.$refs.drawerform.add(row);
            this.$router.push("/feedback/addQuestion/list");
        },
        /** 重写编辑方法 */
        toEdit(row) {
            // this.$refs.drawerform.edit(row);
            this.$router.push({ path: `/feedback/addQuestion/list?id=${row.id}` });
            localStorage.setItem('editFeedback', JSON.stringify(row))
        },
        /** 重写查看方法 */
        toView(row) {
            console.log(row)
            localStorage.setItem('checkFeedbackId', row.id)
            // this.$refs.drawerform.view(row);
            this.$router.push('/feedback/questionnaire/list')
        },
        goPage(path) {
            this.$router.push(path)
        }

    },
    data() {
        return {
            /** 子表列元素 */
            columnSet: [
                { label: "反馈问卷id号", prop: "feedbackId", formatter: this.formatter },
                { label: "问题内容", prop: "content" },
                { label: "问题类型 ", prop: "questionType", formatter: this.formatter },
                { label: "是否必填", prop: "require", formatter: this.formatter },
                { label: "备注", prop: "remark" },
            ],
            config: {
                isshowTabPane: true,
                search: [
                ],
                columns: [
                    { type: "selection", width: 60 },
                    { type: "index", label: "序号", width: 50 },

                    { label: "问卷标题", prop: "title" },

                    { label: "更新时间", prop: "createTime", formatter: this.formatterDate },
                    
                    { label: "反馈开始时间", prop: "feedbackTimeStart", formatter: this.formatterDate },

                    { label: "反馈结束时间", prop: "feedbackTimeEnd", formatter: this.formatterDate },

                    { label: "邀请人数", prop: "inviteNum", formatter: this.formatter },

                    { label: "反馈人数", prop: "feedbackNum", formatter: this.formatter },

                    // { label: "创建用户", prop: "createUserId", formatter: this.formatter },
                    {
                        label: "状态", prop: "processStatus", formatter: (row) => {
                            let str = "未开始"
                            if (row.processStatus == 1) {
                                str = "进行中"
                            } else if (row.processStatus == 2) {
                                str = "已结束"
                            }
                            return (
                                <el-tag type={row.processStatus ? row.processStatus == 2 ? 'success' : 'info' : 'danger'} size="small">
                                    {str}
                                </el-tag>
                            )
                        }
                    },
                    // {
                    //     label: "绩效反馈问题",
                    //     width: 120,
                    //     prop: "subColumns",
                    //     formatter: (row) => {
                    //             return pre + Number(cur.width);
                    //         }, 50);
                    //         return (
                    //             <el-popover placement="right" width={widthsize} trigger="click">
                    //                 {this.renderTable(row.feedbackQuestionList)}
                    //                 <el-button type="text" slot="reference">详细</el-button>
                    //             </el-popover>
                    //         );
                    //     },
                    // },
                    {
                        label: "操作",
                        width: 240,
                        formatter: row => {
                            if (row.processStatus == 0) {
                                return (
                                    <table-buttons noAdd noView row={row} onEdit={this.toEdit} onView={this.toView} onDel={this.toDel} />
                                );
                            } else {
                                return (
                                    <table-buttons noAdd noEdit row={row} onEdit={this.toEdit} onView={this.toView} onDel={this.toDel} />
                                );
                            }
                            // return <table-buttons noAdd noEdit row={row} onEdit={this.toEdit} onView={this.toView} onDel={this.toDel} />
                        }
                    }
                ]
            }
        };
    }
};
</script>
<style lang="less" scoped>
/deep/ .buttons {
    margin-bottom: 10px;
}
</style>
