优化

schangxiang@126.com

2025-05-21 ec3cfd144de6fcf5e5cbfaf02585c17805300602

 HIAWms/hiawms_web/src/widgets/WmsInOutStockOrder/Views/Pages/WmsInOutStockOrder/WmsInOutStockOrder.tsx

@@ -19,8 +19,15 @@
  ElDatePicker,
  ElForm,
  ElFormItem,
  ElDialog,
  ElButton,
  ElTable,
  ElTableColumn,
  ElMessage,
} from 'element-plus'
import { injectModel } from '@/libs/Provider/Provider'
// 引入公共选项配置
import { FILTER_MODE_OPTIONS_STRING_KEY } from '@/components/DyFormForHighQuery/DyFormForHighQueryOptions'

interface RenderTableType {
  url?: string
@@ -37,6 +44,7 @@
  directives: {
    permission: vPermission,
  },

  setup(props, ctx) {
    const {
      dataSource,
@@ -46,6 +54,7 @@
      tableRef,
      current,
      search,
      // selection,
      sort,
      headers,
      onError,
@@ -62,19 +71,26 @@
    } = useWmsInOutStockOrder(props, ctx)

    //定义高级查询引用
    const wmsInOutStockOrderQueryDrawerRef = ref(null)
    const WmsInOutStockOrderQueryDrawerRef = ref(null)
    // 新增的查询条件
    const queryForm = ref({
      searchVal: '',
      str_searchFormInputAttrs: [],
      searchVal_FilterMode: '',
    })
    //定义整体模糊查询的列数组(注意：必须大小写跟后端的实体类属性名一致，否则会导致匹配不对的问题)
    const _searchFormInputAttrs = ref([
      'OrderNo',
      'MaterialName',
      'MaterialNo',
      'MaterialModel',
      'MaterialBatch',
      'PlanNo',
      'Remark',
    ])
    const searchFormInputAttrs_Placeholder = ref('请输入单据号/物料编号/批次')
    const searchFormInputAttrs_Placeholder = ref(
      '请输入单据编号/物料名称/物料件号/型号/批次号/关联计划编号/备注'
    )

    // 动态枚举选项
    const enumOptions = reactive({
@@ -112,19 +128,28 @@
      }
    }

    // 组件挂载时获取枚举数据
    onMounted(() => {
      fetchEnumData()
    })

    // 定义响应式查询数据
    const _curHighQueryData = ref({
      searchVal: '',
      str_searchFormInputAttrs: [],
      searchVal_FilterMode: '',
    })
    // 组件挂载时获取枚举数据
    onMounted(() => {
      fetchEnumData()
      queryForm.value.searchVal_FilterMode =
        FILTER_MODE_OPTIONS_STRING_KEY[0]?.value || ''
      _curHighQueryData.value.searchVal_FilterMode =
        queryForm.value.searchVal_FilterMode
      _curHighQueryData.value.str_searchFormInputAttrs =
        _searchFormInputAttrs.value
    })

    // 新版的查询方法（主页面中的按钮【查询】）
    const handleQueryForMain = async () => {
      _curHighQueryData.value.searchVal = queryForm.value.searchVal
      _curHighQueryData.value.searchVal_FilterMode =
        queryForm.value.searchVal_FilterMode
      _curHighQueryData.value.str_searchFormInputAttrs =
        _searchFormInputAttrs.value
      tableRef.value.getList(_curHighQueryData.value)
@@ -138,6 +163,8 @@
    // 新版的查询重置
    const resetQuery = () => {
      queryForm.value.searchVal = ''
      queryForm.value.searchVal_FilterMode =
        FILTER_MODE_OPTIONS_STRING_KEY[0]?.value || ''
      queryForm.value.str_searchFormInputAttrs = _searchFormInputAttrs.value
    }
    //新版的导出方法
@@ -155,6 +182,8 @@
    const commonSaveCurHighQueryData = (filteredData = {}) => {
      _curHighQueryData.value = { ..._curHighQueryData.value, ...filteredData }
      _curHighQueryData.value.searchVal = queryForm.value.searchVal
      _curHighQueryData.value.searchVal_FilterMode =
        queryForm.value.searchVal_FilterMode
      _curHighQueryData.value.str_searchFormInputAttrs =
        _searchFormInputAttrs.value
    }
@@ -169,8 +198,69 @@
      )
      //组合模糊查询
      filteredData.searchVal = queryForm.value.searchVal
      filteredData.searchVal_FilterMode = queryForm.value.searchVal_FilterMode
      filteredData.str_searchFormInputAttrs = _searchFormInputAttrs.value
      return filteredData
    }

