ソースを参照

工厂和车间分页问题

lupeng 1 年間 前
コミット
c5e81c36db

+ 51 - 41
src/views/base/modeling/factory/index.vue

@@ -1,8 +1,5 @@
 <template>
-
-
   <div class="mainContentBox">
-
     <avue-crud
       ref="crudRef"
       v-model:search="search"
@@ -13,9 +10,13 @@
       @row-save="createRow"
       @row-update="updateRow"
       @row-del="deleteRow"
+      @search-change="searchChange"
+      @search-reset="resetChange"
+      @size-change="dataList"
+      @current-change="dataList"
       @selection-change="selectionChange"
     >
-      <!--<template #menu-left="{ size }">
+      <template #menu-left="{ size }">
         <el-button
           :disabled="toDeleteIds.length < 1"
           type="danger"
@@ -24,56 +25,52 @@
           @click="multipleDelete"
         >删除</el-button
         >
-      </template>-->
-      <template #menu="{row,index,type}">
-        <el-button @click="binding(row)"
-                   icon="el-icon-link"
-                   text
-                   type="primary"
-                   :size="size">绑定子项</el-button>
       </template>
-
+      <template #menu-right="{}">
+        <el-dropdown split-button
+        >导入
+          <template #dropdown>
+            <el-dropdown-menu>
+              <el-dropdown-item
+                @click="downloadTemplate('/api/v1/plan/order/template')"
+              >
+                <i-ep-download />下载模板
+              </el-dropdown-item>
+              <el-dropdown-item @click="importExcelData">
+                <i-ep-top />导入数据
+              </el-dropdown-item>
+            </el-dropdown-menu>
+          </template>
+        </el-dropdown>
+        <el-button class="ml-3" @click="exportData">
+          <template #icon> <i-ep-download /> </template>导出
+        </el-button>
+      </template>
     </avue-crud>
-    <el-dialog
-      v-model="dialog.visible"
-      :title="dialog.title"
-      width="850px"
-      @close="dialog.visible = false"
-    >
-       <device-page @deviceInfo="deviceInfo"/>
-    </el-dialog>
+    <ExcelUpload ref="uploadRef" @finished="uploadFinished" />
   </div>
 </template>
 <script setup>
   import { ref, getCurrentInstance } from "vue";
   import { useCrud } from "@/hooks/userCrud";
   import ButtonPermKeys from "@/common/configs/buttonPermission";
-
-  // import { useCommonStoreHook } from "@/store";
   import { useCommonStoreHook } from "@/store";
   const { isShowTable, tableType } = toRefs(useCommonStoreHook());
-  // const isShowTable = ref(false);
+
   const test = () => {
     isShowTable.value = true;
     tableType.value = tableType.value == 1 ? 2 : 1;
   };
-  const dialog = reactive({
-    title: "绑定子项",
-    visible: false,
-  });
-  const binding =(row)=>{
-    console.info(row);
-    console.log(row.factoryName);
-    dialog.visible = true;
-  }
+
   // 传入一个url,后面不带/
   const { form, data, option, search, page, toDeleteIds, Methords, Utils } =
     useCrud({
       src: "/api/v1/base/factory",
     });
-  const { dataList, createRow, updateRow, deleteRow } = Methords; //增删改查
+  const { dataList, createRow, updateRow, deleteRow, searchChange, resetChange } =
+    Methords; //增删改查
   const { selectionChange, multipleDelete } = Methords; //选中和批量删除事件
-  const { checkBtnPerm } = Utils; //按钮权限等工具
+  const { checkBtnPerm, downloadTemplate, exportData } = Utils; //按钮权限等工具
   // checkBtnPerm(ButtonPermKeys.PLAN.BTNS.order_add) :permission="permission"
   // const permission = reactive({
   //   delBtn: checkPerm(buttonPermission.PLAN.BTNS.order_del),
@@ -84,10 +81,29 @@
 
   const crudRef = ref(null); //crudRef.value 获取avue-crud对象
 
+  onMounted(() => {
+    // console.log("crudRef", crudRef)
+    dataList();
+  });
+
+  /**
+   * 上传excel相关
+   */
+  const uploadRef = ref(null);
+  const uploadFinished = () => {
+    // 上传完成后的刷新操作
+    page.currentPage = 1;
+    dataList();
+  };
+  const importExcelData = () => {
+    if (uploadRef.value) {
+      uploadRef.value.show("/api/v1/plan/order/import");
+    }
+  };
+
   // 设置表格列或者其他自定义的option
   option.value = Object.assign(option.value, {
     selection: true,
-    viewBtn: true,
     menuWidth: 320,
     column: [
       // 添加一个自增列
@@ -153,12 +169,6 @@
       },
     ],
   });
