shuiguoAdmin/src/views/Erp/Out/Out.vue

<script setup lang="tsx">
import { reactive, ref, unref,onMounted } from 'vue'
import { useTable } from '@/hooks/web/useTable'
import { useI18n } from '@/hooks/web/useI18n'
import { Table, TableColumn } from '@/components/Table'
import { Search } from '@/components/Search'
import { FormSchema } from '@/components/Form'
import { ContentWrap } from '@/components/ContentWrap'
import { Dialog } from '@/components/Dialog'
import { BaseButton } from '@/components/Button'
import { UpImgButtom } from '@/components/UpFile'
import {
  ElDivider,
  ElMessage,
  ElMessageBox,
  ElTag,
  ElText,
  ElSelect,
  ElOption,
  ElForm,
  ElFormItem,
  ElRadioGroup,
  ElRadio,
  ElTable,
  ElTableColumn,
  ElInput,
  ElDatePicker
} from 'element-plus'
import {
  getStoreUser,
  endPur,
  upCompute,
  authComput,
  getOut,
  outAuth,
  outOut,
  delOut,
  getStoreList
} from '@/api/erp'
import { useRouter } from 'vue-router'
import { formatTime } from '@/utils'
import { endPuritem } from '@/api/erp/types'
// import Write from './components/Write.vue'

const { t } = useI18n()
const { push } = useRouter()

const { tableRegister, tableState, tableMethods } = useTable({
  fetchDataApi: async () => {
    const res = await getOut({
      page: unref(currentPage) || 1,
      limit: unref(pageSize) || 10,
      ...unref(searchParams)
    })
    return { list: res.data.data, total: res.data.count || 0 }
  }
})

const { dataList, loading, total, currentPage, pageSize } = tableState
const { getList } = tableMethods

