{"version":3,"sources":["webpack:///src/views/butler/page/src/views/butler/page/visitorManagement.vue"],"names":[],"mappings":"AA2kBA,uBACA,WAAA,CACA,WAAA,CACA,gBAAA,CACA,kBAAA,CACA,iBAAA,CACA,UAAA,CACA,wBACA","file":"chunk-181e31e0.2d2c695d.css","sourcesContent":["\n<template>\n    <div class=\"main-content\">\n        <div class=\"main-titel\">\n            <span>访客管理</span>\n        </div>\n        <!-- <div class=\"tips\">\n      <p>\n        <span class=\"el-icon-warning-outline\"\n              style=\"margin:0 12px\"></span>\n        温馨提示：今日有\n        <span style=\"color:rgba(251, 71, 2, 1)\">{{countNew}}</span>\n        户家庭申报访客通行\n      </p>\n    </div> -->\n        <div class=\"content\">\n            <div style=\"width: 50px\">\n                    <download-excel\n                        class=\"export-excel-wrapper\"\n                        :fetch=\"fetchData\"\n                        :fields=\"json_fields\"\n                        :before-finish=\"finishDownload\"\n                        name=\"访客记录.xls\"\n                    >\n                        <!-- 上面可以自定义自己的样式，还可以引用其他组件button -->\n                        <el-button size=\"mini\" icon=\"el-icon-folder-add\" plain\n                            >导出Excel</el-button\n                        >\n                    </download-excel>\n                </div>\n            <!-- 查询重制 -->\n            <div class=\"\">\n                <!-- 头部输入框 -->\n                <VueTable ref=\"table\" :config=\"config\" @tableCheck=\"tableCheck\">\n                    <template v-slot:visitDateStart=\"slotData\">\n                        <div>{{ slotData.data.visitDateStart|capitalize}}</div>\n                    </template>\n                    <template slot=\"footer\">\n                        <div class=\"table-footer\">\n                            <!-- <button @click=\"edit(table_row)\">编辑</button> -->\n                            <!-- <button @click=\"record(table_row)\">出入记录</button>\n              <button @click=\"toVoid(table_row)\">作废</button> -->\n                        </div>\n                    </template>\n                </VueTable>\n                <Drawer\n                    drawerTitle=\"访客编辑\"\n                    @drawerClose=\"drawerClose\"\n                    :drawerVrisible=\"edit_vrisible\"\n                >\n                    <div style=\"padding: 30px\">\n                        <FromCard>\n                            <template slot=\"title\">基本信息</template>\n                            <template>\n                                <VueForm\n                                    ref=\"childFrom\"\n                                    :formObj=\"reviseForm\"\n                                ></VueForm>\n                            </template>\n                        </FromCard>\n                    </div>\n                    <div slot=\"footer\">\n                        <button class=\"btn-orange\" @click=\"onSubmit()\">\n                            <span>\n                                <i class=\"el-icon-circle-check\"></i>提交</span\n                            >\n                        </button>\n                        <button class=\"btn-gray\" @click=\"drawerClose\">\n                            <span>取消</span>\n                        </button>\n                    </div>\n                </Drawer>\n\n                <Drawer\n                    drawerTitle=\"出入记录\"\n                    @drawerClose=\"drawerClose\"\n                    :drawerVrisible=\"recordVrisible\"\n                >\n                    <div style=\"padding: 30px\">\n                        <FromCard>\n                            <template slot=\"title\">出入记录</template>\n                            <template>\n                                <div style=\"margin: 0 auto\">\n                                    <tableData\n                                        :config=\"recordConfig\"\n                                    ></tableData>\n                                </div>\n                            </template>\n                        </FromCard>\n                    </div>\n                    <div slot=\"footer\">\n                        <button\n                            class=\"btn-orange\"\n                            @click=\"recordVrisible = false\"\n                        >\n                            <span>关闭</span>\n                        </button>\n                    </div>\n                </Drawer>\n                <!-- 出入记录 -->\n            </div>\n        </div>\n    </div>\n</template>\n\n<script>\nimport { DownloadExcel } from '@/plugins/DownloadExcel'\nimport {\n    visitorsCancel,\n    visitorsFindById,\n    visitorsUpdate,\n    visitorsListDetail,\n    visitorsCountVisitorsNew\n} from '@/api/butler'\nexport default {\n    data() {\n        return {\n            edit_vrisible: false,\n            recordVrisible: false,\n            countNew: 0,\n            // 选中表格数据\n            table_row: [],\n            json_fields: {\n                拜访房屋名称: 'roomName',\n                访客姓名: 'name',\n                访客电话: 'tel',\n                访客性别: {\n                    field: 'sex',\n                    callback: (value) => {\n                        switch (value) {\n                            case 1:\n                                return '男'\n                                break\n                            case 2:\n                                return '女'\n                                break\n                        }\n                    }\n                },\n                访客车牌号: 'carNumber',\n                预约到访日期: {\n                    field: 'visitDateStart',\n                    callback: (value) => {\n                        if(value){\n                          return value.substring(0, 10)\n                        }\n                    }\n                },\n                申请人: 'createName',\n                申请时间: 'createDate'\n            },\n            config: {\n                thead: [\n                    { label: '序号', type: 'index', width: '80' },\n                    { label: '拜访房屋名称', prop: 'roomName', width: 'auto' },\n                    // { label: '类型', prop: 'type', width: ' auto' },\n                    { label: '访客姓名', prop: 'name', width: 'auto' },\n                    { label: '访客电话', prop: 'tel', width: 'auto' },\n                    {\n                        label: '访客性别',\n                        prop: 'sex',\n                        width: 'auto',\n                        type: 'function',\n                        callback: (row, prop) => {\n                            switch (row.sex) {\n                                case 1:\n                                    return '男'\n                                    break\n                                case 2:\n                                    return '女'\n                                    break\n                                default:\n                                    break\n                            }\n                        }\n                    },\n                    // { label: '是否开车', prop: 'isDrive', width: 'auto ' },\n                    { label: '访客车牌号', prop: 'carNumber', width: '160' },\n                    {\n                        label: '预约到访日期',\n                        prop: 'visitDateStart',\n                        width: '180',\n                        type: 'slot',\n                        slotName: 'visitDateStart'\n                    },\n                    {\n                        label: '申请人',\n                        prop: 'createName',\n                        width: '180'\n                    },\n                    {\n                        label: '申请时间',\n                        prop: 'createDate',\n                        width: '180'\n                    }\n                ],\n                table_data: [],\n                search_item: [\n                    // {\n                    //     type: 'Input',\n                    //     label: '房屋信息',\n                    //     placeholder: '楼栋-单元-房号',\n                    //     prop: 'roomName'\n                    // },\n\n                    {\n                        type: 'Input',\n                        label: '访客姓名',\n                        placeholder: '请输入',\n                        prop: 'name'\n                    },\n                    // {\n                    //     type: 'select',\n                    //     label: '访客性别',\n                    //     value: null,\n                    //     placeholder: '请输入',\n                    //     prop: 'sex',\n                    //     options: [\n                    //         { value: '1', label: '男' },\n                    //         { value: '2', label: '女' }\n                    //     ]\n                    // },\n                    {\n                        type: 'Int',\n                        label: '访客手机号',\n                        placeholder: '请输入',\n                        prop: 'tel'\n                    }\n                    // {\n                    //     type: 'startDate',\n                    //     label: '预计到访时间开始',\n                    //     placeholder: '请输入',\n                    //     prop: 'expectedVisitDateStart'\n                    // },\n                    // {\n                    //     type: 'endDate',\n                    //     label: '预计到访时间结束',\n                    //     placeholder: '请输入',\n                    //     prop: 'expectedVisitDateEnd'\n                    // }\n                    // , {\n                    //   type: 'startDate',\n                    //   label: '实际到访时间',\n                    //   placeholder: '请输入',\n                    //   prop: 'visitDateStart\t'\n                    // },\n                    // {\n                    //   type: 'endDate',\n                    //   label: '实际离开时间',\n                    //   placeholder: '请输入',\n                    //   prop: 'visitDateEnd'\n                    // },\n                    // {\n                    //     type: 'select',\n                    //     label: '通行状态',\n                    //     value: null,\n                    //     placeholder: '请选择',\n                    //     prop: 'visitorStatus',\n                    //     options: [\n                    //         { value: '1', label: '未到' },\n                    //         { value: '2', label: '已到' },\n                    //         { value: '3', label: '已过期' },\n                    //         { value: '4', label: '作废' }\n                    //     ]\n                    // },\n                    // {\n                    //     type: 'select',\n                    //     label: '类型',\n                    //     value: null,\n                    //     placeholder: '请选择',\n                    //     prop: 'type',\n                    //     options: [\n                    //         { value: '1', label: '业主填写' },\n                    //         { value: '2', label: '访客填写' }\n                    //     ]\n                    // }\n                ],\n                url: 'visitorsNewList',\n                data: {\n                    pageNum: 1,\n                    size: 10\n                }\n            },\n            // 修改抽屉数据\n            reviseForm: {\n                ruleForm: {\n                    roomName: null,\n                    name: null,\n                    status: null,\n                    tel: null,\n                    weight: null,\n                    type: null,\n                    departureTime: null,\n                    visitDate: null\n                },\n                form_item: [\n                    {\n                        type: 'Input',\n                        label: '来访房屋',\n                        placeholder: '请输入',\n                        width: '100%',\n                        prop: 'roomName',\n                        disabled: true\n                    },\n                    {\n                        type: 'Input',\n                        label: '访客姓名',\n                        placeholder: '请输入',\n                        width: '50%',\n                        prop: 'name'\n                    },\n                    {\n                        type: 'Select',\n                        label: '访客性别',\n                        placeholder: '请输入',\n                        options: [\n                            { value: 1, label: '正常' },\n                            { value: 2, label: '有误' }\n                        ],\n                        width: '50%',\n                        prop: 'sex'\n                    },\n                    {\n                        type: 'Select',\n                        label: '是否开车',\n                        placeholder: '请输入',\n                        options: [\n                            { value: 1, label: '业委会' },\n                            { value: 2, label: '绿化' }\n                        ],\n                        width: '50%',\n                        prop: 'isDrive'\n                    },\n                    {\n                        type: 'Input',\n                        label: '车牌号',\n                        placeholder: '请输入权重',\n                        width: '50%',\n                        prop: 'carNum'\n                    },\n\n                    {\n                        type: 'DateTime',\n                        label: '预计到访时间',\n                        placeholder: '请输入预计到访时间',\n                        width: '50%',\n                        prop: 'expectedVisitDate'\n                    },\n                    {\n                        type: 'DateTime',\n                        label: '通行证时效',\n                        placeholder: '请输入通行证时效',\n                        disabled: true,\n                        width: '50%',\n                        prop: 'effectiveTime'\n                    },\n                    {\n                        type: 'DateTime',\n                        label: '实际到访时间',\n                        placeholder: '请输入实际到访时间',\n                        width: '50%',\n                        prop: 'visitDate'\n                    },\n                    {\n                        type: 'DateTime',\n                        label: '实际离开时间',\n                        placeholder: '请输入实际离开时间',\n                        width: '50%',\n                        prop: 'departureTime'\n                    },\n                    {\n                        type: 'Select',\n                        label: '访客状态',\n                        placeholder: '请输入访客状态',\n                        options: [\n                            { value: 1, label: '未到' },\n                            { value: 2, label: '已到' },\n                            { value: 3, label: '已过期' },\n                            { value: 4, label: '作废' }\n                        ],\n                        width: '50%',\n                        prop: 'visitorStatus'\n                    }\n                ]\n            },\n            recordConfig: {\n                thead: [\n                    { label: '序号', type: 'index', width: '110' },\n                    { label: '进入时间', prop: 'departureTime', width: 'auto' },\n                    { label: '出去时间', prop: 'visitTime', width: ' auto' }\n                ],\n                checkbox: false,\n                table_data: []\n            }\n        }\n    },\n    // created() {\n    //     this.getTipsData()\n    // },\n    filters: {\n        capitalize: function (value) {\n            if (!value) return ''\n            value = value.toString()\n            return value.substring(0, 10)\n        }\n    },\n    methods: {\n        // Excel导出\n        async fetchData() {\n            let Excel = []\n            let params = {\n                url: 'visitorsNewList',\n                data: {\n                    pageNum: 1,\n                    size: 100\n                }\n            }\n            const data = await DownloadExcel(params, this)\n            return data\n        },\n        // Excel进度\n        ExcelLoading(page, pageCount) {\n            const Loading = this.$loading({\n                lock: true,\n                text: `正在导出Excel${page}`,\n                spinner: 'el-icon-loading',\n                background: 'rgba(0, 0, 0, 0.7)'\n            })\n            Loading.text = `正在导出Excel  ${page}/${pageCount}`\n            console.log(Loading.text)\n        },\n        // Excel导出结束\n        finishDownload() {\n            const Loading = this.$loading()\n            Loading.close()\n        },\n        // getTipsData() {\n        //     //  查询今日咨询条数\n        //     visitorsCountVisitorsNew().then((result) => {\n        //         console.log(result)\n        //         this.countNew = result.countNew\n        //     })\n        // },\n        tableCheck(arr) {\n            this.table_row = arr\n        },\n        // 编辑提交\n        onSubmit() {\n            let resData = {\n                id: this.table_row[0].id,\n                name: this.reviseForm.ruleForm.name,\n                sex: this.reviseForm.ruleForm.sex,\n                isDrive: this.reviseForm.ruleForm.isDrive,\n                carNum: this.reviseForm.ruleForm.carNum,\n                expectedVisitDate: this.reviseForm.ruleForm.expectedVisitDate,\n                visitDate: this.reviseForm.ruleForm.visitDate,\n                departureTime: this.reviseForm.ruleForm.departureTime,\n                effectiveTime: this.reviseForm.ruleForm.effectiveTime,\n                visitorStatus: this.reviseForm.ruleForm.visitorStatus\n            }\n            visitorsUpdate(resData).then((result) => {\n                if (result.status) {\n                    this.$message({\n                        message: result.message,\n                        type: 'success'\n                    })\n                    this.$refs.table.loadData()\n                    this.getTipsData()\n\n                    this.edit_vrisible = false\n                }\n            })\n        },\n        // 出入记录\n        record(data) {\n            if (data.length) {\n                if (data.length > 1) {\n                    this.$message({\n                        message: '不能批量查看',\n                        type: 'error'\n                    })\n                    return\n                }\n                let resData = {\n                    id: data[0].id\n                }\n                visitorsListDetail(resData).then((result) => {\n                    if (result) {\n                        this.recordVrisible = true\n                        this.recordConfig.table_data =\n                            result.voUserVisitorsDetailList\n                    }\n                    console.log(result)\n                })\n            } else {\n                this.$message({\n                    message: '请选择需要查看的数据',\n                    type: 'error'\n                })\n            }\n        },\n        // 编辑\n        edit(data) {\n            if (data.length) {\n                if (data.length > 1) {\n                    this.$message({\n                        message: '不能批量编辑',\n                        type: 'error'\n                    })\n                    return\n                }\n                let resData = {\n                    id: data[0].id\n                }\n                visitorsFindById(resData).then((result) => {\n                    if (result) {\n                        this.reviseForm.ruleForm.name = result.name\n                        this.reviseForm.ruleForm.sex = result.sex\n                        this.reviseForm.ruleForm.isDrive = result.isDrive\n                        this.reviseForm.ruleForm.carNum = result.carNum\n                        this.reviseForm.ruleForm.expectedVisitDate =\n                            result.expectedVisitDate\n                        this.reviseForm.ruleForm.visitDate = result.visitDate\n                        this.reviseForm.ruleForm.departureTime =\n                            result.departureTime\n                        this.reviseForm.ruleForm.effectiveTime =\n                            result.effectiveTime\n                        this.reviseForm.ruleForm.visitorStatus =\n                            result.visitorStatus\n                        this.edit_vrisible = true\n                    }\n                })\n            } else {\n                this.$message({\n                    message: '请选择需要编辑的数据',\n                    type: 'error'\n                })\n            }\n        },\n        drawerClose() {\n            this.edit_vrisible = false\n            this.recordVrisible = false\n        },\n        // 作废\n        toVoid(data) {\n            let arr = []\n            for (let i = 0; i < this.table_row.length; i++) {\n                arr.push(this.table_row[i].id)\n            }\n            this.$confirm(\n                '确定要将访客信息作废吗？（若访客还未到访，作废将导致该访客无法进入）',\n                '作废提示s',\n                {\n                    confirmButtonText: '确定',\n                    cancelButtonText: '取消',\n                    confirmButtonClass: 'confirmButton',\n                    cancelButtonClass: 'cancelButton'\n                }\n            )\n                .then(() => {\n                    let resData = {\n                        ids: arr\n                    }\n                    visitorsCancel(resData).then((result) => {\n                        if (!result.status) return\n                        // 判断数据是否存在\n                        this.$message({\n                            message: result.message,\n                            type: 'success'\n                        })\n                    })\n                })\n                .catch((action) => {})\n        },\n        // 监听子组件取消事件\n        cancel(data) {\n            this.dialog_visible = false\n        },\n        // 关闭抽屉\n        getClose(data) {\n            this.drawer_vrisible = false\n            this.recordVrisible = false\n        }\n    }\n}\n</script>\n<style scoped>\n.tips {\n    margin: 20px;\n    height: 38px;\n    line-height: 38px;\n    background: #fafafa;\n    border-radius: 4px;\n    opacity: 0.8;\n    border: 1px solid #e8e8e8;\n}\n</style>\n"]}