<template>
    <default-layout>
        <a-card>
            <todo-list>
                <div slot="title">条件查询</div>
                <div slot="options">
                    <a-button type="primary" icon="search" :loading="loading" @click="searchQuery">查询</a-button>
                    <a-button type="primary" @click="downloadFile">下载模板</a-button>
                    <a-button type="primary" @click="importFile">导入模板</a-button>
                    <a-button type="primary" @click="handleExportXls('华软恒信项目记录')">导出</a-button>
                </div>
                <div slot="content">
                    <div class="table-page-search-wrapper">
                        <a-form-model ref="ruleForm" layout="inline" :model="queryParam">
                            <a-row :gutter="24">
                                <a-col :md="8" :sm="8">
                                    <a-form-model-item label="场站名称">
                                        <a-input v-model="queryParam.factoryName" placeholder="请填写场站名称"></a-input>
                                    </a-form-model-item>
                                </a-col>

                                <a-col :md="8" :sm="8">
                                    <a-form-model-item label="合同编码">
                                        <a-input v-model="queryParam.contractCode" placeholder="请填写合同编码"></a-input>
                                    </a-form-model-item>
                                </a-col>
                                <a-col :md="8" :sm="8">
                                    <a-form-model-item label="项目名称">
                                        <a-input v-model="queryParam.projectName" placeholder="请填写项目名称"></a-input>
                                    </a-form-model-item>
                                </a-col>
                                <a-col :md="8" :sm="8">
                                    <a-form-model-item label="销售负责人">
                                        <a-input v-model="queryParam.saleDirector" placeholder="请填写销售负责人"></a-input>
                                    </a-form-model-item>
                                </a-col>
                                <a-col :md="8" :sm="8">
                                    <a-form-model-item label="工程人员">
                                        <a-input v-model="queryParam.engineer" placeholder="请填写工程人员"></a-input>
                                    </a-form-model-item>
                                </a-col>
                            </a-row>
                        </a-form-model>
                    </div>
                </div>
            </todo-list>
            <todo-list>
                <div slot="title">列表详情</div>
                <div slot="options">

                    <a-button type="primary" icon="plus" @click="handleAdd()">创建
                    </a-button>
                </div>
                <div slot="content">
                    <a-table ref="table" size="small" bordered rowKey="id" :columns="columns" :dataSource="dataSource"
                        @change="handleTableChange" :pagination="ipagination" :scroll="{ x: 1300 }" :loading="loading">
                        <template slot="action" slot-scope="text, record">
                            <a @click="handleEdit(record)" class="mr5" style="margin-right: 8px">编辑</a>
                            <a @click="handleDelete(record.id)" class="mr5" style="margin-right: 8px">删除</a>
                            <a @click="handleView(record)">详情</a>
                        </template>
                    </a-table>
                </div>
            </todo-list>
            <record-view-model ref="detailForm"></record-view-model>
            <record-edit-model ref="modalForm" @ok="modalFormOk"></record-edit-model>
            <import-file-model ref="import" @ok="modalFormOk"></import-file-model>
        </a-card>
    </default-layout>
</template>

