<template>
  <div>
    <xy-dialog ref="dialog" :width='70' :is-show.sync="isShow" type="form"
      :title="type === 'add' ? `新增${rukuTypeName}入库` : `编辑${rukuTypeName}入库`" :form="form" :rules="rules"
      @submit="submit">

      <template v-slot:caigouhetong v-if="form.rukuleixing=='采购'">
        <div class="xy-table-item">
          <div class="xy-table-item-label">
            <span style="color: red;font-weight: 600;padding-right: 4px;"></span>采购合同：
          </div>
          <div class="xy-table-item-content">
            <el-input type="text" clearable @focus="isShowHt=true" v-model="form.caigouhetong" placeholder="请选择采购合同"
              style="width: 300px;"></el-input>
          </div>
        </div>
      </template>
      <template v-slot:qingshiliucheng v-if="form.rukuleixing=='请示'">
        <div class="xy-table-item">
          <div class="xy-table-item-label">
            <span style="color: red;font-weight: 600;padding-right: 4px;"></span>请示流程：
          </div>
          <div class="xy-table-item-content">
            <el-input type="text" clearable @focus="isShowQs=true" v-model="form.qingshiliucheng" placeholder="请选择请示流程"
              style="width: 300px;"></el-input>
          </div>
        </div>
      </template>
      <template v-slot:yingjicaigou v-if="form.rukuleixing=='应急采购'">
        <div class="xy-table-item">
          <div class="xy-table-item-label">
            <span style="color: red;font-weight: 600;padding-right: 4px;"></span>应急采购请示：
          </div>
          <div class="xy-table-item-content">
            <el-input type="text" clearable @focus="isShowYj=true" v-model="form.yingjicaigou" placeholder="请选择应急采购请示流程"
              style="width: 300px;"></el-input>
          </div>
        </div>
      </template>
      <template v-slot:gudingzichanbianhao>
        <div class="xy-table-item">
          <div class="xy-table-item-label">
            <span style="color: red;font-weight: 600;padding-right: 4px;"></span>固定资产编号：
          </div>
          <div class="xy-table-item-content">
            <el-input type="text" v-model="form.gudingzichanbianhao" placeholder="请填写固定资产编号"
              style="width: 300px;"></el-input>
          </div>
        </div>
      </template>
      <template v-slot:rukushijian>
        <div class="xy-table-item">
          <div class="xy-table-item-label">
            <span style="color: red;font-weight: 600;padding-right: 4px;">*</span>入库时间：
          </div>
          <div class="xy-table-item-content">
            <el-date-picker style="width: 300px;" v-model="form.rukushijian" type="date" placeholder="选择日期"
              value-format="yyyy-MM-dd">
            </el-date-picker>
          </div>
        </div>
      </template>
      <!-- <template v-slot:rukuleixing>
        <div class="xy-table-item">
          <div class="xy-table-item-label">
            <span style="color: red;font-weight: 600;padding-right: 4px;">*</span>入库类型：
          </div>
          <div class="xy-table-item-content">
            <el-select v-model="form.rukuleixing" style="width: 300px;" placeholder="请选择">
              <el-option v-for="item in lexingoptions" :key="item.value" :label="item.label" :value="item.value">
              </el-option>
            </el-select>
          </div>
        </div>
      </template> -->
      <template v-slot:rukucangku>
        <div class="xy-table-item">
          <div class="xy-table-item-label">
            <span style="color: red;font-weight: 600;padding-right: 4px;"></span>入库仓库：
          </div>
          <div class="xy-table-item-content">
            <el-select v-model="form.rukucangku" filterable style="width: 300px;" placeholder="请选择入库仓库">
              <el-option v-for="item in cangkuList" :key="item.cangkumingcheng" :label="item.cangkumingcheng"
                :value="item.cangkumingcheng">
              </el-option>
            </el-select>
          </div>
        </div>
      </template>
      <template v-slot:pandianleixing v-if="rukuTypeName=='盘点'">
        <div class="xy-table-item">
          <div class="xy-table-item-label">
            <span style="color: red;font-weight: 600;padding-right: 4px;">*</span>盘点类型：
          </div>
          <div class="xy-table-item-content">
            <el-select v-model="form.pandianleixing" filterable style="width: 300px;" placeholder="请选择盘点类型">
              <el-option v-for="item in pandianList" :key="item.value" :label="item.value"
                :value="item.value">
              </el-option>
            </el-select>
          </div>
        </div>
      </template>
      <template v-slot:jingbanren>
        <div class="xy-table-item">
          <div class="xy-table-item-label">
            <span style="color: red;font-weight: 600;padding-right: 4px;">*</span>经办人：
          </div>
          <div class="xy-table-item-content">
            <el-input v-model="form.jingbanren" placeholder="请输入经办人" clearable style="width: 300px;"></el-input>
          </div>
        </div>
      </template>
      <template v-slot:jilurenyuan>
        <div class="xy-table-item">
          <div class="xy-table-item-label">
            <span style="color: red;font-weight: 600;padding-right: 4px;">*</span>记录人员：
          </div>
          <div class="xy-table-item-content">
            <el-input v-model="form.jilurenyuan" placeholder="请输入记录人员" clearable style="width: 300px;"></el-input>
          </div>
        </div>
      </template>
      <template v-slot:baoguanrenyuan>
        <div class="xy-table-item">
          <div class="xy-table-item-label">
            <span style="color: red;font-weight: 600;padding-right: 4px;"></span>保管人员：
          </div>
          <div class="xy-table-item-content">
            <el-input v-model="form.baoguanrenyuan" placeholder="请输入保管人员" clearable style="width: 300px;"></el-input>
          </div>
        </div>
      </template>
      <template v-slot:beizhu>
        <div class="xy-table-item">
          <div class="xy-table-item-label">
            <span style="color: red;font-weight: 600;padding-right: 4px;"></span>备注：
          </div>
          <div class="xy-table-item-content">
            <el-input type="textarea" v-model="form.beizhu" placeholder="请输入备注" clearable
              style="width: 300px;"></el-input>
          </div>
        </div>
      </template>
     <template v-slot:zuozhengwenjian v-if="rukuTypeName=='盘点' && form.pandianleixing!='正常盘点'">
        <div class="xy-table-item">
          <div class="xy-table-item-label">
            <span style="color: red;font-weight: 600;padding-right: 4px;"></span>佐证文件：
          </div>
          <div class="xy-table-item-content">
            <el-upload
              class="upload-demo"
              ref="upload"
              :action="action"
              multiple
              :headers='headers'
              :before-upload="beforeUpload"
              :on-success='onSuccess'
              :on-error='onError'
              :on-remove="onRemove"
              :file-list="fileList"
              :auto-upload="false">
              <el-button slot="trigger" size="small" type="primary">选取文件</el-button>
              <el-button style="margin-left: 10px;" size="small" type="success" @click="submitUpload">上传到服务器</el-button>
              <div slot="tip" class="el-upload__tip">上传文件不超过500kb</div>
            </el-upload>
          </div>
        </div>
      </template>
      <template v-slot:rukumingxi>
        <div class="xy-table-item">
          <div class="xy-table-item-label">
            <span style="color: red;font-weight: 600;padding-right: 4px;"></span>入库明细 ：
          </div>
          <div class="xy-table-item-content">
            <Button type="primary" icon="md-add" style="margin-bottom: 10px" @click="isShowMingxi=true">新增入库明细</Button>
            <Button type="primary" icon="md-add" style="margin-bottom: 10px;margin-left: 10px" @click="importsRuku">导入</Button>
            <xy-table style="width: 60%" :height="260" :is-page="false" :list="mingxiList" :table-item="mingxiTable">
              <template v-slot:btns>
                <el-table-column label="操作" width="90" header-align="center" align="center">
                  <template v-slot:default="scope">
                    <Poptip transfer confirm title="确认要删除吗？" @on-ok="delMingxiList(scope.$index,scope.row)">
                      <Button size="small" type="primary" ghost>删除</Button>
                    </Poptip>
                  </template>
                </el-table-column>
              </template>
            </xy-table>
          </div>
        </div>
      </template>
    </xy-dialog>



    <!-- 新增明细 -->
    <Modal v-model="isShowMingxi" width='600' title="新增明细" :loading='showLoading' @on-cancel='mingxiCancel'
      @on-ok="mingxiConfirm">
      <div class="mingxiwrap">
        <div class="xy-table-item">
          <div class="xy-table-item-label">
            <span style="color: red;font-weight: 600;padding-right: 4px;">*</span>物资编码：
          </div>
          <div class="xy-table-item-content" style="display: flex;align-items: center;">
            <el-input v-if="form.rukuleixing!='回库'" type="text" @focus="showWuzi" v-model="mingxiObj.wuzibianma"
              placeholder="请选择物资编码" style="width: 300px;"></el-input>
           <Button @click='showMater' v-if="form.rukuleixing!='回库'" type="primary" icon="md-add"
             style="margin-left: 10px">新增</Button>
            <el-input v-if="form.rukuleixing=='回库'" @change='getKucunShow' ref='huikubianma' type="text"
              v-model="mingxiObj.wuzibianma" placeholder="请扫码获取回库物资编码" style="width: 300px;"></el-input>
            <Button @click='showWuzi("回库")' v-if="form.rukuleixing=='回库'" type="primary" icon="md-add"
              style="margin-left: 10px">选择</Button>
          </div>
        </div>
        <div class="xy-table-item">
          <div class="xy-table-item-label">
            <span style="color: red;font-weight: 600;padding-right: 4px;"></span>资产名称：
          </div>
          <div class="xy-table-item-content">
            <el-input type="text" @focus="showWuzi" v-model="mingxiObj.zichanmingcheng" placeholder="请选择资产名称" disabled
              style="width: 300px;"></el-input>
          </div>
        </div>
        <div class="xy-table-item">
          <div class="xy-table-item-label">
            <span style="color: red;font-weight: 600;padding-right: 4px;"></span>规格型号：
          </div>
          <div class="xy-table-item-content">
            <el-input type="text" v-model="mingxiObj.guigexinghao" placeholder="请选择规格型号" disabled
              style="width: 300px;"></el-input>
          </div>
        </div>
        <div class="xy-table-item">
          <div class="xy-table-item-label">
            <span style="color: red;font-weight: 600;padding-right: 4px;"></span>物资类型：
          </div>
          <div class="xy-table-item-content">
            <el-input type="text" v-model="mingxiObj.wuzileixing" placeholder="请选择物资类型" disabled
              style="width: 300px;"></el-input>
          </div>
        </div>
        <div class="xy-table-item" v-if="form.rukuleixing!='回库'||form.rukuleixing!='盘点'">
          <div class="xy-table-item-label">
            <span style="color: red;font-weight: 600;padding-right: 4px;"></span>物资分类：
          </div>
          <div class="xy-table-item-content">
            <el-input type="text" v-model="mingxiObj.fenlei" placeholder="请选择物资分类" disabled
              style="width: 300px;"></el-input>
          </div>
        </div>
        <div class="xy-table-item">
          <div class="xy-table-item-label">
            <span style="color: red;font-weight: 600;padding-right: 4px;"></span>计量单位：
          </div>
          <div class="xy-table-item-content">
            <el-input type="text" v-model="mingxiObj.jiliangdanwei" placeholder="请选择计量单位" disabled
              style="width: 300px;"></el-input>
          </div>
        </div>
        <div class="xy-table-item" v-if="form.rukuleixing=='回库'">
          <div class="xy-table-item-label">
            <span style="color: red;font-weight: 600;padding-right: 4px;"></span>在库数量：
          </div>
          <div class="xy-table-item-content">
            <el-input type="text" v-model="mingxiObj.zaikushuliang" placeholder="请选择计量单位" disabled
              style="width: 300px;"></el-input>
          </div>
        </div>
        <div class="xy-table-item" v-if="mingxiObj.wuzileixing=='一类一码'">
          <div class="xy-table-item-label">
            <span style="color: red;font-weight: 600;padding-right: 4px;">*</span>入库批次：
          </div>
          <div class="xy-table-item-content">
            <el-select @change='selectPici' v-model="mingxiObj.rukupici" ref='piciref' v-if="form.rukuleixing!='回库'" style="width: 300px;"
              filterable clearable allow-create default-first-option placeholder="请选择或新增入库批次">
              <el-option v-for="item in rukupiciList" :key="item.value" :label="item.value" :value="item.value">
              </el-option>
            </el-select>
            <el-input v-else type="text" v-model="mingxiObj.rukupici" disabled placeholder="请输入入库批次"
              style="width: 300px;"></el-input>
          </div>
        </div>

        <div class="xy-table-item">
          <div class="xy-table-item-label">
            <span style="color: red;font-weight: 600;padding-right: 4px;">*</span>入库数量：
          </div>
          <div class="xy-table-item-content">
            <el-input type="text" v-model="mingxiObj.rukushuliang" placeholder="请填写入库数量"
              style="width: 300px;"></el-input>
          </div>
        </div>
        <div class="xy-table-item" v-if="form.rukuleixing != '回库'">
          <div class="xy-table-item-label">
            <span style="color: red;font-weight: 600;padding-right: 4px;">*</span>生产日期：
          </div>
          <div class="xy-table-item-content">
            <el-date-picker style="width: 300px;" v-model="mingxiObj.shengchanriqi" type="date" placeholder="选择生产日期"
              value-format="yyyy-MM-dd"></el-date-picker>
          </div>
        </div>

      </div>

    </Modal>
    <!-- 选择物资编号 -->
    <Modal v-model="isShowWuzi" title="物资选择">
      <div class="searchCompanys">
        <el-input style="margin-right:10px" clearable type="text" @keyup.enter.native="getList" v-model="wuzibianmakeyword" placeholder="请输入物资编码查找库存"></el-input>
        <el-input style="margin-right:10px" clearable type="text" @keyup.enter.native="getList" v-model="keyword" placeholder="请输入资产名称查找"></el-input>
        <el-button type="primary" @click="getList">查询</el-button>
      </div>
      <Table highlight-row ref="currentRowTable" :columns="wuziColumns" :data="showList"
        @on-current-change="wuziSelect" />
      <Page :current="wuziPageIndex" :total="showTotal" simple
        style="padding-top: 14px;display: flex;justify-content: center;" @on-change="wuziPageChange" />
    </Modal>

    <!-- 选择采购合同 -->
    <Modal v-model="isShowHt" title="合同选择" width='70%' @on-cancel='htCancel' @on-ok='htComfirm'>
      <div class="searchCompanys">
        <el-input type="text" @keyup.enter.native="getHt" v-model="htkeyword" placeholder="请输入关键词查找"></el-input>
        <el-button type="primary" @click="getHt">查询</el-button>
      </div>
      <Table highlight-row ref="currentRowTable" :columns="htColumns" :data="htList" @on-current-change="htSelect" />
      <Page :current="htPageIndex" :total="htTotal" simple
        style="padding-top: 14px;display: flex;justify-content: center;" @on-change="htPageChange" />
    </Modal>
    <!-- 选择请示流程 -->
    <Modal v-model="isShowQs" title="请示选择" width='70%' @on-cancel='qsCancel' @on-ok='qsComfirm'>
      <div class="searchCompanys">
        <el-input type="text" @keyup.enter.native="getQs" v-model="qskeyword" placeholder="请输入关键词查找"></el-input>
        <el-button type="primary" @click="getQs">查询</el-button>
      </div>
      <Table highlight-row ref="currentRowTable" :columns="qsColumns" :data="qsList" @on-current-change="qsSelect" />
      <Page :current="qsPageIndex" :total="qsTotal" simple
      style="padding-top: 14px;display: flex;justify-content: center;" @on-change="qsPageChange" />
    </Modal>

    <!-- 选择应急采购请示流程 -->
    <Modal v-model="isShowYj" title="应急采购请示选择" width='70%' @on-cancel='yjCancel' @on-ok='yjComfirm'>
      <div class="searchCompanys">
        <el-input type="text" @keyup.enter.native="getYj" v-model="yjkeyword" placeholder="请输入关键词查找"></el-input>
        <el-button type="primary" @click="getYj">查询</el-button>
      </div>
      <Table highlight-row ref="currentRowTable" :columns="yjColumns" :data="yjList" @on-current-change="yjSelect" />
      <Page :current="yjPageIndex" :total="qsTotal" simple
      style="padding-top: 14px;display: flex;justify-content: center;" @on-change="yjPageChange" />
    </Modal>

    <detailContract ref='detailContract'></detailContract>
    <imports :table-name="importstableName" :istrueimport='false' :form-info="importForm" ref="imports"
      @importdata='getimportData'></imports>

    <addMater ref="addMater" @insert="insertMingxi"></addMater>

  </div>
