spms-vue/src/views/userManage/phoneRegisterManage.vue

<template>
    <div>
        <el-form :inline="true" :model="filterQuery" class="query-form" size="mini">
            <el-row>
                <el-form-item class="query-form-item">
                    <el-select v-model="filterQuery.isCheck" placeholder="审核状态">
                        <el-option label="未审核" value="0"></el-option>
                        <el-option label="已审核" value="1"></el-option>
                        <el-option label="未通过" value="2"></el-option>
                    </el-select>
                </el-form-item>
                <el-form-item>
                    <el-button-group>
                        <el-button
                            type="primary"
                            icon="el-icon-refresh"
                            @click="onReset"
                        ></el-button>
                        <el-button type="primary" icon="search" @click="onSubmit"
                        >查询
                        </el-button
                        >
                    </el-button-group>
                </el-form-item>
            </el-row>
        </el-form>

        <el-table v-loading="loading" :data="list" style="width: 100%">
            <el-table-column label="序号" type="index"></el-table-column>
            <el-table-column label="IMEI唯一识别码" prop="imei" width="230"></el-table-column>
            <el-table-column
                label="企业名称"
                prop="companyName"
                width="160"
            ></el-table-column>
            <el-table-column
                label="联系方式"
                prop="phone"
                width="120"
            ></el-table-column>
            <el-table-column label="联系人" prop="contact" width="120">
            </el-table-column>

            <el-table-column label="审核状态" prop="isCheck" width="120">
                <template slot-scope="scope">
                    <span>{{ checkFlag[scope.row.isCheck] }}</span>
                </template>
            </el-table-column>

            <el-table-column label="操作" fixed="right">
                <template slot-scope="scope">
                    <el-button
                        type="text"
                        size="small"
                        v-if="scope.row.isCheck !== 1"
                        @click.native.stop="checkDialog(scope.row)"
                    >审核
                    </el-button
                    >
                </template>
            </el-table-column>
        </el-table>
        <el-dialog
            title="审核"
            :close-on-click-modal="false"
            :close-on-press-escape="false"
            :visible.sync="centerDialogVisible"
            width="30%"
            center
        >
      <span slot="footer" class="dialog-footer">
        <el-button @click="centerDialogVisible = false">取消</el-button>
        <el-button type="primary" @click="passRegister">通过</el-button>
        <el-button type="primary" @click="noPassRegister">不通过</el-button>
      </span>
        </el-dialog>
        <el-pagination
            :page-size="filterQuery.limit"
            @current-change="handleCurrentChange"
            layout="prev, pager, next"
            :total="total"
        ></el-pagination>
    </div>
</template>

<script>
    import {registerList, check} from "../../api/auth/deviceCheck";

    export default {
        data() {
            return {
                filterQuery: {
                    isCheck: "0",
                    page: 1,
                    limit: 20,
                },
                value: "",
                total: 0,
                checkFlag: {
                    0: "未审核",
                    1: "已通过",
                    2: "已拒绝",
                },

                list: [],

                addDialogVisible: false,
                centerDialogVisible: false,
                check: "",
            };
        },

        methods: {
            onReset() {
                this.$router.push({
                    path: "",
                });
                this.filterQuery = {
                    isCheck: "",
                    page: 1,
                    limit: 20,
                };
                this.getList();
            },

            onSubmit() {
                this.getList();
            },
            getList() {
                this.loading = true;
                registerList(this.filterQuery)
                    .then((response) => {
                        this.loading = false;
                        this.list = response.data.list || [];
                        this.total = response.data.total || 0;
                    })
                    .catch(() => {
                        this.loading = false;
                        this.list = [];
                        this.total = 0;
                    });
            },

            cancelDialog() {
                this.addDialogVisible = false;
            },

            handleCheckedChange(val) {
                console.log(val);
            },

            handleSizeChange(val) {
                this.filterQuery.limit = val;
                this.getList();
            },
            handleCurrentChange(val) {
                this.filterQuery.page = val;
                this.getList();
            },

            checkRegister() {
                this.loading = true;

                check(this.checkQuery)
                    .then((response) => {
                        if (response.code === 20000) {
                            this.getList();
                            this.$message({
                                type: "success",
                                message: "更新成功！",
                            });
                        } else {
                            this.$message.warning("更新失败");
                            this.loading = false;
                        }
                    })
                    .catch(() => {
                    });
            },
            checkDialog(row) {


                this.checkQuery = {
                    id: row.id + "",
                    isCheck: 1,

                };
                console.log(
                    this.check + "---" + row.roles + "---" + this.checkQuery.roles
                );
                this.centerDialogVisible = true;
            },

            passRegister() {
                this.checkRegister();
                this.centerDialogVisible = false;
            },
            noPassRegister() {
                this.checkQuery.isCheck = 2;
                this.checkRegister();
                this.centerDialogVisible = false;
            },

            //
        },

        mounted() {
        },
        created() {
            this.getList();
        },
    };
</script>