    // 叫料弹窗相关状态
    const callMaterialDialog = reactive({
      visible: false,
      title: '叫料',
      selectedItems: [] as any[],
    })

    // 打开叫料弹窗
    // const openCallMaterialDialog = () => {
    //   console.log('选中的数据:', callMaterialDialog.selectedItems)
    //   if (selection.value.length === 0) {
    //     ElMessage.warning('请至少选择一条记录')
    //     return
    //   }
    //   callMaterialDialog.selectedItems = [...selection.value]
    //   callMaterialDialog.visible = true
    // }

    // 确认叫料
    const confirmCallMaterial = () => {
      // 这里添加叫料逻辑
      console.log('叫料数据:', callMaterialDialog.selectedItems)
      ElMessage.success('叫料成功')
      callMaterialDialog.visible = false
    }

    /**
     * @returns 叫料弹窗
     */
    const RenderCallMaterialDialog = () => {
      return (
        <ElDialog
          v-model={callMaterialDialog.visible}
          title={callMaterialDialog.title}
          width="70%"
          v-slots={{
            footer: () => (
              <div class={styles.dialogFooter}>
                <ElButton onClick={() => (callMaterialDialog.visible = false)}>
                  取消
                </ElButton>
                <ElButton type="primary" onClick={confirmCallMaterial}>
                  确认叫料
                </ElButton>
              </div>
            ),
          }}
        >
          <ElTable data={callMaterialDialog.selectedItems} border>
            <ElTableColumn prop="orderNo" label="单据号" width="180" />
            <ElTableColumn prop="materialNo" label="物料编号" width="180" />
            <ElTableColumn prop="materialName" label="物料名称" />
            <ElTableColumn prop="materialModel" label="型号" />
            <ElTableColumn prop="placeNo" label="库位编号" />
            <ElTableColumn prop="quantity" label="数量" />
          </ElTable>
        </ElDialog>
      )
    }

    /**
@@ -273,6 +363,9 @@

          <div class={styles.headerContent}>
            <div class={styles.header}>
              {/* 叫料弹窗 */}
              <RenderCallMaterialDialog />

              <IconButton
                v-permission="wmsInOutStockOrder-add"
                icon="add-p"
@@ -282,45 +375,37 @@
                添加
              </IconButton>
              <el-divider direction="vertical" />
              <IconButton
                v-permission="wmsInOutStockOrder-add"
                icon="add-p"
                onClick={onAddWmsInOutStockOrder}
                type="primary"
              >
                叫料
              </IconButton>
              <el-divider direction="vertical" />
              {/* <el-upload
                v-permission="wmsInOutStockOrder-import"
                name="file"
                accept=".xlsx,.xls,.csv"
                show-file-list={false}
                onError={onError}
                onSuccess={onSuccess}
                before-upload={onBeforeUpload}
                headers={headers.value}
                action="/api/v1/HIAWms/wmsInOutStockOrder/import"
              >
                <IconButton icon="in">导入</IconButton>
              </el-upload>

              <IconButton
                v-permission="wmsInOutStockOrder-output"
                icon="out"
                onClick={handleExport}
              >
                导出
              </IconButton> */}
            </div>
            <ElFormItem style={{ marginTop: '15px' }}>
              <ElFormItem label="关键字">
                <ElInput
                  v-model={queryForm.value.searchVal}
                  placeholder={searchFormInputAttrs_Placeholder.value}
                  clearable
                <el-tooltip
                  class="box-item"
                  effect="dark"
                  content={searchFormInputAttrs_Placeholder.value}
                  placement="top-start"
                >
                  <ElInput
                    v-model={queryForm.value.searchVal}
                    placeholder={searchFormInputAttrs_Placeholder.value}
                    clearable
                    class={styles.formItem}
                  />
                </el-tooltip>
              </ElFormItem>
              <ElFormItem label="" style="width:100px;">
                <ElSelect
                  v-model={queryForm.value.searchVal_FilterMode}
                  placeholder="请选择"
                  class={styles.formItem}
                />
                >
                  {FILTER_MODE_OPTIONS_STRING_KEY.map((option) => (
                    <ElOption
                      key={option.value}
                      label={option.label}
                      value={option.value}
                    />
                  ))}
                </ElSelect>
              </ElFormItem>
              <IconButton
                type="primary"