const tableColumns = reactive<TableColumn[]>([
  { field: 'id', label: 'ID', align: 'center', width: 70 },
  { field: 'out_order_id', label: '出库单号', minWidth: 230 },
  { field: 'total_price', label: '总价格', minWidth: 150 },

  {
    field: 'in',
    label: '调出单位',
    minWidth: 150,
    slots: {
      default: ({ row }: any) => {
        return <>{row.up_store_id ? row.tstore?.name : row.up_wid ? row.tware?.name : ''}</>
      }
    }
  },
  {
    field: 'out',
    label: '调入单位',
    minWidth: 150,
    slots: {
      default: ({ row }: any) => {
        return <>{row.wid ? row.ware?.name : row.store?.name}</>
      }
    }
  },
  {
    field: 'info',
    label: '出库商品',
    minWidth: 200,
    slots: {
      default: ({ row }: any) => {
        return (
          <>
            {row.info.map((item) => {
              return (
                <>
                  <div>
                    {item.product_name}
                    <ElText class="mx-1" type="primary">
                      {item.is_weigh == 1 ? item.net_weight : item.product_num * 1}
                    </ElText>
                    {item.suk}
                  </div>
                </>
              )
            })}
          </>
        )
      }
    }
  },
  {
    field: 'create_admin_id',
    label: '创建人员',
    width: 200,
    slots: {
      default: ({ row }: any) => {
        return (
          <>
            <div>{row.cuser?.real_name || '-'}</div>
            <div>{row.create_time ? formatTime(row.create_time * 1000, 'yyyy-MM-dd') : ''}</div>
          </>
        )
      }
    }
  },
  {
    field: 'auth_admin_id',
    label: '审核人员',
    width: 200,
    slots: {
      default: ({ row }: any) => {
        return (
          <>
            <div>{row.auser?.real_name || '-'}</div>
            <div>{row.auth_time ? formatTime(row.auth_time * 1000, 'yyyy-MM-dd') : ''}</div>
          </>
        )
      }
    }
  },
  {
    field: 'status',
    label: '状态',
    width: 190,
    slots: {
      default: ({ row }: any) => {
        if (row.status == 3) {
          return (
            <>
              <ElTag>完成</ElTag>
            </>
          )
        } else if (row.status == 2 && row.auth_status == -2) {
          return (
            <>
              <ElTag type="danger">收货拒绝</ElTag>
            </>
          )
        } else {
          return (
            <>
              <ElTag
                class="mr-5px"
                type={
                  row.status == -1
                    ? 'danger'
                    : row.status == 0
                      ? 'warning'
                      : row.status == 1
                        ? 'success'
                        : row.status == 2
                          ? 'info'
                          : 'success'
                }
              >
                {row.status == -1
                  ? '审核拒绝'
                  : row.status == 0
                    ? '待审核'
                    : row.status == 1
                      ? '通过'
                      : row.status == 2
                        ? '完成'
                        : '完成'}
              </ElTag>
            </>
          )
        }
      }
    }
  },
  {
    field: 'action',
    label: t('userDemo.action'),
    width: 200,
    fixed: 'right',
    align: 'center',
    headerAlign: 'center',
    slots: {
      default: ({ row }: any) => {
        if (row.status == 0) {
          return (
            <>
              <BaseButton link size="small" type="primary" onClick={() => action('auth', row)}>
                审核
              </BaseButton>
              <ElDivider direction="vertical" />
              <BaseButton link size="small" type="danger" onClick={() => delAction(row)}>
                删除
              </BaseButton>
              <ElDivider direction="vertical" />
              <BaseButton link size="small" type="primary" onClick={() => action('print', row)}>
                打印
              </BaseButton>
            </>
          )
        } else if (row.status == 1) {
          return (
            <>
              <BaseButton link size="small" type="primary" onClick={() => action('out', row)}>
                出库
              </BaseButton>
              <ElDivider direction="vertical" />
              <BaseButton link size="small" type="primary" onClick={() => action('print', row)}>
                打印
              </BaseButton>
            </>
          )
        } else {
          return (
            <>
              <BaseButton link size="small" type="primary" onClick={() => action('print', row)}>
                打印
              </BaseButton>
            </>
          )
        }
      }
    }
  }
])
const storeLoading = ref(false)
const wareLoading = ref(false)
const storeOptions = ref<any[]>([])
const wareOptions = 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
  }
}
const getWare = async (query = '', id = '') => {
  try {
    wareLoading.value = true
    const res = await getStoreList({ page: 1, limit: 1000, name: query, id, type: 3 })
    if (res) {
      wareOptions.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 searchSchema = reactive<FormSchema[]>([
   {
    field: 'out_order_id',
    label: '出库单号',
    component: 'Input',
    value: '',
    componentProps: {
      placeholder: '请输入出库单号'
    }
  },

  {
    field: 'store_id',
    label: '门店',
    component: 'Select',
    value: '',
    componentProps: {
      placeholder: '请选择',
      options: storeOptions
    }
  },
  {
    field: 'wid',
    label: '仓库',
    component: 'Select',
    value: '',
    componentProps: {
      placeholder: '请选择',
      options: wareOptions
    }
  },
  {
    field: 'status',
    label: '状态',
    component: 'Select',
    value: '',
    componentProps: {
      placeholder: '全部',
      options: [
        { label: '待审核', value: '0' },
        { label: '出库审核', value: '1' }
      ]
    }
  },
 
])

const searchParams = ref<{ status?: string }>({
  // status: '3'
})
const setSearchParams = (data: any) => {
  searchParams.value = data
  getList()
}

const dialogVisible = ref(false)
const currentRow = ref()
const dialogTitle = ref('')
const actionType = ref('')
// const writeRef = useTemplateRef('writeRef')

// function arrayToObject(array) {
//     var obj = {};
//     for (var i = 0; i < array.length; i++) {
//         obj[i] = array[i];
//     }
//     return obj;
// }
const authId = ref(0)
const storeId = ref(0)
const wid = ref(0)
const dialogVisibles = ref(false)
const dialogVisibless = ref(false)
const dialogVisiblesss = ref(false)
const dialogVisiblessss = ref(false)
const prDialogVisible = ref(false)
const prItem = ref<any>({})


const endItem = ref<endPuritem>({ purchasing_person_admin_id: 0, id: 0, info: [] })
const action = async (type: string, row?: any) => {
  actionType.value = type
  if (type == 'print') {
    console.log(row)

    prDialogVisible.value = true
    prItem.value = row
  }
  if (type == 'out') {
    ElMessageBox.confirm('是否立即出库?', {
      confirmButtonText: '确认',
      cancelButtonText: '取消',
      type: 'warning'
    })
      .then(async () => {
        const re = await outOut(row.id)
        if (re) {
          ElMessage({ showClose: true, message: '出库成功', type: 'success' })
        }
        await getList()
      })
      .catch(() => {})
  }
  if (type == 'authCompute') {
    endItem.value = row
    dialogVisiblessss.value = true
  }
  if (type == 'compute') {
    endItem.value = row
    dialogVisiblesss.value = true
  }
  if (type == 'end') {
    endItem.value = row
    endItem.value.info = row.info.map((item) => {
      item.tare_weight_one = ''
      return item
    })
    dialogTitle.value = '完成采购'
    dialogVisibless.value = true
    storeId.value = row.store_id || 0
    wid.value = row.wid || 0
    getAdmin()
  }
  if (type == 'auth') {
    dialogTitle.value = '审核'
    authId.value = row.id * 1
    storeId.value = row.up_store_id || 0
    wid.value = row.up_wid || 0
    dialogVisibles.value = true
  }
  if (type == 'add') {
    // dialogTitle.value = t('exampleDemo.add')
    // currentRow.value = undefined
    push(`/erp/out_edit/${type}/${row?.id || 0}`)
  }
  if (type == 'edit') {
    dialogTitle.value = t('exampleDemo.edit')
    currentRow.value = {
      // roles: row.roles,
      wid: row.wid,
      type: row.type,
      id: row.id,
      name: row.name,
      is_show: row.is_show == 1 ? true : false,
      introduction: row.introduction,
      address: row.address,
      area: row.area,
      city: row.city,
      province: row.province,
      detailed_address: row.detailed_address,
      latitude: row.latitude,
      logo: [row.logo],
      longitude: row.longitude,
      manager_name: row.manager_name,
      phone: row.phone,
      product_verify_status: row.product_verify_status == 1 ? true : false,
      product_status: row.product_status == 1 ? true : false,
      valid_range: row.valid_range,
      slide_images: row.slide_images_chs,
      auth_code: row.auth_code,
      auth_code_end_time: row.auth_code_end_time,
      ppid: row.appid,
      loss_sale: row.loss_sale == 1,
      receiver_uid: row.receiver_uid,
      huifu_id: row.huifu_id,
      appsecret: row.appsecret,
      cost: row.cost,
      roles: row.roles * 1
    }
    console.log(currentRow, 'currentRow')
  }
  dialogVisible.value = true
}
const delAction = (row: any) => {
  ElMessageBox.confirm('删除后无法恢复，是否删除?', {
    confirmButtonText: '删除',
    cancelButtonText: '取消',
    type: 'warning'
  })
    .then(async () => {
      const re = await delOut(row.id)
      if (re) {
        ElMessage({ showClose: true, message: '删除成功', type: 'success' })
      }
      await getList()
    })
    .catch(() => {})
}
const formData = ref({ auth_admin_id: '', auth_status: 1 })
const adminOptions = ref<any[]>([])
const adminLoading = ref(false)
const rules = reactive({
  auth_admin_id: [{ required: true, message: '请选择审核员', trigger: 'change' }]
})
const getAdmin = async () => {
  const res = await getStoreUser({
    page: 1,
    limit: 20,
    relation_id: storeId.value ? storeId.value : wid.value
  })
  adminLoading.value = true
  try {
    if (res) {
      adminOptions.value = res.data.map((item) => {
        return { value: item.id, label: item.real_name }
      })
      console.log(adminOptions.value, 'adminOptions.value')
    } else {
      return []
    }
  } catch (err) {
    console.log(err)
  }
}
const cancelClick = () => {
  dialogVisibles.value = false
  authId.value = 0
  storeId.value = 0
  formData.value.auth_admin_id = ''
  formData.value.auth_status = 1
}
const cancelClicks = () => {
  dialogVisibless.value = false
  authId.value = 0
  storeId.value = 0
  endItem.value = { id: 0, purchasing_person_admin_id: 0, info: [] }
}
const confirmClick = async () => {
  if (!formData.value.auth_admin_id) {
    return ElMessage.error('请选择审核人员')
  }
  // if (formData.value.status == 1 && !formData.value.purchasing_person_admin_id) {
  //   return ElMessage.error('请选择采购人员')
  // }
  const res = await outAuth(authId.value, formData.value)
  if (res.status == 200) {
    ElMessage.success('审核完成')
    getList()
    cancelClick()
  }
}

const confirmClicks = async () => {
  console.log('zhe')
  let qdata: endPuritem = {
    id: endItem.value.id,
    purchasing_person_admin_id: endItem.value.purchasing_person_admin_id,
    info: []
  }
  qdata.info = endItem.value.info.map((item) => {
    if (item.is_weigh == 1) {
      item.tare_weight = item.tare_weight_one * 1 * item.pur_num * 1
      item.net_weight = item.weight * 1 - item.tare_weight
    }
    return item
  })
  const res = await endPur(qdata)
  if (res.status == 200) {
    ElMessage.success('采购完成')
    getList()
    cancelClicks()
  }
}
const confirmClickss = async () => {
  const res = await upCompute(endItem.value.id, {
    prove: compteData.value.image[0],
    pay_time: new Date(compteData.value.pay_time).getTime() / 1000
  })
  if (res.status == 200) {
    ElMessage.success('提交完成')
    getList()
    cancelClickss()
  }
}
const cancelClickss = () => {
  dialogVisiblesss.value = false
  endItem.value = { id: 0, purchasing_person_admin_id: 0, info: [] }
  compteData.value = { image: [], pay_time: '' }
}
const compteData = ref({ image: [], pay_time: '' })
const authCompteData = ref({ pay_status: 2 })

const confirmClicksss = async () => {
  const res = await authComput(endItem.value.id, authCompteData.value)
  if (res.status == 200) {
    ElMessage.success('审核完成')
    getList()
    cancelClicksss()
  }
}
const cancelClicksss = () => {
  dialogVisiblessss.value = false
  endItem.value = { id: 0, purchasing_person_admin_id: 0, info: [] }
  authCompteData.value = { pay_status: 2 }
}
const printobj = ref({
  id: 'dc',
  popTitle: '好的打印标题',
  extraCss:
    'https://cdn.bootcdn.net/ajax/libs/animate.css/4.1.1/animate.compat.css, https://cdn.bootcdn.net/ajax/libs/hover.css/2.3.1/css/hover-min.css',
  extraHead: '<meta http-equiv="content-language" content="zh-cn" />',
  beforeOpenCallback(vue) {
    vue.printLoading = true
    console.log(window.document.body.style, 'window.document.body.innerHTML')

    console.log('打开之前')
  },
  openCallback(vue) {
    vue.printLoading = false
    console.log('执行了打印')
  }
})
const printing = () => {
  // const splitDoms = document.getElementsByClassName('pri')
  // console.log(splitDoms)
  // let startY = 0 // 占用A4纸的高度，从每页第一个poetry div的top值开始累加
  // for (let i = 0; i < splitDoms.length; i++) {
  //     const splitDom = splitDoms[i]
  //     const splitValue = splitDom.getBoundingClientRect()
  //     console.log(splitDom.getBoundingClientRect())
  //     if (startY === 0) {
  //         startY = splitValue.top
  //     }
  //     const pageHeight = splitValue.bottom - startY
  //     // 当加上当前div的高度大于A4纸高度时，给前一个div加上分页标识
  //     if (pageHeight > PAGE_HEIGHT) {
  //         console.log(i)
  //         startY = 0
  //         if (i > 0) {
  //             splitDoms[i - 1].style.pageBreakBefore = 'always'; // 给前一个元素添加分页符
  //         }
  //     }
  // }
}
const getTime = () => {
  let time = new Date().getTime()
  return formatTime(time, 'yyyy-MM-dd HH:mm:ss')
}
const getLen = () => {
  let sum = 0
  prItem.value.info.forEach((item) => {
    console.log(item.product_num)
    if (item.is_weigh == 1) {
      sum += item.net_weight * 1
    } else {
      sum += item.product_num * 1
    }
  })
  return sum
}

onMounted(() => {
  getStore()
  getWare()
})
</script>

<template>
  <ContentWrap>
    <Search :schema="searchSchema" @reset="setSearchParams" @search="setSearchParams" />
    <div class="mb-10px">
      <BaseButton type="primary" @click="action('add')">{{ t('exampleDemo.add') }}</BaseButton>
    </div>
    <Table
      v-model:current-page="currentPage"
      v-model:page-size="pageSize"
      :columns="tableColumns"
      default-expand-all
      node-key="id"
      stripe
      :data="dataList"
      :loading="loading"
      @register="tableRegister"
      :pagination="{ total }"
    />
  </ContentWrap>
  <Dialog v-model="dialogVisibles" :title="dialogTitle" width="500px" maxHeight="160px">
    <!-- <Record :cid="cid"></Record> -->
    <ElForm ref="formRef" :model="formData" :rules="rules" label-width="100px">
      <ElFormItem label="审核人员" prop="auth_admin_id">
        <ElSelect
          filterable
          remote
          reserve-keyword
          v-model="formData.auth_admin_id"
          :remote-method="getAdmin"
          remote-show-suffix
          placeholder="请选择审核人员"
        >
          <ElOption
            v-for="item in adminOptions"
            :key="item.value"
            :label="item.label"
            :value="item.value"
          />
        </ElSelect>
      </ElFormItem>
      <ElFormItem label="审核状态" prop="status">
        <ElRadioGroup v-model="formData.auth_status" class="ml-4">
          <ElRadio :label="1" size="large">通过</ElRadio>
          <ElRadio :label="-1" size="large">拒绝</ElRadio>
        </ElRadioGroup>
      </ElFormItem>
    </ElForm>
    <template #footer>
      <div style="flex: auto">
        <BaseButton @click="cancelClick">取消</BaseButton>
        <BaseButton type="primary" @click="confirmClick">确认</BaseButton>
      </div>
    </template>
  </Dialog>
  <Dialog v-model="dialogVisibless" :title="dialogTitle" width="1000px" maxHeight="800px">
    <!-- <Record :cid="cid"></Record> -->
    <ElForm ref="formRefs" :model="endItem" :rules="rules" label-width="100px">
      <ElFormItem label="采购人员" prop="purchasing_person_admin_id">
        <ElSelect
          filterable
          remote
          reserve-keyword
          v-model="endItem.purchasing_person_admin_id"
          :remote-method="getAdmin"
          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="getPurgoods(1)">
              加载商品
            </BaseButton> -->
        <ElTable
          header-cell-class-name="bg-gray-100!"
          :data="endItem.info"
          class="w-100%"
          :border="true"
          stripe
        >
          <ElTableColumn prop="product_name" label="名称"> </ElTableColumn>
          <ElTableColumn prop="suk" label="单位"></ElTableColumn>
          <ElTableColumn prop="product_num" label="采购数量"> </ElTableColumn>
          <ElTableColumn prop="pur_num" label="采购数量">
            <template #default="{ row }">
              <ElInput type="number" v-model="row.pur_num" />
            </template>
          </ElTableColumn>
          <ElTableColumn prop="total_price" label="总价格">
            <template #default="{ row }">
              <ElInput type="number" v-model="row.total_price" />
            </template>
          </ElTableColumn>
          <ElTableColumn prop="tare_weight_one" label="单个皮重">
            <template #default="{ row }">
              <ElInput type="number" :disable="!row.is_weigh" v-model="row.tare_weight_one" />
            </template>
          </ElTableColumn>
          <ElTableColumn prop="weight" label="总重量">
            <template #default="{ row }">
              <ElInput type="number" :disable="!row.is_weigh" v-model="row.weight" />
            </template>
          </ElTableColumn>
        </ElTable>
      </ElFormItem>
    </ElForm>
    <template #footer>
      <div style="flex: auto">
        <BaseButton @click="cancelClicks">取消</BaseButton>
        <BaseButton type="primary" @click="confirmClicks">确认</BaseButton>
      </div>
    </template>
  </Dialog>
  <Dialog v-model="dialogVisiblesss" :title="dialogTitle" width="500px" maxHeight="160px">
    <ElForm ref="formRefss" :model="compteData" :rules="rules" label-width="100px">
      <ElFormItem label="凭证" prop="image">
        <UpImgButtom v-model="compteData.image"></UpImgButtom>
      </ElFormItem>
      <ElFormItem label="支付时间" prop="status">
        <ElDatePicker v-model="compteData.pay_time" type="date" placeholder="请选择支付时间" />
      </ElFormItem>
    </ElForm>
    <template #footer>
      <div style="flex: auto">
        <BaseButton @click="cancelClickss">取消</BaseButton>
        <BaseButton type="primary" @click="confirmClickss">确认</BaseButton>
      </div>
    </template>
  </Dialog>
  <Dialog v-model="dialogVisiblessss" :title="dialogTitle" width="500px" maxHeight="100px">
    <ElForm ref="formRefss" :model="authCompteData" :rules="rules" label-width="100px">
      <ElFormItem label="审核状态" prop="status">
        <ElRadioGroup v-model="authCompteData.pay_status" class="ml-4">
          <ElRadio :label="2" size="large">通过</ElRadio>
          <ElRadio :label="-1" size="large">拒绝</ElRadio>
        </ElRadioGroup>
      </ElFormItem>
    </ElForm>
    <template #footer>
      <div style="flex: auto">
        <BaseButton @click="cancelClicksss">取消</BaseButton>
        <BaseButton type="primary" @click="confirmClicksss">确认</BaseButton>
      </div>
    </template>
  </Dialog>
  <Dialog v-model="prDialogVisible" title="打印">
    <div id="dc">
      <div class="section">
        <div class="text-center title">调出单</div>
        <div class="top-tit">
          <div class="item mb10">
            <div class=""
              ><span class="name">出库单号：</span><span>{{ prItem.out_order_id }}</span></div
            >
            <div class="val"></div>
          </div>
          <div class="item mb10" v-if="prItem?.tware && prItem.tware.name">
            <div class=""
              ><span class="name">调出单位：</span><span>{{ prItem.tware.name || '' }}</span></div
            >
          </div>
          <div class="item mb10" v-if="prItem?.tstore && prItem.tstore.name">
            <div class=""
              ><span class="name">调入单位：</span><span>{{ prItem?.store.name || '' }}</span></div
            >
          </div>
          <div class="item mb10" v-if="prItem?.tstore">
            <div class=""
              ><span class="name">联系电话：</span><span>{{ prItem.tstore.phone }}</span></div
            >
            <div class="val"></div>
          </div>
          <div class="item mb10" v-if="prItem?.tware">
            <div class=""
              ><span class="name">联系电话：</span><span>{{ prItem.tware.phone }}</span></div
            >
            <div class="val"></div>
          </div>
          <div class="item mb10" v-if="prItem?.ware">
            <div class=""
              ><span class="name">收货单位：</span><span>{{ prItem.ware.name }}</span></div
            >
            <div class="val"></div>
          </div>
          <div class="item mb10" v-if="prItem?.store">
            <div class=""
              ><span class="name">收货单位：</span><span>{{ prItem.store.name }}</span></div
            >
            <div class="val"></div>
          </div>
          <div class="item items mb10" v-if="prItem?.store">
            <div class=""
              ><span class="name">收货地址：</span><span>{{ prItem.store.address }}</span></div
            >
          </div>
          <div class="item items mb10" v-if="prItem?.ware">
            <div class=""
              ><span class="name">收货地址：</span><span>{{ prItem.ware.address }}</span></div
            >
          </div>
        </div>
        <div class="table">
          <div class="tr">
            <div class="item w10">序号</div>
            <div class="item w20">编号</div>
            <div class="item w30">商品</div>
            <div class="item w20">数量</div>
            <div class="item w20">单位</div>
          </div>
            <div class="tr" v-for="(item, index) in prItem.info" >
              <div class="item w10">{{ index + 1 }}</div>
              <div class="item w20">{{ item.bar_code }}</div>
              <div class="item w30"
                >{{ item.product_name }}</div
              >
              <div class="item w20">{{
                item.is_weigh == 1 ? item.net_weight : item.product_num
              }}</div>
              <div class="item w20">{{ item.suk }}</div>
            </div>
        </div>
        <div class="btm-tip">
          <div class="itemt">
            <span class="name">货品数：</span>
            <span>{{ prItem.info.length }}</span>
          </div>
          <div class="itemt">
            <span class="name">数量：</span>
            <span>{{ getLen() }}</span>
          </div>
          <div class="itemt">
            <span class="name">审核人：</span>
            <span>{{ prItem.auth_admin_id ? prItem.auser.real_name : '' }}</span>
          </div>
          <div class="itemt">
            <span class="name">仓管员签字：</span>
            <span></span>
          </div>
          <div class="itemt">
            <span class="name">财务员签字：</span>
            <span></span>
          </div>
          <div class="itemt">
            <span>打印时间：</span>
            <span>{{ getTime() }}</span>
          </div>
        </div>
      </div>
    </div>
    <template #footer>
      <div style="flex: auto">
        <BaseButton type="primary" @click="printing" v-print="printobj">打印</BaseButton>
      </div>
    </template>
  </Dialog>
</template>
<style>
@media print {
  .section {
    page-break-before: always;
    margin-top: 0;
  }
}
.bold {
  font-weight: bold;
}
#dc {
  font-size: 14px;
  page-break-before: always;
  padding: 10px;
  position: relative;
  padding-bottom: 100px;
}
.title {
  font-size: 18px;
  font-weight: bold;
  color: #000000;
}
.top-tit {
  display: flex;
  flex-wrap: wrap;
  justify-content: flex-start;
  padding: 20px 0 10px;
}
.item {
  width: 50%;
  /* margin-bottom: 10px; */
}
.mb10 {
  margin-bottom: 10px;
}
.items {
  width: 100% !important;
}
.name {
  font-weight: bold;
  color: #000000;
}
.table {
  width: 98%;
  text-align: center;
  border-top: 1px solid #000;
  /* border-left: 1px solid #000; */
}
.table > .tr {
  display: flex;
  flex-wrap: wrap;
}
.table .tr > .item {
  padding: 5px 10px;
  /* border-right: 1px solid #000; */
  border-bottom: 1px solid #000;
  display: flex;
  justify-content: center;
  align-items: center;
}
.w30 {
  width: 30%;
}
.w20 {
  width: 20%;
}
.w10 {
  width: 10%;
}
.table .th {
  color: #000000;
  padding: 10px 0;
  border-left: 1px solid #000000;
  border-top: 1px solid #000000;
  min-width: 60px;
}

.table .td {
  padding: 5px 3px;
  border-left: 1px solid #000000;
  border-top: 1px solid #000000;
}
@media print {
  body,
  html,
  .previewPageBox {
    height: auto !important;
    overflow: visible !important;
  }

  .previewPageBox {
    position: relative !important;
  }
}
.btm-tip {
  display: flex;
  width: 100%;
  flex-wrap: wrap;
  padding-top: 150px;
  
}
.btm-tip .itemt {
  width: 33.3%;
  margin-bottom: 10px;
}
</style>