<script setup lang="tsx">
import { onMounted, reactive, ref,computed } from 'vue'
import { ContentWrap } from '@/components/ContentWrap'
import {
  ElInput,
  FormInstance,
  // ElSwitch,
  ElTabPane,
  ElTabs,
  ElForm,
  ElFormItem,
  ElMessage,
  ElMessageBox,
  ElSelect,
  ElOption,
  ElRadioGroup,
  ElRadio,
  ElTableColumn,
  ElTable,
  ElDrawer
} from 'element-plus'
import { useRoute, useRouter } from 'vue-router'
import { goodsData, attrsValue } from '@/api/goods/types'
import { getProductDetail } from '@/api/goods'
import { AttrBaseItem } from '@/api/goods/types'
import { UpImgButtom } from '@/components/UpFile'
import { outData, outGood } from '@/api/erp/types'
import { getStoreList, getStoreUser, getOutGood, createOut } from '@/api/erp'
const pageTitle = ref('添加')
const { params } = useRoute()
const { push } = useRouter()
const actinoTabIndex = ref(1)
const selfBuild = reactive<outData>({
  type: 1,
  store_id: '',
  wid: '',
  create_admin_id: '',
  up_store_id: '',
  up_wid: '',
  product_list: []
})

const hzBuild = reactive<outData>({
  create_admin_id: '',
  store_id: '',
  up_store_id: '',
  product_list: []
})
const formData = reactive<goodsData & { attrs_value: attrsValue[]; keyword: string[] }>({
  // bar_code: '',
  product_type: 0,
  store_id: '',
  id: 0,
  store_name: '',
  video_open: 0,
  video_link: '',
  slider_image: [],
  image: [],
  store_info: '',
  keyword: [],
  cate_id: [],
  sales: 0,
  ficti: 0,
  spec_type: 0,
  is_show: 1,
  limit_num: 0,
  is_limit: 0,
  limit_type: 0,
  is_police: 0,
  shelf_life: 0,
  attrs: [],
  attrs_value: [], // 初始化为空数组
  sort: 0,
  description: '',
  show_type: 0,
  is_verify: 0,
  pay_qudou: 0,
  is_vip_product: 0,
  is_weigh: 0,
  specs: [],
  cost: 0
})
const attrs_value = reactive<
  attrsValue & {
    image: string[]
  }
>({
  suk: '默认',
  image: [],
  stock: 0,
  detail: {},
  price: 0,
  ot_price: 0,
  cost: 0
})

/**
 * 创建并返回一个字段验证规则对象
 *
 * @param {string} field - 需要验证的字段名称
 * @param {string} errorMessage - 当验证失败时显示的错误信息
 * @returns {Object} 包含验证规则的对象，包括错误信息、是否必填、及自定义验证器
 */
const validateField = (field, errorMessage) => {
  // 返回一个对象，定义了验证规则
  return {
    // 错误信息，在验证失败时展示
    message: errorMessage,
    // 标记字段为必填
    required: true,
    // 自定义验证器，接收三个参数：规则、数据、及回调函数
    validator: (_, __, callback) => {
      // 检查指定字段在属性值对象中是否存在
      if (!attrs_value[field]) {
        // 如果字段不存在，通过回调函数返回一个错误对象，包含错误信息
        callback(new Error(errorMessage))
      } else {
        // 如果字段存在，调用回调函数但不传递错误，表示验证通过
        callback()
      }
    }
  }
}

/**
 * 根据规格类型获取对应的验证规则
 *
 * 此函数用于根据不同的商品规格类型返回相应的验证规则它接受一个规格类型参数（specType），
 * 并根据此参数的值返回不同的验证规则对象如果specType的值是0，则返回包含商品图片、库存、售价和成本价的验证规则；
 * 如果specType的值是1，则返回一个空对象表示没有验证规则；如果specType的值不是0或1，则在控制台输出警告信息并返回一个空对象
 *
 * @param {number} specType - 商品的规格类型，用于确定返回哪种验证规则
 * @returns {Object} - 返回对应规格类型的验证规则对象
 */
