<template>
    <div>
        <el-form class="form-header" ref="dictForm" label-width="auto" label-position="left" style="margin-bottom:10px"
            @submit.native.prevent size="small">
            <el-row>
                <el-col :span="8">
                    <el-form-item label="发件人账号">
                        <el-input type="textarea" v-model="selectionData.shipperAccount" placeholder="请输入发件人账号，多个以“;”分割"
                            maxlength="3000" rows="1" />
                    </el-form-item>
                </el-col>
            </el-row>
        </el-form>
        <div style="margin-left:20px;margin-bottom:10px">
            <el-button icon="el-icon-search" type="primary" size="mini" @click="selection(1)">查 询
            </el-button>
            <el-button v-hasPermi="['log:superAllocation:add']" icon="el-icon-plus" type="primary" size="mini"
                @click="add">添 加
            </el-button>
        </div>
        <Tables ref="supserAllocation" ductName="supserAllocation" :data="tableData" :headerData="tableHeader"
            :selection="false" :order="true" :selectFixed="false" :pagination="true" :totalCount="totalCount"
            :loading="loading" :limitSize="selectionData.size" :page="selectionData.page"
            layout="total,prev, pager, next, jumper, ->" :pageSizes="[100]" :height="tableHeight"
            @currentChange="currentChange">
            <template slot="optionColumn">
                <el-table-column label="操作" width="250" align="center">
                    <template slot-scope="scope">
                        <el-button size="mini" type="text" v-if="scope.row.status != 0" icon="el-icon-edit"
                            v-hasPermi="['log:superAllocation:update']" @click="update(scope.row, 'update')">修改
                        </el-button>
                        <el-button type="text" v-if="scope.row.status === 1" size="mini" icon="el-icon-video-pause"
                            v-hasPermi="['log:superAllocation:openClose']" @click="changeStatus(scope.row)">
                            停 用</el-button>
                        <el-button type="text" v-if="scope.row.status === 0" size="mini" icon="el-icon-video-pause"
                            v-hasPermi="['log:superAllocation:openClose']" @click="changeStatus(scope.row)">
                            启 用</el-button>
                        <el-button type="text" icon="el-icon-document-copy" size="mini"
                            v-hasPermi="['log:superAllocation:copy']" @click="update(scope.row, 'copy')">复 制
                        </el-button>
                        <el-button size="mini" type="text" icon="el-icon-delete" style="color:#ff4949"
                            v-hasPermi="['log:superAllocation:delete']" @click="del(scope.row)">删除</el-button>
                    </template>
                </el-table-column>
            </template>
        </Tables>
        <Dialog :dialogVisible="dialogVisible" :ruleData="ruleData" :status="dialogStatus" @close="close" />
    </div>
</template>

<script>
import { queryShipperAccountRule, changeStatusById, queryShipperAccountRuleById, getReleaseWeight } from "@/api/supserAllocation"
import Dialog from './dialog.vue';

