Merge pull request '更新' (#439) from projects/zg-zwq into projects/zg-test

Reviewed-on: #439

.env.dev

@@ -1,21 +1,24 @@
 ###
  # @Author: Do not edit
  # @Date: 2023-08-29 09:40:39
- # @LastEditTime: 2023-09-18 10:44:07
+ # @LastEditTime: 2025-03-05 16:46:35
- # @LastEditors: DY
+ # @LastEditors: zwq
- # @Description: 
+ # @Description:
-### 
+###
 # 开发环境配置
 ENV = 'development'
 
 # 页面标题
-VUE_APP_TITLE = 产线监控系统
+VUE_APP_TITLE = 成本管理系统
 
 # 芋道管理系统/开发环境
 # VUE_APP_BASE_API = 'http://192.168.1.49:48080'
-# VUE_APP_BASE_API = 'http://192.168.1.8:48080'
+# VUE_APP_BASE_API = 'http://line-sczg.kszny.picaiba.com'
-VUE_APP_BASE_API = 'http://192.168.0.33:48080'
+VUE_APP_BASE_API = 'http://100.64.0.45:48080'
-# VUE_APP_BASE_API = 'http://192.168.1.188:48080'
+# VUE_APP_BASE_API = 'http://172.16.33.10:48080'
+
+# ws地址
+VUE_APP_WS_API = 'ws://100.64.0.45:48080'
 
 # 路由懒加载
 VUE_CLI_BABEL_TRANSPILE_MODULES = true

.env.prod

@@ -1,15 +1,27 @@
+###
+ # @Author: zwq
+ # @Date: 2024-03-27 15:49:55
+ # @LastEditors: zwq
+ # @LastEditTime: 2025-03-05 16:30:45
+ # @Description:
+###
 # 生产环境配置
 ENV = 'production'
 
 # 页面标题
-VUE_APP_TITLE = 产线监控系统
+VUE_APP_TITLE = 成本管理系统
 
 # 芋道管理系统/生产环境
-VUE_APP_BASE_API = '/prod-api'
+# VUE_APP_BASE_API = '/prod-api'
+VUE_APP_BASE_API = ''
 
 # 根据服务器或域名修改
 # PUBLIC_PATH = 'http://my-pi.com:8888/yudao-admin/'
-PUBLIC_PATH = 'http://192.168.0.33:8888/'
+# PUBLIC_PATH = 'http://192.168.0.33:8888/'
+PUBLIC_PATH = ''
+
+# ws地址
+VUE_APP_WS_API = 'ws://10.1.17.10:48080'
 
 # 二级部署路径
 VUE_APP_APP_NAME ='yudao-admin'

.gitignore

@@ -20,4 +20,6 @@ selenium-debug.log
 *.local
 
 package-lock.json
-echarts.js
+echarts.js
+sync_line_sczg_prod.bat
+sync_line_sczg_aliyun.bat

package.json

@@ -6,9 +6,9 @@
   "license": "MIT",
   "scripts": {
     "local": "vue-cli-service serve --mode local",
-    "dev": "vue-cli-service serve --mode dev",
+    "dev": "SET NODE_OPTIONS=--openssl-legacy-provider && vue-cli-service serve --mode dev",
     "front": "vue-cli-service serve --mode front",
-    "build:prod": "vue-cli-service build --mode prod",
+    "build:prod": "SET NODE_OPTIONS=--openssl-legacy-provider && vue-cli-service build --mode prod",
     "build:stage": "vue-cli-service build --mode stage",
     "build:dev": "vue-cli-service build --mode dev",
     "build:static": "vue-cli-service build --mode static",
@@ -75,7 +75,7 @@
     "vue-count-to": "1.0.13",
     "vue-cropper": "0.5.8",
     "vue-meta": "^2.4.0",
-    "vue-plugin-hiprint": "^0.0.54-fix",
+    "vue-plugin-hiprint": "0.0.54-fix",
     "vue-quill-editor": "^3.0.6",
     "vue-router": "3.4.9",
     "vue-video-player": "^5.0.2",

src/api/base/energyQuantityManual.js

@@ -0,0 +1,86 @@
+/*
+ * @Author: zwq
+ * @Date: 2024-04-11 15:00:03
+ * @LastEditors: zwq
+ * @LastEditTime: 2024-04-12 10:25:30
+ * @Description:
+ */
+import request from '@/utils/request'
+
+// 获得分页数据
+export function energyQuantityManualPage(query) {
+  return request({
+    url: '/base/energy-quantity-manual/page',
+    method: 'get',
+    params: query
+  })
+}
+
+// 创建
+export function energyQuantityManualCreate(data) {
+  return request({
+    url: '/base/energy-quantity-manual/create',
+    method: 'post',
+    data: data
+  })
+}
+
+// 更新
+export function energyQuantityManualUpdate(data) {
+  return request({
+    url: '/base/energy-quantity-manual/update',
+    method: 'put',
+    data: data
+  })
+}
+
+//获得能源抄表（手动）
+export function energyQuantityManualGet(query) {
+  return request({
+    url: '/base/energy-quantity-manual/get',
+    method: 'get',
+    params: query
+  })
+}
+
+//删除
+export function energyQuantityManualDelete(query) {
+  return request({
+    url: '/base/energy-quantity-manual/delete',
+    method: 'delete',
+    params: query
+  })
+}
+
+//导出
+export function energyQuantityManualExport(query) {
+  return request({
+    url: '/base/energy-quantity-manual/export-excel',
+    method: 'get',
+    params: query,
+    responseType: 'blob'
+  })
+}
+// 获得能源表名配置分页
+export function energyTablePage() {
+  return request({
+    url: '/base/energy-type-meter-bind/list',
+    method: 'get',
+  })
+}
+// 获得能源表名配置
+export function energyTableGet(query) {
+  return request({
+    url: '/base/energy-type-meter-bind/list',
+    method: 'get',
+    params: query
+  })
+}
+// 更新能源表名配置
+export function energyTableUpdate(data) {
+  return request({
+    url: '/base/energy-type-meter-bind/update',
+    method: 'put',
+    data: data
+  })
+}

src/api/base/equipmentConfig.js

@@ -0,0 +1,53 @@
+/*
+ * @Author: Do not edit
+ * @Date: 2024-02-21 13:43:02
+ * @LastEditTime: 2024-04-30 10:07:59
+ * @LastEditors: zwq
+ * @Description:
+ */
+import request from '@/utils/request'
+
+// 获得关联表名
+export function getplcAllList(query) {
+  return request({
+    url: '/base/equipment-plc/listAll',
+    method: 'get',
+    params: query
+  })
+}
+
+// 获得设备
+export function getEquipmentList(query) {
+  return request({
+    url: '/base/core-equipment/page',
+    method: 'get',
+    params: query
+  })
+}
+
+// 根据产线获得工段
+export function listByParentId(query) {
+  return request({
+    url: '/base/core-workshop-section/listByParentId',
+    method: 'get',
+    params: query
+  })
+}
+
+// 获得产线工段设备树形结构
+export function getTree(query) {
+  return request({
+    url: '/base/factory/getTree',
+    method: 'get',
+    params: query
+  })
+}
+
+// 获得设备分组列表
+export function getgroupAllList(query) {
+  return request({
+    url: '/base/equipment-group/listAll',
+    method: 'get',
+    params: query
+  })
+}

src/api/base/material.js

@@ -0,0 +1,75 @@
+/*
+ * @Author: zwq
+ * @Date: 2024-04-09 16:42:19
+ * @LastEditors: zwq
+ * @LastEditTime: 2024-04-10 14:33:52
+ * @Description:
+ */
+import request from '@/utils/request'
+
+// 创建原料
+export function createMaterial(data) {
+  return request({
+    url: '/base/material/create',
+    method: 'post',
+    data: data
+  })
+}
+
+// 更新原料
+export function updateMaterial(data) {
+  return request({
+    url: '/base/material/update',
+    method: 'put',
+    data: data
+  })
+}
+
+// 获取code
+export function getCode() {
+  return request({
+    url: '/base/material/autoCode',
+    method: 'POST'
+  })
+}
+// 删除原料
+export function deleteMaterial(id) {
+  return request({
+    url: '/base/material/delete?id=' + id,
+    method: 'delete'
+  })
+}
+
+// 获得原料
+export function getMaterial(id) {
+  return request({
+    url: '/base/material/get?id=' + id,
+    method: 'get'
+  })
+}
+
+// 获得原料分页
+export function getMaterialPage(query) {
+  return request({
+    url: '/base/material/page',
+    method: 'get',
+    params: query
+  })
+}
+// 获得原料列表
+export function getMaterialList() {
+  return request({
+    url: '/base/material/list',
+    method: 'get',
+  })
+}
+
+// 导出原料 Excel
+export function exportMaterialExcel(query) {
+  return request({
+    url: '/base/material/export-excel',
+    method: 'get',
+    params: query,
+    responseType: 'blob'
+  })
+}

src/api/base/materialPricing.js

@@ -0,0 +1,68 @@
+/*
+ * @Author: zwq
+ * @Date: 2024-04-09 16:42:19
+ * @LastEditors: zwq
+ * @LastEditTime: 2024-04-10 14:31:46
+ * @Description:
+ */
+import request from '@/utils/request'
+
+// 创建原料
+export function createMaterialPricing(data) {
+  return request({
+    url: '/base/material-pricing/create',
+    method: 'post',
+    data: data
+  })
+}
+
+// 更新原料
+export function updateMaterialPricing(data) {
+  return request({
+    url: '/base/material-pricing/update',
+    method: 'put',
+    data: data
+  })
+}
+
+// 获取code
+export function getCode() {
+  return request({
+    url: '/base/material-pricing/autoCode',
+    method: 'POST'
+  })
+}
+// 删除原料
+export function deleteMaterialPricing(id) {
+  return request({
+    url: '/base/material-pricing/delete?id=' + id,
+    method: 'delete'
+  })
+}
+
+// 获得原料
+export function getMaterialPricing(id) {
+  return request({
+    url: '/base/material-pricing/get?id=' + id,
+    method: 'get'
+  })
+}
+
+// 获得原料分页
+export function getMaterialPricingPage(query) {
+  return request({
+    url: '/base/material-pricing/page',
+    method: 'get',
+    params: query
+  })
+}
+
+// 导出原料 Excel
+export function exportMaterialPricingExcel(query) {
+  return request({
+    url: '/base/material-pricing/export-excel',
+    method: 'get',
+    params: query,
+    responseType: 'blob'
+  })
+}

src/api/base/productionLine.js

@@ -1,3 +1,10 @@
+/*
+ * @Author: zwq
+ * @Date: 2024-03-27 15:49:55
+ * @LastEditors: zwq
+ * @LastEditTime: 2024-09-10 14:36:19
+ * @Description:
+ */
 import request from '@/utils/request'
 // 获得所有工厂产线列表
 export function getLineAll() {
@@ -5,4 +12,12 @@ export function getLineAll() {
     url: '/base/production-line/listAll',
     method: 'get'
   })
-}
+}
+// 获得产线分页
+export function getLinePage(query) {
+  return request({
+    url: '/base/production-line/page',
+    method: 'get',
+    params: query
+  })
+}

src/api/core/base/lineBindProductLog.js

@@ -1,3 +1,10 @@
+/*
+ * @Author: Do not edit
+ * @Date: 2023-08-28 15:30:53
+ * @LastEditTime: 2023-10-13 17:08:33
+ * @LastEditors: DY
+ * @Description: 
+ */
 import request from '@/utils/request'
 
 // 创建产线目前生产产品表 主要为更新
@@ -35,11 +42,11 @@ export function getLineBindProductLog(id) {
 }
 
 // 获得产线目前生产产品表 主要为更新分页
-export function getLineBindProductLogPage(query) {
+export function getLineBindProductLogPage(data) {
   return request({
     url: '/base/line-bind-product-log/page',
-    method: 'get',
+    method: 'post',
-    params: query
+    data: data
   })
 }
 

src/api/cost/allCost.js

@@ -0,0 +1,72 @@
+/*
+ * @Author: zwq
+ * @Date: 2024-04-18 16:53:17
+ * @LastEditors: zwq
+ * @LastEditTime: 2025-02-17 15:47:58
+ * @Description:
+ */
+
+import request from '@/utils/request'
+
+// 获得总成本统计-按日期分页
+export function getCostSumPage(query) {
+  return request({
+    url: '/monitoring/cost-sum/page',
+    method: 'get',
+    params: query
+  })
+}
+// 更新总成本统计-按日期
+export function updateCostSum(data) {
+  return request({
+    url: '/monitoring/cost-sum/update',
+    method: 'put',
+    data: data
+  })
+}
+// 获得原片成本统计成本查询分页
+export function getRawCostStatisticsRealtimePage(query) {
+  return request({
+    url: '/monitoring/cost-sum/page',
+    method: 'get',
+    params: query
+  })
+}
+
+// 导出总成本统计-按日期 Excel
+export function exportCostSumExcel(query) {
+  return request({
+    url: '/monitoring/cost-sum/export-excel',
+    method: 'get',
+    params: query,
+    responseType: 'blob'
+  })
+}
+
+// 导出原片成本统计-历史成本 Excel
+export function exportRawCostStatisticsHisExcel(query) {
+  return request({
+    url: '/monitoring/cost-sum/export-excel',
+    method: 'get',
+    params: query,
+    responseType: 'blob'
+  })
+}
+
+// 获得成本首页 -获取首页数据
+export function getData(query) {
+  return request({
+    url: '/monitoring/cost-homepage/getData',
+    method: 'get',
+    params: query
+  })
+}
+
+// 获得成本首页 -详细首页数据
+export function getDetailData(query) {
+  return request({
+    url: '/monitoring/cost-homepage/getDetailData',
+    method: 'get',
+    params: query
+  })
+}

src/api/cost/costDeepRatioHis.js

@@ -0,0 +1,55 @@
+/*
+ * @Author: zwq
+ * @Date: 2024-04-18 16:53:17
+ * @LastEditors: zwq
+ * @LastEditTime: 2024-09-06 15:00:09
+ * @Description:
+ */
+
+import request from '@/utils/request'
+// 更新深加工良品率
+export function updateDeepRatioHis(data) {
+  return request({
+    url: '/monitoring/cost-deep-ratio-his/update',
+    method: 'put',
+    data: data
+  })
+}
+// 获得深加工产线良品率
+export function getDeepPDRatioHisPage(query) {
+  return request({
+    url: '/monitoring/cost-deep-ratio-his/page-pd',
+    method: 'get',
+    params: query
+  })
+}
+// 获得深加工工段良品率
+export function getDeepWSRatioHisPage(query) {
+  return request({
+    url: '/monitoring/cost-deep-ratio-his/page-ws',
+    method: 'get',
+    params: query
+  })
+}
+
+// 导出深加工工段良品率 Excel
+export function exportDeepWSRatioHisExcel(query) {
+  return request({
+    url: '/monitoring/cost-deep-ratio-his/export-excel-ws',
+    method: 'get',
+    params: query,
+    responseType: 'blob'
+  })
+}
+
+
+// 导出深加工产线良品率 Excel
+export function exportDeepPDRatioHisExcel(query) {
+  return request({
+    url: '/monitoring/cost-deep-ratio-his/export-excel-pd',
+    method: 'get',
+    params: query,
+    responseType: 'blob'
+  })
+}
+

src/api/cost/costEnergy.js

@@ -0,0 +1,53 @@
+/*
+ * @Author: zwq
+ * @Date: 2024-04-18 16:53:17
+ * @LastEditors: zwq
+ * @LastEditTime: 2024-04-19 16:11:19
+ * @Description:
+ */
+
+import request from '@/utils/request'
+// 更新原片能源历史
+export function updateEnergyHis(data) {
+  return request({
+    url: '/monitoring/cost-energy-his/update',
+    method: 'put',
+    data: data
+  })
+}
+// 获得原片能源历史分页
+export function getEnergyHisPage(query) {
+  return request({
+    url: '/monitoring/cost-energy-his/page',
+    method: 'get',
+    params: query
+  })
+}
+
+// 获得原片能源-成本查询分页
+export function getEnergyRealtimePage(query) {
+  return request({
+    url: '/monitoring/cost-energy-realtime/page',
+    method: 'get',
+    params: query
+  })
+}
+// 导出能源成本成本查询 Excel
+export function exportEnergyRealtimeExcel(query) {
+  return request({
+    url: '/monitoring/cost-energy-realtime/export-excel',
+    method: 'get',
+    params: query,
+    responseType: 'blob'
+  })
+}
+
+// 导出能源成本历史 Excel
+export function exportEnergyHisExcel(query) {
+  return request({
+    url: '/monitoring/cost-energy-his/export-excel',
+    method: 'get',
+    params: query,
+    responseType: 'blob'
+  })
+}

src/api/cost/costEnergyDeep.js

@@ -0,0 +1,54 @@
+/*
+ * @Author: zwq
+ * @Date: 2024-04-18 16:53:17
+ * @LastEditors: zwq
+ * @LastEditTime: 2024-09-06 15:19:24
+ * @Description:
+ */
+
+import request from '@/utils/request'
+// 更新深加工能源历史
+export function updateEnergyHis(data) {
+  return request({
+    url: '/monitoring/cost-deep-energy-his/update',
+    method: 'put',
+    data: data
+  })
+}
+// 获得深加工能源历史分页
+export function getEnergyHisPage(query) {
+  return request({
+    url: '/monitoring/cost-deep-energy-his/page',
+    method: 'get',
+    params: query
+  })
+}
+
+// 获得深加工能源-成本查询分页
+export function getEnergyRealtimePage(query) {
+  return request({
+    url: '/monitoring/cost-deep-energy-realtime/page',
+    method: 'get',
+    params: query
+  })
+}
+
+// 导出深加工能源成本成本查询 Excel
+export function exportEnergyRealtimeExcel(query) {
+  return request({
+    url: '/monitoring/cost-deep-energy-realtime/export-excel',
+    method: 'get',
+    params: query,
+    responseType: 'blob'
+  })
+}
+
+// 导出深加工能源成本历史 Excel
+export function exportEnergyHisExcel(query) {
+  return request({
+    url: '/monitoring/cost-deep-energy-his/export-excel',
+    method: 'get',
+    params: query,
+    responseType: 'blob'
+  })
+}

src/api/cost/costMaterial.js

@@ -0,0 +1,54 @@
+/*
+ * @Author: zwq
+ * @Date: 2024-04-18 16:53:17
+ * @LastEditors: zwq
+ * @LastEditTime: 2024-09-05 13:55:30
+ * @Description:
+ */
+
+import request from '@/utils/request'
+// 更新原料成本-历史
+export function updateMaterialHis(data) {
+  return request({
+    url: '/monitoring/cost-material-his/update',
+    method: 'put',
+    data: data
+  })
+}
+// 获得原料成本-历史分页
+export function getMaterialHisPage(query) {
+  return request({
+    url: '/monitoring/cost-material-his/page',
+    method: 'get',
+    params: query
+  })
+}
+
+// 获得原料成本-成本查询分页
+export function getMaterialRealtimePage(query) {
+  return request({
+    url: '/monitoring/cost-material-realtime/page',
+    method: 'get',
+    params: query
+  })
+}
+
+// 导出原料成本成本查询 Excel
+export function exportMaterialRealtimeExcel(query) {
+  return request({
+    url: '/monitoring/cost-material-realtime/export-excel',
+    method: 'get',
+    params: query,
+    responseType: 'blob'
+  })
+}
+
+// 导出原料成本历史 Excel
+export function exportMaterialHisExcel(query) {
+  return request({
+    url: '/monitoring/cost-material-his/export-excel',
+    method: 'get',
+    params: query,
+    responseType: 'blob'
+  })
+}

src/api/cost/costOriginRatioHis.js

@@ -0,0 +1,56 @@
+/*
+ * @Author: zwq
+ * @Date: 2024-04-18 16:53:17
+ * @LastEditors: zwq
+ * @LastEditTime: 2024-04-22 10:53:55
+ * @Description:
+ */
+
+import request from '@/utils/request'
+// 更新原片良品率
+export function updatecostOriginRatioHis(data) {
+  return request({
+    url: '/monitoring/cost-origin-ratio-his/update',
+    method: 'put',
+    data: data
+  })
+}
+// 获得原片产线良品率
+export function getcostOriginRatioHisPage(query) {
+  return request({
+    url: '/monitoring/cost-origin-ratio-his/page',
+    method: 'get',
+    params: query
+  })
+}
+
+// 获得原片工段良品率
+export function getcostOriginWSRatioHisPage(query) {
+  return request({
+    url: '/monitoring/cost-origin-ratio-his/page-ws',
+    method: 'get',
+    params: query
+  })
+}
+
+// 导出原片良品率 Excel
+export function exportcostOriginRatioHisExcel(query) {
+  return request({
+    url: '/monitoring/cost-origin-ratio-his/export-excel',
+    method: 'get',
+    params: query,
+    responseType: 'blob'
+  })
+}
+
+
+// 导出原片良品率 工段Excel
+export function exportcostOriginWSRatioHisExcel(query) {
+  return request({
+    url: '/monitoring/cost-origin-ratio-his/export-excel-ws',
+    method: 'get',
+    params: query,
+    responseType: 'blob'
+  })
+}
+

src/api/cost/costOthercostHis.js

@@ -0,0 +1,53 @@
+/*
+ * @Author: zwq
+ * @Date: 2024-04-18 16:53:17
+ * @LastEditors: zwq
+ * @LastEditTime: 2024-04-19 14:24:17
+ * @Description:
+ */
+
+import request from '@/utils/request'
+// 更新原片其他成本-历史
+export function updateRawOthercostHis(data) {
+  return request({
+    url: '/monitoring/cost-othercost-his/update',
+    method: 'put',
+    data: data
+  })
+}
+// 获得原片其他成本-历史分页
+export function getRawOthercostHisPage(query) {
+  return request({
+    url: '/monitoring/cost-othercost-his/page',
+    method: 'get',
+    params: query
+  })
+}
+
+// 获得原片其他成本-成本查询分页
+export function getRawOthercostSunPage(query) {
+  return request({
+    url: '/monitoring/cost-othercost-log/page-sum',
+    method: 'get',
+    params: query
+  })
+}
+// 导出原片其他成本-成本查询 Excel
+export function exportRawOthercostSunExcel(query) {
+  return request({
+    url: '/monitoring/cost-othercost-log/export-excel',
+    method: 'get',
+    params: query,
+    responseType: 'blob'
+  })
+}
+
+// 导出原片其他成本-历史 Excel
+export function exportRawOthercostHisExcel(query) {
+  return request({
+    url: '/monitoring/cost-othercost-his/export-excel',
+    method: 'get',
+    params: query,
+    responseType: 'blob'
+  })
+}

src/api/cost/costOthercostHisDeep.js

@@ -0,0 +1,53 @@
+/*
+ * @Author: zwq
+ * @Date: 2024-04-18 16:53:17
+ * @LastEditors: zwq
+ * @LastEditTime: 2024-09-06 15:13:20
+ * @Description:
+ */
+
+import request from '@/utils/request'
+// 更新深加工其他成本-历史
+export function updateRawOthercostHis(data) {
+  return request({
+    url: '/monitoring/cost-deep-othercost-his/update',
+    method: 'put',
+    data: data
+  })
+}
+// 获得深加工其他成本-历史分页
+export function getRawOthercostHisPage(query) {
+  return request({
+    url: '/monitoring/cost-deep-othercost-his/page',
+    method: 'get',
+    params: query
+  })
+}
+
+// 获得深加工其他成本-成本查询分页
+export function getRawOthercostSunPage(query) {
+  return request({
+    url: '/monitoring/cost-deep-othercost-log/page-sum',
+    method: 'get',
+    params: query
+  })
+}
+// 导出深加工其他成本-成本查询 Excel
+export function exportRawOthercostSunExcel(query) {
+  return request({
+    url: '/monitoring/cost-deep-othercost-log/export-excel',
+    method: 'get',
+    params: query,
+    responseType: 'blob'
+  })
+}
+
+// 导出深加工其他成本-历史 Excel
+export function exportRawOthercostHisExcel(query) {
+  return request({
+    url: '/monitoring/cost-deep-othercost-his/export-excel',
+    method: 'get',
+    params: query,
+    responseType: 'blob'
+  })
+}

src/api/cost/costOthercostLog.js

@@ -0,0 +1,68 @@
+/*
+ * @Author: zwq
+ * @Date: 2024-04-15 17:01:20
+ * @LastEditors: zwq
+ * @LastEditTime: 2024-09-06 14:12:09
+ * @Description:
+ */
+import request from '@/utils/request'
+
+// 创建原片其他成本-记录
+export function createRawOthercostLog(data) {
+  return request({
+    url: '/monitoring/cost-othercost-log/create',
+    method: 'post',
+    data: data
+  })
+}
+
+// 更新原片其他成本-记录
+export function updateRawOthercostLog(data) {
+  return request({
+    url: '/monitoring/cost-othercost-log/update',
+    method: 'put',
+    data: data
+  })
+}
+
+// 删除原片其他成本-记录
+export function deleteRawOthercostLog(id) {
+  return request({
+    url: '/monitoring/cost-othercost-log/delete?id=' + id,
+    method: 'delete'
+  })
+}
+
+// 获得原片其他成本-记录
+export function getRawOthercostLog(id) {
+  return request({
+    url: '/monitoring/cost-othercost-log/get?id=' + id,
+    method: 'get'
+  })
+}
+
+// 获得原片其他成本-记录分页
+export function getRawOthercostLogPage(query) {
+  return request({
+    url: '/monitoring/cost-othercost-log/page',
+    method: 'get',
+    params: query
+  })
+}
+
+// 导出原片其他成本-记录 Excel
+export function exportRawOthercostLogExcel(query) {
+  return request({
+    url: '/monitoring/cost-othercost-log/export-log-excel',
+    method: 'get',
+    params: query,
+    responseType: 'blob'
+  })
+}
+// 获得所有原片其他成本-记录列表
+export function getRawOthercostLogAll() {
+  return request({
+    url: '/monitoring/cost-othercost-log/listAll',
+    method: 'get'
+  })
+}

src/api/cost/costOthercostLogDeep.js

@@ -0,0 +1,68 @@
+/*
+ * @Author: zwq
+ * @Date: 2024-04-15 17:01:20
+ * @LastEditors: zwq
+ * @LastEditTime: 2024-04-22 14:59:35
+ * @Description:
+ */
+import request from '@/utils/request'
+
+// 创建深加工其他成本-记录
+export function createRawOthercostLog(data) {
+  return request({
+    url: '/monitoring/cost-deep-othercost-log/create',
+    method: 'post',
+    data: data
+  })
+}
+
+// 更新深加工其他成本-记录
+export function updateRawOthercostLog(data) {
+  return request({
+    url: '/monitoring/cost-deep-othercost-log/update',
+    method: 'put',
+    data: data
+  })
+}
+
+// 删除深加工其他成本-记录
+export function deleteRawOthercostLog(id) {
+  return request({
+    url: '/monitoring/cost-deep-othercost-log/delete?id=' + id,
+    method: 'delete'
+  })
+}
+
+// 获得深加工其他成本-记录
+export function getRawOthercostLog(id) {
+  return request({
+    url: '/monitoring/cost-deep-othercost-log/get?id=' + id,
+    method: 'get'
+  })
+}
+
+// 获得深加工其他成本-记录分页
+export function getRawOthercostLogPage(query) {
+  return request({
+    url: '/monitoring/cost-deep-othercost-log/page',
+    method: 'get',
+    params: query
+  })
+}
+
+// 导出深加工其他成本-记录 Excel
+export function exportRawOthercostLogExcel(query) {
+  return request({
+    url: '/monitoring/cost-deep-othercost-log/export-log-excel',
+    method: 'get',
+    params: query,
+    responseType: 'blob'
+  })
+}
+// 获得所有深加工其他成本-记录列表
+export function getRawOthercostLogAll() {
+  return request({
+    url: '/monitoring/cost-deep-othercost-log/listAll',
+    method: 'get'
+  })
+}

src/api/cost/deepCostStatistics.js

@@ -0,0 +1,53 @@
+/*
+ * @Author: zwq
+ * @Date: 2024-04-18 16:53:17
+ * @LastEditors: zwq
+ * @LastEditTime: 2024-09-02 14:43:30
+ * @Description:
+ */
+
+import request from '@/utils/request'
+
+// 获得深加工成本分页
+export function getDeepCostStatisticsPage(query) {
+  return request({
+    url: '/monitoring/cost-deep-cost-his/page',
+    method: 'get',
+    params: query
+  })
+}
+// 更新深加工成本-历史
+export function updateDeepCostStatistics(data) {
+  return request({
+    url: '/monitoring/cost-deep-cost-his/update',
+    method: 'put',
+    data: data
+  })
+}
+// 获得深加工成本统计成本查询分页
+export function getDeepCostStatisticsRealtimePage(query) {
+  return request({
+    url: '/monitoring/cost-deep-cost-realtime/page',
+    method: 'get',
+    params: query
+  })
+}
+
+// 导出深加工成本统计成本查询 Excel
+export function exportDeepStatisticsRealtimeExcel(query) {
+  return request({
+    url: '/monitoring/cost-deep-cost-realtime/export-excel',
+    method: 'get',
+    params: query,
+    responseType: 'blob'
+  })
+}
+// 导出深加工成本统计-历史成本 Excel
+export function exportDeepCostStatisticsHisExcel(query) {
+  return request({
+    url: '/monitoring/cost-deep-cost-his/export-excel',
+    method: 'get',
+    params: query,
+    responseType: 'blob'
+  })
+}

src/api/cost/deepOthercostRule.js

@@ -0,0 +1,68 @@
+/*
+ * @Author: zwq
+ * @Date: 2024-04-15 17:01:20
+ * @LastEditors: zwq
+ * @LastEditTime: 2024-04-22 14:55:00
+ * @Description:
+ */
+import request from '@/utils/request'
+
+// 创建深加工其他成本-配置
+export function createRawOthercostRule(data) {
+  return request({
+    url: '/monitoring/cost-deep-othercost-rule/create',
+    method: 'post',
+    data: data
+  })
+}
+
+// 更新深加工其他成本-配置
+export function updateRawOthercostRule(data) {
+  return request({
+    url: '/monitoring/cost-deep-othercost-rule/update',
+    method: 'put',
+    data: data
+  })
+}
+
+// 删除深加工其他成本-配置
+export function deleteRawOthercostRule(id) {
+  return request({
+    url: '/monitoring/cost-deep-othercost-rule/delete?id=' + id,
+    method: 'delete'
+  })
+}
+
+// 获得深加工其他成本-配置
+export function getRawOthercostRule(id) {
+  return request({
+    url: '/monitoring/cost-deep-othercost-rule/get?id=' + id,
+    method: 'get'
+  })
+}
+
+// 获得深加工其他成本-配置分页
+export function getRawOthercostRulePage(query) {
+  return request({
+    url: '/monitoring/cost-deep-othercost-rule/page',
+    method: 'get',
+    params: query
+  })
+}
+
+// 导出深加工其他成本-配置 Excel
+export function exportRawOthercostRuleExcel(query) {
+  return request({
+    url: '/monitoring/cost-deep-othercost-rule/export-excel',
+    method: 'get',
+    params: query,
+    responseType: 'blob'
+  })
+}
+// 获得所有深加工其他成本-配置列表
+export function getRawOthercostRuleAll() {
+  return request({
+    url: '/monitoring/cost-deep-othercost-rule/listAll',
+    method: 'get'
+  })
+}

src/api/cost/rawCostStatistics.js

@@ -0,0 +1,54 @@
+/*
+ * @Author: zwq
+ * @Date: 2024-04-18 16:53:17
+ * @LastEditors: zwq
+ * @LastEditTime: 2024-09-06 14:35:13
+ * @Description:
+ */
+
+import request from '@/utils/request'
+
+// 获得原片成本分页
+export function getRawCostStatisticsPage(query) {
+  return request({
+    url: '/monitoring/cost-origincost-his/page',
+    method: 'get',
+    params: query
+  })
+}
+// 更新原片成本-历史
+export function updateRawCostStatistics(data) {
+  return request({
+    url: '/monitoring/cost-origincost-his/update',
+    method: 'put',
+    data: data
+  })
+}
+// 获得原片成本统计成本查询分页
+export function getRawCostStatisticsRealtimePage(query) {
+  return request({
+    url: '/monitoring/cost-origin-cost-realtime/page',
+    method: 'get',
+    params: query
+  })
+}
+
+// 导出原片成本统计成本查询 Excel
+export function exportRawStatisticsRealtimeExcel(query) {
+  return request({
+    url: '/monitoring/cost-origin-cost-realtime/export-excel',
+    method: 'get',
+    params: query,
+    responseType: 'blob'
+  })
+}
+
+// 导出原片成本统计-历史成本 Excel
+export function exportRawCostStatisticsHisExcel(query) {
+  return request({
+    url: '/monitoring/cost-origincost-his/export-excel',
+    method: 'get',
+    params: query,
+    responseType: 'blob'
+  })
+}

src/api/cost/rawOthercostRule.js

@@ -0,0 +1,68 @@
+/*
+ * @Author: zwq
+ * @Date: 2024-04-15 17:01:20
+ * @LastEditors: zwq
+ * @LastEditTime: 2024-04-18 15:39:12
+ * @Description:
+ */
+import request from '@/utils/request'
+
+// 创建原片其他成本-配置
+export function createRawOthercostRule(data) {
+  return request({
+    url: '/monitoring/cost-othercost-rule/create',
+    method: 'post',
+    data: data
+  })
+}
+
+// 更新原片其他成本-配置
+export function updateRawOthercostRule(data) {
+  return request({
+    url: '/monitoring/cost-othercost-rule/update',
+    method: 'put',
+    data: data
+  })
+}
+
+// 删除原片其他成本-配置
+export function deleteRawOthercostRule(id) {
+  return request({
+    url: '/monitoring/cost-othercost-rule/delete?id=' + id,
+    method: 'delete'
+  })
+}
+
+// 获得原片其他成本-配置
+export function getRawOthercostRule(id) {
+  return request({
+    url: '/monitoring/cost-othercost-rule/get?id=' + id,
+    method: 'get'
+  })
+}
+
+// 获得原片其他成本-配置分页
+export function getRawOthercostRulePage(query) {
+  return request({
+    url: '/monitoring/cost-othercost-rule/page',
+    method: 'get',
+    params: query
+  })
+}
+
+// 导出原片其他成本-配置 Excel
+export function exportRawOthercostRuleExcel(query) {
+  return request({
+    url: '/monitoring/cost-othercost-rule/export-excel',
+    method: 'get',
+    params: query,
+    responseType: 'blob'
+  })
+}
+// 获得所有原片其他成本-配置列表
+export function getRawOthercostRuleAll() {
+  return request({
+    url: '/monitoring/cost-othercost-rule/listAll',
+    method: 'get'
+  })
+}

src/api/environmental/environmentalLog.js

@@ -0,0 +1,19 @@
+import request from '@/utils/request'
+
+// 获得环保数据历史分页
+export function getCostEnviHisPage(query) {
+  return request({
+    url: '/monitoring/cost-envi-his/page',
+    method: 'get',
+    params: query
+  })
+}
+
+// 获得余热发电page
+export function yurepage(query) {
+  return request({
+    url: '/base/energy-quantity-day/yurepage',
+    method: 'get',
+    params: query
+  })
+}

src/api/monitoring/energyOverlimitLog.js

@@ -43,6 +43,14 @@ export function getEnergyOverlimitLogPage(data) {
   })
 }
 
