报表统计页面优化

imcs-ui/src/api/statisticalAnalysis/productlineAvailability.js

@@ -75,9 +75,9 @@ export default {
       data
     })
   },
-  getProductStatistics(searchObj){
+  getProductStatistics(page,limit,searchObj){
     return axiosApi({
-      url: `/authority/productLinePerformance/getProductStatistics`,
+      url: `/authority/productLinePerformance/getProductStatistics/${page}/${limit}`,
       method: 'post',
       data:searchObj
     })

imcs-ui/src/lang/zh/statisticalAnalysis.js

@@ -57,7 +57,7 @@ export default {
       productInfoStatistics:{
         orderNo: '订单编号',
         bomName: '产品名称',
-        name: '分配设备ID',
+        name: '分配设备',
         planStartTime: '计划开始时间',
         planEndTime: '计划结束时间',
         startTime: '开始时间',

imcs-ui/src/views/zuihou/statisticalAnalysis/productInfoStatistics/Index.vue

@@ -1,5 +1,31 @@
 <template>
   <div class="app-container">
+    <!--查询表单-->
+    <el-card class="operate-container" shadow="never">
+      <el-form :inline="true" class="demo-form-inline">
+        <el-form-item label="产品名称">
+          <el-input v-model="searchObj.bomName" placeholder="产品名称" />
+        </el-form-item>
+        <el-form-item label="生产时间">
+          <el-date-picker
+            v-model="searchObj.startTime"
+            placeholder="开始时间"
+            value-format="yyyy-MM-dd"
+          />
+        </el-form-item>
+        <el-form-item label="-">
+          <el-date-picker
+            v-model="searchObj.endTime"
+            placeholder="结束时间"
+            value-format="yyyy-MM-dd"
+          />
+        </el-form-item>
+        <el-button type="primary" icon="el-icon-search" @click="fetch()"
+          >查询</el-button
+        >
+        <el-button type="default" @click="resetData()">清空</el-button>
+      </el-form>
+    </el-card>
     <div class="_blank">
       <div class="el-toolbar-body" style="justify-content: flex-start">
         <el-button type="primary" @click="exportData" icon="el-icon-upload2"
@@ -194,7 +220,7 @@ export default {
     //导出
     exportData() {
       productlineAvailabilityApi.expectProductInfo().then((res) => {
-       if (!res) return;
+        if (!res) return;
         const blob = new Blob([res.data], {
           type: "application/vnd.ms-excel;",
         });

imcs-ui/src/views/zuihou/statisticalAnalysis/productStatistics/Index.vue

@@ -1,5 +1,31 @@
 <template>
   <div class="app-container">
+    <!--查询表单-->
+    <el-card class="operate-container" shadow="never">
+      <el-form :inline="true" class="demo-form-inline">
+        <el-form-item label="产品名称">
+          <el-input v-model="searchObj.bomName" placeholder="产品名称" />
+        </el-form-item>
+        <el-form-item label="生产时间">
+          <el-date-picker
+            v-model="searchObj.startTime"
+            placeholder="开始时间"
+            value-format="yyyy-MM-dd"
+          />
+        </el-form-item>
+        <el-form-item label="-">
+          <el-date-picker
+            v-model="searchObj.endTime"
+            placeholder="结束时间"
+            value-format="yyyy-MM-dd"
+          />
+        </el-form-item>
+        <el-button type="primary" icon="el-icon-search" @click="fetch()"
+          >查询</el-button
+        >
+        <el-button type="default" @click="resetData()">清空</el-button>
+      </el-form>
+    </el-card>
     <div class="_blank">
       <div class="el-toolbar-body" style="justify-content: flex-start">
         <el-button type="primary" @click="exportData" icon="el-icon-upload2"
@@ -91,6 +117,17 @@
         </el-table-column>
       </el-table-column>
     </el-table>
+    <!-- 分页组件 -->
+    <el-pagination
+      :current-page="page"
+      :total="total"
+      :page-size="limit"
+      :page-sizes="[5, 10, 20, 30, 40, 50, 100]"
+      style="padding: 30px 0; text-align: center"
+      layout="total, sizes, prev, pager, next, jumper"
+      @size-change="changePageSize"
+      @current-change="changeCurrentPage"
+    />
   </div>
 </template>
 
@@ -108,12 +145,10 @@ export default {
   components: {},
   data() {
     return {
-      operatorPerformanceVisible: false, // 产线人员工时管理
-      rowData: {}, // row数据
-      tableKey: 0,
-      selection: [],
-      loading: false,
-      tableData: [],
+      tableData: [], // 讲师列表
+      total: 0, // 总记录数
+      page: 1, // 当前页码
+      limit: 10, // 每页记录数
       searchObj: {}, // 查询条件
     };
   },
@@ -144,15 +179,25 @@ export default {
       this.operatorViewVisible = true;
     },
     fetch() {
+      this.tableKey = !this.tableKey;
       productlineAvailabilityApi
-        .getProductStatistics(this.searchObj)
+        .getProductStatistics(this.page, this.limit, this.searchObj)
         .then((response) => {
           const res = response.data;
-          if (res.isSuccess) {
-            this.tableData = res.data;
-          }
+          this.tableData = res.data.records;
+          this.total = res.data.total;
         });
     },
+    // 每页记录数改变，size：回调参数，表示当前选中的“每页条数”
+    changePageSize(size) {
+      this.limit = size;
+      this.fetch();
+    },
+    // 改变页码，page：回调参数，表示当前选中的“页码”
+    changeCurrentPage(page) {
+      this.page = page;
+      this.fetch();
+    },
     //清空
     resetData() {
       this.searchObj = {};
@@ -177,7 +222,7 @@ export default {
     onSelectChange(selection) {
       this.selection = selection;
     },
-      //导出
+    //导出
     exportData() {
       productlineAvailabilityApi.expectProduct().then((res) => {
         if (!res) return;

imcs-ui/src/views/zuihou/statisticalAnalysis/queryProcedure/Index.vue

@@ -1,5 +1,31 @@
 <template>
   <div class="app-container">
+    <!--查询表单-->
+    <el-card class="operate-container" shadow="never">
+      <el-form :inline="true" class="demo-form-inline">
+        <el-form-item label="机床名称">
+          <el-input v-model="searchObj.bomName" placeholder="机床名称" />
+        </el-form-item>
+        <el-form-item label="加工时间">
+          <el-date-picker
+            v-model="searchObj.startTime"
+            placeholder="开始时间"
+            value-format="yyyy-MM-dd"
+          />
+        </el-form-item>
+        <el-form-item label="-">
+          <el-date-picker
+            v-model="searchObj.endTime"
+            placeholder="结束时间"
+            value-format="yyyy-MM-dd"
+          />
+        </el-form-item>
+        <el-button type="primary" icon="el-icon-search" @click="fetch()"
+          >查询</el-button
+        >
+        <el-button type="default" @click="resetData()">清空</el-button>
+      </el-form>
+    </el-card>
     <div class="_blank">
       <div class="el-toolbar-body" style="justify-content: flex-start">
         <el-button type="primary" @click="exportData" icon="el-icon-upload2"
@@ -199,6 +225,11 @@ export default {
     onSelectChange(selection) {
       this.selection = selection;
     },
+    //清空
+    resetData() {
+      this.searchObj = {};
+      this.fetch();
+    },
   },
 };
 </script>