const getRulesForSpecType = (specType) => {
  if (specType === 0) {
    // 当规格类型为0时，返回包含商品图片、库存、售价和成本价验证规则的对象
    return {
      sutimage: [validateField('image', '请选择商品图片')],
      stock: [validateField('stock', '请填写库存')],
      price: [validateField('price', '请填写售价')]
      // cost: [validateField('cost', '请填写成本价')]
    }
  } else if (specType === 1) {
    // 当规格类型为1时，返回一个空对象表示没有验证规则
    return {}
  } else {
    // 当规格类型不是0或1时，输出警告信息并返回一个空对象
    console.warn('Unknown spec_type:', specType)
    return {}
  }
}

const rules = reactive({
  create_admin_id: [{ required: true, message: '请选择创建人', trigger: 'change' }],
  supplier_id: [{ required: true, message: '请选择供应商', trigger: 'change' }],
  wid: [{ required: true, message: '请选择仓库', trigger: 'change' }],
  limit_num: [{ required: true, message: '请输入限购数量', trigger: 'blur' }],
  store_id: [{ required: true, message: '请选择门店', trigger: 'change' }],
  cate_id: [{ required: true, message: '请选择商品分类', trigger: 'change' }],
  store_name: [{ required: true, message: '请输入商品名称', trigger: 'blur' }],
  image: [{ required: true, message: '请选择商品主图', trigger: 'change' }],
  up_store_id: [{ required: true, message: '请选择调入门店', trigger: 'change' }],
  up_wid: [{ required: true, message: '请选择调入仓库', trigger: 'change' }],
  slider_image: [
    {
      message: '请选择轮播图片',
      trigger: 'change',
      required: true,
      validator: (_, val, callback) => {
        if (!val || val.length === 0) {
          callback(new Error('请选择轮播图片'))
        } else {
          callback()
        }
      }
    }
  ],
  ...getRulesForSpecType(formData.spec_type)
})
const formRef = ref<FormInstance>()
const formRefs = ref<FormInstance>()

/**
 * 保存表单数据
 * 此函数在用户提交表单时被触发，它首先验证表单数据的有效性，如果有效则处理数据并调用相应的API进行保存
 * @param {FormInstance | undefined} formEl - 表单实例，用于表单验证和获取表单数据
 * @returns {Promise<Array>} - 返回一个空数组，当前函数没有实际返回值，但为了保持接口一致性，返回了空数组
 */
const save = async (formEl: FormInstance | undefined) => {
  // 检查表单实例是否存在，如果不存在则返回空数组
  if (!formEl) return []
  // 验证表单数据，如果验证失败，则显示错误消息并中断保存流程
  const valid = await formEl.validate((valid, fields) => {
    if (valid) {
    } else {
      for (const key in fields) {
        ElMessage.error(fields[key][0].message)
        return
      }
      console.log('error submit!', fields)
    }
  })
  if (valid) {
    let ok = true
    let goods: Array<outGood> = []
    let pData: outData = {
      store_id: '',
      up_wid: '',
      create_admin_id: '',
      product_list: [],
      up_store_id: '',
      wid: ''
    }
    if (actinoTabIndex.value == 1) {
      checkGoods.value.forEach(
        (item: {
          id: number
          store_name: string
          bar_code: string
          product_num: number
          is_weigh: number
          pur_number: number
          product_id: number
          suk: string
          product_code: string
          product_name: string
          out_price: string
          price: string
        }) => {
          if (!item['pur_number'] || item['pur_number'] < 0) {
            ok = false
            return ElMessage.error('请填写正确的出库商品数量')
          } else {
            goods.push({
              id: item.id,
              product_id: item.product_id,
              product_name: item.product_name,
              bar_code: item.bar_code,
              suk: item.suk,
              product_num: item.product_num,
              is_weigh: item.is_weigh,
              pur_number: item.pur_number,
              product_code: item.product_code,
              name: item.product_name,
              out_price: item.out_price,
              price: item.price
            })
          }
        }
      )
    } else if (actinoTabIndex.value == 2) {
      checkGoodss.value.forEach(
        (item: {
          id: number
          store_name: string
          bar_code: string
          product_num: number
          is_weigh: number
          pur_number: number
          product_id: number
          suk: string
          product_code: string
          product_name: string
          out_price: string
          price: string
        }) => {
          if (!item['pur_number'] || item['pur_number'] < 0) {
            ok = false
            return ElMessage.error('请填写正确的出库商品数量')
          } else {
            goods.push({
              id: item.id,
              product_id: item.product_id,
              product_name: item.product_name,
              bar_code: item.bar_code,
              suk: item.suk,
              product_num: item.product_num,
              is_weigh: item.is_weigh,
              pur_number: item.pur_number,
              product_code: item.product_code,
              name: item.product_name,
              out_price: item.out_price,
              price: item.price
            })
          }
        }
      )
    }

    console.log(ok, 'ok')
    if (!ok) return
    // if()
    if (actinoTabIndex.value == 1) {
      if (selfBuild.type == 1 && selfBuild.up_wid == selfBuild.wid) {
        return ElMessage.error('调出仓库和调入仓库不能相同')
      }
      pData = {
        up_wid: selfBuild.up_wid,
        up_store_id: selfBuild.up_store_id,
        wid: selfBuild.type == 1 ? selfBuild.wid: '',
        store_id: selfBuild.type == 1? '': selfBuild.store_id,
        create_admin_id: selfBuild.create_admin_id || '',
        product_list: goods
      }
    } else if (actinoTabIndex.value == 2) {
      if (hzBuild.up_store_id == hzBuild.store_id) {
        return ElMessage.error('调出仓库和调入仓库不能相同')
      }
      pData = {
        store_id: hzBuild.store_id,
        up_store_id: hzBuild.up_store_id,
        create_admin_id: hzBuild.create_admin_id || '',
        product_list: goods
      }
    }

    const res = await createOut(pData)
    if (res?.status == 200) {
      ElMessage.success('保存成功')
      ElMessageBox.confirm(`创建成功是否返回出库列表`, '提示', {
        confirmButtonText: '返回列表',
        cancelButtonText: `继续创建`,
        type: 'warning'
      }).then(() => {
        backList()
      })
    }
  }
}

