<template>
  <div class="testdiv">
    <!--<div class="divborder">
      <h3>扫描信息</h3>
      <div>
        <div class="filter">
          <label>来料二维码<i style="color:red;margin-left: 5px!important;margin-top: -5px!important" >*</i>:</label>
          <input class="publicinput" type="text" v-model="editobj.incomingsn" style="width:800px;" @keyup.enter="getsninfo"/>
        </div>
      </div>
    </div>-->
    <div class="divborder newSearchDiv" style="margin:0px;">
      <h3>{{$t('300018')}}</h3>
      <div>
        <div class="filter">
          <label ><i>*</i>{{this.$t('1132')}}：</label>
          <Cascader :data="datalevel" :value="leveldata" trigger="click" v-model="sectionid" @on-change="handlelevelchange" change-on-select class="searchSelect"></Cascader>
        </div>
        <div class="filter">
          <label><i>*</i>{{$t('920165')}}：</label>
          <Select v-model="editobj.materialid" label-in-value clearable filterable @on-change="initsuppliers" class="searchSelect" >
              <Option v-for="item in materials" :value="item.id" :key="item.id">{{ item.id > 0 ? item.name+"【"+ item.pn +"】" + "【" + item.spec + "】" : item.name }}</Option>
          </Select>
        </div>
        <div class="filter">
          <label >{{$t('600011')}}：</label>
          <Select v-model="editobj.supplierid" label-in-value clearable class="searchSelect" >
              <Option v-for="item in suppliers" :value="item.id" :key="item.id">{{ item.name }}</Option>
          </Select>
        </div>
        <div class="filter">
          <label >{{$t('1950522')}}：</label>
          <Input class="searchInput" type="text" v-model="editobj.batchnumber" />
        </div>
         <!-- 次级搜索条件--隐藏 -->
                <div v-show="!morecondition">
        <div class="filter">
          <label ><i>*</i>{{$t('1950517')}}：</label>
          <InputNumber  class="searchInput" type="text" v-model="editobj.totalquantity"  @blur.native.capture="GetValueColums"/>
        </div>
        <div class="filter">
          <label >PO：</label>
          <Input type="text" v-model="editobj.PO" class="searchInput"/>
        </div>
        <div class="filter">
          <label>{{$t('1950644')}}：</label>
          <DatePicker
            id="日期"
            type="date"
            v-model="date"
            confirm
            placeholder=""
            class="searchInput middleWidth"
            format="yyyy-MM-dd"
          ></DatePicker>
        </div>
                </div>
        <!--<div class="filter">
          <label >{{$t('1950523')}}<i style="color:red;margin-left: 5px!important;margin-top: -5px!important" >*</i>:</label>
          <InputNumber class="publicinput" type="text" v-model="editobj.randomchecknumber" style="width:200px;"/>
        </div>-->
        <!--<div class="filter">
          <label >{{$t('1950499')}}<i style="color:red;margin-left: 5px!important;margin-top: -5px!important" >*</i>:</label>
          <Select v-model="editobj.result" label-in-value clearable style="width:200px;" >
              <Option value="1" key="1">{{$t('1950546')}}</Option>
              <Option value="2" key="2">{{$t('900942')}}</Option>
              <Option value="3" key="3">{{$t('1950547')}}</Option>
              <Option value="4" key="4">{{$t('1950548')}}</Option>
          </Select>
        </div>-->
      </div>
      <!-- 更多条件 按钮 -->
      <MoreConbtn @getCon="morecondition = !morecondition" :morecondition="morecondition"></MoreConbtn>
    </div>
    <div class="divborder newTableDiv">
      <h3>{{$t('1950508')}}</h3>
      <div>
          <div :class='table_scrollx?"materialdatacollection_table":""' style="width:100%;float:left;height:100%;padding-left:5px;">
              <template>
                  <Table :columns="columns" :data="tableData" v-show="detailshow" ref="detailTable" :max-height="500">
                      <template slot-scope="{ row, index }" slot="xuhao">
                          <span>{{ row.xuhao }}</span>
                      </template>
                      <template slot-scope="{ row, index }" slot="item">
                          <span>{{ row.item }}</span>
                      </template>
                      <template slot-scope="{ row, index }" slot="samplequantity">
                          <span>{{ row.samplequantity }}</span>
                      </template>
                      <template slot-scope="{ row, index }" slot="standard">
                          <span>{{ row.standard }}</span>
                      </template>
                      <template slot-scope="{ row, index }" slot="min_value">
                          <span>{{ row.min_value }}</span>
                      </template>
                      <template slot-scope="{ row, index }" slot="max_value">
                          <span>{{ row.max_value }}</span>
                      </template>
                      <template slot-scope="{ row, index }" slot="range">
                          <span>{{ row.range }}</span>
                      </template>

                      <template v-for="(item, i) in editobj.randomchecknumber" slot-scope="{ row, index }" :slot="'min_value'+(i+1)">
                        <span v-show="tableData[index].checktype === 2 && tableData[index].valuecategory === 2">
                          <inputNumber class="publicinput" :class="{active_class:((tableData[index]['min_value'+(i+1)])?(tableData[index]['min_value'+(i+1)]<row.min_value || tableData[index]['min_value'+(i+1)]>row.max_value) : false)}"  type="text" v-model="tableData[index]['min_value'+(i+1)]" style="width:100px" @blur.native.capture="getrange(index, i+1)"/>
                        </span>
                      </template>
                      <template v-for="(item, i) in editobj.randomchecknumber" slot-scope="{ row, index }" :slot="'max_value'+(i+1)">
                        <span v-show="tableData[index].checktype === 2 && tableData[index].valuecategory === 2">
                          <inputNumber class="publicinput" type="text" v-model="tableData[index]['max_value'+(i+1)]" :class="{active_class:((tableData[index]['max_value'+(i+1)])?(tableData[index]['max_value'+(i+1)]<row.min_value || tableData[index]['max_value'+(i+1)]>row.max_value):false)}"  style="width:100px" @blur.native.capture="getrange(index, i+1)"/>
                        </span>
                      </template>
                      <template v-for="(item, i) in editobj.randomchecknumber" slot-scope="{ row, index }" :slot="'value'+(i+1)">
                        <span v-if="tableData[index].checktype === 1">
                          <RadioGroup v-model="tableData[index]['value'+(i+1)]">
                            <Radio label="OK" style="width:30px">OK</Radio>
                            <Radio label="NG" style="width:30px">NG</Radio>
                          </RadioGroup>
                        </span>
                        <span v-else-if="tableData[index].checktype === 2">
                          <inputNumber :disabled="tableData[index].checktype === 2 && tableData[index].valuecategory === 2" :class="{active_class:((tableData[index]['value'+(i+1)])?(tableData[index]['value'+(i+1)]<row.min_value || tableData[index]['value'+(i+1)]>row.max_value):false)}" class="publicinput" type="text" v-model="tableData[index]['value'+(i+1)]" style="width:100px;"/>
                        </span>
                        <span v-else-if="tableData[index].checktype === 0">
                          <input class="publicinput" type="text" v-model="tableData[index]['value'+(i+1)]" style="width:100px"/>
                        </span>
                      </template>
                      <template v-for="(item, i) in editobj.randomchecknumber" slot-scope="{ row, index }" :slot="'range'+(i+1)">
                        <span v-show="tableData[index].checktype === 2 && tableData[index].valuecategory === 2">
                          <inputNumber :disabled="true" class="publicinput" type="text" v-model="tableData[index]['range'+(i+1)]" :class="{active_class:((tableData[index]['range'+(i+1)]) ? tableData[index]['range'+(i+1)] > tableData[index]['range'] : false)}" style="width:100px;font-color:black;"/>
                        </span>
                      </template>
                  </Table>
              </template>
          </div>
        </div>
    </div>
    <div class="divborder">
      <h3>{{$t('1950524')}}</h3>
      <div>
        <div class="core1">
          <label style="width:100px">{{$t('600528')}}：</label>
        </div>
        <div class="core2">
          <div class="demo-upload-list" v-for="item in uploadList" style="margin-left:5px;vertical-align:top">
            <template v-if="item.status === 'finished'">
                <img :src="host+item.url">
                <div class="demo-upload-list-cover">
                    <Icon type="ios-eye-outline" @click.native="handleView(item.url)"></Icon>
                    <Icon type="ios-trash-outline" @click.native="handleRemove(item)"></Icon>
                </div>
            </template>
            <template v-else>
                <Progress v-if="item.showProgress" :percent="item.percentage" hide-info></Progress>
            </template>
          </div>
          <Upload
            ref="upload"
            :action="host+'qms/Upload/NewUploadImage'"
            :show-upload-list="false"
            :default-file-list="defaultList"
            :on-success="handleSuccess_image"
            :format="['jpg','jpeg','png','gif']"
            :on-format-error="handleFormatError_image"
            :on-exceeded-size="handleMaxSize"
            :before-upload="handleBeforeUpload"
            multiple
            type="drag"
            style="display: inline-block;width:118px;vertical-align:top;margin-left:5px;">
            <div style="width: 118px;height:118px;line-height: 118px;">
                <Icon type="ios-camera" size="40"></Icon>
            </div>
          </Upload>
        </div>
        <div class="chartdiv1">
          <label style="width:100px">{{$t('600276')}}：</label>
        </div>
        <div class="chartdiv2">
          <template>
            <Upload
                ref="uploadfile"
                :action="host+'qms/Upload/NewUploadImage'"
                :on-success="handleSuccess_file"
                :on-format-error="handleFormatError_file"
                :on-exceeded-size="handleMaxSize_file"
                :before-upload="handleBeforeUpload_file"
                style="display: inline-block;vertical-align:top;margin-left:5px"
                multiple
                type="drag">
                <div style="padding: 20px 0;width:500px">
                    <Icon type="ios-cloud-upload" size="20" style="color: #3399ff"></Icon>
                    <p>{{$t('1950525')}}</p>
                </div>
            </Upload>
          </template>
        </div>
      </div>
    </div>
    <div class="divborder">
        <h3 >{{$t('1030')}}</h3>
        <Input type="textarea" v-model="editobj.remark" style="width:100%;height:auto;"/>
    </div>
    <div style="padding-top:10px">
      <Button type="primary" :loading="loading" @click="checkdata" style="float:right;">
          <span v-if="!loading">{{$t('900306')}}</span>
          <span v-else>Loading...</span>
      </Button>
      <!--<Button type="primary" style="float:right;" size="large" @click="savedata">{{$t('900306')}}</Button>-->
    </div>
    <Modal :title="$t('1950515')" v-model="visible">
      <img :src="imgName" v-if="visible" style="width: 100%">
    </Modal>
    <div>
      <Modal v-model="ngmodal" :styles="{top: '40px',width:'900px'}">
        <div class="modal_body" style="width:900px!important;padding:0 0px;height:400px!important;">
          <div class="divboder">
            <label style="width:100px">{{$t('1950601')}}<i style="color:red;margin-left: 5px!important;margin-top: -5px!important" >*</i>:</label>
            <div style="width:870px;float:left;height:100%;padding-left:5px;overflow-y:scroll">
                <Table :columns="ngcolumns" :data="ngtableData"></Table>
            </div>
          </div>
        </div>
        <div slot="footer">
          <!--<Button type="primary" :loading="loading1" @click="savedata1">
            <span v-if="!loading1">{{$t('900942')}}</span>
            <span v-else>{{$t('900942')}}</span>
          </Button>-->
          <Button type="primary" :loading="loading2" @click="savedata2">
            <span v-if="!loading2">{{$t('1950547')}}</span>
            <span v-else>{{$t('1950547')}}</span>
          </Button>
          <Button type="primary" :loading="loading3" @click="savedata3">
            <span v-if="!loading3">{{$t('1950548')}}</span>
            <span v-else>{{$t('1950548')}}</span>
          </Button>
        </div>
      </Modal>
    </div>
  </div>
