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 0000000..77182c7
Binary files /dev/null and b/src/assets/iconfont/iconfont.ttf differ
diff --git a/src/assets/iconfont/iconfont.woff b/src/assets/iconfont/iconfont.woff
new file mode 100644
index 0000000..0ed21eb
Binary files /dev/null and b/src/assets/iconfont/iconfont.woff differ
diff --git a/src/assets/iconfont/iconfont.woff2 b/src/assets/iconfont/iconfont.woff2
new file mode 100644
index 0000000..9e309de
Binary files /dev/null and b/src/assets/iconfont/iconfont.woff2 differ
diff --git a/src/assets/images/frj.png b/src/assets/images/frj.png
new file mode 100644
index 0000000..f1285ee
Binary files /dev/null and b/src/assets/images/frj.png differ
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