const loadingData = ref(false)
onMounted(async () => {
  //加载商品规格
  // ruleList()
  if (params.type == 'add') {
    pageTitle.value = '添加商品'
  } else if (params.type == 'edit') {
    pageTitle.value = '编辑商品'
    try {
      const res = await getProductDetail(params.id)
      const data = res.data
      formData.id = data.id
      formData.is_weigh = data.is_weigh
      formData.store_id = data.store_id
      formData.store_name = data.store_name
      formData.store_info = data.store_info
      formData.video_open = data.video_open
      formData.video_link = data.video_link
      formData.slider_image = data.slider_image ? data.slider_image.split(',') : []
      formData.image = [data.image]
      // formData.bar_code = data.bar_code
      formData.recommend_image = data.recommend_image
      formData.keyword = data.keyword ? data.keyword.split(',') : []
      formData.cate_id = data.cate_id.split(',').map((re) => parseInt(re))
      formData.sales = data.sales
      formData.ficti = data.ficti
      formData.spec_type = data.spec_type
      formData.is_show = data.is_show
      formData.is_vip_product = data.is_vip_product
      formData.is_limit = data.is_limit
      formData.limit_type = data.limit_type
      formData.limit_num = data.limit_num
      formData.is_police = data.is_police
      formData.shelf_life = data.shelf_life
      formData.pay_qudou = data.pay_qudou
      formData.show_type = data.show_type
      formData.attrs = data.attrs
      formData.sort = data.sort
      formData.description = data.description
      formData.is_verify = data.is_verify
      formData.cost = data.cost
      // formData.specs = data.specs
      attrBase = reactive(
        data.specs.map((item) => {
          let obj = JSON.parse(JSON.stringify(item))
          obj.img = [item.img]
          return obj
        })
      )
      //加载门店
      getStore('', data.store_id)
      console.log('z')
    } catch (error) {
      console.log(error, 'error')
    }
  }
})
const backList = () => {
  push('/erp/out')
}
const storeLoading = ref(false)
const storeOptions = ref<any[]>([])
const getStore = async (query = '', id = '') => {
  try {
    storeLoading.value = true
    const res = await getStoreList({ page: 1, limit: 1000, name: query, id, store: 1 })
    if (res) {
      storeOptions.value = res.data.data.map((item) => {
        return {
          value: item.id,
          label: item.name
        }
      })
    } else {
      return []
    }
  } catch (error) {
    console.log(error)
  } finally {
    storeLoading.value = false
  }
}

