<!-- 供应商价格维护 -->
<template>
  <div class="container">
    <div class="table-filter">
      <div class="filter-item" @keyup.enter="getList">
        <Input v-model="params.keyWord" clearable placeholder="请输入关键字" />
      </div>
      <div class="filter-item">
        <Button type="primary" style="width: 90px;" @click="search">查询</Button>
      </div>
      <div class="filter-item" style="">
        <RadioGroup v-model="params.flowStatus" @on-change="stateChange">
          <Radio :label="1">
            审批中
<!--            <span style="color: #3F92F9">（{{ data.equelCount || 0 }}）</span>-->
          </Radio>
          <Radio :label="2">
            进行中
<!--            <span style="color: #f11111">（{{ data.notEquelCount || 0 }}）</span>-->
          </Radio>
          <Radio :label="3">
            已完成
            <!--            <span style="color: #f11111">（{{ data.notEquelCount || 0 }}）</span>-->
          </Radio>
        </RadioGroup>
      </div>
      <div class="filter-item" style="float:right;">
        <Button type="primary" style="width: 90px;" @click="notice">到货通知</Button>
      </div>
      <div class="filter-item" style="float:right;">
        <Button type="primary" style="width: 90px;" @click="expExcel">导出Excel</Button>
      </div>
    </div>
    <div class="tabs">
      <div
        @click="tabClick(index, item.techType)"
        :class="tabsIndex === index ? 'active' : ''"
        class="tab-item"
        v-for="(item, index) in titleData.amountItems"
        :key="index">
        {{ item.name + item.amountMoney }}
      </div>
    </div>
    <div class="content">
      <my-table
        :data="data"
        :columns="columns"
        :table-filter="tableFilter"
        :table-page="params"
        :multiple="true"
        :is-show-filter="false"
        @event-handle="eventHandle"
        @on-select="select"
        @on-change="changePage">
      </my-table>
    </div>
    <!--采购申请单-->
    <purchase-form v-model="applyBillShow" :data="applyBillFormData"></purchase-form>
    <my-modal v-model="show" :data="formData" @getlist="getList"></my-modal>
    <my-modal-form
      v-model="gysShow"
      title="供应商详情"
      :isMaterial="true"
      width="800px"
      :config="showFormConfig"
      :data="formData"
      :type="formType"
      @confirm="cfm">
    </my-modal-form>
    <tab-modal v-model="tabShow" :data="formData"></tab-modal>
    <delete-form v-model="deleteShow" :data="formData" @getlist="getList" @show-apply-bill="showApplyBill"></delete-form>
  </div>
</template>

