From 9bc2e73e848e1fd0596a567222b9cd9007ee8a37 Mon Sep 17 00:00:00 2001
From: hzz <hzz>
Date: Thu, 11 Apr 2024 19:01:19 +0800
Subject: [PATCH] update

---
 src/api/casm/quality.js             |   7 +
 src/api/home.js                     |   2 +-
 src/assets/iconfont/iconfont.css    |  23 ++
 src/assets/iconfont/iconfont.ttf    | Bin 0 -> 3496 bytes
 src/assets/iconfont/iconfont.woff   | Bin 0 -> 2396 bytes
 src/assets/iconfont/iconfont.woff2  | Bin 0 -> 1920 bytes
 src/assets/images/frj.png           | Bin 0 -> 7754 bytes
 src/layout/components/AppMain.vue   |  14 +-
 src/main.js                         |  11 +-
 src/views/device/device/index.vue   | 220 ++++++++++---------
 src/views/index.vue                 | 315 ++++++++++++++++++++++++----
 src/views/produce/index.vue         | 142 ++++++++-----
 src/views/product/needle/index.vue  | 109 +++++-----
 src/views/product/product/index.vue |  95 +++++----
 src/views/product/working/index.vue |  82 +++++---
 src/views/quality/index.vue         |  39 +++-
 16 files changed, 725 insertions(+), 334 deletions(-)
 create mode 100644 src/assets/iconfont/iconfont.css
 create mode 100644 src/assets/iconfont/iconfont.ttf
 create mode 100644 src/assets/iconfont/iconfont.woff
 create mode 100644 src/assets/iconfont/iconfont.woff2
 create mode 100644 src/assets/images/frj.png

diff --git a/src/api/casm/quality.js b/src/api/casm/quality.js
index 9ac4daf..b295447 100644
--- a/src/api/casm/quality.js
+++ b/src/api/casm/quality.js
@@ -42,3 +42,10 @@ export function delQuality(id) {
     method: 'delete'
   })
 }
+// 获取合格率
+export function qualitystandardRate() {
+  return request({
+    url: '/casm/qualitystandardRate',
+    method: 'get'
+  })
+}
diff --git a/src/api/home.js b/src/api/home.js
index 9338895..5767dad 100644
--- a/src/api/home.js
+++ b/src/api/home.js
@@ -3,7 +3,7 @@ import request from '@/utils/request'
 // 获取首页数据
 export function getHomeDeviceInfoVO() {
   return request({
-    url: '/home',
+    url: '/casm/device/getHomeDeviceInfo',
     method: 'get'
   })
 }
\ No newline at end of file
diff --git a/src/assets/iconfont/iconfont.css b/src/assets/iconfont/iconfont.css
new file mode 100644
index 0000000..4126905
--- /dev/null
+++ b/src/assets/iconfont/iconfont.css
@@ -0,0 +1,23 @@
+@font-face {
+  font-family: "iconfont"; /* Project id 4503445 */
+  src: url('iconfont.woff2?t=1712819070350') format('woff2'),
+       url('iconfont.woff?t=1712819070350') format('woff'),
+       url('iconfont.ttf?t=1712819070350') format('truetype');
+}
+
+.iconfont {
+  font-family: "iconfont" !important;
+  font-size: 16px;
+  font-style: normal;
+  -webkit-font-smoothing: antialiased;
+  -moz-osx-font-smoothing: grayscale;
+}
+
+.icon-shengchanxiaoshuai:before {
+  content: "\e612";
+}
+
+.icon-zhinengjiaju:before {
+  content: "\e61c";
+}
+
diff --git a/src/assets/iconfont/iconfont.ttf b/src/assets/iconfont/iconfont.ttf
new file mode 100644
index 0000000000000000000000000000000000000000..77182c75cdd34ac1181cc743de39003bb8d5095b
GIT binary patch
literal 3496
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
aKT}^=YM!glm=8B+=8-%-Q$KwUZT}6!Fxwjd

literal 0
HcmV?d00001

diff --git a/src/assets/iconfont/iconfont.woff b/src/assets/iconfont/iconfont.woff
new file mode 100644
index 0000000000000000000000000000000000000000..0ed21eb010f241d34164778ffd7d2a599cdb5212
GIT binary patch
literal 2396
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

literal 0
HcmV?d00001

diff --git a/src/assets/iconfont/iconfont.woff2 b/src/assets/iconfont/iconfont.woff2
new file mode 100644
index 0000000000000000000000000000000000000000..9e309deefdf65ab3f77fa4dc1780ea1f2a3d6b0d
GIT binary patch
literal 1920
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
G0{{RqDu##v

literal 0
HcmV?d00001

diff --git a/src/assets/images/frj.png b/src/assets/images/frj.png
new file mode 100644
index 0000000000000000000000000000000000000000..f1285eef2ddb42552707411e004cdd630069306b
GIT binary patch
literal 7754
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
Hpn?Ab8M#28

literal 0
HcmV?d00001

diff --git a/src/layout/components/AppMain.vue b/src/layout/components/AppMain.vue
index 42fffdf..9ff0b35 100644
--- a/src/layout/components/AppMain.vue
+++ b/src/layout/components/AppMain.vue
@@ -2,11 +2,14 @@
   <section class="app-main">
     <router-view v-slot="{ Component, route }">
       <transition name="fade-transform" mode="out-in">
-        <keep-alive :include="tagsViewStore.cachedViews">
-          <component v-if="!route.meta.link" :is="Component" :key="route.path"/>
-        </keep-alive>
+        <div :key="route.path">
+          <keep-alive :include="tagsViewStore.cachedViews">
+            <component v-if="!route.meta.link" :is="Component" :key="route.path" />
+          </keep-alive>
+        </div>
       </transition>
     </router-view>
+
     <iframe-toggle />
   </section>
 </template>
@@ -27,7 +30,7 @@ const tagsViewStore = useTagsViewStore()
   overflow: hidden;
 }
 
-.fixed-header + .app-main {
+.fixed-header+.app-main {
   padding-top: 50px;
 }
 
@@ -37,7 +40,7 @@ const tagsViewStore = useTagsViewStore()
     min-height: calc(100vh - 84px);
   }
 
-  .fixed-header + .app-main {
+  .fixed-header+.app-main {
     padding-top: 84px;
   }
 }
@@ -65,4 +68,3 @@ const tagsViewStore = useTagsViewStore()
   border-radius: 3px;
 }
 </style>
-
diff --git a/src/main.js b/src/main.js
index 68a8e5c..29d7d99 100644
--- a/src/main.js
+++ b/src/main.js
@@ -56,19 +56,22 @@ import {
   CanvasRenderer
 } from 'echarts/renderers'
 import {
-  PieChart
+  PieChart,LineChart
 } from 'echarts/charts'
 import {
   TitleComponent,
   TooltipComponent,
-  LegendComponent
+  LegendComponent,
+  GridComponent 
 } from 'echarts/components'
 use([
   CanvasRenderer,
-  PieChart,
   TitleComponent,
   TooltipComponent,
-  LegendComponent
+  LegendComponent,
+  GridComponent,
+  PieChart,
+  LineChart,
 ]);
 
 
diff --git a/src/views/device/device/index.vue b/src/views/device/device/index.vue
index c8203a2..bc95dfa 100644
--- a/src/views/device/device/index.vue
+++ b/src/views/device/device/index.vue
@@ -1,55 +1,63 @@
 <template>
   <div class="app-container">
     <el-form :model="queryParams" ref="queryForm" size="small" :inline="true" v-show="showSearch" label-width="68px">
-      <el-form-item :label="tLang('device','设备名称')" prop="name">
-        <el-input v-model="queryParams.name" :placeholder="tLang('common','请输入') + tLang('device','设备名称')" clearable @keyup.enter="handleQuery" />
-      </el-form-item>
-      <el-form-item :label="tLang('device','设备编码')" prop="code">
-        <el-input v-model="queryParams.code" :placeholder="tLang('common','请输入') + tLang('device','设备编码')" clearable @keyup.enter="handleQuery" />
-      </el-form-item>
-      <el-form-item :label="tLang('device','车间名称')" prop="workShop">
-        <el-input v-model="queryParams.workShop" :placeholder="tLang('common','请输入') + tLang('device','车间名称')" clearable @keyup.enter="handleQuery" />
-      </el-form-item>
-      <el-form-item :label="tLang('device','产线名称')" prop="lineName">
-        <el-input v-model="queryParams.lineName" :placeholder="tLang('common','请输入') + tLang('device','产线名称')" clearable @keyup.enter="handleQuery" />
-      </el-form-item>
-      <el-form-item :label="tLang('device','保养周期')" prop="maintenance">
-        <el-input v-model="queryParams.maintenance" :placeholder="tLang('common','请输入') + tLang('device','保养周期')" clearable @keyup.enter="handleQuery" />
-      </el-form-item>
-      <el-form-item :label="tLang('device','供货商名称')" prop="supplier">
-        <el-input v-model="queryParams.supplier" :placeholder="tLang('common','请输入') + tLang('device','供货商名称')" clearable @keyup.enter="handleQuery" />
-      </el-form-item>
-      <el-form-item :label="tLang('device','供货商联络人')" prop="supplierContactPerson">
-        <el-input v-model="queryParams.supplierContactPerson" :placeholder="tLang('common','请输入') + tLang('device','供货商联络人')" clearable
+      <el-form-item :label="tLang('device', '设备名称')" prop="name">
+        <el-input v-model="queryParams.name" :placeholder="tLang('common', '请输入') + tLang('device', '设备名称')" clearable
           @keyup.enter="handleQuery" />
       </el-form-item>
-      <el-form-item :label="tLang('device','生产厂家')" prop="manufacturer">
-        <el-input v-model="queryParams.manufacturer" :placeholder="tLang('common','请输入') + tLang('device','生产厂家')" clearable
+      <el-form-item :label="tLang('device', '设备编码')" prop="code">
+        <el-input v-model="queryParams.code" :placeholder="tLang('common', '请输入') + tLang('device', '设备编码')" clearable
           @keyup.enter="handleQuery" />
       </el-form-item>
-      <el-form-item :label="tLang('device','联系电话')" prop="contactPhone">
-        <el-input v-model="queryParams.contactPhone" :placeholder="tLang('common','请输入') + tLang('device','联系电话')" clearable
+      <el-form-item :label="tLang('device', '车间名称')" prop="workShop">
+        <el-input v-model="queryParams.workShop" :placeholder="tLang('common', '请输入') + tLang('device', '车间名称')" clearable
           @keyup.enter="handleQuery" />
       </el-form-item>