</template>

<script>
  import {
    save,
    index,
    show,
    destroy
  } from "@/api/system/baseForm.js"
  import {
    index as getContract,
    getQingShi,
    getOatoken
  } from "@/api/contract.js"
  import {
    Message
  } from 'element-ui'
  import detailContract from "../component/detailContract.vue"
  import imports from "@/views/component/imports.vue"
  import {
    index as fieldIndex
  } from "@/api/system/customFormField";
  import {getToken} from "@/utils/auth";
  import addMater from "@/views/materialfile/component/addMater.vue"
  export default {
    components: {
      detailContract,
      addMater,
      imports
    },
    data() {
      return {
        isShow: false,
        type: 'add',
        id: '',
        rukuType: '',
        authName:'',
        rukuTypeName: '盘点',
        tableName: 'stocks',
        importstableName: 'stocks_items',
        wuziguanli_oatoken:'',
        customFormId: 8,
        importForm: [],
        cangkuList: [],
        lexingoptions: [{
          label: '盘点',
          value: '盘点'
        }, {
          label: '采购',
          value: '采购'
        }, {
          label: '回库',
          value: '回库'
        }],
        rukupiciList: [],
        pandianList:[{label:'正常盘点',value:'正常盘点'},{label:'外部调拨',value:'外部调拨'},{label:'其他',value:'其他'}],
        form: {
          caigouhetong: '',
          qingshiliucheng:"",
          yingjicaigou:'',
          gudingzichanbianhao: '',
          rukushijian: '',
          // caigouhetong:'',
          rukuleixing: '',
          pandianleixing:'',
          rukucangku: '',
          jingbanren: "",
          jilurenyuan: '',
          baoguanrenyuan: '',
          beizhu: '',
          zuozhengwenjian:'',
          rukumingxi: ''
        },
        fileList:[],
        action:process.env.VUE_APP_UPLOAD_API,
        headers:{
          token:''
        },
        rules: {
          rukushijian: [{
            required: true,
            message: '请选择入库时间'
          }],
          // pandianleixing: [{
          //   required: true,
          //   message: '请选择盘点类型'
          // }],
          jingbanren: [{
            required: true,
            message: '请填写经办人'
          }],
          jilurenyuan: [{
            required: true,
            message: '请填写记录人员'
          }]
        },
        hetongoptions: [],
        isShowMingxi: false,
        showLoading: true,
        mingxiObj: {
          wuzibianma: '',
          rukushuliang: ''
        },
        mingxiObjBefore: {},
        mingxiList: [],
        mingxiIndex: '',
        mingxiTable: [{
            label: "物资编码",
            prop: "wuzibianma",
            width: 180
          },
          {
            label: "资产名称",
            prop: "zichanmingcheng",
            width: 180,
          },
          {
            label: "规格型号",
            prop: "guigexinghao",
            width: 180,
          },
          {
            label: "物资类型",
            prop: "wuzileixing",
            width: 180
          },
          {
            label: "计量单位",
            prop: "jiliangdanwei",
            width: 180
          },
          {
            label: "入库数量",
            prop: "rukushuliang",
            width: 180
          }, {
            label: "入库批次",
            prop: "rukupici",
            width: 180
          }, {
            label: "在库数量",
            prop: "zaikushuliang",
            width: 180
          },{
            label: "生产日期",
            prop: "shengchanriqi",
            width: 180
          },
        ],
        // 物资
        isShowWuzi: false,
        wuziList: [],
        kucunList: [],
        showList: [],
        wuziPageIndex: 1,
        keyword: '',
        wuzibianmakeyword:'',
        showTotal: 0,
        wuziTotal: 0,
        kucunTotal: 0,
        wuziColumns: [{
          width: 60,
          _isChecked: false,
          key: "isSelect",
          resizable: true,
          render: (h, params) => {
            return h('div', [
              h('Radio', {
                props: {
                  value: params.row.isSelect
                },
                on: {
                  'on-change': (e) => {
                    this.showList.forEach((items) => {
                      this.$set(items, 'isSelect', false)
                    });
                    this.showList[params.index].isSelect = e;
                  }
                }
              })
            ])
          }
        }, {
          title: '名称',
          key: 'names',
        }, {
          title: '物资类型',
          key: 'wuzileixing',
        }],
        // 合同
        isShowHt: false,
        htList: [],
        htPageIndex: 1,
        htkeyword: '',
        htTotal: 0,
        editHt: '',
        htColumns: [{
          width: 60,
          _isChecked: false,
          key: "isSelect",
          resizable: true,
          render: (h, params) => {
            return h('div', [
              h('Radio', {
                props: {
                  value: params.row.isSelect
                },
                on: {
                  'on-change': (e) => {
                    this.htList.forEach((items) => {
                      this.$set(items, 'isSelect', false)
                    });
                    this.htList[params.index].isSelect = e;
                  }
                }
              })
            ])
          }
        }, {
          title: '名称',
          key: 'name',
        }, {
          title: '类型',
          key: 'type_name',
          width: 100
        }, {
          title: '状态',
          key: 'status_name',
          width: 100
        }, {
          title: '查看',
          key: '',
          width: 100,
          render: (h, params) => {
            return h('span', {
              style: {
                color: '#0077CC',
                cursor: 'pointer'
              },
              on: {
                'click': (e) => {
                  console.log("click", params.row.id)
                  this.$refs['detailContract'].getDetail(params.row.id)
                  this.$refs['detailContract'].isShowDetail = true
                  // @click=","
                }
              }
            }, '查看详情')
          }
        }],
        //请示流程
        isShowQs:false,
        qsList: [],
        qskeyword: '',
        qsPageIndex: 1,
        qsTotal: 0,
        editQs: '',
        qsColumns: [{
          width: 60,
          _isChecked: false,
          key: "isSelect",
          resizable: true,
          render: (h, params) => {
            return h('div', [
              h('Radio', {
                props: {
                  value: params.row.isSelect
                },
                on: {
                  'on-change': (e) => {
                    this.qsList.forEach((items) => {
                      this.$set(items, 'isSelect', false)
                    });
                    this.qsList[params.index].isSelect = e;
                  }
                }
              })
            ])
          }
        }, {
          title: '名称',
          key: 'title',
        }, {
          title: '查看',
          key: '',
          width: 100,
          render: (h, params) => {
            return h('span', {
              style: {
                color: '#0077CC',
                cursor: 'pointer'
              },
              on: {
                'click': (e) => {
                  this.toQsFollow(params.row.belongs_id)
                  // @click=","
                }
              }
            }, '查看详情')
          }
        }],
        //应急采购请示流程
        isShowYj:false,
        yjList: [],
        yjkeyword: '',
        yjPageIndex: 1,
        yjTotal: 0,
        editYj: '',
        yjColumns: [{
          width: 60,
          _isChecked: false,
          key: "isSelect",
          resizable: true,
          render: (h, params) => {
            return h('div', [
              h('Radio', {
                props: {
                  value: params.row.isSelect
                },
                on: {
                  'on-change': (e) => {
                    this.yjList.forEach((items) => {
                      this.$set(items, 'isSelect', false)
                    });
                    this.yjList[params.index].isSelect = e;
                  }
                }
              })
            ])
          }
        }, {
          title: '名称',
          key: 'title',
        }, {
          title: '查看',
          key: '',
          width: 100,
          render: (h, params) => {
            return h('span', {
              style: {
                color: '#0077CC',
                cursor: 'pointer'
              },
              on: {
                'click': (e) => {
                  this.toYjFollow(params.row.belongs_id)
                  // @click=","
                }
              }
            }, '查看详情')
          }
        }]
      }
    },
    created() {
      this.getCangku()
      this.headers.token = getToken()
      getOatoken().then(res=>{
        this.wuziguanli_oatoken =res.oatoken
      })
    },
    methods: {
      beforeUpload(file){
        if (file.size / 1000 > 500) {
          this.$message({
            type: "warning",
            message: "上传文件大小超过500kb！",
          });
          return false;
        }
      },
      onSuccess(response, file, fileList){
        console.log("fileList",fileList)
        this.fileList = fileList;
      },

      onRemove(file, fileList){
        this.fileList = fileList;
      },

      onError(err,file,fileList){
        this.fileList = fileList;
        this.$message({
          type: "warning",
          message: err
        })
      },
      submitUpload() {
        this.$refs.upload.submit();
      },
      // 导入入库明细
      importsRuku() {
        this.$refs['imports'].show()
        this.getField()
      },
      getimportData(e) {
        console.log("e", e)
        this.mingxiList = e
      },
      // 获取采购合同
      async getHt() {
        let res = await getContract({
          page_size: 10,
          page: this.htPageIndex,
          keyword: this.htkeyword,
          type: 2,
          status: 2
        })
        for (var m of res.list.data) {
          m.isSelect = false
          m.type_name = m.type == 1 ? '服务' : (m.type == 2 ? '货物' : (m.type == 3 ? '工程' : '其他'))
          m.status_name = m.status == 1 ? '待签订' : (m.status == 2 ? '已签订' : '')
        }
        console.log(res.list.data)
        this.htList = res.list.data
        this.htTotal = res.total
        // this.hetongoptions = res.data
      },
      htCancel() {
        this.htList.forEach((items) => {
          this.$set(items, 'isSelect', false)
        });
        this.form.caigouhetong = this.editHt
      },
      htSelect(e) {
        this.htList.forEach((items) => {
          this.$set(items, 'isSelect', false)
          if (items.id == e.id) {
            this.$set(items, 'isSelect', true)
          }
        });

      },
      htComfirm() {
        console.log("123")
        this.htList.forEach((items) => {
          if (items.isSelect == true) {
            this.form.caigouhetong = items.name
            this.editHt = items.name
          }
        });

      },
      htPageChange(e) {
        console.log("e", e)
        this.htPageIndex = e
        this.getHt()
      },
      // 获取请示流程
      async getQs() {
        let res = await getQingShi({
          // table:'qingshiruku',
          table:'qingshi',
          page:this.qsPageIndex,
          status:1,
          keyword:this.qskeyword
        })
        for (var m of res.data.flow.data) {
          m.isSelect = false
        }
        this.qsList = res.data.flow.data
        this.qsTotal = res.data.flow.total
        // this.hetongoptions = res.data
      },
      qsCancel() {
        this.qsList.forEach((items) => {
          this.$set(items, 'isSelect', false)
        });
        this.form.qingshiliucheng = this.editQs
      },
      qsSelect(e) {
        this.qsList.forEach((items) => {
          this.$set(items, 'isSelect', false)
          if (items.id == e.id) {
            this.$set(items, 'isSelect', true)
          }
        });

      },
      qsComfirm() {
        this.qsList.forEach((items) => {
          if (items.isSelect == true) {
            this.form.qingshiliucheng = items.title
            this.editQs = items.title
          }
        });
      },
      qsPageChange(e) {
        this.qsPageIndex = e
        this.getQs()
      },
      async toQsFollow(id){
        // let res = await getOatoken()

        let url =
          `${process.env.VUE_APP_OA_URL}/admin/flow/view/${id}?wuziguanli_oatoken=${this.wuziguanli_oatoken}`
                  console.log("url",url)
        let seeBuy = window.open(url, 'seeBuy','location=0')
      },
      // 获取应急采购请示流程
      async getYj() {
        let res = await getQingShi({
          table:'yingjicaigou',
          page:this.yjPageIndex,
          status:1,
          keyword:this.yjkeyword
        })
        for (var m of res.data.flow.data) {
          m.isSelect = false
        }
        this.yjList = res.data.flow.data
        this.yjTotal = res.data.flow.total
        // this.hetongoptions = res.data
      },
      yjCancel() {
        this.yjList.forEach((items) => {
          this.$set(items, 'isSelect', false)
        });
        this.form.yingjicaigou = this.editYj
      },
      yjSelect(e) {
        this.yjList.forEach((items) => {
          this.$set(items, 'isSelect', false)
          if (items.id == e.id) {
            this.$set(items, 'isSelect', true)
          }
        });

      },
      yjComfirm() {
        this.yjList.forEach((items) => {
          if (items.isSelect == true) {
            this.form.yingjicaigou = items.title
            this.editYj = items.title
          }
        });
      },
      yjPageChange(e) {
        this.yjPageIndex = e
        this.getYj()
      },
      async toYjFollow(id){
        // let res = await getOatoken()

        let url =
          `${process.env.VUE_APP_OA_URL}/admin/flow/view/${id}?wuziguanli_oatoken=${this.wuziguanli_oatoken}`
                  console.log("url",url)
        let seeBuy = window.open(url, 'seeBuy','location=0')
      },
      // 物资明细 回库从库存中选 其他从物资档案
      mingxiConfirm() {
        setTimeout(() => {
          this.showLoading = false
          this.$nextTick(() => {
            this.showLoading = true
          })
        }, 500)
        console.log("this.mingxiObj",this.mingxiObj.rukupici)
        if (this.mingxiObj.wuzibianma == '' || this.mingxiObj.rukushuliang == '' || this.mingxiObj.rukupici == '') {
          Message({
            type: 'warning',
            message: '请填写完整数据'
          })
          this.showLoading = false
          return
        }
        if (this.mingxiIndex != '') {
          this.mingxiList[this.mingxiIndex - 1] = this.mingxiObj
        } else {
          this.mingxiList.push(this.mingxiObj)
        }
        this.mingxiObj = {
          wuzibianma: '',
          rukushuliang: ''
        }
        this.mingxiObjBefore = {}
        this.mingxiIndex = ''
        this.isShowMingxi = false
        this.showLoading = false
        this.showList = []
        this.showTotal = 0
        this.wuziPageIndex = 1
      },
      mingxiCancel() {
        this.mingxiObj = {
          wuzibianma: '',
          rukushuliang: ''
        }
        this.mingxiObjBefore = {}
        this.mingxiIndex = ''
        this.isShowMingxi = false
        this.showList = []
        this.showTotal = 0
        this.wuziPageIndex = 1
      },
      editMingxi(index) {
        const before = this.mingxiList[index]
        for (var m in this.mingxiList[index]) {
          this.mingxiObjBefore[m] = this.mingxiList[index][m]
        }
        this.mingxiObj = this.mingxiList[index]
        this.mingxiIndex = index + 1 // 为0时！=‘’为false
        this.isShowMingxi = true
      },
      // 删除明细记录
     async delMingxiList(index,row){

        let isDel = false
        let isDels = false
        let id = row.id
        let stocks_items_id = row.stocks_items_id
        if(row.id){
         await destroy({
            id:id,
            table_name:'stocks_item_links'
          }).then(res=>{
            isDel = true
          })
          await destroy({
             id:stocks_items_id,
             table_name:'stocks_items'
           }).then(res=>{
             isDels = true
           })
           if(isDel && isDels){
             Message({
               type: 'success',
               message: '删除成功'
             })
             this.mingxiList.splice(index, 1)
           }else{
             Message({
               type: 'warning',
               message: '删除失败'
             })
           }
        }else{
          Message({
            type: 'success',
            message: '删除成功'
          })
          this.mingxiList.splice(index, 1)
        }
      },
      showWuzi(type) {
        this.isShowWuzi = true
        if (type == '回库') {
          this.$nextTick(() => {
            this.$refs.huikubianma.focus()
          })
          this.getKucun()
        } else {
          this.getWuzi()
        }
      },
      // 新增物资档案
      showMater(){
        this.$refs['addMater'].isShow = true
        this.$refs['addMater'].type = 'add'
        this.$refs['addMater'].webType = 'insert'
      },
      insertMingxi(e){
        console.log("e",e)
        this.mingxiObj.wuzibianma = e.wuzibianma
        this.mingxiObj.zichanmingcheng = e.zichanmingcheng
        this.mingxiObj.wuzileixing = e.wuzileixing
        this.mingxiObj.guigexinghao = e.guigexinghao
        this.mingxiObj.jiliangdanwei = e.jiliangdanwei
        this.mingxiObj.fenlei = e.fenlei
        this.mingxiObj.rukupici = '第一批'
      },
      getList() {
        if (this.form.rukuleixing == '回库') {
          this.getKucun()
        } else {
          this.getWuzi()
        }
      },
      async getWuzi() {
        let res = await index({
          page_size: 10,
          page: this.wuziPageIndex,
          table_name: 'material_infos',
          filter: [{
            "key": "zichanmingcheng",
            "op": "like",
            "value": this.keyword
          },{
            "key": "wuzibianma",
            "op": "like",
            "value": this.wuzibianmakeyword
          }]
        })
        for (var m of res.data) {
          m.names = m.wuzibianma + "--" + m.zichanmingcheng
          m.isSelect = false
        }
        this.showList = res.data
        this.showTotal = res.total
      },
      async getKucun() {
        let res = await index({
          page_size: 10,
          page: this.wuziPageIndex,
          table_name: 'inventorys',
          filter: [{
            "key": "zichanmingcheng",
            "op": "like",
            "value": this.keyword
          },{
            "key": "wuzibianma",
            "op": "like",
            "value": this.wuzibianmakeyword
          }]
        })
        for (var m of res.data) {
          m.names = m.wuzibianma + "--" + m.zichanmingcheng
          m.isSelect = false
        }
        this.showList = res.data
        this.showTotal = res.total
      },
      //
      getIds(url,name) {
        var reg = new RegExp("(^|&)" + name.toLowerCase() + "=([^&]*)(&|$)");
        var r = url.match(reg);
        if (r != null) {
          return unescape(r[2].replace(new RegExp(/(%25)/g), '%').replace(new RegExp(/(%25)/g), '%'));
        }
        return null
      },
      async getKucunShow(e) {
        console.log(e)
        let id = ''
        if (e) {

          // id = e.split('-')[1]
          id =  e.substring(e.indexOf('=') + 1, e.indexOf('&'));
          console.log("id",id)
          this.$nextTick(() => {
            this.$refs.huikubianma.blur()
          })
        } else {
          return
        }
        const res = await show({
          id: id,
          table_name: "inventorys"
        })
        this.mingxiObj.wuzibianma = res.wuzibianma
        this.mingxiObj.zichanmingcheng = res.zichanmingcheng
        this.mingxiObj.guigexinghao = res.guigexinghao
        this.mingxiObj.wuzileixing = res.wuzileixing
        this.mingxiObj.jiliangdanwei = res.jiliangdanwei
        this.mingxiObj.zaikushuliang = res.zaikushuliang
        this.mingxiObj.rukupici = res.rukupici
        this.mingxiObj.id = res.id
      },
      async getPici() {
        let res = await index({
          page_size: 999,
          page: 1,
          table_name: 'inventorys',
          filter: [{
            "key": "wuzibianma",
            "op": "eq",
            "value": this.mingxiObj.wuzibianma
          }]
        })
        this.rukupiciList = []
        for (var m of res.data) {
          this.rukupiciList.push({
            value: m.rukupici,
            label: m.rukupici
          })
        }
      },
      selectPici(e){
        console.log("pici",e)
      },
      wuziSelect(e) {
        console.log(e)
        this.showList.forEach((items) => {
          this.$set(items, 'isSelect', false)
          if (items.id == e.id) {
            this.$set(items, 'isSelect', true)
          }
        });
        if (this.form.rukuleixing == '回库') {
          this.mingxiObj.wuzibianma = e.wuzibianma
          this.mingxiObj.zichanmingcheng = e.zichanmingcheng
          this.mingxiObj.guigexinghao = e.guigexinghao
          this.mingxiObj.wuzileixing = e.wuzileixing
          this.mingxiObj.jiliangdanwei = e.jiliangdanwei
          this.mingxiObj.zaikushuliang = e.zaikushuliang
          this.mingxiObj.rukupici = e.rukupici
          this.mingxiObj.id = e.id
          this.mingxiObj.shengchanriqi = e.shengchanriqi

        } else {
          this.mingxiObj.wuzibianma = e.wuzibianma
          this.mingxiObj.zichanmingcheng = e.zichanmingcheng
          this.mingxiObj.wuzileixing = e.wuzileixing
          this.mingxiObj.guigexinghao = e.guigexinghao
          this.mingxiObj.jiliangdanwei = e.jiliangdanwei
          this.mingxiObj.fenlei = e.fenlei
          if (this.mingxiObj.wuzileixing == '一类一码') {

            this.getPici()
          }

        }

      },
      wuziPageChange(e) {
        console.log("e", e)
        this.wuziPageIndex = e
        this.getList()
      },

      async getCangku() {
        let res = await index({
          page_size: 999,
          page: 1,
          table_name: 'materialstorages',
        })
        this.cangkuList = res.data
      },
      async getDetail() {
        const res = await show({
          id: this.id,
          table_name: this.tableName
        })
        this.form = {
          caigouhetong: res?.caigouhetong,
          qingshiliucheng:res?.qingshiliucheng,
          gudingzichanbianhao: res?.gudingzichanbianhao,
          rukushijian: res?.rukushijian,
          rukuleixing: res?.rukuleixing,
          pandianleixing:res?.pandianleixing,
          rukucangku: res.rukucangku,
          jingbanren: res?.jingbanren,
          jilurenyuan: res?.jilurenyuan,
          baoguanrenyuan: res?.baoguanrenyuan,
          beizhu: res?.beizhu,
          zuozhengwenjian:res?.zuozhengwenjian,
          rukumingxi: ''
        }
        this.editHt = res?.caigouhetong
        this.editQs = res?.qingshiliucheng
        this.mingxiList = []
        for(var r of res.id_stocks_item_links_stocks_id_relation){
          let yuanshishuju = JSON.parse(r.yuanshishuju)
          yuanshishuju['id'] = r.id
          yuanshishuju['stocks_items_id'] = r.stocks_items_id
          this.mingxiList.push(yuanshishuju)
        }
        console.log("this.mingxiList",this.mingxiList)
        this.fileList = []
        let _lists = res.zuozhengwenjian_upload_details?res.zuozhengwenjian_upload_details:[]
        for(var f of _lists){
          this.fileList.push({
            name: f?.original_name,
            url: f?.url,
            response: f,
          })
        }
        // this.isShow = true
      },

      isHasEqual(arr,key,key1) {
          if(arr.length===0){
            return
          }
          for(let i = 0; i < arr.length; i++) {
                if(arr.filter(item => item[key] == arr[i][key]).length > 1&&arr.filter(item => item[key1] == arr[i][key1]).length > 1) {

                      return true;
                  }

          }
          return false;
      },
      submit() {
        this.form.id_stocks_items_stocks_id_relation = this.mingxiList
        console.log("form",this.form)
        const has = this.isHasEqual(this.form.id_stocks_items_stocks_id_relation,"wuzibianma","rukupici")
        if(has){
          Message({
            type: 'warning',
            message: '同一物资同一批次请不要重复录入'
          })
          return
        }
        // return
        console.log('fileList',this.fileList)
        this.form.zuozhengwenjian = []
        for(var k of this.fileList){
          this.form.zuozhengwenjian.push(k?.response?.id)
        }

        console.log(this.form.zuozhengwenjian)
        // return
        if (this.type === 'add') {
          save({
            table_name: this.tableName,
            ...this.form
          }).then(res => {
            Message({
              type: 'success',
              message: '新增成功'
            })
            this.isShow = false
            this.$emit('refresh')
          })
          return
        }
        if (this.type === 'editor') {
          save({
            id: this.id,
            table_name: this.tableName,
            ...this.form
          }).then(res => {
            Message({
              type: 'success',
              message: '编辑成功'
            })
            this.isShow = false
            this.$emit('refresh')
          })
        }
      },
      async getField() {
        const res = await fieldIndex({
          page: 1,
          page_size: 999,
          custom_form_id: this.customFormId,
          sort_name: 'sort',
          sort_type: 'asc',
        })
        if (res.data && res.data instanceof Array) {
          res.data.forEach(i => {
            if (i.field) {
              if (
                (i.edit_input === "checkbox" || i.edit_input === "radio" || i.edit_input === "select") &&
                i.parameter_id
              ) {
                getparameter({
                  id: i.parameter_id
                }).then((res) => {
                  i._paramters = res.detail ?? [];
                });
              }
              if (
                (i.edit_input === "checkbox" || i.edit_input === "radio" || i.edit_input === "select") &&
                i.link_table_name
              ) {
                index({
                  page: 1,
                  page_size: 999,
                  table_name: i.link_table_name,
                }).then((res) => {
                  i._paramters = res.data ?? [];
                });
              }
            }
          })
        }
        this.importForm = res.data
          ?.filter((i) => i.list_show)
          .map((i) => {
            return i
          })
      },
    },
    watch: {
      isShow(newVal) {
        if (newVal) {
          this.form.rukuleixing = this.rukuType
          this.rukuTypeName = this.rukuType == '回库' ? '归还' : this.rukuType
          console.log(this.rukuTypeName)
          if(this.rukuTypeName=='盘点'){
            this.form.pandianleixing = '正常盘点'
          }
          if (this.rukuType == '采购') {
            this.getHt()
          }
          if (this.rukuType == '请示') {
            this.getQs()
          }
          if (this.rukuType == '应急采购') {
            this.getYj()
          }
          if (this.type === 'editor') {
            this.getDetail()
          }
          if(this.type=='add'){
            this.form.jingbanren = this.authName
          }
        } else {
          this.id = ''
          this.type = ''
          this.authName = ''
          this.mingxiList = []
          this.fileList = []
          this.$refs['dialog'].reset()
        }
      }
    }

  }