<script>
import { HrhxListMixin } from '@/mixins/HrhxListMixin'
import { selectRecordListPage, removeRecord } from '@/api/services/hrproject.js'
import RecordViewModel from '@/views/record/modules/RecordViewModel'
import RecordEditModel from '@/views/record/modules/RecordEditModel'
import ImportFileModel from './modules/ImportFileModel.vue'
import { deleteAction, downFile, downFilePost, postAction } from '@/api/manage'
export default {
    name: 'HandoverRecordList',
    components: { RecordViewModel, RecordEditModel,ImportFileModel },
    mixins: [HrhxListMixin],
    data() {
        return {
            // 表头
            columns: [
                {
                    title: '序号',
                    align: 'center',
                    width: '50px',
                    dataIndex: 'serialNumber',
                    customRender: function (t, r, index) {
                        return parseInt(index) + 1
                    }
                },
                {
                    title: '场站名称',
                    align: 'center',
                    ellipsis: true,
                    width: '150px',
                    dataIndex: 'factoryName'
                },
                // {
                //     title: '经度',
                //     align: 'center',
                //     ellipsis: true,
                //     dataIndex: 'longitude'
                // },
                // {
                //     title: '纬度',
                //     align: 'center',
                //     ellipsis: true,
                //     dataIndex: 'latitude'
                // },
                {
                    title: '项目名称',
                    align: 'center',
                    ellipsis: true,
                    width: '180px',
                    dataIndex: 'projectName'
                },
                {
                    title: '合同编码',
                    align: 'center',
                    ellipsis: true,
                    dataIndex: 'contractCode'
                },
                {
                    title: '销售负责人',
                    align: 'center',
                    ellipsis: true,
                    dataIndex: 'saleDirector'
                },
                {
                    title: '到货时间',
                    align: 'center',
                    width: '180px',
                    dataIndex: 'arrivalTime'
                },
                {
                    title: '工程人员',
                    align: 'center',
                    ellipsis: true,
                    dataIndex: 'engineer'
                },
                {
                    title: '工程到场时间',
                    align: 'center',
                    ellipsis: true,
                    dataIndex: 'engineerAttendanceTime'
                },
                {
                    title: '工程完成时间',
                    align: 'center',
                    ellipsis: true,
                    dataIndex: 'engineerCompletionTime'
                },
                {
                    title: '项目详情',
                    align: 'center',
                    ellipsis: true,
                    width: '180px',
                    dataIndex: 'projectContent'
                },
                {
                    title: '操作',
                    dataIndex: 'action',
                    align: 'center',
                    fixed: 'right',
                    width: '180px',
                    scopedSlots: { customRender: 'action' }
                }
            ],
            url: {
                list: selectRecordListPage,
                delete: removeRecord,
                download: '/record/downloadTemplate',
                import: '/record/importTemplate',
                exportXlsUrl: '/record/exportTemplate'
            },
        }
    },
    methods: {
        downloadFile() {
            downFile(this.url.download, {}).then((data) => {
                if (!data) {
                    this.$message.warning('文件下载失败')
                    return
                }
                if (typeof window.navigator.msSaveBlob !== 'undefined') {
                    window.navigator.msSaveBlob(new Blob([data]), fileName + '.xls')
                } else {
                    let url = window.URL.createObjectURL(new Blob([data]))
                    let link = document.createElement('a')
                    link.style.display = 'none'
                    link.href = url
                    link.setAttribute('download', '华软恒信项目记录.xls')
                    document.body.appendChild(link)
                    link.click()
                    document.body.removeChild(link) //下载完成移除元素
                    window.URL.revokeObjectURL(url) //释放掉blob对象
                }
            })
        },
        handleExportXls(fileName) {
            if (!fileName || typeof fileName != 'string') {
                fileName = '导出文件'
            }
            let param = { ...this.queryParam }
            if (this.selectedRowKeys && this.selectedRowKeys.length > 0) {
                param['selections'] = this.selectedRowKeys.join(',')
            }
            downFilePost(this.url.exportXlsUrl, param).then((data) => {
                if (!data) {
                    this.$message.warning('文件下载失败')
                    return
                }
                if (typeof window.navigator.msSaveBlob !== 'undefined') {
                    window.navigator.msSaveBlob(new Blob([data]), fileName + '.xls')
                } else {
                    let url = window.URL.createObjectURL(new Blob([data]))
                    let link = document.createElement('a')
                    link.style.display = 'none'
                    link.href = url
                    link.setAttribute('download', fileName + '.xls')
                    document.body.appendChild(link)
                    link.click()
                    document.body.removeChild(link) //下载完成移除元素
                    window.URL.revokeObjectURL(url) //释放掉blob对象
                }
            })
        },
        importFile() {
            this.$refs.import.init();
        }
    }

}
</script>