-      <el-form-item :label="tLang('device','品牌')" prop="brand">
-        <el-input v-model="queryParams.brand" :placeholder="tLang('common','请输入') + tLang('device','品牌')" clearable @keyup.enter="handleQuery" />
+      <el-form-item :label="tLang('device', '产线名称')" prop="lineName">
+        <el-input v-model="queryParams.lineName" :placeholder="tLang('common', '请输入') + tLang('device', '产线名称')" clearable
+          @keyup.enter="handleQuery" />
+      </el-form-item>
+      <el-form-item :label="tLang('device', '保养周期')" prop="maintenance">
+        <el-input v-model="queryParams.maintenance" :placeholder="tLang('common', '请输入') + tLang('device', '保养周期')"
+          clearable @keyup.enter="handleQuery" />
+      </el-form-item>
+      <el-form-item :label="tLang('device', '供货商名称')" prop="supplier">
+        <el-input v-model="queryParams.supplier" :placeholder="tLang('common', '请输入') + tLang('device', '供货商名称')"
+          clearable @keyup.enter="handleQuery" />
+      </el-form-item>
+      <el-form-item :label="tLang('device', '供货商联络人')" prop="supplierContactPerson">
+        <el-input v-model="queryParams.supplierContactPerson"
+          :placeholder="tLang('common', '请输入') + tLang('device', '供货商联络人')" clearable @keyup.enter="handleQuery" />
+      </el-form-item>
+      <el-form-item :label="tLang('device', '生产厂家')" prop="manufacturer">
+        <el-input v-model="queryParams.manufacturer" :placeholder="tLang('common', '请输入') + tLang('device', '生产厂家')"
+          clearable @keyup.enter="handleQuery" />
+      </el-form-item>
+      <el-form-item :label="tLang('device', '联系电话')" prop="contactPhone">
+        <el-input v-model="queryParams.contactPhone" :placeholder="tLang('common', '请输入') + tLang('device', '联系电话')"
+          clearable @keyup.enter="handleQuery" />
+      </el-form-item>
+      <el-form-item :label="tLang('device', '品牌')" prop="brand">
+        <el-input v-model="queryParams.brand" :placeholder="tLang('common', '请输入') + tLang('device', '品牌')" clearable
+          @keyup.enter="handleQuery" />
       </el-form-item>
       <!-- <el-form-item :label="针数" prop="needleNum">
         <el-input v-model="queryParams.needleNum" :placeholder="tLang('common','请输入') + 针数" clearable @keyup.enter="handleQuery" />
       </el-form-item> -->
-      <el-form-item :label="tLang('device','设备型号')" prop="model">
-        <el-input v-model="queryParams.model" :placeholder="tLang('common','请输入') + tLang('device','设备型号')" clearable @keyup.enter="handleQuery" />
+      <el-form-item :label="tLang('device', '设备型号')" prop="model">
+        <el-input v-model="queryParams.model" :placeholder="tLang('common', '请输入') + tLang('device', '设备型号')" clearable
+          @keyup.enter="handleQuery" />
       </el-form-item>
       <el-form-item>
-        <el-button type="primary" icon="search" size="mini" @click="handleQuery">{{tLang('common','搜索')}}</el-button>
-        <el-button icon="refresh" size="mini" @click="resetQuery">{{tLang('common','重置')}}</el-button>
+        <el-button type="primary" icon="search" size="mini" @click="handleQuery">{{ tLang('common', '搜索') }}</el-button>
+        <el-button icon="refresh" size="mini" @click="resetQuery">{{ tLang('common', '重置') }}</el-button>
       </el-form-item>
     </el-form>
 
     <el-row :gutter="10" class="mb8">
       <el-col :span="1.5">
-        <el-button type="primary" plain icon="plus" size="mini" @click="handleAdd"
-          v-hasPermi="['device:device:add']">{{ $t('common.新增') }}</el-button>
+        <el-button type="primary" plain icon="plus" size="mini" @click="handleAdd" v-hasPermi="['device:device:add']">{{
+      $t('common.新增') }}</el-button>
       </el-col>
       <el-col :span="1.5">
         <el-button type="success" plain icon="edit" size="mini" :disabled="single" @click="handleUpdate"
@@ -69,30 +77,31 @@
     <el-table v-loading="loading" :data="deviceList" @selection-change="handleSelectionChange">
       <el-table-column type="selection" width="55" align="center" />
       <el-table-column type="index" :label="$t('common.序号')" width="60" align="center" />
-      <el-table-column :label="tLang('device','设备名称')" align="center" v-if="columns[0].visible" prop="name" />
-      <el-table-column :label="tLang('device','设备编码')" align="center" v-if="columns[1].visible" prop="code" />
-      <el-table-column :label="tLang('device','设备类型')" align="center" v-if="columns[2].visible" prop="type" />
-      <el-table-column :label="tLang('device','车间名称')" align="center" v-if="columns[3].visible" prop="workShop" />
-      <el-table-column :label="tLang('device','产线名称')" align="center" v-if="columns[4].visible" prop="lineName" />
-      <el-table-column :label="tLang('device','保养周期')" align="center" v-if="columns[5].visible" prop="maintenance" />
-      <el-table-column :label="tLang('device','供货商名称')" align="center" v-if="columns[6].visible" prop="supplier" />
-      <el-table-column :label="tLang('device','供货商联络人')" align="center" v-if="columns[7].visible" prop="supplierContactPerson" />
-      <el-table-column :label="tLang('device','生产厂家')" align="center" v-if="columns[8].visible" prop="manufacturer" />
-      <el-table-column :label="tLang('device','联系电话')" align="center" v-if="columns[9].visible" prop="contactPhone" />
-      <el-table-column :label="tLang('device','品牌')" align="center" v-if="columns[10].visible" prop="brand" />
-      <el-table-column :label="tLang('device','设备型号')" align="center" v-if="columns[11].visible" prop="model" />
-      <el-table-column :label="tLang('device','备注')" align="center" v-if="columns[12].visible" prop="remark" />
-      <el-table-column :label="tLang('common','操作')" align="center" class-name="small-padding fixed-width">
+      <el-table-column :label="tLang('device', '设备名称')" align="center" v-if="columns[0].visible" prop="name" />
+      <el-table-column :label="tLang('device', '设备编码')" align="center" v-if="columns[1].visible" prop="code" />
+      <el-table-column :label="tLang('device', '设备类型')" align="center" v-if="columns[2].visible" prop="type" />
+      <el-table-column :label="tLang('device', '车间名称')" align="center" v-if="columns[3].visible" prop="workShop" />
+      <el-table-column :label="tLang('device', '产线名称')" align="center" v-if="columns[4].visible" prop="lineName" />
+      <el-table-column :label="tLang('device', '保养周期')" align="center" v-if="columns[5].visible" prop="maintenance" />
+      <el-table-column :label="tLang('device', '供货商名称')" align="center" v-if="columns[6].visible" prop="supplier" />
+      <el-table-column :label="tLang('device', '供货商联络人')" align="center" v-if="columns[7].visible"
+        prop="supplierContactPerson" />
+      <el-table-column :label="tLang('device', '生产厂家')" align="center" v-if="columns[8].visible" prop="manufacturer" />
+      <el-table-column :label="tLang('device', '联系电话')" align="center" v-if="columns[9].visible" prop="contactPhone" />
+      <el-table-column :label="tLang('device', '品牌')" align="center" v-if="columns[10].visible" prop="brand" />
+      <el-table-column :label="tLang('device', '设备型号')" align="center" v-if="columns[11].visible" prop="model" />
+      <el-table-column :label="tLang('device', '备注')" align="center" v-if="columns[12].visible" prop="remark" />
+      <el-table-column :label="tLang('common', '操作')" align="center" class-name="small-padding fixed-width">
         <template #default="scope">
-          <el-tooltip :content="tLang('common','详情')" placement="top" v-if="scope.row.userId !== 1">
+          <el-tooltip :content="tLang('common', '详情')" placement="top" v-if="scope.row.userId !== 1">
             <el-button link type="primary" icon="Tickets" @click="handleInfo(scope.row)"
               v-hasPermi="['device:device:info']"></el-button>
           </el-tooltip>
-          <el-tooltip :content="tLang('common','修改')" placement="top" v-if="scope.row.userId !== 1">
+          <el-tooltip :content="tLang('common', '修改')" placement="top" v-if="scope.row.userId !== 1">
             <el-button link type="primary" icon="Edit" @click="handleUpdate(scope.row)"
               v-hasPermi="['device:device:edit']"></el-button>
           </el-tooltip>
-          <el-tooltip :content="tLang('common','删除')" placement="top" v-if="scope.row.userId !== 1">
+          <el-tooltip :content="tLang('common', '删除')" placement="top" v-if="scope.row.userId !== 1">
             <el-button link type="primary" icon="Delete" @click="handleDelete(scope.row)"
               v-hasPermi="['device:device:remove']"></el-button>
           </el-tooltip>
@@ -100,62 +109,67 @@
       </el-table-column>
     </el-table>
 
-    <pagination v-show="total > 0" :total="total" :page.sync="queryParams.pageNum" :limit.sync="queryParams.pageSize"
-      @pagination="getList" />
+    <div class="pagination">
+      <el-pagination :hide-on-single-page="true" v-model:current-page="queryParams.pageNum"
+        v-model:page-size="queryParams.pageSize" :page-sizes="[25, 50, 100, 150]"
+        layout="total, sizes, prev, pager, next, jumper" :total="total" @size-change="getList"
+        @current-change="getList" />
+    </div>
 
     <!-- 添加或修改设备信息对话框 -->
     <el-dialog :title="title" v-model="open" width="800px" append-to-body>
       <el-form ref="formRef" :inline="true" :model="form" :rules="rules" class="demo-form-inline" label-width="100px">
-        <el-form-item :label="tLang('device','设备名称')" prop="name">
-          <el-input v-model="form.name" :placeholder="tLang('common','请输入') + tLang('device','设备名称')" />
+        <el-form-item :label="tLang('device', '设备名称')" prop="name">
+          <el-input v-model="form.name" :placeholder="tLang('common', '请输入') + tLang('device', '设备名称')" />
         </el-form-item>
-        <el-form-item :label="tLang('device','设备编码')" prop="code">
-          <el-input v-model="form.code" :placeholder="tLang('common','请输入') + tLang('device','设备编码')" />
+        <el-form-item :label="tLang('device', '设备编码')" prop="code">
+          <el-input v-model="form.code" :placeholder="tLang('common', '请输入') + tLang('device', '设备编码')" />
         </el-form-item>
-        <el-form-item :label="tLang('device','设备类型')" prop="code">
-          <el-input v-model="form.type" :placeholder="tLang('common','请输入') + tLang('device','设备编码')" />
+        <el-form-item :label="tLang('device', '设备类型')" prop="code">
+          <el-input v-model="form.type" :placeholder="tLang('common', '请输入') + tLang('device', '设备编码')" />
         </el-form-item>
-        <el-form-item :label="tLang('device','车间名称')" prop="workShop">
-          <el-input v-model="form.workShop" :placeholder="tLang('common','请输入') + tLang('device','车间名称')" />
+        <el-form-item :label="tLang('device', '车间名称')" prop="workShop">
+          <el-input v-model="form.workShop" :placeholder="tLang('common', '请输入') + tLang('device', '车间名称')" />
         </el-form-item>
-        <el-form-item :label="tLang('device','产线名称')" prop="lineName">
-          <el-input v-model="form.lineName" :placeholder="tLang('common','请输入') + tLang('device','产线名称')" />
+        <el-form-item :label="tLang('device', '产线名称')" prop="lineName">
+          <el-input v-model="form.lineName" :placeholder="tLang('common', '请输入') + tLang('device', '产线名称')" />
         </el-form-item>
