import ImageUpload from '@/components/file-upload'
import { getWebsit } from '@/api/customerManagement.js'
import { listPageV2 } from '@/api/auxiliaryFittings/supplier'
import { materialCategoryList } from '@/api/auxiliaryMaterialClass'
import { materialNormList } from '@/api/auxiliaryPriceManagement'
import { listPageV2 as peijianList } from '@/api/auxiliaryFittings/attachmentProfile'
import {
  websitPurchaseInList,
  websitPurchaseInImport,
  websitPurchaseRetImport,
  websitPurchaseInDetail
} from '@/api/purchasingManagement.js'
import { commonTemplateDownload } from '@/api/common.js'
import { required, mobileRequired, mobile } from '@/components/template/rules_verify.js'
import { storageListPageV2 } from '@/api/storage'
export default {
  data() {
    return {
      // 表格属性
      tableAttributes: {
        // 启用勾选列
        selectColumn: false
      },
      // 表格事件
      tableEvents: {
        'selection-change': this.selectionChange
      },
      recordSelected: [],
      formDialog: false,
      formDialogType: 0, // 0:新增, 1:编辑, 2:查看, 3:审核
      formDialogTitles: ['新增', '编辑', '查看', '审核'],
      pageType: this?.$route?.name,
      materialCategoryListL1: [],
      materialCategoryListL2: [],
      materialNormList: [],
      peijianList: [],
      websitPurchaseInList: [],
      listPageV2Data: [],
      cangkuList: []
    }
  },
  computed: {
    // 事件组合
    optionsEvensGroup() {
      return [
        [
          [
            this.optionsEvensAuth('add', {
              click: this.addData
            })
          ]
        ],
        [
          [
            this.optionsEvensAuth('template', {
              isRole: !!~['auxiliaryMaterialsStorage', 'partsStorage'].indexOf(this?.$route?.name),
              click: () => {
                commonTemplateDownload({ name: '采购入库模板.xlsx' }, `${this.$route.meta.title}`)
                  .then(res => {
                    this.$message({
                      message: '下载成功',
                      type: 'success'
                    })
                  })
                  .catch(err => {
                    this.$message.error('下载失败')
                  })
              }
            })
          ],
          [
            this.optionsEvensAuth('imp', ({ moduleName }) => {
              return {
                isRole: !!~['auxiliaryMaterialsStorage', 'partsStorage'].indexOf(this?.$route?.name),
                name: moduleName,
                render: () => {
                  return this.importButton(websitPurchaseInImport, moduleName, { goodsType: this.storageType })
                }
              }
            })
          ]
        ],
        [
          [
            this.optionsEvensAuth('template', {
              isRole: !!~['returnAuxiliaryMaterials', 'partsReturn'].indexOf(this?.$route?.name),
              click: () => {
                commonTemplateDownload({ name: '采购退货模板.xlsx' }, `${this.$route.meta.title}`)
                  .then(res => {
                    this.$message({
                      message: '下载成功',
                      type: 'success'
                    })
                  })
                  .catch(err => {
                    this.$message.error('下载失败')
                  })
              }
            })
          ],
          [
            this.optionsEvensAuth('imp', ({ moduleName }) => {
              return {
                isRole: !!~['returnAuxiliaryMaterials', 'partsReturn'].indexOf(this?.$route?.name),
                name: moduleName,
                render: () => {
                  return this.importButton(websitPurchaseRetImport, moduleName, { goodsType: this.storageType })
                }
              }
            })
          ]
        ]
      ]
    },
    moreParameters() {
      return [
        {
          name: '状态',
          key: 'flag',
          value: this?.$route?.params?.pageCode || '',
          conditions: [
            {
              label: `全部`,
              value: ''
            },
            {
              label: `已保存`,
              value: 'SAVE'
            },
            {
              label: `已审核`,
              value: 'OK'
            },
            {
              label: `失败`,
              value: 'FAIL'
            }
          ]
        }
      ]
    },
    columns() {
      return [
        ...(() => {
          if (!!~['auxiliaryMaterialsStorage', 'returnAuxiliaryMaterials'].indexOf(this.$route?.name)) {
            return [
              {
                columnAttributes: {
                  label: '大类名称',
                  prop: 'parentCategoryId'
                },
                render: (h, { row, column, index }) => {
                  return row.isEditRow ? (
                    <div class="redbordererr">
                      <el-form-item
                        label=""
                        lebel-width="0px"
                        prop={`items.${index}.parentCategoryId`}
                        rules={required}
                      >
                        <el-select
                          value={row[column.columnAttributes.prop]}
                          onInput={val => {
                            row[column.columnAttributes.prop] = val
                          }}
                          onChange={val => {
                            row['goodsCategoryId'] = ''
                            row['goodsCategoryName'] = ''
                            row['goodsId'] = ''
                            row['goodsName'] = ''
                            this.materialNormList = []
                            this.qkrow(row)
                            if (val) {
                              row['parentCategoryName'] = this.materialCategoryListL1.find(
                                item => item.categoryId == val
                              ).categoryName
                            } else {
                              row['parentCategoryName'] = ''
                            }
                            this.$nextTick(this.jiaoyan)
                          }}
                          placeholder="请选择"
                        >
                          {this.materialCategoryListL1.map((item, index_) => (
                            <el-option key={index_} label={item.categoryName} value={item.categoryId}></el-option>
                          ))}
                        </el-select>
                      </el-form-item>
                    </div>
                  ) : (
                    <div>{row['parentCategoryName']}</div>
                  )
                }
              }
            ]
          }
          return []
        })(),
        ...(() => {
          if (!!~['auxiliaryMaterialsStorage', 'returnAuxiliaryMaterials'].indexOf(this.$route?.name)) {
            return [
              {
                columnAttributes: {
                  label: '小类名称',
                  prop: 'goodsCategoryId'
                },
                render: (h, { row, column, index }) => {
                  var selectList = row['parentCategoryId']
                    ? this.materialCategoryListL2.filter(item => item.parentCategoryId == row['parentCategoryId'])
                    : []
                  return row.isEditRow ? (
                    <div class="redbordererr">
                      <el-form-item label="" lebel-width="0px" prop={`items.${index}.goodsCategoryId`} rules={required}>
                        <el-select
                          value={row[column.columnAttributes.prop]}
                          onInput={val => {
                            row[column.columnAttributes.prop] = val
                          }}
                          placeholder="请选择"
                          onChange={val => {
                            row['goodsId'] = ''
                            row['goodsName'] = ''
                            this.qkrow(row)
                            if (val) {
                              row['goodsCategoryName'] = selectList.find(item => item.categoryId == val).categoryName
                              materialNormList({
                                isShowStockQty: true,
                                websitId: this.formData.websitId,
                                storageId: this.formData.storageId,
                                pageNum: 1,
                                pageSize: -1,
                                params: [
                                  { param: 'b.category_id', compare: '=', value: val },
                                  { param: 'a.status', compare: '=', value: 'ON' }
                                ]
                              }).then(res => {
                                this.materialNormList = res.data.records
                              })
                            } else {
                              this.materialNormList = []
                              row['goodsCategoryName'] = ''
                            }
                            this.$nextTick(this.jiaoyan)
                          }}
                        >
                          {selectList.map((item, index_) => (
                            <el-option key={index_} label={item.categoryName} value={item.categoryId}></el-option>
                          ))}
                        </el-select>
                      </el-form-item>
                    </div>
                  ) : (
                    <div>{row['goodsCategoryName']}</div>
                  )
                }
              }
            ]
          }
          return []
        })(),
        ...(() => {
          if (!!~['auxiliaryMaterialsStorage', 'returnAuxiliaryMaterials'].indexOf(this.$route?.name)) {
            return [
              {
                columnAttributes: {
                  label: '辅材',
                  prop: 'goodsId'
                },
                render: (h, { row, column, index }) => {
                  return row.isEditRow ? (
                    <div class="redbordererr">
                      <el-form-item label="" lebel-width="0px" prop={`items.${index}.goodsId`} rules={required}>
                        <el-select
                          value={row[column.columnAttributes.prop]}
                          onInput={val => {
                            row[column.columnAttributes.prop] = val
                          }}
                          placeholder="请选择"
                          onChange={val => {
                            if (val) {
                              var data = this.materialNormList.find(item => item.goodsId == val)
                              row['goodsName'] = data.goodsName
                              this.qkrow(row, {
                                goodsStockUnit: data.goodsStockUnit,
                                goodsCode: data.goodsCode,
                                goodsSpecification: data.goodsSpecification,
                                brand: '',
                                productCategory: '',
                                cost: data.cost,
                                costValue: '',
                                stockQty: data.stockQty
                              })
                            } else {
                              row['goodsName'] = ''
                              this.qkrow(row)
                            }
                            this.$nextTick(this.jiaoyan)
                          }}
                        >
                          {this.materialNormList
                            .filter(
                              item =>
                                !~[
                                  ...this.formData.items.map(val => val.goodsId).filter(val => val != row.goodsId)
                                ].indexOf(item.goodsId)
                            )
                            .map((item, index_) => (
                              <el-option key={index_} label={item.goodsName} value={item.goodsId}></el-option>
                            ))}
                        </el-select>
                      </el-form-item>
                    </div>
                  ) : (
                    <div>{row['goodsName']}</div>
                  )
                }
              }
            ]
          }
          return []
        })(),
        ...(() => {
          if (!!~['partsStorage', 'partsReturn'].indexOf(this.$route?.name)) {
            return [
              {
                columnAttributes: {
                  label: '配件',
                  prop: 'goodsId'
                },
                render: (h, { row, column, index }) => {
                  return row.isEditRow ? (
                    <div class="redbordererr">
                      <el-form-item label="" lebel-width="0px" prop={`items.${index}.goodsId`} rules={required}>
                        <el-select
                          value={row[column.columnAttributes.prop]}
                          onInput={val => {
                            row[column.columnAttributes.prop] = val
                          }}
                          placeholder="请选择"
                          onChange={val => {
                            this.materialNormList = []
                            if (val) {
                              var data = this.peijianList.find(item => item.goodsId == val)
                              row['goodsName'] = data.goodsName
                              this.qkrow(row, {
                                goodsStockUnit: data.goodsStockUnit,
                                goodsCode: data.goodsCode,
                                goodsSpecification: data.goodsSpecification,
                                brand: data.brandRelaName,
                                productCategory: data.productRelaName,
                                cost: data.cost,
                                costValue: '',
                                stockQty: data.stockQty
                              })
                            } else {
                              row['goodsName'] = ''
                              this.qkrow(row)
                            }
                            this.$nextTick(this.jiaoyan)
                          }}
                        >
                          {this.peijianList
                            .filter(
                              item =>
                                !~[
                                  ...this.formData.items.map(val => val.goodsId).filter(val => val != row.goodsId)
                                ].indexOf(item.goodsId)
                            )
                            .map((item, index_) => (
                              <el-option key={index_} label={item.goodsName} value={item.goodsId}></el-option>
                            ))}
                        </el-select>
                      </el-form-item>
                    </div>
                  ) : (
                    <div>{row['goodsName']}</div>
                  )
                }
              }
            ]
          }
          return []
        })(),
        ...(() => {
          if (
            !!~['auxiliaryMaterialsStorage', 'returnAuxiliaryMaterials', 'partsStorage', 'partsReturn'].indexOf(
              this.$route?.name
            )
          ) {
            return [
              {
                columnAttributes: {
                  label: '单位',
                  prop: 'goodsStockUnit'
                }
              }
            ]
          }
          return []
        })(),
        ...(() => {
          if (!!~['auxiliaryMaterialsStorage', 'partsStorage'].indexOf(this.$route?.name)) {
            return [
              {
                columnAttributes: {
                  label: '数量',
                  prop: 'recQty'
                },
                render: (h, { row, column, index }) => {
                  return row.isEditRow ? (
                    <div class="redbordererr">
                      <el-form-item label="" lebel-width="0px" prop={`items.${index}.recQty`} rules={required}>
                        <el-input
                          type="number"
                          value={row[column.columnAttributes.prop]}
                          onInput={val => {
                            row[column.columnAttributes.prop] = val
                            if (val) {
                              row.costValue = this.setNumber(Number(row.cost) * Number(val))
                            } else {
                              row.costValue = ''
                            }
                            this.$nextTick(this.jiaoyan)
                          }}
                          placeholder="请选择"
                        ></el-input>
                      </el-form-item>
                    </div>
                  ) : (
                    <div>{row[column.columnAttributes.prop]}</div>
                  )
                }
              }
            ]
          }
          return []
        })(),
        ...(() => {
          if (!!~['returnAuxiliaryMaterials', 'partsReturn'].indexOf(this.$route?.name)) {
            return [
              {
                columnAttributes: {
                  label: '退货数量',
                  prop: 'retQty'
                },
                render: (h, { row, column, index }) => {
                  return row.isEditRow ? (
                    <div class="redbordererr">
                      <el-form-item label="" lebel-width="0px" prop={`items.${index}.retQty`} rules={required}>
                        <el-input
                          type="number"
                          value={row[column.columnAttributes.prop]}
                          onInput={val => {
                            row[column.columnAttributes.prop] = val
                            if (val) {
                              row.retValue = this.setNumber(Number(row.cost) * Number(val))
                            } else {
                              row.retValue = ''
                            }
                            this.$nextTick(this.jiaoyan)
                          }}
                          placeholder="请选择"
                        ></el-input>
                      </el-form-item>
                    </div>
                  ) : (
                    <div>{row[column.columnAttributes.prop]}</div>
                  )
                }
              }
            ]
          }
          return []
        })(),
        ...(() => {
          if (!!~['returnAuxiliaryMaterials', 'partsReturn'].indexOf(this.$route?.name)) {
            return [
              {
                columnAttributes: {
                  label: '退款金额',
                  prop: 'retValue'
                }
              }
            ]
          }
          return []
        })(),
        ...(() => {
          if (!!~['auxiliaryMaterialsStorage', 'returnAuxiliaryMaterials'].indexOf(this.$route?.name)) {
            return [
              {
                columnAttributes: {
                  label: '商品代码',
                  prop: 'goodsCode'
                }
              }
            ]
          }
          return []
        })(),
        ...(() => {
          if (!!~['auxiliaryMaterialsStorage', 'returnAuxiliaryMaterials'].indexOf(this.$route?.name)) {
            return [
              {
                columnAttributes: {
                  label: '规格型号',
                  prop: 'goodsSpecification'
                }
              }
            ]
          }
          return []
        })(),
        ...(() => {
          if (!!~['partsStorage', 'partsReturn'].indexOf(this.$route?.name)) {
            return [
              {
                columnAttributes: {
                  label: '配件编码',
                  prop: 'goodsCode'
                }
              }
            ]
          }
          return []
        })(),
        ...(() => {
          if (!!~['partsStorage', 'partsReturn'].indexOf(this.$route?.name)) {
            return [
              {
                columnAttributes: {
                  label: '适用品牌',
                  prop: 'brand'
                }
              }
            ]
          }
          return []
        })(),
        ...(() => {
          if (!!~['partsStorage', 'partsReturn'].indexOf(this.$route?.name)) {
            return [
              {
                columnAttributes: {
                  label: '适用产品大类',
                  prop: 'productCategory'
                }
              }
            ]
          }
          return []
        })(),
        ...(() => {
          if (!!~['returnAuxiliaryMaterials', 'partsReturn'].indexOf(this.$route?.name)) {
            return [
              {
                columnAttributes: {
                  label: '采购数量',
                  prop: 'recQty'
                }
              }
            ]
          }
          return []
        })(),
        ...(() => {
          if (
            !!~['auxiliaryMaterialsStorage', 'returnAuxiliaryMaterials', 'partsStorage', 'partsReturn'].indexOf(
              this.$route?.name
            )
          ) {
            return [
              {
                columnAttributes: {
                  label: '采购价格',
                  prop: 'cost'
                },
                render: (h, { row, column, index }) => {
                  return row.isEditRow ? (
                    <div class="redbordererr">
                      <el-form-item label="" lebel-width="0px" prop={`items.${index}.cost`} rules={required}>
                        <el-input
                          type="number"
                          value={row[column.columnAttributes.prop]}
                          onInput={val => {
                            row[column.columnAttributes.prop] = val
                            if (!!~['auxiliaryMaterialsStorage', 'partsStorage'].indexOf(this.$route?.name)) {
                              if (val) {
                                row.costValue = this.setNumber(Number(row.recQty) * Number(val))
                              } else {
                                row.costValue = ''
                              }
                            } else if (!!~['returnAuxiliaryMaterials', 'partsReturn'].indexOf(this.$route?.name)) {
                              if (val) {
                                row.retValue = this.setNumber(Number(row.retQty) * Number(val))
                              } else {
                                row.retValue = ''
                              }
                            }
                            this.$nextTick(this.jiaoyan)
                          }}
                          placeholder="请选择"
                        ></el-input>
                      </el-form-item>
                    </div>
                  ) : (
                    <div>{row[column.columnAttributes.prop]}</div>
                  )
                }
              }
            ]
          }
          return []
        })(),
        ...(() => {
          if (
            !!~['auxiliaryMaterialsStorage', 'returnAuxiliaryMaterials', 'partsStorage', 'partsReturn'].indexOf(
              this.$route?.name
            )
          ) {
            return [
              {
                columnAttributes: {
                  label: '采购金额',
                  prop: 'costValue'
                }
              }
            ]
          }
          return []
        })(),
        ...(() => {
          if (
            !!~['auxiliaryMaterialsStorage', 'returnAuxiliaryMaterials', 'partsStorage', 'partsReturn'].indexOf(
              this.$route?.name
            ) &&
            this.formData.flag !== 'OK'
          ) {
            return [
              {
                columnAttributes: {
                  label: '库存数量',
                  prop: 'stockQty'
                }
              }
            ]
          }
          return []
        })(),
        ...(() => {
          if (!!~[0, 1].indexOf(this.formDialogType)) {
            return [
              {
                columnAttributes: {
                  label: '操作',
                  prop: ''
                },
                render: (h, { row, column, index }) => {
                  return (
                    <div class="operation-btns">
                      <el-button
                        type="text"
                        onClick={() => {
                          this.formData.items.splice(index, 1)
                        }}
                      >
                        删除
                      </el-button>
                      {row.isEditRow ? (
                        <el-button
                          type="text"
                          onClick={() => {
                            this.$refs.formRef.validate((valid, invalidFields, errLabels) => {
                              if (valid) {
                                this.formData.items[index].isEditRow = false
                              }
                            })
                          }}
                        >
                          确定
                        </el-button>
                      ) : null}
                      {!row.isEditRow ? (
                        <el-button
                          type="text"
                          onClick={() => {
                            this.formData.items.map((item, index_) => {
                              if (index_ == index) {
                                item.isEditRow = true
                                if (
                                  !!~['auxiliaryMaterialsStorage', 'returnAuxiliaryMaterials'].indexOf(
                                    this.$route?.name
                                  ) &&
                                  row.goodsCategoryId
                                ) {
                                  materialNormList({
                                    isShowStockQty: true,
                                    websitId: this.formData.websitId,
                                    pageNum: 1,
                                    pageSize: -1,
                                    params: [
                                      { param: 'b.category_id', compare: '=', value: row.goodsCategoryId },
                                      { param: 'a.status', compare: '=', value: 'ON' }
                                    ]
                                  }).then(res => {
                                    this.materialNormList = res.data.records
                                  })
                                }
                              } else {
                                item.isEditRow = false
                              }
                            })
                          }}
                        >
                          编辑
                        </el-button>
                      ) : null}
                    </div>
                  )
                }
              }
            ]
          }
          return []
        })()
      ]
    },
    formItems1() {
      return [
        {
          md: 24,
          isShow: true,
          name: 'slot-component',
          formItemAttributes: {
            label: '',
            prop: '',
            'label-width': '0px'
          },
          render: (h, { props, onInput }) => {
            var { value } = props
            return (
              <div>
                <el-descriptions
                  border
                  title=""
                  column={2}
                  colon={false}
                  labelStyle={{ width: '8%' }}
                  contentStyle={{ width: '17%' }}
                >
                  <el-descriptions-item label="单据状态">
                    {{ SAVE: '保存', OK: '通过', FAIL: '失败' }[this.formData.flag]}
                  </el-descriptions-item>
                  <el-descriptions-item label="单据编号">
                    {(!!~['auxiliaryMaterialsStorage', 'partsStorage'].indexOf(this.$route?.name)
                      ? this.formData.purchaseId
                      : this.formData.purchaseRetId) || ''}
                  </el-descriptions-item>
                </el-descriptions>
                <el-descriptions
                  border
                  title=""
                  column={4}
                  colon={false}
                  labelStyle={{ width: '8%' }}
                  contentStyle={{ width: '17%' }}
                  style="margin-top:-1px"
                >
                  <el-descriptions-item label="网点名称">
                    <div class="redbordererr">
                      <el-form-item label="" lebel-width="0px" prop={`websitId`} rules={required}>
                        <el-select
                          style="width:100%"
                          value={this.formData.websitId}
                          onInput={val => {
                            this.formData.websitId = val
                          }}
                          placeholder="请选择"
                          disabled={this.formDialogType >= 2}
                          onChange={val => {
                            this.formData.items = []
                            this.formData.storageId = ''
                            this.formData.storageName = ''
                            this.cangkuList = []
                            this.getStorageListPageV2(val)
                            if (val) {
                              this.formData['websitName'] = this.getWebsitList.find(item => item.websitId == val).name
                            } else {
                              this.formData['websitName'] = ''
                            }
                            this.getorderlist()
                            this.$nextTick(this.jiaoyan)
                          }}
                        >
                          {this.getWebsitList.map(item => (
                            <el-option key={item.websitId} label={item.name} value={item.websitId}></el-option>
                          ))}
                        </el-select>
                      </el-form-item>
                    </div>
                  </el-descriptions-item>
                  <el-descriptions-item label="供应商名称">
                    <div class="redbordererr">
                      <el-form-item label="" lebel-width="0px" prop={`venderId`} rules={required}>
                        <el-select
                          style="width:100%"
                          value={this.formData.venderId}
                          onInput={val => {
                            this.formData.venderId = val
                          }}
                          placeholder="请选择"
                          disabled={this.formDialogType >= 2}
                          onChange={val => {
                            if (val) {
                              this.formData['venderName'] = this.listPageV2Data.find(
                                item => item.venderId == val
                              ).venderName
                            } else {
                              this.formData['venderName'] = ''
                            }
                            this.getorderlist()
                            this.$nextTick(this.jiaoyan)
                          }}
                        >
                          {this.listPageV2Data.map(item => (
                            <el-option key={item.venderId} label={item.venderName} value={item.venderId}></el-option>
                          ))}
                        </el-select>
                      </el-form-item>
                    </div>
                  </el-descriptions-item>
                  <el-descriptions-item
                    label={
                      !!~['returnAuxiliaryMaterials', 'partsReturn'].indexOf(this.$route?.name)
                        ? '出库仓库'
                        : '入库仓库'
                    }
                  >
                    <div class="redbordererr">
                      <el-form-item label="" lebel-width="0px" prop={`storageId`} rules={required}>
                        <el-select
                          style="width:100%"
                          disabled={
                            this.formDialogType === 2 ||
                            !(
                              !this.formData.id ||
                              this.formDialogType === 1 ||
                              (this.formDialogType === 3 && this.formData.isImport == true && !!this.formData.id)
                            )
                          }
                          value={this.formData.storageId}
                          onInput={val => {
                            this.formData.storageId = val
                          }}
                          placeholder="请选择"
                          onChange={val => {
                            if (val) {
                              this.formData['storageName'] = this.cangkuList.find(
                                item => item.storageId == val
                              )?.storageName
                            } else {
                              this.formData['storageName'] = ''
                            }
                            if (~['partsStorage', 'partsReturn'].indexOf(this.$route?.name)) {
                              if (val) {
                                peijianList({
                                  isShowStockQty: true,
                                  websitId: this.formData.websitId,
                                  storageId: this.formData.storageId,
                                  pageNum: 1,
                                  pageSize: -1,
                                  params: [
                                    { param: 'a.status', compare: '=', value: 'ON' },
                                    { param: 'a.norm_type', compare: '=', value: 'M' }
                                  ]
                                }).then(res => {
                                  this.peijianList = res.data.records
                                })
                              } else {
                                this.peijianList = []
                              }
                            }
                            if (!this.formData.isImport) {
                              this.getorderlist()
                            }
                            this.$nextTick(this.jiaoyan)
                          }}
                        >
                          {this.cangkuList.map(item => (
                            <el-option key={item.storageId} label={item.storageName} value={item.storageId}></el-option>
                          ))}
                        </el-select>
                      </el-form-item>
                    </div>
                  </el-descriptions-item>
                  <el-descriptions-item label=""></el-descriptions-item>
                </el-descriptions>
                {!!~['returnAuxiliaryMaterials', 'partsReturn'].indexOf(this.$route?.name) ? (
                  <el-descriptions
                    border
                    title=""
                    column={4}
                    colon={false}
                    labelStyle={{ width: '8%' }}
                    contentStyle={{ width: '17%' }}
                    style="margin-top:-1px"
                  >
                    <el-descriptions-item label="采购入库单号" contentStyle={{ width: '42%' }}>
                      <div class="redbordererr">
                        <el-form-item label="" lebel-width="0px" prop={`purchaseId`}>
                          <zj-select
                            style="width:100%"
                            value={this.formData.purchaseId}
                            onInput={val => {
                              this.formData.purchaseId = val
                            }}
                            placeholder="请选择"
                            disabled={this.formDialogType >= 2}
                            clearable={true}
                            filterable={true}
                            blurNoMatchText={true}
                            blurNoMatchInputBorderColor=""
                            onChange={val => {
                              if (val) {
                                var data = this.websitPurchaseInList.find(item => item.purchaseId == val)
                                if (data) {
                                  websitPurchaseInDetail({ purchaseId: data.purchaseId }).then(res => {
                                    Object.assign(this.formData, {
                                      items: res.data.items.map((item, index) => ({
                                        ...item,
                                        retQty: '',
                                        retValue: '',
                                        isEditRow: !index
                                      }))
                                    })
                                    var row = this.formData.items[0]
                                    if (
                                      !!~['auxiliaryMaterialsStorage', 'returnAuxiliaryMaterials'].indexOf(
                                        this.$route?.name
                                      ) &&
                                      row &&
                                      row.goodsCategoryId
                                    ) {
                                      materialNormList({
                                        isShowStockQty: true,
                                        websitId: this.formData.websitId,
                                        storageId: this.formData.storageId,
                                        pageNum: 1,
                                        pageSize: -1,
                                        params: [
                                          { param: 'b.category_id', compare: '=', value: row.goodsCategoryId },
                                          { param: 'a.status', compare: '=', value: 'ON' }
                                        ]
                                      }).then(res => {
                                        this.materialNormList = res.data.records
                                      })
                                    }
                                  })
                                  return
                                }
                              }
                              this.formData.items = []
                              this.$nextTick(this.jiaoyan)
                            }}
                          >
                            {this.websitPurchaseInList.map(item => (
                              <zj-option
                                key={item.purchaseId}
                                label={item.showLabel}
                                value={item.purchaseId}
                              ></zj-option>
                            ))}
                          </zj-select>
                        </el-form-item>
                      </div>
                    </el-descriptions-item>
                    <el-descriptions-item label="退货数量">
                      {!~[0, 1].indexOf(this.formDialogType)
                        ? this.formData.retTotalQty
                        : this.setNumber(
                            [
                              0,
                              0,
                              0,
                              ...this.formData.items.map(row => {
                                return Number(row.retQty)
                              })
                            ].reduce((a, b) => a + b)
                          )}
                    </el-descriptions-item>
                    <el-descriptions-item label="退款金额">
                      {!~[0, 1].indexOf(this.formDialogType)
                        ? this.formData.retTotalAmount
                        : this.setNumber(
                            [
                              0,
                              0,
                              0,
                              ...this.formData.items.map(row => {
                                return Number(row.cost) * Number(row.retQty)
                              })
                            ].reduce((a, b) => a + b)
                          )}
                    </el-descriptions-item>
                  </el-descriptions>
                ) : null}
                <el-descriptions
                  border
                  title=""
                  column={4}
                  colon={false}
                  labelStyle={{ width: '8%' }}
                  contentStyle={{ width: '17%' }}
                  style="margin-top:-1px"
                >
                  <el-descriptions-item label="制单人">{this.formData.createBy}</el-descriptions-item>
                  <el-descriptions-item label="制单时间">{this.formData.createTime}</el-descriptions-item>
                  <el-descriptions-item label="审核人">{this.formData.confirmBy}</el-descriptions-item>
                  <el-descriptions-item label="审核时间">{this.formData.confirmTime}</el-descriptions-item>
                </el-descriptions>
                <el-descriptions
                  border
                  title=""
                  column={4}
                  colon={false}
                  labelStyle={{ width: '8%' }}
                  contentStyle={{ width: '17%' }}
                  style="margin-top:-1px"
                >
                  <el-descriptions-item label="附件">
                    <ImageUpload
                      fileList={this.formData.imageUrl}
                      uid="imgSrc666_materials_drawing_images"
                      limit={1}
                      isEdit={this.formDialogType < 2}
                      fileType={['image']}
                    />
                  </el-descriptions-item>
                  <el-descriptions-item label="备注" contentStyle={{ width: '67%' }}>
                    <el-input
                      type="textarea"
                      placeholder="请输入内容"
                      value={this.formData.remark}
                      onInput={val => {
                        this.formData.remark = val
                      }}
                      maxlength="200"
                      show-word-limit
                      autosize={{ minRows: 6, maxRows: 8 }}
                      disabled={this.formDialogType >= 2}
                    ></el-input>
                  </el-descriptions-item>
                </el-descriptions>
              </div>
            )
          }
        }
      ]
    },
    formItems2() {
      return [
        {
          md: 24,
          isShow: true,
          name: 'slot-component',
          formItemAttributes: {
            label: '',
            prop: 'items',
            'label-width': '0px',
            rules: [...required]
          },
          render: (h, { props, onInput }) => {
            var { value } = props
            return (
              <div>
                {!!~[0, 1].indexOf(this.formDialogType) ? (
                  <div style="margin-bottom:8px">
                    <el-button
                      onClick={() => {
                        this.$refs.formRef.validate((valid, invalidFields, errLabels) => {
                          if (valid || (Object.keys(invalidFields).length == 1 && invalidFields.items)) {
                            this.formData.items.map(item => {
                              item.isEditRow = false
                            })
                            this.formData.items.push({
                              brand: '',
                              companyWechatId: '',
                              cost: '',
                              costValue: '',
                              goodsCategoryId: '',
                              goodsCategoryName: '',
                              goodsCode: '',
                              goodsId: '',
                              goodsName: '',
                              goodsSpecification: '',
                              goodsStockUnit: '',
                              goodsType: '',
                              note: '',
                              parentCategoryId: '',
                              parentCategoryName: '',
                              productCategory: '',
                              purchaseId: '',
                              recQty: '',
                              retQty: '',
                              retValue: '',
                              stockQty: '',
                              websitId: '',
                              websitName: '',
                              isEditRow: true
                            })
                          }
                        })
                      }}
                    >
                      添加
                    </el-button>
                  </div>
                ) : null}
                <zj-table
                  columns={this.columns}
                  tableData={this.formData.items}
                  tableAttributes={{
                    size: 'mini',
                    border: true
                  }}
                />
              </div>
            )
          }
        }
      ]
    }
  },
  methods: {
    // 表格列解析渲染数据更改
    columnParsing(item, defaultData) {
      if (item.jname === 'imageUrl') {
        defaultData.render = (h, { row, index, column }) => {
          return (
            <div style="padding:0 6px;cursor: pointer;">
              {row.imageUrl
                ? row.imageUrl
                    .split(',')
                    .map(url => (
                      <el-image
                        src={this.$showImgUrl(url)}
                        preview-src-list={[this.$showImgUrl(url)]}
                        fit="fit"
                        style="width:80px;height:80px;"
                      />
                    ))
                : null}
            </div>
          )
        }
      }
      return defaultData
    },
    // 监听勾选变化
    selectionChange(data) {
      this.recordSelected = data
    },
    // 获取
    getStorageListPageV2(websitId) {
      if (websitId) {
        storageListPageV2({
          pageNum: 1,
          pageSize: -1,
          params: [
            { param: 'a.websit_id', compare: '=', value: websitId },
            {
              param: 'a.type',
              compare: 'like',
              value: (() => {
                if (~['auxiliaryMaterialsStorage', 'returnAuxiliaryMaterials'].indexOf(this.$route?.name)) {
                  return '辅材'
                } else if (~['partsStorage', 'partsReturn'].indexOf(this.$route?.name)) {
                  return '配件'
                }
                return ''
              })()
            },
            { param: 'a.status', compare: '=', value: 'true' }
          ]
        }).then(res => {
          this.cangkuList = res.data.records
        })
      }
    },
    // 打开
    openForm() {
      this.getStorageListPageV2(this?.formData?.websitId)
      this.getorderlist(false)
      var req = [getWebsit({ type: 'C', status: true })]
      var runs = [
        res => {
          this.getWebsitList = res.data.filter(item => item.type == 'C')
        }
      ]
      if (~['auxiliaryMaterialsStorage', 'returnAuxiliaryMaterials'].indexOf(this.$route?.name)) {
        req.push(
          ...[
            listPageV2({
              pageNum: 1,
              pageSize: -1,
              params: [
                { param: 'a.status', compare: '=', value: 'ON' },
                { param: 'a.vender_type', compare: 'like', value: '辅材' }
              ]
            })
          ]
        )
        runs.push(
          ...[
            res => {
              this.listPageV2Data = res.data.records
            }
          ]
        )
      } else if (~['partsStorage', 'partsReturn'].indexOf(this.$route?.name)) {
        req.push(
          ...[
            listPageV2({
              pageNum: 1,
              pageSize: -1,
              params: [
                { param: 'a.status', compare: '=', value: 'ON' },
                { param: 'a.vender_type', compare: 'like', value: '配件' }
              ]
            })
          ]
        )
        runs.push(
          ...[
            res => {
              this.listPageV2Data = res.data.records
            }
          ]
        )
      }
      if (~['auxiliaryMaterialsStorage', 'returnAuxiliaryMaterials'].indexOf(this.$route?.name)) {
        req.push(
          ...[
            materialCategoryList({
              pageNum: 1,
              pageSize: -1,
              params: [
                { param: 'a.status', compare: '=', value: 'ON' },
                { param: 'a.category_level', compare: '=', value: '1' }
              ]
            }),
            materialCategoryList({
              pageNum: 1,
              pageSize: -1,
              params: [
                { param: 'a.status', compare: '=', value: 'ON' },
                { param: 'a.category_level', compare: '=', value: '2' }
              ]
            })
          ]
        )
        runs.push(
          ...[
            res => {
              this.materialCategoryListL1 = res.data.records
            },
            res => {
              this.materialCategoryListL2 = res.data.records
            }
          ]
        )
      } else if (~['partsStorage', 'partsReturn'].indexOf(this.$route?.name) && this.formData.websitId) {
        req.push(
          ...[
            peijianList({
              isShowStockQty: true,
              websitId: this.formData.websitId,
              storageId: this.formData.storageId,
              pageNum: 1,
              pageSize: -1,
              params: [
                { param: 'a.status', compare: '=', value: 'ON' },
                { param: 'a.norm_type', compare: '=', value: 'M' }
              ]
            })
          ]
        )
        runs.push(
          ...[
            res => {
              this.peijianList = res.data.records
            }
          ]
        )
      }
      Promise.all(req).then(ress => {
        ress.forEach((res, index) => {
          runs[index](res)
        })
        this.formDialog = true
      })
    },
    qkrow(row, data = {}) {
      ;[
        'goodsStockUnit',
        'recQty',
        'retQty',
        'retValue',
        'goodsCode',
        'goodsSpecification',
        'brand',
        'productCategory',
        'cost',
        'costValue',
        'stockQty'
      ].map(key => {
        if (row[key] !== undefined) {
          row[key] = data[key] !== undefined ? data[key] : ''
        }
      })
    },
    getorderlist(bool = true) {
      if (this.formData.websitId && this.formData.venderId) {
        if (~['returnAuxiliaryMaterials'].indexOf(this.$route?.name)) {
          if (bool) {
            this.websitPurchaseInList = []
            this.formData.items = []
            this.formData.purchaseId = ''
          }
          websitPurchaseInList({
            pageNum: 1,
            pageSize: -1,
            params: [
              { param: 'a.goods_type', compare: '=', value: 'M' },
              { param: 'a.flag', compare: '=', value: 'OK' },
              { param: 'a.websit_id', compare: '=', value: this.formData.websitId },
              { param: 'a.vender_id', compare: '=', value: this.formData.venderId }
            ]
          }).then(res => {
            this.websitPurchaseInList = res.data.records.map(item => ({
              ...item,
              showLabel: `单号:${item.purchaseId} / 金额:${item.totalAmount} / 时间:${item.createTime.split(' ')[0]}`
            }))
          })
        } else if (~['partsReturn'].indexOf(this.$route?.name)) {
          if (bool) {
            this.websitPurchaseInList = []
            this.formData.items = []
            this.formData.purchaseId = ''
          }
          websitPurchaseInList({
            pageNum: 1,
            pageSize: -1,
            params: [
              { param: 'a.goods_type', compare: '=', value: 'P' },
              { param: 'a.flag', compare: '=', value: 'OK' },
              { param: 'a.websit_id', compare: '=', value: this.formData.websitId },
              { param: 'a.vender_id', compare: '=', value: this.formData.venderId }
            ]
          }).then(res => {
            this.websitPurchaseInList = res.data.records.map(item => ({
              ...item,
              showLabel: `单号:${item.purchaseId} / 金额:${item.totalAmount} / 时间:${item.createTime.split(' ')[0]}`
            }))
          })
        }
      }
    },
    // 添加
    addData() {
      this.formDialogType = 0
      this.openForm()
    },
    // 关闭弹窗
    formCancel() {
      this.$refs.formRef.$refs.inlineForm.clearValidate()
      this.$data.formData = this.$options.data().formData
      this.formDialog = false
    },
    jiaoyan() {
      this.$refs.formRef.validate((valid, invalidFields, errLabels) => {}, false)
    },
    setNumber(val) {
      return Number(val.toFixed(2))
    }
  }
}