folviteApply.vue

<template>
    <div class="inStockManage">
        <a-form layout="inline" class="search_form">
            <a-form-item label="领取状态">
                <a-select v-model="searchForm.status" placeholder="请选择" style="width: 250px">
                    <a-select-option value="">全部</a-select-option>
                    <a-select-option v-for="item in statusList" :key="item.enumValue" :value="item.enumValue">
                        {{ item.enumName }}
                    </a-select-option>
                </a-select>
            </a-form-item>
            <a-form-item label="女方姓名">
                <!--v-price="{digit:4}"-->
                <a-input v-model="searchForm.womanName" placeholder="请输入女方姓名" style="width: 250px"></a-input>
            </a-form-item>
            <a-form-item label="联系电话">
                <!--v-price="{digit:4}"-->
                <a-input v-model="searchForm.telephone" placeholder="请输入联系电话" style="width: 250px"></a-input>
            </a-form-item>
            <a-button type="primary" icon="search" class="search_btn" @click="searchList">搜索</a-button>
            <a-button class="search_btn ant-table-btn" icon="sync" style="margin-left: 10px" @click="restSearchForm">
                清空
            </a-button>
            <div style="clear: both"></div>
        </a-form>

        <div style="clear: both"></div>
        <a-table :dataSource="tableData"
                 :columns="columns"
                 rowKey="id"
                 :loading="loading"
                 :pagination="false"
                 :scroll="{ x: 1}"
        >
            <template slot="expireDateS" slot-scope="record">
                {{ record.expireDate | formatDate }}
            </template>
            <template slot="action" slot-scope="record">
                <a-button class="ant-table-btn" size="small" @click="toDetail(record)" :disabled="record.status===2">
                    发放
                </a-button>
                <a-button style="margin-left: 5px" class="ant-table-btn" size="small" @click="deleteConfirm(record)"
                          :disabled="record.status===2">删除
                </a-button>
            </template>
        </a-table>
        <a-pagination
                v-if="pagination.total > 0"
                :total="pagination.total"
                show-size-changer
                show-quick-jumper
                v-model="pagination.pageIndex"
                :page-size="pagination.pageSize"
                :page-size-options="pagination.pageSizeOptions"
                @showSizeChange="showSizeChange"
                @change="change"
                :showTotal="() => `共 ${pagination.total} 条`"
        />
    </div>
</template>
<script>
import {getEnumByFlag, isEmptyParams} from "../../utils/common";
import moment from 'moment'

