<template>
    <div :value="toolData" :data="tool_id">
        <i-button type="primary" icon="ios-search" @click="SelectToolModal">选择刀具</i-button>
        <Modal title="选择刀具" v-model="toolSelectorModal" :styles="{top: '40px',width:'850px'}">
            <div class="modal_body" style="overflow-y:auto;">
                <div style="width:100%;max-height:300px;">
                    <div class="filter">
                        <input
                            class="publicinput"
                            type="text"
                            v-model="toolSelector_brand"
                            placeholder="请输入品牌名称"
                        />
                        <input
                            class="publicinput ml5"
                            type="text"
                            v-model="toolSelector_toolKeyword"
                            placeholder="请输入刀具名称/图纸号"
                        />
                        <Button class="ml5" type="primary" @click="search">{{$t('1001')}}</Button>
                    </div>
                    <Table
                        style="margin-top:10px"
                        @on-current-change="handleRowChange"
                        highlight-row
                        :data="tableData1"
                        :columns="tableColumns1"
                    ></Table>
                </div>
            </div>
        </Modal>
    </div>
</template>

<script>
import axios from '@/libs/api.request';
export default {
    name: 'tool',
    data () {
        return {
            toolData: {
                id: 0,
                tool_name: '',
                tool_drawingcode: ''
            },
            tool_id: 0,
            toolSelector_brand: '',
            toolSelector_toolKeyword: '',
            tableData1: [],
            toolSelectorModal: false,
            tableColumns1: [
                {
                    type: 'index2',
                    title: '序号',
                    key: 'order',
                    render: (h, params) => {
                        return h('span', params.index + 1);
                    },
                    width: 60
                },
                {
                    title: '刀具名称',
                    key: 'name'
                },
                {
                    title: '刀具图纸号',
                    key: 'drawingcode'
                },
                {
                    title: '刀具品牌',
                    key: 'brand'
                },
                {
                    title: '规格',
                    key: 'spec'
                },
                {
                    title: '材料',
                    key: 'material'
                },
                {
                    title: '硬度',
                    key: 'hardness'
                },
                {
                    title: '供应商',
                    key: 'supplier'
                }
            ]
        };
    },
    created () {
        this.tableColumns1 = this.$time.initTableTitle(this.tableColumns1);
    },
    methods: {
        SelectToolModal () {
            this.initModal();
            this.toolSelectorModal = true;
        },
        initModal () {
            this.search();
            this.toolData = {
                id: 0,
                tool_name: '',
                tool_drawingcode: ''
            };
            this.tool_id = 0;
            this.toolSelector_toolKeyword = '';
        },
        search () {
            let data = {
                brand: this.toolSelector_brand,
                toolfilter: this.toolSelector_toolKeyword,
                count: 50
            };
            axios
                .request({
                    url: '/tools/ToolConfig/ToolList',
                    data,
                    method: 'post'
                })
                .then((res) => {
                    // let data = [];
                    // res.data.data.forEach((item) => {
                    //     if (item) {
                    //         data.push({
                    //             tool_drawingcode: item.drawingcode,
                    //             tool_name: item.name,
                    //             id: item.id,
                    //         });
                    //     }
                    // });
                    this.tableData1 = res.data.data;
                });
        },
        handleRowChange (currentRow, oldCurrentRow) {
            this.toolData = {
                tool_id: currentRow.id,
                tool_name: currentRow.name,
                tool_drawingcode: currentRow.drawingcode
            };
            this.tool_id = currentRow.id;
            this.toolSelectorModal = false;
            this.$emit('activeName', this.toolData);
        }
    }
};
</script>