let attrBase = reactive<AttrBaseItem[]>([
  {
    img: [], //图片
    bar_code: '', //产品编号
    price: 0, //售价
    num: 0,
    is_default: 0,
    price_1: 0,
    price_2: 0,
    price_3: 0,
    name: '',
    is_del: 0,
    rate: 0
  }
])

const selectPic = ref<string[]>([]) //选中的图片
const selectPicIndex = ref(0) //上传图片选择对象
const selectPicObj = ref('header') //上传图片类型

/**
 * 根据不同的图片选择对象类型，更新相应的图片数组
 * @param {string[]} pic - 要更新的图片数组
 */
const changePic = (pic: string[]) => {
  console.log(pic, 'pic')
  // 根据选中的图片对象类型，更新对应的图片数组
  switch (selectPicObj.value) {
    case 'header':
      // 更新产品属性列表中的图片数组
      attrBase[selectPicIndex.value].img = pic
      break
    case 'attrBase':
      // 更新基础属性中的图片数组
      attrBase[0].img = pic
      break
    case 'banner':
      // 更新表单数据中的图片数组
      formData.image = pic
      break
    case 'attrOne':
      // 更新单规格的图片数组
      attrs_value.image = pic
      break
    default:
      // 其他情况不做处理
      break
  }
}

const widOptions = ref<any[]>([])
const adminOptions = ref<any[]>([])
const wareLoading = ref(false)
const adminLoading = ref(false)
const checkGoods = ref([])
const checkGoodss = ref<any[]>([])

const getWid = async (query = '', id = '') => {
  try {
    wareLoading.value = true
    const res = await getStoreList({ page: 1, limit: 1000, name: query, id, type: 3 })
    if (res) {
      widOptions.value = res.data.data.map((item) => {
        return {
          value: item.id,
          label: item.name
        }
      })
    } else {
      return []
    }
  } catch (error) {
    console.log(error)
  } finally {
    wareLoading.value = false
  }
}
const getAdmin = async () => {
  console.log(actinoTabIndex.value, 'actinoTabIndex')
  let id: any = 0
  if (actinoTabIndex.value == 1) {
    id = selfBuild.up_wid
  } else if (actinoTabIndex.value == 2) {
    id = hzBuild.up_store_id
  } else if (actinoTabIndex.value == 3) {
    id = up_store_id.value == 0 ? up_wid.value : up_store_id.value
  }
  const res = await getStoreUser({ page: 1, limit: 20, relation_id: id })
  // adminOptions.value = res.data.list
  if (res) {
    adminOptions.value = res.data.map((item) => {
      return {
        value: item.id,
        label: item.real_name
      }
    })
  } else {
    return []
  }
}

const fristCheck = ref([])

const changeSw = () => {
  selfBuild.create_admin_id = ''
}
const changeType = () => {
  selfBuild.create_admin_id = ''
}
const handleSelectionChange = (e) => {
  fristCheck.value = e
}

// const
// const handleSelectionChanges = (e) => {
//   fristChecks.value = e

// }
const handleCurrentChange = (e: number) => {
  getPurgood(e, '')
}

const cancelClick = () => {
  dialogVisible.value = false
}

const unique = (arr) => {
  return arr.filter((item, index, arr) => arr.findIndex((t) => t.id === item.id) === index)
}
const confirmClick = () => {
  // 关闭弹窗
  dialogVisible.value = false
  //合并选中去重
  fristCheck.value = fristCheck.value.map((item) => {
    Object.assign(item, { pur_number: '', weight: '' })
    return item
  })
  if (actinoTabIndex.value == 1) {
    checkGoods.value = unique(checkGoods.value.concat(fristCheck.value))
  } else if (actinoTabIndex.value == 2) {
    checkGoodss.value = unique(checkGoodss.value.concat(fristCheck.value))
  }
}