-
-  onMounted(() => {
-    // console.log("crudRef", crudRef)
-    dataList();
-  });
 </script>
 
 
-

+ 51 - 15
src/views/base/modeling/work-shop/index.vue

@@ -1,8 +1,5 @@
 <template>
-
-
   <div class="mainContentBox">
-
     <avue-crud
       ref="crudRef"
       v-model:search="search"
@@ -13,6 +10,10 @@
       @row-save="createRow"
       @row-update="updateRow"
       @row-del="deleteRow"
+      @search-change="searchChange"
+      @search-reset="resetChange"
+      @size-change="dataList"
+      @current-change="dataList"
       @selection-change="selectionChange"
     >
       <template #menu-left="{ size }">
@@ -22,21 +23,40 @@
           icon="el-icon-delete"
           :size="size"
           @click="multipleDelete"
-          >删除</el-button
+        >删除</el-button
         >
       </template>
+      <template #menu-right="{}">
+        <el-dropdown split-button
+        >导入
+          <template #dropdown>
+            <el-dropdown-menu>
+              <el-dropdown-item
+                @click="downloadTemplate('/api/v1/plan/order/template')"
+              >
+                <i-ep-download />下载模板
+              </el-dropdown-item>
+              <el-dropdown-item @click="importExcelData">
+                <i-ep-top />导入数据
+              </el-dropdown-item>
+            </el-dropdown-menu>
+          </template>
+        </el-dropdown>
+        <el-button class="ml-3" @click="exportData">
+          <template #icon> <i-ep-download /> </template>导出
+        </el-button>
+      </template>
     </avue-crud>
+    <ExcelUpload ref="uploadRef" @finished="uploadFinished" />
   </div>
 </template>
 <script setup>
   import { ref, getCurrentInstance } from "vue";
   import { useCrud } from "@/hooks/userCrud";
   import ButtonPermKeys from "@/common/configs/buttonPermission";
-
-  // import { useCommonStoreHook } from "@/store";
   import { useCommonStoreHook } from "@/store";
   const { isShowTable, tableType } = toRefs(useCommonStoreHook());
-  // const isShowTable = ref(false);
+
   const test = () => {
     isShowTable.value = true;
     tableType.value = tableType.value == 1 ? 2 : 1;
@@ -47,9 +67,10 @@
     useCrud({
       src: "/api/v1/base/workShop",
     });
-  const { dataList, createRow, updateRow, deleteRow } = Methords; //增删改查
+  const { dataList, createRow, updateRow, deleteRow, searchChange, resetChange } =
+    Methords; //增删改查
   const { selectionChange, multipleDelete } = Methords; //选中和批量删除事件
-  const { checkBtnPerm } = Utils; //按钮权限等工具
+  const { checkBtnPerm, downloadTemplate, exportData } = Utils; //按钮权限等工具
   // checkBtnPerm(ButtonPermKeys.PLAN.BTNS.order_add) :permission="permission"
   // const permission = reactive({
   //   delBtn: checkPerm(buttonPermission.PLAN.BTNS.order_del),
@@ -60,10 +81,29 @@
 
   const crudRef = ref(null); //crudRef.value 获取avue-crud对象
 
+  onMounted(() => {
+    // console.log("crudRef", crudRef)
+    dataList();
+  });
+
+  /**
+   * 上传excel相关
+   */
+  const uploadRef = ref(null);
+  const uploadFinished = () => {
+    // 上传完成后的刷新操作
+    page.currentPage = 1;
+    dataList();
+  };
+  const importExcelData = () => {
+    if (uploadRef.value) {
+      uploadRef.value.show("/api/v1/plan/order/import");
+    }
+  };
+
   // 设置表格列或者其他自定义的option
   option.value = Object.assign(option.value, {
     selection: true,
-    viewBtn: true,
     column: [
       {
         label: "车间名称",
@@ -111,9 +151,5 @@
       },
     ],
   });
-
-  onMounted(() => {
-    // console.log("crudRef", crudRef)
-    dataList();
-  });
 </script>
+