-        <el-form-item :label="tLang('device','保养周期')" prop="maintenance">
-          <el-input v-model="form.maintenance" :placeholder="tLang('common','请输入') + tLang('device','保养周期')" />
+        <el-form-item :label="tLang('device', '保养周期')" prop="maintenance">
+          <el-input v-model="form.maintenance" :placeholder="tLang('common', '请输入') + tLang('device', '保养周期')" />
         </el-form-item>
-        <el-form-item :label="tLang('device','供货商名称')" prop="supplier">
-          <el-input v-model="form.supplier" :placeholder="tLang('common','请输入') + tLang('device','供货商名称')" />
+        <el-form-item :label="tLang('device', '供货商名称')" prop="supplier">
+          <el-input v-model="form.supplier" :placeholder="tLang('common', '请输入') + tLang('device', '供货商名称')" />
         </el-form-item>
-        <el-form-item :label="tLang('device','供货商联络人')" prop="supplierContactPerson">
-          <el-input v-model="form.supplierContactPerson" :placeholder="tLang('common','请输入') + tLang('device','供货商联络人')" />
+        <el-form-item :label="tLang('device', '供货商联络人')" prop="supplierContactPerson">
+          <el-input v-model="form.supplierContactPerson"
+            :placeholder="tLang('common', '请输入') + tLang('device', '供货商联络人')" />
         </el-form-item>
-        <el-form-item :label="tLang('device','生产厂家')" prop="manufacturer">
-          <el-input v-model="form.manufacturer" :placeholder="tLang('common','请输入') + tLang('device','生产厂家')" />
+        <el-form-item :label="tLang('device', '生产厂家')" prop="manufacturer">
+          <el-input v-model="form.manufacturer" :placeholder="tLang('common', '请输入') + tLang('device', '生产厂家')" />
         </el-form-item>
-        <el-form-item :label="tLang('device','联系电话')" prop="contactPhone">
-          <el-input v-model="form.contactPhone" :placeholder="tLang('common','请输入') + tLang('device','联系电话')" />
+        <el-form-item :label="tLang('device', '联系电话')" prop="contactPhone">
+          <el-input v-model="form.contactPhone" :placeholder="tLang('common', '请输入') + tLang('device', '联系电话')" />
         </el-form-item>
-        <el-form-item :label="tLang('device','品牌')" prop="brand">
-          <el-input v-model="form.brand" :placeholder="tLang('common','请输入') + tLang('device','品牌')" />
+        <el-form-item :label="tLang('device', '品牌')" prop="brand">
+          <el-input v-model="form.brand" :placeholder="tLang('common', '请输入') + tLang('device', '品牌')" />
         </el-form-item>
         <!-- <el-form-item :label="针数" prop="needleNum">
           <el-input-number v-model="form.needleNum" :min="1" />
         </el-form-item> -->
-        <el-form-item :label="tLang('device','设备型号')" prop="model">
-          <el-input v-model="form.model" :placeholder="tLang('common','请输入') + tLang('device','设备型号')" />
+        <el-form-item :label="tLang('device', '设备型号')" prop="model">
+          <el-input v-model="form.model" :placeholder="tLang('common', '请输入') + tLang('device', '设备型号')" />
         </el-form-item>
-        <el-form-item :label="tLang('device','图片')" prop="file">
+        <el-form-item :label="tLang('device', '图片')" prop="file">
           <image-upload v-model="form.file" />
         </el-form-item>
-        <el-form-item :label="tLang('device','备注')" prop="remark">
-          <el-input v-model="form.remark" :placeholder="tLang('common','请输入') + tLang('device','备注')" />
+        <el-form-item :label="tLang('device', '备注')" prop="remark">
+          <el-input v-model="form.remark" :placeholder="tLang('common', '请输入') + tLang('device', '备注')" />
         </el-form-item>
       </el-form>
       <template #footer>
         <div class="dialog-footer">
-          <el-button type="primary" @click="submitForm">{{tLang('common','确 定')}}</el-button>
-          <el-button @click="cancel">{{tLang('common','取 消')}}</el-button>
+          <el-button type="primary" @click="submitForm">{{ tLang('common', '确 定') }}</el-button>
+          <el-button @click="cancel">{{ tLang('common', '取 消') }}</el-button>
         </div>
       </template>
     </el-dialog>