const goods = ref([])
const count = ref(0)
const keyword = ref('')
const currentPage = ref(0)
const pageSize = ref(10)
const dialogVisible = ref(false)
const getPurgood = async (page = 1, key = '') => {
  if (key == 're') {
    keyword.value = ''
  }
  let qData: {
    up_wid: any
    key: string
    page: number
    limit: number
    up_store_id: any
    type: any,
    store_id?: any
  } = {
    up_wid: '',
    up_store_id: '',
    key: keyword.value,
    page: page,
    limit: 10,
    type: 0
  }
  if (actinoTabIndex.value == 1) {
    if (selfBuild.type == 1 && !selfBuild.up_wid) {
      return ElMessage.error('请选仓库')
    }
    // if (selfBuild.type == 0 && !selfBuild.up_store_id) {
    //   return ElMessage.error('请选门店')
    // }
    // qData.up_wid = selfBuild.type === 1 ? selfBuild.up_wid : ''
    qData.up_wid = selfBuild.up_wid
    // qData.up_store_id = selfBuild.type === 0 ? selfBuild.up_store_id : ''
    // qData.type = selfBuild.type == 1 ? 0 : 1
    qData.type = 0
  } else if (actinoTabIndex.value == 2) {
    if (!hzBuild.up_store_id) {
      return ElMessage.error('请选门店')
    }
    qData.up_store_id = hzBuild.up_store_id
    qData.type = 1
  }

  const res = await getOutGood(qData)
  goods.value = res.data.data
  console.log(goods.value, 'goods.value')
  count.value = res.data.count
  dialogVisible.value = true
}
const delCheckGoods = (row) => {
  console.log(row)
  let set1 = new Set(checkGoods.value)
  let set2 = new Set([row])
  checkGoods.value = Array.from(set1.difference(set2))
}
const delCheckGoodss = (row) => {
  console.log(row)
  let set1 = new Set(checkGoodss.value)
  let set2 = new Set([row])
  checkGoodss.value = Array.from(set1.difference(set2))
}