+// 获得手动抄表记录分页
+export function getEnergyManualLogPage(data) {
+  return request({
+    url: '/monitoring/energy-overlimit-log/pageManual',
+    method: 'post',
+    data: data
+  })
+}
 // 导出能源超限记录 Excel
 export function exportEnergyOverlimitLogExcel(query) {
   return request({

src/assets/font/font.css

@@ -0,0 +1,4 @@
+@font-face {
+  font-family: '站酷庆科黄油体';
+  src: url('./站酷庆科黄油体.ttf') format('truetype');;
+}

src/assets/icons/svg/changelogo.svg

@@ -0,0 +1,15 @@
+<?xml version="1.0" encoding="UTF-8"?>
+<svg width="16px" height="16px" viewBox="0 0 16 16" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
+    <title>状态切换备份 3</title>
+    <g id="页面" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
+        <g id="icon和插图" transform="translate(-877.000000, -246.000000)">
+            <g id="状态切换备份-3" transform="translate(885.000000, 254.000000) rotate(-270.000000) translate(-885.000000, -254.000000) translate(877.000000, 246.000000)">
+                <rect id="矩形" stroke="#979797" fill="#D8D8D8" opacity="0" x="0.5" y="0.5" width="15" height="15"></rect>
+                <g id="错误" transform="translate(0.000000, 0.000000)" fill-rule="nonzero">
+                    <rect id="矩形" fill="#000000" opacity="0" x="0" y="6.4293957e-15" width="16" height="16"></rect>
+                    <path d="M8,1 C11.85,1 15,4.15 15,8 C15,11.85 11.85,15 8,15 C4.15,15 1,11.85 1,8 C1,4.15 4.15,1 8,1 Z M8,2.19926499 C4.80249503,2.19926499 2.18635461,4.80959575 2.18635461,8 C2.18635461,11.1904043 4.80249503,13.800735 8,13.800735 C11.197505,13.800735 13.8136454,11.1904043 13.8136454,8 C13.8136454,4.80959575 11.197505,2.19926499 8,2.19926499 Z M9.18342887,4.39602962 C9.42080763,4.39602962 9.61773566,4.56921978 9.65474747,4.7961346 L9.66099805,4.87359881 L9.66052938,9.97276858 L10.1621026,9.47231604 C10.3071657,9.32725295 10.5223305,9.29501672 10.6985498,9.37560733 L10.7713701,9.41705393 L10.837514,9.47231606 C11.0033004,9.63810246 11.0217211,9.89545015 10.8927761,10.0815835 L10.837514,10.1477274 L9.52115984,11.4640816 C9.38457467,11.600698 9.17913638,11.6415719 9.00066062,11.5676398 C8.84450229,11.5029526 8.73591407,11.3615296 8.71120699,11.1977853 L8.70585968,11.1264012 L8.70585968,4.87359881 C8.70585968,4.60984463 8.91967469,4.39602962 9.18342887,4.39602962 Z M6.99933939,4.43236016 C7.15549771,4.49704738 7.26408594,4.63847045 7.28879302,4.80221473 L7.29414032,4.87359881 L7.29414032,11.1264012 C7.29414032,11.2530604 7.24382515,11.374532 7.15426356,11.4640936 C7.06470196,11.5536552 6.94323037,11.6039704 6.81657114,11.6039704 C6.68991191,11.6039704 6.56844032,11.5536552 6.47887872,11.4640936 C6.40722945,11.3924443 6.36069788,11.3003726 6.34495123,11.2015604 L6.33900196,11.1264012 L6.33858601,6.02634681 L5.83789738,6.52768395 C5.69283427,6.67274705 5.47766955,6.70498329 5.30145018,6.62439268 L5.22862992,6.58294608 L5.162486,6.52768394 C4.9966996,6.36189754 4.97827889,6.10454984 5.10722387,5.91841648 L5.162486,5.85227257 L6.47884017,4.53591839 C6.61542534,4.39930202 6.82086362,4.35842813 6.99933939,4.43236016 Z" id="形状结合" fill="#0B58FF"></path>
+                </g>
+            </g>
+        </g>
+    </g>
+</svg>

src/assets/icons/svg/cost.svg

@@ -0,0 +1,22 @@
+<?xml version="1.0" encoding="UTF-8"?>
+<svg width="32px" height="32px" viewBox="0 0 32 32" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
+    <title>切片</title>
+    <defs>
+        <linearGradient x1="91.384997%" y1="100%" x2="25.4330364%" y2="7.84095011e-14%" id="linearGradient-1">
+            <stop stop-color="#4BFFC8" offset="0%"></stop>
+            <stop stop-color="#45F2EC" offset="100%"></stop>
+        </linearGradient>
+        <linearGradient x1="91.384997%" y1="100%" x2="25.4330364%" y2="7.84095011e-14%" id="linearGradient-2">
+            <stop stop-color="#FFFFFF" offset="0%"></stop>
+            <stop stop-color="#FFFFFF" offset="100%"></stop>
+        </linearGradient>
+    </defs>
+    <g id="页面-1" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
+        <g id="成本看板" transform="translate(-64.000000, -290.000000)" fill-rule="nonzero">
+            <g id="成本" transform="translate(64.000000, 290.000000)">
+                <rect id="矩形" fill="#FFFFFF" opacity="0" x="0" y="0" width="32" height="32"></rect>
+                <path d="M24.8336138,7.21888656 C25.307557,7.21888656 25.7025096,7.62700427 25.6893445,8.08778234 L25.6893445,25.768495 C25.6893445,26.5452352 25.2417316,26.6505559 24.859944,26.6505559 L7.17923134,26.6505559 C6.6921231,26.6505559 6.31033556,26.2556033 6.31033556,25.7816601 L6.31033556,8.10094743 C6.31033556,7.61383919 6.70528819,7.23205165 7.17923134,7.23205165 L10.3915127,7.23205165 L10.3915127,9.00933847 C10.3915127,9.41745619 10.733805,9.75974847 11.1419227,9.75974847 L20.8709225,9.75974847 C21.2790402,9.75974847 21.6213325,9.43062128 21.6213325,9.00933847 L21.6213325,7.21888656 Z M21.3580307,13.7224398 C21.0289035,13.3933127 20.5154651,13.3933127 20.1863379,13.7224398 L14.5385153,19.3702624 L11.7738469,16.6319242 C11.4447197,16.302797 10.9312813,16.302797 10.6021541,16.6319242 C10.2730269,16.9610514 10.2730269,17.4744898 10.6021541,17.803617 L13.9460864,21.1475493 C14.2752136,21.4766764 14.788652,21.4766764 15.1177792,21.1475493 L21.3711958,14.9072977 C21.5423419,14.7361516 21.6213325,14.5386753 21.6213325,14.3148688 C21.6213325,14.0910623 21.5291768,13.893586 21.3580307,13.7224398 Z M19.896706,5.34944412 C20.1863379,5.34944412 20.4364746,5.59958078 20.4364746,5.88921271 L20.4364746,8.10094743 C20.4364746,8.39057936 20.1863379,8.64071602 19.896706,8.64071602 L12.1161392,8.64071602 L12.1161392,8.6670462 C11.8265073,8.6670462 11.5763706,8.41690953 11.5763706,8.1272776 L11.5763706,5.88921271 C11.5763706,5.59958078 11.8265073,5.34944412 12.1161392,5.34944412 L19.896706,5.34944412 Z" id="形状结合" fill="url(#linearGradient-2)"></path>
+            </g>
+        </g>
+    </g>
+</svg>

src/assets/icons/svg/costchart.svg

@@ -0,0 +1,12 @@
+<?xml version="1.0" encoding="UTF-8"?>
+<svg width="32px" height="32px" viewBox="0 0 32 32" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
+    <title>切片</title>
+    <g id="页面-1" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
+        <g id="成本看板" transform="translate(-64.000000, -633.000000)" fill="#FFFFFF" fill-rule="nonzero">
+            <g id="近期成本" transform="translate(64.000000, 633.000000)">
+                <rect id="矩形" opacity="0" x="0" y="0" width="32" height="32"></rect>
+                <path d="M26,23 L18.2,27.8 C17.6,28.2 17,27.8 17,27 L17,15.8 C17,15.6 17.2,15.2 17.4,15 L25.2,10.2 C25.8,9.8 26.4,10.2 26.4,11 L26.4,22.4 C26.4,22.6 26.2,23 26,23 Z M6,23 L13.8,27.8 C14.4,28.2 15,27.8 15,27 L15,15.8 C15,15.6 14.8,15.2 14.6,15 L6.8,10.2 C6.4,10 5.6,10.4 5.6,11 L5.6,22.4 C5.6,22.6 5.8,23 6,23 Z M15.8,4 L6.8,7.4 C6.4,7.6 6.4,8.2 6.8,8.4 L15.8,14 C16,14 16.2,14 16.2,14 L25.4,8.4 C25.8,8.2 25.8,7.6 25.4,7.4 L16.2,4 C16,4 16,4 15.8,4 Z" id="形状"></path>
+            </g>
+        </g>
+    </g>
+</svg>

src/assets/icons/svg/energy.svg

@@ -0,0 +1,22 @@
+<?xml version="1.0" encoding="UTF-8"?>
+<svg width="24.3417579px" height="24.000009px" viewBox="0 0 24.3417579 24.000009" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
+    <title>统计</title>
+    <defs>
+        <linearGradient x1="99.4683184%" y1="100%" x2="20.6346149%" y2="7.84095011e-14%" id="linearGradient-1">
+            <stop stop-color="#4BFFC8" offset="0%"></stop>
+            <stop stop-color="#45F2EC" offset="100%"></stop>
+        </linearGradient>
+        <linearGradient x1="99.4683184%" y1="100%" x2="20.6346149%" y2="7.84095011e-14%" id="linearGradient-2">
+            <stop stop-color="#FFFFFF" offset="0%"></stop>
+            <stop stop-color="#FFFFFF" offset="100%"></stop>
+        </linearGradient>
+    </defs>
+    <g id="页面-1" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
+        <g id="成本看板" transform="translate(-1327.000000, -636.000000)" fill-rule="nonzero">
+            <g id="统计" transform="translate(1327.000000, 636.000000)">
+                <rect id="矩形" fill="#FFFFFF" opacity="0" x="0" y="1.29865498e-07" width="23.9999981" height="23.9999981"></rect>
+                <path d="M21.0417425,10.2952681 L19.5753585,10.2952681 L19.5753585,5.90037875 C19.5730113,5.34644149 19.1232931,4.89862885 18.5693508,4.89863383 L13.1812421,4.89863383 L13.1812421,3.15517144 C13.1837389,2.30739523 12.8439612,1.49449588 12.2388994,0.900668572 C11.6338375,0.306841265 10.8147135,-0.0176430365 9.96713292,0.000740689882 C8.21105284,0.081169063 6.8366707,1.54239403 6.8638551,3.30010475 L6.8638551,4.89863383 L1.47574634,4.89863383 C0.921804107,4.89862885 0.472085895,5.34644149 0.46970252,5.90037875 L0.46970252,9.28073494 C0.467465023,9.54901885 0.572450222,9.80709649 0.76136025,9.99760745 C0.950270278,10.1881184 1.2074528,10.2952777 1.47574634,10.2952681 L2.03842858,10.2952681 C3.79455985,10.2680012 5.25513623,11.6398863 5.33779264,13.3942831 C5.35388802,14.2418862 5.02721285,15.0601101 4.4317847,15.6635629 C3.83635654,16.2670156 3.02257894,16.6046145 2.1748364,16.5998668 L1.47574634,16.5998668 C0.92014366,16.5998668 0.46970252,17.0502718 0.46970252,17.6058745 L0.46970252,22.9939832 C0.46970252,23.5495859 0.92014366,24 1.47574634,24 L5.85784745,24 C6.1250049,24.0011302 6.38154936,23.8955063 6.57045992,23.7065957 C6.75937048,23.5176851 6.86499438,23.2611407 6.8638551,22.9939832 L6.8638551,22.4952422 C6.8366707,20.7375314 8.21105284,19.2763065 9.96713292,19.1958781 C10.8147135,19.1774944 11.6338375,19.5019787 12.2388994,20.095806 C12.8439612,20.6896333 13.1837389,21.5025326 13.1812421,22.3503088 L13.1812421,22.9939832 C13.1801084,23.2604003 13.2851484,23.5162945 13.473135,23.7050811 C13.6611216,23.8938677 13.9165675,24 14.182987,24 L18.5693508,24 C19.1249535,24 19.5753585,23.5495859 19.5753585,22.9939832 L19.5753585,16.5998668 L21.1824131,16.5998668 C22.0301722,16.6034883 22.8435102,16.2647998 23.4381378,15.6605426 C24.0327653,15.0562855 24.3583453,14.237612 24.3411066,13.3900204 C24.2562262,11.637307 22.7962968,10.2679159 21.0417425,10.2952681 Z" id="路径" fill="url(#linearGradient-2)"></path>
+            </g>
+        </g>
+    </g>
+</svg>

src/assets/icons/svg/fullScreenView.svg

@@ -0,0 +1,12 @@
+<?xml version="1.0" encoding="UTF-8"?>
+<svg width="32px" height="32px" viewBox="0 0 22 22" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
+    <title>编组 54</title>
+    <g id="驾驶舱" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
+        <g id="运营总览_生产线监控驾驶舱" transform="translate(-1866.000000, -36.000000)">
+            <g id="编组-54" transform="translate(1866.000000, 36.000000)">
+                <rect id="矩形" stroke="#69b4ff" fill="#D8D8D8" opacity="0" x="0.5" y="0.5" width="32" height="32"></rect>
+                <path d="M18.4001211,1 L18.574731,1.00571398 C18.8641421,1.02474925 19.1451559,1.09128771 19.4122178,1.20447947 C19.7221027,1.33395436 19.9991094,1.52058631 20.2392616,1.76073844 C20.4776764,1.99915325 20.6652172,2.27804627 20.7953442,2.58736464 C20.9313506,2.90825642 21,3.24882158 21,3.59987893 L21,3.59987893 L21,18.4001211 L20.994286,18.574731 C20.9752507,18.8641421 20.9087123,19.1451559 20.7955205,19.4122178 C20.6660456,19.7221027 20.4794137,19.9991094 20.2392616,20.2392616 C20.0008468,20.4776764 19.7219537,20.6652172 19.4126354,20.7953442 C19.0917436,20.9313506 18.7511784,21 18.4001211,21 L18.4001211,21 L3.59987893,21 L3.42526905,20.994286 C3.13585794,20.9752507 2.85484405,20.9087123 2.58778224,20.7955205 C2.2778973,20.6660456 2.00089057,20.4794137 1.76073844,20.2392616 C1.52232363,20.0008468 1.33478285,19.7219537 1.20465581,19.4126354 C1.06864936,19.0917436 1,18.7511784 1,18.4001211 L1,18.4001211 L1,3.59987893 L1.00571398,3.42526905 C1.02474925,3.13585794 1.09128771,2.85484405 1.20447947,2.58778224 C1.33395436,2.2778973 1.52058631,2.00089057 1.76073844,1.76073844 C1.99915325,1.52232363 2.27804627,1.33478285 2.58736464,1.20465581 C2.90825642,1.06864936 3.24882158,1 3.59987893,1 L3.59987893,1 L18.4001211,1 Z M18.4001211,2.29539952 L3.59987893,2.29539952 L3.49797651,2.2993263 C2.82542992,2.35136056 2.29539952,2.9140495 2.29539952,3.59987893 L2.29539952,3.59987893 L2.29539952,18.4001211 L2.2993263,18.5020235 C2.35136056,19.1745701 2.9140495,19.7046005 3.59987893,19.7046005 L3.59987893,19.7046005 L18.4001211,19.7046005 L18.5020235,19.7006737 C19.1745701,19.6486394 19.7046005,19.0859505 19.7046005,18.4001211 L19.7046005,18.4001211 L19.7046005,3.59987893 L19.7006737,3.49797651 C19.6486394,2.82542992 19.0859505,2.29539952 18.4001211,2.29539952 L18.4001211,2.29539952 Z M4.56580299,11.8731508 L4.63987359,11.8789244 C4.95620444,11.9219442 5.20096852,12.1943435 5.20096852,12.5208838 L5.20096852,12.5208838 L5.20096852,15.8606113 L8.39814764,12.6634321 L8.45892035,12.6098356 C8.71226443,12.4133149 9.08161636,12.4311804 9.3138681,12.6634321 C9.56547415,12.9150382 9.56547415,13.3275466 9.3138681,13.5791526 L9.3138681,13.5791526 L6.09149511,16.7990315 L9.4155569,16.7990315 L9.49368756,16.8035151 C9.82695229,16.8420028 10.0864105,17.123441 10.081435,17.4601165 C10.0742517,17.8119637 9.78624591,18.094431 9.43371671,18.094431 L9.43371671,18.094431 L4.5691586,18.094431 L4.49163938,18.0899766 C4.16113157,18.051728 3.90556901,17.7718105 3.90556901,17.4308414 L3.90556901,17.4308414 L3.90556901,12.5367736 L3.91007171,12.4587841 C3.94871707,12.1260764 4.23118526,11.8665247 4.56580299,11.8731508 L4.56580299,11.8731508 Z M17.4353814,3.90556901 L17.512257,3.91000958 C17.8400885,3.94813523 18.094431,4.22707005 18.094431,4.56461864 L18.094431,4.56461864 L18.094431,9.46095642 L18.0899283,9.53894589 C18.0512829,9.87165361 17.7688147,10.1312053 17.434197,10.1245792 C17.0828999,10.1173731 16.7990315,9.82850504 16.7990315,9.47684625 L16.7990315,9.47684625 L16.7990315,6.13938874 L13.6018524,9.33656786 L13.5410796,9.39016441 C13.2877356,9.58668512 12.9183836,9.5688196 12.6861319,9.33656786 C12.4345258,9.08496181 12.4345258,8.67245345 12.6861319,8.4208474 L12.6861319,8.4208474 L15.9060108,5.20096852 L12.5821731,5.20096852 L12.5040246,5.19648608 C12.170734,5.1580095 11.9119308,4.876675 11.9185506,4.54071802 C11.9257483,4.18803625 12.2137541,3.90556901 12.5662833,3.90556901 L12.5662833,3.90556901 L17.4353814,3.90556901 Z" id="形状结合" fill="#69b4ff" fill-rule="nonzero" opacity="0.79078311"></path>
+            </g>
+        </g>
+    </g>
+</svg>

src/assets/icons/svg/icon-upload.svg

@@ -0,0 +1,14 @@
+<?xml version="1.0" encoding="UTF-8"?>
+<svg width="14px" height="14px" viewBox="0 0 14 14" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
+    <title>上传</title>
+    <g id="组件" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd" opacity="0.65">
+        <g id="上传_Resources/Button" transform="translate(-12.000000, -9.000000)">
+            <g id="上传" transform="translate(12.000000, 9.000000)">
+                <g id="upload" transform="translate(0.875000, 0.875000)" fill="currentColor" fill-rule="nonzero">
+                    <path d="M5.80371094,0.138085937 C5.8953125,0.046484375 6.01699219,0 6.13867188,0 C6.26035156,0 6.38066406,0.046484375 6.47363281,0.138085937 L8.60371094,2.26953125 C8.78828125,2.45410156 8.78828125,2.75351562 8.60371094,2.93808594 C8.51484375,3.02695312 8.39589844,3.07617188 8.27011719,3.07617188 C8.14433594,3.07617188 8.02539062,3.02695312 7.93652344,2.93808594 L6.61171875,1.61328125 L6.61171875,9.51289062 C6.61171875,9.77402344 6.39980469,9.9859375 6.13867188,9.9859375 C5.87753906,9.9859375 5.665625,9.77402344 5.665625,9.51289062 L5.665625,1.61328125 L4.34082031,2.93808594 C4.15625,3.12265625 3.85683594,3.12265625 3.67363281,2.93808594 C3.4890625,2.75351562 3.4890625,2.45410156 3.67226563,2.26953125 L5.80371094,0.138085937 Z M11.7769531,7.88046875 C11.5158203,7.88046875 11.3039063,8.09238281 11.3039063,8.35351563 L11.3039063,11.025 C11.3039063,11.1794922 11.178125,11.3066406 11.0222656,11.3066406 L1.22636719,11.3066406 C1.071875,11.3066406 0.944726562,11.1808594 0.944726562,11.025 L0.944726562,8.35214844 C0.944726562,8.09101563 0.7328125,7.87910156 0.471679688,7.87910156 C0.210546875,7.87910156 0,8.09238281 0,8.35214844 L0,11.3996094 C0,11.8685547 0.381445313,12.2486328 0.849023437,12.2486328 L11.4009766,12.2486328 C11.8699219,12.2486328 12.25,11.8671875 12.25,11.3996094 L12.25,8.35214844 C12.25,8.09238281 12.0380859,7.88046875 11.7769531,7.88046875 Z" id="Shape"></path>
+                </g>
+                <rect id="Rectangle-49" x="0" y="0" width="14" height="14"></rect>
+            </g>
+        </g>
+    </g>
+</svg>

src/assets/icons/svg/line.svg

@@ -0,0 +1,12 @@
+<?xml version="1.0" encoding="UTF-8"?>
+<svg width="24px" height="24px" viewBox="0 0 24 24" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
+    <title>产量</title>
+    <g id="页面-1" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
+        <g id="深加工看板" transform="translate(-68.000000, -297.000000)" fill="#FFFFFF" fill-rule="nonzero">
+            <g id="产量" transform="translate(68.000000, 297.000000)">
+                <rect id="矩形" opacity="0" x="0" y="0" width="24" height="24"></rect>
+                <path d="M22.2162957,1 L1.78372985,1 C1.35093374,1 1,1.33440606 1,1.75168741 L1,7 L23,7 L23,1.75168741 C23,1.33486987 22.6491174,1 22.2162957,1 Z M4.00067655,5 C3.44751496,5 3,4.5525025 3,3.99928444 C3,3.44752352 3.44751496,3 4.00067655,3 C4.55245902,3 5,3.44752352 5,3.99928444 C5,4.5525025 4.55245902,5 4.00067655,5 L4.00067655,5 Z M1,22.2486389 C1,22.6651285 1.35099088,23 1.78385746,23 L22.2161681,23 C22.6499302,23 23,22.6651041 23,22.2486389 L23,17 L1,17 L1,22.2486389 Z M4.00067655,19 C4.55245902,19 5,19.4475091 5,19.9997788 C5,20.5524648 4.55245902,21 4.00067655,21 C3.44751496,21 3,20.5524648 3,19.9997788 C3,19.4475091 3.44751496,19 4.00067655,19 Z M1,15 L23,15 L23,9 L1,9 L1,15 Z M4.00067655,11 C4.55245902,11 5,11.4479977 5,12.0002082 C5,12.552939 4.55245902,13 4.00067655,13 C3.44751496,13 3,12.552939 3,12.0002082 C3,11.4479977 3.44751496,11 4.00067655,11 L4.00067655,11 Z" id="形状"></path>
+            </g>
+        </g>
+    </g>
+</svg>

src/assets/icons/svg/unFullScreenView.svg

@@ -0,0 +1,10 @@
+<?xml version="1.0" encoding="UTF-8"?>
+<svg width="22px" height="22px" viewBox="0 0 22 22" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
+    <title>编组 54备份</title>
+    <g id="驾驶舱" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
+        <g id="编组-54备份">
+            <rect id="矩形" stroke="#979797" fill="#D8D8D8" opacity="0" x="0.5" y="0.5" width="21" height="21"></rect>
+            <path d="M18.4001211,1 L18.574731,1.00571398 C18.8641421,1.02474925 19.1451559,1.09128771 19.4122178,1.20447947 C19.7221027,1.33395436 19.9991094,1.52058631 20.2392616,1.76073844 C20.4776764,1.99915325 20.6652172,2.27804627 20.7953442,2.58736464 C20.9313506,2.90825642 21,3.24882158 21,3.59987893 L21,3.59987893 L21,18.4001211 L20.994286,18.574731 C20.9752507,18.8641421 20.9087123,19.1451559 20.7955205,19.4122178 C20.6660456,19.7221027 20.4794137,19.9991094 20.2392616,20.2392616 C20.0008468,20.4776764 19.7219537,20.6652172 19.4126354,20.7953442 C19.0917436,20.9313506 18.7511784,21 18.4001211,21 L18.4001211,21 L3.59987893,21 L3.42526905,20.994286 C3.13585794,20.9752507 2.85484405,20.9087123 2.58778224,20.7955205 C2.2778973,20.6660456 2.00089057,20.4794137 1.76073844,20.2392616 C1.52232363,20.0008468 1.33478285,19.7219537 1.20465581,19.4126354 C1.06864936,19.0917436 1,18.7511784 1,18.4001211 L1,18.4001211 L1,3.59987893 L1.00571398,3.42526905 C1.02474925,3.13585794 1.09128771,2.85484405 1.20447947,2.58778224 C1.33395436,2.2778973 1.52058631,2.00089057 1.76073844,1.76073844 C1.99915325,1.52232363 2.27804627,1.33478285 2.58736464,1.20465581 C2.90825642,1.06864936 3.24882158,1 3.59987893,1 L3.59987893,1 L18.4001211,1 Z M18.4001211,2.29539952 L3.59987893,2.29539952 L3.49797651,2.2993263 C2.82542992,2.35136056 2.29539952,2.9140495 2.29539952,3.59987893 L2.29539952,3.59987893 L2.29539952,18.4001211 L2.2993263,18.5020235 C2.35136056,19.1745701 2.9140495,19.7046005 3.59987893,19.7046005 L3.59987893,19.7046005 L18.4001211,19.7046005 L18.5020235,19.7006737 C19.1745701,19.6486394 19.7046005,19.0859505 19.7046005,18.4001211 L19.7046005,18.4001211 L19.7046005,3.59987893 L19.7006737,3.49797651 C19.6486394,2.82542992 19.0859505,2.29539952 18.4001211,2.29539952 L18.4001211,2.29539952 Z M9.43538136,11.905569 L9.512257,11.9100096 C9.84008849,11.9481352 10.094431,12.2270701 10.094431,12.5646186 L10.094431,12.5646186 L10.094431,17.4609564 L10.0899283,17.5389459 C10.0512829,17.8716536 9.76881474,18.1312053 9.43419701,18.1245792 C9.08289988,18.1173731 8.79903148,17.828505 8.79903148,17.4768462 L8.79903148,17.4768462 L8.79903148,14.1393887 L5.60185236,17.3365679 L5.54107965,17.3901644 C5.28773557,17.5866851 4.91838364,17.5688196 4.6861319,17.3365679 C4.43452585,17.0849618 4.43452585,16.6724534 4.6861319,16.4208474 L4.6861319,16.4208474 L7.90601077,13.2009685 L4.58217312,13.2009685 L4.50402457,13.1964861 C4.17073404,13.1580095 3.9119308,12.876675 3.91855064,12.540718 C3.92574827,12.1880363 4.21375409,11.905569 4.56628329,11.905569 L4.56628329,11.905569 L9.43538136,11.905569 Z M12.565803,3.8731508 L12.6398736,3.87892442 C12.9562044,3.92194416 13.2009685,4.19434347 13.2009685,4.52088378 L13.2009685,4.52088378 L13.2009685,7.86061126 L16.3981476,4.66343214 L16.4589204,4.60983559 C16.7122644,4.41331488 17.0816164,4.4311804 17.3138681,4.66343214 C17.5654742,4.91503819 17.5654742,5.32754655 17.3138681,5.5791526 L17.3138681,5.5791526 L14.0914951,8.79903148 L17.4155569,8.79903148 L17.4936876,8.80351509 C17.8269523,8.84200281 18.0864105,9.12344101 18.081435,9.46011654 C18.0742517,9.81196375 17.7862459,10.094431 17.4337167,10.094431 L17.4337167,10.094431 L12.5691586,10.094431 L12.4916394,10.0899766 C12.1611316,10.051728 11.905569,9.77181051 11.905569,9.4308414 L11.905569,9.4308414 L11.905569,4.53677361 L11.9100717,4.45878413 C11.9487171,4.12607641 12.2311853,3.86652471 12.565803,3.8731508 L12.565803,3.8731508 Z" id="形状结合" fill="#69b4ff" fill-rule="nonzero" opacity="0.79078311"></path>
+        </g>
+    </g>
+</svg>

src/assets/icons/svg/yanqi.svg

@@ -0,0 +1,13 @@
+<?xml version="1.0" encoding="UTF-8"?>
+<svg width="24px" height="23.9254658px" viewBox="0 0 24 23.9254658" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
+    <title>烟气</title>
+    <g id="页面-1" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
+        <g id="成本看板" transform="translate(-1319.000000, -293.962733)" fill-rule="nonzero">
+            <g id="烟气" transform="translate(1319.000000, 293.962733)">
+                <rect id="矩形" fill="#000000" opacity="0" x="0" y="0" width="24" height="23.9254658"></rect>
+                <path d="M10.6744092,10.2458592 C10.6744092,10.2458592 3.76099563,15.5072464 6.34479666,19.9378882 C5.78613697,19.5917443 3.83082809,18.2071687 3.2721684,17.4456522 C1.73585426,15.5072464 1.80568673,14.1918996 2.36434642,12.8765528 C3.6213307,9.89971532 7.39228357,6.9921066 8.50960292,5.1229296 C10.3950794,2.07686335 8.85876522,-7.08336081e-14 8.85876522,-7.08336081e-14 C8.85876522,-7.08336081e-14 12.769383,1.73071946 12.9788804,4.98447204 C13.2582102,8.16899586 10.6744092,10.2458592 10.6744092,10.2458592 Z" id="路径" fill="#FFFFFF"></path>
+                <path d="M9.55552302,-6.3573715e-14 L9.48496561,-6.3573715e-14 L9.41440819,-6.3573715e-14 L9.34385077,-6.3573715e-14 L9.27329335,-6.3573715e-14 C9.27329335,-6.3573715e-14 9.20273594,-6.3573715e-14 9.20273596,0.0693204763 L9.13217854,0.0693204763 L9.06162113,0.138640927 L8.99106371,0.207961403 L8.99106371,0.485243308 C8.99106371,0.485243308 8.99106371,0.554563785 9.06162113,0.554563785 L9.06162113,0.623884235 C10.1199823,2.35689604 9.69663786,4.36718972 7.79158769,6.65476534 C7.43880063,7.07068817 6.94489873,7.55593148 6.38043941,8.17981571 C4.96929114,9.35826373 3.6992577,10.6753527 2.99368358,11.7844803 C2.0764372,13.1015692 1.79420756,14.6266197 2.14699459,16.0130291 C2.57033907,17.8153614 4.05204476,19.4790527 6.52155425,20.8654621 C6.59211167,20.9347826 6.66266909,20.9347826 6.73322648,20.9347826 C6.80378389,20.9347826 6.87434131,20.9347826 6.94489873,20.8654621 C7.01545615,20.7961417 7.08601356,20.7961417 7.08601354,20.7268212 L7.08601354,20.6575007 L7.08601354,20.5881803 L7.08601354,20.5188598 L7.08601354,20.4495393 C7.08601354,20.3802188 7.08601354,20.3802188 7.01545615,20.3802188 L7.01545615,20.3108984 C5.60430787,18.3006047 7.01545615,16.0130291 7.9327025,14.9039015 L8.00325992,14.8345811 C8.92050629,13.656133 9.83775267,12.7549669 10.6138842,11.9231212 C11.1783435,11.3685574 11.6722454,10.8833141 12.0955899,10.3287504 C13.647853,8.45709759 14.2123123,6.72408579 13.9300827,5.06039446 C13.5772956,3.18874173 12.0955899,1.4557299 9.55552302,-6.3573715e-14 Z M9.48470738,9.26748999 C8.64336853,10.0744997 6.3074421,10.0757542 5.3258801,11.2862689 C3.92364867,12.9675392 5.42114982,16.3973307 5.7015961,17.9440994 C4.29936467,16.9353372 3.38791424,15.8593242 3.10746797,14.6488095 C2.82702169,13.5727965 3.10746797,12.3622819 3.8085837,11.2862689 L3.87869525,11.219018 C4.5096994,10.2102558 5.84181925,8.93249038 6.89349283,7.9237282 C7.52449698,7.31847086 8.01527795,6.84771519 8.3658358,6.44421029 C10.3289598,4.22493344 10.6094061,2.34191068 10.3289598,0.99689441 C11.5208565,1.87115499 12.6426417,3.01441881 12.9230879,4.49393671 C13.2035342,5.77170217 12.7127532,7.18396925 11.5208565,8.66348714 L9.48470738,9.26748999 Z M21.9281191,9.58246693 C21.6004931,7.86679721 20.3555139,6.28838107 18.1931817,4.98447205 L18.1276565,4.98447205 L18.0621313,4.98447205 L17.9966061,4.98447205 L17.9310808,4.98447205 C17.8655556,4.98447205 17.8655556,4.98447205 17.8655556,5.05309884 L17.8000304,5.05309884 L17.7345052,5.12172564 L17.66898,5.19035243 L17.66898,5.46485958 C17.66898,5.46485958 17.66898,5.53348637 17.7345052,5.53348637 L17.7345052,5.60211316 C18.6518582,7.11190253 18.2587069,8.89619902 16.6861017,10.9550027 C16.4240008,11.2981367 15.9653243,11.7785242 15.5066478,12.3275385 C14.5237695,13.3569403 13.4098408,14.5922225 12.8201138,15.6216244 C12.0993364,16.7882798 11.8372356,18.1608156 12.0993364,19.4647245 C12.4924877,21.1117675 13.7374669,22.5529301 15.8342739,23.856839 C15.8997991,23.9254658 15.9653243,23.9254658 16.0308495,23.9254658 C16.0963747,23.9254658 16.1619,23.9254658 16.2274252,23.856839 C16.2929504,23.7882123 16.3584756,23.7882123 16.3584756,23.7195855 L16.3584756,23.6509587 L16.3584756,23.5823319 L16.3584756,23.5137051 L16.3584756,23.4450783 C16.3584756,23.4450783 16.3584756,23.3764515 16.2929504,23.3764515 L16.2929504,23.3078247 C15.1790217,21.5235282 16.2929504,19.5333513 17.079253,18.5039495 L17.1447782,18.4353227 C17.9310808,17.3372941 18.6518582,16.5137726 19.3726356,15.8275047 C19.8313122,15.3471172 20.2899887,14.8667297 20.6176148,14.454969 C21.7315435,12.6020456 22.19022,11.0922563 21.9281191,9.58246693 L21.9281191,9.58246693 Z M20.5837087,13.7271478 C20.225071,14.1241412 19.7947058,14.5211345 19.2926131,14.9842934 C18.5036102,15.7121146 17.6428797,16.5061012 16.7104218,17.6309157 C15.4193261,19.086558 14.9172334,20.6083659 15.2041435,21.931677 C13.9130479,21.0715248 13.2958761,20.3327069 13.0806935,19.3402236 C12.8655109,18.3477402 13.0806935,17.3552568 13.7262413,16.3627735 L13.7979689,16.2966079 C14.3717892,15.4364556 15.4193261,13.99181 16.4235116,13.0654922 C16.9973319,12.5361677 17.4994247,12.0730088 17.7863348,11.742181 C19.5077957,9.75721431 19.8664333,8.16924091 19.6512507,6.97826087 C20.7271638,7.77224757 21.7313493,8.76473095 21.9465319,9.95571099 C22.1617145,11.2128566 21.7313493,12.4700022 20.5837087,13.7271478 Z" id="形状" fill="#FFFFFF"></path>
+            </g>
+        </g>
+    </g>
+</svg>

src/assets/styles/login.scss

@@ -1,10 +1,13 @@
 /* ===== PC DESIGN ===== */
-$W: 1000;
+$W: 1080;
 $H: 1920;
-$picW: 438;
+// $picW: 438;
-$picH: 560;
+// $picH: 560;
-$formW: 320;
+$picW: 1080;
+$picH: 1118;
+$formW: 420;
 $tabW: $formW / 2;
+// $rowH: 56;
 $rowH: 56;
 $buttonH: 50;
 
@@ -15,6 +18,7 @@ $containerBgImage: '../assets/images/bg.png';
 $logoWidth: 417px;
 $logoHeight: 64px;
 $logoImage: '../assets/logo/login-logo.png';
+$cnbmLogo: '../assets/logo/cnbm.png';
 // container-content
 $contentWidth: round($W / $H * 100) * 1vw;
 $contentHeight: round($picH / $W * 100) / 100 * $contentWidth;
@@ -22,7 +26,8 @@ $contentBgColor: #ffffff;
 // container-content-pic
 $picWidth: round($picW / $H * 100) * 1vw;
 $picHeight: inherit;
-$picImage: '../assets/images/pic.png';
+// $picImage: '../assets/images/pic.png';
+$picImage: '../assets/images/login-bg.png';
 // container-content-field
 $fieldWidth: $contentWidth - $picWidth;
 $fieldHeight: inherit;
@@ -34,231 +39,310 @@ $buttonHeight: $buttonH * 1px;
 
 // - - - - - 页面基础设置
 .container {
-  .login-code {
+	.login-code {
-    width: 33%;
+		width: 33%;
-    height: 38px;
+		height: 38px;
-    float: right;
+		float: right;
-    img {
+		img {
-      cursor: pointer;
+			cursor: pointer;
-      width:100%;max-width:100px; height:auto;
+			width: 100%;
-      vertical-align: middle;
+			max-width: 100px;
-    }
+			height: auto;
-  }
+			vertical-align: middle;
-  // 元素
+		}
-  width: inherit;
+	}
-  height: inherit;
+	// 元素
-  min-width: 1080px;
+	width: inherit;
-  min-height: 620px;
+	height: inherit;
-  background-color: $containerBgColor;
+	min-width: 1080px;
-  background-image: url($containerBgImage);
+	min-height: 620px;
-  background-size: cover;
+	background-color: $containerBgColor;
-  // 定位
+	// background-image: url($containerBgImage);
-  position: relative;
+	background-size: cover;
-  display: flex;
+	// 定位
-  justify-content: center;
+	position: relative;
-  align-items: center;
+	display: flex;
-  // 文字
+	justify-content: center;
-  font-size: 14px;
+	align-items: center;
-  font-family: Microsoft YaHei;
+	// 文字
-  font-weight: 400;
+	font-size: 14px;
-  .logo {
+	font-family: Microsoft YaHei;
-    // 元素
+	font-weight: 400;
-    width: $logoWidth;
+	.logo {
-    height: $logoHeight;
+		// 元素
-    // background-image: url($logoImage);
+		width: $logoWidth;
-    // background-size: contain;
+		height: $logoHeight;
-    // 定位
+		// background-image: url($logoImage);
-    position: absolute;
+		// background-size: contain;
-    top: 50px;
+		// 定位
-    left: 50%;
+		position: absolute;
-    margin-left: -$logoWidth/2;
+		top: 50px;
-  }
+		left: 50%;
-  .content {
+		margin-left: -$logoWidth/2;
-    // 元素
+	}
-    width: $contentWidth;
+	.content {
-    height: $contentHeight;
+		// 元素
-    background-color: #ffffff;
+		// width: $contentWidth;
-    box-shadow: 0px 16px 40px rgba(0, 0, 0, 0.07);
+		// height: $contentHeight;
-    border-radius: 20px;
+		width: 100%;
-    // 定位
+		height: 100%;
-    position: relative;
+		background-color: #ffffff;
-    .pic {
+		// box-shadow: 0px 16px 40px rgba(0, 0, 0, 0.07);
-      // 元素
+		// border-radius: 20px;
-      width: $picWidth;
+		// 定位
-      height: $picHeight;
+		position: relative;
-      background-image: url($picImage);
+		display: flex;
-      background-repeat: no-repeat;
+
-      background-size: cover;
+		.pic {
-      border-radius: 20px 0 0 20px;
+			// 元素
-      // 定位
+			width: $picWidth;
-      position: absolute;
+			height: $picHeight;
-      top: 0;
+			background-image: url($picImage);
-      left: 0;
+			background-repeat: no-repeat;
-    }
+			background-size: 100% 100%;
-    .field {
+			background-position: 0 0;
-      width: $fieldWidth;
+			position: relative;
-      height: $fieldHeight;
+
-      // 定位
+			&::after {
-      position: absolute;
+        content: '';
-      top: 0;
+				position: absolute;
-      left: $picWidth;
+				top: 0;
-      display:flex;
+				left: 0;
-      justify-content: center;
+				width: 100%;
-      align-items: center;
+				height: 100%;
-      .pc-title{ width: 100%; clear: both;}
+        // background: #f003;
-      .mobile-title,
+        display: inline-block;
-      .mobile-switch {
+			}
-        display: none;
+		}
-      }
+		.field {
-      .form {
+			// background: #ccc3;
-        box-sizing: border-box;
+			position: relative;
-        width: $formWidth;
+			padding-top: 196px;
-        // - - - tab
+			flex: 1;
-        :deep(.el-tabs__content) {
+			display: flex;
-          padding: 20px 0 0;
+			flex-direction: column;
-        }
+			// justify-content: center;
-        :deep(.el-tabs__item) {
+			align-items: center;
-          // 元素
+			.pc-title {
-          width: $tabWidth;
+				width: 100%;
-          height: $rowHeight;
+				text-align: center;
-          padding: 0;
+				clear: both;
-          // 文字
+				position: relative;
-          line-height: $rowHeight;
+				top: -36px;
-          color: #666666;
+
-        }
+				// h3.title {
-        :deep(.el-tabs__item.is-active) {
+				// 	position: relative;
-          font-weight: bold;
+
-          color: #2F53EB;
+				// 	&::before {
-        }
+				// 		content: '';
-        :deep(.el-tabs__active-bar) {
+				// 		background: url($cnbmLogo) 100% / 100% no-repeat;
-          height: 3px;
+				// 		height: 48px;
-          border-radius: 2px;
+				// 		width: 48px;
-        }
+				// 		position: absolute;
-        // - - - input
+				// 		left: 0px;
-        :deep(.el-input__inner) {
+				// 		top: 4px;
-          // 元素
+				// 		display: inline-block;
-          width: 100%;
+				// 	}
-          height: $rowHeight;
+				// }
-          background: #f5f5f5;
+			}
-          border: 0;
+			.mobile-title,
-          border-radius: 28px;
+			.mobile-switch {
-          // 文字
+				display: none;
-          text-align: center;
+			}
-          line-height: 19px;
+			.form {
-          color: #262626;
+				margin-top: 32px;
-        }
+				box-sizing: border-box;
-        .code:deep(.el-input__inner) {
+				// width: $formWidth;
-          padding: 0 24px;
+				width: 100%;
-          // 文字
+				// - - - tab
-          text-align: left;
+				:deep(.el-tabs__nav) {
-        }
+					// background: #f0f3;
-        :deep(.el-input__inner::-webkit-input-placeholder) { /* WebKit browsers */
+				}
-          font-weight: 400;
+				:deep(.el-tabs__content) {
-          color: #8C8C8C;
+					padding: 20px 0 0;
-        }
+				}
-        :deep(.el-input__inner:-moz-placeholder) { /* Mozilla Firefox 4 to 18 */
+				:deep(.el-tabs__item) {
-          font-weight: 400;
+					user-select: none;
-          color: #8C8C8C;
+					// 元素
-        }
+					width: $tabWidth;
-        :deep(.el-input__inner::-moz-placeholder) { /* Mozilla Firefox 19+ */
+					height: $rowHeight;
-          font-weight: 400;
+					padding: 0;
-          color: #8C8C8C;
+					// 文字
-          opacity:1;
+					line-height: $rowHeight;
-        }
+					color: #666666;
-        :deep(.el-input__inner:-ms-input-placeholder) { /* Internet Explorer 10+ */
+					font-size: 18px;
-          font-weight: 400;
+					font-weight: 400;
-          color: #8C8C8C !important;
+					text-align: center;
-        }
+				}
-        :deep(.el-form-item) {
+				:deep(.el-tabs__item.is-active) {
-          position: relative;
+					font-weight: 500;
-          .button-code {
+					color: #2f53eb;
-            // 元素
+				}
-            height: $rowHeight;
+				:deep(.el-tabs__active-bar) {
-            box-sizing: border-box;
+					height: 3px;
-            // 定位
+					border-radius: 2px;
-            position: absolute;
+				}
-            top: 0;
+				// - - - input
-            right: 20px;
+				:deep(.el-input__inner) {
-            z-index: 1;
+					// 元素
-            // 文字
+					width: 100%;
-            line-height: 20px;
+					height: $rowHeight;
-            font-size: 14px;
+					background: #f5f5f5;
-            font-family: PingFang SC;
+					border: 0;
-            font-weight: 400;
+					border-radius: 28px;
-            color: #2F53EB;
+					// 文字
-            span {
+					text-align: center;
-              padding-left: 15px;
+					line-height: 19px;
-              border-left: 2px solid #D9D9D9;
+					color: #262626;
-            }
+				}
-          }
+				.code:deep(.el-input__inner) {
-        }
+					padding: 0 24px;
-        :deep(.el-form-item__error) {
+					// 文字
-          padding-left: 24px;
+					text-align: left;
-        }
+				}
-        .button {
+				:deep(.el-input__inner::-webkit-input-placeholder) {
-          width: 100%;
+					/* WebKit browsers */
-          height: $buttonHeight;
+					font-weight: 400;
-          background: rgba(24, 144, 255, 0.2);
+					color: #8c8c8c;
-          border: 0;
+				}
-          border-radius: 24px;
+				:deep(.el-input__inner:-moz-placeholder) {
-          margin-bottom: 20px;
+					/* Mozilla Firefox 4 to 18 */
-          // 文字
+					font-weight: 400;
-          line-height: 26px;
+					color: #8c8c8c;
-          font-size: 20px;
+				}
-          color: #FFFFFF;
+				:deep(.el-input__inner::-moz-placeholder) {
-        }
+					/* Mozilla Firefox 19+ */
-        .button-active {
+					font-weight: 400;
-          background: #2F53EB;
+					color: #8c8c8c;
-          box-shadow: 0px 2px 8px rgba(0, 80, 184, 0.2);
+					opacity: 1;
-        }
+				}
-      }
+				:deep(.el-input__inner:-ms-input-placeholder) {
-    }
+					/* Internet Explorer 10+ */
-  }
+					font-weight: 400;
-  .footer {
+					color: #8c8c8c !important;
-    // 元素
+				}
-    height: 16px;
+				:deep(.el-form-item) {
-    line-height: 16px;
+					position: relative;
-    font-size: 12px;
+					.button-code {
-    color: #8c8c8c;
+						// 元素
-    // 定位
+						height: $rowHeight;
-    position: absolute;
+						box-sizing: border-box;
-    bottom: 30px;
+						// 定位
-    a,
+						position: absolute;
-    a:hover,
+						top: 0;
-    a:active {
+						right: 20px;
-      color: inherit;
+						z-index: 1;
-      text-decoration: none;
+						// 文字
-    }
+						line-height: 20px;
-  }
+						font-size: 14px;
+						font-family: PingFang SC;
+						font-weight: 400;
+						color: #2f53eb;
+						span {
+							padding-left: 15px;
+							border-left: 2px solid #d9d9d9;
+						}
+					}
+				}
+				:deep(.el-form-item__error) {
+					padding-left: 24px;
+				}
+				.button {
+					width: 100%;
+					height: $buttonHeight;
+					background: rgba(24, 144, 255, 0.2);
+					border: 0;
+					border-radius: 24px;
+					margin-bottom: 20px;
+					// 文字
+					line-height: 26px;
+					font-size: 20px;
+					color: #ffffff;
+				}
+				.button-active {
+					background: #2f53eb;
+					box-shadow: 0px 2px 8px rgba(0, 80, 184, 0.2);
+				}
+			}
+		}
+	}
+
+	.login-form {
+		* {
+			user-select: none;
+		}
+		// - - - input
+		:deep(.el-input__inner) {
+			// 元素
+			width: 420px;
+			height: 66px;
+			color: #262626;
+			font-size: 18px;
+		}
+		:deep(.el-checkbox__label) {
+			font-size: 18px;
+			line-height: 14px;
+		}
+	}
+
+	.footer {
+		user-select: none;
+		// 元素
+		height: 16px;
+		line-height: 16px;
+		font-size: 12px;
+		color: #8c8c8c;
+		// 定位
+		position: absolute;
+		bottom: 30px;
+		a,
+		a:hover,
+		a:active {
+			color: inherit;
+			text-decoration: none;
+		}
+	}
 }
 
 // - - - - - PC 最小尺寸设置
 @media screen and (min-width: 599px) and (max-width: 1366px) {
-  .container {
+	.container {
-    .content {
+		min-width: 599px;
-      width: 710px;
+		.content {
-      height: 397px;
+			// width: 710px;
-      .pic {
+			// height: 397px;
-        width: 314px;
+			width: 100%;
-      }
+			height: 100%;
-      .field {
+			.pic {
-        width: calc(710px - 314px);
+				// width: 314px;
-        left: 314px;
+				display: none;
-        .form {
+			}
-          width: 320px;
+			.field {
-          :deep(.el-input__inner) {
+				// width: calc(710px - 314px);
-            width: 320px;
+				// left: 314px;
-            height: 56px;
+				// justify-content: center;
-          }
+				width: 100%;
-          .button {
-            height: 50px;
-          }
-        }
-      }
-    }
-  }
-}
 
+				.pc-title {
+					h3 {
+						font-size: 2.4rem !important;
+					}
+				}
+
+				.form {
+					// width: 320px;
+					:deep(.el-input__inner) {
+						width: 320px;
+						height: 56px;
+					}
+					.button {
+						height: 50px;
+					}
+				}
+			}
+		}
+	}
+}
 
 /* ===== MOBILE DESIGN ===== */
 $mobileW: 375;
@@ -273,115 +357,142 @@ $mobileButtonH: 48;
 $mobileContainerBgImage: '../assets/images/bg-mobile.png';
 // container-content
 $mobileContentWidth: round($mobileContentW / $mobileW * 100) * 1vw;
-$mobileContentHeight: round($mobileContentH / $mobileW * 100) / 100 * $mobileContentWidth;
+$mobileContentHeight: round($mobileContentH / $mobileW * 100) / 100 *
+	$mobileContentWidth;
 // container-content-field-form
-$mobileFormWidth: round($mobileFormW / $mobileW *100) * 1vw;
+$mobileFormWidth: round($mobileFormW / $mobileW * 100) * 1vw;
 $mobileRowHeight: $mobileRowH * 1px;
 $mobileButtonHeight: $mobileButtonH * 1px;
 $iconBgImage: '../assets/images/icon.png';
 
 // - - - - - 移动端设置
 @media screen and (max-width: 599px) {
-  .container {
+	.container {
-    // 元素
+		// 元素
-    background-image: url($mobileContainerBgImage);
+		background-image: url($mobileContainerBgImage);
-    min-width: 280px;
+		min-width: 280px;
-    min-height: 568px;
+		min-height: 568px;
-    // 文字
+		// 文字
-    font-size: 17px;
+		font-size: 14px;
-    font-family: PingFang SC;
+		font-family: PingFang SC;
-    font-weight: bold;
+		font-weight: bold;
-    .logo {
+		.logo {
-      display: none;
+			display: none;
-    }
+		}
 
-    .content {
+		.pc-title {
-      // 元素
+			display: none;
-      width: $mobileContentWidth;
+		}
-      height: $mobileContentHeight;
+
-      min-width: 250px;
+		.content {
-      min-height: 340px;
+			// 元素
-      // 定位
+			width: $mobileContentWidth;
-      display: flex;
+			height: $mobileContentHeight;
-      justify-content: center;
+			min-width: 250px;
-      align-items: center;
+			min-height: 340px;
-      .pic {
+			// 定位
-        display: none;
+			display: flex;
-      }
+			justify-content: center;
-      .field {
+			align-items: center;
-        // 元素
+			.pic {
-        width: inherit;
+				display: none;
-        min-height: inherit;
+			}
-        // 定位
+			.field {
-        left: 0;
+        padding: 0;
-        display: flex;
+				// 元素
-        flex-direction: column;
+				width: inherit;
-        .mobile-title {
+				min-height: inherit;
-          // 元素
+				// 定位
-          margin: 0 0 20px;
+				left: 0;
-          display: block;
+				display: flex;
-        }
+				flex-direction: column;
-        .form {
+
-          width: $mobileFormWidth;
+				.mobile-title {
-          // - - - tab
+					// 元素
-          :deep(.el-tabs__header) {
+					margin: 0;
-            display: none;
+					display: block;
-          }
+				}
-          :deep(.el-tabs__content) {
+
-            padding: 0;
+				.form {
-          }
-          // - - - input
-          :deep(.el-input__inner) {
-            height: $mobileRowHeight;
-            line-height: 24px;
-            // 文字
-            text-align: center;
-            color: #262626;
-          }
-          :deep(.el-form-item) {
-            .button-code {
-              // 元素
-              height: $mobileRowHeight;
-            }
-          }
-          .button {
-            height: $mobileButtonHeight;
-            line-height: 24px;
-            color: #FFFFFF;
-          }
-        }
-        .mobile-switch {
-          display: block;
-          line-height: 20px;
-          font-size: 14px;
-          font-weight: 400;
-          color: #595959;
           margin: 0;
-          .icon {
+					width: $mobileFormWidth;
-            width: 14px;
+					// - - - tab
-            height: 14px;
+					:deep(.el-tabs__header) {
-            display: inline-block;
+						display: none;
-            background-image: url($iconBgImage);
+					}
-            background-size: cover;
+					:deep(.el-tabs__content) {
-          }
+						padding: 0;
-        }
+					}
-        .mobile-switch:hover {
+					// - - - input
-          cursor: pointer;
+					:deep(.el-input__inner) {
-        }
+						height: $mobileRowHeight;
-      }
+						line-height: 24px;
-    }
+						// 文字
-    .footer {
+						text-align: center;
-      // 元素
+						color: #262626;
-      font-size: 12px;
+					}
-      font-family: PingFang SC;
+					:deep(.el-form-item) {
-      font-weight: 400;
+						.button-code {
-      line-height: 17px;
+							// 元素
-      color: #333333;
+							height: $mobileRowHeight;
-      opacity: 0.6;
+						}
-      // 定位
+					}
-      position: absolute;
+					.button {
-      bottom: 20px;
+						height: $mobileButtonHeight;
-    }
+						line-height: 24px;
-  }
+						color: #ffffff;
+					}
+				}
 
+				.login-form {
+					:deep(.el-input__inner) {
+						height: $mobileRowHeight;
+						line-height: 24px;
+						// 文字
+						text-align: center;
+						color: #262626;
+					}
+
+          :deep(#button-form-item) {
+            margin: 0 !important;
+						button {
+							// 元素
+							height: $mobileRowHeight;
+						}
+					}
+				}
+				.mobile-switch {
+					display: block;
+					line-height: 20px;
+					font-size: 14px;
+					font-weight: 400;
+					color: #595959;
+					margin: 0;
+					.icon {
+						width: 14px;
+						height: 14px;
+						display: inline-block;
+						background-image: url($iconBgImage);
+						background-size: cover;
+					}
+				}
+				.mobile-switch:hover {
+					cursor: pointer;
+				}
+			}
+		}
+
+		.footer {
+			// 元素
+			font-size: 12px;
+			font-family: PingFang SC;
+			font-weight: 400;
+			line-height: 17px;
+			color: #333333;
+			opacity: 0.6;
+			// 定位
+			// position: absolute;
+			bottom: -32px;
+		}
+	}
 }

src/components/ButtonNav/index.vue

@@ -0,0 +1,132 @@
+<!--
+    filename: index.vue
+    author: liubin
+    date: 2024-04-02 09:49:36
+    description:
+-->
+
+<template>
+  <!-- 按钮切换 -->
+  <div v-if="buttonMode" class="button-nav">
+    <button
+      v-for="m in menus"
+      :key="m"
+      @click="currentMenu = m"
+      :data-text="m"
+      :class="[m === currentMenu ? 'active' : '']"
+    ></button>
+  </div>
+  <!-- 标签切换 -->
+  <div v-else class="custom-tabs" style="height: 100%; width: 100%">
+    <el-tabs class="tag-nav" v-model="currentMenu" style="height: 100%">
+      <el-tab-pane
+        v-for="(m, idx) in menus"
+        :key="m"
+        :label="idx == 0 ? `\u2002${m}\u2002` : `\u3000${m}\u3000`"
+        :name="m"
+      >
+        <slot :name="`tab${idx + 1}`"></slot>
+      </el-tab-pane>
+    </el-tabs>
+  </div>
+</template>
+
+<script>
+export default {
+  name: "ButtonNav",
+  props: {
+    menus: {
+      type: Array,
+      required: true,
+      default: () => [],
+      validator: (val) => {
+        return val.length > 0;
+      },
+    },
+    buttonMode: {
+      type: Boolean,
+      default: true,
+    },
+  },
+  data() {
+    return {
+      currentMenu: "",
+    };
+  },
+  created() {
+    this.currentMenu = this.menus[0];
+  },
+  watch: {
+    currentMenu(val) {
+      this.$emit("change", val);
+    },
+  },
+};
+</script>
+
+<style scoped lang="scss">
+.button-nav {
+  width: 100%;
+  display: flex;
+  gap: 12px;
+
+  * {
+    user-select: none;
+  }
+
+  button {
+    cursor: pointer;
+    appearance: none;
+    outline: none;
+    border: none;
+    background: #fff;
+    border-radius: 8px;
+    padding: 15px;
+    color: #888;
+    letter-spacing: 2px;
+    flex: 1;
+    box-sizing: padding-box;
+    position: relative;
+
+    &::after {
+      content: attr(data-text);
+      position: absolute;
+      top: 5px;
+      left: 50%;
+      font-size: 16px;
+      font-weight: 500;
+      transform: translate(-50%);
+    }
+
+    &.active {
+      color: #111;
+      //border-bottom: 2px solid #0b58ff;
+      box-shadow: 0px 2px 1px 1px #0b58ff;
+    }
+  }
+}
+</style>
+
+<style scoped>
+.custom-tabs >>> .el-tabs__header {
+  margin-bottom: 8px;
+  display: inline-block;
+  /* transform: translateY(-12px); */
+}
+.custom-tabs >>> .el-tabs__item {
+  padding-left: 0px !important;
+  padding-right: 0px !important;
+  line-height: 36px !important;
+  height: 36px;
+}
+
+.custom-tabs >>> .el-tabs__content {
+  height: calc(100% - 42px);
+}
+.custom-tabs >>> .el-tab-pane {
+  box-sizing: border-box;
+  height: 100%;
+  padding: 20px;
+  border: 10px solid #f002;
+}
+</style>

src/components/DialogForm/index.vue

@@ -10,6 +10,8 @@
 		ref="form"
 		:model="form"
 		:label-width="`${labelWidth}px`"
+		:size="size"
+		:label-position="labelPosition"
 		v-loading="formLoading">
 		<el-row :gutter="20" v-for="(row, rindex) in rows" :key="rindex">
 			<el-col v-for="col in row" :key="col.label" :span="24 / row.length">
@@ -46,23 +48,6 @@
 						:placeholder="`请选择${col.label}`"
 						value-format="timestamp"
 						v-bind="col.bind"></el-date-picker>
-					<el-upload
-						class="upload-in-dialog"
-						v-if="col.upload"
-						:file-list="uploadedFileList"
-						:action="col.url"
-						:on-success="handleUploadSuccess"
-						v-bind="col.bind">
-						<el-button
-							size="small"
-							type="primary"
-							:disabled="col.bind?.disabled || false">
-							点击上传
-						</el-button>
-						<div class="el-upload__tip" slot="tip" v-if="col.uploadTips">
-							{{ col.uploadTips || '只能上传jpg/png文件，大小不超过2MB' }}
-						</div>
-					</el-upload>
 					<el-switch
 						v-if="col.switch"
 						v-model="form[col.prop]"
@@ -74,6 +59,47 @@
 						:key="col.key"
 						:is="col.subcomponent"
 						:inlineStyle="col.style"></component>
+
+					<div
+						class="upload-area"
+						:class="uploadOpen ? '' : 'height-48'"
+						ref="uploadArea"
+						v-if="col.upload">
+						<span class="close-icon" :class="uploadOpen ? 'open' : ''">
+							<el-button
+								type="text"
+								icon="el-icon-arrow-right"
+								@click="handleFilesOpen" />
+						</span>
+						<!-- :file-list="uploadedFileList" -->
+						<el-upload
+							class="upload-in-dialog"
+							v-if="col.upload"
+							:action="uploadUrl"
+							:headers="uploadHeaders"
+							:show-file-list="false"
+							icon="el-icon-upload2"
+							:before-upload="beforeUpload"
+							:on-success="handleUploadSuccess"
+							v-bind="col.bind">
+							<el-button size="mini" :disabled="col.bind?.disabled || false">
+								<svg-icon
+									icon-class="icon-upload"
+									style="color: inherit"></svg-icon>
+								上传文件
+							</el-button>
+							<div class="el-upload__tip" slot="tip" v-if="col.uploadTips">
+								{{ col.uploadTips || '只能上传jpg/png文件, 大小不超过2MB' }}
+							</div>
+						</el-upload>
+
+						<uploadedFile
+							class="file"
+							v-for="file in form[col.prop] || []"
+							:file="file"
+							:key="file.fileUrl"
+							@delete="handleDeleteFile(file)" />
+					</div>
 				</el-form-item>
 			</el-col>
 		</el-row>
@@ -81,6 +107,9 @@
 </template>
 
 <script>
+import { getAccessToken } from '@/utils/auth';
+import tupleImg from '@/assets/images/tuple.png';
+
 /**
  * 找到最长的label
  * @param {*} options
@@ -99,6 +128,47 @@ function findMaxLabelWidth(rows) {
 	return max;
 }
 
+const uploadedFile = {
+	name: 'UploadedFile',
+	props: ['file'],
+	data() {
+		return {};
+	},
+	methods: {
+		handleDelete() {
+			this.$emit('delete', this.file);
+		},
+	},
+	mounted() {},
+	render: function (h) {
+		return (
+			<div
+				title={this.file.fileName}
+				style={{
+					background: `url(${tupleImg}) no-repeat`,
+					backgroundSize: '14px',
+					backgroundPosition: '0 55%',
+					paddingLeft: '20px',
+					paddingRight: '24px',
+					textOverflow: 'ellipsis',
+					whiteSpace: 'nowrap',
+					overflow: 'hidden',
+					cursor: 'pointer',
+					display: 'inline-block',
+				}}>
+				{this.file.fileName}
+				<el-button
+					type="text"
+					icon="el-icon-close"
+					style="float: right; position: relative; top: 2px; left: 8px; z-index: 100"
+					class="dialog__upload_component__close"
+					onClick={this.handleDelete}
+				/>
+			</div>
+		);
+	},
+};
+
 export default {
 	name: 'DialogForm',
 	model: {
@@ -106,7 +176,7 @@ export default {
 		event: 'update',
 	},
 	emits: ['update'],
-	components: {},
+	components: { uploadedFile },
 	props: {
 		rows: {
 			type: Array,
@@ -119,14 +189,30 @@ export default {
 		disabled: {
 			type: Boolean,
 			default: false,
-		}
+		},
+		hasFile: {
+			type: Boolean,
+			default: false,
+		},
+		labelPosition: {
+			type: String,
+			default: 'right',
+		},
+		size: {
+			type: String,
+			default: '',
+		},
 	},
 	data() {
 		return {
+			uploadOpen: false,
+			form: {},
 			formLoading: true,
 			optionListOf: {},
 			uploadedFileList: [],
 			dataLoaded: false,
+			uploadHeaders: { Authorization: 'Bearer ' + getAccessToken() },
+			uploadUrl: process.env.VUE_APP_BASE_API + '/admin-api/infra/file/upload', // 上传有关的headers，url都是固定的
 		};
 	},
 	computed: {
@@ -136,21 +222,10 @@ export default {
 			return max * 20;
 			// return max * 20 + 'px';
 		},
-		form: {
-			get() {
-				// if (this.dataLoaded) return this.dataForm;
-				// else return {}
-				return this.dataForm;
-			},
-			set(val) {
-				console.log('set form', val);
-			},
-		},
 	},
 	watch: {
 		rows: {
 			handler() {
-				console.log('watch triggered!');
 				this.$nextTick(() => {
 					this.handleOptions('watch');
 				});
@@ -158,6 +233,16 @@ export default {
 			deep: true,
 			immediate: false,
 		},
+		dataForm: {
+			handler(val) {
+				this.form = JSON.parse(JSON.stringify(val));
+				if (this.hasFile) {
+					this.form.files = this.form.files ?? [];
+				}
+			},
+			deep: true,
+			immediate: true,
+		},
 	},
 	mounted() {
 		// 处理 options
@@ -273,23 +358,29 @@ export default {
 		beforeUpload() {},
 		// 上传前的验证规则可通过 bind 属性传入
 		handleUploadSuccess(response, file, fileList) {
-			console.log(
+			this.form.files.push({
-				'[dialogForm:handleUploadSuccess]',
+				fileName: file.name,
-				response,
+				fileUrl: response.data,
-				file,
+				fileType: 2,
-				fileList,
+			});
-				this.form
-			);
-			// 保存原始文件名
-			if ('fileNames' in this.form) this.form.fileNames.push(file.name);
-			// 保存完整地址
-			if ('fileUrls' in this.form) this.form.fileUrls.push(response.data);
 			this.$modal.msgSuccess('上传成功');
+			this.$emit('update', this.form);
 		},
 
 		getFileName(fileUrl) {
 			return fileUrl.split('/').pop();
 		},
+
+		handleFilesOpen() {
+			this.uploadOpen = !this.uploadOpen;
+		},
+
+		handleDeleteFile(file) {
+			this.form.files = this.form.files.filter(
+				(item) => item.fileUrl != file.fileUrl
+			);
+			this.$emit('update', this.form);
+		},
 	},
 };
 </script>
@@ -299,4 +390,52 @@ export default {
 .el-select {
 	width: 100%;
 }
+
+.upload-area {
+	// background: #ccc;
+	// display: grid;
+	// grid-auto-rows: 34px;
+	// grid-template-columns: repeat(6, minmax(32px, max-content));
+	// gap: 8px;
+	// align-items: center;
+	position: relative;
+	overflow: hidden;
+	transition: height 0.3s ease-out;
+}
+
+.upload-in-dialog {
+	// display: inline-block;
+	margin-right: 24px;
+	// background: #ccc;
+	position: relative;
+	// top: -13px;
+	float: left;
+}
+
+.close-icon {
+	// background: #ccc;
+	position: absolute;
+	top: 0;
+	right: 12px;
+	z-index: 100;
+	transition: transform 0.3s ease-out;
+}
+
+.close-icon.open {
+	transform: rotateZ(90deg);
+}
+</style>
+
+<style>
+.dialog__upload_component__close {
+	color: #ccc;
+}
+.dialog__upload_component__close:hover {
+	/* color: #777; */
+	color: red;
+}
+
+.height-48 {
+	height: 35px !important;
+}
 </style>

src/filter/code-filter.js

@@ -0,0 +1,94 @@
+
+/*
+ * @Date: 2020-12-29 16:49:28
+ * @LastEditors: zwq
+ * @LastEditTime: 2024-09-11 13:40:48
+ * @FilePath: \basic-admin\src\filters\basicData\index.js
+ * @Description:
+ */
+
+const table = {
+  lineStatus: {
+    1: '生产中',
+    2: '停止',
+    3: '未知',
+  },
+  deactivate: {
+    1: '启用',
+    0: '停用',
+  },
+  wareType: {
+    1: '缓存',
+    2: '活动',
+    3: '其它',
+  },
+  reportType: {
+    2: '日',
+    3: '周',
+    4: '月',
+    5: '年',
+  },
+  manual: {
+    1: '手动',
+    0: '自动',
+  },
+}
+
+// 日期格式化
+export function parseTime(time, pattern) {
+  if (arguments.length === 0 || !time) {
+    return null
+  }
+  const format = pattern || '{y}-{m}-{d} {h}:{i}:{s}'
+  let date
+  if (typeof time === 'object') {
+    date = time
+  } else {
+    if ((typeof time === 'string') && (/^[0-9]+$/.test(time))) {
+      time = parseInt(time)
+    } else if (typeof time === 'string') {
+      time = time.replace(new RegExp(/-/gm), '/').replace('T', ' ').replace(new RegExp(/\.\d{3}/gm), '');
+    }
+    if ((typeof time === 'number') && (time.toString().length === 10)) {
+      time = time * 1000
+    }
+    date = new Date(time)
+  }
+  const formatObj = {
+    y: date.getFullYear(),
+    m: date.getMonth() + 1,
+    d: date.getDate(),
+    h: date.getHours(),
+    i: date.getMinutes(),
+    s: date.getSeconds(),
+    a: date.getDay(),
+    w: '',
+  }
+  const time_str = format.replace(/{([ymdhisaw])+}/g, (result, key) => {
+    let value = formatObj[key]
+    // Note: getDay() returns 0 on Sunday
+    if (key === 'a') {
+      return ['日', '一', '二', '三', '四', '五', '六'][value]
+    }
+    if (key === 'w') {
+      const current = new Date(time);
+      current.setHours(0, 0, 0);
+      current.setDate(current.getDate() + 4 - (current.getDay() || 7));
+      const firstThursday = new Date(current.getFullYear(), 0, 4);
+      firstThursday.setDate(firstThursday.getDate() + 4 - (firstThursday.getDay() || 7));
+      const time1 = current.getTime() - firstThursday.getTime();
+      const weeks = Math.ceil(time1 / (7 * 24 * 3600 * 1000));
+      return (weeks + 1)
+    }
+    if (result.length > 0 && value < 10) {
+      value = '0' + value
+    }
+    return value || 0
+  })
+  return time_str
+}
+export default function (dictTable) {
+  return function (val) {
+    return table?.[dictTable]?.[val]
+  }
+}

src/layout/components/Sidebar/Logo.vue

@@ -67,7 +67,7 @@ export default {
 	},
 	data() {
 		return {
-			title: '中建材智能化院',
+			title: '中建材自贡新能源',
 			logo: logoImg,
 		};
 	},

src/main.js

@@ -4,6 +4,7 @@ import Element from 'element-ui';
 import './assets/styles/element-variables.scss';
 import '@/assets/styles/index.scss'; // global css
 import '@/assets/styles/ruoyi.scss'; // ruoyi css
+import '@/assets/font/font.css'
 import App from './App';
 import store from './store';
 import router from './router';
@@ -34,7 +35,6 @@ import {
 	getDictDatas,
 	getDictDatas2,
 } from '@/utils/dict';
-
 import './theme/index.css'; // 自定义主题包 - code-brick-zj
 
 // 全局方法挂载

src/mixins/basic-add.js

@@ -0,0 +1,122 @@
+/*
+ * @Author: zwq
+ * @Date: 2022-08-24 11:19:43
+ * @LastEditors: zwq
+ * @LastEditTime: 2024-04-10 15:46:19
+ * @Description:
+ */
+import { listData } from "@/api/system/dict/data"; //数据字典接口
+export default {
+  data() {
+    /* eslint-disable */
+    return {
+      urlOptions: {
+        createURL: '', //新增接口
+        updateURL: '', //编辑提交接口
+        infoURL: '', //编辑时获取单条数据接口
+        codeURL: '', //获取code接口（返回结果为dataForm.code字段）
+        optionArrUrl: [], //需要获取下拉框的方法数组
+        optionArr: {}, //需要获取下拉框的方法数组的返回结果
+        dictNameList: [], //数据字典name数组
+        dictArr: {}, //需要获取数据字典的方法数组的返回结果
+      },
+      visible: false,
+      setData: false, // 是否需要【编辑时获取单条数据接口】返回的数据操作
+    }
+  },
+  created() {
+  },
+  activated() {
+  },
+  methods: {
+    init(id) {
+      this.dataForm.id = id || null;
+      this.visible = true;
+      if (this.urlOptions.optionArrUrl.length > 0) {
+        this.getArr()
+      }
+      if (this.urlOptions.dictNameList.length > 0) {
+        this.getDict()
+      }
+      this.$nextTick(() => {
+        this.$refs["dataForm"].resetFields();
+        if (this.dataForm.id) {
+          this.urlOptions.infoURL(id).then(response => {
+            this.dataForm = response.data;
+            if (this.setData) {
+              this.setDataForm()
+            }
+          });
+        } else {
+          if (this.urlOptions.codeURL) {
+            this.getCode()
+          }
+				}
+      });
+    },
+    /** 获取code */
+		getCode() {
+			this.urlOptions.codeURL()
+				.then(({ data: res }) => {
+					this.dataForm.code = res;
+				})
+				.catch(() => {});
+		},
+    /** 获取下拉框数组 */
+    getArr() {
+      const params = {
+        pageSize: 100,
+        pageNo: 1,
+      }
+      this.urlOptions.optionArrUrl.forEach((item, index) => {
+        item(params).then(({ data: res }) => {
+          this.$set(this.urlOptions.optionArr, `arr${index}`, res.list)
+        })
+          .catch(() => {
+          });
+      });
+    },
+    /** 查询字典数据列表 */
+    getDict() {
+      this.urlOptions.dictNameList.forEach((item,index)=>{
+        const queryParams = {
+          pageNo: 1,
+          pageSize: 99,
+          dictType: item,
+        }
+        listData(queryParams).then(response => {
+          this.$set(this.urlOptions.dictArr, `dict${index}`, response.data.list)
+        });
+      })
+    },
+    // 表单提交
+    dataFormSubmit() {
+      this.$refs["dataForm"].validate((valid) => {
+        if (!valid) {
+          return false;
+        }
+        // 修改的提交
+        if (this.dataForm.id) {
+          this.urlOptions.updateURL(this.dataForm).then(response => {
+            this.$modal.msgSuccess("修改成功");
+            this.visible = false;
+            this.$emit("refreshDataList");
+          });
+          return;
+        }
+        // 添加的提交
+        this.urlOptions.createURL(this.dataForm).then(response => {
+          this.$modal.msgSuccess("新增成功");
+          this.visible = false;
+          this.$emit("refreshDataList");
+        });
+      });
+    },
+    /** 清空form */
+    formClear() {
+      if (this.$refs.dataForm!==undefined) {
+          this.$refs.dataForm.resetFields();
+      }
+    }
+  }
+}

src/mixins/basic-page.js

@@ -0,0 +1,128 @@
+/*
+ * @Author: zwq
+ * @Date: 2022-08-24 11:19:43
+ * @LastEditors: zwq
+ * @LastEditTime: 2025-02-21 13:18:46
+ * @Description:
+ */
+export default {
+  data() {
+    /* eslint-disable */
+    return {
+      urlOptions: {
+        getDataListURL: '', //获取table接口
+        deleteURL: '', //删除接口
+        exportURL: '' //导出接口
+      },
+      tableData: [], //table数据
+      listQuery: { //分页
+        pageSize: 20,
+        pageNo: 1,
+        total: 1,
+      },
+      exportLoading: false, //导出完成的加载状态是否开启
+      dataListLoading: false, //获取table的加载状态是否开启
+      addOrEditTitle: '', //dialog的title
+      addOrUpdateVisible: false, //dialog状态
+    }
+  },
+  created() {
+  },
+  mounted() {
+    this.getDataList()
+  },
+  methods: {
+    // 获取数据列表
+    getDataList() {
+      this.dataListLoading = true;
+      this.urlOptions.getDataListURL(this.listQuery).then(response => {
+        this.tableData = response.data.list;
+        this.listQuery.total = response.data.total;
+        this.dataListLoading = false;
+      });
+    },
+    // 每页数
+    sizeChangeHandle(val) {
+      this.listQuery.pageSize = val;
+      this.listQuery.pageNo = 1;
+      this.getDataList();
+    },
+    // 当前页
+    currentChangeHandle(val) {
+      this.listQuery.pageNo = val;
+      this.getDataList();
+    },
+    // 新增
+    addOrUpdateHandle(id) {
+      this.addOrEditTitle = "新增";
+      this.addOrUpdateVisible = true;
+      this.$nextTick(() => {
+        this.$refs.addOrUpdate.init(id);
+      });
+    },
+    //tableBtn点击
+    handleClick(val) {
+      if (val.type === "edit") {
+        this.addOrUpdateVisible = true;
+        this.addOrEditTitle = "编辑";
+        this.$nextTick(() => {
+          this.$refs.addOrUpdate.init(val.data.id);
+        });
+      } else if (val.type === "delete") {
+        this.deleteHandle(val.data.id, val.data.name, val.data._pageIndex)
+      } else {
+        this.otherMethods(val)
+      }
+    },
+    // 删除
+    deleteHandle(id, name, index) {
+      this.$confirm(`是否确认删除${name ? '名称为"' + name + '"' : '序号为"' + index + '"'}的数据项?`, "系统提示", {
+        confirmButtonText: "确定",
+        cancelButtonText: "取消",
+        type: "warning",
+      })
+        .then(() => {
+          this.urlOptions.deleteURL(id).then(({ data }) => {
+            this.$message({
+              message: "操作成功",
+              type: "success",
+              duration: 1500,
+              onClose: () => {
+                this.getDataList();
+              },
+            });
+          });
+        })
+        .catch(() => { });
+    },
+    // dialog取消
+    handleCancel() {
+      this.$refs.addOrUpdate.formClear()
+      this.addOrUpdateVisible = false
+      this.addOrEditTitle = ''
+    },
+    // dialog确定
+    handleConfirm() {
+      this.$refs.addOrUpdate.dataFormSubmit()
+    },
+    // dialog的父组件方法this.$emit("refreshDataList");
+    successSubmit() {
+      this.handleCancel()
+      this.getDataList()
+    },
+    /** 导出按钮操作 */
+    handleExport() {
+      // 处理查询参数
+      let params = { ...this.queryParams };
+      params.pageNo = undefined;
+      params.pageSize = undefined;
+      this.$modal.confirm('是否确认导出所有数据项?').then(() => {
+        this.exportLoading = true;
+        return this.urlOptions.exportURL(params);
+      }).then(response => {
+        this.$download.excel(response, '报表.xls');
+        this.exportLoading = false;
+      }).catch(() => { });
+    }
+  }
+}

src/mixins/lb/tableHeightMixin.js

@@ -0,0 +1,20 @@
+export default {
+	data() {
+		return {
+			tableH: this.tableHeight(260),
+		};
+	},
+	created() {
+		this.tableH = this?.heightNum ? this.tableHeight(this.heightNum) : this.tableHeight(260);
+		window.addEventListener('resize', this._setTableHeight);
+	},
+	destroyed() {
+		window.removeEventListener('resize', this._setTableHeight);
+	},
+	methods: {
+		_setTableHeight() {
+			this.tableH = this?.heightNum ? this.tableHeight(this.heightNum) : this.tableHeight(260);
+			// this.tableH = this.tableHeight(260);
+		},
+	},
+};

src/router/index.js

@@ -70,17 +70,44 @@ export const constantRoutes = [
     hidden: true
   },
   {
-    path: '/',
+    path: '/allDashboard-model',
+    component: (resolve) => require(['@/views/dashboard/allDashboard/index-model'], resolve),
+    hidden: true
+  },
+  {
+    path: '/rawDashboard-model',
+    component: (resolve) => require(['@/views/dashboard/rawDashboard/index-model'], resolve),
+    hidden: true
+  },
+  {
+    path: '/deepDashboard-model',
+    component: (resolve) => require(['@/views/dashboard/deepDashboard/index-model'], resolve),
+    hidden: true
+  },
+  {
+    path: '/coldDashboard-model',
+    component: (resolve) => require(['@/views/dashboard/coldDashboard/index-model'], resolve),
+    hidden: true
+  },
+  {
+    path: "",
     component: Layout,
-    redirect: 'core/base/factory',
+    redirect: "index",
-    // children: [{
+    children: [
-    //   path: 'index',
+      {
-    //   redirect: 'core/base/factory',
+        path: "index",
-    //   component: (resolve) => require(['@/views/index'], resolve),
+        component: (resolve) => require(["@/views/cost/index"], resolve),
-    //   name: '首页',
+        name: "首页",
-    //   meta: { title: '首页', icon: 'dashboard', affix: true }
+        meta: { title: "首页", icon: "dashboard", affix: true },
-    // }
+      },
-    // ]
+      {
+        path: "indexDetail",
+        component: (resolve) => require(["@/views/cost/indexDetail"], resolve),
+        name: "首页详细",
+        meta: { title: "首页详细", icon: "dashboard"},
+        hidden: true
+      },
+    ],
   },
   {
     path: '/user',

src/utils/ruoyi.js

@@ -48,6 +48,50 @@ export function parseTime(time, pattern) {
   return time_str
 }
 
+// 日期格式化(仅适用表格)
+export function parseTimeTable(pattern) {
+  return function(time){
+    if (arguments.length === 0 || !time) {
+      return null
+    }
+    const format = pattern || '{y}-{m}-{d} {h}:{i}:{s}'
+    let date
+    if (typeof time === 'object') {
+      date = time
+    } else {
+      if ((typeof time === 'string') && (/^[0-9]+$/.test(time))) {
+        time = parseInt(time)
+      } else if (typeof time === 'string') {
+        time = time.replace(new RegExp(/-/gm), '/').replace('T', ' ').replace(new RegExp(/\.\d{3}/gm),'');
+      }
+      if ((typeof time === 'number') && (time.toString().length === 10)) {
+        time = time * 1000
+      }
+      date = new Date(time)
+    }
+    const formatObj = {
+      y: date.getFullYear(),
+      m: date.getMonth() + 1,
+      d: date.getDate(),
+      h: date.getHours(),
+      i: date.getMinutes(),
+      s: date.getSeconds(),
+      a: date.getDay()
+    }
+    const time_str = format.replace(/{([ymdhisa])+}/g, (result, key) => {
+      let value = formatObj[key]
+      // Note: getDay() returns 0 on Sunday
+      if (key === 'a') {
+        return ['日', '一', '二', '三', '四', '五', '六'][value]
+      }
+      if (result.length > 0 && value < 10) {
+        value = '0' + value
+      }
+      return value || 0
+    })
+    return time_str
+  }
+}
 // 表单重置
 export function resetForm(refName) {
   if (this.$refs[refName]) {

src/views/Environmental/Envi-yure-log.vue

@@ -0,0 +1,121 @@
+<!--
+ * @Author: zwq
+ * @Date: 2024-11-13 14:01:16
+ * @LastEditors: zwq
+ * @LastEditTime: 2025-02-21 14:32:08
+ * @Description:
+-->
+<template>
+	<div>
+		<div class="app-container">
+			<!-- 搜索工作栏 -->
+			<search-bar
+				:formConfigs="formConfig"
+				ref="searchBarForm"
+				@headBtnClick="buttonClick" />
+			<!-- 列表 -->
+			<base-table
+				:page="listQuery.pageNo"
+				:limit="listQuery.pageSize"
+				:table-props="tableProps"
+				:table-data="tableData"
+				:max-height="tableH" />
+			<pagination
+				:page.sync="listQuery.pageNo"
+				:limit.sync="listQuery.pageSize"
+				:total="listQuery.total"
+				@pagination="getDataList" />
+		</div>
+	</div>
+</template>
+
+<script>
+import basicPage from '@/mixins/basic-page';
+import { yurepage } from '@/api/environmental/environmentalLog';
+import { parseTime } from '@/filter/code-filter';
+import tableHeightMixin from '@/mixins/lb/tableHeightMixin';
+
+const tableProps = [
+	{
+		prop: 'recordTime',
+		label: '记录时间',
+		filter: parseTime,
+	},
+	{
+		prop: 'remark',
+		label: '备注',
+	},
+	{
+		prop: 'usingQuantity',
+		label: '发电量',
+    filter: (val) => (val != null ? Number(val).toFixed(3) : '-'),
+	},
+];
+export default {
+	name: '',
+	mixins: [basicPage, tableHeightMixin],
+	data() {
+		return {
+			urlOptions: {
+				getDataListURL: yurepage,
+			},
+			formConfig: [
+				{
+					type: 'datePicker',
+					label: '时间',
+					dateType: 'datetimerange',
+					format: 'yyyy-MM-dd HH:mm:ss',
+					valueFormat: 'yyyy-MM-dd HH:mm:ss',
+					rangeSeparator: '-',
+					startPlaceholder: '开始时间',
+					endPlaceholder: '结束时间',
+					width: 350,
+					param: 'searchTime',
+					clearable: false,
+				},
+				{
+					type: 'button',
+					btnName: '查询',
+					name: 'search',
+					color: 'primary',
+				},
+			],
+			listQuery: {
+				statisticType: 1,
+			},
+			tableProps,
+			tableData: [],
+		};
+	},
+	components: {},
+	created() {
+		const end = new Date();
+		const start = new Date();
+		this.listQuery.startTime = parseTime(start).substr(0, 10) + ' 00:00:00';
+		this.listQuery.endTime = parseTime(end).substr(0, 10) + ' 23:59:59';
+		this.$nextTick(() => {
+			this.$refs.searchBarForm.formInline.searchTime = [
+				this.listQuery.startTime,
+				this.listQuery.endTime,
+			];
+		});
+	},
+	methods: {
+		buttonClick(val) {
+			switch (val.btnName) {
+				case 'search':
+					this.listQuery.pageNo = 1;
+					this.listQuery.pageSize = 20;
+					this.listQuery.statisticType = 1;
+					this.listQuery.startTime = val.searchTime ? val.searchTime[0] : null;
+					this.listQuery.endTime = val.searchTime ? val.searchTime[1] : null;
+					this.getDataList();
+					break;
+				default:
+					console.log(val);
+			}
+		},
+	},
+};
+</script>
+<style lang="scss"></style>

src/views/Environmental/Environmental-log.vue

@@ -0,0 +1,131 @@
+<!--
+ * @Author: zwq
+ * @Date: 2024-11-13 14:01:16
+ * @LastEditors: zwq
+ * @LastEditTime: 2025-02-21 14:31:00
+ * @Description:
+-->
+<template>
+	<div>
+		<div class="app-container">
+			<!-- 搜索工作栏 -->
+			<search-bar
+				:formConfigs="formConfig"
+				ref="searchBarForm"
+				@headBtnClick="buttonClick" />
+			<!-- 列表 -->
+			<base-table
+				:page="listQuery.pageNo"
+				:limit="listQuery.pageSize"
+				:table-props="tableProps"
+				:table-data="tableData"
+				:max-height="tableH" />
+			<pagination
+				:page.sync="listQuery.pageNo"
+				:limit.sync="listQuery.pageSize"
+				:total="listQuery.total"
+				@pagination="getDataList" />
+		</div>
+	</div>
+</template>
+
+<script>
+import basicPage from '@/mixins/basic-page';
+import { getCostEnviHisPage } from '@/api/environmental/environmentalLog';
+import { parseTime } from '@/filter/code-filter';
+import tableHeightMixin from '@/mixins/lb/tableHeightMixin';
+
+const tableProps = [
+	{
+		prop: 'recTime',
+		label: '记录时间',
+		filter: parseTime,
+	},
+	{
+		prop: 'remark',
+		label: '备注',
+	},
+	{
+		prop: 'envi1',
+		label: '二氧化硫mg/Nm3',
+		filter: (val) => (val != null ? Number(val).toFixed(2) : '-'),
+	},
+	{
+		prop: 'envi2',
+		label: '氮氧化物mg/Nm3',
+		filter: (val) => (val != null ? Number(val).toFixed(2) : '-'),
+	},
+	{
+		prop: 'envi3',
+		label: '粉尘mg/Nm3',
+		filter: (val) => (val != null ? Number(val).toFixed(2) : '-'),
+	},
+];
+export default {
+	name: '',
+	mixins: [basicPage, tableHeightMixin],
+	data() {
+		return {
+			urlOptions: {
+				getDataListURL: getCostEnviHisPage,
+			},
+			formConfig: [
+				{
+					type: 'datePicker',
+					label: '时间',
+					dateType: 'datetimerange',
+					format: 'yyyy-MM-dd HH:mm:ss',
+					valueFormat: 'yyyy-MM-dd HH:mm:ss',
+					rangeSeparator: '-',
+					startPlaceholder: '开始时间',
+					endPlaceholder: '结束时间',
+					width: 350,
+					param: 'searchTime',
+					clearable: false,
+				},
+				{
+					type: 'button',
+					btnName: '查询',
+					name: 'search',
+					color: 'primary',
+				},
+			],
+			listQuery: {
+				statisticType: 1,
+			},
+			tableProps,
+			tableData: [],
+		};
+	},
+	components: {},
+	created() {
+		const end = new Date();
+		const start = new Date();
+		this.listQuery.startTime = parseTime(start).substr(0, 10) + ' 00:00:00';
+		this.listQuery.endTime = parseTime(end).substr(0, 10) + ' 23:59:59';
+		this.$nextTick(() => {
+			this.$refs.searchBarForm.formInline.searchTime = [
+				this.listQuery.startTime,
+				this.listQuery.endTime,
+			];
+		});
+	},
+	methods: {
+		buttonClick(val) {
+			switch (val.btnName) {
+				case 'search':
+					this.listQuery.pageNo = 1;
+					this.listQuery.pageSize = 20;
+					this.listQuery.statisticType = 1;
+					this.listQuery.startTime = val.searchTime ? val.searchTime[0] : null;
+					this.listQuery.endTime = val.searchTime ? val.searchTime[1] : null;
+					this.getDataList();
+					break;
+				default:
+					console.log(val);
+			}
+		},
+	},
+};
+</script>
+<style lang="scss"></style>

src/views/base/dataBoard/index.vue

@@ -6,7 +6,9 @@
 -->
 
 <template>
-	<div ref="dataBoard" class=""></div>
+	<div ref="dataBoard" class="data-board">
+		<el-button type="text" @click="goback" class="go-back--btn">返回</el-button>
+	</div>
 </template>
 
 <script>
@@ -24,39 +26,42 @@ export default {
 			mainFooter: null, // dom
 		};
 	},
-	mounted() {
+	// mounted() {
-		this.$nextTick(() => {
+	// 	this.$nextTick(() => {
-			this.modify();
+	// 		this.modify();
-		});
+	// 	});
-	},
+	// },
-	activated() {
+	// activated() {
-		this.modify();
+	// 	this.modify();
-	},
+	// },
-	deactivated() {
+	// deactivated() {
-		this.recover();
+	// 	this.recover();
-	},
+	// },
-	beforeDestroy() {
+	// beforeDestroy() {
-		this.recover();
+	// 	this.recover();
-	},
+	// },
 	methods: {
-		modify() {
+		// modify() {
-			// 在这个页面临时修改下父类的margin，结束时需还原
+		// 	// 在这个页面临时修改下父类的margin，结束时需还原
-			this.appMain = document.querySelector('.app-main');
+		// 	this.appMain = document.querySelector('.app-main');
-			// this.appMain.style.minHeight = 'calc(100vh - 90px)';
+		// 	// this.appMain.style.minHeight = 'calc(100vh - 90px)';
-			this.appMain.style.margin = 0;
+		// 	this.appMain.style.margin = 0;
-			// 在这个页面临时删除 main-footer 元素，结束时需还原
+		// 	// 在这个页面临时删除 main-footer 元素，结束时需还原
-			// this.mainFooter = document.querySelector('.main-footer').cloneNode(true);
+		// 	// this.mainFooter = document.querySelector('.main-footer').cloneNode(true);
-			// document.querySelector('.main-footer').remove();
+		// 	// document.querySelector('.main-footer').remove();
-            this.$refs.dataBoard.classList.add('data-board');
+        //     this.$refs.dataBoard.classList.add('data-board');
-		},
+		// },
-		recover() {
+		// recover() {
-            this.$refs.dataBoard.classList.remove('data-board');
+        //     this.$refs.dataBoard.classList.remove('data-board');
-			this.$nextTick(() => {
+		// 	this.$nextTick(() => {
-				this.appMain.style.margin = this.parentStyle.margin;
+		// 		this.appMain.style.margin = this.parentStyle.margin;
-				// this.appMain.style.minHeight = this.parentStyle.minHeight;
+		// 		// this.appMain.style.minHeight = this.parentStyle.minHeight;
-				// this.appMain.insertAdjacentElement('afterend', this.mainFooter);
+		// 		// this.appMain.insertAdjacentElement('afterend', this.mainFooter);
-			});
+		// 	});
-		},
+		// },
+		goback() {
+			this.$router.go(-1);
+		}
 	},
 };
 </script>
@@ -71,4 +76,25 @@ export default {
 	background: url('../../../assets/images/DataBoard.png') 100% 100% / contain
 		no-repeat;
 }
+
+.go-back--btn {
+	position: fixed;
+	top: 28px;
+	left: 24px;
+	color: #fff;
+	font-size: 18px;
+	letter-spacing: 6px;
+
+	&:hover {
+		text-decoration: underline;
+	}
+
+	&::after {
+		content: "\2BAA";
+		position: absolute;
+		top: 6px;
+		right: -26px;
+		font-size: 24px;
+	}
+}
 </style>

src/views/base/equipmentBindGroup/components/BasicDrawer.vue

@@ -1,8 +1,8 @@
-<!-- 
+<!--
     filename: EquipmentDrawer.vue
     author: liubin
     date: 2023-08-22 14:38:56
-    description: 
+    description:
 -->
 
 <template>
@@ -320,7 +320,7 @@ export default {
 
 		// 新增属性
 		handleAddAttr() {
-			if (!this.dataId) return this.$message.error('请先创建设备分组信息');
+			if (!this.dataId) return this.$message.warning('请先创建设备分组信息');
 			this.attrForm = {
 				id: null,
 				equipmentGroupId: this.dataId,

src/views/base/equipmentBindGroup/index.vue

@@ -38,7 +38,7 @@
 			@close="cancel"
 			@cancel="cancel"
 			@confirm="submitForm">
-			<DialogForm v-if="open" ref="form" :dataForm="form" :rows="rows" />
+			<DialogForm v-if="open" ref="form" v-model="form" :rows="rows" />
 		</base-dialog>
 
 		<!-- 抽屉 详情 -->

src/views/base/equipmentGroup/components/BasicDrawer.vue

@@ -1,8 +1,8 @@
-<!-- 
+<!--
     filename: EquipmentDrawer.vue
     author: liubin
     date: 2023-08-22 14:38:56
-    description: 
+    description:
 -->
 
 <template>
@@ -36,7 +36,7 @@
 							v-if="showForm"
 							ref="form"
 							:disabled="mode.includes('detail')"
-							:dataForm="form"
+							v-model="form"
 							:rows="formRows" />
 					</div>
 
@@ -320,7 +320,7 @@ export default {
 
 		// 新增属性
 		handleAddAttr() {
-			if (!this.dataId) return this.$message.error('请先创建设备分组信息');
+			if (!this.dataId) return this.$message.warning('请先创建设备分组信息');
 			this.attrForm = {
 				id: null,
 				equipmentGroupId: this.dataId,

src/views/base/equipmentGroup/index.vue

@@ -38,7 +38,7 @@
 			@close="cancel"
 			@cancel="cancel"
 			@confirm="submitForm">
-			<DialogForm v-if="open" ref="form" :dataForm="form" :rows="rows" />
+			<DialogForm v-if="open" ref="form" v-model="form" :rows="rows"/>
 		</base-dialog>
 
 		<!-- 抽屉 详情 -->

src/views/base/equipmentGroupAlarm/index.vue

@@ -280,7 +280,7 @@ export default {
 		/** 新增按钮操作 */
 		handleAdd() {
 			if (this.queryParams.equipmentGroupId == null)
-				return this.$message.error('没有检测到设备分组信息');
+				return this.$message.warning('没有检测到设备分组信息');
 			this.reset();
 			this.open = true;
 			this.title = '添加设备分组报警明细';

src/views/base/equipmentPlc/index.vue

@@ -38,7 +38,7 @@
 			@close="cancel"
 			@cancel="cancel"
 			@confirm="submitForm">
-			<DialogForm v-if="open" ref="form" :dataForm="form" :rows="rows" />
+			<DialogForm v-if="open" ref="form" v-model="form" :rows="rows" />
 		</base-dialog>
 	</div>
 </template>

src/views/base/equipmentPlcConnect/TableConfig.vue

@@ -0,0 +1,388 @@
+<!-- 
+    filename: TableConfig.vue
+    author: liubin
+    date: 2023-10-30 10:09:03
+    description: 
+-->
+
+<template>
+	<div class="app-container">
+		<!-- 搜索工作栏 -->
+		<SearchBar
+			:formConfigs="searchBarFormConfig"
+			ref="search-bar"
+			@headBtnClick="handleSearchBarBtnClick" />
+
+		<!-- 列表 -->
+		<base-table
+			:table-props="tableProps"
+			:page="queryParams.pageNo"
+			:limit="queryParams.pageSize"
+			:table-data="list"
+			ref="pageTable"
+			@emitFun="handleEmitFun"
+			:max-height="tableH">
+			<method-btn
+				v-if="tableBtn.length"
+				slot="handleBtn"
+				label="操作"
+				:method-list="tableBtn"
+				@clickBtn="handleTableBtnClick" />
+		</base-table>
+
+		<!-- 分页组件 -->
+		<pagination
+			v-show="total > 0"
+			:total="total"
+			:page.sync="queryParams.pageNo"
+			:limit.sync="queryParams.pageSize"
+			@pagination="getList" />
+
+		<!-- 对话框(添加 / 修改) -->
+		<base-dialog
+			:dialogTitle="title"
+			:dialogVisible="open"
+			width="700px"
+			@close="cancel"
+			@cancel="cancel"
+			@confirm="submitForm">
+			<DialogForm v-if="open" ref="form" v-model="form" :rows="rows" />
+		</base-dialog>
+	</div>
+</template>
+
+<script>
+import {
+	createEquipmentPlc,
+	updateEquipmentPlc,
+	deleteEquipmentPlc,
+	getEquipmentPlc,
+	getEquipmentPlcPage,
+	exportEquipmentPlcExcel,
+} from '@/api/base/equipmentPlc';
+import basicPageMixin from '@/mixins/lb/basicPageMixin';
+import tableHeightMixin from '@/mixins/lb/tableHeightMixin';
+
+const switchBtn = {
+	name: 'SwitchBtn',
+	props: ['injectData'],
+	data() {
+		return {};
+	},
+	computed: {
+		active() {
+			return +this.injectData[this.injectData.prop] == 1 ? true : false;
+		},
+	},
+	methods: {},
+	render: function (h) {
+		return h(
+			'el-switch',
+			{
+				props: {
+					value: this.active,
+				},
+				on: {
+					change: (newVal) => {
+						this.$emit('emitData', {
+							action: 'update-collect',
+							payload: {
+								...this.injectData,
+								collection: newVal ? 1 : 0,
+							},
+						});
+					},
+				},
+			},
+			null
+		);
+	},
+};
+
+export default {
+	name: 'EquipmentPlc',
+	mixins: [basicPageMixin, tableHeightMixin],
+	components: {},
+	data() {
+		return {
+			tableKey: Math.random(),
+			searchBarKeys: ['name', 'plcTableName'],
+			tableBtn: [
+				this.$auth.hasPermiAnd([
+					'base:equipment-plc:update',
+					'base:equipment-plc:query'
+					])
+					? {
+							type: 'edit',
+							btnName: '修改',
+					  }
+					: undefined,
+				this.$auth.hasPermi('base:equipment-plc:delete')
+					? {
+							type: 'delete',
+							btnName: '删除',
+					  }
+					: undefined,
+			].filter((v) => v),
+			tableProps: [
+				// {
+				// 	prop: 'createTime',
+				// 	label: '添加时间',
+				// 	fixed: true,
+				// 	width: 180,
+				// 	filter: (val) => moment(val).format('yyyy-MM-DD HH:mm:ss'),
+				// },
+				{ prop: 'code', label: '编码', width: 180, showOverflowtooltip: true },
+				{ prop: 'plcTableName', label: '关联表名', width: 150, showOverflowtooltip: true },
+				{ prop: 'name', label: '标识名称', width: 150, showOverflowtooltip: true },
+				{ prop: 'enName', label: '英文名称', width: 150, showOverflowtooltip: true },
+				{
+					prop: 'collection',
+					label: '是否采集',
+					subcomponent: switchBtn,
+				},
+				{ prop: 'description', label: '描述', minWidth: 150, showOverflowtooltip: true },
+			],
+			searchBarFormConfig: [
+				{
+					type: 'input',
+					label: '表名',
+					placeholder: '请输入表名',
+					param: 'plcTableName',
+				},
+				{
+					type: 'input',
+					label: '标识',
+					placeholder: '请输入标识',
+					param: 'name',
+				},
+				{
+					type: 'button',
+					btnName: '查询',
+					name: 'search',
+					color: 'primary',
+				},
+				{
+					type: this.$auth.hasPermi('base:equipment-plc:create')
+						?  'separate' : '',
+				},
+				{
+					type: this.$auth.hasPermi('base:equipment-plc:create')
+						? 'button' : '',
+					btnName: '新增',
+					name: 'add',
+					plain: true,
+					color: 'success',
+				},
+				// {
+				// 	type: this.$auth.hasPermi('equipment:realtime-table-config:export') ? 'button' : '',
+				// 	btnName: '导出',
+				// 	name: 'export',
+				// 	color: 'warning',
+				// },
+			],
+			rows: [
+				[
+					{
+						input: true,
+						label: '关联表名',
+						prop: 'plcTableName',
+						rules: [{ required: true, message: '关联表名不能为空', trigger: 'blur' }],
+						// bind: {
+						// 	disabled: true, // some condition, like detail mode...
+						// }
+					},
+					{
+						input: true,
+						label: '编码',
+						prop: 'code',
+						url: '/base/energy-plc/getCode',
+						rules: [{ required: true, message: '编码不能为空', trigger: 'blur' }],
+					},
+				],
+				[
+					{
+						input: true,
+						label: '标识',
+						prop: 'name',
+						rules: [{ required: true, message: '标识不能为空', trigger: 'blur' }],
+						// bind: {
+						// 	disabled: true, // some condition, like detail mode...
+						// }
+					},
+					{
+						input: true,
+						label: '英文名',
+						prop: 'enName',
+					},
+				],
+				[
+					{
+						switch: true,
+						label: '是否采集', // 是否采集 0 代表不采集, 1 代表采集
+						prop: 'collection',
+						bind: {
+              'active-value': 1,
+							'inactive-value': 0,
+              value: 1,
+						},
+					},
+				],
+				[
+					{
+						textarea: true,
+						label: '描述',
+						prop: 'description',
+						bind: {
+							placeholder: '请输入备注',
+						},
+					},
+				],
+			],
+			// 是否显示弹出
+			open: false,
+			// 查询参数
+			queryParams: {
+				pageNo: 1,
+				pageSize: 20,
+				plcTableName: null,
+				name: null,
+			},
+			// 表单参数
+			form: {},
+		};
+	},
+	created() {
+		this.getList();
+	},
+	methods: {
+		/** 覆盖 handleEmitFun 的默认实现 */
+		handleEmitFun({ action, payload }) {
+			switch (action) {
+				case 'update-collect':
+					this.reset();
+					const tempForm = {};
+					Object.keys(this.form).forEach((key) => {
+						tempForm[key] = payload[key];
+					});
+					updateEquipmentPlc(tempForm).then((response) => {
+						this.$modal.msgSuccess('修改成功');
+						this.open = false;
+						this.getList();
+					});
+					break;
+			}
+		},
+		/** 查询列表 */
+		getList() {
+			this.loading = true;
+			// 执行查询
+			getEquipmentPlcPage(this.queryParams).then((response) => {
+				this.list = response.data.list;
+				this.total = response.data.total;
+				this.loading = false;
+				// this.tableKey = Math.random(); // method 1
+			});
+		},
+		/** 取消按钮 */
+		cancel() {
+			this.open = false;
+			this.reset();
+		},
+		/** 表单重置 */
+		reset() {
+			this.form = {
+				id: undefined,
+				plcTableName: undefined,
+				code: undefined,
+				name: undefined,
+				enName: undefined,
+				description: undefined,
+				collection: 1,
+			};
+			this.resetForm('form');
+		},
+		/** 搜索按钮操作 */
+		handleQuery() {
+			this.queryParams.pageNo = 1;
+			this.getList();
+		},
+		/** 重置按钮操作 */
+		resetQuery() {
+			this.resetForm('queryForm');
+			this.handleQuery();
+		},
+		/** 新增按钮操作 */
+		handleAdd() {
+			this.reset();
+			this.open = true;
+			this.title = '添加实时数据采集配置';
+		},
+		/** 修改按钮操作 */
+		handleUpdate(row) {
+			this.reset();
+			const id = row.id;
+			getEquipmentPlc(id).then((response) => {
+				this.form = response.data;
+				this.open = true;
+				this.title = '修改实时数据采集配置';
+			});
+		},
+		/** 提交按钮 */
+		submitForm() {
+			this.$refs['form'].validate((valid) => {
+				if (!valid) {
+					return;
+				}
+				// 修改的提交
+				if (this.form.id != null) {
+					updateEquipmentPlc(this.form).then((response) => {
+						this.$modal.msgSuccess('修改成功');
+						this.open = false;
+						this.getList();
+					});
+					return;
+				}
+				// 添加的提交
+				createEquipmentPlc(this.form).then((response) => {
+					this.$modal.msgSuccess('新增成功');
+					this.open = false;
+					this.getList();
+				});
+			});
+		},
+		/** 删除按钮操作 */
+		handleDelete(row) {
+			const id = row.id;
+			this.$modal
+				.confirm('是否确认删除该配置?')
+				.then(function () {
+					return deleteEquipmentPlc(id);
+				})
+				.then(() => {
+					this.getList();
+					this.$modal.msgSuccess('删除成功');
+				})
+				.catch(() => {});
+		},
+		/** 导出按钮操作 */
+		handleExport() {
+			// 处理查询参数
+			let params = { ...this.queryParams };
+			params.pageNo = undefined;
+			params.pageSize = undefined;
+			this.$modal
+				.confirm('是否确认导出所有实时数据采集配置数据项?')
+				.then(() => {
+					this.exportLoading = true;
+					return exportEquipmentPlcExcel(params);
+				})
+				.then((response) => {
+					this.$download.excel(response, '实时数据采集配置.xls');
+					this.exportLoading = false;
+				})
+				.catch(() => {});
+		},
+	},
+};
+</script>

src/views/base/equipmentPlcConnect/add-or-updata.vue

@@ -0,0 +1,151 @@
+<!--
+ * @Author: zwq
+ * @Date: 2021-11-18 14:16:25
+ * @LastEditors: zwq
+ * @LastEditTime: 2024-04-30 10:01:41
+ * @Description:
+-->
+<template>
+	<el-form
+		:model="dataForm"
+		:rules="dataRule"
+		ref="dataForm"
+		@keyup.enter.native="dataFormSubmit()"
+		label-width="100px">
+		<el-form-item label="设备" prop="equipmentId">
+			<el-cascader
+				placeholder="请选择设备"
+				v-model="dataForm.equipmentId"
+				:options="plLineList"
+				:props="{value: 'id', label: 'name', children: 'children'}"
+				style="width: 100%"
+				filterable />
+		</el-form-item>
+		<el-form-item label="关联表名" prop="plcId">
+			<el-select
+				v-model="dataForm.plcId"
+				filterable
+				placeholder="请选择关联表"
+				style="width: 100%">
+				<el-option
+					v-for="dict in plcList"
+					:key="dict.id"
+					:label="dict.plcTableName"
+					:value="dict.id" />
+			</el-select>
+		</el-form-item>
+	</el-form>
+</template>
+
+<script>
+import basicAdd from './components/basic-add';
+import { createEquipmentPlcConnect, updateEquipmentPlcConnect } from '@/api/base/equipmentPlcConnect';
+import { getplcAllList, getTree } from "@/api/base/equipmentConfig";
+
+export default {
+	mixins: [basicAdd],
+	data() {
+		return {
+			urlOptions: {
+				createURL: createEquipmentPlcConnect,
+				updateURL: updateEquipmentPlcConnect,
+			},
+			dataForm: {
+        id: undefined,
+        equipmentId: undefined,
+        plcId: undefined
+			},
+			plcList: [],
+			plLineList: [],
+			dataRule: {
+        equipmentId: [{ required: true, message: "设备不能为空", trigger: "blur" }],
+				plcId: [{ required: true, message: "关联表名不能为空", trigger: "blur" }]
+      },
+			options: [{
+          value: 'zhinan',
+          label: '指南',
+          children: [{
+            value: 'shejiyuanze',
+            label: '设计原则',
+            children: [{
+              value: 'yizhi',
+              label: '一致'
+            }, {
+              value: 'fankui',
+              label: '反馈'
+            }, {
+              value: 'xiaolv',
+              label: '效率'
+            }, {
+              value: 'kekong',
+              label: '可控'
+            }]
+          }, {
+            value: 'daohang',
+            label: '导航'
+          }]
+        }]
+		};
+	},
+	created() {
+		this.getDict()
+	},
+	methods: {
+		init() {
+			this.$nextTick(() => {
+				this.$refs['dataForm'].resetFields()
+			})
+		},
+		async getDict() {
+			// 关联表名列表
+			const res = await getplcAllList();
+			this.plcList = res.data;
+			// 树形结构
+			const res1 = await getTree();
+			this.plLineList = res1.data;
+			// const res1 = await getCorePLList();
+			// this.plLineList = res1.data;
+			// this.plLineList.forEach(item => {
+			// 	listByParentId({ id: item.id }).then(resp => {
+			// 		if (resp.data.length > 0) {
+			// 			// item.children = resp.data
+			// 			this.$set(item, 'children', resp.data)
+			// 			// this.$forceUpdate()
+			// 		}
+			// 	})
+			// })
+		},
+		// 表单提交
+    dataFormSubmit() {
+      this.$refs["dataForm"].validate((valid) => {
+        if (!valid) {
+          return false;
+        }
+        // 修改的提交
+        if (this.dataForm.id) {
+          updateEquipmentPlcConnect({
+						id: this.dataForm.id,
+						equipmentId: this.dataForm.equipmentId[this.dataForm.equipmentId.length],
+						plcId: this.dataForm.plcId
+					}).then(response => {
+            this.$modal.msgSuccess("修改成功");
+            this.visible = false;
+            this.$emit("refreshDataList");
+          });
+          return;
+        }
+        // 添加的提交
+        createEquipmentPlcConnect({
+						id: this.dataForm.id,
+						equipmentId: this.dataForm.equipmentId[this.dataForm.equipmentId.length - 1],
+						plcId: this.dataForm.plcId
+					}).then(response => {
+          this.$modal.msgSuccess("新增成功");
+          this.visible = false;
+          this.$emit("refreshDataList");
+        });
+      });
+    }
+	}
+};
+</script>

src/views/base/equipmentPlcConnect/components-old/BasicDrawer.vue

@@ -0,0 +1,574 @@
+<!--
+    filename: EquipmentDrawer.vue
+    author: liubin
+    date: 2023-08-22 14:38:56
+    description:
+-->
+
+<template>
+	<el-drawer
+		:visible="visible"
+		:show-close="false"
+		:wrapper-closable="false"
+		class="drawer"
+		custom-class="mes-drawer"
+		size="60%"
+		@closed="$emit('destroy')">
+		<SmallTitle slot="title">
+			{{
+				mode.includes('detail')
+					? '详情'
+					: mode.includes('edit')
+					? '编辑'
+					: '新增'
+			}}
+		</SmallTitle>
+
+		<div class="drawer-body flex">
+			<div class="drawer-body__content">
+				<section v-for="(section, index) in sections" :key="section.key">
+					<SmallTitle v-if="index != 0">{{ section.name }}</SmallTitle>
+
+					<div class="form-part" v-if="section.key == 'base'">
+						<el-skeleton v-if="!showForm" animated />
+						<BaseInfoForm
+							key="drawer-dialog-form"
+							v-if="showForm"
+							ref="form"
+							:disabled="mode.includes('detail')"
+							v-model="form"
+							:rows="formRows" />
+					</div>
+
+					<div v-if="section.key == 'attrs'" style="margin-top: 12px">
+						<base-table
+							v-loading="attrListLoading"
+							:table-props="section.props"
+							:page="attrQuery?.params.pageNo || 1"
+							:limit="attrQuery?.params.pageSize || 10"
+							:table-data="list"
+							:add-button-show="mode.includes('detail') ? null : '添加属性'"
+							@emitButtonClick="handleAddAttr"
+							@emitFun="handleEmitFun">
+							<method-btn
+								v-if="section.tableBtn"
+								slot="handleBtn"
+								label="操作"
+								:method-list="tableBtn"
+								@clickBtn="handleTableBtnClick" />
+						</base-table>
+
+						<!-- 分页组件 -->
+						<pagination
+							v-show="total > 0"
+							:total="total"
+							:page.sync="attrQuery.params.pageNo"
+							:limit.sync="attrQuery.params.pageSize"
+							@pagination="getAttrList" />
+					</div>
+				</section>
+			</div>
+
+			<div class="drawer-body__footer">
+				<el-button style="" @click="handleCancel">取消</el-button>
+				<el-button v-if="mode == 'detail'" type="primary" @click="toggleEdit">
+					编辑
+				</el-button>
+				<el-button v-else type="primary" @click="handleCancel">确定</el-button>
+				<!-- sections的第二项必须是 属性列表  -->
+				<!-- <el-button
+						v-if="sections[1].allowAdd"
+						type="primary"
+						@click="handleAddAttr">
+						添加属性
+					</el-button> -->
+			</div>
+		</div>
+
+		<!-- 属性对话框 -->
+		<base-dialog
+			v-if="sections[1].allowAdd"
+			:dialogTitle="attrTitle"
+			:dialogVisible="attrFormVisible"
+			width="45%"
+			:append-to-body="true"
+			custom-class="baseDialog"
+			@close="closeAttrForm"
+			@cancel="closeAttrForm"
+			@confirm="submitAttrForm">
+			<DialogForm
+				v-if="attrFormVisible"
+				ref="attrForm"
+				:disabled="mode.includes('detail')"
+				v-model="attrForm"
+				:rows="attrRows" />
+		</base-dialog>
+	</el-drawer>
+</template>
+
+<script>
+import BaseInfoForm from '@/components/DialogForm';
+
+const SmallTitle = {
+	name: 'SmallTitle',
+	props: ['size'],
+	data() {
+		return {};
+	},
+	methods: {},
+	render: function (h) {
+		return h(
+			'span',
+			{
+				class: 'small-title',
+				style: {
+					fontSize: '18px',
+					lineHeight:
+						this.size == 'lg' ? '24px' : this.size == 'sm' ? '18px' : '20px',
+					fontWeight: 500,
+					fontFamily: '微软雅黑, Microsoft YaHei, Arial, Helvetica, sans-serif',
+				},
+			},
+			this.$slots.default
+		);
+	},
+};
+
+export default {
+	components: { SmallTitle, DialogForm: BaseInfoForm, BaseInfoForm },
+	props: ['sections', 'defaultMode', 'infoData'],
+	data() {
+		return {
+			mode: '',
+			visible: false,
+			showForm: false,
+			total: 0,
+			form: {},
+			list: [],
+			attrTitle: '',
+			attrForm: {
+				id: null,
+				name: '',
+				plcParamName: '',
+				unit: '',
+				collection: 1,
+				minValue: '',
+				maxValue: '',
+				defaultValue: '',
+				description: '',
+				remark: '',
+				alarmContent: '',
+				equipmentParamType: '',
+				productionParamType: '',
+			},
+			attrFormVisible: false,
+			attrRows: [
+				[
+					{
+						input: true,
+						label: '参数列名',
+						prop: 'plcParamName',
+						rules: [{ required: true, message: '不能为空', trigger: 'blur' }],
+					},
+					{
+						input: true,
+						label: '参数名称',
+						prop: 'name',
+						rules: [{ required: true, message: '不能为空', trigger: 'blur' }],
+					},
+				],
+				[
+					{
+						select: true,
+						label: '单位',
+						prop: 'unit',
+						options: this.getDictDatas(this.DICT_TYPE.UNIT_DICT),
+						// rules: [{ required: true, message: '不能为空', trigger: 'blur' }],
+					},
+					{
+						switch: true,
+						label: '是否采集',
+						prop: 'collection',
+						bind: {
+							'active-value': 1,
+							'inactive-value': 0,
+						},
+					},
+				],
+				[
+					{
+						select: true,
+						label: '设备参数类型',
+						prop: 'equipmentParamType',
+						options: [
+							{ label: '一般参数', value: 1 },
+							{ label: '工艺参数', value: 2 },
+							{ label: '报警参数', value: 3 },
+						],
+						rules: [
+							{
+								required: true,
+								message: '设备参数类型不能为空',
+								trigger: 'blur',
+							},
+						],
+					},
+					{
+						select: true,
+						label: '生产参数类型',
+						prop: 'productionParamType',
+						options: [
+							// { label: '进片数量', value: 1 },
+							// { label: '出片数量', value: 2 },
+							// { label: '破损数量', value: 3 },
+							// { label: '无类型', value: 4 },
+							{ label: '进口计数', value: 1 },
+							{ label: '出口计数', value: 2 },
+							{ label: '损耗计数', value: 3 },
+							{ label: '无类型', value: 4 },
+						],
+						rules: [
+							{
+								required: true,
+								message: '生产参数类型不能为空',
+								trigger: 'blur',
+							},
+						],
+					},
+				],
+				[
+					{
+						input: true,
+						label: '最小值',
+						prop: 'minValue',
+						rules: [
+							{
+								type: 'number',
+								message: '请输入正确的数字',
+								trigger: 'change',
+								transform: (val) => Number(val),
+							},
+						],
+					},
+					{
+						input: true,
+						label: '最大值',
+						prop: 'maxValue',
+						rules: [
+							{
+								required: false,
+							},
+							{
+								type: 'number',
+								message: '请输入正确的数字',
+								trigger: 'change',
+								transform: (val) => Number(val),
+							},
+						],
+						// rules: [{ required: true, message: '不能为空', trigger: 'blur' }],
+					},
+				],
+				[
+					{
+						input: true,
+						label: '标准值',
+						prop: 'defaultValue',
+						// rules: [{ required: true, message: '不能为空', trigger: 'blur' }],
+					},
+					{
+						input: true,
+						label: '描述',
+						prop: 'description',
+						// rules: [{ required: true, message: '不能为空', trigger: 'blur' }],
+					},
+				],
+				[
+					{
+						input: true,
+						label: '备注',
+						prop: 'remark',
+						// rules: [{ required: true, message: '不能为空', trigger: 'blur' }],
+					},
+				],
+			],
+			attrQuery: {
+				params: {
+					pageNo: 1,
+					pageSize: 10,
+				},
+			}, // 属性列表的请求
+			infoQuery: null, // 基本信息的请求
+			attrFormSubmitting: false,
+			attrListLoading: false,
+		};
+	},
+	computed: {
+		formRows() {
+			return this.sections[0].rows.map((row) => {
+				return row.map((col) => {
+					return {
+						...col,
+						bind: {
+							// 详情 模式下，禁用各种输入
+							// disabled: this.mode == 'detail',
+							disabled: true,
+						},
+					};
+				});
+			});
+		},
+		tableBtn() {
+			return this.mode == 'detail' ? [] : this.sections[1].tableBtn;
+		},
+	},
+	mounted() {
+		this.mode = this.defaultMode || 'detail';
+		for (const section of this.sections) {
+			// 请求具体信息
+			if ('url' in section) {
+				const query = {
+					url: section.url,
+					method: section.method || 'get',
+					params: section.queryParams || null,
+					data: section.data || null,
+				};
+				// debugger;
+				this.$axios(query).then(({ data }) => {
+					if (section.key == 'base') {
+						this.form = data;
+						this.showForm = true;
+						this.infoQuery = query;
+					} else if (section.key == 'attrs') {
+						this.attrQuery = query;
+						this.list = data.list;
+						this.total = data.total;
+					}
+				});
+			} else if (section.key == 'base') {
+				this.form = this.infoData;
+				this.showForm = true;
+			}
+		}
+	},
+	methods: {
+		handleTableBtnClick({ type, data }) {
+			switch (type) {
+				case 'edit':
+					this.handleEditAttr(data.id);
+					break;
+				case 'delete':
+					this.handleDeleteAttr(data.id);
+					break;
+			}
+		},
+
+		handleEmitFun(val) {
+			console.log('handleEmitFun', val);
+		},
+
+		init() {
+			this.visible = true;
+		},
+
+		async getAttrList() {
+			this.attrListLoading = true;
+			const res = await this.$axios(this.attrQuery);
+			if (res.code == 0) {
+				this.list = res.data.list;
+				this.total = res.data.total;
+			}
+			this.attrListLoading = false;
+		},
+
+		// 保存表单
+		handleSave() {
+			this.$refs['form'][0].validate(async (valid) => {
+				if (valid) {
+					const isEdit = this.mode == 'edit';
+					await this.$axios({
+						url: this.sections[0][isEdit ? 'urlUpdate' : 'urlCreate'],
+						method: isEdit ? 'put' : 'post',
+						data: this.form,
+					});
+					this.$modal.msgSuccess(`${isEdit ? '更新' : '创建'}成功`);
+					this.visible = false;
+					this.$emit('refreshDataList');
+				}
+			});
+		},
+
+		handleCancel() {
+			this.visible = false;
+		},
+
+		// 开启编辑
+		toggleEdit() {
+			this.mode = 'edit';
+		},
+
+		// 新增属性
+		handleAddAttr() {
+			this.attrForm = {
+				id: null,
+				name: '',
+				plcParamName: '',
+				unit: '',
+				collection: 1,
+				minValue: '',
+				maxValue: '',
+				defaultValue: '',
+				description: '',
+				remark: '',
+				alarmContent: '',
+			};
+			this.attrTitle = '添加设备绑定信息';
+			this.attrFormVisible = true;
+		},
+
+		// 编辑属性
+		async handleEditAttr(attrId) {
+			const res = await this.$axios({
+				url: this.sections[1].urlDetail,
+				method: 'get',
+				params: { id: attrId },
+			});
+			if (res.code == 0) {
+				this.attrForm = res.data;
+				this.attrTitle = '编辑设备绑定信息';
+				this.attrFormVisible = true;
+			}
+		},
+
+		// 删除属性
+		handleDeleteAttr(attrId) {
+			this.$confirm('确定删除该分组报警?', '提示', {
+				confirmButtonText: '确定',
+				cancelButtonText: '取消',
+				type: 'warning',
+			})
+				.then(async () => {
+					const res = await this.$axios({
+						url: this.sections[1].urlDelete,
+						method: 'delete',
+						params: { id: attrId },
+					});
+					if (res.code == 0) {
+						this.$message({
+							message: '删除成功',
+							type: 'success',
+							duration: 1500,
+							onClose: () => {
+								this.getAttrList();
+							},
+						});
+					}
+				})
+				.catch(() => {});
+		},
+
+		// 提交属性表
+		async submitAttrForm() {
+			this.$refs['attrForm'].validate((valid) => {
+				if (!valid) {
+          return false;
+				}
+			});
+			const isEdit = this.attrForm.id != null;
+			this.attrFormSubmitting = true;
+			const res = await this.$axios({
+				url: isEdit ? this.sections[1].urlUpdate : this.sections[1].urlCreate,
+				method: isEdit ? 'put' : 'post',
+				data: {
+					...this.attrForm,
+					connectId: this.infoData.id
+				},
+			});
+
+			if (res.code == 0) {
+				this.closeAttrForm();
+				this.$message({
+					message: `${isEdit ? '更新' : '创建'}成功`,
+					type: 'success',
+					duration: 1500,
+					onClose: () => {
+						this.getAttrList();
+					},
+				});
+			}
+			this.attrFormSubmitting = false;
+		},
+
+		closeAttrForm() {
+			this.attrFormVisible = false;
+		},
+
+		handleClick(raw) {
+			if (raw.type === 'delete') {
+				this.$confirm(`确定删除该报警?`, '提示', {
+					confirmButtonText: '确定',
+					cancelButtonText: '取消',
+					type: 'warning',
+				})
+					.then(() => {
+						deleteProductAttr(raw.data.id).then(({ data }) => {
+							this.$message({
+								message: '操作成功',
+								type: 'success',
+								duration: 1500,
+								onClose: () => {
+									this.getList();
+								},
+							});
+						});
+					})
+					.catch(() => {});
+			} else {
+				this.addNew(raw.data.id);
+			}
+		},
+	},
+};
+</script>
+
+<style scoped>
+.drawer >>> .el-drawer {
+	border-radius: 8px 0 0 8px;
+}
+
+.drawer >>> .el-drawer__header {
+	margin: 0;
+	padding: 32px 32px 24px;
+	border-bottom: 1px solid #dcdfe6;
+	margin-bottom: 0px;
+}
+
+.small-title::before {
+	content: '';
+	display: inline-block;
+	vertical-align: top;
+	width: 4px;
+	height: 22px;
+	border-radius: 1px;
+	margin-right: 8px;
+	background-color: #0b58ff;
+}
+
+.drawer-body {
+	display: flex;
+	flex-direction: column;
+	height: 100%;
+}
+
+.drawer-body__content {
+	flex: 1;
+	/* background: #eee; */
+	padding: 20px 30px;
+	overflow-y: auto;
+}
+
+.drawer-body__footer {
+	display: flex;
+	justify-content: flex-end;
+	padding: 18px;
+}
+</style>

src/views/base/equipmentPlcConnect/components/BasicDrawer.vue

@@ -1,8 +1,8 @@
-<!-- 
+<!--
     filename: EquipmentDrawer.vue
     author: liubin
     date: 2023-08-22 14:38:56
-    description: 
+    description:
 -->
 
 <template>
@@ -12,7 +12,7 @@
 		:wrapper-closable="false"
 		class="drawer"
 		custom-class="mes-drawer"
-		size="60%"
+		:size="size || '50%'"
 		@closed="$emit('destroy')">
 		<SmallTitle slot="title">
 			{{
@@ -29,29 +29,107 @@
 				<section v-for="(section, index) in sections" :key="section.key">
 					<SmallTitle v-if="index != 0">{{ section.name }}</SmallTitle>
 
-					<div class="form-part" v-if="section.key == 'base'">
+					<div
+						class="form-part"
+						v-if="section.key == 'base'"
+						style="border-bottom: 1px solid #dfdfdf; margin-bottom: 24px">
 						<el-skeleton v-if="!showForm" animated />
-						<BaseInfoForm
+						<!-- <BaseInfoForm
 							key="drawer-dialog-form"
 							v-if="showForm"
 							ref="form"
 							:disabled="mode.includes('detail')"
-							:dataForm="form"
+							v-model="form"
-							:rows="formRows" />
+							:rows="formRows" /> -->
+
+						<!-- if  -->
+						<el-row v-if="mode.includes('detail')" style="margin-bottom: 24px">
+							<el-col :span="8">
+								<div
+									class="title"
+									style="font-weight: 700; font-size: 16px; margin: 8px 0">
+									设备名
+								</div>
+								<div class="value" style="font-size: 14px">
+									{{ form.equipmentName }}
+								</div>
+							</el-col>
+							<el-col :span="8">
+								<div
+									class="title"
+									style="font-weight: 700; font-size: 16px; margin: 8px 0">
+									关联表名
+								</div>
+								<div class="value" style="font-size: 14px">
+									{{ form.plcName }}
+								</div>
+							</el-col>
+						</el-row>
+						<!-- else  -->
+						<el-row v-else style="margin-bottom: 24px" :gutter="20">
+							<el-form ref="form" :model="form">
+								<el-col :span="8">
+									<el-form-item
+										class="title"
+										label="设备名"
+										style="font-size: 16px; margin: 8px 0">
+										<el-select
+											v-model="form.equipmentId"
+											filterable
+											clearable
+											placeholder="请选择设备">
+											<el-option
+												v-for="eq in eqList"
+												:key="eq.id"
+												:label="eq.name"
+												:value="eq.id"></el-option>
+										</el-select>
+									</el-form-item>
+								</el-col>
+								<el-col :span="8">
+									<el-form-item
+										class="title"
+										label="设备关联表名"
+										style="font-size: 16px; margin: 8px 0">
+										<el-select
+											v-model="form.plcId"
+											filterable
+											clearable
+											placeholder="请选择关联表">
+											<el-option
+												v-for="plc in plcList"
+												:key="plc.id"
+												:label="plc.plcTableName"
+												:value="plc.id"></el-option>
+										</el-select>
+									</el-form-item>
+								</el-col>
+							</el-form>
+						</el-row>
 					</div>
 
-					<div v-if="section.key == 'attrs'" style="margin-top: 12px">
+					<div
+						v-if="section.key == 'attrs'"
+						style="position: relative; margin-top: 12px">
+						<div
+							v-if="!mode.includes('detail')"
+							style="position: absolute; top: -40px; right: 0">
+							<el-button @click="handleAddAttr" type="text">
+								<i class="el-icon-plus"></i>
+								添加参数
+							</el-button>
+						</div>
 						<base-table
 							v-loading="attrListLoading"
 							:table-props="section.props"
 							:page="attrQuery?.params.pageNo || 1"
 							:limit="attrQuery?.params.pageSize || 10"
 							:table-data="list"
-							:add-button-show="mode.includes('detail') ? null : '添加属性'"
-							@emitButtonClick="handleAddAttr"
 							@emitFun="handleEmitFun">
+							<!-- :add-button-show="mode.includes('detail') ? null : '添加属性'"
+							@emitButtonClick="handleAddAttr" -->
 							<method-btn
-								v-if="section.tableBtn"
+								v-if="section.tableBtn && !mode.includes('detail')"
 								slot="handleBtn"
 								label="操作"
 								:method-list="tableBtn"
@@ -71,17 +149,12 @@
 
 			<div class="drawer-body__footer">
 				<el-button style="" @click="handleCancel">取消</el-button>
-				<el-button v-if="mode == 'detail'" type="primary" @click="toggleEdit">
+				<el-button
-					编辑
+					type="primary"
+					v-if="!mode.includes('detail')"
+					@click="handleSave">
+					保存
 				</el-button>
-				<el-button v-else type="primary" @click="handleCancel">确定</el-button>
-				<!-- sections的第二项必须是 属性列表  -->
-				<!-- <el-button
-						v-if="sections[1].allowAdd"
-						type="primary"
-						@click="handleAddAttr">
-						添加属性
-					</el-button> -->
 			</div>
 		</div>
 
@@ -96,10 +169,10 @@
 			@close="closeAttrForm"
 			@cancel="closeAttrForm"
 			@confirm="submitAttrForm">
+			<!-- :disabled="mode.includes('detail')" -->
 			<DialogForm
 				v-if="attrFormVisible"
 				ref="attrForm"
-				:disabled="mode.includes('detail')"
 				v-model="attrForm"
 				:rows="attrRows" />
 		</base-dialog>
@@ -136,7 +209,7 @@ const SmallTitle = {
 
 export default {
 	components: { SmallTitle, DialogForm: BaseInfoForm, BaseInfoForm },
-	props: ['sections', 'defaultMode', 'infoData'],
+	props: ['sections', 'defaultMode', 'infoData', 'size'],
 	data() {
 		return {
 			mode: '',
@@ -145,13 +218,15 @@ export default {
 			total: 0,
 			form: {},
 			list: [],
+			eqList: [],
+			plcList: [],
 			attrTitle: '',
 			attrForm: {
 				id: null,
 				name: '',
 				plcParamName: '',
 				unit: '',
-				collection: '',
+				collection: 1,
 				minValue: '',
 				maxValue: '',
 				defaultValue: '',
@@ -166,13 +241,17 @@ export default {
 						input: true,
 						label: '参数列名',
 						prop: 'plcParamName',
-						rules: [{ required: true, message: '不能为空', trigger: 'blur' }],
+						rules: [
+							{ required: true, message: '参数列名不能为空', trigger: 'blur' },
+						],
 					},
 					{
 						input: true,
 						label: '参数名称',
 						prop: 'name',
-						rules: [{ required: true, message: '不能为空', trigger: 'blur' }],
+						rules: [
+							{ required: true, message: '参数名称不能为空', trigger: 'blur' },
+						],
 					},
 				],
 				[
@@ -181,7 +260,6 @@ export default {
 						label: '单位',
 						prop: 'unit',
 						options: this.getDictDatas(this.DICT_TYPE.UNIT_DICT),
-						// rules: [{ required: true, message: '不能为空', trigger: 'blur' }],
 					},
 					{
 						switch: true,
@@ -193,6 +271,47 @@ export default {
 						},
 					},
 				],
+				[
+					{
+						select: true,
+						label: '设备参数类型',
+						prop: 'equipmentParamType',
+						options: [
+							{ label: '一般参数', value: 1 },
+							{ label: '工艺参数', value: 2 },
+							{ label: '报警参数', value: 3 },
+						],
+						rules: [
+							{
+								required: true,
+								message: '设备参数类型不能为空',
+								trigger: 'blur',
+							},
+						],
+					},
+					{
+						select: true,
+						label: '生产参数类型',
+						prop: 'productionParamType',
+						options: [
+							// { label: '进片数量', value: 1 },
+							// { label: '出片数量', value: 2 },
+							// { label: '破损数量', value: 3 },
+							// { label: '无类型', value: 4 },
+							{ label: '进口计数', value: 1 },
+							{ label: '出口计数', value: 2 },
+							{ label: '损耗计数', value: 3 },
+							{ label: '无类型', value: 4 },
+						],
+						rules: [
+							{
+								required: true,
+								message: '生产参数类型不能为空',
+								trigger: 'blur',
+							},
+						],
+					},
+				],
 				[
 					{
 						input: true,
@@ -222,7 +341,6 @@ export default {
 								transform: (val) => Number(val),
 							},
 						],
-						// rules: [{ required: true, message: '不能为空', trigger: 'blur' }],
 					},
 				],
 				[
@@ -230,13 +348,11 @@ export default {
 						input: true,
 						label: '标准值',
 						prop: 'defaultValue',
-						// rules: [{ required: true, message: '不能为空', trigger: 'blur' }],
 					},
 					{
 						input: true,
 						label: '描述',
 						prop: 'description',
-						// rules: [{ required: true, message: '不能为空', trigger: 'blur' }],
 					},
 				],
 				[
@@ -244,7 +360,6 @@ export default {
 						input: true,
 						label: '备注',
 						prop: 'remark',
-						// rules: [{ required: true, message: '不能为空', trigger: 'blur' }],
 					},
 				],
 			],
@@ -257,6 +372,7 @@ export default {
 			infoQuery: null, // 基本信息的请求
 			attrFormSubmitting: false,
 			attrListLoading: false,
+			shouldRefreshPageView: false,
 		};
 	},
 	computed: {
@@ -275,11 +391,24 @@ export default {
 			});
 		},
 		tableBtn() {
-			return this.mode == 'detail' ? [] : this.sections[1].tableBtn;
+			return this.sections[1].tableBtn;
+			// return this.mode == 'detail' ? [] : this.sections[1].tableBtn;
 		},
 	},
 	mounted() {
+		this.shouldRefreshPageView = false;
 		this.mode = this.defaultMode || 'detail';
+
+		if (this.mode != 'detail') {
+			this.$axios('/base/equipment/listAll').then(({ code, data }) => {
+				this.eqList = data;
+			});
+			this.$axios({
+				url: '/base/equipment-plc/listAll',
+			}).then(({ code, data }) => {
+				this.plcList = data;
+			});
+		}
 		for (const section of this.sections) {
 			// 请求具体信息
 			if ('url' in section) {
@@ -341,7 +470,7 @@ export default {
 		handleSave() {
 			this.$refs['form'][0].validate(async (valid) => {
 				if (valid) {
-					const isEdit = this.mode == 'edit';
+					const isEdit = !this.mode.includes('detail');
 					await this.$axios({
 						url: this.sections[0][isEdit ? 'urlUpdate' : 'urlCreate'],
 						method: isEdit ? 'put' : 'post',
@@ -355,6 +484,9 @@ export default {
 		},
 
 		handleCancel() {
+			if (this.shouldRefreshPageView) {
+				this.$emit('refreshDataList');
+			}
 			this.visible = false;
 		},
 
@@ -370,15 +502,17 @@ export default {
 				name: '',
 				plcParamName: '',
 				unit: '',
-				collection: '',
+				collection: 1,
 				minValue: '',
 				maxValue: '',
 				defaultValue: '',
 				description: '',
 				remark: '',
+				equipmentParamType: '',
+				productionParamType: '',
 				alarmContent: '',
 			};
-			this.attrTitle = '添加设备绑定信息';
+			this.attrTitle = '添加参数绑定信息';
 			this.attrFormVisible = true;
 		},
 
@@ -391,14 +525,14 @@ export default {
 			});
 			if (res.code == 0) {
 				this.attrForm = res.data;
-				this.attrTitle = '编辑设备绑定信息';
+				this.attrTitle = '编辑参数绑定信息';
 				this.attrFormVisible = true;
 			}
 		},
 
 		// 删除属性
 		handleDeleteAttr(attrId) {
-			this.$confirm('确定删除该分组报警?', '提示', {
+			this.$confirm('确定删除该参数?', '提示', {
 				confirmButtonText: '确定',
 				cancelButtonText: '取消',
 				type: 'warning',
@@ -410,6 +544,7 @@ export default {
 						params: { id: attrId },
 					});
 					if (res.code == 0) {
+						this.shouldRefreshPageView = true;
 						this.$message({
 							message: '删除成功',
 							type: 'success',
@@ -424,35 +559,37 @@ export default {
 		},
 
 		// 提交属性表
-		async submitAttrForm() {
+		submitAttrForm() {
-			this.$refs['attrForm'].validate((valid) => {
+			this.$refs['attrForm'].validate(async (valid) => {
 				if (!valid) {
 					return;
 				}
-			});
-			const isEdit = this.attrForm.id != null;
-			this.attrFormSubmitting = true;
-			const res = await this.$axios({
-				url: isEdit ? this.sections[1].urlUpdate : this.sections[1].urlCreate,
-				method: isEdit ? 'put' : 'post',
-				data: {
-					...this.attrForm,
-					connectId: this.infoData.id
-				},
-			});
 
-			if (res.code == 0) {
+				const isEdit = this.attrForm.id != null;
-				this.closeAttrForm();
+				this.attrFormSubmitting = true;
-				this.$message({
+				const res = await this.$axios({
-					message: `${isEdit ? '更新' : '创建'}成功`,
+					url: isEdit ? this.sections[1].urlUpdate : this.sections[1].urlCreate,
-					type: 'success',
+					method: isEdit ? 'put' : 'post',
-					duration: 1500,
+					data: {
-					onClose: () => {
+						...this.attrForm,
-						this.getAttrList();
+						connectId: this.infoData.id,
 					},
 				});
-			}
+
-			this.attrFormSubmitting = false;
+				if (res.code == 0) {
+					this.closeAttrForm();
+					this.$message({
+						message: `${isEdit ? '更新' : '创建'}成功`,
+						type: 'success',
+						duration: 1500,
+						onClose: () => {
+							this.getAttrList();
+							this.shouldRefreshPageView = true;
+						},
+					});
+				}
+				this.attrFormSubmitting = false;
+			});
 		},
 
 		closeAttrForm() {
@@ -461,7 +598,7 @@ export default {
 
 		handleClick(raw) {
 			if (raw.type === 'delete') {
-				this.$confirm(`确定删除该报警?`, '提示', {
+				this.$confirm(`确定删除该参数?`, '提示', {
 					confirmButtonText: '确定',
 					cancelButtonText: '取消',
 					type: 'warning',

src/views/base/equipmentPlcConnect/components/basic-add.js

@@ -0,0 +1,100 @@
+/*
+ * @Author: zwq
+ * @Date: 2022-08-24 11:19:43
+ * @LastEditors: zhp
+ * @LastEditTime: 2023-12-13 15:52:53
+ * @Description:
+ */
+export default {
+  data() {
+    /* eslint-disable */
+    return {
+      urlOptions: {
+        createURL: '',
+        updateURL: '',
+        infoURL: '',
+        codeURL: '',
+        getOption: false,
+        isGetCode: false,
+        optionArrUrl: [],
+        optionArr: {}
+      },
+      visible: false,
+      setData: false
+    }
+  },
+  created() {
+  },
+  activated() {
+  },
+  methods: {
+    init(id) {
+      this.dataForm.id = id || "";
+      this.visible = true;
+      if (this.urlOptions.getOption) {
+        this.getArr()
+      }
+      this.$nextTick(() => {
+        this.$refs["dataForm"].resetFields();
+        if (this.dataForm.id) {
+          this.urlOptions.infoURL(id).then(response => {
+            this.dataForm = response.data
+            if (this.setData) {
+              this.setDataForm()
+            }
+          });
+        } else {
+          if (this.urlOptions.isGetCode) {
+            this.getCode()
+          }
+				}
+      });
+    },
+		getCode() {
+			this.urlOptions.codeURL()
+				.then(({ data: res }) => {
+					this.dataForm.code = res;
+				})
+				.catch(() => {});
+		},
+    getArr() {
+      const params = {
+        pageSize: 100,
+        pageNo: 1,
+      }
+      this.urlOptions.optionArrUrl.forEach((item, index) => {
+        item(params).then(({ data: res }) => {
+          this.$set(this.urlOptions.optionArr, `arr${index}`, res.list)
+        })
+          .catch(() => {
+          });
+      });
+    },
+    // 表单提交
+    dataFormSubmit() {
+      this.$refs["dataForm"].validate((valid) => {
+        if (!valid) {
+          return false;
+        }
+        // 修改的提交
+        if (this.dataForm.id) {
+          this.urlOptions.updateURL(this.dataForm).then(response => {
+            this.$modal.msgSuccess("修改成功");
+            this.visible = false;
+            this.$emit("refreshDataList");
+          });
+          return;
+        }
+        // 添加的提交
+        this.urlOptions.createURL(this.dataForm).then(response => {
+          this.$modal.msgSuccess("新增成功");
+          this.visible = false;
+          this.$emit("refreshDataList");
+        });
+      });
+    },
+    formClear() {
+      this.$refs.dataForm.resetFields()
+    }
+  }
+}

src/views/base/equipmentPlcConnect/index-old.vue

@@ -0,0 +1,535 @@
+<template>
+	<div class="app-container">
+		<!-- 搜索工作栏 -->
+		<SearchBar
+			:formConfigs="searchBarFormConfig"
+			ref="search-bar"
+			@headBtnClick="handleSearchBarBtnClick" />
+
+		<!-- 列表 -->
+		<base-table
+			:table-props="tableProps"
+			:page="queryParams.pageNo"
+			:limit="queryParams.pageSize"
+			:table-data="list"
+			@emitFun="handleEmitFun">
+			<method-btn
+				v-if="tableBtn.length"
+				slot="handleBtn"
+				label="操作"
+				:width="120"
+				:method-list="tableBtn"
+				@clickBtn="handleTableBtnClick" />
+		</base-table>
+
+		<!-- 分页组件 -->
+		<pagination
+			v-show="total > 0"
+			:total="total"
+			:page.sync="queryParams.pageNo"
+			:limit.sync="queryParams.pageSize"
+			@pagination="getList" />
+
+		<!-- 对话框(添加 / 修改) -->
+		<base-dialog
+			:dialogTitle="title"
+			:dialogVisible="open"
+			width="700px"
+			@close="cancel"
+			@cancel="cancel"
+			@confirm="submitForm">
+			<DialogForm v-if="open" ref="form" v-model="form" :rows="rows" />
+		</base-dialog>
+
+		<!-- 抽屉 详情 -->
+		<BasicDrawer
+			v-if="editVisible"
+			ref="drawer"
+			:default-mode="editMode"
+			:info-data="alarmForm"
+			:sections="[
+				{
+					name: '基本信息',
+					key: 'base',
+					rows: drawerBaseInfoRows,
+				},
+				{
+					name: '属性列表',
+					key: 'attrs',
+					props: drawerListProps,
+					url: '/base/equipment-plc-param/page',
+					urlCreate: '/base/equipment-plc-param/create',
+					urlUpdate: '/base/equipment-plc-param/update',
+					urlDelete: '/base/equipment-plc-param/delete',
+					urlDetail: '/base/equipment-plc-param/get',
+					queryParams: {
+						connectId: alarmForm.id,
+						pageNo: 1,
+						pageSize: 10,
+					},
+					tableBtn: [
+						this.$auth.hasPermi('base:equipment-plc-param:update')
+							? {
+									type: 'edit',
+									btnName: '修改',
+							  }
+							: undefined,
+						this.$auth.hasPermi('base:equipment-plc-param:delete')
+							? {
+									type: 'delete',
+									btnName: '删除',
+							  }
+							: undefined,
+					].filter((v) => v),
+					allowAdd: true,
+				},
+			]"
+			@refreshDataList="getList"
+			@cancel="editVisible = false"
+			@destroy="editVisible = false" />
+	</div>
+</template>
+
+<script>
+import {
+	createEquipmentPlcConnect,
+	updateEquipmentPlcConnect,
+	deleteEquipmentPlcConnect,
+	getEquipmentPlcConnect,
+	getEquipmentPlcConnectPage,
+	exportEquipmentPlcConnectExcel,
+} from '@/api/base/equipmentPlcConnect';
+import moment from 'moment';
+import basicPageMixin from '@/mixins/lb/basicPageMixin';
+// import './http';
+import BasicDrawer from './components/BasicDrawer.vue';
+import { publicFormatter } from '@/utils/dict';
+
+export default {
+	name: 'EquipmentPlcConnect',
+	mixins: [basicPageMixin],
+	components: { BasicDrawer },
+	data() {
+		return {
+			searchBarKeys: ['equipmentId', 'plcId'],
+			// tableBtn: [
+			// 	this.$auth.hasPermi('base:equipment-plc:update')
+			// 		? {
+			// 				type: 'edit',
+			// 				btnName: '修改',
+			// 		  }
+			// 		: undefined,
+			// 	this.$auth.hasPermi('base:equipment-plc:delete')
+			// 		? {
+			// 				type: 'delete',
+			// 				btnName: '删除',
+			// 		  }
+			// 		: undefined,
+			// ].filter((v) => v),
+			tableBtn: [
+				{
+					type: 'detail',
+					btnName: '参数绑定',
+				},
+				{
+					type: 'edit',
+					btnName: '修改',
+				},
+				// {
+				// 	type: 'params-bind',
+				// 	btnName: '参数绑定',
+				// },
+				{
+					type: 'delete',
+					btnName: '删除',
+				},
+			],
+			tableProps: [
+				// {
+				// 	prop: 'createTime',
+				// 	label: '添加时间',
+				// 	fixed: true,
+				// 	width: 180,
+				// 	filter: (val) => moment(val).format('yyyy-MM-DD HH:mm:ss'),
+				// },
+				{ prop: 'productionLine', label: '产线' },
+				{ prop: 'workshopSection', label: '工段' },
+				{ prop: 'equipmentName', label: '设备名' },
+				{ prop: 'equipmentCode', label: '设备编码' },
+				{ prop: 'plcCode', label: '关联表编码' },
+				{ prop: 'plcTableName', label: '关联表名' },
+				{ prop: 'plcName', label: '标识名称' },
+				{ prop: 'bindingParameters', label: '绑定参数数量' },
+				// {
+				// 	_action: 'params-bind',
+				// 	label: '查看绑定',
+				// 	subcomponent: {
+				// 		props: ['injectData'],
+				// 		render: function (h) {
+				// 			const _this = this;
+				// 			return h(
+				// 				'el-button',
+				// 				{
+				// 					props: { type: 'text' },
+				// 					on: {
+				// 						click: function () {
+				// 							console.log('inejctdata', _this.injectData);
+				// 							_this.$emit('emitData', {
+				// 								action: _this.injectData._action,
+				// 								payload: _this.injectData,
+				// 							});
+				// 						},
+				// 					},
+				// 				},
+				// 				'查看绑定'
+				// 			);
+				// 		},
+				// 	},
+				// },
+			],
+			searchBarFormConfig: [
+				{
+					type: 'select',
+					label: '设备名',
+					placeholder: '请选择设备',
+					param: 'equipmentId',
+					selectOptions: [],
+				},
+				{
+					type: 'select',
+					label: '编码',
+					placeholder: '请选择编码',
+					param: 'plcId',
+					selectOptions: [],
+				},
+				{
+					type: 'button',
+					btnName: '查询',
+					name: 'search',
+					color: 'primary',
+				},
+				{
+					type: 'separate',
+				},
+				{
+					// type: this.$auth.hasPermi('base:equipment-plc:create')
+					// 	? 'button'
+					// 	: '',
+					type: 'button',
+					btnName: '新增',
+					name: 'add',
+					plain: true,
+					color: 'success',
+				},
+				// {
+				// 	type: this.$auth.hasPermi('base:equipment-plc:export') ? 'button' : '',
+				// 	btnName: '导出',
+				// 	name: 'export',
+				// 	color: 'warning',
+				// },
+			],
+			rows: [
+				[
+					{
+						select: true,
+						label: '关联表名',
+						prop: 'plcId',
+						labelKey: `plcTableName`,
+						url: '/base/equipment-plc/listAll',
+						rules: [{ required: true, message: '不能为空', trigger: 'blur' }],
+						bind: {
+							filterable: true,
+						},
+					},
+				],
+				[
+					{
+						select: true,
+						label: '设备',
+						prop: 'equipmentId',
+						url: '/base/equipment/page?pageNo=1&pageSize=99',
+						rules: [{ required: true, message: '不能为空', trigger: 'blur' }],
+						bind: {
+							filterable: true,
+						},
+					},
+				],
+			],
+			open: false,
+			// 查询参数
+			queryParams: {
+				pageNo: 1,
+				pageSize: 10,
+				plcId: null,
+				equipmentId: null,
+			},
+			// 表单参数
+			form: {},
+			// 查看绑定配置
+			editVisible: false,
+			editMode: '',
+			drawerBaseInfoRows: [
+				[
+					{
+						input: true,
+						label: '设备名',
+						prop: 'equipmentName',
+						rules: [{ required: true, message: '不能为空', trigger: 'blur' }],
+						// bind: {
+						// 	disabled: this.editMode == 'detail', // some condition, like detail mode...
+						// }
+					},
+					{
+						input: true,
+						label: '关联表名',
+						prop: 'plcTableName',
+						// url: '/base/equipment/getCode',
+					},
+				],
+			],
+			drawerListProps: [
+				{ prop: 'plcParamName', label: '参数列名' },
+				{ prop: 'name', label: '参数名称' },
+				{
+					prop: 'unit',
+					label: '单位',
+					filter: publicFormatter('unit_dict'),
+				},
+				{
+					prop: 'equipmentParamType',
+					label: '设备参数类型',
+					filter: (val) =>
+						val != null
+							? ['', '一般参数', '工艺参数', '报警参数', ''][val]
+							: '-',
+				},
+				{
+					prop: 'productionParamType',
+					label: '生产参数类型',
+					filter: (val) =>
+						val != null
+							? // ? ['', '进片数量', '出片数量', '破损数量', '无类型', ''][val]
+							  ['', '进口计数', '出口计数', '损耗计数', '无类型', ''][val]
+							: '-',
+				},
+				{
+					prop: 'collection',
+					label: '是否采集',
+					filter: (val) => (val != null ? ['否', '是'][val] : '-'),
+				},
+				{ prop: 'minValue', label: '最小值' },
+				{ prop: 'maxValue', label: '最大值' },
+				{ prop: 'defaultValue', label: '标准值' },
+				{ prop: 'description', label: '描述' },
+				{ prop: 'remark', label: '备注' },
+			],
+			alarmForm: {
+				id: undefined,
+				equipmentName: undefined,
+				plcTableName: undefined,
+			},
+		};
+	},
+	created() {
+		this.getList();
+		this.initSearchOptions();
+	},
+	methods: {
+		async getEquipmentOptions() {
+			const res = await this.$axios({
+				url: '/base/equipment/listAll',
+				method: 'get',
+			});
+			return res.data;
+		},
+
+		async getPlcOptions() {
+			const res = await this.$axios({
+				url: '/base/equipment-plc/listAll',
+				method: 'get',
+			});
+			return res.data;
+		},
+
+		/** 初始化查询条件 */
+		async initSearchOptions() {
+			Promise.all([this.getEquipmentOptions(), this.getPlcOptions()]).then(
+				([eqList, plcList]) => {
+					this.searchBarFormConfig[0].selectOptions = eqList.map((item) => {
+						return {
+							name: item.name,
+							id: item.id,
+						};
+					});
+					this.searchBarFormConfig[1].selectOptions = plcList.map((item) => {
+						return {
+							name: item.name,
+							id: item.id,
+						};
+					});
+				}
+			);
+		},
+		/** 覆盖 handleEmitFun 的默认实现 */
+		handleEmitFun({ action, payload }) {
+			switch (action) {
+				case 'params-bind':
+					this.reset();
+					const {
+						id,
+						equipmentName,
+						equipmentId,
+						plcId,
+						plcName,
+						plcTableName,
+					} = payload;
+					// console.log('Cha看绑定参数弹窗', id, equipmentName, plcTableName);
+					this.$router.push({
+						name: 'EquipmentPlcParam',
+						params: {
+							id,
+							equipmentName,
+							plcTableName,
+						},
+					});
+					break;
+			}
+		},
+
+		/** 查询列表 */
+		getList() {
+			this.loading = true;
+			// 执行查询
+			getEquipmentPlcConnectPage(this.queryParams).then((response) => {
+				this.list = response.data.list;
+				this.total = response.data.total;
+				this.loading = false;
+			});
+		},
+		/** 取消按钮 */
+		cancel() {
+			this.open = false;
+			this.reset();
+		},
+		/** 表单重置 */
+		reset() {
+			this.form = {
+				id: undefined,
+				plcId: undefined,
+				equipmentId: undefined,
+			};
+			this.resetForm('form');
+		},
+		/** 搜索按钮操作 */
+		handleQuery() {
+			this.queryParams.pageNo = 1;
+			this.getList();
+		},
+		/** 重置按钮操作 */
+		resetQuery() {
+			this.resetForm('queryForm');
+			this.handleQuery();
+		},
+		/** 新增按钮操作 */
+		handleAdd() {
+			this.reset();
+			this.open = true;
+			this.title = '添加设备与实时采集关系表（一对多）';
+		},
+		/** 修改按钮操作 */
+		handleUpdate(row) {
+			this.reset();
+			const id = row.id;
+			getEquipmentPlcConnect(id).then((response) => {
+				this.form = response.data;
+				this.open = true;
+				this.title = '修改设备与实时采集关系表（一对多）';
+			});
+		},
+		/** 提交按钮 */
+		submitForm() {
+			this.$refs['form'].validate((valid) => {
+				if (!valid) {
+					return;
+				}
+				// 修改的提交
+				if (this.form.id != null) {
+					updateEquipmentPlcConnect(this.form).then((response) => {
+						this.$modal.msgSuccess('修改成功');
+						this.open = false;
+						this.getList();
+					});
+					return;
+				}
+				// 添加的提交
+				createEquipmentPlcConnect(this.form).then((response) => {
+					this.$modal.msgSuccess('新增成功');
+					this.open = false;
+					this.getList();
+				});
+			});
+		},
+
+		// 查看报警
+		handleDetail(row) {
+			// debugger;
+			const {
+				id,
+				bindingParameters,
+				equipmentCode,
+				equipmentId,
+				equipmentName,
+				plcCode,
+				plcId,
+				plcName,
+				plcTableName,
+				productionLine,
+				workshopSection,
+			} = row;
+			// 打开抽屉
+			this.editMode = 'detail';
+			this.alarmForm.id = id;
+			this.alarmForm.plcTableName = plcTableName; // 关联表名
+			this.alarmForm.equipmentName = equipmentName;
+			this.editVisible = true;
+			this.$nextTick(() => {
+				this.$refs['drawer'].init();
+			});
+		},
+
+		/** 删除按钮操作 */
+		handleDelete(row) {
+			const id = row.id;
+			this.$modal
+				.confirm('是否删除该配置?')
+				.then(function () {
+					return deleteEquipmentPlcConnect(id);
+				})
+				.then(() => {
+					this.getList();
+					this.$modal.msgSuccess('删除成功');
+				})
+				.catch(() => {});
+		},
+
+		/** 导出按钮操作 */
+		handleExport() {
+			// 处理查询参数
+			let params = { ...this.queryParams };
+			params.pageNo = undefined;
+			params.pageSize = undefined;
+			this.$modal
+				.confirm('是否确认导出所有设备与实时采集关系表（一对多）数据项?')
+				.then(() => {
+					this.exportLoading = true;
+					return exportEquipmentPlcConnectExcel(params);
+				})
+				.then((response) => {
+					this.$download.excel(response, '设备与实时采集关系表（一对多）.xls');
+					this.exportLoading = false;
+				})
+				.catch(() => {});
+		},
+	},
+};
+</script>

src/views/base/equipmentPlcConnect/index.vue

@@ -1,3 +1,10 @@
+<!--
+    filename: CollectionConfig.vue
+    author: liubin
+    date: 2023-10-30 10:09:03
+    description:
+-->
+
 <template>
 	<div class="app-container">
 		<!-- 搜索工作栏 -->
@@ -12,7 +19,8 @@
 			:page="queryParams.pageNo"
 			:limit="queryParams.pageSize"
 			:table-data="list"
-			@emitFun="handleEmitFun">
+			@emitFun="handleEmitFun"
+			:max-height="tableH">
 			<method-btn
 				v-if="tableBtn.length"
 				slot="handleBtn"
@@ -34,17 +42,21 @@
 		<base-dialog
 			:dialogTitle="title"
 			:dialogVisible="open"
-			width="700px"
+			width="30%"
 			@close="cancel"
 			@cancel="cancel"
 			@confirm="submitForm">
-			<DialogForm v-if="open" ref="form" :dataForm="form" :rows="rows" />
+			<!-- <DialogForm v-if="open" ref="form" v-model="form" :rows="rows" /> -->
+			<add-or-update
+				ref="addOrUpdate"
+				@refreshDataList="successSubmit" />
 		</base-dialog>
 
 		<!-- 抽屉 详情 -->
 		<BasicDrawer
 			v-if="editVisible"
 			ref="drawer"
+			size="45%"
 			:default-mode="editMode"
 			:info-data="alarmForm"
 			:sections="[
@@ -52,9 +64,13 @@
 					name: '基本信息',
 					key: 'base',
 					rows: drawerBaseInfoRows,
+					url: '/base/equipment-plc-connect/get',
+					urlUpdate: '/base/equipment-plc-connect/update',
+					urlCreate: '/base/equipment-plc-connect/create',
+					queryParams: { id: alarmForm.id },
 				},
 				{
-					name: '属性列表',
+					name: '采集参数',
 					key: 'attrs',
 					props: drawerListProps,
 					url: '/base/equipment-plc-param/page',
@@ -68,18 +84,26 @@
 						pageSize: 10,
 					},
 					tableBtn: [
-						this.$auth.hasPermi('base:equipment-plc-param:update')
+						{
-							? {
+							type: 'edit',
-									type: 'edit',
+							btnName: '修改',
-									btnName: '修改',
+						},
-							  }
+						{
-							: undefined,
+							type: 'delete',
-						this.$auth.hasPermi('base:equipment-plc-param:delete')
+							btnName: '删除',
-							? {
+						},
-									type: 'delete',
+						// this.$auth.hasPermi('equipment:collection-config-param:update')
-									btnName: '删除',
+						// 	? {
-							  }
+						// 			type: 'edit',
-							: undefined,
+						// 			btnName: '修改',
+						// 	  }
+						// 	: undefined,
+						// this.$auth.hasPermi('equipment:collection-config-param:delete')
+						// 	? {
+						// 			type: 'delete',
+						// 			btnName: '删除',
+						// 	  }
+						// 	: undefined,
 					].filter((v) => v),
 					allowAdd: true,
 				},
@@ -99,67 +123,60 @@ import {
 	getEquipmentPlcConnectPage,
 	exportEquipmentPlcConnectExcel,
 } from '@/api/base/equipmentPlcConnect';
-import moment from 'moment';
 import basicPageMixin from '@/mixins/lb/basicPageMixin';
 // import './http';
 import BasicDrawer from './components/BasicDrawer.vue';
 import { publicFormatter } from '@/utils/dict';
+import AddOrUpdate from './add-or-updata';
+import tableHeightMixin from '@/mixins/lb/tableHeightMixin';
 
 export default {
 	name: 'EquipmentPlcConnect',
-	mixins: [basicPageMixin],
+	mixins: [basicPageMixin, tableHeightMixin],
-	components: { BasicDrawer },
+	components: { BasicDrawer, AddOrUpdate },
 	data() {
 		return {
 			searchBarKeys: ['equipmentId', 'plcId'],
 			// tableBtn: [
-			// 	this.$auth.hasPermi('base:equipment-plc:update')
-			// 		? {
-			// 				type: 'edit',
-			// 				btnName: '修改',
-			// 		  }
-			// 		: undefined,
-			// 	this.$auth.hasPermi('base:equipment-plc:delete')
-			// 		? {
-			// 				type: 'delete',
-			// 				btnName: '删除',
-			// 		  }
-			// 		: undefined,
 			// ].filter((v) => v),
 			tableBtn: [
-				{
+				this.$auth.hasPermiAnd([
-					type: 'detail',
+					'base:equipment-plc-connect:query',
-					btnName: '参数绑定',
+					'base:equipment-plc-param:query'
-				},
+				])
-				{
+				? {
-					type: 'edit',
+						type: 'detail',
-					btnName: '修改',
+						btnName: '参数绑定',
-				},
+					} : undefined,
-				// {
+				this.$auth.hasPermiAnd([
-				// 	type: 'params-bind',
+						'base:equipment-plc-connect:update',
-				// 	btnName: '参数绑定',
+						'base:equipment-plc-connect:query',
-				// },
+						'base:equipment-plc-param:create',
-				{
+						'base:equipment-plc-param:update',
-					type: 'delete',
+						'base:equipment-plc-param:delete',
-					btnName: '删除',
+						'base:equipment-plc-param:query'
-				},
+					])
-			],
+					? {
+							type: 'edit',
+							btnName: '修改',
+					  }
+					: undefined,
+				this.$auth.hasPermi('base:equipment-plc-connect:delete')
+					? {
+							type: 'delete',
+							btnName: '删除',
+					  }
+					: undefined,
+			].filter((v) => v),
 			tableProps: [
-				// {
+				{ prop: 'productionLine', label: '产线', minWidth: 120, showOverflowtooltip: true },
-				// 	prop: 'createTime',
+				{ prop: 'workshopSection', label: '工段', minWidth: 120, showOverflowtooltip: true },
-				// 	label: '添加时间',
+				{ prop: 'equipmentName', label: '设备名', minWidth: 120, showOverflowtooltip: true },
-				// 	fixed: true,
+				{ prop: 'equipmentCode', label: '设备编码', minWidth: 200, showOverflowtooltip: true },
-				// 	width: 180,
+				{ prop: 'plcCode', label: '关联表编码', minWidth: 220, showOverflowtooltip: true },
-				// 	filter: (val) => moment(val).format('yyyy-MM-DD HH:mm:ss'),
+				{ prop: 'plcTableName', label: '关联表名', minWidth: 150, showOverflowtooltip: true },
-				// },
+				{ prop: 'plcName', label: '标识名称', minWidth: 150, showOverflowtooltip: true },
-				{ prop: 'productionLine', label: '产线' },
+				{ prop: 'bindingParameters', label: '绑定参数数量', minWidth: 120, showOverflowtooltip: true },
-				{ prop: 'workshopSection', label: '工段' },
-				{ prop: 'equipmentName', label: '设备名' },
-				{ prop: 'equipmentCode', label: '设备编码' },
-				{ prop: 'plcCode', label: '关联表编码' },
-				{ prop: 'plcTableName', label: '关联表名' },
-				{ prop: 'plcName', label: '标识名称' },
-				{ prop: 'bindingParameters', label: '绑定参数数量' },
 				// {
 				// 	_action: 'params-bind',
 				// 	label: '查看绑定',
@@ -194,13 +211,15 @@ export default {
 					placeholder: '请选择设备',
 					param: 'equipmentId',
 					selectOptions: [],
+					filterable: true,
 				},
 				{
 					type: 'select',
-					label: '编码',
+					label: '关联表编码',
-					placeholder: '请选择编码',
+					placeholder: '请选择关联表编码',
 					param: 'plcId',
 					selectOptions: [],
+					filterable: true,
 				},
 				{
 					type: 'button',
@@ -209,20 +228,21 @@ export default {
 					color: 'primary',
 				},
 				{
-					type: 'separate',
+					type: this.$auth.hasPermi('base:equipment-plc-connect:create')
+						? 'separate' : '',
 				},
 				{
-					// type: this.$auth.hasPermi('base:equipment-plc:create')
+					type: this.$auth.hasPermi('base:equipment-plc-connect:create')
-					// 	? 'button'
+						? 'button'
-					// 	: '',
+						: '',
-					type: 'button',
+					// type: 'button',
 					btnName: '新增',
 					name: 'add',
 					plain: true,
 					color: 'success',
 				},
 				// {
-				// 	type: this.$auth.hasPermi('base:equipment-plc:export') ? 'button' : '',
+				// 	type: this.$auth.hasPermi('equipment:collection-config:export') ? 'button' : '',
 				// 	btnName: '导出',
 				// 	name: 'export',
 				// 	color: 'warning',
@@ -236,7 +256,9 @@ export default {
 						prop: 'plcId',
 						labelKey: `plcTableName`,
 						url: '/base/equipment-plc/listAll',
-						rules: [{ required: true, message: '不能为空', trigger: 'blur' }],
+						rules: [
+							{ required: true, message: '关联表名不能为空', trigger: 'blur' },
+						],
 						bind: {
 							filterable: true,
 						},
@@ -247,8 +269,10 @@ export default {
 						select: true,
 						label: '设备',
 						prop: 'equipmentId',
-						url: '/base/equipment/page?pageNo=1&pageSize=99',
+						url: '/base/core-equipment/page?pageNo=1&pageSize=99',
-						rules: [{ required: true, message: '不能为空', trigger: 'blur' }],
+						rules: [
+							{ required: true, message: '设备不能为空', trigger: 'blur' },
+						],
 						bind: {
 							filterable: true,
 						},
@@ -259,7 +283,7 @@ export default {
 			// 查询参数
 			queryParams: {
 				pageNo: 1,
-				pageSize: 10,
+				pageSize: 20,
 				plcId: null,
 				equipmentId: null,
 			},
@@ -274,7 +298,9 @@ export default {
 						input: true,
 						label: '设备名',
 						prop: 'equipmentName',
-						rules: [{ required: true, message: '不能为空', trigger: 'blur' }],
+						rules: [
+							{ required: true, message: '设备名不能为空', trigger: 'blur' },
+						],
 						// bind: {
 						// 	disabled: this.editMode == 'detail', // some condition, like detail mode...
 						// }
@@ -283,7 +309,7 @@ export default {
 						input: true,
 						label: '关联表名',
 						prop: 'plcTableName',
-						// url: '/base/equipment/getCode',
+						// url: '/base/core-equipment/getCode',
 					},
 				],
 			],
@@ -295,6 +321,23 @@ export default {
 					label: '单位',
 					filter: publicFormatter('unit_dict'),
 				},
+				{
+					prop: 'equipmentParamType',
+					label: '设备参数类型',
+					filter: (val) =>
+						val != null
+							? ['', '一般参数', '工艺参数', '报警参数', ''][val]
+							: '-',
+				},
+				{
+					prop: 'productionParamType',
+					label: '生产参数类型',
+					filter: (val) =>
+						val != null
+							? // ? ['', '进片数量', '出片数量', '破损数量', '无类型', ''][val]
+							  ['', '进口计数', '出口计数', '损耗计数', '无类型', ''][val]
+							: '-',
+				},
 				{
 					prop: 'collection',
 					label: '是否采集',
@@ -318,6 +361,10 @@ export default {
 		this.initSearchOptions();
 	},
 	methods: {
+		successSubmit() {
+      this.cancel()
+      this.getList()
+    },
 		async getEquipmentOptions() {
 			const res = await this.$axios({
 				url: '/base/equipment/listAll',
@@ -325,7 +372,6 @@ export default {
 			});
 			return res.data;
 		},
-
 		async getPlcOptions() {
 			const res = await this.$axios({
 				url: '/base/equipment-plc/listAll',
@@ -346,7 +392,7 @@ export default {
 					});
 					this.searchBarFormConfig[1].selectOptions = plcList.map((item) => {
 						return {
-							name: item.name,
+							name: item.code,
 							id: item.id,
 						};
 					});
@@ -403,6 +449,19 @@ export default {
 			};
 			this.resetForm('form');
 		},
+		handleTableBtnClick({ data, type }) {
+			switch (type) {
+				case 'edit':
+					this.handleDetail(data, 'edit');
+					break;
+				case 'delete':
+					this.handleDelete(data);
+					break;
+				case 'detail':
+					this.handleDetail(data);
+					break;
+			}
+		},
 		/** 搜索按钮操作 */
 		handleQuery() {
 			this.queryParams.pageNo = 1;
@@ -417,7 +476,10 @@ export default {
 		handleAdd() {
 			this.reset();
 			this.open = true;
-			this.title = '添加设备与实时采集关系表（一对多）';
+			this.title = '添加设备采集配置';
+			this.$nextTick(() => {
+				this.$refs.addOrUpdate.init()
+			})
 		},
 		/** 修改按钮操作 */
 		handleUpdate(row) {
@@ -426,35 +488,16 @@ export default {
 			getEquipmentPlcConnect(id).then((response) => {
 				this.form = response.data;
 				this.open = true;
-				this.title = '修改设备与实时采集关系表（一对多）';
+				this.title = '修改设备采集配置';
 			});
 		},
 		/** 提交按钮 */
 		submitForm() {
-			this.$refs['form'].validate((valid) => {
+			this.$refs.addOrUpdate.dataFormSubmit()
-				if (!valid) {
-					return;
-				}
-				// 修改的提交
-				if (this.form.id != null) {
-					updateEquipmentPlcConnect(this.form).then((response) => {
-						this.$modal.msgSuccess('修改成功');
-						this.open = false;
-						this.getList();
-					});
-					return;
-				}
-				// 添加的提交
-				createEquipmentPlcConnect(this.form).then((response) => {
-					this.$modal.msgSuccess('新增成功');
-					this.open = false;
-					this.getList();
-				});
-			});
 		},
 
 		// 查看报警
-		handleDetail(row) {
+		handleDetail(row, mode = 'detail') {
 			// debugger;
 			const {
 				id,
@@ -470,7 +513,7 @@ export default {
 				workshopSection,
 			} = row;
 			// 打开抽屉
-			this.editMode = 'detail';
+			this.editMode = mode;
 			this.alarmForm.id = id;
 			this.alarmForm.plcTableName = plcTableName; // 关联表名
 			this.alarmForm.equipmentName = equipmentName;

src/views/base/equipmentPlcParam/index.vue

@@ -38,7 +38,7 @@
 			@close="cancel"
 			@cancel="cancel"
 			@confirm="submitForm">
-			<DialogForm v-if="open" ref="form" :dataForm="form" :rows="rows" />
+			<DialogForm v-if="open" ref="form" v-model="form" :rows="rows" />
 		</base-dialog>
 	</div>
 </template>

src/views/base/material/add-or-updata.vue

@@ -0,0 +1,94 @@
+<!--
+ * @Author: zwq
+ * @Date: 2023-08-01 13:52:10
+ * @LastEditors: zwq
+ * @LastEditTime: 2024-04-10 09:30:06
+ * @Description:
+-->
+<template>
+	<el-form
+		:model="dataForm"
+		:rules="dataRule"
+		ref="dataForm"
+		v-if="visible"
+		@keyup.enter.native="dataFormSubmit()"
+		label-width="100px"
+		label-position="top">
+		<el-row :gutter="20">
+			<el-col :span="12">
+				<el-form-item label="原料名称" prop="name">
+					<el-input v-model="dataForm.name" clearable
+						placeholder="请输入原料名称" />
+				</el-form-item>
+			</el-col>
+			<el-col :span="12">
+				<el-form-item label="原料等级" prop="level">
+					<el-input v-model="dataForm.level" clearable
+						placeholder="请输入原料等级" />
+				</el-form-item>
+			</el-col>
+			<el-col :span="12">
+				<el-form-item label="原料编码" prop="code">
+					<el-input v-model="dataForm.code" readonly />
+				</el-form-item>
+			</el-col>
+			<el-col :span="12">
+				<el-form-item label="单位" prop="unit">
+					<el-select
+						v-model="dataForm.unit"
+						filterable
+						clearable
+						:style="{ width: '100%' }"
+						placeholder="请选择单位">
+						<el-option
+							v-for="item in urlOptions.dictArr.dict0"
+							:key="item.id"
+							:label="item.label"
+							:value="item.value"></el-option>
+					</el-select>
+				</el-form-item>
+			</el-col>
+		</el-row>
+	</el-form>
+</template>
+
+<script>
+import basicAdd from '@/mixins/basic-add';
+import {
+	createMaterial,
+	updateMaterial,
+	getMaterial,
+  getCode
+} from '@/api/base/material';
+
+export default {
+	mixins: [basicAdd],
+	data() {
+		return {
+			urlOptions: {
+				createURL: createMaterial,
+				updateURL: updateMaterial,
+				infoURL: getMaterial,
+        codeURL: getCode, //获取code接口（返回结果为dataForm.code字段）
+        dictNameList: ['unit_dict'], //数据字典name数组
+			},
+			dataForm: {
+				id: undefined,
+				code: '',
+				name: '',
+				unit: '',
+				level: '',
+			},
+			dataRule: {
+				name: [
+					{ required: true, message: '原料不能为空', trigger: 'blur' },
+				],
+				code: [{ required: true, message: '编码不能为空', trigger: 'blur' }],
+			},
+		};
+	},
+	created() {},
+	methods: {
+	},
+};
+</script>

src/views/base/material/index.vue

@@ -0,0 +1,183 @@
+<template>
+	<div class="app-container">
+		<!-- 搜索工作栏 -->
+		<search-bar
+			:formConfigs="formConfig"
+			ref="searchBarForm"
+			@headBtnClick="buttonClick" />
+
+		<!-- 列表 -->
+		<base-table
+			v-loading="dataListLoading"
+			:table-props="tableProps"
+			:page="listQuery.pageNo"
+			:limit="listQuery.pageSize"
+			:table-data="tableData">
+			<method-btn
+				v-if="tableBtn.length"
+				slot="handleBtn"
+				:width="90"
+				label="操作"
+				:method-list="tableBtn"
+				@clickBtn="handleClick" />
+		</base-table>
+		<pagination
+			:limit.sync="listQuery.pageSize"
+			:page.sync="listQuery.pageNo"
+			:total="listQuery.total"
+			@pagination="getDataList" />
+
+		<!-- 对话框(添加 / 修改) -->
+		<base-dialog
+			:dialogTitle="addOrEditTitle"
+			:dialogVisible="addOrUpdateVisible"
+			@cancel="handleCancel"
+			@confirm="handleConfirm"
+			:before-close="handleCancel"
+			width="40%">
+			<add-or-update
+				ref="addOrUpdate"
+				@refreshDataList="successSubmit"></add-or-update>
+		</base-dialog>
+	</div>
+</template>
+
+<script>
+import AddOrUpdate from './add-or-updata';
+import basicPage from '@/mixins/basic-page';
+import { parseTime } from '@/filter/code-filter';
+import { publicFormatter } from "@/utils/dict";
+import {
+	deleteMaterial,
+	getMaterialPage,
+} from '@/api/base/material';
+
+const tableProps = [
+  {
+    prop: 'createTime',
+    label: '添加时间',
+    filter: parseTime,
+  },
+	{
+		prop: 'name',
+		label: '原料名称',
+	},
+	{
+		prop: 'code',
+		label: '原料编码',
+		width: 180,
+	},
+	{
+		prop: 'level',
+		label: '原料等级',
+	},
+	{
+		prop: 'unit',
+		label: '单位',
+		filter: publicFormatter('unit_dict'),
+	},
+];
+
+export default {
+	mixins: [basicPage],
+	data() {
+		return {
+			urlOptions: {
+				getDataListURL: getMaterialPage,
+				deleteURL: deleteMaterial,
+			},
+			tableProps,
+			tableBtn: [
+				this.$auth.hasPermi(`base:material:update`)
+					? {
+							type: 'edit',
+							btnName: '编辑',
+					  }
+					: undefined,
+				this.$auth.hasPermi(`base:material:delete`)
+					? {
+							type: 'delete',
+							btnName: '删除',
+					  }
+					: undefined,
+			].filter((v) => v),
+			tableData: [],
+			formConfig: [
+				{
+          type: 'input',
+          label: '原料名称',
+          placeholder: '原料名称',
+          param: 'name'
+				},
+				{
+          type: 'input',
+          label: '原料编码',
+          placeholder: '原料编码',
+          param: 'code'
+				},
+				{
+					type: this.$auth.hasPermi('base:material:query')
+						? 'button'
+						: '',
+					btnName: '查询',
+					name: 'search',
+					color: 'primary',
+				},
+				{
+					type:
+						this.$auth.hasPermi('base:material:create') &&
+						this.$auth.hasPermi('base:material:query')
+							? 'separate'
+							: '',
+				},
+				{
+					type: this.$auth.hasPermi('base:material:create')
+						? 'button'
+						: '',
+					btnName: '新增',
+					name: 'add',
+					color: 'success',
+					plain: true,
+				},
+			],
+		};
+	},
+	components: {
+		AddOrUpdate,
+	},
+	created() {
+	},
+	methods: {
+		buttonClick(val) {
+			switch (val.btnName) {
+				case 'search':
+					this.listQuery.pageNo = 1;
+					this.listQuery.pageSize = 20;
+					this.listQuery.name = val.name;
+					this.listQuery.code = val.code;
+					this.getDataList();
+					break;
+				case 'reset':
+					this.$refs.searchBarForm.resetForm();
+					this.listQuery = {
+						pageSize: 20,
+						pageNo: 1,
+						total: 1,
+					};
+					this.getDataList();
+					break;
+				case 'add':
+					this.addOrEditTitle = '新增';
+					this.addOrUpdateVisible = true;
+					this.addOrUpdateHandle();
+					break;
+				case 'export':
+					this.handleExport();
+					break;
+				default:
+					console.log(val);
+			}
+		},
+	},
+};
+</script>

src/views/base/materialPricing/add-or-updata.vue

@@ -0,0 +1,156 @@
+<!--
+ * @Author: zwq
+ * @Date: 2023-08-01 13:52:10
+ * @LastEditors: zwq
+ * @LastEditTime: 2025-03-05 15:23:30
+ * @Description:
+-->
+<template>
+	<el-form
+		:model="dataForm"
+		:rules="dataRule"
+		ref="dataForm"
+		v-if="visible"
+		@keyup.enter.native="dataFormSubmit()"
+		label-width="100px"
+		label-position="top">
+		<el-row :gutter="20">
+			<el-col :span="12">
+				<el-form-item label="原料名称" prop="materialId">
+					<el-select
+						v-model="dataForm.materialId"
+						filterable
+						@change="setCode"
+						:style="{ width: '100%' }"
+						placeholder="请选择原料名称">
+						<el-option
+							v-for="item in MaterialList"
+							:key="item.id"
+							:label="item.name"
+							:value="item.id"></el-option>
+					</el-select>
+				</el-form-item>
+			</el-col>
+			<el-col :span="12">
+				<el-form-item label="原料编码" prop="code">
+					<el-input v-model="dataForm.code" clearable readonly />
+				</el-form-item>
+			</el-col>
+			<el-col :span="12">
+				<el-form-item label="生效开始时间" prop="startTime">
+					<el-date-picker
+						v-model="dataForm.startTime"
+						type="date"
+						value-format="timestamp"
+						:style="{ width: '100%' }"
+						placeholder="选择开始时间"></el-date-picker>
+				</el-form-item>
+			</el-col>
+			<el-col :span="12">
+				<el-form-item label="生效结束时间" prop="endTime">
+					<el-date-picker
+						v-model="dataForm.endTime"
+						type="date"
+						value-format="timestamp"
+						:style="{ width: '100%' }"
+						placeholder="选择结束时间"></el-date-picker>
+				</el-form-item>
+			</el-col>
+			<el-col :span="12">
+				<el-form-item label="单价" prop="price">
+					<el-input-number
+						:min="0"
+						style="width: 75%"
+						v-model="dataForm.price"
+						clearable
+						placeholder="请输入单价" />
+					{{ unit }}
+				</el-form-item>
+			</el-col>
+			<el-col :span="12">
+				<el-form-item label="备注" prop="remark">
+					<el-input
+						v-model="dataForm.remark"
+						clearable
+						placeholder="请输入备注" />
+				</el-form-item>
+			</el-col>
+		</el-row>
+	</el-form>
+</template>
+
+<script>
+import basicAdd from '@/mixins/basic-add';
+import {
+	createMaterialPricing,
+	updateMaterialPricing,
+	getMaterialPricing,
+} from '@/api/base/materialPricing';
+import { getMaterialPage } from '@/api/base/material';
+
+export default {
+	mixins: [basicAdd],
+	data() {
+		return {
+			urlOptions: {
+				createURL: createMaterialPricing,
+				updateURL: updateMaterialPricing,
+				infoURL: getMaterialPricing,
+				optionArrUrl: [getMaterialPage], //需要获取下拉框的方法数组
+				dictNameList: ['unit_dict'], //数据字典name数组
+			},
+			dataForm: {
+				id: null,
+				code: '',
+				materialId: '',
+				price: '',
+				startTime: new Date().getTime(),
+				endTime: null,
+				remark: '',
+			},
+			setData: true,
+			MaterialList: [],
+			unit: '元/吨',
+			dataRule: {
+				materialId: [
+					{ required: true, message: '原料不能为空', trigger: 'blur' },
+				],
+				price: [{ required: true, message: '单价不能为空', trigger: 'blur' }],
+				startTime: [
+					{
+						required: true,
+						message: '生效开始时间不能为空',
+						trigger: 'change',
+					},
+				],
+			},
+		};
+	},
+	created() {},
+	methods: {
+		getArr() {
+			getMaterialPage({ pageSize: 100, pageNo: 1 }).then((response) => {
+				this.MaterialList = response.data.list;
+			});
+		},
+		setDataForm() {
+			if (this.MaterialList.length > 0) {
+				this.setCode();
+			} else {
+				setTimeout(this.setCode(), 1000);
+			}
+		},
+		setCode() {
+			this.MaterialList.forEach((item) => {
+				if (item.id === this.dataForm.materialId) {
+					this.dataForm.code = item.code;
+					this.unit =
+						'元/' +
+						this.urlOptions.dictArr.dict0.find((d) => d.value === item.unit)
+							.label;
+				}
+			});
+		},
+	},
+};
+</script>

src/views/base/materialPricing/connectTime.vue

@@ -0,0 +1,23 @@
+<!--
+ * @Author: zwq
+ * @Date: 2023-12-05 13:45:59
+ * @LastEditors: zwq
+ * @LastEditTime: 2024-04-10 15:20:11
+ * @Description
+-->
+<template>
+	<div>
+		<span>{{ parseTime(injectData.startTime,'{y}年{m}月{d}日') + '-' + (parseTime(injectData.endTime)?parseTime(injectData.endTime,'{y}年{m}月{d}日'):'永久') }}</span>
+	</div>
+</template>
+<script>
+export default {
+	name: '',
+	props: {
+		injectData: {
+			type: Object,
+			default: () => ({}),
+		},
+	},
+};
+</script>

src/views/base/materialPricing/index.vue

@@ -0,0 +1,182 @@
+<template>
+	<div class="app-container">
+		<!-- 搜索工作栏 -->
+		<search-bar
+			:formConfigs="formConfig"
+			ref="searchBarForm"
+			@headBtnClick="buttonClick" />
+
+		<!-- 列表 -->
+		<base-table
+			v-loading="dataListLoading"
+			:table-props="tableProps"
+			:page="listQuery.pageNo"
+			:limit="listQuery.pageSize"
+			:table-data="tableData">
+			<method-btn
+				v-if="tableBtn.length"
+				slot="handleBtn"
+				:width="90"
+				label="操作"
+				:method-list="tableBtn"
+				@clickBtn="handleClick" />
+		</base-table>
+		<pagination
+			:limit.sync="listQuery.pageSize"
+			:page.sync="listQuery.pageNo"
+			:total="listQuery.total"
+			@pagination="getDataList" />
+
+		<!-- 对话框(添加 / 修改) -->
+		<base-dialog
+			:dialogTitle="addOrEditTitle"
+			:dialogVisible="addOrUpdateVisible"
+			@cancel="handleCancel"
+			@confirm="handleConfirm"
+			:before-close="handleCancel"
+			width="40%">
+			<add-or-update
+				ref="addOrUpdate"
+				@refreshDataList="successSubmit"></add-or-update>
+		</base-dialog>
+	</div>
+</template>
+
+<script>
+import AddOrUpdate from './add-or-updata';
+import connectTime from './connectTime';
+import basicPage from '@/mixins/basic-page';
+import { parseTime } from '@/filter/code-filter';
+import {
+	deleteMaterialPricing,
+	getMaterialPricingPage,
+} from '@/api/base/materialPricing';
+import { getMaterialPage } from '@/api/base/material';
+
+const tableProps = [
+	{
+		prop: 'name',
+		label: '原料名称',
+	},
+	{
+		prop: 'code',
+		label: '原料编码',
+		width: 180,
+	},
+	// {
+	// 	prop: 'price',
+	// 	label: '单价(元/千克)',
+	// 	align: 'right',
+	// },
+	{
+		prop: 'createTime',
+		label: '生效时间',
+		width: 235,
+		subcomponent: connectTime,
+	},
+	{
+		prop: 'remark',
+		label: '备注',
+	},
+];
+
+export default {
+	mixins: [basicPage],
+	data() {
+		return {
+			urlOptions: {
+				getDataListURL: getMaterialPricingPage,
+				deleteURL: deleteMaterialPricing,
+			},
+			tableProps,
+			tableBtn: [
+				this.$auth.hasPermi(`base:material-pricing:update`)
+					? {
+							type: 'edit',
+							btnName: '编辑',
+					  }
+					: undefined,
+				this.$auth.hasPermi(`base:material-pricing:delete`)
+					? {
+							type: 'delete',
+							btnName: '删除',
+					  }
+					: undefined,
+			].filter((v) => v),
+			tableData: [],
+			formConfig: [
+				{
+					type: 'select',
+					label: '原料名称',
+					selectOptions: [],
+					param: 'name',
+					filterable: true,
+				},
+				{
+					type: this.$auth.hasPermi('base:material-pricing:query')
+						? 'button'
+						: '',
+					btnName: '查询',
+					name: 'search',
+					color: 'primary',
+				},
+				{
+					type:
+						this.$auth.hasPermi('base:material-pricing:create') &&
+						this.$auth.hasPermi('base:material-pricing:query')
+							? 'separate'
+							: '',
+				},
+				{
+					type: this.$auth.hasPermi('base:material-pricing:create')
+						? 'button'
+						: '',
+					btnName: '新增',
+					name: 'add',
+					color: 'success',
+					plain: true,
+				},
+			],
+		};
+	},
+	components: {
+		AddOrUpdate,
+	},
+	created() {
+		getMaterialPage({ pageSize: 100, pageNo: 1 }).then((response) => {
+			this.formConfig[0].selectOptions = response.data.list;
+		});
+	},
+	methods: {
+		buttonClick(val) {
+			switch (val.btnName) {
+				case 'search':
+					this.listQuery.pageNo = 1;
+					this.listQuery.pageSize = 20;
+					this.listQuery.materialId = val.name;
+					this.getDataList();
+					break;
+				case 'reset':
+					this.$refs.searchBarForm.resetForm();
+					this.listQuery = {
+						pageSize: 20,
+						pageNo: 1,
+						total: 1,
+					};
+					this.getDataList();
+					break;
+				case 'add':
+					this.addOrEditTitle = '新增';
+					this.addOrUpdateVisible = true;
+					this.addOrUpdateHandle();
+					break;
+				case 'export':
+					this.handleExport();
+					break;
+				default:
+					console.log(val);
+			}
+		},
+	},
+};
+</script>

src/views/bpm/form/formEditor.vue

@@ -299,7 +299,7 @@ export default {
       }
     })
     clipboard.on('error', e => {
-      this.$message.error('代码复制失败')
+      this.$message.warning('代码复制失败')
     })
   },
   created() {

src/views/bpm/oa/leave/detail.vue

@@ -42,7 +42,7 @@ export default {
   created() {
     this.leaveId = this.id || this.$route.query.id;
     if (!this.leaveId) {
-      this.$message.error('未传递 id 参数，无法查看 OA 请假信息');
+      this.$message.warning('未传递 id 参数，无法查看 OA 请假信息');
       return;
     }
     this.getDetail();

src/views/bpm/processInstance/detail.vue

@@ -167,7 +167,7 @@ export default {
   created() {
     this.id = this.$route.query.id;
     if (!this.id) {
-      this.$message.error('未传递 id 参数，无法查看流程信息');
+      this.$message.warning('未传递 id 参数，无法查看流程信息');
       return;
     }
     this.getDetail();
@@ -185,7 +185,7 @@ export default {
       this.processInstanceLoading = true;
       getProcessInstance(this.id).then(response => {
         if (!response.data) {
-          this.$message.error('查询不到流程信息！');
+          this.$message.warning('查询不到流程信息！');
           return;
         }
         // 设置流程信息

src/views/core/analysis/LineChart.vue

@@ -1,7 +1,7 @@
 <!--
  * @Author: zhp
  * @Date: 2023-09-13 09:02:25
- * @LastEditTime: 2023-10-08 15:39:38
+ * @LastEditTime: 2023-10-16 14:56:58
  * @LastEditors: DY
  * @Description:
 -->

src/views/core/analysis/balanceAnalysis/index.vue

@@ -1,8 +1,12 @@
 <template>
   <div class="app-container">
     <search-bar :formConfigs="formConfig" ref="searchBarForm" @headBtnClick="buttonClick" />
-    <base-table v-loading="dataListLoading" :span-method="mergeColumnHandler" :table-props="tableProps" :table-data="tableData" />
+    <div v-if="tableData.length">
-    <balance-chart ref="lineChart" />
+      <base-table v-loading="dataListLoading" :span-method="mergeColumnHandler" :table-props="tableProps" :table-data="tableData" />
+      <SearchBar :formConfigs="[{ label: '产线平衡分析图', type: 'title' }]" />
+      <balance-chart ref="lineChart" />
+    </div>
+    <div v-else class="no-data-bg"></div>
     <!-- <pagination
 			:limit.sync="listQuery.pageSize"
 			:page.sync="listQuery.pageNo"
@@ -89,7 +93,7 @@ export default {
         },
         {
           type: 'button',
-          btnName: '搜索',
+          btnName: '查询',
           name: 'search',
           color: 'primary',
         }
@@ -144,11 +148,6 @@ export default {
       // this.listQuery.lineId = '1672847052717821953'
       // this.listQuery.startTime = '1693497600000';
       // this.listQuery.endTime = '1693843200000';
-      this.tableData.splice(0)
-      this.xData.splice(0)
-      this.yData.splice(0)
-      this.tableProps.splice(0)
-      this.spanArr.splice(0)
       this.urlOptions.getDataListURL(this.listQuery).then(res => {
         console.log(res)
         let arr = [
@@ -228,11 +227,17 @@ export default {
           this.listQuery.lineId = val.lineIds
           this.listQuery.startTime = val.time ? String(new Date(val.time[0]).getTime()) : undefined;
           this.listQuery.endTime = val.time ? String(new Date(val.time[1]).getTime()) : undefined;
-          if (val.time) {
+          if (val.time && val.lineIds) {
+            this.tableData = []
+            this.xData = []
+            this.yData = []
+            this.tableProps = []
+            this.spanArr = []
+            this.timeList = []
             this.getData()
           } else {
             this.$message({
-              message: '请选择时间',
+              message: '请选择产线和时间',
               type: 'warning'
             });
           }

src/views/core/analysis/yieldAnalysis/index.vue

@@ -1,8 +1,12 @@
 <template>
   <div class="app-container">
     <search-bar :formConfigs="formConfig" ref="searchBarForm" @headBtnClick="buttonClick" />
-    <base-table v-loading="dataListLoading" :table-props="tableProps" :table-data="tableData" />
+    <div v-if="tableData.length">
-    <line-chart ref="lineChart" />
+      <base-table v-loading="dataListLoading" :table-props="tableProps" :table-data="tableData" />
+      <SearchBar :formConfigs="[{ label: '产品产量对比图', type: 'title' }]" />
+      <line-chart ref="lineChart" />
+    </div>
+    <div v-else class="no-data-bg"></div>
     <!-- <pagination
 			:limit.sync="listQuery.pageSize"
 			:page.sync="listQuery.pageNo"
@@ -72,7 +76,7 @@ export default {
 				{
 					type: 'datePicker',
 					label: '时间',
-					dateType: 'datetime',
+					dateType: 'month',
 					format: 'yyyy-MM-dd',
 					valueFormat: 'yyyy-MM-dd HH:mm:ss',
 					rangeSeparator: '-',
@@ -82,7 +86,7 @@ export default {
 				},
 				{
 					type: 'button',
-					btnName: '搜索',
+					btnName: '查询',
 					name: 'search',
 					color: 'primary',
 				}
@@ -101,6 +105,8 @@ export default {
 			this.optionArrUrl.forEach((item, index) => {
 				item(params).then((response) => {
 					this.formConfig[index].selectOptions = response.data.list
+          // this.formConfig[0].defaultSelect = response.data.list[0].id
+          this.$set(this.formConfig[0], 'defaultSelect', response.data.list[0].id)
 				});
 			});
     },
@@ -112,11 +118,13 @@ export default {
         let arr = [
           	{
               prop: 'lineName',
-          		label: '产线'
+          		label: '产线',
+              fixed: 'left'
           	},
             {
               prop: 'sum',
-              label: '合计'
+              label: '合计',
+              fixed: 'left'
             },
             {
               prop: res.data ? res.data.nameData[0].name : undefined,
@@ -220,7 +228,6 @@ export default {
       });
     },
     buttonClick(val) {
-      // console.log(val)
 			switch (val.btnName) {
         case 'search':
           this.listQuery.lineIds = val.lineIds ? val.lineIds :undefined

src/views/core/base/equipment/components/AssetsUpload.vue

@@ -0,0 +1,422 @@
+<!--
+    filename: AssetsUpload.vue
+    author: liubin
+    date: 2023-10-12 16:40:14
+    description: 上传资料/图片 组件
+-->
+
+<template>
+	<div class="assets-upload">
+		<section class="operations">
+			<el-button type="text" class="expand-btn" @click="expand = !expand">
+				<i class="el-icon-folder-opened" v-if="expand"></i>
+				<i class="el-icon-folder" v-else></i>
+				展开
+			</el-button>
+			<!-- <div class="preview-btn">
+				<i class="el-icon-view"></i>
+				预览
+			</div> -->
+		</section>
+		<section
+			class="file-area"
+			:style="{
+				height: expand ? 'auto' : isPicMode ? '180px' : '152px',
+				gap: isPicMode ? '0 24px' : '24px',
+				gridAutoRows: isPicMode ? '180px' : '152px',
+			}">
+			<el-upload
+				class="equipment-upload"
+				:style="{ marginBottom: isPicMode ? '48px' : '24px' }"
+				:disabled="disabled"
+				drag
+				:action="uploadUrl"
+				:headers="headers"
+				multiple
+				:show-file-list="false"
+				:before-upload="beforeUpload"
+				:on-success="handleSuccess">
+				<i class="el-icon-upload"></i>
+				<div class="el-upload__text">
+					<span>将文件拖到此处或</span>
+					<em>点击上传</em>
+				</div>
+				<div class="el-upload__tip" slot="tip">
+					{{
+						isPicMode ? '仅支持上传 .jpg .png 格式文件, 且' : ''
+					}}文件大小不超过2MB
+				</div>
+			</el-upload>
+			<!-- <div
+				class="file-list__item"
+				v-for="n in 9"
+				:key="n"
+				:style="{
+					display: n > 4 && !expand ? 'none' : 'block',
+				}"
+				:data-name="n"
+				:class="{ 'default-icon': !isPicMode }">
+				<i class="el-icon-delete"></i>
+			</div> -->
+			<div
+				class="file-list__item"
+				v-for="(file, index) in files"
+				:key="file.fileName"
+				:style="{
+					background: isPicMode
+						? `url(${file.fileUrl}) no-repeat`
+						: `url(${defaultBg}) no-repeat`,
+					backgroundSize: isPicMode ? '100% 100%' : '64px',
+					backgroundPosition: isPicMode ? '0% 0%' : 'center',
+				}"
+				:data-name="file.fileName">
+				<el-button
+					v-if="!disabled"
+					type="text"
+					class="el-icon-delete"
+					style="padding: 0"
+					@click="(e) => handleDelete(file)" />
+			</div>
+		</section>
+	</div>
+</template>
+
+<script>
+import { getAccessToken } from '@/utils/auth';
+import defaultBg from '../../../../../assets/images/default-file-icon.png';
+
+function checkSize(file, message) {
+	const isLt2M = file.size / 1024 / 1024 < 2;
+	if (!isLt2M) {
+		message.error('上传文件大小不能超过 2MB!');
+	}
+	return isLt2M;
+}
+
+function checkPic(file, message) {
+	const isJPG = file.type === 'image/jpeg';
+	const isPNG = file.type === 'image/png';
+	const isPic = isJPG || isPNG;
+	if (!isPic) {
+		message.error('上传图片只能是 JPG/PNG 格式!');
+	}
+	return isPic;
+}
+
+export default {
+	name: 'AssetsUpload',
+	components: {},
+	model: {
+		prop: 'dataSource',
+		event: 'update',
+	},
+	props: {
+		type: {
+			type: String,
+			default: 'image',
+		},
+		dataSource: {
+			type: Array,
+			default: () => [],
+		},
+		equipmentId: {
+			type: String,
+			default: '',
+		},
+		isPicMode: {
+			type: Boolean,
+			default: false,
+		},
+		disabled: {
+			type: Boolean,
+			default: false,
+		},
+	},
+	emits: ['update-filelist'],
+	data() {
+		return {
+			defaultBg,
+			expand: false,
+			headers: { Authorization: 'Bearer ' + getAccessToken() }, // 设置上传的请求头部
+			fileList: [],
+			uploadUrl: process.env.VUE_APP_BASE_API + '/admin-api/infra/file/upload',
+			files: [
+				// 服务器返回的结构
+				// {
+				// 	fileName: 'sf.docs',
+				// 	fileType: 'asset',
+				// 	fileUrl:
+				// 		'https://hbimg.b0.upaiyun.com/cc7475787bd08ed926b68eaf53fa1f2c5473259115e3c-gJdObd_fw658',
+				// },
+				// {
+				// 	fileName: 'sddf.docs',
+				// 	fileType: 'asset',
+				// 	fileUrl: 'https://img0.sc115.com/wm/xqx/pic1/1501xofo4ssolji.jpg',
+				// },
+				// {
+				// 	fileName: 'jjj.docs',
+				// 	fileType: 'asset',
+				// 	fileUrl:
+				// 		'https://www.mms591.com/www.mms591.com-photo/2013081823/1-130QR34544.jpg',
+				// },
+				// {
+				// 	fileName: 'asdfasdf.docs',
+				// 	fileType: 'asset',
+				// 	fileUrl:
+				// 		'https://hbimg.b0.upaiyun.com/8f6bced5f2e38d3a021b2c48d5a98dfb6317e3e12c6a0-QmhJ5v_fw658',
+				// },
+				// {
+				// 	fileName: 'asdkj.docs',
+				// 	fileType: 'asset',
+				// 	fileUrl:
+				// 		'https://www.mms591.com/www.mms591.com-photo/2013013021/1-130130212034.jpg',
+				// },
+				// {
+				// 	fileName: 'lkasjdf.docs',
+				// 	fileType: 'asset',
+				// 	fileUrl:
+				// 		'https://www.mms591.com/www.mms591.com-photo/2013072122/1-130H1223057.jpg',
+				// },
+				// {
+				// 	fileName: 'asdf.docs',
+				// 	fileType: 'asset',
+				// 	fileUrl:
+				// 		'https://img.1ppt.com/uploads/allimg/1212/1-1212101ZH5A2.jpg',
+				// },
+				// {
+				// 	fileName: 'afdffff.docs',
+				// 	fileType: 'asset',
+				// 	fileUrl:
+				// 		'https://www.mms591.com/www.mms591.com-photo/2013051721/1-13051H11945.jpg',
+				// },
+			],
+			updateTimer: null,
+		};
+	},
+	watch: {
+		dataSource: {
+			handler(val) {
+				this.files = JSON.parse(JSON.stringify(val));
+			},
+			immediate: true,
+			deep: true,
+		},
+	},
+	mounted() {},
+	methods: {
+		// handle success, per file!
+		handleSuccess(response, file, fileList) {
+			this.$notify({
+				title: '成功',
+				message: '上传成功! 点击确认保存上传结果',
+				type: 'success',
+			});
+			if (
+				response == null ||
+				!('data' in response) ||
+				response.data == null ||
+				response.data.trim() == ''
+			) {
+				this.$message.warning('上传出错了!');
+				return;
+			}
+			this.files.push({
+				fileName: file.name,
+				fileUrl: response.data,
+				fileType: this.isPicMode ? 1 : 2,
+			});
+			// debugger;
+
+			// 延时更新
+			if (this.updateTimer) {
+				clearTimeout(this.updateTimer);
+			}
+			this.updateTimer = setTimeout(() => {
+				// console.log('[AssetsUpload] 更新上传列表');
+				this.emitFilelist();
+				clearTimeout(this.updateTimer);
+				this.updateTimer = null;
+			}, 500);
+		},
+
+		emitFilelist() {
+			this.$emit('update', this.files);
+		},
+
+		handleRemove(file, fileList) {
+			debugger;
+		},
+
+		handleDelete(file) {
+			// fileName fileType 都可能一样，但 fileUrl 一定不一样
+			this.files = this.files.filter((item) => item.fileUrl != file.fileUrl);
+			this.$notify({
+				title: '成功',
+				message: '删除成功! 需点击确认保存删除结果',
+				type: 'success',
+			});
+			this.emitFilelist();
+		},
+
+		beforeUpload(file) {
+			if (this.isPicMode) {
+				return checkPic(file, this.$message) && checkSize(file, this.$message);
+			}
+			return checkSize(file, this.$message);
+		},
+
+		handleUpload() {
+			switch (this.type) {
+				case 'image':
+					break;
+				case 'asset':
+					break;
+			}
+		},
+		updateFileList(appendFilelist) {
+			// Array
+			this.$emit('update-filelist', this.appendFilelist);
+		},
+	},
+};
+</script>
+
+<style scoped lang="scss">
+.assets-upload {
+	position: relative;
+}
+
+.operations {
+	position: absolute;
+	top: -36px;
+	right: 0;
+	display: flex;
+	align-items: center;
+}
+
+.expand-btn,
+.preview-btn {
+	font-size: 14px;
+	line-height: 1.2;
+	display: inline-block;
+	padding-left: 20px;
+	cursor: pointer;
+	z-index: 1000;
+}
+
+.expand-btn {
+	margin-right: 12px;
+}
+
+.preview-btn {
+	color: #ccc;
+}
+
+.expand-btn,
+.preview-btn:hover,
+.preview-btn.active {
+	// color: #0042d0;
+	color: #0b58ff;
+}
+
+:deep(.equipment-upload) {
+	.el-upload-dragger {
+		width: 188px;
+		height: 128px;
+	}
+
+	.el-icon-upload {
+		margin: 12px 0;
+		font-size: 48px;
+	}
+
+	.el-upload__text {
+		font-size: 12px;
+		line-height: 2px;
+		display: flex;
+		flex-direction: column;
+
+		em {
+			margin-top: 12px;
+		}
+	}
+
+	.el-upload__tip {
+		font-size: 12px;
+		line-height: 1.5;
+		color: #d1d1d1;
+		margin: 0 0 12px;
+		transform: translateY(-12px);
+		user-select: none;
+	}
+}
+
+.equipment-upload {
+	margin-bottom: 24px;
+}
+
+.file-list {
+	padding: 12px;
+	border: 1px solid #ccc;
+}
+
+// custom
+.file-area {
+	display: grid;
+	grid-template-columns: repeat(auto-fill, 188px);
+	grid-auto-rows: 152px;
+	gap: 48px 24px;
+	overflow: hidden;
+}
+
+.file-list__item {
+	height: 128px;
+	background-color: #fff;
+	border: 1px dashed #d9d9d9;
+	border-radius: 6px;
+	-webkit-box-sizing: border-box;
+	box-sizing: border-box;
+	text-align: center;
+	cursor: pointer;
+	position: relative;
+	// overflow: hidden;
+
+	&:hover {
+		.el-icon-delete {
+			display: block;
+		}
+	}
+
+	.el-icon-delete {
+		color: #ccc;
+		position: absolute;
+		top: 8px;
+		right: 8px;
+		display: none;
+
+		&:hover {
+			color: rgb(210, 41, 41);
+		}
+	}
+}
+
+.file-list__item:hover {
+	border-color: #0b58ff;
+}
+
+.file-list__item::after {
+	content: attr(data-name);
+	position: absolute;
+	left: 0;
+	bottom: -26px;
+	font-size: 14px;
+	line-height: 2;
+	color: #616161;
+}
+
+.default-icon {
+	background: url(../../../../../assets/images/default-file-icon.png) no-repeat;
+	background-position: center;
+	background-size: 64px;
+}
+</style>

src/views/core/base/equipment/components/DialogForm.vue

@@ -0,0 +1,313 @@
+<!-- 
+    filename: dialogForm.vue
+    author: liubin
+    date: 2023-08-15 10:32:36
+    description: 弹窗的表单组件
+-->
+
+<template>
+	<el-form
+		ref="form"
+		:model="form"
+		:label-width="`${labelWidth}px`"
+		:size="size"
+		:label-position="labelPosition"
+		v-loading="formLoading">
+		<el-row :gutter="20" v-for="(row, rindex) in rows" :key="rindex">
+			<el-col v-for="col in row" :key="col.label" :span="24 / row.length">
+				<el-form-item :label="col.label" :prop="col.prop" :rules="col.rules">
+					<el-input
+						v-if="col.input"
+						v-model="form[col.prop]"
+						@change="$emit('update', form)"
+						:placeholder="`请输入${col.label}`"
+						v-bind="col.bind" />
+					<el-input
+						v-if="col.textarea"
+						type="textarea"
+						v-model="form[col.prop]"
+						@change="$emit('update', form)"
+						:placeholder="`请输入${col.label}`"
+						v-bind="col.bind" />
+					<el-select
+						v-if="col.select"
+						v-model="form[col.prop]"
+						:placeholder="`请选择${col.label}`"
+						@change="$emit('update', form)"
+						v-bind="col.bind">
+						<el-option
+							v-for="opt in optionListOf[col.prop]"
+							:key="opt.value"
+							:label="opt.label"
+							:value="opt.value" />
+					</el-select>
+					<el-date-picker
+						v-if="col.datetime"
+						v-model="form[col.prop]"
+						type="datetime"
+						:placeholder="`请选择${col.label}`"
+						value-format="timestamp"
+						v-bind="col.bind"></el-date-picker>
+					<el-upload
+						class="upload-in-dialog"
+						v-if="col.upload"
+						:file-list="uploadedFileList"
+						:action="col.url"
+						:on-success="handleUploadSuccess"
+						v-bind="col.bind">
+						<el-button
+							size="small"
+							type="primary"
+							:disabled="col.bind?.disabled || false">
+							点击上传
+						</el-button>
+						<div class="el-upload__tip" slot="tip" v-if="col.uploadTips">
+							{{ col.uploadTips || '只能上传jpg/png文件，大小不超过2MB' }}
+						</div>
+					</el-upload>
+					<el-switch
+						v-if="col.switch"
+						v-model="form[col.prop]"
+						active-color="#0b58ff"
+						inactive-color="#e1e1e1"
+						v-bind="col.bind"></el-switch>
+					<component
+						v-if="col.subcomponent"
+						:key="col.key"
+						:is="col.subcomponent"
+						v-bind="col.bind"
+						:inlineStyle="col.style"></component>
+				</el-form-item>
+			</el-col>
+		</el-row>
+	</el-form>
+</template>
+
+<script>
+/**
+ * 找到最长的label
+ * @param {*} options
+ */
+function findMaxLabelWidth(rows) {
+	let max = 0;
+	rows.forEach((row) => {
+		row.forEach((opt) => {
+			// debugger;
+			if (!opt.label) return 0;
+			if (opt.label.length > max) {
+				max = opt.label.length;
+			}
+		});
+	});
+	return max;
+}
+
+export default {
+	name: 'DialogForm',
+	model: {
+		prop: 'dataForm',
+		event: 'update',
+	},
+	emits: ['update'],
+	components: {},
+	props: {
+		rows: {
+			type: Array,
+			default: () => [],
+		},
+		dataForm: {
+			type: Object,
+			default: () => ({}),
+		},
+		disabled: {
+			type: Boolean,
+			default: false,
+		},
+		labelPosition: {
+			type: String,
+			default: 'right',
+		},
+		size: {
+			type: String,
+			default: '',
+		},
+	},
+	data() {
+		return {
+			formLoading: true,
+			optionListOf: {},
+			uploadedFileList: [],
+			dataLoaded: false,
+		};
+	},
+	computed: {
+		labelWidth() {
+			let max = findMaxLabelWidth(this.rows);
+			// 每个汉字占20px
+			return max * 20;
+			// return max * 20 + 'px';
+		},
+		form: {
+			get() {
+				// if (this.dataLoaded) return this.dataForm;
+				// else return {}
+				return this.dataForm;
+			},
+			set(val) {
+				console.log('set form', val);
+			},
+		},
+	},
+	watch: {
+		rows: {
+			handler() {
+				console.log('watch triggered!');
+				this.$nextTick(() => {
+					this.handleOptions('watch');
+				});
+			},
+			deep: true,
+			immediate: false,
+		},
+	},
+	mounted() {
+		// 处理 options
+		this.handleOptions();
+	},
+	methods: {
+		/** 模拟透传 ref  */
+		validate(cb) {
+			return this.$refs.form.validate(cb);
+		},
+		resetFields(args) {
+			return this.$refs.form.resetFields(args);
+		},
+		// getCode
+		async getCode(url) {
+			const response = await this.$axios(url);
+			return response.data;
+		},
+		async handleOptions(trigger = 'monuted') {
+			console.log('[dialogForm:handleOptions]');
+			const promiseList = [];
+			this.rows.forEach((cols) => {
+				cols.forEach((opt) => {
+					if (opt.value && !this.form[opt.prop]) {
+						// 默认值
+						this.form[opt.prop] = opt.value;
+					}
+
+					if (opt.options) {
+						this.$set(this.optionListOf, opt.prop, opt.options);
+					} else if (opt.url) {
+						// 如果有 depends，则暂时先不获取，注册一个watcher
+						if (opt.depends) {
+							console.log('[handleOptions] setting watch');
+							this.$watch(
+								() => this.form[opt.depends],
+								(id) => {
+									console.log('<', opt.depends, '>', 'changed', id);
+									if (id == null) return;
+									// 清空原有选项
+									this.form[opt.prop] = null;
+									// 获取新的选项
+									this.$axios({
+										url: `${opt.url}?id=${id}`,
+									}).then((res) => {
+										this.$set(
+											this.optionListOf,
+											opt.prop,
+											res.data.map((item) => ({
+												label: item[opt.labelKey ?? 'name'],
+												value: item[opt.valueKey ?? 'id'],
+											}))
+										);
+									});
+								},
+								{
+									immediate: true,
+								}
+							);
+							return;
+						}
+						// 如果是下拉框，或者新增模式下的输入框，才去请求
+						if (opt.select || (opt.input && !this.form?.id)) {
+							promiseList.push(async () => {
+								const response = await this.$axios(opt.url, {
+									method: opt.method ?? 'get',
+								});
+								console.log('[dialogForm:handleOptions:response]', response);
+								if (opt.select) {
+									// 处理下拉框选项
+									const list =
+										'list' in response.data
+											? response.data.list
+											: response.data;
+									this.$set(
+										this.optionListOf,
+										opt.prop,
+										list.map((item) => ({
+											label: item[opt.labelKey ?? 'name'],
+											value: item[opt.valueKey ?? 'id'],
+										}))
+									);
+								} else if (opt.input) {
+									console.log('setting code: ', response.data);
+									// 处理输入框数据
+									this.form[opt.prop] = response.data;
+								}
+							});
+						}
+					}
+				});
+			});
+
+			console.log('[dialogForm:handleOptions] done!');
+
+			// 如果是 watch 触发的，不需要执行进一步的请求
+			if (trigger == 'watch') {
+				this.formLoading = false;
+				return;
+			}
+			try {
+				await Promise.all(promiseList.map((fn) => fn()));
+				this.formLoading = false;
+				this.dataLoaded = true;
+				// console.log("[dialogForm:handleOptions:optionListOf]", this.optionListOf)
+			} catch (error) {
+				console.log('[dialogForm:handleOptions:error]', error);
+				this.formLoading = false;
+			}
+			if (!promiseList.length) this.formLoading = false;
+		},
+		// 上传成功的特殊处理
+		beforeUpload() {},
+		// 上传前的验证规则可通过 bind 属性传入
+		handleUploadSuccess(response, file, fileList) {
+			console.log(
+				'[dialogForm:handleUploadSuccess]',
+				response,
+				file,
+				fileList,
+				this.form
+			);
+			// 保存原始文件名
+			if ('fileNames' in this.form) this.form.fileNames.push(file.name);
+			// 保存完整地址
+			if ('fileUrls' in this.form) this.form.fileUrls.push(response.data);
+			this.$modal.msgSuccess('上传成功');
+		},
+
+		getFileName(fileUrl) {
+			return fileUrl.split('/').pop();
+		},
+	},
+};
+</script>
+
+<style scoped lang="scss">
+.el-date-editor,
+.el-select {
+	width: 100%;
+}
+</style>

src/views/core/base/equipment/components/EquipmentAssets.vue

@@ -1,32 +0,0 @@
-<!-- 
-    filename: EquipmentAssets.vue
-    author: liubin
-    date: 2023-08-22 11:11:18
-    description: 设备资产
--->
-
-<template>
-    <div class="equipment-assets"></div>
-</template>
-
-<script>
-export default {
-    name: "EquipmentAssets",
-    components: {},
-    props: {},
-    data() {
-        return {}
-    },
-    computed: {},
-    methods: {},
-}
-</script>
-
-<style scoped lang="scss">
-.equipment-assets {
-    background: #f1f1f1;
-    padding: 12px;
-    min-height: 128px;
-    margin-top: 8px;
-}
-</style>

src/views/core/base/equipment/components/EquipmentDrawer.vue

@@ -1,8 +1,8 @@
-<!-- 
+<!--
     filename: EquipmentDrawer.vue
     author: liubin
     date: 2023-08-22 14:38:56
-    description: 
+    description:
 -->
 
 <template>
@@ -29,23 +29,28 @@
 				<section v-for="(section, index) in sections" :key="section.key">
 					<SmallTitle v-if="index != 0">{{ section.name }}</SmallTitle>
 
-					<div class="form-part" v-if="section.key == 'base'">
+					<div
+						class="form-part"
+						v-if="section.key == 'base'"
+						style="margin-bottom: 32px">
 						<el-skeleton v-if="!showForm" animated />
-						<DialogForm
+						<EquipmentInfoForm
 							key="drawer-dialog-form"
 							v-if="showForm"
-							ref="form"
+							:disabled="mode.includes('detail')"
-							:dataForm="form"
+							:sync-filelist="syncFileListFlag"
-							:rows="formRows" />
+							v-model="form" />
 					</div>
 
 					<div v-if="section.key == 'attrs'" style="margin-top: 12px">
 						<base-table
 							v-loading="attrListLoading"
 							:table-props="section.props"
-							:page="section.pageNo || 1"
+							:page="attrQuery?.params.pageNo || 1"
-							:limit="section.pageSize || 10"
+							:limit="attrQuery?.params.pageSize || 10"
 							:table-data="list"
+							:add-button-show="mode.includes('detail') ? null : '添加属性'"
+							@emitButtonClick="handleAddAttr"
 							@emitFun="handleEmitFun">
 							<method-btn
 								v-if="section.tableBtn"
@@ -54,27 +59,31 @@
 								:method-list="tableBtn"
 								@clickBtn="handleTableBtnClick" />
 						</base-table>
+
+						<!-- 分页组件 -->
+						<pagination
+							v-show="total > 0"
+							:total="total"
+							:page.sync="attrQuery.params.pageNo"
+							:limit.sync="attrQuery.params.pageSize"
+							@pagination="getAttrList" />
 					</div>
 				</section>
 			</div>
 
 			<div class="drawer-body__footer">
-				<el-button style="margin-right: 10px" @click="handleCancel">
+				<el-button style="" @click="handleCancel">取消</el-button>
-					返回
-				</el-button>
 				<el-button v-if="mode == 'detail'" type="primary" @click="toggleEdit">
 					编辑
 				</el-button>
-				<span v-else>
+				<el-button v-else type="primary" @click="handleConfirm">确定</el-button>
-					<el-button type="primary" @click="handleSave">保存</el-button>
+				<!-- sections的第二项必须是 属性列表  -->
-					<!-- sections的第二项必须是 属性列表  -->
+				<!-- <el-button
-					<el-button
 						v-if="sections[1].allowAdd"
 						type="primary"
 						@click="handleAddAttr">
 						添加属性
-					</el-button>
+					</el-button> -->
-				</span>
 			</div>
 		</div>
 
@@ -99,11 +108,13 @@
 </template>
 
 <script>
-import DialogForm from '@/components/DialogForm';
+import DialogForm from './DialogForm';
+import EquipmentInfoForm from './EquipmentInfoForm.vue';
 
 const SmallTitle = {
 	name: 'SmallTitle',
 	props: ['size'],
+	components: {},
 	data() {
 		return {};
 	},
@@ -127,12 +138,13 @@ const SmallTitle = {
 };
 
 export default {
-	components: { SmallTitle, DialogForm },
+	components: { SmallTitle, DialogForm, EquipmentInfoForm },
 	props: ['sections', 'mode', 'dataId'], // dataId 作为一个通用的存放id的字段
 	data() {
 		return {
 			visible: false,
 			showForm: false,
+			btnLoading: false,
 			total: 0,
 			form: {},
 			list: [],
@@ -161,10 +173,16 @@ export default {
 					},
 				],
 			],
-			attrQuery: null, // 属性列表的请求
+			attrQuery: {
+				params: {
+					pageNo: 1,
+					pageSize: 10,
+				},
+			}, // 属性列表的请求
 			infoQuery: null, // 基本信息的请求
 			attrFormSubmitting: false,
 			attrListLoading: false,
+			syncFileListFlag: null,
 		};
 	},
 	computed: {
@@ -175,15 +193,19 @@ export default {
 						// 重置图片的位置
 						return {
 							...col,
+							bind: {
+								...col.bind,
+							},
 							style: {
 								left: 0,
-								right: 'unset'
+								right: 'unset',
-							}
+							},
-						}
+						};
 					}
 					return {
 						...col,
 						bind: {
+							...col.bind,
 							// 详情 模式下，禁用各种输入
 							disabled: this.mode == 'detail',
 						},
@@ -208,9 +230,52 @@ export default {
 				this.$axios(query).then(({ data }) => {
 					if (section.key == 'base') {
 						this.form = data;
+						// this.form = {
+						// 	code: 'gj',
+						// 	name: '下片机',
+						// 	enName: 'unload',
+						// 	abbr: '',
+						// 	equipmentTypeId: 21084,
+						// 	remark: '备注',
+						// 	id: '1712367395052384257',
+						// 	createTime: 1697095176000,
+						// 	enterTime: 0,
+						// 	productionTime: 0,
+						// 	files: [
+						// 		{
+						// 			fileName: '测试.xlsx',
+						// 			fileUrl: 'https://nimg.ws.126.net/?url=http%3A%2F%2Fdingyue.ws.126.net%2F2022%2F0108%2F0f0c6f30j00r5cle9000sc000hs00gtc.jpg&thumbnail=660x2147483647&quality=80&type=jpg',
+						// 			fileType: 1
+						// 		},
+						// 		{
+						// 			fileName: '测试2.xlsx',
+						// 			fileUrl: 'https://nimg.ws.126.net/?url=http%3A%2F%2Fdingyue.ws.126.net%2F2022%2F0415%2F2cd23619j00racb96000kc000hs00hsc.jpg&thumbnail=660x2147483647&quality=80&type=jpg',
+						// 			fileType: 1
+						// 		},
+						// 		{
+						// 			fileName: '测试3.xlsx',
+						// 			fileUrl: 'https://gimg2.baidu.com/image_search/src=http%3A%2F%2Fsafe-img.xhscdn.com%2Fbw1%2F1fea91a0-d088-409e-b145-e0e61254b28b%3FimageView2%2F2%2Fw%2F1080%2Fformat%2Fjpg&refer=http%3A%2F%2Fsafe-img.xhscdn.com&app=2002&size=f9999,10000&q=a80&n=0&g=0n&fmt=auto?sec=1700031689&t=2e0fe7d1de7f54adff3007efe133d67c',
+						// 			fileType: 1
+						// 		},
+						// 		{
+						// 			fileName: '测试4.xlsx',
+						// 			fileUrl: 'https://pics5.baidu.com/feed/b7003af33a87e950cdfb4b4546eed044faf2b40d.jpeg?token=1d7484cfe4b014dd201f8c8725cab945',
+						// 			fileType: 2
+						// 		},
+						// 		{
+						// 			fileName: '测试5.xlsx',
+						// 			fileUrl: 'https://gimg2.baidu.com/image_search/src=http%3A%2F%2Fsafe-img.xhscdn.com%2Fbw1%2Fe3500876-9c46-4b70-8d37-4799520cdd13%3FimageView2%2F2%2Fw%2F1080%2Fformat%2Fjpg&refer=http%3A%2F%2Fsafe-img.xhscdn.com&app=2002&size=f9999,10000&q=a80&n=0&g=0n&fmt=auto?sec=1700031689&t=4abc1df930e62730e5361a7d3765e0f2',
+						// 			fileType: 2
+						// 		},
+						// 	],
+						// 	tvalue: 0,
+						// 	processingTime: 0,
+						// 	manufacturer: '',
+						// 	spec: '',
+						// 	description: '描述',
+						// };
 						this.showForm = true;
 						this.infoQuery = query;
-						console.log('setting form: ', this.form, data);
 					} else if (section.key == 'attrs') {
 						this.attrQuery = query;
 						this.list = data.list;
@@ -231,6 +296,24 @@ export default {
 					break;
 			}
 		},
+		async handleConfirm() {
+			this.btnLoading = true;
+			this.syncFileListFlag = Math.random();
+
+			this.$nextTick(async () => {
+				const { code, data } = await this.$axios({
+					url: this.sections[0].urlUpdate,
+					method: 'put',
+					data: this.form,
+				});
+				if (code == 0) {
+					this.$modal.msgSuccess('更新成功');
+				}
+
+				this.btnLoading = false;
+				this.handleCancel();
+			});
+		},
 
 		handleEmitFun(val) {
 			console.log('handleEmitFun', val);
@@ -273,12 +356,12 @@ export default {
 
 		// 开启编辑
 		toggleEdit() {
-			this.mode = 'edit';
+			this.$emit('update-mode', 'edit');
 		},
 
 		// 新增属性
 		handleAddAttr() {
-			if (!this.dataId) return this.$message.error('请先创建设备信息');
+			if (!this.dataId) return this.$message.warning('请先创建设备信息');
 			this.attrForm = {
 				id: null,
 				equipmentId: this.dataId,
@@ -331,33 +414,44 @@ export default {
 		},
 
 		// 提交属性表
-		async submitAttrForm() {
+		submitAttrForm() {
-			this.$refs['attrForm'].validate((valid) => {
+			this.$refs['attrForm'].validate(async (valid) => {
 				if (!valid) {
 					return;
 				}
-			});
-			console.log('this.attrform', this.attrForm);
-			const isEdit = this.attrForm.id != null;
-			this.attrFormSubmitting = true;
-			const res = await this.$axios({
-				url: isEdit ? this.sections[1].urlUpdate : this.sections[1].urlCreate,
-				method: isEdit ? 'put' : 'post',
-				data: this.attrForm,
-			});
 
-			if (res.code == 0) {
+				try {
-				this.closeAttrForm();
+					const isEdit = this.attrForm.id != null;
-				this.$message({
+					this.attrFormSubmitting = true;
-					message: `${isEdit ? '更新' : '创建'}成功`,
+					const res = await this.$axios({
-					type: 'success',
+						url: isEdit
-					duration: 1500,
+							? this.sections[1].urlUpdate
-					onClose: () => {
+							: this.sections[1].urlCreate,
-						this.getAttrList();
+						method: isEdit ? 'put' : 'post',
-					},
+						data: this.attrForm,
-				});
+					});
-			}
+
-			this.attrFormSubmitting = false;
+					if (res.code == 0) {
+						this.closeAttrForm();
+						this.$message({
+							message: `${isEdit ? '更新' : '创建'}成功`,
+							type: 'success',
+							duration: 1500,
+							onClose: () => {
+								this.getAttrList();
+							},
+						});
+					}
+					this.attrFormSubmitting = false;
+				} catch (err) {
+					this.$message({
+						message: err,
+						type: 'error',
+						duration: 1500,
+					});
+					this.attrFormSubmitting = false;
+				}
+			});
 		},
 
 		closeAttrForm() {

src/views/core/base/equipment/components/EquipmentInfoForm.vue

@@ -0,0 +1,337 @@
+<!-- 
+    filename: dialogForm.vue
+    author: liubin
+    date: 2023-08-15 10:32:36
+    description: 弹窗的表单组件
+-->
+
+<template>
+	<el-form
+		class="equipment-info-form"
+		ref="form"
+		:model="form"
+		label-width="200px"
+		label-position="top"
+		v-loading="formLoading">
+		<el-row :gutter="20">
+			<el-col :span="8">
+				<el-form-item
+					label="设备名称"
+					prop="name"
+					:rules="[{ required: true, message: '不能为空', trigger: 'blur' }]">
+					<el-input
+						v-model="form.name"
+						:disabled="disabled"
+						placeholder="请输入设备名称"></el-input>
+				</el-form-item>
+			</el-col>
+			<el-col :span="8">
+				<el-form-item label="设备编码" prop="code" :rules="[]">
+					<el-input
+						v-model="form.code"
+						:disabled="disabled"
+						placeholder="请输入设备编码"></el-input>
+				</el-form-item>
+			</el-col>
+			<el-col :span="8">
+				<el-form-item label="英文名称" prop="enName" :rules="[]">
+					<el-input
+						v-model="form.enName"
+						:disabled="disabled"
+						placeholder="请输入英文名称"></el-input>
+				</el-form-item>
+			</el-col>
+		</el-row>
+		<el-row :gutter="20">
+			<el-col :span="8">
+				<el-form-item label="缩写" prop="abbr" :rules="[]">
+					<el-input
+						v-model="form.abbr"
+						:disabled="disabled"
+						placeholder="请输入名称缩写"></el-input>
+				</el-form-item>
+			</el-col>
+			<el-col :span="8">
+				<el-form-item label="设备类型" prop="equipmentTypeId" :rules="[]">
+					<el-select
+						v-model="form.equipmentTypeId"
+						:disabled="disabled"
+						filterable
+						placeholder="请选择设备类型">
+						<el-option
+							v-for="eqType in eqTypeList"
+							:key="eqType.id"
+							:label="eqType.name"
+							:value="eqType.id"></el-option>
+					</el-select>
+				</el-form-item>
+			</el-col>
+			<el-col :span="8">
+				<el-form-item label="备注" prop="remark" :rules="[]">
+					<el-input
+						v-model="form.remark"
+						:disabled="disabled"
+						placeholder="请输入备注"></el-input>
+				</el-form-item>
+			</el-col>
+		</el-row>
+		<el-row :gutter="20">
+			<el-col :span="8">
+				<el-form-item label="生产日期" prop="productionTime" :rules="[]">
+					<el-date-picker
+						v-model="form.enterTime"
+						:disabled="disabled"
+						type="datetime"
+						placeholder="请选择生产日期"
+						value-format="timestamp"></el-date-picker>
+				</el-form-item>
+			</el-col>
+			<el-col :span="8">
+				<el-form-item label="进场日期" prop="enterTime" :rules="[]">
+					<el-date-picker
+						v-model="form.enterTime"
+						:disabled="disabled"
+						type="datetime"
+						placeholder="请选择进场日期"
+						value-format="timestamp"></el-date-picker>
+				</el-form-item>
+			</el-col>
+			<el-col :span="8">
+				<el-form-item
+					label="设备TT值"
+					prop="tvalue"
+					:rules="[
+						{ required: true, message: '不能为空', trigger: 'blur' },
+						{
+							type: 'number',
+							message: '请输入正确的数字值',
+							trigger: 'blur',
+							transform: (val) => Number(val),
+						},
+					]">
+					<el-input
+						v-model="form.tvalue"
+						:disabled="disabled"
+						placeholder="请输入设备TT值"></el-input>
+				</el-form-item>
+			</el-col>
+		</el-row>
+		<el-row :gutter="20">
+			<el-col :span="8">
+				<el-form-item
+					label="产品加工时间(s)"
+					prop="processingTime"
+					:rules="[
+						{ required: true, message: '不能为空', trigger: 'blur' },
+						{
+							type: 'number',
+							message: '请输入正确的数字值',
+							trigger: 'blur',
+							transform: (val) => Number(val),
+						},
+					]">
+					<el-input
+						v-model="form.processingTime"
+						:disabled="disabled"
+						placeholder="请输入产品加工时间"></el-input>
+				</el-form-item>
+			</el-col>
+			<el-col :span="8">
+				<el-form-item label="制造商" prop="manufacturer" :rules="[]">
+					<el-input
+						v-model="form.manufacturer"
+						:disabled="disabled"
+						placeholder="请输入制造商"></el-input>
+				</el-form-item>
+			</el-col>
+			<el-col :span="8">
+				<el-form-item label="设备规格" prop="spec" :rules="[]">
+					<el-input
+						v-model="form.spec"
+						:disabled="disabled"
+						placeholder="请输入设备规格"></el-input>
+				</el-form-item>
+			</el-col>
+		</el-row>
+		<el-row :gutter="20">
+			<!-- 功能描述  -->
+			<el-col>
+				<el-form-item label="功能描述" prop="description" :rules="[]">
+					<el-input
+						type="textarea"
+						:disabled="disabled"
+						v-model="form.description"
+						placeholder="请填写功能描述"></el-input>
+				</el-form-item>
+			</el-col>
+		</el-row>
+		<el-row :gutter="20">
+			<!-- 上传资料  -->
+			<el-col>
+				<el-form-item label="上传资料" prop="assets" :rules="[]">
+					<AssetsUpload v-model="form.assets" :disabled="disabled" />
+				</el-form-item>
+			</el-col>
+		</el-row>
+		<el-row :gutter="20">
+			<!-- 上传图片  -->
+			<el-col>
+				<el-form-item label="上传图片" prop="pics" :rules="[]">
+					<AssetsUpload
+						:is-pic-mode="true"
+						v-model="form.pics"
+						:disabled="disabled" />
+				</el-form-item>
+			</el-col>
+		</el-row>
+	</el-form>
+</template>
+
+<script>
+import AssetsUpload from './AssetsUpload.vue';
+
+export default {
+	name: 'EquipmentInfoForm',
+
+	model: {
+		prop: 'dataForm',
+		event: 'update',
+	},
+
+	emits: ['update'],
+
+	components: { AssetsUpload },
+
+	props: {
+		dataForm: {
+			type: Object,
+			default: () => ({}),
+		},
+		disabled: {
+			type: Boolean,
+			default: false,
+		},
+		syncFilelist: {
+			type: Number,
+			default: null,
+			required: false,
+		},
+	},
+
+	data() {
+		return {
+			formLoading: false,
+			form: {
+				name: '',
+				code: '',
+				enName: '',
+				abbr: '',
+				equipmentTypeId: '',
+				remark: '',
+				productionTime: '',
+				enterTime: '',
+				tvalue: '',
+				processingTime: '',
+				manufacturer: '',
+				spec: '',
+				description: '',
+				assets: [],
+				pics: [],
+			},
+			eqTypeList: [],
+			dataLoaded: false,
+		};
+	},
+
+	watch: {
+		dataForm: {
+			handler(val) {
+				// debugger;
+				this.form = JSON.parse(JSON.stringify(val));
+				this.form.assets =
+					this.form.files?.filter((item) => item.fileType == '2') || [];
+				this.form.pics =
+					this.form.files?.filter((item) => item.fileType == '1') || [];
+				delete this.form.files;
+			},
+			immediate: true,
+			deep: true,
+		},
+		syncFilelist: {
+			handler(val) {
+				if (val != null) {
+					this.updateForm();
+				}
+			},
+			immediate: true,
+		},
+	},
+
+	mounted() {
+		this.getEqTypeList();
+	},
+
+	methods: {
+		updateForm() {
+			console.log('update form ==> ');
+			this.form.files = [...this.form.assets, ...this.form.pics];
+			delete this.form.assets;
+			delete this.form.pics;
+			this.$emit('update', this.form);
+		},
+
+		async getEqTypeList() {
+			this.formLoading = true;
+			const { code, data } = await this.$axios(
+				'/base/equipment-type/page?pageNo=1&pageSize=100'
+			);
+			// debugger;
+			if (code == 0) {
+				this.eqTypeList = data.list;
+			}
+			this.formLoading = false;
+		},
+
+		/** 模拟透传 ref  */
+		validate(cb) {
+			return this.$refs.form.validate(cb);
+		},
+		resetFields(args) {
+			return this.$refs.form.resetFields(args);
+		},
+		// getCode
+		async getCode(url) {
+			const response = await this.$axios(url);
+			return response.data;
+		},
+		// 上传成功的特殊处理
+		beforeUpload() {},
+		// 上传前的验证规则可通过 bind 属性传入
+		handleUploadSuccess(response, file, fileList) {
+			console.log(
+				'[dialogForm:handleUploadSuccess]',
+				response,
+				file,
+				fileList,
+				this.form
+			);
+			// 保存原始文件名
+			if ('fileNames' in this.form) this.form.fileNames.push(file.name);
+			// 保存完整地址
+			if ('fileUrls' in this.form) this.form.fileUrls.push(response.data);
+			this.$modal.msgSuccess('上传成功');
+		},
+
+		getFileName(fileUrl) {
+			return fileUrl.split('/').pop();
+		},
+	},
+};
+</script>
+
+<style scoped lang="scss">
+.el-date-editor,
+.el-select {
+	width: 100%;
+}
+</style>

src/views/core/base/equipment/components/EquipmentPics.vue

@@ -1,111 +0,0 @@
-<!-- 
-    filename: EquipmentPics.vue
-    author: liubin
-    date: 2023-08-18 16:29:39
-    description: 
--->
-
-<template>
-	<div class="equipment-pics">
-		<div v-for="(url, idx) in images" :key="url">
-			<img :src="url" :alt="url" />
-			<figure class="big-img" :style="inlineStyle">
-				<img :src="url" :alt="url" />
-				<figcaption>{{ desc[idx] }}</figcaption>
-			</figure>
-		</div>
-	</div>
-</template>
-
-<script>
-export default {
-	name: 'EquipmentPics',
-	components: {},
-	props: {
-		inlineStyle: {
-			type: Object,
-			default: () => ({}),
-		},
-	},
-	data() {
-		return {
-			desc: [
-				'车间设备 - 1',
-				'车间设备 - 2',
-				'车间设备 - 3',
-				'车间设备 - 4',
-				'车间设备 - 5',
-				'车间设备 - 6',
-				'车间设备 - 7',
-				'车间设备 - 8',
-				'车间设备 - 9',
-				'车间设备 - 10',
-				'车间设备 - 11',
-				'车间设备 - 12',
-			],
-			images: Array(10)
-				.fill(1)
-				.map((_, index) => require(`../assets/eq${index + 1}.jpg`)),
-		};
-	},
-	methods: {},
-};
-</script>
-
-<style scoped lang="scss">
-.equipment-pics {
-	// background: #cfcfcf;
-	padding: 12px;
-	// margin: 8px;
-	display: flex;
-	overflow-x: auto;
-}
-
-.equipment-pics > div {
-	height: 100px;
-	position: relative;
-	cursor: pointer;
-}
-
-.equipment-pics > div:not(:last-child) {
-	margin-right: 12px;
-}
-
-.equipment-pics > div > img {
-	height: 95%;
-}
-
-.equipment-pics > div > figure {
-	display: none;
-	position: fixed;
-	// inset: 0;
-	// margin: auto;
-	top: 0;
-	right: 0;
-	// width: 640px;
-	// height: 480px;
-	background: #000;
-	overflow: hidden;
-	padding: 8px 8px 0;
-}
-
-.equipment-pics > div:hover > figure {
-	margin: 0;
-	display: flex;
-	flex-direction: column;
-	align-items: center;
-	justify-content: center;
-}
-
-.equipment-pics > div > figure > img {
-	flex: 1;
-}
-
-.equipment-pics > div > figure > figcaption {
-	height: 24px;
-	margin-top: 8px;
-	font-size: 18px;
-	line-height: 1;
-	color: #fff;
-}
-</style>

src/views/core/base/equipment/index.vue

@@ -36,13 +36,17 @@
 			:dialogVisible="open"
 			@close="cancel"
 			@cancel="cancel"
+			width="60%"
 			@confirm="submitForm">
 			<DialogForm
 				v-if="open"
 				key="index-dialog-form"
 				ref="form"
-				:dataForm="form"
+				label-position="top"
-				:rows="rows" />
+				size="small"
+				v-model="form"
+				:rows="computedRows"
+				:has-file="true" />
 		</base-dialog>
 
 		<!-- 设备 详情 - 编辑 -->
@@ -50,12 +54,13 @@
 			v-if="editVisible"
 			ref="drawer"
 			:mode="editMode"
+			@update-mode="editMode = $event"
 			:data-id="form.id"
 			:sections="[
 				{
 					name: '基本信息',
 					key: 'base',
-					rows: rows,
+					rows: computedRows,
 					url: '/base/equipment/get',
 					urlUpdate: '/base/equipment/update',
 					urlCreate: '/base/equipment/create',
@@ -93,17 +98,14 @@
 				},
 			]"
 			@refreshDataList="getList"
-			@cancel="editVisible = false"
+			@cancel="cancelEdit"
-			@destroy="editVisible = false" />
+			@destroy="cancelEdit" />
 	</div>
 </template>
 
 <script>
 import moment from 'moment';
 import basicPageMixin from '@/mixins/lb/basicPageMixin';
-import { getAccessToken } from '@/utils/auth';
-import EquipmentPics from './components/EquipmentPics';
-import EquipmentAssets from './components/EquipmentAssets';
 import EquipmentDrawer from './components/EquipmentDrawer';
 
 import {
@@ -115,6 +117,7 @@ import {
 	exportEquipmentExcel,
 } from '@/api/base/equipment';
 import Editor from '@/components/Editor';
+import AssetsUpload from './components/AssetsUpload.vue';
 
 export default {
 	name: 'Equipment',
@@ -127,6 +130,12 @@ export default {
 		return {
 			searchBarKeys: ['name', 'code'],
 			tableBtn: [
+				this.$auth.hasPermi(`base:equipment:update`)
+					? {
+							type: 'detail',
+							btnName: '详情',
+					  }
+					: undefined,
 				this.$auth.hasPermi('base:equipment:update')
 					? {
 							type: 'edit',
@@ -139,12 +148,6 @@ export default {
 							btnName: '删除',
 					  }
 					: undefined,
-				this.$auth.hasPermi(`base:equipment:update`)
-					? {
-							type: 'detail',
-							btnName: '详情',
-					  }
-					: undefined,
 			].filter((v) => v),
 			tableProps: [
 				{
@@ -155,7 +158,7 @@ export default {
 					filter: (val) => moment(val).format('yyyy-MM-DD HH:mm:ss'),
 				},
 				{ prop: 'name', label: '设备名称' },
-				{ width: 256, prop: 'code', label: '检测编码' },
+				{ width: 256, prop: 'code', label: '设备编码' },
 				{ prop: 'equipmentType', label: '设备类型' },
 				{ prop: 'enName', label: '英文名称' },
 				{ prop: 'abbr', label: '缩写' },
@@ -208,6 +211,12 @@ export default {
 				{
 					type: 'separate',
 				},
+				{
+					type: this.$auth.hasPermi('base:equipment:export') ? 'button' : '',
+					btnName: '导出',
+					name: 'export',
+					color: 'warning',
+				},
 				{
 					type: this.$auth.hasPermi('base:equipment:create') ? 'button' : '',
 					btnName: '新增',
@@ -215,12 +224,6 @@ export default {
 					plain: true,
 					color: 'success',
 				},
-				{
-					type: this.$auth.hasPermi('base:equipment:export') ? 'button' : '',
-					btnName: '导出',
-					name: 'export',
-					color: 'warning',
-				},
 			],
 			rows: [
 				[
@@ -239,8 +242,6 @@ export default {
 						prop: 'code',
 						url: '/base/equipment/getCode',
 					},
-				],
-				[
 					{
 						input: true,
 						label: '英文名称',
@@ -250,6 +251,8 @@ export default {
 						// 	disabled: true, // some condition, like detail mode...
 						// }
 					},
+				],
+				[
 					{
 						input: true,
 						label: '缩写',
@@ -259,13 +262,15 @@ export default {
 						// 	disabled: true, // some condition, like detail mode...
 						// }
 					},
-				],
+
-				[
 					{
 						select: true,
 						label: '设备类型',
 						prop: 'equipmentTypeId',
 						url: '/base/equipment-type/page?pageNo=1&pageSize=100',
+						bind: {
+							filterable: true,
+						},
 					},
 					// {
 					// 	select: true,
@@ -286,8 +291,6 @@ export default {
 						label: '进厂日期',
 						prop: 'enterTime',
 					},
-				],
-				[
 					{
 						input: true,
 						prop: 'tvalue',
@@ -302,11 +305,14 @@ export default {
 							},
 						],
 					},
+				],
+				[
 					{
 						input: true,
-						label: '产品加工时间',
+						label: '产品加工时间（s）',
 						prop: 'processingTime',
 						rules: [
+							{ required: true, message: '不能为空', trigger: 'blur' },
 							{
 								type: 'number',
 								message: '请输入正确的数字值',
@@ -315,8 +321,7 @@ export default {
 							},
 						],
 					},
-				],
+
-				[
 					{
 						input: true,
 						label: '制造商',
@@ -337,40 +342,79 @@ export default {
 						prop: 'description',
 					},
 				],
-				[
+				// [
-					{
+				// 	{
-						upload: true,
+				// 		assetUpload: true,
-						label: '上传资料',
+				// 		label: '上传资料',
-						prop: 'uploadFiles',
+				// 		fieldName: 'assets',
-						url: process.env.VUE_APP_BASE_API + '/admin-api/infra/file/upload', // 请求地址
+				// 		subcomponent: AssetsUpload
-						bind: {
+				// 	},
-							headers: { Authorization: 'Bearer ' + getAccessToken() },
+				// ],
-							'show-file-list': false,
+				// [
-						},
+				// 	{
-					},
+				// 		assetUpload: true,
-				],
+				// 		label: '上传图片',
-				[
+				// 		fieldName: 'images',
-					{
+				// 		subcomponent: AssetsUpload
-						diy: true,
+				// 	},
-						key: 'eq-assets',
+				// ],
-						label: '设备资料',
+				// [
-						prop: 'fileNames',
+				// 	{
-						subcomponent: EquipmentAssets,
+				// 		upload: true,
-					},
+				// 		label: '上传资料',
-				],
+				// 		prop: 'uploadFiles',
-				[
+				// 		url: process.env.VUE_APP_BASE_API + '/admin-api/infra/file/upload', // 请求地址
-					{
+				// 		uploadFnName: 'assetsUpload', // 上传方法名
-						diy: true,
+				// 		bind: {
-						key: 'eq-pics',
+				// 			headers: { Authorization: 'Bearer ' + getAccessToken() },
-						label: '设备图片',
+				// 			'show-file-list': false,
-						prop: 'fileUrls',
+				// 		},
-						subcomponent: EquipmentPics,
+				// 	},
-						pictures: async () => {
+				// 	{
-							// some async request
+				// 		diy: true,
-							return [];
+				// 		key: 'eq-assets',
-						},
+				// 		label: '设备资料',
-					},
+				// 		prop: 'fileNames',
-				],
+				// 		subcomponent: EquipmentAssets,
+				// 	},
+				// ],
+				// [
+				// {
+				// 		upload: true,
+				// 		label: '上传图片',
+				// 		prop: 'uploadImages',
+				// 		url: process.env.VUE_APP_BASE_API + '/admin-api/infra/file/upload', // 请求地址
+				// 		uploadFnName: 'imagesUpload', // 上传方法名
+				// 		bind: {
+				// 			headers: { Authorization: 'Bearer ' + getAccessToken() },
+				// 			'show-file-list': false,
+				// 		},
+				// 	},
+				// 	{
+				// 		diy: true,
+				// 		key: 'eq-pics',
+				// 		label: '设备图片',
+				// 		prop: 'fileUrls',
+				// 		subcomponent: EquipmentPics,
+				// 		pictures: async () => {
+				// 			// some async request
+				// 			return [];
+				// 		},
+				// 	},
+				// ],
+				// [
+				// 	{
+				// 		diy: true,
+				// 		key: 'eq-pics',
+				// 		label: '设备图片',
+				// 		prop: 'fileUrls',
+				// 		subcomponent: EquipmentPics,
+				// 		pictures: async () => {
+				// 			// some async request
+				// 			return [];
+				// 		},
+				// 	},
+				// ],
 			],
 			editVisible: false,
 			editMode: 'edit', // 'edit', 'detail'
@@ -399,11 +443,49 @@ export default {
 			form: {
 				id: null,
 			},
+			showUploadComponents: false, // 是否显示上传组件
 		};
 	},
 	created() {
 		this.getList();
 	},
+	computed: {
+		computedRows() {
+			return this.showUploadComponents
+				? [
+						...this.rows,
+						[
+							{
+								assetUpload: true,
+								key: 'eq-assets', // 用于区分不同的上传组件
+								label: '上传资料',
+								fieldName: 'assets',
+								subcomponent: AssetsUpload,
+								prop: 'uploadedAssets',
+								default: [],
+								bind: {
+									'is-pic-mode': false,
+								},
+							},
+						],
+						[
+							{
+								assetUpload: true,
+								key: 'eq-pics', // 用于区分不同的上传组件
+								label: '上传图片',
+								fieldName: 'images',
+								subcomponent: AssetsUpload,
+								// prop: '',
+								// default: [],
+								bind: {
+									'is-pic-mode': true,
+								},
+							},
+						],
+				  ]
+				: this.rows;
+		},
+	},
 	methods: {
 		/** 查询列表 */
 		getList() {
@@ -420,6 +502,10 @@ export default {
 			this.open = false;
 			this.reset();
 		},
+		cancelEdit() {
+			this.showUploadComponents = false;
+			this.editVisible = false;
+		},
 		/** 表单重置 */
 		reset() {
 			this.form = {
@@ -445,11 +531,13 @@ export default {
 		handleAdd() {
 			this.reset();
 			this.open = true;
+			this.showUploadComponents = false;
 			this.title = '添加设备';
 		},
 		/** 修改按钮操作 */
 		handleUpdate(row) {
 			this.reset();
+			this.showUploadComponents = true;
 			const id = row.id;
 			getEquipment(id).then((response) => {
 				this.form = response.data;
@@ -516,6 +604,7 @@ export default {
 		viewDetail(id) {
 			this.reset();
 			this.editMode = 'detail';
+			this.showUploadComponents = true;
 			this.form.id = id;
 			this.editVisible = true;
 			this.$nextTick(() => {
@@ -524,11 +613,11 @@ export default {
 		},
 		// overwrite basicPageMixin 里的 处理表格按钮 方法
 		handleTableBtnClick({ data, type }) {
-			console.log('[handleTableBtnClick]', data, type);
 			switch (type) {
 				case 'edit':
 					this.reset();
 					this.editMode = 'edit';
+					this.showUploadComponents = true;
 					this.form.id = data.id;
 					this.editVisible = true;
 					this.$nextTick(() => {

src/views/core/base/equipmentType/index.vue

@@ -37,7 +37,12 @@
 			@close="cancel"
 			@cancel="cancel"
 			@confirm="submitForm">
-			<DialogForm v-if="open" ref="form" :dataForm="form" :rows="rows" />
+			<DialogForm
+				v-if="open"
+				ref="form"
+				v-model="form"
+				:rows="rows"
+				:has-file="true" />
 		</base-dialog>
 	</div>
 </template>
@@ -55,7 +60,7 @@ import {
 	exportEquipmentTypeExcel,
 } from '@/api/base/equipmentType';
 
-import { getAccessToken } from '@/utils/auth';
+// import { getAccessToken } from '@/utils/auth';
 
 export default {
 	name: 'EquipmentType',
@@ -86,9 +91,9 @@ export default {
 					width: 180,
 					filter: (val) => moment(val).format('yyyy-MM-DD HH:mm:ss'),
 				},
-				{ prop: 'name', label: '设备类型名称',  },
+				{ prop: 'name', label: '设备类型名称' },
-				{ prop: 'code', label: '检测类型编码',  },
+				{ prop: 'code', label: '检测类型编码' },
-				{ prop: 'remark', label: '备注',  },
+				{ prop: 'remark', label: '备注' },
 			],
 			searchBarFormConfig: [
 				{
@@ -149,15 +154,13 @@ export default {
 						prop: 'parentId',
 						url: '/base/equipment-type/page?pageNo=1&pageSize=100',
 					},
+					{},
+				],
+				[
 					{
 						upload: true,
 						label: '上传资料',
-						prop: 'uploadFiles',
+						prop: 'files',
-						url: process.env.VUE_APP_BASE_API + '/admin-api/infra/file/upload', // 请求地址
-						bind: {
-							headers: { Authorization: 'Bearer ' + getAccessToken() },
-							'show-file-list': false,
-						},
 					},
 				],
 				[{ input: true, label: '备注', prop: 'remark' }],
@@ -209,8 +212,6 @@ export default {
 				name: undefined,
 				parentId: undefined,
 				remark: undefined,
-				fileNames: [],
-				fileUrls: [],
 			};
 			this.resetForm('form');
 		},
@@ -236,6 +237,25 @@ export default {
 			const id = row.id;
 			getEquipmentType(id).then((response) => {
 				this.form = response.data;
+				// this.form = {
+				// 	code: 'SBLX20230925184444000041',
+				// 	name: '测试131',
+				// 	remark: '测试可删除',
+				// 	id: '1706258479729336322',
+				// 	files: [
+				// 		{ fileName: '1.png', fileUrl: '', fileType: 2 },
+				// 		{ fileName: '1.asdfaslkjfkasdf.png', fileUrl: '', fileType: 2 },
+				// 		{ fileName: '2.txt', fileUrl: '', fileType: 2 },
+				// 		{ fileName: '1.rar', fileUrl: '', fileType: 2 },
+				// 		{ fileName: '1.kkk', fileUrl: '', fileType: 2 },
+				// 		{ fileName: 'test.file', fileUrl: '', fileType: 2 },
+				// 		{ fileName: '222', fileUrl: '', fileType: 2 },
+				// 		{ fileName: 'g', fileUrl: '', fileType: 2 },
+				// 	],
+				// 	createTime: 1695638697000,
+				// 	parentId: '1701869972319584257',
+				// };
+				// debugger;
 				this.open = true;
 				this.title = '修改设备类型';
 			});
@@ -267,7 +287,7 @@ export default {
 		handleDelete(row) {
 			const id = row.id;
 			this.$modal
-				.confirm('是否确认删除设备类型编号为"' + id + '"的数据项?')
+				.confirm('是否确认删除设备类型"' + row.name + '"?')
 				.then(function () {
 					return deleteEquipmentType(id);
 				})

src/views/core/base/factory/add-or-updata.vue

@@ -1,8 +1,8 @@
 <!--
  * @Author: zwq
  * @Date: 2021-11-18 14:16:25
- * @LastEditors: zwq
+ * @LastEditors: DY
- * @LastEditTime: 2023-08-01 16:59:06
+ * @LastEditTime: 2023-10-16 11:16:48
  * @Description:
 -->
 <template>
@@ -12,21 +12,30 @@
 		ref="dataForm"
 		@keyup.enter.native="dataFormSubmit()"
 		label-width="80px">
-		<el-form-item label="工厂编码" prop="code">
+		<el-row :gutter="20">
-			<el-input
+			<el-col :span="12">
-				v-model="dataForm.code"
+				<el-form-item label="工厂编码" prop="code">
-				clearable
+					<el-input
-				placeholder="请输入工厂编码" />
+						v-model="dataForm.code"
-		</el-form-item>
+						clearable
-		<el-form-item label="工厂名称" prop="name">
+						placeholder="请输入工厂编码" />
-			<el-input
+				</el-form-item>
-				v-model="dataForm.name"
+			</el-col>
-				clearable
+			<el-col :span="12">
-				placeholder="请输入工厂名称" />
+				<el-form-item label="工厂名称" prop="name">
-		</el-form-item>
+					<el-input
-		<el-form-item label="地址" prop="address">
+						v-model="dataForm.name"
-			<el-input v-model="dataForm.address" clearable placeholder="请输入地址" />
+						clearable
-		</el-form-item>
+						placeholder="请输入工厂名称" />
+				</el-form-item>
+			</el-col>
+		</el-row>
+		<el-row :gutter="20">
+			<el-col :span="12">
+				<el-form-item label="地址" prop="address">
+					<el-input v-model="dataForm.address" clearable placeholder="请输入地址" />
+				</el-form-item>
+			</el-col>
 		<!-- <el-form-item label="启用状态" prop="enabled">
 			<el-select
 				v-model="dataForm.enabled"
@@ -38,9 +47,12 @@
 					:value="dict.value" />
 			</el-select>
 		</el-form-item> -->
-		<el-form-item label="备注" prop="remark">
+			<el-col :span="12">
-			<el-input v-model="dataForm.remark" clearable placeholder="请输入备注" />
+				<el-form-item label="备注" prop="remark">
-		</el-form-item>
+					<el-input v-model="dataForm.remark" clearable placeholder="请输入备注" />
+				</el-form-item>
+			</el-col>
+		</el-row>
 	</el-form>
 </template>
 

src/views/core/base/factory/index.vue

@@ -29,7 +29,7 @@
 			@cancel="handleCancel"
 			@confirm="handleConfirm"
 			:before-close="handleCancel"
-			width="70%">
+			width="50%">
 			<add-or-update
 				ref="addOrUpdate"
 				@refreshDataList="successSubmit"></add-or-update>
@@ -154,7 +154,7 @@ export default {
 			switch (val.btnName) {
 				case 'search':
 					this.listQuery.pageNo = 1;
-					this.listQuery.pageSize = 10;
+					this.listQuery.pageSize = 20;
 					this.listQuery.name = val.name;
 					this.listQuery.code = val.code;
 					this.getDataList();

src/views/core/base/lineBindProduct/index.vue

@@ -2,15 +2,14 @@
  * @Author: zwq
  * @Date: 2023-08-02 15:12:42
  * @LastEditors: DY
- * @LastEditTime: 2023-10-10 16:49:03
+ * @LastEditTime: 2023-10-13 16:35:03
  * @Description:
 -->
 <template>
 	<div class="app-container">
 		<search-bar
-			:formConfigs="formConfig"
+			:formConfigs="[{ label: '产线在制产品', type: 'title' }]"
-			ref="searchBarForm"
+			ref="searchBarForm" />
-			@headBtnClick="buttonClick" />
 		<base-table
 			v-loading="dataListLoading"
 			:table-props="tableProps"
@@ -36,20 +35,17 @@ import { getProductPage } from '@/api/core/base/product';
 const tableProps = [
 	{
 		prop: 'lineName',
-		label: '产线',
+		label: '产线'
-		align: 'center',
 	},
 	{
 		prop: 'productName',
 		label: '在制产品',
-		align: 'center',
 		list: [],
 		subcomponent: selectProduct,
 	},
 	{
 		prop: 'recordTime',
 		label: '开始时间',
-		align: 'center',
 		filter: parseTime,
 	},
 ];
@@ -63,14 +59,14 @@ export default {
 			},
 			tableProps,
 			tableData: [],
-			formConfig: [
+			// formConfig: [
-				{
+			// 	{
-					type: 'button',
+			// 		type: 'button',
-					btnName: '同步',
+			// 		btnName: '同步',
-					name: 'search',
+			// 		name: 'search',
-					color: 'primary',
+			// 		color: 'primary',
-				},
+			// 	},
-			],
+			// ],
 		};
 	},
 	components: {},
@@ -89,7 +85,7 @@ export default {
 			switch (val.btnName) {
 				case 'search':
 					this.listQuery.pageNo = 1;
-					this.listQuery.pageSize = 10;
+					this.listQuery.pageSize = 20;
 					this.getDataList();
 					break;
 				default:

src/views/core/base/lineBindProduct/selectProduct.vue

@@ -2,12 +2,11 @@
  * @Author: zwq
  * @Date: 2023-08-03 14:09:18
  * @LastEditors: DY
- * @LastEditTime: 2023-10-10 16:54:09
+ * @LastEditTime: 2023-10-13 16:47:25
  * @Description:
 -->
 <template>
 	<div class="tableInner">
-		<el-input readonly v-model="list.productName" style="width: 50%;" ></el-input>
 		<el-popover
     placement="top"
     title="切换在制产品"
@@ -28,8 +27,11 @@
 					确定
 				</el-button>
 			</div>
-			<el-button type="text" slot="reference">切换</el-button>
+			<el-button type="text" slot="reference">
+				<svg-icon icon-class="changelogo"/>
+			</el-button>
 		</el-popover>
+		<el-input readonly v-model="list.productName" style="width: 50%;margin-left: 5px" ></el-input>
 	</div>
 </template>
 <script>
@@ -61,6 +63,7 @@ export default {
 			switchLineBindProduct(data).then((response) => {
 				this.$modal.msgSuccess('修改成功');
 				this.visible = false;
+				this.list.productName = this.list.string.split('+')[1]
 				this.$emit('emitData');
 			});
 		},

src/views/core/base/lineBindProductLog/index.vue

@@ -28,24 +28,20 @@ import { getProductPage } from '@/api/core/base/product';
 const tableProps = [
 	{
 		prop: 'productionLineName',
-		label: '产线',
+		label: '产线'
-		align: 'center',
 	},
 	{
 		prop: 'productName',
-		label: '在制产品',
+		label: '在制产品'
-		align: 'center',
 	},
 	{
 		prop: 'startTime',
 		label: '开始时间',
-		align: 'center',
 		filter: parseTime,
 	},
 	{
 		prop: 'endTime',
 		label: '结束时间',
-		align: 'center',
 		filter: parseTime,
 	},
 ];
@@ -86,7 +82,8 @@ export default {
 					rangeSeparator: '-',
 					startPlaceholder: '开始时间',
 					endPlaceholder: '结束时间',
-					param: 'createTime',
+					param: 'startTime',
+					valueFormat: 'timestamp'
 				},
 				{
 					type: 'button',
@@ -123,10 +120,10 @@ export default {
 			switch (val.btnName) {
 				case 'search':
 					this.listQuery.pageNo = 1;
-					this.listQuery.pageSize = 10;
+					this.listQuery.pageSize = 20;
 					this.listQuery.productionLineId = val.productionLineId;
 					this.listQuery.productId = val.productId;
-					this.listQuery.createTime = val.createTime;
+					this.listQuery.startTime = val.startTime;
 					this.getDataList();
 					break;
 				case 'reset':

src/views/core/base/product/add-or-updata.vue

@@ -43,7 +43,7 @@
 							<el-form-item label="产品类型" prop="typeDictValue">
 								<el-select
 									v-model="dataForm.typeDictValue"
-                  style="width: 100%"
+									style="width: 100%"
 									:disabled="isdetail"
 									placeholder="请选择产品类型">
 									<el-option
@@ -58,7 +58,7 @@
 							<el-form-item label="单位" prop="unitDictValue">
 								<el-select
 									v-model="dataForm.unitDictValue"
-                  style="width: 100%"
+									style="width: 100%"
 									:disabled="isdetail"
 									placeholder="请选择单位">
 									<el-option
@@ -83,8 +83,8 @@
 							<el-form-item label="单位平方数" prop="area">
 								<el-input
 									:disabled="isdetail"
-                  v-model="dataForm.area"
+									v-model="dataForm.area"
-                  placeholder="请输入单位平方数" />
+									placeholder="请输入单位平方数" />
 							</el-form-item>
 						</el-col>
 					</el-row>
@@ -111,6 +111,8 @@
 						:table-props="tableProps"
 						:page="listQuery.pageNo"
 						:limit="listQuery.pageSize"
+						:add-button-show="isdetail ? null : '添加属性'"
+						@emitButtonClick="addNew()"
 						:table-data="productAttributeList">
 						<method-btn
 							v-if="!isdetail"
@@ -123,15 +125,15 @@
 					<pagination
 						v-show="listQuery.total > 0"
 						:total="listQuery.total"
-						:page.sync="listQuery.current"
+						:page.sync="listQuery.pageNo"
-						:limit.sync="listQuery.size"
+						:limit.sync="listQuery.pageSize"
 						:page-sizes="[5, 10, 15]"
 						@pagination="getList" />
 				</div>
 			</div>
 		</div>
 
-		<div style="position: absolute; bottom: 24px; right: 24px">
+		<!-- <div style="position: absolute; bottom: 24px; right: 24px">
 			<el-button style="margin-right: 10px" @click="goback()">返回</el-button>
 			<el-button v-if="isdetail" type="primary" @click="goEdit()">
 				编辑
@@ -145,6 +147,14 @@
 					添加属性
 				</el-button>
 			</span>
+		</div> -->
+
+		<div class="drawer-body__footer">
+			<el-button style="" @click="goback()">取消</el-button>
+			<el-button v-if="isdetail" type="primary" @click="goEdit()">
+				编辑
+			</el-button>
+			<el-button v-else type="primary" @click="dataFormSubmit()">确定</el-button>
 		</div>
 
 		<product-attr-add
@@ -250,12 +260,12 @@ export default {
 					},
 				],
 				area: [
-					// {
+					{
-					// 	type: 'float',
+						type: 'number',
-					// 	message: '单位平方数为浮点类型',
+						message: '请输入正确的数值',
-					// 	trigger: 'blur',
+						trigger: 'change',
-					// 	transfom: 'val => Float(val)',
+						transform: (val) => Number(val),
-					// },
+					},
 				],
 				processTime: [
 					{
@@ -263,12 +273,12 @@ export default {
 						message: '完成单位产品用时不能为空',
 						trigger: 'blur',
 					},
-					// {
+					{
-					// 	type: 'number',
+						type: 'number',
-					// 	message: '完成单位产品用时为浮点类型',
+						message: '请输入正确的数值',
-					// 	trigger: 'blur',
+						trigger: 'blur',
-					// 	transfom: 'val => Number(val)',
+						transform: (val) => Number(val),
-					// },
+					},
 				],
 			},
 			isdetail: false,
@@ -277,6 +287,7 @@ export default {
 	methods: {
 		initData() {
 			this.productAttributeList.splice(0);
+			this.listQuery.total = 0;
 		},
 		init(id, isdetail) {
 			this.initData();
@@ -304,12 +315,10 @@ export default {
 
 		getList() {
 			// 获取产品的属性列表
-			const params = {
+			getProductAttrPage({
-				pageSize: 10,
+				...this.listQuery,
-				pageNo: 1,
 				productId: this.dataForm.id,
-			};
+			}).then((response) => {
-			getProductAttrPage(params).then((response) => {
 				this.productAttributeList = response.data.list;
 				this.listQuery.total = response.data.total;
 			});
@@ -390,6 +399,8 @@ export default {
 <style scoped>
 .drawer >>> .el-drawer {
 	border-radius: 8px 0 0 8px;
+	display: flex;
+	flex-direction: column;
 }
 
 .drawer >>> .el-form-item__label {
@@ -400,14 +411,20 @@ export default {
 	margin: 0;
 	padding: 32px 32px 24px;
 	border-bottom: 1px solid #dcdfe6;
-	margin-bottom: 30px;
+}
+.drawer >>> .el-drawer__body {
+	flex: 1;
+	height: 1px;
+	display: flex;
+	flex-direction: column;
 }
 
 .drawer >>> .content {
-	padding: 0 24px 30px;
+	padding: 30px 24px;
+	flex: 1;
 	display: flex;
 	flex-direction: column;
-	height: 100%;
+	/* height: 100%; */
 }
 
 .drawer >>> .visual-part {
@@ -422,4 +439,10 @@ export default {
 .drawer >>> .attr-list {
 	padding: 0 16px;
 }
+
+.drawer-body__footer {
+	display: flex;
+	justify-content: flex-end;
+	padding: 18px;
+}
 </style>

src/views/core/base/product/index.vue

@@ -1,8 +1,8 @@
 <!--
  * @Author: zwq
  * @Date: 2023-08-01 14:55:51
- * @LastEditors: zwq
+ * @LastEditors: DY
- * @LastEditTime: 2023-08-03 15:22:53
+ * @LastEditTime: 2023-10-13 10:27:00
  * @Description:
 -->
 <template>
@@ -50,30 +50,25 @@ import {
 const tableProps = [
 	{
 		prop: 'code',
-		label: '产品编码',
+		label: '产品编码'
-		align: 'center',
 	},
 	{
 		prop: 'name',
-		label: '产品名称',
+		label: '产品名称'
-		align: 'center',
 	},
 	{
 		prop: 'specifications',
-		label: '规格',
+		label: '规格'
-		align: 'center',
 	},
 	{
 		prop: 'unitDictValue',
 		label: '单位',
-		align: 'center',
 		subcomponent: unitDict,
 	},
 	{
 		prop: 'createTime',
 		label: '创建时间',
-		align: 'center',
+		filter: parseTime
-		filter: parseTime,
 	},
 ];
 
@@ -127,14 +122,14 @@ export default {
 					name: 'search',
 					color: 'primary',
 				},
-				{
+				// {
-					type: 'separate',
+				// 	type: 'separate',
-				},
+				// },
-				{
+				// {
-					type: 'button',
+				// 	type: 'button',
-					btnName: '重置',
+				// 	btnName: '重置',
-					name: 'reset',
+				// 	name: 'reset',
-				},
+				// },
 				{
 					type: 'separate',
 				},
@@ -167,7 +162,7 @@ export default {
 			switch (val.btnName) {
 				case 'search':
 					this.listQuery.pageNo = 1;
-					this.listQuery.pageSize = 10;
+					this.listQuery.pageSize = 20;
 					this.listQuery.name = val.name;
 					this.listQuery.code = val.code;
 					this.getDataList();