@@ -223,19 +237,19 @@ let rules = ref({
 })
 // 列显隐信息
 const columns = ref([
-  { key: 0, label: proxy.tLang('device',`设备名称`), visible: true },
-  { key: 1, label: proxy.tLang('device',`设备编码`), visible: true },
-  { key: 2, label: proxy.tLang('device',`设备类型`), visible: true },
-  { key: 3, label:proxy.tLang('device',`车间名称`) , visible: true },
-  { key: 4, label:proxy.tLang('device',`产线名称`) , visible: false },
-  { key: 5, label:proxy.tLang('device',`保养周期`) , visible: false },
-  { key: 5, label:proxy.tLang('device',`供货商名称`) , visible: false },
-  { key: 5, label:proxy.tLang('device',`供货商联络人`) , visible: false },
-  { key: 5, label:proxy.tLang('device',`生产厂家`) , visible: false },
-  { key: 5, label:proxy.tLang('device',`联系电话`) , visible: false },
-  { key: 5, label:proxy.tLang('device',`品牌`) , visible: false },
-  { key: 5, label:proxy.tLang('device',`设备型号`) , visible: false },
-  { key: 5, label:proxy.tLang('device',`备注`) , visible: false },
+  { key: 0, label: proxy.tLang('device', `设备名称`), visible: true },
+  { key: 1, label: proxy.tLang('device', `设备编码`), visible: true },
+  { key: 2, label: proxy.tLang('device', `设备类型`), visible: true },
+  { key: 3, label: proxy.tLang('device', `车间名称`), visible: true },
+  { key: 4, label: proxy.tLang('device', `产线名称`), visible: false },
+  { key: 5, label: proxy.tLang('device', `保养周期`), visible: false },
+  { key: 5, label: proxy.tLang('device', `供货商名称`), visible: false },
+  { key: 5, label: proxy.tLang('device', `供货商联络人`), visible: false },
+  { key: 5, label: proxy.tLang('device', `生产厂家`), visible: false },
+  { key: 5, label: proxy.tLang('device', `联系电话`), visible: false },
+  { key: 5, label: proxy.tLang('device', `品牌`), visible: false },
+  { key: 5, label: proxy.tLang('device', `设备型号`), visible: false },
+  { key: 5, label: proxy.tLang('device', `备注`), visible: false },
 ]);
 /** 查询设备信息列表 */
 function getList() {
@@ -316,7 +330,7 @@ function handleInfo(row) {
 function handleAdd() {
   reset();
   open.value = true;
-  title.value = proxy.tLang('common','添加') + ' ' + proxy.tLang('device','设备信息');
+  title.value = proxy.tLang('common', '添加') + ' ' + proxy.tLang('device', '设备信息');
 }
 /** 修改按钮操作 */
 function handleUpdate(row) {
@@ -325,7 +339,7 @@ function handleUpdate(row) {
   getDevice(id).then(response => {
     form.value = response.data;
     open.value = true;
-    title.value = proxy.tLang('common','修改') + ' ' + proxy.tLang('device','设备信息');
+    title.value = proxy.tLang('common', '修改') + ' ' + proxy.tLang('device', '设备信息');
   });
 }
 /** 提交按钮 */
@@ -334,13 +348,13 @@ function submitForm() {
     if (valid) {
       if (form.value.id != null) {
         updateDevice(form.value).then(response => {
-          proxy.$modal.msgSuccess(proxy.tLang('common','修改成功'));
+          proxy.$modal.msgSuccess(proxy.tLang('common', '修改成功'));
           open.value = false;
           getList();
         });
       } else {
         addDevice(form.value).then(response => {
-          proxy.$modal.msgSuccess(proxy.tLang('common','新增成功'));
+          proxy.$modal.msgSuccess(proxy.tLang('common', '新增成功'));
           open.value = false;
           getList();
         });
@@ -351,11 +365,11 @@ function submitForm() {
 /** 删除按钮操作 */
 function handleDelete(row) {
   const id = row.id || ids.value;
-  proxy.$modal.confirm(proxy.tLang('tip','确定删除选中记录？') + ` [${id}]`).then(function () {
+  proxy.$modal.confirm(proxy.tLang('tip', '确定删除选中记录？') + ` [${id}]`).then(function () {
     return delDevice(id);
   }).then(() => {
     getList();
-    proxy.$modal.msgSuccess(proxy.tLang('common','删除成功'));
+    proxy.$modal.msgSuccess(proxy.tLang('common', '删除成功'));
   }).catch(() => { });
 }
 /** 导出按钮操作 */
@@ -378,4 +392,12 @@ onMounted(() => {
 .demo-form-inlinee :deep(.el-select) {
   --el-select-width: 220px;
 }
+
+.pagination {
+  width: 100%;
+  margin: 10px;
+  display: flex;
+  justify-content: center;
+  align-items: center;
+}
 </style>
diff --git a/src/views/index.vue b/src/views/index.vue
index 93d9bb4..85f9bdd 100644
--- a/src/views/index.vue
+++ b/src/views/index.vue
@@ -1,53 +1,298 @@
 <template>
-  <el-row :gutter="10" class="mb8">
-    
-  </el-row>
-  <v-chart class="chart" :option="option" />
+  <div class="app-container">
+    <el-row :gutter="10" class="mb8">
+      <el-col :span="3">
+        <div class="card-box">
+          员工总数：200人
+        </div>
+      </el-col>
+      <el-col :span="3">
+        <div class="card-box">
+          产出进度：60%
+        </div>
+      </el-col>
+    </el-row>
+    <div class="chart-content">
+      <div class="chart-content-card">
+        <v-chart class="line-chart" :option="line_option" />
+      </div>
+      <div class="chart-content-card">
+        <v-chart class="line-chart" :option="pie_option" />
+      </div>
+      <div class="right-content-card">
+        <div>20台/70台</div>
+        <div>设备：使用中/总数</div>
+      </div>
+    </div>
+    <div class="bottom">
+      <div class="device-item" v-for="(item, index) in produceList" :style="{'background-color':item_bgcolor[item.state]}">
+        <span class="iconfont icon-shengchanxiaoshuai icon-style" :style="{color:item_color[item.progressSignal],borderColor:item_color[item.progressSignal]}"></span>
+        <div class="device-item-content">
+          <div class="device-item-content-flex left">
+            <img class="frj-img" :src="item.file" alt="">
+            <span>设备编号：{{ item.deviceCode }}</span>
+          </div>
+          <div class="device-item-content-flex right">
+            <ul class="produce-list">
+              <li>工作人员：{{ item.userName }}</li>
+              <li>加工信息：{{ item.productionCode }}</li>
+              <li>产量：{{item.output}}/{{ item.planOutput }}</li>
+              <li>稼动率：{{ item.activation }}</li>
+            </ul>
+          </div>
+        </div>
+      </div>
+    </div>
+    <div class="pagination">
+      <el-pagination :hide-on-single-page="false" v-model:current-page="queryParams.pageNum"
+        v-model:page-size="queryParams.pageSize" layout="total, prev, pager, next, jumper" :total="total"
+        @size-change="getList" @current-change="getList" />
+    </div>
+  </div>
+
 </template>
 
 <script setup>
+import { getHomeDeviceInfoVO } from "@/api/home";
 
-const option = ref({
+let loading = ref(true)
+// 查询参数
+let queryParams = reactive({
+  pageNum: 1,
+  pageSize: 10,
+})
+const baseUrl = import.meta.env.VITE_APP_BASE_API;
+let total = ref(0)
+let produceList = ref([])
+let item_bgcolor = {
+  0: '#E8E8E8',
+  1: '#E9E5C9',
+  2: '#C9F6CC',
+  3: '#E9E5C9',
+  4: '#EFCAC5',
+}
+
+let item_color = {
+  0: '#5EF417',
+  1: '#176AF4',
+  2: '#DACB71',
+  3: '#D81E06',
+  4: '#CCCCCC',
+
+}
+
+const line_option = ref({
   title: {
-    text: "Traffic Sources",
-    left: "center"
+    text: '产量'
   },
-  tooltip: {
-    trigger: "item",
-    formatter: "{a} <br/>{b} : {c} ({d}%)"
+  xAxis: {
+    type: 'category',
+    data: ['Mon', 'Tue', 'Wed', 'Thu', 'Fri', 'Sat', 'Sun']
   },
-  legend: {
-    orient: "vertical",
-    left: "left",
-    data: ["Direct", "Email", "Ad Networks", "Video Ads", "Search Engines"]
+  yAxis: {
+    type: 'value'
   },
   series: [
     {
-      name: "Traffic Sources",
-      type: "pie",
-      radius: "55%",
-      center: ["50%", "60%"],
-      data: [
-        { value: 335, name: "Direct" },
-        { value: 310, name: "Email" },
-        { value: 234, name: "Ad Networks" },
-        { value: 135, name: "Video Ads" },
-        { value: 1548, name: "Search Engines" }
-      ],
-      emphasis: {
-        itemStyle: {
-          shadowBlur: 10,
-          shadowOffsetX: 0,
-          shadowColor: "rgba(0, 0, 0, 0.5)"
-        }
-      }
+      data: [820, 932, 901, 934, 1290, 1330, 1320],
+      type: 'line',
+      smooth: true
     }
   ]
 });
+
+const pie_option = ref({
+  "title": {
+    "text": "设备利用率：60%",
+    "left": "0",
+    "top": 0,
+    "textStyle": {
+      "color": "#333",
+      "fontSize": 24
+    }
+  },
+  tooltip: {
+    trigger: 'item'
+  },
+  legend: {
+    bottom: '5%',
+  },
+  series: [
+    {
+      name: 'Access From',
+      type: 'pie',
+      radius: ['40%', '70%'],
+      avoidLabelOverlap: false,
+      padAngle: 5,
+      itemStyle: {
+        borderRadius: 10
+      },
+      label: {
+        show: true,
+      },
+      data: [
+        { value: 1048, name: 'Search Engine' },
+        { value: 735, name: 'Direct' },
+        { value: 580, name: 'Email' },
+        { value: 484, name: 'Union Ads' },
+        { value: 300, name: 'Video Ads' }
+      ]
+    }
+  ]
+})
+
+function getList() {
+  loading.value = true;
+  getHomeDeviceInfoVO().then(response => {
+    produceList.value = response.rows.map((item, index) => {
+      item.file = baseUrl + item.file;
+      return item;
+    });
+    total.value = response.total;
+    // loading.value = false;
+  });
+}
+onMounted(() => {
+  getList();
+})
 </script>
 
-<style scoped>
-.chart {
-  height: 400px;
+<style scoped lang="scss">
+@import '@/assets/iconfont/iconfont.css';
+
+.card-box {
+  background-color: #C8EAF4;
+  border-radius: 4px;
+  box-shadow: 0 2px 12px 0 rgba(0, 0, 0, 0.1);
+  padding: 5px 5px;
+  text-align: center;
+  font-size: 18px;
+  font-weight: 700;
+  color: #333333;
+}
+
+.chart-content {
+  width: 100%;
+  height: 310px;
+  box-sizing: border-box;
+  display: flex;
+  justify-content: space-between;
+  align-items: center;
+
+  .chart-content-card {
+    width: 40%;
+    height: 100%;
+
+    .line-chart {
+      width: 100%;
+      height: 100%;
+    }
+  }
+
+  .right-content-card {
+    width: 200px;
+    height: 100%;
+    display: flex;
+    flex-direction: column;
+    justify-content: center;
+    align-items: center;
+    font-size: 18px;
+    font-weight: 700;
+    color: #333333;
+
+    div {
+      margin-bottom: 10px;
+    }
+  }
+
+}
+
+.bottom {
+  width: 100%;
+  height: calc(100vh - 310px - 110px);
+  display: grid;
+  grid-template-columns: 16.66% 16.66% 16.66% 16.66% 16.66% 16.66%;
+  grid-template-rows: 50% 50%;
+  /* 设置网格项目间间隙 */
+  gap: 10px 10px;
+
+  .device-item {
+    width: 100%;
+    height: 100%;
+    background-color: #fff;
+    border-radius: 10px;
+    box-shadow: 0 2px 8px 0 rgba(0, 0, 0, 0.1);
+    text-align: center;
+    padding:8px 2px 2px 2px;
+    box-sizing: border-box;
+
+    .icon-style {
+      font-size: 30px;
+      border: 2px solid;
+      border-radius: 50%;
+      padding: 10px;
+      line-height: 50px;
+      /*color: #bfc;*/
+    }
+
+    .device-item-content {
+      width: calc(100% - 4px);
+      height: calc(100% - 50px - 4px);
+      display: flex;
+      justify-content: center;
+      align-items: center;
+      font-size: 14px;
+
+      .left {
+        width: 50%;
+      }
+
+      .right {
+        flex: 1;
+        font-size: 12px;
+      }
+
+      .device-item-content-flex {
+        height: 100%;
+        box-sizing: border-box;
+        padding: 10px 0;
+        display: flex;
+        flex-direction: column;
+        justify-content: space-around;
+        align-items: center;
+        overflow: hidden;
+
+        .frj-img {
+          max-width: 100%;
+          max-height: 70%;
+          margin-bottom: 5px;
+        }
+
+        .produce-list {
+          padding: 0;
+          margin: 0 0 0 15px;
+          width: 100%;
+          height: 100%;
+          display: flex;
+          justify-content: space-around;
+          align-items: flex-start;
+          flex-direction: column;
+
+          li {
+            list-style: none;
+          }
+        }
+      }
+
+    }
+  }
+}
+
+.pagination {
+  width: 100%;
+  margin: 10px;
+  display: flex;
+  justify-content: center;
+  align-items: center;
 }
 </style>
\ No newline at end of file
diff --git a/src/views/produce/index.vue b/src/views/produce/index.vue
index 851842e..36a9ed8 100644
--- a/src/views/produce/index.vue
+++ b/src/views/produce/index.vue
@@ -2,56 +2,62 @@
     <div class="app-container">
         <el-form :model="queryParams" ref="queryForm" size="small" :inline="true" v-show="showSearch"
             label-width="68px">
-            <el-form-item :label="tLang('produce','产品编码')" prop="productionCode">
-                <el-input v-model="queryParams.productionCode" :placeholder="tLang('common','请输入') + tLang('produce','产品编码')" clearable
+            <el-form-item :label="tLang('produce', '产品编码')" prop="productionCode">
+                <el-input v-model="queryParams.productionCode"
+                    :placeholder="tLang('common', '请输入') + tLang('produce', '产品编码')" clearable
                     @keyup.enter="handleQuery" />
             </el-form-item>
-            <el-form-item :label="tLang('produce','设备编码')" prop="deviceCode">
-                <el-input v-model="queryParams.deviceCode" :placeholder="tLang('common','请输入') + tLang('produce','设备编码')" clearable
+            <el-form-item :label="tLang('produce', '设备编码')" prop="deviceCode">
+                <el-input v-model="queryParams.deviceCode"
+                    :placeholder="tLang('common', '请输入') + tLang('produce', '设备编码')" clearable
                     @keyup.enter="handleQuery" />
             </el-form-item>
-            <el-form-item :label="tLang('produce','员工编号')" prop="persionCode">
-                <el-input v-model="queryParams.persionCode" :placeholder="tLang('common','请输入') + tLang('produce','员工编号')" clearable
+            <el-form-item :label="tLang('produce', '员工编号')" prop="persionCode">
+                <el-input v-model="queryParams.persionCode"
+                    :placeholder="tLang('common', '请输入') + tLang('produce', '员工编号')" clearable
                     @keyup.enter="handleQuery" />
             </el-form-item>
-            <el-form-item :label="tLang('produce','目标产量')" prop="planOutput">
-                <el-input v-model="queryParams.planOutput" :placeholder="tLang('common','请输入') + tLang('produce','目标产量')" clearable
+            <el-form-item :label="tLang('produce', '目标产量')" prop="planOutput">
+                <el-input v-model="queryParams.planOutput"
+                    :placeholder="tLang('common', '请输入') + tLang('produce', '目标产量')" clearable
                     @keyup.enter="handleQuery" />
             </el-form-item>
-            <el-form-item :label="tLang('produce','当前产量')" prop="output">
-                <el-input v-model="queryParams.output" :placeholder="tLang('common','请输入') + tLang('produce','当前产量')" clearable
-                    @keyup.enter="handleQuery" />
+            <el-form-item :label="tLang('produce', '当前产量')" prop="output">
+                <el-input v-model="queryParams.output" :placeholder="tLang('common', '请输入') + tLang('produce', '当前产量')"
+                    clearable @keyup.enter="handleQuery" />
             </el-form-item>
-            <el-form-item :label="tLang('produce','开始时间')" prop="starttime">
+            <el-form-item :label="tLang('produce', '开始时间')" prop="starttime">
                 <el-date-picker clearable v-model="queryParams.starttime" type="datetime" format="YYYY-MM-DD hh:mm:ss"
-        value-format="YYYY-MM-DD hh:mm:ss" :placeholder="tLang('common','请选择') + tLang('produce','开始时间')">
+                    value-format="YYYY-MM-DD hh:mm:ss" :placeholder="tLang('common', '请选择') + tLang('produce', '开始时间')">
                 </el-date-picker>
             </el-form-item>
-            <el-form-item :label="tLang('produce','结束时间')" prop="endtime">
+            <el-form-item :label="tLang('produce', '结束时间')" prop="endtime">
                 <el-date-picker clearable v-model="queryParams.endtime" type="date" format="YYYY-MM-DD hh:mm:ss"
-        value-format="YYYY-MM-DD hh:mm:ss" :placeholder="tLang('common','请选择') + tLang('produce','结束时间')">
+                    value-format="YYYY-MM-DD hh:mm:ss" :placeholder="tLang('common', '请选择') + tLang('produce', '结束时间')">
                 </el-date-picker>
             </el-form-item>
             <el-form-item label="tLang('produce','批次')" prop="batch">
-                <el-input v-model="queryParams.batch" :placeholder="tLang('common','请输入') + tLang('produce','批次')" clearable @keyup.enter="handleQuery" />
+                <el-input v-model="queryParams.batch" :placeholder="tLang('common', '请输入') + tLang('produce', '批次')"
+                    clearable @keyup.enter="handleQuery" />
             </el-form-item>
             <el-form-item>
-                <el-button type="primary" icon="search" size="mini" @click="handleQuery">{{tLang('common','搜索')}}</el-button>
-                <el-button icon="refresh" size="mini" @click="resetQuery">{{tLang('common','重置')}}</el-button>
+                <el-button type="primary" icon="search" size="mini"
+                    @click="handleQuery">{{ tLang('common', '搜索') }}</el-button>
+                <el-button icon="refresh" size="mini" @click="resetQuery">{{ tLang('common', '重置') }}</el-button>
             </el-form-item>
         </el-form>
         <el-row :gutter="10" class="mb8">
             <el-col :span="1.5">
                 <el-button type="primary" plain icon="plus" size="mini" @click="handleAdd"
-                    v-hasPermi="['casm:produce:add']">{{tLang('common','新增')}}</el-button>
+                    v-hasPermi="['casm:produce:add']">{{ tLang('common', '新增') }}</el-button>
             </el-col>
             <el-col :span="1.5">
                 <el-button type="success" plain icon="edit" size="mini" :disabled="single" @click="handleUpdate"
-                    v-hasPermi="['casm:produce:edit']">{{tLang('common','修改')}}</el-button>
+                    v-hasPermi="['casm:produce:edit']">{{ tLang('common', '修改') }}</el-button>
             </el-col>
             <el-col :span="1.5">
                 <el-button type="danger" plain icon="delete" size="mini" :disabled="multiple" @click="handleDelete"
-                    v-hasPermi="['casm:produce:remove']">{{tLang('common','删除')}}</el-button>
+                    v-hasPermi="['casm:produce:remove']">{{ tLang('common', '删除') }}</el-button>
             </el-col>
             <!-- <el-col :span="1.5">
           <el-button type="warning" plain icon="download" size="mini" @click="handleExport"
@@ -61,35 +67,41 @@
         </el-row>
         <el-table v-loading="loading" :data="produceList" @selection-change="handleSelectionChange">
             <el-table-column type="selection" width="55" align="center" />
-            <el-table-column type="index" :label="tLang('common','序号')" width="60" align="center" />
-            <el-table-column :label="tLang('produce','产品编码')" v-if="columns[0].visible" align="center" prop="productionCode" />
-            <el-table-column :label="tLang('produce','设备编码')" v-if="columns[1].visible" align="center" prop="deviceCode" />
-            <el-table-column :label="tLang('produce','员工编号')" v-if="columns[2].visible" align="center" prop="persionCode" />
-            <el-table-column :label="tLang('produce','目标产量')" v-if="columns[3].visible" align="center" prop="planOutput" />
-            <el-table-column :label="tLang('produce','当前产量')" v-if="columns[4].visible" align="center" prop="output" />
-            <el-table-column :label="tLang('produce','开始时间')" v-if="columns[5].visible" align="center" prop="starttime" width="180">
+            <el-table-column type="index" :label="tLang('common', '序号')" width="60" align="center" />
+            <el-table-column :label="tLang('produce', '产品编码')" v-if="columns[0].visible" align="center"
+                prop="productionCode" />
+            <el-table-column :label="tLang('produce', '设备编码')" v-if="columns[1].visible" align="center"
+                prop="deviceCode" />
+            <el-table-column :label="tLang('produce', '员工编号')" v-if="columns[2].visible" align="center"
+                prop="persionCode" />
+            <el-table-column :label="tLang('produce', '目标产量')" v-if="columns[3].visible" align="center"
+                prop="planOutput" />
+            <el-table-column :label="tLang('produce', '当前产量')" v-if="columns[4].visible" align="center" prop="output" />
+            <el-table-column :label="tLang('produce', '开始时间')" v-if="columns[5].visible" align="center" prop="starttime"
+                width="180">
                 <template #default="scope">
                     <span>{{ parseTime(scope.row.starttime, '{y}-{m}-{d} {hh}:{mm}:{ss}') }}</span>
                 </template>
             </el-table-column>
-            <el-table-column :label="tLang('produce','结束时间')" v-if="columns[6].visible" align="center" prop="endtime" width="180">
+            <el-table-column :label="tLang('produce', '结束时间')" v-if="columns[6].visible" align="center" prop="endtime"
+                width="180">
                 <template #default="scope">
                     <span>{{ parseTime(scope.row.endtime, '{y}-{m}-{d} {hh}:{mm}:{ss}') }}</span>
                 </template>
             </el-table-column>
-            <el-table-column :label="tLang('produce','批次')" v-if="columns[7].visible" align="center" prop="batch" />
-            <el-table-column :label="tLang('produce','备注')" v-if="columns[8].visible" align="center" prop="remark" />
-            <el-table-column :label="tLang('common','操作')" align="center" class-name="small-padding fixed-width">
+            <el-table-column :label="tLang('produce', '批次')" v-if="columns[7].visible" align="center" prop="batch" />
+            <el-table-column :label="tLang('produce', '备注')" v-if="columns[8].visible" align="center" prop="remark" />
+            <el-table-column :label="tLang('common', '操作')" align="center" class-name="small-padding fixed-width">
                 <template #default="scope">
-                    <el-tooltip :content="tLang('common','详情')" placement="top" v-if="scope.row.userId !== 1">
+                    <el-tooltip :content="tLang('common', '详情')" placement="top" v-if="scope.row.userId !== 1">
                         <el-button link type="primary" icon="Tickets" @click="handleInfo(scope.row)"
                             v-hasPermi="['casm:produce:info']"></el-button>
                     </el-tooltip>
-                    <el-tooltip :content="tLang('common','修改')" placement="top" v-if="scope.row.userId !== 1">
+                    <el-tooltip :content="tLang('common', '修改')" placement="top" v-if="scope.row.userId !== 1">
                         <el-button link type="primary" icon="Edit" @click="handleUpdate(scope.row)"
                             v-hasPermi="['casm:produce:edit']"></el-button>
                     </el-tooltip>
-                    <el-tooltip :content="tLang('common','删除')" placement="top" v-if="scope.row.userId !== 1">
+                    <el-tooltip :content="tLang('common', '删除')" placement="top" v-if="scope.row.userId !== 1">
                         <el-button link type="primary" icon="Delete" @click="handleDelete(scope.row)"
                             v-hasPermi="['casm:produce:remove']"></el-button>
                     </el-tooltip>
@@ -97,8 +109,12 @@
             </el-table-column>
         </el-table>
 
-        <pagination v-show="total > 0" :total="total" :page.sync="queryParams.pageNum"
-            :limit.sync="queryParams.pageSize" @pagination="getList" />
+        <div class="pagination">
+            <el-pagination :hide-on-single-page="true" v-model:current-page="queryParams.pageNum"
+                v-model:page-size="queryParams.pageSize" :page-sizes="[25, 50, 100, 150]"
+                layout="total, sizes, prev, pager, next, jumper" :total="total" @size-change="getList"
+                @current-change="getList" />
+        </div>
         <AddEdit :title="title" v-model="open" :form="form" @submitForm="submitForm"></AddEdit>
         <InfoVue v-model="infoDialog" :info="produceinfo" />
 
@@ -107,7 +123,7 @@
 
 <script setup>
 import { ref, reactive, watch, onMounted } from 'vue'
-import { listOutput, getOutput, delOutput, addOutput, updateOutput,getOutputInfo } from "@/api/casm/produce";
+import { listOutput, getOutput, delOutput, addOutput, updateOutput, getOutputInfo } from "@/api/casm/produce";
 import AddEdit from './add_edit.vue';
 import InfoVue from './info.vue';
 const { proxy } = getCurrentInstance();
@@ -149,15 +165,15 @@ let produceList = ref([
 ])
 // 列显隐信息
 const columns = ref([
-    { key: 0, label: proxy.tLang('produce','产品编码'), visible: true },
-    { key: 1, label: proxy.tLang('produce','设备编码'), visible: true },
-    { key: 2, label: proxy.tLang('produce','员工编号'), visible: true },
-    { key: 3, label: proxy.tLang('produce','目标产量'), visible: true },
-    { key: 4, label: proxy.tLang('produce','当前产量'), visible: true },
-    { key: 5, label: proxy.tLang('produce','开始时间'), visible: true },
-    { key: 6, label: proxy.tLang('produce','结束时间'), visible: true },
-    { key: 7, label: proxy.tLang('produce','批次'), visible: true },
-    { key: 8, label: proxy.tLang('produce','备注'), visible: false },
+    { key: 0, label: proxy.tLang('produce', '产品编码'), visible: true },
+    { key: 1, label: proxy.tLang('produce', '设备编码'), visible: true },
+    { key: 2, label: proxy.tLang('produce', '员工编号'), visible: true },
+    { key: 3, label: proxy.tLang('produce', '目标产量'), visible: true },
+    { key: 4, label: proxy.tLang('produce', '当前产量'), visible: true },
+    { key: 5, label: proxy.tLang('produce', '开始时间'), visible: true },
+    { key: 6, label: proxy.tLang('produce', '结束时间'), visible: true },
+    { key: 7, label: proxy.tLang('produce', '批次'), visible: true },
+    { key: 8, label: proxy.tLang('produce', '备注'), visible: false },
 ]);
 
 const infoDialog = ref(false)
@@ -167,8 +183,8 @@ function getList() {
     loading.value = true;
     listOutput(queryParams).then(response => {
         produceList.value = response.rows;
-      total.value = response.total;
-      loading.value = false;
+        total.value = response.total;
+        loading.value = false;
     });
 }
 // 多选框选中数据
@@ -196,20 +212,20 @@ function resetQuery() {
 function handleAdd() {
     reset();
     open.value = true;
-    title.value = proxy.tLang('common','添加') + ' ' + proxy.tLang('produce','生产信息');
+    title.value = proxy.tLang('common', '添加') + ' ' + proxy.tLang('produce', '生产信息');
 }
 
 /** 提交按钮 */
 function submitForm(propform) {
     if (propform.id != null) {
         updateOutput(form.value).then(response => {
-            proxy.$modal.msgSuccess(proxy.tLang('common','修改成功'));
+            proxy.$modal.msgSuccess(proxy.tLang('common', '修改成功'));
             open.value = false;
             getList();
         });
     } else {
         addOutput(form.value).then(response => {
-            proxy.$modal.msgSuccess(proxy.tLang('common','新增成功'));
+            proxy.$modal.msgSuccess(proxy.tLang('common', '新增成功'));
             open.value = false;
             getList();
         });
@@ -241,8 +257,10 @@ function reset() {
 
 /**详情按钮操作 */
 function handleInfo(row) {
-  produceinfo.value = row
-  infoDialog.value = true
+    getOutputInfo(row.id).then(response => {
+        produceinfo.value = response.data;
+        infoDialog.value = true;
+    });
 }
 
 /** 修改按钮操作 */
@@ -252,18 +270,18 @@ function handleUpdate(row) {
     getOutput(id).then(response => {
         form.value = response.data;
         open.value = true;
-        title.value = proxy.tLang('common','修改') + ' ' + proxy.tLang('produce','生产信息');
+        title.value = proxy.tLang('common', '修改') + ' ' + proxy.tLang('produce', '生产信息');
     });
 }
 
 /** 删除按钮操作 */
 function handleDelete(row) {
     const id = row.id || ids.value;
-    proxy.$modal.confirm(proxy.tLang('tip','确定删除选中记录？') + ` [${id}]`).then(function () {
+    proxy.$modal.confirm(proxy.tLang('tip', '确定删除选中记录？') + ` [${id}]`).then(function () {
         return delOutput(id);
     }).then(() => {
         getList();
-        proxy.$modal.msgSuccess(proxy.tLang('common','删除成功'));
+        proxy.$modal.msgSuccess(proxy.tLang('common', '删除成功'));
     }).catch(() => { });
 }
 onMounted(() => {
@@ -271,4 +289,12 @@ onMounted(() => {
 })
 </script>
 
-<style lang="scss" scoped></style>
\ No newline at end of file
+<style lang="scss" scoped>
+.pagination {
+    width: 100%;
+    margin: 10px;
+    display: flex;
+    justify-content: center;
+    align-items: center;
+}
+</style>
\ No newline at end of file
diff --git a/src/views/product/needle/index.vue b/src/views/product/needle/index.vue
index 710fc11..7ab5941 100644
--- a/src/views/product/needle/index.vue
+++ b/src/views/product/needle/index.vue
@@ -1,41 +1,43 @@
 <template>
   <div class="app-container">
     <el-form :model="queryParams" ref="queryForm" size="small" :inline="true" v-show="showSearch" label-width="68px">
-      <el-form-item :label="tLang('product','产品编码')" prop="code">
-        <el-input v-model="queryParams.code" :placeholder="tLang('common','请输入') + tLang('product','产品编码')" clearable @keyup.enter="handleQuery" />
-      </el-form-item>
-      <el-form-item :label="tLang('product','针号')" prop="needleNum">
-        <el-input v-model="queryParams.needleNum" :placeholder="tLang('common','请输入') + tLang('product','针号')" clearable @keyup.enter="handleQuery" />
-      </el-form-item>
-      <el-form-item :label="tLang('product','面线信息')" prop="surfacelineId">
-        <el-input v-model="queryParams.surfacelineId" :placeholder="tLang('common','请输入') + tLang('product','面线信息')" clearable
+      <el-form-item :label="tLang('product', '产品编码')" prop="code">
+        <el-input v-model="queryParams.code" :placeholder="tLang('common', '请输入') + tLang('product', '产品编码')" clearable
           @keyup.enter="handleQuery" />
       </el-form-item>
-      <el-form-item :label="tLang('product','底线信息')" prop="bottomlineId">
-        <el-input v-model="queryParams.bottomlineId" :placeholder="tLang('common','请输入') + tLang('product','底线信息')" clearable
+      <el-form-item :label="tLang('product', '针号')" prop="needleNum">
+        <el-input v-model="queryParams.needleNum" :placeholder="tLang('common', '请输入') + tLang('product', '针号')" clearable
           @keyup.enter="handleQuery" />
       </el-form-item>
-      <el-form-item :label="tLang('product','梭芯信息')" prop="shuttlecoreId">
-        <el-input v-model="queryParams.shuttlecoreId" :placeholder="tLang('common','请输入') + tLang('product','梭芯信息')" clearable
-          @keyup.enter="handleQuery" />
+      <el-form-item :label="tLang('product', '面线信息')" prop="surfacelineId">
+        <el-input v-model="queryParams.surfacelineId" :placeholder="tLang('common', '请输入') + tLang('product', '面线信息')"
+          clearable @keyup.enter="handleQuery" />
+      </el-form-item>
+      <el-form-item :label="tLang('product', '底线信息')" prop="bottomlineId">
+        <el-input v-model="queryParams.bottomlineId" :placeholder="tLang('common', '请输入') + tLang('product', '底线信息')"
+          clearable @keyup.enter="handleQuery" />
+      </el-form-item>
+      <el-form-item :label="tLang('product', '梭芯信息')" prop="shuttlecoreId">
+        <el-input v-model="queryParams.shuttlecoreId" :placeholder="tLang('common', '请输入') + tLang('product', '梭芯信息')"
+          clearable @keyup.enter="handleQuery" />
       </el-form-item>
       <el-form-item>
-        <el-button type="primary" icon="search" size="mini" @click="handleQuery">{{tLang('common','搜索')}}</el-button>
-        <el-button icon="refresh" size="mini" @click="resetQuery">{{tLang('common','重置')}}</el-button>
+        <el-button type="primary" icon="search" size="mini" @click="handleQuery">{{ tLang('common', '搜索') }}</el-button>
+        <el-button icon="refresh" size="mini" @click="resetQuery">{{ tLang('common', '重置') }}</el-button>
       </el-form-item>
     </el-form>
     <el-row :gutter="10" class="mb8">
       <el-col :span="1.5">
         <el-button type="primary" plain icon="plus" size="mini" @click="handleAdd"
-          v-hasPermi="['product:needle:add']">{{tLang('common','新增')}}</el-button>
+          v-hasPermi="['product:needle:add']">{{ tLang('common', '新增') }}</el-button>
       </el-col>
       <el-col :span="1.5">
         <el-button type="success" plain icon="edit" size="mini" :disabled="single" @click="handleUpdate"
-          v-hasPermi="['product:needle:edit']">{{tLang('common','修改')}}</el-button>
+          v-hasPermi="['product:needle:edit']">{{ tLang('common', '修改') }}</el-button>
       </el-col>
       <el-col :span="1.5">
         <el-button type="danger" plain icon="delete" size="mini" :disabled="multiple" @click="handleDelete"
-          v-hasPermi="['product:needle:remove']">{{tLang('common','删除')}}</el-button>
+          v-hasPermi="['product:needle:remove']">{{ tLang('common', '删除') }}</el-button>
       </el-col>
       <!-- <el-col :span="1.5">
         <el-button type="warning" plain icon="download" size="mini" @click="handleExport"
@@ -45,25 +47,26 @@
     </el-row>
     <el-table v-loading="loading" :data="productionLineRelationList" @selection-change="handleSelectionChange">
       <el-table-column type="selection" width="55" align="center" />
-      <el-table-column type="index" :label="tLang('common','序号')" width="60" align="center" />
+      <el-table-column type="index" :label="tLang('common', '序号')" width="60" align="center" />
       <!-- <el-table-column :label="主键id" align="center" prop="id" /> -->
-      <el-table-column :label="tLang('product','产品编码')" align="center"  v-if="columns[0].visible" prop="code" />
-      <el-table-column :label="tLang('product','针号')" align="center"  v-if="columns[1].visible" prop="needleNum" />
-      <el-table-column :label="tLang('product','面线信息')" align="center" v-if="columns[2].visible" prop="surfacelineId" />
-      <el-table-column :label="tLang('product','底线信息')" align="center" width="80" v-if="columns[3].visible" prop="bottomlineId" />
-      <el-table-column :label="tLang('product','梭芯信息')" align="center" v-if="columns[4].visible" prop="shuttlecoreId" />
-      <el-table-column :label="tLang('product','排序')" align="center" v-if="columns[5].visible" prop="sort" />
-      <el-table-column :label="tLang('product','最小值')" align="center" v-if="columns[6].visible" prop="min" />
-      <el-table-column :label="tLang('product','最大值')" align="center" v-if="columns[7].visible" prop="max" />
+      <el-table-column :label="tLang('product', '产品编码')" align="center" v-if="columns[0].visible" prop="code" />
+      <el-table-column :label="tLang('product', '针号')" align="center" v-if="columns[1].visible" prop="needleNum" />
+      <el-table-column :label="tLang('product', '面线信息')" align="center" v-if="columns[2].visible" prop="surfacelineId" />
+      <el-table-column :label="tLang('product', '底线信息')" align="center" width="80" v-if="columns[3].visible"
+        prop="bottomlineId" />
+      <el-table-column :label="tLang('product', '梭芯信息')" align="center" v-if="columns[4].visible" prop="shuttlecoreId" />
+      <el-table-column :label="tLang('product', '排序')" align="center" v-if="columns[5].visible" prop="sort" />
+      <el-table-column :label="tLang('product', '最小值')" align="center" v-if="columns[6].visible" prop="min" />
+      <el-table-column :label="tLang('product', '最大值')" align="center" v-if="columns[7].visible" prop="max" />
       <!-- <el-table-column :label="tLang('product','类型')" align="center" v-if="columns[8].visible" prop="type" /> -->
       <!-- <el-table-column :label="备注" align="center" prop="remark" /> -->
-      <el-table-column :label="tLang('common','操作')" align="center" class-name="small-padding fixed-width">
+      <el-table-column :label="tLang('common', '操作')" align="center" class-name="small-padding fixed-width">
         <template #default="scope">
-          <el-tooltip :content="tLang('common','修改')" placement="top" v-if="scope.row.userId !== 1">
+          <el-tooltip :content="tLang('common', '修改')" placement="top" v-if="scope.row.userId !== 1">
             <el-button link type="primary" icon="Edit" @click="handleUpdate(scope.row)"
               v-hasPermi="['product:needle:edit']"></el-button>
           </el-tooltip>
-          <el-tooltip :content="tLang('common','删除')" placement="top" v-if="scope.row.userId !== 1">
+          <el-tooltip :content="tLang('common', '删除')" placement="top" v-if="scope.row.userId !== 1">
             <el-button link type="primary" icon="Delete" @click="handleDelete(scope.row)"
               v-hasPermi="['product:needle:remove']"></el-button>
           </el-tooltip>
@@ -71,8 +74,12 @@
       </el-table-column>
     </el-table>
 
-    <pagination v-show="total > 0" :total="total" :page.sync="queryParams.pageNum" :limit.sync="queryParams.pageSize"
-      @pagination="getList" />
+    <div class="pagination">
+      <el-pagination :hide-on-single-page="true" v-model:current-page="queryParams.pageNum"
+        v-model:page-size="queryParams.pageSize" :page-sizes="[25, 50, 100, 150]"
+        layout="total, sizes, prev, pager, next, jumper" :total="total" @size-change="getList"
+        @current-change="getList" />
+    </div>
     <AddEdit :title="title" v-model="open" :form="form" @submitForm="submitForm"></AddEdit>
   </div>
 </template>
@@ -119,14 +126,14 @@ let total = ref(0)
 let productionLineRelationList = ref([])
 // 列显隐信息
 const columns = ref([
-  { key: 0, label: proxy.tLang('product','产品编码'), visible: true },
-  { key: 1, label: proxy.tLang('product','针号'), visible: true },
-  { key: 2, label: proxy.tLang('product','面线信息'), visible: true },
-  { key: 3, label: proxy.tLang('product','底线信息'), visible: true },
-  { key: 4, label: proxy.tLang('product','梭芯信息'), visible: true },
-  { key: 5, label: proxy.tLang('product','排序'), visible: true },
-  { key: 6, label: proxy.tLang('product','最小值'), visible: true },
-  { key: 7, label: proxy.tLang('product','最大值'), visible: true },
+  { key: 0, label: proxy.tLang('product', '产品编码'), visible: true },
+  { key: 1, label: proxy.tLang('product', '针号'), visible: true },
+  { key: 2, label: proxy.tLang('product', '面线信息'), visible: true },
+  { key: 3, label: proxy.tLang('product', '底线信息'), visible: true },
+  { key: 4, label: proxy.tLang('product', '梭芯信息'), visible: true },
+  { key: 5, label: proxy.tLang('product', '排序'), visible: true },
+  { key: 6, label: proxy.tLang('product', '最小值'), visible: true },
+  { key: 7, label: proxy.tLang('product', '最大值'), visible: true },
   // { key: 8, label: proxy.tLang('product','类型'), visible: true },
 ]);
 
@@ -167,7 +174,7 @@ function resetQuery() {
 function handleAdd() {
   reset();
   open.value = true;
-  title.value = proxy.tLang('common','添加') + ' '+proxy.tLang('product','针号');
+  title.value = proxy.tLang('common', '添加') + ' ' + proxy.tLang('product', '针号');
 }
 
 /**详情按钮操作 */
@@ -183,13 +190,13 @@ function submitForm(propform) {
 
   if (propform.id != null) {
     updateProductionLineRelation(propform).then(response => {
-      proxy.$modal.msgSuccess(proxy.tLang('common','修改成功'));
+      proxy.$modal.msgSuccess(proxy.tLang('common', '修改成功'));
       open.value = false;
       getList();
     });
   } else {
     addProductionLineRelation(propform).then(response => {
-      proxy.$modal.msgSuccess(proxy.tLang('common','新增成功'));
+      proxy.$modal.msgSuccess(proxy.tLang('common', '新增成功'));
       open.value = false;
       getList();
     });
@@ -229,18 +236,18 @@ function handleUpdate(row) {
   getProductionLineRelation(id).then(response => {
     form.value = response.data;
     open.value = true;
-    title.value = proxy.tLang('common','修改') + ' ' + proxy.tLang('product','针号');
+    title.value = proxy.tLang('common', '修改') + ' ' + proxy.tLang('product', '针号');
   });
 }
 
 /** 删除按钮操作 */
 function handleDelete(row) {
   const id = row.id || ids.value;
-  proxy.$modal.confirm(proxy.tLang('tip','确定删除选中记录？') + ` [${id}]`).then(function () {
+  proxy.$modal.confirm(proxy.tLang('tip', '确定删除选中记录？') + ` [${id}]`).then(function () {
     return delProductionLineRelation(id);
   }).then(() => {
     getList();
-    proxy.$modal.msgSuccess(proxy.tLang('common','删除成功'));
+    proxy.$modal.msgSuccess(proxy.tLang('common', '删除成功'));
   }).catch(() => { });
 }
 onMounted(() => {
@@ -248,4 +255,12 @@ onMounted(() => {
 })
 </script>
 
-<style lang="scss" scoped></style>
+<style lang="scss" scoped>
+.pagination {
+  width: 100%;
+  margin: 10px;
+  display: flex;
+  justify-content: center;
+  align-items: center;
+}
+</style>
diff --git a/src/views/product/product/index.vue b/src/views/product/product/index.vue
index 9467096..c11fc00 100644
--- a/src/views/product/product/index.vue
+++ b/src/views/product/product/index.vue
@@ -45,9 +45,7 @@
       <el-table-column :label="tLang('product', '产品编码')" align="center" v-if="columns[2].visible" prop="code" />
       <el-table-column :label="tLang('product', '二维码')" align="center" v-if="columns[2].visible" prop="code">
         <template #default="scope">
-          <el-button type="primary" @click="getProductQRCode(scope.row.code)">{{ tLang('product', '查看')
-            }}</el-button>
-          <el-button type="warning" @click="downloadQRCode(scope.row.code)">{{ tLang('product', '下载')
+          <el-button type="primary" @click="getProductQRCode(scope.row.code)">{{ tLang('product', '下载')
             }}</el-button>
         </template>
       </el-table-column>
@@ -69,14 +67,19 @@
       </el-table-column>
     </el-table>
 
-    <pagination v-show="total > 0" :total="total" :page.sync="queryParams.pageNum" :limit.sync="queryParams.pageSize"
-      @pagination="getList" />
+    <div class="pagination">
+      <el-pagination :hide-on-single-page="true" v-model:current-page="queryParams.pageNum"
+        v-model:page-size="queryParams.pageSize" :page-sizes="[25, 50, 100, 150]"
+        layout="total, sizes, prev, pager, next, jumper" :total="total" @size-change="getList"
+        @current-change="getList" />
+    </div>
     <AddEdit :title="title" v-model="open" :form="form" @submitForm="submitForm"></AddEdit>
     <InfoVue v-model="infoDialog" :info="productinfo" />
 
     <el-image-viewer v-if="showImagePreview" :url-list="showsrcListref" hide-on-click-modal teleported
       @close="closePreview" style="z-index: 3000" />
   </div>
+  <canvas ref="myCanvas" width="350" height="250" style="display: none;"></canvas>
 </template>
 
 <script setup>
@@ -123,48 +126,52 @@ let showImagePreview = ref(false)
 function closePreview() {
   showImagePreview.value = false
 }
-
+let myCanvas = ref(null)
+let ctx = null
 function getProductQRCode(code) {
   getQRCode({ code }).then(response => {
     if (response.code == 200) {
-      let base64Image = response.data      
-      // 打开新标签页
-      var newWindow = window.open('', '_blank');
-      // 在新标签页中写入图片
-      if (newWindow) {
-        newWindow.href = base64Image
-        newWindow.document.write(`
-        <div style="width:100%;height:100%;display:flex;flex-direction: column;justify-content:center;align-items:center;">
-          <img src="${base64Image}" alt="Image" style="align:center;" />
-          <button style="width: 100px;height: 40px;border-radius: 10px;background: #67c23a;border: none;color: #fff;" onclick="window.print()">打印</button>
-          </div>
-        `);
-      } else {
-        alert('无法打开新窗口。请允许弹出窗口。');
-      }
-      // showsrcListref.value = [response.data]
-      // showImagePreview.value = true
+      const qrCodeURL = response.data.base64
+      let list = JSON.parse(response.data.content)
+      console.log(list);
+      ctx = myCanvas.value.getContext('2d');
+
+      // 绘制二维码
+      const qrImage = new Image();
+      qrImage.onload = function () {
+        ctx.drawImage(qrImage, 30, 10, 200, 200); // 根据需要调整二维码的位置
+        addListInfo(list);
+      };
+      qrImage.src = qrCodeURL;
     }
   });
+
+  
+// 添加列表信息
+function addListInfo(list) {
+  ctx.font = "12px Arial";
+  ctx.fillStyle = "black";
+  
+  Object.keys(list).forEach((key,index) => {
+    ctx.fillText(key +':'+ list[key], 240, 30 + index * 20); // 调整文本的位置和行间距
+  });
+  downloadImage();
 }
 
-//二维码下载
-function downloadQRCode(code) {
-  getQRCode({ code }).then(response => {
-    if (response.code == 200) {
-      let base64Image = response.data
-      // 创建a标签
-      var a = document.createElement('a');
-      a.href = base64Image;
-      // 创建一个单击事件
-      var event = new MouseEvent('click');
-      // 设置a标签的下载链接
-      a.download = code + '.png';
-      // 触发a标签的单击事件
-      a.dispatchEvent(event);
-    }
-  });
+// 下载图片
+function downloadImage() {
+  const image = myCanvas.value.toDataURL("image/png").replace("image/png", "image/octet-stream");
+  const link = document.createElement('a');
+  link.download = code + '.png';
+  link.href = image;
+  link.click();
 }
+}
+
+
+
+
+
 // 列显隐信息
 const columns = ref([
   { key: 0, label: proxy.tLang('product', '产品名称'), visible: true },
@@ -283,4 +290,12 @@ onMounted(() => {
 })
 </script>
 
-<style lang="scss" scoped></style>
+<style lang="scss" scoped>
+.pagination {
+  width: 100%;
+  margin: 10px;
+  display: flex;
+  justify-content: center;
+  align-items: center;
+}
+</style>
diff --git a/src/views/product/working/index.vue b/src/views/product/working/index.vue
index 6cda69b..ff8b94f 100644
--- a/src/views/product/working/index.vue
+++ b/src/views/product/working/index.vue
@@ -1,43 +1,45 @@
 <template>
   <div class="app-container">
     <el-form :model="queryParams" ref="queryForm" size="small" :inline="true" v-show="showSearch" label-width="68px">
-      <el-form-item :label="tLang('product','产品编码')" prop="code">
-        <el-input v-model="queryParams.code" :placeholder="tLang('common','请输入') + tLang('product','产品编码')" clearable @keyup.enter.native="handleQuery" />
+      <el-form-item :label="tLang('product', '产品编码')" prop="code">
+        <el-input v-model="queryParams.code" :placeholder="tLang('common', '请输入') + tLang('product', '产品编码')" clearable
+          @keyup.enter.native="handleQuery" />
       </el-form-item>
-      <el-form-item :label="tLang('product','步骤')" prop="step">
-        <el-input v-model="queryParams.step" :placeholder="tLang('common','请输入') + tLang('product','步骤')" clearable @keyup.enter.native="handleQuery" />
+      <el-form-item :label="tLang('product', '步骤')" prop="step">
+        <el-input v-model="queryParams.step" :placeholder="tLang('common', '请输入') + tLang('product', '步骤')" clearable
+          @keyup.enter.native="handleQuery" />
       </el-form-item>
       <el-form-item>
-        <el-button type="primary" icon="search" size="mini" @click="handleQuery">{{tLang('common','搜索')}}</el-button>
-        <el-button icon="refresh" size="mini" @click="resetQuery">{{tLang('common','重置')}}</el-button>
+        <el-button type="primary" icon="search" size="mini" @click="handleQuery">{{ tLang('common', '搜索') }}</el-button>
+        <el-button icon="refresh" size="mini" @click="resetQuery">{{ tLang('common', '重置') }}</el-button>
       </el-form-item>
     </el-form>
     <el-row :gutter="10" class="mb8">
       <el-col :span="1.5">
         <el-button type="primary" plain icon="plus" size="mini" @click="handleAdd"
-          v-hasPermi="['product:working:add']">{{tLang('common','新增')}}</el-button>
+          v-hasPermi="['product:working:add']">{{ tLang('common', '新增') }}</el-button>
       </el-col>
       <el-col :span="1.5">
         <el-button type="success" plain icon="edit" size="mini" :disabled="single" @click="handleUpdate"
-          v-hasPermi="['product:working:edit']">{{tLang('common','修改')}}</el-button>
+          v-hasPermi="['product:working:edit']">{{ tLang('common', '修改') }}</el-button>
       </el-col>
       <el-col :span="1.5">
         <el-button type="danger" plain icon="delete" size="mini" :disabled="multiple" @click="handleDelete"
-          v-hasPermi="['product:working:remove']">{{tLang('common','删除')}}</el-button>
+          v-hasPermi="['product:working:remove']">{{ tLang('common', '删除') }}</el-button>
       </el-col>
       <right-toolbar v-model:showSearch="showSearch" @queryTable="getList" :columns="columns"></right-toolbar>
     </el-row>
     <el-table v-loading="loading" :data="procedureList" @selection-change="handleSelectionChange">
       <el-table-column type="selection" width="55" align="center" />
-      <el-table-column type="index" :label="tLang('common','序号')" width="60" align="center" />
-      <el-table-column :label="tLang('product','产品编码')" align="center" v-if="columns[0].visible" prop="code" />
-      <el-table-column :label="tLang('product','第几针')" align="center" v-if="columns[1].visible" prop="num" />
-      <el-table-column :label="tLang('product','步骤')" align="center" v-if="columns[2].visible" prop="step" />
-      <el-table-column :label="tLang('product','最小值')" align="center" v-if="columns[3].visible" prop="min" />
-      <el-table-column :label="tLang('product','最大值')" align="center" v-if="columns[4].visible" prop="max" />
-      <el-table-column :label="tLang('product','排序')" align="center" v-if="columns[5].visible" prop="sort" />
-      <el-table-column :label="tLang('product','备注')" align="center" v-if="columns[6].visible" prop="remark" />
-      <el-table-column :label="tLang('common','操作')" align="center" class-name="small-padding fixed-width">
+      <el-table-column type="index" :label="tLang('common', '序号')" width="60" align="center" />
+      <el-table-column :label="tLang('product', '产品编码')" align="center" v-if="columns[0].visible" prop="code" />
+      <el-table-column :label="tLang('product', '第几针')" align="center" v-if="columns[1].visible" prop="num" />
+      <el-table-column :label="tLang('product', '步骤')" align="center" v-if="columns[2].visible" prop="step" />
+      <el-table-column :label="tLang('product', '最小值')" align="center" v-if="columns[3].visible" prop="min" />
+      <el-table-column :label="tLang('product', '最大值')" align="center" v-if="columns[4].visible" prop="max" />
+      <el-table-column :label="tLang('product', '排序')" align="center" v-if="columns[5].visible" prop="sort" />
+      <el-table-column :label="tLang('product', '备注')" align="center" v-if="columns[6].visible" prop="remark" />
+      <el-table-column :label="tLang('common', '操作')" align="center" class-name="small-padding fixed-width">
         <template #default="scope">
           <el-tooltip content="修改" placement="top" v-if="scope.row.userId !== 1">
             <el-button link type="primary" icon="Edit" @click="handleUpdate(scope.row)"
@@ -51,8 +53,12 @@
       </el-table-column>
     </el-table>
 
-    <pagination v-show="total > 0" :total="total" :page.sync="queryParams.pageNum" :limit.sync="queryParams.pageSize"
-      @pagination="getList" />
+    <div class="pagination">
+      <el-pagination :hide-on-single-page="true" v-model:current-page="queryParams.pageNum"
+        v-model:page-size="queryParams.pageSize" :page-sizes="[25, 50, 100, 150]"
+        layout="total, sizes, prev, pager, next, jumper" :total="total" @size-change="getList"
+        @current-change="getList" />
+    </div>
     <AddEdit :title="title" v-model="open" :form="form" @submitForm="submitForm"></AddEdit>
   </div>
 </template>
@@ -95,13 +101,13 @@ let total = ref(0)
 let procedureList = ref([])
 // 列显隐信息
 const columns = ref([
-  { key: 0, label:proxy.tLang('product','产品编码') , visible: true },
-  { key: 1, label:proxy.tLang('product','第几针') , visible: true },
-  { key: 2, label:proxy.tLang('product','步骤') , visible: true },
-  { key: 3, label:proxy.tLang('product','最小值') , visible: true },
-  { key: 4, label:proxy.tLang('product','最大值') , visible: true },
-  { key: 5, label:proxy.tLang('product','排序') , visible: true },
-  { key: 6, label:proxy.tLang('product','备注') , visible: true },
+  { key: 0, label: proxy.tLang('product', '产品编码'), visible: true },
+  { key: 1, label: proxy.tLang('product', '第几针'), visible: true },
+  { key: 2, label: proxy.tLang('product', '步骤'), visible: true },
+  { key: 3, label: proxy.tLang('product', '最小值'), visible: true },
+  { key: 4, label: proxy.tLang('product', '最大值'), visible: true },
+  { key: 5, label: proxy.tLang('product', '排序'), visible: true },
+  { key: 6, label: proxy.tLang('product', '备注'), visible: true },
 ]);
 
 let infoDialog = ref(false)
@@ -140,7 +146,7 @@ function resetQuery() {
 function handleAdd() {
   reset();
   open.value = true;
-  title.value = proxy.tLang('common','添加') + ' ' + proxy.tLang('product','缝纫次数');
+  title.value = proxy.tLang('common', '添加') + ' ' + proxy.tLang('product', '缝纫次数');
 }
 
 
@@ -150,13 +156,13 @@ function handleAdd() {
 function submitForm(propform) {
   if (propform.id != null) {
     updateProcedure(propform).then(response => {
-      proxy.$modal.msgSuccess(proxy.tLang('common','修改成功'));
+      proxy.$modal.msgSuccess(proxy.tLang('common', '修改成功'));
       open.value = false;
       getList();
     });
   } else {
     addProcedure(propform).then(response => {
-      proxy.$modal.msgSuccess(proxy.tLang('common','新增成功'));
+      proxy.$modal.msgSuccess(proxy.tLang('common', '新增成功'));
       open.value = false;
       getList();
     });
@@ -191,18 +197,18 @@ function handleUpdate(row) {
   getProcedure(id).then(response => {
     form.value = response.data;
     open.value = true;
-    title.value = proxy.tLang('common','修改') + ' ' + proxy.tLang('product','缝纫次数');
+    title.value = proxy.tLang('common', '修改') + ' ' + proxy.tLang('product', '缝纫次数');
   });
 }
 
 /** 删除按钮操作 */
 function handleDelete(row) {
   const id = row.id || ids.value;
-  proxy.$modal.confirm(proxy.tLang('tip','确定删除选中记录？') + ` [${id}]`).then(function () {
+  proxy.$modal.confirm(proxy.tLang('tip', '确定删除选中记录？') + ` [${id}]`).then(function () {
     return delProcedure(id);
   }).then(() => {
     getList();
-    proxy.$modal.msgSuccess(proxy.tLang('common','删除成功'));
+    proxy.$modal.msgSuccess(proxy.tLang('common', '删除成功'));
   }).catch(() => { });
 }
 onMounted(() => {
@@ -210,4 +216,12 @@ onMounted(() => {
 })
 </script>
 
-<style lang="scss" scoped></style>
+<style lang="scss" scoped>
+.pagination {
+  width: 100%;
+  margin: 10px;
+  display: flex;
+  justify-content: center;
+  align-items: center;
+}
+</style>
diff --git a/src/views/quality/index.vue b/src/views/quality/index.vue
index 4f40bba..f14b567 100644
--- a/src/views/quality/index.vue
+++ b/src/views/quality/index.vue
@@ -49,12 +49,12 @@
         </el-form>
         <el-row :gutter="20" class="mb8">
             <el-col :span="2">
-                <el-statistic :title="tLang('quality', '产品合格率')" :value="66" :value-style="{ color: 'green' }"
-                    :formatter="(val) => { return val + '%' }" />
+                <el-statistic :title="tLang('quality', '产品合格率')" :value="qualifiedRate" :precision="1" :value-style="{ color: 'green' }"
+                    :formatter="(val) => { return ((val/total)*100).toFixed(1) + '%' }" />
             </el-col>
             <el-col :span="2">
-                <el-statistic :title="tLang('quality', '产品不合格率')" :value="66" :value-style="{ color: 'red' }"
-                    :formatter="(val) => { return val + '%' }" />
+                <el-statistic :title="tLang('quality', '产品不合格率')" :value="unqualifiedRate" :precision="1" :value-style="{ color: 'red' }"
+                    :formatter="(val) => { return ((val/total)*100).toFixed(1) + '%' }" />
             </el-col>
             <el-col :span="2">
                 <el-statistic :title="tLang('quality', '产品完成量')" :value="total" />
@@ -90,7 +90,7 @@
                     <span>{{ parseTime(scope.row.endtime, '{y}-{m}-{d} {hh}:{mm}:{ss}') }}</span>
                 </template>
             </el-table-column>
-            <el-table-column :label="tLang('quality', '状态')" v-if="columns[7].visible" align="center" prop="batch" />
+            <el-table-column :label="tLang('quality', '状态')" v-if="columns[7].visible" align="center" prop="state" />
             <!-- <el-table-column :label="tLang('quality','')操作" align="center" class-name="small-padding fixed-width">
                 <template #default="scope">
                     <el-tooltip content="详情" placement="top" v-if="scope.row.userId !== 1">
@@ -109,8 +109,12 @@
             </el-table-column> -->
         </el-table>
 
-        <pagination v-show="total > 0" :total="total" :page.sync="queryParams.pageNum"
-            :limit.sync="queryParams.pageSize" @pagination="getList" />
+        <div class="pagination">
+            <el-pagination :hide-on-single-page="true" v-model:current-page="queryParams.pageNum"
+                v-model:page-size="queryParams.pageSize" :page-sizes="[25, 50, 100, 150]"
+                layout="total, sizes, prev, pager, next, jumper" :total="total" @size-change="getList"
+                @current-change="getList" />
+        </div>
 
 
     </div>
@@ -118,7 +122,7 @@
 
 <script setup>
 import { ref, reactive, watch, onMounted } from 'vue'
-import { listQuality } from "@/api/casm/quality";
+import { listQuality,qualitystandardRate } from "@/api/casm/quality";
 const { proxy } = getCurrentInstance();
 
 // 遮罩层
@@ -162,10 +166,17 @@ const columns = ref([
     { key: 7, label: proxy.tLang('quality', '状态'), visible: true },
 ]);
 
-
+let qualifiedRate = ref(1)
+let unqualifiedRate = ref(1)
 /** 查询设备信息列表 */
 function getList() {
     loading.value = true;
+    qualitystandardRate().then(response => {
+        if (response.code === 200) {
+            qualifiedRate.value = response.data.on
+            unqualifiedRate.value = response.data.off
+        }
+    })
     listQuality(queryParams).then(response => {
         qualityList.value = response.rows;
         total.value = response.total;
@@ -202,4 +213,12 @@ onMounted(() => {
 })
 </script>
 
-<style lang="scss" scoped></style>
\ No newline at end of file
+<style lang="scss" scoped>
+.pagination {
+    width: 100%;
+    margin: 10px;
+    display: flex;
+    justify-content: center;
+    align-items: center;
+}
+</style>
\ No newline at end of file