const columns = [
    {
        title: '女方姓名',
        dataIndex: 'womanName',
        width: "140px"
    },
    {
        title: '证件类型',
        dataIndex: 'womenCertificateTypeName',
        width: '140px'
    },
    {
        title: '证件号码',
        width: '220px',
        dataIndex: 'womenIdCard',
    },
    // {
    //     title: '男方姓名',
    //     dataIndex: 'manName',
    //    width: '140px'
    // },
    // {
    //     title: '证件类型',
    //     dataIndex: 'menCertificateTypeName',
    //     width: '140px'
    // },
    // {
    //     title: '证件号码',
    //     width: '220px',
    //     dataIndex: 'menIdCard'
    // },
    {
        title: '联系电话',
        dataIndex: 'telephone',
        width: '180px'
    },
    {
        title: '领取状态',
        dataIndex: 'statusName',
        width: '100px'
    },
    {
        title: '领取日期',
        dataIndex: 'provideDate',
        width: '120px'
    },
    {
        title: '操作',
        align: 'center',
        fixed: 'right',
        width: 140,
        scopedSlots: {customRender: 'action'},
    },
]
export default {
    components: {},
    data() {
        return {
            // 搜索框对象
            searchForm: {
                status: '',
            },
            statusList: [],
            pagination: {
                pageIndex: 1,
                pageSize: 10,
                total: 0,
                pageSizeOptions: ['10', '20', '30', '40', '50'],
            },
            columns,
            tableData: [],
            loading: false,
            routerParams: {},
            menuId: undefined
        }
    },
    created() {
        this.routerParams = this.$route.query;
        if (this.routerParams.menuId) {
            window.sessionStorage.setItem('menuId', this.routerParams.menuId)
            this.menuId = this.routerParams.menuId
        }
        this.getEnumListInfo()
        this.getFolviteApplyList()

    },
    methods: {
        getEnumListInfo() {
            if (window.sessionStorage.getItem('allEnum')) {
                this.statusList = getEnumByFlag("folacin_resident_infopc_status");
            } else {
                let par = {
                    menuId: this.menuId
                }
                this.$api.fyManage.fetchFYLoginUser(par).then(({data}) => {
                    window.sessionStorage.setItem('allEnum', JSON.stringify(data.enumValueList))
                    window.sessionStorage.setItem('userInfo', JSON.stringify(data.userInfo));
                    this.statusList = getEnumByFlag("folacin_resident_infopc_status");
                })
            }
        },
        searchList() {
            this.pagination.pageIndex = 1
            this.getFolviteApplyList()
        },
        getFolviteApplyList() {
            this.loading = true
            let pars = isEmptyParams(this.searchForm)
            let par = {
                ...pars,
                pageIndex: this.pagination.pageIndex,
                pageSize: this.pagination.pageSize,
                menuId: this.menuId
            }
            this.$api.folviteApplyManage.fetchFolviteApplyList(par).then(({data = {}}) => {
                const {dataList = [], total = 0} = data
                this.tableData = dataList
                this.pagination.total = total
                this.loading = false
            }).catch(() => {
                this.loading = false
            })
        },
        // 分页
        showSizeChange(pageNum, pageSize) {
            this.pagination.pageIndex = 1;
            this.pagination.pageSize = pageSize;
            this.getFolviteApplyList()
        },
        change(pageNum, pageSize) {
            this.pagination.pageIndex = pageNum;
            this.pagination.pageSize = pageSize;
            this.getFolviteApplyList()
        },
        restSearchForm() {
            this.searchForm = {
                breedId: undefined,
                medicalName: '',
                factoryId: '',
                produceDate: undefined
            }
            this.searchList()
        },
        // 删除按钮
        deleteConfirm(record) {
            let vm = this
            this.$confirm({
                title: '确定删除该条数据吗？',
                okType: 'danger',
                onOk: () => {
                    let par = {
                        id: record.id,
                        menuId: vm.menuId
                    }
                    this.$api.folviteApplyManage.delFolviteApplyById(par).then(res => {
                        if (res.code === 'SUCCESS') {
                            this.pagination.pageIndex = 1;
                            this.searchList()
                            this.$message.success('删除成功！')
                        }
                    })

                },
                onCancel: () => {
                    this.$message.info('已取消删除！');
                },
            });
        },
        toDetail(record) {
            if (process.env.NODE_ENV == "dev") {
                let params = {
                    id: record.id,
                    routerFlag: 'update',
                    menuId: this.menuId
                }
                this.$router.push({path: '/folviteDistribution/add', query: params})
            } else {
                let now_location = escape(process.env.VUE_APP_LOCATION + `folviteDistribution/add?menuId=${this.menuId}&menuCode=${this.routerParams.menuName}&routerFlag=update&id=` + record.id)
                window.top.postMessage({messageType: 'THIRD_PAGEADD', title: `叶酸申请`, url: now_location}, '*')
            }

        }
    },
}
</script>
<style lang="less" scoped>
// 文件上传样式
.ant-upload-select-picture-card i {
  font-size: 32px;
  color: #999;
}

.ant-upload-select-picture-card .ant-upload-text {
  margin-top: 6px;
  color: #666;
}

.btn_space {
  margin-right: 5px;
}

/* .search_form {
     margin-top: -17px;
     border: 1px solid rgba(255,77,128, .2);
     border-top: 0px;
     padding: 30px;
 }*/
</style>