<template>
    <div>
        <div class="divborder newSearchDiv" style="margin:0px;">
        <div class="filter">
            <label>{{$t('100089')}}：</label>
            <Select
            v-model="productname"
            label-in-value
            clearable
            filterable
            remote
            :remote-method="remoteMethod1"
            :loading="loading1"
            class="searchSelect"
            >
            <Option
                v-for="(item,index) in products"
                :value="item.code"
                :key="index"
            >{{ item.name }}({{item.code}})</Option>
            </Select>
        </div>
        <div class="filter">
            <label>{{$t('100390')}}：</label>
            <Select v-model="materialId" label-in-value clearable class="searchSelect">
            <Option
                v-for="item in materiallist"
                :value="item.pn"
                :key="item.id"
            >{{item.pn}} {{ item.name }} {{item.spec}}</Option>
            </Select>
        </div>
        <div class="searchBtn">
            <Button type="primary" class="twoWord" icon="ios-search" @click="tosearch()">{{$t('1001')}}</Button>
            <Button type="success" class="twoWord" icon="md-add-circle" @click="add()">{{$t('1002')}}</Button>
            <Button type="warning" class="twoWord" icon="ios-create-outline" @click="edit()">{{$t('1003')}}</Button>
            <Button type="error" class="twoWord intervalRight" icon="md-close-circle" @click="del()">{{$t('1004')}}</Button>
            <Button type="primary" class="fourWord" icon="md-download" @click="loadexcel()">{{$t('1005')}}</Button>
            <Upload
                    style="display:inline-block"
                    ref="upload"
                    :action="action"
                    name="excel-file"
                    :headers="headers"
                    :show-upload-list="false"
                    :on-format-error="handleFormatError"
                    :on-success="handleSuccess"
                    :on-error="handleError"
                    :format="['xlsx']"
                >
                    <Button type="primary" class="fourWord" icon="md-cloud-upload">{{$t('1006')}}</Button>
            </Upload>
            <Button type="primary" class="fourWord" icon="ios-cloud-download" @click="downexcel()">{{$t('1007')}}</Button>
        </div>
        </div>

        <div class="divborder newTableDiv">
            <Table
                @on-current-change="handleRowChange"
                @on-selection-change="handleSelectRow"
                highlight-row
                :data="tableData1"
                :columns="tableColumns1"
                class="tableClass"
            ></Table>
            <div class="pageDiv">
                <div class="pageDirection">
                    <Page
                        :total="total"
                        :current="page"
                        :page-size="pagesize"
                        @on-change="changePage"
                        show-elevator
                        show-sizer
                        show-total
                        @on-page-size-change="handlePageSize"
                        :page-size-opts="[10,20,30,40,100]"
                    ></Page>
                </div>
            </div>
        </div>

        <!-- 弹窗 -->
        <Modal class="newModalClass" :title="title1" v-model="addmodal" :styles="{width:'650px'}">
            <div class="modal_body">
                <div class="filter">
                    <label><i>*</i>{{$t('100089')}}：</label>
                    <Select v-model="productname1"
                        label-in-value
                        clearable
                        filterable
                        remote
                        :remote-method="remoteMethod2"
                        :loading="loading2"
                        class="searchSelect">
                        <Option v-for="(item,index) in addproducts" :value="item.code" :key="index">{{ item.name }}({{item.code}})</Option>
                    </Select>
                </div>
                <div class="filter">
                    <label><i>*</i>{{$t('100390')}}：</label>
                    <Select v-model="materialId1" label-in-value clearable class="searchSelect">
                    <Option
                        v-for="item in addmateriallist"
                        :value="item.pn"
                        :key="item.id"
                    >{{item.pn}} {{ item.name }} {{item.spec}}</Option>
                    </Select>
                </div>
                <div class="filter">
                    <label><i>*</i>{{$t('5500308')}}：</label>
                    <Select v-model="region1" label-in-value clearable class="searchSelect">
                    <Option
                        v-for="(item,index) in regionlist"
                        :value="item.dkey"
                        :key="index"
                    >{{item.dval}}</Option>
                    </Select>
                </div>
                <div class="filter">
                    <label><i>*</i>{{$t('5500309')}}：</label>
                    <InputNumber :min="0" class="searchInput" type="text" id="add_ic" v-model="number" />
                </div>
                   
            </div>
            <div slot="footer">
                <Button type="text" size="large" @click="addmodal = false">{{$t('1033')}}</Button>
                <Button type="primary" size="large" @click="addPost()">{{$t('1002')}}</Button>
            </div>
        </Modal>

    </div>