<script>
import { exportExcel } from '@/libs/util'
import { GetPurContractPageList, PurContractArrivalNotice, GetPurContractTotal } from '@/api/applyPurchase'
import { GetApplyBill } from '@/api/stock'
import { GetFactoryPageList } from '@/api/baseData'
import MyTable from '_c/my-table/my-table'
import MyModal from './modal'
import TabModal from './tab-modal'
import MyModalForm from '_c/my-modal-form/my-modal-form'
import PurchaseForm from './purchase-form'
import DeleteForm from './delete-form'
export default {
  name: 'material_contract',
  components: {
    MyTable,
    MyModal,
    MyModalForm,
    TabModal,
    PurchaseForm,
    DeleteForm
  },
  data () {
    return {
      titleData: {},
      tabs: ['总额', '直喷', '打纸', '热转', '墨水'],
      tabsIndex: 0,
      currentData: {},
      formType: '',
      formData: {},
      applyBillFormData: {},
      tabShow: false,
      gysShow: false,
      applyBillShow: false,
      deleteShow: false,
      show: false,
      data: [],
      showFormConfig: [
        {
          type: 'input',
          label: '供应商代码',
          disabled: true,
          key: 'code',
          placeholder: '请输入供应商代码',
          span: 12
        },
        {
          type: 'input',
          label: '绑定用户',
          disabled: true,
          key: 'bingdUserID',
          placeholder: '请输入绑定用户',
          span: 12
        },
        {
          type: 'upload',
          label: '供应商名称',
          disabled: true,
          text: '上传营业执照',
          key: 'name'
        },
        {
          type: 'input',
          label: '账期',
          disabled: true,
          key: 'accountDate',
          placeholder: '请输入账期',
          span: 12
        },
        {
          type: 'input',
          label: '账期说明',
          disabled: true,
          key: 'accountDateRemark',
          placeholder: '请输入账期说明',
          span: 12
        },
        {
          type: 'input',
          comType: 'textarea',
          label: '备注',
          disabled: true,
          key: 'remark',
          placeholder: '请输入仓库说明'
        },
        {
          type: 'tabs',
          hiddenLabel: true,
          tabs: [
            {
              title: '工商信息',
              forms: [
                {
                  type: 'input',
                  label: '法定代表人',
                  disabled: true,
                  key: 'legalPerson',
                  placeholder: '请输入法定代表人',
                  span: 12
                },
                {
                  type: 'input',
                  label: '社会信用代码',
                  disabled: true,
                  key: 'societyCreditCode',
                  placeholder: '请输入社会信用代码',
                  span: 12
                },
                {
                  type: 'input',
                  label: '注册地址',
                  disabled: true,
                  key: 'registeredAddress',
                  placeholder: '请输入注册地址'
                },
                {
                  type: 'input',
                  label: '成立日期',
                  disabled: true,
                  key: 'establishDate',
                  placeholder: '请输入成立日期',
                  span: 12
                },
                {
                  type: 'input',
                  label: '注册资本',
                  disabled: true,
                  key: 'registeredCapital',
                  placeholder: '请输入注册资本',
                  span: 12
                },
                {
                  type: 'input',
                  label: '企业类型',
                  disabled: true,
                  key: 'enterpriseType',
                  placeholder: '请输入企业类型',
                  span: 12
                },
                {
                  type: 'input',
                  label: '营业期限',
                  disabled: true,
                  key: 'businessTerm',
                  placeholder: '请输入营业期限',
                  span: 12
                },
                {
                  type: 'input',
                  comType: 'textarea',
                  label: '营业范围',
                  disabled: true,
                  key: 'businessScope',
                  placeholder: '请输入营业范围'
                }
              ]
            },
            {
              title: '联系信息',
              forms: [
                {
                  type: 'input',
                  label: '联系人',
                  disabled: true,
                  key: 'linkMen',
                  placeholder: '请输入联系人',
                  span: 12
                },
                {
                  type: 'input',
                  label: '手机号码',
                  disabled: true,
                  key: 'mobile',
                  placeholder: '请输入手机号码',
                  span: 12
                },
                {
                  type: 'input',
                  label: '固定电话',
                  disabled: true,
                  key: 'telephone',
                  placeholder: '请输入固定电话',
                  span: 12
                },
                {
                  type: 'input',
                  label: '电子邮箱',
                  disabled: true,
                  key: 'email',
                  placeholder: '请输入电子邮箱',
                  span: 12
                },
                {
                  type: 'input',
                  label: '传真',
                  disabled: true,
                  key: 'fax',
                  placeholder: '请输入传真',
                  span: 12
                }
              ]
            },
            {
              title: '账户信息',
              forms: [
                {
                  type: 'input',
                  label: '对公户名',
                  disabled: true,
                  key: 'bankAccoutName',
                  placeholder: '请输入对公户名',
                  span: 12
                },
                {
                  type: 'input',
                  label: '开户银行',
                  disabled: true,
                  key: 'openBank',
                  placeholder: '请输入开户银行',
                  span: 12
                },
                {
                  type: 'input',
                  label: '对公账号',
                  disabled: true,
                  key: 'bankAccout',
                  placeholder: '请输入对公账号',
                  span: 12
                },
                {
                  type: '',
                  hiddenLabel: true
                },
                {
                  type: 'input',
                  label: '对私户名',
                  disabled: true,
                  key: 'priOpenBank',
                  placeholder: '请输入对私户名',
                  span: 12
                },
                {
                  type: 'input',
                  label: '开户银行',
                  disabled: true,
                  key: 'priBankAccout',
                  placeholder: '请输入开户银行',
                  span: 12
                },
                {
                  type: 'input',
                  label: '对私账号',
                  disabled: true,
                  key: 'priBankAccoutName',
                  placeholder: '请输入对私账号',
                  span: 12
                }
              ]
            },
            {
              title: '维护记录',
              type: 'picList',
              key: 'facPicList'
            },
            {
              title: '主营价格',
              type: 'material'
            },
            {
              title: '采购分析',
              type: 'charts'
            }
          ]
        }
      ],
      columns: [
        // {
        //   type: 'selection',
        //   width: 50
        // },
        {
          title: '序号',
          width: 80,
          align: 'center',
          sortable: true,
          render: (h, params) => {
            return h('span', params.row._index + 1)
          }
        },
        {
          title: '合同编号',
          key: 'purchaseBillNo',
          minWidth: 180,
          sortable: true,
          render: (h, params) => {
            let _this = this
            return h('a', {
              on: {
                click (e) {
                  e.stopPropagation()
                  _this.formData = { ...params.row }
                  if (params.row.status === 2 || params.row.status === 3) {
                    _this.tabShow = true
                  } else {
                    _this.show = true
                  }
                }
              }
            }, params.row.purchaseBillNo)
          }
        },
        {
          title: '申购单号',
          key: 'applyBillNo',
          minWidth: 200,
          render: (h, params) => {
            let _this = this
            return h('a', {
              on: {
                click (e) {
                  e.stopPropagation()
                  _this.showApplyBill(params.row.applyBillNo)
                }
              }
            }, params.row.applyBillNo)
          }
        },
        {
          title: '交货日期',
          key: 'deliverTime',
          minWidth: 150,
          sortable: true
        },
        {
          title: '件号',
          key: 'materialCode',
          minWidth: 150,
          sortable: true
        },
        {
          title: '物料名称',
          key: 'materialName',
          minWidth: 150,
          sortable: true
        },
        {
          title: '规格',
          key: 'spec',
          minWidth: 100,
          sortable: true
        },
        {
          title: '供应商',
          key: 'supplierName',
          minWidth: 200,
          sortable: true,
          render: (h, params) => {
            let _this = this
            return h('a', {
              on: {
                click (e) {
                  e.stopPropagation()
                  GetFactoryPageList({
                    key: params.row.supplierId,
                    pageIndex: 1,
                    pageSize: 1
                  }).then(res => {
                    if (res.code === 0) {
                      _this.formData = { ...res.result.list[0] }
                      _this.formType = 'form'
                      _this.gysShow = true
                    }
                  })
                }
              }
            }, params.row.supplierName)
          }
        },
        {
          title: '实时库存',
          key: 'stockNum',
          minWidth: 120,
          sortable: true
        },
        {
          title: '采购数量',
          key: 'purchaseQty',
          minWidth: 120,
          sortable: true
        },
        {
          title: '未入库数量',
          key: 'unStockInQty',
          minWidth: 120,
          sortable: true
        },
        {
          title: '单价',
          key: 'price',
          minWidth: 100,
          sortable: true
        },
        {
          title: '小计',
          key: 'totalAmount',
          minWidth: 100,
          sortable: true
        },
        {
          title: '合同状态',
          key: 'contractApproveState',
          minWidth: 120,
          align: 'center',
          sortable: true
        },
        {
          title: '操作',
          width: 100,
          align: 'center',
          fixed: 'right',
          render: (h, params) => {
            if (params.row.allowDelete) {
              return h('div', [
                h(
                  'Button',
                  {
                    props: {
                      type: 'error',
                      size: 'small'
                    },
                    style: {
                    },
                    on: {
                      click: (e) => {
                        e.stopPropagation()
                        GetApplyBill({
                          applyBillNo: params.row.applyBillNo
                        }).then(res => {
                          if (res.code === 0) {
                            this.formData = { ...params.row, ...res.result }
                            this.deleteShow = true
                          }
                        })
                      }
                    }
                  },
                  '删除'
                )
              ])
            } else {
              return h(
                'Button',
                {
                  props: {
                    type: 'error',
                    size: 'small',
                    disabled: true
                  }
                },
                '删除'
              )
            }
          }
        }
      ],
      tableFilter: [
        {
          name: 'Input',
          value: 'key',
          placeholder: '请输入关键字'
        },
        {
          name: 'Button',
          type: 'primary',
          text: '查询',
          e: 'search'
        },
        {
          name: 'Button',
          type: 'primary',
          text: '导出Excel',
          e: 'export'
        },
        {
          name: 'RadioGroup',
          value: 'status',
          list: [
            { label: '审批中', value: 0 },
            { label: '进行中', value: 1 },
            { label: '已完成', value: 2 }
          ]
        },
        {
          name: 'Button',
          type: 'primary',
          text: '到货通知',
          align: 'right',
          e: 'notice'
        }
      ],
      params: {
        pageIndex: 1,
        pageSize: 20,
        total: 0,
        status: 0
      }
    }
  },
  methods: {
    /* 显示申购单详情 */
    showApplyBill (applyBillNo) {
      GetApplyBill({
        applyBillNo
      }).then(res => {
        if (res.code === 0) {
          this.applyBillFormData = { ...res.result, applyBillNo }
          this.applyBillShow = true
        }
      })
    },
    getTabLabel (index) {
      let label = ''
      switch (index) {
        case 0:
          label = '总额' + (this.titleData.totalAmount || 0)
          break
        case 1:
          label = '直喷' + (this.titleData.directAmount || 0)
          break
        case 2:
          label = '打纸' + (this.titleData.paperAmount || 0)
          break
        case 3:
          label = '热转' + (this.titleData.heatAmount || 0)
          break
        case 4:
          label = '墨水' + (this.titleData.inkAmount || 0)
          break
      }
      return label
    },
    stateChange () {
      this.params.pageIndex = 1
      this.tabsIndex = 0
      this.params.technologyType = ''
      this.getPurContractTotal()
      this.getList()
    },
    notice () {
      this.purContractArrivalNotice()
    },
    expExcel () {
      GetPurContractPageList({
        ...this.params,
        pageIndex: 1,
        pageSize: 99999
      }).then(res => {
        if (res.code === 0) {
          let data = res.result.list
          if (data.length < 1) return this.$Message.error('数据为空！')
          exportExcel(this.columns, data, '合同管理')
        }
      })
    },
    search () {
      this.getList()
    },
    /* 选项卡切换 */
    tabClick (index, value) {
      this.tabsIndex = index
      this.params.pageIndex = 1
      this.params.technologyType = value
      this.getList()
    },
    select (section, row) {
      this.currentData = { ...row }
    },
    cfm (type, formData) {
      if (type === 'add') {
        FacPriceAdd({
          ...formData,
          materialCode: formData.code
        }).then(res => {
          if (res.code === 0) {
            this.$Message.info(res.msg)
            this.getList()
          }
        })
      } else if (type === 'edit') {
        FacPriceChange({
          ...formData,
          factoryPriceId: formData.id
        }).then(res => {
          if (res.code === 0) {
            this.$Message.info(res.msg)
            this.getList()
          }
        })
      }
    },
    // 检索条件事件处理
    eventHandle (option) {
      switch (option._evnet) {
        case 'search':
          this.params.pageIndex = 1
          this.params.keyWord = option.key
          this.params.status = option.status
          this.getList()
          break
        case 'export':
          GetPurContractPageList({
            ...this.params,
            pageIndex: 1,
            pageSize: 99999
          }).then(res => {
            if (res.code === 0) {
              let data = res.result.list
              if (data.length < 1) return this.$Message.error('数据为空！')
              exportExcel(this.columns, data, '合同管理')
            }
          })
          break
        case 'notice':
          this.purContractArrivalNotice()
          break
      }
    },
    /* 到货通知 */
    purContractArrivalNotice () {
      if (!this.currentData.id) return this.$Message.error('请选择数据！')
      if (this.currentData.status !== 2) return this.$Message.error('订单未审批！')
      PurContractArrivalNotice({ id: this.currentData.id }).then(res => {
        if (res.code === 0) {
          this.$Message.info('已向仓库发送到货通知！')
          this.currentData = {}
          this.getList()
        }
      })
    },
    changePage (pageIndex) {
      this.params.pageIndex = pageIndex
      this.getList()
    },
    getList () {
      this
        .$post('/api/storage-restructure/contract/page', this.params).then(res => {
          if (res.code === 200) {
            this.data = res.data.records
            this.params.total = res.data.total
          }
        })
    },
    getPurContractTotal () {
      this.$post('/api/storage-restructure/contract/amountStatistics',this.params).then(res => {
        if (res.code === 200) {
          this.titleData.amountItems = res.data
        }
      })
    }
  },
  mounted () {
    this.getPurContractTotal()
    this.getList()
  }
}
</script>

<style lang="less" scoped>
.container {
  height: 100%;
  display: flex;
  flex-direction: column;
  .table-filter {
    padding-bottom: 10px;
    height: 42px;
    line-height: 32px;
    overflow: hidden;
    .filter-item {
      margin-right: 10px;
      float: left;
    }
  }
  .tabs {
    margin-bottom: 10px;
    box-sizing: border-box;
    height: 50px;
    display: flex;
    justify-content: space-between;
    align-items: center;
    background: #FFFFFF;
    .tab-item {
      box-sizing: border-box;
      flex: 1;
      overflow: auto;
      border-right: 1px solid #dcdee2;
      border-bottom: 1px solid #dcdee2;
      text-align: center;
      height: 100%;
      display: flex;
      align-items: center;
      justify-content: center;
      font-size: 14px;
      font-weight: bold;
      cursor: pointer;
      &:last-child {
        border-right: none;
      }
      &.active {
        color: #3F92F9;
        border-bottom: 3px solid #3F92F9;
      }
    }
  }
  .content {
    flex: 1;
    overflow: auto;
  }
}
</style>