</template>

<script>
import axios from '@/libs/api.request'

export default{
    data () {
        return {
            morecondition: false, // 条件
            headers: {
                token: localStorage.getItem('token'),
                timestamp: localStorage.getItem('timestamp'),
                nonce: localStorage.getItem('nonce'),
                sign: localStorage.getItem('sign')
            },
            table_scrollx: false,
            leveldata: [],
            datalevel: [],
            editobj: {
                totalquantity: null,
                randomchecknumber: null
            },
            suppliers: [],
            detailshow: true,
            tableData: [],
            page: 1,
            pagesize: 10,
            columns: [
                {
                    type: 'index',
                    title: this.$t('1008'),
                    slot: 'xuhao',
                    width: 70
                },
                {
                    title: this.$t('901048'),
                    slot: 'item'
                },
                {
                    title: this.$t('1950523'),
                    key: 'samplequantity'
                },
                {
                    title: this.$t('950245'),
                    slot: 'standard'
                },
                {
                    title: this.$t('200060'),
                    slot: 'min_value'
                },
                {
                    title: this.$t('200059'),
                    slot: 'max_value'
                },
                {
                    title: this.$t('8000032'),
                    slot: 'range'
                }
            ],
            defaultList: [],
            imgName: '',
            visible: false,
            uploadList: [],
            uploadList1: [],
            host: axios.publicPath,
            materials: [],
            materialid: 0,
            sectionid: [],
            loading: false,
            active_bool: false,
            resultData: {},
            loading1: false,
            loading2: false,
            loading3: false,
            ngmodal: false,
            ngtableData: [],
            ngcolumns: [
                {
                    type: 'index',
                    title: this.$t('1008'),
                    key: 'xuhao',
                    width: 70
                },
                {
                    title: this.$t('901048'),
                    key: 'item'
                },
                {
                    title: this.$t('950245'),
                    key: 'standard'
                },
                {
                    title: this.$t('200060'),
                    key: 'min_value'
                },
                {
                    title: this.$t('200059'),
                    key: 'max_value'
                },
                {
                    title: this.$t('1950619'),
                    key: 'range'
                },
                {
                    title: this.$t('800195'),
                    key: 'result'
                },
                {
                    title: this.$t('8000030'),
                    key: 'lowerlimit'
                },
                {
                    title: this.$t('8000031'),
                    key: 'upperlimit'
                },
                {
                    title: this.$t('1950610'),
                    key: 'value'
                },
                {
                    title: this.$t('1950620'),
                    key: 'actual_range'
                }
            ],
            date: ''
        }
    },
    created () {
        var date = new Date();
        var year = date.getFullYear();
        var month = date.getMonth() + 1;
        var day = date.getDate();
        if (month < 10) {
            month = '0' + month;
        }
        if (day < 10) {
            day = '0' + day;
        }
        var nowDate = year + '-' + month + '-' + day;
        this.date = nowDate;
        this.initlevel();
    },
    updated () {

    },
    methods: {
        selectfirstsection (dataLevel) {
            if (dataLevel.length > 0) {
                this.sectionid.push(dataLevel[0].value)
                dataLevel = dataLevel[0].children
                this.selectfirstsection(dataLevel)
            } else {
                this.handlelevelchange(this.sectionid)
            }
        },
        getrange (index, i) {
            var maxValue = this.tableData[index]['max_value' + i]
            var minValue = this.tableData[index]['min_value' + i]
            if (maxValue !== '' && maxValue !== null && maxValue !== undefined && minValue !== '' && minValue !== null && minValue !== undefined) {
                this.tableData[index]['range' + i] = Math.round((this.tableData[index]['max_value' + i] - this.tableData[index]['min_value' + i]) * 10000) / 10000
                this.tableData[index]['value' + i] = Math.round((this.tableData[index]['max_value' + i] + this.tableData[index]['min_value' + i]) / 2 * 10000) / 10000
            } else {
                this.tableData[index]['range' + i] = ''
            }
        },
        handlelevelchange (value) {
            this.leveldata = value
            var sectionid = value[value.length - 1]
            this.initmaterials(sectionid)
        },
        getsninfo () {
            axios.request({
                url: '/qms/IncomingMaterial/CheckIncomingSn?sn=' + this.editobj.incomingsn,
                method: 'get'
            }).then(res => {
                var data = res.data.data
                this.editobj.totalquantity = data.quantity
                this.editobj.batchnumber = data.batchnumber
                this.editobj.partno = data.partno
                this.editobj.materialid = data.materialid
                this.materials = [{
                    id: data.materialid,
                    pn: data.partno,
                    name: data.partno,
                    spec: data.spec
                }]
            })
        },
        checkdata () {
            this.editobj.sectionid = this.sectionid[this.sectionid.length - 1]
            let data = this.editobj
            data.details = []
            data.images = []
            data.files = []
            var details = this.$refs.detailTable.data
            if (data.totalquantity === null || data.totalquantity === undefined) {
                this.$Message.error(this.$t('1054'))
                return
            }
            if (data.randomchecknumber === null || data.randomchecknumber === undefined) {
                this.$Message.error(this.$t('1054'))
                return
            }
            if (data.totalquantity < data.randomchecknumber) {
                this.$Message.error(this.$t('1950551'))
                return
            }
            var total = data.randomchecknumber

            var ngList = []
            var isMaxMin = false
            for (var i = 1; i <= total; i++) {
                details.forEach((ele, index) => {
                    if (index > 0) {
                        var sn = details[0]['value' + i]
                        var detail = {
                            index: i,
                            sn: (sn === null || sn === undefined) ? '' : sn,
                            itemid: ele.itemid,
                            checktype: ele.checktype
                        }
                        if (ele.checktype === 2) {
                            detail.value = ele['value' + i]
                            detail.lowerlimit = ele['min_value' + i]
                            detail.upperlimit = ele['max_value' + i]
                            detail.result = ''
                            if (ele.valuecategory === 1) {
                                if ((detail.value > ele.max_value && ele.max_value !== '') || (detail.value < ele.min_value && ele.min_value !== '')) {
                                    if (detail.value !== null && detail.value !== undefined && detail.value !== '') {
                                        ngList.push({
                                            item: ele.item,
                                            standard: ele.standard,
                                            checktype: ele.checktype,
                                            min_value: ele.min_value,
                                            max_value: ele.max_value,
                                            result: 'NG',
                                            value: detail.value,
                                            upperlimit: '',
                                            lowerlimit: '',
                                            range: '',
                                            actual_range: ''
                                        })
                                    }
                                }
                            } else if (ele.valuecategory === 2) {
                                isMaxMin = true
                                if ((detail.upperlimit > ele.max_value || detail.lowerlimit < ele.min_value || (detail.upperlimit - detail.lowerlimit) > ele.range ||
                  detail.upperlimit < ele.min_value || detail.lowerlimit > ele.max_value ||
                  (detail.value > ele.max_value && ele.max_value !== '') || (detail.value < ele.min_value && ele.min_value !== '')) &&
                  detail.upperlimit !== null && detail.upperlimit !== undefined && detail.upperlimit !== '' &&
                  detail.lowerlimit !== null && detail.lowerlimit !== undefined && detail.lowerlimit !== '') {
                                    ngList.push({
                                        item: ele.item,
                                        standard: ele.standard,
                                        checktype: ele.checktype,
                                        min_value: ele.min_value,
                                        max_value: ele.max_value,
                                        result: 'NG',
                                        value: detail.value,
                                        range: detail.range,
                                        upperlimit: detail.upperlimit,
                                        lowerlimit: detail.lowerlimit,
                                        range: ele.range,
                                        actual_range: ele['range' + i]
                                    })
                                }
                            }
                        } else if (ele.checktype === 1) {
                            detail.value = null
                            detail.result = ele['value' + i]
                            if (detail.result !== null && detail.result !== undefined && detail.result !== '') {
                                if (detail.result.toUpperCase() === 'NG') {
                                    ngList.push({
                                        item: ele.item,
                                        standard: ele.standard,
                                        checktype: ele.checktype,
                                        min_value: ele.min_value,
                                        max_value: ele.max_value,
                                        result: 'NG',
                                        value: detail.value,
                                        upperlimit: '',
                                        lowerlimit: '',
                                        range: '',
                                        actual_range: ''
                                    })
                                }
                            }
                        }
                        data.details.push(detail)
                    } else {
                        var sn = details[0]['value' + i]
                        var detail = {
                            index: i,
                            sn: (sn === null || sn === undefined) ? '' : sn,
                            itemid: 0,
                            checktype: ele.checktype
                        }
                        data.details.push(detail)
                    }
                })
            }
            this.$refs.upload.fileList.forEach(ele => {
                var image = {
                    size: ele.size,
                    name: ele.name,
                    url: ele.url
                }
                data.images.push(image)
            })
            this.$refs.uploadfile.fileList.forEach(ele => {
                var file = {
                    size: ele.size,
                    name: ele.name,
                    url: ele.url
                }
                data.files.push(file)
            })

            data.result = '1'
            this.resultData = data
            if (ngList.length > 0) {
                if (!isMaxMin) {
                    this.ngcolumns = [
                        {
                            type: 'index',
                            title: this.$t('1008'),
                            key: 'xuhao',
                            width: 70
                        },
                        {
                            title: this.$t('901048'),
                            key: 'item'
                        },
                        {
                            title: this.$t('950245'),
                            key: 'standard'
                        },
                        {
                            title: this.$t('200060'),
                            key: 'min_value'
                        },
                        {
                            title: this.$t('200059'),
                            key: 'max_value'
                        },
                        {
                            title: this.$t('1950610'),
                            key: 'value'
                        },
                        {
                            title: this.$t('800195'),
                            key: 'result'
                        }
                    ]
                } else {
                    this.ngcolumns = [
                        {
                            type: 'index',
                            title: this.$t('1008'),
                            key: 'xuhao',
                            width: 70
                        },
                        {
                            title: this.$t('901048'),
                            key: 'item'
                        },
                        {
                            title: this.$t('950245'),
                            key: 'standard'
                        },
                        {
                            title: this.$t('200060'),
                            key: 'min_value'
                        },
                        {
                            title: this.$t('200059'),
                            key: 'max_value'
                        },
                        {
                            title: this.$t('1950619'),
                            key: 'range'
                        },
                        {
                            title: this.$t('800195'),
                            key: 'result'
                        },
                        {
                            title: this.$t('8000030'),
                            key: 'lowerlimit'
                        },
                        {
                            title: this.$t('8000031'),
                            key: 'upperlimit'
                        },
                        {
                            title: this.$t('1950610'),
                            key: 'value'
                        },
                        {
                            title: this.$t('1950620'),
                            key: 'actual_range'
                        }
                    ]
                }
                this.showNg(ngList)
                return
            }

            this.savedata()
        },
        showNg (ngList) {
            if (this.fullscreen) {
                this.isNeedFullScreen = true
                this.handleFullScreen1()
            }
            this.ngmodal = true
            this.ngtableData = []
            ngList.forEach(item => {
                this.ngtableData.push({
                    // id: item.id,
                    // itemid: item.itemid,
                    // checktype: item.checktype,
                    item: item.item,
                    standard: item.standard,
                    min_value: item.checktype === 2 ? (item.min_value === -999999999 ? '' : item.min_value) : '',
                    max_value: item.checktype === 2 ? (item.max_value === 999999999 ? '' : item.max_value) : '',
                    result: 'NG',
                    value: item.value,
                    upperlimit: item.upperlimit,
                    lowerlimit: item.lowerlimit,
                    range: item.range,
                    actual_range: item.actual_range
                })
            })
        },
        savedata () {
            var data = this.resultData
            data.date = this.date
            this.loading = true
            this.loading1 = true
            this.loading2 = true
            this.loading3 = true
            axios.request({
                url: '/qms/IncomingMaterial/Add',
                data,
                method: 'post'
            }).then(res => {
                if (res.data.ret === 1) {
                    this.$Message.success(this.$t('800223'))
                    this.editobj = { totalquantity: null, randomchecknumber: null }
                    this.tableData = []
                    this.$refs.upload.fileList = []
                    this.$refs.uploadfile.fileList = []
                    this.uploadList = []
                    this.sectionid = []
                    this.columns = [
                        {
                            type: 'index',
                            title: this.$t('1008'),
                            slot: 'xuhao',
                            width: 70
                        },
                        {
                            title: this.$t('901048'),
                            slot: 'item'
                        },
                        {
                            title: this.$t('1950523'),
                            key: 'samplequantity'
                        },
                        {
                            title: this.$t('950245'),
                            slot: 'standard'
                        },
                        {
                            title: this.$t('200060'),
                            slot: 'min_value'
                        },
                        {
                            title: this.$t('200059'),
                            slot: 'max_value'
                        },
                        {
                            title: this.$t('8000032'),
                            slot: 'range'
                        }
                    ]
                    this.detailshow = false
                    this.detailshow = true
                    this.selectfirstsection(this.datalevel)
                } else {
                    this.$Message.error(this.$t(res.data.msg))
                }
                this.resultData = {}
                this.loading = false
                this.loading1 = false
                this.loading2 = false
                this.loading3 = false
                this.ngmodal = false
            }).catch(() => {
                this.resultData = {}
                this.loading = false
                this.loading1 = false
                this.loading2 = false
                this.loading3 = false
                this.ngmodal = false
            })
        },
        savedata1 () {
            this.resultData.result = '2'
            this.savedata()
        },
        savedata2 () {
            this.resultData.result = '3'
            this.savedata()
        },
        savedata3 () {
            this.resultData.result = '4'
            this.savedata()
        },
        GetValueColums () {
            this.columns = [
                {
                    type: 'index',
                    title: this.$t('1008'),
                    slot: 'xuhao',
                    width: 70,
                    fixed: 'left'
                },
                {
                    title: this.$t('901048'),
                    slot: 'item',
                    minWidth: 200,
                    fixed: 'left'
                },
                {
                    title: this.$t('1950523'),
                    key: 'samplequantity',
                    minWidth: 100,
                    fixed: 'left'
                },
                {
                    title: this.$t('950245'),
                    slot: 'standard',
                    minWidth: 200,
                    fixed: 'left'
                },
                {
                    title: this.$t('500082'),
                    slot: 'min_value',
                    minWidth: 100,
                    fixed: 'left'
                },
                {
                    title: this.$t('500081'),
                    slot: 'max_value',
                    minWidth: 100,
                    fixed: 'left'
                },
                {
                    title: this.$t('8000032'),
                    slot: 'range',
                    minWidth: 80,
                    fixed: 'left'
                }
            ]
            this.tableData = []
            var sectionid = this.sectionid[this.sectionid.length - 1]
            axios.request({
                url: '/qms/InspectStandardMaterial/GetDetails?materialid=' + this.editobj.materialid + '&sectionid=' + sectionid + '&number=' + this.editobj.totalquantity,
                method: 'get'
            }).then(res => {
                var tablelist = res.data.data.details

                var isMaxMin = false
                tablelist.forEach(element => {
                    if (element.checktype === 2 && element.valuecategory === 2) {
                        isMaxMin = true
                    }
                });

                var cloumnLength = res.data.data.quantity
                this.editobj.randomchecknumber = cloumnLength
                for (var i = 1; i <= cloumnLength; i++) {
                    this.columns.push({
                        title: 'NO.' + i,
                        key: 'NO.' + i,
                        slot: 'NO.' + i,
                        align: 'center',
                        children: isMaxMin ? [
                            {
                                title: this.$t('500082'), // 最小值
                                key: 'min_value' + i,
                                slot: 'min_value' + i,
                                align: 'center',
                                minWidth: 120
                            },
                            {
                                title: this.$t('500081'), // 最大值
                                key: 'max_value' + i,
                                slot: 'max_value' + i,
                                align: 'center',
                                minWidth: 120
                            },
                            {
                                title: this.$t('1950610'), // 单值
                                key: 'value' + i,
                                slot: 'value' + i,
                                align: 'center',
                                minWidth: 120
                            },
                            {
                                title: this.$t('8000032'), // 极差
                                key: 'range' + i,
                                slot: 'range' + i,
                                align: 'center',
                                minWidth: 120
                            }
                        ] : [
                            {
                                title: this.$t('1950610'), // 单值
                                key: 'value' + i,
                                slot: 'value' + i,
                                align: 'center',
                                minWidth: 120
                            }
                        ]
                    })
                }
                this.tableData.push({
                    itemid: 0,
                    item: this.$t('800008'),
                    standard: '',
                    min_value: '',
                    max_value: '',
                    checktype: 0,
                    result: '',
                    value: null
                })
                tablelist.forEach((item, i) => {
                    if (item) {
                        let data = {
                            itemid: item.itemid,
                            item: item.item,
                            standard: item.standard,
                            min_value: item.checktype === 2 ? (item.min_value === -999999999 ? '' : item.min_value) : '',
                            max_value: item.checktype === 2 ? (item.max_value === 999999999 ? '' : item.max_value) : '',
                            checktype: item.checktype,
                            result: item.result,
                            value: item.value,
                            valuecategory: item.valuecategory,
                            range: (item.checktype === 2 && item.valuecategory === 2) ? item.range : '',
                            samplequantity: item.samplequantity
                        }
                        if (item.checktype === 2) {
                            for (var j = 1; j <= cloumnLength; j++) {
                                data['min_value' + j] = null
                                data['max_value' + j] = null
                                data['value' + j] = null
                                data['range' + j] = null
                            }
                        } else {
                            for (var j = 1; j <= cloumnLength; j++) {
                                data['value' + j] = 'OK'
                            }
                        }
                        this.tableData.push(data)
                    }
                })
                this.detailshow = false
                this.detailshow = true

                // 处理滚动条样式bug
                setTimeout(() => {
                    var scrollx = this.$refs.detailTable.$refs.body.classList.contains('ivu-table-overflowX'); // 100px
                    if (scrollx) {
                        this.table_scrollx = true
                    } else {
                        this.table_scrollx = false
                    }
                }, 500)
            })
        },
        initlevel () {
            axios.request({
                url: '/qms/InspectStandardMaterial/GetSectionTree',
                method: 'get'
            }).then(res => {
                const arr = []
                this.datalevel = res.data.data
                // arr.push(res.data.data[0].value)
                // this.leveldata = arr
                this.selectfirstsection(this.datalevel)
            })
        },
        initmaterials (sectionid) {
            this.materials = [{ id: 0, name: '', pn: '', psec: '' }]
            axios.request({
                url: '/qms/InspectStandardMaterial/GetMaterialsBySectionId?sectionid=' + sectionid,
                method: 'get'
            }).then(res => {
                this.materials = res.data.data
            })
            this.materialid = ''
        },
        initsuppliers () {
            this.GetValueColums()
            this.suppliers = [{ id: 0, name: '' }]
            axios.request({
                url: '/config/Material/GetSupplierByMaterial?materialid=' + this.editobj.materialid,
                method: 'get'
            }).then(res => {
                this.suppliers = res.data.data
                if (res.data.ret === 1) {
                    var data = res.data.data
                    if (data !== [] && data !== undefined && data !== null && data.length === 1) {
                        this.editobj.supplierid = data[0].id
                    }
                }
            })
        },
        handleView (name) {
            this.imgName = this.host + name
            this.visible = true
        },
        handleRemove (file) {
            const fileList = this.$refs.upload.fileList
            const flist = this.uploadList
            this.$refs.upload.fileList.splice(fileList.indexOf(file), 1)
            this.uploadList.splice(flist.indexOf(file), 1)
        },
        handleSuccess_image (res, file) {
            file.url = res.url
            file.name = res.name
            var uploadfile = file
            uploadfile.url = res.url
            this.uploadList.push(uploadfile)
        },
        handleFormatError_image (file) {
            this.$Message.error(file.name + ' ' + this.$t('950395'))
        },
        handleMaxSize (file) {
            this.$Message.error('File  ' + file.name + ' is too large, no more than 2M.')
        },
        handleBeforeUpload () {
            return true
        },
        handleSuccess_file (res, file) {
            file.url = res.url
            file.name = res.name
        },
        handleFormatError_file (file) {
            this.$Message.error(file.name + ' ' + this.$t('950395'))
        },
        handleMaxSize_file (file) {
            this.$Message.error('File  ' + file.name + ' is too large, no more than 2M.')
        },
        handleBeforeUpload_file () {
            return true
        }
    },
    mounted () {
    // this.uploadList = this.$refs.upload.fileList;
    }
}

