基础数据页面

src/views/wms/areabasic/index.vue

@@ -1,290 +1,138 @@
 <template>
   <ContentWrap>
     <!-- 搜索工作栏 -->
-    <el-form
+    <Search :schema="Area.allSchemas.searchSchema" @search="setSearchParams" @reset="setSearchParams" />
-      class="-mb-15px"
-      :model="queryParams"
-      ref="queryFormRef"
-      :inline="true"
-      label-width="68px"
-    >
-      <el-form-item label="代码" prop="code">
-        <el-input
-          v-model="queryParams.code"
-          placeholder="请输入代码"
-          clearable
-          @keyup.enter="handleQuery"
-          class="!w-240px"
-        />
-      </el-form-item>
-      <el-form-item label="名称" prop="name">
-        <el-input
-          v-model="queryParams.name"
-          placeholder="请输入名称"
-          clearable
-          @keyup.enter="handleQuery"
-          class="!w-240px"
-        />
-      </el-form-item>
-      <el-form-item label="仓库代码" prop="warehouseCode">
-        <el-input
-          v-model="queryParams.warehouseCode"
-          placeholder="请输入仓库代码"
-          clearable
-          @keyup.enter="handleQuery"
-          class="!w-240px"
-        />
-      </el-form-item>
-      <el-form-item label="类型" prop="type">
-        <el-select v-model="queryParams.type" placeholder="请选择类型" clearable class="!w-240px">
-          <el-option
-            v-for="dict in getStrDictOptions(DICT_TYPE.AREA_TYPE)"
-            :key="dict.value"
-            :label="dict.label"
-            :value="dict.value"
-          />
-        </el-select>
-      </el-form-item>
-      <el-form-item label="是否是功能区" prop="isFunctional">
-        <el-select
-          v-model="queryParams.isFunctional"
-          placeholder="请选择是否是功能区"
-          clearable
-          class="!w-240px"
-        >
-          <el-option
-            v-for="dict in getIntDictOptions(DICT_TYPE.TRUE_FALSE)"
-            :key="dict.value"
-            :label="dict.label"
-            :value="dict.value"
-          />
-        </el-select>
-      </el-form-item>
-      <el-form-item label="是否可用" prop="available">
-        <el-select
-          v-model="queryParams.available"
-          placeholder="请选择是否可用"
-          clearable
-          class="!w-240px"
-        >
-          <el-option
-            v-for="dict in getIntDictOptions(DICT_TYPE.TRUE_FALSE)"
-            :key="dict.value"
-            :label="dict.label"
-            :value="dict.value"
-          />
-        </el-select>
-      </el-form-item>
-      <el-form-item label="生效时间" prop="activeTime">
-        <el-date-picker
-          v-model="queryParams.activeTime"
-          value-format="YYYY-MM-DD HH:mm:ss"
-          type="daterange"
-          start-placeholder="开始日期"
-          end-placeholder="结束日期"
-          :default-time="[new Date('1 00:00:00'), new Date('1 23:59:59')]"
-          class="!w-240px"
-        />
-      </el-form-item>
-      <el-form-item label="失效时间" prop="expireTime">
-        <el-date-picker
-          v-model="queryParams.expireTime"
-          value-format="YYYY-MM-DD HH:mm:ss"
-          type="daterange"
-          start-placeholder="开始日期"
-          end-placeholder="结束日期"
-          :default-time="[new Date('1 00:00:00'), new Date('1 23:59:59')]"
-          class="!w-240px"
-        />
-      </el-form-item>
-      <el-form-item label="备注" prop="remark">
-        <el-input
-          v-model="queryParams.remark"
-          placeholder="请输入备注"
-          clearable
-          @keyup.enter="handleQuery"
-          class="!w-240px"
-        />
-      </el-form-item>
-      <el-form-item label="创建时间" prop="createTime">
-        <el-date-picker
-          v-model="queryParams.createTime"
-          value-format="YYYY-MM-DD HH:mm:ss"
-          type="daterange"
-          start-placeholder="开始日期"
-          end-placeholder="结束日期"
-          :default-time="[new Date('1 00:00:00'), new Date('1 23:59:59')]"
-          class="!w-240px"
-        />
-      </el-form-item>
-      <el-form-item label="创建者ID" prop="creator">
-        <el-input
-          v-model="queryParams.creator"
-          placeholder="请输入创建者ID"
-          clearable
-          @keyup.enter="handleQuery"
-          class="!w-240px"
-        />
-      </el-form-item>
-      <el-form-item>
-        <el-button type="info" plain  @click="handleQuery"><Icon icon="ep:search" class="mr-5px" /> 搜索</el-button>
-        <el-button type="info" plain  @click="resetQuery"><Icon icon="ep:refresh" class="mr-5px" /> 重置</el-button>
-        <el-button type="primary" @click="openForm('create')" v-hasPermi="['wms:areabasic:create']">
-          <Icon icon="ep:plus" class="mr-5px" /> 新增
-        </el-button>
-        <el-button
-          type="success"
-          @click="handleExport"
-          :loading="exportLoading"
-          v-hasPermi="['wms:areabasic:export']"
-        >
-          <Icon icon="ep:download" class="mr-5px" /> 导出
-        </el-button>
-      </el-form-item>
-    </el-form>
   </ContentWrap>
 
+  <!-- 列表头部 -->
+  <TableHead :HeadButttondata="HeadButttondata" @button-base-click="buttonBaseClick" />
+
   <!-- 列表 -->
   <ContentWrap>
-    <el-table v-loading="loading" :data="list" :stripe="true" :show-overflow-tooltip="true">
+    <Table
-      <el-table-column label="代码" align="center" prop="code" width="150px" />
+      :columns="Area.allSchemas.tableColumns"
-      <el-table-column label="名称" align="center" prop="name" width="150px" />
+      :data="tableObject.tableList"
-      <el-table-column label="描述" align="center" prop="description" width="150px" />
+      :loading="tableObject.loading"
-      <el-table-column label="仓库代码" align="center" prop="warehouseCode" width="150px" />
+      :pagination="{
-      <el-table-column label="类型" align="center" prop="type" width="150px">
+        total: tableObject.total
-        <template #default="scope">
+      }"
-          <dict-tag :type="DICT_TYPE.AREA_TYPE" :value="scope.row.type" />
+      v-model:pageSize="tableObject.pageSize"
-        </template>
+      v-model:currentPage="tableObject.currentPage"
-      </el-table-column>
+      v-model:sort="tableObject.sort"
-      <el-table-column label="是否是功能区" align="center" prop="isFunctional" width="150px">
-        <template #default="scope">
-          <dict-tag :type="DICT_TYPE.TRUE_FALSE" :value="scope.row.isFunctional" />
-        </template>
-      </el-table-column>
-      <el-table-column label="是否可用" align="center" prop="available" width="150px">
-        <template #default="scope">
-          <dict-tag :type="DICT_TYPE.TRUE_FALSE" :value="scope.row.available" />
-        </template>
-      </el-table-column>
-      <el-table-column
-        label="生效时间"
-        align="center"
-        prop="activeTime"
-        :formatter="dateFormatter"
-        width="150px"
-      />
-      <el-table-column
-        label="失效时间"
-        align="center"
-        prop="expireTime"
-        :formatter="dateFormatter"
-        width="150px"
-      />
-      <el-table-column label="备注" align="center" prop="remark" width="150px" />
-      <el-table-column
-        label="创建时间"
-        align="center"
-        prop="createTime"
-        :formatter="dateFormatter"
-        width="150px"
-      />
-      <el-table-column label="创建者ID" align="center" prop="creator" width="150px" />
-      <el-table-column label="操作" align="center" width="150px"  fixed="right">
-        <template #default="scope">
-          <el-button
-            link
-            type="primary"
-            @click="openForm('update', scope.row.id)"
-            v-hasPermi="['wms:areabasic:update']"
     >
-            编辑
+      <template #code="{row}">
-          </el-button>
+        <el-button type="primary" link @click="openDetail(row, '代码', row.code)">
-          <el-button
+          <span>{{ row.code }}</span>
-            link
-            type="danger"
-            @click="handleDelete(scope.row.id)"
-            v-hasPermi="['wms:areabasic:delete']"
-          >
-            删除
         </el-button>
       </template>
-      </el-table-column>
+      <template #action="{ row }">
-    </el-table>
+        <ButtonBase :Butttondata="butttondata" @button-base-click="buttonTableClick($event,row)" />
-    <!-- 分页 -->
+      </template>
-    <Pagination
+    </Table>
-      :total="total"
-      v-model:page="queryParams.pageNo"
-      v-model:limit="queryParams.pageSize"
-      @pagination="getList"
-    />
   </ContentWrap>
 
   <!-- 表单弹窗：添加/修改 -->
-  <AreaForm ref="formRef" @success="getList" />
+  <BasicForm 
+    ref="basicFormRef" 
+    @success="getList" 
+    :rules="AreaRules" 
+    :formAllSchemas="Area.allSchemas" 
+    searchTableTitle="物料基础信息"
+    :searchTableAllSchemas="ItemBasic.allSchemas"
+    :searchTablePage="ItembasicApi.getItembasicPage"
+    :apiUpdate="AreaApi.updateArea"
+    :apiCreate="AreaApi.createArea"
+  />
+
+  <!-- 详情 -->
+  <Detail ref="detailRef" :isBasic="true" :allSchemas="Area.allSchemas" />
+
+  <!-- 导入 -->
+  <ImportForm ref="importFormRef" url="/wms/area/import" :importTemplateData="importTemplateData" @success="importSuccess" />
 </template>
 
 <script setup lang="ts">
-import { DICT_TYPE, getStrDictOptions, getIntDictOptions } from '@/utils/dict'
-import { dateFormatter } from '@/utils/formatTime'
 import download from '@/utils/download'
 import * as AreaApi from '@/api/wms/areabasic'
-import AreaForm from './AreaForm.vue'
+import * as ItembasicApi from '@/api/wms/itembasic'
+import BasicForm from '@/components/BasicForm/src/BasicForm.vue'
+import { Area, AreaRules, ItemBasic } from '@/utils/disposition/tableColumns'
+import * as defaultButtons from '@/utils/disposition/defaultButtons'
+import TableHead from '@/components/TableHead/src/TableHead.vue' 
+import ImportForm from '@/components/ImportForm/src/ImportForm.vue'
+import Detail from '@/components/Detail/src/Detail.vue'
 
 defineOptions({ name: 'Area' })
 
 const message = useMessage() // 消息弹窗
 const { t } = useI18n() // 国际化
 