</script>

<style scoped lang="scss">
  .mingxiwrap {
    display: flex;
    flex-wrap: wrap;
  }

  .mingxiwrap .xy-table-item {
    margin-bottom: 10px
  }

  .searchCompanys {
    display: flex;
    justify-content: space-between;
    margin-bottom: 15px;
  }

  ::v-deep .searchCompanys .el-input {
    width: 82%
  }

  .xy-table-item-label {
    width: 160px;
  }

  .img__delete {
    transform: scale(0.8, 0.8);

    position: absolute;
    top: 4px;
    right: 4px;
  }

  ::v-deep .avatar-uploader .el-upload {
    border: 1px dashed #d9d9d9;
    border-radius: 6px;
    cursor: pointer;
    position: relative;
    overflow: hidden;
  }

  ::v-deep .avatar-uploader .el-upload:hover {
    border-color: #409EFF;
  }

  ::v-deep .el-upload--picture-card {
    font-size: 28px;
    color: #8c939d;
    width: 80px !important;
    height: 80px !important;
    line-height: 80px !important;
    text-align: center;
  }

  ::v-deep .avatar-uploader-icon {
    font-size: 28px;
    color: #8c939d;
    width: 80px !important;
    height: 80px !important;
    line-height: 80px !important;
    text-align: center;
  }

  ::v-deep .avatar {
    width: 80px !important;
    display: block;
    border-radius: 6px;
  }

  ::v-deep .xy-table-item-label {
    width: 160px !important;
  }

  ::v-deep .el-date-editor .el-range-separator {
    width: auto !important;
  }

  ::v-deep .el-input-number .el-input__inner {
    text-align: left !important;
  }
</style>