</template>

<script>
import axios from "@/libs/api.request";
export default {
    data() {
        return {
            loading1: false,
            loading2:false,
            productname: "",
            products: [],
            materialId: "",
            materiallist: [],
            headers: {
                token: localStorage.getItem('token'),
                timestamp: localStorage.getItem('timestamp'),
                nonce: localStorage.getItem('nonce'),
                sign: localStorage.getItem('sign')
            },
            action:
                this.axios.publicPath +
                '/acc/Upload/UploadExcel?templateName=PackingFullQtyInfo',
            page:1,
            pagesize:10,
            total:0,
            tableData1:[],
            tableColumns1:[
                {
                    type: 'selection',
                    width: 80
                },
                {
                    type: 'index2',
                    title: this.$t('1008'),
                    key: 'xuhao',
                    render: (h, params) => {
                        return h(
                            'span',
                            params.index + (this.page - 1) * this.pagesize + 1
                        );
                    },
                    width: 80
                },
                {
                    title:'产品编号',
                    key:'productid_value'
                },
                {
                    title:'料号',
                    key:'pn_value'
                },
                {
                    title:'出货地',
                    key:'region_value'
                },
                {
                    title:'满箱数量',
                    key:'qty'
                },
                {
                    title:'维护人',
                    key:'uid_value'
                },
                {
                    title:'维护时间',
                    key:'transdatetime'
                }
            ],
            title1:this.$t('1002'),
            addmodal:false,
            productname1:'',
            addproducts:[],
            materialId1:'',
            addmateriallist:[],
            region1:'',//出货地
            regionlist:[],
            number:0,
            actionType:1,//1添加 2修改
            selectids:[],
        }
    },
    created(){
        this.iniproducts("");
        this.loadMaterial();
        this.getregionlist()
        this.tosearch();
    },
    methods:{
        add(){
            this.title1 = this.$t('1002')
            this.addmodal = true;

            this.productname1 = ''
            this.materialId1 = ''
            this.region1 =''
            this.number = 0
            this.actionType = 1 //添加
        },
        addPost(){
            if(!this.productname1){
                this.$Message.error(this.$t('9000140'))
                return false;
            }
            if(!this.materialId1){
                this.$Message.error(this.$t('9000222'))
                return false;
            }
            if(!this.region1){
                this.$Message.error(this.$t('5500310'))
                return false;
            }
            if(!this.number){
                this.$Message.error(this.$t('9000256'))
                return false;
            }

            let url = '';
            let id = 0;
            if(this.actionType===1){
                //添加
                id=0;
                url = '/acc/PackingFullQty/add';
            }else{
                //修改
                id = this.obj.id;
                url = '/acc/PackingFullQty/Modify';
            }
            var data = {
                id:id,
                productid:this.productname1,
                pn:this.materialId1,
                region:this.region1,
                qty:this.number
            }
            axios.request({
                    url: url,
                    data,
                    method: "POST",
                })
                .then((res) => {
                    if (res.data.ret === 1) {
                        this.addmodal = false
                        if(this.actionType===1){
                            this.tosearch()
                            this.$Message.success(this.$t('1055'))
                            
                        }else{
                            this.search();
                            this.$Message.success(this.$t(1060)); // 提示
                        }
                    }
                    else{
                        this.$Message.error(this.$t(res.data.msg+''))
                    }
            });
        },
        edit(){
            if(this.obj===undefined||this.obj.id===undefined){
                this.$Message.error(this.$t('1017'));
                return false;
            }
            this.productname1 = this.obj.productid;
            this.materialId1 = this.obj.pn;
            this.region1 = this.obj.region;
            this.number = this.obj.qty;
            this.title1 = this.$t('1003')
            this.addmodal = true
            this.actionType = 2 //修改
        },
        del(){
            if(this.selectids===null||this.selectids===undefined||this.selectids.length === 0){
                this.$Message.error(this.$t('1017'));
                return false;
            }
            var params = {
                id: this.selectids.join()
            };
            this.$Modal.confirm({
                title: this.$t('1018'),
                content: '',
                width: '290px',
                closable: true,
                okText: this.$t('1004'),
                onOk: () => {
                    axios
                        .request({
                            url: '/acc/PackingFullQty/Delete',
                            params,
                            method: 'get'
                        })
                        .then(res => {
                            if (res.data.ret === 1) {
                                this.selectids = []
                                this.$Message.success(this.$t('1058'));
                                this.search();
                            } else {
                                this.$Message.error(this.$t(res.data.msg));
                            }
                        });
                }
            });
        },
        tosearch(){
            this.page = 1;
            this.pagesize = 10;
            this.search();
        },
        search(){
            var params = {
                productid:this.productname,
                pn:this.materialId,
                page:this.page,
                pagesize:this.pagesize
            }
            this.selectids = []
            axios.request({
                    url: "/acc/PackingFullQty/getList",
                    params,
                    method: "get",
                })
                .then((res) => {
                    this.total = 0;
                    let data = res.data.data;
                    if (res.data.ret===1&&Array.isArray(data)&&data.length >0) {
                        this.tableData1 = data;
                        this.total = res.data.total;
                    }
            });
        },
        getregionlist(){
            axios.request({
                    url: "/config/Dict/GetDictByCat?cat=region",
                    method: "get",
                })
                .then((res) => {
                    this.regionlist = []
                    if (res.data.ret === 1 && res.data.data.length > 0) {
                        this.regionlist = res.data.data;
                    }
            });
        },
        iniproducts(name) {
            var params = {
                name: name,
                count: 50,
            };
            axios
                .request({
                url: "/config/ProjectProduct/GetProductsByCode",
                params,
                method: "get",
                })
                .then((res) => {
                if (res.data.ret === 1 && res.data.data.length > 0) {
                    this.products = res.data.data;
                    this.addproducts = res.data.data;
                }
            });
        },
        remoteMethod1(name) {
            if (name !== "") {
                this.loading1 = true;
                setTimeout(() => {
                    this.loading1 = false;
                    this.iniproducts(name);
                }, 200);
            } else {
                this.iniproducts("");
            }
        },
        remoteMethod2(name) {
            if (name !== "") {
                this.loading2 = true;
                setTimeout(() => {
                    this.loading2 = false;
                    this.iniproducts(name);
                }, 200);
            } else {
                this.iniproducts("");
            }
        },
        // 加载全部物料
        loadMaterial() {
            axios
                .request({
                url: "config/Material/GetMaterialList",
                method: "get",
                })
                .then((res) => {
                if (res.data.ret === 1) {
                    this.materiallist = res.data.data;
                    this.addmateriallist = res.data.data;
                } else {
                    // this.$Message.error(this.$t(res.data.msg));
                }
            });
        },
        loadexcel () {
            axios
                .request({
                    url: '/config/download/GetTemplate?name=PackingFullQtyInfo',
                    method: 'get'
                })
                .then(res => {
                    if (res.data.ret === 1) {
                        window.location.href =
                            axios.publicPath + '' + res.data.data;
                    } else {
                        this.$Message.error(this.$t(res.data.msg));
                    }
                });
        },
        downexcel () {
            var params = {
                productid:this.productname,
                pn:this.materialId
            };
            axios
                .request({
                    url: '/acc/PackingFullQty/exportAll',
                    params,
                    method: 'get'
                })
                .then(res => {
                    if (res.data.ret === 1) {
                        window.location.href =
                            axios.publicPath + '' + res.data.data;
                    } else {
                        this.$Message.error(this.$t(res.data.msg))
                    }
                });
        },
        handleFormatError (file) {
            this.$Message.error(this.$t('920162') +
                    ' ' +
                    file.name +
                    ' ' +
                    this.$t('2010005'))
        },
        handleSuccess (res, file) {
            if (res.ret == 1) {
                this.search();
                this.$Message.success(this.$t('950398'));
            } else {
                if (('' + res.msg).indexOf(',') != -1) {
                    inittip(res.msg);
                } else {
                    this.$Message.error(this.$t('' + res.msg));
                }
            }
        },
        handleError () {
            this.$Message.error(this.$t('2010006') + '!');
        },
        handlePageSize (value) {
            this.pagesize = value;
            this.tableData1 = this.search();
        },
        changePage (value) {
            this.page = value;
            this.tableData1 = this.search();
        },
        handleRowChange (currentRow, oldCurrentRow) {
            this.obj = currentRow;
        },
        handleSelectRow: function (data) {
            this.selectids = [];
            for (var i in data) {
                if (this.selectids.indexOf(data[i].id) < 0) {
                    this.selectids.push(data[i].id);
                }
            }
        }
    }
}
</script>

<style lang="less" scoped>

</style>