-const loading = ref(true) // 列表的加载中
+const { tableObject, tableMethods } = useTable({
-const total = ref(0) // 列表的总页数
+  getListApi: AreaApi.getAreaPage // 分页接口
-const list = ref([]) // 列表的数据
-const queryParams = reactive({
-  pageNo: 1,
-  pageSize: 10,
-  code: null,
-  name: null,
-  description: null,
-  warehouseCode: null,
-  type: null,
-  isFunctional: null,
-  available: null,
-  activeTime: [],
-  expireTime: [],
-  remark: null,
-  createTime: [],
-  creator: null
 })
-const queryFormRef = ref() // 搜索的表单
-const exportLoading = ref(false) // 导出的加载中
 
-/** 查询列表 */
+// 获得表格的各种操作
-const getList = async () => {
+const { getList, setSearchParams } = tableMethods
-  loading.value = true
-  try {
-    const data = await AreaApi.getAreaPage(queryParams)
-    list.value = data.list
-    total.value = data.total
-  } finally {
-    loading.value = false
-  }
-}
 
-/** 搜索按钮操作 */
+// 列表头部按钮
-const handleQuery = () => {
+const HeadButttondata = [
-  queryParams.pageNo = 1
+  defaultButtons.defaultAddBtn({hasPermi:'wms:areabasic:create'}), // 新增
+  defaultButtons.defaultImportBtn({hasPermi:'wms:areabasic:import'}), // 导入
+  defaultButtons.defaultExportBtn({hasPermi:'wms:areabasic:export'}), // 导出
+  // defaultButtons.defaultFilterBtn(), // 筛选
+  defaultButtons.defaultFreshBtn(null), // 刷新
+  // {
+  //   label: '自定义扩展按钮',
+  //   name: 'zdy',
+  //   hide: false,
+  //   type: 'primary',
+  //   icon: 'Select',
+  //   color: ''
+  // },
+]
+
+// 头部按钮事件 
+const buttonBaseClick = (val, item) => {
+  if (val == 'add') { // 新增
+    openForm('create')
+  } else if (val == 'import') { // 导入
+    handleImport()
+  } else if (val == 'export') { // 导出
+    handleExport()
+  } else if (val == 'refresh') { // 刷新
     getList()
+  } else if (val == 'filtrate') { // 筛选
+  } else { // 其他按钮 
+    console.log('其他按钮', item)
+  }
 }
 
-/** 重置按钮操作 */
+// 列表-操作按钮
-const resetQuery = () => {
+const butttondata = [
-  queryFormRef.value.resetFields()
+  defaultButtons.mainListEditBtn({hasPermi:'wms:areabasic:update'}), // 编辑
-  handleQuery()
+  defaultButtons.mainListDeleteBtn({hasPermi:'wms:areabasic:delete'}), // 删除
+]
+
+// 列表-操作按钮事件 
+const buttonTableClick = async (val, row) => {
+  if (val == 'edit') { // 编辑
+    // const res = await AreaApi.getItempackaging(row.id)
+    openForm('update', row)
+  } else if (val == 'delete') { // 删除
+    handleDelete(row.id)
+  }
 }
 
 /** 添加/修改操作 */
-const formRef = ref()
+const basicFormRef = ref()
-const openForm = (type: string, id?: number) => {
+const openForm = (type: string, row?: any) => {
-  formRef.value.open(type, id)
+  basicFormRef.value.open(type, row)
+}
+
+/** 详情操作 */
+const detailRef = ref()
+const openDetail = (row: any, titleName: any, titleValue: any) => {
+  detailRef.value.openDetail(row, titleName, titleValue)
 }
 
 /** 删除按钮操作 */
@@ -301,13 +149,14 @@ const handleDelete = async (id: number) => {
 }
 
 /** 导出按钮操作 */
+const exportLoading = ref(false) // 导出的加载中
 const handleExport = async () => {
   try {
     // 导出的二次确认
     await message.exportConfirm()
     // 发起导出
     exportLoading.value = true
-    const data = await AreaApi.exportArea(queryParams)
+    const data = await AreaApi.exportArea(setSearchParams)
     download.excel(data, '库区.xls')
   } catch {
   } finally {
@@ -315,6 +164,21 @@ const handleExport = async () => {
   }
 }
 
+/** 导入 */
+const importFormRef = ref()
+const handleImport = () => {
+  importFormRef.value.open()
+}
+// 导入附件弹窗所需的参数
+const importTemplateData = reactive({
+  templateUrl: '',
+  templateTitle: '库区导入模版.xls'
+})
+// 导入成功之后
+const importSuccess = () => {
+  getList()
+}
+
 /** 初始化 **/
 onMounted(() => {
   getList()

src/views/wms/currencyexchange/index.vue

@@ -1,255 +1,138 @@
 <template>
   <ContentWrap>
     <!-- 搜索工作栏 -->
-    <el-form
+    <Search :schema="Currencyexchange.allSchemas.searchSchema" @search="setSearchParams" @reset="setSearchParams" />
-      class="-mb-15px"
-      :model="queryParams"
-      ref="queryFormRef"
-      :inline="true"
-      label-width="68px"
-    >
-      <el-form-item label="货币" prop="currency">
-        <el-input
-          v-model="queryParams.currency"
-          placeholder="请输入货币"
-          clearable
-          @keyup.enter="handleQuery"
-          class="!w-240px"
-        />
-      </el-form-item>
-      <el-form-item label="基础货币" prop="basiccurrency">
-        <el-input
-          v-model="queryParams.basiccurrency"
-          placeholder="请输入基础货币"
-          clearable
-          @keyup.enter="handleQuery"
-          class="!w-240px"
-        />
-      </el-form-item>
-      <el-form-item label="比率" prop="rate">
-        <el-input
-          v-model="queryParams.rate"
-          placeholder="请输入比率"
-          clearable
-          @keyup.enter="handleQuery"
-          class="!w-240px"
-        />
-      </el-form-item>
-      <el-form-item label="是否可用" prop="available">
-        <el-select
-          v-model="queryParams.available"
-          placeholder="请选择是否可用"
-          clearable
-          class="!w-240px"
-        >
-          <el-option
-            v-for="dict in getIntDictOptions(DICT_TYPE.TRUE_FALSE)"
-            :key="dict.value"
-            :label="dict.label"
-            :value="dict.value"
-          />
-        </el-select>
-      </el-form-item>
-      <el-form-item label="生效时间" prop="activeTime">
-        <el-date-picker
-          v-model="queryParams.activeTime"
-          value-format="YYYY-MM-DD HH:mm:ss"
-          type="daterange"
-          start-placeholder="开始日期"
-          end-placeholder="结束日期"
-          :default-time="[new Date('1 00:00:00'), new Date('1 23:59:59')]"
-          class="!w-240px"
-        />
-      </el-form-item>
-      <el-form-item label="失效时间" prop="expireTime">
-        <el-date-picker
-          v-model="queryParams.expireTime"
-          value-format="YYYY-MM-DD HH:mm:ss"
-          type="daterange"
-          start-placeholder="开始日期"
-          end-placeholder="结束日期"
-          :default-time="[new Date('1 00:00:00'), new Date('1 23:59:59')]"
-          class="!w-240px"
-        />
-      </el-form-item>
-      <el-form-item label="备注" prop="remark">
-        <el-input
-          v-model="queryParams.remark"
-          placeholder="请输入备注"
-          clearable
-          @keyup.enter="handleQuery"
-          class="!w-240px"
-        />
-      </el-form-item>
-      <el-form-item label="创建时间" prop="createTime">
-        <el-date-picker
-          v-model="queryParams.createTime"
-          value-format="YYYY-MM-DD HH:mm:ss"
-          type="daterange"
-          start-placeholder="开始日期"
-          end-placeholder="结束日期"
-          :default-time="[new Date('1 00:00:00'), new Date('1 23:59:59')]"
-          class="!w-240px"
-        />
-      </el-form-item>
-      <el-form-item label="创建者ID" prop="creator">
-        <el-input
-          v-model="queryParams.creator"
-          placeholder="请输入创建者ID"
-          clearable
-          @keyup.enter="handleQuery"
-          class="!w-240px"
-        />
-      </el-form-item>
-      <el-form-item>
-        <el-button type="info" plain  @click="handleQuery"><Icon icon="ep:search" class="mr-5px" /> 搜索</el-button>
-        <el-button type="info" plain  @click="resetQuery"><Icon icon="ep:refresh" class="mr-5px" /> 重置</el-button>
-        <el-button
-          type="primary"
-          @click="openForm('create')"
-          v-hasPermi="['wms:currencyexchange:create']"
-        >
-          <Icon icon="ep:plus" class="mr-5px" /> 新增
-        </el-button>
-        <el-button
-          type="success"
-          @click="handleExport"
-          :loading="exportLoading"
-          v-hasPermi="['wms:currencyexchange:export']"
-        >
-          <Icon icon="ep:download" class="mr-5px" /> 导出
-        </el-button>
-      </el-form-item>
-    </el-form>
   </ContentWrap>
 
+  <!-- 列表头部 -->
+  <TableHead :HeadButttondata="HeadButttondata" @button-base-click="buttonBaseClick" />
+
   <!-- 列表 -->
   <ContentWrap>
-    <el-table v-loading="loading" :data="list" :stripe="true" :show-overflow-tooltip="true">
+    <Table
-      <el-table-column label="货币" align="center" prop="currency" width="150px" />
+      :columns="Currencyexchange.allSchemas.tableColumns"
-      <el-table-column label="基础货币" align="center" prop="basiccurrency" width="150px" />
+      :data="tableObject.tableList"
-      <el-table-column label="比率" align="center" prop="rate" width="150px" />
+      :loading="tableObject.loading"
-      <el-table-column label="是否可用" align="center" prop="available" width="150px">
+      :pagination="{
-        <template #default="scope">
+        total: tableObject.total
-          <dict-tag :type="DICT_TYPE.TRUE_FALSE" :value="scope.row.available" />
+      }"
-        </template>
+      v-model:pageSize="tableObject.pageSize"
-      </el-table-column>
+      v-model:currentPage="tableObject.currentPage"
-      <el-table-column
+      v-model:sort="tableObject.sort"
-        label="生效时间"
-        align="center"
-        prop="activeTime"
-        :formatter="dateFormatter"
-        width="150px"
-      />
-      <el-table-column
-        label="失效时间"
-        align="center"
-        prop="expireTime"
-        :formatter="dateFormatter"
-        width="150px"
-      />
-      <el-table-column label="备注" align="center" prop="remark" width="150px" />
-      <el-table-column
-        label="创建时间"
-        align="center"
-        prop="createTime"
-        :formatter="dateFormatter"
-        width="150px"
-      />
-      <el-table-column label="创建者ID" align="center" prop="creator" width="150px" />
-      <el-table-column label="操作" align="center" width="150px"  fixed="right">
-        <template #default="scope">
-          <el-button
-            link
-            type="primary"
-            @click="openForm('update', scope.row.id)"
-            v-hasPermi="['wms:currencyexchange:update']"
-          >
-            编辑
-          </el-button>
-          <el-button
-            link
-            type="danger"
-            @click="handleDelete(scope.row.id)"
-            v-hasPermi="['wms:currencyexchange:delete']"
     >
-            删除
+      <template #currency="{row}">
+        <el-button type="primary" link @click="openDetail(row, '货币', row.currency)">
+          <span>{{ row.currency }}</span>
         </el-button>
       </template>
-      </el-table-column>
+      <template #action="{ row }">
-    </el-table>
+        <ButtonBase :Butttondata="butttondata" @button-base-click="buttonTableClick($event,row)" />
-    <!-- 分页 -->
+      </template>
-    <Pagination
+    </Table>
-      :total="total"
-      v-model:page="queryParams.pageNo"
-      v-model:limit="queryParams.pageSize"
-      @pagination="getList"
-    />
   </ContentWrap>
 
   <!-- 表单弹窗：添加/修改 -->
-  <CurrencyexchangeForm ref="formRef" @success="getList" />
+  <BasicForm 
+    ref="basicFormRef" 
+    @success="getList" 
+    :rules="CurrencyexchangeRules" 
+    :formAllSchemas="Currencyexchange.allSchemas" 
+    searchTableTitle="物料基础信息"
+    :searchTableAllSchemas="ItemBasic.allSchemas"
+    :searchTablePage="ItembasicApi.getItembasicPage"
+    :apiUpdate="CurrencyexchangeApi.updateCurrencyexchange"
+    :apiCreate="CurrencyexchangeApi.createCurrencyexchange"
+  />
+
+  <!-- 详情 -->
+  <Detail ref="detailRef" :isBasic="true" :allSchemas="Currencyexchange.allSchemas" />
+
+  <!-- 导入 -->
+  <ImportForm ref="importFormRef" url="/wms/currencyexchange/import" :importTemplateData="importTemplateData" @success="importSuccess" />
 </template>
 
 <script setup lang="ts">
-import { DICT_TYPE, getIntDictOptions } from '@/utils/dict'
-import { dateFormatter } from '@/utils/formatTime'
 import download from '@/utils/download'
 import * as CurrencyexchangeApi from '@/api/wms/currencyexchange'
-import CurrencyexchangeForm from './CurrencyexchangeForm.vue'
+import * as ItembasicApi from '@/api/wms/itembasic'
+import BasicForm from '@/components/BasicForm/src/BasicForm.vue'
+import { Currencyexchange, CurrencyexchangeRules, ItemBasic } from '@/utils/disposition/tableColumns'
+import * as defaultButtons from '@/utils/disposition/defaultButtons'
+import TableHead from '@/components/TableHead/src/TableHead.vue' 
+import ImportForm from '@/components/ImportForm/src/ImportForm.vue'
+import Detail from '@/components/Detail/src/Detail.vue'
 
 defineOptions({ name: 'Currencyexchange' })
 
 const message = useMessage() // 消息弹窗
 const { t } = useI18n() // 国际化
 
-const loading = ref(true) // 列表的加载中
+const { tableObject, tableMethods } = useTable({
-const total = ref(0) // 列表的总页数
+  getListApi: CurrencyexchangeApi.getCurrencyexchangePage // 分页接口
-const list = ref([]) // 列表的数据
-const queryParams = reactive({
-  pageNo: 1,
-  pageSize: 10,
-  currency: null,
-  basiccurrency: null,
-  rate: null,
-  available: null,
-  activeTime: [],
-  expireTime: [],
-  remark: null,
-  createTime: [],
-  creator: null
 })
-const queryFormRef = ref() // 搜索的表单
-const exportLoading = ref(false) // 导出的加载中
 
-/** 查询列表 */
+// 获得表格的各种操作
-const getList = async () => {
+const { getList, setSearchParams } = tableMethods
-  loading.value = true
+
-  try {
+// 列表头部按钮
-    const data = await CurrencyexchangeApi.getCurrencyexchangePage(queryParams)
+const HeadButttondata = [
-    list.value = data.list
+  defaultButtons.defaultAddBtn({hasPermi:'wms:currencyexchange:create'}), // 新增
-    total.value = data.total
+  defaultButtons.defaultImportBtn({hasPermi:'wms:currencyexchange:import'}), // 导入
-  } finally {
+  defaultButtons.defaultExportBtn({hasPermi:'wms:currencyexchange:export'}), // 导出
-    loading.value = false
+  // defaultButtons.defaultFilterBtn(), // 筛选
-  }
+  defaultButtons.defaultFreshBtn(null), // 刷新
-}
+  // {
+  //   label: '自定义扩展按钮',
+  //   name: 'zdy',
+  //   hide: false,
+  //   type: 'primary',
+  //   icon: 'Select',
+  //   color: ''
+  // },
+]
 
-/** 搜索按钮操作 */
+// 头部按钮事件 
-const handleQuery = () => {
+const buttonBaseClick = (val, item) => {
-  queryParams.pageNo = 1
+  if (val == 'add') { // 新增
+    openForm('create')
+  } else if (val == 'import') { // 导入
+    handleImport()
+  } else if (val == 'export') { // 导出
+    handleExport()
+  } else if (val == 'refresh') { // 刷新
     getList()
+  } else if (val == 'filtrate') { // 筛选
+  } else { // 其他按钮 
+    console.log('其他按钮', item)
+  }
 }
 
-/** 重置按钮操作 */
+// 列表-操作按钮
-const resetQuery = () => {
+const butttondata = [
-  queryFormRef.value.resetFields()
+  defaultButtons.mainListEditBtn({hasPermi:'wms:currencyexchange:update'}), // 编辑
-  handleQuery()
+  defaultButtons.mainListDeleteBtn({hasPermi:'wms:currencyexchange:delete'}), // 删除
+]
+
+// 列表-操作按钮事件 
+const buttonTableClick = async (val, row) => {
+  if (val == 'edit') { // 编辑
+    // const res = await CurrencyexchangeApi.getItempackaging(row.id)
+    openForm('update', row)
+  } else if (val == 'delete') { // 删除
+    handleDelete(row.id)
+  }
 }
 
 /** 添加/修改操作 */
-const formRef = ref()
+const basicFormRef = ref()
-const openForm = (type: string, id?: number) => {
+const openForm = (type: string, row?: any) => {
-  formRef.value.open(type, id)
+  basicFormRef.value.open(type, row)
+}
+
+/** 详情操作 */
+const detailRef = ref()
+const openDetail = (row: any, titleName: any, titleValue: any) => {
+  detailRef.value.openDetail(row, titleName, titleValue)
 }
 
 /** 删除按钮操作 */
@@ -266,13 +149,14 @@ const handleDelete = async (id: number) => {
 }
 
 /** 导出按钮操作 */
+const exportLoading = ref(false) // 导出的加载中
 const handleExport = async () => {
   try {
     // 导出的二次确认
     await message.exportConfirm()
     // 发起导出
     exportLoading.value = true
-    const data = await CurrencyexchangeApi.exportCurrencyexchange(queryParams)
+    const data = await CurrencyexchangeApi.exportCurrencyexchange(setSearchParams)
     download.excel(data, '货币转换.xls')
   } catch {
   } finally {
@@ -280,6 +164,21 @@ const handleExport = async () => {
   }
 }
 
+/** 导入 */
+const importFormRef = ref()
+const handleImport = () => {
+  importFormRef.value.open()
+}
+// 导入附件弹窗所需的参数
+const importTemplateData = reactive({
+  templateUrl: '',
+  templateTitle: '货币转换导入模版.xls'
+})
+// 导入成功之后
+const importSuccess = () => {
+  getList()
+}
+
 /** 初始化 **/
 onMounted(() => {
   getList()

src/views/wms/customer/index.vue

@@ -1,387 +1,138 @@
 <template>
   <ContentWrap>
     <!-- 搜索工作栏 -->
-    <el-form
+    <Search :schema="Customer.allSchemas.searchSchema" @search="setSearchParams" @reset="setSearchParams" />
-      class="-mb-15px"
-      :model="queryParams"
-      ref="queryFormRef"
-      :inline="true"
-      label-width="68px"
-    >
-      <el-form-item label="代码" prop="code">
-        <el-input
-          v-model="queryParams.code"
-          placeholder="请输入代码"
-          clearable
-          @keyup.enter="handleQuery"
-          class="!w-240px"
-        />
-      </el-form-item>
-      <el-form-item label="名称" prop="name">
-        <el-input
-          v-model="queryParams.name"
-          placeholder="请输入名称"
-          clearable
-          @keyup.enter="handleQuery"
-          class="!w-240px"
-        />
-      </el-form-item>
-      <el-form-item label="简称" prop="shortName">
-        <el-input
-          v-model="queryParams.shortName"
-          placeholder="请输入简称"
-          clearable
-          @keyup.enter="handleQuery"
-          class="!w-240px"
-        />
-      </el-form-item>
-      <el-form-item label="地址" prop="address">
-        <el-input
-          v-model="queryParams.address"
-          placeholder="请输入地址"
-          clearable
-          @keyup.enter="handleQuery"
-          class="!w-240px"
-        />
-      </el-form-item>
-      <el-form-item label="国家" prop="country">
-        <el-input
-          v-model="queryParams.country"
-          placeholder="请输入国家"
-          clearable
-          @keyup.enter="handleQuery"
-          class="!w-240px"
-        />
-      </el-form-item>
-      <el-form-item label="城市" prop="city">
-        <el-input
-          v-model="queryParams.city"
-          placeholder="请输入城市"
-          clearable
-          @keyup.enter="handleQuery"
-          class="!w-240px"
-        />
-      </el-form-item>
-      <el-form-item label="电话" prop="phone">
-        <el-input
-          v-model="queryParams.phone"
-          placeholder="请输入电话"
-          clearable
-          @keyup.enter="handleQuery"
-          class="!w-240px"
-        />
-      </el-form-item>
-      <el-form-item label="传真" prop="fax">
-        <el-input
-          v-model="queryParams.fax"
-          placeholder="请输入传真"
-          clearable
-          @keyup.enter="handleQuery"
-          class="!w-240px"
-        />
-      </el-form-item>
-      <el-form-item label="邮编" prop="postId">
-        <el-input
-          v-model="queryParams.postId"
-          placeholder="请输入邮编"
-          clearable
-          @keyup.enter="handleQuery"
-          class="!w-240px"
-        />
-      </el-form-item>
-      <el-form-item label="联系人" prop="contacts">
-        <el-input
-          v-model="queryParams.contacts"
-          placeholder="请输入联系人"
-          clearable
-          @keyup.enter="handleQuery"
-          class="!w-240px"
-        />
-      </el-form-item>
-      <el-form-item label="银行" prop="bank">
-        <el-input
-          v-model="queryParams.bank"
-          placeholder="请输入银行"
-          clearable
-          @keyup.enter="handleQuery"
-          class="!w-240px"
-        />
-      </el-form-item>
-      <el-form-item label="币种" prop="currency">
-        <el-select
-          v-model="queryParams.currency"
-          placeholder="请选择币种"
-          clearable
-          class="!w-240px"
-        >
-          <el-option
-            v-for="dict in getStrDictOptions(DICT_TYPE.CURRENCY)"
-            :key="dict.value"
-            :label="dict.label"
-            :value="dict.value"
-          />
-        </el-select>
-      </el-form-item>
-      <el-form-item label="税率" prop="taxRate">
-        <el-input
-          v-model="queryParams.taxRate"
-          placeholder="请输入税率"
-          clearable
-          @keyup.enter="handleQuery"
-          class="!w-240px"
-        />
-      </el-form-item>
-      <el-form-item label="类型" prop="type">
-        <el-select v-model="queryParams.type" placeholder="请选择类型" clearable class="!w-240px">
-          <el-option
-            v-for="dict in getStrDictOptions(DICT_TYPE.CUSTOMER_TYPE)"
-            :key="dict.value"
-            :label="dict.label"
-            :value="dict.value"
-          />
-        </el-select>
-      </el-form-item>
-      <el-form-item label="是否可用" prop="available">
-        <el-select
-          v-model="queryParams.available"
-          placeholder="请选择是否可用"
-          clearable
-          class="!w-240px"
-        >
-          <el-option
-            v-for="dict in getIntDictOptions(DICT_TYPE.TRUE_FALSE)"
-            :key="dict.value"
-            :label="dict.label"
-            :value="dict.value"
-          />
-        </el-select>
-      </el-form-item>
-      <el-form-item label="生效时间" prop="activeTime">
-        <el-date-picker
-          v-model="queryParams.activeTime"
-          value-format="YYYY-MM-DD HH:mm:ss"
-          type="daterange"
-          start-placeholder="开始日期"
-          end-placeholder="结束日期"
-          :default-time="[new Date('1 00:00:00'), new Date('1 23:59:59')]"
-          class="!w-240px"
-        />
-      </el-form-item>
-      <el-form-item label="失效时间" prop="expireTime">
-        <el-date-picker
-          v-model="queryParams.expireTime"
-          value-format="YYYY-MM-DD HH:mm:ss"
-          type="daterange"
-          start-placeholder="开始日期"
-          end-placeholder="结束日期"
-          :default-time="[new Date('1 00:00:00'), new Date('1 23:59:59')]"
-          class="!w-240px"
-        />
-      </el-form-item>
-      <el-form-item label="备注" prop="remark">
-        <el-input
-          v-model="queryParams.remark"
-          placeholder="请输入备注"
-          clearable
-          @keyup.enter="handleQuery"
-          class="!w-240px"
-        />
-      </el-form-item>
-      <el-form-item label="创建时间" prop="createTime">
-        <el-date-picker
-          v-model="queryParams.createTime"
-          value-format="YYYY-MM-DD HH:mm:ss"
-          type="daterange"
-          start-placeholder="开始日期"
-          end-placeholder="结束日期"
-          :default-time="[new Date('1 00:00:00'), new Date('1 23:59:59')]"
-          class="!w-240px"
-        />
-      </el-form-item>
-      <el-form-item label="创建者ID" prop="creator">
-        <el-input
-          v-model="queryParams.creator"
-          placeholder="请输入创建者ID"
-          clearable
-          @keyup.enter="handleQuery"
-          class="!w-240px"
-        />
-      </el-form-item>
-      <el-form-item>
-        <el-button type="info" plain  @click="handleQuery"><Icon icon="ep:search" class="mr-5px" /> 搜索</el-button>
-        <el-button type="info" plain  @click="resetQuery"><Icon icon="ep:refresh" class="mr-5px" /> 重置</el-button>
-        <el-button type="primary" @click="openForm('create')" v-hasPermi="['wms:customer:create']">
-          <Icon icon="ep:plus" class="mr-5px" /> 新增
-        </el-button>
-        <el-button
-          type="success"
-          @click="handleExport"
-          :loading="exportLoading"
-          v-hasPermi="['wms:customer:export']"
-        >
-          <Icon icon="ep:download" class="mr-5px" /> 导出
-        </el-button>
-      </el-form-item>
-    </el-form>
   </ContentWrap>
 
+  <!-- 列表头部 -->
+  <TableHead :HeadButttondata="HeadButttondata" @button-base-click="buttonBaseClick" />
+
   <!-- 列表 -->
   <ContentWrap>
-    <el-table v-loading="loading" :data="list" :stripe="true" :show-overflow-tooltip="true">
+    <Table
-      <el-table-column label="代码" align="center" prop="code" width="150px" />
+      :columns="Customer.allSchemas.tableColumns"
-      <el-table-column label="名称" align="center" prop="name" width="150px" />
+      :data="tableObject.tableList"
-      <el-table-column label="简称" align="center" prop="shortName" width="150px" />
+      :loading="tableObject.loading"
-      <el-table-column label="地址" align="center" prop="address" width="150px" />
+      :pagination="{
-      <el-table-column label="国家" align="center" prop="country" width="150px" />
+        total: tableObject.total
-      <el-table-column label="城市" align="center" prop="city" width="150px" />
+      }"
-      <el-table-column label="电话" align="center" prop="phone" width="150px" />
+      v-model:pageSize="tableObject.pageSize"
-      <el-table-column label="传真" align="center" prop="fax" width="150px" />
+      v-model:currentPage="tableObject.currentPage"
-      <el-table-column label="邮编" align="center" prop="postId" width="150px" />
+      v-model:sort="tableObject.sort"
-      <el-table-column label="联系人" align="center" prop="contacts" width="150px" />
-      <el-table-column label="银行" align="center" prop="bank" width="150px" />
-      <el-table-column label="币种" align="center" prop="currency" width="150px">
-        <template #default="scope">
-          <dict-tag :type="DICT_TYPE.CURRENCY" :value="scope.row.currency" />
-        </template>
-      </el-table-column>
-      <el-table-column label="税率" align="center" prop="taxRate" width="150px" />
-      <el-table-column label="类型" align="center" prop="type" width="150px">
-        <template #default="scope">
-          <dict-tag :type="DICT_TYPE.CUSTOMER_TYPE" :value="scope.row.type" />
-        </template>
-      </el-table-column>
-      <el-table-column label="是否可用" align="center" prop="available" width="150px">
-        <template #default="scope">
-          <dict-tag :type="DICT_TYPE.TRUE_FALSE" :value="scope.row.available" />
-        </template>
-      </el-table-column>
-      <el-table-column
-        label="生效时间"
-        align="center"
-        prop="activeTime"
-        :formatter="dateFormatter"
-        width="150px"
-      />
-      <el-table-column
-        label="失效时间"
-        align="center"
-        prop="expireTime"
-        :formatter="dateFormatter"
-        width="150px"
-      />
-      <el-table-column label="备注" align="center" prop="remark" width="150px" />
-      <el-table-column
-        label="创建时间"
-        align="center"
-        prop="createTime"
-        :formatter="dateFormatter"
-        width="150px"
-      />
-      <el-table-column label="创建者ID" align="center" prop="creator" width="150px" />
-      <el-table-column label="操作" align="center" width="150px"  fixed="right">
-        <template #default="scope">
-          <el-button
-            link
-            type="primary"
-            @click="openForm('update', scope.row.id)"
-            v-hasPermi="['wms:customer:update']"
     >
-            编辑
+      <template #code="{row}">
-          </el-button>
+        <el-button type="primary" link @click="openDetail(row, '代码', row.code)">
-          <el-button
+          <span>{{ row.code }}</span>
-            link
-            type="danger"
-            @click="handleDelete(scope.row.id)"
-            v-hasPermi="['wms:customer:delete']"
-          >
-            删除
         </el-button>
       </template>
-      </el-table-column>
+      <template #action="{ row }">
-    </el-table>
+        <ButtonBase :Butttondata="butttondata" @button-base-click="buttonTableClick($event,row)" />
-    <!-- 分页 -->
+      </template>
-    <Pagination
+    </Table>
-      :total="total"
-      v-model:page="queryParams.pageNo"
-      v-model:limit="queryParams.pageSize"
-      @pagination="getList"
-    />
   </ContentWrap>
 
   <!-- 表单弹窗：添加/修改 -->
-  <CustomerForm ref="formRef" @success="getList" />
+  <BasicForm 
+    ref="basicFormRef" 
+    @success="getList" 
+    :rules="CustomerRules" 
+    :formAllSchemas="Customer.allSchemas" 
+    searchTableTitle="物料基础信息"
+    :searchTableAllSchemas="ItemBasic.allSchemas"
+    :searchTablePage="ItembasicApi.getItembasicPage"
+    :apiUpdate="CustomerApi.updateCustomer"
+    :apiCreate="CustomerApi.createCustomer"
+  />
+
+  <!-- 详情 -->
+  <Detail ref="detailRef" :isBasic="true" :allSchemas="Customer.allSchemas" />
+
+  <!-- 导入 -->
+  <ImportForm ref="importFormRef" url="/wms/customer/import" :importTemplateData="importTemplateData" @success="importSuccess" />
 </template>
 
 <script setup lang="ts">
-import { DICT_TYPE, getStrDictOptions, getIntDictOptions } from '@/utils/dict'
-import { dateFormatter } from '@/utils/formatTime'
 import download from '@/utils/download'
 import * as CustomerApi from '@/api/wms/customer'
-import CustomerForm from './CustomerForm.vue'
+import * as ItembasicApi from '@/api/wms/itembasic'
+import BasicForm from '@/components/BasicForm/src/BasicForm.vue'
+import { Customer, CustomerRules, ItemBasic } from '@/utils/disposition/tableColumns'
+import * as defaultButtons from '@/utils/disposition/defaultButtons'
+import TableHead from '@/components/TableHead/src/TableHead.vue' 
+import ImportForm from '@/components/ImportForm/src/ImportForm.vue'
+import Detail from '@/components/Detail/src/Detail.vue'
 
 defineOptions({ name: 'Customer' })
 
 const message = useMessage() // 消息弹窗
 const { t } = useI18n() // 国际化
 
-const loading = ref(true) // 列表的加载中
+const { tableObject, tableMethods } = useTable({
-const total = ref(0) // 列表的总页数
+  getListApi: CustomerApi.getCustomerPage // 分页接口
-const list = ref([]) // 列表的数据
-const queryParams = reactive({
-  pageNo: 1,
-  pageSize: 10,
-  code: null,
-  name: null,
-  shortName: null,
-  address: null,
-  country: null,
-  city: null,
-  phone: null,
-  fax: null,
-  postId: null,
-  contacts: null,
-  bank: null,
-  currency: null,
-  taxRate: null,
-  type: null,
-  available: null,
-  activeTime: [],
-  expireTime: [],
-  remark: null,
-  createTime: [],
-  creator: null
 })
-const queryFormRef = ref() // 搜索的表单
-const exportLoading = ref(false) // 导出的加载中
 
-/** 查询列表 */
+// 获得表格的各种操作
-const getList = async () => {
+const { getList, setSearchParams } = tableMethods
-  loading.value = true
-  try {
-    const data = await CustomerApi.getCustomerPage(queryParams)
-    list.value = data.list
-    total.value = data.total
-  } finally {
-    loading.value = false
-  }
-}
 
-/** 搜索按钮操作 */
+// 列表头部按钮
-const handleQuery = () => {
+const HeadButttondata = [
-  queryParams.pageNo = 1
+  defaultButtons.defaultAddBtn({hasPermi:'wms:customer:create'}), // 新增
+  defaultButtons.defaultImportBtn({hasPermi:'wms:customer:import'}), // 导入
+  defaultButtons.defaultExportBtn({hasPermi:'wms:customer:export'}), // 导出
+  // defaultButtons.defaultFilterBtn(), // 筛选
+  defaultButtons.defaultFreshBtn(null), // 刷新
+  // {
+  //   label: '自定义扩展按钮',
+  //   name: 'zdy',
+  //   hide: false,
+  //   type: 'primary',
+  //   icon: 'Select',
+  //   color: ''
+  // },
+]
+
+// 头部按钮事件 
+const buttonBaseClick = (val, item) => {
+  if (val == 'add') { // 新增
+    openForm('create')
+  } else if (val == 'import') { // 导入
+    handleImport()
+  } else if (val == 'export') { // 导出
+    handleExport()
+  } else if (val == 'refresh') { // 刷新
     getList()
+  } else if (val == 'filtrate') { // 筛选
+  } else { // 其他按钮 
+    console.log('其他按钮', item)
+  }
 }
 
-/** 重置按钮操作 */
+// 列表-操作按钮
-const resetQuery = () => {
+const butttondata = [
-  queryFormRef.value.resetFields()
+  defaultButtons.mainListEditBtn({hasPermi:'wms:customer:update'}), // 编辑
-  handleQuery()
+  defaultButtons.mainListDeleteBtn({hasPermi:'wms:customer:delete'}), // 删除
+]
+
+// 列表-操作按钮事件 
+const buttonTableClick = async (val, row) => {
+  if (val == 'edit') { // 编辑
+    // const res = await CustomerApi.getItempackaging(row.id)
+    openForm('update', row)
+  } else if (val == 'delete') { // 删除
+    handleDelete(row.id)
+  }
 }
 
 /** 添加/修改操作 */
-const formRef = ref()
+const basicFormRef = ref()
-const openForm = (type: string, id?: number) => {
+const openForm = (type: string, row?: any) => {
-  formRef.value.open(type, id)
+  basicFormRef.value.open(type, row)
+}
+
+/** 详情操作 */
+const detailRef = ref()
+const openDetail = (row: any, titleName: any, titleValue: any) => {
+  detailRef.value.openDetail(row, titleName, titleValue)
 }
 
 /** 删除按钮操作 */
@@ -398,20 +149,36 @@ const handleDelete = async (id: number) => {
 }
 
 /** 导出按钮操作 */
+const exportLoading = ref(false) // 导出的加载中
 const handleExport = async () => {
   try {
     // 导出的二次确认
     await message.exportConfirm()
     // 发起导出
     exportLoading.value = true
-    const data = await CustomerApi.exportCustomer(queryParams)
+    const data = await CustomerApi.exportCustomer(setSearchParams)
-    download.excel(data, '客户.xls')
+    download.excel(data, '客户 .xls')
   } catch {
   } finally {
     exportLoading.value = false
   }
 }
 
+/** 导入 */
+const importFormRef = ref()
+const handleImport = () => {
+  importFormRef.value.open()
+}
+// 导入附件弹窗所需的参数
+const importTemplateData = reactive({
+  templateUrl: '',
+  templateTitle: '客户导入模版.xls'
+})
+// 导入成功之后
+const importSuccess = () => {
+  getList()
+}
+
 /** 初始化 **/
 onMounted(() => {
   getList()

src/views/wms/customerdock/index.vue

@@ -1,323 +1,138 @@
 <template>
   <ContentWrap>
     <!-- 搜索工作栏 -->
-    <el-form
+    <Search :schema="Customerdock.allSchemas.searchSchema" @search="setSearchParams" @reset="setSearchParams" />
-      class="-mb-15px"
-      :model="queryParams"
-      ref="queryFormRef"
-      :inline="true"
-      label-width="68px"
-    >
-      <el-form-item label="代码" prop="code">
-        <el-input
-          v-model="queryParams.code"
-          placeholder="请输入代码"
-          clearable
-          @keyup.enter="handleQuery"
-          class="!w-240px"
-        />
-      </el-form-item>
-      <el-form-item label="名称" prop="name">
-        <el-input
-          v-model="queryParams.name"
-          placeholder="请输入名称"
-          clearable
-          @keyup.enter="handleQuery"
-          class="!w-240px"
-        />
-      </el-form-item>
-      <el-form-item label="城市" prop="city">
-        <el-input
-          v-model="queryParams.city"
-          placeholder="请输入城市"
-          clearable
-          @keyup.enter="handleQuery"
-          class="!w-240px"
-        />
-      </el-form-item>
-      <el-form-item label="地址" prop="address">
-        <el-input
-          v-model="queryParams.address"
-          placeholder="请输入地址"
-          clearable
-          @keyup.enter="handleQuery"
-          class="!w-240px"
-        />
-      </el-form-item>
-      <el-form-item label="联系人姓名" prop="contactPerson">
-        <el-input
-          v-model="queryParams.contactPerson"
-          placeholder="请输入联系人姓名"
-          clearable
-          @keyup.enter="handleQuery"
-          class="!w-240px"
-        />
-      </el-form-item>
-      <el-form-item label="联系人电话" prop="contactPhone">
-        <el-input
-          v-model="queryParams.contactPhone"
-          placeholder="请输入联系人电话"
-          clearable
-          @keyup.enter="handleQuery"
-          class="!w-240px"
-        />
-      </el-form-item>
-      <el-form-item label="客户代码" prop="customerCode">
-        <el-input
-          v-model="queryParams.customerCode"
-          placeholder="请输入客户代码"
-          clearable
-          @keyup.enter="handleQuery"
-          class="!w-240px"
-        />
-      </el-form-item>
-      <el-form-item label="仓库" prop="warehouseCode">
-        <el-input
-          v-model="queryParams.warehouseCode"
-          placeholder="请输入仓库"
-          clearable
-          @keyup.enter="handleQuery"
-          class="!w-240px"
-        />
-      </el-form-item>
-      <el-form-item label="默认库位" prop="defaultLocationCode">
-        <el-input
-          v-model="queryParams.defaultLocationCode"
-          placeholder="请输入默认库位"
-          clearable
-          @keyup.enter="handleQuery"
-          class="!w-240px"
-        />
-      </el-form-item>
-      <el-form-item label="是否可用" prop="available">
-        <el-select
-          v-model="queryParams.available"
-          placeholder="请选择是否可用"
-          clearable
-          class="!w-240px"
-        >
-          <el-option
-            v-for="dict in getIntDictOptions(DICT_TYPE.TRUE_FALSE)"
-            :key="dict.value"
-            :label="dict.label"
-            :value="dict.value"
-          />
-        </el-select>
-      </el-form-item>
-      <el-form-item label="生效时间" prop="activeTime">
-        <el-date-picker
-          v-model="queryParams.activeTime"
-          value-format="YYYY-MM-DD HH:mm:ss"
-          type="daterange"
-          start-placeholder="开始日期"
-          end-placeholder="结束日期"
-          :default-time="[new Date('1 00:00:00'), new Date('1 23:59:59')]"
-          class="!w-240px"
-        />
-      </el-form-item>
-      <el-form-item label="失效时间" prop="expireTime">
-        <el-date-picker
-          v-model="queryParams.expireTime"
-          value-format="YYYY-MM-DD HH:mm:ss"
-          type="daterange"
-          start-placeholder="开始日期"
-          end-placeholder="结束日期"
-          :default-time="[new Date('1 00:00:00'), new Date('1 23:59:59')]"
-          class="!w-240px"
-        />
-      </el-form-item>
-      <el-form-item label="备注" prop="remark">
-        <el-input
-          v-model="queryParams.remark"
-          placeholder="请输入备注"
-          clearable
-          @keyup.enter="handleQuery"
-          class="!w-240px"
-        />
-      </el-form-item>
-      <el-form-item label="创建时间" prop="createTime">
-        <el-date-picker
-          v-model="queryParams.createTime"
-          value-format="YYYY-MM-DD HH:mm:ss"
-          type="daterange"
-          start-placeholder="开始日期"
-          end-placeholder="结束日期"
-          :default-time="[new Date('1 00:00:00'), new Date('1 23:59:59')]"
-          class="!w-240px"
-        />
-      </el-form-item>
-      <el-form-item label="创建者ID" prop="creator">
-        <el-input
-          v-model="queryParams.creator"
-          placeholder="请输入创建者ID"
-          clearable
-          @keyup.enter="handleQuery"
-          class="!w-240px"
-        />
-      </el-form-item>
-      <el-form-item>
-        <el-button type="info" plain  @click="handleQuery"><Icon icon="ep:search" class="mr-5px" /> 搜索</el-button>
-        <el-button type="info" plain  @click="resetQuery"><Icon icon="ep:refresh" class="mr-5px" /> 重置</el-button>
-        <el-button
-          type="primary"
-          @click="openForm('create')"
-          v-hasPermi="['wms:customerdock:create']"
-        >
-          <Icon icon="ep:plus" class="mr-5px" /> 新增
-        </el-button>
-        <el-button
-          type="success"
-          @click="handleExport"
-          :loading="exportLoading"
-          v-hasPermi="['wms:customerdock:export']"
-        >
-          <Icon icon="ep:download" class="mr-5px" /> 导出
-        </el-button>
-      </el-form-item>
-    </el-form>
   </ContentWrap>
 
+  <!-- 列表头部 -->
+  <TableHead :HeadButttondata="HeadButttondata" @button-base-click="buttonBaseClick" />
+
   <!-- 列表 -->
   <ContentWrap>
-    <el-table v-loading="loading" :data="list" :stripe="true" :show-overflow-tooltip="true">
+    <Table
-      <el-table-column label="代码" align="center" prop="code" width="150px" />
+      :columns="Customerdock.allSchemas.tableColumns"
-      <el-table-column label="名称" align="center" prop="name" width="150px" />
+      :data="tableObject.tableList"
-      <el-table-column label="描述" align="center" prop="description" width="150px" />
+      :loading="tableObject.loading"
-      <el-table-column label="城市" align="center" prop="city" width="150px" />
+      :pagination="{
-      <el-table-column label="地址" align="center" prop="address" width="150px" />
+        total: tableObject.total
-      <el-table-column label="联系人姓名" align="center" prop="contactPerson" width="150px" />
+      }"
-      <el-table-column label="联系人电话" align="center" prop="contactPhone" width="150px" />
+      v-model:pageSize="tableObject.pageSize"
-      <el-table-column label="客户代码" align="center" prop="customerCode" width="150px" />
+      v-model:currentPage="tableObject.currentPage"
-      <el-table-column label="仓库" align="center" prop="warehouseCode" width="150px" />
+      v-model:sort="tableObject.sort"
-      <el-table-column label="默认库位" align="center" prop="defaultLocationCode" width="150px" />
-      <el-table-column label="是否可用" align="center" prop="available" width="150px">
-        <template #default="scope">
-          <dict-tag :type="DICT_TYPE.TRUE_FALSE" :value="scope.row.available" />
-        </template>
-      </el-table-column>
-      <el-table-column
-        label="生效时间"
-        align="center"
-        prop="activeTime"
-        :formatter="dateFormatter"
-        width="150px"
-      />
-      <el-table-column
-        label="失效时间"
-        align="center"
-        prop="expireTime"
-        :formatter="dateFormatter"
-        width="150px"
-      />
-      <el-table-column label="备注" align="center" prop="remark" width="150px" />
-      <el-table-column
-        label="创建时间"
-        align="center"
-        prop="createTime"
-        :formatter="dateFormatter"
-        width="150px"
-      />
-      <el-table-column label="创建者ID" align="center" prop="creator" width="150px" />
-      <el-table-column label="操作" align="center" width="150px"  fixed="right">
-        <template #default="scope">
-          <el-button
-            link
-            type="primary"
-            @click="openForm('update', scope.row.id)"
-            v-hasPermi="['wms:customerdock:update']"
-          >
-            编辑
-          </el-button>
-          <el-button
-            link
-            type="danger"
-            @click="handleDelete(scope.row.id)"
-            v-hasPermi="['wms:customerdock:delete']"
     >
-            删除
+      <template #code="{row}">
+        <el-button type="primary" link @click="openDetail(row, '代码', row.code)">
+          <span>{{ row.code }}</span>
         </el-button>
       </template>
-      </el-table-column>
+      <template #action="{ row }">
-    </el-table>
+        <ButtonBase :Butttondata="butttondata" @button-base-click="buttonTableClick($event,row)" />
-    <!-- 分页 -->
+      </template>
-    <Pagination
+    </Table>
-      :total="total"
-      v-model:page="queryParams.pageNo"
-      v-model:limit="queryParams.pageSize"
-      @pagination="getList"
-    />
   </ContentWrap>
 
   <!-- 表单弹窗：添加/修改 -->
-  <CustomerdockForm ref="formRef" @success="getList" />
+  <BasicForm 
+    ref="basicFormRef" 
+    @success="getList" 
+    :rules="CustomerdockRules" 
+    :formAllSchemas="Customerdock.allSchemas" 
+    searchTableTitle="物料基础信息"
+    :searchTableAllSchemas="ItemBasic.allSchemas"
+    :searchTablePage="ItembasicApi.getItembasicPage"
+    :apiUpdate="CustomerdockApi.updateCustomerdock"
+    :apiCreate="CustomerdockApi.createCustomerdock"
+  />
+
+  <!-- 详情 -->
+  <Detail ref="detailRef" :isBasic="true" :allSchemas="Customerdock.allSchemas" />
+
+  <!-- 导入 -->
+  <ImportForm ref="importFormRef" url="/wms/customerdock/import" :importTemplateData="importTemplateData" @success="importSuccess" />
 </template>
 
 <script setup lang="ts">
-import { DICT_TYPE, getIntDictOptions } from '@/utils/dict'
-import { dateFormatter } from '@/utils/formatTime'
 import download from '@/utils/download'
 import * as CustomerdockApi from '@/api/wms/customerdock'
-import CustomerdockForm from './CustomerdockForm.vue'
+import * as ItembasicApi from '@/api/wms/itembasic'
+import BasicForm from '@/components/BasicForm/src/BasicForm.vue'
+import { Customerdock, CustomerdockRules, ItemBasic } from '@/utils/disposition/tableColumns'
+import * as defaultButtons from '@/utils/disposition/defaultButtons'
+import TableHead from '@/components/TableHead/src/TableHead.vue' 
+import ImportForm from '@/components/ImportForm/src/ImportForm.vue'
+import Detail from '@/components/Detail/src/Detail.vue'
 
 defineOptions({ name: 'Customerdock' })
 
 const message = useMessage() // 消息弹窗
 const { t } = useI18n() // 国际化
 
-const loading = ref(true) // 列表的加载中
+const { tableObject, tableMethods } = useTable({
-const total = ref(0) // 列表的总页数
+  getListApi: CustomerdockApi.getCustomerdockPage // 分页接口
-const list = ref([]) // 列表的数据
-const queryParams = reactive({
-  pageNo: 1,
-  pageSize: 10,
-  code: null,
-  name: null,
-  description: null,
-  city: null,
-  address: null,
-  contactPerson: null,
-  contactPhone: null,
-  customerCode: null,
-  warehouseCode: null,
-  defaultLocationCode: null,
-  available: null,
-  activeTime: [],
-  expireTime: [],
-  remark: null,
-  createTime: [],
-  creator: null
 })
-const queryFormRef = ref() // 搜索的表单
-const exportLoading = ref(false) // 导出的加载中
 
-/** 查询列表 */
+// 获得表格的各种操作
-const getList = async () => {
+const { getList, setSearchParams } = tableMethods
-  loading.value = true
-  try {
-    const data = await CustomerdockApi.getCustomerdockPage(queryParams)
-    list.value = data.list
-    total.value = data.total
-  } finally {
-    loading.value = false
-  }
-}
 
-/** 搜索按钮操作 */
+// 列表头部按钮
-const handleQuery = () => {
+const HeadButttondata = [
-  queryParams.pageNo = 1
+  defaultButtons.defaultAddBtn({hasPermi:'wms:customerdock:create'}), // 新增
+  defaultButtons.defaultImportBtn({hasPermi:'wms:customerdock:import'}), // 导入
+  defaultButtons.defaultExportBtn({hasPermi:'wms:customerdock:export'}), // 导出
+  // defaultButtons.defaultFilterBtn(), // 筛选
+  defaultButtons.defaultFreshBtn(null), // 刷新
+  // {
+  //   label: '自定义扩展按钮',
+  //   name: 'zdy',
+  //   hide: false,
+  //   type: 'primary',
+  //   icon: 'Select',
+  //   color: ''
+  // },
+]
+
+// 头部按钮事件 
+const buttonBaseClick = (val, item) => {
+  if (val == 'add') { // 新增
+    openForm('create')
+  } else if (val == 'import') { // 导入
+    handleImport()
+  } else if (val == 'export') { // 导出
+    handleExport()
+  } else if (val == 'refresh') { // 刷新
     getList()
+  } else if (val == 'filtrate') { // 筛选
+  } else { // 其他按钮 
+    console.log('其他按钮', item)
+  }
 }
 
-/** 重置按钮操作 */
+// 列表-操作按钮
-const resetQuery = () => {
+const butttondata = [
-  queryFormRef.value.resetFields()
+  defaultButtons.mainListEditBtn({hasPermi:'wms:customerdock:update'}), // 编辑
-  handleQuery()
+  defaultButtons.mainListDeleteBtn({hasPermi:'wms:customerdock:delete'}), // 删除
+]
+
+// 列表-操作按钮事件 
+const buttonTableClick = async (val, row) => {
+  if (val == 'edit') { // 编辑
+    // const res = await CustomerdockApi.getItempackaging(row.id)
+    openForm('update', row)
+  } else if (val == 'delete') { // 删除
+    handleDelete(row.id)
+  }
 }
 
 /** 添加/修改操作 */
-const formRef = ref()
+const basicFormRef = ref()
-const openForm = (type: string, id?: number) => {
+const openForm = (type: string, row?: any) => {
-  formRef.value.open(type, id)
+  basicFormRef.value.open(type, row)
+}
+
+/** 详情操作 */
+const detailRef = ref()
+const openDetail = (row: any, titleName: any, titleValue: any) => {
+  detailRef.value.openDetail(row, titleName, titleValue)
 }
 
 /** 删除按钮操作 */
@@ -334,13 +149,14 @@ const handleDelete = async (id: number) => {
 }
 
 /** 导出按钮操作 */
+const exportLoading = ref(false) // 导出的加载中
 const handleExport = async () => {
   try {
     // 导出的二次确认
     await message.exportConfirm()
     // 发起导出
     exportLoading.value = true
-    const data = await CustomerdockApi.exportCustomerdock(queryParams)
+    const data = await CustomerdockApi.exportCustomerdock(setSearchParams)
     download.excel(data, '客户月台.xls')
   } catch {
   } finally {
@@ -348,6 +164,21 @@ const handleExport = async () => {
   }
 }
 
+/** 导入 */
+const importFormRef = ref()
+const handleImport = () => {
+  importFormRef.value.open()
+}
+// 导入附件弹窗所需的参数
+const importTemplateData = reactive({
+  templateUrl: '',
+  templateTitle: '客户月台导入模版.xls'
+})
+// 导入成功之后
+const importSuccess = () => {
+  getList()
+}
+
 /** 初始化 **/
 onMounted(() => {
   getList()

src/views/wms/customeritem/index.vue

@@ -1,362 +1,138 @@
 <template>
   <ContentWrap>
     <!-- 搜索工作栏 -->
-    <el-form
+    <Search :schema="Customeritem.allSchemas.searchSchema" @search="setSearchParams" @reset="setSearchParams" />
-      class="-mb-15px"
-      :model="queryParams"
-      ref="queryFormRef"
-      :inline="true"
-      label-width="68px"
-    >
-      <el-form-item label="客户代码" prop="customerCode">
-        <el-input
-          v-model="queryParams.customerCode"
-          placeholder="请输入客户代码"
-          clearable
-          @keyup.enter="handleQuery"
-          class="!w-240px"
-        />
-      </el-form-item>
-      <el-form-item label="物料代码" prop="itemCode">
-        <el-input
-          v-model="queryParams.itemCode"
-          placeholder="请输入物料代码"
-          clearable
-          @keyup.enter="handleQuery"
-          class="!w-240px"
-        />
-      </el-form-item>
-      <el-form-item label="客户物料代码" prop="customerItemCode">
-        <el-input
-          v-model="queryParams.customerItemCode"
-          placeholder="请输入客户物料代码"
-          clearable
-          @keyup.enter="handleQuery"
-          class="!w-240px"
-        />
-      </el-form-item>
-      <el-form-item label="客户计量单位" prop="cusotmerUom">
-        <el-select
-          v-model="queryParams.cusotmerUom"
-          placeholder="请选择客户计量单位"
-          clearable
-          class="!w-240px"
-        >
-          <el-option
-            v-for="dict in getStrDictOptions(DICT_TYPE.UOM)"
-            :key="dict.value"
-            :label="dict.label"
-            :value="dict.value"
-          />
-        </el-select>
-      </el-form-item>
-      <el-form-item label="转换率" prop="convertRate">
-        <el-input
-          v-model="queryParams.convertRate"
-          placeholder="请输入转换率"
-          clearable
-          @keyup.enter="handleQuery"
-          class="!w-240px"
-        />
-      </el-form-item>
-      <el-form-item label="客户包装单位" prop="packUnit">
-        <el-select
-          v-model="queryParams.packUnit"
-          placeholder="请选择客户包装单位"
-          clearable
-          class="!w-240px"
-        >
-          <el-option
-            v-for="dict in getStrDictOptions(DICT_TYPE.PACK_UNIT)"
-            :key="dict.value"
-            :label="dict.label"
-            :value="dict.value"
-          />
-        </el-select>
-      </el-form-item>
-      <el-form-item label="客户包装量" prop="packQty">
-        <el-input
-          v-model="queryParams.packQty"
-          placeholder="请输入客户包装量"
-          clearable
-          @keyup.enter="handleQuery"
-          class="!w-240px"
-        />
-      </el-form-item>
-      <el-form-item label="客户替代包装单位" prop="altPackUnit">
-        <el-select
-          v-model="queryParams.altPackUnit"
-          placeholder="请选择客户替代包装单位"
-          clearable
-          class="!w-240px"
-        >
-          <el-option
-            v-for="dict in getStrDictOptions(DICT_TYPE.PACK_UNIT)"
-            :key="dict.value"
-            :label="dict.label"
-            :value="dict.value"
-          />
-        </el-select>
-      </el-form-item>
-      <el-form-item label="客户替代包装量" prop="altPackQty">
-        <el-input
-          v-model="queryParams.altPackQty"
-          placeholder="请输入客户替代包装量"
-          clearable
-          @keyup.enter="handleQuery"
-          class="!w-240px"
-        />
-      </el-form-item>
-      <el-form-item label="每器具包装数" prop="packQtyOfContainer">
-        <el-input
-          v-model="queryParams.packQtyOfContainer"
-          placeholder="请输入每器具包装数"
-          clearable
-          @keyup.enter="handleQuery"
-          class="!w-240px"
-        />
-      </el-form-item>
-      <el-form-item label="是否可用" prop="available">
-        <el-select
-          v-model="queryParams.available"
-          placeholder="请选择是否可用"
-          clearable
-          class="!w-240px"
-        >
-          <el-option
-            v-for="dict in getIntDictOptions(DICT_TYPE.TRUE_FALSE)"
-            :key="dict.value"
-            :label="dict.label"
-            :value="dict.value"
-          />
-        </el-select>
-      </el-form-item>
-      <el-form-item label="生效时间" prop="activeTime">
-        <el-date-picker
-          v-model="queryParams.activeTime"
-          value-format="YYYY-MM-DD HH:mm:ss"
-          type="daterange"
-          start-placeholder="开始日期"
-          end-placeholder="结束日期"
-          :default-time="[new Date('1 00:00:00'), new Date('1 23:59:59')]"
-          class="!w-240px"
-        />
-      </el-form-item>
-      <el-form-item label="失效时间" prop="expireTime">
-        <el-date-picker
-          v-model="queryParams.expireTime"
-          value-format="YYYY-MM-DD HH:mm:ss"
-          type="daterange"
-          start-placeholder="开始日期"
-          end-placeholder="结束日期"
-          :default-time="[new Date('1 00:00:00'), new Date('1 23:59:59')]"
-          class="!w-240px"
-        />
-      </el-form-item>
-      <el-form-item label="备注" prop="remark">
-        <el-input
-          v-model="queryParams.remark"
-          placeholder="请输入备注"
-          clearable
-          @keyup.enter="handleQuery"
-          class="!w-240px"
-        />
-      </el-form-item>
-      <el-form-item label="创建时间" prop="createTime">
-        <el-date-picker
-          v-model="queryParams.createTime"
-          value-format="YYYY-MM-DD HH:mm:ss"
-          type="daterange"
-          start-placeholder="开始日期"
-          end-placeholder="结束日期"
-          :default-time="[new Date('1 00:00:00'), new Date('1 23:59:59')]"
-          class="!w-240px"
-        />
-      </el-form-item>
-      <el-form-item label="创建者ID" prop="creator">
-        <el-input
-          v-model="queryParams.creator"
-          placeholder="请输入创建者ID"
-          clearable
-          @keyup.enter="handleQuery"
-          class="!w-240px"
-        />
-      </el-form-item>
-      <el-form-item>
-        <el-button type="info" plain  @click="handleQuery"><Icon icon="ep:search" class="mr-5px" /> 搜索</el-button>
-        <el-button type="info" plain  @click="resetQuery"><Icon icon="ep:refresh" class="mr-5px" /> 重置</el-button>
-        <el-button
-          type="primary"
-          @click="openForm('create')"
-          v-hasPermi="['wms:customeritem:create']"
-        >
-          <Icon icon="ep:plus" class="mr-5px" /> 新增
-        </el-button>
-        <el-button
-          type="success"
-          @click="handleExport"
-          :loading="exportLoading"
-          v-hasPermi="['wms:customeritem:export']"
-        >
-          <Icon icon="ep:download" class="mr-5px" /> 导出
-        </el-button>
-      </el-form-item>
-    </el-form>
   </ContentWrap>
 
+  <!-- 列表头部 -->
+  <TableHead :HeadButttondata="HeadButttondata" @button-base-click="buttonBaseClick" />
+
   <!-- 列表 -->
   <ContentWrap>
-    <el-table v-loading="loading" :data="list" :stripe="true" :show-overflow-tooltip="true">
+    <Table
-      <el-table-column label="客户代码" align="center" prop="customerCode" width="150px" />
+      :columns="Customeritem.allSchemas.tableColumns"
-      <el-table-column label="物料代码" align="center" prop="itemCode" width="150px" />
+      :data="tableObject.tableList"
-      <el-table-column label="客户物料代码" align="center" prop="customerItemCode" width="150px" />
+      :loading="tableObject.loading"
-      <el-table-column label="客户计量单位" align="center" prop="cusotmerUom" width="150px">
+      :pagination="{
-        <template #default="scope">
+        total: tableObject.total
-          <dict-tag :type="DICT_TYPE.UOM" :value="scope.row.cusotmerUom" />
+      }"
-        </template>
+      v-model:pageSize="tableObject.pageSize"
-      </el-table-column>
+      v-model:currentPage="tableObject.currentPage"
-      <el-table-column label="转换率" align="center" prop="convertRate" width="150px" />
+      v-model:sort="tableObject.sort"
-      <el-table-column label="客户包装单位" align="center" prop="packUnit" width="150px">
-        <template #default="scope">
-          <dict-tag :type="DICT_TYPE.PACK_UNIT" :value="scope.row.packUnit" />
-        </template>
-      </el-table-column>
-      <el-table-column label="客户包装量" align="center" prop="packQty" width="150px" />
-      <el-table-column label="客户替代包装单位" align="center" prop="altPackUnit" width="150px">
-        <template #default="scope">
-          <dict-tag :type="DICT_TYPE.PACK_UNIT" :value="scope.row.altPackUnit" />
-        </template>
-      </el-table-column>
-      <el-table-column label="客户替代包装量" align="center" prop="altPackQty" width="150px" />
-      <el-table-column label="每器具包装数" align="center" prop="packQtyOfContainer" width="150px" />
-      <el-table-column label="是否可用" align="center" prop="available" width="150px">
-        <template #default="scope">
-          <dict-tag :type="DICT_TYPE.TRUE_FALSE" :value="scope.row.available" />
-        </template>
-      </el-table-column>
-      <el-table-column
-        label="生效时间"
-        align="center"
-        prop="activeTime"
-        :formatter="dateFormatter"
-        width="150px"
-      />
-      <el-table-column
-        label="失效时间"
-        align="center"
-        prop="expireTime"
-        :formatter="dateFormatter"
-        width="150px"
-      />
-      <el-table-column label="备注" align="center" prop="remark" width="150px" />
-      <el-table-column
-        label="创建时间"
-        align="center"
-        prop="createTime"
-        :formatter="dateFormatter"
-        width="150px"
-      />
-      <el-table-column label="创建者ID" align="center" prop="creator" width="150px" />
-      <el-table-column label="操作" align="center" width="150px"  fixed="right">
-        <template #default="scope">
-          <el-button
-            link
-            type="primary"
-            @click="openForm('update', scope.row.id)"
-            v-hasPermi="['wms:customeritem:update']"
     >
-            编辑
+      <template #customerCode="{row}">
-          </el-button>
+        <el-button type="primary" link @click="openDetail(row, '客户代码', row.customerCode)">
-          <el-button
+          <span>{{ row.customerCode }}</span>
-            link
-            type="danger"
-            @click="handleDelete(scope.row.id)"
-            v-hasPermi="['wms:customeritem:delete']"
-          >
-            删除
         </el-button>
       </template>
-      </el-table-column>
+      <template #action="{ row }">
-    </el-table>
+        <ButtonBase :Butttondata="butttondata" @button-base-click="buttonTableClick($event,row)" />
-    <!-- 分页 -->
+      </template>
-    <Pagination
+    </Table>
-      :total="total"
-      v-model:page="queryParams.pageNo"
-      v-model:limit="queryParams.pageSize"
-      @pagination="getList"
-    />
   </ContentWrap>
 
   <!-- 表单弹窗：添加/修改 -->
-  <CustomeritemForm ref="formRef" @success="getList" />
+  <BasicForm 
+    ref="basicFormRef" 
+    @success="getList" 
+    :rules="CustomeritemRules" 
+    :formAllSchemas="Customeritem.allSchemas" 
+    searchTableTitle="物料基础信息"
+    :searchTableAllSchemas="ItemBasic.allSchemas"
+    :searchTablePage="ItembasicApi.getItembasicPage"
+    :apiUpdate="CustomeritemApi.updateCustomeritem"
+    :apiCreate="CustomeritemApi.createCustomeritem"
+  />
+
+  <!-- 详情 -->
+  <Detail ref="detailRef" :isBasic="true" :allSchemas="Customeritem.allSchemas" />
+
+  <!-- 导入 -->
+  <ImportForm ref="importFormRef" url="/wms/customeritem/import" :importTemplateData="importTemplateData" @success="importSuccess" />
 </template>
 
 <script setup lang="ts">
-import { DICT_TYPE, getStrDictOptions, getIntDictOptions } from '@/utils/dict'
-import { dateFormatter } from '@/utils/formatTime'
 import download from '@/utils/download'
 import * as CustomeritemApi from '@/api/wms/customeritem'
-import CustomeritemForm from './CustomeritemForm.vue'
+import * as ItembasicApi from '@/api/wms/itembasic'
+import BasicForm from '@/components/BasicForm/src/BasicForm.vue'
+import { Customeritem, CustomeritemRules, ItemBasic } from '@/utils/disposition/tableColumns'
+import * as defaultButtons from '@/utils/disposition/defaultButtons'
+import TableHead from '@/components/TableHead/src/TableHead.vue' 
+import ImportForm from '@/components/ImportForm/src/ImportForm.vue'
+import Detail from '@/components/Detail/src/Detail.vue'
 
 defineOptions({ name: 'Customeritem' })
 
 const message = useMessage() // 消息弹窗
 const { t } = useI18n() // 国际化
 
-const loading = ref(true) // 列表的加载中
+const { tableObject, tableMethods } = useTable({
-const total = ref(0) // 列表的总页数
+  getListApi: CustomeritemApi.getCustomeritemPage // 分页接口
-const list = ref([]) // 列表的数据
-const queryParams = reactive({
-  pageNo: 1,
-  pageSize: 10,
-  customerCode: null,
-  itemCode: null,
-  customerItemCode: null,
-  cusotmerUom: null,
-  convertRate: null,
-  packUnit: null,
-  packQty: null,
-  altPackUnit: null,
-  altPackQty: null,
-  packQtyOfContainer: null,
-  available: null,
-  activeTime: [],
-  expireTime: [],
-  remark: null,
-  createTime: [],
-  creator: null
 })
-const queryFormRef = ref() // 搜索的表单
-const exportLoading = ref(false) // 导出的加载中
 
-/** 查询列表 */
+// 获得表格的各种操作
-const getList = async () => {
+const { getList, setSearchParams } = tableMethods
-  loading.value = true
-  try {
-    const data = await CustomeritemApi.getCustomeritemPage(queryParams)
-    list.value = data.list
-    total.value = data.total
-  } finally {
-    loading.value = false
-  }
-}
 
-/** 搜索按钮操作 */
+// 列表头部按钮
-const handleQuery = () => {
+const HeadButttondata = [
-  queryParams.pageNo = 1
+  defaultButtons.defaultAddBtn({hasPermi:'wms:customeritem:create'}), // 新增
+  defaultButtons.defaultImportBtn({hasPermi:'wms:customeritem:import'}), // 导入
+  defaultButtons.defaultExportBtn({hasPermi:'wms:customeritem:export'}), // 导出
+  // defaultButtons.defaultFilterBtn(), // 筛选
+  defaultButtons.defaultFreshBtn(null), // 刷新
+  // {
+  //   label: '自定义扩展按钮',
+  //   name: 'zdy',
+  //   hide: false,
+  //   type: 'primary',
+  //   icon: 'Select',
+  //   color: ''
+  // },
+]
+
+// 头部按钮事件 
+const buttonBaseClick = (val, item) => {
+  if (val == 'add') { // 新增
+    openForm('create')
+  } else if (val == 'import') { // 导入
+    handleImport()
+  } else if (val == 'export') { // 导出
+    handleExport()
+  } else if (val == 'refresh') { // 刷新
     getList()
+  } else if (val == 'filtrate') { // 筛选
+  } else { // 其他按钮 
+    console.log('其他按钮', item)
+  }
 }
 
-/** 重置按钮操作 */
+// 列表-操作按钮
-const resetQuery = () => {
+const butttondata = [
-  queryFormRef.value.resetFields()
+  defaultButtons.mainListEditBtn({hasPermi:'wms:customeritem:update'}), // 编辑
-  handleQuery()
+  defaultButtons.mainListDeleteBtn({hasPermi:'wms:customeritem:delete'}), // 删除
+]
+
+// 列表-操作按钮事件 
+const buttonTableClick = async (val, row) => {
+  if (val == 'edit') { // 编辑
+    // const res = await CustomeritemApi.getItempackaging(row.id)
+    openForm('update', row)
+  } else if (val == 'delete') { // 删除
+    handleDelete(row.id)
+  }
 }
 
 /** 添加/修改操作 */
-const formRef = ref()
+const basicFormRef = ref()
-const openForm = (type: string, id?: number) => {
+const openForm = (type: string, row?: any) => {
-  formRef.value.open(type, id)
+  basicFormRef.value.open(type, row)
+}
+
+/** 详情操作 */
+const detailRef = ref()
+const openDetail = (row: any, titleName: any, titleValue: any) => {
+  detailRef.value.openDetail(row, titleName, titleValue)
 }
 
 /** 删除按钮操作 */
@@ -373,20 +149,36 @@ const handleDelete = async (id: number) => {
 }
 
 /** 导出按钮操作 */
+const exportLoading = ref(false) // 导出的加载中
 const handleExport = async () => {
   try {
     // 导出的二次确认
     await message.exportConfirm()
     // 发起导出
     exportLoading.value = true
-    const data = await CustomeritemApi.exportCustomeritem(queryParams)
+    const data = await CustomeritemApi.exportCustomeritem(setSearchParams)
-    download.excel(data, '客户物品.xls')
+    download.excel(data, '客户物品 .xls')
   } catch {
   } finally {
     exportLoading.value = false
   }
 }
 
+/** 导入 */
+const importFormRef = ref()
+const handleImport = () => {
+  importFormRef.value.open()
+}
+// 导入附件弹窗所需的参数
+const importTemplateData = reactive({
+  templateUrl: '',
+  templateTitle: '客户物品导入模版.xls'
+})
+// 导入成功之后
+const importSuccess = () => {
+  getList()
+}
+
 /** 初始化 **/
 onMounted(() => {
   getList()

src/views/wms/dock/index.vue

@@ -1,324 +1,138 @@
 <template>
   <ContentWrap>
     <!-- 搜索工作栏 -->
-    <el-form
+    <Search :schema="Dock.allSchemas.searchSchema" @search="setSearchParams" @reset="setSearchParams" />
-      class="-mb-15px"
-      :model="queryParams"
-      ref="queryFormRef"
-      :inline="true"
-      label-width="68px"
-    >
-      <el-form-item label="代码" prop="code">
-        <el-input
-          v-model="queryParams.code"
-          placeholder="请输入代码"
-          clearable
-          @keyup.enter="handleQuery"
-          class="!w-240px"
-        />
-      </el-form-item>
-      <el-form-item label="名称" prop="name">
-        <el-input
-          v-model="queryParams.name"
-          placeholder="请输入名称"
-          clearable
-          @keyup.enter="handleQuery"
-          class="!w-240px"
-        />
-      </el-form-item>
-      <el-form-item label="城市" prop="city">
-        <el-input
-          v-model="queryParams.city"
-          placeholder="请输入城市"
-          clearable
-          @keyup.enter="handleQuery"
-          class="!w-240px"
-        />
-      </el-form-item>
-      <el-form-item label="地址" prop="address">
-        <el-input
-          v-model="queryParams.address"
-          placeholder="请输入地址"
-          clearable
-          @keyup.enter="handleQuery"
-          class="!w-240px"
-        />
-      </el-form-item>
-      <el-form-item label="类型" prop="type">
-        <el-select v-model="queryParams.type" placeholder="请选择类型" clearable class="!w-240px">
-          <el-option
-            v-for="dict in getStrDictOptions(DICT_TYPE.DOCK_TYPE)"
-            :key="dict.value"
-            :label="dict.label"
-            :value="dict.value"
-          />
-        </el-select>
-      </el-form-item>
-      <el-form-item label="仓库代码" prop="warehouseCode">
-        <el-input
-          v-model="queryParams.warehouseCode"
-          placeholder="请输入仓库代码"
-          clearable
-          @keyup.enter="handleQuery"
-          class="!w-240px"
-        />
-      </el-form-item>
-      <el-form-item label="默认库位代码" prop="defaultLocationCode">
-        <el-input
-          v-model="queryParams.defaultLocationCode"
-          placeholder="请输入默认库位代码"
-          clearable
-          @keyup.enter="handleQuery"
-          class="!w-240px"
-        />
-      </el-form-item>
-      <el-form-item label="联系人姓名" prop="contactPerson">
-        <el-input
-          v-model="queryParams.contactPerson"
-          placeholder="请输入联系人姓名"
-          clearable
-          @keyup.enter="handleQuery"
-          class="!w-240px"
-        />
-      </el-form-item>
-      <el-form-item label="联系人电话" prop="contactPhone">
-        <el-input
-          v-model="queryParams.contactPhone"
-          placeholder="请输入联系人电话"
-          clearable
-          @keyup.enter="handleQuery"
-          class="!w-240px"
-        />
-      </el-form-item>
-      <el-form-item label="是否可用" prop="available">
-        <el-select
-          v-model="queryParams.available"
-          placeholder="请选择是否可用"
-          clearable
-          class="!w-240px"
-        >
-          <el-option
-            v-for="dict in getIntDictOptions(DICT_TYPE.TRUE_FALSE)"
-            :key="dict.value"
-            :label="dict.label"
-            :value="dict.value"
-          />
-        </el-select>
-      </el-form-item>
-      <el-form-item label="生效时间" prop="activeTime">
-        <el-date-picker
-          v-model="queryParams.activeTime"
-          value-format="YYYY-MM-DD HH:mm:ss"
-          type="daterange"
-          start-placeholder="开始日期"
-          end-placeholder="结束日期"
-          :default-time="[new Date('1 00:00:00'), new Date('1 23:59:59')]"
-          class="!w-240px"
-        />
-      </el-form-item>
-      <el-form-item label="失效时间" prop="expireTime">
-        <el-date-picker
-          v-model="queryParams.expireTime"
-          value-format="YYYY-MM-DD HH:mm:ss"
-          type="daterange"
-          start-placeholder="开始日期"
-          end-placeholder="结束日期"
-          :default-time="[new Date('1 00:00:00'), new Date('1 23:59:59')]"
-          class="!w-240px"
-        />
-      </el-form-item>
-      <el-form-item label="备注" prop="remark">
-        <el-input
-          v-model="queryParams.remark"
-          placeholder="请输入备注"
-          clearable
-          @keyup.enter="handleQuery"
-          class="!w-240px"
-        />
-      </el-form-item>
-      <el-form-item label="创建时间" prop="createTime">
-        <el-date-picker
-          v-model="queryParams.createTime"
-          value-format="YYYY-MM-DD HH:mm:ss"
-          type="daterange"
-          start-placeholder="开始日期"
-          end-placeholder="结束日期"
-          :default-time="[new Date('1 00:00:00'), new Date('1 23:59:59')]"
-          class="!w-240px"
-        />
-      </el-form-item>
-      <el-form-item label="创建者ID" prop="creator">
-        <el-input
-          v-model="queryParams.creator"
-          placeholder="请输入创建者ID"
-          clearable
-          @keyup.enter="handleQuery"
-          class="!w-240px"
-        />
-      </el-form-item>
-      <el-form-item>
-        <el-button type="info" plain  @click="handleQuery"><Icon icon="ep:search" class="mr-5px" /> 搜索</el-button>
-        <el-button type="info" plain  @click="resetQuery"><Icon icon="ep:refresh" class="mr-5px" /> 重置</el-button>
-        <el-button type="primary" @click="openForm('create')" v-hasPermi="['wms:dock:create']">
-          <Icon icon="ep:plus" class="mr-5px" /> 新增
-        </el-button>
-        <el-button
-          type="success"
-          @click="handleExport"
-          :loading="exportLoading"
-          v-hasPermi="['wms:dock:export']"
-        >
-          <Icon icon="ep:download" class="mr-5px" /> 导出
-        </el-button>
-      </el-form-item>
-    </el-form>
   </ContentWrap>
 
+  <!-- 列表头部 -->
+  <TableHead :HeadButttondata="HeadButttondata" @button-base-click="buttonBaseClick" />
+
   <!-- 列表 -->
   <ContentWrap>
-    <el-table v-loading="loading" :data="list" :stripe="true" :show-overflow-tooltip="true">
+    <Table
-      <el-table-column label="代码" align="center" prop="code" width="150px" />
+      :columns="Dock.allSchemas.tableColumns"
-      <el-table-column label="名称" align="center" prop="name" width="150px" />
+      :data="tableObject.tableList"
-      <el-table-column label="描述" align="center" prop="description" width="150px" />
+      :loading="tableObject.loading"
-      <el-table-column label="城市" align="center" prop="city" width="150px" />
+      :pagination="{
-      <el-table-column label="地址" align="center" prop="address" width="150px" />
+        total: tableObject.total
-      <el-table-column label="类型" align="center" prop="type" width="150px">
+      }"
-        <template #default="scope">
+      v-model:pageSize="tableObject.pageSize"
-          <dict-tag :type="DICT_TYPE.DOCK_TYPE" :value="scope.row.type" />
+      v-model:currentPage="tableObject.currentPage"
-        </template>
+      v-model:sort="tableObject.sort"
-      </el-table-column>
-      <el-table-column label="仓库代码" align="center" prop="warehouseCode" width="150px" />
-      <el-table-column label="默认库位代码" align="center" prop="defaultLocationCode" width="150px" />
-      <el-table-column label="联系人姓名" align="center" prop="contactPerson" width="150px" />
-      <el-table-column label="联系人电话" align="center" prop="contactPhone" width="150px" />
-      <el-table-column label="是否可用" align="center" prop="available" width="150px">
-        <template #default="scope">
-          <dict-tag :type="DICT_TYPE.TRUE_FALSE" :value="scope.row.available" />
-        </template>
-      </el-table-column>
-      <el-table-column
-        label="生效时间"
-        align="center"
-        prop="activeTime"
-        :formatter="dateFormatter"
-        width="150px"
-      />
-      <el-table-column
-        label="失效时间"
-        align="center"
-        prop="expireTime"
-        :formatter="dateFormatter"
-        width="150px"
-      />
-      <el-table-column label="备注" align="center" prop="remark" width="150px" />
-      <el-table-column
-        label="创建时间"
-        align="center"
-        prop="createTime"
-        :formatter="dateFormatter"
-        width="150px"
-      />
-      <el-table-column label="创建者ID" align="center" prop="creator" width="150px" />
-      <el-table-column label="操作" align="center" width="150px"  fixed="right">
-        <template #default="scope">
-          <el-button
-            link
-            type="primary"
-            @click="openForm('update', scope.row.id)"
-            v-hasPermi="['wms:dock:update']"
-          >
-            编辑
-          </el-button>
-          <el-button
-            link
-            type="danger"
-            @click="handleDelete(scope.row.id)"
-            v-hasPermi="['wms:dock:delete']"
     >
-            删除
+      <template #code="{row}">
+        <el-button type="primary" link @click="openDetail(row, '代码', row.code)">
+          <span>{{ row.code }}</span>
         </el-button>
       </template>
-      </el-table-column>
+      <template #action="{ row }">
-    </el-table>
+        <ButtonBase :Butttondata="butttondata" @button-base-click="buttonTableClick($event,row)" />
-    <!-- 分页 -->
+      </template>
-    <Pagination
+    </Table>
-      :total="total"
-      v-model:page="queryParams.pageNo"
-      v-model:limit="queryParams.pageSize"
-      @pagination="getList"
-    />
   </ContentWrap>
 
   <!-- 表单弹窗：添加/修改 -->
-  <DockForm ref="formRef" @success="getList" />
+  <BasicForm 
+    ref="basicFormRef" 
+    @success="getList" 
+    :rules="DockRules" 
+    :formAllSchemas="Dock.allSchemas" 
+    searchTableTitle="物料基础信息"
+    :searchTableAllSchemas="ItemBasic.allSchemas"
+    :searchTablePage="ItembasicApi.getItembasicPage"
+    :apiUpdate="DockApi.updateDock"
+    :apiCreate="DockApi.createDock"
+  />
+
+  <!-- 详情 -->
+  <Detail ref="detailRef" :isBasic="true" :allSchemas="Dock.allSchemas" />
+
+  <!-- 导入 -->
+  <ImportForm ref="importFormRef" url="/wms/dock/import" :importTemplateData="importTemplateData" @success="importSuccess" />
 </template>
 
 <script setup lang="ts">
-import { DICT_TYPE, getStrDictOptions, getIntDictOptions } from '@/utils/dict'
-import { dateFormatter } from '@/utils/formatTime'
 import download from '@/utils/download'
 import * as DockApi from '@/api/wms/dock'
-import DockForm from './DockForm.vue'
+import * as ItembasicApi from '@/api/wms/itembasic'
+import BasicForm from '@/components/BasicForm/src/BasicForm.vue'
+import { Dock, DockRules, ItemBasic } from '@/utils/disposition/tableColumns'
+import * as defaultButtons from '@/utils/disposition/defaultButtons'
+import TableHead from '@/components/TableHead/src/TableHead.vue' 
+import ImportForm from '@/components/ImportForm/src/ImportForm.vue'
+import Detail from '@/components/Detail/src/Detail.vue'
 
 defineOptions({ name: 'Dock' })
 
 const message = useMessage() // 消息弹窗
 const { t } = useI18n() // 国际化
 
-const loading = ref(true) // 列表的加载中
+const { tableObject, tableMethods } = useTable({
-const total = ref(0) // 列表的总页数
+  getListApi: DockApi.getDockPage // 分页接口
-const list = ref([]) // 列表的数据
-const queryParams = reactive({
-  pageNo: 1,
-  pageSize: 10,
-  code: null,
-  name: null,
-  description: null,
-  city: null,
-  address: null,
-  type: null,
-  warehouseCode: null,
-  defaultLocationCode: null,
-  contactPerson: null,
-  contactPhone: null,
-  available: null,
-  activeTime: [],
-  expireTime: [],
-  remark: null,
-  createTime: [],
-  creator: null
 })
-const queryFormRef = ref() // 搜索的表单
-const exportLoading = ref(false) // 导出的加载中
 
-/** 查询列表 */
+// 获得表格的各种操作
-const getList = async () => {
+const { getList, setSearchParams } = tableMethods
-  loading.value = true
-  try {
-    const data = await DockApi.getDockPage(queryParams)
-    list.value = data.list
-    total.value = data.total
-  } finally {
-    loading.value = false
-  }
-}
 
-/** 搜索按钮操作 */
+// 列表头部按钮
-const handleQuery = () => {
+const HeadButttondata = [
-  queryParams.pageNo = 1
+  defaultButtons.defaultAddBtn({hasPermi:'wms:dock:create'}), // 新增
+  defaultButtons.defaultImportBtn({hasPermi:'wms:dock:import'}), // 导入
+  defaultButtons.defaultExportBtn({hasPermi:'wms:dock:export'}), // 导出
+  // defaultButtons.defaultFilterBtn(), // 筛选
+  defaultButtons.defaultFreshBtn(null), // 刷新
+  // {
+  //   label: '自定义扩展按钮',
+  //   name: 'zdy',
+  //   hide: false,
+  //   type: 'primary',
+  //   icon: 'Select',
+  //   color: ''
+  // },
+]
+
+// 头部按钮事件 
+const buttonBaseClick = (val, item) => {
+  if (val == 'add') { // 新增
+    openForm('create')
+  } else if (val == 'import') { // 导入
+    handleImport()
+  } else if (val == 'export') { // 导出
+    handleExport()
+  } else if (val == 'refresh') { // 刷新
     getList()
+  } else if (val == 'filtrate') { // 筛选
+  } else { // 其他按钮 
+    console.log('其他按钮', item)
+  }
 }
 
-/** 重置按钮操作 */
+// 列表-操作按钮
-const resetQuery = () => {
+const butttondata = [
-  queryFormRef.value.resetFields()
+  defaultButtons.mainListEditBtn({hasPermi:'wms:dock:update'}), // 编辑
-  handleQuery()
+  defaultButtons.mainListDeleteBtn({hasPermi:'wms:dock:delete'}), // 删除
+]
+
+// 列表-操作按钮事件 
+const buttonTableClick = async (val, row) => {
+  if (val == 'edit') { // 编辑
+    // const res = await DockApi.getItempackaging(row.id)
+    openForm('update', row)
+  } else if (val == 'delete') { // 删除
+    handleDelete(row.id)
+  }
 }
 
 /** 添加/修改操作 */
-const formRef = ref()
+const basicFormRef = ref()
-const openForm = (type: string, id?: number) => {
+const openForm = (type: string, row?: any) => {
-  formRef.value.open(type, id)
+  basicFormRef.value.open(type, row)
+}
+
+/** 详情操作 */
+const detailRef = ref()
+const openDetail = (row: any, titleName: any, titleValue: any) => {
+  detailRef.value.openDetail(row, titleName, titleValue)
 }
 
 /** 删除按钮操作 */
@@ -335,13 +149,14 @@ const handleDelete = async (id: number) => {
 }
 
 /** 导出按钮操作 */
+const exportLoading = ref(false) // 导出的加载中
 const handleExport = async () => {
   try {
     // 导出的二次确认
     await message.exportConfirm()
     // 发起导出
     exportLoading.value = true
-    const data = await DockApi.exportDock(queryParams)
+    const data = await DockApi.exportDock(setSearchParams)
     download.excel(data, '月台.xls')
   } catch {
   } finally {
@@ -349,6 +164,21 @@ const handleExport = async () => {
   }
 }
 
+/** 导入 */
+const importFormRef = ref()
+const handleImport = () => {
+  importFormRef.value.open()
+}
+// 导入附件弹窗所需的参数
+const importTemplateData = reactive({
+  templateUrl: '',
+  templateTitle: '月台导入模版.xls'
+})
+// 导入成功之后
+const importSuccess = () => {
+  getList()
+}
+
 /** 初始化 **/
 onMounted(() => {
   getList()

src/views/wms/locationgroup/index.vue

@@ -1,268 +1,138 @@
 <template>
   <ContentWrap>
     <!-- 搜索工作栏 -->
-    <el-form
+    <Search :schema="Locationgroup.allSchemas.searchSchema" @search="setSearchParams" @reset="setSearchParams" />
-      class="-mb-15px"
-      :model="queryParams"
-      ref="queryFormRef"
-      :inline="true"
-      label-width="68px"
-    >
-      <el-form-item label="代码" prop="code">
-        <el-input
-          v-model="queryParams.code"
-          placeholder="请输入代码"
-          clearable
-          @keyup.enter="handleQuery"
-          class="!w-240px"
-        />
-      </el-form-item>
-      <el-form-item label="名称" prop="name">
-        <el-input
-          v-model="queryParams.name"
-          placeholder="请输入名称"
-          clearable
-          @keyup.enter="handleQuery"
-          class="!w-240px"
-        />
-      </el-form-item>
-      <el-form-item label="仓库代码" prop="warehouseCode">
-        <el-input
-          v-model="queryParams.warehouseCode"
-          placeholder="请输入仓库代码"
-          clearable
-          @keyup.enter="handleQuery"
-          class="!w-240px"
-        />
-      </el-form-item>
-      <el-form-item label="区域代码" prop="areaCode">
-        <el-input
-          v-model="queryParams.areaCode"
-          placeholder="请输入区域代码"
-          clearable
-          @keyup.enter="handleQuery"
-          class="!w-240px"
-        />
-      </el-form-item>
-      <el-form-item label="是否可用" prop="available">
-        <el-select
-          v-model="queryParams.available"
-          placeholder="请选择是否可用"
-          clearable
-          class="!w-240px"
-        >
-          <el-option
-            v-for="dict in getIntDictOptions(DICT_TYPE.TRUE_FALSE)"
-            :key="dict.value"
-            :label="dict.label"
-            :value="dict.value"
-          />
-        </el-select>
-      </el-form-item>
-      <el-form-item label="生效时间" prop="activeTime">
-        <el-date-picker
-          v-model="queryParams.activeTime"
-          value-format="YYYY-MM-DD HH:mm:ss"
-          type="daterange"
-          start-placeholder="开始日期"
-          end-placeholder="结束日期"
-          :default-time="[new Date('1 00:00:00'), new Date('1 23:59:59')]"
-          class="!w-240px"
-        />
-      </el-form-item>
-      <el-form-item label="失效时间" prop="expireTime">
-        <el-date-picker
-          v-model="queryParams.expireTime"
-          value-format="YYYY-MM-DD HH:mm:ss"
-          type="daterange"
-          start-placeholder="开始日期"
-          end-placeholder="结束日期"
-          :default-time="[new Date('1 00:00:00'), new Date('1 23:59:59')]"
-          class="!w-240px"
-        />
-      </el-form-item>
-      <el-form-item label="备注" prop="remark">
-        <el-input
-          v-model="queryParams.remark"
-          placeholder="请输入备注"
-          clearable
-          @keyup.enter="handleQuery"
-          class="!w-240px"
-        />
-      </el-form-item>
-      <el-form-item label="创建时间" prop="createTime">
-        <el-date-picker
-          v-model="queryParams.createTime"
-          value-format="YYYY-MM-DD HH:mm:ss"
-          type="daterange"
-          start-placeholder="开始日期"
-          end-placeholder="结束日期"
-          :default-time="[new Date('1 00:00:00'), new Date('1 23:59:59')]"
-          class="!w-240px"
-        />
-      </el-form-item>
-      <el-form-item label="创建者ID" prop="creator">
-        <el-input
-          v-model="queryParams.creator"
-          placeholder="请输入创建者ID"
-          clearable
-          @keyup.enter="handleQuery"
-          class="!w-240px"
-        />
-      </el-form-item>
-      <el-form-item>
-        <el-button type="info" plain  @click="handleQuery"><Icon icon="ep:search" class="mr-5px" /> 搜索</el-button>
-        <el-button type="info" plain  @click="resetQuery"><Icon icon="ep:refresh" class="mr-5px" /> 重置</el-button>
-        <el-button
-          type="primary"
-          @click="openForm('create')"
-          v-hasPermi="['wms:locationgroup:create']"
-        >
-          <Icon icon="ep:plus" class="mr-5px" /> 新增
-        </el-button>
-        <el-button
-          type="success"
-          @click="handleExport"
-          :loading="exportLoading"
-          v-hasPermi="['wms:locationgroup:export']"
-        >
-          <Icon icon="ep:download" class="mr-5px" /> 导出
-        </el-button>
-      </el-form-item>
-    </el-form>
   </ContentWrap>
 
+  <!-- 列表头部 -->
+  <TableHead :HeadButttondata="HeadButttondata" @button-base-click="buttonBaseClick" />
+
   <!-- 列表 -->
   <ContentWrap>
-    <el-table v-loading="loading" :data="list" :stripe="true" :show-overflow-tooltip="true">
+    <Table
-      <el-table-column label="代码" align="center" prop="code" width="150px" />
+      :columns="Locationgroup.allSchemas.tableColumns"
-      <el-table-column label="名称" align="center" prop="name" width="150px" />
+      :data="tableObject.tableList"
-      <el-table-column label="描述" align="center" prop="description" width="150px" />
+      :loading="tableObject.loading"
-      <el-table-column label="仓库代码" align="center" prop="warehouseCode" width="150px" />
+      :pagination="{
-      <el-table-column label="区域代码" align="center" prop="areaCode" width="150px" />
+        total: tableObject.total
-      <el-table-column label="是否可用" align="center" prop="available" width="150px">
+      }"
-        <template #default="scope">
+      v-model:pageSize="tableObject.pageSize"
-          <dict-tag :type="DICT_TYPE.TRUE_FALSE" :value="scope.row.available" />
+      v-model:currentPage="tableObject.currentPage"
-        </template>
+      v-model:sort="tableObject.sort"
-      </el-table-column>
-      <el-table-column
-        label="生效时间"
-        align="center"
-        prop="activeTime"
-        :formatter="dateFormatter"
-        width="150px"
-      />
-      <el-table-column
-        label="失效时间"
-        align="center"
-        prop="expireTime"
-        :formatter="dateFormatter"
-        width="150px"
-      />
-      <el-table-column label="备注" align="center" prop="remark" width="150px" />
-      <el-table-column
-        label="创建时间"
-        align="center"
-        prop="createTime"
-        :formatter="dateFormatter"
-        width="150px"
-      />
-      <el-table-column label="创建者ID" align="center" prop="creator" width="150px" />
-      <el-table-column label="操作" align="center" width="150px"  fixed="right">
-        <template #default="scope">
-          <el-button
-            link
-            type="primary"
-            @click="openForm('update', scope.row.id)"
-            v-hasPermi="['wms:locationgroup:update']"
-          >
-            编辑
-          </el-button>
-          <el-button
-            link
-            type="danger"
-            @click="handleDelete(scope.row.id)"
-            v-hasPermi="['wms:locationgroup:delete']"
     >
-            删除
+      <template #code="{row}">
+        <el-button type="primary" link @click="openDetail(row, '代码', row.code)">
+          <span>{{ row.code }}</span>
         </el-button>
       </template>
-      </el-table-column>
+      <template #action="{ row }">
-    </el-table>
+        <ButtonBase :Butttondata="butttondata" @button-base-click="buttonTableClick($event,row)" />
-    <!-- 分页 -->
+      </template>
-    <Pagination
+    </Table>
-      :total="total"
-      v-model:page="queryParams.pageNo"
-      v-model:limit="queryParams.pageSize"
-      @pagination="getList"
-    />
   </ContentWrap>
 
   <!-- 表单弹窗：添加/修改 -->
-  <LocationgroupForm ref="formRef" @success="getList" />
+  <BasicForm 
+    ref="basicFormRef" 
+    @success="getList" 
+    :rules="LocationgroupRules" 
+    :formAllSchemas="Locationgroup.allSchemas" 
+    searchTableTitle="物料基础信息"
+    :searchTableAllSchemas="ItemBasic.allSchemas"
+    :searchTablePage="ItembasicApi.getItembasicPage"
+    :apiUpdate="LocationgroupApi.updateLocationgroup"
+    :apiCreate="LocationgroupApi.createLocationgroup"
+  />
+
+  <!-- 详情 -->
+  <Detail ref="detailRef" :isBasic="true" :allSchemas="Locationgroup.allSchemas" />
+
+  <!-- 导入 -->
+  <ImportForm ref="importFormRef" url="/wms/locationgroup/import" :importTemplateData="importTemplateData" @success="importSuccess" />
 </template>
 
 <script setup lang="ts">
-import { DICT_TYPE, getIntDictOptions } from '@/utils/dict'
-import { dateFormatter } from '@/utils/formatTime'
 import download from '@/utils/download'
 import * as LocationgroupApi from '@/api/wms/locationgroup'
-import LocationgroupForm from './LocationgroupForm.vue'
+import * as ItembasicApi from '@/api/wms/itembasic'
+import BasicForm from '@/components/BasicForm/src/BasicForm.vue'
+import { Locationgroup, LocationgroupRules, ItemBasic } from '@/utils/disposition/tableColumns'
+import * as defaultButtons from '@/utils/disposition/defaultButtons'
+import TableHead from '@/components/TableHead/src/TableHead.vue' 
+import ImportForm from '@/components/ImportForm/src/ImportForm.vue'
+import Detail from '@/components/Detail/src/Detail.vue'
 
 defineOptions({ name: 'Locationgroup' })
 
 const message = useMessage() // 消息弹窗
 const { t } = useI18n() // 国际化
 
-const loading = ref(true) // 列表的加载中
+const { tableObject, tableMethods } = useTable({
-const total = ref(0) // 列表的总页数
+  getListApi: LocationgroupApi.getLocationgroupPage // 分页接口
-const list = ref([]) // 列表的数据
-const queryParams = reactive({
-  pageNo: 1,
-  pageSize: 10,
-  code: null,
-  name: null,
-  description: null,
-  warehouseCode: null,
-  areaCode: null,
-  available: null,
-  activeTime: [],
-  expireTime: [],
-  remark: null,
-  createTime: [],
-  creator: null
 })
-const queryFormRef = ref() // 搜索的表单
-const exportLoading = ref(false) // 导出的加载中
 
-/** 查询列表 */
+// 获得表格的各种操作
-const getList = async () => {
+const { getList, setSearchParams } = tableMethods
-  loading.value = true
+
-  try {
+// 列表头部按钮
-    const data = await LocationgroupApi.getLocationgroupPage(queryParams)
+const HeadButttondata = [
-    list.value = data.list
+  defaultButtons.defaultAddBtn({hasPermi:'wms:locationgroup:create'}), // 新增
-    total.value = data.total
+  defaultButtons.defaultImportBtn({hasPermi:'wms:locationgroup:import'}), // 导入
-  } finally {
+  defaultButtons.defaultExportBtn({hasPermi:'wms:locationgroup:export'}), // 导出
-    loading.value = false
+  // defaultButtons.defaultFilterBtn(), // 筛选
-  }
+  defaultButtons.defaultFreshBtn(null), // 刷新
-}
+  // {
+  //   label: '自定义扩展按钮',
+  //   name: 'zdy',
+  //   hide: false,
+  //   type: 'primary',
+  //   icon: 'Select',
+  //   color: ''
+  // },
+]
 
-/** 搜索按钮操作 */
+// 头部按钮事件 
-const handleQuery = () => {
+const buttonBaseClick = (val, item) => {
-  queryParams.pageNo = 1
+  if (val == 'add') { // 新增
+    openForm('create')
+  } else if (val == 'import') { // 导入
+    handleImport()
+  } else if (val == 'export') { // 导出
+    handleExport()
+  } else if (val == 'refresh') { // 刷新
     getList()
+  } else if (val == 'filtrate') { // 筛选
+  } else { // 其他按钮 
+    console.log('其他按钮', item)
+  }
 }
 
-/** 重置按钮操作 */
+// 列表-操作按钮
-const resetQuery = () => {
+const butttondata = [
-  queryFormRef.value.resetFields()
+  defaultButtons.mainListEditBtn({hasPermi:'wms:locationgroup:update'}), // 编辑
-  handleQuery()
+  defaultButtons.mainListDeleteBtn({hasPermi:'wms:locationgroup:delete'}), // 删除
+]
+
+// 列表-操作按钮事件 
+const buttonTableClick = async (val, row) => {
+  if (val == 'edit') { // 编辑
+    // const res = await LocationgroupApi.getItempackaging(row.id)
+    openForm('update', row)
+  } else if (val == 'delete') { // 删除
+    handleDelete(row.id)
+  }
 }
 
 /** 添加/修改操作 */
-const formRef = ref()
+const basicFormRef = ref()
-const openForm = (type: string, id?: number) => {
+const openForm = (type: string, row?: any) => {
-  formRef.value.open(type, id)
+  basicFormRef.value.open(type, row)
+}
+
+/** 详情操作 */
+const detailRef = ref()
+const openDetail = (row: any, titleName: any, titleValue: any) => {
+  detailRef.value.openDetail(row, titleName, titleValue)
 }
 
 /** 删除按钮操作 */
@@ -279,13 +149,14 @@ const handleDelete = async (id: number) => {
 }
 
 /** 导出按钮操作 */
+const exportLoading = ref(false) // 导出的加载中
 const handleExport = async () => {
   try {
     // 导出的二次确认
     await message.exportConfirm()
     // 发起导出
     exportLoading.value = true
-    const data = await LocationgroupApi.exportLocationgroup(queryParams)
+    const data = await LocationgroupApi.exportLocationgroup(setSearchParams)
     download.excel(data, '库位组.xls')
   } catch {
   } finally {
@@ -293,6 +164,21 @@ const handleExport = async () => {
   }
 }
 
+/** 导入 */
+const importFormRef = ref()
+const handleImport = () => {
+  importFormRef.value.open()
+}
+// 导入附件弹窗所需的参数
+const importTemplateData = reactive({
+  templateUrl: '',
+  templateTitle: '库位组导入模版.xls'
+})
+// 导入成功之后
+const importSuccess = () => {
+  getList()
+}
+
 /** 初始化 **/
 onMounted(() => {
   getList()

src/views/wms/process/index.vue

@@ -1,280 +1,138 @@
 <template>
   <ContentWrap>
     <!-- 搜索工作栏 -->
-    <el-form
+    <Search :schema="Process.allSchemas.searchSchema" @search="setSearchParams" @reset="setSearchParams" />
-      class="-mb-15px"
-      :model="queryParams"
-      ref="queryFormRef"
-      :inline="true"
-      label-width="68px"
-    >
-      <el-form-item label="代码" prop="code">
-        <el-input
-          v-model="queryParams.code"
-          placeholder="请输入代码"
-          clearable
-          @keyup.enter="handleQuery"
-          class="!w-240px"
-        />
-      </el-form-item>
-      <el-form-item label="名称" prop="name">
-        <el-input
-          v-model="queryParams.name"
-          placeholder="请输入名称"
-          clearable
-          @keyup.enter="handleQuery"
-          class="!w-240px"
-        />
-      </el-form-item>
-      <el-form-item label="类型" prop="type">
-        <el-select v-model="queryParams.type" placeholder="请选择类型" clearable class="!w-240px">
-          <el-option
-            v-for="dict in getStrDictOptions(DICT_TYPE.PROCESS_TYPE)"
-            :key="dict.value"
-            :label="dict.label"
-            :value="dict.value"
-          />
-        </el-select>
-      </el-form-item>
-      <el-form-item label="车间代码" prop="workshopCode">
-        <el-input
-          v-model="queryParams.workshopCode"
-          placeholder="请输入车间代码"
-          clearable
-          @keyup.enter="handleQuery"
-          class="!w-240px"
-        />
-      </el-form-item>
-      <el-form-item label="生产线代码" prop="productionLineCode">
-        <el-input
-          v-model="queryParams.productionLineCode"
-          placeholder="请输入生产线代码"
-          clearable
-          @keyup.enter="handleQuery"
-          class="!w-240px"
-        />
-      </el-form-item>
-      <el-form-item label="是否可用" prop="available">
-        <el-select
-          v-model="queryParams.available"
-          placeholder="请选择是否可用"
-          clearable
-          class="!w-240px"
-        >
-          <el-option
-            v-for="dict in getIntDictOptions(DICT_TYPE.TRUE_FALSE)"
-            :key="dict.value"
-            :label="dict.label"
-            :value="dict.value"
-          />
-        </el-select>
-      </el-form-item>
-      <el-form-item label="生效时间" prop="activeTime">
-        <el-date-picker
-          v-model="queryParams.activeTime"
-          value-format="YYYY-MM-DD HH:mm:ss"
-          type="daterange"
-          start-placeholder="开始日期"
-          end-placeholder="结束日期"
-          :default-time="[new Date('1 00:00:00'), new Date('1 23:59:59')]"
-          class="!w-240px"
-        />
-      </el-form-item>
-      <el-form-item label="失效时间" prop="expireTime">
-        <el-date-picker
-          v-model="queryParams.expireTime"
-          value-format="YYYY-MM-DD HH:mm:ss"
-          type="daterange"
-          start-placeholder="开始日期"
-          end-placeholder="结束日期"
-          :default-time="[new Date('1 00:00:00'), new Date('1 23:59:59')]"
-          class="!w-240px"
-        />
-      </el-form-item>
-      <el-form-item label="备注" prop="remark">
-        <el-input
-          v-model="queryParams.remark"
-          placeholder="请输入备注"
-          clearable
-          @keyup.enter="handleQuery"
-          class="!w-240px"
-        />
-      </el-form-item>
-      <el-form-item label="创建时间" prop="createTime">
-        <el-date-picker
-          v-model="queryParams.createTime"
-          value-format="YYYY-MM-DD HH:mm:ss"
-          type="daterange"
-          start-placeholder="开始日期"
-          end-placeholder="结束日期"
-          :default-time="[new Date('1 00:00:00'), new Date('1 23:59:59')]"
-          class="!w-240px"
-        />
-      </el-form-item>
-      <el-form-item label="创建者ID" prop="creator">
-        <el-input
-          v-model="queryParams.creator"
-          placeholder="请输入创建者ID"
-          clearable
-          @keyup.enter="handleQuery"
-          class="!w-240px"
-        />
-      </el-form-item>
-      <el-form-item>
-        <el-button type="info" plain  @click="handleQuery"><Icon icon="ep:search" class="mr-5px" /> 搜索</el-button>
-        <el-button type="info" plain  @click="resetQuery"><Icon icon="ep:refresh" class="mr-5px" /> 重置</el-button>
-        <el-button type="primary" @click="openForm('create')" v-hasPermi="['wms:process:create']">
-          <Icon icon="ep:plus" class="mr-5px" /> 新增
-        </el-button>
-        <el-button
-          type="success"
-          @click="handleExport"
-          :loading="exportLoading"
-          v-hasPermi="['wms:process:export']"
-        >
-          <Icon icon="ep:download" class="mr-5px" /> 导出
-        </el-button>
-      </el-form-item>
-    </el-form>
   </ContentWrap>
 
+  <!-- 列表头部 -->
+  <TableHead :HeadButttondata="HeadButttondata" @button-base-click="buttonBaseClick" />
+
   <!-- 列表 -->
   <ContentWrap>
-    <el-table v-loading="loading" :data="list" :stripe="true" :show-overflow-tooltip="true">
+    <Table
-      <el-table-column label="代码" align="center" prop="code" width="150px" />
+      :columns="Process.allSchemas.tableColumns"
-      <el-table-column label="名称" align="center" prop="name" width="150px" />
+      :data="tableObject.tableList"
-      <el-table-column label="描述" align="center" prop="description" width="150px" />
+      :loading="tableObject.loading"
-      <el-table-column label="类型" align="center" prop="type" width="150px">
+      :pagination="{
-        <template #default="scope">
+        total: tableObject.total
-          <dict-tag :type="DICT_TYPE.PROCESS_TYPE" :value="scope.row.type" />
+      }"
-        </template>
+      v-model:pageSize="tableObject.pageSize"
-      </el-table-column>
+      v-model:currentPage="tableObject.currentPage"
-      <el-table-column label="车间代码" align="center" prop="workshopCode" width="150px" />
+      v-model:sort="tableObject.sort"
-      <el-table-column label="生产线代码" align="center" prop="productionLineCode" width="150px" />
-      <el-table-column label="是否可用" align="center" prop="available" width="150px">
-        <template #default="scope">
-          <dict-tag :type="DICT_TYPE.TRUE_FALSE" :value="scope.row.available" />
-        </template>
-      </el-table-column>
-      <el-table-column
-        label="生效时间"
-        align="center"
-        prop="activeTime"
-        :formatter="dateFormatter"
-        width="150px"
-      />
-      <el-table-column
-        label="失效时间"
-        align="center"
-        prop="expireTime"
-        :formatter="dateFormatter"
-        width="150px"
-      />
-      <el-table-column label="备注" align="center" prop="remark" width="150px" />
-      <el-table-column
-        label="创建时间"
-        align="center"
-        prop="createTime"
-        :formatter="dateFormatter"
-        width="150px"
-      />
-      <el-table-column label="创建者ID" align="center" prop="creator" width="150px" />
-      <el-table-column label="操作" align="center" width="150px"  fixed="right">
-        <template #default="scope">
-          <el-button
-            link
-            type="primary"
-            @click="openForm('update', scope.row.id)"
-            v-hasPermi="['wms:process:update']"
-          >
-            编辑
-          </el-button>
-          <el-button
-            link
-            type="danger"
-            @click="handleDelete(scope.row.id)"
-            v-hasPermi="['wms:process:delete']"
     >
-            删除
+      <template #code="{row}">
+        <el-button type="primary" link @click="openDetail(row, '代码', row.code)">
+          <span>{{ row.code }}</span>
         </el-button>
       </template>
-      </el-table-column>
+      <template #action="{ row }">
-    </el-table>
+        <ButtonBase :Butttondata="butttondata" @button-base-click="buttonTableClick($event,row)" />
-    <!-- 分页 -->
+      </template>
-    <Pagination
+    </Table>
-      :total="total"
-      v-model:page="queryParams.pageNo"
-      v-model:limit="queryParams.pageSize"
-      @pagination="getList"
-    />
   </ContentWrap>
 
   <!-- 表单弹窗：添加/修改 -->
-  <ProcessForm ref="formRef" @success="getList" />
+  <BasicForm 
+    ref="basicFormRef" 
+    @success="getList" 
+    :rules="ProcessRules" 
+    :formAllSchemas="Process.allSchemas" 
+    searchTableTitle="物料基础信息"
+    :searchTableAllSchemas="ItemBasic.allSchemas"
+    :searchTablePage="ItembasicApi.getItembasicPage"
+    :apiUpdate="ProcessApi.updateProcess"
+    :apiCreate="ProcessApi.createProcess"
+  />
+
+  <!-- 详情 -->
+  <Detail ref="detailRef" :isBasic="true" :allSchemas="Process.allSchemas" />
+
+  <!-- 导入 -->
+  <ImportForm ref="importFormRef" url="/wms/process/import" :importTemplateData="importTemplateData" @success="importSuccess" />
 </template>
 
 <script setup lang="ts">
-import { DICT_TYPE, getStrDictOptions, getIntDictOptions } from '@/utils/dict'
-import { dateFormatter } from '@/utils/formatTime'
 import download from '@/utils/download'
 import * as ProcessApi from '@/api/wms/process'
-import ProcessForm from './ProcessForm.vue'
+import * as ItembasicApi from '@/api/wms/itembasic'
+import BasicForm from '@/components/BasicForm/src/BasicForm.vue'
+import { Process, ProcessRules, ItemBasic } from '@/utils/disposition/tableColumns'
+import * as defaultButtons from '@/utils/disposition/defaultButtons'
+import TableHead from '@/components/TableHead/src/TableHead.vue' 
+import ImportForm from '@/components/ImportForm/src/ImportForm.vue'
+import Detail from '@/components/Detail/src/Detail.vue'
 
 defineOptions({ name: 'Process' })
 
 const message = useMessage() // 消息弹窗
 const { t } = useI18n() // 国际化
 
-const loading = ref(true) // 列表的加载中
+const { tableObject, tableMethods } = useTable({
-const total = ref(0) // 列表的总页数
+  getListApi: ProcessApi.getProcessPage // 分页接口
-const list = ref([]) // 列表的数据
-const queryParams = reactive({
-  pageNo: 1,
-  pageSize: 10,
-  code: null,
-  name: null,
-  description: null,
-  type: null,
-  workshopCode: null,
-  productionLineCode: null,
-  available: null,
-  activeTime: [],
-  expireTime: [],
-  remark: null,
-  createTime: [],
-  creator: null
 })
-const queryFormRef = ref() // 搜索的表单
-const exportLoading = ref(false) // 导出的加载中
 
-/** 查询列表 */
+// 获得表格的各种操作
-const getList = async () => {
+const { getList, setSearchParams } = tableMethods
-  loading.value = true
+
-  try {
+// 列表头部按钮
-    const data = await ProcessApi.getProcessPage(queryParams)
+const HeadButttondata = [
-    list.value = data.list
+  defaultButtons.defaultAddBtn({hasPermi:'wms:process:create'}), // 新增
-    total.value = data.total
+  defaultButtons.defaultImportBtn({hasPermi:'wms:process:import'}), // 导入
-  } finally {
+  defaultButtons.defaultExportBtn({hasPermi:'wms:process:export'}), // 导出
-    loading.value = false
+  // defaultButtons.defaultFilterBtn(), // 筛选
-  }
+  defaultButtons.defaultFreshBtn(null), // 刷新
-}
+  // {
+  //   label: '自定义扩展按钮',
+  //   name: 'zdy',
+  //   hide: false,
+  //   type: 'primary',
+  //   icon: 'Select',
+  //   color: ''
+  // },
+]
 
-/** 搜索按钮操作 */
+// 头部按钮事件 
-const handleQuery = () => {
+const buttonBaseClick = (val, item) => {
-  queryParams.pageNo = 1
+  if (val == 'add') { // 新增
+    openForm('create')
+  } else if (val == 'import') { // 导入
+    handleImport()
+  } else if (val == 'export') { // 导出
+    handleExport()
+  } else if (val == 'refresh') { // 刷新
     getList()
+  } else if (val == 'filtrate') { // 筛选
+  } else { // 其他按钮 
+    console.log('其他按钮', item)
+  }
 }
 
-/** 重置按钮操作 */
+// 列表-操作按钮
-const resetQuery = () => {
+const butttondata = [
-  queryFormRef.value.resetFields()
+  defaultButtons.mainListEditBtn({hasPermi:'wms:process:update'}), // 编辑
-  handleQuery()
+  defaultButtons.mainListDeleteBtn({hasPermi:'wms:process:delete'}), // 删除
+]
+
+// 列表-操作按钮事件 
+const buttonTableClick = async (val, row) => {
+  if (val == 'edit') { // 编辑
+    // const res = await ProcessApi.getItempackaging(row.id)
+    openForm('update', row)
+  } else if (val == 'delete') { // 删除
+    handleDelete(row.id)
+  }
 }
 
 /** 添加/修改操作 */
-const formRef = ref()
+const basicFormRef = ref()
-const openForm = (type: string, id?: number) => {
+const openForm = (type: string, row?: any) => {
-  formRef.value.open(type, id)
+  basicFormRef.value.open(type, row)
+}
+
+/** 详情操作 */
+const detailRef = ref()
+const openDetail = (row: any, titleName: any, titleValue: any) => {
+  detailRef.value.openDetail(row, titleName, titleValue)
 }
 
 /** 删除按钮操作 */
@@ -291,13 +149,14 @@ const handleDelete = async (id: number) => {
 }
 
 /** 导出按钮操作 */
+const exportLoading = ref(false) // 导出的加载中
 const handleExport = async () => {
   try {
     // 导出的二次确认
     await message.exportConfirm()
     // 发起导出
     exportLoading.value = true
-    const data = await ProcessApi.exportProcess(queryParams)
+    const data = await ProcessApi.exportProcess(setSearchParams)
     download.excel(data, '工序.xls')
   } catch {
   } finally {
@@ -305,6 +164,21 @@ const handleExport = async () => {
   }
 }
 
+/** 导入 */
+const importFormRef = ref()
+const handleImport = () => {
+  importFormRef.value.open()
+}
+// 导入附件弹窗所需的参数
+const importTemplateData = reactive({
+  templateUrl: '',
+  templateTitle: '工序导入模版.xls'
+})
+// 导入成功之后
+const importSuccess = () => {
+  getList()
+}
+
 /** 初始化 **/
 onMounted(() => {
   getList()

src/views/wms/productionline/index.vue

@@ -1,295 +1,138 @@
 <template>
   <ContentWrap>
     <!-- 搜索工作栏 -->
-    <el-form
+    <Search :schema="Productionline.allSchemas.searchSchema" @search="setSearchParams" @reset="setSearchParams" />
-      class="-mb-15px"
-      :model="queryParams"
-      ref="queryFormRef"
-      :inline="true"
-      label-width="68px"
-    >
-      <el-form-item label="代码" prop="code">
-        <el-input
-          v-model="queryParams.code"
-          placeholder="请输入代码"
-          clearable
-          @keyup.enter="handleQuery"
-          class="!w-240px"
-        />
-      </el-form-item>
-      <el-form-item label="名称" prop="name">
-        <el-input
-          v-model="queryParams.name"
-          placeholder="请输入名称"
-          clearable
-          @keyup.enter="handleQuery"
-          class="!w-240px"
-        />
-      </el-form-item>
-      <el-form-item label="类型" prop="type">
-        <el-select v-model="queryParams.type" placeholder="请选择类型" clearable class="!w-240px">
-          <el-option
-            v-for="dict in getStrDictOptions(DICT_TYPE.PRODUCTION_LINE_TYPE)"
-            :key="dict.value"
-            :label="dict.label"
-            :value="dict.value"
-          />
-        </el-select>
-      </el-form-item>
-      <el-form-item label="车间代码" prop="workshopCode">
-        <el-input
-          v-model="queryParams.workshopCode"
-          placeholder="请输入车间代码"
-          clearable
-          @keyup.enter="handleQuery"
-          class="!w-240px"
-        />
-      </el-form-item>
-      <el-form-item label="原料库位" prop="rawLocationCode">
-        <el-input
-          v-model="queryParams.rawLocationCode"
-          placeholder="请输入原料库位"
-          clearable
-          @keyup.enter="handleQuery"
-          class="!w-240px"
-        />
-      </el-form-item>
-      <el-form-item label="成品库位" prop="fgLocationCode">
-        <el-input
-          v-model="queryParams.fgLocationCode"
-          placeholder="请输入成品库位"
-          clearable
-          @keyup.enter="handleQuery"
-          class="!w-240px"
-        />
-      </el-form-item>
-      <el-form-item label="是否可用" prop="available">
-        <el-select
-          v-model="queryParams.available"
-          placeholder="请选择是否可用"
-          clearable
-          class="!w-240px"
-        >
-          <el-option
-            v-for="dict in getIntDictOptions(DICT_TYPE.TRUE_FALSE)"
-            :key="dict.value"
-            :label="dict.label"
-            :value="dict.value"
-          />
-        </el-select>
-      </el-form-item>
-      <el-form-item label="生效时间" prop="activeTime">
-        <el-date-picker
-          v-model="queryParams.activeTime"
-          value-format="YYYY-MM-DD HH:mm:ss"
-          type="daterange"
-          start-placeholder="开始日期"
-          end-placeholder="结束日期"
-          :default-time="[new Date('1 00:00:00'), new Date('1 23:59:59')]"
-          class="!w-240px"
-        />
-      </el-form-item>
-      <el-form-item label="失效时间" prop="expireTime">
-        <el-date-picker
-          v-model="queryParams.expireTime"
-          value-format="YYYY-MM-DD HH:mm:ss"
-          type="daterange"
-          start-placeholder="开始日期"
-          end-placeholder="结束日期"
-          :default-time="[new Date('1 00:00:00'), new Date('1 23:59:59')]"
-          class="!w-240px"
-        />
-      </el-form-item>
-      <el-form-item label="备注" prop="remark">
-        <el-input
-          v-model="queryParams.remark"
-          placeholder="请输入备注"
-          clearable
-          @keyup.enter="handleQuery"
-          class="!w-240px"
-        />
-      </el-form-item>
-      <el-form-item label="创建时间" prop="createTime">
-        <el-date-picker
-          v-model="queryParams.createTime"
-          value-format="YYYY-MM-DD HH:mm:ss"
-          type="daterange"
-          start-placeholder="开始日期"
-          end-placeholder="结束日期"
-          :default-time="[new Date('1 00:00:00'), new Date('1 23:59:59')]"
-          class="!w-240px"
-        />
-      </el-form-item>
-      <el-form-item label="创建者ID" prop="creator">
-        <el-input
-          v-model="queryParams.creator"
-          placeholder="请输入创建者ID"
-          clearable
-          @keyup.enter="handleQuery"
-          class="!w-240px"
-        />
-      </el-form-item>
-      <el-form-item>
-        <el-button type="info" plain  @click="handleQuery"><Icon icon="ep:search" class="mr-5px" /> 搜索</el-button>
-        <el-button type="info" plain  @click="resetQuery"><Icon icon="ep:refresh" class="mr-5px" /> 重置</el-button>
-        <el-button
-          type="primary"
-          @click="openForm('create')"
-          v-hasPermi="['wms:productionline:create']"
-        >
-          <Icon icon="ep:plus" class="mr-5px" /> 新增
-        </el-button>
-        <el-button
-          type="success"
-          @click="handleExport"
-          :loading="exportLoading"
-          v-hasPermi="['wms:productionline:export']"
-        >
-          <Icon icon="ep:download" class="mr-5px" /> 导出
-        </el-button>
-      </el-form-item>
-    </el-form>
   </ContentWrap>
 
+  <!-- 列表头部 -->
+  <TableHead :HeadButttondata="HeadButttondata" @button-base-click="buttonBaseClick" />
+
   <!-- 列表 -->
   <ContentWrap>
-    <el-table v-loading="loading" :data="list" :stripe="true" :show-overflow-tooltip="true">
+    <Table
-      <el-table-column label="代码" align="center" prop="code" width="150px" />
+      :columns="Productionline.allSchemas.tableColumns"
-      <el-table-column label="名称" align="center" prop="name" width="150px" />
+      :data="tableObject.tableList"
-      <el-table-column label="描述" align="center" prop="description" width="150px" />
+      :loading="tableObject.loading"
-      <el-table-column label="类型" align="center" prop="type" width="150px">
+      :pagination="{
-        <template #default="scope">
+        total: tableObject.total
-          <dict-tag :type="DICT_TYPE.PRODUCTION_LINE_TYPE" :value="scope.row.type" />
+      }"
-        </template>
+      v-model:pageSize="tableObject.pageSize"
-      </el-table-column>
+      v-model:currentPage="tableObject.currentPage"
-      <el-table-column label="车间代码" align="center" prop="workshopCode" width="150px" />
+      v-model:sort="tableObject.sort"
-      <el-table-column label="原料库位" align="center" prop="rawLocationCode" width="150px" />
-      <el-table-column label="成品库位" align="center" prop="fgLocationCode" width="150px" />
-      <el-table-column label="是否可用" align="center" prop="available" width="150px">
-        <template #default="scope">
-          <dict-tag :type="DICT_TYPE.TRUE_FALSE" :value="scope.row.available" />
-        </template>
-      </el-table-column>
-      <el-table-column
-        label="生效时间"
-        align="center"
-        prop="activeTime"
-        :formatter="dateFormatter"
-        width="150px"
-      />
-      <el-table-column
-        label="失效时间"
-        align="center"
-        prop="expireTime"
-        :formatter="dateFormatter"
-        width="150px"
-      />
-      <el-table-column label="备注" align="center" prop="remark" width="150px" />
-      <el-table-column
-        label="创建时间"
-        align="center"
-        prop="createTime"
-        :formatter="dateFormatter"
-        width="150px"
-      />
-      <el-table-column label="创建者ID" align="center" prop="creator" width="150px" />
-      <el-table-column label="操作" align="center" width="150px"  fixed="right">
-        <template #default="scope">
-          <el-button
-            link
-            type="primary"
-            @click="openForm('update', scope.row.id)"
-            v-hasPermi="['wms:productionline:update']"
     >
-            编辑
+      <template #code="{row}">
-          </el-button>
+        <el-button type="primary" link @click="openDetail(row, '代码', row.code)">
-          <el-button
+          <span>{{ row.code }}</span>
-            link
-            type="danger"
-            @click="handleDelete(scope.row.id)"
-            v-hasPermi="['wms:productionline:delete']"
-          >
-            删除
         </el-button>
       </template>
-      </el-table-column>
+      <template #action="{ row }">
-    </el-table>
+        <ButtonBase :Butttondata="butttondata" @button-base-click="buttonTableClick($event,row)" />
-    <!-- 分页 -->
+      </template>
-    <Pagination
+    </Table>
-      :total="total"
-      v-model:page="queryParams.pageNo"
-      v-model:limit="queryParams.pageSize"
-      @pagination="getList"
-    />
   </ContentWrap>
 
   <!-- 表单弹窗：添加/修改 -->
-  <ProductionlineForm ref="formRef" @success="getList" />
+  <BasicForm 
+    ref="basicFormRef" 
+    @success="getList" 
+    :rules="ProductionlineRules" 
+    :formAllSchemas="Productionline.allSchemas" 
+    searchTableTitle="物料基础信息"
+    :searchTableAllSchemas="ItemBasic.allSchemas"
+    :searchTablePage="ItembasicApi.getItembasicPage"
+    :apiUpdate="ProductionlineApi.updateProductionline"
+    :apiCreate="ProductionlineApi.createProductionline"
+  />
+
+  <!-- 详情 -->
+  <Detail ref="detailRef" :isBasic="true" :allSchemas="Productionline.allSchemas" />
+
+  <!-- 导入 -->
+  <ImportForm ref="importFormRef" url="/wms/productionline/import" :importTemplateData="importTemplateData" @success="importSuccess" />
 </template>
 
 <script setup lang="ts">
-import { DICT_TYPE, getStrDictOptions, getIntDictOptions } from '@/utils/dict'
-import { dateFormatter } from '@/utils/formatTime'
 import download from '@/utils/download'
 import * as ProductionlineApi from '@/api/wms/productionline'
-import ProductionlineForm from './ProductionlineForm.vue'
+import * as ItembasicApi from '@/api/wms/itembasic'
+import BasicForm from '@/components/BasicForm/src/BasicForm.vue'
+import { Productionline, ProductionlineRules, ItemBasic } from '@/utils/disposition/tableColumns'
+import * as defaultButtons from '@/utils/disposition/defaultButtons'
+import TableHead from '@/components/TableHead/src/TableHead.vue' 
+import ImportForm from '@/components/ImportForm/src/ImportForm.vue'
+import Detail from '@/components/Detail/src/Detail.vue'
 
 defineOptions({ name: 'Productionline' })
 
 const message = useMessage() // 消息弹窗
 const { t } = useI18n() // 国际化
 
-const loading = ref(true) // 列表的加载中
+const { tableObject, tableMethods } = useTable({
-const total = ref(0) // 列表的总页数
+  getListApi: ProductionlineApi.getProductionlinePage // 分页接口
-const list = ref([]) // 列表的数据
-const queryParams = reactive({
-  pageNo: 1,
-  pageSize: 10,
-  code: null,
-  name: null,
-  description: null,
-  type: null,
-  workshopCode: null,
-  rawLocationCode: null,
-  fgLocationCode: null,
-  available: null,
-  activeTime: [],
-  expireTime: [],
-  remark: null,
-  createTime: [],
-  creator: null
 })
-const queryFormRef = ref() // 搜索的表单
-const exportLoading = ref(false) // 导出的加载中
 
-/** 查询列表 */
+// 获得表格的各种操作
-const getList = async () => {
+const { getList, setSearchParams } = tableMethods
-  loading.value = true
-  try {
-    const data = await ProductionlineApi.getProductionlinePage(queryParams)
-    list.value = data.list
-    total.value = data.total
-  } finally {
-    loading.value = false
-  }
-}
 
-/** 搜索按钮操作 */
+// 列表头部按钮
-const handleQuery = () => {
+const HeadButttondata = [
-  queryParams.pageNo = 1
+  defaultButtons.defaultAddBtn({hasPermi:'wms:productionline:create'}), // 新增
+  defaultButtons.defaultImportBtn({hasPermi:'wms:productionline:import'}), // 导入
+  defaultButtons.defaultExportBtn({hasPermi:'wms:productionline:export'}), // 导出
+  // defaultButtons.defaultFilterBtn(), // 筛选
+  defaultButtons.defaultFreshBtn(null), // 刷新
+  // {
+  //   label: '自定义扩展按钮',
+  //   name: 'zdy',
+  //   hide: false,
+  //   type: 'primary',
+  //   icon: 'Select',
+  //   color: ''
+  // },
+]
+
+// 头部按钮事件 
+const buttonBaseClick = (val, item) => {
+  if (val == 'add') { // 新增
+    openForm('create')
+  } else if (val == 'import') { // 导入
+    handleImport()
+  } else if (val == 'export') { // 导出
+    handleExport()
+  } else if (val == 'refresh') { // 刷新
     getList()
+  } else if (val == 'filtrate') { // 筛选
+  } else { // 其他按钮 
+    console.log('其他按钮', item)
+  }
 }
 
-/** 重置按钮操作 */
+// 列表-操作按钮
-const resetQuery = () => {
+const butttondata = [
-  queryFormRef.value.resetFields()
+  defaultButtons.mainListEditBtn({hasPermi:'wms:productionline:update'}), // 编辑
-  handleQuery()
+  defaultButtons.mainListDeleteBtn({hasPermi:'wms:productionline:delete'}), // 删除
+]
+
+// 列表-操作按钮事件 
+const buttonTableClick = async (val, row) => {
+  if (val == 'edit') { // 编辑
+    // const res = await ProductionlineApi.getItempackaging(row.id)
+    openForm('update', row)
+  } else if (val == 'delete') { // 删除
+    handleDelete(row.id)
+  }
 }
 
 /** 添加/修改操作 */
-const formRef = ref()
+const basicFormRef = ref()
-const openForm = (type: string, id?: number) => {
+const openForm = (type: string, row?: any) => {
-  formRef.value.open(type, id)
+  basicFormRef.value.open(type, row)
+}
+
+/** 详情操作 */
+const detailRef = ref()
+const openDetail = (row: any, titleName: any, titleValue: any) => {
+  detailRef.value.openDetail(row, titleName, titleValue)
 }
 
 /** 删除按钮操作 */
@@ -306,13 +149,14 @@ const handleDelete = async (id: number) => {
 }
 
 /** 导出按钮操作 */
+const exportLoading = ref(false) // 导出的加载中
 const handleExport = async () => {
   try {
     // 导出的二次确认
     await message.exportConfirm()
     // 发起导出
     exportLoading.value = true
-    const data = await ProductionlineApi.exportProductionline(queryParams)
+    const data = await ProductionlineApi.exportProductionline(setSearchParams)
     download.excel(data, '生产线.xls')
   } catch {
   } finally {
@@ -320,6 +164,21 @@ const handleExport = async () => {
   }
 }
 
+/** 导入 */
+const importFormRef = ref()
+const handleImport = () => {
+  importFormRef.value.open()
+}
+// 导入附件弹窗所需的参数
+const importTemplateData = reactive({
+  templateUrl: '',
+  templateTitle: '生产线导入模版.xls'
+})
+// 导入成功之后
+const importSuccess = () => {
+  getList()
+}
+
 /** 初始化 **/
 onMounted(() => {
   getList()

src/views/wms/productionlineitem/index.vue

@@ -1,255 +1,138 @@
 <template>
   <ContentWrap>
     <!-- 搜索工作栏 -->
-    <el-form
+    <Search :schema="Productionlineitem.allSchemas.searchSchema" @search="setSearchParams" @reset="setSearchParams" />
-      class="-mb-15px"
-      :model="queryParams"
-      ref="queryFormRef"
-      :inline="true"
-      label-width="68px"
-    >
-      <el-form-item label="完工收货库位" prop="fgLocationCode">
-        <el-input
-          v-model="queryParams.fgLocationCode"
-          placeholder="请输入完工收货库位"
-          clearable
-          @keyup.enter="handleQuery"
-          class="!w-240px"
-        />
-      </el-form-item>
-      <el-form-item label="产线代码" prop="productionLineCode">
-        <el-input
-          v-model="queryParams.productionLineCode"
-          placeholder="请输入产线代码"
-          clearable
-          @keyup.enter="handleQuery"
-          class="!w-240px"
-        />
-      </el-form-item>
-      <el-form-item label="物品代码" prop="itemCode">
-        <el-input
-          v-model="queryParams.itemCode"
-          placeholder="请输入物品代码"
-          clearable
-          @keyup.enter="handleQuery"
-          class="!w-240px"
-        />
-      </el-form-item>
-      <el-form-item label="是否可用" prop="available">
-        <el-select
-          v-model="queryParams.available"
-          placeholder="请选择是否可用"
-          clearable
-          class="!w-240px"
-        >
-          <el-option
-            v-for="dict in getIntDictOptions(DICT_TYPE.TRUE_FALSE)"
-            :key="dict.value"
-            :label="dict.label"
-            :value="dict.value"
-          />
-        </el-select>
-      </el-form-item>
-      <el-form-item label="生效时间" prop="activeTime">
-        <el-date-picker
-          v-model="queryParams.activeTime"
-          value-format="YYYY-MM-DD HH:mm:ss"
-          type="daterange"
-          start-placeholder="开始日期"
-          end-placeholder="结束日期"
-          :default-time="[new Date('1 00:00:00'), new Date('1 23:59:59')]"
-          class="!w-240px"
-        />
-      </el-form-item>
-      <el-form-item label="失效时间" prop="expireTime">
-        <el-date-picker
-          v-model="queryParams.expireTime"
-          value-format="YYYY-MM-DD HH:mm:ss"
-          type="daterange"
-          start-placeholder="开始日期"
-          end-placeholder="结束日期"
-          :default-time="[new Date('1 00:00:00'), new Date('1 23:59:59')]"
-          class="!w-240px"
-        />
-      </el-form-item>
-      <el-form-item label="备注" prop="remark">
-        <el-input
-          v-model="queryParams.remark"
-          placeholder="请输入备注"
-          clearable
-          @keyup.enter="handleQuery"
-          class="!w-240px"
-        />
-      </el-form-item>
-      <el-form-item label="创建时间" prop="createTime">
-        <el-date-picker
-          v-model="queryParams.createTime"
-          value-format="YYYY-MM-DD HH:mm:ss"
-          type="daterange"
-          start-placeholder="开始日期"
-          end-placeholder="结束日期"
-          :default-time="[new Date('1 00:00:00'), new Date('1 23:59:59')]"
-          class="!w-240px"
-        />
-      </el-form-item>
-      <el-form-item label="创建者ID" prop="creator">
-        <el-input
-          v-model="queryParams.creator"
-          placeholder="请输入创建者ID"
-          clearable
-          @keyup.enter="handleQuery"
-          class="!w-240px"
-        />
-      </el-form-item>
-      <el-form-item>
-        <el-button type="info" plain  @click="handleQuery"><Icon icon="ep:search" class="mr-5px" /> 搜索</el-button>
-        <el-button type="info" plain  @click="resetQuery"><Icon icon="ep:refresh" class="mr-5px" /> 重置</el-button>
-        <el-button
-          type="primary"
-          @click="openForm('create')"
-          v-hasPermi="['wms:productionlineitem:create']"
-        >
-          <Icon icon="ep:plus" class="mr-5px" /> 新增
-        </el-button>
-        <el-button
-          type="success"
-          @click="handleExport"
-          :loading="exportLoading"
-          v-hasPermi="['wms:productionlineitem:export']"
-        >
-          <Icon icon="ep:download" class="mr-5px" /> 导出
-        </el-button>
-      </el-form-item>
-    </el-form>
   </ContentWrap>
 
+  <!-- 列表头部 -->
+  <TableHead :HeadButttondata="HeadButttondata" @button-base-click="buttonBaseClick" />
+
   <!-- 列表 -->
   <ContentWrap>
-    <el-table v-loading="loading" :data="list" :stripe="true" :show-overflow-tooltip="true">
+    <Table
-      <el-table-column label="完工收货库位" align="center" prop="fgLocationCode" width="150px" />
+      :columns="Productionlineitem.allSchemas.tableColumns"
-      <el-table-column label="产线代码" align="center" prop="productionLineCode" width="150px" />
+      :data="tableObject.tableList"
-      <el-table-column label="物品代码" align="center" prop="itemCode" width="150px" />
+      :loading="tableObject.loading"
-      <el-table-column label="是否可用" align="center" prop="available" width="150px">
+      :pagination="{
-        <template #default="scope">
+        total: tableObject.total
-          <dict-tag :type="DICT_TYPE.TRUE_FALSE" :value="scope.row.available" />
+      }"
-        </template>
+      v-model:pageSize="tableObject.pageSize"
-      </el-table-column>
+      v-model:currentPage="tableObject.currentPage"
-      <el-table-column
+      v-model:sort="tableObject.sort"
-        label="生效时间"
-        align="center"
-        prop="activeTime"
-        :formatter="dateFormatter"
-        width="150px"
-      />
-      <el-table-column
-        label="失效时间"
-        align="center"
-        prop="expireTime"
-        :formatter="dateFormatter"
-        width="150px"
-      />
-      <el-table-column label="备注" align="center" prop="remark" width="150px" />
-      <el-table-column
-        label="创建时间"
-        align="center"
-        prop="createTime"
-        :formatter="dateFormatter"
-        width="150px"
-      />
-      <el-table-column label="创建者ID" align="center" prop="creator" width="150px" />
-      <el-table-column label="操作" align="center" width="150px"  fixed="right">
-        <template #default="scope">
-          <el-button
-            link
-            type="primary"
-            @click="openForm('update', scope.row.id)"
-            v-hasPermi="['wms:productionlineitem:update']"
-          >
-            编辑
-          </el-button>
-          <el-button
-            link
-            type="danger"
-            @click="handleDelete(scope.row.id)"
-            v-hasPermi="['wms:productionlineitem:delete']"
     >
-            删除
+      <template #fgLocationCode="{row}">
+        <el-button type="primary" link @click="openDetail(row, '完工收货库位', row.fgLocationCode)">
+          <span>{{ row.fgLocationCode }}</span>
         </el-button>
       </template>
-      </el-table-column>
+      <template #action="{ row }">
-    </el-table>
+        <ButtonBase :Butttondata="butttondata" @button-base-click="buttonTableClick($event,row)" />
-    <!-- 分页 -->
+      </template>
-    <Pagination
+    </Table>
-      :total="total"
-      v-model:page="queryParams.pageNo"
-      v-model:limit="queryParams.pageSize"
-      @pagination="getList"
-    />
   </ContentWrap>
 
   <!-- 表单弹窗：添加/修改 -->
-  <ProductionlineitemForm ref="formRef" @success="getList" />
+  <BasicForm 
+    ref="basicFormRef" 
+    @success="getList" 
+    :rules="ProductionlineitemRules" 
+    :formAllSchemas="Productionlineitem.allSchemas" 
+    searchTableTitle="物料基础信息"
+    :searchTableAllSchemas="ItemBasic.allSchemas"
+    :searchTablePage="ItembasicApi.getItembasicPage"
+    :apiUpdate="ProductionlineitemApi.updateProductionlineitem"
+    :apiCreate="ProductionlineitemApi.createProductionlineitem"
+  />
+
+  <!-- 详情 -->
+  <Detail ref="detailRef" :isBasic="true" :allSchemas="Productionlineitem.allSchemas" />
+
+  <!-- 导入 -->
+  <ImportForm ref="importFormRef" url="/wms/productionlineitem/import" :importTemplateData="importTemplateData" @success="importSuccess" />
 </template>
 
 <script setup lang="ts">
-import { DICT_TYPE, getIntDictOptions } from '@/utils/dict'
-import { dateFormatter } from '@/utils/formatTime'
 import download from '@/utils/download'
 import * as ProductionlineitemApi from '@/api/wms/productionlineitem'
-import ProductionlineitemForm from './ProductionlineitemForm.vue'
+import * as ItembasicApi from '@/api/wms/itembasic'
+import BasicForm from '@/components/BasicForm/src/BasicForm.vue'
+import { Productionlineitem, ProductionlineitemRules, ItemBasic } from '@/utils/disposition/tableColumns'
+import * as defaultButtons from '@/utils/disposition/defaultButtons'
+import TableHead from '@/components/TableHead/src/TableHead.vue' 
+import ImportForm from '@/components/ImportForm/src/ImportForm.vue'
+import Detail from '@/components/Detail/src/Detail.vue'
 
 defineOptions({ name: 'Productionlineitem' })
 
 const message = useMessage() // 消息弹窗
 const { t } = useI18n() // 国际化
 
-const loading = ref(true) // 列表的加载中
+const { tableObject, tableMethods } = useTable({
-const total = ref(0) // 列表的总页数
+  getListApi: ProductionlineitemApi.getProductionlineitemPage // 分页接口
-const list = ref([]) // 列表的数据
-const queryParams = reactive({
-  pageNo: 1,
-  pageSize: 10,
-  fgLocationCode: null,
-  productionLineCode: null,
-  itemCode: null,
-  available: null,
-  activeTime: [],
-  expireTime: [],
-  remark: null,
-  createTime: [],
-  creator: null
 })
-const queryFormRef = ref() // 搜索的表单
-const exportLoading = ref(false) // 导出的加载中
 
-/** 查询列表 */
+// 获得表格的各种操作
-const getList = async () => {
+const { getList, setSearchParams } = tableMethods
-  loading.value = true
+
-  try {
+// 列表头部按钮
-    const data = await ProductionlineitemApi.getProductionlineitemPage(queryParams)
+const HeadButttondata = [
-    list.value = data.list
+  defaultButtons.defaultAddBtn({hasPermi:'wms:productionlineitem:create'}), // 新增
-    total.value = data.total
+  defaultButtons.defaultImportBtn({hasPermi:'wms:productionlineitem:import'}), // 导入
-  } finally {
+  defaultButtons.defaultExportBtn({hasPermi:'wms:productionlineitem:export'}), // 导出
-    loading.value = false
+  // defaultButtons.defaultFilterBtn(), // 筛选
-  }
+  defaultButtons.defaultFreshBtn(null), // 刷新
-}
+  // {
+  //   label: '自定义扩展按钮',
+  //   name: 'zdy',
+  //   hide: false,
+  //   type: 'primary',
+  //   icon: 'Select',
+  //   color: ''
+  // },
+]
 
-/** 搜索按钮操作 */
+// 头部按钮事件 
-const handleQuery = () => {
+const buttonBaseClick = (val, item) => {
-  queryParams.pageNo = 1
+  if (val == 'add') { // 新增
+    openForm('create')
+  } else if (val == 'import') { // 导入
+    handleImport()
+  } else if (val == 'export') { // 导出
+    handleExport()
+  } else if (val == 'refresh') { // 刷新
     getList()
+  } else if (val == 'filtrate') { // 筛选
+  } else { // 其他按钮 
+    console.log('其他按钮', item)
+  }
 }
 
-/** 重置按钮操作 */
+// 列表-操作按钮
-const resetQuery = () => {
+const butttondata = [
-  queryFormRef.value.resetFields()
+  defaultButtons.mainListEditBtn({hasPermi:'wms:productionlineitem:update'}), // 编辑
-  handleQuery()
+  defaultButtons.mainListDeleteBtn({hasPermi:'wms:productionlineitem:delete'}), // 删除
+]
+
+// 列表-操作按钮事件 
+const buttonTableClick = async (val, row) => {
+  if (val == 'edit') { // 编辑
+    // const res = await ProductionlineitemApi.getItempackaging(row.id)
+    openForm('update', row)
+  } else if (val == 'delete') { // 删除
+    handleDelete(row.id)
+  }
 }
 
 /** 添加/修改操作 */
-const formRef = ref()
+const basicFormRef = ref()
-const openForm = (type: string, id?: number) => {
+const openForm = (type: string, row?: any) => {
-  formRef.value.open(type, id)
+  basicFormRef.value.open(type, row)
+}
+
+/** 详情操作 */
+const detailRef = ref()
+const openDetail = (row: any, titleName: any, titleValue: any) => {
+  detailRef.value.openDetail(row, titleName, titleValue)
 }
 
 /** 删除按钮操作 */
@@ -266,13 +149,14 @@ const handleDelete = async (id: number) => {
 }
 
 /** 导出按钮操作 */
+const exportLoading = ref(false) // 导出的加载中
 const handleExport = async () => {
   try {
     // 导出的二次确认
     await message.exportConfirm()
     // 发起导出
     exportLoading.value = true
-    const data = await ProductionlineitemApi.exportProductionlineitem(queryParams)
+    const data = await ProductionlineitemApi.exportProductionlineitem(setSearchParams)
     download.excel(data, '生产线物料关系.xls')
   } catch {
   } finally {
@@ -280,6 +164,21 @@ const handleExport = async () => {
   }
 }
 
+/** 导入 */
+const importFormRef = ref()
+const handleImport = () => {
+  importFormRef.value.open()
+}
+// 导入附件弹窗所需的参数
+const importTemplateData = reactive({
+  templateUrl: '',
+  templateTitle: '生产线物料关系导入模版.xls'
+})
+// 导入成功之后
+const importSuccess = () => {
+  getList()
+}
+
 /** 初始化 **/
 onMounted(() => {
   getList()

src/views/wms/project/index.vue

@@ -1,253 +1,138 @@
 <template>
   <ContentWrap>
     <!-- 搜索工作栏 -->
-    <el-form
+    <Search :schema="Project.allSchemas.searchSchema" @search="setSearchParams" @reset="setSearchParams" />
-      class="-mb-15px"
-      :model="queryParams"
-      ref="queryFormRef"
-      :inline="true"
-      label-width="68px"
-    >
-      <el-form-item label="代码" prop="code">
-        <el-input
-          v-model="queryParams.code"
-          placeholder="请输入代码"
-          clearable
-          @keyup.enter="handleQuery"
-          class="!w-240px"
-        />
-      </el-form-item>
-      <el-form-item label="名称" prop="name">
-        <el-input
-          v-model="queryParams.name"
-          placeholder="请输入名称"
-          clearable
-          @keyup.enter="handleQuery"
-          class="!w-240px"
-        />
-      </el-form-item>
-      <el-form-item label="客户代码" prop="customerCode">
-        <el-input
-          v-model="queryParams.customerCode"
-          placeholder="请输入客户代码"
-          clearable
-          @keyup.enter="handleQuery"
-          class="!w-240px"
-        />
-      </el-form-item>
-      <el-form-item label="是否可用" prop="available">
-        <el-select
-          v-model="queryParams.available"
-          placeholder="请选择是否可用"
-          clearable
-          class="!w-240px"
-        >
-          <el-option
-            v-for="dict in getIntDictOptions(DICT_TYPE.TRUE_FALSE)"
-            :key="dict.value"
-            :label="dict.label"
-            :value="dict.value"
-          />
-        </el-select>
-      </el-form-item>
-      <el-form-item label="生效时间" prop="activeTime">
-        <el-date-picker
-          v-model="queryParams.activeTime"
-          value-format="YYYY-MM-DD HH:mm:ss"
-          type="daterange"
-          start-placeholder="开始日期"
-          end-placeholder="结束日期"
-          :default-time="[new Date('1 00:00:00'), new Date('1 23:59:59')]"
-          class="!w-240px"
-        />
-      </el-form-item>
-      <el-form-item label="失效时间" prop="expireTime">
-        <el-date-picker
-          v-model="queryParams.expireTime"
-          value-format="YYYY-MM-DD HH:mm:ss"
-          type="daterange"
-          start-placeholder="开始日期"
-          end-placeholder="结束日期"
-          :default-time="[new Date('1 00:00:00'), new Date('1 23:59:59')]"
-          class="!w-240px"
-        />
-      </el-form-item>
-      <el-form-item label="备注" prop="remark">
-        <el-input
-          v-model="queryParams.remark"
-          placeholder="请输入备注"
-          clearable
-          @keyup.enter="handleQuery"
-          class="!w-240px"
-        />
-      </el-form-item>
-      <el-form-item label="创建时间" prop="createTime">
-        <el-date-picker
-          v-model="queryParams.createTime"
-          value-format="YYYY-MM-DD HH:mm:ss"
-          type="daterange"
-          start-placeholder="开始日期"
-          end-placeholder="结束日期"
-          :default-time="[new Date('1 00:00:00'), new Date('1 23:59:59')]"
-          class="!w-240px"
-        />
-      </el-form-item>
-      <el-form-item label="创建者ID" prop="creator">
-        <el-input
-          v-model="queryParams.creator"
-          placeholder="请输入创建者ID"
-          clearable
-          @keyup.enter="handleQuery"
-          class="!w-240px"
-        />
-      </el-form-item>
-      <el-form-item>
-        <el-button type="info" plain  @click="handleQuery"><Icon icon="ep:search" class="mr-5px" /> 搜索</el-button>
-        <el-button type="info" plain  @click="resetQuery"><Icon icon="ep:refresh" class="mr-5px" /> 重置</el-button>
-        <el-button type="primary" @click="openForm('create')" v-hasPermi="['wms:project:create']">
-          <Icon icon="ep:plus" class="mr-5px" /> 新增
-        </el-button>
-        <el-button
-          type="success"
-          @click="handleExport"
-          :loading="exportLoading"
-          v-hasPermi="['wms:project:export']"
-        >
-          <Icon icon="ep:download" class="mr-5px" /> 导出
-        </el-button>
-      </el-form-item>
-    </el-form>
   </ContentWrap>
 
+  <!-- 列表头部 -->
+  <TableHead :HeadButttondata="HeadButttondata" @button-base-click="buttonBaseClick" />
+
   <!-- 列表 -->
   <ContentWrap>
-    <el-table v-loading="loading" :data="list" :stripe="true" :show-overflow-tooltip="true">
+    <Table
-      <el-table-column label="代码" align="center" prop="code" width="150px" />
+      :columns="Project.allSchemas.tableColumns"
-      <el-table-column label="名称" align="center" prop="name" width="150px" />
+      :data="tableObject.tableList"
-      <el-table-column label="描述" align="center" prop="description" width="150px" />
+      :loading="tableObject.loading"
-      <el-table-column label="客户代码" align="center" prop="customerCode" width="150px" />
+      :pagination="{
-      <el-table-column label="是否可用" align="center" prop="available" width="150px">
+        total: tableObject.total
-        <template #default="scope">
+      }"
-          <dict-tag :type="DICT_TYPE.TRUE_FALSE" :value="scope.row.available" />
+      v-model:pageSize="tableObject.pageSize"
-        </template>
+      v-model:currentPage="tableObject.currentPage"
-      </el-table-column>
+      v-model:sort="tableObject.sort"
-      <el-table-column
-        label="生效时间"
-        align="center"
-        prop="activeTime"
-        :formatter="dateFormatter"
-        width="150px"
-      />
-      <el-table-column
-        label="失效时间"
-        align="center"
-        prop="expireTime"
-        :formatter="dateFormatter"
-        width="150px"
-      />
-      <el-table-column label="备注" align="center" prop="remark" width="150px" />
-      <el-table-column
-        label="创建时间"
-        align="center"
-        prop="createTime"
-        :formatter="dateFormatter"
-        width="150px"
-      />
-      <el-table-column label="创建者ID" align="center" prop="creator" width="150px" />
-      <el-table-column label="操作" align="center" width="150px"  fixed="right">
-        <template #default="scope">
-          <el-button
-            link
-            type="primary"
-            @click="openForm('update', scope.row.id)"
-            v-hasPermi="['wms:project:update']"
     >
-            编辑
+      <template #code="{row}">
-          </el-button>
+        <el-button type="primary" link @click="openDetail(row, '代码', row.code)">
-          <el-button
+          <span>{{ row.code }}</span>
-            link
-            type="danger"
-            @click="handleDelete(scope.row.id)"
-            v-hasPermi="['wms:project:delete']"
-          >
-            删除
         </el-button>
       </template>
-      </el-table-column>
+      <template #action="{ row }">
-    </el-table>
+        <ButtonBase :Butttondata="butttondata" @button-base-click="buttonTableClick($event,row)" />
-    <!-- 分页 -->
+      </template>
-    <Pagination
+    </Table>
-      :total="total"
-      v-model:page="queryParams.pageNo"
-      v-model:limit="queryParams.pageSize"
-      @pagination="getList"
-    />
   </ContentWrap>
 
   <!-- 表单弹窗：添加/修改 -->
-  <ProjectForm ref="formRef" @success="getList" />
+  <BasicForm 
+    ref="basicFormRef" 
+    @success="getList" 
+    :rules="ProjectRules" 
+    :formAllSchemas="Project.allSchemas" 
+    searchTableTitle="物料基础信息"
+    :searchTableAllSchemas="ItemBasic.allSchemas"
+    :searchTablePage="ItembasicApi.getItembasicPage"
+    :apiUpdate="ProjectApi.updateProject"
+    :apiCreate="ProjectApi.createProject"
+  />
+
+  <!-- 详情 -->
+  <Detail ref="detailRef" :isBasic="true" :allSchemas="Project.allSchemas" />
+
+  <!-- 导入 -->
+  <ImportForm ref="importFormRef" url="/wms/project/import" :importTemplateData="importTemplateData" @success="importSuccess" />
 </template>
 
 <script setup lang="ts">
-import { DICT_TYPE, getIntDictOptions } from '@/utils/dict'
-import { dateFormatter } from '@/utils/formatTime'
 import download from '@/utils/download'
 import * as ProjectApi from '@/api/wms/project'
-import ProjectForm from './ProjectForm.vue'
+import * as ItembasicApi from '@/api/wms/itembasic'
+import BasicForm from '@/components/BasicForm/src/BasicForm.vue'
+import { Project, ProjectRules, ItemBasic } from '@/utils/disposition/tableColumns'
+import * as defaultButtons from '@/utils/disposition/defaultButtons'
+import TableHead from '@/components/TableHead/src/TableHead.vue' 
+import ImportForm from '@/components/ImportForm/src/ImportForm.vue'
+import Detail from '@/components/Detail/src/Detail.vue'
 
 defineOptions({ name: 'Project' })
 
 const message = useMessage() // 消息弹窗
 const { t } = useI18n() // 国际化
 
-const loading = ref(true) // 列表的加载中
+const { tableObject, tableMethods } = useTable({
-const total = ref(0) // 列表的总页数
+  getListApi: ProjectApi.getProjectPage // 分页接口
-const list = ref([]) // 列表的数据
-const queryParams = reactive({
-  pageNo: 1,
-  pageSize: 10,
-  code: null,
-  name: null,
-  description: null,
-  customerCode: null,
-  available: null,
-  activeTime: [],
-  expireTime: [],
-  remark: null,
-  createTime: [],
-  creator: null
 })
-const queryFormRef = ref() // 搜索的表单
-const exportLoading = ref(false) // 导出的加载中
 
-/** 查询列表 */
+// 获得表格的各种操作
-const getList = async () => {
+const { getList, setSearchParams } = tableMethods
-  loading.value = true
-  try {
-    const data = await ProjectApi.getProjectPage(queryParams)
-    list.value = data.list
-    total.value = data.total
-  } finally {
-    loading.value = false
-  }
-}
 
-/** 搜索按钮操作 */
+// 列表头部按钮
-const handleQuery = () => {
+const HeadButttondata = [
-  queryParams.pageNo = 1
+  defaultButtons.defaultAddBtn({hasPermi:'wms:project:create'}), // 新增
+  defaultButtons.defaultImportBtn({hasPermi:'wms:project:import'}), // 导入
+  defaultButtons.defaultExportBtn({hasPermi:'wms:project:export'}), // 导出
+  // defaultButtons.defaultFilterBtn(), // 筛选
+  defaultButtons.defaultFreshBtn(null), // 刷新
+  // {
+  //   label: '自定义扩展按钮',
+  //   name: 'zdy',
+  //   hide: false,
+  //   type: 'primary',
+  //   icon: 'Select',
+  //   color: ''
+  // },
+]
+
+// 头部按钮事件 
+const buttonBaseClick = (val, item) => {
+  if (val == 'add') { // 新增
+    openForm('create')
+  } else if (val == 'import') { // 导入
+    handleImport()
+  } else if (val == 'export') { // 导出
+    handleExport()
+  } else if (val == 'refresh') { // 刷新
     getList()
+  } else if (val == 'filtrate') { // 筛选
+  } else { // 其他按钮 
+    console.log('其他按钮', item)
+  }
 }
 
-/** 重置按钮操作 */
+// 列表-操作按钮
-const resetQuery = () => {
+const butttondata = [
-  queryFormRef.value.resetFields()
+  defaultButtons.mainListEditBtn({hasPermi:'wms:project:update'}), // 编辑
-  handleQuery()
+  defaultButtons.mainListDeleteBtn({hasPermi:'wms:project:delete'}), // 删除
+]
+
+// 列表-操作按钮事件 
+const buttonTableClick = async (val, row) => {
+  if (val == 'edit') { // 编辑
+    // const res = await ProjectApi.getItempackaging(row.id)
+    openForm('update', row)
+  } else if (val == 'delete') { // 删除
+    handleDelete(row.id)
+  }
 }
 
 /** 添加/修改操作 */
-const formRef = ref()
+const basicFormRef = ref()
-const openForm = (type: string, id?: number) => {
+const openForm = (type: string, row?: any) => {
-  formRef.value.open(type, id)
+  basicFormRef.value.open(type, row)
+}
+
+/** 详情操作 */
+const detailRef = ref()
+const openDetail = (row: any, titleName: any, titleValue: any) => {
+  detailRef.value.openDetail(row, titleName, titleValue)
 }
 
 /** 删除按钮操作 */
@@ -264,13 +149,14 @@ const handleDelete = async (id: number) => {
 }
 
 /** 导出按钮操作 */
+const exportLoading = ref(false) // 导出的加载中
 const handleExport = async () => {
   try {
     // 导出的二次确认
     await message.exportConfirm()
     // 发起导出
     exportLoading.value = true
-    const data = await ProjectApi.exportProject(queryParams)
+    const data = await ProjectApi.exportProject(setSearchParams)
     download.excel(data, '项目.xls')
   } catch {
   } finally {
@@ -278,6 +164,21 @@ const handleExport = async () => {
   }
 }
 
+/** 导入 */
+const importFormRef = ref()
+const handleImport = () => {
+  importFormRef.value.open()
+}
+// 导入附件弹窗所需的参数
+const importTemplateData = reactive({
+  templateUrl: '',
+  templateTitle: '项目导入模版.xls'
+})
+// 导入成功之后
+const importSuccess = () => {
+  getList()
+}
+
 /** 初始化 **/
 onMounted(() => {
   getList()

src/views/wms/purchaseprice/index.vue

@@ -1,276 +1,138 @@
 <template>
   <ContentWrap>
     <!-- 搜索工作栏 -->
-    <el-form
+    <Search :schema="Purchaseprice.allSchemas.searchSchema" @search="setSearchParams" @reset="setSearchParams" />
-      class="-mb-15px"
-      :model="queryParams"
-      ref="queryFormRef"
-      :inline="true"
-      label-width="68px"
-    >
-      <el-form-item label="供应商代码" prop="supplierCode">
-        <el-input
-          v-model="queryParams.supplierCode"
-          placeholder="请输入供应商代码"
-          clearable
-          @keyup.enter="handleQuery"
-          class="!w-240px"
-        />
-      </el-form-item>
-      <el-form-item label="物料代码" prop="itemCode">
-        <el-input
-          v-model="queryParams.itemCode"
-          placeholder="请输入物料代码"
-          clearable
-          @keyup.enter="handleQuery"
-          class="!w-240px"
-        />
-      </el-form-item>
-      <el-form-item label="货币" prop="currency">
-        <el-select
-          v-model="queryParams.currency"
-          placeholder="请选择货币"
-          clearable
-          class="!w-240px"
-        >
-          <el-option
-            v-for="dict in getStrDictOptions(DICT_TYPE.CURRENCY)"
-            :key="dict.value"
-            :label="dict.label"
-            :value="dict.value"
-          />
-        </el-select>
-      </el-form-item>
-      <el-form-item label="价格" prop="price">
-        <el-input
-          v-model="queryParams.price"
-          placeholder="请输入价格"
-          clearable
-          @keyup.enter="handleQuery"
-          class="!w-240px"
-        />
-      </el-form-item>
-      <el-form-item label="是否可用" prop="available">
-        <el-select
-          v-model="queryParams.available"
-          placeholder="请选择是否可用"
-          clearable
-          class="!w-240px"
-        >
-          <el-option
-            v-for="dict in getIntDictOptions(DICT_TYPE.TRUE_FALSE)"
-            :key="dict.value"
-            :label="dict.label"
-            :value="dict.value"
-          />
-        </el-select>
-      </el-form-item>
-      <el-form-item label="生效时间" prop="activeTime">
-        <el-date-picker
-          v-model="queryParams.activeTime"
-          value-format="YYYY-MM-DD HH:mm:ss"
-          type="daterange"
-          start-placeholder="开始日期"
-          end-placeholder="结束日期"
-          :default-time="[new Date('1 00:00:00'), new Date('1 23:59:59')]"
-          class="!w-240px"
-        />
-      </el-form-item>
-      <el-form-item label="失效时间" prop="expireTime">
-        <el-date-picker
-          v-model="queryParams.expireTime"
-          value-format="YYYY-MM-DD HH:mm:ss"
-          type="daterange"
-          start-placeholder="开始日期"
-          end-placeholder="结束日期"
-          :default-time="[new Date('1 00:00:00'), new Date('1 23:59:59')]"
-          class="!w-240px"
-        />
-      </el-form-item>
-      <el-form-item label="备注" prop="remark">
-        <el-input
-          v-model="queryParams.remark"
-          placeholder="请输入备注"
-          clearable
-          @keyup.enter="handleQuery"
-          class="!w-240px"
-        />
-      </el-form-item>
-      <el-form-item label="创建时间" prop="createTime">
-        <el-date-picker
-          v-model="queryParams.createTime"
-          value-format="YYYY-MM-DD HH:mm:ss"
-          type="daterange"
-          start-placeholder="开始日期"
-          end-placeholder="结束日期"
-          :default-time="[new Date('1 00:00:00'), new Date('1 23:59:59')]"
-          class="!w-240px"
-        />
-      </el-form-item>
-      <el-form-item label="创建者ID" prop="creator">
-        <el-input
-          v-model="queryParams.creator"
-          placeholder="请输入创建者ID"
-          clearable
-          @keyup.enter="handleQuery"
-          class="!w-240px"
-        />
-      </el-form-item>
-      <el-form-item>
-        <el-button type="info" plain  @click="handleQuery"><Icon icon="ep:search" class="mr-5px" /> 搜索</el-button>
-        <el-button type="info" plain  @click="resetQuery"><Icon icon="ep:refresh" class="mr-5px" /> 重置</el-button>
-        <el-button
-          type="primary"
-          @click="openForm('create')"
-          v-hasPermi="['wms:purchaseprice:create']"
-        >
-          <Icon icon="ep:plus" class="mr-5px" /> 新增
-        </el-button>
-        <el-button
-          type="success"
-          @click="handleExport"
-          :loading="exportLoading"
-          v-hasPermi="['wms:purchaseprice:export']"
-        >
-          <Icon icon="ep:download" class="mr-5px" /> 导出
-        </el-button>
-      </el-form-item>
-    </el-form>
   </ContentWrap>
 
+  <!-- 列表头部 -->
+  <TableHead :HeadButttondata="HeadButttondata" @button-base-click="buttonBaseClick" />
+
   <!-- 列表 -->
   <ContentWrap>
-    <el-table v-loading="loading" :data="list" :stripe="true" :show-overflow-tooltip="true">
+    <Table
-      <el-table-column label="供应商代码" align="center" prop="supplierCode" width="150px" />
+      :columns="Purchaseprice.allSchemas.tableColumns"
-      <el-table-column label="物料代码" align="center" prop="itemCode" width="150px" />
+      :data="tableObject.tableList"
-      <el-table-column label="货币" align="center" prop="currency" width="150px">
+      :loading="tableObject.loading"
-        <template #default="scope">
+      :pagination="{
-          <dict-tag :type="DICT_TYPE.CURRENCY" :value="scope.row.currency" />
+        total: tableObject.total
-        </template>
+      }"
-      </el-table-column>
+      v-model:pageSize="tableObject.pageSize"
-      <el-table-column label="价格" align="center" prop="price" width="150px" />
+      v-model:currentPage="tableObject.currentPage"
-      <el-table-column label="是否可用" align="center" prop="available" width="150px">
+      v-model:sort="tableObject.sort"
-        <template #default="scope">
-          <dict-tag :type="DICT_TYPE.TRUE_FALSE" :value="scope.row.available" />
-        </template>
-      </el-table-column>
-      <el-table-column
-        label="生效时间"
-        align="center"
-        prop="activeTime"
-        :formatter="dateFormatter"
-        width="150px"
-      />
-      <el-table-column
-        label="失效时间"
-        align="center"
-        prop="expireTime"
-        :formatter="dateFormatter"
-        width="150px"
-      />
-      <el-table-column label="备注" align="center" prop="remark" width="150px" />
-      <el-table-column
-        label="创建时间"
-        align="center"
-        prop="createTime"
-        :formatter="dateFormatter"
-        width="150px"
-      />
-      <el-table-column label="创建者ID" align="center" prop="creator" width="150px" />
-      <el-table-column label="操作" align="center" width="150px"  fixed="right">
-        <template #default="scope">
-          <el-button
-            link
-            type="primary"
-            @click="openForm('update', scope.row.id)"
-            v-hasPermi="['wms:purchaseprice:update']"
     >
-            编辑
+      <template #supplierCode="{row}">
-          </el-button>
+        <el-button type="primary" link @click="openDetail(row, '供应商代码', row.supplierCode)">
-          <el-button
+          <span>{{ row.supplierCode }}</span>
-            link
-            type="danger"
-            @click="handleDelete(scope.row.id)"
-            v-hasPermi="['wms:purchaseprice:delete']"
-          >
-            删除
         </el-button>
       </template>
-      </el-table-column>
+      <template #action="{ row }">
-    </el-table>
+        <ButtonBase :Butttondata="butttondata" @button-base-click="buttonTableClick($event,row)" />
-    <!-- 分页 -->
+      </template>
-    <Pagination
+    </Table>
-      :total="total"
-      v-model:page="queryParams.pageNo"
-      v-model:limit="queryParams.pageSize"
-      @pagination="getList"
-    />
   </ContentWrap>
 
   <!-- 表单弹窗：添加/修改 -->
-  <PurchasepriceForm ref="formRef" @success="getList" />
+  <BasicForm 
+    ref="basicFormRef" 
+    @success="getList" 
+    :rules="PurchasepriceRules" 
+    :formAllSchemas="Purchaseprice.allSchemas" 
+    searchTableTitle="物料基础信息"
+    :searchTableAllSchemas="ItemBasic.allSchemas"
+    :searchTablePage="ItembasicApi.getItembasicPage"
+    :apiUpdate="PurchasepriceApi.updatePurchaseprice"
+    :apiCreate="PurchasepriceApi.createPurchaseprice"
+  />
+
+  <!-- 详情 -->
+  <Detail ref="detailRef" :isBasic="true" :allSchemas="Purchaseprice.allSchemas" />
+
+  <!-- 导入 -->
+  <ImportForm ref="importFormRef" url="/wms/purchaseprice/import" :importTemplateData="importTemplateData" @success="importSuccess" />
 </template>
 
 <script setup lang="ts">
-import { DICT_TYPE, getStrDictOptions, getIntDictOptions } from '@/utils/dict'
-import { dateFormatter } from '@/utils/formatTime'
 import download from '@/utils/download'
 import * as PurchasepriceApi from '@/api/wms/purchaseprice'
-import PurchasepriceForm from './PurchasepriceForm.vue'
+import * as ItembasicApi from '@/api/wms/itembasic'
+import BasicForm from '@/components/BasicForm/src/BasicForm.vue'
+import { Purchaseprice, PurchasepriceRules, ItemBasic } from '@/utils/disposition/tableColumns'
+import * as defaultButtons from '@/utils/disposition/defaultButtons'
+import TableHead from '@/components/TableHead/src/TableHead.vue' 
+import ImportForm from '@/components/ImportForm/src/ImportForm.vue'
+import Detail from '@/components/Detail/src/Detail.vue'
 
 defineOptions({ name: 'Purchaseprice' })
 
 const message = useMessage() // 消息弹窗
 const { t } = useI18n() // 国际化
 
-const loading = ref(true) // 列表的加载中
+const { tableObject, tableMethods } = useTable({
-const total = ref(0) // 列表的总页数
+  getListApi: PurchasepriceApi.getPurchasepricePage // 分页接口
-const list = ref([]) // 列表的数据
-const queryParams = reactive({
-  pageNo: 1,
-  pageSize: 10,
-  supplierCode: null,
-  itemCode: null,
-  currency: null,
-  price: null,
-  available: null,
-  activeTime: [],
-  expireTime: [],
-  remark: null,
-  createTime: [],
-  creator: null
 })
-const queryFormRef = ref() // 搜索的表单
-const exportLoading = ref(false) // 导出的加载中
 
-/** 查询列表 */
+// 获得表格的各种操作
-const getList = async () => {
+const { getList, setSearchParams } = tableMethods
-  loading.value = true
+
-  try {
+// 列表头部按钮
-    const data = await PurchasepriceApi.getPurchasepricePage(queryParams)
+const HeadButttondata = [
-    list.value = data.list
+  defaultButtons.defaultAddBtn({hasPermi:'wms:purchaseprice:create'}), // 新增
-    total.value = data.total
+  defaultButtons.defaultImportBtn({hasPermi:'wms:purchaseprice:import'}), // 导入
-  } finally {
+  defaultButtons.defaultExportBtn({hasPermi:'wms:purchaseprice:export'}), // 导出
-    loading.value = false
+  // defaultButtons.defaultFilterBtn(), // 筛选
-  }
+  defaultButtons.defaultFreshBtn(null), // 刷新
-}
+  // {
+  //   label: '自定义扩展按钮',
+  //   name: 'zdy',
+  //   hide: false,
+  //   type: 'primary',
+  //   icon: 'Select',
+  //   color: ''
+  // },
+]
 
-/** 搜索按钮操作 */
+// 头部按钮事件 
-const handleQuery = () => {
+const buttonBaseClick = (val, item) => {
-  queryParams.pageNo = 1
+  if (val == 'add') { // 新增
+    openForm('create')
+  } else if (val == 'import') { // 导入
+    handleImport()
+  } else if (val == 'export') { // 导出
+    handleExport()
+  } else if (val == 'refresh') { // 刷新
     getList()
+  } else if (val == 'filtrate') { // 筛选
+  } else { // 其他按钮 
+    console.log('其他按钮', item)
+  }
 }
 
-/** 重置按钮操作 */
+// 列表-操作按钮
-const resetQuery = () => {
+const butttondata = [
-  queryFormRef.value.resetFields()
+  defaultButtons.mainListEditBtn({hasPermi:'wms:purchaseprice:update'}), // 编辑
-  handleQuery()
+  defaultButtons.mainListDeleteBtn({hasPermi:'wms:purchaseprice:delete'}), // 删除
+]
+
+// 列表-操作按钮事件 
+const buttonTableClick = async (val, row) => {
+  if (val == 'edit') { // 编辑
+    // const res = await PurchasepriceApi.getItempackaging(row.id)
+    openForm('update', row)
+  } else if (val == 'delete') { // 删除
+    handleDelete(row.id)
+  }
 }
 
 /** 添加/修改操作 */
-const formRef = ref()
+const basicFormRef = ref()
-const openForm = (type: string, id?: number) => {
+const openForm = (type: string, row?: any) => {
-  formRef.value.open(type, id)
+  basicFormRef.value.open(type, row)
+}
+
+/** 详情操作 */
+const detailRef = ref()
+const openDetail = (row: any, titleName: any, titleValue: any) => {
+  detailRef.value.openDetail(row, titleName, titleValue)
 }
 
 /** 删除按钮操作 */
@@ -287,13 +149,14 @@ const handleDelete = async (id: number) => {
 }
 
 /** 导出按钮操作 */
+const exportLoading = ref(false) // 导出的加载中
 const handleExport = async () => {
   try {
     // 导出的二次确认
     await message.exportConfirm()
     // 发起导出
     exportLoading.value = true
-    const data = await PurchasepriceApi.exportPurchaseprice(queryParams)
+    const data = await PurchasepriceApi.exportPurchaseprice(setSearchParams)
     download.excel(data, '采购价格单.xls')
   } catch {
   } finally {
@@ -301,6 +164,21 @@ const handleExport = async () => {
   }
 }
 
+/** 导入 */
+const importFormRef = ref()
+const handleImport = () => {
+  importFormRef.value.open()
+}
+// 导入附件弹窗所需的参数
+const importTemplateData = reactive({
+  templateUrl: '',
+  templateTitle: '采购价格单导入模版.xls'
+})
+// 导入成功之后
+const importSuccess = () => {
+  getList()
+}
+
 /** 初始化 **/
 onMounted(() => {
   getList()

src/views/wms/saleprice/index.vue

@@ -1,276 +1,138 @@
 <template>
   <ContentWrap>
     <!-- 搜索工作栏 -->
-    <el-form
+    <Search :schema="Saleprice.allSchemas.searchSchema" @search="setSearchParams" @reset="setSearchParams" />
-      class="-mb-15px"
-      :model="queryParams"
-      ref="queryFormRef"
-      :inline="true"
-      label-width="68px"
-    >
-      <el-form-item label="客户代码" prop="customercode">
-        <el-input
-          v-model="queryParams.customercode"
-          placeholder="请输入客户代码"
-          clearable
-          @keyup.enter="handleQuery"
-          class="!w-240px"
-        />
-      </el-form-item>
-      <el-form-item label="物料代码" prop="itemcode">
-        <el-input
-          v-model="queryParams.itemcode"
-          placeholder="请输入物料代码"
-          clearable
-          @keyup.enter="handleQuery"
-          class="!w-240px"
-        />
-      </el-form-item>
-      <el-form-item label="货币" prop="currency">
-        <el-select
-          v-model="queryParams.currency"
-          placeholder="请选择货币"
-          clearable
-          class="!w-240px"
-        >
-          <el-option
-            v-for="dict in getStrDictOptions(DICT_TYPE.CURRENCY)"
-            :key="dict.value"
-            :label="dict.label"
-            :value="dict.value"
-          />
-        </el-select>
-      </el-form-item>
-      <el-form-item label="价格" prop="price">
-        <el-input
-          v-model="queryParams.price"
-          placeholder="请输入价格"
-          clearable
-          @keyup.enter="handleQuery"
-          class="!w-240px"
-        />
-      </el-form-item>
-      <el-form-item label="是否可用" prop="available">
-        <el-select
-          v-model="queryParams.available"
-          placeholder="请选择是否可用"
-          clearable
-          class="!w-240px"
-        >
-          <el-option
-            v-for="dict in getIntDictOptions(DICT_TYPE.TRUE_FALSE)"
-            :key="dict.value"
-            :label="dict.label"
-            :value="dict.value"
-          />
-        </el-select>
-      </el-form-item>
-      <el-form-item label="生效时间" prop="activeTime">
-        <el-date-picker
-          v-model="queryParams.activeTime"
-          value-format="YYYY-MM-DD HH:mm:ss"
-          type="daterange"
-          start-placeholder="开始日期"
-          end-placeholder="结束日期"
-          :default-time="[new Date('1 00:00:00'), new Date('1 23:59:59')]"
-          class="!w-240px"
-        />
-      </el-form-item>
-      <el-form-item label="失效时间" prop="expireTime">
-        <el-date-picker
-          v-model="queryParams.expireTime"
-          value-format="YYYY-MM-DD HH:mm:ss"
-          type="daterange"
-          start-placeholder="开始日期"
-          end-placeholder="结束日期"
-          :default-time="[new Date('1 00:00:00'), new Date('1 23:59:59')]"
-          class="!w-240px"
-        />
-      </el-form-item>
-      <el-form-item label="备注" prop="remark">
-        <el-input
-          v-model="queryParams.remark"
-          placeholder="请输入备注"
-          clearable
-          @keyup.enter="handleQuery"
-          class="!w-240px"
-        />
-      </el-form-item>
-      <el-form-item label="创建时间" prop="createTime">
-        <el-date-picker
-          v-model="queryParams.createTime"
-          value-format="YYYY-MM-DD HH:mm:ss"
-          type="daterange"
-          start-placeholder="开始日期"
-          end-placeholder="结束日期"
-          :default-time="[new Date('1 00:00:00'), new Date('1 23:59:59')]"
-          class="!w-240px"
-        />
-      </el-form-item>
-      <el-form-item label="创建者ID" prop="creator">
-        <el-input
-          v-model="queryParams.creator"
-          placeholder="请输入创建者ID"
-          clearable
-          @keyup.enter="handleQuery"
-          class="!w-240px"
-        />
-      </el-form-item>
-      <el-form-item>
-        <el-button type="info" plain  @click="handleQuery"><Icon icon="ep:search" class="mr-5px" /> 搜索</el-button>
-        <el-button type="info" plain  @click="resetQuery"><Icon icon="ep:refresh" class="mr-5px" /> 重置</el-button>
-        <el-button
-          type="primary"
-          @click="openForm('create')"
-          v-hasPermi="['wms:saleprice:create']"
-        >
-          <Icon icon="ep:plus" class="mr-5px" /> 新增
-        </el-button>
-        <el-button
-          type="success"
-          @click="handleExport"
-          :loading="exportLoading"
-          v-hasPermi="['wms:saleprice:export']"
-        >
-          <Icon icon="ep:download" class="mr-5px" /> 导出
-        </el-button>
-      </el-form-item>
-    </el-form>
   </ContentWrap>
 
+  <!-- 列表头部 -->
+  <TableHead :HeadButttondata="HeadButttondata" @button-base-click="buttonBaseClick" />
+
   <!-- 列表 -->
   <ContentWrap>
-    <el-table v-loading="loading" :data="list" :stripe="true" :show-overflow-tooltip="true">
+    <Table
-      <el-table-column label="客户代码" align="center" prop="customercode" width="150px" />
+      :columns="Saleprice.allSchemas.tableColumns"
-      <el-table-column label="物料代码" align="center" prop="itemcode" width="150px" />
+      :data="tableObject.tableList"
-      <el-table-column label="货币" align="center" prop="currency" width="150px">
+      :loading="tableObject.loading"
-        <template #default="scope">
+      :pagination="{
-          <dict-tag :type="DICT_TYPE.CURRENCY" :value="scope.row.currency" />
+        total: tableObject.total
-        </template>
+      }"
-      </el-table-column>
+      v-model:pageSize="tableObject.pageSize"
-      <el-table-column label="价格" align="center" prop="price" width="150px" />
+      v-model:currentPage="tableObject.currentPage"
-      <el-table-column label="是否可用" align="center" prop="available" width="150px">
+      v-model:sort="tableObject.sort"
-        <template #default="scope">
-          <dict-tag :type="DICT_TYPE.TRUE_FALSE" :value="scope.row.available" />
-        </template>
-      </el-table-column>
-      <el-table-column
-        label="生效时间"
-        align="center"
-        prop="activeTime"
-        :formatter="dateFormatter"
-        width="150px"
-      />
-      <el-table-column
-        label="失效时间"
-        align="center"
-        prop="expireTime"
-        :formatter="dateFormatter"
-        width="150px"
-      />
-      <el-table-column label="备注" align="center" prop="remark" width="150px" />
-      <el-table-column
-        label="创建时间"
-        align="center"
-        prop="createTime"
-        :formatter="dateFormatter"
-        width="150px"
-      />
-      <el-table-column label="创建者ID" align="center" prop="creator" width="150px" />
-      <el-table-column label="操作" align="center" width="150px"  fixed="right">
-        <template #default="scope">
-          <el-button
-            link
-            type="primary"
-            @click="openForm('update', scope.row.id)"
-            v-hasPermi="['wms:saleprice:update']"
     >
-            编辑
+      <template #customercode="{row}">
-          </el-button>
+        <el-button type="primary" link @click="openDetail(row, '客户代码', row.customercode)">
-          <el-button
+          <span>{{ row.customercode }}</span>
-            link
-            type="danger"
-            @click="handleDelete(scope.row.id)"
-            v-hasPermi="['wms:saleprice:delete']"
-          >
-            删除
         </el-button>
       </template>
-      </el-table-column>
+      <template #action="{ row }">
-    </el-table>
+        <ButtonBase :Butttondata="butttondata" @button-base-click="buttonTableClick($event,row)" />
-    <!-- 分页 -->
+      </template>
-    <Pagination
+    </Table>
-      :total="total"
-      v-model:page="queryParams.pageNo"
-      v-model:limit="queryParams.pageSize"
-      @pagination="getList"
-    />
   </ContentWrap>
 
   <!-- 表单弹窗：添加/修改 -->
-  <SalepriceForm ref="formRef" @success="getList" />
+  <BasicForm 
+    ref="basicFormRef" 
+    @success="getList" 
+    :rules="SalepriceRules" 
+    :formAllSchemas="Saleprice.allSchemas" 
+    searchTableTitle="物料基础信息"
+    :searchTableAllSchemas="ItemBasic.allSchemas"
+    :searchTablePage="ItembasicApi.getItembasicPage"
+    :apiUpdate="SalepriceApi.updateSaleprice"
+    :apiCreate="SalepriceApi.createSaleprice"
+  />
+
+  <!-- 详情 -->
+  <Detail ref="detailRef" :isBasic="true" :allSchemas="Saleprice.allSchemas" />
+
+  <!-- 导入 -->
+  <ImportForm ref="importFormRef" url="/wms/saleprice/import" :importTemplateData="importTemplateData" @success="importSuccess" />
 </template>
 
 <script setup lang="ts">
-import { DICT_TYPE, getStrDictOptions, getIntDictOptions } from '@/utils/dict'
-import { dateFormatter } from '@/utils/formatTime'
 import download from '@/utils/download'
 import * as SalepriceApi from '@/api/wms/saleprice'
-import SalepriceForm from './SalepriceForm.vue'
+import * as ItembasicApi from '@/api/wms/itembasic'
+import BasicForm from '@/components/BasicForm/src/BasicForm.vue'
+import { Saleprice, SalepriceRules, ItemBasic } from '@/utils/disposition/tableColumns'
+import * as defaultButtons from '@/utils/disposition/defaultButtons'
+import TableHead from '@/components/TableHead/src/TableHead.vue' 
+import ImportForm from '@/components/ImportForm/src/ImportForm.vue'
+import Detail from '@/components/Detail/src/Detail.vue'
 
 defineOptions({ name: 'Saleprice' })
 
 const message = useMessage() // 消息弹窗
 const { t } = useI18n() // 国际化
 
-const loading = ref(true) // 列表的加载中
+const { tableObject, tableMethods } = useTable({
-const total = ref(0) // 列表的总页数
+  getListApi: SalepriceApi.getSalepricePage // 分页接口
-const list = ref([]) // 列表的数据
-const queryParams = reactive({
-  pageNo: 1,
-  pageSize: 10,
-  customercode: null,
-  itemcode: null,
-  currency: null,
-  price: null,
-  available: null,
-  activeTime: [],
-  expireTime: [],
-  remark: null,
-  createTime: [],
-  creator: null
 })
-const queryFormRef = ref() // 搜索的表单
-const exportLoading = ref(false) // 导出的加载中
 
-/** 查询列表 */
+// 获得表格的各种操作
-const getList = async () => {
+const { getList, setSearchParams } = tableMethods
-  loading.value = true
+
-  try {
+// 列表头部按钮
-    const data = await SalepriceApi.getSalepricePage(queryParams)
+const HeadButttondata = [
-    list.value = data.list
+  defaultButtons.defaultAddBtn({hasPermi:'wms:saleprice:create'}), // 新增
-    total.value = data.total
+  defaultButtons.defaultImportBtn({hasPermi:'wms:saleprice:import'}), // 导入
-  } finally {
+  defaultButtons.defaultExportBtn({hasPermi:'wms:saleprice:export'}), // 导出
-    loading.value = false
+  // defaultButtons.defaultFilterBtn(), // 筛选
-  }
+  defaultButtons.defaultFreshBtn(null), // 刷新
-}
+  // {
+  //   label: '自定义扩展按钮',
+  //   name: 'zdy',
+  //   hide: false,
+  //   type: 'primary',
+  //   icon: 'Select',
+  //   color: ''
+  // },
+]
 
-/** 搜索按钮操作 */
+// 头部按钮事件 
-const handleQuery = () => {
+const buttonBaseClick = (val, item) => {
-  queryParams.pageNo = 1
+  if (val == 'add') { // 新增
+    openForm('create')
+  } else if (val == 'import') { // 导入
+    handleImport()
+  } else if (val == 'export') { // 导出
+    handleExport()
+  } else if (val == 'refresh') { // 刷新
     getList()
+  } else if (val == 'filtrate') { // 筛选
+  } else { // 其他按钮 
+    console.log('其他按钮', item)
+  }
 }
 
-/** 重置按钮操作 */
+// 列表-操作按钮
-const resetQuery = () => {
+const butttondata = [
-  queryFormRef.value.resetFields()
+  defaultButtons.mainListEditBtn({hasPermi:'wms:saleprice:update'}), // 编辑
-  handleQuery()
+  defaultButtons.mainListDeleteBtn({hasPermi:'wms:saleprice:delete'}), // 删除
+]
+
+// 列表-操作按钮事件 
+const buttonTableClick = async (val, row) => {
+  if (val == 'edit') { // 编辑
+    // const res = await SalepriceApi.getItempackaging(row.id)
+    openForm('update', row)
+  } else if (val == 'delete') { // 删除
+    handleDelete(row.id)
+  }
 }
 
 /** 添加/修改操作 */
-const formRef = ref()
+const basicFormRef = ref()
-const openForm = (type: string, id?: number) => {
+const openForm = (type: string, row?: any) => {
-  formRef.value.open(type, id)
+  basicFormRef.value.open(type, row)
+}
+
+/** 详情操作 */
+const detailRef = ref()
+const openDetail = (row: any, titleName: any, titleValue: any) => {
+  detailRef.value.openDetail(row, titleName, titleValue)
 }
 
 /** 删除按钮操作 */
@@ -287,13 +149,14 @@ const handleDelete = async (id: number) => {
 }
 
 /** 导出按钮操作 */
+const exportLoading = ref(false) // 导出的加载中
 const handleExport = async () => {
   try {
     // 导出的二次确认
     await message.exportConfirm()
     // 发起导出
     exportLoading.value = true
-    const data = await SalepriceApi.exportSaleprice(queryParams)
+    const data = await SalepriceApi.exportSaleprice(setSearchParams)
     download.excel(data, '销售价格单.xls')
   } catch {
   } finally {
@@ -301,6 +164,21 @@ const handleExport = async () => {
   }
 }
 
+/** 导入 */
+const importFormRef = ref()
+const handleImport = () => {
+  importFormRef.value.open()
+}
+// 导入附件弹窗所需的参数
+const importTemplateData = reactive({
+  templateUrl: '',
+  templateTitle: '销售价格单导入模版.xls'
+})
+// 导入成功之后
+const importSuccess = () => {
+  getList()
+}
+
 /** 初始化 **/
 onMounted(() => {
   getList()

src/views/wms/stdcostprice/index.vue

@@ -1,276 +1,138 @@
 <template>
   <ContentWrap>
     <!-- 搜索工作栏 -->
-    <el-form
+    <Search :schema="Stdcostprice.allSchemas.searchSchema" @search="setSearchParams" @reset="setSearchParams" />
-      class="-mb-15px"
-      :model="queryParams"
-      ref="queryFormRef"
-      :inline="true"
-      label-width="68px"
-    >
-      <el-form-item label="供应商代码" prop="supplierCode">
-        <el-input
-          v-model="queryParams.supplierCode"
-          placeholder="请输入供应商代码"
-          clearable
-          @keyup.enter="handleQuery"
-          class="!w-240px"
-        />
-      </el-form-item>
-      <el-form-item label="物料代码" prop="itemCode">
-        <el-input
-          v-model="queryParams.itemCode"
-          placeholder="请输入物料代码"
-          clearable
-          @keyup.enter="handleQuery"
-          class="!w-240px"
-        />
-      </el-form-item>
-      <el-form-item label="货币" prop="currency">
-        <el-select
-          v-model="queryParams.currency"
-          placeholder="请选择货币"
-          clearable
-          class="!w-240px"
-        >
-          <el-option
-            v-for="dict in getStrDictOptions(DICT_TYPE.CURRENCY)"
-            :key="dict.value"
-            :label="dict.label"
-            :value="dict.value"
-          />
-        </el-select>
-      </el-form-item>
-      <el-form-item label="价格" prop="price">
-        <el-input
-          v-model="queryParams.price"
-          placeholder="请输入价格"
-          clearable
-          @keyup.enter="handleQuery"
-          class="!w-240px"
-        />
-      </el-form-item>
-      <el-form-item label="是否可用" prop="available">
-        <el-select
-          v-model="queryParams.available"
-          placeholder="请选择是否可用"
-          clearable
-          class="!w-240px"
-        >
-          <el-option
-            v-for="dict in getIntDictOptions(DICT_TYPE.TRUE_FALSE)"
-            :key="dict.value"
-            :label="dict.label"
-            :value="dict.value"
-          />
-        </el-select>
-      </el-form-item>
-      <el-form-item label="生效时间" prop="activeTime">
-        <el-date-picker
-          v-model="queryParams.activeTime"
-          value-format="YYYY-MM-DD HH:mm:ss"
-          type="daterange"
-          start-placeholder="开始日期"
-          end-placeholder="结束日期"
-          :default-time="[new Date('1 00:00:00'), new Date('1 23:59:59')]"
-          class="!w-240px"
-        />
-      </el-form-item>
-      <el-form-item label="失效时间" prop="expireTime">
-        <el-date-picker
-          v-model="queryParams.expireTime"
-          value-format="YYYY-MM-DD HH:mm:ss"
-          type="daterange"
-          start-placeholder="开始日期"
-          end-placeholder="结束日期"
-          :default-time="[new Date('1 00:00:00'), new Date('1 23:59:59')]"
-          class="!w-240px"
-        />
-      </el-form-item>
-      <el-form-item label="备注" prop="remark">
-        <el-input
-          v-model="queryParams.remark"
-          placeholder="请输入备注"
-          clearable
-          @keyup.enter="handleQuery"
-          class="!w-240px"
-        />
-      </el-form-item>
-      <el-form-item label="创建时间" prop="createTime">
-        <el-date-picker
-          v-model="queryParams.createTime"
-          value-format="YYYY-MM-DD HH:mm:ss"
-          type="daterange"
-          start-placeholder="开始日期"
-          end-placeholder="结束日期"
-          :default-time="[new Date('1 00:00:00'), new Date('1 23:59:59')]"
-          class="!w-240px"
-        />
-      </el-form-item>
-      <el-form-item label="创建者ID" prop="creator">
-        <el-input
-          v-model="queryParams.creator"
-          placeholder="请输入创建者ID"
-          clearable
-          @keyup.enter="handleQuery"
-          class="!w-240px"
-        />
-      </el-form-item>
-      <el-form-item>
-        <el-button type="info" plain  @click="handleQuery"><Icon icon="ep:search" class="mr-5px" /> 搜索</el-button>
-        <el-button type="info" plain  @click="resetQuery"><Icon icon="ep:refresh" class="mr-5px" /> 重置</el-button>
-        <el-button
-          type="primary"
-          @click="openForm('create')"
-          v-hasPermi="['wms:stdcostprice:create']"
-        >
-          <Icon icon="ep:plus" class="mr-5px" /> 新增
-        </el-button>
-        <el-button
-          type="success"
-          @click="handleExport"
-          :loading="exportLoading"
-          v-hasPermi="['wms:stdcostprice:export']"
-        >
-          <Icon icon="ep:download" class="mr-5px" /> 导出
-        </el-button>
-      </el-form-item>
-    </el-form>
   </ContentWrap>
 
+  <!-- 列表头部 -->
+  <TableHead :HeadButttondata="HeadButttondata" @button-base-click="buttonBaseClick" />
+
   <!-- 列表 -->
   <ContentWrap>
-    <el-table v-loading="loading" :data="list" :stripe="true" :show-overflow-tooltip="true">
+    <Table
-      <el-table-column label="供应商代码" align="center" prop="supplierCode" width="150px" />
+      :columns="Stdcostprice.allSchemas.tableColumns"
-      <el-table-column label="物料代码" align="center" prop="itemCode" width="150px" />
+      :data="tableObject.tableList"
-      <el-table-column label="货币" align="center" prop="currency" width="150px">
+      :loading="tableObject.loading"
-        <template #default="scope">
+      :pagination="{
-          <dict-tag :type="DICT_TYPE.CURRENCY" :value="scope.row.currency" />
+        total: tableObject.total
-        </template>
+      }"
-      </el-table-column>
+      v-model:pageSize="tableObject.pageSize"
-      <el-table-column label="价格" align="center" prop="price" width="150px" />
+      v-model:currentPage="tableObject.currentPage"
-      <el-table-column label="是否可用" align="center" prop="available" width="150px">
+      v-model:sort="tableObject.sort"
-        <template #default="scope">
-          <dict-tag :type="DICT_TYPE.TRUE_FALSE" :value="scope.row.available" />
-        </template>
-      </el-table-column>
-      <el-table-column
-        label="生效时间"
-        align="center"
-        prop="activeTime"
-        :formatter="dateFormatter"
-        width="150px"
-      />
-      <el-table-column
-        label="失效时间"
-        align="center"
-        prop="expireTime"
-        :formatter="dateFormatter"
-        width="150px"
-      />
-      <el-table-column label="备注" align="center" prop="remark" width="150px" />
-      <el-table-column
-        label="创建时间"
-        align="center"
-        prop="createTime"
-        :formatter="dateFormatter"
-        width="150px"
-      />
-      <el-table-column label="创建者ID" align="center" prop="creator" width="150px" />
-      <el-table-column label="操作" align="center" width="150px"  fixed="right">
-        <template #default="scope">
-          <el-button
-            link
-            type="primary"
-            @click="openForm('update', scope.row.id)"
-            v-hasPermi="['wms:stdcostprice:update']"
     >
-            编辑
+      <template #supplierCode="{row}">
-          </el-button>
+        <el-button type="primary" link @click="openDetail(row, '供应商代码', row.supplierCode)">
-          <el-button
+          <span>{{ row.supplierCode }}</span>
-            link
-            type="danger"
-            @click="handleDelete(scope.row.id)"
-            v-hasPermi="['wms:stdcostprice:delete']"
-          >
-            删除
         </el-button>
       </template>
-      </el-table-column>
+      <template #action="{ row }">
-    </el-table>
+        <ButtonBase :Butttondata="butttondata" @button-base-click="buttonTableClick($event,row)" />
-    <!-- 分页 -->
+      </template>
-    <Pagination
+    </Table>
-      :total="total"
-      v-model:page="queryParams.pageNo"
-      v-model:limit="queryParams.pageSize"
-      @pagination="getList"
-    />
   </ContentWrap>
 
   <!-- 表单弹窗：添加/修改 -->
-  <StdcostpriceForm ref="formRef" @success="getList" />
+  <BasicForm 
+    ref="basicFormRef" 
+    @success="getList" 
+    :rules="StdcostpriceRules" 
+    :formAllSchemas="Stdcostprice.allSchemas" 
+    searchTableTitle="物料基础信息"
+    :searchTableAllSchemas="ItemBasic.allSchemas"
+    :searchTablePage="ItembasicApi.getItembasicPage"
+    :apiUpdate="StdcostpriceApi.updateStdcostprice"
+    :apiCreate="StdcostpriceApi.createStdcostprice"
+  />
+
+  <!-- 详情 -->
+  <Detail ref="detailRef" :isBasic="true" :allSchemas="Stdcostprice.allSchemas" />
+
+  <!-- 导入 -->
+  <ImportForm ref="importFormRef" url="/wms/stdcostprice/import" :importTemplateData="importTemplateData" @success="importSuccess" />
 </template>
 
 <script setup lang="ts">
-import { DICT_TYPE, getStrDictOptions, getIntDictOptions } from '@/utils/dict'
-import { dateFormatter } from '@/utils/formatTime'
 import download from '@/utils/download'
 import * as StdcostpriceApi from '@/api/wms/stdcostprice'
-import StdcostpriceForm from './StdcostpriceForm.vue'
+import * as ItembasicApi from '@/api/wms/itembasic'
+import BasicForm from '@/components/BasicForm/src/BasicForm.vue'
+import { Stdcostprice, StdcostpriceRules, ItemBasic } from '@/utils/disposition/tableColumns'
+import * as defaultButtons from '@/utils/disposition/defaultButtons'
+import TableHead from '@/components/TableHead/src/TableHead.vue' 
+import ImportForm from '@/components/ImportForm/src/ImportForm.vue'
+import Detail from '@/components/Detail/src/Detail.vue'
 
 defineOptions({ name: 'Stdcostprice' })
 
 const message = useMessage() // 消息弹窗
 const { t } = useI18n() // 国际化
 
-const loading = ref(true) // 列表的加载中
+const { tableObject, tableMethods } = useTable({
-const total = ref(0) // 列表的总页数
+  getListApi: StdcostpriceApi.getStdcostpricePage // 分页接口
-const list = ref([]) // 列表的数据
-const queryParams = reactive({
-  pageNo: 1,
-  pageSize: 10,
-  supplierCode: null,
-  itemCode: null,
-  currency: null,
-  price: null,
-  available: null,
-  activeTime: [],
-  expireTime: [],
-  remark: null,
-  createTime: [],
-  creator: null
 })
-const queryFormRef = ref() // 搜索的表单
-const exportLoading = ref(false) // 导出的加载中
 
-/** 查询列表 */
+// 获得表格的各种操作
-const getList = async () => {
+const { getList, setSearchParams } = tableMethods
-  loading.value = true
+
-  try {
+// 列表头部按钮
-    const data = await StdcostpriceApi.getStdcostpricePage(queryParams)
+const HeadButttondata = [
-    list.value = data.list
+  defaultButtons.defaultAddBtn({hasPermi:'wms:stdcostprice:create'}), // 新增
-    total.value = data.total
+  defaultButtons.defaultImportBtn({hasPermi:'wms:stdcostprice:import'}), // 导入
-  } finally {
+  defaultButtons.defaultExportBtn({hasPermi:'wms:stdcostprice:export'}), // 导出
-    loading.value = false
+  // defaultButtons.defaultFilterBtn(), // 筛选
-  }
+  defaultButtons.defaultFreshBtn(null), // 刷新
-}
+  // {
+  //   label: '自定义扩展按钮',
+  //   name: 'zdy',
+  //   hide: false,
+  //   type: 'primary',
+  //   icon: 'Select',
+  //   color: ''
+  // },
+]
 
-/** 搜索按钮操作 */
+// 头部按钮事件 
-const handleQuery = () => {
+const buttonBaseClick = (val, item) => {
-  queryParams.pageNo = 1
+  if (val == 'add') { // 新增
+    openForm('create')
+  } else if (val == 'import') { // 导入
+    handleImport()
+  } else if (val == 'export') { // 导出
+    handleExport()
+  } else if (val == 'refresh') { // 刷新
     getList()
+  } else if (val == 'filtrate') { // 筛选
+  } else { // 其他按钮 
+    console.log('其他按钮', item)
+  }
 }
 
-/** 重置按钮操作 */
+// 列表-操作按钮
-const resetQuery = () => {
+const butttondata = [
-  queryFormRef.value.resetFields()
+  defaultButtons.mainListEditBtn({hasPermi:'wms:stdcostprice:update'}), // 编辑
-  handleQuery()
+  defaultButtons.mainListDeleteBtn({hasPermi:'wms:stdcostprice:delete'}), // 删除
+]
+
+// 列表-操作按钮事件 
+const buttonTableClick = async (val, row) => {
+  if (val == 'edit') { // 编辑
+    // const res = await StdcostpriceApi.getItempackaging(row.id)
+    openForm('update', row)
+  } else if (val == 'delete') { // 删除
+    handleDelete(row.id)
+  }
 }
 
 /** 添加/修改操作 */
-const formRef = ref()
+const basicFormRef = ref()
-const openForm = (type: string, id?: number) => {
+const openForm = (type: string, row?: any) => {
-  formRef.value.open(type, id)
+  basicFormRef.value.open(type, row)
+}
+
+/** 详情操作 */
+const detailRef = ref()
+const openDetail = (row: any, titleName: any, titleValue: any) => {
+  detailRef.value.openDetail(row, titleName, titleValue)
 }
 
 /** 删除按钮操作 */
@@ -287,20 +149,36 @@ const handleDelete = async (id: number) => {
 }
 
 /** 导出按钮操作 */
+const exportLoading = ref(false) // 导出的加载中
 const handleExport = async () => {
   try {
     // 导出的二次确认
     await message.exportConfirm()
     // 发起导出
     exportLoading.value = true
-    const data = await StdcostpriceApi.exportStdcostprice(queryParams)
+    const data = await StdcostpriceApi.exportStdcostprice(setSearchParams)
-    download.excel(data, '标准成本价格单.xls')
+    download.excel(data, '标准成本价格单 .xls')
   } catch {
   } finally {
     exportLoading.value = false
   }
 }
 
+/** 导入 */
+const importFormRef = ref()
+const handleImport = () => {
+  importFormRef.value.open()
+}
+// 导入附件弹窗所需的参数
+const importTemplateData = reactive({
+  templateUrl: '',
+  templateTitle: '标准成本价格单导入模版.xls'
+})
+// 导入成功之后
+const importSuccess = () => {
+  getList()
+}
+
 /** 初始化 **/
 onMounted(() => {
   getList()

src/views/wms/supplier/index.vue

@@ -1,387 +1,138 @@
 <template>
   <ContentWrap>
     <!-- 搜索工作栏 -->
-    <el-form
+    <Search :schema="Supplier.allSchemas.searchSchema" @search="setSearchParams" @reset="setSearchParams" />
-      class="-mb-15px"
-      :model="queryParams"
-      ref="queryFormRef"
-      :inline="true"
-      label-width="68px"
-    >
-      <el-form-item label="代码" prop="code">
-        <el-input
-          v-model="queryParams.code"
-          placeholder="请输入代码"
-          clearable
-          @keyup.enter="handleQuery"
-          class="!w-240px"
-        />
-      </el-form-item>
-      <el-form-item label="名称" prop="name">
-        <el-input
-          v-model="queryParams.name"
-          placeholder="请输入名称"
-          clearable
-          @keyup.enter="handleQuery"
-          class="!w-240px"
-        />
-      </el-form-item>
-      <el-form-item label="简称" prop="shortName">
-        <el-input
-          v-model="queryParams.shortName"
-          placeholder="请输入简称"
-          clearable
-          @keyup.enter="handleQuery"
-          class="!w-240px"
-        />
-      </el-form-item>
-      <el-form-item label="地址" prop="address">
-        <el-input
-          v-model="queryParams.address"
-          placeholder="请输入地址"
-          clearable
-          @keyup.enter="handleQuery"
-          class="!w-240px"
-        />
-      </el-form-item>
-      <el-form-item label="国家" prop="country">
-        <el-input
-          v-model="queryParams.country"
-          placeholder="请输入国家"
-          clearable
-          @keyup.enter="handleQuery"
-          class="!w-240px"
-        />
-      </el-form-item>
-      <el-form-item label="城市" prop="city">
-        <el-input
-          v-model="queryParams.city"
-          placeholder="请输入城市"
-          clearable
-          @keyup.enter="handleQuery"
-          class="!w-240px"
-        />
-      </el-form-item>
-      <el-form-item label="电话" prop="phone">
-        <el-input
-          v-model="queryParams.phone"
-          placeholder="请输入电话"
-          clearable
-          @keyup.enter="handleQuery"
-          class="!w-240px"
-        />
-      </el-form-item>
-      <el-form-item label="传真" prop="fax">
-        <el-input
-          v-model="queryParams.fax"
-          placeholder="请输入传真"
-          clearable
-          @keyup.enter="handleQuery"
-          class="!w-240px"
-        />
-      </el-form-item>
-      <el-form-item label="邮编" prop="postId">
-        <el-input
-          v-model="queryParams.postId"
-          placeholder="请输入邮编"
-          clearable
-          @keyup.enter="handleQuery"
-          class="!w-240px"
-        />
-      </el-form-item>
-      <el-form-item label="联系人" prop="contacts">
-        <el-input
-          v-model="queryParams.contacts"
-          placeholder="请输入联系人"
-          clearable
-          @keyup.enter="handleQuery"
-          class="!w-240px"
-        />
-      </el-form-item>
-      <el-form-item label="银行" prop="bank">
-        <el-input
-          v-model="queryParams.bank"
-          placeholder="请输入银行"
-          clearable
-          @keyup.enter="handleQuery"
-          class="!w-240px"
-        />
-      </el-form-item>
-      <el-form-item label="币种" prop="currency">
-        <el-select
-          v-model="queryParams.currency"
-          placeholder="请选择币种"
-          clearable
-          class="!w-240px"
-        >
-          <el-option
-            v-for="dict in getStrDictOptions(DICT_TYPE.CURRENCY)"
-            :key="dict.value"
-            :label="dict.label"
-            :value="dict.value"
-          />
-        </el-select>
-      </el-form-item>
-      <el-form-item label="税率" prop="taxRate">
-        <el-input
-          v-model="queryParams.taxRate"
-          placeholder="请输入税率"
-          clearable
-          @keyup.enter="handleQuery"
-          class="!w-240px"
-        />
-      </el-form-item>
-      <el-form-item label="类型" prop="type">
-        <el-select v-model="queryParams.type" placeholder="请选择类型" clearable class="!w-240px">
-          <el-option
-            v-for="dict in getStrDictOptions(DICT_TYPE.SUPPLIER_TYPE)"
-            :key="dict.value"
-            :label="dict.label"
-            :value="dict.value"
-          />
-        </el-select>
-      </el-form-item>
-      <el-form-item label="是否可用" prop="available">
-        <el-select
-          v-model="queryParams.available"
-          placeholder="请选择是否可用"
-          clearable
-          class="!w-240px"
-        >
-          <el-option
-            v-for="dict in getIntDictOptions(DICT_TYPE.TRUE_FALSE)"
-            :key="dict.value"
-            :label="dict.label"
-            :value="dict.value"
-          />
-        </el-select>
-      </el-form-item>
-      <el-form-item label="生效时间" prop="activeTime">
-        <el-date-picker
-          v-model="queryParams.activeTime"
-          value-format="YYYY-MM-DD HH:mm:ss"
-          type="daterange"
-          start-placeholder="开始日期"
-          end-placeholder="结束日期"
-          :default-time="[new Date('1 00:00:00'), new Date('1 23:59:59')]"
-          class="!w-240px"
-        />
-      </el-form-item>
-      <el-form-item label="失效时间" prop="expireTime">
-        <el-date-picker
-          v-model="queryParams.expireTime"
-          value-format="YYYY-MM-DD HH:mm:ss"
-          type="daterange"
-          start-placeholder="开始日期"
-          end-placeholder="结束日期"
-          :default-time="[new Date('1 00:00:00'), new Date('1 23:59:59')]"
-          class="!w-240px"
-        />
-      </el-form-item>
-      <el-form-item label="备注" prop="remark">
-        <el-input
-          v-model="queryParams.remark"
-          placeholder="请输入备注"
-          clearable
-          @keyup.enter="handleQuery"
-          class="!w-240px"
-        />
-      </el-form-item>
-      <el-form-item label="创建时间" prop="createTime">
-        <el-date-picker
-          v-model="queryParams.createTime"
-          value-format="YYYY-MM-DD HH:mm:ss"
-          type="daterange"
-          start-placeholder="开始日期"
-          end-placeholder="结束日期"
-          :default-time="[new Date('1 00:00:00'), new Date('1 23:59:59')]"
-          class="!w-240px"
-        />
-      </el-form-item>
-      <el-form-item label="创建者ID" prop="creator">
-        <el-input
-          v-model="queryParams.creator"
-          placeholder="请输入创建者ID"
-          clearable
-          @keyup.enter="handleQuery"
-          class="!w-240px"
-        />
-      </el-form-item>
-      <el-form-item>
-        <el-button type="info" plain  @click="handleQuery"><Icon icon="ep:search" class="mr-5px" /> 搜索</el-button>
-        <el-button type="info" plain  @click="resetQuery"><Icon icon="ep:refresh" class="mr-5px" /> 重置</el-button>
-        <el-button type="primary" @click="openForm('create')" v-hasPermi="['wms:supplier:create']">
-          <Icon icon="ep:plus" class="mr-5px" /> 新增
-        </el-button>
-        <el-button
-          type="success"
-          @click="handleExport"
-          :loading="exportLoading"
-          v-hasPermi="['wms:supplier:export']"
-        >
-          <Icon icon="ep:download" class="mr-5px" /> 导出
-        </el-button>
-      </el-form-item>
-    </el-form>
   </ContentWrap>
 
+  <!-- 列表头部 -->
+  <TableHead :HeadButttondata="HeadButttondata" @button-base-click="buttonBaseClick" />
+
   <!-- 列表 -->
   <ContentWrap>
-    <el-table v-loading="loading" :data="list" :stripe="true" :show-overflow-tooltip="true">
+    <Table
-      <el-table-column label="代码" align="center" prop="code" width="150px" />
+      :columns="Supplier.allSchemas.tableColumns"
-      <el-table-column label="名称" align="center" prop="name" width="150px" />
+      :data="tableObject.tableList"
-      <el-table-column label="简称" align="center" prop="shortName" width="150px" />
+      :loading="tableObject.loading"
-      <el-table-column label="地址" align="center" prop="address" width="150px" />
+      :pagination="{
-      <el-table-column label="国家" align="center" prop="country" width="150px" />
+        total: tableObject.total
-      <el-table-column label="城市" align="center" prop="city" width="150px" />
+      }"
-      <el-table-column label="电话" align="center" prop="phone" width="150px" />
+      v-model:pageSize="tableObject.pageSize"
-      <el-table-column label="传真" align="center" prop="fax" width="150px" />
+      v-model:currentPage="tableObject.currentPage"
-      <el-table-column label="邮编" align="center" prop="postId" width="150px" />
+      v-model:sort="tableObject.sort"
-      <el-table-column label="联系人" align="center" prop="contacts" width="150px" />
-      <el-table-column label="银行" align="center" prop="bank" width="150px" />
-      <el-table-column label="币种" align="center" prop="currency" width="150px">
-        <template #default="scope">
-          <dict-tag :type="DICT_TYPE.CURRENCY" :value="scope.row.currency" />
-        </template>
-      </el-table-column>
-      <el-table-column label="税率" align="center" prop="taxRate" width="150px" />
-      <el-table-column label="类型" align="center" prop="type" width="150px">
-        <template #default="scope">
-          <dict-tag :type="DICT_TYPE.SUPPLIER_TYPE" :value="scope.row.type" />
-        </template>
-      </el-table-column>
-      <el-table-column label="是否可用" align="center" prop="available" width="150px">
-        <template #default="scope">
-          <dict-tag :type="DICT_TYPE.TRUE_FALSE" :value="scope.row.available" />
-        </template>
-      </el-table-column>
-      <el-table-column
-        label="生效时间"
-        align="center"
-        prop="activeTime"
-        :formatter="dateFormatter"
-        width="150px"
-      />
-      <el-table-column
-        label="失效时间"
-        align="center"
-        prop="expireTime"
-        :formatter="dateFormatter"
-        width="150px"
-      />
-      <el-table-column label="备注" align="center" prop="remark" width="150px" />
-      <el-table-column
-        label="创建时间"
-        align="center"
-        prop="createTime"
-        :formatter="dateFormatter"
-        width="150px"
-      />
-      <el-table-column label="创建者ID" align="center" prop="creator" width="150px" />
-      <el-table-column label="操作" align="center" width="150px"  fixed="right">
-        <template #default="scope">
-          <el-button
-            link
-            type="primary"
-            @click="openForm('update', scope.row.id)"
-            v-hasPermi="['wms:supplier:update']"
     >
-            编辑
+      <template #code="{row}">
-          </el-button>
+        <el-button type="primary" link @click="openDetail(row, '代码', row.code)">
-          <el-button
+          <span>{{ row.code }}</span>
-            link
-            type="danger"
-            @click="handleDelete(scope.row.id)"
-            v-hasPermi="['wms:supplier:delete']"
-          >
-            删除
         </el-button>
       </template>
-      </el-table-column>
+      <template #action="{ row }">
-    </el-table>
+        <ButtonBase :Butttondata="butttondata" @button-base-click="buttonTableClick($event,row)" />
-    <!-- 分页 -->
+      </template>
-    <Pagination
+    </Table>
-      :total="total"
-      v-model:page="queryParams.pageNo"
-      v-model:limit="queryParams.pageSize"
-      @pagination="getList"
-    />
   </ContentWrap>
 
   <!-- 表单弹窗：添加/修改 -->
-  <SupplierForm ref="formRef" @success="getList" />
+  <BasicForm 
+    ref="basicFormRef" 
+    @success="getList" 
+    :rules="SupplierRules" 
+    :formAllSchemas="Supplier.allSchemas" 
+    searchTableTitle="物料基础信息"
+    :searchTableAllSchemas="ItemBasic.allSchemas"
+    :searchTablePage="ItembasicApi.getItembasicPage"
+    :apiUpdate="SupplierApi.updateSupplier"
+    :apiCreate="SupplierApi.createSupplier"
+  />
+
+  <!-- 详情 -->
+  <Detail ref="detailRef" :isBasic="true" :allSchemas="Supplier.allSchemas" />
+
+  <!-- 导入 -->
+  <ImportForm ref="importFormRef" url="/wms/supplier/import" :importTemplateData="importTemplateData" @success="importSuccess" />
 </template>
 
 <script setup lang="ts">
-import { DICT_TYPE, getStrDictOptions, getIntDictOptions } from '@/utils/dict'
-import { dateFormatter } from '@/utils/formatTime'
 import download from '@/utils/download'
 import * as SupplierApi from '@/api/wms/supplier'
-import SupplierForm from './SupplierForm.vue'
+import * as ItembasicApi from '@/api/wms/itembasic'
+import BasicForm from '@/components/BasicForm/src/BasicForm.vue'
+import { Supplier, SupplierRules, ItemBasic } from '@/utils/disposition/tableColumns'
+import * as defaultButtons from '@/utils/disposition/defaultButtons'
+import TableHead from '@/components/TableHead/src/TableHead.vue' 
+import ImportForm from '@/components/ImportForm/src/ImportForm.vue'
+import Detail from '@/components/Detail/src/Detail.vue'
 
 defineOptions({ name: 'Supplier' })
 
 const message = useMessage() // 消息弹窗
 const { t } = useI18n() // 国际化
 
-const loading = ref(true) // 列表的加载中
+const { tableObject, tableMethods } = useTable({
-const total = ref(0) // 列表的总页数
+  getListApi: SupplierApi.getSupplierPage // 分页接口
-const list = ref([]) // 列表的数据
-const queryParams = reactive({
-  pageNo: 1,
-  pageSize: 10,
-  code: null,
-  name: null,
-  shortName: null,
-  address: null,
-  country: null,
-  city: null,
-  phone: null,
-  fax: null,
-  postId: null,
-  contacts: null,
-  bank: null,
-  currency: null,
-  taxRate: null,
-  type: null,
-  available: null,
-  activeTime: [],
-  expireTime: [],
-  remark: null,
-  createTime: [],
-  creator: null
 })
-const queryFormRef = ref() // 搜索的表单
-const exportLoading = ref(false) // 导出的加载中
 
-/** 查询列表 */
+// 获得表格的各种操作
-const getList = async () => {
+const { getList, setSearchParams } = tableMethods
-  loading.value = true
-  try {
-    const data = await SupplierApi.getSupplierPage(queryParams)
-    list.value = data.list
-    total.value = data.total
-  } finally {
-    loading.value = false
-  }
-}
 
-/** 搜索按钮操作 */
+// 列表头部按钮
-const handleQuery = () => {
+const HeadButttondata = [
-  queryParams.pageNo = 1
+  defaultButtons.defaultAddBtn({hasPermi:'wms:supplier:create'}), // 新增
+  defaultButtons.defaultImportBtn({hasPermi:'wms:supplier:import'}), // 导入
+  defaultButtons.defaultExportBtn({hasPermi:'wms:supplier:export'}), // 导出
+  // defaultButtons.defaultFilterBtn(), // 筛选
+  defaultButtons.defaultFreshBtn(null), // 刷新
+  // {
+  //   label: '自定义扩展按钮',
+  //   name: 'zdy',
+  //   hide: false,
+  //   type: 'primary',
+  //   icon: 'Select',
+  //   color: ''
+  // },
+]
+
+// 头部按钮事件 
+const buttonBaseClick = (val, item) => {
+  if (val == 'add') { // 新增
+    openForm('create')
+  } else if (val == 'import') { // 导入
+    handleImport()
+  } else if (val == 'export') { // 导出
+    handleExport()
+  } else if (val == 'refresh') { // 刷新
     getList()
+  } else if (val == 'filtrate') { // 筛选
+  } else { // 其他按钮 
+    console.log('其他按钮', item)
+  }
 }
 
-/** 重置按钮操作 */
+// 列表-操作按钮
-const resetQuery = () => {
+const butttondata = [
-  queryFormRef.value.resetFields()
+  defaultButtons.mainListEditBtn({hasPermi:'wms:supplier:update'}), // 编辑
-  handleQuery()
+  defaultButtons.mainListDeleteBtn({hasPermi:'wms:supplier:delete'}), // 删除
+]
+
+// 列表-操作按钮事件 
+const buttonTableClick = async (val, row) => {
+  if (val == 'edit') { // 编辑
+    // const res = await SupplierApi.getItempackaging(row.id)
+    openForm('update', row)
+  } else if (val == 'delete') { // 删除
+    handleDelete(row.id)
+  }
 }
 
 /** 添加/修改操作 */
-const formRef = ref()
+const basicFormRef = ref()
-const openForm = (type: string, id?: number) => {
+const openForm = (type: string, row?: any) => {
-  formRef.value.open(type, id)
+  basicFormRef.value.open(type, row)
+}
+
+/** 详情操作 */
+const detailRef = ref()
+const openDetail = (row: any, titleName: any, titleValue: any) => {
+  detailRef.value.openDetail(row, titleName, titleValue)
 }
 
 /** 删除按钮操作 */
@@ -398,13 +149,14 @@ const handleDelete = async (id: number) => {
 }
 
 /** 导出按钮操作 */
+const exportLoading = ref(false) // 导出的加载中
 const handleExport = async () => {
   try {
     // 导出的二次确认
     await message.exportConfirm()
     // 发起导出
     exportLoading.value = true
-    const data = await SupplierApi.exportSupplier(queryParams)
+    const data = await SupplierApi.exportSupplier(setSearchParams)
     download.excel(data, '供应商.xls')
   } catch {
   } finally {
@@ -412,6 +164,21 @@ const handleExport = async () => {
   }
 }
 
+/** 导入 */
+const importFormRef = ref()
+const handleImport = () => {
+  importFormRef.value.open()
+}
+// 导入附件弹窗所需的参数
+const importTemplateData = reactive({
+  templateUrl: '',
+  templateTitle: '供应商导入模版.xls'
+})
+// 导入成功之后
+const importSuccess = () => {
+  getList()
+}
+
 /** 初始化 **/
 onMounted(() => {
   getList()

src/views/wms/supplieritem/index.vue

@@ -1,405 +1,138 @@
 <template>
   <ContentWrap>
     <!-- 搜索工作栏 -->
-    <el-form
+    <Search :schema="Supplieritem.allSchemas.searchSchema" @search="setSearchParams" @reset="setSearchParams" />
-      class="-mb-15px"
-      :model="queryParams"
-      ref="queryFormRef"
-      :inline="true"
-      label-width="68px"
-    >
-      <el-form-item label="供应商代码" prop="supplierCode">
-        <el-input
-          v-model="queryParams.supplierCode"
-          placeholder="请输入供应商代码"
-          clearable
-          @keyup.enter="handleQuery"
-          class="!w-240px"
-        />
-      </el-form-item>
-      <el-form-item label="物料代码" prop="itemCode">
-        <el-input
-          v-model="queryParams.itemCode"
-          placeholder="请输入物料代码"
-          clearable
-          @keyup.enter="handleQuery"
-          class="!w-240px"
-        />
-      </el-form-item>
-      <el-form-item label="供应商物料代码" prop="supplierItemCode">
-        <el-input
-          v-model="queryParams.supplierItemCode"
-          placeholder="请输入供应商物料代码"
-          clearable
-          @keyup.enter="handleQuery"
-          class="!w-240px"
-        />
-      </el-form-item>
-      <el-form-item label="供应商计量单位" prop="supplierUom">
-        <el-select
-          v-model="queryParams.supplierUom"
-          placeholder="请选择供应商计量单位"
-          clearable
-          class="!w-240px"
-        >
-          <el-option
-            v-for="dict in getStrDictOptions(DICT_TYPE.UOM)"
-            :key="dict.value"
-            :label="dict.label"
-            :value="dict.value"
-          />
-        </el-select>
-      </el-form-item>
-      <el-form-item label="转换率" prop="convertRate">
-        <el-input
-          v-model="queryParams.convertRate"
-          placeholder="请输入转换率"
-          clearable
-          @keyup.enter="handleQuery"
-          class="!w-240px"
-        />
-      </el-form-item>
-      <el-form-item label="供应商包装单位" prop="packUnit">
-        <el-select
-          v-model="queryParams.packUnit"
-          placeholder="请选择供应商包装单位"
-          clearable
-          class="!w-240px"
-        >
-          <el-option
-            v-for="dict in getStrDictOptions(DICT_TYPE.PACK_UNIT)"
-            :key="dict.value"
-            :label="dict.label"
-            :value="dict.value"
-          />
-        </el-select>
-      </el-form-item>
-      <el-form-item label="供应商包装量" prop="packQty">
-        <el-input
-          v-model="queryParams.packQty"
-          placeholder="请输入供应商包装量"
-          clearable
-          @keyup.enter="handleQuery"
-          class="!w-240px"
-        />
-      </el-form-item>
-      <el-form-item label="供应商替代包装单位" prop="altPackUnit">
-        <el-select
-          v-model="queryParams.altPackUnit"
-          placeholder="请选择供应商替代包装单位"
-          clearable
-          class="!w-240px"
-        >
-          <el-option
-            v-for="dict in getStrDictOptions(DICT_TYPE.PACK_UNIT)"
-            :key="dict.value"
-            :label="dict.label"
-            :value="dict.value"
-          />
-        </el-select>
-      </el-form-item>
-      <el-form-item label="供应商替代包装量" prop="altPackQty">
-        <el-input
-          v-model="queryParams.altPackQty"
-          placeholder="请输入供应商替代包装量"
-          clearable
-          @keyup.enter="handleQuery"
-          class="!w-240px"
-        />
-      </el-form-item>
-      <el-form-item label="每器具包装数" prop="packQtyOfContainer">
-        <el-input
-          v-model="queryParams.packQtyOfContainer"
-          placeholder="请输入每器具包装数"
-          clearable
-          @keyup.enter="handleQuery"
-          class="!w-240px"
-        />
-      </el-form-item>
-      <el-form-item label="默认收货仓库" prop="defaultWarehouseCode">
-        <el-input
-          v-model="queryParams.defaultWarehouseCode"
-          placeholder="请输入默认收货仓库"
-          clearable
-          @keyup.enter="handleQuery"
-          class="!w-240px"
-        />
-      </el-form-item>
-      <el-form-item label="默认收货库位" prop="defaultLocationCode">
-        <el-input
-          v-model="queryParams.defaultLocationCode"
-          placeholder="请输入默认收货库位"
-          clearable
-          @keyup.enter="handleQuery"
-          class="!w-240px"
-        />
-      </el-form-item>
-      <el-form-item label="结算方式" prop="settlementType">
-        <el-select
-          v-model="queryParams.settlementType"
-          placeholder="请选择结算方式"
-          clearable
-          class="!w-240px"
-        >
-          <el-option
-            v-for="dict in getStrDictOptions(DICT_TYPE.SETTLEMENT_TYPE)"
-            :key="dict.value"
-            :label="dict.label"
-            :value="dict.value"
-          />
-        </el-select>
-      </el-form-item>
-      <el-form-item label="是否可用" prop="available">
-        <el-select
-          v-model="queryParams.available"
-          placeholder="请选择是否可用"
-          clearable
-          class="!w-240px"
-        >
-          <el-option
-            v-for="dict in getIntDictOptions(DICT_TYPE.TRUE_FALSE)"
-            :key="dict.value"
-            :label="dict.label"
-            :value="dict.value"
-          />
-        </el-select>
-      </el-form-item>
-      <el-form-item label="生效时间" prop="activeTime">
-        <el-date-picker
-          v-model="queryParams.activeTime"
-          value-format="YYYY-MM-DD HH:mm:ss"
-          type="daterange"
-          start-placeholder="开始日期"
-          end-placeholder="结束日期"
-          :default-time="[new Date('1 00:00:00'), new Date('1 23:59:59')]"
-          class="!w-240px"
-        />
-      </el-form-item>
-      <el-form-item label="失效时间" prop="expireTime">
-        <el-date-picker
-          v-model="queryParams.expireTime"
-          value-format="YYYY-MM-DD HH:mm:ss"
-          type="daterange"
-          start-placeholder="开始日期"
-          end-placeholder="结束日期"
-          :default-time="[new Date('1 00:00:00'), new Date('1 23:59:59')]"
-          class="!w-240px"
-        />
-      </el-form-item>
-      <el-form-item label="备注" prop="remark">
-        <el-input
-          v-model="queryParams.remark"
-          placeholder="请输入备注"
-          clearable
-          @keyup.enter="handleQuery"
-          class="!w-240px"
-        />
-      </el-form-item>
-      <el-form-item label="创建时间" prop="createTime">
-        <el-date-picker
-          v-model="queryParams.createTime"
-          value-format="YYYY-MM-DD HH:mm:ss"
-          type="daterange"
-          start-placeholder="开始日期"
-          end-placeholder="结束日期"
-          :default-time="[new Date('1 00:00:00'), new Date('1 23:59:59')]"
-          class="!w-240px"
-        />
-      </el-form-item>
-      <el-form-item label="创建者ID" prop="creator">
-        <el-input
-          v-model="queryParams.creator"
-          placeholder="请输入创建者ID"
-          clearable
-          @keyup.enter="handleQuery"
-          class="!w-240px"
-        />
-      </el-form-item>
-      <el-form-item>
-        <el-button type="info" plain  @click="handleQuery"><Icon icon="ep:search" class="mr-5px" /> 搜索</el-button>
-        <el-button type="info" plain  @click="resetQuery"><Icon icon="ep:refresh" class="mr-5px" /> 重置</el-button>
-        <el-button
-          type="primary"
-          @click="openForm('create')"
-          v-hasPermi="['wms:supplieritem:create']"
-        >
-          <Icon icon="ep:plus" class="mr-5px" /> 新增
-        </el-button>
-        <el-button
-          type="success"
-          @click="handleExport"
-          :loading="exportLoading"
-          v-hasPermi="['wms:supplieritem:export']"
-        >
-          <Icon icon="ep:download" class="mr-5px" /> 导出
-        </el-button>
-      </el-form-item>
-    </el-form>
   </ContentWrap>
 
+  <!-- 列表头部 -->
+  <TableHead :HeadButttondata="HeadButttondata" @button-base-click="buttonBaseClick" />
+
   <!-- 列表 -->
   <ContentWrap>
-    <el-table v-loading="loading" :data="list" :stripe="true" :show-overflow-tooltip="true">
+    <Table
-      <el-table-column label="供应商代码" align="center" prop="supplierCode" width="150px" />
+      :columns="Supplieritem.allSchemas.tableColumns"
-      <el-table-column label="物料代码" align="center" prop="itemCode" width="150px" />
+      :data="tableObject.tableList"
-      <el-table-column label="供应商物料代码" align="center" prop="supplierItemCode" width="150px" />
+      :loading="tableObject.loading"
-      <el-table-column label="供应商计量单位" align="center" prop="supplierUom" width="150px">
+      :pagination="{
-        <template #default="scope">
+        total: tableObject.total
-          <dict-tag :type="DICT_TYPE.UOM" :value="scope.row.supplierUom" />
+      }"
-        </template>
+      v-model:pageSize="tableObject.pageSize"
-      </el-table-column>
+      v-model:currentPage="tableObject.currentPage"
-      <el-table-column label="转换率" align="center" prop="convertRate" width="150px" />
+      v-model:sort="tableObject.sort"
-      <el-table-column label="供应商包装单位" align="center" prop="packUnit" width="150px">
-        <template #default="scope">
-          <dict-tag :type="DICT_TYPE.PACK_UNIT" :value="scope.row.packUnit" />
-        </template>
-      </el-table-column>
-      <el-table-column label="供应商包装量" align="center" prop="packQty" width="150px" />
-      <el-table-column label="供应商替代包装单位" align="center" prop="altPackUnit" width="150px">
-        <template #default="scope">
-          <dict-tag :type="DICT_TYPE.PACK_UNIT" :value="scope.row.altPackUnit" />
-        </template>
-      </el-table-column>
-      <el-table-column label="供应商替代包装量" align="center" prop="altPackQty" width="150px" />
-      <el-table-column label="每器具包装数" align="center" prop="packQtyOfContainer" width="150px" />
-      <el-table-column label="默认收货仓库" align="center" prop="defaultWarehouseCode" width="150px" />
-      <el-table-column label="默认收货库位" align="center" prop="defaultLocationCode" width="150px" />
-      <el-table-column label="结算方式" align="center" prop="settlementType" width="150px">
-        <template #default="scope">
-          <dict-tag :type="DICT_TYPE.SETTLEMENT_TYPE" :value="scope.row.settlementType" />
-        </template>
-      </el-table-column>
-      <el-table-column label="是否可用" align="center" prop="available" width="150px">
-        <template #default="scope">
-          <dict-tag :type="DICT_TYPE.TRUE_FALSE" :value="scope.row.available" />
-        </template>
-      </el-table-column>
-      <el-table-column
-        label="生效时间"
-        align="center"
-        prop="activeTime"
-        :formatter="dateFormatter"
-        width="150px"
-      />
-      <el-table-column
-        label="失效时间"
-        align="center"
-        prop="expireTime"
-        :formatter="dateFormatter"
-        width="150px"
-      />
-      <el-table-column label="备注" align="center" prop="remark" width="150px" />
-      <el-table-column
-        label="创建时间"
-        align="center"
-        prop="createTime"
-        :formatter="dateFormatter"
-        width="150px"
-      />
-      <el-table-column label="创建者ID" align="center" prop="creator" width="150px" />
-      <el-table-column label="操作" align="center" width="150px"  fixed="right">
-        <template #default="scope">
-          <el-button
-            link
-            type="primary"
-            @click="openForm('update', scope.row.id)"
-            v-hasPermi="['wms:supplieritem:update']"
-          >
-            编辑
-          </el-button>
-          <el-button
-            link
-            type="danger"
-            @click="handleDelete(scope.row.id)"
-            v-hasPermi="['wms:supplieritem:delete']"
     >
-            删除
+      <template #supplierCode="{row}">
+        <el-button type="primary" link @click="openDetail(row, '供应商代码', row.supplierCode)">
+          <span>{{ row.supplierCode }}</span>
         </el-button>
       </template>
-      </el-table-column>
+      <template #action="{ row }">
-    </el-table>
+        <ButtonBase :Butttondata="butttondata" @button-base-click="buttonTableClick($event,row)" />
-    <!-- 分页 -->
+      </template>
-    <Pagination
+    </Table>
-      :total="total"
-      v-model:page="queryParams.pageNo"
-      v-model:limit="queryParams.pageSize"
-      @pagination="getList"
-    />
   </ContentWrap>
 
   <!-- 表单弹窗：添加/修改 -->
-  <SupplieritemForm ref="formRef" @success="getList" />
+  <BasicForm 
+    ref="basicFormRef" 
+    @success="getList" 
+    :rules="SupplieritemRules" 
+    :formAllSchemas="Supplieritem.allSchemas" 
+    searchTableTitle="物料基础信息"
+    :searchTableAllSchemas="ItemBasic.allSchemas"
+    :searchTablePage="ItembasicApi.getItembasicPage"
+    :apiUpdate="SupplieritemApi.updateSupplieritem"
+    :apiCreate="SupplieritemApi.createSupplieritem"
+  />
+
+  <!-- 详情 -->
+  <Detail ref="detailRef" :isBasic="true" :allSchemas="Supplieritem.allSchemas" />
+
+  <!-- 导入 -->
+  <ImportForm ref="importFormRef" url="/wms/Supplieritem/import" :importTemplateData="importTemplateData" @success="importSuccess" />
 </template>
 
 <script setup lang="ts">
-import { DICT_TYPE, getStrDictOptions, getIntDictOptions } from '@/utils/dict'
-import { dateFormatter } from '@/utils/formatTime'
 import download from '@/utils/download'
 import * as SupplieritemApi from '@/api/wms/supplieritem'
-import SupplieritemForm from './SupplieritemForm.vue'
+import * as ItembasicApi from '@/api/wms/itembasic'
+import BasicForm from '@/components/BasicForm/src/BasicForm.vue'
+import { Supplieritem, SupplieritemRules, ItemBasic } from '@/utils/disposition/tableColumns'
+import * as defaultButtons from '@/utils/disposition/defaultButtons'
+import TableHead from '@/components/TableHead/src/TableHead.vue' 
+import ImportForm from '@/components/ImportForm/src/ImportForm.vue'
+import Detail from '@/components/Detail/src/Detail.vue'
 
 defineOptions({ name: 'Supplieritem' })
 
 const message = useMessage() // 消息弹窗
 const { t } = useI18n() // 国际化
 
-const loading = ref(true) // 列表的加载中
+const { tableObject, tableMethods } = useTable({
-const total = ref(0) // 列表的总页数
+  getListApi: SupplieritemApi.getSupplieritemPage // 分页接口
-const list = ref([]) // 列表的数据
-const queryParams = reactive({
-  pageNo: 1,
-  pageSize: 10,
-  supplierCode: null,
-  itemCode: null,
-  supplierItemCode: null,
-  supplierUom: null,
-  convertRate: null,
-  packUnit: null,
-  packQty: null,
-  altPackUnit: null,
-  altPackQty: null,
-  packQtyOfContainer: null,
-  defaultWarehouseCode: null,
-  defaultLocationCode: null,
-  settlementType: null,
-  available: null,
-  activeTime: [],
-  expireTime: [],
-  remark: null,
-  createTime: [],
-  creator: null
 })
-const queryFormRef = ref() // 搜索的表单
-const exportLoading = ref(false) // 导出的加载中
 
-/** 查询列表 */
+// 获得表格的各种操作
-const getList = async () => {
+const { getList, setSearchParams } = tableMethods
-  loading.value = true
+
-  try {
+// 列表头部按钮
-    const data = await SupplieritemApi.getSupplieritemPage(queryParams)
+const HeadButttondata = [
-    list.value = data.list
+  defaultButtons.defaultAddBtn({hasPermi:'wms:supplieritem:create'}), // 新增
-    total.value = data.total
+  defaultButtons.defaultImportBtn({hasPermi:'wms:supplieritem:import'}), // 导入
-  } finally {
+  defaultButtons.defaultExportBtn({hasPermi:'wms:supplieritem:export'}), // 导出
-    loading.value = false
+  // defaultButtons.defaultFilterBtn(), // 筛选
-  }
+  defaultButtons.defaultFreshBtn(null), // 刷新
-}
+  // {
+  //   label: '自定义扩展按钮',
+  //   name: 'zdy',
+  //   hide: false,
+  //   type: 'primary',
+  //   icon: 'Select',
+  //   color: ''
+  // },
+]
 
-/** 搜索按钮操作 */
+// 头部按钮事件 
-const handleQuery = () => {
+const buttonBaseClick = (val, item) => {
-  queryParams.pageNo = 1
+  if (val == 'add') { // 新增
+    openForm('create')
+  } else if (val == 'import') { // 导入
+    handleImport()
+  } else if (val == 'export') { // 导出
+    handleExport()
+  } else if (val == 'refresh') { // 刷新
     getList()
+  } else if (val == 'filtrate') { // 筛选
+  } else { // 其他按钮 
+    console.log('其他按钮', item)
+  }
 }
 
-/** 重置按钮操作 */
+// 列表-操作按钮
-const resetQuery = () => {
+const butttondata = [
-  queryFormRef.value.resetFields()
+  defaultButtons.mainListEditBtn({hasPermi:'wms:supplieritem:update'}), // 编辑
-  handleQuery()
+  defaultButtons.mainListDeleteBtn({hasPermi:'wms:supplieritem:delete'}), // 删除
+]
+
+// 列表-操作按钮事件 
+const buttonTableClick = async (val, row) => {
+  if (val == 'edit') { // 编辑
+    // const res = await SupplieritemApi.getItempackaging(row.id)
+    openForm('update', row)
+  } else if (val == 'delete') { // 删除
+    handleDelete(row.id)
+  }
 }
 
 /** 添加/修改操作 */
-const formRef = ref()
+const basicFormRef = ref()
-const openForm = (type: string, id?: number) => {
+const openForm = (type: string, row?: any) => {
-  formRef.value.open(type, id)
+  basicFormRef.value.open(type, row)
+}
+
+/** 详情操作 */
+const detailRef = ref()
+const openDetail = (row: any, titleName: any, titleValue: any) => {
+  detailRef.value.openDetail(row, titleName, titleValue)
 }
 
 /** 删除按钮操作 */
@@ -416,13 +149,14 @@ const handleDelete = async (id: number) => {
 }
 
 /** 导出按钮操作 */
+const exportLoading = ref(false) // 导出的加载中
 const handleExport = async () => {
   try {
     // 导出的二次确认
     await message.exportConfirm()
     // 发起导出
     exportLoading.value = true
-    const data = await SupplieritemApi.exportSupplieritem(queryParams)
+    const data = await SupplieritemApi.exportSupplieritem(setSearchParams)
     download.excel(data, '供应商物品.xls')
   } catch {
   } finally {
@@ -430,6 +164,21 @@ const handleExport = async () => {
   }
 }
 
+/** 导入 */
+const importFormRef = ref()
+const handleImport = () => {
+  importFormRef.value.open()
+}
+// 导入附件弹窗所需的参数
+const importTemplateData = reactive({
+  templateUrl: '',
+  templateTitle: '供应商物品导入模版.xls'
+})
+// 导入成功之后
+const importSuccess = () => {
+  getList()
+}
+
 /** 初始化 **/
 onMounted(() => {
   getList()

src/views/wms/systemcalendar/index.vue

@@ -1,271 +1,138 @@
 <template>
   <ContentWrap>
     <!-- 搜索工作栏 -->
-    <el-form
+    <Search :schema="Systemcalendar.allSchemas.searchSchema" @search="setSearchParams" @reset="setSearchParams" />
-      class="-mb-15px"
-      :model="queryParams"
-      ref="queryFormRef"
-      :inline="true"
-      label-width="68px"
-    >
-      <el-form-item label="模块" prop="module">
-        <el-input
-          v-model="queryParams.module"
-          placeholder="请输入模块"
-          clearable
-          @keyup.enter="handleQuery"
-          class="!w-240px"
-        />
-      </el-form-item>
-      <el-form-item label="开始时间" prop="startTime">
-        <el-date-picker
-          v-model="queryParams.startTime"
-          value-format="YYYY-MM-DD HH:mm:ss"
-          type="daterange"
-          start-placeholder="开始日期"
-          end-placeholder="结束日期"
-          :default-time="[new Date('1 00:00:00'), new Date('1 23:59:59')]"
-          class="!w-240px"
-        />
-      </el-form-item>
-      <el-form-item label="结束时间" prop="stopTime">
-        <el-date-picker
-          v-model="queryParams.stopTime"
-          value-format="YYYY-MM-DD HH:mm:ss"
-          type="daterange"
-          start-placeholder="开始日期"
-          end-placeholder="结束日期"
-          :default-time="[new Date('1 00:00:00'), new Date('1 23:59:59')]"
-          class="!w-240px"
-        />
-      </el-form-item>
-      <el-form-item label="是否可用" prop="available">
-        <el-select
-          v-model="queryParams.available"
-          placeholder="请选择是否可用"
-          clearable
-          class="!w-240px"
-        >
-          <el-option
-            v-for="dict in getIntDictOptions(DICT_TYPE.TRUE_FALSE)"
-            :key="dict.value"
-            :label="dict.label"
-            :value="dict.value"
-          />
-        </el-select>
-      </el-form-item>
-      <el-form-item label="生效时间" prop="activeTime">
-        <el-date-picker
-          v-model="queryParams.activeTime"
-          value-format="YYYY-MM-DD HH:mm:ss"
-          type="daterange"
-          start-placeholder="开始日期"
-          end-placeholder="结束日期"
-          :default-time="[new Date('1 00:00:00'), new Date('1 23:59:59')]"
-          class="!w-240px"
-        />
-      </el-form-item>
-      <el-form-item label="失效时间" prop="expireTime">
-        <el-date-picker
-          v-model="queryParams.expireTime"
-          value-format="YYYY-MM-DD HH:mm:ss"
-          type="daterange"
-          start-placeholder="开始日期"
-          end-placeholder="结束日期"
-          :default-time="[new Date('1 00:00:00'), new Date('1 23:59:59')]"
-          class="!w-240px"
-        />
-      </el-form-item>
-      <el-form-item label="备注" prop="remark">
-        <el-input
-          v-model="queryParams.remark"
-          placeholder="请输入备注"
-          clearable
-          @keyup.enter="handleQuery"
-          class="!w-240px"
-        />
-      </el-form-item>
-      <el-form-item label="创建时间" prop="createTime">
-        <el-date-picker
-          v-model="queryParams.createTime"
-          value-format="YYYY-MM-DD HH:mm:ss"
-          type="daterange"
-          start-placeholder="开始日期"
-          end-placeholder="结束日期"
-          :default-time="[new Date('1 00:00:00'), new Date('1 23:59:59')]"
-          class="!w-240px"
-        />
-      </el-form-item>
-      <el-form-item label="创建者ID" prop="creator">
-        <el-input
-          v-model="queryParams.creator"
-          placeholder="请输入创建者ID"
-          clearable
-          @keyup.enter="handleQuery"
-          class="!w-240px"
-        />
-      </el-form-item>
-      <el-form-item>
-        <el-button type="info" plain  @click="handleQuery"><Icon icon="ep:search" class="mr-5px" /> 搜索</el-button>
-        <el-button type="info" plain  @click="resetQuery"><Icon icon="ep:refresh" class="mr-5px" /> 重置</el-button>
-        <el-button
-          type="primary"
-          @click="openForm('create')"
-          v-hasPermi="['wms:systemcalendar:create']"
-        >
-          <Icon icon="ep:plus" class="mr-5px" /> 新增
-        </el-button>
-        <el-button
-          type="success"
-          @click="handleExport"
-          :loading="exportLoading"
-          v-hasPermi="['wms:systemcalendar:export']"
-        >
-          <Icon icon="ep:download" class="mr-5px" /> 导出
-        </el-button>
-      </el-form-item>
-    </el-form>
   </ContentWrap>
 
+  <!-- 列表头部 -->
+  <TableHead :HeadButttondata="HeadButttondata" @button-base-click="buttonBaseClick" />
+
   <!-- 列表 -->
   <ContentWrap>
-    <el-table v-loading="loading" :data="list" :stripe="true" :show-overflow-tooltip="true">
+    <Table
-      <el-table-column label="模块" align="center" prop="module" width="150px" />
+      :columns="Systemcalendar.allSchemas.tableColumns"
-      <el-table-column
+      :data="tableObject.tableList"
-        label="开始时间"
+      :loading="tableObject.loading"
-        align="center"
+      :pagination="{
-        prop="startTime"
+        total: tableObject.total
-        :formatter="dateFormatter"
+      }"
-        width="150px"
+      v-model:pageSize="tableObject.pageSize"
-      />
+      v-model:currentPage="tableObject.currentPage"
-      <el-table-column
+      v-model:sort="tableObject.sort"
-        label="结束时间"
-        align="center"
-        prop="stopTime"
-        :formatter="dateFormatter"
-        width="150px"
-      />
-      <el-table-column label="是否可用" align="center" prop="available" width="150px">
-        <template #default="scope">
-          <dict-tag :type="DICT_TYPE.TRUE_FALSE" :value="scope.row.available" />
-        </template>
-      </el-table-column>
-      <el-table-column
-        label="生效时间"
-        align="center"
-        prop="activeTime"
-        :formatter="dateFormatter"
-        width="150px"
-      />
-      <el-table-column
-        label="失效时间"
-        align="center"
-        prop="expireTime"
-        :formatter="dateFormatter"
-        width="150px"
-      />
-      <el-table-column label="备注" align="center" prop="remark" width="150px" />
-      <el-table-column
-        label="创建时间"
-        align="center"
-        prop="createTime"
-        :formatter="dateFormatter"
-        width="150px"
-      />
-      <el-table-column label="创建者ID" align="center" prop="creator" width="150px" />
-      <el-table-column label="操作" align="center" width="150px"  fixed="right">
-        <template #default="scope">
-          <el-button
-            link
-            type="primary"
-            @click="openForm('update', scope.row.id)"
-            v-hasPermi="['wms:systemcalendar:update']"
-          >
-            编辑
-          </el-button>
-          <el-button
-            link
-            type="danger"
-            @click="handleDelete(scope.row.id)"
-            v-hasPermi="['wms:systemcalendar:delete']"
     >
-            删除
+      <template #module="{row}">
+        <el-button type="primary" link @click="openDetail(row, '模块', row.module)">
+          <span>{{ row.module }}</span>
         </el-button>
       </template>
-      </el-table-column>
+      <template #action="{ row }">
-    </el-table>
+        <ButtonBase :Butttondata="butttondata" @button-base-click="buttonTableClick($event,row)" />
-    <!-- 分页 -->
+      </template>
-    <Pagination
+    </Table>
-      :total="total"
-      v-model:page="queryParams.pageNo"
-      v-model:limit="queryParams.pageSize"
-      @pagination="getList"
-    />
   </ContentWrap>
 
   <!-- 表单弹窗：添加/修改 -->
-  <SystemcalendarForm ref="formRef" @success="getList" />
+  <BasicForm 
+    ref="basicFormRef" 
+    @success="getList" 
+    :rules="SystemcalendarRules" 
+    :formAllSchemas="Systemcalendar.allSchemas" 
+    searchTableTitle="物料基础信息"
+    :searchTableAllSchemas="ItemBasic.allSchemas"
+    :searchTablePage="ItembasicApi.getItembasicPage"
+    :apiUpdate="SystemcalendarApi.updateSystemcalendar"
+    :apiCreate="SystemcalendarApi.createSystemcalendar"
+  />
+
+  <!-- 详情 -->
+  <Detail ref="detailRef" :isBasic="true" :allSchemas="Systemcalendar.allSchemas" />
+
+  <!-- 导入 -->
+  <ImportForm ref="importFormRef" url="/wms/systemcalendar/import" :importTemplateData="importTemplateData" @success="importSuccess" />
 </template>
 
 <script setup lang="ts">
-import { DICT_TYPE, getIntDictOptions } from '@/utils/dict'
-import { dateFormatter } from '@/utils/formatTime'
 import download from '@/utils/download'
 import * as SystemcalendarApi from '@/api/wms/systemcalendar'
-import SystemcalendarForm from './SystemcalendarForm.vue'
+import * as ItembasicApi from '@/api/wms/itembasic'
+import BasicForm from '@/components/BasicForm/src/BasicForm.vue'
+import { Systemcalendar, SystemcalendarRules, ItemBasic } from '@/utils/disposition/tableColumns'
+import * as defaultButtons from '@/utils/disposition/defaultButtons'
+import TableHead from '@/components/TableHead/src/TableHead.vue' 
+import ImportForm from '@/components/ImportForm/src/ImportForm.vue'
+import Detail from '@/components/Detail/src/Detail.vue'
 
 defineOptions({ name: 'Systemcalendar' })
 
 const message = useMessage() // 消息弹窗
 const { t } = useI18n() // 国际化
 
-const loading = ref(true) // 列表的加载中
+const { tableObject, tableMethods } = useTable({
-const total = ref(0) // 列表的总页数
+  getListApi: SystemcalendarApi.getSystemcalendarPage // 分页接口
-const list = ref([]) // 列表的数据
-const queryParams = reactive({
-  pageNo: 1,
-  pageSize: 10,
-  module: null,
-  startTime: [],
-  stopTime: [],
-  available: null,
-  activeTime: [],
-  expireTime: [],
-  remark: null,
-  createTime: [],
-  creator: null
 })
-const queryFormRef = ref() // 搜索的表单
-const exportLoading = ref(false) // 导出的加载中
 
-/** 查询列表 */
+// 获得表格的各种操作
-const getList = async () => {
+const { getList, setSearchParams } = tableMethods
-  loading.value = true
+
-  try {
+// 列表头部按钮
-    const data = await SystemcalendarApi.getSystemcalendarPage(queryParams)
+const HeadButttondata = [
-    list.value = data.list
+  defaultButtons.defaultAddBtn({hasPermi:'wms:systemcalendar:create'}), // 新增
-    total.value = data.total
+  defaultButtons.defaultImportBtn({hasPermi:'wms:systemcalendar:import'}), // 导入
-  } finally {
+  defaultButtons.defaultExportBtn({hasPermi:'wms:systemcalendar:export'}), // 导出
-    loading.value = false
+  // defaultButtons.defaultFilterBtn(), // 筛选
-  }
+  defaultButtons.defaultFreshBtn(null), // 刷新
-}
+  // {
+  //   label: '自定义扩展按钮',
+  //   name: 'zdy',
+  //   hide: false,
+  //   type: 'primary',
+  //   icon: 'Select',
+  //   color: ''
+  // },
+]
 
-/** 搜索按钮操作 */
+// 头部按钮事件 
-const handleQuery = () => {
+const buttonBaseClick = (val, item) => {
-  queryParams.pageNo = 1
+  if (val == 'add') { // 新增
+    openForm('create')
+  } else if (val == 'import') { // 导入
+    handleImport()
+  } else if (val == 'export') { // 导出
+    handleExport()
+  } else if (val == 'refresh') { // 刷新
     getList()
+  } else if (val == 'filtrate') { // 筛选
+  } else { // 其他按钮 
+    console.log('其他按钮', item)
+  }
 }
 
-/** 重置按钮操作 */
+// 列表-操作按钮
-const resetQuery = () => {
+const butttondata = [
-  queryFormRef.value.resetFields()
+  defaultButtons.mainListEditBtn({hasPermi:'wms:systemcalendar:update'}), // 编辑
-  handleQuery()
+  defaultButtons.mainListDeleteBtn({hasPermi:'wms:systemcalendar:delete'}), // 删除
+]
+
+// 列表-操作按钮事件 
+const buttonTableClick = async (val, row) => {
+  if (val == 'edit') { // 编辑
+    // const res = await SystemcalendarApi.getItempackaging(row.id)
+    openForm('update', row)
+  } else if (val == 'delete') { // 删除
+    handleDelete(row.id)
+  }
 }
 
 /** 添加/修改操作 */
-const formRef = ref()
+const basicFormRef = ref()
-const openForm = (type: string, id?: number) => {
+const openForm = (type: string, row?: any) => {
-  formRef.value.open(type, id)
+  basicFormRef.value.open(type, row)
+}
+
+/** 详情操作 */
+const detailRef = ref()
+const openDetail = (row: any, titleName: any, titleValue: any) => {
+  detailRef.value.openDetail(row, titleName, titleValue)
 }
 
 /** 删除按钮操作 */
@@ -282,13 +149,14 @@ const handleDelete = async (id: number) => {
 }
 
 /** 导出按钮操作 */
+const exportLoading = ref(false) // 导出的加载中
 const handleExport = async () => {
   try {
     // 导出的二次确认
     await message.exportConfirm()
     // 发起导出
     exportLoading.value = true
-    const data = await SystemcalendarApi.exportSystemcalendar(queryParams)
+    const data = await SystemcalendarApi.exportSystemcalendar(setSearchParams)
     download.excel(data, '系统日历.xls')
   } catch {
   } finally {
@@ -296,6 +164,21 @@ const handleExport = async () => {
   }
 }
 
+/** 导入 */
+const importFormRef = ref()
+const handleImport = () => {
+  importFormRef.value.open()
+}
+// 导入附件弹窗所需的参数
+const importTemplateData = reactive({
+  templateUrl: '',
+  templateTitle: '系统日历导入模版.xls'
+})
+// 导入成功之后
+const importSuccess = () => {
+  getList()
+}
+
 /** 初始化 **/
 onMounted(() => {
   getList()

src/views/wms/warehouse/index.vue

@@ -1,262 +1,138 @@
 <template>
   <ContentWrap>
     <!-- 搜索工作栏 -->
-    <el-form
+    <Search :schema="Warehouse.allSchemas.searchSchema" @search="setSearchParams" @reset="setSearchParams" />
-      class="-mb-15px"
-      :model="queryParams"
-      ref="queryFormRef"
-      :inline="true"
-      label-width="68px"
-    >
-      <el-form-item label="代码" prop="code">
-        <el-input
-          v-model="queryParams.code"
-          placeholder="请输入代码"
-          clearable
-          @keyup.enter="handleQuery"
-          class="!w-240px"
-        />
-      </el-form-item>
-      <el-form-item label="名称" prop="name">
-        <el-input
-          v-model="queryParams.name"
-          placeholder="请输入名称"
-          clearable
-          @keyup.enter="handleQuery"
-          class="!w-240px"
-        />
-      </el-form-item>
-      <el-form-item label="类型" prop="type">
-        <el-select v-model="queryParams.type" placeholder="请选择类型" clearable class="!w-240px">
-          <el-option
-            v-for="dict in getStrDictOptions(DICT_TYPE.WAREHOUSE_TYPE)"
-            :key="dict.value"
-            :label="dict.label"
-            :value="dict.value"
-          />
-        </el-select>
-      </el-form-item>
-      <el-form-item label="是否可用" prop="available">
-        <el-select
-          v-model="queryParams.available"
-          placeholder="请选择是否可用"
-          clearable
-          class="!w-240px"
-        >
-          <el-option
-            v-for="dict in getIntDictOptions(DICT_TYPE.TRUE_FALSE)"
-            :key="dict.value"
-            :label="dict.label"
-            :value="dict.value"
-          />
-        </el-select>
-      </el-form-item>
-      <el-form-item label="生效时间" prop="activeTime">
-        <el-date-picker
-          v-model="queryParams.activeTime"
-          value-format="YYYY-MM-DD HH:mm:ss"
-          type="daterange"
-          start-placeholder="开始日期"
-          end-placeholder="结束日期"
-          :default-time="[new Date('1 00:00:00'), new Date('1 23:59:59')]"
-          class="!w-240px"
-        />
-      </el-form-item>
-      <el-form-item label="失效时间" prop="expireTime">
-        <el-date-picker
-          v-model="queryParams.expireTime"
-          value-format="YYYY-MM-DD HH:mm:ss"
-          type="daterange"
-          start-placeholder="开始日期"
-          end-placeholder="结束日期"
-          :default-time="[new Date('1 00:00:00'), new Date('1 23:59:59')]"
-          class="!w-240px"
-        />
-      </el-form-item>
-      <el-form-item label="备注" prop="remark">
-        <el-input
-          v-model="queryParams.remark"
-          placeholder="请输入备注"
-          clearable
-          @keyup.enter="handleQuery"
-          class="!w-240px"
-        />
-      </el-form-item>
-      <el-form-item label="创建时间" prop="createTime">
-        <el-date-picker
-          v-model="queryParams.createTime"
-          value-format="YYYY-MM-DD HH:mm:ss"
-          type="daterange"
-          start-placeholder="开始日期"
-          end-placeholder="结束日期"
-          :default-time="[new Date('1 00:00:00'), new Date('1 23:59:59')]"
-          class="!w-240px"
-        />
-      </el-form-item>
-      <el-form-item label="创建者ID" prop="creator">
-        <el-input
-          v-model="queryParams.creator"
-          placeholder="请输入创建者ID"
-          clearable
-          @keyup.enter="handleQuery"
-          class="!w-240px"
-        />
-      </el-form-item>
-      <el-form-item>
-        <el-button type="info" plain  @click="handleQuery"><Icon icon="ep:search" class="mr-5px" /> 搜索</el-button>
-        <el-button type="info" plain  @click="resetQuery"><Icon icon="ep:refresh" class="mr-5px" /> 重置</el-button>
-        <el-button
-          type="primary"
-          @click="openForm('create')"
-          v-hasPermi="['wms:warehouse:create']"
-        >
-          <Icon icon="ep:plus" class="mr-5px" /> 新增
-        </el-button>
-        <el-button
-          type="success"
-          @click="handleExport"
-          :loading="exportLoading"
-          v-hasPermi="['wms:warehouse:export']"
-        >
-          <Icon icon="ep:download" class="mr-5px" /> 导出
-        </el-button>
-      </el-form-item>
-    </el-form>
   </ContentWrap>
 
+  <!-- 列表头部 -->
+  <TableHead :HeadButttondata="HeadButttondata" @button-base-click="buttonBaseClick" />
+
   <!-- 列表 -->
   <ContentWrap>
-    <el-table v-loading="loading" :data="list" :stripe="true" :show-overflow-tooltip="true">
+    <Table
-      <el-table-column label="代码" align="center" prop="code" width="150px" />
+      :columns="Warehouse.allSchemas.tableColumns"
-      <el-table-column label="名称" align="center" prop="name" width="150px" />
+      :data="tableObject.tableList"
-      <el-table-column label="描述" align="center" prop="description" width="150px" />
+      :loading="tableObject.loading"
-      <el-table-column label="类型" align="center" prop="type" width="150px">
+      :pagination="{
-        <template #default="scope">
+        total: tableObject.total
-          <dict-tag :type="DICT_TYPE.WAREHOUSE_TYPE" :value="scope.row.type" />
+      }"
-        </template>
+      v-model:pageSize="tableObject.pageSize"
-      </el-table-column>
+      v-model:currentPage="tableObject.currentPage"
-      <el-table-column label="是否可用" align="center" prop="available" width="150px">
+      v-model:sort="tableObject.sort"
-        <template #default="scope">
-          <dict-tag :type="DICT_TYPE.TRUE_FALSE" :value="scope.row.available" />
-        </template>
-      </el-table-column>
-      <el-table-column
-        label="生效时间"
-        align="center"
-        prop="activeTime"
-        :formatter="dateFormatter"
-        width="150px"
-      />
-      <el-table-column
-        label="失效时间"
-        align="center"
-        prop="expireTime"
-        :formatter="dateFormatter"
-        width="150px"
-      />
-      <el-table-column label="备注" align="center" prop="remark" width="150px" />
-      <el-table-column
-        label="创建时间"
-        align="center"
-        prop="createTime"
-        :formatter="dateFormatter"
-        width="150px"
-      />
-      <el-table-column label="创建者ID" align="center" prop="creator" width="150px" />
-      <el-table-column label="操作" align="center" width="150px"  fixed="right">
-        <template #default="scope">
-          <el-button
-            link
-            type="primary"
-            @click="openForm('update', scope.row.id)"
-            v-hasPermi="['wms:warehouse:update']"
-          >
-            编辑
-          </el-button>
-          <el-button
-            link
-            type="danger"
-            @click="handleDelete(scope.row.id)"
-            v-hasPermi="['wms:warehouse:delete']"
     >
-            删除
+      <template #code="{row}">
+        <el-button type="primary" link @click="openDetail(row, '代码', row.code)">
+          <span>{{ row.code }}</span>
         </el-button>
       </template>
-      </el-table-column>
+      <template #action="{ row }">
-    </el-table>
+        <ButtonBase :Butttondata="butttondata" @button-base-click="buttonTableClick($event,row)" />
-    <!-- 分页 -->
+      </template>
-    <Pagination
+    </Table>
-      :total="total"
-      v-model:page="queryParams.pageNo"
-      v-model:limit="queryParams.pageSize"
-      @pagination="getList"
-    />
   </ContentWrap>
 
   <!-- 表单弹窗：添加/修改 -->
-  <WarehouseForm ref="formRef" @success="getList" />
+  <BasicForm 
+    ref="basicFormRef" 
+    @success="getList" 
+    :rules="WarehouseRules" 
+    :formAllSchemas="Warehouse.allSchemas" 
+    searchTableTitle="物料基础信息"
+    :searchTableAllSchemas="ItemBasic.allSchemas"
+    :searchTablePage="ItembasicApi.getItembasicPage"
+    :apiUpdate="WarehouseApi.updateWarehouse"
+    :apiCreate="WarehouseApi.createWarehouse"
+  />
+
+  <!-- 详情 -->
+  <Detail ref="detailRef" :isBasic="true" :allSchemas="Warehouse.allSchemas" />
+
+  <!-- 导入 -->
+  <ImportForm ref="importFormRef" url="/wms/warehouse/import" :importTemplateData="importTemplateData" @success="importSuccess" />
 </template>
 
 <script setup lang="ts">
-import { DICT_TYPE, getStrDictOptions, getIntDictOptions } from '@/utils/dict'
-import { dateFormatter } from '@/utils/formatTime'
 import download from '@/utils/download'
 import * as WarehouseApi from '@/api/wms/warehouse'
-import WarehouseForm from './WarehouseForm.vue'
+import * as ItembasicApi from '@/api/wms/itembasic'
+import BasicForm from '@/components/BasicForm/src/BasicForm.vue'
+import { Warehouse, WarehouseRules, ItemBasic } from '@/utils/disposition/tableColumns'
+import * as defaultButtons from '@/utils/disposition/defaultButtons'
+import TableHead from '@/components/TableHead/src/TableHead.vue' 
+import ImportForm from '@/components/ImportForm/src/ImportForm.vue'
+import Detail from '@/components/Detail/src/Detail.vue'
 
 defineOptions({ name: 'Warehouse' })
 
 const message = useMessage() // 消息弹窗
 const { t } = useI18n() // 国际化
 
-const loading = ref(true) // 列表的加载中
+const { tableObject, tableMethods } = useTable({
-const total = ref(0) // 列表的总页数
+  getListApi: WarehouseApi.getWarehousePage // 分页接口
-const list = ref([]) // 列表的数据
-const queryParams = reactive({
-  pageNo: 1,
-  pageSize: 10,
-  code: null,
-  name: null,
-  description: null,
-  type: null,
-  available: null,
-  activeTime: [],
-  expireTime: [],
-  remark: null,
-  createTime: [],
-  creator: null
 })
-const queryFormRef = ref() // 搜索的表单
-const exportLoading = ref(false) // 导出的加载中
 
-/** 查询列表 */
+// 获得表格的各种操作
-const getList = async () => {
+const { getList, setSearchParams } = tableMethods
-  loading.value = true
+
-  try {
+// 列表头部按钮
-    const data = await WarehouseApi.getWarehousePage(queryParams)
+const HeadButttondata = [
-    list.value = data.list
+  defaultButtons.defaultAddBtn({hasPermi:'wms:warehouse:create'}), // 新增
-    total.value = data.total
+  defaultButtons.defaultImportBtn({hasPermi:'wms:warehouse:import'}), // 导入
-  } finally {
+  defaultButtons.defaultExportBtn({hasPermi:'wms:warehouse:export'}), // 导出
-    loading.value = false
+  // defaultButtons.defaultFilterBtn(), // 筛选
-  }
+  defaultButtons.defaultFreshBtn(null), // 刷新
-}
+  // {
+  //   label: '自定义扩展按钮',
+  //   name: 'zdy',
+  //   hide: false,
+  //   type: 'primary',
+  //   icon: 'Select',
+  //   color: ''
+  // },
+]
 
-/** 搜索按钮操作 */
+// 头部按钮事件 
-const handleQuery = () => {
+const buttonBaseClick = (val, item) => {
-  queryParams.pageNo = 1
+  if (val == 'add') { // 新增
+    openForm('create')
+  } else if (val == 'import') { // 导入
+    handleImport()
+  } else if (val == 'export') { // 导出
+    handleExport()
+  } else if (val == 'refresh') { // 刷新
     getList()
+  } else if (val == 'filtrate') { // 筛选
+  } else { // 其他按钮 
+    console.log('其他按钮', item)
+  }
 }
 
-/** 重置按钮操作 */
+// 列表-操作按钮
-const resetQuery = () => {
+const butttondata = [
-  queryFormRef.value.resetFields()
+  defaultButtons.mainListEditBtn({hasPermi:'wms:warehouse:update'}), // 编辑
-  handleQuery()
+  defaultButtons.mainListDeleteBtn({hasPermi:'wms:warehouse:delete'}), // 删除
+]
+
+// 列表-操作按钮事件 
+const buttonTableClick = async (val, row) => {
+  if (val == 'edit') { // 编辑
+    // const res = await WarehouseApi.getItempackaging(row.id)
+    openForm('update', row)
+  } else if (val == 'delete') { // 删除
+    handleDelete(row.id)
+  }
 }
 
 /** 添加/修改操作 */
-const formRef = ref()
+const basicFormRef = ref()
-const openForm = (type: string, id?: number) => {
+const openForm = (type: string, row?: any) => {
-  formRef.value.open(type, id)
+  basicFormRef.value.open(type, row)
+}
+
+/** 详情操作 */
+const detailRef = ref()
+const openDetail = (row: any, titleName: any, titleValue: any) => {
+  detailRef.value.openDetail(row, titleName, titleValue)
 }
 
 /** 删除按钮操作 */
@@ -273,13 +149,14 @@ const handleDelete = async (id: number) => {
 }
 
 /** 导出按钮操作 */
+const exportLoading = ref(false) // 导出的加载中
 const handleExport = async () => {
   try {
     // 导出的二次确认
     await message.exportConfirm()
     // 发起导出
     exportLoading.value = true
-    const data = await WarehouseApi.exportWarehouse(queryParams)
+    const data = await WarehouseApi.exportWarehouse(setSearchParams)
     download.excel(data, '仓库.xls')
   } catch {
   } finally {
@@ -287,6 +164,21 @@ const handleExport = async () => {
   }
 }
 
+/** 导入 */
+const importFormRef = ref()
+const handleImport = () => {
+  importFormRef.value.open()
+}
+// 导入附件弹窗所需的参数
+const importTemplateData = reactive({
+  templateUrl: '',
+  templateTitle: '仓库导入模版.xls'
+})
+// 导入成功之后
+const importSuccess = () => {
+  getList()
+}
+
 /** 初始化 **/
 onMounted(() => {
   getList()

src/views/wms/workshop/index.vue

@@ -1,258 +1,138 @@
 <template>
   <ContentWrap>
     <!-- 搜索工作栏 -->
-    <el-form
+    <Search :schema="Workshop.allSchemas.searchSchema" @search="setSearchParams" @reset="setSearchParams" />
-      class="-mb-15px"
-      :model="queryParams"
-      ref="queryFormRef"
-      :inline="true"
-      label-width="68px"
-    >
-      <el-form-item label="代码" prop="code">
-        <el-input
-          v-model="queryParams.code"
-          placeholder="请输入代码"
-          clearable
-          @keyup.enter="handleQuery"
-          class="!w-240px"
-        />
-      </el-form-item>
-      <el-form-item label="名称" prop="name">
-        <el-input
-          v-model="queryParams.name"
-          placeholder="请输入名称"
-          clearable
-          @keyup.enter="handleQuery"
-          class="!w-240px"
-        />
-      </el-form-item>
-      <el-form-item label="类型" prop="type">
-        <el-select v-model="queryParams.type" placeholder="请选择类型" clearable class="!w-240px">
-          <el-option
-            v-for="dict in getStrDictOptions(DICT_TYPE.WORKSHOP_TYPE)"
-            :key="dict.value"
-            :label="dict.label"
-            :value="dict.value"
-          />
-        </el-select>
-      </el-form-item>
-      <el-form-item label="是否可用" prop="available">
-        <el-select
-          v-model="queryParams.available"
-          placeholder="请选择是否可用"
-          clearable
-          class="!w-240px"
-        >
-          <el-option
-            v-for="dict in getIntDictOptions(DICT_TYPE.TRUE_FALSE)"
-            :key="dict.value"
-            :label="dict.label"
-            :value="dict.value"
-          />
-        </el-select>
-      </el-form-item>
-      <el-form-item label="生效时间" prop="activeTime">
-        <el-date-picker
-          v-model="queryParams.activeTime"
-          value-format="YYYY-MM-DD HH:mm:ss"
-          type="daterange"
-          start-placeholder="开始日期"
-          end-placeholder="结束日期"
-          :default-time="[new Date('1 00:00:00'), new Date('1 23:59:59')]"
-          class="!w-240px"
-        />
-      </el-form-item>
-      <el-form-item label="失效时间" prop="expireTime">
-        <el-date-picker
-          v-model="queryParams.expireTime"
-          value-format="YYYY-MM-DD HH:mm:ss"
-          type="daterange"
-          start-placeholder="开始日期"
-          end-placeholder="结束日期"
-          :default-time="[new Date('1 00:00:00'), new Date('1 23:59:59')]"
-          class="!w-240px"
-        />
-      </el-form-item>
-      <el-form-item label="备注" prop="remark">
-        <el-input
-          v-model="queryParams.remark"
-          placeholder="请输入备注"
-          clearable
-          @keyup.enter="handleQuery"
-          class="!w-240px"
-        />
-      </el-form-item>
-      <el-form-item label="创建时间" prop="createTime">
-        <el-date-picker
-          v-model="queryParams.createTime"
-          value-format="YYYY-MM-DD HH:mm:ss"
-          type="daterange"
-          start-placeholder="开始日期"
-          end-placeholder="结束日期"
-          :default-time="[new Date('1 00:00:00'), new Date('1 23:59:59')]"
-          class="!w-240px"
-        />
-      </el-form-item>
-      <el-form-item label="创建者ID" prop="creator">
-        <el-input
-          v-model="queryParams.creator"
-          placeholder="请输入创建者ID"
-          clearable
-          @keyup.enter="handleQuery"
-          class="!w-240px"
-        />
-      </el-form-item>
-      <el-form-item>
-        <el-button type="info" plain  @click="handleQuery"><Icon icon="ep:search" class="mr-5px" /> 搜索</el-button>
-        <el-button type="info" plain  @click="resetQuery"><Icon icon="ep:refresh" class="mr-5px" /> 重置</el-button>
-        <el-button type="primary" @click="openForm('create')" v-hasPermi="['wms:workshop:create']">
-          <Icon icon="ep:plus" class="mr-5px" /> 新增
-        </el-button>
-        <el-button
-          type="success"
-          @click="handleExport"
-          :loading="exportLoading"
-          v-hasPermi="['wms:workshop:export']"
-        >
-          <Icon icon="ep:download" class="mr-5px" /> 导出
-        </el-button>
-      </el-form-item>
-    </el-form>
   </ContentWrap>
 
+  <!-- 列表头部 -->
+  <TableHead :HeadButttondata="HeadButttondata" @button-base-click="buttonBaseClick" />
+
   <!-- 列表 -->
   <ContentWrap>
-    <el-table v-loading="loading" :data="list" :stripe="true" :show-overflow-tooltip="true">
+    <Table
-      <el-table-column label="代码" align="center" prop="code" width="150px" />
+      :columns="Workshop.allSchemas.tableColumns"
-      <el-table-column label="名称" align="center" prop="name" width="150px" />
+      :data="tableObject.tableList"
-      <el-table-column label="描述" align="center" prop="description" width="150px" />
+      :loading="tableObject.loading"
-      <el-table-column label="类型" align="center" prop="type" width="150px">
+      :pagination="{
-        <template #default="scope">
+        total: tableObject.total
-          <dict-tag :type="DICT_TYPE.WORKSHOP_TYPE" :value="scope.row.type" />
+      }"
-        </template>
+      v-model:pageSize="tableObject.pageSize"
-      </el-table-column>
+      v-model:currentPage="tableObject.currentPage"
-      <el-table-column label="是否可用" align="center" prop="available" width="150px">
+      v-model:sort="tableObject.sort"
-        <template #default="scope">
-          <dict-tag :type="DICT_TYPE.TRUE_FALSE" :value="scope.row.available" />
-        </template>
-      </el-table-column>
-      <el-table-column
-        label="生效时间"
-        align="center"
-        prop="activeTime"
-        :formatter="dateFormatter"
-        width="150px"
-      />
-      <el-table-column
-        label="失效时间"
-        align="center"
-        prop="expireTime"
-        :formatter="dateFormatter"
-        width="150px"
-      />
-      <el-table-column label="备注" align="center" prop="remark" width="150px" />
-      <el-table-column
-        label="创建时间"
-        align="center"
-        prop="createTime"
-        :formatter="dateFormatter"
-        width="150px"
-      />
-      <el-table-column label="创建者ID" align="center" prop="creator" width="150px" />
-      <el-table-column label="操作" align="center" width="150px"  fixed="right">
-        <template #default="scope">
-          <el-button
-            link
-            type="primary"
-            @click="openForm('update', scope.row.id)"
-            v-hasPermi="['wms:workshop:update']"
-          >
-            编辑
-          </el-button>
-          <el-button
-            link
-            type="danger"
-            @click="handleDelete(scope.row.id)"
-            v-hasPermi="['wms:workshop:delete']"
     >
-            删除
+      <template #code="{row}">
+        <el-button type="primary" link @click="openDetail(row, '代码', row.code)">
+          <span>{{ row.code }}</span>
         </el-button>
       </template>
-      </el-table-column>
+      <template #action="{ row }">
-    </el-table>
+        <ButtonBase :Butttondata="butttondata" @button-base-click="buttonTableClick($event,row)" />
-    <!-- 分页 -->
+      </template>
-    <Pagination
+    </Table>
-      :total="total"
-      v-model:page="queryParams.pageNo"
-      v-model:limit="queryParams.pageSize"
-      @pagination="getList"
-    />
   </ContentWrap>
 
   <!-- 表单弹窗：添加/修改 -->
-  <WorkshopForm ref="formRef" @success="getList" />
+  <BasicForm 
+    ref="basicFormRef" 
+    @success="getList" 
+    :rules="WorkshopRules" 
+    :formAllSchemas="Workshop.allSchemas" 
+    searchTableTitle="物料基础信息"
+    :searchTableAllSchemas="ItemBasic.allSchemas"
+    :searchTablePage="ItembasicApi.getItembasicPage"
+    :apiUpdate="WorkshopApi.updateWorkshop"
+    :apiCreate="WorkshopApi.createWorkshop"
+  />
+
+  <!-- 详情 -->
+  <Detail ref="detailRef" :isBasic="true" :allSchemas="Workshop.allSchemas" />
+
+  <!-- 导入 -->
+  <ImportForm ref="importFormRef" url="/wms/workshop/import" :importTemplateData="importTemplateData" @success="importSuccess" />
 </template>
 
 <script setup lang="ts">
-import { DICT_TYPE, getStrDictOptions, getIntDictOptions } from '@/utils/dict'
-import { dateFormatter } from '@/utils/formatTime'
 import download from '@/utils/download'
 import * as WorkshopApi from '@/api/wms/workshop'
-import WorkshopForm from './WorkshopForm.vue'
+import * as ItembasicApi from '@/api/wms/itembasic'
+import BasicForm from '@/components/BasicForm/src/BasicForm.vue'
+import { Workshop, WorkshopRules, ItemBasic } from '@/utils/disposition/tableColumns'
+import * as defaultButtons from '@/utils/disposition/defaultButtons'
+import TableHead from '@/components/TableHead/src/TableHead.vue' 
+import ImportForm from '@/components/ImportForm/src/ImportForm.vue'
+import Detail from '@/components/Detail/src/Detail.vue'
 
 defineOptions({ name: 'Workshop' })
 
 const message = useMessage() // 消息弹窗
 const { t } = useI18n() // 国际化
 
-const loading = ref(true) // 列表的加载中
+const { tableObject, tableMethods } = useTable({
-const total = ref(0) // 列表的总页数
+  getListApi: WorkshopApi.getWorkshopPage // 分页接口
-const list = ref([]) // 列表的数据
-const queryParams = reactive({
-  pageNo: 1,
-  pageSize: 10,
-  code: null,
-  name: null,
-  description: null,
-  type: null,
-  available: null,
-  activeTime: [],
-  expireTime: [],
-  remark: null,
-  createTime: [],
-  creator: null
 })
-const queryFormRef = ref() // 搜索的表单
-const exportLoading = ref(false) // 导出的加载中
 
-/** 查询列表 */
+// 获得表格的各种操作
-const getList = async () => {
+const { getList, setSearchParams } = tableMethods
-  loading.value = true
+
-  try {
+// 列表头部按钮
-    const data = await WorkshopApi.getWorkshopPage(queryParams)
+const HeadButttondata = [
-    list.value = data.list
+  defaultButtons.defaultAddBtn({hasPermi:'wms:workshop:create'}), // 新增
-    total.value = data.total
+  defaultButtons.defaultImportBtn({hasPermi:'wms:workshop:import'}), // 导入
-  } finally {
+  defaultButtons.defaultExportBtn({hasPermi:'wms:workshop:export'}), // 导出
-    loading.value = false
+  // defaultButtons.defaultFilterBtn(), // 筛选
-  }
+  defaultButtons.defaultFreshBtn(null), // 刷新
-}
+  // {
+  //   label: '自定义扩展按钮',
+  //   name: 'zdy',
+  //   hide: false,
+  //   type: 'primary',
+  //   icon: 'Select',
+  //   color: ''
+  // },
+]
 
-/** 搜索按钮操作 */
+// 头部按钮事件 
-const handleQuery = () => {
+const buttonBaseClick = (val, item) => {
-  queryParams.pageNo = 1
+  if (val == 'add') { // 新增
+    openForm('create')
+  } else if (val == 'import') { // 导入
+    handleImport()
+  } else if (val == 'export') { // 导出
+    handleExport()
+  } else if (val == 'refresh') { // 刷新
     getList()
+  } else if (val == 'filtrate') { // 筛选
+  } else { // 其他按钮 
+    console.log('其他按钮', item)
+  }
 }
 
-/** 重置按钮操作 */
+// 列表-操作按钮
-const resetQuery = () => {
+const butttondata = [
-  queryFormRef.value.resetFields()
+  defaultButtons.mainListEditBtn({hasPermi:'wms:workshop:update'}), // 编辑
-  handleQuery()
+  defaultButtons.mainListDeleteBtn({hasPermi:'wms:workshop:delete'}), // 删除
+]
+
+// 列表-操作按钮事件 
+const buttonTableClick = async (val, row) => {
+  if (val == 'edit') { // 编辑
+    // const res = await WorkshopApi.getItempackaging(row.id)
+    openForm('update', row)
+  } else if (val == 'delete') { // 删除
+    handleDelete(row.id)
+  }
 }
 
 /** 添加/修改操作 */
-const formRef = ref()
+const basicFormRef = ref()
-const openForm = (type: string, id?: number) => {
+const openForm = (type: string, row?: any) => {
-  formRef.value.open(type, id)
+  basicFormRef.value.open(type, row)
+}
+
+/** 详情操作 */
+const detailRef = ref()
+const openDetail = (row: any, titleName: any, titleValue: any) => {
+  detailRef.value.openDetail(row, titleName, titleValue)
 }
 
 /** 删除按钮操作 */
@@ -269,13 +149,14 @@ const handleDelete = async (id: number) => {
 }
 
 /** 导出按钮操作 */
+const exportLoading = ref(false) // 导出的加载中
 const handleExport = async () => {
   try {
     // 导出的二次确认
     await message.exportConfirm()
     // 发起导出
     exportLoading.value = true
-    const data = await WorkshopApi.exportWorkshop(queryParams)
+    const data = await WorkshopApi.exportWorkshop(setSearchParams)
     download.excel(data, '车间.xls')
   } catch {
   } finally {
@@ -283,6 +164,21 @@ const handleExport = async () => {
   }
 }
 
+/** 导入 */
+const importFormRef = ref()
+const handleImport = () => {
+  importFormRef.value.open()
+}
+// 导入附件弹窗所需的参数
+const importTemplateData = reactive({
+  templateUrl: '',
+  templateTitle: '车间导入模版.xls'
+})
+// 导入成功之后
+const importSuccess = () => {
+  getList()
+}
+
 /** 初始化 **/
 onMounted(() => {
   getList()

src/views/wms/workstation/index.vue

@@ -1,323 +1,138 @@
 <template>
   <ContentWrap>
     <!-- 搜索工作栏 -->
-    <el-form
+    <Search :schema="Workstation.allSchemas.searchSchema" @search="setSearchParams" @reset="setSearchParams" />
-      class="-mb-15px"
-      :model="queryParams"
-      ref="queryFormRef"
-      :inline="true"
-      label-width="68px"
-    >
-      <el-form-item label="代码" prop="code">
-        <el-input
-          v-model="queryParams.code"
-          placeholder="请输入代码"
-          clearable
-          @keyup.enter="handleQuery"
-          class="!w-240px"
-        />
-      </el-form-item>
-      <el-form-item label="名称" prop="name">
-        <el-input
-          v-model="queryParams.name"
-          placeholder="请输入名称"
-          clearable
-          @keyup.enter="handleQuery"
-          class="!w-240px"
-        />
-      </el-form-item>
-      <el-form-item label="类型" prop="type">
-        <el-select v-model="queryParams.type" placeholder="请选择类型" clearable class="!w-240px">
-          <el-option
-            v-for="dict in getStrDictOptions(DICT_TYPE.WORK_STATION_TYPE)"
-            :key="dict.value"
-            :label="dict.label"
-            :value="dict.value"
-          />
-        </el-select>
-      </el-form-item>
-      <el-form-item label="车间代码" prop="workshopCode">
-        <el-input
-          v-model="queryParams.workshopCode"
-          placeholder="请输入车间代码"
-          clearable
-          @keyup.enter="handleQuery"
-          class="!w-240px"
-        />
-      </el-form-item>
-      <el-form-item label="生产线代码" prop="productionLineCode">
-        <el-input
-          v-model="queryParams.productionLineCode"
-          placeholder="请输入生产线代码"
-          clearable
-          @keyup.enter="handleQuery"
-          class="!w-240px"
-        />
-      </el-form-item>
-      <el-form-item label="原料库位" prop="rawLocationCode">
-        <el-input
-          v-model="queryParams.rawLocationCode"
-          placeholder="请输入原料库位"
-          clearable
-          @keyup.enter="handleQuery"
-          class="!w-240px"
-        />
-      </el-form-item>
-      <el-form-item label="成品库位" prop="fgLocationCode">
-        <el-input
-          v-model="queryParams.fgLocationCode"
-          placeholder="请输入成品库位"
-          clearable
-          @keyup.enter="handleQuery"
-          class="!w-240px"
-        />
-      </el-form-item>
-      <el-form-item label="是否可用" prop="available">
-        <el-select
-          v-model="queryParams.available"
-          placeholder="请选择是否可用"
-          clearable
-          class="!w-240px"
-        >
-          <el-option
-            v-for="dict in getStrDictOptions(DICT_TYPE.TRUE_FALSE)"
-            :key="dict.value"
-            :label="dict.label"
-            :value="dict.value"
-          />
-        </el-select>
-      </el-form-item>
-      <el-form-item label="生效时间" prop="activeTime">
-        <el-date-picker
-          v-model="queryParams.activeTime"
-          value-format="YYYY-MM-DD HH:mm:ss"
-          type="daterange"
-          start-placeholder="开始日期"
-          end-placeholder="结束日期"
-          :default-time="[new Date('1 00:00:00'), new Date('1 23:59:59')]"
-          class="!w-240px"
-        />
-      </el-form-item>
-      <el-form-item label="失效时间" prop="expireTime">
-        <el-date-picker
-          v-model="queryParams.expireTime"
-          value-format="YYYY-MM-DD HH:mm:ss"
-          type="daterange"
-          start-placeholder="开始日期"
-          end-placeholder="结束日期"
-          :default-time="[new Date('1 00:00:00'), new Date('1 23:59:59')]"
-          class="!w-240px"
-        />
-      </el-form-item>
-      <el-form-item label="备注" prop="remark">
-        <el-input
-          v-model="queryParams.remark"
-          placeholder="请输入备注"
-          clearable
-          @keyup.enter="handleQuery"
-          class="!w-240px"
-        />
-      </el-form-item>
-      <el-form-item label="创建时间" prop="createTime">
-        <el-date-picker
-          v-model="queryParams.createTime"
-          value-format="YYYY-MM-DD HH:mm:ss"
-          type="daterange"
-          start-placeholder="开始日期"
-          end-placeholder="结束日期"
-          :default-time="[new Date('1 00:00:00'), new Date('1 23:59:59')]"
-          class="!w-240px"
-        />
-      </el-form-item>
-      <el-form-item label="创建者ID" prop="creator">
-        <el-input
-          v-model="queryParams.creator"
-          placeholder="请输入创建者ID"
-          clearable
-          @keyup.enter="handleQuery"
-          class="!w-240px"
-        />
-      </el-form-item>
-      <el-form-item>
-        <el-button type="info" plain  @click="handleQuery"><Icon icon="ep:search" class="mr-5px" /> 搜索</el-button>
-        <el-button type="info" plain  @click="resetQuery"><Icon icon="ep:refresh" class="mr-5px" /> 重置</el-button>
-        <el-button
-          type="primary"
-          @click="openForm('create')"
-          v-hasPermi="['wms:workstation:create']"
-        >
-          <Icon icon="ep:plus" class="mr-5px" /> 新增
-        </el-button>
-        <el-button
-          type="warning" 
-          @click="handleImport" 
-          v-hasPermi="['wms:workstation:import']">
-              <Icon icon="ep:upload" /> 导入
-            </el-button>
-        <el-button
-          type="success"
-          @click="handleExport"
-          :loading="exportLoading"
-          v-hasPermi="['wms:workstation:export']"
-        >
-          <Icon icon="ep:download" class="mr-5px" /> 导出
-        </el-button>
-      </el-form-item>
-    </el-form>
   </ContentWrap>
 
+  <!-- 列表头部 -->
+  <TableHead :HeadButttondata="HeadButttondata" @button-base-click="buttonBaseClick" />
+
   <!-- 列表 -->
   <ContentWrap>
-    <el-table v-loading="loading" :data="list" :stripe="true" :show-overflow-tooltip="true">
+    <Table
-      <el-table-column label="代码" align="center" prop="code" width="150px" />
+      :columns="Workstation.allSchemas.tableColumns"
-      <el-table-column label="名称" align="center" prop="name" width="150px" />
+      :data="tableObject.tableList"
-      <el-table-column label="描述" align="center" prop="description" width="150px" />
+      :loading="tableObject.loading"
-      <el-table-column label="类型" align="center" prop="type" width="150px">
+      :pagination="{
-        <template #default="scope">
+        total: tableObject.total
-          <dict-tag :type="DICT_TYPE.WORK_STATION_TYPE" :value="scope.row.type" />
+      }"
-        </template>
+      v-model:pageSize="tableObject.pageSize"
-      </el-table-column>
+      v-model:currentPage="tableObject.currentPage"
-      <el-table-column label="车间代码" align="center" prop="workshopCode" width="150px" />
+      v-model:sort="tableObject.sort"
-      <el-table-column label="生产线代码" align="center" prop="productionLineCode" width="150px" />
-      <el-table-column label="原料库位" align="center" prop="rawLocationCode" width="150px" />
-      <el-table-column label="成品库位" align="center" prop="fgLocationCode" width="150px" />
-      <el-table-column label="是否可用" align="center" prop="available" width="150px">
-        <template #default="scope">
-          <dict-tag :type="DICT_TYPE.TRUE_FALSE" :value="scope.row.available" />
-        </template>
-      </el-table-column>
-      <el-table-column
-        label="生效时间"
-        align="center"
-        prop="activeTime"
-        :formatter="dateFormatter"
-        width="150px"
-      />
-      <el-table-column
-        label="失效时间"
-        align="center"
-        prop="expireTime"
-        :formatter="dateFormatter"
-        width="150px"
-      />
-      <el-table-column label="备注" align="center" prop="remark" width="150px" />
-      <el-table-column
-        label="创建时间"
-        align="center"
-        prop="createTime"
-        :formatter="dateFormatter"
-        width="150px"
-      />
-      <el-table-column label="创建者ID" align="center" prop="creator" width="150px" />
-      <el-table-column label="操作" align="center" width="150px"  fixed="right">
-        <template #default="scope">
-          <el-button
-            link
-            type="primary"
-            @click="openForm('update', scope.row.id)"
-            v-hasPermi="['wms:workstation:update']"
     >
-            编辑
+      <template #code="{row}">
-          </el-button>
+        <el-button type="primary" link @click="openDetail(row, '代码', row.code)">
-          <el-button
+          <span>{{ row.code }}</span>
-            link
-            type="danger"
-            @click="handleDelete(scope.row.id)"
-            v-hasPermi="['wms:workstation:delete']"
-          >
-            删除
         </el-button>
       </template>
-      </el-table-column>
+      <template #action="{ row }">
-    </el-table>
+        <ButtonBase :Butttondata="butttondata" @button-base-click="buttonTableClick($event,row)" />
-    <!-- 分页 -->
+      </template>
-    <Pagination
+    </Table>
-      :total="total"
-      v-model:page="queryParams.pageNo"
-      v-model:limit="queryParams.pageSize"
-      @pagination="getList"
-    />
   </ContentWrap>
 
   <!-- 表单弹窗：添加/修改 -->
-  <WorkstationForm ref="formRef" @success="getList" />
+  <BasicForm 
+    ref="basicFormRef" 
+    @success="getList" 
+    :rules="WorkstationRules" 
+    :formAllSchemas="Workstation.allSchemas" 
+    searchTableTitle="物料基础信息"
+    :searchTableAllSchemas="ItemBasic.allSchemas"
+    :searchTablePage="ItembasicApi.getItembasicPage"
+    :apiUpdate="WorkstationApi.updateWorkstation"
+    :apiCreate="WorkstationApi.createWorkstation"
+  />
 
-  <!-- 用户导入对话框 -->
+  <!-- 详情 -->
-  <WorkstationImportForm ref="importFormRef" @success="getList" />
+  <Detail ref="detailRef" :isBasic="true" :allSchemas="Workstation.allSchemas" />
+
+  <!-- 导入 -->
+  <ImportForm ref="importFormRef" url="/wms/workstation/import" :importTemplateData="importTemplateData" @success="importSuccess" />
 </template>
 
 <script setup lang="ts">
-import { DICT_TYPE, getStrDictOptions} from '@/utils/dict'
-import { dateFormatter } from '@/utils/formatTime'
 import download from '@/utils/download'
 import * as WorkstationApi from '@/api/wms/workstation'
-import WorkstationForm from './WorkstationForm.vue'
+import * as ItembasicApi from '@/api/wms/itembasic'
-import WorkstationImportForm from './WorkstationImportForm.vue'
+import BasicForm from '@/components/BasicForm/src/BasicForm.vue'
+import { Workstation, WorkstationRules, ItemBasic } from '@/utils/disposition/tableColumns'
+import * as defaultButtons from '@/utils/disposition/defaultButtons'
+import TableHead from '@/components/TableHead/src/TableHead.vue' 
+import ImportForm from '@/components/ImportForm/src/ImportForm.vue'
+import Detail from '@/components/Detail/src/Detail.vue'
 
 defineOptions({ name: 'Workstation' })
 
 const message = useMessage() // 消息弹窗
 const { t } = useI18n() // 国际化
 
-const loading = ref(true) // 列表的加载中
+const { tableObject, tableMethods } = useTable({
-const total = ref(0) // 列表的总页数
+  getListApi: WorkstationApi.getWorkstationPage // 分页接口
-const list = ref([]) // 列表的数据
-const queryParams = reactive({
-  pageNo: 1,
-  pageSize: 10,
-  code: null,
-  name: null,
-  description: null,
-  type: null,
-  workshopCode: null,
-  productionLineCode: null,
-  rawLocationCode: null,
-  fgLocationCode: null,
-  available: null,
-  activeTime: [],
-  expireTime: [],
-  remark: null,
-  createTime: [],
-  creator: null
 })
-const queryFormRef = ref() // 搜索的表单
-const exportLoading = ref(false) // 导出的加载中
 
-/** 查询列表 */
+// 获得表格的各种操作
-const getList = async () => {
+const { getList, setSearchParams } = tableMethods
-  loading.value = true
-  try {
-    const data = await WorkstationApi.getWorkstationPage(queryParams)
-    list.value = data.list
-    total.value = data.total
-  } finally {
-    loading.value = false
-  }
-}
 
-/** 搜索按钮操作 */
+// 列表头部按钮
-const handleQuery = () => {
+const HeadButttondata = [
-  queryParams.pageNo = 1
+  defaultButtons.defaultAddBtn({hasPermi:'wms:workstation:create'}), // 新增
-  getList()
+  defaultButtons.defaultImportBtn({hasPermi:'wms:workstation:import'}), // 导入
-}
+  defaultButtons.defaultExportBtn({hasPermi:'wms:workstation:export'}), // 导出
+  // defaultButtons.defaultFilterBtn(), // 筛选
+  defaultButtons.defaultFreshBtn(null), // 刷新
+  // {
+  //   label: '自定义扩展按钮',
+  //   name: 'zdy',
+  //   hide: false,
+  //   type: 'primary',
+  //   icon: 'Select',
+  //   color: ''
+  // },
+]
 
-/** 重置按钮操作 */
+// 头部按钮事件 
-const resetQuery = () => {
+const buttonBaseClick = (val, item) => {
-  queryFormRef.value.resetFields()
+  if (val == 'add') { // 新增
-  handleQuery()
+    openForm('create')
+  } else if (val == 'import') { // 导入
+    handleImport()
+  } else if (val == 'export') { // 导出
+    handleExport()
+  } else if (val == 'refresh') { // 刷新
+    getList()
+  } else if (val == 'filtrate') { // 筛选
+  } else { // 其他按钮 
+    console.log('其他按钮', item)
+  }
 }
 
-/** 用户导入 */
+// 列表-操作按钮
-const importFormRef = ref()
+const butttondata = [
-const handleImport = () => {
+  defaultButtons.mainListEditBtn({hasPermi:'wms:workstation:update'}), // 编辑
-  importFormRef.value.open()
+  defaultButtons.mainListDeleteBtn({hasPermi:'wms:workstation:delete'}), // 删除
+]
 
+// 列表-操作按钮事件 
+const buttonTableClick = async (val, row) => {
+  if (val == 'edit') { // 编辑
+    // const res = await WorkstationApi.getItempackaging(row.id)
+    openForm('update', row)
+  } else if (val == 'delete') { // 删除
+    handleDelete(row.id)
+  }
 }
+
 /** 添加/修改操作 */
-const formRef = ref()
+const basicFormRef = ref()
-const openForm = (type: string, id?: number) => {
+const openForm = (type: string, row?: any) => {
-  console.log(id)
+  basicFormRef.value.open(type, row)
-  formRef.value.open(type, id)
+}
+
+/** 详情操作 */
+const detailRef = ref()
+const openDetail = (row: any, titleName: any, titleValue: any) => {
+  detailRef.value.openDetail(row, titleName, titleValue)
 }
 
 /** 删除按钮操作 */
@@ -334,13 +149,14 @@ const handleDelete = async (id: number) => {
 }
 
 /** 导出按钮操作 */
+const exportLoading = ref(false) // 导出的加载中
 const handleExport = async () => {
   try {
     // 导出的二次确认
     await message.exportConfirm()
     // 发起导出
     exportLoading.value = true
-    const data = await WorkstationApi.exportWorkstation(queryParams)
+    const data = await WorkstationApi.exportWorkstation(setSearchParams)
     download.excel(data, '工位.xls')
   } catch {
   } finally {
@@ -348,6 +164,21 @@ const handleExport = async () => {
   }
 }
 
+/** 导入 */
+const importFormRef = ref()
+const handleImport = () => {
+  importFormRef.value.open()
+}
+// 导入附件弹窗所需的参数
+const importTemplateData = reactive({
+  templateUrl: '',
+  templateTitle: '工位导入模版.xls'
+})
+// 导入成功之后
+const importSuccess = () => {
+  getList()
+}
+
 /** 初始化 **/
 onMounted(() => {
   getList()