<template>
    <el-dialog
            title="管理群聊天记录"
            :visible.sync="dialogVisible"
            @open="loadData"
    >
        <el-table
                style="margin-bottom: 10px;"
                :data="data"
                size="mini"
        >
            <el-table-column prop="userName" align="left" width="160" label="成员">
                <template v-slot="{ row }">
                    {{row.userName}}（{{row.name}}）
                </template>
            </el-table-column>
            <el-table-column prop="autoGraph" align="left" width="300" label="个性签名" show-overflow-tooltip/>

            <el-table-column
                    prop="sn"
                    label="操作"
                    align="left"
            >
                <template v-slot="{ row }">
                    <el-button  plain size="mini" class="row-button" @click="deleteRow(row)">
                        <i class="el-icon-delete"></i> 删除
                    </el-button>
                </template>
            </el-table-column>
        </el-table>

        <el-pagination
                @size-change="handleSizeChange"
                @current-change="handleCurrentChange"
                :current-page.sync="params.pageBean.page"
                :page-sizes="[10, 20, 30, 50]"
                :page-size="params.pageBean.pageSize"
                layout="sizes, prev, pager, next, jumper"
                :total="1000">
        </el-pagination>
        <div slot="footer" class="dialog-footer">
            <el-button @click="dialogVisible = false">取 消</el-button>
            <el-button type="primary" @click="addQgroup">确 定</el-button>
        </div>
    </el-dialog>
</template>

<script>
    import uc from '@/api/instantMessag.js'
    import { mapState } from "vuex";

    export default {
        name: "mangeHismsg",
        props: [ 'currentRow' ],
        data() {
            return {
                dialogVisible: false,
                data: [],
                params: {
                    "pageBean": {
                        "page": 1,
                        "pageSize": 10,
                        "showTotal": true
                    },
                    "params": {}
                }
            }
        },
        computed: {
            ...mapState({
                currentUser: state => state.login.currentUser
            })
        },
        methods: {
            handleSizeChange(val) {
                this.params.pageBean.pageSize = 1;
                this.loadData();
            },
            handleCurrentChange(val) {
                this.params.pageBean.page = 1;
                this.loadData();
            },
            deleteRow(row) {
                this.$confirm('是否删除这条记录？', '提示', {
                    confirmButtonText: '删除',
                    cancelButtonText: '取消',
                    type: 'warning'
                }).then(() => {
                    const { id } = row
                    let param = new URLSearchParams();
                    param.append('id', id)
                    uc.deleteHismsg(param).then(res => {
                        if(res.state) {
                            this.loadData();
                            this.$message.success('记录已删除')
                        }
                    })
                }).catch(() => {

                });
            },
            addQgroup() {},
            loadData() {
                uc.hismsgList(this.params)
                    .then((res) => {
                        this.data = res.filter(o => o.userName != this.currentUser.account)
                    })
                    .finally(() => cb())
            }
        }
    }
</script>

<style scoped>

</style>