export default {
    name: 'SuperAllocation',
    components: {
        Dialog
    },
    data() {
        return {
            selectionData: {
                shipperAccount: null,
                page: 1,
                size: 20,
            },
            tableData: [],
            tableHeader: this.tableHeaders['superAllocation'],
            ruleData: {
                classificationList: [],
                serviceCodeList: []
            },
            dialogStatus: 'add',
            tableHeight: 300,
            totalCount: 0,
            dialogVisible: false,
            loading: false,
        }
    },
    created() {
      this.$nextTick(()=>{
        let height = window.innerHeight - this.$refs.supserAllocation.$el.offsetHeight - 250;
        if(height < 300){
          this.tableHeight = 300;
        }else{
          this.tableHeight = height;
        }
      })
    },
    mounted() {
        this.selection(1)
    },
    methods: {
        //查询
        selection(val) {
            this.tableData = []
            this.loading = true
            if (val === 1) {
                this.selectionData.page = 1
            }
            queryShipperAccountRule(this.selectionData).then(res => {
                this.loading = false
                if (res.code === 200) {
                    this.tableData = res.data.list
                    this.totalCount = res.data.total
                } else {
                    this.msgWarning(res.msg)
                }
            }).catch(err => {
                this.loading = false
                console.log(err)
            })
        },
        //新增
        add() {
            this.dialogStatus = 'add'
            this.dialogVisible = true
        },
        //修改
        update(val, status) {
            this.dialogStatus = status
            queryShipperAccountRuleById({ id: val.id }).then(res => {
                if (res.code === 200) {
                    this.ruleData = res.data
                    if (this.ruleData.classificationList == null || this.ruleData.classificationList.length < 1) {
                        this.ruleData.classificationList = []
                    }
                    if (this.ruleData.serviceCodeList == null || this.ruleData.serviceCodeList.length < 1) {
                        this.ruleData.serviceCodeList = []
                    }
                    if (status == 'copy') {
                        this.ruleData.id = undefined
                    }
                    this.dialogVisible = true
                } else {
                    this.msgWarning(res.msg)
                }
            }).catch(err => {
                console.log(err)
            })
        },
        //删除
        del(val) {
            getReleaseWeight({ id: val.id }).then(res => {
                if (res.code === 200) {
                    this.$confirm(`是否要删除记录！预计释放舱位${res.data}`, "注意！", {
                        confirmButtonText: "确定",
                        cancelButtonText: '取消',
                        type: "warning",
                    }).then(() => {
                        changeStatusById({ id: val.id, status: 2 }).then(res => {
                            if (res.code === 200) {
                                this.msgSuccess(`删除成功！已释放舱位${res.data}`)
                                this.selection(1)
                            } else {
                                this.msgWarning(res.msg)
                            }
                        }).catch(err => {
                            console.log(err)
                        })
                    }).catch(() => { })
                } else {
                    this.msgWarning(res.code)
                }
            }).catch(err => {
                console.log(err)
            })
        },
        //停用启用
        changeStatus(val) {
            let status = 0
            let tip = ''
            if (val.status == 0) {
                status = 1
                tip = '启用'
            } else if (val.status == 1) {
                status = 0
                tip = '停用'
            }
            if (tip === "停用") {
                getReleaseWeight({ id: val.id }).then(res => {
                    if (res.code === 200) {
                        this.$confirm(`预计释放舱位为${res.data},是否确定！`, "注意！", {
                            confirmButtonText: "确定",
                            cancelButtonText: '取消',
                            type: "warning",
                        }).then(() => {
                            this.statusChange({ id: val.id, status: status })
                        }).catch(() => { })
                    } else {
                        this.msgWarning(res.msg)
                    }
                }).catch(err => {
                    console.log(err)
                })
            } else {
                this.$confirm(`是否要${tip}记录！`, "注意！", {
                    confirmButtonText: "确定",
                    cancelButtonText: '取消',
                    type: "warning",
                }).then(() => {
                    this.statusChange({ id: val.id, status: status })
                }).catch(() => { })
            }
        },
        //复制
        copy(val) {
            this.dialogStatus = 'copy'
            this.ruleData = JSON.parse(JSON.stringify(val))
            this.ruleData.id = undefined
            this.dialogVisible = true
        },
        //状态修改请求
        statusChange(val) {
            changeStatusById(val).then(res => {
                if (res.code === 200) {
                    if (val.tip == '停用') {
                        this.msgSuccess(`${val.tip}成功！已释放${res.data}`)
                    } else {
                        this.msgSuccess(`${val.tip}成功！`)
                    }
                    this.selection(1)
                } else {
                    this.msgWarning(res.msg)
                }
            }).catch(err => {
                console.log(err)
            })
        },
        //关闭
        close() {
            this.dialogVisible = false
            this.ruleData = {}
            this.selection(1)
        },
        //翻页
        currentChange(val) {
            this.selectionData.page = val.page
            this.selection()
        },
    }
}

</script>

<style lang="scss" scoped>

</style>