</script>
<style lang="less" scoped>
.demo-upload-list{
    display: inline-block;
    width: 120px;
    height: 120px;
    text-align: center;
    line-height: 120px;
    border: 1px solid transparent;
    border-radius: 4px;
    overflow: hidden;
    background: #fff;
    position: relative;
    box-shadow: 0 1px 1px rgba(0,0,0,.2);
    margin-right: 4px;
}
.demo-upload-list img{
    width: 100%;
    height: 100%;
}
.demo-upload-list-cover{
    display: none;
    position: absolute;
    top: 0;
    bottom: 0;
    left: 0;
    right: 0;
    background: rgba(0,0,0,.6);
}
.demo-upload-list:hover .demo-upload-list-cover{
    display: block;
}
.demo-upload-list-cover i{
    color: #fff;
    font-size: 20px;
    cursor: pointer;
    margin: 0 2px;
}

.active_class{
  border:red 1px solid;
}

.file {
  width: 80px;
  height: 32px;
  position: relative;
   color: #fff;
    display: inline-block;
    margin-bottom: 0;
    font-weight: normal;
    text-align: center;
    vertical-align: middle;
    -ms-touch-action: manipulation;
    touch-action: manipulation;
    cursor: pointer;
    background-image: none;
    border: 1px solid transparent;
    white-space: nowrap;
    line-height: 1.5;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
    padding: 5px 15px 6px;
    font-size: 12px;
    border-radius: 4px;
    background-color: #2d8cf0;
    margin-right: 15px;
    // border-color: #2d8cf0;
    -webkit-appearance: button
    // border-color: #57a3f3;
}
.file input {
    position: absolute;
    // font-size: 100px;
    left: 0;
    top: 0;
    opacity: 0;
    width: 80px;
    height: 30px;
    // border: 1px solid #000;
    // z-index: 99999;
}

.core1{
    width: 10%;
    height: 100%;
    border:0px solid #979797;
    border-radius: 5px;
    padding: 0px;
    overflow-y: auto;
    overflow-x: hidden;
    float:left;
    background: #ffffff;
}
.core2{
    width: 40%;
    height: 100%;
    border:0px solid #979797;
    border-radius: 5px;
    padding: 0px;
    overflow-y: auto;
    overflow-x: hidden;
    float:left;
    background: #ffffff;
}
.chartdiv1{
    width: 10%;
    height: 100%;
    border:0px solid #979797;
    border-radius: 5px;
    padding: 0px;
    overflow-y: auto;
    overflow-x: hidden;
    float:left;
    background: #ffffff;
}
.chartdiv2{
    width: 40%;
    height: 100%;
    border:0px solid #979797;
    border-radius: 5px;
    padding: 0px;
    overflow-y: auto;
    overflow-x: hidden;
    float:right;
    background: #ffffff;
}
</style>

<style lang="less">
    .materialdatacollection_table{
      .ivu-table-fixed-body{
          height:auto!important;
          max-height:411px!important;
      }
    }
</style>