const up_wid = ref(0)
const up_store_id = ref(0)
const allPrice = computed(() => { 
  return checkGoods.value.reduce((pre, cur:any) => {
    return pre + cur.out_price * cur.pur_number
  }, 0)
})
const allPrices = computed(() => { 
  return checkGoodss.value.reduce((pre, cur:any) => {
    return pre + cur.out_price * cur.pur_number
  }, 0)
})
</script>
<template>
  <ContentWrap
    :title="pageTitle"
    class="!min-h-[calc(100vh-var(--top-tool-height)-var(--tags-view-height)-var(--app-footer-height)-var(--app-content-padding))]"
  >
    <template #header>
      <BaseButton size="small" @click="backList"> 返回列表 </BaseButton>
    </template>
    <ElTabs v-model="actinoTabIndex" type="border-card">
      <ElTabPane label="出库单" :name="1">
        <ElForm
          v-loading="loadingData"
          ref="formRef"
          :model="selfBuild"
          :rules="rules"
          label-width="100px"
        >
          <ElFormItem label="调出仓库" prop="up_wid">
            <ElSelect
              filterable
              remote
              reserve-keyword
              v-model="selfBuild.up_wid"
              :remote-method="getWid"
              :loading="wareLoading"
              remote-show-suffix
              placeholder="请选择调出仓库"
              @change="changeSw"
            >
              <ElOption
                v-for="item in widOptions"
                :key="item.value"
                :label="item.label"
                :value="item.value"
              />
            </ElSelect>
          </ElFormItem>
          <ElFormItem label="调入类型">
            <ElRadioGroup v-model="selfBuild.type" class="ml-4" @change="changeType">
              <ElRadio :label="1" size="large">仓库</ElRadio>
              <ElRadio :label="0" size="large">门店</ElRadio>
            </ElRadioGroup>
          </ElFormItem>
          <ElFormItem label="门店" prop="store_id" v-if="selfBuild.type == 0">
            <ElSelect
              filterable
              remote
              reserve-keyword
              :disabled="params.type == 'edit'"
              v-model="selfBuild.store_id"
              :remote-method="getStore"
              :loading="storeLoading"
              remote-show-suffix
              placeholder="请选择门店"
              @change="changeSw"
            >
              <ElOption
                v-for="item in storeOptions"
                :key="item.value"
                :label="item.label"
                :value="item.value"
              />
            </ElSelect>
          </ElFormItem>
          <ElFormItem label="仓库" v-if="selfBuild.type == 1" prop="wid">
            <ElSelect
              filterable
              remote
              reserve-keyword
              v-model="selfBuild.wid"
              :remote-method="getWid"
              :loading="wareLoading"
              remote-show-suffix
              placeholder="请选择仓库"
              @change="changeSw"
            >
              <ElOption
                v-for="item in widOptions"
                :key="item.value"
                :label="item.label"
                :value="item.value"
              />
            </ElSelect>
          </ElFormItem>
          <ElFormItem label="创建人员" prop="create_admin_id" v-if="selfBuild.up_wid">
            <ElSelect
              filterable
              remote
              reserve-keyword
              :disabled="params.type == 'edit'"
              v-model="selfBuild.create_admin_id"
              :remote-method="getAdmin"
              :loading="adminLoading"
              remote-show-suffix
              placeholder="请选择创建人员"
            >
              <ElOption
                v-for="item in adminOptions"
                :key="item.value"
                :label="item.label"
                :value="item.value"
              />
            </ElSelect>
          </ElFormItem>
          <ElFormItem label="出库商品">
            <BaseButton type="primary" style="margin-bottom: 20px" @click="getPurgood(1, '')">
              选择商品
            </BaseButton>
            <span class="pl20">价格合计（{{allPrice}}）</span>
            <ElTable
              header-cell-class-name="bg-gray-100!"
              :data="checkGoods"
              class="w-100%"
              :border="true"
              stripe
            >
              <ElTableColumn prop="product_id" label="ID"> </ElTableColumn>
              <ElTableColumn prop="product_name" label="名称"> </ElTableColumn>
              <ElTableColumn prop="suk" label="单位"></ElTableColumn>
              <ElTableColumn prop="product_num" label="库存"></ElTableColumn>
              <ElTableColumn prop="pur_number" label="出库数量">
                <template #header> <span>出库数量</span><span class="text-red">*</span> </template>
                <template #default="{ row }">
                  <ElInput type="number" v-model="row.pur_number" />
                </template>
              </ElTableColumn>
              <!-- <ElTableColumn prop="weight" label="总重量">
                <template #header> <span>总重量</span><span class="text-red">*</span> </template>
                <template #default="{ row }">
                  <ElInput type="number" v-model="row.weight" />
                </template>
              </ElTableColumn> -->
              <ElTableColumn prop="action" label="操作">
                <template #default="{ row }">
                  <!-- <div type="text">{{ row.specs.num || 0 }}</div> -->
                  <BaseButton link size="small" type="primary" @click="delCheckGoods(row)"
                    >删除</BaseButton
                  >
                </template></ElTableColumn
              >
            </ElTable>
          </ElFormItem>
        </ElForm>
      </ElTabPane>
      <ElTabPane label="调出单" :name="2">
        <ElForm
          v-loading="loadingData"
          ref="formRefs"
          :model="hzBuild"
          :rules="rules"
          label-width="100px"
        >
          <ElFormItem label="调出门店" prop="up_store_id">
            <ElSelect
              filterable
              remote
              reserve-keyword
              :disabled="params.type == 'edit'"
              v-model="hzBuild.up_store_id"
              :remote-method="getStore"
              :loading="storeLoading"
              remote-show-suffix
              placeholder="请选择门店"
              @change="changeSw"
            >
              <ElOption
                v-for="item in storeOptions"
                :key="item.value"
                :label="item.label"
                :value="item.value"
              />
            </ElSelect>
          </ElFormItem>
          <ElFormItem label="调入门店" prop="store_id">
            <ElSelect
              filterable
              remote
              reserve-keyword
              :disabled="params.type == 'edit'"
              v-model="hzBuild.store_id"
              :remote-method="getStore"
              :loading="storeLoading"
              remote-show-suffix
              placeholder="请选择门店"
              @change="changeSw"
            >
              <ElOption
                v-for="item in storeOptions"
                :key="item.value"
                :label="item.label"
                :value="item.value"
              />
            </ElSelect>
          </ElFormItem>
          <ElFormItem label="创建人员" prop="create_admin_id" v-if="hzBuild.up_store_id">
            <ElSelect
              filterable
              remote
              reserve-keyword
              :disabled="params.type == 'edit'"
              v-model="hzBuild.create_admin_id"
              :remote-method="getAdmin"
              :loading="adminLoading"
              remote-show-suffix
              placeholder="请选择创建人员"
            >
              <ElOption
                v-for="item in adminOptions"
                :key="item.value"
                :label="item.label"
                :value="item.value"
              />
            </ElSelect>
          </ElFormItem>
          <ElFormItem label="出库商品">
            <BaseButton type="primary" style="margin-bottom: 20px" @click="getPurgood(1, '')">
              选择商品
            </BaseButton>
            <span class="pl20">价格合计（{{allPrices}}）</span>
            <ElTable
              header-cell-class-name="bg-gray-100!"
              :data="checkGoodss"
              class="w-100%"
              :border="true"
              stripe
            >
              <ElTableColumn prop="product_id" label="ID"> </ElTableColumn>
              <ElTableColumn prop="product_name" label="名称"> </ElTableColumn>
              <ElTableColumn prop="suk" label="单位"></ElTableColumn>
              <ElTableColumn prop="product_num" label="库存"></ElTableColumn>
              <ElTableColumn prop="pur_number" label="出库数量">
                <template #header> <span>出库数量</span><span class="text-red">*</span> </template>
                <template #default="{ row }">
                  <ElInput type="number" v-model="row.pur_number" />
                </template>
              </ElTableColumn>
              <!-- <ElTableColumn prop="weight" label="总重量">
                <template #header> <span>总重量</span><span class="text-red">*</span> </template>
                <template #default="{ row }">
                  <ElInput type="number" v-model="row.weight" />
                </template>
              </ElTableColumn> -->
              <ElTableColumn prop="action" label="操作">
                <template #default="{ row }">
                  <!-- <div type="text">{{ row.specs.num || 0 }}</div> -->
                  <BaseButton link size="small" type="primary" @click="delCheckGoodss(row)"
                    >删除</BaseButton
                  >
                </template></ElTableColumn
              >
            </ElTable>
          </ElFormItem>
        </ElForm>
      </ElTabPane>
    </ElTabs>
    <ElDrawer v-model="dialogVisible" title="选择商品" size="700px">
      <div class="mb5">
        <ElInput v-model="keyword" style="width: 200px" placeholder="输入商品名称搜索" />
        <BaseButton type="primary" class="ml2" @click="getPurgood(1, '')"> 搜索 </BaseButton>
        <BaseButton @click="getPurgood(1, 're')"> 重置 </BaseButton>
      </div>

      <ElTable
        header-cell-class-name="bg-gray-100!"
        :data="goods"
        class="w-100%"
        :border="true"
        stripe
        @selection-change="handleSelectionChange"
      >
        <ElTableColumn type="selection" width="55" />
        <ElTableColumn prop="product_name" label="名称"> </ElTableColumn>
        <ElTableColumn prop="suk" label="单位"></ElTableColumn>
        <ElTableColumn prop="product_num" label="库存"></ElTableColumn>
        <!-- <ElTableColumn prop="my_stock" label="仓库/门店库存">
        <template #default="{ row }">
          <div type="text">{{ row.specs.num || 0 }}</div>
        </template></ElTableColumn
      > -->
      </ElTable>
      <div style="height: 20px"></div>
      <ElPagination
        v-model:current-page="currentPage"
        v-model:page-size="pageSize"
        :page-sizes="[2, 3, 4, 5]"
        layout="total, prev, pager, next, jumper"
        :total="count"
        @current-change="handleCurrentChange"
      />
      <template #footer>
        <div style="flex: auto">
          <BaseButton @click="cancelClick">取消</BaseButton>
          <BaseButton type="primary" @click="confirmClick">确认</BaseButton>
        </div>
      </template>
    </ElDrawer>
    <UpImgButtom
      class="pos-absolute left-[-200px]"
      ref="upImageButtomRef"
      v-model="selectPic"
      @change="changePic"
    />
  </ContentWrap>
  <div
    class="text-center border-t-1px border-solid border-gray-200 py-10px mt-10px position-sticky bottom-0 left-0 right-0 bg-white"
  >
    <!-- <BaseButton v-if="params.type == 'edit'" @click="save(formRef)"> 保存 </BaseButton> -->
    <BaseButton v-if="params.type == 'add' && actinoTabIndex == 1" @click="save(formRef)">
      保存</BaseButton
    >
    <BaseButton v-if="params.type == 'add' && actinoTabIndex == 2" @click="save(formRefs)">
      保存</BaseButton
    >
  </div>
</template>
